@shopify/hydrogen-react 0.0.0-next-1e3ce50 → 0.0.0-next-7fb60a6

package/dist/umd/hydrogen-react.prod.js

@@ -1,3 +1,3 @@
-(function(b,g){typeof exports=="object"&&typeof module<"u"?g(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],g):(b=typeof globalThis<"u"?globalThis:b||self,g(b.hydrogenreact={},b.React))})(this,function(b,g){"use strict";const Q=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function R(e){if(e&&e.__esModule)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,i.get?i:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const h=Q(g),ee=R(g);var re="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ExternalVideo.tsx";function F(e){var d,f;const{data:r,options:t,id:i=r.id,frameBorder:a="0",allow:o="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:u=!0,loading:n="lazy",...l}=e;if(!r.embedUrl)throw new Error("<ExternalVideo/> requires the 'embedUrl' property");let c=r.embedUrl;if(t){const m=new URL(r.embedUrl);for(const y of Object.keys(t))m.searchParams.set(y,t[y]);c=m.toString()}return h.default.createElement("iframe",{...l,id:i!=null?i:r.embedUrl,title:(f=(d=r.alt)!=null?d:r.id)!=null?f:"external video",frameBorder:a,allow:o,allowFullScreen:u,src:c,loading:n,__self:this,__source:{fileName:re,lineNumber:56,columnNumber:5}})}function E(e){return e.nodes?e.nodes:e.edges?e.edges.map(r=>{if(!(r!=null&&r.node))throw new Error("Connection edges must contain nodes");return r.node}):[]}const ne=["cdn.shopify.com","cdn.shopifycdn.net","shopify-assets.shopifycdn.com","shopify-assets.shopifycdn.net"],te=["spin.dev"],oe=[...ne,...te],M=[352,832,1200,1920,2560];function D({src:e,width:r,height:t,crop:i,scale:a}){const o=new URL(e),u=a!=null?a:1;if(r){let n;typeof r=="string"?n=(M[0]*u).toString():n=(Number(r)*u).toString(),o.searchParams.append("width",n)}return t&&typeof t=="number"&&o.searchParams.append("height",(t*u).toString()),i&&o.searchParams.append("crop",i),o.toString()}function j(e){const r=new URL(e.src);return!oe.some(i=>r.hostname.endsWith(i))||!e.width&&!e.height&&!e.crop&&!e.scale?e.src:D(e)}function ie({data:e,loaderOptions:r,elementProps:t}){var a,o,u,n,l,c;let i=null;return(e==null?void 0:e.width)&&(e==null?void 0:e.height)&&(i=(e==null?void 0:e.width)/(e==null?void 0:e.height)),(r==null?void 0:r.width)||(r==null?void 0:r.height)?{width:(a=r==null?void 0:r.width)!=null?a:i&&typeof r.height=="number"?Math.round(i*r.height):null,height:(o=r==null?void 0:r.height)!=null?o:i&&typeof r.width=="number"?Math.round(i*r.width):null}:(t==null?void 0:t.width)||(t==null?void 0:t.height)?{width:(u=t==null?void 0:t.width)!=null?u:i&&typeof t.height=="number"?Math.round(i*t.height):null,height:(n=t==null?void 0:t.height)!=null?n:i&&typeof t.width=="number"?Math.round(i*t.width):null}:(e==null?void 0:e.width)||(e==null?void 0:e.height)?{width:(l=e==null?void 0:e.width)!=null?l:null,height:(c=e==null?void 0:e.height)!=null?c:null}:{width:null,height:null}}var ae="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/Image.tsx";function P({data:e,width:r,height:t,loading:i,loader:a=j,loaderOptions:o,widths:u,decoding:n="async",...l}){var N,v,s,_,S,p;if(!e.url){const A=`<Image/>: the 'data' prop requires the 'url' property. Image: ${(N=e.id)!=null?N:"no ID provided"}`;return console.error(A),null}const{width:c,height:d}=ie({data:e,loaderOptions:o,elementProps:{width:r,height:t}});let f=e.url;if(a&&(f=a({...o,src:e.url,width:c,height:d}),typeof f!="string"||!f))throw new Error(`<Image/>: 'loader' did not return a valid string. Image: ${(v=e.id)!=null?v:e.url}`);const m=r&&c&&r<c?r:c,y=(s=l.srcSet)!=null?s:ue({...o,widths:u,src:e.url,width:m,height:d,loader:a});return ee.createElement("img",{id:(_=e.id)!=null?_:"",alt:(p=(S=e.altText)!=null?S:l.alt)!=null?p:"",loading:i!=null?i:"lazy",...l,src:f,width:c!=null?c:void 0,height:d!=null?d:void 0,srcSet:y,decoding:n,__self:this,__source:{fileName:ae,lineNumber:150,columnNumber:5}})}function ue({src:e,width:r,crop:t,scale:i,widths:a,loader:o,height:u}){const n=a&&Array.isArray(a);if(n&&a.some(f=>isNaN(f)))throw new Error(`<Image/>: the 'widths' must be an array of numbers. Image: ${e}`);let l=1;r&&u&&(l=Number(u)/Number(r));let c=n?a:M;!n&&r&&r<M[M.length-1]&&(c=M.filter(f=>f<=r));const d=o||D;return c.map(f=>`${d({src:e,width:f,height:t?Number(f)*l:void 0,crop:t,scale:i})} ${f}w`).join(", ")}var U="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/Video.tsx";function x(e){var c,d;const{data:r,previewImageOptions:t,id:i=r.id,playsInline:a=!0,controls:o=!0,sourceProps:u={},...n}=e,l=j({src:(d=(c=r.previewImage)==null?void 0:c.url)!=null?d:"",...t});if(!r.sources)throw new Error("<Video/> requires a 'data.sources' array");return h.default.createElement("video",{...n,id:i,playsInline:a,controls:o,poster:l,__self:this,__source:{fileName:U,lineNumber:42,columnNumber:5}},r.sources.map(f=>{if(!((f==null?void 0:f.url)&&(f==null?void 0:f.mimeType)))throw new Error("<Video/> needs 'source.url' and 'source.mimeType'");return h.default.createElement("source",{...u,key:f.url,src:f.url,type:f.mimeType,__self:this,__source:{fileName:U,lineNumber:54,columnNumber:11}})}))}const $={};function le(e,r){const t=$[e];if(t)return t;const i=new Promise((a,o)=>{const u=document.createElement("script");r!=null&&r.module?u.type="module":u.type="text/javascript",u.src=e,u.onload=()=>{a(!0)},u.onerror=()=>{o(!1)},(r==null?void 0:r.in)==="head"?document.head.appendChild(u):document.body.appendChild(u)});return $[e]=i,i}function q(e,r){const[t,i]=g.useState("loading"),a=JSON.stringify(r);return g.useEffect(()=>{async function o(){try{i("loading"),await le(e,r),i("done")}catch{i("error")}}o()},[e,a,r]),t}var ce="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ModelViewer.tsx";function W(e){var c,d,f,m,y,N,v,s,_,S,p;const[r,t]=g.useState(void 0),i=g.useCallback(A=>{t(A)},[]),{data:a,children:o,className:u,...n}=e,l=q("https://unpkg.com/@google/model-viewer@v1.12.1/dist/model-viewer.min.js",{module:!0});return g.useEffect(()=>{if(!!r)return n.onError&&r.addEventListener("error",n.onError),n.onLoad&&r.addEventListener("load",n.onLoad),n.onPreload&&r.addEventListener("preload",n.onPreload),n.onModelVisibility&&r.addEventListener("model-visibility",n.onModelVisibility),n.onProgress&&r.addEventListener("progress",n.onProgress),n.onArStatus&&r.addEventListener("ar-status",n.onArStatus),n.onArTracking&&r.addEventListener("ar-tracking",n.onArTracking),n.onQuickLookButtonTapped&&r.addEventListener("quick-look-button-tapped",n.onQuickLookButtonTapped),n.onCameraChange&&r.addEventListener("camera-change",n.onCameraChange),n.onEnvironmentChange&&r.addEventListener("environment-change",n.onEnvironmentChange),n.onPlay&&r.addEventListener("play",n.onPlay),n.onPause&&r.addEventListener("ar-status",n.onPause),n.onSceneGraphReady&&r.addEventListener("scene-graph-ready",n.onSceneGraphReady),()=>{r!=null&&(n.onError&&r.removeEventListener("error",n.onError),n.onLoad&&r.removeEventListener("load",n.onLoad),n.onPreload&&r.removeEventListener("preload",n.onPreload),n.onModelVisibility&&r.removeEventListener("model-visibility",n.onModelVisibility),n.onProgress&&r.removeEventListener("progress",n.onProgress),n.onArStatus&&r.removeEventListener("ar-status",n.onArStatus),n.onArTracking&&r.removeEventListener("ar-tracking",n.onArTracking),n.onQuickLookButtonTapped&&r.removeEventListener("quick-look-button-tapped",n.onQuickLookButtonTapped),n.onCameraChange&&r.removeEventListener("camera-change",n.onCameraChange),n.onEnvironmentChange&&r.removeEventListener("environment-change",n.onEnvironmentChange),n.onPlay&&r.removeEventListener("play",n.onPlay),n.onPause&&r.removeEventListener("ar-status",n.onPause),n.onSceneGraphReady&&r.removeEventListener("scene-graph-ready",n.onSceneGraphReady))}},[r,n.onArStatus,n.onArTracking,n.onCameraChange,n.onEnvironmentChange,n.onError,n.onLoad,n.onModelVisibility,n.onPause,n.onPlay,n.onPreload,n.onProgress,n.onQuickLookButtonTapped,n.onSceneGraphReady]),l!=="done"?null:(d=(c=a.sources)==null?void 0:c[0])!=null&&d.url?h.default.createElement("model-viewer",{ref:i,...n,className:u,id:(f=n.id)!=null?f:a.id,src:a.sources[0].url,alt:(m=a.alt)!=null?m:null,"camera-controls":(y=n.cameraControls)!=null?y:!0,poster:(v=n.poster||((N=a.previewImage)==null?void 0:N.url))!=null?v:null,autoplay:(s=n.autoplay)!=null?s:!0,loading:n.loading,reveal:n.reveal,ar:n.ar,"ar-modes":n.arModes,"ar-scale":n.arScale,"ar-placement":n.arPlacement,"ios-src":n.iosSrc,"touch-action":n.touchAction,"disable-zoom":n.disableZoom,"orbit-sensitivity":n.orbitSensitivity,"auto-rotate":n.autoRotate,"auto-rotate-delay":n.autoRotateDelay,"rotation-per-second":n.rotationPerSecond,"interaction-policy":n.interactionPolicy,"interaction-prompt":n.interactionPrompt,"interaction-prompt-style":n.interactionPromptStyle,"interaction-prompt-threshold":n.interactionPromptThreshold,"camera-orbit":n.cameraOrbit,"camera-target":n.cameraTarget,"field-of-view":n.fieldOfView,"max-camera-orbit":n.maxCameraOrbit,"min-camera-orbit":n.minCameraOrbit,"max-field-of-view":n.maxFieldOfView,"min-field-of-view":n.minFieldOfView,bounds:n.bounds,"interpolation-decay":(_=n.interpolationDecay)!=null?_:100,"skybox-image":n.skyboxImage,"environment-image":n.environmentImage,exposure:n.exposure,"shadow-intensity":(S=n.shadowIntensity)!=null?S:0,"shadow-softness":(p=n.shadowSoftness)!=null?p:0,"animation-name":n.animationName,"animation-crossfade-duration":n.animationCrossfadeDuration,"variant-name":n.variantName,orientation:n.orientation,scale:n.scale,__self:this,__source:{fileName:ce,lineNumber:222,columnNumber:5}},o):(console.error("<ModelViewer/> requires 'data.sources' prop to be an array, with an object that has a property 'url' on it. Rendering 'null'"),null)}var T="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/MediaFile.tsx";function se({data:e,mediaOptions:r,...t}){switch(e.__typename){case"MediaImage":return e.image?h.default.createElement(P,{...t,...r==null?void 0:r.image,data:e.image,__self:this,__source:{fileName:T,lineNumber:51,columnNumber:9}}):(console.warn("<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default."),null);case"Video":return h.default.createElement(x,{...t,...r==null?void 0:r.video,data:e,__self:this,__source:{fileName:T,lineNumber:60,columnNumber:9}});case"ExternalVideo":return h.default.createElement(F,{...t,...r==null?void 0:r.externalVideo,data:e,__self:this,__source:{fileName:T,lineNumber:65,columnNumber:9}});case"Model3d":return h.default.createElement(W,{...t,...r==null?void 0:r.modelViewer,data:e,__self:this,__source:{fileName:T,lineNumber:74,columnNumber:9}});default:return console.error("<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default"),null}}const C="2022-07";var fe="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ShopifyProvider.tsx";const I=g.createContext({storeDomain:"test.myshopify.com",storefrontToken:"abc123",storefrontApiVersion:C,country:{isoCode:"US"},language:{isoCode:"EN"},locale:"EN-US"});function me({children:e,shopifyConfig:r}){if(!r)throw new Error("The 'shopifyConfig' prop must be passed to '<ShopifyProvider/>'");r.storefrontApiVersion!==C&&console.warn(`This version of Hydrogen-UI is built for Shopify's Storefront API version ${C}, but it looks like you're using version ${r.storefrontApiVersion}. There may be issues or bugs if you use a mismatched version of Hydrogen-UI and the Storefront API.`);const t=g.useMemo(()=>({...r,storeDomain:r.storeDomain.replace(/^https?:\/\//,"")}),[r]);return h.default.createElement(I.Provider,{value:t,__self:this,__source:{fileName:fe,lineNumber:49,columnNumber:5}},e)}function L(){const e=g.useContext(I);if(!e)throw new Error("'useShop()' must be a descendent of <ShopifyProvider/>");return e}var w="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/Metafield.tsx";function de(e){var n,l,c,d,f,m,y,N,v;const{data:r,as:t,...i}=e,{locale:a}=L(),o=g.useMemo(()=>B(r),[r]);if(!o)return console.warn("<Metafield/>: nothing was passed to the data prop 'data'. Rendering 'null'"),null;if(o.value===null||o.value===void 0){const s=`<Metafield/>: No metafield value for metafield ${(n=o.id)!=null?n:o.key}. Rendering 'null'`;return console.warn(s),null}switch(o.type){case"date":{const s=t!=null?t:"time";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:68,columnNumber:9}},o.value.toLocaleDateString(a))}case"date_time":{const s=t!=null?t:"time";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:76,columnNumber:9}},o.value.toLocaleString(a))}case"weight":case"dimension":case"volume":{const s=t!=null?t:"span";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:86,columnNumber:9}},_e(o.value,a))}case"rating":{const s=t!=null?t:"span";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:94,columnNumber:9}},o.value.value)}case"single_line_text_field":{const s=t!=null?t:"span";return h.default.createElement(s,{...i,dangerouslySetInnerHTML:{__html:o.value},__self:this,__source:{fileName:w,lineNumber:102,columnNumber:9}})}case"multi_line_text_field":{const s=t!=null?t:"div";return h.default.createElement(s,{...i,dangerouslySetInnerHTML:{__html:o.value.split(`
-`).join("<br/>")},__self:this,__source:{fileName:w,lineNumber:111,columnNumber:9}})}case"url":{const s=new URL(o.value);return h.default.createElement("a",{href:s.href.replace(s.protocol,""),...i,__self:this,__source:{fileName:w,lineNumber:122,columnNumber:9}},o.value)}case"json":{const s=t!=null?t:"span";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:133,columnNumber:9}},JSON.stringify(o.value))}case"product_reference":case"variant_reference":case"page_reference":{const s=t!=null?t:"span",_=o.reference;return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:144,columnNumber:9}},(c=(l=_==null?void 0:_.title)!=null?l:_==null?void 0:_.id)!=null?c:"")}case"list.single_line_text_field":{const s=t!=null?t:"ul",_=o.references?E(o.references):[];return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:155,columnNumber:9}},_.map((S,p)=>h.default.createElement("li",{key:`${S!=null?S:""}-${p}`,__self:this,__source:{fileName:w,lineNumber:159,columnNumber:13}},S)))}case"file_reference":if(((d=o.reference)==null?void 0:d.__typename)==="MediaImage"){const s=o.reference;return s.image?h.default.createElement(P,{data:s.image,...i,__self:this,__source:{fileName:w,lineNumber:168,columnNumber:11}}):null}else if(((f=o.reference)==null?void 0:f.__typename)==="GenericFile"){const s=o.reference;return s.previewImage?h.default.createElement("a",{href:(y=(m=o.reference)==null?void 0:m.url)!=null?y:"",...i,__self:this,__source:{fileName:w,lineNumber:173,columnNumber:11}},h.default.createElement(P,{data:s.previewImage,__self:this,__source:{fileName:w,lineNumber:174,columnNumber:13}})):null}else if(((N=o.reference)==null?void 0:N.__typename)==="Video"){const s=o.reference;return h.default.createElement(x,{...i,data:s,__self:this,__source:{fileName:w,lineNumber:179,columnNumber:16}})}}const u=t!=null?t:"span";return h.default.createElement(u,{...i,__self:this,__source:{fileName:w,lineNumber:186,columnNumber:5}},(v=o.value)==null?void 0:v.toString())}function B(e){return e?{...e,value:H(e)}:null}function H(e){if(!e)return null;if(e.value===null||e.value===void 0)return e.value;switch(e.type){case"boolean":return e.value==="true";case"number_integer":return parseInt(e.value);case"number_decimal":return parseFloat(e.value);case"date":case"date_time":return new Date(e.value);case"json":case"weight":case"dimension":case"volume":case"rating":return he(e.value);case"color":case"single_line_text_field":case"multi_line_text_field":case"product_reference":case"page_reference":case"variant_reference":case"file_reference":case"url":default:return e.value}}function he(e){return String(e).includes("__proto__")?JSON.parse(e,(r,t)=>{if(r!=="__proto__")return t}):JSON.parse(e)}const ge={mm:"millimeter",cm:"centimeter",m:"meter",in:"inch",ft:"foot",yd:"yard",ml:"milliliter",l:"liter",us_fl_oz:"fluid-ounce",us_gal:"gallon",kg:"kilogram",g:"gram",lb:"pound",oz:"ounce"};function _e(e,r="en-us",t={}){let i={value:e.value,unit:ge[e.unit]};return i.unit==null&&(i=ye(e.value,e.unit)),new Intl.NumberFormat(r,{...t,unit:i.unit,style:"unit"}).format(i.value)}function ye(e,r){switch(r){case"cl":return{value:e/1e3,unit:"liter"};case"m3":return{value:e*1e3,unit:"liter"};case"us_pt":return{value:e*.125,unit:"gallon"};case"us_qt":return{value:e*.5,unit:"gallon"};case"us_oz":return{value:e/128,unit:"gallon"};case"imp_pt":return{value:e/6.661,unit:"gallon"};case"imp_qt":return{value:e/3.331,unit:"gallon"};case"imp_gal":return{value:e/1.201,unit:"gallon"};case"imp_fl_oz":return{value:e*.96076,unit:"fluid-ounce"};default:throw new Error(`Unit not supported: ${r}`)}}function z(e){const{locale:r}=L();if(!r)throw new Error("useMoney(): Unable to get 'locale' from 'useShop()', which means that 'locale' was not passed to '<ShopifyProvider/>'. 'locale' is required for 'useMoney()' to work");const t=parseFloat(e.amount),i=g.useMemo(()=>({style:"currency",currency:e.currencyCode}),[e.currencyCode]),a=k(r,i),o=k(r,{...i,currencyDisplay:"name"}),u=k(r,{...i,currencyDisplay:"narrowSymbol"}),n=k(r,{...i,minimumFractionDigits:0,maximumFractionDigits:0}),l=k(r),c=k(r,{minimumFractionDigits:0,maximumFractionDigits:0}),d=m=>m.type==="currency",f=g.useMemo(()=>({original:()=>e,currencyCode:()=>e.currencyCode,localizedString:()=>a().format(t),parts:()=>a().formatToParts(t),withoutTrailingZeros:()=>t%1===0?n().format(t):a().format(t),withoutTrailingZerosAndCurrency:()=>t%1===0?c().format(t):l().format(t),currencyName:()=>{var m,y;return(y=(m=o().formatToParts(t).find(d))==null?void 0:m.value)!=null?y:e.currencyCode},currencySymbol:()=>{var m,y;return(y=(m=a().formatToParts(t).find(d))==null?void 0:m.value)!=null?y:e.currencyCode},currencyNarrowSymbol:()=>{var m,y;return(y=(m=u().formatToParts(t).find(d))==null?void 0:m.value)!=null?y:""},amount:()=>a().formatToParts(t).filter(m=>["decimal","fraction","group","integer","literal"].includes(m.type)).map(m=>m.value).join("")}),[e,t,o,a,u,l,n,c]);return g.useMemo(()=>new Proxy(f,{get:(m,y)=>{var N;return(N=Reflect.get(m,y))==null?void 0:N.call(null)}}),[f])}function k(e,r){return g.useMemo(()=>{let t;return()=>t!=null?t:t=new Intl.NumberFormat(e,r)},[e,r])}var be="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/Money.tsx";function V({data:e,as:r,withoutCurrency:t,withoutTrailingZeros:i,measurement:a,measurementSeparator:o="/",...u}){if(!Se(e))throw new Error("<Money/> needs a valid 'data' prop that has 'amount' and 'currencyCode'");const n=z(e),l=r!=null?r:"div";let c=n.localizedString;return(t||i)&&(t&&!i?c=n.amount:!t&&i?c=n.withoutTrailingZeros:c=n.withoutTrailingZerosAndCurrency),h.default.createElement(l,{...u,__self:this,__source:{fileName:be,lineNumber:65,columnNumber:5}},c,a&&a.referenceUnit&&h.default.createElement(h.default.Fragment,null,o,a.referenceUnit))}function Se(e){return typeof e.amount=="string"&&!!e.amount&&typeof e.currencyCode=="string"&&!!e.currencyCode}var G="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ProductPrice.tsx";function Ne(e){var c,d,f,m,y,N,v,s;const{priceType:r="regular",variantId:t,valueType:i="min",data:a,...o}=e;if(a==null)throw new Error("<ProductPrice/> requires a product as the 'data' prop");let u,n;const l=t&&(d=E((c=a==null?void 0:a.variants)!=null?c:{}).find(_=>(_==null?void 0:_.id)===t))!=null?d:null;if(r==="compareAt")if(t&&l){if(((f=l.compareAtPriceV2)==null?void 0:f.amount)===((m=l.priceV2)==null?void 0:m.amount))return null;u=l.compareAtPriceV2}else i==="max"?u=(y=a==null?void 0:a.compareAtPriceRange)==null?void 0:y.maxVariantPrice:u=(N=a==null?void 0:a.compareAtPriceRange)==null?void 0:N.minVariantPrice;else t&&l?(u=l.priceV2,i==="unit"&&(u=l.unitPrice,n=l.unitPriceMeasurement)):i==="max"?u=(v=a.priceRange)==null?void 0:v.maxVariantPrice:u=(s=a.priceRange)==null?void 0:s.minVariantPrice;return u?n?h.default.createElement(V,{...o,data:u,measurement:n,__self:this,__source:{fileName:G,lineNumber:82,columnNumber:7}}):h.default.createElement(V,{...o,data:u,__self:this,__source:{fileName:G,lineNumber:86,columnNumber:10}}):null}var we="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ProductProvider.tsx";const O=g.createContext(null);function pe({children:e,data:r,initialVariantId:t}){const i=g.useMemo(()=>{var s;return E((s=r.variants)!=null?s:{})},[r.variants]);if(!ke(i))throw new Error("<ProductProvider/> requires 'product.variants.nodes' or 'product.variants.edges'");const a=g.useMemo(()=>Ee(i),[i]),[o,u]=g.useState(()=>J(t,i)),[n,l]=g.useState(()=>K(o));g.useEffect(()=>{const s=J(t,i);u(s),l(K(s))},[t,i]);const c=g.useCallback((s,_)=>{l(S=>{const p={...S,[s]:_};return u(X(i,p)),p})},[l,i]),d=g.useCallback((s,_)=>{var p;const S=X(i,{...n,[s]:_});return(p=S==null?void 0:S.availableForSale)!=null?p:!0},[n,i]),f=g.useMemo(()=>{var s;return E((s=r.sellingPlanGroups)!=null?s:{}).map(_=>{var S;return{..._,sellingPlans:E((S=_==null?void 0:_.sellingPlans)!=null?S:{})}})},[r.sellingPlanGroups]),[m,y]=g.useState(void 0),N=g.useMemo(()=>{var s,_;if(!(!o||!m)){if(!((s=o.sellingPlanAllocations)!=null&&s.nodes)&&!((_=o.sellingPlanAllocations)!=null&&_.edges))throw new Error("<ProductProvider/>: You must include 'sellingPlanAllocations.nodes' or 'sellingPlanAllocations.edges' in your variants in order to calculate selectedSellingPlanAllocation");return E(o.sellingPlanAllocations).find(S=>{var p;return((p=S==null?void 0:S.sellingPlan)==null?void 0:p.id)===m.id})}},[o,m]),v=g.useMemo(()=>({variants:i,variantsConnection:r.variants,options:a,selectedVariant:o,setSelectedVariant:u,selectedOptions:n,setSelectedOption:c,setSelectedOptions:l,isOptionInStock:d,selectedSellingPlan:m,setSelectedSellingPlan:y,selectedSellingPlanAllocation:N,sellingPlanGroups:f,sellingPlanGroupsConnection:r.sellingPlanGroups}),[d,a,r.sellingPlanGroups,r.variants,n,m,N,o,f,c,i]);return h.default.createElement(O.Provider,{value:v,__self:this,__source:{fileName:we,lineNumber:201,columnNumber:5}},e)}function ve(){const e=g.useContext(O);if(!e)throw new Error("'useProduct' must be a child of <ProductProvider />");return e}function X(e,r){var t,i;if(!(!e.length||((i=(t=e==null?void 0:e[0])==null?void 0:t.selectedOptions)==null?void 0:i.length)!==Object.keys(r).length))return e==null?void 0:e.find(a=>Object.entries(r).every(([o,u])=>{var n;return(n=a==null?void 0:a.selectedOptions)==null?void 0:n.some(l=>(l==null?void 0:l.name)===o&&(l==null?void 0:l.value)===u)}))}function Ee(e){const r=e.reduce((t,i)=>{var a;if(!i.selectedOptions)throw new Error("'getOptions' requires 'variant.selectedOptions'");return(a=i==null?void 0:i.selectedOptions)==null||a.forEach(o=>{var u,n,l,c;t[(u=o==null?void 0:o.name)!=null?u:""]=t[(n=o==null?void 0:o.name)!=null?n:""]||new Set,t[(l=o==null?void 0:o.name)!=null?l:""].add((c=o==null?void 0:o.value)!=null?c:"")}),t},{});return Object.keys(r).map(t=>({name:t,values:Array.from(r[t])}))}function J(e,r){if(e){const t=r.find(i=>(i==null?void 0:i.id)===e);return t||console.warn("<ProductProvider/> received a 'initialVariantId' prop, but could not actually find a variant with that ID"),t}if(e===null)return null;if(e===void 0)return r.find(t=>t==null?void 0:t.availableForSale)||r[0]}function K(e){return e!=null&&e.selectedOptions?e.selectedOptions.reduce((r,t)=>{var i,a;return r[(i=t==null?void 0:t.name)!=null?i:""]=(a=t==null?void 0:t.value)!=null?a:"",r},{}):{}}function ke(e){return!(!e||!Array.isArray(e))}var Y="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ShopPayButton.tsx";const Me="https://cdn.shopify.com/shopifycloud/shop-js/v1.0/client.js";function Ce({variantIds:e,className:r,variantIdsAndQuantities:t,width:i}){const{storeDomain:a}=L(),o=q(Me);let u;if(e&&t)throw new Error(Te);if(e)u=e.reduce((l,c)=>{const d=Z(c);return d&&l.push(d),l},[]);else if(t)u=t.reduce((l,c)=>{var f;const d=Z(c==null?void 0:c.id);return d&&l.push(`${d}:${(f=c==null?void 0:c.quantity)!=null?f:1}`),l},[]);else throw new Error(Pe);const n=i?{"--shop-pay-button-width":i}:void 0;return h.default.createElement("div",{className:r,style:n,__self:this,__source:{fileName:Y,lineNumber:91,columnNumber:5}},o==="done"&&h.default.createElement("shop-pay-button",{"store-url":`https://${a}`,variants:u.join(","),__self:this,__source:{fileName:Y,lineNumber:93,columnNumber:9}}))}function Z(e){if(!!e)return e.split("/").pop()}const Pe='You must pass in either "variantIds" or "variantIdsAndQuantities" to ShopPayButton',Te="You must provide either a variantIds or variantIdsAndQuantities prop, but not both in the ShopPayButton component";function Le({storeDomain:e,privateStorefrontToken:r,publicStorefrontToken:t,storefrontApiVersion:i,contentType:a}){return i!==C&&console.warn(`StorefrontClient: The Storefront API version that you're using is different than the version this build of Hydrogen-UI is targeting. You may run into unexpected errors if these versions don't match. Received verion: "${i}"; expected version ${C}`),{getStorefrontApiUrl(o){var u,n;return`https://${(u=o==null?void 0:o.storeDomain)!=null?u:e}.myshopify.com/api/${(n=o==null?void 0:o.storefrontApiVersion)!=null?n:i}/graphql.json`},getPrivateTokenHeaders(o){var n,l,c;if(!r&&!(o!=null&&o.privateStorefrontToken))throw new Error("StorefrontClient: You did not pass in a 'privateStorefrontToken' while using 'getPrivateTokenHeaders()'");return{"content-type":((n=o==null?void 0:o.contentType)!=null?n:a)==="graphql"?"application/graphql":"application/json","X-SDK-Variant":"hydrogen-ui","X-SDK-Variant-Source":"react","X-SDK-Version":i,"Shopify-Storefront-Private-Token":(c=(l=o==null?void 0:o.privateStorefrontToken)!=null?l:r)!=null?c:"",...o!=null&&o.buyerIp?{"Shopify-Storefront-Buyer-IP":o.buyerIp}:{}}},getPublicTokenHeaders(o){var n,l,c;if(!t&&!(o!=null&&o.publicStorefrontToken))throw new Error("StorefrontClient: You did not pass in a 'publicStorefrontToken' while using 'getPublicTokenHeaders()'");return{"content-type":((n=o==null?void 0:o.contentType)!=null?n:a)==="graphql"?"application/graphql":"application/json","X-SDK-Variant":"hydrogen-ui","X-SDK-Variant-Source":"react","X-SDK-Version":i,"X-Shopify-Storefront-Access-Token":(c=(l=o==null?void 0:o.publicStorefrontToken)!=null?l:t)!=null?c:""}}}}b.ExternalVideo=F,b.Image=P,b.MediaFile=se,b.Metafield=de,b.ModelViewer=W,b.Money=V,b.ProductPrice=Ne,b.ProductProvider=pe,b.ShopPayButton=Ce,b.ShopifyProvider=me,b.Video=x,b.createStorefrontClient=Le,b.flattenConnection=E,b.parseMetafield=B,b.parseMetafieldValue=H,b.useMoney=z,b.useProduct=ve,b.useShop=L,Object.defineProperties(b,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(b,g){typeof exports=="object"&&typeof module<"u"?g(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],g):(b=typeof globalThis<"u"?globalThis:b||self,g(b.hydrogenreact={},b.React))})(this,function(b,g){"use strict";const Q=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function R(e){if(e&&e.__esModule)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,i.get?i:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const h=Q(g),ee=R(g);var re="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ExternalVideo.tsx";function F(e){var d,f;const{data:r,options:t,id:i=r.id,frameBorder:a="0",allow:o="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:u=!0,loading:n="lazy",...l}=e;if(!r.embedUrl)throw new Error("<ExternalVideo/> requires the 'embedUrl' property");let c=r.embedUrl;if(t){const m=new URL(r.embedUrl);for(const y of Object.keys(t))m.searchParams.set(y,t[y]);c=m.toString()}return h.default.createElement("iframe",{...l,id:i!=null?i:r.embedUrl,title:(f=(d=r.alt)!=null?d:r.id)!=null?f:"external video",frameBorder:a,allow:o,allowFullScreen:u,src:c,loading:n,__self:this,__source:{fileName:re,lineNumber:56,columnNumber:5}})}function E(e){return e.nodes?e.nodes:e.edges?e.edges.map(r=>{if(!(r!=null&&r.node))throw new Error("Connection edges must contain nodes");return r.node}):[]}const ne=["cdn.shopify.com","cdn.shopifycdn.net","shopify-assets.shopifycdn.com","shopify-assets.shopifycdn.net"],te=["spin.dev"],oe=[...ne,...te],M=[352,832,1200,1920,2560];function D({src:e,width:r,height:t,crop:i,scale:a}){const o=new URL(e),u=a!=null?a:1;if(r){let n;typeof r=="string"?n=(M[0]*u).toString():n=(Number(r)*u).toString(),o.searchParams.append("width",n)}return t&&typeof t=="number"&&o.searchParams.append("height",(t*u).toString()),i&&o.searchParams.append("crop",i),o.toString()}function j(e){const r=new URL(e.src);return!oe.some(i=>r.hostname.endsWith(i))||!e.width&&!e.height&&!e.crop&&!e.scale?e.src:D(e)}function ie({data:e,loaderOptions:r,elementProps:t}){var a,o,u,n,l,c;let i=null;return(e==null?void 0:e.width)&&(e==null?void 0:e.height)&&(i=(e==null?void 0:e.width)/(e==null?void 0:e.height)),(r==null?void 0:r.width)||(r==null?void 0:r.height)?{width:(a=r==null?void 0:r.width)!=null?a:i&&typeof r.height=="number"?Math.round(i*r.height):null,height:(o=r==null?void 0:r.height)!=null?o:i&&typeof r.width=="number"?Math.round(i*r.width):null}:(t==null?void 0:t.width)||(t==null?void 0:t.height)?{width:(u=t==null?void 0:t.width)!=null?u:i&&typeof t.height=="number"?Math.round(i*t.height):null,height:(n=t==null?void 0:t.height)!=null?n:i&&typeof t.width=="number"?Math.round(i*t.width):null}:(e==null?void 0:e.width)||(e==null?void 0:e.height)?{width:(l=e==null?void 0:e.width)!=null?l:null,height:(c=e==null?void 0:e.height)!=null?c:null}:{width:null,height:null}}var ae="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/Image.tsx";function P({data:e,width:r,height:t,loading:i,loader:a=j,loaderOptions:o,widths:u,decoding:n="async",...l}){var N,v,s,_,S,p;if(!e.url){const A=`<Image/>: the 'data' prop requires the 'url' property. Image: ${(N=e.id)!=null?N:"no ID provided"}`;return console.error(A),null}const{width:c,height:d}=ie({data:e,loaderOptions:o,elementProps:{width:r,height:t}});let f=e.url;if(a&&(f=a({...o,src:e.url,width:c,height:d}),typeof f!="string"||!f))throw new Error(`<Image/>: 'loader' did not return a valid string. Image: ${(v=e.id)!=null?v:e.url}`);const m=r&&c&&r<c?r:c,y=(s=l.srcSet)!=null?s:ue({...o,widths:u,src:e.url,width:m,height:d,loader:a});return ee.createElement("img",{id:(_=e.id)!=null?_:"",alt:(p=(S=e.altText)!=null?S:l.alt)!=null?p:"",loading:i!=null?i:"lazy",...l,src:f,width:c!=null?c:void 0,height:d!=null?d:void 0,srcSet:y,decoding:n,__self:this,__source:{fileName:ae,lineNumber:150,columnNumber:5}})}function ue({src:e,width:r,crop:t,scale:i,widths:a,loader:o,height:u}){const n=a&&Array.isArray(a);if(n&&a.some(f=>isNaN(f)))throw new Error(`<Image/>: the 'widths' must be an array of numbers. Image: ${e}`);let l=1;r&&u&&(l=Number(u)/Number(r));let c=n?a:M;!n&&r&&r<M[M.length-1]&&(c=M.filter(f=>f<=r));const d=o||D;return c.map(f=>`${d({src:e,width:f,height:t?Number(f)*l:void 0,crop:t,scale:i})} ${f}w`).join(", ")}var U="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/Video.tsx";function x(e){var c,d;const{data:r,previewImageOptions:t,id:i=r.id,playsInline:a=!0,controls:o=!0,sourceProps:u={},...n}=e,l=j({src:(d=(c=r.previewImage)==null?void 0:c.url)!=null?d:"",...t});if(!r.sources)throw new Error("<Video/> requires a 'data.sources' array");return h.default.createElement("video",{...n,id:i,playsInline:a,controls:o,poster:l,__self:this,__source:{fileName:U,lineNumber:42,columnNumber:5}},r.sources.map(f=>{if(!((f==null?void 0:f.url)&&(f==null?void 0:f.mimeType)))throw new Error("<Video/> needs 'source.url' and 'source.mimeType'");return h.default.createElement("source",{...u,key:f.url,src:f.url,type:f.mimeType,__self:this,__source:{fileName:U,lineNumber:54,columnNumber:11}})}))}const $={};function le(e,r){const t=$[e];if(t)return t;const i=new Promise((a,o)=>{const u=document.createElement("script");r!=null&&r.module?u.type="module":u.type="text/javascript",u.src=e,u.onload=()=>{a(!0)},u.onerror=()=>{o(!1)},(r==null?void 0:r.in)==="head"?document.head.appendChild(u):document.body.appendChild(u)});return $[e]=i,i}function q(e,r){const[t,i]=g.useState("loading"),a=JSON.stringify(r);return g.useEffect(()=>{async function o(){try{i("loading"),await le(e,r),i("done")}catch{i("error")}}o()},[e,a,r]),t}var ce="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ModelViewer.tsx";function W(e){var c,d,f,m,y,N,v,s,_,S,p;const[r,t]=g.useState(void 0),i=g.useCallback(A=>{t(A)},[]),{data:a,children:o,className:u,...n}=e,l=q("https://unpkg.com/@google/model-viewer@v1.12.1/dist/model-viewer.min.js",{module:!0});return g.useEffect(()=>{if(!!r)return n.onError&&r.addEventListener("error",n.onError),n.onLoad&&r.addEventListener("load",n.onLoad),n.onPreload&&r.addEventListener("preload",n.onPreload),n.onModelVisibility&&r.addEventListener("model-visibility",n.onModelVisibility),n.onProgress&&r.addEventListener("progress",n.onProgress),n.onArStatus&&r.addEventListener("ar-status",n.onArStatus),n.onArTracking&&r.addEventListener("ar-tracking",n.onArTracking),n.onQuickLookButtonTapped&&r.addEventListener("quick-look-button-tapped",n.onQuickLookButtonTapped),n.onCameraChange&&r.addEventListener("camera-change",n.onCameraChange),n.onEnvironmentChange&&r.addEventListener("environment-change",n.onEnvironmentChange),n.onPlay&&r.addEventListener("play",n.onPlay),n.onPause&&r.addEventListener("ar-status",n.onPause),n.onSceneGraphReady&&r.addEventListener("scene-graph-ready",n.onSceneGraphReady),()=>{r!=null&&(n.onError&&r.removeEventListener("error",n.onError),n.onLoad&&r.removeEventListener("load",n.onLoad),n.onPreload&&r.removeEventListener("preload",n.onPreload),n.onModelVisibility&&r.removeEventListener("model-visibility",n.onModelVisibility),n.onProgress&&r.removeEventListener("progress",n.onProgress),n.onArStatus&&r.removeEventListener("ar-status",n.onArStatus),n.onArTracking&&r.removeEventListener("ar-tracking",n.onArTracking),n.onQuickLookButtonTapped&&r.removeEventListener("quick-look-button-tapped",n.onQuickLookButtonTapped),n.onCameraChange&&r.removeEventListener("camera-change",n.onCameraChange),n.onEnvironmentChange&&r.removeEventListener("environment-change",n.onEnvironmentChange),n.onPlay&&r.removeEventListener("play",n.onPlay),n.onPause&&r.removeEventListener("ar-status",n.onPause),n.onSceneGraphReady&&r.removeEventListener("scene-graph-ready",n.onSceneGraphReady))}},[r,n.onArStatus,n.onArTracking,n.onCameraChange,n.onEnvironmentChange,n.onError,n.onLoad,n.onModelVisibility,n.onPause,n.onPlay,n.onPreload,n.onProgress,n.onQuickLookButtonTapped,n.onSceneGraphReady]),l!=="done"?null:(d=(c=a.sources)==null?void 0:c[0])!=null&&d.url?h.default.createElement("model-viewer",{ref:i,...n,className:u,id:(f=n.id)!=null?f:a.id,src:a.sources[0].url,alt:(m=a.alt)!=null?m:null,"camera-controls":(y=n.cameraControls)!=null?y:!0,poster:(v=n.poster||((N=a.previewImage)==null?void 0:N.url))!=null?v:null,autoplay:(s=n.autoplay)!=null?s:!0,loading:n.loading,reveal:n.reveal,ar:n.ar,"ar-modes":n.arModes,"ar-scale":n.arScale,"ar-placement":n.arPlacement,"ios-src":n.iosSrc,"touch-action":n.touchAction,"disable-zoom":n.disableZoom,"orbit-sensitivity":n.orbitSensitivity,"auto-rotate":n.autoRotate,"auto-rotate-delay":n.autoRotateDelay,"rotation-per-second":n.rotationPerSecond,"interaction-policy":n.interactionPolicy,"interaction-prompt":n.interactionPrompt,"interaction-prompt-style":n.interactionPromptStyle,"interaction-prompt-threshold":n.interactionPromptThreshold,"camera-orbit":n.cameraOrbit,"camera-target":n.cameraTarget,"field-of-view":n.fieldOfView,"max-camera-orbit":n.maxCameraOrbit,"min-camera-orbit":n.minCameraOrbit,"max-field-of-view":n.maxFieldOfView,"min-field-of-view":n.minFieldOfView,bounds:n.bounds,"interpolation-decay":(_=n.interpolationDecay)!=null?_:100,"skybox-image":n.skyboxImage,"environment-image":n.environmentImage,exposure:n.exposure,"shadow-intensity":(S=n.shadowIntensity)!=null?S:0,"shadow-softness":(p=n.shadowSoftness)!=null?p:0,"animation-name":n.animationName,"animation-crossfade-duration":n.animationCrossfadeDuration,"variant-name":n.variantName,orientation:n.orientation,scale:n.scale,__self:this,__source:{fileName:ce,lineNumber:222,columnNumber:5}},o):(console.error("<ModelViewer/> requires 'data.sources' prop to be an array, with an object that has a property 'url' on it. Rendering 'null'"),null)}var T="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/MediaFile.tsx";function se({data:e,mediaOptions:r,...t}){switch(e.__typename){case"MediaImage":return e.image?h.default.createElement(P,{...t,...r==null?void 0:r.image,data:e.image,__self:this,__source:{fileName:T,lineNumber:50,columnNumber:9}}):(console.warn("<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default."),null);case"Video":return h.default.createElement(x,{...t,...r==null?void 0:r.video,data:e,__self:this,__source:{fileName:T,lineNumber:59,columnNumber:9}});case"ExternalVideo":return h.default.createElement(F,{...t,...r==null?void 0:r.externalVideo,data:e,__self:this,__source:{fileName:T,lineNumber:64,columnNumber:9}});case"Model3d":return h.default.createElement(W,{...t,...r==null?void 0:r.modelViewer,data:e,__self:this,__source:{fileName:T,lineNumber:73,columnNumber:9}});default:return console.error("<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default"),null}}const C="2022-07";var fe="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ShopifyProvider.tsx";const I=g.createContext({storeDomain:"test.myshopify.com",storefrontToken:"abc123",storefrontApiVersion:C,country:{isoCode:"US"},language:{isoCode:"EN"},locale:"EN-US"});function me({children:e,shopifyConfig:r}){if(!r)throw new Error("The 'shopifyConfig' prop must be passed to '<ShopifyProvider/>'");r.storefrontApiVersion!==C&&console.warn(`This version of Hydrogen-UI is built for Shopify's Storefront API version ${C}, but it looks like you're using version ${r.storefrontApiVersion}. There may be issues or bugs if you use a mismatched version of Hydrogen-UI and the Storefront API.`);const t=g.useMemo(()=>({...r,storeDomain:r.storeDomain.replace(/^https?:\/\//,"")}),[r]);return h.default.createElement(I.Provider,{value:t,__self:this,__source:{fileName:fe,lineNumber:49,columnNumber:5}},e)}function L(){const e=g.useContext(I);if(!e)throw new Error("'useShop()' must be a descendent of <ShopifyProvider/>");return e}var w="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/Metafield.tsx";function de(e){var n,l,c,d,f,m,y,N,v;const{data:r,as:t,...i}=e,{locale:a}=L(),o=g.useMemo(()=>B(r),[r]);if(!o)return console.warn("<Metafield/>: nothing was passed to the data prop 'data'. Rendering 'null'"),null;if(o.value===null||o.value===void 0){const s=`<Metafield/>: No metafield value for metafield ${(n=o.id)!=null?n:o.key}. Rendering 'null'`;return console.warn(s),null}switch(o.type){case"date":{const s=t!=null?t:"time";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:68,columnNumber:9}},o.value.toLocaleDateString(a))}case"date_time":{const s=t!=null?t:"time";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:76,columnNumber:9}},o.value.toLocaleString(a))}case"weight":case"dimension":case"volume":{const s=t!=null?t:"span";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:86,columnNumber:9}},_e(o.value,a))}case"rating":{const s=t!=null?t:"span";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:94,columnNumber:9}},o.value.value)}case"single_line_text_field":{const s=t!=null?t:"span";return h.default.createElement(s,{...i,dangerouslySetInnerHTML:{__html:o.value},__self:this,__source:{fileName:w,lineNumber:102,columnNumber:9}})}case"multi_line_text_field":{const s=t!=null?t:"div";return h.default.createElement(s,{...i,dangerouslySetInnerHTML:{__html:o.value.split(`
+`).join("<br/>")},__self:this,__source:{fileName:w,lineNumber:111,columnNumber:9}})}case"url":{const s=new URL(o.value);return h.default.createElement("a",{href:s.href.replace(s.protocol,""),...i,__self:this,__source:{fileName:w,lineNumber:122,columnNumber:9}},o.value)}case"json":{const s=t!=null?t:"span";return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:133,columnNumber:9}},JSON.stringify(o.value))}case"product_reference":case"variant_reference":case"page_reference":{const s=t!=null?t:"span",_=o.reference;return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:144,columnNumber:9}},(c=(l=_==null?void 0:_.title)!=null?l:_==null?void 0:_.id)!=null?c:"")}case"list.single_line_text_field":{const s=t!=null?t:"ul",_=o.references?E(o.references):[];return h.default.createElement(s,{...i,__self:this,__source:{fileName:w,lineNumber:155,columnNumber:9}},_.map((S,p)=>h.default.createElement("li",{key:`${S!=null?S:""}-${p}`,__self:this,__source:{fileName:w,lineNumber:159,columnNumber:13}},S)))}case"file_reference":if(((d=o.reference)==null?void 0:d.__typename)==="MediaImage"){const s=o.reference;return s.image?h.default.createElement(P,{data:s.image,...i,__self:this,__source:{fileName:w,lineNumber:168,columnNumber:11}}):null}else if(((f=o.reference)==null?void 0:f.__typename)==="GenericFile"){const s=o.reference;return s.previewImage?h.default.createElement("a",{href:(y=(m=o.reference)==null?void 0:m.url)!=null?y:"",...i,__self:this,__source:{fileName:w,lineNumber:173,columnNumber:11}},h.default.createElement(P,{data:s.previewImage,__self:this,__source:{fileName:w,lineNumber:174,columnNumber:13}})):null}else if(((N=o.reference)==null?void 0:N.__typename)==="Video"){const s=o.reference;return h.default.createElement(x,{...i,data:s,__self:this,__source:{fileName:w,lineNumber:179,columnNumber:16}})}}const u=t!=null?t:"span";return h.default.createElement(u,{...i,__self:this,__source:{fileName:w,lineNumber:186,columnNumber:5}},(v=o.value)==null?void 0:v.toString())}function B(e){return e?{...e,value:H(e)}:null}function H(e){if(!e)return null;if(e.value===null||e.value===void 0)return e.value;switch(e.type){case"boolean":return e.value==="true";case"number_integer":return parseInt(e.value);case"number_decimal":return parseFloat(e.value);case"date":case"date_time":return new Date(e.value);case"json":case"weight":case"dimension":case"volume":case"rating":return he(e.value);case"color":case"single_line_text_field":case"multi_line_text_field":case"product_reference":case"page_reference":case"variant_reference":case"file_reference":case"url":default:return e.value}}function he(e){return String(e).includes("__proto__")?JSON.parse(e,(r,t)=>{if(r!=="__proto__")return t}):JSON.parse(e)}const ge={mm:"millimeter",cm:"centimeter",m:"meter",in:"inch",ft:"foot",yd:"yard",ml:"milliliter",l:"liter",us_fl_oz:"fluid-ounce",us_gal:"gallon",kg:"kilogram",g:"gram",lb:"pound",oz:"ounce"};function _e(e,r="en-us",t={}){let i={value:e.value,unit:ge[e.unit]};return i.unit==null&&(i=ye(e.value,e.unit)),new Intl.NumberFormat(r,{...t,unit:i.unit,style:"unit"}).format(i.value)}function ye(e,r){switch(r){case"cl":return{value:e/1e3,unit:"liter"};case"m3":return{value:e*1e3,unit:"liter"};case"us_pt":return{value:e*.125,unit:"gallon"};case"us_qt":return{value:e*.5,unit:"gallon"};case"us_oz":return{value:e/128,unit:"gallon"};case"imp_pt":return{value:e/6.661,unit:"gallon"};case"imp_qt":return{value:e/3.331,unit:"gallon"};case"imp_gal":return{value:e/1.201,unit:"gallon"};case"imp_fl_oz":return{value:e*.96076,unit:"fluid-ounce"};default:throw new Error(`Unit not supported: ${r}`)}}function z(e){const{locale:r}=L();if(!r)throw new Error("useMoney(): Unable to get 'locale' from 'useShop()', which means that 'locale' was not passed to '<ShopifyProvider/>'. 'locale' is required for 'useMoney()' to work");const t=parseFloat(e.amount),i=g.useMemo(()=>({style:"currency",currency:e.currencyCode}),[e.currencyCode]),a=k(r,i),o=k(r,{...i,currencyDisplay:"name"}),u=k(r,{...i,currencyDisplay:"narrowSymbol"}),n=k(r,{...i,minimumFractionDigits:0,maximumFractionDigits:0}),l=k(r),c=k(r,{minimumFractionDigits:0,maximumFractionDigits:0}),d=m=>m.type==="currency",f=g.useMemo(()=>({original:()=>e,currencyCode:()=>e.currencyCode,localizedString:()=>a().format(t),parts:()=>a().formatToParts(t),withoutTrailingZeros:()=>t%1===0?n().format(t):a().format(t),withoutTrailingZerosAndCurrency:()=>t%1===0?c().format(t):l().format(t),currencyName:()=>{var m,y;return(y=(m=o().formatToParts(t).find(d))==null?void 0:m.value)!=null?y:e.currencyCode},currencySymbol:()=>{var m,y;return(y=(m=a().formatToParts(t).find(d))==null?void 0:m.value)!=null?y:e.currencyCode},currencyNarrowSymbol:()=>{var m,y;return(y=(m=u().formatToParts(t).find(d))==null?void 0:m.value)!=null?y:""},amount:()=>a().formatToParts(t).filter(m=>["decimal","fraction","group","integer","literal"].includes(m.type)).map(m=>m.value).join("")}),[e,t,o,a,u,l,n,c]);return g.useMemo(()=>new Proxy(f,{get:(m,y)=>{var N;return(N=Reflect.get(m,y))==null?void 0:N.call(null)}}),[f])}function k(e,r){return g.useMemo(()=>{let t;return()=>t!=null?t:t=new Intl.NumberFormat(e,r)},[e,r])}var be="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/Money.tsx";function V({data:e,as:r,withoutCurrency:t,withoutTrailingZeros:i,measurement:a,measurementSeparator:o="/",...u}){if(!Se(e))throw new Error("<Money/> needs a valid 'data' prop that has 'amount' and 'currencyCode'");const n=z(e),l=r!=null?r:"div";let c=n.localizedString;return(t||i)&&(t&&!i?c=n.amount:!t&&i?c=n.withoutTrailingZeros:c=n.withoutTrailingZerosAndCurrency),h.default.createElement(l,{...u,__self:this,__source:{fileName:be,lineNumber:65,columnNumber:5}},c,a&&a.referenceUnit&&h.default.createElement(h.default.Fragment,null,o,a.referenceUnit))}function Se(e){return typeof e.amount=="string"&&!!e.amount&&typeof e.currencyCode=="string"&&!!e.currencyCode}var G="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ProductPrice.tsx";function Ne(e){var c,d,f,m,y,N,v,s;const{priceType:r="regular",variantId:t,valueType:i="min",data:a,...o}=e;if(a==null)throw new Error("<ProductPrice/> requires a product as the 'data' prop");let u,n;const l=t&&(d=E((c=a==null?void 0:a.variants)!=null?c:{}).find(_=>(_==null?void 0:_.id)===t))!=null?d:null;if(r==="compareAt")if(t&&l){if(((f=l.compareAtPriceV2)==null?void 0:f.amount)===((m=l.priceV2)==null?void 0:m.amount))return null;u=l.compareAtPriceV2}else i==="max"?u=(y=a==null?void 0:a.compareAtPriceRange)==null?void 0:y.maxVariantPrice:u=(N=a==null?void 0:a.compareAtPriceRange)==null?void 0:N.minVariantPrice;else t&&l?(u=l.priceV2,i==="unit"&&(u=l.unitPrice,n=l.unitPriceMeasurement)):i==="max"?u=(v=a.priceRange)==null?void 0:v.maxVariantPrice:u=(s=a.priceRange)==null?void 0:s.minVariantPrice;return u?n?h.default.createElement(V,{...o,data:u,measurement:n,__self:this,__source:{fileName:G,lineNumber:81,columnNumber:7}}):h.default.createElement(V,{...o,data:u,__self:this,__source:{fileName:G,lineNumber:85,columnNumber:10}}):null}var we="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ProductProvider.tsx";const O=g.createContext(null);function pe({children:e,data:r,initialVariantId:t}){const i=g.useMemo(()=>{var s;return E((s=r.variants)!=null?s:{})},[r.variants]);if(!ke(i))throw new Error("<ProductProvider/> requires 'product.variants.nodes' or 'product.variants.edges'");const a=g.useMemo(()=>Ee(i),[i]),[o,u]=g.useState(()=>J(t,i)),[n,l]=g.useState(()=>K(o));g.useEffect(()=>{const s=J(t,i);u(s),l(K(s))},[t,i]);const c=g.useCallback((s,_)=>{l(S=>{const p={...S,[s]:_};return u(X(i,p)),p})},[l,i]),d=g.useCallback((s,_)=>{var p;const S=X(i,{...n,[s]:_});return(p=S==null?void 0:S.availableForSale)!=null?p:!0},[n,i]),f=g.useMemo(()=>{var s;return E((s=r.sellingPlanGroups)!=null?s:{}).map(_=>{var S;return{..._,sellingPlans:E((S=_==null?void 0:_.sellingPlans)!=null?S:{})}})},[r.sellingPlanGroups]),[m,y]=g.useState(void 0),N=g.useMemo(()=>{var s,_;if(!(!o||!m)){if(!((s=o.sellingPlanAllocations)!=null&&s.nodes)&&!((_=o.sellingPlanAllocations)!=null&&_.edges))throw new Error("<ProductProvider/>: You must include 'sellingPlanAllocations.nodes' or 'sellingPlanAllocations.edges' in your variants in order to calculate selectedSellingPlanAllocation");return E(o.sellingPlanAllocations).find(S=>{var p;return((p=S==null?void 0:S.sellingPlan)==null?void 0:p.id)===m.id})}},[o,m]),v=g.useMemo(()=>({variants:i,variantsConnection:r.variants,options:a,selectedVariant:o,setSelectedVariant:u,selectedOptions:n,setSelectedOption:c,setSelectedOptions:l,isOptionInStock:d,selectedSellingPlan:m,setSelectedSellingPlan:y,selectedSellingPlanAllocation:N,sellingPlanGroups:f,sellingPlanGroupsConnection:r.sellingPlanGroups}),[d,a,r.sellingPlanGroups,r.variants,n,m,N,o,f,c,i]);return h.default.createElement(O.Provider,{value:v,__self:this,__source:{fileName:we,lineNumber:201,columnNumber:5}},e)}function ve(){const e=g.useContext(O);if(!e)throw new Error("'useProduct' must be a child of <ProductProvider />");return e}function X(e,r){var t,i;if(!(!e.length||((i=(t=e==null?void 0:e[0])==null?void 0:t.selectedOptions)==null?void 0:i.length)!==Object.keys(r).length))return e==null?void 0:e.find(a=>Object.entries(r).every(([o,u])=>{var n;return(n=a==null?void 0:a.selectedOptions)==null?void 0:n.some(l=>(l==null?void 0:l.name)===o&&(l==null?void 0:l.value)===u)}))}function Ee(e){const r=e.reduce((t,i)=>{var a;if(!i.selectedOptions)throw new Error("'getOptions' requires 'variant.selectedOptions'");return(a=i==null?void 0:i.selectedOptions)==null||a.forEach(o=>{var u,n,l,c;t[(u=o==null?void 0:o.name)!=null?u:""]=t[(n=o==null?void 0:o.name)!=null?n:""]||new Set,t[(l=o==null?void 0:o.name)!=null?l:""].add((c=o==null?void 0:o.value)!=null?c:"")}),t},{});return Object.keys(r).map(t=>({name:t,values:Array.from(r[t])}))}function J(e,r){if(e){const t=r.find(i=>(i==null?void 0:i.id)===e);return t||console.warn("<ProductProvider/> received a 'initialVariantId' prop, but could not actually find a variant with that ID"),t}if(e===null)return null;if(e===void 0)return r.find(t=>t==null?void 0:t.availableForSale)||r[0]}function K(e){return e!=null&&e.selectedOptions?e.selectedOptions.reduce((r,t)=>{var i,a;return r[(i=t==null?void 0:t.name)!=null?i:""]=(a=t==null?void 0:t.value)!=null?a:"",r},{}):{}}function ke(e){return!(!e||!Array.isArray(e))}var Y="/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ShopPayButton.tsx";const Me="https://cdn.shopify.com/shopifycloud/shop-js/v1.0/client.js";function Ce({variantIds:e,className:r,variantIdsAndQuantities:t,width:i}){const{storeDomain:a}=L(),o=q(Me);let u;if(e&&t)throw new Error(Te);if(e)u=e.reduce((l,c)=>{const d=Z(c);return d&&l.push(d),l},[]);else if(t)u=t.reduce((l,c)=>{var f;const d=Z(c==null?void 0:c.id);return d&&l.push(`${d}:${(f=c==null?void 0:c.quantity)!=null?f:1}`),l},[]);else throw new Error(Pe);const n=i?{"--shop-pay-button-width":i}:void 0;return h.default.createElement("div",{className:r,style:n,__self:this,__source:{fileName:Y,lineNumber:90,columnNumber:5}},o==="done"&&h.default.createElement("shop-pay-button",{"store-url":`https://${a}`,variants:u.join(","),__self:this,__source:{fileName:Y,lineNumber:92,columnNumber:9}}))}function Z(e){if(!!e)return e.split("/").pop()}const Pe='You must pass in either "variantIds" or "variantIdsAndQuantities" to ShopPayButton',Te="You must provide either a variantIds or variantIdsAndQuantities prop, but not both in the ShopPayButton component";function Le({storeDomain:e,privateStorefrontToken:r,publicStorefrontToken:t,storefrontApiVersion:i,contentType:a}){return i!==C&&console.warn(`StorefrontClient: The Storefront API version that you're using is different than the version this build of Hydrogen-UI is targeting. You may run into unexpected errors if these versions don't match. Received verion: "${i}"; expected version ${C}`),{getStorefrontApiUrl(o){var u,n;return`https://${(u=o==null?void 0:o.storeDomain)!=null?u:e}.myshopify.com/api/${(n=o==null?void 0:o.storefrontApiVersion)!=null?n:i}/graphql.json`},getPrivateTokenHeaders(o){var n,l,c;if(!r&&!(o!=null&&o.privateStorefrontToken))throw new Error("StorefrontClient: You did not pass in a 'privateStorefrontToken' while using 'getPrivateTokenHeaders()'");return{"content-type":((n=o==null?void 0:o.contentType)!=null?n:a)==="graphql"?"application/graphql":"application/json","X-SDK-Variant":"hydrogen-ui","X-SDK-Variant-Source":"react","X-SDK-Version":i,"Shopify-Storefront-Private-Token":(c=(l=o==null?void 0:o.privateStorefrontToken)!=null?l:r)!=null?c:"",...o!=null&&o.buyerIp?{"Shopify-Storefront-Buyer-IP":o.buyerIp}:{}}},getPublicTokenHeaders(o){var n,l,c;if(!t&&!(o!=null&&o.publicStorefrontToken))throw new Error("StorefrontClient: You did not pass in a 'publicStorefrontToken' while using 'getPublicTokenHeaders()'");return{"content-type":((n=o==null?void 0:o.contentType)!=null?n:a)==="graphql"?"application/graphql":"application/json","X-SDK-Variant":"hydrogen-ui","X-SDK-Variant-Source":"react","X-SDK-Version":i,"X-Shopify-Storefront-Access-Token":(c=(l=o==null?void 0:o.publicStorefrontToken)!=null?l:t)!=null?c:""}}}}b.ExternalVideo=F,b.Image=P,b.MediaFile=se,b.Metafield=de,b.ModelViewer=W,b.Money=V,b.ProductPrice=Ne,b.ProductProvider=pe,b.ShopPayButton=Ce,b.ShopifyProvider=me,b.Video=x,b.createStorefrontClient=Le,b.flattenConnection=E,b.parseMetafield=B,b.parseMetafieldValue=H,b.useMoney=z,b.useProduct=ve,b.useShop=L,Object.defineProperties(b,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
 //# sourceMappingURL=hydrogen-react.prod.js.map