@contentstack/live-preview-utils 3.1.2 → 3.1.3

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 (146) hide show
  1. package/README.md +1 -1
  2. package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.cjs +1 -1
  3. package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.js +1 -1
  4. package/dist/legacy/preview/contentstack-live-preview-HOC.cjs +6 -2
  5. package/dist/legacy/preview/contentstack-live-preview-HOC.cjs.map +1 -1
  6. package/dist/legacy/preview/contentstack-live-preview-HOC.js +6 -2
  7. package/dist/legacy/preview/contentstack-live-preview-HOC.js.map +1 -1
  8. package/dist/legacy/visualBuilder/components/FieldToolbar.cjs +26 -17
  9. package/dist/legacy/visualBuilder/components/FieldToolbar.cjs.map +1 -1
  10. package/dist/legacy/visualBuilder/components/FieldToolbar.js +26 -17
  11. package/dist/legacy/visualBuilder/components/FieldToolbar.js.map +1 -1
  12. package/dist/legacy/visualBuilder/components/addInstanceButton.cjs +39 -11
  13. package/dist/legacy/visualBuilder/components/addInstanceButton.cjs.map +1 -1
  14. package/dist/legacy/visualBuilder/components/addInstanceButton.d.cts +5 -0
  15. package/dist/legacy/visualBuilder/components/addInstanceButton.d.ts +5 -0
  16. package/dist/legacy/visualBuilder/components/addInstanceButton.js +39 -11
  17. package/dist/legacy/visualBuilder/components/addInstanceButton.js.map +1 -1
  18. package/dist/legacy/visualBuilder/generators/generateAddInstanceButtons.cjs +8 -2
  19. package/dist/legacy/visualBuilder/generators/generateAddInstanceButtons.cjs.map +1 -1
  20. package/dist/legacy/visualBuilder/generators/generateAddInstanceButtons.d.cts +9 -3
  21. package/dist/legacy/visualBuilder/generators/generateAddInstanceButtons.d.ts +9 -3
  22. package/dist/legacy/visualBuilder/generators/generateAddInstanceButtons.js +8 -2
  23. package/dist/legacy/visualBuilder/generators/generateAddInstanceButtons.js.map +1 -1
  24. package/dist/legacy/visualBuilder/listeners/mouseClick.cjs +7 -0
  25. package/dist/legacy/visualBuilder/listeners/mouseClick.cjs.map +1 -1
  26. package/dist/legacy/visualBuilder/listeners/mouseClick.js +7 -0
  27. package/dist/legacy/visualBuilder/listeners/mouseClick.js.map +1 -1
  28. package/dist/legacy/visualBuilder/utils/enableInlineEditing.cjs +94 -0
  29. package/dist/legacy/visualBuilder/utils/enableInlineEditing.cjs.map +1 -0
  30. package/dist/legacy/visualBuilder/utils/enableInlineEditing.d.cts +11 -0
  31. package/dist/legacy/visualBuilder/utils/enableInlineEditing.d.ts +11 -0
  32. package/dist/legacy/visualBuilder/utils/enableInlineEditing.js +74 -0
  33. package/dist/legacy/visualBuilder/utils/enableInlineEditing.js.map +1 -0
  34. package/dist/legacy/visualBuilder/utils/handleIndividualFields.cjs +20 -110
  35. package/dist/legacy/visualBuilder/utils/handleIndividualFields.cjs.map +1 -1
  36. package/dist/legacy/visualBuilder/utils/handleIndividualFields.d.cts +3 -5
  37. package/dist/legacy/visualBuilder/utils/handleIndividualFields.d.ts +3 -5
  38. package/dist/legacy/visualBuilder/utils/handleIndividualFields.js +18 -114
  39. package/dist/legacy/visualBuilder/utils/handleIndividualFields.js.map +1 -1
  40. package/dist/legacy/visualBuilder/utils/handleInlineEditableField.cjs +81 -0
  41. package/dist/legacy/visualBuilder/utils/handleInlineEditableField.cjs.map +1 -0
  42. package/dist/legacy/visualBuilder/utils/handleInlineEditableField.d.cts +16 -0
  43. package/dist/legacy/visualBuilder/utils/handleInlineEditableField.d.ts +16 -0
  44. package/dist/legacy/visualBuilder/utils/handleInlineEditableField.js +58 -0
  45. package/dist/legacy/visualBuilder/utils/handleInlineEditableField.js.map +1 -0
  46. package/dist/legacy/visualBuilder/utils/isFieldMultiple.cjs +35 -0
  47. package/dist/legacy/visualBuilder/utils/isFieldMultiple.cjs.map +1 -0
  48. package/dist/legacy/visualBuilder/utils/isFieldMultiple.d.cts +6 -0
  49. package/dist/legacy/visualBuilder/utils/isFieldMultiple.d.ts +6 -0
  50. package/dist/legacy/visualBuilder/utils/isFieldMultiple.js +12 -0
  51. package/dist/legacy/visualBuilder/utils/isFieldMultiple.js.map +1 -0
  52. package/dist/legacy/visualBuilder/utils/multipleElementAddButton.cjs +14 -20
  53. package/dist/legacy/visualBuilder/utils/multipleElementAddButton.cjs.map +1 -1
  54. package/dist/legacy/visualBuilder/utils/multipleElementAddButton.d.cts +1 -1
  55. package/dist/legacy/visualBuilder/utils/multipleElementAddButton.d.ts +1 -1
  56. package/dist/legacy/visualBuilder/utils/multipleElementAddButton.js +14 -20
  57. package/dist/legacy/visualBuilder/utils/multipleElementAddButton.js.map +1 -1
  58. package/dist/legacy/visualBuilder/utils/pasteAsPlainText.cjs +44 -0
  59. package/dist/legacy/visualBuilder/utils/pasteAsPlainText.cjs.map +1 -0
  60. package/dist/legacy/visualBuilder/utils/pasteAsPlainText.d.cts +5 -0
  61. package/dist/legacy/visualBuilder/utils/pasteAsPlainText.d.ts +5 -0
  62. package/dist/legacy/visualBuilder/utils/pasteAsPlainText.js +21 -0
  63. package/dist/legacy/visualBuilder/utils/pasteAsPlainText.js.map +1 -0
  64. package/dist/legacy/visualBuilder/utils/types/index.types.cjs.map +1 -1
  65. package/dist/legacy/visualBuilder/utils/types/index.types.d.cts +6 -1
  66. package/dist/legacy/visualBuilder/utils/types/index.types.d.ts +6 -1
  67. package/dist/legacy/visualBuilder/utils/types/index.types.js.map +1 -1
  68. package/dist/legacy/visualBuilder/visualBuilder.style.cjs +9 -1
  69. package/dist/legacy/visualBuilder/visualBuilder.style.cjs.map +1 -1
  70. package/dist/legacy/visualBuilder/visualBuilder.style.d.cts +2 -1
  71. package/dist/legacy/visualBuilder/visualBuilder.style.d.ts +2 -1
  72. package/dist/legacy/visualBuilder/visualBuilder.style.js +9 -1
  73. package/dist/legacy/visualBuilder/visualBuilder.style.js.map +1 -1
  74. package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.cjs +1 -1
  75. package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.js +1 -1
  76. package/dist/modern/preview/contentstack-live-preview-HOC.cjs +6 -2
  77. package/dist/modern/preview/contentstack-live-preview-HOC.cjs.map +1 -1
  78. package/dist/modern/preview/contentstack-live-preview-HOC.js +6 -2
  79. package/dist/modern/preview/contentstack-live-preview-HOC.js.map +1 -1
  80. package/dist/modern/visualBuilder/components/FieldToolbar.cjs +26 -16
  81. package/dist/modern/visualBuilder/components/FieldToolbar.cjs.map +1 -1
  82. package/dist/modern/visualBuilder/components/FieldToolbar.js +26 -16
  83. package/dist/modern/visualBuilder/components/FieldToolbar.js.map +1 -1
  84. package/dist/modern/visualBuilder/components/addInstanceButton.cjs +38 -11
  85. package/dist/modern/visualBuilder/components/addInstanceButton.cjs.map +1 -1
  86. package/dist/modern/visualBuilder/components/addInstanceButton.d.cts +5 -0
  87. package/dist/modern/visualBuilder/components/addInstanceButton.d.ts +5 -0
  88. package/dist/modern/visualBuilder/components/addInstanceButton.js +38 -11
  89. package/dist/modern/visualBuilder/components/addInstanceButton.js.map +1 -1
  90. package/dist/modern/visualBuilder/generators/generateAddInstanceButtons.cjs +8 -2
  91. package/dist/modern/visualBuilder/generators/generateAddInstanceButtons.cjs.map +1 -1
  92. package/dist/modern/visualBuilder/generators/generateAddInstanceButtons.d.cts +9 -3
  93. package/dist/modern/visualBuilder/generators/generateAddInstanceButtons.d.ts +9 -3
  94. package/dist/modern/visualBuilder/generators/generateAddInstanceButtons.js +8 -2
  95. package/dist/modern/visualBuilder/generators/generateAddInstanceButtons.js.map +1 -1
  96. package/dist/modern/visualBuilder/listeners/mouseClick.cjs +7 -0
  97. package/dist/modern/visualBuilder/listeners/mouseClick.cjs.map +1 -1
  98. package/dist/modern/visualBuilder/listeners/mouseClick.js +7 -0
  99. package/dist/modern/visualBuilder/listeners/mouseClick.js.map +1 -1
  100. package/dist/modern/visualBuilder/utils/enableInlineEditing.cjs +94 -0
  101. package/dist/modern/visualBuilder/utils/enableInlineEditing.cjs.map +1 -0
  102. package/dist/modern/visualBuilder/utils/enableInlineEditing.d.cts +11 -0
  103. package/dist/modern/visualBuilder/utils/enableInlineEditing.d.ts +11 -0
  104. package/dist/modern/visualBuilder/utils/enableInlineEditing.js +74 -0
  105. package/dist/modern/visualBuilder/utils/enableInlineEditing.js.map +1 -0
  106. package/dist/modern/visualBuilder/utils/handleIndividualFields.cjs +20 -110
  107. package/dist/modern/visualBuilder/utils/handleIndividualFields.cjs.map +1 -1
  108. package/dist/modern/visualBuilder/utils/handleIndividualFields.d.cts +3 -5
  109. package/dist/modern/visualBuilder/utils/handleIndividualFields.d.ts +3 -5
  110. package/dist/modern/visualBuilder/utils/handleIndividualFields.js +18 -114
  111. package/dist/modern/visualBuilder/utils/handleIndividualFields.js.map +1 -1
  112. package/dist/modern/visualBuilder/utils/handleInlineEditableField.cjs +81 -0
  113. package/dist/modern/visualBuilder/utils/handleInlineEditableField.cjs.map +1 -0
  114. package/dist/modern/visualBuilder/utils/handleInlineEditableField.d.cts +16 -0
  115. package/dist/modern/visualBuilder/utils/handleInlineEditableField.d.ts +16 -0
  116. package/dist/modern/visualBuilder/utils/handleInlineEditableField.js +58 -0
  117. package/dist/modern/visualBuilder/utils/handleInlineEditableField.js.map +1 -0
  118. package/dist/modern/visualBuilder/utils/isFieldMultiple.cjs +35 -0
  119. package/dist/modern/visualBuilder/utils/isFieldMultiple.cjs.map +1 -0
  120. package/dist/modern/visualBuilder/utils/isFieldMultiple.d.cts +6 -0
  121. package/dist/modern/visualBuilder/utils/isFieldMultiple.d.ts +6 -0
  122. package/dist/modern/visualBuilder/utils/isFieldMultiple.js +12 -0
  123. package/dist/modern/visualBuilder/utils/isFieldMultiple.js.map +1 -0
  124. package/dist/modern/visualBuilder/utils/multipleElementAddButton.cjs +14 -18
  125. package/dist/modern/visualBuilder/utils/multipleElementAddButton.cjs.map +1 -1
  126. package/dist/modern/visualBuilder/utils/multipleElementAddButton.d.cts +1 -1
  127. package/dist/modern/visualBuilder/utils/multipleElementAddButton.d.ts +1 -1
  128. package/dist/modern/visualBuilder/utils/multipleElementAddButton.js +14 -18
  129. package/dist/modern/visualBuilder/utils/multipleElementAddButton.js.map +1 -1
  130. package/dist/modern/visualBuilder/utils/pasteAsPlainText.cjs +44 -0
  131. package/dist/modern/visualBuilder/utils/pasteAsPlainText.cjs.map +1 -0
  132. package/dist/modern/visualBuilder/utils/pasteAsPlainText.d.cts +5 -0
  133. package/dist/modern/visualBuilder/utils/pasteAsPlainText.d.ts +5 -0
  134. package/dist/modern/visualBuilder/utils/pasteAsPlainText.js +21 -0
  135. package/dist/modern/visualBuilder/utils/pasteAsPlainText.js.map +1 -0
  136. package/dist/modern/visualBuilder/utils/types/index.types.cjs.map +1 -1
  137. package/dist/modern/visualBuilder/utils/types/index.types.d.cts +6 -1
  138. package/dist/modern/visualBuilder/utils/types/index.types.d.ts +6 -1
  139. package/dist/modern/visualBuilder/utils/types/index.types.js.map +1 -1
  140. package/dist/modern/visualBuilder/visualBuilder.style.cjs +9 -1
  141. package/dist/modern/visualBuilder/visualBuilder.style.cjs.map +1 -1
  142. package/dist/modern/visualBuilder/visualBuilder.style.d.cts +2 -1
  143. package/dist/modern/visualBuilder/visualBuilder.style.d.ts +2 -1
  144. package/dist/modern/visualBuilder/visualBuilder.style.js +9 -1
  145. package/dist/modern/visualBuilder/visualBuilder.style.js.map +1 -1
  146. package/package.json +3 -2
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/listeners/mouseClick.ts"],"sourcesContent":["import {\n cleanIndividualFieldResidual,\n handleIndividualFields,\n} from \"../utils/handleIndividualFields\";\n\nimport {\n getCsDataOfElement,\n getDOMEditStack,\n} from \"../utils/getCsDataOfElement\";\n\nimport { appendFocusedToolbar } from \"../generators/generateToolbar\";\n\nimport { addFocusOverlay, hideOverlay } from \"../generators/generateOverlay\";\n\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\n\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\nimport EventListenerHandlerParams from \"./types\";\nimport { toggleHighlightedCommentIconDisplay } from \"../generators/generateHighlightedComment\";\nimport { VB_EmptyBlockParentClass } from \"../..\";\nimport { getFieldVariantStatus } from \"../components/FieldRevert/FieldRevertComponent\";\n\ntype HandleBuilderInteractionParams = Omit<\n EventListenerHandlerParams,\n \"eventDetails\" | \"customCursor\"\n> & { reEvaluate?: boolean };\n\ntype AddFocusOverlayParams = Pick<\n EventListenerHandlerParams,\n \"overlayWrapper\" | \"resizeObserver\"\n> & { editableElement: Element; isFieldDisabled?: boolean };\n\ntype AddFocusedToolbarParams = Pick<\n EventListenerHandlerParams,\n \"eventDetails\" | \"focusedToolbar\"\n> & { hideOverlay: () => void; isVariant: boolean };\n\nfunction addOverlay(params: AddFocusOverlayParams) {\n if (!params.overlayWrapper || !params.editableElement) return;\n\n addFocusOverlay(\n params.editableElement,\n params.overlayWrapper,\n params.isFieldDisabled\n );\n params.resizeObserver.observe(params.editableElement);\n}\n\nexport function addFocusedToolbar(params: AddFocusedToolbarParams): void {\n const { editableElement } = params.eventDetails;\n\n if (!editableElement || !params.focusedToolbar) return;\n\n appendFocusedToolbar(\n params.eventDetails,\n params.focusedToolbar,\n params.hideOverlay,\n params.isVariant\n );\n}\n\nasync function handleBuilderInteraction(\n params: HandleBuilderInteractionParams\n): Promise<void> {\n const eventTarget = params.event.target as HTMLElement | null;\n const isAnchorElement = eventTarget instanceof HTMLAnchorElement;\n const elementHasCslp =\n eventTarget &&\n (eventTarget.hasAttribute(\"data-cslp\") ||\n eventTarget.closest(\"[data-cslp]\"));\n\n // if the target element is a studio-ui element, return\n // this is currently used for the \"Edit in Studio\" button\n if (eventTarget?.getAttribute(\"data-studio-ui\") === \"true\") {\n return;\n }\n // prevent default behavior for anchor elements and elements with cslp attribute\n if (\n isAnchorElement ||\n (elementHasCslp && !eventTarget.closest(\".visual-builder__empty-block\"))\n ) {\n params.event.preventDefault();\n params.event.stopPropagation();\n }\n\n const eventDetails = getCsDataOfElement(params.event);\n\n // Send mouse click post message\n sendMouseClickPostMessage(eventDetails);\n\n if (\n !eventDetails ||\n !params.overlayWrapper ||\n !params.visualBuilderContainer\n ) {\n return;\n }\n\n const { editableElement, fieldMetadata } = eventDetails;\n const variantStatus = await getFieldVariantStatus(fieldMetadata);\n const isVariant = variantStatus\n ? Object.values(variantStatus).some((value) => value === true)\n : false;\n\n // Clean residuals if necessary\n cleanResidualsIfNeeded(params, editableElement);\n\n // Return if the selected element is an empty block\n if (isEmptyBlockElement(editableElement)) {\n return;\n }\n\n // when previous and current selected element is same, return.\n // this also avoids inserting psuedo-editable field (field data is\n // not equal to text content in DOM) when performing mouse\n // selections in the content editable\n const previousSelectedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (\n isSameSelectedElement(previousSelectedElement, editableElement, params)\n ) {\n return;\n }\n\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n editableElement;\n\n // Add overlay and focused toolbar\n addOverlayAndToolbar(params, eventDetails, editableElement, isVariant);\n\n const { cslpValue } = fieldMetadata;\n\n toggleHighlightedCommentIconDisplay(cslpValue, false);\n\n // Handle field schema and individual fields\n await handleFieldSchemaAndIndividualFields(\n params,\n eventDetails,\n fieldMetadata,\n editableElement,\n previousSelectedElement\n );\n\n // Observe changes to the editable element\n observeEditableElementChanges(params, editableElement);\n}\n\nfunction sendMouseClickPostMessage(eventDetails: any) {\n visualBuilderPostMessage\n ?.send(VisualBuilderPostMessageEvents.MOUSE_CLICK, {\n cslpData: eventDetails?.cslpData,\n fieldMetadata: eventDetails?.fieldMetadata,\n })\n .catch((err) => {\n console.warn(\"Error while sending post message\", err);\n });\n}\nfunction cleanResidualsIfNeeded(\n params: HandleBuilderInteractionParams,\n editableElement: Element\n) {\n const previousSelectedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (\n (previousSelectedElement &&\n previousSelectedElement !== editableElement) ||\n params.reEvaluate\n ) {\n cleanIndividualFieldResidual({\n overlayWrapper: params.overlayWrapper!,\n visualBuilderContainer: params.visualBuilderContainer,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n }\n}\nfunction isEmptyBlockElement(editableElement: Element): boolean {\n return (\n editableElement.classList.contains(VB_EmptyBlockParentClass) ||\n editableElement.classList.contains(\"visual-builder__empty-block\")\n );\n}\n\nfunction isSameSelectedElement(\n previousSelectedElement: Element | null,\n editableElement: Element,\n params: HandleBuilderInteractionParams\n): boolean {\n return !!(\n previousSelectedElement &&\n previousSelectedElement === editableElement &&\n !params.reEvaluate\n );\n}\n\nfunction addOverlayAndToolbar(\n params: HandleBuilderInteractionParams,\n eventDetails: any,\n editableElement: Element,\n isVariant: boolean\n) {\n addOverlay({\n overlayWrapper: params.overlayWrapper,\n resizeObserver: params.resizeObserver,\n editableElement: editableElement,\n });\n\n addFocusedToolbar({\n eventDetails: eventDetails,\n focusedToolbar: params.focusedToolbar,\n hideOverlay: () => {\n hideOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.overlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n },\n isVariant,\n });\n}\nasync function handleFieldSchemaAndIndividualFields(\n params: HandleBuilderInteractionParams,\n eventDetails: any,\n fieldMetadata: any,\n editableElement: Element,\n previousSelectedElement: Element | null\n) {\n const { content_type_uid, fieldPath } = fieldMetadata;\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n content_type_uid,\n fieldPath\n );\n\n if (fieldSchema) {\n const { isDisabled } = isFieldDisabled(fieldSchema, eventDetails);\n if (isDisabled) {\n addOverlay({\n overlayWrapper: params.overlayWrapper,\n resizeObserver: params.resizeObserver,\n editableElement: editableElement,\n isFieldDisabled: true,\n });\n }\n }\n\n visualBuilderPostMessage?.send(VisualBuilderPostMessageEvents.FOCUS_FIELD, {\n DOMEditStack: getDOMEditStack(editableElement),\n });\n\n await handleIndividualFields(eventDetails, {\n visualBuilderContainer: params.visualBuilderContainer!,\n resizeObserver: params.resizeObserver,\n lastEditedField: previousSelectedElement,\n });\n}\nfunction observeEditableElementChanges(\n params: HandleBuilderInteractionParams,\n editableElement: Element\n) {\n const focusElementObserver = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (\n mutation.type === \"attributes\" &&\n mutation.attributeName === \"data-cslp\"\n ) {\n focusElementObserver?.disconnect();\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n null;\n handleBuilderInteraction({ ...params, reEvaluate: true });\n }\n });\n });\n\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n focusElementObserver;\n focusElementObserver.observe(editableElement, { attributes: true });\n}\n\nexport default handleBuilderInteraction;\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/listeners/mouseClick.ts"],"sourcesContent":["import {\n cleanIndividualFieldResidual,\n handleIndividualFields,\n} from \"../utils/handleIndividualFields\";\n\nimport {\n getCsDataOfElement,\n getDOMEditStack,\n} from \"../utils/getCsDataOfElement\";\n\nimport { appendFocusedToolbar } from \"../generators/generateToolbar\";\n\nimport { addFocusOverlay, hideOverlay } from \"../generators/generateOverlay\";\n\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\n\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\nimport EventListenerHandlerParams from \"./types\";\nimport { toggleHighlightedCommentIconDisplay } from \"../generators/generateHighlightedComment\";\nimport { VB_EmptyBlockParentClass } from \"../..\";\nimport { getFieldVariantStatus } from \"../components/FieldRevert/FieldRevertComponent\";\n\ntype HandleBuilderInteractionParams = Omit<\n EventListenerHandlerParams,\n \"eventDetails\" | \"customCursor\"\n> & { reEvaluate?: boolean };\n\ntype AddFocusOverlayParams = Pick<\n EventListenerHandlerParams,\n \"overlayWrapper\" | \"resizeObserver\"\n> & { editableElement: Element; isFieldDisabled?: boolean };\n\ntype AddFocusedToolbarParams = Pick<\n EventListenerHandlerParams,\n \"eventDetails\" | \"focusedToolbar\"\n> & { hideOverlay: () => void; isVariant: boolean };\n\nfunction addOverlay(params: AddFocusOverlayParams) {\n if (!params.overlayWrapper || !params.editableElement) return;\n\n addFocusOverlay(\n params.editableElement,\n params.overlayWrapper,\n params.isFieldDisabled\n );\n params.resizeObserver.observe(params.editableElement);\n}\n\nexport function addFocusedToolbar(params: AddFocusedToolbarParams): void {\n const { editableElement } = params.eventDetails;\n\n if (!editableElement || !params.focusedToolbar) return;\n\n appendFocusedToolbar(\n params.eventDetails,\n params.focusedToolbar,\n params.hideOverlay,\n params.isVariant\n );\n}\n\nasync function handleBuilderInteraction(\n params: HandleBuilderInteractionParams\n): Promise<void> {\n const eventTarget = params.event.target as HTMLElement | null;\n const isAnchorElement = eventTarget instanceof HTMLAnchorElement;\n const elementHasCslp =\n eventTarget &&\n (eventTarget.hasAttribute(\"data-cslp\") ||\n eventTarget.closest(\"[data-cslp]\"));\n\n // if the target element is a studio-ui element, return\n // this is currently used for the \"Edit in Studio\" button\n if (eventTarget?.getAttribute(\"data-studio-ui\") === \"true\") {\n return;\n }\n\n if (params.event.altKey) {\n if (isAnchorElement) {\n params.event.preventDefault();\n params.event.stopPropagation();\n }\n return;\n }\n // prevent default behavior for anchor elements and elements with cslp attribute\n if (\n isAnchorElement ||\n (elementHasCslp && !eventTarget.closest(\".visual-builder__empty-block\"))\n ) {\n params.event.preventDefault();\n params.event.stopPropagation();\n }\n\n const eventDetails = getCsDataOfElement(params.event);\n\n // Send mouse click post message\n sendMouseClickPostMessage(eventDetails);\n\n if (\n !eventDetails ||\n !params.overlayWrapper ||\n !params.visualBuilderContainer\n ) {\n return;\n }\n\n const { editableElement, fieldMetadata } = eventDetails;\n const variantStatus = await getFieldVariantStatus(fieldMetadata);\n const isVariant = variantStatus\n ? Object.values(variantStatus).some((value) => value === true)\n : false;\n\n // Clean residuals if necessary\n cleanResidualsIfNeeded(params, editableElement);\n\n // Return if the selected element is an empty block\n if (isEmptyBlockElement(editableElement)) {\n return;\n }\n\n // when previous and current selected element is same, return.\n // this also avoids inserting psuedo-editable field (field data is\n // not equal to text content in DOM) when performing mouse\n // selections in the content editable\n const previousSelectedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (\n isSameSelectedElement(previousSelectedElement, editableElement, params)\n ) {\n return;\n }\n\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n editableElement;\n\n // Add overlay and focused toolbar\n addOverlayAndToolbar(params, eventDetails, editableElement, isVariant);\n\n const { cslpValue } = fieldMetadata;\n\n toggleHighlightedCommentIconDisplay(cslpValue, false);\n\n // Handle field schema and individual fields\n await handleFieldSchemaAndIndividualFields(\n params,\n eventDetails,\n fieldMetadata,\n editableElement,\n previousSelectedElement\n );\n\n // Observe changes to the editable element\n observeEditableElementChanges(params, editableElement);\n}\n\nfunction sendMouseClickPostMessage(eventDetails: any) {\n visualBuilderPostMessage\n ?.send(VisualBuilderPostMessageEvents.MOUSE_CLICK, {\n cslpData: eventDetails?.cslpData,\n fieldMetadata: eventDetails?.fieldMetadata,\n })\n .catch((err) => {\n console.warn(\"Error while sending post message\", err);\n });\n}\nfunction cleanResidualsIfNeeded(\n params: HandleBuilderInteractionParams,\n editableElement: Element\n) {\n const previousSelectedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (\n (previousSelectedElement &&\n previousSelectedElement !== editableElement) ||\n params.reEvaluate\n ) {\n cleanIndividualFieldResidual({\n overlayWrapper: params.overlayWrapper!,\n visualBuilderContainer: params.visualBuilderContainer,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n }\n}\nfunction isEmptyBlockElement(editableElement: Element): boolean {\n return (\n editableElement.classList.contains(VB_EmptyBlockParentClass) ||\n editableElement.classList.contains(\"visual-builder__empty-block\")\n );\n}\n\nfunction isSameSelectedElement(\n previousSelectedElement: Element | null,\n editableElement: Element,\n params: HandleBuilderInteractionParams\n): boolean {\n return !!(\n previousSelectedElement &&\n previousSelectedElement === editableElement &&\n !params.reEvaluate\n );\n}\n\nfunction addOverlayAndToolbar(\n params: HandleBuilderInteractionParams,\n eventDetails: any,\n editableElement: Element,\n isVariant: boolean\n) {\n addOverlay({\n overlayWrapper: params.overlayWrapper,\n resizeObserver: params.resizeObserver,\n editableElement: editableElement,\n });\n\n addFocusedToolbar({\n eventDetails: eventDetails,\n focusedToolbar: params.focusedToolbar,\n hideOverlay: () => {\n hideOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.overlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n });\n },\n isVariant,\n });\n}\nasync function handleFieldSchemaAndIndividualFields(\n params: HandleBuilderInteractionParams,\n eventDetails: any,\n fieldMetadata: any,\n editableElement: Element,\n previousSelectedElement: Element | null\n) {\n const { content_type_uid, fieldPath } = fieldMetadata;\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n content_type_uid,\n fieldPath\n );\n\n if (fieldSchema) {\n const { isDisabled } = isFieldDisabled(fieldSchema, eventDetails);\n if (isDisabled) {\n addOverlay({\n overlayWrapper: params.overlayWrapper,\n resizeObserver: params.resizeObserver,\n editableElement: editableElement,\n isFieldDisabled: true,\n });\n }\n }\n\n visualBuilderPostMessage?.send(VisualBuilderPostMessageEvents.FOCUS_FIELD, {\n DOMEditStack: getDOMEditStack(editableElement),\n });\n\n await handleIndividualFields(eventDetails, {\n visualBuilderContainer: params.visualBuilderContainer!,\n resizeObserver: params.resizeObserver,\n lastEditedField: previousSelectedElement,\n });\n}\nfunction observeEditableElementChanges(\n params: HandleBuilderInteractionParams,\n editableElement: Element\n) {\n const focusElementObserver = new MutationObserver((mutations) => {\n mutations.forEach((mutation) => {\n if (\n mutation.type === \"attributes\" &&\n mutation.attributeName === \"data-cslp\"\n ) {\n focusElementObserver?.disconnect();\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n null;\n handleBuilderInteraction({ ...params, reEvaluate: true });\n }\n });\n });\n\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n focusElementObserver;\n focusElementObserver.observe(editableElement, { attributes: true });\n}\n\nexport default handleBuilderInteraction;\n"],"mappings":"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","names":[]}
@@ -0,0 +1,94 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+
20
+ // src/visualBuilder/utils/enableInlineEditing.ts
21
+ var enableInlineEditing_exports = {};
22
+ __export(enableInlineEditing_exports, {
23
+ enableInlineEditing: () => enableInlineEditing
24
+ });
25
+ module.exports = __toCommonJS(enableInlineEditing_exports);
26
+ var import_lodash_es = require("lodash-es");
27
+ var import__ = require("../index.cjs");
28
+ var import_generatePseudoEditableField = require("../generators/generatePseudoEditableField.cjs");
29
+ var import_constants = require("./constants.cjs");
30
+ var import_getMultilinePlaintext = require("./getMultilinePlaintext.cjs");
31
+ var import_handleFieldMouseDown = require("./handleFieldMouseDown.cjs");
32
+ var import_types = require("./types/index.types.cjs");
33
+ var import_updateFocussedState = require("./updateFocussedState.cjs");
34
+ var import_pasteAsPlainText = require("./pasteAsPlainText.cjs");
35
+ function enableInlineEditing({
36
+ expectedFieldData,
37
+ editableElement,
38
+ fieldType,
39
+ elements
40
+ }) {
41
+ const { visualBuilderContainer, resizeObserver } = elements;
42
+ let actualEditableField = editableElement;
43
+ import__.VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = actualEditableField == null ? void 0 : actualEditableField.innerText;
44
+ const elementComputedDisplay = window.getComputedStyle(actualEditableField).display;
45
+ let textContent = editableElement.innerText || editableElement.textContent || "";
46
+ if (fieldType === import_types.FieldDataType.MULTILINE) {
47
+ textContent = (0, import_getMultilinePlaintext.getMultilinePlaintext)(actualEditableField);
48
+ actualEditableField.addEventListener("paste", import_pasteAsPlainText.pasteAsPlainText);
49
+ }
50
+ const expectedTextContent = expectedFieldData;
51
+ if (expectedTextContent && textContent !== expectedTextContent || (0, import_generatePseudoEditableField.isEllipsisActive)(editableElement)) {
52
+ const pseudoEditableField = (0, import_generatePseudoEditableField.generatePseudoEditableElement)(
53
+ { editableElement },
54
+ { textContent: expectedFieldData }
55
+ );
56
+ editableElement.style.visibility = "hidden";
57
+ pseudoEditableField.setAttribute(
58
+ import_constants.VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
59
+ fieldType
60
+ );
61
+ visualBuilderContainer.appendChild(pseudoEditableField);
62
+ actualEditableField = pseudoEditableField;
63
+ if (fieldType === import_types.FieldDataType.MULTILINE)
64
+ actualEditableField.addEventListener("paste", import_pasteAsPlainText.pasteAsPlainText);
65
+ elements.resizeObserver.observe(pseudoEditableField);
66
+ } else if (elementComputedDisplay === "inline") {
67
+ const onInlineElementInput = (0, import_lodash_es.throttle)(() => {
68
+ const overlayWrapper = visualBuilderContainer.querySelector(
69
+ ".visual-builder__overlay__wrapper"
70
+ );
71
+ const focusedToolbar = visualBuilderContainer.querySelector(
72
+ ".visual-builder__focused-toolbar"
73
+ );
74
+ (0, import_updateFocussedState.updateFocussedState)({
75
+ editableElement: actualEditableField,
76
+ visualBuilderContainer,
77
+ overlayWrapper,
78
+ focusedToolbar,
79
+ resizeObserver
80
+ });
81
+ }, 200);
82
+ actualEditableField.addEventListener("input", onInlineElementInput);
83
+ }
84
+ actualEditableField.setAttribute("contenteditable", "true");
85
+ actualEditableField.addEventListener("input", import_handleFieldMouseDown.handleFieldInput);
86
+ actualEditableField.addEventListener("keydown", import_handleFieldMouseDown.handleFieldKeyDown);
87
+ actualEditableField.focus();
88
+ return;
89
+ }
90
+ // Annotate the CommonJS export names for ESM import in node:
91
+ 0 && (module.exports = {
92
+ enableInlineEditing
93
+ });
94
+ //# sourceMappingURL=enableInlineEditing.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/visualBuilder/utils/enableInlineEditing.ts"],"sourcesContent":["import { throttle } from \"lodash-es\";\nimport { VisualBuilder } from \"../index\";\nimport {\n isEllipsisActive,\n generatePseudoEditableElement,\n} from \"../generators/generatePseudoEditableField\";\nimport { VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY } from \"./constants\";\nimport { getMultilinePlaintext } from \"./getMultilinePlaintext\";\nimport { handleFieldInput, handleFieldKeyDown } from \"./handleFieldMouseDown\";\nimport { FieldDataType, VisualBuilderEditContext } from \"./types/index.types\";\nimport { updateFocussedState } from \"./updateFocussedState\";\nimport { pasteAsPlainText } from \"./pasteAsPlainText\";\n\nexport function enableInlineEditing({\n expectedFieldData,\n editableElement,\n fieldType,\n elements,\n}: {\n expectedFieldData: any;\n editableElement: HTMLElement;\n fieldType: FieldDataType;\n elements: VisualBuilderEditContext;\n}) {\n const { visualBuilderContainer, resizeObserver } = elements;\n let actualEditableField = editableElement as HTMLElement;\n\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue =\n actualEditableField?.innerText;\n\n const elementComputedDisplay =\n window.getComputedStyle(actualEditableField).display;\n\n let textContent =\n (editableElement as HTMLElement).innerText ||\n editableElement.textContent ||\n \"\";\n\n if (fieldType === FieldDataType.MULTILINE) {\n textContent = getMultilinePlaintext(actualEditableField);\n actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n }\n const expectedTextContent = expectedFieldData;\n if (\n (expectedTextContent && textContent !== expectedTextContent) ||\n isEllipsisActive(editableElement as HTMLElement)\n ) {\n // TODO: Testing will be done in the E2E.\n const pseudoEditableField = generatePseudoEditableElement(\n { editableElement: editableElement as HTMLElement },\n { textContent: expectedFieldData }\n );\n\n (editableElement as HTMLElement).style.visibility = \"hidden\";\n\n // set field type attribute to the pseudo editable field\n // ensures proper keydown handling similar to the actual editable field\n pseudoEditableField.setAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n fieldType\n );\n visualBuilderContainer.appendChild(pseudoEditableField);\n actualEditableField = pseudoEditableField;\n\n if (fieldType === FieldDataType.MULTILINE)\n actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n\n // we will unobserve this in hideOverlay\n elements.resizeObserver.observe(pseudoEditableField);\n } else if (elementComputedDisplay === \"inline\") {\n // if the editable field is inline\n const onInlineElementInput = throttle(() => {\n const overlayWrapper = visualBuilderContainer.querySelector(\n \".visual-builder__overlay__wrapper\"\n ) as HTMLDivElement;\n const focusedToolbar = visualBuilderContainer.querySelector(\n \".visual-builder__focused-toolbar\"\n ) as HTMLDivElement;\n updateFocussedState({\n editableElement: actualEditableField,\n visualBuilderContainer,\n overlayWrapper,\n focusedToolbar,\n resizeObserver,\n });\n }, 200);\n actualEditableField.addEventListener(\"input\", onInlineElementInput);\n }\n\n actualEditableField.setAttribute(\"contenteditable\", \"true\");\n actualEditableField.addEventListener(\"input\", handleFieldInput);\n actualEditableField.addEventListener(\"keydown\", handleFieldKeyDown);\n // focus on the contenteditable element to start accepting input\n actualEditableField.focus();\n\n return;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAyB;AACzB,eAA8B;AAC9B,yCAGO;AACP,uBAAwD;AACxD,mCAAsC;AACtC,kCAAqD;AACrD,mBAAwD;AACxD,iCAAoC;AACpC,8BAAiC;AAE1B,SAAS,oBAAoB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,GAKG;AACC,QAAM,EAAE,wBAAwB,eAAe,IAAI;AACnD,MAAI,sBAAsB;AAE1B,yBAAc,yBAAyB,MAAM,kBACzC,2DAAqB;AAEzB,QAAM,yBACF,OAAO,iBAAiB,mBAAmB,EAAE;AAEjD,MAAI,cACC,gBAAgC,aACjC,gBAAgB,eAChB;AAEJ,MAAI,cAAc,2BAAc,WAAW;AACvC,sBAAc,oDAAsB,mBAAmB;AACvD,wBAAoB,iBAAiB,SAAS,wCAAgB;AAAA,EAClE;AACA,QAAM,sBAAsB;AAC5B,MACK,uBAAuB,gBAAgB,2BACxC,qDAAiB,eAA8B,GACjD;AAEE,UAAM,0BAAsB;AAAA,MACxB,EAAE,gBAAgD;AAAA,MAClD,EAAE,aAAa,kBAAkB;AAAA,IACrC;AAEA,IAAC,gBAAgC,MAAM,aAAa;AAIpD,wBAAoB;AAAA,MAChB;AAAA,MACA;AAAA,IACJ;AACA,2BAAuB,YAAY,mBAAmB;AACtD,0BAAsB;AAEtB,QAAI,cAAc,2BAAc;AAC5B,0BAAoB,iBAAiB,SAAS,wCAAgB;AAGlE,aAAS,eAAe,QAAQ,mBAAmB;AAAA,EACvD,WAAW,2BAA2B,UAAU;AAE5C,UAAM,2BAAuB,2BAAS,MAAM;AACxC,YAAM,iBAAiB,uBAAuB;AAAA,QAC1C;AAAA,MACJ;AACA,YAAM,iBAAiB,uBAAuB;AAAA,QAC1C;AAAA,MACJ;AACA,0DAAoB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACJ,CAAC;AAAA,IACL,GAAG,GAAG;AACN,wBAAoB,iBAAiB,SAAS,oBAAoB;AAAA,EACtE;AAEA,sBAAoB,aAAa,mBAAmB,MAAM;AAC1D,sBAAoB,iBAAiB,SAAS,4CAAgB;AAC9D,sBAAoB,iBAAiB,WAAW,8CAAkB;AAElE,sBAAoB,MAAM;AAE1B;AACJ;","names":[]}
@@ -0,0 +1,11 @@
1
+ import { FieldDataType, VisualBuilderEditContext } from './types/index.types.cjs';
2
+ import '../../cms/types/contentTypeSchema.types.cjs';
3
+
4
+ declare function enableInlineEditing({ expectedFieldData, editableElement, fieldType, elements, }: {
5
+ expectedFieldData: any;
6
+ editableElement: HTMLElement;
7
+ fieldType: FieldDataType;
8
+ elements: VisualBuilderEditContext;
9
+ }): void;
10
+
11
+ export { enableInlineEditing };
@@ -0,0 +1,11 @@
1
+ import { FieldDataType, VisualBuilderEditContext } from './types/index.types.js';
2
+ import '../../cms/types/contentTypeSchema.types.js';
3
+
4
+ declare function enableInlineEditing({ expectedFieldData, editableElement, fieldType, elements, }: {
5
+ expectedFieldData: any;
6
+ editableElement: HTMLElement;
7
+ fieldType: FieldDataType;
8
+ elements: VisualBuilderEditContext;
9
+ }): void;
10
+
11
+ export { enableInlineEditing };
@@ -0,0 +1,74 @@
1
+ import "../../chunk-5WRI5ZAA.js";
2
+
3
+ // src/visualBuilder/utils/enableInlineEditing.ts
4
+ import { throttle } from "lodash-es";
5
+ import { VisualBuilder } from "../index.js";
6
+ import {
7
+ isEllipsisActive,
8
+ generatePseudoEditableElement
9
+ } from "../generators/generatePseudoEditableField.js";
10
+ import { VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY } from "./constants.js";
11
+ import { getMultilinePlaintext } from "./getMultilinePlaintext.js";
12
+ import { handleFieldInput, handleFieldKeyDown } from "./handleFieldMouseDown.js";
13
+ import { FieldDataType } from "./types/index.types.js";
14
+ import { updateFocussedState } from "./updateFocussedState.js";
15
+ import { pasteAsPlainText } from "./pasteAsPlainText.js";
16
+ function enableInlineEditing({
17
+ expectedFieldData,
18
+ editableElement,
19
+ fieldType,
20
+ elements
21
+ }) {
22
+ const { visualBuilderContainer, resizeObserver } = elements;
23
+ let actualEditableField = editableElement;
24
+ VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = actualEditableField == null ? void 0 : actualEditableField.innerText;
25
+ const elementComputedDisplay = window.getComputedStyle(actualEditableField).display;
26
+ let textContent = editableElement.innerText || editableElement.textContent || "";
27
+ if (fieldType === FieldDataType.MULTILINE) {
28
+ textContent = getMultilinePlaintext(actualEditableField);
29
+ actualEditableField.addEventListener("paste", pasteAsPlainText);
30
+ }
31
+ const expectedTextContent = expectedFieldData;
32
+ if (expectedTextContent && textContent !== expectedTextContent || isEllipsisActive(editableElement)) {
33
+ const pseudoEditableField = generatePseudoEditableElement(
34
+ { editableElement },
35
+ { textContent: expectedFieldData }
36
+ );
37
+ editableElement.style.visibility = "hidden";
38
+ pseudoEditableField.setAttribute(
39
+ VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
40
+ fieldType
41
+ );
42
+ visualBuilderContainer.appendChild(pseudoEditableField);
43
+ actualEditableField = pseudoEditableField;
44
+ if (fieldType === FieldDataType.MULTILINE)
45
+ actualEditableField.addEventListener("paste", pasteAsPlainText);
46
+ elements.resizeObserver.observe(pseudoEditableField);
47
+ } else if (elementComputedDisplay === "inline") {
48
+ const onInlineElementInput = throttle(() => {
49
+ const overlayWrapper = visualBuilderContainer.querySelector(
50
+ ".visual-builder__overlay__wrapper"
51
+ );
52
+ const focusedToolbar = visualBuilderContainer.querySelector(
53
+ ".visual-builder__focused-toolbar"
54
+ );
55
+ updateFocussedState({
56
+ editableElement: actualEditableField,
57
+ visualBuilderContainer,
58
+ overlayWrapper,
59
+ focusedToolbar,
60
+ resizeObserver
61
+ });
62
+ }, 200);
63
+ actualEditableField.addEventListener("input", onInlineElementInput);
64
+ }
65
+ actualEditableField.setAttribute("contenteditable", "true");
66
+ actualEditableField.addEventListener("input", handleFieldInput);
67
+ actualEditableField.addEventListener("keydown", handleFieldKeyDown);
68
+ actualEditableField.focus();
69
+ return;
70
+ }
71
+ export {
72
+ enableInlineEditing
73
+ };
74
+ //# sourceMappingURL=enableInlineEditing.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/visualBuilder/utils/enableInlineEditing.ts"],"sourcesContent":["import { throttle } from \"lodash-es\";\nimport { VisualBuilder } from \"../index\";\nimport {\n isEllipsisActive,\n generatePseudoEditableElement,\n} from \"../generators/generatePseudoEditableField\";\nimport { VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY } from \"./constants\";\nimport { getMultilinePlaintext } from \"./getMultilinePlaintext\";\nimport { handleFieldInput, handleFieldKeyDown } from \"./handleFieldMouseDown\";\nimport { FieldDataType, VisualBuilderEditContext } from \"./types/index.types\";\nimport { updateFocussedState } from \"./updateFocussedState\";\nimport { pasteAsPlainText } from \"./pasteAsPlainText\";\n\nexport function enableInlineEditing({\n expectedFieldData,\n editableElement,\n fieldType,\n elements,\n}: {\n expectedFieldData: any;\n editableElement: HTMLElement;\n fieldType: FieldDataType;\n elements: VisualBuilderEditContext;\n}) {\n const { visualBuilderContainer, resizeObserver } = elements;\n let actualEditableField = editableElement as HTMLElement;\n\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue =\n actualEditableField?.innerText;\n\n const elementComputedDisplay =\n window.getComputedStyle(actualEditableField).display;\n\n let textContent =\n (editableElement as HTMLElement).innerText ||\n editableElement.textContent ||\n \"\";\n\n if (fieldType === FieldDataType.MULTILINE) {\n textContent = getMultilinePlaintext(actualEditableField);\n actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n }\n const expectedTextContent = expectedFieldData;\n if (\n (expectedTextContent && textContent !== expectedTextContent) ||\n isEllipsisActive(editableElement as HTMLElement)\n ) {\n // TODO: Testing will be done in the E2E.\n const pseudoEditableField = generatePseudoEditableElement(\n { editableElement: editableElement as HTMLElement },\n { textContent: expectedFieldData }\n );\n\n (editableElement as HTMLElement).style.visibility = \"hidden\";\n\n // set field type attribute to the pseudo editable field\n // ensures proper keydown handling similar to the actual editable field\n pseudoEditableField.setAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n fieldType\n );\n visualBuilderContainer.appendChild(pseudoEditableField);\n actualEditableField = pseudoEditableField;\n\n if (fieldType === FieldDataType.MULTILINE)\n actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n\n // we will unobserve this in hideOverlay\n elements.resizeObserver.observe(pseudoEditableField);\n } else if (elementComputedDisplay === \"inline\") {\n // if the editable field is inline\n const onInlineElementInput = throttle(() => {\n const overlayWrapper = visualBuilderContainer.querySelector(\n \".visual-builder__overlay__wrapper\"\n ) as HTMLDivElement;\n const focusedToolbar = visualBuilderContainer.querySelector(\n \".visual-builder__focused-toolbar\"\n ) as HTMLDivElement;\n updateFocussedState({\n editableElement: actualEditableField,\n visualBuilderContainer,\n overlayWrapper,\n focusedToolbar,\n resizeObserver,\n });\n }, 200);\n actualEditableField.addEventListener(\"input\", onInlineElementInput);\n }\n\n actualEditableField.setAttribute(\"contenteditable\", \"true\");\n actualEditableField.addEventListener(\"input\", handleFieldInput);\n actualEditableField.addEventListener(\"keydown\", handleFieldKeyDown);\n // focus on the contenteditable element to start accepting input\n actualEditableField.focus();\n\n return;\n}\n"],"mappings":";;;AAAA,SAAS,gBAAgB;AACzB,SAAS,qBAAqB;AAC9B;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,+CAA+C;AACxD,SAAS,6BAA6B;AACtC,SAAS,kBAAkB,0BAA0B;AACrD,SAAS,qBAA+C;AACxD,SAAS,2BAA2B;AACpC,SAAS,wBAAwB;AAE1B,SAAS,oBAAoB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,GAKG;AACC,QAAM,EAAE,wBAAwB,eAAe,IAAI;AACnD,MAAI,sBAAsB;AAE1B,gBAAc,yBAAyB,MAAM,kBACzC,2DAAqB;AAEzB,QAAM,yBACF,OAAO,iBAAiB,mBAAmB,EAAE;AAEjD,MAAI,cACC,gBAAgC,aACjC,gBAAgB,eAChB;AAEJ,MAAI,cAAc,cAAc,WAAW;AACvC,kBAAc,sBAAsB,mBAAmB;AACvD,wBAAoB,iBAAiB,SAAS,gBAAgB;AAAA,EAClE;AACA,QAAM,sBAAsB;AAC5B,MACK,uBAAuB,gBAAgB,uBACxC,iBAAiB,eAA8B,GACjD;AAEE,UAAM,sBAAsB;AAAA,MACxB,EAAE,gBAAgD;AAAA,MAClD,EAAE,aAAa,kBAAkB;AAAA,IACrC;AAEA,IAAC,gBAAgC,MAAM,aAAa;AAIpD,wBAAoB;AAAA,MAChB;AAAA,MACA;AAAA,IACJ;AACA,2BAAuB,YAAY,mBAAmB;AACtD,0BAAsB;AAEtB,QAAI,cAAc,cAAc;AAC5B,0BAAoB,iBAAiB,SAAS,gBAAgB;AAGlE,aAAS,eAAe,QAAQ,mBAAmB;AAAA,EACvD,WAAW,2BAA2B,UAAU;AAE5C,UAAM,uBAAuB,SAAS,MAAM;AACxC,YAAM,iBAAiB,uBAAuB;AAAA,QAC1C;AAAA,MACJ;AACA,YAAM,iBAAiB,uBAAuB;AAAA,QAC1C;AAAA,MACJ;AACA,0BAAoB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACJ,CAAC;AAAA,IACL,GAAG,GAAG;AACN,wBAAoB,iBAAiB,SAAS,oBAAoB;AAAA,EACtE;AAEA,sBAAoB,aAAa,mBAAmB,MAAM;AAC1D,sBAAoB,iBAAiB,SAAS,gBAAgB;AAC9D,sBAAoB,iBAAiB,WAAW,kBAAkB;AAElE,sBAAoB,MAAM;AAE1B;AACJ;","names":[]}
@@ -34,9 +34,7 @@ __export(handleIndividualFields_exports, {
34
34
  handleIndividualFields: () => handleIndividualFields
35
35
  });
36
36
  module.exports = __toCommonJS(handleIndividualFields_exports);
37
- var import_lodash_es = require("lodash-es");
38
37
  var import__ = require("../index.cjs");
39
- var import_generatePseudoEditableField = require("../generators/generatePseudoEditableField.cjs");
40
38
  var import_constants = require("./constants.cjs");
41
39
  var import_fieldSchemaMap = require("./fieldSchemaMap.cjs");
42
40
  var import_getFieldData = require("./getFieldData.cjs");
@@ -44,11 +42,11 @@ var import_getFieldType = require("./getFieldType.cjs");
44
42
  var import_handleFieldMouseDown = require("./handleFieldMouseDown.cjs");
45
43
  var import_isFieldDisabled = require("./isFieldDisabled.cjs");
46
44
  var import_multipleElementAddButton = require("./multipleElementAddButton.cjs");
47
- var import_updateFocussedState = require("./updateFocussedState.cjs");
48
- var import_types = require("./types/index.types.cjs");
49
- var import_getMultilinePlaintext = require("./getMultilinePlaintext.cjs");
50
45
  var import_postMessage = require("./types/postMessage.types.cjs");
51
46
  var import_visualBuilderPostMessage = __toESM(require("./visualBuilderPostMessage.cjs"), 1);
47
+ var import_isFieldMultiple = require("./isFieldMultiple.cjs");
48
+ var import_handleInlineEditableField = require("./handleInlineEditableField.cjs");
49
+ var import_pasteAsPlainText = require("./pasteAsPlainText.cjs");
52
50
  async function handleIndividualFields(eventDetails, elements) {
53
51
  const { fieldMetadata, editableElement } = eventDetails;
54
52
  const { visualBuilderContainer, lastEditedField, resizeObserver } = elements;
@@ -72,7 +70,7 @@ async function handleIndividualFields(eventDetails, elements) {
72
70
  import_constants.VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
73
71
  fieldType
74
72
  );
75
- if (isFieldMultiple(fieldSchema)) {
73
+ if ((0, import_isFieldMultiple.isFieldMultiple)(fieldSchema)) {
76
74
  if (lastEditedField !== editableElement) {
77
75
  const addButtonLabel = fieldSchema.data_type === "blocks" ? (
78
76
  // ? `Add ${fieldSchema.display_name ?? "Modular Block"}`
@@ -94,95 +92,17 @@ async function handleIndividualFields(eventDetails, elements) {
94
92
  );
95
93
  }
96
94
  }
97
- !disabled && handleInlineEditing();
98
- function handleInlineEditing() {
99
- if (!import_constants.ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType)) return;
100
- const index = Number(fieldMetadata.instance.fieldPathWithIndex.split(".").at(-1));
101
- const isInstance = Number.isFinite(index);
102
- if (isFieldMultiple(fieldSchema)) {
103
- let expectedFieldInstanceData = null;
104
- if (Array.isArray(expectedFieldData)) {
105
- if (!isInstance) {
106
- return;
107
- }
108
- if (index >= expectedFieldData.length) {
109
- } else {
110
- expectedFieldInstanceData = expectedFieldData.at(index);
111
- }
112
- } else {
113
- expectedFieldInstanceData = expectedFieldData;
114
- }
115
- enableInlineEditing(expectedFieldInstanceData);
116
- } else {
117
- let expectedFieldInstanceData = null;
118
- if (isInstance) {
119
- if (index !== 0) {
120
- return;
121
- }
122
- expectedFieldInstanceData = Array.isArray(expectedFieldData) ? expectedFieldData.at(0) : expectedFieldData;
123
- }
124
- enableInlineEditing(expectedFieldInstanceData ?? expectedFieldData);
125
- }
126
- function enableInlineEditing(expectedFieldData2) {
127
- let actualEditableField = editableElement;
128
- import__.VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = actualEditableField == null ? void 0 : actualEditableField.innerText;
129
- const elementComputedDisplay = window.getComputedStyle(actualEditableField).display;
130
- let textContent = editableElement.innerText || editableElement.textContent || "";
131
- if (fieldType === import_types.FieldDataType.MULTILINE) {
132
- textContent = (0, import_getMultilinePlaintext.getMultilinePlaintext)(actualEditableField);
133
- actualEditableField.addEventListener("paste", pasteAsPlainText);
134
- }
135
- const expectedTextContent = expectedFieldData2;
136
- if (expectedTextContent && textContent !== expectedTextContent || (0, import_generatePseudoEditableField.isEllipsisActive)(editableElement)) {
137
- const pseudoEditableField = (0, import_generatePseudoEditableField.generatePseudoEditableElement)(
138
- { editableElement },
139
- { textContent: expectedFieldData2 }
140
- );
141
- editableElement.style.visibility = "hidden";
142
- pseudoEditableField.setAttribute(
143
- import_constants.VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,
144
- fieldType
145
- );
146
- visualBuilderContainer.appendChild(pseudoEditableField);
147
- actualEditableField = pseudoEditableField;
148
- if (fieldType === import_types.FieldDataType.MULTILINE)
149
- actualEditableField.addEventListener(
150
- "paste",
151
- pasteAsPlainText
152
- );
153
- elements.resizeObserver.observe(pseudoEditableField);
154
- } else if (elementComputedDisplay === "inline") {
155
- const onInlineElementInput = (0, import_lodash_es.throttle)(() => {
156
- const overlayWrapper = visualBuilderContainer.querySelector(
157
- ".visual-builder__overlay__wrapper"
158
- );
159
- const focusedToolbar = visualBuilderContainer.querySelector(
160
- ".visual-builder__focused-toolbar"
161
- );
162
- (0, import_updateFocussedState.updateFocussedState)({
163
- editableElement: actualEditableField,
164
- visualBuilderContainer,
165
- overlayWrapper,
166
- focusedToolbar,
167
- resizeObserver
168
- });
169
- }, 200);
170
- actualEditableField.addEventListener(
171
- "input",
172
- onInlineElementInput
173
- );
174
- }
175
- actualEditableField.setAttribute("contenteditable", "true");
176
- actualEditableField.addEventListener("input", import_handleFieldMouseDown.handleFieldInput);
177
- actualEditableField.addEventListener("keydown", import_handleFieldMouseDown.handleFieldKeyDown);
178
- actualEditableField.focus();
179
- return;
180
- }
95
+ if (disabled) {
96
+ return;
181
97
  }
182
- }
183
- function isFieldMultiple(fieldSchema) {
184
- return fieldSchema && (fieldSchema.multiple || fieldSchema.data_type === "reference" && // @ts-ignore
185
- fieldSchema.field_metadata.ref_multiple);
98
+ (0, import_handleInlineEditableField.handleInlineEditableField)({
99
+ fieldType,
100
+ fieldSchema,
101
+ fieldMetadata,
102
+ expectedFieldData,
103
+ editableElement,
104
+ elements
105
+ });
186
106
  }
187
107
  function cleanIndividualFieldResidual(elements) {
188
108
  const { overlayWrapper, visualBuilderContainer, focusedToolbar } = elements;
@@ -210,7 +130,7 @@ function cleanIndividualFieldResidual(elements) {
210
130
  );
211
131
  previousSelectedEditableDOM.removeEventListener(
212
132
  "paste",
213
- pasteAsPlainText
133
+ import_pasteAsPlainText.pasteAsPlainText
214
134
  );
215
135
  elements.resizeObserver.unobserve(previousSelectedEditableDOM);
216
136
  }
@@ -219,7 +139,7 @@ function cleanIndividualFieldResidual(elements) {
219
139
  );
220
140
  if (pseudoEditableElement) {
221
141
  elements.resizeObserver.unobserve(pseudoEditableElement);
222
- pseudoEditableElement.removeEventListener("paste", pasteAsPlainText);
142
+ pseudoEditableElement.removeEventListener("paste", import_pasteAsPlainText.pasteAsPlainText);
223
143
  pseudoEditableElement.remove();
224
144
  if (previousSelectedEditableDOM) {
225
145
  previousSelectedEditableDOM.style.removeProperty(
@@ -229,7 +149,10 @@ function cleanIndividualFieldResidual(elements) {
229
149
  }
230
150
  if (focusedToolbar) {
231
151
  focusedToolbar.innerHTML = "";
232
- const toolbarEvents = [import_postMessage.VisualBuilderPostMessageEvents.DELETE_INSTANCE, import_postMessage.VisualBuilderPostMessageEvents.UPDATE_DISCUSSION_ID];
152
+ const toolbarEvents = [
153
+ import_postMessage.VisualBuilderPostMessageEvents.DELETE_INSTANCE,
154
+ import_postMessage.VisualBuilderPostMessageEvents.UPDATE_DISCUSSION_ID
155
+ ];
233
156
  toolbarEvents.forEach((event) => {
234
157
  var _a, _b, _c, _d;
235
158
  if ((_b = (_a = import_visualBuilderPostMessage.default) == null ? void 0 : _a.requestMessageHandlers) == null ? void 0 : _b.has(event)) {
@@ -238,19 +161,6 @@ function cleanIndividualFieldResidual(elements) {
238
161
  });
239
162
  }
240
163
  }
241
- var pasteAsPlainText = (0, import_lodash_es.debounce)(
242
- (e) => {
243
- e.preventDefault();
244
- const clipboardData = e.clipboardData;
245
- document.execCommand(
246
- "inserttext",
247
- false,
248
- clipboardData == null ? void 0 : clipboardData.getData("text/plain")
249
- );
250
- },
251
- 100,
252
- { leading: true }
253
- );
254
164
  // Annotate the CommonJS export names for ESM import in node:
255
165
  0 && (module.exports = {
256
166
  cleanIndividualFieldResidual,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/utils/handleIndividualFields.ts"],"sourcesContent":["import { debounce, throttle } from \"lodash-es\";\nimport { VisualBuilder } from \"..\";\nimport {\n generatePseudoEditableElement,\n isEllipsisActive,\n} from \"../generators/generatePseudoEditableField\";\nimport { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport {\n ALLOWED_INLINE_EDITABLE_FIELD,\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n} from \"./constants\";\nimport { FieldSchemaMap } from \"./fieldSchemaMap\";\nimport { getFieldData } from \"./getFieldData\";\nimport { getFieldType } from \"./getFieldType\";\nimport { handleFieldInput, handleFieldKeyDown } from \"./handleFieldMouseDown\";\nimport { isFieldDisabled } from \"./isFieldDisabled\";\nimport {\n handleAddButtonsForMultiple,\n removeAddInstanceButtons,\n} from \"./multipleElementAddButton\";\nimport { updateFocussedState } from \"./updateFocussedState\";\nimport { FieldDataType, ISchemaFieldMap } from \"./types/index.types\";\nimport { getMultilinePlaintext } from \"./getMultilinePlaintext\";\nimport { VisualBuilderPostMessageEvents } from \"./types/postMessage.types\";\nimport visualBuilderPostMessage from \"./visualBuilderPostMessage\";\n\n/**\n * It handles all the fields based on their data type and its \"multiple\" property.\n * @param eventDetails The event details object that contain cslp and field metadata.\n * @param elements The elements object that contain the visual builder wrapper.\n */\nexport async function handleIndividualFields(\n eventDetails: VisualBuilderCslpEventDetails,\n elements: {\n visualBuilderContainer: HTMLDivElement;\n resizeObserver: ResizeObserver;\n lastEditedField: Element | null;\n }\n): Promise<void> {\n const { fieldMetadata, editableElement } = eventDetails;\n const { visualBuilderContainer, lastEditedField, resizeObserver } =\n elements;\n const {\n content_type_uid,\n entry_uid,\n locale,\n fieldPath,\n fieldPathWithIndex,\n } = fieldMetadata;\n\n const [fieldSchema, expectedFieldData] = await Promise.all([\n FieldSchemaMap.getFieldSchema(content_type_uid, fieldPath),\n getFieldData(\n { content_type_uid, entry_uid, locale },\n fieldPathWithIndex\n ),\n ]);\n\n const fieldType = getFieldType(fieldSchema);\n\n const { isDisabled: disabled } = isFieldDisabled(fieldSchema, eventDetails);\n\n editableElement.setAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n fieldType\n );\n\n if (isFieldMultiple(fieldSchema)) {\n if (lastEditedField !== editableElement) {\n const addButtonLabel =\n fieldSchema.data_type === \"blocks\"\n ? // ? `Add ${fieldSchema.display_name ?? \"Modular Block\"}`\n \"Add Section\"\n : undefined;\n\n handleAddButtonsForMultiple(\n eventDetails,\n {\n editableElement: eventDetails.editableElement,\n visualBuilderContainer: visualBuilderContainer,\n resizeObserver: resizeObserver,\n },\n {\n fieldSchema,\n expectedFieldData,\n disabled,\n label: addButtonLabel,\n }\n );\n }\n } \n\n !disabled && handleInlineEditing();\n\n /**\n * Handles inline editing for supported fields.\n */\n function handleInlineEditing() {\n\n if (!ALLOWED_INLINE_EDITABLE_FIELD.includes(fieldType)) return;\n\n // Instances of ALLOWED_INLINE_EDITABLE_FIELD will always have index at last\n const index = Number(fieldMetadata.instance.fieldPathWithIndex.split('.').at(-1));\n const isInstance = Number.isFinite(index);\n\n // CASE 1: Handle inline editing for multiple field\n if(isFieldMultiple(fieldSchema)) {\n let expectedFieldInstanceData = null;\n if(Array.isArray(expectedFieldData)) {\n // CASE: Selected element is the multiple field itself.\n // Inline Editing not allowed on field, only allowed on instance.\n // (We recieve unreliable `multipleFieldMetadata` in this case)\n if(!isInstance) {\n return;\n }\n\n // CASE: Value does not exist for the provided instance's index\n if(index >= expectedFieldData.length) {\n // TODO: What should be the behavior here?\n }\n else {\n expectedFieldInstanceData = expectedFieldData.at(index);\n }\n }\n // CASE: ContentType's Field changed from single to multiple, while Entry's Field still single.\n else {\n expectedFieldInstanceData = expectedFieldData;\n }\n\n enableInlineEditing(expectedFieldInstanceData); \n }\n // CASE 2: Handle inline editing for a single field\n else {\n let expectedFieldInstanceData = null;\n // CASE: ContentType's Field changed from multiple to single, while Entry's Field still multiple.\n if(isInstance) {\n if(index !== 0) {\n // TODO: Handle this with UX\n // Let user know, CSLP is invalid due to change in Content Type\n return;\n }\n expectedFieldInstanceData = Array.isArray(expectedFieldData) ? expectedFieldData.at(0) : expectedFieldData;\n }\n enableInlineEditing(expectedFieldInstanceData ?? expectedFieldData);\n }\n\n function enableInlineEditing(expectedFieldData: any) {\n\n let actualEditableField = editableElement as HTMLElement;\n\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue =\n actualEditableField?.innerText;\n\n const elementComputedDisplay =\n window.getComputedStyle(actualEditableField).display;\n\n let textContent =\n (editableElement as HTMLElement).innerText ||\n editableElement.textContent ||\n \"\";\n\n if (fieldType === FieldDataType.MULTILINE) {\n textContent = getMultilinePlaintext(actualEditableField);\n actualEditableField.addEventListener(\"paste\", pasteAsPlainText);\n }\n const expectedTextContent = expectedFieldData;\n if (\n (expectedTextContent && textContent !== expectedTextContent) ||\n isEllipsisActive(editableElement as HTMLElement)\n ) {\n \n // TODO: Testing will be done in the E2E.\n const pseudoEditableField = generatePseudoEditableElement(\n { editableElement: editableElement as HTMLElement },\n { textContent: expectedFieldData }\n );\n\n (editableElement as HTMLElement).style.visibility = \"hidden\";\n\n // set field type attribute to the pseudo editable field\n // ensures proper keydown handling similar to the actual editable field\n pseudoEditableField.setAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n fieldType\n );\n visualBuilderContainer.appendChild(pseudoEditableField);\n actualEditableField = pseudoEditableField;\n\n if (fieldType === FieldDataType.MULTILINE)\n actualEditableField.addEventListener(\n \"paste\",\n pasteAsPlainText\n );\n\n // we will unobserve this in hideOverlay\n elements.resizeObserver.observe(pseudoEditableField);\n } else if (elementComputedDisplay === \"inline\") {\n // if the editable field is inline\n const onInlineElementInput = throttle(() => {\n const overlayWrapper = visualBuilderContainer.querySelector(\n \".visual-builder__overlay__wrapper\"\n ) as HTMLDivElement;\n const focusedToolbar = visualBuilderContainer.querySelector(\n \".visual-builder__focused-toolbar\"\n ) as HTMLDivElement;\n updateFocussedState({\n editableElement: actualEditableField,\n visualBuilderContainer,\n overlayWrapper,\n focusedToolbar,\n resizeObserver,\n });\n }, 200);\n actualEditableField.addEventListener(\n \"input\",\n onInlineElementInput\n );\n }\n\n actualEditableField.setAttribute(\"contenteditable\", \"true\");\n actualEditableField.addEventListener(\"input\", handleFieldInput);\n actualEditableField.addEventListener(\"keydown\", handleFieldKeyDown);\n // focus on the contenteditable element to start accepting input\n actualEditableField.focus();\n\n return;\n }\n }\n}\n\nfunction isFieldMultiple(fieldSchema: ISchemaFieldMap): boolean {\n return fieldSchema &&\n (fieldSchema.multiple ||\n (fieldSchema.data_type === \"reference\" &&\n // @ts-ignore\n fieldSchema.field_metadata.ref_multiple));\n}\n\nexport function cleanIndividualFieldResidual(elements: {\n overlayWrapper: HTMLDivElement;\n visualBuilderContainer: HTMLDivElement | null;\n focusedToolbar: HTMLDivElement | null;\n resizeObserver: ResizeObserver;\n}): void {\n const { overlayWrapper, visualBuilderContainer, focusedToolbar } = elements;\n\n removeAddInstanceButtons(\n {\n eventTarget: null,\n visualBuilderContainer: visualBuilderContainer,\n overlayWrapper: overlayWrapper,\n },\n true\n );\n\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (previousSelectedEditableDOM) {\n previousSelectedEditableDOM.removeAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n );\n previousSelectedEditableDOM.removeAttribute(\"contenteditable\");\n previousSelectedEditableDOM.removeEventListener(\n \"input\",\n handleFieldInput\n );\n previousSelectedEditableDOM.removeEventListener(\n \"keydown\",\n handleFieldKeyDown\n );\n\n previousSelectedEditableDOM.removeEventListener(\n \"paste\",\n pasteAsPlainText\n );\n // Note - this happens in two places, 1. hideOverlay and 2. here\n // TODO maybe see all usages of both functions and try to do it in one place\n elements.resizeObserver.unobserve(previousSelectedEditableDOM);\n }\n\n const pseudoEditableElement = visualBuilderContainer?.querySelector(\n \".visual-builder__pseudo-editable-element\"\n );\n if (pseudoEditableElement) {\n elements.resizeObserver.unobserve(pseudoEditableElement);\n pseudoEditableElement.removeEventListener(\"paste\", pasteAsPlainText);\n pseudoEditableElement.remove();\n if (previousSelectedEditableDOM) {\n (previousSelectedEditableDOM as HTMLElement).style.removeProperty(\n \"visibility\"\n );\n }\n }\n\n if (focusedToolbar) {\n focusedToolbar.innerHTML = \"\";\n const toolbarEvents = [VisualBuilderPostMessageEvents.DELETE_INSTANCE, VisualBuilderPostMessageEvents.UPDATE_DISCUSSION_ID]\n toolbarEvents.forEach((event) => {\n //@ts-expect-error - We are accessing private method here, but it is necessary to clean up the event listeners.\n if (visualBuilderPostMessage?.requestMessageHandlers?.has(event)) {\n //@ts-expect-error - We are accessing private method here, but it is necessary to clean up the event listeners.\n visualBuilderPostMessage?.unregisterEvent?.(event);\n }\n });\n }\n}\n\nconst pasteAsPlainText = debounce(\n (e: Event) => {\n e.preventDefault();\n const clipboardData = (e as ClipboardEvent).clipboardData;\n document.execCommand(\n \"inserttext\",\n false,\n clipboardData?.getData(\"text/plain\")\n );\n },\n 100,\n { leading: true }\n);\n"],"mappings":"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","names":["expectedFieldData","visualBuilderPostMessage"]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/utils/handleIndividualFields.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport { VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY } from \"./constants\";\nimport { FieldSchemaMap } from \"./fieldSchemaMap\";\nimport { getFieldData } from \"./getFieldData\";\nimport { getFieldType } from \"./getFieldType\";\nimport { handleFieldInput, handleFieldKeyDown } from \"./handleFieldMouseDown\";\nimport { isFieldDisabled } from \"./isFieldDisabled\";\nimport {\n handleAddButtonsForMultiple,\n removeAddInstanceButtons,\n} from \"./multipleElementAddButton\";\nimport { VisualBuilderPostMessageEvents } from \"./types/postMessage.types\";\nimport visualBuilderPostMessage from \"./visualBuilderPostMessage\";\nimport { isFieldMultiple } from \"./isFieldMultiple\";\nimport { handleInlineEditableField } from \"./handleInlineEditableField\";\nimport { VisualBuilderEditContext } from \"./types/index.types\";\nimport { pasteAsPlainText } from \"./pasteAsPlainText\";\n\n/**\n * It handles all the fields based on their data type and its \"multiple\" property.\n * @param eventDetails The event details object that contain cslp and field metadata.\n * @param elements The elements object that contain the visual builder wrapper.\n */\nexport async function handleIndividualFields(\n eventDetails: VisualBuilderCslpEventDetails,\n elements: VisualBuilderEditContext\n): Promise<void> {\n const { fieldMetadata, editableElement } = eventDetails;\n const { visualBuilderContainer, lastEditedField, resizeObserver } =\n elements;\n const {\n content_type_uid,\n entry_uid,\n locale,\n fieldPath,\n fieldPathWithIndex,\n } = fieldMetadata;\n\n const [fieldSchema, expectedFieldData] = await Promise.all([\n FieldSchemaMap.getFieldSchema(content_type_uid, fieldPath),\n getFieldData(\n { content_type_uid, entry_uid, locale },\n fieldPathWithIndex\n ),\n ]);\n\n const fieldType = getFieldType(fieldSchema);\n\n const { isDisabled: disabled } = isFieldDisabled(fieldSchema, eventDetails);\n\n editableElement.setAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY,\n fieldType\n );\n\n if (isFieldMultiple(fieldSchema)) {\n if (lastEditedField !== editableElement) {\n const addButtonLabel =\n fieldSchema.data_type === \"blocks\"\n ? // ? `Add ${fieldSchema.display_name ?? \"Modular Block\"}`\n \"Add Section\"\n : undefined;\n\n handleAddButtonsForMultiple(\n eventDetails,\n {\n editableElement: eventDetails.editableElement,\n visualBuilderContainer: visualBuilderContainer,\n resizeObserver: resizeObserver,\n },\n {\n fieldSchema,\n expectedFieldData,\n disabled,\n label: addButtonLabel,\n }\n );\n }\n }\n\n if (disabled) {\n return;\n }\n handleInlineEditableField({\n fieldType,\n fieldSchema,\n fieldMetadata,\n expectedFieldData,\n editableElement: editableElement as HTMLElement,\n elements,\n });\n}\n\nexport function cleanIndividualFieldResidual(elements: {\n overlayWrapper: HTMLDivElement;\n visualBuilderContainer: HTMLDivElement | null;\n focusedToolbar: HTMLDivElement | null;\n resizeObserver: ResizeObserver;\n}): void {\n const { overlayWrapper, visualBuilderContainer, focusedToolbar } = elements;\n\n removeAddInstanceButtons(\n {\n eventTarget: null,\n visualBuilderContainer: visualBuilderContainer,\n overlayWrapper: overlayWrapper,\n },\n true\n );\n\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n if (previousSelectedEditableDOM) {\n previousSelectedEditableDOM.removeAttribute(\n VISUAL_BUILDER_FIELD_TYPE_ATTRIBUTE_KEY\n );\n previousSelectedEditableDOM.removeAttribute(\"contenteditable\");\n previousSelectedEditableDOM.removeEventListener(\n \"input\",\n handleFieldInput\n );\n previousSelectedEditableDOM.removeEventListener(\n \"keydown\",\n handleFieldKeyDown\n );\n\n previousSelectedEditableDOM.removeEventListener(\n \"paste\",\n pasteAsPlainText\n );\n // Note - this happens in two places, 1. hideOverlay and 2. here\n // TODO maybe see all usages of both functions and try to do it in one place\n elements.resizeObserver.unobserve(previousSelectedEditableDOM);\n }\n\n const pseudoEditableElement = visualBuilderContainer?.querySelector(\n \".visual-builder__pseudo-editable-element\"\n );\n if (pseudoEditableElement) {\n elements.resizeObserver.unobserve(pseudoEditableElement);\n pseudoEditableElement.removeEventListener(\"paste\", pasteAsPlainText);\n pseudoEditableElement.remove();\n if (previousSelectedEditableDOM) {\n (previousSelectedEditableDOM as HTMLElement).style.removeProperty(\n \"visibility\"\n );\n }\n }\n\n if (focusedToolbar) {\n focusedToolbar.innerHTML = \"\";\n const toolbarEvents = [\n VisualBuilderPostMessageEvents.DELETE_INSTANCE,\n VisualBuilderPostMessageEvents.UPDATE_DISCUSSION_ID,\n ];\n toolbarEvents.forEach((event) => {\n //@ts-expect-error - We are accessing private method here, but it is necessary to clean up the event listeners.\n if (visualBuilderPostMessage?.requestMessageHandlers?.has(event)) {\n //@ts-expect-error - We are accessing private method here, but it is necessary to clean up the event listeners.\n visualBuilderPostMessage?.unregisterEvent?.(event);\n }\n });\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAA8B;AAE9B,uBAAwD;AACxD,4BAA+B;AAC/B,0BAA6B;AAC7B,0BAA6B;AAC7B,kCAAqD;AACrD,6BAAgC;AAChC,sCAGO;AACP,yBAA+C;AAC/C,sCAAqC;AACrC,6BAAgC;AAChC,uCAA0C;AAE1C,8BAAiC;AAOjC,eAAsB,uBAClB,cACA,UACa;AACb,QAAM,EAAE,eAAe,gBAAgB,IAAI;AAC3C,QAAM,EAAE,wBAAwB,iBAAiB,eAAe,IAC5D;AACJ,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,IAAI;AAEJ,QAAM,CAAC,aAAa,iBAAiB,IAAI,MAAM,QAAQ,IAAI;AAAA,IACvD,qCAAe,eAAe,kBAAkB,SAAS;AAAA,QACzD;AAAA,MACI,EAAE,kBAAkB,WAAW,OAAO;AAAA,MACtC;AAAA,IACJ;AAAA,EACJ,CAAC;AAED,QAAM,gBAAY,kCAAa,WAAW;AAE1C,QAAM,EAAE,YAAY,SAAS,QAAI,wCAAgB,aAAa,YAAY;AAE1E,kBAAgB;AAAA,IACZ;AAAA,IACA;AAAA,EACJ;AAEA,UAAI,wCAAgB,WAAW,GAAG;AAC9B,QAAI,oBAAoB,iBAAiB;AACrC,YAAM,iBACF,YAAY,cAAc;AAAA;AAAA,QAEpB;AAAA,UACA;AAEV;AAAA,QACI;AAAA,QACA;AAAA,UACI,iBAAiB,aAAa;AAAA,UAC9B;AAAA,UACA;AAAA,QACJ;AAAA,QACA;AAAA,UACI;AAAA,UACA;AAAA,UACA;AAAA,UACA,OAAO;AAAA,QACX;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AAEA,MAAI,UAAU;AACV;AAAA,EACJ;AACA,kEAA0B;AAAA,IACtB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,CAAC;AACL;AAEO,SAAS,6BAA6B,UAKpC;AACL,QAAM,EAAE,gBAAgB,wBAAwB,eAAe,IAAI;AAEnE;AAAA,IACI;AAAA,MACI,aAAa;AAAA,MACb;AAAA,MACA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,8BACF,uBAAc,yBAAyB,MAClC;AACT,MAAI,6BAA6B;AAC7B,gCAA4B;AAAA,MACxB;AAAA,IACJ;AACA,gCAA4B,gBAAgB,iBAAiB;AAC7D,gCAA4B;AAAA,MACxB;AAAA,MACA;AAAA,IACJ;AACA,gCAA4B;AAAA,MACxB;AAAA,MACA;AAAA,IACJ;AAEA,gCAA4B;AAAA,MACxB;AAAA,MACA;AAAA,IACJ;AAGA,aAAS,eAAe,UAAU,2BAA2B;AAAA,EACjE;AAEA,QAAM,wBAAwB,iEAAwB;AAAA,IAClD;AAAA;AAEJ,MAAI,uBAAuB;AACvB,aAAS,eAAe,UAAU,qBAAqB;AACvD,0BAAsB,oBAAoB,SAAS,wCAAgB;AACnE,0BAAsB,OAAO;AAC7B,QAAI,6BAA6B;AAC7B,MAAC,4BAA4C,MAAM;AAAA,QAC/C;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AAEA,MAAI,gBAAgB;AAChB,mBAAe,YAAY;AAC3B,UAAM,gBAAgB;AAAA,MAClB,kDAA+B;AAAA,MAC/B,kDAA+B;AAAA,IACnC;AACA,kBAAc,QAAQ,CAAC,UAAU;AA7JzC;AA+JY,WAAI,2CAAAA,YAAA,mBAA0B,2BAA1B,mBAAkD,IAAI,QAAQ;AAE9D,oDAAAA,YAAA,mBAA0B,oBAA1B,4BAA4C;AAAA,MAChD;AAAA,IACJ,CAAC;AAAA,EACL;AACJ;","names":["visualBuilderPostMessage"]}
@@ -1,16 +1,14 @@
1
1
  import { VisualBuilderCslpEventDetails } from '../types/visualBuilder.types.cjs';
2
+ import { VisualBuilderEditContext } from './types/index.types.cjs';
2
3
  import '../../cslp/types/cslp.types.cjs';
4
+ import '../../cms/types/contentTypeSchema.types.cjs';
3
5
 
4
6
  /**
5
7
  * It handles all the fields based on their data type and its "multiple" property.
6
8
  * @param eventDetails The event details object that contain cslp and field metadata.
7
9
  * @param elements The elements object that contain the visual builder wrapper.
8
10
  */
9
- declare function handleIndividualFields(eventDetails: VisualBuilderCslpEventDetails, elements: {
10
- visualBuilderContainer: HTMLDivElement;
11
- resizeObserver: ResizeObserver;
12
- lastEditedField: Element | null;
13
- }): Promise<void>;
11
+ declare function handleIndividualFields(eventDetails: VisualBuilderCslpEventDetails, elements: VisualBuilderEditContext): Promise<void>;
14
12
  declare function cleanIndividualFieldResidual(elements: {
15
13
  overlayWrapper: HTMLDivElement;
16
14
  visualBuilderContainer: HTMLDivElement | null;
@@ -1,16 +1,14 @@
1
1
  import { VisualBuilderCslpEventDetails } from '../types/visualBuilder.types.js';
2
+ import { VisualBuilderEditContext } from './types/index.types.js';
2
3
  import '../../cslp/types/cslp.types.js';
4
+ import '../../cms/types/contentTypeSchema.types.js';
3
5
 
4
6
  /**
5
7
  * It handles all the fields based on their data type and its "multiple" property.
6
8
  * @param eventDetails The event details object that contain cslp and field metadata.
7
9
  * @param elements The elements object that contain the visual builder wrapper.
8
10
  */
9
- declare function handleIndividualFields(eventDetails: VisualBuilderCslpEventDetails, elements: {
10
- visualBuilderContainer: HTMLDivElement;
11
- resizeObserver: ResizeObserver;
12
- lastEditedField: Element | null;
13
- }): Promise<void>;
11
+ declare function handleIndividualFields(eventDetails: VisualBuilderCslpEventDetails, elements: VisualBuilderEditContext): Promise<void>;
14
12
  declare function cleanIndividualFieldResidual(elements: {
15
13
  overlayWrapper: HTMLDivElement;
16
14
  visualBuilderContainer: HTMLDivElement | null;