@contentstack/live-preview-utils 3.0.2 → 3.1.1
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.
- package/README.md +1 -1
- package/dist/legacy/index.cjs +5 -5
- package/dist/legacy/index.cjs.map +1 -1
- package/dist/legacy/index.js +2 -2
- package/dist/legacy/index.js.map +1 -1
- package/dist/legacy/livePreview/editButton/editButton.cjs +3 -0
- package/dist/legacy/livePreview/editButton/editButton.cjs.map +1 -1
- package/dist/legacy/livePreview/editButton/editButton.js +3 -0
- package/dist/legacy/livePreview/editButton/editButton.js.map +1 -1
- package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.cjs +1 -1
- package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.js +1 -1
- package/dist/legacy/preview/contentstack-live-preview-HOC.cjs +23 -4
- package/dist/legacy/preview/contentstack-live-preview-HOC.cjs.map +1 -1
- package/dist/legacy/preview/contentstack-live-preview-HOC.d.cts +2 -1
- package/dist/legacy/preview/contentstack-live-preview-HOC.d.ts +2 -1
- package/dist/legacy/preview/contentstack-live-preview-HOC.js +23 -4
- package/dist/legacy/preview/contentstack-live-preview-HOC.js.map +1 -1
- package/dist/legacy/types/types.cjs.map +1 -1
- package/dist/legacy/types/types.d.cts +2 -1
- package/dist/legacy/types/types.d.ts +2 -1
- package/dist/legacy/types/types.js.map +1 -1
- package/dist/legacy/utils/addLivePreviewQueryTags.cjs +49 -0
- package/dist/legacy/utils/addLivePreviewQueryTags.cjs.map +1 -0
- package/dist/legacy/utils/addLivePreviewQueryTags.d.cts +3 -0
- package/dist/legacy/utils/addLivePreviewQueryTags.d.ts +3 -0
- package/dist/legacy/utils/addLivePreviewQueryTags.js +26 -0
- package/dist/legacy/utils/addLivePreviewQueryTags.js.map +1 -0
- package/dist/legacy/utils/index.cjs +3 -21
- package/dist/legacy/utils/index.cjs.map +1 -1
- package/dist/legacy/utils/index.d.cts +4 -2
- package/dist/legacy/utils/index.d.ts +4 -2
- package/dist/legacy/utils/index.js +1 -19
- package/dist/legacy/utils/index.js.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs +60 -13
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.d.cts +2 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.d.ts +2 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.js +61 -15
- package/dist/legacy/visualBuilder/components/FieldRevert/FieldRevertComponent.js.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.cjs +41 -0
- package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.cjs.map +1 -0
- package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.d.cts +3 -0
- package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.d.ts +3 -0
- package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.js +22 -0
- package/dist/legacy/visualBuilder/components/FieldRevert/useHandleOutsideClick.js.map +1 -0
- package/dist/legacy/visualBuilder/components/FieldToolbar.cjs +118 -119
- package/dist/legacy/visualBuilder/components/FieldToolbar.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/FieldToolbar.js +120 -121
- package/dist/legacy/visualBuilder/components/FieldToolbar.js.map +1 -1
- package/dist/legacy/visualBuilder/components/emptyBlock.cjs +1 -0
- package/dist/legacy/visualBuilder/components/emptyBlock.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/emptyBlock.js +1 -0
- package/dist/legacy/visualBuilder/components/emptyBlock.js.map +1 -1
- package/dist/legacy/visualBuilder/components/icons/variant.cjs +1 -1
- package/dist/legacy/visualBuilder/components/icons/variant.cjs.map +1 -1
- package/dist/legacy/visualBuilder/components/icons/variant.js +1 -1
- package/dist/legacy/visualBuilder/components/icons/variant.js.map +1 -1
- package/dist/legacy/visualBuilder/index.cjs +2 -1
- package/dist/legacy/visualBuilder/index.cjs.map +1 -1
- package/dist/legacy/visualBuilder/index.js +2 -1
- package/dist/legacy/visualBuilder/index.js.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.cjs +2 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.cjs.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.js +2 -1
- package/dist/legacy/visualBuilder/listeners/mouseClick.js.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseHover.cjs +2 -1
- package/dist/legacy/visualBuilder/listeners/mouseHover.cjs.map +1 -1
- package/dist/legacy/visualBuilder/listeners/mouseHover.js +2 -1
- package/dist/legacy/visualBuilder/listeners/mouseHover.js.map +1 -1
- package/dist/legacy/visualBuilder/utils/getCsDataOfElement.cjs +17 -2
- package/dist/legacy/visualBuilder/utils/getCsDataOfElement.cjs.map +1 -1
- package/dist/legacy/visualBuilder/utils/getCsDataOfElement.js +17 -2
- package/dist/legacy/visualBuilder/utils/getCsDataOfElement.js.map +1 -1
- package/dist/legacy/visualBuilder/visualBuilder.style.cjs +3 -0
- package/dist/legacy/visualBuilder/visualBuilder.style.cjs.map +1 -1
- package/dist/legacy/visualBuilder/visualBuilder.style.js +3 -0
- package/dist/legacy/visualBuilder/visualBuilder.style.js.map +1 -1
- package/dist/modern/index.cjs +5 -5
- package/dist/modern/index.cjs.map +1 -1
- package/dist/modern/index.js +2 -2
- package/dist/modern/index.js.map +1 -1
- package/dist/modern/livePreview/editButton/editButton.cjs +3 -0
- package/dist/modern/livePreview/editButton/editButton.cjs.map +1 -1
- package/dist/modern/livePreview/editButton/editButton.js +3 -0
- package/dist/modern/livePreview/editButton/editButton.js.map +1 -1
- package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.cjs +1 -1
- package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.js +1 -1
- package/dist/modern/preview/contentstack-live-preview-HOC.cjs +23 -4
- package/dist/modern/preview/contentstack-live-preview-HOC.cjs.map +1 -1
- package/dist/modern/preview/contentstack-live-preview-HOC.d.cts +2 -1
- package/dist/modern/preview/contentstack-live-preview-HOC.d.ts +2 -1
- package/dist/modern/preview/contentstack-live-preview-HOC.js +23 -4
- package/dist/modern/preview/contentstack-live-preview-HOC.js.map +1 -1
- package/dist/modern/types/types.cjs.map +1 -1
- package/dist/modern/types/types.d.cts +2 -1
- package/dist/modern/types/types.d.ts +2 -1
- package/dist/modern/types/types.js.map +1 -1
- package/dist/modern/utils/addLivePreviewQueryTags.cjs +49 -0
- package/dist/modern/utils/addLivePreviewQueryTags.cjs.map +1 -0
- package/dist/modern/utils/addLivePreviewQueryTags.d.cts +3 -0
- package/dist/modern/utils/addLivePreviewQueryTags.d.ts +3 -0
- package/dist/modern/utils/addLivePreviewQueryTags.js +26 -0
- package/dist/modern/utils/addLivePreviewQueryTags.js.map +1 -0
- package/dist/modern/utils/index.cjs +3 -21
- package/dist/modern/utils/index.cjs.map +1 -1
- package/dist/modern/utils/index.d.cts +4 -2
- package/dist/modern/utils/index.d.ts +4 -2
- package/dist/modern/utils/index.js +1 -19
- package/dist/modern/utils/index.js.map +1 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs +60 -13
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.d.cts +2 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.d.ts +2 -1
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.js +61 -15
- package/dist/modern/visualBuilder/components/FieldRevert/FieldRevertComponent.js.map +1 -1
- package/dist/modern/visualBuilder/components/FieldRevert/useHandleOutsideClick.cjs +41 -0
- package/dist/modern/visualBuilder/components/FieldRevert/useHandleOutsideClick.cjs.map +1 -0
- package/dist/modern/visualBuilder/components/FieldRevert/useHandleOutsideClick.d.cts +3 -0
- package/dist/modern/visualBuilder/components/FieldRevert/useHandleOutsideClick.d.ts +3 -0
- package/dist/modern/visualBuilder/components/FieldRevert/useHandleOutsideClick.js +22 -0
- package/dist/modern/visualBuilder/components/FieldRevert/useHandleOutsideClick.js.map +1 -0
- package/dist/modern/visualBuilder/components/FieldToolbar.cjs +118 -119
- package/dist/modern/visualBuilder/components/FieldToolbar.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/FieldToolbar.js +120 -121
- package/dist/modern/visualBuilder/components/FieldToolbar.js.map +1 -1
- package/dist/modern/visualBuilder/components/emptyBlock.cjs +1 -0
- package/dist/modern/visualBuilder/components/emptyBlock.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/emptyBlock.js +1 -0
- package/dist/modern/visualBuilder/components/emptyBlock.js.map +1 -1
- package/dist/modern/visualBuilder/components/icons/variant.cjs +1 -1
- package/dist/modern/visualBuilder/components/icons/variant.cjs.map +1 -1
- package/dist/modern/visualBuilder/components/icons/variant.js +1 -1
- package/dist/modern/visualBuilder/components/icons/variant.js.map +1 -1
- package/dist/modern/visualBuilder/index.cjs +2 -1
- package/dist/modern/visualBuilder/index.cjs.map +1 -1
- package/dist/modern/visualBuilder/index.js +2 -1
- package/dist/modern/visualBuilder/index.js.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.cjs +2 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.cjs.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.js +2 -1
- package/dist/modern/visualBuilder/listeners/mouseClick.js.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseHover.cjs +2 -1
- package/dist/modern/visualBuilder/listeners/mouseHover.cjs.map +1 -1
- package/dist/modern/visualBuilder/listeners/mouseHover.js +2 -1
- package/dist/modern/visualBuilder/listeners/mouseHover.js.map +1 -1
- package/dist/modern/visualBuilder/utils/getCsDataOfElement.cjs +17 -2
- package/dist/modern/visualBuilder/utils/getCsDataOfElement.cjs.map +1 -1
- package/dist/modern/visualBuilder/utils/getCsDataOfElement.js +17 -2
- package/dist/modern/visualBuilder/utils/getCsDataOfElement.js.map +1 -1
- package/dist/modern/visualBuilder/visualBuilder.style.cjs +3 -0
- package/dist/modern/visualBuilder/visualBuilder.style.cjs.map +1 -1
- package/dist/modern/visualBuilder/visualBuilder.style.js +3 -0
- package/dist/modern/visualBuilder/visualBuilder.style.js.map +1 -1
- package/package.json +21 -9
|
@@ -34,8 +34,8 @@ import { getDOMEditStack } from "../utils/getCsDataOfElement.js";
|
|
|
34
34
|
import { VariantIcon } from "./icons/variant.js";
|
|
35
35
|
import {
|
|
36
36
|
BASE_VARIANT_STATUS,
|
|
37
|
-
|
|
38
|
-
|
|
37
|
+
getFieldVariantStatus,
|
|
38
|
+
VariantRevertDropdown
|
|
39
39
|
} from "./FieldRevert/FieldRevertComponent.js";
|
|
40
40
|
import { Fragment, jsx, jsxs } from "preact/jsx-runtime";
|
|
41
41
|
var TOOLTIP_TOP_EDGE_BUFFER = 96;
|
|
@@ -264,132 +264,131 @@ function FieldToolbarComponent(props) {
|
|
|
264
264
|
[visualBuilderStyles()["visual-builder__tooltip--bottom"]]: invertTooltipPosition
|
|
265
265
|
}
|
|
266
266
|
);
|
|
267
|
-
return /* @__PURE__ */
|
|
267
|
+
return /* @__PURE__ */ jsx(
|
|
268
268
|
"div",
|
|
269
269
|
{
|
|
270
270
|
className: classNames(
|
|
271
271
|
"visual-builder__field-toolbar-container",
|
|
272
272
|
visualBuilderStyles()["visual-builder__field-toolbar-container"]
|
|
273
273
|
),
|
|
274
|
-
children:
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
] })
|
|
274
|
+
children: /* @__PURE__ */ jsx(
|
|
275
|
+
"div",
|
|
276
|
+
{
|
|
277
|
+
className: classNames(
|
|
278
|
+
"visual-builder__focused-toolbar__multiple-field-toolbar",
|
|
279
|
+
visualBuilderStyles()["visual-builder__focused-toolbar__multiple-field-toolbar"]
|
|
280
|
+
),
|
|
281
|
+
"data-testid": "visual-builder__focused-toolbar__multiple-field-toolbar",
|
|
282
|
+
children: /* @__PURE__ */ jsx(
|
|
283
|
+
"div",
|
|
284
|
+
{
|
|
285
|
+
className: classNames(
|
|
286
|
+
"visual-builder__focused-toolbar__button-group",
|
|
287
|
+
visualBuilderStyles()["visual-builder__focused-toolbar__button-group"]
|
|
288
|
+
),
|
|
289
|
+
children: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
290
|
+
isVariant ? /* @__PURE__ */ jsx(
|
|
291
|
+
VariantRevertDropdown,
|
|
292
|
+
{
|
|
293
|
+
fieldDataName: fieldMetadata.fieldPathWithIndex,
|
|
294
|
+
fieldMetadata,
|
|
295
|
+
variantStatus: fieldVariantStatus,
|
|
296
|
+
isOpen: isOpenVariantRevert,
|
|
297
|
+
closeDropdown: closeVariantDropdown,
|
|
298
|
+
invertTooltipPosition,
|
|
299
|
+
toggleVariantDropdown
|
|
300
|
+
}
|
|
301
|
+
) : null,
|
|
302
|
+
isMultiple && !isWholeMultipleField ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
303
|
+
/* @__PURE__ */ jsx(
|
|
304
|
+
"button",
|
|
305
|
+
{
|
|
306
|
+
"data-testid": "visual-builder__focused-toolbar__multiple-field-toolbar__move-left-button",
|
|
307
|
+
className: multipleFieldToolbarButtonClasses,
|
|
308
|
+
"data-tooltip": direction === "vertical" ? "Move up" : "Move left",
|
|
309
|
+
onClick: (e) => {
|
|
310
|
+
e.preventDefault();
|
|
311
|
+
e.stopPropagation();
|
|
312
|
+
handleMoveInstance(
|
|
313
|
+
fieldMetadata,
|
|
314
|
+
"previous"
|
|
315
|
+
);
|
|
316
|
+
},
|
|
317
|
+
disabled: disableMoveLeft,
|
|
318
|
+
children: /* @__PURE__ */ jsx(
|
|
319
|
+
MoveLeftIcon,
|
|
320
|
+
{
|
|
321
|
+
className: classNames({
|
|
322
|
+
"visual-builder__rotate--90": direction === "vertical",
|
|
323
|
+
[visualBuilderStyles()["visual-builder__rotate--90"]]: direction === "vertical"
|
|
324
|
+
}),
|
|
325
|
+
disabled: disableMoveLeft
|
|
326
|
+
}
|
|
327
|
+
)
|
|
328
|
+
}
|
|
329
|
+
),
|
|
330
|
+
/* @__PURE__ */ jsx(
|
|
331
|
+
"button",
|
|
332
|
+
{
|
|
333
|
+
"data-testid": "visual-builder__focused-toolbar__multiple-field-toolbar__move-right-button",
|
|
334
|
+
className: multipleFieldToolbarButtonClasses,
|
|
335
|
+
"data-tooltip": direction === "vertical" ? "Move down" : "Move right",
|
|
336
|
+
onClick: (e) => {
|
|
337
|
+
e.preventDefault();
|
|
338
|
+
e.stopPropagation();
|
|
339
|
+
handleMoveInstance(
|
|
340
|
+
fieldMetadata,
|
|
341
|
+
"next"
|
|
342
|
+
);
|
|
343
|
+
},
|
|
344
|
+
disabled: disableMoveRight,
|
|
345
|
+
children: /* @__PURE__ */ jsx(
|
|
346
|
+
MoveRightIcon,
|
|
347
|
+
{
|
|
348
|
+
className: classNames({
|
|
349
|
+
"visual-builder__rotate--90": direction === "vertical",
|
|
350
|
+
[visualBuilderStyles()["visual-builder__rotate--90"]]: direction === "vertical"
|
|
351
|
+
}),
|
|
352
|
+
disabled: disableMoveRight
|
|
353
|
+
}
|
|
354
|
+
)
|
|
355
|
+
}
|
|
356
|
+
),
|
|
357
|
+
isModalEditable ? editButton : null,
|
|
358
|
+
formButton,
|
|
359
|
+
isReplaceAllowed ? replaceButton : null,
|
|
360
|
+
/* @__PURE__ */ jsx(
|
|
361
|
+
"button",
|
|
362
|
+
{
|
|
363
|
+
"data-testid": "visual-builder__focused-toolbar__multiple-field-toolbar__delete-button",
|
|
364
|
+
className: multipleFieldToolbarButtonClasses,
|
|
365
|
+
"data-tooltip": "Delete",
|
|
366
|
+
onClick: (e) => {
|
|
367
|
+
e.preventDefault();
|
|
368
|
+
e.stopPropagation();
|
|
369
|
+
handleDeleteInstance(fieldMetadata);
|
|
370
|
+
},
|
|
371
|
+
children: /* @__PURE__ */ jsx(DeleteIcon, {})
|
|
372
|
+
}
|
|
373
|
+
)
|
|
374
|
+
] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
375
|
+
isModalEditable ? editButton : null,
|
|
376
|
+
isReplaceAllowed ? replaceButton : null,
|
|
377
|
+
formButton,
|
|
378
|
+
fieldSchema ? /* @__PURE__ */ jsx(
|
|
379
|
+
CommentIcon,
|
|
380
|
+
{
|
|
381
|
+
fieldMetadata,
|
|
382
|
+
fieldSchema,
|
|
383
|
+
invertTooltipPosition
|
|
384
|
+
}
|
|
385
|
+
) : null
|
|
387
386
|
] })
|
|
388
|
-
}
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
387
|
+
] })
|
|
388
|
+
}
|
|
389
|
+
)
|
|
390
|
+
}
|
|
391
|
+
)
|
|
393
392
|
}
|
|
394
393
|
);
|
|
395
394
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/components/FieldToolbar.tsx"],"sourcesContent":["import { CslpData } from \"../../cslp/types/cslp.types\";\nimport getChildrenDirection from \"../utils/getChildrenDirection\";\nimport {\n ALLOWED_MODAL_EDITABLE_FIELD,\n ALLOWED_REPLACE_FIELDS,\n DEFAULT_MULTIPLE_FIELDS,\n} from \"../utils/constants\";\nimport { getFieldType } from \"../utils/getFieldType\";\nimport {\n handleDeleteInstance,\n handleMoveInstance,\n} from \"../utils/instanceHandlers\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { FieldDataType, ISchemaFieldMap } from \"../utils/types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport {\n CaretIcon,\n DeleteIcon,\n MoveLeftIcon,\n MoveRightIcon,\n ReplaceAssetIcon,\n} from \"./icons\";\nimport { fieldIcons } from \"./icons/fields\";\nimport classNames from \"classnames\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport CommentIcon from \"./CommentIcon\";\nimport React, { useEffect, useState } from \"preact/compat\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\nimport { IReferenceContentTypeSchema } from \"../../cms/types/contentTypeSchema.types\";\nimport { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport { FormIcon } from \"./icons\";\nimport { getDOMEditStack } from \"../utils/getCsDataOfElement\";\nimport { VariantIcon } from \"./icons/variant\";\nimport {\n BASE_VARIANT_STATUS,\n FieldRevertComponent,\n getFieldVariantStatus,\n IVariantStatus,\n} from \"./FieldRevert/FieldRevertComponent\";\n\nexport type FieldDetails = Pick<\n VisualBuilderCslpEventDetails,\n \"editableElement\" | \"fieldMetadata\"\n>;\n\nconst TOOLTIP_TOP_EDGE_BUFFER = 96;\n\ninterface MultipleFieldToolbarProps {\n eventDetails: VisualBuilderCslpEventDetails;\n hideOverlay: () => void;\n}\n\nfunction handleReplaceAsset(fieldMetadata: CslpData) {\n // TODO avoid sending whole fieldMetadata\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.OPEN_ASSET_MODAL,\n {\n fieldMetadata,\n }\n );\n}\n\nfunction handleReplaceReference(fieldMetadata: CslpData) {\n const isMultipleInstance =\n fieldMetadata.multipleFieldMetadata.index > -1 &&\n fieldMetadata.fieldPathWithIndex ===\n fieldMetadata.multipleFieldMetadata.parentDetails?.parentPath;\n const entryPath = isMultipleInstance\n ? fieldMetadata.instance.fieldPathWithIndex\n : fieldMetadata.fieldPathWithIndex;\n\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.OPEN_REFERENCE_MODAL,\n {\n entry_uid: fieldMetadata.entry_uid,\n content_type_uid: fieldMetadata.content_type_uid,\n locale: fieldMetadata.locale,\n fieldPath: fieldMetadata.fieldPath,\n fieldPathWithIndex: fieldMetadata.fieldPathWithIndex,\n entryPath,\n }\n );\n}\n\nfunction handleEdit(fieldMetadata: CslpData) {\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.OPEN_FIELD_EDIT_MODAL,\n { fieldMetadata }\n );\n}\n\nfunction handleFormFieldFocus(eventDetails: VisualBuilderCslpEventDetails) {\n const { editableElement, fieldMetadata, cslpData } = eventDetails;\n visualBuilderPostMessage\n ?.send(VisualBuilderPostMessageEvents.TOGGLE_FORM, {\n fieldMetadata,\n cslpData,\n })\n .then(() => {\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.FOCUS_FIELD,\n {\n DOMEditStack: getDOMEditStack(editableElement),\n }\n );\n });\n}\n\nfunction FieldToolbarComponent(\n props: MultipleFieldToolbarProps\n): JSX.Element | null {\n const { eventDetails } = props;\n const { fieldMetadata, editableElement: targetElement } = eventDetails;\n\n const parentPath =\n fieldMetadata?.multipleFieldMetadata?.parentDetails?.parentCslpValue ||\n \"\";\n const direction = getChildrenDirection(targetElement, parentPath);\n const isVariant = !!fieldMetadata?.variant;\n const [fieldSchema, setFieldSchema] = useState<ISchemaFieldMap | null>(\n null\n );\n const [fieldVariantStatus, setFieldVariantStatus] =\n useState<IVariantStatus>(BASE_VARIANT_STATUS);\n const [isOpenVariantRevert, setIsOpenVariantRevert] =\n useState<boolean>(false);\n\n let isModalEditable = false;\n let isReplaceAllowed = false;\n let isMultiple = false;\n let Icon = null;\n let fieldType = null;\n let isWholeMultipleField = false;\n\n if (fieldSchema) {\n const { isDisabled } = isFieldDisabled(fieldSchema, {\n editableElement: targetElement,\n fieldMetadata,\n });\n\n // field is disabled, no actions needed\n if (isDisabled) {\n return null;\n }\n\n fieldType = getFieldType(fieldSchema);\n isModalEditable = ALLOWED_MODAL_EDITABLE_FIELD.includes(fieldType);\n isReplaceAllowed = ALLOWED_REPLACE_FIELDS.includes(fieldType);\n\n Icon = fieldIcons[fieldType];\n\n isMultiple = fieldSchema.multiple || false;\n if (fieldType === FieldDataType.REFERENCE)\n isMultiple = (fieldSchema as IReferenceContentTypeSchema)\n .field_metadata.ref_multiple;\n\n // field is multiple but an instance is not selected\n // instead the whole field (all instances) is selected.\n // Currently, when whole featured_blogs is selected in canvas,\n // the fieldPathWithIndex and instance.fieldPathWithIndex are the same\n // cannot rely on -1 index, as the non-negative index then refers to the index of\n // the featured_blogs block in page_components\n // It is not needed except taxanomy.\n isWholeMultipleField =\n isMultiple &&\n (fieldMetadata.fieldPathWithIndex ===\n fieldMetadata.instance.fieldPathWithIndex ||\n fieldMetadata.multipleFieldMetadata?.index === -1);\n\n if (\n DEFAULT_MULTIPLE_FIELDS.includes(fieldType) &&\n isWholeMultipleField\n ) {\n return null;\n }\n }\n\n const invertTooltipPosition =\n targetElement.getBoundingClientRect().top <= TOOLTIP_TOP_EDGE_BUFFER;\n\n const editButton = Icon ? (\n <button\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar__edit-button\"\n className={classNames(\n \"visual-builder__button visual-builder__button--secondary visual-builder__button--edit\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__button--edit\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n )}\n data-tooltip={\"Edit\"}\n onClick={(e) => {\n // TODO the listener for field path is attached to the common parent requiring\n // propagation to be stopped, should ideally only attach onClick to fieldpath dropdown\n e.preventDefault();\n e.stopPropagation();\n handleEdit(fieldMetadata);\n }}\n >\n <Icon />\n </button>\n ) : null;\n\n const replaceButton = fieldType ? (\n <button\n className={classNames(\n \"visual-builder__replace-button visual-builder__button visual-builder__button--secondary\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n )}\n data-tooltip={\"Replace\"}\n data-testid={`visual-builder-replace-${fieldType}`}\n onClick={(e) => {\n e.stopPropagation();\n e.preventDefault();\n if (fieldType === FieldDataType.REFERENCE) {\n handleReplaceReference(fieldMetadata);\n return;\n } else if (fieldType === FieldDataType.FILE) {\n handleReplaceAsset(fieldMetadata);\n return;\n }\n }}\n >\n <ReplaceAssetIcon />\n </button>\n ) : null;\n\n const formButton = (\n <button\n className={classNames(\n \"visual-builder__replace-button visual-builder__button visual-builder__button--secondary\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n )}\n data-tooltip={\"Form\"}\n data-testid={`visual-builder-form`}\n onClick={(e) => {\n handleFormFieldFocus(eventDetails);\n }}\n >\n <FormIcon />\n </button>\n );\n\n const toggleVariantDropdown = () => {\n setIsOpenVariantRevert(!isOpenVariantRevert);\n };\n\n const closeVariantDropdown = () => {\n setIsOpenVariantRevert(false);\n };\n\n const variantButton = (\n <button\n className={classNames(\n \"visual-builder__variant-button visual-builder__button visual-builder__button--secondary\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n visualBuilderStyles()[\"visual-builder__variant-button\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n )}\n data-tooltip={\"Variant Revert\"}\n data-testid={`visual-builder-canvas-variant-revert`}\n onClick={toggleVariantDropdown}\n >\n <VariantIcon />\n <CaretIcon open={isOpenVariantRevert} />\n </button>\n );\n\n const totalElementCount = targetElement?.parentNode?.childElementCount ?? 1;\n const indexOfElement = fieldMetadata?.multipleFieldMetadata?.index;\n\n const disableMoveLeft = indexOfElement === 0; // first element\n const disableMoveRight = indexOfElement === totalElementCount - 1; // last element\n\n useEffect(() => {\n async function fetchFieldSchema() {\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n );\n if (fieldSchema) {\n setFieldSchema(fieldSchema);\n }\n const variantStatus = await getFieldVariantStatus(fieldMetadata);\n setFieldVariantStatus(variantStatus ?? BASE_VARIANT_STATUS);\n }\n fetchFieldSchema();\n }, [fieldMetadata]);\n\n useEffect(() => {\n const event = visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.DELETE_INSTANCE,\n (args: { data: { path: string } }) => {\n if (\n args.data?.path ===\n fieldMetadata.instance.fieldPathWithIndex\n ) {\n props.hideOverlay();\n }\n }\n );\n return () => {\n event?.unregister();\n };\n }, []);\n\n const multipleFieldToolbarButtonClasses = classNames(\n \"visual-builder__button visual-builder__button--secondary\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n );\n\n return (\n <div\n className={classNames(\n \"visual-builder__field-toolbar-container\",\n visualBuilderStyles()[\"visual-builder__field-toolbar-container\"]\n )}\n >\n {isVariant && (\n <FieldRevertComponent\n fieldDataName={fieldMetadata.fieldPathWithIndex}\n fieldMetadata={fieldMetadata}\n variantStatus={fieldVariantStatus}\n isOpen={isOpenVariantRevert}\n closeDropdown={closeVariantDropdown}\n />\n )}\n <div\n className={classNames(\n \"visual-builder__focused-toolbar__multiple-field-toolbar\",\n visualBuilderStyles()[\n \"visual-builder__focused-toolbar__multiple-field-toolbar\"\n ]\n )}\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar\"\n >\n <div\n className={classNames(\n \"visual-builder__focused-toolbar__button-group\",\n visualBuilderStyles()[\n \"visual-builder__focused-toolbar__button-group\"\n ]\n )}\n >\n <>\n {isVariant ? variantButton : null}\n {isMultiple && !isWholeMultipleField ? (\n <>\n <button\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar__move-left-button\"\n className={\n multipleFieldToolbarButtonClasses\n }\n data-tooltip={\n direction === \"vertical\"\n ? \"Move up\"\n : \"Move left\"\n }\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n handleMoveInstance(\n fieldMetadata,\n \"previous\"\n );\n }}\n disabled={disableMoveLeft}\n >\n <MoveLeftIcon\n className={classNames({\n \"visual-builder__rotate--90\":\n direction === \"vertical\",\n [visualBuilderStyles()[\n \"visual-builder__rotate--90\"\n ]]: direction === \"vertical\",\n })}\n disabled={disableMoveLeft}\n />\n </button>\n\n <button\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar__move-right-button\"\n className={\n multipleFieldToolbarButtonClasses\n }\n data-tooltip={\n direction === \"vertical\"\n ? \"Move down\"\n : \"Move right\"\n }\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n handleMoveInstance(\n fieldMetadata,\n \"next\"\n );\n }}\n disabled={disableMoveRight}\n >\n <MoveRightIcon\n className={classNames({\n \"visual-builder__rotate--90\":\n direction === \"vertical\",\n [visualBuilderStyles()[\n \"visual-builder__rotate--90\"\n ]]: direction === \"vertical\",\n })}\n disabled={disableMoveRight}\n />\n </button>\n\n {isModalEditable ? editButton : null}\n {formButton}\n {isReplaceAllowed ? replaceButton : null}\n\n <button\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar__delete-button\"\n className={\n multipleFieldToolbarButtonClasses\n }\n data-tooltip={\"Delete\"}\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n handleDeleteInstance(fieldMetadata);\n }}\n >\n <DeleteIcon />\n </button>\n </>\n ) : (\n <>\n {isModalEditable ? editButton : null}\n {isReplaceAllowed ? replaceButton : null}\n {formButton}\n {fieldSchema ? (\n <CommentIcon\n fieldMetadata={fieldMetadata}\n fieldSchema={fieldSchema}\n invertTooltipPosition={\n invertTooltipPosition\n }\n />\n ) : null}\n </>\n )}\n </>\n </div>\n </div>\n </div>\n );\n}\n\nexport default FieldToolbarComponent;\n"],"mappings":"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","names":["fieldSchema"]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/components/FieldToolbar.tsx"],"sourcesContent":["import { CslpData } from \"../../cslp/types/cslp.types\";\nimport getChildrenDirection from \"../utils/getChildrenDirection\";\nimport {\n ALLOWED_MODAL_EDITABLE_FIELD,\n ALLOWED_REPLACE_FIELDS,\n DEFAULT_MULTIPLE_FIELDS,\n} from \"../utils/constants\";\nimport { getFieldType } from \"../utils/getFieldType\";\nimport {\n handleDeleteInstance,\n handleMoveInstance,\n} from \"../utils/instanceHandlers\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { FieldDataType, ISchemaFieldMap } from \"../utils/types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport {\n CaretIcon,\n DeleteIcon,\n MoveLeftIcon,\n MoveRightIcon,\n ReplaceAssetIcon,\n} from \"./icons\";\nimport { fieldIcons } from \"./icons/fields\";\nimport classNames from \"classnames\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport CommentIcon from \"./CommentIcon\";\nimport React, { useEffect, useState } from \"preact/compat\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\nimport { IReferenceContentTypeSchema } from \"../../cms/types/contentTypeSchema.types\";\nimport { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport { FormIcon } from \"./icons\";\nimport { getDOMEditStack } from \"../utils/getCsDataOfElement\";\nimport { VariantIcon } from \"./icons/variant\";\nimport {\n BASE_VARIANT_STATUS,\n FieldRevertComponent,\n getFieldVariantStatus,\n IVariantStatus,\n VariantRevertDropdown,\n} from \"./FieldRevert/FieldRevertComponent\";\n\nexport type FieldDetails = Pick<\n VisualBuilderCslpEventDetails,\n \"editableElement\" | \"fieldMetadata\"\n>;\n\nconst TOOLTIP_TOP_EDGE_BUFFER = 96;\n\ninterface MultipleFieldToolbarProps {\n eventDetails: VisualBuilderCslpEventDetails;\n hideOverlay: () => void;\n}\n\nfunction handleReplaceAsset(fieldMetadata: CslpData) {\n // TODO avoid sending whole fieldMetadata\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.OPEN_ASSET_MODAL,\n {\n fieldMetadata,\n }\n );\n}\n\nfunction handleReplaceReference(fieldMetadata: CslpData) {\n const isMultipleInstance =\n fieldMetadata.multipleFieldMetadata.index > -1 &&\n fieldMetadata.fieldPathWithIndex ===\n fieldMetadata.multipleFieldMetadata.parentDetails?.parentPath;\n const entryPath = isMultipleInstance\n ? fieldMetadata.instance.fieldPathWithIndex\n : fieldMetadata.fieldPathWithIndex;\n\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.OPEN_REFERENCE_MODAL,\n {\n entry_uid: fieldMetadata.entry_uid,\n content_type_uid: fieldMetadata.content_type_uid,\n locale: fieldMetadata.locale,\n fieldPath: fieldMetadata.fieldPath,\n fieldPathWithIndex: fieldMetadata.fieldPathWithIndex,\n entryPath,\n }\n );\n}\n\nfunction handleEdit(fieldMetadata: CslpData) {\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.OPEN_FIELD_EDIT_MODAL,\n { fieldMetadata }\n );\n}\n\nfunction handleFormFieldFocus(eventDetails: VisualBuilderCslpEventDetails) {\n const { editableElement, fieldMetadata, cslpData } = eventDetails;\n visualBuilderPostMessage\n ?.send(VisualBuilderPostMessageEvents.TOGGLE_FORM, {\n fieldMetadata,\n cslpData,\n })\n .then(() => {\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.FOCUS_FIELD,\n {\n DOMEditStack: getDOMEditStack(editableElement),\n }\n );\n });\n}\n\nfunction FieldToolbarComponent(\n props: MultipleFieldToolbarProps\n): JSX.Element | null {\n const { eventDetails } = props;\n const { fieldMetadata, editableElement: targetElement } = eventDetails;\n\n const parentPath =\n fieldMetadata?.multipleFieldMetadata?.parentDetails?.parentCslpValue ||\n \"\";\n const direction = getChildrenDirection(targetElement, parentPath);\n const isVariant = !!fieldMetadata?.variant;\n const [fieldSchema, setFieldSchema] = useState<ISchemaFieldMap | null>(\n null\n );\n const [fieldVariantStatus, setFieldVariantStatus] =\n useState<IVariantStatus>(BASE_VARIANT_STATUS);\n const [isOpenVariantRevert, setIsOpenVariantRevert] =\n useState<boolean>(false);\n\n let isModalEditable = false;\n let isReplaceAllowed = false;\n let isMultiple = false;\n let Icon = null;\n let fieldType = null;\n let isWholeMultipleField = false;\n\n if (fieldSchema) {\n const { isDisabled } = isFieldDisabled(fieldSchema, {\n editableElement: targetElement,\n fieldMetadata,\n });\n\n // field is disabled, no actions needed\n if (isDisabled) {\n return null;\n }\n\n fieldType = getFieldType(fieldSchema);\n isModalEditable = ALLOWED_MODAL_EDITABLE_FIELD.includes(fieldType);\n isReplaceAllowed = ALLOWED_REPLACE_FIELDS.includes(fieldType);\n\n Icon = fieldIcons[fieldType];\n\n isMultiple = fieldSchema.multiple || false;\n if (fieldType === FieldDataType.REFERENCE)\n isMultiple = (fieldSchema as IReferenceContentTypeSchema)\n .field_metadata.ref_multiple;\n\n // field is multiple but an instance is not selected\n // instead the whole field (all instances) is selected.\n // Currently, when whole featured_blogs is selected in canvas,\n // the fieldPathWithIndex and instance.fieldPathWithIndex are the same\n // cannot rely on -1 index, as the non-negative index then refers to the index of\n // the featured_blogs block in page_components\n // It is not needed except taxanomy.\n isWholeMultipleField =\n isMultiple &&\n (fieldMetadata.fieldPathWithIndex ===\n fieldMetadata.instance.fieldPathWithIndex ||\n fieldMetadata.multipleFieldMetadata?.index === -1);\n\n if (\n DEFAULT_MULTIPLE_FIELDS.includes(fieldType) &&\n isWholeMultipleField\n ) {\n return null;\n }\n }\n\n const invertTooltipPosition =\n targetElement.getBoundingClientRect().top <= TOOLTIP_TOP_EDGE_BUFFER;\n\n const editButton = Icon ? (\n <button\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar__edit-button\"\n className={classNames(\n \"visual-builder__button visual-builder__button--secondary visual-builder__button--edit\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__button--edit\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n )}\n data-tooltip={\"Edit\"}\n onClick={(e) => {\n // TODO the listener for field path is attached to the common parent requiring\n // propagation to be stopped, should ideally only attach onClick to fieldpath dropdown\n e.preventDefault();\n e.stopPropagation();\n handleEdit(fieldMetadata);\n }}\n >\n <Icon />\n </button>\n ) : null;\n\n const replaceButton = fieldType ? (\n <button\n className={classNames(\n \"visual-builder__replace-button visual-builder__button visual-builder__button--secondary\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n )}\n data-tooltip={\"Replace\"}\n data-testid={`visual-builder-replace-${fieldType}`}\n onClick={(e) => {\n e.stopPropagation();\n e.preventDefault();\n if (fieldType === FieldDataType.REFERENCE) {\n handleReplaceReference(fieldMetadata);\n return;\n } else if (fieldType === FieldDataType.FILE) {\n handleReplaceAsset(fieldMetadata);\n return;\n }\n }}\n >\n <ReplaceAssetIcon />\n </button>\n ) : null;\n\n const formButton = (\n <button\n className={classNames(\n \"visual-builder__replace-button visual-builder__button visual-builder__button--secondary\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n )}\n data-tooltip={\"Form\"}\n data-testid={`visual-builder-form`}\n onClick={(e) => {\n handleFormFieldFocus(eventDetails);\n }}\n >\n <FormIcon />\n </button>\n );\n\n const toggleVariantDropdown = () => {\n setIsOpenVariantRevert(!isOpenVariantRevert);\n };\n\n const closeVariantDropdown = () => {\n setIsOpenVariantRevert(false);\n };\n\n const variantButton = (\n <button\n className={classNames(\n \"visual-builder__variant-button visual-builder__button visual-builder__button--secondary\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n visualBuilderStyles()[\"visual-builder__variant-button\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n )}\n data-tooltip={\"Variant Revert\"}\n data-testid={`visual-builder-canvas-variant-revert`}\n onClick={toggleVariantDropdown}\n >\n <VariantIcon />\n <CaretIcon open={isOpenVariantRevert} />\n </button>\n );\n\n const totalElementCount = targetElement?.parentNode?.childElementCount ?? 1;\n const indexOfElement = fieldMetadata?.multipleFieldMetadata?.index;\n\n const disableMoveLeft = indexOfElement === 0; // first element\n const disableMoveRight = indexOfElement === totalElementCount - 1; // last element\n\n useEffect(() => {\n async function fetchFieldSchema() {\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n );\n if (fieldSchema) {\n setFieldSchema(fieldSchema);\n }\n const variantStatus = await getFieldVariantStatus(fieldMetadata);\n setFieldVariantStatus(variantStatus ?? BASE_VARIANT_STATUS);\n }\n fetchFieldSchema();\n }, [fieldMetadata]);\n\n useEffect(() => {\n const event = visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.DELETE_INSTANCE,\n (args: { data: { path: string } }) => {\n if (\n args.data?.path ===\n fieldMetadata.instance.fieldPathWithIndex\n ) {\n props.hideOverlay();\n }\n }\n );\n return () => {\n event?.unregister();\n };\n }, []);\n\n const multipleFieldToolbarButtonClasses = classNames(\n \"visual-builder__button visual-builder__button--secondary\",\n visualBuilderStyles()[\"visual-builder__button\"],\n visualBuilderStyles()[\"visual-builder__button--secondary\"],\n visualBuilderStyles()[\"visual-builder__tooltip\"],\n {\n \"visual-builder__tooltip--bottom\": invertTooltipPosition,\n [visualBuilderStyles()[\"visual-builder__tooltip--bottom\"]]:\n invertTooltipPosition,\n }\n );\n\n return (\n <div\n className={classNames(\n \"visual-builder__field-toolbar-container\",\n visualBuilderStyles()[\"visual-builder__field-toolbar-container\"]\n )}\n >\n <div\n className={classNames(\n \"visual-builder__focused-toolbar__multiple-field-toolbar\",\n visualBuilderStyles()[\n \"visual-builder__focused-toolbar__multiple-field-toolbar\"\n ]\n )}\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar\"\n >\n <div\n className={classNames(\n \"visual-builder__focused-toolbar__button-group\",\n visualBuilderStyles()[\n \"visual-builder__focused-toolbar__button-group\"\n ]\n )}\n >\n <>\n {isVariant ? (\n <VariantRevertDropdown\n fieldDataName={fieldMetadata.fieldPathWithIndex}\n fieldMetadata={fieldMetadata}\n variantStatus={fieldVariantStatus}\n isOpen={isOpenVariantRevert}\n closeDropdown={closeVariantDropdown}\n invertTooltipPosition={invertTooltipPosition}\n toggleVariantDropdown={toggleVariantDropdown}\n />\n ) : null}\n {isMultiple && !isWholeMultipleField ? (\n <>\n <button\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar__move-left-button\"\n className={\n multipleFieldToolbarButtonClasses\n }\n data-tooltip={\n direction === \"vertical\"\n ? \"Move up\"\n : \"Move left\"\n }\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n handleMoveInstance(\n fieldMetadata,\n \"previous\"\n );\n }}\n disabled={disableMoveLeft}\n >\n <MoveLeftIcon\n className={classNames({\n \"visual-builder__rotate--90\":\n direction === \"vertical\",\n [visualBuilderStyles()[\n \"visual-builder__rotate--90\"\n ]]: direction === \"vertical\",\n })}\n disabled={disableMoveLeft}\n />\n </button>\n\n <button\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar__move-right-button\"\n className={\n multipleFieldToolbarButtonClasses\n }\n data-tooltip={\n direction === \"vertical\"\n ? \"Move down\"\n : \"Move right\"\n }\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n handleMoveInstance(\n fieldMetadata,\n \"next\"\n );\n }}\n disabled={disableMoveRight}\n >\n <MoveRightIcon\n className={classNames({\n \"visual-builder__rotate--90\":\n direction === \"vertical\",\n [visualBuilderStyles()[\n \"visual-builder__rotate--90\"\n ]]: direction === \"vertical\",\n })}\n disabled={disableMoveRight}\n />\n </button>\n\n {isModalEditable ? editButton : null}\n {formButton}\n {isReplaceAllowed ? replaceButton : null}\n\n <button\n data-testid=\"visual-builder__focused-toolbar__multiple-field-toolbar__delete-button\"\n className={\n multipleFieldToolbarButtonClasses\n }\n data-tooltip={\"Delete\"}\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n handleDeleteInstance(fieldMetadata);\n }}\n >\n <DeleteIcon />\n </button>\n </>\n ) : (\n <>\n {isModalEditable ? editButton : null}\n {isReplaceAllowed ? replaceButton : null}\n {formButton}\n {fieldSchema ? (\n <CommentIcon\n fieldMetadata={fieldMetadata}\n fieldSchema={fieldSchema}\n invertTooltipPosition={\n invertTooltipPosition\n }\n />\n ) : null}\n </>\n )}\n </>\n </div>\n </div>\n </div>\n );\n}\n\nexport default FieldToolbarComponent;\n"],"mappings":";;;AACA,OAAO,0BAA0B;AACjC;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,OACG;AACP,SAAS,oBAAoB;AAC7B;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,OAAO,8BAA8B;AACrC,SAAS,qBAAsC;AAC/C,SAAS,sCAAsC;AAC/C;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AACP,SAAS,kBAAkB;AAC3B,OAAO,gBAAgB;AACvB,SAAS,2BAA2B;AACpC,OAAO,iBAAiB;AACxB,SAAgB,WAAW,gBAAgB;AAC3C,SAAS,sBAAsB;AAC/B,SAAS,uBAAuB;AAGhC,SAAS,gBAAgB;AACzB,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B;AAAA,EACI;AAAA,EAEA;AAAA,EAEA;AAAA,OACG;AAsKK,SAgLgB,UAhLhB,KAmEJ,YAnEI;AA/JZ,IAAM,0BAA0B;AAOhC,SAAS,mBAAmB,eAAyB;AAEjD,4BAA0B;AAAA,IACtB,+BAA+B;AAAA,IAC/B;AAAA,MACI;AAAA,IACJ;AAAA,EACJ;AACJ;AAEA,SAAS,uBAAuB,eAAyB;AACrD,QAAM,qBACF,cAAc,sBAAsB,QAAQ,MAC5C,cAAc,uBACV,cAAc,sBAAsB,eAAe;AAC3D,QAAM,YAAY,qBACZ,cAAc,SAAS,qBACvB,cAAc;AAEpB,4BAA0B;AAAA,IACtB,+BAA+B;AAAA,IAC/B;AAAA,MACI,WAAW,cAAc;AAAA,MACzB,kBAAkB,cAAc;AAAA,MAChC,QAAQ,cAAc;AAAA,MACtB,WAAW,cAAc;AAAA,MACzB,oBAAoB,cAAc;AAAA,MAClC;AAAA,IACJ;AAAA,EACJ;AACJ;AAEA,SAAS,WAAW,eAAyB;AACzC,4BAA0B;AAAA,IACtB,+BAA+B;AAAA,IAC/B,EAAE,cAAc;AAAA,EACpB;AACJ;AAEA,SAAS,qBAAqB,cAA6C;AACvE,QAAM,EAAE,iBAAiB,eAAe,SAAS,IAAI;AACrD,4BACM,KAAK,+BAA+B,aAAa;AAAA,IAC/C;AAAA,IACA;AAAA,EACJ,CAAC,EACA,KAAK,MAAM;AACR,8BAA0B;AAAA,MACtB,+BAA+B;AAAA,MAC/B;AAAA,QACI,cAAc,gBAAgB,eAAe;AAAA,MACjD;AAAA,IACJ;AAAA,EACJ,CAAC;AACT;AAEA,SAAS,sBACL,OACkB;AAClB,QAAM,EAAE,aAAa,IAAI;AACzB,QAAM,EAAE,eAAe,iBAAiB,cAAc,IAAI;AAE1D,QAAM,aACF,eAAe,uBAAuB,eAAe,mBACrD;AACJ,QAAM,YAAY,qBAAqB,eAAe,UAAU;AAChE,QAAM,YAAY,CAAC,CAAC,eAAe;AACnC,QAAM,CAAC,aAAa,cAAc,IAAI;AAAA,IAClC;AAAA,EACJ;AACA,QAAM,CAAC,oBAAoB,qBAAqB,IAC5C,SAAyB,mBAAmB;AAChD,QAAM,CAAC,qBAAqB,sBAAsB,IAC9C,SAAkB,KAAK;AAE3B,MAAI,kBAAkB;AACtB,MAAI,mBAAmB;AACvB,MAAI,aAAa;AACjB,MAAI,OAAO;AACX,MAAI,YAAY;AAChB,MAAI,uBAAuB;AAE3B,MAAI,aAAa;AACb,UAAM,EAAE,WAAW,IAAI,gBAAgB,aAAa;AAAA,MAChD,iBAAiB;AAAA,MACjB;AAAA,IACJ,CAAC;AAGD,QAAI,YAAY;AACZ,aAAO;AAAA,IACX;AAEA,gBAAY,aAAa,WAAW;AACpC,sBAAkB,6BAA6B,SAAS,SAAS;AACjE,uBAAmB,uBAAuB,SAAS,SAAS;AAE5D,WAAO,WAAW,SAAS;AAE3B,iBAAa,YAAY,YAAY;AACrC,QAAI,cAAc,cAAc;AAC5B,mBAAc,YACT,eAAe;AASxB,2BACI,eACC,cAAc,uBACX,cAAc,SAAS,sBACvB,cAAc,uBAAuB,UAAU;AAEvD,QACI,wBAAwB,SAAS,SAAS,KAC1C,sBACF;AACE,aAAO;AAAA,IACX;AAAA,EACJ;AAEA,QAAM,wBACF,cAAc,sBAAsB,EAAE,OAAO;AAEjD,QAAM,aAAa,OACf;AAAA,IAAC;AAAA;AAAA,MACG,eAAY;AAAA,MACZ,WAAW;AAAA,QACP;AAAA,QACA,oBAAoB,EAAE,wBAAwB;AAAA,QAC9C,oBAAoB,EAAE,mCAAmC;AAAA,QACzD,oBAAoB,EAAE,8BAA8B;AAAA,QACpD,oBAAoB,EAAE,yBAAyB;AAAA,QAC/C;AAAA,UACI,mCAAmC;AAAA,UACnC,CAAC,oBAAoB,EAAE,iCAAiC,CAAC,GACrD;AAAA,QACR;AAAA,MACJ;AAAA,MACA,gBAAc;AAAA,MACd,SAAS,CAAC,MAAM;AAGZ,UAAE,eAAe;AACjB,UAAE,gBAAgB;AAClB,mBAAW,aAAa;AAAA,MAC5B;AAAA,MAEA,8BAAC,QAAK;AAAA;AAAA,EACV,IACA;AAEJ,QAAM,gBAAgB,YAClB;AAAA,IAAC;AAAA;AAAA,MACG,WAAW;AAAA,QACP;AAAA,QACA,oBAAoB,EAAE,wBAAwB;AAAA,QAC9C,oBAAoB,EAAE,mCAAmC;AAAA,QACzD,oBAAoB,EAAE,yBAAyB;AAAA,QAC/C;AAAA,UACI,mCAAmC;AAAA,UACnC,CAAC,oBAAoB,EAAE,iCAAiC,CAAC,GACrD;AAAA,QACR;AAAA,MACJ;AAAA,MACA,gBAAc;AAAA,MACd,eAAa,0BAA0B,SAAS;AAAA,MAChD,SAAS,CAAC,MAAM;AACZ,UAAE,gBAAgB;AAClB,UAAE,eAAe;AACjB,YAAI,cAAc,cAAc,WAAW;AACvC,iCAAuB,aAAa;AACpC;AAAA,QACJ,WAAW,cAAc,cAAc,MAAM;AACzC,6BAAmB,aAAa;AAChC;AAAA,QACJ;AAAA,MACJ;AAAA,MAEA,8BAAC,oBAAiB;AAAA;AAAA,EACtB,IACA;AAEJ,QAAM,aACF;AAAA,IAAC;AAAA;AAAA,MACG,WAAW;AAAA,QACP;AAAA,QACA,oBAAoB,EAAE,wBAAwB;AAAA,QAC9C,oBAAoB,EAAE,mCAAmC;AAAA,QACzD,oBAAoB,EAAE,yBAAyB;AAAA,QAC/C;AAAA,UACI,mCAAmC;AAAA,UACnC,CAAC,oBAAoB,EAAE,iCAAiC,CAAC,GACrD;AAAA,QACR;AAAA,MACJ;AAAA,MACA,gBAAc;AAAA,MACd,eAAa;AAAA,MACb,SAAS,CAAC,MAAM;AACZ,6BAAqB,YAAY;AAAA,MACrC;AAAA,MAEA,8BAAC,YAAS;AAAA;AAAA,EACd;AAGJ,QAAM,wBAAwB,MAAM;AAChC,2BAAuB,CAAC,mBAAmB;AAAA,EAC/C;AAEA,QAAM,uBAAuB,MAAM;AAC/B,2BAAuB,KAAK;AAAA,EAChC;AAEA,QAAM,gBACF;AAAA,IAAC;AAAA;AAAA,MACG,WAAW;AAAA,QACP;AAAA,QACA,oBAAoB,EAAE,wBAAwB;AAAA,QAC9C,oBAAoB,EAAE,mCAAmC;AAAA,QACzD,oBAAoB,EAAE,yBAAyB;AAAA,QAC/C,oBAAoB,EAAE,gCAAgC;AAAA,QACtD;AAAA,UACI,mCAAmC;AAAA,UACnC,CAAC,oBAAoB,EAAE,iCAAiC,CAAC,GACrD;AAAA,QACR;AAAA,MACJ;AAAA,MACA,gBAAc;AAAA,MACd,eAAa;AAAA,MACb,SAAS;AAAA,MAET;AAAA,4BAAC,eAAY;AAAA,QACb,oBAAC,aAAU,MAAM,qBAAqB;AAAA;AAAA;AAAA,EAC1C;AAGJ,QAAM,oBAAoB,eAAe,YAAY,qBAAqB;AAC1E,QAAM,iBAAiB,eAAe,uBAAuB;AAE7D,QAAM,kBAAkB,mBAAmB;AAC3C,QAAM,mBAAmB,mBAAmB,oBAAoB;AAEhE,YAAU,MAAM;AACZ,mBAAe,mBAAmB;AAC9B,YAAMA,eAAc,MAAM,eAAe;AAAA,QACrC,cAAc;AAAA,QACd,cAAc;AAAA,MAClB;AACA,UAAIA,cAAa;AACb,uBAAeA,YAAW;AAAA,MAC9B;AACA,YAAM,gBAAgB,MAAM,sBAAsB,aAAa;AAC/D,4BAAsB,iBAAiB,mBAAmB;AAAA,IAC9D;AACA,qBAAiB;AAAA,EACrB,GAAG,CAAC,aAAa,CAAC;AAElB,YAAU,MAAM;AACZ,UAAM,QAAQ,0BAA0B;AAAA,MACpC,+BAA+B;AAAA,MAC/B,CAAC,SAAqC;AAClC,YACI,KAAK,MAAM,SACX,cAAc,SAAS,oBACzB;AACE,gBAAM,YAAY;AAAA,QACtB;AAAA,MACJ;AAAA,IACJ;AACA,WAAO,MAAM;AACT,aAAO,WAAW;AAAA,IACtB;AAAA,EACJ,GAAG,CAAC,CAAC;AAEL,QAAM,oCAAoC;AAAA,IACtC;AAAA,IACA,oBAAoB,EAAE,wBAAwB;AAAA,IAC9C,oBAAoB,EAAE,mCAAmC;AAAA,IACzD,oBAAoB,EAAE,yBAAyB;AAAA,IAC/C;AAAA,MACI,mCAAmC;AAAA,MACnC,CAAC,oBAAoB,EAAE,iCAAiC,CAAC,GACrD;AAAA,IACR;AAAA,EACJ;AAEA,SACI;AAAA,IAAC;AAAA;AAAA,MACG,WAAW;AAAA,QACP;AAAA,QACA,oBAAoB,EAAE,yCAAyC;AAAA,MACnE;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACG,WAAW;AAAA,YACP;AAAA,YACA,oBAAoB,EAChB,yDACJ;AAAA,UACJ;AAAA,UACA,eAAY;AAAA,UAEZ;AAAA,YAAC;AAAA;AAAA,cACG,WAAW;AAAA,gBACP;AAAA,gBACA,oBAAoB,EAChB,+CACJ;AAAA,cACJ;AAAA,cAEA,2CACK;AAAA,4BACG;AAAA,kBAAC;AAAA;AAAA,oBACG,eAAe,cAAc;AAAA,oBAC7B;AAAA,oBACA,eAAe;AAAA,oBACf,QAAQ;AAAA,oBACR,eAAe;AAAA,oBACf;AAAA,oBACA;AAAA;AAAA,gBACJ,IACA;AAAA,gBACH,cAAc,CAAC,uBACZ,iCACI;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACG,eAAY;AAAA,sBACZ,WACI;AAAA,sBAEJ,gBACI,cAAc,aACR,YACA;AAAA,sBAEV,SAAS,CAAC,MAAM;AACZ,0BAAE,eAAe;AACjB,0BAAE,gBAAgB;AAClB;AAAA,0BACI;AAAA,0BACA;AAAA,wBACJ;AAAA,sBACJ;AAAA,sBACA,UAAU;AAAA,sBAEV;AAAA,wBAAC;AAAA;AAAA,0BACG,WAAW,WAAW;AAAA,4BAClB,8BACI,cAAc;AAAA,4BAClB,CAAC,oBAAoB,EACjB,4BACJ,CAAC,GAAG,cAAc;AAAA,0BACtB,CAAC;AAAA,0BACD,UAAU;AAAA;AAAA,sBACd;AAAA;AAAA,kBACJ;AAAA,kBAEA;AAAA,oBAAC;AAAA;AAAA,sBACG,eAAY;AAAA,sBACZ,WACI;AAAA,sBAEJ,gBACI,cAAc,aACR,cACA;AAAA,sBAEV,SAAS,CAAC,MAAM;AACZ,0BAAE,eAAe;AACjB,0BAAE,gBAAgB;AAClB;AAAA,0BACI;AAAA,0BACA;AAAA,wBACJ;AAAA,sBACJ;AAAA,sBACA,UAAU;AAAA,sBAEV;AAAA,wBAAC;AAAA;AAAA,0BACG,WAAW,WAAW;AAAA,4BAClB,8BACI,cAAc;AAAA,4BAClB,CAAC,oBAAoB,EACjB,4BACJ,CAAC,GAAG,cAAc;AAAA,0BACtB,CAAC;AAAA,0BACD,UAAU;AAAA;AAAA,sBACd;AAAA;AAAA,kBACJ;AAAA,kBAEC,kBAAkB,aAAa;AAAA,kBAC/B;AAAA,kBACA,mBAAmB,gBAAgB;AAAA,kBAEpC;AAAA,oBAAC;AAAA;AAAA,sBACG,eAAY;AAAA,sBACZ,WACI;AAAA,sBAEJ,gBAAc;AAAA,sBACd,SAAS,CAAC,MAAM;AACZ,0BAAE,eAAe;AACjB,0BAAE,gBAAgB;AAClB,6CAAqB,aAAa;AAAA,sBACtC;AAAA,sBAEA,8BAAC,cAAW;AAAA;AAAA,kBAChB;AAAA,mBACJ,IAEA,iCACK;AAAA,oCAAkB,aAAa;AAAA,kBAC/B,mBAAmB,gBAAgB;AAAA,kBACnC;AAAA,kBACA,cACG;AAAA,oBAAC;AAAA;AAAA,sBACG;AAAA,sBACA;AAAA,sBACA;AAAA;AAAA,kBAGJ,IACA;AAAA,mBACR;AAAA,iBAER;AAAA;AAAA,UACJ;AAAA;AAAA,MACJ;AAAA;AAAA,EACJ;AAER;AAEA,IAAO,uBAAQ;","names":["fieldSchema"]}
|
|
@@ -86,6 +86,7 @@ function EmptyBlock(props) {
|
|
|
86
86
|
),
|
|
87
87
|
onClick: () => sendAddInstanceEvent(),
|
|
88
88
|
type: "button",
|
|
89
|
+
"data-testid": "visual-builder__empty-block-add-button",
|
|
89
90
|
children: [
|
|
90
91
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("i", { className: "fas fa-plus" }),
|
|
91
92
|
" \xA0",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/components/emptyBlock.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { CslpData } from \"../../cslp/types/cslp.types\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { observeParentAndFocusNewInstance } from \"../utils/multipleElementAddButton\";\nimport { ISchemaFieldMap } from \"../utils/types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport React from \"preact/compat\";\n\ninterface EmptyBlockProps {\n details: {\n fieldMetadata: CslpData;\n fieldSchema: ISchemaFieldMap;\n };\n}\n\nexport function EmptyBlock(props: EmptyBlockProps): JSX.Element {\n const { details } = props;\n\n const blockParentName = details.fieldSchema.display_name;\n\n async function sendAddInstanceEvent() {\n await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.ADD_INSTANCE,\n {\n fieldMetadata: details.fieldMetadata,\n index: 0,\n }\n );\n observeParentAndFocusNewInstance({\n parentCslp: details.fieldMetadata.cslpValue,\n index: 0,\n });\n }\n\n return (\n <div\n className={classNames(\n \"visual-builder__empty-block\",\n visualBuilderStyles()[\"visual-builder__empty-block\"]\n )}\n >\n <div\n className={classNames(\n \"visual-builder__empty-block-title\",\n visualBuilderStyles()[\"visual-builder__empty-block-title\"]\n )}\n >\n There are no {blockParentName.toLowerCase()} on this page yet. Click the button below to add one.\n </div>\n <button\n className={classNames(\n \"visual-builder__empty-block-add-button\",\n visualBuilderStyles()[\n \"visual-builder__empty-block-add-button\"\n ]\n )}\n onClick={() => sendAddInstanceEvent()}\n type=\"button\"\n >\n <i className=\"fas fa-plus\"></i> \n {blockParentName}\n </button>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAuB;AAEvB,2BAAoC;AACpC,sCAAqC;AACrC,sCAAiD;AAEjD,yBAA+C;AAoCnC;AA1BL,SAAS,WAAW,OAAqC;AAC5D,QAAM,EAAE,QAAQ,IAAI;AAEpB,QAAM,kBAAkB,QAAQ,YAAY;AAE5C,iBAAe,uBAAuB;AAClC,UAAM,gCAAAA,SAA0B;AAAA,MAC5B,kDAA+B;AAAA,MAC/B;AAAA,QACI,eAAe,QAAQ;AAAA,QACvB,OAAO;AAAA,MACX;AAAA,IACJ;AACA,0EAAiC;AAAA,MAC7B,YAAY,QAAQ,cAAc;AAAA,MAClC,OAAO;AAAA,IACX,CAAC;AAAA,EACL;AAEA,SACI;AAAA,IAAC;AAAA;AAAA,MACG,eAAW,kBAAAC;AAAA,QACP;AAAA,YACA,0CAAoB,EAAE,6BAA6B;AAAA,MACvD;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACG,eAAW,kBAAAA;AAAA,cACP;AAAA,kBACA,0CAAoB,EAAE,mCAAmC;AAAA,YAC7D;AAAA,YACH;AAAA;AAAA,cACiB,gBAAgB,YAAY;AAAA,cAAE;AAAA;AAAA;AAAA,QAChD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACG,eAAW,kBAAAA;AAAA,cACP;AAAA,kBACA,0CAAoB,EAChB,wCACJ;AAAA,YACJ;AAAA,YACA,SAAS,MAAM,qBAAqB;AAAA,YACpC,MAAK;AAAA,
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/components/emptyBlock.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { CslpData } from \"../../cslp/types/cslp.types\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { observeParentAndFocusNewInstance } from \"../utils/multipleElementAddButton\";\nimport { ISchemaFieldMap } from \"../utils/types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport React from \"preact/compat\";\n\ninterface EmptyBlockProps {\n details: {\n fieldMetadata: CslpData;\n fieldSchema: ISchemaFieldMap;\n };\n}\n\nexport function EmptyBlock(props: EmptyBlockProps): JSX.Element {\n const { details } = props;\n\n const blockParentName = details.fieldSchema.display_name;\n\n async function sendAddInstanceEvent() {\n await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.ADD_INSTANCE,\n {\n fieldMetadata: details.fieldMetadata,\n index: 0,\n }\n );\n observeParentAndFocusNewInstance({\n parentCslp: details.fieldMetadata.cslpValue,\n index: 0,\n });\n }\n\n return (\n <div\n className={classNames(\n \"visual-builder__empty-block\",\n visualBuilderStyles()[\"visual-builder__empty-block\"]\n )}\n >\n <div\n className={classNames(\n \"visual-builder__empty-block-title\",\n visualBuilderStyles()[\"visual-builder__empty-block-title\"]\n )}\n >\n There are no {blockParentName.toLowerCase()} on this page yet. Click the button below to add one.\n </div>\n <button\n className={classNames(\n \"visual-builder__empty-block-add-button\",\n visualBuilderStyles()[\n \"visual-builder__empty-block-add-button\"\n ]\n )}\n onClick={() => sendAddInstanceEvent()}\n type=\"button\"\n data-testid=\"visual-builder__empty-block-add-button\"\n >\n <i className=\"fas fa-plus\"></i> \n {blockParentName}\n </button>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAuB;AAEvB,2BAAoC;AACpC,sCAAqC;AACrC,sCAAiD;AAEjD,yBAA+C;AAoCnC;AA1BL,SAAS,WAAW,OAAqC;AAC5D,QAAM,EAAE,QAAQ,IAAI;AAEpB,QAAM,kBAAkB,QAAQ,YAAY;AAE5C,iBAAe,uBAAuB;AAClC,UAAM,gCAAAA,SAA0B;AAAA,MAC5B,kDAA+B;AAAA,MAC/B;AAAA,QACI,eAAe,QAAQ;AAAA,QACvB,OAAO;AAAA,MACX;AAAA,IACJ;AACA,0EAAiC;AAAA,MAC7B,YAAY,QAAQ,cAAc;AAAA,MAClC,OAAO;AAAA,IACX,CAAC;AAAA,EACL;AAEA,SACI;AAAA,IAAC;AAAA;AAAA,MACG,eAAW,kBAAAC;AAAA,QACP;AAAA,YACA,0CAAoB,EAAE,6BAA6B;AAAA,MACvD;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACG,eAAW,kBAAAA;AAAA,cACP;AAAA,kBACA,0CAAoB,EAAE,mCAAmC;AAAA,YAC7D;AAAA,YACH;AAAA;AAAA,cACiB,gBAAgB,YAAY;AAAA,cAAE;AAAA;AAAA;AAAA,QAChD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACG,eAAW,kBAAAA;AAAA,cACP;AAAA,kBACA,0CAAoB,EAChB,wCACJ;AAAA,YACJ;AAAA,YACA,SAAS,MAAM,qBAAqB;AAAA,YACpC,MAAK;AAAA,YACL,eAAY;AAAA,YAEZ;AAAA,0DAAC,OAAE,WAAU,eAAc;AAAA,cAAI;AAAA,cAC9B;AAAA;AAAA;AAAA,QACL;AAAA;AAAA;AAAA,EACJ;AAER;","names":["visualBuilderPostMessage","classNames"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/visualBuilder/components/emptyBlock.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { CslpData } from \"../../cslp/types/cslp.types\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { observeParentAndFocusNewInstance } from \"../utils/multipleElementAddButton\";\nimport { ISchemaFieldMap } from \"../utils/types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport React from \"preact/compat\";\n\ninterface EmptyBlockProps {\n details: {\n fieldMetadata: CslpData;\n fieldSchema: ISchemaFieldMap;\n };\n}\n\nexport function EmptyBlock(props: EmptyBlockProps): JSX.Element {\n const { details } = props;\n\n const blockParentName = details.fieldSchema.display_name;\n\n async function sendAddInstanceEvent() {\n await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.ADD_INSTANCE,\n {\n fieldMetadata: details.fieldMetadata,\n index: 0,\n }\n );\n observeParentAndFocusNewInstance({\n parentCslp: details.fieldMetadata.cslpValue,\n index: 0,\n });\n }\n\n return (\n <div\n className={classNames(\n \"visual-builder__empty-block\",\n visualBuilderStyles()[\"visual-builder__empty-block\"]\n )}\n >\n <div\n className={classNames(\n \"visual-builder__empty-block-title\",\n visualBuilderStyles()[\"visual-builder__empty-block-title\"]\n )}\n >\n There are no {blockParentName.toLowerCase()} on this page yet. Click the button below to add one.\n </div>\n <button\n className={classNames(\n \"visual-builder__empty-block-add-button\",\n visualBuilderStyles()[\n \"visual-builder__empty-block-add-button\"\n ]\n )}\n onClick={() => sendAddInstanceEvent()}\n type=\"button\"\n >\n <i className=\"fas fa-plus\"></i> \n {blockParentName}\n </button>\n </div>\n );\n}\n"],"mappings":";;;AAAA,OAAO,gBAAgB;AAEvB,SAAS,2BAA2B;AACpC,OAAO,8BAA8B;AACrC,SAAS,wCAAwC;AAEjD,SAAS,sCAAsC;AAoCnC,
|
|
1
|
+
{"version":3,"sources":["../../../../src/visualBuilder/components/emptyBlock.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { CslpData } from \"../../cslp/types/cslp.types\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { observeParentAndFocusNewInstance } from \"../utils/multipleElementAddButton\";\nimport { ISchemaFieldMap } from \"../utils/types/index.types\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport React from \"preact/compat\";\n\ninterface EmptyBlockProps {\n details: {\n fieldMetadata: CslpData;\n fieldSchema: ISchemaFieldMap;\n };\n}\n\nexport function EmptyBlock(props: EmptyBlockProps): JSX.Element {\n const { details } = props;\n\n const blockParentName = details.fieldSchema.display_name;\n\n async function sendAddInstanceEvent() {\n await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.ADD_INSTANCE,\n {\n fieldMetadata: details.fieldMetadata,\n index: 0,\n }\n );\n observeParentAndFocusNewInstance({\n parentCslp: details.fieldMetadata.cslpValue,\n index: 0,\n });\n }\n\n return (\n <div\n className={classNames(\n \"visual-builder__empty-block\",\n visualBuilderStyles()[\"visual-builder__empty-block\"]\n )}\n >\n <div\n className={classNames(\n \"visual-builder__empty-block-title\",\n visualBuilderStyles()[\"visual-builder__empty-block-title\"]\n )}\n >\n There are no {blockParentName.toLowerCase()} on this page yet. Click the button below to add one.\n </div>\n <button\n className={classNames(\n \"visual-builder__empty-block-add-button\",\n visualBuilderStyles()[\n \"visual-builder__empty-block-add-button\"\n ]\n )}\n onClick={() => sendAddInstanceEvent()}\n type=\"button\"\n data-testid=\"visual-builder__empty-block-add-button\"\n >\n <i className=\"fas fa-plus\"></i> \n {blockParentName}\n </button>\n </div>\n );\n}\n"],"mappings":";;;AAAA,OAAO,gBAAgB;AAEvB,SAAS,2BAA2B;AACpC,OAAO,8BAA8B;AACrC,SAAS,wCAAwC;AAEjD,SAAS,sCAAsC;AAoCnC,SAmBI,KAnBJ;AA1BL,SAAS,WAAW,OAAqC;AAC5D,QAAM,EAAE,QAAQ,IAAI;AAEpB,QAAM,kBAAkB,QAAQ,YAAY;AAE5C,iBAAe,uBAAuB;AAClC,UAAM,0BAA0B;AAAA,MAC5B,+BAA+B;AAAA,MAC/B;AAAA,QACI,eAAe,QAAQ;AAAA,QACvB,OAAO;AAAA,MACX;AAAA,IACJ;AACA,qCAAiC;AAAA,MAC7B,YAAY,QAAQ,cAAc;AAAA,MAClC,OAAO;AAAA,IACX,CAAC;AAAA,EACL;AAEA,SACI;AAAA,IAAC;AAAA;AAAA,MACG,WAAW;AAAA,QACP;AAAA,QACA,oBAAoB,EAAE,6BAA6B;AAAA,MACvD;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACG,WAAW;AAAA,cACP;AAAA,cACA,oBAAoB,EAAE,mCAAmC;AAAA,YAC7D;AAAA,YACH;AAAA;AAAA,cACiB,gBAAgB,YAAY;AAAA,cAAE;AAAA;AAAA;AAAA,QAChD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACG,WAAW;AAAA,cACP;AAAA,cACA,oBAAoB,EAChB,wCACJ;AAAA,YACJ;AAAA,YACA,SAAS,MAAM,qBAAqB;AAAA,YACpC,MAAK;AAAA,YACL,eAAY;AAAA,YAEZ;AAAA,kCAAC,OAAE,WAAU,eAAc;AAAA,cAAI;AAAA,cAC9B;AAAA;AAAA;AAAA,QACL;AAAA;AAAA;AAAA,EACJ;AAER;","names":[]}
|
|
@@ -39,7 +39,7 @@ function VariantIcon() {
|
|
|
39
39
|
"fill-rule": "evenodd",
|
|
40
40
|
"clip-rule": "evenodd",
|
|
41
41
|
d: "M4.41131 0.157165C4.34585 0.0589769 4.23565 0 4.11765 0C3.99964 0 3.88944 0.0589769 3.82398 0.157165L0.0592764 5.80422C-0.0197588 5.92278 -0.0197588 6.07722 0.0592764 6.19578L3.82398 11.8428C3.88944 11.941 3.99964 12 4.11765 12C4.23565 12 4.34585 11.941 4.41131 11.8428L6 9.4598L7.58869 11.8428C7.65415 11.941 7.76435 12 7.88235 12C8.00036 12 8.11056 11.941 8.17602 11.8428L11.9407 6.19578C12.0198 6.07722 12.0198 5.92278 11.9407 5.80422L8.17602 0.157165C8.11056 0.0589769 8.00036 0 7.88235 0C7.76435 0 7.65415 0.0589769 7.58869 0.157165L6 2.5402L4.41131 0.157165ZM5.57582 3.17647L4.11765 0.989215L0.777124 6L4.11765 11.0108L5.57582 8.82353L3.82398 6.19578C3.74495 6.07722 3.74495 5.92278 3.82398 5.80422L5.57582 3.17647ZM6 8.18726L4.54183 6L6 3.81274L7.45817 6L6 8.18726ZM6.42418 8.82353L8.17602 6.19578C8.25505 6.07722 8.25505 5.92278 8.17602 5.80422L6.42418 3.17647L7.88235 0.989215L11.2229 6L7.88235 11.0108L6.42418 8.82353Z",
|
|
42
|
-
fill: "
|
|
42
|
+
fill: "currentColor"
|
|
43
43
|
}
|
|
44
44
|
)
|
|
45
45
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/visualBuilder/components/icons/variant.tsx"],"sourcesContent":["import React from \"preact/compat\";\n\nexport function VariantIcon(): JSX.Element {\n return (\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.41131 0.157165C4.34585 0.0589769 4.23565 0 4.11765 0C3.99964 0 3.88944 0.0589769 3.82398 0.157165L0.0592764 5.80422C-0.0197588 5.92278 -0.0197588 6.07722 0.0592764 6.19578L3.82398 11.8428C3.88944 11.941 3.99964 12 4.11765 12C4.23565 12 4.34585 11.941 4.41131 11.8428L6 9.4598L7.58869 11.8428C7.65415 11.941 7.76435 12 7.88235 12C8.00036 12 8.11056 11.941 8.17602 11.8428L11.9407 6.19578C12.0198 6.07722 12.0198 5.92278 11.9407 5.80422L8.17602 0.157165C8.11056 0.0589769 8.00036 0 7.88235 0C7.76435 0 7.65415 0.0589769 7.58869 0.157165L6 2.5402L4.41131 0.157165ZM5.57582 3.17647L4.11765 0.989215L0.777124 6L4.11765 11.0108L5.57582 8.82353L3.82398 6.19578C3.74495 6.07722 3.74495 5.92278 3.82398 5.80422L5.57582 3.17647ZM6 8.18726L4.54183 6L6 3.81274L7.45817 6L6 8.18726ZM6.42418 8.82353L8.17602 6.19578C8.25505 6.07722 8.25505 5.92278 8.17602 5.80422L6.42418 3.17647L7.88235 0.989215L11.2229 6L7.88235 11.0108L6.42418 8.82353Z\"\n fill=\"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/visualBuilder/components/icons/variant.tsx"],"sourcesContent":["import React from \"preact/compat\";\n\nexport function VariantIcon(): JSX.Element {\n return (\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.41131 0.157165C4.34585 0.0589769 4.23565 0 4.11765 0C3.99964 0 3.88944 0.0589769 3.82398 0.157165L0.0592764 5.80422C-0.0197588 5.92278 -0.0197588 6.07722 0.0592764 6.19578L3.82398 11.8428C3.88944 11.941 3.99964 12 4.11765 12C4.23565 12 4.34585 11.941 4.41131 11.8428L6 9.4598L7.58869 11.8428C7.65415 11.941 7.76435 12 7.88235 12C8.00036 12 8.11056 11.941 8.17602 11.8428L11.9407 6.19578C12.0198 6.07722 12.0198 5.92278 11.9407 5.80422L8.17602 0.157165C8.11056 0.0589769 8.00036 0 7.88235 0C7.76435 0 7.65415 0.0589769 7.58869 0.157165L6 2.5402L4.41131 0.157165ZM5.57582 3.17647L4.11765 0.989215L0.777124 6L4.11765 11.0108L5.57582 8.82353L3.82398 6.19578C3.74495 6.07722 3.74495 5.92278 3.82398 5.80422L5.57582 3.17647ZM6 8.18726L4.54183 6L6 3.81274L7.45817 6L6 8.18726ZM6.42418 8.82353L8.17602 6.19578C8.25505 6.07722 8.25505 5.92278 8.17602 5.80422L6.42418 3.17647L7.88235 0.989215L11.2229 6L7.88235 11.0108L6.42418 8.82353Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAWY;AATL,SAAS,cAA2B;AACvC,SACI;AAAA,IAAC;AAAA;AAAA,MACG,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,OAAM;AAAA,MAEN;AAAA,QAAC;AAAA;AAAA,UACG,aAAU;AAAA,UACV,aAAU;AAAA,UACV,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACT;AAAA;AAAA,EACJ;AAER;","names":[]}
|
|
@@ -17,7 +17,7 @@ function VariantIcon() {
|
|
|
17
17
|
"fill-rule": "evenodd",
|
|
18
18
|
"clip-rule": "evenodd",
|
|
19
19
|
d: "M4.41131 0.157165C4.34585 0.0589769 4.23565 0 4.11765 0C3.99964 0 3.88944 0.0589769 3.82398 0.157165L0.0592764 5.80422C-0.0197588 5.92278 -0.0197588 6.07722 0.0592764 6.19578L3.82398 11.8428C3.88944 11.941 3.99964 12 4.11765 12C4.23565 12 4.34585 11.941 4.41131 11.8428L6 9.4598L7.58869 11.8428C7.65415 11.941 7.76435 12 7.88235 12C8.00036 12 8.11056 11.941 8.17602 11.8428L11.9407 6.19578C12.0198 6.07722 12.0198 5.92278 11.9407 5.80422L8.17602 0.157165C8.11056 0.0589769 8.00036 0 7.88235 0C7.76435 0 7.65415 0.0589769 7.58869 0.157165L6 2.5402L4.41131 0.157165ZM5.57582 3.17647L4.11765 0.989215L0.777124 6L4.11765 11.0108L5.57582 8.82353L3.82398 6.19578C3.74495 6.07722 3.74495 5.92278 3.82398 5.80422L5.57582 3.17647ZM6 8.18726L4.54183 6L6 3.81274L7.45817 6L6 8.18726ZM6.42418 8.82353L8.17602 6.19578C8.25505 6.07722 8.25505 5.92278 8.17602 5.80422L6.42418 3.17647L7.88235 0.989215L11.2229 6L7.88235 11.0108L6.42418 8.82353Z",
|
|
20
|
-
fill: "
|
|
20
|
+
fill: "currentColor"
|
|
21
21
|
}
|
|
22
22
|
)
|
|
23
23
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/visualBuilder/components/icons/variant.tsx"],"sourcesContent":["import React from \"preact/compat\";\n\nexport function VariantIcon(): JSX.Element {\n return (\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.41131 0.157165C4.34585 0.0589769 4.23565 0 4.11765 0C3.99964 0 3.88944 0.0589769 3.82398 0.157165L0.0592764 5.80422C-0.0197588 5.92278 -0.0197588 6.07722 0.0592764 6.19578L3.82398 11.8428C3.88944 11.941 3.99964 12 4.11765 12C4.23565 12 4.34585 11.941 4.41131 11.8428L6 9.4598L7.58869 11.8428C7.65415 11.941 7.76435 12 7.88235 12C8.00036 12 8.11056 11.941 8.17602 11.8428L11.9407 6.19578C12.0198 6.07722 12.0198 5.92278 11.9407 5.80422L8.17602 0.157165C8.11056 0.0589769 8.00036 0 7.88235 0C7.76435 0 7.65415 0.0589769 7.58869 0.157165L6 2.5402L4.41131 0.157165ZM5.57582 3.17647L4.11765 0.989215L0.777124 6L4.11765 11.0108L5.57582 8.82353L3.82398 6.19578C3.74495 6.07722 3.74495 5.92278 3.82398 5.80422L5.57582 3.17647ZM6 8.18726L4.54183 6L6 3.81274L7.45817 6L6 8.18726ZM6.42418 8.82353L8.17602 6.19578C8.25505 6.07722 8.25505 5.92278 8.17602 5.80422L6.42418 3.17647L7.88235 0.989215L11.2229 6L7.88235 11.0108L6.42418 8.82353Z\"\n fill=\"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/visualBuilder/components/icons/variant.tsx"],"sourcesContent":["import React from \"preact/compat\";\n\nexport function VariantIcon(): JSX.Element {\n return (\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.41131 0.157165C4.34585 0.0589769 4.23565 0 4.11765 0C3.99964 0 3.88944 0.0589769 3.82398 0.157165L0.0592764 5.80422C-0.0197588 5.92278 -0.0197588 6.07722 0.0592764 6.19578L3.82398 11.8428C3.88944 11.941 3.99964 12 4.11765 12C4.23565 12 4.34585 11.941 4.41131 11.8428L6 9.4598L7.58869 11.8428C7.65415 11.941 7.76435 12 7.88235 12C8.00036 12 8.11056 11.941 8.17602 11.8428L11.9407 6.19578C12.0198 6.07722 12.0198 5.92278 11.9407 5.80422L8.17602 0.157165C8.11056 0.0589769 8.00036 0 7.88235 0C7.76435 0 7.65415 0.0589769 7.58869 0.157165L6 2.5402L4.41131 0.157165ZM5.57582 3.17647L4.11765 0.989215L0.777124 6L4.11765 11.0108L5.57582 8.82353L3.82398 6.19578C3.74495 6.07722 3.74495 5.92278 3.82398 5.80422L5.57582 3.17647ZM6 8.18726L4.54183 6L6 3.81274L7.45817 6L6 8.18726ZM6.42418 8.82353L8.17602 6.19578C8.25505 6.07722 8.25505 5.92278 8.17602 5.80422L6.42418 3.17647L7.88235 0.989215L11.2229 6L7.88235 11.0108L6.42418 8.82353Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\n"],"mappings":";;;AAWY;AATL,SAAS,cAA2B;AACvC,SACI;AAAA,IAAC;AAAA;AAAA,MACG,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,OAAM;AAAA,MAEN;AAAA,QAAC;AAAA;AAAA,UACG,aAAU;AAAA,UACV,aAAU;AAAA,UACV,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACT;AAAA;AAAA,EACJ;AAER;","names":[]}
|
|
@@ -61,6 +61,7 @@ var import_updateFocussedState = require("./utils/updateFocussedState.cjs");
|
|
|
61
61
|
var import_useHighlightCommentIcon = require("./eventManager/useHighlightCommentIcon.cjs");
|
|
62
62
|
var import_generateHighlightedComment = require("./generators/generateHighlightedComment.cjs");
|
|
63
63
|
var import_useRecalculateVariantDataCSLPValues = require("./eventManager/useRecalculateVariantDataCSLPValues.cjs");
|
|
64
|
+
var import__ = require("../index.cjs");
|
|
64
65
|
var _VisualBuilder = class _VisualBuilder {
|
|
65
66
|
constructor() {
|
|
66
67
|
this.customCursor = null;
|
|
@@ -134,7 +135,7 @@ var _VisualBuilder = class _VisualBuilder {
|
|
|
134
135
|
);
|
|
135
136
|
const emptyBlockParents = Array.from(
|
|
136
137
|
document.querySelectorAll(
|
|
137
|
-
|
|
138
|
+
`.${import__.VB_EmptyBlockParentClass}`
|
|
138
139
|
)
|
|
139
140
|
);
|
|
140
141
|
const previousEmptyBlockParents = _VisualBuilder.VisualBuilderGlobalState.value.previousEmptyBlockParents;
|