@primer/components 31.0.0-rc.ee65b7f1 → 31.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (817) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/browser.esm.js +33 -28
  3. package/dist/browser.esm.js.map +1 -1
  4. package/dist/browser.umd.js +13 -8
  5. package/dist/browser.umd.js.map +1 -1
  6. package/lib/ActionList/Item.d.ts +6 -0
  7. package/lib/ActionList/Item.js +8 -4
  8. package/lib/Button/Button.js +1 -1
  9. package/lib/Button/ButtonInvisible.js +1 -1
  10. package/lib/Button/ButtonTableList.js +1 -1
  11. package/lib/Pagination/Pagination.js +1 -1
  12. package/lib/_TextInputWrapper.js +1 -1
  13. package/lib-esm/ActionList/Item.d.ts +6 -0
  14. package/lib-esm/ActionList/Item.js +8 -4
  15. package/lib-esm/Button/Button.js +1 -1
  16. package/lib-esm/Button/ButtonInvisible.js +1 -1
  17. package/lib-esm/Button/ButtonTableList.js +1 -1
  18. package/lib-esm/Pagination/Pagination.js +1 -1
  19. package/lib-esm/_TextInputWrapper.js +1 -1
  20. package/package.json +1 -1
  21. package/.changeset/README.md +0 -8
  22. package/.changeset/config.json +0 -10
  23. package/.devcontainer/devcontainer.json +0 -8
  24. package/.eslintrc.json +0 -137
  25. package/.github/ISSUE_TEMPLATE/bug_report.md +0 -38
  26. package/.github/ISSUE_TEMPLATE/new_component_proposal_template.md +0 -41
  27. package/.github/dependabot.yml +0 -18
  28. package/.github/pull_request_template.md +0 -18
  29. package/.github/workflows/ci.yml +0 -31
  30. package/.github/workflows/deploy_preview.yml +0 -47
  31. package/.github/workflows/deploy_production.yml +0 -70
  32. package/.github/workflows/release.yml +0 -35
  33. package/.github/workflows/release_canary.yml +0 -70
  34. package/.github/workflows/release_candidate.yml +0 -60
  35. package/.github/workflows/size.yml +0 -13
  36. package/.github/workflows/stale.yml +0 -26
  37. package/.gitignore +0 -10
  38. package/.npmrc +0 -4
  39. package/.nvmrc +0 -1
  40. package/.storybook/main.js +0 -11
  41. package/.storybook/preview.js +0 -113
  42. package/.vscode/launch.json +0 -21
  43. package/.vscode/settings.json +0 -13
  44. package/@types/@styled-system/index.d.ts +0 -0
  45. package/@types/@styled-system/prop-types/index.d.ts +0 -1
  46. package/@types/@styled-system/props/index.d.ts +0 -1
  47. package/@types/jest-styled-components/index.d.ts +0 -1
  48. package/CODEOWNERS +0 -2
  49. package/babel-defines.js +0 -13
  50. package/babel.config.js +0 -39
  51. package/contributor-docs/CODE_OF_CONDUCT.md +0 -76
  52. package/contributor-docs/CONTRIBUTING.md +0 -274
  53. package/contributor-docs/adrs/adr-001-typescript.md +0 -23
  54. package/contributor-docs/adrs/adr-002-behavior-isolation.md +0 -108
  55. package/contributor-docs/behaviors.md +0 -132
  56. package/contributor-docs/component-contents-api-patterns.md +0 -316
  57. package/contributor-docs/principles.md +0 -39
  58. package/docs/.eslintrc +0 -0
  59. package/docs/.gitignore +0 -91
  60. package/docs/components/PropsList.js +0 -5
  61. package/docs/components/State.js +0 -9
  62. package/docs/components/constants.js +0 -34
  63. package/docs/components/index.js +0 -2
  64. package/docs/content/ActionList.mdx +0 -99
  65. package/docs/content/ActionMenu.mdx +0 -80
  66. package/docs/content/AnchoredOverlay.mdx +0 -37
  67. package/docs/content/Autocomplete.mdx +0 -627
  68. package/docs/content/Avatar.mdx +0 -33
  69. package/docs/content/AvatarStack.mdx +0 -37
  70. package/docs/content/BorderBox.md +0 -46
  71. package/docs/content/Box.md +0 -74
  72. package/docs/content/BranchName.md +0 -18
  73. package/docs/content/Breadcrumbs.md +0 -52
  74. package/docs/content/Buttons.md +0 -56
  75. package/docs/content/CircleBadge.md +0 -45
  76. package/docs/content/CircleOcticon.md +0 -18
  77. package/docs/content/CounterLabel.md +0 -32
  78. package/docs/content/Details.md +0 -105
  79. package/docs/content/Dialog.md +0 -108
  80. package/docs/content/Dialog2.mdx +0 -179
  81. package/docs/content/Dropdown.md +0 -72
  82. package/docs/content/DropdownMenu.mdx +0 -49
  83. package/docs/content/FilterList.md +0 -44
  84. package/docs/content/FilteredSearch.md +0 -39
  85. package/docs/content/Flash.md +0 -44
  86. package/docs/content/Flex.md +0 -58
  87. package/docs/content/FormGroup.md +0 -46
  88. package/docs/content/Grid.md +0 -59
  89. package/docs/content/Header.md +0 -79
  90. package/docs/content/Heading.md +0 -22
  91. package/docs/content/Label.md +0 -42
  92. package/docs/content/LabelGroup.md +0 -31
  93. package/docs/content/Link.md +0 -37
  94. package/docs/content/Overlay.mdx +0 -94
  95. package/docs/content/Pagehead.md +0 -27
  96. package/docs/content/Pagination.md +0 -187
  97. package/docs/content/PointerBox.md +0 -81
  98. package/docs/content/Popover.md +0 -137
  99. package/docs/content/Portal.mdx +0 -78
  100. package/docs/content/Position.md +0 -100
  101. package/docs/content/ProgressBar.mdx +0 -29
  102. package/docs/content/SelectMenu.md +0 -435
  103. package/docs/content/SelectPanel.mdx +0 -67
  104. package/docs/content/SideNav.md +0 -179
  105. package/docs/content/Spinner.mdx +0 -32
  106. package/docs/content/StateLabel.md +0 -35
  107. package/docs/content/StyledOcticon.md +0 -36
  108. package/docs/content/SubNav.md +0 -102
  109. package/docs/content/TabNav.md +0 -50
  110. package/docs/content/Text.md +0 -31
  111. package/docs/content/TextInput.md +0 -34
  112. package/docs/content/TextInputTokens.mdx +0 -89
  113. package/docs/content/TextInputWithTokens.mdx +0 -97
  114. package/docs/content/Timeline.md +0 -138
  115. package/docs/content/Token.mdx +0 -381
  116. package/docs/content/Tooltip.md +0 -41
  117. package/docs/content/Truncate.md +0 -64
  118. package/docs/content/UnderlineNav.md +0 -53
  119. package/docs/content/anchoredPosition.mdx +0 -163
  120. package/docs/content/core-concepts.md +0 -70
  121. package/docs/content/focusTrap.mdx +0 -103
  122. package/docs/content/focusZone.mdx +0 -145
  123. package/docs/content/getting-started.md +0 -138
  124. package/docs/content/index.md +0 -33
  125. package/docs/content/linting.md +0 -35
  126. package/docs/content/overriding-styles.mdx +0 -82
  127. package/docs/content/philosophy.md +0 -23
  128. package/docs/content/primer-theme.md +0 -89
  129. package/docs/content/ssr.mdx +0 -43
  130. package/docs/content/system-props.mdx +0 -37
  131. package/docs/content/theme-reference.md +0 -16
  132. package/docs/content/theming.md +0 -249
  133. package/docs/content/useOnEscapePress.mdx +0 -56
  134. package/docs/content/useOnOutsideClick.mdx +0 -57
  135. package/docs/content/useOpenAndCloseFocus.mdx +0 -49
  136. package/docs/content/useOverlay.mdx +0 -62
  137. package/docs/content/useSafeTimeout.mdx +0 -32
  138. package/docs/gatsby-config.js +0 -30
  139. package/docs/gatsby-node.js +0 -101
  140. package/docs/package-lock.json +0 -20756
  141. package/docs/package.json +0 -36
  142. package/docs/src/@primer/gatsby-theme-doctocat/components/hero.js +0 -23
  143. package/docs/src/@primer/gatsby-theme-doctocat/components/live-preview-wrapper.js +0 -41
  144. package/docs/src/@primer/gatsby-theme-doctocat/live-code-scope.js +0 -54
  145. package/docs/src/@primer/gatsby-theme-doctocat/nav.yml +0 -133
  146. package/docs/src/@primer/gatsby-theme-doctocat/primer-components-hero.svg +0 -1411
  147. package/docs/src/props.js +0 -77
  148. package/jest.config.js +0 -13
  149. package/lib/__tests__/ActionList.test.d.ts +0 -1
  150. package/lib/__tests__/ActionList.test.js +0 -69
  151. package/lib/__tests__/ActionList.types.test.d.ts +0 -6
  152. package/lib/__tests__/ActionList.types.test.js +0 -69
  153. package/lib/__tests__/ActionMenu.test.d.ts +0 -1
  154. package/lib/__tests__/ActionMenu.test.js +0 -151
  155. package/lib/__tests__/AnchoredOverlay.test.d.ts +0 -1
  156. package/lib/__tests__/AnchoredOverlay.test.js +0 -160
  157. package/lib/__tests__/Autocomplete.test.d.ts +0 -1
  158. package/lib/__tests__/Autocomplete.test.js +0 -528
  159. package/lib/__tests__/Avatar.test.d.ts +0 -1
  160. package/lib/__tests__/Avatar.test.js +0 -67
  161. package/lib/__tests__/AvatarStack.test.d.ts +0 -1
  162. package/lib/__tests__/AvatarStack.test.js +0 -71
  163. package/lib/__tests__/BorderBox.test.d.ts +0 -1
  164. package/lib/__tests__/BorderBox.test.js +0 -58
  165. package/lib/__tests__/Box.test.d.ts +0 -1
  166. package/lib/__tests__/Box.test.js +0 -78
  167. package/lib/__tests__/BranchName.test.d.ts +0 -1
  168. package/lib/__tests__/BranchName.test.js +0 -36
  169. package/lib/__tests__/Breadcrumbs.test.d.ts +0 -1
  170. package/lib/__tests__/Breadcrumbs.test.js +0 -37
  171. package/lib/__tests__/BreadcrumbsItem.test.d.ts +0 -1
  172. package/lib/__tests__/BreadcrumbsItem.test.js +0 -49
  173. package/lib/__tests__/Button.test.d.ts +0 -1
  174. package/lib/__tests__/Button.test.js +0 -143
  175. package/lib/__tests__/Caret.test.d.ts +0 -1
  176. package/lib/__tests__/Caret.test.js +0 -52
  177. package/lib/__tests__/CircleBadge.test.d.ts +0 -1
  178. package/lib/__tests__/CircleBadge.test.js +0 -83
  179. package/lib/__tests__/CircleOcticon.test.d.ts +0 -1
  180. package/lib/__tests__/CircleOcticon.test.js +0 -71
  181. package/lib/__tests__/ConfirmationDialog.test.d.ts +0 -1
  182. package/lib/__tests__/ConfirmationDialog.test.js +0 -134
  183. package/lib/__tests__/CounterLabel.test.d.ts +0 -1
  184. package/lib/__tests__/CounterLabel.test.js +0 -58
  185. package/lib/__tests__/Details.test.d.ts +0 -1
  186. package/lib/__tests__/Details.test.js +0 -117
  187. package/lib/__tests__/Dialog.test.d.ts +0 -1
  188. package/lib/__tests__/Dialog.test.js +0 -184
  189. package/lib/__tests__/Dropdown.test.d.ts +0 -1
  190. package/lib/__tests__/Dropdown.test.js +0 -63
  191. package/lib/__tests__/DropdownMenu.test.d.ts +0 -1
  192. package/lib/__tests__/DropdownMenu.test.js +0 -150
  193. package/lib/__tests__/FilterList.test.d.ts +0 -1
  194. package/lib/__tests__/FilterList.test.js +0 -36
  195. package/lib/__tests__/FilterListItem.test.d.ts +0 -1
  196. package/lib/__tests__/FilterListItem.test.js +0 -46
  197. package/lib/__tests__/FilteredSearch.test.d.ts +0 -1
  198. package/lib/__tests__/FilteredSearch.test.js +0 -36
  199. package/lib/__tests__/Flash.test.d.ts +0 -1
  200. package/lib/__tests__/Flash.test.js +0 -62
  201. package/lib/__tests__/Flex.test.d.ts +0 -1
  202. package/lib/__tests__/Flex.test.js +0 -74
  203. package/lib/__tests__/FormGroup.test.d.ts +0 -1
  204. package/lib/__tests__/FormGroup.test.js +0 -54
  205. package/lib/__tests__/Grid.test.d.ts +0 -1
  206. package/lib/__tests__/Grid.test.js +0 -104
  207. package/lib/__tests__/Header.test.d.ts +0 -1
  208. package/lib/__tests__/Header.test.js +0 -58
  209. package/lib/__tests__/Heading.test.d.ts +0 -1
  210. package/lib/__tests__/Heading.test.js +0 -109
  211. package/lib/__tests__/Label.test.d.ts +0 -1
  212. package/lib/__tests__/Label.test.js +0 -46
  213. package/lib/__tests__/LabelGroup.test.d.ts +0 -1
  214. package/lib/__tests__/LabelGroup.test.js +0 -38
  215. package/lib/__tests__/Link.test.d.ts +0 -1
  216. package/lib/__tests__/Link.test.js +0 -70
  217. package/lib/__tests__/Merge.types.test.d.ts +0 -30
  218. package/lib/__tests__/Merge.types.test.js +0 -27
  219. package/lib/__tests__/Overlay.test.d.ts +0 -1
  220. package/lib/__tests__/Overlay.test.js +0 -145
  221. package/lib/__tests__/Pagehead.test.d.ts +0 -1
  222. package/lib/__tests__/Pagehead.test.js +0 -37
  223. package/lib/__tests__/Pagination/Pagination.test.d.ts +0 -1
  224. package/lib/__tests__/Pagination/Pagination.test.js +0 -47
  225. package/lib/__tests__/Pagination/PaginationModel.test.d.ts +0 -1
  226. package/lib/__tests__/Pagination/PaginationModel.test.js +0 -186
  227. package/lib/__tests__/PointerBox.test.d.ts +0 -1
  228. package/lib/__tests__/PointerBox.test.js +0 -46
  229. package/lib/__tests__/Popover.test.d.ts +0 -1
  230. package/lib/__tests__/Popover.test.js +0 -66
  231. package/lib/__tests__/Portal.test.d.ts +0 -1
  232. package/lib/__tests__/Portal.test.js +0 -124
  233. package/lib/__tests__/Position.test.d.ts +0 -1
  234. package/lib/__tests__/Position.test.js +0 -143
  235. package/lib/__tests__/ProgressBar.test.d.ts +0 -1
  236. package/lib/__tests__/ProgressBar.test.js +0 -68
  237. package/lib/__tests__/SelectMenu.test.d.ts +0 -1
  238. package/lib/__tests__/SelectMenu.test.js +0 -155
  239. package/lib/__tests__/SelectPanel.test.d.ts +0 -1
  240. package/lib/__tests__/SelectPanel.test.js +0 -80
  241. package/lib/__tests__/SideNav.test.d.ts +0 -1
  242. package/lib/__tests__/SideNav.test.js +0 -71
  243. package/lib/__tests__/Spinner.test.d.ts +0 -1
  244. package/lib/__tests__/Spinner.test.js +0 -53
  245. package/lib/__tests__/StateLabel.test.d.ts +0 -1
  246. package/lib/__tests__/StateLabel.test.js +0 -71
  247. package/lib/__tests__/StyledOcticon.test.d.ts +0 -1
  248. package/lib/__tests__/StyledOcticon.test.js +0 -40
  249. package/lib/__tests__/SubNav.test.d.ts +0 -1
  250. package/lib/__tests__/SubNav.test.js +0 -62
  251. package/lib/__tests__/SubNavLink.test.d.ts +0 -1
  252. package/lib/__tests__/SubNavLink.test.js +0 -49
  253. package/lib/__tests__/TabNav.test.d.ts +0 -1
  254. package/lib/__tests__/TabNav.test.js +0 -49
  255. package/lib/__tests__/Text.test.d.ts +0 -1
  256. package/lib/__tests__/Text.test.js +0 -105
  257. package/lib/__tests__/TextInput.test.d.ts +0 -1
  258. package/lib/__tests__/TextInput.test.js +0 -78
  259. package/lib/__tests__/TextInputWithTokens.test.d.ts +0 -1
  260. package/lib/__tests__/TextInputWithTokens.test.js +0 -389
  261. package/lib/__tests__/ThemeProvider.test.d.ts +0 -1
  262. package/lib/__tests__/ThemeProvider.test.js +0 -444
  263. package/lib/__tests__/Timeline.test.d.ts +0 -1
  264. package/lib/__tests__/Timeline.test.js +0 -75
  265. package/lib/__tests__/Token.test.d.ts +0 -1
  266. package/lib/__tests__/Token.test.js +0 -180
  267. package/lib/__tests__/Tooltip.test.d.ts +0 -1
  268. package/lib/__tests__/Tooltip.test.js +0 -69
  269. package/lib/__tests__/Truncate.test.d.ts +0 -1
  270. package/lib/__tests__/Truncate.test.js +0 -63
  271. package/lib/__tests__/UnderlineNav.test.d.ts +0 -1
  272. package/lib/__tests__/UnderlineNav.test.js +0 -72
  273. package/lib/__tests__/UnderlineNavLink.test.d.ts +0 -1
  274. package/lib/__tests__/UnderlineNavLink.test.js +0 -51
  275. package/lib/__tests__/behaviors/anchoredPosition.test.d.ts +0 -1
  276. package/lib/__tests__/behaviors/anchoredPosition.test.js +0 -390
  277. package/lib/__tests__/behaviors/focusTrap.test.d.ts +0 -1
  278. package/lib/__tests__/behaviors/focusTrap.test.js +0 -234
  279. package/lib/__tests__/behaviors/focusZone.test.d.ts +0 -1
  280. package/lib/__tests__/behaviors/focusZone.test.js +0 -570
  281. package/lib/__tests__/behaviors/iterateFocusableElements.test.d.ts +0 -1
  282. package/lib/__tests__/behaviors/iterateFocusableElements.test.js +0 -55
  283. package/lib/__tests__/behaviors/scrollIntoViewingArea.test.d.ts +0 -1
  284. package/lib/__tests__/behaviors/scrollIntoViewingArea.test.js +0 -226
  285. package/lib/__tests__/filterObject.test.d.ts +0 -1
  286. package/lib/__tests__/filterObject.test.js +0 -30
  287. package/lib/__tests__/hooks/useAnchoredPosition.test.d.ts +0 -1
  288. package/lib/__tests__/hooks/useAnchoredPosition.test.js +0 -54
  289. package/lib/__tests__/hooks/useOnEscapePress.test.d.ts +0 -1
  290. package/lib/__tests__/hooks/useOnEscapePress.test.js +0 -32
  291. package/lib/__tests__/hooks/useOnOutsideClick.test.d.ts +0 -1
  292. package/lib/__tests__/hooks/useOnOutsideClick.test.js +0 -87
  293. package/lib/__tests__/hooks/useOpenAndCloseFocus.test.d.ts +0 -1
  294. package/lib/__tests__/hooks/useOpenAndCloseFocus.test.js +0 -60
  295. package/lib/__tests__/hooks/useProvidedStateOrCreate.test.d.ts +0 -1
  296. package/lib/__tests__/hooks/useProvidedStateOrCreate.test.js +0 -45
  297. package/lib/__tests__/theme.test.d.ts +0 -1
  298. package/lib/__tests__/theme.test.js +0 -36
  299. package/lib/__tests__/themeGet.test.d.ts +0 -1
  300. package/lib/__tests__/themeGet.test.js +0 -25
  301. package/lib/__tests__/useSafeTimeout.test.d.ts +0 -1
  302. package/lib/__tests__/useSafeTimeout.test.js +0 -45
  303. package/lib/stories/ActionList.stories.js +0 -453
  304. package/lib/stories/ActionMenu.stories.js +0 -338
  305. package/lib/stories/AnchoredOverlay.stories.js +0 -127
  306. package/lib/stories/Autocomplete.stories.js +0 -608
  307. package/lib/stories/AvatarStack.stories.js +0 -49
  308. package/lib/stories/Button.stories.js +0 -114
  309. package/lib/stories/ConfirmationDialog.stories.js +0 -111
  310. package/lib/stories/Dialog.stories.js +0 -265
  311. package/lib/stories/DropdownMenu.stories.js +0 -122
  312. package/lib/stories/IssueLabelToken.stories.js +0 -165
  313. package/lib/stories/Overlay.stories.js +0 -204
  314. package/lib/stories/Portal.stories.js +0 -104
  315. package/lib/stories/ProfileToken.stories.js +0 -162
  316. package/lib/stories/SelectPanel.stories.js +0 -399
  317. package/lib/stories/TextInputWithTokens.stories.js +0 -235
  318. package/lib/stories/ThemeProvider.stories.js +0 -102
  319. package/lib/stories/Token.stories.js +0 -159
  320. package/lib/stories/useAnchoredPosition.stories.js +0 -351
  321. package/lib/stories/useFocusTrap.stories.js +0 -356
  322. package/lib/stories/useFocusZone.stories.js +0 -599
  323. package/lib-esm/__tests__/ActionList.test.d.ts +0 -1
  324. package/lib-esm/__tests__/ActionList.test.js +0 -57
  325. package/lib-esm/__tests__/ActionList.types.test.d.ts +0 -6
  326. package/lib-esm/__tests__/ActionList.types.test.js +0 -45
  327. package/lib-esm/__tests__/ActionMenu.test.d.ts +0 -1
  328. package/lib-esm/__tests__/ActionMenu.test.js +0 -139
  329. package/lib-esm/__tests__/AnchoredOverlay.test.d.ts +0 -1
  330. package/lib-esm/__tests__/AnchoredOverlay.test.js +0 -134
  331. package/lib-esm/__tests__/Autocomplete.test.d.ts +0 -1
  332. package/lib-esm/__tests__/Autocomplete.test.js +0 -494
  333. package/lib-esm/__tests__/Avatar.test.d.ts +0 -1
  334. package/lib-esm/__tests__/Avatar.test.js +0 -56
  335. package/lib-esm/__tests__/AvatarStack.test.d.ts +0 -1
  336. package/lib-esm/__tests__/AvatarStack.test.js +0 -58
  337. package/lib-esm/__tests__/BorderBox.test.d.ts +0 -1
  338. package/lib-esm/__tests__/BorderBox.test.js +0 -47
  339. package/lib-esm/__tests__/Box.test.d.ts +0 -1
  340. package/lib-esm/__tests__/Box.test.js +0 -67
  341. package/lib-esm/__tests__/BranchName.test.d.ts +0 -1
  342. package/lib-esm/__tests__/BranchName.test.js +0 -26
  343. package/lib-esm/__tests__/Breadcrumbs.test.d.ts +0 -1
  344. package/lib-esm/__tests__/Breadcrumbs.test.js +0 -27
  345. package/lib-esm/__tests__/BreadcrumbsItem.test.d.ts +0 -1
  346. package/lib-esm/__tests__/BreadcrumbsItem.test.js +0 -39
  347. package/lib-esm/__tests__/Button.test.d.ts +0 -1
  348. package/lib-esm/__tests__/Button.test.js +0 -133
  349. package/lib-esm/__tests__/Caret.test.d.ts +0 -1
  350. package/lib-esm/__tests__/Caret.test.js +0 -42
  351. package/lib-esm/__tests__/CircleBadge.test.d.ts +0 -1
  352. package/lib-esm/__tests__/CircleBadge.test.js +0 -70
  353. package/lib-esm/__tests__/CircleOcticon.test.d.ts +0 -1
  354. package/lib-esm/__tests__/CircleOcticon.test.js +0 -59
  355. package/lib-esm/__tests__/ConfirmationDialog.test.d.ts +0 -1
  356. package/lib-esm/__tests__/ConfirmationDialog.test.js +0 -113
  357. package/lib-esm/__tests__/CounterLabel.test.d.ts +0 -1
  358. package/lib-esm/__tests__/CounterLabel.test.js +0 -47
  359. package/lib-esm/__tests__/Details.test.d.ts +0 -1
  360. package/lib-esm/__tests__/Details.test.js +0 -107
  361. package/lib-esm/__tests__/Dialog.test.d.ts +0 -1
  362. package/lib-esm/__tests__/Dialog.test.js +0 -171
  363. package/lib-esm/__tests__/Dropdown.test.d.ts +0 -1
  364. package/lib-esm/__tests__/Dropdown.test.js +0 -53
  365. package/lib-esm/__tests__/DropdownMenu.test.d.ts +0 -1
  366. package/lib-esm/__tests__/DropdownMenu.test.js +0 -137
  367. package/lib-esm/__tests__/FilterList.test.d.ts +0 -1
  368. package/lib-esm/__tests__/FilterList.test.js +0 -26
  369. package/lib-esm/__tests__/FilterListItem.test.d.ts +0 -1
  370. package/lib-esm/__tests__/FilterListItem.test.js +0 -36
  371. package/lib-esm/__tests__/FilteredSearch.test.d.ts +0 -1
  372. package/lib-esm/__tests__/FilteredSearch.test.js +0 -26
  373. package/lib-esm/__tests__/Flash.test.d.ts +0 -1
  374. package/lib-esm/__tests__/Flash.test.js +0 -51
  375. package/lib-esm/__tests__/Flex.test.d.ts +0 -1
  376. package/lib-esm/__tests__/Flex.test.js +0 -64
  377. package/lib-esm/__tests__/FormGroup.test.d.ts +0 -1
  378. package/lib-esm/__tests__/FormGroup.test.js +0 -44
  379. package/lib-esm/__tests__/Grid.test.d.ts +0 -1
  380. package/lib-esm/__tests__/Grid.test.js +0 -94
  381. package/lib-esm/__tests__/Header.test.d.ts +0 -1
  382. package/lib-esm/__tests__/Header.test.js +0 -48
  383. package/lib-esm/__tests__/Heading.test.d.ts +0 -1
  384. package/lib-esm/__tests__/Heading.test.js +0 -99
  385. package/lib-esm/__tests__/Label.test.d.ts +0 -1
  386. package/lib-esm/__tests__/Label.test.js +0 -36
  387. package/lib-esm/__tests__/LabelGroup.test.d.ts +0 -1
  388. package/lib-esm/__tests__/LabelGroup.test.js +0 -26
  389. package/lib-esm/__tests__/Link.test.d.ts +0 -1
  390. package/lib-esm/__tests__/Link.test.js +0 -60
  391. package/lib-esm/__tests__/Merge.types.test.d.ts +0 -30
  392. package/lib-esm/__tests__/Merge.types.test.js +0 -14
  393. package/lib-esm/__tests__/Overlay.test.d.ts +0 -1
  394. package/lib-esm/__tests__/Overlay.test.js +0 -123
  395. package/lib-esm/__tests__/Pagehead.test.d.ts +0 -1
  396. package/lib-esm/__tests__/Pagehead.test.js +0 -26
  397. package/lib-esm/__tests__/Pagination/Pagination.test.d.ts +0 -1
  398. package/lib-esm/__tests__/Pagination/Pagination.test.js +0 -35
  399. package/lib-esm/__tests__/Pagination/PaginationModel.test.d.ts +0 -1
  400. package/lib-esm/__tests__/Pagination/PaginationModel.test.js +0 -182
  401. package/lib-esm/__tests__/PointerBox.test.d.ts +0 -1
  402. package/lib-esm/__tests__/PointerBox.test.js +0 -36
  403. package/lib-esm/__tests__/Popover.test.d.ts +0 -1
  404. package/lib-esm/__tests__/Popover.test.js +0 -53
  405. package/lib-esm/__tests__/Portal.test.d.ts +0 -1
  406. package/lib-esm/__tests__/Portal.test.js +0 -104
  407. package/lib-esm/__tests__/Position.test.d.ts +0 -1
  408. package/lib-esm/__tests__/Position.test.js +0 -133
  409. package/lib-esm/__tests__/ProgressBar.test.d.ts +0 -1
  410. package/lib-esm/__tests__/ProgressBar.test.js +0 -58
  411. package/lib-esm/__tests__/SelectMenu.test.d.ts +0 -1
  412. package/lib-esm/__tests__/SelectMenu.test.js +0 -145
  413. package/lib-esm/__tests__/SelectPanel.test.d.ts +0 -1
  414. package/lib-esm/__tests__/SelectPanel.test.js +0 -65
  415. package/lib-esm/__tests__/SideNav.test.d.ts +0 -1
  416. package/lib-esm/__tests__/SideNav.test.js +0 -60
  417. package/lib-esm/__tests__/Spinner.test.d.ts +0 -1
  418. package/lib-esm/__tests__/Spinner.test.js +0 -43
  419. package/lib-esm/__tests__/StateLabel.test.d.ts +0 -1
  420. package/lib-esm/__tests__/StateLabel.test.js +0 -61
  421. package/lib-esm/__tests__/StyledOcticon.test.d.ts +0 -1
  422. package/lib-esm/__tests__/StyledOcticon.test.js +0 -29
  423. package/lib-esm/__tests__/SubNav.test.d.ts +0 -1
  424. package/lib-esm/__tests__/SubNav.test.js +0 -50
  425. package/lib-esm/__tests__/SubNavLink.test.d.ts +0 -1
  426. package/lib-esm/__tests__/SubNavLink.test.js +0 -39
  427. package/lib-esm/__tests__/TabNav.test.d.ts +0 -1
  428. package/lib-esm/__tests__/TabNav.test.js +0 -39
  429. package/lib-esm/__tests__/Text.test.d.ts +0 -1
  430. package/lib-esm/__tests__/Text.test.js +0 -93
  431. package/lib-esm/__tests__/TextInput.test.d.ts +0 -1
  432. package/lib-esm/__tests__/TextInput.test.js +0 -68
  433. package/lib-esm/__tests__/TextInputWithTokens.test.d.ts +0 -1
  434. package/lib-esm/__tests__/TextInputWithTokens.test.js +0 -341
  435. package/lib-esm/__tests__/ThemeProvider.test.d.ts +0 -1
  436. package/lib-esm/__tests__/ThemeProvider.test.js +0 -408
  437. package/lib-esm/__tests__/Timeline.test.d.ts +0 -1
  438. package/lib-esm/__tests__/Timeline.test.js +0 -65
  439. package/lib-esm/__tests__/Token.test.d.ts +0 -1
  440. package/lib-esm/__tests__/Token.test.js +0 -166
  441. package/lib-esm/__tests__/Tooltip.test.d.ts +0 -1
  442. package/lib-esm/__tests__/Tooltip.test.js +0 -59
  443. package/lib-esm/__tests__/Truncate.test.d.ts +0 -1
  444. package/lib-esm/__tests__/Truncate.test.js +0 -53
  445. package/lib-esm/__tests__/UnderlineNav.test.d.ts +0 -1
  446. package/lib-esm/__tests__/UnderlineNav.test.js +0 -60
  447. package/lib-esm/__tests__/UnderlineNavLink.test.d.ts +0 -1
  448. package/lib-esm/__tests__/UnderlineNavLink.test.js +0 -41
  449. package/lib-esm/__tests__/behaviors/anchoredPosition.test.d.ts +0 -1
  450. package/lib-esm/__tests__/behaviors/anchoredPosition.test.js +0 -388
  451. package/lib-esm/__tests__/behaviors/focusTrap.test.d.ts +0 -1
  452. package/lib-esm/__tests__/behaviors/focusTrap.test.js +0 -227
  453. package/lib-esm/__tests__/behaviors/focusZone.test.d.ts +0 -1
  454. package/lib-esm/__tests__/behaviors/focusZone.test.js +0 -487
  455. package/lib-esm/__tests__/behaviors/iterateFocusableElements.test.d.ts +0 -1
  456. package/lib-esm/__tests__/behaviors/iterateFocusableElements.test.js +0 -48
  457. package/lib-esm/__tests__/behaviors/scrollIntoViewingArea.test.d.ts +0 -1
  458. package/lib-esm/__tests__/behaviors/scrollIntoViewingArea.test.js +0 -224
  459. package/lib-esm/__tests__/filterObject.test.d.ts +0 -1
  460. package/lib-esm/__tests__/filterObject.test.js +0 -27
  461. package/lib-esm/__tests__/hooks/useAnchoredPosition.test.d.ts +0 -1
  462. package/lib-esm/__tests__/hooks/useAnchoredPosition.test.js +0 -46
  463. package/lib-esm/__tests__/hooks/useOnEscapePress.test.d.ts +0 -1
  464. package/lib-esm/__tests__/hooks/useOnEscapePress.test.js +0 -23
  465. package/lib-esm/__tests__/hooks/useOnOutsideClick.test.d.ts +0 -1
  466. package/lib-esm/__tests__/hooks/useOnOutsideClick.test.js +0 -68
  467. package/lib-esm/__tests__/hooks/useOpenAndCloseFocus.test.d.ts +0 -1
  468. package/lib-esm/__tests__/hooks/useOpenAndCloseFocus.test.js +0 -52
  469. package/lib-esm/__tests__/hooks/useProvidedStateOrCreate.test.d.ts +0 -1
  470. package/lib-esm/__tests__/hooks/useProvidedStateOrCreate.test.js +0 -36
  471. package/lib-esm/__tests__/theme.test.d.ts +0 -1
  472. package/lib-esm/__tests__/theme.test.js +0 -33
  473. package/lib-esm/__tests__/themeGet.test.d.ts +0 -1
  474. package/lib-esm/__tests__/themeGet.test.js +0 -22
  475. package/lib-esm/__tests__/useSafeTimeout.test.d.ts +0 -1
  476. package/lib-esm/__tests__/useSafeTimeout.test.js +0 -39
  477. package/lib-esm/stories/ActionList.stories.js +0 -394
  478. package/lib-esm/stories/ActionMenu.stories.js +0 -293
  479. package/lib-esm/stories/AnchoredOverlay.stories.js +0 -101
  480. package/lib-esm/stories/Autocomplete.stories.js +0 -549
  481. package/lib-esm/stories/AvatarStack.stories.js +0 -32
  482. package/lib-esm/stories/Button.stories.js +0 -78
  483. package/lib-esm/stories/ConfirmationDialog.stories.js +0 -86
  484. package/lib-esm/stories/Dialog.stories.js +0 -240
  485. package/lib-esm/stories/DropdownMenu.stories.js +0 -94
  486. package/lib-esm/stories/IssueLabelToken.stories.js +0 -139
  487. package/lib-esm/stories/Overlay.stories.js +0 -173
  488. package/lib-esm/stories/Portal.stories.js +0 -68
  489. package/lib-esm/stories/ProfileToken.stories.js +0 -136
  490. package/lib-esm/stories/SelectPanel.stories.js +0 -334
  491. package/lib-esm/stories/TextInputWithTokens.stories.js +0 -196
  492. package/lib-esm/stories/ThemeProvider.stories.js +0 -83
  493. package/lib-esm/stories/Token.stories.js +0 -133
  494. package/lib-esm/stories/useAnchoredPosition.stories.js +0 -313
  495. package/lib-esm/stories/useFocusTrap.stories.js +0 -309
  496. package/lib-esm/stories/useFocusZone.stories.js +0 -554
  497. package/migrating.md +0 -250
  498. package/now.json +0 -17
  499. package/package-lock.json +0 -29369
  500. package/rollup.config.js +0 -36
  501. package/script/build +0 -19
  502. package/script/build-storybook +0 -10
  503. package/script/setup +0 -12
  504. package/src/ActionList/Divider.tsx +0 -25
  505. package/src/ActionList/Group.tsx +0 -45
  506. package/src/ActionList/Header.tsx +0 -74
  507. package/src/ActionList/Item.tsx +0 -483
  508. package/src/ActionList/List.tsx +0 -258
  509. package/src/ActionList/index.ts +0 -21
  510. package/src/ActionMenu.tsx +0 -106
  511. package/src/AnchoredOverlay/AnchoredOverlay.tsx +0 -191
  512. package/src/AnchoredOverlay/index.ts +0 -2
  513. package/src/Autocomplete/Autocomplete.tsx +0 -103
  514. package/src/Autocomplete/AutocompleteContext.tsx +0 -19
  515. package/src/Autocomplete/AutocompleteInput.tsx +0 -179
  516. package/src/Autocomplete/AutocompleteMenu.tsx +0 -341
  517. package/src/Autocomplete/AutocompleteOverlay.tsx +0 -68
  518. package/src/Autocomplete/index.ts +0 -2
  519. package/src/Avatar.tsx +0 -46
  520. package/src/AvatarPair.tsx +0 -35
  521. package/src/AvatarStack.tsx +0 -159
  522. package/src/BaseStyles.tsx +0 -53
  523. package/src/BorderBox.tsx +0 -18
  524. package/src/Box.tsx +0 -54
  525. package/src/BranchName.tsx +0 -19
  526. package/src/Breadcrumbs.tsx +0 -101
  527. package/src/Button/Button.tsx +0 -40
  528. package/src/Button/ButtonBase.tsx +0 -43
  529. package/src/Button/ButtonClose.tsx +0 -40
  530. package/src/Button/ButtonDanger.tsx +0 -43
  531. package/src/Button/ButtonGroup.tsx +0 -55
  532. package/src/Button/ButtonInvisible.tsx +0 -27
  533. package/src/Button/ButtonOutline.tsx +0 -43
  534. package/src/Button/ButtonPrimary.tsx +0 -41
  535. package/src/Button/ButtonStyles.tsx +0 -36
  536. package/src/Button/ButtonTableList.tsx +0 -58
  537. package/src/Button/index.ts +0 -16
  538. package/src/Caret.tsx +0 -133
  539. package/src/CircleBadge.tsx +0 -55
  540. package/src/CircleOcticon.tsx +0 -37
  541. package/src/CounterLabel.tsx +0 -52
  542. package/src/Details.tsx +0 -23
  543. package/src/Dialog/ConfirmationDialog.tsx +0 -184
  544. package/src/Dialog/Dialog.tsx +0 -432
  545. package/src/Dialog.tsx +0 -149
  546. package/src/Dropdown.tsx +0 -158
  547. package/src/DropdownMenu/DropdownButton.tsx +0 -15
  548. package/src/DropdownMenu/DropdownMenu.tsx +0 -115
  549. package/src/DropdownMenu/index.ts +0 -4
  550. package/src/DropdownStyles.ts +0 -128
  551. package/src/FilterList.tsx +0 -81
  552. package/src/FilteredActionList/FilteredActionList.tsx +0 -142
  553. package/src/FilteredActionList/index.ts +0 -2
  554. package/src/FilteredSearch.tsx +0 -28
  555. package/src/Flash.tsx +0 -77
  556. package/src/Flex.tsx +0 -15
  557. package/src/FormGroup.tsx +0 -27
  558. package/src/Grid.tsx +0 -15
  559. package/src/Header.tsx +0 -84
  560. package/src/Heading.tsx +0 -21
  561. package/src/Label.tsx +0 -75
  562. package/src/LabelGroup.tsx +0 -18
  563. package/src/Link.tsx +0 -46
  564. package/src/Overlay.tsx +0 -197
  565. package/src/Pagehead.tsx +0 -17
  566. package/src/Pagination/Pagination.tsx +0 -214
  567. package/src/Pagination/index.ts +0 -4
  568. package/src/Pagination/model.tsx +0 -187
  569. package/src/PointerBox.tsx +0 -31
  570. package/src/Popover.tsx +0 -236
  571. package/src/Portal/Portal.tsx +0 -96
  572. package/src/Portal/index.ts +0 -5
  573. package/src/Position.tsx +0 -63
  574. package/src/ProgressBar.tsx +0 -52
  575. package/src/SelectMenu/SelectMenu.tsx +0 -125
  576. package/src/SelectMenu/SelectMenuContext.tsx +0 -9
  577. package/src/SelectMenu/SelectMenuDivider.tsx +0 -25
  578. package/src/SelectMenu/SelectMenuFilter.tsx +0 -51
  579. package/src/SelectMenu/SelectMenuFooter.tsx +0 -28
  580. package/src/SelectMenu/SelectMenuHeader.tsx +0 -50
  581. package/src/SelectMenu/SelectMenuItem.tsx +0 -137
  582. package/src/SelectMenu/SelectMenuList.tsx +0 -42
  583. package/src/SelectMenu/SelectMenuLoadingAnimation.tsx +0 -24
  584. package/src/SelectMenu/SelectMenuModal.tsx +0 -121
  585. package/src/SelectMenu/SelectMenuTab.tsx +0 -88
  586. package/src/SelectMenu/SelectMenuTabPanel.tsx +0 -30
  587. package/src/SelectMenu/SelectMenuTabs.tsx +0 -44
  588. package/src/SelectMenu/hooks/useKeyboardNav.js +0 -90
  589. package/src/SelectMenu/index.ts +0 -15
  590. package/src/SelectPanel/SelectPanel.tsx +0 -173
  591. package/src/SelectPanel/index.ts +0 -2
  592. package/src/SideNav.tsx +0 -193
  593. package/src/Spinner.tsx +0 -59
  594. package/src/StateLabel.tsx +0 -102
  595. package/src/StyledOcticon.tsx +0 -24
  596. package/src/SubNav.tsx +0 -129
  597. package/src/TabNav.tsx +0 -77
  598. package/src/Text.tsx +0 -13
  599. package/src/TextInput.tsx +0 -68
  600. package/src/TextInputWithTokens.tsx +0 -271
  601. package/src/ThemeProvider.tsx +0 -176
  602. package/src/Timeline.tsx +0 -141
  603. package/src/Token/AvatarToken.tsx +0 -54
  604. package/src/Token/IssueLabelToken.tsx +0 -150
  605. package/src/Token/Token.tsx +0 -112
  606. package/src/Token/TokenBase.tsx +0 -134
  607. package/src/Token/_RemoveTokenButton.tsx +0 -98
  608. package/src/Token/_TokenTextContainer.tsx +0 -47
  609. package/src/Token/index.ts +0 -3
  610. package/src/Tooltip.tsx +0 -263
  611. package/src/Truncate.tsx +0 -36
  612. package/src/UnderlineNav.tsx +0 -110
  613. package/src/_TextInputWrapper.tsx +0 -105
  614. package/src/_UnstyledTextInput.tsx +0 -19
  615. package/src/__tests__/.eslintrc.json +0 -11
  616. package/src/__tests__/ActionList.test.tsx +0 -53
  617. package/src/__tests__/ActionList.types.test.tsx +0 -51
  618. package/src/__tests__/ActionMenu.test.tsx +0 -136
  619. package/src/__tests__/AnchoredOverlay.test.tsx +0 -150
  620. package/src/__tests__/Autocomplete.test.tsx +0 -444
  621. package/src/__tests__/Avatar.test.tsx +0 -44
  622. package/src/__tests__/AvatarStack.test.tsx +0 -48
  623. package/src/__tests__/BorderBox.test.tsx +0 -43
  624. package/src/__tests__/Box.test.tsx +0 -42
  625. package/src/__tests__/BranchName.test.tsx +0 -26
  626. package/src/__tests__/Breadcrumbs.test.tsx +0 -27
  627. package/src/__tests__/BreadcrumbsItem.test.tsx +0 -31
  628. package/src/__tests__/Button.test.tsx +0 -128
  629. package/src/__tests__/Caret.test.tsx +0 -36
  630. package/src/__tests__/CircleBadge.test.tsx +0 -66
  631. package/src/__tests__/CircleOcticon.test.tsx +0 -50
  632. package/src/__tests__/ConfirmationDialog.test.tsx +0 -120
  633. package/src/__tests__/CounterLabel.test.tsx +0 -50
  634. package/src/__tests__/Details.test.tsx +0 -115
  635. package/src/__tests__/Dialog.test.tsx +0 -155
  636. package/src/__tests__/Dropdown.test.tsx +0 -53
  637. package/src/__tests__/DropdownMenu.test.tsx +0 -136
  638. package/src/__tests__/FilterList.test.tsx +0 -26
  639. package/src/__tests__/FilterListItem.test.tsx +0 -31
  640. package/src/__tests__/FilteredSearch.test.tsx +0 -26
  641. package/src/__tests__/Flash.test.tsx +0 -45
  642. package/src/__tests__/Flex.test.tsx +0 -58
  643. package/src/__tests__/FormGroup.test.tsx +0 -38
  644. package/src/__tests__/Grid.test.tsx +0 -82
  645. package/src/__tests__/Header.test.tsx +0 -49
  646. package/src/__tests__/Heading.test.tsx +0 -91
  647. package/src/__tests__/Label.test.tsx +0 -34
  648. package/src/__tests__/LabelGroup.test.tsx +0 -30
  649. package/src/__tests__/Link.test.tsx +0 -47
  650. package/src/__tests__/Merge.types.test.ts +0 -39
  651. package/src/__tests__/Overlay.test.tsx +0 -103
  652. package/src/__tests__/Pagehead.test.tsx +0 -23
  653. package/src/__tests__/Pagination/Pagination.test.tsx +0 -30
  654. package/src/__tests__/Pagination/PaginationModel.test.tsx +0 -133
  655. package/src/__tests__/Pagination/__snapshots__/Pagination.test.tsx.snap +0 -184
  656. package/src/__tests__/PointerBox.test.tsx +0 -34
  657. package/src/__tests__/Popover.test.tsx +0 -68
  658. package/src/__tests__/Portal.test.tsx +0 -103
  659. package/src/__tests__/Position.test.tsx +0 -117
  660. package/src/__tests__/ProgressBar.test.tsx +0 -40
  661. package/src/__tests__/SelectMenu.test.tsx +0 -142
  662. package/src/__tests__/SelectPanel.test.tsx +0 -63
  663. package/src/__tests__/SideNav.test.tsx +0 -62
  664. package/src/__tests__/Spinner.test.tsx +0 -42
  665. package/src/__tests__/StateLabel.test.tsx +0 -48
  666. package/src/__tests__/StyledOcticon.test.tsx +0 -26
  667. package/src/__tests__/SubNav.test.tsx +0 -50
  668. package/src/__tests__/SubNavLink.test.tsx +0 -31
  669. package/src/__tests__/TabNav.test.tsx +0 -32
  670. package/src/__tests__/Text.test.tsx +0 -78
  671. package/src/__tests__/TextInput.test.tsx +0 -49
  672. package/src/__tests__/TextInputWithTokens.test.tsx +0 -262
  673. package/src/__tests__/ThemeProvider.test.tsx +0 -441
  674. package/src/__tests__/Timeline.test.tsx +0 -58
  675. package/src/__tests__/Token.test.tsx +0 -118
  676. package/src/__tests__/Tooltip.test.tsx +0 -52
  677. package/src/__tests__/Truncate.test.tsx +0 -43
  678. package/src/__tests__/UnderlineNav.test.tsx +0 -58
  679. package/src/__tests__/UnderlineNavLink.test.tsx +0 -31
  680. package/src/__tests__/__snapshots__/ActionList.test.tsx.snap +0 -223
  681. package/src/__tests__/__snapshots__/ActionMenu.test.tsx.snap +0 -80
  682. package/src/__tests__/__snapshots__/AnchoredOverlay.test.tsx.snap +0 -332
  683. package/src/__tests__/__snapshots__/Autocomplete.test.tsx.snap +0 -3414
  684. package/src/__tests__/__snapshots__/Avatar.test.tsx.snap +0 -19
  685. package/src/__tests__/__snapshots__/AvatarStack.test.tsx.snap +0 -377
  686. package/src/__tests__/__snapshots__/BorderBox.test.tsx.snap +0 -14
  687. package/src/__tests__/__snapshots__/Box.test.tsx.snap +0 -201
  688. package/src/__tests__/__snapshots__/BranchName.test.tsx.snap +0 -17
  689. package/src/__tests__/__snapshots__/Breadcrumbs.test.tsx.snap +0 -29
  690. package/src/__tests__/__snapshots__/BreadcrumbsItem.test.tsx.snap +0 -79
  691. package/src/__tests__/__snapshots__/Button.test.tsx.snap +0 -832
  692. package/src/__tests__/__snapshots__/Caret.test.tsx.snap +0 -373
  693. package/src/__tests__/__snapshots__/CircleBadge.test.tsx.snap +0 -141
  694. package/src/__tests__/__snapshots__/CircleOcticon.test.tsx.snap +0 -64
  695. package/src/__tests__/__snapshots__/ConfirmationDialog.test.tsx.snap +0 -89
  696. package/src/__tests__/__snapshots__/CounterLabel.test.tsx.snap +0 -22
  697. package/src/__tests__/__snapshots__/Details.test.tsx.snap +0 -15
  698. package/src/__tests__/__snapshots__/Dialog.test.tsx.snap +0 -200
  699. package/src/__tests__/__snapshots__/Dropdown.test.tsx.snap +0 -249
  700. package/src/__tests__/__snapshots__/DropdownMenu.test.tsx.snap +0 -106
  701. package/src/__tests__/__snapshots__/FilterList.test.tsx.snap +0 -13
  702. package/src/__tests__/__snapshots__/FilterListItem.test.tsx.snap +0 -80
  703. package/src/__tests__/__snapshots__/FilteredSearch.test.tsx.snap +0 -32
  704. package/src/__tests__/__snapshots__/Flash.test.tsx.snap +0 -32
  705. package/src/__tests__/__snapshots__/Flex.test.tsx.snap +0 -130
  706. package/src/__tests__/__snapshots__/FormGroup.test.tsx.snap +0 -25
  707. package/src/__tests__/__snapshots__/Grid.test.tsx.snap +0 -178
  708. package/src/__tests__/__snapshots__/Header.test.tsx.snap +0 -79
  709. package/src/__tests__/__snapshots__/Heading.test.tsx.snap +0 -13
  710. package/src/__tests__/__snapshots__/Label.test.tsx.snap +0 -74
  711. package/src/__tests__/__snapshots__/LabelGroup.test.tsx.snap +0 -15
  712. package/src/__tests__/__snapshots__/Link.test.tsx.snap +0 -213
  713. package/src/__tests__/__snapshots__/Pagehead.test.tsx.snap +0 -15
  714. package/src/__tests__/__snapshots__/PointerBox.test.tsx.snap +0 -174
  715. package/src/__tests__/__snapshots__/Popover.test.tsx.snap +0 -4687
  716. package/src/__tests__/__snapshots__/Position.test.tsx.snap +0 -44
  717. package/src/__tests__/__snapshots__/ProgressBar.test.tsx.snap +0 -53
  718. package/src/__tests__/__snapshots__/SelectMenu.test.tsx.snap +0 -469
  719. package/src/__tests__/__snapshots__/SelectPanel.test.tsx.snap +0 -123
  720. package/src/__tests__/__snapshots__/SideNav.test.tsx.snap +0 -143
  721. package/src/__tests__/__snapshots__/Spinner.test.tsx.snap +0 -33
  722. package/src/__tests__/__snapshots__/StateLabel.test.tsx.snap +0 -388
  723. package/src/__tests__/__snapshots__/StyledOcticon.test.tsx.snap +0 -25
  724. package/src/__tests__/__snapshots__/SubNav.test.tsx.snap +0 -44
  725. package/src/__tests__/__snapshots__/SubNavLink.test.tsx.snap +0 -199
  726. package/src/__tests__/__snapshots__/TabNav.test.tsx.snap +0 -58
  727. package/src/__tests__/__snapshots__/Text.test.tsx.snap +0 -7
  728. package/src/__tests__/__snapshots__/TextInput.test.tsx.snap +0 -440
  729. package/src/__tests__/__snapshots__/TextInputWithTokens.test.tsx.snap +0 -5308
  730. package/src/__tests__/__snapshots__/ThemeProvider.test.tsx.snap +0 -15
  731. package/src/__tests__/__snapshots__/Timeline.test.tsx.snap +0 -159
  732. package/src/__tests__/__snapshots__/Token.test.tsx.snap +0 -3787
  733. package/src/__tests__/__snapshots__/Tooltip.test.tsx.snap +0 -227
  734. package/src/__tests__/__snapshots__/Truncate.test.tsx.snap +0 -17
  735. package/src/__tests__/__snapshots__/UnderlineNav.test.tsx.snap +0 -59
  736. package/src/__tests__/__snapshots__/UnderlineNavLink.test.tsx.snap +0 -130
  737. package/src/__tests__/behaviors/anchoredPosition.test.ts +0 -295
  738. package/src/__tests__/behaviors/focusTrap.test.tsx +0 -236
  739. package/src/__tests__/behaviors/focusZone.test.tsx +0 -549
  740. package/src/__tests__/behaviors/iterateFocusableElements.test.tsx +0 -61
  741. package/src/__tests__/behaviors/scrollIntoViewingArea.test.ts +0 -195
  742. package/src/__tests__/filterObject.test.ts +0 -54
  743. package/src/__tests__/hooks/useAnchoredPosition.test.tsx +0 -31
  744. package/src/__tests__/hooks/useOnEscapePress.test.tsx +0 -16
  745. package/src/__tests__/hooks/useOnOutsideClick.test.tsx +0 -48
  746. package/src/__tests__/hooks/useOpenAndCloseFocus.test.tsx +0 -48
  747. package/src/__tests__/hooks/useProvidedStateOrCreate.test.tsx +0 -39
  748. package/src/__tests__/theme.test.ts +0 -41
  749. package/src/__tests__/themeGet.test.ts +0 -15
  750. package/src/__tests__/useSafeTimeout.test.tsx +0 -36
  751. package/src/behaviors/anchoredPosition.ts +0 -442
  752. package/src/behaviors/focusTrap.ts +0 -184
  753. package/src/behaviors/focusZone.ts +0 -713
  754. package/src/behaviors/scrollIntoViewingArea.ts +0 -27
  755. package/src/constants.ts +0 -62
  756. package/src/hooks/index.ts +0 -11
  757. package/src/hooks/useAnchoredPosition.ts +0 -53
  758. package/src/hooks/useCombinedRefs.ts +0 -40
  759. package/src/hooks/useDetails.tsx +0 -54
  760. package/src/hooks/useDialog.ts +0 -121
  761. package/src/hooks/useFocusTrap.ts +0 -80
  762. package/src/hooks/useFocusZone.ts +0 -64
  763. package/src/hooks/useOnEscapePress.ts +0 -63
  764. package/src/hooks/useOnOutsideClick.tsx +0 -82
  765. package/src/hooks/useOpenAndCloseFocus.ts +0 -32
  766. package/src/hooks/useOverlay.tsx +0 -34
  767. package/src/hooks/useProvidedRefOrCreate.ts +0 -14
  768. package/src/hooks/useProvidedStateOrCreate.ts +0 -27
  769. package/src/hooks/useRenderForcingRef.ts +0 -22
  770. package/src/hooks/useResizeObserver.ts +0 -11
  771. package/src/hooks/useSafeTimeout.ts +0 -38
  772. package/src/hooks/useScrollFlash.ts +0 -21
  773. package/src/index.ts +0 -170
  774. package/src/polyfills/eventListenerSignal.ts +0 -66
  775. package/src/stories/ActionList.stories.tsx +0 -437
  776. package/src/stories/ActionMenu.stories.tsx +0 -322
  777. package/src/stories/AnchoredOverlay.stories.tsx +0 -117
  778. package/src/stories/Autocomplete.stories.tsx +0 -572
  779. package/src/stories/AvatarStack.stories.tsx +0 -37
  780. package/src/stories/Button.stories.tsx +0 -88
  781. package/src/stories/ConfirmationDialog.stories.tsx +0 -105
  782. package/src/stories/Dialog.stories.tsx +0 -240
  783. package/src/stories/DropdownMenu.stories.tsx +0 -84
  784. package/src/stories/IssueLabelToken.stories.tsx +0 -138
  785. package/src/stories/Overlay.stories.tsx +0 -213
  786. package/src/stories/Portal.stories.tsx +0 -109
  787. package/src/stories/ProfileToken.stories.tsx +0 -129
  788. package/src/stories/SelectPanel.stories.tsx +0 -353
  789. package/src/stories/TextInputWithTokens.stories.tsx +0 -146
  790. package/src/stories/ThemeProvider.stories.tsx +0 -104
  791. package/src/stories/Token.stories.tsx +0 -126
  792. package/src/stories/useAnchoredPosition.stories.tsx +0 -320
  793. package/src/stories/useFocusTrap.stories.tsx +0 -400
  794. package/src/stories/useFocusZone.stories.tsx +0 -663
  795. package/src/sx.ts +0 -9
  796. package/src/theme-preval.js +0 -79
  797. package/src/theme.ts +0 -3
  798. package/src/utils/deprecate.tsx +0 -73
  799. package/src/utils/isNumeric.tsx +0 -4
  800. package/src/utils/iterateFocusableElements.ts +0 -121
  801. package/src/utils/ssr.tsx +0 -1
  802. package/src/utils/test-deprecations.tsx +0 -19
  803. package/src/utils/test-helpers.tsx +0 -7
  804. package/src/utils/test-matchers.tsx +0 -109
  805. package/src/utils/testing.tsx +0 -242
  806. package/src/utils/theme.js +0 -64
  807. package/src/utils/types/AriaRole.ts +0 -71
  808. package/src/utils/types/ComponentProps.ts +0 -13
  809. package/src/utils/types/Flatten.ts +0 -4
  810. package/src/utils/types/MandateProps.ts +0 -19
  811. package/src/utils/types/Merge.ts +0 -20
  812. package/src/utils/types/index.ts +0 -5
  813. package/src/utils/uniqueId.ts +0 -6
  814. package/src/utils/userAgent.ts +0 -7
  815. package/stats.html +0 -3279
  816. package/tsconfig.build.json +0 -7
  817. package/tsconfig.json +0 -20
@@ -1,179 +0,0 @@
1
- ---
2
- title: Dialog v2
3
- ---
4
-
5
- import State from '../components/State'
6
-
7
- The dialog component the Primer implementation of the ARIA design pattern [Dialog](https://www.w3.org/TR/wai-aria-practices-1.1/#dialog_modal). A dialog is a type of overlay that can be used for confirming actions, asking for disambiguation, and presenting small forms. They generally allow the user to focus on a quick task without having to navigate to a different page.
8
-
9
- **Dialogs appear in the page after a direct user interaction**. Don't show dialogs on page load or as system alerts.
10
-
11
- **Dialogs appear centered in the page**, with a visible backdrop that dims the rest of the window for focus.
12
-
13
- **All dialogs should have a title and a close button**. Use the `title` prop to set the title. The close button is created automatically, but must be handled with an `onClose` prop.
14
-
15
- **Dialogs are modal**. Dialogs can be dismissed by clicking on the close button, or by interacting with another button in the overlay. To avoid losing information and missing important messages, clicking outside of the dialog will not close it.
16
-
17
- **(Coming soon) Make sure larger dialogs remain mobile-friendly**. Even large dialogs need to be responsive. A dialog's width and height will be readjusted depending on the screen size and should never exceed the available space. Use responsive solutions to adjust the UI so they behave well on smaller screens.
18
-
19
- **(Coming soon) Simple and small dialogs can remain as-is on mobile**. As more elements are added to it, mobile-specific style variations such as **Bottom sheet** and **Full-screen** should be considered.
20
-
21
- ### State
22
-
23
- The dialog component is completely stateless. The parent component must conditionally render a dialog based on the necessary criteria. The parent component can be notified by a gesture to close the dialog (e.g. by clicking the "X" button or by pressing the Escape key) by passing in the `onClose` prop.
24
-
25
- ### Accessibility
26
-
27
- The dialog component is fully accessible out-of-the-box. The dialog's title is used for `aria-labelledby`, and the dialog's description is used for `aria-describedby`. The `aria-modal="true"` attribute is used to inform screen readers that the rest of the content on the page is inert.
28
-
29
- #### Keyboard
30
-
31
- The default keyboard API for a dialog employs three mechanisms:
32
-
33
- 1. The Escape key can be pressed to close the dialog.
34
- 2. Focus is trapped within the top-most dialog. When a dialog is opened, the close button receives initial focus by default, or on a button defined with `autoFocus: true`.
35
- 3. If there are buttons in the dialog footer, focus can be moved between them with left and right arrow keys or tab/shift+tab.
36
- 4. When a dialog is closed, it can optionally handle returning focus to the element that was focused immediately before the dialog was opened. Otherwise, it is the consumer's responsibility to move focus to a suitable element.
37
-
38
- ### Custom rendering
39
-
40
- **Note: using custom rendering allows breaking out of the defined design, UX, and accessibility patterns of the dialog. Use only as a last resort.**
41
-
42
- By default, the Dialog component implements the design and interactions defined by the Primer design system. If necessary, you can provide custom renderers for the header, body, or footer using the `renderHeader`, `renderBody`, and `renderFooter` props, respectively. The JSX produced by these render props will render full-bleed into their respective areas of the dialog. If you are using the custom renderers, you should use the provided sub-components `Dialog.Header`, `Dialog.Title`, `Dialog.Subtitle`, `Dialog.CloseButton`, `Dialog.Body`, `Dialog.Footer`, and `Dialog.Buttons` to the extent possible.
43
-
44
- ### Example
45
-
46
- ```jsx live
47
- <State default={false}>
48
- {([isOpen, setIsOpen]) => {
49
- const openDialog = React.useCallback(() => setIsOpen(true), [setIsOpen])
50
- const closeDialog = React.useCallback(() => setIsOpen(false), [setIsOpen])
51
- return (
52
- <>
53
- <Button onClick={openDialog}>Open</Button>
54
- {isOpen && (
55
- <Dialog2
56
- title="Dialog example"
57
- subtitle={
58
- <>
59
- This is a <b>description</b> of the dialog.
60
- </>
61
- }
62
- footerButtons={[{content: 'Ok', onClick: closeDialog}]}
63
- onClose={closeDialog}
64
- >
65
- <Text fontFamily="sans-serif">Some content</Text>
66
- </Dialog2>
67
- )}
68
- </>
69
- )
70
- }}
71
- </State>
72
- ```
73
-
74
- ## Component props
75
-
76
- ### DialogProps
77
-
78
- | Prop name | Type | Default | Description |
79
- | :------------ | :--------------------------------------------- | :--------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
80
- | title | `React.ReactNode` | `"Dialog"` | Sets the title of the dialog, which by default is also used as the `aria-labelledby` attribute. |
81
- | subtitle | `React.ReactNode` | | Optional. Sets the subtitle of the dialog, which by default is also used as the `aria-describedby` attribute. |
82
- | renderHeader | `(props: DialogHeaderProps) => JSX.Element` | | Optional. Custom render the dialog header. See "Custom rendering" above for more info. |
83
- | renderBody | `(props: DialogProps) => JSX.Element` | | Optional. Custom render the dialog body. See "Custom rendering" above for more info. |
84
- | renderFooter | `(props: DialogProps) => JSX.Element` | | Optional. Custom render the dialog footer. See "Custom rendering" above for more info. |
85
- | footerButtons | `DialogButtonProps[]` | | Optional. Specify buttons that will be rendered in the footer of the dialog. |
86
- | onClose | `(gesture: 'close-button' │ 'escape') => void` | | Required. This method is invoked when a gesture to close the dialog is used (either an Escape key press or clicking the "X" in the top-right corner). The gesture argument indicates the gesture that was used to close the dialog (either 'close-button' or 'escape'). |
87
- | role | `"dialog" │ "alertdialog"` | `"dialog"` | The ARIA role given to the dialog element. More info: [dialog](https://www.w3.org/TR/wai-aria-practices-1.1/#dialog_modal), [alertdialog](https://www.w3.org/TR/wai-aria-practices-1.1/#alertdialog) |
88
- | width | `"small" │ "medium" │ "large" │ "xlarge"` | `"xlarge"` | The fixed width of the dialog. |
89
- | height | `"small" │ "large" │ "auto"` | `"auto"` | The fixed height of the dialog, or, auto to adjust the height based on its contents. |
90
-
91
- ### DialogHeaderProps
92
-
93
- The `DialogHeaderProps` interface extends `DialogProps` and adds these additional properties:
94
-
95
- | Prop name | Type | Description |
96
- | :------------------ | :------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------- |
97
- | dialogLabelId | `string` | ID of the element that will be used as the `aria-labelledby` attribute on the dialog. This ID should be set to the element that renders the dialog's title. |
98
- | dialogDescriptionId | `string` | ID of the element that will be used as the `aria-describedby` attribute on the dialog. This ID should be set to the element that renders the dialog's subtitle. |
99
-
100
- ### DialogButtonProps
101
-
102
- The `DialogButtonProps` interface extends `ButtonProps` (see Button) and adds these additional properties:
103
-
104
- | Prop name | Type | Default | Description |
105
- | :--------- | :-------------------------------- | :------- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------- |
106
- | buttonType | `"normal" │ "primary" │ "danger"` | `Button` | The type of button to render |
107
- | content | `React.ReactNode` | | Required. The button's inner content. |
108
- | autoFocus | `boolean` | false | If true, this button will be automatically focused when the dialog is first rendered. If `autoFocus` is true on subsequent button definitions, it will be ignored. |
109
-
110
- ## ConfirmationDialog
111
-
112
- A `ConfirmationDialog` is a special kind of dialog with more rigid behavior. It is used to confirm a user action. `ConfirmationDialog`s always have exactly two buttons: one to cancel the action and one to confirm it. No custom rendering capabilities are provided for ConfirmationDialog.
113
-
114
- ### useConfirm hook
115
-
116
- An alternate way to use `ConfirmationDialog` is with the `useConfirm()` hook. It takes no parameters and returns an `async` function, `confirm`. When `confirm` is called (see ConfirmOptions below for its argument), it shows the confirmation dialog. When the dialog is dismissed, a promise is resolved with `true` or `false` depending on whether or not the confirm button was used.
117
-
118
- ### Example (with `useConfirm` hook)
119
-
120
- ```javascript live noinline
121
- function ShorthandExample2() {
122
- const confirm = useConfirm()
123
- const buttonClick = React.useCallback(
124
- async function (e) {
125
- if (await confirm({title: 'Are you sure?', content: 'You must confirm this action to continue.'})) {
126
- e.target.textContent = 'Confirmed!'
127
- }
128
- },
129
- [confirm]
130
- )
131
- return (
132
- <>
133
- <Button onClick={buttonClick}>Confirmable action</Button>
134
- </>
135
- )
136
- }
137
- render(<ShorthandExample2 />)
138
- ```
139
-
140
- ### Example (using the full `ConfirmationDialog` component)
141
-
142
- ```jsx live
143
- <State default={false}>
144
- {([isOpen, setIsOpen]) => {
145
- const openDialog = React.useCallback(() => setIsOpen(true), [setIsOpen])
146
- const closeDialog = React.useCallback(() => setIsOpen(false), [setIsOpen])
147
- return (
148
- <>
149
- <Button onClick={openDialog}>Open</Button>
150
- {isOpen && (
151
- <ConfirmationDialog title="Confirm action?" onClose={closeDialog}>
152
- Are you sure you want to confirm this action?
153
- </ConfirmationDialog>
154
- )}
155
- </>
156
- )
157
- }}
158
- </State>
159
- ```
160
-
161
- ### ConfirmationDialogProps
162
-
163
- | Prop name | Type | Default | Description |
164
- | :------------------- | :-------------------------------------------------------------------- | :--------- | :---------------------------------------------------------------------------------------------------------------------------- |
165
- | title | `React.ReactNode` | | Required. Sets the title of the dialog, which by default is also used as the `aria-labelledby` attribute. |
166
- | onClose | `(gesture: 'confirm' │ 'cancel' │ 'close-button' │ 'escape') => void` | | Required. This callback is invoked when a gesture to close the dialog is performed. The first argument indicates the gesture. |
167
- | cancelButtonContent | `React.ReactNode` | `"Cancel"` | The content to use for the cancel button. |
168
- | confirmButtonContent | `React.ReactNode` | `"OK"` | The content to use for the confirm button. |
169
- | confirmButtonType | `"normal" │ "primary" │ "danger"` | `Button` | The type of button to use for the confirm button. |
170
-
171
- ### ConfirmOptions
172
-
173
- | Prop name | Type | Default | Description |
174
- | :------------------- | :-------------------------------- | :--------- | :-------------------------------------------------------------------------------------------------------- |
175
- | title | `React.ReactNode` | | Required. Sets the title of the dialog, which by default is also used as the `aria-labelledby` attribute. |
176
- | content | `React.ReactNode` | | Required. Used as the body of the ConfirmationDialog that is displayed. |
177
- | cancelButtonContent | `React.ReactNode` | `"Cancel"` | The content to use for the cancel button. |
178
- | confirmButtonContent | `React.ReactNode` | `"OK"` | The content to use for the confirm button. |
179
- | confirmButtonType | `"normal" │ "primary" │ "danger"` | `Button` | The type of button to use for the confirm button. |
@@ -1,72 +0,0 @@
1
- ---
2
- title: Dropdown
3
- ---
4
-
5
- The Dropdown component is a lightweight context menu for housing navigation and actions.
6
-
7
- Use `Dropdown.Button` as the trigger for the dropdown, or use a custom `summary` element if you would like. **You must use a `summary` tag in order for the dropdown to behave properly!**. You should also add `aria-haspopup="true"` to custom dropdown triggers for accessibility purposes. You can use the `Dropdown.Caret` component to add a caret to a custom dropdown trigger.
8
-
9
- Dropdown.Menu wraps your menu content. Be sure to pass a `direction` prop to this component to position the menu in relation to the Dropdown.Button.
10
-
11
- ## Default example
12
-
13
- ```jsx live
14
- <Dropdown>
15
- <Dropdown.Button>Dropdown</Dropdown.Button>
16
- <Dropdown.Menu direction="sw">
17
- <Dropdown.Item>Item 1</Dropdown.Item>
18
- <Dropdown.Item>Item 2</Dropdown.Item>
19
- <Dropdown.Item>Item 3</Dropdown.Item>
20
- </Dropdown.Menu>
21
- </Dropdown>
22
- ```
23
-
24
- ## With custom button
25
-
26
- ```jsx live
27
- <Dropdown>
28
- <summary>
29
- Dropdown
30
- <Dropdown.Caret />
31
- </summary>
32
- <Dropdown.Menu direction="sw">
33
- <Dropdown.Item>Item 1</Dropdown.Item>
34
- <Dropdown.Item>Item 2</Dropdown.Item>
35
- <Dropdown.Item>Item 3</Dropdown.Item>
36
- </Dropdown.Menu>
37
- </Dropdown>
38
- ```
39
-
40
- ## System props
41
-
42
- <Note variant="warning">
43
-
44
- System props are deprecated in all components except [Box](/Box). Please use the [`sx` prop](/overriding-styles) instead.
45
-
46
- </Note>
47
-
48
- Dropdown, Dropdown.Menu, Dropdown.Button, Dropdown.Caret, and Dropdown.Item all get `COMMON` system props. Read our [System Props](/system-props) doc page for a full list of available props.
49
-
50
- ## Component props
51
-
52
- The Dropdown component is extended from the [`Details`](/Details) component and gets all props that the [`Details`](/Details) component gets.
53
-
54
- #### Dropdown.Menu
55
-
56
- | Name | Type | Default | Description |
57
- | :-------- | :----- | :-----: | :------------------------------------------------------------------------------------ |
58
- | direction | String | 'sw' | Sets the direction of the dropdown menu. Pick from 'ne', 'e', 'se', 's', 'sw', or 'w' |
59
-
60
- #### Dropdown.Button
61
-
62
- | Name | Type | Default | Description |
63
- | :------ | :------- | :-----: | :----------------------------------------------------------------------------------------------------------- |
64
- | onClick | Function | none | Use the `onClick` handler to add additional functionality when the button is clicked, such as fetching data. |
65
-
66
- #### Dropdown.Caret
67
-
68
- No additional props.
69
-
70
- #### Dropdown.Item
71
-
72
- No additional props.
@@ -1,49 +0,0 @@
1
- ---
2
- title: DropdownMenu
3
- ---
4
-
5
- A `DropdownMenu` provides an anchor (button by default) that will open a floating menu of selectable items. The menu can be opened and navigated using keyboard or mouse. When an item is selected, the menu will close and the `onChange` callback will be called. If the default anchor button is used, the anchor contents will be updated with the selection.
6
-
7
- ## Example
8
-
9
- ```javascript live noinline
10
- function DemoComponent() {
11
- const items = React.useMemo(
12
- () => [
13
- {text: '🔵 Cyan', id: 5, key: 'cyan'},
14
- {text: '🔴 Magenta', key: 'magenta'},
15
- {text: '🟡 Yellow', key: 'yellow'}
16
- ],
17
- []
18
- )
19
- const [selectedItem, setSelectedItem] = React.useState()
20
-
21
- return (
22
- <DropdownMenu
23
- renderAnchor={({children, 'aria-labelledby': ariaLabelledBy, ...anchorProps}) => (
24
- <DropdownButton aria-labelledby={`favorite-color-label ${ariaLabelledBy}`} {...anchorProps}>
25
- {children}
26
- </DropdownButton>
27
- )}
28
- placeholder="🎨"
29
- items={items}
30
- selectedItem={selectedItem}
31
- onChange={setSelectedItem}
32
- />
33
- )
34
- }
35
-
36
- render(<DemoComponent />)
37
- ```
38
-
39
- ## Component props
40
-
41
- | Name | Type | Default | Description |
42
- | :------------ | :-------------------------------------------- | :---------------: | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
43
- | items | `ItemProps[]` | `undefined` | Required. A list of item objects to display in the menu |
44
- | selectedItem | `ItemInput` | `undefined` | An `ItemProps` item from the list of `items` which is currently selected. This item will receive a checkmark next to it in the menu. |
45
- | onChange? | (item?: ItemInput) => unknown | `undefined` | A callback which receives the selected item or `undefined` when an item is activated in the menu. If the activated item is the same as the current `selectedItem`, `undefined` will be passed. |
46
- | placeholder | `string` | `undefined` | Optional. A placeholder value to display when there is no current selection. |
47
- | renderAnchor | `(props: DropdownButtonProps) => JSX.Element` | `DropdownButton` | Optional. If defined, provided component will be used to render the menu anchor. Will receive the selected `Item` text as `children` prop when an item is activated. |
48
- | renderItem | `(props: ItemProps) => JSX.Element` | `ActionList.Item` | Optional. If defined, each item in `items` will be passed to this function, allowing for custom item rendering. |
49
- | groupMetadata | `GroupProps[]` | `undefined` | Optional. If defined, `DropdownMenu` will group `items` into `ActionList.Group`s separated by `ActionList.Divider` according to their `groupId` property. |
@@ -1,44 +0,0 @@
1
- ---
2
- title: FilterList
3
- ---
4
-
5
- The FilterList component is a menu with filter options that filter the main content of the page.
6
-
7
- ## Default example
8
-
9
- ```jsx live
10
- <FilterList>
11
- <FilterList.Item selected count="32" href="#foo">
12
- First Filter
13
- </FilterList.Item>
14
- <FilterList.Item count="2" href="#bar">
15
- Second Filter
16
- </FilterList.Item>
17
- <FilterList.Item href="#baz">Third Filter</FilterList.Item>
18
- </FilterList>
19
- ```
20
-
21
- ## System props
22
-
23
- <Note variant="warning">
24
-
25
- System props are deprecated in all components except [Box](/Box). Please use the [`sx` prop](/overriding-styles) instead.
26
-
27
- </Note>
28
-
29
- FilterList components get `COMMON` system props. Read our [System Props](/system-props) doc page for a full list of available props.
30
-
31
- ## Component props
32
-
33
- #### FilterList
34
-
35
- `FilterList` does not get any additional props other than the system props mentioned above.
36
-
37
- #### FilterList.Item
38
-
39
- | Name | Type | Default | Description |
40
- | :------- | :------ | :-----: | :--------------------------------------------------------------- |
41
- | count | Number | | Number to be displayed in the list item |
42
- | as | String | `a` | sets the HTML tag for the component |
43
- | selected | Boolean | | Used to set selected style |
44
- | small | Boolean | false | Used to create a smaller version of the standard FilterList.Item |
@@ -1,39 +0,0 @@
1
- ---
2
- title: FilteredSearch
3
- ---
4
-
5
- The FilteredSearch component helps style a Dropdown and a TextInput side-by-side.
6
-
7
- **Note:** You _must_ use a `TextInput` and `Dropdown` (or native `<details>` and `<summary>`) in order for this component to work properly.
8
-
9
- ## Default example
10
-
11
- ```jsx live
12
- <FilteredSearch>
13
- <Dropdown>
14
- <Dropdown.Button>Filter</Dropdown.Button>
15
- <Dropdown.Menu direction="sw">
16
- <Dropdown.Item>Item 1</Dropdown.Item>
17
- <Dropdown.Item>Item 2</Dropdown.Item>
18
- <Dropdown.Item>Item 3</Dropdown.Item>
19
- </Dropdown.Menu>
20
- </Dropdown>
21
- <TextInput icon={SearchIcon} />
22
- </FilteredSearch>
23
- ```
24
-
25
- ## System props
26
-
27
- <Note variant="warning">
28
-
29
- System props are deprecated in all components except [Box](/Box). Please use the [`sx` prop](/overriding-styles) instead.
30
-
31
- </Note>
32
-
33
- FilteredSearch gets `COMMON` system props. Read our [System Props](/system-props) doc page for a full list of available props.
34
-
35
- ## Component props
36
-
37
- #### FilteredSearch.Children
38
-
39
- FilteredSearch is expected to contain a [`Dropdown`](/Dropdown) followed by a [`TextInput`](/TextInput).
@@ -1,44 +0,0 @@
1
- ---
2
- title: Flash
3
- ---
4
-
5
- The Flash component informs users of successful or pending actions.
6
-
7
- ## Default example
8
-
9
- ```jsx live
10
- <>
11
- <Flash>Default Flash</Flash>
12
- <Flash variant="success">Success Flash</Flash>
13
- <Flash variant="warning">Warning Flash</Flash>
14
- <Flash variant="danger">Danger Flash</Flash>
15
- </>
16
- ```
17
-
18
- ## With an icon
19
-
20
- Flash components with icons inside of them will automatically set the correct color for the icon depending on the type of Flash, as well as applying the correct right margin.
21
-
22
- ```jsx live
23
- <Flash variant="success">
24
- <StyledOcticon icon={CheckIcon} />
25
- Success!
26
- </Flash>
27
- ```
28
-
29
- ## System props
30
-
31
- <Note variant="warning">
32
-
33
- System props are deprecated in all components except [Box](/Box). Please use the [`sx` prop](/overriding-styles) instead.
34
-
35
- </Note>
36
-
37
- Flash components get `COMMON` system props. Read our [System Props](/system-props) doc page for a full list of available props.
38
-
39
- ## Component props
40
-
41
- | Name | Type | Default | Description |
42
- | :------ | :------ | :-----: | :----------------------------------------------------------------------------------------------------------------------- |
43
- | full | Boolean | | Creates a full width Flash component |
44
- | variant | String | default | Can be one of `default`, `success`, `warning`, or `danger` - sets the background color and border of the Flash component |
@@ -1,58 +0,0 @@
1
- ---
2
- title: Flex
3
- status: Deprecated
4
- ---
5
-
6
- The `Flex` component behaves the same as the `Box` component except that it has `display: flex` set by default.
7
-
8
- ## Deprecation
9
-
10
- Use [Box](/Box) instead.
11
-
12
- **Before**
13
-
14
- ```jsx
15
- <Flex flexWrap="nowrap">
16
- <Box p={3} color="fg.onEmphasis" bg="accent.emphasis">
17
- Item 1
18
- </Box>
19
- </Flex>
20
- ```
21
-
22
- **After**
23
-
24
- ```jsx
25
- <Box display="flex" flexWrap="nowrap">
26
- <Box p={3} color="fg.onEmphasis" bg="accent.emphasis">
27
- Item 1
28
- </Box>
29
- </Box>
30
- ```
31
-
32
- ## Default example
33
-
34
- ```jsx live
35
- <Box borderWidth="1px" borderStyle="solid" borderColor="border.default" width={300} height={300} borderRadius={0}>
36
- <Flex flexWrap="nowrap">
37
- <Box p={3} color="fg.onEmphasis" bg="accent.emphasis">
38
- Item 1
39
- </Box>
40
- <Box p={3} color="fg.onEmphasis" bg="attention.emphasis">
41
- Item 2
42
- </Box>
43
- <Box p={3} color="fg.onEmphasis" bg="danger.emphasis">
44
- Item 3
45
- </Box>
46
- </Flex>
47
- </Box>
48
- ```
49
-
50
- ## System props
51
-
52
- Flex components get `FLEX`, `COMMON`, and `LAYOUT` system props.
53
-
54
- Read our [System Props](/system-props) doc page for a full list of available props.
55
-
56
- ## Component props
57
-
58
- `Flex` does not get any additional props other than the system props mentioned above.
@@ -1,46 +0,0 @@
1
- ---
2
- title: FormGroup
3
- ---
4
-
5
- Adds styles for multiple form elements used together.
6
-
7
- ## Default example
8
-
9
- ```jsx live
10
- <>
11
- <FormGroup>
12
- <FormGroup.Label htmlFor="example-text">Example text</FormGroup.Label>
13
- <TextInput id="example-text" value="Example Value" />
14
- </FormGroup>
15
-
16
- <FormGroup>
17
- <FormGroup.Label htmlFor="example-text-b">Example text</FormGroup.Label>
18
- <TextInput id="example-text-b" value="Example Value" />
19
- </FormGroup>
20
- </>
21
- ```
22
-
23
- ## System props
24
-
25
- <Note variant="warning">
26
-
27
- System props are deprecated in all components except [Box](/Box). Please use the [`sx` prop](/overriding-styles) instead.
28
-
29
- </Note>
30
-
31
- FormGroup components get `COMMON` system props. FormGroup.Label components get `COMMON` and `TYPOGRAPHY` system props. Read our [System Props](/system-props) doc page for a full list of available props.
32
-
33
- ## Component props
34
-
35
- ### FormGroup
36
-
37
- | Name | Type | Default | Description |
38
- | :--- | :----- | :-----: | :---------------------------------- |
39
- | as | String | `div` | Sets the HTML tag for the component |
40
-
41
- ### FormGroup.Label
42
-
43
- | Name | Type | Default | Description |
44
- | :------ | :----- | :-----: | :----------------------------------------------------------------------------- |
45
- | as | String | `label` | Sets the HTML tag for the component |
46
- | htmlFor | String | | The value of `htmlFor` needs to be the same as the `id` of the input it labels |
@@ -1,59 +0,0 @@
1
- ---
2
- title: Grid
3
- status: Deprecated
4
- ---
5
-
6
- Grid is a component that exposes grid system props. See the [CSS Tricks Complete Guide to Grid](https://css-tricks.com/snippets/css/complete-guide-grid/) to learn more about Grid Layout.
7
-
8
- ## Deprecation
9
-
10
- Use [Box](/Box) instead.
11
-
12
- **Before**
13
-
14
- ```jsx
15
- <Grid gridTemplateColumns="repeat(2, auto)" gridGap={3}>
16
- <Box p={3} color="fg.onEmphasis" bg="accent.emphasis">
17
- 1
18
- </Box>
19
- <Box p={3} color="fg.onEmphasis" bg="attention.emphasis">
20
- 2
21
- </Box>
22
- </Grid>
23
- ```
24
-
25
- **After**
26
-
27
- ```jsx
28
- <Box display="grid" gridTemplateColumns="repeat(2, auto)" gridGap={3}>
29
- <Box p={3} color="fg.onEmphasis" bg="accent.emphasis">
30
- 1
31
- </Box>
32
- <Box p={3} color="fg.onEmphasis" bg="attention.emphasis">
33
- 2
34
- </Box>
35
- </Box>
36
- ```
37
-
38
- ## Default example
39
-
40
- ```jsx live
41
- <Grid gridTemplateColumns="repeat(2, auto)" gridGap={3}>
42
- <Box p={3} color="fg.onEmphasis" bg="accent.emphasis">
43
- 1
44
- </Box>
45
- <Box p={3} color="fg.onEmphasis" bg="attention.emphasis">
46
- 2
47
- </Box>
48
- </Grid>
49
- ```
50
-
51
- ## System props
52
-
53
- Grid components get `GRID`, `COMMON`, and `LAYOUT` system props.
54
-
55
- Read our [System Props](/system-props) doc page for a full list of available props.
56
-
57
- ## Component props
58
-
59
- `Grid` does not get any additional props other than the system props mentioned above.