@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,19 +0,0 @@
1
- import {createContext} from 'react'
2
-
3
- export const AutocompleteContext = createContext<{
4
- activeDescendantRef: React.MutableRefObject<HTMLElement | null>
5
- autocompleteSuggestion: string
6
- // TODO: consider changing `id` to `listboxId` because we're just using it to associate the input and combobox with the listbox
7
- id: string
8
- inputRef: React.MutableRefObject<HTMLInputElement | null>
9
- inputValue: string
10
- isMenuDirectlyActivated: boolean
11
- scrollContainerRef: React.MutableRefObject<HTMLElement | null>
12
- selectedItemLength: number
13
- setAutocompleteSuggestion: (value: string) => void
14
- setInputValue: (value: string) => void
15
- setIsMenuDirectlyActivated: (value: boolean) => void
16
- setSelectedItemLength: (value: number) => void
17
- setShowMenu: (value: boolean) => void
18
- showMenu: boolean
19
- } | null>(null)
@@ -1,179 +0,0 @@
1
- import React, {
2
- ChangeEventHandler,
3
- FocusEventHandler,
4
- KeyboardEventHandler,
5
- MutableRefObject,
6
- useCallback,
7
- useContext,
8
- useEffect,
9
- useState
10
- } from 'react'
11
- import {ForwardRefComponent as PolymorphicForwardRefComponent} from '@radix-ui/react-polymorphic'
12
- import {AutocompleteContext} from './AutocompleteContext'
13
- import TextInput from '../TextInput'
14
- import {useCombinedRefs} from '../hooks/useCombinedRefs'
15
- import {ComponentProps} from '../utils/types'
16
-
17
- type InternalAutocompleteInputProps = {
18
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
19
- as?: React.ComponentType<any>
20
- }
21
-
22
- const AutocompleteInput = React.forwardRef(
23
- (
24
- {as: Component = TextInput, onFocus, onBlur, onChange, onKeyDown, onKeyUp, onKeyPress, value, ...props},
25
- forwardedRef
26
- ) => {
27
- const autocompleteContext = useContext(AutocompleteContext)
28
- if (autocompleteContext === null) {
29
- throw new Error('AutocompleteContext returned null values')
30
- }
31
- const {
32
- activeDescendantRef,
33
- autocompleteSuggestion = '',
34
- id,
35
- inputRef,
36
- inputValue = '',
37
- isMenuDirectlyActivated,
38
- setInputValue,
39
- setShowMenu,
40
- showMenu
41
- } = autocompleteContext
42
- const combinedInputRef = useCombinedRefs(inputRef, forwardedRef)
43
- const [highlightRemainingText, setHighlightRemainingText] = useState<boolean>(true)
44
-
45
- const handleInputFocus: FocusEventHandler<HTMLInputElement> = useCallback(
46
- event => {
47
- onFocus && onFocus(event)
48
- setShowMenu(true)
49
- },
50
- [onFocus, setShowMenu]
51
- )
52
-
53
- const handleInputBlur: FocusEventHandler<HTMLInputElement> = useCallback(
54
- event => {
55
- onBlur && onBlur(event)
56
-
57
- // HACK: wait a tick and check the focused element before hiding the autocomplete menu
58
- // this prevents the menu from hiding when the user is clicking an option in the Autoselect.Menu,
59
- // but still hides the menu when the user blurs the input by tabbing out or clicking somewhere else on the page
60
- setTimeout(() => {
61
- if (document.activeElement !== combinedInputRef.current) {
62
- setShowMenu(false)
63
- }
64
- }, 0)
65
- },
66
- [onBlur, setShowMenu, combinedInputRef]
67
- )
68
-
69
- const handleInputChange: ChangeEventHandler<HTMLInputElement> = useCallback(
70
- event => {
71
- onChange && onChange(event)
72
- setInputValue(event.currentTarget.value)
73
- if (!showMenu) {
74
- setShowMenu(true)
75
- }
76
- },
77
- [onChange, setInputValue, setShowMenu, showMenu]
78
- )
79
-
80
- const handleInputKeyDown: KeyboardEventHandler<HTMLInputElement> = useCallback(
81
- event => {
82
- onKeyDown && onKeyDown(event)
83
-
84
- if (event.key === 'Backspace') {
85
- setHighlightRemainingText(false)
86
- }
87
-
88
- if (event.key === 'Escape' && inputRef.current?.value) {
89
- setInputValue('')
90
- inputRef.current.value = ''
91
- }
92
- },
93
- [inputRef, setInputValue, setHighlightRemainingText, onKeyDown]
94
- )
95
-
96
- const handleInputKeyUp: KeyboardEventHandler<HTMLInputElement> = useCallback(
97
- event => {
98
- onKeyUp && onKeyUp(event)
99
-
100
- if (event.key === 'Backspace') {
101
- setHighlightRemainingText(true)
102
- }
103
- },
104
- [setHighlightRemainingText, onKeyUp]
105
- )
106
-
107
- const onInputKeyPress: KeyboardEventHandler<HTMLInputElement> = useCallback(
108
- event => {
109
- onKeyPress && onKeyPress(event)
110
-
111
- if (showMenu && event.key === 'Enter' && activeDescendantRef.current) {
112
- event.preventDefault()
113
- event.nativeEvent.stopImmediatePropagation()
114
-
115
- // Forward Enter key press to active descendant so that item gets activated
116
- const activeDescendantEvent = new KeyboardEvent(event.type, event.nativeEvent)
117
- activeDescendantRef.current.dispatchEvent(activeDescendantEvent)
118
- }
119
- },
120
- [activeDescendantRef, showMenu, onKeyPress]
121
- )
122
-
123
- useEffect(() => {
124
- if (!inputRef.current) {
125
- return
126
- }
127
-
128
- // resets input value to being empty after a selection has been made
129
- if (!autocompleteSuggestion) {
130
- inputRef.current.value = inputValue
131
- }
132
-
133
- // TODO: fix bug where this function prevents `onChange` from being triggered if the highlighted item text
134
- // is the same as what I'm typing
135
- // e.g.: typing 'tw' highights 'two', but when I 'two', the text input change does not get triggered
136
- if (highlightRemainingText && autocompleteSuggestion && (inputValue || isMenuDirectlyActivated)) {
137
- inputRef.current.value = autocompleteSuggestion
138
-
139
- if (autocompleteSuggestion.toLowerCase().indexOf(inputValue.toLowerCase()) === 0) {
140
- inputRef.current.setSelectionRange(inputValue.length, autocompleteSuggestion.length)
141
- }
142
- }
143
-
144
- // calling this useEffeect when `highlightRemainingText` changes breaks backspace functionality
145
- // eslint-disable-next-line react-hooks/exhaustive-deps
146
- }, [autocompleteSuggestion, inputValue, inputRef, isMenuDirectlyActivated])
147
-
148
- useEffect(() => {
149
- if (value) {
150
- setInputValue(value.toString())
151
- }
152
- }, [value, setInputValue])
153
-
154
- return (
155
- <Component
156
- onFocus={handleInputFocus}
157
- onBlur={handleInputBlur}
158
- onChange={handleInputChange}
159
- onKeyDown={handleInputKeyDown}
160
- onKeyPress={onInputKeyPress}
161
- onKeyUp={handleInputKeyUp}
162
- ref={combinedInputRef as MutableRefObject<HTMLInputElement>}
163
- aria-controls={`${id}-listbox`}
164
- aria-autocomplete="both"
165
- role="combobox"
166
- aria-expanded={showMenu}
167
- aria-haspopup="listbox"
168
- aria-owns={`${id}-listbox`}
169
- autocomplete="off"
170
- {...props}
171
- />
172
- )
173
- }
174
- ) as PolymorphicForwardRefComponent<typeof TextInput, InternalAutocompleteInputProps>
175
-
176
- AutocompleteInput.displayName = 'AutocompleteInput'
177
-
178
- export type AutocompleteInputProps = ComponentProps<typeof AutocompleteInput>
179
- export default AutocompleteInput
@@ -1,341 +0,0 @@
1
- import React, {useContext, useEffect, useMemo, useRef, useState} from 'react'
2
- import {ActionList, ItemProps} from '../ActionList'
3
- import {useFocusZone} from '../hooks/useFocusZone'
4
- import {ComponentProps, MandateProps} from '../utils/types'
5
- import {Box, Spinner} from '../'
6
- import {AutocompleteContext} from './AutocompleteContext'
7
- import {PlusIcon} from '@primer/octicons-react'
8
- import {uniqueId} from '../utils/uniqueId'
9
- import {scrollIntoViewingArea} from '../behaviors/scrollIntoViewingArea'
10
-
11
- type OnSelectedChange<T> = (item: T | T[]) => void
12
- type AutocompleteMenuItem = MandateProps<ItemProps, 'id'>
13
-
14
- const getDefaultSortFn =
15
- (isItemSelectedFn: (itemId: string | number) => boolean) => (itemIdA: string | number, itemIdB: string | number) =>
16
- isItemSelectedFn(itemIdA) === isItemSelectedFn(itemIdB) ? 0 : isItemSelectedFn(itemIdA) ? -1 : 1
17
-
18
- function getDefaultItemFilter<T extends AutocompleteMenuItem>(filterValue: string) {
19
- return function (item: T, _i: number) {
20
- return Boolean(item.text?.toLowerCase().startsWith(filterValue.toLowerCase()))
21
- }
22
- }
23
-
24
- function getDefaultOnSelectionChange<T extends AutocompleteMenuItem>(
25
- setInputValueFn: (value: string) => void
26
- ): OnSelectedChange<T> {
27
- return function (itemOrItems) {
28
- const {text = ''} = Array.isArray(itemOrItems) ? itemOrItems.slice(-1)[0] : itemOrItems
29
- setInputValueFn(text)
30
- }
31
- }
32
-
33
- const isItemSelected = (itemId: string | number, selectedItemIds: Array<string | number>) =>
34
- selectedItemIds.includes(itemId)
35
-
36
- function getItemById<T extends AutocompleteMenuItem>(itemId: string | number, items: T[]) {
37
- return items.find(item => item.id === itemId)
38
- }
39
-
40
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
41
- type AutocompleteItemProps<T = Record<string, any>> = AutocompleteMenuItem & {metadata?: T}
42
-
43
- export type AutocompleteMenuInternalProps<T extends AutocompleteItemProps> = {
44
- /**
45
- * A menu item that is used to allow users make a selection that is not available in the array passed to the `items` prop.
46
- * This menu item gets appended to the end of the list of options.
47
- */
48
- // TODO: rethink this part of the component API. this is kind of weird and confusing to use
49
- // TODO: rethink `addNewItem` prop name
50
- addNewItem?: Omit<T, 'onAction' | 'leadingVisual' | 'id'> & {
51
- handleAddItem: (item: Omit<T, 'onAction' | 'leadingVisual'>) => void
52
- }
53
-
54
- /**
55
- * The text that appears in the menu when there are no options in the array passed to the `items` prop.
56
- */
57
- emptyStateText?: React.ReactNode | false
58
-
59
- /**
60
- * A custom function used to filter the options in the array passed to the `items` prop.
61
- * By default, we filter out items that don't match the value of the autocomplete text input. The default filter is not case-sensitive.
62
- */
63
- filterFn?: (item: T, i: number) => boolean
64
-
65
- /**
66
- * The options for field values that are displayed in the dropdown menu.
67
- * One or more may be selected depending on the value of the `selectionVariant` prop.
68
- */
69
- items: T[]
70
-
71
- /**
72
- * Whether the data is loaded for the menu items
73
- */
74
- loading?: boolean
75
-
76
- /**
77
- * The IDs of the selected items
78
- */
79
- // NOTE: this diverges from the SelectPanel component API, where we pass an array of objects to the `selected` prop
80
- selectedItemIds: Array<string | number>
81
-
82
- /**
83
- * The sort function that is applied to the options in the array passed to the `items` prop after the user closes the menu.
84
- * By default, selected items are sorted to the top after the user closes the menu.
85
- */
86
- sortOnCloseFn?: (itemIdA: string | number, itemIdB: string | number) => number
87
-
88
- /**
89
- * Whether there can be one item selected from the menu or multiple items selected from the menu
90
- */
91
- selectionVariant?: 'single' | 'multiple'
92
-
93
- /**
94
- * Function that gets called when the menu is opened or closed
95
- */
96
- onOpenChange?: (open: boolean) => void
97
-
98
- /**
99
- * The function that is called when an item in the list is selected or deselected
100
- */
101
- onSelectedChange?: OnSelectedChange<T>
102
-
103
- /**
104
- * If the menu is rendered in a scrolling element other than the `Autocomplete.Overlay` component,
105
- * pass the ref of that element to `customScrollContainerRef` to ensure the container automatically
106
- * scrolls when the user highlights an item in the menu that is outside the scroll container
107
- */
108
- customScrollContainerRef?: React.MutableRefObject<HTMLElement | null>
109
- } & Pick<React.AriaAttributes, 'aria-labelledby'>
110
-
111
- function AutocompleteMenu<T extends AutocompleteItemProps>(props: AutocompleteMenuInternalProps<T>) {
112
- const autocompleteContext = useContext(AutocompleteContext)
113
- if (autocompleteContext === null) {
114
- throw new Error('AutocompleteContext returned null values')
115
- }
116
- const {
117
- activeDescendantRef,
118
- id,
119
- inputRef,
120
- inputValue = '',
121
- scrollContainerRef,
122
- setAutocompleteSuggestion,
123
- setShowMenu,
124
- setInputValue,
125
- setIsMenuDirectlyActivated,
126
- setSelectedItemLength,
127
- showMenu
128
- } = autocompleteContext
129
- const {
130
- items,
131
- selectedItemIds,
132
- sortOnCloseFn,
133
- emptyStateText,
134
- addNewItem,
135
- loading,
136
- selectionVariant,
137
- filterFn,
138
- 'aria-labelledby': ariaLabelledBy,
139
- onOpenChange,
140
- onSelectedChange,
141
- customScrollContainerRef
142
- } = props
143
- const listContainerRef = useRef<HTMLDivElement>(null)
144
- const [highlightedItem, setHighlightedItem] = useState<T>()
145
- const [sortedItemIds, setSortedItemIds] = useState<Array<number | string>>(items.map(({id: itemId}) => itemId))
146
-
147
- const selectableItems = useMemo(
148
- () =>
149
- items.map(selectableItem => {
150
- return {
151
- ...selectableItem,
152
- role: 'option',
153
- id: selectableItem.id,
154
- selected: selectionVariant === 'multiple' ? selectedItemIds.includes(selectableItem.id) : undefined,
155
- onAction: (item: T) => {
156
- const otherSelectedItemIds = selectedItemIds.filter(selectedItemId => selectedItemId !== item.id)
157
- const newSelectedItemIds = selectedItemIds.includes(item.id)
158
- ? otherSelectedItemIds
159
- : [...otherSelectedItemIds, item.id]
160
- const onSelectedChangeFn = onSelectedChange ? onSelectedChange : getDefaultOnSelectionChange(setInputValue)
161
-
162
- onSelectedChangeFn(
163
- newSelectedItemIds.map(newSelectedItemId => getItemById(newSelectedItemId, items)) as T[]
164
- )
165
-
166
- if (selectionVariant === 'multiple') {
167
- setInputValue('')
168
- setAutocompleteSuggestion('')
169
- } else {
170
- setShowMenu(false)
171
- inputRef.current?.setSelectionRange(inputRef.current.value.length, inputRef.current.value.length)
172
- }
173
- }
174
- }
175
- }),
176
- [
177
- items,
178
- selectedItemIds,
179
- inputRef,
180
- onSelectedChange,
181
- selectionVariant,
182
- setAutocompleteSuggestion,
183
- setInputValue,
184
- setShowMenu
185
- ]
186
- )
187
-
188
- const itemSortOrderData = useMemo(
189
- () =>
190
- sortedItemIds.reduce<Record<string | number, number>>((acc, curr, i) => {
191
- acc[curr] = i
192
-
193
- return acc
194
- }, {}),
195
- [sortedItemIds]
196
- )
197
-
198
- const sortedAndFilteredItemsToRender = useMemo(
199
- () =>
200
- selectableItems
201
- .filter(filterFn ? filterFn : getDefaultItemFilter(inputValue))
202
- .sort((a, b) => itemSortOrderData[a.id] - itemSortOrderData[b.id]),
203
- [selectableItems, itemSortOrderData, filterFn, inputValue]
204
- )
205
-
206
- const allItemsToRender = useMemo(
207
- () => [
208
- // sorted and filtered selectable items
209
- ...sortedAndFilteredItemsToRender,
210
-
211
- // menu item used for creating a token from whatever is in the text input
212
- ...(addNewItem
213
- ? [
214
- {
215
- ...addNewItem,
216
- leadingVisual: () => <PlusIcon />,
217
- onAction: (item: T) => {
218
- // TODO: make it possible to pass a leadingVisual when using `addNewItem`
219
- addNewItem.handleAddItem({...item, id: item.id || uniqueId(), leadingVisual: undefined})
220
-
221
- if (selectionVariant === 'multiple') {
222
- setInputValue('')
223
- setAutocompleteSuggestion('')
224
- }
225
- }
226
- }
227
- ]
228
- : [])
229
- ],
230
- [sortedAndFilteredItemsToRender, addNewItem, setAutocompleteSuggestion, selectionVariant, setInputValue]
231
- )
232
-
233
- useFocusZone(
234
- {
235
- containerRef: listContainerRef,
236
- focusOutBehavior: 'wrap',
237
- focusableElementFilter: element => {
238
- return !(element instanceof HTMLInputElement)
239
- },
240
- activeDescendantFocus: inputRef,
241
- onActiveDescendantChanged: (current, _previous, directlyActivated) => {
242
- activeDescendantRef.current = current || null
243
- if (current) {
244
- const selectedItem = selectableItems.find(item => item.id.toString() === current.getAttribute('data-id'))
245
-
246
- setHighlightedItem(selectedItem)
247
- setIsMenuDirectlyActivated(directlyActivated)
248
- }
249
-
250
- if (current && customScrollContainerRef && customScrollContainerRef.current && directlyActivated) {
251
- scrollIntoViewingArea(current, customScrollContainerRef.current)
252
- } else if (current && scrollContainerRef.current && directlyActivated) {
253
- scrollIntoViewingArea(current, scrollContainerRef.current)
254
- }
255
- }
256
- },
257
- [loading]
258
- )
259
-
260
- useEffect(() => {
261
- if (highlightedItem?.text?.startsWith(inputValue) && !selectedItemIds.includes(highlightedItem.id)) {
262
- setAutocompleteSuggestion(highlightedItem.text)
263
- } else {
264
- setAutocompleteSuggestion('')
265
- }
266
- }, [highlightedItem, inputValue, selectedItemIds, setAutocompleteSuggestion])
267
-
268
- useEffect(() => {
269
- const itemIdSortResult = [...sortedItemIds].sort(
270
- sortOnCloseFn ? sortOnCloseFn : getDefaultSortFn(itemId => isItemSelected(itemId, selectedItemIds))
271
- )
272
- const sortResultMatchesState =
273
- itemIdSortResult.length === sortedItemIds.length &&
274
- itemIdSortResult.every((element, index) => element === sortedItemIds[index])
275
-
276
- if (showMenu === false && !sortResultMatchesState) {
277
- setSortedItemIds(itemIdSortResult)
278
- }
279
-
280
- onOpenChange && onOpenChange(Boolean(showMenu))
281
- }, [showMenu, onOpenChange, selectedItemIds, sortOnCloseFn, sortedItemIds])
282
-
283
- useEffect(() => {
284
- if (selectedItemIds.length) {
285
- setSelectedItemLength(selectedItemIds.length)
286
- }
287
- }, [selectedItemIds, setSelectedItemLength])
288
-
289
- return (
290
- <Box
291
- sx={
292
- !showMenu
293
- ? {
294
- // visually hides this label for sighted users
295
- position: 'absolute',
296
- width: '1px',
297
- height: '1px',
298
- padding: '0',
299
- margin: '-1px',
300
- overflow: 'hidden',
301
- clip: 'rect(0, 0, 0, 0)',
302
- whiteSpace: 'nowrap',
303
- borderWidth: '0'
304
- }
305
- : {}
306
- }
307
- >
308
- {loading ? (
309
- <Box p={3} display="flex" justifyContent="center">
310
- <Spinner />
311
- </Box>
312
- ) : (
313
- <div ref={listContainerRef}>
314
- {allItemsToRender.length ? (
315
- <ActionList
316
- selectionVariant="multiple"
317
- // have to typecast to `ItemProps` because we have an extra property
318
- // on `items` for Autocomplete: `metadata`
319
- items={allItemsToRender as ItemProps[]}
320
- role="listbox"
321
- id={`${id}-listbox`}
322
- aria-labelledby={ariaLabelledBy}
323
- />
324
- ) : (
325
- <Box p={3}>{emptyStateText}</Box>
326
- )}
327
- </div>
328
- )}
329
- </Box>
330
- )
331
- }
332
-
333
- AutocompleteMenu.defaultProps = {
334
- emptyStateText: 'No selectable options',
335
- selectionVariant: 'single'
336
- }
337
-
338
- AutocompleteMenu.displayName = 'AutocompleteMenu'
339
-
340
- export type AutocompleteMenuProps = ComponentProps<typeof AutocompleteMenu>
341
- export default AutocompleteMenu
@@ -1,68 +0,0 @@
1
- import React, {useCallback, useContext} from 'react'
2
- import {useAnchoredPosition} from '../hooks'
3
- import Overlay, {OverlayProps} from '../Overlay'
4
- import {ComponentProps} from '../utils/types'
5
- import {AutocompleteContext} from './AutocompleteContext'
6
- import {useCombinedRefs} from '../hooks/useCombinedRefs'
7
-
8
- type AutocompleteOverlayInternalProps = {
9
- /**
10
- * The ref of the element that the position of the menu is based on. By default, the menu is positioned based on the text input
11
- */
12
- menuAnchorRef?: React.RefObject<HTMLElement>
13
- /**
14
- * Props to be spread on the internal `Overlay` component.
15
- */
16
- overlayProps?: Partial<OverlayProps>
17
- children?: React.ReactNode
18
- } & Pick<React.AriaAttributes, 'aria-labelledby'> // TODO: consider making 'aria-labelledby' required
19
-
20
- function AutocompleteOverlay({menuAnchorRef, overlayProps, children}: AutocompleteOverlayInternalProps) {
21
- const autocompleteContext = useContext(AutocompleteContext)
22
- if (autocompleteContext === null) {
23
- throw new Error('AutocompleteContext returned null values')
24
- }
25
- const {inputRef, scrollContainerRef, selectedItemLength, setShowMenu, showMenu = false} = autocompleteContext
26
- const {floatingElementRef, position} = useAnchoredPosition(
27
- {
28
- side: 'outside-bottom',
29
- align: 'start',
30
- anchorElementRef: menuAnchorRef ? menuAnchorRef : inputRef
31
- },
32
- [showMenu, selectedItemLength]
33
- )
34
-
35
- const combinedOverlayRef = useCombinedRefs(scrollContainerRef, floatingElementRef)
36
-
37
- const closeOptionList = useCallback(() => {
38
- setShowMenu(false)
39
- }, [setShowMenu])
40
-
41
- if (typeof window === 'undefined') {
42
- return null
43
- }
44
-
45
- return (
46
- <Overlay
47
- returnFocusRef={inputRef}
48
- preventFocusOnOpen={true}
49
- onClickOutside={closeOptionList}
50
- onEscape={closeOptionList}
51
- ref={combinedOverlayRef as React.RefObject<HTMLDivElement>}
52
- top={position?.top}
53
- left={position?.left}
54
- visibility={showMenu ? 'visible' : 'hidden'}
55
- sx={{
56
- overflow: 'auto'
57
- }}
58
- {...overlayProps}
59
- >
60
- {children}
61
- </Overlay>
62
- )
63
- }
64
-
65
- AutocompleteOverlay.displayName = 'AutocompleteOverlay'
66
-
67
- export type AutocompleteOverlayProps = ComponentProps<typeof AutocompleteOverlay>
68
- export default AutocompleteOverlay
@@ -1,2 +0,0 @@
1
- export {default} from './Autocomplete'
2
- export type {AutocompleteMenuProps, AutocompleteInputProps, AutocompleteOverlayProps} from './Autocomplete'
package/src/Avatar.tsx DELETED
@@ -1,46 +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 StyledAvatarProps = {
7
- /** Sets the width and height of the avatar. */
8
- size?: number
9
- /** Sets the shape of the avatar to a square if true. If false, the avatar will be circular. */
10
- square?: boolean
11
- /** URL of the avatar image. */
12
- src: string
13
- /** Provide alt text when the Avatar is used without the user's name next to it. */
14
- alt?: string
15
- } & SystemCommonProps &
16
- SxProp
17
-
18
- function getBorderRadius({size, square}: StyledAvatarProps) {
19
- if (square) {
20
- return size && size <= 24 ? '4px' : '6px'
21
- } else {
22
- return '50%'
23
- }
24
- }
25
-
26
- const Avatar = styled.img.attrs<StyledAvatarProps>(props => ({
27
- height: props.size,
28
- width: props.size
29
- }))<StyledAvatarProps>`
30
- display: inline-block;
31
- overflow: hidden; // Ensure page layout in Firefox should images fail to load
32
- line-height: ${get('lineHeights.condensedUltra')};
33
- vertical-align: middle;
34
- border-radius: ${props => getBorderRadius(props)};
35
- ${COMMON};
36
- ${sx}
37
- `
38
-
39
- Avatar.defaultProps = {
40
- size: 20,
41
- alt: '',
42
- square: false
43
- }
44
-
45
- export type AvatarProps = ComponentProps<typeof Avatar>
46
- export default Avatar
@@ -1,35 +0,0 @@
1
- import React from 'react'
2
- import styled from 'styled-components'
3
- import Avatar from './Avatar'
4
- import {get} from './constants'
5
- import {Box, BoxProps} from '.'
6
-
7
- const ChildAvatar = styled(Avatar)`
8
- position: absolute;
9
- right: -15%;
10
- bottom: -9%;
11
- box-shadow: ${get('shadows.avatar.childShadow')};
12
- `
13
-
14
- export type AvatarPairProps = BoxProps
15
-
16
- const AvatarPair = ({children, ...rest}: AvatarPairProps) => {
17
- const avatars = React.Children.map(children, (child, i) => {
18
- if (!React.isValidElement(child)) return child
19
- return i === 0 ? (
20
- React.cloneElement(child, {size: 40})
21
- ) : (
22
- <ChildAvatar bg="canvas.default" {...child.props} size={20} />
23
- )
24
- })
25
- return (
26
- <Box position="relative" display="inline-flex" {...rest}>
27
- {avatars}
28
- </Box>
29
- )
30
- }
31
-
32
- // styled() changes this
33
- AvatarPair.displayName = 'AvatarPair'
34
-
35
- export default AvatarPair