Initial commit

This commit is contained in:
2025-03-07 19:22:02 +01:00
commit 4a98255d83
55743 changed files with 5280367 additions and 0 deletions
+28
View File
@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
Checkbox: function() {
return _index.Checkbox;
},
checkboxClassNames: function() {
return _index.checkboxClassNames;
},
renderCheckbox_unstable: function() {
return _index.renderCheckbox_unstable;
},
useCheckboxStyles_unstable: function() {
return _index.useCheckboxStyles_unstable;
},
useCheckbox_unstable: function() {
return _index.useCheckbox_unstable;
}
});
const _index = require("./components/Checkbox/index");
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/Checkbox.ts"],"sourcesContent":["export type { CheckboxOnChangeData, CheckboxProps, CheckboxSlots, CheckboxState } from './components/Checkbox/index';\nexport {\n Checkbox,\n checkboxClassNames,\n renderCheckbox_unstable,\n useCheckboxStyles_unstable,\n useCheckbox_unstable,\n} from './components/Checkbox/index';\n"],"names":["Checkbox","checkboxClassNames","renderCheckbox_unstable","useCheckboxStyles_unstable","useCheckbox_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEEA,QAAQ;eAARA,eAAQ;;IACRC,kBAAkB;eAAlBA,yBAAkB;;IAClBC,uBAAuB;eAAvBA,8BAAuB;;IACvBC,0BAA0B;eAA1BA,iCAA0B;;IAC1BC,oBAAoB;eAApBA,2BAAoB;;;uBACf"}
@@ -0,0 +1,23 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "Checkbox", {
enumerable: true,
get: function() {
return Checkbox;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useCheckbox = require("./useCheckbox");
const _renderCheckbox = require("./renderCheckbox");
const _useCheckboxStylesstyles = require("./useCheckboxStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const Checkbox = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useCheckbox.useCheckbox_unstable)(props, ref);
(0, _useCheckboxStylesstyles.useCheckboxStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useCheckboxStyles_unstable')(state);
return (0, _renderCheckbox.renderCheckbox_unstable)(state);
});
Checkbox.displayName = 'Checkbox';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCheckbox_unstable } from './useCheckbox';\nimport { renderCheckbox_unstable } from './renderCheckbox';\nimport { useCheckboxStyles_unstable } from './useCheckboxStyles.styles';\nimport type { CheckboxProps } from './Checkbox.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Checkboxes give people a way to select one or more items from a group,\n * or switch between two mutually exclusive options (checked or unchecked).\n */\nexport const Checkbox: ForwardRefComponent<CheckboxProps> = React.forwardRef((props, ref) => {\n const state = useCheckbox_unstable(props, ref);\n\n useCheckboxStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCheckboxStyles_unstable')(state);\n\n return renderCheckbox_unstable(state);\n});\n\nCheckbox.displayName = 'Checkbox';\n"],"names":["Checkbox","React","forwardRef","props","ref","state","useCheckbox_unstable","useCheckboxStyles_unstable","useCustomStyleHook_unstable","renderCheckbox_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;6BACc;gCACG;yCACG;qCAGC;AAMrC,MAAMA,WAAAA,WAAAA,GAA+CC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,QAAQC,IAAAA,iCAAAA,EAAqBH,OAAOC;IAE1CG,IAAAA,mDAAAA,EAA2BF;IAE3BG,IAAAA,gDAAAA,EAA4B,8BAA8BH;IAE1D,OAAOI,IAAAA,uCAAAA,EAAwBJ;AACjC;AAEAL,SAASU,WAAW,GAAG"}
@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Checkbox/Checkbox.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type CheckboxSlots = {\n /**\n * The root element of the Checkbox.\n *\n * The root slot receives the `className` and `style` specified directly on the `<Checkbox>`.\n * All other native props will be applied to the primary slot: `input`\n */\n root: NonNullable<Slot<'span'>>;\n\n /**\n * The Checkbox's label.\n */\n label?: Slot<typeof Label>;\n\n /**\n * Hidden input that handles the checkbox's functionality.\n *\n * This is the PRIMARY slot: all native properties specified directly on `<Checkbox>` will be applied to this slot,\n * except `className` and `style`, which remain on the root slot.\n */\n input: NonNullable<Slot<'input'>>;\n\n /**\n * The checkbox, with the checkmark icon as its child when checked.\n */\n // FIXME: this should be 'span' by default, because you cannot have a 'div' inside of a 'span'\n // but changing the signature would be a breaking change\n // TODO: change the default value to 'span' in the next major\n indicator: Slot<'div', 'span'>;\n};\n\n/**\n * Checkbox Props\n */\nexport type CheckboxProps = Omit<\n ComponentProps<Partial<CheckboxSlots>, 'input'>,\n 'checked' | 'defaultChecked' | 'onChange' | 'size'\n> & {\n /**\n * The controlled value for the checkbox.\n *\n * @default false\n */\n checked?: 'mixed' | boolean;\n\n /**\n * Checkboxes don't support children. To add a label, use the `label` prop.\n */\n children?: never;\n\n /**\n * Whether the checkbox should be rendered as checked by default.\n */\n defaultChecked?: 'mixed' | boolean;\n\n /**\n * The position of the label relative to the checkbox indicator.\n *\n * @default after\n */\n labelPosition?: 'before' | 'after';\n\n /**\n * Callback to be called when the checked state value changes.\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: CheckboxOnChangeData) => void;\n\n /**\n * The shape of the checkbox indicator.\n *\n * The `circular` variant is only recommended to be used in a tasks-style UI (checklist),\n * since it otherwise could be confused for a `RadioItem`.\n *\n * @default square\n */\n shape?: 'square' | 'circular';\n\n /**\n * The size of the checkbox indicator.\n *\n * @default medium\n */\n size?: 'medium' | 'large';\n};\n\n/**\n * Data for the onChange event for checkbox.\n */\nexport interface CheckboxOnChangeData {\n checked: 'mixed' | boolean;\n}\n\n/**\n * State used in rendering Checkbox\n */\nexport type CheckboxState = ComponentState<CheckboxSlots> &\n Required<Pick<CheckboxProps, 'checked' | 'disabled' | 'labelPosition' | 'shape' | 'size'>>;\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
Checkbox: function() {
return _Checkbox.Checkbox;
},
checkboxClassNames: function() {
return _useCheckboxStylesstyles.checkboxClassNames;
},
renderCheckbox_unstable: function() {
return _renderCheckbox.renderCheckbox_unstable;
},
useCheckboxStyles_unstable: function() {
return _useCheckboxStylesstyles.useCheckboxStyles_unstable;
},
useCheckbox_unstable: function() {
return _useCheckbox.useCheckbox_unstable;
}
});
const _Checkbox = require("./Checkbox");
const _renderCheckbox = require("./renderCheckbox");
const _useCheckbox = require("./useCheckbox");
const _useCheckboxStylesstyles = require("./useCheckboxStyles.styles");
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Checkbox/index.ts"],"sourcesContent":["export { Checkbox } from './Checkbox';\nexport type { CheckboxOnChangeData, CheckboxProps, CheckboxSlots, CheckboxState } from './Checkbox.types';\nexport { renderCheckbox_unstable } from './renderCheckbox';\nexport { useCheckbox_unstable } from './useCheckbox';\nexport { checkboxClassNames, useCheckboxStyles_unstable } from './useCheckboxStyles.styles';\n"],"names":["Checkbox","checkboxClassNames","renderCheckbox_unstable","useCheckboxStyles_unstable","useCheckbox_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,QAAQ;eAARA,kBAAQ;;IAIRC,kBAAkB;eAAlBA,2CAAkB;;IAFlBC,uBAAuB;eAAvBA,uCAAuB;;IAEHC,0BAA0B;eAA1BA,mDAA0B;;IAD9CC,oBAAoB;eAApBA,iCAAoB;;;0BAHJ;gCAEe;6BACH;yCAC0B"}
@@ -0,0 +1,23 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderCheckbox_unstable", {
enumerable: true,
get: function() {
return renderCheckbox_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const renderCheckbox_unstable = (state)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
children: [
/*#__PURE__*/ (0, _jsxruntime.jsx)(state.input, {}),
state.labelPosition === 'before' && state.label && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.label, {}),
state.indicator && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.indicator, {}),
state.labelPosition === 'after' && state.label && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.label, {})
]
});
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Checkbox/renderCheckbox.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { CheckboxState, CheckboxSlots } from './Checkbox.types';\n\nexport const renderCheckbox_unstable = (state: CheckboxState) => {\n assertSlots<CheckboxSlots>(state);\n\n return (\n <state.root>\n <state.input />\n {state.labelPosition === 'before' && state.label && <state.label />}\n {state.indicator && <state.indicator />}\n {state.labelPosition === 'after' && state.label && <state.label />}\n </state.root>\n );\n};\n"],"names":["renderCheckbox_unstable","state","assertSlots","_jsxs","root","_jsx","input","labelPosition","label","indicator"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAMaA;;;eAAAA;;;4BALb;gCAE4B;AAGrB,MAAMA,0BAA0B,CAACC;IACtCC,IAAAA,2BAAAA,EAA2BD;IAE3B,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACF,MAAMG,IAAI,EAAA;;0BACTC,IAAAA,eAAA,EAACJ,MAAMK,KAAK,EAAA,CAAA;YACXL,MAAMM,aAAa,KAAK,YAAYN,MAAMO,KAAK,IAAA,WAAA,GAAIH,IAAAA,eAAA,EAACJ,MAAMO,KAAK,EAAA,CAAA;YAC/DP,MAAMQ,SAAS,IAAA,WAAA,GAAIJ,IAAAA,eAAA,EAACJ,MAAMQ,SAAS,EAAA,CAAA;YACnCR,MAAMM,aAAa,KAAK,WAAWN,MAAMO,KAAK,IAAA,WAAA,GAAIH,IAAAA,eAAA,EAACJ,MAAMO,KAAK,EAAA,CAAA;;;AAGrE"}
@@ -0,0 +1,122 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCheckbox_unstable", {
enumerable: true,
get: function() {
return useCheckbox_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactfield = require("@fluentui/react-field");
const _reactutilities = require("@fluentui/react-utilities");
const _reacticons = require("@fluentui/react-icons");
const _reactlabel = require("@fluentui/react-label");
const _reacttabster = require("@fluentui/react-tabster");
const useCheckbox_unstable = (props, ref)=>{
'use no memo';
// Merge props from surrounding <Field>, if any
props = (0, _reactfield.useFieldControlProps_unstable)(props, {
supportsLabelFor: true,
supportsRequired: true
});
const { disabled = false, required, shape = 'square', size = 'medium', labelPosition = 'after', onChange } = props;
const [checked, setChecked] = (0, _reactutilities.useControllableState)({
defaultState: props.defaultChecked,
state: props.checked,
initialState: false
});
const nativeProps = (0, _reactutilities.getPartitionedNativeProps)({
props,
primarySlotTagName: 'input',
excludedPropNames: [
'checked',
'defaultChecked',
'size',
'onChange'
]
});
const mixed = checked === 'mixed';
const id = (0, _reactutilities.useId)('checkbox-', nativeProps.primary.id);
let checkmarkIcon;
if (mixed) {
if (shape === 'circular') {
checkmarkIcon = /*#__PURE__*/ _react.createElement(_reacticons.CircleFilled, null);
} else {
checkmarkIcon = size === 'large' ? /*#__PURE__*/ _react.createElement(_reacticons.Square16Filled, null) : /*#__PURE__*/ _react.createElement(_reacticons.Square12Filled, null);
}
} else if (checked) {
checkmarkIcon = size === 'large' ? /*#__PURE__*/ _react.createElement(_reacticons.Checkmark16Filled, null) : /*#__PURE__*/ _react.createElement(_reacticons.Checkmark12Filled, null);
}
const state = {
shape,
checked,
disabled,
size,
labelPosition,
components: {
root: 'span',
input: 'input',
indicator: 'div',
label: _reactlabel.Label
},
root: _reactutilities.slot.always(props.root, {
defaultProps: {
ref: (0, _reacttabster.useFocusWithin)(),
...nativeProps.root
},
elementType: 'span'
}),
input: _reactutilities.slot.always(props.input, {
defaultProps: {
type: 'checkbox',
id,
ref,
checked: checked === true,
...nativeProps.primary
},
elementType: 'input'
}),
label: _reactutilities.slot.optional(props.label, {
defaultProps: {
htmlFor: id,
disabled,
required,
size: 'medium'
},
elementType: _reactlabel.Label
}),
indicator: _reactutilities.slot.optional(props.indicator, {
renderByDefault: true,
defaultProps: {
'aria-hidden': true,
children: checkmarkIcon
},
elementType: 'div'
})
};
state.input.onChange = (0, _reactutilities.useEventCallback)((ev)=>{
const val = ev.currentTarget.indeterminate ? 'mixed' : ev.currentTarget.checked;
onChange === null || onChange === void 0 ? void 0 : onChange(ev, {
checked: val
});
setChecked(val);
});
// Create a ref object for the input element so we can use it to set the indeterminate prop.
// Use useMergedRefs, since the ref might be undefined or a function-ref (no .current)
const inputRef = (0, _reactutilities.useMergedRefs)(state.input.ref);
state.input.ref = inputRef;
// Set the <input> element's checked and indeterminate properties based on our tri-state property.
// Since indeterminate can only be set via javascript, it has to be done in a layout effect.
(0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
if (inputRef.current) {
inputRef.current.indeterminate = mixed;
}
}, [
inputRef,
mixed
]);
return state;
};
File diff suppressed because one or more lines are too long
@@ -0,0 +1,256 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
checkboxClassNames: function() {
return checkboxClassNames;
},
useCheckboxStyles_unstable: function() {
return useCheckboxStyles_unstable;
}
});
const _react = require("@griffel/react");
const checkboxClassNames = {
root: 'fui-Checkbox',
label: 'fui-Checkbox__label',
input: 'fui-Checkbox__input',
indicator: 'fui-Checkbox__indicator'
};
// CSS variables used internally in Checkbox's styles
const vars = {
indicatorColor: '--fui-Checkbox__indicator--color',
indicatorBorderColor: '--fui-Checkbox__indicator--borderColor',
indicatorBackgroundColor: '--fui-Checkbox__indicator--backgroundColor'
};
// The indicator size is used by the indicator and label styles
const indicatorSizeMedium = '16px';
const indicatorSizeLarge = '20px';
const useRootBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r1q22k1j", "r18ze4k2", {
r: [
".r1q22k1j{position:relative;display:inline-flex;cursor:pointer;vertical-align:middle;color:var(--colorNeutralForeground3);}",
".r1q22k1j:focus{outline-style:none;}",
".r1q22k1j:focus-visible{outline-style:none;}",
".r1q22k1j[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
".r1q22k1j[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
".r18ze4k2{position:relative;display:inline-flex;cursor:pointer;vertical-align:middle;color:var(--colorNeutralForeground3);}",
".r18ze4k2:focus{outline-style:none;}",
".r18ze4k2:focus-visible{outline-style:none;}",
".r18ze4k2[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
".r18ze4k2[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
],
s: [
"@media (forced-colors: active){.r1q22k1j[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
"@media (forced-colors: active){.r18ze4k2[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"
]
});
const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
unchecked: {
Bi91k9c: "f3p8bqa",
pv5h1i: "fium13f",
lj723h: "f1r2dosr",
Hnthvo: "f1729es6"
},
checked: {
sj55zd: "f19n0e5",
wkncrt: "f35ds98",
zxk7z7: "f12mnkne",
Hmsnfy: "fei9a8h",
e6czan: "fix56y3",
pv5h1i: "f1bcv2js",
qbydtz: "f7dr4go",
Hnthvo: "f1r5cpua"
},
mixed: {
sj55zd: "f19n0e5",
Hmsnfy: "f1l27tf0",
zxk7z7: "fcilktj",
pv5h1i: "f1lphd54",
Bunfa6h: "f1obkvq7",
Hnthvo: "f2gmbuh",
B15ykmv: "f1oy4fa1"
},
disabled: {
Bceei9c: "f158kwzp",
sj55zd: "f1s2aq7o",
Hmsnfy: "f1w7mfl5",
zxk7z7: "fcoafq6",
Bbusuzp: "f1dcs8yz",
mrqfp9: "fxb3eh3"
}
}, {
h: [
".f3p8bqa:hover{color:var(--colorNeutralForeground2);}",
".fium13f:hover{--fui-Checkbox__indicator--borderColor:var(--colorNeutralStrokeAccessibleHover);}",
".fix56y3:hover{--fui-Checkbox__indicator--backgroundColor:var(--colorCompoundBrandBackgroundHover);}",
".f1bcv2js:hover{--fui-Checkbox__indicator--borderColor:var(--colorCompoundBrandBackgroundHover);}",
".f1lphd54:hover{--fui-Checkbox__indicator--borderColor:var(--colorCompoundBrandStrokeHover);}",
".f1obkvq7:hover{--fui-Checkbox__indicator--color:var(--colorCompoundBrandForeground1Hover);}"
],
a: [
".f1r2dosr:active{color:var(--colorNeutralForeground1);}",
".f1729es6:active{--fui-Checkbox__indicator--borderColor:var(--colorNeutralStrokeAccessiblePressed);}",
".f7dr4go:active{--fui-Checkbox__indicator--backgroundColor:var(--colorCompoundBrandBackgroundPressed);}",
".f1r5cpua:active{--fui-Checkbox__indicator--borderColor:var(--colorCompoundBrandBackgroundPressed);}",
".f2gmbuh:active{--fui-Checkbox__indicator--borderColor:var(--colorCompoundBrandStrokePressed);}",
".f1oy4fa1:active{--fui-Checkbox__indicator--color:var(--colorCompoundBrandForeground1Pressed);}"
],
d: [
".f19n0e5{color:var(--colorNeutralForeground1);}",
".f35ds98{--fui-Checkbox__indicator--backgroundColor:var(--colorCompoundBrandBackground);}",
".f12mnkne{--fui-Checkbox__indicator--color:var(--colorNeutralForegroundInverted);}",
".fei9a8h{--fui-Checkbox__indicator--borderColor:var(--colorCompoundBrandBackground);}",
".f1l27tf0{--fui-Checkbox__indicator--borderColor:var(--colorCompoundBrandStroke);}",
".fcilktj{--fui-Checkbox__indicator--color:var(--colorCompoundBrandForeground1);}",
".f158kwzp{cursor:default;}",
".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}",
".f1w7mfl5{--fui-Checkbox__indicator--borderColor:var(--colorNeutralStrokeDisabled);}",
".fcoafq6{--fui-Checkbox__indicator--color:var(--colorNeutralForegroundDisabled);}"
],
m: [
[
"@media (forced-colors: active){.f1dcs8yz{color:GrayText;}}",
{
m: "(forced-colors: active)"
}
],
[
"@media (forced-colors: active){.fxb3eh3{--fui-Checkbox__indicator--color:GrayText;}}",
{
m: "(forced-colors: active)"
}
]
]
});
const useInputBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("ruo9svu", null, [
".ruo9svu{box-sizing:border-box;cursor:inherit;height:100%;margin:0;opacity:0;position:absolute;top:0;width:calc(16px + 2 * var(--spacingHorizontalS));}"
]);
const useInputStyles = /*#__PURE__*/ (0, _react.__styles)({
before: {
j35jbq: [
"f1e31b4d",
"f1vgc2s3"
]
},
after: {
oyh7mz: [
"f1vgc2s3",
"f1e31b4d"
]
},
large: {
a9b677: "f1mq5jt6"
}
}, {
d: [
".f1e31b4d{right:0;}",
".f1vgc2s3{left:0;}",
".f1mq5jt6{width:calc(20px + 2 * var(--spacingHorizontalS));}"
]
});
const useIndicatorBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("rl7ci6d", null, [
".rl7ci6d{align-self:flex-start;box-sizing:border-box;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--fui-Checkbox__indicator--color);background-color:var(--fui-Checkbox__indicator--backgroundColor);border-color:var(--fui-Checkbox__indicator--borderColor, var(--colorNeutralStrokeAccessible));border-style:solid;border-width:var(--strokeWidthThin);border-radius:var(--borderRadiusSmall);margin:var(--spacingVerticalS) var(--spacingHorizontalS);fill:currentColor;pointer-events:none;font-size:12px;height:16px;width:16px;}"
]);
const useIndicatorStyles = /*#__PURE__*/ (0, _react.__styles)({
large: {
Be2twd7: "f4ybsrx",
Bqenvij: "fjamq6b",
a9b677: "f64fuq3"
},
circular: {
Beyfa6y: 0,
Bbmb7ep: 0,
Btl43ni: 0,
B7oj6ja: 0,
Dimara: "f44lkw9"
}
}, {
d: [
".f4ybsrx{font-size:16px;}",
".fjamq6b{height:20px;}",
".f64fuq3{width:20px;}",
[
".f44lkw9{border-radius:var(--borderRadiusCircular);}",
{
p: -1
}
]
]
});
// Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.
const useLabelStyles = /*#__PURE__*/ (0, _react.__styles)({
base: {
qb2dma: "f7nlbp4",
sj55zd: "f1ym3bx4",
Bceei9c: "fpo1scq",
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f1f5q0n8"
},
before: {
z189sj: [
"f7x41pl",
"fruq291"
]
},
after: {
uwmqm3: [
"fruq291",
"f7x41pl"
]
},
medium: {
B6of3ja: "fjzwpt6",
jrapky: "fh6j2fo"
},
large: {
B6of3ja: "f1xlvstr",
jrapky: "f49ad5g"
}
}, {
d: [
".f7nlbp4{align-self:center;}",
".f1ym3bx4{color:inherit;}",
".fpo1scq{cursor:inherit;}",
[
".f1f5q0n8{padding:var(--spacingVerticalS) var(--spacingHorizontalS);}",
{
p: -1
}
],
".f7x41pl{padding-right:var(--spacingHorizontalXS);}",
".fruq291{padding-left:var(--spacingHorizontalXS);}",
".fjzwpt6{margin-top:calc((16px - var(--lineHeightBase300)) / 2);}",
".fh6j2fo{margin-bottom:calc((16px - var(--lineHeightBase300)) / 2);}",
".f1xlvstr{margin-top:calc((20px - var(--lineHeightBase300)) / 2);}",
".f49ad5g{margin-bottom:calc((20px - var(--lineHeightBase300)) / 2);}"
]
});
const useCheckboxStyles_unstable = (state)=>{
'use no memo';
const { checked, disabled, labelPosition, shape, size } = state;
const rootBaseClassName = useRootBaseClassName();
const rootStyles = useRootStyles();
state.root.className = (0, _react.mergeClasses)(checkboxClassNames.root, rootBaseClassName, disabled ? rootStyles.disabled : checked === 'mixed' ? rootStyles.mixed : checked ? rootStyles.checked : rootStyles.unchecked, state.root.className);
const inputBaseClassName = useInputBaseClassName();
const inputStyles = useInputStyles();
state.input.className = (0, _react.mergeClasses)(checkboxClassNames.input, inputBaseClassName, size === 'large' && inputStyles.large, inputStyles[labelPosition], state.input.className);
const indicatorBaseClassName = useIndicatorBaseClassName();
const indicatorStyles = useIndicatorStyles();
if (state.indicator) {
state.indicator.className = (0, _react.mergeClasses)(checkboxClassNames.indicator, indicatorBaseClassName, size === 'large' && indicatorStyles.large, shape === 'circular' && indicatorStyles.circular, state.indicator.className);
}
const labelStyles = useLabelStyles();
if (state.label) {
state.label.className = (0, _react.mergeClasses)(checkboxClassNames.label, labelStyles.base, labelStyles[size], labelStyles[labelPosition], state.label.className);
}
return state;
};
File diff suppressed because one or more lines are too long
+28
View File
@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
Checkbox: function() {
return _Checkbox.Checkbox;
},
checkboxClassNames: function() {
return _Checkbox.checkboxClassNames;
},
renderCheckbox_unstable: function() {
return _Checkbox.renderCheckbox_unstable;
},
useCheckboxStyles_unstable: function() {
return _Checkbox.useCheckboxStyles_unstable;
},
useCheckbox_unstable: function() {
return _Checkbox.useCheckbox_unstable;
}
});
const _Checkbox = require("./Checkbox");
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Checkbox,\n checkboxClassNames,\n renderCheckbox_unstable,\n useCheckboxStyles_unstable,\n useCheckbox_unstable,\n} from './Checkbox';\nexport type { CheckboxOnChangeData, CheckboxProps, CheckboxSlots, CheckboxState } from './Checkbox';\n"],"names":["Checkbox","checkboxClassNames","renderCheckbox_unstable","useCheckboxStyles_unstable","useCheckbox_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IACEA,QAAQ;eAARA,kBAAQ;;IACRC,kBAAkB;eAAlBA,4BAAkB;;IAClBC,uBAAuB;eAAvBA,iCAAuB;;IACvBC,0BAA0B;eAA1BA,oCAA0B;;IAC1BC,oBAAoB;eAApBA,8BAAoB;;;0BACf"}