@contentstack/live-preview-utils
Version:
Contentstack provides the Live Preview SDK to establish a communication channel between the various Contentstack SDKs and your website, transmitting live changes to the preview pane.
1 lines • 1.77 kB
Source Map (JSON)
{"version":3,"sources":["../../../../src/visualBuilder/eventManager/useScrollToField.ts"],"sourcesContent":["import { useEffect } from \"preact/compat\";\nimport visualBuilderPostMessage from \"../utils/visualBuilderPostMessage\";\nimport { VisualBuilderPostMessageEvents } from \"../utils/types/postMessage.types\";\n\n// Define the interface for the ScrollToField event data\nexport interface IScrollToFieldEventData {\n cslpData: {\n content_type_uid: string;\n entry_uid: string;\n locale: string;\n path: string;\n };\n}\n\nexport interface IScrollToFieldEvent {\n data: IScrollToFieldEventData;\n}\n\nconst handleScrollToField = (event: IScrollToFieldEvent) => {\n const { content_type_uid, entry_uid, locale, path } = event.data.cslpData;\n\n const cslpValue = `${content_type_uid}.${entry_uid}.${locale}.${path}`;\n\n // Query the element using the generated cslpValue\n const element = document.querySelector(`[data-cslp=\"${cslpValue}\"]`);\n\n if (element) {\n element.scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n }\n};\n\nexport const useScrollToField = () => {\n visualBuilderPostMessage?.on(\n VisualBuilderPostMessageEvents.SCROLL_TO_FIELD,\n handleScrollToField\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,sCAAqC;AACrC,yBAA+C;AAgB/C,IAAM,sBAAsB,CAAC,UAA+B;AACxD,QAAM,EAAE,kBAAkB,WAAW,QAAQ,KAAK,IAAI,MAAM,KAAK;AAEjE,QAAM,YAAY,GAAG,gBAAgB,IAAI,SAAS,IAAI,MAAM,IAAI,IAAI;AAGpE,QAAM,UAAU,SAAS,cAAc,eAAe,SAAS,IAAI;AAEnE,MAAI,SAAS;AACT,YAAQ,eAAe,EAAE,UAAU,UAAU,OAAO,SAAS,CAAC;AAAA,EAClE;AACJ;AAEO,IAAM,mBAAmB,MAAM;AA/BtC;AAgCI,wCAAAA,YAAA,mBAA0B;AAAA,IACtB,kDAA+B;AAAA,IAC/B;AAAA;AAER;","names":["visualBuilderPostMessage"]}