@bitrise/bitkit-v2 0.3.352 → 0.3.353
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/BitkitCheckbox/BitkitCheckbox.js +2 -1
- package/dist/components/BitkitCheckbox/BitkitCheckbox.js.map +1 -1
- package/dist/components/BitkitRadio/BitkitRadio.js +2 -1
- package/dist/components/BitkitRadio/BitkitRadio.js.map +1 -1
- package/dist/theme/slot-recipes/Checkbox.recipe.js +6 -6
- package/dist/theme/slot-recipes/Checkbox.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/RadioGroup.recipe.js +4 -4
- package/dist/theme/slot-recipes/RadioGroup.recipe.js.map +1 -1
- package/package.json +1 -1
|
@@ -12,7 +12,8 @@ var BitkitCheckbox = forwardRef((props, ref) => {
|
|
|
12
12
|
const hasHelperText = !isEmptyNode(helperText);
|
|
13
13
|
const hasLabel = !isEmptyNode(labelText) || hasHelperText;
|
|
14
14
|
return /* @__PURE__ */ jsxs(Checkbox.Root, {
|
|
15
|
-
|
|
15
|
+
cursor: state === "skeleton" ? "default" : void 0,
|
|
16
|
+
disabled: state === "disabled" || state === "skeleton",
|
|
16
17
|
readOnly: state === "readOnly",
|
|
17
18
|
...rest,
|
|
18
19
|
children: [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitCheckbox.js","names":[],"sources":["../../../lib/components/BitkitCheckbox/BitkitCheckbox.tsx"],"sourcesContent":["import { Checkbox } from '@chakra-ui/react/checkbox';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { type DataAttr } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type InputHTMLAttributes, type ReactNode } from 'react';\n\nimport { IconCheck, IconMinus } from '../../icons';\n\ntype BitkitCheckboxBaseProps = {\n /** Props forwarded to the underlying `<input>` (e.g. `data-testid`). */\n inputProps?: InputHTMLAttributes<HTMLInputElement> & DataAttr;\n state?: 'disabled' | 'readOnly' | 'skeleton';\n} & Omit<Checkbox.RootProps, 'disabled' | 'readOnly'>;\n\n/**\n * A checkbox has to end up with an accessible name, and it takes that name from its label. So either\n * pass a visible `labelText`, or — for a checkbox in a layout with no room for one, like a table\n * select-all header — an `aria-label`, which is applied to the hidden input instead of being\n * rendered.\n */\nexport type BitkitCheckboxProps = BitkitCheckboxBaseProps &\n (\n | {\n helperText?: ReactNode;\n labelText: NonNullable<ReactNode>;\n }\n | { 'aria-label': string; helperText?: never; labelText?: null }\n );\n\nconst isEmptyNode = (node: ReactNode) => node == null || node === '' || typeof node === 'boolean';\n\nconst BitkitCheckbox = forwardRef<HTMLInputElement, BitkitCheckboxProps>((props, ref) => {\n const { 'aria-label': ariaLabel, helperText, inputProps, labelText, state, ...rest } = props;\n const hasHelperText = !isEmptyNode(helperText);\n const hasLabel = !isEmptyNode(labelText) || hasHelperText;\n\n return (\n <Checkbox.Root disabled={state === 'disabled'}
|
|
1
|
+
{"version":3,"file":"BitkitCheckbox.js","names":[],"sources":["../../../lib/components/BitkitCheckbox/BitkitCheckbox.tsx"],"sourcesContent":["import { Checkbox } from '@chakra-ui/react/checkbox';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { type DataAttr } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type InputHTMLAttributes, type ReactNode } from 'react';\n\nimport { IconCheck, IconMinus } from '../../icons';\n\ntype BitkitCheckboxBaseProps = {\n /** Props forwarded to the underlying `<input>` (e.g. `data-testid`). */\n inputProps?: InputHTMLAttributes<HTMLInputElement> & DataAttr;\n state?: 'disabled' | 'readOnly' | 'skeleton';\n} & Omit<Checkbox.RootProps, 'disabled' | 'readOnly'>;\n\n/**\n * A checkbox has to end up with an accessible name, and it takes that name from its label. So either\n * pass a visible `labelText`, or — for a checkbox in a layout with no room for one, like a table\n * select-all header — an `aria-label`, which is applied to the hidden input instead of being\n * rendered.\n */\nexport type BitkitCheckboxProps = BitkitCheckboxBaseProps &\n (\n | {\n helperText?: ReactNode;\n labelText: NonNullable<ReactNode>;\n }\n | { 'aria-label': string; helperText?: never; labelText?: null }\n );\n\nconst isEmptyNode = (node: ReactNode) => node == null || node === '' || typeof node === 'boolean';\n\nconst BitkitCheckbox = forwardRef<HTMLInputElement, BitkitCheckboxProps>((props, ref) => {\n const { 'aria-label': ariaLabel, helperText, inputProps, labelText, state, ...rest } = props;\n const hasHelperText = !isEmptyNode(helperText);\n const hasLabel = !isEmptyNode(labelText) || hasHelperText;\n\n // Skeleton has to set disabled to be inert: the Skeleton wrapper's own pointer-events: none never\n // stopped a click, it only moved the target to the <label>, which activates the control. The cursor\n // style prop then keeps the arrow plain — style props land outside @layer recipes, where the\n // recipe's _disabled: { cursor: 'not-allowed' } sits.\n return (\n <Checkbox.Root\n cursor={state === 'skeleton' ? 'default' : undefined}\n disabled={state === 'disabled' || state === 'skeleton'}\n readOnly={state === 'readOnly'}\n {...rest}\n >\n <Checkbox.HiddenInput aria-label={ariaLabel} ref={ref} {...inputProps} />\n <Skeleton loading={state === 'skeleton'}>\n <Checkbox.Control>{rest.checked === 'indeterminate' ? <IconMinus /> : <IconCheck />}</Checkbox.Control>\n </Skeleton>\n {hasLabel && (\n <Skeleton loading={state === 'skeleton'}>\n <Checkbox.Label as=\"div\">\n {labelText}\n {hasHelperText && (\n <Text color=\"text/helper\" textStyle=\"comp/input/helperText\">\n {helperText}\n </Text>\n )}\n </Checkbox.Label>\n </Skeleton>\n )}\n </Checkbox.Root>\n );\n});\n\nBitkitCheckbox.displayName = 'BitkitCheckbox';\n\nexport default BitkitCheckbox;\n"],"mappings":";;;;;;;;AA6BA,IAAM,eAAe,SAAoB,QAAQ,QAAQ,SAAS,MAAM,OAAO,SAAS;AAExF,IAAM,iBAAiB,YAAmD,OAAO,QAAQ;CACvF,MAAM,EAAE,cAAc,WAAW,YAAY,YAAY,WAAW,OAAO,GAAG,SAAS;CACvF,MAAM,gBAAgB,CAAC,YAAY,UAAU;CAC7C,MAAM,WAAW,CAAC,YAAY,SAAS,KAAK;CAM5C,OACE,qBAAC,SAAS,MAAV;EACE,QAAQ,UAAU,aAAa,YAAY,KAAA;EAC3C,UAAU,UAAU,cAAc,UAAU;EAC5C,UAAU,UAAU;EACpB,GAAI;EAJN,UAAA;GAME,oBAAC,SAAS,aAAV;IAAsB,cAAY;IAAgB;IAAK,GAAI;GAAa,CAAA;GACxE,oBAAC,UAAD;IAAU,SAAS,UAAU;IAC3B,UAAA,oBAAC,SAAS,SAAV,EAAA,UAAmB,KAAK,YAAY,kBAAkB,oBAAC,WAAD,CAAY,CAAA,IAAI,oBAAC,WAAD,CAAY,CAAA,EAAoB,CAAA;GAC9F,CAAA;GACT,YACC,oBAAC,UAAD;IAAU,SAAS,UAAU;IAC3B,UAAA,qBAAC,SAAS,OAAV;KAAgB,IAAG;KAAnB,UAAA,CACG,WACA,iBACC,oBAAC,MAAD;MAAM,OAAM;MAAc,WAAU;MACjC,UAAA;KACG,CAAA,CAEM;;GACR,CAAA;EAEC;;AAEnB,CAAC;AAED,eAAe,cAAc"}
|
|
@@ -9,7 +9,8 @@ var BitkitRadio = forwardRef((props, ref) => {
|
|
|
9
9
|
const { badge, helperText, inputProps, labelText, state, ...rest } = props;
|
|
10
10
|
const styles = useRadioGroupStyles();
|
|
11
11
|
return /* @__PURE__ */ jsxs(RadioGroup.Item, {
|
|
12
|
-
|
|
12
|
+
cursor: state === "skeleton" ? "default" : void 0,
|
|
13
|
+
disabled: state === "disabled" || state === "skeleton",
|
|
13
14
|
...rest,
|
|
14
15
|
children: [
|
|
15
16
|
/* @__PURE__ */ jsx(RadioGroup.ItemHiddenInput, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitRadio.js","names":[],"sources":["../../../lib/components/BitkitRadio/BitkitRadio.tsx"],"sourcesContent":["import { RadioGroup, useRadioGroupStyles } from '@chakra-ui/react/radio-group';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { type DataAttr } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type InputHTMLAttributes, type ReactNode } from 'react';\n\nimport BitkitBadge from '../BitkitBadge/BitkitBadge';\n\n/**\n * Passthrough attributes for the radio `<input>`. The RadioGroup machine owns the behavioral / state\n * attributes (`checked`, `value`, `name`, `type`, `disabled`, `onChange`, …), so they're excluded —\n * setting them here would let the input drift out of sync with its `RadioGroup.Item`. Keep it to\n * things like `data-testid`.\n */\ntype RadioInputProps = Omit<\n InputHTMLAttributes<HTMLInputElement>,\n 'checked' | 'defaultChecked' | 'defaultValue' | 'disabled' | 'name' | 'onChange' | 'type' | 'value'\n> &\n DataAttr;\n\nexport type BitkitRadioProps = {\n badge?: 'off' | 'on';\n helperText?: ReactNode;\n inputProps?: RadioInputProps;\n labelText: ReactNode;\n state?: 'disabled' | 'skeleton';\n} & Omit<RadioGroup.ItemProps, 'disabled'>;\n\nconst BitkitRadio = forwardRef<HTMLInputElement, BitkitRadioProps>((props, ref) => {\n const { badge, helperText, inputProps, labelText, state, ...rest } = props;\n const styles = useRadioGroupStyles();\n\n return (\n <RadioGroup.Item disabled={state === 'disabled'}
|
|
1
|
+
{"version":3,"file":"BitkitRadio.js","names":[],"sources":["../../../lib/components/BitkitRadio/BitkitRadio.tsx"],"sourcesContent":["import { RadioGroup, useRadioGroupStyles } from '@chakra-ui/react/radio-group';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { type DataAttr } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type InputHTMLAttributes, type ReactNode } from 'react';\n\nimport BitkitBadge from '../BitkitBadge/BitkitBadge';\n\n/**\n * Passthrough attributes for the radio `<input>`. The RadioGroup machine owns the behavioral / state\n * attributes (`checked`, `value`, `name`, `type`, `disabled`, `onChange`, …), so they're excluded —\n * setting them here would let the input drift out of sync with its `RadioGroup.Item`. Keep it to\n * things like `data-testid`.\n */\ntype RadioInputProps = Omit<\n InputHTMLAttributes<HTMLInputElement>,\n 'checked' | 'defaultChecked' | 'defaultValue' | 'disabled' | 'name' | 'onChange' | 'type' | 'value'\n> &\n DataAttr;\n\nexport type BitkitRadioProps = {\n badge?: 'off' | 'on';\n helperText?: ReactNode;\n inputProps?: RadioInputProps;\n labelText: ReactNode;\n state?: 'disabled' | 'skeleton';\n} & Omit<RadioGroup.ItemProps, 'disabled'>;\n\nconst BitkitRadio = forwardRef<HTMLInputElement, BitkitRadioProps>((props, ref) => {\n const { badge, helperText, inputProps, labelText, state, ...rest } = props;\n const styles = useRadioGroupStyles();\n\n // Skeleton has to set disabled to be inert: the Skeleton wrapper's own pointer-events: none never\n // stopped a click, it only moved the target to the <label>, which activates the control. The cursor\n // style prop then keeps the arrow plain — style props land outside @layer recipes, where the\n // recipe's _disabled: { cursor: 'not-allowed' } sits.\n return (\n <RadioGroup.Item\n cursor={state === 'skeleton' ? 'default' : undefined}\n disabled={state === 'disabled' || state === 'skeleton'}\n {...rest}\n >\n <RadioGroup.ItemHiddenInput ref={ref} {...inputProps} />\n <Skeleton borderRadius=\"50%\" loading={state === 'skeleton'}>\n <RadioGroup.ItemIndicator />\n </Skeleton>\n {!!badge && (\n <Skeleton loading={state === 'skeleton'}>\n <BitkitBadge colorVariant={badge === 'on' ? 'green' : 'neutral'} css={styles.badge}>\n {badge}\n </BitkitBadge>\n </Skeleton>\n )}\n <Skeleton loading={state === 'skeleton'}>\n <RadioGroup.ItemText as=\"div\">\n {labelText}\n {!!helperText && (\n <Text color={state === 'disabled' ? 'text/disabled' : 'text/helper'} textStyle=\"comp/input/helperText\">\n {helperText}\n </Text>\n )}\n </RadioGroup.ItemText>\n </Skeleton>\n </RadioGroup.Item>\n );\n});\n\nBitkitRadio.displayName = 'BitkitRadio';\n\nexport default BitkitRadio;\n"],"mappings":";;;;;;;AA4BA,IAAM,cAAc,YAAgD,OAAO,QAAQ;CACjF,MAAM,EAAE,OAAO,YAAY,YAAY,WAAW,OAAO,GAAG,SAAS;CACrE,MAAM,SAAS,oBAAoB;CAMnC,OACE,qBAAC,WAAW,MAAZ;EACE,QAAQ,UAAU,aAAa,YAAY,KAAA;EAC3C,UAAU,UAAU,cAAc,UAAU;EAC5C,GAAI;EAHN,UAAA;GAKE,oBAAC,WAAW,iBAAZ;IAAiC;IAAK,GAAI;GAAa,CAAA;GACvD,oBAAC,UAAD;IAAU,cAAa;IAAM,SAAS,UAAU;IAC9C,UAAA,oBAAC,WAAW,eAAZ,CAA2B,CAAA;GACnB,CAAA;GACT,CAAC,CAAC,SACD,oBAAC,UAAD;IAAU,SAAS,UAAU;IAC3B,UAAA,oBAAC,aAAD;KAAa,cAAc,UAAU,OAAO,UAAU;KAAW,KAAK,OAAO;KAC1E,UAAA;IACU,CAAA;GACL,CAAA;GAEZ,oBAAC,UAAD;IAAU,SAAS,UAAU;IAC3B,UAAA,qBAAC,WAAW,UAAZ;KAAqB,IAAG;KAAxB,UAAA,CACG,WACA,CAAC,CAAC,cACD,oBAAC,MAAD;MAAM,OAAO,UAAU,aAAa,kBAAkB;MAAe,WAAU;MAC5E,UAAA;KACG,CAAA,CAEW;;GACb,CAAA;EACK;;AAErB,CAAC;AAED,YAAY,cAAc"}
|
|
@@ -9,7 +9,10 @@ var checkboxSlotRecipe = defineSlotRecipe({
|
|
|
9
9
|
display: "inline-flex",
|
|
10
10
|
alignItems: "flex-start",
|
|
11
11
|
gap: "8",
|
|
12
|
-
width: "fit-content"
|
|
12
|
+
width: "fit-content",
|
|
13
|
+
cursor: "pointer",
|
|
14
|
+
_disabled: { cursor: "not-allowed" },
|
|
15
|
+
_readOnly: { cursor: "default" }
|
|
13
16
|
},
|
|
14
17
|
control: {
|
|
15
18
|
position: "relative",
|
|
@@ -18,7 +21,6 @@ var checkboxSlotRecipe = defineSlotRecipe({
|
|
|
18
21
|
border: "1px solid",
|
|
19
22
|
borderColor: "border/regular",
|
|
20
23
|
boxShadow: "inset/field",
|
|
21
|
-
cursor: "pointer",
|
|
22
24
|
focusVisibleRing: "outside",
|
|
23
25
|
"& > svg": {
|
|
24
26
|
position: "absolute",
|
|
@@ -59,14 +61,12 @@ var checkboxSlotRecipe = defineSlotRecipe({
|
|
|
59
61
|
_disabled: {
|
|
60
62
|
backgroundColor: "background/disabled",
|
|
61
63
|
borderColor: "border/disabled",
|
|
62
|
-
boxShadow: "none"
|
|
63
|
-
cursor: "not-allowed"
|
|
64
|
+
boxShadow: "none"
|
|
64
65
|
},
|
|
65
66
|
_readOnly: {
|
|
66
67
|
backgroundColor: "background/disabled",
|
|
67
68
|
borderColor: "border/regular !important",
|
|
68
|
-
boxShadow: "none"
|
|
69
|
-
cursor: "default"
|
|
69
|
+
boxShadow: "none"
|
|
70
70
|
}
|
|
71
71
|
},
|
|
72
72
|
label: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Checkbox.recipe.ts"],"sourcesContent":["import { checkboxAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst checkboxSlotRecipe = defineSlotRecipe({\n className: 'checkbox',\n slots: checkboxAnatomy.keys(),\n base: {\n root: {\n display: 'inline-flex',\n alignItems: 'flex-start',\n gap: '8',\n width: 'fit-content',\n },\n control: {\n position: 'relative',\n borderRadius: '4',\n backgroundColor: 'background/primary',\n border: '1px solid',\n borderColor: 'border/regular',\n boxShadow: 'inset/field',\n
|
|
1
|
+
{"version":3,"file":"Checkbox.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Checkbox.recipe.ts"],"sourcesContent":["import { checkboxAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst checkboxSlotRecipe = defineSlotRecipe({\n className: 'checkbox',\n slots: checkboxAnatomy.keys(),\n base: {\n root: {\n display: 'inline-flex',\n alignItems: 'flex-start',\n gap: '8',\n width: 'fit-content',\n cursor: 'pointer',\n _disabled: {\n cursor: 'not-allowed',\n },\n _readOnly: {\n cursor: 'default',\n },\n },\n control: {\n position: 'relative',\n borderRadius: '4',\n backgroundColor: 'background/primary',\n border: '1px solid',\n borderColor: 'border/regular',\n boxShadow: 'inset/field',\n focusVisibleRing: 'outside',\n '& > svg': {\n position: 'absolute',\n left: '-1px',\n visibility: 'hidden',\n },\n _checked: {\n backgroundColor: 'input/checkbox/selection',\n borderColor: 'input/checkbox/selection !important',\n boxShadow: 'none',\n '& > svg': {\n top: 0,\n color: 'icon/on-color',\n visibility: 'visible',\n },\n _disabled: {\n backgroundColor: 'input/checkbox/selection-disabled',\n borderColor: 'input/checkbox/selection-disabled !important',\n },\n _readOnly: {\n '& > svg': {\n color: 'icon/on-disabled',\n },\n },\n },\n _hover: {\n borderColor: 'border/hover',\n },\n _indeterminate: {\n backgroundColor: 'input/checkbox/selection',\n borderColor: 'input/checkbox/selection !important',\n boxShadow: 'none',\n '& > svg': {\n top: '-1px',\n color: 'icon/on-color',\n visibility: 'visible',\n },\n _disabled: {\n backgroundColor: 'input/checkbox/selection-disabled',\n borderColor: 'input/checkbox/selection-disabled !important',\n },\n _readOnly: {\n '& > svg': {\n color: 'icon/on-disabled',\n },\n },\n },\n _disabled: {\n backgroundColor: 'background/disabled',\n borderColor: 'border/disabled',\n boxShadow: 'none',\n },\n _readOnly: {\n backgroundColor: 'background/disabled',\n borderColor: 'border/regular !important',\n boxShadow: 'none',\n },\n },\n label: {\n userSelect: 'none',\n color: 'input/text/inputValue',\n _disabled: {\n color: 'text/disabled',\n },\n },\n },\n variants: {\n size: {\n md: {\n control: {\n width: '20',\n height: '20',\n '& > svg': {\n width: '20',\n height: '20',\n },\n },\n label: {\n textStyle: 'body/md/regular',\n },\n },\n lg: {\n control: {\n width: '24',\n height: '24',\n '& > svg': {\n width: '24',\n height: '24',\n },\n },\n label: {\n textStyle: 'body/lg/regular',\n },\n },\n },\n },\n defaultVariants: {\n size: 'lg',\n },\n});\n\nexport default checkboxSlotRecipe;\n"],"mappings":";;;AAGA,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAAO,gBAAgB,KAAK;CAC5B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,KAAK;GACL,OAAO;GACP,QAAQ;GACR,WAAW,EACT,QAAQ,cACV;GACA,WAAW,EACT,QAAQ,UACV;EACF;EACA,SAAS;GACP,UAAU;GACV,cAAc;GACd,iBAAiB;GACjB,QAAQ;GACR,aAAa;GACb,WAAW;GACX,kBAAkB;GAClB,WAAW;IACT,UAAU;IACV,MAAM;IACN,YAAY;GACd;GACA,UAAU;IACR,iBAAiB;IACjB,aAAa;IACb,WAAW;IACX,WAAW;KACT,KAAK;KACL,OAAO;KACP,YAAY;IACd;IACA,WAAW;KACT,iBAAiB;KACjB,aAAa;IACf;IACA,WAAW,EACT,WAAW,EACT,OAAO,mBACT,EACF;GACF;GACA,QAAQ,EACN,aAAa,eACf;GACA,gBAAgB;IACd,iBAAiB;IACjB,aAAa;IACb,WAAW;IACX,WAAW;KACT,KAAK;KACL,OAAO;KACP,YAAY;IACd;IACA,WAAW;KACT,iBAAiB;KACjB,aAAa;IACf;IACA,WAAW,EACT,WAAW,EACT,OAAO,mBACT,EACF;GACF;GACA,WAAW;IACT,iBAAiB;IACjB,aAAa;IACb,WAAW;GACb;GACA,WAAW;IACT,iBAAiB;IACjB,aAAa;IACb,WAAW;GACb;EACF;EACA,OAAO;GACL,YAAY;GACZ,OAAO;GACP,WAAW,EACT,OAAO,gBACT;EACF;CACF;CACA,UAAU,EACR,MAAM;EACJ,IAAI;GACF,SAAS;IACP,OAAO;IACP,QAAQ;IACR,WAAW;KACT,OAAO;KACP,QAAQ;IACV;GACF;GACA,OAAO,EACL,WAAW,kBACb;EACF;EACA,IAAI;GACF,SAAS;IACP,OAAO;IACP,QAAQ;IACR,WAAW;KACT,OAAO;KACP,QAAQ;IACV;GACF;GACA,OAAO,EACL,WAAW,kBACb;EACF;CACF,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}
|
|
@@ -11,7 +11,10 @@ var radioGroupSlotRecipe = defineSlotRecipe({
|
|
|
11
11
|
display: "inline-flex",
|
|
12
12
|
gap: "8",
|
|
13
13
|
alignItems: "flex-start",
|
|
14
|
-
justifyContent: "center"
|
|
14
|
+
justifyContent: "center",
|
|
15
|
+
cursor: "pointer",
|
|
16
|
+
_disabled: { cursor: "not-allowed" },
|
|
17
|
+
_readOnly: { cursor: "default" }
|
|
15
18
|
},
|
|
16
19
|
itemControl: {
|
|
17
20
|
border: "1px solid",
|
|
@@ -19,7 +22,6 @@ var radioGroupSlotRecipe = defineSlotRecipe({
|
|
|
19
22
|
backgroundColor: "background/primary",
|
|
20
23
|
borderRadius: "50%",
|
|
21
24
|
boxShadow: "inset/field",
|
|
22
|
-
cursor: "pointer",
|
|
23
25
|
display: "flex",
|
|
24
26
|
alignItems: "center",
|
|
25
27
|
justifyContent: "center",
|
|
@@ -39,14 +41,12 @@ var radioGroupSlotRecipe = defineSlotRecipe({
|
|
|
39
41
|
backgroundColor: "background/disabled",
|
|
40
42
|
borderColor: "border/disabled",
|
|
41
43
|
boxShadow: "none",
|
|
42
|
-
cursor: "not-allowed",
|
|
43
44
|
"& > .dot": { backgroundColor: "icon/disabled" }
|
|
44
45
|
},
|
|
45
46
|
_readOnly: {
|
|
46
47
|
backgroundColor: "background/disabled",
|
|
47
48
|
borderColor: "border/disabled",
|
|
48
49
|
boxShadow: "none",
|
|
49
|
-
cursor: "default",
|
|
50
50
|
"& > .dot": { backgroundColor: "icon/on-disabled" }
|
|
51
51
|
}
|
|
52
52
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroup.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/RadioGroup.recipe.ts"],"sourcesContent":["import { radioGroupAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst radioGroupSlotRecipe = defineSlotRecipe({\n className: 'radio-group',\n slots: [...radioGroupAnatomy.keys(), 'badge'],\n base: {\n root: {\n display: 'flex',\n },\n item: {\n display: 'inline-flex',\n gap: '8',\n alignItems: 'flex-start',\n justifyContent: 'center',\n },\n itemControl: {\n border: '1px solid',\n borderColor: 'border/regular',\n backgroundColor: 'background/primary',\n borderRadius: '50%',\n boxShadow: 'inset/field',\n
|
|
1
|
+
{"version":3,"file":"RadioGroup.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/RadioGroup.recipe.ts"],"sourcesContent":["import { radioGroupAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst radioGroupSlotRecipe = defineSlotRecipe({\n className: 'radio-group',\n slots: [...radioGroupAnatomy.keys(), 'badge'],\n base: {\n root: {\n display: 'flex',\n },\n item: {\n display: 'inline-flex',\n gap: '8',\n alignItems: 'flex-start',\n justifyContent: 'center',\n cursor: 'pointer',\n _disabled: {\n cursor: 'not-allowed',\n },\n _readOnly: {\n cursor: 'default',\n },\n },\n itemControl: {\n border: '1px solid',\n borderColor: 'border/regular',\n backgroundColor: 'background/primary',\n borderRadius: '50%',\n boxShadow: 'inset/field',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n focusVisibleRing: 'outside',\n '& > .dot': {\n width: '12',\n height: '12',\n borderRadius: '50%',\n backgroundColor: 'icon/interactive',\n },\n _hover: {\n borderColor: 'border/hover',\n _disabled: {\n borderColor: 'border/disabled',\n },\n _readOnly: {\n borderColor: 'border/disabled',\n },\n },\n _disabled: {\n backgroundColor: 'background/disabled',\n borderColor: 'border/disabled',\n boxShadow: 'none',\n '& > .dot': {\n backgroundColor: 'icon/disabled',\n },\n },\n _readOnly: {\n backgroundColor: 'background/disabled',\n borderColor: 'border/disabled',\n boxShadow: 'none',\n '& > .dot': {\n backgroundColor: 'icon/on-disabled',\n },\n },\n },\n itemText: {\n color: 'input/text/inputValue',\n _disabled: {\n color: 'text/disabled',\n },\n },\n },\n variants: {\n orientation: {\n horizontal: {\n root: {\n flexDirection: 'row',\n gap: '24',\n },\n },\n vertical: {\n root: {\n alignItems: 'flex-start',\n flexDirection: 'column',\n gap: '12',\n },\n },\n },\n size: {\n md: {\n badge: {\n paddingBlock: '2',\n width: rem(36),\n },\n itemControl: {\n width: '20',\n height: '20',\n },\n itemText: {\n textStyle: 'body/md/regular',\n },\n },\n lg: {\n badge: {\n paddingBlock: '4',\n width: '40',\n },\n itemControl: {\n width: '24',\n height: '24',\n },\n itemText: {\n textStyle: 'body/lg/regular',\n },\n },\n },\n },\n defaultVariants: {\n orientation: 'horizontal',\n size: 'lg',\n },\n});\n\nexport default radioGroupSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,uBAAuB,iBAAiB;CAC5C,WAAW;CACX,OAAO,CAAC,GAAG,kBAAkB,KAAK,GAAG,OAAO;CAC5C,MAAM;EACJ,MAAM,EACJ,SAAS,OACX;EACA,MAAM;GACJ,SAAS;GACT,KAAK;GACL,YAAY;GACZ,gBAAgB;GAChB,QAAQ;GACR,WAAW,EACT,QAAQ,cACV;GACA,WAAW,EACT,QAAQ,UACV;EACF;EACA,aAAa;GACX,QAAQ;GACR,aAAa;GACb,iBAAiB;GACjB,cAAc;GACd,WAAW;GACX,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,kBAAkB;GAClB,YAAY;IACV,OAAO;IACP,QAAQ;IACR,cAAc;IACd,iBAAiB;GACnB;GACA,QAAQ;IACN,aAAa;IACb,WAAW,EACT,aAAa,kBACf;IACA,WAAW,EACT,aAAa,kBACf;GACF;GACA,WAAW;IACT,iBAAiB;IACjB,aAAa;IACb,WAAW;IACX,YAAY,EACV,iBAAiB,gBACnB;GACF;GACA,WAAW;IACT,iBAAiB;IACjB,aAAa;IACb,WAAW;IACX,YAAY,EACV,iBAAiB,mBACnB;GACF;EACF;EACA,UAAU;GACR,OAAO;GACP,WAAW,EACT,OAAO,gBACT;EACF;CACF;CACA,UAAU;EACR,aAAa;GACX,YAAY,EACV,MAAM;IACJ,eAAe;IACf,KAAK;GACP,EACF;GACA,UAAU,EACR,MAAM;IACJ,YAAY;IACZ,eAAe;IACf,KAAK;GACP,EACF;EACF;EACA,MAAM;GACJ,IAAI;IACF,OAAO;KACL,cAAc;KACd,OAAO,IAAI,EAAE;IACf;IACA,aAAa;KACX,OAAO;KACP,QAAQ;IACV;IACA,UAAU,EACR,WAAW,kBACb;GACF;GACA,IAAI;IACF,OAAO;KACL,cAAc;KACd,OAAO;IACT;IACA,aAAa;KACX,OAAO;KACP,QAAQ;IACV;IACA,UAAU,EACR,WAAW,kBACb;GACF;EACF;CACF;CACA,iBAAiB;EACf,aAAa;EACb,MAAM;CACR;AACF,CAAC"}
|