@jetshop/ui 5.13.12-0 → 5.14.0

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 (557) hide show
  1. package/Accordion/Accordion.d.ts +33 -33
  2. package/Accordion/Accordion.js +58 -58
  3. package/Accordion/Accordion.test.js +73 -73
  4. package/Accordion/__doc_utils__/AccordionHeader.js +12 -12
  5. package/Auth/FormFields/CountriesInput.d.ts +16 -14
  6. package/Auth/FormFields/CountriesInput.js +27 -27
  7. package/Auth/FormFields/CountriesInput.js.map +1 -1
  8. package/Auth/LogInBehavior.d.ts +22 -22
  9. package/Auth/LogInBehavior.js +23 -23
  10. package/Auth/LogInFormProvider.d.ts +7 -7
  11. package/Auth/LogInFormProvider.js +70 -70
  12. package/Auth/LogOut.d.ts +10 -10
  13. package/Auth/LogOut.js +23 -23
  14. package/Auth/logInValidator.d.ts +8 -8
  15. package/Auth/logInValidator.js +15 -15
  16. package/Breadcrumbs/Breadcrumbs.d.ts +14 -14
  17. package/Breadcrumbs/Breadcrumbs.js +83 -83
  18. package/Breadcrumbs/getParentsOrCanonicalRoute.d.ts +3 -3
  19. package/Breadcrumbs/getParentsOrCanonicalRoute.js +13 -13
  20. package/Breadcrumbs/index.d.ts +1 -1
  21. package/Breadcrumbs/index.js +1 -1
  22. package/Breakpoints.d.ts +12 -12
  23. package/Breakpoints.js +35 -35
  24. package/Button/Button.d.ts +14 -14
  25. package/Button/Button.js +59 -59
  26. package/Button/OutlineButton.d.ts +4 -4
  27. package/Button/OutlineButton.js +9 -9
  28. package/Button/SecondaryButton.d.ts +3 -3
  29. package/Button/SecondaryButton.js +8 -8
  30. package/Button/TrendButton.d.ts +3 -3
  31. package/Button/TrendButton.js +7 -7
  32. package/Button/index.d.ts +4 -4
  33. package/Button/index.js +4 -4
  34. package/CategoryLink.d.ts +9 -9
  35. package/CategoryLink.js +42 -42
  36. package/ChannelSelector/ChannelListItem.d.ts +10 -10
  37. package/ChannelSelector/ChannelListItem.js +50 -50
  38. package/ChannelSelector/ChannelListItem.test.js +85 -85
  39. package/ChannelSelector/ChannelSelector.d.ts +63 -63
  40. package/ChannelSelector/ChannelSelector.js +79 -79
  41. package/ChannelSelector/ChannelSelector.test.js +167 -167
  42. package/ChannelSelector/ChannelSelectorButtons.d.ts +3 -3
  43. package/ChannelSelector/ChannelSelectorButtons.js +19 -19
  44. package/ChannelSelector/Channels.d.ts +17 -17
  45. package/ChannelSelector/Channels.js +11 -11
  46. package/ChannelSelector/Channels.test.js +90 -90
  47. package/ChannelSelector/LargeSelector.d.ts +3 -3
  48. package/ChannelSelector/LargeSelector.js +66 -66
  49. package/ChannelSelector/MiniSelector.d.ts +4 -4
  50. package/ChannelSelector/MiniSelector.js +57 -57
  51. package/ChannelSelector/Region.d.ts +28 -28
  52. package/ChannelSelector/Region.js +20 -20
  53. package/ChannelSelector/Region.test.js +37 -37
  54. package/ChannelSelector/exampleChannels.js +577 -577
  55. package/ChannelSelector/groupBy.d.ts +7 -7
  56. package/ChannelSelector/groupBy.js +15 -15
  57. package/ChannelSelector/groupBy.test.js +42 -42
  58. package/Checkbox/Checkbox.d.ts +10 -10
  59. package/Checkbox/Checkbox.js +68 -68
  60. package/Checkbox/CheckboxGroup.d.ts +23 -23
  61. package/Checkbox/CheckboxGroup.js +21 -21
  62. package/Checkbox/index.d.ts +2 -2
  63. package/Checkbox/index.js +2 -2
  64. package/ContentPageLink.d.ts +9 -9
  65. package/ContentPageLink.js +36 -36
  66. package/ContentRenderer.d.ts +9 -9
  67. package/ContentRenderer.js +35 -35
  68. package/DropdownMenu/Button.d.ts +7 -7
  69. package/DropdownMenu/Button.js +31 -31
  70. package/DropdownMenu/DropdownMenu.d.ts +21 -21
  71. package/DropdownMenu/DropdownMenu.js +71 -71
  72. package/DropdownMenu/Item.d.ts +13 -13
  73. package/DropdownMenu/Item.js +47 -47
  74. package/DropdownMenu/Items.d.ts +16 -16
  75. package/DropdownMenu/Items.js +52 -52
  76. package/DropdownMenu/index.d.ts +4 -4
  77. package/DropdownMenu/index.js +4 -4
  78. package/ErrorBoundary/Generic.d.ts +17 -17
  79. package/ErrorBoundary/Generic.js +68 -68
  80. package/ErrorBoundary/PassThrough.d.ts +3 -3
  81. package/ErrorBoundary/PassThrough.js +6 -6
  82. package/Gallery/Gallery.d.ts +39 -39
  83. package/Gallery/Gallery.js +121 -121
  84. package/Gallery/constructGallery.d.ts +15 -15
  85. package/Gallery/constructGallery.js +40 -40
  86. package/Image/B2BImage.d.ts +50 -50
  87. package/Image/B2BImage.js +52 -52
  88. package/Image/BaseImage.d.ts +39 -39
  89. package/Image/BaseImage.js +191 -191
  90. package/Image/Fallback.d.ts +5 -5
  91. package/Image/Fallback.js +3 -3
  92. package/Image/FlightImage.d.ts +52 -52
  93. package/Image/FlightImage.js +57 -57
  94. package/Image/FlightImage.test.js +277 -277
  95. package/Image/Image.d.ts +2 -2
  96. package/Image/Image.js +2 -2
  97. package/Image/index.d.ts +1 -1
  98. package/Image/index.js +1 -1
  99. package/Image/useConstructImage.d.ts +46 -46
  100. package/Image/useConstructImage.js +96 -96
  101. package/Image/utils/aspectRatioToFraction.d.ts +2 -2
  102. package/Image/utils/aspectRatioToFraction.js +10 -10
  103. package/Image/utils/getFullUrl.d.ts +6 -6
  104. package/Image/utils/getFullUrl.js +17 -17
  105. package/Image/utils/getImageWidth.d.ts +1 -1
  106. package/Image/utils/getImageWidth.js +11 -11
  107. package/Image/utils/getImageWidths.d.ts +2 -2
  108. package/Image/utils/getImageWidths.js +13 -13
  109. package/Image/utils/getLQIP.d.ts +8 -8
  110. package/Image/utils/getLQIP.js +19 -19
  111. package/Image/utils/getLargestSize.d.ts +7 -7
  112. package/Image/utils/getLargestSize.js +16 -16
  113. package/Image/utils/getSizeForBreakpoint.d.ts +2 -2
  114. package/Image/utils/getSizeForBreakpoint.js +15 -15
  115. package/Image/utils/getSizesMap.d.ts +2 -2
  116. package/Image/utils/getSizesMap.js +21 -21
  117. package/Image/utils/getSmallestSize.d.ts +2 -2
  118. package/Image/utils/getSmallestSize.js +11 -11
  119. package/Image/utils/getSrcSetFromWidths.d.ts +10 -10
  120. package/Image/utils/getSrcSetFromWidths.js +8 -8
  121. package/Image/utils/getSrcWithParams.d.ts +3 -3
  122. package/Image/utils/getSrcWithParams.js +28 -28
  123. package/Image/utils/paddingForAspectRatio.d.ts +1 -1
  124. package/Image/utils/paddingForAspectRatio.js +5 -5
  125. package/Image/utils/remToPx.d.ts +1 -1
  126. package/Image/utils/remToPx.js +1 -1
  127. package/Image/utils/sizeToNumber.d.ts +2 -2
  128. package/Image/utils/sizeToNumber.js +26 -26
  129. package/Input/Input.d.ts +6 -6
  130. package/Input/Input.js +44 -44
  131. package/Input/index.d.ts +3 -3
  132. package/Input/index.js +3 -3
  133. package/JetshopText.d.ts +3 -3
  134. package/JetshopText.js +11 -11
  135. package/Loading/LoadingBar.d.ts +8 -8
  136. package/Loading/LoadingBar.js +57 -57
  137. package/Loading/LoadingLine.d.ts +31 -31
  138. package/Loading/LoadingLine.js +25 -25
  139. package/Loading/LoadingLine.test.js +18 -18
  140. package/Loading/NetworkStatusNotifier.d.ts +2 -2
  141. package/Loading/NetworkStatusNotifier.js +3 -3
  142. package/Menu/GetMoreSubcategoriesQuery.gql +25 -25
  143. package/Menu/MenuContainer.d.ts +28 -28
  144. package/Menu/MenuContainer.js +45 -45
  145. package/Menu/MenuContainer.test.js +245 -245
  146. package/Menu/RecursiveTree.d.ts +28 -28
  147. package/Menu/RecursiveTree.js +90 -90
  148. package/Menu/RecursiveTree.test.js +416 -416
  149. package/Modal/Drawer/Drawer.d.ts +11 -11
  150. package/Modal/Drawer/Drawer.js +30 -30
  151. package/Modal/Drawer/DrawerTarget.d.ts +6 -6
  152. package/Modal/Drawer/DrawerTarget.js +11 -11
  153. package/Modal/Drawer/DrawerTarget.test.js +92 -92
  154. package/Modal/Drawer/DrawerTrigger.d.ts +11 -11
  155. package/Modal/Drawer/DrawerTrigger.js +15 -15
  156. package/Modal/Drawer/DrawerTrigger.test.js +51 -51
  157. package/Modal/Drawer/index.d.ts +3 -3
  158. package/Modal/Drawer/index.js +3 -3
  159. package/Modal/Flyout/FlyoutTarget.d.ts +10 -10
  160. package/Modal/Flyout/FlyoutTarget.js +14 -14
  161. package/Modal/Flyout/FlyoutTarget.test.js +84 -84
  162. package/Modal/Flyout/FlyoutTrigger.d.ts +15 -15
  163. package/Modal/Flyout/FlyoutTrigger.js +17 -17
  164. package/Modal/Flyout/FlyoutTrigger.test.js +72 -72
  165. package/Modal/Flyout/index.d.ts +2 -2
  166. package/Modal/Flyout/index.js +2 -2
  167. package/Modal/ModalContext.d.ts +26 -26
  168. package/Modal/ModalContext.js +8 -8
  169. package/Modal/ModalProvider.d.ts +5 -5
  170. package/Modal/ModalProvider.js +82 -82
  171. package/Modal/ModalProvider.test.js +26 -26
  172. package/Modal/ModalRoot.d.ts +3 -3
  173. package/Modal/ModalRoot.js +43 -43
  174. package/Modal/ModalRoot.test.js +80 -80
  175. package/Modal/ModalTrigger.d.ts +9 -9
  176. package/Modal/ModalTrigger.js +8 -8
  177. package/Modal/__test_utils__/getComponentWithModalContext.js +29 -29
  178. package/Pagination/Pagination.d.ts +7 -7
  179. package/Pagination/Pagination.js +22 -22
  180. package/Pagination/PaginationBehaviour.d.ts +52 -52
  181. package/Pagination/PaginationBehaviour.js +67 -67
  182. package/Pagination/index.d.ts +2 -2
  183. package/Pagination/index.js +2 -2
  184. package/Pagination/usePagination.d.ts +15 -15
  185. package/Pagination/usePagination.js +45 -45
  186. package/PreOrderDateSelector/PreOrderDateSelector.d.ts +20 -20
  187. package/PreOrderDateSelector/PreOrderDateSelector.js +73 -73
  188. package/PreOrderDateSelector/index.d.ts +2 -2
  189. package/PreOrderDateSelector/index.js +2 -2
  190. package/Price/Currency.d.ts +9 -9
  191. package/Price/Currency.js +10 -10
  192. package/Price/Price.d.ts +29 -28
  193. package/Price/Price.js +35 -34
  194. package/Price/Price.js.map +1 -1
  195. package/Price/index.d.ts +1 -1
  196. package/Price/index.js +1 -1
  197. package/ProductLink.d.ts +21 -21
  198. package/ProductLink.js +81 -81
  199. package/ProductList/Badges.d.ts +6 -6
  200. package/ProductList/Badges.js +55 -55
  201. package/ProductList/GridProduct.d.ts +24 -24
  202. package/ProductList/GridProduct.js +57 -57
  203. package/ProductList/ProductGrid.d.ts +16 -16
  204. package/ProductList/ProductGrid.js +29 -29
  205. package/ProductList/ProductImage.d.ts +12 -12
  206. package/ProductList/ProductImage.js +20 -20
  207. package/ProductSpecifications/ProductSpecifications.d.ts +8 -8
  208. package/ProductSpecifications/ProductSpecifications.js +77 -77
  209. package/ScrollRestorationHandler/ScrollRestorationHandler.d.ts +8 -8
  210. package/ScrollRestorationHandler/ScrollRestorationHandler.js +16 -16
  211. package/ScrollRestorationHandler/ScrollRestorationHandler.test.js +75 -75
  212. package/ScrollRestorationHandler/index.d.ts +1 -1
  213. package/ScrollRestorationHandler/index.js +1 -1
  214. package/ScrollRestorationHandler/isInIgnoredRouteTypes.d.ts +6 -6
  215. package/ScrollRestorationHandler/isInIgnoredRouteTypes.js +7 -7
  216. package/ScrollRestorationHandler/useScrollRestore.d.ts +7 -7
  217. package/ScrollRestorationHandler/useScrollRestore.js +19 -19
  218. package/Search/AutocompleteQuery.gql +10 -10
  219. package/Search/SearchAutoCompleteContainer.d.ts +45 -45
  220. package/Search/SearchAutoCompleteContainer.js +171 -171
  221. package/Search/SearchAutoCompleteContainer.test.js +460 -460
  222. package/Search/SearchField.d.ts +15 -15
  223. package/Search/SearchField.js +96 -96
  224. package/Search/SearchPage/PageOf.d.ts +5 -5
  225. package/Search/SearchPage/PageOf.js +6 -6
  226. package/Search/SearchPage/SearchMeta.d.ts +16 -16
  227. package/Search/SearchPage/SearchMeta.js +19 -19
  228. package/Search/SearchPage/SearchPageBehaviour.d.ts +19 -19
  229. package/Search/SearchPage/SearchPageBehaviour.js +66 -66
  230. package/Search/SuggestedTerm.d.ts +16 -16
  231. package/Search/SuggestedTerm.js +34 -34
  232. package/Search/index.d.ts +1 -1
  233. package/Search/index.js +1 -1
  234. package/Select/Components.d.ts +28 -28
  235. package/Select/Components.js +90 -90
  236. package/Select/SelectComponents/Quantity.d.ts +5 -5
  237. package/Select/SelectComponents/Quantity.js +7 -7
  238. package/Select/index.d.ts +5 -5
  239. package/Select/index.js +1 -1
  240. package/SortOrder/SortOrder.d.ts +16 -16
  241. package/SortOrder/SortOrder.js +31 -31
  242. package/SortOrder/SortOrderDropdown.d.ts +9 -9
  243. package/SortOrder/SortOrderDropdown.js +24 -24
  244. package/SortOrder/SortOrderList.d.ts +7 -7
  245. package/SortOrder/SortOrderList.js +16 -16
  246. package/StartPageRenderer/StartPageRenderer.d.ts +17 -17
  247. package/StartPageRenderer/StartPageRenderer.js +51 -51
  248. package/StartPageRenderer/index.d.ts +1 -1
  249. package/StartPageRenderer/index.js +1 -1
  250. package/Stock/StockStatusContainer.d.ts +16 -16
  251. package/Stock/StockStatusContainer.js +39 -39
  252. package/Stock/__tests__/StockStatusContainer.test.js +65 -65
  253. package/Text/Text.d.ts +11 -11
  254. package/Text/Text.js +21 -21
  255. package/Text/index.d.ts +3 -3
  256. package/Text/index.js +3 -3
  257. package/Theme/createTheme.d.ts +16 -16
  258. package/Theme/createTheme.js +4 -4
  259. package/Theme/cssReset.d.ts +1 -1
  260. package/Theme/cssReset.js +159 -159
  261. package/Theme/normalizeCss.d.ts +1 -1
  262. package/Theme/normalizeCss.js +356 -356
  263. package/Theme/sanitizeCss.d.ts +1 -1
  264. package/Theme/sanitizeCss.js +571 -571
  265. package/WindowGrid/WindowGrid.d.ts +11 -11
  266. package/WindowGrid/WindowGrid.js +57 -57
  267. package/WindowGrid/index.d.ts +1 -1
  268. package/WindowGrid/index.js +1 -1
  269. package/WindowGrid/useResizeObserver.d.ts +8 -8
  270. package/WindowGrid/useResizeObserver.js +13 -13
  271. package/WindowGrid/useScrollWithWindow.d.ts +12 -12
  272. package/WindowGrid/useScrollWithWindow.js +38 -38
  273. package/dependencies.d.ts +98 -98
  274. package/fuzzySearch/fuzzySearch.d.ts +8 -8
  275. package/fuzzySearch/fuzzySearch.js +42 -42
  276. package/fuzzySearch/index.d.ts +1 -1
  277. package/fuzzySearch/index.js +1 -1
  278. package/global.d.ts +1 -1
  279. package/hooks/index.d.ts +2 -2
  280. package/hooks/index.js +2 -2
  281. package/hooks/useOnClickOutside.d.ts +6 -6
  282. package/hooks/useOnClickOutside.js +16 -16
  283. package/hooks/useOnEsc.d.ts +4 -4
  284. package/hooks/useOnEsc.js +16 -16
  285. package/package.json +1 -1
  286. package/setupTests.js +2 -2
  287. package/svg/flags/ad.svg +150 -150
  288. package/svg/flags/ae.svg +6 -6
  289. package/svg/flags/af.svg +81 -81
  290. package/svg/flags/ag.svg +14 -14
  291. package/svg/flags/ai.svg +767 -767
  292. package/svg/flags/al.svg +5 -5
  293. package/svg/flags/am.svg +5 -5
  294. package/svg/flags/ao.svg +13 -13
  295. package/svg/flags/aq.svg +6 -6
  296. package/svg/flags/ar.svg +31 -31
  297. package/svg/flags/as.svg +33 -33
  298. package/svg/flags/at.svg +6 -6
  299. package/svg/flags/au.svg +9 -9
  300. package/svg/flags/aw.svg +186 -186
  301. package/svg/flags/ax.svg +18 -18
  302. package/svg/flags/az.svg +8 -8
  303. package/svg/flags/ba.svg +12 -12
  304. package/svg/flags/bb.svg +6 -6
  305. package/svg/flags/bd.svg +4 -4
  306. package/svg/flags/be.svg +7 -7
  307. package/svg/flags/bf.svg +7 -7
  308. package/svg/flags/bg.svg +7 -7
  309. package/svg/flags/bh.svg +11 -11
  310. package/svg/flags/bi.svg +15 -15
  311. package/svg/flags/bj.svg +14 -14
  312. package/svg/flags/bl.svg +7 -7
  313. package/svg/flags/bm.svg +98 -98
  314. package/svg/flags/bn.svg +36 -36
  315. package/svg/flags/bo.svg +676 -676
  316. package/svg/flags/bq.svg +5 -5
  317. package/svg/flags/br.svg +45 -45
  318. package/svg/flags/bs.svg +13 -13
  319. package/svg/flags/bt.svg +89 -89
  320. package/svg/flags/bv.svg +13 -13
  321. package/svg/flags/bw.svg +7 -7
  322. package/svg/flags/by.svg +20 -20
  323. package/svg/flags/bz.svg +145 -145
  324. package/svg/flags/ca.svg +4 -4
  325. package/svg/flags/cc.svg +19 -19
  326. package/svg/flags/cd.svg +5 -5
  327. package/svg/flags/cf.svg +15 -15
  328. package/svg/flags/cg.svg +12 -12
  329. package/svg/flags/ch.svg +9 -9
  330. package/svg/flags/ci.svg +7 -7
  331. package/svg/flags/ck.svg +9 -9
  332. package/svg/flags/cl.svg +13 -13
  333. package/svg/flags/cm.svg +15 -15
  334. package/svg/flags/cn.svg +11 -11
  335. package/svg/flags/co.svg +7 -7
  336. package/svg/flags/cr.svg +7 -7
  337. package/svg/flags/cu.svg +13 -13
  338. package/svg/flags/cv.svg +13 -13
  339. package/svg/flags/cw.svg +14 -14
  340. package/svg/flags/cx.svg +15 -15
  341. package/svg/flags/cy.svg +6 -6
  342. package/svg/flags/cz.svg +12 -12
  343. package/svg/flags/de.svg +5 -5
  344. package/svg/flags/dj.svg +13 -13
  345. package/svg/flags/dk.svg +5 -5
  346. package/svg/flags/dm.svg +152 -152
  347. package/svg/flags/do.svg +6745 -6745
  348. package/svg/flags/dz.svg +5 -5
  349. package/svg/flags/ec.svg +138 -138
  350. package/svg/flags/ee.svg +7 -7
  351. package/svg/flags/eg.svg +38 -38
  352. package/svg/flags/eh.svg +15 -15
  353. package/svg/flags/er.svg +8 -8
  354. package/svg/flags/es-ct.svg +4 -4
  355. package/svg/flags/es.svg +544 -544
  356. package/svg/flags/et.svg +14 -14
  357. package/svg/flags/eu.svg +28 -28
  358. package/svg/flags/fi.svg +5 -5
  359. package/svg/flags/fj.svg +120 -120
  360. package/svg/flags/fk.svg +89 -89
  361. package/svg/flags/fm.svg +11 -11
  362. package/svg/flags/fo.svg +12 -12
  363. package/svg/flags/fr.svg +7 -7
  364. package/svg/flags/ga.svg +7 -7
  365. package/svg/flags/gb-eng.svg +5 -5
  366. package/svg/flags/gb-nir.svg +131 -131
  367. package/svg/flags/gb-sct.svg +4 -4
  368. package/svg/flags/gb-wls.svg +9 -9
  369. package/svg/flags/gb.svg +15 -15
  370. package/svg/flags/gd.svg +27 -27
  371. package/svg/flags/ge.svg +6 -6
  372. package/svg/flags/gf.svg +5 -5
  373. package/svg/flags/gg.svg +9 -9
  374. package/svg/flags/gh.svg +6 -6
  375. package/svg/flags/gi.svg +32 -32
  376. package/svg/flags/gl.svg +4 -4
  377. package/svg/flags/gm.svg +14 -14
  378. package/svg/flags/gn.svg +7 -7
  379. package/svg/flags/gp.svg +7 -7
  380. package/svg/flags/gq.svg +23 -23
  381. package/svg/flags/gr.svg +22 -22
  382. package/svg/flags/gs.svg +201 -201
  383. package/svg/flags/gt.svg +204 -204
  384. package/svg/flags/gu.svg +39 -39
  385. package/svg/flags/gw.svg +13 -13
  386. package/svg/flags/gy.svg +9 -9
  387. package/svg/flags/hk.svg +30 -30
  388. package/svg/flags/hm.svg +9 -9
  389. package/svg/flags/hn.svg +18 -18
  390. package/svg/flags/hr.svg +58 -58
  391. package/svg/flags/ht.svg +116 -116
  392. package/svg/flags/hu.svg +7 -7
  393. package/svg/flags/id.svg +6 -6
  394. package/svg/flags/ie.svg +7 -7
  395. package/svg/flags/il.svg +14 -14
  396. package/svg/flags/im.svg +36 -36
  397. package/svg/flags/in.svg +25 -25
  398. package/svg/flags/io.svg +138 -138
  399. package/svg/flags/iq.svg +10 -10
  400. package/svg/flags/ir.svg +219 -219
  401. package/svg/flags/is.svg +12 -12
  402. package/svg/flags/it.svg +7 -7
  403. package/svg/flags/je.svg +31 -31
  404. package/svg/flags/jm.svg +8 -8
  405. package/svg/flags/jo.svg +16 -16
  406. package/svg/flags/jp.svg +11 -11
  407. package/svg/flags/ke.svg +23 -23
  408. package/svg/flags/kg.svg +15 -15
  409. package/svg/flags/kh.svg +61 -61
  410. package/svg/flags/ki.svg +36 -36
  411. package/svg/flags/km.svg +16 -16
  412. package/svg/flags/kn.svg +14 -14
  413. package/svg/flags/kp.svg +15 -15
  414. package/svg/flags/kr.svg +24 -24
  415. package/svg/flags/kw.svg +13 -13
  416. package/svg/flags/ky.svg +63 -63
  417. package/svg/flags/kz.svg +23 -23
  418. package/svg/flags/la.svg +12 -12
  419. package/svg/flags/lb.svg +15 -15
  420. package/svg/flags/lc.svg +8 -8
  421. package/svg/flags/li.svg +43 -43
  422. package/svg/flags/lk.svg +22 -22
  423. package/svg/flags/lr.svg +14 -14
  424. package/svg/flags/ls.svg +8 -8
  425. package/svg/flags/lt.svg +7 -7
  426. package/svg/flags/lu.svg +5 -5
  427. package/svg/flags/lv.svg +6 -6
  428. package/svg/flags/ly.svg +13 -13
  429. package/svg/flags/ma.svg +4 -4
  430. package/svg/flags/mc.svg +6 -6
  431. package/svg/flags/md.svg +70 -70
  432. package/svg/flags/me.svg +116 -116
  433. package/svg/flags/mf.svg +7 -7
  434. package/svg/flags/mg.svg +7 -7
  435. package/svg/flags/mh.svg +7 -7
  436. package/svg/flags/mk.svg +5 -5
  437. package/svg/flags/ml.svg +7 -7
  438. package/svg/flags/mm.svg +16 -16
  439. package/svg/flags/mn.svg +13 -13
  440. package/svg/flags/mo.svg +9 -9
  441. package/svg/flags/mp.svg +86 -86
  442. package/svg/flags/mq.svg +7 -7
  443. package/svg/flags/mr.svg +6 -6
  444. package/svg/flags/ms.svg +39 -39
  445. package/svg/flags/mt.svg +49 -49
  446. package/svg/flags/mu.svg +8 -8
  447. package/svg/flags/mv.svg +6 -6
  448. package/svg/flags/mw.svg +10 -10
  449. package/svg/flags/mx.svg +382 -382
  450. package/svg/flags/my.svg +15 -15
  451. package/svg/flags/mz.svg +21 -21
  452. package/svg/flags/na.svg +16 -16
  453. package/svg/flags/nc.svg +7 -7
  454. package/svg/flags/ne.svg +6 -6
  455. package/svg/flags/nf.svg +9 -9
  456. package/svg/flags/ng.svg +6 -6
  457. package/svg/flags/ni.svg +129 -129
  458. package/svg/flags/nl.svg +7 -7
  459. package/svg/flags/no.svg +7 -7
  460. package/svg/flags/np.svg +14 -14
  461. package/svg/flags/nr.svg +12 -12
  462. package/svg/flags/nu.svg +26 -26
  463. package/svg/flags/nz.svg +41 -41
  464. package/svg/flags/om.svg +115 -115
  465. package/svg/flags/pa.svg +14 -14
  466. package/svg/flags/pe.svg +244 -244
  467. package/svg/flags/pf.svg +19 -19
  468. package/svg/flags/pg.svg +9 -9
  469. package/svg/flags/ph.svg +13 -13
  470. package/svg/flags/pk.svg +15 -15
  471. package/svg/flags/pl.svg +6 -6
  472. package/svg/flags/pm.svg +7 -7
  473. package/svg/flags/pn.svg +62 -62
  474. package/svg/flags/pr.svg +13 -13
  475. package/svg/flags/ps.svg +15 -15
  476. package/svg/flags/pt.svg +57 -57
  477. package/svg/flags/pw.svg +11 -11
  478. package/svg/flags/py.svg +157 -157
  479. package/svg/flags/qa.svg +4 -4
  480. package/svg/flags/re.svg +7 -7
  481. package/svg/flags/ro.svg +7 -7
  482. package/svg/flags/rs.svg +292 -292
  483. package/svg/flags/ru.svg +7 -7
  484. package/svg/flags/rw.svg +13 -13
  485. package/svg/flags/sa.svg +26 -26
  486. package/svg/flags/sb.svg +13 -13
  487. package/svg/flags/sc.svg +14 -14
  488. package/svg/flags/sd.svg +13 -13
  489. package/svg/flags/se.svg +16 -16
  490. package/svg/flags/sg.svg +13 -13
  491. package/svg/flags/sh.svg +74 -74
  492. package/svg/flags/si.svg +18 -18
  493. package/svg/flags/sj.svg +7 -7
  494. package/svg/flags/sk.svg +9 -9
  495. package/svg/flags/sl.svg +7 -7
  496. package/svg/flags/sm.svg +91 -91
  497. package/svg/flags/sn.svg +8 -8
  498. package/svg/flags/so.svg +11 -11
  499. package/svg/flags/sr.svg +6 -6
  500. package/svg/flags/ss.svg +8 -8
  501. package/svg/flags/st.svg +16 -16
  502. package/svg/flags/sv.svg +606 -606
  503. package/svg/flags/sx.svg +56 -56
  504. package/svg/flags/sy.svg +6 -6
  505. package/svg/flags/sz.svg +45 -45
  506. package/svg/flags/tc.svg +67 -67
  507. package/svg/flags/td.svg +7 -7
  508. package/svg/flags/tf.svg +15 -15
  509. package/svg/flags/tg.svg +14 -14
  510. package/svg/flags/th.svg +7 -7
  511. package/svg/flags/tj.svg +22 -22
  512. package/svg/flags/tk.svg +5 -5
  513. package/svg/flags/tl.svg +13 -13
  514. package/svg/flags/tm.svg +206 -206
  515. package/svg/flags/tn.svg +13 -13
  516. package/svg/flags/to.svg +10 -10
  517. package/svg/flags/tr.svg +8 -8
  518. package/svg/flags/tt.svg +5 -5
  519. package/svg/flags/tv.svg +27 -27
  520. package/svg/flags/tw.svg +14 -14
  521. package/svg/flags/tz.svg +13 -13
  522. package/svg/flags/ua.svg +6 -6
  523. package/svg/flags/ug.svg +30 -30
  524. package/svg/flags/um.svg +15 -15
  525. package/svg/flags/un.svg +16 -16
  526. package/svg/flags/us.svg +10 -10
  527. package/svg/flags/uy.svg +28 -28
  528. package/svg/flags/uz.svg +30 -30
  529. package/svg/flags/va.svg +479 -479
  530. package/svg/flags/vc.svg +8 -8
  531. package/svg/flags/ve.svg +26 -26
  532. package/svg/flags/vg.svg +127 -127
  533. package/svg/flags/vi.svg +28 -28
  534. package/svg/flags/vn.svg +11 -11
  535. package/svg/flags/vu.svg +18 -18
  536. package/svg/flags/wf.svg +7 -7
  537. package/svg/flags/ws.svg +7 -7
  538. package/svg/flags/ye.svg +7 -7
  539. package/svg/flags/yt.svg +7 -7
  540. package/svg/flags/za.svg +17 -17
  541. package/svg/flags/zm.svg +27 -27
  542. package/svg/flags/zw.svg +21 -21
  543. package/test-utils/mock-response/product-status.js +44 -44
  544. package/utils/breakpoints.d.ts +23 -23
  545. package/utils/breakpoints.js +89 -89
  546. package/utils/callAllEventHandlers.d.ts +5 -5
  547. package/utils/callAllEventHandlers.js +8 -8
  548. package/utils/text.d.ts +1 -1
  549. package/utils/text.js +22 -22
  550. package/utils/theme.d.ts +3 -3
  551. package/utils/theme.js +4 -4
  552. package/utils/useHoverIntent.d.ts +10 -10
  553. package/utils/useHoverIntent.js +77 -77
  554. package/utils/usePropsOfType.d.ts +11 -11
  555. package/utils/usePropsOfType.js +17 -17
  556. package/withFlightUI.d.ts +17 -17
  557. package/withFlightUI.js +19 -19
@@ -1,97 +1,97 @@
1
- import useWarningInDev from '@jetshop/core/hooks/useWarningInDev';
2
- import { getFullUrl } from './utils/getFullUrl';
3
- import { getImageWidths } from './utils/getImageWidths';
4
- import { getLargestSize } from './utils/getLargestSize';
5
- import { getLQIP } from './utils/getLQIP';
6
- import { getSizesMap } from './utils/getSizesMap';
7
- import { getSrcSetFromWidths } from './utils/getSrcSetFromWidths';
8
- import React from 'react';
9
- /**
10
- * Dynamically constructs the query parameters used by ImageMagick to size the image appropriately.
11
- * Also generates a LQIP using query parameters, to display while the full image loads.
12
- */
13
- export function useConstructImage({ gravity, crop, src, sizes, aspect, critical, quality, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }) {
14
- // Warn if gravity was provided but crop was not
15
- useWarningInDev(gravity && !crop, 'You have provided a gravity without setting crop to true. Your image will not be cropped, and the `gravity` prop will do nothing. Please remove the `gravity` prop.');
16
- // Warn if the src is a falsy value
17
- useWarningInDev(!!!src, 'You have provided a falsy value to the Image component. If you intentionally want to display a blank Image component, you may import `transparentDataImg` and use it for the src. Otherwise, this is probably a bug.');
18
- /*
19
- For backwards-compatibility (and dev convenience) reasons, we accept a
20
- falsy `src` prop on Image. undefined | null will act just like the normal
21
- Image component does, except that it will show a transparent image where
22
- the image would normally load. This may be useful in cases where the end
23
- user is lazy and wants to do this:
24
-
25
- const { imageSrc } = someDataRequest();
26
- <Image src={imageSrc} />
27
-
28
- Where imageSrc may be undefined | null while the request is occurring. The
29
- preferred method is to be more explicit:
30
-
31
- const {imageSrc, loading} = someDataRequest();
32
- <Image src={loading ? transparentDataImg : imageSrc } />
33
-
34
- Therefore, whilst we will handle a null | undefined src, we will warn
35
- against its usage in dev.
36
- */
37
- let hasFalsySrc = true;
38
- let imageSrc = '';
39
- if (Array.isArray(src)) {
40
- // maintain support for deprecated image sizes array
41
- hasFalsySrc = false;
42
- imageSrc = getFullUrl(getLargestSize(src), baseUrl);
43
- }
44
- // When we have a string for the src
45
- if (!!src && typeof src === 'string') {
46
- hasFalsySrc = false;
47
- imageSrc = getFullUrl(src, baseUrl);
48
- }
49
- if (!!src && typeof src === 'object' && src.value) {
50
- hasFalsySrc = false;
51
- imageSrc = getFullUrl(src.value, baseUrl);
52
- }
53
- // useMemo so this runs only if the image props change. It calculates the
54
- // strings used for `sizes`, `srcset`, and the `lqip`
55
- const { sizesMap, srcset, lqip, webpSrcset } = React.useMemo(() => {
56
- if (hasFalsySrc) {
57
- return {};
58
- }
59
- const widths = getImageWidths(Object.values(breakpoints), sizes);
60
- const srcSetFromWidths = ({ webp }) => getSrcSetFromWidths(imageSrc, widths, aspect, {
61
- crop,
62
- gravity,
63
- quality,
64
- webp,
65
- focalPointX,
66
- focalPointY
67
- }, modifiedDate);
68
- const srcset = srcSetFromWidths({ webp: false });
69
- const webpSrcset = srcSetFromWidths({ webp: true });
70
- // If this is a critical image, don't calculate LQIP
71
- const lqip = critical ? null : getLQIP(imageSrc, widths, aspect, crop);
72
- const sizesMap = getSizesMap(Object.values(breakpoints), sizes);
73
- return { sizesMap, srcset, lqip, webpSrcset };
74
- }, [
75
- aspect,
76
- breakpoints,
77
- crop,
78
- gravity,
79
- hasFalsySrc,
80
- imageSrc,
81
- quality,
82
- sizes,
83
- critical,
84
- modifiedDate,
85
- focalPointX,
86
- focalPointY
87
- ]);
88
- return {
89
- srcset,
90
- webpSrcset,
91
- sizes: sizesMap,
92
- lqip,
93
- src: imageSrc,
94
- hasFalsySrc
95
- };
96
- }
1
+ import useWarningInDev from '@jetshop/core/hooks/useWarningInDev';
2
+ import { getFullUrl } from './utils/getFullUrl';
3
+ import { getImageWidths } from './utils/getImageWidths';
4
+ import { getLargestSize } from './utils/getLargestSize';
5
+ import { getLQIP } from './utils/getLQIP';
6
+ import { getSizesMap } from './utils/getSizesMap';
7
+ import { getSrcSetFromWidths } from './utils/getSrcSetFromWidths';
8
+ import React from 'react';
9
+ /**
10
+ * Dynamically constructs the query parameters used by ImageMagick to size the image appropriately.
11
+ * Also generates a LQIP using query parameters, to display while the full image loads.
12
+ */
13
+ export function useConstructImage({ gravity, crop, src, sizes, aspect, critical, quality, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }) {
14
+ // Warn if gravity was provided but crop was not
15
+ useWarningInDev(gravity && !crop, 'You have provided a gravity without setting crop to true. Your image will not be cropped, and the `gravity` prop will do nothing. Please remove the `gravity` prop.');
16
+ // Warn if the src is a falsy value
17
+ useWarningInDev(!!!src, 'You have provided a falsy value to the Image component. If you intentionally want to display a blank Image component, you may import `transparentDataImg` and use it for the src. Otherwise, this is probably a bug.');
18
+ /*
19
+ For backwards-compatibility (and dev convenience) reasons, we accept a
20
+ falsy `src` prop on Image. undefined | null will act just like the normal
21
+ Image component does, except that it will show a transparent image where
22
+ the image would normally load. This may be useful in cases where the end
23
+ user is lazy and wants to do this:
24
+
25
+ const { imageSrc } = someDataRequest();
26
+ <Image src={imageSrc} />
27
+
28
+ Where imageSrc may be undefined | null while the request is occurring. The
29
+ preferred method is to be more explicit:
30
+
31
+ const {imageSrc, loading} = someDataRequest();
32
+ <Image src={loading ? transparentDataImg : imageSrc } />
33
+
34
+ Therefore, whilst we will handle a null | undefined src, we will warn
35
+ against its usage in dev.
36
+ */
37
+ let hasFalsySrc = true;
38
+ let imageSrc = '';
39
+ if (Array.isArray(src)) {
40
+ // maintain support for deprecated image sizes array
41
+ hasFalsySrc = false;
42
+ imageSrc = getFullUrl(getLargestSize(src), baseUrl);
43
+ }
44
+ // When we have a string for the src
45
+ if (!!src && typeof src === 'string') {
46
+ hasFalsySrc = false;
47
+ imageSrc = getFullUrl(src, baseUrl);
48
+ }
49
+ if (!!src && typeof src === 'object' && src.value) {
50
+ hasFalsySrc = false;
51
+ imageSrc = getFullUrl(src.value, baseUrl);
52
+ }
53
+ // useMemo so this runs only if the image props change. It calculates the
54
+ // strings used for `sizes`, `srcset`, and the `lqip`
55
+ const { sizesMap, srcset, lqip, webpSrcset } = React.useMemo(() => {
56
+ if (hasFalsySrc) {
57
+ return {};
58
+ }
59
+ const widths = getImageWidths(Object.values(breakpoints), sizes);
60
+ const srcSetFromWidths = ({ webp }) => getSrcSetFromWidths(imageSrc, widths, aspect, {
61
+ crop,
62
+ gravity,
63
+ quality,
64
+ webp,
65
+ focalPointX,
66
+ focalPointY
67
+ }, modifiedDate);
68
+ const srcset = srcSetFromWidths({ webp: false });
69
+ const webpSrcset = srcSetFromWidths({ webp: true });
70
+ // If this is a critical image, don't calculate LQIP
71
+ const lqip = critical ? null : getLQIP(imageSrc, widths, aspect, crop);
72
+ const sizesMap = getSizesMap(Object.values(breakpoints), sizes);
73
+ return { sizesMap, srcset, lqip, webpSrcset };
74
+ }, [
75
+ aspect,
76
+ breakpoints,
77
+ crop,
78
+ gravity,
79
+ hasFalsySrc,
80
+ imageSrc,
81
+ quality,
82
+ sizes,
83
+ critical,
84
+ modifiedDate,
85
+ focalPointX,
86
+ focalPointY
87
+ ]);
88
+ return {
89
+ srcset,
90
+ webpSrcset,
91
+ sizes: sizesMap,
92
+ lqip,
93
+ src: imageSrc,
94
+ hasFalsySrc
95
+ };
96
+ }
97
97
  //# sourceMappingURL=useConstructImage.js.map
@@ -1,2 +1,2 @@
1
- import { AspectRatio } from '../Image';
2
- export declare const aspectRatioToFraction: (aspect: AspectRatio) => number;
1
+ import { AspectRatio } from '../Image';
2
+ export declare const aspectRatioToFraction: (aspect: AspectRatio) => number;
@@ -1,11 +1,11 @@
1
- export const aspectRatioToFraction = (aspect) => {
2
- if (typeof aspect === 'string' && aspect.indexOf(':') > 0) {
3
- const [a, b] = aspect.split(':');
4
- return b / a;
5
- }
6
- else if (typeof aspect === 'number') {
7
- return aspect;
8
- }
9
- throw new TypeError('Aspect ratio is not a Number or String with the format n:m');
10
- };
1
+ export const aspectRatioToFraction = (aspect) => {
2
+ if (typeof aspect === 'string' && aspect.indexOf(':') > 0) {
3
+ const [a, b] = aspect.split(':');
4
+ return b / a;
5
+ }
6
+ else if (typeof aspect === 'number') {
7
+ return aspect;
8
+ }
9
+ throw new TypeError('Aspect ratio is not a Number or String with the format n:m');
10
+ };
11
11
  //# sourceMappingURL=aspectRatioToFraction.js.map
@@ -1,6 +1,6 @@
1
- /**
2
- * Constructs the image url by combining the passed-in url with the selected channel
3
- * @param url The image url
4
- * @param baseUrl The baseUrl from the currently-selected channel
5
- */
6
- export declare const getFullUrl: (url: string, baseUrl: string) => string;
1
+ /**
2
+ * Constructs the image url by combining the passed-in url with the selected channel
3
+ * @param url The image url
4
+ * @param baseUrl The baseUrl from the currently-selected channel
5
+ */
6
+ export declare const getFullUrl: (url: string, baseUrl: string) => string;
@@ -1,18 +1,18 @@
1
- /**
2
- * Constructs the image url by combining the passed-in url with the selected channel
3
- * @param url The image url
4
- * @param baseUrl The baseUrl from the currently-selected channel
5
- */
6
- export const getFullUrl = (url, baseUrl) => {
7
- if (!baseUrl || !url) {
8
- return url;
9
- }
10
- url = url.trim();
11
- if (url.indexOf('/') === 0 &&
12
- url.indexOf('//:') === -1 &&
13
- url.indexOf('static/media') === -1) {
14
- return baseUrl + url;
15
- }
16
- return url;
17
- };
1
+ /**
2
+ * Constructs the image url by combining the passed-in url with the selected channel
3
+ * @param url The image url
4
+ * @param baseUrl The baseUrl from the currently-selected channel
5
+ */
6
+ export const getFullUrl = (url, baseUrl) => {
7
+ if (!baseUrl || !url) {
8
+ return url;
9
+ }
10
+ url = url.trim();
11
+ if (url.indexOf('/') === 0 &&
12
+ url.indexOf('//:') === -1 &&
13
+ url.indexOf('static/media') === -1) {
14
+ return baseUrl + url;
15
+ }
16
+ return url;
17
+ };
18
18
  //# sourceMappingURL=getFullUrl.js.map
@@ -1 +1 @@
1
- export declare const getImageWidth: (size: number | string, vw: number, pixelRatio: number) => number;
1
+ export declare const getImageWidth: (size: number | string, vw: number, pixelRatio: number) => number;
@@ -1,12 +1,12 @@
1
- import { sizeToNumber } from './sizeToNumber';
2
- export const getImageWidth = (size = 1, vw, pixelRatio) => {
3
- // Convert input size to fraction or px value
4
- size = sizeToNumber(size);
5
- // Size is in px
6
- if (size > 2) {
7
- return Math.round(size * pixelRatio);
8
- }
9
- // Size is a fraction
10
- return Math.round(vw * size * pixelRatio);
11
- };
1
+ import { sizeToNumber } from './sizeToNumber';
2
+ export const getImageWidth = (size = 1, vw, pixelRatio) => {
3
+ // Convert input size to fraction or px value
4
+ size = sizeToNumber(size);
5
+ // Size is in px
6
+ if (size > 2) {
7
+ return Math.round(size * pixelRatio);
8
+ }
9
+ // Size is a fraction
10
+ return Math.round(vw * size * pixelRatio);
11
+ };
12
12
  //# sourceMappingURL=getImageWidth.js.map
@@ -1,2 +1,2 @@
1
- import { BreakpointValues, ImageBreakpointSizes } from '../Image';
2
- export declare const getImageWidths: (breakpoints: BreakpointValues, sizes: ImageBreakpointSizes) => number[];
1
+ import { BreakpointValues, ImageBreakpointSizes } from '../Image';
2
+ export declare const getImageWidths: (breakpoints: BreakpointValues, sizes: ImageBreakpointSizes) => number[];
@@ -1,14 +1,14 @@
1
- import { getImageWidth } from './getImageWidth';
2
- import { remToPx } from './remToPx';
3
- import { getSizeForBreakpoint } from './getSizeForBreakpoint';
4
- export const getImageWidths = (breakpoints, sizes) => {
5
- const all = new Set();
6
- for (let i = 0; i < breakpoints.length; i++) {
7
- const bpSize = getSizeForBreakpoint(sizes, i);
8
- const px = remToPx(breakpoints[i]);
9
- all.add(getImageWidth(bpSize, px, 1));
10
- all.add(getImageWidth(bpSize, px, 2));
11
- }
12
- return Array.from(all).sort();
13
- };
1
+ import { getImageWidth } from './getImageWidth';
2
+ import { remToPx } from './remToPx';
3
+ import { getSizeForBreakpoint } from './getSizeForBreakpoint';
4
+ export const getImageWidths = (breakpoints, sizes) => {
5
+ const all = new Set();
6
+ for (let i = 0; i < breakpoints.length; i++) {
7
+ const bpSize = getSizeForBreakpoint(sizes, i);
8
+ const px = remToPx(breakpoints[i]);
9
+ all.add(getImageWidth(bpSize, px, 1));
10
+ all.add(getImageWidth(bpSize, px, 2));
11
+ }
12
+ return Array.from(all).sort();
13
+ };
14
14
  //# sourceMappingURL=getImageWidths.js.map
@@ -1,8 +1,8 @@
1
- /**
2
- * Generates a LQIP (Low Quality Image Placeholder) using the Flight image
3
- * handling API (via query params)
4
- * @param src The image src
5
- * @param widths An array of image widths
6
- * @param aspect The desired aspect ratio of the placeholder
7
- */
8
- export declare function getLQIP(src: string, widths: number[], aspect: string, crop?: boolean): string;
1
+ /**
2
+ * Generates a LQIP (Low Quality Image Placeholder) using the Flight image
3
+ * handling API (via query params)
4
+ * @param src The image src
5
+ * @param widths An array of image widths
6
+ * @param aspect The desired aspect ratio of the placeholder
7
+ */
8
+ export declare function getLQIP(src: string, widths: number[], aspect: string, crop?: boolean): string;
@@ -1,20 +1,20 @@
1
- import { getSrcWithParams } from './getSrcWithParams';
2
- /**
3
- * Generates a LQIP (Low Quality Image Placeholder) using the Flight image
4
- * handling API (via query params)
5
- * @param src The image src
6
- * @param widths An array of image widths
7
- * @param aspect The desired aspect ratio of the placeholder
8
- */
9
- export function getLQIP(src, widths, aspect, crop = false) {
10
- const transparent = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=';
11
- if (!src)
12
- return transparent;
13
- // Use the smallest width for the placeholder, to ensure it is the smallest filesize possible
14
- const smallestWidth = widths.sort((a, b) => a - b)[0];
15
- const finalSrc = getSrcWithParams(smallestWidth, aspect, src, false, {
16
- crop
17
- }) + '&sigma=2.5&minampl=0.5&quality=30&type=auto';
18
- return finalSrc;
19
- }
1
+ import { getSrcWithParams } from './getSrcWithParams';
2
+ /**
3
+ * Generates a LQIP (Low Quality Image Placeholder) using the Flight image
4
+ * handling API (via query params)
5
+ * @param src The image src
6
+ * @param widths An array of image widths
7
+ * @param aspect The desired aspect ratio of the placeholder
8
+ */
9
+ export function getLQIP(src, widths, aspect, crop = false) {
10
+ const transparent = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=';
11
+ if (!src)
12
+ return transparent;
13
+ // Use the smallest width for the placeholder, to ensure it is the smallest filesize possible
14
+ const smallestWidth = widths.sort((a, b) => a - b)[0];
15
+ const finalSrc = getSrcWithParams(smallestWidth, aspect, src, false, {
16
+ crop
17
+ }) + '&sigma=2.5&minampl=0.5&quality=30&type=auto';
18
+ return finalSrc;
19
+ }
20
20
  //# sourceMappingURL=getLQIP.js.map
@@ -1,7 +1,7 @@
1
- import { ProductImageSize } from '@jetshop/core/types';
2
- /**
3
- * This exists to handle the deprecated `ProductImageSize` field from the API
4
- * Takes an array of sizes, and returns the url of the largest one
5
- * @param sizes Sizes field returned from API
6
- */
7
- export declare const getLargestSize: (sizes: string | ProductImageSize[]) => any;
1
+ import { ProductImageSize } from '@jetshop/core/types';
2
+ /**
3
+ * This exists to handle the deprecated `ProductImageSize` field from the API
4
+ * Takes an array of sizes, and returns the url of the largest one
5
+ * @param sizes Sizes field returned from API
6
+ */
7
+ export declare const getLargestSize: (sizes: string | ProductImageSize[]) => any;
@@ -1,17 +1,17 @@
1
- /**
2
- * This exists to handle the deprecated `ProductImageSize` field from the API
3
- * Takes an array of sizes, and returns the url of the largest one
4
- * @param sizes Sizes field returned from API
5
- */
6
- export const getLargestSize = (sizes) => {
7
- if (Array.isArray(sizes)) {
8
- if (sizes.length === 0) {
9
- throw new Error('Sizes must not be an empty array');
10
- }
11
- return sizes[sizes.length - 1].url;
12
- }
13
- else {
14
- return sizes.toString();
15
- }
16
- };
1
+ /**
2
+ * This exists to handle the deprecated `ProductImageSize` field from the API
3
+ * Takes an array of sizes, and returns the url of the largest one
4
+ * @param sizes Sizes field returned from API
5
+ */
6
+ export const getLargestSize = (sizes) => {
7
+ if (Array.isArray(sizes)) {
8
+ if (sizes.length === 0) {
9
+ throw new Error('Sizes must not be an empty array');
10
+ }
11
+ return sizes[sizes.length - 1].url;
12
+ }
13
+ else {
14
+ return sizes.toString();
15
+ }
16
+ };
17
17
  //# sourceMappingURL=getLargestSize.js.map
@@ -1,2 +1,2 @@
1
- import { ImageBreakpointSizes } from '../Image';
2
- export declare const getSizeForBreakpoint: (sizes: ImageBreakpointSizes, offset: number) => number;
1
+ import { ImageBreakpointSizes } from '../Image';
2
+ export declare const getSizeForBreakpoint: (sizes: ImageBreakpointSizes, offset: number) => number;
@@ -1,16 +1,16 @@
1
- import { sizeToNumber } from './sizeToNumber';
2
- export const getSizeForBreakpoint = (sizes, offset) => {
3
- if (Array.isArray(sizes)) {
4
- do {
5
- if (sizes[offset]) {
6
- return sizeToNumber(sizes[offset]);
7
- }
8
- offset--;
9
- } while (offset >= 0);
10
- }
11
- else {
12
- return sizeToNumber(sizes);
13
- }
14
- return 1;
15
- };
1
+ import { sizeToNumber } from './sizeToNumber';
2
+ export const getSizeForBreakpoint = (sizes, offset) => {
3
+ if (Array.isArray(sizes)) {
4
+ do {
5
+ if (sizes[offset]) {
6
+ return sizeToNumber(sizes[offset]);
7
+ }
8
+ offset--;
9
+ } while (offset >= 0);
10
+ }
11
+ else {
12
+ return sizeToNumber(sizes);
13
+ }
14
+ return 1;
15
+ };
16
16
  //# sourceMappingURL=getSizeForBreakpoint.js.map
@@ -1,2 +1,2 @@
1
- import { BreakpointValues, ImageBreakpointSizes } from '../Image';
2
- export declare const getSizesMap: (breakpoints: BreakpointValues, sizes: ImageBreakpointSizes) => string;
1
+ import { BreakpointValues, ImageBreakpointSizes } from '../Image';
2
+ export declare const getSizesMap: (breakpoints: BreakpointValues, sizes: ImageBreakpointSizes) => string;
@@ -1,22 +1,22 @@
1
- import { getSizeForBreakpoint } from './getSizeForBreakpoint';
2
- export const getSizesMap = (breakpoints, sizes) => breakpoints
3
- .map((breakpoint, i) => {
4
- const size = getSizeForBreakpoint(sizes, i);
5
- let width;
6
- if (size > 2) {
7
- // Size is absolute value in px
8
- width = size + 'px';
9
- }
10
- else {
11
- // Size is already a fraction (or unset). Convert it to vw (percentage
12
- // of viewport width)
13
- width = Math.round(100 * (size || 1)) + 'vw';
14
- }
15
- // Include a media query for all but the last size
16
- if (i + 1 < breakpoints.length) {
17
- return `(max-width: ${breakpoint}) ${width}`;
18
- }
19
- return width;
20
- })
21
- .join(', ');
1
+ import { getSizeForBreakpoint } from './getSizeForBreakpoint';
2
+ export const getSizesMap = (breakpoints, sizes) => breakpoints
3
+ .map((breakpoint, i) => {
4
+ const size = getSizeForBreakpoint(sizes, i);
5
+ let width;
6
+ if (size > 2) {
7
+ // Size is absolute value in px
8
+ width = size + 'px';
9
+ }
10
+ else {
11
+ // Size is already a fraction (or unset). Convert it to vw (percentage
12
+ // of viewport width)
13
+ width = Math.round(100 * (size || 1)) + 'vw';
14
+ }
15
+ // Include a media query for all but the last size
16
+ if (i + 1 < breakpoints.length) {
17
+ return `(max-width: ${breakpoint}) ${width}`;
18
+ }
19
+ return width;
20
+ })
21
+ .join(', ');
22
22
  //# sourceMappingURL=getSizesMap.js.map
@@ -1,2 +1,2 @@
1
- import { ImageSrcType } from '../Image';
2
- export declare const getSmallestSize: (sizes: ImageSrcType) => any;
1
+ import { ImageSrcType } from '../Image';
2
+ export declare const getSmallestSize: (sizes: ImageSrcType) => any;
@@ -1,12 +1,12 @@
1
- export const getSmallestSize = (sizes) => {
2
- if (Array.isArray(sizes)) {
3
- if (sizes.length === 0) {
4
- throw new Error('Sizes must not be an empty array');
5
- }
6
- return sizes[0].url;
7
- }
8
- else {
9
- return sizes.toString();
10
- }
11
- };
1
+ export const getSmallestSize = (sizes) => {
2
+ if (Array.isArray(sizes)) {
3
+ if (sizes.length === 0) {
4
+ throw new Error('Sizes must not be an empty array');
5
+ }
6
+ return sizes[0].url;
7
+ }
8
+ else {
9
+ return sizes.toString();
10
+ }
11
+ };
12
12
  //# sourceMappingURL=getSmallestSize.js.map
@@ -1,10 +1,10 @@
1
- import { AspectRatio, Gravity } from '../Image';
2
- export interface ImageParamOptions {
3
- crop: boolean;
4
- gravity?: Gravity;
5
- quality?: number;
6
- webp?: boolean;
7
- focalPointX?: number;
8
- focalPointY?: number;
9
- }
10
- export declare const getSrcSetFromWidths: (src: string, widths: number[], aspect: AspectRatio, options?: ImageParamOptions, timestamp?: string) => string;
1
+ import { AspectRatio, Gravity } from '../Image';
2
+ export interface ImageParamOptions {
3
+ crop: boolean;
4
+ gravity?: Gravity;
5
+ quality?: number;
6
+ webp?: boolean;
7
+ focalPointX?: number;
8
+ focalPointY?: number;
9
+ }
10
+ export declare const getSrcSetFromWidths: (src: string, widths: number[], aspect: AspectRatio, options?: ImageParamOptions, timestamp?: string) => string;
@@ -1,9 +1,9 @@
1
- import { getSrcWithParams } from './getSrcWithParams';
2
- export const getSrcSetFromWidths = (src, widths, aspect, options = { crop: false, webp: false }, timestamp) => {
3
- const l = [];
4
- for (const w of widths) {
5
- l.push(getSrcWithParams(w, aspect, src, true, options, timestamp));
6
- }
7
- return l.join(', ');
8
- };
1
+ import { getSrcWithParams } from './getSrcWithParams';
2
+ export const getSrcSetFromWidths = (src, widths, aspect, options = { crop: false, webp: false }, timestamp) => {
3
+ const l = [];
4
+ for (const w of widths) {
5
+ l.push(getSrcWithParams(w, aspect, src, true, options, timestamp));
6
+ }
7
+ return l.join(', ');
8
+ };
9
9
  //# sourceMappingURL=getSrcSetFromWidths.js.map
@@ -1,3 +1,3 @@
1
- import { AspectRatio } from '../Image';
2
- import { ImageParamOptions } from './getSrcSetFromWidths';
3
- export declare function getSrcWithParams(width: number, aspect: AspectRatio, src: string, includeViewportSize?: boolean, options?: ImageParamOptions, timestamp?: string): string;
1
+ import { AspectRatio } from '../Image';
2
+ import { ImageParamOptions } from './getSrcSetFromWidths';
3
+ export declare function getSrcWithParams(width: number, aspect: AspectRatio, src: string, includeViewportSize?: boolean, options?: ImageParamOptions, timestamp?: string): string;