@gem-sdk/components 2.1.13-staging.26 → 2.1.13-staging.28

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 (14) hide show
  1. package/dist/cjs/carousel/components/Carousel.liquid.js +3 -2
  2. package/dist/cjs/product/components/ProductImagesV2/liquid/ProductFeaturedImageCarousel.liquid.js +2 -1
  3. package/dist/cjs/third-party/components/NotifyBackInStockPreOrder.js +1 -1
  4. package/dist/cjs/third-party/components/ShopifySubscriptions.liquid.js +3 -2
  5. package/dist/cjs/third-party/setting/NotifyBackInStockPreOrder.js +2 -2
  6. package/dist/cjs/third-party/setting/ShopifySubscriptions.js +22 -0
  7. package/dist/esm/carousel/components/Carousel.liquid.js +3 -2
  8. package/dist/esm/product/components/ProductImagesV2/liquid/ProductFeaturedImageCarousel.liquid.js +2 -1
  9. package/dist/esm/third-party/components/NotifyBackInStockPreOrder.js +1 -1
  10. package/dist/esm/third-party/components/ShopifySubscriptions.liquid.js +3 -2
  11. package/dist/esm/third-party/setting/NotifyBackInStockPreOrder.js +2 -2
  12. package/dist/esm/third-party/setting/ShopifySubscriptions.js +22 -0
  13. package/dist/types/index.d.ts +5 -1
  14. package/package.json +2 -2
package/dist/cjs/carousel/components/Carousel.liquid.js CHANGED
@@ -13,7 +13,7 @@ const DEVICES = [
13
13
  'tablet',
14
14
  'desktop'
15
15
  ];
16
- const Carousel = ({ builderAttrs, builderProps, style, styles, moveToIdx, rootId, rootAttr, rootClass, wrapperClass, rootStyles, children, rawChildren, isHiddenArrowWhenDisabled = true, advanced, disableMarginAuto, conditionAppendJs, ...props })=>{
16
+ const Carousel = ({ builderAttrs, builderProps, style, styles, moveToIdx, rootId, rootAttr, rootClass, wrapperClass, rootStyles, children, rawChildren, isHiddenArrowWhenDisabled = true, advanced, disableMarginAuto, conditionAppendJs, ftShapeProductImage, ...props })=>{
17
17
  const setting = arrow.mappingNavigationCarousel(props.setting);
18
18
  const styleHeight = core.makeStyleResponsive('h', core.getHeightByShapeGlobalSize(styles?.sizeSetting));
19
19
  const styleWidth = core.makeStyleWithDefault('w', core.getWidthByShapeGlobalSize(styles?.sizeSetting, true), {
@@ -112,7 +112,8 @@ const Carousel = ({ builderAttrs, builderProps, style, styles, moveToIdx, rootId
112
112
  setting,
113
113
  styles,
114
114
  moveToIdx,
115
- isHiddenArrowWhenDisabled
115
+ isHiddenArrowWhenDisabled,
116
+ ftShapeProductImage
116
117
  }).replaceAll("'", ''')}' style="${{
117
118
  ...core.makeStyleResponsive('jc', styles?.align),
118
119
  ...rootStyles
package/dist/cjs/product/components/ProductImagesV2/liquid/ProductFeaturedImageCarousel.liquid.js CHANGED
@@ -401,7 +401,8 @@ const ProductFeaturedImageCarousel = ({ builderPropUID, children, enableLazyLoad
401
401
  enableLazyLoadImage
402
402
  })}
403
403
  {%- endif -%}
404
- `
404
+ `,
405
+ ftShapeProductImage: setting?.ftShape
405
406
  })}
406
407
  `;
407
408
  };
package/dist/cjs/third-party/components/NotifyBackInStockPreOrder.js CHANGED
@@ -9,7 +9,7 @@ var ThirdPartyPreview = require('./ThirdPartyPreview.js');
9
9
  const AppConfig = {
10
10
  id: 'notify-back-in-stockpreorder',
11
11
  label: 'Notify! Back in Stock|PreOrder',
12
- logoUrl: 'https://cdn.shopify.com/app-store/listing_images/9216cd5dd17ab1a38de2641bae109159/icon/CNWHjbfSt4MDEAE=.png',
12
+ logoUrl: 'https://cdn.shopify.com/s/files/1/0643/0497/1949/files/Notify_Me_Logo.png?v=1736234550',
13
13
  tag: 'NotifyBackInStockPreOrder'
14
14
  };
15
15
  const NotifyBackInStockPreOrderContent = ()=>{
package/dist/cjs/third-party/components/ShopifySubscriptions.liquid.js CHANGED
@@ -3,10 +3,11 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var core = require('@gem-sdk/core');
6
+ var thirdParty = require('../helpers/thirdParty.js');
6
7
 
7
8
  const ShopifySubscriptions = ({ setting, advanced })=>{
8
- const { align } = setting ?? {};
9
- return core.template`
9
+ const { align, widgetType, appBlockId } = setting ?? {};
10
+ return widgetType === 'app-block' ? thirdParty.getLiquidForAppBlock(appBlockId, align, `${advanced?.cssClass ?? ''} !gp-block`) : core.template`
10
11
  <div
11
12
  class="${advanced?.cssClass}"
12
13
  style="${{
package/dist/cjs/third-party/setting/NotifyBackInStockPreOrder.js CHANGED
@@ -7,7 +7,7 @@ var NotifyBackInStockPreOrder = require('../components/NotifyBackInStockPreOrder
7
7
  const config = {
8
8
  tag: NotifyBackInStockPreOrder.AppConfig.tag,
9
9
  label: NotifyBackInStockPreOrder.AppConfig.label,
10
- icon: '<img class="gp-w-[24px] gp-border gp-border-[#494949] gp-rounded-[3px]" src="https://cdn.shopify.com/app-store/listing_images/9216cd5dd17ab1a38de2641bae109159/icon/CNWHjbfSt4MDEAE=.png">',
10
+ icon: `<img class="gp-w-[24px] gp-border gp-border-[#494949] gp-rounded-[3px]" src="${NotifyBackInStockPreOrder.AppConfig.logoUrl}">`,
11
11
  editorConfigs: {
12
12
  placeholder: {
13
13
  flowTag: [
@@ -27,7 +27,7 @@ const config = {
27
27
  hideTextContent: true,
28
28
  icon: {
29
29
  desktop: `<div class="w-full flex flex-col items-center">
30
- <img class="w-24 border border-dark-200 rounded-medium" src="https://cdn.shopify.com/app-store/listing_images/9216cd5dd17ab1a38de2641bae109159/icon/CNWHjbfSt4MDEAE=.png">
30
+ <img class="w-24 border border-dark-200 rounded-medium" src="${NotifyBackInStockPreOrder.AppConfig.logoUrl}">
31
31
  <span class="preset-item-title">Notify! Back in Stock|PreOrder</span>
32
32
  </div>`
33
33
  },
package/dist/cjs/third-party/setting/ShopifySubscriptions.js CHANGED
@@ -42,6 +42,11 @@ const config = {
42
42
  {
43
43
  id: 'setting',
44
44
  controls: [
45
+ {
46
+ id: 'appBlockId',
47
+ type: 'input',
48
+ default: ''
49
+ },
45
50
  {
46
51
  id: 'install',
47
52
  type: 'open-link',
@@ -58,6 +63,23 @@ const config = {
58
63
  href: 'https://admin.shopify.com/?redirect=/apps/subscriptions-remix',
59
64
  appName: ShopifySubscriptions.AppConfig.label
60
65
  },
66
+ {
67
+ id: 'widgetType',
68
+ label: 'Choose widget',
69
+ type: 'select',
70
+ default: 'app-block',
71
+ options: [
72
+ {
73
+ label: 'app block',
74
+ value: 'app-block'
75
+ }
76
+ ]
77
+ },
78
+ {
79
+ id: 'productHandle',
80
+ type: 'product-handle',
81
+ hide: true
82
+ },
61
83
  {
62
84
  id: 'align',
63
85
  label: 'Alignment',
package/dist/esm/carousel/components/Carousel.liquid.js CHANGED
@@ -9,7 +9,7 @@ const DEVICES = [
9
9
  'tablet',
10
10
  'desktop'
11
11
  ];
12
- const Carousel = ({ builderAttrs, builderProps, style, styles, moveToIdx, rootId, rootAttr, rootClass, wrapperClass, rootStyles, children, rawChildren, isHiddenArrowWhenDisabled = true, advanced, disableMarginAuto, conditionAppendJs, ...props })=>{
12
+ const Carousel = ({ builderAttrs, builderProps, style, styles, moveToIdx, rootId, rootAttr, rootClass, wrapperClass, rootStyles, children, rawChildren, isHiddenArrowWhenDisabled = true, advanced, disableMarginAuto, conditionAppendJs, ftShapeProductImage, ...props })=>{
13
13
  const setting = mappingNavigationCarousel(props.setting);
14
14
  const styleHeight = makeStyleResponsive('h', getHeightByShapeGlobalSize(styles?.sizeSetting));
15
15
  const styleWidth = makeStyleWithDefault('w', getWidthByShapeGlobalSize(styles?.sizeSetting, true), {
@@ -108,7 +108,8 @@ const Carousel = ({ builderAttrs, builderProps, style, styles, moveToIdx, rootId
108
108
  setting,
109
109
  styles,
110
110
  moveToIdx,
111
- isHiddenArrowWhenDisabled
111
+ isHiddenArrowWhenDisabled,
112
+ ftShapeProductImage
112
113
  }).replaceAll("'", '&#039;')}' style="${{
113
114
  ...makeStyleResponsive('jc', styles?.align),
114
115
  ...rootStyles
package/dist/esm/product/components/ProductImagesV2/liquid/ProductFeaturedImageCarousel.liquid.js CHANGED
@@ -397,7 +397,8 @@ const ProductFeaturedImageCarousel = ({ builderPropUID, children, enableLazyLoad
397
397
  enableLazyLoadImage
398
398
  })}
399
399
  {%- endif -%}
400
- `
400
+ `,
401
+ ftShapeProductImage: setting?.ftShape
401
402
  })}
402
403
  `;
403
404
  };
package/dist/esm/third-party/components/NotifyBackInStockPreOrder.js CHANGED
@@ -5,7 +5,7 @@ import ThirdPartyPreview from './ThirdPartyPreview.js';
5
5
  const AppConfig = {
6
6
  id: 'notify-back-in-stockpreorder',
7
7
  label: 'Notify! Back in Stock|PreOrder',
8
- logoUrl: 'https://cdn.shopify.com/app-store/listing_images/9216cd5dd17ab1a38de2641bae109159/icon/CNWHjbfSt4MDEAE=.png',
8
+ logoUrl: 'https://cdn.shopify.com/s/files/1/0643/0497/1949/files/Notify_Me_Logo.png?v=1736234550',
9
9
  tag: 'NotifyBackInStockPreOrder'
10
10
  };
11
11
  const NotifyBackInStockPreOrderContent = ()=>{
package/dist/esm/third-party/components/ShopifySubscriptions.liquid.js CHANGED
@@ -1,8 +1,9 @@
1
1
  import { template, makeStyleResponsive } from '@gem-sdk/core';
2
+ import { getLiquidForAppBlock } from '../helpers/thirdParty.js';
2
3
 
3
4
  const ShopifySubscriptions = ({ setting, advanced })=>{
4
- const { align } = setting ?? {};
5
- return template`
5
+ const { align, widgetType, appBlockId } = setting ?? {};
6
+ return widgetType === 'app-block' ? getLiquidForAppBlock(appBlockId, align, `${advanced?.cssClass ?? ''} !gp-block`) : template`
6
7
  <div
7
8
  class="${advanced?.cssClass}"
8
9
  style="${{
package/dist/esm/third-party/setting/NotifyBackInStockPreOrder.js CHANGED
@@ -3,7 +3,7 @@ import { AppConfig } from '../components/NotifyBackInStockPreOrder.js';
3
3
  const config = {
4
4
  tag: AppConfig.tag,
5
5
  label: AppConfig.label,
6
- icon: '<img class="gp-w-[24px] gp-border gp-border-[#494949] gp-rounded-[3px]" src="https://cdn.shopify.com/app-store/listing_images/9216cd5dd17ab1a38de2641bae109159/icon/CNWHjbfSt4MDEAE=.png">',
6
+ icon: `<img class="gp-w-[24px] gp-border gp-border-[#494949] gp-rounded-[3px]" src="${AppConfig.logoUrl}">`,
7
7
  editorConfigs: {
8
8
  placeholder: {
9
9
  flowTag: [
@@ -23,7 +23,7 @@ const config = {
23
23
  hideTextContent: true,
24
24
  icon: {
25
25
  desktop: `<div class="w-full flex flex-col items-center">
26
- <img class="w-24 border border-dark-200 rounded-medium" src="https://cdn.shopify.com/app-store/listing_images/9216cd5dd17ab1a38de2641bae109159/icon/CNWHjbfSt4MDEAE=.png">
26
+ <img class="w-24 border border-dark-200 rounded-medium" src="${AppConfig.logoUrl}">
27
27
  <span class="preset-item-title">Notify! Back in Stock|PreOrder</span>
28
28
  </div>`
29
29
  },
package/dist/esm/third-party/setting/ShopifySubscriptions.js CHANGED
@@ -38,6 +38,11 @@ const config = {
38
38
  {
39
39
  id: 'setting',
40
40
  controls: [
41
+ {
42
+ id: 'appBlockId',
43
+ type: 'input',
44
+ default: ''
45
+ },
41
46
  {
42
47
  id: 'install',
43
48
  type: 'open-link',
@@ -54,6 +59,23 @@ const config = {
54
59
  href: 'https://admin.shopify.com/?redirect=/apps/subscriptions-remix',
55
60
  appName: AppConfig.label
56
61
  },
62
+ {
63
+ id: 'widgetType',
64
+ label: 'Choose widget',
65
+ type: 'select',
66
+ default: 'app-block',
67
+ options: [
68
+ {
69
+ label: 'app block',
70
+ value: 'app-block'
71
+ }
72
+ ]
73
+ },
74
+ {
75
+ id: 'productHandle',
76
+ type: 'product-handle',
77
+ hide: true
78
+ },
57
79
  {
58
80
  id: 'align',
59
81
  label: 'Alignment',
package/dist/types/index.d.ts CHANGED
@@ -2933,6 +2933,9 @@ type ShopifySubscriptionsProps = BaseProps<{
2933
2933
  align?: ObjectDevices<AlignProp>;
2934
2934
  openApp?: any;
2935
2935
  install?: any;
2936
+ appBlockId?: string;
2937
+ widgetType?: string;
2938
+ productHandle?: string;
2936
2939
  }>;
2937
2940
  declare const ShopifySubscriptions$1: React.FC<ShopifySubscriptionsProps>;
2938
2941
 
@@ -6043,7 +6046,7 @@ declare const CarouselItem: ({ children, builderAttrs, styles, advanced, setting
6043
6046
  background?: Partial<Record<NameDevices, Background>> | undefined;
6044
6047
  }) => string;
6045
6048
 
6046
- declare const Carousel: ({ builderAttrs, builderProps, style, styles, moveToIdx, rootId, rootAttr, rootClass, wrapperClass, rootStyles, children, rawChildren, isHiddenArrowWhenDisabled, advanced, disableMarginAuto, conditionAppendJs, ...props }: _gem_sdk_core.BaseProps<CarouselSettings, CarouselStyles, Record<string, any>> & {
6049
+ declare const Carousel: ({ builderAttrs, builderProps, style, styles, moveToIdx, rootId, rootAttr, rootClass, wrapperClass, rootStyles, children, rawChildren, isHiddenArrowWhenDisabled, advanced, disableMarginAuto, conditionAppendJs, ftShapeProductImage, ...props }: _gem_sdk_core.BaseProps<CarouselSettings, CarouselStyles, Record<string, any>> & {
6047
6050
  builderAttrs?: Record<string, any> | undefined;
6048
6051
  style?: React.CSSProperties | undefined;
6049
6052
  } & {
@@ -6075,6 +6078,7 @@ declare const Carousel: ({ builderAttrs, builderProps, style, styles, moveToIdx,
6075
6078
  disableMarginAuto?: boolean | undefined;
6076
6079
  slidesClass?: string | undefined;
6077
6080
  conditionAppendJs?: string | undefined;
6081
+ ftShapeProductImage?: Partial<Record<NameDevices, SizeSettingGlobal>> | undefined;
6078
6082
  }) => string;
6079
6083
 
6080
6084
  type LineProps = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/components",
3
- "version": "2.1.13-staging.26",
3
+ "version": "2.1.13-staging.28",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",
@@ -21,7 +21,7 @@
21
21
  "format": "prettier --write \"./src/**/*.{ts,tsx}\""
22
22
  },
23
23
  "devDependencies": {
24
- "@gem-sdk/core": "2.1.13-staging.25",
24
+ "@gem-sdk/core": "2.1.13-staging.28",
25
25
  "@gem-sdk/styles": "2.1.0",
26
26
  "@types/react-transition-group": "^4.4.5"
27
27
  },