@primer/components 31.0.2-rc.1e80de40 → 31.1.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 (811) hide show
  1. package/CHANGELOG.md +8 -2
  2. package/dist/browser.esm.js +11 -10
  3. package/dist/browser.esm.js.map +1 -1
  4. package/dist/browser.umd.js +31 -30
  5. package/dist/browser.umd.js.map +1 -1
  6. package/lib/TextInputWithTokens.d.ts +4 -0
  7. package/lib/TextInputWithTokens.js +86 -20
  8. package/lib/_TextInputWrapper.js +1 -1
  9. package/lib-esm/TextInputWithTokens.d.ts +4 -0
  10. package/lib-esm/TextInputWithTokens.js +85 -21
  11. package/lib-esm/_TextInputWrapper.js +1 -1
  12. package/package.json +1 -1
  13. package/.changeset/README.md +0 -8
  14. package/.changeset/config.json +0 -10
  15. package/.devcontainer/devcontainer.json +0 -8
  16. package/.eslintrc.json +0 -137
  17. package/.github/ISSUE_TEMPLATE/bug_report.md +0 -38
  18. package/.github/ISSUE_TEMPLATE/new_component_proposal_template.md +0 -41
  19. package/.github/dependabot.yml +0 -18
  20. package/.github/pull_request_template.md +0 -18
  21. package/.github/workflows/check_for_changeset.yml +0 -25
  22. package/.github/workflows/ci.yml +0 -31
  23. package/.github/workflows/deploy_preview.yml +0 -47
  24. package/.github/workflows/deploy_production.yml +0 -70
  25. package/.github/workflows/release.yml +0 -35
  26. package/.github/workflows/release_canary.yml +0 -70
  27. package/.github/workflows/release_candidate.yml +0 -60
  28. package/.github/workflows/size.yml +0 -13
  29. package/.github/workflows/stale.yml +0 -26
  30. package/.gitignore +0 -10
  31. package/.npmrc +0 -4
  32. package/.nvmrc +0 -1
  33. package/.storybook/main.js +0 -11
  34. package/.storybook/preview.js +0 -113
  35. package/.vscode/launch.json +0 -21
  36. package/.vscode/settings.json +0 -13
  37. package/@types/@styled-system/index.d.ts +0 -0
  38. package/@types/@styled-system/prop-types/index.d.ts +0 -1
  39. package/@types/@styled-system/props/index.d.ts +0 -1
  40. package/@types/jest-styled-components/index.d.ts +0 -1
  41. package/CODEOWNERS +0 -2
  42. package/babel-defines.js +0 -13
  43. package/babel.config.js +0 -39
  44. package/contributor-docs/CODE_OF_CONDUCT.md +0 -76
  45. package/contributor-docs/CONTRIBUTING.md +0 -274
  46. package/contributor-docs/adrs/adr-001-typescript.md +0 -23
  47. package/contributor-docs/adrs/adr-002-behavior-isolation.md +0 -108
  48. package/contributor-docs/adrs/adr-003-prop-norms.md +0 -72
  49. package/contributor-docs/behaviors.md +0 -132
  50. package/contributor-docs/component-contents-api-patterns.md +0 -316
  51. package/contributor-docs/principles.md +0 -39
  52. package/docs/.eslintrc +0 -0
  53. package/docs/.gitignore +0 -91
  54. package/docs/components/PropsList.js +0 -5
  55. package/docs/components/State.js +0 -9
  56. package/docs/components/constants.js +0 -34
  57. package/docs/components/index.js +0 -2
  58. package/docs/content/ActionList.mdx +0 -99
  59. package/docs/content/ActionMenu.mdx +0 -80
  60. package/docs/content/AnchoredOverlay.mdx +0 -37
  61. package/docs/content/Autocomplete.mdx +0 -657
  62. package/docs/content/Avatar.mdx +0 -33
  63. package/docs/content/AvatarStack.mdx +0 -37
  64. package/docs/content/BorderBox.md +0 -46
  65. package/docs/content/Box.md +0 -74
  66. package/docs/content/BranchName.md +0 -18
  67. package/docs/content/Breadcrumbs.md +0 -52
  68. package/docs/content/Buttons.md +0 -56
  69. package/docs/content/CircleBadge.md +0 -45
  70. package/docs/content/CircleOcticon.md +0 -18
  71. package/docs/content/CounterLabel.md +0 -32
  72. package/docs/content/Details.md +0 -105
  73. package/docs/content/Dialog.md +0 -108
  74. package/docs/content/Dialog2.mdx +0 -179
  75. package/docs/content/Dropdown.md +0 -72
  76. package/docs/content/DropdownMenu.mdx +0 -49
  77. package/docs/content/FilterList.md +0 -44
  78. package/docs/content/FilteredSearch.md +0 -39
  79. package/docs/content/Flash.md +0 -44
  80. package/docs/content/Flex.md +0 -58
  81. package/docs/content/FormGroup.md +0 -46
  82. package/docs/content/Grid.md +0 -59
  83. package/docs/content/Header.md +0 -79
  84. package/docs/content/Heading.md +0 -22
  85. package/docs/content/Label.md +0 -42
  86. package/docs/content/LabelGroup.md +0 -31
  87. package/docs/content/Link.md +0 -37
  88. package/docs/content/Overlay.mdx +0 -94
  89. package/docs/content/Pagehead.md +0 -27
  90. package/docs/content/Pagination.md +0 -187
  91. package/docs/content/PointerBox.md +0 -81
  92. package/docs/content/Popover.md +0 -137
  93. package/docs/content/Portal.mdx +0 -78
  94. package/docs/content/Position.md +0 -100
  95. package/docs/content/ProgressBar.mdx +0 -29
  96. package/docs/content/SelectMenu.md +0 -435
  97. package/docs/content/SelectPanel.mdx +0 -67
  98. package/docs/content/SideNav.md +0 -179
  99. package/docs/content/Spinner.mdx +0 -32
  100. package/docs/content/StateLabel.md +0 -35
  101. package/docs/content/StyledOcticon.md +0 -36
  102. package/docs/content/SubNav.md +0 -102
  103. package/docs/content/TabNav.md +0 -50
  104. package/docs/content/Text.md +0 -31
  105. package/docs/content/TextInput.md +0 -34
  106. package/docs/content/TextInputTokens.mdx +0 -89
  107. package/docs/content/TextInputWithTokens.mdx +0 -97
  108. package/docs/content/Timeline.md +0 -138
  109. package/docs/content/Token.mdx +0 -381
  110. package/docs/content/Tooltip.md +0 -41
  111. package/docs/content/Truncate.md +0 -64
  112. package/docs/content/UnderlineNav.md +0 -53
  113. package/docs/content/anchoredPosition.mdx +0 -163
  114. package/docs/content/core-concepts.md +0 -70
  115. package/docs/content/focusTrap.mdx +0 -103
  116. package/docs/content/focusZone.mdx +0 -145
  117. package/docs/content/getting-started.md +0 -138
  118. package/docs/content/index.md +0 -33
  119. package/docs/content/linting.md +0 -35
  120. package/docs/content/overriding-styles.mdx +0 -82
  121. package/docs/content/philosophy.md +0 -23
  122. package/docs/content/primer-theme.md +0 -89
  123. package/docs/content/ssr.mdx +0 -43
  124. package/docs/content/system-props.mdx +0 -37
  125. package/docs/content/theme-reference.md +0 -16
  126. package/docs/content/theming.md +0 -249
  127. package/docs/content/useOnEscapePress.mdx +0 -56
  128. package/docs/content/useOnOutsideClick.mdx +0 -57
  129. package/docs/content/useOpenAndCloseFocus.mdx +0 -49
  130. package/docs/content/useOverlay.mdx +0 -62
  131. package/docs/content/useSafeTimeout.mdx +0 -32
  132. package/docs/gatsby-config.js +0 -30
  133. package/docs/gatsby-node.js +0 -101
  134. package/docs/package-lock.json +0 -20756
  135. package/docs/package.json +0 -36
  136. package/docs/src/@primer/gatsby-theme-doctocat/components/hero.js +0 -23
  137. package/docs/src/@primer/gatsby-theme-doctocat/components/live-preview-wrapper.js +0 -41
  138. package/docs/src/@primer/gatsby-theme-doctocat/live-code-scope.js +0 -56
  139. package/docs/src/@primer/gatsby-theme-doctocat/nav.yml +0 -133
  140. package/docs/src/@primer/gatsby-theme-doctocat/primer-components-hero.svg +0 -1411
  141. package/docs/src/props.js +0 -77
  142. package/jest.config.js +0 -13
  143. package/lib/__tests__/ActionList.test.d.ts +0 -1
  144. package/lib/__tests__/ActionList.test.js +0 -69
  145. package/lib/__tests__/ActionList.types.test.d.ts +0 -6
  146. package/lib/__tests__/ActionList.types.test.js +0 -69
  147. package/lib/__tests__/ActionMenu.test.d.ts +0 -1
  148. package/lib/__tests__/ActionMenu.test.js +0 -151
  149. package/lib/__tests__/AnchoredOverlay.test.d.ts +0 -1
  150. package/lib/__tests__/AnchoredOverlay.test.js +0 -160
  151. package/lib/__tests__/Autocomplete.test.d.ts +0 -1
  152. package/lib/__tests__/Autocomplete.test.js +0 -528
  153. package/lib/__tests__/Avatar.test.d.ts +0 -1
  154. package/lib/__tests__/Avatar.test.js +0 -67
  155. package/lib/__tests__/AvatarStack.test.d.ts +0 -1
  156. package/lib/__tests__/AvatarStack.test.js +0 -71
  157. package/lib/__tests__/BorderBox.test.d.ts +0 -1
  158. package/lib/__tests__/BorderBox.test.js +0 -58
  159. package/lib/__tests__/Box.test.d.ts +0 -1
  160. package/lib/__tests__/Box.test.js +0 -78
  161. package/lib/__tests__/BranchName.test.d.ts +0 -1
  162. package/lib/__tests__/BranchName.test.js +0 -36
  163. package/lib/__tests__/Breadcrumbs.test.d.ts +0 -1
  164. package/lib/__tests__/Breadcrumbs.test.js +0 -37
  165. package/lib/__tests__/BreadcrumbsItem.test.d.ts +0 -1
  166. package/lib/__tests__/BreadcrumbsItem.test.js +0 -49
  167. package/lib/__tests__/Button.test.d.ts +0 -1
  168. package/lib/__tests__/Button.test.js +0 -143
  169. package/lib/__tests__/Caret.test.d.ts +0 -1
  170. package/lib/__tests__/Caret.test.js +0 -52
  171. package/lib/__tests__/CircleBadge.test.d.ts +0 -1
  172. package/lib/__tests__/CircleBadge.test.js +0 -83
  173. package/lib/__tests__/CircleOcticon.test.d.ts +0 -1
  174. package/lib/__tests__/CircleOcticon.test.js +0 -71
  175. package/lib/__tests__/ConfirmationDialog.test.d.ts +0 -1
  176. package/lib/__tests__/ConfirmationDialog.test.js +0 -134
  177. package/lib/__tests__/CounterLabel.test.d.ts +0 -1
  178. package/lib/__tests__/CounterLabel.test.js +0 -58
  179. package/lib/__tests__/Details.test.d.ts +0 -1
  180. package/lib/__tests__/Details.test.js +0 -117
  181. package/lib/__tests__/Dialog.test.d.ts +0 -1
  182. package/lib/__tests__/Dialog.test.js +0 -184
  183. package/lib/__tests__/Dropdown.test.d.ts +0 -1
  184. package/lib/__tests__/Dropdown.test.js +0 -63
  185. package/lib/__tests__/DropdownMenu.test.d.ts +0 -1
  186. package/lib/__tests__/DropdownMenu.test.js +0 -150
  187. package/lib/__tests__/FilterList.test.d.ts +0 -1
  188. package/lib/__tests__/FilterList.test.js +0 -36
  189. package/lib/__tests__/FilterListItem.test.d.ts +0 -1
  190. package/lib/__tests__/FilterListItem.test.js +0 -46
  191. package/lib/__tests__/FilteredSearch.test.d.ts +0 -1
  192. package/lib/__tests__/FilteredSearch.test.js +0 -36
  193. package/lib/__tests__/Flash.test.d.ts +0 -1
  194. package/lib/__tests__/Flash.test.js +0 -62
  195. package/lib/__tests__/Flex.test.d.ts +0 -1
  196. package/lib/__tests__/Flex.test.js +0 -74
  197. package/lib/__tests__/FormGroup.test.d.ts +0 -1
  198. package/lib/__tests__/FormGroup.test.js +0 -54
  199. package/lib/__tests__/Grid.test.d.ts +0 -1
  200. package/lib/__tests__/Grid.test.js +0 -104
  201. package/lib/__tests__/Header.test.d.ts +0 -1
  202. package/lib/__tests__/Header.test.js +0 -58
  203. package/lib/__tests__/Heading.test.d.ts +0 -1
  204. package/lib/__tests__/Heading.test.js +0 -109
  205. package/lib/__tests__/Label.test.d.ts +0 -1
  206. package/lib/__tests__/Label.test.js +0 -46
  207. package/lib/__tests__/LabelGroup.test.d.ts +0 -1
  208. package/lib/__tests__/LabelGroup.test.js +0 -38
  209. package/lib/__tests__/Link.test.d.ts +0 -1
  210. package/lib/__tests__/Link.test.js +0 -70
  211. package/lib/__tests__/Merge.types.test.d.ts +0 -30
  212. package/lib/__tests__/Merge.types.test.js +0 -27
  213. package/lib/__tests__/Overlay.test.d.ts +0 -1
  214. package/lib/__tests__/Overlay.test.js +0 -145
  215. package/lib/__tests__/Pagehead.test.d.ts +0 -1
  216. package/lib/__tests__/Pagehead.test.js +0 -37
  217. package/lib/__tests__/Pagination/Pagination.test.d.ts +0 -1
  218. package/lib/__tests__/Pagination/Pagination.test.js +0 -47
  219. package/lib/__tests__/Pagination/PaginationModel.test.d.ts +0 -1
  220. package/lib/__tests__/Pagination/PaginationModel.test.js +0 -186
  221. package/lib/__tests__/PointerBox.test.d.ts +0 -1
  222. package/lib/__tests__/PointerBox.test.js +0 -46
  223. package/lib/__tests__/Popover.test.d.ts +0 -1
  224. package/lib/__tests__/Popover.test.js +0 -66
  225. package/lib/__tests__/Portal.test.d.ts +0 -1
  226. package/lib/__tests__/Portal.test.js +0 -124
  227. package/lib/__tests__/Position.test.d.ts +0 -1
  228. package/lib/__tests__/Position.test.js +0 -143
  229. package/lib/__tests__/ProgressBar.test.d.ts +0 -1
  230. package/lib/__tests__/ProgressBar.test.js +0 -68
  231. package/lib/__tests__/SelectMenu.test.d.ts +0 -1
  232. package/lib/__tests__/SelectMenu.test.js +0 -155
  233. package/lib/__tests__/SelectPanel.test.d.ts +0 -1
  234. package/lib/__tests__/SelectPanel.test.js +0 -80
  235. package/lib/__tests__/SideNav.test.d.ts +0 -1
  236. package/lib/__tests__/SideNav.test.js +0 -71
  237. package/lib/__tests__/Spinner.test.d.ts +0 -1
  238. package/lib/__tests__/Spinner.test.js +0 -53
  239. package/lib/__tests__/StateLabel.test.d.ts +0 -1
  240. package/lib/__tests__/StateLabel.test.js +0 -71
  241. package/lib/__tests__/StyledOcticon.test.d.ts +0 -1
  242. package/lib/__tests__/StyledOcticon.test.js +0 -40
  243. package/lib/__tests__/SubNav.test.d.ts +0 -1
  244. package/lib/__tests__/SubNav.test.js +0 -62
  245. package/lib/__tests__/SubNavLink.test.d.ts +0 -1
  246. package/lib/__tests__/SubNavLink.test.js +0 -49
  247. package/lib/__tests__/TabNav.test.d.ts +0 -1
  248. package/lib/__tests__/TabNav.test.js +0 -49
  249. package/lib/__tests__/Text.test.d.ts +0 -1
  250. package/lib/__tests__/Text.test.js +0 -105
  251. package/lib/__tests__/TextInput.test.d.ts +0 -1
  252. package/lib/__tests__/TextInput.test.js +0 -78
  253. package/lib/__tests__/TextInputWithTokens.test.d.ts +0 -1
  254. package/lib/__tests__/TextInputWithTokens.test.js +0 -389
  255. package/lib/__tests__/ThemeProvider.test.d.ts +0 -1
  256. package/lib/__tests__/ThemeProvider.test.js +0 -444
  257. package/lib/__tests__/Timeline.test.d.ts +0 -1
  258. package/lib/__tests__/Timeline.test.js +0 -75
  259. package/lib/__tests__/Token.test.d.ts +0 -1
  260. package/lib/__tests__/Token.test.js +0 -180
  261. package/lib/__tests__/Tooltip.test.d.ts +0 -1
  262. package/lib/__tests__/Tooltip.test.js +0 -69
  263. package/lib/__tests__/Truncate.test.d.ts +0 -1
  264. package/lib/__tests__/Truncate.test.js +0 -63
  265. package/lib/__tests__/UnderlineNav.test.d.ts +0 -1
  266. package/lib/__tests__/UnderlineNav.test.js +0 -72
  267. package/lib/__tests__/UnderlineNavLink.test.d.ts +0 -1
  268. package/lib/__tests__/UnderlineNavLink.test.js +0 -51
  269. package/lib/__tests__/behaviors/anchoredPosition.test.d.ts +0 -1
  270. package/lib/__tests__/behaviors/anchoredPosition.test.js +0 -390
  271. package/lib/__tests__/behaviors/focusTrap.test.d.ts +0 -1
  272. package/lib/__tests__/behaviors/focusTrap.test.js +0 -234
  273. package/lib/__tests__/behaviors/focusZone.test.d.ts +0 -1
  274. package/lib/__tests__/behaviors/focusZone.test.js +0 -570
  275. package/lib/__tests__/behaviors/iterateFocusableElements.test.d.ts +0 -1
  276. package/lib/__tests__/behaviors/iterateFocusableElements.test.js +0 -55
  277. package/lib/__tests__/behaviors/scrollIntoViewingArea.test.d.ts +0 -1
  278. package/lib/__tests__/behaviors/scrollIntoViewingArea.test.js +0 -226
  279. package/lib/__tests__/filterObject.test.d.ts +0 -1
  280. package/lib/__tests__/filterObject.test.js +0 -30
  281. package/lib/__tests__/hooks/useAnchoredPosition.test.d.ts +0 -1
  282. package/lib/__tests__/hooks/useAnchoredPosition.test.js +0 -54
  283. package/lib/__tests__/hooks/useOnEscapePress.test.d.ts +0 -1
  284. package/lib/__tests__/hooks/useOnEscapePress.test.js +0 -32
  285. package/lib/__tests__/hooks/useOnOutsideClick.test.d.ts +0 -1
  286. package/lib/__tests__/hooks/useOnOutsideClick.test.js +0 -87
  287. package/lib/__tests__/hooks/useOpenAndCloseFocus.test.d.ts +0 -1
  288. package/lib/__tests__/hooks/useOpenAndCloseFocus.test.js +0 -60
  289. package/lib/__tests__/hooks/useProvidedStateOrCreate.test.d.ts +0 -1
  290. package/lib/__tests__/hooks/useProvidedStateOrCreate.test.js +0 -45
  291. package/lib/__tests__/theme.test.d.ts +0 -1
  292. package/lib/__tests__/theme.test.js +0 -36
  293. package/lib/__tests__/themeGet.test.d.ts +0 -1
  294. package/lib/__tests__/themeGet.test.js +0 -25
  295. package/lib/__tests__/useSafeTimeout.test.d.ts +0 -1
  296. package/lib/__tests__/useSafeTimeout.test.js +0 -45
  297. package/lib/stories/ActionList.stories.js +0 -454
  298. package/lib/stories/ActionMenu.stories.js +0 -350
  299. package/lib/stories/AnchoredOverlay.stories.js +0 -127
  300. package/lib/stories/Autocomplete.stories.js +0 -619
  301. package/lib/stories/AvatarStack.stories.js +0 -49
  302. package/lib/stories/Button.stories.js +0 -125
  303. package/lib/stories/ConfirmationDialog.stories.js +0 -111
  304. package/lib/stories/Dialog.stories.js +0 -265
  305. package/lib/stories/DropdownMenu.stories.js +0 -122
  306. package/lib/stories/IssueLabelToken.stories.js +0 -165
  307. package/lib/stories/Overlay.stories.js +0 -204
  308. package/lib/stories/Portal.stories.js +0 -104
  309. package/lib/stories/ProfileToken.stories.js +0 -162
  310. package/lib/stories/SelectPanel.stories.js +0 -399
  311. package/lib/stories/TextInputWithTokens.stories.js +0 -235
  312. package/lib/stories/ThemeProvider.stories.js +0 -102
  313. package/lib/stories/Token.stories.js +0 -159
  314. package/lib/stories/useAnchoredPosition.stories.js +0 -351
  315. package/lib/stories/useFocusTrap.stories.js +0 -356
  316. package/lib/stories/useFocusZone.stories.js +0 -599
  317. package/lib-esm/__tests__/ActionList.test.d.ts +0 -1
  318. package/lib-esm/__tests__/ActionList.test.js +0 -57
  319. package/lib-esm/__tests__/ActionList.types.test.d.ts +0 -6
  320. package/lib-esm/__tests__/ActionList.types.test.js +0 -45
  321. package/lib-esm/__tests__/ActionMenu.test.d.ts +0 -1
  322. package/lib-esm/__tests__/ActionMenu.test.js +0 -139
  323. package/lib-esm/__tests__/AnchoredOverlay.test.d.ts +0 -1
  324. package/lib-esm/__tests__/AnchoredOverlay.test.js +0 -134
  325. package/lib-esm/__tests__/Autocomplete.test.d.ts +0 -1
  326. package/lib-esm/__tests__/Autocomplete.test.js +0 -494
  327. package/lib-esm/__tests__/Avatar.test.d.ts +0 -1
  328. package/lib-esm/__tests__/Avatar.test.js +0 -56
  329. package/lib-esm/__tests__/AvatarStack.test.d.ts +0 -1
  330. package/lib-esm/__tests__/AvatarStack.test.js +0 -58
  331. package/lib-esm/__tests__/BorderBox.test.d.ts +0 -1
  332. package/lib-esm/__tests__/BorderBox.test.js +0 -47
  333. package/lib-esm/__tests__/Box.test.d.ts +0 -1
  334. package/lib-esm/__tests__/Box.test.js +0 -67
  335. package/lib-esm/__tests__/BranchName.test.d.ts +0 -1
  336. package/lib-esm/__tests__/BranchName.test.js +0 -26
  337. package/lib-esm/__tests__/Breadcrumbs.test.d.ts +0 -1
  338. package/lib-esm/__tests__/Breadcrumbs.test.js +0 -27
  339. package/lib-esm/__tests__/BreadcrumbsItem.test.d.ts +0 -1
  340. package/lib-esm/__tests__/BreadcrumbsItem.test.js +0 -39
  341. package/lib-esm/__tests__/Button.test.d.ts +0 -1
  342. package/lib-esm/__tests__/Button.test.js +0 -133
  343. package/lib-esm/__tests__/Caret.test.d.ts +0 -1
  344. package/lib-esm/__tests__/Caret.test.js +0 -42
  345. package/lib-esm/__tests__/CircleBadge.test.d.ts +0 -1
  346. package/lib-esm/__tests__/CircleBadge.test.js +0 -70
  347. package/lib-esm/__tests__/CircleOcticon.test.d.ts +0 -1
  348. package/lib-esm/__tests__/CircleOcticon.test.js +0 -59
  349. package/lib-esm/__tests__/ConfirmationDialog.test.d.ts +0 -1
  350. package/lib-esm/__tests__/ConfirmationDialog.test.js +0 -113
  351. package/lib-esm/__tests__/CounterLabel.test.d.ts +0 -1
  352. package/lib-esm/__tests__/CounterLabel.test.js +0 -47
  353. package/lib-esm/__tests__/Details.test.d.ts +0 -1
  354. package/lib-esm/__tests__/Details.test.js +0 -107
  355. package/lib-esm/__tests__/Dialog.test.d.ts +0 -1
  356. package/lib-esm/__tests__/Dialog.test.js +0 -171
  357. package/lib-esm/__tests__/Dropdown.test.d.ts +0 -1
  358. package/lib-esm/__tests__/Dropdown.test.js +0 -53
  359. package/lib-esm/__tests__/DropdownMenu.test.d.ts +0 -1
  360. package/lib-esm/__tests__/DropdownMenu.test.js +0 -137
  361. package/lib-esm/__tests__/FilterList.test.d.ts +0 -1
  362. package/lib-esm/__tests__/FilterList.test.js +0 -26
  363. package/lib-esm/__tests__/FilterListItem.test.d.ts +0 -1
  364. package/lib-esm/__tests__/FilterListItem.test.js +0 -36
  365. package/lib-esm/__tests__/FilteredSearch.test.d.ts +0 -1
  366. package/lib-esm/__tests__/FilteredSearch.test.js +0 -26
  367. package/lib-esm/__tests__/Flash.test.d.ts +0 -1
  368. package/lib-esm/__tests__/Flash.test.js +0 -51
  369. package/lib-esm/__tests__/Flex.test.d.ts +0 -1
  370. package/lib-esm/__tests__/Flex.test.js +0 -64
  371. package/lib-esm/__tests__/FormGroup.test.d.ts +0 -1
  372. package/lib-esm/__tests__/FormGroup.test.js +0 -44
  373. package/lib-esm/__tests__/Grid.test.d.ts +0 -1
  374. package/lib-esm/__tests__/Grid.test.js +0 -94
  375. package/lib-esm/__tests__/Header.test.d.ts +0 -1
  376. package/lib-esm/__tests__/Header.test.js +0 -48
  377. package/lib-esm/__tests__/Heading.test.d.ts +0 -1
  378. package/lib-esm/__tests__/Heading.test.js +0 -99
  379. package/lib-esm/__tests__/Label.test.d.ts +0 -1
  380. package/lib-esm/__tests__/Label.test.js +0 -36
  381. package/lib-esm/__tests__/LabelGroup.test.d.ts +0 -1
  382. package/lib-esm/__tests__/LabelGroup.test.js +0 -26
  383. package/lib-esm/__tests__/Link.test.d.ts +0 -1
  384. package/lib-esm/__tests__/Link.test.js +0 -60
  385. package/lib-esm/__tests__/Merge.types.test.d.ts +0 -30
  386. package/lib-esm/__tests__/Merge.types.test.js +0 -14
  387. package/lib-esm/__tests__/Overlay.test.d.ts +0 -1
  388. package/lib-esm/__tests__/Overlay.test.js +0 -123
  389. package/lib-esm/__tests__/Pagehead.test.d.ts +0 -1
  390. package/lib-esm/__tests__/Pagehead.test.js +0 -26
  391. package/lib-esm/__tests__/Pagination/Pagination.test.d.ts +0 -1
  392. package/lib-esm/__tests__/Pagination/Pagination.test.js +0 -35
  393. package/lib-esm/__tests__/Pagination/PaginationModel.test.d.ts +0 -1
  394. package/lib-esm/__tests__/Pagination/PaginationModel.test.js +0 -182
  395. package/lib-esm/__tests__/PointerBox.test.d.ts +0 -1
  396. package/lib-esm/__tests__/PointerBox.test.js +0 -36
  397. package/lib-esm/__tests__/Popover.test.d.ts +0 -1
  398. package/lib-esm/__tests__/Popover.test.js +0 -53
  399. package/lib-esm/__tests__/Portal.test.d.ts +0 -1
  400. package/lib-esm/__tests__/Portal.test.js +0 -104
  401. package/lib-esm/__tests__/Position.test.d.ts +0 -1
  402. package/lib-esm/__tests__/Position.test.js +0 -133
  403. package/lib-esm/__tests__/ProgressBar.test.d.ts +0 -1
  404. package/lib-esm/__tests__/ProgressBar.test.js +0 -58
  405. package/lib-esm/__tests__/SelectMenu.test.d.ts +0 -1
  406. package/lib-esm/__tests__/SelectMenu.test.js +0 -145
  407. package/lib-esm/__tests__/SelectPanel.test.d.ts +0 -1
  408. package/lib-esm/__tests__/SelectPanel.test.js +0 -65
  409. package/lib-esm/__tests__/SideNav.test.d.ts +0 -1
  410. package/lib-esm/__tests__/SideNav.test.js +0 -60
  411. package/lib-esm/__tests__/Spinner.test.d.ts +0 -1
  412. package/lib-esm/__tests__/Spinner.test.js +0 -43
  413. package/lib-esm/__tests__/StateLabel.test.d.ts +0 -1
  414. package/lib-esm/__tests__/StateLabel.test.js +0 -61
  415. package/lib-esm/__tests__/StyledOcticon.test.d.ts +0 -1
  416. package/lib-esm/__tests__/StyledOcticon.test.js +0 -29
  417. package/lib-esm/__tests__/SubNav.test.d.ts +0 -1
  418. package/lib-esm/__tests__/SubNav.test.js +0 -50
  419. package/lib-esm/__tests__/SubNavLink.test.d.ts +0 -1
  420. package/lib-esm/__tests__/SubNavLink.test.js +0 -39
  421. package/lib-esm/__tests__/TabNav.test.d.ts +0 -1
  422. package/lib-esm/__tests__/TabNav.test.js +0 -39
  423. package/lib-esm/__tests__/Text.test.d.ts +0 -1
  424. package/lib-esm/__tests__/Text.test.js +0 -93
  425. package/lib-esm/__tests__/TextInput.test.d.ts +0 -1
  426. package/lib-esm/__tests__/TextInput.test.js +0 -68
  427. package/lib-esm/__tests__/TextInputWithTokens.test.d.ts +0 -1
  428. package/lib-esm/__tests__/TextInputWithTokens.test.js +0 -341
  429. package/lib-esm/__tests__/ThemeProvider.test.d.ts +0 -1
  430. package/lib-esm/__tests__/ThemeProvider.test.js +0 -408
  431. package/lib-esm/__tests__/Timeline.test.d.ts +0 -1
  432. package/lib-esm/__tests__/Timeline.test.js +0 -65
  433. package/lib-esm/__tests__/Token.test.d.ts +0 -1
  434. package/lib-esm/__tests__/Token.test.js +0 -166
  435. package/lib-esm/__tests__/Tooltip.test.d.ts +0 -1
  436. package/lib-esm/__tests__/Tooltip.test.js +0 -59
  437. package/lib-esm/__tests__/Truncate.test.d.ts +0 -1
  438. package/lib-esm/__tests__/Truncate.test.js +0 -53
  439. package/lib-esm/__tests__/UnderlineNav.test.d.ts +0 -1
  440. package/lib-esm/__tests__/UnderlineNav.test.js +0 -60
  441. package/lib-esm/__tests__/UnderlineNavLink.test.d.ts +0 -1
  442. package/lib-esm/__tests__/UnderlineNavLink.test.js +0 -41
  443. package/lib-esm/__tests__/behaviors/anchoredPosition.test.d.ts +0 -1
  444. package/lib-esm/__tests__/behaviors/anchoredPosition.test.js +0 -388
  445. package/lib-esm/__tests__/behaviors/focusTrap.test.d.ts +0 -1
  446. package/lib-esm/__tests__/behaviors/focusTrap.test.js +0 -227
  447. package/lib-esm/__tests__/behaviors/focusZone.test.d.ts +0 -1
  448. package/lib-esm/__tests__/behaviors/focusZone.test.js +0 -487
  449. package/lib-esm/__tests__/behaviors/iterateFocusableElements.test.d.ts +0 -1
  450. package/lib-esm/__tests__/behaviors/iterateFocusableElements.test.js +0 -48
  451. package/lib-esm/__tests__/behaviors/scrollIntoViewingArea.test.d.ts +0 -1
  452. package/lib-esm/__tests__/behaviors/scrollIntoViewingArea.test.js +0 -224
  453. package/lib-esm/__tests__/filterObject.test.d.ts +0 -1
  454. package/lib-esm/__tests__/filterObject.test.js +0 -27
  455. package/lib-esm/__tests__/hooks/useAnchoredPosition.test.d.ts +0 -1
  456. package/lib-esm/__tests__/hooks/useAnchoredPosition.test.js +0 -46
  457. package/lib-esm/__tests__/hooks/useOnEscapePress.test.d.ts +0 -1
  458. package/lib-esm/__tests__/hooks/useOnEscapePress.test.js +0 -23
  459. package/lib-esm/__tests__/hooks/useOnOutsideClick.test.d.ts +0 -1
  460. package/lib-esm/__tests__/hooks/useOnOutsideClick.test.js +0 -68
  461. package/lib-esm/__tests__/hooks/useOpenAndCloseFocus.test.d.ts +0 -1
  462. package/lib-esm/__tests__/hooks/useOpenAndCloseFocus.test.js +0 -52
  463. package/lib-esm/__tests__/hooks/useProvidedStateOrCreate.test.d.ts +0 -1
  464. package/lib-esm/__tests__/hooks/useProvidedStateOrCreate.test.js +0 -36
  465. package/lib-esm/__tests__/theme.test.d.ts +0 -1
  466. package/lib-esm/__tests__/theme.test.js +0 -33
  467. package/lib-esm/__tests__/themeGet.test.d.ts +0 -1
  468. package/lib-esm/__tests__/themeGet.test.js +0 -22
  469. package/lib-esm/__tests__/useSafeTimeout.test.d.ts +0 -1
  470. package/lib-esm/__tests__/useSafeTimeout.test.js +0 -39
  471. package/lib-esm/stories/ActionList.stories.js +0 -395
  472. package/lib-esm/stories/ActionMenu.stories.js +0 -305
  473. package/lib-esm/stories/AnchoredOverlay.stories.js +0 -101
  474. package/lib-esm/stories/Autocomplete.stories.js +0 -560
  475. package/lib-esm/stories/AvatarStack.stories.js +0 -32
  476. package/lib-esm/stories/Button.stories.js +0 -86
  477. package/lib-esm/stories/ConfirmationDialog.stories.js +0 -86
  478. package/lib-esm/stories/Dialog.stories.js +0 -240
  479. package/lib-esm/stories/DropdownMenu.stories.js +0 -94
  480. package/lib-esm/stories/IssueLabelToken.stories.js +0 -139
  481. package/lib-esm/stories/Overlay.stories.js +0 -173
  482. package/lib-esm/stories/Portal.stories.js +0 -68
  483. package/lib-esm/stories/ProfileToken.stories.js +0 -136
  484. package/lib-esm/stories/SelectPanel.stories.js +0 -334
  485. package/lib-esm/stories/TextInputWithTokens.stories.js +0 -196
  486. package/lib-esm/stories/ThemeProvider.stories.js +0 -83
  487. package/lib-esm/stories/Token.stories.js +0 -133
  488. package/lib-esm/stories/useAnchoredPosition.stories.js +0 -313
  489. package/lib-esm/stories/useFocusTrap.stories.js +0 -309
  490. package/lib-esm/stories/useFocusZone.stories.js +0 -554
  491. package/migrating.md +0 -250
  492. package/now.json +0 -17
  493. package/package-lock.json +0 -28456
  494. package/rollup.config.js +0 -36
  495. package/script/build +0 -19
  496. package/script/build-storybook +0 -10
  497. package/script/setup +0 -12
  498. package/src/ActionList/Divider.tsx +0 -25
  499. package/src/ActionList/Group.tsx +0 -45
  500. package/src/ActionList/Header.tsx +0 -74
  501. package/src/ActionList/Item.tsx +0 -496
  502. package/src/ActionList/List.tsx +0 -258
  503. package/src/ActionList/index.ts +0 -21
  504. package/src/ActionMenu.tsx +0 -106
  505. package/src/AnchoredOverlay/AnchoredOverlay.tsx +0 -191
  506. package/src/AnchoredOverlay/index.ts +0 -2
  507. package/src/Autocomplete/Autocomplete.tsx +0 -103
  508. package/src/Autocomplete/AutocompleteContext.tsx +0 -19
  509. package/src/Autocomplete/AutocompleteInput.tsx +0 -179
  510. package/src/Autocomplete/AutocompleteMenu.tsx +0 -341
  511. package/src/Autocomplete/AutocompleteOverlay.tsx +0 -68
  512. package/src/Autocomplete/index.ts +0 -2
  513. package/src/Avatar.tsx +0 -46
  514. package/src/AvatarPair.tsx +0 -35
  515. package/src/AvatarStack.tsx +0 -159
  516. package/src/BaseStyles.tsx +0 -53
  517. package/src/BorderBox.tsx +0 -18
  518. package/src/Box.tsx +0 -54
  519. package/src/BranchName.tsx +0 -19
  520. package/src/Breadcrumbs.tsx +0 -101
  521. package/src/Button/Button.tsx +0 -40
  522. package/src/Button/ButtonBase.tsx +0 -43
  523. package/src/Button/ButtonClose.tsx +0 -40
  524. package/src/Button/ButtonDanger.tsx +0 -43
  525. package/src/Button/ButtonGroup.tsx +0 -55
  526. package/src/Button/ButtonInvisible.tsx +0 -32
  527. package/src/Button/ButtonOutline.tsx +0 -43
  528. package/src/Button/ButtonPrimary.tsx +0 -41
  529. package/src/Button/ButtonStyles.tsx +0 -36
  530. package/src/Button/ButtonTableList.tsx +0 -58
  531. package/src/Button/index.ts +0 -16
  532. package/src/Caret.tsx +0 -133
  533. package/src/CircleBadge.tsx +0 -55
  534. package/src/CircleOcticon.tsx +0 -37
  535. package/src/CounterLabel.tsx +0 -52
  536. package/src/Details.tsx +0 -23
  537. package/src/Dialog/ConfirmationDialog.tsx +0 -184
  538. package/src/Dialog/Dialog.tsx +0 -432
  539. package/src/Dialog.tsx +0 -149
  540. package/src/Dropdown.tsx +0 -158
  541. package/src/DropdownMenu/DropdownButton.tsx +0 -15
  542. package/src/DropdownMenu/DropdownMenu.tsx +0 -115
  543. package/src/DropdownMenu/index.ts +0 -4
  544. package/src/DropdownStyles.ts +0 -128
  545. package/src/FilterList.tsx +0 -81
  546. package/src/FilteredActionList/FilteredActionList.tsx +0 -142
  547. package/src/FilteredActionList/index.ts +0 -2
  548. package/src/FilteredSearch.tsx +0 -28
  549. package/src/Flash.tsx +0 -77
  550. package/src/Flex.tsx +0 -15
  551. package/src/FormGroup.tsx +0 -27
  552. package/src/Grid.tsx +0 -15
  553. package/src/Header.tsx +0 -84
  554. package/src/Heading.tsx +0 -21
  555. package/src/Label.tsx +0 -75
  556. package/src/LabelGroup.tsx +0 -18
  557. package/src/Link.tsx +0 -46
  558. package/src/Overlay.tsx +0 -197
  559. package/src/Pagehead.tsx +0 -17
  560. package/src/Pagination/Pagination.tsx +0 -214
  561. package/src/Pagination/index.ts +0 -4
  562. package/src/Pagination/model.tsx +0 -187
  563. package/src/PointerBox.tsx +0 -31
  564. package/src/Popover.tsx +0 -236
  565. package/src/Portal/Portal.tsx +0 -96
  566. package/src/Portal/index.ts +0 -5
  567. package/src/Position.tsx +0 -63
  568. package/src/ProgressBar.tsx +0 -52
  569. package/src/SelectMenu/SelectMenu.tsx +0 -125
  570. package/src/SelectMenu/SelectMenuContext.tsx +0 -9
  571. package/src/SelectMenu/SelectMenuDivider.tsx +0 -25
  572. package/src/SelectMenu/SelectMenuFilter.tsx +0 -51
  573. package/src/SelectMenu/SelectMenuFooter.tsx +0 -28
  574. package/src/SelectMenu/SelectMenuHeader.tsx +0 -50
  575. package/src/SelectMenu/SelectMenuItem.tsx +0 -137
  576. package/src/SelectMenu/SelectMenuList.tsx +0 -42
  577. package/src/SelectMenu/SelectMenuLoadingAnimation.tsx +0 -24
  578. package/src/SelectMenu/SelectMenuModal.tsx +0 -121
  579. package/src/SelectMenu/SelectMenuTab.tsx +0 -88
  580. package/src/SelectMenu/SelectMenuTabPanel.tsx +0 -30
  581. package/src/SelectMenu/SelectMenuTabs.tsx +0 -44
  582. package/src/SelectMenu/hooks/useKeyboardNav.js +0 -90
  583. package/src/SelectMenu/index.ts +0 -15
  584. package/src/SelectPanel/SelectPanel.tsx +0 -173
  585. package/src/SelectPanel/index.ts +0 -2
  586. package/src/SideNav.tsx +0 -193
  587. package/src/Spinner.tsx +0 -59
  588. package/src/StateLabel.tsx +0 -102
  589. package/src/StyledOcticon.tsx +0 -24
  590. package/src/SubNav.tsx +0 -129
  591. package/src/TabNav.tsx +0 -77
  592. package/src/Text.tsx +0 -13
  593. package/src/TextInput.tsx +0 -68
  594. package/src/TextInputWithTokens.tsx +0 -280
  595. package/src/ThemeProvider.tsx +0 -176
  596. package/src/Timeline.tsx +0 -141
  597. package/src/Token/AvatarToken.tsx +0 -54
  598. package/src/Token/IssueLabelToken.tsx +0 -150
  599. package/src/Token/Token.tsx +0 -126
  600. package/src/Token/TokenBase.tsx +0 -129
  601. package/src/Token/_RemoveTokenButton.tsx +0 -111
  602. package/src/Token/_TokenTextContainer.tsx +0 -47
  603. package/src/Token/index.ts +0 -3
  604. package/src/Tooltip.tsx +0 -263
  605. package/src/Truncate.tsx +0 -36
  606. package/src/UnderlineNav.tsx +0 -110
  607. package/src/_TextInputWrapper.tsx +0 -105
  608. package/src/_UnstyledTextInput.tsx +0 -19
  609. package/src/__tests__/.eslintrc.json +0 -11
  610. package/src/__tests__/ActionList.test.tsx +0 -53
  611. package/src/__tests__/ActionList.types.test.tsx +0 -51
  612. package/src/__tests__/ActionMenu.test.tsx +0 -136
  613. package/src/__tests__/AnchoredOverlay.test.tsx +0 -150
  614. package/src/__tests__/Autocomplete.test.tsx +0 -444
  615. package/src/__tests__/Avatar.test.tsx +0 -44
  616. package/src/__tests__/AvatarStack.test.tsx +0 -48
  617. package/src/__tests__/BorderBox.test.tsx +0 -43
  618. package/src/__tests__/Box.test.tsx +0 -42
  619. package/src/__tests__/BranchName.test.tsx +0 -26
  620. package/src/__tests__/Breadcrumbs.test.tsx +0 -27
  621. package/src/__tests__/BreadcrumbsItem.test.tsx +0 -31
  622. package/src/__tests__/Button.test.tsx +0 -128
  623. package/src/__tests__/Caret.test.tsx +0 -36
  624. package/src/__tests__/CircleBadge.test.tsx +0 -66
  625. package/src/__tests__/CircleOcticon.test.tsx +0 -50
  626. package/src/__tests__/ConfirmationDialog.test.tsx +0 -120
  627. package/src/__tests__/CounterLabel.test.tsx +0 -50
  628. package/src/__tests__/Details.test.tsx +0 -115
  629. package/src/__tests__/Dialog.test.tsx +0 -155
  630. package/src/__tests__/Dropdown.test.tsx +0 -53
  631. package/src/__tests__/DropdownMenu.test.tsx +0 -136
  632. package/src/__tests__/FilterList.test.tsx +0 -26
  633. package/src/__tests__/FilterListItem.test.tsx +0 -31
  634. package/src/__tests__/FilteredSearch.test.tsx +0 -26
  635. package/src/__tests__/Flash.test.tsx +0 -45
  636. package/src/__tests__/Flex.test.tsx +0 -58
  637. package/src/__tests__/FormGroup.test.tsx +0 -38
  638. package/src/__tests__/Grid.test.tsx +0 -82
  639. package/src/__tests__/Header.test.tsx +0 -49
  640. package/src/__tests__/Heading.test.tsx +0 -91
  641. package/src/__tests__/Label.test.tsx +0 -34
  642. package/src/__tests__/LabelGroup.test.tsx +0 -30
  643. package/src/__tests__/Link.test.tsx +0 -47
  644. package/src/__tests__/Merge.types.test.ts +0 -39
  645. package/src/__tests__/Overlay.test.tsx +0 -103
  646. package/src/__tests__/Pagehead.test.tsx +0 -23
  647. package/src/__tests__/Pagination/Pagination.test.tsx +0 -30
  648. package/src/__tests__/Pagination/PaginationModel.test.tsx +0 -133
  649. package/src/__tests__/Pagination/__snapshots__/Pagination.test.tsx.snap +0 -184
  650. package/src/__tests__/PointerBox.test.tsx +0 -34
  651. package/src/__tests__/Popover.test.tsx +0 -68
  652. package/src/__tests__/Portal.test.tsx +0 -103
  653. package/src/__tests__/Position.test.tsx +0 -117
  654. package/src/__tests__/ProgressBar.test.tsx +0 -40
  655. package/src/__tests__/SelectMenu.test.tsx +0 -142
  656. package/src/__tests__/SelectPanel.test.tsx +0 -63
  657. package/src/__tests__/SideNav.test.tsx +0 -62
  658. package/src/__tests__/Spinner.test.tsx +0 -42
  659. package/src/__tests__/StateLabel.test.tsx +0 -48
  660. package/src/__tests__/StyledOcticon.test.tsx +0 -26
  661. package/src/__tests__/SubNav.test.tsx +0 -50
  662. package/src/__tests__/SubNavLink.test.tsx +0 -31
  663. package/src/__tests__/TabNav.test.tsx +0 -32
  664. package/src/__tests__/Text.test.tsx +0 -78
  665. package/src/__tests__/TextInput.test.tsx +0 -49
  666. package/src/__tests__/TextInputWithTokens.test.tsx +0 -262
  667. package/src/__tests__/ThemeProvider.test.tsx +0 -441
  668. package/src/__tests__/Timeline.test.tsx +0 -58
  669. package/src/__tests__/Token.test.tsx +0 -118
  670. package/src/__tests__/Tooltip.test.tsx +0 -52
  671. package/src/__tests__/Truncate.test.tsx +0 -43
  672. package/src/__tests__/UnderlineNav.test.tsx +0 -58
  673. package/src/__tests__/UnderlineNavLink.test.tsx +0 -31
  674. package/src/__tests__/__snapshots__/ActionList.test.tsx.snap +0 -223
  675. package/src/__tests__/__snapshots__/ActionMenu.test.tsx.snap +0 -80
  676. package/src/__tests__/__snapshots__/AnchoredOverlay.test.tsx.snap +0 -332
  677. package/src/__tests__/__snapshots__/Autocomplete.test.tsx.snap +0 -3414
  678. package/src/__tests__/__snapshots__/Avatar.test.tsx.snap +0 -19
  679. package/src/__tests__/__snapshots__/AvatarStack.test.tsx.snap +0 -377
  680. package/src/__tests__/__snapshots__/BorderBox.test.tsx.snap +0 -14
  681. package/src/__tests__/__snapshots__/Box.test.tsx.snap +0 -201
  682. package/src/__tests__/__snapshots__/BranchName.test.tsx.snap +0 -17
  683. package/src/__tests__/__snapshots__/Breadcrumbs.test.tsx.snap +0 -29
  684. package/src/__tests__/__snapshots__/BreadcrumbsItem.test.tsx.snap +0 -79
  685. package/src/__tests__/__snapshots__/Button.test.tsx.snap +0 -840
  686. package/src/__tests__/__snapshots__/Caret.test.tsx.snap +0 -373
  687. package/src/__tests__/__snapshots__/CircleBadge.test.tsx.snap +0 -141
  688. package/src/__tests__/__snapshots__/CircleOcticon.test.tsx.snap +0 -64
  689. package/src/__tests__/__snapshots__/ConfirmationDialog.test.tsx.snap +0 -89
  690. package/src/__tests__/__snapshots__/CounterLabel.test.tsx.snap +0 -22
  691. package/src/__tests__/__snapshots__/Details.test.tsx.snap +0 -15
  692. package/src/__tests__/__snapshots__/Dialog.test.tsx.snap +0 -200
  693. package/src/__tests__/__snapshots__/Dropdown.test.tsx.snap +0 -249
  694. package/src/__tests__/__snapshots__/DropdownMenu.test.tsx.snap +0 -106
  695. package/src/__tests__/__snapshots__/FilterList.test.tsx.snap +0 -13
  696. package/src/__tests__/__snapshots__/FilterListItem.test.tsx.snap +0 -80
  697. package/src/__tests__/__snapshots__/FilteredSearch.test.tsx.snap +0 -32
  698. package/src/__tests__/__snapshots__/Flash.test.tsx.snap +0 -32
  699. package/src/__tests__/__snapshots__/Flex.test.tsx.snap +0 -130
  700. package/src/__tests__/__snapshots__/FormGroup.test.tsx.snap +0 -25
  701. package/src/__tests__/__snapshots__/Grid.test.tsx.snap +0 -178
  702. package/src/__tests__/__snapshots__/Header.test.tsx.snap +0 -79
  703. package/src/__tests__/__snapshots__/Heading.test.tsx.snap +0 -13
  704. package/src/__tests__/__snapshots__/Label.test.tsx.snap +0 -74
  705. package/src/__tests__/__snapshots__/LabelGroup.test.tsx.snap +0 -15
  706. package/src/__tests__/__snapshots__/Link.test.tsx.snap +0 -213
  707. package/src/__tests__/__snapshots__/Pagehead.test.tsx.snap +0 -15
  708. package/src/__tests__/__snapshots__/PointerBox.test.tsx.snap +0 -174
  709. package/src/__tests__/__snapshots__/Popover.test.tsx.snap +0 -4687
  710. package/src/__tests__/__snapshots__/Position.test.tsx.snap +0 -44
  711. package/src/__tests__/__snapshots__/ProgressBar.test.tsx.snap +0 -53
  712. package/src/__tests__/__snapshots__/SelectMenu.test.tsx.snap +0 -469
  713. package/src/__tests__/__snapshots__/SelectPanel.test.tsx.snap +0 -123
  714. package/src/__tests__/__snapshots__/SideNav.test.tsx.snap +0 -143
  715. package/src/__tests__/__snapshots__/Spinner.test.tsx.snap +0 -33
  716. package/src/__tests__/__snapshots__/StateLabel.test.tsx.snap +0 -388
  717. package/src/__tests__/__snapshots__/StyledOcticon.test.tsx.snap +0 -25
  718. package/src/__tests__/__snapshots__/SubNav.test.tsx.snap +0 -44
  719. package/src/__tests__/__snapshots__/SubNavLink.test.tsx.snap +0 -199
  720. package/src/__tests__/__snapshots__/TabNav.test.tsx.snap +0 -58
  721. package/src/__tests__/__snapshots__/Text.test.tsx.snap +0 -7
  722. package/src/__tests__/__snapshots__/TextInput.test.tsx.snap +0 -440
  723. package/src/__tests__/__snapshots__/TextInputWithTokens.test.tsx.snap +0 -5516
  724. package/src/__tests__/__snapshots__/ThemeProvider.test.tsx.snap +0 -15
  725. package/src/__tests__/__snapshots__/Timeline.test.tsx.snap +0 -159
  726. package/src/__tests__/__snapshots__/Token.test.tsx.snap +0 -3794
  727. package/src/__tests__/__snapshots__/Tooltip.test.tsx.snap +0 -227
  728. package/src/__tests__/__snapshots__/Truncate.test.tsx.snap +0 -17
  729. package/src/__tests__/__snapshots__/UnderlineNav.test.tsx.snap +0 -59
  730. package/src/__tests__/__snapshots__/UnderlineNavLink.test.tsx.snap +0 -130
  731. package/src/__tests__/behaviors/anchoredPosition.test.ts +0 -295
  732. package/src/__tests__/behaviors/focusTrap.test.tsx +0 -236
  733. package/src/__tests__/behaviors/focusZone.test.tsx +0 -549
  734. package/src/__tests__/behaviors/iterateFocusableElements.test.tsx +0 -61
  735. package/src/__tests__/behaviors/scrollIntoViewingArea.test.ts +0 -195
  736. package/src/__tests__/filterObject.test.ts +0 -54
  737. package/src/__tests__/hooks/useAnchoredPosition.test.tsx +0 -31
  738. package/src/__tests__/hooks/useOnEscapePress.test.tsx +0 -16
  739. package/src/__tests__/hooks/useOnOutsideClick.test.tsx +0 -48
  740. package/src/__tests__/hooks/useOpenAndCloseFocus.test.tsx +0 -48
  741. package/src/__tests__/hooks/useProvidedStateOrCreate.test.tsx +0 -39
  742. package/src/__tests__/theme.test.ts +0 -41
  743. package/src/__tests__/themeGet.test.ts +0 -15
  744. package/src/__tests__/useSafeTimeout.test.tsx +0 -36
  745. package/src/behaviors/anchoredPosition.ts +0 -442
  746. package/src/behaviors/focusTrap.ts +0 -184
  747. package/src/behaviors/focusZone.ts +0 -713
  748. package/src/behaviors/scrollIntoViewingArea.ts +0 -27
  749. package/src/constants.ts +0 -62
  750. package/src/hooks/index.ts +0 -11
  751. package/src/hooks/useAnchoredPosition.ts +0 -53
  752. package/src/hooks/useCombinedRefs.ts +0 -40
  753. package/src/hooks/useDetails.tsx +0 -54
  754. package/src/hooks/useDialog.ts +0 -121
  755. package/src/hooks/useFocusTrap.ts +0 -80
  756. package/src/hooks/useFocusZone.ts +0 -64
  757. package/src/hooks/useOnEscapePress.ts +0 -63
  758. package/src/hooks/useOnOutsideClick.tsx +0 -82
  759. package/src/hooks/useOpenAndCloseFocus.ts +0 -32
  760. package/src/hooks/useOverlay.tsx +0 -34
  761. package/src/hooks/useProvidedRefOrCreate.ts +0 -14
  762. package/src/hooks/useProvidedStateOrCreate.ts +0 -27
  763. package/src/hooks/useRenderForcingRef.ts +0 -22
  764. package/src/hooks/useResizeObserver.ts +0 -11
  765. package/src/hooks/useSafeTimeout.ts +0 -38
  766. package/src/hooks/useScrollFlash.ts +0 -21
  767. package/src/index.ts +0 -170
  768. package/src/polyfills/eventListenerSignal.ts +0 -66
  769. package/src/stories/ActionList.stories.tsx +0 -436
  770. package/src/stories/ActionMenu.stories.tsx +0 -334
  771. package/src/stories/AnchoredOverlay.stories.tsx +0 -117
  772. package/src/stories/Autocomplete.stories.tsx +0 -655
  773. package/src/stories/AvatarStack.stories.tsx +0 -37
  774. package/src/stories/Button.stories.tsx +0 -92
  775. package/src/stories/ConfirmationDialog.stories.tsx +0 -105
  776. package/src/stories/Dialog.stories.tsx +0 -240
  777. package/src/stories/DropdownMenu.stories.tsx +0 -84
  778. package/src/stories/IssueLabelToken.stories.tsx +0 -138
  779. package/src/stories/Overlay.stories.tsx +0 -213
  780. package/src/stories/Portal.stories.tsx +0 -109
  781. package/src/stories/ProfileToken.stories.tsx +0 -129
  782. package/src/stories/SelectPanel.stories.tsx +0 -353
  783. package/src/stories/TextInputWithTokens.stories.tsx +0 -146
  784. package/src/stories/ThemeProvider.stories.tsx +0 -104
  785. package/src/stories/Token.stories.tsx +0 -126
  786. package/src/stories/useAnchoredPosition.stories.tsx +0 -332
  787. package/src/stories/useFocusTrap.stories.tsx +0 -400
  788. package/src/stories/useFocusZone.stories.tsx +0 -663
  789. package/src/sx.ts +0 -9
  790. package/src/theme-preval.js +0 -79
  791. package/src/theme.ts +0 -3
  792. package/src/utils/deprecate.tsx +0 -73
  793. package/src/utils/isNumeric.tsx +0 -4
  794. package/src/utils/iterateFocusableElements.ts +0 -121
  795. package/src/utils/ssr.tsx +0 -1
  796. package/src/utils/test-deprecations.tsx +0 -19
  797. package/src/utils/test-helpers.tsx +0 -7
  798. package/src/utils/test-matchers.tsx +0 -109
  799. package/src/utils/testing.tsx +0 -242
  800. package/src/utils/theme.js +0 -64
  801. package/src/utils/types/AriaRole.ts +0 -71
  802. package/src/utils/types/ComponentProps.ts +0 -13
  803. package/src/utils/types/Flatten.ts +0 -4
  804. package/src/utils/types/MandateProps.ts +0 -19
  805. package/src/utils/types/Merge.ts +0 -20
  806. package/src/utils/types/index.ts +0 -5
  807. package/src/utils/uniqueId.ts +0 -6
  808. package/src/utils/userAgent.ts +0 -7
  809. package/stats.html +0 -3279
  810. package/tsconfig.build.json +0 -7
  811. package/tsconfig.json +0 -20
@@ -1,43 +0,0 @@
1
- import styled from 'styled-components'
2
- import {get} from '../constants'
3
- import sx, {SxProp} from '../sx'
4
- import {ComponentProps} from '../utils/types'
5
- import ButtonBase, {ButtonBaseProps, ButtonSystemProps, buttonSystemProps} from './ButtonBase'
6
-
7
- const ButtonOutline = styled(ButtonBase)<ButtonBaseProps & ButtonSystemProps & SxProp>`
8
- color: ${get('colors.btn.outline.text')};
9
- border: 1px solid ${get('colors.btn.border')};
10
- background-color: ${get('colors.btn.bg')};
11
- box-shadow: ${get('shadows.btn.shadow')};
12
-
13
- &:hover {
14
- color: ${get('colors.btn.outline.hoverText')};
15
- background-color: ${get('colors.btn.outline.hoverBg')};
16
- border-color: ${get('colors.btn.outline.hoverBorder')};
17
- box-shadow: ${get('shadows.btn.outline.hoverShadow')};
18
- }
19
- // focus must come before :active so that the active box shadow overrides
20
- &:focus {
21
- border-color: ${get('colors.btn.outline.focusBorder')};
22
- box-shadow: ${get('shadows.btn.outline.focusShadow')};
23
- }
24
-
25
- &:active {
26
- color: ${get('colors.btn.outline.selectedText')};
27
- background-color: ${get('colors.btn.outline.selectedBg')};
28
- box-shadow: ${get('shadows.btn.outline.selectedShadow')};
29
- border-color: ${get('colors.btn.outline.selectedBorder')};
30
- }
31
-
32
- &:disabled {
33
- color: ${get('colors.btn.outline.disabledText')};
34
- background-color: ${get('colors.btn.outline.disabledBg')};
35
- border-color: ${get('colors.btn.border')};
36
- }
37
-
38
- ${buttonSystemProps};
39
- ${sx};
40
- `
41
-
42
- export type ButtonOutlineProps = ComponentProps<typeof ButtonOutline>
43
- export default ButtonOutline
@@ -1,41 +0,0 @@
1
- import styled from 'styled-components'
2
- import {get} from '../constants'
3
- import sx, {SxProp} from '../sx'
4
- import {ComponentProps} from '../utils/types'
5
- import ButtonBase, {ButtonBaseProps, ButtonSystemProps, buttonSystemProps} from './ButtonBase'
6
-
7
- export const ButtonPrimary = styled(ButtonBase)<ButtonBaseProps & ButtonSystemProps & SxProp>`
8
- color: ${get('colors.btn.primary.text')};
9
- border: 1px solid ${get('colors.btn.primary.border')};
10
- background-color: ${get('colors.btn.primary.bg')};
11
- box-shadow: ${get('shadows.btn.primary.shadow')};
12
-
13
- &:hover {
14
- color: ${get('colors.btn.primary.hoverText')};
15
- background-color: ${get('colors.btn.primary.hoverBg')};
16
- border-color: ${get('colors.btn.primary.hoverBorder')};
17
- box-shadow: ${get('shadows.btn.primary.hoverShadow')};
18
- }
19
- // focus must come before :active so that the active box shadow overrides
20
- &:focus {
21
- border-color: ${get('colors.btn.primary.focusBorder')};
22
- box-shadow: ${get('shadows.btn.primary.focusShadow')};
23
- }
24
-
25
- &:active {
26
- background-color: ${get('colors.btn.primary.selectedBg')};
27
- box-shadow: ${get('shadows.btn.primary.selectedShadow')};
28
- }
29
-
30
- &:disabled {
31
- color: ${get('colors.btn.primary.disabledText')};
32
- background-color: ${get('colors.btn.primary.disabledBg')};
33
- border-color: ${get('colors.btn.primary.disabledBorder')};
34
- }
35
-
36
- ${buttonSystemProps};
37
- ${sx};
38
- `
39
-
40
- export type ButtonPrimaryProps = ComponentProps<typeof ButtonPrimary>
41
- export default ButtonPrimary
@@ -1,36 +0,0 @@
1
- import {css} from 'styled-components'
2
- import {get} from '../constants'
3
-
4
- export default css`
5
- position: relative;
6
- display: inline-block;
7
- padding: 6px 16px;
8
- font-family: inherit;
9
- font-weight: ${get('fontWeights.bold')};
10
- line-height: 20px;
11
- white-space: nowrap;
12
- vertical-align: middle;
13
- cursor: pointer;
14
- user-select: none;
15
- border-radius: ${get('radii.2')};
16
- appearance: none;
17
- text-decoration: none;
18
- text-align: center;
19
-
20
- &:hover {
21
- // needed to override link styles
22
- text-decoration: none;
23
- }
24
-
25
- &:focus {
26
- outline: none;
27
- }
28
-
29
- &:disabled {
30
- cursor: default;
31
- }
32
-
33
- &:disabled svg {
34
- opacity: 0.6;
35
- }
36
- `
@@ -1,58 +0,0 @@
1
- import styled from 'styled-components'
2
- import {
3
- COMMON,
4
- get,
5
- LAYOUT,
6
- SystemCommonProps,
7
- SystemLayoutProps,
8
- SystemTypographyProps,
9
- TYPOGRAPHY
10
- } from '../constants'
11
- import sx, {SxProp} from '../sx'
12
- import {ComponentProps} from '../utils/types'
13
-
14
- type StyledButtonTableListProps = SystemCommonProps & SystemTypographyProps & SystemLayoutProps & SxProp
15
-
16
- const ButtonTableList = styled.summary<StyledButtonTableListProps>`
17
- display: inline-block;
18
- padding: 0;
19
- font-size: ${get('fontSizes.1')};
20
- color: ${get('colors.fg.muted')};
21
- text-decoration: none;
22
- white-space: nowrap;
23
- cursor: pointer;
24
- user-select: none;
25
- background-color: transparent;
26
- border: 0;
27
- appearance: none; // Corrects inability to style clickable input types in iOS.
28
-
29
- &:hover {
30
- text-decoration: underline;
31
- }
32
-
33
- &:disabled {
34
- &,
35
- &:hover {
36
- color: ${get('colors.primer.fg.disabled')};
37
- cursor: default;
38
- }
39
- }
40
-
41
- &:after {
42
- display: inline-block;
43
- margin-left: ${get('space.1')};
44
- width: 0;
45
- height: 0;
46
- vertical-align: -2px;
47
- content: '';
48
- border: 4px solid transparent;
49
- border-top-color: currentcolor;
50
- }
51
- ${COMMON}
52
- ${TYPOGRAPHY}
53
- ${LAYOUT}
54
- ${sx};
55
- `
56
-
57
- export type ButtonTableListProps = ComponentProps<typeof ButtonTableList>
58
- export default ButtonTableList
@@ -1,16 +0,0 @@
1
- export {default} from './Button'
2
- export type {ButtonProps} from './Button'
3
- export {default as ButtonDanger} from './ButtonDanger'
4
- export type {ButtonDangerProps} from './ButtonDanger'
5
- export {default as ButtonGroup} from './ButtonGroup'
6
- export type {ButtonGroupProps} from './ButtonGroup'
7
- export {default as ButtonOutline} from './ButtonOutline'
8
- export type {ButtonOutlineProps} from './ButtonOutline'
9
- export {default as ButtonPrimary} from './ButtonPrimary'
10
- export type {ButtonPrimaryProps} from './ButtonPrimary'
11
- export {default as ButtonInvisible} from './ButtonInvisible'
12
- export type {ButtonInvisibleProps} from './ButtonInvisible'
13
- export {default as ButtonTableList} from './ButtonTableList'
14
- export type {ButtonTableListProps} from './ButtonTableList'
15
- export {default as ButtonClose} from './ButtonClose'
16
- export type {ButtonCloseProps} from './ButtonClose'
package/src/Caret.tsx DELETED
@@ -1,133 +0,0 @@
1
- import React from 'react'
2
- import {ThemeContext} from 'styled-components'
3
- import {style} from 'styled-system'
4
- import {Theme} from './ThemeProvider'
5
-
6
- type Location =
7
- | 'top'
8
- | 'top-left'
9
- | 'top-right'
10
- | 'right'
11
- | 'right-top'
12
- | 'right-bottom'
13
- | 'bottom'
14
- | 'bottom-left'
15
- | 'bottom-right'
16
- | 'left'
17
- | 'left-top'
18
- | 'left-bottom'
19
-
20
- type Alignment = 'top' | 'right' | 'bottom' | 'left'
21
-
22
- const oppositeEdge = {
23
- top: 'Bottom',
24
- right: 'Left',
25
- bottom: 'Top',
26
- left: 'Right'
27
- }
28
-
29
- const perpendicularEdge = {
30
- top: 'Left',
31
- right: 'Top',
32
- bottom: 'Left',
33
- left: 'Top'
34
- }
35
-
36
- function getEdgeAlign(location: Location) {
37
- const [edge, align] = location.split('-')
38
- return [edge as Alignment, align as Alignment | undefined] as const
39
- }
40
-
41
- function getPosition(edge: Alignment, align: Alignment | undefined, spacing: number) {
42
- const opposite = oppositeEdge[edge].toLowerCase()
43
- const perp = perpendicularEdge[edge].toLowerCase()
44
- return {
45
- [opposite]: '100%',
46
- [align || perp]: align ? spacing : '50%'
47
- }
48
- }
49
-
50
- const getBg = style({prop: 'bg', key: 'colors'})
51
- const getBorderColor = style({prop: 'borderColor', key: 'colors'})
52
- const getBorderWidth = style({prop: 'borderWidth', key: 'borderWidths', scale: [0, 1]})
53
-
54
- export type CaretProps = {
55
- bg?: string
56
- borderColor?: string
57
- borderWidth?: string | number
58
- size?: number
59
- location?: Location
60
- theme?: Theme
61
- }
62
-
63
- function Caret(props: CaretProps) {
64
- const theme = React.useContext(ThemeContext)
65
- const propsWithTheme = {...props, theme: props.theme ?? theme}
66
- const {bg} = getBg(propsWithTheme)
67
- const {borderColor} = getBorderColor(propsWithTheme)
68
- const {borderWidth} = getBorderWidth(propsWithTheme)
69
- const {size = 8, location = 'bottom'} = props
70
- const [edge, align] = getEdgeAlign(location)
71
- const perp = perpendicularEdge[edge]
72
-
73
- // note: these arrays represent points in the form [x, y]
74
- const a = [-size, 0]
75
- const b = [0, size]
76
- const c = [size, 0]
77
-
78
- // spaces are optional in path `d` attribute, and points are
79
- // represented in the form `x,y` -- which is what the arrays above
80
- // become when stringified!
81
- const triangle = `M${a}L${b}L${c}L${a}Z`
82
- const line = `M${a}L${b}L${c}`
83
-
84
- const transform = {
85
- top: `translate(${[size, size * 2]}) rotate(180)`,
86
- right: `translate(${[0, size]}) rotate(-90)`,
87
- bottom: `translate(${[size, 0]})`,
88
- left: `translate(${[size * 2, size]}) rotate(90)`
89
- }[edge]
90
-
91
- return (
92
- <svg
93
- width={size * 2}
94
- height={size * 2}
95
- style={{
96
- pointerEvents: 'none',
97
- position: 'absolute',
98
- ...getPosition(edge, align, size),
99
- // if align is set (top|right|bottom|left),
100
- // then we don't need an offset margin
101
- [`margin${perp}`]: align ? null : -size
102
- }}
103
- >
104
- <g transform={transform}>
105
- <path d={triangle} fill={bg} />
106
- <path d={line} fill="none" stroke={borderColor} strokeWidth={borderWidth} />
107
- </g>
108
- </svg>
109
- )
110
- }
111
-
112
- Caret.locations = [
113
- 'top',
114
- 'top-left',
115
- 'top-right',
116
- 'right',
117
- 'right-top',
118
- 'right-bottom',
119
- 'bottom',
120
- 'bottom-left',
121
- 'bottom-right',
122
- 'left',
123
- 'left-top',
124
- 'left-bottom'
125
- ]
126
-
127
- Caret.defaultProps = {
128
- bg: 'canvas.default',
129
- borderColor: 'border.default',
130
- borderWidth: 1
131
- }
132
-
133
- export default Caret
@@ -1,55 +0,0 @@
1
- import styled from 'styled-components'
2
- import {COMMON, get, SystemCommonProps} from './constants'
3
- import StyledOcticon from './StyledOcticon'
4
- import sx, {SxProp} from './sx'
5
- import isNumeric from './utils/isNumeric'
6
- import {ComponentProps} from './utils/types'
7
-
8
- const variantSizes = {
9
- small: 56,
10
- medium: 96,
11
- large: 128
12
- }
13
-
14
- type StyledCircleBadgeProps = {
15
- inline?: boolean
16
- variant?: keyof typeof variantSizes
17
- size?: number
18
- } & SystemCommonProps &
19
- SxProp
20
-
21
- const sizeStyles = ({size, variant = 'medium'}: StyledCircleBadgeProps) => {
22
- const calc = isNumeric(size) ? size : variantSizes[variant]
23
- return {
24
- width: calc,
25
- height: calc
26
- }
27
- }
28
-
29
- const CircleBadge = styled.div<StyledCircleBadgeProps>`
30
- display: ${props => (props.inline ? 'inline-flex' : 'flex')};
31
- align-items: center;
32
- justify-content: center;
33
- background-color: ${get('colors.canvas.default')};
34
- border-radius: 50%;
35
- box-shadow: ${get('shadows.shadow.medium')};
36
- ${COMMON};
37
- ${sizeStyles};
38
- ${sx};
39
- `
40
-
41
- const CircleBadgeIcon = styled(StyledOcticon)`
42
- height: auto;
43
- max-width: 60%;
44
- max-height: 55%;
45
- `
46
-
47
- CircleBadge.defaultProps = {
48
- inline: false
49
- }
50
-
51
- CircleBadgeIcon.displayName = 'CircleBadge.Icon'
52
-
53
- export type CircleBadgeProps = ComponentProps<typeof CircleBadge>
54
- export type CircleBadgeIconProps = ComponentProps<typeof CircleBadgeIcon>
55
- export default Object.assign(CircleBadge, {Icon: CircleBadgeIcon})
@@ -1,37 +0,0 @@
1
- import {IconProps} from '@primer/octicons-react'
2
- import React from 'react'
3
- import Box, {BoxProps} from './Box'
4
-
5
- export type CircleOcticonProps = {
6
- as?: React.ElementType
7
- size?: number
8
- icon: React.ComponentType<{size?: IconProps['size']}>
9
- } & BoxProps
10
-
11
- function CircleOcticon(props: CircleOcticonProps) {
12
- const {size, as} = props
13
- const {icon: IconComponent, bg, ...rest} = props
14
- return (
15
- <Box
16
- as={as}
17
- bg={bg}
18
- overflow="hidden"
19
- borderWidth={0}
20
- size={size}
21
- borderRadius="50%"
22
- borderStyle="solid"
23
- borderColor="border.default"
24
- >
25
- <Box display="flex" {...rest} alignItems="center" justifyContent="center">
26
- <IconComponent size={size} />
27
- </Box>
28
- </Box>
29
- )
30
- }
31
-
32
- CircleOcticon.defaultProps = {
33
- ...Box.defaultProps,
34
- size: 32
35
- }
36
-
37
- export default CircleOcticon
@@ -1,52 +0,0 @@
1
- import styled from 'styled-components'
2
- import {COMMON, get, SystemCommonProps} from './constants'
3
- import sx, {SxProp} from './sx'
4
- import {ComponentProps} from './utils/types'
5
-
6
- type StyledCounterLabelProps = {
7
- scheme?: 'primary' | 'secondary'
8
- } & SystemCommonProps &
9
- SxProp
10
-
11
- const colorStyles = ({scheme, ...props}: StyledCounterLabelProps) => {
12
- return {
13
- color:
14
- scheme === 'secondary'
15
- ? get('colors.fg.default')(props)
16
- : scheme === 'primary'
17
- ? get('colors.fg.onEmphasis')(props)
18
- : get('colors.fg.default')(props)
19
- }
20
- }
21
-
22
- const bgStyles = ({scheme, ...props}: StyledCounterLabelProps) => {
23
- return {
24
- backgroundColor:
25
- scheme === 'secondary'
26
- ? get('colors.neutral.muted')(props)
27
- : scheme === 'primary'
28
- ? get('colors.neutral.emphasis')(props)
29
- : get('colors.neutral.muted')(props)
30
- }
31
- }
32
-
33
- const CounterLabel = styled.span<StyledCounterLabelProps>`
34
- display: inline-block;
35
- padding: 2px 5px;
36
- font-size: ${get('fontSizes.0')};
37
- font-weight: ${get('fontWeights.bold')};
38
- line-height: ${get('lineHeights.condensedUltra')};
39
- border-radius: 20px;
40
- ${colorStyles};
41
- ${bgStyles};
42
- ${COMMON};
43
-
44
- &:empty {
45
- display: none;
46
- }
47
-
48
- ${sx};
49
- `
50
-
51
- export type CounterLabelProps = ComponentProps<typeof CounterLabel>
52
- export default CounterLabel
package/src/Details.tsx DELETED
@@ -1,23 +0,0 @@
1
- import styled from 'styled-components'
2
- import {COMMON, SystemCommonProps} from './constants'
3
- import sx, {SxProp} from './sx'
4
- import {ComponentProps} from './utils/types'
5
-
6
- type StyledDetailsProps = SystemCommonProps & SxProp
7
-
8
- const Details = styled.details<StyledDetailsProps>`
9
- & > summary {
10
- list-style: none;
11
- }
12
- & > summary::-webkit-details-marker {
13
- display: none;
14
- }
15
-
16
- ${COMMON}
17
- ${sx};
18
- `
19
-
20
- Details.displayName = 'Details'
21
-
22
- export type DetailsProps = ComponentProps<typeof Details>
23
- export default Details
@@ -1,184 +0,0 @@
1
- import React, {useCallback} from 'react'
2
- import ReactDOM from 'react-dom'
3
- import styled from 'styled-components'
4
- import Box from '../Box'
5
- import {ThemeProvider, useTheme, ThemeProviderProps} from '../ThemeProvider'
6
- import {FocusKeys} from '../behaviors/focusZone'
7
- import {get} from '../constants'
8
- import {Dialog, DialogProps, DialogHeaderProps, DialogButtonProps} from '../Dialog/Dialog'
9
- import {useFocusZone} from '../hooks/useFocusZone'
10
-
11
- /**
12
- * Props to customize the ConfirmationDialog.
13
- */
14
- export interface ConfirmationDialogProps {
15
- /**
16
- * Required. This callback is invoked when a gesture to close the dialog
17
- * is performed. The first argument indicates the gesture.
18
- */
19
- onClose: (gesture: 'confirm' | 'cancel' | 'close-button' | 'cancel' | 'escape') => void
20
-
21
- /**
22
- * Required. The title of the ConfirmationDialog. This is usually a brief
23
- * question.
24
- */
25
- title: React.ReactNode
26
-
27
- /**
28
- * The text to use for the cancel button. Default: "Cancel".
29
- */
30
- cancelButtonContent?: React.ReactNode
31
-
32
- /**
33
- * The text to use for the confirm button. Default: "OK".
34
- */
35
- confirmButtonContent?: React.ReactNode
36
-
37
- /**
38
- * The type of button to use for the confirm button. Default: Button.
39
- */
40
- confirmButtonType?: 'normal' | 'primary' | 'danger'
41
- }
42
-
43
- const StyledConfirmationHeader = styled.header`
44
- padding: ${get('space.2')};
45
- display: flex;
46
- flex-direction: row;
47
- `
48
- const StyledTitle = styled(Box)`
49
- font-size: ${get('fontSizes.3')};
50
- font-weight: ${get('fontWeights.bold')};
51
- padding: 6px ${get('space.2')};
52
- flex-grow: 1;
53
- `
54
- const ConfirmationHeader: React.FC<DialogHeaderProps> = ({title, onClose, dialogLabelId}) => {
55
- const onCloseClick = useCallback(() => {
56
- onClose('close-button')
57
- }, [onClose])
58
- return (
59
- <StyledConfirmationHeader>
60
- <StyledTitle id={dialogLabelId}>{title}</StyledTitle>
61
- <Dialog.CloseButton onClose={onCloseClick} />
62
- </StyledConfirmationHeader>
63
- )
64
- }
65
- const StyledConfirmationBody = styled(Box)`
66
- font-size: ${get('fontSizes.1')};
67
- padding: 0 ${get('space.3')} ${get('space.3')} ${get('space.3')};
68
- color: ${get('colors.fg.muted')};
69
- flex-grow: 1;
70
- `
71
- const ConfirmationBody: React.FC<DialogProps> = ({children}) => {
72
- return <StyledConfirmationBody>{children}</StyledConfirmationBody>
73
- }
74
- const StyledConfirmationFooter = styled(Box)`
75
- display: grid;
76
- grid-auto-flow: column;
77
- grid-auto-columns: max-content;
78
- grid-gap: ${get('space.2')};
79
- align-items: end;
80
- justify-content: end;
81
- padding: ${get('space.1')} ${get('space.3')} ${get('space.3')};
82
- `
83
- const ConfirmationFooter: React.FC<DialogProps> = ({footerButtons}) => {
84
- const {containerRef: footerRef} = useFocusZone({
85
- bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.Tab,
86
- focusInStrategy: 'closest'
87
- })
88
- // Must have exactly 2 buttons!
89
- return (
90
- <StyledConfirmationFooter ref={footerRef as React.RefObject<HTMLDivElement>}>
91
- <Dialog.Buttons buttons={footerButtons ?? []} />
92
- </StyledConfirmationFooter>
93
- )
94
- }
95
-
96
- /**
97
- * A ConfirmationDialog is a special kind of dialog with more rigid behavior. It
98
- * is used to confirm a user action. ConfirmationDialogs always have exactly
99
- * two buttons: one to cancel the action and one to confirm it. No custom
100
- * rendering capabilities are provided for ConfirmationDialog.
101
- */
102
- export const ConfirmationDialog: React.FC<ConfirmationDialogProps> = props => {
103
- const {
104
- onClose,
105
- title,
106
- cancelButtonContent = 'Cancel',
107
- confirmButtonContent = 'OK',
108
- confirmButtonType = 'normal',
109
- children
110
- } = props
111
-
112
- const onCancelButtonClick = useCallback(() => {
113
- onClose('cancel')
114
- }, [onClose])
115
- const onConfirmButtonClick = useCallback(() => {
116
- onClose('confirm')
117
- }, [onClose])
118
- const cancelButton: DialogButtonProps = {
119
- content: cancelButtonContent,
120
- onClick: onCancelButtonClick
121
- }
122
- const confirmButton: DialogButtonProps = {
123
- content: confirmButtonContent,
124
- buttonType: confirmButtonType,
125
- onClick: onConfirmButtonClick,
126
- autoFocus: true
127
- }
128
- const footerButtons = [cancelButton, confirmButton]
129
- return (
130
- <Dialog
131
- onClose={onClose}
132
- title={title}
133
- footerButtons={footerButtons}
134
- role="alertdialog"
135
- width="medium"
136
- renderHeader={ConfirmationHeader}
137
- renderBody={ConfirmationBody}
138
- renderFooter={ConfirmationFooter}
139
- >
140
- {children}
141
- </Dialog>
142
- )
143
- }
144
-
145
- export type ConfirmOptions = Omit<ConfirmationDialogProps, 'onClose'> & {content: React.ReactNode}
146
- async function confirm(themeProps: ThemeProviderProps, options: ConfirmOptions): Promise<boolean> {
147
- const {content, ...confirmationDialogProps} = options
148
- return new Promise(resolve => {
149
- const hostElement = document.createElement('div')
150
- const onClose: ConfirmationDialogProps['onClose'] = gesture => {
151
- ReactDOM.unmountComponentAtNode(hostElement)
152
- if (gesture === 'confirm') {
153
- resolve(true)
154
- } else {
155
- resolve(false)
156
- }
157
- }
158
- ReactDOM.render(
159
- <ThemeProvider {...themeProps}>
160
- <ConfirmationDialog {...confirmationDialogProps} onClose={onClose}>
161
- {content}
162
- </ConfirmationDialog>
163
- </ThemeProvider>,
164
- hostElement
165
- )
166
- })
167
- }
168
-
169
- /**
170
- * This hook takes no parameters and returns an `async` function, `confirm`. When `confirm`
171
- * is called, it shows the confirmation dialog. When the dialog is dismissed, a promise is
172
- * resolved with `true` or `false` depending on whether or not the confirm button was used.
173
- */
174
- export function useConfirm() {
175
- const {theme, colorMode, dayScheme, nightScheme} = useTheme()
176
- const result = useCallback(
177
- (options: ConfirmOptions) => {
178
- const themeProps: ThemeProviderProps = {theme, colorMode, dayScheme, nightScheme}
179
- return confirm(themeProps, options)
180
- },
181
- [theme, colorMode, dayScheme, nightScheme]
182
- )
183
- return result
184
- }