@workday/canvas-kit-react 5.3.17 → 5.4.0-next.1

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 (705) hide show
  1. package/action-bar/lib/ActionBar.tsx +42 -29
  2. package/avatar/lib/Avatar.tsx +4 -0
  3. package/button/lib/PrimaryButton.tsx +110 -32
  4. package/button/lib/SecondaryButton.tsx +31 -16
  5. package/button/lib/TertiaryButton.tsx +45 -35
  6. package/button/lib/parts/ButtonContainer.tsx +18 -5
  7. package/button/lib/parts/ButtonLabelIcon.tsx +34 -14
  8. package/button/lib/types.ts +11 -0
  9. package/checkbox/lib/Checkbox.tsx +1 -1
  10. package/common/README.md +78 -0
  11. package/common/index.ts +1 -0
  12. package/common/lib/EllipsisText.tsx +11 -0
  13. package/common/lib/parts/_brand-assets.ts +6 -6
  14. package/common/lib/styles/accessibleHide.ts +2 -2
  15. package/common/lib/theming/README.md +189 -25
  16. package/common/lib/theming/breakpoints.ts +296 -16
  17. package/common/lib/theming/types.ts +191 -1
  18. package/common/lib/utils/components.ts +50 -23
  19. package/common/lib/utils/elements.ts +5 -1
  20. package/common/lib/utils/index.ts +2 -0
  21. package/common/lib/utils/mergeProps.ts +4 -0
  22. package/common/lib/utils/useConstant.ts +18 -0
  23. package/common/lib/utils/useResizeObserver.ts +29 -0
  24. package/common/lib/utils/useUniqueId.ts +46 -4
  25. package/cookie-banner/README.md +15 -10
  26. package/cookie-banner/index.ts +3 -3
  27. package/cookie-banner/lib/CookieBanner.tsx +29 -4
  28. package/dist/commonjs/action-bar/lib/ActionBar.d.ts.map +1 -1
  29. package/dist/commonjs/action-bar/lib/ActionBar.js +33 -22
  30. package/dist/commonjs/avatar/lib/Avatar.d.ts.map +1 -1
  31. package/dist/commonjs/avatar/lib/Avatar.js +3 -0
  32. package/dist/commonjs/button/lib/PrimaryButton.d.ts +80 -6
  33. package/dist/commonjs/button/lib/PrimaryButton.d.ts.map +1 -1
  34. package/dist/commonjs/button/lib/PrimaryButton.js +80 -26
  35. package/dist/commonjs/button/lib/SecondaryButton.d.ts +8 -5
  36. package/dist/commonjs/button/lib/SecondaryButton.d.ts.map +1 -1
  37. package/dist/commonjs/button/lib/SecondaryButton.js +22 -12
  38. package/dist/commonjs/button/lib/TertiaryButton.d.ts +8 -4
  39. package/dist/commonjs/button/lib/TertiaryButton.d.ts.map +1 -1
  40. package/dist/commonjs/button/lib/TertiaryButton.js +24 -19
  41. package/dist/commonjs/button/lib/parts/ButtonContainer.d.ts +5 -3
  42. package/dist/commonjs/button/lib/parts/ButtonContainer.d.ts.map +1 -1
  43. package/dist/commonjs/button/lib/parts/ButtonContainer.js +7 -9
  44. package/dist/commonjs/button/lib/parts/ButtonLabel.d.ts +1 -1
  45. package/dist/commonjs/button/lib/parts/ButtonLabel.d.ts.map +1 -1
  46. package/dist/commonjs/button/lib/parts/ButtonLabelIcon.d.ts +7 -4
  47. package/dist/commonjs/button/lib/parts/ButtonLabelIcon.d.ts.map +1 -1
  48. package/dist/commonjs/button/lib/parts/ButtonLabelIcon.js +28 -13
  49. package/dist/commonjs/button/lib/types.d.ts +9 -0
  50. package/dist/commonjs/button/lib/types.d.ts.map +1 -1
  51. package/dist/commonjs/checkbox/lib/Checkbox.d.ts +1 -1
  52. package/dist/commonjs/common/index.d.ts +1 -0
  53. package/dist/commonjs/common/index.d.ts.map +1 -1
  54. package/dist/commonjs/common/index.js +1 -0
  55. package/dist/commonjs/common/lib/EllipsisText.d.ts +5 -0
  56. package/dist/commonjs/common/lib/EllipsisText.d.ts.map +1 -0
  57. package/dist/commonjs/common/lib/EllipsisText.js +13 -0
  58. package/dist/commonjs/common/lib/parts/_brand-assets.d.ts.map +1 -1
  59. package/dist/commonjs/common/lib/parts/_brand-assets.js +6 -6
  60. package/dist/commonjs/common/lib/styles/accessibleHide.d.ts +2 -2
  61. package/dist/commonjs/common/lib/styles/accessibleHide.d.ts.map +1 -1
  62. package/dist/commonjs/common/lib/theming/breakpoints.d.ts +287 -6
  63. package/dist/commonjs/common/lib/theming/breakpoints.d.ts.map +1 -1
  64. package/dist/commonjs/common/lib/theming/breakpoints.js +192 -10
  65. package/dist/commonjs/common/lib/theming/types.d.ts +191 -1
  66. package/dist/commonjs/common/lib/theming/types.d.ts.map +1 -1
  67. package/dist/commonjs/common/lib/utils/components.d.ts +19 -9
  68. package/dist/commonjs/common/lib/utils/components.d.ts.map +1 -1
  69. package/dist/commonjs/common/lib/utils/components.js +12 -2
  70. package/dist/commonjs/common/lib/utils/elements.d.ts +2 -2
  71. package/dist/commonjs/common/lib/utils/elements.d.ts.map +1 -1
  72. package/dist/commonjs/common/lib/utils/elements.js +4 -1
  73. package/dist/commonjs/common/lib/utils/index.d.ts +2 -0
  74. package/dist/commonjs/common/lib/utils/index.d.ts.map +1 -1
  75. package/dist/commonjs/common/lib/utils/index.js +2 -0
  76. package/dist/commonjs/common/lib/utils/mergeProps.d.ts.map +1 -1
  77. package/dist/commonjs/common/lib/utils/mergeProps.js +5 -0
  78. package/dist/commonjs/common/lib/utils/useConstant.d.ts +9 -0
  79. package/dist/commonjs/common/lib/utils/useConstant.d.ts.map +1 -0
  80. package/dist/commonjs/common/lib/utils/useConstant.js +18 -0
  81. package/dist/commonjs/common/lib/utils/useResizeObserver.d.ts +3 -0
  82. package/dist/commonjs/common/lib/utils/useResizeObserver.d.ts.map +1 -0
  83. package/dist/commonjs/common/lib/utils/useResizeObserver.js +42 -0
  84. package/dist/commonjs/common/lib/utils/useUniqueId.d.ts +28 -0
  85. package/dist/commonjs/common/lib/utils/useUniqueId.d.ts.map +1 -1
  86. package/dist/commonjs/common/lib/utils/useUniqueId.js +42 -14
  87. package/dist/commonjs/cookie-banner/index.d.ts +3 -3
  88. package/dist/commonjs/cookie-banner/index.d.ts.map +1 -1
  89. package/dist/commonjs/cookie-banner/index.js +1 -1
  90. package/dist/commonjs/cookie-banner/lib/CookieBanner.d.ts +19 -2
  91. package/dist/commonjs/cookie-banner/lib/CookieBanner.d.ts.map +1 -1
  92. package/dist/commonjs/cookie-banner/lib/CookieBanner.js +19 -8
  93. package/dist/commonjs/dialog/lib/hooks/useDialogCard.d.ts +4 -16
  94. package/dist/commonjs/dialog/lib/hooks/useDialogCard.d.ts.map +1 -1
  95. package/dist/commonjs/dialog/lib/hooks/useDialogPopper.d.ts +5 -2
  96. package/dist/commonjs/dialog/lib/hooks/useDialogPopper.d.ts.map +1 -1
  97. package/dist/commonjs/form-field/lib/FormField.d.ts.map +1 -1
  98. package/dist/commonjs/form-field/lib/FormField.js +1 -2
  99. package/dist/commonjs/modal/lib/ModalOverlay.d.ts +4 -2
  100. package/dist/commonjs/modal/lib/ModalOverlay.d.ts.map +1 -1
  101. package/dist/commonjs/modal/lib/hooks/useModalCard.d.ts +4 -16
  102. package/dist/commonjs/modal/lib/hooks/useModalCard.d.ts.map +1 -1
  103. package/dist/commonjs/modal/lib/hooks/useModalHeading.d.ts +5 -17
  104. package/dist/commonjs/modal/lib/hooks/useModalHeading.d.ts.map +1 -1
  105. package/dist/commonjs/page-header/index.d.ts +3 -3
  106. package/dist/commonjs/page-header/index.d.ts.map +1 -1
  107. package/dist/commonjs/page-header/index.js +1 -1
  108. package/dist/commonjs/page-header/lib/PageHeader.d.ts +19 -2
  109. package/dist/commonjs/page-header/lib/PageHeader.d.ts.map +1 -1
  110. package/dist/commonjs/page-header/lib/PageHeader.js +18 -7
  111. package/dist/commonjs/pagination/lib/Pagination/PageList.d.ts +1 -1
  112. package/dist/commonjs/pagination/lib/Pagination/PageList.d.ts.map +1 -1
  113. package/dist/commonjs/pagination/lib/Pagination/Pagination.d.ts +5 -5
  114. package/dist/commonjs/pagination/lib/Pagination/common/List.d.ts +1 -1
  115. package/dist/commonjs/pagination/lib/Pagination/common/List.d.ts.map +1 -1
  116. package/dist/commonjs/pagination/lib/Pagination/common/utils/getValidChildren.d.ts +1 -1
  117. package/dist/commonjs/pagination/lib/Pagination/common/utils/getValidChildren.d.ts.map +1 -1
  118. package/dist/commonjs/popup/lib/PopupCard.js +2 -3
  119. package/dist/commonjs/popup/lib/hooks/focus-trap-js.d.ts.map +1 -1
  120. package/dist/commonjs/popup/lib/hooks/focus-trap-js.js +1 -0
  121. package/dist/commonjs/popup/lib/hooks/usePopupCard.d.ts +5 -2
  122. package/dist/commonjs/popup/lib/hooks/usePopupCard.d.ts.map +1 -1
  123. package/dist/commonjs/popup/lib/hooks/usePopupCloseButton.d.ts +4 -2
  124. package/dist/commonjs/popup/lib/hooks/usePopupCloseButton.d.ts.map +1 -1
  125. package/dist/commonjs/popup/lib/hooks/usePopupHeading.d.ts +5 -2
  126. package/dist/commonjs/popup/lib/hooks/usePopupHeading.d.ts.map +1 -1
  127. package/dist/commonjs/popup/lib/hooks/usePopupPopper.d.ts +4 -2
  128. package/dist/commonjs/popup/lib/hooks/usePopupPopper.d.ts.map +1 -1
  129. package/dist/commonjs/popup/lib/hooks/usePopupTarget.d.ts +4 -2
  130. package/dist/commonjs/popup/lib/hooks/usePopupTarget.d.ts.map +1 -1
  131. package/dist/commonjs/popup/lib/hooks/useReturnFocus.d.ts +1 -1
  132. package/dist/commonjs/popup/lib/hooks/useReturnFocus.js +1 -1
  133. package/dist/commonjs/radio/lib/Radio.d.ts +1 -1
  134. package/dist/commonjs/switch/lib/Switch.d.ts +1 -1
  135. package/dist/commonjs/table/lib/TableRow.d.ts +5 -4
  136. package/dist/commonjs/table/lib/TableRow.d.ts.map +1 -1
  137. package/dist/commonjs/table/lib/TableRow.js +12 -26
  138. package/dist/commonjs/tabs/index.d.ts +5 -0
  139. package/dist/commonjs/tabs/index.d.ts.map +1 -1
  140. package/dist/commonjs/tabs/index.js +11 -0
  141. package/dist/commonjs/tabs/lib/Tabs.d.ts +35 -7
  142. package/dist/commonjs/tabs/lib/Tabs.d.ts.map +1 -1
  143. package/dist/commonjs/tabs/lib/Tabs.js +28 -7
  144. package/dist/commonjs/tabs/lib/TabsItem.d.ts +107 -0
  145. package/dist/commonjs/tabs/lib/TabsItem.d.ts.map +1 -0
  146. package/dist/commonjs/tabs/lib/TabsItem.js +140 -0
  147. package/dist/commonjs/tabs/lib/TabsList.d.ts +43 -0
  148. package/dist/commonjs/tabs/lib/TabsList.d.ts.map +1 -0
  149. package/dist/commonjs/tabs/lib/TabsList.js +53 -0
  150. package/dist/commonjs/tabs/lib/TabsMenuPopper.d.ts +21 -0
  151. package/dist/commonjs/tabs/lib/TabsMenuPopper.d.ts.map +1 -0
  152. package/dist/commonjs/tabs/lib/{TabList.js → TabsMenuPopper.js} +7 -19
  153. package/dist/commonjs/tabs/lib/TabsOverflowButton.d.ts +31 -0
  154. package/dist/commonjs/tabs/lib/TabsOverflowButton.d.ts.map +1 -0
  155. package/dist/commonjs/tabs/lib/TabsOverflowButton.js +57 -0
  156. package/{ts3.5/dist/commonjs/tabs/lib/TabPanel.d.ts → dist/commonjs/tabs/lib/TabsPanel.d.ts} +39 -29
  157. package/dist/commonjs/tabs/lib/TabsPanel.d.ts.map +1 -0
  158. package/dist/commonjs/tabs/lib/TabsPanel.js +64 -0
  159. package/dist/{es6/tabs/lib/TabList.d.ts → commonjs/tabs/lib/TabsPanels.d.ts} +5 -5
  160. package/dist/commonjs/tabs/lib/TabsPanels.d.ts.map +1 -0
  161. package/dist/commonjs/tabs/lib/TabsPanels.js +21 -0
  162. package/dist/commonjs/tabs/lib/cursor/index.d.ts +1 -1
  163. package/dist/commonjs/tabs/lib/cursor/index.d.ts.map +1 -1
  164. package/dist/commonjs/tabs/lib/cursor/index.js +1 -1
  165. package/dist/commonjs/tabs/lib/cursor/useCursorModel.d.ts +23 -13
  166. package/dist/commonjs/tabs/lib/cursor/useCursorModel.d.ts.map +1 -1
  167. package/dist/commonjs/tabs/lib/cursor/useCursorModel.js +50 -49
  168. package/dist/commonjs/tabs/lib/cursor/useRovingFocus.d.ts +37 -0
  169. package/dist/commonjs/tabs/lib/cursor/useRovingFocus.d.ts.map +1 -0
  170. package/dist/commonjs/tabs/lib/cursor/{hooks.js → useRovingFocus.js} +26 -50
  171. package/dist/commonjs/tabs/lib/list/index.d.ts +2 -1
  172. package/dist/commonjs/tabs/lib/list/index.d.ts.map +1 -1
  173. package/dist/commonjs/tabs/lib/list/index.js +2 -1
  174. package/dist/commonjs/tabs/lib/list/renderItem.d.ts +4 -0
  175. package/dist/commonjs/tabs/lib/list/renderItem.d.ts.map +1 -0
  176. package/dist/commonjs/tabs/lib/list/renderItem.js +18 -0
  177. package/dist/commonjs/tabs/lib/list/useListModel.d.ts +25 -13
  178. package/dist/commonjs/tabs/lib/list/useListModel.d.ts.map +1 -1
  179. package/dist/commonjs/tabs/lib/list/useListModel.js +20 -7
  180. package/dist/commonjs/tabs/lib/list/useListRegisterItem.d.ts +14 -0
  181. package/dist/commonjs/tabs/lib/list/useListRegisterItem.d.ts.map +1 -0
  182. package/dist/commonjs/tabs/lib/list/useListRegisterItem.js +46 -0
  183. package/dist/commonjs/tabs/lib/menu/Menu.d.ts +80 -0
  184. package/dist/commonjs/tabs/lib/menu/Menu.d.ts.map +1 -0
  185. package/dist/commonjs/tabs/lib/menu/Menu.js +94 -0
  186. package/dist/commonjs/tabs/lib/menu/MenuCard.d.ts +17 -0
  187. package/dist/commonjs/tabs/lib/menu/MenuCard.d.ts.map +1 -0
  188. package/dist/commonjs/tabs/lib/menu/MenuCard.js +82 -0
  189. package/dist/commonjs/tabs/lib/menu/MenuItem.d.ts +62 -0
  190. package/dist/commonjs/tabs/lib/menu/MenuItem.d.ts.map +1 -0
  191. package/dist/commonjs/tabs/lib/menu/MenuItem.js +145 -0
  192. package/dist/commonjs/tabs/lib/menu/MenuList.d.ts +23 -0
  193. package/dist/commonjs/tabs/lib/menu/MenuList.d.ts.map +1 -0
  194. package/dist/commonjs/tabs/lib/menu/MenuList.js +52 -0
  195. package/dist/commonjs/tabs/lib/menu/MenuPopper.d.ts +21 -0
  196. package/dist/commonjs/tabs/lib/menu/MenuPopper.d.ts.map +1 -0
  197. package/dist/commonjs/tabs/lib/menu/MenuPopper.js +45 -0
  198. package/dist/commonjs/tabs/lib/menu/MenuTarget.d.ts +21 -0
  199. package/dist/commonjs/tabs/lib/menu/MenuTarget.d.ts.map +1 -0
  200. package/dist/commonjs/tabs/lib/menu/MenuTarget.js +60 -0
  201. package/dist/commonjs/tabs/lib/menu/index.d.ts +8 -0
  202. package/dist/commonjs/tabs/lib/menu/index.d.ts.map +1 -0
  203. package/dist/commonjs/tabs/lib/menu/index.js +18 -0
  204. package/dist/commonjs/tabs/lib/menu/useMenuModel.d.ts +35 -0
  205. package/dist/commonjs/tabs/lib/menu/useMenuModel.d.ts.map +1 -0
  206. package/dist/commonjs/tabs/lib/menu/useMenuModel.js +33 -0
  207. package/dist/commonjs/tabs/lib/overflow/index.d.ts +5 -0
  208. package/dist/commonjs/tabs/lib/overflow/index.d.ts.map +1 -0
  209. package/dist/commonjs/tabs/lib/overflow/index.js +9 -0
  210. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureContainer.d.ts +8 -0
  211. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureContainer.d.ts.map +1 -0
  212. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureContainer.js +22 -0
  213. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureItem.d.ts +10 -0
  214. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureItem.d.ts.map +1 -0
  215. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureItem.js +32 -0
  216. package/dist/commonjs/tabs/lib/overflow/useOverflowModel.d.ts +69 -0
  217. package/dist/commonjs/tabs/lib/overflow/useOverflowModel.d.ts.map +1 -0
  218. package/dist/commonjs/tabs/lib/overflow/useOverflowModel.js +126 -0
  219. package/dist/commonjs/tabs/lib/overflow/useOverflowTarget.d.ts +11 -0
  220. package/dist/commonjs/tabs/lib/overflow/useOverflowTarget.d.ts.map +1 -0
  221. package/dist/commonjs/tabs/lib/overflow/useOverflowTarget.js +35 -0
  222. package/dist/commonjs/tabs/lib/selection/index.d.ts +4 -0
  223. package/dist/commonjs/tabs/lib/selection/index.d.ts.map +1 -0
  224. package/dist/commonjs/tabs/lib/selection/index.js +8 -0
  225. package/dist/commonjs/tabs/lib/selection/useResetCursorOnBlur.d.ts +13 -0
  226. package/dist/commonjs/tabs/lib/selection/useResetCursorOnBlur.d.ts.map +1 -0
  227. package/dist/commonjs/tabs/lib/{hooks.js → selection/useResetCursorOnBlur.js} +8 -9
  228. package/dist/commonjs/tabs/lib/selection/useSelectionItem.d.ts +8 -0
  229. package/dist/commonjs/tabs/lib/selection/useSelectionItem.d.ts.map +1 -0
  230. package/dist/commonjs/tabs/lib/selection/useSelectionItem.js +16 -0
  231. package/dist/commonjs/tabs/lib/selection/useSelectionModel.d.ts +62 -0
  232. package/dist/commonjs/tabs/lib/selection/useSelectionModel.d.ts.map +1 -0
  233. package/dist/commonjs/tabs/lib/selection/useSelectionModel.js +80 -0
  234. package/dist/commonjs/tabs/lib/useTabsModel.d.ts +39 -38
  235. package/dist/commonjs/tabs/lib/useTabsModel.d.ts.map +1 -1
  236. package/dist/commonjs/tabs/lib/useTabsModel.js +50 -37
  237. package/dist/commonjs/tokens/index.d.ts +3 -20
  238. package/dist/commonjs/tokens/index.d.ts.map +1 -1
  239. package/dist/commonjs/tokens/index.js +3 -6
  240. package/dist/commonjs/tokens/lib/depth.d.ts +109 -3
  241. package/dist/commonjs/tokens/lib/depth.d.ts.map +1 -1
  242. package/dist/commonjs/tokens/lib/depth.js +40 -5
  243. package/dist/commonjs/tooltip/lib/useTooltip.d.ts +1 -1
  244. package/dist/commonjs/tooltip/lib/useTooltip.js +2 -5
  245. package/dist/es6/action-bar/lib/ActionBar.d.ts.map +1 -1
  246. package/dist/es6/action-bar/lib/ActionBar.js +33 -22
  247. package/dist/es6/avatar/lib/Avatar.d.ts.map +1 -1
  248. package/dist/es6/avatar/lib/Avatar.js +3 -0
  249. package/dist/es6/button/lib/PrimaryButton.d.ts +80 -6
  250. package/dist/es6/button/lib/PrimaryButton.d.ts.map +1 -1
  251. package/dist/es6/button/lib/PrimaryButton.js +81 -27
  252. package/dist/es6/button/lib/SecondaryButton.d.ts +8 -5
  253. package/dist/es6/button/lib/SecondaryButton.d.ts.map +1 -1
  254. package/dist/es6/button/lib/SecondaryButton.js +22 -12
  255. package/dist/es6/button/lib/TertiaryButton.d.ts +8 -4
  256. package/dist/es6/button/lib/TertiaryButton.d.ts.map +1 -1
  257. package/dist/es6/button/lib/TertiaryButton.js +25 -20
  258. package/dist/es6/button/lib/parts/ButtonContainer.d.ts +5 -3
  259. package/dist/es6/button/lib/parts/ButtonContainer.d.ts.map +1 -1
  260. package/dist/es6/button/lib/parts/ButtonContainer.js +7 -9
  261. package/dist/es6/button/lib/parts/ButtonLabel.d.ts +1 -1
  262. package/dist/es6/button/lib/parts/ButtonLabel.d.ts.map +1 -1
  263. package/dist/es6/button/lib/parts/ButtonLabelIcon.d.ts +7 -4
  264. package/dist/es6/button/lib/parts/ButtonLabelIcon.d.ts.map +1 -1
  265. package/dist/es6/button/lib/parts/ButtonLabelIcon.js +28 -13
  266. package/dist/es6/button/lib/types.d.ts +9 -0
  267. package/dist/es6/button/lib/types.d.ts.map +1 -1
  268. package/dist/es6/checkbox/lib/Checkbox.d.ts +1 -1
  269. package/dist/es6/common/index.d.ts +1 -0
  270. package/dist/es6/common/index.d.ts.map +1 -1
  271. package/dist/es6/common/index.js +1 -0
  272. package/dist/es6/common/lib/EllipsisText.d.ts +5 -0
  273. package/dist/es6/common/lib/EllipsisText.d.ts.map +1 -0
  274. package/dist/es6/common/lib/EllipsisText.js +8 -0
  275. package/dist/es6/common/lib/parts/_brand-assets.d.ts.map +1 -1
  276. package/dist/es6/common/lib/parts/_brand-assets.js +6 -6
  277. package/dist/es6/common/lib/styles/accessibleHide.d.ts +2 -2
  278. package/dist/es6/common/lib/styles/accessibleHide.d.ts.map +1 -1
  279. package/dist/es6/common/lib/theming/breakpoints.d.ts +287 -6
  280. package/dist/es6/common/lib/theming/breakpoints.d.ts.map +1 -1
  281. package/dist/es6/common/lib/theming/breakpoints.js +192 -10
  282. package/dist/es6/common/lib/theming/types.d.ts +191 -1
  283. package/dist/es6/common/lib/theming/types.d.ts.map +1 -1
  284. package/dist/es6/common/lib/utils/components.d.ts +19 -9
  285. package/dist/es6/common/lib/utils/components.d.ts.map +1 -1
  286. package/dist/es6/common/lib/utils/components.js +12 -2
  287. package/dist/es6/common/lib/utils/elements.d.ts +2 -2
  288. package/dist/es6/common/lib/utils/elements.d.ts.map +1 -1
  289. package/dist/es6/common/lib/utils/elements.js +4 -1
  290. package/dist/es6/common/lib/utils/index.d.ts +2 -0
  291. package/dist/es6/common/lib/utils/index.d.ts.map +1 -1
  292. package/dist/es6/common/lib/utils/index.js +2 -0
  293. package/dist/es6/common/lib/utils/mergeProps.d.ts.map +1 -1
  294. package/dist/es6/common/lib/utils/mergeProps.js +5 -0
  295. package/dist/es6/common/lib/utils/useConstant.d.ts +9 -0
  296. package/dist/es6/common/lib/utils/useConstant.d.ts.map +1 -0
  297. package/dist/es6/common/lib/utils/useConstant.js +15 -0
  298. package/dist/es6/common/lib/utils/useResizeObserver.d.ts +3 -0
  299. package/dist/es6/common/lib/utils/useResizeObserver.d.ts.map +1 -0
  300. package/dist/es6/common/lib/utils/useResizeObserver.js +37 -0
  301. package/dist/es6/common/lib/utils/useUniqueId.d.ts +28 -0
  302. package/dist/es6/common/lib/utils/useUniqueId.d.ts.map +1 -1
  303. package/dist/es6/common/lib/utils/useUniqueId.js +42 -4
  304. package/dist/es6/cookie-banner/index.d.ts +3 -3
  305. package/dist/es6/cookie-banner/index.d.ts.map +1 -1
  306. package/dist/es6/cookie-banner/index.js +3 -3
  307. package/dist/es6/cookie-banner/lib/CookieBanner.d.ts +19 -2
  308. package/dist/es6/cookie-banner/lib/CookieBanner.d.ts.map +1 -1
  309. package/dist/es6/cookie-banner/lib/CookieBanner.js +19 -8
  310. package/dist/es6/dialog/lib/hooks/useDialogCard.d.ts +4 -16
  311. package/dist/es6/dialog/lib/hooks/useDialogCard.d.ts.map +1 -1
  312. package/dist/es6/dialog/lib/hooks/useDialogPopper.d.ts +5 -2
  313. package/dist/es6/dialog/lib/hooks/useDialogPopper.d.ts.map +1 -1
  314. package/dist/es6/form-field/lib/FormField.d.ts.map +1 -1
  315. package/dist/es6/form-field/lib/FormField.js +2 -3
  316. package/dist/es6/modal/lib/ModalOverlay.d.ts +4 -2
  317. package/dist/es6/modal/lib/ModalOverlay.d.ts.map +1 -1
  318. package/dist/es6/modal/lib/hooks/useModalCard.d.ts +4 -16
  319. package/dist/es6/modal/lib/hooks/useModalCard.d.ts.map +1 -1
  320. package/dist/es6/modal/lib/hooks/useModalHeading.d.ts +5 -17
  321. package/dist/es6/modal/lib/hooks/useModalHeading.d.ts.map +1 -1
  322. package/dist/es6/page-header/index.d.ts +3 -3
  323. package/dist/es6/page-header/index.d.ts.map +1 -1
  324. package/dist/es6/page-header/index.js +3 -3
  325. package/dist/es6/page-header/lib/PageHeader.d.ts +19 -2
  326. package/dist/es6/page-header/lib/PageHeader.d.ts.map +1 -1
  327. package/dist/es6/page-header/lib/PageHeader.js +18 -7
  328. package/dist/es6/pagination/lib/Pagination/PageList.d.ts +1 -1
  329. package/dist/es6/pagination/lib/Pagination/PageList.d.ts.map +1 -1
  330. package/dist/es6/pagination/lib/Pagination/Pagination.d.ts +5 -5
  331. package/dist/es6/pagination/lib/Pagination/common/List.d.ts +1 -1
  332. package/dist/es6/pagination/lib/Pagination/common/List.d.ts.map +1 -1
  333. package/dist/es6/pagination/lib/Pagination/common/utils/getValidChildren.d.ts +1 -1
  334. package/dist/es6/pagination/lib/Pagination/common/utils/getValidChildren.d.ts.map +1 -1
  335. package/dist/es6/popup/lib/PopupCard.js +3 -4
  336. package/dist/es6/popup/lib/hooks/focus-trap-js.d.ts.map +1 -1
  337. package/dist/es6/popup/lib/hooks/focus-trap-js.js +1 -0
  338. package/dist/es6/popup/lib/hooks/usePopupCard.d.ts +5 -2
  339. package/dist/es6/popup/lib/hooks/usePopupCard.d.ts.map +1 -1
  340. package/dist/es6/popup/lib/hooks/usePopupCloseButton.d.ts +4 -2
  341. package/dist/es6/popup/lib/hooks/usePopupCloseButton.d.ts.map +1 -1
  342. package/dist/es6/popup/lib/hooks/usePopupHeading.d.ts +5 -2
  343. package/dist/es6/popup/lib/hooks/usePopupHeading.d.ts.map +1 -1
  344. package/dist/es6/popup/lib/hooks/usePopupPopper.d.ts +4 -2
  345. package/dist/es6/popup/lib/hooks/usePopupPopper.d.ts.map +1 -1
  346. package/dist/es6/popup/lib/hooks/usePopupTarget.d.ts +4 -2
  347. package/dist/es6/popup/lib/hooks/usePopupTarget.d.ts.map +1 -1
  348. package/dist/es6/popup/lib/hooks/useReturnFocus.d.ts +1 -1
  349. package/dist/es6/popup/lib/hooks/useReturnFocus.js +1 -1
  350. package/dist/es6/radio/lib/Radio.d.ts +1 -1
  351. package/dist/es6/switch/lib/Switch.d.ts +1 -1
  352. package/dist/es6/table/lib/TableRow.d.ts +5 -4
  353. package/dist/es6/table/lib/TableRow.d.ts.map +1 -1
  354. package/dist/es6/table/lib/TableRow.js +12 -26
  355. package/dist/es6/tabs/index.d.ts +5 -0
  356. package/dist/es6/tabs/index.d.ts.map +1 -1
  357. package/dist/es6/tabs/index.js +5 -0
  358. package/dist/es6/tabs/lib/Tabs.d.ts +35 -7
  359. package/dist/es6/tabs/lib/Tabs.d.ts.map +1 -1
  360. package/dist/es6/tabs/lib/Tabs.js +28 -7
  361. package/dist/es6/tabs/lib/TabsItem.d.ts +107 -0
  362. package/dist/es6/tabs/lib/TabsItem.d.ts.map +1 -0
  363. package/dist/es6/tabs/lib/TabsItem.js +131 -0
  364. package/dist/es6/tabs/lib/TabsList.d.ts +43 -0
  365. package/dist/es6/tabs/lib/TabsList.d.ts.map +1 -0
  366. package/dist/es6/tabs/lib/TabsList.js +44 -0
  367. package/dist/es6/tabs/lib/TabsMenuPopper.d.ts +21 -0
  368. package/dist/es6/tabs/lib/TabsMenuPopper.d.ts.map +1 -0
  369. package/dist/es6/tabs/lib/{TabList.js → TabsMenuPopper.js} +8 -20
  370. package/dist/es6/tabs/lib/TabsOverflowButton.d.ts +31 -0
  371. package/dist/es6/tabs/lib/TabsOverflowButton.d.ts.map +1 -0
  372. package/dist/es6/tabs/lib/TabsOverflowButton.js +48 -0
  373. package/dist/{commonjs/tabs/lib/TabPanel.d.ts → es6/tabs/lib/TabsPanel.d.ts} +15 -5
  374. package/dist/es6/tabs/lib/TabsPanel.d.ts.map +1 -0
  375. package/dist/es6/tabs/lib/TabsPanel.js +59 -0
  376. package/{ts3.5/dist/commonjs/tabs/lib/TabList.d.ts → dist/es6/tabs/lib/TabsPanels.d.ts} +15 -15
  377. package/dist/es6/tabs/lib/TabsPanels.d.ts.map +1 -0
  378. package/dist/es6/tabs/lib/TabsPanels.js +12 -0
  379. package/dist/es6/tabs/lib/cursor/index.d.ts +1 -1
  380. package/dist/es6/tabs/lib/cursor/index.d.ts.map +1 -1
  381. package/dist/es6/tabs/lib/cursor/index.js +1 -1
  382. package/dist/es6/tabs/lib/cursor/useCursorModel.d.ts +23 -13
  383. package/dist/es6/tabs/lib/cursor/useCursorModel.d.ts.map +1 -1
  384. package/dist/es6/tabs/lib/cursor/useCursorModel.js +51 -50
  385. package/dist/es6/tabs/lib/cursor/useRovingFocus.d.ts +37 -0
  386. package/dist/es6/tabs/lib/cursor/useRovingFocus.d.ts.map +1 -0
  387. package/dist/es6/tabs/lib/cursor/useRovingFocus.js +84 -0
  388. package/dist/es6/tabs/lib/list/index.d.ts +2 -1
  389. package/dist/es6/tabs/lib/list/index.d.ts.map +1 -1
  390. package/dist/es6/tabs/lib/list/index.js +2 -1
  391. package/dist/es6/tabs/lib/list/renderItem.d.ts +4 -0
  392. package/dist/es6/tabs/lib/list/renderItem.d.ts.map +1 -0
  393. package/dist/es6/tabs/lib/list/renderItem.js +12 -0
  394. package/dist/es6/tabs/lib/list/useListModel.d.ts +25 -13
  395. package/dist/es6/tabs/lib/list/useListModel.d.ts.map +1 -1
  396. package/dist/es6/tabs/lib/list/useListModel.js +21 -8
  397. package/dist/es6/tabs/lib/list/useListRegisterItem.d.ts +14 -0
  398. package/dist/es6/tabs/lib/list/useListRegisterItem.d.ts.map +1 -0
  399. package/dist/es6/tabs/lib/list/useListRegisterItem.js +41 -0
  400. package/dist/es6/tabs/lib/menu/Menu.d.ts +80 -0
  401. package/dist/es6/tabs/lib/menu/Menu.d.ts.map +1 -0
  402. package/dist/es6/tabs/lib/menu/Menu.js +89 -0
  403. package/dist/es6/tabs/lib/menu/MenuCard.d.ts +17 -0
  404. package/dist/es6/tabs/lib/menu/MenuCard.d.ts.map +1 -0
  405. package/dist/es6/tabs/lib/menu/MenuCard.js +73 -0
  406. package/dist/es6/tabs/lib/menu/MenuItem.d.ts +62 -0
  407. package/dist/es6/tabs/lib/menu/MenuItem.d.ts.map +1 -0
  408. package/dist/es6/tabs/lib/menu/MenuItem.js +136 -0
  409. package/dist/es6/tabs/lib/menu/MenuList.d.ts +23 -0
  410. package/dist/es6/tabs/lib/menu/MenuList.d.ts.map +1 -0
  411. package/dist/es6/tabs/lib/menu/MenuList.js +43 -0
  412. package/dist/es6/tabs/lib/menu/MenuPopper.d.ts +21 -0
  413. package/dist/es6/tabs/lib/menu/MenuPopper.d.ts.map +1 -0
  414. package/dist/es6/tabs/lib/menu/MenuPopper.js +36 -0
  415. package/dist/es6/tabs/lib/menu/MenuTarget.d.ts +21 -0
  416. package/dist/es6/tabs/lib/menu/MenuTarget.d.ts.map +1 -0
  417. package/dist/es6/tabs/lib/menu/MenuTarget.js +51 -0
  418. package/dist/es6/tabs/lib/menu/index.d.ts +8 -0
  419. package/dist/es6/tabs/lib/menu/index.d.ts.map +1 -0
  420. package/dist/es6/tabs/lib/menu/index.js +7 -0
  421. package/dist/es6/tabs/lib/menu/useMenuModel.d.ts +35 -0
  422. package/dist/es6/tabs/lib/menu/useMenuModel.d.ts.map +1 -0
  423. package/dist/es6/tabs/lib/menu/useMenuModel.js +31 -0
  424. package/dist/es6/tabs/lib/overflow/index.d.ts +5 -0
  425. package/dist/es6/tabs/lib/overflow/index.d.ts.map +1 -0
  426. package/dist/es6/tabs/lib/overflow/index.js +4 -0
  427. package/dist/es6/tabs/lib/overflow/useOverflowMeasureContainer.d.ts +8 -0
  428. package/dist/es6/tabs/lib/overflow/useOverflowMeasureContainer.d.ts.map +1 -0
  429. package/dist/es6/tabs/lib/overflow/useOverflowMeasureContainer.js +13 -0
  430. package/dist/es6/tabs/lib/overflow/useOverflowMeasureItem.d.ts +10 -0
  431. package/dist/es6/tabs/lib/overflow/useOverflowMeasureItem.d.ts.map +1 -0
  432. package/dist/es6/tabs/lib/overflow/useOverflowMeasureItem.js +30 -0
  433. package/dist/es6/tabs/lib/overflow/useOverflowModel.d.ts +69 -0
  434. package/dist/es6/tabs/lib/overflow/useOverflowModel.d.ts.map +1 -0
  435. package/dist/es6/tabs/lib/overflow/useOverflowModel.js +120 -0
  436. package/dist/es6/tabs/lib/overflow/useOverflowTarget.d.ts +11 -0
  437. package/dist/es6/tabs/lib/overflow/useOverflowTarget.d.ts.map +1 -0
  438. package/dist/es6/tabs/lib/overflow/useOverflowTarget.js +30 -0
  439. package/dist/es6/tabs/lib/selection/index.d.ts +4 -0
  440. package/dist/es6/tabs/lib/selection/index.d.ts.map +1 -0
  441. package/dist/es6/tabs/lib/selection/index.js +3 -0
  442. package/dist/es6/tabs/lib/selection/useResetCursorOnBlur.d.ts +13 -0
  443. package/dist/es6/tabs/lib/selection/useResetCursorOnBlur.d.ts.map +1 -0
  444. package/dist/es6/tabs/lib/{hooks.js → selection/useResetCursorOnBlur.js} +8 -9
  445. package/dist/es6/tabs/lib/selection/useSelectionItem.d.ts +8 -0
  446. package/dist/es6/tabs/lib/selection/useSelectionItem.d.ts.map +1 -0
  447. package/dist/es6/tabs/lib/selection/useSelectionItem.js +14 -0
  448. package/dist/es6/tabs/lib/selection/useSelectionModel.d.ts +62 -0
  449. package/dist/es6/tabs/lib/selection/useSelectionModel.d.ts.map +1 -0
  450. package/dist/es6/tabs/lib/selection/useSelectionModel.js +75 -0
  451. package/dist/es6/tabs/lib/useTabsModel.d.ts +39 -38
  452. package/dist/es6/tabs/lib/useTabsModel.d.ts.map +1 -1
  453. package/dist/es6/tabs/lib/useTabsModel.js +50 -37
  454. package/dist/es6/tokens/index.d.ts +3 -20
  455. package/dist/es6/tokens/index.d.ts.map +1 -1
  456. package/dist/es6/tokens/index.js +1 -1
  457. package/dist/es6/tokens/lib/depth.d.ts +109 -3
  458. package/dist/es6/tokens/lib/depth.d.ts.map +1 -1
  459. package/dist/es6/tokens/lib/depth.js +40 -2
  460. package/dist/es6/tooltip/lib/useTooltip.d.ts +1 -1
  461. package/dist/es6/tooltip/lib/useTooltip.js +2 -2
  462. package/form-field/lib/FormField.tsx +8 -3
  463. package/package.json +7 -7
  464. package/page-header/README.md +11 -6
  465. package/page-header/index.ts +3 -3
  466. package/page-header/lib/PageHeader.tsx +28 -3
  467. package/popup/lib/PopupCard.tsx +3 -3
  468. package/popup/lib/hooks/focus-trap-js.ts +1 -0
  469. package/popup/lib/hooks/useReturnFocus.tsx +1 -1
  470. package/radio/lib/Radio.tsx +1 -1
  471. package/switch/lib/Switch.tsx +1 -1
  472. package/table/lib/TableRow.tsx +19 -13
  473. package/tabs/index.ts +6 -0
  474. package/tabs/lib/Tabs.tsx +34 -9
  475. package/tabs/lib/TabsItem.tsx +250 -0
  476. package/tabs/lib/TabsList.tsx +67 -0
  477. package/tabs/lib/TabsMenuPopper.tsx +27 -0
  478. package/tabs/lib/TabsOverflowButton.tsx +58 -0
  479. package/tabs/lib/{TabPanel.tsx → TabsPanel.tsx} +33 -31
  480. package/tabs/lib/TabsPanels.tsx +28 -0
  481. package/tabs/lib/cursor/index.ts +1 -1
  482. package/tabs/lib/cursor/useCursorModel.tsx +78 -65
  483. package/tabs/lib/cursor/useRovingFocus.tsx +94 -0
  484. package/tabs/lib/list/index.ts +2 -1
  485. package/tabs/lib/list/renderItem.tsx +19 -0
  486. package/tabs/lib/list/useListModel.tsx +48 -23
  487. package/tabs/lib/list/useListRegisterItem.tsx +53 -0
  488. package/tabs/lib/menu/Menu.tsx +95 -0
  489. package/tabs/lib/menu/MenuCard.tsx +96 -0
  490. package/tabs/lib/menu/MenuItem.tsx +195 -0
  491. package/tabs/lib/menu/MenuList.tsx +58 -0
  492. package/tabs/lib/menu/MenuPopper.tsx +31 -0
  493. package/tabs/lib/menu/MenuTarget.tsx +52 -0
  494. package/tabs/lib/menu/index.ts +8 -0
  495. package/tabs/lib/menu/useMenuModel.tsx +67 -0
  496. package/tabs/lib/overflow/index.ts +4 -0
  497. package/tabs/lib/overflow/spec/tsconfig.json +3 -0
  498. package/tabs/lib/overflow/spec/useOverflowModel.spec.tsx +46 -0
  499. package/tabs/lib/overflow/useOverflowMeasureContainer.ts +20 -0
  500. package/tabs/lib/overflow/useOverflowMeasureItem.tsx +40 -0
  501. package/tabs/lib/overflow/useOverflowModel.tsx +207 -0
  502. package/tabs/lib/overflow/useOverflowTarget.tsx +42 -0
  503. package/tabs/lib/selection/index.ts +3 -0
  504. package/tabs/lib/selection/useResetCursorOnBlur.tsx +29 -0
  505. package/tabs/lib/selection/useSelectionItem.tsx +26 -0
  506. package/tabs/lib/selection/useSelectionModel.tsx +133 -0
  507. package/tabs/lib/useTabsModel.tsx +93 -78
  508. package/tokens/README.md +5 -12
  509. package/tokens/index.ts +2 -2
  510. package/tokens/lib/depth.ts +125 -3
  511. package/tooltip/lib/useTooltip.tsx +2 -2
  512. package/ts3.5/dist/commonjs/button/lib/PrimaryButton.d.ts +80 -6
  513. package/ts3.5/dist/commonjs/button/lib/SecondaryButton.d.ts +8 -5
  514. package/ts3.5/dist/commonjs/button/lib/TertiaryButton.d.ts +8 -4
  515. package/ts3.5/dist/commonjs/button/lib/parts/ButtonContainer.d.ts +5 -3
  516. package/ts3.5/dist/commonjs/button/lib/parts/ButtonLabel.d.ts +1 -1
  517. package/ts3.5/dist/commonjs/button/lib/parts/ButtonLabelIcon.d.ts +7 -4
  518. package/ts3.5/dist/commonjs/button/lib/types.d.ts +9 -0
  519. package/ts3.5/dist/commonjs/checkbox/lib/Checkbox.d.ts +1 -1
  520. package/ts3.5/dist/commonjs/common/index.d.ts +1 -0
  521. package/ts3.5/dist/commonjs/common/lib/EllipsisText.d.ts +5 -0
  522. package/ts3.5/dist/commonjs/common/lib/styles/accessibleHide.d.ts +2 -2
  523. package/ts3.5/dist/commonjs/common/lib/theming/breakpoints.d.ts +287 -6
  524. package/ts3.5/dist/commonjs/common/lib/theming/types.d.ts +191 -1
  525. package/ts3.5/dist/commonjs/common/lib/utils/components.d.ts +19 -9
  526. package/ts3.5/dist/commonjs/common/lib/utils/elements.d.ts +2 -2
  527. package/ts3.5/dist/commonjs/common/lib/utils/index.d.ts +2 -0
  528. package/ts3.5/dist/commonjs/common/lib/utils/useConstant.d.ts +9 -0
  529. package/ts3.5/dist/commonjs/common/lib/utils/useResizeObserver.d.ts +3 -0
  530. package/ts3.5/dist/commonjs/common/lib/utils/useUniqueId.d.ts +28 -0
  531. package/ts3.5/dist/commonjs/cookie-banner/index.d.ts +3 -3
  532. package/ts3.5/dist/commonjs/cookie-banner/lib/CookieBanner.d.ts +19 -2
  533. package/ts3.5/dist/commonjs/dialog/lib/hooks/useDialogCard.d.ts +4 -16
  534. package/ts3.5/dist/commonjs/dialog/lib/hooks/useDialogPopper.d.ts +5 -2
  535. package/ts3.5/dist/commonjs/modal/lib/ModalOverlay.d.ts +4 -2
  536. package/ts3.5/dist/commonjs/modal/lib/hooks/useModalCard.d.ts +4 -16
  537. package/ts3.5/dist/commonjs/modal/lib/hooks/useModalHeading.d.ts +5 -17
  538. package/ts3.5/dist/commonjs/page-header/index.d.ts +3 -3
  539. package/ts3.5/dist/commonjs/page-header/lib/PageHeader.d.ts +19 -2
  540. package/ts3.5/dist/commonjs/pagination/lib/Pagination/PageList.d.ts +1 -1
  541. package/ts3.5/dist/commonjs/pagination/lib/Pagination/Pagination.d.ts +5 -5
  542. package/ts3.5/dist/commonjs/pagination/lib/Pagination/common/List.d.ts +1 -1
  543. package/ts3.5/dist/commonjs/pagination/lib/Pagination/common/utils/getValidChildren.d.ts +1 -1
  544. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupCard.d.ts +5 -2
  545. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupCloseButton.d.ts +4 -2
  546. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupHeading.d.ts +5 -2
  547. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupPopper.d.ts +4 -2
  548. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupTarget.d.ts +4 -2
  549. package/ts3.5/dist/commonjs/popup/lib/hooks/useReturnFocus.d.ts +1 -1
  550. package/ts3.5/dist/commonjs/radio/lib/Radio.d.ts +1 -1
  551. package/ts3.5/dist/commonjs/switch/lib/Switch.d.ts +1 -1
  552. package/ts3.5/dist/commonjs/table/lib/TableRow.d.ts +5 -4
  553. package/ts3.5/dist/commonjs/tabs/index.d.ts +5 -0
  554. package/ts3.5/dist/commonjs/tabs/lib/Tabs.d.ts +35 -7
  555. package/ts3.5/dist/commonjs/tabs/lib/TabsItem.d.ts +107 -0
  556. package/ts3.5/dist/commonjs/tabs/lib/TabsList.d.ts +43 -0
  557. package/ts3.5/dist/commonjs/tabs/lib/TabsMenuPopper.d.ts +21 -0
  558. package/ts3.5/dist/commonjs/tabs/lib/TabsOverflowButton.d.ts +31 -0
  559. package/{dist/es6/tabs/lib/TabPanel.d.ts → ts3.5/dist/commonjs/tabs/lib/TabsPanel.d.ts} +39 -29
  560. package/ts3.5/dist/{es6/tabs/lib/TabList.d.ts → commonjs/tabs/lib/TabsPanels.d.ts} +5 -5
  561. package/ts3.5/dist/commonjs/tabs/lib/cursor/index.d.ts +1 -1
  562. package/ts3.5/dist/commonjs/tabs/lib/cursor/useCursorModel.d.ts +23 -13
  563. package/ts3.5/dist/commonjs/tabs/lib/cursor/useRovingFocus.d.ts +37 -0
  564. package/ts3.5/dist/commonjs/tabs/lib/list/index.d.ts +2 -1
  565. package/ts3.5/dist/commonjs/tabs/lib/list/renderItem.d.ts +4 -0
  566. package/ts3.5/dist/commonjs/tabs/lib/list/useListModel.d.ts +25 -13
  567. package/ts3.5/dist/commonjs/tabs/lib/list/useListRegisterItem.d.ts +14 -0
  568. package/ts3.5/dist/commonjs/tabs/lib/menu/Menu.d.ts +80 -0
  569. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuCard.d.ts +17 -0
  570. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuItem.d.ts +62 -0
  571. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuList.d.ts +23 -0
  572. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuPopper.d.ts +21 -0
  573. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuTarget.d.ts +21 -0
  574. package/ts3.5/dist/commonjs/tabs/lib/menu/index.d.ts +8 -0
  575. package/ts3.5/dist/commonjs/tabs/lib/menu/useMenuModel.d.ts +35 -0
  576. package/ts3.5/dist/commonjs/tabs/lib/overflow/index.d.ts +5 -0
  577. package/ts3.5/dist/commonjs/tabs/lib/overflow/useOverflowMeasureContainer.d.ts +8 -0
  578. package/ts3.5/dist/commonjs/tabs/lib/overflow/useOverflowMeasureItem.d.ts +10 -0
  579. package/ts3.5/dist/commonjs/tabs/lib/overflow/useOverflowModel.d.ts +69 -0
  580. package/ts3.5/dist/commonjs/tabs/lib/overflow/useOverflowTarget.d.ts +11 -0
  581. package/ts3.5/dist/commonjs/tabs/lib/selection/index.d.ts +4 -0
  582. package/ts3.5/dist/commonjs/tabs/lib/selection/useResetCursorOnBlur.d.ts +13 -0
  583. package/ts3.5/dist/commonjs/tabs/lib/selection/useSelectionItem.d.ts +8 -0
  584. package/ts3.5/dist/commonjs/tabs/lib/selection/useSelectionModel.d.ts +62 -0
  585. package/ts3.5/dist/commonjs/tabs/lib/useTabsModel.d.ts +39 -38
  586. package/ts3.5/dist/commonjs/tokens/index.d.ts +3 -20
  587. package/ts3.5/dist/commonjs/tokens/lib/depth.d.ts +109 -3
  588. package/ts3.5/dist/commonjs/tooltip/lib/useTooltip.d.ts +1 -1
  589. package/ts3.5/dist/es6/button/lib/PrimaryButton.d.ts +80 -6
  590. package/ts3.5/dist/es6/button/lib/SecondaryButton.d.ts +8 -5
  591. package/ts3.5/dist/es6/button/lib/TertiaryButton.d.ts +8 -4
  592. package/ts3.5/dist/es6/button/lib/parts/ButtonContainer.d.ts +5 -3
  593. package/ts3.5/dist/es6/button/lib/parts/ButtonLabel.d.ts +1 -1
  594. package/ts3.5/dist/es6/button/lib/parts/ButtonLabelIcon.d.ts +7 -4
  595. package/ts3.5/dist/es6/button/lib/types.d.ts +9 -0
  596. package/ts3.5/dist/es6/checkbox/lib/Checkbox.d.ts +1 -1
  597. package/ts3.5/dist/es6/common/index.d.ts +1 -0
  598. package/ts3.5/dist/es6/common/lib/EllipsisText.d.ts +5 -0
  599. package/ts3.5/dist/es6/common/lib/styles/accessibleHide.d.ts +2 -2
  600. package/ts3.5/dist/es6/common/lib/theming/breakpoints.d.ts +287 -6
  601. package/ts3.5/dist/es6/common/lib/theming/types.d.ts +191 -1
  602. package/ts3.5/dist/es6/common/lib/utils/components.d.ts +19 -9
  603. package/ts3.5/dist/es6/common/lib/utils/elements.d.ts +2 -2
  604. package/ts3.5/dist/es6/common/lib/utils/index.d.ts +2 -0
  605. package/ts3.5/dist/es6/common/lib/utils/useConstant.d.ts +9 -0
  606. package/ts3.5/dist/es6/common/lib/utils/useResizeObserver.d.ts +3 -0
  607. package/ts3.5/dist/es6/common/lib/utils/useUniqueId.d.ts +28 -0
  608. package/ts3.5/dist/es6/cookie-banner/index.d.ts +3 -3
  609. package/ts3.5/dist/es6/cookie-banner/lib/CookieBanner.d.ts +19 -2
  610. package/ts3.5/dist/es6/dialog/lib/hooks/useDialogCard.d.ts +4 -16
  611. package/ts3.5/dist/es6/dialog/lib/hooks/useDialogPopper.d.ts +5 -2
  612. package/ts3.5/dist/es6/modal/lib/ModalOverlay.d.ts +4 -2
  613. package/ts3.5/dist/es6/modal/lib/hooks/useModalCard.d.ts +4 -16
  614. package/ts3.5/dist/es6/modal/lib/hooks/useModalHeading.d.ts +5 -17
  615. package/ts3.5/dist/es6/page-header/index.d.ts +3 -3
  616. package/ts3.5/dist/es6/page-header/lib/PageHeader.d.ts +19 -2
  617. package/ts3.5/dist/es6/pagination/lib/Pagination/PageList.d.ts +1 -1
  618. package/ts3.5/dist/es6/pagination/lib/Pagination/Pagination.d.ts +5 -5
  619. package/ts3.5/dist/es6/pagination/lib/Pagination/common/List.d.ts +1 -1
  620. package/ts3.5/dist/es6/pagination/lib/Pagination/common/utils/getValidChildren.d.ts +1 -1
  621. package/ts3.5/dist/es6/popup/lib/hooks/usePopupCard.d.ts +5 -2
  622. package/ts3.5/dist/es6/popup/lib/hooks/usePopupCloseButton.d.ts +4 -2
  623. package/ts3.5/dist/es6/popup/lib/hooks/usePopupHeading.d.ts +5 -2
  624. package/ts3.5/dist/es6/popup/lib/hooks/usePopupPopper.d.ts +4 -2
  625. package/ts3.5/dist/es6/popup/lib/hooks/usePopupTarget.d.ts +4 -2
  626. package/ts3.5/dist/es6/popup/lib/hooks/useReturnFocus.d.ts +1 -1
  627. package/ts3.5/dist/es6/radio/lib/Radio.d.ts +1 -1
  628. package/ts3.5/dist/es6/switch/lib/Switch.d.ts +1 -1
  629. package/ts3.5/dist/es6/table/lib/TableRow.d.ts +5 -4
  630. package/ts3.5/dist/es6/tabs/index.d.ts +5 -0
  631. package/ts3.5/dist/es6/tabs/lib/Tabs.d.ts +35 -7
  632. package/ts3.5/dist/es6/tabs/lib/TabsItem.d.ts +107 -0
  633. package/ts3.5/dist/es6/tabs/lib/TabsList.d.ts +43 -0
  634. package/ts3.5/dist/es6/tabs/lib/TabsMenuPopper.d.ts +21 -0
  635. package/ts3.5/dist/es6/tabs/lib/TabsOverflowButton.d.ts +31 -0
  636. package/ts3.5/dist/es6/tabs/lib/{TabPanel.d.ts → TabsPanel.d.ts} +15 -5
  637. package/{dist/commonjs/tabs/lib/TabList.d.ts → ts3.5/dist/es6/tabs/lib/TabsPanels.d.ts} +15 -15
  638. package/ts3.5/dist/es6/tabs/lib/cursor/index.d.ts +1 -1
  639. package/ts3.5/dist/es6/tabs/lib/cursor/useCursorModel.d.ts +23 -13
  640. package/ts3.5/dist/es6/tabs/lib/cursor/useRovingFocus.d.ts +37 -0
  641. package/ts3.5/dist/es6/tabs/lib/list/index.d.ts +2 -1
  642. package/ts3.5/dist/es6/tabs/lib/list/renderItem.d.ts +4 -0
  643. package/ts3.5/dist/es6/tabs/lib/list/useListModel.d.ts +25 -13
  644. package/ts3.5/dist/es6/tabs/lib/list/useListRegisterItem.d.ts +14 -0
  645. package/ts3.5/dist/es6/tabs/lib/menu/Menu.d.ts +80 -0
  646. package/ts3.5/dist/es6/tabs/lib/menu/MenuCard.d.ts +17 -0
  647. package/ts3.5/dist/es6/tabs/lib/menu/MenuItem.d.ts +62 -0
  648. package/ts3.5/dist/es6/tabs/lib/menu/MenuList.d.ts +23 -0
  649. package/ts3.5/dist/es6/tabs/lib/menu/MenuPopper.d.ts +21 -0
  650. package/ts3.5/dist/es6/tabs/lib/menu/MenuTarget.d.ts +21 -0
  651. package/ts3.5/dist/es6/tabs/lib/menu/index.d.ts +8 -0
  652. package/ts3.5/dist/es6/tabs/lib/menu/useMenuModel.d.ts +35 -0
  653. package/ts3.5/dist/es6/tabs/lib/overflow/index.d.ts +5 -0
  654. package/ts3.5/dist/es6/tabs/lib/overflow/useOverflowMeasureContainer.d.ts +8 -0
  655. package/ts3.5/dist/es6/tabs/lib/overflow/useOverflowMeasureItem.d.ts +10 -0
  656. package/ts3.5/dist/es6/tabs/lib/overflow/useOverflowModel.d.ts +69 -0
  657. package/ts3.5/dist/es6/tabs/lib/overflow/useOverflowTarget.d.ts +11 -0
  658. package/ts3.5/dist/es6/tabs/lib/selection/index.d.ts +4 -0
  659. package/ts3.5/dist/es6/tabs/lib/selection/useResetCursorOnBlur.d.ts +13 -0
  660. package/ts3.5/dist/es6/tabs/lib/selection/useSelectionItem.d.ts +8 -0
  661. package/ts3.5/dist/es6/tabs/lib/selection/useSelectionModel.d.ts +62 -0
  662. package/ts3.5/dist/es6/tabs/lib/useTabsModel.d.ts +39 -38
  663. package/ts3.5/dist/es6/tokens/index.d.ts +3 -20
  664. package/ts3.5/dist/es6/tokens/lib/depth.d.ts +109 -3
  665. package/ts3.5/dist/es6/tooltip/lib/useTooltip.d.ts +1 -1
  666. package/dist/commonjs/tabs/lib/Tab.d.ts +0 -49
  667. package/dist/commonjs/tabs/lib/Tab.d.ts.map +0 -1
  668. package/dist/commonjs/tabs/lib/Tab.js +0 -95
  669. package/dist/commonjs/tabs/lib/TabList.d.ts.map +0 -1
  670. package/dist/commonjs/tabs/lib/TabPanel.d.ts.map +0 -1
  671. package/dist/commonjs/tabs/lib/TabPanel.js +0 -56
  672. package/dist/commonjs/tabs/lib/cursor/hooks.d.ts +0 -39
  673. package/dist/commonjs/tabs/lib/cursor/hooks.d.ts.map +0 -1
  674. package/dist/commonjs/tabs/lib/hooks.d.ts +0 -10
  675. package/dist/commonjs/tabs/lib/hooks.d.ts.map +0 -1
  676. package/dist/commonjs/tabs/lib/list/hooks.d.ts +0 -11
  677. package/dist/commonjs/tabs/lib/list/hooks.d.ts.map +0 -1
  678. package/dist/commonjs/tabs/lib/list/hooks.js +0 -39
  679. package/dist/es6/tabs/lib/Tab.d.ts +0 -49
  680. package/dist/es6/tabs/lib/Tab.d.ts.map +0 -1
  681. package/dist/es6/tabs/lib/Tab.js +0 -86
  682. package/dist/es6/tabs/lib/TabList.d.ts.map +0 -1
  683. package/dist/es6/tabs/lib/TabPanel.d.ts.map +0 -1
  684. package/dist/es6/tabs/lib/TabPanel.js +0 -51
  685. package/dist/es6/tabs/lib/cursor/hooks.d.ts +0 -39
  686. package/dist/es6/tabs/lib/cursor/hooks.d.ts.map +0 -1
  687. package/dist/es6/tabs/lib/cursor/hooks.js +0 -108
  688. package/dist/es6/tabs/lib/hooks.d.ts +0 -10
  689. package/dist/es6/tabs/lib/hooks.d.ts.map +0 -1
  690. package/dist/es6/tabs/lib/list/hooks.d.ts +0 -11
  691. package/dist/es6/tabs/lib/list/hooks.d.ts.map +0 -1
  692. package/dist/es6/tabs/lib/list/hooks.js +0 -34
  693. package/tabs/lib/Tab.tsx +0 -170
  694. package/tabs/lib/TabList.tsx +0 -59
  695. package/tabs/lib/cursor/hooks.tsx +0 -122
  696. package/tabs/lib/hooks.tsx +0 -31
  697. package/tabs/lib/list/hooks.tsx +0 -45
  698. package/ts3.5/dist/commonjs/tabs/lib/Tab.d.ts +0 -49
  699. package/ts3.5/dist/commonjs/tabs/lib/cursor/hooks.d.ts +0 -39
  700. package/ts3.5/dist/commonjs/tabs/lib/hooks.d.ts +0 -10
  701. package/ts3.5/dist/commonjs/tabs/lib/list/hooks.d.ts +0 -11
  702. package/ts3.5/dist/es6/tabs/lib/Tab.d.ts +0 -49
  703. package/ts3.5/dist/es6/tabs/lib/cursor/hooks.d.ts +0 -39
  704. package/ts3.5/dist/es6/tabs/lib/hooks.d.ts +0 -10
  705. package/ts3.5/dist/es6/tabs/lib/list/hooks.d.ts +0 -11
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { GrowthBehavior, Themeable, EmotionCanvasTheme } from '@workday/canvas-kit-react/common';
3
3
  import { CanvasSystemIcon } from '@workday/design-assets-types';
4
- import { ButtonColors } from './types';
4
+ import { ButtonColors, ButtonSizes, IconPositions } from './types';
5
5
  export interface SecondaryButtonProps extends Themeable, GrowthBehavior {
6
6
  /**
7
7
  * The variant of the SecondaryButton.
@@ -9,10 +9,12 @@ export interface SecondaryButtonProps extends Themeable, GrowthBehavior {
9
9
  */
10
10
  variant?: 'inverse' | undefined;
11
11
  /**
12
- * The size of the Button.
12
+ * There are four button sizes: `extraSmall`, `small`, `medium`, and `large`.
13
+ * If no size is provided, it will default to `medium`.
14
+ *
13
15
  * @default 'medium'
14
16
  */
15
- size?: 'small' | 'medium' | 'large';
17
+ size?: ButtonSizes;
16
18
  /**
17
19
  * The data label of the Button.
18
20
  * Note: not displayed at `small` size
@@ -24,10 +26,11 @@ export interface SecondaryButtonProps extends Themeable, GrowthBehavior {
24
26
  */
25
27
  icon?: CanvasSystemIcon;
26
28
  /**
27
- * The position of the TertiaryButton icon.
29
+ * Button icon positions can either be `left` or `right`.
30
+ * If no value is provided, it defaults to `left`.
28
31
  * @default 'left'
29
32
  */
30
- iconPosition?: 'left' | 'right';
33
+ iconPosition?: IconPositions;
31
34
  /**
32
35
  * If set to `true`, transform the icon's x-axis to mirror the graphic
33
36
  * @default false
@@ -1 +1 @@
1
- {"version":3,"file":"SecondaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/SecondaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EACL,cAAc,EAEd,SAAS,EACT,kBAAkB,EAGnB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAC,YAAY,EAAC,MAAM,SAAS,CAAC;AAGrC,MAAM,WAAW,oBAAqB,SAAQ,SAAS,EAAE,cAAc;IACrE;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,eAAe,yEA8C1B,CAAC;AAEH,eAAO,MAAM,wBAAwB,6EA8FpC,CAAC"}
1
+ {"version":3,"file":"SecondaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/SecondaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EACL,cAAc,EAEd,SAAS,EACT,kBAAkB,EAGnB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AAGjE,MAAM,WAAW,oBAAqB,SAAQ,SAAS,EAAE,cAAc;IACrE;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;;OAIG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAYD,eAAO,MAAM,eAAe,yEA+C1B,CAAC;AAEH,eAAO,MAAM,wBAAwB,6EA+FpC,CAAC"}
@@ -33,6 +33,15 @@ var React = __importStar(require("react"));
33
33
  var tokens_1 = require("@workday/canvas-kit-react/tokens");
34
34
  var common_1 = require("@workday/canvas-kit-react/common");
35
35
  var parts_1 = require("./parts");
36
+ // Button sizes where data labels are enabled
37
+ var dataLabelSizes = ['medium', 'large'];
38
+ // All disabled buttons are set to 40% opacity.
39
+ // This will eventually live in the ButtonContainer styles, but for now we're scoping it to Primary, Secondary, and Tertiary buttons.
40
+ var disabledButtonOpacity = {
41
+ '&:disabled, &:disabled:active': {
42
+ opacity: 0.4,
43
+ },
44
+ };
36
45
  exports.SecondaryButton = common_1.createComponent('button')({
37
46
  displayName: 'SecondaryButton',
38
47
  Component: function (_a, ref, Element) {
@@ -43,11 +52,11 @@ exports.SecondaryButton = common_1.createComponent('button')({
43
52
  // TODO: Fix useTheme and make it a real hook
44
53
  // eslint-disable-next-line react-hooks/rules-of-hooks
45
54
  theme = _b === void 0 ? common_1.useTheme() : _b, _c = _a.size, size = _c === void 0 ? 'medium' : _c, _d = _a.iconPosition, iconPosition = _d === void 0 ? 'left' : _d, variant = _a.variant, dataLabel = _a.dataLabel, icon = _a.icon, _e = _a.shouldMirrorIcon, shouldMirrorIcon = _e === void 0 ? false : _e, children = _a.children, elemProps = __rest(_a, ["theme", "size", "iconPosition", "variant", "dataLabel", "icon", "shouldMirrorIcon", "children"]);
46
- return (React.createElement(parts_1.ButtonContainer, __assign({ ref: ref, as: Element, colors: exports.getSecondaryButtonColors(variant, theme), size: size }, elemProps),
47
- icon && size !== 'small' && iconPosition === 'left' && (React.createElement(parts_1.ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
55
+ return (React.createElement(parts_1.ButtonContainer, __assign({ ref: ref, as: Element, colors: exports.getSecondaryButtonColors(variant, theme), size: size, extraStyles: disabledButtonOpacity }, elemProps),
56
+ icon && iconPosition === 'left' && (React.createElement(parts_1.ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
48
57
  React.createElement(parts_1.ButtonLabel, null, children),
49
- dataLabel && size !== 'small' && React.createElement(parts_1.ButtonLabelData, null, dataLabel),
50
- icon && size !== 'small' && iconPosition === 'right' && (React.createElement(parts_1.ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon }))));
58
+ dataLabel && dataLabelSizes.includes(size) && React.createElement(parts_1.ButtonLabelData, null, dataLabel),
59
+ icon && iconPosition === 'right' && (React.createElement(parts_1.ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon }))));
51
60
  },
52
61
  });
53
62
  exports.getSecondaryButtonColors = function (variant, theme) {
@@ -83,12 +92,13 @@ exports.getSecondaryButtonColors = function (variant, theme) {
83
92
  label: tokens_1.colors.blackPepper400,
84
93
  labelData: tokens_1.colors.blackPepper400,
85
94
  },
95
+ // Identical to 'default' styles. ButtonContainer will set opacity to 40%
86
96
  disabled: {
87
97
  background: 'transparent',
88
- border: 'rgba(30, 30, 30, 0.4)',
89
- icon: 'rgba(30, 30, 30, 0.4)',
90
- label: 'rgba(30, 30, 30, 0.4)',
91
- labelData: 'rgba(30, 30, 30, 0.4)',
98
+ border: tokens_1.colors.blackPepper400,
99
+ icon: tokens_1.colors.blackPepper400,
100
+ label: tokens_1.colors.blackPepper400,
101
+ labelData: tokens_1.colors.blackPepper400,
92
102
  },
93
103
  };
94
104
  case 'inverse':
@@ -124,12 +134,12 @@ exports.getSecondaryButtonColors = function (variant, theme) {
124
134
  outerColor: tokens_1.colors.frenchVanilla100,
125
135
  }, theme),
126
136
  },
137
+ // Identical to inverse 'default' styles. ButtonContainer will set opacity to 40%
127
138
  disabled: {
128
139
  background: 'transparent',
129
- border: 'rgba(255, 255, 255, 0.4)',
130
- icon: 'rgba(255, 255, 255, 0.4)',
131
- label: 'rgba(255, 255, 255, 0.4)',
132
- labelData: 'rgba(255, 255, 255, 0.4)',
140
+ border: tokens_1.colors.frenchVanilla100,
141
+ icon: tokens_1.colors.frenchVanilla100,
142
+ label: tokens_1.colors.frenchVanilla100,
133
143
  },
134
144
  };
135
145
  }
@@ -1,6 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { Themeable } from '@workday/canvas-kit-react/common';
3
3
  import { CanvasSystemIcon } from '@workday/design-assets-types';
4
+ import { TertiaryButtonSizes, IconPositions } from './types';
4
5
  export interface TertiaryButtonProps extends Themeable {
5
6
  /**
6
7
  * The variant of the TertiaryButton.
@@ -8,15 +9,18 @@ export interface TertiaryButtonProps extends Themeable {
8
9
  */
9
10
  variant?: 'inverse' | undefined;
10
11
  /**
11
- * The size of the TertiaryButton.
12
+ * There are three button sizes: `extraSmall`, `small`, and `medium`.
13
+ * If no size is provided, it will default to `medium`.
14
+ *
12
15
  * @default 'medium'
13
16
  */
14
- size?: 'small' | 'medium';
17
+ size?: TertiaryButtonSizes;
15
18
  /**
16
- * The position of the TertiaryButton icon.
19
+ * Button icon positions can either be `left` or `right`.
20
+ * If no value is provided, it defaults to `left`.
17
21
  * @default 'left'
18
22
  */
19
- iconPosition?: 'left' | 'right';
23
+ iconPosition?: IconPositions;
20
24
  /**
21
25
  * The icon of the TertiaryButton.
22
26
  */
@@ -1 +1 @@
1
- {"version":3,"file":"TertiaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/TertiaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAGL,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAI9D,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC1B;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AA8FD,eAAO,MAAM,cAAc,wEA8DzB,CAAC"}
1
+ {"version":3,"file":"TertiaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/TertiaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAGL,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAe,mBAAmB,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AAGzE,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B;;;;OAIG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAuGD,eAAO,MAAM,cAAc,wEA4DzB,CAAC"}
@@ -65,8 +65,8 @@ var getTertiaryButtonColors = function (variant, theme) {
65
65
  },
66
66
  disabled: {
67
67
  background: 'transparent',
68
- icon: 'rgba(255, 255, 255, 0.5)',
69
- label: 'rgba(255, 255, 255, 0.5)',
68
+ icon: tokens_1.colors.frenchVanilla100,
69
+ label: tokens_1.colors.frenchVanilla100,
70
70
  },
71
71
  };
72
72
  }
@@ -93,24 +93,29 @@ var getTertiaryButtonColors = function (variant, theme) {
93
93
  },
94
94
  disabled: {
95
95
  background: 'transparent',
96
- icon: themePrimary.light,
97
- label: themePrimary.light,
96
+ icon: themePrimary.main,
97
+ label: themePrimary.main,
98
98
  },
99
99
  };
100
100
  }
101
101
  };
102
- var containerStyles = {
103
- borderRadius: tokens_1.borderRadius.m,
104
- border: '0',
105
- padding: "0 " + tokens_1.space.xxs,
106
- minWidth: 'auto',
107
- '.wdc-text-button-label': {
108
- borderBottom: '2px solid transparent',
109
- paddingTop: '2px',
110
- transition: 'border-color 0.3s',
111
- },
112
- '&:hover:not([disabled]) .wdc-text-button-label': {
113
- borderBottomColor: 'currentColor',
102
+ var getPaddingStyles = function (icon, iconPosition) {
103
+ // if there is an icon on the left, add 4px extra padding to the right for visual balance
104
+ if (icon && iconPosition === 'left') {
105
+ return "0 " + tokens_1.space.xs + " 0 " + tokens_1.space.xxs;
106
+ }
107
+ // if there is an icon on the right, add 4px extra padding to the left for visual balance
108
+ if (icon && iconPosition === 'right') {
109
+ return "0 " + tokens_1.space.xxs + " 0 " + tokens_1.space.xs;
110
+ }
111
+ // if there is no icon, return the default padding
112
+ return "0 " + tokens_1.space.xxs;
113
+ };
114
+ // All disabled buttons are set to 40% opacity.
115
+ // This will eventually live in the ButtonContainer styles, but for now we're scoping it to Primary, Secondary, and Tertiary buttons.
116
+ var disabledButtonOpacity = {
117
+ '&:disabled, &:disabled:active': {
118
+ opacity: 0.4,
114
119
  },
115
120
  };
116
121
  exports.TertiaryButton = common_1.createComponent('button')({
@@ -123,9 +128,9 @@ exports.TertiaryButton = common_1.createComponent('button')({
123
128
  // TODO: Fix useTheme and make it a real hook
124
129
  // eslint-disable-next-line react-hooks/rules-of-hooks
125
130
  theme = _b === void 0 ? common_1.useTheme() : _b, _c = _a.size, size = _c === void 0 ? 'medium' : _c, _d = _a.iconPosition, iconPosition = _d === void 0 ? 'left' : _d, variant = _a.variant, children = _a.children, icon = _a.icon, _e = _a.shouldMirrorIcon, shouldMirrorIcon = _e === void 0 ? false : _e, allCaps = _a.allCaps, elemProps = __rest(_a, ["theme", "size", "iconPosition", "variant", "children", "icon", "shouldMirrorIcon", "allCaps"]);
126
- // Note: We don't use ButtonLabel because the label styles differ from other button types
127
- var allContainerStyles = allCaps
128
- ? __assign(__assign({}, containerStyles), { textTransform: 'uppercase', fontWeight: tokens_1.type.properties.fontWeights.bold, fontSize: size === 'medium' ? tokens_1.type.properties.fontSizes[16] : undefined, letterSpacing: '.5px' }) : __assign(__assign({}, containerStyles), { fontSize: size === 'medium' ? tokens_1.type.properties.fontSizes[14] : undefined });
131
+ var allContainerStyles = __assign({ borderRadius: tokens_1.borderRadius.m, border: '0', padding: getPaddingStyles(icon, iconPosition), minWidth: 'auto', textTransform: allCaps ? 'uppercase' : undefined, '.wdc-text-button-label': {
132
+ textDecoration: 'underline',
133
+ } }, disabledButtonOpacity);
129
134
  return (React.createElement(parts_1.ButtonContainer, __assign({ ref: ref, as: Element, colors: getTertiaryButtonColors(variant, theme), size: size, extraStyles: allContainerStyles }, elemProps),
130
135
  icon && iconPosition === 'left' && (React.createElement(parts_1.ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
131
136
  React.createElement(parts_1.ButtonLabel, { className: "wdc-text-button-label" }, children),
@@ -1,14 +1,16 @@
1
1
  import * as React from 'react';
2
2
  import { CSSObject } from '@emotion/core';
3
3
  import { GrowthBehavior, EmotionCanvasTheme, StyledType } from '@workday/canvas-kit-react/common';
4
- import { ButtonColors } from '../types';
4
+ import { ButtonColors, ButtonSizes } from '../types';
5
5
  export interface ButtonContainerProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, GrowthBehavior {
6
6
  colors?: ButtonColors;
7
7
  /**
8
- * The size of the Button.
8
+ * There are four button sizes: `extraSmall`, `small`, `medium`, and `large`.
9
+ * If no size is provided, it will default to `medium`.
10
+ *
9
11
  * @default 'medium'
10
12
  */
11
- size?: 'small' | 'medium' | 'large';
13
+ size?: ButtonSizes;
12
14
  /**
13
15
  * The ref to the button that the styled component renders.
14
16
  */
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonContainer.d.ts","sourceRoot":"","sources":["../../../../../button/lib/parts/ButtonContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,SAAS,EAAC,MAAM,eAAe,CAAC;AAExC,OAAO,EACL,cAAc,EAId,kBAAkB,EAClB,UAAU,EACX,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,YAAY,EAAC,MAAM,UAAU,CAAC;AAGtC,MAAM,WAAW,oBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,cAAc;IAChB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AA8BD,eAAO,MAAM,eAAe,kMAqK3B,CAAC"}
1
+ {"version":3,"file":"ButtonContainer.d.ts","sourceRoot":"","sources":["../../../../../button/lib/parts/ButtonContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,SAAS,EAAC,MAAM,eAAe,CAAC;AAExC,OAAO,EACL,cAAc,EAId,kBAAkB,EAClB,UAAU,EACX,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,YAAY,EAAE,WAAW,EAAC,MAAM,UAAU,CAAC;AAGnD,MAAM,WAAW,oBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,cAAc;IAChB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AA8BD,eAAO,MAAM,eAAe,kMAgL3B,CAAC"}
@@ -50,15 +50,9 @@ exports.ButtonContainer = common_1.styled('button', {
50
50
  var size = _a.size;
51
51
  switch (size) {
52
52
  case 'large':
53
- return {
54
- fontSize: tokens_1.type.properties.fontSizes[16],
55
- minWidth: '112px',
56
- height: '48px',
57
- padding: "0 " + tokens_1.space.l,
58
- '& > * ': {
59
- margin: "0 " + tokens_1.spaceNumbers.xs / 2 + "px",
60
- },
61
- };
53
+ return __assign(__assign({}, tokens_1.type.levels.body.small), { fontWeight: tokens_1.type.properties.fontWeights.bold, minWidth: '112px', height: '48px', padding: "0 " + tokens_1.space.l, '& > * ': {
54
+ margin: "0 " + tokens_1.spaceNumbers.xxs / 2 + "px",
55
+ } });
62
56
  case 'medium':
63
57
  default:
64
58
  return {
@@ -78,6 +72,10 @@ exports.ButtonContainer = common_1.styled('button', {
78
72
  margin: "0 " + tokens_1.spaceNumbers.xxxs / 2 + "px",
79
73
  },
80
74
  };
75
+ case 'extraSmall':
76
+ return __assign(__assign({}, tokens_1.type.levels.subtext.medium), { fontWeight: tokens_1.type.properties.fontWeights.bold, height: tokens_1.space.m, padding: "0 " + tokens_1.space.xs, '& > * ': {
77
+ margin: "0 " + tokens_1.spaceNumbers.xxxs / 2 + "px",
78
+ } });
81
79
  }
82
80
  }, function (_a) {
83
81
  var grow = _a.grow;
@@ -1,3 +1,3 @@
1
1
  /// <reference types="@emotion/core" />
2
- export declare const ButtonLabel: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "css" | "style" | "title" | "dir" | "slot" | "children" | "hidden" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">, import("../../../common").EmotionCanvasTheme>;
2
+ export declare const ButtonLabel: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "css" | "style" | "slot" | "title" | "dir" | "children" | "hidden" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">, import("../../../common").EmotionCanvasTheme>;
3
3
  //# sourceMappingURL=ButtonLabel.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonLabel.d.ts","sourceRoot":"","sources":["../../../../../button/lib/parts/ButtonLabel.tsx"],"names":[],"mappings":";AAEA,eAAO,MAAM,WAAW,sxJAKtB,CAAC"}
1
+ {"version":3,"file":"ButtonLabel.d.ts","sourceRoot":"","sources":["../../../../../button/lib/parts/ButtonLabel.tsx"],"names":[],"mappings":";AAEA,eAAO,MAAM,WAAW,oyJAKtB,CAAC"}
@@ -1,20 +1,23 @@
1
1
  import { CanvasSystemIcon } from '@workday/design-assets-types';
2
+ import { ButtonSizes, IconPositions } from '../types';
2
3
  export interface ButtonLabelIconProps {
3
4
  /**
4
- * The size of the Button.
5
+ * There are four button sizes: `extraSmall`, `small`, `medium`, and `large`.
6
+ *
5
7
  * @default 'medium'
6
8
  */
7
- size?: 'small' | 'medium' | 'large';
9
+ size?: ButtonSizes;
8
10
  /**
9
11
  * The icon of the Button.
10
12
  * Note: not displayed at `small` size
11
13
  */
12
14
  icon?: CanvasSystemIcon;
13
15
  /**
14
- * The position of the TertiaryButton icon.
16
+ * Button icon positions can either be `left` or `right`.
17
+ * If no value is provided, it defaults to `left`.
15
18
  * @default 'left'
16
19
  */
17
- iconPosition?: 'left' | 'right';
20
+ iconPosition?: IconPositions;
18
21
  /**
19
22
  * If set to `true`, transform the icon's x-axis to mirror the graphic
20
23
  * @default false
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonLabelIcon.d.ts","sourceRoot":"","sources":["../../../../../button/lib/parts/ButtonLabelIcon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAM9D,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAqBD,eAAO,MAAM,eAAe,4GAmB3B,CAAC"}
1
+ {"version":3,"file":"ButtonLabelIcon.d.ts","sourceRoot":"","sources":["../../../../../button/lib/parts/ButtonLabelIcon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAM9D,OAAO,EAAC,WAAW,EAAE,aAAa,EAAC,MAAM,UAAU,CAAC;AACpD,MAAM,WAAW,oBAAoB;IACnC;;;;OAIG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;;OAIG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAuCD,eAAO,MAAM,eAAe,4GAkB3B,CAAC"}
@@ -37,8 +37,30 @@ var tokens_1 = require("@workday/canvas-kit-react/tokens");
37
37
  var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
38
38
  var icon_1 = require("@workday/canvas-kit-react/icon");
39
39
  var common_1 = require("@workday/canvas-kit-react/common");
40
- var ICON_SIZE = 24;
41
- var SMALL_ICON_SIZE = 20;
40
+ var iconSizes = {
41
+ extraSmall: 18,
42
+ small: 20,
43
+ medium: 20,
44
+ large: 24,
45
+ };
46
+ var getIconPositionStyles = function (_a) {
47
+ var iconPosition = _a.iconPosition, size = _a.size;
48
+ // Adjust margin values for visual balance, large buttons require 8px
49
+ var balancingMargin = size === 'large' ? tokens_1.space.xxs : tokens_1.space.xxxs;
50
+ // iconPosition can only be "right", "left", or undefined (defaults to "left")
51
+ if (iconPosition === 'right') {
52
+ return {
53
+ marginLeft: undefined,
54
+ marginRight: "-" + balancingMargin + " !important",
55
+ };
56
+ }
57
+ else {
58
+ return {
59
+ marginLeft: "-" + balancingMargin + " !important",
60
+ marginRight: undefined,
61
+ };
62
+ }
63
+ };
42
64
  var ButtonLabelIconStyled = common_1.styled('span', {
43
65
  shouldForwardProp: function (prop) { return is_prop_valid_1.default(prop) && prop !== 'size'; },
44
66
  })({
@@ -46,23 +68,16 @@ var ButtonLabelIconStyled = common_1.styled('span', {
46
68
  }, function (_a) {
47
69
  var size = _a.size;
48
70
  return ({
49
- width: size === 'small' ? SMALL_ICON_SIZE : ICON_SIZE,
50
- height: size === 'small' ? SMALL_ICON_SIZE : ICON_SIZE,
51
- });
52
- }, function (_a) {
53
- var iconPosition = _a.iconPosition;
54
- return ({
55
- marginLeft: iconPosition === 'right' ? undefined : "-" + tokens_1.space.xxxs + " !important",
56
- marginRight: iconPosition === 'right' ? "-" + tokens_1.space.xxxs + " !important" : undefined,
71
+ width: size ? iconSizes[size] : iconSizes.medium,
72
+ height: size ? iconSizes[size] : iconSizes.medium,
57
73
  });
58
- });
74
+ }, getIconPositionStyles);
59
75
  exports.ButtonLabelIcon = function (_a) {
60
76
  var icon = _a.icon, size = _a.size, iconPosition = _a.iconPosition, _b = _a.shouldMirrorIcon, shouldMirrorIcon = _b === void 0 ? false : _b, elemProps = __rest(_a, ["icon", "size", "iconPosition", "shouldMirrorIcon"]);
61
- /* istanbul ignore next line for coverage */
62
77
  if (icon === undefined) {
63
78
  return null;
64
79
  }
65
- var iconSize = size === 'small' ? SMALL_ICON_SIZE : undefined;
80
+ var iconSize = size ? iconSizes[size] : undefined;
66
81
  return (React.createElement(ButtonLabelIconStyled, __assign({ iconPosition: iconPosition, size: size }, elemProps),
67
82
  React.createElement(icon_1.SystemIcon, { size: iconSize, icon: icon, shouldMirror: shouldMirrorIcon })));
68
83
  };
@@ -19,4 +19,13 @@ export interface ButtonColors {
19
19
  };
20
20
  disabled: ButtonStateColors;
21
21
  }
22
+ /**
23
+ * There are four button sizes: `extraSmall`, `small`, `medium`, and `large`.
24
+ * If no size is provided, it will default to `medium`.
25
+ *
26
+ * @default 'medium'
27
+ */
28
+ export declare type ButtonSizes = 'extraSmall' | 'small' | 'medium' | 'large';
29
+ export declare type TertiaryButtonSizes = 'extraSmall' | 'small' | 'medium';
30
+ export declare type IconPositions = 'left' | 'right';
22
31
  //# sourceMappingURL=types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../button/lib/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAC,MAAM,eAAe,CAAC;AAExC;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AACD,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,KAAK,EAAE,iBAAiB,CAAC;IACzB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,KAAK,EAAE,iBAAiB,GAAG;QACzB,SAAS,CAAC,EAAE,SAAS,CAAC;KACvB,CAAC;IACF,QAAQ,EAAE,iBAAiB,CAAC;CAC7B"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../button/lib/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAC,MAAM,eAAe,CAAC;AAExC;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AACD,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,KAAK,EAAE,iBAAiB,CAAC;IACzB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,KAAK,EAAE,iBAAiB,GAAG;QACzB,SAAS,CAAC,EAAE,SAAS,CAAC;KACvB,CAAC;IACF,QAAQ,EAAE,iBAAiB,CAAC;CAC7B;AAED;;;;;GAKG;AACH,oBAAY,WAAW,GAAG,YAAY,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtE,oBAAY,mBAAmB,GAAG,YAAY,GAAG,OAAO,GAAG,QAAQ,CAAC;AACpE,oBAAY,aAAa,GAAG,MAAM,GAAG,OAAO,CAAC"}
@@ -13,7 +13,7 @@ export interface CheckboxProps extends Themeable {
13
13
  disabled?: boolean;
14
14
  /**
15
15
  * The HTML `id` of the underlying checkbox input element. This is required if `label` is defined as a non-empty string.
16
- * @default A uniquely generated id by uuid()
16
+ * @default A uniquely generated id
17
17
  */
18
18
  id?: string;
19
19
  /**
@@ -6,4 +6,5 @@ export * from './lib/styles';
6
6
  export * from './lib/utils';
7
7
  export * from './lib/CanvasProvider';
8
8
  export * from './lib/InputProvider';
9
+ export * from './lib/EllipsisText';
9
10
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../common/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../common/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC"}
@@ -10,3 +10,4 @@ __export(require("./lib/styles"));
10
10
  __export(require("./lib/utils"));
11
11
  __export(require("./lib/CanvasProvider"));
12
12
  __export(require("./lib/InputProvider"));
13
+ __export(require("./lib/EllipsisText"));
@@ -0,0 +1,5 @@
1
+ import { CSSObject } from '@emotion/styled';
2
+ import { ElementComponent } from '..';
3
+ export declare const ellipsisStyles: CSSObject;
4
+ export declare const EllipsisText: ElementComponent<"span", {}>;
5
+ //# sourceMappingURL=EllipsisText.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"EllipsisText.d.ts","sourceRoot":"","sources":["../../../../common/lib/EllipsisText.tsx"],"names":[],"mappings":"AAAA,OAAe,EAAC,SAAS,EAAC,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAC,gBAAgB,EAAC,MAAM,IAAI,CAAC;AAEpC,eAAO,MAAM,cAAc,EAAE,SAI5B,CAAC;AAGF,eAAO,MAAM,YAAY,8BAA0E,CAAC"}
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ var styled_1 = __importDefault(require("@emotion/styled"));
7
+ exports.ellipsisStyles = {
8
+ whiteSpace: 'nowrap',
9
+ textOverflow: 'ellipsis',
10
+ overflow: 'hidden',
11
+ };
12
+ // Recast as an `ElementComponent` due to better type support for `as` and `ref`
13
+ exports.EllipsisText = styled_1.default('span')(exports.ellipsisStyles);
@@ -1 +1 @@
1
- {"version":3,"file":"_brand-assets.d.ts","sourceRoot":"","sources":["../../../../../common/lib/parts/_brand-assets.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW,QAA+C,CAAC;AAExE,eAAO,MAAM,YAAY,QAAgD,CAAC;AAE1E,eAAO,MAAM,YAAY,QAAgD,CAAC;AAE1E,eAAO,MAAM,aAAa,QAAiD,CAAC;AAE5E,eAAO,MAAM,gBAAgB,QAAqD,CAAC"}
1
+ {"version":3,"file":"_brand-assets.d.ts","sourceRoot":"","sources":["../../../../../common/lib/parts/_brand-assets.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW,QAAsD,CAAC;AAE/E,eAAO,MAAM,YAAY,QAAuD,CAAC;AAEjF,eAAO,MAAM,YAAY,QAAuD,CAAC;AAEjF,eAAO,MAAM,aAAa,QAAwD,CAAC;AAEnF,eAAO,MAAM,gBAAgB,QAA4D,CAAC"}
@@ -1,8 +1,8 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- var CDN_URI = '//design.workday.com/images/';
4
- exports.dubLogoBlue = "<img src=\"" + CDN_URI + "ck-dub-logo-blue.svg\">";
5
- exports.dubLogoWhite = "<img src=\"" + CDN_URI + "ck-dub-logo-white.svg\">";
6
- exports.wdayLogoBlue = "<img src=\"" + CDN_URI + "ck-wday-logo-blue.svg\">";
7
- exports.wdayLogoWhite = "<img src=\"" + CDN_URI + "ck-wday-logo-white.svg\">";
8
- exports.miniWdayLogoBlue = "<img src=\"" + CDN_URI + "ck-mini-wday-logo-blue.svg\">";
3
+ var CDN_URI = 'https://design.workday.com/images/';
4
+ exports.dubLogoBlue = "<img src=\"" + CDN_URI + "ck-dub-logo-blue.svg\" alt=\"\">";
5
+ exports.dubLogoWhite = "<img src=\"" + CDN_URI + "ck-dub-logo-white.svg\" alt=\"\">";
6
+ exports.wdayLogoBlue = "<img src=\"" + CDN_URI + "ck-wday-logo-blue.svg\" alt=\"\">";
7
+ exports.wdayLogoWhite = "<img src=\"" + CDN_URI + "ck-wday-logo-white.svg\" alt=\"\">";
8
+ exports.miniWdayLogoBlue = "<img src=\"" + CDN_URI + "ck-mini-wday-logo-blue.svg\" alt=\"\">";
@@ -1,7 +1,7 @@
1
- import { CSSObject } from '@emotion/core';
1
+ import { CSSProperties } from '@workday/canvas-kit-react/tokens';
2
2
  /**
3
3
  * A utility to hide content normal users while still making accessible to screenreaders
4
4
  * See https://a11y-101.com/development/skip-link
5
5
  */
6
- export declare const accessibleHide: CSSObject;
6
+ export declare const accessibleHide: CSSProperties;
7
7
  //# sourceMappingURL=accessibleHide.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"accessibleHide.d.ts","sourceRoot":"","sources":["../../../../../common/lib/styles/accessibleHide.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAC,MAAM,eAAe,CAAC;AAExC;;;GAGG;AACH,eAAO,MAAM,cAAc,EAAE,SAW5B,CAAC"}
1
+ {"version":3,"file":"accessibleHide.d.ts","sourceRoot":"","sources":["../../../../../common/lib/styles/accessibleHide.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAE/D;;;GAGG;AACH,eAAO,MAAM,cAAc,EAAE,aAW5B,CAAC"}