@digigov/ui 2.0.0-6e3977bc → 2.0.0-834daea4

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 (322) hide show
  1. package/app/Header/__stories__/WithServiceNameAndLogo/index.js +2 -2
  2. package/app/Header/__stories__/WithServiceNameAndLogo.js.map +2 -2
  3. package/app/Loader/index.d.ts +1 -1
  4. package/app/Loader/index.js +1 -1
  5. package/app/Loader/index.js.map +1 -1
  6. package/app/Loader/index.native/index.js +102 -0
  7. package/{api/APIErrors → app/Loader/index.native}/package.json +1 -1
  8. package/app/Loader/index.native.d.ts +3 -0
  9. package/app/Loader/index.native.js.map +7 -0
  10. package/app/Loader/index.web/index.js +2 -0
  11. package/{api/fetchAPI → app/Loader/index.web}/package.json +1 -1
  12. package/app/Loader/index.web.d.ts +1 -0
  13. package/app/Loader/index.web.js.map +7 -0
  14. package/app/Masthead/Masthead.stories/index.js +2 -0
  15. package/app/Masthead/Masthead.stories.d.ts +1 -0
  16. package/app/Masthead/Masthead.stories.js.map +2 -2
  17. package/app/Masthead/__stories__/Secondary/index.js +13 -0
  18. package/app/Masthead/__stories__/Secondary/package.json +6 -0
  19. package/app/Masthead/__stories__/Secondary.d.ts +3 -0
  20. package/app/Masthead/__stories__/Secondary.js.map +7 -0
  21. package/app/Modal/auto/index.js +1 -1
  22. package/app/Modal/auto.js.map +2 -2
  23. package/app/Modal/index.d.ts +2 -2
  24. package/app/Modal/index.js +2 -2
  25. package/app/Modal/index.js.map +1 -1
  26. package/app/Modal/index.native/index.js +20 -0
  27. package/{api → app/Modal/index.native}/package.json +1 -1
  28. package/app/Modal/index.native.d.ts +7 -0
  29. package/app/Modal/index.native.js.map +7 -0
  30. package/app/Modal/{Modal → index.web}/index.js +3 -3
  31. package/{api/APIProvider → app/Modal/index.web}/package.json +1 -1
  32. package/app/Modal/{Modal.js.map → index.web.js.map} +2 -2
  33. package/app/QrCodeScanner/index.js.map +2 -2
  34. package/cjs/app/Header/__stories__/WithServiceNameAndLogo.js.map +3 -3
  35. package/cjs/app/Loader/index.js +3 -3
  36. package/cjs/app/Loader/index.js.map +2 -2
  37. package/cjs/app/Loader/index.native/index.js +135 -0
  38. package/cjs/app/Loader/index.native.js.map +7 -0
  39. package/cjs/app/Loader/index.web/index.js +22 -0
  40. package/cjs/app/Loader/index.web.js.map +7 -0
  41. package/cjs/app/Masthead/Masthead.stories/index.js +3 -0
  42. package/cjs/app/Masthead/Masthead.stories.js.map +2 -2
  43. package/cjs/app/Masthead/__stories__/Secondary/index.js +46 -0
  44. package/cjs/app/Masthead/__stories__/Secondary.js.map +7 -0
  45. package/cjs/app/Modal/auto/index.js +1 -1
  46. package/cjs/app/Modal/auto.js.map +2 -2
  47. package/cjs/app/Modal/index.js +3 -3
  48. package/cjs/app/Modal/index.js.map +2 -2
  49. package/cjs/{api/APIProvider → app/Modal/index.native}/index.js +20 -26
  50. package/cjs/app/Modal/index.native.js.map +7 -0
  51. package/cjs/app/Modal/{Modal → index.web}/index.js +6 -6
  52. package/cjs/app/Modal/{Modal.js.map → index.web.js.map} +2 -2
  53. package/cjs/app/QrCodeScanner/index.js.map +2 -2
  54. package/cjs/content/Table/Table.stories/index.js +3 -3
  55. package/cjs/content/Table/Table.stories.js.map +2 -2
  56. package/cjs/content/Table/__stories__/{Densed → Dense}/index.js +9 -9
  57. package/cjs/content/Table/__stories__/{Densed.js.map → Dense.js.map} +3 -3
  58. package/cjs/feedback/CopyToClipboard/__stories__/Default/index.js +1 -1
  59. package/cjs/feedback/CopyToClipboard/__stories__/Default.js.map +2 -2
  60. package/cjs/form/DateInputContainer/__stories__/MultipleQuestions/index.js +1 -1
  61. package/cjs/form/DateInputContainer/__stories__/MultipleQuestions.js.map +1 -1
  62. package/cjs/form/SearchContainer/SearchContainer.stories/index.js +46 -0
  63. package/cjs/form/SearchContainer/SearchContainer.stories.js.map +7 -0
  64. package/cjs/{api/APIErrors → form/SearchContainer/__stories__/Default}/index.js +12 -42
  65. package/cjs/form/SearchContainer/__stories__/Default.js.map +7 -0
  66. package/cjs/i18n/locales/el/index.js +7 -1
  67. package/cjs/i18n/locales/el.js.map +2 -2
  68. package/cjs/layouts/Basic/Bottom/__stories__/Default/index.js +7 -5
  69. package/cjs/layouts/Basic/Bottom/__stories__/Default.js.map +3 -3
  70. package/cjs/layouts/Basic/Container/__stories__/Default/index.js +6 -4
  71. package/cjs/layouts/Basic/Container/__stories__/Default.js.map +3 -3
  72. package/cjs/layouts/Basic/Main/__stories__/Default/index.js +6 -4
  73. package/cjs/layouts/Basic/Main/__stories__/Default.js.map +3 -3
  74. package/cjs/layouts/Basic/Top/__stories__/Default/index.js +6 -4
  75. package/cjs/layouts/Basic/Top/__stories__/Default.js.map +3 -3
  76. package/cjs/lazy/index.js +3 -7
  77. package/cjs/lazy.js.map +2 -2
  78. package/cjs/navigation/Breadcrumbs/Breadcrumbs.stories.js.map +1 -1
  79. package/cjs/navigation/Drawer/__stories__/Auto/index.js +3 -1
  80. package/cjs/navigation/Drawer/__stories__/Auto.js.map +2 -2
  81. package/cjs/navigation/Drawer/__stories__/Default/index.js +2 -2
  82. package/cjs/navigation/Drawer/__stories__/Default.js.map +3 -3
  83. package/cjs/navigation/NavList/__stories__/UsingNavListAuto/index.js +22 -22
  84. package/cjs/navigation/NavList/__stories__/UsingNavListAuto.js.map +2 -2
  85. package/cjs/navigation/NavList/__stories__/Vertical/index.js +25 -17
  86. package/cjs/navigation/NavList/__stories__/Vertical.js.map +2 -2
  87. package/cjs/navigation/Pagination/__stories__/Auto/index.js +7 -9
  88. package/cjs/navigation/Pagination/__stories__/Auto.js.map +3 -3
  89. package/cjs/registry/index.js +6 -18
  90. package/cjs/registry.js.map +2 -2
  91. package/content/Table/Table.stories/index.js +2 -2
  92. package/content/Table/Table.stories.d.ts +1 -1
  93. package/content/Table/Table.stories.js.map +2 -2
  94. package/content/Table/__stories__/{Densed → Dense}/index.js +5 -5
  95. package/content/Table/__stories__/Dense/package.json +6 -0
  96. package/content/Table/__stories__/Dense.d.ts +3 -0
  97. package/content/Table/__stories__/{Densed.js.map → Dense.js.map} +3 -3
  98. package/feedback/CopyToClipboard/__stories__/Default/index.js +1 -1
  99. package/feedback/CopyToClipboard/__stories__/Default.js.map +2 -2
  100. package/form/DateInputContainer/__stories__/MultipleQuestions/index.js +1 -1
  101. package/form/DateInputContainer/__stories__/MultipleQuestions.js.map +1 -1
  102. package/form/SearchContainer/SearchContainer.stories/index.js +13 -0
  103. package/form/SearchContainer/SearchContainer.stories/package.json +6 -0
  104. package/form/SearchContainer/SearchContainer.stories.d.ts +9 -0
  105. package/form/SearchContainer/SearchContainer.stories.js.map +7 -0
  106. package/form/SearchContainer/__stories__/Default/index.js +11 -0
  107. package/form/SearchContainer/__stories__/Default/package.json +6 -0
  108. package/form/SearchContainer/__stories__/Default.d.ts +3 -0
  109. package/form/SearchContainer/__stories__/Default.js.map +7 -0
  110. package/form/SearchContainer/index.test.d.ts +1 -0
  111. package/i18n/locales/el/index.js +7 -1
  112. package/i18n/locales/el.d.ts +6 -0
  113. package/i18n/locales/el.js.map +2 -2
  114. package/index.js +1 -1
  115. package/layouts/Basic/Bottom/__stories__/Default/index.js +7 -5
  116. package/layouts/Basic/Bottom/__stories__/Default.js.map +2 -2
  117. package/layouts/Basic/Container/__stories__/Default/index.js +6 -4
  118. package/layouts/Basic/Container/__stories__/Default.js.map +2 -2
  119. package/layouts/Basic/Main/__stories__/Default/index.js +6 -4
  120. package/layouts/Basic/Main/__stories__/Default.js.map +2 -2
  121. package/layouts/Basic/Top/__stories__/Default/index.js +6 -4
  122. package/layouts/Basic/Top/__stories__/Default.js.map +2 -2
  123. package/lazy/index.js +3 -7
  124. package/lazy.d.ts +1 -5
  125. package/lazy.js.map +2 -2
  126. package/navigation/Breadcrumbs/Breadcrumbs.stories.js.map +1 -1
  127. package/navigation/Drawer/__stories__/Auto/index.js +3 -1
  128. package/navigation/Drawer/__stories__/Auto.d.ts +1 -0
  129. package/navigation/Drawer/__stories__/Auto.js.map +2 -2
  130. package/navigation/Drawer/__stories__/Default/index.js +1 -1
  131. package/navigation/Drawer/__stories__/Default.js.map +2 -2
  132. package/navigation/NavList/__stories__/UsingNavListAuto/index.js +23 -23
  133. package/navigation/NavList/__stories__/UsingNavListAuto.js.map +2 -2
  134. package/navigation/NavList/__stories__/Vertical/index.js +25 -17
  135. package/navigation/NavList/__stories__/Vertical.js.map +2 -2
  136. package/navigation/Pagination/__stories__/Auto/index.js +8 -12
  137. package/navigation/Pagination/__stories__/Auto.js.map +2 -2
  138. package/package.json +10 -8
  139. package/registry/index.js +6 -18
  140. package/registry.d.ts +4 -9
  141. package/registry.js.map +2 -2
  142. package/src/app/Footer/{index.mdx → doc.mdx} +7 -23
  143. package/src/app/Header/__snapshots__/index.spec.tsx.snap +42 -36
  144. package/src/app/Header/__stories__/WithServiceNameAndLogo.tsx +2 -2
  145. package/src/app/Header/doc.mdx +32 -0
  146. package/src/app/Loader/index.native.tsx +98 -0
  147. package/src/app/Loader/index.tsx +1 -1
  148. package/src/app/Loader/index.web.tsx +1 -0
  149. package/src/app/Masthead/Masthead.stories.js +1 -0
  150. package/src/app/Masthead/__stories__/Secondary.tsx +26 -0
  151. package/src/app/Masthead/{index.mdx → doc.mdx} +13 -1
  152. package/src/app/Masthead/index.test.tsx +4 -0
  153. package/src/app/Modal/auto.tsx +1 -1
  154. package/src/app/Modal/{index.mdx → doc.mdx} +9 -6
  155. package/src/app/Modal/index.native.tsx +17 -0
  156. package/src/app/Modal/index.tsx +2 -2
  157. package/src/app/NotFound/{index.mdx → doc.mdx} +2 -4
  158. package/src/app/Panel/{index.mdx → doc.mdx} +3 -1
  159. package/src/app/PhaseBannerHeader/{index.mdx → doc.mdx} +3 -5
  160. package/src/app/QrCodeScanner/__snapshots__/index.spec.tsx.snap +6 -10
  161. package/src/app/QrCodeScanner/index.tsx +1 -0
  162. package/src/app/QrCodeViewer/{index.mdx → doc.mdx} +4 -12
  163. package/src/app/Skeleton/doc.mdx +42 -0
  164. package/src/content/Accordion/__snapshots__/index.spec.tsx.snap +48 -147
  165. package/src/content/Accordion/{index.mdx → doc.mdx} +2 -13
  166. package/src/content/Blockquote/__snapshots__/index.spec.tsx.snap +6 -9
  167. package/src/content/Blockquote/{index.mdx → doc.mdx} +5 -5
  168. package/src/content/Card/doc.mdx +71 -0
  169. package/src/content/Chip/doc.mdx +34 -0
  170. package/src/content/Details/__snapshots__/index.spec.tsx.snap +32 -69
  171. package/src/content/Details/{index.mdx → doc.mdx} +1 -5
  172. package/src/content/List/__snapshots__/index.spec.tsx.snap +3 -3
  173. package/src/content/List/doc.mdx +28 -0
  174. package/src/content/StepNav/{index.mdx → doc.mdx} +5 -19
  175. package/src/content/SummaryList/__snapshots__/index.spec.tsx.snap +37 -89
  176. package/src/content/SummaryList/{index.mdx → doc.mdx} +6 -18
  177. package/src/content/Table/Table.stories.js +1 -1
  178. package/src/content/Table/__stories__/{Densed.tsx → Dense.tsx} +2 -2
  179. package/src/content/Table/doc.mdx +81 -0
  180. package/src/content/Table/index.test.tsx +3 -3
  181. package/src/content/TaskList/{index.mdx → doc.mdx} +4 -6
  182. package/src/content/Timeline/{index.mdx → doc.mdx} +4 -6
  183. package/src/feedback/CopyToClipboard/__stories__/Default.tsx +1 -1
  184. package/src/feedback/CopyToClipboard/doc.mdx +22 -0
  185. package/src/feedback/ErrorSummary/__snapshots__/index.spec.tsx.snap +3 -3
  186. package/src/feedback/ErrorSummary/{index.mdx → doc.mdx} +6 -22
  187. package/src/feedback/NotificationBanner/__snapshots__/index.spec.tsx.snap +1 -1
  188. package/src/feedback/NotificationBanner/{index.mdx → doc.mdx} +8 -19
  189. package/src/feedback/PhaseBanner/{index.mdx → doc.mdx} +2 -12
  190. package/src/feedback/WarningText/__snapshots__/index.spec.tsx.snap +3 -3
  191. package/src/feedback/WarningText/{index.mdx → doc.mdx} +8 -6
  192. package/src/form/AutoComplete/doc.mdx +50 -0
  193. package/src/form/Button/__snapshots__/index.spec.tsx.snap +6 -10
  194. package/src/form/Button/{index.mdx → doc.mdx} +12 -27
  195. package/src/form/Checkbox/{index.mdx → doc.mdx} +10 -36
  196. package/src/form/DateInputContainer/__stories__/MultipleQuestions.tsx +1 -1
  197. package/src/form/DateInputContainer/{index.mdx → doc.mdx} +7 -21
  198. package/src/form/ErrorMessage/{index.mdx → doc.mdx} +1 -5
  199. package/src/form/FileUpload/{index.mdx → doc.mdx} +2 -10
  200. package/src/form/RadioContainer/{index.mdx → doc.mdx} +10 -36
  201. package/src/form/SearchContainer/SearchContainer.stories.js +9 -0
  202. package/src/form/SearchContainer/__stories__/Default.tsx +13 -0
  203. package/src/form/SearchContainer/doc.mdx +16 -0
  204. package/src/form/SearchContainer/index.test.tsx +20 -0
  205. package/src/form/SelectContainer/{index.mdx → doc.mdx} +3 -19
  206. package/src/form/SingleCharacterInputs/{index.mdx → doc.mdx} +3 -11
  207. package/src/form/TextArea/doc.mdx +48 -0
  208. package/src/form/TextInput/{index.mdx → doc.mdx} +12 -44
  209. package/src/i18n/locales/el.ts +15 -8
  210. package/src/layouts/Basic/Bottom/__stories__/Default.tsx +13 -9
  211. package/src/layouts/Basic/Bottom/{index.mdx → doc.mdx} +1 -5
  212. package/src/layouts/Basic/Container/__stories__/Default.tsx +15 -8
  213. package/src/layouts/Basic/Container/{index.mdx → doc.mdx} +1 -6
  214. package/src/layouts/Basic/Main/__stories__/Default.tsx +15 -8
  215. package/src/layouts/Basic/Main/{index.mdx → doc.mdx} +3 -5
  216. package/src/layouts/Basic/Top/__stories__/Default.tsx +13 -6
  217. package/src/layouts/Basic/Top/doc.mdx +19 -0
  218. package/src/layouts/Basic/__snapshots__/index.spec.tsx.snap +30 -102
  219. package/src/layouts/Basic/{index.mdx → doc.mdx} +7 -18
  220. package/src/layouts/Grid/doc.mdx +26 -0
  221. package/src/layouts/Stack/doc.mdx +38 -0
  222. package/src/lazy.js +4 -8
  223. package/src/navigation/BackLink/{index.mdx → doc.mdx} +1 -5
  224. package/src/navigation/Breadcrumbs/Breadcrumbs.stories.js +0 -1
  225. package/src/navigation/Breadcrumbs/{index.mdx → doc.mdx} +5 -5
  226. package/src/navigation/Drawer/__stories__/Auto.tsx +3 -1
  227. package/src/navigation/Drawer/__stories__/Default.tsx +2 -2
  228. package/src/navigation/Drawer/{index.mdx → doc.mdx} +5 -1
  229. package/src/navigation/Dropdown/{index.mdx → doc.mdx} +3 -15
  230. package/src/navigation/Link/__snapshots__/index.spec.tsx.snap +16 -30
  231. package/src/navigation/Link/{index.mdx → doc.mdx} +7 -19
  232. package/src/navigation/NavList/__snapshots__/index.spec.tsx.snap +3 -3
  233. package/src/navigation/NavList/__stories__/UsingNavListAuto.tsx +26 -27
  234. package/src/navigation/NavList/__stories__/Vertical.tsx +16 -12
  235. package/src/navigation/NavList/{index.mdx → doc.mdx} +19 -22
  236. package/src/navigation/Pagination/__stories__/Auto.tsx +29 -31
  237. package/src/navigation/Pagination/doc.mdx +32 -0
  238. package/src/navigation/Tabs/doc.mdx +47 -0
  239. package/src/registry.js +6 -18
  240. package/src/typography/CodeBlock/doc.mdx +30 -0
  241. package/src/typography/Heading/{index.mdx → doc.mdx} +3 -5
  242. package/src/typography/HeadingCaption/{index.mdx → doc.mdx} +5 -5
  243. package/src/typography/Hint/{index.mdx → doc.mdx} +4 -10
  244. package/src/typography/NormalText/doc.mdx +30 -0
  245. package/src/typography/Paragraph/doc.mdx +34 -0
  246. package/src/typography/Typography/doc.mdx +14 -0
  247. package/src/utils/VisuallyHidden/{index.mdx → doc.mdx} +3 -6
  248. package/api/APIErrors/index.js +0 -40
  249. package/api/APIErrors.d.ts +0 -23
  250. package/api/APIErrors.js.map +0 -7
  251. package/api/APIProvider/index.js +0 -24
  252. package/api/APIProvider.d.ts +0 -16
  253. package/api/APIProvider.js.map +0 -7
  254. package/api/fetchAPI/index.js +0 -29
  255. package/api/fetchAPI.d.ts +0 -14
  256. package/api/fetchAPI.js.map +0 -7
  257. package/api/index.d.ts +0 -8
  258. package/api/index.js +0 -12
  259. package/api/index.js.map +0 -7
  260. package/api/index.spec.d.ts +0 -1
  261. package/api/useResource/index.js +0 -79
  262. package/api/useResource/package.json +0 -6
  263. package/api/useResource.d.ts +0 -11
  264. package/api/useResource.js.map +0 -7
  265. package/api/useResourceAction/index.js +0 -74
  266. package/api/useResourceAction/package.json +0 -6
  267. package/api/useResourceAction.d.ts +0 -2
  268. package/api/useResourceAction.js.map +0 -7
  269. package/api/useResourceQuery/index.js +0 -149
  270. package/api/useResourceQuery/package.json +0 -6
  271. package/api/useResourceQuery.d.ts +0 -18
  272. package/api/useResourceQuery.js.map +0 -7
  273. package/api/utils/index.js +0 -131
  274. package/api/utils/package.json +0 -6
  275. package/api/utils.d.ts +0 -10
  276. package/api/utils.js.map +0 -7
  277. package/app/Modal/Modal/package.json +0 -6
  278. package/cjs/api/APIErrors.js.map +0 -7
  279. package/cjs/api/APIProvider.js.map +0 -7
  280. package/cjs/api/fetchAPI/index.js +0 -49
  281. package/cjs/api/fetchAPI.js.map +0 -7
  282. package/cjs/api/index.js +0 -41
  283. package/cjs/api/index.js.map +0 -7
  284. package/cjs/api/useResource/index.js +0 -102
  285. package/cjs/api/useResource.js.map +0 -7
  286. package/cjs/api/useResourceAction/index.js +0 -97
  287. package/cjs/api/useResourceAction.js.map +0 -7
  288. package/cjs/api/useResourceQuery/index.js +0 -173
  289. package/cjs/api/useResourceQuery.js.map +0 -7
  290. package/cjs/api/utils/index.js +0 -157
  291. package/cjs/api/utils.js.map +0 -7
  292. package/content/Table/__stories__/Densed/package.json +0 -6
  293. package/content/Table/__stories__/Densed.d.ts +0 -3
  294. package/src/api/APIErrors.tsx +0 -46
  295. package/src/api/APIProvider.tsx +0 -31
  296. package/src/api/fetchAPI.ts +0 -43
  297. package/src/api/index.spec.tsx +0 -417
  298. package/src/api/index.tsx +0 -9
  299. package/src/api/introduction.md +0 -6
  300. package/src/api/useResource.tsx +0 -96
  301. package/src/api/useResourceAction.tsx +0 -80
  302. package/src/api/useResourceQuery.tsx +0 -178
  303. package/src/api/utils.tsx +0 -162
  304. package/src/app/Header/index.mdx +0 -49
  305. package/src/content/Card/index.mdx +0 -103
  306. package/src/content/Chip/index.mdx +0 -53
  307. package/src/content/List/index.mdx +0 -40
  308. package/src/content/Table/index.mdx +0 -111
  309. package/src/feedback/CopyToClipboard/index.mdx +0 -28
  310. package/src/form/AutoComplete/index.mdx +0 -70
  311. package/src/form/TextArea/index.mdx +0 -74
  312. package/src/govgr/Footer/index.mdx +0 -101
  313. package/src/layouts/Basic/Top/index.mdx +0 -23
  314. package/src/layouts/Grid/index.mdx +0 -39
  315. package/src/navigation/Pagination/index.mdx +0 -48
  316. package/src/navigation/Tabs/index.mdx +0 -31
  317. package/src/typography/NormalText/index.mdx +0 -44
  318. package/src/typography/Paragraph/index.mdx +0 -32
  319. package/src/typography/Typography/index.mdx +0 -12
  320. /package/app/Modal/{Modal.d.ts → index.web.d.ts} +0 -0
  321. /package/src/app/Modal/{Modal.tsx → index.web.tsx} +0 -0
  322. /package/src/utils/Base/{index.mdx → doc.mdx} +0 -0
package/src/content/Accordion/{index.mdx → doc.mdx} RENAMED
@@ -2,12 +2,9 @@
2
2
  id: accordion
3
3
  title: Accordion
4
4
  ---
5
-
6
5
 
7
6
  # Accordion
8
7
 
9
-
10
-
11
8
  This component is currently experimental because adding a summary line with more than a few short words will likely make the button text too long, particularly for users of screen readers.
12
9
 
13
10
  The accordion component lets users show and hide sections of related content on a page.
@@ -16,21 +13,13 @@ The accordion component lets users show and hide sections of related content on
16
13
 
17
14
  ### Default Accordion
18
15
 
19
- <Story
20
- packageName="@digigov/ui"
21
- component="content/Accordion"
22
- story="Default.tsx"
23
- />
16
+ <code src="@digigov/ui/content/Accordion/__stories__/Default.tsx" />
24
17
 
25
18
  ### Accordion with Hints
26
19
 
27
20
  Accordions hide content, so the labels need to be clear. If necessary, you can add a summary line to help users understand what is in the section.
28
21
 
29
- <Story
30
- packageName="@digigov/ui"
31
- component="content/Accordion"
32
- story="WithHints.tsx"
33
- />
22
+ <code src="@digigov/ui/content/Accordion/__stories__/WithHints.tsx" />
34
23
 
35
24
  ## Accessibility
36
25
 
package/src/content/Blockquote/__snapshots__/index.spec.tsx.snap CHANGED
@@ -1,16 +1,13 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
1
+ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2
2
 
3
3
  exports[`renders the Blockquote with sample data 1`] = `
4
- <ForwardRef(Blockquote)>
5
- <ForwardRef(Base)
6
- as="blockquote"
7
- className="ds-blockquote"
8
- >
4
+ <body>
5
+ <div>
9
6
  <blockquote
10
- className="ds-blockquote"
7
+ class=" ds-blockquote"
11
8
  >
12
9
  this is some random data
13
10
  </blockquote>
14
- </ForwardRef(Base)>
15
- </ForwardRef(Blockquote)>
11
+ </div>
12
+ </body>
16
13
  `;
package/src/content/Blockquote/{index.mdx → doc.mdx} RENAMED
@@ -11,11 +11,11 @@ The Blockquote component lets users show and hide sections of related content on
11
11
 
12
12
  ## How to use
13
13
 
14
- <Story
15
- packageName="@digigov/ui"
16
- component="content/Blockquote"
17
- story="Default.tsx"
18
- />
14
+ <code src="@digigov/ui/content/Blockquote/__stories__/Default.tsx" />
15
+
16
+ ### With dense style
17
+
18
+ <code src="@digigov/ui/content/Blockquote/__stories__/Dense.tsx" />
19
19
 
20
20
  ## API
21
21
 
package/src/content/Card/doc.mdx ADDED
@@ -0,0 +1,71 @@
1
+ ---
2
+ id: card
3
+ title: Card
4
+ ---
5
+
6
+ # Card
7
+
8
+ Cards can be used to divide and organize interface content for better understandability and readability.
9
+ When used correctly, Cards can help users to scan through vast amounts of information quicker.
10
+
11
+ ## How to use
12
+
13
+ <code src="@digigov/ui/content/Card/__stories__/Default.tsx" />
14
+
15
+ #### Card with gray border color
16
+
17
+ <code src="@digigov/ui/content/Card/__stories__/WithGrayBorder.tsx" />
18
+
19
+ #### Card with dark border color
20
+
21
+ <code src="@digigov/ui/content/Card/__stories__/WithDarkBorder.tsx" />
22
+
23
+ ### Card with top border
24
+
25
+ You can set the color of the Card's top border. You can choose between dark and grey color respectively. By default the top border color is grey.
26
+
27
+ <code src="@digigov/ui/content/Card/__stories__/WithDarkBorder.tsx" />
28
+
29
+ #### Card with grey top border
30
+
31
+ <code src="@digigov/ui/content/Card/__stories__/WithGrayTopBorder.tsx" />
32
+
33
+ #### Card with dark top border
34
+
35
+ <code src="@digigov/ui/content/Card/__stories__/WithDarkTopBorder.tsx" />
36
+
37
+ ### Card with divider
38
+
39
+ <code src="@digigov/ui/content/Card/__stories__/WithDivider.tsx" />
40
+
41
+ ### Card with actions
42
+
43
+ <code src="@digigov/ui/content/Card/__stories__/WithGroupButton.tsx" />
44
+
45
+ #### Card with title link
46
+
47
+ Cards can be used without an action button, but with a clickable title.
48
+
49
+ <code src="@digigov/ui/content/Card/__stories__/WithLink.tsx" />
50
+
51
+ #### Card with clickable content
52
+
53
+ You can expand the clickable area of the link to fill Card's content.
54
+
55
+ <code src="@digigov/ui/content/Card/__stories__/WithClickableContent.tsx" />
56
+
57
+ #### Card with button or link
58
+
59
+ Cards also provides styles for actionable elements such as Buttons or Links.
60
+
61
+ <code src="@digigov/ui/content/Card/__stories__/WithClickableLink.tsx" />
62
+
63
+ #### Card with a group of actions
64
+
65
+ <code src="@digigov/ui/content/Card/__stories__/WithGroupButton.tsx" />
66
+
67
+ ## API
68
+
69
+ See below for a complete reference to all of the props available to the components mentioned here.
70
+
71
+ <ComponentProps componentName={["Card", "CardHeading", "CardContent", "CardAction"]} />
package/src/content/Chip/doc.mdx ADDED
@@ -0,0 +1,34 @@
1
+ ---
2
+ id: chip
3
+ title: Chip
4
+ ---
5
+
6
+ # Chip
7
+
8
+ The Chip component can be used to represent small blocks of information.
9
+
10
+ ## How to use
11
+
12
+ <code src="@digigov/ui/content/Chip/__stories__/Default.tsx" />
13
+
14
+ ### ClickableChip
15
+
16
+ <code src="@digigov/ui/content/Chip/__stories__/ClickableChip.tsx" />
17
+
18
+ ### ClickableDeletableChip
19
+
20
+ <code src="@digigov/ui/content/Chip/__stories__/ClickableDeletableChip.tsx" />
21
+
22
+ ### DeletableChip
23
+
24
+ <code src="@digigov/ui/content/Chip/__stories__/DeletableChip.tsx" />
25
+
26
+ ### GroupOfChips
27
+
28
+ <code src="@digigov/ui/content/Chip/__stories__/GroupOfChips.tsx" />
29
+
30
+ ## API
31
+
32
+ See below for a complete reference to all of the props available to the components mentioned here.
33
+
34
+ <ComponentProps componentName={["Chip", "ChipContainer", "ChipHeading", "ChipKeyValue"]} />
package/src/content/Details/__snapshots__/index.spec.tsx.snap CHANGED
@@ -1,81 +1,44 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
1
+ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2
2
 
3
3
  exports[`renders the closed Details component 1`] = `
4
- <ForwardRef(Details)>
5
- <ForwardRef(Base)
6
- as="details"
7
- className="ds-details"
8
- >
4
+ <body>
5
+ <div>
9
6
  <details
10
- className="ds-details"
7
+ class=" ds-details"
11
8
  >
12
- <ForwardRef(DetailsSummary)>
13
- <ForwardRef(Base)
14
- as="summary"
15
- className="ds-details__summary"
16
- >
17
- <summary
18
- className="ds-details__summary"
19
- >
20
- Help with nationality
21
- </summary>
22
- </ForwardRef(Base)>
23
- </ForwardRef(DetailsSummary)>
24
- <ForwardRef(DetailsContent)>
25
- <ForwardRef(Base)
26
- as="div"
27
- className="ds-details__content"
28
- >
29
- <div
30
- className="ds-details__content"
31
- >
32
- We need to know your nationality so we can work out which elections you’re entitled to vote in. If you cannot provide your nationality, you’ll have to send copies of identity documents through the post.
33
- </div>
34
- </ForwardRef(Base)>
35
- </ForwardRef(DetailsContent)>
9
+ <summary
10
+ class=" ds-details__summary"
11
+ >
12
+ Help with nationality
13
+ </summary>
14
+ <div
15
+ class=" ds-details__content"
16
+ >
17
+ We need to know your nationality so we can work out which elections you’re entitled to vote in. If you cannot provide your nationality, you’ll have to send copies of identity documents through the post.
18
+ </div>
36
19
  </details>
37
- </ForwardRef(Base)>
38
- </ForwardRef(Details)>
20
+ </div>
21
+ </body>
39
22
  `;
40
23
 
41
24
  exports[`renders the open Details component 1`] = `
42
- <ForwardRef(Details)
43
- open={true}
44
- >
45
- <ForwardRef(Base)
46
- as="details"
47
- className="ds-details"
48
- open={true}
49
- >
25
+ <body>
26
+ <div>
50
27
  <details
51
- className="ds-details"
52
- open={true}
28
+ class=" ds-details"
29
+ open=""
53
30
  >
54
- <ForwardRef(DetailsSummary)>
55
- <ForwardRef(Base)
56
- as="summary"
57
- className="ds-details__summary"
58
- >
59
- <summary
60
- className="ds-details__summary"
61
- >
62
- Help with nationality
63
- </summary>
64
- </ForwardRef(Base)>
65
- </ForwardRef(DetailsSummary)>
66
- <ForwardRef(DetailsContent)>
67
- <ForwardRef(Base)
68
- as="div"
69
- className="ds-details__content"
70
- >
71
- <div
72
- className="ds-details__content"
73
- >
74
- We need to know your nationality so we can work out which elections you’re entitled to vote in. If you cannot provide your nationality, you’ll have to send copies of identity documents through the post.
75
- </div>
76
- </ForwardRef(Base)>
77
- </ForwardRef(DetailsContent)>
31
+ <summary
32
+ class=" ds-details__summary"
33
+ >
34
+ Help with nationality
35
+ </summary>
36
+ <div
37
+ class=" ds-details__content"
38
+ >
39
+ We need to know your nationality so we can work out which elections you’re entitled to vote in. If you cannot provide your nationality, you’ll have to send copies of identity documents through the post.
40
+ </div>
78
41
  </details>
79
- </ForwardRef(Base)>
80
- </ForwardRef(Details)>
42
+ </div>
43
+ </body>
81
44
  `;
package/src/content/Details/{index.mdx → doc.mdx} RENAMED
@@ -9,11 +9,7 @@ The details component is a short link that shows more detailed help text when a
9
9
 
10
10
  ## How to use
11
11
 
12
- <Story
13
- packageName="@digigov/ui"
14
- component="content/Details"
15
- story="Default.tsx"
16
- />
12
+ <code src="@digigov/ui/content/Details/__stories__/Default.tsx" />
17
13
 
18
14
  ## Accessibility
19
15
 
package/src/content/List/__snapshots__/index.spec.tsx.snap CHANGED
@@ -1,7 +1,7 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
1
+ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2
2
 
3
3
  exports[`renders the ErrorSummary with sample data 1`] = `
4
- <ForwardRef(List)>
4
+ <ForwardRef(List2)>
5
5
  this is some random warning text
6
- </ForwardRef(List)>
6
+ </ForwardRef(List2)>
7
7
  `;
package/src/content/List/doc.mdx ADDED
@@ -0,0 +1,28 @@
1
+ ---
2
+ id: list
3
+ title: List
4
+ ---
5
+
6
+ # List
7
+
8
+ ## How to use
9
+
10
+ <code src="@digigov/ui/content/List/__stories__/Default.tsx" />
11
+
12
+ ### List with bullets
13
+
14
+ <code src="@digigov/ui/content/List/__stories__/BulletList.tsx" />
15
+
16
+ ### List with numbers
17
+
18
+ <code src="@digigov/ui/content/List/__stories__/NumberedList.tsx" />
19
+
20
+ ### List with extra space
21
+
22
+ <code src="@digigov/ui/content/List/__stories__/WithExtraSpace.tsx" />
23
+
24
+ ## API
25
+
26
+ See below for a complete reference to all of the props available to the components mentioned here.
27
+
28
+ <ComponentProps componentName={["List", "ListItem"]} />
package/src/content/StepNav/{index.mdx → doc.mdx} RENAMED
@@ -9,29 +9,15 @@ StepNav is a component that displays number of steps required to complete a proc
9
9
 
10
10
  ## How to use
11
11
 
12
- ### Default
12
+ <code src="@digigov/ui/content/StepNav/__stories__/Default.tsx" />
13
13
 
14
- <Story
15
- packageName="@digigov/ui"
16
- component="content/StepNav"
17
- story="Default.tsx"
18
- />
14
+ ### With hints
19
15
 
20
- ### StepNav with hints
16
+ <code src="@digigov/ui/content/StepNav/__stories__/WithHints.tsx" />
21
17
 
22
- <Story
23
- packageName="@digigov/ui"
24
- component="content/StepNav"
25
- story="WithHints.tsx"
26
- />
18
+ ### With dense style
27
19
 
28
- ### StepNav with dense
29
-
30
- <Story
31
- packageName="@digigov/ui"
32
- component="content/StepNav"
33
- story="Dense.tsx"
34
- />
20
+ <code src="@digigov/ui/content/StepNav/__stories__/Dense.tsx" />
35
21
 
36
22
  ## API
37
23
 
package/src/content/SummaryList/__snapshots__/index.spec.tsx.snap CHANGED
@@ -1,97 +1,45 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
1
+ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2
2
 
3
3
  exports[`renders the SummaryList with sample data 1`] = `
4
- <ForwardRef(SummaryList)>
5
- <ForwardRef(Base)
6
- as="dl"
7
- className="ds-summary-list"
8
- >
4
+ <body>
5
+ <div>
9
6
  <dl
10
- className="ds-summary-list"
7
+ class=" ds-summary-list"
11
8
  >
12
- <ForwardRef(SummaryListItem)>
13
- <ForwardRef(Base)
14
- as="div"
15
- className="ds-summary-list__row"
9
+ <div
10
+ class=" ds-summary-list__row"
11
+ >
12
+ <dt
13
+ class=" ds-summary-list__key ds-summary-list__key--sm-3"
16
14
  >
17
- <div
18
- className="ds-summary-list__row"
19
- >
20
- <ForwardRef(SummaryListItemKey)>
21
- <ForwardRef(Base)
22
- as="dt"
23
- className="ds-summary-list__key"
24
- >
25
- <dt
26
- className="ds-summary-list__key"
27
- >
28
- Όνομα
29
- </dt>
30
- </ForwardRef(Base)>
31
- </ForwardRef(SummaryListItemKey)>
32
- <ForwardRef(SummaryListItemValue)>
33
- <ForwardRef(Base)
34
- as="dd"
35
- className="ds-summary-list__value"
36
- >
37
- <dd
38
- className="ds-summary-list__value"
39
- >
40
- Μάριος
41
- </dd>
42
- </ForwardRef(Base)>
43
- </ForwardRef(SummaryListItemValue)>
44
- <ForwardRef(SummaryListItemAction)>
45
- <ForwardRef(Base)
46
- as="dd"
47
- className="ds-summary-list__actions"
48
- >
49
- <dd
50
- className="ds-summary-list__actions"
51
- >
52
- Αλλαγή
53
- </dd>
54
- </ForwardRef(Base)>
55
- </ForwardRef(SummaryListItemAction)>
56
- </div>
57
- </ForwardRef(Base)>
58
- </ForwardRef(SummaryListItem)>
59
- <ForwardRef(SummaryListItem)>
60
- <ForwardRef(Base)
61
- as="div"
62
- className="ds-summary-list__row"
15
+ Όνομα
16
+ </dt>
17
+ <dd
18
+ class=" ds-summary-list__value"
63
19
  >
64
- <div
65
- className="ds-summary-list__row"
66
- >
67
- <ForwardRef(SummaryListItemKey)>
68
- <ForwardRef(Base)
69
- as="dt"
70
- className="ds-summary-list__key"
71
- >
72
- <dt
73
- className="ds-summary-list__key"
74
- >
75
- Επώνυμο
76
- </dt>
77
- </ForwardRef(Base)>
78
- </ForwardRef(SummaryListItemKey)>
79
- <ForwardRef(SummaryListItemValue)>
80
- <ForwardRef(Base)
81
- as="dd"
82
- className="ds-summary-list__value"
83
- >
84
- <dd
85
- className="ds-summary-list__value"
86
- >
87
- Μενεξές
88
- </dd>
89
- </ForwardRef(Base)>
90
- </ForwardRef(SummaryListItemValue)>
91
- </div>
92
- </ForwardRef(Base)>
93
- </ForwardRef(SummaryListItem)>
20
+ Μάριος
21
+ </dd>
22
+ <dd
23
+ class=" ds-summary-list__actions"
24
+ >
25
+ Αλλαγή
26
+ </dd>
27
+ </div>
28
+ <div
29
+ class=" ds-summary-list__row"
30
+ >
31
+ <dt
32
+ class=" ds-summary-list__key ds-summary-list__key--sm-3"
33
+ >
34
+ Επώνυμο
35
+ </dt>
36
+ <dd
37
+ class=" ds-summary-list__value"
38
+ >
39
+ Μενεξές
40
+ </dd>
41
+ </div>
94
42
  </dl>
95
- </ForwardRef(Base)>
96
- </ForwardRef(SummaryList)>
43
+ </div>
44
+ </body>
97
45
  `;
package/src/content/SummaryList/{index.mdx → doc.mdx} RENAMED
@@ -5,37 +5,25 @@ title: SummaryList
5
5
 
6
6
  # SummaryList
7
7
 
8
- Use the summary list to summarise information, for example, a user’s responses at the end of a form.
8
+ Use the summary list to summarize information, for example, a user’s responses at the end of a form.
9
9
 
10
10
  ## How to use
11
11
 
12
- <Story
13
- packageName="@digigov/ui"
14
- component="content/SummaryList"
15
- story="Default.tsx"
16
- />
12
+ <code src="@digigov/ui/content/SummaryList/__stories__/Default.tsx" />
17
13
 
18
- ### Summary list with actions
14
+ ### With actions
19
15
 
20
16
  Assistive technology users, like those who use a screen reader, may hear the links out of context and not know what they do.
21
17
  To give more context, add visually hidden text to the links.
22
18
  This means a screen reader user will hear a meaningful action, like ‘Αλλαγή ονόματος’ or ‘Αλλαγή ημερομηνίας γέννησης’.
23
19
 
24
- <Story
25
- packageName="@digigov/ui"
26
- component="content/SummaryList"
27
- story="WithActions.tsx"
28
- />
20
+ <code src="@digigov/ui/content/SummaryList/__stories__/WithActions.tsx" />
29
21
 
30
- ### Summary list without borders
22
+ ### Without borders
31
23
 
32
24
  If you do not include actions in your summary list and it would be better for your design to remove the separating borders, use the `border={false}` prop.
33
25
 
34
- <Story
35
- packageName="@digigov/ui"
36
- component="content/SummaryList"
37
- story="WithoutBorders.tsx"
38
- />
26
+ <code src="@digigov/ui/content/SummaryList/__stories__/WithoutBorders.tsx" />
39
27
 
40
28
  ## API
41
29
 
package/src/content/Table/Table.stories.js CHANGED
@@ -19,7 +19,7 @@ export { DarkVariant } from '@digigov/ui/content/Table/__stories__/DarkVariant';
19
19
  export { DarkVariantWithVerticalHeaders } from '@digigov/ui/content/Table/__stories__/DarkVariantWithVerticalHeaders';
20
20
  export { WithLoader } from '@digigov/ui/content/Table/__stories__/WithLoader';
21
21
  export { DefinedWidth } from '@digigov/ui/content/Table/__stories__/DefinedWidth';
22
- export { Densed } from '@digigov/ui/content/Table/__stories__/Densed';
22
+ export { Dense } from '@digigov/ui/content/Table/__stories__/Dense';
23
23
  export { RowColors } from '@digigov/ui/content/Table/__stories__/RowColors';
24
24
  export { MultipleProps } from '@digigov/ui/content/Table/__stories__/MultipleProps';
25
25
  export { WithSortFilters } from '@digigov/ui/content/Table/__stories__/WithSortFilters';
package/src/content/Table/__stories__/{Densed.tsx → Dense.tsx} RENAMED
@@ -98,7 +98,7 @@ const data = [
98
98
  },
99
99
  ];
100
100
 
101
- export const Densed = () => {
101
+ export const Dense = () => {
102
102
  return (
103
103
  <TableContainer border>
104
104
  <Table dense>
@@ -126,4 +126,4 @@ export const Densed = () => {
126
126
  </TableContainer>
127
127
  );
128
128
  };
129
- export default Densed;
129
+ export default Dense;