@cruk/cruk-react-components 4.2.2 → 5.0.1

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 (592) hide show
  1. package/README.md +49 -17
  2. package/lib/components/AddressLookup/AddressLookup.stories.d.ts +1 -15
  3. package/lib/components/AddressLookup/index.d.ts +3 -30
  4. package/lib/components/AddressLookup/styles.d.ts +13 -9
  5. package/lib/components/AllThemesWrapper.d.ts +2 -2
  6. package/lib/components/Avatar/Avatar.stories.d.ts +2 -3
  7. package/lib/components/Avatar/index.d.ts +2 -2
  8. package/lib/components/Avatar/styles.d.ts +3 -3
  9. package/lib/components/Badge/Badge.stories.d.ts +2 -3
  10. package/lib/components/Badge/index.d.ts +4 -4
  11. package/lib/components/Badge/styles.d.ts +7 -7
  12. package/lib/components/Box/Box.stories.d.ts +1 -1
  13. package/lib/components/Box/index.d.ts +7 -6
  14. package/lib/components/Box/styles.d.ts +7 -6
  15. package/lib/components/Button/Button.stories.d.ts +1 -11
  16. package/lib/components/Button/index.d.ts +5 -23
  17. package/lib/components/Button/styles.d.ts +9 -9
  18. package/lib/components/Carousel/Dots.d.ts +1 -1
  19. package/lib/components/Carousel/index.d.ts +1 -1
  20. package/lib/components/Carousel/styles.d.ts +23 -21
  21. package/lib/components/Checkbox/Checkbox.stories.d.ts +2 -7
  22. package/lib/components/Checkbox/index.d.ts +3 -10
  23. package/lib/components/Checkbox/styles.d.ts +7 -7
  24. package/lib/components/Collapse/Collapse.stories.d.ts +1 -1
  25. package/lib/components/Collapse/index.d.ts +3 -3
  26. package/lib/components/Collapse/styles.d.ts +18 -24
  27. package/lib/components/DateField/DateField.stories.d.ts +1 -2
  28. package/lib/components/DateField/index.d.ts +2 -2
  29. package/lib/components/DateField/styles.d.ts +10 -6
  30. package/lib/components/Divider.d.ts +1 -1
  31. package/lib/components/ErrorText/ErrorText.stories.d.ts +1 -2
  32. package/lib/components/ErrorText/index.d.ts +3 -3
  33. package/lib/components/ErrorText/styles.d.ts +4 -2
  34. package/lib/components/Flex.d.ts +7 -2
  35. package/lib/components/Fontface.d.ts +4 -2
  36. package/lib/components/Footer/Footer.stories.d.ts +1 -1
  37. package/lib/components/Footer/index.d.ts +2 -2
  38. package/lib/components/Footer/styles.d.ts +18 -12
  39. package/lib/components/GlobalStyle.d.ts +2 -8
  40. package/lib/components/GlobalStyleNoFontFace.d.ts +2 -8
  41. package/lib/components/Header/Header.stories.d.ts +2 -2
  42. package/lib/components/Header/index.d.ts +2 -2
  43. package/lib/components/Header/styles.d.ts +31 -35
  44. package/lib/components/Heading/Heading.stories.d.ts +1 -2
  45. package/lib/components/Heading/index.d.ts +6 -6
  46. package/lib/components/Heading/styles.d.ts +16 -49
  47. package/lib/components/IconFa/IconFa.stories.d.ts +1 -2
  48. package/lib/components/IconFa/index.d.ts +2 -2
  49. package/lib/components/IconFa/styles.d.ts +7 -4
  50. package/lib/components/InfoBox/InfoBox.stories.d.ts +1 -1
  51. package/lib/components/InfoBox/index.d.ts +3 -3
  52. package/lib/components/InfoBox/styles.d.ts +8 -11
  53. package/lib/components/LabelWrapper/index.d.ts +2 -7
  54. package/lib/components/LabelWrapper/styles.d.ts +9 -7
  55. package/lib/components/LegendWrapper/LegendWrapper.stories.d.ts +2 -3
  56. package/lib/components/LegendWrapper/index.d.ts +2 -2
  57. package/lib/components/LegendWrapper/styles.d.ts +7 -7
  58. package/lib/components/Link/Link.stories.d.ts +1 -7
  59. package/lib/components/Link/index.d.ts +3 -14
  60. package/lib/components/Link/styles.d.ts +10 -17
  61. package/lib/components/Loader/Loader.stories.d.ts +1 -2
  62. package/lib/components/Loader/index.d.ts +1 -1
  63. package/lib/components/Loader/styles.d.ts +3 -3
  64. package/lib/components/Modal/Modal.stories.d.ts +2 -3
  65. package/lib/components/Modal/index.d.ts +3 -3
  66. package/lib/components/Modal/styles.d.ts +17 -24
  67. package/lib/components/Pagination/Pagination.stories.d.ts +1 -2
  68. package/lib/components/Pagination/index.d.ts +2 -2
  69. package/lib/components/Pagination/styles.d.ts +9 -11
  70. package/lib/components/PopOver/Popover.stories.d.ts +2 -2
  71. package/lib/components/PopOver/index.d.ts +3 -3
  72. package/lib/components/PopOver/styles.d.ts +11 -11
  73. package/lib/components/ProgressBar/ProgressBar.stories.d.ts +1 -2
  74. package/lib/components/ProgressBar/index.d.ts +2 -2
  75. package/lib/components/ProgressBar/styles.d.ts +31 -29
  76. package/lib/components/Radio/Radio.stories.d.ts +2 -7
  77. package/lib/components/Radio/index.d.ts +3 -10
  78. package/lib/components/Radio/styles.d.ts +15 -15
  79. package/lib/components/RadioConsent/Radio.stories.d.ts +2 -3
  80. package/lib/components/RadioConsent/index.d.ts +7 -6
  81. package/lib/components/RadioConsent/styles.d.ts +12 -12
  82. package/lib/components/Select/Selelct.stories.d.ts +1 -1
  83. package/lib/components/Select/index.d.ts +3 -3
  84. package/lib/components/Select/styles.d.ts +4 -4
  85. package/lib/components/Spacing/index.d.ts +52 -3
  86. package/lib/components/Step/Step.stories.d.ts +1 -2
  87. package/lib/components/Step/index.d.ts +2 -2
  88. package/lib/components/Step/styles.d.ts +15 -16
  89. package/lib/components/Text/Text.stories.d.ts +1 -1
  90. package/lib/components/Text/index.d.ts +5 -5
  91. package/lib/components/Text/styles.d.ts +12 -22
  92. package/lib/components/TextAreaField/TextAreaField.stories.d.ts +2 -4
  93. package/lib/components/TextAreaField/index.d.ts +3 -3
  94. package/lib/components/TextAreaField/styles.d.ts +4 -4
  95. package/lib/components/TextField/TextField.stories.d.ts +1 -1
  96. package/lib/components/TextField/index.d.ts +2 -2
  97. package/lib/components/TextField/styles.d.ts +15 -11
  98. package/lib/components/ThemeCheatSheet.d.ts +6 -5
  99. package/lib/components/Totaliser/Totaliser.stories.d.ts +1 -2
  100. package/lib/components/Totaliser/index.d.ts +3 -3
  101. package/lib/components/Totaliser/styles.d.ts +26 -18
  102. package/lib/components/UserBlock/UserBlock.stories.d.ts +1 -2
  103. package/lib/components/UserBlock/index.d.ts +2 -2
  104. package/lib/components/UserBlock/styles.d.ts +5 -5
  105. package/lib/components/index.d.ts +41 -41
  106. package/lib/hooks/useEffectBrowser.d.ts +1 -1
  107. package/lib/hooks/useKey.d.ts +3 -3
  108. package/lib/hooks/useLayoutEffectBrowser.d.ts +1 -1
  109. package/lib/hooks/useScrollPosition.d.ts +1 -1
  110. package/lib/node_modules/@babel/runtime/helpers/esm/defineProperty.js.map +1 -0
  111. package/lib/node_modules/@babel/runtime/helpers/esm/extends.js +2 -0
  112. package/lib/node_modules/@babel/runtime/helpers/esm/extends.js.map +1 -0
  113. package/lib/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js.map +1 -0
  114. package/lib/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js +2 -0
  115. package/lib/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js.map +1 -0
  116. package/lib/node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js.map +1 -0
  117. package/lib/node_modules/@babel/runtime/helpers/esm/toPrimitive.js +2 -0
  118. package/lib/node_modules/@babel/runtime/helpers/esm/toPrimitive.js.map +1 -0
  119. package/lib/{es/node_modules → node_modules}/@babel/runtime/helpers/esm/toPropertyKey.js +1 -1
  120. package/lib/node_modules/@babel/runtime/helpers/esm/toPropertyKey.js.map +1 -0
  121. package/lib/node_modules/@babel/runtime/helpers/esm/typeof.js.map +1 -0
  122. package/lib/{es/node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js → node_modules/@fortawesome/free-solid-svg-icons/index.js} +1 -1
  123. package/lib/node_modules/@fortawesome/free-solid-svg-icons/index.js.map +1 -0
  124. package/lib/node_modules/focus-lock/dist/es2015/commands.js +2 -0
  125. package/lib/node_modules/focus-lock/dist/es2015/commands.js.map +1 -0
  126. package/lib/node_modules/focus-lock/dist/es2015/constants.js.map +1 -0
  127. package/lib/node_modules/focus-lock/dist/es2015/focusInside.js.map +1 -0
  128. package/lib/node_modules/focus-lock/dist/es2015/focusIsHidden.js.map +1 -0
  129. package/lib/node_modules/focus-lock/dist/es2015/focusSolver.js +2 -0
  130. package/lib/node_modules/focus-lock/dist/es2015/focusSolver.js.map +1 -0
  131. package/lib/node_modules/focus-lock/dist/es2015/focusables.js +2 -0
  132. package/lib/node_modules/focus-lock/dist/es2015/focusables.js.map +1 -0
  133. package/lib/node_modules/focus-lock/dist/es2015/moveFocusInside.js.map +1 -0
  134. package/lib/node_modules/focus-lock/dist/es2015/return-focus.js +2 -0
  135. package/lib/node_modules/focus-lock/dist/es2015/return-focus.js.map +1 -0
  136. package/lib/node_modules/focus-lock/dist/es2015/sibling.js +2 -0
  137. package/lib/node_modules/focus-lock/dist/es2015/sibling.js.map +1 -0
  138. package/lib/node_modules/focus-lock/dist/es2015/solver.js +2 -0
  139. package/lib/node_modules/focus-lock/dist/es2015/solver.js.map +1 -0
  140. package/lib/node_modules/focus-lock/dist/es2015/utils/DOMutils.js.map +1 -0
  141. package/lib/node_modules/focus-lock/dist/es2015/utils/all-affected.js.map +1 -0
  142. package/lib/node_modules/focus-lock/dist/es2015/utils/array.js.map +1 -0
  143. package/lib/node_modules/focus-lock/dist/es2015/utils/auto-focus.js.map +1 -0
  144. package/lib/node_modules/focus-lock/dist/es2015/utils/correctFocus.js.map +1 -0
  145. package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/firstFocus.js +1 -1
  146. package/lib/node_modules/focus-lock/dist/es2015/utils/firstFocus.js.map +1 -0
  147. package/lib/node_modules/focus-lock/dist/es2015/utils/getActiveElement.js.map +1 -0
  148. package/lib/node_modules/focus-lock/dist/es2015/utils/is.js +2 -0
  149. package/lib/node_modules/focus-lock/dist/es2015/utils/is.js.map +1 -0
  150. package/lib/node_modules/focus-lock/dist/es2015/utils/parenting.js.map +1 -0
  151. package/lib/node_modules/focus-lock/dist/es2015/utils/safe.js.map +1 -0
  152. package/lib/node_modules/focus-lock/dist/es2015/utils/tabOrder.js +2 -0
  153. package/lib/node_modules/focus-lock/dist/es2015/utils/tabOrder.js.map +1 -0
  154. package/lib/node_modules/focus-lock/dist/es2015/utils/tabUtils.js.map +1 -0
  155. package/lib/node_modules/focus-lock/dist/es2015/utils/tabbables.js.map +1 -0
  156. package/lib/node_modules/react-clientside-effect/lib/index.es.js.map +1 -0
  157. package/lib/{es/node_modules → node_modules}/react-focus-lock/dist/es2015/Combination.js +1 -1
  158. package/lib/node_modules/react-focus-lock/dist/es2015/Combination.js.map +1 -0
  159. package/lib/node_modules/react-focus-lock/dist/es2015/FocusGuard.js.map +1 -0
  160. package/lib/node_modules/react-focus-lock/dist/es2015/Lock.js +2 -0
  161. package/lib/node_modules/react-focus-lock/dist/es2015/Lock.js.map +1 -0
  162. package/lib/node_modules/react-focus-lock/dist/es2015/Trap.js +2 -0
  163. package/lib/node_modules/react-focus-lock/dist/es2015/Trap.js.map +1 -0
  164. package/lib/node_modules/react-focus-lock/dist/es2015/index.js +2 -0
  165. package/lib/node_modules/react-focus-lock/dist/es2015/medium.js +2 -0
  166. package/lib/node_modules/react-focus-lock/dist/es2015/medium.js.map +1 -0
  167. package/lib/node_modules/react-focus-lock/dist/es2015/scope.js +2 -0
  168. package/lib/node_modules/react-focus-lock/dist/es2015/scope.js.map +1 -0
  169. package/lib/node_modules/react-focus-lock/dist/es2015/util.js +2 -0
  170. package/lib/node_modules/react-focus-lock/dist/es2015/util.js.map +1 -0
  171. package/lib/node_modules/react-intersection-observer/dist/index.js +2 -0
  172. package/lib/node_modules/react-intersection-observer/dist/index.js.map +1 -0
  173. package/lib/{es/_virtual/_tslib.js → node_modules/tslib/tslib.es6.js} +1 -1
  174. package/lib/node_modules/tslib/tslib.es6.js.map +1 -0
  175. package/lib/node_modules/use-callback-ref/dist/es2015/assignRef.js.map +1 -0
  176. package/lib/node_modules/use-callback-ref/dist/es2015/useMergeRef.js +2 -0
  177. package/lib/node_modules/use-callback-ref/dist/es2015/useMergeRef.js.map +1 -0
  178. package/lib/node_modules/use-callback-ref/dist/es2015/useRef.js.map +1 -0
  179. package/lib/node_modules/use-sidecar/dist/es2015/medium.js +2 -0
  180. package/lib/node_modules/use-sidecar/dist/es2015/medium.js.map +1 -0
  181. package/lib/src/components/AddressLookup/index.js +2 -0
  182. package/lib/src/components/AddressLookup/index.js.map +1 -0
  183. package/lib/src/components/AddressLookup/styles.js +2 -0
  184. package/lib/src/components/AddressLookup/styles.js.map +1 -0
  185. package/lib/src/components/Avatar/index.js +2 -0
  186. package/lib/src/components/Avatar/index.js.map +1 -0
  187. package/lib/src/components/Avatar/styles.js +2 -0
  188. package/lib/src/components/Avatar/styles.js.map +1 -0
  189. package/lib/src/components/Badge/index.js +2 -0
  190. package/lib/src/components/Badge/index.js.map +1 -0
  191. package/lib/src/components/Badge/styles.js +2 -0
  192. package/lib/src/components/Badge/styles.js.map +1 -0
  193. package/lib/src/components/Box/index.js +2 -0
  194. package/lib/src/components/Box/index.js.map +1 -0
  195. package/lib/src/components/Box/styles.js +2 -0
  196. package/lib/src/components/Box/styles.js.map +1 -0
  197. package/lib/src/components/Button/index.js +2 -0
  198. package/lib/src/components/Button/index.js.map +1 -0
  199. package/lib/src/components/Button/styles.js +2 -0
  200. package/lib/src/components/Button/styles.js.map +1 -0
  201. package/lib/src/components/Carousel/Dots.js +2 -0
  202. package/lib/src/components/Carousel/Dots.js.map +1 -0
  203. package/lib/src/components/Carousel/index.js +2 -0
  204. package/lib/src/components/Carousel/index.js.map +1 -0
  205. package/lib/src/components/Carousel/styles.js +2 -0
  206. package/lib/src/components/Carousel/styles.js.map +1 -0
  207. package/lib/src/components/Checkbox/index.js +2 -0
  208. package/lib/src/components/Checkbox/index.js.map +1 -0
  209. package/lib/src/components/Checkbox/styles.js +2 -0
  210. package/lib/src/components/Checkbox/styles.js.map +1 -0
  211. package/lib/src/components/Collapse/index.js +2 -0
  212. package/lib/src/components/Collapse/index.js.map +1 -0
  213. package/lib/src/components/Collapse/styles.js +2 -0
  214. package/lib/src/components/Collapse/styles.js.map +1 -0
  215. package/lib/src/components/DateField/index.js +2 -0
  216. package/lib/src/components/DateField/index.js.map +1 -0
  217. package/lib/src/components/DateField/styles.js +2 -0
  218. package/lib/src/components/DateField/styles.js.map +1 -0
  219. package/lib/src/components/Divider.js +2 -0
  220. package/lib/src/components/Divider.js.map +1 -0
  221. package/lib/src/components/ErrorText/index.js +2 -0
  222. package/lib/src/components/ErrorText/index.js.map +1 -0
  223. package/lib/src/components/ErrorText/styles.js +2 -0
  224. package/lib/src/components/ErrorText/styles.js.map +1 -0
  225. package/lib/src/components/Flex.js +2 -0
  226. package/lib/src/components/Flex.js.map +1 -0
  227. package/lib/src/components/Fontface.js +2 -0
  228. package/lib/src/components/Fontface.js.map +1 -0
  229. package/lib/src/components/Footer/index.js +2 -0
  230. package/lib/src/components/Footer/index.js.map +1 -0
  231. package/lib/src/components/Footer/styles.js +2 -0
  232. package/lib/src/components/Footer/styles.js.map +1 -0
  233. package/lib/src/components/GlobalStyle.js +2 -0
  234. package/lib/src/components/GlobalStyle.js.map +1 -0
  235. package/lib/src/components/GlobalStyleNoFontFace.js +2 -0
  236. package/lib/src/components/GlobalStyleNoFontFace.js.map +1 -0
  237. package/lib/src/components/Header/index.js +2 -0
  238. package/lib/src/components/Header/index.js.map +1 -0
  239. package/lib/src/components/Header/styles.js +2 -0
  240. package/lib/src/components/Header/styles.js.map +1 -0
  241. package/lib/src/components/Heading/index.js +2 -0
  242. package/lib/src/components/Heading/index.js.map +1 -0
  243. package/lib/src/components/Heading/styles.js +2 -0
  244. package/lib/src/components/Heading/styles.js.map +1 -0
  245. package/lib/src/components/IconFa/index.js +2 -0
  246. package/lib/src/components/IconFa/index.js.map +1 -0
  247. package/lib/src/components/IconFa/styles.js +2 -0
  248. package/lib/src/components/IconFa/styles.js.map +1 -0
  249. package/lib/src/components/InfoBox/index.js +2 -0
  250. package/lib/src/components/InfoBox/index.js.map +1 -0
  251. package/lib/src/components/InfoBox/styles.js +2 -0
  252. package/lib/src/components/InfoBox/styles.js.map +1 -0
  253. package/lib/src/components/LabelWrapper/index.js +2 -0
  254. package/lib/src/components/LabelWrapper/index.js.map +1 -0
  255. package/lib/src/components/LabelWrapper/styles.js +2 -0
  256. package/lib/src/components/LabelWrapper/styles.js.map +1 -0
  257. package/lib/src/components/LegendWrapper/index.js +2 -0
  258. package/lib/src/components/LegendWrapper/index.js.map +1 -0
  259. package/lib/src/components/LegendWrapper/styles.js +2 -0
  260. package/lib/src/components/LegendWrapper/styles.js.map +1 -0
  261. package/lib/src/components/Link/index.js +2 -0
  262. package/lib/src/components/Link/index.js.map +1 -0
  263. package/lib/src/components/Link/styles.js +2 -0
  264. package/lib/src/components/Link/styles.js.map +1 -0
  265. package/lib/src/components/Loader/index.js +2 -0
  266. package/lib/src/components/Loader/index.js.map +1 -0
  267. package/lib/src/components/Loader/styles.js +2 -0
  268. package/lib/src/components/Loader/styles.js.map +1 -0
  269. package/lib/src/components/Modal/index.js +2 -0
  270. package/lib/src/components/Modal/index.js.map +1 -0
  271. package/lib/src/components/Modal/styles.js +2 -0
  272. package/lib/src/components/Modal/styles.js.map +1 -0
  273. package/lib/src/components/Pagination/index.js +2 -0
  274. package/lib/src/components/Pagination/index.js.map +1 -0
  275. package/lib/src/components/Pagination/styles.js +2 -0
  276. package/lib/src/components/Pagination/styles.js.map +1 -0
  277. package/lib/src/components/PopOver/index.js +2 -0
  278. package/lib/src/components/PopOver/index.js.map +1 -0
  279. package/lib/src/components/PopOver/styles.js +2 -0
  280. package/lib/src/components/PopOver/styles.js.map +1 -0
  281. package/lib/src/components/ProgressBar/index.js +2 -0
  282. package/lib/src/components/ProgressBar/index.js.map +1 -0
  283. package/lib/src/components/ProgressBar/styles.js +2 -0
  284. package/lib/src/components/ProgressBar/styles.js.map +1 -0
  285. package/lib/src/components/Radio/index.js +2 -0
  286. package/lib/src/components/Radio/index.js.map +1 -0
  287. package/lib/src/components/Radio/styles.js +2 -0
  288. package/lib/src/components/Radio/styles.js.map +1 -0
  289. package/lib/src/components/RadioConsent/index.js +2 -0
  290. package/lib/src/components/RadioConsent/index.js.map +1 -0
  291. package/lib/src/components/RadioConsent/styles.js +2 -0
  292. package/lib/src/components/RadioConsent/styles.js.map +1 -0
  293. package/lib/src/components/Select/index.js +2 -0
  294. package/lib/src/components/Select/index.js.map +1 -0
  295. package/lib/src/components/Select/styles.js +2 -0
  296. package/lib/src/components/Select/styles.js.map +1 -0
  297. package/lib/src/components/Spacing/index.js +2 -0
  298. package/lib/src/components/Spacing/index.js.map +1 -0
  299. package/lib/src/components/Step/index.js +2 -0
  300. package/lib/src/components/Step/index.js.map +1 -0
  301. package/lib/src/components/Step/styles.js +2 -0
  302. package/lib/src/components/Step/styles.js.map +1 -0
  303. package/lib/src/components/Text/index.js +2 -0
  304. package/lib/src/components/Text/index.js.map +1 -0
  305. package/lib/src/components/Text/styles.js +2 -0
  306. package/lib/src/components/Text/styles.js.map +1 -0
  307. package/lib/src/components/TextAreaField/index.js +2 -0
  308. package/lib/src/components/TextAreaField/index.js.map +1 -0
  309. package/lib/src/components/TextAreaField/styles.js +2 -0
  310. package/lib/src/components/TextAreaField/styles.js.map +1 -0
  311. package/lib/src/components/TextField/index.js +2 -0
  312. package/lib/src/components/TextField/index.js.map +1 -0
  313. package/lib/src/components/TextField/styles.js +2 -0
  314. package/lib/src/components/TextField/styles.js.map +1 -0
  315. package/lib/src/components/Totaliser/index.js +2 -0
  316. package/lib/src/components/Totaliser/index.js.map +1 -0
  317. package/lib/src/components/Totaliser/styles.js +2 -0
  318. package/lib/src/components/Totaliser/styles.js.map +1 -0
  319. package/lib/src/components/UserBlock/index.js +2 -0
  320. package/lib/src/components/UserBlock/index.js.map +1 -0
  321. package/lib/src/components/UserBlock/styles.js +2 -0
  322. package/lib/src/components/UserBlock/styles.js.map +1 -0
  323. package/lib/src/components/index.js +2 -0
  324. package/lib/src/hooks/useEffectBrowser.js.map +1 -0
  325. package/lib/src/hooks/useKey.js.map +1 -0
  326. package/lib/src/hooks/useLayoutEffectBrowser.js.map +1 -0
  327. package/lib/{es/src → src}/hooks/useScrollPosition.js +1 -1
  328. package/lib/src/hooks/useScrollPosition.js.map +1 -0
  329. package/lib/src/themes/bowelbabe.js +2 -0
  330. package/lib/src/themes/bowelbabe.js.map +1 -0
  331. package/lib/{es/src → src}/themes/cruk.js +1 -1
  332. package/lib/src/themes/cruk.js.map +1 -0
  333. package/lib/src/themes/rfl.js +2 -0
  334. package/lib/src/themes/rfl.js.map +1 -0
  335. package/lib/src/themes/su2c.js +2 -0
  336. package/lib/src/themes/su2c.js.map +1 -0
  337. package/lib/src/utils/Helper.js +2 -0
  338. package/lib/src/utils/Helper.js.map +1 -0
  339. package/lib/{es/src → src}/utils/debounce.js +1 -1
  340. package/lib/src/utils/debounce.js.map +1 -0
  341. package/lib/themes/bowelbabe.d.ts +3 -3
  342. package/lib/themes/cruk.d.ts +3 -3
  343. package/lib/themes/rfl.d.ts +3 -3
  344. package/lib/themes/su2c.d.ts +3 -3
  345. package/lib/types.d.ts +1 -3
  346. package/lib/utils/debounce.d.ts +2 -2
  347. package/package.json +44 -55
  348. package/lib/es/_virtual/_tslib.js.map +0 -1
  349. package/lib/es/node_modules/@babel/runtime/helpers/esm/defineProperty.js.map +0 -1
  350. package/lib/es/node_modules/@babel/runtime/helpers/esm/extends.js +0 -2
  351. package/lib/es/node_modules/@babel/runtime/helpers/esm/extends.js.map +0 -1
  352. package/lib/es/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js.map +0 -1
  353. package/lib/es/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js +0 -2
  354. package/lib/es/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js.map +0 -1
  355. package/lib/es/node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js.map +0 -1
  356. package/lib/es/node_modules/@babel/runtime/helpers/esm/toPrimitive.js +0 -2
  357. package/lib/es/node_modules/@babel/runtime/helpers/esm/toPrimitive.js.map +0 -1
  358. package/lib/es/node_modules/@babel/runtime/helpers/esm/toPropertyKey.js.map +0 -1
  359. package/lib/es/node_modules/@babel/runtime/helpers/esm/typeof.js.map +0 -1
  360. package/lib/es/node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js.map +0 -1
  361. package/lib/es/node_modules/focus-lock/dist/es2015/commands.js +0 -2
  362. package/lib/es/node_modules/focus-lock/dist/es2015/commands.js.map +0 -1
  363. package/lib/es/node_modules/focus-lock/dist/es2015/constants.js.map +0 -1
  364. package/lib/es/node_modules/focus-lock/dist/es2015/focusInside.js.map +0 -1
  365. package/lib/es/node_modules/focus-lock/dist/es2015/focusIsHidden.js.map +0 -1
  366. package/lib/es/node_modules/focus-lock/dist/es2015/focusSolver.js +0 -2
  367. package/lib/es/node_modules/focus-lock/dist/es2015/focusSolver.js.map +0 -1
  368. package/lib/es/node_modules/focus-lock/dist/es2015/focusables.js +0 -2
  369. package/lib/es/node_modules/focus-lock/dist/es2015/focusables.js.map +0 -1
  370. package/lib/es/node_modules/focus-lock/dist/es2015/moveFocusInside.js.map +0 -1
  371. package/lib/es/node_modules/focus-lock/dist/es2015/solver.js +0 -2
  372. package/lib/es/node_modules/focus-lock/dist/es2015/solver.js.map +0 -1
  373. package/lib/es/node_modules/focus-lock/dist/es2015/utils/DOMutils.js.map +0 -1
  374. package/lib/es/node_modules/focus-lock/dist/es2015/utils/all-affected.js.map +0 -1
  375. package/lib/es/node_modules/focus-lock/dist/es2015/utils/array.js.map +0 -1
  376. package/lib/es/node_modules/focus-lock/dist/es2015/utils/auto-focus.js.map +0 -1
  377. package/lib/es/node_modules/focus-lock/dist/es2015/utils/correctFocus.js.map +0 -1
  378. package/lib/es/node_modules/focus-lock/dist/es2015/utils/firstFocus.js.map +0 -1
  379. package/lib/es/node_modules/focus-lock/dist/es2015/utils/getActiveElement.js.map +0 -1
  380. package/lib/es/node_modules/focus-lock/dist/es2015/utils/is.js +0 -2
  381. package/lib/es/node_modules/focus-lock/dist/es2015/utils/is.js.map +0 -1
  382. package/lib/es/node_modules/focus-lock/dist/es2015/utils/parenting.js.map +0 -1
  383. package/lib/es/node_modules/focus-lock/dist/es2015/utils/safe.js.map +0 -1
  384. package/lib/es/node_modules/focus-lock/dist/es2015/utils/tabOrder.js +0 -2
  385. package/lib/es/node_modules/focus-lock/dist/es2015/utils/tabOrder.js.map +0 -1
  386. package/lib/es/node_modules/focus-lock/dist/es2015/utils/tabUtils.js.map +0 -1
  387. package/lib/es/node_modules/focus-lock/dist/es2015/utils/tabbables.js.map +0 -1
  388. package/lib/es/node_modules/react-clientside-effect/lib/index.es.js.map +0 -1
  389. package/lib/es/node_modules/react-focus-lock/dist/es2015/Combination.js.map +0 -1
  390. package/lib/es/node_modules/react-focus-lock/dist/es2015/FocusGuard.js.map +0 -1
  391. package/lib/es/node_modules/react-focus-lock/dist/es2015/Lock.js +0 -2
  392. package/lib/es/node_modules/react-focus-lock/dist/es2015/Lock.js.map +0 -1
  393. package/lib/es/node_modules/react-focus-lock/dist/es2015/Trap.js +0 -2
  394. package/lib/es/node_modules/react-focus-lock/dist/es2015/Trap.js.map +0 -1
  395. package/lib/es/node_modules/react-focus-lock/dist/es2015/index.js +0 -2
  396. package/lib/es/node_modules/react-focus-lock/dist/es2015/medium.js +0 -2
  397. package/lib/es/node_modules/react-focus-lock/dist/es2015/medium.js.map +0 -1
  398. package/lib/es/node_modules/react-focus-lock/dist/es2015/util.js +0 -2
  399. package/lib/es/node_modules/react-focus-lock/dist/es2015/util.js.map +0 -1
  400. package/lib/es/node_modules/react-intersection-observer/index.mjs.js +0 -2
  401. package/lib/es/node_modules/react-intersection-observer/index.mjs.js.map +0 -1
  402. package/lib/es/node_modules/use-callback-ref/dist/es2015/assignRef.js.map +0 -1
  403. package/lib/es/node_modules/use-callback-ref/dist/es2015/useMergeRef.js +0 -2
  404. package/lib/es/node_modules/use-callback-ref/dist/es2015/useMergeRef.js.map +0 -1
  405. package/lib/es/node_modules/use-callback-ref/dist/es2015/useRef.js.map +0 -1
  406. package/lib/es/node_modules/use-sidecar/dist/es2015/medium.js +0 -2
  407. package/lib/es/node_modules/use-sidecar/dist/es2015/medium.js.map +0 -1
  408. package/lib/es/src/components/AddressLookup/index.js +0 -2
  409. package/lib/es/src/components/AddressLookup/styles.js +0 -2
  410. package/lib/es/src/components/AddressLookup/styles.js.map +0 -1
  411. package/lib/es/src/components/Avatar/index.js +0 -2
  412. package/lib/es/src/components/Avatar/index.js.map +0 -1
  413. package/lib/es/src/components/Avatar/styles.js +0 -2
  414. package/lib/es/src/components/Avatar/styles.js.map +0 -1
  415. package/lib/es/src/components/Badge/index.js +0 -2
  416. package/lib/es/src/components/Badge/index.js.map +0 -1
  417. package/lib/es/src/components/Badge/styles.js +0 -2
  418. package/lib/es/src/components/Badge/styles.js.map +0 -1
  419. package/lib/es/src/components/Box/index.js +0 -2
  420. package/lib/es/src/components/Box/index.js.map +0 -1
  421. package/lib/es/src/components/Box/styles.js +0 -2
  422. package/lib/es/src/components/Box/styles.js.map +0 -1
  423. package/lib/es/src/components/Button/index.js +0 -2
  424. package/lib/es/src/components/Button/index.js.map +0 -1
  425. package/lib/es/src/components/Button/styles.js +0 -2
  426. package/lib/es/src/components/Button/styles.js.map +0 -1
  427. package/lib/es/src/components/Carousel/Dots.js +0 -2
  428. package/lib/es/src/components/Carousel/Dots.js.map +0 -1
  429. package/lib/es/src/components/Carousel/index.js +0 -2
  430. package/lib/es/src/components/Carousel/index.js.map +0 -1
  431. package/lib/es/src/components/Carousel/styles.js +0 -2
  432. package/lib/es/src/components/Carousel/styles.js.map +0 -1
  433. package/lib/es/src/components/Checkbox/index.js +0 -2
  434. package/lib/es/src/components/Checkbox/index.js.map +0 -1
  435. package/lib/es/src/components/Checkbox/styles.js +0 -2
  436. package/lib/es/src/components/Checkbox/styles.js.map +0 -1
  437. package/lib/es/src/components/Collapse/index.js +0 -2
  438. package/lib/es/src/components/Collapse/index.js.map +0 -1
  439. package/lib/es/src/components/Collapse/styles.js +0 -2
  440. package/lib/es/src/components/Collapse/styles.js.map +0 -1
  441. package/lib/es/src/components/DateField/index.js +0 -2
  442. package/lib/es/src/components/DateField/index.js.map +0 -1
  443. package/lib/es/src/components/DateField/styles.js +0 -2
  444. package/lib/es/src/components/DateField/styles.js.map +0 -1
  445. package/lib/es/src/components/Divider.js +0 -2
  446. package/lib/es/src/components/Divider.js.map +0 -1
  447. package/lib/es/src/components/ErrorText/index.js +0 -2
  448. package/lib/es/src/components/ErrorText/index.js.map +0 -1
  449. package/lib/es/src/components/ErrorText/styles.js +0 -2
  450. package/lib/es/src/components/ErrorText/styles.js.map +0 -1
  451. package/lib/es/src/components/Flex.js +0 -2
  452. package/lib/es/src/components/Flex.js.map +0 -1
  453. package/lib/es/src/components/Fontface.js +0 -2
  454. package/lib/es/src/components/Fontface.js.map +0 -1
  455. package/lib/es/src/components/Footer/index.js +0 -2
  456. package/lib/es/src/components/Footer/index.js.map +0 -1
  457. package/lib/es/src/components/Footer/styles.js +0 -2
  458. package/lib/es/src/components/Footer/styles.js.map +0 -1
  459. package/lib/es/src/components/GlobalStyle.js +0 -2
  460. package/lib/es/src/components/GlobalStyle.js.map +0 -1
  461. package/lib/es/src/components/GlobalStyleNoFontFace.js +0 -2
  462. package/lib/es/src/components/GlobalStyleNoFontFace.js.map +0 -1
  463. package/lib/es/src/components/Header/index.js +0 -2
  464. package/lib/es/src/components/Header/index.js.map +0 -1
  465. package/lib/es/src/components/Header/styles.js +0 -2
  466. package/lib/es/src/components/Header/styles.js.map +0 -1
  467. package/lib/es/src/components/Heading/index.js +0 -2
  468. package/lib/es/src/components/Heading/index.js.map +0 -1
  469. package/lib/es/src/components/Heading/styles.js +0 -2
  470. package/lib/es/src/components/Heading/styles.js.map +0 -1
  471. package/lib/es/src/components/IconFa/index.js +0 -2
  472. package/lib/es/src/components/IconFa/index.js.map +0 -1
  473. package/lib/es/src/components/IconFa/styles.js +0 -2
  474. package/lib/es/src/components/IconFa/styles.js.map +0 -1
  475. package/lib/es/src/components/InfoBox/index.js +0 -2
  476. package/lib/es/src/components/InfoBox/index.js.map +0 -1
  477. package/lib/es/src/components/InfoBox/styles.js +0 -2
  478. package/lib/es/src/components/InfoBox/styles.js.map +0 -1
  479. package/lib/es/src/components/LabelWrapper/index.js +0 -2
  480. package/lib/es/src/components/LabelWrapper/index.js.map +0 -1
  481. package/lib/es/src/components/LabelWrapper/styles.js +0 -2
  482. package/lib/es/src/components/LabelWrapper/styles.js.map +0 -1
  483. package/lib/es/src/components/LegendWrapper/index.js +0 -2
  484. package/lib/es/src/components/LegendWrapper/index.js.map +0 -1
  485. package/lib/es/src/components/LegendWrapper/styles.js +0 -2
  486. package/lib/es/src/components/LegendWrapper/styles.js.map +0 -1
  487. package/lib/es/src/components/Link/index.js +0 -2
  488. package/lib/es/src/components/Link/index.js.map +0 -1
  489. package/lib/es/src/components/Link/styles.js +0 -2
  490. package/lib/es/src/components/Link/styles.js.map +0 -1
  491. package/lib/es/src/components/Loader/index.js +0 -2
  492. package/lib/es/src/components/Loader/index.js.map +0 -1
  493. package/lib/es/src/components/Loader/styles.js +0 -2
  494. package/lib/es/src/components/Loader/styles.js.map +0 -1
  495. package/lib/es/src/components/Modal/index.js +0 -2
  496. package/lib/es/src/components/Modal/index.js.map +0 -1
  497. package/lib/es/src/components/Modal/styles.js +0 -2
  498. package/lib/es/src/components/Modal/styles.js.map +0 -1
  499. package/lib/es/src/components/Pagination/index.js +0 -2
  500. package/lib/es/src/components/Pagination/index.js.map +0 -1
  501. package/lib/es/src/components/Pagination/styles.js +0 -2
  502. package/lib/es/src/components/Pagination/styles.js.map +0 -1
  503. package/lib/es/src/components/PopOver/index.js +0 -2
  504. package/lib/es/src/components/PopOver/index.js.map +0 -1
  505. package/lib/es/src/components/PopOver/styles.js +0 -2
  506. package/lib/es/src/components/PopOver/styles.js.map +0 -1
  507. package/lib/es/src/components/ProgressBar/index.js +0 -2
  508. package/lib/es/src/components/ProgressBar/index.js.map +0 -1
  509. package/lib/es/src/components/ProgressBar/styles.js +0 -2
  510. package/lib/es/src/components/ProgressBar/styles.js.map +0 -1
  511. package/lib/es/src/components/Radio/index.js +0 -2
  512. package/lib/es/src/components/Radio/index.js.map +0 -1
  513. package/lib/es/src/components/Radio/styles.js +0 -2
  514. package/lib/es/src/components/Radio/styles.js.map +0 -1
  515. package/lib/es/src/components/RadioConsent/index.js +0 -2
  516. package/lib/es/src/components/RadioConsent/index.js.map +0 -1
  517. package/lib/es/src/components/RadioConsent/styles.js +0 -2
  518. package/lib/es/src/components/RadioConsent/styles.js.map +0 -1
  519. package/lib/es/src/components/Select/index.js +0 -2
  520. package/lib/es/src/components/Select/index.js.map +0 -1
  521. package/lib/es/src/components/Select/styles.js +0 -2
  522. package/lib/es/src/components/Select/styles.js.map +0 -1
  523. package/lib/es/src/components/Spacing/index.js +0 -2
  524. package/lib/es/src/components/Spacing/index.js.map +0 -1
  525. package/lib/es/src/components/Step/index.js +0 -2
  526. package/lib/es/src/components/Step/index.js.map +0 -1
  527. package/lib/es/src/components/Step/styles.js +0 -2
  528. package/lib/es/src/components/Step/styles.js.map +0 -1
  529. package/lib/es/src/components/Text/index.js +0 -2
  530. package/lib/es/src/components/Text/index.js.map +0 -1
  531. package/lib/es/src/components/Text/styles.js +0 -2
  532. package/lib/es/src/components/Text/styles.js.map +0 -1
  533. package/lib/es/src/components/TextAreaField/index.js +0 -2
  534. package/lib/es/src/components/TextAreaField/index.js.map +0 -1
  535. package/lib/es/src/components/TextAreaField/styles.js +0 -2
  536. package/lib/es/src/components/TextAreaField/styles.js.map +0 -1
  537. package/lib/es/src/components/TextField/index.js +0 -2
  538. package/lib/es/src/components/TextField/index.js.map +0 -1
  539. package/lib/es/src/components/TextField/styles.js +0 -2
  540. package/lib/es/src/components/TextField/styles.js.map +0 -1
  541. package/lib/es/src/components/Totaliser/index.js +0 -2
  542. package/lib/es/src/components/Totaliser/index.js.map +0 -1
  543. package/lib/es/src/components/Totaliser/styles.js +0 -2
  544. package/lib/es/src/components/Totaliser/styles.js.map +0 -1
  545. package/lib/es/src/components/UserBlock/index.js +0 -2
  546. package/lib/es/src/components/UserBlock/index.js.map +0 -1
  547. package/lib/es/src/components/UserBlock/styles.js +0 -2
  548. package/lib/es/src/components/UserBlock/styles.js.map +0 -1
  549. package/lib/es/src/components/index.js +0 -2
  550. package/lib/es/src/components/index.js.map +0 -1
  551. package/lib/es/src/hooks/useEffectBrowser.js.map +0 -1
  552. package/lib/es/src/hooks/useKey.js.map +0 -1
  553. package/lib/es/src/hooks/useLayoutEffectBrowser.js.map +0 -1
  554. package/lib/es/src/hooks/useScrollPosition.js.map +0 -1
  555. package/lib/es/src/themes/bowelbabe.js +0 -2
  556. package/lib/es/src/themes/bowelbabe.js.map +0 -1
  557. package/lib/es/src/themes/cruk.js.map +0 -1
  558. package/lib/es/src/themes/rfl.js +0 -2
  559. package/lib/es/src/themes/rfl.js.map +0 -1
  560. package/lib/es/src/themes/su2c.js +0 -2
  561. package/lib/es/src/themes/su2c.js.map +0 -1
  562. package/lib/es/src/utils/Helper.js +0 -2
  563. package/lib/es/src/utils/Helper.js.map +0 -1
  564. package/lib/es/src/utils/debounce.js.map +0 -1
  565. /package/lib/{es/node_modules → node_modules}/@babel/runtime/helpers/esm/defineProperty.js +0 -0
  566. /package/lib/{es/node_modules → node_modules}/@babel/runtime/helpers/esm/inheritsLoose.js +0 -0
  567. /package/lib/{es/node_modules → node_modules}/@babel/runtime/helpers/esm/setPrototypeOf.js +0 -0
  568. /package/lib/{es/node_modules → node_modules}/@babel/runtime/helpers/esm/typeof.js +0 -0
  569. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/constants.js +0 -0
  570. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/focusInside.js +0 -0
  571. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/focusIsHidden.js +0 -0
  572. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/moveFocusInside.js +0 -0
  573. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/DOMutils.js +0 -0
  574. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/all-affected.js +0 -0
  575. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/array.js +0 -0
  576. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/auto-focus.js +0 -0
  577. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/correctFocus.js +0 -0
  578. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/getActiveElement.js +0 -0
  579. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/parenting.js +0 -0
  580. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/safe.js +0 -0
  581. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/tabUtils.js +0 -0
  582. /package/lib/{es/node_modules → node_modules}/focus-lock/dist/es2015/utils/tabbables.js +0 -0
  583. /package/lib/{es/node_modules → node_modules}/react-clientside-effect/lib/index.es.js +0 -0
  584. /package/lib/{es/node_modules → node_modules}/react-focus-lock/dist/es2015/FocusGuard.js +0 -0
  585. /package/lib/{es/node_modules → node_modules}/react-focus-lock/dist/es2015/index.js.map +0 -0
  586. /package/lib/{es/node_modules → node_modules}/use-callback-ref/dist/es2015/assignRef.js +0 -0
  587. /package/lib/{es/node_modules → node_modules}/use-callback-ref/dist/es2015/useRef.js +0 -0
  588. /package/lib/{es/src/components/AddressLookup → src/components}/index.js.map +0 -0
  589. /package/lib/{es/src → src}/hooks/useEffectBrowser.js +0 -0
  590. /package/lib/{es/src → src}/hooks/useKey.js +0 -0
  591. /package/lib/{es/src → src}/hooks/useLayoutEffectBrowser.js +0 -0
  592. /package/lib/utils/__tests__/{testHelpers.jest.d.ts → testHelpers.test.d.ts} +0 -0
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/ErrorText/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport Text from \"../Text\";\nimport { type ThemeType } from \"../../types\";\n\ntype ThemeProps = {\n theme: ThemeType;\n};\nexport const StyledErrorText = styled(Text)<ThemeProps>`\n display: inline-block;\n color: ${({ theme }) => theme.colors.textError};\n font-weight: ${({ theme }) => theme.typography.fontWeightHeavy};\n`;\n\nexport default StyledErrorText;\n"],"names":["StyledErrorText","styled","Text","templateObject_1","__makeTemplateObject","_a","theme","colors","textError","typography","fontWeightHeavy"],"mappings":"yJAOa,MAAAA,EAAkBC,EAAOC,EAAPD,CAAwBE,IAAAA,EAAAC,EAAA,CAAA,wCAAA,qBAAA,OAAA,CAAA,wCAEP,qBACgB,UADrD,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,SAAb,IACT,SAACH,GAAc,OAAPA,EAAAC,MAAaG,WAAWC,eAAjB"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as e,__assign as n}from"../../node_modules/tslib/tslib.es6.js";import t from"react";import i from"styled-components";import{spacing as r,spacingPropsToSpacingPropsInternal as m}from"./Spacing/index.js";var o,a=i.div(o||(o=e(["\n display: block;\n @media (min-width: ",") {\n display: flex;\n }\n ","\n"],["\n display: block;\n @media (min-width: ",") {\n display: flex;\n }\n ","\n"])),(function(e){return e.theme.breakpoint.tablet}),(function(e){return r(e,e.theme)}));function l(e){var i=m(e);return t.createElement(a,n({theme:e.theme},i))}export{l as Flex,l as default};
2
+ //# sourceMappingURL=Flex.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Flex.js","sources":["../../../src/components/Flex.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"styled-components\";\nimport {\n spacing,\n type SpacingPropsInternal,\n spacingPropsToSpacingPropsInternal,\n type SpacingProps,\n} from \"./Spacing\";\nimport { type ThemeType } from \"../types\";\n\ntype StyledProps = SpacingPropsInternal & {\n theme: ThemeType;\n};\n\nconst FlexStyled = styled.div<StyledProps>`\n display: block;\n @media (min-width: ${({ theme }) => theme.breakpoint.tablet}) {\n display: flex;\n }\n ${(props) => spacing(props, props.theme as ThemeType)}\n`;\n\ntype Props = SpacingProps & {\n theme: ThemeType;\n};\nexport function Flex(props: Props) {\n const spacingProps = spacingPropsToSpacingPropsInternal(props);\n\n return <FlexStyled theme={props.theme} {...spacingProps} />;\n}\n\nexport default Flex;\n"],"names":["FlexStyled","styled","div","templateObject_1","__makeTemplateObject","_a","theme","breakpoint","tablet","props","spacing","Flex","spacingProps","spacingPropsToSpacingPropsInternal","React","createElement","__assign"],"mappings":"sOAcA,MAAMA,EAAaC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,6CAAA,mCAAA,MAAA,CAAa,6CAEmB,mCAGN,SAHhC,SAACC,GAAc,OAAPA,EAAAC,MAAaC,WAAWC,MAAjB,IAGlC,SAACC,GAAU,OAAAC,EAAQD,EAAOA,EAAMH,MAArB,IAMT,SAAUK,EAAKF,GACnB,IAAMG,EAAeC,EAAmCJ,GAExD,OAAOK,EAAAC,cAACf,EAAUgB,EAAA,CAACV,MAAOG,EAAMH,OAAWM,GAC7C"}
@@ -0,0 +1,2 @@
1
+ import{crukTheme as o}from"../themes/cruk.js";import{rflTheme as t}from"../themes/rfl.js";import{su2cTheme as n}from"../themes/su2c.js";import{bowelbabeTheme as f}from"../themes/bowelbabe.js";var c=function(o){return o.map((function(o){return"\n @font-face {\n font-family: ".concat(o.family,";\n src: ").concat((null==o?void 0:o.urlWoff2)?'url("'.concat(o.urlWoff2,"\") format('woff2')"):"").concat(o.urlWoff&&(null==o?void 0:o.urlWoff2)?", ":"","\n ").concat((null==o?void 0:o.urlWoff)?'url("'.concat(o.urlWoff,"\") format('woff')"):"",";\n font-weight: ").concat(o.fontWeight||"normal",";\n font-style: normal;\n font-display: fallback;\n }\n ")})).join("")},r="\n".concat(c(o.typography.customFonts),"\n").concat(c(t.typography.customFonts),"\n").concat(c(n.typography.customFonts),"\n").concat(c(f.typography.customFonts),"\n");export{r as Fontface,c as buildCustomFonts,r as default};
2
+ //# sourceMappingURL=Fontface.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Fontface.js","sources":["../../../src/components/Fontface.ts"],"sourcesContent":["import { type CustomFontType } from \"../types\";\nimport { crukTheme } from \"../themes/cruk\";\nimport { rflTheme } from \"../themes/rfl\";\nimport { su2cTheme } from \"../themes/su2c\";\nimport { bowelbabeTheme } from \"../themes/bowelbabe\";\n\n// font-display fall back to stop font's flickering on SSR rehydration\nexport const buildCustomFonts = (customFonts: CustomFontType[]) =>\n customFonts\n .map(\n (font) => `\n @font-face {\n font-family: ${font.family};\n src: ${\n font?.urlWoff2 ? `url(\"${font.urlWoff2}\") format('woff2')` : \"\"\n }${!!font.urlWoff && !!font?.urlWoff2 ? \", \" : \"\"}\n ${font?.urlWoff ? `url(\"${font.urlWoff}\") format('woff')` : \"\"};\n font-weight: ${font.fontWeight || \"normal\"};\n font-style: normal;\n font-display: fallback;\n }\n `,\n )\n .join(\"\");\n\nexport const Fontface = `\n${buildCustomFonts(crukTheme.typography.customFonts)}\n${buildCustomFonts(rflTheme.typography.customFonts)}\n${buildCustomFonts(su2cTheme.typography.customFonts)}\n${buildCustomFonts(bowelbabeTheme.typography.customFonts)}\n`;\n\nexport default Fontface;\n"],"names":["buildCustomFonts","customFonts","map","font","concat","family","urlWoff2","urlWoff","fontWeight","join","Fontface","crukTheme","typography","rflTheme","su2cTheme","bowelbabeTheme"],"mappings":"gMAOO,IAAMA,EAAmB,SAACC,GAC/B,OAAAA,EACGC,KACC,SAACC,GAAS,MAAA,kDAAAC,OAESD,EAAKE,OAElB,sBAAAD,QAAAD,eAAAA,EAAMG,UAAW,QAAAF,OAAQD,EAAKG,gCAA+B,IAAEF,OAC5DD,EAAKI,UAAaJ,aAAA,EAAAA,EAAMG,UAAW,KAAO,2BAC7CH,aAAI,EAAJA,EAAMI,SAAU,QAAQH,OAAAD,EAAKI,QAAO,sBAAsB,GAC7C,8BAAAH,OAAAD,EAAKK,YAAc,SAIrC,6FAEFC,KAAK,GAfR,EAiBWC,EAAW,KACtBN,OAAAJ,EAAiBW,EAAUC,WAAWX,aAAY,MAAAG,OAClDJ,EAAiBa,EAASD,WAAWX,0BACrCD,EAAiBc,EAAUF,WAAWX,0BACtCD,EAAiBe,EAAeH,WAAWX"}
@@ -0,0 +1,2 @@
1
+ import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import t from"react";import{useTheme as n,ThemeProvider as l}from"styled-components";import{crukTheme as r}from"../../themes/cruk.js";import{Text as o}from"../Text/index.js";import{StyledFooter as a,FooterContentWrapper as m,FooterSectionLogo as i,StyledRegulatorLogo as s,FooterSectionLinks as c,StyledNav as E,StyledUL as f,StyledLI as u,FooterSection as p,FooterSectionAddress as d,StyledAddress as g}from"./styles.js";function x(x){var h=x.children,S=x.middleSection,y=t.Children.toArray(h),z=n(),C=e(e({},r),z);return t.createElement(l,{theme:C},t.createElement(a,null,t.createElement(m,null,t.createElement(i,null,t.createElement(s,{width:130,height:40,alt:C.siteConfig.footerLogoAlt||"",src:C.siteConfig.footerLogoSrc||""})),t.createElement(c,null,t.createElement(E,{"aria-label":"footer links"},t.createElement(f,null,y.length?y.map((function(e,n){var l="footerLink".concat(n);return t.createElement(u,{key:l},e)})):null))),t.createElement(p,null,S?"string"==typeof S?t.createElement(o,{textSize:"s"},S):t.createElement(t.Fragment,null,S):t.createElement(o,{textSize:"s"},C.siteConfig.footerCopyText)),t.createElement(d,null,t.createElement(g,null,t.createElement(o,{as:"span",textSize:"s"},"2 Redman Place"),t.createElement(o,{as:"span",textSize:"s"},"London"),t.createElement(o,{as:"span",textSize:"s"},"E20 1JQ"))))))}export{x as Footer,x as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Footer/index.tsx"],"sourcesContent":["import React, { type ReactNode, type HTMLAttributes } from \"react\";\nimport { useTheme, ThemeProvider } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { Text } from \"../Text\";\n\nimport {\n StyledFooter,\n FooterContentWrapper,\n FooterSectionLogo,\n FooterSection,\n FooterSectionAddress,\n StyledAddress,\n StyledRegulatorLogo,\n FooterSectionLinks,\n StyledNav,\n StyledUL,\n StyledLI,\n} from \"./styles\";\n\nexport type FooterProps = HTMLAttributes<HTMLElement> & {\n /** used to customise text in middle section, it could also be react element, this is not to be confused with the component children which is primarily for the links in the footer */\n middleSection?: ReactNode;\n children?: ReactNode;\n};\n\n/**\n * There should be only one footer component at the bottom of the body of each page. Links can be passed as children\n * */\nexport function Footer({ children, middleSection }: FooterProps) {\n const childArray = React.Children.toArray(children);\n\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n\n return (\n <ThemeProvider theme={theme}>\n <StyledFooter>\n <FooterContentWrapper>\n <FooterSectionLogo>\n <StyledRegulatorLogo\n width={130}\n height={40}\n alt={theme.siteConfig.footerLogoAlt || \"\"}\n src={theme.siteConfig.footerLogoSrc || \"\"}\n />\n </FooterSectionLogo>\n <FooterSectionLinks>\n <StyledNav aria-label=\"footer links\">\n <StyledUL>\n {childArray.length\n ? childArray.map((child, index) => {\n const footerLinkKey = `footerLink${index}`;\n return <StyledLI key={footerLinkKey}>{child}</StyledLI>;\n })\n : null}\n </StyledUL>\n </StyledNav>\n </FooterSectionLinks>\n\n <FooterSection>\n {middleSection ? (\n typeof middleSection === \"string\" ? (\n <Text textSize=\"s\">{middleSection}</Text>\n ) : (\n <>{middleSection}</>\n )\n ) : (\n <Text textSize=\"s\">{theme.siteConfig.footerCopyText}</Text>\n )}\n </FooterSection>\n\n <FooterSectionAddress>\n <StyledAddress>\n <Text as=\"span\" textSize=\"s\">\n 2 Redman Place\n </Text>\n <Text as=\"span\" textSize=\"s\">\n London\n </Text>\n <Text as=\"span\" textSize=\"s\">\n E20 1JQ\n </Text>\n </StyledAddress>\n </FooterSectionAddress>\n </FooterContentWrapper>\n </StyledFooter>\n </ThemeProvider>\n );\n}\n\nexport default Footer;\n"],"names":["Footer","_a","children","middleSection","childArray","React","Children","toArray","foundTheme","useTheme","theme","__assign","defaultTheme","createElement","ThemeProvider","StyledFooter","FooterContentWrapper","FooterSectionLogo","StyledRegulatorLogo","width","height","alt","siteConfig","footerLogoAlt","src","footerLogoSrc","FooterSectionLinks","StyledNav","StyledUL","length","map","child","index","footerLinkKey","concat","StyledLI","key","FooterSection","Text","textSize","Fragment","footerCopyText","FooterSectionAddress","StyledAddress","as"],"mappings":"0eA6BM,SAAUA,EAAOC,OAAEC,EAAQD,EAAAC,SAAEC,EAAaF,EAAAE,cACxCC,EAAaC,EAAMC,SAASC,QAAQL,GAEpCM,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGL,OACEH,EAACQ,cAAAC,EAAc,CAAAJ,MAAOA,GACpBL,EAAAQ,cAACE,EAAY,KACXV,EAAAQ,cAACG,EAAoB,KACnBX,EAAAQ,cAACI,EAAiB,KAChBZ,EAAAQ,cAACK,EAAmB,CAClBC,MAAO,IACPC,OAAQ,GACRC,IAAKX,EAAMY,WAAWC,eAAiB,GACvCC,IAAKd,EAAMY,WAAWG,eAAiB,MAG3CpB,EAAAQ,cAACa,EAAkB,KACjBrB,EAACQ,cAAAc,gBAAqB,gBACpBtB,EAAAQ,cAACe,EAAQ,KACNxB,EAAWyB,OACRzB,EAAW0B,KAAI,SAACC,EAAOC,GACrB,IAAMC,EAAgB,aAAaC,OAAAF,GACnC,OAAO3B,EAAAQ,cAACsB,EAAS,CAAAC,IAAKH,GAAgBF,EACxC,IACA,QAKV1B,EAACQ,cAAAwB,EACE,KAAAlC,EAC0B,iBAAlBA,EACLE,EAACQ,cAAAyB,EAAK,CAAAC,SAAS,KAAKpC,GAEpBE,EAAGQ,cAAAR,EAAAmC,SAAA,KAAArC,GAGLE,EAACQ,cAAAyB,GAAKC,SAAS,KAAK7B,EAAMY,WAAWmB,iBAIzCpC,EAAAQ,cAAC6B,EAAoB,KACnBrC,EAAAQ,cAAC8B,EAAa,KACZtC,EAACQ,cAAAyB,GAAKM,GAAG,OAAOL,SAAS,KAElB,kBACPlC,EAACQ,cAAAyB,GAAKM,GAAG,OAAOL,SAAS,KAElB,UACPlC,EAAAQ,cAACyB,EAAK,CAAAM,GAAG,OAAOL,SAAS,KAAG,eAS1C"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import i from"styled-components";var t,e,o,l,d,a,r,s,p,f,c,h=i.footer(t||(t=n(["\n ",";\n box-sizing: border-box;\n display: block;\n position: relative;\n width: 100%;\n background-color: ",";\n"],["\n ",";\n box-sizing: border-box;\n display: block;\n position: relative;\n width: 100%;\n background-color: ",";\n"])),(function(n){return n.theme.colors.inputBorder}),(function(n){return n.theme.colors.footerBackground})),m=i.div(e||(e=n(["\n max-width: ",";\n display: block;\n margin: 0 auto;\n\n @media (min-width: ",") {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n }\n"],["\n max-width: ",";\n display: block;\n margin: 0 auto;\n\n @media (min-width: ",") {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n }\n"])),(function(n){return n.theme.utilities.contentMaxWidth}),(function(n){return n.theme.breakpoint.desktop})),u=i.div(o||(o=n(["\n box-sizing: border-box;\n display: inline-block;\n padding: ",";\n position: relative;\n width: 100%;\n flex: 0 1 auto;\n"],["\n box-sizing: border-box;\n display: inline-block;\n padding: ",";\n position: relative;\n width: 100%;\n flex: 0 1 auto;\n"])),(function(n){return n.theme.spacing.xs})),x=i(u)(l||(l=n(["\n width: 50%;\n display: block;\n float: left;\n\n @media (min-width: ",") {\n flex: 0 0 140px;\n width: auto;\n }\n"],["\n width: 50%;\n display: block;\n float: left;\n\n @media (min-width: ",") {\n flex: 0 0 140px;\n width: auto;\n }\n"])),(function(n){return n.theme.breakpoint.desktop})),b=i(u)(d||(d=n(["\n width: 50%;\n display: block;\n float: left;\n\n @media (min-width: ",") {\n flex: 0 0 170px;\n width: auto;\n }\n"],["\n width: 50%;\n display: block;\n float: left;\n\n @media (min-width: ",") {\n flex: 0 0 170px;\n width: auto;\n }\n"])),(function(n){return n.theme.breakpoint.desktop})),g=i.nav(a||(a=n(["\n display: flex;\n flex-direction: column;\n a {\n font-size: ",";\n font-weight: ",";\n }\n"],["\n display: flex;\n flex-direction: column;\n a {\n font-size: ",";\n font-weight: ",";\n }\n"])),(function(n){return n.theme.fontSizes.s}),(function(n){return n.theme.typography.fontWeightLinks})),y=i.ul(r||(r=n(["\n padding: 0;\n margin: 0;\n"],["\n padding: 0;\n margin: 0;\n"]))),w=i.li(s||(s=n(["\n list-style-type: none;\n display: block;\n padding: 0;\n margin: 0;\n line-height: 1;\n padding-bottom: ",";\n"],["\n list-style-type: none;\n display: block;\n padding: 0;\n margin: 0;\n line-height: 1;\n padding-bottom: ",";\n"])),(function(n){return n.theme.spacing.xxs})),k=i(u)(p||(p=n(["\n flex: 0 0 150px;\n"],["\n flex: 0 0 150px;\n"]))),v=i.img(f||(f=n(["\n height: 40px;\n width: auto;\n"],["\n height: 40px;\n width: auto;\n"]))),z=i.address(c||(c=n(["\n display: flex;\n flex-direction: column;\n font-style: normal;\n"],["\n display: flex;\n flex-direction: column;\n font-style: normal;\n"])));export{m as FooterContentWrapper,u as FooterSection,k as FooterSectionAddress,b as FooterSectionLinks,x as FooterSectionLogo,z as StyledAddress,h as StyledFooter,w as StyledLI,g as StyledNav,v as StyledRegulatorLogo,y as StyledUL};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/Footer/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ntype ThemeProps = {\n theme: ThemeType;\n};\nexport const StyledFooter = styled.footer<ThemeProps>`\n ${({ theme }) => theme.colors.inputBorder};\n box-sizing: border-box;\n display: block;\n position: relative;\n width: 100%;\n background-color: ${({ theme }) => theme.colors.footerBackground};\n`;\n\nexport const FooterContentWrapper = styled.div<ThemeProps>`\n max-width: ${({ theme }) => theme.utilities.contentMaxWidth};\n display: block;\n margin: 0 auto;\n\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n }\n`;\n\nexport const FooterSection = styled.div<ThemeProps>`\n box-sizing: border-box;\n display: inline-block;\n padding: ${({ theme }) => theme.spacing.xs};\n position: relative;\n width: 100%;\n flex: 0 1 auto;\n`;\n\nexport const FooterSectionLogo = styled(FooterSection)`\n width: 50%;\n display: block;\n float: left;\n\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n flex: 0 0 140px;\n width: auto;\n }\n`;\n\n// TODO: I'm assuming here that the links have fixed width here with a flex basis\n// and the company info expands to fill the gap but it could be the other way round\nexport const FooterSectionLinks = styled(FooterSection)`\n width: 50%;\n display: block;\n float: left;\n\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n flex: 0 0 170px;\n width: auto;\n }\n`;\n\nexport const StyledNav = styled.nav<ThemeProps>`\n display: flex;\n flex-direction: column;\n a {\n font-size: ${({ theme }) => theme.fontSizes.s};\n font-weight: ${({\n theme: {\n typography: { fontWeightLinks },\n },\n }: ThemeProps) => fontWeightLinks};\n }\n`;\n\nexport const StyledUL = styled.ul`\n padding: 0;\n margin: 0;\n`;\n\nexport const StyledLI = styled.li<ThemeProps>`\n list-style-type: none;\n display: block;\n padding: 0;\n margin: 0;\n line-height: 1;\n padding-bottom: ${({\n theme: {\n spacing: { xxs },\n },\n }) => xxs};\n`;\n\nexport const FooterSectionAddress = styled(FooterSection)`\n flex: 0 0 150px;\n`;\n\nexport const StyledRegulatorLogo = styled.img`\n height: 40px;\n width: auto;\n`;\n\nexport const StyledAddress = styled.address`\n display: flex;\n flex-direction: column;\n font-style: normal;\n`;\n"],"names":["StyledFooter","styled","footer","templateObject_1","__makeTemplateObject","_a","theme","colors","inputBorder","footerBackground","FooterContentWrapper","div","templateObject_2","utilities","contentMaxWidth","breakpoint","desktop","FooterSection","templateObject_3","spacing","xs","FooterSectionLogo","templateObject_4","FooterSectionLinks","templateObject_5","StyledNav","nav","templateObject_6","fontSizes","s","typography","fontWeightLinks","StyledUL","ul","templateObject_7","StyledLI","li","templateObject_8","xxs","FooterSectionAddress","templateObject_9","StyledRegulatorLogo","img","templateObject_10","StyledAddress","address","templateObject_11"],"mappings":"iHAMO,0BAAMA,EAAeC,EAAOC,OAAkBC,IAAAA,EAAAC,EAAA,CAAA,OAAA,+GAAA,OAAA,CAAA,OACV,+GAKuB,UAL9D,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,WAAb,IAKG,SAACH,GAAc,OAAPA,EAAAC,MAAaC,OAAOE,gBAAb,IAGxBC,EAAuBT,EAAOU,IAAeC,IAAAA,EAAAR,EAAA,CAAA,kBAAA,mEAAA,iGAAA,CAAA,kBACG,mEAIC,oGAJ/C,SAACC,GAAc,OAAPA,EAAAC,MAAaO,UAAUC,eAAhB,IAIP,SAACT,GAAc,OAAPA,EAAAC,MAAaS,WAAWC,OAAjB,IAOzBC,EAAgBhB,EAAOU,IAAGO,IAAAA,EAAAd,EAAA,CAAA,qEAAA,iEAAA,CAAY,qEAGP,oEAA/B,SAACC,GAAc,OAAPA,EAAAC,MAAaa,QAAQC,EAAd,IAMfC,EAAoBpB,EAAOgB,EAAPhB,CAAqBqB,IAAAA,EAAAlB,EAAA,CAAA,8EAAA,sDAAA,CAAA,8EAKQ,yDAAvC,SAACC,GAAc,OAAPA,EAAAC,MAAaS,WAAWC,OAAjB,IAQzBO,EAAqBtB,EAAOgB,EAAPhB,CAAqBuB,IAAAA,EAAApB,EAAA,CAAA,8EAAA,sDAAA,CAAA,8EAKO,yDAAvC,SAACC,GAAc,OAAPA,EAAAC,MAAaS,WAAWC,OAAjB,IAMzBS,EAAYxB,EAAOyB,IAAeC,IAAAA,EAAAvB,EAAA,CAAA,wEAAA,uBAAA,YAAA,CAAA,wEAIE,uBAKZ,eALpB,SAACC,GAAc,OAAPA,EAAAC,MAAasB,UAAUC,CAAhB,IACb,SAACxB,GAIE,OAFeA,EAAAC,MAAAwB,WAAAC,eAEf,IAITC,EAAW/B,EAAOgC,GAAEC,IAAAA,EAAA9B,EAAA,CAAA,mCAAA,CAAA,sCAKpB+B,EAAWlC,EAAOmC,GAAEC,IAAAA,EAAAjC,EAAA,CAAA,oHAAA,OAAA,CAAY,oHAUlC,UAJS,SAACC,GAIb,OAFYA,EAAAC,MAAAa,QAAAmB,GAEZ,IAGKC,EAAuBtC,EAAOgB,EAAPhB,CAAqBuC,IAAAA,EAAApC,EAAA,CAAA,0BAAA,CAAA,6BAI5CqC,EAAsBxC,EAAOyC,IAAGC,IAAAA,EAAAvC,EAAA,CAAA,uCAAA,CAAA,0CAKhCwC,EAAgB3C,EAAO4C,QAAOC,IAAAA,EAAA1C,EAAA,CAAA,0EAAA,CAAA"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n,__assign as o}from"../../node_modules/tslib/tslib.es6.js";import{withTheme as t,createGlobalStyle as e}from"styled-components";import{crukTheme as i}from"../themes/cruk.js";var r,a=t(e(r||(r=n(["\n ","\n *, *:after, *:before {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n \n @media (prefers-reduced-motion: reduce) {\n *, *:after, *:before {\n animation-play-state: paused !important;\n animation-direction: reverse !important;\n transition: none !important;\n scroll-behavior: auto !important;\n }\n }\n\n table, td, th {\n border-spacing: 0;\n border: 1px solid #ccc;\n padding: 10px;\n }\n .no-focus-outline a:focus,\n .no-focus-outline button:focus {\n outline: none;\n }\n img {\n width: 100%;\n height: auto;\n }\n section {\n width: 100%;\n }\n button {\n font-size: 1em;\n }\n"],["\n ","\n *, *:after, *:before {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n \n @media (prefers-reduced-motion: reduce) {\n *, *:after, *:before {\n animation-play-state: paused !important;\n animation-direction: reverse !important;\n transition: none !important;\n scroll-behavior: auto !important;\n }\n }\n\n table, td, th {\n border-spacing: 0;\n border: 1px solid #ccc;\n padding: 10px;\n }\n .no-focus-outline a:focus,\n .no-focus-outline button:focus {\n outline: none;\n }\n img {\n width: 100%;\n height: auto;\n }\n section {\n width: 100%;\n }\n button {\n font-size: 1em;\n }\n"])),(function(n){var t,e=o(o({},i),n.theme);return"\n ".concat((t=e.typography.customFonts,t.map((function(n){return"\n @font-face {\n font-family: ".concat(n.family,";\n src: ").concat((null==n?void 0:n.urlWoff2)?'url("'.concat(n.urlWoff2,"\") format('woff2')"):"").concat(n.urlWoff&&(null==n?void 0:n.urlWoff2)?", ":"","\n ").concat((null==n?void 0:n.urlWoff)?'url("'.concat(n.urlWoff,"\") format('woff')"):"",";\n font-weight: ").concat(null==n?void 0:n.fontWeight,";\n font-style: normal;\n font-display: fallback;\n }\n ")})).join("")),"\n html {\n font-size: ").concat(e.typography.fontSizeBase,";\n font-family: ").concat(e.typography.fontFamilyBase,";\n line-height: ").concat(e.typography.lineHeight,";\n }\n body {\n background-color: ").concat(e.colors.backgroundMidLight,";\n color: ").concat(e.colors.textDark,";\n margin: 0;\n padding: 0;\n overflow-x: hidden;\n -webkit-text-size-adjust: 100%;\n -moz-text-size-adjust: none;\n -ms-text-size-adjust: 100%;\n }\n ")})));a.defaultProps={theme:i};export{a as GlobalStyle,a as default};
2
+ //# sourceMappingURL=GlobalStyle.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"GlobalStyle.js","sources":["../../../src/components/GlobalStyle.tsx"],"sourcesContent":["import { createGlobalStyle, withTheme } from \"styled-components\";\nimport { type CustomFontType } from \"../types\";\nimport { crukTheme as defaultTheme } from \"../themes/cruk\";\n\n// font-display fall back to stop font's flickering on SSR rehydration\nconst buildCustomFonts = (customFonts: CustomFontType[]) =>\n customFonts\n .map(\n (font) => `\n @font-face {\n font-family: ${font.family};\n src: ${\n font?.urlWoff2 ? `url(\"${font.urlWoff2}\") format('woff2')` : \"\"\n }${!!font.urlWoff && !!font?.urlWoff2 ? \", \" : \"\"}\n ${font?.urlWoff ? `url(\"${font.urlWoff}\") format('woff')` : \"\"};\n font-weight: ${font?.fontWeight};\n font-style: normal;\n font-display: fallback;\n }\n `,\n )\n .join(\"\");\n\nexport const GlobalStyle = withTheme(createGlobalStyle`\n ${(props) => {\n const theme = {\n ...defaultTheme,\n ...props.theme,\n };\n return `\n ${buildCustomFonts(theme.typography.customFonts)}\n html {\n font-size: ${theme.typography.fontSizeBase};\n font-family: ${theme.typography.fontFamilyBase};\n line-height: ${theme.typography.lineHeight};\n }\n body {\n background-color: ${theme.colors.backgroundMidLight};\n color: ${theme.colors.textDark};\n margin: 0;\n padding: 0;\n overflow-x: hidden;\n -webkit-text-size-adjust: 100%;\n -moz-text-size-adjust: none;\n -ms-text-size-adjust: 100%;\n }\n `;\n }}\n *, *:after, *:before {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n \n @media (prefers-reduced-motion: reduce) {\n *, *:after, *:before {\n animation-play-state: paused !important;\n animation-direction: reverse !important;\n transition: none !important;\n scroll-behavior: auto !important;\n }\n }\n\n table, td, th {\n border-spacing: 0;\n border: 1px solid #ccc;\n padding: 10px;\n }\n .no-focus-outline a:focus,\n .no-focus-outline button:focus {\n outline: none;\n }\n img {\n width: 100%;\n height: auto;\n }\n section {\n width: 100%;\n }\n button {\n font-size: 1em;\n }\n`);\n\nGlobalStyle.defaultProps = {\n theme: defaultTheme,\n};\n\nexport default GlobalStyle;\n"],"names":["GlobalStyle","withTheme","createGlobalStyle","templateObject_1","__makeTemplateObject","props","customFonts","theme","defaultTheme","typography","map","font","concat","family","urlWoff2","urlWoff","fontWeight","join","fontSizeBase","fontFamilyBase","lineHeight","colors","backgroundMidLight","textDark","defaultProps"],"mappings":"8MAKA,MAkBaA,EAAcC,EAAUC,EAAiBC,IAAAA,EAAAC,EAAA,CAAA,OAAA,4sBAAA,CAAA,OAwBnD,+sBAvBC,SAACC,GACD,IApBsBC,EAoBhBC,SACDC,GACAH,EAAME,OAEX,MAAO,mBAxBeD,EAyBDC,EAAME,WAAWH,YAxBxCA,EACGI,KACC,SAACC,GAAS,MAAA,kDAAAC,OAESD,EAAKE,qCAElBF,aAAI,EAAJA,EAAMG,UAAW,QAAQF,OAAAD,EAAKG,SAAQ,uBAAuB,IAC5DF,OAAED,EAAKI,UAAaJ,aAAI,EAAJA,EAAMG,UAAW,KAAO,GAC7C,gBAAAF,QAAAD,eAAAA,EAAMI,SAAU,QAAAH,OAAQD,EAAKI,8BAA6B,GAAE,8BAAAH,OAC/CD,eAAAA,EAAMK,WAIxB,6FAEFC,KAAK,KAWW,uCAAAL,OAAAL,EAAME,WAAWS,aACf,4BAAAN,OAAAL,EAAME,WAAWU,eAAc,4BAAAP,OAC/BL,EAAME,WAAWW,WAAU,wDAAAR,OAGtBL,EAAMc,OAAOC,gDACxBf,EAAMc,OAAOE,sNAS5B,KAqCFvB,EAAYwB,aAAe,CACzBjB,MAAOC"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n,__assign as o}from"../../node_modules/tslib/tslib.es6.js";import{withTheme as t,createGlobalStyle as e}from"styled-components";import{crukTheme as i}from"../themes/cruk.js";var r,a=t(e(r||(r=n(["\n ","\n *, *:after, *:before {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n \n @media (prefers-reduced-motion: reduce) {\n *, *:after, *:before {\n animation-play-state: paused !important;\n animation-direction: reverse !important;\n transition: none !important;\n scroll-behavior: auto !important;\n }\n }\n\n table, td, th {\n border-spacing: 0;\n border: 1px solid #ccc;\n padding: 10px;\n }\n .no-focus-outline a:focus,\n .no-focus-outline button:focus {\n outline: none;\n }\n img {\n width: 100%;\n height: auto;\n }\n section {\n width: 100%;\n }\n button {\n font-size: 1em;\n }\n"],["\n ","\n *, *:after, *:before {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n \n @media (prefers-reduced-motion: reduce) {\n *, *:after, *:before {\n animation-play-state: paused !important;\n animation-direction: reverse !important;\n transition: none !important;\n scroll-behavior: auto !important;\n }\n }\n\n table, td, th {\n border-spacing: 0;\n border: 1px solid #ccc;\n padding: 10px;\n }\n .no-focus-outline a:focus,\n .no-focus-outline button:focus {\n outline: none;\n }\n img {\n width: 100%;\n height: auto;\n }\n section {\n width: 100%;\n }\n button {\n font-size: 1em;\n }\n"])),(function(n){var t=o(o({},i),n.theme);return"\n html {\n font-size: ".concat(t.typography.fontSizeBase,";\n font-family: ").concat(t.typography.fontFamilyBase,";\n line-height: ").concat(t.typography.lineHeight,";\n }\n body {\n background-color: ").concat(t.colors.backgroundMidLight,";\n color: ").concat(t.colors.textDark,";\n margin: 0;\n padding: 0;\n overflow-x: hidden;\n -webkit-text-size-adjust: 100%;\n -moz-text-size-adjust: none;\n -ms-text-size-adjust: 100%;\n }\n ")})));a.defaultProps={theme:i};export{a as GlobalStyleNoFontFace,a as default};
2
+ //# sourceMappingURL=GlobalStyleNoFontFace.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"GlobalStyleNoFontFace.js","sources":["../../../src/components/GlobalStyleNoFontFace.tsx"],"sourcesContent":["import { createGlobalStyle, withTheme } from \"styled-components\";\nimport { crukTheme as defaultTheme } from \"../themes/cruk\";\n\nexport const GlobalStyleNoFontFace = withTheme(createGlobalStyle`\n ${(props) => {\n const theme = {\n ...defaultTheme,\n ...props.theme,\n };\n return `\n html {\n font-size: ${theme.typography.fontSizeBase};\n font-family: ${theme.typography.fontFamilyBase};\n line-height: ${theme.typography.lineHeight};\n }\n body {\n background-color: ${theme.colors.backgroundMidLight};\n color: ${theme.colors.textDark};\n margin: 0;\n padding: 0;\n overflow-x: hidden;\n -webkit-text-size-adjust: 100%;\n -moz-text-size-adjust: none;\n -ms-text-size-adjust: 100%;\n }\n `;\n }}\n *, *:after, *:before {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n \n @media (prefers-reduced-motion: reduce) {\n *, *:after, *:before {\n animation-play-state: paused !important;\n animation-direction: reverse !important;\n transition: none !important;\n scroll-behavior: auto !important;\n }\n }\n\n table, td, th {\n border-spacing: 0;\n border: 1px solid #ccc;\n padding: 10px;\n }\n .no-focus-outline a:focus,\n .no-focus-outline button:focus {\n outline: none;\n }\n img {\n width: 100%;\n height: auto;\n }\n section {\n width: 100%;\n }\n button {\n font-size: 1em;\n }\n`);\n\nGlobalStyleNoFontFace.defaultProps = {\n theme: defaultTheme,\n};\n\nexport default GlobalStyleNoFontFace;\n"],"names":["GlobalStyleNoFontFace","withTheme","createGlobalStyle","templateObject_1","__makeTemplateObject","props","theme","defaultTheme","concat","typography","fontSizeBase","fontFamilyBase","lineHeight","colors","backgroundMidLight","textDark","defaultProps"],"mappings":"8MAGO,MAAMA,EAAwBC,EAAUC,EAAiBC,IAAAA,EAAAC,EAAA,CAAA,OAAA,4sBAAA,CAAA,OAuB7D,+sBAtBC,SAACC,GACD,IAAMC,SACDC,GACAF,EAAMC,OAEX,MAAO,sCAEUE,OAAAF,EAAMG,WAAWC,aACf,4BAAAF,OAAAF,EAAMG,WAAWE,kDACjBL,EAAMG,WAAWG,WAAU,wDAAAJ,OAGtBF,EAAMO,OAAOC,mBACxB,sBAAAN,OAAAF,EAAMO,OAAOE,sNAS5B,KAqCFf,EAAsBgB,aAAe,CACnCV,MAAOC"}
@@ -0,0 +1,2 @@
1
+ import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import t,{useState as l}from"react";import{useTheme as o,ThemeProvider as n}from"styled-components";import i from"../../hooks/useScrollPosition.js";import{crukTheme as r}from"../../themes/cruk.js";import{StyledHeader as m,HeaderStickyPlaceHolder as c,HeaderStickyContainer as s,SkipToMain as a,HeaderMainContent as u,StyledLink as f,LogoWrapper as g,Logo as d,Tagline as E,ChildWrapper as S,ChildInner as h}from"./styles.js";function k(k){var p=k.isSticky,y=k.siteSlogan,$=k.logoAltText,j=k.logoImageSrc,C=k.logoLinkTitle,b=k.logoLinkUrl,v=k.fullWidth,w=k.children,x=l(!1),A=x[0],L=x[1],P="undefined"!=typeof window,T=o(),U=e(e({},r),T);return i((function(e){var t=e.currPos,l=!!P&&t.y>240;l!==A&&L(l)}),[A],null,!0,50),t.createElement(n,{theme:U},t.createElement(m,null,t.createElement(c,null,t.createElement(s,{"data-cy":"header-sticky-container",$isSmall:A,$isSticky:p},t.createElement(a,{href:"#main"},"Skip to main content"),t.createElement(u,{$fullWidth:v},t.createElement(f,{href:null!=b?b:U.siteConfig.logoUrl,title:null!=C?C:"Home"},t.createElement(g,{$isSmall:A,$isSticky:p},t.createElement(d,{height:80,src:null!=j?j:U.siteConfig.logoSrc,alt:null!=$?$:U.siteConfig.logoAlt}))),y?t.createElement(E,{$isSmall:A,$isSticky:p},y):null,t.createElement(S,null,t.createElement(h,null,w)))))))}export{k as Header,k as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Header/index.tsx"],"sourcesContent":["import React, { useState, type HTMLAttributes, type ReactNode } from \"react\";\nimport { useTheme, ThemeProvider } from \"styled-components\";\n\nimport { useScrollPosition } from \"../../hooks/useScrollPosition\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport {\n StyledHeader,\n HeaderStickyContainer,\n HeaderStickyPlaceHolder,\n HeaderMainContent,\n SkipToMain,\n StyledLink,\n Logo,\n LogoWrapper,\n Tagline,\n ChildWrapper,\n ChildInner,\n} from \"./styles\";\n\nconst HEADER_SCROLL_THRESHOLD = 240;\n\nexport type HeaderProps = HTMLAttributes<HTMLElement> & {\n /** flag which make header fixed to the top even when scrolling */\n isSticky?: boolean;\n /** text in the middle of the header */\n siteSlogan?: string;\n /** text to explain the content of the icon for a11y usually a description of where the link will take you */\n logoAltText?: string;\n /** header logo image url */\n logoImageSrc?: string;\n /** title of the header image component, this is mainly for the tooltip text on hover */\n logoLinkTitle?: string;\n /** the url of the logo link */\n logoLinkUrl?: string;\n /** instead of the contents of the header being centered to max width as defined in theme it is 100% width fo viewport */\n fullWidth?: boolean;\n\n children?: ReactNode;\n};\n\n/**\n * There should be only one header component near or at the top of the body of each page.\n *\n * ### Logos\n * It is recommended that logo images are at least 80px high if they are not SVGs and that the logo is still clearly legible when reduced to 40px high for mobile.\n * It is also recommended that the logo width doesn't exceed 350px. If you need a wide logo that is shorter than 80px to keep the aspect ratio please make sure that the logo is centered with transparent space at the top and bottom and still 80px high.\n *\n * ### Site Slogan Text (optional)\n * This is a single line of text and the character limit depends on the theme, logo and children width. This is only visible on desktop at the top of the page\n *\n * ### Right section (optional)\n * This has been kept quite open you can place any child elements in here but ideally it is narrow and its height is 50px or smaller.\n *\n * ### Accessability\n * There is a hidden skip link in the header which will only reveals itself on the first tab and to screen readers. This link helps users skip to the main page content, however this will only work with there is an element with an id of 'main' which the developer should create for every page.\n *\n */\nexport function Header({\n isSticky,\n siteSlogan,\n logoAltText,\n logoImageSrc,\n logoLinkTitle,\n logoLinkUrl,\n fullWidth,\n children,\n}: HeaderProps) {\n const [isSmall, setIsSmall] = useState(false);\n const isBrowser = typeof window !== `undefined`;\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n\n useScrollPosition(\n ({\n currPos,\n }: {\n prevPos: { x: number; y: number };\n currPos: { x: number; y: number };\n }) => {\n const shouldShrink = isBrowser\n ? currPos.y > HEADER_SCROLL_THRESHOLD\n : false;\n if (shouldShrink !== isSmall) {\n setIsSmall(shouldShrink);\n }\n },\n [isSmall],\n null,\n true,\n 50,\n );\n\n return (\n <ThemeProvider theme={theme}>\n <StyledHeader>\n <HeaderStickyPlaceHolder>\n <HeaderStickyContainer\n data-cy=\"header-sticky-container\"\n $isSmall={isSmall}\n $isSticky={isSticky}\n >\n <SkipToMain href=\"#main\">Skip to main content</SkipToMain>\n <HeaderMainContent $fullWidth={fullWidth}>\n <StyledLink\n href={logoLinkUrl ?? theme.siteConfig.logoUrl}\n title={logoLinkTitle ?? \"Home\"}\n >\n <LogoWrapper $isSmall={isSmall} $isSticky={isSticky}>\n <Logo\n height={80}\n src={logoImageSrc ?? theme.siteConfig.logoSrc}\n alt={logoAltText ?? theme.siteConfig.logoAlt}\n />\n </LogoWrapper>\n </StyledLink>\n {siteSlogan ? (\n <Tagline $isSmall={isSmall} $isSticky={isSticky}>\n {siteSlogan}\n </Tagline>\n ) : null}\n <ChildWrapper>\n <ChildInner>{children}</ChildInner>\n </ChildWrapper>\n </HeaderMainContent>\n </HeaderStickyContainer>\n </HeaderStickyPlaceHolder>\n </StyledHeader>\n </ThemeProvider>\n );\n}\n\nexport default Header;\n"],"names":["Header","_a","isSticky","siteSlogan","logoAltText","logoImageSrc","logoLinkTitle","logoLinkUrl","fullWidth","children","_b","useState","isSmall","setIsSmall","isBrowser","window","foundTheme","useTheme","theme","__assign","defaultTheme","useScrollPosition","currPos","shouldShrink","y","React","createElement","ThemeProvider","StyledHeader","HeaderStickyPlaceHolder","HeaderStickyContainer","$isSmall","SkipToMain","href","HeaderMainContent","StyledLink","siteConfig","logoUrl","title","LogoWrapper","$isSticky","Logo","height","src","logoSrc","alt","logoAlt","Tagline","ChildWrapper","ChildInner"],"mappings":"6eA0DM,SAAUA,EAAOC,OACrBC,EAAQD,EAAAC,SACRC,EAAUF,EAAAE,WACVC,EAAWH,EAAAG,YACXC,EAAYJ,EAAAI,aACZC,EAAaL,EAAAK,cACbC,EAAWN,EAAAM,YACXC,EAASP,EAAAO,UACTC,EAAQR,EAAAQ,SAEFC,EAAwBC,GAAS,GAAhCC,EAAOF,EAAA,GAAEG,EAAUH,EAAA,GACpBI,EAA8B,oBAAXC,OACnBC,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAuBL,OApBAK,GACE,SAACpB,GACC,IAAAqB,EAAOrB,EAAAqB,QAKDC,IAAeT,GACjBQ,EAAQE,EAhEc,IAkEtBD,IAAiBX,GACnBC,EAAWU,EAEd,GACD,CAACX,GACD,MACA,EACA,IAIAa,EAACC,cAAAC,EAAc,CAAAT,MAAOA,GACpBO,EAAAC,cAACE,EAAY,KACXH,EAAAC,cAACG,EAAuB,KACtBJ,EAAAC,cAACI,EACS,CAAA,UAAA,0BACEC,SAAAnB,YACCV,GAEXuB,EAAAC,cAACM,EAAU,CAACC,KAAK,SAAyC,wBAC1DR,EAACC,cAAAQ,cAA8B1B,GAC7BiB,EAACC,cAAAS,EACC,CAAAF,KAAM1B,QAAAA,EAAeW,EAAMkB,WAAWC,QACtCC,MAAOhC,QAAAA,EAAiB,QAExBmB,EAAAC,cAACa,EAAW,CAAAR,SAAWnB,EAAO4B,UAAatC,GACzCuB,EAAAC,cAACe,EAAI,CACHC,OAAQ,GACRC,IAAKtC,QAAAA,EAAgBa,EAAMkB,WAAWQ,QACtCC,IAAKzC,QAAAA,EAAec,EAAMkB,WAAWU,YAI1C3C,EACCsB,EAAAC,cAACqB,EAAkB,CAAAhB,SAAAnB,EAAoB4B,UAAAtC,GACpCC,GAED,KACJsB,EAAAC,cAACsB,EAAY,KACXvB,EAACC,cAAAuB,EAAY,KAAAxC,QAQ7B"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import i from"styled-components";import{crukTheme as t}from"../../themes/cruk.js";var e,o,r,a,d,h,s,u,l,c,p,g="120px",x="72px",f=t.spacing.xs,m="40px",b="0.2s",w=i.header(e||(e=n(["\n box-sizing: border-box;\n position: relative;\n width: 100%;\n background-color: ",";\n z-index: 9998;\n"],["\n box-sizing: border-box;\n position: relative;\n width: 100%;\n background-color: ",";\n z-index: 9998;\n"])),(function(n){return n.theme.colors.headerBackground})),y=i.div(o||(o=n(["\n position: relative;\n box-sizing: border-box;\n width: 100%;\n height: ",";\n\n @media (min-width: ",") {\n height: ",";\n }\n"],["\n position: relative;\n box-sizing: border-box;\n width: 100%;\n height: ",";\n\n @media (min-width: ",") {\n height: ",";\n }\n"])),x,(function(n){return n.theme.breakpoint.desktop}),g),v=i.div(r||(r=n(["\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n padding: 0 ",";\n background-color: ",";\n position: relative;\n border-bottom: ",";\n height: ",";\n box-shadow: ",";\n top: ",";\n position: ",";\n transition: height "," ease;\n\n @media (min-width: ",") {\n position: ",";\n height: ",";\n }\n"],["\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n padding: 0 ",";\n background-color: ",";\n position: relative;\n border-bottom: ",";\n height: ",";\n box-shadow: ",";\n top: ",";\n position: ",";\n transition: height "," ease;\n\n @media (min-width: ",") {\n position: ",";\n height: ",";\n }\n"])),f,(function(n){return n.theme.colors.headerBackground}),(function(n){var i=n.theme.colors.headerBorder;return"solid 1px ".concat(i)}),x,(function(n){var i=n.theme;return n.$isSticky?i.shadows.l:"none"}),(function(n){return n.$isSticky?0:"auto"}),(function(n){return n.$isSticky?"fixed":"relative"}),b,(function(n){return n.theme.breakpoint.desktop}),(function(n){return n.$isSticky?"fixed":"relative"}),(function(n){var i=n.$isSmall,t=n.$isSticky;return i&&t?x:g})),k=i.div(a||(a=n(["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n height: 100%;\n margin: 0 auto;\n max-width: ",";\n"],["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n height: 100%;\n margin: 0 auto;\n max-width: ",";\n"])),(function(n){var i=n.$fullWidth,t=n.theme.utilities.contentMaxWidth;return i?"100%":t})),z=i.img(d||(d=n(["\n height: 100%;\n width: auto;\n max-width: 100%;\n max-height: 100%;\n"],["\n height: 100%;\n width: auto;\n max-width: 100%;\n max-height: 100%;\n"]))),S=i.div(h||(h=n(["\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n width: auto;\n transition: height "," ease;\n\n height: ",";\n\n @media (min-width: ",") {\n height: ",";\n }\n"],["\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n width: auto;\n transition: height "," ease;\n\n height: ",";\n\n @media (min-width: ",") {\n height: ",";\n }\n"])),b,m,(function(n){return n.theme.breakpoint.desktop}),(function(n){var i=n.$isSmall,t=n.$isSticky;return i&&t?m:"80px"})),$=i.a(s||(s=n(["\n display: inline-block;\n"],["\n display: inline-block;\n"]))),j=i.a(u||(u=n(["\n left: -999px;\n position: absolute;\n top: auto;\n width: 1px;\n height: 1px;\n overflow: hidden;\n z-index: -999;\n &:focus,\n &:active,\n &:focus-within {\n left: auto;\n top: auto;\n width: 30%;\n height: auto;\n overflow: auto;\n margin: 10px 35%;\n padding: ",";\n border-radius: 15px;\n border: 4px solid yellow;\n text-align: center;\n font-size: 1.2em;\n z-index: 999;\n }\n"],["\n left: -999px;\n position: absolute;\n top: auto;\n width: 1px;\n height: 1px;\n overflow: hidden;\n z-index: -999;\n &:focus,\n &:active,\n &:focus-within {\n left: auto;\n top: auto;\n width: 30%;\n height: auto;\n overflow: auto;\n margin: 10px 35%;\n padding: ",";\n border-radius: 15px;\n border: 4px solid yellow;\n text-align: center;\n font-size: 1.2em;\n z-index: 999;\n }\n"])),(function(n){return n.theme.spacing.xs})),B=i.p(l||(l=n(["\n flex: 1 1 auto;\n font-family: ",";\n font-weight: ",";\n font-size: ",";\n color: ",";\n text-align: center;\n opacity: 0;\n transition: opacity "," ease;\n display: none;\n\n @media (min-width: ",") {\n display: block;\n opacity: ",";\n }\n"],["\n flex: 1 1 auto;\n font-family: ",";\n font-weight: ",";\n font-size: ",";\n color: ",";\n text-align: center;\n opacity: 0;\n transition: opacity "," ease;\n display: none;\n\n @media (min-width: ",") {\n display: block;\n opacity: ",";\n }\n"])),(function(n){return n.theme.typography.fontFamilyHeadings}),(function(n){return n.theme.typography.fontWeightHeadings}),(function(n){return n.theme.fontSizes.xl}),(function(n){return n.theme.colors.headerTaglineText}),b,(function(n){return n.theme.breakpoint.desktop}),(function(n){var i=n.$isSmall,t=n.$isSticky;return i&&t?0:1})),W=i.div(c||(c=n(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n"],["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n"]))),H=i.div(p||(p=n(["\n height: auto;\n margin: auto 0;\n"],["\n height: auto;\n margin: auto 0;\n"])));export{H as ChildInner,W as ChildWrapper,k as HeaderMainContent,v as HeaderStickyContainer,y as HeaderStickyPlaceHolder,z as Logo,S as LogoWrapper,j as SkipToMain,w as StyledHeader,$ as StyledLink,B as Tagline};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/Header/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { type ThemeType } from \"../../types\";\n\nconst HEADER_HEIGHT_LARGE = \"120px\";\nconst HEADER_HEIGHT_SMALL = \"72px\";\nconst HEADER_PADDING = defaultTheme.spacing.xs;\nconst HEADER_LOGO_HEIGHT_LARGE = \"80px\";\nconst HEADER_LOGO_HEIGHT_SMALL = \"40px\";\nconst ANIMATION_SPEED = \"0.2s\";\n\nexport const StyledHeader = styled.header<{ theme: ThemeType }>`\n box-sizing: border-box;\n position: relative;\n width: 100%;\n background-color: ${({\n theme: {\n colors: { headerBackground },\n },\n }) => headerBackground};\n z-index: 9998;\n`;\n\nexport const HeaderStickyPlaceHolder = styled.div<{ theme: ThemeType }>`\n position: relative;\n box-sizing: border-box;\n width: 100%;\n height: ${HEADER_HEIGHT_SMALL};\n\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n height: ${HEADER_HEIGHT_LARGE};\n }\n`;\n\nexport const HeaderStickyContainer = styled.div<{\n $isSmall?: boolean;\n $isSticky?: boolean;\n theme: ThemeType;\n}>`\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n padding: 0 ${HEADER_PADDING};\n background-color: ${({\n theme: {\n colors: { headerBackground },\n },\n }) => headerBackground};\n position: relative;\n border-bottom: ${({\n theme: {\n colors: { headerBorder },\n },\n }) => `solid 1px ${headerBorder}`};\n height: ${HEADER_HEIGHT_SMALL};\n box-shadow: ${({ theme, $isSticky }) =>\n $isSticky ? theme.shadows.l : \"none\"};\n top: ${({ $isSticky }) => ($isSticky ? 0 : \"auto\")};\n position: ${({ $isSticky }) => ($isSticky ? \"fixed\" : \"relative\")};\n transition: height ${ANIMATION_SPEED} ease;\n\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n position: ${({ $isSticky }) => ($isSticky ? \"fixed\" : \"relative\")};\n height: ${({ $isSmall, $isSticky }) =>\n $isSmall && $isSticky ? HEADER_HEIGHT_SMALL : HEADER_HEIGHT_LARGE};\n }\n`;\n\nexport const HeaderMainContent = styled.div<{\n $fullWidth?: boolean;\n theme: ThemeType;\n}>`\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n height: 100%;\n margin: 0 auto;\n max-width: ${({\n $fullWidth,\n theme: {\n utilities: { contentMaxWidth },\n },\n }) => ($fullWidth ? `100%` : contentMaxWidth)};\n`;\n\nexport const Logo = styled.img`\n height: 100%;\n width: auto;\n max-width: 100%;\n max-height: 100%;\n`;\n\nexport const LogoWrapper = styled.div<{\n $isSmall?: boolean;\n $isSticky?: boolean;\n theme: ThemeType;\n}>`\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n width: auto;\n transition: height ${ANIMATION_SPEED} ease;\n\n height: ${HEADER_LOGO_HEIGHT_SMALL};\n\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n height: ${({ $isSmall, $isSticky }) =>\n $isSmall && $isSticky\n ? HEADER_LOGO_HEIGHT_SMALL\n : HEADER_LOGO_HEIGHT_LARGE};\n }\n`;\n\nexport const StyledLink = styled.a`\n display: inline-block;\n`;\n\nexport const SkipToMain = styled.a<{ theme: ThemeType }>`\n left: -999px;\n position: absolute;\n top: auto;\n width: 1px;\n height: 1px;\n overflow: hidden;\n z-index: -999;\n &:focus,\n &:active,\n &:focus-within {\n left: auto;\n top: auto;\n width: 30%;\n height: auto;\n overflow: auto;\n margin: 10px 35%;\n padding: ${({\n theme: {\n spacing: { xs },\n },\n }) => xs};\n border-radius: 15px;\n border: 4px solid yellow;\n text-align: center;\n font-size: 1.2em;\n z-index: 999;\n }\n`;\n\nexport const Tagline = styled.p<{\n $isSmall?: boolean;\n $isSticky?: boolean;\n theme: ThemeType;\n}>`\n flex: 1 1 auto;\n font-family: ${({ theme }) => theme.typography.fontFamilyHeadings};\n font-weight: ${({ theme }) => theme.typography.fontWeightHeadings};\n font-size: ${({\n theme: {\n fontSizes: { xl },\n },\n }) => xl};\n color: ${({ theme }) => theme.colors.headerTaglineText};\n text-align: center;\n opacity: 0;\n transition: opacity ${ANIMATION_SPEED} ease;\n display: none;\n\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n display: block;\n opacity: ${({ $isSmall, $isSticky }) => ($isSmall && $isSticky ? 0 : 1)};\n }\n`;\n\nexport const ChildWrapper = styled.div`\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n`;\n\nexport const ChildInner = styled.div`\n height: auto;\n margin: auto 0;\n`;\n"],"names":["HEADER_HEIGHT_LARGE","HEADER_HEIGHT_SMALL","HEADER_PADDING","defaultTheme","spacing","xs","HEADER_LOGO_HEIGHT_SMALL","ANIMATION_SPEED","StyledHeader","styled","header","templateObject_1","__makeTemplateObject","_a","theme","colors","headerBackground","HeaderStickyPlaceHolder","div","templateObject_2","breakpoint","desktop","HeaderStickyContainer","templateObject_3","headerBorder","concat","$isSticky","shadows","l","$isSmall","HeaderMainContent","templateObject_4","$fullWidth","contentMaxWidth","utilities","Logo","img","templateObject_5","LogoWrapper","templateObject_6","StyledLink","a","templateObject_7","SkipToMain","templateObject_8","Tagline","p","templateObject_9","typography","fontFamilyHeadings","fontWeightHeadings","fontSizes","xl","headerTaglineText","ChildWrapper","templateObject_10","ChildInner","templateObject_11"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ import{__rest as e,__assign as t}from"../../../node_modules/tslib/tslib.es6.js";import r from"react";import{useTheme as o}from"styled-components";import{crukTheme as l}from"../../themes/cruk.js";import{spacingPropsToSpacingPropsInternal as $}from"../Spacing/index.js";import{H1 as a,H2 as i,H3 as m,H4 as x,H5 as n,H6 as h}from"./styles.js";function p(p){var w=p.textSize,f=p.textAlign,d=p.textColor,s=p.wordBreak,c=p.overflowWrap,g=p.h1,k=p.h2,v=p.h3,S=p.h4,z=p.h5,A=p.h6,B=e(p,["textSize","textAlign","textColor","wordBreak","overflowWrap","h1","h2","h3","h4","h5","h6"]),C=o(),W=t(t({},l),C),E=$(B);return g?r.createElement(a,t({},E,{theme:W,$textSize:w,$textAlign:f,$textColor:d,$wordBreak:s,$overflowWrap:c})):k?r.createElement(i,t({},E,{theme:W,$textSize:w,$textAlign:f,$textColor:d,$wordBreak:s,$overflowWrap:c})):v?r.createElement(m,t({},E,{theme:W,$textSize:w,$textAlign:f,$textColor:d,$wordBreak:s,$overflowWrap:c})):S?r.createElement(x,t({},E,{theme:W,$textSize:w,$textAlign:f,$textColor:d,$wordBreak:s,$overflowWrap:c})):z?r.createElement(n,t({},E,{theme:W,$textSize:w,$textAlign:f,$textColor:d,$wordBreak:s,$overflowWrap:c})):A?r.createElement(h,t({},E,{theme:W,$textSize:w,$textAlign:f,$textColor:d,$wordBreak:s,$overflowWrap:c})):r.createElement(i,t({},E,{theme:W,$textSize:w,$textAlign:f,$textColor:d,$wordBreak:s,$overflowWrap:c}))}export{p as Heading,p as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Heading/index.tsx"],"sourcesContent":["import React, { type HTMLAttributes, type ElementType } from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport {\n spacingPropsToSpacingPropsInternal,\n type SpacingProps,\n} from \"../Spacing\";\n\nimport {\n type FontSizeType,\n type WordBreakType,\n type OverflowWrapType,\n} from \"../../types\";\nimport { H1, H2, H3, H4, H5, H6 } from \"./styles\";\n\nexport type HeadingProps = SpacingProps &\n HTMLAttributes<HTMLElement> & {\n h1?: boolean;\n h2?: boolean;\n h3?: boolean;\n h4?: boolean;\n h5?: boolean;\n h6?: boolean;\n /** font size FontSizeType t-shirt sizes */\n textSize?: FontSizeType;\n /** horizontal alignment of text */\n textAlign?: \"left\" | \"right\" | \"center\";\n /** color of text */\n textColor?: string;\n /** word-break behavior */\n wordBreak?: WordBreakType;\n /** overflow-wrap behavior */\n overflowWrap?: OverflowWrapType;\n /** styled-component polymorphic feature so you take the styling of a header and cast the component to be a \"span\" for example */\n as?: ElementType;\n };\n\n/**\n * \n * Use headings consistently to create a clear hierarchy throughout your service.\nMarkup headings semantically using the appropriate <h#> level HTML element and\nuse the corresponding heading class (h1, h2, h3, ....). Write all headings in sentence case. Heading differs from the Text component by using a different font-family and it changes the font size according to the screen width breakpoints.\n * \n */\nexport function Heading({\n textSize,\n textAlign,\n textColor,\n wordBreak,\n overflowWrap,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n ...props\n}: HeadingProps) {\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n\n const propsConvertedToInternalSpacingProps =\n spacingPropsToSpacingPropsInternal(props);\n\n if (h1)\n return (\n <H1\n {...propsConvertedToInternalSpacingProps}\n theme={theme}\n $textSize={textSize}\n $textAlign={textAlign}\n $textColor={textColor}\n $wordBreak={wordBreak}\n $overflowWrap={overflowWrap}\n />\n );\n if (h2)\n return (\n <H2\n {...propsConvertedToInternalSpacingProps}\n theme={theme}\n $textSize={textSize}\n $textAlign={textAlign}\n $textColor={textColor}\n $wordBreak={wordBreak}\n $overflowWrap={overflowWrap}\n />\n );\n if (h3)\n return (\n <H3\n {...propsConvertedToInternalSpacingProps}\n theme={theme}\n $textSize={textSize}\n $textAlign={textAlign}\n $textColor={textColor}\n $wordBreak={wordBreak}\n $overflowWrap={overflowWrap}\n />\n );\n if (h4)\n return (\n <H4\n {...propsConvertedToInternalSpacingProps}\n theme={theme}\n $textSize={textSize}\n $textAlign={textAlign}\n $textColor={textColor}\n $wordBreak={wordBreak}\n $overflowWrap={overflowWrap}\n />\n );\n if (h5)\n return (\n <H5\n {...propsConvertedToInternalSpacingProps}\n theme={theme}\n $textSize={textSize}\n $textAlign={textAlign}\n $textColor={textColor}\n $wordBreak={wordBreak}\n $overflowWrap={overflowWrap}\n />\n );\n if (h6)\n return (\n <H6\n {...propsConvertedToInternalSpacingProps}\n theme={theme}\n $textSize={textSize}\n $textAlign={textAlign}\n $textColor={textColor}\n $wordBreak={wordBreak}\n $overflowWrap={overflowWrap}\n />\n );\n return (\n <H2\n {...propsConvertedToInternalSpacingProps}\n theme={theme}\n $textSize={textSize}\n $textAlign={textAlign}\n $textColor={textColor}\n $wordBreak={wordBreak}\n $overflowWrap={overflowWrap}\n />\n );\n}\n\nexport default Heading;\n"],"names":["Heading","_a","textSize","textAlign","textColor","wordBreak","overflowWrap","h1","h2","h3","h4","h5","h6","props","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","propsConvertedToInternalSpacingProps","spacingPropsToSpacingPropsInternal","React","H1","$textSize","$textAlign","$wordBreak","$overflowWrap","H2","H3","H4","H5","H6"],"mappings":"qVA6CM,SAAUA,EAAQC,GACtB,IAAAC,EAAQD,EAAAC,SACRC,EAASF,EAAAE,UACTC,EAASH,EAAAG,UACTC,cACAC,EAAYL,EAAAK,aACZC,EAAEN,EAAAM,GACFC,EAAEP,EAAAO,GACFC,EAAER,EAAAQ,GACFC,OACAC,EAAEV,EAAAU,GACFC,EAAEX,EAAAW,GACCC,EAAKC,EAAAb,EAZc,+FAchBc,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGCK,EACJC,EAAmCR,GAErC,OAAIN,EAEAe,gBAACC,EAAEL,EAAA,CAAA,EACGE,EACJ,CAAAH,MAAOA,EAAKO,UACDtB,EACCuB,WAAAtB,aACAC,EAASsB,WACTrB,EACGsB,cAAArB,KAGjBE,EAEAc,gBAACM,EAAEV,EAAA,CAAA,EACGE,EACJ,CAAAH,MAAOA,EAAKO,UACDtB,EACCuB,WAAAtB,aACAC,EAASsB,WACTrB,EACGsB,cAAArB,KAGjBG,EAEAa,gBAACO,EAAEX,EAAA,CAAA,EACGE,EACJ,CAAAH,MAAOA,EAAKO,UACDtB,EACCuB,WAAAtB,aACAC,EAASsB,WACTrB,EACGsB,cAAArB,KAGjBI,EAEAY,gBAACQ,EAAEZ,EAAA,CAAA,EACGE,EACJ,CAAAH,MAAOA,EAAKO,UACDtB,EACCuB,WAAAtB,aACAC,EAASsB,WACTrB,EACGsB,cAAArB,KAGjBK,EAEAW,gBAACS,EAAEb,EAAA,CAAA,EACGE,EACJ,CAAAH,MAAOA,EAAKO,UACDtB,EACCuB,WAAAtB,aACAC,EAASsB,WACTrB,EACGsB,cAAArB,KAGjBM,EAEAU,gBAACU,EAAEd,EAAA,CAAA,EACGE,EACJ,CAAAH,MAAOA,EAAKO,UACDtB,EACCuB,WAAAtB,aACAC,EAASsB,WACTrB,EACGsB,cAAArB,KAInBgB,gBAACM,EAAEV,EAAA,CAAA,EACGE,EACJ,CAAAH,MAAOA,EAAKO,UACDtB,EACCuB,WAAAtB,aACAC,EAASsB,WACTrB,EACGsB,cAAArB,IAGrB"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n,__rest as t}from"../../../node_modules/tslib/tslib.es6.js";import e,{css as i}from"styled-components";import{spacing as r}from"../Spacing/index.js";var o,f,m,a,u,s,l,x=function(e){return i(o||(o=n(["\n font-family: ",";\n font-weight: ",";\n word-break: ",";\n overflow-wrap: ",";\n color: ",";\n line-height: ",";\n text-transform: ",";\n margin-top: ",";\n margin-bottom: ",";\n max-width: 100%;\n text-align: ",";\n\n &:first-child {\n margin-top: 0;\n }\n\n ","\n"],["\n font-family: ",";\n font-weight: ",";\n word-break: ",";\n overflow-wrap: ",";\n color: ",";\n line-height: ",";\n text-transform: ",";\n margin-top: ",";\n margin-bottom: ",";\n max-width: 100%;\n text-align: ",";\n\n &:first-child {\n margin-top: 0;\n }\n\n ","\n"])),e.theme.typography.fontFamilyHeadings,e.theme.typography.fontWeightHeadings,e.$wordBreak||"normal",e.$overflowWrap||"break-word",e.$textColor&&void 0!==e.theme.colors[e.$textColor]?e.theme.colors[e.$textColor]:e.$textColor||e.theme.colors.textHeaderDefault,e.theme.typography.headerLineHeight,e.theme.typography.headerTextTransform,e.theme.spacing.m,e.theme.spacing.s,e.$textAlign||"left",(function(){e.theme;var n=t(e,["theme"]);return r(n,e.theme)}))},h=function(n,t,e){switch(n){case"m":return e.fontSizes.m;case"l":return e.fontSizes.l;case"xl":return e.fontSizes.xl;case"xxl":return e.fontSizes.xxl;case"xxxl":return e.fontSizes.xxxl;case"xxxxl":return e.fontSizes.xxxxl;default:return t}},z=function(n,t,e){switch(n){case"m":return e.fontSizes.m;case"l":case"xl":return e.fontSizes.l;case"xxl":return e.fontSizes.xl;case"xxxl":return e.fontSizes.xxl;case"xxxxl":return e.fontSizes.xxxl;default:return t}},d=function(n,t,e){switch(n){case"m":return e.fontSizes.m;case"l":case"xl":case"xxl":return e.fontSizes.l;case"xxxl":return e.fontSizes.xl;case"xxxxl":return e.fontSizes.xxl;default:return t}},c=e.h1(f||(f=n(["\n ","\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"],["\n ","\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"])),(function(n){return x(n)}),(function(n){var t=n.theme,e=n.$textSize;return d(e||null,t.fontSizes.xxl,t)}),(function(n){return n.theme.breakpoint.tablet}),(function(n){var t=n.theme,e=n.$textSize;return z(e||null,t.fontSizes.xxxl,t)}),(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.theme,e=n.$textSize;return h(e||null,t.fontSizes.xxxxl,t)})),S=e.h2(m||(m=n(["\n ","\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"],["\n ","\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"])),(function(n){return x(n)}),(function(n){var t=n.theme,e=n.$textSize;return d(e||null,t.fontSizes.xl,t)}),(function(n){return n.theme.breakpoint.tablet}),(function(n){var t=n.theme,e=n.$textSize;return z(e||null,t.fontSizes.xxl,t)}),(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.theme,e=n.$textSize;return h(e||null,t.fontSizes.xxxl,t)})),p=e.h3(a||(a=n(["\n ","\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"],["\n ","\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"])),(function(n){return x(n)}),(function(n){var t=n.theme,e=n.$textSize;return d(e||null,t.fontSizes.l,t)}),(function(n){return n.theme.breakpoint.tablet}),(function(n){var t=n.theme,e=n.$textSize;return z(e||null,t.fontSizes.xl,t)}),(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.theme,e=n.$textSize;return h(e||null,t.fontSizes.xxl,t)})),w=e.h4(u||(u=n(["\n ","\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"],["\n ","\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"])),(function(n){return x(n)}),(function(n){var t=n.theme,e=n.$textSize;return d(e||null,t.fontSizes.l,t)}),(function(n){return n.theme.breakpoint.tablet}),(function(n){var t=n.theme,e=n.$textSize;return z(e||null,t.fontSizes.l,t)}),(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.theme,e=n.$textSize;return h(e||null,t.fontSizes.xl,t)})),b=e.h5(s||(s=n(["\n ","\n\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"],["\n ","\n\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"])),(function(n){return x(n)}),(function(n){var t=n.theme,e=n.$textSize;return d(e||null,t.fontSizes.l,t)}),(function(n){return n.theme.breakpoint.tablet}),(function(n){var t=n.theme,e=n.$textSize;return z(e||null,t.fontSizes.l,t)}),(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.theme,e=n.$textSize;return h(e||null,t.fontSizes.l,t)})),$=e.h6(l||(l=n(["\n ","\n\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"],["\n ","\n\n font-size: ",";\n @media (min-width: ",") {\n font-size: ",";\n }\n @media (min-width: ",") {\n font-size: ",";\n }\n"])),(function(n){return x(n)}),(function(n){var t=n.theme,e=n.$textSize;return d(e||null,t.fontSizes.m,t)}),(function(n){return n.theme.breakpoint.tablet}),(function(n){var t=n.theme,e=n.$textSize;return z(e||null,t.fontSizes.m,t)}),(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.theme,e=n.$textSize;return h(e||null,t.fontSizes.m,t)}));export{c as H1,S as H2,p as H3,w as H4,b as H5,$ as H6};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/Heading/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { spacing, type SpacingPropsInternal } from \"../Spacing\";\n\nimport {\n type ThemeType,\n type FontSizeType,\n type ColorKeyType,\n type WordBreakType,\n type OverflowWrapType,\n} from \"../../types\";\n\ntype StyledHeadingProps = SpacingPropsInternal & {\n theme: ThemeType;\n $textSize?: FontSizeType;\n $textAlign?: \"left\" | \"right\" | \"center\";\n $textColor?: string;\n $wordBreak?: WordBreakType;\n $overflowWrap?: OverflowWrapType;\n};\n\nconst StyledHeading = (props: StyledHeadingProps) => css`\n font-family: ${props.theme.typography.fontFamilyHeadings};\n font-weight: ${props.theme.typography.fontWeightHeadings};\n word-break: ${props.$wordBreak || \"normal\"};\n overflow-wrap: ${props.$overflowWrap || \"break-word\"};\n color: ${props.$textColor &&\n typeof props.theme.colors[props.$textColor as ColorKeyType] !== \"undefined\"\n ? props.theme.colors[props.$textColor as ColorKeyType]\n : props.$textColor || props.theme.colors.textHeaderDefault};\n line-height: ${props.theme.typography.headerLineHeight};\n text-transform: ${props.theme.typography.headerTextTransform};\n margin-top: ${props.theme.spacing.m};\n margin-bottom: ${props.theme.spacing.s};\n max-width: 100%;\n text-align: ${props.$textAlign || \"left\"};\n\n &:first-child {\n margin-top: 0;\n }\n\n ${() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { theme, ...propsWithoutTheme } = props;\n\n return spacing(propsWithoutTheme, props.theme);\n }}\n`;\n\nconst desktopFontSize = (\n $textSize: FontSizeType | null,\n defaultFontSize: string,\n theme: ThemeType,\n) => {\n switch ($textSize) {\n case \"m\":\n return theme.fontSizes.m;\n case \"l\":\n return theme.fontSizes.l;\n case \"xl\":\n return theme.fontSizes.xl;\n case \"xxl\":\n return theme.fontSizes.xxl;\n case \"xxxl\":\n return theme.fontSizes.xxxl;\n case \"xxxxl\":\n return theme.fontSizes.xxxxl;\n\n default:\n return defaultFontSize;\n }\n};\n\n// everything drops down a size on the typography scale\nconst tabletFontSize = (\n $textSize: FontSizeType | null,\n defaultFontSize: string,\n theme: ThemeType,\n) => {\n switch ($textSize) {\n case \"m\":\n return theme.fontSizes.m;\n case \"l\":\n return theme.fontSizes.l;\n case \"xl\":\n return theme.fontSizes.l;\n case \"xxl\":\n return theme.fontSizes.xl;\n case \"xxxl\":\n return theme.fontSizes.xxl;\n case \"xxxxl\":\n return theme.fontSizes.xxxl;\n\n default:\n return defaultFontSize;\n }\n};\n\n// everything drops down two sizes on the typography scale\nconst mobileFontSize = (\n $textSize: FontSizeType | null,\n defaultFontSize: string,\n theme: ThemeType,\n) => {\n switch ($textSize) {\n case \"m\":\n return theme.fontSizes.m;\n case \"l\":\n return theme.fontSizes.l;\n case \"xl\":\n return theme.fontSizes.l;\n case \"xxl\":\n return theme.fontSizes.l;\n case \"xxxl\":\n return theme.fontSizes.xl;\n case \"xxxxl\":\n return theme.fontSizes.xxl;\n\n default:\n return defaultFontSize;\n }\n};\n\nexport const H1 = styled.h1<StyledHeadingProps>`\n ${(props) => StyledHeading(props)}\n font-size: ${({ theme, $textSize }) =>\n mobileFontSize($textSize || null, theme.fontSizes.xxl, theme)};\n @media (min-width: ${({ theme }) => theme.breakpoint.tablet}) {\n font-size: ${({ theme, $textSize }) =>\n tabletFontSize($textSize || null, theme.fontSizes.xxxl, theme)};\n }\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n font-size: ${({ theme, $textSize }) =>\n desktopFontSize($textSize || null, theme.fontSizes.xxxxl, theme)};\n }\n`;\n\nexport const H2 = styled.h2<StyledHeadingProps>`\n ${(props) => StyledHeading(props)}\n font-size: ${({ theme, $textSize }) =>\n mobileFontSize($textSize || null, theme.fontSizes.xl, theme)};\n @media (min-width: ${({ theme }) => theme.breakpoint.tablet}) {\n font-size: ${({ theme, $textSize }) =>\n tabletFontSize($textSize || null, theme.fontSizes.xxl, theme)};\n }\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n font-size: ${({ theme, $textSize }) =>\n desktopFontSize($textSize || null, theme.fontSizes.xxxl, theme)};\n }\n`;\n\nexport const H3 = styled.h3<StyledHeadingProps>`\n ${(props) => StyledHeading(props)}\n font-size: ${({ theme, $textSize }) =>\n mobileFontSize($textSize || null, theme.fontSizes.l, theme)};\n @media (min-width: ${({ theme }) => theme.breakpoint.tablet}) {\n font-size: ${({ theme, $textSize }) =>\n tabletFontSize($textSize || null, theme.fontSizes.xl, theme)};\n }\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n font-size: ${({ theme, $textSize }) =>\n desktopFontSize($textSize || null, theme.fontSizes.xxl, theme)};\n }\n`;\n\nexport const H4 = styled.h4<StyledHeadingProps>`\n ${(props) => StyledHeading(props)}\n font-size: ${({ theme, $textSize }) =>\n mobileFontSize($textSize || null, theme.fontSizes.l, theme)};\n @media (min-width: ${({ theme }) => theme.breakpoint.tablet}) {\n font-size: ${({ theme, $textSize }) =>\n tabletFontSize($textSize || null, theme.fontSizes.l, theme)};\n }\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n font-size: ${({ theme, $textSize }) =>\n desktopFontSize($textSize || null, theme.fontSizes.xl, theme)};\n }\n`;\n\nexport const H5 = styled.h5<StyledHeadingProps>`\n ${(props) => StyledHeading(props)}\n\n font-size: ${({ theme, $textSize }) =>\n mobileFontSize($textSize || null, theme.fontSizes.l, theme)};\n @media (min-width: ${({ theme }) => theme.breakpoint.tablet}) {\n font-size: ${({ theme, $textSize }) =>\n tabletFontSize($textSize || null, theme.fontSizes.l, theme)};\n }\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n font-size: ${({ theme, $textSize }) =>\n desktopFontSize($textSize || null, theme.fontSizes.l, theme)};\n }\n`;\n\nexport const H6 = styled.h6<StyledHeadingProps>`\n ${(props) => StyledHeading(props)}\n\n font-size: ${({ theme, $textSize }) =>\n mobileFontSize($textSize || null, theme.fontSizes.m, theme)};\n @media (min-width: ${({ theme }) => theme.breakpoint.tablet}) {\n font-size: ${({ theme, $textSize }) =>\n tabletFontSize($textSize || null, theme.fontSizes.m, theme)};\n }\n @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n font-size: ${({ theme, $textSize }) =>\n desktopFontSize($textSize || null, theme.fontSizes.m, theme)};\n }\n`;\n"],"names":["StyledHeading","props","css","templateObject_1","__makeTemplateObject","theme","typography","fontFamilyHeadings","fontWeightHeadings","$wordBreak","$overflowWrap","$textColor","colors","textHeaderDefault","headerLineHeight","headerTextTransform","spacing","m","s","$textAlign","propsWithoutTheme","__rest","desktopFontSize","$textSize","defaultFontSize","fontSizes","l","xl","xxl","xxxl","xxxxl","tabletFontSize","mobileFontSize","H1","styled","h1","templateObject_2","_a","breakpoint","tablet","desktop","H2","h2","templateObject_3","H3","h3","templateObject_4","H4","h4","templateObject_5","H5","h5","templateObject_6","H6","h6","templateObject_7"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ import{__rest as e,__assign as o}from"../../../node_modules/tslib/tslib.es6.js";import t from"react";import{useTheme as r}from"styled-components";import{crukTheme as m}from"../../themes/cruk.js";import{StyledIcon as s}from"./styles.js";function c(c){var i=c.faIcon,n=c.color,a=c.size,l=void 0===a?"1.1rem":a,f=e(c,["faIcon","color","size"]),p=r(),d=o(o({},m),p),u=i.icon,h=u[0],j=u[1],v=u[4];return t.createElement(s,o({theme:d,"alt-text":"",role:"presentation",viewBox:"0 0 ".concat(h," ").concat(j),size:l||"1.1rem",color:n},f),v&&t.createElement("path",{d:v}))}export{c as IconFa,c as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/IconFa/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTheme } from \"styled-components\";\nimport { type IconDefinition } from \"@fortawesome/fontawesome-common-types\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { StyledIcon } from \"./styles\";\n\nexport type IconFaProps = {\n /** imported icon definition from \"@fortawesome/free-solid-svg-icons\" or \"@fortawesome/free-brands-svg-icons\" */\n faIcon: IconDefinition;\n /** color of icon, inherits current text colour by default */\n color?: string;\n /** size of ion 1.1em by default */\n size?: string;\n};\n\n/**\n * The IconFa component (Icon Font Awesome) displays an icon glyph as an `<svg>` element.\n *\n * This is an svg icon wrapper where a font awesome icon definition can be passed in a long with colour and size\n * */\nexport function IconFa({\n faIcon,\n color,\n size = \"1.1rem\",\n ...rest\n}: IconFaProps) {\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n\n const [width, height, , , svgPathData] = faIcon.icon;\n\n return (\n <StyledIcon\n theme={theme}\n alt-text=\"\"\n role=\"presentation\"\n viewBox={`0 0 ${width} ${height}`}\n size={size || \"1.1rem\"}\n color={color}\n {...rest}\n >\n {svgPathData && <path d={svgPathData as string} />}\n </StyledIcon>\n );\n}\n\nexport default IconFa;\n"],"names":["IconFa","_a","faIcon","color","_b","size","rest","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","_c","icon","width","height","svgPathData","React","createElement","StyledIcon","role","viewBox","concat","d"],"mappings":"4OAqBM,SAAUA,EAAOC,GACrB,IAAAC,EAAMD,EAAAC,OACNC,EAAKF,EAAAE,MACLC,EAAeH,EAAAI,KAAfA,OAAI,IAAAD,EAAG,SAAQA,EACZE,EAAIC,EAAAN,EAJc,2BAMfO,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGCK,EAAmCX,EAAOY,KAAzCC,EAAKF,EAAA,GAAEG,EAAMH,EAAA,GAAMI,OAE1B,OACEC,EAACC,cAAAC,KACCV,MAAOA,EACE,WAAA,GACTW,KAAK,eACLC,QAAS,OAAOC,OAAAR,cAASC,GACzBX,KAAMA,GAAQ,SACdF,MAAOA,GACHG,GAEHW,GAAeC,wBAAMM,EAAGP,IAG/B"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import i from"styled-components";var t,e=i.svg(t||(t=n(["\n display: inline-block;\n height: ",";\n margin-top: -0.2em;\n vertical-align: middle;\n width: ",";\n path {\n fill: ",";\n }\n"],["\n display: inline-block;\n height: ",";\n margin-top: -0.2em;\n vertical-align: middle;\n width: ",";\n path {\n fill: ",";\n }\n"])),(function(n){return n.size}),(function(n){return n.size}),(function(n){var i=n.theme.colors,t=n.color;return t&&void 0!==i[t]?i[t]:t||"currentColor"}));export{e as StyledIcon,e as default};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/IconFa/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType, type ColorKeyType } from \"../../types\";\n\ntype StyledIconProp = {\n theme: ThemeType;\n color?: string;\n size: string;\n};\n\nexport const StyledIcon = styled.svg<StyledIconProp>`\n display: inline-block;\n height: ${(props) => props.size};\n margin-top: -0.2em;\n vertical-align: middle;\n width: ${(props) => props.size};\n path {\n fill: ${({ theme: { colors }, color }) =>\n color && typeof colors[color as ColorKeyType] !== \"undefined\"\n ? colors[color as ColorKeyType]\n : color || \"currentColor\"};\n }\n`;\n\nexport default StyledIcon;\n"],"names":["StyledIcon","styled","svg","templateObject_1","__makeTemplateObject","props","size","_a","colors","theme","color"],"mappings":"iHASa,MAAAA,EAAaC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,yCAAA,iEAAA,0BAAA,YAAA,CAAgB,yCAEnB,iEAGD,0BAKC,eARrB,SAACC,GAAU,OAAAA,EAAMC,IAAN,IAGZ,SAACD,GAAU,OAAAA,EAAMC,IAAI,IAEpB,SAACC,OAAWC,EAAMD,EAAAE,MAAAD,OAAIE,EAAKH,EAAAG,MACjC,OAAAA,QAAkD,IAAlCF,EAAOE,GACnBF,EAAOE,GACPA,GAAS,cAFb"}
@@ -0,0 +1,2 @@
1
+ import{__rest as e,__assign as t}from"../../../node_modules/tslib/tslib.es6.js";import o,{forwardRef as r}from"react";import{useTheme as i}from"styled-components";import{crukTheme as n}from"../../themes/cruk.js";import{Box as m}from"../Box/index.js";import{Text as l}from"../Text/index.js";import{Heading as s}from"../Heading/index.js";import{StyledInfoBox as a}from"./styles.js";var c=r((function(r,c){var x=r.children,d=r.titleText,p=r.titleTextColor,f=r.descriptionText,g=r.descriptionTextColor,C=r.icon,T=e(r,["children","titleText","titleTextColor","descriptionText","descriptionTextColor","icon"]),u=i(),h=t(t({},n),u),j=T.backgroundColor||h.tokenColors.grey_200;return o.createElement(a,t({theme:h},T,{backgroundColor:j,margin:T.margin||"none",ref:c}),C&&o.createElement(m,{marginRight:"s"},C),o.createElement("div",null,d&&o.createElement(s,{as:"p",margin:"none",h4:!0,marginBottom:"xxs",textColor:p||h.colors.textDark},d),f&&o.createElement(l,{textColor:g||h.colors.textDark,marginBottom:"none"},f),x))}));export{c as InfoBox,c as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/InfoBox/index.tsx"],"sourcesContent":["import React, {\n type HTMLAttributes,\n type Ref,\n forwardRef,\n type ReactNode,\n type ElementType,\n} from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { Box } from \"../Box\";\nimport { Text } from \"../Text\";\nimport { Heading } from \"../Heading\";\n\nimport { type SpacingProps } from \"../Spacing\";\nimport { StyledInfoBox } from \"./styles\";\n\nexport type InfoBoxProps = SpacingProps &\n HTMLAttributes<HTMLElement> & {\n /** background color of wrapping element, this will add default padding */\n backgroundColor?: string;\n /** Title text */\n titleText: string;\n /** Title text colour */\n titleTextColor?: string;\n /** Description text */\n descriptionText: string;\n /** Description text colour */\n descriptionTextColor?: string;\n /** Space for extra element underneath description */\n children?: ReactNode;\n /** Icon in left column usually 2em squared */\n icon?: ReactNode;\n ref?: Ref<HTMLElement>;\n /** styled-component polymorphic feature so you take the styling of a box and cast the component to be a \"span\" for example */\n as?: ElementType;\n };\n\n/**\n * Box is used to wrap other components to add margin and padding. The values will be in the t-shirt sizes specified in the theme sizes.\n \n The more specific the the target the higher priority the css will have. For example `margin` will be overridden by the `marginVertical` or `marginHorizontal` props. `marginTop`, `marginBottom`, `marginLeft`, `marginRight` will override the the `marginVertical` and `marginHorizontal` props.\n */\nexport const InfoBox = forwardRef(\n (\n {\n children,\n titleText,\n titleTextColor,\n descriptionText,\n descriptionTextColor,\n icon,\n ...spacingAndHTMLElementProps\n }: InfoBoxProps,\n ref?: Ref<HTMLElement>,\n ) => {\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n\n const backgroundColorOrDefault =\n spacingAndHTMLElementProps.backgroundColor || theme.tokenColors.grey_200;\n\n return (\n <StyledInfoBox\n theme={theme}\n {...spacingAndHTMLElementProps}\n backgroundColor={backgroundColorOrDefault}\n margin={spacingAndHTMLElementProps.margin || \"none\"}\n ref={ref}\n >\n {icon && <Box marginRight=\"s\">{icon}</Box>}\n <div>\n {titleText && (\n <Heading\n as=\"p\"\n margin=\"none\"\n h4\n marginBottom=\"xxs\"\n textColor={titleTextColor || theme.colors.textDark}\n >\n {titleText}\n </Heading>\n )}\n {descriptionText && (\n <Text\n textColor={descriptionTextColor || theme.colors.textDark}\n marginBottom=\"none\"\n >\n {descriptionText}\n </Text>\n )}\n {children}\n </div>\n </StyledInfoBox>\n );\n },\n);\n\nexport default InfoBox;\n"],"names":["InfoBox","forwardRef","_a","ref","children","titleText","titleTextColor","descriptionText","descriptionTextColor","icon","spacingAndHTMLElementProps","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","backgroundColorOrDefault","backgroundColor","tokenColors","grey_200","React","createElement","StyledInfoBox","margin","Box","marginRight","Heading","as","h4","marginBottom","textColor","colors","textDark","Text"],"mappings":"gYA2CaA,EAAUC,GACrB,SACEC,EASAC,GARE,IAAAC,aACAC,cACAC,mBACAC,oBACAC,yBACAC,SACGC,EAPLC,EAAAT,EAAA,CAAA,WAAA,YAAA,iBAAA,kBAAA,uBAAA,SAWMU,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGCK,EACJP,EAA2BQ,iBAAmBJ,EAAMK,YAAYC,SAElE,OACEC,EAACC,cAAAC,EACCR,EAAA,CAAAD,MAAOA,GACHJ,EAA0B,CAC9BQ,gBAAiBD,EACjBO,OAAQd,EAA2Bc,QAAU,OAC7CrB,IAAKA,IAEJM,GAAQY,gBAACI,EAAG,CAACC,YAAY,KAAKjB,GAC/BY,EAAAC,cAAA,MAAA,KACGjB,GACCgB,EAACC,cAAAK,EACC,CAAAC,GAAG,IACHJ,OAAO,OACPK,IAAE,EACFC,aAAa,MACbC,UAAWzB,GAAkBQ,EAAMkB,OAAOC,UAEzC5B,GAGJE,GACCc,EAACC,cAAAY,GACCH,UAAWvB,GAAwBM,EAAMkB,OAAOC,SAChDH,aAAa,QAEZvB,GAGJH,GAIT"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import s,{css as o}from"styled-components";import{Box as r}from"../Box/index.js";var e,i,t=s(r)(i||(i=n(["\n display: flex;\n flex-shrink: 0;\n\n svg {\n margin-top: 0;\n }\n\n ","\n"],["\n display: flex;\n flex-shrink: 0;\n\n svg {\n margin-top: 0;\n }\n\n ","\n"])),(function(s){return s.css&&o(e||(e=n(["\n ","\n "],["\n ","\n "])),s.css)}));export{t as StyledInfoBox,t as default};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/InfoBox/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { type ThemeType } from \"../../types\";\nimport Box, { type BoxProps } from \"../Box\";\n\ntype InfoBoxProps = BoxProps & {\n css?: string;\n theme: ThemeType;\n};\n\nexport const StyledInfoBox = styled(Box)<InfoBoxProps>`\n display: flex;\n flex-shrink: 0;\n\n svg {\n margin-top: 0;\n }\n\n ${(props) =>\n props.css &&\n css`\n ${props.css}\n `}\n`;\n\nexport default StyledInfoBox;\n"],"names":["StyledInfoBox","styled","Box","templateObject_2","__makeTemplateObject","props","css","templateObject_1"],"mappings":"iKAUO,QAAMA,EAAgBC,EAAOC,EAAPD,CAAWE,IAAAA,EAAAC,EAAA,CAAA,kFAAA,MAAA,CAAc,kFAYjD,SAJD,SAACC,GACD,OAAAA,EAAMC,KACNA,EAAGC,IAAAA,EAAAH,EAAA,CAAA,WAAA,UAAA,CAAA,WACU,YAATC,EAAMC,IAFV"}
@@ -0,0 +1,2 @@
1
+ import{__rest as e,__assign as t}from"../../../node_modules/tslib/tslib.es6.js";import r from"react";import{useTheme as l,ThemeProvider as n}from"styled-components";import{Text as i}from"../Text/index.js";import{crukTheme as m}from"../../themes/cruk.js";import{Label as o,LabelText as a,RequiredText as d}from"./styles.js";function s(s){var u=s.label,c=s.hintText,f=s.required,h=void 0!==f&&f,p=s.hideRequiredInLabel,b=void 0!==p&&p,x=s.children,E=e(s,["label","hintText","required","hideRequiredInLabel","children"]),q=l(),j=t(t({},m),q),y=c&&("string"==typeof c&&c.length||"number"==typeof c)?r.createElement(i,null,c):c;return r.createElement(n,{theme:j},u?r.createElement(o,t({},E),r.createElement(a,{$hasHintText:!!c},u,h&&!b&&r.createElement(d,null," (required)")),y,x):r.createElement(r.Fragment,null,x))}export{s as LabelWrapper,s as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/LabelWrapper/index.tsx"],"sourcesContent":["import React, { type LabelHTMLAttributes, type ReactNode } from \"react\";\nimport { useTheme, ThemeProvider } from \"styled-components\";\n\nimport { Text } from \"../Text\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { LabelText, Label, RequiredText } from \"./styles\";\n\ntype LabelWrapperProps = LabelHTMLAttributes<HTMLLabelElement> & {\n /** label text */\n label: string;\n /** hint text or react element in it's place */\n hintText?: ReactNode;\n /** when required (required) appears in label */\n required?: boolean;\n /** flag to stop (required) appearing in label, useful for compound form components like DateInput */\n hideRequiredInLabel?: boolean;\n children?: ReactNode;\n};\n\nexport function LabelWrapper({\n label,\n hintText,\n required = false,\n hideRequiredInLabel = false,\n children,\n ...otherHTMLLabelProps\n}: LabelWrapperProps) {\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n\n const hintTextElement =\n !!hintText &&\n ((typeof hintText === \"string\" && hintText.length) ||\n typeof hintText === \"number\") ? (\n <Text>{hintText}</Text>\n ) : (\n hintText\n );\n\n return (\n <ThemeProvider theme={theme}>\n {label ? (\n <Label {...otherHTMLLabelProps}>\n <LabelText $hasHintText={!!hintText}>\n {label}\n {required && !hideRequiredInLabel && (\n <RequiredText>{` (required)`}</RequiredText>\n )}\n </LabelText>\n {hintTextElement}\n {children}\n </Label>\n ) : (\n <>{children}</>\n )}\n </ThemeProvider>\n );\n}\n\nexport default LabelWrapper;\n"],"names":["LabelWrapper","_a","label","hintText","_b","required","_c","hideRequiredInLabel","children","otherHTMLLabelProps","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","hintTextElement","length","React","createElement","Text","ThemeProvider","Label","LabelText","$hasHintText","RequiredText","Fragment"],"mappings":"mUAoBM,SAAUA,EAAaC,GAC3B,IAAAC,EAAKD,EAAAC,MACLC,EAAQF,EAAAE,SACRC,EAAAH,EAAAI,SAAAA,OAAW,IAAAD,GAAKA,EAChBE,wBAAAC,OAAsB,IAAAD,GAAKA,EAC3BE,EAAQP,EAAAO,SACLC,EANwBC,EAAAT,EAAA,CAAA,QAAA,WAAA,WAAA,sBAAA,aAQrBU,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGCK,EACFb,IACoB,iBAAbA,GAAyBA,EAASc,QACrB,iBAAbd,GACPe,EAACC,cAAAC,OAAMjB,GAEP,EAGJ,OACEe,EAACC,cAAAE,EAAc,CAAAR,MAAOA,GACnBX,EACCgB,EAACC,cAAAG,OAAUb,GACTS,EAAAC,cAACI,EAAS,CAAAC,eAAiBrB,GACxBD,EACAG,IAAaE,GACZW,EAACC,cAAAM,EAAc,KAAA,gBAGlBT,EACAR,GAGHU,EAAGC,cAAAD,EAAAQ,SAAA,KAAAlB,GAIX"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import t from"styled-components";var o,e,i,a=t.label(o||(o=n(["\n position: relative;\n display: block;\n width: 100%;\n font-family: ",";\n font-weight: ",";\n"],["\n position: relative;\n display: block;\n width: 100%;\n font-family: ",";\n font-weight: ",";\n"])),(function(n){return n.theme.typography.fontFamilyLabel}),(function(n){return n.theme.typography.fontWeightLabels})),f=t.span(e||(e=n(["\n font-family: ",";\n font-weight: ",";\n"],["\n font-family: ",";\n font-weight: ",";\n"])),(function(n){return n.theme.typography.fontFamilyLabel}),(function(n){return n.theme.typography.fontWeightBase})),r=t.span(i||(i=n(["\n font-family: ",";\n font-weight: ",";\n display: block;\n margin-bottom: ",";\n"],["\n font-family: ",";\n font-weight: ",";\n display: block;\n margin-bottom: ",";\n"])),(function(n){return n.theme.typography.fontFamilyLabel}),(function(n){return n.theme.typography.fontWeightLabels}),(function(n){var t=n.$hasHintText,o=n.theme;return t?o.spacing.xxs:o.spacing.xs}));export{a as Label,r as LabelText,f as RequiredText};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/LabelWrapper/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ntype LabelTextProp = {\n $hasHintText: boolean;\n theme: ThemeType;\n};\n\nexport const Label = styled.label<{ theme: ThemeType }>`\n position: relative;\n display: block;\n width: 100%;\n font-family: ${({ theme }) => theme.typography.fontFamilyLabel};\n font-weight: ${({ theme }) => theme.typography.fontWeightLabels};\n`;\n\nexport const RequiredText = styled.span<{ theme: ThemeType }>`\n font-family: ${({ theme }) => theme.typography.fontFamilyLabel};\n font-weight: ${({ theme }) => theme.typography.fontWeightBase};\n`;\n\nexport const LabelText = styled.span<LabelTextProp>`\n font-family: ${({ theme }) => theme.typography.fontFamilyLabel};\n font-weight: ${({ theme }) => theme.typography.fontWeightLabels};\n display: block;\n margin-bottom: ${({ $hasHintText, theme }) =>\n $hasHintText ? theme.spacing.xxs : theme.spacing.xs};\n`;\n"],"names":["Label","styled","label","templateObject_1","__makeTemplateObject","_a","theme","typography","fontFamilyLabel","fontWeightLabels","RequiredText","span","templateObject_2","fontWeightBase","LabelText","templateObject_3","$hasHintText","spacing","xxs","xs"],"mappings":"iHAQO,UAAMA,EAAQC,EAAOC,MAA2BC,IAAAA,EAAAC,EAAA,CAAA,8EAAA,qBAAA,OAAA,CAAA,8EAIS,qBACC,UADhD,SAACC,GAAc,OAAPA,EAAAC,MAAaC,WAAWC,eAAjB,IACf,SAACH,GAAc,OAAPA,EAAAC,MAAaC,WAAWE,gBAAjB,IAGnBC,EAAeT,EAAOU,KAA0BC,IAAAA,EAAAR,EAAA,CAAA,oBAAA,qBAAA,OAAA,CAAA,oBACG,qBACD,UAD9C,SAACC,GAAc,OAAPA,EAAAC,MAAaC,WAAWC,eAAjB,IACf,SAACH,GAAc,OAAPA,EAAAC,MAAaC,WAAWM,cAAjB,IAGnBC,EAAYb,EAAOU,KAAII,IAAAA,EAAAX,EAAA,CAAA,oBAAA,qBAAA,0CAAA,OAAA,CAAe,oBACa,qBACC,0CAGV,UAJtC,SAACC,GAAc,OAAPA,EAAAC,MAAaC,WAAWC,eAAjB,IACf,SAACH,GAAc,OAAPA,EAAAC,MAAaC,WAAWE,gBAAjB,IAEb,SAACJ,OAAEW,EAAYX,EAAAW,aAAEV,EAAKD,EAAAC,MACrC,OAAAU,EAAeV,EAAMW,QAAQC,IAAMZ,EAAMW,QAAQE,EAAjD"}
@@ -0,0 +1,2 @@
1
+ import{__rest as e,__assign as r}from"../../../node_modules/tslib/tslib.es6.js";import t from"react";import{useTheme as n,ThemeProvider as o}from"styled-components";import{crukTheme as s}from"../../themes/cruk.js";import{ErrorText as m}from"../ErrorText/index.js";import{Text as i}from"../Text/index.js";import{StyledFieldset as a,LegendSpan as l}from"./styles.js";function d(d){var p=d.children,c=d.legendText,x=d.required,f=d.errorMessage,h=d.hasError,E=d.hintText,u=e(d,["children","legendText","required","errorMessage","hasError","hintText"]),T=n(),g=r(r({},s),T),j=!E||"string"!=typeof E&&"number"!=typeof E?E:t.createElement(i,{as:"span"},E);return t.createElement(o,{theme:g},t.createElement(a,{$hasError:h||!!f||!1,$hasHintText:!!E},c&&t.createElement("legend",r({},u),t.createElement(l,{$hasHintText:!!E},c," ",x&&t.createElement("span",null,"(required)")),j),p,!!f&&t.createElement(m,{marginTop:"xxs"},f)))}export{d as LegendWrapper,d as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/LegendWrapper/index.tsx"],"sourcesContent":["import React, { type HTMLAttributes, type ReactNode } from \"react\";\nimport { useTheme, ThemeProvider } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { ErrorText } from \"../ErrorText\";\nimport { Text } from \"../Text\";\n\nimport { StyledFieldset, LegendSpan } from \"./styles\";\n\nexport type LegendWrapperProps = HTMLAttributes<HTMLLegendElement> & {\n children?: ReactNode;\n /** legend text */\n legendText: string;\n /** error message text */\n errorMessage?: string;\n /** flag for error styling */\n hasError?: boolean;\n /** when required (required) appears in legend */\n required?: boolean;\n /** hint text */\n hintText?: ReactNode;\n};\n/**\n * LegendWrapper allows the user to add an outer label for a checkbox / group of checkboxes / radio buttons or a group of radio buttons.\n *\n * hasError and errorMessage props are just props that can be passed into the component.\n * There is no functionality checking if the children are valid/required etc this functionality will be needed to ne added outside of this component.\n */\nexport function LegendWrapper({\n children,\n legendText,\n required,\n errorMessage,\n hasError,\n hintText,\n ...restOfHTMLAttributes\n}: LegendWrapperProps) {\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n\n const hintTextElement =\n !!hintText &&\n (typeof hintText === \"string\" || typeof hintText === \"number\") ? (\n <Text as=\"span\">{hintText}</Text>\n ) : (\n hintText\n );\n return (\n <ThemeProvider theme={theme}>\n <StyledFieldset\n $hasError={hasError || !!errorMessage || false}\n $hasHintText={!!hintText}\n >\n {legendText && (\n <legend {...restOfHTMLAttributes}>\n <LegendSpan $hasHintText={!!hintText}>\n {legendText} {required && <span>(required)</span>}\n </LegendSpan>\n {hintTextElement}\n </legend>\n )}\n {children}\n {!!errorMessage && (\n <ErrorText marginTop=\"xxs\">{errorMessage}</ErrorText>\n )}\n </StyledFieldset>\n </ThemeProvider>\n );\n}\n\nexport default LegendWrapper;\n"],"names":["LegendWrapper","_a","children","legendText","required","errorMessage","hasError","hintText","restOfHTMLAttributes","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","hintTextElement","React","createElement","Text","as","ThemeProvider","StyledFieldset","$hasError","$hasHintText","LegendSpan","ErrorText","marginTop"],"mappings":"6WA4BM,SAAUA,EAAcC,GAC5B,IAAAC,aACAC,eACAC,aACAC,iBACAC,aACAC,aACGC,EAPyBC,EAAAR,EAAA,CAAA,WAAA,aAAA,WAAA,eAAA,WAAA,aAStBS,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGCK,GACFR,GACmB,iBAAbA,GAA6C,iBAAbA,EACL,EAAjCS,EAAAC,cAACC,EAAI,CAACC,GAAG,QAAQZ,GAIrB,OACES,EAACC,cAAAG,EAAc,CAAAR,MAAOA,GACpBI,EAAAC,cAACI,EAAc,CAAAC,UACFhB,KAAcD,IAAgB,EAAKkB,eAC9BhB,GAEfJ,GACCa,EAAAC,cAAA,SAAAJ,EAAA,CAAA,EAAYL,GACVQ,EAAAC,cAACO,EAAU,CAAAD,eAAiBhB,GACzBJ,MAAaC,GAAYY,2CAE3BD,GAGJb,IACEG,GACDW,EAAAC,cAACQ,EAAU,CAAAC,UAAU,OAAOrB,IAKtC"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o from"styled-components";var t,e,r=o.span(t||(t=n(["\n display: block;\n color: ",";\n font-size: ",";\n line-height: ",";\n font-weight: ",";\n font-family: ",";\n min-width: 3em;\n margin-bottom: ",";\n\n & > * {\n font-weight: ",";\n }\n"],["\n display: block;\n color: ",";\n font-size: ",";\n line-height: ",";\n font-weight: ",";\n font-family: ",";\n min-width: 3em;\n margin-bottom: ",";\n\n & > * {\n font-weight: ",";\n }\n"])),(function(n){return n.theme.colors.textDark}),(function(n){return n.theme.fontSizes.m}),(function(n){return n.theme.typography.lineHeight}),(function(n){return n.theme.typography.fontWeightLabels}),(function(n){return n.theme.typography.fontFamilyLabel}),(function(n){var o=n.$hasHintText,t=n.theme;return o?t.spacing.xxs:0}),(function(n){return n.theme.typography.fontWeightBase})),i=o.fieldset(e||(e=n(["\n *,\n *:after,\n *:before {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n border: none;\n padding: 0;\n legend {\n margin-bottom: ",";\n }\n label {\n border-color: ",";\n margin-bottom: ",";\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n"],["\n *,\n *:after,\n *:before {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n border: none;\n padding: 0;\n legend {\n margin-bottom: ",";\n }\n label {\n border-color: ",";\n margin-bottom: ",";\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n"])),(function(n){return n.theme.spacing.xs}),(function(n){var o=n.$hasError,t=n.theme;return o&&t.colors.textError}),(function(n){return n.theme.spacing.none}));export{r as LegendSpan,i as StyledFieldset};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/LegendWrapper/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { type ThemeType } from \"../../types\";\n\ntype StyledFieldsetProps = {\n $hasError?: boolean;\n $hasHintText?: boolean;\n theme: ThemeType;\n};\n\nexport const LegendSpan = styled.span<{\n $hasHintText: boolean;\n theme: ThemeType;\n}>`\n display: block;\n color: ${({ theme }) => theme.colors.textDark};\n font-size: ${({ theme }) => theme.fontSizes.m};\n line-height: ${({ theme }) => theme.typography.lineHeight};\n font-weight: ${({ theme }) => theme.typography.fontWeightLabels};\n font-family: ${({ theme }) => theme.typography.fontFamilyLabel};\n min-width: 3em;\n margin-bottom: ${({ $hasHintText, theme }) =>\n $hasHintText ? theme.spacing.xxs : 0};\n\n & > * {\n font-weight: ${({ theme }) => theme.typography.fontWeightBase};\n }\n`;\n\nexport const StyledFieldset = styled.fieldset<StyledFieldsetProps>`\n *,\n *:after,\n *:before {\n -webkit-box-sizing: border-box;\n -moz-box-sizing: border-box;\n box-sizing: border-box;\n }\n border: none;\n padding: 0;\n legend {\n margin-bottom: ${({ theme }) => theme.spacing.xs};\n }\n label {\n border-color: ${({ $hasError, theme }) =>\n $hasError && theme.colors.textError};\n margin-bottom: ${({ theme }) => theme.spacing.none};\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n`;\n"],"names":["LegendSpan","styled","span","templateObject_1","__makeTemplateObject","_a","theme","colors","textDark","fontSizes","m","typography","lineHeight","fontWeightLabels","fontFamilyLabel","$hasHintText","spacing","xxs","fontWeightBase","StyledFieldset","fieldset","templateObject_2","xs","$hasError","textError","none"],"mappings":"iHAUa,QAAAA,EAAaC,EAAOC,KAAIC,IAAAA,EAAAC,EAAA,CAAA,iCAAA,mBAAA,qBAAA,qBAAA,qBAAA,0CAAA,oCAAA,YAAA,CAGnC,iCAE6C,mBACA,qBACY,qBACM,qBACD,0CAGxB,oCAGyB,eAVtD,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,QAAb,IACX,SAACH,GAAc,OAAPA,EAAAC,MAAaG,UAAUC,CAAhB,IACb,SAACL,GAAc,OAAPA,EAAAC,MAAaK,WAAWC,UAAjB,IACf,SAACP,GAAc,OAAPA,EAAAC,MAAaK,WAAWE,gBAAjB,IACf,SAACR,GAAc,OAAPA,EAAAC,MAAaK,WAAWG,eAAjB,IAEb,SAACT,OAAEU,EAAYV,EAAAU,aAAET,EAAKD,EAAAC,MACrC,OAAAS,EAAeT,EAAMU,QAAQC,IAAM,CAAnC,IAGe,SAACZ,GAAc,OAAPA,EAAAC,MAAaK,WAAWO,cAAjB,IAIrBC,EAAiBlB,EAAOmB,SAAQC,IAAAA,EAAAjB,EAAA,CAAA,6MAAA,wCAAA,yBAAA,kEAAA,CAAqB,6MAWd,wCAIX,yBACa,qEALjC,SAACC,GAAc,OAAPA,EAAAC,MAAaU,QAAQM,EAAd,IAGhB,SAACjB,OAAEkB,EAASlB,EAAAkB,UAAEjB,EAAKD,EAAAC,MACjC,OAAAiB,GAAajB,EAAMC,OAAOiB,SAA1B,IACe,SAACnB,GAAc,OAAPA,EAAAC,MAAaU,QAAQS,IAAd"}
@@ -0,0 +1,2 @@
1
+ import{__assign as e,__rest as r}from"../../../node_modules/tslib/tslib.es6.js";import o,{forwardRef as t}from"react";import{useTheme as a,ThemeProvider as m}from"styled-components";import{crukTheme as l}from"../../themes/cruk.js";import{StyledLink as n}from"./styles.js";var s=t((function(t,s){var p=a(),c=e(e({},l),p),f=t.rel?t.rel:"_blank"===t.target?"noopener noreferrer":"",i=t.as&&"a"!==t.as?void 0:"a",d=t.textHoverColor,v=t.appearance,u=r(t,["textHoverColor","appearance"]);return o.createElement(m,{theme:c},o.createElement(n,e({},u,{$textHoverColor:d,$appearance:v,theme:c,rel:f,forwardedAs:i,ref:s}),t.children))}));export{s as Link,s as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Link/index.tsx"],"sourcesContent":["import React, {\n type AnchorHTMLAttributes,\n forwardRef,\n type Ref,\n type ElementType,\n type ReactNode,\n} from \"react\";\nimport { useTheme, ThemeProvider } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { type TextProps } from \"../Text\";\nimport { StyledLink } from \"./styles\";\n\nexport type LinkProps = Omit<AnchorHTMLAttributes<HTMLElement>, \"nonce\"> &\n Omit<TextProps, \"as\" | \"ref\" | \"nonce\"> & {\n /** link text hover colour */\n textHoverColor?: string;\n /** link appearance variant, undefined is a standarding link withing a text block */\n appearance?: \"primary\" | \"secondary\";\n /** styled-components polymorphism where you can use the styling of a link but convert to another element like a button */\n ref?: Ref<HTMLElement>;\n /** styled-component polymorphic feature so you take the styling of a link and cast the component to be a \"span\" for example */\n as?: ElementType;\n /** Component children */\n children?: ReactNode;\n };\n\n/** Links are for wrapping plain text or elements to create clickable link.\n * This is to be treated as an anchor tag with the addition of the Text component API.\n * This component contains standard Anchor tag props like 'href' and 'target', but it also contains Text component props like 'textColor' and 'textAlign'.\n *\n * A link should really only be used for navigation to take a user to as new location.\n * The onClick handler can be use for more complicated scenarios.\n *\n * If you want something that looks like a link but behaves like a button ie. nothing to do with navigation, please consider using Link with as='button'\n *\n * If you want something that looks like a button but behaves like a link ie. it takes the user to a new location, please consider using Button and simply passing it an href, it will automatically turn into a link. */\nexport const Link = forwardRef((props: LinkProps, ref?: Ref<HTMLElement>) => {\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n // security by default\n const rel = props.rel\n ? props.rel\n : props.target === \"_blank\"\n ? \"noopener noreferrer\"\n : \"\";\n\n // only forward As anchor if we are not casting as something that is not an anchor\n const forwardAs = props.as && props.as !== \"a\" ? undefined : \"a\";\n\n const { textHoverColor, appearance, ...rest } = props;\n\n return (\n <ThemeProvider theme={theme}>\n <StyledLink\n {...rest}\n $textHoverColor={textHoverColor}\n $appearance={appearance}\n theme={theme}\n rel={rel}\n forwardedAs={forwardAs}\n ref={ref}\n >\n {props.children}\n </StyledLink>\n </ThemeProvider>\n );\n});\n\nexport default Link;\n"],"names":["Link","forwardRef","props","ref","foundTheme","useTheme","theme","__assign","defaultTheme","rel","target","forwardAs","as","undefined","textHoverColor","appearance","rest","__rest","React","createElement","ThemeProvider","StyledLink","$textHoverColor","$appearance","forwardedAs","children"],"mappings":"oRAsCaA,EAAOC,GAAW,SAACC,EAAkBC,GAChD,IAAMC,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGCK,EAAMP,EAAMO,IACdP,EAAMO,IACW,WAAjBP,EAAMQ,OACJ,sBACA,GAGAC,EAAYT,EAAMU,IAAmB,MAAbV,EAAMU,QAAaC,EAAY,IAErDC,EAAwCZ,EAA1BY,eAAEC,EAAwBb,EAAda,WAAKC,EAASC,EAAAf,EAA1C,CAAA,iBAAA,eAEN,OACEgB,EAACC,cAAAC,EAAc,CAAAd,MAAOA,GACpBY,EAAAC,cAACE,EAAUd,EAAA,CAAA,EACLS,EAAI,CAAAM,gBACSR,EAAcS,YAClBR,EACbT,MAAOA,EACPG,IAAKA,EACLe,YAAab,EACbR,IAAKA,IAEJD,EAAMuB,UAIf"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import r from"styled-components";import{Text as o}from"../Text/index.js";var e,a=r(o)(e||(e=n(["\n transition:\n color 0.2s ease,\n background-size 0.3s ease;\n overflow-wrap: break-word;\n background-color: rgba(255, 255, 255, 0);\n border: none;\n padding: 0;\n color: ",";\n text-decoration: ",";\n font-family: ",";\n letter-spacing: ",";\n\n background: ",";\n background-repeat: no-repeat;\n background-position-y: calc(100%);\n background-size: 100% 2px;\n font-weight: ",";\n\n &:focus-visible {\n outline: auto;\n }\n\n &:hover {\n cursor: pointer;\n background-size: 100% 100%;\n color: ",";\n }\n"],["\n transition:\n color 0.2s ease,\n background-size 0.3s ease;\n overflow-wrap: break-word;\n background-color: rgba(255, 255, 255, 0);\n border: none;\n padding: 0;\n color: ",";\n text-decoration: ",";\n font-family: ",";\n letter-spacing: ",";\n\n background: ",";\n background-repeat: no-repeat;\n background-position-y: calc(100%);\n background-size: 100% 2px;\n font-weight: ",";\n\n &:focus-visible {\n outline: auto;\n }\n\n &:hover {\n cursor: pointer;\n background-size: 100% 100%;\n color: ",";\n }\n"])),(function(n){var r=n.theme,o=r.colors,e=r.utilities.useBackgroundStyleLinks,a=n.textColor,t=n.$appearance;return a&&void 0!==o[a]?o[a]:a||(!t&&e?"currentColor":t&&"primary"===t?o.linkColorSecondary:o.linkColor)}),(function(n){var r=n.$appearance,o=n.theme.typography,e=o.linkTextDecoration,a=o.LinkPrimaryTextDecoration;return"primary"===r?a:"secondary"===r?"none":e}),(function(n){var r=n.$appearance,o=n.theme.typography,e=o.fontFamilyBase,a=o.fontFamilyLinks;return"primary"===r||"secondary"===r?a:e}),(function(n){var r=n.$appearance,o=n.theme.typography.LinkLetterSpacing;return"primary"===r||"secondary"===r?o:"0px"}),(function(n){var r=n.$appearance,o=n.theme;return n.theme.utilities.useBackgroundStyleLinks&&!r?"linear-gradient(180deg, rgba(255, 255, 255, 0) 0px, ".concat(o.colors.primary," -4px);"):void 0}),(function(n){return n.theme.typography.fontWeightLinks}),(function(n){var r=n.theme,o=r.colors,e=r.utilities.useBackgroundStyleLinks,a=n.$textHoverColor,t=n.$appearance;return!a&&e?o.textDark:a&&void 0!==o[a]?o[a]:a?t&&"primary"===t?o.linkColorHover:o.linkColorSecondaryHover:o.linkColorHover}));export{a as StyledLink,a as default};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/Link/styles.ts"],"sourcesContent":["import { type AnchorHTMLAttributes } from \"react\";\nimport styled from \"styled-components\";\n\nimport Text, { type TextProps } from \"../Text\";\n\nimport { type ThemeType, type ColorKeyType } from \"../../types\";\n\ntype StyledLinkProps = AnchorHTMLAttributes<HTMLElement> &\n TextProps & {\n theme: ThemeType;\n $appearance?: \"primary\" | \"secondary\";\n $textHoverColor?: string;\n };\n\nexport const StyledLink = styled(Text)<StyledLinkProps>`\n transition:\n color 0.2s ease,\n background-size 0.3s ease;\n overflow-wrap: break-word;\n background-color: rgba(255, 255, 255, 0);\n border: none;\n padding: 0;\n color: ${({\n theme: {\n colors,\n utilities: { useBackgroundStyleLinks },\n },\n textColor,\n $appearance,\n }) =>\n textColor && typeof colors[textColor as ColorKeyType] !== \"undefined\"\n ? colors[textColor as ColorKeyType]\n : textColor ||\n (!$appearance && useBackgroundStyleLinks\n ? \"currentColor\"\n : $appearance && $appearance === \"primary\"\n ? colors.linkColorSecondary\n : colors.linkColor)};\n text-decoration: ${({\n $appearance,\n theme: {\n typography: { linkTextDecoration, LinkPrimaryTextDecoration },\n },\n }) =>\n $appearance === \"primary\"\n ? LinkPrimaryTextDecoration\n : $appearance === \"secondary\"\n ? \"none\"\n : linkTextDecoration};\n font-family: ${({\n $appearance,\n theme: {\n typography: { fontFamilyBase, fontFamilyLinks },\n },\n }) =>\n $appearance === \"primary\" || $appearance === \"secondary\"\n ? fontFamilyLinks\n : fontFamilyBase};\n letter-spacing: ${({\n $appearance,\n theme: {\n typography: { LinkLetterSpacing },\n },\n }) =>\n $appearance === \"primary\" || $appearance === \"secondary\"\n ? LinkLetterSpacing\n : \"0px\"};\n\n background: ${({\n $appearance,\n theme,\n theme: {\n utilities: { useBackgroundStyleLinks },\n },\n }) =>\n useBackgroundStyleLinks && !$appearance\n ? `linear-gradient(180deg, rgba(255, 255, 255, 0) 0px, ${theme.colors.primary} -4px);`\n : undefined};\n background-repeat: no-repeat;\n background-position-y: calc(100%);\n background-size: 100% 2px;\n font-weight: ${({ theme }) => theme.typography.fontWeightLinks};\n\n &:focus-visible {\n outline: auto;\n }\n\n &:hover {\n cursor: pointer;\n background-size: 100% 100%;\n color: ${({\n theme: {\n colors,\n utilities: { useBackgroundStyleLinks },\n },\n $textHoverColor,\n $appearance,\n }) =>\n !$textHoverColor && useBackgroundStyleLinks\n ? colors.textDark\n : $textHoverColor &&\n typeof colors[$textHoverColor as ColorKeyType] !== \"undefined\"\n ? colors[$textHoverColor as ColorKeyType]\n : $textHoverColor\n ? $appearance && $appearance === \"primary\"\n ? colors.linkColorHover\n : colors.linkColorSecondaryHover\n : colors.linkColorHover};\n }\n`;\n\nexport default StyledLink;\n"],"names":["StyledLink","styled","Text","templateObject_1","__makeTemplateObject","_a","_b","theme","colors","useBackgroundStyleLinks","utilities","textColor","$appearance","linkColorSecondary","linkColor","typography","linkTextDecoration","LinkPrimaryTextDecoration","fontFamilyBase","fontFamilyLinks","LinkLetterSpacing","concat","primary","undefined","fontWeightLinks","$textHoverColor","textDark","linkColorHover","linkColorSecondaryHover"],"mappings":"yJAca,MAAAA,EAAaC,EAAOC,EAAPD,CAAYE,IAAAA,EAAAC,EAAA,CAAA,8LAAA,yBAAA,qBAAA,wBAAA,sBAAA,0HAAA,uIAAA,YAAA,CAAiB,8LAuBxB,yBAWH,qBASN,wBAST,sBAWI,0HAI+C,uIA0B7B,eArFxB,SAACC,OACRC,EAGCD,EAAAE,MAFCC,EAAMF,EAAAE,OACOC,EAAuBH,EAAAI,UAAAD,wBAEtCE,EAASN,EAAAM,UACTC,EAAWP,EAAAO,YAEX,OAAAD,QAA0D,IAAtCH,EAAOG,GACvBH,EAAOG,GACPA,KACEC,GAAeH,EACb,eACAG,GAA+B,YAAhBA,EACbJ,EAAOK,mBACPL,EAAOM,UAPjB,IAQiB,SAACT,OAClBO,EAAWP,EAAAO,YAETN,EAA6DD,EAAAE,MAAAQ,WAA/CC,EAAkBV,EAAAU,mBAAEC,EAAyBX,EAAAW,0BAG7D,MAAgB,YAAhBL,EACIK,EACgB,cAAhBL,EACE,OACAI,CAJN,IAKa,SAACX,OACdO,EAAWP,EAAAO,YAETN,EAA+CD,EAAAE,MAAAQ,WAAjCG,EAAcZ,EAAAY,eAAEC,EAAeb,EAAAa,gBAG/C,MAAgB,YAAhBP,GAA6C,cAAhBA,EACzBO,EACAD,CAFJ,IAGgB,SAACb,OACjBO,EAAWP,EAAAO,YAEKQ,EAAiBf,EAAAE,MAAAQ,WAAAK,kBAGjC,MAAgB,YAAhBR,GAA6C,cAAhBA,EACzBQ,EACA,KAFJ,IAIY,SAACf,GACb,IAAAO,gBACAL,EAAKF,EAAAE,MAKL,OAHsCF,EAAAE,MAAAG,UAAAD,0BAGVG,EACxB,uDAAuDS,OAAAd,EAAMC,OAAOc,QAAgB,gBACpFC,CAFJ,IAMa,SAAClB,GAAc,OAAPA,EAAAE,MAAaQ,WAAWS,eAAjB,IASnB,SAACnB,OACRC,EAGCD,EAAAE,MAFCC,EAAMF,EAAAE,OACOC,EAAuBH,EAAAI,UAAAD,wBAEtCgB,EAAepB,EAAAoB,gBACfb,EAAWP,EAAAO,YAEX,OAACa,GAAmBhB,EAChBD,EAAOkB,SACPD,QACqD,IAA5CjB,EAAOiB,GACdjB,EAAOiB,GACPA,EACEb,GAA+B,YAAhBA,EACbJ,EAAOmB,eACPnB,EAAOoB,wBACTpB,EAAOmB,cATf"}
@@ -0,0 +1,2 @@
1
+ import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import t from"react";import{useTheme as r,ThemeProvider as l}from"styled-components";import{crukTheme as n}from"../../themes/cruk.js";import{ScreenReaderOnly as m,Spinner as o}from"./styles.js";function a(){var a=r(),s=e(e({},n),a);return t.createElement(l,{theme:s},t.createElement(t.Fragment,null,t.createElement(m,{role:"alert"},"Loading"),t.createElement(o,null,t.createElement("span",null),t.createElement("span",null),t.createElement("span",null))))}export{a as Loader,a as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Loader/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { ThemeProvider, useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { ScreenReaderOnly, Spinner } from \"./styles\";\n\n/**\n *\n * Loaders are used after some user interaction that we assume will take some time to complete. They inform the user that their request is beeing processed and that they should wait.\n */\nexport function Loader() {\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n\n return (\n <ThemeProvider theme={theme}>\n <>\n <ScreenReaderOnly role=\"alert\">Loading</ScreenReaderOnly>\n <Spinner>\n <span />\n <span />\n <span />\n </Spinner>\n </>\n </ThemeProvider>\n );\n}\n\nexport default Loader;\n"],"names":["Loader","foundTheme","useTheme","theme","__assign","defaultTheme","React","createElement","ThemeProvider","Fragment","ScreenReaderOnly","role","Spinner"],"mappings":"+QAWgBA,IACd,IAAMC,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGL,OACEK,EAACC,cAAAC,EAAc,CAAAL,MAAOA,GACpBG,EAAAC,cAAAD,EAAAG,SAAA,KACEH,EAAAC,cAACG,EAAgB,CAACC,KAAK,SAAkC,WACzDL,EAAAC,cAACK,EAAO,KACNN,EAAQC,cAAA,OAAA,MACRD,EAAQC,cAAA,OAAA,MACRD,EAAAC,cAAA,OAAA,QAKV"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o,{keyframes as t}from"styled-components";var i,a,e,r=t(i||(i=n(["\n 0%,\n 80%,\n 100% {\n transform: scale(0)\n }\n 40% {\n transform: scale(1)\n }\n"],["\n 0%,\n 80%,\n 100% {\n transform: scale(0)\n }\n 40% {\n transform: scale(1)\n }\n"]))),l=o.p(a||(a=n(["\n position: absolute;\n left: -10000px;\n top: auto;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"],["\n position: absolute;\n left: -10000px;\n top: auto;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"]))),s=o.div(e||(e=n(["\n width: 100%;\n text-align: center;\n margin-top: ",";\n\n span {\n display: inline-block;\n width: 16px;\n height: 16px;\n margin: 0 2px;\n background-color: ",";\n border-radius: 100%;\n animation: "," 1.2s infinite ease-in-out both;\n }\n\n span:nth-child(1) {\n animation-delay: -0.32s;\n -webkit-animation-delay: -0.32s;\n }\n\n span:nth-child(2) {\n background-color: ",";\n animation-delay: -0.16s;\n }\n\n span:nth-child(3) {\n background-color: ",";\n }\n"],["\n width: 100%;\n text-align: center;\n margin-top: ",";\n\n span {\n display: inline-block;\n width: 16px;\n height: 16px;\n margin: 0 2px;\n background-color: ",";\n border-radius: 100%;\n animation: "," 1.2s infinite ease-in-out both;\n }\n\n span:nth-child(1) {\n animation-delay: -0.32s;\n -webkit-animation-delay: -0.32s;\n }\n\n span:nth-child(2) {\n background-color: ",";\n animation-delay: -0.16s;\n }\n\n span:nth-child(3) {\n background-color: ",";\n }\n"])),(function(n){return n.theme.spacing.s}),(function(n){return n.theme.colors.loaderColor1}),r,(function(n){return n.theme.colors.loaderColor2}),(function(n){return n.theme.colors.loaderColor3}));export{l as ScreenReaderOnly,s as Spinner};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/Loader/styles.ts"],"sourcesContent":["import styled, { keyframes } from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ntype SpinnerProps = {\n theme: ThemeType;\n};\n\nconst BounceDelay = keyframes`\n 0%,\n 80%,\n 100% {\n transform: scale(0)\n }\n 40% {\n transform: scale(1)\n }\n`;\n\nexport const ScreenReaderOnly = styled.p`\n position: absolute;\n left: -10000px;\n top: auto;\n width: 1px;\n height: 1px;\n overflow: hidden;\n`;\n\nexport const Spinner = styled.div<SpinnerProps>`\n width: 100%;\n text-align: center;\n margin-top: ${({ theme }) => theme.spacing.s};\n\n span {\n display: inline-block;\n width: 16px;\n height: 16px;\n margin: 0 2px;\n background-color: ${({ theme }) => theme.colors.loaderColor1};\n border-radius: 100%;\n animation: ${BounceDelay} 1.2s infinite ease-in-out both;\n }\n\n span:nth-child(1) {\n animation-delay: -0.32s;\n -webkit-animation-delay: -0.32s;\n }\n\n span:nth-child(2) {\n background-color: ${({ theme }) => theme.colors.loaderColor2};\n animation-delay: -0.16s;\n }\n\n span:nth-child(3) {\n background-color: ${({ theme }) => theme.colors.loaderColor3};\n }\n`;\n"],"names":["BounceDelay","keyframes","templateObject_1","__makeTemplateObject","ScreenReaderOnly","styled","p","templateObject_2","Spinner","div","_a","theme","spacing","s","colors","loaderColor1","loaderColor2","loaderColor3"],"mappings":"iIAOA,UAAMA,EAAcC,EAASC,IAAAA,EAAAC,EAAA,CAAA,wGAAA,CAAA,2GAWhBC,EAAmBC,EAAOC,EAACC,IAAAA,EAAAJ,EAAA,CAAA,kHAAA,CAAA,qHAS3BK,EAAUH,EAAOI,mhBAAiB,0DAGD,6HAOkB,+CAEpC,2LASoC,wFAKA,eAvBhD,SAACC,GAAc,OAAPA,EAAAC,MAAaC,QAAQC,CAAd,IAOP,SAACH,GAAc,OAAPA,EAAAC,MAAaG,OAAOC,YAAb,GAEtBf,GASO,SAACU,GAAc,OAAPA,EAAAC,MAAaG,OAAOE,YAAb,IAKf,SAACN,GAAc,OAAPA,EAAAC,MAAaG,OAAOG,YAAb"}
@@ -0,0 +1,2 @@
1
+ import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import o,{useEffect as n}from"react";import{createPortal as t}from"react-dom";import{useTheme as i,ThemeProvider as r}from"styled-components";import d from"../../../node_modules/react-focus-lock/dist/es2015/Combination.js";import{faClose as a}from"../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";import{IconFa as m}from"../IconFa/index.js";import{crukTheme as l}from"../../themes/cruk.js";import{Wrapper as c,Content as g,CloseButton as p,Background as s}from"./styles.js";function u(u){var f=u.modalName,h=u.closeFunction,w=u.showCloseButton,y=u.maxWidth,v=void 0===y?"500px":y,E=u.top,b=void 0===E?"1rem":E,k=u.backgroundColor,x=void 0===k?"backgroundLight":k,L=u.children,j=u.width,B=void 0===j?"90%":j,C=u.margin,z=u.marginHorizontal,F=u.marginVertical,H=u.marginTop,R=u.marginRight,T=u.marginBottom,V=void 0===T?"xxl":T,$=u.marginLeft,_=u.padding,I=void 0===_?"xs":_,W=u.paddingHorizontal,N=u.paddingVertical,q=u.paddingTop,A=u.paddingRight,D=u.paddingBottom,G=u.paddingLeft,J=i(),K=e(e({},l),J),M=function(e){"Escape"===e.key&&h&&h()};return n((function(){if("undefined"!=typeof window)return document.body.style.overflow="hidden",document.addEventListener("keydown",M),function(){"undefined"!=typeof window&&(document.body.style.overflow="unset",document.removeEventListener("keydown",M))}}),[]),o.createElement(o.Fragment,null,"undefined"!=typeof window?t(o.createElement("section",null,o.createElement(d,{returnFocus:!0},o.createElement(r,{theme:K},o.createElement(c,{role:"dialog","aria-modal":"true","aria-label":f},o.createElement(g,{backgroundColor:x,$maxWidth:v,$width:B,$top:b,margin:C,marginHorizontal:z,marginVertical:F,marginTop:H,marginRight:R,marginBottom:V,marginLeft:$,padding:I,paddingHorizontal:W,paddingVertical:N,paddingTop:q,paddingRight:A,paddingBottom:D,paddingLeft:G},w&&h?o.createElement(p,{"aria-label":"close",appearance:"tertiary",onClick:function(){h()}},o.createElement(m,{faIcon:a})):null,L),o.createElement(s,null))))),document.body):null)}export{u as Modal,u as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Modal/index.tsx"],"sourcesContent":["import React, { type ReactNode, useEffect } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ThemeProvider, useTheme } from \"styled-components\";\nimport FocusLock from \"react-focus-lock\";\nimport { faClose } from \"@fortawesome/free-solid-svg-icons\";\n\nimport { IconFa } from \"../IconFa\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { CloseButton, Wrapper, Content, Background } from \"./styles\";\n\nimport { type SpacingProps } from \"../Spacing\";\n\nexport type ModalProps = SpacingProps & {\n /** modal name used for aria-label */\n modalName: string;\n /** callback function called on modal close */\n closeFunction: () => void;\n /** flag to reveal close button with cross in the top right of modal */\n showCloseButton?: boolean;\n /** set max width of modal */\n maxWidth?: string;\n /** set space from top of view port that modal appears */\n top?: string;\n /** background color of dialogue */\n backgroundColor?: string;\n /** children components */\n children?: ReactNode;\n /** width of modal */\n width?: string;\n};\n\n/**\n *\n * Use a modal to display content over top of the rest of the site which must be interacted with before the user can continue.\n * ## How modals work\n * - Modals are positioned over everything else in the document and remove scroll from the \"body\" tag so that modal content scrolls instead.\n * - Modals are unmounted when closed.\n * - Modal's \"trap\" focus in them, ensuring the keyboard navigation cycles through the modal, and not the rest of the page.\n * ## Accessibility\n * - Once the Modal is appeared on the screen, the focus must be within the Modal container which will enable the screen readers to be able to navigate within the Modal. You may wish to hide the close button so that a user must click on another button to confirm a choice before the modal is closed. However closing with the 'ESC' key must always work, so the props which contains the function that allows the modal to close itself 'closeFunction' is always required.\n */\nexport function Modal({\n modalName,\n closeFunction,\n showCloseButton,\n maxWidth = \"500px\",\n top = \"1rem\",\n backgroundColor = \"backgroundLight\",\n children,\n width = \"90%\",\n margin,\n marginHorizontal,\n marginVertical,\n marginTop,\n marginRight,\n marginBottom = \"xxl\",\n marginLeft,\n padding = \"xs\",\n paddingHorizontal,\n paddingVertical,\n paddingTop,\n paddingRight,\n paddingBottom,\n paddingLeft,\n}: ModalProps) {\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n const closeByEsc = (event: KeyboardEvent): void => {\n if (event.key === \"Escape\" && !!closeFunction) {\n closeFunction();\n }\n };\n\n useEffect(() => {\n if (typeof window === `undefined`) {\n return undefined;\n }\n document.body.style.overflow = \"hidden\";\n document.addEventListener(\"keydown\", closeByEsc);\n\n return () => {\n if (typeof window === `undefined`) {\n return;\n }\n document.body.style.overflow = \"unset\";\n document.removeEventListener(\"keydown\", closeByEsc);\n };\n }, []);\n\n return (\n <>\n {typeof window !== `undefined`\n ? createPortal(\n <section>\n <FocusLock returnFocus>\n <ThemeProvider theme={theme}>\n <Wrapper\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={modalName}\n >\n <Content\n backgroundColor={backgroundColor}\n $maxWidth={maxWidth}\n $width={width}\n $top={top}\n margin={margin}\n marginHorizontal={marginHorizontal}\n marginVertical={marginVertical}\n marginTop={marginTop}\n marginRight={marginRight}\n marginBottom={marginBottom}\n marginLeft={marginLeft}\n padding={padding}\n paddingHorizontal={paddingHorizontal}\n paddingVertical={paddingVertical}\n paddingTop={paddingTop}\n paddingRight={paddingRight}\n paddingBottom={paddingBottom}\n paddingLeft={paddingLeft}\n >\n {showCloseButton && closeFunction ? (\n <CloseButton\n aria-label=\"close\"\n appearance=\"tertiary\"\n onClick={() => {\n closeFunction();\n }}\n >\n <IconFa faIcon={faClose} />\n </CloseButton>\n ) : null}\n {children}\n </Content>\n <Background />\n </Wrapper>\n </ThemeProvider>\n </FocusLock>\n </section>,\n document.body,\n )\n : null}\n </>\n );\n}\n\nexport default Modal;\n"],"names":["Modal","_a","modalName","closeFunction","showCloseButton","_b","maxWidth","_c","top","_d","backgroundColor","children","_e","width","margin","marginHorizontal","marginVertical","marginTop","marginRight","_f","marginBottom","marginLeft","_g","padding","paddingHorizontal","paddingVertical","paddingTop","paddingRight","paddingBottom","paddingLeft","foundTheme","useTheme","theme","__assign","defaultTheme","closeByEsc","event","key","useEffect","window","document","body","style","overflow","addEventListener","removeEventListener","React","createElement","Fragment","createPortal","FocusLock","returnFocus","ThemeProvider","Wrapper","role","Content","$maxWidth","$width","$top","CloseButton","appearance","onClick","IconFa","faIcon","faClose","Background"],"mappings":"+iBA0CM,SAAUA,EAAMC,GACpB,IAAAC,cACAC,kBACAC,oBACAC,EAAAJ,EAAAK,SAAAA,aAAW,QAAOD,EAClBE,EAAYN,EAAAO,IAAZA,OAAM,IAAAD,EAAA,OAAMA,EACZE,oBAAAC,aAAkB,kBAAiBD,EACnCE,EAAQV,EAAAU,SACRC,EAAaX,EAAAY,MAAbA,OAAQ,IAAAD,EAAA,QACRE,WACAC,EAAgBd,EAAAc,iBAChBC,EAAcf,EAAAe,eACdC,EAAShB,EAAAgB,UACTC,EAAWjB,EAAAiB,YACXC,iBAAAC,aAAe,MAAKD,EACpBE,EAAUpB,EAAAoB,WACVC,EAAcrB,EAAAsB,QAAdA,OAAO,IAAAD,EAAG,KAAIA,EACdE,EAAiBvB,EAAAuB,kBACjBC,EAAexB,EAAAwB,gBACfC,EAAUzB,EAAAyB,WACVC,EAAY1B,EAAA0B,aACZC,EAAa3B,EAAA2B,cACbC,EAAW5B,EAAA4B,YAELC,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAECK,EAAa,SAACC,GACA,WAAdA,EAAMC,KAAsBlC,GAC9BA,GAEJ,EAkBA,OAhBAmC,GAAU,WACR,GAAsB,oBAAXC,OAMX,OAHAC,SAASC,KAAKC,MAAMC,SAAW,SAC/BH,SAASI,iBAAiB,UAAWT,GAE9B,WACiB,oBAAXI,SAGXC,SAASC,KAAKC,MAAMC,SAAW,QAC/BH,SAASK,oBAAoB,UAAWV,GAC1C,CACD,GAAE,IAGDW,EAAAC,cAAAD,EAAAE,SAAA,KACqB,oBAAXT,OACJU,EACEH,EAAAC,cAAA,UAAA,KACED,EAACC,cAAAG,GAAUC,aAAW,GACpBL,EAAAC,cAACK,EAAa,CAACpB,MAAOA,GACpBc,EAACC,cAAAM,GACCC,KAAK,SACM,aAAA,oBACCpD,GAEZ4C,EAAAC,cAACQ,EAAO,CACN7C,gBAAiBA,EAAe8C,UACrBlD,EAAQmD,OACX5C,EAAK6C,KACPlD,EACNM,OAAQA,EACRC,iBAAkBA,EAClBC,eAAgBA,EAChBC,UAAWA,EACXC,YAAaA,EACbE,aAAcA,EACdC,WAAYA,EACZE,QAASA,EACTC,kBAAmBA,EACnBC,gBAAiBA,EACjBC,WAAYA,EACZC,aAAcA,EACdC,cAAeA,EACfC,YAAaA,GAEZzB,GAAmBD,EAClB2C,EAACC,cAAAY,EACY,CAAA,aAAA,QACXC,WAAW,WACXC,QAAS,WACP1D,MAGF2C,EAACC,cAAAe,EAAO,CAAAC,OAAQC,KAEhB,KACHrD,GAEHmC,EAACC,cAAAkB,EAAa,UAKtBzB,SAASC,MAEX,KAGV"}
@@ -0,0 +1,2 @@
1
+ import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o from"styled-components";import{Box as t}from"../Box/index.js";import{Button as i}from"../Button/index.js";var r,e,d,a,m=o.div(r||(r=n(["\n background: ",";\n bottom: 0;\n left: 0;\n opacity: 0.5;\n position: fixed;\n right: 0;\n top: 0;\n transition:\n opacity 0.3s,\n bottom 0s 0.3s;\n z-index: 100;\n"],["\n background: ",";\n bottom: 0;\n left: 0;\n opacity: 0.5;\n position: fixed;\n right: 0;\n top: 0;\n transition:\n opacity 0.3s,\n bottom 0s 0.3s;\n z-index: 100;\n"])),(function(n){return n.theme.colors.modalBackdrop})),s=o.div(e||(e=n(["\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n position: fixed;\n top: 0;\n width: 100%;\n z-index: 9999;\n"],["\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n position: fixed;\n top: 0;\n width: 100%;\n z-index: 9999;\n"]))),p=o(t)(d||(d=n(["\n background-color: ",";\n position: relative;\n box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);\n margin: ",";\n width: ",";\n min-height: 10rem;\n max-width: ",";\n z-index: 9999;\n"],["\n background-color: ",";\n position: relative;\n box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);\n margin: ",";\n width: ",";\n min-height: 10rem;\n max-width: ",";\n z-index: 9999;\n"])),(function(n){var o=n.theme.colors,t=n.backgroundColor;return void 0!==t&&void 0!==typeof t?void 0!==o[t]?o[t]:t:o.backgroundLight}),(function(n){var o=n.$top;return"".concat(o," auto auto auto")}),(function(n){return n.$width}),(function(n){return n.$maxWidth})),h=o(i)(a||(a=n(["\n float: right;\n margin-left: ",";\n font-size: 1.2rem;\n padding: 0;\n"],["\n float: right;\n margin-left: ",";\n font-size: 1.2rem;\n padding: 0;\n"])),(function(n){return n.theme.spacing.xs}));export{m as Background,h as CloseButton,p as Content,s as Wrapper};
2
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/Modal/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ColorKeyType, type ThemeType } from \"../../types\";\nimport Box from \"../Box\";\nimport { Button } from \"../Button\";\n\nexport const Background = styled.div<{\n theme: ThemeType;\n}>`\n background: ${({ theme }) => theme.colors.modalBackdrop};\n bottom: 0;\n left: 0;\n opacity: 0.5;\n position: fixed;\n right: 0;\n top: 0;\n transition:\n opacity 0.3s,\n bottom 0s 0.3s;\n z-index: 100;\n`;\n\nexport const Wrapper = styled.div`\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n position: fixed;\n top: 0;\n width: 100%;\n z-index: 9999;\n`;\n\nexport const Content = styled(Box)<{\n $backgroundColor?: string;\n $top: string;\n $width: string;\n $maxWidth: string;\n theme: ThemeType;\n}>`\n background-color: ${({ theme: { colors }, backgroundColor }) =>\n backgroundColor !== undefined && typeof backgroundColor !== undefined\n ? colors[backgroundColor as ColorKeyType] !== undefined\n ? colors[backgroundColor as ColorKeyType]\n : backgroundColor\n : colors.backgroundLight};\n position: relative;\n box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);\n margin: ${({ $top }) => `${$top} auto auto auto`};\n width: ${({ $width }) => $width};\n min-height: 10rem;\n max-width: ${({ $maxWidth }) => $maxWidth};\n z-index: 9999;\n`;\n\nexport const CloseButton = styled(Button)<{\n theme: ThemeType;\n}>`\n float: right;\n margin-left: ${({\n theme: {\n spacing: { xs },\n },\n }) => xs};\n font-size: 1.2rem;\n padding: 0;\n`;\n"],"names":["Background","styled","div","templateObject_1","__makeTemplateObject","_a","theme","colors","modalBackdrop","Wrapper","templateObject_2","Content","Box","templateObject_3","backgroundColor","undefined","backgroundLight","$top","concat","$width","$maxWidth","CloseButton","Button","templateObject_4","spacing","xs"],"mappings":"mMAKO,YAAMA,EAAaC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,mBAAA,sKAAA,CAElC,mBACuD,yKAAzC,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,aAAb,IAalBC,EAAUR,EAAOC,IAAGQ,IAAAA,EAAAN,EAAA,CAAA,oIAAA,CAAA,uIAUpBO,EAAUV,EAAOW,EAAPX,CAMrBY,IAAAA,EAAAT,EAAA,CAAA,yBAAA,qFAAA,eAAA,yCAAA,yBAAA,CAAA,yBAM4B,qFAGoB,eACjB,yCAEU,4BAXrB,SAACC,OAAWE,EAAMF,EAAAC,MAAAC,OAAIO,EAAeT,EAAAS,gBACvD,YAAoBC,IAApBD,QAA4DC,WAApBD,OACQC,IAA5CR,EAAOO,GACLP,EAAOO,GACPA,EACFP,EAAOS,eAJX,IAOQ,SAACX,GAAE,IAAAY,EAAIZ,EAAAY,KAAO,MAAA,GAAAC,OAAGD,EAAqB,kBAAxB,IACf,SAACZ,GAAe,OAAPA,EAAAc,MAAO,IAEZ,SAACd,GAAkB,OAAPA,EAAAe,SAAO,IAIrBC,EAAcpB,EAAOqB,EAAPrB,CAAcsB,IAAAA,EAAAnB,EAAA,CAAA,qCAAA,4CAAA,CAEvC,qCAMQ,+CAJO,SAACC,GAIV,OAFWA,EAAAC,MAAAkB,QAAAC,EAEX"}
@@ -0,0 +1,2 @@
1
+ import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import t from"react";import{useTheme as a,ThemeProvider as c}from"styled-components";import{crukTheme as n}from"../../themes/cruk.js";import{PagerWrapper as l,PagerList as r,PagerItem as o,PagerLink as i}from"./styles.js";function s(s){var m=s.current,d=s.items,u=s.hideLast,p=s.pagerCallback,f=s.perPage,E=s.searchParam,v=void 0===E?"page":E,b=s.children,h=s.id,k=a(),y=e(e({},n),k),x=f>0?f:1,g=Math.ceil(d/x)||1,P=function(e){return{href:"".concat("undefined"!=typeof window?window.location.pathname:"","?").concat(v?"".concat(v,"=").concat(e):""),onClick:function(t){t.preventDefault(),p(e)}}};return t.createElement(c,{theme:y},d>f&&t.createElement(l,null,t.createElement(r,null,t.createElement(o,{key:"Prev"},t.createElement(i,e({"data-cta":h?"".concat(h,"-prev"):null,name:"Prev",disabled:1===m,"aria-disabled":1===m},1===m&&{tabIndex:-1},1!==m&&P(m-1)),"Prev")),function(a,c){for(var n=[],l=[],r=1;r<=c;r+=1)n.push(t.createElement(o,{key:r},t.createElement(i,e({"data-cta":h?"".concat(h,"-").concat(r):null,$active:r===a},P(r),{"aria-label":"page ".concat(r," of ").concat(c)}),r)));var s=n.slice(0,1).concat(t.createElement(o,{key:"first"},t.createElement("span",null,"..."))),m=n.slice(n.length-1).concat(t.createElement(o,{key:"last"},t.createElement("span",null,"..."))).reverse();return l=n.slice(0,c),c>7&&(l=a<=4?u?n.slice(0,7):n.slice(0,5).concat(m):a>c-4?s.concat(n.slice(-5)):u?s.concat(n.slice(a-3,a+2)):s.concat(n.slice(a-2,a+1)).concat(m)),l}(m,g),t.createElement(o,{key:"Next"},t.createElement(i,e({"data-cta":h?"".concat(h,"-next"):null,name:"Next",disabled:m===g,"aria-disabled":m===g},m===g&&{tabIndex:-1},m!==g&&P(m+1)),"Next"))),b))}export{s as Pagination,s as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Pagination/index.tsx"],"sourcesContent":["import React, {\n type HTMLAttributes,\n type MouseEvent,\n type ReactNode,\n type TouchEvent,\n} from \"react\";\nimport { ThemeProvider, useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { PagerItem, PagerLink, PagerList, PagerWrapper } from \"./styles\";\n\nexport type PaginationProps = {\n /** set current page number */\n current: number;\n /** total number of pages */\n items: number;\n /** don't show an ellipsise and then the last page link, usefull for search results where the last page isn't important */\n hideLast?: boolean;\n /** callback function which is passed the selected page number on click */\n pagerCallback: (n: number) => void;\n /** number of items per page */\n perPage: number;\n /** the name of the search param in the url that is modified on page click, defaults to 'page' */\n searchParam?: string;\n children?: ReactNode;\n} & HTMLAttributes<HTMLElement>;\n\n/**\n * \n * Pagination is used when we are viewing large amounts of data.\nData is split into multiple pages and pagination is used to\neasily navigate through these pages.\n */\nexport function Pagination({\n current,\n items,\n hideLast,\n pagerCallback,\n perPage,\n searchParam = \"page\",\n children,\n id,\n}: PaginationProps) {\n const foundTheme = useTheme();\n const theme = {\n ...defaultTheme,\n ...foundTheme,\n };\n const perPageValue = perPage > 0 ? perPage : 1;\n const totalPages = Math.ceil(items / perPageValue) || 1;\n\n const linkProps = (number: number) => ({\n href: `${typeof window !== \"undefined\" ? window.location.pathname : \"\"}?${\n searchParam ? `${searchParam}=${number}` : \"\"\n }`,\n onClick: (e: TouchEvent | MouseEvent) => {\n e.preventDefault();\n pagerCallback(number);\n },\n });\n\n const renderPager = (active: number, total: number) => {\n const list = [];\n let pager = [];\n // get the list of items\n for (let number = 1; number <= total; number += 1) {\n list.push(\n <PagerItem key={number}>\n <PagerLink\n data-cta={id ? `${id}-${number}` : null}\n $active={number === active}\n {...linkProps(number)}\n aria-label={`page ${number} of ${total}`}\n >\n {number}\n </PagerLink>\n </PagerItem>,\n );\n }\n const first = list.slice(0, 1).concat(\n <PagerItem key=\"first\">\n <span>...</span>\n </PagerItem>,\n );\n const last = list\n .slice(list.length - 1)\n .concat(\n <PagerItem key=\"last\">\n <span>...</span>\n </PagerItem>,\n )\n .reverse();\n pager = list.slice(0, total);\n if (total > 7) {\n if (active <= 4) {\n pager = hideLast ? list.slice(0, 7) : list.slice(0, 5).concat(last);\n } else {\n pager =\n active > total - 4\n ? first.concat(list.slice(-5))\n : hideLast\n ? first.concat(list.slice(active - 3, active + 2))\n : first.concat(list.slice(active - 2, active + 1)).concat(last);\n }\n }\n return pager;\n };\n\n return (\n <ThemeProvider theme={theme}>\n {items > perPage && (\n <PagerWrapper>\n <PagerList>\n <PagerItem key=\"Prev\">\n <PagerLink\n data-cta={id ? `${id}-prev` : null}\n name=\"Prev\"\n disabled={current === 1}\n aria-disabled={current === 1}\n {...(current === 1 && { tabIndex: -1 })}\n {...(current !== 1 && linkProps(current - 1))}\n >\n Prev\n </PagerLink>\n </PagerItem>\n {renderPager(current, totalPages)}\n <PagerItem key=\"Next\">\n <PagerLink\n data-cta={id ? `${id}-next` : null}\n name=\"Next\"\n disabled={current === totalPages}\n aria-disabled={current === totalPages}\n {...(current === totalPages && { tabIndex: -1 })}\n {...(current !== totalPages && linkProps(current + 1))}\n >\n Next\n </PagerLink>\n </PagerItem>\n </PagerList>\n {children}\n </PagerWrapper>\n )}\n </ThemeProvider>\n );\n}\n\nexport default Pagination;\n"],"names":["Pagination","_a","current","items","hideLast","pagerCallback","perPage","_b","searchParam","children","id","foundTheme","useTheme","theme","__assign","defaultTheme","perPageValue","totalPages","Math","ceil","linkProps","number","href","concat","window","location","pathname","onClick","e","preventDefault","React","createElement","ThemeProvider","PagerWrapper","PagerList","PagerItem","key","PagerLink","name","disabled","tabIndex","active","total","list","pager","push","$active","first","slice","last","length","reverse","renderPager"],"mappings":"kSAkCM,SAAUA,EAAWC,OACzBC,EAAOD,EAAAC,QACPC,EAAKF,EAAAE,MACLC,EAAQH,EAAAG,SACRC,EAAaJ,EAAAI,cACbC,YACAC,EAAAN,EAAAO,YAAAA,OAAc,IAAAD,EAAA,OAAMA,EACpBE,EAAQR,EAAAQ,SACRC,EAAET,EAAAS,GAEIC,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAECK,EAAeV,EAAU,EAAIA,EAAU,EACvCW,EAAaC,KAAKC,KAAKhB,EAAQa,IAAiB,EAEhDI,EAAY,SAACC,GAAmB,MAAC,CACrCC,KAAM,GAAAC,OAAqB,oBAAXC,OAAyBA,OAAOC,SAASC,SAAW,GAClE,KAAAH,OAAAf,EAAc,GAAGe,OAAAf,EAAe,KAAAe,OAAAF,GAAW,IAE7CM,QAAS,SAACC,GACRA,EAAEC,iBACFxB,EAAcgB,EACf,IAkDH,OACES,EAAAC,cAACC,EAAa,CAACnB,MAAOA,GACnBV,EAAQG,GACPwB,gBAACG,EAAY,KACXH,EAAAC,cAACG,EAAS,KACRJ,EAAAC,cAACI,EAAS,CAACC,IAAI,QACbN,EAACC,cAAAM,EACWvB,EAAA,CAAA,WAAAJ,EAAK,GAAGa,OAAAb,EAAS,SAAG,KAC9B4B,KAAK,OACLC,SAAsB,IAAZrC,EACK,gBAAY,IAAZA,GACE,IAAZA,GAAiB,CAAEsC,UAAW,GAClB,IAAZtC,GAAiBkB,EAAUlB,EAAU,IAAG,SA3DvC,SAACuC,EAAgBC,GAInC,IAHA,IAAMC,EAAO,GACTC,EAAQ,GAEHvB,EAAS,EAAGA,GAAUqB,EAAOrB,GAAU,EAC9CsB,EAAKE,KACHf,EAAAC,cAACI,EAAU,CAAAC,IAAKf,GACdS,EAAAC,cAACM,EAASvB,EAAA,CAAA,WACEJ,EAAK,GAAAa,OAAGb,EAAE,KAAAa,OAAIF,GAAW,KAC1ByB,QAAAzB,IAAWoB,GAChBrB,EAAUC,iBACF,QAAQE,OAAAF,EAAa,QAAAE,OAAAmB,KAEhCrB,KAKT,IAAM0B,EAAQJ,EAAKK,MAAM,EAAG,GAAGzB,OAC7BO,EAAAC,cAACI,EAAU,CAAAC,IAAI,SACbN,EAAgBC,cAAA,OAAA,KAAA,SAGdkB,EAAON,EACVK,MAAML,EAAKO,OAAS,GACpB3B,OACCO,EAACC,cAAAI,EAAU,CAAAC,IAAI,QACbN,EAAAC,cAAA,OAAA,KAAA,SAGHoB,UAcH,OAbAP,EAAQD,EAAKK,MAAM,EAAGN,GAClBA,EAAQ,IAERE,EADEH,GAAU,EACJrC,EAAWuC,EAAKK,MAAM,EAAG,GAAKL,EAAKK,MAAM,EAAG,GAAGzB,OAAO0B,GAG5DR,EAASC,EAAQ,EACbK,EAAMxB,OAAOoB,EAAKK,OAAO,IACzB5C,EACE2C,EAAMxB,OAAOoB,EAAKK,MAAMP,EAAS,EAAGA,EAAS,IAC7CM,EAAMxB,OAAOoB,EAAKK,MAAMP,EAAS,EAAGA,EAAS,IAAIlB,OAAO0B,IAG7DL,CACT,CAmBWQ,CAAYlD,EAASe,GACtBa,EAAAC,cAACI,EAAS,CAACC,IAAI,QACbN,EAACC,cAAAM,EACWvB,EAAA,CAAA,WAAAJ,EAAK,GAAGa,OAAAb,EAAS,SAAG,KAC9B4B,KAAK,OACLC,SAAUrC,IAAYe,EACP,gBAAAf,IAAYe,GACtBf,IAAYe,GAAc,CAAEuB,UAAW,GACvCtC,IAAYe,GAAcG,EAAUlB,EAAU,IAGzC,UAGfO,GAKX"}