@nypl/design-system-react-components 1.0.1 → 1.0.2

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 (396) hide show
  1. package/CHANGELOG.md +1428 -3
  2. package/README.md +391 -3
  3. package/dist/__tests__/fileMock.d.ts +4 -0
  4. package/dist/__tests__/setup.d.ts +2 -0
  5. package/{lib/stories/0-Welcome.stories.d.ts → dist/__tests__/utils/utils.test.d.ts} +1 -1
  6. package/dist/components/Accordion/Accordion.d.ts +21 -0
  7. package/dist/components/Autosuggest/Autosuggest.stories.d.ts +4 -0
  8. package/dist/components/Breadcrumbs/Breadcrumbs.d.ts +18 -0
  9. package/dist/components/Button/Button.d.ts +25 -0
  10. package/dist/components/ButtonGroup/ButtonGroup.d.ts +22 -0
  11. package/dist/components/Card/Card.d.ts +49 -0
  12. package/dist/components/Checkbox/Checkbox.d.ts +47 -0
  13. package/dist/components/CheckboxGroup/CheckboxGroup.d.ts +49 -0
  14. package/dist/components/ComponentWrapper/ComponentWrapper.d.ts +29 -0
  15. package/dist/components/DatePicker/DatePicker.d.ts +81 -0
  16. package/dist/components/Fieldset/Fieldset.d.ts +22 -0
  17. package/dist/components/Form/Form.d.ts +29 -0
  18. package/dist/components/Grid/SimpleGrid.d.ts +17 -0
  19. package/dist/components/Heading/Heading.d.ts +27 -0
  20. package/dist/components/HelperErrorText/HelperErrorText.d.ts +29 -0
  21. package/dist/components/Hero/Hero.d.ts +40 -0
  22. package/dist/components/HorizontalRule/HorizontalRule.d.ts +11 -0
  23. package/dist/components/Icons/Icon.d.ts +37 -0
  24. package/dist/components/Icons/IconSvgs.d.ts +33 -0
  25. package/dist/components/Image/Image.d.ts +61 -0
  26. package/dist/components/Label/Label.d.ts +20 -0
  27. package/dist/components/Link/Link.d.ts +20 -0
  28. package/dist/components/List/List.d.ts +35 -0
  29. package/dist/components/Logo/Logo.d.ts +26 -0
  30. package/dist/components/Logo/LogoSvgs.d.ts +46 -0
  31. package/dist/components/Modal/Modal.d.ts +33 -0
  32. package/dist/components/Notification/Notification.d.ts +50 -0
  33. package/dist/components/Pagination/Pagination.d.ts +27 -0
  34. package/dist/components/Placeholder/Placeholder.d.ts +10 -0
  35. package/dist/components/ProgressIndicator/ProgressIndicator.d.ts +30 -0
  36. package/dist/components/Radio/Radio.d.ts +43 -0
  37. package/dist/components/RadioGroup/RadioGroup.d.ts +51 -0
  38. package/dist/components/SearchBar/SearchBar.d.ts +61 -0
  39. package/dist/components/Select/Select.d.ts +57 -0
  40. package/dist/components/SkeletonLoader/SkeletonLoader.d.ts +39 -0
  41. package/dist/components/SkipNavigation/SkipNavigation.d.ts +17 -0
  42. package/dist/components/Slider/Slider.d.ts +60 -0
  43. package/dist/components/StatusBadge/StatusBadge.d.ts +16 -0
  44. package/dist/components/StructuredContent/StructuredContent.d.ts +28 -0
  45. package/dist/components/StyleGuide/ColorCard.d.ts +12 -0
  46. package/dist/components/Table/Table.d.ts +29 -0
  47. package/dist/components/Tabs/Tabs.d.ts +26 -0
  48. package/dist/components/Template/Template.d.ts +126 -0
  49. package/dist/components/Text/Text.d.ts +16 -0
  50. package/dist/components/TextInput/TextInput.d.ts +78 -0
  51. package/dist/components/Toggle/Toggle.d.ts +42 -0
  52. package/dist/components/VideoPlayer/VideoPlayer.d.ts +38 -0
  53. package/dist/design-system-react-components.cjs.development.js +11305 -0
  54. package/dist/design-system-react-components.cjs.development.js.map +1 -0
  55. package/dist/design-system-react-components.cjs.production.min.js +2 -0
  56. package/dist/design-system-react-components.cjs.production.min.js.map +1 -0
  57. package/dist/design-system-react-components.esm.js +11150 -0
  58. package/dist/design-system-react-components.esm.js.map +1 -0
  59. package/dist/helpers/types.d.ts +1 -0
  60. package/dist/hooks/tests/useCarouselStyles.test.d.ts +1 -0
  61. package/dist/hooks/useCarouselStyles.d.ts +17 -0
  62. package/dist/hooks/useNYPLTheme.d.ts +66 -0
  63. package/dist/hooks/useWindowSize.d.ts +10 -0
  64. package/dist/index.d.ts +48 -0
  65. package/dist/index.js +8 -0
  66. package/dist/resources.scss +386 -0
  67. package/dist/styles.css +3 -0
  68. package/dist/theme/components/accordion.d.ts +20 -0
  69. package/dist/theme/components/breadcrumb.d.ts +105 -0
  70. package/dist/theme/components/button.d.ts +120 -0
  71. package/dist/theme/components/buttonGroup.d.ts +11 -0
  72. package/dist/theme/components/card.d.ts +381 -0
  73. package/dist/theme/components/checkbox.d.ts +95 -0
  74. package/dist/theme/components/checkboxGroup.d.ts +14 -0
  75. package/dist/theme/components/componentWrapper.d.ts +12 -0
  76. package/dist/theme/components/customTable.d.ts +136 -0
  77. package/dist/theme/components/datePicker.d.ts +16 -0
  78. package/dist/theme/components/fieldset.d.ts +20 -0
  79. package/dist/theme/components/global.d.ts +73 -0
  80. package/dist/theme/components/globalMixins.d.ts +23 -0
  81. package/dist/theme/components/heading.d.ts +160 -0
  82. package/dist/theme/components/helperErrorText.d.ts +12 -0
  83. package/dist/theme/components/hero.d.ts +499 -0
  84. package/dist/theme/components/horizontalRule.d.ts +15 -0
  85. package/dist/theme/components/icon.d.ts +47755 -0
  86. package/dist/theme/components/image.d.ts +590 -0
  87. package/dist/theme/components/label.d.ts +18 -0
  88. package/dist/theme/components/link.d.ts +62 -0
  89. package/dist/theme/components/list.d.ts +182 -0
  90. package/dist/theme/components/logo.d.ts +477 -0
  91. package/dist/theme/components/notification.d.ts +95 -0
  92. package/dist/theme/components/pagination.d.ts +16 -0
  93. package/dist/theme/components/progressIndicator.d.ts +52 -0
  94. package/dist/theme/components/radio.d.ts +99 -0
  95. package/dist/theme/components/radioGroup.d.ts +14 -0
  96. package/dist/theme/components/searchBar.d.ts +18 -0
  97. package/dist/theme/components/select.d.ts +87 -0
  98. package/dist/theme/components/skeletonLoader.d.ts +102 -0
  99. package/dist/theme/components/skipNavigation.d.ts +25 -0
  100. package/dist/theme/components/slider.d.ts +59 -0
  101. package/dist/theme/components/statusBadge.d.ts +25 -0
  102. package/dist/theme/components/structuredContent.d.ts +226 -0
  103. package/dist/theme/components/tabs.d.ts +136 -0
  104. package/dist/theme/components/template.d.ts +105 -0
  105. package/dist/theme/components/text.d.ts +26 -0
  106. package/dist/theme/components/textInput.d.ts +124 -0
  107. package/dist/theme/components/toggle.d.ts +92 -0
  108. package/dist/theme/components/videoPlayer.d.ts +40 -0
  109. package/dist/theme/foundations/breakpoints.d.ts +23 -0
  110. package/dist/theme/foundations/colors.d.ts +3 -0
  111. package/dist/theme/foundations/global.d.ts +58 -0
  112. package/dist/theme/foundations/radii.d.ts +6 -0
  113. package/dist/theme/foundations/shadows.d.ts +4 -0
  114. package/dist/theme/foundations/spacing.d.ts +82 -0
  115. package/dist/theme/foundations/typography.d.ts +8 -0
  116. package/dist/theme/index.d.ts +20 -0
  117. package/dist/theme/provider.d.ts +3 -0
  118. package/dist/theme/types.d.ts +1 -0
  119. package/dist/utils/componentCategories.d.ts +1 -0
  120. package/dist/utils/interfaces.d.ts +5 -0
  121. package/dist/utils/utils.d.ts +31 -0
  122. package/package.json +133 -20
  123. package/src/__tests__/fileMock.ts +6 -0
  124. package/src/__tests__/setup.ts +27 -0
  125. package/src/__tests__/utils/utils.test.ts +18 -0
  126. package/src/components/AccessibilityGuide/SkipNavigation.stories.mdx +42 -0
  127. package/src/components/Accordion/Accordion.stories.mdx +333 -0
  128. package/src/components/Accordion/Accordion.test.tsx +237 -0
  129. package/src/components/Accordion/Accordion.tsx +137 -0
  130. package/src/components/Accordion/__snapshots__/Accordion.test.tsx.snap +734 -0
  131. package/src/components/Autosuggest/Autosuggest.stories.mdx +75 -0
  132. package/src/components/Autosuggest/Autosuggest.stories.tsx +211 -0
  133. package/src/components/Autosuggest/_Autosuggest.scss +51 -0
  134. package/src/components/Breadcrumbs/Breadcrumbs.stories.mdx +231 -0
  135. package/src/components/Breadcrumbs/Breadcrumbs.test.tsx +144 -0
  136. package/src/components/Breadcrumbs/Breadcrumbs.tsx +98 -0
  137. package/src/components/Breadcrumbs/__snapshots__/Breadcrumbs.test.tsx.snap +695 -0
  138. package/src/components/Button/Button.stories.mdx +320 -0
  139. package/src/components/Button/Button.test.tsx +184 -0
  140. package/src/components/Button/Button.tsx +95 -0
  141. package/src/components/Button/__snapshots__/Button.test.tsx.snap +106 -0
  142. package/src/components/ButtonGroup/ButtonGroup.stories.mdx +178 -0
  143. package/src/components/ButtonGroup/ButtonGroup.test.tsx +141 -0
  144. package/src/components/ButtonGroup/ButtonGroup.tsx +100 -0
  145. package/src/components/ButtonGroup/__snapshots__/ButtonGroup.test.tsx.snap +117 -0
  146. package/src/components/Card/Card.stories.mdx +1041 -0
  147. package/src/components/Card/Card.test.tsx +388 -0
  148. package/src/components/Card/Card.tsx +346 -0
  149. package/src/components/Card/__snapshots__/Card.test.tsx.snap +568 -0
  150. package/src/components/Chakra/Box.stories.mdx +52 -0
  151. package/src/components/Chakra/Center.stories.mdx +96 -0
  152. package/src/components/Chakra/Flex.stories.mdx +111 -0
  153. package/src/components/Chakra/Grid.stories.mdx +89 -0
  154. package/src/components/Chakra/Stack.stories.mdx +109 -0
  155. package/src/components/Checkbox/Checkbox.stories.mdx +243 -0
  156. package/src/components/Checkbox/Checkbox.test.tsx +350 -0
  157. package/src/components/Checkbox/Checkbox.tsx +152 -0
  158. package/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap +661 -0
  159. package/src/components/CheckboxGroup/CheckboxGroup.stories.mdx +462 -0
  160. package/src/components/CheckboxGroup/CheckboxGroup.test.tsx +492 -0
  161. package/src/components/CheckboxGroup/CheckboxGroup.tsx +173 -0
  162. package/src/components/CheckboxGroup/__snapshots__/CheckboxGroup.test.tsx.snap +1842 -0
  163. package/src/components/ComponentWrapper/ComponentWrapper.test.tsx +163 -0
  164. package/src/components/ComponentWrapper/ComponentWrapper.tsx +76 -0
  165. package/src/components/ComponentWrapper/__snapshots__/ComponentWrapper.test.tsx.snap +103 -0
  166. package/src/components/DatePicker/DatePicker.stories.mdx +452 -0
  167. package/src/components/DatePicker/DatePicker.test.tsx +940 -0
  168. package/src/components/DatePicker/DatePicker.tsx +450 -0
  169. package/src/components/DatePicker/_DatePicker.scss +100 -0
  170. package/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap +908 -0
  171. package/src/components/Fieldset/Fieldset.stories.mdx +96 -0
  172. package/src/components/Fieldset/Fieldset.test.tsx +155 -0
  173. package/src/components/Fieldset/Fieldset.tsx +55 -0
  174. package/src/components/Fieldset/__snapshots__/Fieldset.test.tsx.snap +89 -0
  175. package/src/components/Form/Form.stories.mdx +426 -0
  176. package/src/components/Form/Form.test.tsx +234 -0
  177. package/src/components/Form/Form.tsx +124 -0
  178. package/src/components/Form/__snapshots__/Form.test.tsx.snap +115 -0
  179. package/src/components/Grid/SimpleGrid.stories.mdx +336 -0
  180. package/src/components/Grid/SimpleGrid.test.tsx +79 -0
  181. package/src/components/Grid/SimpleGrid.tsx +49 -0
  182. package/src/components/Grid/__snapshots__/SimpleGrid.test.tsx.snap +23 -0
  183. package/src/components/Heading/Heading.stories.mdx +187 -0
  184. package/src/components/Heading/Heading.test.tsx +171 -0
  185. package/src/components/Heading/Heading.tsx +104 -0
  186. package/src/components/Heading/__snapshots__/Heading.test.tsx.snap +90 -0
  187. package/src/components/HelperErrorText/HelperErrorText.stories.mdx +172 -0
  188. package/src/components/HelperErrorText/HelperErrorText.test.tsx +114 -0
  189. package/src/components/HelperErrorText/HelperErrorText.tsx +62 -0
  190. package/src/components/HelperErrorText/__snapshots__/HelperErrorText.test.tsx.snap +93 -0
  191. package/src/components/Hero/Hero.stories.mdx +378 -0
  192. package/src/components/Hero/Hero.test.tsx +611 -0
  193. package/src/components/Hero/Hero.tsx +203 -0
  194. package/src/components/Hero/__snapshots__/Hero.test.tsx.snap +379 -0
  195. package/src/components/HorizontalRule/HorizontalRule.stories.mdx +73 -0
  196. package/src/components/HorizontalRule/HorizontalRule.test.tsx +54 -0
  197. package/src/components/HorizontalRule/HorizontalRule.tsx +27 -0
  198. package/src/components/HorizontalRule/__snapshots__/HorizontalRule.test.tsx.snap +44 -0
  199. package/src/components/Icons/Icon.stories.mdx +413 -0
  200. package/src/components/Icons/Icon.test.tsx +120 -0
  201. package/src/components/Icons/Icon.tsx +187 -0
  202. package/src/components/Icons/IconSvgs.tsx +64 -0
  203. package/src/components/Icons/__snapshots__/Icon.test.tsx.snap +129 -0
  204. package/src/components/Image/Image.stories.mdx +332 -0
  205. package/src/components/Image/Image.test.tsx +155 -0
  206. package/src/components/Image/Image.tsx +171 -0
  207. package/src/components/Image/__snapshots__/Image.test.tsx.snap +269 -0
  208. package/src/components/Label/Label.stories.mdx +100 -0
  209. package/src/components/Label/Label.test.tsx +116 -0
  210. package/src/components/Label/Label.tsx +55 -0
  211. package/src/components/Label/__snapshots__/Label.test.tsx.snap +45 -0
  212. package/src/components/Link/Link.stories.mdx +249 -0
  213. package/src/components/Link/Link.test.tsx +224 -0
  214. package/src/components/Link/Link.tsx +178 -0
  215. package/src/components/Link/__snapshots__/Link.test.tsx.snap +286 -0
  216. package/src/components/List/List.stories.mdx +393 -0
  217. package/src/components/List/List.test.tsx +265 -0
  218. package/src/components/List/List.tsx +156 -0
  219. package/src/components/List/__snapshots__/List.test.tsx.snap +213 -0
  220. package/src/components/Logo/Logo.stories.mdx +295 -0
  221. package/src/components/Logo/Logo.test.tsx +116 -0
  222. package/src/components/Logo/Logo.tsx +151 -0
  223. package/src/components/Logo/LogoSvgs.tsx +90 -0
  224. package/src/components/Logo/__snapshots__/Logo.test.tsx.snap +142 -0
  225. package/src/components/Modal/Modal.stories.mdx +294 -0
  226. package/src/components/Modal/Modal.test.tsx +157 -0
  227. package/src/components/Modal/Modal.tsx +154 -0
  228. package/src/components/Modal/__snapshots__/Modal.test.tsx.snap +25 -0
  229. package/src/components/Notification/Notification.stories.mdx +358 -0
  230. package/src/components/Notification/Notification.test.tsx +279 -0
  231. package/src/components/Notification/Notification.tsx +224 -0
  232. package/src/components/Notification/__snapshots__/Notification.test.tsx.snap +525 -0
  233. package/src/components/Pagination/Pagination.stories.mdx +184 -0
  234. package/src/components/Pagination/Pagination.test.tsx +419 -0
  235. package/src/components/Pagination/Pagination.tsx +269 -0
  236. package/src/components/Pagination/__snapshots__/Pagination.test.tsx.snap +544 -0
  237. package/src/components/Placeholder/Placeholder.tsx +19 -0
  238. package/src/components/ProgressIndicator/ProgressIndicator.stories.mdx +360 -0
  239. package/src/components/ProgressIndicator/ProgressIndicator.test.tsx +298 -0
  240. package/src/components/ProgressIndicator/ProgressIndicator.tsx +132 -0
  241. package/src/components/ProgressIndicator/__snapshots__/ProgressIndicator.test.tsx.snap +434 -0
  242. package/src/components/Radio/Radio.stories.mdx +216 -0
  243. package/src/components/Radio/Radio.test.tsx +247 -0
  244. package/src/components/Radio/Radio.tsx +119 -0
  245. package/src/components/Radio/__snapshots__/Radio.test.tsx.snap +451 -0
  246. package/src/components/RadioGroup/RadioGroup.stories.mdx +479 -0
  247. package/src/components/RadioGroup/RadioGroup.test.tsx +471 -0
  248. package/src/components/RadioGroup/RadioGroup.tsx +171 -0
  249. package/src/components/RadioGroup/__snapshots__/RadioGroup.test.tsx.snap +1550 -0
  250. package/src/components/SearchBar/SearchBar.stories.mdx +518 -0
  251. package/src/components/SearchBar/SearchBar.test.tsx +435 -0
  252. package/src/components/SearchBar/SearchBar.tsx +210 -0
  253. package/src/components/SearchBar/__snapshots__/SearchBar.test.tsx.snap +1049 -0
  254. package/src/components/Select/Select.stories.mdx +439 -0
  255. package/src/components/Select/Select.test.tsx +358 -0
  256. package/src/components/Select/Select.tsx +183 -0
  257. package/src/components/Select/__snapshots__/Select.test.tsx.snap +895 -0
  258. package/src/components/SkeletonLoader/SkeletonLoader.stories.mdx +142 -0
  259. package/src/components/SkeletonLoader/SkeletonLoader.test.tsx +116 -0
  260. package/src/components/SkeletonLoader/SkeletonLoader.tsx +123 -0
  261. package/src/components/SkeletonLoader/__snapshots__/SkeletonLoader.test.tsx.snap +898 -0
  262. package/src/components/SkipNavigation/SkipNavigation.stories.mdx +90 -0
  263. package/src/components/SkipNavigation/SkipNavigation.test.tsx +63 -0
  264. package/src/components/SkipNavigation/SkipNavigation.tsx +51 -0
  265. package/src/components/SkipNavigation/__snapshots__/SkipNavigation.test.tsx.snap +130 -0
  266. package/src/components/Slider/Slider.stories.mdx +628 -0
  267. package/src/components/Slider/Slider.test.tsx +736 -0
  268. package/src/components/Slider/Slider.tsx +322 -0
  269. package/src/components/Slider/__snapshots__/Slider.test.tsx.snap +2186 -0
  270. package/src/components/StatusBadge/StatusBadge.stories.mdx +109 -0
  271. package/src/components/StatusBadge/StatusBadge.test.tsx +70 -0
  272. package/src/components/StatusBadge/StatusBadge.tsx +35 -0
  273. package/src/components/StatusBadge/__snapshots__/StatusBadge.test.tsx.snap +47 -0
  274. package/src/components/StructuredContent/StructuredContent.stories.mdx +567 -0
  275. package/src/components/StructuredContent/StructuredContent.test.tsx +435 -0
  276. package/src/components/StructuredContent/StructuredContent.tsx +139 -0
  277. package/src/components/StructuredContent/__snapshots__/StructuredContent.test.tsx.snap +368 -0
  278. package/src/components/StyleGuide/Bidirectionality.stories.mdx +206 -0
  279. package/src/components/StyleGuide/Breakpoints.stories.mdx +55 -0
  280. package/src/components/StyleGuide/Buttons.stories.mdx +194 -0
  281. package/src/components/StyleGuide/ColorCard.tsx +43 -0
  282. package/src/components/StyleGuide/Colors.stories.mdx +201 -0
  283. package/src/components/StyleGuide/DesignTokens.stories.mdx +193 -0
  284. package/src/components/StyleGuide/Forms.stories.mdx +94 -0
  285. package/src/components/StyleGuide/Iconography.stories.mdx +142 -0
  286. package/src/components/StyleGuide/Spacing.stories.mdx +116 -0
  287. package/src/components/StyleGuide/Typography.stories.mdx +419 -0
  288. package/src/components/Table/Table.stories.mdx +272 -0
  289. package/src/components/Table/Table.test.tsx +241 -0
  290. package/src/components/Table/Table.tsx +152 -0
  291. package/src/components/Table/__snapshots__/Table.test.tsx.snap +1703 -0
  292. package/src/components/Tabs/Tabs.stories.mdx +338 -0
  293. package/src/components/Tabs/Tabs.test.tsx +298 -0
  294. package/src/components/Tabs/Tabs.tsx +264 -0
  295. package/src/components/Tabs/__snapshots__/Tabs.test.tsx.snap +584 -0
  296. package/src/components/Template/Template.stories.mdx +695 -0
  297. package/src/components/Template/Template.test.tsx +309 -0
  298. package/src/components/Template/Template.tsx +326 -0
  299. package/src/components/Template/__snapshots__/Template.test.tsx.snap +342 -0
  300. package/src/components/Text/Text.stories.mdx +103 -0
  301. package/src/components/Text/Text.test.tsx +63 -0
  302. package/src/components/Text/Text.tsx +50 -0
  303. package/src/components/Text/__snapshots__/Text.test.tsx.snap +50 -0
  304. package/src/components/TextInput/TextInput.stories.mdx +268 -0
  305. package/src/components/TextInput/TextInput.test.tsx +451 -0
  306. package/src/components/TextInput/TextInput.tsx +240 -0
  307. package/src/components/TextInput/__snapshots__/TextInput.test.tsx.snap +274 -0
  308. package/src/components/Toggle/Toggle.stories.mdx +237 -0
  309. package/src/components/Toggle/Toggle.test.tsx +170 -0
  310. package/src/components/Toggle/Toggle.tsx +128 -0
  311. package/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap +470 -0
  312. package/src/components/VideoPlayer/VideoPlayer.stories.mdx +212 -0
  313. package/src/components/VideoPlayer/VideoPlayer.test.tsx +308 -0
  314. package/src/components/VideoPlayer/VideoPlayer.tsx +188 -0
  315. package/src/components/VideoPlayer/__snapshots__/VideoPlayer.test.tsx.snap +192 -0
  316. package/src/docs/Chakra.stories.mdx +563 -0
  317. package/src/docs/Welcome.stories.mdx +148 -0
  318. package/src/helpers/types.ts +1 -0
  319. package/src/hooks/tests/useCarouselStyles.test.ts +140 -0
  320. package/src/hooks/tests/useNYPLTheme.test.tsx +36 -0
  321. package/src/hooks/useCarouselStyles.stories.mdx +30 -0
  322. package/src/hooks/useCarouselStyles.ts +35 -0
  323. package/src/hooks/useNYPLTheme.stories.mdx +98 -0
  324. package/src/hooks/useNYPLTheme.ts +91 -0
  325. package/src/hooks/useWindowSize.stories.mdx +23 -0
  326. package/src/hooks/useWindowSize.ts +40 -0
  327. package/src/index.ts +136 -0
  328. package/src/resources.scss +6 -0
  329. package/src/styles/base/_01-breakpoints.scss +27 -0
  330. package/src/styles/base/_02-mixins.scss +103 -0
  331. package/src/styles/base/_place-holder.scss +33 -0
  332. package/src/styles/space/_space-inline.scss +79 -0
  333. package/src/styles/space/_space-inset.scss +57 -0
  334. package/src/styles/space/_space-stack.scss +116 -0
  335. package/src/styles.scss +23 -0
  336. package/src/theme/components/accordion.ts +25 -0
  337. package/src/theme/components/breadcrumb.ts +94 -0
  338. package/src/theme/components/button.ts +133 -0
  339. package/src/theme/components/buttonGroup.ts +10 -0
  340. package/src/theme/components/card.ts +237 -0
  341. package/src/theme/components/checkbox.ts +110 -0
  342. package/src/theme/components/checkboxGroup.ts +10 -0
  343. package/src/theme/components/componentWrapper.ts +14 -0
  344. package/src/theme/components/customTable.ts +77 -0
  345. package/src/theme/components/datePicker.ts +17 -0
  346. package/src/theme/components/fieldset.ts +23 -0
  347. package/src/theme/components/global.ts +91 -0
  348. package/src/theme/components/globalMixins.ts +24 -0
  349. package/src/theme/components/heading.ts +79 -0
  350. package/src/theme/components/helperErrorText.ts +14 -0
  351. package/src/theme/components/hero.ts +238 -0
  352. package/src/theme/components/horizontalRule.ts +17 -0
  353. package/src/theme/components/icon.ts +88 -0
  354. package/src/theme/components/image.ts +136 -0
  355. package/src/theme/components/label.ts +15 -0
  356. package/src/theme/components/link.ts +63 -0
  357. package/src/theme/components/list.ts +88 -0
  358. package/src/theme/components/logo.ts +58 -0
  359. package/src/theme/components/notification.ts +132 -0
  360. package/src/theme/components/pagination.ts +17 -0
  361. package/src/theme/components/progressIndicator.ts +67 -0
  362. package/src/theme/components/radio.ts +103 -0
  363. package/src/theme/components/radioGroup.ts +10 -0
  364. package/src/theme/components/searchBar.ts +19 -0
  365. package/src/theme/components/select.ts +72 -0
  366. package/src/theme/components/skeletonLoader.ts +113 -0
  367. package/src/theme/components/skipNavigation.ts +29 -0
  368. package/src/theme/components/slider.ts +95 -0
  369. package/src/theme/components/statusBadge.ts +26 -0
  370. package/src/theme/components/structuredContent.ts +149 -0
  371. package/src/theme/components/tabs.ts +109 -0
  372. package/src/theme/components/template.ts +114 -0
  373. package/src/theme/components/text.ts +38 -0
  374. package/src/theme/components/textInput.ts +65 -0
  375. package/src/theme/components/toggle.ts +109 -0
  376. package/src/theme/components/videoPlayer.ts +47 -0
  377. package/src/theme/foundations/breakpoints.ts +24 -0
  378. package/src/theme/foundations/colors.ts +212 -0
  379. package/src/theme/foundations/global.ts +43 -0
  380. package/src/theme/foundations/radii.ts +7 -0
  381. package/src/theme/foundations/shadows.ts +5 -0
  382. package/src/theme/foundations/spacing.ts +136 -0
  383. package/src/theme/foundations/typography.ts +107 -0
  384. package/src/theme/index.ts +131 -0
  385. package/src/theme/provider.tsx +9 -0
  386. package/src/theme/types.ts +1 -0
  387. package/src/utils/componentCategories.ts +152 -0
  388. package/src/utils/interfaces.ts +5 -0
  389. package/src/utils/utils.ts +84 -0
  390. package/lib/components/Button/Button.d.ts +0 -17
  391. package/lib/components/Button/Button.js +0 -42
  392. package/lib/index.d.ts +0 -1
  393. package/lib/index.js +0 -6
  394. package/lib/stories/0-Welcome.stories.js +0 -19
  395. package/lib/stories/1-Button.stories.d.ts +0 -6
  396. package/lib/stories/1-Button.stories.js +0 -20
package/src/components/Table/__snapshots__/Table.test.tsx.snap ADDED
@@ -0,0 +1,1703 @@
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`Table renders the UI snapshot correctly 1`] = `
4
+ <table
5
+ className="chakra-table css-1xdhyk6"
6
+ id="basic"
7
+ role="table"
8
+ >
9
+ <tbody
10
+ className="css-0"
11
+ >
12
+ <tr
13
+ className="css-0"
14
+ role="row"
15
+ >
16
+ <td
17
+ className="css-0"
18
+ role="gridcell"
19
+ >
20
+ Tom
21
+ </td>
22
+ <td
23
+ className="css-0"
24
+ role="gridcell"
25
+ >
26
+ Nook
27
+ </td>
28
+ <td
29
+ className="css-0"
30
+ role="gridcell"
31
+ >
32
+ Tanukichi
33
+ </td>
34
+ <td
35
+ className="css-0"
36
+ role="gridcell"
37
+ >
38
+ Main Street
39
+ </td>
40
+ <td
41
+ className="css-0"
42
+ role="gridcell"
43
+ >
44
+ New York
45
+ </td>
46
+ <td
47
+ className="css-0"
48
+ role="gridcell"
49
+ >
50
+ 23458
51
+ </td>
52
+ <td
53
+ className="css-0"
54
+ role="gridcell"
55
+ >
56
+ NY
57
+ </td>
58
+ </tr>
59
+ <tr
60
+ className="css-0"
61
+ role="row"
62
+ >
63
+ <td
64
+ className="css-0"
65
+ role="gridcell"
66
+ >
67
+ Isabelle
68
+ </td>
69
+ <td
70
+ className="css-0"
71
+ role="gridcell"
72
+ >
73
+ -
74
+ </td>
75
+ <td
76
+ className="css-0"
77
+ role="gridcell"
78
+ >
79
+ Shizue
80
+ </td>
81
+ <td
82
+ className="css-0"
83
+ role="gridcell"
84
+ >
85
+ Walnut Street
86
+ </td>
87
+ <td
88
+ className="css-0"
89
+ role="gridcell"
90
+ >
91
+ New York
92
+ </td>
93
+ <td
94
+ className="css-0"
95
+ role="gridcell"
96
+ >
97
+ 23458
98
+ </td>
99
+ <td
100
+ className="css-0"
101
+ role="gridcell"
102
+ >
103
+ NY
104
+ </td>
105
+ </tr>
106
+ <tr
107
+ className="css-0"
108
+ role="row"
109
+ >
110
+ <td
111
+ className="css-0"
112
+ role="gridcell"
113
+ >
114
+ K.K.
115
+ </td>
116
+ <td
117
+ className="css-0"
118
+ role="gridcell"
119
+ >
120
+ Slider
121
+ </td>
122
+ <td
123
+ className="css-0"
124
+ role="gridcell"
125
+ >
126
+ Totakeke
127
+ </td>
128
+ <td
129
+ className="css-0"
130
+ role="gridcell"
131
+ >
132
+ Niper Place
133
+ </td>
134
+ <td
135
+ className="css-0"
136
+ role="gridcell"
137
+ >
138
+ New York
139
+ </td>
140
+ <td
141
+ className="css-0"
142
+ role="gridcell"
143
+ >
144
+ 98765
145
+ </td>
146
+ <td
147
+ className="css-0"
148
+ role="gridcell"
149
+ >
150
+ NY
151
+ </td>
152
+ </tr>
153
+ <tr
154
+ className="css-0"
155
+ role="row"
156
+ >
157
+ <td
158
+ className="css-0"
159
+ role="gridcell"
160
+ >
161
+ Sonny
162
+ </td>
163
+ <td
164
+ className="css-0"
165
+ role="gridcell"
166
+ >
167
+ Resetti
168
+ </td>
169
+ <td
170
+ className="css-0"
171
+ role="gridcell"
172
+ >
173
+ Risetto san
174
+ </td>
175
+ <td
176
+ className="css-0"
177
+ role="gridcell"
178
+ >
179
+ Village Road
180
+ </td>
181
+ <td
182
+ className="css-0"
183
+ role="gridcell"
184
+ >
185
+ New York
186
+ </td>
187
+ <td
188
+ className="css-0"
189
+ role="gridcell"
190
+ >
191
+ 09873
192
+ </td>
193
+ <td
194
+ className="css-0"
195
+ role="gridcell"
196
+ >
197
+ NY
198
+ </td>
199
+ </tr>
200
+ </tbody>
201
+ </table>
202
+ `;
203
+
204
+ exports[`Table renders the UI snapshot correctly 2`] = `
205
+ <table
206
+ className="chakra-table css-1xdhyk6"
207
+ id="withCaption"
208
+ role="table"
209
+ >
210
+ <caption
211
+ className="css-18i7bby"
212
+ >
213
+ this is the caption
214
+ </caption>
215
+ <tbody
216
+ className="css-0"
217
+ >
218
+ <tr
219
+ className="css-0"
220
+ role="row"
221
+ >
222
+ <td
223
+ className="css-0"
224
+ role="gridcell"
225
+ >
226
+ Tom
227
+ </td>
228
+ <td
229
+ className="css-0"
230
+ role="gridcell"
231
+ >
232
+ Nook
233
+ </td>
234
+ <td
235
+ className="css-0"
236
+ role="gridcell"
237
+ >
238
+ Tanukichi
239
+ </td>
240
+ <td
241
+ className="css-0"
242
+ role="gridcell"
243
+ >
244
+ Main Street
245
+ </td>
246
+ <td
247
+ className="css-0"
248
+ role="gridcell"
249
+ >
250
+ New York
251
+ </td>
252
+ <td
253
+ className="css-0"
254
+ role="gridcell"
255
+ >
256
+ 23458
257
+ </td>
258
+ <td
259
+ className="css-0"
260
+ role="gridcell"
261
+ >
262
+ NY
263
+ </td>
264
+ </tr>
265
+ <tr
266
+ className="css-0"
267
+ role="row"
268
+ >
269
+ <td
270
+ className="css-0"
271
+ role="gridcell"
272
+ >
273
+ Isabelle
274
+ </td>
275
+ <td
276
+ className="css-0"
277
+ role="gridcell"
278
+ >
279
+ -
280
+ </td>
281
+ <td
282
+ className="css-0"
283
+ role="gridcell"
284
+ >
285
+ Shizue
286
+ </td>
287
+ <td
288
+ className="css-0"
289
+ role="gridcell"
290
+ >
291
+ Walnut Street
292
+ </td>
293
+ <td
294
+ className="css-0"
295
+ role="gridcell"
296
+ >
297
+ New York
298
+ </td>
299
+ <td
300
+ className="css-0"
301
+ role="gridcell"
302
+ >
303
+ 23458
304
+ </td>
305
+ <td
306
+ className="css-0"
307
+ role="gridcell"
308
+ >
309
+ NY
310
+ </td>
311
+ </tr>
312
+ <tr
313
+ className="css-0"
314
+ role="row"
315
+ >
316
+ <td
317
+ className="css-0"
318
+ role="gridcell"
319
+ >
320
+ K.K.
321
+ </td>
322
+ <td
323
+ className="css-0"
324
+ role="gridcell"
325
+ >
326
+ Slider
327
+ </td>
328
+ <td
329
+ className="css-0"
330
+ role="gridcell"
331
+ >
332
+ Totakeke
333
+ </td>
334
+ <td
335
+ className="css-0"
336
+ role="gridcell"
337
+ >
338
+ Niper Place
339
+ </td>
340
+ <td
341
+ className="css-0"
342
+ role="gridcell"
343
+ >
344
+ New York
345
+ </td>
346
+ <td
347
+ className="css-0"
348
+ role="gridcell"
349
+ >
350
+ 98765
351
+ </td>
352
+ <td
353
+ className="css-0"
354
+ role="gridcell"
355
+ >
356
+ NY
357
+ </td>
358
+ </tr>
359
+ <tr
360
+ className="css-0"
361
+ role="row"
362
+ >
363
+ <td
364
+ className="css-0"
365
+ role="gridcell"
366
+ >
367
+ Sonny
368
+ </td>
369
+ <td
370
+ className="css-0"
371
+ role="gridcell"
372
+ >
373
+ Resetti
374
+ </td>
375
+ <td
376
+ className="css-0"
377
+ role="gridcell"
378
+ >
379
+ Risetto san
380
+ </td>
381
+ <td
382
+ className="css-0"
383
+ role="gridcell"
384
+ >
385
+ Village Road
386
+ </td>
387
+ <td
388
+ className="css-0"
389
+ role="gridcell"
390
+ >
391
+ New York
392
+ </td>
393
+ <td
394
+ className="css-0"
395
+ role="gridcell"
396
+ >
397
+ 09873
398
+ </td>
399
+ <td
400
+ className="css-0"
401
+ role="gridcell"
402
+ >
403
+ NY
404
+ </td>
405
+ </tr>
406
+ </tbody>
407
+ </table>
408
+ `;
409
+
410
+ exports[`Table renders the UI snapshot correctly 3`] = `
411
+ <table
412
+ className="chakra-table css-1xdhyk6"
413
+ id="withHeaders"
414
+ role="table"
415
+ >
416
+ <caption
417
+ className="css-18i7bby"
418
+ >
419
+ this is the caption
420
+ </caption>
421
+ <thead
422
+ className="css-0"
423
+ >
424
+ <tr
425
+ className="css-0"
426
+ role="row"
427
+ >
428
+ <th
429
+ className="css-0"
430
+ scope="col"
431
+ >
432
+ First Name
433
+ </th>
434
+ <th
435
+ className="css-0"
436
+ scope="col"
437
+ >
438
+ Last Name
439
+ </th>
440
+ <th
441
+ className="css-0"
442
+ scope="col"
443
+ >
444
+ Nick Name
445
+ </th>
446
+ <th
447
+ className="css-0"
448
+ scope="col"
449
+ >
450
+ Address1
451
+ </th>
452
+ <th
453
+ className="css-0"
454
+ scope="col"
455
+ >
456
+ City
457
+ </th>
458
+ <th
459
+ className="css-0"
460
+ scope="col"
461
+ >
462
+ Zipcode
463
+ </th>
464
+ <th
465
+ className="css-0"
466
+ scope="col"
467
+ >
468
+ State
469
+ </th>
470
+ </tr>
471
+ </thead>
472
+ <tbody
473
+ className="css-0"
474
+ >
475
+ <tr
476
+ className="css-0"
477
+ role="row"
478
+ >
479
+ <td
480
+ className="css-0"
481
+ role="gridcell"
482
+ >
483
+ Tom
484
+ </td>
485
+ <td
486
+ className="css-0"
487
+ role="gridcell"
488
+ >
489
+ Nook
490
+ </td>
491
+ <td
492
+ className="css-0"
493
+ role="gridcell"
494
+ >
495
+ Tanukichi
496
+ </td>
497
+ <td
498
+ className="css-0"
499
+ role="gridcell"
500
+ >
501
+ Main Street
502
+ </td>
503
+ <td
504
+ className="css-0"
505
+ role="gridcell"
506
+ >
507
+ New York
508
+ </td>
509
+ <td
510
+ className="css-0"
511
+ role="gridcell"
512
+ >
513
+ 23458
514
+ </td>
515
+ <td
516
+ className="css-0"
517
+ role="gridcell"
518
+ >
519
+ NY
520
+ </td>
521
+ </tr>
522
+ <tr
523
+ className="css-0"
524
+ role="row"
525
+ >
526
+ <td
527
+ className="css-0"
528
+ role="gridcell"
529
+ >
530
+ Isabelle
531
+ </td>
532
+ <td
533
+ className="css-0"
534
+ role="gridcell"
535
+ >
536
+ -
537
+ </td>
538
+ <td
539
+ className="css-0"
540
+ role="gridcell"
541
+ >
542
+ Shizue
543
+ </td>
544
+ <td
545
+ className="css-0"
546
+ role="gridcell"
547
+ >
548
+ Walnut Street
549
+ </td>
550
+ <td
551
+ className="css-0"
552
+ role="gridcell"
553
+ >
554
+ New York
555
+ </td>
556
+ <td
557
+ className="css-0"
558
+ role="gridcell"
559
+ >
560
+ 23458
561
+ </td>
562
+ <td
563
+ className="css-0"
564
+ role="gridcell"
565
+ >
566
+ NY
567
+ </td>
568
+ </tr>
569
+ <tr
570
+ className="css-0"
571
+ role="row"
572
+ >
573
+ <td
574
+ className="css-0"
575
+ role="gridcell"
576
+ >
577
+ K.K.
578
+ </td>
579
+ <td
580
+ className="css-0"
581
+ role="gridcell"
582
+ >
583
+ Slider
584
+ </td>
585
+ <td
586
+ className="css-0"
587
+ role="gridcell"
588
+ >
589
+ Totakeke
590
+ </td>
591
+ <td
592
+ className="css-0"
593
+ role="gridcell"
594
+ >
595
+ Niper Place
596
+ </td>
597
+ <td
598
+ className="css-0"
599
+ role="gridcell"
600
+ >
601
+ New York
602
+ </td>
603
+ <td
604
+ className="css-0"
605
+ role="gridcell"
606
+ >
607
+ 98765
608
+ </td>
609
+ <td
610
+ className="css-0"
611
+ role="gridcell"
612
+ >
613
+ NY
614
+ </td>
615
+ </tr>
616
+ <tr
617
+ className="css-0"
618
+ role="row"
619
+ >
620
+ <td
621
+ className="css-0"
622
+ role="gridcell"
623
+ >
624
+ Sonny
625
+ </td>
626
+ <td
627
+ className="css-0"
628
+ role="gridcell"
629
+ >
630
+ Resetti
631
+ </td>
632
+ <td
633
+ className="css-0"
634
+ role="gridcell"
635
+ >
636
+ Risetto san
637
+ </td>
638
+ <td
639
+ className="css-0"
640
+ role="gridcell"
641
+ >
642
+ Village Road
643
+ </td>
644
+ <td
645
+ className="css-0"
646
+ role="gridcell"
647
+ >
648
+ New York
649
+ </td>
650
+ <td
651
+ className="css-0"
652
+ role="gridcell"
653
+ >
654
+ 09873
655
+ </td>
656
+ <td
657
+ className="css-0"
658
+ role="gridcell"
659
+ >
660
+ NY
661
+ </td>
662
+ </tr>
663
+ </tbody>
664
+ </table>
665
+ `;
666
+
667
+ exports[`Table renders the UI snapshot correctly 4`] = `
668
+ <table
669
+ className="chakra-table css-1xdhyk6"
670
+ id="withHeaders"
671
+ role="table"
672
+ >
673
+ <caption
674
+ className="css-18i7bby"
675
+ >
676
+ this is the caption
677
+ </caption>
678
+ <thead
679
+ className="css-0"
680
+ >
681
+ <tr
682
+ className="css-0"
683
+ role="row"
684
+ >
685
+ <th
686
+ className="css-0"
687
+ scope="col"
688
+ >
689
+ First Name
690
+ </th>
691
+ <th
692
+ className="css-0"
693
+ scope="col"
694
+ >
695
+ Last Name
696
+ </th>
697
+ <th
698
+ className="css-0"
699
+ scope="col"
700
+ >
701
+ Nick Name
702
+ </th>
703
+ <th
704
+ className="css-0"
705
+ scope="col"
706
+ >
707
+ Address1
708
+ </th>
709
+ <th
710
+ className="css-0"
711
+ scope="col"
712
+ >
713
+ City
714
+ </th>
715
+ <th
716
+ className="css-0"
717
+ scope="col"
718
+ >
719
+ Zipcode
720
+ </th>
721
+ <th
722
+ className="css-0"
723
+ scope="col"
724
+ >
725
+ State
726
+ </th>
727
+ </tr>
728
+ </thead>
729
+ <tbody
730
+ className="css-0"
731
+ >
732
+ <tr
733
+ className="css-0"
734
+ role="row"
735
+ >
736
+ <th
737
+ className="css-0"
738
+ scope="row"
739
+ >
740
+ Tom
741
+ </th>
742
+ <td
743
+ className="css-0"
744
+ role="gridcell"
745
+ >
746
+ Nook
747
+ </td>
748
+ <td
749
+ className="css-0"
750
+ role="gridcell"
751
+ >
752
+ Tanukichi
753
+ </td>
754
+ <td
755
+ className="css-0"
756
+ role="gridcell"
757
+ >
758
+ Main Street
759
+ </td>
760
+ <td
761
+ className="css-0"
762
+ role="gridcell"
763
+ >
764
+ New York
765
+ </td>
766
+ <td
767
+ className="css-0"
768
+ role="gridcell"
769
+ >
770
+ 23458
771
+ </td>
772
+ <td
773
+ className="css-0"
774
+ role="gridcell"
775
+ >
776
+ NY
777
+ </td>
778
+ </tr>
779
+ <tr
780
+ className="css-0"
781
+ role="row"
782
+ >
783
+ <th
784
+ className="css-0"
785
+ scope="row"
786
+ >
787
+ Isabelle
788
+ </th>
789
+ <td
790
+ className="css-0"
791
+ role="gridcell"
792
+ >
793
+ -
794
+ </td>
795
+ <td
796
+ className="css-0"
797
+ role="gridcell"
798
+ >
799
+ Shizue
800
+ </td>
801
+ <td
802
+ className="css-0"
803
+ role="gridcell"
804
+ >
805
+ Walnut Street
806
+ </td>
807
+ <td
808
+ className="css-0"
809
+ role="gridcell"
810
+ >
811
+ New York
812
+ </td>
813
+ <td
814
+ className="css-0"
815
+ role="gridcell"
816
+ >
817
+ 23458
818
+ </td>
819
+ <td
820
+ className="css-0"
821
+ role="gridcell"
822
+ >
823
+ NY
824
+ </td>
825
+ </tr>
826
+ <tr
827
+ className="css-0"
828
+ role="row"
829
+ >
830
+ <th
831
+ className="css-0"
832
+ scope="row"
833
+ >
834
+ K.K.
835
+ </th>
836
+ <td
837
+ className="css-0"
838
+ role="gridcell"
839
+ >
840
+ Slider
841
+ </td>
842
+ <td
843
+ className="css-0"
844
+ role="gridcell"
845
+ >
846
+ Totakeke
847
+ </td>
848
+ <td
849
+ className="css-0"
850
+ role="gridcell"
851
+ >
852
+ Niper Place
853
+ </td>
854
+ <td
855
+ className="css-0"
856
+ role="gridcell"
857
+ >
858
+ New York
859
+ </td>
860
+ <td
861
+ className="css-0"
862
+ role="gridcell"
863
+ >
864
+ 98765
865
+ </td>
866
+ <td
867
+ className="css-0"
868
+ role="gridcell"
869
+ >
870
+ NY
871
+ </td>
872
+ </tr>
873
+ <tr
874
+ className="css-0"
875
+ role="row"
876
+ >
877
+ <th
878
+ className="css-0"
879
+ scope="row"
880
+ >
881
+ Sonny
882
+ </th>
883
+ <td
884
+ className="css-0"
885
+ role="gridcell"
886
+ >
887
+ Resetti
888
+ </td>
889
+ <td
890
+ className="css-0"
891
+ role="gridcell"
892
+ >
893
+ Risetto san
894
+ </td>
895
+ <td
896
+ className="css-0"
897
+ role="gridcell"
898
+ >
899
+ Village Road
900
+ </td>
901
+ <td
902
+ className="css-0"
903
+ role="gridcell"
904
+ >
905
+ New York
906
+ </td>
907
+ <td
908
+ className="css-0"
909
+ role="gridcell"
910
+ >
911
+ 09873
912
+ </td>
913
+ <td
914
+ className="css-0"
915
+ role="gridcell"
916
+ >
917
+ NY
918
+ </td>
919
+ </tr>
920
+ </tbody>
921
+ </table>
922
+ `;
923
+
924
+ exports[`Table renders the UI snapshot correctly 5`] = `
925
+ <table
926
+ className="chakra-table css-1xdhyk6"
927
+ id="withHeaders"
928
+ role="table"
929
+ >
930
+ <caption
931
+ className="css-18i7bby"
932
+ >
933
+ this is the caption
934
+ </caption>
935
+ <thead
936
+ className="css-0"
937
+ >
938
+ <tr
939
+ className="css-0"
940
+ role="row"
941
+ >
942
+ <th
943
+ className="css-1adspbs"
944
+ scope="col"
945
+ >
946
+ First Name
947
+ </th>
948
+ <th
949
+ className="css-1adspbs"
950
+ scope="col"
951
+ >
952
+ Last Name
953
+ </th>
954
+ <th
955
+ className="css-1adspbs"
956
+ scope="col"
957
+ >
958
+ Nick Name
959
+ </th>
960
+ <th
961
+ className="css-1adspbs"
962
+ scope="col"
963
+ >
964
+ Address1
965
+ </th>
966
+ <th
967
+ className="css-1adspbs"
968
+ scope="col"
969
+ >
970
+ City
971
+ </th>
972
+ <th
973
+ className="css-1adspbs"
974
+ scope="col"
975
+ >
976
+ Zipcode
977
+ </th>
978
+ <th
979
+ className="css-1adspbs"
980
+ scope="col"
981
+ >
982
+ State
983
+ </th>
984
+ </tr>
985
+ </thead>
986
+ <tbody
987
+ className="css-0"
988
+ >
989
+ <tr
990
+ className="css-0"
991
+ role="row"
992
+ >
993
+ <th
994
+ className="css-0"
995
+ scope="row"
996
+ >
997
+ Tom
998
+ </th>
999
+ <td
1000
+ className="css-0"
1001
+ role="gridcell"
1002
+ >
1003
+ Nook
1004
+ </td>
1005
+ <td
1006
+ className="css-0"
1007
+ role="gridcell"
1008
+ >
1009
+ Tanukichi
1010
+ </td>
1011
+ <td
1012
+ className="css-0"
1013
+ role="gridcell"
1014
+ >
1015
+ Main Street
1016
+ </td>
1017
+ <td
1018
+ className="css-0"
1019
+ role="gridcell"
1020
+ >
1021
+ New York
1022
+ </td>
1023
+ <td
1024
+ className="css-0"
1025
+ role="gridcell"
1026
+ >
1027
+ 23458
1028
+ </td>
1029
+ <td
1030
+ className="css-0"
1031
+ role="gridcell"
1032
+ >
1033
+ NY
1034
+ </td>
1035
+ </tr>
1036
+ <tr
1037
+ className="css-0"
1038
+ role="row"
1039
+ >
1040
+ <th
1041
+ className="css-0"
1042
+ scope="row"
1043
+ >
1044
+ Isabelle
1045
+ </th>
1046
+ <td
1047
+ className="css-0"
1048
+ role="gridcell"
1049
+ >
1050
+ -
1051
+ </td>
1052
+ <td
1053
+ className="css-0"
1054
+ role="gridcell"
1055
+ >
1056
+ Shizue
1057
+ </td>
1058
+ <td
1059
+ className="css-0"
1060
+ role="gridcell"
1061
+ >
1062
+ Walnut Street
1063
+ </td>
1064
+ <td
1065
+ className="css-0"
1066
+ role="gridcell"
1067
+ >
1068
+ New York
1069
+ </td>
1070
+ <td
1071
+ className="css-0"
1072
+ role="gridcell"
1073
+ >
1074
+ 23458
1075
+ </td>
1076
+ <td
1077
+ className="css-0"
1078
+ role="gridcell"
1079
+ >
1080
+ NY
1081
+ </td>
1082
+ </tr>
1083
+ <tr
1084
+ className="css-0"
1085
+ role="row"
1086
+ >
1087
+ <th
1088
+ className="css-0"
1089
+ scope="row"
1090
+ >
1091
+ K.K.
1092
+ </th>
1093
+ <td
1094
+ className="css-0"
1095
+ role="gridcell"
1096
+ >
1097
+ Slider
1098
+ </td>
1099
+ <td
1100
+ className="css-0"
1101
+ role="gridcell"
1102
+ >
1103
+ Totakeke
1104
+ </td>
1105
+ <td
1106
+ className="css-0"
1107
+ role="gridcell"
1108
+ >
1109
+ Niper Place
1110
+ </td>
1111
+ <td
1112
+ className="css-0"
1113
+ role="gridcell"
1114
+ >
1115
+ New York
1116
+ </td>
1117
+ <td
1118
+ className="css-0"
1119
+ role="gridcell"
1120
+ >
1121
+ 98765
1122
+ </td>
1123
+ <td
1124
+ className="css-0"
1125
+ role="gridcell"
1126
+ >
1127
+ NY
1128
+ </td>
1129
+ </tr>
1130
+ <tr
1131
+ className="css-0"
1132
+ role="row"
1133
+ >
1134
+ <th
1135
+ className="css-0"
1136
+ scope="row"
1137
+ >
1138
+ Sonny
1139
+ </th>
1140
+ <td
1141
+ className="css-0"
1142
+ role="gridcell"
1143
+ >
1144
+ Resetti
1145
+ </td>
1146
+ <td
1147
+ className="css-0"
1148
+ role="gridcell"
1149
+ >
1150
+ Risetto san
1151
+ </td>
1152
+ <td
1153
+ className="css-0"
1154
+ role="gridcell"
1155
+ >
1156
+ Village Road
1157
+ </td>
1158
+ <td
1159
+ className="css-0"
1160
+ role="gridcell"
1161
+ >
1162
+ New York
1163
+ </td>
1164
+ <td
1165
+ className="css-0"
1166
+ role="gridcell"
1167
+ >
1168
+ 09873
1169
+ </td>
1170
+ <td
1171
+ className="css-0"
1172
+ role="gridcell"
1173
+ >
1174
+ NY
1175
+ </td>
1176
+ </tr>
1177
+ </tbody>
1178
+ </table>
1179
+ `;
1180
+
1181
+ exports[`Table renders the UI snapshot correctly 6`] = `
1182
+ <table
1183
+ className="chakra-table css-kle7zy"
1184
+ id="chakra"
1185
+ role="table"
1186
+ >
1187
+ <tbody
1188
+ className="css-0"
1189
+ >
1190
+ <tr
1191
+ className="css-0"
1192
+ role="row"
1193
+ >
1194
+ <td
1195
+ className="css-0"
1196
+ role="gridcell"
1197
+ >
1198
+ Tom
1199
+ </td>
1200
+ <td
1201
+ className="css-0"
1202
+ role="gridcell"
1203
+ >
1204
+ Nook
1205
+ </td>
1206
+ <td
1207
+ className="css-0"
1208
+ role="gridcell"
1209
+ >
1210
+ Tanukichi
1211
+ </td>
1212
+ <td
1213
+ className="css-0"
1214
+ role="gridcell"
1215
+ >
1216
+ Main Street
1217
+ </td>
1218
+ <td
1219
+ className="css-0"
1220
+ role="gridcell"
1221
+ >
1222
+ New York
1223
+ </td>
1224
+ <td
1225
+ className="css-0"
1226
+ role="gridcell"
1227
+ >
1228
+ 23458
1229
+ </td>
1230
+ <td
1231
+ className="css-0"
1232
+ role="gridcell"
1233
+ >
1234
+ NY
1235
+ </td>
1236
+ </tr>
1237
+ <tr
1238
+ className="css-0"
1239
+ role="row"
1240
+ >
1241
+ <td
1242
+ className="css-0"
1243
+ role="gridcell"
1244
+ >
1245
+ Isabelle
1246
+ </td>
1247
+ <td
1248
+ className="css-0"
1249
+ role="gridcell"
1250
+ >
1251
+ -
1252
+ </td>
1253
+ <td
1254
+ className="css-0"
1255
+ role="gridcell"
1256
+ >
1257
+ Shizue
1258
+ </td>
1259
+ <td
1260
+ className="css-0"
1261
+ role="gridcell"
1262
+ >
1263
+ Walnut Street
1264
+ </td>
1265
+ <td
1266
+ className="css-0"
1267
+ role="gridcell"
1268
+ >
1269
+ New York
1270
+ </td>
1271
+ <td
1272
+ className="css-0"
1273
+ role="gridcell"
1274
+ >
1275
+ 23458
1276
+ </td>
1277
+ <td
1278
+ className="css-0"
1279
+ role="gridcell"
1280
+ >
1281
+ NY
1282
+ </td>
1283
+ </tr>
1284
+ <tr
1285
+ className="css-0"
1286
+ role="row"
1287
+ >
1288
+ <td
1289
+ className="css-0"
1290
+ role="gridcell"
1291
+ >
1292
+ K.K.
1293
+ </td>
1294
+ <td
1295
+ className="css-0"
1296
+ role="gridcell"
1297
+ >
1298
+ Slider
1299
+ </td>
1300
+ <td
1301
+ className="css-0"
1302
+ role="gridcell"
1303
+ >
1304
+ Totakeke
1305
+ </td>
1306
+ <td
1307
+ className="css-0"
1308
+ role="gridcell"
1309
+ >
1310
+ Niper Place
1311
+ </td>
1312
+ <td
1313
+ className="css-0"
1314
+ role="gridcell"
1315
+ >
1316
+ New York
1317
+ </td>
1318
+ <td
1319
+ className="css-0"
1320
+ role="gridcell"
1321
+ >
1322
+ 98765
1323
+ </td>
1324
+ <td
1325
+ className="css-0"
1326
+ role="gridcell"
1327
+ >
1328
+ NY
1329
+ </td>
1330
+ </tr>
1331
+ <tr
1332
+ className="css-0"
1333
+ role="row"
1334
+ >
1335
+ <td
1336
+ className="css-0"
1337
+ role="gridcell"
1338
+ >
1339
+ Sonny
1340
+ </td>
1341
+ <td
1342
+ className="css-0"
1343
+ role="gridcell"
1344
+ >
1345
+ Resetti
1346
+ </td>
1347
+ <td
1348
+ className="css-0"
1349
+ role="gridcell"
1350
+ >
1351
+ Risetto san
1352
+ </td>
1353
+ <td
1354
+ className="css-0"
1355
+ role="gridcell"
1356
+ >
1357
+ Village Road
1358
+ </td>
1359
+ <td
1360
+ className="css-0"
1361
+ role="gridcell"
1362
+ >
1363
+ New York
1364
+ </td>
1365
+ <td
1366
+ className="css-0"
1367
+ role="gridcell"
1368
+ >
1369
+ 09873
1370
+ </td>
1371
+ <td
1372
+ className="css-0"
1373
+ role="gridcell"
1374
+ >
1375
+ NY
1376
+ </td>
1377
+ </tr>
1378
+ </tbody>
1379
+ </table>
1380
+ `;
1381
+
1382
+ exports[`Table renders the UI snapshot correctly 7`] = `
1383
+ <table
1384
+ className="chakra-table css-1xdhyk6"
1385
+ data-testid="props"
1386
+ id="props"
1387
+ role="table"
1388
+ >
1389
+ <tbody
1390
+ className="css-0"
1391
+ >
1392
+ <tr
1393
+ className="css-0"
1394
+ role="row"
1395
+ >
1396
+ <td
1397
+ className="css-0"
1398
+ role="gridcell"
1399
+ >
1400
+ Tom
1401
+ </td>
1402
+ <td
1403
+ className="css-0"
1404
+ role="gridcell"
1405
+ >
1406
+ Nook
1407
+ </td>
1408
+ <td
1409
+ className="css-0"
1410
+ role="gridcell"
1411
+ >
1412
+ Tanukichi
1413
+ </td>
1414
+ <td
1415
+ className="css-0"
1416
+ role="gridcell"
1417
+ >
1418
+ Main Street
1419
+ </td>
1420
+ <td
1421
+ className="css-0"
1422
+ role="gridcell"
1423
+ >
1424
+ New York
1425
+ </td>
1426
+ <td
1427
+ className="css-0"
1428
+ role="gridcell"
1429
+ >
1430
+ 23458
1431
+ </td>
1432
+ <td
1433
+ className="css-0"
1434
+ role="gridcell"
1435
+ >
1436
+ NY
1437
+ </td>
1438
+ </tr>
1439
+ <tr
1440
+ className="css-0"
1441
+ role="row"
1442
+ >
1443
+ <td
1444
+ className="css-0"
1445
+ role="gridcell"
1446
+ >
1447
+ Isabelle
1448
+ </td>
1449
+ <td
1450
+ className="css-0"
1451
+ role="gridcell"
1452
+ >
1453
+ -
1454
+ </td>
1455
+ <td
1456
+ className="css-0"
1457
+ role="gridcell"
1458
+ >
1459
+ Shizue
1460
+ </td>
1461
+ <td
1462
+ className="css-0"
1463
+ role="gridcell"
1464
+ >
1465
+ Walnut Street
1466
+ </td>
1467
+ <td
1468
+ className="css-0"
1469
+ role="gridcell"
1470
+ >
1471
+ New York
1472
+ </td>
1473
+ <td
1474
+ className="css-0"
1475
+ role="gridcell"
1476
+ >
1477
+ 23458
1478
+ </td>
1479
+ <td
1480
+ className="css-0"
1481
+ role="gridcell"
1482
+ >
1483
+ NY
1484
+ </td>
1485
+ </tr>
1486
+ <tr
1487
+ className="css-0"
1488
+ role="row"
1489
+ >
1490
+ <td
1491
+ className="css-0"
1492
+ role="gridcell"
1493
+ >
1494
+ K.K.
1495
+ </td>
1496
+ <td
1497
+ className="css-0"
1498
+ role="gridcell"
1499
+ >
1500
+ Slider
1501
+ </td>
1502
+ <td
1503
+ className="css-0"
1504
+ role="gridcell"
1505
+ >
1506
+ Totakeke
1507
+ </td>
1508
+ <td
1509
+ className="css-0"
1510
+ role="gridcell"
1511
+ >
1512
+ Niper Place
1513
+ </td>
1514
+ <td
1515
+ className="css-0"
1516
+ role="gridcell"
1517
+ >
1518
+ New York
1519
+ </td>
1520
+ <td
1521
+ className="css-0"
1522
+ role="gridcell"
1523
+ >
1524
+ 98765
1525
+ </td>
1526
+ <td
1527
+ className="css-0"
1528
+ role="gridcell"
1529
+ >
1530
+ NY
1531
+ </td>
1532
+ </tr>
1533
+ <tr
1534
+ className="css-0"
1535
+ role="row"
1536
+ >
1537
+ <td
1538
+ className="css-0"
1539
+ role="gridcell"
1540
+ >
1541
+ Sonny
1542
+ </td>
1543
+ <td
1544
+ className="css-0"
1545
+ role="gridcell"
1546
+ >
1547
+ Resetti
1548
+ </td>
1549
+ <td
1550
+ className="css-0"
1551
+ role="gridcell"
1552
+ >
1553
+ Risetto san
1554
+ </td>
1555
+ <td
1556
+ className="css-0"
1557
+ role="gridcell"
1558
+ >
1559
+ Village Road
1560
+ </td>
1561
+ <td
1562
+ className="css-0"
1563
+ role="gridcell"
1564
+ >
1565
+ New York
1566
+ </td>
1567
+ <td
1568
+ className="css-0"
1569
+ role="gridcell"
1570
+ >
1571
+ 09873
1572
+ </td>
1573
+ <td
1574
+ className="css-0"
1575
+ role="gridcell"
1576
+ >
1577
+ NY
1578
+ </td>
1579
+ </tr>
1580
+ </tbody>
1581
+ </table>
1582
+ `;
1583
+
1584
+ exports[`Table renders the UI snapshot correctly 8`] = `
1585
+ <table
1586
+ className="chakra-table css-1xdhyk6"
1587
+ id="jsx-example"
1588
+ role="table"
1589
+ >
1590
+ <thead
1591
+ className="css-0"
1592
+ >
1593
+ <tr
1594
+ className="css-0"
1595
+ role="row"
1596
+ >
1597
+ <th
1598
+ className="css-0"
1599
+ scope="col"
1600
+ >
1601
+ First Name
1602
+ </th>
1603
+ <th
1604
+ className="css-0"
1605
+ scope="col"
1606
+ >
1607
+ Last Name
1608
+ </th>
1609
+ <th
1610
+ className="css-0"
1611
+ scope="col"
1612
+ >
1613
+ Avatar
1614
+ </th>
1615
+ </tr>
1616
+ </thead>
1617
+ <tbody
1618
+ className="css-0"
1619
+ >
1620
+ <tr
1621
+ className="css-0"
1622
+ role="row"
1623
+ >
1624
+ <td
1625
+ className="css-0"
1626
+ role="gridcell"
1627
+ >
1628
+ Tom
1629
+ </td>
1630
+ <td
1631
+ className="css-0"
1632
+ role="gridcell"
1633
+ >
1634
+ Nook
1635
+ </td>
1636
+ <td
1637
+ className="css-0"
1638
+ role="gridcell"
1639
+ >
1640
+ <img
1641
+ alt="Tom Nook"
1642
+ className="css-0"
1643
+ src="https://play.nintendo.com/images/AC_Tom_FRYtwIN.17345b1513ac044897cfc243542899dce541e8dc.9afde10b.png"
1644
+ />
1645
+ </td>
1646
+ </tr>
1647
+ <tr
1648
+ className="css-0"
1649
+ role="row"
1650
+ >
1651
+ <td
1652
+ className="css-0"
1653
+ role="gridcell"
1654
+ >
1655
+ Isabelle
1656
+ </td>
1657
+ <td
1658
+ className="css-0"
1659
+ role="gridcell"
1660
+ >
1661
+ -
1662
+ </td>
1663
+ <td
1664
+ className="css-0"
1665
+ role="gridcell"
1666
+ >
1667
+ <img
1668
+ alt="Isabelle"
1669
+ className="css-0"
1670
+ src="https://play.nintendo.com/images/AC_Isabelle_7XU6aGu.17345b1513ac044897cfc243542899dce541e8dc.9afde10b.png"
1671
+ />
1672
+ </td>
1673
+ </tr>
1674
+ <tr
1675
+ className="css-0"
1676
+ role="row"
1677
+ >
1678
+ <td
1679
+ className="css-0"
1680
+ role="gridcell"
1681
+ >
1682
+ K.K.
1683
+ </td>
1684
+ <td
1685
+ className="css-0"
1686
+ role="gridcell"
1687
+ >
1688
+ Slider
1689
+ </td>
1690
+ <td
1691
+ className="css-0"
1692
+ role="gridcell"
1693
+ >
1694
+ <img
1695
+ alt="K.K Slider"
1696
+ className="css-0"
1697
+ src="https://play.nintendo.com/images/AC_KK_jh4yj5t.17345b1513ac044897cfc243542899dce541e8dc.9afde10b.png"
1698
+ />
1699
+ </td>
1700
+ </tr>
1701
+ </tbody>
1702
+ </table>
1703
+ `;