@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 • 12.6 kB
Source Map (JSON)
{"version":3,"sources":["../../../src/preview/contentstack-live-preview-HOC.ts"],"sourcesContent":["import { cloneDeep, isEmpty, pick } from \"lodash-es\";\nimport { v4 as uuidv4 } from \"uuid\";\nimport { getUserInitData } from \"../configManager/config.default\";\nimport Config, { updateConfigFromUrl } from \"../configManager/configManager\";\nimport LivePreview from \"../livePreview/live-preview\";\nimport { handlePageTraversal } from \"../livePreview/onPageTraversal\";\nimport { removeFromOnChangeSubscribers } from \"../livePreview/removeFromOnChangeSubscribers\";\nimport {\n OnEntryChangeCallback,\n OnEntryChangeCallbackSubscribers,\n OnEntryChangeCallbackUID,\n OnEntryChangeConfig,\n OnEntryChangeUnsubscribeParameters,\n} from \"../livePreview/types/onEntryChangeCallback.type\";\nimport { PublicLogger } from \"../logger/logger\";\nimport { handleWebCompare } from \"../timeline/compare/compare\";\nimport type { IExportedConfig, IInitData } from \"../types/types\";\nimport { VisualBuilder } from \"../visualBuilder\";\n\nclass ContentstackLivePreview {\n private static previewConstructors:\n | {\n livePreview: LivePreview;\n visualBuilder: VisualBuilder;\n }\n | Record<string, never> = {};\n\n /**\n * The subscribers for the onEntryChange event. We store them here when the SDK is not initialized.\n */\n private static onEntryChangeCallbacks: OnEntryChangeCallbackSubscribers =\n {};\n\n /**\n * Initializes the Live Preview SDK with the provided user configuration.\n * If the SDK is already initialized, subsequent calls to this method will return the existing SDK instance.\n * @param userConfig - The user configuration to initialize the SDK with. See {@link https://github.com/contentstack/live-preview-sdk/blob/main/docs/live-preview-configs.md#initconfig-iconfig|Live preview User config} for more details.\n * @returns A promise that resolves to the constructors of the Live Preview SDK.\n */\n static init(\n userConfig: Partial<IInitData> = getUserInitData()\n ): Promise<typeof ContentstackLivePreview.previewConstructors> {\n if (typeof window === \"undefined\") {\n PublicLogger.warn(\"The SDK is not initialized in the browser.\");\n return Promise.resolve(ContentstackLivePreview.previewConstructors);\n }\n\n // handle user config\n Config.replace(userConfig);\n updateConfigFromUrl();\n\n if (ContentstackLivePreview.isInitialized()) {\n PublicLogger.warn(\n \"You have already initialized the Live Preview SDK. So, any subsequent initialization returns the existing SDK instance.\"\n );\n return Promise.resolve(ContentstackLivePreview.previewConstructors);\n } else {\n return ContentstackLivePreview.initializePreview();\n }\n }\n\n /**\n * It is the live preview hash.\n * This hash could be used when data is fetched manually.\n */\n static get hash(): string {\n if (!ContentstackLivePreview.isInitialized()) {\n updateConfigFromUrl(); // check if we could extract from the URL\n }\n return Config.get().hash;\n }\n\n static get config(): IExportedConfig {\n if (!ContentstackLivePreview.isInitialized()) {\n updateConfigFromUrl(); // check if we could extract from the URL\n }\n const config = Config.get();\n const clonedConfig = cloneDeep(config);\n const configToShare = pick(clonedConfig, [\n 'ssr',\n 'enable',\n 'cleanCslpOnProduction',\n 'stackDetails',\n 'clientUrlParams',\n 'windowType',\n 'hash',\n 'editButton',\n 'mode',\n ]);\n return configToShare;\n }\n\n private static isInitialized(): boolean {\n return !isEmpty(ContentstackLivePreview.previewConstructors);\n }\n\n private static initializePreview() {\n ContentstackLivePreview.previewConstructors = {\n livePreview: new LivePreview(),\n visualBuilder: new VisualBuilder(),\n };\n\n // set up onEntryChange callbacks added when the SDK was not initialized\n const livePreview =\n ContentstackLivePreview.previewConstructors.livePreview;\n Object.entries(ContentstackLivePreview.onEntryChangeCallbacks).forEach(\n ([callbackUid, callback]) => {\n livePreview.subscribeToOnEntryChange(callback, callbackUid);\n }\n );\n\n ContentstackLivePreview.onEntryChangeCallbacks = {};\n\n handlePageTraversal();\n handleWebCompare();\n\n return Promise.resolve(ContentstackLivePreview.previewConstructors);\n }\n\n /**\n * Registers a callback function to be called when an entry changes.\n * @param onChangeCallback The callback function to be called when an entry changes.\n * @param config Optional configuration for the callback.\n * @param config.skipInitialRender If true, the callback will not be called when it is first registered.\n * @returns A unique identifier for the registered callback.\n *\n * @example\n * ```js\n * const callbackUid = ContentstackLivePreview.onEntryChange(() => {\n * console.log(\"Entry changed\");\n * });\n *\n * // Unsubscribe the callback\n * ContentstackLivePreview.unsubscribeOnEntryChange(callbackUid);\n * ```\n */\n static onEntryChange(\n onChangeCallback: OnEntryChangeCallback,\n config: OnEntryChangeConfig = {}\n ): OnEntryChangeCallbackUID {\n const { skipInitialRender = false } = config;\n\n const callbackUid = uuidv4();\n\n if (ContentstackLivePreview.isInitialized()) {\n ContentstackLivePreview.previewConstructors.livePreview.subscribeToOnEntryChange(\n onChangeCallback,\n callbackUid\n );\n } else {\n ContentstackLivePreview.onEntryChangeCallbacks[callbackUid] =\n onChangeCallback;\n }\n\n const searchParams =\n typeof window !== \"undefined\"\n ? new URLSearchParams(window.location.search)\n : null;\n const hasLivePreviewHash =\n searchParams && searchParams.has(\"live_preview\");\n const isBuilder = searchParams && searchParams.has(\"builder\");\n const shouldCallCallback = hasLivePreviewHash && isBuilder;\n // calling onChangeCallback when live_preview search parameter\n // is present because we don't send the initial client-data-send\n // message in visual builder\n if (!skipInitialRender || shouldCallCallback) {\n onChangeCallback();\n }\n\n return callbackUid;\n }\n\n /**\n * Registers a callback function to be called when there is a change in the entry being edited in live preview mode. The difference between this and `onEntryChange` is that this callback will not be called when it is first registered.\n * @param onChangeCallback The callback function to be called when there is a change in the entry.\n * @returns A unique identifier for the registered callback.\n *\n * @example\n * ```js\n * const callbackUid = ContentstackLivePreview.onLiveEdit(() => {\n * console.log(\"Entry changed\");\n * });\n *\n * // Unsubscribe the callback\n * ContentstackLivePreview.unsubscribeOnEntryChange(callbackUid);\n * ```\n *\n */\n static onLiveEdit(\n onChangeCallback: OnEntryChangeCallback\n ): OnEntryChangeCallbackUID {\n return ContentstackLivePreview.onEntryChange(onChangeCallback, {\n skipInitialRender: true,\n });\n }\n\n /**\n * Unsubscribes from the entry change event.\n * @param callback - The callback function to be unsubscribed.\n *\n * @example\n * ```js\n * // unsubscribing using the Callback UID\n * const callbackUid = ContentstackLivePreview.onEntryChange(() => {\n * console.log(\"Entry changed\");\n * });\n *\n * // Unsubscribe the callback\n * ContentstackLivePreview.unsubscribeOnEntryChange(callbackUid);\n * ```\n *\n * @example\n * ```js\n * // unsubscribing using the callback function\n * const callback = () => {console.log(\"Entry changed\")};\n * ContentstackLivePreview.onEntryChange(callback);\n *\n * // Unsubscribe the callback\n * ContentstackLivePreview.unsubscribeOnEntryChange(callback);\n * ```\n *\n * @example\n * ```js\n * // The same is applicable to onLiveEdit\n * const callbackUid = ContentstackLivePreview.onLiveEdit(() => {\n * console.log(\"Entry changed\");\n * });\n *\n * // Unsubscribe the callback\n * ContentstackLivePreview.unsubscribeOnEntryChange(callbackUid);\n * ```\n *\n *\n */\n static unsubscribeOnEntryChange(\n callback: OnEntryChangeUnsubscribeParameters\n ): void {\n if (!ContentstackLivePreview.isInitialized()) {\n removeFromOnChangeSubscribers(\n ContentstackLivePreview.onEntryChangeCallbacks,\n callback\n );\n return;\n }\n ContentstackLivePreview.previewConstructors.livePreview.unsubscribeOnEntryChange(\n callback\n );\n }\n\n /**\n * Retrieves the version of the SDK.\n * @returns The version of the SDK as a string.\n */\n static getSdkVersion(): string {\n return process?.env?.PACKAGE_VERSION!;\n }\n}\n\nexport default ContentstackLivePreview;"],"mappings":"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","names":["Config","LivePreview","uuidv4"]}