@dropins/storefront-pdp 1.3.1 → 1.4.0-alpha001

package/containers/ProductPrice.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProductPrice.js","sources":["/@dropins/storefront-pdp/src/components/Price/Price.tsx","/@dropins/storefront-pdp/src/containers/ProductPrice/ProductPrice.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */import { FunctionComponent, VNode } from 'preact';\n\n \nimport { HTMLAttributes } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport '@/pdp/components/Price/Price.css';\nimport { useText } from '@adobe-commerce/elsie/i18n';\n\nexport interface PriceProps extends HTMLAttributes<HTMLDivElement> {\n  price?: VNode;\n  specialPrice?: VNode;\n}\n\nexport const Price: FunctionComponent<PriceProps> = ({\n  className,\n  price,\n  specialPrice,\n  children,\n  ...props\n}) => {\n  const RegularPriceLabel = useText('PDP.Product.RegularPrice.label').label;\n  const SpecialPriceLabel = useText('PDP.Product.SpecialPrice.label').label;\n\n  return (\n    <div {...props} className={classes(['pdp-price', className])}>\n      {specialPrice && (\n        <VComponent\n          node={specialPrice}\n          className={classes([\n            'pdp-price__amount-special',\n            'pdp-price__amount',\n          ])}\n          aria-label={SpecialPriceLabel}\n          role=\"text\"\n        />\n      )}\n      {price && (\n        <VComponent\n          node={price}\n          className={classes([\n            'pdp-price__amount-regular',\n            'pdp-price__amount--grey',\n          ])}\n          aria-label={RegularPriceLabel}\n          role=\"text\"\n        />\n      )}\n    </div>\n  );\n};\n","/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { HTMLAttributes, useEffect, useState } from 'preact/compat';\nimport { Container, toLanguageTag } from '@adobe-commerce/elsie/lib';\nimport { Price, PriceRange } from '@/pdp/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { ProductModel } from '@/pdp/data/models';\nimport { config, getFetchedProductData } from '@/pdp/api';\n\nexport interface ProductPriceProps extends HTMLAttributes<HTMLDivElement> {\n  scope?: string;\n}\n\nexport const ProductPrice: Container<\n  ProductPriceProps,\n  ProductModel | null\n> = ({ initialData = null, scope, children, ...props }) => {\n  const { defaultLocale = 'en-US' } = config.getConfig();\n\n  const [data, setData] = useState<ProductModel | null>(initialData);\n\n  const [locale, setLocale] = useState<string>(defaultLocale);\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n    const localeEvent = events.on('locale', setLocale);\n\n    return () => {\n      dataEvent?.off();\n      localeEvent?.off();\n    };\n  }, [scope]);\n\n  if (!data || !data.prices) return null;\n\n  return (\n    <Price\n      {...props}\n      specialPrice={\n        data.prices?.visible ? (\n          <PriceRange {...data.prices?.final} locale={toLanguageTag(locale)} />\n        ) : undefined\n      }\n      price={\n        data.prices?.visible &&\n        data.prices?.regular &&\n        data.prices?.final.amount !== data.prices?.regular.amount ? (\n          <PriceRange\n            {...data.prices?.regular}\n            locale={toLanguageTag(locale)}\n          />\n        ) : undefined\n      }\n    />\n  );\n};\n\nProductPrice.getInitialData = getFetchedProductData;\n"],"names":["Price","className","price","specialPrice","children","props","RegularPriceLabel","useText","SpecialPriceLabel","jsxs","classes","jsx","VComponent","ProductPrice","initialData","scope","defaultLocale","config","data","setData","useState","locale","setLocale","useEffect","dataEvent","events","localeEvent","_a","PriceRange","_b","toLanguageTag","_c","_d","_e","_f","_g","getFetchedProductData"],"mappings":"yoBA2BO,MAAMA,EAAuC,CAAC,CACnD,UAAAC,EACA,MAAAC,EACA,aAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAAM,CACE,MAAAC,EAAoBC,EAAQ,gCAAgC,EAAE,MAC9DC,EAAoBD,EAAQ,gCAAgC,EAAE,MAGlE,OAAAE,EAAC,MAAK,CAAA,GAAGJ,EAAO,UAAWK,EAAQ,CAAC,YAAaT,CAAS,CAAC,EACxD,SAAA,CACCE,GAAAQ,EAACC,EAAA,CACC,KAAMT,EACN,UAAWO,EAAQ,CACjB,4BACA,mBAAA,CACD,EACD,aAAYF,EACZ,KAAK,MAAA,CACP,EAEDN,GACCS,EAACC,EAAA,CACC,KAAMV,EACN,UAAWQ,EAAQ,CACjB,4BACA,yBAAA,CACD,EACD,aAAYJ,EACZ,KAAK,MAAA,CAAA,CACP,EAEJ,CAEJ,ECpCaO,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,MAAAC,EAAO,SAAAX,EAAU,GAAGC,KAAY,mBACzD,KAAM,CAAE,cAAAW,EAAgB,SAAYC,EAAO,UAAU,EAE/C,CAACC,EAAMC,CAAO,EAAIC,EAA8BN,CAAW,EAE3D,CAACO,EAAQC,CAAS,EAAIF,EAAiBJ,CAAa,EAY1D,OAVAO,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYN,EAAS,CAAE,MAAAJ,EAAO,EACpDW,EAAcD,EAAO,GAAG,SAAUH,CAAS,EAEjD,MAAO,IAAM,CACXE,GAAA,MAAAA,EAAW,MACXE,GAAA,MAAAA,EAAa,KACf,CAAA,EACC,CAACX,CAAK,CAAC,EAEN,CAACG,GAAQ,CAACA,EAAK,OAAe,KAGhCP,EAACX,EAAA,CACE,GAAGK,EACJ,cACEsB,EAAAT,EAAK,SAAL,MAAAS,EAAa,UACVC,EAAY,CAAA,IAAGC,EAAAX,EAAK,SAAL,YAAAW,EAAa,MAAO,OAAQC,EAAcT,CAAM,CAAG,CAAA,EACjE,OAEN,OACEU,EAAAb,EAAK,SAAL,MAAAa,EAAa,WACbC,EAAAd,EAAK,SAAL,MAAAc,EAAa,YACbC,EAAAf,EAAK,SAAL,YAAAe,EAAa,MAAM,YAAWC,EAAAhB,EAAK,SAAL,YAAAgB,EAAa,QAAQ,QACjDvB,EAACiB,EAAA,CACE,IAAGO,EAAAjB,EAAK,SAAL,YAAAiB,EAAa,QACjB,OAAQL,EAAcT,CAAM,CAAA,CAAA,EAE5B,MAAA,CAER,CAEJ,EAEAR,EAAa,eAAiBuB"}
+{"version":3,"file":"ProductPrice.js","sources":["/@dropins/storefront-pdp/src/components/Price/Price.tsx","/@dropins/storefront-pdp/src/containers/ProductPrice/ProductPrice.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */import { FunctionComponent, VNode } from 'preact';\n\n \nimport { HTMLAttributes } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport '@/pdp/components/Price/Price.css';\nimport { useText } from '@adobe-commerce/elsie/i18n';\n\nexport interface PriceProps extends HTMLAttributes<HTMLDivElement> {\n  price?: VNode;\n  specialPrice?: VNode;\n}\n\nexport const Price: FunctionComponent<PriceProps> = ({\n  className,\n  price,\n  specialPrice,\n  children,\n  ...props\n}) => {\n  const RegularPriceLabel = useText('PDP.Product.RegularPrice.label').label;\n  const SpecialPriceLabel = useText('PDP.Product.SpecialPrice.label').label;\n\n  return (\n    <div {...props} className={classes(['pdp-price', className])}>\n      {specialPrice && (\n        <VComponent\n          node={specialPrice}\n          className={classes([\n            'pdp-price__amount-special',\n            'pdp-price__amount',\n          ])}\n          aria-label={SpecialPriceLabel}\n          role=\"text\"\n        />\n      )}\n      {price && (\n        <VComponent\n          node={price}\n          className={classes([\n            'pdp-price__amount-regular',\n            'pdp-price__amount--grey',\n          ])}\n          aria-label={RegularPriceLabel}\n          role=\"text\"\n        />\n      )}\n    </div>\n  );\n};\n","/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { HTMLAttributes, useEffect, useState } from 'preact/compat';\nimport { Container, toLanguageTag } from '@adobe-commerce/elsie/lib';\nimport { Price, PriceRange } from '@/pdp/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { ProductModel } from '@/pdp/data/models';\nimport { config, getFetchedProductData } from '@/pdp/api';\n\nexport interface ProductPriceProps extends HTMLAttributes<HTMLDivElement> {\n  scope?: string;\n}\n\nexport const ProductPrice: Container<\n  ProductPriceProps,\n  ProductModel | null\n> = ({ initialData = null, scope, children, ...props }) => {\n  const { defaultLocale = 'en-US' } = config.getConfig();\n\n  const [data, setData] = useState<ProductModel | null>(initialData);\n\n  const [locale, setLocale] = useState<string>(defaultLocale);\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n    const localeEvent = events.on('locale', setLocale);\n\n    return () => {\n      dataEvent?.off();\n      localeEvent?.off();\n    };\n  }, [scope]);\n\n  if (!data || !data.prices) return null;\n\n  return (\n    <Price\n      {...props}\n      specialPrice={\n        data.prices?.visible ? (\n          <PriceRange {...data.prices?.final} locale={toLanguageTag(locale)} />\n        ) : undefined\n      }\n      price={\n        data.prices?.visible &&\n        data.prices?.regular &&\n        data.prices?.final.amount !== data.prices?.regular.amount ? (\n          <PriceRange\n            {...data.prices?.regular}\n            locale={toLanguageTag(locale)}\n          />\n        ) : undefined\n      }\n    />\n  );\n};\n\nProductPrice.getInitialData = getFetchedProductData;\n"],"names":["Price","className","price","specialPrice","children","props","RegularPriceLabel","useText","SpecialPriceLabel","jsxs","classes","jsx","VComponent","ProductPrice","initialData","scope","defaultLocale","config","data","setData","useState","locale","setLocale","useEffect","dataEvent","events","localeEvent","_a","PriceRange","_b","toLanguageTag","_c","_d","_e","_f","_g","getFetchedProductData"],"mappings":"2vBA2BO,MAAMA,EAAuC,CAAC,CACnD,UAAAC,EACA,MAAAC,EACA,aAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAAM,CACE,MAAAC,EAAoBC,EAAQ,gCAAgC,EAAE,MAC9DC,EAAoBD,EAAQ,gCAAgC,EAAE,MAGlE,OAAAE,EAAC,MAAK,CAAA,GAAGJ,EAAO,UAAWK,EAAQ,CAAC,YAAaT,CAAS,CAAC,EACxD,SAAA,CACCE,GAAAQ,EAACC,EAAA,CACC,KAAMT,EACN,UAAWO,EAAQ,CACjB,4BACA,mBAAA,CACD,EACD,aAAYF,EACZ,KAAK,MAAA,CACP,EAEDN,GACCS,EAACC,EAAA,CACC,KAAMV,EACN,UAAWQ,EAAQ,CACjB,4BACA,yBAAA,CACD,EACD,aAAYJ,EACZ,KAAK,MAAA,CAAA,CACP,EAEJ,CAEJ,ECpCaO,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,MAAAC,EAAO,SAAAX,EAAU,GAAGC,KAAY,mBACzD,KAAM,CAAE,cAAAW,EAAgB,SAAYC,EAAO,UAAU,EAE/C,CAACC,EAAMC,CAAO,EAAIC,EAA8BN,CAAW,EAE3D,CAACO,EAAQC,CAAS,EAAIF,EAAiBJ,CAAa,EAY1D,OAVAO,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYN,EAAS,CAAE,MAAAJ,EAAO,EACpDW,EAAcD,EAAO,GAAG,SAAUH,CAAS,EAEjD,MAAO,IAAM,CACXE,GAAA,MAAAA,EAAW,MACXE,GAAA,MAAAA,EAAa,KACf,CAAA,EACC,CAACX,CAAK,CAAC,EAEN,CAACG,GAAQ,CAACA,EAAK,OAAe,KAGhCP,EAACX,EAAA,CACE,GAAGK,EACJ,cACEsB,EAAAT,EAAK,SAAL,MAAAS,EAAa,UACVC,EAAY,CAAA,IAAGC,EAAAX,EAAK,SAAL,YAAAW,EAAa,MAAO,OAAQC,EAAcT,CAAM,CAAG,CAAA,EACjE,OAEN,OACEU,EAAAb,EAAK,SAAL,MAAAa,EAAa,WACbC,EAAAd,EAAK,SAAL,MAAAc,EAAa,YACbC,EAAAf,EAAK,SAAL,YAAAe,EAAa,MAAM,YAAWC,EAAAhB,EAAK,SAAL,YAAAgB,EAAa,QAAQ,QACjDvB,EAACiB,EAAA,CACE,IAAGO,EAAAjB,EAAK,SAAL,YAAAiB,EAAa,QACjB,OAAQL,EAAcT,CAAM,CAAA,CAAA,EAE5B,MAAA,CAER,CAEJ,EAEAR,EAAa,eAAiBuB"}

package/containers/ProductQuantity.js

@@ -1,4 +1,4 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsx as P}from"@dropins/tools/preact-jsx-runtime.js";import{useState as i,useEffect as y}from"@dropins/tools/preact-compat.js";import{classes as I}from"@dropins/tools/lib.js";import{Incrementer as b}from"@dropins/tools/components.js";import{events as m}from"@dropins/tools/event-bus.js";import{n as q,j as D,c as h,o as x}from"../chunks/isProductConfigurationValid.js";import{g as C}from"../chunks/getFetchedProductData.js";import{useText as S}from"@dropins/tools/i18n.js";import"../fragments.js";import"@dropins/tools/fetch-graphql.js";const U=({initialData:u=null,scope:a,onValue:e,children:j,...o})=>{const l=S("PDP.Product.Incrementer.label").label,[c,f]=i(u),[s,d]=i(()=>q(1));y(()=>{const r=m.on("pdp/data",f,{scope:a}),t=m.on("pdp/values",({quantity:n})=>{d(n)},{eager:!0,scope:a});return()=>{r==null||r.off(),t==null||t.off()}},[a]);const p=r=>{const t=parseInt(r,10);D(g=>({...g,quantity:t}),{scope:a});const{persistURLParams:n}=h.getConfig()??{};n&&x({quantity:t}),e==null||e(t)};return c?P(b,{name:"quantity",defaultValue:String(s),value:String(s),min:1,"aria-label":l,onValue:p,...o,className:I(["pdp-quantity",o.className])},"quantity"):null};U.getInitialData=C;export{U as ProductQuantity,U as default};
+import{jsx as P}from"@dropins/tools/preact-jsx-runtime.js";import{useState as i,useEffect as y}from"@dropins/tools/preact-compat.js";import{classes as I}from"@dropins/tools/lib.js";import{Incrementer as b}from"@dropins/tools/components.js";import{events as m}from"@dropins/tools/event-bus.js";import{s as q}from"../chunks/isProductConfigurationValid.js";import{g as D}from"../chunks/getFetchedProductData.js";import{k as h,c as x,l as C}from"../chunks/fetchProductData.js";import{useText as S}from"@dropins/tools/i18n.js";import"../fragments.js";import"@dropins/tools/fetch-graphql.js";const U=({initialData:u=null,scope:a,onValue:e,children:F,...o})=>{const l=S("PDP.Product.Incrementer.label").label,[c,f]=i(u),[s,d]=i(()=>h(1));y(()=>{const r=m.on("pdp/data",f,{scope:a}),t=m.on("pdp/values",({quantity:n})=>{d(n)},{eager:!0,scope:a});return()=>{r==null||r.off(),t==null||t.off()}},[a]);const p=r=>{const t=parseInt(r,10);q(g=>({...g,quantity:t}),{scope:a});const{persistURLParams:n}=x.getConfig()??{};n&&C({quantity:t}),e==null||e(t)};return c?P(b,{name:"quantity",defaultValue:String(s),value:String(s),min:1,"aria-label":l,onValue:p,...o,className:I(["pdp-quantity",o.className])},"quantity"):null};U.getInitialData=D;export{U as ProductQuantity,U as default};
 //# sourceMappingURL=ProductQuantity.js.map

package/containers/ProductQuantity.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProductQuantity.js","sources":["/@dropins/storefront-pdp/src/containers/ProductQuantity/ProductQuantity.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { HTMLAttributes, useEffect, useState } from 'preact/compat';\nimport { classes, Container } from '@adobe-commerce/elsie/lib';\nimport { Incrementer } from '@adobe-commerce/elsie/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { ProductModel } from '@/pdp/data/models';\nimport {\n  setProductConfigurationValues,\n  getFetchedProductData,\n} from '@/pdp/api';\nimport {\n  setUrlParams,\n  getValidatedQuantityFromUrl,\n} from '@/pdp/lib/url-params';\nimport { config } from '@/pdp/api/initialize';\n\nexport interface ProductQuantityProps extends HTMLAttributes<HTMLDivElement> {\n  scope?: string;\n  onValue?: (quantity: number) => void;\n}\n\nexport const ProductQuantity: Container<\n  ProductQuantityProps,\n  ProductModel | null\n> = ({ initialData = null, scope, onValue, children, ...props }) => {\n  const IncrementerLabel = useText('PDP.Product.Incrementer.label').label;\n\n  const [data, setData] = useState<ProductModel | null>(initialData);\n\n  const [current, setCurrent] = useState(() => getValidatedQuantityFromUrl(1)); // Default quantity to 1\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n\n    const valuesEvent = events.on(\n      'pdp/values',\n      ({ quantity }) => {\n        setCurrent(quantity);\n      },\n      { eager: true, scope }\n    );\n\n    return () => {\n      dataEvent?.off();\n      valuesEvent?.off();\n    };\n  }, [scope]);\n\n  const handleOnValue = (value: string) => {\n    const quantity = parseInt(value, 10);\n    setProductConfigurationValues((prev) => ({ ...prev, quantity }), { scope });\n\n    // Update URL parameters if persistURLParams is enabled\n    const { persistURLParams } = config.getConfig() ?? {};\n    if (persistURLParams) {\n      setUrlParams({ quantity });\n    }\n\n    onValue?.(quantity);\n  };\n\n  if (!data) return null;\n\n  return (\n    <Incrementer\n      key=\"quantity\"\n      name=\"quantity\"\n      defaultValue={String(current)}\n      value={String(current)}\n      min={1}\n      aria-label={IncrementerLabel}\n      onValue={handleOnValue}\n      {...props}\n      className={classes(['pdp-quantity', props.className])}\n    />\n  );\n};\n\nProductQuantity.getInitialData = getFetchedProductData;\n"],"names":["ProductQuantity","initialData","scope","onValue","children","props","IncrementerLabel","useText","data","setData","useState","current","setCurrent","getValidatedQuantityFromUrl","useEffect","dataEvent","events","valuesEvent","quantity","handleOnValue","value","setProductConfigurationValues","prev","persistURLParams","config","setUrlParams","jsx","Incrementer","classes","getFetchedProductData"],"mappings":"+hBAqCa,MAAAA,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,MAAAC,EAAO,QAAAC,EAAS,SAAAC,EAAU,GAAGC,KAAY,CAC5D,MAAAC,EAAmBC,EAAQ,+BAA+B,EAAE,MAE5D,CAACC,EAAMC,CAAO,EAAIC,EAA8BT,CAAW,EAE3D,CAACU,EAASC,CAAU,EAAIF,EAAS,IAAMG,EAA4B,CAAC,CAAC,EAE3EC,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYP,EAAS,CAAE,MAAAP,EAAO,EAEpDe,EAAcD,EAAO,GACzB,aACA,CAAC,CAAE,SAAAE,CAAA,IAAe,CAChBN,EAAWM,CAAQ,CACrB,EACA,CAAE,MAAO,GAAM,MAAAhB,CAAM,CACvB,EAEA,MAAO,IAAM,CACXa,GAAA,MAAAA,EAAW,MACXE,GAAA,MAAAA,EAAa,KACf,CAAA,EACC,CAACf,CAAK,CAAC,EAEJ,MAAAiB,EAAiBC,GAAkB,CACjC,MAAAF,EAAW,SAASE,EAAO,EAAE,EACLC,EAACC,IAAU,CAAE,GAAGA,EAAM,SAAAJ,IAAa,CAAE,MAAAhB,EAAO,EAG1E,KAAM,CAAE,iBAAAqB,CAAiB,EAAIC,EAAO,aAAe,CAAC,EAChDD,GACWE,EAAA,CAAE,SAAAP,EAAU,EAG3Bf,GAAA,MAAAA,EAAUe,EACZ,EAEI,OAACV,EAGHkB,EAACC,EAAA,CAEC,KAAK,WACL,aAAc,OAAOhB,CAAO,EAC5B,MAAO,OAAOA,CAAO,EACrB,IAAK,EACL,aAAYL,EACZ,QAASa,EACR,GAAGd,EACJ,UAAWuB,EAAQ,CAAC,eAAgBvB,EAAM,SAAS,CAAC,CAAA,EARhD,UASN,EAbgB,IAepB,EAEAL,EAAgB,eAAiB6B"}
+{"version":3,"file":"ProductQuantity.js","sources":["/@dropins/storefront-pdp/src/containers/ProductQuantity/ProductQuantity.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { HTMLAttributes, useEffect, useState } from 'preact/compat';\nimport { classes, Container } from '@adobe-commerce/elsie/lib';\nimport { Incrementer } from '@adobe-commerce/elsie/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { ProductModel } from '@/pdp/data/models';\nimport {\n  setProductConfigurationValues,\n  getFetchedProductData,\n} from '@/pdp/api';\nimport {\n  setUrlParams,\n  getValidatedQuantityFromUrl,\n} from '@/pdp/lib/url-params';\nimport { config } from '@/pdp/api/initialize';\n\nexport interface ProductQuantityProps extends HTMLAttributes<HTMLDivElement> {\n  scope?: string;\n  onValue?: (quantity: number) => void;\n}\n\nexport const ProductQuantity: Container<\n  ProductQuantityProps,\n  ProductModel | null\n> = ({ initialData = null, scope, onValue, children, ...props }) => {\n  const IncrementerLabel = useText('PDP.Product.Incrementer.label').label;\n\n  const [data, setData] = useState<ProductModel | null>(initialData);\n\n  const [current, setCurrent] = useState(() => getValidatedQuantityFromUrl(1)); // Default quantity to 1\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n\n    const valuesEvent = events.on(\n      'pdp/values',\n      ({ quantity }) => {\n        setCurrent(quantity);\n      },\n      { eager: true, scope }\n    );\n\n    return () => {\n      dataEvent?.off();\n      valuesEvent?.off();\n    };\n  }, [scope]);\n\n  const handleOnValue = (value: string) => {\n    const quantity = parseInt(value, 10);\n    setProductConfigurationValues((prev) => ({ ...prev, quantity }), { scope });\n\n    // Update URL parameters if persistURLParams is enabled\n    const { persistURLParams } = config.getConfig() ?? {};\n    if (persistURLParams) {\n      setUrlParams({ quantity });\n    }\n\n    onValue?.(quantity);\n  };\n\n  if (!data) return null;\n\n  return (\n    <Incrementer\n      key=\"quantity\"\n      name=\"quantity\"\n      defaultValue={String(current)}\n      value={String(current)}\n      min={1}\n      aria-label={IncrementerLabel}\n      onValue={handleOnValue}\n      {...props}\n      className={classes(['pdp-quantity', props.className])}\n    />\n  );\n};\n\nProductQuantity.getInitialData = getFetchedProductData;\n"],"names":["ProductQuantity","initialData","scope","onValue","children","props","IncrementerLabel","useText","data","setData","useState","current","setCurrent","getValidatedQuantityFromUrl","useEffect","dataEvent","events","valuesEvent","quantity","handleOnValue","value","setProductConfigurationValues","prev","persistURLParams","config","setUrlParams","jsx","Incrementer","classes","getFetchedProductData"],"mappings":"0kBAqCa,MAAAA,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,MAAAC,EAAO,QAAAC,EAAS,SAAAC,EAAU,GAAGC,KAAY,CAC5D,MAAAC,EAAmBC,EAAQ,+BAA+B,EAAE,MAE5D,CAACC,EAAMC,CAAO,EAAIC,EAA8BT,CAAW,EAE3D,CAACU,EAASC,CAAU,EAAIF,EAAS,IAAMG,EAA4B,CAAC,CAAC,EAE3EC,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYP,EAAS,CAAE,MAAAP,EAAO,EAEpDe,EAAcD,EAAO,GACzB,aACA,CAAC,CAAE,SAAAE,CAAA,IAAe,CAChBN,EAAWM,CAAQ,CACrB,EACA,CAAE,MAAO,GAAM,MAAAhB,CAAM,CACvB,EAEA,MAAO,IAAM,CACXa,GAAA,MAAAA,EAAW,MACXE,GAAA,MAAAA,EAAa,KACf,CAAA,EACC,CAACf,CAAK,CAAC,EAEJ,MAAAiB,EAAiBC,GAAkB,CACjC,MAAAF,EAAW,SAASE,EAAO,EAAE,EACLC,EAACC,IAAU,CAAE,GAAGA,EAAM,SAAAJ,IAAa,CAAE,MAAAhB,EAAO,EAG1E,KAAM,CAAE,iBAAAqB,CAAiB,EAAIC,EAAO,aAAe,CAAC,EAChDD,GACWE,EAAA,CAAE,SAAAP,EAAU,EAG3Bf,GAAA,MAAAA,EAAUe,EACZ,EAEI,OAACV,EAGHkB,EAACC,EAAA,CAEC,KAAK,WACL,aAAc,OAAOhB,CAAO,EAC5B,MAAO,OAAOA,CAAO,EACrB,IAAK,EACL,aAAYL,EACZ,QAASa,EACR,GAAGd,EACJ,UAAWuB,EAAQ,CAAC,eAAgBvB,EAAM,SAAS,CAAC,CAAA,EARhD,UASN,EAbgB,IAepB,EAEAL,EAAgB,eAAiB6B"}

package/containers/index.d.ts

@@ -20,6 +20,7 @@ export * from './ProductQuantity';
 export * from './ProductShortDescription';
 export * from './ProductDescription';
 export * from './ProductAttributes';
+export * from './ProductGiftCardOptions';
 export * from './ProductGallery';
 export * from './ProductHeader';
 //# sourceMappingURL=index.d.ts.map

package/data/models/product-model.d.ts

@@ -59,6 +59,7 @@ interface OptionValue {
     product?: any;
 }
 interface Attribute {
+    id: string;
     label: string;
     value: string;
 }

package/data/models/values-model.d.ts

@@ -1,6 +1,29 @@
+export interface OptionValidationRule {
+    type: 'string' | 'number' | 'email';
+    required: boolean;
+    min?: number;
+    max?: number;
+    minLength?: number;
+    maxLength?: number;
+    values?: number[] | string[];
+}
+export interface Option {
+    name: string;
+    uid: string;
+    label: string;
+    validationRule: OptionValidationRule;
+}
+export interface OptionField {
+    id: string;
+    value: string;
+}
 export interface ValuesModel {
     sku: string;
     quantity: number;
     optionsUIDs?: string[];
+    enteredOptions?: Array<{
+        uid: string;
+        value: string;
+    }>;
 }
 //# sourceMappingURL=values-model.d.ts.map

package/i18n/en_US.json.d.ts

@@ -29,6 +29,38 @@ declare const _default: {
       },
       "Image": {
         "label": "{product} Image {key} of {total}"
+      },
+      "GiftCardOptions": {
+        "ChooseAmount": {
+          "label": "Choose amount"
+        },
+        "OtherAmount": {
+          "label": "Other amount"
+        },
+        "RequiredFieldError": {
+          "label": "This field is required"
+        },
+        "NumberError": {
+          "label": "Please enter a valid number"
+        },
+        "MinError": {
+          "label": "Minimum value is {min}"
+        },
+        "MaxError": {
+          "label": "Maximum value is {max}"
+        },
+        "MinLengthError": {
+          "label": "Minimum length is {min_length} characters"
+        },
+        "MaxLengthError": {
+          "label": "Maximum length is {max_length} characters"
+        },
+        "EmailError": {
+          "label": "Please enter a valid email address"
+        },
+        "InvalidValueError": {
+          "label": "Please select one of the allowed values: {values}"
+        }
       }
     },
     "Swatches": {

package/package.json

@@ -1 +1 @@
-{"name": "@dropins/storefront-pdp", "version": "1.3.1", "@dropins/tools": "~1.4.1", "license": "SEE LICENSE IN LICENSE.md"}
+{"name": "@dropins/storefront-pdp", "version": "1.4.0-alpha001", "@dropins/tools": "~1.4.1", "license": "SEE LICENSE IN LICENSE.md"}

package/render.js

@@ -1,5 +1,6 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-(function(p,t){try{if(typeof document<"u"){const r=document.createElement("style"),e=t.styleId;for(const a in t.attributes)r.setAttribute(a,t.attributes[a]);r.setAttribute("data-dropin",e),r.appendChild(document.createTextNode(p));const o=document.querySelector('style[data-dropin="sdk"]');if(o)o.after(r);else{const a=document.querySelector('link[rel="stylesheet"], style');a?a.before(r):document.head.append(r)}}}catch(r){console.error("dropin-styles (injectCodeFunction)",r)}})(".pdp-carousel{--icon-size: 32px;--icon-extra-padding: 8px;--thumb-peak: 32px;--thumbnails-col-width: 18.6%;position:relative;display:flex;flex-direction:var(--flex-carousel);align-items:center;gap:var(--gap);width:var(--width)}.pdp-carousel .dropin-button--tertiary--disabled:hover{color:var(--color-neutral-500)}.pdp-carousel--thumbnailsColumn{justify-content:flex-end;align-items:start}.pdp-carousel--thumbnailsRow{align-items:center}.pdp-carousel--arrows{padding-left:calc(var(--icon-size) + var(--icon-extra-padding));padding-right:calc(var(--icon-size) + var(--icon-extra-padding));width:calc(var(--width) - 2 * var(--icon-size) - 2 * var(--icon-extra-padding))}.pdp-carousel__button{position:absolute;top:50%;transform:translateY(-50%);padding:0}.pdp-carousel__button--prev{left:0}[dir=rtl] .pdp-carousel__button--prev{left:auto;right:0}[dir=rtl] .pdp-carousel__button--next{right:auto;left:0}.pdp-carousel__button__icon--next{transform:rotate(-90deg)}.pdp-carousel__button--next{right:0}.pdp-carousel__button__icon--prev{transform:rotate(90deg)}[dir=rtl] .pdp-carousel__button__icon--prev{transform:rotate(-90deg)}[dir=rtl] .pdp-carousel__button__icon--next{transform:rotate(90deg)}.pdp-carousel--main-image-controls.pdp-carousel--thumbnailsColumn .pdp-carousel__button--prev{left:var(--thumbnails-col-width)}.pdp-carousel--main-image-controls.pdp-carousel--thumbnailsRow .pdp-carousel__button--prev,.pdp-carousel--main-image-controls.pdp-carousel--thumbnailsRow .pdp-carousel__button--next{top:calc(var(--height) / 2)}.pdp-carousel__button--thumbnailsColumn{margin:auto;padding:0}.pdp-carousel__button--thumbnailsRow{padding:0}.pdp-carousel__button__icon--thumbnailsColumn--prev{transform:rotate(180deg)}.pdp-carousel__button__icon--thumbnailsRow--prev{transform:rotate(90deg)}[dir=rtl] .pdp-carousel__button__icon--thumbnailsRow--prev,.pdp-carousel__button__icon--thumbnailsRow--next{transform:rotate(-90deg)}[dir=rtl] .pdp-carousel__button__icon--thumbnailsRow--next{transform:rotate(90deg)}.pdp-carousel__wrapper{--peak: 0px;scroll-padding:var(--peak);width:var(--total-width);height:var(--height);display:flex;flex-wrap:nowrap;gap:var(--gap);-webkit-overflow-scrolling:touch}.pdp-carousel__wrapper--horizontal{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory}.pdp-carousel__slide{display:grid;grid-gap:var(--gap);grid-auto-columns:1fr;grid-auto-rows:100%;scroll-snap-align:end;scroll-snap-stop:always;flex-shrink:0}.pdp-carousel__slide--horizontal{grid-auto-flow:column;width:calc(100% - var(--peak))}.pdp-carousel__slide--horizontal.pdp-carousel__slide--orphan{width:calc((100% / var(--per-page) * var(--length)) - var(--peak) / var(--per-page) * var(--length) - var(--gap) / var(--per-page) * (var(--per-page) - var(--length)))}.pdp-carousel__slide *{vertical-align:middle;max-width:100%;max-height:100%;width:100%;height:100%}.pdp-carousel__slide img{object-fit:contain;width:100%;height:100%}.pdp-carousel__wrapper--peak{--peak: calc(var(--spacing-medium) + var(--gap))}.pdp-carousel__wrapper--scrollbar{--scroll-foreground: var(--color-neutral-600);--scroll-background: var(--color-neutral-400);scrollbar-color:var(--scroll-foreground) var(--scroll-background);scrollbar-width:thin}.pdp-carousel__wrapper:not(.pdp-carousel__wrapper--scrollbar){scrollbar-width:none}.pdp-carousel__wrapper:not(.pdp-carousel__wrapper--scrollbar)::-webkit-scrollbar{display:none}.pdp-carousel__wrapper--scrollbar::-webkit-scrollbar{width:4px;height:4px}.pdp-carousel__slide--hidden{opacity:0;pointer-events:none}.pdp-carousel__wrapper--scrollbar::-webkit-scrollbar-thumb{background:var(--scroll-foreground)}.pdp-carousel__wrapper--scrollbar::-webkit-scrollbar-track{background:var(--scroll-background)}.pdp-carousel__controls__container--thumbnailsRow{--thumbnails-spacing: var(--spacing-small);--thumbnails-box-width: var(--spacing-xxsmall);--thumbnails-rest: calc(var(--thumbnails-spacing) - var(--thumbnails-box-width));--thumbnails-width: calc((var(--width) - 2 * var(--icon-size) - 4 * var(--thumbnails-spacing) - var(--thumb-peak) - 2 * var(--thumbnails-box-width)) / 4);margin-top:var(--thumbnails-rest);width:var(--width);display:flex}.pdp-carousel__controls__container--thumbnailsColumn{--thumbnails-spacing: var(--spacing-small);--thumbnails-box-width: var(--spacing-xxsmall);--thumbnails-rest: calc(var(--thumbnails-spacing) - var(--thumbnails-box-width));--thumbnails-width: 100%;margin-right:var(--thumbnails-rest);width:calc(var(--thumbnails-col-width) - var(--thumbnails-rest))}.pdp-carousel__controls__container--thumbnailsColumn:not(.pdp-carousel__controls__container--no-arrows){height:calc(max(var(--height),4 * var(--thumbnails-spacing)) - 4 * var(--thumbnails-spacing))}.pdp-carousel__controls__container--thumbnailsColumn.pdp-carousel__controls__container--no-arrows{height:var(--height)}.pdp-carousel__controls__wrapper--thumbnailsColumn{max-height:100%;overflow-y:scroll}.pdp-carousel__controls__wrapper--thumbnailsRow{max-width:100%;overflow-x:scroll}.pdp-carousel__controls--thumbnailsRow>label>span:nth-last-child(1){margin-left:0;margin-right:var(--thumbnails-box-width)}[dir=rtl] .pdp-carousel__controls--thumbnailsRow>label>span:nth-last-child(1){margin-left:var(--thumbnails-box-width);margin-right:0}.pdp-carousel__controls__wrapper::-webkit-scrollbar{display:none}.pdp-carousel__controls__wrapper{-ms-overflow-style:none;scrollbar-width:none}.pdp-carousel__controls{display:flex;flex-direction:row;gap:var(--spacing-xsmall)}.pdp-carousel__controls--thumbnailsColumn{display:grid;grid-template-columns:repeat(1,1fr);grid-auto-rows:1fr;grid-row-gap:var(--thumbnails-spacing);padding:var(--thumbnails-box-width)}.pdp-carousel__controls--thumbnailsRow{grid-column-gap:var(--thumbnails-spacing);padding:var(--thumbnails-box-width)}.pdp-carousel__controls__button{border-radius:50%;width:10px;height:10px;padding:0;border:none;background:var(--color-neutral-400);cursor:pointer}.pdp-carousel__controls__button:hover{background:var(--color-neutral-500)}.pdp-carousel__controls__button:active,.pdp-carousel__controls__button--active{background:var(--color-neutral-600)}.pdp-carousel__slide--last{width:100%}.pdp-carousel__thumbnail__container input[type=radio]{opacity:0;position:absolute;width:0;height:0}.pdp-carousel__thumbnail__container .pdp-carousel__thumbnail__span{--bg-color: var(--color-neutral-300);display:inline-block;box-shadow:0 0 0 var(--shape-border-width-1) var(--color-neutral-400);position:relative;cursor:pointer;background-color:var(--bg-color);background-image:var(--background-image);background-repeat:no-repeat;background-size:cover;height:100%;width:100%;overflow:hidden}.pdp-carousel__thumbnail__content{width:inherit;position:absolute;top:-9999px;bottom:-9999px;left:-9999px;right:-9999px;margin:auto;overflow:hidden}.pdp-carousel__thumbnail__span:hover{box-shadow:0 0 0 var(--shape-border-width-3) var(--color-neutral-50),0 0 0 var(--shape-border-width-4) var(--color-neutral-500);outline:none}.pdp-carousel__controls__wrapper--thumbnailsRow .pdp-carousel__thumbnail__container{min-width:100px}.pdp-carousel__thumbnail__container input[type=radio]:not(:checked):active~.pdp-carousel-thumbnail__span{box-shadow:0 0 0 var(--shape-border-width-1) var(--color-neutral-500);outline:none}.pdp-carousel__thumbnail__container input[type=radio]:checked~.pdp-carousel__thumbnail__span,.pdp-carousel__thumbnail--selected{box-shadow:0 0 0 var(--shape-border-width-3) var(--color-neutral-50),0 0 0 var(--shape-border-width-4) var(--color-neutral-800)}.pdp-carousel__thumbnail__container input[type=radio]:checked:active~.pdp-carousel__thumbnail__span{box-shadow:0 0 0 var(--shape-border-width-3) var(--color-neutral-50),0 0 0 var(--shape-border-width-4) var(--color-neutral-600)}.pdp-carousel__thumbnail__container input[type=radio]:focus-visible+.pdp-carousel__thumbnail__span{box-shadow:0 0 0 var(--shape-border-width-3) var(--color-neutral-900),0 0 0 6px var(--color-neutral-400)}.pdp-carousel__thumbnail__span img{object-fit:cover;width:100%;height:100%}.pdp-product{display:grid;grid-template-columns:repeat(var(--grid-1-columns),1fr);grid-column-gap:var(--grid-1-gutters);margin:0 var(--grid-1-margins)}.pdp-product__gallery-column{display:none}.pdp-product__content-column{grid-column:1 / span 4;color:var(--color-neutral-800)}.pdp-product__header{display:grid;grid-auto-rows:max-content;margin-bottom:var(--spacing-medium)}.pdp-product__breadcrumbs{grid-column:1 / -1;padding:var(--spacing-medium) 0 var(--spacing-xxbig)}.pdp-product__title{font:var(--type-display-3-font);letter-spacing:var(--type-display-3-letter-spacing);margin:0}.pdp-product__sku{font:var(--type-body-1-default-font);max-width:600px}.pdp-product__prices{display:flex;gap:var(--spacing-xsmall);margin-top:var(--spacing-medium)}.pdp-product__out-of-stock__text{font:var(--type-headline-2-strong-font)}.pdp-product__options{grid-column:1 / span 4}.pdp-product__price,.pdp-product__price-special{font:var(--type-headline-2-strong-font)}.pdp-product__price,.pdp-product__sku,.pdp-product__price-special,.pdp-product__out-of-stock__text{letter-spacing:var(--type-headline-2-strong-letter-spacing)}.pdp-product__price--grey{color:var(--color-neutral-500)}.pdp-product__actions,.pdp-product__actions--out-of-stock{display:grid;grid-auto-flow:row;gap:var(--grid-1-gutters);grid-auto-rows:max-content;margin-bottom:var(--spacing-xxbig);margin-top:var(--spacing-big)}.pdp-product__short_description,.pdp-product__attributes{font:var(--type-body-1-strong-font);letter-spacing:var(--type-body-1-strong-letter-spacing);margin-bottom:var(--spacing-small)}.pdp-product__description,.pdp-product__attributes li{font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing)}.pdp-product__attributes{margin-top:var(--spacing-xsmall)}.pdp-product__short_description p,.pdp-product__description p,.pdp-product__attributes li p{margin:0}.pdp-product__short_description figure,.pdp-product__description figure{margin:0}.pdp-product__short_description img,.pdp-product__description img{max-width:100%}.pdp-product__images--carousel{max-height:60vh}.pdp-product__images--carousel--thumbnails{max-height:90vh}.pdp-product__images__placeholder{background-color:var(--color-neutral-200)}.pdp-product__buttons{display:grid;grid-auto-rows:max-content;grid-gap:var(--grid-1-gutters)}.pdp-product__buttons a{text-align:center}.pdp-product__buttons a:hover{text-decoration:none}.pdp-product__overlay .pdp-overlay__content{width:100%;height:100%}.pdp-product__overlay__carousel{width:100%;height:100%;box-sizing:border-box}.pdp-product__overlay__carousel img{width:100%;height:100%;object-fit:contain}.pdp-carousel__controls__container--thumbnailsRow img,.pdp-carousel__controls__container--thumbnailsColumn img{object-fit:cover}.pdp-product__quantity,.pdp-product__buttons{grid-column:1 / span 4}@media only screen and (min-width: 1024px){.pdp-product__breadcrumbs{grid-column:2 / -2}.pdp-product{grid-template-columns:repeat(var(--grid-3-columns),1fr);grid-column-gap:var(--grid-3-gutters);margin:0 var(--grid-3-margins);position:relative}.pdp-product__column-container{position:relative;display:flex;flex-direction:column}.pdp-product__column-body{position:sticky;bottom:30%;align-self:flex-end}.pdp-product__gallery-column{display:block;grid-column:2 / span 6}.pdp-product__content-column{grid-column:8 / span 4;padding-top:var(--spacing-medium)}.pdp-product__images--carousel{display:none}.pdp-product__header{margin-bottom:var(--spacing-small)}.pdp-product__actions{grid-template-columns:repeat(var(--grid-1-columns),1fr);grid-column-gap:var(--grid-1-gutters);grid-row-gap:var(--spacing-xxbig);margin-top:var(--spacing-xxbig)}.pdp-product__quantity{grid-column:1 / span 2;width:fit-content}.pdp-product__actions--out-of-stock{grid-template-columns:repeat(var(--grid-1-columns),1fr);grid-column-gap:var(--grid-1-gutters);grid-row-gap:var(--spacing-xxbig);margin-top:var(--spacing-small)}.pdp-product__buttons{grid-column:1 / span 4}.pdp-product__out-of-stock__text{grid-column:1 / span 2}.pdp-product__gallery-content,.pdp-product__content{grid-column:2 / span 6}}.pdp-gallery-grid{display:grid;grid-gap:var(--gap);grid-template-columns:repeat(1,1fr);grid-auto-rows:max-content}.pdp-gallery-grid__item>*{height:100%;max-width:100%;min-width:100%;vertical-align:middle;width:100%;object-fit:contain}.pdp-gallery-grid__item:only-child{grid-column:1 / span 2}.pdp-gallery-grid__item:first-child:nth-last-child(2){grid-column:1 / span 2;grid-row:1}.pdp-gallery-grid__item:nth-child(2):last-child{grid-column:1 / 3;grid-row:2}@media only screen and (min-width: 1024px){.pdp-gallery-grid{grid-template-columns:repeat(2,1fr)}}.pdp-price-range .dropin-price{letter-spacing:var(--type-headline-2-strong-letter-spacing);font:var(--type-headline-2-strong-font)}.pdp-price-range__label{font:var(--type-headline-2-strong-font);letter-spacing:var(--type-body-1-strong-letter-spacing);margin-left:5px;margin-right:5px}.pdp-overlay{position:fixed;top:0;left:0;z-index:1000;right:0;bottom:0;background-color:var(--color-neutral-50);display:flex;padding:var(--spacing-medium)}.pdp-overlay--centered{align-items:center;justify-content:center}.pdp-overlay__content{display:flex;height:100%;width:100%}.pdp-overlay__close-button{position:absolute;top:var(--spacing-medium);right:var(--spacing-medium);z-index:1001}.pdp-swatches{display:grid;grid-auto-flow:row;grid-gap:var(--grid-1-gutters);grid-auto-rows:max-content;position:relative;z-index:0}.pdp-swatches__field{display:grid;font:var(--type-body-2-strong-font);grid-auto-rows:max-content;gap:var(--spacing-xsmall)}.pdp-swatches__field__label{font:var(--type-details-caption-1-font);letter-spacing:var(--type-details-caption-1-letter-spacing);color:var(--color-neutral-800)}.pdp-swatches__options{display:flex;flex-wrap:wrap;gap:var(--spacing-xsmall)}.pdp-zoom{cursor:zoom-in;overflow:hidden;margin:0;position:relative}.pdp-zoom img{height:100%;max-width:100%;min-width:100%;object-fit:contain;position:relative;transition:transform .2s ease-out;transform:var(--transform);vertical-align:middle;width:100%;will-change:transform;backface-visibility:hidden;transform-style:preserve-3d}.pdp-zoom .pdp-zoom__close-button{background-color:var(--color-neutral-50);border-radius:50%;position:absolute;right:var(--spacing-small);top:var(--spacing-small);width:10px;height:10px}.pdp-zoom.pdp-zoom--zoomed{cursor:zoom-out}.pdp-zoom.pdp-zoom--no-effects{cursor:default}@media only screen and (max-width: 768px){.pdp-zoom img{display:block;width:100%;height:100%;transition:transform .2s ease-out;transform:var(--transform);will-change:transform;backface-visibility:hidden}}.pdp-header{display:grid;grid-auto-rows:max-content}.pdp-header__title{font:var(--type-display-3-font);letter-spacing:var(--type-display-3-letter-spacing);margin:0}.pdp-header__sku{font:var(--type-body-1-default-font);max-width:600px}.pdp-price{display:flex;gap:var(--spacing-xsmall);margin-top:var(--spacing-medium)}.pdp-price__amount,.pdp-price__amount-special{font:var(--type-headline-2-strong-font);letter-spacing:var(--type-headline-2-strong-letter-spacing)}.pdp-price__amount--grey{color:var(--color-neutral-500)}",{styleId:"PDP"});
-import{jsx as r}from"@dropins/tools/preact-jsx-runtime.js";import{deepmerge as c,Render as u}from"@dropins/tools/lib.js";import{useState as m,useEffect as f}from"@dropins/tools/preact-hooks.js";import{UIProvider as b}from"@dropins/tools/components.js";import{events as d}from"@dropins/tools/event-bus.js";import{c as g}from"./chunks/isProductConfigurationValid.js";import"./fragments.js";import"@dropins/tools/fetch-graphql.js";const C={Product:{Incrementer:{label:"Item Quantity"},OutOfStock:{label:"Out of Stock"},AddToCart:{label:"Add to Cart"},Details:{label:"Details"},RegularPrice:{label:"Regular Price"},SpecialPrice:{label:"Special Price"},PriceRange:{From:{label:"From"},To:{label:"to"}},Image:{label:"{product} Image {key} of {total}"}},Swatches:{Required:{label:"Required"},ChooseOption:{label:"Choose an option"}},Carousel:{label:"Carousel",Next:{label:"Next"},Previous:{label:"Previous"},Slide:{label:"Slide"},Controls:{label:"Carousel Controls",Button:{label:"Show slide {key} of {total}"}}},Overlay:{Close:{label:"Close"}},Zoom:{Close:{label:"Close"}}},p={quantityLabel:"Quantity"},P={PDP:C,Custom:p},S={default:P},D=({children:a})=>{var t;const[e,i]=m(),n=(t=g.getConfig())==null?void 0:t.langDefinitions;f(()=>{const o=d.on("locale",l=>{l!==e&&i(l)},{eager:!0});return()=>{o==null||o.off()}},[e]);const s=c(S,n??{});return r(b,{lang:e,langDefinitions:s,children:a})},q=new u(r(D,{}));export{q as render};
+(function(p,t){try{if(typeof document<"u"){const r=document.createElement("style"),e=t.styleId;for(const a in t.attributes)r.setAttribute(a,t.attributes[a]);r.setAttribute("data-dropin",e),r.appendChild(document.createTextNode(p));const o=document.querySelector('style[data-dropin="sdk"]');if(o)o.after(r);else{const a=document.querySelector('link[rel="stylesheet"], style');a?a.before(r):document.head.append(r)}}}catch(r){console.error("dropin-styles (injectCodeFunction)",r)}})(`.pdp-gift-card-options{display:flex;flex-direction:column;gap:var(--spacing-xsmall)}.pdp-gift-card-options__grid{display:flex;flex-direction:column;gap:var(--spacing-small)}.pdp-gift-card-options__row{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-small)}.pdp-product__gift-card-options-container{grid-column:1 / -1}.pdp-gift-card-options__option-field{min-width:0;box-sizing:border-box}.pdp-gift-card-options__option-field--full-width{grid-column:1 / -1}.pdp-gift-card-options__label{font-weight:700;margin-bottom:var(--spacing-xsmall)}
+.pdp-carousel{--icon-size: 32px;--icon-extra-padding: 8px;--thumb-peak: 32px;--thumbnails-col-width: 18.6%;position:relative;display:flex;flex-direction:var(--flex-carousel);align-items:center;gap:var(--gap);width:var(--width)}.pdp-carousel .dropin-button--tertiary--disabled:hover{color:var(--color-neutral-500)}.pdp-carousel--thumbnailsColumn{justify-content:flex-end;align-items:start}.pdp-carousel--thumbnailsRow{align-items:center}.pdp-carousel--arrows{padding-left:calc(var(--icon-size) + var(--icon-extra-padding));padding-right:calc(var(--icon-size) + var(--icon-extra-padding));width:calc(var(--width) - 2 * var(--icon-size) - 2 * var(--icon-extra-padding))}.pdp-carousel__button{position:absolute;top:50%;transform:translateY(-50%);padding:0}.pdp-carousel__button--prev{left:0}[dir=rtl] .pdp-carousel__button--prev{left:auto;right:0}[dir=rtl] .pdp-carousel__button--next{right:auto;left:0}.pdp-carousel__button__icon--next{transform:rotate(-90deg)}.pdp-carousel__button--next{right:0}.pdp-carousel__button__icon--prev{transform:rotate(90deg)}[dir=rtl] .pdp-carousel__button__icon--prev{transform:rotate(-90deg)}[dir=rtl] .pdp-carousel__button__icon--next{transform:rotate(90deg)}.pdp-carousel--main-image-controls.pdp-carousel--thumbnailsColumn .pdp-carousel__button--prev{left:var(--thumbnails-col-width)}.pdp-carousel--main-image-controls.pdp-carousel--thumbnailsRow .pdp-carousel__button--prev,.pdp-carousel--main-image-controls.pdp-carousel--thumbnailsRow .pdp-carousel__button--next{top:calc(var(--height) / 2)}.pdp-carousel__button--thumbnailsColumn{margin:auto;padding:0}.pdp-carousel__button--thumbnailsRow{padding:0}.pdp-carousel__button__icon--thumbnailsColumn--prev{transform:rotate(180deg)}.pdp-carousel__button__icon--thumbnailsRow--prev{transform:rotate(90deg)}[dir=rtl] .pdp-carousel__button__icon--thumbnailsRow--prev,.pdp-carousel__button__icon--thumbnailsRow--next{transform:rotate(-90deg)}[dir=rtl] .pdp-carousel__button__icon--thumbnailsRow--next{transform:rotate(90deg)}.pdp-carousel__wrapper{--peak: 0px;scroll-padding:var(--peak);width:var(--total-width);height:var(--height);display:flex;flex-wrap:nowrap;gap:var(--gap);-webkit-overflow-scrolling:touch}.pdp-carousel__wrapper--horizontal{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory}.pdp-carousel__slide{display:grid;grid-gap:var(--gap);grid-auto-columns:1fr;grid-auto-rows:100%;scroll-snap-align:end;scroll-snap-stop:always;flex-shrink:0}.pdp-carousel__slide--horizontal{grid-auto-flow:column;width:calc(100% - var(--peak))}.pdp-carousel__slide--horizontal.pdp-carousel__slide--orphan{width:calc((100% / var(--per-page) * var(--length)) - var(--peak) / var(--per-page) * var(--length) - var(--gap) / var(--per-page) * (var(--per-page) - var(--length)))}.pdp-carousel__slide *{vertical-align:middle;max-width:100%;max-height:100%;width:100%;height:100%}.pdp-carousel__slide img{object-fit:contain;width:100%;height:100%}.pdp-carousel__wrapper--peak{--peak: calc(var(--spacing-medium) + var(--gap))}.pdp-carousel__wrapper--scrollbar{--scroll-foreground: var(--color-neutral-600);--scroll-background: var(--color-neutral-400);scrollbar-color:var(--scroll-foreground) var(--scroll-background);scrollbar-width:thin}.pdp-carousel__wrapper:not(.pdp-carousel__wrapper--scrollbar){scrollbar-width:none}.pdp-carousel__wrapper:not(.pdp-carousel__wrapper--scrollbar)::-webkit-scrollbar{display:none}.pdp-carousel__wrapper--scrollbar::-webkit-scrollbar{width:4px;height:4px}.pdp-carousel__slide--hidden{opacity:0;pointer-events:none}.pdp-carousel__wrapper--scrollbar::-webkit-scrollbar-thumb{background:var(--scroll-foreground)}.pdp-carousel__wrapper--scrollbar::-webkit-scrollbar-track{background:var(--scroll-background)}.pdp-carousel__controls__container--thumbnailsRow{--thumbnails-spacing: var(--spacing-small);--thumbnails-box-width: var(--spacing-xxsmall);--thumbnails-rest: calc(var(--thumbnails-spacing) - var(--thumbnails-box-width));--thumbnails-width: calc((var(--width) - 2 * var(--icon-size) - 4 * var(--thumbnails-spacing) - var(--thumb-peak) - 2 * var(--thumbnails-box-width)) / 4);margin-top:var(--thumbnails-rest);width:var(--width);display:flex}.pdp-carousel__controls__container--thumbnailsColumn{--thumbnails-spacing: var(--spacing-small);--thumbnails-box-width: var(--spacing-xxsmall);--thumbnails-rest: calc(var(--thumbnails-spacing) - var(--thumbnails-box-width));--thumbnails-width: 100%;margin-right:var(--thumbnails-rest);width:calc(var(--thumbnails-col-width) - var(--thumbnails-rest))}.pdp-carousel__controls__container--thumbnailsColumn:not(.pdp-carousel__controls__container--no-arrows){height:calc(max(var(--height),4 * var(--thumbnails-spacing)) - 4 * var(--thumbnails-spacing))}.pdp-carousel__controls__container--thumbnailsColumn.pdp-carousel__controls__container--no-arrows{height:var(--height)}.pdp-carousel__controls__wrapper--thumbnailsColumn{max-height:100%;overflow-y:scroll}.pdp-carousel__controls__wrapper--thumbnailsRow{max-width:100%;overflow-x:scroll}.pdp-carousel__controls--thumbnailsRow>label>span:nth-last-child(1){margin-left:0;margin-right:var(--thumbnails-box-width)}[dir=rtl] .pdp-carousel__controls--thumbnailsRow>label>span:nth-last-child(1){margin-left:var(--thumbnails-box-width);margin-right:0}.pdp-carousel__controls__wrapper::-webkit-scrollbar{display:none}.pdp-carousel__controls__wrapper{-ms-overflow-style:none;scrollbar-width:none}.pdp-carousel__controls{display:flex;flex-direction:row;gap:var(--spacing-xsmall)}.pdp-carousel__controls--thumbnailsColumn{display:grid;grid-template-columns:repeat(1,1fr);grid-auto-rows:1fr;grid-row-gap:var(--thumbnails-spacing);padding:var(--thumbnails-box-width)}.pdp-carousel__controls--thumbnailsRow{grid-column-gap:var(--thumbnails-spacing);padding:var(--thumbnails-box-width)}.pdp-carousel__controls__button{border-radius:50%;width:10px;height:10px;padding:0;border:none;background:var(--color-neutral-400);cursor:pointer}.pdp-carousel__controls__button:hover{background:var(--color-neutral-500)}.pdp-carousel__controls__button:active,.pdp-carousel__controls__button--active{background:var(--color-neutral-600)}.pdp-carousel__slide--last{width:100%}.pdp-carousel__thumbnail__container input[type=radio]{opacity:0;position:absolute;width:0;height:0}.pdp-carousel__thumbnail__container .pdp-carousel__thumbnail__span{--bg-color: var(--color-neutral-300);display:inline-block;box-shadow:0 0 0 var(--shape-border-width-1) var(--color-neutral-400);position:relative;cursor:pointer;background-color:var(--bg-color);background-image:var(--background-image);background-repeat:no-repeat;background-size:cover;height:100%;width:100%;overflow:hidden}.pdp-carousel__thumbnail__content{width:inherit;position:absolute;top:-9999px;bottom:-9999px;left:-9999px;right:-9999px;margin:auto;overflow:hidden}.pdp-carousel__thumbnail__span:hover{box-shadow:0 0 0 var(--shape-border-width-3) var(--color-neutral-50),0 0 0 var(--shape-border-width-4) var(--color-neutral-500);outline:none}.pdp-carousel__controls__wrapper--thumbnailsRow .pdp-carousel__thumbnail__container{min-width:100px}.pdp-carousel__thumbnail__container input[type=radio]:not(:checked):active~.pdp-carousel-thumbnail__span{box-shadow:0 0 0 var(--shape-border-width-1) var(--color-neutral-500);outline:none}.pdp-carousel__thumbnail__container input[type=radio]:checked~.pdp-carousel__thumbnail__span,.pdp-carousel__thumbnail--selected{box-shadow:0 0 0 var(--shape-border-width-3) var(--color-neutral-50),0 0 0 var(--shape-border-width-4) var(--color-neutral-800)}.pdp-carousel__thumbnail__container input[type=radio]:checked:active~.pdp-carousel__thumbnail__span{box-shadow:0 0 0 var(--shape-border-width-3) var(--color-neutral-50),0 0 0 var(--shape-border-width-4) var(--color-neutral-600)}.pdp-carousel__thumbnail__container input[type=radio]:focus-visible+.pdp-carousel__thumbnail__span{box-shadow:0 0 0 var(--shape-border-width-3) var(--color-neutral-900),0 0 0 6px var(--color-neutral-400)}.pdp-carousel__thumbnail__span img{object-fit:cover;width:100%;height:100%}.pdp-product{display:grid;grid-template-columns:repeat(var(--grid-1-columns),1fr);grid-column-gap:var(--grid-1-gutters);margin:0 var(--grid-1-margins)}.pdp-product__gallery-column{display:none}.pdp-product__content-column{grid-column:1 / span 4;color:var(--color-neutral-800)}.pdp-product__header{display:grid;grid-auto-rows:max-content;margin-bottom:var(--spacing-medium)}.pdp-product__breadcrumbs{grid-column:1 / -1;padding:var(--spacing-medium) 0 var(--spacing-xxbig)}.pdp-product__title{font:var(--type-display-3-font);letter-spacing:var(--type-display-3-letter-spacing);margin:0}.pdp-product__sku{font:var(--type-body-1-default-font);max-width:600px}.pdp-product__prices{display:flex;gap:var(--spacing-xsmall);margin-top:var(--spacing-medium)}.pdp-product__out-of-stock__text{font:var(--type-headline-2-strong-font)}.pdp-product__options{grid-column:1 / span 4}.pdp-product__price,.pdp-product__price-special{font:var(--type-headline-2-strong-font)}.pdp-product__price,.pdp-product__sku,.pdp-product__price-special,.pdp-product__out-of-stock__text{letter-spacing:var(--type-headline-2-strong-letter-spacing)}.pdp-product__price--grey{color:var(--color-neutral-500)}.pdp-product__actions,.pdp-product__actions--out-of-stock{display:grid;grid-auto-flow:row;gap:var(--grid-1-gutters);grid-auto-rows:max-content;margin-bottom:var(--spacing-xxbig);margin-top:var(--spacing-big)}.pdp-product__short_description,.pdp-product__attributes{font:var(--type-body-1-strong-font);letter-spacing:var(--type-body-1-strong-letter-spacing);margin-bottom:var(--spacing-small)}.pdp-product__description,.pdp-product__attributes li{font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing)}.pdp-product__attributes{margin-top:var(--spacing-xsmall)}.pdp-product__short_description p,.pdp-product__description p,.pdp-product__attributes li p{margin:0}.pdp-product__short_description figure,.pdp-product__description figure{margin:0}.pdp-product__short_description img,.pdp-product__description img{max-width:100%}.pdp-product__images--carousel{max-height:60vh}.pdp-product__images--carousel--thumbnails{max-height:90vh}.pdp-product__images__placeholder{background-color:var(--color-neutral-200)}.pdp-product__buttons{display:grid;grid-auto-rows:max-content;grid-gap:var(--grid-1-gutters)}.pdp-product__buttons a{text-align:center}.pdp-product__buttons a:hover{text-decoration:none}.pdp-product__overlay .pdp-overlay__content{width:100%;height:100%}.pdp-product__overlay__carousel{width:100%;height:100%;box-sizing:border-box}.pdp-product__overlay__carousel img{width:100%;height:100%;object-fit:contain}.pdp-carousel__controls__container--thumbnailsRow img,.pdp-carousel__controls__container--thumbnailsColumn img{object-fit:cover}.pdp-product__quantity,.pdp-product__buttons{grid-column:1 / span 4}@media only screen and (min-width: 1024px){.pdp-product__breadcrumbs{grid-column:2 / -2}.pdp-product{grid-template-columns:repeat(var(--grid-3-columns),1fr);grid-column-gap:var(--grid-3-gutters);margin:0 var(--grid-3-margins);position:relative}.pdp-product__column-container{position:relative;display:flex;flex-direction:column}.pdp-product__column-body{position:sticky;bottom:30%;align-self:flex-end}.pdp-product__gallery-column{display:block;grid-column:2 / span 6}.pdp-product__content-column{grid-column:8 / span 4;padding-top:var(--spacing-medium)}.pdp-product__images--carousel{display:none}.pdp-product__header{margin-bottom:var(--spacing-small)}.pdp-product__actions{grid-template-columns:repeat(var(--grid-1-columns),1fr);grid-column-gap:var(--grid-1-gutters);grid-row-gap:var(--spacing-xxbig);margin-top:var(--spacing-xxbig)}.pdp-product__quantity{grid-column:1 / span 2;width:fit-content}.pdp-product__actions--out-of-stock{grid-template-columns:repeat(var(--grid-1-columns),1fr);grid-column-gap:var(--grid-1-gutters);grid-row-gap:var(--spacing-xxbig);margin-top:var(--spacing-small)}.pdp-product__buttons{grid-column:1 / span 4}.pdp-product__out-of-stock__text{grid-column:1 / span 2}.pdp-product__gallery-content,.pdp-product__content{grid-column:2 / span 6}}.pdp-gallery-grid{display:grid;grid-gap:var(--gap);grid-template-columns:repeat(1,1fr);grid-auto-rows:max-content}.pdp-gallery-grid__item>*{height:100%;max-width:100%;min-width:100%;vertical-align:middle;width:100%;object-fit:contain}.pdp-gallery-grid__item:only-child{grid-column:1 / span 2}.pdp-gallery-grid__item:first-child:nth-last-child(2){grid-column:1 / span 2;grid-row:1}.pdp-gallery-grid__item:nth-child(2):last-child{grid-column:1 / 3;grid-row:2}@media only screen and (min-width: 1024px){.pdp-gallery-grid{grid-template-columns:repeat(2,1fr)}}.pdp-price-range .dropin-price{letter-spacing:var(--type-headline-2-strong-letter-spacing);font:var(--type-headline-2-strong-font)}.pdp-price-range__label{font:var(--type-headline-2-strong-font);letter-spacing:var(--type-body-1-strong-letter-spacing);margin-left:5px;margin-right:5px}.pdp-overlay{position:fixed;top:0;left:0;z-index:1000;right:0;bottom:0;background-color:var(--color-neutral-50);display:flex;padding:var(--spacing-medium)}.pdp-overlay--centered{align-items:center;justify-content:center}.pdp-overlay__content{display:flex;height:100%;width:100%}.pdp-overlay__close-button{position:absolute;top:var(--spacing-medium);right:var(--spacing-medium);z-index:1001}.pdp-swatches{display:grid;grid-auto-flow:row;grid-gap:var(--grid-1-gutters);grid-auto-rows:max-content;position:relative;z-index:0}.pdp-swatches__field{display:grid;font:var(--type-body-2-strong-font);grid-auto-rows:max-content;gap:var(--spacing-xsmall)}.pdp-swatches__field__label{font:var(--type-details-caption-1-font);letter-spacing:var(--type-details-caption-1-letter-spacing);color:var(--color-neutral-800)}.pdp-swatches__options{display:flex;flex-wrap:wrap;gap:var(--spacing-xsmall)}.pdp-zoom{cursor:zoom-in;overflow:hidden;margin:0;position:relative}.pdp-zoom img{height:100%;max-width:100%;min-width:100%;object-fit:contain;position:relative;transition:transform .2s ease-out;transform:var(--transform);vertical-align:middle;width:100%;will-change:transform;backface-visibility:hidden;transform-style:preserve-3d}.pdp-zoom .pdp-zoom__close-button{background-color:var(--color-neutral-50);border-radius:50%;position:absolute;right:var(--spacing-small);top:var(--spacing-small);width:10px;height:10px}.pdp-zoom.pdp-zoom--zoomed{cursor:zoom-out}.pdp-zoom.pdp-zoom--no-effects{cursor:default}@media only screen and (max-width: 768px){.pdp-zoom img{display:block;width:100%;height:100%;transition:transform .2s ease-out;transform:var(--transform);will-change:transform;backface-visibility:hidden}}.pdp-header{display:grid;grid-auto-rows:max-content}.pdp-header__title{font:var(--type-display-3-font);letter-spacing:var(--type-display-3-letter-spacing);margin:0}.pdp-header__sku{font:var(--type-body-1-default-font);max-width:600px}.pdp-price{display:flex;gap:var(--spacing-xsmall);margin-top:var(--spacing-medium)}.pdp-price__amount,.pdp-price__amount-special{font:var(--type-headline-2-strong-font);letter-spacing:var(--type-headline-2-strong-letter-spacing)}.pdp-price__amount--grey{color:var(--color-neutral-500)}`,{styleId:"PDP"});
+import{jsx as a}from"@dropins/tools/preact-jsx-runtime.js";import{deepmerge as m,Render as u}from"@dropins/tools/lib.js";import{useState as b,useEffect as c}from"@dropins/tools/preact-hooks.js";import{UIProvider as d}from"@dropins/tools/components.js";import{events as f}from"@dropins/tools/event-bus.js";import{c as g}from"./chunks/fetchProductData.js";import"./fragments.js";import"@dropins/tools/fetch-graphql.js";import"./chunks/isProductConfigurationValid.js";const C={Product:{Incrementer:{label:"Item Quantity"},OutOfStock:{label:"Out of Stock"},AddToCart:{label:"Add to Cart"},Details:{label:"Details"},RegularPrice:{label:"Regular Price"},SpecialPrice:{label:"Special Price"},PriceRange:{From:{label:"From"},To:{label:"to"}},Image:{label:"{product} Image {key} of {total}"},GiftCardOptions:{ChooseAmount:{label:"Choose amount"},OtherAmount:{label:"Other amount"},RequiredFieldError:{label:"This field is required"},NumberError:{label:"Please enter a valid number"},MinError:{label:"Minimum value is {min}"},MaxError:{label:"Maximum value is {max}"},MinLengthError:{label:"Minimum length is {min_length} characters"},MaxLengthError:{label:"Maximum length is {max_length} characters"},EmailError:{label:"Please enter a valid email address"},InvalidValueError:{label:"Please select one of the allowed values: {values}"}}},Swatches:{Required:{label:"Required"},ChooseOption:{label:"Choose an option"}},Carousel:{label:"Carousel",Next:{label:"Next"},Previous:{label:"Previous"},Slide:{label:"Slide"},Controls:{label:"Carousel Controls",Button:{label:"Show slide {key} of {total}"}}},Overlay:{Close:{label:"Close"}},Zoom:{Close:{label:"Close"}}},h={quantityLabel:"Quantity"},P={PDP:C,Custom:h},p={default:P},v=({children:t})=>{var o;const[e,i]=b(),n=(o=g.getConfig())==null?void 0:o.langDefinitions;c(()=>{const l=f.on("locale",r=>{r!==e&&i(r)},{eager:!0});return()=>{l==null||l.off()}},[e]);const s=m(p,n??{});return a(d,{lang:e,langDefinitions:s,children:t})},y=new u(a(v,{}));export{y as render};
 //# sourceMappingURL=render.js.map

package/render.js.map

@@ -1 +1 @@
-{"version":3,"file":"render.js","sources":["/@dropins/storefront-pdp/src/render/Provider.tsx","/@dropins/storefront-pdp/src/render/render.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { FunctionComponent } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport { UIProvider } from '@adobe-commerce/elsie/components';\nimport { Lang } from '@adobe-commerce/elsie/i18n';\nimport { events } from '@adobe-commerce/event-bus';\nimport { config } from '../api';\nimport { deepmerge } from '@adobe-commerce/elsie/lib';\n\nimport en_US from '../i18n/en_US.json';\n\n// Langs\nconst langDefinitions = {\n  default: en_US,\n};\n\ninterface CartProviderProps {\n  children?: any;\n}\n\nexport const Provider: FunctionComponent<CartProviderProps> = ({\n  children,\n}) => {\n  const [locale, setLang] = useState<Lang>();\n\n  const userLangDefinitions = config.getConfig()?.langDefinitions;\n\n  //   Events\n  useEffect(() => {\n    const localeEvent = events.on(\n      'locale',\n      (payload) => {\n        if (payload !== locale) setLang(payload as Lang);\n      },\n      { eager: true }\n    );\n    return () => {\n      localeEvent?.off();\n    };\n  }, [locale]);\n\n  // Merge language definitions with user language definitions\n  const definitions = deepmerge(langDefinitions, userLangDefinitions ?? {});\n\n  return (\n    <UIProvider lang={locale} langDefinitions={definitions}>\n      {children}\n    </UIProvider>\n  );\n};\n","/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { Render } from '@adobe-commerce/elsie/lib';\nimport { Provider } from './Provider';\n\nexport const render = new Render(<Provider />);\n"],"names":["langDefinitions","en_US","Provider","children","locale","setLang","useState","userLangDefinitions","_a","config","useEffect","localeEvent","events","payload","definitions","deepmerge","UIProvider","render","Render","jsx"],"mappings":"4lCA2BMA,EAAkB,CACtB,QAASC,CACX,EAMaC,EAAiD,CAAC,CAC7D,SAAAC,CACF,IAAM,OACJ,KAAM,CAACC,EAAQC,CAAO,EAAIC,EAAe,EAEnCC,GAAsBC,EAAAC,EAAO,UAAA,IAAP,YAAAD,EAAoB,gBAGhDE,EAAU,IAAM,CACd,MAAMC,EAAcC,EAAO,GACzB,SACCC,GAAY,CACPA,IAAYT,GAAQC,EAAQQ,CAAe,CACjD,EACA,CAAE,MAAO,EAAK,CAChB,EACA,MAAO,IAAM,CACXF,GAAA,MAAAA,EAAa,KACf,CAAA,EACC,CAACP,CAAM,CAAC,EAGX,MAAMU,EAAcC,EAAUf,EAAiBO,GAAuB,CAAA,CAAE,EAExE,SACGS,EAAW,CAAA,KAAMZ,EAAQ,gBAAiBU,EACxC,SAAAX,EACH,CAEJ,EC7Cac,EAAS,IAAIC,EAAOC,EAACjB,IAAS,CAAE"}
+{"version":3,"file":"render.js","sources":["/@dropins/storefront-pdp/src/render/Provider.tsx","/@dropins/storefront-pdp/src/render/render.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { FunctionComponent } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport { UIProvider } from '@adobe-commerce/elsie/components';\nimport { Lang } from '@adobe-commerce/elsie/i18n';\nimport { events } from '@adobe-commerce/event-bus';\nimport { config } from '../api';\nimport { deepmerge } from '@adobe-commerce/elsie/lib';\n\nimport en_US from '../i18n/en_US.json';\n\n// Langs\nconst langDefinitions = {\n  default: en_US,\n};\n\ninterface CartProviderProps {\n  children?: any;\n}\n\nexport const Provider: FunctionComponent<CartProviderProps> = ({\n  children,\n}) => {\n  const [locale, setLang] = useState<Lang>();\n\n  const userLangDefinitions = config.getConfig()?.langDefinitions;\n\n  //   Events\n  useEffect(() => {\n    const localeEvent = events.on(\n      'locale',\n      (payload) => {\n        if (payload !== locale) setLang(payload as Lang);\n      },\n      { eager: true }\n    );\n    return () => {\n      localeEvent?.off();\n    };\n  }, [locale]);\n\n  // Merge language definitions with user language definitions\n  const definitions = deepmerge(langDefinitions, userLangDefinitions ?? {});\n\n  return (\n    <UIProvider lang={locale} langDefinitions={definitions}>\n      {children}\n    </UIProvider>\n  );\n};\n","/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2023 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { Render } from '@adobe-commerce/elsie/lib';\nimport { Provider } from './Provider';\n\nexport const render = new Render(<Provider />);\n"],"names":["langDefinitions","en_US","Provider","children","locale","setLang","useState","userLangDefinitions","_a","config","useEffect","localeEvent","events","payload","definitions","deepmerge","UIProvider","render","Render","jsx"],"mappings":"iqDA2BMA,EAAkB,CACtB,QAASC,CACX,EAMaC,EAAiD,CAAC,CAC7D,SAAAC,CACF,IAAM,OACJ,KAAM,CAACC,EAAQC,CAAO,EAAIC,EAAe,EAEnCC,GAAsBC,EAAAC,EAAO,UAAA,IAAP,YAAAD,EAAoB,gBAGhDE,EAAU,IAAM,CACd,MAAMC,EAAcC,EAAO,GACzB,SACCC,GAAY,CACPA,IAAYT,GAAQC,EAAQQ,CAAe,CACjD,EACA,CAAE,MAAO,EAAK,CAChB,EACA,MAAO,IAAM,CACXF,GAAA,MAAAA,EAAa,KACf,CAAA,EACC,CAACP,CAAM,CAAC,EAGX,MAAMU,EAAcC,EAAUf,EAAiBO,GAAuB,CAAA,CAAE,EAExE,SACGS,EAAW,CAAA,KAAMZ,EAAQ,gBAAiBU,EACxC,SAAAX,EACH,CAEJ,EC7Cac,EAAS,IAAIC,EAAOC,EAACjB,IAAS,CAAE"}