npm - @dropins/storefront-pdp - Versions diffs - 1.2.1-beta1 → 1.2.1 - Mend

@dropins/storefront-pdp 1.2.1-beta1 → 1.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/chunks/Zoom.js +1 -1
package/chunks/Zoom.js.map +1 -1
package/chunks/isProductConfigurationValid.js +8 -8
package/chunks/isProductConfigurationValid.js.map +1 -1
package/containers/ProductDetails.js +1 -1
package/containers/ProductDetails.js.map +1 -1
package/containers/ProductPrice.js +1 -1
package/containers/ProductPrice.js.map +1 -1
package/package.json +1 -1
package/render.js +1 -1

package/containers/ProductDetails.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProductDetails.js","sources":["/@dropins/storefront-pdp/src/components/Product/Product.tsx","/@dropins/storefront-pdp/src/components/GalleryGrid/GalleryGrid.tsx","/@dropins/storefront-pdp/src/containers/ProductDetails/ProductDetails.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, VNode } from 'preact';\nimport { HTMLAttributes, useState } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport { useText } from '@adobe-commerce/elsie/i18n';\n\nimport { Carousel, GalleryGrid, Overlay, Zoom } from '@/pdp/components';\nimport '@/pdp/components/Product/Product.css';\n\nimport { CarouselConfig } from '@/pdp/containers';\n\ninterface ProductCarouselConfig extends CarouselConfig {\n thumbnails: VNode[];\n}\n\nexport interface ProductProps\n extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n title?: VNode;\n breadcrumbs?: VNode;\n galleryContent?: VNode;\n infoContent?: VNode;\n productContent?: VNode;\n shortDescription?: VNode;\n description?: VNode;\n attributes?: VNode;\n images: VNode[];\n options?: VNode;\n sku?: VNode;\n price?: VNode;\n specialPrice?: VNode;\n outOfStock: boolean;\n actions?: VNode;\n quantity?: VNode;\n carouselConfig?: ProductCarouselConfig;\n zoomType?: 'zoom' \| 'overlay';\n closeButton?: boolean;\n}\n\nexport const Product: FunctionComponent<ProductProps> = ({\n title,\n breadcrumbs,\n galleryContent,\n infoContent,\n productContent,\n sku,\n outOfStock,\n shortDescription,\n description,\n attributes,\n images,\n options,\n price,\n specialPrice,\n className,\n children,\n quantity,\n actions,\n carouselConfig,\n zoomType = 'overlay',\n closeButton = true,\n ...props\n}) => {\n // i18n\n const RegularPriceLabel = useText('PDP.Product.RegularPrice.label').label;\n const SpecialPriceLabel = useText('PDP.Product.SpecialPrice.label').label;\n const OutOfStockLabel = useText('PDP.Product.OutOfStock.label').label;\n const ImagesLabel = useText('PDP.Product.Image.label').label;\n\n const [zoom, setZoom] = useState<number \| null>(null);\n\n const galleryImages = images?.length ? (\n images.map((image, key) => {\n const alt =\n title?.props?.children &&\n ImagesLabel?.replace('{product}', title.props.children.toString())\n .replace('{key}', String(key + 1))\n .replace('{total}', String(images.length));\n return zoomType === 'zoom' ? (\n <Zoom closeButton={closeButton}>\n <VComponent\n key={key}\n node={image}\n loading={key === 0 ? 'eager' : 'lazy'}\n alt={alt}\n />\n </Zoom>\n ) : (\n <VComponent\n key={key}\n node={image}\n loading={key === 0 ? 'eager' : 'lazy'}\n alt={alt}\n onClick={() => setZoom(key)}\n />\n );\n })\n ) : (\n <img\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product__images__placeholder\"\n aria-hidden\n />\n );\n\n const localThumbnailsImages = carouselConfig?.thumbnails?.length ? (\n carouselConfig.thumbnails.map((image, key) => (\n <VComponent\n key={key}\n node={image}\n loading={carouselConfig?.thumbnailsLoadingMode \|\| 'lazy'}\n alt={\n title?.props?.children &&\n ImagesLabel?.replace('{product}', title.props.children.toString())\n .replace('{key}', String(key + 1))\n .replace('{total}', String(images.length))\n }\n />\n ))\n ) : (\n <img\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product__images__placeholder\"\n aria-hidden\n />\n );\n\n return (\n <div {...props} className={classes(['pdp-product', className])}>\n {breadcrumbs && (\n <VComponent node={breadcrumbs} className=\"pdp-product__breadcrumbs\" />\n )}\n <div className=\"pdp-product__column-container pdp-product__gallery-column\">\n <div className=\"pdp-product__column-body\">\n {carouselConfig?.controls?.desktop ? (\n <Carousel\n className=\"pdp-product__overlay__carousel\"\n arrows={images?.length > 1}\n controls={\n images?.length > 1 ? carouselConfig.controls.desktop : 'dots'\n }\n arrowsOnMainImage={carouselConfig?.arrowsOnMainImage}\n loop={carouselConfig?.loopable && images?.length > 1}\n peak={\n (carouselConfig?.thumbnails?.length > 1 &&\n carouselConfig?.peak?.desktop) \|\|\n false\n }\n gap={carouselConfig?.gap \|\| null}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoom \|\| 0}\n thumbnails={localThumbnailsImages}\n >\n {galleryImages}\n </Carousel>\n ) : (\n <GalleryGrid className=\"pdp-product__images\" gap=\"small\">\n {galleryImages}\n </GalleryGrid>\n )}\n </div>\n {galleryContent && (\n <VComponent\n node={galleryContent}\n className=\"pdp-product__gallery-content\"\n />\n )}\n </div>\n\n <div className=\"pdp-product__column-container pdp-product__content-column\">\n <div className=\"pdp-product__column-body\">\n <div className=\"pdp-product__header\">\n {title && (\n <VComponent node={title} className=\"pdp-product__title\" />\n )}\n\n {sku && <VComponent node={sku} className=\"pdp-product__sku\" />}\n </div>\n\n <div className=\"pdp-product__prices\">\n {specialPrice && (\n <VComponent\n node={specialPrice}\n className={classes([\n 'pdp-product__price-special',\n 'pdp-product__price',\n ])}\n aria-label={SpecialPriceLabel}\n role=\"text\"\n />\n )}\n {price && (\n <VComponent\n node={price}\n className={classes([\n 'pdp-product__price-regular',\n 'pdp-product__price--grey',\n ])}\n aria-label={RegularPriceLabel}\n role=\"text\"\n />\n )}\n </div>\n\n {/ Small Screen Gallery /}\n {carouselConfig?.controls?.mobile &&\n carouselConfig?.controls?.mobile === 'thumbnailsRow' ? (\n <Carousel\n className=\"pdp-product__images pdp-product__images--carousel pdp-product__images--carousel--thumbnails\"\n width=\"100%\"\n height=\"auto\"\n arrows={images?.length > 1}\n controls={images?.length > 1 ? 'thumbnailsRow' : null}\n loop={carouselConfig?.loopable && images?.length > 1}\n peak={\n (carouselConfig?.thumbnails?.length > 1 &&\n carouselConfig?.peak?.mobile) \|\|\n false\n }\n gap={carouselConfig?.gap \|\| null}\n thumbnails={localThumbnailsImages}\n >\n {galleryImages}\n </Carousel>\n ) : (\n <Carousel\n className=\"pdp-product__images pdp-product__images--carousel\"\n peak={carouselConfig?.peak?.mobile && images?.length > 1}\n gap={carouselConfig?.gap \|\| null}\n width=\"100%\"\n height=\"auto\"\n arrows={images?.length > 1}\n controls={images?.length > 1 ? 'dots' : null}\n loop={carouselConfig?.loopable && images?.length > 1}\n >\n {galleryImages}\n </Carousel>\n )}\n\n <div\n className={classes([\n 'pdp-product__actions',\n [`pdp-product__actions--out-of-stock`, outOfStock],\n ])}\n >\n {outOfStock && (\n <div className=\"pdp-product__out-of-stock__text\">\n {OutOfStockLabel}\n </div>\n )}\n\n {options && (\n <VComponent\n node={options}\n className={classes(['pdp-product__options'])}\n />\n )}\n\n {quantity && (\n <div className=\"pdp-product__quantity\">\n <VComponent node={quantity} />\n </div>\n )}\n\n {actions && (\n <VComponent\n node={actions}\n className={classes(['pdp-product__buttons'])}\n />\n )}\n </div>\n\n {shortDescription && (\n <VComponent\n node={shortDescription}\n className={classes(['pdp-product__short_description'])}\n />\n )}\n\n {description && (\n <VComponent\n node={description}\n className={classes(['pdp-product__description'])}\n />\n )}\n\n {attributes ? (\n <div className=\"pdp-product__attributes\">{attributes}</div>\n ) : null}\n </div>\n {infoContent && (\n <VComponent\n node={infoContent}\n className=\"pdp-product__info-content\"\n />\n )}\n </div>\n\n {productContent && (\n <VComponent node={productContent} className=\"pdp-product__content\" />\n )}\n\n {/ Zoom Overlay /}\n {zoom === null ? null : (\n <Overlay\n className=\"pdp-product__overlay\"\n onClose={() => setZoom(null)}\n centered\n >\n <Carousel\n className=\"pdp-product__overlay__carousel\"\n arrows={images?.length > 1}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoom \|\| 0}\n loop={carouselConfig?.loopable && images?.length > 1}\n controls={images?.length > 1 ? 'dots' : null}\n isZoomed\n >\n {galleryImages}\n </Carousel>\n </Overlay>\n )}\n </div>\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 { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, Children } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport '@/pdp/components/GalleryGrid/GalleryGrid.css';\n\nexport interface GalleryGridProps extends HTMLAttributes<HTMLDivElement> {\n children: VNode[] \| VNode;\n gap?: 'small' \| 'medium' \| 'large' \| null;\n style?: Record<string, string \| number>;\n}\n\nexport const GalleryGrid: FunctionComponent<GalleryGridProps> = ({\n children,\n gap = null,\n className,\n style,\n ...props\n}) => {\n const count = Children.count(children);\n\n return (\n <div\n {...props}\n className={classes(['pdp-gallery-grid', className])}\n style={{\n '--gap': gap ? `var(--spacing-${gap})` : '0px',\n ...style,\n }}\n >\n {Children.map(\n children,\n (child: VNode<HTMLAttributes<HTMLElement>>, key) => (\n <div key={count + key} className=\"pdp-gallery-grid__item\">\n <VComponent\n key={child.props.src}\n node={child}\n loading={key === 0 ? 'eager' : 'lazy'}\n />\n </div>\n )\n )}\n </div>\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 {\n HTMLAttributes,\n useEffect,\n useState,\n useCallback,\n useMemo,\n} from 'preact/compat';\n\nimport {\n Container,\n toLanguageTag,\n SlotProps,\n SlotMethod,\n Slot,\n ResolveImageUrlOptions,\n} from '@adobe-commerce/elsie/lib';\n\nimport {\n Button,\n Icon,\n ButtonProps,\n Image,\n Incrementer,\n Breadcrumbs,\n} from '@adobe-commerce/elsie/components';\nimport { Product, Swatches, PriceRange, Option } from '@/pdp/components';\nimport { config, fetchProductData } from '@/pdp/api';\nimport { events } from '@adobe-commerce/event-bus';\nimport { Lang, useText } from '@adobe-commerce/elsie/i18n';\nimport { isDateValid, toDateString } from '@/pdp/lib/date';\nimport {\n setUrlParams,\n getValidatedQuantityFromUrl,\n} from '@/pdp/lib/url-params';\nimport { publishProductPageViewEvent } from '@/pdp/lib/acdl';\nimport { ProductModel, Option as ProductOption } from '@/pdp/data/models';\nimport { transformProductData } from '@/pdp/data/transforms/product-transform';\n\ntype IconType = keyof typeof import('@adobe-commerce/elsie/icons');\n\n/* @deprecated This type is part of the deprecated ProductDetails component. /\nexport type Values = {\n sku: string;\n quantity: number;\n optionsUIDs?: string[];\n};\n\n/* @deprecated This type is part of the deprecated ProductDetails component. /\ntype DefaultSlotContext = {\n data: ProductModel \| null;\n values: Values;\n valid: boolean;\n};\n\n/* @deprecated This type is part of the deprecated ProductDetails component. /\nexport type CarouselConfig = {\n controls?: {\n desktop?: 'thumbnailsRow' \| 'thumbnailsColumn' \| 'dots' \| null;\n mobile?: 'dots' \| 'thumbnailsRow' \| null;\n };\n arrowsOnMainImage?: boolean;\n loopable?: boolean;\n peak?: {\n desktop: boolean;\n mobile: boolean;\n };\n gap?: 'small' \| 'medium' \| 'large' \| null;\n thumbnailsLoadingMode?: 'lazy' \| 'eager';\n imageParams?: ResolveImageUrlOptions;\n thumbnailParams?: ResolveImageUrlOptions;\n};\n\n/* @deprecated This type is part of the deprecated ProductDetails component. /\nexport type OptionsConfig = {\n anchorOptions?: string[];\n};\n\n/* @deprecated This interface is part of the deprecated ProductDetails component. /\nexport interface ProductDetailsProps extends HTMLAttributes<HTMLDivElement> {\n sku: string;\n productData?: ProductModel;\n hideSku?: boolean;\n hideQuantity?: boolean;\n hideShortDescription?: boolean;\n hideDescription?: boolean;\n hideAttributes?: boolean;\n hideSelectedOptionValue?: boolean;\n hideURLParams?: boolean;\n slots?: {\n Title?: SlotProps<DefaultSlotContext>;\n\n SKU?: SlotProps<DefaultSlotContext>;\n\n RegularPrice?: SlotProps<DefaultSlotContext>;\n\n SpecialPrice?: SlotProps<DefaultSlotContext>;\n\n Options?: SlotProps<DefaultSlotContext>;\n\n Quantity?: SlotProps<DefaultSlotContext>;\n\n Actions?: SlotProps<\n DefaultSlotContext & {\n appendButton: SlotMethod<\n Omit<ButtonProps, 'icon'> & {\n text?: string;\n icon?: IconType;\n }\n >;\n }\n >;\n\n ShortDescription?: SlotProps<DefaultSlotContext>;\n\n Description?: SlotProps<DefaultSlotContext>;\n\n Attributes?: SlotProps<DefaultSlotContext>;\n\n Breadcrumbs?: SlotProps<\n DefaultSlotContext & {\n setSeparator: SlotMethod<IconType>;\n\n appendLink: SlotMethod<\n HTMLAttributes<HTMLAnchorElement> & { text?: string }\n >;\n\n appendHTMLElement: SlotMethod<HTMLElement>;\n }\n >;\n\n GalleryContent?: SlotProps<DefaultSlotContext>;\n\n InfoContent?: SlotProps<DefaultSlotContext>;\n\n Content?: SlotProps<DefaultSlotContext>;\n };\n carousel?: CarouselConfig;\n optionsConfig?: OptionsConfig;\n useACDL?: boolean;\n onAddToCart?: (values: Values) => void;\n zoomType?: 'zoom' \| 'overlay';\n closeButton?: boolean;\n disableDropdownPreselection?: boolean;\n}\n\n/\n @deprecated This container has been deprecated and will be removed in a future release.\n * Please use the different composable containers to build your product details page.xs\n /\nexport const ProductDetails: Container<\n ProductDetailsProps,\n ProductModel \| null\n> = ({\n sku,\n hideSku,\n hideQuantity,\n hideShortDescription,\n hideDescription,\n hideAttributes,\n hideURLParams,\n hideSelectedOptionValue,\n slots,\n children,\n initialData,\n carousel,\n optionsConfig,\n useACDL,\n onAddToCart,\n zoomType,\n closeButton = true,\n disableDropdownPreselection,\n ...props\n}) => {\n // i18n\n const AddToCartLabel = useText('PDP.Product.AddToCart.label').label;\n const IncrementerLabel = useText('PDP.Product.Incrementer.label').label;\n const DetailsLabel = useText('PDP.Product.Details.label').label;\n const ChooseOptionLabel = useText('PDP.Swatches.ChooseOption.label').label;\n\n // TODO: Investigate if the \"\|\| 'en-US' \" is really necessary\n const [locale, setLocale] = useState<Lang>(\n (config.getConfig().defaultLocale as Lang) \|\| 'en-US'\n );\n\n const [selectionsToUpdate, setSelectionsToUpdate] = useState<Option[]>();\n\n const [data = null, setData] = useState(initialData);\n\n const [values, setValues] = useState<Values>(() => {\n const initialQuantity = getValidatedQuantityFromUrl(1); // Default quantity to 1\n\n const defaultValues: Values = {\n sku,\n quantity: initialQuantity,\n };\n\n if (data?.optionUIDs) {\n defaultValues.optionsUIDs = data.optionUIDs;\n }\n return defaultValues;\n });\n\n // the context is invalid for a configurable product that doesn't have all the options selected\n const [valid, setValid] = useState(() => {\n return !(\n data?.options &&\n data?.options?.length > 0 &&\n data?.optionUIDs?.length !== data?.options.length\n );\n });\n\n const defaultSlotContext: DefaultSlotContext = { data, values, valid };\n\n function hasProductViewOptionValueProduct(options: ProductOption[]) {\n return options?.some(\n (option) => option?.typename === 'ProductViewOptionValueProduct'\n );\n }\n\n useEffect(() => {\n const dataEvent = events.on('pdp/data', (payload) => {\n if (payload) {\n setData(payload);\n // Preserve the current quantity value when updating from pdp/data event\n setValues((prev: Values) => ({\n ...prev,\n sku: payload.sku,\n optionsUIDs: payload.optionUIDs,\n }));\n }\n });\n\n // @ts-ignore - Type error with event bus events\n const updateDataEvent = events.on(\n 'pdp/setValues',\n (payload: Partial<Values>) => {\n setValues((prev: Values) => ({ ...prev, ...payload }));\n }\n );\n\n return () => {\n updateDataEvent?.off();\n dataEvent?.off();\n };\n }, []);\n\n // Locale\n useEffect(() => {\n const localeEvent = events.on('locale', (payload: string) => {\n if (payload === locale) return;\n\n setLocale(payload as Lang);\n\n fetchProductData(sku, {\n preselectFirstOption: !disableDropdownPreselection,\n anchors: optionsConfig?.anchorOptions,\n }).then(setData);\n });\n return () => {\n localeEvent?.off();\n };\n }, [disableDropdownPreselection, locale, optionsConfig?.anchorOptions, sku]);\n\n useEffect(() => {\n if (useACDL && initialData && Object.keys(initialData).length > 0) {\n publishProductPageViewEvent(initialData);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [initialData]);\n\n // Callbacks\n const handleOnValues = useCallback((newValues: Partial<Values>) => {\n setValues((prev) => ({ ...prev, ...newValues }));\n }, []);\n\n useEffect(() => {\n events.emit('pdp/values', values);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [JSON.stringify(values)]);\n\n const handleOptionSelected = useCallback(\n async (selections: { [id: string]: { label: string; value: string } }) => {\n // options Selected\n let optionsUIDs = Object.entries(selections)\n .filter(([_, value]) => value.label !== ChooseOptionLabel) // eslint-disable-line no-unused-vars\n .map(([id, _]) => selections[id].value) // eslint-disable-line no-unused-vars\n .filter((element) => element !== undefined);\n\n // set optionUIDs to URL params\n // ?optionsUIDs=1,2,3\n // only set the URL params if the hideURLParams is not set to true and the product is not a bundle type\n if (\n !hideURLParams &&\n data?.options &&\n !hasProductViewOptionValueProduct(data.options)\n ) {\n setUrlParams({ optionsUIDs: optionsUIDs.join(',') });\n }\n\n // update state\n handleOnValues({ optionsUIDs });\n setValid(optionsUIDs?.length === data?.options?.length);\n\n // get refined product data and update state\n const next = await fetchProductData(sku, {\n anchors: optionsConfig?.anchorOptions,\n isBundle: data?.isBundle,\n optionsUIDs,\n preselectFirstOption: !disableDropdownPreselection,\n });\n\n setData(next);\n\n // special processing for anchor options (options that should not be refined when other options are selected)\n if (optionsConfig?.anchorOptions?.length) {\n processUpdates(next, optionsUIDs);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [sku]\n );\n\n const processUpdates = useCallback(\n (next: ProductModel \| null, previousOptionsUIDs: string[]) => {\n const updatedOptionsUIDs = next?.optionUIDs ?? [];\n const haveSameValues = previousOptionsUIDs.every((item) =>\n updatedOptionsUIDs.includes(item)\n );\n if (!haveSameValues) {\n setSelectionsToUpdate(next?.options);\n handleOnValues({ optionsUIDs: updatedOptionsUIDs });\n setValid(updatedOptionsUIDs?.length === next?.options?.length);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [sku]\n );\n\n const handleOnErrors = useCallback((_errors: { [id: string]: string }) => {\n if (Object.keys(_errors).length !== 0) setValid(false);\n }, []);\n\n // Product Attributes\n const attributes = useMemo(() => {\n return data?.attributes?.map(({ label, value }, key: number) => {\n const __html = isDateValid(value)\n ? toDateString(value, locale)\n : value.toString();\n\n return (\n <li key={key}>\n {/ eslint-disable-next-line react/no-danger /}\n {label}: <span dangerouslySetInnerHTML={{ __html }} />\n </li>\n );\n });\n }, [data?.attributes, locale]);\n\n const quantity =\n !hideQuantity && data?.inStock ? (\n <Slot\n name=\"Quantity\"\n slot={slots?.Quantity}\n context={{ ...defaultSlotContext }}\n >\n <Incrementer\n key=\"quantity\"\n name=\"quantity\"\n defaultValue={values.quantity.toString()}\n value={values.quantity.toString()}\n min={1}\n aria-label={IncrementerLabel}\n className=\"pdp-product__quantity\"\n onValue={(quantity) => {\n const quantityValue = Number(quantity);\n handleOnValues({ quantity: quantityValue });\n\n // Add quantity to URL parameters if not set to hide\n if (!hideURLParams && data?.options) {\n // Only update URL if the product is not a bundle type\n if (!hasProductViewOptionValueProduct(data.options)) {\n setUrlParams({ quantity: quantityValue });\n }\n }\n }}\n />\n </Slot>\n ) : undefined;\n\n const renderOptions = () => {\n if (data?.options) {\n return (\n <Slot\n name=\"Options\"\n slot={slots?.Options}\n context={{ ...defaultSlotContext }}\n >\n <Swatches\n selectedUIDs={values.optionsUIDs}\n options={data.options}\n defaultOptions={values.optionsUIDs}\n selectionsToUpdate={selectionsToUpdate}\n hideSelectedValue={hideSelectedOptionValue}\n disablePreselections={disableDropdownPreselection}\n onValues={handleOptionSelected}\n onErrors={handleOnErrors}\n />\n </Slot>\n );\n }\n };\n\n return (\n <div {...props}>\n <Product\n title={\n <Slot\n name=\"Title\"\n slot={slots?.Title}\n context={{ ...defaultSlotContext }}\n >\n {data?.name}\n </Slot>\n }\n sku={\n !hideSku ? (\n <Slot\n name=\"SKU\"\n slot={slots?.SKU}\n context={{ ...defaultSlotContext }}\n >\n {data?.sku}\n </Slot>\n ) : undefined\n }\n options={renderOptions()}\n breadcrumbs={\n slots?.Breadcrumbs && (\n <Slot\n name=\"Breadcrumbs\"\n slot={slots?.Breadcrumbs}\n context={{\n ...defaultSlotContext,\n\n setSeparator(callback) {\n this._registerMethod((...attrs) => {\n const nextSeparator = callback(...attrs);\n\n const separator = nextSeparator && (\n <Icon source={nextSeparator} />\n );\n\n this._setProps((prev: any) => {\n return {\n ...prev,\n separator,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={separator}\n categories={prev.categories}\n />,\n ],\n };\n });\n });\n },\n\n appendLink(callback) {\n this._registerMethod((...attrs) => {\n const { text, ...p } = callback(...attrs);\n\n const link = <a {...p}>{text}</a>;\n\n this._setProps((prev: any) => {\n const categories = [...(prev.categories \|\| []), link];\n return {\n ...prev,\n categories,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={prev.separator}\n categories={categories}\n />,\n ],\n };\n });\n });\n },\n\n appendHTMLElement(callback) {\n this._registerMethod((...attrs) => {\n const domElement = callback(...attrs);\n\n const vnode = this._htmlElementToVNode(domElement);\n\n this._setProps((prev: any) => {\n const categories = [...(prev.categories \|\| []), vnode];\n\n return {\n ...prev,\n categories,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={prev.separator}\n categories={categories}\n />,\n ],\n };\n });\n });\n },\n }}\n />\n )\n }\n quantity={quantity}\n actions={\n <Slot\n name=\"Actions\"\n slot={slots?.Actions}\n context={{\n ...defaultSlotContext,\n\n appendButton(callback) {\n this._registerMethod((...attrs) => {\n const _button = callback(...attrs);\n\n if (!_button) return;\n\n const { text, icon, ...buttonProps } = _button;\n\n const button = (\n <Button\n type=\"button\"\n {...buttonProps}\n icon={icon && <Icon source={icon} />}\n >\n {text}\n </Button>\n );\n\n this._setProps((prev: any) => ({\n children: [...(prev.children \|\| []), button],\n }));\n });\n },\n }}\n >\n {\n // Default Add to Cart button if no slot is provided\n !slots?.Actions && (\n <Button\n size=\"medium\"\n type=\"submit\"\n icon={<Icon source=\"Cart\" />}\n disabled={!data?.inStock \|\| !valid}\n aria-label={AddToCartLabel}\n onClick={() => {\n return onAddToCart?.(values);\n }}\n >\n {AddToCartLabel}\n </Button>\n )\n }\n </Slot>\n }\n shortDescription={\n !hideShortDescription ? (\n <Slot\n name=\"ShortDescription\"\n slot={slots?.ShortDescription}\n context={{ ...defaultSlotContext }}\n >\n <div\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{\n __html: data?.shortDescription ?? '',\n }}\n />\n </Slot>\n ) : undefined\n }\n description={\n !hideDescription ? (\n <Slot\n name=\"Description\"\n slot={slots?.Description}\n context={{ ...defaultSlotContext }}\n >\n <div\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{ __html: data?.description ?? '' }}\n />\n </Slot>\n ) : undefined\n }\n images={\n data?.images?.map(({ label, url }) => (\n <Image\n key={url}\n title={label}\n alt={label}\n src={url}\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width={carousel?.imageParams?.width ?? 960}\n height={carousel?.imageParams?.height ?? 1191}\n params={carousel?.imageParams ?? { width: 960 }}\n />\n )) ?? []\n }\n specialPrice={\n data?.prices?.visible ? (\n <Slot\n name=\"SpecialPrice\"\n slot={slots?.SpecialPrice}\n context={{ ...defaultSlotContext }}\n >\n <PriceRange\n {...data.prices.final}\n locale={toLanguageTag(locale)}\n />\n </Slot>\n ) : undefined\n }\n price={\n data?.prices?.visible &&\n data.prices.regular &&\n data.prices.final.amount !== data?.prices.regular.amount ? (\n <Slot\n name=\"RegularPrice\"\n slot={slots?.RegularPrice}\n context={{ ...defaultSlotContext }}\n >\n <PriceRange\n {...data.prices.regular}\n locale={toLanguageTag(locale)}\n />\n </Slot>\n ) : undefined\n }\n zoomType={zoomType}\n closeButton={closeButton}\n carouselConfig={{\n ...carousel,\n thumbnails:\n carousel && Object.keys(carousel).length\n ? data?.images?.map(({ label, url }) => (\n <Image\n key={url}\n title={label}\n alt={label}\n src={url}\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width={carousel?.thumbnailParams?.width ?? 200}\n height={carousel?.thumbnailParams?.height ?? 248}\n params={carousel?.thumbnailParams ?? { width: 200 }}\n />\n )) ?? []\n : [],\n }}\n outOfStock={!data?.inStock}\n attributes={\n !hideAttributes ? (\n <Slot\n name=\"Attributes\"\n slot={slots?.Attributes}\n context={{ ...defaultSlotContext }}\n >\n {attributes?.length ? (\n <>\n {DetailsLabel}\n <ul>{attributes}</ul>\n </>\n ) : null}\n </Slot>\n ) : undefined\n }\n galleryContent={\n slots?.GalleryContent && (\n <Slot\n name=\"GalleryContent\"\n slot={slots.GalleryContent}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n infoContent={\n slots?.InfoContent && (\n <Slot\n name=\"InfoContent\"\n slot={slots.InfoContent}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n productContent={\n slots?.Content && (\n <Slot\n name=\"Content\"\n slot={slots.Content}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n />\n </div>\n );\n};\n\n/* @deprecated This method is part of the deprecated ProductDetails component. */\nProductDetails.getInitialData = async function ({\n sku,\n disableDropdownPreselection = false,\n optionsConfig,\n}) {\n const initialData = config.getConfig().models?.ProductDetails?.initialData;\n\n return initialData\n ? transformProductData(initialData)\n : fetchProductData(sku, {\n preselectFirstOption: !disableDropdownPreselection,\n anchors: optionsConfig?.anchorOptions,\n });\n};\n"],"names":["Product","title","breadcrumbs","galleryContent","infoContent","productContent","sku","outOfStock","shortDescription","description","attributes","images","options","price","specialPrice","className","children","quantity","actions","carouselConfig","zoomType","closeButton","props","RegularPriceLabel","useText","SpecialPriceLabel","OutOfStockLabel","ImagesLabel","zoom","setZoom","useState","galleryImages","image","key","alt","_a","jsx","Zoom","VComponent","localThumbnailsImages","jsxs","classes","_b","Carousel","_c","_d","GalleryGrid","_e","_f","_g","_h","_i","Overlay","gap","style","count","Children","child","ProductDetails","hideSku","hideQuantity","hideShortDescription","hideDescription","hideAttributes","hideURLParams","hideSelectedOptionValue","slots","initialData","carousel","optionsConfig","useACDL","onAddToCart","disableDropdownPreselection","AddToCartLabel","IncrementerLabel","DetailsLabel","ChooseOptionLabel","locale","setLocale","config","selectionsToUpdate","setSelectionsToUpdate","data","setData","values","setValues","initialQuantity","getValidatedQuantityFromUrl","defaultValues","valid","setValid","defaultSlotContext","hasProductViewOptionValueProduct","option","useEffect","dataEvent","events","payload","prev","updateDataEvent","localeEvent","fetchProductData","publishProductPageViewEvent","handleOnValues","useCallback","newValues","handleOptionSelected","selections","optionsUIDs","_","value","id","element","setUrlParams","next","processUpdates","previousOptionsUIDs","updatedOptionsUIDs","item","handleOnErrors","_errors","useMemo","label","__html","isDateValid","toDateString","Slot","Incrementer","quantityValue","renderOptions","Swatches","callback","attrs","nextSeparator","separator","Icon","Breadcrumbs","text","p","link","categories","domElement","vnode","_button","icon","buttonProps","button","Button","url","Image","PriceRange","toLanguageTag","Fragment","transformProductData"],"mappings":"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"}
1	+ {"version":3,"file":"ProductDetails.js","sources":["/@dropins/storefront-pdp/src/components/Product/Product.tsx","/@dropins/storefront-pdp/src/components/GalleryGrid/GalleryGrid.tsx","/@dropins/storefront-pdp/src/containers/ProductDetails/ProductDetails.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, VNode } from 'preact';\nimport { HTMLAttributes, useState } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport { useText } from '@adobe-commerce/elsie/i18n';\n\nimport { Carousel, GalleryGrid, Overlay, Zoom } from '@/pdp/components';\nimport '@/pdp/components/Product/Product.css';\n\nimport { CarouselConfig } from '@/pdp/containers';\n\ninterface ProductCarouselConfig extends CarouselConfig {\n thumbnails: VNode[];\n}\n\nexport interface ProductProps\n extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n title?: VNode;\n breadcrumbs?: VNode;\n galleryContent?: VNode;\n infoContent?: VNode;\n productContent?: VNode;\n shortDescription?: VNode;\n description?: VNode;\n attributes?: VNode;\n images: VNode[];\n options?: VNode;\n sku?: VNode;\n price?: VNode;\n specialPrice?: VNode;\n outOfStock: boolean;\n actions?: VNode;\n quantity?: VNode;\n carouselConfig?: ProductCarouselConfig;\n zoomType?: 'zoom' \| 'overlay';\n closeButton?: boolean;\n}\n\nexport const Product: FunctionComponent<ProductProps> = ({\n title,\n breadcrumbs,\n galleryContent,\n infoContent,\n productContent,\n sku,\n outOfStock,\n shortDescription,\n description,\n attributes,\n images,\n options,\n price,\n specialPrice,\n className,\n children,\n quantity,\n actions,\n carouselConfig,\n zoomType = 'overlay',\n closeButton = true,\n ...props\n}) => {\n // i18n\n const RegularPriceLabel = useText('PDP.Product.RegularPrice.label').label;\n const SpecialPriceLabel = useText('PDP.Product.SpecialPrice.label').label;\n const OutOfStockLabel = useText('PDP.Product.OutOfStock.label').label;\n const ImagesLabel = useText('PDP.Product.Image.label').label;\n\n const [zoom, setZoom] = useState<number \| null>(null);\n\n const galleryImages = images?.length ? (\n images.map((image, key) => {\n const alt =\n title?.props?.children &&\n ImagesLabel?.replace('{product}', title.props.children.toString())\n .replace('{key}', String(key + 1))\n .replace('{total}', String(images.length));\n return zoomType === 'zoom' ? (\n <Zoom closeButton={closeButton}>\n <VComponent\n key={key}\n node={image}\n loading={key === 0 ? 'eager' : 'lazy'}\n alt={alt}\n />\n </Zoom>\n ) : (\n <VComponent\n key={key}\n node={image}\n loading={key === 0 ? 'eager' : 'lazy'}\n alt={alt}\n onClick={() => setZoom(key)}\n />\n );\n })\n ) : (\n <img\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product__images__placeholder\"\n aria-hidden\n />\n );\n\n const localThumbnailsImages = carouselConfig?.thumbnails?.length ? (\n carouselConfig.thumbnails.map((image, key) => (\n <VComponent\n key={key}\n node={image}\n loading={carouselConfig?.thumbnailsLoadingMode \|\| 'lazy'}\n alt={\n title?.props?.children &&\n ImagesLabel?.replace('{product}', title.props.children.toString())\n .replace('{key}', String(key + 1))\n .replace('{total}', String(images.length))\n }\n />\n ))\n ) : (\n <img\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n className=\"pdp-product__images__placeholder\"\n aria-hidden\n />\n );\n\n return (\n <div {...props} className={classes(['pdp-product', className])}>\n {breadcrumbs && (\n <VComponent node={breadcrumbs} className=\"pdp-product__breadcrumbs\" />\n )}\n <div className=\"pdp-product__column-container pdp-product__gallery-column\">\n <div className=\"pdp-product__column-body\">\n {carouselConfig?.controls?.desktop ? (\n <Carousel\n className=\"pdp-product__overlay__carousel\"\n arrows={images?.length > 1}\n controls={\n images?.length > 1 ? carouselConfig.controls.desktop : 'dots'\n }\n arrowsOnMainImage={carouselConfig?.arrowsOnMainImage}\n loop={carouselConfig?.loopable && images?.length > 1}\n peak={\n (carouselConfig?.thumbnails?.length > 1 &&\n carouselConfig?.peak?.desktop) \|\|\n false\n }\n gap={carouselConfig?.gap \|\| null}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoom \|\| 0}\n thumbnails={localThumbnailsImages}\n >\n {galleryImages}\n </Carousel>\n ) : (\n <GalleryGrid className=\"pdp-product__images\" gap=\"small\">\n {galleryImages}\n </GalleryGrid>\n )}\n </div>\n {galleryContent && (\n <VComponent\n node={galleryContent}\n className=\"pdp-product__gallery-content\"\n />\n )}\n </div>\n\n <div className=\"pdp-product__column-container pdp-product__content-column\">\n <div className=\"pdp-product__column-body\">\n <div className=\"pdp-product__header\">\n {title && (\n <VComponent node={title} className=\"pdp-product__title\" />\n )}\n\n {sku && <VComponent node={sku} className=\"pdp-product__sku\" />}\n </div>\n\n <div className=\"pdp-product__prices\">\n {specialPrice && (\n <VComponent\n node={specialPrice}\n className={classes([\n 'pdp-product__price-special',\n 'pdp-product__price',\n ])}\n aria-label={SpecialPriceLabel}\n role=\"text\"\n />\n )}\n {price && (\n <VComponent\n node={price}\n className={classes([\n 'pdp-product__price-regular',\n 'pdp-product__price--grey',\n ])}\n aria-label={RegularPriceLabel}\n role=\"text\"\n />\n )}\n </div>\n\n {/ Small Screen Gallery /}\n {carouselConfig?.controls?.mobile &&\n carouselConfig?.controls?.mobile === 'thumbnailsRow' ? (\n <Carousel\n className=\"pdp-product__images pdp-product__images--carousel pdp-product__images--carousel--thumbnails\"\n width=\"100%\"\n height=\"auto\"\n arrows={images?.length > 1}\n controls={images?.length > 1 ? 'thumbnailsRow' : null}\n loop={carouselConfig?.loopable && images?.length > 1}\n peak={\n (carouselConfig?.thumbnails?.length > 1 &&\n carouselConfig?.peak?.mobile) \|\|\n false\n }\n gap={carouselConfig?.gap \|\| null}\n thumbnails={localThumbnailsImages}\n >\n {galleryImages}\n </Carousel>\n ) : (\n <Carousel\n className=\"pdp-product__images pdp-product__images--carousel\"\n peak={carouselConfig?.peak?.mobile && images?.length > 1}\n gap={carouselConfig?.gap \|\| null}\n width=\"100%\"\n height=\"auto\"\n arrows={images?.length > 1}\n controls={images?.length > 1 ? 'dots' : null}\n loop={carouselConfig?.loopable && images?.length > 1}\n >\n {galleryImages}\n </Carousel>\n )}\n\n <div\n className={classes([\n 'pdp-product__actions',\n [`pdp-product__actions--out-of-stock`, outOfStock],\n ])}\n >\n {outOfStock && (\n <div className=\"pdp-product__out-of-stock__text\">\n {OutOfStockLabel}\n </div>\n )}\n\n {options && (\n <VComponent\n node={options}\n className={classes(['pdp-product__options'])}\n />\n )}\n\n {quantity && (\n <div className=\"pdp-product__quantity\">\n <VComponent node={quantity} />\n </div>\n )}\n\n {actions && (\n <VComponent\n node={actions}\n className={classes(['pdp-product__buttons'])}\n />\n )}\n </div>\n\n {shortDescription && (\n <VComponent\n node={shortDescription}\n className={classes(['pdp-product__short_description'])}\n />\n )}\n\n {description && (\n <VComponent\n node={description}\n className={classes(['pdp-product__description'])}\n />\n )}\n\n {attributes ? (\n <div className=\"pdp-product__attributes\">{attributes}</div>\n ) : null}\n </div>\n {infoContent && (\n <VComponent\n node={infoContent}\n className=\"pdp-product__info-content\"\n />\n )}\n </div>\n\n {productContent && (\n <VComponent node={productContent} className=\"pdp-product__content\" />\n )}\n\n {/ Zoom Overlay /}\n {zoom === null ? null : (\n <Overlay\n className=\"pdp-product__overlay\"\n onClose={() => setZoom(null)}\n centered\n >\n <Carousel\n className=\"pdp-product__overlay__carousel\"\n arrows={images?.length > 1}\n width=\"100%\"\n height=\"100%\"\n defaultIndex={zoom \|\| 0}\n loop={carouselConfig?.loopable && images?.length > 1}\n controls={images?.length > 1 ? 'dots' : null}\n isZoomed\n >\n {galleryImages}\n </Carousel>\n </Overlay>\n )}\n </div>\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 { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, Children } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport '@/pdp/components/GalleryGrid/GalleryGrid.css';\n\nexport interface GalleryGridProps extends HTMLAttributes<HTMLDivElement> {\n children: VNode[] \| VNode;\n gap?: 'small' \| 'medium' \| 'large' \| null;\n style?: Record<string, string \| number>;\n}\n\nexport const GalleryGrid: FunctionComponent<GalleryGridProps> = ({\n children,\n gap = null,\n className,\n style,\n ...props\n}) => {\n const count = Children.count(children);\n\n return (\n <div\n {...props}\n className={classes(['pdp-gallery-grid', className])}\n style={{\n '--gap': gap ? `var(--spacing-${gap})` : '0px',\n ...style,\n }}\n >\n {Children.map(\n children,\n (child: VNode<HTMLAttributes<HTMLElement>>, key) => (\n <div key={count + key} className=\"pdp-gallery-grid__item\">\n <VComponent\n key={child.props.src}\n node={child}\n loading={key === 0 ? 'eager' : 'lazy'}\n />\n </div>\n )\n )}\n </div>\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 {\n HTMLAttributes,\n useEffect,\n useState,\n useCallback,\n useMemo,\n} from 'preact/compat';\n\nimport {\n Container,\n toLanguageTag,\n SlotProps,\n SlotMethod,\n Slot,\n ResolveImageUrlOptions,\n} from '@adobe-commerce/elsie/lib';\n\nimport {\n Button,\n Icon,\n ButtonProps,\n Image,\n Incrementer,\n Breadcrumbs,\n} from '@adobe-commerce/elsie/components';\nimport { Product, Swatches, PriceRange, Option } from '@/pdp/components';\nimport { config, fetchProductData } from '@/pdp/api';\nimport { events } from '@adobe-commerce/event-bus';\nimport { Lang, useText } from '@adobe-commerce/elsie/i18n';\nimport { isDateValid, toDateString } from '@/pdp/lib/date';\nimport {\n setUrlParams,\n getValidatedQuantityFromUrl,\n} from '@/pdp/lib/url-params';\nimport { publishProductPageViewEvent } from '@/pdp/lib/acdl';\nimport { ProductModel, Option as ProductOption } from '@/pdp/data/models';\nimport { transformProductData } from '@/pdp/data/transforms/product-transform';\n\ntype IconType = keyof typeof import('@adobe-commerce/elsie/icons');\n\n/* @deprecated This type is part of the deprecated ProductDetails component. /\nexport type Values = {\n sku: string;\n quantity: number;\n optionsUIDs?: string[];\n};\n\n/* @deprecated This type is part of the deprecated ProductDetails component. /\ntype DefaultSlotContext = {\n data: ProductModel \| null;\n values: Values;\n valid: boolean;\n};\n\n/* @deprecated This type is part of the deprecated ProductDetails component. /\nexport type CarouselConfig = {\n controls?: {\n desktop?: 'thumbnailsRow' \| 'thumbnailsColumn' \| 'dots' \| null;\n mobile?: 'dots' \| 'thumbnailsRow' \| null;\n };\n arrowsOnMainImage?: boolean;\n loopable?: boolean;\n peak?: {\n desktop: boolean;\n mobile: boolean;\n };\n gap?: 'small' \| 'medium' \| 'large' \| null;\n thumbnailsLoadingMode?: 'lazy' \| 'eager';\n imageParams?: ResolveImageUrlOptions;\n thumbnailParams?: ResolveImageUrlOptions;\n};\n\n/* @deprecated This type is part of the deprecated ProductDetails component. /\nexport type OptionsConfig = {\n anchorOptions?: string[];\n};\n\n/* @deprecated This interface is part of the deprecated ProductDetails component. /\nexport interface ProductDetailsProps extends HTMLAttributes<HTMLDivElement> {\n sku: string;\n productData?: ProductModel;\n hideSku?: boolean;\n hideQuantity?: boolean;\n hideShortDescription?: boolean;\n hideDescription?: boolean;\n hideAttributes?: boolean;\n hideSelectedOptionValue?: boolean;\n hideURLParams?: boolean;\n slots?: {\n Title?: SlotProps<DefaultSlotContext>;\n\n SKU?: SlotProps<DefaultSlotContext>;\n\n RegularPrice?: SlotProps<DefaultSlotContext>;\n\n SpecialPrice?: SlotProps<DefaultSlotContext>;\n\n Options?: SlotProps<DefaultSlotContext>;\n\n Quantity?: SlotProps<DefaultSlotContext>;\n\n Actions?: SlotProps<\n DefaultSlotContext & {\n appendButton: SlotMethod<\n Omit<ButtonProps, 'icon'> & {\n text?: string;\n icon?: IconType;\n }\n >;\n }\n >;\n\n ShortDescription?: SlotProps<DefaultSlotContext>;\n\n Description?: SlotProps<DefaultSlotContext>;\n\n Attributes?: SlotProps<DefaultSlotContext>;\n\n Breadcrumbs?: SlotProps<\n DefaultSlotContext & {\n setSeparator: SlotMethod<IconType>;\n\n appendLink: SlotMethod<\n HTMLAttributes<HTMLAnchorElement> & { text?: string }\n >;\n\n appendHTMLElement: SlotMethod<HTMLElement>;\n }\n >;\n\n GalleryContent?: SlotProps<DefaultSlotContext>;\n\n InfoContent?: SlotProps<DefaultSlotContext>;\n\n Content?: SlotProps<DefaultSlotContext>;\n };\n carousel?: CarouselConfig;\n optionsConfig?: OptionsConfig;\n useACDL?: boolean;\n onAddToCart?: (values: Values) => void;\n zoomType?: 'zoom' \| 'overlay';\n closeButton?: boolean;\n disableDropdownPreselection?: boolean;\n}\n\n/\n @deprecated This container has been deprecated and will be removed in a future release.\n * Please use the different composable containers to build your product details page.xs\n /\nexport const ProductDetails: Container<\n ProductDetailsProps,\n ProductModel \| null\n> = ({\n sku,\n hideSku,\n hideQuantity,\n hideShortDescription,\n hideDescription,\n hideAttributes,\n hideURLParams,\n hideSelectedOptionValue,\n slots,\n children,\n initialData,\n carousel,\n optionsConfig,\n useACDL,\n onAddToCart,\n zoomType,\n closeButton = true,\n disableDropdownPreselection,\n ...props\n}) => {\n // i18n\n const AddToCartLabel = useText('PDP.Product.AddToCart.label').label;\n const IncrementerLabel = useText('PDP.Product.Incrementer.label').label;\n const DetailsLabel = useText('PDP.Product.Details.label').label;\n const ChooseOptionLabel = useText('PDP.Swatches.ChooseOption.label').label;\n\n // TODO: Investigate if the \"\|\| 'en-US' \" is really necessary\n const [locale, setLocale] = useState<Lang>(\n (config.getConfig().defaultLocale as Lang) \|\| 'en-US'\n );\n\n const [selectionsToUpdate, setSelectionsToUpdate] = useState<Option[]>();\n\n const [data = null, setData] = useState(initialData);\n\n const [values, setValues] = useState<Values>(() => {\n const initialQuantity = getValidatedQuantityFromUrl(1); // Default quantity to 1\n\n const defaultValues: Values = {\n sku,\n quantity: initialQuantity,\n };\n\n if (data?.optionUIDs) {\n defaultValues.optionsUIDs = data.optionUIDs;\n }\n return defaultValues;\n });\n\n // the context is invalid for a configurable product that doesn't have all the options selected\n const [valid, setValid] = useState(() => {\n return !(\n data?.options &&\n data?.options?.length > 0 &&\n data?.optionUIDs?.length !== data?.options.length\n );\n });\n\n const defaultSlotContext: DefaultSlotContext = { data, values, valid };\n\n function hasProductViewOptionValueProduct(options: ProductOption[]) {\n return options?.some(\n (option) => option?.typename === 'ProductViewOptionValueProduct'\n );\n }\n\n useEffect(() => {\n const dataEvent = events.on('pdp/data', (payload) => {\n if (payload) {\n setData(payload);\n // Preserve the current quantity value when updating from pdp/data event\n setValues((prev: Values) => ({\n ...prev,\n sku: payload.sku,\n optionsUIDs: payload.optionUIDs,\n }));\n }\n });\n\n // @ts-ignore - Type error with event bus events\n const updateDataEvent = events.on(\n 'pdp/setValues',\n (payload: Partial<Values>) => {\n setValues((prev: Values) => ({ ...prev, ...payload }));\n }\n );\n\n return () => {\n updateDataEvent?.off();\n dataEvent?.off();\n };\n }, []);\n\n // Locale\n useEffect(() => {\n const localeEvent = events.on('locale', (payload: string) => {\n if (payload === locale) return;\n\n setLocale(payload as Lang);\n\n fetchProductData(sku, {\n preselectFirstOption: !disableDropdownPreselection,\n anchors: optionsConfig?.anchorOptions,\n }).then(setData);\n });\n return () => {\n localeEvent?.off();\n };\n }, [disableDropdownPreselection, locale, optionsConfig?.anchorOptions, sku]);\n\n useEffect(() => {\n if (useACDL && initialData && Object.keys(initialData).length > 0) {\n publishProductPageViewEvent(initialData);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [initialData]);\n\n // Callbacks\n const handleOnValues = useCallback((newValues: Partial<Values>) => {\n setValues((prev) => ({ ...prev, ...newValues }));\n }, []);\n\n useEffect(() => {\n events.emit('pdp/values', values);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [JSON.stringify(values)]);\n\n const handleOptionSelected = useCallback(\n async (selections: { [id: string]: { label: string; value: string } }) => {\n // options Selected\n let optionsUIDs = Object.entries(selections)\n .filter(([_, value]) => value.label !== ChooseOptionLabel) // eslint-disable-line no-unused-vars\n .map(([id, _]) => selections[id].value) // eslint-disable-line no-unused-vars\n .filter((element) => element !== undefined);\n\n // set optionUIDs to URL params\n // ?optionsUIDs=1,2,3\n // only set the URL params if the hideURLParams is not set to true and the product is not a bundle type\n if (\n !hideURLParams &&\n data?.options &&\n !hasProductViewOptionValueProduct(data.options)\n ) {\n setUrlParams({ optionsUIDs: optionsUIDs.join(',') });\n }\n\n // update state\n handleOnValues({ optionsUIDs });\n setValid(optionsUIDs?.length === data?.options?.length);\n\n // get refined product data and update state\n const next = await fetchProductData(sku, {\n anchors: optionsConfig?.anchorOptions,\n isBundle: data?.isBundle,\n optionsUIDs,\n preselectFirstOption: !disableDropdownPreselection,\n });\n\n setData(next);\n\n // special processing for anchor options (options that should not be refined when other options are selected)\n if (optionsConfig?.anchorOptions?.length) {\n processUpdates(next, optionsUIDs);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [sku]\n );\n\n const processUpdates = useCallback(\n (next: ProductModel \| null, previousOptionsUIDs: string[]) => {\n const updatedOptionsUIDs = next?.optionUIDs ?? [];\n const haveSameValues = previousOptionsUIDs.every((item) =>\n updatedOptionsUIDs.includes(item)\n );\n if (!haveSameValues) {\n setSelectionsToUpdate(next?.options);\n handleOnValues({ optionsUIDs: updatedOptionsUIDs });\n setValid(updatedOptionsUIDs?.length === next?.options?.length);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [sku]\n );\n\n const handleOnErrors = useCallback((_errors: { [id: string]: string }) => {\n if (Object.keys(_errors).length !== 0) setValid(false);\n }, []);\n\n // Product Attributes\n const attributes = useMemo(() => {\n return data?.attributes?.map(({ label, value }, key: number) => {\n const __html = isDateValid(value)\n ? toDateString(value, locale)\n : value.toString();\n\n return (\n <li key={key}>\n {/ eslint-disable-next-line react/no-danger /}\n {label}: <span dangerouslySetInnerHTML={{ __html }} />\n </li>\n );\n });\n }, [data?.attributes, locale]);\n\n const quantity =\n !hideQuantity && data?.inStock ? (\n <Slot\n name=\"Quantity\"\n slot={slots?.Quantity}\n context={{ ...defaultSlotContext }}\n >\n <Incrementer\n key=\"quantity\"\n name=\"quantity\"\n defaultValue={values.quantity.toString()}\n value={values.quantity.toString()}\n min={1}\n aria-label={IncrementerLabel}\n className=\"pdp-product__quantity\"\n onValue={(quantity) => {\n const quantityValue = Number(quantity);\n handleOnValues({ quantity: quantityValue });\n\n // Add quantity to URL parameters if not set to hide\n if (!hideURLParams && data?.options) {\n // Only update URL if the product is not a bundle type\n if (!hasProductViewOptionValueProduct(data.options)) {\n setUrlParams({ quantity: quantityValue });\n }\n }\n }}\n />\n </Slot>\n ) : undefined;\n\n const renderOptions = () => {\n if (data?.options) {\n return (\n <Slot\n name=\"Options\"\n slot={slots?.Options}\n context={{ ...defaultSlotContext }}\n >\n <Swatches\n selectedUIDs={values.optionsUIDs}\n options={data.options}\n defaultOptions={values.optionsUIDs}\n selectionsToUpdate={selectionsToUpdate}\n hideSelectedValue={hideSelectedOptionValue}\n disablePreselections={disableDropdownPreselection}\n onValues={handleOptionSelected}\n onErrors={handleOnErrors}\n />\n </Slot>\n );\n }\n };\n\n return (\n <div {...props}>\n <Product\n title={\n <Slot\n name=\"Title\"\n slot={slots?.Title}\n context={{ ...defaultSlotContext }}\n >\n {data?.name}\n </Slot>\n }\n sku={\n !hideSku ? (\n <Slot\n name=\"SKU\"\n slot={slots?.SKU}\n context={{ ...defaultSlotContext }}\n >\n {data?.sku}\n </Slot>\n ) : undefined\n }\n options={renderOptions()}\n breadcrumbs={\n slots?.Breadcrumbs && (\n <Slot\n name=\"Breadcrumbs\"\n slot={slots?.Breadcrumbs}\n context={{\n ...defaultSlotContext,\n\n setSeparator(callback) {\n this._registerMethod((...attrs) => {\n const nextSeparator = callback(...attrs);\n\n const separator = nextSeparator && (\n <Icon source={nextSeparator} />\n );\n\n this._setProps((prev: any) => {\n return {\n ...prev,\n separator,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={separator}\n categories={prev.categories}\n />,\n ],\n };\n });\n });\n },\n\n appendLink(callback) {\n this._registerMethod((...attrs) => {\n const { text, ...p } = callback(...attrs);\n\n const link = <a {...p}>{text}</a>;\n\n this._setProps((prev: any) => {\n const categories = [...(prev.categories \|\| []), link];\n return {\n ...prev,\n categories,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={prev.separator}\n categories={categories}\n />,\n ],\n };\n });\n });\n },\n\n appendHTMLElement(callback) {\n this._registerMethod((...attrs) => {\n const domElement = callback(...attrs);\n\n const vnode = this._htmlElementToVNode(domElement);\n\n this._setProps((prev: any) => {\n const categories = [...(prev.categories \|\| []), vnode];\n\n return {\n ...prev,\n categories,\n children: [\n // eslint-disable-next-line react/jsx-key\n <Breadcrumbs\n separator={prev.separator}\n categories={categories}\n />,\n ],\n };\n });\n });\n },\n }}\n />\n )\n }\n quantity={quantity}\n actions={\n <Slot\n name=\"Actions\"\n slot={slots?.Actions}\n context={{\n ...defaultSlotContext,\n\n appendButton(callback) {\n this._registerMethod((...attrs) => {\n const _button = callback(...attrs);\n\n if (!_button) return;\n\n const { text, icon, ...buttonProps } = _button;\n\n const button = (\n <Button\n type=\"button\"\n {...buttonProps}\n icon={icon && <Icon source={icon} />}\n >\n {text}\n </Button>\n );\n\n this._setProps((prev: any) => ({\n children: [...(prev.children \|\| []), button],\n }));\n });\n },\n }}\n >\n {\n // Default Add to Cart button if no slot is provided\n !slots?.Actions && (\n <Button\n size=\"medium\"\n type=\"submit\"\n icon={<Icon source=\"Cart\" />}\n disabled={!data?.inStock \|\| !valid}\n aria-label={AddToCartLabel}\n onClick={() => {\n return onAddToCart?.(values);\n }}\n >\n {AddToCartLabel}\n </Button>\n )\n }\n </Slot>\n }\n shortDescription={\n !hideShortDescription ? (\n <Slot\n name=\"ShortDescription\"\n slot={slots?.ShortDescription}\n context={{ ...defaultSlotContext }}\n >\n <div\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{\n __html: data?.shortDescription ?? '',\n }}\n />\n </Slot>\n ) : undefined\n }\n description={\n !hideDescription ? (\n <Slot\n name=\"Description\"\n slot={slots?.Description}\n context={{ ...defaultSlotContext }}\n >\n <div\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{ __html: data?.description ?? '' }}\n />\n </Slot>\n ) : undefined\n }\n images={\n data?.images?.map(({ label, url }) => (\n <Image\n key={url}\n title={label}\n alt={label}\n src={url}\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width={carousel?.imageParams?.width ?? 960}\n height={carousel?.imageParams?.height ?? 1191}\n params={carousel?.imageParams ?? { width: 960 }}\n />\n )) ?? []\n }\n specialPrice={\n data?.prices?.visible ? (\n <Slot\n name=\"SpecialPrice\"\n slot={slots?.SpecialPrice}\n context={{ ...defaultSlotContext }}\n >\n <PriceRange\n {...data.prices?.final}\n locale={toLanguageTag(locale)}\n />\n </Slot>\n ) : undefined\n }\n price={\n data?.prices?.visible &&\n data?.prices?.regular &&\n data?.prices?.final?.amount !== data?.prices?.regular?.amount ? (\n <Slot\n name=\"RegularPrice\"\n slot={slots?.RegularPrice}\n context={{ ...defaultSlotContext }}\n >\n <PriceRange\n {...data.prices?.regular}\n locale={toLanguageTag(locale)}\n />\n </Slot>\n ) : undefined\n }\n zoomType={zoomType}\n closeButton={closeButton}\n carouselConfig={{\n ...carousel,\n thumbnails:\n carousel && Object.keys(carousel).length\n ? data?.images?.map(({ label, url }) => (\n <Image\n key={url}\n title={label}\n alt={label}\n src={url}\n // TODO: change width/height for image aspect ratio\n // pending https://jira.corp.adobe.com/browse/DATA-5122\n width={carousel?.thumbnailParams?.width ?? 200}\n height={carousel?.thumbnailParams?.height ?? 248}\n params={carousel?.thumbnailParams ?? { width: 200 }}\n />\n )) ?? []\n : [],\n }}\n outOfStock={!data?.inStock}\n attributes={\n !hideAttributes ? (\n <Slot\n name=\"Attributes\"\n slot={slots?.Attributes}\n context={{ ...defaultSlotContext }}\n >\n {attributes?.length ? (\n <>\n {DetailsLabel}\n <ul>{attributes}</ul>\n </>\n ) : null}\n </Slot>\n ) : undefined\n }\n galleryContent={\n slots?.GalleryContent && (\n <Slot\n name=\"GalleryContent\"\n slot={slots.GalleryContent}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n infoContent={\n slots?.InfoContent && (\n <Slot\n name=\"InfoContent\"\n slot={slots.InfoContent}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n productContent={\n slots?.Content && (\n <Slot\n name=\"Content\"\n slot={slots.Content}\n context={{ ...defaultSlotContext }}\n />\n )\n }\n />\n </div>\n );\n};\n\n/* @deprecated This method is part of the deprecated ProductDetails component. */\nProductDetails.getInitialData = async function ({\n sku,\n disableDropdownPreselection = false,\n optionsConfig,\n}) {\n const initialData = config.getConfig().models?.ProductDetails?.initialData;\n\n return initialData\n ? transformProductData(initialData)\n : fetchProductData(sku, {\n preselectFirstOption: !disableDropdownPreselection,\n anchors: optionsConfig?.anchorOptions,\n });\n};\n"],"names":["Product","title","breadcrumbs","galleryContent","infoContent","productContent","sku","outOfStock","shortDescription","description","attributes","images","options","price","specialPrice","className","children","quantity","actions","carouselConfig","zoomType","closeButton","props","RegularPriceLabel","useText","SpecialPriceLabel","OutOfStockLabel","ImagesLabel","zoom","setZoom","useState","galleryImages","image","key","alt","_a","jsx","Zoom","VComponent","localThumbnailsImages","jsxs","classes","_b","Carousel","_c","_d","GalleryGrid","_e","_f","_g","_h","_i","Overlay","gap","style","count","Children","child","ProductDetails","hideSku","hideQuantity","hideShortDescription","hideDescription","hideAttributes","hideURLParams","hideSelectedOptionValue","slots","initialData","carousel","optionsConfig","useACDL","onAddToCart","disableDropdownPreselection","AddToCartLabel","IncrementerLabel","DetailsLabel","ChooseOptionLabel","locale","setLocale","config","selectionsToUpdate","setSelectionsToUpdate","data","setData","values","setValues","initialQuantity","getValidatedQuantityFromUrl","defaultValues","valid","setValid","defaultSlotContext","hasProductViewOptionValueProduct","option","useEffect","dataEvent","events","payload","prev","updateDataEvent","localeEvent","fetchProductData","publishProductPageViewEvent","handleOnValues","useCallback","newValues","handleOptionSelected","selections","optionsUIDs","_","value","id","element","setUrlParams","next","processUpdates","previousOptionsUIDs","updatedOptionsUIDs","item","handleOnErrors","_errors","useMemo","label","__html","isDateValid","toDateString","Slot","Incrementer","quantityValue","renderOptions","Swatches","callback","attrs","nextSeparator","separator","Icon","Breadcrumbs","text","p","link","categories","domElement","vnode","_button","icon","buttonProps","button","Button","url","Image","PriceRange","toLanguageTag","_j","_k","Fragment","transformProductData"],"mappings":"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"}

package/containers/ProductPrice.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsxs as D,jsx as r}from"@dropins/tools/preact-jsx-runtime.js";import{useState as d,useEffect as L}from"@dropins/tools/preact-compat.js";import{classes as s,VComponent as f,toLanguageTag as g}from"@dropins/tools/lib.js";import"@dropins/tools/components.js";/* empty css             */import{P}from"../chunks/PriceRange.js";import"@dropins/tools/preact.js";import{useText as b}from"@dropins/tools/i18n.js";import{events as _}from"@dropins/tools/event-bus.js";import{g as h}from"../chunks/getFetchedProductData.js";import{c as v}from"../chunks/isProductConfigurationValid.js";import"../fragments.js";import"@dropins/tools/fetch-graphql.js";const S=({className:t,price:i,specialPrice:a,children:n,...e})=>{const c=b("PDP.Product.RegularPrice.label").label,o=b("PDP.Product.SpecialPrice.label").label;return D("div",{...e,className:s(["pdp-price",t]),children:[a&&r(f,{node:a,className:s(["pdp-price__amount-special","pdp-price__amount"]),"aria-label":o,role:"text"}),i&&r(f,{node:i,className:s(["pdp-price__amount-regular","pdp-price__amount--grey"]),"aria-label":c,role:"text"})]})},N=({initialData:t=null,children:i,...a})=>{var m,u;const{defaultLocale:n="en-US"}=v.getConfig(),[e,c]=d(t),[o,x]=d(n);return L(()=>{const l=_.on("pdp/data",c),p=_.on("locale",x);return()=>{l==null||l.off(),p==null||p.off()}},[]),e?r(S,{...a,specialPrice:(m=e.prices)!=null&&m.visible?r(P,{...e.prices.final,locale:g(o)}):void 0,price:(u=e.prices)!=null&&u.visible&&e.prices.regular&&e.prices.final.amount!==e.prices.regular.amount?r(P,{...e.prices.regular,locale:g(o)}):void 0}):null};N.getInitialData=h;export{N as ProductPrice,N as default};
+import{jsxs as N,jsx as r}from"@dropins/tools/preact-jsx-runtime.js";import{useState as _,useEffect as R}from"@dropins/tools/preact-compat.js";import{classes as s,VComponent as x,toLanguageTag as D}from"@dropins/tools/lib.js";import"@dropins/tools/components.js";/* empty css             */import{P as L}from"../chunks/PriceRange.js";import"@dropins/tools/preact.js";import{useText as h}from"@dropins/tools/i18n.js";import{events as v}from"@dropins/tools/event-bus.js";import{g as j}from"../chunks/getFetchedProductData.js";import{c as C}from"../chunks/isProductConfigurationValid.js";import"../fragments.js";import"@dropins/tools/fetch-graphql.js";const T=({className:t,price:i,specialPrice:a,children:n,...e})=>{const c=h("PDP.Product.RegularPrice.label").label,o=h("PDP.Product.SpecialPrice.label").label;return N("div",{...e,className:s(["pdp-price",t]),children:[a&&r(x,{node:a,className:s(["pdp-price__amount-special","pdp-price__amount"]),"aria-label":o,role:"text"}),i&&r(x,{node:i,className:s(["pdp-price__amount-regular","pdp-price__amount--grey"]),"aria-label":c,role:"text"})]})},y=({initialData:t=null,children:i,...a})=>{var m,u,d,f,g,P,b;const{defaultLocale:n="en-US"}=C.getConfig(),[e,c]=_(t),[o,S]=_(n);return R(()=>{const l=v.on("pdp/data",c),p=v.on("locale",S);return()=>{l==null||l.off(),p==null||p.off()}},[]),!e||!e.prices?null:r(T,{...a,specialPrice:(m=e.prices)!=null&&m.visible?r(L,{...(u=e.prices)==null?void 0:u.final,locale:D(o)}):void 0,price:(d=e.prices)!=null&&d.visible&&((f=e.prices)!=null&&f.regular)&&((g=e.prices)==null?void 0:g.final.amount)!==((P=e.prices)==null?void 0:P.regular.amount)?r(L,{...(b=e.prices)==null?void 0:b.regular,locale:D(o)}):void 0})};y.getInitialData=j;export{y as ProductPrice,y as default};
 //# sourceMappingURL=ProductPrice.js.map

package/containers/ProductPrice.js.map CHANGED Viewed

	@@ -1 +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\nexport const ProductPrice: Container<\n ProductPriceProps,\n ProductModel \| null\n> = ({ initialData = null, 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);\n const localeEvent = events.on('locale', setLocale);\n\n return () => {\n dataEvent?.off();\n localeEvent?.off();\n };\n }, []);\n\n if (!data) 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 {...data.prices.regular} locale={toLanguageTag(locale)} />\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","defaultLocale","config","data","setData","useState","locale","setLocale","useEffect","dataEvent","events","localeEvent","_a","PriceRange","toLanguageTag","_b","getFetchedProductData"],"mappings":"~~ooBA2BO~~,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,ECtCaO,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,SAAAV,EAAU,GAAGC,KAAY,~~SAClD~~,KAAM,CAAE,cAAAU,EAAgB,SAAYC,EAAO,UAAU,EAE/C,CAACC,EAAMC,CAAO,EAAIC,EAA8BL,CAAW,EAE3D,CAACM,EAAQC,CAAS,EAAIF,EAAiBJ,CAAa,~~EAYtD~~,~~OAVJO~~,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYN,CAAO,EACzCO,EAAcD,EAAO,GAAG,SAAUH,CAAS,EAEjD,MAAO,IAAM,CACXE,GAAA,MAAAA,EAAW,MACXE,GAAA,MAAAA,EAAa,KACf,CACF,EAAG,EAAE,~~EAEAR~~,~~EAGHN~~,EAACX,EAAA,CACE,GAAGK,EACJ,cACEqB,EAAAT,EAAK,SAAL,MAAAS,EAAa,UACVC,EAAY,CAAA,~~GAAGV~~,EAAK,~~OAAO~~,MAAO,~~OAAQW~~,~~EAAcR~~,CAAM,CAAG,CAAA,~~EAChE~~,OAEN,~~OACES~~,~~EAAAZ~~,EAAK,SAAL,~~MAAAY~~,EAAa,~~SACbZ~~,EAAK,~~OAAO~~,~~SACZA~~,EAAK,~~OAAO~~,MAAM,~~SAAWA~~,EAAK,~~OAAO~~,QAAQ,~~OAC9CN~~,~~EAAAgB~~,EAAA,~~CAAY~~,~~GAAGV~~,EAAK,~~OAAO~~,~~QAAS~~,~~OAAQW~~,~~EAAcR~~,CAAM,~~CAAG~~,CAAA,~~EAClE~~,MAAA,CAER,~~EAjBgB~~,~~IAmBpB,~~EAEAP,EAAa,~~eAAiBiB~~"}
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\nexport const ProductPrice: Container<\n ProductPriceProps,\n ProductModel \| null\n> = ({ initialData = null, 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);\n const localeEvent = events.on('locale', setLocale);\n\n return () => {\n dataEvent?.off();\n localeEvent?.off();\n };\n }, []);\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","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,ECtCaO,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,SAAAV,EAAU,GAAGC,KAAY,mBAClD,KAAM,CAAE,cAAAU,EAAgB,SAAYC,EAAO,UAAU,EAE/C,CAACC,EAAMC,CAAO,EAAIC,EAA8BL,CAAW,EAE3D,CAACM,EAAQC,CAAS,EAAIF,EAAiBJ,CAAa,EAY1D,OAVAO,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYN,CAAO,EACzCO,EAAcD,EAAO,GAAG,SAAUH,CAAS,EAEjD,MAAO,IAAM,CACXE,GAAA,MAAAA,EAAW,MACXE,GAAA,MAAAA,EAAa,KACf,CACF,EAAG,EAAE,EAED,CAACR,GAAQ,CAACA,EAAK,OAAe,KAGhCN,EAACX,EAAA,CACE,GAAGK,EACJ,cACEqB,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,QACjDtB,EAACgB,EAAA,CACE,IAAGO,EAAAjB,EAAK,SAAL,YAAAiB,EAAa,QACjB,OAAQL,EAAcT,CAAM,CAAA,CAAA,EAE5B,MAAA,CAER,CAEJ,EAEAP,EAAa,eAAiBsB"}

package/package.json CHANGED Viewed

	@@ -1 +1 @@
1	- {"name": "@dropins/storefront-pdp", "version": "1.2.1~~-beta1~~", "@dropins/tools": "~1.3.0", "license": "SEE LICENSE IN LICENSE.md"}
1	+ {"name": "@dropins/storefront-pdp", "version": "1.2.1", "@dropins/tools": "~1.3.0", "license": "SEE LICENSE IN LICENSE.md"}

package/render.js CHANGED Viewed

@@ -1,5 +1,5 @@
 /*! 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__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"});
+(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};
 //# sourceMappingURL=render.js.map