@dropins/storefront-pdp 1.3.1 → 1.4.0-alpha001

package/containers/ProductDetails.js.map

@@ -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","_j","_k","Fragment","transformProductData"],"mappings":"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"}
+{"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  giftCardOptions?: 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  giftCardOptions,\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            {giftCardOptions && (\n              <VComponent\n                node={giftCardOptions}\n                className={classes(['pdp-product__gift-card-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 {\n  Product,\n  Swatches,\n  PriceRange,\n  Option,\n  GiftCardOptions,\n} 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  enteredOptions?: Array<{ uid: string; value: 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  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, id }, key: number) => {\n      // Return empty string for gift card attributes\n      if (id === 'ac_giftcard') {\n        return '';\n      }\n\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  const renderGiftCardOptions = () => {\n    if (data?.attributes) {\n      const giftCardAttributes = data.attributes.filter(\n        (attr) => attr.id === 'ac_giftcard'\n      );\n\n      if (giftCardAttributes.length > 0) {\n        const giftCardElements = giftCardAttributes.map(\n          (giftCardAttr, index) => {\n            try {\n              const giftCardData = JSON.parse(giftCardAttr.value);\n              const prevOptions = values.enteredOptions || [];\n              const optionValues =\n                giftCardData.options?.map((option: any) => {\n                  const existingOption = prevOptions.find(\n                    (opt: { uid: string; value: string }) =>\n                      opt.uid === option.uid\n                  );\n                  return {\n                    id: option.uid,\n                    value: existingOption?.value || '',\n                  };\n                }) || [];\n\n              return (\n                <GiftCardOptions\n                  key={`giftcard-${index}`}\n                  options={giftCardData.options || []}\n                  optionValues={optionValues}\n                  onOptionChange={(uid: string, value: string) => {\n                    const prevOptions = values.enteredOptions || [];\n                    const idx = prevOptions.findIndex(\n                      (field: { uid: string; value: string }) =>\n                        field.uid === uid\n                    );\n                    let newEnteredOptions;\n                    if (idx !== -1) {\n                      newEnteredOptions = prevOptions.map(\n                        (field: { uid: string; value: string }) =>\n                          field.uid === uid ? { ...field, value } : field\n                      );\n                    } else {\n                      newEnteredOptions = [...prevOptions, { uid, value }];\n                    }\n\n                    handleOnValues({ enteredOptions: newEnteredOptions });\n\n                    if (data) {\n                      const updatedData = { ...data };\n                      const giftCardAttributes =\n                        updatedData.attributes?.map((attr) => {\n                          if (attr.id === 'ac_giftcard') {\n                            try {\n                              const giftCardData = JSON.parse(attr.value);\n                              const updatedOptions =\n                                giftCardData.options?.map((option: any) => {\n                                  if (option.uid === uid) {\n                                    return { ...option, value };\n                                  }\n                                  return option;\n                                }) || [];\n                              return {\n                                ...attr,\n                                value: JSON.stringify({\n                                  ...giftCardData,\n                                  options: updatedOptions,\n                                }),\n                              };\n                            } catch (error) {\n                              return attr;\n                            }\n                          }\n                          return attr;\n                        }) || [];\n                      updatedData.attributes = giftCardAttributes;\n                      setData(updatedData);\n                    }\n                  }}\n                  onValidationChange={(valid: boolean) => {\n                    if (!valid) {\n                      handleOnErrors({ giftCard: 'Invalid gift card data' });\n                    }\n\n                    setValid(valid);\n                  }}\n                  className=\"pdp-product__gift-card-options\"\n                />\n              );\n            } catch (error) {\n              console.warn('Invalid gift card data format:', error);\n              return null;\n            }\n          }\n        );\n\n        // Filter out null values and return a single element\n        const validElements = giftCardElements.filter(\n          (element) => element !== null\n        );\n        return validElements.length > 0 ? (\n          <div className=\"pdp-product__gift-card-options-container\">\n            {validElements}\n          </div>\n        ) : undefined;\n      }\n    }\n    return undefined;\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        giftCardOptions={renderGiftCardOptions()}\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","giftCardOptions","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","renderGiftCardOptions","giftCardAttributes","attr","validElements","giftCardAttr","index","giftCardData","prevOptions","optionValues","existingOption","opt","GiftCardOptions","uid","idx","field","newEnteredOptions","updatedData","updatedOptions","error","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/ProductGallery.js

@@ -1,4 +1,4 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsx as A,jsxs as K}from"@dropins/tools/preact-jsx-runtime.js";import{useState as R,useEffect as U,useMemo as w}from"@dropins/tools/preact-compat.js";import{Slot as Z}from"@dropins/tools/lib.js";import{Image as j}from"@dropins/tools/components.js";import{events as V}from"@dropins/tools/event-bus.js";import{g as W}from"../chunks/getFetchedProductData.js";import{Z as X,C as v,O as Y}from"../chunks/Zoom.js";/* empty css             */import{useText as $}from"@dropins/tools/i18n.js";import"@dropins/tools/preact.js";const s=({initialData:G=null,scope:I,controls:k="dots",loop:C=!0,peak:H=!1,gap:N=null,arrows:Q=!0,arrowsOnMainImage:F=!1,zoom:h=!1,imageParams:t,thumbnailParams:o,children:L,slots:l,...q})=>{var y,T,_,S,D,E;const r=$("PDP.Product.Image.label").label,[e,z]=R(G),[f,B]=R(null);U(()=>{const n=V.on("pdp/data",z,{scope:I});return()=>{n==null||n.off()}},[I]);const g=w(()=>({data:e}),[e]),x=w(()=>{var n;return((n=e==null?void 0:e.images)==null?void 0:n.map(({label:i,url:c},p)=>{const d=({...u})=>{var O;const M={title:i,src:c,alt:r==null?void 0:r.replace("{product}",i).replace("{key}",String(p+1)).replace("{total}",String((O=e==null?void 0:e.images)==null?void 0:O.length)),width:(t==null?void 0:t.width)??960,height:(t==null?void 0:t.height)??1191,params:t??{width:960},loading:p===0?"eager":"lazy",...u};return A(Z,{name:"CarouselMainImage",slot:l==null?void 0:l.CarouselMainImage,context:{...g,defaultImageProps:M},children:A(j,{...M})})};return h?A(X,{closeButton:typeof h=="object"?h.closeButton:!1,children:A(d,{})},c):A(d,{onClick:()=>B(p)},c)}))??A("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product-gallery__images__placeholder",width:(t==null?void 0:t.width)??960,height:(t==null?void 0:t.height)??1191,"aria-hidden":!0},"pleaceholder")},[r,e==null?void 0:e.images,t,h,g,l==null?void 0:l.CarouselMainImage]),J=w(()=>{var n;return((n=e==null?void 0:e.images)==null?void 0:n.map(({label:i,url:c},p)=>{var u;const d={title:i,src:c,alt:r==null?void 0:r.replace("{product}",i).replace("{key}",String(p+1)).replace("{total}",String((u=e==null?void 0:e.images)==null?void 0:u.length)),width:(o==null?void 0:o.width)??200,height:(o==null?void 0:o.height)??248,params:o??{width:200},loading:"lazy"};return A(Z,{name:"CarouselThumbnail",slotTag:"span",contentTag:"span",slot:l==null?void 0:l.CarouselThumbnail,context:{...g,defaultImageProps:d},children:A(j,{...d})},c)}))??A("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product-gallery__thumbnail__placeholder",width:(o==null?void 0:o.width)??200,height:(o==null?void 0:o.height)??248,"aria-hidden":!0},"pleaceholder")},[r,e==null?void 0:e.images,o,g,l==null?void 0:l.CarouselThumbnail]);return e?K("div",{...q,children:[A(v,{arrows:!!((y=e==null?void 0:e.images)!=null&&y.length)&&Q,arrowsOnMainImage:F,controls:(T=e==null?void 0:e.images)!=null&&T.length?k:void 0,loop:C&&!!((_=e.images)!=null&&_.length),peak:!!((S=e==null?void 0:e.images)!=null&&S.length)&&H,gap:N,defaultIndex:f||0,thumbnails:J,children:x}),f===null?null:A(Y,{onClose:()=>B(null),centered:!0,children:A(v,{arrows:!!((D=e==null?void 0:e.images)!=null&&D.length),width:"100%",height:"100%",defaultIndex:f,loop:C&&!!((E=e.images)!=null&&E.length),controls:"dots",isZoomed:!0,children:x})})]}):null};s.getInitialData=W;export{s as ProductGallery,s as default};
+import{jsx as A,jsxs as K}from"@dropins/tools/preact-jsx-runtime.js";import{useState as R,useEffect as U,useMemo as w}from"@dropins/tools/preact-compat.js";import{Slot as Z}from"@dropins/tools/lib.js";import{Image as j}from"@dropins/tools/components.js";import{events as V}from"@dropins/tools/event-bus.js";import{g as W}from"../chunks/getFetchedProductData.js";import{Z as X,C as v,O as Y}from"../chunks/Zoom.js";/* empty css             */import"@dropins/tools/preact-hooks.js";/* empty css                       */import{useText as $}from"@dropins/tools/i18n.js";import"@dropins/tools/preact.js";const s=({initialData:G=null,scope:I,controls:k="dots",loop:C=!0,peak:H=!1,gap:N=null,arrows:Q=!0,arrowsOnMainImage:F=!1,zoom:h=!1,imageParams:t,thumbnailParams:o,children:L,slots:l,...q})=>{var y,T,_,S,D,E;const r=$("PDP.Product.Image.label").label,[e,z]=R(G),[f,B]=R(null);U(()=>{const n=V.on("pdp/data",z,{scope:I});return()=>{n==null||n.off()}},[I]);const g=w(()=>({data:e}),[e]),x=w(()=>{var n;return((n=e==null?void 0:e.images)==null?void 0:n.map(({label:i,url:c},p)=>{const d=({...u})=>{var O;const M={title:i,src:c,alt:r==null?void 0:r.replace("{product}",i).replace("{key}",String(p+1)).replace("{total}",String((O=e==null?void 0:e.images)==null?void 0:O.length)),width:(t==null?void 0:t.width)??960,height:(t==null?void 0:t.height)??1191,params:t??{width:960},loading:p===0?"eager":"lazy",...u};return A(Z,{name:"CarouselMainImage",slot:l==null?void 0:l.CarouselMainImage,context:{...g,defaultImageProps:M},children:A(j,{...M})})};return h?A(X,{closeButton:typeof h=="object"?h.closeButton:!1,children:A(d,{})},c):A(d,{onClick:()=>B(p)},c)}))??A("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product-gallery__images__placeholder",width:(t==null?void 0:t.width)??960,height:(t==null?void 0:t.height)??1191,"aria-hidden":!0},"pleaceholder")},[r,e==null?void 0:e.images,t,h,g,l==null?void 0:l.CarouselMainImage]),J=w(()=>{var n;return((n=e==null?void 0:e.images)==null?void 0:n.map(({label:i,url:c},p)=>{var u;const d={title:i,src:c,alt:r==null?void 0:r.replace("{product}",i).replace("{key}",String(p+1)).replace("{total}",String((u=e==null?void 0:e.images)==null?void 0:u.length)),width:(o==null?void 0:o.width)??200,height:(o==null?void 0:o.height)??248,params:o??{width:200},loading:"lazy"};return A(Z,{name:"CarouselThumbnail",slotTag:"span",contentTag:"span",slot:l==null?void 0:l.CarouselThumbnail,context:{...g,defaultImageProps:d},children:A(j,{...d})},c)}))??A("img",{src:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",className:"pdp-product-gallery__thumbnail__placeholder",width:(o==null?void 0:o.width)??200,height:(o==null?void 0:o.height)??248,"aria-hidden":!0},"pleaceholder")},[r,e==null?void 0:e.images,o,g,l==null?void 0:l.CarouselThumbnail]);return e?K("div",{...q,children:[A(v,{arrows:!!((y=e==null?void 0:e.images)!=null&&y.length)&&Q,arrowsOnMainImage:F,controls:(T=e==null?void 0:e.images)!=null&&T.length?k:void 0,loop:C&&!!((_=e.images)!=null&&_.length),peak:!!((S=e==null?void 0:e.images)!=null&&S.length)&&H,gap:N,defaultIndex:f||0,thumbnails:J,children:x}),f===null?null:A(Y,{onClose:()=>B(null),centered:!0,children:A(v,{arrows:!!((D=e==null?void 0:e.images)!=null&&D.length),width:"100%",height:"100%",defaultIndex:f,loop:C&&!!((E=e.images)!=null&&E.length),controls:"dots",isZoomed:!0,children:x})})]}):null};s.getInitialData=W;export{s as ProductGallery,s as default};
 //# sourceMappingURL=ProductGallery.js.map

package/containers/ProductGallery.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProductGallery.js","sources":["/@dropins/storefront-pdp/src/containers/ProductGallery/ProductGallery.tsx"],"sourcesContent":["import { HTMLAttributes, useEffect, useMemo, useState } from 'preact/compat';\nimport {\n  Container,\n  ResolveImageUrlOptions,\n  Slot,\n  SlotProps,\n} from '@adobe-commerce/elsie/lib';\n\nimport { Image, ImageProps } from '@adobe-commerce/elsie/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { ProductModel } from '@/pdp/data/models/product-model';\nimport { getFetchedProductData } from '@/pdp/api';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Carousel, Overlay, Zoom } from '@/pdp/components';\n\ntype DefaultSlotContext = {\n  data: ProductModel | null;\n};\n\nexport interface ProductGalleryProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'controls'> {\n  scope?: string;\n  controls?: 'thumbnailsRow' | 'thumbnailsColumn' | 'dots' | null;\n  loop?: boolean;\n  peak?: boolean;\n  gap?: 'small' | 'medium' | 'large' | null;\n  arrows?: boolean;\n  arrowsOnMainImage?: boolean;\n  imageParams?: ResolveImageUrlOptions;\n  thumbnailParams?: ResolveImageUrlOptions;\n  zoom?: { closeButton: boolean } | boolean;\n  slots?: {\n    CarouselThumbnail?: SlotProps<\n      DefaultSlotContext & { defaultImageProps: ImageProps }\n    >;\n    CarouselMainImage?: SlotProps<\n      DefaultSlotContext & { defaultImageProps: ImageProps }\n    >;\n  };\n}\n\nexport const ProductGallery: Container<\n  ProductGalleryProps,\n  ProductModel | null\n> = ({\n  initialData = null,\n  scope,\n  controls = 'dots',\n  loop = true,\n  peak = false,\n  gap = null,\n  arrows = true,\n  arrowsOnMainImage = false,\n  zoom = false,\n  imageParams,\n  thumbnailParams,\n  children,\n  slots,\n  ...props\n}) => {\n  const ImagesLabel = useText('PDP.Product.Image.label').label;\n\n  const [data, setData] = useState<ProductModel | null>(initialData);\n\n  const [zoomTo, setZoomTo] = useState<number | null>(null);\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n    return () => {\n      dataEvent?.off();\n    };\n  }, [scope]);\n\n  const defaultSlotContext: DefaultSlotContext = useMemo(\n    () => ({ data }),\n    [data]\n  );\n\n  const images = useMemo(\n    () =>\n      data?.images?.map(({ label, url }, key) => {\n        const Item = ({ ...itemProps }) => {\n          const defaultProps = {\n            title: label,\n            src: url,\n            alt: ImagesLabel?.replace('{product}', label)\n              .replace('{key}', String(key + 1))\n              .replace('{total}', String(data?.images?.length)),\n\n            // TODO: change width/height for image aspect ratio\n            // pending https://jira.corp.adobe.com/browse/DATA-5122\n            width: imageParams?.width ?? 960,\n            height: imageParams?.height ?? 1191,\n            params: imageParams ?? { width: 960 },\n            loading: key === 0 ? 'eager' : 'lazy',\n            ...itemProps,\n          } as const;\n\n          return (\n            <Slot\n              name=\"CarouselMainImage\"\n              slot={slots?.CarouselMainImage}\n              context={{\n                ...defaultSlotContext,\n                defaultImageProps: defaultProps,\n              }}\n            >\n              <Image {...defaultProps} />\n            </Slot>\n          );\n        };\n\n        return zoom ? (\n          <Zoom\n            key={url}\n            closeButton={typeof zoom === 'object' ? zoom.closeButton : false}\n          >\n            <Item />\n          </Zoom>\n        ) : (\n          <Item key={url} onClick={() => setZoomTo(key)} />\n        );\n      }) ?? (\n        <img\n          key=\"pleaceholder\"\n          src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n          className=\"pdp-product-gallery__images__placeholder\"\n          width={imageParams?.width ?? 960}\n          height={imageParams?.height ?? 1191}\n          aria-hidden\n        />\n      ),\n    [\n      ImagesLabel,\n      data?.images,\n      imageParams,\n      zoom,\n      defaultSlotContext,\n      slots?.CarouselMainImage,\n    ]\n  );\n\n  const thumbnails = useMemo(() => {\n    return (\n      data?.images?.map(({ label, url }, key) => {\n        const defaultProps = {\n          title: label,\n          src: url,\n          alt: ImagesLabel?.replace('{product}', label)\n            .replace('{key}', String(key + 1))\n            .replace('{total}', String(data?.images?.length)),\n\n          // TODO: change width/height for image aspect ratio\n          // pending https://jira.corp.adobe.com/browse/DATA-5122\n          width: thumbnailParams?.width ?? 200,\n          height: thumbnailParams?.height ?? 248,\n          params: thumbnailParams ?? { width: 200 },\n          loading: 'lazy',\n        } as const;\n\n        return (\n          <Slot\n            key={url}\n            name=\"CarouselThumbnail\"\n            slotTag=\"span\"\n            contentTag=\"span\"\n            slot={slots?.CarouselThumbnail}\n            context={{\n              ...defaultSlotContext,\n              defaultImageProps: defaultProps,\n            }}\n          >\n            <Image {...defaultProps} />\n          </Slot>\n        );\n      }) ?? (\n        <img\n          key=\"pleaceholder\"\n          src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n          className=\"pdp-product-gallery__thumbnail__placeholder\"\n          width={thumbnailParams?.width ?? 200}\n          height={thumbnailParams?.height ?? 248}\n          aria-hidden\n        />\n      )\n    );\n  }, [\n    ImagesLabel,\n    data?.images,\n    thumbnailParams,\n    defaultSlotContext,\n    slots?.CarouselThumbnail,\n  ]);\n\n  if (!data) return null;\n\n  return (\n    <div {...props}>\n      {/* Carousel */}\n      <Carousel\n        arrows={!!data?.images?.length && arrows}\n        arrowsOnMainImage={arrowsOnMainImage}\n        controls={data?.images?.length ? controls : undefined}\n        loop={loop && !!data.images?.length}\n        peak={!!data?.images?.length && peak}\n        gap={gap}\n        defaultIndex={zoomTo || 0}\n        thumbnails={thumbnails}\n      >\n        {images}\n      </Carousel>\n\n      {/* Zoom Overlay */}\n      {zoomTo === null ? null : (\n        <Overlay onClose={() => setZoomTo(null)} centered>\n          <Carousel\n            arrows={!!data?.images?.length}\n            width=\"100%\"\n            height=\"100%\"\n            defaultIndex={zoomTo}\n            loop={loop && !!data.images?.length}\n            controls=\"dots\"\n            isZoomed\n          >\n            {images}\n          </Carousel>\n        </Overlay>\n      )}\n    </div>\n  );\n};\n\nProductGallery.getInitialData = getFetchedProductData;\n"],"names":["ProductGallery","initialData","scope","controls","loop","peak","gap","arrows","arrowsOnMainImage","zoom","imageParams","thumbnailParams","children","slots","props","ImagesLabel","useText","data","setData","useState","zoomTo","setZoomTo","useEffect","dataEvent","events","defaultSlotContext","useMemo","images","_a","label","url","key","Item","itemProps","defaultProps","jsx","Slot","Image","Zoom","thumbnails","jsxs","Carousel","_b","_c","_d","Overlay","_e","_f","getFetchedProductData"],"mappings":"2gBAyCO,MAAMA,EAGT,CAAC,CACH,YAAAC,EAAc,KACd,MAAAC,EACA,SAAAC,EAAW,OACX,KAAAC,EAAO,GACP,KAAAC,EAAO,GACP,IAAAC,EAAM,KACN,OAAAC,EAAS,GACT,kBAAAC,EAAoB,GACpB,KAAAC,EAAO,GACP,YAAAC,EACA,gBAAAC,EACA,SAAAC,EACA,MAAAC,EACA,GAAGC,CACL,IAAM,iBACE,MAAAC,EAAcC,EAAQ,yBAAyB,EAAE,MAEjD,CAACC,EAAMC,CAAO,EAAIC,EAA8BlB,CAAW,EAE3D,CAACmB,EAAQC,CAAS,EAAIF,EAAwB,IAAI,EAExDG,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYN,EAAS,CAAE,MAAAhB,EAAO,EAC1D,MAAO,IAAM,CACXqB,GAAA,MAAAA,EAAW,KACb,CAAA,EACC,CAACrB,CAAK,CAAC,EAEV,MAAMuB,EAAyCC,EAC7C,KAAO,CAAE,KAAAT,CAAK,GACd,CAACA,CAAI,CACP,EAEMU,EAASD,EACb,IACE,OAAA,QAAAE,EAAAX,GAAA,YAAAA,EAAM,SAAN,YAAAW,EAAc,IAAI,CAAC,CAAE,MAAAC,EAAO,IAAAC,CAAI,EAAGC,IAAQ,CACzC,MAAMC,EAAO,CAAC,CAAE,GAAGC,KAAgB,OACjC,MAAMC,EAAe,CACnB,MAAOL,EACP,IAAKC,EACL,IAAKf,GAAA,YAAAA,EAAa,QAAQ,YAAac,GACpC,QAAQ,QAAS,OAAOE,EAAM,CAAC,GAC/B,QAAQ,UAAW,QAAOH,EAAAX,GAAA,YAAAA,EAAM,SAAN,YAAAW,EAAc,MAAM,GAIjD,OAAOlB,GAAA,YAAAA,EAAa,QAAS,IAC7B,QAAQA,GAAA,YAAAA,EAAa,SAAU,KAC/B,OAAQA,GAAe,CAAE,MAAO,GAAI,EACpC,QAASqB,IAAQ,EAAI,QAAU,OAC/B,GAAGE,CACL,EAGE,OAAAE,EAACC,EAAA,CACC,KAAK,oBACL,KAAMvB,GAAA,YAAAA,EAAO,kBACb,QAAS,CACP,GAAGY,EACH,kBAAmBS,CACrB,EAEA,SAAAC,EAACE,EAAO,CAAA,GAAGH,CAAc,CAAA,CAAA,CAC3B,CAEJ,EAEA,OAAOzB,EACL0B,EAACG,EAAA,CAEC,YAAa,OAAO7B,GAAS,SAAWA,EAAK,YAAc,GAE3D,WAACuB,EAAK,CAAA,CAAA,CAAA,EAHDF,CAAA,IAMNE,EAAe,CAAA,QAAS,IAAMX,EAAUU,CAAG,GAAjCD,CAAoC,CAElD,KACCK,EAAC,MAAA,CAEC,IAAI,iFACJ,UAAU,2CACV,OAAOzB,GAAA,YAAAA,EAAa,QAAS,IAC7B,QAAQA,GAAA,YAAAA,EAAa,SAAU,KAC/B,cAAW,EAAA,EALP,cAMN,GAEJ,CACEK,EACAE,GAAA,YAAAA,EAAM,OACNP,EACAD,EACAgB,EACAZ,GAAA,YAAAA,EAAO,iBAAA,CAEX,EAEM0B,EAAab,EAAQ,IAAM,OAE7B,QAAAE,EAAAX,GAAA,YAAAA,EAAM,SAAN,YAAAW,EAAc,IAAI,CAAC,CAAE,MAAAC,EAAO,IAAAC,GAAOC,IAAQ,OACzC,MAAMG,EAAe,CACnB,MAAOL,EACP,IAAKC,EACL,IAAKf,GAAA,YAAAA,EAAa,QAAQ,YAAac,GACpC,QAAQ,QAAS,OAAOE,EAAM,CAAC,GAC/B,QAAQ,UAAW,QAAOH,EAAAX,GAAA,YAAAA,EAAM,SAAN,YAAAW,EAAc,MAAM,GAIjD,OAAOjB,GAAA,YAAAA,EAAiB,QAAS,IACjC,QAAQA,GAAA,YAAAA,EAAiB,SAAU,IACnC,OAAQA,GAAmB,CAAE,MAAO,GAAI,EACxC,QAAS,MACX,EAGE,OAAAwB,EAACC,EAAA,CAEC,KAAK,oBACL,QAAQ,OACR,WAAW,OACX,KAAMvB,GAAA,YAAAA,EAAO,kBACb,QAAS,CACP,GAAGY,EACH,kBAAmBS,CACrB,EAEA,SAAAC,EAACE,EAAO,CAAA,GAAGH,CAAc,CAAA,CAAA,EAVpBJ,CAWP,CAEH,KACCK,EAAC,MAAA,CAEC,IAAI,iFACJ,UAAU,8CACV,OAAOxB,GAAA,YAAAA,EAAiB,QAAS,IACjC,QAAQA,GAAA,YAAAA,EAAiB,SAAU,IACnC,cAAW,EAAA,EALP,cAMN,CAAA,EAGH,CACDI,EACAE,GAAA,YAAAA,EAAM,OACNN,EACAc,EACAZ,GAAA,YAAAA,EAAO,iBAAA,CACR,EAEG,OAACI,EAGHuB,EAAC,MAAK,CAAA,GAAG1B,EAEP,SAAA,CAAAqB,EAACM,EAAA,CACC,OAAQ,CAAC,GAACb,EAAAX,GAAA,YAAAA,EAAM,SAAN,MAAAW,EAAc,SAAUrB,EAClC,kBAAAC,EACA,UAAUkC,EAAAzB,GAAA,YAAAA,EAAM,SAAN,MAAAyB,EAAc,OAASvC,EAAW,OAC5C,KAAMC,GAAQ,CAAC,GAACuC,EAAA1B,EAAK,SAAL,MAAA0B,EAAa,QAC7B,KAAM,CAAC,GAACC,EAAA3B,GAAA,YAAAA,EAAM,SAAN,MAAA2B,EAAc,SAAUvC,EAChC,IAAAC,EACA,aAAcc,GAAU,EACxB,WAAAmB,EAEC,SAAAZ,CAAA,CACH,EAGCP,IAAW,KAAO,KAChBe,EAAAU,EAAA,CAAQ,QAAS,IAAMxB,EAAU,IAAI,EAAG,SAAQ,GAC/C,SAAAc,EAACM,EAAA,CACC,OAAQ,CAAC,GAACK,EAAA7B,GAAA,YAAAA,EAAM,SAAN,MAAA6B,EAAc,QACxB,MAAM,OACN,OAAO,OACP,aAAc1B,EACd,KAAMhB,GAAQ,CAAC,GAAC2C,EAAA9B,EAAK,SAAL,MAAA8B,EAAa,QAC7B,SAAS,OACT,SAAQ,GAEP,SAAApB,CAAA,CAAA,CAEL,CAAA,CAAA,EAEJ,EAlCgB,IAoCpB,EAEA3B,EAAe,eAAiBgD"}
+{"version":3,"file":"ProductGallery.js","sources":["/@dropins/storefront-pdp/src/containers/ProductGallery/ProductGallery.tsx"],"sourcesContent":["import { HTMLAttributes, useEffect, useMemo, useState } from 'preact/compat';\nimport {\n  Container,\n  ResolveImageUrlOptions,\n  Slot,\n  SlotProps,\n} from '@adobe-commerce/elsie/lib';\n\nimport { Image, ImageProps } from '@adobe-commerce/elsie/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { ProductModel } from '@/pdp/data/models/product-model';\nimport { getFetchedProductData } from '@/pdp/api';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Carousel, Overlay, Zoom } from '@/pdp/components';\n\ntype DefaultSlotContext = {\n  data: ProductModel | null;\n};\n\nexport interface ProductGalleryProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'controls'> {\n  scope?: string;\n  controls?: 'thumbnailsRow' | 'thumbnailsColumn' | 'dots' | null;\n  loop?: boolean;\n  peak?: boolean;\n  gap?: 'small' | 'medium' | 'large' | null;\n  arrows?: boolean;\n  arrowsOnMainImage?: boolean;\n  imageParams?: ResolveImageUrlOptions;\n  thumbnailParams?: ResolveImageUrlOptions;\n  zoom?: { closeButton: boolean } | boolean;\n  slots?: {\n    CarouselThumbnail?: SlotProps<\n      DefaultSlotContext & { defaultImageProps: ImageProps }\n    >;\n    CarouselMainImage?: SlotProps<\n      DefaultSlotContext & { defaultImageProps: ImageProps }\n    >;\n  };\n}\n\nexport const ProductGallery: Container<\n  ProductGalleryProps,\n  ProductModel | null\n> = ({\n  initialData = null,\n  scope,\n  controls = 'dots',\n  loop = true,\n  peak = false,\n  gap = null,\n  arrows = true,\n  arrowsOnMainImage = false,\n  zoom = false,\n  imageParams,\n  thumbnailParams,\n  children,\n  slots,\n  ...props\n}) => {\n  const ImagesLabel = useText('PDP.Product.Image.label').label;\n\n  const [data, setData] = useState<ProductModel | null>(initialData);\n\n  const [zoomTo, setZoomTo] = useState<number | null>(null);\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n    return () => {\n      dataEvent?.off();\n    };\n  }, [scope]);\n\n  const defaultSlotContext: DefaultSlotContext = useMemo(\n    () => ({ data }),\n    [data]\n  );\n\n  const images = useMemo(\n    () =>\n      data?.images?.map(({ label, url }, key) => {\n        const Item = ({ ...itemProps }) => {\n          const defaultProps = {\n            title: label,\n            src: url,\n            alt: ImagesLabel?.replace('{product}', label)\n              .replace('{key}', String(key + 1))\n              .replace('{total}', String(data?.images?.length)),\n\n            // TODO: change width/height for image aspect ratio\n            // pending https://jira.corp.adobe.com/browse/DATA-5122\n            width: imageParams?.width ?? 960,\n            height: imageParams?.height ?? 1191,\n            params: imageParams ?? { width: 960 },\n            loading: key === 0 ? 'eager' : 'lazy',\n            ...itemProps,\n          } as const;\n\n          return (\n            <Slot\n              name=\"CarouselMainImage\"\n              slot={slots?.CarouselMainImage}\n              context={{\n                ...defaultSlotContext,\n                defaultImageProps: defaultProps,\n              }}\n            >\n              <Image {...defaultProps} />\n            </Slot>\n          );\n        };\n\n        return zoom ? (\n          <Zoom\n            key={url}\n            closeButton={typeof zoom === 'object' ? zoom.closeButton : false}\n          >\n            <Item />\n          </Zoom>\n        ) : (\n          <Item key={url} onClick={() => setZoomTo(key)} />\n        );\n      }) ?? (\n        <img\n          key=\"pleaceholder\"\n          src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n          className=\"pdp-product-gallery__images__placeholder\"\n          width={imageParams?.width ?? 960}\n          height={imageParams?.height ?? 1191}\n          aria-hidden\n        />\n      ),\n    [\n      ImagesLabel,\n      data?.images,\n      imageParams,\n      zoom,\n      defaultSlotContext,\n      slots?.CarouselMainImage,\n    ]\n  );\n\n  const thumbnails = useMemo(() => {\n    return (\n      data?.images?.map(({ label, url }, key) => {\n        const defaultProps = {\n          title: label,\n          src: url,\n          alt: ImagesLabel?.replace('{product}', label)\n            .replace('{key}', String(key + 1))\n            .replace('{total}', String(data?.images?.length)),\n\n          // TODO: change width/height for image aspect ratio\n          // pending https://jira.corp.adobe.com/browse/DATA-5122\n          width: thumbnailParams?.width ?? 200,\n          height: thumbnailParams?.height ?? 248,\n          params: thumbnailParams ?? { width: 200 },\n          loading: 'lazy',\n        } as const;\n\n        return (\n          <Slot\n            key={url}\n            name=\"CarouselThumbnail\"\n            slotTag=\"span\"\n            contentTag=\"span\"\n            slot={slots?.CarouselThumbnail}\n            context={{\n              ...defaultSlotContext,\n              defaultImageProps: defaultProps,\n            }}\n          >\n            <Image {...defaultProps} />\n          </Slot>\n        );\n      }) ?? (\n        <img\n          key=\"pleaceholder\"\n          src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"\n          className=\"pdp-product-gallery__thumbnail__placeholder\"\n          width={thumbnailParams?.width ?? 200}\n          height={thumbnailParams?.height ?? 248}\n          aria-hidden\n        />\n      )\n    );\n  }, [\n    ImagesLabel,\n    data?.images,\n    thumbnailParams,\n    defaultSlotContext,\n    slots?.CarouselThumbnail,\n  ]);\n\n  if (!data) return null;\n\n  return (\n    <div {...props}>\n      {/* Carousel */}\n      <Carousel\n        arrows={!!data?.images?.length && arrows}\n        arrowsOnMainImage={arrowsOnMainImage}\n        controls={data?.images?.length ? controls : undefined}\n        loop={loop && !!data.images?.length}\n        peak={!!data?.images?.length && peak}\n        gap={gap}\n        defaultIndex={zoomTo || 0}\n        thumbnails={thumbnails}\n      >\n        {images}\n      </Carousel>\n\n      {/* Zoom Overlay */}\n      {zoomTo === null ? null : (\n        <Overlay onClose={() => setZoomTo(null)} centered>\n          <Carousel\n            arrows={!!data?.images?.length}\n            width=\"100%\"\n            height=\"100%\"\n            defaultIndex={zoomTo}\n            loop={loop && !!data.images?.length}\n            controls=\"dots\"\n            isZoomed\n          >\n            {images}\n          </Carousel>\n        </Overlay>\n      )}\n    </div>\n  );\n};\n\nProductGallery.getInitialData = getFetchedProductData;\n"],"names":["ProductGallery","initialData","scope","controls","loop","peak","gap","arrows","arrowsOnMainImage","zoom","imageParams","thumbnailParams","children","slots","props","ImagesLabel","useText","data","setData","useState","zoomTo","setZoomTo","useEffect","dataEvent","events","defaultSlotContext","useMemo","images","_a","label","url","key","Item","itemProps","defaultProps","jsx","Slot","Image","Zoom","thumbnails","jsxs","Carousel","_b","_c","_d","Overlay","_e","_f","getFetchedProductData"],"mappings":"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"}

package/containers/ProductGiftCardOptions/ProductGiftCardOptions.d.ts

@@ -0,0 +1,9 @@
+import { HTMLAttributes } from 'preact/compat';
+import { Container } from '@dropins/tools/types/elsie/src/lib';
+import { ProductModel } from '../../data/models';
+
+export interface ProductGiftCardOptionsProps extends HTMLAttributes<HTMLDivElement> {
+    scope?: string;
+}
+export declare const ProductGiftCardOptions: Container<ProductGiftCardOptionsProps, ProductModel | null>;
+//# sourceMappingURL=ProductGiftCardOptions.d.ts.map

package/containers/ProductGiftCardOptions/index.d.ts

@@ -0,0 +1,18 @@
+/**
+ * ADOBE CONFIDENTIAL
+ * __________________
+ * Copyright 2023 Adobe
+ * All Rights Reserved.
+ * __________________
+ * NOTICE: All information contained herein is, and remains
+ * the property of Adobe and its suppliers, if any. The intellectual
+ * and technical concepts contained herein are proprietary to Adobe
+ * and its suppliers and are protected by all applicable intellectual
+ * property laws, including trade secret and copyright laws.
+ * Dissemination of this information or reproduction of this material
+ * is strictly forbidden unless prior written permission is obtained
+ * from Adobe.
+ */
+export * from './ProductGiftCardOptions';
+export { ProductGiftCardOptions as default } from './ProductGiftCardOptions';
+//# sourceMappingURL=index.d.ts.map

package/containers/ProductGiftCardOptions.d.ts

@@ -0,0 +1,3 @@
+export * from './ProductGiftCardOptions/index'
+import _default from './ProductGiftCardOptions/index'
+export default _default

package/containers/ProductGiftCardOptions.js

@@ -0,0 +1,4 @@
+/*! Copyright 2025 Adobe
+All Rights Reserved. */
+import{jsx as l}from"@dropins/tools/preact-jsx-runtime.js";import{useState as m,useEffect as N}from"@dropins/tools/preact-compat.js";import{classes as x}from"@dropins/tools/lib.js";import{events as f}from"@dropins/tools/event-bus.js";import{a as y,s as D}from"../chunks/isProductConfigurationValid.js";import{g as P}from"../chunks/getFetchedProductData.js";import{G as v}from"../chunks/GiftCardOptions2.js";import"@dropins/tools/preact-hooks.js";import"@dropins/tools/components.js";/* empty css                       */import"@dropins/tools/i18n.js";const G=({initialData:g=null,scope:p,children:I,...s})=>{var d;const[a,O]=m(g),[c,h]=m({sku:"",quantity:1,enteredOptions:[]});N(()=>{const t=f.on("pdp/data",O,{scope:p}),n=f.on("pdp/values",h,{eager:!0});return()=>{t==null||t.off(),n==null||n.off()}},[p]);const C=(t,n)=>{const r=c.enteredOptions||[],i=r.findIndex(e=>e.uid===t);let o;i!==-1?o=r.map(e=>e.uid===t?{...e,value:n}:e):o=[...r,{uid:t,value:n}],D(e=>({...e,enteredOptions:o}))},V=t=>{y(()=>t)};return a?l("div",{...s,className:x(["pdp-gift-card-options",s.className]),children:(d=a==null?void 0:a.attributes)==null?void 0:d.map(({id:t,value:n},r)=>{var o,e;if(t!=="ac_giftcard")return null;let i={options:[]};try{i=JSON.parse(n)}catch{}return l(v,{options:i.options,className:s.className,optionValues:(c.enteredOptions||[]).map(u=>({id:u.uid,value:u.value})),currency:(e=(o=a.prices)==null?void 0:o.final)==null?void 0:e.currency,onOptionChange:C,onValidationChange:V},`giftcard-${r}`)})}):null};G.getInitialData=P;export{G as ProductGiftCardOptions,G as default};
+//# sourceMappingURL=ProductGiftCardOptions.js.map

package/containers/ProductGiftCardOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProductGiftCardOptions.js","sources":["/@dropins/storefront-pdp/src/containers/ProductGiftCardOptions/ProductGiftCardOptions.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { HTMLAttributes, useEffect, useState } from 'preact/compat';\nimport { Container, classes } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\nimport { ProductModel } from '@/pdp/data/models';\nimport { Option, ValuesModel } from '@/pdp/data/models/values-model';\nimport {\n  getFetchedProductData,\n  setProductConfigurationValid,\n  setProductConfigurationValues,\n} from '@/pdp/api';\nimport { GiftCardOptions } from '@/pdp/components/GiftCardOptions';\n\nexport interface ProductGiftCardOptionsProps\n  extends HTMLAttributes<HTMLDivElement> {\n  scope?: string;\n}\n\nexport const ProductGiftCardOptions: Container<\n  ProductGiftCardOptionsProps,\n  ProductModel | null\n> = ({ initialData = null, scope, children, ...props }) => {\n  const [data, setData] = useState<ProductModel | null>(initialData);\n  const [values, setValues] = useState<ValuesModel>({\n    sku: '',\n    quantity: 1,\n    enteredOptions: [],\n  });\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n    const valuesEvent = events.on('pdp/values', setValues, { eager: true });\n\n    return () => {\n      dataEvent?.off();\n      valuesEvent?.off();\n    };\n  }, [scope]);\n\n  const handleOptionChange = (uid: string, value: string) => {\n    const prevOptions = values.enteredOptions || [];\n    const idx = prevOptions.findIndex((field) => field.uid === uid);\n    let newEnteredOptions;\n    if (idx !== -1) {\n      newEnteredOptions = prevOptions.map((field) =>\n        field.uid === uid ? { ...field, value } : field\n      );\n    } else {\n      newEnteredOptions = [...prevOptions, { uid, value }];\n    }\n\n    setProductConfigurationValues((prev) => ({\n      ...prev,\n      enteredOptions: newEnteredOptions,\n    }));\n  };\n\n  const handleValidationChange = (valid: boolean) => {\n    setProductConfigurationValid(() => valid);\n  };\n\n  if (!data) return null;\n\n  return (\n    <div\n      {...props}\n      className={classes(['pdp-gift-card-options', props.className])}\n    >\n      {data?.attributes?.map(\n        ({ id, value }: { id: string; value: any }, index: number) => {\n          if (id !== 'ac_giftcard') {\n            return null;\n          }\n          let optionData: { options: Option[] } = { options: [] };\n          try {\n            optionData = JSON.parse(value);\n          } catch {}\n\n          return (\n            <GiftCardOptions\n              key={`giftcard-${index}`}\n              options={optionData.options}\n              className={props.className}\n              optionValues={(values.enteredOptions || []).map((opt) => ({\n                id: opt.uid,\n                value: opt.value,\n              }))}\n              currency={data.prices?.final?.currency}\n              onOptionChange={handleOptionChange}\n              onValidationChange={handleValidationChange}\n            />\n          );\n        }\n      )}\n    </div>\n  );\n};\n\nProductGiftCardOptions.getInitialData = getFetchedProductData;\n"],"names":["ProductGiftCardOptions","initialData","scope","children","props","data","setData","useState","values","setValues","useEffect","dataEvent","events","valuesEvent","handleOptionChange","uid","value","prevOptions","idx","field","newEnteredOptions","setProductConfigurationValues","prev","handleValidationChange","valid","setProductConfigurationValid","jsx","classes","id","index","optionData","GiftCardOptions","opt","_b","_a","getFetchedProductData"],"mappings":"uiBAiCa,MAAAA,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,MAAAC,EAAO,SAAAC,EAAU,GAAGC,KAAY,OACzD,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAA8BN,CAAW,EAC3D,CAACO,EAAQC,CAAS,EAAIF,EAAsB,CAChD,IAAK,GACL,SAAU,EACV,eAAgB,CAAA,CAAC,CAClB,EAEDG,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYN,EAAS,CAAE,MAAAJ,EAAO,EACpDW,EAAcD,EAAO,GAAG,aAAcH,EAAW,CAAE,MAAO,GAAM,EAEtE,MAAO,IAAM,CACXE,GAAA,MAAAA,EAAW,MACXE,GAAA,MAAAA,EAAa,KACf,CAAA,EACC,CAACX,CAAK,CAAC,EAEJ,MAAAY,EAAqB,CAACC,EAAaC,IAAkB,CACnD,MAAAC,EAAcT,EAAO,gBAAkB,CAAC,EACxCU,EAAMD,EAAY,UAAWE,GAAUA,EAAM,MAAQJ,CAAG,EAC1D,IAAAK,EACAF,IAAQ,GACVE,EAAoBH,EAAY,IAAKE,GACnCA,EAAM,MAAQJ,EAAM,CAAE,GAAGI,EAAO,MAAAH,GAAUG,CAC5C,EAEAC,EAAoB,CAAC,GAAGH,EAAa,CAAE,IAAAF,EAAK,MAAAC,EAAO,EAGrDK,EAA+BC,IAAU,CACvC,GAAGA,EACH,eAAgBF,CAAA,EAChB,CACJ,EAEMG,EAA0BC,GAAmB,CACjDC,EAA6B,IAAMD,CAAK,CAC1C,EAEI,OAACnB,EAGHqB,EAAC,MAAA,CACE,GAAGtB,EACJ,UAAWuB,EAAQ,CAAC,wBAAyBvB,EAAM,SAAS,CAAC,EAE5D,6BAAM,2BAAY,IACjB,CAAC,CAAE,GAAAwB,EAAI,MAAAZ,GAAqCa,IAAkB,SAC5D,GAAID,IAAO,cACF,OAAA,KAET,IAAIE,EAAoC,CAAE,QAAS,EAAG,EAClD,GAAA,CACWA,EAAA,KAAK,MAAMd,CAAK,CAAA,MACvB,CAAA,CAGN,OAAAU,EAACK,EAAA,CAEC,QAASD,EAAW,QACpB,UAAW1B,EAAM,UACjB,cAAeI,EAAO,gBAAkB,CAAA,GAAI,IAAKwB,IAAS,CACxD,GAAIA,EAAI,IACR,MAAOA,EAAI,KAAA,EACX,EACF,UAAUC,GAAAC,EAAA7B,EAAK,SAAL,YAAA6B,EAAa,QAAb,YAAAD,EAAoB,SAC9B,eAAgBnB,EAChB,mBAAoBS,CAAA,EATf,YAAYM,CAAK,EAUxB,CAAA,EAGN,CACF,EAjCgB,IAmCpB,EAEA7B,EAAuB,eAAiBmC"}

package/containers/ProductHeader.js

@@ -1,4 +1,4 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsxs as c,jsx as e,Fragment as i}from"@dropins/tools/preact-jsx-runtime.js";import{useState as p,useEffect as u}from"@dropins/tools/preact-compat.js";import{classes as f,VComponent as l}from"@dropins/tools/lib.js";import"@dropins/tools/components.js";/* empty css             */import"@dropins/tools/preact.js";import{events as h}from"@dropins/tools/event-bus.js";import{g}from"../chunks/getFetchedProductData.js";const _=({className:a,title:r,sku:d,hideSku:n=!1,children:o,...t})=>c("div",{...t,className:f(["pdp-header",a]),children:[e("div",{className:"pdp-header__title",children:e(l,{node:r})}),!n&&e("div",{className:"pdp-header__sku",children:e(l,{node:d})})]}),k=({initialData:a=null,scope:r,hideSku:d=!1,children:n,...o})=>{const[t,m]=p(a);return u(()=>{const s=h.on("pdp/data",m,{scope:r});return()=>{s==null||s.off()}},[r]),t?e(_,{...o,title:e(i,{children:t.name}),sku:e(i,{children:t.sku}),hideSku:d}):null};k.getInitialData=g;export{k as ProductHeader,k as default};
+import{jsxs as p,jsx as e,Fragment as n}from"@dropins/tools/preact-jsx-runtime.js";import{useState as c,useEffect as u}from"@dropins/tools/preact-compat.js";import{classes as f,VComponent as l}from"@dropins/tools/lib.js";import"@dropins/tools/components.js";/* empty css             */import"@dropins/tools/preact.js";import"@dropins/tools/preact-hooks.js";/* empty css                       */import{events as h}from"@dropins/tools/event-bus.js";import{g}from"../chunks/getFetchedProductData.js";const _=({className:a,title:r,sku:o,hideSku:s=!1,children:i,...t})=>p("div",{...t,className:f(["pdp-header",a]),children:[e("div",{className:"pdp-header__title",children:e(l,{node:r})}),!s&&e("div",{className:"pdp-header__sku",children:e(l,{node:o})})]}),k=({initialData:a=null,scope:r,hideSku:o=!1,children:s,...i})=>{const[t,m]=c(a);return u(()=>{const d=h.on("pdp/data",m,{scope:r});return()=>{d==null||d.off()}},[r]),t?e(_,{...i,title:e(n,{children:t.name}),sku:e(n,{children:t.sku}),hideSku:o}):null};k.getInitialData=g;export{k as ProductHeader,k as default};
 //# sourceMappingURL=ProductHeader.js.map

package/containers/ProductHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProductHeader.js","sources":["/@dropins/storefront-pdp/src/components/Header/Header.tsx","/@dropins/storefront-pdp/src/containers/ProductHeader/ProductHeader.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport '@/pdp/components/Header/Header.css';\n\nexport interface HeaderProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n  title: VNode;\n  sku: VNode;\n  hideSku?: boolean;\n}\n\nexport const Header: FunctionComponent<HeaderProps> = ({\n  className,\n  title,\n  sku,\n  hideSku = false,\n  children,\n  ...props\n}) => {\n  return (\n    <div {...props} className={classes(['pdp-header', className])}>\n      <div className=\"pdp-header__title\">\n        <VComponent node={title} />\n      </div>\n      {!hideSku && (\n        <div className=\"pdp-header__sku\">\n          <VComponent node={sku} />\n        </div>\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 } from '@adobe-commerce/elsie/lib';\nimport { Header } from '@/pdp/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { ProductModel } from '@/pdp/data/models';\nimport { getFetchedProductData } from '@/pdp/api';\n\nexport interface ProductHeaderProps extends HTMLAttributes<HTMLDivElement> {\n  scope?: string;\n  hideSku?: boolean;\n}\n\nexport const ProductHeader: Container<\n  ProductHeaderProps,\n  ProductModel | null\n> = ({ initialData = null, scope, hideSku = false, children, ...props }) => {\n  const [data, setData] = useState<ProductModel | null>(initialData);\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n\n    return () => {\n      dataEvent?.off();\n    };\n  }, [scope]);\n\n  if (!data) return null;\n\n  return (\n    <Header\n      {...props}\n      title={<>{data.name}</>}\n      sku={<>{data.sku}</>}\n      hideSku={hideSku}\n    />\n  );\n};\n\nProductHeader.getInitialData = getFetchedProductData;\n"],"names":["Header","className","title","sku","hideSku","children","props","jsxs","classes","jsx","VComponent","ProductHeader","initialData","scope","data","setData","useState","useEffect","dataEvent","events","Fragment","getFetchedProductData"],"mappings":"qaA4BO,MAAMA,EAAyC,CAAC,CACrD,UAAAC,EACA,MAAAC,EACA,IAAAC,EACA,QAAAC,EAAU,GACV,SAAAC,EACA,GAAGC,CACL,IAEIC,EAAC,MAAK,CAAA,GAAGD,EAAO,UAAWE,EAAQ,CAAC,aAAcP,CAAS,CAAC,EAC1D,SAAA,CAAAQ,EAAC,OAAI,UAAU,oBACb,WAACC,EAAW,CAAA,KAAMR,EAAO,CAC3B,CAAA,EACC,CAACE,GACAK,EAAC,MAAI,CAAA,UAAU,kBACb,SAACA,EAAAC,EAAA,CAAW,KAAMP,CAAK,CAAA,CACzB,CAAA,CAAA,EAEJ,EClBSQ,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,MAAAC,EAAO,QAAAT,EAAU,GAAO,SAAAC,EAAU,GAAGC,KAAY,CAC1E,KAAM,CAACQ,EAAMC,CAAO,EAAIC,EAA8BJ,CAAW,EAU7D,OARJK,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYJ,EAAS,CAAE,MAAAF,EAAO,EAE1D,MAAO,IAAM,CACXK,GAAA,MAAAA,EAAW,KACb,CAAA,EACC,CAACL,CAAK,CAAC,EAELC,EAGHL,EAACT,EAAA,CACE,GAAGM,EACJ,MAAUG,EAAAW,EAAA,CAAA,SAAAN,EAAK,KAAK,EACpB,IAAQL,EAAAW,EAAA,CAAA,SAAAN,EAAK,IAAI,EACjB,QAAAV,CAAA,CACF,EARgB,IAUpB,EAEAO,EAAc,eAAiBU"}
+{"version":3,"file":"ProductHeader.js","sources":["/@dropins/storefront-pdp/src/components/Header/Header.tsx","/@dropins/storefront-pdp/src/containers/ProductHeader/ProductHeader.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes } from 'preact/compat';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport '@/pdp/components/Header/Header.css';\n\nexport interface HeaderProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n  title: VNode;\n  sku: VNode;\n  hideSku?: boolean;\n}\n\nexport const Header: FunctionComponent<HeaderProps> = ({\n  className,\n  title,\n  sku,\n  hideSku = false,\n  children,\n  ...props\n}) => {\n  return (\n    <div {...props} className={classes(['pdp-header', className])}>\n      <div className=\"pdp-header__title\">\n        <VComponent node={title} />\n      </div>\n      {!hideSku && (\n        <div className=\"pdp-header__sku\">\n          <VComponent node={sku} />\n        </div>\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 } from '@adobe-commerce/elsie/lib';\nimport { Header } from '@/pdp/components';\nimport { events } from '@adobe-commerce/event-bus';\nimport { ProductModel } from '@/pdp/data/models';\nimport { getFetchedProductData } from '@/pdp/api';\n\nexport interface ProductHeaderProps extends HTMLAttributes<HTMLDivElement> {\n  scope?: string;\n  hideSku?: boolean;\n}\n\nexport const ProductHeader: Container<\n  ProductHeaderProps,\n  ProductModel | null\n> = ({ initialData = null, scope, hideSku = false, children, ...props }) => {\n  const [data, setData] = useState<ProductModel | null>(initialData);\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n\n    return () => {\n      dataEvent?.off();\n    };\n  }, [scope]);\n\n  if (!data) return null;\n\n  return (\n    <Header\n      {...props}\n      title={<>{data.name}</>}\n      sku={<>{data.sku}</>}\n      hideSku={hideSku}\n    />\n  );\n};\n\nProductHeader.getInitialData = getFetchedProductData;\n"],"names":["Header","className","title","sku","hideSku","children","props","jsxs","classes","jsx","VComponent","ProductHeader","initialData","scope","data","setData","useState","useEffect","dataEvent","events","Fragment","getFetchedProductData"],"mappings":"ifA4BO,MAAMA,EAAyC,CAAC,CACrD,UAAAC,EACA,MAAAC,EACA,IAAAC,EACA,QAAAC,EAAU,GACV,SAAAC,EACA,GAAGC,CACL,IAEIC,EAAC,MAAK,CAAA,GAAGD,EAAO,UAAWE,EAAQ,CAAC,aAAcP,CAAS,CAAC,EAC1D,SAAA,CAAAQ,EAAC,OAAI,UAAU,oBACb,WAACC,EAAW,CAAA,KAAMR,EAAO,CAC3B,CAAA,EACC,CAACE,GACAK,EAAC,MAAI,CAAA,UAAU,kBACb,SAACA,EAAAC,EAAA,CAAW,KAAMP,CAAK,CAAA,CACzB,CAAA,CAAA,EAEJ,EClBSQ,EAGT,CAAC,CAAE,YAAAC,EAAc,KAAM,MAAAC,EAAO,QAAAT,EAAU,GAAO,SAAAC,EAAU,GAAGC,KAAY,CAC1E,KAAM,CAACQ,EAAMC,CAAO,EAAIC,EAA8BJ,CAAW,EAU7D,OARJK,EAAU,IAAM,CACd,MAAMC,EAAYC,EAAO,GAAG,WAAYJ,EAAS,CAAE,MAAAF,EAAO,EAE1D,MAAO,IAAM,CACXK,GAAA,MAAAA,EAAW,KACb,CAAA,EACC,CAACL,CAAK,CAAC,EAELC,EAGHL,EAACT,EAAA,CACE,GAAGM,EACJ,MAAUG,EAAAW,EAAA,CAAA,SAAAN,EAAK,KAAK,EACpB,IAAQL,EAAAW,EAAA,CAAA,SAAAN,EAAK,IAAI,EACjB,QAAAV,CAAA,CACF,EARgB,IAUpB,EAEAO,EAAc,eAAiBU"}

package/containers/ProductOptions.js

@@ -1,4 +1,4 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsx as d}from"@dropins/tools/preact-jsx-runtime.js";import{useState as h,useEffect as z,useCallback as j}from"@dropins/tools/preact-compat.js";import{Slot as C}from"@dropins/tools/lib.js";import{events as S}from"@dropins/tools/event-bus.js";import"@dropins/tools/components.js";/* empty css             */import{S as A}from"../chunks/Swatches.js";import"@dropins/tools/preact.js";import{c as v,o as G,k as O,j as b,h as H,l as y,p as J}from"../chunks/isProductConfigurationValid.js";import{g as K}from"../chunks/getFetchedProductData.js";import"@dropins/tools/i18n.js";import"../fragments.js";import"@dropins/tools/fetch-graphql.js";const Q=({initialData:c={data:null,optionsUIDs:[]},scope:i,hideSelectedValue:p=!1,slots:n,onValues:u,onErrors:l,children:V,...B})=>{var I;const[t,T]=h(c.data),[m,F]=h(c.optionsUIDs),[M,L]=h();z(()=>{const a=S.on("pdp/data",T,{scope:i}),s=S.on("pdp/values",({optionsUIDs:f})=>{f&&F(f)},{scope:i});return()=>{a==null||a.off(),s==null||s.off()}},[]);const N=j(async a=>{var U,w,D,k;if(!(t!=null&&t.sku))return;const{persistURLParams:s,anchors:f,acdl:q}=v.getConfig()??{};let o=Object.keys(a).map(r=>a[r].value).filter(r=>r!==void 0);s&&!(t!=null&&t.isBundle)&&G({optionsUIDs:o.join(",")}),((w=(U=O({scope:i}))==null?void 0:U.optionsUIDs)==null?void 0:w.join("|"))!==(o==null?void 0:o.join("|"))&&b(r=>({...r,optionsUIDs:o}),{scope:i}),u==null||u(o);const e=await H(t.sku,{optionsUIDs:o??[],isBundle:t==null?void 0:t.isBundle,anchors:f});S.emit("pdp/data",e,{scope:i});let P=(o==null?void 0:o.length)===((D=e==null?void 0:e.options)==null?void 0:D.length);if(f!=null&&f.length){const r=(e==null?void 0:e.optionUIDs)??[];o.every(g=>r.includes(g))||(L(e==null?void 0:e.options),b(g=>({...g,optionsUIDs:r}),{scope:i}),P=(r==null?void 0:r.length)===((k=e==null?void 0:e.options)==null?void 0:k.length))}y(()=>P,{scope:i}),q&&e&&(e==null?void 0:e.variantSku)!==t.sku&&J(e)},[t==null?void 0:t.isBundle,t==null?void 0:t.sku,u,i]),R=j(a=>{Object.keys(a).length!==0&&(y(()=>!1,{scope:i}),l==null||l(a))},[l,i]);return!t||!t.options?null:d(C,{name:"Swatches",slot:n==null?void 0:n.Swatches,context:{data:t,optionsUIDs:m},children:d(A,{...B,options:t.options,selectedUIDs:m,defaultOptions:m,selectionsToUpdate:M,hideSelectedValue:p,disablePreselections:!((I=v.getConfig())!=null&&I.preselectFirstOption),onValues:N,onErrors:R,imageSwatchNode:n!=null&&n.SwatchImage?({imageSwatchContext:a,...s})=>d(C,{name:"SwatchImage",slot:n==null?void 0:n.SwatchImage,slotTag:"span",contentTag:"span",context:{data:t,optionsUIDs:m,defaultImageProps:s,imageSwatchContext:a}}):void 0})})};Q.getInitialData=async function(c){var n;const i=await K({scope:c==null?void 0:c.scope}),p=((n=O({scope:c==null?void 0:c.scope}))==null?void 0:n.optionsUIDs)??[];return{data:i,optionsUIDs:p}};export{Q as ProductOptions,Q as default};
+import{jsx as d}from"@dropins/tools/preact-jsx-runtime.js";import{useState as h,useEffect as z,useCallback as j}from"@dropins/tools/preact-compat.js";import{Slot as C}from"@dropins/tools/lib.js";import{events as S}from"@dropins/tools/event-bus.js";import"@dropins/tools/components.js";/* empty css             */import{S as A}from"../chunks/Swatches.js";import"@dropins/tools/preact.js";import"@dropins/tools/preact-hooks.js";/* empty css                       */import{c as v,l as G,j as H,p as J}from"../chunks/fetchProductData.js";import{g as O,s as b,a as y}from"../chunks/isProductConfigurationValid.js";import{g as K}from"../chunks/getFetchedProductData.js";import"@dropins/tools/i18n.js";import"../fragments.js";import"@dropins/tools/fetch-graphql.js";const Q=({initialData:s={data:null,optionsUIDs:[]},scope:i,hideSelectedValue:l=!1,slots:n,onValues:u,onErrors:m,children:V,...B})=>{var I;const[t,T]=h(s.data),[p,F]=h(s.optionsUIDs),[M,L]=h();z(()=>{const o=S.on("pdp/data",T,{scope:i}),c=S.on("pdp/values",({optionsUIDs:f})=>{f&&F(f)},{scope:i});return()=>{o==null||o.off(),c==null||c.off()}},[]);const N=j(async o=>{var U,w,D,k;if(!(t!=null&&t.sku))return;const{persistURLParams:c,anchors:f,acdl:q}=v.getConfig()??{};let a=Object.keys(o).map(r=>o[r].value).filter(r=>r!==void 0);c&&!(t!=null&&t.isBundle)&&G({optionsUIDs:a.join(",")}),((w=(U=O({scope:i}))==null?void 0:U.optionsUIDs)==null?void 0:w.join("|"))!==(a==null?void 0:a.join("|"))&&b(r=>({...r,optionsUIDs:a}),{scope:i}),u==null||u(a);const e=await H(t.sku,{optionsUIDs:a??[],isBundle:t==null?void 0:t.isBundle,anchors:f});S.emit("pdp/data",e,{scope:i});let P=(a==null?void 0:a.length)===((D=e==null?void 0:e.options)==null?void 0:D.length);if(f!=null&&f.length){const r=(e==null?void 0:e.optionUIDs)??[];a.every(g=>r.includes(g))||(L(e==null?void 0:e.options),b(g=>({...g,optionsUIDs:r}),{scope:i}),P=(r==null?void 0:r.length)===((k=e==null?void 0:e.options)==null?void 0:k.length))}y(()=>P,{scope:i}),q&&e&&(e==null?void 0:e.variantSku)!==t.sku&&J(e)},[t==null?void 0:t.isBundle,t==null?void 0:t.sku,u,i]),R=j(o=>{Object.keys(o).length!==0&&(y(()=>!1,{scope:i}),m==null||m(o))},[m,i]);return!t||!t.options?null:d(C,{name:"Swatches",slot:n==null?void 0:n.Swatches,context:{data:t,optionsUIDs:p},children:d(A,{...B,options:t.options,selectedUIDs:p,defaultOptions:p,selectionsToUpdate:M,hideSelectedValue:l,disablePreselections:!((I=v.getConfig())!=null&&I.preselectFirstOption),onValues:N,onErrors:R,imageSwatchNode:n!=null&&n.SwatchImage?({imageSwatchContext:o,...c})=>d(C,{name:"SwatchImage",slot:n==null?void 0:n.SwatchImage,slotTag:"span",contentTag:"span",context:{data:t,optionsUIDs:p,defaultImageProps:c,imageSwatchContext:o}}):void 0})})};Q.getInitialData=async function(s){var n;const i=await K({scope:s==null?void 0:s.scope}),l=((n=O({scope:s==null?void 0:s.scope}))==null?void 0:n.optionsUIDs)??[];return{data:i,optionsUIDs:l}};export{Q as ProductOptions,Q as default};
 //# sourceMappingURL=ProductOptions.js.map

package/containers/ProductOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProductOptions.js","sources":["/@dropins/storefront-pdp/src/containers/ProductOptions/ProductOptions.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport {\n  HTMLAttributes,\n  useCallback,\n  useEffect,\n  useState,\n} from 'preact/compat';\nimport { Container, Slot, SlotProps } from '@adobe-commerce/elsie/lib';\nimport { ProductModel } from '@/pdp/data/models';\nimport { events } from '@adobe-commerce/event-bus';\nimport { Swatches } from '@/pdp/components';\nimport {\n  setProductConfigurationValues,\n  getProductConfigurationValues,\n  setProductConfigurationValid,\n  fetchProductData,\n  getFetchedProductData,\n  config,\n} from '@/pdp/api';\nimport { setUrlParams } from '@/pdp/lib/url-params';\nimport { publishProductPageViewEvent } from '@/pdp/lib/acdl';\nimport {\n  ImageNodeRenderProps,\n  ImageProps,\n} from '@adobe-commerce/elsie/components';\n\nexport interface ProductOptionsProps extends HTMLAttributes<HTMLDivElement> {\n  scope?: string;\n  hideSelectedValue?: boolean;\n  onValues?: (optionsUIDs: string[]) => void;\n  onErrors?: (errors: { [id: string]: string }) => void;\n  slots?: {\n    Swatches?: SlotProps<{ data: ProductModel | null; optionsUIDs: string[] }>;\n    SwatchImage?: SlotProps<{\n      data: ProductModel | null;\n      optionsUIDs: string[];\n      imageSwatchContext: ImageNodeRenderProps['imageSwatchContext'];\n      defaultImageProps: ImageProps;\n    }>;\n  };\n}\n\nexport const ProductOptions: Container<\n  ProductOptionsProps,\n  { data: ProductModel | null; optionsUIDs: string[] }\n> = ({\n  initialData = { data: null, optionsUIDs: [] },\n  scope,\n  hideSelectedValue = false,\n  slots,\n  onValues,\n  onErrors,\n  children,\n  ...props\n}) => {\n  const [data, setData] = useState<ProductModel | null>(initialData.data);\n\n  const [current, setCurrent] = useState<string[]>(initialData.optionsUIDs);\n\n  const [selectionsToUpdate, setSelectionsToUpdate] =\n    useState<ProductModel['options']>();\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n\n    const valuesEvent = events.on(\n      'pdp/values',\n      ({ optionsUIDs }) => {\n        if (optionsUIDs) {\n          setCurrent(optionsUIDs);\n        }\n      },\n      { scope }\n    );\n\n    return () => {\n      dataEvent?.off();\n      valuesEvent?.off();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleOptionSelected = useCallback(\n    async (selections: { [id: string]: { label: string; value: string } }) => {\n      if (!data?.sku) return;\n\n      const { persistURLParams, anchors, acdl } = config.getConfig() ?? {};\n\n      // options selected\n      let optionsUIDs = Object.keys(selections)\n        .map((id) => selections[id].value)\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 \"persistURLParams\" is set to true and the product is not a bundle type\n      if (persistURLParams && !data?.isBundle) {\n        setUrlParams({ optionsUIDs: optionsUIDs.join(',') });\n      }\n\n      // check if the options have changed and update the values only if they have changed\n      if (\n        getProductConfigurationValues({ scope })?.optionsUIDs?.join('|') !==\n        optionsUIDs?.join('|')\n      ) {\n        // update values\n        setProductConfigurationValues((prev) => ({ ...prev, optionsUIDs }), {\n          scope,\n        });\n      }\n\n      // pass the selected options to callback\n      onValues?.(optionsUIDs);\n\n      // refetch data\n      const next = await fetchProductData(data.sku, {\n        optionsUIDs: optionsUIDs ?? [],\n        isBundle: data?.isBundle,\n        anchors,\n      });\n\n      // emit the new data\n      events.emit('pdp/data', next, { scope });\n\n      let valid = optionsUIDs?.length === next?.options?.length;\n\n      // special processing for anchor options (options that should not be refined when other options are selected)\n      if (anchors?.length) {\n        const updatedOptionsUIDs = next?.optionUIDs ?? [];\n\n        const isMatching = optionsUIDs.every((item) =>\n          updatedOptionsUIDs.includes(item)\n        );\n\n        if (!isMatching) {\n          setSelectionsToUpdate(next?.options);\n          setProductConfigurationValues(\n            (prev) => ({\n              ...prev,\n              optionsUIDs: updatedOptionsUIDs,\n            }),\n            { scope }\n          );\n\n          valid = updatedOptionsUIDs?.length === next?.options?.length;\n        }\n      }\n\n      // is the product valid\n      setProductConfigurationValid(() => valid, { scope });\n\n      // ACDL\n      if (acdl && next && next?.variantSku !== data.sku) {\n        publishProductPageViewEvent(next);\n      }\n    },\n    [data?.isBundle, data?.sku, onValues, scope]\n  );\n\n  const handleErrors = useCallback(\n    (errors: { [id: string]: string }) => {\n      const hasErrors = Object.keys(errors).length !== 0;\n\n      if (hasErrors) {\n        setProductConfigurationValid(() => false, { scope });\n        onErrors?.(errors);\n      }\n    },\n    [onErrors, scope]\n  );\n\n  if (!data) return null;\n\n  // Only show if there are options in the data\n  if (!data.options) return null;\n\n  return (\n    <Slot\n      name=\"Swatches\"\n      slot={slots?.Swatches}\n      context={{ data, optionsUIDs: current }}\n    >\n      <Swatches\n        {...props}\n        options={data.options}\n        selectedUIDs={current}\n        defaultOptions={current}\n        selectionsToUpdate={selectionsToUpdate}\n        hideSelectedValue={hideSelectedValue}\n        disablePreselections={!config.getConfig()?.preselectFirstOption}\n        onValues={handleOptionSelected}\n        onErrors={handleErrors}\n        imageSwatchNode={\n          slots?.SwatchImage\n            ? ({ imageSwatchContext, ...imageProps }) => (\n                <Slot\n                  name=\"SwatchImage\"\n                  slot={slots?.SwatchImage}\n                  slotTag=\"span\"\n                  contentTag=\"span\"\n                  context={{\n                    data,\n                    optionsUIDs: current,\n                    defaultImageProps: imageProps,\n                    imageSwatchContext,\n                  }}\n                />\n              )\n            : undefined\n        }\n      />\n    </Slot>\n  );\n};\n\nProductOptions.getInitialData = async function (options) {\n  const data = await getFetchedProductData({ scope: options?.scope });\n  const optionsUIDs =\n    getProductConfigurationValues({ scope: options?.scope })?.optionsUIDs ?? [];\n  return { data, optionsUIDs };\n};\n"],"names":["ProductOptions","initialData","scope","hideSelectedValue","slots","onValues","onErrors","children","props","data","setData","useState","current","setCurrent","selectionsToUpdate","setSelectionsToUpdate","useEffect","dataEvent","events","valuesEvent","optionsUIDs","handleOptionSelected","useCallback","selections","persistURLParams","anchors","acdl","config","id","element","setUrlParams","_b","_a","getProductConfigurationValues","setProductConfigurationValues","prev","next","fetchProductData","valid","_c","updatedOptionsUIDs","item","_d","setProductConfigurationValid","publishProductPageViewEvent","handleErrors","errors","jsx","Slot","Swatches","imageSwatchContext","imageProps","options","getFetchedProductData"],"mappings":"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"}
+{"version":3,"file":"ProductOptions.js","sources":["/@dropins/storefront-pdp/src/containers/ProductOptions/ProductOptions.tsx"],"sourcesContent":["/**\n * ADOBE CONFIDENTIAL\n * __________________\n * Copyright 2024 Adobe\n * All Rights Reserved.\n * __________________\n * NOTICE: All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n */\n\nimport {\n  HTMLAttributes,\n  useCallback,\n  useEffect,\n  useState,\n} from 'preact/compat';\nimport { Container, Slot, SlotProps } from '@adobe-commerce/elsie/lib';\nimport { ProductModel } from '@/pdp/data/models';\nimport { events } from '@adobe-commerce/event-bus';\nimport { Swatches } from '@/pdp/components';\nimport {\n  setProductConfigurationValues,\n  getProductConfigurationValues,\n  setProductConfigurationValid,\n  fetchProductData,\n  getFetchedProductData,\n  config,\n} from '@/pdp/api';\nimport { setUrlParams } from '@/pdp/lib/url-params';\nimport { publishProductPageViewEvent } from '@/pdp/lib/acdl';\nimport {\n  ImageNodeRenderProps,\n  ImageProps,\n} from '@adobe-commerce/elsie/components';\n\nexport interface ProductOptionsProps extends HTMLAttributes<HTMLDivElement> {\n  scope?: string;\n  hideSelectedValue?: boolean;\n  onValues?: (optionsUIDs: string[]) => void;\n  onErrors?: (errors: { [id: string]: string }) => void;\n  slots?: {\n    Swatches?: SlotProps<{ data: ProductModel | null; optionsUIDs: string[] }>;\n    SwatchImage?: SlotProps<{\n      data: ProductModel | null;\n      optionsUIDs: string[];\n      imageSwatchContext: ImageNodeRenderProps['imageSwatchContext'];\n      defaultImageProps: ImageProps;\n    }>;\n  };\n}\n\nexport const ProductOptions: Container<\n  ProductOptionsProps,\n  { data: ProductModel | null; optionsUIDs: string[] }\n> = ({\n  initialData = { data: null, optionsUIDs: [] },\n  scope,\n  hideSelectedValue = false,\n  slots,\n  onValues,\n  onErrors,\n  children,\n  ...props\n}) => {\n  const [data, setData] = useState<ProductModel | null>(initialData.data);\n\n  const [current, setCurrent] = useState<string[]>(initialData.optionsUIDs);\n\n  const [selectionsToUpdate, setSelectionsToUpdate] =\n    useState<ProductModel['options']>();\n\n  useEffect(() => {\n    const dataEvent = events.on('pdp/data', setData, { scope });\n\n    const valuesEvent = events.on(\n      'pdp/values',\n      ({ optionsUIDs }) => {\n        if (optionsUIDs) {\n          setCurrent(optionsUIDs);\n        }\n      },\n      { scope }\n    );\n\n    return () => {\n      dataEvent?.off();\n      valuesEvent?.off();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleOptionSelected = useCallback(\n    async (selections: { [id: string]: { label: string; value: string } }) => {\n      if (!data?.sku) return;\n\n      const { persistURLParams, anchors, acdl } = config.getConfig() ?? {};\n\n      // options selected\n      let optionsUIDs = Object.keys(selections)\n        .map((id) => selections[id].value)\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 \"persistURLParams\" is set to true and the product is not a bundle type\n      if (persistURLParams && !data?.isBundle) {\n        setUrlParams({ optionsUIDs: optionsUIDs.join(',') });\n      }\n\n      // check if the options have changed and update the values only if they have changed\n      if (\n        getProductConfigurationValues({ scope })?.optionsUIDs?.join('|') !==\n        optionsUIDs?.join('|')\n      ) {\n        // update values\n        setProductConfigurationValues((prev) => ({ ...prev, optionsUIDs }), {\n          scope,\n        });\n      }\n\n      // pass the selected options to callback\n      onValues?.(optionsUIDs);\n\n      // refetch data\n      const next = await fetchProductData(data.sku, {\n        optionsUIDs: optionsUIDs ?? [],\n        isBundle: data?.isBundle,\n        anchors,\n      });\n\n      // emit the new data\n      events.emit('pdp/data', next, { scope });\n\n      let valid = optionsUIDs?.length === next?.options?.length;\n\n      // special processing for anchor options (options that should not be refined when other options are selected)\n      if (anchors?.length) {\n        const updatedOptionsUIDs = next?.optionUIDs ?? [];\n\n        const isMatching = optionsUIDs.every((item) =>\n          updatedOptionsUIDs.includes(item)\n        );\n\n        if (!isMatching) {\n          setSelectionsToUpdate(next?.options);\n          setProductConfigurationValues(\n            (prev) => ({\n              ...prev,\n              optionsUIDs: updatedOptionsUIDs,\n            }),\n            { scope }\n          );\n\n          valid = updatedOptionsUIDs?.length === next?.options?.length;\n        }\n      }\n\n      // is the product valid\n      setProductConfigurationValid(() => valid, { scope });\n\n      // ACDL\n      if (acdl && next && next?.variantSku !== data.sku) {\n        publishProductPageViewEvent(next);\n      }\n    },\n    [data?.isBundle, data?.sku, onValues, scope]\n  );\n\n  const handleErrors = useCallback(\n    (errors: { [id: string]: string }) => {\n      const hasErrors = Object.keys(errors).length !== 0;\n\n      if (hasErrors) {\n        setProductConfigurationValid(() => false, { scope });\n        onErrors?.(errors);\n      }\n    },\n    [onErrors, scope]\n  );\n\n  if (!data) return null;\n\n  // Only show if there are options in the data\n  if (!data.options) return null;\n\n  return (\n    <Slot\n      name=\"Swatches\"\n      slot={slots?.Swatches}\n      context={{ data, optionsUIDs: current }}\n    >\n      <Swatches\n        {...props}\n        options={data.options}\n        selectedUIDs={current}\n        defaultOptions={current}\n        selectionsToUpdate={selectionsToUpdate}\n        hideSelectedValue={hideSelectedValue}\n        disablePreselections={!config.getConfig()?.preselectFirstOption}\n        onValues={handleOptionSelected}\n        onErrors={handleErrors}\n        imageSwatchNode={\n          slots?.SwatchImage\n            ? ({ imageSwatchContext, ...imageProps }) => (\n                <Slot\n                  name=\"SwatchImage\"\n                  slot={slots?.SwatchImage}\n                  slotTag=\"span\"\n                  contentTag=\"span\"\n                  context={{\n                    data,\n                    optionsUIDs: current,\n                    defaultImageProps: imageProps,\n                    imageSwatchContext,\n                  }}\n                />\n              )\n            : undefined\n        }\n      />\n    </Slot>\n  );\n};\n\nProductOptions.getInitialData = async function (options) {\n  const data = await getFetchedProductData({ scope: options?.scope });\n  const optionsUIDs =\n    getProductConfigurationValues({ scope: options?.scope })?.optionsUIDs ?? [];\n  return { data, optionsUIDs };\n};\n"],"names":["ProductOptions","initialData","scope","hideSelectedValue","slots","onValues","onErrors","children","props","data","setData","useState","current","setCurrent","selectionsToUpdate","setSelectionsToUpdate","useEffect","dataEvent","events","valuesEvent","optionsUIDs","handleOptionSelected","useCallback","selections","persistURLParams","anchors","acdl","config","id","element","setUrlParams","_b","_a","getProductConfigurationValues","setProductConfigurationValues","prev","next","fetchProductData","valid","_c","updatedOptionsUIDs","item","_d","setProductConfigurationValid","publishProductPageViewEvent","handleErrors","errors","jsx","Slot","Swatches","imageSwatchContext","imageProps","options","getFetchedProductData"],"mappings":"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"}

package/containers/ProductPrice.js

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