npm - @contentstack/live-preview-utils - Versions diffs - 3.2.0-alpha.1 → 3.2.1 - Mend

@contentstack/live-preview-utils 3.2.0-alpha.1 → 3.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (508) hide show

package/dist/modern/visualBuilder/generators/generateThread.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/generators/generateThread.tsx"],"sourcesContent":["/** @jsxImportSource preact /\nimport { render } from \"preact\";\nimport { css } from \"goober\";\nimport CollabIndicator from \"../components/Collab/CollabIndicator\";\nimport Config from \"../../configManager/configManager\";\nimport { IThreadDTO, IThreadRenderStatus } from \"../types/collab.types\";\nimport {\n MissingThreadsInfo,\n toggleCollabPopupEvent,\n} from \"../types/collab.types\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\nconst popupTopOffset = 43;\nconst popupLeftOffset = 9;\n\nconst hiddenClass = css`\n display: none;\n`;\n\nfunction createPopupContainer(\n resolvedXPath: string,\n relativeX: number,\n relativeY: number,\n top: number,\n left: number,\n updateConfig: boolean,\n payload: IThreadDTO \| any\n): HTMLDivElement {\n const popupContainer = document.createElement(\"div\");\n popupContainer.setAttribute(\"field-path\", resolvedXPath);\n popupContainer.setAttribute(\"relative\", `x: ${relativeX}, y: ${relativeY}`);\n popupContainer.style.position = \"absolute\";\n popupContainer.style.top = `${top - popupTopOffset}px`;\n popupContainer.style.left = `${left - popupLeftOffset}px`;\n popupContainer.style.zIndex = updateConfig ? \"1000\" : \"999\";\n popupContainer.style.cursor = \"pointer\";\n popupContainer.className = \"collab-thread\";\n if (payload?._id) popupContainer.setAttribute(\"threaduid\", payload._id);\n return popupContainer;\n}\n\nfunction appendPopupContainer(popupContainer: HTMLDivElement): void {\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n if (visualBuilderContainer) {\n let highlightCommentWrapper = visualBuilderContainer.querySelector(\n \".visual-builder__collab-wrapper\"\n );\n if (!highlightCommentWrapper) {\n highlightCommentWrapper = document.createElement(\"div\");\n highlightCommentWrapper.className =\n \"visual-builder__collab-wrapper\";\n visualBuilderContainer.appendChild(highlightCommentWrapper);\n }\n highlightCommentWrapper.appendChild(popupContainer);\n } else {\n document.body.appendChild(popupContainer);\n }\n}\n\nexport function generateThread(\n payload: IThreadDTO \| any,\n options: { isNewThread?: boolean; updateConfig?: boolean } = {}\n): string \| undefined {\n const { isNewThread = false, updateConfig = false } = options;\n const config = Config.get?.();\n\n let relativeX: number, relativeY: number, resolvedXPath: string;\n\n if (isNewThread) {\n ({ relativeX, relativeY, xpath: resolvedXPath } = payload);\n } else {\n const { position, elementXPath } = payload;\n ({ x: relativeX, y: relativeY } = position);\n resolvedXPath = elementXPath;\n }\n\n const element = getElementByXpath(resolvedXPath);\n if (!element) {\n return payload._id;\n }\n\n const rect = element.getBoundingClientRect();\n const top = rect.top + window.scrollY + relativeY rect.height;\n const left = rect.left + window.scrollX + relativeX * rect.width;\n\n const popupContainer = createPopupContainer(\n resolvedXPath,\n relativeX,\n relativeY,\n top,\n left,\n updateConfig,\n payload\n );\n\n if (updateConfig && config?.collab.enable) {\n if (config?.collab.isFeedbackMode) {\n Config.set(\"collab.isFeedbackMode\", false);\n }\n }\n\n render(\n <CollabIndicator\n activeThread={!isNewThread ? payload : undefined}\n newThread={isNewThread}\n />,\n popupContainer\n );\n\n appendPopupContainer(popupContainer);\n\n return undefined;\n}\n\nexport function updateCollabIconPosition() {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n const config = Config.get?.();\n if (config?.collab?.pauseFeedback) return;\n\n icons.forEach((icon) => {\n if (!(icon instanceof HTMLElement)) return;\n\n const path = icon.getAttribute(\"field-path\");\n const relative = icon.getAttribute(\"relative\");\n\n if (!path \|\| !relative) {\n console.error(\"Missing field-path or relative attribute.\");\n return;\n }\n\n const match = relative.match(/x: ([\\d.]+), y: ([\\d.]+)/);\n if (!match) {\n console.error(\"Invalid relative attribute format.\");\n return;\n }\n\n const relativeX = parseFloat(match[1]);\n const relativeY = parseFloat(match[2]);\n\n const targetElement = getElementByXpath(path);\n\n if (!targetElement) {\n icon.classList.add(hiddenClass);\n return;\n }\n\n const rect = targetElement.getBoundingClientRect();\n const x = rect.left + rect.width * relativeX + window.scrollX;\n const y = rect.top + rect.height * relativeY + window.scrollY;\n\n icon.style.top = `${y - popupTopOffset}px`;\n icon.style.left = `${x - popupLeftOffset}px`;\n icon.classList.remove(hiddenClass);\n });\n}\nexport function updatePopupPositions() {\n const popups = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread .collab-popup\"\n );\n\n const config = Config.get?.();\n if (config?.collab?.pauseFeedback) return;\n\n popups.forEach((popup) => {\n if (popup && popup instanceof HTMLElement) {\n const parent = popup.closest(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n\n if (!parent) {\n console.error(\n \"Parent element with class 'collab-thread' not found.\"\n );\n return;\n }\n\n const button = parent.querySelector(\n \".visual-builder__collab-wrapper .collab-thread .collab-indicator\"\n );\n\n if (!button \|\| !(button instanceof HTMLElement)) {\n console.error(\n \"Button with class 'collab-indicator' not found.\"\n );\n return;\n }\n\n calculatePopupPosition(button, popup);\n }\n });\n}\n\nexport function calculatePopupPosition(\n button: HTMLElement,\n popup: HTMLElement\n) {\n const buttonRect = button.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const viewportWidth = window.innerWidth;\n\n let popupHeight = popup.offsetHeight \|\| 198;\n let popupWidth = popup.offsetWidth \|\| 334;\n\n const spaceAbove = buttonRect.top;\n const spaceBelow = viewportHeight - buttonRect.bottom;\n\n let top, left;\n\n if (spaceAbove >= popupHeight) {\n top = buttonRect.top - popupHeight - 8;\n } else if (spaceBelow >= popupHeight) {\n top = buttonRect.bottom + 8;\n } else {\n top =\n spaceBelow > spaceAbove\n ? buttonRect.bottom + 8\n : Math.max(buttonRect.top - popupHeight - 8, 0);\n }\n\n left = buttonRect.left + buttonRect.width / 2 - popupWidth / 2;\n\n top = Math.max(top, 0);\n left = Math.max(left, 0);\n left = Math.min(left, viewportWidth - popupWidth);\n\n popup.style.top = `${top}px`;\n popup.style.left = `${left}px`;\n\n requestAnimationFrame(() => {\n const newPopupHeight = popup.offsetHeight;\n if (newPopupHeight !== popupHeight) {\n calculatePopupPosition(button, popup);\n }\n });\n}\n\nexport function removeAllCollabIcons(): void {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n icons?.forEach((icon) => icon?.remove());\n}\n\nexport function hideAllCollabIcons(): void {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n icons?.forEach((icon) => icon?.classList.add(hiddenClass));\n}\n\nexport function showAllCollabIcons(): void {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n icons?.forEach((icon) => icon?.classList.remove(hiddenClass));\n}\n\nexport function removeCollabIcon(threadUid: string): void {\n const thread = document.querySelector(`div[threaduid='${threadUid}']`);\n thread?.remove();\n}\n\nexport function toggleCollabPopup({\n threadUid = \"\",\n action,\n}: toggleCollabPopupEvent): void {\n document.dispatchEvent(\n new CustomEvent(\"toggleCollabPopup\", {\n detail: { threadUid, action },\n })\n );\n}\n\nexport function HighlightThread(threadUid: string): void {\n const config = Config.get?.();\n if (config?.collab?.pauseFeedback) return;\n\n toggleCollabPopup({ threadUid, action: \"open\" });\n}\n\nexport function isCollabThread(target: HTMLElement): boolean {\n return Array.from(target.classList).some((className) =>\n className.startsWith(\"collab\")\n );\n}\n\nexport function handleMissingThreads(payload: MissingThreadsInfo) {\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_MISSING_THREADS,\n { payload }\n );\n}\n\nexport function handleEmptyThreads() {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n icons?.forEach((icon) => {\n if (!icon.hasAttribute(\"threaduid\")) {\n icon.remove();\n }\n });\n}\n\nconst retryConfig = {\n maxRetries: 3,\n retryDelay: 1000,\n};\n\nlet isProcessingThreads = false;\n\nexport const threadRenderStatus = new Map<string, IThreadRenderStatus>();\n\nfunction delay(ms: number): Promise<void> {\n return new Promise((resolve) => setTimeout(resolve, ms));\n}\n\nfunction getRenderStatus(threadId: string): IThreadRenderStatus {\n if (!threadRenderStatus.has(threadId)) {\n threadRenderStatus.set(threadId, {\n threadId,\n attempts: 0,\n isRendered: false,\n });\n }\n return threadRenderStatus.get(threadId)!;\n}\n\nfunction updateRenderStatus(threadId: string, isRendered: boolean): void {\n const status = getRenderStatus(threadId);\n status.isRendered = isRendered;\n threadRenderStatus.set(threadId, status);\n}\n\nexport function clearThreadStatus(threadId: string): void {\n threadRenderStatus.delete(threadId);\n}\n\nexport function clearAllThreadStatus(): void {\n threadRenderStatus.clear();\n isProcessingThreads = false;\n}\n\nasync function processThread(thread: IThreadDTO): Promise<string \| undefined> {\n let status = getRenderStatus(thread._id);\n\n while (status.attempts < retryConfig.maxRetries) {\n try {\n const result = generateThread(thread, { isNewThread: false });\n if (result === undefined) {\n updateRenderStatus(thread._id, true);\n return undefined;\n }\n\n status.attempts++;\n updateRenderStatus(thread._id, false);\n\n if (status.attempts < retryConfig.maxRetries) {\n await delay(retryConfig.retryDelay);\n }\n } catch (error) {\n console.error(`Error rendering thread ${thread._id}:`, error);\n status.attempts++;\n if (status.attempts >= retryConfig.maxRetries) {\n break;\n }\n await delay(retryConfig.retryDelay);\n }\n }\n\n return thread._id;\n}\n\nexport async function processThreadsBatch(\n threads: IThreadDTO[]\n): Promise<string[]> {\n if (isProcessingThreads) return [];\n\n try {\n isProcessingThreads = true;\n const unrenderedThreads = filterUnrenderedThreads(threads);\n if (unrenderedThreads.length === 0) return [];\n\n const missingThreadIds = (\n await Promise.all(\n unrenderedThreads.map((thread) => processThread(thread))\n )\n ).filter(Boolean) as string[];\n\n missingThreadIds.forEach(clearThreadStatus);\n return missingThreadIds;\n } finally {\n isProcessingThreads = false;\n }\n}\n\nexport function filterUnrenderedThreads(threads: IThreadDTO[]): IThreadDTO[] {\n return threads.filter((thread) => {\n const existingThread = document.querySelector(\n `[threaduid=\"${thread._id}\"]`\n );\n if (existingThread) {\n updateRenderStatus(thread._id, true);\n return false;\n }\n return true;\n });\n}\n\nfunction getElementByXpath(xpath: string): HTMLElement \| null {\n const result = document.evaluate(\n xpath,\n document,\n null,\n XPathResult.FIRST_ORDERED_NODE_TYPE,\n null\n );\n return result.singleNodeValue as HTMLElement \| null;\n}\n"],"mappings":"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","names":[]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/generators/generateThread.tsx"],"sourcesContent":["/** @jsxImportSource preact /\nimport { render } from \"preact\";\nimport { css } from \"goober\";\nimport CollabIndicator from \"../components/Collab/CollabIndicator\";\nimport Config from \"../../configManager/configManager\";\nimport { IThreadDTO, IThreadRenderStatus } from \"../types/collab.types\";\nimport {\n MissingThreadsInfo,\n toggleCollabPopupEvent,\n} from \"../types/collab.types\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport { adjustPositionToViewport } from \"../utils/collabUtils\";\n\nconst popupTopOffset = 43;\nconst popupLeftOffset = 9;\n\nconst hiddenClass = css`\n display: none;\n`;\n\nfunction createPopupContainer(\n resolvedXPath: string,\n relativeX: number,\n relativeY: number,\n top: number,\n left: number,\n updateConfig: boolean,\n hidden: boolean,\n payload: IThreadDTO \| any\n): HTMLDivElement {\n const popupContainer = document.createElement(\"div\");\n popupContainer.setAttribute(\"field-path\", resolvedXPath);\n popupContainer.setAttribute(\"relative\", `x: ${relativeX}, y: ${relativeY}`);\n popupContainer.style.position = \"absolute\";\n popupContainer.style.top = `${top - popupTopOffset}px`;\n popupContainer.style.left = `${left - popupLeftOffset}px`;\n popupContainer.style.zIndex = updateConfig ? \"1000\" : \"999\";\n popupContainer.style.cursor = \"pointer\";\n popupContainer.className = \"collab-thread\";\n if (hidden) popupContainer.classList.add(hiddenClass);\n if (payload?._id) popupContainer.setAttribute(\"threaduid\", payload._id);\n return popupContainer;\n}\n\nfunction appendPopupContainer(popupContainer: HTMLDivElement): void {\n const visualBuilderContainer = document.querySelector(\n \".visual-builder__container\"\n );\n if (visualBuilderContainer) {\n let highlightCommentWrapper = visualBuilderContainer.querySelector(\n \".visual-builder__collab-wrapper\"\n );\n if (!highlightCommentWrapper) {\n highlightCommentWrapper = document.createElement(\"div\");\n highlightCommentWrapper.className =\n \"visual-builder__collab-wrapper\";\n visualBuilderContainer.appendChild(highlightCommentWrapper);\n }\n highlightCommentWrapper.appendChild(popupContainer);\n } else {\n document.body.appendChild(popupContainer);\n }\n}\n\nexport function generateThread(\n payload: IThreadDTO \| any,\n options: {\n isNewThread?: boolean;\n updateConfig?: boolean;\n hidden?: boolean;\n } = {}\n): string \| undefined {\n const {\n isNewThread = false,\n updateConfig = false,\n hidden = false,\n } = options;\n const config = Config.get?.();\n\n let relativeX: number, relativeY: number, resolvedXPath: string;\n\n if (isNewThread) {\n ({ relativeX, relativeY, xpath: resolvedXPath } = payload);\n } else {\n const { position, elementXPath } = payload;\n ({ x: relativeX, y: relativeY } = position);\n resolvedXPath = elementXPath;\n }\n\n // Filter to remove already rendered threads\n if (payload?._id) {\n const existingThread = document.querySelector(\n `div[threaduid='${payload._id}']`\n );\n if (existingThread) {\n return undefined;\n }\n }\n\n const element = getElementByXpath(resolvedXPath);\n if (!element) {\n return payload._id;\n }\n\n const rect = element.getBoundingClientRect();\n let top = rect.top + window.scrollY + relativeY rect.height;\n let left = rect.left + window.scrollX + relativeX * rect.width;\n\n const adjustedPosition = adjustPositionToViewport({ top, left });\n top = adjustedPosition.top;\n left = adjustedPosition.left;\n\n const popupContainer = createPopupContainer(\n resolvedXPath,\n relativeX,\n relativeY,\n top,\n left,\n updateConfig,\n hidden,\n payload\n );\n\n if (updateConfig && config?.collab?.enable) {\n if (config?.collab.isFeedbackMode) {\n Config.set(\"collab.isFeedbackMode\", false);\n }\n }\n\n render(\n <CollabIndicator\n activeThread={!isNewThread ? payload : undefined}\n newThread={isNewThread}\n />,\n popupContainer\n );\n\n appendPopupContainer(popupContainer);\n\n return undefined;\n}\n\nexport function updateCollabIconPosition() {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n const config = Config.get?.();\n if (config?.collab?.pauseFeedback) return;\n\n icons.forEach((icon) => {\n if (!(icon instanceof HTMLElement)) return;\n\n const path = icon.getAttribute(\"field-path\");\n const relative = icon.getAttribute(\"relative\");\n\n if (!path \|\| !relative) {\n console.error(\"Missing field-path or relative attribute.\");\n return;\n }\n\n const match = relative.match(/x: ([\\d.]+), y: ([\\d.]+)/);\n if (!match) {\n console.error(\"Invalid relative attribute format.\");\n return;\n }\n\n const relativeX = parseFloat(match[1]);\n const relativeY = parseFloat(match[2]);\n\n const targetElement = getElementByXpath(path);\n\n if (!targetElement) {\n icon.classList.add(hiddenClass);\n return;\n }\n\n const rect = targetElement.getBoundingClientRect();\n let left = rect.left + rect.width * relativeX + window.scrollX;\n let top = rect.top + rect.height * relativeY + window.scrollY;\n\n const adjustedPosition = adjustPositionToViewport({ top, left });\n top = adjustedPosition.top;\n left = adjustedPosition.left;\n\n icon.style.top = `${top - popupTopOffset}px`;\n icon.style.left = `${left - popupLeftOffset}px`;\n icon.classList.remove(hiddenClass);\n });\n}\nexport function updatePopupPositions() {\n const popups = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread .collab-popup\"\n );\n\n const config = Config.get?.();\n if (config?.collab?.pauseFeedback) return;\n\n popups.forEach((popup) => {\n if (popup && popup instanceof HTMLElement) {\n const parent = popup.closest(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n\n if (!parent) {\n console.error(\n \"Parent element with class 'collab-thread' not found.\"\n );\n return;\n }\n\n const button = parent.querySelector(\n \".visual-builder__collab-wrapper .collab-thread .collab-indicator\"\n );\n\n if (!button \|\| !(button instanceof HTMLElement)) {\n console.error(\n \"Button with class 'collab-indicator' not found.\"\n );\n return;\n }\n\n calculatePopupPosition(button, popup);\n }\n });\n}\n\nexport function updateSuggestionListPosition() {\n const suggestionLists = document.querySelectorAll(\n \".collab-thread-body--input--textarea--suggestionsList\"\n );\n\n if (!suggestionLists.length) return;\n\n suggestionLists.forEach((list) => {\n if (!(list instanceof HTMLElement)) return;\n\n const textarea = document.querySelector(\n \".collab-thread-body--input--textarea\"\n ) as HTMLTextAreaElement \| null;\n\n if (!textarea) return;\n const positionData = list.getAttribute(\"data-position\");\n const parsedData = positionData ? JSON.parse(positionData) : null;\n const showAbove = window.getComputedStyle(list).bottom !== \"auto\";\n const textareaRect = textarea.getBoundingClientRect();\n if (showAbove) {\n const lineHeight =\n parseInt(window.getComputedStyle(textarea).lineHeight) \|\| 20;\n const paddingTop =\n parseInt(window.getComputedStyle(textarea).paddingTop) \|\| 8;\n const cursorLineY =\n parsedData?.cursorLineY \|\| paddingTop + lineHeight;\n\n list.style.position = \"fixed\";\n list.style.bottom = `${window.innerHeight - textareaRect.top - cursorLineY + lineHeight}px`;\n list.style.top = \"auto\";\n } else {\n const lineHeight =\n parseInt(window.getComputedStyle(textarea).lineHeight) \|\| 20;\n const paddingTop =\n parseInt(window.getComputedStyle(textarea).paddingTop) \|\| 8;\n\n const cursorLineY =\n parsedData?.cursorLineY \|\| paddingTop + lineHeight;\n\n list.style.position = \"fixed\";\n list.style.top = `${textareaRect.top + cursorLineY}px`;\n list.style.bottom = \"auto\";\n }\n\n if (!positionData && textareaRect) {\n const lineHeight =\n parseInt(window.getComputedStyle(textarea).lineHeight) \|\| 20;\n const paddingTop =\n parseInt(window.getComputedStyle(textarea).paddingTop) \|\| 8;\n\n const positionInfo = {\n showAbove: showAbove,\n cursorLineY: paddingTop + lineHeight,\n };\n list.setAttribute(\"data-position\", JSON.stringify(positionInfo));\n }\n\n const listRect = list.getBoundingClientRect();\n\n if (!showAbove && listRect.bottom > window.innerHeight) {\n const lineHeight =\n parseInt(window.getComputedStyle(textarea).lineHeight) \|\| 20;\n const paddingTop =\n parseInt(window.getComputedStyle(textarea).paddingTop) \|\| 8;\n const cursorLineY =\n parsedData?.cursorLineY \|\| paddingTop + lineHeight;\n\n list.style.bottom = `${window.innerHeight - textareaRect.top - cursorLineY + lineHeight}px`;\n list.style.top = \"auto\";\n\n if (positionData) {\n const updatedData = JSON.parse(positionData);\n updatedData.showAbove = true;\n list.setAttribute(\"data-position\", JSON.stringify(updatedData));\n }\n } else if (showAbove && listRect.top < 0) {\n const lineHeight =\n parseInt(window.getComputedStyle(textarea).lineHeight) \|\| 20;\n const paddingTop =\n parseInt(window.getComputedStyle(textarea).paddingTop) \|\| 8;\n const cursorLineY =\n parsedData?.cursorLineY \|\| paddingTop + lineHeight;\n\n list.style.top = `${textareaRect.top + cursorLineY}px`;\n list.style.bottom = \"auto\";\n\n if (positionData) {\n const updatedData = JSON.parse(positionData);\n updatedData.showAbove = false;\n list.setAttribute(\"data-position\", JSON.stringify(updatedData));\n }\n }\n });\n}\n\nexport function calculatePopupPosition(\n button: HTMLElement,\n popup: HTMLElement\n) {\n const buttonRect = button.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const viewportWidth = window.innerWidth;\n\n let popupHeight = popup.offsetHeight \|\| 198;\n let popupWidth = popup.offsetWidth \|\| 334;\n\n const spaceAbove = buttonRect.top;\n const spaceBelow = viewportHeight - buttonRect.bottom;\n\n let top, left;\n\n if (spaceAbove >= popupHeight) {\n top = buttonRect.top - popupHeight - 8;\n } else if (spaceBelow >= popupHeight) {\n top = buttonRect.bottom + 8;\n } else {\n top =\n spaceBelow > spaceAbove\n ? buttonRect.bottom + 8\n : Math.max(buttonRect.top - popupHeight - 8, 0);\n }\n\n left = buttonRect.left + buttonRect.width / 2 - popupWidth / 2;\n\n top = Math.max(top, 0);\n left = Math.max(left, 0);\n left = Math.min(left, viewportWidth - popupWidth);\n\n popup.style.top = `${top}px`;\n popup.style.left = `${left}px`;\n\n requestAnimationFrame(() => {\n const newPopupHeight = popup.offsetHeight;\n if (newPopupHeight !== popupHeight) {\n calculatePopupPosition(button, popup);\n }\n });\n}\n\nexport function removeAllCollabIcons(): void {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n icons?.forEach((icon) => icon?.remove());\n}\n\nexport function hideAllCollabIcons(): void {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n icons?.forEach((icon) => icon?.classList.add(hiddenClass));\n}\n\nexport function showAllCollabIcons(): void {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n icons?.forEach((icon) => icon?.classList.remove(hiddenClass));\n}\n\nexport function removeCollabIcon(threadUid: string): void {\n const thread = document.querySelector(`div[threaduid='${threadUid}']`);\n thread?.remove();\n}\n\nexport function toggleCollabPopup({\n threadUid = \"\",\n action,\n}: toggleCollabPopupEvent): void {\n document.dispatchEvent(\n new CustomEvent(\"toggleCollabPopup\", {\n detail: { threadUid, action },\n })\n );\n}\n\nexport function HighlightThread(threadUid: string): void {\n toggleCollabPopup({ threadUid, action: \"open\" });\n}\n\nexport function isCollabThread(target: HTMLElement): boolean {\n return Array.from(target.classList).some((className) =>\n className.startsWith(\"collab\")\n );\n}\n\nexport function handleMissingThreads(payload: MissingThreadsInfo) {\n visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_MISSING_THREADS,\n payload\n );\n}\n\nexport function handleEmptyThreads() {\n const icons = document.querySelectorAll(\n \".visual-builder__collab-wrapper .collab-thread\"\n );\n icons?.forEach((icon) => {\n if (!icon.hasAttribute(\"threaduid\")) {\n icon.remove();\n }\n });\n}\n\nconst retryConfig = {\n maxRetries: 5,\n retryDelay: 1000,\n};\n\nlet isProcessingThreads = false;\n\nexport const threadRenderStatus = new Map<string, IThreadRenderStatus>();\n\nfunction delay(ms: number): Promise<void> {\n return new Promise((resolve) => setTimeout(resolve, ms));\n}\n\nfunction getRenderStatus(threadId: string): IThreadRenderStatus {\n if (!threadRenderStatus.has(threadId)) {\n threadRenderStatus.set(threadId, {\n threadId,\n attempts: 0,\n isRendered: false,\n });\n }\n return threadRenderStatus.get(threadId)!;\n}\n\nfunction updateRenderStatus(threadId: string, isRendered: boolean): void {\n const status = getRenderStatus(threadId);\n status.isRendered = isRendered;\n threadRenderStatus.set(threadId, status);\n}\n\nexport function clearThreadStatus(threadId: string): void {\n threadRenderStatus.delete(threadId);\n}\n\nexport function clearAllThreadStatus(): void {\n threadRenderStatus.clear();\n isProcessingThreads = false;\n}\n\nasync function processThread(thread: IThreadDTO): Promise<string \| undefined> {\n let status = getRenderStatus(thread._id);\n\n while (status.attempts < retryConfig.maxRetries) {\n try {\n const result = generateThread(thread);\n if (result === undefined) {\n updateRenderStatus(thread._id, true);\n return undefined;\n }\n\n status.attempts++;\n updateRenderStatus(thread._id, false);\n\n if (status.attempts < retryConfig.maxRetries) {\n await delay(retryConfig.retryDelay);\n }\n } catch (error) {\n console.error(`Error rendering thread ${thread._id}:`, error);\n status.attempts++;\n if (status.attempts >= retryConfig.maxRetries) {\n break;\n }\n await delay(retryConfig.retryDelay);\n }\n }\n\n return thread._id;\n}\n\nexport async function processThreadsBatch(\n threads: IThreadDTO[]\n): Promise<string[]> {\n if (isProcessingThreads) return [];\n\n try {\n isProcessingThreads = true;\n const unrenderedThreads = filterUnrenderedThreads(threads);\n if (unrenderedThreads.length === 0) return [];\n\n const missingThreadIds = (\n await Promise.all(\n unrenderedThreads.map((thread) => processThread(thread))\n )\n ).filter(Boolean) as string[];\n\n missingThreadIds.forEach(clearThreadStatus);\n return missingThreadIds;\n } finally {\n isProcessingThreads = false;\n }\n}\n\nexport function filterUnrenderedThreads(threads: IThreadDTO[]): IThreadDTO[] {\n return threads.filter((thread) => {\n const existingThread = document.querySelector(\n `[threaduid=\"${thread._id}\"]`\n );\n if (existingThread) {\n updateRenderStatus(thread._id, true);\n return false;\n }\n return true;\n });\n}\n\nfunction getElementByXpath(xpath: string): HTMLElement \| null {\n const result = document.evaluate(\n xpath,\n document,\n null,\n XPathResult.FIRST_ORDERED_NODE_TYPE,\n null\n );\n return result.singleNodeValue as HTMLElement \| null;\n}\n"],"mappings":"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","names":[]}

package/dist/modern/visualBuilder/generators/generateToolbar.cjs CHANGED Viewed

@@ -40,11 +40,16 @@ var import_FieldToolbar = __toESM(require("../components/FieldToolbar.cjs"), 1);
 var import_preact = require("preact");
 var import_fieldLabelWrapper = __toESM(require("../components/fieldLabelWrapper.cjs"), 1);
 var import_jsx_runtime = require("preact/jsx-runtime");
-function appendFocusedToolbar(eventDetails, focusedToolbarElement, hideOverlay) {
+function appendFocusedToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
   appendFieldPathDropdown(eventDetails, focusedToolbarElement);
-  appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay);
+  appendFieldToolbar(
+    eventDetails,
+    focusedToolbarElement,
+    hideOverlay,
+    isVariant
+  );
 }
-function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay) {
+function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
   if (focusedToolbarElement.querySelector(
     ".visual-builder__focused-toolbar__multiple-field-toolbar"
   ))
@@ -55,7 +60,8 @@ function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay) {
       import_FieldToolbar.default,
       {
         eventDetails,
-        hideOverlay
+        hideOverlay,
+        isVariant
       }
     ),
     wrapper
@@ -63,7 +69,9 @@ function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay) {
   focusedToolbarElement.append(wrapper);
 }
 function appendFieldPathDropdown(eventDetails, focusedToolbarElement) {
-  if (document.querySelector(".visual-builder__focused-toolbar__field-label-wrapper"))
+  if (document.querySelector(
+    ".visual-builder__focused-toolbar__field-label-wrapper"
+  ))
     return;
   const { editableElement: targetElement, fieldMetadata } = eventDetails;
   const targetElementDimension = targetElement.getBoundingClientRect();

package/dist/modern/visualBuilder/generators/generateToolbar.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/generators/generateToolbar.tsx"],"sourcesContent":["import { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport {\n DATA_CSLP_ATTR_SELECTOR,\n LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX,\n RIGHT_EDGE_BUFFER,\n TOOLBAR_EDGE_BUFFER,\n TOP_EDGE_BUFFER,\n} from \"../utils/constants\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\n\nimport FieldToolbarComponent from \"../components/FieldToolbar\";\nimport { render } from \"preact\";\nimport FieldLabelWrapperComponent from \"../components/fieldLabelWrapper\";\n\nexport function appendFocusedToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay);\n}\n\nexport function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void\n): void {\n if (\n focusedToolbarElement.querySelector(\n \".visual-builder__focused-toolbar__multiple-field-toolbar\"\n )\n )\n return;\n const wrapper = document.createDocumentFragment();\n render(\n <FieldToolbarComponent\n eventDetails={eventDetails}\n hideOverlay={hideOverlay}\n />,\n wrapper\n );\n\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if(document.querySelector(\".visual-builder__focused-toolbar__field-label-wrapper\"))\n return;\n const { editableElement: targetElement, fieldMetadata } = eventDetails;\n const targetElementDimension = targetElement.getBoundingClientRect();\n\n const distanceFromTop =\n targetElementDimension.top + window.scrollY - TOOLBAR_EDGE_BUFFER;\n // Position the toolbar at the top unless there's insufficient space or scrolling up is not possible (topmost element targetted).\n const adjustedDistanceFromTop =\n targetElementDimension.top + window.scrollY < TOP_EDGE_BUFFER\n ? distanceFromTop + targetElementDimension.height + TOP_EDGE_BUFFER\n : distanceFromTop;\n\n const distanceFromLeft =\n targetElementDimension.left - LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX;\n const adjustedDistanceFromLeft = Math.max(\n distanceFromLeft,\n TOOLBAR_EDGE_BUFFER\n );\n\n const targetElementRightEdgeOffset =\n window.scrollX + window.innerWidth - targetElementDimension.left;\n\n if (targetElementRightEdgeOffset < RIGHT_EDGE_BUFFER) {\n // Overflow / Cutoff on right edge\n focusedToolbarElement.style.justifyContent = \"flex-end\";\n focusedToolbarElement.style.left = `${\n targetElementDimension.right + LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX\n }px`;\n } else {\n focusedToolbarElement.style.justifyContent = \"flex-start\"; // default\n focusedToolbarElement.style.left = `${adjustedDistanceFromLeft}px`;\n }\n\n focusedToolbarElement.style.top = `${adjustedDistanceFromTop}px`;\n\n const parentPaths = collectParentCSLPPaths(targetElement, 2);\n\n const wrapper = document.createDocumentFragment();\n render(\n <FieldLabelWrapperComponent\n fieldMetadata={fieldMetadata}\n eventDetails={eventDetails}\n parentPaths={parentPaths}\n getParentEditableElement={(cslp: string) => {\n const parentElement = targetElement.closest(\n `[${DATA_CSLP_ATTR_SELECTOR}=\"${cslp}\"]`\n ) as HTMLElement \| null;\n return parentElement;\n }}\n />,\n wrapper\n );\n\n focusedToolbarElement.appendChild(wrapper);\n}\n\nfunction collectParentCSLPPaths(\n targetElement: Element,\n count: number\n): Array<string> {\n const cslpPaths: Array<string> = [];\n let currentElement = targetElement.parentElement;\n\n while (count > 0 \|\| currentElement === window.document.body) {\n if (!currentElement) {\n return cslpPaths;\n }\n\n if (currentElement.hasAttribute(DATA_CSLP_ATTR_SELECTOR)) {\n cslpPaths.push(\n currentElement.getAttribute(DATA_CSLP_ATTR_SELECTOR) as string\n );\n count--;\n }\n currentElement = currentElement.parentElement;\n }\n\n return cslpPaths;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,uBAMO;AAIP,0BAAkC;AAClC,oBAAuB;AACvB,+BAAuC;~~AAwB~~/B;~~AAtBD~~,SAAS,qBACZ,cACA,uBACA,~~aACI~~;AACJ,0BAAwB,cAAc,qBAAqB;AAC3D,~~qBAAmB~~,~~cAAc~~,~~uBAAuB~~,~~WAAW~~;~~AACvE~~;AAEO,SAAS,mBACZ,cACA,uBACA,~~aACI~~;AACJ,MACI,sBAAsB;AAAA,IAClB;AAAA,EACJ;AAEA;AACJ,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC,oBAAAA;AAAA,MAAA;AAAA,QACG;AAAA,QACA;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;~~AAEA~~,wBAAsB,OAAO,OAAO;AACxC;AAEO,SAAS,wBACZ,cACA,uBACI;AACJ,~~MAAG~~,SAAS,~~cAAc~~,~~uDAAuD~~;~~AAC7E~~;AACJ,QAAM,EAAE,iBAAiB,eAAe,cAAc,IAAI;AAC1D,QAAM,yBAAyB,cAAc,sBAAsB;AAEnE,QAAM,kBACF,uBAAuB,MAAM,OAAO,UAAU;AAElD,QAAM,0BACF,uBAAuB,MAAM,OAAO,UAAU,mCACxC,kBAAkB,uBAAuB,SAAS,mCAClD;AAEV,QAAM,mBACF,uBAAuB,OAAO;AAClC,QAAM,2BAA2B,KAAK;AAAA,IAClC;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,+BACF,OAAO,UAAU,OAAO,aAAa,uBAAuB;AAEhE,MAAI,+BAA+B,oCAAmB;AAElD,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAC/B,uBAAuB,QAAQ,iDACnC;AAAA,EACJ,OAAO;AACH,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAAG,wBAAwB;AAAA,EAClE;AAEA,wBAAsB,MAAM,MAAM,GAAG,uBAAuB;AAE5D,QAAM,cAAc,uBAAuB,eAAe,CAAC;AAE3D,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC,yBAAAC;AAAA,MAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA,QACA,0BAA0B,CAAC,SAAiB;AACxC,gBAAM,gBAAgB,cAAc;AAAA,YAChC,IAAI,wCAAuB,KAAK,IAAI;AAAA,UACxC;AACA,iBAAO;AAAA,QACX;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AAEA,wBAAsB,YAAY,OAAO;AAC7C;AAEA,SAAS,uBACL,eACA,OACa;AACb,QAAM,YAA2B,CAAC;AAClC,MAAI,iBAAiB,cAAc;AAEnC,SAAO,QAAQ,KAAK,mBAAmB,OAAO,SAAS,MAAM;AACzD,QAAI,CAAC,gBAAgB;AACjB,aAAO;AAAA,IACX;AAEA,QAAI,eAAe,aAAa,wCAAuB,GAAG;AACtD,gBAAU;AAAA,QACN,eAAe,aAAa,wCAAuB;AAAA,MACvD;AACA;AAAA,IACJ;AACA,qBAAiB,eAAe;AAAA,EACpC;AAEA,SAAO;AACX;","names":["FieldToolbarComponent","FieldLabelWrapperComponent"]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/generators/generateToolbar.tsx"],"sourcesContent":["import { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport {\n DATA_CSLP_ATTR_SELECTOR,\n LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX,\n RIGHT_EDGE_BUFFER,\n TOOLBAR_EDGE_BUFFER,\n TOP_EDGE_BUFFER,\n} from \"../utils/constants\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\n\nimport FieldToolbarComponent from \"../components/FieldToolbar\";\nimport { render } from \"preact\";\nimport FieldLabelWrapperComponent from \"../components/fieldLabelWrapper\";\n\nexport function appendFocusedToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(\n eventDetails,\n focusedToolbarElement,\n hideOverlay,\n isVariant\n );\n}\n\nexport function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\n): void {\n if (\n focusedToolbarElement.querySelector(\n \".visual-builder__focused-toolbar__multiple-field-toolbar\"\n )\n )\n return;\n const wrapper = document.createDocumentFragment();\n render(\n <FieldToolbarComponent\n eventDetails={eventDetails}\n hideOverlay={hideOverlay}\n isVariant={isVariant}\n />,\n wrapper\n );\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if (\n document.querySelector(\n \".visual-builder__focused-toolbar__field-label-wrapper\"\n )\n )\n return;\n const { editableElement: targetElement, fieldMetadata } = eventDetails;\n const targetElementDimension = targetElement.getBoundingClientRect();\n\n const distanceFromTop =\n targetElementDimension.top + window.scrollY - TOOLBAR_EDGE_BUFFER;\n // Position the toolbar at the top unless there's insufficient space or scrolling up is not possible (topmost element targetted).\n const adjustedDistanceFromTop =\n targetElementDimension.top + window.scrollY < TOP_EDGE_BUFFER\n ? distanceFromTop + targetElementDimension.height + TOP_EDGE_BUFFER\n : distanceFromTop;\n\n const distanceFromLeft =\n targetElementDimension.left - LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX;\n const adjustedDistanceFromLeft = Math.max(\n distanceFromLeft,\n TOOLBAR_EDGE_BUFFER\n );\n\n const targetElementRightEdgeOffset =\n window.scrollX + window.innerWidth - targetElementDimension.left;\n\n if (targetElementRightEdgeOffset < RIGHT_EDGE_BUFFER) {\n // Overflow / Cutoff on right edge\n focusedToolbarElement.style.justifyContent = \"flex-end\";\n focusedToolbarElement.style.left = `${\n targetElementDimension.right + LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX\n }px`;\n } else {\n focusedToolbarElement.style.justifyContent = \"flex-start\"; // default\n focusedToolbarElement.style.left = `${adjustedDistanceFromLeft}px`;\n }\n\n focusedToolbarElement.style.top = `${adjustedDistanceFromTop}px`;\n\n const parentPaths = collectParentCSLPPaths(targetElement, 2);\n\n const wrapper = document.createDocumentFragment();\n render(\n <FieldLabelWrapperComponent\n fieldMetadata={fieldMetadata}\n eventDetails={eventDetails}\n parentPaths={parentPaths}\n getParentEditableElement={(cslp: string) => {\n const parentElement = targetElement.closest(\n `[${DATA_CSLP_ATTR_SELECTOR}=\"${cslp}\"]`\n ) as HTMLElement \| null;\n return parentElement;\n }}\n />,\n wrapper\n );\n\n focusedToolbarElement.appendChild(wrapper);\n}\n\nfunction collectParentCSLPPaths(\n targetElement: Element,\n count: number\n): Array<string> {\n const cslpPaths: Array<string> = [];\n let currentElement = targetElement.parentElement;\n\n while (count > 0 \|\| currentElement === window.document.body) {\n if (!currentElement) {\n return cslpPaths;\n }\n\n if (currentElement.hasAttribute(DATA_CSLP_ATTR_SELECTOR)) {\n cslpPaths.push(\n currentElement.getAttribute(DATA_CSLP_ATTR_SELECTOR) as string\n );\n count--;\n }\n currentElement = currentElement.parentElement;\n }\n\n return cslpPaths;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,uBAMO;AAIP,0BAAkC;AAClC,oBAAuB;AACvB,+BAAuC;AA+B/B;AA7BD,SAAS,qBACZ,cACA,uBACA,aACA,YAAqB,OACjB;AACJ,0BAAwB,cAAc,qBAAqB;AAC3D;AAAA,IACI;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AACJ;AAEO,SAAS,mBACZ,cACA,uBACA,aACA,YAAqB,OACjB;AACJ,MACI,sBAAsB;AAAA,IAClB;AAAA,EACJ;AAEA;AACJ,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC,oBAAAA;AAAA,MAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AACA,wBAAsB,OAAO,OAAO;AACxC;AAEO,SAAS,wBACZ,cACA,uBACI;AACJ,MACI,SAAS;AAAA,IACL;AAAA,EACJ;AAEA;AACJ,QAAM,EAAE,iBAAiB,eAAe,cAAc,IAAI;AAC1D,QAAM,yBAAyB,cAAc,sBAAsB;AAEnE,QAAM,kBACF,uBAAuB,MAAM,OAAO,UAAU;AAElD,QAAM,0BACF,uBAAuB,MAAM,OAAO,UAAU,mCACxC,kBAAkB,uBAAuB,SAAS,mCAClD;AAEV,QAAM,mBACF,uBAAuB,OAAO;AAClC,QAAM,2BAA2B,KAAK;AAAA,IAClC;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,+BACF,OAAO,UAAU,OAAO,aAAa,uBAAuB;AAEhE,MAAI,+BAA+B,oCAAmB;AAElD,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAC/B,uBAAuB,QAAQ,iDACnC;AAAA,EACJ,OAAO;AACH,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAAG,wBAAwB;AAAA,EAClE;AAEA,wBAAsB,MAAM,MAAM,GAAG,uBAAuB;AAE5D,QAAM,cAAc,uBAAuB,eAAe,CAAC;AAE3D,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC,yBAAAC;AAAA,MAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA,QACA,0BAA0B,CAAC,SAAiB;AACxC,gBAAM,gBAAgB,cAAc;AAAA,YAChC,IAAI,wCAAuB,KAAK,IAAI;AAAA,UACxC;AACA,iBAAO;AAAA,QACX;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AAEA,wBAAsB,YAAY,OAAO;AAC7C;AAEA,SAAS,uBACL,eACA,OACa;AACb,QAAM,YAA2B,CAAC;AAClC,MAAI,iBAAiB,cAAc;AAEnC,SAAO,QAAQ,KAAK,mBAAmB,OAAO,SAAS,MAAM;AACzD,QAAI,CAAC,gBAAgB;AACjB,aAAO;AAAA,IACX;AAEA,QAAI,eAAe,aAAa,wCAAuB,GAAG;AACtD,gBAAU;AAAA,QACN,eAAe,aAAa,wCAAuB;AAAA,MACvD;AACA;AAAA,IACJ;AACA,qBAAiB,eAAe;AAAA,EACpC;AAEA,SAAO;AACX;","names":["FieldToolbarComponent","FieldLabelWrapperComponent"]}

package/dist/modern/visualBuilder/generators/generateToolbar.d.cts CHANGED Viewed

@@ -1,8 +1,8 @@
 import { VisualBuilderCslpEventDetails } from '../types/visualBuilder.types.cjs';
 import '../../cslp/types/cslp.types.cjs';
-declare function appendFocusedToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void): void;
-declare function appendFieldToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void): void;
+declare function appendFocusedToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): void;
+declare function appendFieldToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): void;
 declare function appendFieldPathDropdown(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement): void;
 export { appendFieldPathDropdown, appendFieldToolbar, appendFocusedToolbar };

package/dist/modern/visualBuilder/generators/generateToolbar.d.ts CHANGED Viewed

@@ -1,8 +1,8 @@
 import { VisualBuilderCslpEventDetails } from '../types/visualBuilder.types.js';
 import '../../cslp/types/cslp.types.js';
-declare function appendFocusedToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void): void;
-declare function appendFieldToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void): void;
+declare function appendFocusedToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): void;
+declare function appendFieldToolbar(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement, hideOverlay: () => void, isVariant?: boolean): void;
 declare function appendFieldPathDropdown(eventDetails: VisualBuilderCslpEventDetails, focusedToolbarElement: HTMLDivElement): void;
 export { appendFieldPathDropdown, appendFieldToolbar, appendFocusedToolbar };

package/dist/modern/visualBuilder/generators/generateToolbar.js CHANGED Viewed

@@ -12,11 +12,16 @@ import FieldToolbarComponent from "../components/FieldToolbar.js";
 import { render } from "preact";
 import FieldLabelWrapperComponent from "../components/fieldLabelWrapper.js";
 import { jsx } from "preact/jsx-runtime";
-function appendFocusedToolbar(eventDetails, focusedToolbarElement, hideOverlay) {
+function appendFocusedToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
   appendFieldPathDropdown(eventDetails, focusedToolbarElement);
-  appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay);
+  appendFieldToolbar(
+    eventDetails,
+    focusedToolbarElement,
+    hideOverlay,
+    isVariant
+  );
 }
-function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay) {
+function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay, isVariant = false) {
   if (focusedToolbarElement.querySelector(
     ".visual-builder__focused-toolbar__multiple-field-toolbar"
   ))
@@ -27,7 +32,8 @@ function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay) {
       FieldToolbarComponent,
       {
         eventDetails,
-        hideOverlay
+        hideOverlay,
+        isVariant
       }
     ),
     wrapper
@@ -35,7 +41,9 @@ function appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay) {
   focusedToolbarElement.append(wrapper);
 }
 function appendFieldPathDropdown(eventDetails, focusedToolbarElement) {
-  if (document.querySelector(".visual-builder__focused-toolbar__field-label-wrapper"))
+  if (document.querySelector(
+    ".visual-builder__focused-toolbar__field-label-wrapper"
+  ))
     return;
   const { editableElement: targetElement, fieldMetadata } = eventDetails;
   const targetElementDimension = targetElement.getBoundingClientRect();

package/dist/modern/visualBuilder/generators/generateToolbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/generators/generateToolbar.tsx"],"sourcesContent":["import { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport {\n DATA_CSLP_ATTR_SELECTOR,\n LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX,\n RIGHT_EDGE_BUFFER,\n TOOLBAR_EDGE_BUFFER,\n TOP_EDGE_BUFFER,\n} from \"../utils/constants\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\n\nimport FieldToolbarComponent from \"../components/FieldToolbar\";\nimport { render } from \"preact\";\nimport FieldLabelWrapperComponent from \"../components/fieldLabelWrapper\";\n\nexport function appendFocusedToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(eventDetails, focusedToolbarElement, hideOverlay);\n}\n\nexport function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void\n): void {\n if (\n focusedToolbarElement.querySelector(\n \".visual-builder__focused-toolbar__multiple-field-toolbar\"\n )\n )\n return;\n const wrapper = document.createDocumentFragment();\n render(\n <FieldToolbarComponent\n eventDetails={eventDetails}\n hideOverlay={hideOverlay}\n />,\n wrapper\n );\n\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if(document.querySelector(\".visual-builder__focused-toolbar__field-label-wrapper\"))\n return;\n const { editableElement: targetElement, fieldMetadata } = eventDetails;\n const targetElementDimension = targetElement.getBoundingClientRect();\n\n const distanceFromTop =\n targetElementDimension.top + window.scrollY - TOOLBAR_EDGE_BUFFER;\n // Position the toolbar at the top unless there's insufficient space or scrolling up is not possible (topmost element targetted).\n const adjustedDistanceFromTop =\n targetElementDimension.top + window.scrollY < TOP_EDGE_BUFFER\n ? distanceFromTop + targetElementDimension.height + TOP_EDGE_BUFFER\n : distanceFromTop;\n\n const distanceFromLeft =\n targetElementDimension.left - LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX;\n const adjustedDistanceFromLeft = Math.max(\n distanceFromLeft,\n TOOLBAR_EDGE_BUFFER\n );\n\n const targetElementRightEdgeOffset =\n window.scrollX + window.innerWidth - targetElementDimension.left;\n\n if (targetElementRightEdgeOffset < RIGHT_EDGE_BUFFER) {\n // Overflow / Cutoff on right edge\n focusedToolbarElement.style.justifyContent = \"flex-end\";\n focusedToolbarElement.style.left = `${\n targetElementDimension.right + LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX\n }px`;\n } else {\n focusedToolbarElement.style.justifyContent = \"flex-start\"; // default\n focusedToolbarElement.style.left = `${adjustedDistanceFromLeft}px`;\n }\n\n focusedToolbarElement.style.top = `${adjustedDistanceFromTop}px`;\n\n const parentPaths = collectParentCSLPPaths(targetElement, 2);\n\n const wrapper = document.createDocumentFragment();\n render(\n <FieldLabelWrapperComponent\n fieldMetadata={fieldMetadata}\n eventDetails={eventDetails}\n parentPaths={parentPaths}\n getParentEditableElement={(cslp: string) => {\n const parentElement = targetElement.closest(\n `[${DATA_CSLP_ATTR_SELECTOR}=\"${cslp}\"]`\n ) as HTMLElement \| null;\n return parentElement;\n }}\n />,\n wrapper\n );\n\n focusedToolbarElement.appendChild(wrapper);\n}\n\nfunction collectParentCSLPPaths(\n targetElement: Element,\n count: number\n): Array<string> {\n const cslpPaths: Array<string> = [];\n let currentElement = targetElement.parentElement;\n\n while (count > 0 \|\| currentElement === window.document.body) {\n if (!currentElement) {\n return cslpPaths;\n }\n\n if (currentElement.hasAttribute(DATA_CSLP_ATTR_SELECTOR)) {\n cslpPaths.push(\n currentElement.getAttribute(DATA_CSLP_ATTR_SELECTOR) as string\n );\n count--;\n }\n currentElement = currentElement.parentElement;\n }\n\n return cslpPaths;\n}\n"],"mappings":";;;AACA;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAIP,OAAO,2BAA2B;AAClC,SAAS,cAAc;AACvB,OAAO,gCAAgC;~~AAwB~~/B;~~AAtBD~~,SAAS,qBACZ,cACA,uBACA,~~aACI~~;AACJ,0BAAwB,cAAc,qBAAqB;AAC3D,~~qBAAmB~~,~~cAAc~~,~~uBAAuB~~,~~WAAW~~;~~AACvE~~;AAEO,SAAS,mBACZ,cACA,uBACA,~~aACI~~;AACJ,MACI,sBAAsB;AAAA,IAClB;AAAA,EACJ;AAEA;AACJ,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;~~AAEA~~,wBAAsB,OAAO,OAAO;AACxC;AAEO,SAAS,wBACZ,cACA,uBACI;AACJ,~~MAAG~~,SAAS,~~cAAc~~,~~uDAAuD~~;~~AAC7E~~;AACJ,QAAM,EAAE,iBAAiB,eAAe,cAAc,IAAI;AAC1D,QAAM,yBAAyB,cAAc,sBAAsB;AAEnE,QAAM,kBACF,uBAAuB,MAAM,OAAO,UAAU;AAElD,QAAM,0BACF,uBAAuB,MAAM,OAAO,UAAU,kBACxC,kBAAkB,uBAAuB,SAAS,kBAClD;AAEV,QAAM,mBACF,uBAAuB,OAAO;AAClC,QAAM,2BAA2B,KAAK;AAAA,IAClC;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,+BACF,OAAO,UAAU,OAAO,aAAa,uBAAuB;AAEhE,MAAI,+BAA+B,mBAAmB;AAElD,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAC/B,uBAAuB,QAAQ,gCACnC;AAAA,EACJ,OAAO;AACH,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAAG,wBAAwB;AAAA,EAClE;AAEA,wBAAsB,MAAM,MAAM,GAAG,uBAAuB;AAE5D,QAAM,cAAc,uBAAuB,eAAe,CAAC;AAE3D,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA,QACA,0BAA0B,CAAC,SAAiB;AACxC,gBAAM,gBAAgB,cAAc;AAAA,YAChC,IAAI,uBAAuB,KAAK,IAAI;AAAA,UACxC;AACA,iBAAO;AAAA,QACX;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AAEA,wBAAsB,YAAY,OAAO;AAC7C;AAEA,SAAS,uBACL,eACA,OACa;AACb,QAAM,YAA2B,CAAC;AAClC,MAAI,iBAAiB,cAAc;AAEnC,SAAO,QAAQ,KAAK,mBAAmB,OAAO,SAAS,MAAM;AACzD,QAAI,CAAC,gBAAgB;AACjB,aAAO;AAAA,IACX;AAEA,QAAI,eAAe,aAAa,uBAAuB,GAAG;AACtD,gBAAU;AAAA,QACN,eAAe,aAAa,uBAAuB;AAAA,MACvD;AACA;AAAA,IACJ;AACA,qBAAiB,eAAe;AAAA,EACpC;AAEA,SAAO;AACX;","names":[]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/generators/generateToolbar.tsx"],"sourcesContent":["import { VisualBuilderCslpEventDetails } from \"../types/visualBuilder.types\";\nimport {\n DATA_CSLP_ATTR_SELECTOR,\n LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX,\n RIGHT_EDGE_BUFFER,\n TOOLBAR_EDGE_BUFFER,\n TOP_EDGE_BUFFER,\n} from \"../utils/constants\";\nimport { FieldSchemaMap } from \"../utils/fieldSchemaMap\";\nimport { isFieldDisabled } from \"../utils/isFieldDisabled\";\n\nimport FieldToolbarComponent from \"../components/FieldToolbar\";\nimport { render } from \"preact\";\nimport FieldLabelWrapperComponent from \"../components/fieldLabelWrapper\";\n\nexport function appendFocusedToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\n): void {\n appendFieldPathDropdown(eventDetails, focusedToolbarElement);\n appendFieldToolbar(\n eventDetails,\n focusedToolbarElement,\n hideOverlay,\n isVariant\n );\n}\n\nexport function appendFieldToolbar(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement,\n hideOverlay: () => void,\n isVariant: boolean = false\n): void {\n if (\n focusedToolbarElement.querySelector(\n \".visual-builder__focused-toolbar__multiple-field-toolbar\"\n )\n )\n return;\n const wrapper = document.createDocumentFragment();\n render(\n <FieldToolbarComponent\n eventDetails={eventDetails}\n hideOverlay={hideOverlay}\n isVariant={isVariant}\n />,\n wrapper\n );\n focusedToolbarElement.append(wrapper);\n}\n\nexport function appendFieldPathDropdown(\n eventDetails: VisualBuilderCslpEventDetails,\n focusedToolbarElement: HTMLDivElement\n): void {\n if (\n document.querySelector(\n \".visual-builder__focused-toolbar__field-label-wrapper\"\n )\n )\n return;\n const { editableElement: targetElement, fieldMetadata } = eventDetails;\n const targetElementDimension = targetElement.getBoundingClientRect();\n\n const distanceFromTop =\n targetElementDimension.top + window.scrollY - TOOLBAR_EDGE_BUFFER;\n // Position the toolbar at the top unless there's insufficient space or scrolling up is not possible (topmost element targetted).\n const adjustedDistanceFromTop =\n targetElementDimension.top + window.scrollY < TOP_EDGE_BUFFER\n ? distanceFromTop + targetElementDimension.height + TOP_EDGE_BUFFER\n : distanceFromTop;\n\n const distanceFromLeft =\n targetElementDimension.left - LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX;\n const adjustedDistanceFromLeft = Math.max(\n distanceFromLeft,\n TOOLBAR_EDGE_BUFFER\n );\n\n const targetElementRightEdgeOffset =\n window.scrollX + window.innerWidth - targetElementDimension.left;\n\n if (targetElementRightEdgeOffset < RIGHT_EDGE_BUFFER) {\n // Overflow / Cutoff on right edge\n focusedToolbarElement.style.justifyContent = \"flex-end\";\n focusedToolbarElement.style.left = `${\n targetElementDimension.right + LIVE_PREVIEW_OUTLINE_WIDTH_IN_PX\n }px`;\n } else {\n focusedToolbarElement.style.justifyContent = \"flex-start\"; // default\n focusedToolbarElement.style.left = `${adjustedDistanceFromLeft}px`;\n }\n\n focusedToolbarElement.style.top = `${adjustedDistanceFromTop}px`;\n\n const parentPaths = collectParentCSLPPaths(targetElement, 2);\n\n const wrapper = document.createDocumentFragment();\n render(\n <FieldLabelWrapperComponent\n fieldMetadata={fieldMetadata}\n eventDetails={eventDetails}\n parentPaths={parentPaths}\n getParentEditableElement={(cslp: string) => {\n const parentElement = targetElement.closest(\n `[${DATA_CSLP_ATTR_SELECTOR}=\"${cslp}\"]`\n ) as HTMLElement \| null;\n return parentElement;\n }}\n />,\n wrapper\n );\n\n focusedToolbarElement.appendChild(wrapper);\n}\n\nfunction collectParentCSLPPaths(\n targetElement: Element,\n count: number\n): Array<string> {\n const cslpPaths: Array<string> = [];\n let currentElement = targetElement.parentElement;\n\n while (count > 0 \|\| currentElement === window.document.body) {\n if (!currentElement) {\n return cslpPaths;\n }\n\n if (currentElement.hasAttribute(DATA_CSLP_ATTR_SELECTOR)) {\n cslpPaths.push(\n currentElement.getAttribute(DATA_CSLP_ATTR_SELECTOR) as string\n );\n count--;\n }\n currentElement = currentElement.parentElement;\n }\n\n return cslpPaths;\n}\n"],"mappings":";;;AACA;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAIP,OAAO,2BAA2B;AAClC,SAAS,cAAc;AACvB,OAAO,gCAAgC;AA+B/B;AA7BD,SAAS,qBACZ,cACA,uBACA,aACA,YAAqB,OACjB;AACJ,0BAAwB,cAAc,qBAAqB;AAC3D;AAAA,IACI;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AACJ;AAEO,SAAS,mBACZ,cACA,uBACA,aACA,YAAqB,OACjB;AACJ,MACI,sBAAsB;AAAA,IAClB;AAAA,EACJ;AAEA;AACJ,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AACA,wBAAsB,OAAO,OAAO;AACxC;AAEO,SAAS,wBACZ,cACA,uBACI;AACJ,MACI,SAAS;AAAA,IACL;AAAA,EACJ;AAEA;AACJ,QAAM,EAAE,iBAAiB,eAAe,cAAc,IAAI;AAC1D,QAAM,yBAAyB,cAAc,sBAAsB;AAEnE,QAAM,kBACF,uBAAuB,MAAM,OAAO,UAAU;AAElD,QAAM,0BACF,uBAAuB,MAAM,OAAO,UAAU,kBACxC,kBAAkB,uBAAuB,SAAS,kBAClD;AAEV,QAAM,mBACF,uBAAuB,OAAO;AAClC,QAAM,2BAA2B,KAAK;AAAA,IAClC;AAAA,IACA;AAAA,EACJ;AAEA,QAAM,+BACF,OAAO,UAAU,OAAO,aAAa,uBAAuB;AAEhE,MAAI,+BAA+B,mBAAmB;AAElD,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAC/B,uBAAuB,QAAQ,gCACnC;AAAA,EACJ,OAAO;AACH,0BAAsB,MAAM,iBAAiB;AAC7C,0BAAsB,MAAM,OAAO,GAAG,wBAAwB;AAAA,EAClE;AAEA,wBAAsB,MAAM,MAAM,GAAG,uBAAuB;AAE5D,QAAM,cAAc,uBAAuB,eAAe,CAAC;AAE3D,QAAM,UAAU,SAAS,uBAAuB;AAChD;AAAA,IACI;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA;AAAA,QACA;AAAA,QACA,0BAA0B,CAAC,SAAiB;AACxC,gBAAM,gBAAgB,cAAc;AAAA,YAChC,IAAI,uBAAuB,KAAK,IAAI;AAAA,UACxC;AACA,iBAAO;AAAA,QACX;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,EACJ;AAEA,wBAAsB,YAAY,OAAO;AAC7C;AAEA,SAAS,uBACL,eACA,OACa;AACb,QAAM,YAA2B,CAAC;AAClC,MAAI,iBAAiB,cAAc;AAEnC,SAAO,QAAQ,KAAK,mBAAmB,OAAO,SAAS,MAAM;AACzD,QAAI,CAAC,gBAAgB;AACjB,aAAO;AAAA,IACX;AAEA,QAAI,eAAe,aAAa,uBAAuB,GAAG;AACtD,gBAAU;AAAA,QACN,eAAe,aAAa,uBAAuB;AAAA,MACvD;AACA;AAAA,IACJ;AACA,qBAAiB,eAAe;AAAA,EACpC;AAEA,SAAO;AACX;","names":[]}

package/dist/modern/visualBuilder/hooks/useCollabOperations.cjs CHANGED Viewed

@@ -37,11 +37,12 @@ var import_visualBuilderPostMessage = __toESM(require("../utils/visualBuilderPos
 var import_postMessage = require("../utils/types/postMessage.types.cjs");
 var import_generateThread = require("../generators/generateThread.cjs");
 var import_configManager = __toESM(require("../../configManager/configManager.cjs"), 1);
+var import_collabUtils = require("../utils/collabUtils.cjs");
 var useCollabOperations = () => {
   const createComment = async (payload) => {
     const data = await import_visualBuilderPostMessage.default?.send(
       import_postMessage.VisualBuilderPostMessageEvents.COLLAB_CREATE_COMMENT,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to create comment");
     return data;
@@ -49,7 +50,7 @@ var useCollabOperations = () => {
   const editComment = async (payload) => {
     const data = await import_visualBuilderPostMessage.default?.send(
       import_postMessage.VisualBuilderPostMessageEvents.COLLAB_EDIT_COMMENT,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to update comment");
     return data;
@@ -57,7 +58,7 @@ var useCollabOperations = () => {
   const deleteComment = async (payload) => {
     const data = await import_visualBuilderPostMessage.default?.send(
       import_postMessage.VisualBuilderPostMessageEvents.COLLAB_DELETE_COMMENT,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to delete comment");
     return data;
@@ -65,7 +66,7 @@ var useCollabOperations = () => {
   const resolveThread = async (payload) => {
     const data = await import_visualBuilderPostMessage.default?.send(
       import_postMessage.VisualBuilderPostMessageEvents.COLLAB_RESOLVE_THREAD,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to resolve thread");
     return data;
@@ -73,7 +74,7 @@ var useCollabOperations = () => {
   const fetchComments = async (payload) => {
     return await import_visualBuilderPostMessage.default?.send(
       import_postMessage.VisualBuilderPostMessageEvents.COLLAB_FETCH_COMMENTS,
-      { payload }
+      payload
     );
   };
   const createNewThread = async (buttonRef, inviteMetadata) => {
@@ -98,13 +99,13 @@ var useCollabOperations = () => {
       elementXPath: fieldPath,
       position: { x: relativeX, y: relativeY },
       author: inviteMetadata.currentUser.email,
-      pageRoute: window.location.pathname,
+      pageRoute: (0, import_collabUtils.normalizePath)(window.location.pathname),
       inviteUid: inviteMetadata.inviteUid,
       createdBy: inviteMetadata.currentUser.uid
     };
     const data = await import_visualBuilderPostMessage.default?.send(
       import_postMessage.VisualBuilderPostMessageEvents.COLLAB_CREATE_THREAD,
-      { payload }
+      payload
     );
     parentDiv.setAttribute("threaduid", data.thread._id);
     return data;
@@ -112,7 +113,7 @@ var useCollabOperations = () => {
   const deleteThread = async (payload) => {
     const data = await import_visualBuilderPostMessage.default?.send(
       import_postMessage.VisualBuilderPostMessageEvents.COLLAB_DELETE_THREAD,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to delete thread");
     (0, import_generateThread.removeCollabIcon)(payload.threadUid);

package/dist/modern/visualBuilder/hooks/useCollabOperations.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/hooks/useCollabOperations.ts"],"sourcesContent":["/** @jsxImportSource preact */\nimport React from \"preact/compat\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport {\n ICommentResponse,\n IThreadResponseDTO,\n IDefaultAPIResponse,\n IFetchCommentsResponse,\n ICommentPayload,\n IEditCommentArgs,\n IDeleteCommentArgs,\n IThreadResolveArgs,\n IFetchComments,\n IThreadPayload,\n IInviteMetadata,\n IDeleteThreadArgs,\n} from \"../types/collab.types\";\nimport { removeCollabIcon } from \"../generators/generateThread\";\nimport Config from \"../../configManager/configManager\";\n\nexport const useCollabOperations = () => {\n const createComment = async (payload: ICommentPayload) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_CREATE_COMMENT,\n { payload }\n )) as ICommentResponse;\n if (!data) throw new Error(\"Failed to create comment\");\n return data;\n };\n\n const editComment = async (payload: IEditCommentArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_EDIT_COMMENT,\n { payload }\n )) as ICommentResponse;\n if (!data) throw new Error(\"Failed to update comment\");\n return data;\n };\n\n const deleteComment = async (payload: IDeleteCommentArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_DELETE_COMMENT,\n { payload }\n )) as IDefaultAPIResponse;\n if (!data) throw new Error(\"Failed to delete comment\");\n return data;\n };\n\n const resolveThread = async (payload: IThreadResolveArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_RESOLVE_THREAD,\n { payload }\n )) as IThreadResponseDTO;\n if (!data) throw new Error(\"Failed to resolve thread\");\n return data;\n };\n\n const fetchComments = async (payload: IFetchComments) => {\n return (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_FETCH_COMMENTS,\n { payload }\n )) as IFetchCommentsResponse;\n };\n\n const createNewThread = async (\n buttonRef: React.RefObject<HTMLButtonElement>,\n inviteMetadata: IInviteMetadata\n ) => {\n if (!buttonRef.current) {\n throw new Error(\"Button ref not found\");\n }\n\n const parentDiv = buttonRef.current.closest(\"div[field-path]\");\n\n if (!parentDiv) {\n throw new Error(\"Count not find parent div\");\n }\n\n const fieldPath = parentDiv.getAttribute(\"field-path\");\n const relative = parentDiv.getAttribute(\"relative\");\n\n if (!fieldPath \|\| !relative)\n throw new Error(\"Invalid field attributes\");\n\n const match = relative?.match(/x: ([\\d.]+), y: ([\\d.]+)/);\n if (!match) {\n throw new Error(\"Invalid relative attribute\");\n }\n\n const relativeX = parseFloat(match[1]);\n const relativeY = parseFloat(match[2]);\n\n const payload: IThreadPayload = {\n elementXPath: fieldPath,\n position: { x: relativeX, y: relativeY },\n author: inviteMetadata.currentUser.email,\n pageRoute: window.location.pathname,\n inviteUid: inviteMetadata.inviteUid,\n createdBy: inviteMetadata.currentUser.uid,\n };\n\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_CREATE_THREAD,\n { payload }\n )) as IThreadResponseDTO;\n\n parentDiv.setAttribute(\"threaduid\", data.thread._id);\n\n return data;\n };\n\n const deleteThread = async (payload: IDeleteThreadArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_DELETE_THREAD,\n { payload }\n )) as IDefaultAPIResponse;\n if (!data) throw new Error(\"Failed to delete thread\");\n removeCollabIcon(payload.threadUid);\n const config = Config.get();\n if (config?.collab?.isFeedbackMode === false) {\n Config.set(\"collab.isFeedbackMode\", true);\n }\n return data;\n };\n\n return {\n createComment,\n editComment,\n deleteComment,\n resolveThread,\n fetchComments,\n createNewThread,\n deleteThread,\n };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,sCAAqC;AACrC,yBAA+C;AAe/C,4BAAiC;AACjC,2BAAmB;~~AAEZ~~,IAAM,sBAAsB,MAAM;AACrC,QAAM,gBAAgB,OAAO,YAA6B;AACtD,UAAM,OAAQ,MAAM,gCAAAA,SAA0B;AAAA,MAC1C,kDAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,0BAA0B;AACrD,WAAO;AAAA,EACX;AAEA,QAAM,cAAc,OAAO,YAA8B;AACrD,UAAM,OAAQ,MAAM,gCAAAA,SAA0B;AAAA,MAC1C,kDAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,0BAA0B;AACrD,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,OAAO,YAAgC;AACzD,UAAM,OAAQ,MAAM,gCAAAA,SAA0B;AAAA,MAC1C,kDAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,0BAA0B;AACrD,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,OAAO,YAAgC;AACzD,UAAM,OAAQ,MAAM,gCAAAA,SAA0B;AAAA,MAC1C,kDAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,0BAA0B;AACrD,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,OAAO,YAA4B;AACrD,WAAQ,MAAM,gCAAAA,SAA0B;AAAA,MACpC,kDAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AAAA,EACJ;AAEA,QAAM,kBAAkB,OACpB,WACA,mBACC;AACD,QAAI,CAAC,UAAU,SAAS;AACpB,YAAM,IAAI,MAAM,sBAAsB;AAAA,IAC1C;AAEA,UAAM,YAAY,UAAU,QAAQ,QAAQ,iBAAiB;AAE7D,QAAI,CAAC,WAAW;AACZ,YAAM,IAAI,MAAM,2BAA2B;AAAA,IAC/C;AAEA,UAAM,YAAY,UAAU,aAAa,YAAY;AACrD,UAAM,WAAW,UAAU,aAAa,UAAU;AAElD,QAAI,CAAC,aAAa,CAAC;AACf,YAAM,IAAI,MAAM,0BAA0B;AAE9C,UAAM,QAAQ,UAAU,MAAM,0BAA0B;AACxD,QAAI,CAAC,OAAO;AACR,YAAM,IAAI,MAAM,4BAA4B;AAAA,IAChD;AAEA,UAAM,YAAY,WAAW,MAAM,CAAC,CAAC;AACrC,UAAM,YAAY,WAAW,MAAM,CAAC,CAAC;AAErC,UAAM,UAA0B;AAAA,MAC5B,cAAc;AAAA,MACd,UAAU,EAAE,GAAG,WAAW,GAAG,UAAU;AAAA,MACvC,QAAQ,eAAe,YAAY;AAAA,MACnC,~~WAAW~~,OAAO,SAAS;AAAA,~~MAC3B~~,WAAW,eAAe;AAAA,MAC1B,WAAW,eAAe,YAAY;AAAA,IAC1C;AAEA,UAAM,OAAQ,MAAM,gCAAAA,SAA0B;AAAA,MAC1C,kDAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AAEA,cAAU,aAAa,aAAa,KAAK,OAAO,GAAG;AAEnD,WAAO;AAAA,EACX;AAEA,QAAM,eAAe,OAAO,YAA+B;AACvD,UAAM,OAAQ,MAAM,gCAAAA,SAA0B;AAAA,MAC1C,kDAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,yBAAyB;AACpD,gDAAiB,QAAQ,SAAS;AAClC,UAAM,SAAS,qBAAAC,QAAO,IAAI;AAC1B,QAAI,QAAQ,QAAQ,mBAAmB,OAAO;AAC1C,2BAAAA,QAAO,IAAI,yBAAyB,IAAI;AAAA,IAC5C;AACA,WAAO;AAAA,EACX;AAEA,SAAO;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AACJ;","names":["visualBuilderPostMessage","Config"]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/hooks/useCollabOperations.ts"],"sourcesContent":["/** @jsxImportSource preact */\nimport React from \"preact/compat\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport {\n ICommentResponse,\n IThreadResponseDTO,\n IDefaultAPIResponse,\n IFetchCommentsResponse,\n ICommentPayload,\n IEditCommentArgs,\n IDeleteCommentArgs,\n IThreadResolveArgs,\n IFetchComments,\n IThreadPayload,\n IInviteMetadata,\n IDeleteThreadArgs,\n} from \"../types/collab.types\";\nimport { removeCollabIcon } from \"../generators/generateThread\";\nimport Config from \"../../configManager/configManager\";\nimport { normalizePath } from \"../utils/collabUtils\";\n\nexport const useCollabOperations = () => {\n const createComment = async (payload: ICommentPayload) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_CREATE_COMMENT,\n payload\n )) as ICommentResponse;\n if (!data) throw new Error(\"Failed to create comment\");\n return data;\n };\n\n const editComment = async (payload: IEditCommentArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_EDIT_COMMENT,\n payload\n )) as ICommentResponse;\n if (!data) throw new Error(\"Failed to update comment\");\n return data;\n };\n\n const deleteComment = async (payload: IDeleteCommentArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_DELETE_COMMENT,\n payload\n )) as IDefaultAPIResponse;\n if (!data) throw new Error(\"Failed to delete comment\");\n return data;\n };\n\n const resolveThread = async (payload: IThreadResolveArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_RESOLVE_THREAD,\n payload\n )) as IThreadResponseDTO;\n if (!data) throw new Error(\"Failed to resolve thread\");\n return data;\n };\n\n const fetchComments = async (payload: IFetchComments) => {\n return (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_FETCH_COMMENTS,\n payload\n )) as IFetchCommentsResponse;\n };\n\n const createNewThread = async (\n buttonRef: React.RefObject<HTMLButtonElement>,\n inviteMetadata: IInviteMetadata\n ) => {\n if (!buttonRef.current) {\n throw new Error(\"Button ref not found\");\n }\n\n const parentDiv = buttonRef.current.closest(\"div[field-path]\");\n\n if (!parentDiv) {\n throw new Error(\"Count not find parent div\");\n }\n\n const fieldPath = parentDiv.getAttribute(\"field-path\");\n const relative = parentDiv.getAttribute(\"relative\");\n\n if (!fieldPath \|\| !relative)\n throw new Error(\"Invalid field attributes\");\n\n const match = relative?.match(/x: ([\\d.]+), y: ([\\d.]+)/);\n if (!match) {\n throw new Error(\"Invalid relative attribute\");\n }\n\n const relativeX = parseFloat(match[1]);\n const relativeY = parseFloat(match[2]);\n\n const payload: IThreadPayload = {\n elementXPath: fieldPath,\n position: { x: relativeX, y: relativeY },\n author: inviteMetadata.currentUser.email,\n pageRoute: normalizePath(window.location.pathname),\n inviteUid: inviteMetadata.inviteUid,\n createdBy: inviteMetadata.currentUser.uid,\n };\n\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_CREATE_THREAD,\n payload\n )) as IThreadResponseDTO;\n\n parentDiv.setAttribute(\"threaduid\", data.thread._id);\n\n return data;\n };\n\n const deleteThread = async (payload: IDeleteThreadArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_DELETE_THREAD,\n payload\n )) as IDefaultAPIResponse;\n if (!data) throw new Error(\"Failed to delete thread\");\n removeCollabIcon(payload.threadUid);\n const config = Config.get();\n if (config?.collab?.isFeedbackMode === false) {\n Config.set(\"collab.isFeedbackMode\", true);\n }\n return data;\n };\n\n return {\n createComment,\n editComment,\n deleteComment,\n resolveThread,\n fetchComments,\n createNewThread,\n deleteThread,\n };\n};\n"],"mappings":"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","names":["visualBuilderPostMessage","Config"]}

package/dist/modern/visualBuilder/hooks/useCollabOperations.js CHANGED Viewed

@@ -5,11 +5,12 @@ import visualBuilderPostMessage from "../utils/visualBuilderPostMessage.js";
 import { VisualBuilderPostMessageEvents } from "../utils/types/postMessage.types.js";
 import { removeCollabIcon } from "../generators/generateThread.js";
 import Config from "../../configManager/configManager.js";
+import { normalizePath } from "../utils/collabUtils.js";
 var useCollabOperations = () => {
   const createComment = async (payload) => {
     const data = await visualBuilderPostMessage?.send(
       VisualBuilderPostMessageEvents.COLLAB_CREATE_COMMENT,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to create comment");
     return data;
@@ -17,7 +18,7 @@ var useCollabOperations = () => {
   const editComment = async (payload) => {
     const data = await visualBuilderPostMessage?.send(
       VisualBuilderPostMessageEvents.COLLAB_EDIT_COMMENT,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to update comment");
     return data;
@@ -25,7 +26,7 @@ var useCollabOperations = () => {
   const deleteComment = async (payload) => {
     const data = await visualBuilderPostMessage?.send(
       VisualBuilderPostMessageEvents.COLLAB_DELETE_COMMENT,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to delete comment");
     return data;
@@ -33,7 +34,7 @@ var useCollabOperations = () => {
   const resolveThread = async (payload) => {
     const data = await visualBuilderPostMessage?.send(
       VisualBuilderPostMessageEvents.COLLAB_RESOLVE_THREAD,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to resolve thread");
     return data;
@@ -41,7 +42,7 @@ var useCollabOperations = () => {
   const fetchComments = async (payload) => {
     return await visualBuilderPostMessage?.send(
       VisualBuilderPostMessageEvents.COLLAB_FETCH_COMMENTS,
-      { payload }
+      payload
     );
   };
   const createNewThread = async (buttonRef, inviteMetadata) => {
@@ -66,13 +67,13 @@ var useCollabOperations = () => {
       elementXPath: fieldPath,
       position: { x: relativeX, y: relativeY },
       author: inviteMetadata.currentUser.email,
-      pageRoute: window.location.pathname,
+      pageRoute: normalizePath(window.location.pathname),
       inviteUid: inviteMetadata.inviteUid,
       createdBy: inviteMetadata.currentUser.uid
     };
     const data = await visualBuilderPostMessage?.send(
       VisualBuilderPostMessageEvents.COLLAB_CREATE_THREAD,
-      { payload }
+      payload
     );
     parentDiv.setAttribute("threaduid", data.thread._id);
     return data;
@@ -80,7 +81,7 @@ var useCollabOperations = () => {
   const deleteThread = async (payload) => {
     const data = await visualBuilderPostMessage?.send(
       VisualBuilderPostMessageEvents.COLLAB_DELETE_THREAD,
-      { payload }
+      payload
     );
     if (!data) throw new Error("Failed to delete thread");
     removeCollabIcon(payload.threadUid);

package/dist/modern/visualBuilder/hooks/useCollabOperations.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/visualBuilder/hooks/useCollabOperations.ts"],"sourcesContent":["/** @jsxImportSource preact */\nimport React from \"preact/compat\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport {\n ICommentResponse,\n IThreadResponseDTO,\n IDefaultAPIResponse,\n IFetchCommentsResponse,\n ICommentPayload,\n IEditCommentArgs,\n IDeleteCommentArgs,\n IThreadResolveArgs,\n IFetchComments,\n IThreadPayload,\n IInviteMetadata,\n IDeleteThreadArgs,\n} from \"../types/collab.types\";\nimport { removeCollabIcon } from \"../generators/generateThread\";\nimport Config from \"../../configManager/configManager\";\n\nexport const useCollabOperations = () => {\n const createComment = async (payload: ICommentPayload) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_CREATE_COMMENT,\n { payload }\n )) as ICommentResponse;\n if (!data) throw new Error(\"Failed to create comment\");\n return data;\n };\n\n const editComment = async (payload: IEditCommentArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_EDIT_COMMENT,\n { payload }\n )) as ICommentResponse;\n if (!data) throw new Error(\"Failed to update comment\");\n return data;\n };\n\n const deleteComment = async (payload: IDeleteCommentArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_DELETE_COMMENT,\n { payload }\n )) as IDefaultAPIResponse;\n if (!data) throw new Error(\"Failed to delete comment\");\n return data;\n };\n\n const resolveThread = async (payload: IThreadResolveArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_RESOLVE_THREAD,\n { payload }\n )) as IThreadResponseDTO;\n if (!data) throw new Error(\"Failed to resolve thread\");\n return data;\n };\n\n const fetchComments = async (payload: IFetchComments) => {\n return (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_FETCH_COMMENTS,\n { payload }\n )) as IFetchCommentsResponse;\n };\n\n const createNewThread = async (\n buttonRef: React.RefObject<HTMLButtonElement>,\n inviteMetadata: IInviteMetadata\n ) => {\n if (!buttonRef.current) {\n throw new Error(\"Button ref not found\");\n }\n\n const parentDiv = buttonRef.current.closest(\"div[field-path]\");\n\n if (!parentDiv) {\n throw new Error(\"Count not find parent div\");\n }\n\n const fieldPath = parentDiv.getAttribute(\"field-path\");\n const relative = parentDiv.getAttribute(\"relative\");\n\n if (!fieldPath \|\| !relative)\n throw new Error(\"Invalid field attributes\");\n\n const match = relative?.match(/x: ([\\d.]+), y: ([\\d.]+)/);\n if (!match) {\n throw new Error(\"Invalid relative attribute\");\n }\n\n const relativeX = parseFloat(match[1]);\n const relativeY = parseFloat(match[2]);\n\n const payload: IThreadPayload = {\n elementXPath: fieldPath,\n position: { x: relativeX, y: relativeY },\n author: inviteMetadata.currentUser.email,\n pageRoute: window.location.pathname,\n inviteUid: inviteMetadata.inviteUid,\n createdBy: inviteMetadata.currentUser.uid,\n };\n\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_CREATE_THREAD,\n { payload }\n )) as IThreadResponseDTO;\n\n parentDiv.setAttribute(\"threaduid\", data.thread._id);\n\n return data;\n };\n\n const deleteThread = async (payload: IDeleteThreadArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_DELETE_THREAD,\n { payload }\n )) as IDefaultAPIResponse;\n if (!data) throw new Error(\"Failed to delete thread\");\n removeCollabIcon(payload.threadUid);\n const config = Config.get();\n if (config?.collab?.isFeedbackMode === false) {\n Config.set(\"collab.isFeedbackMode\", true);\n }\n return data;\n };\n\n return {\n createComment,\n editComment,\n deleteComment,\n resolveThread,\n fetchComments,\n createNewThread,\n deleteThread,\n };\n};\n"],"mappings":";;;AAEA,OAAO,8BAA8B;AACrC,SAAS,sCAAsC;AAe/C,SAAS,wBAAwB;AACjC,OAAO,YAAY;~~AAEZ~~,IAAM,sBAAsB,MAAM;AACrC,QAAM,gBAAgB,OAAO,YAA6B;AACtD,UAAM,OAAQ,MAAM,0BAA0B;AAAA,MAC1C,+BAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,0BAA0B;AACrD,WAAO;AAAA,EACX;AAEA,QAAM,cAAc,OAAO,YAA8B;AACrD,UAAM,OAAQ,MAAM,0BAA0B;AAAA,MAC1C,+BAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,0BAA0B;AACrD,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,OAAO,YAAgC;AACzD,UAAM,OAAQ,MAAM,0BAA0B;AAAA,MAC1C,+BAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,0BAA0B;AACrD,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,OAAO,YAAgC;AACzD,UAAM,OAAQ,MAAM,0BAA0B;AAAA,MAC1C,+BAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,0BAA0B;AACrD,WAAO;AAAA,EACX;AAEA,QAAM,gBAAgB,OAAO,YAA4B;AACrD,WAAQ,MAAM,0BAA0B;AAAA,MACpC,+BAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AAAA,EACJ;AAEA,QAAM,kBAAkB,OACpB,WACA,mBACC;AACD,QAAI,CAAC,UAAU,SAAS;AACpB,YAAM,IAAI,MAAM,sBAAsB;AAAA,IAC1C;AAEA,UAAM,YAAY,UAAU,QAAQ,QAAQ,iBAAiB;AAE7D,QAAI,CAAC,WAAW;AACZ,YAAM,IAAI,MAAM,2BAA2B;AAAA,IAC/C;AAEA,UAAM,YAAY,UAAU,aAAa,YAAY;AACrD,UAAM,WAAW,UAAU,aAAa,UAAU;AAElD,QAAI,CAAC,aAAa,CAAC;AACf,YAAM,IAAI,MAAM,0BAA0B;AAE9C,UAAM,QAAQ,UAAU,MAAM,0BAA0B;AACxD,QAAI,CAAC,OAAO;AACR,YAAM,IAAI,MAAM,4BAA4B;AAAA,IAChD;AAEA,UAAM,YAAY,WAAW,MAAM,CAAC,CAAC;AACrC,UAAM,YAAY,WAAW,MAAM,CAAC,CAAC;AAErC,UAAM,UAA0B;AAAA,MAC5B,cAAc;AAAA,MACd,UAAU,EAAE,GAAG,WAAW,GAAG,UAAU;AAAA,MACvC,QAAQ,eAAe,YAAY;AAAA,MACnC,WAAW,OAAO,SAAS;AAAA,~~MAC3B~~,WAAW,eAAe;AAAA,MAC1B,WAAW,eAAe,YAAY;AAAA,IAC1C;AAEA,UAAM,OAAQ,MAAM,0BAA0B;AAAA,MAC1C,+BAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AAEA,cAAU,aAAa,aAAa,KAAK,OAAO,GAAG;AAEnD,WAAO;AAAA,EACX;AAEA,QAAM,eAAe,OAAO,YAA+B;AACvD,UAAM,OAAQ,MAAM,0BAA0B;AAAA,MAC1C,+BAA+B;AAAA,MAC/B~~,EAAE,QAAQ~~;AAAA,~~IACd~~;AACA,QAAI,CAAC,KAAM,OAAM,IAAI,MAAM,yBAAyB;AACpD,qBAAiB,QAAQ,SAAS;AAClC,UAAM,SAAS,OAAO,IAAI;AAC1B,QAAI,QAAQ,QAAQ,mBAAmB,OAAO;AAC1C,aAAO,IAAI,yBAAyB,IAAI;AAAA,IAC5C;AACA,WAAO;AAAA,EACX;AAEA,SAAO;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ;AACJ;","names":[]}
1	+ {"version":3,"sources":["../../../../src/visualBuilder/hooks/useCollabOperations.ts"],"sourcesContent":["/** @jsxImportSource preact */\nimport React from \"preact/compat\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\nimport {\n ICommentResponse,\n IThreadResponseDTO,\n IDefaultAPIResponse,\n IFetchCommentsResponse,\n ICommentPayload,\n IEditCommentArgs,\n IDeleteCommentArgs,\n IThreadResolveArgs,\n IFetchComments,\n IThreadPayload,\n IInviteMetadata,\n IDeleteThreadArgs,\n} from \"../types/collab.types\";\nimport { removeCollabIcon } from \"../generators/generateThread\";\nimport Config from \"../../configManager/configManager\";\nimport { normalizePath } from \"../utils/collabUtils\";\n\nexport const useCollabOperations = () => {\n const createComment = async (payload: ICommentPayload) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_CREATE_COMMENT,\n payload\n )) as ICommentResponse;\n if (!data) throw new Error(\"Failed to create comment\");\n return data;\n };\n\n const editComment = async (payload: IEditCommentArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_EDIT_COMMENT,\n payload\n )) as ICommentResponse;\n if (!data) throw new Error(\"Failed to update comment\");\n return data;\n };\n\n const deleteComment = async (payload: IDeleteCommentArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_DELETE_COMMENT,\n payload\n )) as IDefaultAPIResponse;\n if (!data) throw new Error(\"Failed to delete comment\");\n return data;\n };\n\n const resolveThread = async (payload: IThreadResolveArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_RESOLVE_THREAD,\n payload\n )) as IThreadResponseDTO;\n if (!data) throw new Error(\"Failed to resolve thread\");\n return data;\n };\n\n const fetchComments = async (payload: IFetchComments) => {\n return (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_FETCH_COMMENTS,\n payload\n )) as IFetchCommentsResponse;\n };\n\n const createNewThread = async (\n buttonRef: React.RefObject<HTMLButtonElement>,\n inviteMetadata: IInviteMetadata\n ) => {\n if (!buttonRef.current) {\n throw new Error(\"Button ref not found\");\n }\n\n const parentDiv = buttonRef.current.closest(\"div[field-path]\");\n\n if (!parentDiv) {\n throw new Error(\"Count not find parent div\");\n }\n\n const fieldPath = parentDiv.getAttribute(\"field-path\");\n const relative = parentDiv.getAttribute(\"relative\");\n\n if (!fieldPath \|\| !relative)\n throw new Error(\"Invalid field attributes\");\n\n const match = relative?.match(/x: ([\\d.]+), y: ([\\d.]+)/);\n if (!match) {\n throw new Error(\"Invalid relative attribute\");\n }\n\n const relativeX = parseFloat(match[1]);\n const relativeY = parseFloat(match[2]);\n\n const payload: IThreadPayload = {\n elementXPath: fieldPath,\n position: { x: relativeX, y: relativeY },\n author: inviteMetadata.currentUser.email,\n pageRoute: normalizePath(window.location.pathname),\n inviteUid: inviteMetadata.inviteUid,\n createdBy: inviteMetadata.currentUser.uid,\n };\n\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_CREATE_THREAD,\n payload\n )) as IThreadResponseDTO;\n\n parentDiv.setAttribute(\"threaduid\", data.thread._id);\n\n return data;\n };\n\n const deleteThread = async (payload: IDeleteThreadArgs) => {\n const data = (await visualBuilderPostMessage?.send(\n VisualBuilderPostMessageEvents.COLLAB_DELETE_THREAD,\n payload\n )) as IDefaultAPIResponse;\n if (!data) throw new Error(\"Failed to delete thread\");\n removeCollabIcon(payload.threadUid);\n const config = Config.get();\n if (config?.collab?.isFeedbackMode === false) {\n Config.set(\"collab.isFeedbackMode\", true);\n }\n return data;\n };\n\n return {\n createComment,\n editComment,\n deleteComment,\n resolveThread,\n fetchComments,\n createNewThread,\n deleteThread,\n };\n};\n"],"mappings":"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","names":[]}

package/dist/modern/visualBuilder/hooks/useCommentTextArea.cjs CHANGED Viewed

@@ -50,7 +50,11 @@ var initialState = {
 var useCommentTextArea = (userState, comment, onClose) => {
   const [state, setState] = (0, import_hooks.useState)(initialState);
   const [showSuggestions, setShowSuggestions] = (0, import_hooks.useState)(false);
-  const [cursorPosition, setCursorPosition] = (0, import_hooks.useState)({ top: 0, left: 0 });
+  const [cursorPosition, setCursorPosition] = (0, import_hooks.useState)({
+    top: 0,
+    left: 0,
+    showAbove: false
+  });
   const [searchTerm, setSearchTerm] = (0, import_hooks.useState)("");
   const [selectedIndex, setSelectedIndex] = (0, import_hooks.useState)(0);
   const [filteredUsers, setFilteredUsers] = (0, import_hooks.useState)([]);
@@ -192,17 +196,23 @@ var useCommentTextArea = (userState, comment, onClose) => {
         textarea.offsetWidth - 200
       );
       document.body.removeChild(span);
-      const currentLineY = currentLineNumber * lineHeight + paddingTop;
+      const scrollTop = textarea.scrollTop;
+      const currentLineY = currentLineNumber * lineHeight + paddingTop - scrollTop;
       const nextLineY = currentLineY + lineHeight;
       const viewportHeight = window.innerHeight;
       const suggestionsHeight = 160;
-      const spaceBelow = viewportHeight - (textarea.getBoundingClientRect().top + nextLineY);
+      const textareaRect = textarea.getBoundingClientRect();
+      const absoluteTop = textareaRect.top + nextLineY;
+      const spaceBelow = viewportHeight - absoluteTop;
       const showAbove = spaceBelow < suggestionsHeight;
-      const top = showAbove ? currentLineY - suggestionsHeight : nextLineY;
+      const top = showAbove ? currentLineY : nextLineY;
       return {
         top,
         left,
-        showAbove
+        showAbove,
+        absoluteTop,
+        scrollTop,
+        currentLineNumber
       };
     },
     []
@@ -317,6 +327,13 @@ var useCommentTextArea = (userState, comment, onClose) => {
       calculatePosition
     ]
   );
+  (0, import_hooks.useEffect)(() => {
+    itemRefs.current[selectedIndex]?.scrollIntoView({
+      behavior: "smooth",
+      block: "nearest",
+      inline: "nearest"
+    });
+  }, [selectedIndex]);
   const handleSubmit = (0, import_hooks.useCallback)(async () => {
     if (error.hasError) return;
     try {