@gem-sdk/components 2.2.0-staging.31 → 2.2.0-staging.34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/cjs/button/components/Button.js +3 -3
  2. package/dist/cjs/button/components/Button.liquid.js +2 -2
  3. package/dist/cjs/third-party/components/EcomsendBackInStockAlert.liquid.js +8 -8
  4. package/dist/cjs/third-party/setting/EcomsendBackInStockAlert.js +16 -0
  5. package/dist/esm/button/components/Button.js +3 -3
  6. package/dist/esm/button/components/Button.liquid.js +2 -2
  7. package/dist/esm/third-party/components/EcomsendBackInStockAlert.liquid.js +8 -8
  8. package/dist/esm/third-party/setting/EcomsendBackInStockAlert.js +16 -0
  9. package/dist/types/index.d.ts +1 -0
  10. package/package.json +2 -2
package/dist/cjs/button/components/Button.js CHANGED
@@ -104,7 +104,7 @@ const Button = ({ className, onClick, builderProps, builderAttrs, setting = {},
104
104
  }
105
105
  },
106
106
  "data-state": loading ? 'loading' : 'idle',
107
- className: core.cls(builderProps?.uid, 'gp-button-base gp-group gp-relative gp-inline-flex gp-max-w-full gp-items-center gp-justify-center gp-no-underline gp-transition-colors gp-duration-300 disabled:gp-btn-disabled disabled:gp-opacity-30', core.getGlobalColorStateClass('bg', backgroundColor), {
107
+ className: core.cls(builderProps?.uid, 'gp-button-base gp-group/button gp-relative gp-inline-flex gp-max-w-full gp-items-center gp-justify-center gp-no-underline gp-transition-colors gp-duration-300 disabled:gp-btn-disabled disabled:gp-opacity-30', core.getGlobalColorStateClass('bg', backgroundColor), {
108
108
  'gp-animate-bounce': styles?.animation?.normal === 'bounce',
109
109
  'hover:gp-animate-bounce': styles?.animation?.hover === 'bounce',
110
110
  'gp-scale-[1.1]': styles?.animation?.normal === 'grow',
@@ -156,7 +156,7 @@ const Button = ({ className, onClick, builderProps, builderAttrs, setting = {},
156
156
  children: [
157
157
  !!iconSvg && iconVisible && /*#__PURE__*/ jsxRuntime.jsx("span", {
158
158
  className: `
159
- gp-button-icon gp-transition-colors gp-duration-300 gp-z-1 gp-inline-flex gp-shrink-0 gp-items-center gp-justify-center group-data-[state=loading]:gp-invisible [&>svg]:!gp-h-[var(--height-desktop)] [&>svg]:!gp-w-auto tablet:[&>svg]:!gp-h-[var(--height-tablet)] mobile:[&>svg]:!gp-h-[var(--height-mobile)] ${shouldClearSpace && !label ? '!gp-m-0' : ''}`,
159
+ gp-button-icon gp-transition-colors gp-duration-300 gp-z-1 gp-inline-flex gp-shrink-0 gp-items-center gp-justify-center group-data-[state=loading]:gp-invisible [&>svg]:!gp-h-[var(--height-desktop)] [&>svg]:!gp-w-auto tablet:[&>svg]:!gp-h-[var(--height-tablet)] mobile:[&>svg]:!gp-h-[var(--height-mobile)] ${shouldClearSpace && !label ? '!gp-m-0' : ''}`,
160
160
  style: {
161
161
  ...iconSpacingStyle,
162
162
  '--height-desktop': `${size?.desktop}`,
@@ -169,7 +169,7 @@ const Button = ({ className, onClick, builderProps, builderAttrs, setting = {},
169
169
  }),
170
170
  (!!label || !shouldClearSpace) && /*#__PURE__*/ jsxRuntime.jsx("div", {
171
171
  "data-gp-text": true,
172
- className: core.cls(`gp-relative gp-flex gp-h-full gp-items-center gp-overflow-hidden gp-break-words group-data-[state=loading]:gp-invisible [&_p]:gp-whitespace-pre-line`, styles?.typo?.attrs?.italic ? '[&:not(:has(p))]:gp-pr-[0.2em] [&_p]:[&:has(p)]:gp-pr-[0.2em]' : '', mode === 'edit' && !options?.isCannotEditing ? 'gp-text button-text' : '', nodePrice ? appendTypoClass : {}),
172
+ className: core.cls(`gp-relative group-hover/button:!gp-text-inherit gp-flex gp-h-full gp-items-center gp-overflow-hidden gp-break-words group-data-[state=loading]:gp-invisible [&_p]:gp-whitespace-pre-line`, styles?.typo?.attrs?.italic ? '[&:not(:has(p))]:gp-pr-[0.2em] [&_p]:[&:has(p)]:gp-pr-[0.2em]' : '', mode === 'edit' && !options?.isCannotEditing ? 'gp-text button-text' : '', nodePrice ? appendTypoClass : {}),
173
173
  style: {
174
174
  ...core.makeStyle({
175
175
  tt: styles?.transform
package/dist/cjs/button/components/Button.liquid.js CHANGED
@@ -103,7 +103,7 @@ const Button = ({ className, builderProps, customAttrs, pageContext, setting = {
103
103
  ...customAttrs
104
104
  }}
105
105
  data-state="${loading ? 'loading' : 'idle'}"
106
- class="${core.cls(builderProps?.uid, 'gp-button-base gp-group/button gp-rounded-none gp-max-w-full gp-relative gp-group gp-inline-flex gp-items-center gp-justify-center gp-no-underline gp-transition-colors gp-duration-300 disabled:gp-btn-disabled disabled:gp-opacity-30 disabled:gp-pointer-events-none', core.getGlobalColorStateClass('bg', backgroundColor), core.getGlobalColorStateClass('text', textColor), {
106
+ class="${core.cls(builderProps?.uid, 'gp-button-base gp-group/button gp-rounded-none gp-max-w-full gp-relative gp-inline-flex gp-items-center gp-justify-center gp-no-underline gp-transition-colors gp-duration-300 disabled:gp-btn-disabled disabled:gp-opacity-30 disabled:gp-pointer-events-none', core.getGlobalColorStateClass('bg', backgroundColor), core.getGlobalColorStateClass('text', textColor), {
107
107
  'gp-animate-bounce': styles?.animation?.normal === 'bounce',
108
108
  'hover:gp-animate-bounce': styles?.animation?.hover === 'bounce',
109
109
  'gp-scale-[1.1]': styles?.animation?.normal === 'grow',
@@ -127,7 +127,7 @@ const Button = ({ className, builderProps, customAttrs, pageContext, setting = {
127
127
  }}"
128
128
  >
129
129
  ${!disabledLoading ? ` <svg
130
- class="gp-invisible gp-absolute gp-h-5 gp-w-5 group-data-[state=loading]:gp-animate-spin group-data-[state=loading]:gp-visible"
130
+ class="group-data-[state=idle]:gp-invisible gp-absolute gp-h-5 gp-w-5 group-data-[state=loading]:gp-animate-spin group-data-[state=loading]:gp-visible"
131
131
  xmlns="http://www.w3.org/2000/svg"
132
132
  fill="none"
133
133
  viewBox="0 0 24 24"
package/dist/cjs/third-party/components/EcomsendBackInStockAlert.liquid.js CHANGED
@@ -5,17 +5,17 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var core = require('@gem-sdk/core');
6
6
 
7
7
  const EcomsendBackInStockAlert = ({ setting, advanced })=>{
8
- const { align } = setting ?? {};
8
+ const { align, productId } = setting ?? {};
9
9
  return core.template`
10
- <div
11
- class="${advanced?.cssClass}"
12
- style="${{
10
+ <div
11
+ class="${advanced?.cssClass}"
12
+ style="${{
13
13
  ...core.makeStyleResponsive('ta', align)
14
14
  }}"
15
- >
16
- <div id="sealapps-bis-widget"></div>
17
- </div>
18
- `;
15
+ >
16
+ ${productId ? `<div style="display: block" class="ecomsend-bis-block" data-product-id="${productId}"></div>` : `<div id="sealapps-bis-widget"></div>`}
17
+ </div>
18
+ `;
19
19
  };
20
20
 
21
21
  exports.default = EcomsendBackInStockAlert;
package/dist/cjs/third-party/setting/EcomsendBackInStockAlert.js CHANGED
@@ -54,6 +54,11 @@ const config = {
54
54
  ],
55
55
  default: 'product-restore-email'
56
56
  },
57
+ {
58
+ id: 'productId',
59
+ label: 'Product ID',
60
+ type: 'input'
61
+ },
57
62
  {
58
63
  id: 'install',
59
64
  type: 'open-link',
@@ -121,6 +126,17 @@ const config = {
121
126
  setting: {
122
127
  id: 'align'
123
128
  }
129
+ },
130
+ {
131
+ type: 'control',
132
+ setting: {
133
+ id: 'productId'
134
+ },
135
+ options: {
136
+ hideOnPages: [
137
+ 'GP_PRODUCT'
138
+ ]
139
+ }
124
140
  }
125
141
  ]
126
142
  };
package/dist/esm/button/components/Button.js CHANGED
@@ -100,7 +100,7 @@ const Button = ({ className, onClick, builderProps, builderAttrs, setting = {},
100
100
  }
101
101
  },
102
102
  "data-state": loading ? 'loading' : 'idle',
103
- className: cls(builderProps?.uid, 'gp-button-base gp-group gp-relative gp-inline-flex gp-max-w-full gp-items-center gp-justify-center gp-no-underline gp-transition-colors gp-duration-300 disabled:gp-btn-disabled disabled:gp-opacity-30', getGlobalColorStateClass('bg', backgroundColor), {
103
+ className: cls(builderProps?.uid, 'gp-button-base gp-group/button gp-relative gp-inline-flex gp-max-w-full gp-items-center gp-justify-center gp-no-underline gp-transition-colors gp-duration-300 disabled:gp-btn-disabled disabled:gp-opacity-30', getGlobalColorStateClass('bg', backgroundColor), {
104
104
  'gp-animate-bounce': styles?.animation?.normal === 'bounce',
105
105
  'hover:gp-animate-bounce': styles?.animation?.hover === 'bounce',
106
106
  'gp-scale-[1.1]': styles?.animation?.normal === 'grow',
@@ -152,7 +152,7 @@ const Button = ({ className, onClick, builderProps, builderAttrs, setting = {},
152
152
  children: [
153
153
  !!iconSvg && iconVisible && /*#__PURE__*/ jsx("span", {
154
154
  className: `
155
- gp-button-icon gp-transition-colors gp-duration-300 gp-z-1 gp-inline-flex gp-shrink-0 gp-items-center gp-justify-center group-data-[state=loading]:gp-invisible [&>svg]:!gp-h-[var(--height-desktop)] [&>svg]:!gp-w-auto tablet:[&>svg]:!gp-h-[var(--height-tablet)] mobile:[&>svg]:!gp-h-[var(--height-mobile)] ${shouldClearSpace && !label ? '!gp-m-0' : ''}`,
155
+ gp-button-icon gp-transition-colors gp-duration-300 gp-z-1 gp-inline-flex gp-shrink-0 gp-items-center gp-justify-center group-data-[state=loading]:gp-invisible [&>svg]:!gp-h-[var(--height-desktop)] [&>svg]:!gp-w-auto tablet:[&>svg]:!gp-h-[var(--height-tablet)] mobile:[&>svg]:!gp-h-[var(--height-mobile)] ${shouldClearSpace && !label ? '!gp-m-0' : ''}`,
156
156
  style: {
157
157
  ...iconSpacingStyle,
158
158
  '--height-desktop': `${size?.desktop}`,
@@ -165,7 +165,7 @@ const Button = ({ className, onClick, builderProps, builderAttrs, setting = {},
165
165
  }),
166
166
  (!!label || !shouldClearSpace) && /*#__PURE__*/ jsx("div", {
167
167
  "data-gp-text": true,
168
- className: cls(`gp-relative gp-flex gp-h-full gp-items-center gp-overflow-hidden gp-break-words group-data-[state=loading]:gp-invisible [&_p]:gp-whitespace-pre-line`, styles?.typo?.attrs?.italic ? '[&:not(:has(p))]:gp-pr-[0.2em] [&_p]:[&:has(p)]:gp-pr-[0.2em]' : '', mode === 'edit' && !options?.isCannotEditing ? 'gp-text button-text' : '', nodePrice ? appendTypoClass : {}),
168
+ className: cls(`gp-relative group-hover/button:!gp-text-inherit gp-flex gp-h-full gp-items-center gp-overflow-hidden gp-break-words group-data-[state=loading]:gp-invisible [&_p]:gp-whitespace-pre-line`, styles?.typo?.attrs?.italic ? '[&:not(:has(p))]:gp-pr-[0.2em] [&_p]:[&:has(p)]:gp-pr-[0.2em]' : '', mode === 'edit' && !options?.isCannotEditing ? 'gp-text button-text' : '', nodePrice ? appendTypoClass : {}),
169
169
  style: {
170
170
  ...makeStyle({
171
171
  tt: styles?.transform
package/dist/esm/button/components/Button.liquid.js CHANGED
@@ -99,7 +99,7 @@ const Button = ({ className, builderProps, customAttrs, pageContext, setting = {
99
99
  ...customAttrs
100
100
  }}
101
101
  data-state="${loading ? 'loading' : 'idle'}"
102
- class="${cls(builderProps?.uid, 'gp-button-base gp-group/button gp-rounded-none gp-max-w-full gp-relative gp-group gp-inline-flex gp-items-center gp-justify-center gp-no-underline gp-transition-colors gp-duration-300 disabled:gp-btn-disabled disabled:gp-opacity-30 disabled:gp-pointer-events-none', getGlobalColorStateClass('bg', backgroundColor), getGlobalColorStateClass('text', textColor), {
102
+ class="${cls(builderProps?.uid, 'gp-button-base gp-group/button gp-rounded-none gp-max-w-full gp-relative gp-inline-flex gp-items-center gp-justify-center gp-no-underline gp-transition-colors gp-duration-300 disabled:gp-btn-disabled disabled:gp-opacity-30 disabled:gp-pointer-events-none', getGlobalColorStateClass('bg', backgroundColor), getGlobalColorStateClass('text', textColor), {
103
103
  'gp-animate-bounce': styles?.animation?.normal === 'bounce',
104
104
  'hover:gp-animate-bounce': styles?.animation?.hover === 'bounce',
105
105
  'gp-scale-[1.1]': styles?.animation?.normal === 'grow',
@@ -123,7 +123,7 @@ const Button = ({ className, builderProps, customAttrs, pageContext, setting = {
123
123
  }}"
124
124
  >
125
125
  ${!disabledLoading ? ` <svg
126
- class="gp-invisible gp-absolute gp-h-5 gp-w-5 group-data-[state=loading]:gp-animate-spin group-data-[state=loading]:gp-visible"
126
+ class="group-data-[state=idle]:gp-invisible gp-absolute gp-h-5 gp-w-5 group-data-[state=loading]:gp-animate-spin group-data-[state=loading]:gp-visible"
127
127
  xmlns="http://www.w3.org/2000/svg"
128
128
  fill="none"
129
129
  viewBox="0 0 24 24"
package/dist/esm/third-party/components/EcomsendBackInStockAlert.liquid.js CHANGED
@@ -1,17 +1,17 @@
1
1
  import { template, makeStyleResponsive } from '@gem-sdk/core';
2
2
 
3
3
  const EcomsendBackInStockAlert = ({ setting, advanced })=>{
4
- const { align } = setting ?? {};
4
+ const { align, productId } = setting ?? {};
5
5
  return template`
6
- <div
7
- class="${advanced?.cssClass}"
8
- style="${{
6
+ <div
7
+ class="${advanced?.cssClass}"
8
+ style="${{
9
9
  ...makeStyleResponsive('ta', align)
10
10
  }}"
11
- >
12
- <div id="sealapps-bis-widget"></div>
13
- </div>
14
- `;
11
+ >
12
+ ${productId ? `<div style="display: block" class="ecomsend-bis-block" data-product-id="${productId}"></div>` : `<div id="sealapps-bis-widget"></div>`}
13
+ </div>
14
+ `;
15
15
  };
16
16
 
17
17
  export { EcomsendBackInStockAlert as default };
package/dist/esm/third-party/setting/EcomsendBackInStockAlert.js CHANGED
@@ -50,6 +50,11 @@ const config = {
50
50
  ],
51
51
  default: 'product-restore-email'
52
52
  },
53
+ {
54
+ id: 'productId',
55
+ label: 'Product ID',
56
+ type: 'input'
57
+ },
53
58
  {
54
59
  id: 'install',
55
60
  type: 'open-link',
@@ -117,6 +122,17 @@ const config = {
117
122
  setting: {
118
123
  id: 'align'
119
124
  }
125
+ },
126
+ {
127
+ type: 'control',
128
+ setting: {
129
+ id: 'productId'
130
+ },
131
+ options: {
132
+ hideOnPages: [
133
+ 'GP_PRODUCT'
134
+ ]
135
+ }
120
136
  }
121
137
  ]
122
138
  };
package/dist/types/index.d.ts CHANGED
@@ -3530,6 +3530,7 @@ type EcomsendBackInStockAlertProps = BaseProps<{
3530
3530
  openApp?: any;
3531
3531
  install?: any;
3532
3532
  appBlockId?: string;
3533
+ productId?: string;
3533
3534
  widgetType?: string;
3534
3535
  }>;
3535
3536
  declare const EcomsendBackInStockAlert$1: React.FC<EcomsendBackInStockAlertProps>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/components",
3
- "version": "2.2.0-staging.31",
3
+ "version": "2.2.0-staging.34",
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.2.0-staging.30",
24
+ "@gem-sdk/core": "2.2.0-staging.33",
25
25
  "@gem-sdk/styles": "2.1.27-staging.13",
26
26
  "@types/react-transition-group": "^4.4.5"
27
27
  },