@workday/canvas-kit-react 11.0.0-alpha.726-next.0 → 11.0.0-alpha.758-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 (181) hide show
  1. package/breadcrumbs/lib/BreadcrumbsItem.tsx +1 -1
  2. package/breadcrumbs/lib/BreadcrumbsOverflowButton.tsx +1 -1
  3. package/button/lib/BaseButton.tsx +16 -1
  4. package/button/lib/DeleteButton.tsx +12 -11
  5. package/button/lib/ExternalHyperlink.tsx +1 -1
  6. package/button/lib/PrimaryButton.tsx +52 -45
  7. package/button/lib/SecondaryButton.tsx +58 -75
  8. package/button/lib/TertiaryButton.tsx +63 -54
  9. package/collection/lib/ListBox.tsx +9 -3
  10. package/combobox/lib/ComboboxMenuList.tsx +3 -4
  11. package/dist/commonjs/badge/lib/CountBadge.js +6 -6
  12. package/dist/commonjs/breadcrumbs/lib/BreadcrumbsItem.js +1 -1
  13. package/dist/commonjs/breadcrumbs/lib/BreadcrumbsOverflowButton.js +1 -1
  14. package/dist/commonjs/button/lib/BaseButton.d.ts.map +1 -1
  15. package/dist/commonjs/button/lib/BaseButton.js +18 -17
  16. package/dist/commonjs/button/lib/DeleteButton.d.ts.map +1 -1
  17. package/dist/commonjs/button/lib/DeleteButton.js +2 -1
  18. package/dist/commonjs/button/lib/ExternalHyperlink.js +1 -1
  19. package/dist/commonjs/button/lib/PrimaryButton.d.ts.map +1 -1
  20. package/dist/commonjs/button/lib/PrimaryButton.js +3 -2
  21. package/dist/commonjs/button/lib/SecondaryButton.d.ts.map +1 -1
  22. package/dist/commonjs/button/lib/SecondaryButton.js +3 -2
  23. package/dist/commonjs/button/lib/TertiaryButton.d.ts.map +1 -1
  24. package/dist/commonjs/button/lib/TertiaryButton.js +16 -15
  25. package/dist/commonjs/card/lib/Card.js +1 -1
  26. package/dist/commonjs/card/lib/CardHeading.js +1 -1
  27. package/dist/commonjs/checkbox/lib/CheckBackground.js +5 -5
  28. package/dist/commonjs/checkbox/lib/CheckboxCheck.js +9 -9
  29. package/dist/commonjs/checkbox/lib/CheckboxContainer.js +1 -1
  30. package/dist/commonjs/checkbox/lib/CheckboxInput.js +11 -11
  31. package/dist/commonjs/checkbox/lib/CheckboxRipple.js +1 -1
  32. package/dist/commonjs/collection/lib/ListBox.d.ts.map +1 -1
  33. package/dist/commonjs/collection/lib/ListBox.js +14 -8
  34. package/dist/commonjs/combobox/lib/ComboboxMenuItem.js +4 -4
  35. package/dist/commonjs/combobox/lib/ComboboxMenuList.d.ts.map +1 -1
  36. package/dist/commonjs/combobox/lib/ComboboxMenuList.js +4 -5
  37. package/dist/commonjs/common/lib/AccessibleHide.js +1 -1
  38. package/dist/commonjs/common/lib/CanvasProvider.js +1 -1
  39. package/dist/commonjs/icon/index.d.ts +1 -1
  40. package/dist/commonjs/icon/index.d.ts.map +1 -1
  41. package/dist/commonjs/icon/index.js +4 -1
  42. package/dist/commonjs/icon/lib/AccentIcon.d.ts +30 -4
  43. package/dist/commonjs/icon/lib/AccentIcon.d.ts.map +1 -1
  44. package/dist/commonjs/icon/lib/AccentIcon.js +28 -4
  45. package/dist/commonjs/icon/lib/AppletIcon.d.ts +31 -2
  46. package/dist/commonjs/icon/lib/AppletIcon.d.ts.map +1 -1
  47. package/dist/commonjs/icon/lib/AppletIcon.js +27 -4
  48. package/dist/commonjs/icon/lib/Graphic.d.ts +20 -1
  49. package/dist/commonjs/icon/lib/Graphic.d.ts.map +1 -1
  50. package/dist/commonjs/icon/lib/Graphic.js +25 -3
  51. package/dist/commonjs/icon/lib/Svg.d.ts +12 -2
  52. package/dist/commonjs/icon/lib/Svg.d.ts.map +1 -1
  53. package/dist/commonjs/icon/lib/Svg.js +25 -10
  54. package/dist/commonjs/icon/lib/SystemIcon.d.ts +79 -16
  55. package/dist/commonjs/icon/lib/SystemIcon.d.ts.map +1 -1
  56. package/dist/commonjs/icon/lib/SystemIcon.js +51 -14
  57. package/dist/commonjs/icon/lib/SystemIconCircle.d.ts +2 -3
  58. package/dist/commonjs/icon/lib/SystemIconCircle.d.ts.map +1 -1
  59. package/dist/commonjs/icon/lib/SystemIconCircle.js +20 -30
  60. package/dist/commonjs/loading-dots/lib/LoadingDots.js +3 -3
  61. package/dist/commonjs/menu/lib/MenuCard.js +2 -2
  62. package/dist/commonjs/menu/lib/MenuList.js +5 -5
  63. package/dist/commonjs/select/lib/Select.js +7 -7
  64. package/dist/commonjs/select/lib/hooks/useSelectInput.d.ts +4 -1
  65. package/dist/commonjs/select/lib/hooks/useSelectInput.d.ts.map +1 -1
  66. package/dist/commonjs/select/lib/hooks/useSelectInput.js +14 -5
  67. package/dist/commonjs/switch/lib/Switch.js +13 -13
  68. package/dist/commonjs/table/lib/Table.js +2 -2
  69. package/dist/commonjs/table/lib/TableBody.js +2 -2
  70. package/dist/commonjs/table/lib/TableCaption.js +2 -2
  71. package/dist/commonjs/table/lib/TableCell.js +2 -2
  72. package/dist/commonjs/table/lib/TableFooter.js +2 -2
  73. package/dist/commonjs/table/lib/TableHead.js +2 -2
  74. package/dist/commonjs/table/lib/TableHeader.js +2 -2
  75. package/dist/commonjs/table/lib/TableRow.js +2 -2
  76. package/dist/commonjs/tabs/lib/TabsItem.d.ts.map +1 -1
  77. package/dist/commonjs/tabs/lib/TabsItem.js +4 -12
  78. package/dist/commonjs/tabs/lib/useTabsModel.d.ts.map +1 -1
  79. package/dist/commonjs/text/lib/LabelText.d.ts.map +1 -1
  80. package/dist/commonjs/text/lib/LabelText.js +11 -27
  81. package/dist/commonjs/text/lib/Text.d.ts +103 -0
  82. package/dist/commonjs/text/lib/Text.d.ts.map +1 -1
  83. package/dist/commonjs/text/lib/Text.js +30 -27
  84. package/dist/commonjs/tooltip/lib/OverflowTooltip.d.ts.map +1 -1
  85. package/dist/commonjs/tooltip/lib/OverflowTooltip.js +2 -3
  86. package/dist/es6/badge/lib/CountBadge.js +6 -6
  87. package/dist/es6/breadcrumbs/lib/BreadcrumbsItem.js +1 -1
  88. package/dist/es6/breadcrumbs/lib/BreadcrumbsOverflowButton.js +1 -1
  89. package/dist/es6/button/lib/BaseButton.d.ts.map +1 -1
  90. package/dist/es6/button/lib/BaseButton.js +18 -17
  91. package/dist/es6/button/lib/DeleteButton.d.ts.map +1 -1
  92. package/dist/es6/button/lib/DeleteButton.js +2 -1
  93. package/dist/es6/button/lib/ExternalHyperlink.js +1 -1
  94. package/dist/es6/button/lib/PrimaryButton.d.ts.map +1 -1
  95. package/dist/es6/button/lib/PrimaryButton.js +3 -2
  96. package/dist/es6/button/lib/SecondaryButton.d.ts.map +1 -1
  97. package/dist/es6/button/lib/SecondaryButton.js +3 -2
  98. package/dist/es6/button/lib/TertiaryButton.d.ts.map +1 -1
  99. package/dist/es6/button/lib/TertiaryButton.js +16 -15
  100. package/dist/es6/card/lib/Card.js +1 -1
  101. package/dist/es6/card/lib/CardHeading.js +1 -1
  102. package/dist/es6/checkbox/lib/CheckBackground.js +5 -5
  103. package/dist/es6/checkbox/lib/CheckboxCheck.js +9 -9
  104. package/dist/es6/checkbox/lib/CheckboxContainer.js +1 -1
  105. package/dist/es6/checkbox/lib/CheckboxInput.js +11 -11
  106. package/dist/es6/checkbox/lib/CheckboxRipple.js +1 -1
  107. package/dist/es6/collection/lib/ListBox.d.ts.map +1 -1
  108. package/dist/es6/collection/lib/ListBox.js +15 -9
  109. package/dist/es6/combobox/lib/ComboboxMenuItem.js +4 -4
  110. package/dist/es6/combobox/lib/ComboboxMenuList.d.ts.map +1 -1
  111. package/dist/es6/combobox/lib/ComboboxMenuList.js +5 -6
  112. package/dist/es6/common/lib/AccessibleHide.js +1 -1
  113. package/dist/es6/common/lib/CanvasProvider.js +1 -1
  114. package/dist/es6/icon/index.d.ts +1 -1
  115. package/dist/es6/icon/index.d.ts.map +1 -1
  116. package/dist/es6/icon/index.js +1 -1
  117. package/dist/es6/icon/lib/AccentIcon.d.ts +30 -4
  118. package/dist/es6/icon/lib/AccentIcon.d.ts.map +1 -1
  119. package/dist/es6/icon/lib/AccentIcon.js +27 -3
  120. package/dist/es6/icon/lib/AppletIcon.d.ts +31 -2
  121. package/dist/es6/icon/lib/AppletIcon.d.ts.map +1 -1
  122. package/dist/es6/icon/lib/AppletIcon.js +26 -3
  123. package/dist/es6/icon/lib/Graphic.d.ts +20 -1
  124. package/dist/es6/icon/lib/Graphic.d.ts.map +1 -1
  125. package/dist/es6/icon/lib/Graphic.js +24 -2
  126. package/dist/es6/icon/lib/Svg.d.ts +12 -2
  127. package/dist/es6/icon/lib/Svg.d.ts.map +1 -1
  128. package/dist/es6/icon/lib/Svg.js +25 -11
  129. package/dist/es6/icon/lib/SystemIcon.d.ts +79 -16
  130. package/dist/es6/icon/lib/SystemIcon.d.ts.map +1 -1
  131. package/dist/es6/icon/lib/SystemIcon.js +50 -13
  132. package/dist/es6/icon/lib/SystemIconCircle.d.ts +2 -3
  133. package/dist/es6/icon/lib/SystemIconCircle.d.ts.map +1 -1
  134. package/dist/es6/icon/lib/SystemIconCircle.js +23 -30
  135. package/dist/es6/loading-dots/lib/LoadingDots.js +3 -3
  136. package/dist/es6/menu/lib/MenuCard.js +2 -2
  137. package/dist/es6/menu/lib/MenuList.js +5 -5
  138. package/dist/es6/select/lib/Select.js +7 -7
  139. package/dist/es6/select/lib/hooks/useSelectInput.d.ts +4 -1
  140. package/dist/es6/select/lib/hooks/useSelectInput.d.ts.map +1 -1
  141. package/dist/es6/select/lib/hooks/useSelectInput.js +14 -5
  142. package/dist/es6/switch/lib/Switch.js +13 -13
  143. package/dist/es6/table/lib/Table.js +2 -2
  144. package/dist/es6/table/lib/TableBody.js +2 -2
  145. package/dist/es6/table/lib/TableCaption.js +2 -2
  146. package/dist/es6/table/lib/TableCell.js +2 -2
  147. package/dist/es6/table/lib/TableFooter.js +2 -2
  148. package/dist/es6/table/lib/TableHead.js +2 -2
  149. package/dist/es6/table/lib/TableHeader.js +2 -2
  150. package/dist/es6/table/lib/TableRow.js +2 -2
  151. package/dist/es6/tabs/lib/TabsItem.d.ts.map +1 -1
  152. package/dist/es6/tabs/lib/TabsItem.js +5 -13
  153. package/dist/es6/tabs/lib/useTabsModel.d.ts.map +1 -1
  154. package/dist/es6/text/lib/LabelText.d.ts.map +1 -1
  155. package/dist/es6/text/lib/LabelText.js +12 -28
  156. package/dist/es6/text/lib/Text.d.ts +103 -0
  157. package/dist/es6/text/lib/Text.d.ts.map +1 -1
  158. package/dist/es6/text/lib/Text.js +31 -28
  159. package/dist/es6/tooltip/lib/OverflowTooltip.d.ts.map +1 -1
  160. package/dist/es6/tooltip/lib/OverflowTooltip.js +2 -3
  161. package/icon/index.ts +1 -1
  162. package/icon/lib/AccentIcon.tsx +48 -10
  163. package/icon/lib/AppletIcon.tsx +53 -12
  164. package/icon/lib/Graphic.tsx +43 -10
  165. package/icon/lib/Svg.tsx +36 -19
  166. package/icon/lib/SystemIcon.tsx +134 -39
  167. package/icon/lib/SystemIconCircle.tsx +42 -47
  168. package/package.json +5 -5
  169. package/select/lib/hooks/useSelectInput.ts +24 -8
  170. package/tabs/lib/TabsItem.tsx +6 -13
  171. package/tabs/lib/useTabsModel.tsx +0 -1
  172. package/text/lib/LabelText.tsx +11 -63
  173. package/text/lib/Text.tsx +65 -62
  174. package/tooltip/lib/OverflowTooltip.tsx +2 -3
  175. package/dist/commonjs/icon/lib/Icon.d.ts +0 -9
  176. package/dist/commonjs/icon/lib/Icon.d.ts.map +0 -1
  177. package/dist/commonjs/icon/lib/Icon.js +0 -40
  178. package/dist/es6/icon/lib/Icon.d.ts +0 -9
  179. package/dist/es6/icon/lib/Icon.d.ts.map +0 -1
  180. package/dist/es6/icon/lib/Icon.js +0 -18
  181. package/icon/lib/Icon.tsx +0 -38
@@ -6,8 +6,7 @@ import {ListBox, ListBoxProps} from '@workday/canvas-kit-react/collection';
6
6
  import {system} from '@workday/canvas-tokens-web';
7
7
 
8
8
  import {useComboboxModel} from './hooks/useComboboxModel';
9
- import {createStencil, cssVar} from '@workday/canvas-kit-styling';
10
- import {mergeStyles} from '@workday/canvas-kit-react/layout';
9
+ import {createStencil, cssVar, handleCsProp} from '@workday/canvas-kit-styling';
11
10
 
12
11
  export interface ComboboxMenuListProps<T = any> extends ListBoxProps<T> {}
13
12
 
@@ -24,7 +23,7 @@ export const useComboboxMenuList = createElemPropsHook(useMenuModel)(model => {
24
23
  } as const;
25
24
  });
26
25
 
27
- const comoboxMenuListStencil = createStencil({
26
+ const comboboxMenuListStencil = createStencil({
28
27
  base: {},
29
28
  extends: menuListStencil,
30
29
  });
@@ -38,7 +37,7 @@ export const ComboboxMenuList = createSubcomponent('ul')({
38
37
  as={Element}
39
38
  model={model}
40
39
  marginY={cssVar(system.space.x2)}
41
- {...mergeStyles(elemProps, comoboxMenuListStencil({orientation: model.state.orientation}))}
40
+ {...handleCsProp(elemProps, comboboxMenuListStencil({orientation: model.state.orientation}))}
42
41
  >
43
42
  {children}
44
43
  </ListBox>
@@ -24,16 +24,16 @@ const React = __importStar(require("react"));
24
24
  const common_1 = require("@workday/canvas-kit-react/common");
25
25
  const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
26
26
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
27
- const grow = canvas_kit_styling_1.keyframes({ name: "b0dw69", styles: "from{transform:scale(0.85);}to{transform:scale(1.0);}" });
27
+ const grow = canvas_kit_styling_1.keyframes({ name: "d9cb82", styles: "from{transform:scale(0.85);}to{transform:scale(1.0);}" });
28
28
  const countBadgeStencil = canvas_kit_styling_1.createStencil({
29
- base: { name: "10yvklm", styles: "align-items:center;animation:animation-b0dw69 0.2s ease;border-radius:var(--cnvs-sys-shape-round, calc(0.25rem * 250));box-sizing:border-box;display:inline-flex;font-family:var(--cnvs-sys-font-family-default, \"Roboto\");font-size:var(--cnvs-sys-font-size-subtext-medium, 0.75rem);font-weight:var(--cnvs-sys-font-weight-bold, 700);height:1.25rem;justify-content:center;line-height:1.25rem;min-width:1.25rem;padding:0 0.40625rem;" },
29
+ base: { name: "b5e677", styles: "align-items:center;animation:animation-d9cb82 0.2s ease;border-radius:var(--cnvs-sys-shape-round);box-sizing:border-box;display:inline-flex;font-family:var(--cnvs-sys-font-family-default);font-size:var(--cnvs-sys-font-size-subtext-medium);font-weight:var(--cnvs-sys-font-weight-bold);height:1.25rem;justify-content:center;line-height:1.25rem;min-width:1.25rem;padding:0 0.40625rem;" },
30
30
  modifiers: {
31
- modifiers: {
32
- default: { name: "ls097g", styles: "background:var(--cnvs-base-palette-cinnamon-500, rgba(222,46,33,1));color:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));text-shadow:0 0 0.0625rem rgba(0,0,0, 0.35);" },
33
- inverse: { name: "lr1pbf", styles: "background:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));box-shadow:0 0.0625rem 0.125rem rgba(0,0,0, 0.25);color:var(--cnvs-base-palette-blueberry-400, rgba(8,117,225,1));" }
31
+ variant: {
32
+ default: { name: "7f4c93", styles: "background:var(--cnvs-base-palette-cinnamon-500);color:var(--cnvs-base-palette-french-vanilla-100);text-shadow:0 0 0.0625rem rgba(0,0,0, 0.35);" },
33
+ inverse: { name: "ed8e67", styles: "background:var(--cnvs-base-palette-french-vanilla-100);box-shadow:0 0.0625rem 0.125rem rgba(0,0,0, 0.25);color:var(--cnvs-base-palette-blueberry-400);" }
34
34
  }
35
35
  }
36
- }, "count-badge");
36
+ }, "cnvs-count-badge");
37
37
  /**
38
38
  * `CountBadge` provides a quantity-based summary with dynamic values.
39
39
  */
@@ -47,5 +47,5 @@ exports.BreadcrumbsItem = common_1.createSubcomponent('li')({
47
47
  })(({ children, ...elemProps }, Element) => {
48
48
  return (React.createElement(layout_1.Flex, Object.assign({ as: Element, alignItems: "center", whiteSpace: "nowrap" }, elemProps),
49
49
  children,
50
- React.createElement(icon_1.SystemIcon, { icon: canvas_system_icons_web_1.chevronRightSmallIcon, color: tokens_1.colors.licorice200, colorHover: tokens_1.colors.licorice200, size: 20, height: tokens_1.space.l, width: tokens_1.space.l, shouldMirror: common_1.useIsRTL(), styles: { justifyContent: 'center', alignItems: 'center', display: 'inline-flex' }, "aria-hidden": true })));
50
+ React.createElement(icon_1.SystemIcon, { icon: canvas_system_icons_web_1.chevronRightSmallIcon, color: tokens_1.colors.licorice200, colorHover: tokens_1.colors.licorice200, size: 20, height: tokens_1.space.l, width: tokens_1.space.l, shouldMirror: common_1.useIsRTL(), cs: { justifyContent: 'center', alignItems: 'center', display: 'inline-flex' }, "aria-hidden": true })));
51
51
  });
@@ -41,5 +41,5 @@ exports.BreadcrumbsOverflowButton = common_1.createSubcomponent('button')({
41
41
  })(({ style, ...elemProps }, Element) => {
42
42
  return (React.createElement(layout_1.Flex, Object.assign({ alignItems: "center" }, style),
43
43
  React.createElement(button_1.TertiaryButton, Object.assign({ as: Element, icon: canvas_system_icons_web_1.relatedActionsIcon }, elemProps)),
44
- React.createElement(icon_1.SystemIcon, { icon: canvas_system_icons_web_1.chevronRightSmallIcon, color: tokens_1.colors.licorice200, colorHover: tokens_1.colors.licorice200, size: 20, height: tokens_1.space.l, width: tokens_1.space.l, shouldMirror: common_1.useIsRTL(), styles: { justifyContent: 'center', alignItems: 'center', display: 'inline-flex' }, "aria-hidden": true })));
44
+ React.createElement(icon_1.SystemIcon, { icon: canvas_system_icons_web_1.chevronRightSmallIcon, color: tokens_1.colors.licorice200, colorHover: tokens_1.colors.licorice200, size: 20, height: tokens_1.space.l, width: tokens_1.space.l, shouldMirror: common_1.useIsRTL(), cs: { justifyContent: 'center', alignItems: 'center', display: 'inline-flex' }, "aria-hidden": true })));
45
45
  });
@@ -1 +1 @@
1
- {"version":3,"file":"BaseButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/BaseButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAkB,cAAc,EAAY,MAAM,kCAAkC,CAAC;AAG5F,OAAO,EAAC,eAAe,EAAC,MAAM,gCAAgC,CAAC;AAE/D,OAAO,EAAC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AACjE,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAE9D,MAAM,WAAW,oBAAqB,SAAQ,OAAO,CAAC,eAAe,CAAC,EAAE,cAAc;IACpF;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;GAIG;AACH,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,oBAAoB,EAAE,KAAK,CAAC;CAAG;AAE7E;;GAEG;AACH,eAAO,MAAM,UAAU;;;;;;CAmDtB,CAAC;AAsFF;;;;;GAKG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;EA4E1B,CAAC;AAEH,wBAAgB,UAAU,CAAC,MAAM,GAAE,MAAW,UAE7C;AAED,wBAAgB,eAAe,CAC7B,IAAI,CAAC,EAAE,MAAM,OAAO,eAAe,CAAC,IAAI,EACxC,YAAY,CAAC,EAAE,aAAa,EAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GACzB,MAAM,OAAO,eAAe,CAAC,YAAY,CAE3C;AAED;;GAEG;AACH,eAAO,MAAM,UAAU;;;CAyCrB,CAAC"}
1
+ {"version":3,"file":"BaseButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/BaseButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAkB,cAAc,EAAY,MAAM,kCAAkC,CAAC;AAG5F,OAAO,EAAC,eAAe,EAAoB,MAAM,gCAAgC,CAAC;AAElF,OAAO,EAAC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AACjE,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAE9D,MAAM,WAAW,oBAAqB,SAAQ,OAAO,CAAC,eAAe,CAAC,EAAE,cAAc;IACpF;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;GAIG;AACH,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,oBAAoB,EAAE,KAAK,CAAC;CAAG;AAE7E;;GAEG;AACH,eAAO,MAAM,UAAU;;;;;;CAmDtB,CAAC;AAqGF;;;;;GAKG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;EA4E1B,CAAC;AAEH,wBAAgB,UAAU,CAAC,MAAM,GAAE,MAAW,UAE7C;AAED,wBAAgB,eAAe,CAC7B,IAAI,CAAC,EAAE,MAAM,OAAO,eAAe,CAAC,IAAI,EACxC,YAAY,CAAC,EAAE,aAAa,EAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GACzB,MAAM,OAAO,eAAe,CAAC,YAAY,CAE3C;AAED;;GAEG;AACH,eAAO,MAAM,UAAU;;;CAyCrB,CAAC"}
@@ -26,6 +26,7 @@ const ButtonLabel_1 = require("../lib/parts/ButtonLabel");
26
26
  const common_1 = require("@workday/canvas-kit-react/common");
27
27
  const layout_1 = require("@workday/canvas-kit-react/layout");
28
28
  const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
29
+ const icon_1 = require("@workday/canvas-kit-react/icon");
29
30
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
30
31
  /**
31
32
  * Temporary css variables to be used across all Buttons.
@@ -40,7 +41,7 @@ exports.buttonVars = {
40
41
  /**
41
42
  * Base styles for Buttons.
42
43
  */
43
- const baseButtonStyles = canvas_kit_styling_1.createStyles({ name: "s5s586", styles: "font-family:\"Roboto\", \"Helvetica Neue\", \"Helvetica\", Arial, sans-serif;font-size:0.875rem;line-height:normal;letter-spacing:0.015rem;font-weight:bold;background-color:var(--cnvs-button-default-background, transparent);color:var(--cnvs-button-default-label-emotion-safe, var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)));border-width:1px;border-style:solid;gap:var(--cnvs-sys-space-x2, calc(0.25rem * 2));border-color:var(--cnvs-button-default-border, transparent);cursor:pointer;display:inline-flex;box-shadow:none;align-items:center;justify-content:center;box-sizing:border-box;outline:2px transparent;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-radius:var(--cnvs-button-default-borderRadius, var(--cnvs-sys-shape-round, calc(0.25rem * 250)));position:relative;vertical-align:middle;overflow:hidden;transition:box-shadow 120ms linear, border 120ms linear, background-color 120ms linear, color 120ms linear;&:disabled, &:disabled:active, &.disabled{cursor:default;box-shadow:none;opacity:var(--cnvs-button-disabled-opacity, 1);}& span .wd-icon-fill, & span .wd-icon-accent, & span .wd-icon-accent2{transition-duration:40ms;fill:var(--cnvs-button-default-icon, var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)));}.wd-icon-background ~ .wd-icon-accent, .wd-icon-background ~ .wd-icon-accent2{fill:var(--cnvs-button-default-icon, var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)));}&:focus-visible, &.focus{background-color:var(--cnvs-button-focus-background, transparent);border-color:var(--cnvs-button-focus-border, transparent);color:var(--cnvs-button-focus-label-emotion-safe, var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)));& span .wd-icon-fill, & span .wd-icon-accent, & span .wd-icon-accent2{fill:var(--cnvs-button-focus-icon, var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)));}box-shadow:0 0 0 2px var(--cnvs-button-focus-boxShadowInner, var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1))), 0 0 0 4px var(--cnvs-button-focus-boxShadowOuter, var(--cnvs-brand-primary-base, rgba(8,117,225,1)));}&:hover, &.hover{background-color:var(--cnvs-button-hover-background, var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1)));border-color:var(--cnvs-button-hover-border, transparent);color:var(--cnvs-button-hover-label-emotion-safe, var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1)));& span .wd-icon-fill, & span .wd-icon-accent, & span .wd-icon-accent2{fill:var(--cnvs-button-hover-icon, var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1)));}}&:hover:active{transition-duration:40ms;}&:active, &.active{background-color:var(--cnvs-button-active-background, transparent);border-color:var(--cnvs-button-active-border, transparent);color:var(--cnvs-button-active-label-emotion-safe, var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)));& span .wd-icon-fill, & span .wd-icon-accent, & span .wd-icon-accent2{fill:var(--cnvs-button-active-icon, var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)));}}&:disabled, &.disabled{background-color:var(--cnvs-button-disabled-background, transparent);border-color:var(--cnvs-button-disabled-border, transparent);color:var(--cnvs-button-disabled-label-emotion-safe, var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)));& span .wd-icon-fill, & span .wd-icon-accent, & span .wd-icon-accent2{fill:var(--cnvs-button-disabled-icon, var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)));}}" });
44
+ const baseButtonStyles = canvas_kit_styling_1.createStyles({ name: "b837cf", styles: "font-family:\"Roboto\", \"Helvetica Neue\", \"Helvetica\", Arial, sans-serif;font-size:0.875rem;line-height:normal;letter-spacing:0.015rem;font-weight:bold;background-color:var(--cnvs-button-default-background, transparent);color:var(--cnvs-button-default-label-emotion-safe, var(--cnvs-base-palette-black-pepper-400));border-width:1px;border-style:solid;gap:var(--cnvs-sys-space-x2);border-color:var(--cnvs-button-default-border, transparent);cursor:pointer;display:inline-flex;box-shadow:none;align-items:center;justify-content:center;box-sizing:border-box;outline:2px transparent;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-radius:var(--cnvs-button-default-borderRadius, var(--cnvs-sys-shape-round));position:relative;vertical-align:middle;overflow:hidden;--cnvs-system-icon-color:var(--cnvs-button-default-icon, var(--cnvs-base-palette-black-pepper-400));transition:box-shadow 120ms linear, border 120ms linear, background-color 120ms linear, color 120ms linear;&:disabled, &:disabled:active, &.disabled{cursor:default;box-shadow:none;opacity:var(--cnvs-button-disabled-opacity, 1);}&:focus-visible, &.focus{background-color:var(--cnvs-button-focus-background, transparent);border-color:var(--cnvs-button-focus-border, transparent);color:var(--cnvs-button-focus-label-emotion-safe, var(--cnvs-base-palette-black-pepper-400));--cnvs-system-icon-color:var(--cnvs-button-focus-icon, var(--cnvs-base-palette-black-pepper-400));box-shadow:0 0 0 2px var(--cnvs-button-focus-boxShadowInner, var(--cnvs-base-palette-french-vanilla-100)), 0 0 0 4px var(--cnvs-button-focus-boxShadowOuter, var(--cnvs-brand-primary-base));}&:hover, &.hover{background-color:var(--cnvs-button-hover-background, var(--cnvs-base-palette-black-pepper-500));border-color:var(--cnvs-button-hover-border, transparent);color:var(--cnvs-button-hover-label-emotion-safe, var(--cnvs-base-palette-black-pepper-500));--cnvs-system-icon-color:var(--cnvs-button-hover-icon, var(--cnvs-base-palette-black-pepper-500));}&:hover:active{transition-duration:40ms;}&:active, &.active{background-color:var(--cnvs-button-active-background, transparent);border-color:var(--cnvs-button-active-border, transparent);color:var(--cnvs-button-active-label-emotion-safe, var(--cnvs-base-palette-black-pepper-400));--cnvs-system-icon-color:var(--cnvs-button-active-icon, var(--cnvs-base-palette-black-pepper-400));}&:disabled, &.disabled{background-color:var(--cnvs-button-disabled-background, transparent);border-color:var(--cnvs-button-disabled-border, transparent);color:var(--cnvs-button-disabled-label-emotion-safe, var(--cnvs-base-palette-black-pepper-400));--cnvs-system-icon-color:var(--cnvs-button-disabled-icon, var(--cnvs-base-palette-black-pepper-400));}" });
44
45
  /**
45
46
  * Button modifiers that will overwrite the base styles of Buttons.
46
47
  * - `Size`: These modifiers will dictate a size of a Button and has a set of styles to associated with it.
@@ -49,24 +50,24 @@ const baseButtonStyles = canvas_kit_styling_1.createStyles({ name: "s5s586", sty
49
50
  */
50
51
  exports.buttonModifiers = canvas_kit_styling_1.createModifiers({
51
52
  size: {
52
- large: canvas_kit_styling_1.createStyles({ name: "1vuu82a", styles: "font-size:var(--cnvs-sys-space-x4, calc(0.25rem * 4));line-height:var(--cnvs-sys-space-x6, calc(0.25rem * 6));letter-spacing:0.01rem;height:48px;padding-inline:var(--cnvs-sys-space-x8, calc(0.25rem * 8));min-width:112px;" }),
53
- medium: canvas_kit_styling_1.createStyles({ name: "1tv5kp2", styles: "font-size:0.875rem;letter-spacing:0.015rem;min-width:96px;padding-inline:var(--cnvs-sys-space-x6, calc(0.25rem * 6));height:var(--cnvs-sys-space-x10, calc(0.25rem * 10));" }),
54
- small: canvas_kit_styling_1.createStyles({ name: "1bibd9a", styles: "font-size:0.875rem;letter-spacing:0.015rem;height:var(--cnvs-sys-space-x8, calc(0.25rem * 8));min-width:var(--cnvs-sys-space-x20, calc(0.25rem * 20));padding-inline:var(--cnvs-sys-space-x4, calc(0.25rem * 4));gap:var(--cnvs-sys-space-x1, 0.25rem);" }),
55
- extraSmall: canvas_kit_styling_1.createStyles({ name: "jxl8ry", styles: "font-size:0.75rem;line-height:var(--cnvs-sys-space-x4, calc(0.25rem * 4));letter-spacing:0.02rem;height:var(--cnvs-sys-space-x6, calc(0.25rem * 6));min-width:auto;padding-inline:var(--cnvs-sys-space-x3, calc(0.25rem * 3));gap:var(--cnvs-sys-space-x1, 0.25rem);" }),
53
+ large: canvas_kit_styling_1.createStyles({ name: "bac76a", styles: "font-size:var(--cnvs-sys-space-x4);line-height:var(--cnvs-sys-space-x6);letter-spacing:0.01rem;height:48px;padding-inline:var(--cnvs-sys-space-x8);min-width:112px;" }),
54
+ medium: canvas_kit_styling_1.createStyles({ name: "384911", styles: "font-size:0.875rem;letter-spacing:0.015rem;min-width:96px;padding-inline:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x10);" }),
55
+ small: canvas_kit_styling_1.createStyles({ name: "d66a85", styles: "font-size:0.875rem;letter-spacing:0.015rem;height:var(--cnvs-sys-space-x8);min-width:var(--cnvs-sys-space-x20);padding-inline:var(--cnvs-sys-space-x4);gap:var(--cnvs-sys-space-x1);" }),
56
+ extraSmall: canvas_kit_styling_1.createStyles({ name: "6f327c", styles: "font-size:0.75rem;line-height:var(--cnvs-sys-space-x4);letter-spacing:0.02rem;height:var(--cnvs-sys-space-x6);min-width:auto;padding-inline:var(--cnvs-sys-space-x3);gap:var(--cnvs-sys-space-x1);" }),
56
57
  },
57
58
  iconPosition: {
58
- largeOnly: canvas_kit_styling_1.createStyles({ name: "17x7zv9", styles: "padding:0;min-width:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) * 3);" }),
59
- largeStart: canvas_kit_styling_1.createStyles({ name: "6nuy87", styles: "padding-inline-start:var(--cnvs-sys-space-x6, calc(0.25rem * 6));padding-inline-end:var(--cnvs-sys-space-x8, calc(0.25rem * 8));" }),
60
- largeEnd: canvas_kit_styling_1.createStyles({ name: "sco5n0", styles: "padding-inline-start:var(--cnvs-sys-space-x8, calc(0.25rem * 8));padding-inline-end:var(--cnvs-sys-space-x6, calc(0.25rem * 6));" }),
61
- mediumOnly: canvas_kit_styling_1.createStyles({ name: "184b2d3", styles: "padding:0;min-width:var(--cnvs-sys-space-x10, calc(0.25rem * 10));" }),
62
- mediumStart: canvas_kit_styling_1.createStyles({ name: "1spsu3s", styles: "padding-inline-start:calc(var(--cnvs-sys-space-x1, 0.25rem) * 5);padding-inline-end:var(--cnvs-sys-space-x6, calc(0.25rem * 6));" }),
63
- mediumEnd: canvas_kit_styling_1.createStyles({ name: "aawort", styles: "padding-inline-start:var(--cnvs-sys-space-x6, calc(0.25rem * 6));padding-inline-end:calc(var(--cnvs-sys-space-x1, 0.25rem) * 5);" }),
64
- smallOnly: canvas_kit_styling_1.createStyles({ name: "4un8za", styles: "padding:0;min-width:var(--cnvs-sys-space-x8, calc(0.25rem * 8));" }),
65
- smallStart: canvas_kit_styling_1.createStyles({ name: "996eys", styles: "padding-inline-start:var(--cnvs-sys-space-x3, calc(0.25rem * 3));padding-inline-end:var(--cnvs-sys-space-x4, calc(0.25rem * 4));" }),
66
- smallEnd: canvas_kit_styling_1.createStyles({ name: "1khaens", styles: "padding-inline-start:var(--cnvs-sys-space-x4, calc(0.25rem * 4));padding-inline-end:var(--cnvs-sys-space-x3, calc(0.25rem * 3));" }),
67
- extraSmallOnly: canvas_kit_styling_1.createStyles({ name: "uyhf8a", styles: "padding:0;min-width:var(--cnvs-sys-space-x6, calc(0.25rem * 6));" }),
68
- extraSmallStart: canvas_kit_styling_1.createStyles({ name: "1m2nnkm", styles: "padding-inline-start:var(--cnvs-sys-space-x2, calc(0.25rem * 2));padding-inline-end:var(--cnvs-sys-space-x3, calc(0.25rem * 3));" }),
69
- extraSmallEnd: canvas_kit_styling_1.createStyles({ name: "11knxyn", styles: "padding-inline-start:var(--cnvs-sys-space-x3, calc(0.25rem * 3));padding-inline-end:var(--cnvs-sys-space-x2, calc(0.25rem * 2));" }),
59
+ largeOnly: canvas_kit_styling_1.createStyles({ name: "3bae83", styles: "padding:0;min-width:calc(var(--cnvs-sys-space-x4) * 3);" }),
60
+ largeStart: canvas_kit_styling_1.createStyles({ name: "7a1e10", styles: "padding-inline-start:var(--cnvs-sys-space-x6);padding-inline-end:var(--cnvs-sys-space-x8);" }),
61
+ largeEnd: canvas_kit_styling_1.createStyles({ name: "9d8168", styles: "padding-inline-start:var(--cnvs-sys-space-x8);padding-inline-end:var(--cnvs-sys-space-x6);" }),
62
+ mediumOnly: canvas_kit_styling_1.createStyles({ name: "c32cda", styles: "padding:0;min-width:var(--cnvs-sys-space-x10);" }),
63
+ mediumStart: canvas_kit_styling_1.createStyles({ name: "7464e4", styles: "padding-inline-start:calc(var(--cnvs-sys-space-x1) * 5);padding-inline-end:var(--cnvs-sys-space-x6);" }),
64
+ mediumEnd: canvas_kit_styling_1.createStyles({ name: "9a9708", styles: "padding-inline-start:var(--cnvs-sys-space-x6);padding-inline-end:calc(var(--cnvs-sys-space-x1) * 5);" }),
65
+ smallOnly: canvas_kit_styling_1.createStyles({ name: "3224de", styles: "padding:0;min-width:var(--cnvs-sys-space-x8);" }),
66
+ smallStart: canvas_kit_styling_1.createStyles({ name: "0b192b", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x4);" }),
67
+ smallEnd: canvas_kit_styling_1.createStyles({ name: "84037d", styles: "padding-inline-start:var(--cnvs-sys-space-x4);padding-inline-end:var(--cnvs-sys-space-x3);" }),
68
+ extraSmallOnly: canvas_kit_styling_1.createStyles({ name: "2a4f9f", styles: "padding:0;min-width:var(--cnvs-sys-space-x6);" }),
69
+ extraSmallStart: canvas_kit_styling_1.createStyles({ name: "5ef1d1", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }),
70
+ extraSmallEnd: canvas_kit_styling_1.createStyles({ name: "e26189", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }),
70
71
  },
71
72
  });
72
73
  function capitalize(string = '') {
@@ -1 +1 @@
1
- {"version":3,"file":"DeleteButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/DeleteButton.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAS,WAAW,EAAC,MAAM,UAAU,CAAC;AAE7C;;;;GAIG;AACH,MAAM,WAAW,iBAAkB,SAAQ,WAAW;CAAG;AAoCzD;;;;GAIG;AACH,eAAO,MAAM,YAAY,0FASvB,CAAC"}
1
+ {"version":3,"file":"DeleteButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/DeleteButton.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAS,WAAW,EAAC,MAAM,UAAU,CAAC;AAG7C;;;;GAIG;AACH,MAAM,WAAW,iBAAkB,SAAQ,WAAW;CAAG;AAoCzD;;;;GAIG;AACH,eAAO,MAAM,YAAY,0FASvB,CAAC"}
@@ -27,7 +27,8 @@ const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
27
27
  const layout_1 = require("@workday/canvas-kit-react/layout");
28
28
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
29
29
  const Button_1 = require("./Button");
30
- const deleteStyles = canvas_kit_styling_1.createStyles({ name: "1qtsx01", styles: "--cnvs-button-default-background:var(--cnvs-brand-error-base, rgba(222,46,33,1));--cnvs-button-default-border:transparent;--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-round, calc(0.25rem * 250));--cnvs-button-default-label-emotion-safe:var(--cnvs-brand-error-accent, rgba(255,255,255,1));--cnvs-button-default-icon:var(--cnvs-brand-error-accent, rgba(255,255,255,1));&:hover, &.hover{--cnvs-button-hover-background:var(--cnvs-brand-error-dark, rgba(163,27,18,1));--cnvs-button-hover-border:transparent;--cnvs-button-hover-label-emotion-safe:var(--cnvs-brand-error-accent, rgba(255,255,255,1));--cnvs-button-hover-icon:var(--cnvs-brand-error-accent, rgba(255,255,255,1));}&:focus-visible, &.focus{--cnvs-button-focus-background:var(--cnvs-brand-error-base, rgba(222,46,33,1));--cnvs-button-focus-border:transparent;--cnvs-button-focus-label-emotion-safe:var(--cnvs-brand-error-accent, rgba(255,255,255,1));--cnvs-button-focus-icon:var(--cnvs-brand-error-accent, rgba(255,255,255,1));--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-focus-boxShadowOuter:var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&:active, &.active{--cnvs-button-active-background:var(--cnvs-brand-error-darkest, rgba(128,22,14,1));--cnvs-button-active-border:transparent;--cnvs-button-active-label-emotion-safe:var(--cnvs-brand-error-accent, rgba(255,255,255,1));--cnvs-button-active-icon:var(--cnvs-brand-error-accent, rgba(255,255,255,1));}&:disabled, &:active:disabled, &:focus:disabled, &:hover:disabled{--cnvs-button-disabled-background:var(--cnvs-brand-error-base, rgba(222,46,33,1));--cnvs-button-disabled-label-emotion-safe:var(--cnvs-brand-error-accent, rgba(255,255,255,1));--cnvs-button-disabled-icon:var(--cnvs-brand-error-accent, rgba(255,255,255,1));--cnvs-button-disabled-opacity:0.4;}" });
30
+ const icon_1 = require("../../icon");
31
+ const deleteStyles = canvas_kit_styling_1.createStyles({ name: "16dcc7", styles: "--cnvs-button-default-background:var(--cnvs-brand-error-base);--cnvs-button-default-border:transparent;--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-round);--cnvs-button-default-label-emotion-safe:var(--cnvs-brand-error-accent);--cnvs-system-icon-color:var(--cnvs-brand-error-accent);&:focus-visible, &.focus{--cnvs-button-focus-background:var(--cnvs-brand-error-base);--cnvs-button-focus-border:transparent;--cnvs-button-focus-label-emotion-safe:var(--cnvs-brand-error-accent);--cnvs-system-icon-color:var(--cnvs-brand-error-accent);--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-focus-boxShadowOuter:var(--cnvs-brand-common-focus-outline);}&:hover, &.hover{--cnvs-button-hover-background:var(--cnvs-brand-error-dark);--cnvs-button-hover-border:transparent;--cnvs-button-hover-label-emotion-safe:var(--cnvs-brand-error-accent);--cnvs-system-icon-color:var(--cnvs-brand-error-accent);}&:active, &.active{--cnvs-button-active-background:var(--cnvs-brand-error-darkest);--cnvs-button-active-border:transparent;--cnvs-button-active-label-emotion-safe:var(--cnvs-brand-error-accent);--cnvs-system-icon-color:var(--cnvs-brand-error-accent);}&:disabled, &.disabled{--cnvs-button-disabled-background:var(--cnvs-brand-error-base);--cnvs-button-disabled-label-emotion-safe:var(--cnvs-brand-error-accent);--cnvs-system-icon-color:var(--cnvs-brand-error-accent);--cnvs-button-disabled-opacity:0.4;}" });
31
32
  /**
32
33
  * Use sparingly for destructive actions that will result in data loss, can’t be undone, or will
33
34
  * have significant consequences. They commonly appear in confirmation dialogs as the final
@@ -34,5 +34,5 @@ exports.ExternalHyperlink = common_1.createComponent('a')({
34
34
  displayName: 'ExternalHyperlink',
35
35
  Component: ({ children, iconLabel = 'Opens link in new window', ...elemProps }, ref) => (react_1.default.createElement(Anchor, Object.assign({ ref: ref, target: "_blank", rel: "noreferrer" }, elemProps),
36
36
  react_1.default.createElement("span", null, children),
37
- react_1.default.createElement(StyledSystemIcon, { icon: canvas_system_icons_web_1.extLinkIcon, role: "img", "aria-label": iconLabel, size: iconSize, styles: { ['& svg']: { minWidth: minIconSize, minHeight: minIconSize } } }))),
37
+ react_1.default.createElement(StyledSystemIcon, { icon: canvas_system_icons_web_1.extLinkIcon, role: "img", "aria-label": iconLabel, size: iconSize, cs: { '& svg': { minWidth: minIconSize, minHeight: minIconSize } } }))),
38
38
  });
@@ -1 +1 @@
1
- {"version":3,"file":"PrimaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/PrimaryButton.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAS,WAAW,EAAC,MAAM,UAAU,CAAC;AAE7C;;;;GAIG;AACH,MAAM,WAAW,kBAAmB,SAAQ,WAAW;IACrD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAkCD,eAAO,MAAM,sBAAsB;;;;EA4BjC,CAAC;AAEH,eAAO,MAAM,aAAa,2FAaxB,CAAC"}
1
+ {"version":3,"file":"PrimaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/PrimaryButton.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAS,WAAW,EAAC,MAAM,UAAU,CAAC;AAE7C;;;;GAIG;AACH,MAAM,WAAW,kBAAmB,SAAQ,WAAW;IACrD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAqCD,eAAO,MAAM,sBAAsB;;;;EA+BjC,CAAC;AAEH,eAAO,MAAM,aAAa,2FAaxB,CAAC"}
@@ -24,13 +24,14 @@ const React = __importStar(require("react"));
24
24
  const BaseButton_1 = require("./BaseButton");
25
25
  const common_1 = require("@workday/canvas-kit-react/common");
26
26
  const layout_1 = require("@workday/canvas-kit-react/layout");
27
+ const icon_1 = require("@workday/canvas-kit-react/icon");
27
28
  const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
28
29
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
29
30
  const Button_1 = require("./Button");
30
- const primaryStyles = canvas_kit_styling_1.createStyles({ name: "1pt3ej4", styles: "--cnvs-button-default-background:var(--cnvs-brand-primary-base, rgba(8,117,225,1));--cnvs-button-default-border:transparent;--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-round, calc(0.25rem * 250));--cnvs-button-default-label-emotion-safe:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-default-icon:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-hover-background:var(--cnvs-brand-primary-dark, rgba(0,92,185,1));--cnvs-button-hover-border:transparent;--cnvs-button-hover-label-emotion-safe:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-hover-icon:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-focus-background:var(--cnvs-brand-primary-base, rgba(8,117,225,1));--cnvs-button-focus-border:transparent;--cnvs-button-focus-label-emotion-safe:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-focus-icon:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-focus-boxShadowOuter:var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));--cnvs-button-active-background:var(--cnvs-brand-primary-darkest, rgba(0,67,135,1));--cnvs-button-active-border:transparent;--cnvs-button-active-label-emotion-safe:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-active-icon:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-disabled-background:var(--cnvs-brand-primary-base, rgba(8,117,225,1));--cnvs-button-disabled-border:transparent;--cnvs-button-disabled-label-emotion-safe:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-disabled-opacity:0.4;--cnvs-button-disabled-icon:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));" });
31
+ const primaryStyles = canvas_kit_styling_1.createStyles({ name: "879de3", styles: "--cnvs-button-default-background:var(--cnvs-brand-primary-base);--cnvs-button-default-border:transparent;--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-round);--cnvs-button-default-label-emotion-safe:var(--cnvs-brand-primary-accent);--cnvs-system-icon-color:var(--cnvs-brand-primary-accent);&:focus-visible, &.focus{--cnvs-button-focus-background:var(--cnvs-brand-primary-base);--cnvs-button-focus-border:transparent;--cnvs-button-focus-label-emotion-safe:var(--cnvs-brand-primary-accent);--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-focus-boxShadowOuter:var(--cnvs-brand-common-focus-outline);--cnvs-system-icon-color:var(--cnvs-brand-primary-accent);}&:hover, &.hover{--cnvs-button-hover-background:var(--cnvs-brand-primary-dark);--cnvs-button-hover-border:transparent;--cnvs-button-hover-label-emotion-safe:var(--cnvs-brand-primary-accent);--cnvs-system-icon-color:var(--cnvs-brand-primary-accent);}&:active, &.active{--cnvs-button-active-background:var(--cnvs-brand-primary-darkest);--cnvs-button-active-border:transparent;--cnvs-button-active-label-emotion-safe:var(--cnvs-brand-primary-accent);--cnvs-system-icon-color:var(--cnvs-brand-primary-accent);}&:disabled, &.disabled{--cnvs-button-disabled-background:var(--cnvs-brand-primary-base);--cnvs-button-disabled-border:transparent;--cnvs-button-disabled-label-emotion-safe:var(--cnvs-brand-primary-accent);--cnvs-button-disabled-opacity:0.4;--cnvs-system-icon-color:var(--cnvs-brand-primary-accent);}" });
31
32
  exports.primaryButtonModifiers = canvas_kit_styling_1.createModifiers({
32
33
  variant: {
33
- inverse: canvas_kit_styling_1.createStyles({ name: "a2rvr", styles: "--cnvs-button-default-background:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-round, calc(0.25rem * 250));--cnvs-button-default-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-default-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-hover-background:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));--cnvs-button-hover-label-emotion-safe:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-hover-icon:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-focus-background:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-focus-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-boxShadowOuter:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-active-background:var(--cnvs-base-palette-soap-400, rgba(223,226,230,1));--cnvs-button-active-label-emotion-safe:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-active-icon:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-disabled-background:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-disabled-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-disabled-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));" }),
34
+ inverse: canvas_kit_styling_1.createStyles({ name: "d047e0", styles: "--cnvs-button-default-background:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-round);--cnvs-button-default-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);&:focus-visible, &.focus{--cnvs-button-focus-background:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-focus-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-focus-boxShadowOuter:var(--cnvs-base-palette-french-vanilla-100);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);}&:hover, &.hover{--cnvs-button-hover-background:var(--cnvs-base-palette-soap-300);--cnvs-button-hover-label-emotion-safe:var(--cnvs-base-palette-black-pepper-500);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-500);}&:active, &.active{--cnvs-button-active-background:var(--cnvs-base-palette-soap-400);--cnvs-button-active-label-emotion-safe:var(--cnvs-base-palette-black-pepper-500);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-500);}&:disabled, &.disabled{--cnvs-button-disabled-background:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-disabled-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);}" }),
34
35
  },
35
36
  });
36
37
  exports.PrimaryButton = common_1.createComponent('button')({
@@ -1 +1 @@
1
- {"version":3,"file":"SecondaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/SecondaryButton.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAS,WAAW,EAAC,MAAM,UAAU,CAAC;AAE7C;;;;GAIG;AACH,MAAM,WAAW,oBAAqB,SAAQ,WAAW;IACvD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAsDD,eAAO,MAAM,wBAAwB;;;;EA8CnC,CAAC;AAEH,eAAO,MAAM,eAAe,6FAa1B,CAAC"}
1
+ {"version":3,"file":"SecondaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/SecondaryButton.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAS,WAAW,EAAC,MAAM,UAAU,CAAC;AAG7C;;;;GAIG;AACH,MAAM,WAAW,oBAAqB,SAAQ,WAAW;IACvD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AA0CD,eAAO,MAAM,wBAAwB;;;;EAwCnC,CAAC;AAEH,eAAO,MAAM,eAAe,6FAa1B,CAAC"}
@@ -27,10 +27,11 @@ const layout_1 = require("@workday/canvas-kit-react/layout");
27
27
  const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
28
28
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
29
29
  const Button_1 = require("./Button");
30
- const secondaryStyles = canvas_kit_styling_1.createStyles({ name: "193160q", styles: "--cnvs-button-default-background:transparent;--cnvs-button-default-border:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-round, calc(0.25rem * 250));--cnvs-button-default-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-default-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-hover-background:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-hover-border:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-hover-label-emotion-safe:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-hover-icon:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-focus-background:transparent;--cnvs-button-focus-border:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-focus-boxShadowOuter:var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));--cnvs-button-active-background:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-active-border:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-active-label-emotion-safe:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-active-icon:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));--cnvs-button-disabled-background:transparent;--cnvs-button-disabled-border:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-disabled-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-disabled-opacity:0.4;--cnvs-button-disabled-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));" });
30
+ const icon_1 = require("../../icon");
31
+ const secondaryStyles = canvas_kit_styling_1.createStyles({ name: "536aff", styles: "--cnvs-button-default-background:transparent;--cnvs-button-default-border:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-round);--cnvs-button-default-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);&:focus-visible, &.focus{--cnvs-button-focus-background:transparent;--cnvs-button-focus-border:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-focus-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-focus-boxShadowOuter:var(--cnvs-brand-common-focus-outline);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);}&:hover, &.hover{--cnvs-button-hover-background:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-hover-border:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-hover-label-emotion-safe:var(--cnvs-brand-primary-accent);--cnvs-system-icon-color:var(--cnvs-brand-primary-accent);}&:active, &.active{--cnvs-button-active-background:var(--cnvs-base-palette-black-pepper-500);--cnvs-button-active-border:var(--cnvs-base-palette-black-pepper-500);--cnvs-button-active-label-emotion-safe:var(--cnvs-brand-primary-accent);--cnvs-system-icon-color:var(--cnvs-brand-primary-accent);}&:disabled, &.disabled{--cnvs-button-disabled-background:transparent;--cnvs-button-disabled-border:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-disabled-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-disabled-opacity:0.4;--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);}" });
31
32
  exports.secondaryButtonModifiers = canvas_kit_styling_1.createModifiers({
32
33
  variant: {
33
- inverse: canvas_kit_styling_1.createStyles({ name: "1ukv7d0", styles: "--cnvs-button-default-background:transparent;--cnvs-button-default-border:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-default-label-emotion-safe:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-default-icon:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-hover-background:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));--cnvs-button-hover-border:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));--cnvs-button-hover-label-emotion-safe:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-hover-icon:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-focus-background:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-focus-border:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-focus-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-boxShadowOuter:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-active-background:var(--cnvs-base-palette-soap-400, rgba(223,226,230,1));--cnvs-button-active-border:var(--cnvs-base-palette-soap-400, rgba(223,226,230,1));--cnvs-button-active-label-emotion-safe:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-active-icon:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-disabled-background:transparent;--cnvs-button-disabled-border:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-disabled-label-emotion-safe:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-disabled-icon:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));" }),
34
+ inverse: canvas_kit_styling_1.createStyles({ name: "672601", styles: "--cnvs-button-default-background:transparent;--cnvs-button-default-border:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-default-label-emotion-safe:var(--cnvs-base-palette-french-vanilla-100);--cnvs-system-icon-color:var(--cnvs-base-palette-french-vanilla-100);&:focus-visible, &.focus{--cnvs-button-focus-background:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-focus-border:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-focus-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-focus-boxShadowInner:var(--cnvs-base-palette-black-pepper-400);--cnvs-button-focus-boxShadowOuter:var(--cnvs-base-palette-french-vanilla-100);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);}&:hover, &.hover{--cnvs-button-hover-background:var(--cnvs-base-palette-soap-300);--cnvs-button-hover-border:var(--cnvs-base-palette-soap-300);--cnvs-button-hover-label-emotion-safe:var(--cnvs-base-palette-black-pepper-500);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-500);}&:active, &.active{--cnvs-button-active-background:var(--cnvs-base-palette-soap-400);--cnvs-button-active-border:var(--cnvs-base-palette-soap-400);--cnvs-button-active-label-emotion-safe:var(--cnvs-base-palette-black-pepper-500);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-500);}&:disabled, &.disabled{--cnvs-button-disabled-background:transparent;--cnvs-button-disabled-border:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-disabled-label-emotion-safe:var(--cnvs-base-palette-french-vanilla-100);--cnvs-system-icon-color:var(--cnvs-base-palette-french-vanilla-100);}" }),
34
35
  },
35
36
  });
36
37
  exports.SecondaryButton = common_1.createComponent('button')({
@@ -1 +1 @@
1
- {"version":3,"file":"TertiaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/TertiaryButton.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAS,WAAW,EAAC,MAAM,UAAU,CAAC;AAE7C;;;;GAIG;AACH,MAAM,WAAW,mBAAoB,SAAQ,WAAW;IACtD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AA+CD,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;EA0ElC,CAAC;AAEH,eAAO,MAAM,cAAc,4FA2CzB,CAAC"}
1
+ {"version":3,"file":"TertiaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/TertiaryButton.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAS,WAAW,EAAC,MAAM,UAAU,CAAC;AAG7C;;;;GAIG;AACH,MAAM,WAAW,mBAAoB,SAAQ,WAAW;IACtD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AA8CD,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;EAmFlC,CAAC;AAEH,eAAO,MAAM,cAAc,4FA2CzB,CAAC"}
@@ -28,27 +28,28 @@ const layout_1 = require("@workday/canvas-kit-react/layout");
28
28
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
29
29
  const tokens_1 = require("@workday/canvas-kit-react/tokens");
30
30
  const Button_1 = require("./Button");
31
- const tertiaryStyles = canvas_kit_styling_1.createStyles({ name: "140m1mb", styles: "padding-inline:var(--cnvs-sys-space-x2, calc(0.25rem * 2));min-width:auto;text-decoration:underline;border:0;--cnvs-button-default-background:transparent;--cnvs-button-default-border:transparent;--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-x1, 0.25rem);--cnvs-button-default-label-emotion-safe:var(--cnvs-brand-primary-base, rgba(8,117,225,1));--cnvs-button-default-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-hover-background:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));--cnvs-button-hover-border:transparent;--cnvs-button-hover-label-emotion-safe:var(--cnvs-brand-primary-dark, rgba(0,92,185,1));--cnvs-button-hover-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-background:transparent;--cnvs-button-focus-border:transparent;--cnvs-button-focus-label-emotion-safe:var(--cnvs-brand-primary-base, rgba(8,117,225,1));--cnvs-button-focus-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-boxShadowInner:var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));--cnvs-button-focus-boxShadowOuter:var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));--cnvs-button-active-background:var(--cnvs-base-palette-soap-400, rgba(223,226,230,1));--cnvs-button-active-border:transparent;--cnvs-button-active-label-emotion-safe:var(--cnvs-brand-primary-darkest, rgba(0,67,135,1));--cnvs-button-active-icon:var(--cnvs-base-palette-black-pepper-500, rgba(30,30,30,1));--cnvs-button-disabled-background:transparent;--cnvs-button-disabled-border:transparent;--cnvs-button-disabled-label-emotion-safe:var(--cnvs-brand-primary-base, rgba(8,117,225,1));--cnvs-button-disabled-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-disabled-opacity:0.4;&:focus-visible, &.focus{box-shadow:0 0 0 0px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 2px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}" });
31
+ const icon_1 = require("../../icon");
32
+ const tertiaryStyles = canvas_kit_styling_1.createStyles({ name: "4e035a", styles: "padding-inline:var(--cnvs-sys-space-x2);min-width:auto;text-decoration:underline;border:0;--cnvs-button-default-background:transparent;--cnvs-button-default-border:transparent;--cnvs-button-default-borderRadius:var(--cnvs-sys-shape-x1);--cnvs-button-default-label-emotion-safe:var(--cnvs-brand-primary-base);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);&:focus-visible, &.focus{--cnvs-button-focus-background:transparent;--cnvs-button-focus-border:transparent;--cnvs-button-focus-label-emotion-safe:var(--cnvs-brand-primary-base);--cnvs-button-focus-boxShadowInner:var(--cnvs-brand-common-focus-outline);--cnvs-button-focus-boxShadowOuter:var(--cnvs-brand-common-focus-outline);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);box-shadow:0 0 0 0px var(--cnvs-base-palette-french-vanilla-100), 0 0 0 2px var(--cnvs-brand-common-focus-outline);}&:hover, &.hover{--cnvs-button-hover-background:var(--cnvs-base-palette-soap-300);--cnvs-button-hover-border:transparent;--cnvs-button-hover-label-emotion-safe:var(--cnvs-brand-primary-dark);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);}&:active, &.active{--cnvs-button-active-background:var(--cnvs-base-palette-soap-400);--cnvs-button-active-border:transparent;--cnvs-button-active-label-emotion-safe:var(--cnvs-brand-primary-darkest);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-500);}&:disabled, &.disabled{--cnvs-button-disabled-background:transparent;--cnvs-button-disabled-border:transparent;--cnvs-button-disabled-label-emotion-safe:var(--cnvs-brand-primary-base);--cnvs-button-disabled-opacity:0.4;}" });
32
33
  exports.tertiaryButtonModifiers = canvas_kit_styling_1.createModifiers({
33
34
  isThemeable: {
34
- true: canvas_kit_styling_1.createStyles({ name: "1t7d7ry", styles: "--cnvs-button-default-icon:var(--cnvs-brand-primary-base, rgba(8,117,225,1));--cnvs-button-hover-icon:var(--cnvs-brand-primary-dark, rgba(0,92,185,1));--cnvs-button-focus-icon:var(--cnvs-brand-primary-base, rgba(8,117,225,1));--cnvs-button-active-icon:var(--cnvs-brand-primary-darkest, rgba(0,67,135,1));--cnvs-button-disabled-icon:var(--cnvs-brand-primary-base, rgba(8,117,225,1));" }),
35
+ true: canvas_kit_styling_1.createStyles({ name: "4874c5", styles: "--cnvs-system-icon-color:var(--cnvs-brand-primary-base);&:focus-visible, &.focus{--cnvs-system-icon-color:var(--cnvs-brand-primary-base);}&:hover, &.hover{--cnvs-system-icon-color:var(--cnvs-brand-primary-dark);}&:active, &.active{--cnvs-system-icon-color:var(--cnvs-brand-primary-darkest);}&:disabled, &.disabled{--cnvs-system-icon-color:var(--cnvs-brand-primary-base);}" }),
35
36
  },
36
37
  variant: {
37
- inverse: canvas_kit_styling_1.createStyles({ name: "eb23n9", styles: "--cnvs-button-default-background:transparent;--cnvs-button-default-border:transparent;--cnvs-button-default-label-emotion-safe:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-default-icon:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-hover-background:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-hover-border:transparent;--cnvs-button-hover-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-hover-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-background:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-focus-border:transparent;--cnvs-button-focus-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-focus-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-active-background:var(--cnvs-base-palette-soap-200, rgba(240,241,242,1));--cnvs-button-active-border:transparent;--cnvs-button-active-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-active-icon:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));--cnvs-button-disabled-background:transparent;--cnvs-button-disabled-border:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-disabled-label-emotion-safe:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));--cnvs-button-disabled-icon:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));&:focus-visible, &.focus{box-shadow:inset 0 0 0 2px var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)), 0 0 0 2px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));}" }),
38
+ inverse: canvas_kit_styling_1.createStyles({ name: "375434", styles: "--cnvs-button-default-background:transparent;--cnvs-button-default-border:transparent;--cnvs-button-default-label-emotion-safe:var(--cnvs-base-palette-french-vanilla-100);--cnvs-system-icon-color:var(--cnvs-base-palette-french-vanilla-100);&:focus-visible, &.focus{--cnvs-button-focus-background:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-focus-border:transparent;--cnvs-button-focus-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);box-shadow:inset 0 0 0 2px var(--cnvs-base-palette-black-pepper-400), 0 0 0 2px var(--cnvs-base-palette-french-vanilla-100);}&:hover, &.hover{--cnvs-button-hover-background:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-hover-border:transparent;--cnvs-button-hover-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);}&:active, &.active{--cnvs-button-active-background:var(--cnvs-base-palette-soap-200);--cnvs-button-active-border:transparent;--cnvs-button-active-label-emotion-safe:var(--cnvs-base-palette-black-pepper-400);--cnvs-system-icon-color:var(--cnvs-base-palette-black-pepper-400);}&:disabled, &.disabled{--cnvs-button-disabled-background:transparent;--cnvs-button-disabled-border:var(--cnvs-base-palette-french-vanilla-100);--cnvs-button-disabled-label-emotion-safe:var(--cnvs-base-palette-french-vanilla-100);--cnvs-system-icon-color:var(--cnvs-base-palette-french-vanilla-100);}" }),
38
39
  },
39
40
  iconPosition: {
40
- largeOnly: canvas_kit_styling_1.createStyles({ name: "xih0j4", styles: "border-radius:999px;padding:0;min-width:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) * 3);" }),
41
- largeStart: canvas_kit_styling_1.createStyles({ name: "13w6ubi", styles: "padding-inline-start:0.5rem;padding-inline-end:0.75rem;" }),
42
- largeEnd: canvas_kit_styling_1.createStyles({ name: "1g2rd08", styles: "padding-inline-start:0.75rem;padding-inline-end:0.5rem;" }),
43
- mediumOnly: canvas_kit_styling_1.createStyles({ name: "10i0ly8", styles: "padding:0;min-width:2.5rem;border-radius:999px;" }),
44
- mediumStart: canvas_kit_styling_1.createStyles({ name: "13w6ubi", styles: "padding-inline-start:0.5rem;padding-inline-end:0.75rem;" }),
45
- mediumEnd: canvas_kit_styling_1.createStyles({ name: "1g2rd08", styles: "padding-inline-start:0.75rem;padding-inline-end:0.5rem;" }),
46
- smallOnly: canvas_kit_styling_1.createStyles({ name: "18m1kdv", styles: "padding:0;min-width:2rem;border-radius:999px;" }),
47
- smallStart: canvas_kit_styling_1.createStyles({ name: "13w6ubi", styles: "padding-inline-start:0.5rem;padding-inline-end:0.75rem;" }),
48
- smallEnd: canvas_kit_styling_1.createStyles({ name: "1g2rd08", styles: "padding-inline-start:0.75rem;padding-inline-end:0.5rem;" }),
49
- extraSmallOnly: canvas_kit_styling_1.createStyles({ name: "1pnzsxn", styles: "padding:0;min-width:1.5rem;border-radius:999px;" }),
50
- extraSmallStart: canvas_kit_styling_1.createStyles({ name: "1ixecau", styles: "padding-inline-start:0.25rem;padding-inline-end:0.5rem;" }),
51
- extraSmallEnd: canvas_kit_styling_1.createStyles({ name: "f1t4k2", styles: "padding-inline-start:0.5rem;padding-inline-end:0.25rem;" }),
41
+ largeOnly: canvas_kit_styling_1.createStyles({ name: "e29f7e", styles: "border-radius:999px;padding:0;min-width:calc(var(--cnvs-sys-space-x4) * 3);" }),
42
+ largeStart: canvas_kit_styling_1.createStyles({ name: "61470b", styles: "padding-inline-start:0.5rem;padding-inline-end:0.75rem;" }),
43
+ largeEnd: canvas_kit_styling_1.createStyles({ name: "909121", styles: "padding-inline-start:0.75rem;padding-inline-end:0.5rem;" }),
44
+ mediumOnly: canvas_kit_styling_1.createStyles({ name: "eb1770", styles: "padding:0;min-width:2.5rem;border-radius:999px;" }),
45
+ mediumStart: canvas_kit_styling_1.createStyles({ name: "620c69", styles: "padding-inline-start:0.5rem;padding-inline-end:0.75rem;" }),
46
+ mediumEnd: canvas_kit_styling_1.createStyles({ name: "e0639b", styles: "padding-inline-start:0.75rem;padding-inline-end:0.5rem;" }),
47
+ smallOnly: canvas_kit_styling_1.createStyles({ name: "ffd7ba", styles: "padding:0;min-width:2rem;border-radius:999px;" }),
48
+ smallStart: canvas_kit_styling_1.createStyles({ name: "778c36", styles: "padding-inline-start:0.5rem;padding-inline-end:0.75rem;" }),
49
+ smallEnd: canvas_kit_styling_1.createStyles({ name: "3d3437", styles: "padding-inline-start:0.75rem;padding-inline-end:0.5rem;" }),
50
+ extraSmallOnly: canvas_kit_styling_1.createStyles({ name: "312d52", styles: "padding:0;min-width:1.5rem;border-radius:999px;" }),
51
+ extraSmallStart: canvas_kit_styling_1.createStyles({ name: "9b7fcd", styles: "padding-inline-start:0.25rem;padding-inline-end:0.5rem;" }),
52
+ extraSmallEnd: canvas_kit_styling_1.createStyles({ name: "d37c78", styles: "padding-inline-start:0.5rem;padding-inline-end:0.25rem;" }),
52
53
  },
53
54
  });
54
55
  exports.TertiaryButton = common_1.createComponent('button')({
@@ -27,7 +27,7 @@ const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
27
27
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
28
28
  const CardHeading_1 = require("./CardHeading");
29
29
  const CardBody_1 = require("./CardBody");
30
- const cardBaseStyles = canvas_kit_styling_1.createStyles({ name: "1t9ablw", styles: "box-shadow:var(--cnvs-sys-depth-1, 0 0.0625rem 0.25rem 0 rgba(31,38,46,0.12),0 0.125rem 0.5rem 0 rgba(31,38,46,0.08));padding:var(--cnvs-sys-space-x8, calc(0.25rem * 8));background-color:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));border:0.0625rem solid var(--cnvs-base-palette-soap-500, rgba(206,211,217,1));border-radius:var(--cnvs-sys-shape-x2, calc(0.25rem * 2));" });
30
+ const cardBaseStyles = canvas_kit_styling_1.createStyles({ name: "9be26c", styles: "box-shadow:var(--cnvs-sys-depth-1);padding:var(--cnvs-sys-space-x8);background-color:var(--cnvs-base-palette-french-vanilla-100);border:0.0625rem solid var(--cnvs-base-palette-soap-500);border-radius:var(--cnvs-sys-shape-x2);" });
31
31
  /**
32
32
  * `Card` is a container component that holds a {@link CardBody Card.Body} and an optional
33
33
  * {@link CardHeading Card.Heading}. `Card` wraps a non-semantic `div` element. The element can be
@@ -26,7 +26,7 @@ const layout_1 = require("@workday/canvas-kit-react/layout");
26
26
  const text_1 = require("@workday/canvas-kit-react/text");
27
27
  const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
28
28
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
29
- const cardHeadingBaseStyles = canvas_kit_styling_1.createStyles({ name: "qs1nz6", styles: "font-weight:var(--cnvs-sys-font-weight-bold, 700);margin-bottom:var(--cnvs-sys-space-x6, calc(0.25rem * 6));margin-top:0;" });
29
+ const cardHeadingBaseStyles = canvas_kit_styling_1.createStyles({ name: "cbe58f", styles: "font-weight:var(--cnvs-sys-font-weight-bold);margin-bottom:var(--cnvs-sys-space-x6);margin-top:0;" });
30
30
  exports.CardHeading = common_1.createComponent('h3')({
31
31
  displayName: 'Card.Heading',
32
32
  Component: ({ children, ...elemProps }, ref, Element) => {
@@ -26,14 +26,14 @@ const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
26
26
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
27
27
  exports.backgroundVars = canvas_kit_styling_1.createVars({ id: "cnvs-background", args: ["inner", "outer"] });
28
28
  const checkboxBackgroundStencil = canvas_kit_styling_1.createStencil({
29
- base: { name: "1yucu7c", styles: "align-items:center;background-color:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));border-radius:var(--cnvs-sys-shape-half, calc(0.25rem * 0.5));box-sizing:border-box;display:flex;height:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);justify-content:center;padding:var(--cnvs-sys-space-zero, 0) calc(var(--cnvs-sys-space-x1, 0.25rem) / 2);pointer-events:none;position:absolute;transition:border 200ms ease, background 200ms;width:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);border:0.0625rem solid var(--cnvs-base-palette-licorice-200, rgba(123,133,143,1));" },
29
+ base: { name: "ce0479", styles: "align-items:center;background-color:var(--cnvs-base-palette-french-vanilla-100);border-radius:var(--cnvs-sys-shape-half);box-sizing:border-box;display:flex;height:calc(var(--cnvs-sys-space-x4) + 0.125rem);justify-content:center;padding:var(--cnvs-sys-space-zero) calc(var(--cnvs-sys-space-x1) / 2);pointer-events:none;position:absolute;transition:border 200ms ease, background 200ms;width:calc(var(--cnvs-sys-space-x4) + 0.125rem);border:0.0625rem solid var(--cnvs-base-palette-licorice-200);" },
30
30
  modifiers: {
31
- modifiers: {
32
- error: { name: "zk536q", styles: "--cnvs-background-inner:var(--cnvs-brand-error-base, var(--cnvs-base-palette-cinnamon-500, rgba(222,46,33,1)));--cnvs-background-outer:transparent;" },
33
- alert: { name: "1lt6c51", styles: "--cnvs-background-inner:var(--cnvs-brand-alert-base, var(--cnvs-base-palette-cantaloupe-600, rgba(192,108,0,1)));--cnvs-background-outer:var(--cnvs-brand-alert-darkest, var(--cnvs-base-palette-cantaloupe-400, rgba(255,161,38,1)));" }
31
+ error: {
32
+ error: { name: "b3e9dd", styles: "--cnvs-background-inner:var(--cnvs-brand-error-base, var(--cnvs-base-palette-cinnamon-500));--cnvs-background-outer:transparent;" },
33
+ alert: { name: "c13fa0", styles: "--cnvs-background-inner:var(--cnvs-brand-alert-base, var(--cnvs-base-palette-cantaloupe-600));--cnvs-background-outer:var(--cnvs-brand-alert-darkest, var(--cnvs-base-palette-cantaloupe-400));" }
34
34
  }
35
35
  }
36
- }, "checkbox-background");
36
+ }, "cnvs-checkbox-background");
37
37
  exports.CheckBackground = common_1.createComponent('div')({
38
38
  displayName: 'CheckBackground',
39
39
  Component: ({ error, children }) => {
@@ -28,20 +28,20 @@ const icon_1 = require("@workday/canvas-kit-react/icon");
28
28
  const canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
29
29
  const CheckBackground_1 = require("./CheckBackground");
30
30
  const checkboxCheckStencil = canvas_kit_styling_1.createStencil({
31
- base: { name: "1ei0szh", styles: "display:flex;flex-direction:column;max-width:100%;pointer-events:none;transition:transform 200ms ease, opacity 200ms ease;span{margin-inline-start:calc(0.375rem * -1);transition:margin 200ms ease;}opacity:0;transform:scale(0.5);" },
31
+ base: { name: "94bef2", styles: "display:flex;flex-direction:column;max-width:100%;pointer-events:none;transition:transform 200ms ease, opacity 200ms ease;span{margin-inline-start:calc(0.375rem * -1);transition:margin 200ms ease;}opacity:0;transform:scale(0.5);" },
32
32
  modifiers: {
33
- modifiers: {
34
- true: { name: "1exxrn1", styles: "opacity:1;transform:scale(1);" }
33
+ checked: {
34
+ true: { name: "8cb110", styles: "opacity:1;transform:scale(1);" }
35
35
  },
36
- modifiers: {
37
- true: { name: "1exxrn1", styles: "opacity:1;transform:scale(1);" }
36
+ indeterminate: {
37
+ true: { name: "997065", styles: "opacity:1;transform:scale(1);" }
38
38
  },
39
- modifiers: {
40
- inverse: { name: "18xh6xb", styles: "& > div{background-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));}" }
39
+ variant: {
40
+ inverse: { name: "2928d4", styles: "& > div{background-color:var(--cnvs-brand-primary-base);}" }
41
41
  }
42
42
  }
43
- }, "checkbox-check");
44
- const indeterminateBoxStyles = canvas_kit_styling_1.createStyles({ name: "i3blod", styles: "width:calc(var(--cnvs-sys-space-x2, calc(0.25rem * 2)) + 0.125rem);height:calc(var(--cnvs-sys-space-x1, 0.25rem) / 2);background-color:var(--cnvs-brand-primary-accent, rgba(255,255,255,1));" });
43
+ }, "cnvs-checkbox-check");
44
+ const indeterminateBoxStyles = canvas_kit_styling_1.createStyles({ name: "5445f8", styles: "width:calc(var(--cnvs-sys-space-x2) + 0.125rem);height:calc(var(--cnvs-sys-space-x1) / 2);background-color:var(--cnvs-brand-primary-accent);" });
45
45
  exports.CheckboxCheck = common_1.createComponent('div')({
46
46
  displayName: 'CheckboxCheck',
47
47
  Component: ({ checked, error, indeterminate, variant }) => {
@@ -26,7 +26,7 @@ const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
26
26
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
27
27
  const text_1 = require("@workday/canvas-kit-react/text");
28
28
  exports.inputVars = canvas_kit_styling_1.createVars({ id: "cnvs-input", args: ["errorInner", "errorOuter", "alertInner", "alertOuter"] });
29
- const checkboxContainerStyles = canvas_kit_styling_1.createStyles({ name: "e6xila", styles: "display:flex;align-items:center;min-height:var(--cnvs-sys-space-x6, calc(0.25rem * 6));position:relative;&>div{display:flex;height:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);min-width:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);margin-top:0.1875rem;align-self:flex-start;}& > label{padding-inline-start:var(--cnvs-sys-space-x3, calc(var(--cnvs-base-unit, 0.25rem) * 3));}" });
29
+ const checkboxContainerStyles = canvas_kit_styling_1.createStyles({ name: "ce6ecb", styles: "display:flex;align-items:center;min-height:var(--cnvs-sys-space-x6);position:relative;&>div{display:flex;height:calc(var(--cnvs-sys-space-x4) + 0.125rem);min-width:calc(var(--cnvs-sys-space-x4) + 0.125rem);margin-top:0.1875rem;align-self:flex-start;}& > label{padding-inline-start:var(--cnvs-sys-space-x3);}" });
30
30
  exports.CheckboxContainer = common_1.createComponent('div')({
31
31
  displayName: 'CheckboxContainer',
32
32
  Component: ({ children, disabled, id, label, variant }) => {
@@ -26,30 +26,30 @@ const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
26
26
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
27
27
  const CheckBackground_1 = require("./CheckBackground");
28
28
  const checkboxInputStencil = canvas_kit_styling_1.createStencil({
29
- base: { name: "11nefzn", styles: "border-radius:var(--cnvs-sys-shape-half, calc(0.25rem * 0.5));width:var(--cnvs-sys-space-x6, calc(0.25rem * 6));height:var(--cnvs-sys-space-x6, calc(0.25rem * 6));margin:var(--cnvs-sys-space-zero, 0);margin-top:calc(0.1875rem * -1);margin-inline-start:calc(0.1875rem * -1);position:absolute;opacity:0;&:not(:disabled){cursor:pointer;}&:where(:hover, .hover) ~ span:first-of-type{box-shadow:0 0 0 0.4375rem var(--cnvs-base-palette-soap-200, rgba(240,241,242,1));}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-licorice-500, rgba(51,61,71,1));}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));background-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));}&:disabled ~ div:first-of-type{border-color:var(--cnvs-base-palette-licorice-100, rgba(161,170,179,1));background-color:var(--cnvs-base-palette-soap-100, rgba(246,247,248,1));opacity:1;}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-light, rgba(166,210,255,1));background-color:var(--cnvs-brand-primary-light, rgba(166,210,255,1));}&:where(:focus-visible, :active, .focus, .active){outline:none;}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));border-width:0.125rem;box-shadow:0 0 0 0px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 0px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&:checked:focus-visible, &:indeterminate:focus-visible, &:checked.focus, &:indeterminate.focus{& ~ div:first-of-type{box-shadow:0 0 0 2px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, var(--cnvs-base-palette-blueberry-400, rgba(8,117,225,1)));border-color:var(--cnvs-brand-primary-base, rgba(8,117,225,1));border-width:0.125rem;span{margin-inline-start:calc(0.4375rem * -1);}}}" },
29
+ base: { name: "54c399", styles: "border-radius:var(--cnvs-sys-shape-half);width:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x6);margin:var(--cnvs-sys-space-zero);margin-top:calc(0.1875rem * -1);margin-inline-start:calc(0.1875rem * -1);position:absolute;opacity:0;&:not(:disabled){cursor:pointer;}&:where(:hover, .hover) ~ span:first-of-type{box-shadow:0 0 0 0.4375rem var(--cnvs-base-palette-soap-200);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-licorice-500);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base);background-color:var(--cnvs-brand-primary-base);}&:disabled ~ div:first-of-type{border-color:var(--cnvs-base-palette-licorice-100);background-color:var(--cnvs-base-palette-soap-100);opacity:1;}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-light);background-color:var(--cnvs-brand-primary-light);}&:where(:focus-visible, :active, .focus, .active){outline:none;}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base);border-width:0.125rem;box-shadow:0 0 0 0px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 0px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&:checked:focus-visible, &:indeterminate:focus-visible, &:checked.focus, &:indeterminate.focus{& ~ div:first-of-type{box-shadow:0 0 0 2px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 4px var(--cnvs-brand-common-focus-outline);border-color:var(--cnvs-brand-primary-base);border-width:0.125rem;span{margin-inline-start:calc(0.4375rem * -1);}}}" },
30
30
  modifiers: {
31
- modifiers: {
32
- inverse: { name: "k4w4a2", styles: "& ~ span:first-of-type{opacity:var(--cnvs-sys-opacity-disabled, 0.4);}& ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));background-color:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));}&:disabled ~ div:first-of-type{background-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));opacity:var(--cnvs-sys-opacity-disabled, 0.4);}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));background-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1));box-shadow:0 0 0 0px var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)), 0 0 0 2px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));}&:checked:focus-visible, &:checked.focus, &:indeterminate:focus-visible, &:indeterminate.focus{& ~ div:first-of-type{box-shadow:0 0 0 2px var(--cnvs-base-palette-black-pepper-400, rgba(51,51,51,1)), 0 0 0 4px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));border-color:var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1));}}" }
31
+ variant: {
32
+ inverse: { name: "d7f48e", styles: "& ~ span:first-of-type{opacity:var(--cnvs-sys-opacity-disabled);}& ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);background-color:var(--cnvs-base-palette-french-vanilla-100);}&:disabled ~ div:first-of-type{background-color:var(--cnvs-base-palette-soap-300);opacity:var(--cnvs-sys-opacity-disabled);}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);background-color:var(--cnvs-base-palette-soap-300);}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-base-palette-black-pepper-400);box-shadow:0 0 0 0px var(--cnvs-base-palette-black-pepper-400), 0 0 0 2px var(--cnvs-base-palette-french-vanilla-100);}&:checked:focus-visible, &:checked.focus, &:indeterminate:focus-visible, &:indeterminate.focus{& ~ div:first-of-type{box-shadow:0 0 0 2px var(--cnvs-base-palette-black-pepper-400), 0 0 0 4px var(--cnvs-base-palette-french-vanilla-100);border-color:var(--cnvs-base-palette-french-vanilla-100);}}" }
33
33
  },
34
- modifiers: {
35
- true: { name: "fg9j9p", styles: "&:where(:hover, .hover) ~ span:first-of-type{box-shadow:none;}" }
34
+ disabled: {
35
+ true: { name: "8a663b", styles: "&:where(:hover, .hover) ~ span:first-of-type{box-shadow:none;}" }
36
36
  },
37
- modifiers: {
38
- error: { name: "cgjiki", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border-color:var(--cnvs-background-inner);box-shadow:\n 0 0 0 0.0625rem var(--cnvs-background-inner), \n 0 0 0 0.125rem var(--cnvs-background-outer);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:transparent;box-shadow:\n 0 0 0 0.125rem var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)),\n 0 0 0 0.25rem var(--cnvs-background-inner),\n 0 0 0 0.3125rem var(--cnvs-background-outer);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-background-inner);}" },
39
- alert: { name: "hps6d7", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-background-inner);box-shadow:\n 0 0 0 0.0625rem var(--cnvs-background-inner), \n 0 0 0 0.125rem var(--cnvs-background-outer);}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-background-inner);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:transparent;box-shadow:\n 0 0 0 0.125rem var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)),\n 0 0 0 0.25rem var(--cnvs-background-inner),\n 0 0 0 0.3125rem var(--cnvs-background-outer);}" }
37
+ error: {
38
+ error: { name: "020b45", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border-color:var(--cnvs-background-inner);box-shadow:\n 0 0 0 0.0625rem var(--cnvs-background-inner), \n 0 0 0 0.125rem var(--cnvs-background-outer);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:transparent;box-shadow:\n 0 0 0 0.125rem var(--cnvs-base-palette-french-vanilla-100),\n 0 0 0 0.25rem var(--cnvs-background-inner),\n 0 0 0 0.3125rem var(--cnvs-background-outer);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-background-inner);}" },
39
+ alert: { name: "b5c214", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-background-inner);box-shadow:\n 0 0 0 0.0625rem var(--cnvs-background-inner), \n 0 0 0 0.125rem var(--cnvs-background-outer);}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-background-inner);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:transparent;box-shadow:\n 0 0 0 0.125rem var(--cnvs-base-palette-french-vanilla-100),\n 0 0 0 0.25rem var(--cnvs-background-inner),\n 0 0 0 0.3125rem var(--cnvs-background-outer);}" }
40
40
  }
41
41
  },
42
42
  compound: [
43
43
  {
44
44
  modifiers: { variant: 'inverse', error: 'error' },
45
- styles: { name: "b2voah", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}" }
45
+ styles: { name: "bc9f16", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-base-palette-soap-300);}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}" }
46
46
  },
47
47
  {
48
48
  modifiers: { variant: 'inverse', error: 'alert' },
49
- styles: { name: "b2voah", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300, rgba(232,235,237,1));}" }
49
+ styles: { name: "bdcc4f", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-base-palette-soap-300);}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-base-palette-soap-300);}" }
50
50
  }
51
51
  ]
52
- }, "checkbox-input");
52
+ }, "cnvs-checkbox-input");
53
53
  exports.CheckboxInput = common_1.createComponent('input')({
54
54
  displayName: 'CheckboxInput',
55
55
  Component: ({ variant, error, ...elemProps }, ref, Element) => {
@@ -24,7 +24,7 @@ const React = __importStar(require("react"));
24
24
  const common_1 = require("@workday/canvas-kit-react/common");
25
25
  const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
26
26
  const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
27
- const checkboxRippleStyles = canvas_kit_styling_1.createStyles({ name: "1pxif3r", styles: "border-radius:var(--cnvs-sys-shape-round, calc(0.25rem * 250));box-shadow:none;height:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);width:calc(var(--cnvs-sys-space-x4, calc(0.25rem * 4)) + 0.125rem);transition:box-shadow 150ms ease-out;position:absolute;pointer-events:none;" });
27
+ const checkboxRippleStyles = canvas_kit_styling_1.createStyles({ name: "b4530c", styles: "border-radius:var(--cnvs-sys-shape-round);box-shadow:none;height:calc(var(--cnvs-sys-space-x4) + 0.125rem);width:calc(var(--cnvs-sys-space-x4) + 0.125rem);transition:box-shadow 150ms ease-out;position:absolute;pointer-events:none;" });
28
28
  exports.CheckboxRipple = common_1.createComponent('span')({
29
29
  displayName: 'CheckboxRipple',
30
30
  Component: elemProps => {
@@ -1 +1 @@
1
- {"version":3,"file":"ListBox.d.ts","sourceRoot":"","sources":["../../../../collection/lib/ListBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAM,IAAI,EAAc,MAAM,kCAAkC,CAAC;AAQxE,MAAM,WAAW,YAAY,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC;IAC/F,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CAC5E;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMtB,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAOrB,CAAC;AA0BH;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAKhB;;;;;;;;OAQG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyBN,CAAC"}
1
+ {"version":3,"file":"ListBox.d.ts","sourceRoot":"","sources":["../../../../collection/lib/ListBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAM,IAAI,EAAc,MAAM,kCAAkC,CAAC;AAQxE,MAAM,WAAW,YAAY,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC;IAC/F,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CAC5E;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMtB,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAOrB,CAAC;AA0BH;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAKhB;;;;;;;;OAQG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BN,CAAC"}
@@ -28,17 +28,17 @@ exports.useListBox = common_1.createElemPropsHook(useListModel_1.useListModel)(m
28
28
  };
29
29
  });
30
30
  const listBoxContainerStencil = canvas_kit_styling_1.createStencil({
31
- base: { name: "roynbj", styles: "box-sizing:border-box;" },
31
+ base: { name: "7a791a", styles: "box-sizing:border-box;" },
32
32
  modifiers: {
33
- modifiers: {
34
- vertical: { name: "13v3rg8", styles: "overflow-y:auto;" },
35
- horizontal: { name: "mru7yp", styles: "overflow-y:undefined;" }
33
+ orientation: {
34
+ vertical: { name: "dcd369", styles: "overflow-y:auto;" },
35
+ horizontal: { name: "453e0f", styles: "overflow-y:undefined;" }
36
36
  }
37
37
  }
38
- }, "list-box-container");
38
+ }, "cnvs-list-box-container");
39
39
  const listBoxStencil = canvas_kit_styling_1.createStencil({
40
- base: { name: "1rhzmpl", styles: "flex-direction:column;margin-top:var(--cnvs-sys-space-zero, 0);margin-bottom:var(--cnvs-sys-space-zero, 0);" }
41
- }, "list-box");
40
+ base: { name: "aef6ed", styles: "flex-direction:column;margin-top:var(--cnvs-sys-space-zero);margin-bottom:var(--cnvs-sys-space-zero);" }
41
+ }, "cnvs-list-box");
42
42
  /**
43
43
  * The `ListBox` component that offers vertical rendering of a collection in the form of a
44
44
  * 2-dimension list. It supports virtualization, rendering only visible items in the DOM while also
@@ -75,6 +75,12 @@ exports.ListBox = common_1.createContainer('ul')({
75
75
  })(({ height, maxHeight, marginY, marginBottom, overflowY, marginTop, ...elemProps }, Element, model) => {
76
76
  // We're removing `marginY, marginBottom, overflowY, marginTo` from elemProps and applying them to the container as to not interfere with the virtualization size. We set
77
77
  // the `marginY` on the Flex to `0` to avoid inaccurate scrollbars
78
- return (react_1.default.createElement("div", Object.assign({ ref: model.state.containerRef }, layout_1.mergeStyles({ maxHeight, marginBottom: marginY, marginTop: marginY }, listBoxContainerStencil({ orientation: model.state.orientation }))),
78
+ return (react_1.default.createElement("div", Object.assign({ ref: model.state.containerRef }, canvas_kit_styling_1.handleCsProp({
79
+ style: {
80
+ maxHeight,
81
+ marginBottom: marginY || marginBottom,
82
+ marginTop: marginY || marginBottom,
83
+ },
84
+ }, listBoxContainerStencil({ orientation: model.state.orientation }))),
79
85
  react_1.default.createElement(layout_1.Flex, Object.assign({ as: Element }, layout_1.mergeStyles(elemProps, listBoxStencil())), useListRenderItem_1.useListRenderItems(model, elemProps.children))));
80
86
  });