npm - @contentstack/live-preview-utils - Versions diffs - 3.1.0 → 3.1.2 - Mend

@contentstack/live-preview-utils 3.1.0 → 3.1.2

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 (178) hide show

package/dist/modern/visualBuilder/components/FieldToolbar.js.map CHANGED Viewed

	@@ -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 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":"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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 isVariant?: boolean;\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, isVariant: isVariantOrParentOfVariant } = props;\n const { fieldMetadata, editableElement: targetElement } = eventDetails;\n\n const parentPath =\n fieldMetadata?.multipleFieldMetadata?.parentDetails?.parentCslpValue \|\|\n \"\";\n const isVariant = !!fieldMetadata?.variant \|\| isVariantOrParentOfVariant;\n const direction = getChildrenDirection(targetElement, parentPath);\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 // !isVariant\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":"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","names":["fieldSchema"]}

package/dist/modern/visualBuilder/components/emptyBlock.cjs CHANGED Viewed

@@ -86,6 +86,7 @@ function EmptyBlock(props) {
             ),
             onClick: () => sendAddInstanceEvent(),
             type: "button",
+            "data-testid": "visual-builder__empty-block-add-button",
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)("i", { className: "fas fa-plus" }),
               " \xA0",

package/dist/modern/visualBuilder/components/emptyBlock.cjs.map CHANGED Viewed

	@@ -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,~~YAEL~~;AAAA,0DAAC,OAAE,WAAU,eAAc;AAAA,cAAI;AAAA,cAC9B;AAAA;AAAA;AAAA,QACL;AAAA;AAAA;AAAA,EACJ;AAER;","names":["visualBuilderPostMessage","classNames"]}
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"]}

package/dist/modern/visualBuilder/components/emptyBlock.js CHANGED Viewed

@@ -54,6 +54,7 @@ function EmptyBlock(props) {
             ),
             onClick: () => sendAddInstanceEvent(),
             type: "button",
+            "data-testid": "visual-builder__empty-block-add-button",
             children: [
               /* @__PURE__ */ jsx("i", { className: "fas fa-plus" }),
               " \xA0",

package/dist/modern/visualBuilder/components/emptyBlock.js.map CHANGED Viewed

	@@ -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,~~SAkBI~~,~~KAlBJ~~;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,~~YAEL~~;AAAA,kCAAC,OAAE,WAAU,eAAc;AAAA,cAAI;AAAA,cAC9B;AAAA;AAAA;AAAA,QACL;AAAA;AAAA;AAAA,EACJ;AAER;","names":[]}
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":[]}

package/dist/modern/visualBuilder/components/startEditingButton.cjs CHANGED Viewed

@@ -30,37 +30,64 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/visualBuilder/components/startEditingButton.tsx
 var startEditingButton_exports = {};
 __export(startEditingButton_exports, {
-  default: () => startEditingButton_default
+  default: () => startEditingButton_default,
+  getEditButtonPosition: () => getEditButtonPosition
 });
 module.exports = __toCommonJS(startEditingButton_exports);
 var import_classnames = __toESM(require("classnames"), 1);
 var import_getVisualBuilderRedirectionUrl = __toESM(require("../utils/getVisualBuilderRedirectionUrl.cjs"), 1);
 var import_icons = require("./icons/index.cjs");
 var import_visualBuilder = require("../visualBuilder.style.cjs");
+var import_configManager = __toESM(require("../../configManager/configManager.cjs"), 1);
 var import_jsx_runtime = require("preact/jsx-runtime");
+var positionStyles = {
+  "bottom-right": (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__start-editing-btn__bottom-right"],
+  "bottom-left": (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__start-editing-btn__bottom-left"],
+  "top-left": (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__start-editing-btn__top-left"],
+  "top-right": (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__start-editing-btn__top-right"]
+};
+function getEditButtonPosition(position) {
+  const validPositions = ["bottom-left", "bottom-right", "top-left", "top-right"];
+  if (validPositions.includes(position)) {
+    return position;
+  } else {
+    return "bottom-right";
+  }
+}
 function StartEditingButtonComponent() {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  const config = import_configManager.default.get();
+  const enable = config.editInVisualBuilderButton.enable;
+  const position = config.editInVisualBuilderButton.position || "bottom-right";
+  function updateTargetUrl(e) {
+    const targetElement = e.target;
+    targetElement.setAttribute(
+      "href",
+      (0, import_getVisualBuilderRedirectionUrl.default)().toString()
+    );
+  }
+  return enable ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     "a",
     {
       href: (0, import_getVisualBuilderRedirectionUrl.default)().toString(),
       className: (0, import_classnames.default)(
         "visual-builder__start-editing-btn",
-        (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__start-editing-btn"]
+        (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__start-editing-btn"],
+        positionStyles[getEditButtonPosition(position)]
       ),
       "data-testid": "vcms-start-editing-btn",
-      onClick: (e) => {
-        const targetElement = e.target;
-        targetElement.setAttribute(
-          "href",
-          (0, import_getVisualBuilderRedirectionUrl.default)().toString()
-        );
-      },
+      onMouseEnter: (e) => updateTargetUrl(e),
+      onFocus: (e) => updateTargetUrl(e),
+      onClick: (e) => updateTargetUrl(e),
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.EditIcon, {}),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Start Editing" })
       ]
     }
-  );
+  ) : null;
 }
 var startEditingButton_default = StartEditingButtonComponent;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getEditButtonPosition
+});
 //# sourceMappingURL=startEditingButton.cjs.map

package/dist/modern/visualBuilder/components/startEditingButton.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/components/startEditingButton.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport getVisualBuilderRedirectionUrl from \"../utils/getVisualBuilderRedirectionUrl\";\nimport { EditIcon } from \"./icons\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport React from \"preact/compat\";\n\nfunction StartEditingButtonComponent(): JSX.Element {\n return (\n <a\n href={getVisualBuilderRedirectionUrl().toString()}\n className={classNames(\n \"visual-builder__start-editing-btn\",\n visualBuilderStyles()[\"visual-builder__start-editing-btn\"]\n )}\n data-testid=\"vcms-start-editing-btn\"\n ~~onClick~~={(e) => {\n ~~const targetElement~~ = e~~.target~~ as ~~HTMLAnchorElement;\n targetElement.setAttribute~~(\n ~~\"href\",\n getVisualBuilderRedirectionUrl~~()~~.toString~~()~~\n );\n~~ }}\n >\n <EditIcon />\n <span>Start Editing</span>\n </a>\n );\n}\n\nexport default StartEditingButtonComponent;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAuB;AACvB,4CAA2C;AAC3C,mBAAyB;AACzB,2BAAoC;~~AAK5B~~;~~AAFR~~,SAAS,~~8BAA2C~~;AAChD,~~SACI~~;AAAA,IAAC;AAAA;AAAA,MACG,UAAM,sCAAAA,SAA+B,EAAE,SAAS;AAAA,MAChD,eAAW,kBAAAC;AAAA,QACP;AAAA,YACA,0CAAoB,EAAE,mCAAmC;AAAA,~~MAC7D~~;AAAA,MACA,eAAY;AAAA,MACZ,~~SAAS~~,CAAC,MAAM~~;AACZ~~,~~cAAM,~~gBAAgB,~~EAAE~~;~~AACxB,sBAAc;~~AAAA,~~UACV;AAAA~~,~~cACA~~,~~sCAAAD~~,~~SAA+B~~,~~EAAE~~,~~SAAS~~;AAAA,~~QAC9C;AAAA~~,~~MACJ~~;AAAA,~~MAEA~~;AAAA,oDAAC,yBAAS;AAAA,QACV,4CAAC,UAAK,2BAAa;AAAA;AAAA;AAAA,EACvB;~~AAER~~;AAEA,IAAO,6BAAQ;","names":["getVisualBuilderRedirectionUrl","classNames"]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/components/startEditingButton.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport getVisualBuilderRedirectionUrl from \"../utils/getVisualBuilderRedirectionUrl\";\nimport { EditIcon } from \"./icons\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport React from \"preact/compat\";\nimport Config from \"../../configManager/configManager\";\nimport { IConfigEditInVisualBuilderButton } from \"../../types/types\";\n\n\ntype Position = NonNullable<IConfigEditInVisualBuilderButton['position']>;\n\nconst positionStyles: Record<Position, string> = {\n \"bottom-right\": visualBuilderStyles()['visual-builder__start-editing-btn__bottom-right'],\n \"bottom-left\": visualBuilderStyles()['visual-builder__start-editing-btn__bottom-left'],\n \"top-left\": visualBuilderStyles()['visual-builder__start-editing-btn__top-left'],\n \"top-right\": visualBuilderStyles()['visual-builder__start-editing-btn__top-right'],\n}\n\nexport function getEditButtonPosition(position: any): Position {\n const validPositions: Position[] = ['bottom-left', 'bottom-right', 'top-left', 'top-right']\n if(validPositions.includes(position)){\n return position\n } else {\n return \"bottom-right\"\n }\n}\n\nfunction StartEditingButtonComponent(): JSX.Element \| null {\n const config = Config.get()\n const enable = config.editInVisualBuilderButton.enable;\n const position = config.editInVisualBuilderButton.position \|\| \"bottom-right\";\n \n function updateTargetUrl(e: any){\n const targetElement = e.target as HTMLAnchorElement;\n targetElement.setAttribute(\n \"href\",\n getVisualBuilderRedirectionUrl().toString()\n );\n }\n\n return enable ? (\n <a\n href={getVisualBuilderRedirectionUrl().toString()}\n className={classNames(\n \"visual-builder__start-editing-btn\",\n visualBuilderStyles()[\"visual-builder__start-editing-btn\"],\n positionStyles[getEditButtonPosition(position)]\n )}\n data-testid=\"vcms-start-editing-btn\"\n onMouseEnter={(e) => updateTargetUrl(e)}\n onFocus={(e) => updateTargetUrl(e)}\n onClick={(e) => updateTargetUrl(e)}\n >\n <EditIcon />\n <span>Start Editing</span>\n </a>\n ) : null;\n}\n\nexport default StartEditingButtonComponent;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAuB;AACvB,4CAA2C;AAC3C,mBAAyB;AACzB,2BAAoC;AAEpC,2BAAmB;AAoCX;AA9BR,IAAM,iBAA2C;AAAA,EAC7C,oBAAgB,0CAAoB,EAAE,iDAAiD;AAAA,EACvF,mBAAe,0CAAoB,EAAE,gDAAgD;AAAA,EACrF,gBAAY,0CAAoB,EAAE,6CAA6C;AAAA,EAC/E,iBAAa,0CAAoB,EAAE,8CAA8C;AACrF;AAEO,SAAS,sBAAsB,UAAyB;AAC3D,QAAM,iBAA6B,CAAC,eAAe,gBAAgB,YAAY,WAAW;AAC1F,MAAG,eAAe,SAAS,QAAQ,GAAE;AACjC,WAAO;AAAA,EACX,OAAO;AACH,WAAO;AAAA,EACX;AACJ;AAEA,SAAS,8BAAkD;AACvD,QAAM,SAAS,qBAAAA,QAAO,IAAI;AAC1B,QAAM,SAAS,OAAO,0BAA0B;AAChD,QAAM,WAAW,OAAO,0BAA0B,YAAY;AAE9D,WAAS,gBAAgB,GAAO;AAC5B,UAAM,gBAAgB,EAAE;AACxB,kBAAc;AAAA,MACV;AAAA,UACA,sCAAAC,SAA+B,EAAE,SAAS;AAAA,IAC9C;AAAA,EACJ;AAEA,SAAO,SACH;AAAA,IAAC;AAAA;AAAA,MACG,UAAM,sCAAAA,SAA+B,EAAE,SAAS;AAAA,MAChD,eAAW,kBAAAC;AAAA,QACP;AAAA,YACA,0CAAoB,EAAE,mCAAmC;AAAA,QACzD,eAAe,sBAAsB,QAAQ,CAAC;AAAA,MAClD;AAAA,MACA,eAAY;AAAA,MACZ,cAAc,CAAC,MAAM,gBAAgB,CAAC;AAAA,MACtC,SAAS,CAAC,MAAM,gBAAgB,CAAC;AAAA,MACjC,SAAS,CAAC,MAAM,gBAAgB,CAAC;AAAA,MAEjC;AAAA,oDAAC,yBAAS;AAAA,QACV,4CAAC,UAAK,2BAAa;AAAA;AAAA;AAAA,EACvB,IACA;AACR;AAEA,IAAO,6BAAQ;","names":["Config","getVisualBuilderRedirectionUrl","classNames"]}

package/dist/modern/visualBuilder/components/startEditingButton.d.cts CHANGED Viewed

@@ -1,3 +1,7 @@
-declare function StartEditingButtonComponent(): JSX.Element;
+import { IConfigEditInVisualBuilderButton } from '../../types/types.cjs';
-export { StartEditingButtonComponent as default };
+type Position = NonNullable<IConfigEditInVisualBuilderButton['position']>;
+declare function getEditButtonPosition(position: any): Position;
+declare function StartEditingButtonComponent(): JSX.Element | null;
+export { StartEditingButtonComponent as default, getEditButtonPosition };

package/dist/modern/visualBuilder/components/startEditingButton.d.ts CHANGED Viewed

@@ -1,3 +1,7 @@
-declare function StartEditingButtonComponent(): JSX.Element;
+import { IConfigEditInVisualBuilderButton } from '../../types/types.js';
-export { StartEditingButtonComponent as default };
+type Position = NonNullable<IConfigEditInVisualBuilderButton['position']>;
+declare function getEditButtonPosition(position: any): Position;
+declare function StartEditingButtonComponent(): JSX.Element | null;
+export { StartEditingButtonComponent as default, getEditButtonPosition };

package/dist/modern/visualBuilder/components/startEditingButton.js CHANGED Viewed

@@ -5,33 +5,56 @@ import classNames from "classnames";
 import getVisualBuilderRedirectionUrl from "../utils/getVisualBuilderRedirectionUrl.js";
 import { EditIcon } from "./icons/index.js";
 import { visualBuilderStyles } from "../visualBuilder.style.js";
+import Config from "../../configManager/configManager.js";
 import { jsx, jsxs } from "preact/jsx-runtime";
+var positionStyles = {
+  "bottom-right": visualBuilderStyles()["visual-builder__start-editing-btn__bottom-right"],
+  "bottom-left": visualBuilderStyles()["visual-builder__start-editing-btn__bottom-left"],
+  "top-left": visualBuilderStyles()["visual-builder__start-editing-btn__top-left"],
+  "top-right": visualBuilderStyles()["visual-builder__start-editing-btn__top-right"]
+};
+function getEditButtonPosition(position) {
+  const validPositions = ["bottom-left", "bottom-right", "top-left", "top-right"];
+  if (validPositions.includes(position)) {
+    return position;
+  } else {
+    return "bottom-right";
+  }
+}
 function StartEditingButtonComponent() {
-  return /* @__PURE__ */ jsxs(
+  const config = Config.get();
+  const enable = config.editInVisualBuilderButton.enable;
+  const position = config.editInVisualBuilderButton.position || "bottom-right";
+  function updateTargetUrl(e) {
+    const targetElement = e.target;
+    targetElement.setAttribute(
+      "href",
+      getVisualBuilderRedirectionUrl().toString()
+    );
+  }
+  return enable ? /* @__PURE__ */ jsxs(
     "a",
     {
       href: getVisualBuilderRedirectionUrl().toString(),
       className: classNames(
         "visual-builder__start-editing-btn",
-        visualBuilderStyles()["visual-builder__start-editing-btn"]
+        visualBuilderStyles()["visual-builder__start-editing-btn"],
+        positionStyles[getEditButtonPosition(position)]
       ),
       "data-testid": "vcms-start-editing-btn",
-      onClick: (e) => {
-        const targetElement = e.target;
-        targetElement.setAttribute(
-          "href",
-          getVisualBuilderRedirectionUrl().toString()
-        );
-      },
+      onMouseEnter: (e) => updateTargetUrl(e),
+      onFocus: (e) => updateTargetUrl(e),
+      onClick: (e) => updateTargetUrl(e),
       children: [
         /* @__PURE__ */ jsx(EditIcon, {}),
         /* @__PURE__ */ jsx("span", { children: "Start Editing" })
       ]
     }
-  );
+  ) : null;
 }
 var startEditingButton_default = StartEditingButtonComponent;
 export {
-  startEditingButton_default as default
+  startEditingButton_default as default,
+  getEditButtonPosition
 };
 //# sourceMappingURL=startEditingButton.js.map

package/dist/modern/visualBuilder/components/startEditingButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/components/startEditingButton.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport getVisualBuilderRedirectionUrl from \"../utils/getVisualBuilderRedirectionUrl\";\nimport { EditIcon } from \"./icons\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport React from \"preact/compat\";\n\nfunction StartEditingButtonComponent(): JSX.Element {\n return (\n <a\n href={getVisualBuilderRedirectionUrl().toString()}\n className={classNames(\n \"visual-builder__start-editing-btn\",\n visualBuilderStyles()[\"visual-builder__start-editing-btn\"]\n )}\n data-testid=\"vcms-start-editing-btn\"\n ~~onClick~~={(e) => {\n ~~const targetElement~~ = e~~.target~~ as ~~HTMLAnchorElement;\n targetElement.setAttribute~~(\n ~~\"href\",\n getVisualBuilderRedirectionUrl~~()~~.toString~~()~~\n );\n~~ }}\n >\n <EditIcon />\n <span>Start Editing</span>\n </a>\n );\n}\n\nexport default StartEditingButtonComponent;\n"],"mappings":";;;AAAA,OAAO,gBAAgB;AACvB,OAAO,oCAAoC;AAC3C,SAAS,gBAAgB;AACzB,SAAS,2BAA2B;~~AAK5B~~,~~SAeI~~,~~KAfJ~~;~~AAFR~~,SAAS,~~8BAA2C~~;AAChD,~~SACI~~;AAAA,IAAC;AAAA;AAAA,MACG,MAAM,+BAA+B,EAAE,SAAS;AAAA,MAChD,WAAW;AAAA,QACP;AAAA,QACA,oBAAoB,EAAE,mCAAmC;AAAA,~~MAC7D~~;AAAA,MACA,eAAY;AAAA,MACZ,~~SAAS~~,CAAC,MAAM~~;AACZ~~,~~cAAM,~~gBAAgB,~~EAAE~~;~~AACxB,sBAAc;~~AAAA,~~UACV;AAAA~~,~~UACA,+BAA+B~~,~~EAAE~~,~~SAAS;AAAA~~,~~QAC9C~~;AAAA,~~MACJ~~;AAAA,~~MAEA~~;AAAA,4BAAC,YAAS;AAAA,QACV,oBAAC,UAAK,2BAAa;AAAA;AAAA;AAAA,EACvB;~~AAER~~;AAEA,IAAO,6BAAQ;","names":[]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/components/startEditingButton.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport getVisualBuilderRedirectionUrl from \"../utils/getVisualBuilderRedirectionUrl\";\nimport { EditIcon } from \"./icons\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport React from \"preact/compat\";\nimport Config from \"../../configManager/configManager\";\nimport { IConfigEditInVisualBuilderButton } from \"../../types/types\";\n\n\ntype Position = NonNullable<IConfigEditInVisualBuilderButton['position']>;\n\nconst positionStyles: Record<Position, string> = {\n \"bottom-right\": visualBuilderStyles()['visual-builder__start-editing-btn__bottom-right'],\n \"bottom-left\": visualBuilderStyles()['visual-builder__start-editing-btn__bottom-left'],\n \"top-left\": visualBuilderStyles()['visual-builder__start-editing-btn__top-left'],\n \"top-right\": visualBuilderStyles()['visual-builder__start-editing-btn__top-right'],\n}\n\nexport function getEditButtonPosition(position: any): Position {\n const validPositions: Position[] = ['bottom-left', 'bottom-right', 'top-left', 'top-right']\n if(validPositions.includes(position)){\n return position\n } else {\n return \"bottom-right\"\n }\n}\n\nfunction StartEditingButtonComponent(): JSX.Element \| null {\n const config = Config.get()\n const enable = config.editInVisualBuilderButton.enable;\n const position = config.editInVisualBuilderButton.position \|\| \"bottom-right\";\n \n function updateTargetUrl(e: any){\n const targetElement = e.target as HTMLAnchorElement;\n targetElement.setAttribute(\n \"href\",\n getVisualBuilderRedirectionUrl().toString()\n );\n }\n\n return enable ? (\n <a\n href={getVisualBuilderRedirectionUrl().toString()}\n className={classNames(\n \"visual-builder__start-editing-btn\",\n visualBuilderStyles()[\"visual-builder__start-editing-btn\"],\n positionStyles[getEditButtonPosition(position)]\n )}\n data-testid=\"vcms-start-editing-btn\"\n onMouseEnter={(e) => updateTargetUrl(e)}\n onFocus={(e) => updateTargetUrl(e)}\n onClick={(e) => updateTargetUrl(e)}\n >\n <EditIcon />\n <span>Start Editing</span>\n </a>\n ) : null;\n}\n\nexport default StartEditingButtonComponent;\n"],"mappings":";;;AAAA,OAAO,gBAAgB;AACvB,OAAO,oCAAoC;AAC3C,SAAS,gBAAgB;AACzB,SAAS,2BAA2B;AAEpC,OAAO,YAAY;AAoCX,SAYI,KAZJ;AA9BR,IAAM,iBAA2C;AAAA,EAC7C,gBAAgB,oBAAoB,EAAE,iDAAiD;AAAA,EACvF,eAAe,oBAAoB,EAAE,gDAAgD;AAAA,EACrF,YAAY,oBAAoB,EAAE,6CAA6C;AAAA,EAC/E,aAAa,oBAAoB,EAAE,8CAA8C;AACrF;AAEO,SAAS,sBAAsB,UAAyB;AAC3D,QAAM,iBAA6B,CAAC,eAAe,gBAAgB,YAAY,WAAW;AAC1F,MAAG,eAAe,SAAS,QAAQ,GAAE;AACjC,WAAO;AAAA,EACX,OAAO;AACH,WAAO;AAAA,EACX;AACJ;AAEA,SAAS,8BAAkD;AACvD,QAAM,SAAS,OAAO,IAAI;AAC1B,QAAM,SAAS,OAAO,0BAA0B;AAChD,QAAM,WAAW,OAAO,0BAA0B,YAAY;AAE9D,WAAS,gBAAgB,GAAO;AAC5B,UAAM,gBAAgB,EAAE;AACxB,kBAAc;AAAA,MACV;AAAA,MACA,+BAA+B,EAAE,SAAS;AAAA,IAC9C;AAAA,EACJ;AAEA,SAAO,SACH;AAAA,IAAC;AAAA;AAAA,MACG,MAAM,+BAA+B,EAAE,SAAS;AAAA,MAChD,WAAW;AAAA,QACP;AAAA,QACA,oBAAoB,EAAE,mCAAmC;AAAA,QACzD,eAAe,sBAAsB,QAAQ,CAAC;AAAA,MAClD;AAAA,MACA,eAAY;AAAA,MACZ,cAAc,CAAC,MAAM,gBAAgB,CAAC;AAAA,MACtC,SAAS,CAAC,MAAM,gBAAgB,CAAC;AAAA,MACjC,SAAS,CAAC,MAAM,gBAAgB,CAAC;AAAA,MAEjC;AAAA,4BAAC,YAAS;AAAA,QACV,oBAAC,UAAK,2BAAa;AAAA;AAAA;AAAA,EACvB,IACA;AACR;AAEA,IAAO,6BAAQ;","names":[]}

package/dist/modern/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.cjs CHANGED Viewed

@@ -57,8 +57,10 @@ function updateVariantClasses({
   const observers = [];
   const updateElementClasses = (element, dataCslp, observer) => {
     if (!dataCslp) return;
-    if (dataCslp.startsWith("v2:") && element.classList.contains("visual-builder__base-field")) {
-      element.classList.remove("visual-builder__base-field");
+    if (dataCslp.startsWith("v2:") && !element.classList.contains("visual-builder__variant-field")) {
+      if (element.classList.contains("visual-builder__base-field")) {
+        element.classList.remove("visual-builder__base-field");
+      }
       if (highlightVariantFields) {
         element.classList.add(
           (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__variant-field"],
@@ -80,12 +82,53 @@ function updateVariantClasses({
       );
       element.classList.add("visual-builder__disabled-variant-field");
     }
+    if (!observer) return;
     observer.disconnect();
     const index = observers.indexOf(observer);
     if (index > -1) {
       observers.splice(index, 1);
     }
   };
+  const addElementClasses = (element) => {
+    const dataCslp = element.getAttribute(import_constants.DATA_CSLP_ATTR_SELECTOR);
+    if (!dataCslp) {
+      element.childNodes.forEach((child) => {
+        if (child instanceof HTMLElement) {
+          addElementClasses(child);
+        }
+      });
+      return;
+    }
+    if (dataCslp.startsWith("v2:") && element.classList.contains("visual-builder__variant-field")) {
+      return;
+    }
+    if (dataCslp.startsWith("v2:") && !element.classList.contains("visual-builder__variant-field")) {
+      if (element.classList.contains("visual-builder__base-field")) {
+        element.classList.remove("visual-builder__base-field");
+      }
+      if (highlightVariantFields) {
+        element.classList.add(
+          (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__variant-field"],
+          "visual-builder__variant-field"
+        );
+      } else {
+        element.classList.add("visual-builder__variant-field");
+      }
+    } else if (!dataCslp.startsWith("v2:")) {
+      if (element.classList.contains("visual-builder__variant-field")) {
+        element.classList.remove(
+          (0, import_visualBuilder.visualBuilderStyles)()["visual-builder__variant-field"],
+          "visual-builder__variant-field"
+        );
+      }
+      element.classList.add("visual-builder__base-field");
+    }
+    element.childNodes.forEach((child) => {
+      if (child instanceof HTMLElement) {
+        addElementClasses(child);
+      }
+    });
+  };
   const elementsWithCslp = document.querySelectorAll(
     `[${import_constants.DATA_CSLP_ATTR_SELECTOR}]`
   );
@@ -93,7 +136,14 @@ function updateVariantClasses({
     const element = elementNode;
     const observer = new MutationObserver((mutations) => {
       mutations.forEach((mutation) => {
-        if (mutation.type === "attributes" && mutation.attributeName === import_constants.DATA_CSLP_ATTR_SELECTOR) {
+        if (mutation.type === "attributes" && mutation.attributeName === import_constants.DATA_CSLP_ATTR_SELECTOR || mutation.type === "childList") {
+          if (mutation.addedNodes.length > 0) {
+            mutation.addedNodes.forEach((node) => {
+              if (node instanceof HTMLElement) {
+                addElementClasses(node);
+              }
+            });
+          }
           const dataCslp = element.getAttribute(
             import_constants.DATA_CSLP_ATTR_SELECTOR
           );
@@ -102,7 +152,12 @@ function updateVariantClasses({
       });
     });
     observers.push(observer);
-    observer.observe(element, { attributes: true });
+    observer.observe(element, {
+      attributes: true,
+      childList: true,
+      // Observe direct children
+      subtree: true
+    });
   });
   setTimeout(() => {
     if (observers.length > 0) {

package/dist/modern/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport livePreviewPostMessage from \"../../livePreview/eventManager/livePreviewEventManager\";\nimport { LIVE_PREVIEW_POST_MESSAGE_EVENTS } from \"../../livePreview/eventManager/livePreviewEventManager.constant\";\nimport { DATA_CSLP_ATTR_SELECTOR } from \"../utils/constants\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\n\nconst VARIANT_UPDATE_DELAY_MS: Readonly<number> = 8000;\n\ntype OnAudienceModeVariantPatchUpdate = {\n highlightVariantFields: boolean;\n expectedCSLPValues: Record<\"variant\" \| \"base\", string>;\n};\n\n/*\n Registers a post message event listener for updating the variant / base classes in the live preview for audience mode.\n */\nexport function useRecalculateVariantDataCSLPValues(): void {\n livePreviewPostMessage?.on<OnAudienceModeVariantPatchUpdate>(\n LIVE_PREVIEW_POST_MESSAGE_EVENTS.VARIANT_PATCH,\n (event) => {\n if (VisualBuilder.VisualBuilderGlobalState.value.audienceMode) {\n updateVariantClasses(event.data);\n }\n }\n );\n}\nfunction updateVariantClasses({\n highlightVariantFields,\n expectedCSLPValues,\n}: OnAudienceModeVariantPatchUpdate): void {\n const variant = VisualBuilder.VisualBuilderGlobalState.value.variant;\n const observers: MutationObserver[] = [];\n\n // Helper function to update element classes\n const updateElementClasses = (\n element: HTMLElement,\n dataCslp: string,\n observer: MutationObserver\n ) => {\n if (!dataCslp) return;\n\n if (\n dataCslp.startsWith(\"v2:\") &&\n element.classList.contains(\"visual-builder__base-field\")\n ) {\n element.classList.remove(\"visual-builder__base-field\");\n if (highlightVariantFields) {\n element.classList.add(\n visualBuilderStyles()[\"visual-builder__variant-field\"],\n \"visual-builder__variant-field\"\n );\n } else {\n element.classList.add(\"visual-builder__variant-field\");\n }\n } else if (\n !dataCslp.startsWith(\"v2:\") &&\n element.classList.contains(\"visual-builder__variant-field\")\n ) {\n element.classList.remove(\n visualBuilderStyles()[\"visual-builder__variant-field\"],\n \"visual-builder__variant-field\"\n );\n element.classList.add(\"visual-builder__base-field\");\n } else if (\n dataCslp.startsWith(\"v2:\") &&\n variant &&\n !dataCslp.includes(variant) &&\n element.classList.contains(\"visual-builder__variant-field\")\n ) {\n element.classList.remove(\n visualBuilderStyles()[\"visual-builder__variant-field\"],\n \"visual-builder__variant-field\"\n );\n element.classList.add(\"visual-builder__disabled-variant-field\");\n }\n\n // Disconnect this observer after processing\n observer.disconnect();\n const index = observers.indexOf(observer);\n if (index > -1) {\n observers.splice(index, 1);\n }\n };\n\n // Create a separate observer for each element\n const elementsWithCslp = document.querySelectorAll(\n `[${DATA_CSLP_ATTR_SELECTOR}]`\n );\n\n elementsWithCslp.forEach((elementNode) => {\n const element = elementNode as HTMLElement;\n\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (\n mutation.type === \"attributes\" &&\n mutation.attributeName === DATA_CSLP_ATTR_SELECTOR\n ) {\n const dataCslp = element.getAttribute(\n DATA_CSLP_ATTR_SELECTOR\n );\n updateElementClasses(element, dataCslp \|\| \"\", observer);\n }\n });\n });\n\n observers.push(observer);\n observer.observe(element, { attributes: true });\n });\n\n setTimeout(() => {\n if (observers.length > 0) {\n observers.forEach((observer) => observer.disconnect());\n observers.length = 0;\n }\n }, VARIANT_UPDATE_DELAY_MS);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAA8B;AAC9B,qCAAmC;AACnC,IAAAA,kCAAiD;AACjD,uBAAwC;AACxC,2BAAoC;AAEpC,IAAM,0BAA4C;AAU3C,SAAS,sCAA4C;AACxD,iCAAAC,SAAwB;AAAA,IACpB,iEAAiC;AAAA,IACjC,CAAC,UAAU;AACP,UAAI,uBAAc,yBAAyB,MAAM,cAAc;AAC3D,6BAAqB,MAAM,IAAI;AAAA,MACnC;AAAA,IACJ;AAAA,EACJ;AACJ;AACA,SAAS,qBAAqB;AAAA,EAC1B;AAAA,EACA;AACJ,GAA2C;AACvC,QAAM,UAAU,uBAAc,yBAAyB,MAAM;AAC7D,QAAM,YAAgC,CAAC;AAGvC,QAAM,uBAAuB,CACzB,SACA,UACA,aACC;AACD,QAAI,CAAC,SAAU;AAEf,QACI,SAAS,WAAW,KAAK,KACzB,QAAQ,UAAU,SAAS,4BAA4B,GACzD;AACE,cAAQ,UAAU,OAAO,4BAA4B;AACrD,UAAI,wBAAwB;AACxB,gBAAQ,UAAU;AAAA,cACd,0CAAoB,EAAE,+BAA+B;AAAA,UACrD;AAAA,QACJ;AAAA,MACJ,OAAO;AACH,gBAAQ,UAAU,IAAI,+BAA+B;AAAA,MACzD;AAAA,IACJ,WACI,CAAC,SAAS,WAAW,KAAK,KAC1B,QAAQ,UAAU,SAAS,+BAA+B,GAC5D;AACE,cAAQ,UAAU;AAAA,YACd,0CAAoB,EAAE,+BAA+B;AAAA,QACrD;AAAA,MACJ;AACA,cAAQ,UAAU,IAAI,4BAA4B;AAAA,IACtD,WACI,SAAS,WAAW,KAAK,KACzB,WACA,CAAC,SAAS,SAAS,OAAO,KAC1B,QAAQ,UAAU,SAAS,+BAA+B,GAC5D;AACE,cAAQ,UAAU;AAAA,YACd,0CAAoB,EAAE,+BAA+B;AAAA,QACrD;AAAA,MACJ;AACA,cAAQ,UAAU,IAAI,wCAAwC;AAAA,IAClE;AAGA,aAAS,WAAW;AACpB,UAAM,QAAQ,UAAU,QAAQ,QAAQ;AACxC,QAAI,QAAQ,IAAI;AACZ,gBAAU,OAAO,OAAO,CAAC;AAAA,IAC7B;AAAA,EACJ;AAGA,QAAM,mBAAmB,SAAS;AAAA,IAC9B,IAAI,wCAAuB;AAAA,EAC/B;AAEA,mBAAiB,QAAQ,CAAC,gBAAgB;AACtC,UAAM,UAAU;AAEhB,UAAM,WAAW,IAAI,iBAAiB,CAAC,cAAc;AACjD,gBAAU,QAAQ,CAAC,aAAa;AAC5B,YACI,SAAS,SAAS,gBAClB,SAAS,kBAAkB,0CAC7B;AACE,gBAAM,WAAW,QAAQ;AAAA,YACrB;AAAA,UACJ;AACA,+BAAqB,SAAS,YAAY,IAAI,QAAQ;AAAA,QAC1D;AAAA,MACJ,CAAC;AAAA,IACL,CAAC;AAED,cAAU,KAAK,QAAQ;AACvB,aAAS,QAAQ,SAAS,EAAE,YAAY,KAAK,CAAC;AAAA,EAClD,CAAC;AAED,aAAW,MAAM;AACb,QAAI,UAAU,SAAS,GAAG;AACtB,gBAAU,QAAQ,CAAC,aAAa,SAAS,WAAW,CAAC;AACrD,gBAAU,SAAS;AAAA,IACvB;AAAA,EACJ,GAAG,uBAAuB;AAC9B;","names":["import_livePreviewEventManager","livePreviewPostMessage"]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport livePreviewPostMessage from \"../../livePreview/eventManager/livePreviewEventManager\";\nimport { LIVE_PREVIEW_POST_MESSAGE_EVENTS } from \"../../livePreview/eventManager/livePreviewEventManager.constant\";\nimport { DATA_CSLP_ATTR_SELECTOR } from \"../utils/constants\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\n\nconst VARIANT_UPDATE_DELAY_MS: Readonly<number> = 8000;\n\ntype OnAudienceModeVariantPatchUpdate = {\n highlightVariantFields: boolean;\n expectedCSLPValues: Record<\"variant\" \| \"base\", string>;\n};\n\n/*\n Registers a post message event listener for updating the variant / base classes in the live preview for audience mode.\n */\nexport function useRecalculateVariantDataCSLPValues(): void {\n livePreviewPostMessage?.on<OnAudienceModeVariantPatchUpdate>(\n LIVE_PREVIEW_POST_MESSAGE_EVENTS.VARIANT_PATCH,\n (event) => {\n if (VisualBuilder.VisualBuilderGlobalState.value.audienceMode) {\n updateVariantClasses(event.data);\n }\n }\n );\n}\nfunction updateVariantClasses({\n highlightVariantFields,\n expectedCSLPValues,\n}: OnAudienceModeVariantPatchUpdate): void {\n const variant = VisualBuilder.VisualBuilderGlobalState.value.variant;\n const observers: MutationObserver[] = [];\n\n // Helper function to update element classes\n const updateElementClasses = (\n element: HTMLElement,\n dataCslp: string,\n observer?: MutationObserver\n ) => {\n if (!dataCslp) return;\n\n if (\n dataCslp.startsWith(\"v2:\") &&\n !element.classList.contains(\"visual-builder__variant-field\")\n ) {\n if (element.classList.contains(\"visual-builder__base-field\")) {\n element.classList.remove(\"visual-builder__base-field\");\n }\n if (highlightVariantFields) {\n element.classList.add(\n visualBuilderStyles()[\"visual-builder__variant-field\"],\n \"visual-builder__variant-field\"\n );\n } else {\n element.classList.add(\"visual-builder__variant-field\");\n }\n } else if (\n !dataCslp.startsWith(\"v2:\") &&\n element.classList.contains(\"visual-builder__variant-field\")\n ) {\n element.classList.remove(\n visualBuilderStyles()[\"visual-builder__variant-field\"],\n \"visual-builder__variant-field\"\n );\n element.classList.add(\"visual-builder__base-field\");\n } else if (\n dataCslp.startsWith(\"v2:\") &&\n variant &&\n !dataCslp.includes(variant) &&\n element.classList.contains(\"visual-builder__variant-field\")\n ) {\n element.classList.remove(\n visualBuilderStyles()[\"visual-builder__variant-field\"],\n \"visual-builder__variant-field\"\n );\n element.classList.add(\"visual-builder__disabled-variant-field\");\n }\n if (!observer) return;\n // Disconnect this observer after processing\n observer.disconnect();\n const index = observers.indexOf(observer);\n if (index > -1) {\n observers.splice(index, 1);\n }\n };\n\n const addElementClasses = (element: HTMLElement) => {\n const dataCslp = element.getAttribute(DATA_CSLP_ATTR_SELECTOR);\n\n if (!dataCslp) {\n //recursive call for child nodes\n element.childNodes.forEach((child) => {\n if (child instanceof HTMLElement) {\n addElementClasses(child);\n }\n });\n return;\n }\n //if element might have been updated by another observer\n if (\n dataCslp.startsWith(\"v2:\") &&\n element.classList.contains(\"visual-builder__variant-field\")\n ) {\n return;\n }\n // if element has not given variant/base class\n if (\n dataCslp.startsWith(\"v2:\") &&\n !element.classList.contains(\"visual-builder__variant-field\")\n ) {\n if (element.classList.contains(\"visual-builder__base-field\")) {\n element.classList.remove(\"visual-builder__base-field\");\n }\n if (highlightVariantFields) {\n element.classList.add(\n visualBuilderStyles()[\"visual-builder__variant-field\"],\n \"visual-builder__variant-field\"\n );\n } else {\n element.classList.add(\"visual-builder__variant-field\");\n }\n } else if (!dataCslp.startsWith(\"v2:\")) {\n if (element.classList.contains(\"visual-builder__variant-field\")) {\n element.classList.remove(\n visualBuilderStyles()[\"visual-builder__variant-field\"],\n \"visual-builder__variant-field\"\n );\n }\n element.classList.add(\"visual-builder__base-field\");\n }\n\n //recursive call for child nodes\n element.childNodes.forEach((child) => {\n if (child instanceof HTMLElement) {\n addElementClasses(child);\n }\n });\n };\n\n // Create a separate observer for each element\n const elementsWithCslp = document.querySelectorAll(\n `[${DATA_CSLP_ATTR_SELECTOR}]`\n );\n elementsWithCslp.forEach((elementNode) => {\n const element = elementNode as HTMLElement;\n const observer = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (\n (mutation.type === \"attributes\" &&\n mutation.attributeName === DATA_CSLP_ATTR_SELECTOR) \|\|\n mutation.type === \"childList\"\n ) {\n if (mutation.addedNodes.length > 0) {\n mutation.addedNodes.forEach((node) => {\n if (node instanceof HTMLElement) {\n addElementClasses(node);\n }\n });\n }\n const dataCslp = element.getAttribute(\n DATA_CSLP_ATTR_SELECTOR\n );\n updateElementClasses(element, dataCslp \|\| \"\", observer);\n }\n });\n });\n\n observers.push(observer);\n observer.observe(element, {\n attributes: true,\n childList: true, // Observe direct children\n subtree: true,\n });\n });\n\n setTimeout(() => {\n if (observers.length > 0) {\n observers.forEach((observer) => observer.disconnect());\n observers.length = 0;\n }\n }, VARIANT_UPDATE_DELAY_MS);\n}\n"],"mappings":"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","names":["import_livePreviewEventManager","livePreviewPostMessage"]}