@workday/canvas-kit-preview-react 16.0.0-alpha.0470-next.0 → 16.0.0-alpha.0475-next.0

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.
Files changed (105) hide show
  1. package/dist/commonjs/color-picker/lib/ColorPicker.js +1 -1
  2. package/dist/commonjs/color-picker/lib/parts/ColorReset.js +1 -1
  3. package/dist/commonjs/color-picker/lib/parts/SwatchBook.js +1 -1
  4. package/dist/commonjs/divider/lib/Divider.js +1 -1
  5. package/dist/commonjs/index.d.ts +1 -0
  6. package/dist/commonjs/index.d.ts.map +1 -1
  7. package/dist/commonjs/index.js +1 -0
  8. package/dist/commonjs/loading-sparkles/lib/LoadingSparkles.js +2 -2
  9. package/dist/commonjs/multi-select/lib/MultiSelectInput.js +3 -3
  10. package/dist/commonjs/radio/lib/RadioGroup.js +3 -3
  11. package/dist/commonjs/radio/lib/RadioLabel.js +1 -1
  12. package/dist/commonjs/radio/lib/RadioText.js +3 -3
  13. package/dist/commonjs/radio/lib/StyledRadioButton.js +5 -5
  14. package/dist/commonjs/side-panel/lib/SidePanel.js +7 -7
  15. package/dist/commonjs/side-panel/lib/SidePanelToggleButton.js +11 -11
  16. package/dist/commonjs/status-indicator/lib/StatusIndicator.js +14 -14
  17. package/dist/commonjs/status-indicator/lib/StatusIndicatorLabel.js +1 -1
  18. package/dist/commonjs/switch/lib/SwitchBackground.js +1 -1
  19. package/dist/commonjs/switch/lib/SwitchCircle.js +2 -2
  20. package/dist/commonjs/switch/lib/SwitchContainer.js +1 -1
  21. package/dist/commonjs/switch/lib/SwitchIcon.js +2 -2
  22. package/dist/commonjs/switch/lib/SwitchInput.js +3 -3
  23. package/dist/commonjs/tabs/index.d.ts +7 -0
  24. package/dist/commonjs/tabs/index.d.ts.map +1 -0
  25. package/dist/commonjs/tabs/index.js +22 -0
  26. package/dist/commonjs/tabs/lib/Tabs.d.ts +9555 -0
  27. package/dist/commonjs/tabs/lib/Tabs.d.ts.map +1 -0
  28. package/dist/commonjs/tabs/lib/Tabs.js +127 -0
  29. package/dist/commonjs/tabs/lib/TabsItem.d.ts +719 -0
  30. package/dist/commonjs/tabs/lib/TabsItem.d.ts.map +1 -0
  31. package/dist/commonjs/tabs/lib/TabsItem.js +50 -0
  32. package/dist/commonjs/tabs/lib/TabsList.d.ts +998 -0
  33. package/dist/commonjs/tabs/lib/TabsList.d.ts.map +1 -0
  34. package/dist/commonjs/tabs/lib/TabsList.js +121 -0
  35. package/dist/commonjs/tabs/lib/TabsOverflowButton.d.ts +650 -0
  36. package/dist/commonjs/tabs/lib/TabsOverflowButton.d.ts.map +1 -0
  37. package/dist/commonjs/tabs/lib/TabsOverflowButton.js +28 -0
  38. package/dist/commonjs/tabs/lib/TabsPanel.d.ts +654 -0
  39. package/dist/commonjs/tabs/lib/TabsPanel.d.ts.map +1 -0
  40. package/dist/commonjs/tabs/lib/TabsPanel.js +42 -0
  41. package/dist/commonjs/tabs/lib/TabsPanels.d.ts +320 -0
  42. package/dist/commonjs/tabs/lib/TabsPanels.d.ts.map +1 -0
  43. package/dist/commonjs/tabs/lib/TabsPanels.js +13 -0
  44. package/dist/commonjs/tabs/lib/useTabsModel.d.ts +5924 -0
  45. package/dist/commonjs/tabs/lib/useTabsModel.d.ts.map +1 -0
  46. package/dist/commonjs/tabs/lib/useTabsModel.js +128 -0
  47. package/dist/commonjs/version/lib/version.js +1 -1
  48. package/dist/es6/color-picker/lib/ColorPicker.js +1 -1
  49. package/dist/es6/color-picker/lib/parts/ColorReset.js +1 -1
  50. package/dist/es6/color-picker/lib/parts/SwatchBook.js +1 -1
  51. package/dist/es6/divider/lib/Divider.js +1 -1
  52. package/dist/es6/index.d.ts +1 -0
  53. package/dist/es6/index.d.ts.map +1 -1
  54. package/dist/es6/index.js +1 -0
  55. package/dist/es6/loading-sparkles/lib/LoadingSparkles.js +2 -2
  56. package/dist/es6/multi-select/lib/MultiSelectInput.js +3 -3
  57. package/dist/es6/radio/lib/RadioGroup.js +3 -3
  58. package/dist/es6/radio/lib/RadioLabel.js +1 -1
  59. package/dist/es6/radio/lib/RadioText.js +3 -3
  60. package/dist/es6/radio/lib/StyledRadioButton.js +5 -5
  61. package/dist/es6/side-panel/lib/SidePanel.js +7 -7
  62. package/dist/es6/side-panel/lib/SidePanelToggleButton.js +11 -11
  63. package/dist/es6/status-indicator/lib/StatusIndicator.js +14 -14
  64. package/dist/es6/status-indicator/lib/StatusIndicatorLabel.js +1 -1
  65. package/dist/es6/switch/lib/SwitchBackground.js +1 -1
  66. package/dist/es6/switch/lib/SwitchCircle.js +2 -2
  67. package/dist/es6/switch/lib/SwitchContainer.js +1 -1
  68. package/dist/es6/switch/lib/SwitchIcon.js +2 -2
  69. package/dist/es6/switch/lib/SwitchInput.js +3 -3
  70. package/dist/es6/tabs/index.d.ts +7 -0
  71. package/dist/es6/tabs/index.d.ts.map +1 -0
  72. package/dist/es6/tabs/index.js +6 -0
  73. package/dist/es6/tabs/lib/Tabs.d.ts +9555 -0
  74. package/dist/es6/tabs/lib/Tabs.d.ts.map +1 -0
  75. package/dist/es6/tabs/lib/Tabs.js +124 -0
  76. package/dist/es6/tabs/lib/TabsItem.d.ts +719 -0
  77. package/dist/es6/tabs/lib/TabsItem.d.ts.map +1 -0
  78. package/dist/es6/tabs/lib/TabsItem.js +47 -0
  79. package/dist/es6/tabs/lib/TabsList.d.ts +998 -0
  80. package/dist/es6/tabs/lib/TabsList.d.ts.map +1 -0
  81. package/dist/es6/tabs/lib/TabsList.js +95 -0
  82. package/dist/es6/tabs/lib/TabsOverflowButton.d.ts +650 -0
  83. package/dist/es6/tabs/lib/TabsOverflowButton.d.ts.map +1 -0
  84. package/dist/es6/tabs/lib/TabsOverflowButton.js +25 -0
  85. package/dist/es6/tabs/lib/TabsPanel.d.ts +654 -0
  86. package/dist/es6/tabs/lib/TabsPanel.d.ts.map +1 -0
  87. package/dist/es6/tabs/lib/TabsPanel.js +36 -0
  88. package/dist/es6/tabs/lib/TabsPanels.d.ts +320 -0
  89. package/dist/es6/tabs/lib/TabsPanels.d.ts.map +1 -0
  90. package/dist/es6/tabs/lib/TabsPanels.js +10 -0
  91. package/dist/es6/tabs/lib/useTabsModel.d.ts +5924 -0
  92. package/dist/es6/tabs/lib/useTabsModel.d.ts.map +1 -0
  93. package/dist/es6/tabs/lib/useTabsModel.js +122 -0
  94. package/dist/es6/version/lib/version.js +1 -1
  95. package/index.ts +1 -0
  96. package/package.json +4 -4
  97. package/tabs/index.ts +7 -0
  98. package/tabs/lib/Tabs.tsx +135 -0
  99. package/tabs/lib/TabsItem.tsx +274 -0
  100. package/tabs/lib/TabsList.tsx +181 -0
  101. package/tabs/lib/TabsOverflowButton.tsx +61 -0
  102. package/tabs/lib/TabsPanel.tsx +77 -0
  103. package/tabs/lib/TabsPanels.tsx +20 -0
  104. package/tabs/lib/useTabsModel.tsx +141 -0
  105. package/tabs/package.json +6 -0
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useTabsModel.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/useTabsModel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,YAAY;IAGrB;;;;;OAKG;;IAEH;;;OAGG;;IAEH;;;;OAIG;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAoCH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QARH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAcH;;WAEG;;;;;QAEH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IArFH;;;;;OAKG;;IAEH;;;OAGG;;IAEH;;;;OAIG;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAoCH;;OAEG;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;IAcH;;OAEG;;;;;IAEH;;OAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QA5BH;;WAEG;;QAEH;;;;WAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAcH;;WAEG;;;;;QAEH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BL,CAAC"}
@@ -0,0 +1,128 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.useTabsModel = void 0;
7
+ const react_1 = __importDefault(require("react"));
8
+ const collection_1 = require("@workday/canvas-kit-react/collection");
9
+ const common_1 = require("@workday/canvas-kit-react/common");
10
+ const menu_1 = require("@workday/canvas-kit-react/menu");
11
+ /**
12
+ * The TabsModel extends the [Collection
13
+ * System](/get-started/for-developers/guides/collection-api/). Tabs have tab items and
14
+ * panels. Tabs can be overflowed if there isn't enough room to render and will overflow to a
15
+ * {@link MenuModel} sub-model.
16
+ *
17
+ * ```tsx
18
+ * const model = useTabsModel({
19
+ * onSelect(data) {
20
+ * console.log('Selected Tab', data)
21
+ * }
22
+ * })
23
+ *
24
+ * <Tabs model={model}>{Tabs child components}</Tabs>
25
+ * ```
26
+ */
27
+ exports.useTabsModel = (0, common_1.createModelHook)({
28
+ defaultConfig: {
29
+ ...collection_1.useOverflowListModel.defaultConfig,
30
+ /**
31
+ * Optional id for the whole `Tabs` group. The `aria-controls` of the `Tab.Item` and `id` of the
32
+ * `Tab.Panel` will automatically be derived from this id. If not provided, a unique id will be
33
+ * created.
34
+ * @default useUniqueId()
35
+ */
36
+ id: '',
37
+ /**
38
+ * An initially selected tab. This value must match the `name` of the `Tab.Item` component. If
39
+ * not provided, the first tab will be selected.
40
+ */
41
+ initialTab: '',
42
+ /**
43
+ * The default Tabs sub-components only handle rendering of tabs in a horizontal orientation, but
44
+ * the sub-components could be replaced to handle vertical orientations.
45
+ * @default 'horizontal'
46
+ */
47
+ orientation: 'horizontal',
48
+ /**
49
+ * The variant of the Tabs.
50
+ * @default 'filled'
51
+ */
52
+ variant: 'filled',
53
+ menuConfig: {},
54
+ },
55
+ requiredConfig: collection_1.useOverflowListModel.requiredConfig,
56
+ contextOverride: collection_1.useOverflowListModel.Context,
57
+ })(config => {
58
+ var _a;
59
+ const initialSelectedRef = react_1.default.useRef(config.initialTab);
60
+ const getId = config.getId || collection_1.defaultGetId;
61
+ const modality = (0, common_1.useModalityType)();
62
+ const model = (0, collection_1.useOverflowListModel)(collection_1.useOverflowListModel.mergeConfig(config, {
63
+ shouldCalculateOverflow: modality !== 'touch',
64
+ orientation: config.orientation || 'horizontal',
65
+ onRegisterItem(data) {
66
+ if (!initialSelectedRef.current) {
67
+ initialSelectedRef.current = data.id;
68
+ events.select({ id: initialSelectedRef.current });
69
+ }
70
+ },
71
+ initialSelectedIds: config.initialTab
72
+ ? [config.initialTab]
73
+ : ((_a = config.items) === null || _a === void 0 ? void 0 : _a.length)
74
+ ? [getId(config.items[0])]
75
+ : [],
76
+ shouldVirtualize: false,
77
+ }));
78
+ const panels = (0, collection_1.useListModel)();
79
+ const state = {
80
+ ...model.state,
81
+ getId,
82
+ orientation: config.orientation || 'horizontal',
83
+ /**
84
+ * A list of panels. Uses `ListModel`
85
+ */
86
+ panels: panels.state.items,
87
+ /**
88
+ * A React.Ref of the current item index. A ref is used to allow for updating outside the normal
89
+ * React state cycle to ensure accurate index tracking as items are registered within the same
90
+ * state setting phase.
91
+ */
92
+ panelIndexRef: panels.state.indexRef,
93
+ variant: config.variant || 'filled',
94
+ };
95
+ const overflowItems = react_1.default.useMemo(() => config.items ? config.items.filter(item => state.hiddenIds.includes(getId(item))) : undefined,
96
+ // eslint-disable-next-line react-hooks/exhaustive-deps
97
+ [state.hiddenIds, config.items]);
98
+ const events = {
99
+ ...model.events,
100
+ /**
101
+ * This event registers panels with state.panels. Called when a panel is mounted.
102
+ */
103
+ registerPanel: panels.events.registerItem,
104
+ /**
105
+ * This event unregisters panels with state.panels. Called when a panel is unmounted.
106
+ */
107
+ unregisterPanel: panels.events.unregisterItem,
108
+ };
109
+ const menu = (0, menu_1.useMenuModel)(menu_1.useMenuModel.mergeConfig(config.menuConfig, {
110
+ id: `menu-${model.state.id}`,
111
+ items: overflowItems,
112
+ nonInteractiveIds: state.nonInteractiveIds.filter(key => !state.hiddenIds.includes(key)),
113
+ onSelect(data) {
114
+ menu.events.hide();
115
+ events.select(data);
116
+ },
117
+ onShow() {
118
+ // Always select the first item when the menu is opened
119
+ menu.events.goToFirst();
120
+ },
121
+ }));
122
+ return {
123
+ ...model,
124
+ state,
125
+ events,
126
+ menu,
127
+ };
128
+ });
@@ -1,4 +1,4 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.version = void 0;
4
- exports.version = '15.1.2';
4
+ exports.version = '15.1.3';
@@ -16,7 +16,7 @@ export const colorPickerStencil = createStencil({
16
16
  hexInput: 'color-picker-hex-input',
17
17
  inputWrapper: 'color-picker-input-wrapper',
18
18
  },
19
- base: { name: "ser36", styles: "box-sizing:border-box;width:13.5rem;[data-part=\"color-picker-form\"]{width:100%;display:flex;flex-direction:row;justify-content:space-between;margin-block-start:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));}[data-part=\"color-picker-input-wrapper\"]{display:flex;flex-direction:column;margin:0;}[data-part=\"color-picker-button\"]{align-self:flex-end;}[data-part=\"color-picker-hex-input\"]{width:10.5rem;}" }
19
+ base: { name: "9csn4", styles: "box-sizing:border-box;width:13.5rem;[data-part=\"color-picker-form\"]{width:100%;display:flex;flex-direction:row;justify-content:space-between;margin-block-start:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));}[data-part=\"color-picker-input-wrapper\"]{display:flex;flex-direction:column;margin:0;}[data-part=\"color-picker-button\"]{align-self:flex-end;}[data-part=\"color-picker-hex-input\"]{width:10.5rem;}" }
20
20
  }, "color-picker-a530b2");
21
21
  const isCustomColor = (colors, hexCode) => {
22
22
  if (!hexCode) {
@@ -8,7 +8,7 @@ export const resetButtonStencil = createStencil({
8
8
  parts: {
9
9
  label: 'reset-button-label',
10
10
  },
11
- base: { name: "1gk7oe", styles: "box-sizing:border-box;display:flex;align-items:center;justify-content:flex-start;width:calc(100% + var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem)));height:var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem));margin:calc(var(--cnvs-base-size-100, 0.5rem) * -1) calc(var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem)) * -1) var(--cnvs-base-size-100, 0.5rem);padding:0 var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem));white-space:nowrap;border:none;outline:none;background:none;cursor:pointer;transition:color 120ms ease, background-color 120ms ease;&:hover, &.hover{background-color:var(--cnvs-sys-color-bg-alt-default);}&:active, &.active{background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));}&:focus-visible, &.focus{box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse-default, var(--cnvs-base-palette-neutral-0)), 0 0 0 2px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}[data-part=\"reset-button-label\"]{margin-inline-start:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));}" }
11
+ base: { name: "2i8j6s", styles: "box-sizing:border-box;display:flex;align-items:center;justify-content:flex-start;width:calc(100% + var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem)));height:var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem));margin:calc(var(--cnvs-base-size-100, 0.5rem) * -1) calc(var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem)) * -1) var(--cnvs-base-size-100, 0.5rem);padding:0 var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem));white-space:nowrap;border:none;outline:none;background:none;cursor:pointer;transition:color 120ms ease, background-color 120ms ease;&:hover, &.hover{background-color:var(--cnvs-sys-color-bg-alt-default);}&:active, &.active{background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));}&:focus-visible, &.focus{box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse-default, var(--cnvs-base-palette-neutral-0)), 0 0 0 2px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}[data-part=\"reset-button-label\"]{margin-inline-start:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));}" }
12
12
  }, "reset-button-531e85");
13
13
  export const ResetButton = ({ onClick, resetColor, label }) => {
14
14
  const handleResetColor = () => onClick(resetColor);
@@ -10,7 +10,7 @@ const colorPickerSwatchBookStencil = createStencil({
10
10
  parts: {
11
11
  tile: 'color-picker-swatch-book-tile',
12
12
  },
13
- base: { name: "704gw", styles: "--shadow-color-picker-swatch-book-915ea6:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1))) 0 0 0 0.125rem, var(--cnvs-sys-color-border-input-default) 0 0 0 0.1875rem;box-sizing:border-box;display:flex;flex-wrap:wrap;margin:0 calc(var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) * -1) calc(var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) * -1) 0;[data-part=\"color-picker-swatch-book-tile\"]{display:flex;width:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));cursor:pointer;border-radius:var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1, 0.25rem));transition:box-shadow 120ms ease;margin:0px var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) 0px;&:hover{box-shadow:var(--shadow-color-picker-swatch-book-915ea6);}&:focus-visible{outline:none;box-shadow:0 0 0 2px var(--cnvs-sys-color-border-inverse-default, var(--cnvs-base-palette-neutral-0)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&[aria-selected=\"true\"]{box-shadow:var(--shadow-color-picker-swatch-book-915ea6);&:focus-visible{animation:none;box-shadow:none;}&:hover{box-shadow:var(--shadow-color-picker-swatch-book-915ea6);}}}" }
13
+ base: { name: "12pqry", styles: "--shadow-color-picker-swatch-book-915ea6:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1))) 0 0 0 0.125rem, var(--cnvs-sys-color-border-input-default) 0 0 0 0.1875rem;box-sizing:border-box;display:flex;flex-wrap:wrap;margin:0 calc(var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) * -1) calc(var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) * -1) 0;[data-part=\"color-picker-swatch-book-tile\"]{display:flex;width:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));cursor:pointer;border-radius:var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1, 0.25rem));transition:box-shadow 120ms ease;margin:0px var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) 0px;&:hover{box-shadow:var(--shadow-color-picker-swatch-book-915ea6);}&:focus-visible{outline:none;box-shadow:0 0 0 2px var(--cnvs-sys-color-border-inverse-default, var(--cnvs-base-palette-neutral-0)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&[aria-selected=\"true\"]{box-shadow:var(--shadow-color-picker-swatch-book-915ea6);&:focus-visible{animation:none;box-shadow:none;}&:hover{box-shadow:var(--shadow-color-picker-swatch-book-915ea6);}}}" }
14
14
  }, "color-picker-swatch-book-915ea6");
15
15
  export const SwatchBook = ({ colors, value, onSelect }) => {
16
16
  return (_jsx("div", { ...colorPickerSwatchBookStencil(), children: colors.map((color, index) => {
@@ -6,7 +6,7 @@ export const dividerStencil = createStencil({
6
6
  vars: {
7
7
  space: '',
8
8
  },
9
- base: { name: "3wx3le", styles: "box-sizing:border-box;display:block;height:0.0625rem;border:none;border-block-start:1px solid var(--cnvs-sys-color-border-default, var(--cnvs-sys-color-border-divider, oklch(0.3057 0.079 256.22 / 0.13)));margin:calc(var(--space-divider-a2c50d, var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem))) / 2) 0;" }
9
+ base: { name: "2utt30", styles: "box-sizing:border-box;display:block;height:0.0625rem;border:none;border-block-start:1px solid var(--cnvs-sys-color-border-default, var(--cnvs-sys-color-border-divider, oklch(0.3057 0.079 256.22 / 0.13)));margin:calc(var(--space-divider-a2c50d, var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem))) / 2) 0;" }
10
10
  }, "divider-a2c50d");
11
11
  /**
12
12
  * # Divider
@@ -7,5 +7,6 @@ export * from './radio';
7
7
  export * from './side-panel';
8
8
  export * from './status-indicator';
9
9
  export * from './switch';
10
+ export * from './tabs';
10
11
  export * from './version';
11
12
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA,cAAc,kCAAkC,CAAC;AACjD,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA,cAAc,kCAAkC,CAAC;AACjD,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC"}
package/dist/es6/index.js CHANGED
@@ -7,4 +7,5 @@ export * from './radio';
7
7
  export * from './side-panel';
8
8
  export * from './status-indicator';
9
9
  export * from './switch';
10
+ export * from './tabs';
10
11
  export * from './version';
@@ -11,7 +11,7 @@ const ANIMATION_DURATION_MS = 1230;
11
11
  /**
12
12
  * The animation for the sparkle.
13
13
  */
14
- const LOADING_ANIMATION = keyframes({ name: "2slgnw", styles: "0%, 79%, 100%{opacity:0.2;transform:scale(0.55);}27%{opacity:1;transform:scale(1);}53%{opacity:0.6;transform:scale(0.7);}" });
14
+ const LOADING_ANIMATION = keyframes({ name: "fq1e3", styles: "0%, 79%, 100%{opacity:0.2;transform:scale(0.55);}27%{opacity:1;transform:scale(1);}53%{opacity:0.6;transform:scale(0.7);}" });
15
15
  /**
16
16
  * An individual loading sparkle. ✨
17
17
  */
@@ -19,7 +19,7 @@ const Sparkle = () => {
19
19
  return _jsx(SystemIcon, { "data-part": "sparkle", icon: sparkleIcon, size: px2rem(12) });
20
20
  };
21
21
  export const loadingSparklesStencil = createStencil({
22
- base: { name: "1g1vge", styles: "box-sizing:border-box;display:inline-flex;gap:0.0625rem;& [data-part=\"sparkle\"]{animation-duration:1230ms;animation-fill-mode:both;animation-iteration-count:infinite;animation-name:animation-2slgnw;animation-timing-function:ease-in-out;--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-ai);&:nth-child(1){animation-delay:0ms;}&:nth-child(2){animation-delay:calc(1230ms * (1/3));}&:nth-child(3){animation-delay:calc(1230ms * (2/3));}}" }
22
+ base: { name: "11o25l", styles: "box-sizing:border-box;display:inline-flex;gap:0.0625rem;& [data-part=\"sparkle\"]{animation-duration:1230ms;animation-fill-mode:both;animation-iteration-count:infinite;animation-name:animation-fq1e3;animation-timing-function:ease-in-out;--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-ai);&:nth-child(1){animation-delay:0ms;}&:nth-child(2){animation-delay:calc(1230ms * (1/3));}&:nth-child(3){animation-delay:calc(1230ms * (2/3));}}" }
23
23
  }, "loading-sparkles-9c48ef");
24
24
  /**
25
25
  * A simple component that displays three horizontal sparkles, to be used when an AI operation is in progress.
@@ -10,11 +10,11 @@ import { system } from '@workday/canvas-tokens-web';
10
10
  import { MultiSelectedList } from './MultiSelectedList';
11
11
  import { useMultiSelectModel } from './useMultiSelectModel';
12
12
  export const multiSelectInputStencil = createStencil({
13
- base: { name: "2308lr", styles: "box-sizing:border-box;border:1px solid var(--cnvs-sys-color-border-input-default);display:flex;flex-direction:column;background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border-radius:var(--cnvs-sys-shape-md, var(--cnvs-sys-shape-x2, 0.5rem));min-height:var(--cnvs-sys-size-md, var(--cnvs-sys-space-x10, 2.5rem));transition:0.2s box-shadow, 0.2s border-color;margin:0;--width-text-input-7c8776:100%;--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-default);&:hover, &.hover{border-color:var(--cnvs-sys-color-border-input-hover, var(--cnvs-sys-color-border-input-strong, oklch(0.1595 0.0431 250.87 / 0.7)));}&:has(:focus-visible:not([disabled])), &.focus{border-color:var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));box-shadow:inset 0 0 0 1px var(--cnvs-sys-color-brand-focus-primary, var(--cnvs-brand-common-focus-outline, oklch(0.6023 0.2032 255.68 / 1)));}& [data-part=\"user-input\"]{font-family:var(--cnvs-sys-font-family-default);font-size:var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem));font-weight:var(--cnvs-sys-font-weight-normal);line-height:var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem));background-color:var(--cnvs-sys-color-surface-transparent, var(--cnvs-sys-color-bg-transparent-default, oklch(0 0 0 / 0)));border-radius:var(--cnvs-sys-shape-md, var(--cnvs-sys-shape-x2, 0.5rem));&:where([data-part=\"user-input\"], [data-part=\"form-input\"]){height:2.375rem;}border:none !important;box-shadow:none !important;outline-width:0px;&:where(:not([aria-autocomplete])){caret-color:transparent;cursor:default;&::selection{background-color:transparent;}}}&:has(:disabled, .disabled) :where([data-part=\"user-input\"]){opacity:var(--cnvs-sys-opacity-disabled);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-disabled);}&:has(:disabled, .disabled){opacity:var(--cnvs-sys-opacity-disabled);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-disabled);}&:has(:disabled, .disabled) :where([data-part=\"form-input\"]){opacity:0;--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-disabled);}& :where([data-part=\"form-input\"]){position:absolute;top:0;bottom:0;left:0;right:0;opacity:0;cursor:default;pointer-events:none;}& :where([data-part=\"separator\"]){background-color:var(--cnvs-sys-color-border-default, var(--cnvs-sys-color-border-divider, oklch(0.3057 0.079 256.22 / 0.13)));height:1px;margin:0 var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));}& :where([data-part=\"list\"]){display:flex;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));padding:var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem));flex-wrap:wrap;}" },
13
+ base: { name: "3c64eq", styles: "box-sizing:border-box;border:1px solid var(--cnvs-sys-color-border-input-default);display:flex;flex-direction:column;background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border-radius:var(--cnvs-sys-shape-md, var(--cnvs-sys-shape-x2, 0.5rem));min-height:var(--cnvs-sys-size-md, var(--cnvs-sys-space-x10, 2.5rem));transition:0.2s box-shadow, 0.2s border-color;margin:0;--width-text-input-7c8776:100%;--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-default);&:hover, &.hover{border-color:var(--cnvs-sys-color-border-input-hover, var(--cnvs-sys-color-border-input-strong, oklch(0.1595 0.0431 250.87 / 0.7)));}&:has(:focus-visible:not([disabled])), &.focus{border-color:var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));box-shadow:inset 0 0 0 1px var(--cnvs-sys-color-brand-focus-primary, var(--cnvs-brand-common-focus-outline, oklch(0.6023 0.2032 255.68 / 1)));}& [data-part=\"user-input\"]{font-family:var(--cnvs-sys-font-family-default);font-size:var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem));font-weight:var(--cnvs-sys-font-weight-normal);line-height:var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem));background-color:var(--cnvs-sys-color-surface-transparent, var(--cnvs-sys-color-bg-transparent-default, oklch(0 0 0 / 0)));border-radius:var(--cnvs-sys-shape-md, var(--cnvs-sys-shape-x2, 0.5rem));&:where([data-part=\"user-input\"], [data-part=\"form-input\"]){height:2.375rem;}border:none !important;box-shadow:none !important;outline-width:0px;&:where(:not([aria-autocomplete])){caret-color:transparent;cursor:default;&::selection{background-color:transparent;}}}&:has(:disabled, .disabled) :where([data-part=\"user-input\"]){opacity:var(--cnvs-sys-opacity-disabled);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-disabled);}&:has(:disabled, .disabled){opacity:var(--cnvs-sys-opacity-disabled);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-disabled);}&:has(:disabled, .disabled) :where([data-part=\"form-input\"]){opacity:0;--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-disabled);}& :where([data-part=\"form-input\"]){position:absolute;top:0;bottom:0;left:0;right:0;opacity:0;cursor:default;pointer-events:none;}& :where([data-part=\"separator\"]){background-color:var(--cnvs-sys-color-border-default, var(--cnvs-sys-color-border-divider, oklch(0.3057 0.079 256.22 / 0.13)));height:1px;margin:0 var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));}& :where([data-part=\"list\"]){display:flex;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));padding:var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem));flex-wrap:wrap;}" },
14
14
  modifiers: {
15
15
  error: {
16
- error: { name: "4nlx2", styles: "border-color:var(--cnvs-sys-color-brand-border-critical, oklch(0.6495 0.2369 30.04 / 1));box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-focus-critical, var(--cnvs-brand-common-error-inner, oklch(0.6495 0.2369 30.04 / 1)));background-color:var(--cnvs-sys-color-brand-surface-critical-default, oklch(0.6289 0.2567 29.11 / 0.04));&:has(:hover, :disabled, :focus-visible), &:is(.hover, .disabled, .focus){border-color:var(--cnvs-sys-color-brand-border-critical, oklch(0.6495 0.2369 30.04 / 1));}&:has(:focus-visible:not([disabled])), &.focus{border-color:var(--cnvs-sys-color-brand-border-critical, oklch(0.6495 0.2369 30.04 / 1));box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-focus-critical, var(--cnvs-brand-common-error-inner, oklch(0.6495 0.2369 30.04 / 1))), 0 0 0 2px var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))), 0 0 0 4px var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));outline-offset:0.125rem;}" },
17
- caution: { name: "1yw3oc", styles: "border-color:var(--cnvs-sys-color-brand-border-caution, var(--cnvs-brand-alert-dark, oklch(0.6601 0.1537 60.7 / 1)));box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-focus-caution-inner, var(--cnvs-brand-common-alert-inner, oklch(0.7909 0.1711 70.15 / 1)));background-color:var(--cnvs-sys-color-brand-surface-caution-default, oklch(0.7982 0.159 92.57 / 0.1));&:has(:hover, .hover, :disabled, .disabled, :focus-visible:not([disabled])), .focus:not(:has([disabled])){border-color:var(--cnvs-sys-color-brand-border-caution, var(--cnvs-brand-alert-dark, oklch(0.6601 0.1537 60.7 / 1)));}&:hover, &.hover{border-color:var(--cnvs-sys-color-brand-border-caution, var(--cnvs-brand-alert-dark, oklch(0.6601 0.1537 60.7 / 1)));}&:has(:focus-visible, .focus):not(:has([disabled])){box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-focus-caution-inner, var(--cnvs-brand-common-alert-inner, oklch(0.7909 0.1711 70.15 / 1))),\n 0 0 0 2px var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))),\n 0 0 0 4px var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));}outline-offset:0.125rem;" }
16
+ error: { name: "2jse9v", styles: "border-color:var(--cnvs-sys-color-brand-border-critical, oklch(0.6495 0.2369 30.04 / 1));box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-focus-critical, var(--cnvs-brand-common-error-inner, oklch(0.6495 0.2369 30.04 / 1)));background-color:var(--cnvs-sys-color-brand-surface-critical-default, oklch(0.6289 0.2567 29.11 / 0.04));&:has(:hover, :disabled, :focus-visible), &:is(.hover, .disabled, .focus){border-color:var(--cnvs-sys-color-brand-border-critical, oklch(0.6495 0.2369 30.04 / 1));}&:has(:focus-visible:not([disabled])), &.focus{border-color:var(--cnvs-sys-color-brand-border-critical, oklch(0.6495 0.2369 30.04 / 1));box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-focus-critical, var(--cnvs-brand-common-error-inner, oklch(0.6495 0.2369 30.04 / 1))), 0 0 0 2px var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))), 0 0 0 4px var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));outline-offset:0.125rem;}" },
17
+ caution: { name: "3ltoi9", styles: "border-color:var(--cnvs-sys-color-brand-border-caution, var(--cnvs-brand-alert-dark, oklch(0.6601 0.1537 60.7 / 1)));box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-focus-caution-inner, var(--cnvs-brand-common-alert-inner, oklch(0.7909 0.1711 70.15 / 1)));background-color:var(--cnvs-sys-color-brand-surface-caution-default, oklch(0.7982 0.159 92.57 / 0.1));&:has(:hover, .hover, :disabled, .disabled, :focus-visible:not([disabled])), .focus:not(:has([disabled])){border-color:var(--cnvs-sys-color-brand-border-caution, var(--cnvs-brand-alert-dark, oklch(0.6601 0.1537 60.7 / 1)));}&:hover, &.hover{border-color:var(--cnvs-sys-color-brand-border-caution, var(--cnvs-brand-alert-dark, oklch(0.6601 0.1537 60.7 / 1)));}&:has(:focus-visible, .focus):not(:has([disabled])){box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-focus-caution-inner, var(--cnvs-brand-common-alert-inner, oklch(0.7909 0.1711 70.15 / 1))),\n 0 0 0 2px var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))),\n 0 0 0 4px var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));}outline-offset:0.125rem;" }
18
18
  }
19
19
  }
20
20
  }, "multi-select-input-73c93d");
@@ -11,11 +11,11 @@ import { useRadioModel } from './hooks/useRadioModel';
11
11
  */
12
12
  const radioGroupStencil = createStencil({
13
13
  extends: cornerShapeStencil,
14
- base: { name: "2mwp7d", styles: "box-sizing:border-box;--shape-corner-shape-ccab68:var(--cnvs-sys-shape-lg, 0.75rem);display:flex;flex-direction:column;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));padding:var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-padding-sm, var(--cnvs-sys-space-x3, 0.75rem));margin:0 calc(var(--cnvs-base-size-150, 0.75rem) * -1);transition:100ms box-shadow;width:fit-content;" },
14
+ base: { name: "4cnglz", styles: "box-sizing:border-box;--shape-corner-shape-ccab68:var(--cnvs-sys-shape-lg, 0.75rem);display:flex;flex-direction:column;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));padding:var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-padding-sm, var(--cnvs-sys-space-x3, 0.75rem));margin:0 calc(var(--cnvs-base-size-150, 0.75rem) * -1);transition:100ms box-shadow;width:fit-content;" },
15
15
  modifiers: {
16
16
  error: {
17
- error: { name: "1nej37", styles: "box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-border-critical, oklch(0.6495 0.2369 30.04 / 1));" },
18
- caution: { name: "3rto31", styles: "box-shadow:inset 0 0 0 0.0625rem var(--cnvs-sys-color-brand-focus-caution-inner, var(--cnvs-brand-common-alert-inner, oklch(0.7909 0.1711 70.15 / 1))), inset 0 0 0 0.1875rem var(--cnvs-sys-color-brand-border-caution, var(--cnvs-brand-alert-dark, oklch(0.6601 0.1537 60.7 / 1)));" }
17
+ error: { name: "479nxh", styles: "box-shadow:inset 0 0 0 0.125rem var(--cnvs-sys-color-brand-border-critical, oklch(0.6495 0.2369 30.04 / 1));" },
18
+ caution: { name: "18oyya", styles: "box-shadow:inset 0 0 0 0.0625rem var(--cnvs-sys-color-brand-focus-caution-inner, var(--cnvs-brand-common-alert-inner, oklch(0.7909 0.1711 70.15 / 1))), inset 0 0 0 0.1875rem var(--cnvs-sys-color-brand-border-caution, var(--cnvs-brand-alert-dark, oklch(0.6601 0.1537 60.7 / 1)));" }
19
19
  }
20
20
  }
21
21
  }, "radio-group-6fa928");
@@ -8,7 +8,7 @@ import { RadioInput } from './RadioInput';
8
8
  import { RadioText } from './RadioText';
9
9
  import { useRadioModel } from './hooks/useRadioModel';
10
10
  const radioLabelStencil = createStencil({
11
- base: { name: "3yz5zu", styles: "box-sizing:border-box;align-items:flex-start;min-height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));position:relative;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));" }
11
+ base: { name: "92las", styles: "box-sizing:border-box;align-items:flex-start;min-height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));position:relative;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));" }
12
12
  }, "radio-label-0ab968");
13
13
  export const RadioLabelContext = React.createContext({});
14
14
  export const RadioLabel = createSubcomponent('label')({
@@ -9,13 +9,13 @@ import { RadioLabelContext } from './RadioLabel';
9
9
  import { useRadioModel } from './hooks/useRadioModel';
10
10
  const radioTextStencil = createStencil({
11
11
  extends: textStencil,
12
- base: { name: "3iprxf", styles: "box-sizing:border-box;cursor:pointer;" },
12
+ base: { name: "34l9fx", styles: "box-sizing:border-box;cursor:pointer;" },
13
13
  modifiers: {
14
14
  variant: {
15
- inverse: { name: "vufg2", styles: "color:var(--cnvs-sys-color-fg-inverse);" }
15
+ inverse: { name: "1fn1rs", styles: "color:var(--cnvs-sys-color-fg-inverse);" }
16
16
  },
17
17
  disabled: {
18
- true: { name: "2ppuln", styles: "cursor:default;opacity:var(--cnvs-sys-opacity-disabled);" }
18
+ true: { name: "2s47ek", styles: "cursor:default;opacity:var(--cnvs-sys-opacity-disabled);" }
19
19
  }
20
20
  },
21
21
  defaultModifiers: {
@@ -9,10 +9,10 @@ export const radioInputStencil = createStencil({
9
9
  parts: {
10
10
  check: 'cnvs-radio-check',
11
11
  },
12
- base: { name: "2drz7y", styles: "box-sizing:border-box;cursor:pointer;height:var(--cnvs-sys-size-xs, var(--cnvs-sys-space-x6, 1.5rem));width:var(--cnvs-sys-size-xs, var(--cnvs-sys-space-x6, 1.5rem));border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));position:absolute;margin:0;opacity:var(--cnvs-sys-opacity-zero);&:focus-visible, &.focus, &:active{outline:0.0625rem solid transparent;}&:disabled, &.disabled{cursor:auto;&:checked + .cnvs-radio-check, &.checked + .cnvs-radio-check{background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border:0.3125rem solid var(--cnvs-sys-color-brand-accent-positive, var(--cnvs-brand-success-base, oklch(0.5069 0.1569 145.56 / 1)));}}+ .cnvs-radio-check{display:flex;flex-direction:column;align-items:center;background-color:var(--cnvs-sys-color-bg-default);box-sizing:border-box;border:0.0625rem solid var(--cnvs-sys-color-border-input-default);height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));width:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));justify-content:center;pointer-events:none;position:absolute;transition:border 200ms ease, background 200ms;opacity:var(--cnvs-sys-opacity-full);}&:hover + .cnvs-radio-check, &.hover + .cnvs-radio-check{border-color:var(--cnvs-sys-color-border-input-default);}&:focus-visible + .cnvs-radio-check, &.focus + .cnvs-radio-check{outline:transparent;border-color:var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));box-shadow:0 0 0 0px var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))) ,0 0 0 1px var(--cnvs-sys-color-brand-focus-primary, var(--cnvs-brand-common-focus-outline, oklch(0.6023 0.2032 255.68 / 1))) ;}&:checked + .cnvs-radio-check, &.checked + .cnvs-radio-check{background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border:0.3125rem solid var(--cnvs-sys-color-brand-accent-positive, var(--cnvs-brand-success-base, oklch(0.5069 0.1569 145.56 / 1)));}&:focus-visible:checked + .cnvs-radio-check, &:focus-visible:hover:checked + .cnvs-radio-check, &.focus:checked + .cnvs-radio-check, &.focus:hover:checked + .cnvs-radio-check{outline:transparent;box-shadow:0 0 0 0.125rem var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))) ,0 0 0 0.25rem var(--cnvs-sys-color-brand-focus-primary, var(--cnvs-brand-common-focus-outline, oklch(0.6023 0.2032 255.68 / 1))) ;}" },
12
+ base: { name: "3gb032", styles: "box-sizing:border-box;cursor:pointer;height:var(--cnvs-sys-size-xs, var(--cnvs-sys-space-x6, 1.5rem));width:var(--cnvs-sys-size-xs, var(--cnvs-sys-space-x6, 1.5rem));border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));position:absolute;margin:0;opacity:var(--cnvs-sys-opacity-zero);&:focus-visible, &.focus, &:active{outline:0.0625rem solid transparent;}&:disabled, &.disabled{cursor:auto;&:checked + .cnvs-radio-check, &.checked + .cnvs-radio-check{background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border:0.3125rem solid var(--cnvs-sys-color-brand-accent-positive, var(--cnvs-brand-success-base, oklch(0.5069 0.1569 145.56 / 1)));}}+ .cnvs-radio-check{display:flex;flex-direction:column;align-items:center;background-color:var(--cnvs-sys-color-bg-default);box-sizing:border-box;border:0.0625rem solid var(--cnvs-sys-color-border-input-default);height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));width:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));justify-content:center;pointer-events:none;position:absolute;transition:border 200ms ease, background 200ms;opacity:var(--cnvs-sys-opacity-full);}&:hover + .cnvs-radio-check, &.hover + .cnvs-radio-check{border-color:var(--cnvs-sys-color-border-input-default);}&:focus-visible + .cnvs-radio-check, &.focus + .cnvs-radio-check{outline:transparent;border-color:var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));box-shadow:0 0 0 0px var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))) ,0 0 0 1px var(--cnvs-sys-color-brand-focus-primary, var(--cnvs-brand-common-focus-outline, oklch(0.6023 0.2032 255.68 / 1))) ;}&:checked + .cnvs-radio-check, &.checked + .cnvs-radio-check{background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border:0.3125rem solid var(--cnvs-sys-color-brand-accent-positive, var(--cnvs-brand-success-base, oklch(0.5069 0.1569 145.56 / 1)));}&:focus-visible:checked + .cnvs-radio-check, &:focus-visible:hover:checked + .cnvs-radio-check, &.focus:checked + .cnvs-radio-check, &.focus:hover:checked + .cnvs-radio-check{outline:transparent;box-shadow:0 0 0 0.125rem var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))) ,0 0 0 0.25rem var(--cnvs-sys-color-brand-focus-primary, var(--cnvs-brand-common-focus-outline, oklch(0.6023 0.2032 255.68 / 1))) ;}" },
13
13
  modifiers: {
14
14
  variant: {
15
- inverse: { name: "1d578u", styles: "+ [data-part=\"cnvs-radio-check\"]{background-color:var(--cnvs-sys-color-surface-inverse, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}&:disabled, &.disabled{opacity:var(--cnvs-sys-opacity-disabled);+ [data-part=\"cnvs-radio-check\"]{background-color:var(--cnvs-sys-color-surface-inverse, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border-color:var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1)));}&:checked + [data-part=\"cnvs-radio-check\"], &.checked + [data-part=\"cnvs-radio-check\"]{background-color:var(--cnvs-sys-color-brand-accent-positive, var(--cnvs-brand-success-base, oklch(0.5069 0.1569 145.56 / 1)));border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}}&:hover + [data-part=\"cnvs-radio-check\"], &.hover + [data-part=\"cnvs-radio-check\"]{border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}&:focus-visible + [data-part=\"cnvs-radio-check\"], &.focus + [data-part=\"cnvs-radio-check\"]{border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}&:checked + [data-part=\"cnvs-radio-check\"], &.checked + [data-part=\"cnvs-radio-check\"]{background-color:var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)));border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}&:focus-visible + [data-part=\"cnvs-radio-check\"], &:focus-visible:hover + [data-part=\"cnvs-radio-check\"], &.focus + [data-part=\"cnvs-radio-check\"], &.focus:hover + [data-part=\"cnvs-radio-check\"]{box-shadow:0 0 0 0.125rem var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));}&:focus-visible:checked + [data-part=\"cnvs-radio-check\"], &:focus-visible:hover:checked + [data-part=\"cnvs-radio-check\"], &.focus:checked + [data-part=\"cnvs-radio-check\"], &.focus:hover:checked + [data-part=\"cnvs-radio-check\"]{box-shadow:0 0 0 0.125rem var(--cnvs-sys-color-border-contrast-default) ,0 0 0 0.25rem var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))) ;}" }
15
+ inverse: { name: "4czc4", styles: "+ [data-part=\"cnvs-radio-check\"]{background-color:var(--cnvs-sys-color-surface-inverse, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}&:disabled, &.disabled{opacity:var(--cnvs-sys-opacity-disabled);+ [data-part=\"cnvs-radio-check\"]{background-color:var(--cnvs-sys-color-surface-inverse, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border-color:var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1)));}&:checked + [data-part=\"cnvs-radio-check\"], &.checked + [data-part=\"cnvs-radio-check\"]{background-color:var(--cnvs-sys-color-brand-accent-positive, var(--cnvs-brand-success-base, oklch(0.5069 0.1569 145.56 / 1)));border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}}&:hover + [data-part=\"cnvs-radio-check\"], &.hover + [data-part=\"cnvs-radio-check\"]{border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}&:focus-visible + [data-part=\"cnvs-radio-check\"], &.focus + [data-part=\"cnvs-radio-check\"]{border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}&:checked + [data-part=\"cnvs-radio-check\"], &.checked + [data-part=\"cnvs-radio-check\"]{background-color:var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)));border-color:var(--cnvs-sys-color-border-inverse-default, var(--cnvs-sys-color-border-inverse, oklch(1 0 0 / 1)));}&:focus-visible + [data-part=\"cnvs-radio-check\"], &:focus-visible:hover + [data-part=\"cnvs-radio-check\"], &.focus + [data-part=\"cnvs-radio-check\"], &.focus:hover + [data-part=\"cnvs-radio-check\"]{box-shadow:0 0 0 0.125rem var(--cnvs-sys-color-brand-border-primary, oklch(0.6023 0.2032 255.68 / 1));}&:focus-visible:checked + [data-part=\"cnvs-radio-check\"], &:focus-visible:hover:checked + [data-part=\"cnvs-radio-check\"], &.focus:checked + [data-part=\"cnvs-radio-check\"], &.focus:hover:checked + [data-part=\"cnvs-radio-check\"]{box-shadow:0 0 0 0.125rem var(--cnvs-sys-color-border-contrast-default) ,0 0 0 0.25rem var(--cnvs-sys-color-focus-inverse, var(--cnvs-sys-color-border-input-inverse, oklch(1 0 0 / 1))) ;}" }
16
16
  }
17
17
  }
18
18
  }, "radio-input-374248");
@@ -23,13 +23,13 @@ const StyledRadioInput = createComponent('input')({
23
23
  },
24
24
  });
25
25
  export const radioInputWrapperStencil = createStencil({
26
- base: { name: "2n65fr", styles: "box-sizing:border-box;height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));width:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));flex:0 0 auto;align-items:center;justify-content:center;::before{content:'';position:absolute;border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));transition:box-shadow 150ms ease-out;width:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));pointer-events:none;opacity:var(--cnvs-sys-opacity-full);}&:hover:before, &.hover:before{box-shadow:0 0 0 0.25rem var(--cnvs-sys-color-surface-overlay-hover-default, oklch(0.3343 0.0951 253.3 / 0.05));}" },
26
+ base: { name: "1crr5h", styles: "box-sizing:border-box;height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));width:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));flex:0 0 auto;align-items:center;justify-content:center;::before{content:'';position:absolute;border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));transition:box-shadow 150ms ease-out;width:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));pointer-events:none;opacity:var(--cnvs-sys-opacity-full);}&:hover:before, &.hover:before{box-shadow:0 0 0 0.25rem var(--cnvs-sys-color-surface-overlay-hover-default, oklch(0.3343 0.0951 253.3 / 0.05));}" },
27
27
  modifiers: {
28
28
  variant: {
29
- inverse: { name: "ht6ga", styles: "&:hover:before, &.hover:before{box-shadow:0 0 0 0.25rem var(--cnvs-sys-color-surface-overlay-hover-inverse, oklch(1 0 0 / 0.16));}" }
29
+ inverse: { name: "11m45j", styles: "&:hover:before, &.hover:before{box-shadow:0 0 0 0.25rem var(--cnvs-sys-color-surface-overlay-hover-inverse, oklch(1 0 0 / 0.16));}" }
30
30
  },
31
31
  disabled: {
32
- true: { name: "26js2v", styles: "opacity:var(--cnvs-sys-opacity-disabled);&:hover:before, &.hover:before{box-shadow:none;cursor:auto;}" }
32
+ true: { name: "q2fd6", styles: "opacity:var(--cnvs-sys-opacity-disabled);&:hover:before, &.hover:before{box-shadow:none;cursor:auto;}" }
33
33
  }
34
34
  }
35
35
  }, "radio-input-wrapper-16420d");
@@ -13,19 +13,19 @@ export const panelStencil = createStencil({
13
13
  expandedWidth: '',
14
14
  collapsedWidth: '',
15
15
  },
16
- base: { name: "2ony68", styles: "box-sizing:border-box;overflow:hidden;position:relative;height:100%;outline:0.0625rem solid transparent;transition:width ease-out 200ms, max-width ease-out 200ms;" },
16
+ base: { name: "2r7695", styles: "box-sizing:border-box;overflow:hidden;position:relative;height:100%;outline:0.0625rem solid transparent;transition:width ease-out 200ms, max-width ease-out 200ms;" },
17
17
  modifiers: {
18
18
  variant: {
19
- alternate: { name: "46z8c4", styles: "background-color:var(--cnvs-sys-color-bg-default);box-shadow:var(--cnvs-sys-depth-5);" },
20
- standard: { name: "1fr4ej", styles: "background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));" }
19
+ alternate: { name: "21wek", styles: "background-color:var(--cnvs-sys-color-bg-default);box-shadow:var(--cnvs-sys-depth-5);" },
20
+ standard: { name: "3iviso", styles: "background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));" }
21
21
  },
22
22
  expanded: {
23
- true: { name: "ur9qz", styles: "width:var(--expandedWidth-panel-cea5fb);max-width:var(--expandedWidth-panel-cea5fb);" },
24
- false: { name: "yoknn", styles: "width:var(--collapsedWidth-panel-cea5fb);max-width:var(--collapsedWidth-panel-cea5fb);" }
23
+ true: { name: "240h9l", styles: "width:var(--expandedWidth-panel-cea5fb);max-width:var(--expandedWidth-panel-cea5fb);" },
24
+ false: { name: "njo92", styles: "width:var(--collapsedWidth-panel-cea5fb);max-width:var(--collapsedWidth-panel-cea5fb);" }
25
25
  },
26
26
  touched: {
27
- true: { name: "1r70e9", styles: "" },
28
- false: { name: "1tnlag", styles: "animation:none;" }
27
+ true: { name: "2bp1lw", styles: "" },
28
+ false: { name: "38vwty", styles: "animation:none;" }
29
29
  }
30
30
  }
31
31
  }, "panel-cea5fb");
@@ -8,35 +8,35 @@ import { extendIcon } from '@workday/canvas-system-icons-web';
8
8
  import { system } from '@workday/canvas-tokens-web';
9
9
  import { SidePanelContext } from './hooks';
10
10
  export const sidePanelToggleButtonStencil = createStencil({
11
- base: { name: "2w14sr", styles: "box-sizing:border-box;position:absolute;top:var(--cnvs-sys-gap-lg, var(--cnvs-sys-space-x6, 1.5rem));width:var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem));inset-inline-end:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));" },
11
+ base: { name: "84h7m", styles: "box-sizing:border-box;position:absolute;top:var(--cnvs-sys-gap-lg, var(--cnvs-sys-space-x6, 1.5rem));width:var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem));inset-inline-end:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));" },
12
12
  modifiers: {
13
13
  state: {
14
- collapsing: { name: "334f3u", styles: "margin:0;transform:scaleX(1);:dir(rtl){transform:scaleX(-1);}" },
15
- collapsed: { name: "lbz4q", styles: "margin:auto;inset-inline-start:0;inset-inline-end:0;transform:scaleX(1);:dir(rtl){transform:scaleX(-1);}" },
16
- expanded: { name: "e81oh", styles: "margin:0;transform:scaleX(-1);:dir(rtl){transform:scaleX(1);}" },
17
- expanding: { name: "45uotz", styles: "margin:0;transform:scaleX(-1);:dir(rtl){transform:scaleX(1);}" }
14
+ collapsing: { name: "46bses", styles: "margin:0;transform:scaleX(1);:dir(rtl){transform:scaleX(-1);}" },
15
+ collapsed: { name: "1ppjdk", styles: "margin:auto;inset-inline-start:0;inset-inline-end:0;transform:scaleX(1);:dir(rtl){transform:scaleX(-1);}" },
16
+ expanded: { name: "1eiaxr", styles: "margin:0;transform:scaleX(-1);:dir(rtl){transform:scaleX(1);}" },
17
+ expanding: { name: "2qr6d2", styles: "margin:0;transform:scaleX(-1);:dir(rtl){transform:scaleX(1);}" }
18
18
  },
19
19
  origin: {
20
- left: { name: "3inpl6", styles: "" },
21
- right: { name: "4frfp2", styles: "" }
20
+ left: { name: "4dnx39", styles: "" },
21
+ right: { name: "40d6sh", styles: "" }
22
22
  }
23
23
  },
24
24
  compound: [
25
25
  {
26
26
  modifiers: { state: 'collapsed', origin: 'right' },
27
- styles: { name: "26nznq", styles: "transform:scaleX(-1);" }
27
+ styles: { name: "20igr0", styles: "transform:scaleX(-1);" }
28
28
  },
29
29
  {
30
30
  modifiers: { state: 'collapsing', origin: 'right' },
31
- styles: { name: "2t4oke", styles: "transform:scaleX(-1);inset-inline-start:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));" }
31
+ styles: { name: "2a8n87", styles: "transform:scaleX(-1);inset-inline-start:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));" }
32
32
  },
33
33
  {
34
34
  modifiers: { state: 'expanded', origin: 'right' },
35
- styles: { name: "1q3jvi", styles: "transform:scaleX(1);inset-inline-start:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));" }
35
+ styles: { name: "4a0kks", styles: "transform:scaleX(1);inset-inline-start:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));" }
36
36
  },
37
37
  {
38
38
  modifiers: { state: 'expanding', origin: 'right' },
39
- styles: { name: "2aoyu8", styles: "transform:scaleX(1);inset-inline-start:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));" }
39
+ styles: { name: "1ybrht", styles: "transform:scaleX(1);inset-inline-start:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));" }
40
40
  }
41
41
  ]
42
42
  }, "side-panel-toggle-button-eaff77");
@@ -15,7 +15,7 @@ const deprecatedVariantsMap = {
15
15
  gray: 'neutral',
16
16
  };
17
17
  const statusIndicatorStencil = createStencil({
18
- base: { name: "saa5h", styles: "box-sizing:border-box;display:inline-flex;gap:var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem));max-width:12.5rem;align-items:center;border-radius:var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1, 0.25rem));height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));padding:0 var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem));outline:0.0625rem solid transparent;--color-system-icon-c9acc3:currentColor;" },
18
+ base: { name: "7d3b5", styles: "box-sizing:border-box;display:inline-flex;gap:var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem));max-width:12.5rem;align-items:center;border-radius:var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1, 0.25rem));height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));padding:0 var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem));outline:0.0625rem solid transparent;--color-system-icon-c9acc3:currentColor;" },
19
19
  modifiers: {
20
20
  /**
21
21
  * Defines the color of the `StatusIndicator`.
@@ -30,12 +30,12 @@ const statusIndicatorStencil = createStencil({
30
30
  * @default 'neutral'
31
31
  */
32
32
  variant: {
33
- info: { name: "in5e7", styles: "color:var(--cnvs-sys-color-fg-info-strong, var(--cnvs-sys-color-fg-primary-strong, oklch(0.4658 0.1562 255.5 / 1)));background-color:var(--cnvs-sys-color-surface-info-strong, var(--cnvs-sys-color-bg-info-softer, oklch(0.6152 0.2108 256.1 / 0.11)));" },
34
- positive: { name: "2qgoq0", styles: "color:var(--cnvs-sys-color-fg-success-strong, oklch(0.4463 0.1422 144.58 / 1));background-color:var(--cnvs-sys-color-surface-success-strong, oklch(0.8685 0.2814 143.77 / 0.15));" },
35
- caution: { name: "2alkpm", styles: "color:var(--cnvs-sys-color-fg-warning-strong, oklch(0.4824 0.1353 46.11 / 1));background-color:var(--cnvs-sys-color-surface-warning-strong, var(--cnvs-sys-color-static-amber-stronger, oklch(0.8864 0.1845 100.28 / 0.22)));" },
36
- critical: { name: "3uj4cp", styles: "color:var(--cnvs-sys-color-fg-danger-strong, var(--cnvs-sys-color-fg-critical-strong, oklch(0.4517 0.1847 28.2 / 1)));background-color:var(--cnvs-sys-color-surface-danger-strong, oklch(0.6434 0.2428 30.17 / 0.1));" },
37
- neutral: { name: "4an2lx", styles: "color:var(--cnvs-sys-color-fg-muted-strong);background-color:var(--cnvs-sys-color-surface-alt-strong, var(--cnvs-sys-color-bg-alt-default, oklch(0.3337 0.0688 250.79 / 0.09)));" },
38
- transparent: { name: "yris2", styles: "color:var(--cnvs-sys-color-fg-inverse);background-color:var(--cnvs-sys-color-surface-contrast-default, var(--cnvs-sys-color-bg-contrast-default, oklch(0.0969 0 0 / 0.84)));" }
33
+ info: { name: "1t5rc5", styles: "color:var(--cnvs-sys-color-fg-info-strong, var(--cnvs-sys-color-fg-primary-strong, oklch(0.4658 0.1562 255.5 / 1)));background-color:var(--cnvs-sys-color-surface-info-strong, var(--cnvs-sys-color-bg-info-softer, oklch(0.6152 0.2108 256.1 / 0.11)));" },
34
+ positive: { name: "173ki7", styles: "color:var(--cnvs-sys-color-fg-success-strong, oklch(0.4463 0.1422 144.58 / 1));background-color:var(--cnvs-sys-color-surface-success-strong, oklch(0.8685 0.2814 143.77 / 0.15));" },
35
+ caution: { name: "21akvk", styles: "color:var(--cnvs-sys-color-fg-warning-strong, oklch(0.4824 0.1353 46.11 / 1));background-color:var(--cnvs-sys-color-surface-warning-strong, var(--cnvs-sys-color-static-amber-stronger, oklch(0.8864 0.1845 100.28 / 0.22)));" },
36
+ critical: { name: "2qnlc", styles: "color:var(--cnvs-sys-color-fg-danger-strong, var(--cnvs-sys-color-fg-critical-strong, oklch(0.4517 0.1847 28.2 / 1)));background-color:var(--cnvs-sys-color-surface-danger-strong, oklch(0.6434 0.2428 30.17 / 0.1));" },
37
+ neutral: { name: "1nqeqm", styles: "color:var(--cnvs-sys-color-fg-muted-strong);background-color:var(--cnvs-sys-color-surface-alt-strong, var(--cnvs-sys-color-bg-alt-default, oklch(0.3337 0.0688 250.79 / 0.09)));" },
38
+ transparent: { name: "3ds46s", styles: "color:var(--cnvs-sys-color-fg-inverse);background-color:var(--cnvs-sys-color-surface-contrast-default, var(--cnvs-sys-color-bg-contrast-default, oklch(0.0969 0 0 / 0.84)));" }
39
39
  },
40
40
  /**
41
41
  * Defines the emphasis of the `StatusIndicator`. `low` should be used in almost all cases.
@@ -48,8 +48,8 @@ const statusIndicatorStencil = createStencil({
48
48
  *
49
49
  */
50
50
  emphasis: {
51
- low: { name: "4e2pxd", styles: "" },
52
- high: { name: "35qle8", styles: "" }
51
+ low: { name: "3upvyf", styles: "" },
52
+ high: { name: "3wcq25", styles: "" }
53
53
  }
54
54
  },
55
55
  compound: [
@@ -58,35 +58,35 @@ const statusIndicatorStencil = createStencil({
58
58
  variant: 'info',
59
59
  emphasis: 'high',
60
60
  },
61
- styles: { name: "xwaxt", styles: "background-color:var(--cnvs-sys-color-accent-info, var(--cnvs-sys-color-bg-info-default, oklch(0.5198 0.1782 256.11 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
61
+ styles: { name: "1iglyu", styles: "background-color:var(--cnvs-sys-color-accent-info, var(--cnvs-sys-color-bg-info-default, oklch(0.5198 0.1782 256.11 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
62
62
  },
63
63
  {
64
64
  modifiers: {
65
65
  variant: 'positive',
66
66
  emphasis: 'high',
67
67
  },
68
- styles: { name: "1w5g90", styles: "background-color:var(--cnvs-sys-color-accent-success, var(--cnvs-sys-color-bg-positive-default, oklch(0.5069 0.1569 145.56 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
68
+ styles: { name: "2jcewe", styles: "background-color:var(--cnvs-sys-color-accent-success, var(--cnvs-sys-color-bg-positive-default, oklch(0.5069 0.1569 145.56 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
69
69
  },
70
70
  {
71
71
  modifiers: {
72
72
  variant: 'caution',
73
73
  emphasis: 'high',
74
74
  },
75
- styles: { name: "nwyzy", styles: "background-color:var(--cnvs-sys-color-accent-warning, oklch(0.7909 0.1711 70.15 / 1));color:var(--cnvs-sys-color-fg-contrast-default);" }
75
+ styles: { name: "yvqpx", styles: "background-color:var(--cnvs-sys-color-accent-warning, oklch(0.7909 0.1711 70.15 / 1));color:var(--cnvs-sys-color-fg-contrast-default);" }
76
76
  },
77
77
  {
78
78
  modifiers: {
79
79
  variant: 'critical',
80
80
  emphasis: 'high',
81
81
  },
82
- styles: { name: "27uu9o", styles: "background-color:var(--cnvs-sys-color-accent-danger, var(--cnvs-sys-color-bg-critical-default, oklch(0.5342 0.2172 29.53 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
82
+ styles: { name: "3e9olt", styles: "background-color:var(--cnvs-sys-color-accent-danger, var(--cnvs-sys-color-bg-critical-default, oklch(0.5342 0.2172 29.53 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
83
83
  },
84
84
  {
85
85
  modifiers: {
86
86
  variant: 'neutral',
87
87
  emphasis: 'high',
88
88
  },
89
- styles: { name: "izngw", styles: "background-color:var(--cnvs-sys-color-accent-muted-default, var(--cnvs-sys-color-bg-muted-default, oklch(0.5103 0.0255 256.8 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
89
+ styles: { name: "1oexcp", styles: "background-color:var(--cnvs-sys-color-accent-muted-default, var(--cnvs-sys-color-bg-muted-default, oklch(0.5103 0.0255 256.8 / 1)));color:var(--cnvs-sys-color-fg-inverse);" }
90
90
  }
91
91
  ],
92
92
  defaultModifiers: {
@@ -6,7 +6,7 @@ import { createStencil } from '@workday/canvas-kit-styling';
6
6
  import { system } from '@workday/canvas-tokens-web';
7
7
  const statusIndicatorLabelStencil = createStencil({
8
8
  extends: textStencil,
9
- base: { name: "20mxhq", styles: "box-sizing:border-box;font-weight:var(--cnvs-sys-font-weight-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:capitalize;color:inherit;" },
9
+ base: { name: "2bdfx0", styles: "box-sizing:border-box;font-weight:var(--cnvs-sys-font-weight-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:capitalize;color:inherit;" },
10
10
  defaultModifiers: { typeLevel: 'subtext.large' }
11
11
  }, "status-indicator-label-63258e");
12
12
  export const StatusIndicatorLabel = createComponent('span')({
@@ -3,7 +3,7 @@ import { createComponent } from '@workday/canvas-kit-react/common';
3
3
  import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
4
4
  import { system } from '@workday/canvas-tokens-web';
5
5
  export const switchBackgroundStencil = createStencil({
6
- base: { name: "2fbz41", styles: "box-sizing:border-box;position:absolute;display:flex;align-items:center;pointer-events:none;border:0.0625rem solid transparent;height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));width:2.125rem;border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));padding:0 0.0625rem;transition:background-color 200ms ease;background-color:var(--cnvs-sys-color-accent-muted-default, var(--cnvs-sys-color-bg-muted-default, oklch(0.5103 0.0255 256.8 / 1)));" }
6
+ base: { name: "2v3087", styles: "box-sizing:border-box;position:absolute;display:flex;align-items:center;pointer-events:none;border:0.0625rem solid transparent;height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));width:2.125rem;border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));padding:0 0.0625rem;transition:background-color 200ms ease;background-color:var(--cnvs-sys-color-accent-muted-default, var(--cnvs-sys-color-bg-muted-default, oklch(0.5103 0.0255 256.8 / 1)));" }
7
7
  }, "switch-background-fbb710");
8
8
  export const SwitchBackground = createComponent('div')({
9
9
  displayName: 'SwitchBackground',
@@ -3,10 +3,10 @@ import { createComponent } from '@workday/canvas-kit-react/common';
3
3
  import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
4
4
  import { system } from '@workday/canvas-tokens-web';
5
5
  export const switchCircleStencil = createStencil({
6
- base: { name: "3mffly", styles: "box-sizing:border-box;width:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));border:0.0625rem solid transparent;box-shadow:var(--cnvs-sys-depth-1);transition:transform 150ms ease;pointer-events:none;background-color:var(--cnvs-sys-color-fg-inverse);transform:translateX(0);" },
6
+ base: { name: "2lbaox", styles: "box-sizing:border-box;width:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));border:0.0625rem solid transparent;box-shadow:var(--cnvs-sys-depth-1);transition:transform 150ms ease;pointer-events:none;background-color:var(--cnvs-sys-color-fg-inverse);transform:translateX(0);" },
7
7
  modifiers: {
8
8
  checked: {
9
- true: { name: "4ejeep", styles: "transform:translateX(0.875rem);:dir(rtl){transform:translateX(-0.875rem);}" }
9
+ true: { name: "2mnsca", styles: "transform:translateX(0.875rem);:dir(rtl){transform:translateX(-0.875rem);}" }
10
10
  }
11
11
  }
12
12
  }, "switch-circle-f808e0");
@@ -3,7 +3,7 @@ import { createComponent } from '@workday/canvas-kit-react/common';
3
3
  import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
4
4
  import { system } from '@workday/canvas-tokens-web';
5
5
  export const switchContainerStencil = createStencil({
6
- base: { name: "3wmopp", styles: "box-sizing:border-box;position:relative;margin-block-start:var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem));height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));width:2.125rem;" }
6
+ base: { name: "33fw9r", styles: "box-sizing:border-box;position:relative;margin-block-start:var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem));height:var(--cnvs-sys-size-xxs, var(--cnvs-sys-space-x5, 1.25rem));width:2.125rem;" }
7
7
  }, "switch-container-f03251");
8
8
  export const SwitchContainer = createComponent('div')({
9
9
  displayName: 'SwitchContainer',