@workday/canvas-kit-react 6.0.0-beta.0-next.13 → 6.0.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 (677) hide show
  1. package/action-bar/lib/ActionBar.tsx +43 -30
  2. package/button/lib/PrimaryButton.tsx +110 -32
  3. package/button/lib/SecondaryButton.tsx +31 -16
  4. package/button/lib/TertiaryButton.tsx +45 -36
  5. package/button/lib/parts/ButtonContainer.tsx +18 -5
  6. package/button/lib/parts/ButtonLabelIcon.tsx +34 -14
  7. package/button/lib/types.ts +11 -0
  8. package/common/index.ts +1 -0
  9. package/common/lib/EllipsisText.tsx +11 -0
  10. package/common/lib/styles/accessibleHide.ts +2 -2
  11. package/common/lib/theming/README.md +189 -25
  12. package/common/lib/theming/breakpoints.ts +296 -16
  13. package/common/lib/theming/types.ts +191 -1
  14. package/common/lib/utils/components.ts +50 -23
  15. package/common/lib/utils/index.ts +1 -0
  16. package/common/lib/utils/mergeProps.ts +4 -0
  17. package/common/lib/utils/useConstant.ts +18 -0
  18. package/common/lib/utils/useResizeObserver.ts +29 -0
  19. package/common/lib/utils/useUniqueId.ts +4 -3
  20. package/cookie-banner/README.md +15 -10
  21. package/cookie-banner/index.ts +3 -3
  22. package/cookie-banner/lib/CookieBanner.tsx +29 -4
  23. package/dist/commonjs/action-bar/lib/ActionBar.d.ts.map +1 -1
  24. package/dist/commonjs/action-bar/lib/ActionBar.js +35 -27
  25. package/dist/commonjs/button/lib/PrimaryButton.d.ts +80 -6
  26. package/dist/commonjs/button/lib/PrimaryButton.d.ts.map +1 -1
  27. package/dist/commonjs/button/lib/PrimaryButton.js +80 -26
  28. package/dist/commonjs/button/lib/SecondaryButton.d.ts +8 -5
  29. package/dist/commonjs/button/lib/SecondaryButton.d.ts.map +1 -1
  30. package/dist/commonjs/button/lib/SecondaryButton.js +22 -12
  31. package/dist/commonjs/button/lib/TertiaryButton.d.ts +8 -4
  32. package/dist/commonjs/button/lib/TertiaryButton.d.ts.map +1 -1
  33. package/dist/commonjs/button/lib/TertiaryButton.js +24 -20
  34. package/dist/commonjs/button/lib/parts/ButtonContainer.d.ts +5 -3
  35. package/dist/commonjs/button/lib/parts/ButtonContainer.d.ts.map +1 -1
  36. package/dist/commonjs/button/lib/parts/ButtonContainer.js +7 -9
  37. package/dist/commonjs/button/lib/parts/ButtonLabel.d.ts +1 -1
  38. package/dist/commonjs/button/lib/parts/ButtonLabel.d.ts.map +1 -1
  39. package/dist/commonjs/button/lib/parts/ButtonLabelIcon.d.ts +7 -4
  40. package/dist/commonjs/button/lib/parts/ButtonLabelIcon.d.ts.map +1 -1
  41. package/dist/commonjs/button/lib/parts/ButtonLabelIcon.js +28 -13
  42. package/dist/commonjs/button/lib/types.d.ts +9 -0
  43. package/dist/commonjs/button/lib/types.d.ts.map +1 -1
  44. package/dist/commonjs/common/index.d.ts +1 -0
  45. package/dist/commonjs/common/index.d.ts.map +1 -1
  46. package/dist/commonjs/common/index.js +1 -0
  47. package/dist/commonjs/common/lib/EllipsisText.d.ts +5 -0
  48. package/dist/commonjs/common/lib/EllipsisText.d.ts.map +1 -0
  49. package/dist/commonjs/common/lib/EllipsisText.js +13 -0
  50. package/dist/commonjs/common/lib/styles/accessibleHide.d.ts +2 -2
  51. package/dist/commonjs/common/lib/styles/accessibleHide.d.ts.map +1 -1
  52. package/dist/commonjs/common/lib/theming/breakpoints.d.ts +287 -6
  53. package/dist/commonjs/common/lib/theming/breakpoints.d.ts.map +1 -1
  54. package/dist/commonjs/common/lib/theming/breakpoints.js +192 -10
  55. package/dist/commonjs/common/lib/theming/types.d.ts +191 -1
  56. package/dist/commonjs/common/lib/theming/types.d.ts.map +1 -1
  57. package/dist/commonjs/common/lib/utils/components.d.ts +19 -9
  58. package/dist/commonjs/common/lib/utils/components.d.ts.map +1 -1
  59. package/dist/commonjs/common/lib/utils/components.js +12 -2
  60. package/dist/commonjs/common/lib/utils/index.d.ts +1 -0
  61. package/dist/commonjs/common/lib/utils/index.d.ts.map +1 -1
  62. package/dist/commonjs/common/lib/utils/index.js +1 -0
  63. package/dist/commonjs/common/lib/utils/mergeProps.d.ts.map +1 -1
  64. package/dist/commonjs/common/lib/utils/mergeProps.js +5 -0
  65. package/dist/commonjs/common/lib/utils/useConstant.d.ts +9 -0
  66. package/dist/commonjs/common/lib/utils/useConstant.d.ts.map +1 -0
  67. package/dist/commonjs/common/lib/utils/useConstant.js +18 -0
  68. package/dist/commonjs/common/lib/utils/useResizeObserver.d.ts +3 -0
  69. package/dist/commonjs/common/lib/utils/useResizeObserver.d.ts.map +1 -0
  70. package/dist/commonjs/common/lib/utils/useResizeObserver.js +42 -0
  71. package/dist/commonjs/common/lib/utils/useUniqueId.d.ts.map +1 -1
  72. package/dist/commonjs/common/lib/utils/useUniqueId.js +3 -10
  73. package/dist/commonjs/cookie-banner/index.d.ts +3 -3
  74. package/dist/commonjs/cookie-banner/index.d.ts.map +1 -1
  75. package/dist/commonjs/cookie-banner/index.js +1 -1
  76. package/dist/commonjs/cookie-banner/lib/CookieBanner.d.ts +19 -2
  77. package/dist/commonjs/cookie-banner/lib/CookieBanner.d.ts.map +1 -1
  78. package/dist/commonjs/cookie-banner/lib/CookieBanner.js +19 -8
  79. package/dist/commonjs/dialog/lib/hooks/useDialogCard.d.ts +4 -16
  80. package/dist/commonjs/dialog/lib/hooks/useDialogCard.d.ts.map +1 -1
  81. package/dist/commonjs/dialog/lib/hooks/useDialogPopper.d.ts +5 -2
  82. package/dist/commonjs/dialog/lib/hooks/useDialogPopper.d.ts.map +1 -1
  83. package/dist/commonjs/modal/lib/ModalOverlay.d.ts +4 -2
  84. package/dist/commonjs/modal/lib/ModalOverlay.d.ts.map +1 -1
  85. package/dist/commonjs/modal/lib/hooks/useModalCard.d.ts +4 -16
  86. package/dist/commonjs/modal/lib/hooks/useModalCard.d.ts.map +1 -1
  87. package/dist/commonjs/modal/lib/hooks/useModalHeading.d.ts +5 -17
  88. package/dist/commonjs/modal/lib/hooks/useModalHeading.d.ts.map +1 -1
  89. package/dist/commonjs/page-header/index.d.ts +3 -3
  90. package/dist/commonjs/page-header/index.d.ts.map +1 -1
  91. package/dist/commonjs/page-header/index.js +1 -1
  92. package/dist/commonjs/page-header/lib/PageHeader.d.ts +19 -2
  93. package/dist/commonjs/page-header/lib/PageHeader.d.ts.map +1 -1
  94. package/dist/commonjs/page-header/lib/PageHeader.js +18 -7
  95. package/dist/commonjs/pagination/lib/Pagination/GoTo/Label.d.ts +3 -0
  96. package/dist/commonjs/pagination/lib/Pagination/GoTo/Label.d.ts.map +1 -1
  97. package/dist/commonjs/pagination/lib/Pagination/PageList.d.ts +1 -1
  98. package/dist/commonjs/pagination/lib/Pagination/PageList.d.ts.map +1 -1
  99. package/dist/commonjs/pagination/lib/Pagination/Pagination.d.ts +5 -5
  100. package/dist/commonjs/pagination/lib/Pagination/common/List.d.ts +1 -1
  101. package/dist/commonjs/pagination/lib/Pagination/common/List.d.ts.map +1 -1
  102. package/dist/commonjs/pagination/lib/Pagination/common/utils/getValidChildren.d.ts +1 -1
  103. package/dist/commonjs/pagination/lib/Pagination/common/utils/getValidChildren.d.ts.map +1 -1
  104. package/dist/commonjs/pagination/lib/Pagination/common/utils/space.d.ts +28 -28
  105. package/dist/commonjs/pagination/lib/Pagination/types.d.ts +39 -0
  106. package/dist/commonjs/pagination/lib/Pagination/types.d.ts.map +1 -1
  107. package/dist/commonjs/pagination/lib/Pagination/usePaginationModel.d.ts +19 -0
  108. package/dist/commonjs/pagination/lib/Pagination/usePaginationModel.d.ts.map +1 -1
  109. package/dist/commonjs/popup/lib/PopupCard.d.ts.map +1 -1
  110. package/dist/commonjs/popup/lib/PopupCard.js +2 -3
  111. package/dist/commonjs/popup/lib/hooks/usePopupCard.d.ts +5 -2
  112. package/dist/commonjs/popup/lib/hooks/usePopupCard.d.ts.map +1 -1
  113. package/dist/commonjs/popup/lib/hooks/usePopupCloseButton.d.ts +4 -2
  114. package/dist/commonjs/popup/lib/hooks/usePopupCloseButton.d.ts.map +1 -1
  115. package/dist/commonjs/popup/lib/hooks/usePopupHeading.d.ts +5 -2
  116. package/dist/commonjs/popup/lib/hooks/usePopupHeading.d.ts.map +1 -1
  117. package/dist/commonjs/popup/lib/hooks/usePopupPopper.d.ts +4 -2
  118. package/dist/commonjs/popup/lib/hooks/usePopupPopper.d.ts.map +1 -1
  119. package/dist/commonjs/popup/lib/hooks/usePopupTarget.d.ts +4 -2
  120. package/dist/commonjs/popup/lib/hooks/usePopupTarget.d.ts.map +1 -1
  121. package/dist/commonjs/tabs/index.d.ts +5 -0
  122. package/dist/commonjs/tabs/index.d.ts.map +1 -1
  123. package/dist/commonjs/tabs/index.js +11 -0
  124. package/dist/commonjs/tabs/lib/Tabs.d.ts +35 -7
  125. package/dist/commonjs/tabs/lib/Tabs.d.ts.map +1 -1
  126. package/dist/commonjs/tabs/lib/Tabs.js +28 -7
  127. package/dist/commonjs/tabs/lib/TabsItem.d.ts +107 -0
  128. package/dist/commonjs/tabs/lib/TabsItem.d.ts.map +1 -0
  129. package/dist/commonjs/tabs/lib/TabsItem.js +140 -0
  130. package/dist/commonjs/tabs/lib/TabsList.d.ts +43 -0
  131. package/dist/commonjs/tabs/lib/TabsList.d.ts.map +1 -0
  132. package/dist/commonjs/tabs/lib/TabsList.js +53 -0
  133. package/dist/commonjs/tabs/lib/TabsMenuPopper.d.ts +21 -0
  134. package/dist/commonjs/tabs/lib/TabsMenuPopper.d.ts.map +1 -0
  135. package/dist/commonjs/tabs/lib/{TabList.js → TabsMenuPopper.js} +7 -19
  136. package/dist/commonjs/tabs/lib/TabsOverflowButton.d.ts +31 -0
  137. package/dist/commonjs/tabs/lib/TabsOverflowButton.d.ts.map +1 -0
  138. package/dist/commonjs/tabs/lib/TabsOverflowButton.js +57 -0
  139. package/{ts3.5/dist/commonjs/tabs/lib/TabPanel.d.ts → dist/commonjs/tabs/lib/TabsPanel.d.ts} +39 -29
  140. package/dist/commonjs/tabs/lib/TabsPanel.d.ts.map +1 -0
  141. package/dist/commonjs/tabs/lib/TabsPanel.js +64 -0
  142. package/dist/{es6/tabs/lib/TabList.d.ts → commonjs/tabs/lib/TabsPanels.d.ts} +5 -5
  143. package/dist/commonjs/tabs/lib/TabsPanels.d.ts.map +1 -0
  144. package/dist/commonjs/tabs/lib/TabsPanels.js +21 -0
  145. package/dist/commonjs/tabs/lib/cursor/index.d.ts +1 -1
  146. package/dist/commonjs/tabs/lib/cursor/index.d.ts.map +1 -1
  147. package/dist/commonjs/tabs/lib/cursor/index.js +1 -1
  148. package/dist/commonjs/tabs/lib/cursor/useCursorModel.d.ts +23 -13
  149. package/dist/commonjs/tabs/lib/cursor/useCursorModel.d.ts.map +1 -1
  150. package/dist/commonjs/tabs/lib/cursor/useCursorModel.js +50 -49
  151. package/dist/commonjs/tabs/lib/cursor/useRovingFocus.d.ts +37 -0
  152. package/dist/commonjs/tabs/lib/cursor/useRovingFocus.d.ts.map +1 -0
  153. package/dist/commonjs/tabs/lib/cursor/{hooks.js → useRovingFocus.js} +26 -50
  154. package/dist/commonjs/tabs/lib/list/index.d.ts +2 -1
  155. package/dist/commonjs/tabs/lib/list/index.d.ts.map +1 -1
  156. package/dist/commonjs/tabs/lib/list/index.js +2 -1
  157. package/dist/commonjs/tabs/lib/list/renderItem.d.ts +4 -0
  158. package/dist/commonjs/tabs/lib/list/renderItem.d.ts.map +1 -0
  159. package/dist/commonjs/tabs/lib/list/renderItem.js +18 -0
  160. package/dist/commonjs/tabs/lib/list/useListModel.d.ts +25 -13
  161. package/dist/commonjs/tabs/lib/list/useListModel.d.ts.map +1 -1
  162. package/dist/commonjs/tabs/lib/list/useListModel.js +20 -7
  163. package/dist/commonjs/tabs/lib/list/useListRegisterItem.d.ts +14 -0
  164. package/dist/commonjs/tabs/lib/list/useListRegisterItem.d.ts.map +1 -0
  165. package/dist/commonjs/tabs/lib/list/useListRegisterItem.js +46 -0
  166. package/dist/commonjs/tabs/lib/menu/Menu.d.ts +80 -0
  167. package/dist/commonjs/tabs/lib/menu/Menu.d.ts.map +1 -0
  168. package/dist/commonjs/tabs/lib/menu/Menu.js +94 -0
  169. package/dist/commonjs/tabs/lib/menu/MenuCard.d.ts +17 -0
  170. package/dist/commonjs/tabs/lib/menu/MenuCard.d.ts.map +1 -0
  171. package/dist/commonjs/tabs/lib/menu/MenuCard.js +82 -0
  172. package/dist/commonjs/tabs/lib/menu/MenuItem.d.ts +62 -0
  173. package/dist/commonjs/tabs/lib/menu/MenuItem.d.ts.map +1 -0
  174. package/dist/commonjs/tabs/lib/menu/MenuItem.js +145 -0
  175. package/dist/commonjs/tabs/lib/menu/MenuList.d.ts +23 -0
  176. package/dist/commonjs/tabs/lib/menu/MenuList.d.ts.map +1 -0
  177. package/dist/commonjs/tabs/lib/menu/MenuList.js +52 -0
  178. package/dist/commonjs/tabs/lib/menu/MenuPopper.d.ts +21 -0
  179. package/dist/commonjs/tabs/lib/menu/MenuPopper.d.ts.map +1 -0
  180. package/dist/commonjs/tabs/lib/menu/MenuPopper.js +45 -0
  181. package/dist/commonjs/tabs/lib/menu/MenuTarget.d.ts +21 -0
  182. package/dist/commonjs/tabs/lib/menu/MenuTarget.d.ts.map +1 -0
  183. package/dist/commonjs/tabs/lib/menu/MenuTarget.js +60 -0
  184. package/dist/commonjs/tabs/lib/menu/index.d.ts +8 -0
  185. package/dist/commonjs/tabs/lib/menu/index.d.ts.map +1 -0
  186. package/dist/commonjs/tabs/lib/menu/index.js +18 -0
  187. package/dist/commonjs/tabs/lib/menu/useMenuModel.d.ts +35 -0
  188. package/dist/commonjs/tabs/lib/menu/useMenuModel.d.ts.map +1 -0
  189. package/dist/commonjs/tabs/lib/menu/useMenuModel.js +33 -0
  190. package/dist/commonjs/tabs/lib/overflow/index.d.ts +5 -0
  191. package/dist/commonjs/tabs/lib/overflow/index.d.ts.map +1 -0
  192. package/dist/commonjs/tabs/lib/overflow/index.js +9 -0
  193. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureContainer.d.ts +8 -0
  194. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureContainer.d.ts.map +1 -0
  195. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureContainer.js +22 -0
  196. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureItem.d.ts +10 -0
  197. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureItem.d.ts.map +1 -0
  198. package/dist/commonjs/tabs/lib/overflow/useOverflowMeasureItem.js +32 -0
  199. package/dist/commonjs/tabs/lib/overflow/useOverflowModel.d.ts +69 -0
  200. package/dist/commonjs/tabs/lib/overflow/useOverflowModel.d.ts.map +1 -0
  201. package/dist/commonjs/tabs/lib/overflow/useOverflowModel.js +117 -0
  202. package/dist/commonjs/tabs/lib/overflow/useOverflowTarget.d.ts +11 -0
  203. package/dist/commonjs/tabs/lib/overflow/useOverflowTarget.d.ts.map +1 -0
  204. package/dist/commonjs/tabs/lib/overflow/useOverflowTarget.js +35 -0
  205. package/dist/commonjs/tabs/lib/selection/index.d.ts +4 -0
  206. package/dist/commonjs/tabs/lib/selection/index.d.ts.map +1 -0
  207. package/dist/commonjs/tabs/lib/selection/index.js +8 -0
  208. package/dist/commonjs/tabs/lib/selection/useResetCursorOnBlur.d.ts +13 -0
  209. package/dist/commonjs/tabs/lib/selection/useResetCursorOnBlur.d.ts.map +1 -0
  210. package/dist/commonjs/tabs/lib/{hooks.js → selection/useResetCursorOnBlur.js} +8 -9
  211. package/dist/commonjs/tabs/lib/selection/useSelectionItem.d.ts +8 -0
  212. package/dist/commonjs/tabs/lib/selection/useSelectionItem.d.ts.map +1 -0
  213. package/dist/commonjs/tabs/lib/selection/useSelectionItem.js +16 -0
  214. package/dist/commonjs/tabs/lib/selection/useSelectionModel.d.ts +62 -0
  215. package/dist/commonjs/tabs/lib/selection/useSelectionModel.d.ts.map +1 -0
  216. package/dist/commonjs/tabs/lib/selection/useSelectionModel.js +80 -0
  217. package/dist/commonjs/tabs/lib/useTabsModel.d.ts +39 -38
  218. package/dist/commonjs/tabs/lib/useTabsModel.d.ts.map +1 -1
  219. package/dist/commonjs/tabs/lib/useTabsModel.js +50 -37
  220. package/dist/commonjs/tokens/index.d.ts +3 -20
  221. package/dist/commonjs/tokens/index.d.ts.map +1 -1
  222. package/dist/commonjs/tokens/index.js +3 -6
  223. package/dist/commonjs/tokens/lib/depth.d.ts +109 -3
  224. package/dist/commonjs/tokens/lib/depth.d.ts.map +1 -1
  225. package/dist/commonjs/tokens/lib/depth.js +40 -5
  226. package/dist/commonjs/tooltip/lib/OverflowTooltip.d.ts +10 -0
  227. package/dist/commonjs/tooltip/lib/OverflowTooltip.d.ts.map +1 -1
  228. package/dist/commonjs/tooltip/lib/OverflowTooltip.js +19 -15
  229. package/dist/commonjs/tooltip/lib/useTooltip.d.ts +4 -4
  230. package/dist/commonjs/tooltip/lib/useTooltip.d.ts.map +1 -1
  231. package/dist/es6/action-bar/lib/ActionBar.d.ts.map +1 -1
  232. package/dist/es6/action-bar/lib/ActionBar.js +33 -22
  233. package/dist/es6/button/lib/PrimaryButton.d.ts +80 -6
  234. package/dist/es6/button/lib/PrimaryButton.d.ts.map +1 -1
  235. package/dist/es6/button/lib/PrimaryButton.js +81 -27
  236. package/dist/es6/button/lib/SecondaryButton.d.ts +8 -5
  237. package/dist/es6/button/lib/SecondaryButton.d.ts.map +1 -1
  238. package/dist/es6/button/lib/SecondaryButton.js +22 -12
  239. package/dist/es6/button/lib/TertiaryButton.d.ts +8 -4
  240. package/dist/es6/button/lib/TertiaryButton.d.ts.map +1 -1
  241. package/dist/es6/button/lib/TertiaryButton.js +25 -21
  242. package/dist/es6/button/lib/parts/ButtonContainer.d.ts +5 -3
  243. package/dist/es6/button/lib/parts/ButtonContainer.d.ts.map +1 -1
  244. package/dist/es6/button/lib/parts/ButtonContainer.js +7 -9
  245. package/dist/es6/button/lib/parts/ButtonLabel.d.ts +1 -1
  246. package/dist/es6/button/lib/parts/ButtonLabel.d.ts.map +1 -1
  247. package/dist/es6/button/lib/parts/ButtonLabelIcon.d.ts +7 -4
  248. package/dist/es6/button/lib/parts/ButtonLabelIcon.d.ts.map +1 -1
  249. package/dist/es6/button/lib/parts/ButtonLabelIcon.js +28 -13
  250. package/dist/es6/button/lib/types.d.ts +9 -0
  251. package/dist/es6/button/lib/types.d.ts.map +1 -1
  252. package/dist/es6/common/index.d.ts +1 -0
  253. package/dist/es6/common/index.d.ts.map +1 -1
  254. package/dist/es6/common/index.js +1 -0
  255. package/dist/es6/common/lib/EllipsisText.d.ts +5 -0
  256. package/dist/es6/common/lib/EllipsisText.d.ts.map +1 -0
  257. package/dist/es6/common/lib/EllipsisText.js +8 -0
  258. package/dist/es6/common/lib/styles/accessibleHide.d.ts +2 -2
  259. package/dist/es6/common/lib/styles/accessibleHide.d.ts.map +1 -1
  260. package/dist/es6/common/lib/theming/breakpoints.d.ts +287 -6
  261. package/dist/es6/common/lib/theming/breakpoints.d.ts.map +1 -1
  262. package/dist/es6/common/lib/theming/breakpoints.js +192 -10
  263. package/dist/es6/common/lib/theming/types.d.ts +191 -1
  264. package/dist/es6/common/lib/theming/types.d.ts.map +1 -1
  265. package/dist/es6/common/lib/utils/components.d.ts +19 -9
  266. package/dist/es6/common/lib/utils/components.d.ts.map +1 -1
  267. package/dist/es6/common/lib/utils/components.js +12 -2
  268. package/dist/es6/common/lib/utils/index.d.ts +1 -0
  269. package/dist/es6/common/lib/utils/index.d.ts.map +1 -1
  270. package/dist/es6/common/lib/utils/index.js +1 -0
  271. package/dist/es6/common/lib/utils/mergeProps.d.ts.map +1 -1
  272. package/dist/es6/common/lib/utils/mergeProps.js +5 -0
  273. package/dist/es6/common/lib/utils/useConstant.d.ts +9 -0
  274. package/dist/es6/common/lib/utils/useConstant.d.ts.map +1 -0
  275. package/dist/es6/common/lib/utils/useConstant.js +15 -0
  276. package/dist/es6/common/lib/utils/useResizeObserver.d.ts +3 -0
  277. package/dist/es6/common/lib/utils/useResizeObserver.d.ts.map +1 -0
  278. package/dist/es6/common/lib/utils/useResizeObserver.js +37 -0
  279. package/dist/es6/common/lib/utils/useUniqueId.d.ts.map +1 -1
  280. package/dist/es6/common/lib/utils/useUniqueId.js +3 -3
  281. package/dist/es6/cookie-banner/index.d.ts +3 -3
  282. package/dist/es6/cookie-banner/index.d.ts.map +1 -1
  283. package/dist/es6/cookie-banner/index.js +3 -3
  284. package/dist/es6/cookie-banner/lib/CookieBanner.d.ts +19 -2
  285. package/dist/es6/cookie-banner/lib/CookieBanner.d.ts.map +1 -1
  286. package/dist/es6/cookie-banner/lib/CookieBanner.js +19 -8
  287. package/dist/es6/dialog/lib/hooks/useDialogCard.d.ts +4 -16
  288. package/dist/es6/dialog/lib/hooks/useDialogCard.d.ts.map +1 -1
  289. package/dist/es6/dialog/lib/hooks/useDialogPopper.d.ts +5 -2
  290. package/dist/es6/dialog/lib/hooks/useDialogPopper.d.ts.map +1 -1
  291. package/dist/es6/modal/lib/ModalOverlay.d.ts +4 -2
  292. package/dist/es6/modal/lib/ModalOverlay.d.ts.map +1 -1
  293. package/dist/es6/modal/lib/hooks/useModalCard.d.ts +4 -16
  294. package/dist/es6/modal/lib/hooks/useModalCard.d.ts.map +1 -1
  295. package/dist/es6/modal/lib/hooks/useModalHeading.d.ts +5 -17
  296. package/dist/es6/modal/lib/hooks/useModalHeading.d.ts.map +1 -1
  297. package/dist/es6/page-header/index.d.ts +3 -3
  298. package/dist/es6/page-header/index.d.ts.map +1 -1
  299. package/dist/es6/page-header/index.js +3 -3
  300. package/dist/es6/page-header/lib/PageHeader.d.ts +19 -2
  301. package/dist/es6/page-header/lib/PageHeader.d.ts.map +1 -1
  302. package/dist/es6/page-header/lib/PageHeader.js +18 -7
  303. package/dist/es6/pagination/lib/Pagination/GoTo/Label.d.ts +3 -0
  304. package/dist/es6/pagination/lib/Pagination/GoTo/Label.d.ts.map +1 -1
  305. package/dist/es6/pagination/lib/Pagination/PageList.d.ts +1 -1
  306. package/dist/es6/pagination/lib/Pagination/PageList.d.ts.map +1 -1
  307. package/dist/es6/pagination/lib/Pagination/Pagination.d.ts +5 -5
  308. package/dist/es6/pagination/lib/Pagination/common/List.d.ts +1 -1
  309. package/dist/es6/pagination/lib/Pagination/common/List.d.ts.map +1 -1
  310. package/dist/es6/pagination/lib/Pagination/common/utils/getValidChildren.d.ts +1 -1
  311. package/dist/es6/pagination/lib/Pagination/common/utils/getValidChildren.d.ts.map +1 -1
  312. package/dist/es6/pagination/lib/Pagination/common/utils/space.d.ts +28 -28
  313. package/dist/es6/pagination/lib/Pagination/types.d.ts +39 -0
  314. package/dist/es6/pagination/lib/Pagination/types.d.ts.map +1 -1
  315. package/dist/es6/pagination/lib/Pagination/usePaginationModel.d.ts +19 -0
  316. package/dist/es6/pagination/lib/Pagination/usePaginationModel.d.ts.map +1 -1
  317. package/dist/es6/popup/lib/PopupCard.d.ts.map +1 -1
  318. package/dist/es6/popup/lib/PopupCard.js +3 -4
  319. package/dist/es6/popup/lib/hooks/usePopupCard.d.ts +5 -2
  320. package/dist/es6/popup/lib/hooks/usePopupCard.d.ts.map +1 -1
  321. package/dist/es6/popup/lib/hooks/usePopupCloseButton.d.ts +4 -2
  322. package/dist/es6/popup/lib/hooks/usePopupCloseButton.d.ts.map +1 -1
  323. package/dist/es6/popup/lib/hooks/usePopupHeading.d.ts +5 -2
  324. package/dist/es6/popup/lib/hooks/usePopupHeading.d.ts.map +1 -1
  325. package/dist/es6/popup/lib/hooks/usePopupPopper.d.ts +4 -2
  326. package/dist/es6/popup/lib/hooks/usePopupPopper.d.ts.map +1 -1
  327. package/dist/es6/popup/lib/hooks/usePopupTarget.d.ts +4 -2
  328. package/dist/es6/popup/lib/hooks/usePopupTarget.d.ts.map +1 -1
  329. package/dist/es6/tabs/index.d.ts +5 -0
  330. package/dist/es6/tabs/index.d.ts.map +1 -1
  331. package/dist/es6/tabs/index.js +5 -0
  332. package/dist/es6/tabs/lib/Tabs.d.ts +35 -7
  333. package/dist/es6/tabs/lib/Tabs.d.ts.map +1 -1
  334. package/dist/es6/tabs/lib/Tabs.js +28 -7
  335. package/dist/es6/tabs/lib/TabsItem.d.ts +107 -0
  336. package/dist/es6/tabs/lib/TabsItem.d.ts.map +1 -0
  337. package/dist/es6/tabs/lib/TabsItem.js +131 -0
  338. package/dist/es6/tabs/lib/TabsList.d.ts +43 -0
  339. package/dist/es6/tabs/lib/TabsList.d.ts.map +1 -0
  340. package/dist/es6/tabs/lib/TabsList.js +44 -0
  341. package/dist/es6/tabs/lib/TabsMenuPopper.d.ts +21 -0
  342. package/dist/es6/tabs/lib/TabsMenuPopper.d.ts.map +1 -0
  343. package/dist/es6/tabs/lib/{TabList.js → TabsMenuPopper.js} +8 -20
  344. package/dist/es6/tabs/lib/TabsOverflowButton.d.ts +31 -0
  345. package/dist/es6/tabs/lib/TabsOverflowButton.d.ts.map +1 -0
  346. package/dist/es6/tabs/lib/TabsOverflowButton.js +48 -0
  347. package/dist/{commonjs/tabs/lib/TabPanel.d.ts → es6/tabs/lib/TabsPanel.d.ts} +15 -5
  348. package/dist/es6/tabs/lib/TabsPanel.d.ts.map +1 -0
  349. package/dist/es6/tabs/lib/TabsPanel.js +59 -0
  350. package/{ts3.5/dist/commonjs/tabs/lib/TabList.d.ts → dist/es6/tabs/lib/TabsPanels.d.ts} +15 -15
  351. package/dist/es6/tabs/lib/TabsPanels.d.ts.map +1 -0
  352. package/dist/es6/tabs/lib/TabsPanels.js +12 -0
  353. package/dist/es6/tabs/lib/cursor/index.d.ts +1 -1
  354. package/dist/es6/tabs/lib/cursor/index.d.ts.map +1 -1
  355. package/dist/es6/tabs/lib/cursor/index.js +1 -1
  356. package/dist/es6/tabs/lib/cursor/useCursorModel.d.ts +23 -13
  357. package/dist/es6/tabs/lib/cursor/useCursorModel.d.ts.map +1 -1
  358. package/dist/es6/tabs/lib/cursor/useCursorModel.js +51 -50
  359. package/dist/es6/tabs/lib/cursor/useRovingFocus.d.ts +37 -0
  360. package/dist/es6/tabs/lib/cursor/useRovingFocus.d.ts.map +1 -0
  361. package/dist/es6/tabs/lib/cursor/useRovingFocus.js +84 -0
  362. package/dist/es6/tabs/lib/list/index.d.ts +2 -1
  363. package/dist/es6/tabs/lib/list/index.d.ts.map +1 -1
  364. package/dist/es6/tabs/lib/list/index.js +2 -1
  365. package/dist/es6/tabs/lib/list/renderItem.d.ts +4 -0
  366. package/dist/es6/tabs/lib/list/renderItem.d.ts.map +1 -0
  367. package/dist/es6/tabs/lib/list/renderItem.js +12 -0
  368. package/dist/es6/tabs/lib/list/useListModel.d.ts +25 -13
  369. package/dist/es6/tabs/lib/list/useListModel.d.ts.map +1 -1
  370. package/dist/es6/tabs/lib/list/useListModel.js +21 -8
  371. package/dist/es6/tabs/lib/list/useListRegisterItem.d.ts +14 -0
  372. package/dist/es6/tabs/lib/list/useListRegisterItem.d.ts.map +1 -0
  373. package/dist/es6/tabs/lib/list/useListRegisterItem.js +41 -0
  374. package/dist/es6/tabs/lib/menu/Menu.d.ts +80 -0
  375. package/dist/es6/tabs/lib/menu/Menu.d.ts.map +1 -0
  376. package/dist/es6/tabs/lib/menu/Menu.js +89 -0
  377. package/dist/es6/tabs/lib/menu/MenuCard.d.ts +17 -0
  378. package/dist/es6/tabs/lib/menu/MenuCard.d.ts.map +1 -0
  379. package/dist/es6/tabs/lib/menu/MenuCard.js +73 -0
  380. package/dist/es6/tabs/lib/menu/MenuItem.d.ts +62 -0
  381. package/dist/es6/tabs/lib/menu/MenuItem.d.ts.map +1 -0
  382. package/dist/es6/tabs/lib/menu/MenuItem.js +136 -0
  383. package/dist/es6/tabs/lib/menu/MenuList.d.ts +23 -0
  384. package/dist/es6/tabs/lib/menu/MenuList.d.ts.map +1 -0
  385. package/dist/es6/tabs/lib/menu/MenuList.js +43 -0
  386. package/dist/es6/tabs/lib/menu/MenuPopper.d.ts +21 -0
  387. package/dist/es6/tabs/lib/menu/MenuPopper.d.ts.map +1 -0
  388. package/dist/es6/tabs/lib/menu/MenuPopper.js +36 -0
  389. package/dist/es6/tabs/lib/menu/MenuTarget.d.ts +21 -0
  390. package/dist/es6/tabs/lib/menu/MenuTarget.d.ts.map +1 -0
  391. package/dist/es6/tabs/lib/menu/MenuTarget.js +51 -0
  392. package/dist/es6/tabs/lib/menu/index.d.ts +8 -0
  393. package/dist/es6/tabs/lib/menu/index.d.ts.map +1 -0
  394. package/dist/es6/tabs/lib/menu/index.js +7 -0
  395. package/dist/es6/tabs/lib/menu/useMenuModel.d.ts +35 -0
  396. package/dist/es6/tabs/lib/menu/useMenuModel.d.ts.map +1 -0
  397. package/dist/es6/tabs/lib/menu/useMenuModel.js +31 -0
  398. package/dist/es6/tabs/lib/overflow/index.d.ts +5 -0
  399. package/dist/es6/tabs/lib/overflow/index.d.ts.map +1 -0
  400. package/dist/es6/tabs/lib/overflow/index.js +4 -0
  401. package/dist/es6/tabs/lib/overflow/useOverflowMeasureContainer.d.ts +8 -0
  402. package/dist/es6/tabs/lib/overflow/useOverflowMeasureContainer.d.ts.map +1 -0
  403. package/dist/es6/tabs/lib/overflow/useOverflowMeasureContainer.js +13 -0
  404. package/dist/es6/tabs/lib/overflow/useOverflowMeasureItem.d.ts +10 -0
  405. package/dist/es6/tabs/lib/overflow/useOverflowMeasureItem.d.ts.map +1 -0
  406. package/dist/es6/tabs/lib/overflow/useOverflowMeasureItem.js +30 -0
  407. package/dist/es6/tabs/lib/overflow/useOverflowModel.d.ts +69 -0
  408. package/dist/es6/tabs/lib/overflow/useOverflowModel.d.ts.map +1 -0
  409. package/dist/es6/tabs/lib/overflow/useOverflowModel.js +111 -0
  410. package/dist/es6/tabs/lib/overflow/useOverflowTarget.d.ts +11 -0
  411. package/dist/es6/tabs/lib/overflow/useOverflowTarget.d.ts.map +1 -0
  412. package/dist/es6/tabs/lib/overflow/useOverflowTarget.js +30 -0
  413. package/dist/es6/tabs/lib/selection/index.d.ts +4 -0
  414. package/dist/es6/tabs/lib/selection/index.d.ts.map +1 -0
  415. package/dist/es6/tabs/lib/selection/index.js +3 -0
  416. package/dist/es6/tabs/lib/selection/useResetCursorOnBlur.d.ts +13 -0
  417. package/dist/es6/tabs/lib/selection/useResetCursorOnBlur.d.ts.map +1 -0
  418. package/dist/es6/tabs/lib/{hooks.js → selection/useResetCursorOnBlur.js} +8 -9
  419. package/dist/es6/tabs/lib/selection/useSelectionItem.d.ts +8 -0
  420. package/dist/es6/tabs/lib/selection/useSelectionItem.d.ts.map +1 -0
  421. package/dist/es6/tabs/lib/selection/useSelectionItem.js +14 -0
  422. package/dist/es6/tabs/lib/selection/useSelectionModel.d.ts +62 -0
  423. package/dist/es6/tabs/lib/selection/useSelectionModel.d.ts.map +1 -0
  424. package/dist/es6/tabs/lib/selection/useSelectionModel.js +75 -0
  425. package/dist/es6/tabs/lib/useTabsModel.d.ts +39 -38
  426. package/dist/es6/tabs/lib/useTabsModel.d.ts.map +1 -1
  427. package/dist/es6/tabs/lib/useTabsModel.js +50 -37
  428. package/dist/es6/tokens/index.d.ts +3 -20
  429. package/dist/es6/tokens/index.d.ts.map +1 -1
  430. package/dist/es6/tokens/index.js +1 -1
  431. package/dist/es6/tokens/lib/depth.d.ts +109 -3
  432. package/dist/es6/tokens/lib/depth.d.ts.map +1 -1
  433. package/dist/es6/tokens/lib/depth.js +40 -2
  434. package/dist/es6/tooltip/lib/OverflowTooltip.d.ts +10 -0
  435. package/dist/es6/tooltip/lib/OverflowTooltip.d.ts.map +1 -1
  436. package/dist/es6/tooltip/lib/OverflowTooltip.js +16 -9
  437. package/dist/es6/tooltip/lib/useTooltip.d.ts +4 -4
  438. package/dist/es6/tooltip/lib/useTooltip.d.ts.map +1 -1
  439. package/package.json +7 -6
  440. package/page-header/README.md +11 -6
  441. package/page-header/index.ts +3 -3
  442. package/page-header/lib/PageHeader.tsx +28 -3
  443. package/pagination/lib/Pagination/GoTo/Label.tsx +3 -0
  444. package/pagination/lib/Pagination/types.ts +44 -5
  445. package/pagination/lib/Pagination/usePaginationModel.ts +19 -0
  446. package/popup/lib/PopupCard.tsx +3 -2
  447. package/tabs/README.md +5 -133
  448. package/tabs/index.ts +6 -0
  449. package/tabs/lib/Tabs.tsx +34 -9
  450. package/tabs/lib/TabsItem.tsx +250 -0
  451. package/tabs/lib/TabsList.tsx +67 -0
  452. package/tabs/lib/TabsMenuPopper.tsx +27 -0
  453. package/tabs/lib/TabsOverflowButton.tsx +58 -0
  454. package/tabs/lib/{TabPanel.tsx → TabsPanel.tsx} +33 -31
  455. package/tabs/lib/TabsPanels.tsx +28 -0
  456. package/tabs/lib/cursor/index.ts +1 -1
  457. package/tabs/lib/cursor/useCursorModel.tsx +78 -65
  458. package/tabs/lib/cursor/useRovingFocus.tsx +94 -0
  459. package/tabs/lib/list/index.ts +2 -1
  460. package/tabs/lib/list/renderItem.tsx +19 -0
  461. package/tabs/lib/list/useListModel.tsx +48 -23
  462. package/tabs/lib/list/useListRegisterItem.tsx +53 -0
  463. package/tabs/lib/menu/Menu.tsx +95 -0
  464. package/tabs/lib/menu/MenuCard.tsx +96 -0
  465. package/tabs/lib/menu/MenuItem.tsx +195 -0
  466. package/tabs/lib/menu/MenuList.tsx +59 -0
  467. package/tabs/lib/menu/MenuPopper.tsx +31 -0
  468. package/tabs/lib/menu/MenuTarget.tsx +52 -0
  469. package/tabs/lib/menu/index.ts +8 -0
  470. package/tabs/lib/menu/useMenuModel.tsx +67 -0
  471. package/tabs/lib/overflow/index.ts +4 -0
  472. package/tabs/lib/overflow/spec/tsconfig.json +3 -0
  473. package/tabs/lib/overflow/spec/useOverflowModel.spec.tsx +46 -0
  474. package/tabs/lib/overflow/useOverflowMeasureContainer.ts +20 -0
  475. package/tabs/lib/overflow/useOverflowMeasureItem.tsx +40 -0
  476. package/tabs/lib/overflow/useOverflowModel.tsx +185 -0
  477. package/tabs/lib/overflow/useOverflowTarget.tsx +42 -0
  478. package/tabs/lib/selection/index.ts +3 -0
  479. package/tabs/lib/selection/useResetCursorOnBlur.tsx +29 -0
  480. package/tabs/lib/selection/useSelectionItem.tsx +26 -0
  481. package/tabs/lib/selection/useSelectionModel.tsx +133 -0
  482. package/tabs/lib/useTabsModel.tsx +93 -78
  483. package/tokens/README.md +5 -12
  484. package/tokens/index.ts +2 -2
  485. package/tokens/lib/depth.ts +125 -3
  486. package/tooltip/lib/OverflowTooltip.tsx +23 -16
  487. package/tooltip/lib/useTooltip.tsx +5 -5
  488. package/ts3.5/dist/commonjs/button/lib/PrimaryButton.d.ts +80 -6
  489. package/ts3.5/dist/commonjs/button/lib/SecondaryButton.d.ts +8 -5
  490. package/ts3.5/dist/commonjs/button/lib/TertiaryButton.d.ts +8 -4
  491. package/ts3.5/dist/commonjs/button/lib/parts/ButtonContainer.d.ts +5 -3
  492. package/ts3.5/dist/commonjs/button/lib/parts/ButtonLabel.d.ts +1 -1
  493. package/ts3.5/dist/commonjs/button/lib/parts/ButtonLabelIcon.d.ts +7 -4
  494. package/ts3.5/dist/commonjs/button/lib/types.d.ts +9 -0
  495. package/ts3.5/dist/commonjs/common/index.d.ts +1 -0
  496. package/ts3.5/dist/commonjs/common/lib/EllipsisText.d.ts +5 -0
  497. package/ts3.5/dist/commonjs/common/lib/styles/accessibleHide.d.ts +2 -2
  498. package/ts3.5/dist/commonjs/common/lib/theming/breakpoints.d.ts +287 -6
  499. package/ts3.5/dist/commonjs/common/lib/theming/types.d.ts +191 -1
  500. package/ts3.5/dist/commonjs/common/lib/utils/components.d.ts +19 -9
  501. package/ts3.5/dist/commonjs/common/lib/utils/index.d.ts +1 -0
  502. package/ts3.5/dist/commonjs/common/lib/utils/useConstant.d.ts +9 -0
  503. package/ts3.5/dist/commonjs/common/lib/utils/useResizeObserver.d.ts +3 -0
  504. package/ts3.5/dist/commonjs/cookie-banner/index.d.ts +3 -3
  505. package/ts3.5/dist/commonjs/cookie-banner/lib/CookieBanner.d.ts +19 -2
  506. package/ts3.5/dist/commonjs/dialog/lib/hooks/useDialogCard.d.ts +4 -16
  507. package/ts3.5/dist/commonjs/dialog/lib/hooks/useDialogPopper.d.ts +5 -2
  508. package/ts3.5/dist/commonjs/modal/lib/ModalOverlay.d.ts +4 -2
  509. package/ts3.5/dist/commonjs/modal/lib/hooks/useModalCard.d.ts +4 -16
  510. package/ts3.5/dist/commonjs/modal/lib/hooks/useModalHeading.d.ts +5 -17
  511. package/ts3.5/dist/commonjs/page-header/index.d.ts +3 -3
  512. package/ts3.5/dist/commonjs/page-header/lib/PageHeader.d.ts +19 -2
  513. package/ts3.5/dist/commonjs/pagination/lib/Pagination/GoTo/Label.d.ts +3 -0
  514. package/ts3.5/dist/commonjs/pagination/lib/Pagination/PageList.d.ts +1 -1
  515. package/ts3.5/dist/commonjs/pagination/lib/Pagination/Pagination.d.ts +5 -5
  516. package/ts3.5/dist/commonjs/pagination/lib/Pagination/common/List.d.ts +1 -1
  517. package/ts3.5/dist/commonjs/pagination/lib/Pagination/common/utils/getValidChildren.d.ts +1 -1
  518. package/ts3.5/dist/commonjs/pagination/lib/Pagination/common/utils/space.d.ts +28 -28
  519. package/ts3.5/dist/commonjs/pagination/lib/Pagination/types.d.ts +39 -0
  520. package/ts3.5/dist/commonjs/pagination/lib/Pagination/usePaginationModel.d.ts +19 -0
  521. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupCard.d.ts +5 -2
  522. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupCloseButton.d.ts +4 -2
  523. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupHeading.d.ts +5 -2
  524. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupPopper.d.ts +4 -2
  525. package/ts3.5/dist/commonjs/popup/lib/hooks/usePopupTarget.d.ts +4 -2
  526. package/ts3.5/dist/commonjs/tabs/index.d.ts +5 -0
  527. package/ts3.5/dist/commonjs/tabs/lib/Tabs.d.ts +35 -7
  528. package/ts3.5/dist/commonjs/tabs/lib/TabsItem.d.ts +107 -0
  529. package/ts3.5/dist/commonjs/tabs/lib/TabsList.d.ts +43 -0
  530. package/ts3.5/dist/commonjs/tabs/lib/TabsMenuPopper.d.ts +21 -0
  531. package/ts3.5/dist/commonjs/tabs/lib/TabsOverflowButton.d.ts +31 -0
  532. package/{dist/es6/tabs/lib/TabPanel.d.ts → ts3.5/dist/commonjs/tabs/lib/TabsPanel.d.ts} +39 -29
  533. package/ts3.5/dist/{es6/tabs/lib/TabList.d.ts → commonjs/tabs/lib/TabsPanels.d.ts} +5 -5
  534. package/ts3.5/dist/commonjs/tabs/lib/cursor/index.d.ts +1 -1
  535. package/ts3.5/dist/commonjs/tabs/lib/cursor/useCursorModel.d.ts +23 -13
  536. package/ts3.5/dist/commonjs/tabs/lib/cursor/useRovingFocus.d.ts +37 -0
  537. package/ts3.5/dist/commonjs/tabs/lib/list/index.d.ts +2 -1
  538. package/ts3.5/dist/commonjs/tabs/lib/list/renderItem.d.ts +4 -0
  539. package/ts3.5/dist/commonjs/tabs/lib/list/useListModel.d.ts +25 -13
  540. package/ts3.5/dist/commonjs/tabs/lib/list/useListRegisterItem.d.ts +14 -0
  541. package/ts3.5/dist/commonjs/tabs/lib/menu/Menu.d.ts +80 -0
  542. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuCard.d.ts +17 -0
  543. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuItem.d.ts +62 -0
  544. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuList.d.ts +23 -0
  545. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuPopper.d.ts +21 -0
  546. package/ts3.5/dist/commonjs/tabs/lib/menu/MenuTarget.d.ts +21 -0
  547. package/ts3.5/dist/commonjs/tabs/lib/menu/index.d.ts +8 -0
  548. package/ts3.5/dist/commonjs/tabs/lib/menu/useMenuModel.d.ts +35 -0
  549. package/ts3.5/dist/commonjs/tabs/lib/overflow/index.d.ts +5 -0
  550. package/ts3.5/dist/commonjs/tabs/lib/overflow/useOverflowMeasureContainer.d.ts +8 -0
  551. package/ts3.5/dist/commonjs/tabs/lib/overflow/useOverflowMeasureItem.d.ts +10 -0
  552. package/ts3.5/dist/commonjs/tabs/lib/overflow/useOverflowModel.d.ts +69 -0
  553. package/ts3.5/dist/commonjs/tabs/lib/overflow/useOverflowTarget.d.ts +11 -0
  554. package/ts3.5/dist/commonjs/tabs/lib/selection/index.d.ts +4 -0
  555. package/ts3.5/dist/commonjs/tabs/lib/selection/useResetCursorOnBlur.d.ts +13 -0
  556. package/ts3.5/dist/commonjs/tabs/lib/selection/useSelectionItem.d.ts +8 -0
  557. package/ts3.5/dist/commonjs/tabs/lib/selection/useSelectionModel.d.ts +62 -0
  558. package/ts3.5/dist/commonjs/tabs/lib/useTabsModel.d.ts +39 -38
  559. package/ts3.5/dist/commonjs/tokens/index.d.ts +3 -20
  560. package/ts3.5/dist/commonjs/tokens/lib/depth.d.ts +109 -3
  561. package/ts3.5/dist/commonjs/tooltip/lib/OverflowTooltip.d.ts +10 -0
  562. package/ts3.5/dist/commonjs/tooltip/lib/useTooltip.d.ts +4 -4
  563. package/ts3.5/dist/es6/button/lib/PrimaryButton.d.ts +80 -6
  564. package/ts3.5/dist/es6/button/lib/SecondaryButton.d.ts +8 -5
  565. package/ts3.5/dist/es6/button/lib/TertiaryButton.d.ts +8 -4
  566. package/ts3.5/dist/es6/button/lib/parts/ButtonContainer.d.ts +5 -3
  567. package/ts3.5/dist/es6/button/lib/parts/ButtonLabel.d.ts +1 -1
  568. package/ts3.5/dist/es6/button/lib/parts/ButtonLabelIcon.d.ts +7 -4
  569. package/ts3.5/dist/es6/button/lib/types.d.ts +9 -0
  570. package/ts3.5/dist/es6/common/index.d.ts +1 -0
  571. package/ts3.5/dist/es6/common/lib/EllipsisText.d.ts +5 -0
  572. package/ts3.5/dist/es6/common/lib/styles/accessibleHide.d.ts +2 -2
  573. package/ts3.5/dist/es6/common/lib/theming/breakpoints.d.ts +287 -6
  574. package/ts3.5/dist/es6/common/lib/theming/types.d.ts +191 -1
  575. package/ts3.5/dist/es6/common/lib/utils/components.d.ts +19 -9
  576. package/ts3.5/dist/es6/common/lib/utils/index.d.ts +1 -0
  577. package/ts3.5/dist/es6/common/lib/utils/useConstant.d.ts +9 -0
  578. package/ts3.5/dist/es6/common/lib/utils/useResizeObserver.d.ts +3 -0
  579. package/ts3.5/dist/es6/cookie-banner/index.d.ts +3 -3
  580. package/ts3.5/dist/es6/cookie-banner/lib/CookieBanner.d.ts +19 -2
  581. package/ts3.5/dist/es6/dialog/lib/hooks/useDialogCard.d.ts +4 -16
  582. package/ts3.5/dist/es6/dialog/lib/hooks/useDialogPopper.d.ts +5 -2
  583. package/ts3.5/dist/es6/modal/lib/ModalOverlay.d.ts +4 -2
  584. package/ts3.5/dist/es6/modal/lib/hooks/useModalCard.d.ts +4 -16
  585. package/ts3.5/dist/es6/modal/lib/hooks/useModalHeading.d.ts +5 -17
  586. package/ts3.5/dist/es6/page-header/index.d.ts +3 -3
  587. package/ts3.5/dist/es6/page-header/lib/PageHeader.d.ts +19 -2
  588. package/ts3.5/dist/es6/pagination/lib/Pagination/GoTo/Label.d.ts +3 -0
  589. package/ts3.5/dist/es6/pagination/lib/Pagination/PageList.d.ts +1 -1
  590. package/ts3.5/dist/es6/pagination/lib/Pagination/Pagination.d.ts +5 -5
  591. package/ts3.5/dist/es6/pagination/lib/Pagination/common/List.d.ts +1 -1
  592. package/ts3.5/dist/es6/pagination/lib/Pagination/common/utils/getValidChildren.d.ts +1 -1
  593. package/ts3.5/dist/es6/pagination/lib/Pagination/common/utils/space.d.ts +28 -28
  594. package/ts3.5/dist/es6/pagination/lib/Pagination/types.d.ts +39 -0
  595. package/ts3.5/dist/es6/pagination/lib/Pagination/usePaginationModel.d.ts +19 -0
  596. package/ts3.5/dist/es6/popup/lib/hooks/usePopupCard.d.ts +5 -2
  597. package/ts3.5/dist/es6/popup/lib/hooks/usePopupCloseButton.d.ts +4 -2
  598. package/ts3.5/dist/es6/popup/lib/hooks/usePopupHeading.d.ts +5 -2
  599. package/ts3.5/dist/es6/popup/lib/hooks/usePopupPopper.d.ts +4 -2
  600. package/ts3.5/dist/es6/popup/lib/hooks/usePopupTarget.d.ts +4 -2
  601. package/ts3.5/dist/es6/tabs/index.d.ts +5 -0
  602. package/ts3.5/dist/es6/tabs/lib/Tabs.d.ts +35 -7
  603. package/ts3.5/dist/es6/tabs/lib/TabsItem.d.ts +107 -0
  604. package/ts3.5/dist/es6/tabs/lib/TabsList.d.ts +43 -0
  605. package/ts3.5/dist/es6/tabs/lib/TabsMenuPopper.d.ts +21 -0
  606. package/ts3.5/dist/es6/tabs/lib/TabsOverflowButton.d.ts +31 -0
  607. package/ts3.5/dist/es6/tabs/lib/{TabPanel.d.ts → TabsPanel.d.ts} +15 -5
  608. package/{dist/commonjs/tabs/lib/TabList.d.ts → ts3.5/dist/es6/tabs/lib/TabsPanels.d.ts} +15 -15
  609. package/ts3.5/dist/es6/tabs/lib/cursor/index.d.ts +1 -1
  610. package/ts3.5/dist/es6/tabs/lib/cursor/useCursorModel.d.ts +23 -13
  611. package/ts3.5/dist/es6/tabs/lib/cursor/useRovingFocus.d.ts +37 -0
  612. package/ts3.5/dist/es6/tabs/lib/list/index.d.ts +2 -1
  613. package/ts3.5/dist/es6/tabs/lib/list/renderItem.d.ts +4 -0
  614. package/ts3.5/dist/es6/tabs/lib/list/useListModel.d.ts +25 -13
  615. package/ts3.5/dist/es6/tabs/lib/list/useListRegisterItem.d.ts +14 -0
  616. package/ts3.5/dist/es6/tabs/lib/menu/Menu.d.ts +80 -0
  617. package/ts3.5/dist/es6/tabs/lib/menu/MenuCard.d.ts +17 -0
  618. package/ts3.5/dist/es6/tabs/lib/menu/MenuItem.d.ts +62 -0
  619. package/ts3.5/dist/es6/tabs/lib/menu/MenuList.d.ts +23 -0
  620. package/ts3.5/dist/es6/tabs/lib/menu/MenuPopper.d.ts +21 -0
  621. package/ts3.5/dist/es6/tabs/lib/menu/MenuTarget.d.ts +21 -0
  622. package/ts3.5/dist/es6/tabs/lib/menu/index.d.ts +8 -0
  623. package/ts3.5/dist/es6/tabs/lib/menu/useMenuModel.d.ts +35 -0
  624. package/ts3.5/dist/es6/tabs/lib/overflow/index.d.ts +5 -0
  625. package/ts3.5/dist/es6/tabs/lib/overflow/useOverflowMeasureContainer.d.ts +8 -0
  626. package/ts3.5/dist/es6/tabs/lib/overflow/useOverflowMeasureItem.d.ts +10 -0
  627. package/ts3.5/dist/es6/tabs/lib/overflow/useOverflowModel.d.ts +69 -0
  628. package/ts3.5/dist/es6/tabs/lib/overflow/useOverflowTarget.d.ts +11 -0
  629. package/ts3.5/dist/es6/tabs/lib/selection/index.d.ts +4 -0
  630. package/ts3.5/dist/es6/tabs/lib/selection/useResetCursorOnBlur.d.ts +13 -0
  631. package/ts3.5/dist/es6/tabs/lib/selection/useSelectionItem.d.ts +8 -0
  632. package/ts3.5/dist/es6/tabs/lib/selection/useSelectionModel.d.ts +62 -0
  633. package/ts3.5/dist/es6/tabs/lib/useTabsModel.d.ts +39 -38
  634. package/ts3.5/dist/es6/tokens/index.d.ts +3 -20
  635. package/ts3.5/dist/es6/tokens/lib/depth.d.ts +109 -3
  636. package/ts3.5/dist/es6/tooltip/lib/OverflowTooltip.d.ts +10 -0
  637. package/ts3.5/dist/es6/tooltip/lib/useTooltip.d.ts +4 -4
  638. package/dist/commonjs/tabs/lib/Tab.d.ts +0 -49
  639. package/dist/commonjs/tabs/lib/Tab.d.ts.map +0 -1
  640. package/dist/commonjs/tabs/lib/Tab.js +0 -101
  641. package/dist/commonjs/tabs/lib/TabList.d.ts.map +0 -1
  642. package/dist/commonjs/tabs/lib/TabPanel.d.ts.map +0 -1
  643. package/dist/commonjs/tabs/lib/TabPanel.js +0 -56
  644. package/dist/commonjs/tabs/lib/cursor/hooks.d.ts +0 -39
  645. package/dist/commonjs/tabs/lib/cursor/hooks.d.ts.map +0 -1
  646. package/dist/commonjs/tabs/lib/hooks.d.ts +0 -10
  647. package/dist/commonjs/tabs/lib/hooks.d.ts.map +0 -1
  648. package/dist/commonjs/tabs/lib/list/hooks.d.ts +0 -11
  649. package/dist/commonjs/tabs/lib/list/hooks.d.ts.map +0 -1
  650. package/dist/commonjs/tabs/lib/list/hooks.js +0 -39
  651. package/dist/es6/tabs/lib/Tab.d.ts +0 -49
  652. package/dist/es6/tabs/lib/Tab.d.ts.map +0 -1
  653. package/dist/es6/tabs/lib/Tab.js +0 -92
  654. package/dist/es6/tabs/lib/TabList.d.ts.map +0 -1
  655. package/dist/es6/tabs/lib/TabPanel.d.ts.map +0 -1
  656. package/dist/es6/tabs/lib/TabPanel.js +0 -51
  657. package/dist/es6/tabs/lib/cursor/hooks.d.ts +0 -39
  658. package/dist/es6/tabs/lib/cursor/hooks.d.ts.map +0 -1
  659. package/dist/es6/tabs/lib/cursor/hooks.js +0 -108
  660. package/dist/es6/tabs/lib/hooks.d.ts +0 -10
  661. package/dist/es6/tabs/lib/hooks.d.ts.map +0 -1
  662. package/dist/es6/tabs/lib/list/hooks.d.ts +0 -11
  663. package/dist/es6/tabs/lib/list/hooks.d.ts.map +0 -1
  664. package/dist/es6/tabs/lib/list/hooks.js +0 -34
  665. package/tabs/lib/Tab.tsx +0 -176
  666. package/tabs/lib/TabList.tsx +0 -59
  667. package/tabs/lib/cursor/hooks.tsx +0 -122
  668. package/tabs/lib/hooks.tsx +0 -31
  669. package/tabs/lib/list/hooks.tsx +0 -45
  670. package/ts3.5/dist/commonjs/tabs/lib/Tab.d.ts +0 -49
  671. package/ts3.5/dist/commonjs/tabs/lib/cursor/hooks.d.ts +0 -39
  672. package/ts3.5/dist/commonjs/tabs/lib/hooks.d.ts +0 -10
  673. package/ts3.5/dist/commonjs/tabs/lib/list/hooks.d.ts +0 -11
  674. package/ts3.5/dist/es6/tabs/lib/Tab.d.ts +0 -49
  675. package/ts3.5/dist/es6/tabs/lib/cursor/hooks.d.ts +0 -39
  676. package/ts3.5/dist/es6/tabs/lib/hooks.d.ts +0 -10
  677. package/ts3.5/dist/es6/tabs/lib/list/hooks.d.ts +0 -11
@@ -1,13 +1,20 @@
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 { ButtonSizes, IconPositions } from './types';
5
5
  export interface PrimaryButtonProps extends Themeable, GrowthBehavior {
6
6
  /**
7
- * The size of the Button.
7
+ * The variant of the PrimaryButton.
8
+ * @default undefined
9
+ */
10
+ variant?: 'inverse';
11
+ /**
12
+ * There are four button sizes: `extraSmall`, `small`, `medium`, and `large`.
13
+ * If no size is provided, it will default to `medium`.
14
+ *
8
15
  * @default 'medium'
9
16
  */
10
- size?: 'small' | 'medium' | 'large';
17
+ size?: ButtonSizes;
11
18
  /**
12
19
  * The data label of the Button.
13
20
  * Note: not displayed at `small` size
@@ -19,10 +26,11 @@ export interface PrimaryButtonProps extends Themeable, GrowthBehavior {
19
26
  */
20
27
  icon?: CanvasSystemIcon;
21
28
  /**
22
- * 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`.
23
31
  * @default 'left'
24
32
  */
25
- iconPosition?: 'left' | 'right';
33
+ iconPosition?: IconPositions;
26
34
  /**
27
35
  * If set to `true`, transform the icon's x-axis to mirror the graphic
28
36
  * @default false
@@ -31,5 +39,71 @@ export interface PrimaryButtonProps extends Themeable, GrowthBehavior {
31
39
  children?: React.ReactNode;
32
40
  }
33
41
  export declare const PrimaryButton: import("../../common").ElementComponent<"button", PrimaryButtonProps>;
34
- export declare const getPrimaryButtonColors: ({ canvas: { palette: { primary: themePrimary }, }, }: EmotionCanvasTheme) => ButtonColors;
42
+ export declare const getPrimaryButtonColors: (variant: "inverse" | undefined, theme: EmotionCanvasTheme) => {
43
+ default: {
44
+ background: string;
45
+ icon: string;
46
+ label: string;
47
+ labelData?: undefined;
48
+ };
49
+ hover: {
50
+ background: string;
51
+ icon?: undefined;
52
+ label?: undefined;
53
+ labelData?: undefined;
54
+ };
55
+ active: {
56
+ background: string;
57
+ icon?: undefined;
58
+ label?: undefined;
59
+ labelData?: undefined;
60
+ };
61
+ focus: {
62
+ background: string;
63
+ border?: undefined;
64
+ icon?: undefined;
65
+ label?: undefined;
66
+ labelData?: undefined;
67
+ focusRing?: undefined;
68
+ };
69
+ disabled: {
70
+ background: string;
71
+ icon?: undefined;
72
+ label?: undefined;
73
+ labelData?: undefined;
74
+ };
75
+ } | {
76
+ default: {
77
+ background: string;
78
+ icon: string;
79
+ label: string;
80
+ labelData: string;
81
+ };
82
+ hover: {
83
+ background: string;
84
+ icon: string;
85
+ label: string;
86
+ labelData: string;
87
+ };
88
+ active: {
89
+ background: string;
90
+ icon: string;
91
+ label: string;
92
+ labelData: string;
93
+ };
94
+ focus: {
95
+ background: string;
96
+ border: string;
97
+ icon: string;
98
+ label: string;
99
+ labelData: string;
100
+ focusRing: import("@emotion/serialize").CSSObject;
101
+ };
102
+ disabled: {
103
+ background: string;
104
+ icon: string;
105
+ label: string;
106
+ labelData: string;
107
+ };
108
+ };
35
109
  //# sourceMappingURL=PrimaryButton.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"PrimaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/PrimaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,cAAc,EAEd,SAAS,EACT,kBAAkB,EAEnB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAC,YAAY,EAAC,MAAM,SAAS,CAAC;AAGrC,MAAM,WAAW,kBAAmB,SAAQ,SAAS,EAAE,cAAc;IACnE;;;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,aAAa,uEA6CxB,CAAC;AAEH,eAAO,MAAM,sBAAsB,4FAsBjC,CAAC"}
1
+ {"version":3,"file":"PrimaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/PrimaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,cAAc,EAEd,SAAS,EACT,kBAAkB,EAGnB,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAG9D,OAAO,EAAC,WAAW,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AAEnD,MAAM,WAAW,kBAAmB,SAAQ,SAAS,EAAE,cAAc;IACnE;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;;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,aAAa,uEA+CxB,CAAC;AAEH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6ElC,CAAC"}
@@ -21,8 +21,18 @@ var __rest = (this && this.__rest) || function (s, e) {
21
21
  return t;
22
22
  };
23
23
  import * as React from 'react';
24
- import { useTheme, createComponent, } from '@workday/canvas-kit-react/common';
24
+ import { useTheme, createComponent, focusRing, } from '@workday/canvas-kit-react/common';
25
+ import { colors } from '@workday/canvas-kit-react/tokens';
25
26
  import { ButtonContainer, ButtonLabel, ButtonLabelData, ButtonLabelIcon } from './parts';
27
+ // Button sizes where data labels are enabled
28
+ var dataLabelSizes = ['medium', 'large'];
29
+ // All disabled buttons are set to 40% opacity.
30
+ // This will eventually live in the ButtonContainer styles, but for now we're scoping it to Primary, Secondary, and Tertiary buttons.
31
+ var disabledButtonOpacity = {
32
+ '&:disabled, &:disabled:active': {
33
+ opacity: 0.4,
34
+ },
35
+ };
26
36
  export var PrimaryButton = createComponent('button')({
27
37
  displayName: 'PrimaryButton',
28
38
  Component: function (_a, ref, Element) {
@@ -32,33 +42,77 @@ export var PrimaryButton = createComponent('button')({
32
42
  _b = _a.theme,
33
43
  // TODO: Fix useTheme and make it a real hook
34
44
  // eslint-disable-next-line react-hooks/rules-of-hooks
35
- theme = _b === void 0 ? useTheme() : _b, _c = _a.size, size = _c === void 0 ? 'medium' : _c, _d = _a.iconPosition, iconPosition = _d === void 0 ? 'left' : _d, dataLabel = _a.dataLabel, icon = _a.icon, _e = _a.shouldMirrorIcon, shouldMirrorIcon = _e === void 0 ? false : _e, children = _a.children, elemProps = __rest(_a, ["theme", "size", "iconPosition", "dataLabel", "icon", "shouldMirrorIcon", "children"]);
36
- return (React.createElement(ButtonContainer, __assign({ ref: ref, as: Element, colors: getPrimaryButtonColors(theme), size: size }, elemProps),
37
- icon && size !== 'small' && iconPosition === 'left' && (React.createElement(ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
45
+ theme = _b === void 0 ? 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(ButtonContainer, __assign({ ref: ref, as: Element, colors: getPrimaryButtonColors(variant, theme), size: size, extraStyles: disabledButtonOpacity }, elemProps),
47
+ icon && iconPosition === 'left' && (React.createElement(ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
38
48
  React.createElement(ButtonLabel, null, children),
39
- dataLabel && size !== 'small' && React.createElement(ButtonLabelData, null, dataLabel),
40
- icon && size !== 'small' && iconPosition === 'right' && (React.createElement(ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon }))));
49
+ dataLabel && dataLabelSizes.includes(size) && React.createElement(ButtonLabelData, null, dataLabel),
50
+ icon && iconPosition === 'right' && (React.createElement(ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon }))));
41
51
  },
42
52
  });
43
- export var getPrimaryButtonColors = function (_a) {
44
- var themePrimary = _a.canvas.palette.primary;
45
- return ({
46
- default: {
47
- background: themePrimary.main,
48
- icon: themePrimary.contrast,
49
- label: themePrimary.contrast,
50
- },
51
- hover: {
52
- background: themePrimary.dark,
53
- },
54
- active: {
55
- background: themePrimary.darkest,
56
- },
57
- focus: {
58
- background: themePrimary.main,
59
- },
60
- disabled: {
61
- background: themePrimary.light,
62
- },
63
- });
53
+ export var getPrimaryButtonColors = function (variant, theme) {
54
+ var themePrimary = theme.canvas.palette.primary;
55
+ switch (variant) {
56
+ case undefined:
57
+ default:
58
+ return {
59
+ default: {
60
+ background: themePrimary.main,
61
+ icon: themePrimary.contrast,
62
+ label: themePrimary.contrast,
63
+ },
64
+ hover: {
65
+ background: themePrimary.dark,
66
+ },
67
+ active: {
68
+ background: themePrimary.darkest,
69
+ },
70
+ focus: {
71
+ background: themePrimary.main,
72
+ },
73
+ disabled: {
74
+ background: themePrimary.main,
75
+ },
76
+ };
77
+ case 'inverse':
78
+ return {
79
+ default: {
80
+ background: colors.frenchVanilla100,
81
+ icon: colors.blackPepper400,
82
+ label: colors.blackPepper400,
83
+ labelData: colors.blackPepper400,
84
+ },
85
+ hover: {
86
+ background: colors.soap300,
87
+ icon: colors.blackPepper500,
88
+ label: colors.blackPepper500,
89
+ labelData: colors.blackPepper500,
90
+ },
91
+ active: {
92
+ background: colors.soap300,
93
+ icon: colors.blackPepper500,
94
+ label: colors.blackPepper500,
95
+ labelData: colors.blackPepper500,
96
+ },
97
+ focus: {
98
+ background: colors.frenchVanilla100,
99
+ border: colors.blackPepper400,
100
+ icon: colors.blackPepper400,
101
+ label: colors.blackPepper400,
102
+ labelData: colors.blackPepper400,
103
+ focusRing: focusRing({
104
+ separation: 1,
105
+ innerColor: colors.blackPepper500,
106
+ outerColor: colors.frenchVanilla100,
107
+ }, theme),
108
+ },
109
+ // Identical to inverse 'default' styles. ButtonContainer will set opacity to 40%
110
+ disabled: {
111
+ background: colors.frenchVanilla100,
112
+ icon: colors.blackPepper400,
113
+ label: colors.blackPepper400,
114
+ labelData: colors.blackPepper400,
115
+ },
116
+ };
117
+ }
64
118
  };
@@ -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"}
@@ -24,6 +24,15 @@ import * as React from 'react';
24
24
  import { colors } from '@workday/canvas-kit-react/tokens';
25
25
  import { useTheme, createComponent, focusRing, } from '@workday/canvas-kit-react/common';
26
26
  import { ButtonContainer, ButtonLabel, ButtonLabelData, ButtonLabelIcon } from './parts';
27
+ // Button sizes where data labels are enabled
28
+ var dataLabelSizes = ['medium', 'large'];
29
+ // All disabled buttons are set to 40% opacity.
30
+ // This will eventually live in the ButtonContainer styles, but for now we're scoping it to Primary, Secondary, and Tertiary buttons.
31
+ var disabledButtonOpacity = {
32
+ '&:disabled, &:disabled:active': {
33
+ opacity: 0.4,
34
+ },
35
+ };
27
36
  export var SecondaryButton = createComponent('button')({
28
37
  displayName: 'SecondaryButton',
29
38
  Component: function (_a, ref, Element) {
@@ -34,11 +43,11 @@ export var SecondaryButton = createComponent('button')({
34
43
  // TODO: Fix useTheme and make it a real hook
35
44
  // eslint-disable-next-line react-hooks/rules-of-hooks
36
45
  theme = _b === void 0 ? 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"]);
37
- return (React.createElement(ButtonContainer, __assign({ ref: ref, as: Element, colors: getSecondaryButtonColors(variant, theme), size: size }, elemProps),
38
- icon && size !== 'small' && iconPosition === 'left' && (React.createElement(ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
46
+ return (React.createElement(ButtonContainer, __assign({ ref: ref, as: Element, colors: getSecondaryButtonColors(variant, theme), size: size, extraStyles: disabledButtonOpacity }, elemProps),
47
+ icon && iconPosition === 'left' && (React.createElement(ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
39
48
  React.createElement(ButtonLabel, null, children),
40
- dataLabel && size !== 'small' && React.createElement(ButtonLabelData, null, dataLabel),
41
- icon && size !== 'small' && iconPosition === 'right' && (React.createElement(ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon }))));
49
+ dataLabel && dataLabelSizes.includes(size) && React.createElement(ButtonLabelData, null, dataLabel),
50
+ icon && iconPosition === 'right' && (React.createElement(ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon }))));
42
51
  },
43
52
  });
44
53
  export var getSecondaryButtonColors = function (variant, theme) {
@@ -74,12 +83,13 @@ export var getSecondaryButtonColors = function (variant, theme) {
74
83
  label: colors.blackPepper400,
75
84
  labelData: colors.blackPepper400,
76
85
  },
86
+ // Identical to 'default' styles. ButtonContainer will set opacity to 40%
77
87
  disabled: {
78
88
  background: 'transparent',
79
- border: 'rgba(30, 30, 30, 0.4)',
80
- icon: 'rgba(30, 30, 30, 0.4)',
81
- label: 'rgba(30, 30, 30, 0.4)',
82
- labelData: 'rgba(30, 30, 30, 0.4)',
89
+ border: colors.blackPepper400,
90
+ icon: colors.blackPepper400,
91
+ label: colors.blackPepper400,
92
+ labelData: colors.blackPepper400,
83
93
  },
84
94
  };
85
95
  case 'inverse':
@@ -115,12 +125,12 @@ export var getSecondaryButtonColors = function (variant, theme) {
115
125
  outerColor: colors.frenchVanilla100,
116
126
  }, theme),
117
127
  },
128
+ // Identical to inverse 'default' styles. ButtonContainer will set opacity to 40%
118
129
  disabled: {
119
130
  background: 'transparent',
120
- border: 'rgba(255, 255, 255, 0.4)',
121
- icon: 'rgba(255, 255, 255, 0.4)',
122
- label: 'rgba(255, 255, 255, 0.4)',
123
- labelData: 'rgba(255, 255, 255, 0.4)',
131
+ border: colors.frenchVanilla100,
132
+ icon: colors.frenchVanilla100,
133
+ label: colors.frenchVanilla100,
124
134
  },
125
135
  };
126
136
  }
@@ -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;AAsGD,eAAO,MAAM,cAAc,wEA4DzB,CAAC"}
@@ -22,7 +22,7 @@ var __rest = (this && this.__rest) || function (s, e) {
22
22
  };
23
23
  import * as React from 'react';
24
24
  import { focusRing, useTheme, createComponent, } from '@workday/canvas-kit-react/common';
25
- import { colors, space, type, borderRadius } from '@workday/canvas-kit-react/tokens';
25
+ import { colors, space, borderRadius } from '@workday/canvas-kit-react/tokens';
26
26
  import { ButtonContainer, ButtonLabelIcon, ButtonLabel } from './parts';
27
27
  var getTertiaryButtonColors = function (variant, theme) {
28
28
  var themePrimary = theme.canvas.palette.primary;
@@ -56,8 +56,8 @@ var getTertiaryButtonColors = function (variant, theme) {
56
56
  },
57
57
  disabled: {
58
58
  background: 'transparent',
59
- icon: 'rgba(255, 255, 255, 0.5)',
60
- label: 'rgba(255, 255, 255, 0.5)',
59
+ icon: colors.frenchVanilla100,
60
+ label: colors.frenchVanilla100,
61
61
  },
62
62
  };
63
63
  }
@@ -83,25 +83,29 @@ var getTertiaryButtonColors = function (variant, theme) {
83
83
  focusRing: focusRing({}, theme),
84
84
  },
85
85
  disabled: {
86
- background: 'transparent',
87
- icon: themePrimary.light,
88
- label: themePrimary.light,
86
+ icon: themePrimary.main,
87
+ label: themePrimary.main,
89
88
  },
90
89
  };
91
90
  }
92
91
  };
93
- var containerStyles = {
94
- borderRadius: borderRadius.m,
95
- border: '0',
96
- padding: "0 " + space.xxs,
97
- minWidth: 'auto',
98
- '.wdc-text-button-label': {
99
- borderBottom: '2px solid transparent',
100
- paddingTop: '2px',
101
- transition: 'border-color 0.3s',
102
- },
103
- '&:hover:not([disabled]) .wdc-text-button-label': {
104
- borderBottomColor: 'currentColor',
92
+ var getPaddingStyles = function (icon, iconPosition) {
93
+ // if there is an icon on the left, add 4px extra padding to the right for visual balance
94
+ if (icon && iconPosition === 'left') {
95
+ return "0 " + space.xs + " 0 " + space.xxs;
96
+ }
97
+ // if there is an icon on the right, add 4px extra padding to the left for visual balance
98
+ if (icon && iconPosition === 'right') {
99
+ return "0 " + space.xxs + " 0 " + space.xs;
100
+ }
101
+ // if there is no icon, return the default padding
102
+ return "0 " + space.xxs;
103
+ };
104
+ // All disabled buttons are set to 40% opacity.
105
+ // This will eventually live in the ButtonContainer styles, but for now we're scoping it to Primary, Secondary, and Tertiary buttons.
106
+ var disabledButtonOpacity = {
107
+ '&:disabled, &:disabled:active': {
108
+ opacity: 0.4,
105
109
  },
106
110
  };
107
111
  export var TertiaryButton = createComponent('button')({
@@ -114,9 +118,9 @@ export var TertiaryButton = createComponent('button')({
114
118
  // TODO: Fix useTheme and make it a real hook
115
119
  // eslint-disable-next-line react-hooks/rules-of-hooks
116
120
  theme = _b === void 0 ? 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"]);
117
- // Note: We don't use ButtonLabel because the label styles differ from other button types
118
- var allContainerStyles = allCaps
119
- ? __assign(__assign({}, containerStyles), { textTransform: 'uppercase', fontWeight: type.properties.fontWeights.bold, fontSize: size === 'medium' ? type.properties.fontSizes[16] : undefined, letterSpacing: '.5px' }) : __assign(__assign({}, containerStyles), { fontSize: size === 'medium' ? type.properties.fontSizes[14] : undefined });
121
+ var allContainerStyles = __assign({ borderRadius: borderRadius.m, border: '0', padding: getPaddingStyles(icon, iconPosition), minWidth: 'auto', textTransform: allCaps ? 'uppercase' : undefined, '.wdc-text-button-label': {
122
+ textDecoration: 'underline',
123
+ } }, disabledButtonOpacity);
120
124
  return (React.createElement(ButtonContainer, __assign({ ref: ref, as: Element, colors: getTertiaryButtonColors(variant, theme), size: size, extraStyles: allContainerStyles }, elemProps),
121
125
  icon && iconPosition === 'left' && (React.createElement(ButtonLabelIcon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
122
126
  React.createElement(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"}
@@ -45,15 +45,9 @@ export var ButtonContainer = styled('button', {
45
45
  var size = _a.size;
46
46
  switch (size) {
47
47
  case 'large':
48
- return {
49
- fontSize: type.properties.fontSizes[16],
50
- minWidth: '112px',
51
- height: '48px',
52
- padding: "0 " + space.l,
53
- '& > * ': {
54
- margin: "0 " + spaceNumbers.xs / 2 + "px",
55
- },
56
- };
48
+ return __assign(__assign({}, type.levels.body.small), { fontWeight: type.properties.fontWeights.bold, minWidth: '112px', height: '48px', padding: "0 " + space.l, '& > * ': {
49
+ margin: "0 " + spaceNumbers.xxs / 2 + "px",
50
+ } });
57
51
  case 'medium':
58
52
  default:
59
53
  return {
@@ -73,6 +67,10 @@ export var ButtonContainer = styled('button', {
73
67
  margin: "0 " + spaceNumbers.xxxs / 2 + "px",
74
68
  },
75
69
  };
70
+ case 'extraSmall':
71
+ return __assign(__assign({}, type.levels.subtext.medium), { fontWeight: type.properties.fontWeights.bold, height: space.m, padding: "0 " + space.xs, '& > * ': {
72
+ margin: "0 " + spaceNumbers.xxxs / 2 + "px",
73
+ } });
76
74
  }
77
75
  }, function (_a) {
78
76
  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>, "hidden" | "color" | "style" | "title" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "css">, 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>, "hidden" | "color" | "style" | "translate" | "prefix" | "slot" | "title" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "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" | "css" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is">, 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"}