@gem-sdk/components 2.4.12 → 2.4.13

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.
@@ -71,10 +71,17 @@ const AccordionItem = ({ accordions, index, rawChildren, builderProps, title, pa
71
71
  return '';
72
72
  };
73
73
  const composeColorIconStyle = ()=>{
74
- return `.${parentUid}.gp-accordion-item-${parentUid}-${index}:hover .gp-collapsible-icon, .${parentUid}.gp-accordion-item-${parentUid}-${index}:hover .gp-icon {
75
- color: ${isShow ? color?.active : color?.hover}
76
- } {
77
- }`;
74
+ return `.gp-accordion-item-${parentUid}-${index}:hover
75
+ {
76
+ .gp-collapsible-icon {
77
+ color: ${isShow ? color?.active : color?.hover}
78
+ }
79
+
80
+ .gp-icon {
81
+ color: ${isShow ? iconColor?.active : iconColor?.hover}
82
+ }
83
+ }
84
+ `;
78
85
  };
79
86
  const getTemplateRow = ()=>{
80
87
  return {
@@ -82,16 +89,6 @@ const AccordionItem = ({ accordions, index, rawChildren, builderProps, title, pa
82
89
  };
83
90
  };
84
91
  return core.template`
85
- <style title="gp-accordion-item-style">
86
- .gp-accordion-item .gp-accordion-item-${parentUid}-${index}:hover .gp-collapsible-icon.gp-accordion-item-hover, .gp-accordion-item .gp-accordion-item-${parentUid}-${index}:hover .gp-icon.gp-accordion-item-hover
87
- {
88
- color: ${color?.hover} !important
89
- }
90
- .gp-accordion-item .gp-accordion-item-${parentUid}-${index}:hover .gp-collapsible-icon.gp-accordion-item-active, .gp-accordion-item .gp-accordion-item-${parentUid}-${index}:hover .gp-icon.gp-accordion-item-active
91
- {
92
- color: ${color?.active} !important
93
- }
94
- </style>
95
92
  <div class="gp-overflow-clip" style="${{
96
93
  ...widthStyle,
97
94
  '--height-iconCollapseSize': `${iconCollapseSize || 16}px`,
@@ -260,6 +260,21 @@ const config = {
260
260
  }
261
261
  }
262
262
  },
263
+ {
264
+ id: 'columnGap',
265
+ type: 'range',
266
+ min: 0,
267
+ max: 100,
268
+ step: 1,
269
+ units: [
270
+ '%'
271
+ ],
272
+ devices: {
273
+ desktop: {
274
+ default: '0%'
275
+ }
276
+ }
277
+ },
263
278
  {
264
279
  id: 'background',
265
280
  type: 'background',
@@ -296,14 +311,29 @@ const config = {
296
311
  ],
297
312
  ui: [
298
313
  {
299
- type: 'control',
314
+ type: 'group',
300
315
  label: {
301
316
  en: 'Layout'
302
317
  },
303
- setting: {
304
- id: 'layout'
305
- },
306
- layout: 'vertical'
318
+ controls: [
319
+ {
320
+ type: 'control',
321
+ setting: {
322
+ id: 'layout'
323
+ },
324
+ layout: 'vertical'
325
+ },
326
+ {
327
+ type: 'control',
328
+ label: {
329
+ en: 'Column gap'
330
+ },
331
+ setting: {
332
+ id: 'columnGap'
333
+ },
334
+ condition: `!!layout.cols && layout.cols.length > 1 && pageType == "POST_PURCHASE"`
335
+ }
336
+ ]
307
337
  },
308
338
  {
309
339
  type: 'group',
@@ -340,7 +370,7 @@ const config = {
340
370
  setting: {
341
371
  id: 'verticalGutter'
342
372
  },
343
- condition: `!!layout.cols && layout.cols.length > 1`
373
+ condition: `!!layout.cols && layout.cols.length > 1 && pageType != "POST_PURCHASE"`
344
374
  }
345
375
  ]
346
376
  },
@@ -349,7 +379,7 @@ const config = {
349
379
  label: {
350
380
  en: 'Align'
351
381
  },
352
- condition: `layout.display !== 'fill' || (layout.display === 'fill' && !!layout.cols && layout.cols.length > 1)`,
382
+ condition: `(layout.display !== 'fill' || (layout.display === 'fill' && !!layout.cols && layout.cols.length > 1)) && pageType != "POST_PURCHASE"`,
353
383
  controls: [
354
384
  {
355
385
  type: 'control',
@@ -67,10 +67,17 @@ const AccordionItem = ({ accordions, index, rawChildren, builderProps, title, pa
67
67
  return '';
68
68
  };
69
69
  const composeColorIconStyle = ()=>{
70
- return `.${parentUid}.gp-accordion-item-${parentUid}-${index}:hover .gp-collapsible-icon, .${parentUid}.gp-accordion-item-${parentUid}-${index}:hover .gp-icon {
71
- color: ${isShow ? color?.active : color?.hover}
72
- } {
73
- }`;
70
+ return `.gp-accordion-item-${parentUid}-${index}:hover
71
+ {
72
+ .gp-collapsible-icon {
73
+ color: ${isShow ? color?.active : color?.hover}
74
+ }
75
+
76
+ .gp-icon {
77
+ color: ${isShow ? iconColor?.active : iconColor?.hover}
78
+ }
79
+ }
80
+ `;
74
81
  };
75
82
  const getTemplateRow = ()=>{
76
83
  return {
@@ -78,16 +85,6 @@ const AccordionItem = ({ accordions, index, rawChildren, builderProps, title, pa
78
85
  };
79
86
  };
80
87
  return template`
81
- <style title="gp-accordion-item-style">
82
- .gp-accordion-item .gp-accordion-item-${parentUid}-${index}:hover .gp-collapsible-icon.gp-accordion-item-hover, .gp-accordion-item .gp-accordion-item-${parentUid}-${index}:hover .gp-icon.gp-accordion-item-hover
83
- {
84
- color: ${color?.hover} !important
85
- }
86
- .gp-accordion-item .gp-accordion-item-${parentUid}-${index}:hover .gp-collapsible-icon.gp-accordion-item-active, .gp-accordion-item .gp-accordion-item-${parentUid}-${index}:hover .gp-icon.gp-accordion-item-active
87
- {
88
- color: ${color?.active} !important
89
- }
90
- </style>
91
88
  <div class="gp-overflow-clip" style="${{
92
89
  ...widthStyle,
93
90
  '--height-iconCollapseSize': `${iconCollapseSize || 16}px`,
@@ -256,6 +256,21 @@ const config = {
256
256
  }
257
257
  }
258
258
  },
259
+ {
260
+ id: 'columnGap',
261
+ type: 'range',
262
+ min: 0,
263
+ max: 100,
264
+ step: 1,
265
+ units: [
266
+ '%'
267
+ ],
268
+ devices: {
269
+ desktop: {
270
+ default: '0%'
271
+ }
272
+ }
273
+ },
259
274
  {
260
275
  id: 'background',
261
276
  type: 'background',
@@ -292,14 +307,29 @@ const config = {
292
307
  ],
293
308
  ui: [
294
309
  {
295
- type: 'control',
310
+ type: 'group',
296
311
  label: {
297
312
  en: 'Layout'
298
313
  },
299
- setting: {
300
- id: 'layout'
301
- },
302
- layout: 'vertical'
314
+ controls: [
315
+ {
316
+ type: 'control',
317
+ setting: {
318
+ id: 'layout'
319
+ },
320
+ layout: 'vertical'
321
+ },
322
+ {
323
+ type: 'control',
324
+ label: {
325
+ en: 'Column gap'
326
+ },
327
+ setting: {
328
+ id: 'columnGap'
329
+ },
330
+ condition: `!!layout.cols && layout.cols.length > 1 && pageType == "POST_PURCHASE"`
331
+ }
332
+ ]
303
333
  },
304
334
  {
305
335
  type: 'group',
@@ -336,7 +366,7 @@ const config = {
336
366
  setting: {
337
367
  id: 'verticalGutter'
338
368
  },
339
- condition: `!!layout.cols && layout.cols.length > 1`
369
+ condition: `!!layout.cols && layout.cols.length > 1 && pageType != "POST_PURCHASE"`
340
370
  }
341
371
  ]
342
372
  },
@@ -345,7 +375,7 @@ const config = {
345
375
  label: {
346
376
  en: 'Align'
347
377
  },
348
- condition: `layout.display !== 'fill' || (layout.display === 'fill' && !!layout.cols && layout.cols.length > 1)`,
378
+ condition: `(layout.display !== 'fill' || (layout.display === 'fill' && !!layout.cols && layout.cols.length > 1)) && pageType != "POST_PURCHASE"`,
349
379
  controls: [
350
380
  {
351
381
  type: 'control',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/components",
3
- "version": "2.4.12",
3
+ "version": "2.4.13",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",