@contentstack/live-preview-utils 4.2.1 → 4.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (238) hide show
  1. package/README.md +96 -30
  2. package/dist/legacy/configManager/config.default.cjs +4 -2
  3. package/dist/legacy/configManager/config.default.cjs.map +1 -1
  4. package/dist/legacy/configManager/config.default.d.cts +1 -1
  5. package/dist/legacy/configManager/config.default.d.ts +1 -1
  6. package/dist/legacy/configManager/config.default.js +4 -2
  7. package/dist/legacy/configManager/config.default.js.map +1 -1
  8. package/dist/legacy/configManager/handleUserConfig.cjs +4 -0
  9. package/dist/legacy/configManager/handleUserConfig.cjs.map +1 -1
  10. package/dist/legacy/configManager/handleUserConfig.js +4 -0
  11. package/dist/legacy/configManager/handleUserConfig.js.map +1 -1
  12. package/dist/legacy/cslp/cslpdata.cjs +28 -3
  13. package/dist/legacy/cslp/cslpdata.cjs.map +1 -1
  14. package/dist/legacy/cslp/cslpdata.d.cts +27 -1
  15. package/dist/legacy/cslp/cslpdata.d.ts +27 -1
  16. package/dist/legacy/cslp/cslpdata.js +26 -2
  17. package/dist/legacy/cslp/cslpdata.js.map +1 -1
  18. package/dist/legacy/cslp/index.d.cts +1 -1
  19. package/dist/legacy/cslp/index.d.ts +1 -1
  20. package/dist/legacy/light-sdk.cjs +1 -1
  21. package/dist/legacy/light-sdk.js +1 -1
  22. package/dist/legacy/livePreview/editButton/editButton.cjs +3 -1
  23. package/dist/legacy/livePreview/editButton/editButton.cjs.map +1 -1
  24. package/dist/legacy/livePreview/editButton/editButton.js +4 -2
  25. package/dist/legacy/livePreview/editButton/editButton.js.map +1 -1
  26. package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.cjs +11 -6
  27. package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.cjs.map +1 -1
  28. package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.js +11 -6
  29. package/dist/legacy/livePreview/eventManager/postMessageEvent.hooks.js.map +1 -1
  30. package/dist/legacy/preview/contentstack-live-preview-HOC.cjs +1 -1
  31. package/dist/legacy/preview/contentstack-live-preview-HOC.js +1 -1
  32. package/dist/legacy/timeline/compare/compare.cjs +3 -1
  33. package/dist/legacy/timeline/compare/compare.cjs.map +1 -1
  34. package/dist/legacy/timeline/compare/compare.js +3 -1
  35. package/dist/legacy/timeline/compare/compare.js.map +1 -1
  36. package/dist/legacy/types/types.cjs.map +1 -1
  37. package/dist/legacy/types/types.d.cts +2 -0
  38. package/dist/legacy/types/types.d.ts +2 -0
  39. package/dist/legacy/types/types.js.map +1 -1
  40. package/dist/legacy/visualBuilder/components/fieldLabelWrapper.cjs +112 -28
  41. package/dist/legacy/visualBuilder/components/fieldLabelWrapper.cjs.map +1 -1
  42. package/dist/legacy/visualBuilder/components/fieldLabelWrapper.js +114 -30
  43. package/dist/legacy/visualBuilder/components/fieldLabelWrapper.js.map +1 -1
  44. package/dist/legacy/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.cjs +3 -2
  45. package/dist/legacy/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.cjs.map +1 -1
  46. package/dist/legacy/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.js +3 -2
  47. package/dist/legacy/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.js.map +1 -1
  48. package/dist/legacy/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.cjs +2 -2
  49. package/dist/legacy/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.cjs.map +1 -1
  50. package/dist/legacy/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.js +3 -3
  51. package/dist/legacy/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.js.map +1 -1
  52. package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs +1 -1
  53. package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs.map +1 -1
  54. package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.js +2 -2
  55. package/dist/legacy/visualBuilder/eventManager/useVariantsPostMessageEvent.js.map +1 -1
  56. package/dist/legacy/visualBuilder/generators/generateEmptyBlock.cjs +1 -1
  57. package/dist/legacy/visualBuilder/generators/generateEmptyBlock.cjs.map +1 -1
  58. package/dist/legacy/visualBuilder/generators/generateEmptyBlock.js +2 -2
  59. package/dist/legacy/visualBuilder/generators/generateEmptyBlock.js.map +1 -1
  60. package/dist/legacy/visualBuilder/generators/generateHighlightedComment.cjs +2 -1
  61. package/dist/legacy/visualBuilder/generators/generateHighlightedComment.cjs.map +1 -1
  62. package/dist/legacy/visualBuilder/generators/generateHighlightedComment.js +2 -1
  63. package/dist/legacy/visualBuilder/generators/generateHighlightedComment.js.map +1 -1
  64. package/dist/legacy/visualBuilder/generators/generateOverlay.cjs +1 -1
  65. package/dist/legacy/visualBuilder/generators/generateOverlay.cjs.map +1 -1
  66. package/dist/legacy/visualBuilder/generators/generateOverlay.js +2 -2
  67. package/dist/legacy/visualBuilder/generators/generateOverlay.js.map +1 -1
  68. package/dist/legacy/visualBuilder/generators/generateThread.d.cts +1 -1
  69. package/dist/legacy/visualBuilder/generators/generateThread.d.ts +1 -1
  70. package/dist/legacy/visualBuilder/index.cjs +1 -1
  71. package/dist/legacy/visualBuilder/index.cjs.map +1 -1
  72. package/dist/legacy/visualBuilder/index.js +2 -2
  73. package/dist/legacy/visualBuilder/index.js.map +1 -1
  74. package/dist/legacy/visualBuilder/listeners/mouseClick.cjs +14 -10
  75. package/dist/legacy/visualBuilder/listeners/mouseClick.cjs.map +1 -1
  76. package/dist/legacy/visualBuilder/listeners/mouseClick.js +14 -10
  77. package/dist/legacy/visualBuilder/listeners/mouseClick.js.map +1 -1
  78. package/dist/legacy/visualBuilder/utils/collabUtils.d.cts +1 -1
  79. package/dist/legacy/visualBuilder/utils/collabUtils.d.ts +1 -1
  80. package/dist/legacy/visualBuilder/utils/getCsDataOfElement.cjs +3 -3
  81. package/dist/legacy/visualBuilder/utils/getCsDataOfElement.cjs.map +1 -1
  82. package/dist/legacy/visualBuilder/utils/getCsDataOfElement.js +4 -4
  83. package/dist/legacy/visualBuilder/utils/getCsDataOfElement.js.map +1 -1
  84. package/dist/legacy/visualBuilder/utils/getEntryIdentifiersInCurrentPage.cjs +1 -1
  85. package/dist/legacy/visualBuilder/utils/getEntryIdentifiersInCurrentPage.cjs.map +1 -1
  86. package/dist/legacy/visualBuilder/utils/getEntryIdentifiersInCurrentPage.js +2 -2
  87. package/dist/legacy/visualBuilder/utils/getEntryIdentifiersInCurrentPage.js.map +1 -1
  88. package/dist/legacy/visualBuilder/utils/getVisualBuilderRedirectionUrl.cjs +2 -2
  89. package/dist/legacy/visualBuilder/utils/getVisualBuilderRedirectionUrl.cjs.map +1 -1
  90. package/dist/legacy/visualBuilder/utils/getVisualBuilderRedirectionUrl.js +3 -3
  91. package/dist/legacy/visualBuilder/utils/getVisualBuilderRedirectionUrl.js.map +1 -1
  92. package/dist/legacy/visualBuilder/utils/getWorkflowStageDetails.cjs +4 -0
  93. package/dist/legacy/visualBuilder/utils/getWorkflowStageDetails.cjs.map +1 -1
  94. package/dist/legacy/visualBuilder/utils/getWorkflowStageDetails.d.cts +8 -1
  95. package/dist/legacy/visualBuilder/utils/getWorkflowStageDetails.d.ts +8 -1
  96. package/dist/legacy/visualBuilder/utils/getWorkflowStageDetails.js +4 -0
  97. package/dist/legacy/visualBuilder/utils/getWorkflowStageDetails.js.map +1 -1
  98. package/dist/legacy/visualBuilder/utils/isFieldDisabled.cjs +41 -6
  99. package/dist/legacy/visualBuilder/utils/isFieldDisabled.cjs.map +1 -1
  100. package/dist/legacy/visualBuilder/utils/isFieldDisabled.d.cts +9 -1
  101. package/dist/legacy/visualBuilder/utils/isFieldDisabled.d.ts +9 -1
  102. package/dist/legacy/visualBuilder/utils/isFieldDisabled.js +41 -6
  103. package/dist/legacy/visualBuilder/utils/isFieldDisabled.js.map +1 -1
  104. package/dist/legacy/visualBuilder/utils/types/postMessage.types.cjs +1 -0
  105. package/dist/legacy/visualBuilder/utils/types/postMessage.types.cjs.map +1 -1
  106. package/dist/legacy/visualBuilder/utils/types/postMessage.types.d.cts +1 -0
  107. package/dist/legacy/visualBuilder/utils/types/postMessage.types.d.ts +1 -0
  108. package/dist/legacy/visualBuilder/utils/types/postMessage.types.js +1 -0
  109. package/dist/legacy/visualBuilder/utils/types/postMessage.types.js.map +1 -1
  110. package/dist/legacy/visualBuilder/utils/updateFocussedState.cjs +1 -1
  111. package/dist/legacy/visualBuilder/utils/updateFocussedState.cjs.map +1 -1
  112. package/dist/legacy/visualBuilder/utils/updateFocussedState.js +2 -2
  113. package/dist/legacy/visualBuilder/utils/updateFocussedState.js.map +1 -1
  114. package/dist/legacy/visualBuilder/visualBuilder.style.cjs +30 -0
  115. package/dist/legacy/visualBuilder/visualBuilder.style.cjs.map +1 -1
  116. package/dist/legacy/visualBuilder/visualBuilder.style.d.cts +5 -0
  117. package/dist/legacy/visualBuilder/visualBuilder.style.d.ts +5 -0
  118. package/dist/legacy/visualBuilder/visualBuilder.style.js +30 -0
  119. package/dist/legacy/visualBuilder/visualBuilder.style.js.map +1 -1
  120. package/dist/modern/configManager/config.default.cjs +4 -2
  121. package/dist/modern/configManager/config.default.cjs.map +1 -1
  122. package/dist/modern/configManager/config.default.d.cts +1 -1
  123. package/dist/modern/configManager/config.default.d.ts +1 -1
  124. package/dist/modern/configManager/config.default.js +4 -2
  125. package/dist/modern/configManager/config.default.js.map +1 -1
  126. package/dist/modern/configManager/handleUserConfig.cjs +4 -0
  127. package/dist/modern/configManager/handleUserConfig.cjs.map +1 -1
  128. package/dist/modern/configManager/handleUserConfig.js +4 -0
  129. package/dist/modern/configManager/handleUserConfig.js.map +1 -1
  130. package/dist/modern/cslp/cslpdata.cjs +28 -3
  131. package/dist/modern/cslp/cslpdata.cjs.map +1 -1
  132. package/dist/modern/cslp/cslpdata.d.cts +27 -1
  133. package/dist/modern/cslp/cslpdata.d.ts +27 -1
  134. package/dist/modern/cslp/cslpdata.js +26 -2
  135. package/dist/modern/cslp/cslpdata.js.map +1 -1
  136. package/dist/modern/cslp/index.d.cts +1 -1
  137. package/dist/modern/cslp/index.d.ts +1 -1
  138. package/dist/modern/light-sdk.cjs +1 -1
  139. package/dist/modern/light-sdk.js +1 -1
  140. package/dist/modern/livePreview/editButton/editButton.cjs +3 -1
  141. package/dist/modern/livePreview/editButton/editButton.cjs.map +1 -1
  142. package/dist/modern/livePreview/editButton/editButton.js +4 -2
  143. package/dist/modern/livePreview/editButton/editButton.js.map +1 -1
  144. package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.cjs +11 -6
  145. package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.cjs.map +1 -1
  146. package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.js +11 -6
  147. package/dist/modern/livePreview/eventManager/postMessageEvent.hooks.js.map +1 -1
  148. package/dist/modern/preview/contentstack-live-preview-HOC.cjs +1 -1
  149. package/dist/modern/preview/contentstack-live-preview-HOC.js +1 -1
  150. package/dist/modern/timeline/compare/compare.cjs +3 -1
  151. package/dist/modern/timeline/compare/compare.cjs.map +1 -1
  152. package/dist/modern/timeline/compare/compare.js +3 -1
  153. package/dist/modern/timeline/compare/compare.js.map +1 -1
  154. package/dist/modern/types/types.cjs.map +1 -1
  155. package/dist/modern/types/types.d.cts +2 -0
  156. package/dist/modern/types/types.d.ts +2 -0
  157. package/dist/modern/types/types.js.map +1 -1
  158. package/dist/modern/visualBuilder/components/fieldLabelWrapper.cjs +111 -28
  159. package/dist/modern/visualBuilder/components/fieldLabelWrapper.cjs.map +1 -1
  160. package/dist/modern/visualBuilder/components/fieldLabelWrapper.js +113 -30
  161. package/dist/modern/visualBuilder/components/fieldLabelWrapper.js.map +1 -1
  162. package/dist/modern/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.cjs +3 -2
  163. package/dist/modern/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.cjs.map +1 -1
  164. package/dist/modern/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.js +3 -2
  165. package/dist/modern/visualBuilder/eventManager/useRecalculateVariantDataCSLPValues.js.map +1 -1
  166. package/dist/modern/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.cjs +2 -2
  167. package/dist/modern/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.cjs.map +1 -1
  168. package/dist/modern/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.js +3 -3
  169. package/dist/modern/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.js.map +1 -1
  170. package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs +1 -1
  171. package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.cjs.map +1 -1
  172. package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.js +2 -2
  173. package/dist/modern/visualBuilder/eventManager/useVariantsPostMessageEvent.js.map +1 -1
  174. package/dist/modern/visualBuilder/generators/generateEmptyBlock.cjs +1 -1
  175. package/dist/modern/visualBuilder/generators/generateEmptyBlock.cjs.map +1 -1
  176. package/dist/modern/visualBuilder/generators/generateEmptyBlock.js +2 -2
  177. package/dist/modern/visualBuilder/generators/generateEmptyBlock.js.map +1 -1
  178. package/dist/modern/visualBuilder/generators/generateHighlightedComment.cjs +2 -1
  179. package/dist/modern/visualBuilder/generators/generateHighlightedComment.cjs.map +1 -1
  180. package/dist/modern/visualBuilder/generators/generateHighlightedComment.js +2 -1
  181. package/dist/modern/visualBuilder/generators/generateHighlightedComment.js.map +1 -1
  182. package/dist/modern/visualBuilder/generators/generateOverlay.cjs +1 -1
  183. package/dist/modern/visualBuilder/generators/generateOverlay.cjs.map +1 -1
  184. package/dist/modern/visualBuilder/generators/generateOverlay.js +2 -2
  185. package/dist/modern/visualBuilder/generators/generateOverlay.js.map +1 -1
  186. package/dist/modern/visualBuilder/generators/generateThread.d.cts +1 -1
  187. package/dist/modern/visualBuilder/generators/generateThread.d.ts +1 -1
  188. package/dist/modern/visualBuilder/index.cjs +1 -1
  189. package/dist/modern/visualBuilder/index.cjs.map +1 -1
  190. package/dist/modern/visualBuilder/index.js +2 -2
  191. package/dist/modern/visualBuilder/index.js.map +1 -1
  192. package/dist/modern/visualBuilder/listeners/mouseClick.cjs +14 -10
  193. package/dist/modern/visualBuilder/listeners/mouseClick.cjs.map +1 -1
  194. package/dist/modern/visualBuilder/listeners/mouseClick.js +14 -10
  195. package/dist/modern/visualBuilder/listeners/mouseClick.js.map +1 -1
  196. package/dist/modern/visualBuilder/utils/collabUtils.d.cts +1 -1
  197. package/dist/modern/visualBuilder/utils/collabUtils.d.ts +1 -1
  198. package/dist/modern/visualBuilder/utils/getCsDataOfElement.cjs +3 -3
  199. package/dist/modern/visualBuilder/utils/getCsDataOfElement.cjs.map +1 -1
  200. package/dist/modern/visualBuilder/utils/getCsDataOfElement.js +4 -4
  201. package/dist/modern/visualBuilder/utils/getCsDataOfElement.js.map +1 -1
  202. package/dist/modern/visualBuilder/utils/getEntryIdentifiersInCurrentPage.cjs +1 -1
  203. package/dist/modern/visualBuilder/utils/getEntryIdentifiersInCurrentPage.cjs.map +1 -1
  204. package/dist/modern/visualBuilder/utils/getEntryIdentifiersInCurrentPage.js +2 -2
  205. package/dist/modern/visualBuilder/utils/getEntryIdentifiersInCurrentPage.js.map +1 -1
  206. package/dist/modern/visualBuilder/utils/getVisualBuilderRedirectionUrl.cjs +2 -2
  207. package/dist/modern/visualBuilder/utils/getVisualBuilderRedirectionUrl.cjs.map +1 -1
  208. package/dist/modern/visualBuilder/utils/getVisualBuilderRedirectionUrl.js +3 -3
  209. package/dist/modern/visualBuilder/utils/getVisualBuilderRedirectionUrl.js.map +1 -1
  210. package/dist/modern/visualBuilder/utils/getWorkflowStageDetails.cjs +4 -0
  211. package/dist/modern/visualBuilder/utils/getWorkflowStageDetails.cjs.map +1 -1
  212. package/dist/modern/visualBuilder/utils/getWorkflowStageDetails.d.cts +8 -1
  213. package/dist/modern/visualBuilder/utils/getWorkflowStageDetails.d.ts +8 -1
  214. package/dist/modern/visualBuilder/utils/getWorkflowStageDetails.js +4 -0
  215. package/dist/modern/visualBuilder/utils/getWorkflowStageDetails.js.map +1 -1
  216. package/dist/modern/visualBuilder/utils/isFieldDisabled.cjs +40 -6
  217. package/dist/modern/visualBuilder/utils/isFieldDisabled.cjs.map +1 -1
  218. package/dist/modern/visualBuilder/utils/isFieldDisabled.d.cts +9 -1
  219. package/dist/modern/visualBuilder/utils/isFieldDisabled.d.ts +9 -1
  220. package/dist/modern/visualBuilder/utils/isFieldDisabled.js +40 -6
  221. package/dist/modern/visualBuilder/utils/isFieldDisabled.js.map +1 -1
  222. package/dist/modern/visualBuilder/utils/types/postMessage.types.cjs +1 -0
  223. package/dist/modern/visualBuilder/utils/types/postMessage.types.cjs.map +1 -1
  224. package/dist/modern/visualBuilder/utils/types/postMessage.types.d.cts +1 -0
  225. package/dist/modern/visualBuilder/utils/types/postMessage.types.d.ts +1 -0
  226. package/dist/modern/visualBuilder/utils/types/postMessage.types.js +1 -0
  227. package/dist/modern/visualBuilder/utils/types/postMessage.types.js.map +1 -1
  228. package/dist/modern/visualBuilder/utils/updateFocussedState.cjs +1 -1
  229. package/dist/modern/visualBuilder/utils/updateFocussedState.cjs.map +1 -1
  230. package/dist/modern/visualBuilder/utils/updateFocussedState.js +2 -2
  231. package/dist/modern/visualBuilder/utils/updateFocussedState.js.map +1 -1
  232. package/dist/modern/visualBuilder/visualBuilder.style.cjs +30 -0
  233. package/dist/modern/visualBuilder/visualBuilder.style.cjs.map +1 -1
  234. package/dist/modern/visualBuilder/visualBuilder.style.d.cts +5 -0
  235. package/dist/modern/visualBuilder/visualBuilder.style.d.ts +5 -0
  236. package/dist/modern/visualBuilder/visualBuilder.style.js +30 -0
  237. package/dist/modern/visualBuilder/visualBuilder.style.js.map +1 -1
  238. package/package.json +3 -3
@@ -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\";\nimport { setHighlightVariantFields } from \"./useVariantsPostMessageEvent\";\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 setHighlightVariantFields(event.data.highlightVariantFields);\n updateVariantClasses();\n }\n }\n );\n}\nexport function updateVariantClasses(): void {\n const highlightVariantFields = VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields;\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 const variantFieldClasses = [\"visual-builder__variant-field\"];\n if (highlightVariantFields) {\n variantFieldClasses.push(visualBuilderStyles()[\"visual-builder__variant-field-outline\"]);\n }\n element.classList.add(...variantFieldClasses);\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-outline\"],\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-outline\"],\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 const variantFieldClasses = [\"visual-builder__variant-field\"];\n if (highlightVariantFields) {\n variantFieldClasses.push(visualBuilderStyles()[\"visual-builder__variant-field-outline\"]);\n }\n element.classList.add(...variantFieldClasses);\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-outline\"],\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 // TODO: Check if we could add attributeFilter to the observer to only observe the attribute changes for the data-cslp attribute.\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":[]}
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\";\nimport { isValidCslp } from \"../../cslp/cslpdata\";\nimport { setHighlightVariantFields } from \"./useVariantsPostMessageEvent\";\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 setHighlightVariantFields(event.data.highlightVariantFields);\n updateVariantClasses();\n }\n }\n );\n}\nexport function updateVariantClasses(): void {\n const highlightVariantFields = VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields;\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 (!isValidCslp(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 const variantFieldClasses = [\"visual-builder__variant-field\"];\n if (highlightVariantFields) {\n variantFieldClasses.push(visualBuilderStyles()[\"visual-builder__variant-field-outline\"]);\n }\n element.classList.add(...variantFieldClasses);\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-outline\"],\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-outline\"],\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 (!isValidCslp(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 const variantFieldClasses = [\"visual-builder__variant-field\"];\n if (highlightVariantFields) {\n variantFieldClasses.push(visualBuilderStyles()[\"visual-builder__variant-field-outline\"]);\n }\n element.classList.add(...variantFieldClasses);\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-outline\"],\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 // TODO: Check if we could add attributeFilter to the observer to only observe the attribute changes for the data-cslp attribute.\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":[]}
@@ -41,7 +41,7 @@ async function handleRevalidateFieldData() {
41
41
  const targetElement = hoveredElement || focusedElement;
42
42
  if (targetElement) {
43
43
  const cslp = targetElement.getAttribute("data-cslp");
44
- if (cslp) {
44
+ if ((0, import_cslp.isValidCslp)(cslp)) {
45
45
  const fieldMetadata = (0, import_cslp.extractDetailsFromCslp)(cslp);
46
46
  import_fieldSchemaMap.FieldSchemaMap.clearContentTypeSchema(
47
47
  fieldMetadata.content_type_uid
@@ -53,7 +53,7 @@ async function handleRevalidateFieldData() {
53
53
  console.error("Error handling revalidate field data:", error);
54
54
  window.location.reload();
55
55
  } finally {
56
- if (shouldRefocus && elementCslp) {
56
+ if (shouldRefocus && (0, import_cslp.isValidCslp)(elementCslp)) {
57
57
  await refocusElement(elementCslp, elementCslpUniqueId);
58
58
  }
59
59
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { extractDetailsFromCslp } from \"../../cslp\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { hideFocusOverlay } from \"../generators/generateOverlay\";\nimport { handleBuilderInteraction } from \"../listeners/mouseClick\";\n\n/**\n * Revalidates field data and schema after variant linking operations.\n * Unfocuses the selected element, revalidates data, and then reselects it.\n */\nexport async function handleRevalidateFieldData(): Promise<void> {\n const focusedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const hoveredElement =\n VisualBuilder.VisualBuilderGlobalState.value.previousHoveredTargetDOM;\n\n // Store element identifiers for refocusing\n const elementCslp = focusedElement?.getAttribute(\"data-cslp\");\n const elementCslpUniqueId =\n focusedElement?.getAttribute(\"data-cslp-unique-id\") || null;\n const shouldRefocus = !!focusedElement;\n\n try {\n // Step 1: Unfocus the current element\n if (shouldRefocus) {\n await unfocusElement();\n }\n\n // Step 2: Revalidate field data\n const targetElement = hoveredElement || focusedElement;\n\n if (targetElement) {\n const cslp = targetElement.getAttribute(\"data-cslp\");\n if (cslp) {\n const fieldMetadata = extractDetailsFromCslp(cslp);\n\n // Try to revalidate specific field schema and data\n // Clear the entire content type schema from cache to force fresh fetch\n FieldSchemaMap.clearContentTypeSchema(\n fieldMetadata.content_type_uid\n );\n }\n }\n\n // Fallback 1: Clear all field schema cache\n FieldSchemaMap.clear();\n } catch (error) {\n console.error(\"Error handling revalidate field data:\", error);\n // Final fallback - refresh the page\n window.location.reload();\n } finally {\n // Step 3: Refocus the element if we had one focused before\n if (shouldRefocus && elementCslp) {\n await refocusElement(elementCslp, elementCslpUniqueId);\n }\n }\n}\n\n/**\n * Unfocuses the currently selected element and clears focus state\n */\nasync function unfocusElement(): Promise<void> {\n const { visualBuilderContainer, overlayWrapper, focusedToolbar } =\n getVisualBuilderElements();\n\n if (!visualBuilderContainer || !overlayWrapper) return;\n\n const dummyResizeObserver = new ResizeObserver(() => {});\n\n // Hide focus overlay (cleanIndividualFieldResidual needs previousSelectedEditableDOM)\n hideFocusOverlay({\n visualBuilderContainer,\n visualBuilderOverlayWrapper: overlayWrapper,\n focusedToolbar,\n resizeObserver: dummyResizeObserver,\n noTrigger: true,\n });\n\n // Clear global state after cleanup\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n VisualBuilder.VisualBuilderGlobalState.value.isFocussed = false;\n}\n\n/**\n * Refocuses an element by its CSLP identifier\n */\nasync function refocusElement(\n cslp: string,\n uniqueId: string | null\n): Promise<void> {\n try {\n // Find the element (prefer unique ID, fallback to CSLP)\n const elementToRefocus =\n (uniqueId &&\n document.querySelector(\n `[data-cslp-unique-id=\"${uniqueId}\"]`\n )) ||\n document.querySelector(`[data-cslp=\"${cslp}\"]`);\n\n if (!elementToRefocus) return;\n\n const { visualBuilderContainer, overlayWrapper, focusedToolbar } =\n getVisualBuilderElements();\n\n if (!visualBuilderContainer || !overlayWrapper) return;\n\n // Create synthetic click event\n const syntheticEvent = new MouseEvent(\"click\", {\n bubbles: true,\n cancelable: true,\n });\n Object.defineProperty(syntheticEvent, \"target\", {\n value: elementToRefocus,\n enumerable: true,\n });\n\n // Refocus using handleBuilderInteraction\n await handleBuilderInteraction({\n event: syntheticEvent,\n previousSelectedEditableDOM: null,\n visualBuilderContainer,\n overlayWrapper,\n focusedToolbar,\n resizeObserver: new ResizeObserver(() => {}),\n });\n } catch (error) {\n console.warn(\"Could not refocus element after revalidation:\", error);\n }\n}\n\n/**\n * Gets the main visual builder DOM elements\n */\nfunction getVisualBuilderElements() {\n return {\n visualBuilderContainer: document.querySelector(\n \".visual-builder__container\"\n ) as HTMLDivElement | null,\n overlayWrapper: document.querySelector(\n \".visual-builder__overlay__wrapper\"\n ) as HTMLDivElement | null,\n focusedToolbar: document.querySelector(\n \".visual-builder__focused-toolbar\"\n ) as HTMLDivElement | null,\n };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAA8B;AAC9B,kBAAuC;AACvC,4BAA+B;AAC/B,6BAAiC;AACjC,wBAAyC;AAMzC,eAAsB,4BAA2C;AAC7D,QAAM,iBACF,uBAAc,yBAAyB,MAClC;AACT,QAAM,iBACF,uBAAc,yBAAyB,MAAM;AAGjD,QAAM,cAAc,iDAAgB,aAAa;AACjD,QAAM,uBACF,iDAAgB,aAAa,2BAA0B;AAC3D,QAAM,gBAAgB,CAAC,CAAC;AAExB,MAAI;AAEA,QAAI,eAAe;AACf,YAAM,eAAe;AAAA,IACzB;AAGA,UAAM,gBAAgB,kBAAkB;AAExC,QAAI,eAAe;AACf,YAAM,OAAO,cAAc,aAAa,WAAW;AACnD,UAAI,MAAM;AACN,cAAM,oBAAgB,oCAAuB,IAAI;AAIjD,6CAAe;AAAA,UACX,cAAc;AAAA,QAClB;AAAA,MACJ;AAAA,IACJ;AAGA,yCAAe,MAAM;AAAA,EACzB,SAAS,OAAO;AACZ,YAAQ,MAAM,yCAAyC,KAAK;AAE5D,WAAO,SAAS,OAAO;AAAA,EAC3B,UAAE;AAEE,QAAI,iBAAiB,aAAa;AAC9B,YAAM,eAAe,aAAa,mBAAmB;AAAA,IACzD;AAAA,EACJ;AACJ;AAKA,eAAe,iBAAgC;AAC3C,QAAM,EAAE,wBAAwB,gBAAgB,eAAe,IAC3D,yBAAyB;AAE7B,MAAI,CAAC,0BAA0B,CAAC,eAAgB;AAEhD,QAAM,sBAAsB,IAAI,eAAe,MAAM;AAAA,EAAC,CAAC;AAGvD,+CAAiB;AAAA,IACb;AAAA,IACA,6BAA6B;AAAA,IAC7B;AAAA,IACA,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACf,CAAC;AAGD,yBAAc,yBAAyB,MAAM,8BACzC;AACJ,yBAAc,yBAAyB,MAAM,aAAa;AAC9D;AAKA,eAAe,eACX,MACA,UACa;AACb,MAAI;AAEA,UAAM,mBACD,YACG,SAAS;AAAA,MACL,yBAAyB,QAAQ;AAAA,IACrC,KACJ,SAAS,cAAc,eAAe,IAAI,IAAI;AAElD,QAAI,CAAC,iBAAkB;AAEvB,UAAM,EAAE,wBAAwB,gBAAgB,eAAe,IAC3D,yBAAyB;AAE7B,QAAI,CAAC,0BAA0B,CAAC,eAAgB;AAGhD,UAAM,iBAAiB,IAAI,WAAW,SAAS;AAAA,MAC3C,SAAS;AAAA,MACT,YAAY;AAAA,IAChB,CAAC;AACD,WAAO,eAAe,gBAAgB,UAAU;AAAA,MAC5C,OAAO;AAAA,MACP,YAAY;AAAA,IAChB,CAAC;AAGD,cAAM,4CAAyB;AAAA,MAC3B,OAAO;AAAA,MACP,6BAA6B;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB,IAAI,eAAe,MAAM;AAAA,MAAC,CAAC;AAAA,IAC/C,CAAC;AAAA,EACL,SAAS,OAAO;AACZ,YAAQ,KAAK,iDAAiD,KAAK;AAAA,EACvE;AACJ;AAKA,SAAS,2BAA2B;AAChC,SAAO;AAAA,IACH,wBAAwB,SAAS;AAAA,MAC7B;AAAA,IACJ;AAAA,IACA,gBAAgB,SAAS;AAAA,MACrB;AAAA,IACJ;AAAA,IACA,gBAAgB,SAAS;AAAA,MACrB;AAAA,IACJ;AAAA,EACJ;AACJ;","names":[]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { extractDetailsFromCslp, isValidCslp } from \"../../cslp\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { hideFocusOverlay } from \"../generators/generateOverlay\";\nimport { handleBuilderInteraction } from \"../listeners/mouseClick\";\n\n/**\n * Revalidates field data and schema after variant linking operations.\n * Unfocuses the selected element, revalidates data, and then reselects it.\n */\nexport async function handleRevalidateFieldData(): Promise<void> {\n const focusedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const hoveredElement =\n VisualBuilder.VisualBuilderGlobalState.value.previousHoveredTargetDOM;\n\n // Store element identifiers for refocusing\n const elementCslp = focusedElement?.getAttribute(\"data-cslp\");\n const elementCslpUniqueId =\n focusedElement?.getAttribute(\"data-cslp-unique-id\") || null;\n const shouldRefocus = !!focusedElement;\n\n try {\n // Step 1: Unfocus the current element\n if (shouldRefocus) {\n await unfocusElement();\n }\n\n // Step 2: Revalidate field data\n const targetElement = hoveredElement || focusedElement;\n\n if (targetElement) {\n const cslp = targetElement.getAttribute(\"data-cslp\");\n if (isValidCslp(cslp)) {\n const fieldMetadata = extractDetailsFromCslp(cslp);\n\n // Try to revalidate specific field schema and data\n // Clear the entire content type schema from cache to force fresh fetch\n FieldSchemaMap.clearContentTypeSchema(\n fieldMetadata.content_type_uid\n );\n }\n }\n\n // Fallback 1: Clear all field schema cache\n FieldSchemaMap.clear();\n } catch (error) {\n console.error(\"Error handling revalidate field data:\", error);\n // Final fallback - refresh the page\n window.location.reload();\n } finally {\n // Step 3: Refocus the element if we had one focused before\n if (shouldRefocus && isValidCslp(elementCslp)) {\n await refocusElement(elementCslp, elementCslpUniqueId);\n }\n }\n}\n\n/**\n * Unfocuses the currently selected element and clears focus state\n */\nasync function unfocusElement(): Promise<void> {\n const { visualBuilderContainer, overlayWrapper, focusedToolbar } =\n getVisualBuilderElements();\n\n if (!visualBuilderContainer || !overlayWrapper) return;\n\n const dummyResizeObserver = new ResizeObserver(() => {});\n\n // Hide focus overlay (cleanIndividualFieldResidual needs previousSelectedEditableDOM)\n hideFocusOverlay({\n visualBuilderContainer,\n visualBuilderOverlayWrapper: overlayWrapper,\n focusedToolbar,\n resizeObserver: dummyResizeObserver,\n noTrigger: true,\n });\n\n // Clear global state after cleanup\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n VisualBuilder.VisualBuilderGlobalState.value.isFocussed = false;\n}\n\n/**\n * Refocuses an element by its CSLP identifier\n */\nasync function refocusElement(\n cslp: string,\n uniqueId: string | null\n): Promise<void> {\n try {\n // Find the element (prefer unique ID, fallback to CSLP)\n const elementToRefocus =\n (uniqueId &&\n document.querySelector(\n `[data-cslp-unique-id=\"${uniqueId}\"]`\n )) ||\n document.querySelector(`[data-cslp=\"${cslp}\"]`);\n\n if (!elementToRefocus) return;\n\n const { visualBuilderContainer, overlayWrapper, focusedToolbar } =\n getVisualBuilderElements();\n\n if (!visualBuilderContainer || !overlayWrapper) return;\n\n // Create synthetic click event\n const syntheticEvent = new MouseEvent(\"click\", {\n bubbles: true,\n cancelable: true,\n });\n Object.defineProperty(syntheticEvent, \"target\", {\n value: elementToRefocus,\n enumerable: true,\n });\n\n // Refocus using handleBuilderInteraction\n await handleBuilderInteraction({\n event: syntheticEvent,\n previousSelectedEditableDOM: null,\n visualBuilderContainer,\n overlayWrapper,\n focusedToolbar,\n resizeObserver: new ResizeObserver(() => {}),\n });\n } catch (error) {\n console.warn(\"Could not refocus element after revalidation:\", error);\n }\n}\n\n/**\n * Gets the main visual builder DOM elements\n */\nfunction getVisualBuilderElements() {\n return {\n visualBuilderContainer: document.querySelector(\n \".visual-builder__container\"\n ) as HTMLDivElement | null,\n overlayWrapper: document.querySelector(\n \".visual-builder__overlay__wrapper\"\n ) as HTMLDivElement | null,\n focusedToolbar: document.querySelector(\n \".visual-builder__focused-toolbar\"\n ) as HTMLDivElement | null,\n };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAA8B;AAC9B,kBAAoD;AACpD,4BAA+B;AAC/B,6BAAiC;AACjC,wBAAyC;AAMzC,eAAsB,4BAA2C;AAC7D,QAAM,iBACF,uBAAc,yBAAyB,MAClC;AACT,QAAM,iBACF,uBAAc,yBAAyB,MAAM;AAGjD,QAAM,cAAc,iDAAgB,aAAa;AACjD,QAAM,uBACF,iDAAgB,aAAa,2BAA0B;AAC3D,QAAM,gBAAgB,CAAC,CAAC;AAExB,MAAI;AAEA,QAAI,eAAe;AACf,YAAM,eAAe;AAAA,IACzB;AAGA,UAAM,gBAAgB,kBAAkB;AAExC,QAAI,eAAe;AACf,YAAM,OAAO,cAAc,aAAa,WAAW;AACnD,cAAI,yBAAY,IAAI,GAAG;AACnB,cAAM,oBAAgB,oCAAuB,IAAI;AAIjD,6CAAe;AAAA,UACX,cAAc;AAAA,QAClB;AAAA,MACJ;AAAA,IACJ;AAGA,yCAAe,MAAM;AAAA,EACzB,SAAS,OAAO;AACZ,YAAQ,MAAM,yCAAyC,KAAK;AAE5D,WAAO,SAAS,OAAO;AAAA,EAC3B,UAAE;AAEE,QAAI,qBAAiB,yBAAY,WAAW,GAAG;AAC3C,YAAM,eAAe,aAAa,mBAAmB;AAAA,IACzD;AAAA,EACJ;AACJ;AAKA,eAAe,iBAAgC;AAC3C,QAAM,EAAE,wBAAwB,gBAAgB,eAAe,IAC3D,yBAAyB;AAE7B,MAAI,CAAC,0BAA0B,CAAC,eAAgB;AAEhD,QAAM,sBAAsB,IAAI,eAAe,MAAM;AAAA,EAAC,CAAC;AAGvD,+CAAiB;AAAA,IACb;AAAA,IACA,6BAA6B;AAAA,IAC7B;AAAA,IACA,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACf,CAAC;AAGD,yBAAc,yBAAyB,MAAM,8BACzC;AACJ,yBAAc,yBAAyB,MAAM,aAAa;AAC9D;AAKA,eAAe,eACX,MACA,UACa;AACb,MAAI;AAEA,UAAM,mBACD,YACG,SAAS;AAAA,MACL,yBAAyB,QAAQ;AAAA,IACrC,KACJ,SAAS,cAAc,eAAe,IAAI,IAAI;AAElD,QAAI,CAAC,iBAAkB;AAEvB,UAAM,EAAE,wBAAwB,gBAAgB,eAAe,IAC3D,yBAAyB;AAE7B,QAAI,CAAC,0BAA0B,CAAC,eAAgB;AAGhD,UAAM,iBAAiB,IAAI,WAAW,SAAS;AAAA,MAC3C,SAAS;AAAA,MACT,YAAY;AAAA,IAChB,CAAC;AACD,WAAO,eAAe,gBAAgB,UAAU;AAAA,MAC5C,OAAO;AAAA,MACP,YAAY;AAAA,IAChB,CAAC;AAGD,cAAM,4CAAyB;AAAA,MAC3B,OAAO;AAAA,MACP,6BAA6B;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB,IAAI,eAAe,MAAM;AAAA,MAAC,CAAC;AAAA,IAC/C,CAAC;AAAA,EACL,SAAS,OAAO;AACZ,YAAQ,KAAK,iDAAiD,KAAK;AAAA,EACvE;AACJ;AAKA,SAAS,2BAA2B;AAChC,SAAO;AAAA,IACH,wBAAwB,SAAS;AAAA,MAC7B;AAAA,IACJ;AAAA,IACA,gBAAgB,SAAS;AAAA,MACrB;AAAA,IACJ;AAAA,IACA,gBAAgB,SAAS;AAAA,MACrB;AAAA,IACJ;AAAA,EACJ;AACJ;","names":[]}
@@ -2,7 +2,7 @@ import "../../chunk-5WRI5ZAA.js";
2
2
 
3
3
  // src/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.ts
4
4
  import { VisualBuilder } from "../index.js";
5
- import { extractDetailsFromCslp } from "../../cslp/index.js";
5
+ import { extractDetailsFromCslp, isValidCslp } from "../../cslp/index.js";
6
6
  import { FieldSchemaMap } from "../utils/fieldSchemaMap.js";
7
7
  import { hideFocusOverlay } from "../generators/generateOverlay.js";
8
8
  import { handleBuilderInteraction } from "../listeners/mouseClick.js";
@@ -19,7 +19,7 @@ async function handleRevalidateFieldData() {
19
19
  const targetElement = hoveredElement || focusedElement;
20
20
  if (targetElement) {
21
21
  const cslp = targetElement.getAttribute("data-cslp");
22
- if (cslp) {
22
+ if (isValidCslp(cslp)) {
23
23
  const fieldMetadata = extractDetailsFromCslp(cslp);
24
24
  FieldSchemaMap.clearContentTypeSchema(
25
25
  fieldMetadata.content_type_uid
@@ -31,7 +31,7 @@ async function handleRevalidateFieldData() {
31
31
  console.error("Error handling revalidate field data:", error);
32
32
  window.location.reload();
33
33
  } finally {
34
- if (shouldRefocus && elementCslp) {
34
+ if (shouldRefocus && isValidCslp(elementCslp)) {
35
35
  await refocusElement(elementCslp, elementCslpUniqueId);
36
36
  }
37
37
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { extractDetailsFromCslp } from \"../../cslp\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { hideFocusOverlay } from \"../generators/generateOverlay\";\nimport { handleBuilderInteraction } from \"../listeners/mouseClick\";\n\n/**\n * Revalidates field data and schema after variant linking operations.\n * Unfocuses the selected element, revalidates data, and then reselects it.\n */\nexport async function handleRevalidateFieldData(): Promise<void> {\n const focusedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const hoveredElement =\n VisualBuilder.VisualBuilderGlobalState.value.previousHoveredTargetDOM;\n\n // Store element identifiers for refocusing\n const elementCslp = focusedElement?.getAttribute(\"data-cslp\");\n const elementCslpUniqueId =\n focusedElement?.getAttribute(\"data-cslp-unique-id\") || null;\n const shouldRefocus = !!focusedElement;\n\n try {\n // Step 1: Unfocus the current element\n if (shouldRefocus) {\n await unfocusElement();\n }\n\n // Step 2: Revalidate field data\n const targetElement = hoveredElement || focusedElement;\n\n if (targetElement) {\n const cslp = targetElement.getAttribute(\"data-cslp\");\n if (cslp) {\n const fieldMetadata = extractDetailsFromCslp(cslp);\n\n // Try to revalidate specific field schema and data\n // Clear the entire content type schema from cache to force fresh fetch\n FieldSchemaMap.clearContentTypeSchema(\n fieldMetadata.content_type_uid\n );\n }\n }\n\n // Fallback 1: Clear all field schema cache\n FieldSchemaMap.clear();\n } catch (error) {\n console.error(\"Error handling revalidate field data:\", error);\n // Final fallback - refresh the page\n window.location.reload();\n } finally {\n // Step 3: Refocus the element if we had one focused before\n if (shouldRefocus && elementCslp) {\n await refocusElement(elementCslp, elementCslpUniqueId);\n }\n }\n}\n\n/**\n * Unfocuses the currently selected element and clears focus state\n */\nasync function unfocusElement(): Promise<void> {\n const { visualBuilderContainer, overlayWrapper, focusedToolbar } =\n getVisualBuilderElements();\n\n if (!visualBuilderContainer || !overlayWrapper) return;\n\n const dummyResizeObserver = new ResizeObserver(() => {});\n\n // Hide focus overlay (cleanIndividualFieldResidual needs previousSelectedEditableDOM)\n hideFocusOverlay({\n visualBuilderContainer,\n visualBuilderOverlayWrapper: overlayWrapper,\n focusedToolbar,\n resizeObserver: dummyResizeObserver,\n noTrigger: true,\n });\n\n // Clear global state after cleanup\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n VisualBuilder.VisualBuilderGlobalState.value.isFocussed = false;\n}\n\n/**\n * Refocuses an element by its CSLP identifier\n */\nasync function refocusElement(\n cslp: string,\n uniqueId: string | null\n): Promise<void> {\n try {\n // Find the element (prefer unique ID, fallback to CSLP)\n const elementToRefocus =\n (uniqueId &&\n document.querySelector(\n `[data-cslp-unique-id=\"${uniqueId}\"]`\n )) ||\n document.querySelector(`[data-cslp=\"${cslp}\"]`);\n\n if (!elementToRefocus) return;\n\n const { visualBuilderContainer, overlayWrapper, focusedToolbar } =\n getVisualBuilderElements();\n\n if (!visualBuilderContainer || !overlayWrapper) return;\n\n // Create synthetic click event\n const syntheticEvent = new MouseEvent(\"click\", {\n bubbles: true,\n cancelable: true,\n });\n Object.defineProperty(syntheticEvent, \"target\", {\n value: elementToRefocus,\n enumerable: true,\n });\n\n // Refocus using handleBuilderInteraction\n await handleBuilderInteraction({\n event: syntheticEvent,\n previousSelectedEditableDOM: null,\n visualBuilderContainer,\n overlayWrapper,\n focusedToolbar,\n resizeObserver: new ResizeObserver(() => {}),\n });\n } catch (error) {\n console.warn(\"Could not refocus element after revalidation:\", error);\n }\n}\n\n/**\n * Gets the main visual builder DOM elements\n */\nfunction getVisualBuilderElements() {\n return {\n visualBuilderContainer: document.querySelector(\n \".visual-builder__container\"\n ) as HTMLDivElement | null,\n overlayWrapper: document.querySelector(\n \".visual-builder__overlay__wrapper\"\n ) as HTMLDivElement | null,\n focusedToolbar: document.querySelector(\n \".visual-builder__focused-toolbar\"\n ) as HTMLDivElement | null,\n };\n}\n"],"mappings":";;;AAAA,SAAS,qBAAqB;AAC9B,SAAS,8BAA8B;AACvC,SAAS,sBAAsB;AAC/B,SAAS,wBAAwB;AACjC,SAAS,gCAAgC;AAMzC,eAAsB,4BAA2C;AAC7D,QAAM,iBACF,cAAc,yBAAyB,MAClC;AACT,QAAM,iBACF,cAAc,yBAAyB,MAAM;AAGjD,QAAM,cAAc,iDAAgB,aAAa;AACjD,QAAM,uBACF,iDAAgB,aAAa,2BAA0B;AAC3D,QAAM,gBAAgB,CAAC,CAAC;AAExB,MAAI;AAEA,QAAI,eAAe;AACf,YAAM,eAAe;AAAA,IACzB;AAGA,UAAM,gBAAgB,kBAAkB;AAExC,QAAI,eAAe;AACf,YAAM,OAAO,cAAc,aAAa,WAAW;AACnD,UAAI,MAAM;AACN,cAAM,gBAAgB,uBAAuB,IAAI;AAIjD,uBAAe;AAAA,UACX,cAAc;AAAA,QAClB;AAAA,MACJ;AAAA,IACJ;AAGA,mBAAe,MAAM;AAAA,EACzB,SAAS,OAAO;AACZ,YAAQ,MAAM,yCAAyC,KAAK;AAE5D,WAAO,SAAS,OAAO;AAAA,EAC3B,UAAE;AAEE,QAAI,iBAAiB,aAAa;AAC9B,YAAM,eAAe,aAAa,mBAAmB;AAAA,IACzD;AAAA,EACJ;AACJ;AAKA,eAAe,iBAAgC;AAC3C,QAAM,EAAE,wBAAwB,gBAAgB,eAAe,IAC3D,yBAAyB;AAE7B,MAAI,CAAC,0BAA0B,CAAC,eAAgB;AAEhD,QAAM,sBAAsB,IAAI,eAAe,MAAM;AAAA,EAAC,CAAC;AAGvD,mBAAiB;AAAA,IACb;AAAA,IACA,6BAA6B;AAAA,IAC7B;AAAA,IACA,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACf,CAAC;AAGD,gBAAc,yBAAyB,MAAM,8BACzC;AACJ,gBAAc,yBAAyB,MAAM,aAAa;AAC9D;AAKA,eAAe,eACX,MACA,UACa;AACb,MAAI;AAEA,UAAM,mBACD,YACG,SAAS;AAAA,MACL,yBAAyB,QAAQ;AAAA,IACrC,KACJ,SAAS,cAAc,eAAe,IAAI,IAAI;AAElD,QAAI,CAAC,iBAAkB;AAEvB,UAAM,EAAE,wBAAwB,gBAAgB,eAAe,IAC3D,yBAAyB;AAE7B,QAAI,CAAC,0BAA0B,CAAC,eAAgB;AAGhD,UAAM,iBAAiB,IAAI,WAAW,SAAS;AAAA,MAC3C,SAAS;AAAA,MACT,YAAY;AAAA,IAChB,CAAC;AACD,WAAO,eAAe,gBAAgB,UAAU;AAAA,MAC5C,OAAO;AAAA,MACP,YAAY;AAAA,IAChB,CAAC;AAGD,UAAM,yBAAyB;AAAA,MAC3B,OAAO;AAAA,MACP,6BAA6B;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB,IAAI,eAAe,MAAM;AAAA,MAAC,CAAC;AAAA,IAC/C,CAAC;AAAA,EACL,SAAS,OAAO;AACZ,YAAQ,KAAK,iDAAiD,KAAK;AAAA,EACvE;AACJ;AAKA,SAAS,2BAA2B;AAChC,SAAO;AAAA,IACH,wBAAwB,SAAS;AAAA,MAC7B;AAAA,IACJ;AAAA,IACA,gBAAgB,SAAS;AAAA,MACrB;AAAA,IACJ;AAAA,IACA,gBAAgB,SAAS;AAAA,MACrB;AAAA,IACJ;AAAA,EACJ;AACJ;","names":[]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useRevalidateFieldDataPostMessageEvent.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { extractDetailsFromCslp, isValidCslp } from \"../../cslp\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { hideFocusOverlay } from \"../generators/generateOverlay\";\nimport { handleBuilderInteraction } from \"../listeners/mouseClick\";\n\n/**\n * Revalidates field data and schema after variant linking operations.\n * Unfocuses the selected element, revalidates data, and then reselects it.\n */\nexport async function handleRevalidateFieldData(): Promise<void> {\n const focusedElement =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const hoveredElement =\n VisualBuilder.VisualBuilderGlobalState.value.previousHoveredTargetDOM;\n\n // Store element identifiers for refocusing\n const elementCslp = focusedElement?.getAttribute(\"data-cslp\");\n const elementCslpUniqueId =\n focusedElement?.getAttribute(\"data-cslp-unique-id\") || null;\n const shouldRefocus = !!focusedElement;\n\n try {\n // Step 1: Unfocus the current element\n if (shouldRefocus) {\n await unfocusElement();\n }\n\n // Step 2: Revalidate field data\n const targetElement = hoveredElement || focusedElement;\n\n if (targetElement) {\n const cslp = targetElement.getAttribute(\"data-cslp\");\n if (isValidCslp(cslp)) {\n const fieldMetadata = extractDetailsFromCslp(cslp);\n\n // Try to revalidate specific field schema and data\n // Clear the entire content type schema from cache to force fresh fetch\n FieldSchemaMap.clearContentTypeSchema(\n fieldMetadata.content_type_uid\n );\n }\n }\n\n // Fallback 1: Clear all field schema cache\n FieldSchemaMap.clear();\n } catch (error) {\n console.error(\"Error handling revalidate field data:\", error);\n // Final fallback - refresh the page\n window.location.reload();\n } finally {\n // Step 3: Refocus the element if we had one focused before\n if (shouldRefocus && isValidCslp(elementCslp)) {\n await refocusElement(elementCslp, elementCslpUniqueId);\n }\n }\n}\n\n/**\n * Unfocuses the currently selected element and clears focus state\n */\nasync function unfocusElement(): Promise<void> {\n const { visualBuilderContainer, overlayWrapper, focusedToolbar } =\n getVisualBuilderElements();\n\n if (!visualBuilderContainer || !overlayWrapper) return;\n\n const dummyResizeObserver = new ResizeObserver(() => {});\n\n // Hide focus overlay (cleanIndividualFieldResidual needs previousSelectedEditableDOM)\n hideFocusOverlay({\n visualBuilderContainer,\n visualBuilderOverlayWrapper: overlayWrapper,\n focusedToolbar,\n resizeObserver: dummyResizeObserver,\n noTrigger: true,\n });\n\n // Clear global state after cleanup\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n VisualBuilder.VisualBuilderGlobalState.value.isFocussed = false;\n}\n\n/**\n * Refocuses an element by its CSLP identifier\n */\nasync function refocusElement(\n cslp: string,\n uniqueId: string | null\n): Promise<void> {\n try {\n // Find the element (prefer unique ID, fallback to CSLP)\n const elementToRefocus =\n (uniqueId &&\n document.querySelector(\n `[data-cslp-unique-id=\"${uniqueId}\"]`\n )) ||\n document.querySelector(`[data-cslp=\"${cslp}\"]`);\n\n if (!elementToRefocus) return;\n\n const { visualBuilderContainer, overlayWrapper, focusedToolbar } =\n getVisualBuilderElements();\n\n if (!visualBuilderContainer || !overlayWrapper) return;\n\n // Create synthetic click event\n const syntheticEvent = new MouseEvent(\"click\", {\n bubbles: true,\n cancelable: true,\n });\n Object.defineProperty(syntheticEvent, \"target\", {\n value: elementToRefocus,\n enumerable: true,\n });\n\n // Refocus using handleBuilderInteraction\n await handleBuilderInteraction({\n event: syntheticEvent,\n previousSelectedEditableDOM: null,\n visualBuilderContainer,\n overlayWrapper,\n focusedToolbar,\n resizeObserver: new ResizeObserver(() => {}),\n });\n } catch (error) {\n console.warn(\"Could not refocus element after revalidation:\", error);\n }\n}\n\n/**\n * Gets the main visual builder DOM elements\n */\nfunction getVisualBuilderElements() {\n return {\n visualBuilderContainer: document.querySelector(\n \".visual-builder__container\"\n ) as HTMLDivElement | null,\n overlayWrapper: document.querySelector(\n \".visual-builder__overlay__wrapper\"\n ) as HTMLDivElement | null,\n focusedToolbar: document.querySelector(\n \".visual-builder__focused-toolbar\"\n ) as HTMLDivElement | null,\n };\n}\n"],"mappings":";;;AAAA,SAAS,qBAAqB;AAC9B,SAAS,wBAAwB,mBAAmB;AACpD,SAAS,sBAAsB;AAC/B,SAAS,wBAAwB;AACjC,SAAS,gCAAgC;AAMzC,eAAsB,4BAA2C;AAC7D,QAAM,iBACF,cAAc,yBAAyB,MAClC;AACT,QAAM,iBACF,cAAc,yBAAyB,MAAM;AAGjD,QAAM,cAAc,iDAAgB,aAAa;AACjD,QAAM,uBACF,iDAAgB,aAAa,2BAA0B;AAC3D,QAAM,gBAAgB,CAAC,CAAC;AAExB,MAAI;AAEA,QAAI,eAAe;AACf,YAAM,eAAe;AAAA,IACzB;AAGA,UAAM,gBAAgB,kBAAkB;AAExC,QAAI,eAAe;AACf,YAAM,OAAO,cAAc,aAAa,WAAW;AACnD,UAAI,YAAY,IAAI,GAAG;AACnB,cAAM,gBAAgB,uBAAuB,IAAI;AAIjD,uBAAe;AAAA,UACX,cAAc;AAAA,QAClB;AAAA,MACJ;AAAA,IACJ;AAGA,mBAAe,MAAM;AAAA,EACzB,SAAS,OAAO;AACZ,YAAQ,MAAM,yCAAyC,KAAK;AAE5D,WAAO,SAAS,OAAO;AAAA,EAC3B,UAAE;AAEE,QAAI,iBAAiB,YAAY,WAAW,GAAG;AAC3C,YAAM,eAAe,aAAa,mBAAmB;AAAA,IACzD;AAAA,EACJ;AACJ;AAKA,eAAe,iBAAgC;AAC3C,QAAM,EAAE,wBAAwB,gBAAgB,eAAe,IAC3D,yBAAyB;AAE7B,MAAI,CAAC,0BAA0B,CAAC,eAAgB;AAEhD,QAAM,sBAAsB,IAAI,eAAe,MAAM;AAAA,EAAC,CAAC;AAGvD,mBAAiB;AAAA,IACb;AAAA,IACA,6BAA6B;AAAA,IAC7B;AAAA,IACA,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACf,CAAC;AAGD,gBAAc,yBAAyB,MAAM,8BACzC;AACJ,gBAAc,yBAAyB,MAAM,aAAa;AAC9D;AAKA,eAAe,eACX,MACA,UACa;AACb,MAAI;AAEA,UAAM,mBACD,YACG,SAAS;AAAA,MACL,yBAAyB,QAAQ;AAAA,IACrC,KACJ,SAAS,cAAc,eAAe,IAAI,IAAI;AAElD,QAAI,CAAC,iBAAkB;AAEvB,UAAM,EAAE,wBAAwB,gBAAgB,eAAe,IAC3D,yBAAyB;AAE7B,QAAI,CAAC,0BAA0B,CAAC,eAAgB;AAGhD,UAAM,iBAAiB,IAAI,WAAW,SAAS;AAAA,MAC3C,SAAS;AAAA,MACT,YAAY;AAAA,IAChB,CAAC;AACD,WAAO,eAAe,gBAAgB,UAAU;AAAA,MAC5C,OAAO;AAAA,MACP,YAAY;AAAA,IAChB,CAAC;AAGD,UAAM,yBAAyB;AAAA,MAC3B,OAAO;AAAA,MACP,6BAA6B;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB,IAAI,eAAe,MAAM;AAAA,MAAC,CAAC;AAAA,IAC/C,CAAC;AAAA,EACL,SAAS,OAAO;AACZ,YAAQ,KAAK,iDAAiD,KAAK;AAAA,EACvE;AACJ;AAKA,SAAS,2BAA2B;AAChC,SAAO;AAAA,IACH,wBAAwB,SAAS;AAAA,MAC7B;AAAA,IACJ;AAAA,IACA,gBAAgB,SAAS;AAAA,MACrB;AAAA,IACJ;AAAA,IACA,gBAAgB,SAAS;AAAA,MACrB;AAAA,IACJ;AAAA,EACJ;AACJ;","names":[]}
@@ -68,7 +68,7 @@ function addVariantFieldClass(variant_uid) {
68
68
  const elements = document.querySelectorAll(`[data-cslp]`);
69
69
  elements.forEach((element) => {
70
70
  const dataCslp = element.getAttribute("data-cslp");
71
- if (!dataCslp) return;
71
+ if (!(0, import_cslpdata.isValidCslp)(dataCslp)) return;
72
72
  if (dataCslp == null ? void 0 : dataCslp.includes(variant_uid)) {
73
73
  element.classList.add("visual-builder__variant-field");
74
74
  if (highlightVariantFields) {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useVariantsPostMessageEvent.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { updateVariantClasses } from \"./useRecalculateVariantDataCSLPValues\";\nimport { debounce } from \"lodash-es\";\nimport { extractDetailsFromCslp } from \"../../cslp/cslpdata\";\n\ninterface VariantFieldsEvent {\n data: {\n variant_data: {\n variant: string;\n highlightVariantFields: boolean;\n variantOrder: string[];\n };\n };\n}\ninterface RemoveVariantFieldsEvent {\n data: {\n onlyHighlighted?: boolean;\n };\n}\n\ninterface AudienceEvent {\n data: {\n audienceMode: boolean;\n };\n}\ninterface VariantEvent {\n data: {\n variant: string | null;\n };\n}\n\ninterface LocaleEvent {\n data: {\n locale: string;\n };\n}\n\nfunction isLowerOrderVariant(variant_uid: string, dataCslp: string, variantOrder: string[]): boolean {\n if(!variantOrder || variantOrder.length === 0) {\n return false;\n }\n const {variant: cslpVariant} = extractDetailsFromCslp(dataCslp);\n const indexOfCmsVariant = variantOrder.lastIndexOf(variant_uid);\n const indexOfCslpVariant = variantOrder.lastIndexOf(cslpVariant || \"\");\n if(indexOfCslpVariant < 0) {\n return false;\n }\n return indexOfCslpVariant < indexOfCmsVariant;\n}\n\n\nexport function addVariantFieldClass(\n variant_uid: string\n): void {\n const variantOrder = VisualBuilder.VisualBuilderGlobalState.value.variantOrder;\n const highlightVariantFields = VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields;\n const elements = document.querySelectorAll(`[data-cslp]`);\n elements.forEach((element) => {\n const dataCslp = element.getAttribute(\"data-cslp\");\n if (!dataCslp) return;\n\n if (dataCslp?.includes(variant_uid)) {\n element.classList.add(\"visual-builder__variant-field\");\n if (highlightVariantFields) {\n element.classList.add(\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"]\n );\n }\n } else if (!dataCslp.startsWith(\"v2:\")) {\n element.classList.add(\"visual-builder__base-field\");\n } \n else if (isLowerOrderVariant(variant_uid, dataCslp, variantOrder)) {\n element.classList.add(\"visual-builder__variant-field\", \"visual-builder__lower-order-variant-field\");\n }\n else {\n element.classList.add(\"visual-builder__disabled-variant-field\");\n }\n });\n}\n\nexport const debounceAddVariantFieldClass = debounce(\n addVariantFieldClass,\n 1000,\n { trailing: true }\n) as (variant_uid: string) => void;\n\nexport function removeVariantFieldClass(\n onlyHighlighted: boolean = false\n): void {\n if (onlyHighlighted) {\n const variantElements = document.querySelectorAll(\n `.${visualBuilderStyles()[\"visual-builder__variant-field-outline\"]}`\n );\n variantElements.forEach((element) => {\n element.classList.remove(\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"]\n );\n });\n } else {\n const variantAndBaseFieldElements = document.querySelectorAll(\n \".visual-builder__disabled-variant-field, .visual-builder__variant-field, .visual-builder__base-field, .visual-builder__lower-order-variant-field\" \n );\n variantAndBaseFieldElements.forEach((element) => {\n element.classList.remove(\n \"visual-builder__disabled-variant-field\",\n \"visual-builder__variant-field\",\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"],\n \"visual-builder__base-field\",\n \"visual-builder__lower-order-variant-field\"\n );\n });\n }\n}\n\nexport function setAudienceMode(mode: boolean): void {\n VisualBuilder.VisualBuilderGlobalState.value.audienceMode = mode;\n}\nexport function setVariant(uid: string | null): void {\n VisualBuilder.VisualBuilderGlobalState.value.variant = uid;\n}\nexport function setLocale(locale: string): void {\n VisualBuilder.VisualBuilderGlobalState.value.locale = locale;\n}\nexport function setHighlightVariantFields(highlight: boolean): void {\n VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields = highlight;\n}\nexport function setVariantOrder(variantOrder: string[]): void {\n VisualBuilder.VisualBuilderGlobalState.value.variantOrder = variantOrder;\n}\n\ninterface GetHighlightVariantFieldsStatusResponse {\n highlightVariantFields: boolean;\n}\nexport async function getHighlightVariantFieldsStatus(): Promise<GetHighlightVariantFieldsStatusResponse> {\n try {\n const result = await visualBuilderPostMessage?.send<GetHighlightVariantFieldsStatusResponse>(\n VisualBuilderPostMessageEvents.GET_HIGHLIGHT_VARIANT_FIELDS_STATUS\n ); \n return result ?? {\n highlightVariantFields: false,\n };\n } catch (error) {\n console.error(\"Failed to get highlight variant fields status:\", error);\n return {\n highlightVariantFields: false,\n };\n }\n}\n\nexport function useVariantFieldsPostMessageEvent({ isSSR }: { isSSR: boolean }): void {\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_VARIANT_ID,\n (event: VariantEvent) => {\n const selectedVariant = event.data.variant;\n setVariant(selectedVariant);\n // clear field schema when variant is changed.\n // this is required as we cache field schema\n // which contain a key isUnlinkedVariant.\n // This key can change when variant is changed,\n // so clear the field schema cache\n FieldSchemaMap.clear();\n if (isSSR) {\n if (selectedVariant) {\n addVariantFieldClass(selectedVariant);\n }\n } else {\n // recalculate and apply classes\n updateVariantClasses();\n }\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_LOCALE,\n (event: LocaleEvent) => {\n setLocale(event.data.locale);\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.SET_AUDIENCE_MODE,\n (event: AudienceEvent) => {\n setAudienceMode(event.data.audienceMode);\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.SHOW_VARIANT_FIELDS,\n (event: VariantFieldsEvent) => {\n setHighlightVariantFields(event.data.variant_data.highlightVariantFields);\n setVariantOrder(event.data.variant_data.variantOrder || []);\n removeVariantFieldClass();\n addVariantFieldClass(\n event.data.variant_data.variant\n );\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.REMOVE_VARIANT_FIELDS,\n (event: RemoveVariantFieldsEvent) => {\n setHighlightVariantFields(false);\n removeVariantFieldClass(event?.data?.onlyHighlighted);\n }\n );\n}\n"],"mappings":"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","names":["visualBuilderPostMessage","_a"]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useVariantsPostMessageEvent.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { updateVariantClasses } from \"./useRecalculateVariantDataCSLPValues\";\nimport { debounce } from \"lodash-es\";\nimport { extractDetailsFromCslp, isValidCslp } from \"../../cslp/cslpdata\";\n\ninterface VariantFieldsEvent {\n data: {\n variant_data: {\n variant: string;\n highlightVariantFields: boolean;\n variantOrder: string[];\n };\n };\n}\ninterface RemoveVariantFieldsEvent {\n data: {\n onlyHighlighted?: boolean;\n };\n}\n\ninterface AudienceEvent {\n data: {\n audienceMode: boolean;\n };\n}\ninterface VariantEvent {\n data: {\n variant: string | null;\n };\n}\n\ninterface LocaleEvent {\n data: {\n locale: string;\n };\n}\n\nfunction isLowerOrderVariant(variant_uid: string, dataCslp: string, variantOrder: string[]): boolean {\n if(!variantOrder || variantOrder.length === 0) {\n return false;\n }\n const {variant: cslpVariant} = extractDetailsFromCslp(dataCslp);\n const indexOfCmsVariant = variantOrder.lastIndexOf(variant_uid);\n const indexOfCslpVariant = variantOrder.lastIndexOf(cslpVariant || \"\");\n if(indexOfCslpVariant < 0) {\n return false;\n }\n return indexOfCslpVariant < indexOfCmsVariant;\n}\n\n\nexport function addVariantFieldClass(\n variant_uid: string\n): void {\n const variantOrder = VisualBuilder.VisualBuilderGlobalState.value.variantOrder;\n const highlightVariantFields = VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields;\n const elements = document.querySelectorAll(`[data-cslp]`);\n elements.forEach((element) => {\n const dataCslp = element.getAttribute(\"data-cslp\");\n if (!isValidCslp(dataCslp)) return;\n\n if (dataCslp?.includes(variant_uid)) {\n element.classList.add(\"visual-builder__variant-field\");\n if (highlightVariantFields) {\n element.classList.add(\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"]\n );\n }\n } else if (!dataCslp.startsWith(\"v2:\")) {\n element.classList.add(\"visual-builder__base-field\");\n } \n else if (isLowerOrderVariant(variant_uid, dataCslp, variantOrder)) {\n element.classList.add(\"visual-builder__variant-field\", \"visual-builder__lower-order-variant-field\");\n }\n else {\n element.classList.add(\"visual-builder__disabled-variant-field\");\n }\n });\n}\n\nexport const debounceAddVariantFieldClass = debounce(\n addVariantFieldClass,\n 1000,\n { trailing: true }\n) as (variant_uid: string) => void;\n\nexport function removeVariantFieldClass(\n onlyHighlighted: boolean = false\n): void {\n if (onlyHighlighted) {\n const variantElements = document.querySelectorAll(\n `.${visualBuilderStyles()[\"visual-builder__variant-field-outline\"]}`\n );\n variantElements.forEach((element) => {\n element.classList.remove(\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"]\n );\n });\n } else {\n const variantAndBaseFieldElements = document.querySelectorAll(\n \".visual-builder__disabled-variant-field, .visual-builder__variant-field, .visual-builder__base-field, .visual-builder__lower-order-variant-field\" \n );\n variantAndBaseFieldElements.forEach((element) => {\n element.classList.remove(\n \"visual-builder__disabled-variant-field\",\n \"visual-builder__variant-field\",\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"],\n \"visual-builder__base-field\",\n \"visual-builder__lower-order-variant-field\"\n );\n });\n }\n}\n\nexport function setAudienceMode(mode: boolean): void {\n VisualBuilder.VisualBuilderGlobalState.value.audienceMode = mode;\n}\nexport function setVariant(uid: string | null): void {\n VisualBuilder.VisualBuilderGlobalState.value.variant = uid;\n}\nexport function setLocale(locale: string): void {\n VisualBuilder.VisualBuilderGlobalState.value.locale = locale;\n}\nexport function setHighlightVariantFields(highlight: boolean): void {\n VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields = highlight;\n}\nexport function setVariantOrder(variantOrder: string[]): void {\n VisualBuilder.VisualBuilderGlobalState.value.variantOrder = variantOrder;\n}\n\ninterface GetHighlightVariantFieldsStatusResponse {\n highlightVariantFields: boolean;\n}\nexport async function getHighlightVariantFieldsStatus(): Promise<GetHighlightVariantFieldsStatusResponse> {\n try {\n const result = await visualBuilderPostMessage?.send<GetHighlightVariantFieldsStatusResponse>(\n VisualBuilderPostMessageEvents.GET_HIGHLIGHT_VARIANT_FIELDS_STATUS\n ); \n return result ?? {\n highlightVariantFields: false,\n };\n } catch (error) {\n console.error(\"Failed to get highlight variant fields status:\", error);\n return {\n highlightVariantFields: false,\n };\n }\n}\n\nexport function useVariantFieldsPostMessageEvent({ isSSR }: { isSSR: boolean }): void {\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_VARIANT_ID,\n (event: VariantEvent) => {\n const selectedVariant = event.data.variant;\n setVariant(selectedVariant);\n // clear field schema when variant is changed.\n // this is required as we cache field schema\n // which contain a key isUnlinkedVariant.\n // This key can change when variant is changed,\n // so clear the field schema cache\n FieldSchemaMap.clear();\n if (isSSR) {\n if (selectedVariant) {\n addVariantFieldClass(selectedVariant);\n }\n } else {\n // recalculate and apply classes\n updateVariantClasses();\n }\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_LOCALE,\n (event: LocaleEvent) => {\n setLocale(event.data.locale);\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.SET_AUDIENCE_MODE,\n (event: AudienceEvent) => {\n setAudienceMode(event.data.audienceMode);\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.SHOW_VARIANT_FIELDS,\n (event: VariantFieldsEvent) => {\n setHighlightVariantFields(event.data.variant_data.highlightVariantFields);\n setVariantOrder(event.data.variant_data.variantOrder || []);\n removeVariantFieldClass();\n addVariantFieldClass(\n event.data.variant_data.variant\n );\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.REMOVE_VARIANT_FIELDS,\n (event: RemoveVariantFieldsEvent) => {\n setHighlightVariantFields(false);\n removeVariantFieldClass(event?.data?.onlyHighlighted);\n }\n );\n}\n"],"mappings":"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","names":["visualBuilderPostMessage","_a"]}
@@ -8,7 +8,7 @@ import { VisualBuilderPostMessageEvents } from "../utils/types/postMessage.types
8
8
  import { FieldSchemaMap } from "../utils/fieldSchemaMap.js";
9
9
  import { updateVariantClasses } from "./useRecalculateVariantDataCSLPValues.js";
10
10
  import { debounce } from "lodash-es";
11
- import { extractDetailsFromCslp } from "../../cslp/cslpdata.js";
11
+ import { extractDetailsFromCslp, isValidCslp } from "../../cslp/cslpdata.js";
12
12
  function isLowerOrderVariant(variant_uid, dataCslp, variantOrder) {
13
13
  if (!variantOrder || variantOrder.length === 0) {
14
14
  return false;
@@ -27,7 +27,7 @@ function addVariantFieldClass(variant_uid) {
27
27
  const elements = document.querySelectorAll(`[data-cslp]`);
28
28
  elements.forEach((element) => {
29
29
  const dataCslp = element.getAttribute("data-cslp");
30
- if (!dataCslp) return;
30
+ if (!isValidCslp(dataCslp)) return;
31
31
  if (dataCslp == null ? void 0 : dataCslp.includes(variant_uid)) {
32
32
  element.classList.add("visual-builder__variant-field");
33
33
  if (highlightVariantFields) {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useVariantsPostMessageEvent.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { updateVariantClasses } from \"./useRecalculateVariantDataCSLPValues\";\nimport { debounce } from \"lodash-es\";\nimport { extractDetailsFromCslp } from \"../../cslp/cslpdata\";\n\ninterface VariantFieldsEvent {\n data: {\n variant_data: {\n variant: string;\n highlightVariantFields: boolean;\n variantOrder: string[];\n };\n };\n}\ninterface RemoveVariantFieldsEvent {\n data: {\n onlyHighlighted?: boolean;\n };\n}\n\ninterface AudienceEvent {\n data: {\n audienceMode: boolean;\n };\n}\ninterface VariantEvent {\n data: {\n variant: string | null;\n };\n}\n\ninterface LocaleEvent {\n data: {\n locale: string;\n };\n}\n\nfunction isLowerOrderVariant(variant_uid: string, dataCslp: string, variantOrder: string[]): boolean {\n if(!variantOrder || variantOrder.length === 0) {\n return false;\n }\n const {variant: cslpVariant} = extractDetailsFromCslp(dataCslp);\n const indexOfCmsVariant = variantOrder.lastIndexOf(variant_uid);\n const indexOfCslpVariant = variantOrder.lastIndexOf(cslpVariant || \"\");\n if(indexOfCslpVariant < 0) {\n return false;\n }\n return indexOfCslpVariant < indexOfCmsVariant;\n}\n\n\nexport function addVariantFieldClass(\n variant_uid: string\n): void {\n const variantOrder = VisualBuilder.VisualBuilderGlobalState.value.variantOrder;\n const highlightVariantFields = VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields;\n const elements = document.querySelectorAll(`[data-cslp]`);\n elements.forEach((element) => {\n const dataCslp = element.getAttribute(\"data-cslp\");\n if (!dataCslp) return;\n\n if (dataCslp?.includes(variant_uid)) {\n element.classList.add(\"visual-builder__variant-field\");\n if (highlightVariantFields) {\n element.classList.add(\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"]\n );\n }\n } else if (!dataCslp.startsWith(\"v2:\")) {\n element.classList.add(\"visual-builder__base-field\");\n } \n else if (isLowerOrderVariant(variant_uid, dataCslp, variantOrder)) {\n element.classList.add(\"visual-builder__variant-field\", \"visual-builder__lower-order-variant-field\");\n }\n else {\n element.classList.add(\"visual-builder__disabled-variant-field\");\n }\n });\n}\n\nexport const debounceAddVariantFieldClass = debounce(\n addVariantFieldClass,\n 1000,\n { trailing: true }\n) as (variant_uid: string) => void;\n\nexport function removeVariantFieldClass(\n onlyHighlighted: boolean = false\n): void {\n if (onlyHighlighted) {\n const variantElements = document.querySelectorAll(\n `.${visualBuilderStyles()[\"visual-builder__variant-field-outline\"]}`\n );\n variantElements.forEach((element) => {\n element.classList.remove(\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"]\n );\n });\n } else {\n const variantAndBaseFieldElements = document.querySelectorAll(\n \".visual-builder__disabled-variant-field, .visual-builder__variant-field, .visual-builder__base-field, .visual-builder__lower-order-variant-field\" \n );\n variantAndBaseFieldElements.forEach((element) => {\n element.classList.remove(\n \"visual-builder__disabled-variant-field\",\n \"visual-builder__variant-field\",\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"],\n \"visual-builder__base-field\",\n \"visual-builder__lower-order-variant-field\"\n );\n });\n }\n}\n\nexport function setAudienceMode(mode: boolean): void {\n VisualBuilder.VisualBuilderGlobalState.value.audienceMode = mode;\n}\nexport function setVariant(uid: string | null): void {\n VisualBuilder.VisualBuilderGlobalState.value.variant = uid;\n}\nexport function setLocale(locale: string): void {\n VisualBuilder.VisualBuilderGlobalState.value.locale = locale;\n}\nexport function setHighlightVariantFields(highlight: boolean): void {\n VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields = highlight;\n}\nexport function setVariantOrder(variantOrder: string[]): void {\n VisualBuilder.VisualBuilderGlobalState.value.variantOrder = variantOrder;\n}\n\ninterface GetHighlightVariantFieldsStatusResponse {\n highlightVariantFields: boolean;\n}\nexport async function getHighlightVariantFieldsStatus(): Promise<GetHighlightVariantFieldsStatusResponse> {\n try {\n const result = await visualBuilderPostMessage?.send<GetHighlightVariantFieldsStatusResponse>(\n VisualBuilderPostMessageEvents.GET_HIGHLIGHT_VARIANT_FIELDS_STATUS\n ); \n return result ?? {\n highlightVariantFields: false,\n };\n } catch (error) {\n console.error(\"Failed to get highlight variant fields status:\", error);\n return {\n highlightVariantFields: false,\n };\n }\n}\n\nexport function useVariantFieldsPostMessageEvent({ isSSR }: { isSSR: boolean }): void {\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_VARIANT_ID,\n (event: VariantEvent) => {\n const selectedVariant = event.data.variant;\n setVariant(selectedVariant);\n // clear field schema when variant is changed.\n // this is required as we cache field schema\n // which contain a key isUnlinkedVariant.\n // This key can change when variant is changed,\n // so clear the field schema cache\n FieldSchemaMap.clear();\n if (isSSR) {\n if (selectedVariant) {\n addVariantFieldClass(selectedVariant);\n }\n } else {\n // recalculate and apply classes\n updateVariantClasses();\n }\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_LOCALE,\n (event: LocaleEvent) => {\n setLocale(event.data.locale);\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.SET_AUDIENCE_MODE,\n (event: AudienceEvent) => {\n setAudienceMode(event.data.audienceMode);\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.SHOW_VARIANT_FIELDS,\n (event: VariantFieldsEvent) => {\n setHighlightVariantFields(event.data.variant_data.highlightVariantFields);\n setVariantOrder(event.data.variant_data.variantOrder || []);\n removeVariantFieldClass();\n addVariantFieldClass(\n event.data.variant_data.variant\n );\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.REMOVE_VARIANT_FIELDS,\n (event: RemoveVariantFieldsEvent) => {\n setHighlightVariantFields(false);\n removeVariantFieldClass(event?.data?.onlyHighlighted);\n }\n );\n}\n"],"mappings":"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","names":["_a"]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/eventManager/useVariantsPostMessageEvent.ts"],"sourcesContent":["import { VisualBuilder } from \"..\";\nimport { visualBuilderStyles } from \"../visualBuilder.style\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { updateVariantClasses } from \"./useRecalculateVariantDataCSLPValues\";\nimport { debounce } from \"lodash-es\";\nimport { extractDetailsFromCslp, isValidCslp } from \"../../cslp/cslpdata\";\n\ninterface VariantFieldsEvent {\n data: {\n variant_data: {\n variant: string;\n highlightVariantFields: boolean;\n variantOrder: string[];\n };\n };\n}\ninterface RemoveVariantFieldsEvent {\n data: {\n onlyHighlighted?: boolean;\n };\n}\n\ninterface AudienceEvent {\n data: {\n audienceMode: boolean;\n };\n}\ninterface VariantEvent {\n data: {\n variant: string | null;\n };\n}\n\ninterface LocaleEvent {\n data: {\n locale: string;\n };\n}\n\nfunction isLowerOrderVariant(variant_uid: string, dataCslp: string, variantOrder: string[]): boolean {\n if(!variantOrder || variantOrder.length === 0) {\n return false;\n }\n const {variant: cslpVariant} = extractDetailsFromCslp(dataCslp);\n const indexOfCmsVariant = variantOrder.lastIndexOf(variant_uid);\n const indexOfCslpVariant = variantOrder.lastIndexOf(cslpVariant || \"\");\n if(indexOfCslpVariant < 0) {\n return false;\n }\n return indexOfCslpVariant < indexOfCmsVariant;\n}\n\n\nexport function addVariantFieldClass(\n variant_uid: string\n): void {\n const variantOrder = VisualBuilder.VisualBuilderGlobalState.value.variantOrder;\n const highlightVariantFields = VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields;\n const elements = document.querySelectorAll(`[data-cslp]`);\n elements.forEach((element) => {\n const dataCslp = element.getAttribute(\"data-cslp\");\n if (!isValidCslp(dataCslp)) return;\n\n if (dataCslp?.includes(variant_uid)) {\n element.classList.add(\"visual-builder__variant-field\");\n if (highlightVariantFields) {\n element.classList.add(\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"]\n );\n }\n } else if (!dataCslp.startsWith(\"v2:\")) {\n element.classList.add(\"visual-builder__base-field\");\n } \n else if (isLowerOrderVariant(variant_uid, dataCslp, variantOrder)) {\n element.classList.add(\"visual-builder__variant-field\", \"visual-builder__lower-order-variant-field\");\n }\n else {\n element.classList.add(\"visual-builder__disabled-variant-field\");\n }\n });\n}\n\nexport const debounceAddVariantFieldClass = debounce(\n addVariantFieldClass,\n 1000,\n { trailing: true }\n) as (variant_uid: string) => void;\n\nexport function removeVariantFieldClass(\n onlyHighlighted: boolean = false\n): void {\n if (onlyHighlighted) {\n const variantElements = document.querySelectorAll(\n `.${visualBuilderStyles()[\"visual-builder__variant-field-outline\"]}`\n );\n variantElements.forEach((element) => {\n element.classList.remove(\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"]\n );\n });\n } else {\n const variantAndBaseFieldElements = document.querySelectorAll(\n \".visual-builder__disabled-variant-field, .visual-builder__variant-field, .visual-builder__base-field, .visual-builder__lower-order-variant-field\" \n );\n variantAndBaseFieldElements.forEach((element) => {\n element.classList.remove(\n \"visual-builder__disabled-variant-field\",\n \"visual-builder__variant-field\",\n visualBuilderStyles()[\"visual-builder__variant-field-outline\"],\n \"visual-builder__base-field\",\n \"visual-builder__lower-order-variant-field\"\n );\n });\n }\n}\n\nexport function setAudienceMode(mode: boolean): void {\n VisualBuilder.VisualBuilderGlobalState.value.audienceMode = mode;\n}\nexport function setVariant(uid: string | null): void {\n VisualBuilder.VisualBuilderGlobalState.value.variant = uid;\n}\nexport function setLocale(locale: string): void {\n VisualBuilder.VisualBuilderGlobalState.value.locale = locale;\n}\nexport function setHighlightVariantFields(highlight: boolean): void {\n VisualBuilder.VisualBuilderGlobalState.value.highlightVariantFields = highlight;\n}\nexport function setVariantOrder(variantOrder: string[]): void {\n VisualBuilder.VisualBuilderGlobalState.value.variantOrder = variantOrder;\n}\n\ninterface GetHighlightVariantFieldsStatusResponse {\n highlightVariantFields: boolean;\n}\nexport async function getHighlightVariantFieldsStatus(): Promise<GetHighlightVariantFieldsStatusResponse> {\n try {\n const result = await visualBuilderPostMessage?.send<GetHighlightVariantFieldsStatusResponse>(\n VisualBuilderPostMessageEvents.GET_HIGHLIGHT_VARIANT_FIELDS_STATUS\n ); \n return result ?? {\n highlightVariantFields: false,\n };\n } catch (error) {\n console.error(\"Failed to get highlight variant fields status:\", error);\n return {\n highlightVariantFields: false,\n };\n }\n}\n\nexport function useVariantFieldsPostMessageEvent({ isSSR }: { isSSR: boolean }): void {\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_VARIANT_ID,\n (event: VariantEvent) => {\n const selectedVariant = event.data.variant;\n setVariant(selectedVariant);\n // clear field schema when variant is changed.\n // this is required as we cache field schema\n // which contain a key isUnlinkedVariant.\n // This key can change when variant is changed,\n // so clear the field schema cache\n FieldSchemaMap.clear();\n if (isSSR) {\n if (selectedVariant) {\n addVariantFieldClass(selectedVariant);\n }\n } else {\n // recalculate and apply classes\n updateVariantClasses();\n }\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.GET_LOCALE,\n (event: LocaleEvent) => {\n setLocale(event.data.locale);\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.SET_AUDIENCE_MODE,\n (event: AudienceEvent) => {\n setAudienceMode(event.data.audienceMode);\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.SHOW_VARIANT_FIELDS,\n (event: VariantFieldsEvent) => {\n setHighlightVariantFields(event.data.variant_data.highlightVariantFields);\n setVariantOrder(event.data.variant_data.variantOrder || []);\n removeVariantFieldClass();\n addVariantFieldClass(\n event.data.variant_data.variant\n );\n }\n );\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.REMOVE_VARIANT_FIELDS,\n (event: RemoveVariantFieldsEvent) => {\n setHighlightVariantFields(false);\n removeVariantFieldClass(event?.data?.onlyHighlighted);\n }\n );\n}\n"],"mappings":"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","names":["_a"]}
@@ -32,7 +32,7 @@ var import_jsx_runtime = require("preact/jsx-runtime");
32
32
  async function generateEmptyBlocks(emptyBlockParents) {
33
33
  for (const emptyBlockParent of emptyBlockParents) {
34
34
  const cslpData = emptyBlockParent.getAttribute("data-cslp");
35
- if (!cslpData) {
35
+ if (!(0, import_cslp.isValidCslp)(cslpData)) {
36
36
  return;
37
37
  }
38
38
  const fieldMetadata = (0, import_cslp.extractDetailsFromCslp)(cslpData);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/generators/generateEmptyBlock.tsx"],"sourcesContent":["import { hydrate } from \"preact\";\nimport { EmptyBlock } from \"../components/emptyBlock\";\nimport { extractDetailsFromCslp } from \"../../cslp\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\n\nexport async function generateEmptyBlocks(\n emptyBlockParents: Element[] | []\n): Promise<void> {\n for (const emptyBlockParent of emptyBlockParents) {\n const cslpData = emptyBlockParent.getAttribute(\"data-cslp\");\n if (!cslpData) {\n return;\n }\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n );\n \n if(!fieldSchema){\n return;\n }\n\n hydrate(\n <EmptyBlock\n details={{\n fieldSchema,\n fieldMetadata,\n }}\n />,\n emptyBlockParent\n );\n }\n}\n\nexport function removeEmptyBlocks(emptyBlockParents: Element[] | []): void {\n emptyBlockParents?.forEach((emptyBlockParent) => {\n const emptyBlock = emptyBlockParent.querySelector(\n \".visual-builder__empty-block\"\n );\n\n if (emptyBlock) {\n emptyBlock.remove();\n }\n });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAwB;AACxB,wBAA2B;AAC3B,kBAAuC;AACvC,4BAA+B;AAsBnB;AApBZ,eAAsB,oBAClB,mBACa;AACb,aAAW,oBAAoB,mBAAmB;AAC9C,UAAM,WAAW,iBAAiB,aAAa,WAAW;AAC1D,QAAI,CAAC,UAAU;AACX;AAAA,IACJ;AACA,UAAM,oBAAgB,oCAAuB,QAAQ;AAErD,UAAM,cAAc,MAAM,qCAAe;AAAA,MACrC,cAAc;AAAA,MACd,cAAc;AAAA,IAClB;AAEA,QAAG,CAAC,aAAY;AACZ;AAAA,IACJ;AAEA;AAAA,MACI;AAAA,QAAC;AAAA;AAAA,UACG,SAAS;AAAA,YACL;AAAA,YACA;AAAA,UACJ;AAAA;AAAA,MACJ;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AACJ;AAEO,SAAS,kBAAkB,mBAAyC;AACvE,yDAAmB,QAAQ,CAAC,qBAAqB;AAC7C,UAAM,aAAa,iBAAiB;AAAA,MAChC;AAAA,IACJ;AAEA,QAAI,YAAY;AACZ,iBAAW,OAAO;AAAA,IACtB;AAAA,EACJ;AACJ;","names":[]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/generators/generateEmptyBlock.tsx"],"sourcesContent":["import { hydrate } from \"preact\";\nimport React from \"preact/compat\";\nimport { EmptyBlock } from \"../components/emptyBlock\";\nimport { extractDetailsFromCslp, isValidCslp } from \"../../cslp\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\n\nexport async function generateEmptyBlocks(\n emptyBlockParents: Element[] | []\n): Promise<void> {\n for (const emptyBlockParent of emptyBlockParents) {\n const cslpData = emptyBlockParent.getAttribute(\"data-cslp\");\n if (!isValidCslp(cslpData)) {\n return;\n }\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n );\n \n if(!fieldSchema){\n return;\n }\n\n hydrate(\n <EmptyBlock\n details={{\n fieldSchema,\n fieldMetadata,\n }}\n />,\n emptyBlockParent\n );\n }\n}\n\nexport function removeEmptyBlocks(emptyBlockParents: Element[] | []): void {\n emptyBlockParents?.forEach((emptyBlockParent) => {\n const emptyBlock = emptyBlockParent.querySelector(\n \".visual-builder__empty-block\"\n );\n\n if (emptyBlock) {\n emptyBlock.remove();\n }\n });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAwB;AAExB,wBAA2B;AAC3B,kBAAoD;AACpD,4BAA+B;AAsBnB;AApBZ,eAAsB,oBAClB,mBACa;AACb,aAAW,oBAAoB,mBAAmB;AAC9C,UAAM,WAAW,iBAAiB,aAAa,WAAW;AAC1D,QAAI,KAAC,yBAAY,QAAQ,GAAG;AACxB;AAAA,IACJ;AACA,UAAM,oBAAgB,oCAAuB,QAAQ;AAErD,UAAM,cAAc,MAAM,qCAAe;AAAA,MACrC,cAAc;AAAA,MACd,cAAc;AAAA,IAClB;AAEA,QAAG,CAAC,aAAY;AACZ;AAAA,IACJ;AAEA;AAAA,MACI;AAAA,QAAC;AAAA;AAAA,UACG,SAAS;AAAA,YACL;AAAA,YACA;AAAA,UACJ;AAAA;AAAA,MACJ;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AACJ;AAEO,SAAS,kBAAkB,mBAAyC;AACvE,yDAAmB,QAAQ,CAAC,qBAAqB;AAC7C,UAAM,aAAa,iBAAiB;AAAA,MAChC;AAAA,IACJ;AAEA,QAAI,YAAY;AACZ,iBAAW,OAAO;AAAA,IACtB;AAAA,EACJ;AACJ;","names":[]}
@@ -3,13 +3,13 @@ import "../../chunk-5WRI5ZAA.js";
3
3
  // src/visualBuilder/generators/generateEmptyBlock.tsx
4
4
  import { hydrate } from "preact";
5
5
  import { EmptyBlock } from "../components/emptyBlock.js";
6
- import { extractDetailsFromCslp } from "../../cslp/index.js";
6
+ import { extractDetailsFromCslp, isValidCslp } from "../../cslp/index.js";
7
7
  import { FieldSchemaMap } from "../utils/fieldSchemaMap.js";
8
8
  import { jsx } from "preact/jsx-runtime";
9
9
  async function generateEmptyBlocks(emptyBlockParents) {
10
10
  for (const emptyBlockParent of emptyBlockParents) {
11
11
  const cslpData = emptyBlockParent.getAttribute("data-cslp");
12
- if (!cslpData) {
12
+ if (!isValidCslp(cslpData)) {
13
13
  return;
14
14
  }
15
15
  const fieldMetadata = extractDetailsFromCslp(cslpData);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/generators/generateEmptyBlock.tsx"],"sourcesContent":["import { hydrate } from \"preact\";\nimport { EmptyBlock } from \"../components/emptyBlock\";\nimport { extractDetailsFromCslp } from \"../../cslp\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\n\nexport async function generateEmptyBlocks(\n emptyBlockParents: Element[] | []\n): Promise<void> {\n for (const emptyBlockParent of emptyBlockParents) {\n const cslpData = emptyBlockParent.getAttribute(\"data-cslp\");\n if (!cslpData) {\n return;\n }\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n );\n \n if(!fieldSchema){\n return;\n }\n\n hydrate(\n <EmptyBlock\n details={{\n fieldSchema,\n fieldMetadata,\n }}\n />,\n emptyBlockParent\n );\n }\n}\n\nexport function removeEmptyBlocks(emptyBlockParents: Element[] | []): void {\n emptyBlockParents?.forEach((emptyBlockParent) => {\n const emptyBlock = emptyBlockParent.querySelector(\n \".visual-builder__empty-block\"\n );\n\n if (emptyBlock) {\n emptyBlock.remove();\n }\n });\n}\n"],"mappings":";;;AAAA,SAAS,eAAe;AACxB,SAAS,kBAAkB;AAC3B,SAAS,8BAA8B;AACvC,SAAS,sBAAsB;AAsBnB;AApBZ,eAAsB,oBAClB,mBACa;AACb,aAAW,oBAAoB,mBAAmB;AAC9C,UAAM,WAAW,iBAAiB,aAAa,WAAW;AAC1D,QAAI,CAAC,UAAU;AACX;AAAA,IACJ;AACA,UAAM,gBAAgB,uBAAuB,QAAQ;AAErD,UAAM,cAAc,MAAM,eAAe;AAAA,MACrC,cAAc;AAAA,MACd,cAAc;AAAA,IAClB;AAEA,QAAG,CAAC,aAAY;AACZ;AAAA,IACJ;AAEA;AAAA,MACI;AAAA,QAAC;AAAA;AAAA,UACG,SAAS;AAAA,YACL;AAAA,YACA;AAAA,UACJ;AAAA;AAAA,MACJ;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AACJ;AAEO,SAAS,kBAAkB,mBAAyC;AACvE,yDAAmB,QAAQ,CAAC,qBAAqB;AAC7C,UAAM,aAAa,iBAAiB;AAAA,MAChC;AAAA,IACJ;AAEA,QAAI,YAAY;AACZ,iBAAW,OAAO;AAAA,IACtB;AAAA,EACJ;AACJ;","names":[]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/generators/generateEmptyBlock.tsx"],"sourcesContent":["import { hydrate } from \"preact\";\nimport React from \"preact/compat\";\nimport { EmptyBlock } from \"../components/emptyBlock\";\nimport { extractDetailsFromCslp, isValidCslp } from \"../../cslp\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\n\nexport async function generateEmptyBlocks(\n emptyBlockParents: Element[] | []\n): Promise<void> {\n for (const emptyBlockParent of emptyBlockParents) {\n const cslpData = emptyBlockParent.getAttribute(\"data-cslp\");\n if (!isValidCslp(cslpData)) {\n return;\n }\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n const fieldSchema = await FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n );\n \n if(!fieldSchema){\n return;\n }\n\n hydrate(\n <EmptyBlock\n details={{\n fieldSchema,\n fieldMetadata,\n }}\n />,\n emptyBlockParent\n );\n }\n}\n\nexport function removeEmptyBlocks(emptyBlockParents: Element[] | []): void {\n emptyBlockParents?.forEach((emptyBlockParent) => {\n const emptyBlock = emptyBlockParent.querySelector(\n \".visual-builder__empty-block\"\n );\n\n if (emptyBlock) {\n emptyBlock.remove();\n }\n });\n}\n"],"mappings":";;;AAAA,SAAS,eAAe;AAExB,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB,mBAAmB;AACpD,SAAS,sBAAsB;AAsBnB;AApBZ,eAAsB,oBAClB,mBACa;AACb,aAAW,oBAAoB,mBAAmB;AAC9C,UAAM,WAAW,iBAAiB,aAAa,WAAW;AAC1D,QAAI,CAAC,YAAY,QAAQ,GAAG;AACxB;AAAA,IACJ;AACA,UAAM,gBAAgB,uBAAuB,QAAQ;AAErD,UAAM,cAAc,MAAM,eAAe;AAAA,MACrC,cAAc;AAAA,MACd,cAAc;AAAA,IAClB;AAEA,QAAG,CAAC,aAAY;AACZ;AAAA,IACJ;AAEA;AAAA,MACI;AAAA,QAAC;AAAA;AAAA,UACG,SAAS;AAAA,YACL;AAAA,YACA;AAAA,UACJ;AAAA;AAAA,MACJ;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AACJ;AAEO,SAAS,kBAAkB,mBAAyC;AACvE,yDAAmB,QAAQ,CAAC,qBAAqB;AAC7C,UAAM,aAAa,iBAAiB;AAAA,MAChC;AAAA,IACJ;AAEA,QAAI,YAAY;AACZ,iBAAW,OAAO;AAAA,IACtB;AAAA,EACJ;AACJ;","names":[]}
@@ -42,13 +42,14 @@ var import_preact = require("preact");
42
42
  var import_preact2 = require("preact");
43
43
  var import_HighlightedCommentIcon = __toESM(require("../components/HighlightedCommentIcon.cjs"), 1);
44
44
  var import_goober = require("goober");
45
+ var import_cslp = require("../../cslp/index.cjs");
45
46
  var highlighCommentOffset = 25;
46
47
  function highlightCommentIconOnCanvas(payload) {
47
48
  const uniquePaths = {};
48
49
  payload.forEach((data) => {
49
50
  var _a;
50
51
  const cslpValue = (_a = data == null ? void 0 : data.fieldMetadata) == null ? void 0 : _a.cslpValue;
51
- if (!cslpValue || uniquePaths[cslpValue]) {
52
+ if (!(0, import_cslp.isValidCslp)(cslpValue) || uniquePaths[cslpValue]) {
52
53
  return;
53
54
  }
54
55
  uniquePaths[cslpValue] = true;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/generators/generateHighlightedComment.tsx"],"sourcesContent":["import { h, VNode } from \"preact\"; // Explicitly import VNode from Preact\nimport { render } from \"preact\";\nimport HighlightedCommentIcon from \"../components/HighlightedCommentIcon\";\nimport { css } from \"goober\";\nimport React from \"preact/compat\";\nimport { IHighlightCommentData } from \"../eventManager/useHighlightCommentIcon\";\n\n/**\n * Inserts highlighted comment icons based on an array of paths.\n *\n * This function locates elements in the DOM based on the `fieldMetadata.cslpValue`,\n * and appends a comment icon near each matching element.\n *\n * @param payload - Array of comment data with field metadata, schema, absolutePath and discussion ID.\n */\nconst highlighCommentOffset = 25;\n\nexport function highlightCommentIconOnCanvas(\n payload: IHighlightCommentData[]\n): void {\n const uniquePaths: { [key: string]: boolean } = {}; // Using object for uniqueness\n\n payload.forEach((data) => {\n const cslpValue = data?.fieldMetadata?.cslpValue;\n\n // Check if the cslpValue is already in the Object\n if (!cslpValue || uniquePaths[cslpValue]) {\n return; // Skip if the value is not unique\n }\n\n uniquePaths[cslpValue] = true; // Mark it as processed\n\n const element = document.querySelector(`[data-cslp=\"${cslpValue}\"]`);\n if (element && element instanceof HTMLElement) {\n const { top, left } = element.getBoundingClientRect();\n\n const iconContainer = document.createElement(\"div\");\n iconContainer.setAttribute(\"field-path\", cslpValue);\n\n iconContainer.style.position = \"fixed\";\n iconContainer.style.top = `${top - highlighCommentOffset}px`;\n iconContainer.style.left = `${left - highlighCommentOffset}px`;\n iconContainer.style.zIndex = \"900\";\n iconContainer.style.cursor = \"pointer\";\n iconContainer.className = \"highlighted-comment collab-icon\";\n\n // Render the HighlightedCommentIcon using Preact's render method\n render(\n h(HighlightedCommentIcon, { data }), // Use h directly with Preact\n iconContainer\n );\n\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n if (visualBuilderContainer) {\n let highlightCommentWrapper =\n visualBuilderContainer.querySelector(\n \".visual-builder__highlighted-comment-wrapper\"\n );\n if (!highlightCommentWrapper) {\n highlightCommentWrapper = document.createElement(\"div\");\n highlightCommentWrapper.className =\n \"visual-builder__highlighted-comment-wrapper\";\n visualBuilderContainer.appendChild(highlightCommentWrapper);\n }\n highlightCommentWrapper.appendChild(iconContainer);\n }\n }\n });\n}\n\n/**\n * Update Highlighted comment position , whenever scroll or resize happen.\n */\n\nexport function updateHighlightedCommentIconPosition() {\n // Query all elements with the .highlighted-comment class\n const icons = document.querySelectorAll(\".highlighted-comment\");\n\n icons.forEach((icon) => {\n if (icon && icon instanceof HTMLElement) {\n // Get the field-path attribute from the icon container\n const path = icon.getAttribute(\"field-path\");\n if (path) {\n // Query the target element using the path\n const targetElement = document.querySelector(\n `[data-cslp=\"${path}\"]`\n );\n if (targetElement && targetElement instanceof HTMLElement) {\n // Get the target element's position relative to the viewport\n const { top, left } = targetElement.getBoundingClientRect();\n\n // Update the position of the icon container\n icon.style.top = `${top - highlighCommentOffset}px`; // Adjust based on the target element's top\n icon.style.left = `${left - highlighCommentOffset}px`; // Adjust based on the target element's left\n }\n }\n }\n });\n}\n\n/**\n * Removes the first highlighted comment icon based on an array of paths.\n *\n * @param pathsToRemove - Array of field-paths to remove.\n */\nexport function removeHighlightedCommentIcon(pathToRemove: string): void {\n // Loop through each path in the array\n const iconToRemove = document.querySelectorAll(\n `.highlighted-comment[field-path=\"${pathToRemove}\"]`\n );\n iconToRemove?.forEach((icon) => icon?.remove());\n}\n\nexport function removeAllHighlightedCommentIcons(): void {\n const icons = document.querySelectorAll(\".highlighted-comment\");\n icons?.forEach((icon) => icon?.remove());\n}\n\n// Define a hidden class in goober\nconst hiddenClass = css`\n display: none;\n`;\n\n/**\n * Toggle display style of a specific highlighted comment icon.\n *\n * @param path - The data-cslp attribute of the element whose corresponding highlighted comment icon should be toggled.\n * @param shouldShow - Boolean value to determine whether to show or hide the icon.\n * If true, the icon will be displayed. If false, the icon will be hidden.\n */\nexport function toggleHighlightedCommentIconDisplay(\n path: string,\n shouldShow: boolean\n): void {\n const icons = document.querySelectorAll<HTMLElement>(\n `.highlighted-comment[field-path=\"${path}\"]`\n );\n\n icons.forEach((icon) => {\n if (shouldShow) {\n icon.classList.remove(hiddenClass); // Show the element\n } else {\n icon.classList.add(hiddenClass); // Hide the element using goober's hidden class\n }\n });\n}\n\n/**\n * Show all .highlighted-comment icons that have the hiddenClass applied.\n */\nexport function showAllHiddenHighlightedCommentIcons(): void {\n // Query all elements that have both .highlighted-comment and hiddenClass\n const hiddenIcons = document.querySelectorAll<HTMLElement>(\n `.highlighted-comment.${hiddenClass}`\n );\n\n // Loop through each hidden icon and remove the hiddenClass\n hiddenIcons.forEach((icon) => {\n icon.classList.remove(hiddenClass); // Remove the hiddenClass to show the icon\n });\n}\n"],"mappings":"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","names":["import_preact","HighlightedCommentIcon"]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/generators/generateHighlightedComment.tsx"],"sourcesContent":["import { h, VNode } from \"preact\"; // Explicitly import VNode from Preact\nimport { render } from \"preact\";\nimport HighlightedCommentIcon from \"../components/HighlightedCommentIcon\";\nimport { css } from \"goober\";\nimport React from \"preact/compat\";\nimport { IHighlightCommentData } from \"../eventManager/useHighlightCommentIcon\";\nimport { isValidCslp } from \"../../cslp\";\n\n/**\n * Inserts highlighted comment icons based on an array of paths.\n *\n * This function locates elements in the DOM based on the `fieldMetadata.cslpValue`,\n * and appends a comment icon near each matching element.\n *\n * @param payload - Array of comment data with field metadata, schema, absolutePath and discussion ID.\n */\nconst highlighCommentOffset = 25;\n\nexport function highlightCommentIconOnCanvas(\n payload: IHighlightCommentData[]\n): void {\n const uniquePaths: { [key: string]: boolean } = {}; // Using object for uniqueness\n\n payload.forEach((data) => {\n const cslpValue = data?.fieldMetadata?.cslpValue;\n\n // Check if the cslpValue is already in the Object\n if (!isValidCslp(cslpValue) || uniquePaths[cslpValue]) {\n return; // Skip if the value is not unique\n }\n\n uniquePaths[cslpValue] = true; // Mark it as processed\n\n const element = document.querySelector(`[data-cslp=\"${cslpValue}\"]`);\n if (element && element instanceof HTMLElement) {\n const { top, left } = element.getBoundingClientRect();\n\n const iconContainer = document.createElement(\"div\");\n iconContainer.setAttribute(\"field-path\", cslpValue);\n\n iconContainer.style.position = \"fixed\";\n iconContainer.style.top = `${top - highlighCommentOffset}px`;\n iconContainer.style.left = `${left - highlighCommentOffset}px`;\n iconContainer.style.zIndex = \"900\";\n iconContainer.style.cursor = \"pointer\";\n iconContainer.className = \"highlighted-comment collab-icon\";\n\n // Render the HighlightedCommentIcon using Preact's render method\n render(\n h(HighlightedCommentIcon, { data }), // Use h directly with Preact\n iconContainer\n );\n\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n if (visualBuilderContainer) {\n let highlightCommentWrapper =\n visualBuilderContainer.querySelector(\n \".visual-builder__highlighted-comment-wrapper\"\n );\n if (!highlightCommentWrapper) {\n highlightCommentWrapper = document.createElement(\"div\");\n highlightCommentWrapper.className =\n \"visual-builder__highlighted-comment-wrapper\";\n visualBuilderContainer.appendChild(highlightCommentWrapper);\n }\n highlightCommentWrapper.appendChild(iconContainer);\n }\n }\n });\n}\n\n/**\n * Update Highlighted comment position , whenever scroll or resize happen.\n */\n\nexport function updateHighlightedCommentIconPosition() {\n // Query all elements with the .highlighted-comment class\n const icons = document.querySelectorAll(\".highlighted-comment\");\n\n icons.forEach((icon) => {\n if (icon && icon instanceof HTMLElement) {\n // Get the field-path attribute from the icon container\n const path = icon.getAttribute(\"field-path\");\n if (path) {\n // Query the target element using the path\n const targetElement = document.querySelector(\n `[data-cslp=\"${path}\"]`\n );\n if (targetElement && targetElement instanceof HTMLElement) {\n // Get the target element's position relative to the viewport\n const { top, left } = targetElement.getBoundingClientRect();\n\n // Update the position of the icon container\n icon.style.top = `${top - highlighCommentOffset}px`; // Adjust based on the target element's top\n icon.style.left = `${left - highlighCommentOffset}px`; // Adjust based on the target element's left\n }\n }\n }\n });\n}\n\n/**\n * Removes the first highlighted comment icon based on an array of paths.\n *\n * @param pathsToRemove - Array of field-paths to remove.\n */\nexport function removeHighlightedCommentIcon(pathToRemove: string): void {\n // Loop through each path in the array\n const iconToRemove = document.querySelectorAll(\n `.highlighted-comment[field-path=\"${pathToRemove}\"]`\n );\n iconToRemove?.forEach((icon) => icon?.remove());\n}\n\nexport function removeAllHighlightedCommentIcons(): void {\n const icons = document.querySelectorAll(\".highlighted-comment\");\n icons?.forEach((icon) => icon?.remove());\n}\n\n// Define a hidden class in goober\nconst hiddenClass = css`\n display: none;\n`;\n\n/**\n * Toggle display style of a specific highlighted comment icon.\n *\n * @param path - The data-cslp attribute of the element whose corresponding highlighted comment icon should be toggled.\n * @param shouldShow - Boolean value to determine whether to show or hide the icon.\n * If true, the icon will be displayed. If false, the icon will be hidden.\n */\nexport function toggleHighlightedCommentIconDisplay(\n path: string,\n shouldShow: boolean\n): void {\n const icons = document.querySelectorAll<HTMLElement>(\n `.highlighted-comment[field-path=\"${path}\"]`\n );\n\n icons.forEach((icon) => {\n if (shouldShow) {\n icon.classList.remove(hiddenClass); // Show the element\n } else {\n icon.classList.add(hiddenClass); // Hide the element using goober's hidden class\n }\n });\n}\n\n/**\n * Show all .highlighted-comment icons that have the hiddenClass applied.\n */\nexport function showAllHiddenHighlightedCommentIcons(): void {\n // Query all elements that have both .highlighted-comment and hiddenClass\n const hiddenIcons = document.querySelectorAll<HTMLElement>(\n `.highlighted-comment.${hiddenClass}`\n );\n\n // Loop through each hidden icon and remove the hiddenClass\n hiddenIcons.forEach((icon) => {\n icon.classList.remove(hiddenClass); // Remove the hiddenClass to show the icon\n });\n}\n"],"mappings":"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","names":["import_preact","HighlightedCommentIcon"]}
@@ -5,13 +5,14 @@ import { h } from "preact";
5
5
  import { render } from "preact";
6
6
  import HighlightedCommentIcon from "../components/HighlightedCommentIcon.js";
7
7
  import { css } from "goober";
8
+ import { isValidCslp } from "../../cslp/index.js";
8
9
  var highlighCommentOffset = 25;
9
10
  function highlightCommentIconOnCanvas(payload) {
10
11
  const uniquePaths = {};
11
12
  payload.forEach((data) => {
12
13
  var _a;
13
14
  const cslpValue = (_a = data == null ? void 0 : data.fieldMetadata) == null ? void 0 : _a.cslpValue;
14
- if (!cslpValue || uniquePaths[cslpValue]) {
15
+ if (!isValidCslp(cslpValue) || uniquePaths[cslpValue]) {
15
16
  return;
16
17
  }
17
18
  uniquePaths[cslpValue] = true;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/generators/generateHighlightedComment.tsx"],"sourcesContent":["import { h, VNode } from \"preact\"; // Explicitly import VNode from Preact\nimport { render } from \"preact\";\nimport HighlightedCommentIcon from \"../components/HighlightedCommentIcon\";\nimport { css } from \"goober\";\nimport React from \"preact/compat\";\nimport { IHighlightCommentData } from \"../eventManager/useHighlightCommentIcon\";\n\n/**\n * Inserts highlighted comment icons based on an array of paths.\n *\n * This function locates elements in the DOM based on the `fieldMetadata.cslpValue`,\n * and appends a comment icon near each matching element.\n *\n * @param payload - Array of comment data with field metadata, schema, absolutePath and discussion ID.\n */\nconst highlighCommentOffset = 25;\n\nexport function highlightCommentIconOnCanvas(\n payload: IHighlightCommentData[]\n): void {\n const uniquePaths: { [key: string]: boolean } = {}; // Using object for uniqueness\n\n payload.forEach((data) => {\n const cslpValue = data?.fieldMetadata?.cslpValue;\n\n // Check if the cslpValue is already in the Object\n if (!cslpValue || uniquePaths[cslpValue]) {\n return; // Skip if the value is not unique\n }\n\n uniquePaths[cslpValue] = true; // Mark it as processed\n\n const element = document.querySelector(`[data-cslp=\"${cslpValue}\"]`);\n if (element && element instanceof HTMLElement) {\n const { top, left } = element.getBoundingClientRect();\n\n const iconContainer = document.createElement(\"div\");\n iconContainer.setAttribute(\"field-path\", cslpValue);\n\n iconContainer.style.position = \"fixed\";\n iconContainer.style.top = `${top - highlighCommentOffset}px`;\n iconContainer.style.left = `${left - highlighCommentOffset}px`;\n iconContainer.style.zIndex = \"900\";\n iconContainer.style.cursor = \"pointer\";\n iconContainer.className = \"highlighted-comment collab-icon\";\n\n // Render the HighlightedCommentIcon using Preact's render method\n render(\n h(HighlightedCommentIcon, { data }), // Use h directly with Preact\n iconContainer\n );\n\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n if (visualBuilderContainer) {\n let highlightCommentWrapper =\n visualBuilderContainer.querySelector(\n \".visual-builder__highlighted-comment-wrapper\"\n );\n if (!highlightCommentWrapper) {\n highlightCommentWrapper = document.createElement(\"div\");\n highlightCommentWrapper.className =\n \"visual-builder__highlighted-comment-wrapper\";\n visualBuilderContainer.appendChild(highlightCommentWrapper);\n }\n highlightCommentWrapper.appendChild(iconContainer);\n }\n }\n });\n}\n\n/**\n * Update Highlighted comment position , whenever scroll or resize happen.\n */\n\nexport function updateHighlightedCommentIconPosition() {\n // Query all elements with the .highlighted-comment class\n const icons = document.querySelectorAll(\".highlighted-comment\");\n\n icons.forEach((icon) => {\n if (icon && icon instanceof HTMLElement) {\n // Get the field-path attribute from the icon container\n const path = icon.getAttribute(\"field-path\");\n if (path) {\n // Query the target element using the path\n const targetElement = document.querySelector(\n `[data-cslp=\"${path}\"]`\n );\n if (targetElement && targetElement instanceof HTMLElement) {\n // Get the target element's position relative to the viewport\n const { top, left } = targetElement.getBoundingClientRect();\n\n // Update the position of the icon container\n icon.style.top = `${top - highlighCommentOffset}px`; // Adjust based on the target element's top\n icon.style.left = `${left - highlighCommentOffset}px`; // Adjust based on the target element's left\n }\n }\n }\n });\n}\n\n/**\n * Removes the first highlighted comment icon based on an array of paths.\n *\n * @param pathsToRemove - Array of field-paths to remove.\n */\nexport function removeHighlightedCommentIcon(pathToRemove: string): void {\n // Loop through each path in the array\n const iconToRemove = document.querySelectorAll(\n `.highlighted-comment[field-path=\"${pathToRemove}\"]`\n );\n iconToRemove?.forEach((icon) => icon?.remove());\n}\n\nexport function removeAllHighlightedCommentIcons(): void {\n const icons = document.querySelectorAll(\".highlighted-comment\");\n icons?.forEach((icon) => icon?.remove());\n}\n\n// Define a hidden class in goober\nconst hiddenClass = css`\n display: none;\n`;\n\n/**\n * Toggle display style of a specific highlighted comment icon.\n *\n * @param path - The data-cslp attribute of the element whose corresponding highlighted comment icon should be toggled.\n * @param shouldShow - Boolean value to determine whether to show or hide the icon.\n * If true, the icon will be displayed. If false, the icon will be hidden.\n */\nexport function toggleHighlightedCommentIconDisplay(\n path: string,\n shouldShow: boolean\n): void {\n const icons = document.querySelectorAll<HTMLElement>(\n `.highlighted-comment[field-path=\"${path}\"]`\n );\n\n icons.forEach((icon) => {\n if (shouldShow) {\n icon.classList.remove(hiddenClass); // Show the element\n } else {\n icon.classList.add(hiddenClass); // Hide the element using goober's hidden class\n }\n });\n}\n\n/**\n * Show all .highlighted-comment icons that have the hiddenClass applied.\n */\nexport function showAllHiddenHighlightedCommentIcons(): void {\n // Query all elements that have both .highlighted-comment and hiddenClass\n const hiddenIcons = document.querySelectorAll<HTMLElement>(\n `.highlighted-comment.${hiddenClass}`\n );\n\n // Loop through each hidden icon and remove the hiddenClass\n hiddenIcons.forEach((icon) => {\n icon.classList.remove(hiddenClass); // Remove the hiddenClass to show the icon\n });\n}\n"],"mappings":";;;AAAA,SAAS,SAAgB;AACzB,SAAS,cAAc;AACvB,OAAO,4BAA4B;AACnC,SAAS,WAAW;AAYpB,IAAM,wBAAwB;AAEvB,SAAS,6BACZ,SACI;AACJ,QAAM,cAA0C,CAAC;AAEjD,UAAQ,QAAQ,CAAC,SAAS;AAtB9B;AAuBQ,UAAM,aAAY,kCAAM,kBAAN,mBAAqB;AAGvC,QAAI,CAAC,aAAa,YAAY,SAAS,GAAG;AACtC;AAAA,IACJ;AAEA,gBAAY,SAAS,IAAI;AAEzB,UAAM,UAAU,SAAS,cAAc,eAAe,SAAS,IAAI;AACnE,QAAI,WAAW,mBAAmB,aAAa;AAC3C,YAAM,EAAE,KAAK,KAAK,IAAI,QAAQ,sBAAsB;AAEpD,YAAM,gBAAgB,SAAS,cAAc,KAAK;AAClD,oBAAc,aAAa,cAAc,SAAS;AAElD,oBAAc,MAAM,WAAW;AAC/B,oBAAc,MAAM,MAAM,GAAG,MAAM,qBAAqB;AACxD,oBAAc,MAAM,OAAO,GAAG,OAAO,qBAAqB;AAC1D,oBAAc,MAAM,SAAS;AAC7B,oBAAc,MAAM,SAAS;AAC7B,oBAAc,YAAY;AAG1B;AAAA,QACI,EAAE,wBAAwB,EAAE,KAAK,CAAC;AAAA;AAAA,QAClC;AAAA,MACJ;AAEA,YAAM,yBAAyB,SAAS;AAAA,QACpC;AAAA,MACJ;AACA,UAAI,wBAAwB;AACxB,YAAI,0BACA,uBAAuB;AAAA,UACnB;AAAA,QACJ;AACJ,YAAI,CAAC,yBAAyB;AAC1B,oCAA0B,SAAS,cAAc,KAAK;AACtD,kCAAwB,YACpB;AACJ,iCAAuB,YAAY,uBAAuB;AAAA,QAC9D;AACA,gCAAwB,YAAY,aAAa;AAAA,MACrD;AAAA,IACJ;AAAA,EACJ,CAAC;AACL;AAMO,SAAS,uCAAuC;AAEnD,QAAM,QAAQ,SAAS,iBAAiB,sBAAsB;AAE9D,QAAM,QAAQ,CAAC,SAAS;AACpB,QAAI,QAAQ,gBAAgB,aAAa;AAErC,YAAM,OAAO,KAAK,aAAa,YAAY;AAC3C,UAAI,MAAM;AAEN,cAAM,gBAAgB,SAAS;AAAA,UAC3B,eAAe,IAAI;AAAA,QACvB;AACA,YAAI,iBAAiB,yBAAyB,aAAa;AAEvD,gBAAM,EAAE,KAAK,KAAK,IAAI,cAAc,sBAAsB;AAG1D,eAAK,MAAM,MAAM,GAAG,MAAM,qBAAqB;AAC/C,eAAK,MAAM,OAAO,GAAG,OAAO,qBAAqB;AAAA,QACrD;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ,CAAC;AACL;AAOO,SAAS,6BAA6B,cAA4B;AAErE,QAAM,eAAe,SAAS;AAAA,IAC1B,oCAAoC,YAAY;AAAA,EACpD;AACA,+CAAc,QAAQ,CAAC,SAAS,6BAAM;AAC1C;AAEO,SAAS,mCAAyC;AACrD,QAAM,QAAQ,SAAS,iBAAiB,sBAAsB;AAC9D,iCAAO,QAAQ,CAAC,SAAS,6BAAM;AACnC;AAGA,IAAM,cAAc;AAAA;AAAA;AAWb,SAAS,oCACZ,MACA,YACI;AACJ,QAAM,QAAQ,SAAS;AAAA,IACnB,oCAAoC,IAAI;AAAA,EAC5C;AAEA,QAAM,QAAQ,CAAC,SAAS;AACpB,QAAI,YAAY;AACZ,WAAK,UAAU,OAAO,WAAW;AAAA,IACrC,OAAO;AACH,WAAK,UAAU,IAAI,WAAW;AAAA,IAClC;AAAA,EACJ,CAAC;AACL;AAKO,SAAS,uCAA6C;AAEzD,QAAM,cAAc,SAAS;AAAA,IACzB,wBAAwB,WAAW;AAAA,EACvC;AAGA,cAAY,QAAQ,CAAC,SAAS;AAC1B,SAAK,UAAU,OAAO,WAAW;AAAA,EACrC,CAAC;AACL;","names":[]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/generators/generateHighlightedComment.tsx"],"sourcesContent":["import { h, VNode } from \"preact\"; // Explicitly import VNode from Preact\nimport { render } from \"preact\";\nimport HighlightedCommentIcon from \"../components/HighlightedCommentIcon\";\nimport { css } from \"goober\";\nimport React from \"preact/compat\";\nimport { IHighlightCommentData } from \"../eventManager/useHighlightCommentIcon\";\nimport { isValidCslp } from \"../../cslp\";\n\n/**\n * Inserts highlighted comment icons based on an array of paths.\n *\n * This function locates elements in the DOM based on the `fieldMetadata.cslpValue`,\n * and appends a comment icon near each matching element.\n *\n * @param payload - Array of comment data with field metadata, schema, absolutePath and discussion ID.\n */\nconst highlighCommentOffset = 25;\n\nexport function highlightCommentIconOnCanvas(\n payload: IHighlightCommentData[]\n): void {\n const uniquePaths: { [key: string]: boolean } = {}; // Using object for uniqueness\n\n payload.forEach((data) => {\n const cslpValue = data?.fieldMetadata?.cslpValue;\n\n // Check if the cslpValue is already in the Object\n if (!isValidCslp(cslpValue) || uniquePaths[cslpValue]) {\n return; // Skip if the value is not unique\n }\n\n uniquePaths[cslpValue] = true; // Mark it as processed\n\n const element = document.querySelector(`[data-cslp=\"${cslpValue}\"]`);\n if (element && element instanceof HTMLElement) {\n const { top, left } = element.getBoundingClientRect();\n\n const iconContainer = document.createElement(\"div\");\n iconContainer.setAttribute(\"field-path\", cslpValue);\n\n iconContainer.style.position = \"fixed\";\n iconContainer.style.top = `${top - highlighCommentOffset}px`;\n iconContainer.style.left = `${left - highlighCommentOffset}px`;\n iconContainer.style.zIndex = \"900\";\n iconContainer.style.cursor = \"pointer\";\n iconContainer.className = \"highlighted-comment collab-icon\";\n\n // Render the HighlightedCommentIcon using Preact's render method\n render(\n h(HighlightedCommentIcon, { data }), // Use h directly with Preact\n iconContainer\n );\n\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n if (visualBuilderContainer) {\n let highlightCommentWrapper =\n visualBuilderContainer.querySelector(\n \".visual-builder__highlighted-comment-wrapper\"\n );\n if (!highlightCommentWrapper) {\n highlightCommentWrapper = document.createElement(\"div\");\n highlightCommentWrapper.className =\n \"visual-builder__highlighted-comment-wrapper\";\n visualBuilderContainer.appendChild(highlightCommentWrapper);\n }\n highlightCommentWrapper.appendChild(iconContainer);\n }\n }\n });\n}\n\n/**\n * Update Highlighted comment position , whenever scroll or resize happen.\n */\n\nexport function updateHighlightedCommentIconPosition() {\n // Query all elements with the .highlighted-comment class\n const icons = document.querySelectorAll(\".highlighted-comment\");\n\n icons.forEach((icon) => {\n if (icon && icon instanceof HTMLElement) {\n // Get the field-path attribute from the icon container\n const path = icon.getAttribute(\"field-path\");\n if (path) {\n // Query the target element using the path\n const targetElement = document.querySelector(\n `[data-cslp=\"${path}\"]`\n );\n if (targetElement && targetElement instanceof HTMLElement) {\n // Get the target element's position relative to the viewport\n const { top, left } = targetElement.getBoundingClientRect();\n\n // Update the position of the icon container\n icon.style.top = `${top - highlighCommentOffset}px`; // Adjust based on the target element's top\n icon.style.left = `${left - highlighCommentOffset}px`; // Adjust based on the target element's left\n }\n }\n }\n });\n}\n\n/**\n * Removes the first highlighted comment icon based on an array of paths.\n *\n * @param pathsToRemove - Array of field-paths to remove.\n */\nexport function removeHighlightedCommentIcon(pathToRemove: string): void {\n // Loop through each path in the array\n const iconToRemove = document.querySelectorAll(\n `.highlighted-comment[field-path=\"${pathToRemove}\"]`\n );\n iconToRemove?.forEach((icon) => icon?.remove());\n}\n\nexport function removeAllHighlightedCommentIcons(): void {\n const icons = document.querySelectorAll(\".highlighted-comment\");\n icons?.forEach((icon) => icon?.remove());\n}\n\n// Define a hidden class in goober\nconst hiddenClass = css`\n display: none;\n`;\n\n/**\n * Toggle display style of a specific highlighted comment icon.\n *\n * @param path - The data-cslp attribute of the element whose corresponding highlighted comment icon should be toggled.\n * @param shouldShow - Boolean value to determine whether to show or hide the icon.\n * If true, the icon will be displayed. If false, the icon will be hidden.\n */\nexport function toggleHighlightedCommentIconDisplay(\n path: string,\n shouldShow: boolean\n): void {\n const icons = document.querySelectorAll<HTMLElement>(\n `.highlighted-comment[field-path=\"${path}\"]`\n );\n\n icons.forEach((icon) => {\n if (shouldShow) {\n icon.classList.remove(hiddenClass); // Show the element\n } else {\n icon.classList.add(hiddenClass); // Hide the element using goober's hidden class\n }\n });\n}\n\n/**\n * Show all .highlighted-comment icons that have the hiddenClass applied.\n */\nexport function showAllHiddenHighlightedCommentIcons(): void {\n // Query all elements that have both .highlighted-comment and hiddenClass\n const hiddenIcons = document.querySelectorAll<HTMLElement>(\n `.highlighted-comment.${hiddenClass}`\n );\n\n // Loop through each hidden icon and remove the hiddenClass\n hiddenIcons.forEach((icon) => {\n icon.classList.remove(hiddenClass); // Remove the hiddenClass to show the icon\n });\n}\n"],"mappings":";;;AAAA,SAAS,SAAgB;AACzB,SAAS,cAAc;AACvB,OAAO,4BAA4B;AACnC,SAAS,WAAW;AAGpB,SAAS,mBAAmB;AAU5B,IAAM,wBAAwB;AAEvB,SAAS,6BACZ,SACI;AACJ,QAAM,cAA0C,CAAC;AAEjD,UAAQ,QAAQ,CAAC,SAAS;AAvB9B;AAwBQ,UAAM,aAAY,kCAAM,kBAAN,mBAAqB;AAGvC,QAAI,CAAC,YAAY,SAAS,KAAK,YAAY,SAAS,GAAG;AACnD;AAAA,IACJ;AAEA,gBAAY,SAAS,IAAI;AAEzB,UAAM,UAAU,SAAS,cAAc,eAAe,SAAS,IAAI;AACnE,QAAI,WAAW,mBAAmB,aAAa;AAC3C,YAAM,EAAE,KAAK,KAAK,IAAI,QAAQ,sBAAsB;AAEpD,YAAM,gBAAgB,SAAS,cAAc,KAAK;AAClD,oBAAc,aAAa,cAAc,SAAS;AAElD,oBAAc,MAAM,WAAW;AAC/B,oBAAc,MAAM,MAAM,GAAG,MAAM,qBAAqB;AACxD,oBAAc,MAAM,OAAO,GAAG,OAAO,qBAAqB;AAC1D,oBAAc,MAAM,SAAS;AAC7B,oBAAc,MAAM,SAAS;AAC7B,oBAAc,YAAY;AAG1B;AAAA,QACI,EAAE,wBAAwB,EAAE,KAAK,CAAC;AAAA;AAAA,QAClC;AAAA,MACJ;AAEA,YAAM,yBAAyB,SAAS;AAAA,QACpC;AAAA,MACJ;AACA,UAAI,wBAAwB;AACxB,YAAI,0BACA,uBAAuB;AAAA,UACnB;AAAA,QACJ;AACJ,YAAI,CAAC,yBAAyB;AAC1B,oCAA0B,SAAS,cAAc,KAAK;AACtD,kCAAwB,YACpB;AACJ,iCAAuB,YAAY,uBAAuB;AAAA,QAC9D;AACA,gCAAwB,YAAY,aAAa;AAAA,MACrD;AAAA,IACJ;AAAA,EACJ,CAAC;AACL;AAMO,SAAS,uCAAuC;AAEnD,QAAM,QAAQ,SAAS,iBAAiB,sBAAsB;AAE9D,QAAM,QAAQ,CAAC,SAAS;AACpB,QAAI,QAAQ,gBAAgB,aAAa;AAErC,YAAM,OAAO,KAAK,aAAa,YAAY;AAC3C,UAAI,MAAM;AAEN,cAAM,gBAAgB,SAAS;AAAA,UAC3B,eAAe,IAAI;AAAA,QACvB;AACA,YAAI,iBAAiB,yBAAyB,aAAa;AAEvD,gBAAM,EAAE,KAAK,KAAK,IAAI,cAAc,sBAAsB;AAG1D,eAAK,MAAM,MAAM,GAAG,MAAM,qBAAqB;AAC/C,eAAK,MAAM,OAAO,GAAG,OAAO,qBAAqB;AAAA,QACrD;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ,CAAC;AACL;AAOO,SAAS,6BAA6B,cAA4B;AAErE,QAAM,eAAe,SAAS;AAAA,IAC1B,oCAAoC,YAAY;AAAA,EACpD;AACA,+CAAc,QAAQ,CAAC,SAAS,6BAAM;AAC1C;AAEO,SAAS,mCAAyC;AACrD,QAAM,QAAQ,SAAS,iBAAiB,sBAAsB;AAC9D,iCAAO,QAAQ,CAAC,SAAS,6BAAM;AACnC;AAGA,IAAM,cAAc;AAAA;AAAA;AAWb,SAAS,oCACZ,MACA,YACI;AACJ,QAAM,QAAQ,SAAS;AAAA,IACnB,oCAAoC,IAAI;AAAA,EAC5C;AAEA,QAAM,QAAQ,CAAC,SAAS;AACpB,QAAI,YAAY;AACZ,WAAK,UAAU,OAAO,WAAW;AAAA,IACrC,OAAO;AACH,WAAK,UAAU,IAAI,WAAW;AAAA,IAClC;AAAA,EACJ,CAAC;AACL;AAKO,SAAS,uCAA6C;AAEzD,QAAM,cAAc,SAAS;AAAA,IACzB,wBAAwB,WAAW;AAAA,EACvC;AAGA,cAAY,QAAQ,CAAC,SAAS;AAC1B,SAAK,UAAU,OAAO,WAAW;AAAA,EACrC,CAAC;AACL;","names":[]}
@@ -146,7 +146,7 @@ function sendFieldEvent(options) {
146
146
  const actualEditedElement = pseudoEditableElement || previousSelectedEditableDOM;
147
147
  let data = "innerText" in actualEditedElement ? actualEditedElement.innerText : actualEditedElement.textContent;
148
148
  const cslpData = previousSelectedEditableDOM.getAttribute("data-cslp");
149
- if (!cslpData) {
149
+ if (!(0, import_cslpdata.isValidCslp)(cslpData)) {
150
150
  return;
151
151
  }
152
152
  const fieldMetadata = (0, import_cslpdata.extractDetailsFromCslp)(cslpData);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/visualBuilder/generators/generateOverlay.tsx"],"sourcesContent":["import { extractDetailsFromCslp } from \"../../cslp/cslpdata\";\nimport { cleanIndividualFieldResidual } from \"../utils/handleIndividualFields\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport EventListenerHandlerParams from \"../listeners/types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { FieldDataType } from \"../utils/types/index.types\";\nimport { getFieldType } from \"../utils/getFieldType\";\nimport { getMultilinePlaintext } from \"../utils/getMultilinePlaintext\";\nimport { showAllHiddenHighlightedCommentIcons } from \"./generateHighlightedComment\";\n\n/**\n * Adds a focus overlay to the target element.\n * @param targetElement - The element to add the focus overlay to.\n * @param focusOverlayWrapper - The HTMLDivElement that contains the focus overlay.\n * @returns void\n */\nexport function addFocusOverlay(\n targetElement: Element,\n focusOverlayWrapper: HTMLDivElement,\n disabled?: boolean\n): void {\n const targetElementDimension = targetElement.getBoundingClientRect();\n if (\n targetElementDimension.width === 0 ||\n targetElementDimension.height === 0\n )\n return;\n focusOverlayWrapper.classList.add(\"visible\");\n\n const distanceFromTop = targetElementDimension.top + window.scrollY;\n const topOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--top\"\n );\n\n if (topOverlayDOM) {\n topOverlayDOM.style.top = \"0\";\n topOverlayDOM.style.left = \"0\";\n topOverlayDOM.style.width = \"100%\";\n topOverlayDOM.style.height = `calc(${distanceFromTop}px)`;\n }\n\n const bottomOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--bottom\"\n );\n if (bottomOverlayDOM) {\n bottomOverlayDOM.style.top = `${\n targetElementDimension.bottom + window.scrollY\n }px`;\n bottomOverlayDOM.style.height = `${\n window.document.body.scrollHeight -\n targetElementDimension.bottom -\n window.scrollY\n }px`;\n bottomOverlayDOM.style.left = \"0\";\n bottomOverlayDOM.style.width = \"100%\";\n }\n\n const leftOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--left\"\n );\n if (leftOverlayDOM) {\n leftOverlayDOM.style.left = \"0\";\n leftOverlayDOM.style.top = `${distanceFromTop}px`;\n leftOverlayDOM.style.height = `${targetElementDimension.height}px`;\n leftOverlayDOM.style.width = `${targetElementDimension.left}px`;\n }\n\n const rightOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--right\"\n );\n if (rightOverlayDOM) {\n rightOverlayDOM.style.left = `${targetElementDimension.right}px`;\n rightOverlayDOM.style.top = `${distanceFromTop}px`;\n rightOverlayDOM.style.height = `${targetElementDimension.height}px`;\n rightOverlayDOM.style.width = `${\n document.documentElement.clientWidth - targetElementDimension.right\n }px`;\n }\n\n const outlineDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--outline\"\n );\n if (outlineDOM) {\n outlineDOM.style.top = `${\n targetElementDimension.top + window.scrollY\n }px`;\n outlineDOM.style.height = `${targetElementDimension.height}px`;\n outlineDOM.style.width = `${targetElementDimension.width}px`;\n outlineDOM.style.left = `${targetElementDimension.left}px`;\n outlineDOM.style.outlineColor = disabled ? \"#909090\" : \"#715cdd\";\n }\n}\n\n/**\n * Hides the focus overlay and performs necessary cleanup actions when the user clicks outside of the focused element.\n * @param event - The mouse event that triggered the function.\n * @param elements - An object containing references to the focus overlay wrapper, the previously selected editable DOM element, and the visual builder wrapper.\n */\nexport function hideFocusOverlay(elements: HideOverlayParams): void {\n const {\n visualBuilderContainer,\n visualBuilderOverlayWrapper,\n focusedToolbar,\n resizeObserver,\n noTrigger,\n } = elements;\n\n if (visualBuilderOverlayWrapper) {\n visualBuilderOverlayWrapper.classList.remove(\"visible\");\n\n // Cleanup overlay styles: Top, Right, Bottom, Left & Outline\n visualBuilderOverlayWrapper.childNodes.forEach((childNode) => {\n if (childNode instanceof Element) {\n childNode.removeAttribute(\"style\");\n }\n });\n\n if (\n !noTrigger &&\n // send update when focussed field has received input\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput\n ) {\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.UPDATE_FIELD,\n });\n } else if (noTrigger) {\n const { previousSelectedEditableDOM, focusFieldValue } =\n VisualBuilder.VisualBuilderGlobalState.value || {};\n if (\n previousSelectedEditableDOM &&\n \"innerText\" in previousSelectedEditableDOM &&\n focusFieldValue != null\n ) {\n previousSelectedEditableDOM.innerText = focusFieldValue;\n }\n }\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = null;\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput =\n false;\n cleanIndividualFieldResidual({\n overlayWrapper: visualBuilderOverlayWrapper,\n visualBuilderContainer: visualBuilderContainer,\n focusedToolbar: focusedToolbar,\n resizeObserver: resizeObserver,\n });\n }\n}\ninterface ISendFieldEventParams {\n visualBuilderContainer: HTMLElement | null;\n eventType:\n | VisualBuilderPostMessageEvents.UPDATE_FIELD\n | VisualBuilderPostMessageEvents.SYNC_FIELD;\n}\nexport function sendFieldEvent(options: ISendFieldEventParams): void {\n const { visualBuilderContainer, eventType } = options;\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const pseudoEditableElement = visualBuilderContainer?.querySelector(\n \"div.visual-builder__pseudo-editable-element\"\n );\n if (\n previousSelectedEditableDOM &&\n (previousSelectedEditableDOM.hasAttribute(\"contenteditable\") ||\n pseudoEditableElement)\n ) {\n const actualEditedElement =\n pseudoEditableElement ||\n (previousSelectedEditableDOM as HTMLElement);\n\n let data =\n \"innerText\" in actualEditedElement\n ? actualEditedElement.innerText\n : actualEditedElement.textContent;\n\n const cslpData = previousSelectedEditableDOM.getAttribute(\"data-cslp\");\n if (!cslpData) {\n return;\n }\n\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n )\n .then((fieldSchema) => {\n if (\n fieldSchema &&\n eventType === VisualBuilderPostMessageEvents.UPDATE_FIELD\n ) {\n const fieldType = getFieldType(fieldSchema);\n if (fieldType && fieldType === FieldDataType.MULTILINE) {\n data = getMultilinePlaintext(actualEditedElement);\n (actualEditedElement as HTMLElement).innerText =\n data as string;\n }\n }\n })\n .finally(() => {\n visualBuilderPostMessage?.send(eventType, {\n data,\n fieldMetadata,\n });\n });\n }\n}\ninterface HideOverlayParams\n extends Pick<\n EventListenerHandlerParams,\n \"visualBuilderContainer\" | \"focusedToolbar\" | \"resizeObserver\"\n > {\n visualBuilderOverlayWrapper: HTMLDivElement | null;\n noTrigger?: boolean;\n}\n\nexport function hideOverlay(params: HideOverlayParams): void {\n VisualBuilder.VisualBuilderGlobalState.value.isFocussed = false;\n const focusElementObserver =\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver;\n if (focusElementObserver) {\n focusElementObserver.disconnect();\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n null;\n }\n hideFocusOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.visualBuilderOverlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n noTrigger: Boolean(params.noTrigger),\n });\n showAllHiddenHighlightedCommentIcons();\n if (\n !VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM\n )\n return;\n params.resizeObserver.unobserve(\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM\n );\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n}\n"],"mappings":"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","names":["visualBuilderPostMessage"]}
1
+ {"version":3,"sources":["../../../../src/visualBuilder/generators/generateOverlay.tsx"],"sourcesContent":["import { extractDetailsFromCslp, isValidCslp } from \"../../cslp/cslpdata\";\nimport { cleanIndividualFieldResidual } from \"../utils/handleIndividualFields\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nimport { VisualBuilder } from \"..\";\nimport EventListenerHandlerParams from \"../listeners/types\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { FieldDataType } from \"../utils/types/index.types\";\nimport { getFieldType } from \"../utils/getFieldType\";\nimport { getMultilinePlaintext } from \"../utils/getMultilinePlaintext\";\nimport { showAllHiddenHighlightedCommentIcons } from \"./generateHighlightedComment\";\n\n/**\n * Adds a focus overlay to the target element.\n * @param targetElement - The element to add the focus overlay to.\n * @param focusOverlayWrapper - The HTMLDivElement that contains the focus overlay.\n * @returns void\n */\nexport function addFocusOverlay(\n targetElement: Element,\n focusOverlayWrapper: HTMLDivElement,\n disabled?: boolean\n): void {\n const targetElementDimension = targetElement.getBoundingClientRect();\n if (\n targetElementDimension.width === 0 ||\n targetElementDimension.height === 0\n )\n return;\n focusOverlayWrapper.classList.add(\"visible\");\n\n const distanceFromTop = targetElementDimension.top + window.scrollY;\n const topOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--top\"\n );\n\n if (topOverlayDOM) {\n topOverlayDOM.style.top = \"0\";\n topOverlayDOM.style.left = \"0\";\n topOverlayDOM.style.width = \"100%\";\n topOverlayDOM.style.height = `calc(${distanceFromTop}px)`;\n }\n\n const bottomOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--bottom\"\n );\n if (bottomOverlayDOM) {\n bottomOverlayDOM.style.top = `${\n targetElementDimension.bottom + window.scrollY\n }px`;\n bottomOverlayDOM.style.height = `${\n window.document.body.scrollHeight -\n targetElementDimension.bottom -\n window.scrollY\n }px`;\n bottomOverlayDOM.style.left = \"0\";\n bottomOverlayDOM.style.width = \"100%\";\n }\n\n const leftOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--left\"\n );\n if (leftOverlayDOM) {\n leftOverlayDOM.style.left = \"0\";\n leftOverlayDOM.style.top = `${distanceFromTop}px`;\n leftOverlayDOM.style.height = `${targetElementDimension.height}px`;\n leftOverlayDOM.style.width = `${targetElementDimension.left}px`;\n }\n\n const rightOverlayDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--right\"\n );\n if (rightOverlayDOM) {\n rightOverlayDOM.style.left = `${targetElementDimension.right}px`;\n rightOverlayDOM.style.top = `${distanceFromTop}px`;\n rightOverlayDOM.style.height = `${targetElementDimension.height}px`;\n rightOverlayDOM.style.width = `${\n document.documentElement.clientWidth - targetElementDimension.right\n }px`;\n }\n\n const outlineDOM = focusOverlayWrapper.querySelector<HTMLDivElement>(\n \".visual-builder__overlay--outline\"\n );\n if (outlineDOM) {\n outlineDOM.style.top = `${\n targetElementDimension.top + window.scrollY\n }px`;\n outlineDOM.style.height = `${targetElementDimension.height}px`;\n outlineDOM.style.width = `${targetElementDimension.width}px`;\n outlineDOM.style.left = `${targetElementDimension.left}px`;\n outlineDOM.style.outlineColor = disabled ? \"#909090\" : \"#715cdd\";\n }\n}\n\n/**\n * Hides the focus overlay and performs necessary cleanup actions when the user clicks outside of the focused element.\n * @param event - The mouse event that triggered the function.\n * @param elements - An object containing references to the focus overlay wrapper, the previously selected editable DOM element, and the visual builder wrapper.\n */\nexport function hideFocusOverlay(elements: HideOverlayParams): void {\n const {\n visualBuilderContainer,\n visualBuilderOverlayWrapper,\n focusedToolbar,\n resizeObserver,\n noTrigger,\n } = elements;\n\n if (visualBuilderOverlayWrapper) {\n visualBuilderOverlayWrapper.classList.remove(\"visible\");\n\n // Cleanup overlay styles: Top, Right, Bottom, Left & Outline\n visualBuilderOverlayWrapper.childNodes.forEach((childNode) => {\n if (childNode instanceof Element) {\n childNode.removeAttribute(\"style\");\n }\n });\n\n if (\n !noTrigger &&\n // send update when focussed field has received input\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput\n ) {\n sendFieldEvent({\n visualBuilderContainer,\n eventType: VisualBuilderPostMessageEvents.UPDATE_FIELD,\n });\n } else if (noTrigger) {\n const { previousSelectedEditableDOM, focusFieldValue } =\n VisualBuilder.VisualBuilderGlobalState.value || {};\n if (\n previousSelectedEditableDOM &&\n \"innerText\" in previousSelectedEditableDOM &&\n focusFieldValue != null\n ) {\n previousSelectedEditableDOM.innerText = focusFieldValue;\n }\n }\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldValue = null;\n VisualBuilder.VisualBuilderGlobalState.value.focusFieldReceivedInput =\n false;\n cleanIndividualFieldResidual({\n overlayWrapper: visualBuilderOverlayWrapper,\n visualBuilderContainer: visualBuilderContainer,\n focusedToolbar: focusedToolbar,\n resizeObserver: resizeObserver,\n });\n }\n}\ninterface ISendFieldEventParams {\n visualBuilderContainer: HTMLElement | null;\n eventType:\n | VisualBuilderPostMessageEvents.UPDATE_FIELD\n | VisualBuilderPostMessageEvents.SYNC_FIELD;\n}\nexport function sendFieldEvent(options: ISendFieldEventParams): void {\n const { visualBuilderContainer, eventType } = options;\n const previousSelectedEditableDOM =\n VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM;\n const pseudoEditableElement = visualBuilderContainer?.querySelector(\n \"div.visual-builder__pseudo-editable-element\"\n );\n if (\n previousSelectedEditableDOM &&\n (previousSelectedEditableDOM.hasAttribute(\"contenteditable\") ||\n pseudoEditableElement)\n ) {\n const actualEditedElement =\n pseudoEditableElement ||\n (previousSelectedEditableDOM as HTMLElement);\n\n let data =\n \"innerText\" in actualEditedElement\n ? actualEditedElement.innerText\n : actualEditedElement.textContent;\n\n const cslpData = previousSelectedEditableDOM.getAttribute(\"data-cslp\");\n if (!isValidCslp(cslpData)) {\n return;\n }\n\n const fieldMetadata = extractDetailsFromCslp(cslpData);\n\n FieldSchemaMap.getFieldSchema(\n fieldMetadata.content_type_uid,\n fieldMetadata.fieldPath\n )\n .then((fieldSchema) => {\n if (\n fieldSchema &&\n eventType === VisualBuilderPostMessageEvents.UPDATE_FIELD\n ) {\n const fieldType = getFieldType(fieldSchema);\n if (fieldType && fieldType === FieldDataType.MULTILINE) {\n data = getMultilinePlaintext(actualEditedElement);\n (actualEditedElement as HTMLElement).innerText =\n data as string;\n }\n }\n })\n .finally(() => {\n visualBuilderPostMessage?.send(eventType, {\n data,\n fieldMetadata,\n });\n });\n }\n}\ninterface HideOverlayParams\n extends Pick<\n EventListenerHandlerParams,\n \"visualBuilderContainer\" | \"focusedToolbar\" | \"resizeObserver\"\n > {\n visualBuilderOverlayWrapper: HTMLDivElement | null;\n noTrigger?: boolean;\n}\n\nexport function hideOverlay(params: HideOverlayParams): void {\n VisualBuilder.VisualBuilderGlobalState.value.isFocussed = false;\n const focusElementObserver =\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver;\n if (focusElementObserver) {\n focusElementObserver.disconnect();\n VisualBuilder.VisualBuilderGlobalState.value.focusElementObserver =\n null;\n }\n hideFocusOverlay({\n visualBuilderContainer: params.visualBuilderContainer,\n visualBuilderOverlayWrapper: params.visualBuilderOverlayWrapper,\n focusedToolbar: params.focusedToolbar,\n resizeObserver: params.resizeObserver,\n noTrigger: Boolean(params.noTrigger),\n });\n showAllHiddenHighlightedCommentIcons();\n if (\n !VisualBuilder.VisualBuilderGlobalState.value\n .previousSelectedEditableDOM\n )\n return;\n params.resizeObserver.unobserve(\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM\n );\n VisualBuilder.VisualBuilderGlobalState.value.previousSelectedEditableDOM =\n null;\n}\n"],"mappings":"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","names":["visualBuilderPostMessage"]}