@bitrise/bitkit-v2 0.3.441-beta.2787 → 0.3.441-beta.2791
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/BitkitSwitch/BitkitSwitch.d.ts +1 -1
- package/dist/components/BitkitSwitch/BitkitSwitch.js +13 -13
- package/dist/components/BitkitSwitch/BitkitSwitch.js.map +1 -1
- package/dist/components/BitkitSwitch/BitkitSwitch.types.d.ts +4 -4
- package/dist/theme/slot-recipes/SettingsCard.recipe.d.ts +2 -6
- package/dist/theme/slot-recipes/SettingsCard.recipe.js +2 -2
- package/dist/theme/slot-recipes/SettingsCard.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/index.d.ts +2 -6
- package/package.json +1 -1
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { BitkitSwitchProps } from './BitkitSwitch.types';
|
|
2
|
-
declare const BitkitSwitch: import('react').ForwardRefExoticComponent<BitkitSwitchProps & import('react').RefAttributes<
|
|
2
|
+
declare const BitkitSwitch: import('react').ForwardRefExoticComponent<BitkitSwitchProps & import('react').RefAttributes<HTMLLabelElement>>;
|
|
3
3
|
export default BitkitSwitch;
|
|
@@ -12,15 +12,15 @@ import { Skeleton } from "@chakra-ui/react/skeleton";
|
|
|
12
12
|
import { Switch } from "@chakra-ui/react/switch";
|
|
13
13
|
//#region lib/components/BitkitSwitch/BitkitSwitch.tsx
|
|
14
14
|
var BitkitSwitchDefault = forwardRef((props, ref) => {
|
|
15
|
-
const { hideLabel,
|
|
15
|
+
const { hideLabel, inputRef, label, size = "lg", state = "default", ...rest } = props;
|
|
16
16
|
return /* @__PURE__ */ jsxs(Switch.Root, {
|
|
17
|
-
ref
|
|
17
|
+
ref,
|
|
18
18
|
size,
|
|
19
19
|
readOnly: state === "readOnly",
|
|
20
20
|
disabled: state === "disabled" || state === "skeleton",
|
|
21
21
|
...rest,
|
|
22
22
|
children: [
|
|
23
|
-
/* @__PURE__ */ jsx(Switch.HiddenInput, { ref }),
|
|
23
|
+
/* @__PURE__ */ jsx(Switch.HiddenInput, { ref: inputRef }),
|
|
24
24
|
/* @__PURE__ */ jsx(BitkitSwitchReadOnly, {
|
|
25
25
|
state,
|
|
26
26
|
children: /* @__PURE__ */ jsx(Skeleton, {
|
|
@@ -42,10 +42,10 @@ var BitkitSwitchDefault = forwardRef((props, ref) => {
|
|
|
42
42
|
});
|
|
43
43
|
BitkitSwitchDefault.displayName = "BitkitSwitchDefault";
|
|
44
44
|
var BitkitSwitchDynamicText = forwardRef((props, ref) => {
|
|
45
|
-
const {
|
|
45
|
+
const { inputRef, label, optional, tooltip, helperText, valueText, size = "lg", state = "default", ...rest } = props;
|
|
46
46
|
const styles = useSlotRecipe({ key: "switch" })({ size });
|
|
47
47
|
return /* @__PURE__ */ jsxs(Switch.Root, {
|
|
48
|
-
ref
|
|
48
|
+
ref,
|
|
49
49
|
gap: "4",
|
|
50
50
|
size,
|
|
51
51
|
flexDirection: "column",
|
|
@@ -54,7 +54,7 @@ var BitkitSwitchDynamicText = forwardRef((props, ref) => {
|
|
|
54
54
|
disabled: state === "disabled" || state === "disabledInput" || state === "skeleton",
|
|
55
55
|
...rest,
|
|
56
56
|
children: [
|
|
57
|
-
/* @__PURE__ */ jsx(Switch.HiddenInput, { ref }),
|
|
57
|
+
/* @__PURE__ */ jsx(Switch.HiddenInput, { ref: inputRef }),
|
|
58
58
|
/* @__PURE__ */ jsx(BitkitSwitchLabel, {
|
|
59
59
|
label,
|
|
60
60
|
state,
|
|
@@ -89,9 +89,9 @@ var BitkitSwitchDynamicText = forwardRef((props, ref) => {
|
|
|
89
89
|
});
|
|
90
90
|
BitkitSwitchDynamicText.displayName = "BitkitSwitchDynamicText";
|
|
91
91
|
var BitkitSwitchFixed = forwardRef((props, ref) => {
|
|
92
|
-
const { icon,
|
|
92
|
+
const { icon, inputRef, label, optional, tooltip, helperText, size = "lg", state = "default", ...rest } = props;
|
|
93
93
|
return /* @__PURE__ */ jsxs(Switch.Root, {
|
|
94
|
-
ref
|
|
94
|
+
ref,
|
|
95
95
|
gap: "24",
|
|
96
96
|
size,
|
|
97
97
|
width: "100%",
|
|
@@ -100,7 +100,7 @@ var BitkitSwitchFixed = forwardRef((props, ref) => {
|
|
|
100
100
|
disabled: state === "disabled" || state === "disabledInput" || state === "skeleton",
|
|
101
101
|
...rest,
|
|
102
102
|
children: [
|
|
103
|
-
/* @__PURE__ */ jsx(Switch.HiddenInput, { ref }),
|
|
103
|
+
/* @__PURE__ */ jsx(Switch.HiddenInput, { ref: inputRef }),
|
|
104
104
|
/* @__PURE__ */ jsxs(Box, {
|
|
105
105
|
display: "flex",
|
|
106
106
|
flex: "1",
|
|
@@ -135,10 +135,10 @@ var BitkitSwitchFixed = forwardRef((props, ref) => {
|
|
|
135
135
|
});
|
|
136
136
|
BitkitSwitchFixed.displayName = "BitkitSwitchFixed";
|
|
137
137
|
var BitkitSwitch = forwardRef((props, ref) => {
|
|
138
|
-
const { variant, hideLabel, icon,
|
|
138
|
+
const { variant, hideLabel, icon, inputRef, tooltip, optional, valueText, helperText, ...rest } = props;
|
|
139
139
|
if (variant === "dynamic-text") return /* @__PURE__ */ jsx(BitkitSwitchDynamicText, {
|
|
140
140
|
ref,
|
|
141
|
-
|
|
141
|
+
inputRef,
|
|
142
142
|
tooltip,
|
|
143
143
|
optional,
|
|
144
144
|
valueText,
|
|
@@ -148,7 +148,7 @@ var BitkitSwitch = forwardRef((props, ref) => {
|
|
|
148
148
|
if (variant === "fixed") return /* @__PURE__ */ jsx(BitkitSwitchFixed, {
|
|
149
149
|
ref,
|
|
150
150
|
icon,
|
|
151
|
-
|
|
151
|
+
inputRef,
|
|
152
152
|
tooltip,
|
|
153
153
|
optional,
|
|
154
154
|
helperText,
|
|
@@ -157,7 +157,7 @@ var BitkitSwitch = forwardRef((props, ref) => {
|
|
|
157
157
|
return /* @__PURE__ */ jsx(BitkitSwitchDefault, {
|
|
158
158
|
ref,
|
|
159
159
|
hideLabel,
|
|
160
|
-
|
|
160
|
+
inputRef,
|
|
161
161
|
...rest
|
|
162
162
|
});
|
|
163
163
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitSwitch.js","names":[],"sources":["../../../lib/components/BitkitSwitch/BitkitSwitch.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Switch } from '@chakra-ui/react/switch';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { IconCheck, IconCross } from '../../icons';\nimport type {\n BitkitSwitchAnyVariantProps,\n BitkitSwitchDefaultProps,\n BitkitSwitchDynamicTextProps,\n BitkitSwitchFixedProps,\n BitkitSwitchProps,\n} from './BitkitSwitch.types';\nimport BitkitSwitchHelperText from './components/BitkitSwitchHelperText';\nimport BitkitSwitchLabel from './components/BitkitSwitchLabel';\nimport BitkitSwitchReadOnly from './components/BitkitSwitchReadOnly';\nimport BitkitSwitchValueText from './components/BitkitSwitchValueText';\n\nconst BitkitSwitchDefault = forwardRef<
|
|
1
|
+
{"version":3,"file":"BitkitSwitch.js","names":[],"sources":["../../../lib/components/BitkitSwitch/BitkitSwitch.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Switch } from '@chakra-ui/react/switch';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { IconCheck, IconCross } from '../../icons';\nimport type {\n BitkitSwitchAnyVariantProps,\n BitkitSwitchDefaultProps,\n BitkitSwitchDynamicTextProps,\n BitkitSwitchFixedProps,\n BitkitSwitchProps,\n} from './BitkitSwitch.types';\nimport BitkitSwitchHelperText from './components/BitkitSwitchHelperText';\nimport BitkitSwitchLabel from './components/BitkitSwitchLabel';\nimport BitkitSwitchReadOnly from './components/BitkitSwitchReadOnly';\nimport BitkitSwitchValueText from './components/BitkitSwitchValueText';\n\nconst BitkitSwitchDefault = forwardRef<HTMLLabelElement, Omit<BitkitSwitchDefaultProps, 'variant'>>((props, ref) => {\n const { hideLabel, inputRef, label, size = 'lg', state = 'default', ...rest } = props;\n\n return (\n <Switch.Root\n ref={ref}\n size={size}\n readOnly={state === 'readOnly'}\n disabled={state === 'disabled' || state === 'skeleton'}\n {...rest}\n >\n <Switch.HiddenInput ref={inputRef} />\n <BitkitSwitchReadOnly state={state}>\n <Skeleton loading={state === 'skeleton'} borderRadius=\"12\" height={size === 'md' ? '16' : '24'}>\n <Switch.Control>\n <Switch.Thumb />\n <Switch.Indicator fallback={<IconCross size={size === 'md' ? '16' : '24'} />}>\n <IconCheck size={size === 'md' ? '16' : '24'} />\n </Switch.Indicator>\n </Switch.Control>\n </Skeleton>\n </BitkitSwitchReadOnly>\n {/* `srOnly` rather than a hidden label passed in by the consumer: it positions the element\n absolutely, so it leaves the flex flow and the root's gap no longer reserves space for it. */}\n {label && <Switch.Label srOnly={hideLabel}>{label}</Switch.Label>}\n </Switch.Root>\n );\n});\n\nBitkitSwitchDefault.displayName = 'BitkitSwitchDefault';\n\nconst BitkitSwitchDynamicText = forwardRef<HTMLLabelElement, Omit<BitkitSwitchDynamicTextProps, 'variant'>>(\n (props, ref) => {\n const {\n inputRef,\n label,\n optional,\n tooltip,\n helperText,\n valueText,\n size = 'lg',\n state = 'default',\n ...rest\n } = props;\n\n const recipe = useSlotRecipe({ key: 'switch' });\n const styles = recipe({ size });\n\n return (\n <Switch.Root\n ref={ref}\n gap=\"4\"\n size={size}\n flexDirection=\"column\"\n alignItems=\"flex-start\"\n readOnly={state === 'readOnly'}\n disabled={state === 'disabled' || state === 'disabledInput' || state === 'skeleton'}\n {...rest}\n >\n <Switch.HiddenInput ref={inputRef} />\n <BitkitSwitchLabel label={label} state={state} tooltip={tooltip} optional={optional} />\n <Box css={styles.root}>\n <BitkitSwitchReadOnly state={state}>\n <Skeleton loading={state === 'skeleton'} borderRadius=\"12\" height={size === 'md' ? '16' : '24'}>\n <Switch.Control>\n <Switch.Thumb />\n <Switch.Indicator fallback={<IconCross size={size === 'md' ? '16' : '24'} />}>\n <IconCheck size={size === 'md' ? '16' : '24'} />\n </Switch.Indicator>\n </Switch.Control>\n </Skeleton>\n </BitkitSwitchReadOnly>\n <BitkitSwitchValueText size={size} state={state} valueText={valueText} />\n </Box>\n <BitkitSwitchHelperText state={state} helperText={helperText} />\n </Switch.Root>\n );\n },\n);\n\nBitkitSwitchDynamicText.displayName = 'BitkitSwitchDynamicText';\n\nconst BitkitSwitchFixed = forwardRef<HTMLLabelElement, Omit<BitkitSwitchFixedProps, 'variant'>>((props, ref) => {\n const { icon, inputRef, label, optional, tooltip, helperText, size = 'lg', state = 'default', ...rest } = props;\n\n return (\n <Switch.Root\n ref={ref}\n gap=\"24\"\n size={size}\n width=\"100%\"\n display=\"flex\"\n readOnly={state === 'readOnly'}\n disabled={state === 'disabled' || state === 'disabledInput' || state === 'skeleton'}\n {...rest}\n >\n <Switch.HiddenInput ref={inputRef} />\n <Box display=\"flex\" flex=\"1\" flexDirection=\"column\" gap=\"4\" minWidth=\"0\">\n <BitkitSwitchLabel icon={icon} label={label} state={state} tooltip={tooltip} optional={optional} />\n <BitkitSwitchHelperText state={state} helperText={helperText} />\n </Box>\n <BitkitSwitchReadOnly state={state}>\n <Skeleton loading={state === 'skeleton'} borderRadius=\"12\" height={size === 'md' ? '16' : '24'}>\n <Switch.Control>\n <Switch.Thumb />\n <Switch.Indicator fallback={<IconCross size={size === 'md' ? '16' : '24'} />}>\n <IconCheck size={size === 'md' ? '16' : '24'} />\n </Switch.Indicator>\n </Switch.Control>\n </Skeleton>\n </BitkitSwitchReadOnly>\n </Switch.Root>\n );\n});\n\nBitkitSwitchFixed.displayName = 'BitkitSwitchFixed';\n\nconst BitkitSwitch = forwardRef<HTMLLabelElement, BitkitSwitchProps>((props, ref) => {\n // At runtime (e.g. a shared Storybook meta) sibling-variant props may still flow in, so split them\n // off here and forward only what the chosen variant consumes — otherwise they leak to the DOM.\n const { variant, hideLabel, icon, inputRef, tooltip, optional, valueText, helperText, ...rest } =\n props as BitkitSwitchAnyVariantProps;\n\n if (variant === 'dynamic-text') {\n return (\n <BitkitSwitchDynamicText\n ref={ref}\n inputRef={inputRef}\n tooltip={tooltip}\n optional={optional}\n valueText={valueText}\n helperText={helperText}\n {...rest}\n />\n );\n }\n\n if (variant === 'fixed') {\n return (\n <BitkitSwitchFixed\n ref={ref}\n icon={icon}\n inputRef={inputRef}\n tooltip={tooltip}\n optional={optional}\n helperText={helperText as ReactNode}\n {...rest}\n />\n );\n }\n\n return (\n <BitkitSwitchDefault\n ref={ref}\n hideLabel={hideLabel}\n inputRef={inputRef}\n {...(rest as Omit<BitkitSwitchDefaultProps, 'variant'>)}\n />\n );\n});\n\nBitkitSwitch.displayName = 'BitkitSwitch';\n\nexport default BitkitSwitch;\n"],"mappings":"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"}
|
|
@@ -6,12 +6,12 @@ export type OnOff = {
|
|
|
6
6
|
off: ReactNode;
|
|
7
7
|
};
|
|
8
8
|
/**
|
|
9
|
-
* Props every switch variant shares. `ref` goes to the
|
|
10
|
-
*
|
|
9
|
+
* Props every switch variant shares. `ref` goes to the switch root — the visible element — so the
|
|
10
|
+
* switch can anchor a tooltip or popover without a wrapper around it.
|
|
11
11
|
*/
|
|
12
12
|
interface BitkitSwitchSharedProps extends Omit<SwitchRootProps, 'disabled' | 'label' | 'readOnly'> {
|
|
13
|
-
/** Ref to the
|
|
14
|
-
|
|
13
|
+
/** Ref to the hidden `input`, for form libraries that register it. */
|
|
14
|
+
inputRef?: Ref<HTMLInputElement>;
|
|
15
15
|
}
|
|
16
16
|
export interface BitkitSwitchDefaultProps extends BitkitSwitchSharedProps {
|
|
17
17
|
variant?: 'default';
|
|
@@ -15,7 +15,7 @@ declare const settingsCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefin
|
|
|
15
15
|
};
|
|
16
16
|
'in-progress': {
|
|
17
17
|
statusIcon: {
|
|
18
|
-
color: "
|
|
18
|
+
color: "color/yellow/bold";
|
|
19
19
|
};
|
|
20
20
|
};
|
|
21
21
|
neutral: {
|
|
@@ -28,11 +28,7 @@ declare const settingsCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefin
|
|
|
28
28
|
color: "icon/positive";
|
|
29
29
|
};
|
|
30
30
|
};
|
|
31
|
-
warning: {
|
|
32
|
-
statusIcon: {
|
|
33
|
-
color: "icon/warning";
|
|
34
|
-
};
|
|
35
|
-
};
|
|
31
|
+
warning: {};
|
|
36
32
|
};
|
|
37
33
|
}>;
|
|
38
34
|
export default settingsCardSlotRecipe;
|
|
@@ -81,10 +81,10 @@ var settingsCardSlotRecipe = defineSlotRecipe({
|
|
|
81
81
|
statusLabel: { color: "text/negative" }
|
|
82
82
|
},
|
|
83
83
|
failed: { statusIcon: { color: "icon/negative" } },
|
|
84
|
-
"in-progress": { statusIcon: { color: "
|
|
84
|
+
"in-progress": { statusIcon: { color: "color/yellow/bold" } },
|
|
85
85
|
neutral: { statusIcon: { color: "icon/secondary" } },
|
|
86
86
|
success: { statusIcon: { color: "icon/positive" } },
|
|
87
|
-
warning: {
|
|
87
|
+
warning: {}
|
|
88
88
|
} },
|
|
89
89
|
defaultVariants: { status: "neutral" }
|
|
90
90
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SettingsCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/SettingsCard.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst settingsCardSlotRecipe = defineSlotRecipe({\n className: 'settings-card',\n slots: [\n 'root',\n 'content',\n 'contentBody',\n 'contentActions',\n 'footer',\n 'status',\n 'statusIcon',\n 'statusLabel',\n 'statusMessage',\n 'statusMessageText',\n 'statusHelperText',\n ],\n base: {\n root: {\n maxWidth: rem(800),\n },\n content: {\n alignItems: 'center',\n display: 'flex',\n gap: '12',\n },\n contentBody: {\n flex: 1,\n minWidth: 0,\n },\n contentActions: {\n alignItems: 'center',\n display: 'flex',\n flexShrink: 0,\n gap: '8',\n },\n footer: {\n alignItems: 'center',\n display: 'flex',\n gap: '12',\n justifyContent: 'space-between',\n // The switch footer is drawn on a wider gap than the status one.\n '&:has([data-scope=\"switch\"][data-part=\"root\"])': {\n gap: '16',\n },\n // A status message wraps to more than one line: the design gives that footer a deeper bottom\n // padding than the single-line one the Card recipe sets, and keeps the trailing action level\n // with the status row rather than centred against the whole block.\n '&:has([data-slot=\"status-message\"])': {\n alignItems: 'flex-start',\n paddingBlockEnd: '12',\n },\n },\n status: {\n // Not `center`: the icon lines up with the first line of the label, which is where it still\n // belongs once the label wraps.\n alignItems: 'flex-start',\n display: 'flex',\n gap: '4',\n minWidth: 0,\n paddingBlock: '2',\n },\n statusIcon: {\n flexShrink: 0,\n marginBlockStart: '2',\n },\n statusLabel: {\n color: 'text/body',\n textStyle: 'body/md/regular',\n wordBreak: 'break-word',\n },\n statusMessage: {\n minWidth: 0,\n },\n statusMessageText: {\n color: 'text/body',\n paddingInlineStart: '20',\n textStyle: 'body/sm/regular',\n wordBreak: 'break-word',\n },\n statusHelperText: {\n color: 'text/helper',\n marginBlockStart: '8',\n paddingInlineStart: '20',\n textStyle: 'body/sm/regular',\n wordBreak: 'break-word',\n },\n },\n variants: {\n status: {\n error: {\n statusIcon: { color: 'icon/negative' },\n statusLabel: { color: 'text/negative' },\n },\n failed: {\n statusIcon: { color: 'icon/negative' },\n },\n 'in-progress': {\n statusIcon: { color: '
|
|
1
|
+
{"version":3,"file":"SettingsCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/SettingsCard.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst settingsCardSlotRecipe = defineSlotRecipe({\n className: 'settings-card',\n slots: [\n 'root',\n 'content',\n 'contentBody',\n 'contentActions',\n 'footer',\n 'status',\n 'statusIcon',\n 'statusLabel',\n 'statusMessage',\n 'statusMessageText',\n 'statusHelperText',\n ],\n base: {\n root: {\n maxWidth: rem(800),\n },\n content: {\n alignItems: 'center',\n display: 'flex',\n gap: '12',\n },\n contentBody: {\n flex: 1,\n minWidth: 0,\n },\n contentActions: {\n alignItems: 'center',\n display: 'flex',\n flexShrink: 0,\n gap: '8',\n },\n footer: {\n alignItems: 'center',\n display: 'flex',\n gap: '12',\n justifyContent: 'space-between',\n // The switch footer is drawn on a wider gap than the status one.\n '&:has([data-scope=\"switch\"][data-part=\"root\"])': {\n gap: '16',\n },\n // A status message wraps to more than one line: the design gives that footer a deeper bottom\n // padding than the single-line one the Card recipe sets, and keeps the trailing action level\n // with the status row rather than centred against the whole block.\n '&:has([data-slot=\"status-message\"])': {\n alignItems: 'flex-start',\n paddingBlockEnd: '12',\n },\n },\n status: {\n // Not `center`: the icon lines up with the first line of the label, which is where it still\n // belongs once the label wraps.\n alignItems: 'flex-start',\n display: 'flex',\n gap: '4',\n minWidth: 0,\n paddingBlock: '2',\n },\n statusIcon: {\n flexShrink: 0,\n marginBlockStart: '2',\n },\n statusLabel: {\n color: 'text/body',\n textStyle: 'body/md/regular',\n wordBreak: 'break-word',\n },\n statusMessage: {\n minWidth: 0,\n },\n statusMessageText: {\n color: 'text/body',\n paddingInlineStart: '20',\n textStyle: 'body/sm/regular',\n wordBreak: 'break-word',\n },\n statusHelperText: {\n color: 'text/helper',\n marginBlockStart: '8',\n paddingInlineStart: '20',\n textStyle: 'body/sm/regular',\n wordBreak: 'break-word',\n },\n },\n variants: {\n status: {\n error: {\n statusIcon: { color: 'icon/negative' },\n statusLabel: { color: 'text/negative' },\n },\n failed: {\n statusIcon: { color: 'icon/negative' },\n },\n 'in-progress': {\n statusIcon: { color: 'color/yellow/bold' },\n },\n neutral: {\n statusIcon: { color: 'icon/secondary' },\n },\n success: {\n statusIcon: { color: 'icon/positive' },\n },\n // No colour on purpose: IconWarningYellow carries its own fixed colours, and CLAUDE.md says a\n // fixed-colour icon is never recoloured. Setting one here would only reach an icon swapped in\n // via `icon`, and would put a second yellow on the same status.\n warning: {},\n },\n },\n defaultVariants: {\n status: 'neutral',\n },\n});\n\nexport default settingsCardSlotRecipe;\n"],"mappings":";;;AAIA,IAAM,yBAAyB,iBAAiB;CAC9C,WAAW;CACX,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,MAAM;EACJ,MAAM,EACJ,UAAU,IAAI,GAAG,EACnB;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,KAAK;EACP;EACA,aAAa;GACX,MAAM;GACN,UAAU;EACZ;EACA,gBAAgB;GACd,YAAY;GACZ,SAAS;GACT,YAAY;GACZ,KAAK;EACP;EACA,QAAQ;GACN,YAAY;GACZ,SAAS;GACT,KAAK;GACL,gBAAgB;GAEhB,sDAAkD,EAChD,KAAK,KACP;GAIA,yCAAuC;IACrC,YAAY;IACZ,iBAAiB;GACnB;EACF;EACA,QAAQ;GAGN,YAAY;GACZ,SAAS;GACT,KAAK;GACL,UAAU;GACV,cAAc;EAChB;EACA,YAAY;GACV,YAAY;GACZ,kBAAkB;EACpB;EACA,aAAa;GACX,OAAO;GACP,WAAW;GACX,WAAW;EACb;EACA,eAAe,EACb,UAAU,EACZ;EACA,mBAAmB;GACjB,OAAO;GACP,oBAAoB;GACpB,WAAW;GACX,WAAW;EACb;EACA,kBAAkB;GAChB,OAAO;GACP,kBAAkB;GAClB,oBAAoB;GACpB,WAAW;GACX,WAAW;EACb;CACF;CACA,UAAU,EACR,QAAQ;EACN,OAAO;GACL,YAAY,EAAE,OAAO,gBAAgB;GACrC,aAAa,EAAE,OAAO,gBAAgB;EACxC;EACA,QAAQ,EACN,YAAY,EAAE,OAAO,gBAAgB,EACvC;EACA,eAAe,EACb,YAAY,EAAE,OAAO,oBAAoB,EAC3C;EACA,SAAS,EACP,YAAY,EAAE,OAAO,iBAAiB,EACxC;EACA,SAAS,EACP,YAAY,EAAE,OAAO,gBAAgB,EACvC;EAIA,SAAS,CAAC;CACZ,EACF;CACA,iBAAiB,EACf,QAAQ,UACV;AACF,CAAC"}
|
|
@@ -2292,7 +2292,7 @@ declare const slotRecipes: {
|
|
|
2292
2292
|
};
|
|
2293
2293
|
'in-progress': {
|
|
2294
2294
|
statusIcon: {
|
|
2295
|
-
color: "
|
|
2295
|
+
color: "color/yellow/bold";
|
|
2296
2296
|
};
|
|
2297
2297
|
};
|
|
2298
2298
|
neutral: {
|
|
@@ -2305,11 +2305,7 @@ declare const slotRecipes: {
|
|
|
2305
2305
|
color: "icon/positive";
|
|
2306
2306
|
};
|
|
2307
2307
|
};
|
|
2308
|
-
warning: {
|
|
2309
|
-
statusIcon: {
|
|
2310
|
-
color: "icon/warning";
|
|
2311
|
-
};
|
|
2312
|
-
};
|
|
2308
|
+
warning: {};
|
|
2313
2309
|
};
|
|
2314
2310
|
}>;
|
|
2315
2311
|
splitButton: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "trigger" | "action", {
|