@shopify/hydrogen-react 2026.4.1 → 2026.4.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (595) hide show
  1. package/dist/browser-dev/AddToCartButton.mjs +60 -71
  2. package/dist/browser-dev/AddToCartButton.mjs.map +1 -1
  3. package/dist/browser-dev/BaseButton.mjs +20 -26
  4. package/dist/browser-dev/BaseButton.mjs.map +1 -1
  5. package/dist/browser-dev/BuyNowButton.mjs +40 -45
  6. package/dist/browser-dev/BuyNowButton.mjs.map +1 -1
  7. package/dist/browser-dev/CartCheckoutButton.mjs +28 -23
  8. package/dist/browser-dev/CartCheckoutButton.mjs.map +1 -1
  9. package/dist/browser-dev/CartCost.mjs +26 -22
  10. package/dist/browser-dev/CartCost.mjs.map +1 -1
  11. package/dist/browser-dev/CartLineProvider.mjs +23 -18
  12. package/dist/browser-dev/CartLineProvider.mjs.map +1 -1
  13. package/dist/browser-dev/CartLineQuantity.mjs +18 -9
  14. package/dist/browser-dev/CartLineQuantity.mjs.map +1 -1
  15. package/dist/browser-dev/CartLineQuantityAdjustButton.mjs +48 -45
  16. package/dist/browser-dev/CartLineQuantityAdjustButton.mjs.map +1 -1
  17. package/dist/browser-dev/CartProvider.mjs +315 -385
  18. package/dist/browser-dev/CartProvider.mjs.map +1 -1
  19. package/dist/browser-dev/ExternalVideo.mjs +35 -47
  20. package/dist/browser-dev/ExternalVideo.mjs.map +1 -1
  21. package/dist/browser-dev/Image.mjs +335 -340
  22. package/dist/browser-dev/Image.mjs.map +1 -1
  23. package/dist/browser-dev/MediaFile.mjs +39 -61
  24. package/dist/browser-dev/MediaFile.mjs.map +1 -1
  25. package/dist/browser-dev/ModelViewer.mjs +115 -139
  26. package/dist/browser-dev/ModelViewer.mjs.map +1 -1
  27. package/dist/browser-dev/Money.mjs +53 -39
  28. package/dist/browser-dev/Money.mjs.map +1 -1
  29. package/dist/browser-dev/ProductPrice.mjs +44 -61
  30. package/dist/browser-dev/ProductPrice.mjs.map +1 -1
  31. package/dist/browser-dev/ProductProvider.mjs +147 -179
  32. package/dist/browser-dev/ProductProvider.mjs.map +1 -1
  33. package/dist/browser-dev/RichText.components.mjs +36 -46
  34. package/dist/browser-dev/RichText.components.mjs.map +1 -1
  35. package/dist/browser-dev/RichText.mjs +111 -154
  36. package/dist/browser-dev/RichText.mjs.map +1 -1
  37. package/dist/browser-dev/ShopPayButton.mjs +53 -81
  38. package/dist/browser-dev/ShopPayButton.mjs.map +1 -1
  39. package/dist/browser-dev/ShopifyProvider.mjs +71 -84
  40. package/dist/browser-dev/ShopifyProvider.mjs.map +1 -1
  41. package/dist/browser-dev/Video.mjs +35 -52
  42. package/dist/browser-dev/Video.mjs.map +1 -1
  43. package/dist/browser-dev/analytics-constants.mjs +41 -43
  44. package/dist/browser-dev/analytics-constants.mjs.map +1 -1
  45. package/dist/browser-dev/analytics-schema-custom-storefront-customer-tracking.mjs +127 -214
  46. package/dist/browser-dev/analytics-schema-custom-storefront-customer-tracking.mjs.map +1 -1
  47. package/dist/browser-dev/analytics-schema-trekkie-storefront-page-view.mjs +39 -50
  48. package/dist/browser-dev/analytics-schema-trekkie-storefront-page-view.mjs.map +1 -1
  49. package/dist/browser-dev/analytics-utils.mjs +78 -56
  50. package/dist/browser-dev/analytics-utils.mjs.map +1 -1
  51. package/dist/browser-dev/analytics.mjs +112 -155
  52. package/dist/browser-dev/analytics.mjs.map +1 -1
  53. package/dist/browser-dev/cart-constants.mjs +11 -15
  54. package/dist/browser-dev/cart-constants.mjs.map +1 -1
  55. package/dist/browser-dev/cart-hooks.mjs +42 -57
  56. package/dist/browser-dev/cart-hooks.mjs.map +1 -1
  57. package/dist/browser-dev/cart-queries.mjs +28 -66
  58. package/dist/browser-dev/cart-queries.mjs.map +1 -1
  59. package/dist/browser-dev/codegen.helpers.mjs +31 -20
  60. package/dist/browser-dev/codegen.helpers.mjs.map +1 -1
  61. package/dist/browser-dev/cookies-utils.mjs +44 -42
  62. package/dist/browser-dev/cookies-utils.mjs.map +1 -1
  63. package/dist/browser-dev/flatten-connection.mjs +23 -29
  64. package/dist/browser-dev/flatten-connection.mjs.map +1 -1
  65. package/dist/browser-dev/getProductOptions.mjs +248 -226
  66. package/dist/browser-dev/getProductOptions.mjs.map +1 -1
  67. package/dist/browser-dev/index.mjs +15 -70
  68. package/dist/browser-dev/load-script.mjs +38 -49
  69. package/dist/browser-dev/load-script.mjs.map +1 -1
  70. package/dist/browser-dev/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.mjs +175 -123
  71. package/dist/browser-dev/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.mjs.map +1 -1
  72. package/dist/browser-dev/optionValueDecoder.mjs +104 -86
  73. package/dist/browser-dev/optionValueDecoder.mjs.map +1 -1
  74. package/dist/browser-dev/packages/hydrogen-react/package.mjs +6 -0
  75. package/dist/browser-dev/packages/hydrogen-react/package.mjs.map +1 -0
  76. package/dist/browser-dev/parse-metafield.mjs +122 -134
  77. package/dist/browser-dev/parse-metafield.mjs.map +1 -1
  78. package/dist/browser-dev/storefront-api-constants.mjs +6 -5
  79. package/dist/browser-dev/storefront-api-constants.mjs.map +1 -1
  80. package/dist/browser-dev/storefront-client.mjs +62 -102
  81. package/dist/browser-dev/storefront-client.mjs.map +1 -1
  82. package/dist/browser-dev/tracking-utils.mjs +68 -88
  83. package/dist/browser-dev/tracking-utils.mjs.map +1 -1
  84. package/dist/browser-dev/useCartAPIStateMachine.mjs +188 -346
  85. package/dist/browser-dev/useCartAPIStateMachine.mjs.map +1 -1
  86. package/dist/browser-dev/useCartActions.mjs +197 -172
  87. package/dist/browser-dev/useCartActions.mjs.map +1 -1
  88. package/dist/browser-dev/useMachine.mjs +50 -62
  89. package/dist/browser-dev/useMachine.mjs.map +1 -1
  90. package/dist/browser-dev/useMoney.mjs +176 -154
  91. package/dist/browser-dev/useMoney.mjs.map +1 -1
  92. package/dist/browser-dev/useSelectedOptionInUrlParam.mjs +17 -27
  93. package/dist/browser-dev/useSelectedOptionInUrlParam.mjs.map +1 -1
  94. package/dist/browser-dev/useShopifyCookies.mjs +123 -138
  95. package/dist/browser-dev/useShopifyCookies.mjs.map +1 -1
  96. package/dist/browser-prod/AddToCartButton.mjs +60 -71
  97. package/dist/browser-prod/AddToCartButton.mjs.map +1 -1
  98. package/dist/browser-prod/BaseButton.mjs +20 -26
  99. package/dist/browser-prod/BaseButton.mjs.map +1 -1
  100. package/dist/browser-prod/BuyNowButton.mjs +40 -45
  101. package/dist/browser-prod/BuyNowButton.mjs.map +1 -1
  102. package/dist/browser-prod/CartCheckoutButton.mjs +28 -23
  103. package/dist/browser-prod/CartCheckoutButton.mjs.map +1 -1
  104. package/dist/browser-prod/CartCost.mjs +26 -22
  105. package/dist/browser-prod/CartCost.mjs.map +1 -1
  106. package/dist/browser-prod/CartLineProvider.mjs +23 -18
  107. package/dist/browser-prod/CartLineProvider.mjs.map +1 -1
  108. package/dist/browser-prod/CartLineQuantity.mjs +18 -9
  109. package/dist/browser-prod/CartLineQuantity.mjs.map +1 -1
  110. package/dist/browser-prod/CartLineQuantityAdjustButton.mjs +48 -45
  111. package/dist/browser-prod/CartLineQuantityAdjustButton.mjs.map +1 -1
  112. package/dist/browser-prod/CartProvider.mjs +315 -385
  113. package/dist/browser-prod/CartProvider.mjs.map +1 -1
  114. package/dist/browser-prod/ExternalVideo.mjs +35 -47
  115. package/dist/browser-prod/ExternalVideo.mjs.map +1 -1
  116. package/dist/browser-prod/Image.mjs +326 -325
  117. package/dist/browser-prod/Image.mjs.map +1 -1
  118. package/dist/browser-prod/MediaFile.mjs +44 -63
  119. package/dist/browser-prod/MediaFile.mjs.map +1 -1
  120. package/dist/browser-prod/ModelViewer.mjs +117 -135
  121. package/dist/browser-prod/ModelViewer.mjs.map +1 -1
  122. package/dist/browser-prod/Money.mjs +53 -39
  123. package/dist/browser-prod/Money.mjs.map +1 -1
  124. package/dist/browser-prod/ProductPrice.mjs +44 -61
  125. package/dist/browser-prod/ProductPrice.mjs.map +1 -1
  126. package/dist/browser-prod/ProductProvider.mjs +147 -179
  127. package/dist/browser-prod/ProductProvider.mjs.map +1 -1
  128. package/dist/browser-prod/RichText.components.mjs +36 -46
  129. package/dist/browser-prod/RichText.components.mjs.map +1 -1
  130. package/dist/browser-prod/RichText.mjs +111 -154
  131. package/dist/browser-prod/RichText.mjs.map +1 -1
  132. package/dist/browser-prod/ShopPayButton.mjs +53 -81
  133. package/dist/browser-prod/ShopPayButton.mjs.map +1 -1
  134. package/dist/browser-prod/ShopifyProvider.mjs +71 -84
  135. package/dist/browser-prod/ShopifyProvider.mjs.map +1 -1
  136. package/dist/browser-prod/Video.mjs +35 -52
  137. package/dist/browser-prod/Video.mjs.map +1 -1
  138. package/dist/browser-prod/analytics-constants.mjs +41 -43
  139. package/dist/browser-prod/analytics-constants.mjs.map +1 -1
  140. package/dist/browser-prod/analytics-schema-custom-storefront-customer-tracking.mjs +127 -214
  141. package/dist/browser-prod/analytics-schema-custom-storefront-customer-tracking.mjs.map +1 -1
  142. package/dist/browser-prod/analytics-schema-trekkie-storefront-page-view.mjs +39 -50
  143. package/dist/browser-prod/analytics-schema-trekkie-storefront-page-view.mjs.map +1 -1
  144. package/dist/browser-prod/analytics-utils.mjs +78 -56
  145. package/dist/browser-prod/analytics-utils.mjs.map +1 -1
  146. package/dist/browser-prod/analytics.mjs +111 -153
  147. package/dist/browser-prod/analytics.mjs.map +1 -1
  148. package/dist/browser-prod/cart-constants.mjs +11 -15
  149. package/dist/browser-prod/cart-constants.mjs.map +1 -1
  150. package/dist/browser-prod/cart-hooks.mjs +42 -57
  151. package/dist/browser-prod/cart-hooks.mjs.map +1 -1
  152. package/dist/browser-prod/cart-queries.mjs +28 -66
  153. package/dist/browser-prod/cart-queries.mjs.map +1 -1
  154. package/dist/browser-prod/codegen.helpers.mjs +31 -20
  155. package/dist/browser-prod/codegen.helpers.mjs.map +1 -1
  156. package/dist/browser-prod/cookies-utils.mjs +44 -42
  157. package/dist/browser-prod/cookies-utils.mjs.map +1 -1
  158. package/dist/browser-prod/flatten-connection.mjs +23 -25
  159. package/dist/browser-prod/flatten-connection.mjs.map +1 -1
  160. package/dist/browser-prod/getProductOptions.mjs +248 -226
  161. package/dist/browser-prod/getProductOptions.mjs.map +1 -1
  162. package/dist/browser-prod/index.mjs +15 -70
  163. package/dist/browser-prod/load-script.mjs +38 -49
  164. package/dist/browser-prod/load-script.mjs.map +1 -1
  165. package/dist/browser-prod/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.mjs +175 -123
  166. package/dist/browser-prod/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.mjs.map +1 -1
  167. package/dist/browser-prod/optionValueDecoder.mjs +104 -86
  168. package/dist/browser-prod/optionValueDecoder.mjs.map +1 -1
  169. package/dist/browser-prod/packages/hydrogen-react/package.mjs +6 -0
  170. package/dist/browser-prod/packages/hydrogen-react/package.mjs.map +1 -0
  171. package/dist/browser-prod/parse-metafield.mjs +134 -146
  172. package/dist/browser-prod/parse-metafield.mjs.map +1 -1
  173. package/dist/browser-prod/storefront-api-constants.mjs +6 -5
  174. package/dist/browser-prod/storefront-api-constants.mjs.map +1 -1
  175. package/dist/browser-prod/storefront-client.mjs +56 -84
  176. package/dist/browser-prod/storefront-client.mjs.map +1 -1
  177. package/dist/browser-prod/tracking-utils.mjs +68 -88
  178. package/dist/browser-prod/tracking-utils.mjs.map +1 -1
  179. package/dist/browser-prod/useCartAPIStateMachine.mjs +188 -346
  180. package/dist/browser-prod/useCartAPIStateMachine.mjs.map +1 -1
  181. package/dist/browser-prod/useCartActions.mjs +197 -172
  182. package/dist/browser-prod/useCartActions.mjs.map +1 -1
  183. package/dist/browser-prod/useMachine.mjs +50 -62
  184. package/dist/browser-prod/useMachine.mjs.map +1 -1
  185. package/dist/browser-prod/useMoney.mjs +176 -154
  186. package/dist/browser-prod/useMoney.mjs.map +1 -1
  187. package/dist/browser-prod/useSelectedOptionInUrlParam.mjs +17 -27
  188. package/dist/browser-prod/useSelectedOptionInUrlParam.mjs.map +1 -1
  189. package/dist/browser-prod/useShopifyCookies.mjs +123 -138
  190. package/dist/browser-prod/useShopifyCookies.mjs.map +1 -1
  191. package/dist/node-dev/AddToCartButton.js +64 -73
  192. package/dist/node-dev/AddToCartButton.js.map +1 -1
  193. package/dist/node-dev/AddToCartButton.mjs +60 -71
  194. package/dist/node-dev/AddToCartButton.mjs.map +1 -1
  195. package/dist/node-dev/BaseButton.js +21 -26
  196. package/dist/node-dev/BaseButton.js.map +1 -1
  197. package/dist/node-dev/BaseButton.mjs +20 -26
  198. package/dist/node-dev/BaseButton.mjs.map +1 -1
  199. package/dist/node-dev/BuyNowButton.js +42 -46
  200. package/dist/node-dev/BuyNowButton.js.map +1 -1
  201. package/dist/node-dev/BuyNowButton.mjs +40 -45
  202. package/dist/node-dev/BuyNowButton.mjs.map +1 -1
  203. package/dist/node-dev/CartCheckoutButton.js +30 -24
  204. package/dist/node-dev/CartCheckoutButton.js.map +1 -1
  205. package/dist/node-dev/CartCheckoutButton.mjs +28 -23
  206. package/dist/node-dev/CartCheckoutButton.mjs.map +1 -1
  207. package/dist/node-dev/CartCost.js +27 -22
  208. package/dist/node-dev/CartCost.js.map +1 -1
  209. package/dist/node-dev/CartCost.mjs +26 -22
  210. package/dist/node-dev/CartCost.mjs.map +1 -1
  211. package/dist/node-dev/CartLineProvider.js +24 -17
  212. package/dist/node-dev/CartLineProvider.js.map +1 -1
  213. package/dist/node-dev/CartLineProvider.mjs +23 -18
  214. package/dist/node-dev/CartLineProvider.mjs.map +1 -1
  215. package/dist/node-dev/CartLineQuantity.js +19 -9
  216. package/dist/node-dev/CartLineQuantity.js.map +1 -1
  217. package/dist/node-dev/CartLineQuantity.mjs +18 -9
  218. package/dist/node-dev/CartLineQuantity.mjs.map +1 -1
  219. package/dist/node-dev/CartLineQuantityAdjustButton.js +50 -46
  220. package/dist/node-dev/CartLineQuantityAdjustButton.js.map +1 -1
  221. package/dist/node-dev/CartLineQuantityAdjustButton.mjs +48 -45
  222. package/dist/node-dev/CartLineQuantityAdjustButton.mjs.map +1 -1
  223. package/dist/node-dev/CartProvider.js +317 -385
  224. package/dist/node-dev/CartProvider.js.map +1 -1
  225. package/dist/node-dev/CartProvider.mjs +315 -385
  226. package/dist/node-dev/CartProvider.mjs.map +1 -1
  227. package/dist/node-dev/ExternalVideo.js +36 -47
  228. package/dist/node-dev/ExternalVideo.js.map +1 -1
  229. package/dist/node-dev/ExternalVideo.mjs +35 -47
  230. package/dist/node-dev/ExternalVideo.mjs.map +1 -1
  231. package/dist/node-dev/Image.js +337 -355
  232. package/dist/node-dev/Image.js.map +1 -1
  233. package/dist/node-dev/Image.mjs +335 -340
  234. package/dist/node-dev/Image.mjs.map +1 -1
  235. package/dist/node-dev/MediaFile.js +42 -63
  236. package/dist/node-dev/MediaFile.js.map +1 -1
  237. package/dist/node-dev/MediaFile.mjs +39 -61
  238. package/dist/node-dev/MediaFile.mjs.map +1 -1
  239. package/dist/node-dev/ModelViewer.js +116 -139
  240. package/dist/node-dev/ModelViewer.js.map +1 -1
  241. package/dist/node-dev/ModelViewer.mjs +115 -139
  242. package/dist/node-dev/ModelViewer.mjs.map +1 -1
  243. package/dist/node-dev/Money.js +54 -39
  244. package/dist/node-dev/Money.js.map +1 -1
  245. package/dist/node-dev/Money.mjs +53 -39
  246. package/dist/node-dev/Money.mjs.map +1 -1
  247. package/dist/node-dev/ProductPrice.js +45 -61
  248. package/dist/node-dev/ProductPrice.js.map +1 -1
  249. package/dist/node-dev/ProductPrice.mjs +44 -61
  250. package/dist/node-dev/ProductPrice.mjs.map +1 -1
  251. package/dist/node-dev/ProductProvider.js +148 -178
  252. package/dist/node-dev/ProductProvider.js.map +1 -1
  253. package/dist/node-dev/ProductProvider.mjs +147 -179
  254. package/dist/node-dev/ProductProvider.mjs.map +1 -1
  255. package/dist/node-dev/RichText.components.js +37 -46
  256. package/dist/node-dev/RichText.components.js.map +1 -1
  257. package/dist/node-dev/RichText.components.mjs +36 -46
  258. package/dist/node-dev/RichText.components.mjs.map +1 -1
  259. package/dist/node-dev/RichText.js +112 -154
  260. package/dist/node-dev/RichText.js.map +1 -1
  261. package/dist/node-dev/RichText.mjs +111 -154
  262. package/dist/node-dev/RichText.mjs.map +1 -1
  263. package/dist/node-dev/ShopPayButton.js +54 -81
  264. package/dist/node-dev/ShopPayButton.js.map +1 -1
  265. package/dist/node-dev/ShopPayButton.mjs +53 -81
  266. package/dist/node-dev/ShopPayButton.mjs.map +1 -1
  267. package/dist/node-dev/ShopifyProvider.js +73 -83
  268. package/dist/node-dev/ShopifyProvider.js.map +1 -1
  269. package/dist/node-dev/ShopifyProvider.mjs +71 -84
  270. package/dist/node-dev/ShopifyProvider.mjs.map +1 -1
  271. package/dist/node-dev/Video.js +36 -52
  272. package/dist/node-dev/Video.js.map +1 -1
  273. package/dist/node-dev/Video.mjs +35 -52
  274. package/dist/node-dev/Video.mjs.map +1 -1
  275. package/dist/node-dev/_virtual/_rolldown/runtime.js +23 -0
  276. package/dist/node-dev/analytics-constants.js +40 -39
  277. package/dist/node-dev/analytics-constants.js.map +1 -1
  278. package/dist/node-dev/analytics-constants.mjs +41 -43
  279. package/dist/node-dev/analytics-constants.mjs.map +1 -1
  280. package/dist/node-dev/analytics-schema-custom-storefront-customer-tracking.js +128 -210
  281. package/dist/node-dev/analytics-schema-custom-storefront-customer-tracking.js.map +1 -1
  282. package/dist/node-dev/analytics-schema-custom-storefront-customer-tracking.mjs +127 -214
  283. package/dist/node-dev/analytics-schema-custom-storefront-customer-tracking.mjs.map +1 -1
  284. package/dist/node-dev/analytics-schema-trekkie-storefront-page-view.js +40 -51
  285. package/dist/node-dev/analytics-schema-trekkie-storefront-page-view.js.map +1 -1
  286. package/dist/node-dev/analytics-schema-trekkie-storefront-page-view.mjs +39 -50
  287. package/dist/node-dev/analytics-schema-trekkie-storefront-page-view.mjs.map +1 -1
  288. package/dist/node-dev/analytics-utils.js +77 -52
  289. package/dist/node-dev/analytics-utils.js.map +1 -1
  290. package/dist/node-dev/analytics-utils.mjs +78 -56
  291. package/dist/node-dev/analytics-utils.mjs.map +1 -1
  292. package/dist/node-dev/analytics.js +114 -156
  293. package/dist/node-dev/analytics.js.map +1 -1
  294. package/dist/node-dev/analytics.mjs +112 -155
  295. package/dist/node-dev/analytics.mjs.map +1 -1
  296. package/dist/node-dev/cart-constants.js +10 -9
  297. package/dist/node-dev/cart-constants.js.map +1 -1
  298. package/dist/node-dev/cart-constants.mjs +11 -15
  299. package/dist/node-dev/cart-constants.mjs.map +1 -1
  300. package/dist/node-dev/cart-hooks.js +43 -57
  301. package/dist/node-dev/cart-hooks.js.map +1 -1
  302. package/dist/node-dev/cart-hooks.mjs +42 -57
  303. package/dist/node-dev/cart-hooks.mjs.map +1 -1
  304. package/dist/node-dev/cart-queries.js +27 -56
  305. package/dist/node-dev/cart-queries.js.map +1 -1
  306. package/dist/node-dev/cart-queries.mjs +28 -66
  307. package/dist/node-dev/cart-queries.mjs.map +1 -1
  308. package/dist/node-dev/codegen.helpers.js +30 -18
  309. package/dist/node-dev/codegen.helpers.js.map +1 -1
  310. package/dist/node-dev/codegen.helpers.mjs +31 -20
  311. package/dist/node-dev/codegen.helpers.mjs.map +1 -1
  312. package/dist/node-dev/cookies-utils.js +45 -42
  313. package/dist/node-dev/cookies-utils.js.map +1 -1
  314. package/dist/node-dev/cookies-utils.mjs +44 -42
  315. package/dist/node-dev/cookies-utils.mjs.map +1 -1
  316. package/dist/node-dev/flatten-connection.js +22 -28
  317. package/dist/node-dev/flatten-connection.js.map +1 -1
  318. package/dist/node-dev/flatten-connection.mjs +23 -29
  319. package/dist/node-dev/flatten-connection.mjs.map +1 -1
  320. package/dist/node-dev/getProductOptions.js +248 -224
  321. package/dist/node-dev/getProductOptions.js.map +1 -1
  322. package/dist/node-dev/getProductOptions.mjs +248 -226
  323. package/dist/node-dev/getProductOptions.mjs.map +1 -1
  324. package/dist/node-dev/index.js +88 -90
  325. package/dist/node-dev/index.mjs +15 -70
  326. package/dist/node-dev/load-script.js +38 -48
  327. package/dist/node-dev/load-script.js.map +1 -1
  328. package/dist/node-dev/load-script.mjs +38 -49
  329. package/dist/node-dev/load-script.mjs.map +1 -1
  330. package/dist/node-dev/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.js +185 -124
  331. package/dist/node-dev/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.js.map +1 -1
  332. package/dist/node-dev/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.mjs +175 -123
  333. package/dist/node-dev/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.mjs.map +1 -1
  334. package/dist/node-dev/optionValueDecoder.js +103 -84
  335. package/dist/node-dev/optionValueDecoder.js.map +1 -1
  336. package/dist/node-dev/optionValueDecoder.mjs +104 -86
  337. package/dist/node-dev/optionValueDecoder.mjs.map +1 -1
  338. package/dist/node-dev/packages/hydrogen-react/package.js +6 -0
  339. package/dist/node-dev/packages/hydrogen-react/package.js.map +1 -0
  340. package/dist/node-dev/packages/hydrogen-react/package.mjs +6 -0
  341. package/dist/node-dev/packages/hydrogen-react/package.mjs.map +1 -0
  342. package/dist/node-dev/parse-metafield.js +122 -134
  343. package/dist/node-dev/parse-metafield.js.map +1 -1
  344. package/dist/node-dev/parse-metafield.mjs +122 -134
  345. package/dist/node-dev/parse-metafield.mjs.map +1 -1
  346. package/dist/node-dev/storefront-api-constants.js +5 -4
  347. package/dist/node-dev/storefront-api-constants.js.map +1 -1
  348. package/dist/node-dev/storefront-api-constants.mjs +6 -5
  349. package/dist/node-dev/storefront-api-constants.mjs.map +1 -1
  350. package/dist/node-dev/storefront-client.js +62 -101
  351. package/dist/node-dev/storefront-client.js.map +1 -1
  352. package/dist/node-dev/storefront-client.mjs +62 -102
  353. package/dist/node-dev/storefront-client.mjs.map +1 -1
  354. package/dist/node-dev/tracking-utils.js +67 -85
  355. package/dist/node-dev/tracking-utils.js.map +1 -1
  356. package/dist/node-dev/tracking-utils.mjs +68 -88
  357. package/dist/node-dev/tracking-utils.mjs.map +1 -1
  358. package/dist/node-dev/useCartAPIStateMachine.js +192 -349
  359. package/dist/node-dev/useCartAPIStateMachine.js.map +1 -1
  360. package/dist/node-dev/useCartAPIStateMachine.mjs +188 -346
  361. package/dist/node-dev/useCartAPIStateMachine.mjs.map +1 -1
  362. package/dist/node-dev/useCartActions.js +198 -172
  363. package/dist/node-dev/useCartActions.js.map +1 -1
  364. package/dist/node-dev/useCartActions.mjs +197 -172
  365. package/dist/node-dev/useCartActions.mjs.map +1 -1
  366. package/dist/node-dev/useMachine.js +50 -61
  367. package/dist/node-dev/useMachine.js.map +1 -1
  368. package/dist/node-dev/useMachine.mjs +50 -62
  369. package/dist/node-dev/useMachine.mjs.map +1 -1
  370. package/dist/node-dev/useMoney.js +177 -154
  371. package/dist/node-dev/useMoney.js.map +1 -1
  372. package/dist/node-dev/useMoney.mjs +176 -154
  373. package/dist/node-dev/useMoney.mjs.map +1 -1
  374. package/dist/node-dev/useSelectedOptionInUrlParam.js +18 -27
  375. package/dist/node-dev/useSelectedOptionInUrlParam.js.map +1 -1
  376. package/dist/node-dev/useSelectedOptionInUrlParam.mjs +17 -27
  377. package/dist/node-dev/useSelectedOptionInUrlParam.mjs.map +1 -1
  378. package/dist/node-dev/useShopifyCookies.js +124 -138
  379. package/dist/node-dev/useShopifyCookies.js.map +1 -1
  380. package/dist/node-dev/useShopifyCookies.mjs +123 -138
  381. package/dist/node-dev/useShopifyCookies.mjs.map +1 -1
  382. package/dist/node-prod/AddToCartButton.js +64 -73
  383. package/dist/node-prod/AddToCartButton.js.map +1 -1
  384. package/dist/node-prod/AddToCartButton.mjs +60 -71
  385. package/dist/node-prod/AddToCartButton.mjs.map +1 -1
  386. package/dist/node-prod/BaseButton.js +21 -26
  387. package/dist/node-prod/BaseButton.js.map +1 -1
  388. package/dist/node-prod/BaseButton.mjs +20 -26
  389. package/dist/node-prod/BaseButton.mjs.map +1 -1
  390. package/dist/node-prod/BuyNowButton.js +42 -46
  391. package/dist/node-prod/BuyNowButton.js.map +1 -1
  392. package/dist/node-prod/BuyNowButton.mjs +40 -45
  393. package/dist/node-prod/BuyNowButton.mjs.map +1 -1
  394. package/dist/node-prod/CartCheckoutButton.js +30 -24
  395. package/dist/node-prod/CartCheckoutButton.js.map +1 -1
  396. package/dist/node-prod/CartCheckoutButton.mjs +28 -23
  397. package/dist/node-prod/CartCheckoutButton.mjs.map +1 -1
  398. package/dist/node-prod/CartCost.js +27 -22
  399. package/dist/node-prod/CartCost.js.map +1 -1
  400. package/dist/node-prod/CartCost.mjs +26 -22
  401. package/dist/node-prod/CartCost.mjs.map +1 -1
  402. package/dist/node-prod/CartLineProvider.js +24 -17
  403. package/dist/node-prod/CartLineProvider.js.map +1 -1
  404. package/dist/node-prod/CartLineProvider.mjs +23 -18
  405. package/dist/node-prod/CartLineProvider.mjs.map +1 -1
  406. package/dist/node-prod/CartLineQuantity.js +19 -9
  407. package/dist/node-prod/CartLineQuantity.js.map +1 -1
  408. package/dist/node-prod/CartLineQuantity.mjs +18 -9
  409. package/dist/node-prod/CartLineQuantity.mjs.map +1 -1
  410. package/dist/node-prod/CartLineQuantityAdjustButton.js +50 -46
  411. package/dist/node-prod/CartLineQuantityAdjustButton.js.map +1 -1
  412. package/dist/node-prod/CartLineQuantityAdjustButton.mjs +48 -45
  413. package/dist/node-prod/CartLineQuantityAdjustButton.mjs.map +1 -1
  414. package/dist/node-prod/CartProvider.js +317 -385
  415. package/dist/node-prod/CartProvider.js.map +1 -1
  416. package/dist/node-prod/CartProvider.mjs +315 -385
  417. package/dist/node-prod/CartProvider.mjs.map +1 -1
  418. package/dist/node-prod/ExternalVideo.js +36 -47
  419. package/dist/node-prod/ExternalVideo.js.map +1 -1
  420. package/dist/node-prod/ExternalVideo.mjs +35 -47
  421. package/dist/node-prod/ExternalVideo.mjs.map +1 -1
  422. package/dist/node-prod/Image.js +328 -340
  423. package/dist/node-prod/Image.js.map +1 -1
  424. package/dist/node-prod/Image.mjs +326 -325
  425. package/dist/node-prod/Image.mjs.map +1 -1
  426. package/dist/node-prod/MediaFile.js +47 -65
  427. package/dist/node-prod/MediaFile.js.map +1 -1
  428. package/dist/node-prod/MediaFile.mjs +44 -63
  429. package/dist/node-prod/MediaFile.mjs.map +1 -1
  430. package/dist/node-prod/ModelViewer.js +118 -135
  431. package/dist/node-prod/ModelViewer.js.map +1 -1
  432. package/dist/node-prod/ModelViewer.mjs +117 -135
  433. package/dist/node-prod/ModelViewer.mjs.map +1 -1
  434. package/dist/node-prod/Money.js +54 -39
  435. package/dist/node-prod/Money.js.map +1 -1
  436. package/dist/node-prod/Money.mjs +53 -39
  437. package/dist/node-prod/Money.mjs.map +1 -1
  438. package/dist/node-prod/ProductPrice.js +45 -61
  439. package/dist/node-prod/ProductPrice.js.map +1 -1
  440. package/dist/node-prod/ProductPrice.mjs +44 -61
  441. package/dist/node-prod/ProductPrice.mjs.map +1 -1
  442. package/dist/node-prod/ProductProvider.js +148 -178
  443. package/dist/node-prod/ProductProvider.js.map +1 -1
  444. package/dist/node-prod/ProductProvider.mjs +147 -179
  445. package/dist/node-prod/ProductProvider.mjs.map +1 -1
  446. package/dist/node-prod/RichText.components.js +37 -46
  447. package/dist/node-prod/RichText.components.js.map +1 -1
  448. package/dist/node-prod/RichText.components.mjs +36 -46
  449. package/dist/node-prod/RichText.components.mjs.map +1 -1
  450. package/dist/node-prod/RichText.js +112 -154
  451. package/dist/node-prod/RichText.js.map +1 -1
  452. package/dist/node-prod/RichText.mjs +111 -154
  453. package/dist/node-prod/RichText.mjs.map +1 -1
  454. package/dist/node-prod/ShopPayButton.js +54 -81
  455. package/dist/node-prod/ShopPayButton.js.map +1 -1
  456. package/dist/node-prod/ShopPayButton.mjs +53 -81
  457. package/dist/node-prod/ShopPayButton.mjs.map +1 -1
  458. package/dist/node-prod/ShopifyProvider.js +73 -83
  459. package/dist/node-prod/ShopifyProvider.js.map +1 -1
  460. package/dist/node-prod/ShopifyProvider.mjs +71 -84
  461. package/dist/node-prod/ShopifyProvider.mjs.map +1 -1
  462. package/dist/node-prod/Video.js +36 -52
  463. package/dist/node-prod/Video.js.map +1 -1
  464. package/dist/node-prod/Video.mjs +35 -52
  465. package/dist/node-prod/Video.mjs.map +1 -1
  466. package/dist/node-prod/_virtual/_rolldown/runtime.js +23 -0
  467. package/dist/node-prod/analytics-constants.js +40 -39
  468. package/dist/node-prod/analytics-constants.js.map +1 -1
  469. package/dist/node-prod/analytics-constants.mjs +41 -43
  470. package/dist/node-prod/analytics-constants.mjs.map +1 -1
  471. package/dist/node-prod/analytics-schema-custom-storefront-customer-tracking.js +128 -210
  472. package/dist/node-prod/analytics-schema-custom-storefront-customer-tracking.js.map +1 -1
  473. package/dist/node-prod/analytics-schema-custom-storefront-customer-tracking.mjs +127 -214
  474. package/dist/node-prod/analytics-schema-custom-storefront-customer-tracking.mjs.map +1 -1
  475. package/dist/node-prod/analytics-schema-trekkie-storefront-page-view.js +40 -51
  476. package/dist/node-prod/analytics-schema-trekkie-storefront-page-view.js.map +1 -1
  477. package/dist/node-prod/analytics-schema-trekkie-storefront-page-view.mjs +39 -50
  478. package/dist/node-prod/analytics-schema-trekkie-storefront-page-view.mjs.map +1 -1
  479. package/dist/node-prod/analytics-utils.js +77 -52
  480. package/dist/node-prod/analytics-utils.js.map +1 -1
  481. package/dist/node-prod/analytics-utils.mjs +78 -56
  482. package/dist/node-prod/analytics-utils.mjs.map +1 -1
  483. package/dist/node-prod/analytics.js +113 -154
  484. package/dist/node-prod/analytics.js.map +1 -1
  485. package/dist/node-prod/analytics.mjs +111 -153
  486. package/dist/node-prod/analytics.mjs.map +1 -1
  487. package/dist/node-prod/cart-constants.js +10 -9
  488. package/dist/node-prod/cart-constants.js.map +1 -1
  489. package/dist/node-prod/cart-constants.mjs +11 -15
  490. package/dist/node-prod/cart-constants.mjs.map +1 -1
  491. package/dist/node-prod/cart-hooks.js +43 -57
  492. package/dist/node-prod/cart-hooks.js.map +1 -1
  493. package/dist/node-prod/cart-hooks.mjs +42 -57
  494. package/dist/node-prod/cart-hooks.mjs.map +1 -1
  495. package/dist/node-prod/cart-queries.js +27 -56
  496. package/dist/node-prod/cart-queries.js.map +1 -1
  497. package/dist/node-prod/cart-queries.mjs +28 -66
  498. package/dist/node-prod/cart-queries.mjs.map +1 -1
  499. package/dist/node-prod/codegen.helpers.js +30 -18
  500. package/dist/node-prod/codegen.helpers.js.map +1 -1
  501. package/dist/node-prod/codegen.helpers.mjs +31 -20
  502. package/dist/node-prod/codegen.helpers.mjs.map +1 -1
  503. package/dist/node-prod/cookies-utils.js +45 -42
  504. package/dist/node-prod/cookies-utils.js.map +1 -1
  505. package/dist/node-prod/cookies-utils.mjs +44 -42
  506. package/dist/node-prod/cookies-utils.mjs.map +1 -1
  507. package/dist/node-prod/flatten-connection.js +22 -24
  508. package/dist/node-prod/flatten-connection.js.map +1 -1
  509. package/dist/node-prod/flatten-connection.mjs +23 -25
  510. package/dist/node-prod/flatten-connection.mjs.map +1 -1
  511. package/dist/node-prod/getProductOptions.js +248 -224
  512. package/dist/node-prod/getProductOptions.js.map +1 -1
  513. package/dist/node-prod/getProductOptions.mjs +248 -226
  514. package/dist/node-prod/getProductOptions.mjs.map +1 -1
  515. package/dist/node-prod/index.js +88 -90
  516. package/dist/node-prod/index.mjs +15 -70
  517. package/dist/node-prod/load-script.js +38 -48
  518. package/dist/node-prod/load-script.js.map +1 -1
  519. package/dist/node-prod/load-script.mjs +38 -49
  520. package/dist/node-prod/load-script.mjs.map +1 -1
  521. package/dist/node-prod/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.js +185 -124
  522. package/dist/node-prod/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.js.map +1 -1
  523. package/dist/node-prod/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.mjs +175 -123
  524. package/dist/node-prod/node_modules/.pnpm/@xstate_fsm@2.0.0/node_modules/@xstate/fsm/es/index.mjs.map +1 -1
  525. package/dist/node-prod/optionValueDecoder.js +103 -84
  526. package/dist/node-prod/optionValueDecoder.js.map +1 -1
  527. package/dist/node-prod/optionValueDecoder.mjs +104 -86
  528. package/dist/node-prod/optionValueDecoder.mjs.map +1 -1
  529. package/dist/node-prod/packages/hydrogen-react/package.js +6 -0
  530. package/dist/node-prod/packages/hydrogen-react/package.js.map +1 -0
  531. package/dist/node-prod/packages/hydrogen-react/package.mjs +6 -0
  532. package/dist/node-prod/packages/hydrogen-react/package.mjs.map +1 -0
  533. package/dist/node-prod/parse-metafield.js +134 -146
  534. package/dist/node-prod/parse-metafield.js.map +1 -1
  535. package/dist/node-prod/parse-metafield.mjs +134 -146
  536. package/dist/node-prod/parse-metafield.mjs.map +1 -1
  537. package/dist/node-prod/storefront-api-constants.js +5 -4
  538. package/dist/node-prod/storefront-api-constants.js.map +1 -1
  539. package/dist/node-prod/storefront-api-constants.mjs +6 -5
  540. package/dist/node-prod/storefront-api-constants.mjs.map +1 -1
  541. package/dist/node-prod/storefront-client.js +56 -83
  542. package/dist/node-prod/storefront-client.js.map +1 -1
  543. package/dist/node-prod/storefront-client.mjs +56 -84
  544. package/dist/node-prod/storefront-client.mjs.map +1 -1
  545. package/dist/node-prod/tracking-utils.js +67 -85
  546. package/dist/node-prod/tracking-utils.js.map +1 -1
  547. package/dist/node-prod/tracking-utils.mjs +68 -88
  548. package/dist/node-prod/tracking-utils.mjs.map +1 -1
  549. package/dist/node-prod/useCartAPIStateMachine.js +192 -349
  550. package/dist/node-prod/useCartAPIStateMachine.js.map +1 -1
  551. package/dist/node-prod/useCartAPIStateMachine.mjs +188 -346
  552. package/dist/node-prod/useCartAPIStateMachine.mjs.map +1 -1
  553. package/dist/node-prod/useCartActions.js +198 -172
  554. package/dist/node-prod/useCartActions.js.map +1 -1
  555. package/dist/node-prod/useCartActions.mjs +197 -172
  556. package/dist/node-prod/useCartActions.mjs.map +1 -1
  557. package/dist/node-prod/useMachine.js +50 -61
  558. package/dist/node-prod/useMachine.js.map +1 -1
  559. package/dist/node-prod/useMachine.mjs +50 -62
  560. package/dist/node-prod/useMachine.mjs.map +1 -1
  561. package/dist/node-prod/useMoney.js +177 -154
  562. package/dist/node-prod/useMoney.js.map +1 -1
  563. package/dist/node-prod/useMoney.mjs +176 -154
  564. package/dist/node-prod/useMoney.mjs.map +1 -1
  565. package/dist/node-prod/useSelectedOptionInUrlParam.js +18 -27
  566. package/dist/node-prod/useSelectedOptionInUrlParam.js.map +1 -1
  567. package/dist/node-prod/useSelectedOptionInUrlParam.mjs +17 -27
  568. package/dist/node-prod/useSelectedOptionInUrlParam.mjs.map +1 -1
  569. package/dist/node-prod/useShopifyCookies.js +124 -138
  570. package/dist/node-prod/useShopifyCookies.js.map +1 -1
  571. package/dist/node-prod/useShopifyCookies.mjs +123 -138
  572. package/dist/node-prod/useShopifyCookies.mjs.map +1 -1
  573. package/dist/umd/hydrogen-react.dev.js +3930 -4418
  574. package/dist/umd/hydrogen-react.dev.js.map +1 -1
  575. package/dist/umd/hydrogen-react.prod.js +35 -49
  576. package/dist/umd/hydrogen-react.prod.js.map +1 -1
  577. package/package.json +5 -5
  578. package/dist/browser-dev/index.mjs.map +0 -1
  579. package/dist/browser-dev/packages/hydrogen-react/package.json.mjs +0 -5
  580. package/dist/browser-dev/packages/hydrogen-react/package.json.mjs.map +0 -1
  581. package/dist/browser-prod/index.mjs.map +0 -1
  582. package/dist/browser-prod/packages/hydrogen-react/package.json.mjs +0 -5
  583. package/dist/browser-prod/packages/hydrogen-react/package.json.mjs.map +0 -1
  584. package/dist/node-dev/index.js.map +0 -1
  585. package/dist/node-dev/index.mjs.map +0 -1
  586. package/dist/node-dev/packages/hydrogen-react/package.json.js +0 -5
  587. package/dist/node-dev/packages/hydrogen-react/package.json.js.map +0 -1
  588. package/dist/node-dev/packages/hydrogen-react/package.json.mjs +0 -5
  589. package/dist/node-dev/packages/hydrogen-react/package.json.mjs.map +0 -1
  590. package/dist/node-prod/index.js.map +0 -1
  591. package/dist/node-prod/index.mjs.map +0 -1
  592. package/dist/node-prod/packages/hydrogen-react/package.json.js +0 -5
  593. package/dist/node-prod/packages/hydrogen-react/package.json.js.map +0 -1
  594. package/dist/node-prod/packages/hydrogen-react/package.json.mjs +0 -5
  595. package/dist/node-prod/packages/hydrogen-react/package.json.mjs.map +0 -1
@@ -1,193 +1,161 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import { useMemo, useState, useEffect, useCallback, useContext, createContext } from "react";
3
1
  import { flattenConnection } from "./flatten-connection.mjs";
4
- const ProductOptionsContext = createContext(null);
5
- function ProductProvider({
6
- children,
7
- data: product,
8
- initialVariantId: explicitVariantId
9
- }) {
10
- const variants = useMemo(
11
- () => flattenConnection(product.variants ?? {}),
12
- [product.variants]
13
- );
14
- if (!isProductVariantArray(variants)) {
15
- throw new Error(
16
- `<ProductProvider/> requires 'product.variants.nodes' or 'product.variants.edges'`
17
- );
18
- }
19
- const options = useMemo(() => getOptions(variants), [variants]);
20
- const [selectedVariant, setSelectedVariant] = useState(() => getVariantBasedOnIdProp(explicitVariantId, variants));
21
- const [selectedOptions, setSelectedOptions] = useState(
22
- () => getSelectedOptions(selectedVariant)
23
- );
24
- useEffect(() => {
25
- const newSelectedVariant = getVariantBasedOnIdProp(
26
- explicitVariantId,
27
- variants
28
- );
29
- setSelectedVariant(newSelectedVariant);
30
- setSelectedOptions(getSelectedOptions(newSelectedVariant));
31
- }, [explicitVariantId, variants]);
32
- const setSelectedOption = useCallback(
33
- (name, value2) => {
34
- setSelectedOptions((selectedOptions2) => {
35
- const opts = { ...selectedOptions2, [name]: value2 };
36
- setSelectedVariant(getSelectedVariant(variants, opts));
37
- return opts;
38
- });
39
- },
40
- [setSelectedOptions, variants]
41
- );
42
- const isOptionInStock = useCallback(
43
- (option, value2) => {
44
- const proposedVariant = getSelectedVariant(variants, {
45
- ...selectedOptions,
46
- ...{ [option]: value2 }
47
- });
48
- return (proposedVariant == null ? void 0 : proposedVariant.availableForSale) ?? true;
49
- },
50
- [selectedOptions, variants]
51
- );
52
- const sellingPlanGroups = useMemo(
53
- () => flattenConnection(product.sellingPlanGroups ?? {}).map(
54
- (sellingPlanGroup) => ({
55
- ...sellingPlanGroup,
56
- sellingPlans: flattenConnection((sellingPlanGroup == null ? void 0 : sellingPlanGroup.sellingPlans) ?? {})
57
- })
58
- ),
59
- [product.sellingPlanGroups]
60
- );
61
- const [selectedSellingPlan, setSelectedSellingPlan] = useState(void 0);
62
- const selectedSellingPlanAllocation = useMemo(() => {
63
- var _a, _b;
64
- if (!selectedVariant || !selectedSellingPlan) {
65
- return;
66
- }
67
- if (!((_a = selectedVariant.sellingPlanAllocations) == null ? void 0 : _a.nodes) && !((_b = selectedVariant.sellingPlanAllocations) == null ? void 0 : _b.edges)) {
68
- throw new Error(
69
- `<ProductProvider/>: You must include 'sellingPlanAllocations.nodes' or 'sellingPlanAllocations.edges' in your variants in order to calculate selectedSellingPlanAllocation`
70
- );
71
- }
72
- return flattenConnection(selectedVariant.sellingPlanAllocations).find(
73
- (allocation) => {
74
- var _a2;
75
- return ((_a2 = allocation == null ? void 0 : allocation.sellingPlan) == null ? void 0 : _a2.id) === selectedSellingPlan.id;
76
- }
77
- );
78
- }, [selectedVariant, selectedSellingPlan]);
79
- const value = useMemo(
80
- () => ({
81
- product,
82
- variants,
83
- variantsConnection: product.variants,
84
- options,
85
- selectedVariant,
86
- setSelectedVariant,
87
- selectedOptions,
88
- setSelectedOption,
89
- setSelectedOptions,
90
- isOptionInStock,
91
- selectedSellingPlan,
92
- setSelectedSellingPlan,
93
- selectedSellingPlanAllocation,
94
- sellingPlanGroups,
95
- sellingPlanGroupsConnection: product.sellingPlanGroups
96
- }),
97
- [
98
- product,
99
- isOptionInStock,
100
- options,
101
- selectedOptions,
102
- selectedSellingPlan,
103
- selectedSellingPlanAllocation,
104
- selectedVariant,
105
- sellingPlanGroups,
106
- setSelectedOption,
107
- variants
108
- ]
109
- );
110
- return /* @__PURE__ */ jsx(ProductOptionsContext.Provider, { value, children });
2
+ import { createContext, useCallback, useContext, useEffect, useMemo, useState } from "react";
3
+ import { jsx } from "react/jsx-runtime";
4
+ //#region src/ProductProvider.tsx
5
+ var ProductOptionsContext = createContext(null);
6
+ /**
7
+ * `<ProductProvider />` is a context provider that enables use of the `useProduct()` hook.
8
+ *
9
+ * It helps manage selected options and variants for a product.
10
+ * @publicDocs
11
+ */
12
+ function ProductProvider({ children, data: product, initialVariantId: explicitVariantId }) {
13
+ const variants = useMemo(() => flattenConnection(product.variants ?? {}), [product.variants]);
14
+ if (!isProductVariantArray(variants)) throw new Error(`<ProductProvider/> requires 'product.variants.nodes' or 'product.variants.edges'`);
15
+ const options = useMemo(() => getOptions(variants), [variants]);
16
+ /**
17
+ * Track the selectedVariant within the provider.
18
+ */
19
+ const [selectedVariant, setSelectedVariant] = useState(() => getVariantBasedOnIdProp(explicitVariantId, variants));
20
+ /**
21
+ * Track the selectedOptions within the provider. If a `initialVariantId`
22
+ * is passed, use that to select initial options.
23
+ */
24
+ const [selectedOptions, setSelectedOptions] = useState(() => getSelectedOptions(selectedVariant));
25
+ /**
26
+ * When the initialVariantId changes, we need to make sure we
27
+ * update the selected variant and selected options. If not,
28
+ * then the selected variant and options will reference incorrect
29
+ * values.
30
+ */
31
+ useEffect(() => {
32
+ const newSelectedVariant = getVariantBasedOnIdProp(explicitVariantId, variants);
33
+ setSelectedVariant(newSelectedVariant);
34
+ setSelectedOptions(getSelectedOptions(newSelectedVariant));
35
+ }, [explicitVariantId, variants]);
36
+ /**
37
+ * Allow the developer to select an option.
38
+ */
39
+ const setSelectedOption = useCallback((name, value) => {
40
+ setSelectedOptions((selectedOptions) => {
41
+ const opts = {
42
+ ...selectedOptions,
43
+ [name]: value
44
+ };
45
+ setSelectedVariant(getSelectedVariant(variants, opts));
46
+ return opts;
47
+ });
48
+ }, [setSelectedOptions, variants]);
49
+ const isOptionInStock = useCallback((option, value) => {
50
+ return getSelectedVariant(variants, {
51
+ ...selectedOptions,
52
+ [option]: value
53
+ })?.availableForSale ?? true;
54
+ }, [selectedOptions, variants]);
55
+ const sellingPlanGroups = useMemo(() => flattenConnection(product.sellingPlanGroups ?? {}).map((sellingPlanGroup) => ({
56
+ ...sellingPlanGroup,
57
+ sellingPlans: flattenConnection(sellingPlanGroup?.sellingPlans ?? {})
58
+ })), [product.sellingPlanGroups]);
59
+ /**
60
+ * Track the selectedSellingPlan within the hook. If `initialSellingPlanId`
61
+ * is passed, use that as an initial value. Look it up from the `selectedVariant`, since
62
+ * that is also a requirement.
63
+ */
64
+ const [selectedSellingPlan, setSelectedSellingPlan] = useState(void 0);
65
+ const selectedSellingPlanAllocation = useMemo(() => {
66
+ if (!selectedVariant || !selectedSellingPlan) return;
67
+ if (!selectedVariant.sellingPlanAllocations?.nodes && !selectedVariant.sellingPlanAllocations?.edges) throw new Error(`<ProductProvider/>: You must include 'sellingPlanAllocations.nodes' or 'sellingPlanAllocations.edges' in your variants in order to calculate selectedSellingPlanAllocation`);
68
+ return flattenConnection(selectedVariant.sellingPlanAllocations).find((allocation) => allocation?.sellingPlan?.id === selectedSellingPlan.id);
69
+ }, [selectedVariant, selectedSellingPlan]);
70
+ const value = useMemo(() => ({
71
+ product,
72
+ variants,
73
+ variantsConnection: product.variants,
74
+ options,
75
+ selectedVariant,
76
+ setSelectedVariant,
77
+ selectedOptions,
78
+ setSelectedOption,
79
+ setSelectedOptions,
80
+ isOptionInStock,
81
+ selectedSellingPlan,
82
+ setSelectedSellingPlan,
83
+ selectedSellingPlanAllocation,
84
+ sellingPlanGroups,
85
+ sellingPlanGroupsConnection: product.sellingPlanGroups
86
+ }), [
87
+ product,
88
+ isOptionInStock,
89
+ options,
90
+ selectedOptions,
91
+ selectedSellingPlan,
92
+ selectedSellingPlanAllocation,
93
+ selectedVariant,
94
+ sellingPlanGroups,
95
+ setSelectedOption,
96
+ variants
97
+ ]);
98
+ return /* @__PURE__ */ jsx(ProductOptionsContext.Provider, {
99
+ value,
100
+ children
101
+ });
111
102
  }
103
+ /**
104
+ * Provides access to the context value provided by `<ProductProvider />`. Must be a descendent of `<ProductProvider />`.
105
+ * @publicDocs
106
+ */
112
107
  function useProduct() {
113
- const context = useContext(ProductOptionsContext);
114
- if (!context) {
115
- throw new Error(`'useProduct' must be a child of <ProductProvider />`);
116
- }
117
- return context;
108
+ const context = useContext(ProductOptionsContext);
109
+ if (!context) throw new Error(`'useProduct' must be a child of <ProductProvider />`);
110
+ return context;
118
111
  }
119
112
  function getSelectedVariant(variants, choices) {
120
- var _a, _b;
121
- if (!variants.length || ((_b = (_a = variants == null ? void 0 : variants[0]) == null ? void 0 : _a.selectedOptions) == null ? void 0 : _b.length) !== Object.keys(choices).length) {
122
- return;
123
- }
124
- return variants == null ? void 0 : variants.find((variant) => {
125
- return Object.entries(choices).every(([name, value]) => {
126
- var _a2;
127
- return (_a2 = variant == null ? void 0 : variant.selectedOptions) == null ? void 0 : _a2.some(
128
- (option) => (option == null ? void 0 : option.name) === name && (option == null ? void 0 : option.value) === value
129
- );
130
- });
131
- });
113
+ /**
114
+ * Ensure the user has selected all the required options, not just some.
115
+ */
116
+ if (!variants.length || variants?.[0]?.selectedOptions?.length !== Object.keys(choices).length) return;
117
+ return variants?.find((variant) => {
118
+ return Object.entries(choices).every(([name, value]) => {
119
+ return variant?.selectedOptions?.some((option) => option?.name === name && option?.value === value);
120
+ });
121
+ });
132
122
  }
133
123
  function getOptions(variants) {
134
- const map = variants.reduce(
135
- (memo, variant) => {
136
- var _a;
137
- if (!variant.selectedOptions) {
138
- throw new Error(`'getOptions' requires 'variant.selectedOptions'`);
139
- }
140
- (_a = variant == null ? void 0 : variant.selectedOptions) == null ? void 0 : _a.forEach((opt) => {
141
- memo[(opt == null ? void 0 : opt.name) ?? ""] = memo[(opt == null ? void 0 : opt.name) ?? ""] || /* @__PURE__ */ new Set();
142
- memo[(opt == null ? void 0 : opt.name) ?? ""].add((opt == null ? void 0 : opt.value) ?? "");
143
- });
144
- return memo;
145
- },
146
- {}
147
- );
148
- return Object.keys(map).map((option) => {
149
- return {
150
- name: option,
151
- values: Array.from(map[option])
152
- };
153
- });
124
+ const map = variants.reduce((memo, variant) => {
125
+ if (!variant.selectedOptions) throw new Error(`'getOptions' requires 'variant.selectedOptions'`);
126
+ variant?.selectedOptions?.forEach((opt) => {
127
+ memo[opt?.name ?? ""] = memo[opt?.name ?? ""] || /* @__PURE__ */ new Set();
128
+ memo[opt?.name ?? ""].add(opt?.value ?? "");
129
+ });
130
+ return memo;
131
+ }, {});
132
+ return Object.keys(map).map((option) => {
133
+ return {
134
+ name: option,
135
+ values: Array.from(map[option])
136
+ };
137
+ });
154
138
  }
155
139
  function getVariantBasedOnIdProp(explicitVariantId, variants) {
156
- if (explicitVariantId) {
157
- const foundVariant = variants.find(
158
- (variant) => (variant == null ? void 0 : variant.id) === explicitVariantId
159
- );
160
- if (!foundVariant) {
161
- console.warn(
162
- `<ProductProvider/> received a 'initialVariantId' prop, but could not actually find a variant with that ID`
163
- );
164
- }
165
- return foundVariant;
166
- }
167
- if (explicitVariantId === null) {
168
- return null;
169
- }
170
- if (explicitVariantId === void 0) {
171
- return variants.find((variant) => variant == null ? void 0 : variant.availableForSale) || variants[0];
172
- }
140
+ if (explicitVariantId) {
141
+ const foundVariant = variants.find((variant) => variant?.id === explicitVariantId);
142
+ if (!foundVariant) console.warn(`<ProductProvider/> received a 'initialVariantId' prop, but could not actually find a variant with that ID`);
143
+ return foundVariant;
144
+ }
145
+ if (explicitVariantId === null) return null;
146
+ if (explicitVariantId === void 0) return variants.find((variant) => variant?.availableForSale) || variants[0];
173
147
  }
174
148
  function getSelectedOptions(selectedVariant) {
175
- return (selectedVariant == null ? void 0 : selectedVariant.selectedOptions) ? selectedVariant.selectedOptions.reduce(
176
- (memo, optionSet) => {
177
- memo[(optionSet == null ? void 0 : optionSet.name) ?? ""] = (optionSet == null ? void 0 : optionSet.value) ?? "";
178
- return memo;
179
- },
180
- {}
181
- ) : {};
149
+ return selectedVariant?.selectedOptions ? selectedVariant.selectedOptions.reduce((memo, optionSet) => {
150
+ memo[optionSet?.name ?? ""] = optionSet?.value ?? "";
151
+ return memo;
152
+ }, {}) : {};
182
153
  }
183
154
  function isProductVariantArray(maybeVariantArray) {
184
- if (!maybeVariantArray || !Array.isArray(maybeVariantArray)) {
185
- return false;
186
- }
187
- return true;
155
+ if (!maybeVariantArray || !Array.isArray(maybeVariantArray)) return false;
156
+ return true;
188
157
  }
189
- export {
190
- ProductProvider,
191
- useProduct
192
- };
193
- //# sourceMappingURL=ProductProvider.mjs.map
158
+ //#endregion
159
+ export { ProductProvider, useProduct };
160
+
161
+ //# sourceMappingURL=ProductProvider.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"ProductProvider.mjs","sources":["../../src/ProductProvider.tsx"],"sourcesContent":["import {\n useMemo,\n useState,\n useEffect,\n useCallback,\n createContext,\n useContext,\n} from 'react';\nimport type {\n SelectedOption as SelectedOptionType,\n SellingPlan,\n SellingPlanAllocation,\n Product,\n ProductVariant as ProductVariantType,\n ProductVariantConnection,\n SellingPlan as SellingPlanType,\n SellingPlanAllocation as SellingPlanAllocationType,\n SellingPlanGroup as SellingPlanGroupType,\n SellingPlanGroupConnection,\n} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\nimport {flattenConnection} from './flatten-connection.js';\n\nconst ProductOptionsContext = createContext<ProductHookValue | null>(null);\n\ntype InitialVariantId = ProductVariantType['id'] | null;\n\ninterface ProductProviderProps {\n /** A Storefront API [Product object](https://shopify.dev/api/storefront/reference/products/product). */\n data: PartialDeep<Product, {recurseIntoArrays: true}>;\n /** A `ReactNode` element. */\n children: React.ReactNode;\n /**\n * The initially selected variant.\n * The following logic applies to `initialVariantId`:\n * 1. If `initialVariantId` is provided, then it's used even if it's out of stock.\n * 2. If `initialVariantId` is provided but is `null`, then no variant is used.\n * 3. If nothing is passed to `initialVariantId` then the first available / in-stock variant is used.\n * 4. If nothing is passed to `initialVariantId` and no variants are in stock, then the first variant is used.\n */\n initialVariantId?: InitialVariantId;\n}\n\n/**\n * `<ProductProvider />` is a context provider that enables use of the `useProduct()` hook.\n *\n * It helps manage selected options and variants for a product.\n * @publicDocs\n */\nexport function ProductProvider({\n children,\n data: product,\n initialVariantId: explicitVariantId,\n}: ProductProviderProps): JSX.Element {\n // The flattened variants\n const variants = useMemo(\n () => flattenConnection(product.variants ?? {}),\n [product.variants],\n );\n\n if (!isProductVariantArray(variants)) {\n throw new Error(\n `<ProductProvider/> requires 'product.variants.nodes' or 'product.variants.edges'`,\n );\n }\n\n // All the options available for a product, based on all the variants\n const options = useMemo(() => getOptions(variants), [variants]);\n\n /**\n * Track the selectedVariant within the provider.\n */\n const [selectedVariant, setSelectedVariant] = useState<\n | PartialDeep<ProductVariantType, {recurseIntoArrays: true}>\n | undefined\n | null\n >(() => getVariantBasedOnIdProp(explicitVariantId, variants));\n\n /**\n * Track the selectedOptions within the provider. If a `initialVariantId`\n * is passed, use that to select initial options.\n */\n const [selectedOptions, setSelectedOptions] = useState<SelectedOptions>(() =>\n getSelectedOptions(selectedVariant),\n );\n\n /**\n * When the initialVariantId changes, we need to make sure we\n * update the selected variant and selected options. If not,\n * then the selected variant and options will reference incorrect\n * values.\n */\n useEffect(() => {\n const newSelectedVariant = getVariantBasedOnIdProp(\n explicitVariantId,\n variants,\n );\n setSelectedVariant(newSelectedVariant);\n setSelectedOptions(getSelectedOptions(newSelectedVariant));\n }, [explicitVariantId, variants]);\n\n /**\n * Allow the developer to select an option.\n */\n const setSelectedOption = useCallback(\n (name: string, value: string) => {\n setSelectedOptions((selectedOptions) => {\n const opts = {...selectedOptions, [name]: value};\n setSelectedVariant(getSelectedVariant(variants, opts));\n return opts;\n });\n },\n [setSelectedOptions, variants],\n );\n\n const isOptionInStock = useCallback(\n (option: string, value: string) => {\n const proposedVariant = getSelectedVariant(variants, {\n ...selectedOptions,\n ...{[option]: value},\n });\n\n return proposedVariant?.availableForSale ?? true;\n },\n [selectedOptions, variants],\n );\n\n const sellingPlanGroups = useMemo(\n () =>\n flattenConnection(product.sellingPlanGroups ?? {}).map(\n (sellingPlanGroup) => ({\n ...sellingPlanGroup,\n sellingPlans: flattenConnection(sellingPlanGroup?.sellingPlans ?? {}),\n }),\n ),\n [product.sellingPlanGroups],\n );\n\n /**\n * Track the selectedSellingPlan within the hook. If `initialSellingPlanId`\n * is passed, use that as an initial value. Look it up from the `selectedVariant`, since\n * that is also a requirement.\n */\n const [selectedSellingPlan, setSelectedSellingPlan] = useState<\n PartialDeep<SellingPlan, {recurseIntoArrays: true}> | undefined\n >(undefined);\n\n const selectedSellingPlanAllocation = useMemo<\n PartialDeep<SellingPlanAllocation, {recurseIntoArrays: true}> | undefined\n >(() => {\n if (!selectedVariant || !selectedSellingPlan) {\n return;\n }\n\n if (\n !selectedVariant.sellingPlanAllocations?.nodes &&\n !selectedVariant.sellingPlanAllocations?.edges\n ) {\n throw new Error(\n `<ProductProvider/>: You must include 'sellingPlanAllocations.nodes' or 'sellingPlanAllocations.edges' in your variants in order to calculate selectedSellingPlanAllocation`,\n );\n }\n\n return flattenConnection(selectedVariant.sellingPlanAllocations).find(\n (allocation) => allocation?.sellingPlan?.id === selectedSellingPlan.id,\n );\n }, [selectedVariant, selectedSellingPlan]);\n\n const value = useMemo<ProductHookValue>(\n () => ({\n product,\n variants,\n variantsConnection: product.variants,\n options,\n selectedVariant,\n setSelectedVariant,\n selectedOptions,\n setSelectedOption,\n setSelectedOptions,\n isOptionInStock,\n selectedSellingPlan,\n setSelectedSellingPlan,\n selectedSellingPlanAllocation,\n sellingPlanGroups,\n sellingPlanGroupsConnection: product.sellingPlanGroups,\n }),\n [\n product,\n isOptionInStock,\n options,\n selectedOptions,\n selectedSellingPlan,\n selectedSellingPlanAllocation,\n selectedVariant,\n sellingPlanGroups,\n setSelectedOption,\n variants,\n ],\n );\n\n return (\n <ProductOptionsContext.Provider value={value}>\n {children}\n </ProductOptionsContext.Provider>\n );\n}\n\n/**\n * Provides access to the context value provided by `<ProductProvider />`. Must be a descendent of `<ProductProvider />`.\n * @publicDocs\n */\nexport function useProduct(): ProductHookValue {\n const context = useContext(ProductOptionsContext);\n\n if (!context) {\n throw new Error(`'useProduct' must be a child of <ProductProvider />`);\n }\n\n return context;\n}\n\nfunction getSelectedVariant(\n variants: PartialDeep<ProductVariantType, {recurseIntoArrays: true}>[],\n choices: SelectedOptions,\n): PartialDeep<ProductVariantType, {recurseIntoArrays: true}> | undefined {\n /**\n * Ensure the user has selected all the required options, not just some.\n */\n if (\n !variants.length ||\n variants?.[0]?.selectedOptions?.length !== Object.keys(choices).length\n ) {\n return;\n }\n\n return variants?.find((variant) => {\n return Object.entries(choices).every(([name, value]) => {\n return variant?.selectedOptions?.some(\n (option) => option?.name === name && option?.value === value,\n );\n });\n });\n}\n\nfunction getOptions(\n variants: PartialDeep<ProductVariantType, {recurseIntoArrays: true}>[],\n): OptionWithValues[] {\n const map = variants.reduce(\n (memo, variant) => {\n if (!variant.selectedOptions) {\n throw new Error(`'getOptions' requires 'variant.selectedOptions'`);\n }\n variant?.selectedOptions?.forEach((opt) => {\n memo[opt?.name ?? ''] = memo[opt?.name ?? ''] || new Set();\n memo[opt?.name ?? ''].add(opt?.value ?? '');\n });\n\n return memo;\n },\n {} as Record<string, Set<string>>,\n );\n\n return Object.keys(map).map((option) => {\n return {\n name: option,\n values: Array.from(map[option]),\n };\n });\n}\n\nfunction getVariantBasedOnIdProp(\n explicitVariantId: InitialVariantId | undefined,\n variants: Array<\n PartialDeep<ProductVariantType, {recurseIntoArrays: true}> | undefined\n >,\n):\n | PartialDeep<ProductVariantType, {recurseIntoArrays: true}>\n | undefined\n | null {\n // get the initial variant based on the logic outlined in the comments for 'initialVariantId' above\n // * 1. If `initialVariantId` is provided, then it's used even if it's out of stock.\n if (explicitVariantId) {\n const foundVariant = variants.find(\n (variant) => variant?.id === explicitVariantId,\n );\n if (!foundVariant) {\n console.warn(\n `<ProductProvider/> received a 'initialVariantId' prop, but could not actually find a variant with that ID`,\n );\n }\n return foundVariant;\n }\n // * 2. If `initialVariantId` is provided but is `null`, then no variant is used.\n if (explicitVariantId === null) {\n return null;\n }\n // * 3. If nothing is passed to `initialVariantId` then the first available / in-stock variant is used.\n // * 4. If nothing is passed to `initialVariantId` and no variants are in stock, then the first variant is used.\n if (explicitVariantId === undefined) {\n return variants.find((variant) => variant?.availableForSale) || variants[0];\n }\n}\n\nfunction getSelectedOptions(\n selectedVariant:\n | PartialDeep<ProductVariantType, {recurseIntoArrays: true}>\n | undefined\n | null,\n): SelectedOptions {\n return selectedVariant?.selectedOptions\n ? selectedVariant.selectedOptions.reduce<SelectedOptions>(\n (memo, optionSet) => {\n memo[optionSet?.name ?? ''] = optionSet?.value ?? '';\n return memo;\n },\n {},\n )\n : {};\n}\n\nfunction isProductVariantArray(\n maybeVariantArray:\n | (PartialDeep<ProductVariantType, {recurseIntoArrays: true}> | undefined)[]\n | undefined,\n): maybeVariantArray is PartialDeep<\n ProductVariantType,\n {recurseIntoArrays: true}\n>[] {\n if (!maybeVariantArray || !Array.isArray(maybeVariantArray)) {\n return false;\n }\n\n return true;\n}\n\nexport interface OptionWithValues {\n name: SelectedOptionType['name'];\n values: SelectedOptionType['value'][];\n}\n\ntype UseProductObjects = {\n /** The raw product from the Storefront API */\n product: Product;\n /** An array of the variant `nodes` from the `VariantConnection`. */\n variants: ProductVariantType[];\n variantsConnection?: ProductVariantConnection;\n /** An array of the product's options and values. */\n options: OptionWithValues[];\n /** The selected variant. */\n selectedVariant?: ProductVariantType | null;\n selectedOptions: SelectedOptions;\n /** The selected selling plan. */\n selectedSellingPlan?: SellingPlanType;\n /** The selected selling plan allocation. */\n selectedSellingPlanAllocation?: SellingPlanAllocationType;\n /** The selling plan groups. */\n sellingPlanGroups?: (Omit<SellingPlanGroupType, 'sellingPlans'> & {\n sellingPlans: SellingPlanType[];\n })[];\n sellingPlanGroupsConnection?: SellingPlanGroupConnection;\n};\n\ntype UseProductFunctions = {\n /** A callback to set the selected variant to the variant passed as an argument. */\n setSelectedVariant: (\n variant: PartialDeep<ProductVariantType, {recurseIntoArrays: true}> | null,\n ) => void;\n /** A callback to set the selected option. */\n setSelectedOption: (\n name: SelectedOptionType['name'],\n value: SelectedOptionType['value'],\n ) => void;\n /** A callback to set multiple selected options at once. */\n setSelectedOptions: (options: SelectedOptions) => void;\n /** A callback to set the selected selling plan to the one passed as an argument. */\n setSelectedSellingPlan: (\n sellingPlan: PartialDeep<SellingPlanType, {recurseIntoArrays: true}>,\n ) => void;\n /** A callback that returns a boolean indicating if the option is in stock. */\n isOptionInStock: (\n name: SelectedOptionType['name'],\n value: SelectedOptionType['value'],\n ) => boolean;\n};\n\ntype ProductHookValue = PartialDeep<\n UseProductObjects,\n {recurseIntoArrays: true}\n> &\n UseProductFunctions;\n\nexport type SelectedOptions = {\n [key: string]: string;\n};\n"],"names":["value","selectedOptions","_a"],"mappings":";;;AAuBA,MAAM,wBAAwB,cAAuC,IAAI;AA0BlE,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA,MAAM;AAAA,EACN,kBAAkB;AACpB,GAAsC;AAEpC,QAAM,WAAW;AAAA,IACf,MAAM,kBAAkB,QAAQ,YAAY,EAAE;AAAA,IAC9C,CAAC,QAAQ,QAAQ;AAAA,EAAA;AAGnB,MAAI,CAAC,sBAAsB,QAAQ,GAAG;AACpC,UAAM,IAAI;AAAA,MACR;AAAA,IAAA;AAAA,EAEJ;AAGA,QAAM,UAAU,QAAQ,MAAM,WAAW,QAAQ,GAAG,CAAC,QAAQ,CAAC;AAK9D,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAI5C,MAAM,wBAAwB,mBAAmB,QAAQ,CAAC;AAM5D,QAAM,CAAC,iBAAiB,kBAAkB,IAAI;AAAA,IAA0B,MACtE,mBAAmB,eAAe;AAAA,EAAA;AASpC,YAAU,MAAM;AACd,UAAM,qBAAqB;AAAA,MACzB;AAAA,MACA;AAAA,IAAA;AAEF,uBAAmB,kBAAkB;AACrC,uBAAmB,mBAAmB,kBAAkB,CAAC;AAAA,EAC3D,GAAG,CAAC,mBAAmB,QAAQ,CAAC;AAKhC,QAAM,oBAAoB;AAAA,IACxB,CAAC,MAAcA,WAAkB;AAC/B,yBAAmB,CAACC,qBAAoB;AACtC,cAAM,OAAO,EAAC,GAAGA,kBAAiB,CAAC,IAAI,GAAGD,OAAAA;AAC1C,2BAAmB,mBAAmB,UAAU,IAAI,CAAC;AACrD,eAAO;AAAA,MACT,CAAC;AAAA,IACH;AAAA,IACA,CAAC,oBAAoB,QAAQ;AAAA,EAAA;AAG/B,QAAM,kBAAkB;AAAA,IACtB,CAAC,QAAgBA,WAAkB;AACjC,YAAM,kBAAkB,mBAAmB,UAAU;AAAA,QACnD,GAAG;AAAA,QACH,GAAG,EAAC,CAAC,MAAM,GAAGA,OAAAA;AAAAA,MAAK,CACpB;AAED,cAAO,mDAAiB,qBAAoB;AAAA,IAC9C;AAAA,IACA,CAAC,iBAAiB,QAAQ;AAAA,EAAA;AAG5B,QAAM,oBAAoB;AAAA,IACxB,MACE,kBAAkB,QAAQ,qBAAqB,CAAA,CAAE,EAAE;AAAA,MACjD,CAAC,sBAAsB;AAAA,QACrB,GAAG;AAAA,QACH,cAAc,mBAAkB,qDAAkB,iBAAgB,CAAA,CAAE;AAAA,MAAA;AAAA,IACtE;AAAA,IAEJ,CAAC,QAAQ,iBAAiB;AAAA,EAAA;AAQ5B,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAEpD,MAAS;AAEX,QAAM,gCAAgC,QAEpC,MAAM;;AACN,QAAI,CAAC,mBAAmB,CAAC,qBAAqB;AAC5C;AAAA,IACF;AAEA,QACE,GAAC,qBAAgB,2BAAhB,mBAAwC,UACzC,GAAC,qBAAgB,2BAAhB,mBAAwC,QACzC;AACA,YAAM,IAAI;AAAA,QACR;AAAA,MAAA;AAAA,IAEJ;AAEA,WAAO,kBAAkB,gBAAgB,sBAAsB,EAAE;AAAA,MAC/D,CAAC,eAAA;;AAAe,iBAAAE,MAAA,yCAAY,gBAAZ,gBAAAA,IAAyB,QAAO,oBAAoB;AAAA;AAAA,IAAA;AAAA,EAExE,GAAG,CAAC,iBAAiB,mBAAmB,CAAC;AAEzC,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA,oBAAoB,QAAQ;AAAA,MAC5B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,6BAA6B,QAAQ;AAAA,IAAA;AAAA,IAEvC;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAGF,SACE,oBAAC,sBAAsB,UAAtB,EAA+B,OAC7B,SAAA,CACH;AAEJ;AAMO,SAAS,aAA+B;AAC7C,QAAM,UAAU,WAAW,qBAAqB;AAEhD,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AAEA,SAAO;AACT;AAEA,SAAS,mBACP,UACA,SACwE;;AAIxE,MACE,CAAC,SAAS,YACV,gDAAW,OAAX,mBAAe,oBAAf,mBAAgC,YAAW,OAAO,KAAK,OAAO,EAAE,QAChE;AACA;AAAA,EACF;AAEA,SAAO,qCAAU,KAAK,CAAC,YAAY;AACjC,WAAO,OAAO,QAAQ,OAAO,EAAE,MAAM,CAAC,CAAC,MAAM,KAAK,MAAM;;AACtD,cAAOA,MAAA,mCAAS,oBAAT,gBAAAA,IAA0B;AAAA,QAC/B,CAAC,YAAW,iCAAQ,UAAS,SAAQ,iCAAQ,WAAU;AAAA;AAAA,IAE3D,CAAC;AAAA,EACH;AACF;AAEA,SAAS,WACP,UACoB;AACpB,QAAM,MAAM,SAAS;AAAA,IACnB,CAAC,MAAM,YAAY;;AACjB,UAAI,CAAC,QAAQ,iBAAiB;AAC5B,cAAM,IAAI,MAAM,iDAAiD;AAAA,MACnE;AACA,+CAAS,oBAAT,mBAA0B,QAAQ,CAAC,QAAQ;AACzC,cAAK,2BAAK,SAAQ,EAAE,IAAI,MAAK,2BAAK,SAAQ,EAAE,KAAK,oBAAI,IAAA;AACrD,cAAK,2BAAK,SAAQ,EAAE,EAAE,KAAI,2BAAK,UAAS,EAAE;AAAA,MAC5C;AAEA,aAAO;AAAA,IACT;AAAA,IACA,CAAA;AAAA,EAAC;AAGH,SAAO,OAAO,KAAK,GAAG,EAAE,IAAI,CAAC,WAAW;AACtC,WAAO;AAAA,MACL,MAAM;AAAA,MACN,QAAQ,MAAM,KAAK,IAAI,MAAM,CAAC;AAAA,IAAA;AAAA,EAElC,CAAC;AACH;AAEA,SAAS,wBACP,mBACA,UAMO;AAGP,MAAI,mBAAmB;AACrB,UAAM,eAAe,SAAS;AAAA,MAC5B,CAAC,aAAY,mCAAS,QAAO;AAAA,IAAA;AAE/B,QAAI,CAAC,cAAc;AACjB,cAAQ;AAAA,QACN;AAAA,MAAA;AAAA,IAEJ;AACA,WAAO;AAAA,EACT;AAEA,MAAI,sBAAsB,MAAM;AAC9B,WAAO;AAAA,EACT;AAGA,MAAI,sBAAsB,QAAW;AACnC,WAAO,SAAS,KAAK,CAAC,YAAY,mCAAS,gBAAgB,KAAK,SAAS,CAAC;AAAA,EAC5E;AACF;AAEA,SAAS,mBACP,iBAIiB;AACjB,UAAO,mDAAiB,mBACpB,gBAAgB,gBAAgB;AAAA,IAC9B,CAAC,MAAM,cAAc;AACnB,YAAK,uCAAW,SAAQ,EAAE,KAAI,uCAAW,UAAS;AAClD,aAAO;AAAA,IACT;AAAA,IACA,CAAA;AAAA,EAAC,IAEH,CAAA;AACN;AAEA,SAAS,sBACP,mBAME;AACF,MAAI,CAAC,qBAAqB,CAAC,MAAM,QAAQ,iBAAiB,GAAG;AAC3D,WAAO;AAAA,EACT;AAEA,SAAO;AACT;"}
1
+ {"version":3,"file":"ProductProvider.mjs","names":[],"sources":["../../src/ProductProvider.tsx"],"sourcesContent":["import {\n useMemo,\n useState,\n useEffect,\n useCallback,\n createContext,\n useContext,\n} from 'react';\nimport type {\n SelectedOption as SelectedOptionType,\n SellingPlan,\n SellingPlanAllocation,\n Product,\n ProductVariant as ProductVariantType,\n ProductVariantConnection,\n SellingPlan as SellingPlanType,\n SellingPlanAllocation as SellingPlanAllocationType,\n SellingPlanGroup as SellingPlanGroupType,\n SellingPlanGroupConnection,\n} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\nimport {flattenConnection} from './flatten-connection.js';\n\nconst ProductOptionsContext = createContext<ProductHookValue | null>(null);\n\ntype InitialVariantId = ProductVariantType['id'] | null;\n\ninterface ProductProviderProps {\n /** A Storefront API [Product object](https://shopify.dev/api/storefront/reference/products/product). */\n data: PartialDeep<Product, {recurseIntoArrays: true}>;\n /** A `ReactNode` element. */\n children: React.ReactNode;\n /**\n * The initially selected variant.\n * The following logic applies to `initialVariantId`:\n * 1. If `initialVariantId` is provided, then it's used even if it's out of stock.\n * 2. If `initialVariantId` is provided but is `null`, then no variant is used.\n * 3. If nothing is passed to `initialVariantId` then the first available / in-stock variant is used.\n * 4. If nothing is passed to `initialVariantId` and no variants are in stock, then the first variant is used.\n */\n initialVariantId?: InitialVariantId;\n}\n\n/**\n * `<ProductProvider />` is a context provider that enables use of the `useProduct()` hook.\n *\n * It helps manage selected options and variants for a product.\n * @publicDocs\n */\nexport function ProductProvider({\n children,\n data: product,\n initialVariantId: explicitVariantId,\n}: ProductProviderProps): JSX.Element {\n // The flattened variants\n const variants = useMemo(\n () => flattenConnection(product.variants ?? {}),\n [product.variants],\n );\n\n if (!isProductVariantArray(variants)) {\n throw new Error(\n `<ProductProvider/> requires 'product.variants.nodes' or 'product.variants.edges'`,\n );\n }\n\n // All the options available for a product, based on all the variants\n const options = useMemo(() => getOptions(variants), [variants]);\n\n /**\n * Track the selectedVariant within the provider.\n */\n const [selectedVariant, setSelectedVariant] = useState<\n | PartialDeep<ProductVariantType, {recurseIntoArrays: true}>\n | undefined\n | null\n >(() => getVariantBasedOnIdProp(explicitVariantId, variants));\n\n /**\n * Track the selectedOptions within the provider. If a `initialVariantId`\n * is passed, use that to select initial options.\n */\n const [selectedOptions, setSelectedOptions] = useState<SelectedOptions>(() =>\n getSelectedOptions(selectedVariant),\n );\n\n /**\n * When the initialVariantId changes, we need to make sure we\n * update the selected variant and selected options. If not,\n * then the selected variant and options will reference incorrect\n * values.\n */\n useEffect(() => {\n const newSelectedVariant = getVariantBasedOnIdProp(\n explicitVariantId,\n variants,\n );\n setSelectedVariant(newSelectedVariant);\n setSelectedOptions(getSelectedOptions(newSelectedVariant));\n }, [explicitVariantId, variants]);\n\n /**\n * Allow the developer to select an option.\n */\n const setSelectedOption = useCallback(\n (name: string, value: string) => {\n setSelectedOptions((selectedOptions) => {\n const opts = {...selectedOptions, [name]: value};\n setSelectedVariant(getSelectedVariant(variants, opts));\n return opts;\n });\n },\n [setSelectedOptions, variants],\n );\n\n const isOptionInStock = useCallback(\n (option: string, value: string) => {\n const proposedVariant = getSelectedVariant(variants, {\n ...selectedOptions,\n ...{[option]: value},\n });\n\n return proposedVariant?.availableForSale ?? true;\n },\n [selectedOptions, variants],\n );\n\n const sellingPlanGroups = useMemo(\n () =>\n flattenConnection(product.sellingPlanGroups ?? {}).map(\n (sellingPlanGroup) => ({\n ...sellingPlanGroup,\n sellingPlans: flattenConnection(sellingPlanGroup?.sellingPlans ?? {}),\n }),\n ),\n [product.sellingPlanGroups],\n );\n\n /**\n * Track the selectedSellingPlan within the hook. If `initialSellingPlanId`\n * is passed, use that as an initial value. Look it up from the `selectedVariant`, since\n * that is also a requirement.\n */\n const [selectedSellingPlan, setSelectedSellingPlan] = useState<\n PartialDeep<SellingPlan, {recurseIntoArrays: true}> | undefined\n >(undefined);\n\n const selectedSellingPlanAllocation = useMemo<\n PartialDeep<SellingPlanAllocation, {recurseIntoArrays: true}> | undefined\n >(() => {\n if (!selectedVariant || !selectedSellingPlan) {\n return;\n }\n\n if (\n !selectedVariant.sellingPlanAllocations?.nodes &&\n !selectedVariant.sellingPlanAllocations?.edges\n ) {\n throw new Error(\n `<ProductProvider/>: You must include 'sellingPlanAllocations.nodes' or 'sellingPlanAllocations.edges' in your variants in order to calculate selectedSellingPlanAllocation`,\n );\n }\n\n return flattenConnection(selectedVariant.sellingPlanAllocations).find(\n (allocation) => allocation?.sellingPlan?.id === selectedSellingPlan.id,\n );\n }, [selectedVariant, selectedSellingPlan]);\n\n const value = useMemo<ProductHookValue>(\n () => ({\n product,\n variants,\n variantsConnection: product.variants,\n options,\n selectedVariant,\n setSelectedVariant,\n selectedOptions,\n setSelectedOption,\n setSelectedOptions,\n isOptionInStock,\n selectedSellingPlan,\n setSelectedSellingPlan,\n selectedSellingPlanAllocation,\n sellingPlanGroups,\n sellingPlanGroupsConnection: product.sellingPlanGroups,\n }),\n [\n product,\n isOptionInStock,\n options,\n selectedOptions,\n selectedSellingPlan,\n selectedSellingPlanAllocation,\n selectedVariant,\n sellingPlanGroups,\n setSelectedOption,\n variants,\n ],\n );\n\n return (\n <ProductOptionsContext.Provider value={value}>\n {children}\n </ProductOptionsContext.Provider>\n );\n}\n\n/**\n * Provides access to the context value provided by `<ProductProvider />`. Must be a descendent of `<ProductProvider />`.\n * @publicDocs\n */\nexport function useProduct(): ProductHookValue {\n const context = useContext(ProductOptionsContext);\n\n if (!context) {\n throw new Error(`'useProduct' must be a child of <ProductProvider />`);\n }\n\n return context;\n}\n\nfunction getSelectedVariant(\n variants: PartialDeep<ProductVariantType, {recurseIntoArrays: true}>[],\n choices: SelectedOptions,\n): PartialDeep<ProductVariantType, {recurseIntoArrays: true}> | undefined {\n /**\n * Ensure the user has selected all the required options, not just some.\n */\n if (\n !variants.length ||\n variants?.[0]?.selectedOptions?.length !== Object.keys(choices).length\n ) {\n return;\n }\n\n return variants?.find((variant) => {\n return Object.entries(choices).every(([name, value]) => {\n return variant?.selectedOptions?.some(\n (option) => option?.name === name && option?.value === value,\n );\n });\n });\n}\n\nfunction getOptions(\n variants: PartialDeep<ProductVariantType, {recurseIntoArrays: true}>[],\n): OptionWithValues[] {\n const map = variants.reduce(\n (memo, variant) => {\n if (!variant.selectedOptions) {\n throw new Error(`'getOptions' requires 'variant.selectedOptions'`);\n }\n variant?.selectedOptions?.forEach((opt) => {\n memo[opt?.name ?? ''] = memo[opt?.name ?? ''] || new Set();\n memo[opt?.name ?? ''].add(opt?.value ?? '');\n });\n\n return memo;\n },\n {} as Record<string, Set<string>>,\n );\n\n return Object.keys(map).map((option) => {\n return {\n name: option,\n values: Array.from(map[option]),\n };\n });\n}\n\nfunction getVariantBasedOnIdProp(\n explicitVariantId: InitialVariantId | undefined,\n variants: Array<\n PartialDeep<ProductVariantType, {recurseIntoArrays: true}> | undefined\n >,\n):\n | PartialDeep<ProductVariantType, {recurseIntoArrays: true}>\n | undefined\n | null {\n // get the initial variant based on the logic outlined in the comments for 'initialVariantId' above\n // * 1. If `initialVariantId` is provided, then it's used even if it's out of stock.\n if (explicitVariantId) {\n const foundVariant = variants.find(\n (variant) => variant?.id === explicitVariantId,\n );\n if (!foundVariant) {\n console.warn(\n `<ProductProvider/> received a 'initialVariantId' prop, but could not actually find a variant with that ID`,\n );\n }\n return foundVariant;\n }\n // * 2. If `initialVariantId` is provided but is `null`, then no variant is used.\n if (explicitVariantId === null) {\n return null;\n }\n // * 3. If nothing is passed to `initialVariantId` then the first available / in-stock variant is used.\n // * 4. If nothing is passed to `initialVariantId` and no variants are in stock, then the first variant is used.\n if (explicitVariantId === undefined) {\n return variants.find((variant) => variant?.availableForSale) || variants[0];\n }\n}\n\nfunction getSelectedOptions(\n selectedVariant:\n | PartialDeep<ProductVariantType, {recurseIntoArrays: true}>\n | undefined\n | null,\n): SelectedOptions {\n return selectedVariant?.selectedOptions\n ? selectedVariant.selectedOptions.reduce<SelectedOptions>(\n (memo, optionSet) => {\n memo[optionSet?.name ?? ''] = optionSet?.value ?? '';\n return memo;\n },\n {},\n )\n : {};\n}\n\nfunction isProductVariantArray(\n maybeVariantArray:\n | (PartialDeep<ProductVariantType, {recurseIntoArrays: true}> | undefined)[]\n | undefined,\n): maybeVariantArray is PartialDeep<\n ProductVariantType,\n {recurseIntoArrays: true}\n>[] {\n if (!maybeVariantArray || !Array.isArray(maybeVariantArray)) {\n return false;\n }\n\n return true;\n}\n\nexport interface OptionWithValues {\n name: SelectedOptionType['name'];\n values: SelectedOptionType['value'][];\n}\n\ntype UseProductObjects = {\n /** The raw product from the Storefront API */\n product: Product;\n /** An array of the variant `nodes` from the `VariantConnection`. */\n variants: ProductVariantType[];\n variantsConnection?: ProductVariantConnection;\n /** An array of the product's options and values. */\n options: OptionWithValues[];\n /** The selected variant. */\n selectedVariant?: ProductVariantType | null;\n selectedOptions: SelectedOptions;\n /** The selected selling plan. */\n selectedSellingPlan?: SellingPlanType;\n /** The selected selling plan allocation. */\n selectedSellingPlanAllocation?: SellingPlanAllocationType;\n /** The selling plan groups. */\n sellingPlanGroups?: (Omit<SellingPlanGroupType, 'sellingPlans'> & {\n sellingPlans: SellingPlanType[];\n })[];\n sellingPlanGroupsConnection?: SellingPlanGroupConnection;\n};\n\ntype UseProductFunctions = {\n /** A callback to set the selected variant to the variant passed as an argument. */\n setSelectedVariant: (\n variant: PartialDeep<ProductVariantType, {recurseIntoArrays: true}> | null,\n ) => void;\n /** A callback to set the selected option. */\n setSelectedOption: (\n name: SelectedOptionType['name'],\n value: SelectedOptionType['value'],\n ) => void;\n /** A callback to set multiple selected options at once. */\n setSelectedOptions: (options: SelectedOptions) => void;\n /** A callback to set the selected selling plan to the one passed as an argument. */\n setSelectedSellingPlan: (\n sellingPlan: PartialDeep<SellingPlanType, {recurseIntoArrays: true}>,\n ) => void;\n /** A callback that returns a boolean indicating if the option is in stock. */\n isOptionInStock: (\n name: SelectedOptionType['name'],\n value: SelectedOptionType['value'],\n ) => boolean;\n};\n\ntype ProductHookValue = PartialDeep<\n UseProductObjects,\n {recurseIntoArrays: true}\n> &\n UseProductFunctions;\n\nexport type SelectedOptions = {\n [key: string]: string;\n};\n"],"mappings":"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"}
@@ -1,55 +1,46 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const jsxRuntime = require("react/jsx-runtime");
4
- const React = require("react");
5
- const RichTextComponents = {
6
- root: Root,
7
- heading: Heading,
8
- paragraph: Paragraph,
9
- text: Text,
10
- link: RichTextLink,
11
- list: List,
12
- "list-item": ListItem
1
+ require("./_virtual/_rolldown/runtime.js");
2
+ let react = require("react");
3
+ let react_jsx_runtime = require("react/jsx-runtime");
4
+ //#region src/RichText.components.tsx
5
+ var RichTextComponents = {
6
+ root: Root,
7
+ heading: Heading,
8
+ paragraph: Paragraph,
9
+ text: Text,
10
+ link: RichTextLink,
11
+ list: List,
12
+ "list-item": ListItem
13
13
  };
14
- function Root({
15
- node
16
- }) {
17
- return /* @__PURE__ */ jsxRuntime.jsx("div", { children: node.children });
14
+ function Root({ node }) {
15
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: node.children });
18
16
  }
19
- function Heading({
20
- node
21
- }) {
22
- return React.createElement(`h${node.level ?? "1"}`, null, node.children);
17
+ function Heading({ node }) {
18
+ return (0, react.createElement)(`h${node.level ?? "1"}`, null, node.children);
23
19
  }
24
- function Paragraph({
25
- node
26
- }) {
27
- return /* @__PURE__ */ jsxRuntime.jsx("p", { children: node.children });
20
+ function Paragraph({ node }) {
21
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: node.children });
28
22
  }
29
- function Text({
30
- node
31
- }) {
32
- if (node.bold && node.italic)
33
- return /* @__PURE__ */ jsxRuntime.jsx("em", { children: /* @__PURE__ */ jsxRuntime.jsx("strong", { children: node.value }) });
34
- if (node.bold) return /* @__PURE__ */ jsxRuntime.jsx("strong", { children: node.value });
35
- if (node.italic) return /* @__PURE__ */ jsxRuntime.jsx("em", { children: node.value });
36
- return node.value;
23
+ function Text({ node }) {
24
+ if (node.bold && node.italic) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("em", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", { children: node.value }) });
25
+ if (node.bold) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", { children: node.value });
26
+ if (node.italic) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("em", { children: node.value });
27
+ return node.value;
37
28
  }
38
- function RichTextLink({
39
- node
40
- }) {
41
- return /* @__PURE__ */ jsxRuntime.jsx("a", { href: node.url, title: node.title, target: node.target, children: node.children });
29
+ function RichTextLink({ node }) {
30
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
31
+ href: node.url,
32
+ title: node.title,
33
+ target: node.target,
34
+ children: node.children
35
+ });
42
36
  }
43
- function List({
44
- node
45
- }) {
46
- const List2 = node.listType === "unordered" ? "ul" : "ol";
47
- return /* @__PURE__ */ jsxRuntime.jsx(List2, { children: node.children });
37
+ function List({ node }) {
38
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(node.listType === "unordered" ? "ul" : "ol", { children: node.children });
48
39
  }
49
- function ListItem({
50
- node
51
- }) {
52
- return /* @__PURE__ */ jsxRuntime.jsx("li", { children: node.children });
40
+ function ListItem({ node }) {
41
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", { children: node.children });
53
42
  }
43
+ //#endregion
54
44
  exports.RichTextComponents = RichTextComponents;
55
- //# sourceMappingURL=RichText.components.js.map
45
+
46
+ //# sourceMappingURL=RichText.components.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"RichText.components.js","sources":["../../src/RichText.components.tsx"],"sourcesContent":["import {createElement, type ReactNode} from 'react';\n\nexport type CustomComponents = {\n /** The root node of the rich text. Defaults to `<div>` */\n root?: typeof Root;\n /** Customize the headings. Each heading has a `level` property from 1-6. Defaults to `<h1>` to `<h6>` */\n heading?: typeof Heading;\n /** Customize paragraphs. Defaults to `<p>` */\n paragraph?: typeof Paragraph;\n /** Customize how text nodes. They can either be bold or italic. Defaults to `<em>`, `<strong>` or text. */\n text?: typeof Text;\n /** Customize links. Defaults to a React Router `<Link>` component in Hydrogen and a `<a>` in Hydrogen React. */\n link?: typeof RichTextLink;\n /** Customize lists. They can be either ordered or unordered. Defaults to `<ol>` or `<ul>` */\n list?: typeof List;\n /** Customize list items. Defaults to `<li>`. */\n listItem?: typeof ListItem;\n};\n\nexport const RichTextComponents = {\n root: Root,\n heading: Heading,\n paragraph: Paragraph,\n text: Text,\n link: RichTextLink,\n list: List,\n 'list-item': ListItem,\n};\n\nfunction Root({\n node,\n}: {\n node: {\n type: 'root';\n children?: ReactNode[];\n };\n}): ReactNode {\n return <div>{node.children}</div>;\n}\n\nfunction Heading({\n node,\n}: {\n node: {\n type: 'heading';\n level: number;\n children?: ReactNode[];\n };\n}): ReactNode {\n return createElement(`h${node.level ?? '1'}`, null, node.children);\n}\n\nfunction Paragraph({\n node,\n}: {\n node: {\n type: 'paragraph';\n children?: ReactNode[];\n };\n}): ReactNode {\n return <p>{node.children}</p>;\n}\n\nfunction Text({\n node,\n}: {\n node: {\n type: 'text';\n italic?: boolean;\n bold?: boolean;\n value?: string;\n };\n}): ReactNode {\n if (node.bold && node.italic)\n return (\n <em>\n <strong>{node.value}</strong>\n </em>\n );\n\n if (node.bold) return <strong>{node.value}</strong>;\n if (node.italic) return <em>{node.value}</em>;\n\n return node.value;\n}\n\nfunction RichTextLink({\n node,\n}: {\n node: {\n type: 'link';\n url: string;\n title?: string;\n target?: string;\n children?: ReactNode[];\n };\n}): ReactNode {\n return (\n <a href={node.url} title={node.title} target={node.target}>\n {node.children}\n </a>\n );\n}\n\nfunction List({\n node,\n}: {\n node: {\n type: 'list';\n listType: 'unordered' | 'ordered';\n children?: ReactNode[];\n };\n}): ReactNode {\n const List = node.listType === 'unordered' ? 'ul' : 'ol';\n return <List>{node.children}</List>;\n}\n\nfunction ListItem({\n node,\n}: {\n node: {\n type: 'list-item';\n children?: ReactNode[];\n };\n}): ReactNode {\n return <li>{node.children}</li>;\n}\n"],"names":["jsx","createElement","List"],"mappings":";;;;AAmBO,MAAM,qBAAqB;AAAA,EAChC,MAAM;AAAA,EACN,SAAS;AAAA,EACT,WAAW;AAAA,EACX,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,aAAa;AACf;AAEA,SAAS,KAAK;AAAA,EACZ;AACF,GAKc;AACZ,SAAOA,2BAAAA,IAAC,OAAA,EAAK,UAAA,KAAK,SAAA,CAAS;AAC7B;AAEA,SAAS,QAAQ;AAAA,EACf;AACF,GAMc;AACZ,SAAOC,MAAAA,cAAc,IAAI,KAAK,SAAS,GAAG,IAAI,MAAM,KAAK,QAAQ;AACnE;AAEA,SAAS,UAAU;AAAA,EACjB;AACF,GAKc;AACZ,SAAOD,2BAAAA,IAAC,KAAA,EAAG,UAAA,KAAK,SAAA,CAAS;AAC3B;AAEA,SAAS,KAAK;AAAA,EACZ;AACF,GAOc;AACZ,MAAI,KAAK,QAAQ,KAAK;AACpB,0CACG,MAAA,EACC,UAAAA,2BAAAA,IAAC,UAAA,EAAQ,UAAA,KAAK,OAAM,EAAA,CACtB;AAGJ,MAAI,KAAK,KAAM,QAAOA,2BAAAA,IAAC,UAAA,EAAQ,eAAK,OAAM;AAC1C,MAAI,KAAK,OAAQ,QAAOA,2BAAAA,IAAC,MAAA,EAAI,eAAK,OAAM;AAExC,SAAO,KAAK;AACd;AAEA,SAAS,aAAa;AAAA,EACpB;AACF,GAQc;AACZ,SACEA,2BAAAA,IAAC,KAAA,EAAE,MAAM,KAAK,KAAK,OAAO,KAAK,OAAO,QAAQ,KAAK,QAChD,UAAA,KAAK,UACR;AAEJ;AAEA,SAAS,KAAK;AAAA,EACZ;AACF,GAMc;AACZ,QAAME,QAAO,KAAK,aAAa,cAAc,OAAO;AACpD,SAAOF,2BAAAA,IAACE,OAAA,EAAM,UAAA,KAAK,SAAA,CAAS;AAC9B;AAEA,SAAS,SAAS;AAAA,EAChB;AACF,GAKc;AACZ,SAAOF,2BAAAA,IAAC,MAAA,EAAI,UAAA,KAAK,SAAA,CAAS;AAC5B;;"}
1
+ {"version":3,"file":"RichText.components.js","names":[],"sources":["../../src/RichText.components.tsx"],"sourcesContent":["import {createElement, type ReactNode} from 'react';\n\nexport type CustomComponents = {\n /** The root node of the rich text. Defaults to `<div>` */\n root?: typeof Root;\n /** Customize the headings. Each heading has a `level` property from 1-6. Defaults to `<h1>` to `<h6>` */\n heading?: typeof Heading;\n /** Customize paragraphs. Defaults to `<p>` */\n paragraph?: typeof Paragraph;\n /** Customize how text nodes. They can either be bold or italic. Defaults to `<em>`, `<strong>` or text. */\n text?: typeof Text;\n /** Customize links. Defaults to a React Router `<Link>` component in Hydrogen and a `<a>` in Hydrogen React. */\n link?: typeof RichTextLink;\n /** Customize lists. They can be either ordered or unordered. Defaults to `<ol>` or `<ul>` */\n list?: typeof List;\n /** Customize list items. Defaults to `<li>`. */\n listItem?: typeof ListItem;\n};\n\nexport const RichTextComponents = {\n root: Root,\n heading: Heading,\n paragraph: Paragraph,\n text: Text,\n link: RichTextLink,\n list: List,\n 'list-item': ListItem,\n};\n\nfunction Root({\n node,\n}: {\n node: {\n type: 'root';\n children?: ReactNode[];\n };\n}): ReactNode {\n return <div>{node.children}</div>;\n}\n\nfunction Heading({\n node,\n}: {\n node: {\n type: 'heading';\n level: number;\n children?: ReactNode[];\n };\n}): ReactNode {\n return createElement(`h${node.level ?? '1'}`, null, node.children);\n}\n\nfunction Paragraph({\n node,\n}: {\n node: {\n type: 'paragraph';\n children?: ReactNode[];\n };\n}): ReactNode {\n return <p>{node.children}</p>;\n}\n\nfunction Text({\n node,\n}: {\n node: {\n type: 'text';\n italic?: boolean;\n bold?: boolean;\n value?: string;\n };\n}): ReactNode {\n if (node.bold && node.italic)\n return (\n <em>\n <strong>{node.value}</strong>\n </em>\n );\n\n if (node.bold) return <strong>{node.value}</strong>;\n if (node.italic) return <em>{node.value}</em>;\n\n return node.value;\n}\n\nfunction RichTextLink({\n node,\n}: {\n node: {\n type: 'link';\n url: string;\n title?: string;\n target?: string;\n children?: ReactNode[];\n };\n}): ReactNode {\n return (\n <a href={node.url} title={node.title} target={node.target}>\n {node.children}\n </a>\n );\n}\n\nfunction List({\n node,\n}: {\n node: {\n type: 'list';\n listType: 'unordered' | 'ordered';\n children?: ReactNode[];\n };\n}): ReactNode {\n const List = node.listType === 'unordered' ? 'ul' : 'ol';\n return <List>{node.children}</List>;\n}\n\nfunction ListItem({\n node,\n}: {\n node: {\n type: 'list-item';\n children?: ReactNode[];\n };\n}): ReactNode {\n return <li>{node.children}</li>;\n}\n"],"mappings":";;;;AAmBA,IAAa,qBAAqB;CAChC,MAAM;CACN,SAAS;CACT,WAAW;CACX,MAAM;CACN,MAAM;CACN,MAAM;CACN,aAAa;CACd;AAED,SAAS,KAAK,EACZ,QAMY;AACZ,QAAO,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAA,UAAM,KAAK,UAAe,CAAA;;AAGnC,SAAS,QAAQ,EACf,QAOY;AACZ,SAAA,GAAA,MAAA,eAAqB,IAAI,KAAK,SAAS,OAAO,MAAM,KAAK,SAAS;;AAGpE,SAAS,UAAU,EACjB,QAMY;AACZ,QAAO,iBAAA,GAAA,kBAAA,KAAC,KAAD,EAAA,UAAI,KAAK,UAAa,CAAA;;AAG/B,SAAS,KAAK,EACZ,QAQY;AACZ,KAAI,KAAK,QAAQ,KAAK,OACpB,QACE,iBAAA,GAAA,kBAAA,KAAC,MAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAC,UAAD,EAAA,UAAS,KAAK,OAAe,CAAA,EAC1B,CAAA;AAGT,KAAI,KAAK,KAAM,QAAO,iBAAA,GAAA,kBAAA,KAAC,UAAD,EAAA,UAAS,KAAK,OAAe,CAAA;AACnD,KAAI,KAAK,OAAQ,QAAO,iBAAA,GAAA,kBAAA,KAAC,MAAD,EAAA,UAAK,KAAK,OAAW,CAAA;AAE7C,QAAO,KAAK;;AAGd,SAAS,aAAa,EACpB,QASY;AACZ,QACE,iBAAA,GAAA,kBAAA,KAAC,KAAD;EAAG,MAAM,KAAK;EAAK,OAAO,KAAK;EAAO,QAAQ,KAAK;YAChD,KAAK;EACJ,CAAA;;AAIR,SAAS,KAAK,EACZ,QAOY;AAEZ,QAAO,iBAAA,GAAA,kBAAA,KADM,KAAK,aAAa,cAAc,OAAO,MAC7C,EAAA,UAAO,KAAK,UAAgB,CAAA;;AAGrC,SAAS,SAAS,EAChB,QAMY;AACZ,QAAO,iBAAA,GAAA,kBAAA,KAAC,MAAD,EAAA,UAAK,KAAK,UAAc,CAAA"}
@@ -1,55 +1,45 @@
1
- import { jsx } from "react/jsx-runtime";
2
1
  import { createElement } from "react";
3
- const RichTextComponents = {
4
- root: Root,
5
- heading: Heading,
6
- paragraph: Paragraph,
7
- text: Text,
8
- link: RichTextLink,
9
- list: List,
10
- "list-item": ListItem
2
+ import { jsx } from "react/jsx-runtime";
3
+ //#region src/RichText.components.tsx
4
+ var RichTextComponents = {
5
+ root: Root,
6
+ heading: Heading,
7
+ paragraph: Paragraph,
8
+ text: Text,
9
+ link: RichTextLink,
10
+ list: List,
11
+ "list-item": ListItem
11
12
  };
12
- function Root({
13
- node
14
- }) {
15
- return /* @__PURE__ */ jsx("div", { children: node.children });
13
+ function Root({ node }) {
14
+ return /* @__PURE__ */ jsx("div", { children: node.children });
16
15
  }
17
- function Heading({
18
- node
19
- }) {
20
- return createElement(`h${node.level ?? "1"}`, null, node.children);
16
+ function Heading({ node }) {
17
+ return createElement(`h${node.level ?? "1"}`, null, node.children);
21
18
  }
22
- function Paragraph({
23
- node
24
- }) {
25
- return /* @__PURE__ */ jsx("p", { children: node.children });
19
+ function Paragraph({ node }) {
20
+ return /* @__PURE__ */ jsx("p", { children: node.children });
26
21
  }
27
- function Text({
28
- node
29
- }) {
30
- if (node.bold && node.italic)
31
- return /* @__PURE__ */ jsx("em", { children: /* @__PURE__ */ jsx("strong", { children: node.value }) });
32
- if (node.bold) return /* @__PURE__ */ jsx("strong", { children: node.value });
33
- if (node.italic) return /* @__PURE__ */ jsx("em", { children: node.value });
34
- return node.value;
22
+ function Text({ node }) {
23
+ if (node.bold && node.italic) return /* @__PURE__ */ jsx("em", { children: /* @__PURE__ */ jsx("strong", { children: node.value }) });
24
+ if (node.bold) return /* @__PURE__ */ jsx("strong", { children: node.value });
25
+ if (node.italic) return /* @__PURE__ */ jsx("em", { children: node.value });
26
+ return node.value;
35
27
  }
36
- function RichTextLink({
37
- node
38
- }) {
39
- return /* @__PURE__ */ jsx("a", { href: node.url, title: node.title, target: node.target, children: node.children });
28
+ function RichTextLink({ node }) {
29
+ return /* @__PURE__ */ jsx("a", {
30
+ href: node.url,
31
+ title: node.title,
32
+ target: node.target,
33
+ children: node.children
34
+ });
40
35
  }
41
- function List({
42
- node
43
- }) {
44
- const List2 = node.listType === "unordered" ? "ul" : "ol";
45
- return /* @__PURE__ */ jsx(List2, { children: node.children });
36
+ function List({ node }) {
37
+ return /* @__PURE__ */ jsx(node.listType === "unordered" ? "ul" : "ol", { children: node.children });
46
38
  }
47
- function ListItem({
48
- node
49
- }) {
50
- return /* @__PURE__ */ jsx("li", { children: node.children });
39
+ function ListItem({ node }) {
40
+ return /* @__PURE__ */ jsx("li", { children: node.children });
51
41
  }
52
- export {
53
- RichTextComponents
54
- };
55
- //# sourceMappingURL=RichText.components.mjs.map
42
+ //#endregion
43
+ export { RichTextComponents };
44
+
45
+ //# sourceMappingURL=RichText.components.mjs.map