@gem-sdk/components 2.1.12 → 2.1.13-staging.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/dist/cjs/builder.js +5 -1
  2. package/dist/cjs/index.js +4 -0
  3. package/dist/cjs/index.liquid.js +4 -0
  4. package/dist/cjs/post-purchase/product/components/ProductDiscountTag.js +5 -2
  5. package/dist/cjs/post-purchase/product/components/ProductOffer.js +16 -3
  6. package/dist/cjs/post-purchase/product/components/ProductPrice.js +3 -1
  7. package/dist/cjs/post-purchase/product/components/ProductPriceBreakdown.js +9 -21
  8. package/dist/cjs/post-purchase/product/constants/ProductOfferPlaceholder.js +127 -0
  9. package/dist/cjs/post-purchase/product/hooks/useDynamicProduct.js +28 -0
  10. package/dist/cjs/post-purchase/product/settings/ProductOffer.js +26 -0
  11. package/dist/cjs/third-party/components/HextomCountdownTimerBar.js +32 -0
  12. package/dist/cjs/third-party/components/HextomCountdownTimerBar.liquid.js +12 -0
  13. package/dist/cjs/third-party/components/TrustBadgesBear.js +32 -0
  14. package/dist/cjs/third-party/components/TrustBadgesBear.liquid.js +12 -0
  15. package/dist/cjs/third-party/configs/HextomCountdownTimerBar.js +12 -0
  16. package/dist/cjs/third-party/configs/TrustBadgesBear.js +12 -0
  17. package/dist/cjs/third-party/next.js +11 -1
  18. package/dist/cjs/third-party/setting/HextomCountdownTimerBar.js +128 -0
  19. package/dist/cjs/third-party/setting/TrustBadgesBear.js +128 -0
  20. package/dist/cjs/third-party/setting/index.js +5 -1
  21. package/dist/esm/builder.js +5 -1
  22. package/dist/esm/index.js +2 -0
  23. package/dist/esm/index.liquid.js +2 -0
  24. package/dist/esm/post-purchase/product/components/ProductDiscountTag.js +5 -2
  25. package/dist/esm/post-purchase/product/components/ProductOffer.js +16 -3
  26. package/dist/esm/post-purchase/product/components/ProductPrice.js +3 -1
  27. package/dist/esm/post-purchase/product/components/ProductPriceBreakdown.js +9 -21
  28. package/dist/esm/post-purchase/product/constants/ProductOfferPlaceholder.js +125 -0
  29. package/dist/esm/post-purchase/product/hooks/useDynamicProduct.js +26 -0
  30. package/dist/esm/post-purchase/product/settings/ProductOffer.js +26 -0
  31. package/dist/esm/third-party/components/HextomCountdownTimerBar.js +28 -0
  32. package/dist/esm/third-party/components/HextomCountdownTimerBar.liquid.js +8 -0
  33. package/dist/esm/third-party/components/TrustBadgesBear.js +28 -0
  34. package/dist/esm/third-party/components/TrustBadgesBear.liquid.js +8 -0
  35. package/dist/esm/third-party/configs/HextomCountdownTimerBar.js +8 -0
  36. package/dist/esm/third-party/configs/TrustBadgesBear.js +8 -0
  37. package/dist/esm/third-party/next.js +11 -1
  38. package/dist/esm/third-party/setting/HextomCountdownTimerBar.js +124 -0
  39. package/dist/esm/third-party/setting/TrustBadgesBear.js +124 -0
  40. package/dist/esm/third-party/setting/index.js +206 -202
  41. package/dist/types/index.d.ts +34 -1
  42. package/package.json +2 -2
@@ -0,0 +1,128 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var HextomCountdownTimerBar = require('../configs/HextomCountdownTimerBar.js');
6
+
7
+ const config = {
8
+ tag: HextomCountdownTimerBar.default.tag,
9
+ label: HextomCountdownTimerBar.default.label,
10
+ icon: '<img class="gp-w-6 gp-border gp-border-[#494949] gp-rounded-[3px]" src="https://cdn.shopify.com/app-store/listing_images/904be13e4bba460880341eba1a5579e1/icon/CKCYtc2d5oYDEAE=.png">',
11
+ editorConfigs: {
12
+ component: {
13
+ isThirdParty: true
14
+ }
15
+ },
16
+ presets: [
17
+ {
18
+ id: HextomCountdownTimerBar.default.id,
19
+ name: {
20
+ en: HextomCountdownTimerBar.default.label
21
+ },
22
+ hideTextContent: true,
23
+ icon: {
24
+ desktop: `<div class="w-full flex flex-col items-center">
25
+ <img class="w-24 border border-dark-200 rounded-medium" src="https://cdn.shopify.com/app-store/listing_images/904be13e4bba460880341eba1a5579e1/icon/CKCYtc2d5oYDEAE=.png">
26
+ <span class="preset-item-title">Hextom: Countdown Timer Bar</span>
27
+ </div>`
28
+ },
29
+ components: [
30
+ {
31
+ tag: HextomCountdownTimerBar.default.tag
32
+ }
33
+ ]
34
+ }
35
+ ],
36
+ settings: [
37
+ {
38
+ id: 'setting',
39
+ controls: [
40
+ {
41
+ id: 'appBlockId',
42
+ type: 'input',
43
+ default: ''
44
+ },
45
+ {
46
+ id: 'widgetType',
47
+ label: 'Choose widget',
48
+ type: 'select',
49
+ options: [
50
+ {
51
+ label: 'Fsb Custom Placement',
52
+ value: 'fsb-custom-placement'
53
+ }
54
+ ],
55
+ default: 'fsb-custom-placement'
56
+ },
57
+ {
58
+ id: 'install',
59
+ type: 'open-link',
60
+ target: '_blank',
61
+ linkType: 'install',
62
+ href: 'https://apps.shopify.com/event-promotion-bar?utm_source=gempages',
63
+ appName: HextomCountdownTimerBar.default.label
64
+ },
65
+ {
66
+ id: 'openApp',
67
+ type: 'open-link',
68
+ target: '_blank',
69
+ linkType: 'openApp',
70
+ href: '',
71
+ appName: HextomCountdownTimerBar.default.label
72
+ },
73
+ {
74
+ id: 'align',
75
+ label: 'Alignment',
76
+ type: 'segment',
77
+ options: [
78
+ {
79
+ label: 'Left',
80
+ value: 'left',
81
+ type: 'align'
82
+ },
83
+ {
84
+ label: 'Center',
85
+ value: 'center',
86
+ type: 'align'
87
+ },
88
+ {
89
+ label: 'Right',
90
+ value: 'right',
91
+ type: 'align'
92
+ }
93
+ ],
94
+ devices: {
95
+ desktop: {
96
+ default: 'left'
97
+ }
98
+ }
99
+ }
100
+ ]
101
+ }
102
+ ],
103
+ ui: [
104
+ {
105
+ type: 'control',
106
+ setting: {
107
+ id: 'install'
108
+ }
109
+ },
110
+ {
111
+ type: 'control',
112
+ setting: {
113
+ id: 'openApp'
114
+ }
115
+ },
116
+ {
117
+ type: 'control',
118
+ label: {
119
+ en: 'Align'
120
+ },
121
+ setting: {
122
+ id: 'align'
123
+ }
124
+ }
125
+ ]
126
+ };
127
+
128
+ exports.default = config;
@@ -0,0 +1,128 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var TrustBadgesBear = require('../configs/TrustBadgesBear.js');
6
+
7
+ const config = {
8
+ tag: TrustBadgesBear.default.tag,
9
+ label: TrustBadgesBear.default.label,
10
+ icon: '<img class="gp-w-6 gp-border gp-border-[#494949] gp-rounded-[3px]" src="https://cdn.shopify.com/app-store/listing_images/c9141bfba8db18a258f290a5a639986e/icon/CLDR_q6erfwCEAE=.png">',
11
+ editorConfigs: {
12
+ component: {
13
+ isThirdParty: true
14
+ }
15
+ },
16
+ presets: [
17
+ {
18
+ id: TrustBadgesBear.default.id,
19
+ name: {
20
+ en: TrustBadgesBear.default.label
21
+ },
22
+ hideTextContent: true,
23
+ icon: {
24
+ desktop: `<div class="w-full flex flex-col items-center">
25
+ <img class="w-24 border border-dark-200 rounded-medium" src="https://cdn.shopify.com/app-store/listing_images/c9141bfba8db18a258f290a5a639986e/icon/CLDR_q6erfwCEAE=.png">
26
+ <span class="preset-item-title">Trust Badges Bear</span>
27
+ </div>`
28
+ },
29
+ components: [
30
+ {
31
+ tag: TrustBadgesBear.default.tag
32
+ }
33
+ ]
34
+ }
35
+ ],
36
+ settings: [
37
+ {
38
+ id: 'setting',
39
+ controls: [
40
+ {
41
+ id: 'appBlockId',
42
+ type: 'input',
43
+ default: ''
44
+ },
45
+ {
46
+ id: 'widgetType',
47
+ label: 'Choose widget',
48
+ type: 'select',
49
+ options: [
50
+ {
51
+ label: 'Widget',
52
+ value: 'widget'
53
+ }
54
+ ],
55
+ default: 'widget'
56
+ },
57
+ {
58
+ id: 'install',
59
+ type: 'open-link',
60
+ target: '_blank',
61
+ linkType: 'install',
62
+ href: 'https://apps.shopify.com/ultimate-trust-badges?utm_source=gempages',
63
+ appName: TrustBadgesBear.default.label
64
+ },
65
+ {
66
+ id: 'openApp',
67
+ type: 'open-link',
68
+ target: '_blank',
69
+ linkType: 'openApp',
70
+ href: 'https://admin.shopify.com/?redirect=/apps/ultimate-trust-badge',
71
+ appName: TrustBadgesBear.default.label
72
+ },
73
+ {
74
+ id: 'align',
75
+ label: 'Alignment',
76
+ type: 'segment',
77
+ options: [
78
+ {
79
+ label: 'Left',
80
+ value: 'left',
81
+ type: 'align'
82
+ },
83
+ {
84
+ label: 'Center',
85
+ value: 'center',
86
+ type: 'align'
87
+ },
88
+ {
89
+ label: 'Right',
90
+ value: 'right',
91
+ type: 'align'
92
+ }
93
+ ],
94
+ devices: {
95
+ desktop: {
96
+ default: 'left'
97
+ }
98
+ }
99
+ }
100
+ ]
101
+ }
102
+ ],
103
+ ui: [
104
+ {
105
+ type: 'control',
106
+ setting: {
107
+ id: 'install'
108
+ }
109
+ },
110
+ {
111
+ type: 'control',
112
+ setting: {
113
+ id: 'openApp'
114
+ }
115
+ },
116
+ {
117
+ type: 'control',
118
+ label: {
119
+ en: 'Align'
120
+ },
121
+ setting: {
122
+ id: 'align'
123
+ }
124
+ }
125
+ ]
126
+ };
127
+
128
+ exports.default = config;
@@ -103,8 +103,11 @@ var TrustreviewsProductReviews = require('./TrustreviewsProductReviews.js');
103
103
  var MyappgurusProductReviews = require('./MyappgurusProductReviews.js');
104
104
  var HulkProductOptions = require('./HulkProductOptions.js');
105
105
  var TrustshopProductReviews = require('./TrustshopProductReviews.js');
106
+ var HextomCountdownTimerBar = require('./HextomCountdownTimerBar.js');
107
+ var TrustBadgesBear = require('./TrustBadgesBear.js');
106
108
 
107
109
  var index = {
110
+ HextomCountdownTimerBar: HextomCountdownTimerBar.default,
108
111
  TrustshopProductReviews: TrustshopProductReviews.default,
109
112
  HulkProductOptions: HulkProductOptions.default,
110
113
  TrustreviewsProductReviews: TrustreviewsProductReviews.default,
@@ -205,7 +208,8 @@ var index = {
205
208
  KingProductOptions: KingProductOptions.default,
206
209
  RequestQuoteHidePrice: RequestQuoteHidePrice.default,
207
210
  BirdChime: BirdChime.default,
208
- FordeerProductLabels: FordeerProductLabels.default
211
+ FordeerProductLabels: FordeerProductLabels.default,
212
+ TrustBadgesBear: TrustBadgesBear.default
209
213
  };
210
214
 
211
215
  exports.default = index;
@@ -107,6 +107,8 @@ import TrustreviewsProductReviews from './third-party/components/TrustreviewsPro
107
107
  import MyappgurusProductReviews from './third-party/components/MyappgurusProductReviews.js';
108
108
  import HulkProductOptions from './third-party/components/HulkProductOptions.js';
109
109
  import TrustshopProductReviews from './third-party/components/TrustshopProductReviews.js';
110
+ import HextomCountdownTimerBar from './third-party/components/HextomCountdownTimerBar.js';
111
+ import TrustBadgesBear from './third-party/components/TrustBadgesBear.js';
110
112
  import CartLineVariant from './cart/components/CartLineVariant.js';
111
113
  import Cart from './cart/components/Cart.js';
112
114
  import CartList from './cart/components/CartList.js';
@@ -475,7 +477,9 @@ var builder = {
475
477
  ArticleReadMore,
476
478
  Marquee,
477
479
  MarqueeItem,
478
- ProductBadge
480
+ ProductBadge,
481
+ HextomCountdownTimerBar,
482
+ TrustBadgesBear
479
483
  };
480
484
 
481
485
  export { builder as default };
package/dist/esm/index.js CHANGED
@@ -205,6 +205,8 @@ export { default as TrustreviewsProductReviews } from './third-party/components/
205
205
  export { default as MyappgurusProductReviews } from './third-party/components/MyappgurusProductReviews.js';
206
206
  export { default as HulkProductOptions } from './third-party/components/HulkProductOptions.js';
207
207
  export { default as TrustshopProductReviews } from './third-party/components/TrustshopProductReviews.js';
208
+ export { default as HextomCountdownTimerBar } from './third-party/components/HextomCountdownTimerBar.js';
209
+ export { default as TrustBadgesBear } from './third-party/components/TrustBadgesBear.js';
208
210
  export { default as thirdPartyInstantSetting } from './third-party-instant/setting/index.js';
209
211
  export { default as InstantJudgemeReviews } from './third-party-instant/components/InstantJudgemeReviews.js';
210
212
  export { default as InstantLooxReviews } from './third-party-instant/components/InstantLooxReviews.js';
@@ -159,6 +159,8 @@ export { default as SeoantTrustBadgesIcon } from './third-party/components/Seoan
159
159
  export { default as TrustreviewsProductReviews } from './third-party/components/TrustreviewsProductReviews.liquid.js';
160
160
  export { default as MyappgurusProductReviews } from './third-party/components/MyappgurusProductReviews.liquid.js';
161
161
  export { default as HulkProductOptions } from './third-party/components/HulkProductOptions.liquid.js';
162
+ export { default as HextomCountdownTimerBar } from './third-party/components/HextomCountdownTimerBar.liquid.js';
163
+ export { default as TrustBadgesBear } from './third-party/components/TrustBadgesBear.liquid.js';
162
164
  export { default as TrustshopProductReviews } from './third-party/components/TrustshopProductReviews.liquid.js';
163
165
  export { default as ImageComparison } from './image-comparison/components/ImageComparison.liquid.js';
164
166
  export { default as ThirdPartySlot } from './third-party-slot/components/ThirdPartySlot.liquid.js';
@@ -1,26 +1,29 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import { useProduct, useProductOfferDiscount, cls } from '@gem-sdk/core';
3
3
  import Text from '../../text/Text.js';
4
+ import { useDynamicProduct } from '../hooks/useDynamicProduct.js';
4
5
 
5
6
  const PostPurchaseProductDiscountTag = ({ setting = {}, styles = {}, style, builderAttrs, builderProps, children })=>{
6
7
  const currentProduct = useProduct();
7
8
  const currentProductId = currentProduct?.baseID?.replace('gid://shopify/Product/', '');
8
9
  const currentOfferDiscount = useProductOfferDiscount();
10
+ const { isDynamicProduct, isEnableDynamicDiscount } = useDynamicProduct();
9
11
  const { typo } = styles;
10
12
  const { message } = setting;
13
+ const hasDiscount = !!currentOfferDiscount || isDynamicProduct && isEnableDynamicDiscount;
11
14
  return /*#__PURE__*/ jsxs("div", {
12
15
  ...builderAttrs,
13
16
  className: cls(builderProps?.uid, 'gp-flex gp-w-full'),
14
17
  style: {
15
18
  ...style,
16
- opacity: currentOfferDiscount ? 1 : 0.2
19
+ opacity: hasDiscount ? 1 : 0.2
17
20
  },
18
21
  id: `shopify-text-element-${builderProps?.uid}`,
19
22
  "data-product-id": currentProductId,
20
23
  children: [
21
24
  /*#__PURE__*/ jsx(Text, {
22
25
  setting: {
23
- text: currentOfferDiscount ? message : message?.replace(new RegExp(/\{\{Discount\}\}/, 'gi'), '0%')
26
+ text: hasDiscount ? message : message?.replace(new RegExp(/\{\{Discount\}\}/, 'gi'), '0%')
24
27
  },
25
28
  styles: {
26
29
  typo
@@ -7,14 +7,20 @@ import Loading from '../../../common/components/Loading.js';
7
7
  import { DEVICES } from './ProductVariant.js';
8
8
  import { postPurchaseViewSpacing } from '../../utils/helper.js';
9
9
  import { hasPublicStoreFrontData, createStoreFrontFetcher } from '../helpers/index.js';
10
+ import { productOfferPlaceholder } from '../constants/ProductOfferPlaceholder.js';
11
+ import { useDynamicProduct } from '../hooks/useDynamicProduct.js';
10
12
 
11
13
  const PostPurchaseProductOffer = ({ styles, builderAttrs, builderProps, children, setting })=>{
12
14
  const mode = useEditorMode();
13
- const { productSetting, productOfferLayout, inlineAlignment, ...rowSetting } = setting || {};
15
+ const { productSetting, productOfferLayout, inlineAlignment, discountAndShippingFee, ...rowSetting } = setting || {};
14
16
  const { productOfferColumnGap, productOfferVerticalGutter, productOfferWidth, ...rowStyles } = styles || {};
15
17
  const productOffers = usePageStore((s)=>s.productOffers);
16
18
  const publicStoreFrontData = usePageStore((s)=>s.publicStoreFrontData);
17
- const totalProduct = useMemo(()=>productOffers?.length, [
19
+ const { isDynamicProduct } = useDynamicProduct();
20
+ const dynamicDiscountOffer = usePageStore((s)=>s.dynamicDiscountOffer);
21
+ const totalProduct = useMemo(()=>isDynamicProduct ? dynamicDiscountOffer?.appliedProductCount : productOffers?.length, [
22
+ dynamicDiscountOffer?.appliedProductCount,
23
+ isDynamicProduct,
18
24
  productOffers?.length
19
25
  ]);
20
26
  const sortedProductBaseIDs = useMemo(()=>{
@@ -40,7 +46,14 @@ const PostPurchaseProductOffer = ({ styles, builderAttrs, builderProps, children
40
46
  const products = useMemo(()=>flattenConnection(productData.data?.products), [
41
47
  productData.data?.products
42
48
  ]);
43
- const productSortedById = sortedProductBaseIDs?.map((id)=>products?.find((el)=>el?.baseID === id)).filter(Boolean);
49
+ const productSortedById = useMemo(()=>{
50
+ return isDynamicProduct && dynamicDiscountOffer?.appliedProductCount ? Array(dynamicDiscountOffer.appliedProductCount).fill(productOfferPlaceholder) : sortedProductBaseIDs?.map((id)=>products?.find((el)=>el?.baseID === id)).filter(Boolean);
51
+ }, [
52
+ isDynamicProduct,
53
+ dynamicDiscountOffer?.appliedProductCount,
54
+ sortedProductBaseIDs,
55
+ products
56
+ ]);
44
57
  const getStyles = ()=>{
45
58
  return {
46
59
  ...makeStyleResponsive('cg', productOfferColumnGap),
@@ -2,6 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import { useCurrentVariant, useProduct, shopifyPriceRounding, useProductOfferDiscount, useFormatMoney, cls } from '@gem-sdk/core';
3
3
  import { useMemo } from 'react';
4
4
  import Text from '../../text/Text.js';
5
+ import { useDynamicProduct } from '../hooks/useDynamicProduct.js';
5
6
 
6
7
  const PostPurchaseProductPrice = ({ styles, style, builderAttrs, builderProps, children })=>{
7
8
  const currentVariant = useCurrentVariant();
@@ -9,6 +10,7 @@ const PostPurchaseProductPrice = ({ styles, style, builderAttrs, builderProps, c
9
10
  const price = currentVariant?.price ?? 0;
10
11
  const salePrice = currentVariant?.salePrice ?? 0;
11
12
  const discount = parseFloat(shopifyPriceRounding(useProductOfferDiscount(), 2));
13
+ const { isDynamicProduct } = useDynamicProduct();
12
14
  const priceShow = useMemo(()=>{
13
15
  if (!discount) {
14
16
  if (styles?.priceType === 'compare') {
@@ -49,7 +51,7 @@ const PostPurchaseProductPrice = ({ styles, style, builderAttrs, builderProps, c
49
51
  /*#__PURE__*/ jsx(Text, {
50
52
  styles: styles,
51
53
  setting: {
52
- text: moneyFormatted
54
+ text: isDynamicProduct ? '$???' : moneyFormatted
53
55
  },
54
56
  className: cls({
55
57
  'gp-money': styles?.priceType === 'regular',
@@ -3,6 +3,7 @@ import { useCurrentVariant, useProduct, useQuantity, useProductOfferDiscount, us
3
3
  import { useMemo, useState, useEffect, Fragment as Fragment$1 } from 'react';
4
4
  import { postPurchaseSpacing } from '../../utils/helper.js';
5
5
  import MoneyLine from './priceBreakdown/MoneyLine.js';
6
+ import { useDynamicProduct } from '../hooks/useDynamicProduct.js';
6
7
 
7
8
  const PostPurchaseProductPriceBreakdown = ({ setting = {}, styles = {}, style, builderAttrs, builderProps, children })=>{
8
9
  const currentVariant = useCurrentVariant();
@@ -17,6 +18,7 @@ const PostPurchaseProductPriceBreakdown = ({ setting = {}, styles = {}, style, b
17
18
  const discountShopifyFormat = shopifyPriceRounding(discountWithQuantity, 2);
18
19
  const totalMoneyFormatted = useFormatMoney(subTotal - parseFloat(discountShopifyFormat), false);
19
20
  const currentProductId = currentProduct?.baseID?.replace('gid://shopify/Product/', '');
21
+ const { isDynamicProduct, dynamicPrice, dynamicDiscount, isEnableDynamicDiscount } = useDynamicProduct();
20
22
  const { labelStyle, moneyStyle, spacing, width, align, isShowPrice } = styles;
21
23
  const itemGap = useMemo(()=>{
22
24
  return postPurchaseSpacing[spacing || 'none'];
@@ -29,19 +31,19 @@ const PostPurchaseProductPriceBreakdown = ({ setting = {}, styles = {}, style, b
29
31
  }, [
30
32
  isShowPrice
31
33
  ]);
32
- const moneyLines = useMemo(()=>{
34
+ const getMoneyLines = ()=>{
33
35
  const data = [];
34
36
  if (styles.isShowSubTotalLabel !== false) {
35
37
  data.push({
36
38
  title: setting.subTotalLabel,
37
- money: subTotalMoneyFormatted,
39
+ money: isDynamicProduct ? dynamicPrice : subTotalMoneyFormatted,
38
40
  uniqueId: 'subTotalLabel'
39
41
  });
40
42
  }
41
43
  if (styles.isShowDiscountLabel !== false) {
42
44
  data.push({
43
45
  title: setting.discountLabel,
44
- money: discount > 0 ? discountMoneyFormatted : 'No discount',
46
+ money: isDynamicProduct && dynamicDiscount && isEnableDynamicDiscount ? dynamicPrice : discount > 0 ? discountMoneyFormatted : 'No discount',
45
47
  uniqueId: 'discountLabel'
46
48
  });
47
49
  }
@@ -67,25 +69,11 @@ const PostPurchaseProductPriceBreakdown = ({ setting = {}, styles = {}, style, b
67
69
  }
68
70
  data.push({
69
71
  title: setting.totalLabel,
70
- money: totalMoneyFormatted,
72
+ money: isDynamicProduct ? dynamicPrice : totalMoneyFormatted,
71
73
  uniqueId: 'totalLabel'
72
74
  });
73
75
  return data;
74
- }, [
75
- discount,
76
- discountMoneyFormatted,
77
- setting.discountLabel,
78
- setting.shippingLabel,
79
- setting.subTotalLabel,
80
- setting.taxesLabel,
81
- setting.totalLabel,
82
- styles.isShowSubTotalLabel,
83
- styles.isShowDiscountLabel,
84
- styles.isShowShippingLabel,
85
- styles.isShowTaxesLabel,
86
- subTotalMoneyFormatted,
87
- totalMoneyFormatted
88
- ]);
76
+ };
89
77
  return /*#__PURE__*/ jsxs(Fragment, {
90
78
  children: [
91
79
  /*#__PURE__*/ jsxs("div", {
@@ -136,9 +124,9 @@ const PostPurchaseProductPriceBreakdown = ({ setting = {}, styles = {}, style, b
136
124
  ...makeStyleResponsive('w', width),
137
125
  gap: itemGap
138
126
  },
139
- children: moneyLines.map((item)=>/*#__PURE__*/ jsxs(Fragment$1, {
127
+ children: getMoneyLines().map((item)=>/*#__PURE__*/ jsxs(Fragment$1, {
140
128
  children: [
141
- item.uniqueId === 'totalLabel' && moneyLines.length > 1 && /*#__PURE__*/ jsx("hr", {}),
129
+ item.uniqueId === 'totalLabel' && getMoneyLines().length > 1 && /*#__PURE__*/ jsx("hr", {}),
142
130
  /*#__PURE__*/ jsx("div", {
143
131
  children: /*#__PURE__*/ jsx(MoneyLine, {
144
132
  uniqueId: item.uniqueId,
@@ -0,0 +1,125 @@
1
+ const productOfferPlaceholder = {
2
+ id: '',
3
+ title: 'Dynamic product',
4
+ description: 'This is a dynamic product. The actual product will appear here based on your setup',
5
+ descriptionHtml: '<p class="QN2lPu">This is a dynamic product. The actual product will</p>\n<p class="QN2lPu">appear here based on your setup</p>',
6
+ createdAt: '2024-07-01T04:19:51.286753Z',
7
+ handle: 'dynamic-product',
8
+ averageRating: 0,
9
+ isStorefront: true,
10
+ isSample: false,
11
+ baseID: '',
12
+ sku: '',
13
+ options: [
14
+ {
15
+ id: '1',
16
+ name: 'Variant',
17
+ optionType: '',
18
+ values: [
19
+ {
20
+ id: '1',
21
+ label: 'Variant option',
22
+ isDefault: true,
23
+ baseID: '1'
24
+ }
25
+ ]
26
+ }
27
+ ],
28
+ vendor: '',
29
+ featuredImage: {
30
+ id: '542178560626918105',
31
+ contentType: 'IMAGE',
32
+ previewImage: '',
33
+ src: 'https://cdn.shopify.com/s/files/1/0858/3168/0279/files/gempages_502328832959710176-312cf60c-d923-4913-9873-66545effe9cc.png',
34
+ width: 449,
35
+ height: 449,
36
+ alt: ''
37
+ },
38
+ collections: {
39
+ edges: [
40
+ {
41
+ node: {
42
+ id: '502321959132988135',
43
+ title: 'Home page'
44
+ }
45
+ },
46
+ {
47
+ node: {
48
+ id: '539286505089204764',
49
+ title: 'b'
50
+ }
51
+ },
52
+ {
53
+ node: {
54
+ id: '539286505089401372',
55
+ title: 'e'
56
+ }
57
+ }
58
+ ]
59
+ },
60
+ tags: [],
61
+ medias: {
62
+ edges: [
63
+ {
64
+ cursor: 'gqFpzweGNIc/AALZoXYB',
65
+ node: {
66
+ id: '542178560626918105',
67
+ contentType: 'IMAGE',
68
+ previewImage: '',
69
+ src: 'https://cdn.shopify.com/s/files/1/0858/3168/0279/files/gempages_502328832959710176-312cf60c-d923-4913-9873-66545effe9cc.png',
70
+ width: 449,
71
+ height: 449,
72
+ alt: ''
73
+ }
74
+ }
75
+ ],
76
+ pageInfo: {
77
+ endCursor: 'gqFpzweGNIc/AALZoXYB',
78
+ hasNextPage: true
79
+ }
80
+ },
81
+ variants: {
82
+ edges: [
83
+ {
84
+ cursor: 'gqFpzwc5ZqRtDAMIoXYC',
85
+ node: {
86
+ id: '520560088328176392',
87
+ title: 'Default Title',
88
+ barcode: '',
89
+ baseID: 'gid://shopify/ProductVariant/49298248925463',
90
+ costPrice: 88,
91
+ height: 0,
92
+ inventoryPolicy: 'DENY',
93
+ inventoryQuantity: 211,
94
+ inventoryStatus: '',
95
+ isDigital: true,
96
+ length: 0,
97
+ lowInventoryAmount: 0,
98
+ manageInventory: false,
99
+ mediaId: '0',
100
+ platform: 'SHOPIFY',
101
+ price: 88,
102
+ salePrice: 88,
103
+ sku: '',
104
+ soldIndividually: false,
105
+ weight: 0,
106
+ width: 0,
107
+ selectedOptions: [
108
+ {
109
+ name: 'Variant',
110
+ value: 'Variant option',
111
+ optionType: ''
112
+ }
113
+ ],
114
+ media: undefined
115
+ }
116
+ }
117
+ ],
118
+ pageInfo: {
119
+ hasNextPage: false,
120
+ endCursor: 'gaFpzwc5ZqRtDAMI'
121
+ }
122
+ }
123
+ };
124
+
125
+ export { productOfferPlaceholder };
@@ -0,0 +1,26 @@
1
+ import { usePageStore } from '@gem-sdk/core';
2
+ import { useMemo } from 'react';
3
+
4
+ const useDynamicProduct = ()=>{
5
+ const dynamicDiscountOffer = usePageStore((s)=>s.dynamicDiscountOffer);
6
+ const isDynamicProduct = useMemo(()=>{
7
+ return !!dynamicDiscountOffer;
8
+ }, [
9
+ dynamicDiscountOffer
10
+ ]);
11
+ // false = No discount
12
+ const isEnableDynamicDiscount = useMemo(()=>{
13
+ return dynamicDiscountOffer?.isEnabled;
14
+ }, [
15
+ dynamicDiscountOffer
16
+ ]);
17
+ const dynamicPrice = '$???';
18
+ return {
19
+ isDynamicProduct,
20
+ dynamicPrice,
21
+ dynamicDiscount: dynamicDiscountOffer,
22
+ isEnableDynamicDiscount
23
+ };
24
+ };
25
+
26
+ export { useDynamicProduct };