@pingux/astro 2.9.1 → 2.13.0-alpha.10

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 (434) hide show
  1. package/README.md +6 -2
  2. package/lib/README.md +6 -2
  3. package/lib/cjs/components/AccordionGridGroup/AccordionGridGroup.mdx +40 -0
  4. package/lib/cjs/components/AccordionGridGroup/AccordionGridGroup.test.js +2 -2
  5. package/lib/cjs/components/AccordionGroup/Accordion.styles.js +1 -2
  6. package/lib/cjs/components/AccordionGroup/AccordionGroup.js +4 -5
  7. package/lib/cjs/components/AccordionGroup/AccordionGroup.mdx +41 -0
  8. package/lib/cjs/components/ArrayField/ArrayField.mdx +34 -0
  9. package/lib/cjs/components/AstroWrapper/AstroWrapper.mdx +16 -0
  10. package/lib/cjs/components/Avatar/Avatar.mdx +14 -0
  11. package/lib/cjs/components/Badge/Badge.mdx +24 -0
  12. package/lib/cjs/components/Box/Box.d.ts +4 -0
  13. package/lib/cjs/components/Box/Box.js +4 -19
  14. package/lib/cjs/components/Box/Box.mdx +23 -0
  15. package/lib/cjs/components/Box/Box.styles.d.ts +6 -0
  16. package/lib/cjs/components/Box/Box.test.d.ts +1 -0
  17. package/lib/cjs/components/Box/Box.test.js +2 -6
  18. package/lib/cjs/components/Box/index.d.ts +1 -0
  19. package/lib/cjs/components/Bracket/Bracket.mdx +17 -0
  20. package/lib/cjs/components/Breadcrumbs/Breadcrumbs.mdx +40 -0
  21. package/lib/cjs/components/Button/Button.mdx +40 -0
  22. package/lib/cjs/components/Button/Button.stories.js +30 -5
  23. package/lib/cjs/components/Button/Buttons.styles.js +25 -7
  24. package/lib/cjs/components/Calendar/Calendar.mdx +39 -0
  25. package/lib/cjs/components/Calendar/Calendar.test.js +2 -2
  26. package/lib/cjs/components/Calendar/CalendarCell.js +2 -3
  27. package/lib/cjs/components/Calendar/CalendarGrid.js +1 -3
  28. package/lib/cjs/components/Callout/Callout.mdx +28 -0
  29. package/lib/cjs/components/Card/Card.mdx +32 -0
  30. package/lib/cjs/components/Checkbox/Checkbox.js +1 -2
  31. package/lib/cjs/components/Checkbox/CheckboxBase.js +1 -2
  32. package/lib/cjs/components/CheckboxField/CheckboxField.mdx +42 -0
  33. package/lib/cjs/components/CodeView/CodeView.mdx +23 -0
  34. package/lib/cjs/components/CodeView/CodeView.test.js +1 -1
  35. package/lib/cjs/components/CollapsiblePanel/CollapsiblePanel.mdx +29 -0
  36. package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelBadge.js +0 -1
  37. package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelContainer.js +2 -3
  38. package/lib/cjs/components/ColorField/ColorField.mdx +38 -0
  39. package/lib/cjs/components/ComboBoxField/ComboBoxField.mdx +66 -0
  40. package/lib/cjs/components/ComboBoxField/ComboBoxField.stories.js +1 -1
  41. package/lib/cjs/components/ComboBoxField/ComboBoxField.test.js +2 -2
  42. package/lib/cjs/components/CopyText/CopyText.mdx +23 -0
  43. package/lib/cjs/components/CopyText/CopyText.test.js +1 -1
  44. package/lib/cjs/components/DataTable/DataTable.mdx +54 -0
  45. package/lib/cjs/components/DataTable/DataTable.stories.js +1 -1
  46. package/lib/cjs/components/DataTable/DataTable.test.js +2 -2
  47. package/lib/cjs/components/DataTable/DataTableVirtualizer.js +2 -3
  48. package/lib/cjs/components/DatePicker/DateField.js +4 -5
  49. package/lib/cjs/components/DatePicker/DatePicker.js +4 -6
  50. package/lib/cjs/components/DatePicker/DatePicker.mdx +49 -0
  51. package/lib/cjs/components/DatePicker/DatePicker.test.js +2 -2
  52. package/lib/cjs/components/DatePicker/DateSegment.js +1 -2
  53. package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.js +3 -3
  54. package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.mdx +36 -0
  55. package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.stories.js +29 -45
  56. package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.test.js +1 -1
  57. package/lib/cjs/components/FieldHelperText/FieldHelperText.js +4 -4
  58. package/lib/cjs/components/FileInputField/FileInputField.mdx +33 -0
  59. package/lib/cjs/components/HelpHint/HelpHint.js +145 -27
  60. package/lib/cjs/components/HelpHint/HelpHint.mdx +32 -0
  61. package/lib/cjs/components/HelpHint/HelpHint.stories.js +40 -7
  62. package/lib/cjs/components/HelpHint/HelpHint.styles.js +9 -1
  63. package/lib/cjs/components/HelpHint/HelpHint.test.js +213 -30
  64. package/lib/cjs/components/Icon/Icon.d.ts +4 -0
  65. package/lib/cjs/components/Icon/Icon.js +4 -27
  66. package/lib/cjs/components/Icon/Icon.mdx +49 -0
  67. package/lib/cjs/components/Icon/Icon.stories.d.ts +8 -0
  68. package/lib/cjs/components/Icon/Icon.test.d.ts +1 -0
  69. package/lib/cjs/components/Icon/index.d.ts +1 -0
  70. package/lib/cjs/components/IconBadge/IconBadge.mdx +14 -0
  71. package/lib/cjs/components/IconButton/IconButton.mdx +33 -0
  72. package/lib/cjs/components/IconButtonToggle/IconButtonToggle.mdx +31 -0
  73. package/lib/cjs/components/Image/Image.mdx +28 -0
  74. package/lib/cjs/components/ImageUploadField/ImageUploadField.mdx +38 -0
  75. package/lib/cjs/components/ImageUploadField/ImageUploadField.stories.js +1 -1
  76. package/lib/cjs/components/ImageUploadField/ImageUploadField.test.js +2 -2
  77. package/lib/cjs/components/Input/Input.js +2 -3
  78. package/lib/cjs/components/Label/Label.styles.js +1 -1
  79. package/lib/cjs/components/Link/Link.mdx +27 -0
  80. package/lib/cjs/components/Link/Link.styles.js +10 -0
  81. package/lib/cjs/components/LinkSelectField/LinkSelectField.mdx +47 -0
  82. package/lib/cjs/components/LinkSelectField/LinkSelectField.stories.js +1 -1
  83. package/lib/cjs/components/LinkSelectField/LinkSelectField.test.js +2 -2
  84. package/lib/cjs/components/ListBox/ListBox.test.js +2 -2
  85. package/lib/cjs/components/ListItem/ListItem.mdx +21 -0
  86. package/lib/cjs/components/ListView/ListView.mdx +44 -0
  87. package/lib/cjs/components/ListView/ListView.stories.js +95 -49
  88. package/lib/cjs/components/ListView/ListView.test.js +2 -2
  89. package/lib/cjs/components/Loader/Loader.d.ts +4 -0
  90. package/lib/cjs/components/Loader/Loader.js +0 -14
  91. package/lib/cjs/components/Loader/Loader.mdx +29 -0
  92. package/lib/cjs/components/Loader/Loader.styles.d.ts +53 -0
  93. package/lib/cjs/components/Loader/Loader.test.d.ts +1 -0
  94. package/lib/cjs/components/Loader/index.d.ts +1 -0
  95. package/lib/cjs/components/Menu/Menu.mdx +43 -0
  96. package/lib/cjs/components/MenuItem/MenuItem.js +2 -3
  97. package/lib/cjs/components/Messages/Messages.mdx +35 -0
  98. package/lib/cjs/components/Modal/Modal.mdx +59 -0
  99. package/lib/cjs/components/Modal/tests/Modal.integration.test.js +1 -2
  100. package/lib/cjs/components/MultivaluesField/MultivaluesField.js +43 -9
  101. package/lib/cjs/components/MultivaluesField/MultivaluesField.mdx +44 -0
  102. package/lib/cjs/components/MultivaluesField/MultivaluesField.test.js +3 -3
  103. package/lib/cjs/components/NavBar/NavBar.mdx +42 -0
  104. package/lib/cjs/components/NavBarSection/NavBarSection.js +2 -3
  105. package/lib/cjs/components/NumberField/NumberField.mdx +39 -0
  106. package/lib/cjs/components/OverlayPanel/OverlayPanel.mdx +39 -0
  107. package/lib/cjs/components/PasswordField/PasswordField.mdx +33 -0
  108. package/lib/cjs/components/PasswordField/PasswordField.test.js +2 -3
  109. package/lib/cjs/components/PopoverContainer/PopoverContainer.d.ts +9 -0
  110. package/lib/cjs/components/PopoverContainer/PopoverContainer.js +10 -42
  111. package/lib/cjs/components/PopoverContainer/index.d.ts +2 -0
  112. package/lib/cjs/components/PopoverMenu/PopoverMenu.mdx +53 -0
  113. package/lib/cjs/components/Radio/Radio.js +1 -2
  114. package/lib/cjs/components/RadioGroupField/RadioGroupField.mdx +41 -0
  115. package/lib/cjs/components/RadioGroupField/RadioGroupField.test.js +2 -2
  116. package/lib/cjs/components/RequirementsList/RequirementsList.mdx +17 -0
  117. package/lib/cjs/components/RockerButtonGroup/RockerButtonGroup.mdx +36 -0
  118. package/lib/cjs/components/ScrollBox/ScrollBox.mdx +17 -0
  119. package/lib/cjs/components/SearchField/SearchField.mdx +33 -0
  120. package/lib/cjs/components/SelectField/Select.styles.js +1 -1
  121. package/lib/cjs/components/SelectField/SelectField.mdx +46 -0
  122. package/lib/cjs/components/SelectField/SelectField.stories.js +1 -1
  123. package/lib/cjs/components/SelectFieldBase/SelectFieldBase.js +4 -4
  124. package/lib/cjs/components/SelectFieldBase/SelectFieldBase.test.js +2 -2
  125. package/lib/cjs/components/Separator/Separator.mdx +19 -0
  126. package/lib/cjs/components/Stepper/Stepper.mdx +41 -0
  127. package/lib/cjs/components/Stepper/Stepper.styles.js +1 -1
  128. package/lib/cjs/components/Stepper/Stepper.test.js +2 -3
  129. package/lib/cjs/components/Switch/Switch.js +1 -2
  130. package/lib/cjs/components/SwitchField/SwitchField.js +1 -0
  131. package/lib/cjs/components/SwitchField/SwitchField.mdx +36 -0
  132. package/lib/cjs/components/Tab/Tab.js +2 -3
  133. package/lib/cjs/components/TabPicker/TabPicker.js +1 -1
  134. package/lib/cjs/components/Table/Table.mdx +30 -0
  135. package/lib/cjs/components/TableBody/TableBody.js +0 -1
  136. package/lib/cjs/components/TableCaption/TableCaption.js +0 -1
  137. package/lib/cjs/components/TableCell/TableCell.d.ts +12 -0
  138. package/lib/cjs/components/TableCell/TableCell.js +0 -6
  139. package/lib/cjs/components/TableCell/TableCell.test.d.ts +1 -0
  140. package/lib/cjs/components/TableCell/index.d.ts +1 -0
  141. package/lib/cjs/components/TableHead/TableHead.js +0 -1
  142. package/lib/cjs/components/TableRow/TableRow.js +0 -1
  143. package/lib/cjs/components/Tabs/Tabs.mdx +40 -0
  144. package/lib/cjs/components/Tabs/Tabs.test.js +3 -4
  145. package/lib/cjs/components/Text/Text.d.ts +4 -0
  146. package/lib/cjs/components/Text/Text.js +3 -7
  147. package/lib/cjs/components/Text/Text.mdx +13 -0
  148. package/lib/cjs/components/Text/Text.stories.d.ts +6 -0
  149. package/lib/cjs/components/Text/Text.styles.d.ts +286 -0
  150. package/lib/cjs/components/Text/Text.test.d.ts +1 -0
  151. package/lib/cjs/components/Text/index.d.ts +1 -0
  152. package/lib/cjs/components/TextArea/TextArea.js +1 -3
  153. package/lib/cjs/components/TextAreaField/TextAreaField.mdx +34 -0
  154. package/lib/cjs/components/TextField/TextField.js +1 -1
  155. package/lib/cjs/components/TextField/TextField.mdx +34 -0
  156. package/lib/cjs/components/TimeZonePicker/TimeZonePicker.mdx +18 -0
  157. package/lib/cjs/components/TooltipTrigger/Tooltip.styles.js +2 -1
  158. package/lib/cjs/components/TooltipTrigger/TooltipTrigger.js +2 -0
  159. package/lib/cjs/components/TooltipTrigger/TooltipTrigger.mdx +23 -0
  160. package/lib/cjs/components/TooltipTrigger/TooltipTrigger.test.js +47 -1
  161. package/lib/cjs/docs/Props.stories.mdx +35 -0
  162. package/lib/cjs/docs/Welcome.stories.mdx +149 -0
  163. package/lib/cjs/docs/hooks/useDebounce.stories.mdx +59 -0
  164. package/lib/cjs/docs/hooks/useModalState.stories.mdx +83 -0
  165. package/lib/cjs/docs/hooks/useOverlayPanelState.stories.mdx +84 -0
  166. package/lib/cjs/docs/theme/AstroNanoTheme.stories.mdx +174 -0
  167. package/lib/cjs/docs/theme/AstroTheme.stories.mdx +20 -0
  168. package/lib/cjs/docs/theme/CustomThemes.stories.mdx +70 -0
  169. package/lib/cjs/docs/theme/StylingGuideline.stories.mdx +116 -0
  170. package/lib/cjs/docs/utils/messagesReducer.stories.mdx +64 -0
  171. package/lib/cjs/experimental/EditButton/EditButton.js +63 -0
  172. package/lib/cjs/experimental/EditButton/EditButton.mdx +9 -0
  173. package/lib/cjs/experimental/EditButton/EditButton.stories.js +91 -0
  174. package/lib/cjs/experimental/EditButton/EditButton.test.js +71 -0
  175. package/lib/cjs/experimental/EditButton/index.js +14 -0
  176. package/lib/cjs/experimental/ListView/ListView.mdx +47 -0
  177. package/lib/cjs/experimental/ListView/ListView.stories.js +742 -0
  178. package/lib/cjs/experimental/ListViewItem/ListViewItem.js +23 -5
  179. package/lib/cjs/experimental/ListViewItem/ListViewItem.mdx +36 -0
  180. package/lib/cjs/experimental/ListViewItem/ListViewItem.stories.js +31 -7
  181. package/lib/cjs/experimental/ListViewItem/ListViewItem.test.js +51 -7
  182. package/lib/cjs/experimental/ListViewItem/controls/ListViewItemEditButton.js +2 -7
  183. package/lib/cjs/experimental/ListViewItem/controls/ListViewItemEditButton.stories.js +4 -1
  184. package/lib/cjs/experimental/ListViewItem/controls/ListViewItemMenu.js +0 -1
  185. package/lib/cjs/experimental/ListViewItem/controls/ListViewItemMenu.test.js +2 -2
  186. package/lib/cjs/experimental/ListViewItem/controls/ListViewItemSwitchField.js +2 -3
  187. package/lib/cjs/experimental/ListViewItem/listViewItemAttributes.js +28 -13
  188. package/lib/cjs/experimental/PanelHeader/PanelHeader.js +88 -0
  189. package/lib/cjs/experimental/PanelHeader/PanelHeader.mdx +19 -0
  190. package/lib/cjs/experimental/PanelHeader/PanelHeader.stories.js +71 -0
  191. package/lib/cjs/experimental/PanelHeader/PanelHeader.styles.js +38 -0
  192. package/lib/cjs/experimental/PanelHeader/PanelHeader.test.js +46 -0
  193. package/lib/cjs/experimental/PanelHeader/controls/PanelHeaderCloseButton.js +32 -0
  194. package/lib/cjs/experimental/PanelHeader/controls/PanelHeaderCloseButton.stories.js +31 -0
  195. package/lib/cjs/experimental/PanelHeader/controls/PanelHeaderCloseButton.test.js +25 -0
  196. package/lib/cjs/experimental/PanelHeader/controls/PanelHeaderMenu.js +25 -0
  197. package/lib/cjs/experimental/PanelHeader/controls/PanelHeaderMenu.stories.js +36 -0
  198. package/lib/cjs/experimental/PanelHeader/controls/PanelHeaderMenu.test.js +58 -0
  199. package/lib/cjs/experimental/PanelHeader/controls/PanelHeaderSwitchField.js +25 -0
  200. package/lib/cjs/experimental/PanelHeader/controls/PanelHeaderSwitchField.stories.js +41 -0
  201. package/lib/cjs/experimental/PanelHeader/controls/PanelHeaderSwitchField.test.js +25 -0
  202. package/lib/cjs/experimental/PanelHeader/index.js +14 -0
  203. package/lib/cjs/experimental/README.stories.mdx +7 -0
  204. package/lib/cjs/experimental/SaveBar/SaveBar.mdx +13 -0
  205. package/lib/cjs/experimental/recipes/ListAndPanel.stories.js +1 -1
  206. package/lib/cjs/hooks/useComponentToggle/useComponentToggle.test.js +2 -2
  207. package/lib/cjs/hooks/useCopyToClipboard/useCopyToClipboard.js +2 -2
  208. package/lib/cjs/hooks/useCopyToClipboard/useCopyToClipboard.test.js +1 -1
  209. package/lib/cjs/hooks/useOverlappingMenuHoverState/useOverlappingMenuHoverState.test.js +2 -2
  210. package/lib/cjs/hooks/usePropWarning/usePropWarning.js +1 -1
  211. package/lib/cjs/hooks/useStatusClasses/useStatusClasses.js +2 -2
  212. package/lib/cjs/hooks/useTShirtSize/useTShirtSize.js +1 -1
  213. package/lib/cjs/index.d.ts +173 -0
  214. package/lib/cjs/index.js +53 -1
  215. package/lib/cjs/recipes/ApplicationSearchDropdown.stories.hidden.js +1 -1
  216. package/lib/cjs/recipes/{AttributesAndPingOneMapping.stories.js → AttributeMapping.stories.js} +392 -132
  217. package/lib/cjs/recipes/Slider.stories.js +1 -1
  218. package/lib/cjs/styles/colors.js +1 -1
  219. package/lib/cjs/styles/forms/index.js +1 -1
  220. package/lib/cjs/styles/variants/README.md +98 -0
  221. package/lib/cjs/styles/variants/variants.js +2 -0
  222. package/lib/cjs/types/box.d.ts +10 -0
  223. package/lib/cjs/types/box.js +6 -0
  224. package/lib/cjs/types/icon.d.ts +34 -0
  225. package/lib/cjs/types/icon.js +6 -0
  226. package/lib/cjs/types/index.d.ts +7 -0
  227. package/lib/cjs/types/index.js +86 -0
  228. package/lib/cjs/types/loader.d.ts +14 -0
  229. package/lib/cjs/types/loader.js +6 -0
  230. package/lib/cjs/types/mdx.d.js +1 -0
  231. package/lib/cjs/types/popoverContainer.d.ts +23 -0
  232. package/lib/cjs/types/popoverContainer.js +6 -0
  233. package/lib/cjs/types/shared/dom.d.ts +9 -0
  234. package/lib/cjs/types/shared/dom.js +6 -0
  235. package/lib/cjs/types/shared/index.d.ts +3 -0
  236. package/lib/cjs/types/shared/index.js +42 -0
  237. package/lib/cjs/types/shared/style.d.ts +11 -0
  238. package/lib/cjs/types/shared/style.js +6 -0
  239. package/lib/cjs/types/shared/test.d.ts +3 -0
  240. package/lib/cjs/types/shared/test.js +6 -0
  241. package/lib/cjs/types/shared/utils.d.ts +1 -0
  242. package/lib/cjs/types/shared/utils.js +6 -0
  243. package/lib/cjs/types/tableCell.d.ts +5 -0
  244. package/lib/cjs/types/tableCell.js +6 -0
  245. package/lib/cjs/types/text.d.ts +3 -0
  246. package/lib/cjs/types/text.js +6 -0
  247. package/lib/cjs/utils/designUtils/figmaLinks.js +2 -1
  248. package/lib/cjs/utils/devUtils/constants/variants.js +1 -2
  249. package/lib/cjs/utils/testUtils/testAxe.js +2 -2
  250. package/lib/cjs/utils/testUtils/testWrapper.js +2 -0
  251. package/lib/components/AccordionGridGroup/AccordionGridGroup.mdx +40 -0
  252. package/lib/components/AccordionGridGroup/AccordionGridGroup.test.js +2 -2
  253. package/lib/components/AccordionGroup/Accordion.styles.js +1 -2
  254. package/lib/components/AccordionGroup/AccordionGroup.mdx +41 -0
  255. package/lib/components/ArrayField/ArrayField.mdx +34 -0
  256. package/lib/components/AstroWrapper/AstroWrapper.mdx +16 -0
  257. package/lib/components/Avatar/Avatar.mdx +14 -0
  258. package/lib/components/Badge/Badge.mdx +24 -0
  259. package/lib/components/Box/Box.js +4 -19
  260. package/lib/components/Box/Box.mdx +23 -0
  261. package/lib/components/Box/Box.test.js +2 -6
  262. package/lib/components/Bracket/Bracket.mdx +17 -0
  263. package/lib/components/Breadcrumbs/Breadcrumbs.mdx +40 -0
  264. package/lib/components/Button/Button.mdx +40 -0
  265. package/lib/components/Button/Button.stories.js +30 -5
  266. package/lib/components/Button/Buttons.styles.js +25 -7
  267. package/lib/components/Calendar/Calendar.mdx +39 -0
  268. package/lib/components/Calendar/Calendar.test.js +2 -2
  269. package/lib/components/Callout/Callout.mdx +28 -0
  270. package/lib/components/Card/Card.mdx +32 -0
  271. package/lib/components/CheckboxField/CheckboxField.mdx +42 -0
  272. package/lib/components/CodeView/CodeView.mdx +23 -0
  273. package/lib/components/CodeView/CodeView.test.js +1 -1
  274. package/lib/components/CollapsiblePanel/CollapsiblePanel.mdx +29 -0
  275. package/lib/components/ColorField/ColorField.mdx +38 -0
  276. package/lib/components/ComboBoxField/ComboBoxField.mdx +66 -0
  277. package/lib/components/ComboBoxField/ComboBoxField.stories.js +1 -1
  278. package/lib/components/ComboBoxField/ComboBoxField.test.js +2 -2
  279. package/lib/components/CopyText/CopyText.mdx +23 -0
  280. package/lib/components/CopyText/CopyText.test.js +1 -1
  281. package/lib/components/DataTable/DataTable.mdx +54 -0
  282. package/lib/components/DataTable/DataTable.stories.js +1 -1
  283. package/lib/components/DataTable/DataTable.test.js +1 -1
  284. package/lib/components/DatePicker/DatePicker.mdx +49 -0
  285. package/lib/components/DatePicker/DatePicker.test.js +2 -2
  286. package/lib/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.js +3 -3
  287. package/lib/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.mdx +36 -0
  288. package/lib/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.stories.js +29 -45
  289. package/lib/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.test.js +1 -1
  290. package/lib/components/FileInputField/FileInputField.mdx +33 -0
  291. package/lib/components/HelpHint/HelpHint.js +148 -30
  292. package/lib/components/HelpHint/HelpHint.mdx +32 -0
  293. package/lib/components/HelpHint/HelpHint.stories.js +37 -6
  294. package/lib/components/HelpHint/HelpHint.styles.js +9 -1
  295. package/lib/components/HelpHint/HelpHint.test.js +213 -30
  296. package/lib/components/Icon/Icon.js +2 -25
  297. package/lib/components/Icon/Icon.mdx +49 -0
  298. package/lib/components/IconBadge/IconBadge.mdx +14 -0
  299. package/lib/components/IconButton/IconButton.mdx +33 -0
  300. package/lib/components/IconButtonToggle/IconButtonToggle.mdx +31 -0
  301. package/lib/components/Image/Image.mdx +28 -0
  302. package/lib/components/ImageUploadField/ImageUploadField.mdx +38 -0
  303. package/lib/components/ImageUploadField/ImageUploadField.stories.js +1 -1
  304. package/lib/components/ImageUploadField/ImageUploadField.test.js +2 -2
  305. package/lib/components/Link/Link.mdx +27 -0
  306. package/lib/components/Link/Link.styles.js +10 -0
  307. package/lib/components/LinkSelectField/LinkSelectField.mdx +47 -0
  308. package/lib/components/LinkSelectField/LinkSelectField.stories.js +1 -1
  309. package/lib/components/LinkSelectField/LinkSelectField.test.js +2 -2
  310. package/lib/components/ListBox/ListBox.test.js +2 -2
  311. package/lib/components/ListItem/ListItem.mdx +21 -0
  312. package/lib/components/ListView/ListView.mdx +44 -0
  313. package/lib/components/ListView/ListView.stories.js +96 -50
  314. package/lib/components/ListView/ListView.test.js +2 -2
  315. package/lib/components/Loader/Loader.js +0 -14
  316. package/lib/components/Loader/Loader.mdx +29 -0
  317. package/lib/components/Menu/Menu.mdx +43 -0
  318. package/lib/components/Messages/Messages.mdx +35 -0
  319. package/lib/components/Modal/Modal.mdx +59 -0
  320. package/lib/components/MultivaluesField/MultivaluesField.js +43 -9
  321. package/lib/components/MultivaluesField/MultivaluesField.mdx +44 -0
  322. package/lib/components/MultivaluesField/MultivaluesField.test.js +3 -3
  323. package/lib/components/NavBar/NavBar.mdx +42 -0
  324. package/lib/components/NumberField/NumberField.mdx +39 -0
  325. package/lib/components/OverlayPanel/OverlayPanel.mdx +39 -0
  326. package/lib/components/PasswordField/PasswordField.mdx +33 -0
  327. package/lib/components/PasswordField/PasswordField.test.js +2 -2
  328. package/lib/components/PopoverContainer/PopoverContainer.js +7 -38
  329. package/lib/components/PopoverMenu/PopoverMenu.mdx +53 -0
  330. package/lib/components/RadioGroupField/RadioGroupField.mdx +41 -0
  331. package/lib/components/RadioGroupField/RadioGroupField.test.js +2 -2
  332. package/lib/components/RequirementsList/RequirementsList.mdx +17 -0
  333. package/lib/components/RockerButtonGroup/RockerButtonGroup.mdx +36 -0
  334. package/lib/components/ScrollBox/ScrollBox.mdx +17 -0
  335. package/lib/components/SearchField/SearchField.mdx +33 -0
  336. package/lib/components/SelectField/SelectField.mdx +46 -0
  337. package/lib/components/SelectField/SelectField.stories.js +1 -1
  338. package/lib/components/SelectFieldBase/SelectFieldBase.test.js +2 -2
  339. package/lib/components/Separator/Separator.mdx +19 -0
  340. package/lib/components/Stepper/Stepper.mdx +41 -0
  341. package/lib/components/Stepper/Stepper.test.js +2 -2
  342. package/lib/components/SwitchField/SwitchField.mdx +36 -0
  343. package/lib/components/Table/Table.mdx +30 -0
  344. package/lib/components/TableCell/TableCell.js +0 -5
  345. package/lib/components/Tabs/Tabs.mdx +40 -0
  346. package/lib/components/Tabs/Tabs.test.js +2 -2
  347. package/lib/components/Text/Text.js +3 -7
  348. package/lib/components/Text/Text.mdx +13 -0
  349. package/lib/components/TextAreaField/TextAreaField.mdx +34 -0
  350. package/lib/components/TextField/TextField.js +1 -1
  351. package/lib/components/TextField/TextField.mdx +34 -0
  352. package/lib/components/TimeZonePicker/TimeZonePicker.mdx +18 -0
  353. package/lib/components/TooltipTrigger/Tooltip.styles.js +1 -1
  354. package/lib/components/TooltipTrigger/TooltipTrigger.js +2 -0
  355. package/lib/components/TooltipTrigger/TooltipTrigger.mdx +23 -0
  356. package/lib/components/TooltipTrigger/TooltipTrigger.test.js +48 -2
  357. package/lib/docs/Props.stories.mdx +35 -0
  358. package/lib/docs/Welcome.stories.mdx +149 -0
  359. package/lib/docs/hooks/useDebounce.stories.mdx +59 -0
  360. package/lib/docs/hooks/useModalState.stories.mdx +83 -0
  361. package/lib/docs/hooks/useOverlayPanelState.stories.mdx +84 -0
  362. package/lib/docs/theme/AstroNanoTheme.stories.mdx +174 -0
  363. package/lib/docs/theme/AstroTheme.stories.mdx +20 -0
  364. package/lib/docs/theme/CustomThemes.stories.mdx +70 -0
  365. package/lib/docs/theme/StylingGuideline.stories.mdx +116 -0
  366. package/lib/docs/utils/messagesReducer.stories.mdx +64 -0
  367. package/lib/experimental/EditButton/EditButton.js +50 -0
  368. package/lib/experimental/EditButton/EditButton.mdx +9 -0
  369. package/lib/experimental/EditButton/EditButton.stories.js +75 -0
  370. package/lib/experimental/EditButton/EditButton.test.js +68 -0
  371. package/lib/experimental/EditButton/index.js +1 -0
  372. package/lib/experimental/ListView/ListView.mdx +47 -0
  373. package/lib/experimental/ListView/ListView.stories.js +729 -0
  374. package/lib/experimental/ListViewItem/ListViewItem.js +24 -6
  375. package/lib/experimental/ListViewItem/ListViewItem.mdx +36 -0
  376. package/lib/experimental/ListViewItem/ListViewItem.stories.js +28 -5
  377. package/lib/experimental/ListViewItem/ListViewItem.test.js +45 -1
  378. package/lib/experimental/ListViewItem/controls/ListViewItemEditButton.js +1 -4
  379. package/lib/experimental/ListViewItem/controls/ListViewItemEditButton.stories.js +4 -1
  380. package/lib/experimental/ListViewItem/controls/ListViewItemMenu.test.js +2 -2
  381. package/lib/experimental/ListViewItem/controls/ListViewItemSwitchField.js +1 -0
  382. package/lib/experimental/ListViewItem/listViewItemAttributes.js +25 -12
  383. package/lib/experimental/PanelHeader/PanelHeader.js +75 -0
  384. package/lib/experimental/PanelHeader/PanelHeader.mdx +19 -0
  385. package/lib/experimental/PanelHeader/PanelHeader.stories.js +59 -0
  386. package/lib/experimental/PanelHeader/PanelHeader.styles.js +30 -0
  387. package/lib/experimental/PanelHeader/PanelHeader.test.js +43 -0
  388. package/lib/experimental/PanelHeader/controls/PanelHeaderCloseButton.js +25 -0
  389. package/lib/experimental/PanelHeader/controls/PanelHeaderCloseButton.stories.js +21 -0
  390. package/lib/experimental/PanelHeader/controls/PanelHeaderCloseButton.test.js +22 -0
  391. package/lib/experimental/PanelHeader/controls/PanelHeaderMenu.js +18 -0
  392. package/lib/experimental/PanelHeader/controls/PanelHeaderMenu.stories.js +26 -0
  393. package/lib/experimental/PanelHeader/controls/PanelHeaderMenu.test.js +55 -0
  394. package/lib/experimental/PanelHeader/controls/PanelHeaderSwitchField.js +18 -0
  395. package/lib/experimental/PanelHeader/controls/PanelHeaderSwitchField.stories.js +32 -0
  396. package/lib/experimental/PanelHeader/controls/PanelHeaderSwitchField.test.js +22 -0
  397. package/lib/experimental/PanelHeader/index.js +1 -0
  398. package/lib/experimental/README.stories.mdx +7 -0
  399. package/lib/experimental/SaveBar/SaveBar.mdx +13 -0
  400. package/lib/experimental/recipes/ListAndPanel.stories.js +1 -1
  401. package/lib/hooks/useComponentToggle/useComponentToggle.test.js +2 -2
  402. package/lib/hooks/useCopyToClipboard/useCopyToClipboard.js +2 -2
  403. package/lib/hooks/useCopyToClipboard/useCopyToClipboard.test.js +1 -1
  404. package/lib/hooks/useOverlappingMenuHoverState/useOverlappingMenuHoverState.test.js +2 -2
  405. package/lib/hooks/usePropWarning/usePropWarning.js +1 -1
  406. package/lib/hooks/useStatusClasses/useStatusClasses.js +2 -2
  407. package/lib/hooks/useTShirtSize/useTShirtSize.js +1 -1
  408. package/lib/index.js +6 -0
  409. package/lib/recipes/AttributeMapping.stories.js +540 -0
  410. package/lib/styles/colors.js +1 -1
  411. package/lib/styles/variants/README.md +98 -0
  412. package/lib/styles/variants/variants.js +2 -0
  413. package/lib/types/box.js +1 -0
  414. package/lib/types/icon.js +1 -0
  415. package/lib/types/index.js +7 -0
  416. package/lib/types/loader.js +1 -0
  417. package/lib/types/mdx.d.js +0 -0
  418. package/lib/types/popoverContainer.js +1 -0
  419. package/lib/types/shared/dom.js +1 -0
  420. package/lib/types/shared/index.js +3 -0
  421. package/lib/types/shared/style.js +1 -0
  422. package/lib/types/shared/test.js +1 -0
  423. package/lib/types/shared/utils.js +1 -0
  424. package/lib/types/tableCell.js +1 -0
  425. package/lib/types/text.js +1 -0
  426. package/lib/utils/designUtils/figmaLinks.js +2 -1
  427. package/lib/utils/testUtils/testAxe.js +2 -2
  428. package/package.json +24 -10
  429. package/CHANGELOG.md +0 -2554
  430. package/NOTICE +0 -2481
  431. package/NOTICE.html +0 -9174
  432. package/lib/cjs/recipes/AttributeMappingReadOnlyField.stories.js +0 -254
  433. package/lib/recipes/AttributeMappingReadOnlyField.stories.js +0 -243
  434. package/lib/recipes/AttributesAndPingOneMapping.stories.js +0 -282
@@ -1,8 +1,8 @@
1
1
  "use strict";
2
2
 
3
3
  var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
4
- var _Symbol = require("@babel/runtime-corejs3/core-js-stable/symbol");
5
4
  var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
5
+ var _Symbol = require("@babel/runtime-corejs3/core-js-stable/symbol");
6
6
  var _Object$create = require("@babel/runtime-corejs3/core-js-stable/object/create");
7
7
  var _Object$getPrototypeOf = require("@babel/runtime-corejs3/core-js-stable/object/get-prototype-of");
8
8
  var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
@@ -20,8 +20,7 @@ var _react3 = require("@testing-library/react");
20
20
  var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
21
21
  var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
22
22
  var _ = _interopRequireDefault(require("."));
23
- function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, $Symbol = "function" == typeof _Symbol ? _Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return _Object$defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = _Object$create(protoGenerator.prototype), context = new Context(tryLocsList || []); return generator._invoke = function (innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; }(innerFn, self, context), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = _Object$getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = _Object$create(IteratorPrototype); function defineIteratorMethods(prototype) { var _context4; _forEachInstanceProperty(_context4 = ["next", "throw", "return"]).call(_context4, function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; this._invoke = function (method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); }; } function maybeInvokeDelegate(delegate, context) { var method = delegate.iterator[context.method]; if (undefined === method) { if (context.delegate = null, "throw" === context.method) { if (delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method)) return ContinueSentinel; context.method = "throw", context.arg = new TypeError("The iterator does not provide a 'throw' method"); } return ContinueSentinel; } var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], _forEachInstanceProperty(tryLocsList).call(tryLocsList, pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, define(Gp, "constructor", GeneratorFunctionPrototype), define(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return _Object$setPrototypeOf ? _Object$setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = _Object$create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = _Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (object) { var keys = []; for (var key in object) { keys.push(key); } return _reverseInstanceProperty(keys).call(keys), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { var _context5; if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, _forEachInstanceProperty(_context5 = this.tryEntries).call(_context5, resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+_sliceInstanceProperty(name).call(name, 1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, "catch": function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
24
- // Emotion Cache added as test fails otherwise, root cause of this failure is unknown.
23
+ function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = _Object$defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof _Symbol ? _Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return _Object$defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = _Object$create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = _Object$getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = _Object$create(IteratorPrototype); function defineIteratorMethods(prototype) { var _context4; _forEachInstanceProperty(_context4 = ["next", "throw", "return"]).call(_context4, function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], _forEachInstanceProperty(tryLocsList).call(tryLocsList, pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return _Object$setPrototypeOf ? _Object$setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = _Object$create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = _Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) { keys.push(key); } return _reverseInstanceProperty(keys).call(keys), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { var _context5; if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, _forEachInstanceProperty(_context5 = this.tryEntries).call(_context5, resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+_sliceInstanceProperty(name).call(name, 1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, "catch": function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; } // Emotion Cache added as test fails otherwise, root cause of this failure is unknown.
25
24
  // Failure occured with ThemeUI refactor.
26
25
  // https://github.com/emotion-js/emotion/issues/1105#issuecomment-557726922
27
26
  var emotionCache = (0, _cache["default"])({
@@ -0,0 +1,9 @@
1
+ import React, { JSX } from 'react';
2
+ import { PopoverArrowProps, PopoverContainerProps, PopoverWrapperProps } from '../../types';
3
+ /**
4
+ * PopoverContainer component used for popover on SelectField, ComboBox & PopoverMenu.
5
+ */
6
+ declare const PopoverContainer: React.ForwardRefExoticComponent<PopoverContainerProps & React.RefAttributes<HTMLElement>>;
7
+ export declare const PopoverWrapper: React.ForwardRefExoticComponent<PopoverWrapperProps & React.RefAttributes<HTMLElement>>;
8
+ export declare const PopoverArrow: (props: PopoverArrowProps) => JSX.Element;
9
+ export default PopoverContainer;
@@ -20,21 +20,19 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/e
20
20
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
21
21
  var _react = _interopRequireWildcard(require("react"));
22
22
  var _reactAria = require("react-aria");
23
- var _propTypes = _interopRequireDefault(require("prop-types"));
24
23
  var _hooks = require("../../hooks");
25
24
  var _Box = _interopRequireDefault(require("../Box"));
26
25
  var _react2 = require("@emotion/react");
27
26
  var _excluded = ["children"],
28
- _excluded2 = ["children", "className", "placement", "arrowProps", "arrowCrossOffset", "isOpen", "hasNoArrow", "isNotClosedOnBlur", "isKeyboardDismissDisabled", "isNonModal", "isDismissable", "width", "direction", "sx"],
27
+ _excluded2 = ["children", "className", "placement", "arrowProps", "arrowCrossOffset", "isOpen", "hasNoArrow", "isNotClosedOnBlur", "isNonModal", "width", "direction", "sx"],
29
28
  _excluded3 = ["arrowCrossOffset", "sx", "direction"];
29
+ /**
30
+ * PopoverContainer component used for popover on SelectField, ComboBox & PopoverMenu.
31
+ */
30
32
  function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
31
33
  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; }
32
34
  function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
33
35
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
34
- /**
35
- * PopoverContainer component used for popover on SelectField, ComboBox & PopoverMenu.
36
- */
37
-
38
36
  var PopoverContainer = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
39
37
  var children = props.children,
40
38
  others = (0, _objectWithoutProperties2["default"])(props, _excluded);
@@ -42,19 +40,8 @@ var PopoverContainer = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
42
40
  ref: ref
43
41
  }, others), children));
44
42
  });
45
- PopoverContainer.propTypes = {
46
- placement: _propTypes["default"].string,
47
- arrowProps: _propTypes["default"].shape({}),
48
- onClose: _propTypes["default"].func,
49
- isNotClosedOnBlur: _propTypes["default"].bool,
50
- hasNoArrow: _propTypes["default"].bool,
51
- isKeyboardDismissDisabled: _propTypes["default"].bool,
52
- isNonModal: _propTypes["default"].bool,
53
- isDismissable: _propTypes["default"].bool,
54
- width: _propTypes["default"].string,
55
- arrowCrossOffset: _propTypes["default"].string,
56
- direction: _propTypes["default"].oneOf(['top', 'right', 'bottom', 'left'])
57
- };
43
+
44
+ // eslint-disable-next-line max-len
58
45
  var PopoverWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
59
46
  var children = props.children,
60
47
  className = props.className,
@@ -64,14 +51,12 @@ var PopoverWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
64
51
  isOpen = props.isOpen,
65
52
  hasNoArrow = props.hasNoArrow,
66
53
  isNotClosedOnBlur = props.isNotClosedOnBlur,
67
- isKeyboardDismissDisabled = props.isKeyboardDismissDisabled,
68
54
  isNonModal = props.isNonModal,
69
- isDismissable = props.isDismissable,
70
55
  width = props.width,
71
56
  direction = props.direction,
72
57
  sx = props.sx,
73
58
  others = (0, _objectWithoutProperties2["default"])(props, _excluded2);
74
- var popoverRef = (0, _react.useRef)();
59
+ var popoverRef = (0, _react.useRef)(null);
75
60
  /* istanbul ignore next */
76
61
  (0, _react.useImperativeHandle)(ref, function () {
77
62
  return popoverRef.current;
@@ -88,6 +73,9 @@ var PopoverWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
88
73
  isOpen: isOpen
89
74
  }),
90
75
  classNames = _useStatusClasses.classNames;
76
+ if (!isOpen) {
77
+ return null;
78
+ }
91
79
  return isOpen && (0, _react2.jsx)(_Box["default"], (0, _extends2["default"])({}, (0, _reactAria.mergeProps)(others, overlayProps, modalProps), {
92
80
  variant: "popoverMenu.container",
93
81
  ref: popoverRef,
@@ -104,20 +92,6 @@ var PopoverWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
104
92
  })));
105
93
  });
106
94
  exports.PopoverWrapper = PopoverWrapper;
107
- PopoverWrapper.propTypes = {
108
- placement: _propTypes["default"].string,
109
- arrowProps: _propTypes["default"].shape({}),
110
- isOpen: _propTypes["default"].bool,
111
- hasNoArrow: _propTypes["default"].bool,
112
- isNotClosedOnBlur: _propTypes["default"].bool,
113
- isKeyboardDismissDisabled: _propTypes["default"].bool,
114
- isNonModal: _propTypes["default"].bool,
115
- isDismissable: _propTypes["default"].bool,
116
- width: _propTypes["default"].string,
117
- arrowCrossOffset: _propTypes["default"].string,
118
- sx: _propTypes["default"].shape({}),
119
- direction: _propTypes["default"].oneOf(['top', 'right', 'bottom', 'left'])
120
- };
121
95
  PopoverWrapper.defaultProps = {
122
96
  placement: 'bottom'
123
97
  };
@@ -157,11 +131,5 @@ var PopoverArrow = function PopoverArrow(props) {
157
131
  }));
158
132
  };
159
133
  exports.PopoverArrow = PopoverArrow;
160
- PopoverArrow.propTypes = {
161
- width: _propTypes["default"].string,
162
- arrowCrossOffset: _propTypes["default"].string,
163
- sx: _propTypes["default"].shape({}),
164
- direction: _propTypes["default"].oneOf(['top', 'right', 'bottom', 'left'])
165
- };
166
134
  var _default = PopoverContainer;
167
135
  exports["default"] = _default;
@@ -0,0 +1,2 @@
1
+ export { default } from './PopoverContainer';
2
+ export * from './PopoverContainer';
@@ -0,0 +1,53 @@
1
+ import { Meta } from '@storybook/addon-docs';
2
+
3
+ <Meta title="Components/PopoverMenu/PopoverMenu" />
4
+
5
+ # PopoverMenu
6
+
7
+ The PopoverMenu component serves as a wrapper for the Menu component and the associated trigger.
8
+ It links the Menu's open state to the trigger's press state to provide the necessary overlay context.
9
+ It primarily uses the [useMenuTrigger](https://react-spectrum.adobe.com/react-aria/useMenuTrigger.html) from React Aria
10
+ and [useMenuTriggerState](https://react-spectrum.adobe.com/react-stately/useMenuTriggerState.html) from React Stately.
11
+
12
+ The PopoverMenu should:
13
+ - Be triggered by a [Button](./?path=/docs/components-button--default) or [IconButton](./?path=/docs/components-iconbutton--default).
14
+ - Include actionable labels, such as view, edit, and delete.
15
+
16
+ The PopoverMenu shouldn’t have more than five options.
17
+
18
+ ### Required Components
19
+
20
+ This component requires these components:
21
+
22
+ - OverlayProvider
23
+ - [Button](./?path=/docs/components-button--default)
24
+ - [Menu](./?path=/docs/components-menu--default)
25
+ - Item: This component originates from the [react-stately/collections](https://react-spectrum.adobe.com/react-stately/collections.html) and is exported within Astro.
26
+
27
+ ### Accessibility
28
+
29
+ This component should adhere to the [WAI-ARIA Dialog](https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/examples/dialog/) accessibility guidelines.
30
+
31
+ #### Keyboard Navigation
32
+
33
+ These keys provide additional functionality to the component.
34
+
35
+ | Key | Functions |
36
+ | ---- | ---- |
37
+ | Tab | The trigger and menu items are focusable using the Tab key. |
38
+ | Shift + Tab | Moves focus to the previous focusable component. |
39
+ | Space or Enter | Pressing Space or Enter on a focused trigger opens or closes the menu and selects the MenuItems it is focused on. |
40
+ | Arrow keys | Moves the selection through the popover. |
41
+ | Esc | Pressing the escape key closes the popover and focuses on the previous focusable component. |
42
+
43
+ #### Screen Readers
44
+
45
+ This component uses the following attributes to assist screen readers:
46
+ - The **`aria-haspopup`** attribute is set to “True” to indicate that this component contains popover content.
47
+ - The trigger uses the **`aria-expanded`** attribute to indicate when the content expands and collapses.
48
+ - The menu ID is supplied to the **`aria-controls`** attribute pointing to the content.
49
+ - The **`aria-orientation`** attribute indicates whether the orientation is horizontal, vertical, unknown, or ambiguous.
50
+ - The default **`aria-disabled`** attribute is set to “False” by default.
51
+ - The button ID is supplied to the **`aria-labelledby`** attribute to reference it.
52
+
53
+
@@ -22,8 +22,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
22
22
  *
23
23
  * **Note: Requires a label. It's recommended to use `RadioGroupField` with `RadioField` for a**
24
24
  * **solution.**
25
- */
26
- var Radio = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
25
+ */var Radio = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
27
26
  return (0, _react2.jsx)(_themeUi.Radio, (0, _extends2["default"])({
28
27
  ref: ref
29
28
  }, props));
@@ -0,0 +1,41 @@
1
+ import { Meta } from '@storybook/addon-docs';
2
+
3
+ <Meta title="Components/RadioGroupField/RadioGroupField" />
4
+
5
+ # RadioGroupField
6
+
7
+ The RadioGroupField component allows users to select a single option from a list of mutually exclusive options.
8
+ This component uses [useRadioGroup](https://react-spectrum.adobe.com/react-aria/useRadioGroup.html) from React Aria and [useRadioGroupState](https://react-spectrum.adobe.com/react-stately/useRadioGroupState.html) from React Stately.
9
+
10
+ RadioGroupField should:
11
+ - Offer at least two choices.
12
+ - Have a clear label describing the context.
13
+ - Include a None option, when appropriate.
14
+
15
+ RadioGroupField shouldn’t be used to change state or set off an action. Nor should it be used to display a list of more than 6 options. If that’s the case, use the [SelectField](./?path=/story/form-selectfield--default) instead.
16
+
17
+ ### Required components
18
+
19
+ This component requires the RadioField component.
20
+
21
+ ### Accessibility
22
+
23
+ This component should adhere to the [WAI-ARIA RadioGroup](https://www.w3.org/WAI/ARIA/apg/patterns/radio/) accessibility guidelines.
24
+
25
+ #### Keyboard Navigation
26
+
27
+ These keys provide additional functionality to the component.
28
+
29
+ | Keys | Functions |
30
+ | ---- | --------- |
31
+ | Tab | The field is focusable using the Tab key and follows the page tab sequence. |
32
+ | Shift + Tab | Moves focus to the previous focusable component. |
33
+ | Arrow Keys | Once focused, the radio button can be selected using any of the arrow keys. |
34
+ | Space | If the radio button is focused, pressing space selects or deselects it. |
35
+
36
+ #### Screen readers
37
+
38
+ This component uses the following attributes to assist screen readers:
39
+
40
+ - The **`aria-labelledby`** attribute is used to reference the label, and the **`aria-orientation`** attribute is set to “Vertical” by default.
41
+ - Each radio input also uses the **`aria-labelledby`** attribute pointing to its label.
@@ -1,8 +1,8 @@
1
1
  "use strict";
2
2
 
3
3
  var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
4
- var _Symbol = require("@babel/runtime-corejs3/core-js-stable/symbol");
5
4
  var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
5
+ var _Symbol = require("@babel/runtime-corejs3/core-js-stable/symbol");
6
6
  var _Object$create = require("@babel/runtime-corejs3/core-js-stable/object/create");
7
7
  var _Object$getPrototypeOf = require("@babel/runtime-corejs3/core-js-stable/object/get-prototype-of");
8
8
  var _forEachInstanceProperty2 = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
@@ -23,7 +23,7 @@ var _testWrapper = require("../../utils/testUtils/testWrapper");
23
23
  var _RadioField = _interopRequireDefault(require("../RadioField"));
24
24
  var _ = _interopRequireDefault(require("."));
25
25
  var _react2 = require("@emotion/react");
26
- function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, $Symbol = "function" == typeof _Symbol ? _Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return _Object$defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = _Object$create(protoGenerator.prototype), context = new Context(tryLocsList || []); return generator._invoke = function (innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; }(innerFn, self, context), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = _Object$getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = _Object$create(IteratorPrototype); function defineIteratorMethods(prototype) { var _context2; _forEachInstanceProperty2(_context2 = ["next", "throw", "return"]).call(_context2, function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; this._invoke = function (method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); }; } function maybeInvokeDelegate(delegate, context) { var method = delegate.iterator[context.method]; if (undefined === method) { if (context.delegate = null, "throw" === context.method) { if (delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method)) return ContinueSentinel; context.method = "throw", context.arg = new TypeError("The iterator does not provide a 'throw' method"); } return ContinueSentinel; } var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], _forEachInstanceProperty2(tryLocsList).call(tryLocsList, pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, define(Gp, "constructor", GeneratorFunctionPrototype), define(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return _Object$setPrototypeOf ? _Object$setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = _Object$create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = _Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (object) { var keys = []; for (var key in object) { keys.push(key); } return _reverseInstanceProperty(keys).call(keys), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { var _context3; if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, _forEachInstanceProperty2(_context3 = this.tryEntries).call(_context3, resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+_sliceInstanceProperty(name).call(name, 1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, "catch": function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
26
+ function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = _Object$defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof _Symbol ? _Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return _Object$defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = _Object$create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = _Object$getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = _Object$create(IteratorPrototype); function defineIteratorMethods(prototype) { var _context2; _forEachInstanceProperty2(_context2 = ["next", "throw", "return"]).call(_context2, function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], _forEachInstanceProperty2(tryLocsList).call(tryLocsList, pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return _Object$setPrototypeOf ? _Object$setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = _Object$create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = _Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) { keys.push(key); } return _reverseInstanceProperty(keys).call(keys), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { var _context3; if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, _forEachInstanceProperty2(_context3 = this.tryEntries).call(_context3, resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+_sliceInstanceProperty(name).call(name, 1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, "catch": function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
27
27
  var testId = 'test-radio-group';
28
28
  var testLabel = 'Test Label';
29
29
  var testValues = ['dogs', 'cats', 'dragons'];
@@ -0,0 +1,17 @@
1
+ import { Meta } from '@storybook/addon-docs';
2
+
3
+ <Meta title="Components/RequirementsList/RequirementsList" />
4
+
5
+ # RequirementsList
6
+
7
+ The RequirementsList component is used to display password requirements and includes indicators showing the requirement status.
8
+
9
+ This list should:
10
+ - Be sorted in a logical way that makes content easy to scan.
11
+ - Have each item associated with an action.
12
+
13
+ The list shouldn’t use punctuation at the end of each line.
14
+
15
+ ### Required Components
16
+
17
+ This component can be used independently and does not require additional components.
@@ -0,0 +1,36 @@
1
+ import { Meta } from '@storybook/addon-docs';
2
+
3
+ <Meta title="Components/RockerButtonGroup/RockerButtonGroup" />
4
+
5
+ # RockerButtonGroup
6
+
7
+ This component handles a single selection state for a group of rocker buttons. It is intended to be used with the RockerButton component as children.
8
+
9
+ This component should:
10
+ - Be used for a single-item selection.
11
+ - Contain concise labels.
12
+
13
+ It shouldn’t be used as a replacement for RadioButton.
14
+
15
+ ### Required Components
16
+
17
+ This component requires the RockerButton component.
18
+
19
+ ### Accessibility
20
+
21
+ #### Keyboard Navigation
22
+
23
+ These keys provide additional functionality to the component.
24
+
25
+ | Key | Functions |
26
+ | ---- | ---- |
27
+ | Tab | The group is focusable using the Tab key and follows the page tab sequence. |
28
+ | Arrow keys & Enter or Space| After the RockerButtonGroup has focus, individual rocker buttons can be focused using the right and left arrow keys, and selected by either pressing the Enter key or Space. |
29
+ | Arrow keys | The right and left arrow keys can loop back to the beginning and end of the group |
30
+
31
+ #### Screen Readers
32
+
33
+ This component uses the following attributes to assist screen readers:
34
+ - The **`aria-orientation`** attribute indicates whether the orientation is horizontal, vertical, unknown, or ambiguous.
35
+ - The default **`aria-disabled`** attribute is set to “False” by default.
36
+ - The buttons use the **`aria-pressed`** attribute to indicate the current status of the toggle button.
@@ -0,0 +1,17 @@
1
+ import { Meta } from '@storybook/addon-docs';
2
+
3
+ <Meta title="Components/ScrollBox/ScrollBox" />
4
+
5
+ # ScrollBox
6
+
7
+ The ScrollBox component is a container that allows users to scroll through content.
8
+
9
+ This component should:
10
+ - Be used for large amounts of text, such as disclaimers and terms of service.
11
+ - Always have a visible scroll bar or default operating scroll bar.
12
+
13
+ It shouldn’t rely on the user to scroll down to the end. Include important information in the visible area.
14
+
15
+ ### Required Components
16
+
17
+ This component requires the [Box](./?path=/story/components-box--default) component.
@@ -0,0 +1,33 @@
1
+ import { Meta } from '@storybook/addon-docs';
2
+
3
+ <Meta title="Components/SearchField/SearchField" />
4
+
5
+ # SearchField
6
+
7
+ The SearchField component renders a search field with associated controls, including visual elements and keyboard interaction handlers.
8
+ It is built with [useSearchField](https://react-spectrum.adobe.com/react-aria/useSearchField.html) from React Aria and [useSearchFieldState](https://react-spectrum.adobe.com/react-stately/useSearchFieldState.html) from React Stately.
9
+
10
+ This component should be:
11
+ - Used for searching and filtering.
12
+ - Limited to a single use per page.
13
+
14
+ It shouldn’t:
15
+ - Use important information as placeholders. Once the search term is entered, the placeholder is no longer visible.
16
+ - Be used if all the information is easily accessible and within view.
17
+
18
+ ### Required components
19
+
20
+ This component can be used independently and does not require additional components.
21
+
22
+ ### Accessibility
23
+
24
+ #### Keyboard Navigation
25
+
26
+ These keys provide additional functionality to the component.
27
+
28
+ | Keys | Functions |
29
+ | ---- | --------- |
30
+ | Tab | The field is focusable using the Tab key and follows the page tab sequence. |
31
+ | Shift + Tab | Moves focus to the previous focusable component. |
32
+ | Enter or Space | Once the user starts typing, the previously hidden clear button can be focused and selected by pressing the Enter or Space key. |
33
+ | Esc and Enter | The field can be cleared by pressing the Escape key and handles submit events on Enter. |
@@ -17,7 +17,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/he
17
17
  var _variants = require("../../styles/variants");
18
18
  var _Input = require("../Input/Input.styles");
19
19
  function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
20
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
20
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; } // Styles for default select and variants go here.
21
21
  var activeFloatLabel = {
22
22
  pt: 'md',
23
23
  pb: 'xs'
@@ -0,0 +1,46 @@
1
+ import { Meta } from '@storybook/addon-docs';
2
+
3
+ <Meta title="Components/SelectField/SelectField" />
4
+
5
+ # SelectField
6
+
7
+ The component allows items to be selected from a drop-down list and displayed in the field.
8
+ It is a variation of the [LinkSelectField](./?path=/docs/form-linkselectfield--default) component that uses [useSelect](https://react-spectrum.adobe.com/react-aria/useSelect.html) from React Aria and [useSelectState](https://react-spectrum.adobe.com/react-stately/useSelectState.html) from React Stately and does not rely on native browsers or mobile implementations.
9
+
10
+ The SelectField component should be used to present choices between mutually exclusive options.
11
+
12
+ It shouldn’t be used:
13
+ - When there are fewer than three options. Use the [RadioGroupField](./?path=/docs/form-radiogroupfield--default) component instead.
14
+ - If the user input can't be predicted using the preset values and the exact input value is important to specify, use the [TextField](./?path=/docs/form-textfield--default) component instead.
15
+ - For large complex lists. The user should be able to easily scan and navigate the list.
16
+ If the list is large, use the [ComboBoxField](./?path=/docs/form-comboboxfield--default) component instead.
17
+
18
+ ### Required components
19
+
20
+ This component requires the OverlayProvider and Item originating from [react-stately/collections](https://react-spectrum.adobe.com/react-stately/collections.html).
21
+
22
+ ### Accessibility
23
+
24
+ #### Keyboard Navigation
25
+
26
+ These keys provide additional functionality to the component.
27
+
28
+ | Keys | Functions |
29
+ | ---- | --------- |
30
+ | Tab | The field is focusable using the Tab key and follows the page tab sequence. |
31
+ | Shift + Tab | Moves focus to the previous focusable component.|
32
+ | Space or Enter | Pressing Space or Enter when the trigger button is focused opens or closes the menu. Pressing Space or Enter when the menu item is focused selects the listbox option. |
33
+ | Arrow keys | Can be used to move through the listbox selection. |
34
+ | Typing in input field | Adds focus to it and opens the popover. |
35
+ | Home(Fn + Right Arrow Key) Or Control/Command + Home | Shifts the focus to the first item in the listbox. |
36
+ | End(Fn + Left Arrow Key) Or Control/Command + End | Shifts the focus to the last item in the listbox. |
37
+ | Esc | Pressing the escape key closes the popover menu and adds focus to the input.|
38
+
39
+ #### Screen readers
40
+
41
+ This component uses the following attributes to assist screen readers:
42
+ - The trigger button uses the **`aria-labelledby`** attribute to reference the label ID, the **`aria-expanded`** attribute to indicate the expansion or collapse of the popover,
43
+ - The **`aria-haspopup`** attribute indicates the type of popup content as a listbox. Once expanded, the **`aria-controls`** attribute is added to the button pointing to the popover.
44
+ - The component uses the **`aria-invalid`** attribute to detect incorrect values or status errors, and is set to “False” by default.
45
+ - The listbox uses the **`aria-labelledby`** attribute pointing to the label ID.
46
+ - Each option in the list uses the **`aria-selected`** attribute to indicate the selection state, **`aria-posinset`** to give the option’s position in the current set of list items, and **`aria-setsize`** to define the current set of options. The default **`aria-disabled`** value is false for each option.