@gem-sdk/components 3.0.0-pre-production.14 → 3.0.1

package/dist/cjs/product/components/ProductList.liquid.js

@@ -1,398 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var product = require('../helpers/product.js');
-var core = require('@gem-sdk/core');
-var CarouselItem_liquid = require('../../carousel/components/CarouselItem.liquid.js');
-var Carousel_liquid = require('../../carousel/components/Carousel.liquid.js');
-var carousel = require('../../carousel/components/common/carousel.js');
-var arrow = require('../../carousel/components/common/arrow.js');
-var dots = require('../../carousel/components/common/dots.js');
-var productFeaturedImage = require('./ProductImages/common/productFeaturedImage.js');
-var helpers = require('../../helpers.js');
-
-const ProductList = ({ setting, builderProps, styles, className, children, advanced, pageContext })=>{
-    const PREFIX_COLLECTION_ID = 'gid://shopify/Collection/';
-    const PREFIX_PRODUCT_ID = 'gid://shopify/Product/';
-    const productSetting = setting?.productSetting;
-    const relatedTag = productSetting?.relatedTag;
-    const hasRelatedExclude = productSetting?.hasRelatedExclude;
-    const mainRelatedExclude = (relatedTag && relatedTag[0] === 'collection' ? productSetting?.relatedCollectionExclude : productSetting?.relatedTagsExclude) || '';
-    const relatedExcludeTrim = mainRelatedExclude?.split(',').map((item)=>item.trim()).toString();
-    const productSrc = productSetting?.productSrc ?? 'Collection';
-    const collectionID = productSetting?.collectionId?.replace(PREFIX_COLLECTION_ID, '') ?? 'latest';
-    const isLatest = productSetting?.productSrc === 'PickProduct' && productSetting?.productIds?.length === 0;
-    const isGrid = styles?.layout === 'grid';
-    const numberOfProducts = productFeaturedImage.convertUnitToNumber(setting?.numberOfProducts, 4);
-    const productListId = productSrc === 'PickProduct' && productSetting?.productIds?.length ? productSetting?.productIds.map((p)=>p.replace(PREFIX_PRODUCT_ID, '')) : [];
-    const productListHandles = productSrc === 'PickProduct' && productSetting?.productHandles?.length ? productSetting?.productHandles : [];
-    const updatedArrowSetting = arrow.getUpdatedArrowDisplay(setting?.arrow, setting?.controlOverContent);
-    const updatedDotStyleFromOldData = dots.getUpdatedDotStyle(setting?.dot);
-    const isSorted = setting?.orderBy && setting?.orderBy !== 'none';
-    const sortedArray = (productSetting?.productSrc === 'Collection' || productSetting?.productSrc === 'DynamicCollection') && isSorted ? setting?.orderBy?.split('_') : 'none';
-    const sortedBy = isSorted && sortedArray?.[0] === 'TITLE' ? "| sort: 'title'" : "| sort: 'updated_at'";
-    const isReverse = sortedArray?.[sortedArray.length - 1] === 'DESC';
-    const renderSameHeightGrid = (children)=>{
-        return core.template /* liquid */ `
-      <gp-same-height-v2
-        class="gp-contents"
-        style="visibility: hidden"
-        gp-data='${JSON.stringify({
-            targetUid: builderProps?.builderData?.childrens?.[0],
-            slidesToShow: setting?.slidesToShow,
-            rowGap: styles?.horizontalGutter
-        })}'>
-        ${children}
-      </gp-same-height-v2>
-    `;
-    };
-    const renderGrid = (children)=>{
-        return core.template /* liquid */ `
-    <div items-repeat data-id="${builderProps?.uid}" style="${{
-            ...core.makeStyleResponsive('w', core.makeWidth(styles?.width, styles?.fullWidth)),
-            ...!setting?.sameHeight && core.makeStyleResponsive('rg', styles?.horizontalGutter),
-            ...core.makeStyleResponsive('cg', styles?.verticalGutter),
-            ...core.makeStyleResponsive('gtc', {
-                desktop: `repeat(${core.getResponsiveValueByScreen(setting?.slidesToShow, 'desktop')}, minmax(0, 1fr))`,
-                tablet: setting?.slidesToShow?.tablet && `repeat(${core.getResponsiveValueByScreen(setting?.slidesToShow, 'tablet')}, minmax(0, 1fr))`,
-                mobile: setting?.slidesToShow?.mobile && `repeat(${core.getResponsiveValueByScreen(setting?.slidesToShow, 'mobile')}, minmax(0, 1fr))`
-            })
-        }}"
-          class="${core.cls(className, 'gp-grid !gp-m-auto gp-w-full', setting?.sameHeight ? ' gp-grid-flow-row' : '', advanced?.cssClass)}"
-      >
-        ${core.RenderIf(setting?.sameHeight, renderSameHeightGrid(children))}
-        ${core.RenderIf(!setting?.sameHeight, core.template /* liquid */ `${children}`)}
-      </div>
-
-    `;
-    };
-    const renderCarousel = (children)=>{
-        return core.template /* liquid */ `
-        ${Carousel_liquid.default({
-            advanced: advanced,
-            builderProps: {
-                ...builderProps
-            },
-            rootAttr: 'items-repeat',
-            setting: {
-                loop: setting?.loop,
-                slidesToShow: setting?.slidesToShow,
-                dot: setting?.dot,
-                dotSize: {
-                    desktop: 12
-                },
-                dotGapToCarousel: {
-                    desktop: 16
-                },
-                dotStyle: updatedDotStyleFromOldData,
-                navigationStyle: updatedArrowSetting,
-                arrowCustom: setting?.arrowCustom,
-                controlOverContent: setting?.controlOverContent,
-                enableDrag: {
-                    desktop: setting?.dragToScroll,
-                    tablet: setting?.dragToScroll,
-                    mobile: setting?.dragToScroll
-                },
-                speed: setting?.speed,
-                dotActiveColor: setting?.dotActiveColor,
-                dotColor: setting?.dotColor,
-                autoplay: setting?.autoplay,
-                pauseOnHover: setting?.pauseOnHover,
-                autoplayTimeout: setting?.autoplayTimeout,
-                arrowCustomColor: setting?.arrowCustomColor,
-                arrowButtonSize: {
-                    desktop: {
-                        width: '24px',
-                        height: '24px'
-                    }
-                }
-            },
-            rootId: `product-list-carousel-${builderProps?.uid}`,
-            rootClass: 'gp-justify-center',
-            styles: {
-                sizeSetting: {
-                    ...product.getSizeSetting({
-                        adaptiveHeight: styles?.adaptiveHeight,
-                        fullWidth: styles?.fullWidth,
-                        width: styles?.width,
-                        height: styles?.height
-                    })
-                },
-                spacing: styles?.spacing
-            },
-            children: `
-        ${children}
-      `
-        })}
-    `;
-    };
-    const renderGridProductList = ()=>{
-        return core.template /* liquid */ `
-      ${renderGrid(`
-        {%- assign count = 0 -%}
-        {%- for product in products limit: limit -%}
-        {%- if product.id != empty -%}
-        {%- assign count = count | plus: 1 -%}
-        {%- assign variant = product.selected_or_first_available_variant -%}
-        {%- assign product_form_id = 'product-form-' | append: "${builderProps?.uid}" | append: product.id -%}
-            <gp-product 
-              class="${core.cls(`gp-child-item-${builderProps?.uid}`, setting?.sameHeight ? ' gp-contents' : '')}" 
-              gp-context='{"variantSelected": {{ variant | json | escape }}, "quantity": 1 ,  "formId": "{{ product_form_id }}"}' 
-              gp-data='{"variantSelected": {{ variant | json | escape }}, "quantity": 1, "productUrl":{{ product.url | json | escape }}, "productHandle":{{ product.handle | json | escape }}, "collectionUrl": {{ collection.url | json | escape }}, "collectionHandle": {{ collection.handle | json | escape }},"pageContext" : ${JSON.stringify(pageContext)}}'
-            >
-              {%- form 'product', product, id: product_form_id, class: 'form contents ${setting?.sameHeight ? ' gp-contents [&>div]:gp-grid [&>div]:gp-grid-rows-[subgrid] [&>div]:gp-gap-y-0 [&>div]:gp-grid-col-[subgrid] [&>*>div:nth-child(1)]:gp-contents' : ''}',  data-type: 'add-to-cart-form', autocomplete: 'off' -%}
-              <input type="hidden" name="id" value="{{ variant.id }}" />
-              <input type="hidden" min="1" name="quantity"  value="{{ quantity }}" />
-              <button type="submit" onclick="return false;" style="display:none;"></button>
-                      ${children ?? ''}
-              {%- endform -%}
-            </gp-product>
-        {%- endif -%}
-        {% endfor %}
-        {%- if count == 0 and ${productListId.length} == 0 -%}
-          {% if '${productSrc}' == 'RelatedProduct' -%}
-              <div>${helpers.getStaticLocale('ProductList', 'no_related_products')}</div>
-            {% else %}
-              <div>${helpers.getStaticLocale('ProductList', 'no_products_found')}</div>
-          {%- endif -%}
-        {%- endif -%}
-      `)}
-    `;
-    };
-    const renderCarouselProductList = ()=>{
-        return core.template /* liquid */ `
-    ${renderCarousel(`
-      {%- assign count = 0 -%}
-      {%- for product in products limit: limit -%}
-      {%- if product.id != empty -%}
-      {%- assign count = count | plus: 1 -%}
-      {%- assign variant = product.selected_or_first_available_variant -%}
-      {%- assign product_form_id = 'product-form-' | append: "${builderProps?.uid}" | append: product.id -%}
-                  ${CarouselItem_liquid.default({
-            builderProps: {
-                ...builderProps
-            },
-            style: {
-                ...carousel.getInitialWidthForCarouselItem({
-                    spacing: styles?.spacing,
-                    slidesToShow: setting?.slidesToShow
-                })
-            },
-            parentId: `product-list-carousel-${builderProps?.uid} gp-child-item-${builderProps?.uid}`,
-            children: `<gp-product gp-context='{"variantSelected": {{ variant | json | escape }}, "quantity": 1 ,  "formId": "{{ product_form_id }}"}' gp-data='{"variantSelected": {{ variant | json | escape }}, "quantity": 1, "productUrl":{{ product.url | json | escape }}, "productHandle":{{ product.handle | json | escape }}, "collectionUrl": {{ collection.url | json | escape }}, "collectionHandle": {{ collection.handle | json | escape }},"pageContext" : ${JSON.stringify(pageContext)}}'>
-                      {%- form 'product', product, id: product_form_id, class: 'form contents AddToCartForm',  data-type: 'add-to-cart-form',autocomplete: 'off' -%}
-                      <input type="hidden" name="id" value="{{ variant.id }}" />
-                      <input type="hidden" min="1" name="quantity"  value="{{ quantity }}" />
-                        <button type="submit" onclick="return false;" style="display:none;"></button>
-                        ${children ?? ''}
-                      {%- endform -%}
-                    </gp-product>`
-        })}
-      {%- endif -%}           
-      {%- endfor -%}
-      {%- if count == 0 and ${productListId.length} == 0 -%}
-          {% if '${productSrc}' == 'RelatedProduct' -%}
-              <div>${helpers.getStaticLocale('ProductList', 'no_related_products')}</div>
-            {% else %}
-              <div>${helpers.getStaticLocale('ProductList', 'no_products_found')}</div>
-          {%- endif -%}
-      {%- endif -%}
-    `)}
-    `;
-    };
-    const renderProductList = ()=>{
-        return core.template /* liquid */ `
-    {%- if products == null -%}
-    {%- if count == 0 and ${productListId.length} == 0 -%}
-      {% if '${productSrc}' == 'RelatedProduct' -%}
-          <div>${helpers.getStaticLocale('ProductList', 'no_related_products')}</div>
-        {% else %}
-          <div>${helpers.getStaticLocale('ProductList', 'no_products_found')}</div>
-      {%- endif -%}
-    {%- endif -%}
-    {%-else-%}
-      ${core.RenderIf(isGrid, renderGridProductList())}
-      ${core.RenderIf(!isGrid, renderCarouselProductList())}
-    {%- endif -%}
-    `;
-    };
-    const renderRelatedProduct = ()=>{
-        return core.template /* liquid */ `
-    ${core.RenderIf(productSrc === 'RelatedProduct', `
-        assign relatedTag = '${relatedTag}'
-        assign assignProduct = product
-        assign idAssignProduct = assignProduct.id
-        paginate collections.all.products by 10000
-          assign allProductsPaginated = collections.all.products
-        endpaginate
-        assign handleAssignProduct = assignProduct.handle
-        case relatedTag
-          when 'collection'
-            assign hasRelatedExclude = ${hasRelatedExclude}
-            if hasRelatedExclude
-              assign relatedExclude = '${relatedExcludeTrim}'
-            else
-              assign relatedExclude = ''
-            endif
-            assign arrayRelatedExclude = relatedExclude | split: ","
-            assign idSelectedList = ''
-            assign relatedListProduct = null
-            for collection in collections
-            assign collectionId = collection.id
-            assign isInCollection = false
-            assign collectionsAssignProduct = assignProduct.collections
-              for item in collectionsAssignProduct
-                unless arrayRelatedExclude contains item.handle
-                  if item.id == collectionId 
-                  for product in collection.products
-                    assign product_ids_array = idSelectedList | split: ","
-                    if product_ids_array contains product.id or product.id == idAssignProduct
-                    elsif product_ids_array.size > limit
-                     break
-                    else
-                      assign idSelectedList = idSelectedList | append: "," | append: product.id
-                      assign productSelected = product | sort
-                      assign relatedListProduct = relatedListProduct | concat: productSelected
-                    endif
-                  endfor
-                  endif
-                endunless
-              endfor
-            endfor
-            assign products = relatedListProduct | uniq
-          when 'vendor'
-            assign vendorAssignProduct = assignProduct.vendor
-            assign productFilter = allProductsPaginated | where: 'vendor', vendorAssignProduct
-            for item in productFilter
-              assign itemHandle = item.handle
-              assign productF = item | sort  
-              if itemHandle != handleAssignProduct
-                assign products = products | concat: productF
-              endif
-            endfor
-          when 'production-type'
-            assign typeAssignProduct = assignProduct.type
-            assign productFilter = allProductsPaginated | where: 'type', typeAssignProduct
-            for item in productFilter
-              assign itemHandle = item.handle
-              assign productF = item | sort  
-              if itemHandle != handleAssignProduct
-                assign products = products | concat: productF
-              endif
-            endfor
-          when 'tags'
-            assign tagsAssignProduct = assignProduct.tags 
-            assign hasRelatedExclude = ${hasRelatedExclude}
-            if hasRelatedExclude
-              assign relatedExclude = '${relatedExcludeTrim}'
-            else
-              assign relatedExclude = ''
-            endif
-            assign arrayRelatedExclude = relatedExclude | split: ","
-              for item in allProductsPaginated 
-                unless unique_products contains item.handle  
-                  assign isExcludedProduct = false
-                  for tagExclude in arrayRelatedExclude 
-                    if item.tags contains tagExclude
-                      assign isExcludedProduct = true 
-                    endif 
-                  endfor 
-                  unless isExcludedProduct 
-                    for tag in tagsAssignProduct 
-                      if item.tags contains tag and assignProduct.handle != item.handle 
-                        assign productF = item | sort
-                        assign products = products | concat: productF
-                      break  
-                        endif 
-                      endfor 
-                  endunless 
-                endunless 
-              endfor 
-            assign products = products | uniq
-        endcase
-        paginate products by ${numberOfProducts || 4}
-          assign products = products
-        endpaginate 
-      `)}
-  `;
-    };
-    if (pageContext?.pageType === 'GP_FUNNEL_PAGE') {
-        return '';
-    }
-    return core.template /* liquid */ `
-${core.RenderIf(core.isLocalEnv, `
-    <script ${helpers.getSettingPreloadData('class="gps-link" delay', 'src')}="{{ 'gp-product.v2.js' | asset_url }}" defer="defer"></script>
-    ${setting?.sameHeight ? `<script ${helpers.getSettingPreloadData('class="gps-link" delay', 'src')}="{{ 'gp-same-height.v2.js' | asset_url }}" defer="defer"></script>` : ''}
-    `, `
-    <script ${helpers.getSettingPreloadData('class="gps-link" delay', 'src')}="${core.baseAssetURL}/assets-v2/gp-product.v2.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>
-    ${setting?.sameHeight ? `<script ${helpers.getSettingPreloadData('class="gps-link" delay', 'src')}="${core.baseAssetURL}/assets-v2/gp-same-height.v2.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>` : ''}
-    `)}
-{%- assign gpBkProduct = product -%}
-{%- assign gpBkProducts = products -%}
-{%- liquid
-      assign productHandles = '${productListHandles.toString()}'| split: ','
-      assign products = null
-      assign target_collection = null
-      assign productSrc = '${productSrc}'
-      assign c = 0
-      assign limit = ${isGrid ? collectionID === 'latest' ? productSrc === 'RelatedProduct' ? numberOfProducts : productSetting?.numOfSelectedProducts || 4 : numberOfProducts : numberOfProducts}
-      if request.page_type == 'collection' or preview_page_type == 'collection'
-        assign target_collection = collection
-        if target_collection == empty or target_collection == null
-          if '${collectionID.toLowerCase()}' == 'latest'
-            assign target_collection = collections | sort: 'updated_at' ${isReverse ? '| reverse' : ''} | first
-          else
-            for collection in collections
-              if collection.id == ${collectionID}
-                assign target_collection = collection
-                break
-              endif
-            endfor
-          endif
-        endif
-        paginate target_collection.products by ${numberOfProducts || 4}
-          assign products = target_collection.products ${isSorted ? sortedBy : ''} ${isReverse ? '| reverse' : ''}
-        endpaginate
-      else
-        if productSrc == 'RelatedProduct'
-          ${renderRelatedProduct()}  
-        elsif productSrc == 'PickProduct'
-          unless ${isLatest} 
-            assign products = null | sort
-            for handle in productHandles
-              assign productH = all_products[handle] | sort
-              assign products = products | concat: productH
-            endfor
-            assign limit = products.length
-          else
-            if ${productListId.length} == 0
-              paginate collections.all.products by 100000
-                assign products = collections.all.products  | sort : "created_at"  | reverse
-              endpaginate
-            endif
-          endunless
-        else
-          if '${collectionID.toLowerCase()}' == 'latest'
-            assign target_collection = collections | sort: 'updated_at' ${isReverse ? '| reverse' : ''} | first
-          else
-            for collection in collections
-              if collection.id == ${collectionID}
-                assign target_collection = collection
-                break
-              endif
-            endfor
-          endif
-          paginate target_collection.products by ${numberOfProducts || 4}
-            assign products = target_collection.products ${isSorted ? sortedBy : ''} ${isReverse ? '| reverse' : ''}
-          endpaginate
-        endif
-      endif
-      -%}
-        ${renderProductList()}
-{%- assign product = gpBkProduct -%}
-{%- assign products = gpBkProducts -%}
-`;
-};
-
-exports.default = ProductList;

package/dist/cjs/product/components/ProductNotFoundRelated.js

@@ -1,65 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-
-const ProductNotFoundRelated = ({ assignProductNoTags, relatedTagString, noAssignedProduct })=>{
-    const openAssignProduct = ()=>{
-        const event = new CustomEvent('editor:toolbar:open-assigned-product', {
-            bubbles: true
-        });
-        window.dispatchEvent(event);
-    };
-    const changeConditionRelatedProduct = ()=>{
-        const event = new CustomEvent('editor:toolbar:change-condition-related-product', {
-            bubbles: true
-        });
-        window.dispatchEvent(event);
-    };
-    return /*#__PURE__*/ jsxRuntime.jsx("div", {
-        children: /*#__PURE__*/ jsxRuntime.jsxs("div", {
-            className: "gp-flex gp-flex-col gp-gap-[4px] gp-text-14 gp-leading-6",
-            children: [
-                noAssignedProduct && /*#__PURE__*/ jsxRuntime.jsx("div", {
-                    className: "gp-text-[#212121]",
-                    children: "There are no products in your store."
-                }),
-                assignProductNoTags && !noAssignedProduct ? /*#__PURE__*/ jsxRuntime.jsxs("div", {
-                    className: "gp-text-[#212121]",
-                    children: [
-                        "The ",
-                        /*#__PURE__*/ jsxRuntime.jsx("button", {
-                            className: "gp-no-underline gp-text-[#3C67FF] gp-font-medium",
-                            onClick: openAssignProduct,
-                            children: "assigned product"
-                        }),
-                        " being previewed does not belong to any ",
-                        relatedTagString,
-                        "."
-                    ]
-                }) : /*#__PURE__*/ jsxRuntime.jsxs("div", {
-                    className: "gp-text-[#212121]",
-                    children: [
-                        "There are no products in the same ",
-                        relatedTagString,
-                        " as the ",
-                        /*#__PURE__*/ jsxRuntime.jsx("button", {
-                            className: "gp-no-underline gp-text-[#3C67FF]",
-                            onClick: openAssignProduct,
-                            children: "assigned product"
-                        }),
-                        " being previewed."
-                    ]
-                }),
-                /*#__PURE__*/ jsxRuntime.jsx("button", {
-                    className: "gp-text-[#3C67FF] gp-font-medium",
-                    onClick: changeConditionRelatedProduct,
-                    children: "Change condition"
-                })
-            ]
-        })
-    });
-};
-
-exports.default = ProductNotFoundRelated;

package/dist/cjs/product/components/ProductPrice.js

@@ -1,168 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@gem-sdk/core');
-var React = require('react');
-var Text = require('../../text/components/Text.js');
-var common = require('./ProductVariants/common.js');
-
-const ProductPrice = (props)=>{
-    const { builderAttrs, style, children, setting, styles, builderProps, classNames } = props;
-    const elementRef = React.useRef(null);
-    const bundleItem = props['bundle-item'];
-    const mode = core.useEditorMode();
-    const { quantity, hasUpdatePrice } = core.useQuantity();
-    const currentVariant = core.useCurrentVariant();
-    const { useProductCompareAtPrice } = core.useProductBundleDiscount();
-    const currentProduct = core.useProduct();
-    const price = currentVariant?.price ?? 0;
-    const salePrice = currentVariant?.salePrice ?? 0;
-    const [hasThickness, setHasThickness] = React.useState(true);
-    const { trigger } = core.useInteraction();
-    const quantityProduct = React.useMemo(()=>{
-        if (bundleItem?.quantity) {
-            return bundleItem.quantity;
-        }
-        return hasUpdatePrice ? quantity || 1 : 1;
-    }, [
-        quantity,
-        hasUpdatePrice,
-        bundleItem?.quantity
-    ]);
-    const bundleDiscount = React.useMemo(()=>{
-        const value = Number(bundleItem?.discountValue);
-        if (bundleItem?.discountType === 'percentage') {
-            return price * quantityProduct * value / 100;
-        }
-        return value;
-    }, [
-        bundleItem?.discountType,
-        bundleItem?.discountValue,
-        price,
-        quantityProduct
-    ]);
-    const priceCompare = React.useMemo(()=>{
-        if (bundleItem?.discountValue) {
-            if (useProductCompareAtPrice) {
-                return salePrice * quantityProduct;
-            }
-            return price * quantityProduct;
-        }
-        return salePrice * quantityProduct;
-    }, [
-        bundleItem?.discountValue,
-        price,
-        quantityProduct,
-        salePrice,
-        useProductCompareAtPrice
-    ]);
-    const displayPrice = React.useMemo(()=>{
-        const quantityPrice = price * quantityProduct;
-        if (styles?.priceType === 'compare') {
-            return priceCompare;
-        }
-        if (bundleDiscount) {
-            return Math.max(0, quantityPrice - bundleDiscount);
-        }
-        return quantityPrice;
-    }, [
-        styles?.priceType,
-        price,
-        quantityProduct,
-        bundleDiscount,
-        priceCompare
-    ]);
-    const dispatchInteractionChangePrice = (value, type)=>{
-        trigger({
-            event: type === 'price' ? 'gp:rollback:price-change' : 'gp:rollback:compare-price-change',
-            selector: `[data-id="${builderProps?.uid}"]`,
-            element: elementRef.current
-        });
-        trigger({
-            event: type === 'price' ? 'gp:price-change' : 'gp:compare-price-change',
-            data: value,
-            selector: `[data-id="${builderProps?.uid}"]`,
-            element: elementRef.current
-        });
-    };
-    common.useTransition((oldPrice)=>{
-        if (oldPrice !== price) {
-            dispatchInteractionChangePrice(price, 'price');
-        }
-    }, [
-        price
-    ]);
-    common.useTransition((oldPriceCompare)=>{
-        if (oldPriceCompare !== salePrice) {
-            dispatchInteractionChangePrice(salePrice, 'compare');
-        }
-    }, [
-        salePrice
-    ]);
-    React.useEffect(()=>{
-        /* Support line-through on Safari */ if (!core.isSafari()) return;
-        setHasThickness(false);
-        setTimeout(()=>{
-            setHasThickness(true);
-        }, 50);
-    }, [
-        styles?.thickness
-    ]);
-    const moneyFormatted = core.useFormatMoney(displayPrice ?? 0, setting?.moneyWithCurrentFormat || false);
-    if (mode !== 'edit' && styles?.priceType === 'compare' && !displayPrice) return /*#__PURE__*/ jsxRuntime.jsx("div", {
-        ...builderAttrs,
-        className: core.cls(builderProps?.uid),
-        "data-id": builderProps?.uid,
-        ref: elementRef,
-        style: {
-            visibility: 'hidden',
-            opacity: 0,
-            maxWidth: 0,
-            maxHeight: 0
-        },
-        id: `shopify-text-element-${builderProps?.uid}`
-    });
-    const colorClass = core.getGlobalColorClass('decoration', styles?.lineColor);
-    const currentProductId = currentProduct?.baseID?.replace('gid://shopify/Product/', '');
-    return /*#__PURE__*/ jsxRuntime.jsxs("div", {
-        ...builderAttrs,
-        className: core.cls(builderProps?.uid),
-        "data-id": builderProps?.uid,
-        ref: elementRef,
-        style: {
-            ...style
-        },
-        id: `shopify-text-element-${builderProps?.uid}`,
-        "data-product-id": currentProductId,
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsx(Text.default, {
-                styles: styles,
-                setting: {
-                    text: moneyFormatted,
-                    excludeFlex: true
-                },
-                style: {
-                    ...core.getStyleShadow({
-                        value: setting?.boxShadowPrice,
-                        styleAppliedFor: 'box-shadow',
-                        isEnableShadow: setting?.hasBoxShadowPrice
-                    }),
-                    ...core.getGlobalColorStateStyle('c', styles?.parentTextColor),
-                    ...setting?.opacityPrice ? core.makeStyle({
-                        op: `${setting?.opacityPrice}%`
-                    }) : {}
-                },
-                className: core.cls({
-                    'gp-money': styles?.priceType === 'regular',
-                    'gp-product-compare-price': styles?.priceType === 'compare',
-                    'gp-line-through': styles?.priceType === 'compare' && styles?.lineThrough && hasThickness
-                }, core.getGlobalColorStateClass('text', styles?.parentTextColor), colorClass, classNames)
-            }),
-            children
-        ]
-    });
-};
-
-exports.default = ProductPrice;