@primer/components 31.2.1-rc.a088bdc0 → 32.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 (1169) hide show
  1. package/CHANGELOG.md +61 -1
  2. package/dist/browser.esm.js +289 -351
  3. package/dist/browser.esm.js.map +1 -1
  4. package/dist/browser.umd.js +294 -356
  5. package/dist/browser.umd.js.map +1 -1
  6. package/lib/Breadcrumbs.d.ts +8 -7
  7. package/lib/Breadcrumbs.js +7 -12
  8. package/lib/Breadcrumbs.jsx +3 -6
  9. package/lib/Button/Button.d.ts +2 -3
  10. package/lib/Button/Button.js +2 -6
  11. package/lib/Button/Button.jsx +1 -21
  12. package/lib/Button/ButtonBase.d.ts +5 -8
  13. package/lib/Button/ButtonBase.js +1 -5
  14. package/lib/Button/ButtonBase.jsx +0 -3
  15. package/lib/Button/ButtonClose.d.ts +2 -45
  16. package/lib/Button/ButtonClose.js +1 -1
  17. package/lib/Button/ButtonClose.jsx +0 -2
  18. package/lib/Button/ButtonDanger.d.ts +2 -3
  19. package/lib/Button/ButtonDanger.js +2 -6
  20. package/lib/Button/ButtonDanger.jsx +1 -21
  21. package/lib/Button/ButtonInvisible.d.ts +2 -3
  22. package/lib/Button/ButtonInvisible.js +2 -6
  23. package/lib/Button/ButtonInvisible.jsx +1 -21
  24. package/lib/Button/ButtonOutline.d.ts +2 -3
  25. package/lib/Button/ButtonOutline.js +2 -6
  26. package/lib/Button/ButtonOutline.jsx +1 -21
  27. package/lib/Button/ButtonPrimary.d.ts +2 -3
  28. package/lib/Button/ButtonPrimary.js +2 -6
  29. package/lib/Button/ButtonPrimary.jsx +1 -21
  30. package/lib/Button/ButtonTableList.d.ts +1 -2
  31. package/lib/Button/ButtonTableList.js +1 -1
  32. package/lib/Button/ButtonTableList.jsx +0 -3
  33. package/lib/CircleBadge.d.ts +4 -5
  34. package/lib/CircleBadge.js +1 -1
  35. package/lib/CircleBadge.jsx +0 -1
  36. package/lib/CounterLabel.d.ts +1 -2
  37. package/lib/CounterLabel.js +1 -1
  38. package/lib/CounterLabel.jsx +0 -1
  39. package/lib/Dialog/Dialog.d.ts +5 -9
  40. package/lib/Dialog/Dialog.js +17 -11
  41. package/lib/Dialog/Dialog.jsx +13 -7
  42. package/lib/Dialog.d.ts +3 -4
  43. package/lib/Dialog.js +1 -1
  44. package/lib/Dialog.jsx +0 -2
  45. package/lib/Dropdown.d.ts +6 -95
  46. package/lib/Dropdown.js +3 -3
  47. package/lib/Dropdown.jsx +0 -3
  48. package/lib/DropdownMenu/DropdownButton.d.ts +2 -46
  49. package/lib/DropdownMenu/DropdownButton.js +3 -1
  50. package/lib/DropdownMenu/DropdownButton.jsx +1 -1
  51. package/lib/FilterList.d.ts +264 -303
  52. package/lib/FilterList.js +2 -6
  53. package/lib/FilterList.jsx +2 -6
  54. package/lib/FilteredSearch.d.ts +1 -2
  55. package/lib/FilteredSearch.js +1 -1
  56. package/lib/FilteredSearch.jsx +0 -1
  57. package/lib/Flash.d.ts +1 -2
  58. package/lib/Flash.js +1 -1
  59. package/lib/Flash.jsx +0 -1
  60. package/lib/FormGroup.d.ts +4 -5
  61. package/lib/FormGroup.js +2 -2
  62. package/lib/FormGroup.jsx +0 -3
  63. package/lib/Header.d.ts +6 -7
  64. package/lib/Header.js +4 -4
  65. package/lib/Header.jsx +0 -7
  66. package/lib/Label.d.ts +1 -2
  67. package/lib/Label.js +2 -3
  68. package/lib/Label.jsx +1 -3
  69. package/lib/LabelGroup.d.ts +1 -2
  70. package/lib/LabelGroup.js +1 -1
  71. package/lib/LabelGroup.jsx +0 -1
  72. package/lib/Link.d.ts +1 -2
  73. package/lib/Link.js +1 -1
  74. package/lib/Link.jsx +0 -2
  75. package/lib/Overlay.d.ts +11 -10
  76. package/lib/Overlay.js +3 -4
  77. package/lib/Overlay.jsx +1 -3
  78. package/lib/Pagehead.d.ts +1 -2
  79. package/lib/Pagehead.js +1 -1
  80. package/lib/Pagehead.jsx +0 -1
  81. package/lib/Pagination/Pagination.js +1 -1
  82. package/lib/Pagination/Pagination.jsx +0 -2
  83. package/lib/Popover.d.ts +4 -5
  84. package/lib/Popover.js +4 -5
  85. package/lib/Popover.jsx +1 -9
  86. package/lib/SelectMenu/SelectMenu.d.ts +14 -182
  87. package/lib/SelectMenu/SelectMenu.js +1 -3
  88. package/lib/SelectMenu/SelectMenu.jsx +0 -2
  89. package/lib/SelectMenu/SelectMenuDivider.d.ts +1 -2
  90. package/lib/SelectMenu/SelectMenuDivider.js +1 -1
  91. package/lib/SelectMenu/SelectMenuDivider.jsx +0 -1
  92. package/lib/SelectMenu/SelectMenuFilter.js +1 -1
  93. package/lib/SelectMenu/SelectMenuFilter.jsx +0 -1
  94. package/lib/SelectMenu/SelectMenuFooter.d.ts +1 -2
  95. package/lib/SelectMenu/SelectMenuFooter.js +1 -1
  96. package/lib/SelectMenu/SelectMenuFooter.jsx +0 -1
  97. package/lib/SelectMenu/SelectMenuHeader.d.ts +1 -2
  98. package/lib/SelectMenu/SelectMenuHeader.js +1 -1
  99. package/lib/SelectMenu/SelectMenuHeader.jsx +0 -2
  100. package/lib/SelectMenu/SelectMenuItem.d.ts +2 -3
  101. package/lib/SelectMenu/SelectMenuItem.js +1 -1
  102. package/lib/SelectMenu/SelectMenuItem.jsx +0 -1
  103. package/lib/SelectMenu/SelectMenuList.d.ts +1 -2
  104. package/lib/SelectMenu/SelectMenuList.js +1 -1
  105. package/lib/SelectMenu/SelectMenuList.jsx +0 -1
  106. package/lib/SelectMenu/SelectMenuLoadingAnimation.d.ts +2 -2
  107. package/lib/SelectMenu/SelectMenuLoadingAnimation.js +3 -1
  108. package/lib/SelectMenu/SelectMenuLoadingAnimation.jsx +2 -1
  109. package/lib/SelectMenu/SelectMenuModal.d.ts +2 -3
  110. package/lib/SelectMenu/SelectMenuModal.js +1 -1
  111. package/lib/SelectMenu/SelectMenuModal.jsx +0 -1
  112. package/lib/SelectMenu/SelectMenuTab.d.ts +1 -2
  113. package/lib/SelectMenu/SelectMenuTab.js +1 -1
  114. package/lib/SelectMenu/SelectMenuTab.jsx +0 -1
  115. package/lib/SelectMenu/SelectMenuTabPanel.d.ts +1 -2
  116. package/lib/SelectMenu/SelectMenuTabPanel.js +1 -1
  117. package/lib/SelectMenu/SelectMenuTabPanel.jsx +0 -1
  118. package/lib/SelectMenu/SelectMenuTabs.d.ts +1 -2
  119. package/lib/SelectMenu/SelectMenuTabs.js +1 -1
  120. package/lib/SelectMenu/SelectMenuTabs.jsx +0 -1
  121. package/lib/SideNav.d.ts +11 -8
  122. package/lib/SideNav.js +8 -15
  123. package/lib/SideNav.jsx +2 -6
  124. package/lib/StateLabel.d.ts +1 -2
  125. package/lib/StateLabel.js +6 -5
  126. package/lib/StateLabel.jsx +1 -2
  127. package/lib/StyledOcticon.d.ts +1 -2
  128. package/lib/StyledOcticon.js +1 -3
  129. package/lib/StyledOcticon.jsx +0 -2
  130. package/lib/SubNav.d.ts +5 -11
  131. package/lib/SubNav.js +7 -12
  132. package/lib/SubNav.jsx +4 -7
  133. package/lib/TabNav.d.ts +3 -4
  134. package/lib/TabNav.js +2 -2
  135. package/lib/TabNav.jsx +0 -2
  136. package/lib/Timeline.d.ts +19 -393
  137. package/lib/Timeline.js +16 -13
  138. package/lib/Timeline.jsx +9 -10
  139. package/lib/Tooltip.d.ts +1 -2
  140. package/lib/Tooltip.js +1 -1
  141. package/lib/Tooltip.jsx +1 -1
  142. package/lib/Truncate.d.ts +1 -2
  143. package/lib/Truncate.js +1 -3
  144. package/lib/Truncate.jsx +0 -3
  145. package/lib/UnderlineNav.d.ts +2 -3
  146. package/lib/UnderlineNav.js +2 -2
  147. package/lib/UnderlineNav.jsx +0 -2
  148. package/lib-esm/Breadcrumbs.d.ts +8 -7
  149. package/lib-esm/Breadcrumbs.js +8 -13
  150. package/lib-esm/Button/Button.d.ts +2 -3
  151. package/lib-esm/Button/Button.js +2 -2
  152. package/lib-esm/Button/ButtonBase.d.ts +5 -8
  153. package/lib-esm/Button/ButtonBase.js +1 -3
  154. package/lib-esm/Button/ButtonClose.d.ts +2 -45
  155. package/lib-esm/Button/ButtonClose.js +2 -2
  156. package/lib-esm/Button/ButtonDanger.d.ts +2 -3
  157. package/lib-esm/Button/ButtonDanger.js +2 -2
  158. package/lib-esm/Button/ButtonInvisible.d.ts +2 -3
  159. package/lib-esm/Button/ButtonInvisible.js +2 -2
  160. package/lib-esm/Button/ButtonOutline.d.ts +2 -3
  161. package/lib-esm/Button/ButtonOutline.js +2 -2
  162. package/lib-esm/Button/ButtonPrimary.d.ts +2 -3
  163. package/lib-esm/Button/ButtonPrimary.js +2 -2
  164. package/lib-esm/Button/ButtonTableList.d.ts +1 -2
  165. package/lib-esm/Button/ButtonTableList.js +2 -2
  166. package/lib-esm/CircleBadge.d.ts +4 -5
  167. package/lib-esm/CircleBadge.js +2 -2
  168. package/lib-esm/CounterLabel.d.ts +1 -2
  169. package/lib-esm/CounterLabel.js +2 -2
  170. package/lib-esm/Dialog/Dialog.d.ts +5 -9
  171. package/lib-esm/Dialog/Dialog.js +12 -12
  172. package/lib-esm/Dialog.d.ts +3 -4
  173. package/lib-esm/Dialog.js +2 -2
  174. package/lib-esm/Dropdown.d.ts +6 -95
  175. package/lib-esm/Dropdown.js +4 -4
  176. package/lib-esm/DropdownMenu/DropdownButton.d.ts +2 -46
  177. package/lib-esm/DropdownMenu/DropdownButton.js +3 -1
  178. package/lib-esm/FilterList.d.ts +264 -303
  179. package/lib-esm/FilterList.js +3 -7
  180. package/lib-esm/FilteredSearch.d.ts +1 -2
  181. package/lib-esm/FilteredSearch.js +2 -2
  182. package/lib-esm/Flash.d.ts +1 -2
  183. package/lib-esm/Flash.js +2 -2
  184. package/lib-esm/FormGroup.d.ts +4 -5
  185. package/lib-esm/FormGroup.js +3 -3
  186. package/lib-esm/Header.d.ts +6 -7
  187. package/lib-esm/Header.js +5 -5
  188. package/lib-esm/Label.d.ts +1 -2
  189. package/lib-esm/Label.js +3 -4
  190. package/lib-esm/LabelGroup.d.ts +1 -2
  191. package/lib-esm/LabelGroup.js +2 -2
  192. package/lib-esm/Link.d.ts +1 -2
  193. package/lib-esm/Link.js +2 -2
  194. package/lib-esm/Overlay.d.ts +11 -10
  195. package/lib-esm/Overlay.js +2 -3
  196. package/lib-esm/Pagehead.d.ts +1 -2
  197. package/lib-esm/Pagehead.js +2 -2
  198. package/lib-esm/Pagination/Pagination.js +2 -2
  199. package/lib-esm/Popover.d.ts +4 -5
  200. package/lib-esm/Popover.js +4 -5
  201. package/lib-esm/SelectMenu/SelectMenu.d.ts +14 -182
  202. package/lib-esm/SelectMenu/SelectMenu.js +1 -2
  203. package/lib-esm/SelectMenu/SelectMenuDivider.d.ts +1 -2
  204. package/lib-esm/SelectMenu/SelectMenuDivider.js +2 -2
  205. package/lib-esm/SelectMenu/SelectMenuFilter.js +2 -2
  206. package/lib-esm/SelectMenu/SelectMenuFooter.d.ts +1 -2
  207. package/lib-esm/SelectMenu/SelectMenuFooter.js +2 -2
  208. package/lib-esm/SelectMenu/SelectMenuHeader.d.ts +1 -2
  209. package/lib-esm/SelectMenu/SelectMenuHeader.js +2 -2
  210. package/lib-esm/SelectMenu/SelectMenuItem.d.ts +2 -3
  211. package/lib-esm/SelectMenu/SelectMenuItem.js +2 -2
  212. package/lib-esm/SelectMenu/SelectMenuList.d.ts +1 -2
  213. package/lib-esm/SelectMenu/SelectMenuList.js +2 -2
  214. package/lib-esm/SelectMenu/SelectMenuLoadingAnimation.d.ts +2 -2
  215. package/lib-esm/SelectMenu/SelectMenuLoadingAnimation.js +3 -2
  216. package/lib-esm/SelectMenu/SelectMenuModal.d.ts +2 -3
  217. package/lib-esm/SelectMenu/SelectMenuModal.js +2 -2
  218. package/lib-esm/SelectMenu/SelectMenuTab.d.ts +1 -2
  219. package/lib-esm/SelectMenu/SelectMenuTab.js +2 -2
  220. package/lib-esm/SelectMenu/SelectMenuTabPanel.d.ts +1 -2
  221. package/lib-esm/SelectMenu/SelectMenuTabPanel.js +2 -2
  222. package/lib-esm/SelectMenu/SelectMenuTabs.d.ts +1 -2
  223. package/lib-esm/SelectMenu/SelectMenuTabs.js +2 -2
  224. package/lib-esm/SideNav.d.ts +11 -8
  225. package/lib-esm/SideNav.js +8 -16
  226. package/lib-esm/StateLabel.d.ts +1 -2
  227. package/lib-esm/StateLabel.js +7 -6
  228. package/lib-esm/StyledOcticon.d.ts +1 -2
  229. package/lib-esm/StyledOcticon.js +1 -2
  230. package/lib-esm/SubNav.d.ts +5 -11
  231. package/lib-esm/SubNav.js +8 -13
  232. package/lib-esm/TabNav.d.ts +3 -4
  233. package/lib-esm/TabNav.js +3 -3
  234. package/lib-esm/Timeline.d.ts +19 -393
  235. package/lib-esm/Timeline.js +12 -13
  236. package/lib-esm/Tooltip.d.ts +1 -2
  237. package/lib-esm/Tooltip.js +2 -2
  238. package/lib-esm/Truncate.d.ts +1 -2
  239. package/lib-esm/Truncate.js +1 -2
  240. package/lib-esm/UnderlineNav.d.ts +2 -3
  241. package/lib-esm/UnderlineNav.js +3 -3
  242. package/package.json +3 -3
  243. package/.changeset/README.md +0 -8
  244. package/.changeset/config.json +0 -10
  245. package/.devcontainer/devcontainer.json +0 -8
  246. package/.eslintrc.json +0 -137
  247. package/.github/ISSUE_TEMPLATE/bug_report.md +0 -38
  248. package/.github/ISSUE_TEMPLATE/new_component_proposal_template.md +0 -41
  249. package/.github/dependabot.yml +0 -18
  250. package/.github/pull_request_template.md +0 -18
  251. package/.github/workflows/check_for_changeset.yml +0 -25
  252. package/.github/workflows/ci.yml +0 -34
  253. package/.github/workflows/deploy_preview.yml +0 -47
  254. package/.github/workflows/deploy_production.yml +0 -70
  255. package/.github/workflows/release.yml +0 -36
  256. package/.github/workflows/release_canary.yml +0 -72
  257. package/.github/workflows/release_candidate.yml +0 -60
  258. package/.github/workflows/size.yml +0 -13
  259. package/.github/workflows/stale.yml +0 -26
  260. package/.gitignore +0 -10
  261. package/.npmrc +0 -4
  262. package/.nvmrc +0 -1
  263. package/.storybook/main.js +0 -9
  264. package/.storybook/preview.js +0 -117
  265. package/.vscode/launch.json +0 -21
  266. package/.vscode/settings.json +0 -13
  267. package/@types/@styled-system/index.d.ts +0 -0
  268. package/@types/@styled-system/prop-types/index.d.ts +0 -1
  269. package/@types/@styled-system/props/index.d.ts +0 -1
  270. package/@types/jest-styled-components/index.d.ts +0 -1
  271. package/CODEOWNERS +0 -2
  272. package/babel-defines.js +0 -13
  273. package/babel.config.js +0 -39
  274. package/contributor-docs/CODE_OF_CONDUCT.md +0 -76
  275. package/contributor-docs/CONTRIBUTING.md +0 -274
  276. package/contributor-docs/adrs/adr-001-typescript.md +0 -23
  277. package/contributor-docs/adrs/adr-002-behavior-isolation.md +0 -108
  278. package/contributor-docs/adrs/adr-003-prop-norms.md +0 -72
  279. package/contributor-docs/behaviors.md +0 -132
  280. package/contributor-docs/component-contents-api-patterns.md +0 -316
  281. package/contributor-docs/principles.md +0 -39
  282. package/docs/.eslintrc +0 -0
  283. package/docs/.gitignore +0 -91
  284. package/docs/components/PropsList.js +0 -5
  285. package/docs/components/State.js +0 -9
  286. package/docs/components/constants.js +0 -34
  287. package/docs/components/index.js +0 -2
  288. package/docs/content/ActionList.mdx +0 -99
  289. package/docs/content/ActionList2.mdx +0 -359
  290. package/docs/content/ActionMenu.mdx +0 -80
  291. package/docs/content/AnchoredOverlay.mdx +0 -37
  292. package/docs/content/Autocomplete.mdx +0 -657
  293. package/docs/content/Avatar.mdx +0 -33
  294. package/docs/content/AvatarStack.mdx +0 -37
  295. package/docs/content/BorderBox.md +0 -46
  296. package/docs/content/Box.mdx +0 -96
  297. package/docs/content/BranchName.md +0 -18
  298. package/docs/content/Breadcrumbs.md +0 -52
  299. package/docs/content/Buttons.md +0 -56
  300. package/docs/content/CircleBadge.md +0 -45
  301. package/docs/content/CircleOcticon.md +0 -18
  302. package/docs/content/CounterLabel.md +0 -32
  303. package/docs/content/Details.md +0 -105
  304. package/docs/content/Dialog.md +0 -108
  305. package/docs/content/Dialog2.mdx +0 -179
  306. package/docs/content/Dropdown.md +0 -72
  307. package/docs/content/DropdownMenu.mdx +0 -49
  308. package/docs/content/FilterList.md +0 -44
  309. package/docs/content/FilteredSearch.md +0 -39
  310. package/docs/content/Flash.md +0 -44
  311. package/docs/content/Flex.md +0 -58
  312. package/docs/content/FormGroup.md +0 -46
  313. package/docs/content/Grid.md +0 -59
  314. package/docs/content/Header.md +0 -79
  315. package/docs/content/Heading.md +0 -22
  316. package/docs/content/Label.md +0 -42
  317. package/docs/content/LabelGroup.md +0 -31
  318. package/docs/content/Link.md +0 -37
  319. package/docs/content/Overlay.mdx +0 -94
  320. package/docs/content/Pagehead.md +0 -27
  321. package/docs/content/Pagination.md +0 -187
  322. package/docs/content/PointerBox.md +0 -81
  323. package/docs/content/Popover.md +0 -137
  324. package/docs/content/Portal.mdx +0 -78
  325. package/docs/content/Position.md +0 -100
  326. package/docs/content/ProgressBar.mdx +0 -29
  327. package/docs/content/SelectMenu.md +0 -435
  328. package/docs/content/SelectPanel.mdx +0 -67
  329. package/docs/content/SideNav.md +0 -179
  330. package/docs/content/Spinner.mdx +0 -32
  331. package/docs/content/StateLabel.md +0 -36
  332. package/docs/content/StyledOcticon.md +0 -36
  333. package/docs/content/SubNav.md +0 -102
  334. package/docs/content/TabNav.md +0 -50
  335. package/docs/content/Text.md +0 -31
  336. package/docs/content/TextInput.md +0 -34
  337. package/docs/content/TextInputTokens.mdx +0 -89
  338. package/docs/content/TextInputWithTokens.mdx +0 -211
  339. package/docs/content/Timeline.md +0 -138
  340. package/docs/content/Token.mdx +0 -381
  341. package/docs/content/Tooltip.md +0 -41
  342. package/docs/content/Truncate.md +0 -64
  343. package/docs/content/UnderlineNav.md +0 -53
  344. package/docs/content/anchoredPosition.mdx +0 -163
  345. package/docs/content/core-concepts.md +0 -70
  346. package/docs/content/focusTrap.mdx +0 -103
  347. package/docs/content/focusZone.mdx +0 -145
  348. package/docs/content/getting-started.md +0 -138
  349. package/docs/content/index.md +0 -33
  350. package/docs/content/linting.md +0 -35
  351. package/docs/content/overriding-styles.mdx +0 -82
  352. package/docs/content/philosophy.md +0 -23
  353. package/docs/content/primer-theme.md +0 -89
  354. package/docs/content/ssr.mdx +0 -43
  355. package/docs/content/system-props.mdx +0 -37
  356. package/docs/content/theme-reference.md +0 -16
  357. package/docs/content/theming.md +0 -272
  358. package/docs/content/useOnEscapePress.mdx +0 -56
  359. package/docs/content/useOnOutsideClick.mdx +0 -57
  360. package/docs/content/useOpenAndCloseFocus.mdx +0 -49
  361. package/docs/content/useOverlay.mdx +0 -62
  362. package/docs/content/useSafeTimeout.mdx +0 -32
  363. package/docs/gatsby-config.js +0 -30
  364. package/docs/gatsby-node.js +0 -101
  365. package/docs/package-lock.json +0 -20756
  366. package/docs/package.json +0 -36
  367. package/docs/src/@primer/gatsby-theme-doctocat/components/hero.js +0 -21
  368. package/docs/src/@primer/gatsby-theme-doctocat/components/live-preview-wrapper.js +0 -41
  369. package/docs/src/@primer/gatsby-theme-doctocat/live-code-scope.js +0 -73
  370. package/docs/src/@primer/gatsby-theme-doctocat/nav.yml +0 -133
  371. package/docs/src/@primer/gatsby-theme-doctocat/primer-components-hero.svg +0 -1411
  372. package/docs/src/component-checklist.js +0 -81
  373. package/docs/src/props.js +0 -77
  374. package/jest.config.js +0 -13
  375. package/lib/__tests__/ActionList.test.d.ts +0 -1
  376. package/lib/__tests__/ActionList.test.js +0 -69
  377. package/lib/__tests__/ActionList.test.jsx +0 -49
  378. package/lib/__tests__/ActionList.types.test.d.ts +0 -6
  379. package/lib/__tests__/ActionList.types.test.js +0 -69
  380. package/lib/__tests__/ActionList.types.test.jsx +0 -45
  381. package/lib/__tests__/ActionList2.test.d.ts +0 -1
  382. package/lib/__tests__/ActionList2.test.js +0 -53
  383. package/lib/__tests__/ActionList2.test.jsx +0 -46
  384. package/lib/__tests__/ActionMenu.test.d.ts +0 -1
  385. package/lib/__tests__/ActionMenu.test.js +0 -151
  386. package/lib/__tests__/ActionMenu.test.jsx +0 -124
  387. package/lib/__tests__/AnchoredOverlay.test.d.ts +0 -1
  388. package/lib/__tests__/AnchoredOverlay.test.js +0 -162
  389. package/lib/__tests__/AnchoredOverlay.test.jsx +0 -121
  390. package/lib/__tests__/Autocomplete.test.d.ts +0 -1
  391. package/lib/__tests__/Autocomplete.test.js +0 -528
  392. package/lib/__tests__/Autocomplete.test.jsx +0 -299
  393. package/lib/__tests__/Avatar.test.d.ts +0 -1
  394. package/lib/__tests__/Avatar.test.js +0 -67
  395. package/lib/__tests__/Avatar.test.jsx +0 -42
  396. package/lib/__tests__/AvatarStack.test.d.ts +0 -1
  397. package/lib/__tests__/AvatarStack.test.js +0 -71
  398. package/lib/__tests__/AvatarStack.test.jsx +0 -43
  399. package/lib/__tests__/BorderBox.test.d.ts +0 -1
  400. package/lib/__tests__/BorderBox.test.js +0 -58
  401. package/lib/__tests__/BorderBox.test.jsx +0 -36
  402. package/lib/__tests__/Box.test.d.ts +0 -1
  403. package/lib/__tests__/Box.test.js +0 -78
  404. package/lib/__tests__/Box.test.jsx +0 -41
  405. package/lib/__tests__/BranchName.test.d.ts +0 -1
  406. package/lib/__tests__/BranchName.test.js +0 -36
  407. package/lib/__tests__/BranchName.test.jsx +0 -27
  408. package/lib/__tests__/Breadcrumbs.test.d.ts +0 -1
  409. package/lib/__tests__/Breadcrumbs.test.js +0 -37
  410. package/lib/__tests__/Breadcrumbs.test.jsx +0 -28
  411. package/lib/__tests__/BreadcrumbsItem.test.d.ts +0 -1
  412. package/lib/__tests__/BreadcrumbsItem.test.js +0 -49
  413. package/lib/__tests__/BreadcrumbsItem.test.jsx +0 -31
  414. package/lib/__tests__/Button.test.d.ts +0 -1
  415. package/lib/__tests__/Button.test.js +0 -143
  416. package/lib/__tests__/Button.test.jsx +0 -100
  417. package/lib/__tests__/Caret.test.d.ts +0 -1
  418. package/lib/__tests__/Caret.test.js +0 -52
  419. package/lib/__tests__/Caret.test.jsx +0 -37
  420. package/lib/__tests__/CircleBadge.test.d.ts +0 -1
  421. package/lib/__tests__/CircleBadge.test.js +0 -83
  422. package/lib/__tests__/CircleBadge.test.jsx +0 -55
  423. package/lib/__tests__/CircleOcticon.test.d.ts +0 -1
  424. package/lib/__tests__/CircleOcticon.test.js +0 -71
  425. package/lib/__tests__/CircleOcticon.test.jsx +0 -45
  426. package/lib/__tests__/ConfirmationDialog.test.d.ts +0 -1
  427. package/lib/__tests__/ConfirmationDialog.test.js +0 -134
  428. package/lib/__tests__/ConfirmationDialog.test.jsx +0 -119
  429. package/lib/__tests__/CounterLabel.test.d.ts +0 -1
  430. package/lib/__tests__/CounterLabel.test.js +0 -58
  431. package/lib/__tests__/CounterLabel.test.jsx +0 -36
  432. package/lib/__tests__/Details.test.d.ts +0 -1
  433. package/lib/__tests__/Details.test.js +0 -117
  434. package/lib/__tests__/Details.test.jsx +0 -85
  435. package/lib/__tests__/Dialog.test.d.ts +0 -1
  436. package/lib/__tests__/Dialog.test.js +0 -184
  437. package/lib/__tests__/Dialog.test.jsx +0 -139
  438. package/lib/__tests__/Dropdown.test.d.ts +0 -1
  439. package/lib/__tests__/Dropdown.test.js +0 -63
  440. package/lib/__tests__/Dropdown.test.jsx +0 -49
  441. package/lib/__tests__/DropdownMenu.test.d.ts +0 -1
  442. package/lib/__tests__/DropdownMenu.test.js +0 -150
  443. package/lib/__tests__/DropdownMenu.test.jsx +0 -119
  444. package/lib/__tests__/FilterList.test.d.ts +0 -1
  445. package/lib/__tests__/FilterList.test.js +0 -36
  446. package/lib/__tests__/FilterList.test.jsx +0 -27
  447. package/lib/__tests__/FilterListItem.test.d.ts +0 -1
  448. package/lib/__tests__/FilterListItem.test.js +0 -46
  449. package/lib/__tests__/FilterListItem.test.jsx +0 -31
  450. package/lib/__tests__/FilteredSearch.test.d.ts +0 -1
  451. package/lib/__tests__/FilteredSearch.test.js +0 -36
  452. package/lib/__tests__/FilteredSearch.test.jsx +0 -27
  453. package/lib/__tests__/Flash.test.d.ts +0 -1
  454. package/lib/__tests__/Flash.test.js +0 -62
  455. package/lib/__tests__/Flash.test.jsx +0 -36
  456. package/lib/__tests__/Flex.test.d.ts +0 -1
  457. package/lib/__tests__/Flex.test.js +0 -74
  458. package/lib/__tests__/Flex.test.jsx +0 -51
  459. package/lib/__tests__/FormGroup.test.d.ts +0 -1
  460. package/lib/__tests__/FormGroup.test.js +0 -54
  461. package/lib/__tests__/FormGroup.test.jsx +0 -36
  462. package/lib/__tests__/Grid.test.d.ts +0 -1
  463. package/lib/__tests__/Grid.test.js +0 -104
  464. package/lib/__tests__/Grid.test.jsx +0 -69
  465. package/lib/__tests__/Header.test.d.ts +0 -1
  466. package/lib/__tests__/Header.test.js +0 -58
  467. package/lib/__tests__/Header.test.jsx +0 -45
  468. package/lib/__tests__/Heading.test.d.ts +0 -1
  469. package/lib/__tests__/Heading.test.js +0 -109
  470. package/lib/__tests__/Heading.test.jsx +0 -71
  471. package/lib/__tests__/KeyPaths.types.test.d.ts +0 -11
  472. package/lib/__tests__/KeyPaths.types.test.js +0 -7
  473. package/lib/__tests__/Label.test.d.ts +0 -1
  474. package/lib/__tests__/Label.test.js +0 -46
  475. package/lib/__tests__/Label.test.jsx +0 -33
  476. package/lib/__tests__/LabelGroup.test.d.ts +0 -1
  477. package/lib/__tests__/LabelGroup.test.js +0 -38
  478. package/lib/__tests__/LabelGroup.test.jsx +0 -29
  479. package/lib/__tests__/Link.test.d.ts +0 -1
  480. package/lib/__tests__/Link.test.js +0 -70
  481. package/lib/__tests__/Link.test.jsx +0 -43
  482. package/lib/__tests__/Merge.types.test.d.ts +0 -30
  483. package/lib/__tests__/Merge.types.test.js +0 -21
  484. package/lib/__tests__/NewButton.test.d.ts +0 -1
  485. package/lib/__tests__/NewButton.test.js +0 -95
  486. package/lib/__tests__/NewButton.test.jsx +0 -61
  487. package/lib/__tests__/Overlay.test.d.ts +0 -1
  488. package/lib/__tests__/Overlay.test.js +0 -145
  489. package/lib/__tests__/Overlay.test.jsx +0 -105
  490. package/lib/__tests__/Pagehead.test.d.ts +0 -1
  491. package/lib/__tests__/Pagehead.test.js +0 -37
  492. package/lib/__tests__/Pagehead.test.jsx +0 -25
  493. package/lib/__tests__/Pagination/Pagination.test.d.ts +0 -1
  494. package/lib/__tests__/Pagination/Pagination.test.js +0 -47
  495. package/lib/__tests__/Pagination/Pagination.test.jsx +0 -32
  496. package/lib/__tests__/Pagination/PaginationModel.test.d.ts +0 -1
  497. package/lib/__tests__/Pagination/PaginationModel.test.js +0 -186
  498. package/lib/__tests__/Pagination/PaginationModel.test.jsx +0 -118
  499. package/lib/__tests__/PointerBox.test.d.ts +0 -1
  500. package/lib/__tests__/PointerBox.test.js +0 -46
  501. package/lib/__tests__/PointerBox.test.jsx +0 -33
  502. package/lib/__tests__/Popover.test.d.ts +0 -1
  503. package/lib/__tests__/Popover.test.js +0 -66
  504. package/lib/__tests__/Popover.test.jsx +0 -58
  505. package/lib/__tests__/Portal.test.d.ts +0 -1
  506. package/lib/__tests__/Portal.test.js +0 -124
  507. package/lib/__tests__/Portal.test.jsx +0 -102
  508. package/lib/__tests__/Position.test.d.ts +0 -1
  509. package/lib/__tests__/Position.test.js +0 -143
  510. package/lib/__tests__/Position.test.jsx +0 -96
  511. package/lib/__tests__/ProgressBar.test.d.ts +0 -1
  512. package/lib/__tests__/ProgressBar.test.js +0 -68
  513. package/lib/__tests__/ProgressBar.test.jsx +0 -38
  514. package/lib/__tests__/SelectMenu.test.d.ts +0 -1
  515. package/lib/__tests__/SelectMenu.test.js +0 -155
  516. package/lib/__tests__/SelectMenu.test.jsx +0 -120
  517. package/lib/__tests__/SelectPanel.test.d.ts +0 -1
  518. package/lib/__tests__/SelectPanel.test.js +0 -80
  519. package/lib/__tests__/SelectPanel.test.jsx +0 -48
  520. package/lib/__tests__/SideNav.test.d.ts +0 -1
  521. package/lib/__tests__/SideNav.test.js +0 -71
  522. package/lib/__tests__/SideNav.test.jsx +0 -55
  523. package/lib/__tests__/Spinner.test.d.ts +0 -1
  524. package/lib/__tests__/Spinner.test.js +0 -53
  525. package/lib/__tests__/Spinner.test.jsx +0 -41
  526. package/lib/__tests__/StateLabel.test.d.ts +0 -1
  527. package/lib/__tests__/StateLabel.test.js +0 -71
  528. package/lib/__tests__/StateLabel.test.jsx +0 -46
  529. package/lib/__tests__/StyledOcticon.test.d.ts +0 -1
  530. package/lib/__tests__/StyledOcticon.test.js +0 -40
  531. package/lib/__tests__/StyledOcticon.test.jsx +0 -28
  532. package/lib/__tests__/SubNav.test.d.ts +0 -1
  533. package/lib/__tests__/SubNav.test.js +0 -62
  534. package/lib/__tests__/SubNav.test.jsx +0 -47
  535. package/lib/__tests__/SubNavLink.test.d.ts +0 -1
  536. package/lib/__tests__/SubNavLink.test.js +0 -49
  537. package/lib/__tests__/SubNavLink.test.jsx +0 -31
  538. package/lib/__tests__/TabNav.test.d.ts +0 -1
  539. package/lib/__tests__/TabNav.test.js +0 -49
  540. package/lib/__tests__/TabNav.test.jsx +0 -32
  541. package/lib/__tests__/Text.test.d.ts +0 -1
  542. package/lib/__tests__/Text.test.js +0 -105
  543. package/lib/__tests__/Text.test.jsx +0 -71
  544. package/lib/__tests__/TextInput.test.d.ts +0 -1
  545. package/lib/__tests__/TextInput.test.js +0 -78
  546. package/lib/__tests__/TextInput.test.jsx +0 -45
  547. package/lib/__tests__/TextInputWithTokens.test.d.ts +0 -1
  548. package/lib/__tests__/TextInputWithTokens.test.js +0 -572
  549. package/lib/__tests__/TextInputWithTokens.test.jsx +0 -302
  550. package/lib/__tests__/ThemeProvider.test.d.ts +0 -1
  551. package/lib/__tests__/ThemeProvider.test.js +0 -444
  552. package/lib/__tests__/ThemeProvider.test.jsx +0 -314
  553. package/lib/__tests__/Timeline.test.d.ts +0 -1
  554. package/lib/__tests__/Timeline.test.js +0 -75
  555. package/lib/__tests__/Timeline.test.jsx +0 -51
  556. package/lib/__tests__/Token.test.d.ts +0 -1
  557. package/lib/__tests__/Token.test.js +0 -180
  558. package/lib/__tests__/Token.test.jsx +0 -93
  559. package/lib/__tests__/Tooltip.test.d.ts +0 -1
  560. package/lib/__tests__/Tooltip.test.js +0 -69
  561. package/lib/__tests__/Tooltip.test.jsx +0 -46
  562. package/lib/__tests__/Truncate.test.d.ts +0 -1
  563. package/lib/__tests__/Truncate.test.js +0 -63
  564. package/lib/__tests__/Truncate.test.jsx +0 -41
  565. package/lib/__tests__/UnderlineNav.test.d.ts +0 -1
  566. package/lib/__tests__/UnderlineNav.test.js +0 -72
  567. package/lib/__tests__/UnderlineNav.test.jsx +0 -53
  568. package/lib/__tests__/UnderlineNavLink.test.d.ts +0 -1
  569. package/lib/__tests__/UnderlineNavLink.test.js +0 -51
  570. package/lib/__tests__/UnderlineNavLink.test.jsx +0 -31
  571. package/lib/__tests__/behaviors/anchoredPosition.test.d.ts +0 -1
  572. package/lib/__tests__/behaviors/anchoredPosition.test.js +0 -243
  573. package/lib/__tests__/behaviors/focusTrap.test.d.ts +0 -1
  574. package/lib/__tests__/behaviors/focusTrap.test.js +0 -234
  575. package/lib/__tests__/behaviors/focusTrap.test.jsx +0 -184
  576. package/lib/__tests__/behaviors/focusZone.test.d.ts +0 -1
  577. package/lib/__tests__/behaviors/focusZone.test.js +0 -570
  578. package/lib/__tests__/behaviors/focusZone.test.jsx +0 -406
  579. package/lib/__tests__/behaviors/iterateFocusableElements.test.d.ts +0 -1
  580. package/lib/__tests__/behaviors/iterateFocusableElements.test.js +0 -55
  581. package/lib/__tests__/behaviors/iterateFocusableElements.test.jsx +0 -58
  582. package/lib/__tests__/behaviors/scrollIntoViewingArea.test.d.ts +0 -1
  583. package/lib/__tests__/behaviors/scrollIntoViewingArea.test.js +0 -155
  584. package/lib/__tests__/filterObject.test.d.ts +0 -1
  585. package/lib/__tests__/filterObject.test.js +0 -51
  586. package/lib/__tests__/hooks/useAnchoredPosition.test.d.ts +0 -1
  587. package/lib/__tests__/hooks/useAnchoredPosition.test.js +0 -54
  588. package/lib/__tests__/hooks/useAnchoredPosition.test.jsx +0 -29
  589. package/lib/__tests__/hooks/useOnEscapePress.test.d.ts +0 -1
  590. package/lib/__tests__/hooks/useOnEscapePress.test.js +0 -32
  591. package/lib/__tests__/hooks/useOnEscapePress.test.jsx +0 -19
  592. package/lib/__tests__/hooks/useOnOutsideClick.test.d.ts +0 -1
  593. package/lib/__tests__/hooks/useOnOutsideClick.test.js +0 -87
  594. package/lib/__tests__/hooks/useOnOutsideClick.test.jsx +0 -63
  595. package/lib/__tests__/hooks/useOpenAndCloseFocus.test.d.ts +0 -1
  596. package/lib/__tests__/hooks/useOpenAndCloseFocus.test.js +0 -60
  597. package/lib/__tests__/hooks/useOpenAndCloseFocus.test.jsx +0 -61
  598. package/lib/__tests__/hooks/useProvidedStateOrCreate.test.d.ts +0 -1
  599. package/lib/__tests__/hooks/useProvidedStateOrCreate.test.js +0 -45
  600. package/lib/__tests__/hooks/useProvidedStateOrCreate.test.jsx +0 -56
  601. package/lib/__tests__/theme.test.d.ts +0 -1
  602. package/lib/__tests__/theme.test.js +0 -35
  603. package/lib/__tests__/themeGet.test.d.ts +0 -1
  604. package/lib/__tests__/themeGet.test.js +0 -14
  605. package/lib/__tests__/useSafeTimeout.test.d.ts +0 -1
  606. package/lib/__tests__/useSafeTimeout.test.js +0 -45
  607. package/lib/__tests__/useSafeTimeout.test.jsx +0 -36
  608. package/lib/__tests__/utils/createSlots.test.d.ts +0 -1
  609. package/lib/__tests__/utils/createSlots.test.js +0 -75
  610. package/lib/__tests__/utils/createSlots.test.jsx +0 -57
  611. package/lib/stories/ActionList.stories.js +0 -454
  612. package/lib/stories/ActionList2.stories.js +0 -909
  613. package/lib/stories/ActionMenu.stories.js +0 -350
  614. package/lib/stories/AnchoredOverlay.stories.js +0 -127
  615. package/lib/stories/Autocomplete.stories.js +0 -619
  616. package/lib/stories/AvatarStack.stories.js +0 -49
  617. package/lib/stories/Button.stories.js +0 -125
  618. package/lib/stories/ConfirmationDialog.stories.js +0 -111
  619. package/lib/stories/Dialog.stories.js +0 -265
  620. package/lib/stories/DropdownMenu.stories.js +0 -122
  621. package/lib/stories/IssueLabelToken.stories.js +0 -165
  622. package/lib/stories/NewButton.stories.js +0 -230
  623. package/lib/stories/Overlay.stories.js +0 -204
  624. package/lib/stories/Portal.stories.js +0 -104
  625. package/lib/stories/ProfileToken.stories.js +0 -162
  626. package/lib/stories/SelectPanel.stories.js +0 -399
  627. package/lib/stories/TextInput.stories.js +0 -144
  628. package/lib/stories/TextInputWithTokens.stories.js +0 -252
  629. package/lib/stories/ThemeProvider.stories.js +0 -102
  630. package/lib/stories/Token.stories.js +0 -176
  631. package/lib/stories/useAnchoredPosition.stories.js +0 -351
  632. package/lib/stories/useFocusTrap.stories.js +0 -356
  633. package/lib/stories/useFocusZone.stories.js +0 -599
  634. package/lib-esm/__tests__/ActionList.test.d.ts +0 -1
  635. package/lib-esm/__tests__/ActionList.test.js +0 -57
  636. package/lib-esm/__tests__/ActionList.types.test.d.ts +0 -6
  637. package/lib-esm/__tests__/ActionList.types.test.js +0 -45
  638. package/lib-esm/__tests__/ActionList2.test.d.ts +0 -1
  639. package/lib-esm/__tests__/ActionList2.test.js +0 -41
  640. package/lib-esm/__tests__/ActionMenu.test.d.ts +0 -1
  641. package/lib-esm/__tests__/ActionMenu.test.js +0 -139
  642. package/lib-esm/__tests__/AnchoredOverlay.test.d.ts +0 -1
  643. package/lib-esm/__tests__/AnchoredOverlay.test.js +0 -136
  644. package/lib-esm/__tests__/Autocomplete.test.d.ts +0 -1
  645. package/lib-esm/__tests__/Autocomplete.test.js +0 -494
  646. package/lib-esm/__tests__/Avatar.test.d.ts +0 -1
  647. package/lib-esm/__tests__/Avatar.test.js +0 -56
  648. package/lib-esm/__tests__/AvatarStack.test.d.ts +0 -1
  649. package/lib-esm/__tests__/AvatarStack.test.js +0 -58
  650. package/lib-esm/__tests__/BorderBox.test.d.ts +0 -1
  651. package/lib-esm/__tests__/BorderBox.test.js +0 -47
  652. package/lib-esm/__tests__/Box.test.d.ts +0 -1
  653. package/lib-esm/__tests__/Box.test.js +0 -67
  654. package/lib-esm/__tests__/BranchName.test.d.ts +0 -1
  655. package/lib-esm/__tests__/BranchName.test.js +0 -26
  656. package/lib-esm/__tests__/Breadcrumbs.test.d.ts +0 -1
  657. package/lib-esm/__tests__/Breadcrumbs.test.js +0 -27
  658. package/lib-esm/__tests__/BreadcrumbsItem.test.d.ts +0 -1
  659. package/lib-esm/__tests__/BreadcrumbsItem.test.js +0 -39
  660. package/lib-esm/__tests__/Button.test.d.ts +0 -1
  661. package/lib-esm/__tests__/Button.test.js +0 -133
  662. package/lib-esm/__tests__/Caret.test.d.ts +0 -1
  663. package/lib-esm/__tests__/Caret.test.js +0 -42
  664. package/lib-esm/__tests__/CircleBadge.test.d.ts +0 -1
  665. package/lib-esm/__tests__/CircleBadge.test.js +0 -70
  666. package/lib-esm/__tests__/CircleOcticon.test.d.ts +0 -1
  667. package/lib-esm/__tests__/CircleOcticon.test.js +0 -59
  668. package/lib-esm/__tests__/ConfirmationDialog.test.d.ts +0 -1
  669. package/lib-esm/__tests__/ConfirmationDialog.test.js +0 -113
  670. package/lib-esm/__tests__/CounterLabel.test.d.ts +0 -1
  671. package/lib-esm/__tests__/CounterLabel.test.js +0 -47
  672. package/lib-esm/__tests__/Details.test.d.ts +0 -1
  673. package/lib-esm/__tests__/Details.test.js +0 -107
  674. package/lib-esm/__tests__/Dialog.test.d.ts +0 -1
  675. package/lib-esm/__tests__/Dialog.test.js +0 -171
  676. package/lib-esm/__tests__/Dropdown.test.d.ts +0 -1
  677. package/lib-esm/__tests__/Dropdown.test.js +0 -53
  678. package/lib-esm/__tests__/DropdownMenu.test.d.ts +0 -1
  679. package/lib-esm/__tests__/DropdownMenu.test.js +0 -137
  680. package/lib-esm/__tests__/FilterList.test.d.ts +0 -1
  681. package/lib-esm/__tests__/FilterList.test.js +0 -26
  682. package/lib-esm/__tests__/FilterListItem.test.d.ts +0 -1
  683. package/lib-esm/__tests__/FilterListItem.test.js +0 -36
  684. package/lib-esm/__tests__/FilteredSearch.test.d.ts +0 -1
  685. package/lib-esm/__tests__/FilteredSearch.test.js +0 -26
  686. package/lib-esm/__tests__/Flash.test.d.ts +0 -1
  687. package/lib-esm/__tests__/Flash.test.js +0 -51
  688. package/lib-esm/__tests__/Flex.test.d.ts +0 -1
  689. package/lib-esm/__tests__/Flex.test.js +0 -64
  690. package/lib-esm/__tests__/FormGroup.test.d.ts +0 -1
  691. package/lib-esm/__tests__/FormGroup.test.js +0 -44
  692. package/lib-esm/__tests__/Grid.test.d.ts +0 -1
  693. package/lib-esm/__tests__/Grid.test.js +0 -94
  694. package/lib-esm/__tests__/Header.test.d.ts +0 -1
  695. package/lib-esm/__tests__/Header.test.js +0 -48
  696. package/lib-esm/__tests__/Heading.test.d.ts +0 -1
  697. package/lib-esm/__tests__/Heading.test.js +0 -99
  698. package/lib-esm/__tests__/KeyPaths.types.test.d.ts +0 -11
  699. package/lib-esm/__tests__/KeyPaths.types.test.js +0 -3
  700. package/lib-esm/__tests__/Label.test.d.ts +0 -1
  701. package/lib-esm/__tests__/Label.test.js +0 -36
  702. package/lib-esm/__tests__/LabelGroup.test.d.ts +0 -1
  703. package/lib-esm/__tests__/LabelGroup.test.js +0 -26
  704. package/lib-esm/__tests__/Link.test.d.ts +0 -1
  705. package/lib-esm/__tests__/Link.test.js +0 -60
  706. package/lib-esm/__tests__/Merge.types.test.d.ts +0 -30
  707. package/lib-esm/__tests__/Merge.types.test.js +0 -14
  708. package/lib-esm/__tests__/NewButton.test.d.ts +0 -1
  709. package/lib-esm/__tests__/NewButton.test.js +0 -84
  710. package/lib-esm/__tests__/Overlay.test.d.ts +0 -1
  711. package/lib-esm/__tests__/Overlay.test.js +0 -123
  712. package/lib-esm/__tests__/Pagehead.test.d.ts +0 -1
  713. package/lib-esm/__tests__/Pagehead.test.js +0 -26
  714. package/lib-esm/__tests__/Pagination/Pagination.test.d.ts +0 -1
  715. package/lib-esm/__tests__/Pagination/Pagination.test.js +0 -35
  716. package/lib-esm/__tests__/Pagination/PaginationModel.test.d.ts +0 -1
  717. package/lib-esm/__tests__/Pagination/PaginationModel.test.js +0 -182
  718. package/lib-esm/__tests__/PointerBox.test.d.ts +0 -1
  719. package/lib-esm/__tests__/PointerBox.test.js +0 -36
  720. package/lib-esm/__tests__/Popover.test.d.ts +0 -1
  721. package/lib-esm/__tests__/Popover.test.js +0 -53
  722. package/lib-esm/__tests__/Portal.test.d.ts +0 -1
  723. package/lib-esm/__tests__/Portal.test.js +0 -104
  724. package/lib-esm/__tests__/Position.test.d.ts +0 -1
  725. package/lib-esm/__tests__/Position.test.js +0 -133
  726. package/lib-esm/__tests__/ProgressBar.test.d.ts +0 -1
  727. package/lib-esm/__tests__/ProgressBar.test.js +0 -58
  728. package/lib-esm/__tests__/SelectMenu.test.d.ts +0 -1
  729. package/lib-esm/__tests__/SelectMenu.test.js +0 -145
  730. package/lib-esm/__tests__/SelectPanel.test.d.ts +0 -1
  731. package/lib-esm/__tests__/SelectPanel.test.js +0 -65
  732. package/lib-esm/__tests__/SideNav.test.d.ts +0 -1
  733. package/lib-esm/__tests__/SideNav.test.js +0 -60
  734. package/lib-esm/__tests__/Spinner.test.d.ts +0 -1
  735. package/lib-esm/__tests__/Spinner.test.js +0 -43
  736. package/lib-esm/__tests__/StateLabel.test.d.ts +0 -1
  737. package/lib-esm/__tests__/StateLabel.test.js +0 -61
  738. package/lib-esm/__tests__/StyledOcticon.test.d.ts +0 -1
  739. package/lib-esm/__tests__/StyledOcticon.test.js +0 -29
  740. package/lib-esm/__tests__/SubNav.test.d.ts +0 -1
  741. package/lib-esm/__tests__/SubNav.test.js +0 -50
  742. package/lib-esm/__tests__/SubNavLink.test.d.ts +0 -1
  743. package/lib-esm/__tests__/SubNavLink.test.js +0 -39
  744. package/lib-esm/__tests__/TabNav.test.d.ts +0 -1
  745. package/lib-esm/__tests__/TabNav.test.js +0 -39
  746. package/lib-esm/__tests__/Text.test.d.ts +0 -1
  747. package/lib-esm/__tests__/Text.test.js +0 -93
  748. package/lib-esm/__tests__/TextInput.test.d.ts +0 -1
  749. package/lib-esm/__tests__/TextInput.test.js +0 -68
  750. package/lib-esm/__tests__/TextInputWithTokens.test.d.ts +0 -1
  751. package/lib-esm/__tests__/TextInputWithTokens.test.js +0 -511
  752. package/lib-esm/__tests__/ThemeProvider.test.d.ts +0 -1
  753. package/lib-esm/__tests__/ThemeProvider.test.js +0 -408
  754. package/lib-esm/__tests__/Timeline.test.d.ts +0 -1
  755. package/lib-esm/__tests__/Timeline.test.js +0 -65
  756. package/lib-esm/__tests__/Token.test.d.ts +0 -1
  757. package/lib-esm/__tests__/Token.test.js +0 -166
  758. package/lib-esm/__tests__/Tooltip.test.d.ts +0 -1
  759. package/lib-esm/__tests__/Tooltip.test.js +0 -59
  760. package/lib-esm/__tests__/Truncate.test.d.ts +0 -1
  761. package/lib-esm/__tests__/Truncate.test.js +0 -53
  762. package/lib-esm/__tests__/UnderlineNav.test.d.ts +0 -1
  763. package/lib-esm/__tests__/UnderlineNav.test.js +0 -60
  764. package/lib-esm/__tests__/UnderlineNavLink.test.d.ts +0 -1
  765. package/lib-esm/__tests__/UnderlineNavLink.test.js +0 -41
  766. package/lib-esm/__tests__/behaviors/anchoredPosition.test.d.ts +0 -1
  767. package/lib-esm/__tests__/behaviors/anchoredPosition.test.js +0 -388
  768. package/lib-esm/__tests__/behaviors/focusTrap.test.d.ts +0 -1
  769. package/lib-esm/__tests__/behaviors/focusTrap.test.js +0 -227
  770. package/lib-esm/__tests__/behaviors/focusZone.test.d.ts +0 -1
  771. package/lib-esm/__tests__/behaviors/focusZone.test.js +0 -487
  772. package/lib-esm/__tests__/behaviors/iterateFocusableElements.test.d.ts +0 -1
  773. package/lib-esm/__tests__/behaviors/iterateFocusableElements.test.js +0 -48
  774. package/lib-esm/__tests__/behaviors/scrollIntoViewingArea.test.d.ts +0 -1
  775. package/lib-esm/__tests__/behaviors/scrollIntoViewingArea.test.js +0 -224
  776. package/lib-esm/__tests__/filterObject.test.d.ts +0 -1
  777. package/lib-esm/__tests__/filterObject.test.js +0 -27
  778. package/lib-esm/__tests__/hooks/useAnchoredPosition.test.d.ts +0 -1
  779. package/lib-esm/__tests__/hooks/useAnchoredPosition.test.js +0 -46
  780. package/lib-esm/__tests__/hooks/useOnEscapePress.test.d.ts +0 -1
  781. package/lib-esm/__tests__/hooks/useOnEscapePress.test.js +0 -23
  782. package/lib-esm/__tests__/hooks/useOnOutsideClick.test.d.ts +0 -1
  783. package/lib-esm/__tests__/hooks/useOnOutsideClick.test.js +0 -68
  784. package/lib-esm/__tests__/hooks/useOpenAndCloseFocus.test.d.ts +0 -1
  785. package/lib-esm/__tests__/hooks/useOpenAndCloseFocus.test.js +0 -52
  786. package/lib-esm/__tests__/hooks/useProvidedStateOrCreate.test.d.ts +0 -1
  787. package/lib-esm/__tests__/hooks/useProvidedStateOrCreate.test.js +0 -36
  788. package/lib-esm/__tests__/theme.test.d.ts +0 -1
  789. package/lib-esm/__tests__/theme.test.js +0 -33
  790. package/lib-esm/__tests__/themeGet.test.d.ts +0 -1
  791. package/lib-esm/__tests__/themeGet.test.js +0 -22
  792. package/lib-esm/__tests__/useSafeTimeout.test.d.ts +0 -1
  793. package/lib-esm/__tests__/useSafeTimeout.test.js +0 -39
  794. package/lib-esm/__tests__/utils/createSlots.test.d.ts +0 -1
  795. package/lib-esm/__tests__/utils/createSlots.test.js +0 -67
  796. package/lib-esm/stories/ActionList.stories.js +0 -395
  797. package/lib-esm/stories/ActionList2.stories.js +0 -797
  798. package/lib-esm/stories/ActionMenu.stories.js +0 -305
  799. package/lib-esm/stories/AnchoredOverlay.stories.js +0 -101
  800. package/lib-esm/stories/Autocomplete.stories.js +0 -560
  801. package/lib-esm/stories/AvatarStack.stories.js +0 -32
  802. package/lib-esm/stories/Button.stories.js +0 -86
  803. package/lib-esm/stories/ConfirmationDialog.stories.js +0 -86
  804. package/lib-esm/stories/Dialog.stories.js +0 -240
  805. package/lib-esm/stories/DropdownMenu.stories.js +0 -94
  806. package/lib-esm/stories/IssueLabelToken.stories.js +0 -139
  807. package/lib-esm/stories/NewButton.stories.js +0 -178
  808. package/lib-esm/stories/Overlay.stories.js +0 -173
  809. package/lib-esm/stories/Portal.stories.js +0 -68
  810. package/lib-esm/stories/ProfileToken.stories.js +0 -136
  811. package/lib-esm/stories/SelectPanel.stories.js +0 -334
  812. package/lib-esm/stories/TextInput.stories.js +0 -117
  813. package/lib-esm/stories/TextInputWithTokens.stories.js +0 -210
  814. package/lib-esm/stories/ThemeProvider.stories.js +0 -83
  815. package/lib-esm/stories/Token.stories.js +0 -146
  816. package/lib-esm/stories/useAnchoredPosition.stories.js +0 -313
  817. package/lib-esm/stories/useFocusTrap.stories.js +0 -309
  818. package/lib-esm/stories/useFocusZone.stories.js +0 -554
  819. package/migrating.md +0 -250
  820. package/now.json +0 -17
  821. package/package-lock.json +0 -66509
  822. package/rollup.config.js +0 -36
  823. package/script/build +0 -21
  824. package/script/build-storybook +0 -10
  825. package/script/setup +0 -12
  826. package/src/ActionList/Divider.tsx +0 -25
  827. package/src/ActionList/Group.tsx +0 -45
  828. package/src/ActionList/Header.tsx +0 -74
  829. package/src/ActionList/Item.tsx +0 -480
  830. package/src/ActionList/List.tsx +0 -258
  831. package/src/ActionList/index.ts +0 -21
  832. package/src/ActionList2/Description.tsx +0 -52
  833. package/src/ActionList2/Divider.tsx +0 -24
  834. package/src/ActionList2/Group.tsx +0 -103
  835. package/src/ActionList2/Header.tsx +0 -58
  836. package/src/ActionList2/Item.tsx +0 -246
  837. package/src/ActionList2/LinkItem.tsx +0 -49
  838. package/src/ActionList2/List.tsx +0 -55
  839. package/src/ActionList2/Selection.tsx +0 -60
  840. package/src/ActionList2/Visuals.tsx +0 -76
  841. package/src/ActionList2/index.ts +0 -39
  842. package/src/ActionMenu.tsx +0 -106
  843. package/src/AnchoredOverlay/AnchoredOverlay.tsx +0 -191
  844. package/src/AnchoredOverlay/index.ts +0 -2
  845. package/src/Autocomplete/Autocomplete.tsx +0 -103
  846. package/src/Autocomplete/AutocompleteContext.tsx +0 -19
  847. package/src/Autocomplete/AutocompleteInput.tsx +0 -179
  848. package/src/Autocomplete/AutocompleteMenu.tsx +0 -341
  849. package/src/Autocomplete/AutocompleteOverlay.tsx +0 -68
  850. package/src/Autocomplete/index.ts +0 -2
  851. package/src/Avatar.tsx +0 -46
  852. package/src/AvatarPair.tsx +0 -35
  853. package/src/AvatarStack.tsx +0 -159
  854. package/src/BaseStyles.tsx +0 -53
  855. package/src/BorderBox.tsx +0 -18
  856. package/src/Box.tsx +0 -54
  857. package/src/BranchName.tsx +0 -19
  858. package/src/Breadcrumbs.tsx +0 -101
  859. package/src/Button/Button.tsx +0 -40
  860. package/src/Button/ButtonBase.tsx +0 -43
  861. package/src/Button/ButtonClose.tsx +0 -40
  862. package/src/Button/ButtonDanger.tsx +0 -43
  863. package/src/Button/ButtonGroup.tsx +0 -55
  864. package/src/Button/ButtonInvisible.tsx +0 -32
  865. package/src/Button/ButtonOutline.tsx +0 -43
  866. package/src/Button/ButtonPrimary.tsx +0 -41
  867. package/src/Button/ButtonStyles.tsx +0 -36
  868. package/src/Button/ButtonTableList.tsx +0 -58
  869. package/src/Button/index.ts +0 -16
  870. package/src/Caret.tsx +0 -133
  871. package/src/CircleBadge.tsx +0 -55
  872. package/src/CircleOcticon.tsx +0 -37
  873. package/src/CounterLabel.tsx +0 -52
  874. package/src/Details.tsx +0 -23
  875. package/src/Dialog/ConfirmationDialog.tsx +0 -184
  876. package/src/Dialog/Dialog.tsx +0 -433
  877. package/src/Dialog.tsx +0 -149
  878. package/src/Dropdown.tsx +0 -158
  879. package/src/DropdownMenu/DropdownButton.tsx +0 -15
  880. package/src/DropdownMenu/DropdownMenu.tsx +0 -115
  881. package/src/DropdownMenu/index.ts +0 -4
  882. package/src/DropdownStyles.ts +0 -128
  883. package/src/FilterList.tsx +0 -81
  884. package/src/FilteredActionList/FilteredActionList.tsx +0 -142
  885. package/src/FilteredActionList/index.ts +0 -2
  886. package/src/FilteredSearch.tsx +0 -28
  887. package/src/Flash.tsx +0 -77
  888. package/src/Flex.tsx +0 -15
  889. package/src/FormGroup.tsx +0 -27
  890. package/src/Grid.tsx +0 -15
  891. package/src/Header.tsx +0 -84
  892. package/src/Heading.tsx +0 -21
  893. package/src/Label.tsx +0 -75
  894. package/src/LabelGroup.tsx +0 -18
  895. package/src/Link.tsx +0 -46
  896. package/src/NewButton/button-counter.tsx +0 -15
  897. package/src/NewButton/button.tsx +0 -283
  898. package/src/NewButton/index.ts +0 -10
  899. package/src/NewButton/types.ts +0 -36
  900. package/src/Overlay.tsx +0 -198
  901. package/src/Pagehead.tsx +0 -17
  902. package/src/Pagination/Pagination.tsx +0 -214
  903. package/src/Pagination/index.ts +0 -4
  904. package/src/Pagination/model.tsx +0 -187
  905. package/src/PointerBox.tsx +0 -31
  906. package/src/Popover.tsx +0 -236
  907. package/src/Portal/Portal.tsx +0 -97
  908. package/src/Portal/index.ts +0 -5
  909. package/src/Position.tsx +0 -63
  910. package/src/ProgressBar.tsx +0 -52
  911. package/src/SelectMenu/SelectMenu.tsx +0 -125
  912. package/src/SelectMenu/SelectMenuContext.tsx +0 -9
  913. package/src/SelectMenu/SelectMenuDivider.tsx +0 -25
  914. package/src/SelectMenu/SelectMenuFilter.tsx +0 -51
  915. package/src/SelectMenu/SelectMenuFooter.tsx +0 -28
  916. package/src/SelectMenu/SelectMenuHeader.tsx +0 -50
  917. package/src/SelectMenu/SelectMenuItem.tsx +0 -137
  918. package/src/SelectMenu/SelectMenuList.tsx +0 -42
  919. package/src/SelectMenu/SelectMenuLoadingAnimation.tsx +0 -24
  920. package/src/SelectMenu/SelectMenuModal.tsx +0 -121
  921. package/src/SelectMenu/SelectMenuTab.tsx +0 -88
  922. package/src/SelectMenu/SelectMenuTabPanel.tsx +0 -30
  923. package/src/SelectMenu/SelectMenuTabs.tsx +0 -44
  924. package/src/SelectMenu/hooks/useKeyboardNav.js +0 -90
  925. package/src/SelectMenu/index.ts +0 -15
  926. package/src/SelectPanel/SelectPanel.tsx +0 -173
  927. package/src/SelectPanel/index.ts +0 -2
  928. package/src/SideNav.tsx +0 -193
  929. package/src/Spinner.tsx +0 -59
  930. package/src/StateLabel.tsx +0 -114
  931. package/src/StyledOcticon.tsx +0 -24
  932. package/src/SubNav.tsx +0 -129
  933. package/src/TabNav.tsx +0 -77
  934. package/src/Text.tsx +0 -13
  935. package/src/TextInput.tsx +0 -68
  936. package/src/TextInputWithTokens.tsx +0 -351
  937. package/src/ThemeProvider.tsx +0 -176
  938. package/src/Timeline.tsx +0 -141
  939. package/src/Token/AvatarToken.tsx +0 -54
  940. package/src/Token/IssueLabelToken.tsx +0 -150
  941. package/src/Token/Token.tsx +0 -126
  942. package/src/Token/TokenBase.tsx +0 -129
  943. package/src/Token/_RemoveTokenButton.tsx +0 -111
  944. package/src/Token/_TokenTextContainer.tsx +0 -47
  945. package/src/Token/index.ts +0 -3
  946. package/src/Tooltip.tsx +0 -263
  947. package/src/Truncate.tsx +0 -36
  948. package/src/UnderlineNav.tsx +0 -110
  949. package/src/_TextInputWrapper.tsx +0 -113
  950. package/src/_UnstyledTextInput.tsx +0 -19
  951. package/src/__tests__/.eslintrc.json +0 -11
  952. package/src/__tests__/ActionList.test.tsx +0 -53
  953. package/src/__tests__/ActionList.types.test.tsx +0 -51
  954. package/src/__tests__/ActionList2.test.tsx +0 -47
  955. package/src/__tests__/ActionMenu.test.tsx +0 -136
  956. package/src/__tests__/AnchoredOverlay.test.tsx +0 -150
  957. package/src/__tests__/Autocomplete.test.tsx +0 -444
  958. package/src/__tests__/Avatar.test.tsx +0 -44
  959. package/src/__tests__/AvatarStack.test.tsx +0 -48
  960. package/src/__tests__/BorderBox.test.tsx +0 -43
  961. package/src/__tests__/Box.test.tsx +0 -42
  962. package/src/__tests__/BranchName.test.tsx +0 -26
  963. package/src/__tests__/Breadcrumbs.test.tsx +0 -27
  964. package/src/__tests__/BreadcrumbsItem.test.tsx +0 -31
  965. package/src/__tests__/Button.test.tsx +0 -128
  966. package/src/__tests__/Caret.test.tsx +0 -36
  967. package/src/__tests__/CircleBadge.test.tsx +0 -66
  968. package/src/__tests__/CircleOcticon.test.tsx +0 -50
  969. package/src/__tests__/ConfirmationDialog.test.tsx +0 -120
  970. package/src/__tests__/CounterLabel.test.tsx +0 -50
  971. package/src/__tests__/Details.test.tsx +0 -115
  972. package/src/__tests__/Dialog.test.tsx +0 -155
  973. package/src/__tests__/Dropdown.test.tsx +0 -53
  974. package/src/__tests__/DropdownMenu.test.tsx +0 -136
  975. package/src/__tests__/FilterList.test.tsx +0 -26
  976. package/src/__tests__/FilterListItem.test.tsx +0 -31
  977. package/src/__tests__/FilteredSearch.test.tsx +0 -26
  978. package/src/__tests__/Flash.test.tsx +0 -45
  979. package/src/__tests__/Flex.test.tsx +0 -58
  980. package/src/__tests__/FormGroup.test.tsx +0 -38
  981. package/src/__tests__/Grid.test.tsx +0 -82
  982. package/src/__tests__/Header.test.tsx +0 -49
  983. package/src/__tests__/Heading.test.tsx +0 -91
  984. package/src/__tests__/KeyPaths.types.test.ts +0 -14
  985. package/src/__tests__/Label.test.tsx +0 -34
  986. package/src/__tests__/LabelGroup.test.tsx +0 -30
  987. package/src/__tests__/Link.test.tsx +0 -47
  988. package/src/__tests__/Merge.types.test.ts +0 -39
  989. package/src/__tests__/NewButton.test.tsx +0 -70
  990. package/src/__tests__/Overlay.test.tsx +0 -103
  991. package/src/__tests__/Pagehead.test.tsx +0 -23
  992. package/src/__tests__/Pagination/Pagination.test.tsx +0 -30
  993. package/src/__tests__/Pagination/PaginationModel.test.tsx +0 -133
  994. package/src/__tests__/Pagination/__snapshots__/Pagination.test.tsx.snap +0 -184
  995. package/src/__tests__/PointerBox.test.tsx +0 -34
  996. package/src/__tests__/Popover.test.tsx +0 -68
  997. package/src/__tests__/Portal.test.tsx +0 -103
  998. package/src/__tests__/Position.test.tsx +0 -117
  999. package/src/__tests__/ProgressBar.test.tsx +0 -40
  1000. package/src/__tests__/SelectMenu.test.tsx +0 -142
  1001. package/src/__tests__/SelectPanel.test.tsx +0 -63
  1002. package/src/__tests__/SideNav.test.tsx +0 -62
  1003. package/src/__tests__/Spinner.test.tsx +0 -42
  1004. package/src/__tests__/StateLabel.test.tsx +0 -48
  1005. package/src/__tests__/StyledOcticon.test.tsx +0 -26
  1006. package/src/__tests__/SubNav.test.tsx +0 -50
  1007. package/src/__tests__/SubNavLink.test.tsx +0 -31
  1008. package/src/__tests__/TabNav.test.tsx +0 -32
  1009. package/src/__tests__/Text.test.tsx +0 -78
  1010. package/src/__tests__/TextInput.test.tsx +0 -49
  1011. package/src/__tests__/TextInputWithTokens.test.tsx +0 -422
  1012. package/src/__tests__/ThemeProvider.test.tsx +0 -441
  1013. package/src/__tests__/Timeline.test.tsx +0 -58
  1014. package/src/__tests__/Token.test.tsx +0 -118
  1015. package/src/__tests__/Tooltip.test.tsx +0 -52
  1016. package/src/__tests__/Truncate.test.tsx +0 -43
  1017. package/src/__tests__/UnderlineNav.test.tsx +0 -58
  1018. package/src/__tests__/UnderlineNavLink.test.tsx +0 -31
  1019. package/src/__tests__/__snapshots__/ActionList.test.tsx.snap +0 -223
  1020. package/src/__tests__/__snapshots__/ActionList2.test.tsx.snap +0 -14
  1021. package/src/__tests__/__snapshots__/ActionMenu.test.tsx.snap +0 -80
  1022. package/src/__tests__/__snapshots__/AnchoredOverlay.test.tsx.snap +0 -232
  1023. package/src/__tests__/__snapshots__/Autocomplete.test.tsx.snap +0 -3888
  1024. package/src/__tests__/__snapshots__/Avatar.test.tsx.snap +0 -19
  1025. package/src/__tests__/__snapshots__/AvatarStack.test.tsx.snap +0 -377
  1026. package/src/__tests__/__snapshots__/BorderBox.test.tsx.snap +0 -14
  1027. package/src/__tests__/__snapshots__/Box.test.tsx.snap +0 -201
  1028. package/src/__tests__/__snapshots__/BranchName.test.tsx.snap +0 -17
  1029. package/src/__tests__/__snapshots__/Breadcrumbs.test.tsx.snap +0 -29
  1030. package/src/__tests__/__snapshots__/BreadcrumbsItem.test.tsx.snap +0 -79
  1031. package/src/__tests__/__snapshots__/Button.test.tsx.snap +0 -840
  1032. package/src/__tests__/__snapshots__/Caret.test.tsx.snap +0 -373
  1033. package/src/__tests__/__snapshots__/CircleBadge.test.tsx.snap +0 -142
  1034. package/src/__tests__/__snapshots__/CircleOcticon.test.tsx.snap +0 -65
  1035. package/src/__tests__/__snapshots__/ConfirmationDialog.test.tsx.snap +0 -89
  1036. package/src/__tests__/__snapshots__/CounterLabel.test.tsx.snap +0 -22
  1037. package/src/__tests__/__snapshots__/Details.test.tsx.snap +0 -15
  1038. package/src/__tests__/__snapshots__/Dialog.test.tsx.snap +0 -201
  1039. package/src/__tests__/__snapshots__/Dropdown.test.tsx.snap +0 -249
  1040. package/src/__tests__/__snapshots__/DropdownMenu.test.tsx.snap +0 -107
  1041. package/src/__tests__/__snapshots__/FilterList.test.tsx.snap +0 -13
  1042. package/src/__tests__/__snapshots__/FilterListItem.test.tsx.snap +0 -80
  1043. package/src/__tests__/__snapshots__/FilteredSearch.test.tsx.snap +0 -32
  1044. package/src/__tests__/__snapshots__/Flash.test.tsx.snap +0 -32
  1045. package/src/__tests__/__snapshots__/Flex.test.tsx.snap +0 -130
  1046. package/src/__tests__/__snapshots__/FormGroup.test.tsx.snap +0 -25
  1047. package/src/__tests__/__snapshots__/Grid.test.tsx.snap +0 -178
  1048. package/src/__tests__/__snapshots__/Header.test.tsx.snap +0 -79
  1049. package/src/__tests__/__snapshots__/Heading.test.tsx.snap +0 -13
  1050. package/src/__tests__/__snapshots__/Label.test.tsx.snap +0 -74
  1051. package/src/__tests__/__snapshots__/LabelGroup.test.tsx.snap +0 -15
  1052. package/src/__tests__/__snapshots__/Link.test.tsx.snap +0 -213
  1053. package/src/__tests__/__snapshots__/NewButton.test.tsx.snap +0 -305
  1054. package/src/__tests__/__snapshots__/Pagehead.test.tsx.snap +0 -15
  1055. package/src/__tests__/__snapshots__/PointerBox.test.tsx.snap +0 -174
  1056. package/src/__tests__/__snapshots__/Popover.test.tsx.snap +0 -4687
  1057. package/src/__tests__/__snapshots__/Position.test.tsx.snap +0 -44
  1058. package/src/__tests__/__snapshots__/ProgressBar.test.tsx.snap +0 -53
  1059. package/src/__tests__/__snapshots__/SelectMenu.test.tsx.snap +0 -473
  1060. package/src/__tests__/__snapshots__/SelectPanel.test.tsx.snap +0 -124
  1061. package/src/__tests__/__snapshots__/SideNav.test.tsx.snap +0 -143
  1062. package/src/__tests__/__snapshots__/Spinner.test.tsx.snap +0 -33
  1063. package/src/__tests__/__snapshots__/StateLabel.test.tsx.snap +0 -395
  1064. package/src/__tests__/__snapshots__/StyledOcticon.test.tsx.snap +0 -26
  1065. package/src/__tests__/__snapshots__/SubNav.test.tsx.snap +0 -44
  1066. package/src/__tests__/__snapshots__/SubNavLink.test.tsx.snap +0 -199
  1067. package/src/__tests__/__snapshots__/TabNav.test.tsx.snap +0 -58
  1068. package/src/__tests__/__snapshots__/Text.test.tsx.snap +0 -7
  1069. package/src/__tests__/__snapshots__/TextInput.test.tsx.snap +0 -446
  1070. package/src/__tests__/__snapshots__/TextInputWithTokens.test.tsx.snap +0 -6045
  1071. package/src/__tests__/__snapshots__/ThemeProvider.test.tsx.snap +0 -15
  1072. package/src/__tests__/__snapshots__/Timeline.test.tsx.snap +0 -159
  1073. package/src/__tests__/__snapshots__/Token.test.tsx.snap +0 -3811
  1074. package/src/__tests__/__snapshots__/Tooltip.test.tsx.snap +0 -227
  1075. package/src/__tests__/__snapshots__/Truncate.test.tsx.snap +0 -17
  1076. package/src/__tests__/__snapshots__/UnderlineNav.test.tsx.snap +0 -59
  1077. package/src/__tests__/__snapshots__/UnderlineNavLink.test.tsx.snap +0 -130
  1078. package/src/__tests__/behaviors/anchoredPosition.test.ts +0 -295
  1079. package/src/__tests__/behaviors/focusTrap.test.tsx +0 -236
  1080. package/src/__tests__/behaviors/focusZone.test.tsx +0 -549
  1081. package/src/__tests__/behaviors/iterateFocusableElements.test.tsx +0 -61
  1082. package/src/__tests__/behaviors/scrollIntoViewingArea.test.ts +0 -195
  1083. package/src/__tests__/filterObject.test.ts +0 -54
  1084. package/src/__tests__/hooks/useAnchoredPosition.test.tsx +0 -31
  1085. package/src/__tests__/hooks/useOnEscapePress.test.tsx +0 -16
  1086. package/src/__tests__/hooks/useOnOutsideClick.test.tsx +0 -48
  1087. package/src/__tests__/hooks/useOpenAndCloseFocus.test.tsx +0 -48
  1088. package/src/__tests__/hooks/useProvidedStateOrCreate.test.tsx +0 -39
  1089. package/src/__tests__/theme.test.ts +0 -41
  1090. package/src/__tests__/themeGet.test.ts +0 -15
  1091. package/src/__tests__/useSafeTimeout.test.tsx +0 -36
  1092. package/src/__tests__/utils/__snapshots__/createSlots.test.tsx.snap +0 -55
  1093. package/src/__tests__/utils/createSlots.test.tsx +0 -74
  1094. package/src/behaviors/anchoredPosition.ts +0 -442
  1095. package/src/behaviors/focusTrap.ts +0 -184
  1096. package/src/behaviors/focusZone.ts +0 -713
  1097. package/src/behaviors/scrollIntoViewingArea.ts +0 -27
  1098. package/src/constants.ts +0 -62
  1099. package/src/drafts.ts +0 -10
  1100. package/src/hooks/index.ts +0 -11
  1101. package/src/hooks/useAnchoredPosition.ts +0 -54
  1102. package/src/hooks/useCombinedRefs.ts +0 -40
  1103. package/src/hooks/useDetails.tsx +0 -54
  1104. package/src/hooks/useDialog.ts +0 -121
  1105. package/src/hooks/useFocusTrap.ts +0 -80
  1106. package/src/hooks/useFocusZone.ts +0 -64
  1107. package/src/hooks/useOnEscapePress.ts +0 -63
  1108. package/src/hooks/useOnOutsideClick.tsx +0 -82
  1109. package/src/hooks/useOpenAndCloseFocus.ts +0 -32
  1110. package/src/hooks/useOverlay.tsx +0 -34
  1111. package/src/hooks/useProvidedRefOrCreate.ts +0 -14
  1112. package/src/hooks/useProvidedStateOrCreate.ts +0 -27
  1113. package/src/hooks/useRenderForcingRef.ts +0 -22
  1114. package/src/hooks/useResizeObserver.ts +0 -11
  1115. package/src/hooks/useSafeTimeout.ts +0 -38
  1116. package/src/hooks/useScrollFlash.ts +0 -21
  1117. package/src/index.ts +0 -172
  1118. package/src/polyfills/eventListenerSignal.ts +0 -66
  1119. package/src/stories/ActionList.stories.tsx +0 -436
  1120. package/src/stories/ActionList2.stories.tsx +0 -1291
  1121. package/src/stories/ActionMenu.stories.tsx +0 -334
  1122. package/src/stories/AnchoredOverlay.stories.tsx +0 -117
  1123. package/src/stories/Autocomplete.stories.tsx +0 -655
  1124. package/src/stories/AvatarStack.stories.tsx +0 -37
  1125. package/src/stories/Button.stories.tsx +0 -92
  1126. package/src/stories/ConfirmationDialog.stories.tsx +0 -105
  1127. package/src/stories/Dialog.stories.tsx +0 -240
  1128. package/src/stories/DropdownMenu.stories.tsx +0 -84
  1129. package/src/stories/IssueLabelToken.stories.tsx +0 -138
  1130. package/src/stories/NewButton.stories.tsx +0 -201
  1131. package/src/stories/Overlay.stories.tsx +0 -213
  1132. package/src/stories/Portal.stories.tsx +0 -109
  1133. package/src/stories/ProfileToken.stories.tsx +0 -129
  1134. package/src/stories/SelectPanel.stories.tsx +0 -353
  1135. package/src/stories/TextInput.stories.tsx +0 -113
  1136. package/src/stories/TextInputWithTokens.stories.tsx +0 -155
  1137. package/src/stories/ThemeProvider.stories.tsx +0 -104
  1138. package/src/stories/Token.stories.tsx +0 -137
  1139. package/src/stories/useAnchoredPosition.stories.tsx +0 -332
  1140. package/src/stories/useFocusTrap.stories.tsx +0 -400
  1141. package/src/stories/useFocusZone.stories.tsx +0 -663
  1142. package/src/sx.ts +0 -24
  1143. package/src/theme-preval.js +0 -80
  1144. package/src/theme.ts +0 -89
  1145. package/src/utils/create-slots.tsx +0 -96
  1146. package/src/utils/deprecate.tsx +0 -73
  1147. package/src/utils/isNumeric.tsx +0 -4
  1148. package/src/utils/iterateFocusableElements.ts +0 -121
  1149. package/src/utils/ssr.tsx +0 -1
  1150. package/src/utils/test-deprecations.tsx +0 -19
  1151. package/src/utils/test-helpers.tsx +0 -7
  1152. package/src/utils/test-matchers.tsx +0 -109
  1153. package/src/utils/testing.tsx +0 -242
  1154. package/src/utils/theme.js +0 -64
  1155. package/src/utils/types/AriaRole.ts +0 -71
  1156. package/src/utils/types/ComponentProps.ts +0 -13
  1157. package/src/utils/types/Flatten.ts +0 -4
  1158. package/src/utils/types/KeyPaths.ts +0 -10
  1159. package/src/utils/types/MandateProps.ts +0 -19
  1160. package/src/utils/types/Merge.ts +0 -20
  1161. package/src/utils/types/index.ts +0 -5
  1162. package/src/utils/uniqueId.ts +0 -6
  1163. package/src/utils/use-force-update.ts +0 -7
  1164. package/src/utils/useIsomorphicLayoutEffect.ts +0 -10
  1165. package/src/utils/userAgent.ts +0 -7
  1166. package/stats.html +0 -3279
  1167. package/tsconfig.base.json +0 -20
  1168. package/tsconfig.build.json +0 -7
  1169. package/tsconfig.json +0 -7
@@ -1,663 +0,0 @@
1
- import React, {useCallback, useRef, useState} from 'react'
2
- import {Meta} from '@storybook/react'
3
- import styled, {createGlobalStyle} from 'styled-components'
4
-
5
- import {Box, BaseStyles, Button, Flash, theme, ThemeProvider} from '..'
6
- import {Direction, FocusKeys} from '../behaviors/focusZone'
7
- import {themeGet} from '@styled-system/theme-get'
8
- import {useFocusZone} from '../hooks/useFocusZone'
9
- import {useTheme} from '../ThemeProvider'
10
- import {ButtonDanger, ButtonPrimary} from '../Button'
11
-
12
- export default {
13
- title: 'Hooks/useFocusZone',
14
- decorators: [
15
- Story => {
16
- return (
17
- <ThemeProvider theme={theme}>
18
- <BaseStyles>
19
- <Story />
20
- </BaseStyles>
21
- </ThemeProvider>
22
- )
23
- }
24
- ]
25
- } as Meta
26
-
27
- // NOTE: the below styles are solely intended as a visual aid for
28
- // this Storybook story, but they're not recommended for a real site!
29
- const HelperGlobalStyling = createGlobalStyle`
30
- *:focus {
31
- outline: 2px solid ${themeGet('colors.border.info')} !important;
32
- }
33
- `
34
-
35
- const MarginButton = styled(Button)`
36
- margin: ${themeGet('space.1')};
37
- `
38
-
39
- export const BasicFocusZone = () => {
40
- // Display each key press in the top-right corner of the page as a visual aid
41
- const [lastKey, setLastKey] = useState('none')
42
- const reportKey = useCallback((event: React.KeyboardEvent<HTMLDivElement>) => {
43
- setLastKey(event.key)
44
- }, [])
45
-
46
- const [fzEnabled, setFzEnabled] = useState(true)
47
- const {containerRef} = useFocusZone({disabled: !fzEnabled}, [fzEnabled])
48
-
49
- const ToggleButton = fzEnabled ? ButtonDanger : ButtonPrimary
50
- const toggleFz = useCallback(() => {
51
- setFzEnabled(!fzEnabled)
52
- }, [fzEnabled])
53
-
54
- return (
55
- <>
56
- <HelperGlobalStyling />
57
- <Box display="flex" flexDirection="column" alignItems="flex-start" onKeyDownCapture={reportKey}>
58
- <Box position="absolute" right={5} top={2}>
59
- Last key pressed: {lastKey}
60
- </Box>
61
- <ToggleButton mb={3} onClick={toggleFz}>
62
- {fzEnabled ? 'Disable' : 'Enable'} Focus Zone
63
- </ToggleButton>
64
- <MarginButton>Apple</MarginButton>
65
- <MarginButton>Banana</MarginButton>
66
- <MarginButton>Cantaloupe</MarginButton>
67
- <Box
68
- borderColor="gray.5"
69
- ref={containerRef as React.RefObject<HTMLDivElement>}
70
- m={4}
71
- p={4}
72
- borderWidth="1px"
73
- borderStyle="solid"
74
- borderRadius={2}
75
- >
76
- <strong>Use Up Arrow, Down Arrow, Home, and End to move focus within this box.</strong>
77
- <Box display="flex" flexDirection="column" alignItems="flex-start">
78
- <MarginButton>Durian</MarginButton>
79
- <MarginButton>Elderberry</MarginButton>
80
- <MarginButton>Fig</MarginButton>
81
- </Box>
82
- </Box>
83
- <MarginButton>Kiwi</MarginButton>
84
- <MarginButton>Lemon</MarginButton>
85
- <MarginButton>Mango</MarginButton>
86
- </Box>
87
- </>
88
- )
89
- }
90
-
91
- export const FocusOutBehavior = () => {
92
- // Display each key press in the top-right corner of the page as a visual aid
93
- const [lastKey, setLastKey] = useState('none')
94
- const reportKey = useCallback((event: React.KeyboardEvent<HTMLDivElement>) => {
95
- setLastKey(event.key)
96
- }, [])
97
-
98
- const {containerRef: containerRef1} = useFocusZone({
99
- focusOutBehavior: 'stop',
100
- bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd
101
- })
102
- const {containerRef: containerRef2} = useFocusZone({
103
- focusOutBehavior: 'wrap',
104
- bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd
105
- })
106
-
107
- return (
108
- <>
109
- <HelperGlobalStyling />
110
- <Box display="flex" flexDirection="column" alignItems="flex-start" onKeyDownCapture={reportKey}>
111
- <Box position="absolute" right={5} top={2}>
112
- Last key pressed: {lastKey}
113
- </Box>
114
- <MarginButton>Apple</MarginButton>
115
- <MarginButton>Banana</MarginButton>
116
- <MarginButton>Cantaloupe</MarginButton>
117
- <Box
118
- borderColor="gray.5"
119
- ref={containerRef1 as React.RefObject<HTMLDivElement>}
120
- m={4}
121
- p={4}
122
- borderWidth="1px"
123
- borderStyle="solid"
124
- borderRadius={2}
125
- >
126
- <strong>
127
- Use Left Arrow, Right Arrow, Home, and End to move focus within this box. Focus stops at the ends.
128
- </strong>
129
-
130
- <Box display="flex" flexDirection="row" alignItems="flex-start">
131
- <MarginButton>Durian</MarginButton>
132
- <MarginButton>Elderberry</MarginButton>
133
- <MarginButton>Fig</MarginButton>
134
- </Box>
135
- </Box>
136
- <Box
137
- borderColor="gray.5"
138
- ref={containerRef2 as React.RefObject<HTMLDivElement>}
139
- m={4}
140
- p={4}
141
- borderWidth="1px"
142
- borderStyle="solid"
143
- borderRadius={2}
144
- >
145
- <strong>Use Left Arrow, Right Arrow, Home, and End to move focus within this box. Focus is circular.</strong>
146
-
147
- <Box display="flex" flexDirection="row" alignItems="flex-start">
148
- <MarginButton>Grapefruit</MarginButton>
149
- <MarginButton>Honeydew</MarginButton>
150
- <MarginButton>Jackfruit</MarginButton>
151
- </Box>
152
- </Box>
153
- <MarginButton>Kiwi</MarginButton>
154
- <MarginButton>Lemon</MarginButton>
155
- <MarginButton>Mango</MarginButton>
156
- </Box>
157
- </>
158
- )
159
- }
160
-
161
- function getSiblingIndex(element: Element) {
162
- let child: Element | null = element
163
- let i = 0
164
- while ((child = child.previousElementSibling) != null) {
165
- ++i
166
- }
167
- return i
168
- }
169
-
170
- export const CustomFocusMovement = () => {
171
- // Display each key press in the top-right corner of the page as a visual aid
172
- const [lastKey, setLastKey] = useState('none')
173
- const reportKey = useCallback((event: React.KeyboardEvent<HTMLDivElement>) => {
174
- setLastKey(event.key)
175
- }, [])
176
-
177
- const containerRef = useRef<HTMLElement>(null)
178
-
179
- const getNextFocusable = useCallback(
180
- (direction: Direction, from: Element | undefined, event: KeyboardEvent): HTMLElement | undefined => {
181
- const toEnd = direction === 'start' || direction === 'end'
182
- if (from && containerRef.current) {
183
- const currentIndex = getSiblingIndex(from)
184
- let nextIndex = currentIndex
185
- if (['End', 'ArrowRight'].includes(event.key)) {
186
- while (nextIndex % 3 !== 2) {
187
- nextIndex += 1
188
- if (!toEnd) {
189
- break
190
- }
191
- }
192
- }
193
- if (['Home', 'ArrowLeft'].includes(event.key)) {
194
- while (nextIndex % 3 !== 0) {
195
- nextIndex -= 1
196
- if (!toEnd) {
197
- break
198
- }
199
- }
200
- }
201
- if (event.key === 'ArrowUp') {
202
- while (nextIndex - 3 >= 0) {
203
- nextIndex -= 3
204
- if (!toEnd) {
205
- break
206
- }
207
- }
208
- }
209
- if (event.key === 'ArrowDown') {
210
- while (nextIndex + 3 < 9) {
211
- nextIndex += 3
212
- if (!toEnd) {
213
- break
214
- }
215
- }
216
- }
217
- return containerRef.current.children[nextIndex] as HTMLElement
218
- }
219
- },
220
- [containerRef]
221
- )
222
-
223
- useFocusZone({containerRef, getNextFocusable})
224
-
225
- return (
226
- <>
227
- <HelperGlobalStyling />
228
- <Box display="flex" flexDirection="column" alignItems="flex-start" onKeyDownCapture={reportKey}>
229
- <Box position="absolute" right={5} top={2}>
230
- Last key pressed: {lastKey}
231
- </Box>
232
- <MarginButton>Apple</MarginButton>
233
-
234
- <Box borderColor="gray.5" m={4} p={4} borderWidth="1px" borderStyle="solid" borderRadius={2}>
235
- <strong>Use arrow keys to move focus within this box.</strong>
236
- <Box
237
- display="grid"
238
- ref={containerRef as React.RefObject<HTMLDivElement>}
239
- gridTemplateRows="1fr 1fr 1fr"
240
- gridTemplateColumns="1fr 1fr 1fr"
241
- >
242
- <MarginButton>Banana</MarginButton>
243
- <MarginButton>Cantaloupe</MarginButton>
244
- <MarginButton>Durian</MarginButton>
245
- <MarginButton>Elderberry</MarginButton>
246
- <MarginButton>Fig</MarginButton>
247
- <MarginButton>Grapefruit</MarginButton>
248
- <MarginButton>Honeydew</MarginButton>
249
- <MarginButton>Jackfruit</MarginButton>
250
- <MarginButton>Kiwi</MarginButton>
251
- </Box>
252
- </Box>
253
- <MarginButton>Lemon</MarginButton>
254
- <MarginButton>Mango</MarginButton>
255
- </Box>
256
- </>
257
- )
258
- }
259
-
260
- export const FocusInStrategy = () => {
261
- // Display each key press in the top-right corner of the page as a visual aid
262
- const [lastKey, setLastKey] = useState('none')
263
- const reportKey = useCallback((event: React.KeyboardEvent<HTMLDivElement>) => {
264
- setLastKey(event.key)
265
- }, [])
266
-
267
- const {containerRef: firstContainerRef} = useFocusZone({
268
- bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd,
269
- focusInStrategy: 'first'
270
- })
271
-
272
- const {containerRef: closestContainerRef} = useFocusZone({
273
- bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd,
274
- focusInStrategy: 'closest'
275
- })
276
-
277
- const {containerRef: prevContainerRef} = useFocusZone({
278
- bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd,
279
- focusInStrategy: 'previous'
280
- })
281
-
282
- const customContainerRef = useRef<HTMLElement>(null)
283
- const customStrategy = React.useCallback(() => {
284
- if (customContainerRef.current) {
285
- const buttons = Array.from(customContainerRef.current.querySelectorAll('button'))
286
- return buttons[Math.floor(Math.random() * 3)]
287
- }
288
- }, [customContainerRef])
289
-
290
- useFocusZone({
291
- containerRef: customContainerRef,
292
- bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd,
293
- focusInStrategy: customStrategy
294
- })
295
-
296
- return (
297
- <>
298
- <HelperGlobalStyling />
299
- <Box display="flex" flexDirection="column" alignItems="flex-start" onKeyDownCapture={reportKey}>
300
- <Box position="absolute" right={5} top={2}>
301
- Last key pressed: {lastKey}
302
- </Box>
303
- <MarginButton>Apple</MarginButton>
304
- <MarginButton>Banana</MarginButton>
305
- <MarginButton>Cantaloupe</MarginButton>
306
- <Box
307
- borderColor="gray.5"
308
- ref={firstContainerRef as React.RefObject<HTMLDivElement>}
309
- m={4}
310
- p={4}
311
- borderWidth="1px"
312
- borderStyle="solid"
313
- borderRadius={2}
314
- >
315
- <strong>&ldquo;First&rdquo; strategy (focus first focusable element)</strong>
316
- <Box display="flex" flexDirection="row" alignItems="flex-start">
317
- <MarginButton>Banana</MarginButton>
318
- <MarginButton>Cantaloupe</MarginButton>
319
- <MarginButton>Durian</MarginButton>
320
- </Box>
321
- </Box>
322
- <Box
323
- borderColor="gray.5"
324
- ref={closestContainerRef as React.RefObject<HTMLDivElement>}
325
- m={4}
326
- p={4}
327
- borderWidth="1px"
328
- borderStyle="solid"
329
- borderRadius={2}
330
- >
331
- <strong>&ldquo;Closest&rdquo; strategy (focus first or last depending on focus direction)</strong>
332
- <Box display="flex" flexDirection="row" alignItems="flex-start">
333
- <MarginButton>Elderberry</MarginButton>
334
- <MarginButton>Fig</MarginButton>
335
- <MarginButton>Grapefruit</MarginButton>
336
- </Box>
337
- </Box>
338
- <Box
339
- borderColor="gray.5"
340
- ref={prevContainerRef as React.RefObject<HTMLDivElement>}
341
- m={4}
342
- p={4}
343
- borderWidth="1px"
344
- borderStyle="solid"
345
- borderRadius={2}
346
- >
347
- <strong>&ldquo;Previous&rdquo; strategy (most recently focused element)</strong>
348
- <Box display="flex" flexDirection="row" alignItems="flex-start">
349
- <MarginButton>Honeydew</MarginButton>
350
- <MarginButton>Jackfruit</MarginButton>
351
- <MarginButton>Kiwi</MarginButton>
352
- </Box>
353
- </Box>
354
- <Box
355
- borderColor="gray.5"
356
- ref={customContainerRef as React.RefObject<HTMLDivElement>}
357
- m={4}
358
- p={4}
359
- borderWidth="1px"
360
- borderStyle="solid"
361
- borderRadius={2}
362
- >
363
- <strong>&ldquo;Custom&rdquo; strategy (choose randomly for this example)</strong>
364
- <Box display="flex" flexDirection="row" alignItems="flex-start">
365
- <MarginButton>Lemon</MarginButton>
366
- <MarginButton>Mango</MarginButton>
367
- <MarginButton>Nectarine</MarginButton>
368
- </Box>
369
- </Box>
370
- <MarginButton>Orange</MarginButton>
371
- <MarginButton>Papaya</MarginButton>
372
- </Box>
373
- </>
374
- )
375
- }
376
-
377
- export const SpecialSituations = () => {
378
- // Display each key press in the top-right corner of the page as a visual aid
379
- const [lastKey, setLastKey] = useState('none')
380
- const reportKey = useCallback((event: React.KeyboardEvent<HTMLDivElement>) => {
381
- setLastKey(event.key)
382
- }, [])
383
-
384
- const {containerRef: vContainerRef} = useFocusZone({
385
- bindKeys:
386
- FocusKeys.ArrowVertical |
387
- FocusKeys.JK |
388
- FocusKeys.WS |
389
- FocusKeys.Tab |
390
- FocusKeys.PageUpDown |
391
- FocusKeys.HomeAndEnd
392
- })
393
- const {containerRef: hContainerRef} = useFocusZone({focusOutBehavior: 'wrap', bindKeys: FocusKeys.ArrowHorizontal})
394
-
395
- return (
396
- <>
397
- <HelperGlobalStyling />
398
- <Box display="flex" flexDirection="column" alignItems="flex-start" onKeyDownCapture={reportKey}>
399
- <Flash mb={3}>
400
- This story is very esoteric! It only exists to show some of the nuance of the arrow key focus behavior in
401
- different situations. Focus treatment within your component should be evaluated for your particular UX using
402
- the <a href="https://www.w3.org/TR/wai-aria-practices-1.1/#keyboard">ARIA guidelines</a>.
403
- </Flash>
404
- <Box position="absolute" right={5} top={2}>
405
- Last key pressed: {lastKey}
406
- </Box>
407
- <MarginButton>Apple</MarginButton>
408
- <MarginButton>Banana</MarginButton>
409
- <MarginButton>Cantaloupe</MarginButton>
410
- <Box
411
- borderColor="gray.5"
412
- ref={vContainerRef as React.RefObject<HTMLDivElement>}
413
- m={4}
414
- p={4}
415
- borderWidth="1px"
416
- borderStyle="solid"
417
- borderRadius={2}
418
- >
419
- <strong>Bound keys: Up, Down, PageUp, PageDown, W, S, J, K, Home, End, Tab</strong>
420
- <Box display="flex" flexDirection="column" alignItems="flex-start">
421
- <input style={{width: '250px'}} type="text" defaultValue="Printable characters won't move focus" />
422
- <MarginButton>Regular button</MarginButton>
423
- <select>
424
- <option>Down arrow invokes dropdown</option>
425
- <option>Unless Cmd (mac)/Ctrl (Windows)</option>
426
- <option>Is held</option>
427
- </select>
428
- <textarea
429
- style={{width: '250px', height: '95px'}}
430
- defaultValue="Up/Down only works when at beginning/end. PageUp and PageDown completely disabled. Printable characters will never move focus."
431
- ></textarea>
432
- </Box>
433
- </Box>
434
- <Box
435
- borderColor="gray.5"
436
- ref={hContainerRef as React.RefObject<HTMLDivElement>}
437
- m={4}
438
- p={4}
439
- borderWidth="1px"
440
- borderStyle="solid"
441
- borderRadius={2}
442
- >
443
- <strong>Use Left Arrow and Right Arrow to move focus within this box. Focus is circular.</strong>
444
-
445
- <Box display="flex" flexDirection="row" alignItems="center">
446
- <MarginButton>Grapefruit</MarginButton>
447
- <input
448
- style={{width: '300px'}}
449
- type="text"
450
- defaultValue="Left/Right only work at beginning/end of input."
451
- />
452
- <MarginButton>Jackfruit</MarginButton>
453
- </Box>
454
- </Box>
455
- <MarginButton>Kiwi</MarginButton>
456
- <MarginButton>Lemon</MarginButton>
457
- <MarginButton>Mango</MarginButton>
458
- </Box>
459
- </>
460
- )
461
- }
462
-
463
- export const ChangingSubtree = () => {
464
- // Display each key press in the top-right corner of the page as a visual aid
465
- const [lastKey, setLastKey] = useState('none')
466
- const reportKey = useCallback((event: React.KeyboardEvent<HTMLDivElement>) => {
467
- setLastKey(event.key)
468
- }, [])
469
-
470
- const {containerRef} = useFocusZone({bindKeys: FocusKeys.ArrowVertical})
471
-
472
- const [buttonCount, setButtonCount] = useState(3)
473
- const removeButton = useCallback(() => {
474
- setButtonCount(buttonCount - 1)
475
- }, [setButtonCount, buttonCount])
476
-
477
- const addButton = useCallback(() => {
478
- setButtonCount(buttonCount + 1)
479
- }, [setButtonCount, buttonCount])
480
-
481
- const buttons: JSX.Element[] = []
482
- for (let i = 0; i < buttonCount; ++i) {
483
- buttons.push(
484
- <div>
485
- <MarginButton key={`button${i}`}>{i + 1}</MarginButton>
486
- </div>
487
- )
488
- }
489
-
490
- return (
491
- <>
492
- <HelperGlobalStyling />
493
- <Box display="flex" flexDirection="column" alignItems="flex-start" onKeyDownCapture={reportKey}>
494
- <Flash mb={3}>
495
- This story demonstrates that focusZone is consistent even when the container&rsquo;s subtree changes.
496
- </Flash>
497
- <Box position="absolute" right={5} top={2}>
498
- Last key pressed: {lastKey}
499
- </Box>
500
- <MarginButton>Apple</MarginButton>
501
- <MarginButton>Banana</MarginButton>
502
- <MarginButton>Cantaloupe</MarginButton>
503
- <Box
504
- borderColor="gray.5"
505
- ref={containerRef as React.RefObject<HTMLDivElement>}
506
- m={4}
507
- p={4}
508
- borderWidth="1px"
509
- borderStyle="solid"
510
- borderRadius={2}
511
- >
512
- <strong>Bound keys: Arrow Up and Arrow Down</strong>
513
- <Box display="flex" flexDirection="column" alignItems="flex-start">
514
- {buttons}
515
- </Box>
516
- </Box>
517
- <Box display="flex" flexDirection="row">
518
- <MarginButton onClick={removeButton}>Remove Button</MarginButton>
519
- <MarginButton onClick={addButton}>Add Button</MarginButton>
520
- </Box>
521
- </Box>
522
- </>
523
- )
524
- }
525
-
526
- export const NestedZones = () => {
527
- // Display each key press in the top-right corner of the page as a visual aid
528
- const [lastKey, setLastKey] = useState('none')
529
- const reportKey = useCallback((event: React.KeyboardEvent<HTMLDivElement>) => {
530
- setLastKey(event.key)
531
- }, [])
532
-
533
- const outerContainerRef = useRef<HTMLElement>(null)
534
- const innerContainerRef = useRef<HTMLElement>(null)
535
-
536
- useFocusZone({
537
- containerRef: outerContainerRef,
538
- bindKeys: FocusKeys.ArrowVertical
539
- })
540
-
541
- useFocusZone({
542
- containerRef: innerContainerRef,
543
- bindKeys: FocusKeys.ArrowHorizontal
544
- })
545
-
546
- return (
547
- <>
548
- <HelperGlobalStyling />
549
- <Box display="flex" flexDirection="column" alignItems="flex-start" onKeyDownCapture={reportKey}>
550
- <Box position="absolute" right={5} top={2}>
551
- Last key pressed: {lastKey}
552
- </Box>
553
- <MarginButton>Apple</MarginButton>
554
- <MarginButton>Banana</MarginButton>
555
- <Box
556
- borderColor="gray.5"
557
- m={4}
558
- p={4}
559
- ref={outerContainerRef as React.RefObject<HTMLDivElement>}
560
- borderWidth="1px"
561
- borderStyle="solid"
562
- borderRadius={2}
563
- >
564
- <strong>Bound keys: Arrow Up and Arrow Down</strong>
565
- <br />
566
- <MarginButton>Cantaloupe</MarginButton>
567
- <Box
568
- borderColor="gray.5"
569
- m={4}
570
- p={4}
571
- ref={innerContainerRef as React.RefObject<HTMLDivElement>}
572
- borderWidth="1px"
573
- borderStyle="solid"
574
- borderRadius={2}
575
- >
576
- <strong>Additional Bound keys: Arrow Left and Arrow Right</strong>
577
- <Box display="flex" id="list" flexDirection="column" alignItems="flex-start">
578
- <MarginButton>Durian</MarginButton>
579
- <MarginButton>Elderberry</MarginButton>
580
- <MarginButton>Fig</MarginButton>
581
- <MarginButton>Grapefruit</MarginButton>
582
- </Box>
583
- </Box>
584
- <MarginButton>Honeydew</MarginButton>
585
- </Box>
586
- <MarginButton>Jackfruit</MarginButton>
587
- <MarginButton>Kiwi</MarginButton>
588
- </Box>
589
- </>
590
- )
591
- }
592
-
593
- export const ActiveDescendant = () => {
594
- // Display each key press in the top-right corner of the page as a visual aid
595
- const [lastKey, setLastKey] = useState('none')
596
- const reportKey = useCallback((event: React.KeyboardEvent<HTMLDivElement>) => {
597
- setLastKey(event.key)
598
- }, [])
599
-
600
- const containerRef = useRef<HTMLElement>(null)
601
- const controllingElementRef = useRef<HTMLElement>(null)
602
- const {theme: themeFromContext} = useTheme()
603
-
604
- useFocusZone({
605
- containerRef,
606
- activeDescendantFocus: controllingElementRef,
607
- bindKeys: FocusKeys.ArrowVertical,
608
- onActiveDescendantChanged: (current, previous) => {
609
- if (current) {
610
- current.style.outline = `2px solid ${themeFromContext?.colors.border.info}`
611
- }
612
- if (previous) {
613
- previous.style.outline = ''
614
- }
615
- },
616
- focusableElementFilter: elem => elem instanceof HTMLButtonElement
617
- })
618
-
619
- return (
620
- <>
621
- <HelperGlobalStyling />
622
- <Box display="flex" flexDirection="column" alignItems="flex-start" onKeyDownCapture={reportKey}>
623
- <Flash mb={3}>
624
- This story demonstrates using the `aria-activedescendant` pattern for managing both a focused element and an
625
- active element. Below, you can focus the input box then use the up/down arrow keys to change the active
626
- descendant (dark blue outline).
627
- </Flash>
628
- <Box position="absolute" right={5} top={2}>
629
- Last key pressed: {lastKey}
630
- </Box>
631
- <MarginButton>Apple</MarginButton>
632
- <MarginButton>Banana</MarginButton>
633
- <MarginButton>Cantaloupe</MarginButton>
634
- <Box borderColor="gray.5" m={4} p={4} borderWidth="1px" borderStyle="solid" borderRadius={2}>
635
- <strong>Bound keys: Arrow Up and Arrow Down</strong>
636
- <Box display="flex" flexDirection="column" alignItems="flex-start">
637
- <input
638
- ref={controllingElementRef as React.RefObject<HTMLInputElement>}
639
- type="text"
640
- defaultValue="Focus remains here."
641
- aria-controls="list"
642
- />
643
- <Box
644
- display="flex"
645
- id="list"
646
- flexDirection="column"
647
- alignItems="flex-start"
648
- ref={containerRef as React.RefObject<HTMLDivElement>}
649
- >
650
- <MarginButton>Durian</MarginButton>
651
- <MarginButton>Elderberry</MarginButton>
652
- <MarginButton>Fig</MarginButton>
653
- <MarginButton>Grapefruit</MarginButton>
654
- </Box>
655
- </Box>
656
- </Box>
657
- <MarginButton>Honeydew</MarginButton>
658
- <MarginButton>Jackfruit</MarginButton>
659
- <MarginButton>Kiwi</MarginButton>
660
- </Box>
661
- </>
662
- )
663
- }
package/src/sx.ts DELETED
@@ -1,24 +0,0 @@
1
- import css, {SystemCssProperties, SystemStyleObject} from '@styled-system/css'
2
- import {ThemeColorPaths, ThemeShadowPaths} from './theme'
3
- import {ColorProps, ShadowProps} from 'styled-system'
4
- import merge from 'deepmerge'
5
-
6
- export type BetterCssProperties = {
7
- [K in keyof SystemCssProperties]: K extends keyof ColorProps
8
- ? ThemeColorPaths | SystemCssProperties[K]
9
- : K extends keyof ShadowProps
10
- ? ThemeShadowPaths | SystemCssProperties[K]
11
- : SystemCssProperties[K]
12
- }
13
-
14
- export type BetterSystemStyleObject = BetterCssProperties | SystemStyleObject
15
-
16
- export interface SxProp {
17
- sx?: BetterSystemStyleObject
18
- }
19
-
20
- const sx = (props: SxProp) => css(props.sx)
21
-
22
- export default sx
23
-
24
- export {merge}