@primer/components 0.0.0-20211030173748 → 0.0.0-20211030175556

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 (362) hide show
  1. package/CHANGELOG.md +2 -28
  2. package/dist/browser.esm.js +585 -606
  3. package/dist/browser.esm.js.map +1 -1
  4. package/dist/browser.umd.js +201 -222
  5. package/dist/browser.umd.js.map +1 -1
  6. package/lib/ActionList/Divider.jsx +29 -0
  7. package/lib/ActionList/Group.jsx +23 -0
  8. package/lib/ActionList/Header.jsx +66 -0
  9. package/lib/ActionList/Item.js +3 -3
  10. package/lib/ActionList/Item.jsx +288 -0
  11. package/lib/ActionList/List.jsx +138 -0
  12. package/lib/ActionList/index.js +12 -23
  13. package/lib/ActionList2/Description.jsx +29 -0
  14. package/lib/ActionList2/Divider.jsx +22 -0
  15. package/lib/ActionList2/Group.jsx +54 -0
  16. package/lib/ActionList2/Header.d.ts +26 -0
  17. package/lib/ActionList2/Header.js +55 -0
  18. package/lib/ActionList2/Header.jsx +36 -0
  19. package/lib/ActionList2/Item.js +1 -3
  20. package/lib/ActionList2/Item.jsx +174 -0
  21. package/lib/ActionList2/LinkItem.jsx +28 -0
  22. package/lib/ActionList2/List.js +2 -1
  23. package/lib/ActionList2/List.jsx +41 -0
  24. package/lib/ActionList2/Selection.js +1 -3
  25. package/lib/ActionList2/Selection.jsx +50 -0
  26. package/lib/ActionList2/Visuals.jsx +48 -0
  27. package/lib/ActionList2/index.js +23 -41
  28. package/lib/ActionMenu.jsx +73 -0
  29. package/lib/AnchoredOverlay/AnchoredOverlay.jsx +100 -0
  30. package/lib/AnchoredOverlay/index.js +4 -12
  31. package/lib/Autocomplete/Autocomplete.d.ts +0 -1
  32. package/lib/Autocomplete/Autocomplete.jsx +100 -0
  33. package/lib/Autocomplete/AutocompleteContext.jsx +5 -0
  34. package/lib/Autocomplete/AutocompleteInput.d.ts +0 -1
  35. package/lib/Autocomplete/AutocompleteInput.jsx +113 -0
  36. package/lib/Autocomplete/AutocompleteMenu.js +13 -6
  37. package/lib/Autocomplete/AutocompleteMenu.jsx +190 -0
  38. package/lib/Autocomplete/AutocompleteOverlay.jsx +55 -0
  39. package/lib/Autocomplete/index.js +7 -14
  40. package/lib/Avatar.jsx +34 -0
  41. package/lib/AvatarPair.jsx +29 -0
  42. package/lib/AvatarStack.jsx +151 -0
  43. package/lib/BaseStyles.jsx +65 -0
  44. package/lib/BorderBox.jsx +18 -0
  45. package/lib/Box.jsx +10 -0
  46. package/lib/BranchName.jsx +20 -0
  47. package/lib/Breadcrumbs.jsx +71 -0
  48. package/lib/Button/Button.d.ts +0 -1
  49. package/lib/Button/Button.jsx +40 -0
  50. package/lib/Button/ButtonBase.jsx +33 -0
  51. package/lib/Button/ButtonClose.d.ts +1 -2
  52. package/lib/Button/ButtonClose.jsx +53 -0
  53. package/lib/Button/ButtonDanger.d.ts +0 -1
  54. package/lib/Button/ButtonDanger.jsx +43 -0
  55. package/lib/Button/ButtonGroup.jsx +55 -0
  56. package/lib/Button/ButtonInvisible.d.ts +0 -1
  57. package/lib/Button/ButtonInvisible.jsx +32 -0
  58. package/lib/Button/ButtonOutline.d.ts +0 -1
  59. package/lib/Button/ButtonOutline.jsx +43 -0
  60. package/lib/Button/ButtonPrimary.d.ts +0 -1
  61. package/lib/Button/ButtonPrimary.jsx +42 -0
  62. package/lib/Button/ButtonStyles.jsx +37 -0
  63. package/lib/Button/ButtonTableList.jsx +46 -0
  64. package/lib/Button/index.js +21 -70
  65. package/lib/Caret.jsx +93 -0
  66. package/lib/CircleBadge.jsx +42 -0
  67. package/lib/CircleOcticon.d.ts +0 -1
  68. package/lib/CircleOcticon.jsx +21 -0
  69. package/lib/CounterLabel.jsx +43 -0
  70. package/lib/Details.jsx +21 -0
  71. package/lib/Dialog/ConfirmationDialog.jsx +146 -0
  72. package/lib/Dialog/Dialog.jsx +279 -0
  73. package/lib/Dialog.d.ts +2 -3
  74. package/lib/Dialog.jsx +129 -0
  75. package/lib/Dropdown.d.ts +0 -4
  76. package/lib/Dropdown.jsx +131 -0
  77. package/lib/DropdownMenu/DropdownButton.d.ts +1 -2
  78. package/lib/DropdownMenu/DropdownButton.jsx +14 -0
  79. package/lib/DropdownMenu/DropdownMenu.jsx +70 -0
  80. package/lib/DropdownMenu/index.js +6 -20
  81. package/lib/DropdownStyles.js +18 -26
  82. package/lib/FilterList.d.ts +0 -1
  83. package/lib/FilterList.jsx +59 -0
  84. package/lib/FilteredActionList/FilteredActionList.jsx +100 -0
  85. package/lib/FilteredActionList/index.js +4 -12
  86. package/lib/FilteredSearch.jsx +28 -0
  87. package/lib/Flash.jsx +69 -0
  88. package/lib/Flex.jsx +15 -0
  89. package/lib/FormGroup.jsx +22 -0
  90. package/lib/Grid.jsx +15 -0
  91. package/lib/Header.jsx +83 -0
  92. package/lib/Heading.jsx +21 -0
  93. package/lib/Label.jsx +82 -0
  94. package/lib/LabelGroup.jsx +18 -0
  95. package/lib/Link.jsx +36 -0
  96. package/lib/NewButton/button-counter.jsx +14 -0
  97. package/lib/NewButton/button.jsx +279 -0
  98. package/lib/NewButton/index.js +5 -12
  99. package/lib/NewButton/types.js +2 -1
  100. package/lib/Overlay.d.ts +3 -5
  101. package/lib/Overlay.jsx +154 -0
  102. package/lib/Pagehead.jsx +17 -0
  103. package/lib/Pagination/Pagination.jsx +161 -0
  104. package/lib/Pagination/index.js +6 -12
  105. package/lib/Pagination/model.jsx +174 -0
  106. package/lib/PointerBox.jsx +25 -0
  107. package/lib/Popover.jsx +202 -0
  108. package/lib/Portal/Portal.jsx +79 -0
  109. package/lib/Portal/index.js +5 -16
  110. package/lib/Position.d.ts +4 -4
  111. package/lib/Position.jsx +46 -0
  112. package/lib/ProgressBar.jsx +39 -0
  113. package/lib/SelectMenu/SelectMenu.d.ts +4 -10
  114. package/lib/SelectMenu/SelectMenu.jsx +112 -0
  115. package/lib/SelectMenu/SelectMenuContext.jsx +5 -0
  116. package/lib/SelectMenu/SelectMenuDivider.jsx +42 -0
  117. package/lib/SelectMenu/SelectMenuFilter.jsx +58 -0
  118. package/lib/SelectMenu/SelectMenuFooter.jsx +45 -0
  119. package/lib/SelectMenu/SelectMenuHeader.jsx +42 -0
  120. package/lib/SelectMenu/SelectMenuItem.d.ts +1 -1
  121. package/lib/SelectMenu/SelectMenuItem.jsx +142 -0
  122. package/lib/SelectMenu/SelectMenuList.jsx +59 -0
  123. package/lib/SelectMenu/SelectMenuLoadingAnimation.jsx +22 -0
  124. package/lib/SelectMenu/SelectMenuModal.d.ts +1 -1
  125. package/lib/SelectMenu/SelectMenuModal.jsx +118 -0
  126. package/lib/SelectMenu/SelectMenuTab.jsx +92 -0
  127. package/lib/SelectMenu/SelectMenuTabPanel.jsx +42 -0
  128. package/lib/SelectMenu/SelectMenuTabs.jsx +57 -0
  129. package/lib/SelectMenu/hooks/useKeyboardNav.js +80 -96
  130. package/lib/SelectMenu/index.js +7 -14
  131. package/lib/SelectPanel/SelectPanel.jsx +105 -0
  132. package/lib/SelectPanel/index.js +4 -12
  133. package/lib/SideNav.jsx +173 -0
  134. package/lib/Spinner.jsx +35 -0
  135. package/lib/StateLabel.jsx +93 -0
  136. package/lib/StyledOcticon.jsx +18 -0
  137. package/lib/SubNav.jsx +101 -0
  138. package/lib/TabNav.jsx +58 -0
  139. package/lib/Text.jsx +14 -0
  140. package/lib/TextInput.jsx +23 -0
  141. package/lib/TextInputWithTokens.d.ts +0 -1
  142. package/lib/TextInputWithTokens.jsx +218 -0
  143. package/lib/ThemeProvider.jsx +130 -0
  144. package/lib/Timeline.jsx +123 -0
  145. package/lib/Token/AvatarToken.d.ts +1 -1
  146. package/lib/Token/AvatarToken.jsx +54 -0
  147. package/lib/Token/IssueLabelToken.d.ts +1 -1
  148. package/lib/Token/IssueLabelToken.jsx +125 -0
  149. package/lib/Token/Token.d.ts +1 -1
  150. package/lib/Token/Token.jsx +103 -0
  151. package/lib/Token/TokenBase.jsx +88 -0
  152. package/lib/Token/_RemoveTokenButton.jsx +108 -0
  153. package/lib/Token/_TokenTextContainer.jsx +49 -0
  154. package/lib/Token/index.js +11 -30
  155. package/lib/Tooltip.jsx +246 -0
  156. package/lib/Truncate.jsx +24 -0
  157. package/lib/UnderlineNav.jsx +88 -0
  158. package/lib/_TextInputWrapper.jsx +120 -0
  159. package/lib/_UnstyledTextInput.jsx +22 -0
  160. package/lib/behaviors/anchoredPosition.js +205 -234
  161. package/lib/behaviors/focusTrap.js +121 -157
  162. package/lib/behaviors/focusZone.js +434 -509
  163. package/lib/behaviors/scrollIntoViewingArea.js +18 -35
  164. package/lib/constants.js +39 -43
  165. package/lib/drafts.js +20 -30
  166. package/lib/hooks/index.js +16 -60
  167. package/lib/hooks/useAnchoredPosition.js +32 -40
  168. package/lib/hooks/useCombinedRefs.js +32 -36
  169. package/lib/hooks/useDetails.jsx +39 -0
  170. package/lib/hooks/useDialog.js +72 -96
  171. package/lib/hooks/useFocusTrap.js +43 -60
  172. package/lib/hooks/useFocusZone.js +54 -50
  173. package/lib/hooks/useOnEscapePress.js +25 -36
  174. package/lib/hooks/useOnOutsideClick.jsx +61 -0
  175. package/lib/hooks/useOpenAndCloseFocus.js +22 -34
  176. package/lib/hooks/useOverlay.jsx +15 -0
  177. package/lib/hooks/useProvidedRefOrCreate.js +10 -14
  178. package/lib/hooks/useProvidedStateOrCreate.js +13 -16
  179. package/lib/hooks/useRenderForcingRef.js +13 -17
  180. package/lib/hooks/useResizeObserver.js +15 -18
  181. package/lib/hooks/useSafeTimeout.js +22 -30
  182. package/lib/hooks/useScrollFlash.js +16 -23
  183. package/lib/index.d.ts +0 -6
  184. package/lib/index.js +163 -690
  185. package/lib/polyfills/eventListenerSignal.js +37 -45
  186. package/lib/sx.js +10 -22
  187. package/lib/theme-preval.js +64 -3169
  188. package/lib/theme.js +3 -12
  189. package/lib/utils/create-slots.jsx +65 -0
  190. package/lib/utils/deprecate.jsx +59 -0
  191. package/lib/utils/isNumeric.jsx +7 -0
  192. package/lib/utils/iterateFocusableElements.js +63 -85
  193. package/lib/utils/ssr.jsx +6 -0
  194. package/lib/utils/test-deprecations.jsx +20 -0
  195. package/lib/utils/test-helpers.jsx +8 -0
  196. package/lib/utils/test-matchers.jsx +100 -0
  197. package/lib/utils/testing.d.ts +1 -2
  198. package/lib/utils/testing.js +0 -29
  199. package/lib/utils/testing.jsx +206 -0
  200. package/lib/utils/theme.js +33 -47
  201. package/lib/utils/types/AriaRole.js +2 -1
  202. package/lib/utils/types/ComponentProps.js +2 -1
  203. package/lib/utils/types/Flatten.js +2 -1
  204. package/lib/utils/types/KeyPaths.js +2 -1
  205. package/lib/utils/types/MandateProps.js +16 -1
  206. package/lib/utils/types/Merge.js +2 -1
  207. package/lib/utils/types/index.js +16 -69
  208. package/lib/utils/uniqueId.js +5 -8
  209. package/lib/utils/use-force-update.js +8 -14
  210. package/lib/utils/useIsomorphicLayoutEffect.js +8 -11
  211. package/lib/utils/userAgent.js +8 -12
  212. package/lib-esm/ActionList/Item.js +3 -3
  213. package/lib-esm/ActionList2/Header.d.ts +26 -0
  214. package/lib-esm/ActionList2/Header.js +44 -0
  215. package/lib-esm/ActionList2/Item.js +1 -3
  216. package/lib-esm/ActionList2/List.js +2 -1
  217. package/lib-esm/ActionList2/Selection.js +1 -3
  218. package/lib-esm/Autocomplete/Autocomplete.d.ts +0 -1
  219. package/lib-esm/Autocomplete/AutocompleteInput.d.ts +0 -1
  220. package/lib-esm/Autocomplete/AutocompleteMenu.js +13 -3
  221. package/lib-esm/Button/Button.d.ts +0 -1
  222. package/lib-esm/Button/ButtonClose.d.ts +1 -2
  223. package/lib-esm/Button/ButtonDanger.d.ts +0 -1
  224. package/lib-esm/Button/ButtonInvisible.d.ts +0 -1
  225. package/lib-esm/Button/ButtonOutline.d.ts +0 -1
  226. package/lib-esm/Button/ButtonPrimary.d.ts +0 -1
  227. package/lib-esm/CircleOcticon.d.ts +0 -1
  228. package/lib-esm/Dialog.d.ts +2 -3
  229. package/lib-esm/Dropdown.d.ts +0 -4
  230. package/lib-esm/DropdownMenu/DropdownButton.d.ts +1 -2
  231. package/lib-esm/FilterList.d.ts +0 -1
  232. package/lib-esm/Overlay.d.ts +3 -5
  233. package/lib-esm/Position.d.ts +4 -4
  234. package/lib-esm/SelectMenu/SelectMenu.d.ts +4 -10
  235. package/lib-esm/SelectMenu/SelectMenuItem.d.ts +1 -1
  236. package/lib-esm/SelectMenu/SelectMenuModal.d.ts +1 -1
  237. package/lib-esm/TextInputWithTokens.d.ts +0 -1
  238. package/lib-esm/Token/AvatarToken.d.ts +1 -1
  239. package/lib-esm/Token/IssueLabelToken.d.ts +1 -1
  240. package/lib-esm/Token/Token.d.ts +1 -1
  241. package/lib-esm/index.d.ts +0 -6
  242. package/lib-esm/index.js +0 -5
  243. package/lib-esm/theme-preval.js +0 -446
  244. package/lib-esm/utils/testing.d.ts +1 -2
  245. package/lib-esm/utils/testing.js +0 -24
  246. package/package.json +6 -5
  247. package/lib/Checkbox.d.ts +0 -29
  248. package/lib/Checkbox.js +0 -64
  249. package/lib/CheckboxInputField.d.ts +0 -11
  250. package/lib/CheckboxInputField.js +0 -73
  251. package/lib/ChoiceFieldset/ChoiceField.d.ts +0 -22
  252. package/lib/ChoiceFieldset/ChoiceField.js +0 -58
  253. package/lib/ChoiceFieldset/ChoiceFieldCaption.d.ts +0 -3
  254. package/lib/ChoiceFieldset/ChoiceFieldCaption.js +0 -35
  255. package/lib/ChoiceFieldset/ChoiceFieldInput.d.ts +0 -13
  256. package/lib/ChoiceFieldset/ChoiceFieldInput.js +0 -43
  257. package/lib/ChoiceFieldset/ChoiceFieldLabel.d.ts +0 -3
  258. package/lib/ChoiceFieldset/ChoiceFieldLabel.js +0 -35
  259. package/lib/ChoiceFieldset/ChoiceFieldset.d.ts +0 -57
  260. package/lib/ChoiceFieldset/ChoiceFieldset.js +0 -95
  261. package/lib/ChoiceFieldset/ChoiceFieldsetCaption.d.ts +0 -3
  262. package/lib/ChoiceFieldset/ChoiceFieldsetCaption.js +0 -28
  263. package/lib/ChoiceFieldset/ChoiceFieldsetLegend.d.ts +0 -6
  264. package/lib/ChoiceFieldset/ChoiceFieldsetLegend.js +0 -41
  265. package/lib/ChoiceFieldset/ChoiceFieldsetList.d.ts +0 -6
  266. package/lib/ChoiceFieldset/ChoiceFieldsetList.js +0 -85
  267. package/lib/ChoiceFieldset/ChoiceFieldsetListContext.d.ts +0 -17
  268. package/lib/ChoiceFieldset/ChoiceFieldsetListContext.js +0 -15
  269. package/lib/ChoiceFieldset/ChoiceFieldsetValidation.d.ts +0 -6
  270. package/lib/ChoiceFieldset/ChoiceFieldsetValidation.js +0 -17
  271. package/lib/ChoiceFieldset/index.d.ts +0 -3
  272. package/lib/ChoiceFieldset/index.js +0 -23
  273. package/lib/RadioInputField.d.ts +0 -9
  274. package/lib/RadioInputField.js +0 -82
  275. package/lib/TextInputField.d.ts +0 -581
  276. package/lib/TextInputField.js +0 -66
  277. package/lib/_InputCaption.d.ts +0 -13
  278. package/lib/_InputCaption.js +0 -27
  279. package/lib/_InputField/InputField.d.ts +0 -39
  280. package/lib/_InputField/InputField.js +0 -90
  281. package/lib/_InputField/InputFieldCaption.d.ts +0 -3
  282. package/lib/_InputField/InputFieldCaption.js +0 -30
  283. package/lib/_InputField/InputFieldLabel.d.ts +0 -9
  284. package/lib/_InputField/InputFieldLabel.js +0 -34
  285. package/lib/_InputField/InputFieldValidation.d.ts +0 -6
  286. package/lib/_InputField/InputFieldValidation.js +0 -17
  287. package/lib/_InputField/ToggleInputField.d.ts +0 -13
  288. package/lib/_InputField/ToggleInputField.js +0 -71
  289. package/lib/_InputField/ToggleInputLeadingVisual.d.ts +0 -3
  290. package/lib/_InputField/ToggleInputLeadingVisual.js +0 -22
  291. package/lib/_InputField/ValidationAnimationContainer.d.ts +0 -6
  292. package/lib/_InputField/ValidationAnimationContainer.js +0 -48
  293. package/lib/_InputField/index.d.ts +0 -1
  294. package/lib/_InputField/index.js +0 -15
  295. package/lib/_InputField/slots.d.ts +0 -13
  296. package/lib/_InputField/slots.js +0 -17
  297. package/lib/_InputLabel.d.ts +0 -8
  298. package/lib/_InputLabel.js +0 -44
  299. package/lib/_InputValidation.d.ts +0 -8
  300. package/lib/_InputValidation.js +0 -56
  301. package/lib/_VisuallyHidden.d.ts +0 -6
  302. package/lib/_VisuallyHidden.js +0 -39
  303. package/lib/utils/types/FormValidationStatus.d.ts +0 -1
  304. package/lib/utils/types/FormValidationStatus.js +0 -1
  305. package/lib-esm/Checkbox.d.ts +0 -29
  306. package/lib-esm/Checkbox.js +0 -44
  307. package/lib-esm/CheckboxInputField.d.ts +0 -11
  308. package/lib-esm/CheckboxInputField.js +0 -56
  309. package/lib-esm/ChoiceFieldset/ChoiceField.d.ts +0 -22
  310. package/lib-esm/ChoiceFieldset/ChoiceField.js +0 -36
  311. package/lib-esm/ChoiceFieldset/ChoiceFieldCaption.d.ts +0 -3
  312. package/lib-esm/ChoiceFieldset/ChoiceFieldCaption.js +0 -20
  313. package/lib-esm/ChoiceFieldset/ChoiceFieldInput.d.ts +0 -13
  314. package/lib-esm/ChoiceFieldset/ChoiceFieldInput.js +0 -28
  315. package/lib-esm/ChoiceFieldset/ChoiceFieldLabel.d.ts +0 -3
  316. package/lib-esm/ChoiceFieldset/ChoiceFieldLabel.js +0 -20
  317. package/lib-esm/ChoiceFieldset/ChoiceFieldset.d.ts +0 -57
  318. package/lib-esm/ChoiceFieldset/ChoiceFieldset.js +0 -72
  319. package/lib-esm/ChoiceFieldset/ChoiceFieldsetCaption.d.ts +0 -3
  320. package/lib-esm/ChoiceFieldset/ChoiceFieldsetCaption.js +0 -16
  321. package/lib-esm/ChoiceFieldset/ChoiceFieldsetLegend.d.ts +0 -6
  322. package/lib-esm/ChoiceFieldset/ChoiceFieldsetLegend.js +0 -28
  323. package/lib-esm/ChoiceFieldset/ChoiceFieldsetList.d.ts +0 -6
  324. package/lib-esm/ChoiceFieldset/ChoiceFieldsetList.js +0 -68
  325. package/lib-esm/ChoiceFieldset/ChoiceFieldsetListContext.d.ts +0 -17
  326. package/lib-esm/ChoiceFieldset/ChoiceFieldsetListContext.js +0 -5
  327. package/lib-esm/ChoiceFieldset/ChoiceFieldsetValidation.d.ts +0 -6
  328. package/lib-esm/ChoiceFieldset/ChoiceFieldsetValidation.js +0 -7
  329. package/lib-esm/ChoiceFieldset/index.d.ts +0 -3
  330. package/lib-esm/ChoiceFieldset/index.js +0 -2
  331. package/lib-esm/RadioInputField.d.ts +0 -9
  332. package/lib-esm/RadioInputField.js +0 -65
  333. package/lib-esm/TextInputField.d.ts +0 -581
  334. package/lib-esm/TextInputField.js +0 -50
  335. package/lib-esm/_InputCaption.d.ts +0 -13
  336. package/lib-esm/_InputCaption.js +0 -16
  337. package/lib-esm/_InputField/InputField.d.ts +0 -39
  338. package/lib-esm/_InputField/InputField.js +0 -70
  339. package/lib-esm/_InputField/InputFieldCaption.d.ts +0 -3
  340. package/lib-esm/_InputField/InputFieldCaption.js +0 -18
  341. package/lib-esm/_InputField/InputFieldLabel.d.ts +0 -9
  342. package/lib-esm/_InputField/InputFieldLabel.js +0 -22
  343. package/lib-esm/_InputField/InputFieldValidation.d.ts +0 -6
  344. package/lib-esm/_InputField/InputFieldValidation.js +0 -7
  345. package/lib-esm/_InputField/ToggleInputField.d.ts +0 -13
  346. package/lib-esm/_InputField/ToggleInputField.js +0 -54
  347. package/lib-esm/_InputField/ToggleInputLeadingVisual.d.ts +0 -3
  348. package/lib-esm/_InputField/ToggleInputLeadingVisual.js +0 -11
  349. package/lib-esm/_InputField/ValidationAnimationContainer.d.ts +0 -6
  350. package/lib-esm/_InputField/ValidationAnimationContainer.js +0 -33
  351. package/lib-esm/_InputField/index.d.ts +0 -1
  352. package/lib-esm/_InputField/index.js +0 -1
  353. package/lib-esm/_InputField/slots.d.ts +0 -13
  354. package/lib-esm/_InputField/slots.js +0 -5
  355. package/lib-esm/_InputLabel.d.ts +0 -8
  356. package/lib-esm/_InputLabel.js +0 -32
  357. package/lib-esm/_InputValidation.d.ts +0 -8
  358. package/lib-esm/_InputValidation.js +0 -43
  359. package/lib-esm/_VisuallyHidden.d.ts +0 -6
  360. package/lib-esm/_VisuallyHidden.js +0 -26
  361. package/lib-esm/utils/types/FormValidationStatus.d.ts +0 -1
  362. package/lib-esm/utils/types/FormValidationStatus.js +0 -1
@@ -1,73 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _ = require(".");
11
-
12
- var _InputField = _interopRequireDefault(require("./_InputField/InputField"));
13
-
14
- var _slots = require("./_InputField/slots");
15
-
16
- var _ToggleInputField = _interopRequireDefault(require("./_InputField/ToggleInputField"));
17
-
18
- var _ToggleInputLeadingVisual = _interopRequireDefault(require("./_InputField/ToggleInputLeadingVisual"));
19
-
20
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
21
-
22
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
23
-
24
- const Input = ({
25
- id: idProp,
26
- required: requiredProp,
27
- disabled: disabledProp,
28
- ...rest
29
- }) => {
30
- if (idProp) {
31
- // eslint-disable-next-line no-console
32
- console.warn("instead of passing the 'id' prop directly to <TextInputField.Input>, it should be passed to the parent component, <TextInputField>");
33
- }
34
-
35
- if (disabledProp) {
36
- // eslint-disable-next-line no-console
37
- console.warn("instead of passing the 'disabled' prop directly to <TextInputField.Input>, it should be passed to the parent component, <TextInputField>");
38
- }
39
-
40
- if (requiredProp) {
41
- // eslint-disable-next-line no-console
42
- console.warn("instead of passing the 'required' prop directly to <TextInputField.Input>, it should be passed to the parent component, <TextInputField>");
43
- }
44
-
45
- return /*#__PURE__*/_react.default.createElement(_slots.Slot, {
46
- name: "Input"
47
- }, ({
48
- disabled,
49
- id,
50
- required,
51
- captionId
52
- }) => /*#__PURE__*/_react.default.createElement(_.Checkbox, _extends({
53
- "aria-describedby": captionId,
54
- id: id,
55
- required: required,
56
- disabled: disabled
57
- }, rest)));
58
- };
59
-
60
- Input.displayName = "Input";
61
-
62
- const CheckboxInputField = props => /*#__PURE__*/_react.default.createElement(_ToggleInputField.default, props);
63
-
64
- CheckboxInputField.displayName = "CheckboxInputField";
65
-
66
- var _default = Object.assign(CheckboxInputField, {
67
- Input,
68
- Caption: _InputField.default.Caption,
69
- Label: _InputField.default.Label,
70
- LeadingVisual: _ToggleInputLeadingVisual.default
71
- });
72
-
73
- exports.default = _default;
@@ -1,22 +0,0 @@
1
- import React from 'react';
2
- import { ComponentProps } from '../utils/types';
3
- export interface ChoiceFieldProps {
4
- /**
5
- * Whether the field is ready for user input
6
- */
7
- disabled?: boolean;
8
- /**
9
- * The unique identifier for this field. Used to associate the label, validation text, and caption text
10
- */
11
- id?: string;
12
- }
13
- declare const ChoiceField: React.FC<ChoiceFieldProps>;
14
- export declare type ChoiceFieldComponentProps = ComponentProps<typeof ChoiceField>;
15
- export type { ChoiceFieldInputProps } from './ChoiceFieldInput';
16
- declare const _default: React.FC<ChoiceFieldProps> & {
17
- Caption: React.FC<{}>;
18
- Input: React.FC<import("./ChoiceFieldInput").ChoiceFieldInputProps>;
19
- Label: React.FC<{}>;
20
- LeadingVisual: React.FC<{}>;
21
- };
22
- export default _default;
@@ -1,58 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireWildcard(require("react"));
9
-
10
- var _uniqueId = require("../utils/uniqueId");
11
-
12
- var _ToggleInputLeadingVisual = _interopRequireDefault(require("../_InputField/ToggleInputLeadingVisual"));
13
-
14
- var _ChoiceFieldCaption = _interopRequireDefault(require("./ChoiceFieldCaption"));
15
-
16
- var _ChoiceFieldInput = _interopRequireDefault(require("./ChoiceFieldInput"));
17
-
18
- var _ChoiceFieldLabel = _interopRequireDefault(require("./ChoiceFieldLabel"));
19
-
20
- var _ChoiceFieldsetListContext = _interopRequireDefault(require("./ChoiceFieldsetListContext"));
21
-
22
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
-
24
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
25
-
26
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
27
-
28
- const ChoiceField = ({
29
- children,
30
- id,
31
- disabled
32
- }) => {
33
- const choiceFieldsetListContext = (0, _react.useContext)(_ChoiceFieldsetListContext.default);
34
-
35
- if (choiceFieldsetListContext === null) {
36
- throw new Error('ChoiceFieldsetListContext returned null');
37
- }
38
-
39
- const {
40
- fieldComponent: FieldComponent
41
- } = choiceFieldsetListContext;
42
- const fieldId = id || (0, _uniqueId.uniqueId)();
43
- return /*#__PURE__*/_react.default.createElement(FieldComponent, {
44
- id: fieldId,
45
- disabled: disabled
46
- }, children);
47
- };
48
-
49
- ChoiceField.displayName = "ChoiceField";
50
-
51
- var _default = Object.assign(ChoiceField, {
52
- Caption: _ChoiceFieldCaption.default,
53
- Input: _ChoiceFieldInput.default,
54
- Label: _ChoiceFieldLabel.default,
55
- LeadingVisual: _ToggleInputLeadingVisual.default
56
- });
57
-
58
- exports.default = _default;
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- declare const ChoiceFieldCaption: React.FC;
3
- export default ChoiceFieldCaption;
@@ -1,35 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireWildcard(require("react"));
9
-
10
- var _ChoiceFieldsetListContext = _interopRequireDefault(require("./ChoiceFieldsetListContext"));
11
-
12
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
-
14
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
-
16
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
-
18
- const ChoiceFieldCaption = ({
19
- children
20
- }) => {
21
- const choiceFieldsetListContext = (0, _react.useContext)(_ChoiceFieldsetListContext.default);
22
-
23
- if (choiceFieldsetListContext === null) {
24
- throw new Error('ChoiceFieldsetListContext returned null');
25
- }
26
-
27
- const {
28
- fieldComponent: FieldComponent
29
- } = choiceFieldsetListContext;
30
- return /*#__PURE__*/_react.default.createElement(FieldComponent.Caption, null, children);
31
- };
32
-
33
- ChoiceFieldCaption.displayName = "ChoiceFieldCaption";
34
- var _default = ChoiceFieldCaption;
35
- exports.default = _default;
@@ -1,13 +0,0 @@
1
- import React from 'react';
2
- export interface ChoiceFieldInputProps {
3
- /**
4
- * The value that is being toggled on
5
- */
6
- value: string;
7
- /**
8
- * Whether the input is toggled on
9
- */
10
- checked?: boolean;
11
- }
12
- declare const ChoiceFieldInput: React.FC<ChoiceFieldInputProps>;
13
- export default ChoiceFieldInput;
@@ -1,43 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireWildcard(require("react"));
9
-
10
- var _ChoiceFieldsetListContext = _interopRequireDefault(require("./ChoiceFieldsetListContext"));
11
-
12
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
-
14
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
-
16
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
-
18
- const ChoiceFieldInput = ({
19
- checked,
20
- value
21
- }) => {
22
- const choiceFieldsetListContext = (0, _react.useContext)(_ChoiceFieldsetListContext.default);
23
-
24
- if (choiceFieldsetListContext === null) {
25
- throw new Error('ChoiceFieldsetListContext returned null');
26
- }
27
-
28
- const {
29
- name,
30
- onChange,
31
- fieldComponent: FieldComponent
32
- } = choiceFieldsetListContext;
33
- return /*#__PURE__*/_react.default.createElement(FieldComponent.Input, {
34
- checked: checked,
35
- value: value,
36
- name: name,
37
- onChange: onChange
38
- });
39
- };
40
-
41
- ChoiceFieldInput.displayName = "ChoiceFieldInput";
42
- var _default = ChoiceFieldInput;
43
- exports.default = _default;
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- declare const ChoiceFieldLabel: React.FC;
3
- export default ChoiceFieldLabel;
@@ -1,35 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireWildcard(require("react"));
9
-
10
- var _ChoiceFieldsetListContext = _interopRequireDefault(require("./ChoiceFieldsetListContext"));
11
-
12
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
-
14
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
-
16
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
-
18
- const ChoiceFieldLabel = ({
19
- children
20
- }) => {
21
- const choiceFieldsetListContext = (0, _react.useContext)(_ChoiceFieldsetListContext.default);
22
-
23
- if (choiceFieldsetListContext === null) {
24
- throw new Error('ChoiceFieldsetListContext returned null');
25
- }
26
-
27
- const {
28
- fieldComponent: FieldComponent
29
- } = choiceFieldsetListContext;
30
- return /*#__PURE__*/_react.default.createElement(FieldComponent.Label, null, children);
31
- };
32
-
33
- ChoiceFieldLabel.displayName = "ChoiceFieldLabel";
34
- var _default = ChoiceFieldLabel;
35
- exports.default = _default;
@@ -1,57 +0,0 @@
1
- import React, { ComponentProps } from 'react';
2
- import { FormValidationStatus } from '../utils/types/FormValidationStatus';
3
- export interface ChoiceFieldsetProps<T = Record<string, FormValidationStatus>> {
4
- children?: React.ReactNode;
5
- /**
6
- * The unique identifier for this fieldset. Used to associate the validation text and caption text with the fieldset
7
- */
8
- id?: string;
9
- /**
10
- * The unique identifier used to associate the inputs with eachother
11
- */
12
- name?: string;
13
- /**
14
- * The callback that is called when a user toggles a choice on or off
15
- */
16
- onSelect?: (selectedValues?: string[]) => void;
17
- /**
18
- * Whether this field must have a value for the user to complete their task
19
- */
20
- required?: boolean;
21
- /**
22
- * A map of validation statuses and their associated validation keys. When one of the validation keys is passed to the `validationResult` prop,
23
- * the associated validation message will be rendered in the correct style
24
- */
25
- validationMap?: T;
26
- /**
27
- * The key of the validation message to show
28
- */
29
- validationResult?: keyof T;
30
- }
31
- export interface ChoiceFieldsetContext extends ChoiceFieldsetProps {
32
- captionId: string;
33
- validationMessageId: string;
34
- }
35
- declare const Slot: React.FC<{
36
- name: "Caption" | "ChoiceList" | "Legend" | "Validation";
37
- children: React.ReactNode;
38
- }>;
39
- export { Slot };
40
- declare const ChoiceFieldset: <T extends Record<string, FormValidationStatus>>({ children, id, name, onSelect, required, validationMap, validationResult }: ChoiceFieldsetProps<T>) => JSX.Element;
41
- export declare type InputFieldComponentProps = ComponentProps<typeof ChoiceFieldset>;
42
- export type { ChoiceFieldsetListProps } from './ChoiceFieldsetList';
43
- export type { ChoiceFieldsetLegendProps } from './ChoiceFieldsetLegend';
44
- export type { ChoiceFieldProps } from './ChoiceField';
45
- declare const _default: (<T extends Record<string, FormValidationStatus>>({ children, id, name, onSelect, required, validationMap, validationResult }: ChoiceFieldsetProps<T>) => JSX.Element) & {
46
- ChoiceField: React.FC<import("./ChoiceField").ChoiceFieldProps> & {
47
- Caption: React.FC<{}>;
48
- Input: React.FC<import("./ChoiceFieldInput").ChoiceFieldInputProps>;
49
- Label: React.FC<{}>;
50
- LeadingVisual: React.FC<{}>;
51
- };
52
- Caption: React.FC<{}>;
53
- Legend: React.FC<import("./ChoiceFieldsetLegend").ChoiceFieldsetLegendProps>;
54
- List: React.FC<import("./ChoiceFieldsetList").ChoiceFieldsetListProps>;
55
- Validation: React.FC<import("./ChoiceFieldsetValidation").ChoiceFieldsetValidationProps>;
56
- };
57
- export default _default;
@@ -1,95 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.Slot = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _ = require("..");
11
-
12
- var _createSlots = _interopRequireDefault(require("../utils/create-slots"));
13
-
14
- var _uniqueId = require("../utils/uniqueId");
15
-
16
- var _ValidationAnimationContainer = _interopRequireDefault(require("../_InputField/ValidationAnimationContainer"));
17
-
18
- var _InputValidation = _interopRequireDefault(require("../_InputValidation"));
19
-
20
- var _ChoiceField = _interopRequireDefault(require("./ChoiceField"));
21
-
22
- var _ChoiceFieldsetCaption = _interopRequireDefault(require("./ChoiceFieldsetCaption"));
23
-
24
- var _ChoiceFieldsetLegend = _interopRequireDefault(require("./ChoiceFieldsetLegend"));
25
-
26
- var _ChoiceFieldsetList = _interopRequireDefault(require("./ChoiceFieldsetList"));
27
-
28
- var _ChoiceFieldsetValidation = _interopRequireDefault(require("./ChoiceFieldsetValidation"));
29
-
30
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
31
-
32
- const {
33
- Slots,
34
- Slot
35
- } = (0, _createSlots.default)(['Caption', 'ChoiceList', 'Legend', 'Validation']);
36
- exports.Slot = Slot;
37
-
38
- const ChoiceFieldset = ({
39
- children,
40
- id,
41
- name,
42
- onSelect,
43
- required,
44
- validationMap,
45
- validationResult
46
- }) => {
47
- var _React$Children$map;
48
-
49
- const fieldsetId = id || (0, _uniqueId.uniqueId)();
50
- const validationChildren = (_React$Children$map = _react.default.Children.map(children, child => /*#__PURE__*/_react.default.isValidElement(child) && child.type === _ChoiceFieldsetValidation.default ? child : null)) === null || _React$Children$map === void 0 ? void 0 : _React$Children$map.filter(Boolean);
51
- const validationChildToRender = validationChildren === null || validationChildren === void 0 ? void 0 : validationChildren.find(child => child.props.validationKey === validationResult);
52
- const captionId = `${fieldsetId}-caption`;
53
- const validationMessageId = validationChildToRender ? `${fieldsetId}-validationMsg` : undefined;
54
- return /*#__PURE__*/_react.default.createElement(Slots, {
55
- context: {
56
- captionId,
57
- name,
58
- onSelect,
59
- required,
60
- validationMessageId
61
- }
62
- }, slots => {
63
- const isLegendVisible = /*#__PURE__*/_react.default.isValidElement(slots.Legend) && slots.Legend.props.isVisible;
64
- return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_.Box, {
65
- as: "fieldset",
66
- border: "none",
67
- margin: 0,
68
- padding: 0,
69
- "aria-describedby": [validationMessageId, captionId].filter(Boolean).join(' ')
70
- }, _react.default.Children.toArray(children).filter(child => /*#__PURE__*/_react.default.isValidElement(child) && child.type !== _ChoiceFieldsetValidation.default), /*#__PURE__*/_react.default.createElement(_.Box, {
71
- mb: isLegendVisible ? 3 : undefined
72
- }, slots.Legend), slots.ChoiceList), (validationChildToRender || slots.Caption) && /*#__PURE__*/_react.default.createElement(_.Box, {
73
- mt: 3
74
- }, validationChildToRender && validationMap && validationResult && validationMessageId && /*#__PURE__*/_react.default.createElement(_ValidationAnimationContainer.default, {
75
- show: true
76
- }, /*#__PURE__*/_react.default.createElement(_InputValidation.default, {
77
- validationStatus: validationMap[validationResult],
78
- id: validationMessageId
79
- }, validationChildToRender)), /*#__PURE__*/_react.default.createElement(_.Box, {
80
- mt: validationChildToRender ? 1 : undefined
81
- }, slots.Caption)));
82
- });
83
- };
84
-
85
- ChoiceFieldset.displayName = "ChoiceFieldset";
86
-
87
- var _default = Object.assign(ChoiceFieldset, {
88
- ChoiceField: _ChoiceField.default,
89
- Caption: _ChoiceFieldsetCaption.default,
90
- Legend: _ChoiceFieldsetLegend.default,
91
- List: _ChoiceFieldsetList.default,
92
- Validation: _ChoiceFieldsetValidation.default
93
- });
94
-
95
- exports.default = _default;
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- declare const ChoiceFieldsetCaption: React.FC;
3
- export default ChoiceFieldsetCaption;
@@ -1,28 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _InputCaption = _interopRequireDefault(require("../_InputCaption"));
11
-
12
- var _ChoiceFieldset = require("./ChoiceFieldset");
13
-
14
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
-
16
- const ChoiceFieldsetCaption = ({
17
- children
18
- }) => /*#__PURE__*/_react.default.createElement(_ChoiceFieldset.Slot, {
19
- name: "Caption"
20
- }, ({
21
- captionId
22
- }) => /*#__PURE__*/_react.default.createElement(_InputCaption.default, {
23
- id: captionId
24
- }, children));
25
-
26
- ChoiceFieldsetCaption.displayName = "ChoiceFieldsetCaption";
27
- var _default = ChoiceFieldsetCaption;
28
- exports.default = _default;
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- export interface ChoiceFieldsetLegendProps {
3
- visuallyHidden?: boolean;
4
- }
5
- declare const ChoiceFieldsetLegend: React.FC<ChoiceFieldsetLegendProps>;
6
- export default ChoiceFieldsetLegend;
@@ -1,41 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _ = require("..");
11
-
12
- var _VisuallyHidden = _interopRequireDefault(require("../_VisuallyHidden"));
13
-
14
- var _ChoiceFieldset = require("./ChoiceFieldset");
15
-
16
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
-
18
- const ChoiceFieldsetLegend = ({
19
- children,
20
- visuallyHidden
21
- }) => /*#__PURE__*/_react.default.createElement(_ChoiceFieldset.Slot, {
22
- name: "Legend"
23
- }, ({
24
- required
25
- }) => /*#__PURE__*/_react.default.createElement(_VisuallyHidden.default, {
26
- isVisible: !visuallyHidden,
27
- title: required ? 'required field' : undefined,
28
- sx: {
29
- fontSize: 2,
30
- padding: 0
31
- }
32
- }, required ? /*#__PURE__*/_react.default.createElement(_.Box, {
33
- display: "flex",
34
- as: "span"
35
- }, /*#__PURE__*/_react.default.createElement(_.Box, {
36
- mr: 1
37
- }, children), /*#__PURE__*/_react.default.createElement("span", null, "*")) : children));
38
-
39
- ChoiceFieldsetLegend.displayName = "ChoiceFieldsetLegend";
40
- var _default = ChoiceFieldsetLegend;
41
- exports.default = _default;
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- export interface ChoiceFieldsetListProps {
3
- selectionVariant?: 'single' | 'multiple';
4
- }
5
- declare const ChoiceFieldsetList: React.FC<ChoiceFieldsetListProps>;
6
- export default ChoiceFieldsetList;
@@ -1,85 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _styledComponents = _interopRequireDefault(require("styled-components"));
11
-
12
- var _ = require("..");
13
-
14
- var _constants = require("../constants");
15
-
16
- var _uniqueId = require("../utils/uniqueId");
17
-
18
- var _ChoiceFieldset = require("./ChoiceFieldset");
19
-
20
- var _ChoiceFieldsetListContext = _interopRequireDefault(require("./ChoiceFieldsetListContext"));
21
-
22
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
-
24
- const List = _styledComponents.default.ul.withConfig({
25
- displayName: "ChoiceFieldsetList__List",
26
- componentId: "sc-16da7ba-0"
27
- })(["display:flex;flex-direction:column;list-style:none;margin:0;padding:0;> li + li{margin-top:", ";}"], (0, _constants.get)('space.2'));
28
-
29
- const ChoiceFieldsetList = ({
30
- selectionVariant,
31
- children
32
- }) => {
33
- var _React$Children$map;
34
-
35
- const initialSelectedChoices = ((_React$Children$map = _react.default.Children.map(children, child => {
36
- if ( /*#__PURE__*/_react.default.isValidElement(child) && child.props.checked) {
37
- return child.props.value;
38
- }
39
-
40
- return '';
41
- })) === null || _React$Children$map === void 0 ? void 0 : _React$Children$map.filter(Boolean)) || [];
42
-
43
- const getSelectedCheckboxes = (value, checked) => {
44
- if (checked) {
45
- return selectionVariant === 'multiple' ? [...initialSelectedChoices, value] : [value];
46
- }
47
-
48
- return initialSelectedChoices.filter(selectedValue => selectedValue !== value);
49
- }; // generates a name to pass to radio inputs if one was not passed in ChoiceFieldset props
50
-
51
-
52
- const getRadioGroupName = nameFromContext => {
53
- if (nameFromContext || selectionVariant !== 'multiple') {
54
- return nameFromContext;
55
- }
56
-
57
- const generatedName = (0, _uniqueId.uniqueId)();
58
- return generatedName;
59
- };
60
-
61
- return /*#__PURE__*/_react.default.createElement(_ChoiceFieldset.Slot, {
62
- name: "ChoiceList"
63
- }, ({
64
- name,
65
- onSelect
66
- }) => /*#__PURE__*/_react.default.createElement(_ChoiceFieldsetListContext.default.Provider, {
67
- value: {
68
- initialSelectedChoices,
69
- name: getRadioGroupName(name),
70
- fieldComponent: selectionVariant === 'multiple' ? _.CheckboxInputField : _.RadioInputField,
71
- onChange: e => {
72
- onSelect && onSelect(getSelectedCheckboxes(e.currentTarget.value, e.currentTarget.checked));
73
- }
74
- }
75
- }, /*#__PURE__*/_react.default.createElement(List, null, _react.default.Children.map(children, (child, i) => /*#__PURE__*/_react.default.createElement("li", {
76
- key: i
77
- }, child)))));
78
- };
79
-
80
- ChoiceFieldsetList.displayName = "ChoiceFieldsetList";
81
- ChoiceFieldsetList.defaultProps = {
82
- selectionVariant: 'single'
83
- };
84
- var _default = ChoiceFieldsetList;
85
- exports.default = _default;
@@ -1,17 +0,0 @@
1
- import { ChangeEventHandler } from 'react';
2
- import { CheckboxInputField, RadioInputField } from '..';
3
- import { ComponentProps } from '../utils/types';
4
- import InputField from '../_InputField';
5
- import ToggleInputField, { ToggleInputFieldProps } from '../_InputField/ToggleInputField';
6
- declare const ChoiceFieldsetListContext: import("react").Context<{
7
- initialSelectedChoices?: string[] | undefined;
8
- name?: string | undefined;
9
- onChange: ChangeEventHandler<HTMLInputElement>;
10
- fieldComponent: React.FC<ToggleInputFieldProps> & {
11
- Input: React.FC<ComponentProps<typeof RadioInputField.Input>> | React.FC<ComponentProps<typeof CheckboxInputField.Input>>;
12
- Caption: React.FC<ComponentProps<typeof InputField.Caption>>;
13
- Label: React.FC<ComponentProps<typeof InputField.Label>>;
14
- LeadingVisual: React.FC<ComponentProps<typeof ToggleInputField.LeadingVisual>>;
15
- };
16
- } | null>;
17
- export default ChoiceFieldsetListContext;
@@ -1,15 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = require("react");
9
-
10
- var _ = require("..");
11
-
12
- const ChoiceFieldsetListContext = /*#__PURE__*/(0, _react.createContext)(null);
13
- _.CheckboxInputField.Input;
14
- var _default = ChoiceFieldsetListContext;
15
- exports.default = _default;