@gem-sdk/pages 1.17.0 → 1.21.0

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.
@@ -21,6 +21,7 @@ const Toolbox = ()=>{
21
21
  const initState = core.useBuilderPreviewStore((s)=>s.initState);
22
22
  const state = core.useBuilderPreviewStore((s)=>s.state);
23
23
  const initNormalizeState = core.useBuilderPreviewStore((s)=>s.forceChangeState);
24
+ const forceChangeItemProp = core.useBuilderPreviewStore((s)=>s.forceChangeItemProp);
24
25
  const changeItemPropByKey = core.useBuilderPreviewStore((s)=>s.changeItemPropByKey);
25
26
  const addItem = core.useBuilderPreviewStore((s)=>s.addItem);
26
27
  const moveItem = core.useBuilderPreviewStore((s)=>s.moveItem);
@@ -161,6 +162,19 @@ const Toolbox = ()=>{
161
162
  }, [
162
163
  changeItemPropByKey
163
164
  ]);
165
+ // Update props of entity
166
+ const onForceUpdateEntityProps = react.useCallback((e)=>{
167
+ try {
168
+ const detail = e.detail;
169
+ if (detail.uid) {
170
+ forceChangeItemProp(detail.uid, detail.data, detail.group);
171
+ }
172
+ } catch {
173
+ //
174
+ }
175
+ }, [
176
+ forceChangeItemProp
177
+ ]);
164
178
  // Move entity
165
179
  const onMoveEntity = react.useCallback((e)=>{
166
180
  try {
@@ -234,6 +248,7 @@ const Toolbox = ()=>{
234
248
  window.addEventListener('add-entity', onAddEntity);
235
249
  window.addEventListener('remove-entity', onRemoveEntity);
236
250
  window.addEventListener('move-entity', onMoveEntity);
251
+ window.addEventListener('force-update-entity-props', onForceUpdateEntityProps);
237
252
  window.addEventListener('update-entity-prop', onUpdateEntityProp);
238
253
  window.addEventListener('set-global-style', onChangeGlobalStyle);
239
254
  window.addEventListener('update-global-swatches-data', onChangeSwatchesData);
@@ -252,6 +267,7 @@ const Toolbox = ()=>{
252
267
  };
253
268
  }, [
254
269
  onAddEntity,
270
+ onForceUpdateEntityProps,
255
271
  onUpdateEntityProp,
256
272
  onInitBuilder,
257
273
  onMoveEntity,
@@ -83,10 +83,8 @@ const AddSectionImageToLayout = ({ editorImageToLayout })=>{
83
83
  children: "Add section"
84
84
  }),
85
85
  ACTIONS_DATA.map((action, index)=>{
86
- const CustomTag = index == 2 ? `label` : `div`;
87
- return /*#__PURE__*/ jsxRuntime.jsxs(CustomTag, {
86
+ return /*#__PURE__*/ jsxRuntime.jsxs("div", {
88
87
  className: `relative mx-1 h-[60px] w-[172px] cursor-pointer flex-col items-center justify-center rounded-[3px] bg-[#F4F4F4] hover:bg-black/10 ${isInput ? 'hidden' : 'flex'}`,
89
- htmlFor: "gp-add-section-bottom-from-select-image",
90
88
  id: action.id,
91
89
  onClick: ()=>onClick(index),
92
90
  "aria-hidden": true,
@@ -133,20 +131,12 @@ const AddSectionImageToLayout = ({ editorImageToLayout })=>{
133
131
  })
134
132
  ]
135
133
  }),
136
- /*#__PURE__*/ jsxRuntime.jsxs("div", {
134
+ /*#__PURE__*/ jsxRuntime.jsx("div", {
137
135
  className: "flex items-center ",
138
- children: [
139
- /*#__PURE__*/ jsxRuntime.jsx("span", {
140
- className: "mr-[3px] text-center text-[12px] font-normal text-[#676767]",
141
- children: action.content
142
- }),
143
- action.id === 'gps-add-section-bottom-from-image' && /*#__PURE__*/ jsxRuntime.jsx("input", {
144
- id: "gp-add-section-bottom-from-select-image",
145
- className: "rounded-medium z-2 absolute left-0 top-0 hidden h-full w-full cursor-pointer opacity-0 outline-none",
146
- type: "file",
147
- accept: ".png, .jpg, .jpeg"
148
- })
149
- ]
136
+ children: /*#__PURE__*/ jsxRuntime.jsx("span", {
137
+ className: "mr-[3px] text-center text-[12px] font-normal text-[#676767]",
138
+ children: action.content
139
+ })
150
140
  })
151
141
  ]
152
142
  }, action.id);
@@ -178,21 +178,13 @@ const ImageToLayoutInput = ({ totalSection })=>{
178
178
  children: "Please use an valid URL to generate"
179
179
  })
180
180
  }),
181
- /*#__PURE__*/ jsxRuntime.jsxs("div", {
181
+ /*#__PURE__*/ jsxRuntime.jsx("div", {
182
182
  className: "mt-4 flex items-center text-xs",
183
- children: [
184
- /*#__PURE__*/ jsxRuntime.jsx("label", {
185
- htmlFor: "gp-img-to-layout-gallery-btn",
186
- className: " relative mx-[5px] cursor-pointer font-medium text-[#3C67FF]",
187
- children: "Upload your designed image"
188
- }),
189
- /*#__PURE__*/ jsxRuntime.jsx("input", {
190
- id: "gp-img-to-layout-gallery-btn",
191
- className: "rounded-medium z-2 absolute hidden h-full w-full cursor-pointer opacity-0 outline-none",
192
- type: "file",
193
- accept: ".png, .jpg, .jpeg"
194
- })
195
- ]
183
+ children: /*#__PURE__*/ jsxRuntime.jsx("div", {
184
+ id: "gp-img-to-layout-gallery-btn",
185
+ className: " relative mx-[5px] cursor-pointer font-medium text-[#3C67FF]",
186
+ children: "Upload your designed image"
187
+ })
196
188
  })
197
189
  ]
198
190
  });
@@ -17,6 +17,7 @@ const Toolbox = ()=>{
17
17
  const initState = useBuilderPreviewStore((s)=>s.initState);
18
18
  const state = useBuilderPreviewStore((s)=>s.state);
19
19
  const initNormalizeState = useBuilderPreviewStore((s)=>s.forceChangeState);
20
+ const forceChangeItemProp = useBuilderPreviewStore((s)=>s.forceChangeItemProp);
20
21
  const changeItemPropByKey = useBuilderPreviewStore((s)=>s.changeItemPropByKey);
21
22
  const addItem = useBuilderPreviewStore((s)=>s.addItem);
22
23
  const moveItem = useBuilderPreviewStore((s)=>s.moveItem);
@@ -157,6 +158,19 @@ const Toolbox = ()=>{
157
158
  }, [
158
159
  changeItemPropByKey
159
160
  ]);
161
+ // Update props of entity
162
+ const onForceUpdateEntityProps = useCallback((e)=>{
163
+ try {
164
+ const detail = e.detail;
165
+ if (detail.uid) {
166
+ forceChangeItemProp(detail.uid, detail.data, detail.group);
167
+ }
168
+ } catch {
169
+ //
170
+ }
171
+ }, [
172
+ forceChangeItemProp
173
+ ]);
160
174
  // Move entity
161
175
  const onMoveEntity = useCallback((e)=>{
162
176
  try {
@@ -230,6 +244,7 @@ const Toolbox = ()=>{
230
244
  window.addEventListener('add-entity', onAddEntity);
231
245
  window.addEventListener('remove-entity', onRemoveEntity);
232
246
  window.addEventListener('move-entity', onMoveEntity);
247
+ window.addEventListener('force-update-entity-props', onForceUpdateEntityProps);
233
248
  window.addEventListener('update-entity-prop', onUpdateEntityProp);
234
249
  window.addEventListener('set-global-style', onChangeGlobalStyle);
235
250
  window.addEventListener('update-global-swatches-data', onChangeSwatchesData);
@@ -248,6 +263,7 @@ const Toolbox = ()=>{
248
263
  };
249
264
  }, [
250
265
  onAddEntity,
266
+ onForceUpdateEntityProps,
251
267
  onUpdateEntityProp,
252
268
  onInitBuilder,
253
269
  onMoveEntity,
@@ -79,10 +79,8 @@ const AddSectionImageToLayout = ({ editorImageToLayout })=>{
79
79
  children: "Add section"
80
80
  }),
81
81
  ACTIONS_DATA.map((action, index)=>{
82
- const CustomTag = index == 2 ? `label` : `div`;
83
- return /*#__PURE__*/ jsxs(CustomTag, {
82
+ return /*#__PURE__*/ jsxs("div", {
84
83
  className: `relative mx-1 h-[60px] w-[172px] cursor-pointer flex-col items-center justify-center rounded-[3px] bg-[#F4F4F4] hover:bg-black/10 ${isInput ? 'hidden' : 'flex'}`,
85
- htmlFor: "gp-add-section-bottom-from-select-image",
86
84
  id: action.id,
87
85
  onClick: ()=>onClick(index),
88
86
  "aria-hidden": true,
@@ -129,20 +127,12 @@ const AddSectionImageToLayout = ({ editorImageToLayout })=>{
129
127
  })
130
128
  ]
131
129
  }),
132
- /*#__PURE__*/ jsxs("div", {
130
+ /*#__PURE__*/ jsx("div", {
133
131
  className: "flex items-center ",
134
- children: [
135
- /*#__PURE__*/ jsx("span", {
136
- className: "mr-[3px] text-center text-[12px] font-normal text-[#676767]",
137
- children: action.content
138
- }),
139
- action.id === 'gps-add-section-bottom-from-image' && /*#__PURE__*/ jsx("input", {
140
- id: "gp-add-section-bottom-from-select-image",
141
- className: "rounded-medium z-2 absolute left-0 top-0 hidden h-full w-full cursor-pointer opacity-0 outline-none",
142
- type: "file",
143
- accept: ".png, .jpg, .jpeg"
144
- })
145
- ]
132
+ children: /*#__PURE__*/ jsx("span", {
133
+ className: "mr-[3px] text-center text-[12px] font-normal text-[#676767]",
134
+ children: action.content
135
+ })
146
136
  })
147
137
  ]
148
138
  }, action.id);
@@ -176,21 +176,13 @@ const ImageToLayoutInput = ({ totalSection })=>{
176
176
  children: "Please use an valid URL to generate"
177
177
  })
178
178
  }),
179
- /*#__PURE__*/ jsxs("div", {
179
+ /*#__PURE__*/ jsx("div", {
180
180
  className: "mt-4 flex items-center text-xs",
181
- children: [
182
- /*#__PURE__*/ jsx("label", {
183
- htmlFor: "gp-img-to-layout-gallery-btn",
184
- className: " relative mx-[5px] cursor-pointer font-medium text-[#3C67FF]",
185
- children: "Upload your designed image"
186
- }),
187
- /*#__PURE__*/ jsx("input", {
188
- id: "gp-img-to-layout-gallery-btn",
189
- className: "rounded-medium z-2 absolute hidden h-full w-full cursor-pointer opacity-0 outline-none",
190
- type: "file",
191
- accept: ".png, .jpg, .jpeg"
192
- })
193
- ]
181
+ children: /*#__PURE__*/ jsx("div", {
182
+ id: "gp-img-to-layout-gallery-btn",
183
+ className: " relative mx-[5px] cursor-pointer font-medium text-[#3C67FF]",
184
+ children: "Upload your designed image"
185
+ })
194
186
  })
195
187
  ]
196
188
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/pages",
3
- "version": "1.17.0",
3
+ "version": "1.21.0",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",
@@ -25,7 +25,7 @@
25
25
  "next-seo": "^6.0.0"
26
26
  },
27
27
  "devDependencies": {
28
- "@gem-sdk/core": "1.16.2",
28
+ "@gem-sdk/core": "1.21.0",
29
29
  "@gem-sdk/plugin-cookie-bar": "*",
30
30
  "@gem-sdk/plugin-quick-view": "*",
31
31
  "@gem-sdk/plugin-sticky-add-to-cart": "*"