@gem-sdk/components 2.1.11 → 2.1.12

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 (5) hide show
  1. package/dist/cjs/grid/components/Row.js +7 -8
  2. package/dist/cjs/grid/components/Row.liquid.js +11 -13
  3. package/dist/esm/grid/components/Row.js +7 -8
  4. package/dist/esm/grid/components/Row.liquid.js +11 -13
  5. package/package.json +1 -1
package/dist/cjs/grid/components/Row.js CHANGED
@@ -55,13 +55,11 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
55
55
  'left',
56
56
  'bottom',
57
57
  'right',
58
- 'z',
59
- 'ml',
60
- 'mr'
58
+ 'z'
61
59
  ], style);
62
60
  const getStyles = ()=>{
63
61
  let result = {
64
- ...restStyle,
62
+ ...isSection ? restStyle : style,
65
63
  ...core.makeStyleResponsive('cg', verticalGutter),
66
64
  ...layout ? core.composeGridLayout(layout) : core.makeStyleResponsive('gtc', responsive),
67
65
  ...core.makeStyleResponsive('w', styleObject.content)
@@ -119,7 +117,7 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
119
117
  ref: ref,
120
118
  style: getStyles(),
121
119
  className: core.cls(className, builderProps?.uid, 'gp-mb-0 gp-grid gp-mx-auto gp-max-w-full gp-gap-y-0 gp-transition-colors gp-duration-200 gp-ease-in-out ', {
122
- 'gp-content-visibility-hidden': mode !== 'edit' && lazy && !inView
120
+ 'gp-content-visibility-hidden': mode !== 'edit' && isSection && lazy && !inView
123
121
  }),
124
122
  children: inView || mode !== 'edit' ? /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
125
123
  children: core.isEmptyChildren(children) ? /*#__PURE__*/ jsxRuntime.jsx(ChildrenDroppable.default, {}) : React.Children.map(children, (el)=>{
@@ -158,15 +156,16 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
158
156
  })
159
157
  ]
160
158
  }),
161
- /*#__PURE__*/ jsxRuntime.jsx(Element, {
162
- className: "gp-max-w-full [&_*]:gp-max-w-full",
159
+ isSection ? /*#__PURE__*/ jsxRuntime.jsx(Element, {
160
+ className: "gp-mx-auto gp-max-w-full [&_*]:gp-max-w-full",
163
161
  style: {
164
162
  ...wrapStyle,
163
+ ...core.makeStyleResponsive('w', styleObject.wrapper),
165
164
  ...core.makeStyleResponsive('pl', styleObject.padding),
166
165
  ...core.makeStyleResponsive('pr', styleObject.padding)
167
166
  },
168
167
  children: element
169
- })
168
+ }) : element
170
169
  ]
171
170
  });
172
171
  };
package/dist/cjs/grid/components/Row.liquid.js CHANGED
@@ -16,9 +16,7 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
16
16
  'left',
17
17
  'bottom',
18
18
  'right',
19
- 'z',
20
- 'ml',
21
- 'mr'
19
+ 'z'
22
20
  ], style);
23
21
  const element = core.template`
24
22
  <div
@@ -28,7 +26,7 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
28
26
  'data-id': builderProps?.uidInteraction ?? builderProps?.uid
29
27
  }}
30
28
  style="${{
31
- ...restStyle,
29
+ ...isSection ? restStyle : style,
32
30
  ...core.makeStyleResponsive('cg', verticalGutter),
33
31
  ...core.makeStyleResponsive('pc', horizontalAlign),
34
32
  ...layout ? core.composeGridLayout(layout) : core.makeStyleResponsive('gtc', responsive),
@@ -55,21 +53,21 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
55
53
  }))}
56
54
  </div>
57
55
  `;
58
- const elementTag = isSection ? 'section' : 'div';
59
56
  return core.template`
60
57
  ${core.RenderIf(!!styles?.preloadBgImage, `${core.RenderIf(!!background?.desktop?.image?.src, `<link rel="preload" href="${background?.desktop?.image?.src}" as="image" />`)}${core.RenderIf(!!background?.tablet?.image?.src, `<link rel="preload" href="${background?.tablet?.image?.src}" as="image" />`)}${core.RenderIf(!!background?.mobile?.image?.src, `<link rel="preload" href="${background?.mobile?.image?.src}" as="image" />`)}`)}
61
- ${core.template`
62
- <${elementTag}
63
- class="gp-max-w-full ${isSection ? helpers.getSettingPreloadData('gps-lazy') : ''}"
64
- style="${{
58
+ ${isSection ? core.template`
59
+ <section
60
+ class="gp-mx-auto gp-max-w-full ${helpers.getSettingPreloadData('gps-lazy')}"
61
+ style="${{
65
62
  ...wrapStyle,
63
+ ...core.makeStyleResponsive('w', styleObject.wrapper),
66
64
  ...core.makeStyleResponsive('pl', styleObject.padding),
67
65
  ...core.makeStyleResponsive('pr', styleObject.padding)
68
66
  }}"
69
- >
70
- ${element}
71
- </${elementTag}>
72
- `}
67
+ >
68
+ ${element}
69
+ </section>
70
+ ` : element}
73
71
  `;
74
72
  };
75
73
 
package/dist/esm/grid/components/Row.js CHANGED
@@ -51,13 +51,11 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
51
51
  'left',
52
52
  'bottom',
53
53
  'right',
54
- 'z',
55
- 'ml',
56
- 'mr'
54
+ 'z'
57
55
  ], style);
58
56
  const getStyles = ()=>{
59
57
  let result = {
60
- ...restStyle,
58
+ ...isSection ? restStyle : style,
61
59
  ...makeStyleResponsive('cg', verticalGutter),
62
60
  ...layout ? composeGridLayout(layout) : makeStyleResponsive('gtc', responsive),
63
61
  ...makeStyleResponsive('w', styleObject.content)
@@ -115,7 +113,7 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
115
113
  ref: ref,
116
114
  style: getStyles(),
117
115
  className: cls(className, builderProps?.uid, 'gp-mb-0 gp-grid gp-mx-auto gp-max-w-full gp-gap-y-0 gp-transition-colors gp-duration-200 gp-ease-in-out ', {
118
- 'gp-content-visibility-hidden': mode !== 'edit' && lazy && !inView
116
+ 'gp-content-visibility-hidden': mode !== 'edit' && isSection && lazy && !inView
119
117
  }),
120
118
  children: inView || mode !== 'edit' ? /*#__PURE__*/ jsx(Fragment, {
121
119
  children: isEmptyChildren(children) ? /*#__PURE__*/ jsx(ChildrenDroppable, {}) : Children.map(children, (el)=>{
@@ -154,15 +152,16 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
154
152
  })
155
153
  ]
156
154
  }),
157
- /*#__PURE__*/ jsx(Element, {
158
- className: "gp-max-w-full [&_*]:gp-max-w-full",
155
+ isSection ? /*#__PURE__*/ jsx(Element, {
156
+ className: "gp-mx-auto gp-max-w-full [&_*]:gp-max-w-full",
159
157
  style: {
160
158
  ...wrapStyle,
159
+ ...makeStyleResponsive('w', styleObject.wrapper),
161
160
  ...makeStyleResponsive('pl', styleObject.padding),
162
161
  ...makeStyleResponsive('pr', styleObject.padding)
163
162
  },
164
163
  children: element
165
- })
164
+ }) : element
166
165
  ]
167
166
  });
168
167
  };
package/dist/esm/grid/components/Row.liquid.js CHANGED
@@ -12,9 +12,7 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
12
12
  'left',
13
13
  'bottom',
14
14
  'right',
15
- 'z',
16
- 'ml',
17
- 'mr'
15
+ 'z'
18
16
  ], style);
19
17
  const element = template`
20
18
  <div
@@ -24,7 +22,7 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
24
22
  'data-id': builderProps?.uidInteraction ?? builderProps?.uid
25
23
  }}
26
24
  style="${{
27
- ...restStyle,
25
+ ...isSection ? restStyle : style,
28
26
  ...makeStyleResponsive('cg', verticalGutter),
29
27
  ...makeStyleResponsive('pc', horizontalAlign),
30
28
  ...layout ? composeGridLayout(layout) : makeStyleResponsive('gtc', responsive),
@@ -51,21 +49,21 @@ const Row = ({ className, children, setting, builderAttrs, builderProps, styles,
51
49
  }))}
52
50
  </div>
53
51
  `;
54
- const elementTag = isSection ? 'section' : 'div';
55
52
  return template`
56
53
  ${RenderIf(!!styles?.preloadBgImage, `${RenderIf(!!background?.desktop?.image?.src, `<link rel="preload" href="${background?.desktop?.image?.src}" as="image" />`)}${RenderIf(!!background?.tablet?.image?.src, `<link rel="preload" href="${background?.tablet?.image?.src}" as="image" />`)}${RenderIf(!!background?.mobile?.image?.src, `<link rel="preload" href="${background?.mobile?.image?.src}" as="image" />`)}`)}
57
- ${template`
58
- <${elementTag}
59
- class="gp-max-w-full ${isSection ? getSettingPreloadData('gps-lazy') : ''}"
60
- style="${{
54
+ ${isSection ? template`
55
+ <section
56
+ class="gp-mx-auto gp-max-w-full ${getSettingPreloadData('gps-lazy')}"
57
+ style="${{
61
58
  ...wrapStyle,
59
+ ...makeStyleResponsive('w', styleObject.wrapper),
62
60
  ...makeStyleResponsive('pl', styleObject.padding),
63
61
  ...makeStyleResponsive('pr', styleObject.padding)
64
62
  }}"
65
- >
66
- ${element}
67
- </${elementTag}>
68
- `}
63
+ >
64
+ ${element}
65
+ </section>
66
+ ` : element}
69
67
  `;
70
68
  };
71
69
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/components",
3
- "version": "2.1.11",
3
+ "version": "2.1.12",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",