@gem-sdk/core 1.45.0-dev.102 → 1.45.0-dev.105
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.
|
@@ -20,6 +20,7 @@ require('dayjs');
|
|
|
20
20
|
var composeAdvanceStyle = require('../helpers/compose-advance-style.js');
|
|
21
21
|
var convert = require('../helpers/convert.js');
|
|
22
22
|
var render = require('../helpers/render.js');
|
|
23
|
+
var cssjson = require('cssjson');
|
|
23
24
|
|
|
24
25
|
const componentsRenderWithParentId = [
|
|
25
26
|
'CarouselItem'
|
|
@@ -74,6 +75,9 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
74
75
|
advanced: item.advanced,
|
|
75
76
|
parentId: componentsRenderWithParentId.includes(item.tag) ? parentId : null,
|
|
76
77
|
pageContext,
|
|
78
|
+
builderAttrs: {
|
|
79
|
+
'data-id': uid
|
|
80
|
+
},
|
|
77
81
|
...passProps,
|
|
78
82
|
rawChildren: item.childrens.map((id)=>{
|
|
79
83
|
return {
|
|
@@ -103,6 +107,9 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
103
107
|
uid,
|
|
104
108
|
builderData: item
|
|
105
109
|
},
|
|
110
|
+
builderAttrs: {
|
|
111
|
+
'data-id': uid
|
|
112
|
+
},
|
|
106
113
|
styles: item.styles,
|
|
107
114
|
setting: item.settings,
|
|
108
115
|
advanced: item.advanced,
|
|
@@ -123,6 +130,9 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
123
130
|
},
|
|
124
131
|
styles: item.styles,
|
|
125
132
|
setting: item.settings,
|
|
133
|
+
builderAttrs: {
|
|
134
|
+
'data-id': uid
|
|
135
|
+
},
|
|
126
136
|
advanced: {
|
|
127
137
|
...componentUsingAdvanced.includes(item.tag) ? item?.advanced : {},
|
|
128
138
|
cssClass: item?.advanced?.cssClass
|
|
@@ -157,6 +167,9 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
157
167
|
uid,
|
|
158
168
|
builderData: item
|
|
159
169
|
},
|
|
170
|
+
builderAttrs: {
|
|
171
|
+
'data-id': uid
|
|
172
|
+
},
|
|
160
173
|
styles: item.styles,
|
|
161
174
|
setting: item.settings,
|
|
162
175
|
advanced: {
|
|
@@ -180,19 +193,28 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
180
193
|
};
|
|
181
194
|
}
|
|
182
195
|
};
|
|
196
|
+
const isEmptyCSS = (cssString)=>{
|
|
197
|
+
if (!cssString) return true;
|
|
198
|
+
const cssJSON = cssjson.toJSON(cssString);
|
|
199
|
+
const isObjectEmpty = (obj)=>{
|
|
200
|
+
if (typeof obj !== 'object' || obj === null) return true;
|
|
201
|
+
return !Object.keys(obj).some((key)=>{
|
|
202
|
+
return key === 'attributes' && Object.keys(obj[key]).length > 0 || typeof obj[key] === 'object' && !isObjectEmpty(obj[key]);
|
|
203
|
+
});
|
|
204
|
+
};
|
|
205
|
+
return isObjectEmpty(cssJSON.children);
|
|
206
|
+
};
|
|
183
207
|
const RenderCustomCode = (item)=>{
|
|
184
208
|
const { css, javascript, rootClassName } = item.advanced?.editorData || {};
|
|
185
209
|
const replacedCSS = css?.replaceAll(rootClassName, item.uid);
|
|
186
210
|
const replacedJS = javascript?.replaceAll(rootClassName, item.uid);
|
|
187
|
-
const cssCode = render.RenderIf(!!css, render.template`
|
|
188
|
-
<style
|
|
189
|
-
|
|
190
|
-
|
|
211
|
+
const cssCode = render.RenderIf(!!css && !isEmptyCSS(replacedCSS), render.template`
|
|
212
|
+
<style id="${`custom-css-${item?.uid}`}">
|
|
213
|
+
${replacedCSS}
|
|
214
|
+
</style>
|
|
191
215
|
`);
|
|
192
216
|
const jsCode = render.RenderIf(!!javascript, render.template`
|
|
193
|
-
<script
|
|
194
|
-
id="${`custom-js-${item?.uid}`}"
|
|
195
|
-
>
|
|
217
|
+
<script id="${`custom-js-${item?.uid}`}">
|
|
196
218
|
try {
|
|
197
219
|
${replacedJS}
|
|
198
220
|
} catch(err){}
|
|
@@ -220,6 +242,7 @@ const appendAnimation = (props, liquid)=>{
|
|
|
220
242
|
const appearTablet = getAnimationType(getSettingsByDevice('tablet'), 'appear');
|
|
221
243
|
const appearMobile = getAnimationType(getSettingsByDevice('mobile'), 'appear');
|
|
222
244
|
const enableAnimation = animation?.desktop?.enabled && (appearDesktop !== 'none' || hoverDesktop !== 'none') || animation?.tablet?.enabled && appearTablet !== 'none' || animation?.mobile?.enabled && appearMobile !== 'none';
|
|
245
|
+
if (!enableAnimation) return liquid;
|
|
223
246
|
const getInitVisibility = (device)=>getSettingsByDevice(device)?.enabled && ![
|
|
224
247
|
'shake',
|
|
225
248
|
'none'
|
|
@@ -16,6 +16,7 @@ import 'dayjs';
|
|
|
16
16
|
import { composeAdvanceStyle } from '../helpers/compose-advance-style.js';
|
|
17
17
|
import { baseAssetURL, isLocalEnv } from '../helpers/convert.js';
|
|
18
18
|
import { RenderIf, template } from '../helpers/render.js';
|
|
19
|
+
import { toJSON } from 'cssjson';
|
|
19
20
|
|
|
20
21
|
const componentsRenderWithParentId = [
|
|
21
22
|
'CarouselItem'
|
|
@@ -70,6 +71,9 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
70
71
|
advanced: item.advanced,
|
|
71
72
|
parentId: componentsRenderWithParentId.includes(item.tag) ? parentId : null,
|
|
72
73
|
pageContext,
|
|
74
|
+
builderAttrs: {
|
|
75
|
+
'data-id': uid
|
|
76
|
+
},
|
|
73
77
|
...passProps,
|
|
74
78
|
rawChildren: item.childrens.map((id)=>{
|
|
75
79
|
return {
|
|
@@ -99,6 +103,9 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
99
103
|
uid,
|
|
100
104
|
builderData: item
|
|
101
105
|
},
|
|
106
|
+
builderAttrs: {
|
|
107
|
+
'data-id': uid
|
|
108
|
+
},
|
|
102
109
|
styles: item.styles,
|
|
103
110
|
setting: item.settings,
|
|
104
111
|
advanced: item.advanced,
|
|
@@ -119,6 +126,9 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
119
126
|
},
|
|
120
127
|
styles: item.styles,
|
|
121
128
|
setting: item.settings,
|
|
129
|
+
builderAttrs: {
|
|
130
|
+
'data-id': uid
|
|
131
|
+
},
|
|
122
132
|
advanced: {
|
|
123
133
|
...componentUsingAdvanced.includes(item.tag) ? item?.advanced : {},
|
|
124
134
|
cssClass: item?.advanced?.cssClass
|
|
@@ -153,6 +163,9 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
153
163
|
uid,
|
|
154
164
|
builderData: item
|
|
155
165
|
},
|
|
166
|
+
builderAttrs: {
|
|
167
|
+
'data-id': uid
|
|
168
|
+
},
|
|
156
169
|
styles: item.styles,
|
|
157
170
|
setting: item.settings,
|
|
158
171
|
advanced: {
|
|
@@ -176,19 +189,28 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
|
|
|
176
189
|
};
|
|
177
190
|
}
|
|
178
191
|
};
|
|
192
|
+
const isEmptyCSS = (cssString)=>{
|
|
193
|
+
if (!cssString) return true;
|
|
194
|
+
const cssJSON = toJSON(cssString);
|
|
195
|
+
const isObjectEmpty = (obj)=>{
|
|
196
|
+
if (typeof obj !== 'object' || obj === null) return true;
|
|
197
|
+
return !Object.keys(obj).some((key)=>{
|
|
198
|
+
return key === 'attributes' && Object.keys(obj[key]).length > 0 || typeof obj[key] === 'object' && !isObjectEmpty(obj[key]);
|
|
199
|
+
});
|
|
200
|
+
};
|
|
201
|
+
return isObjectEmpty(cssJSON.children);
|
|
202
|
+
};
|
|
179
203
|
const RenderCustomCode = (item)=>{
|
|
180
204
|
const { css, javascript, rootClassName } = item.advanced?.editorData || {};
|
|
181
205
|
const replacedCSS = css?.replaceAll(rootClassName, item.uid);
|
|
182
206
|
const replacedJS = javascript?.replaceAll(rootClassName, item.uid);
|
|
183
|
-
const cssCode = RenderIf(!!css, template`
|
|
184
|
-
<style
|
|
185
|
-
|
|
186
|
-
|
|
207
|
+
const cssCode = RenderIf(!!css && !isEmptyCSS(replacedCSS), template`
|
|
208
|
+
<style id="${`custom-css-${item?.uid}`}">
|
|
209
|
+
${replacedCSS}
|
|
210
|
+
</style>
|
|
187
211
|
`);
|
|
188
212
|
const jsCode = RenderIf(!!javascript, template`
|
|
189
|
-
<script
|
|
190
|
-
id="${`custom-js-${item?.uid}`}"
|
|
191
|
-
>
|
|
213
|
+
<script id="${`custom-js-${item?.uid}`}">
|
|
192
214
|
try {
|
|
193
215
|
${replacedJS}
|
|
194
216
|
} catch(err){}
|
|
@@ -216,6 +238,7 @@ const appendAnimation = (props, liquid)=>{
|
|
|
216
238
|
const appearTablet = getAnimationType(getSettingsByDevice('tablet'), 'appear');
|
|
217
239
|
const appearMobile = getAnimationType(getSettingsByDevice('mobile'), 'appear');
|
|
218
240
|
const enableAnimation = animation?.desktop?.enabled && (appearDesktop !== 'none' || hoverDesktop !== 'none') || animation?.tablet?.enabled && appearTablet !== 'none' || animation?.mobile?.enabled && appearMobile !== 'none';
|
|
241
|
+
if (!enableAnimation) return liquid;
|
|
219
242
|
const getInitVisibility = (device)=>getSettingsByDevice(device)?.enabled && ![
|
|
220
243
|
'shake',
|
|
221
244
|
'none'
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gem-sdk/core",
|
|
3
|
-
"version": "1.45.0-dev.
|
|
3
|
+
"version": "1.45.0-dev.105",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -33,6 +33,7 @@
|
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"classnames": "^2.5.1",
|
|
36
|
+
"cssjson": "2.1.3",
|
|
36
37
|
"dayjs": "^1.11.11",
|
|
37
38
|
"react-error-boundary": "4.0.10",
|
|
38
39
|
"swr": "2.1.2",
|