@dotcms/client 0.0.1-alpha.54 → 0.0.1-alpha.56

package/index.cjs.js

@@ -1525,6 +1525,131 @@ function fetchPageDataFromInsideUVE(pathname) {
     });
 }
 
+/**
+ * Transforms a GraphQL Page response to a Page Entity.
+ *
+ * @param {GraphQLPageResponse} graphQLPageResponse - The GraphQL Page response object.
+ * @returns {object|null} The transformed Page Entity or null if the page is not present.
+ *
+ * @example
+ * ```ts
+ * const pageEntity = graphqlToPageEntity(graphQLPageResponse);
+ * ```
+ */
+const graphqlToPageEntity = (graphQLPageResponse) => {
+    const { page } = graphQLPageResponse;
+    // If there is no page, return null
+    if (!page) {
+        return null;
+    }
+    const { layout, template, containers, urlContentMap, viewAs, site, _map, ...pageAsset } = page;
+    const data = (_map || {});
+    return {
+        layout,
+        template,
+        viewAs,
+        urlContentMap,
+        site,
+        page: {
+            ...data,
+            ...pageAsset
+        },
+        containers: parseContainers(containers)
+    };
+};
+/**
+ * Parses the containers from the GraphQL response.
+ *
+ * @param {Array<Record<string, unknown>>} [containers=[]] - The containers array from the GraphQL response.
+ * @returns {Record<string, unknown>} The parsed containers.
+ */
+const parseContainers = (containers = []) => {
+    return containers.reduce((acc, container) => {
+        const { path, identifier, containerStructures, containerContentlets, ...rest } = container;
+        const key = (path || identifier);
+        acc[key] = {
+            containerStructures,
+            container: {
+                path,
+                identifier,
+                ...rest
+            },
+            contentlets: parseContentletsToUuidMap(containerContentlets)
+        };
+        return acc;
+    }, {});
+};
+/**
+ * Parses the contentlets from the GraphQL response.
+ *
+ * @param {Array<Record<string, unknown>>} containerContentlets - The contentlets array from the GraphQL response.
+ * @returns {Record<string, Array<Record<string, unknown>>>} The parsed contentlets mapped by UUID.
+ */
+const parseContentletsToUuidMap = (containerContentlets = []) => {
+    return containerContentlets.reduce((acc, containerContentlet) => {
+        const { uuid, contentlets } = containerContentlet;
+        // TODO: This is a temporary solution, we need to find a better way to handle this.
+        acc[uuid] = contentlets.map(({ _map = {}, ...rest }) => {
+            return {
+                ..._map,
+                ...rest
+            };
+        });
+        return acc;
+    }, {});
+};
+
+exports.UVE_MODE = void 0;
+(function (UVE_MODE) {
+    UVE_MODE["EDIT"] = "edit";
+    UVE_MODE["PREVIEW"] = "preview";
+})(exports.UVE_MODE || (exports.UVE_MODE = {}));
+
+/**
+ * Generates the page request parameters to be used in the API call.
+ *
+ * @param {PageRequestParamsProps} PageRequestParamsProps - The properties for the page request.
+ * @returns {PageApiOptions} The options for the page API.
+ * @example
+ * ```ts
+ * const pageApiOptions = getPageRequestParams({ path: '/api/v1/page', params: queryParams });
+ * ```
+ */
+const getPageRequestParams = ({ path = '', params = {} }) => {
+    const copiedParams = params instanceof URLSearchParams ? Object.fromEntries(params.entries()) : { ...params };
+    const finalParams = {};
+    const dotMarketingPersonaId = copiedParams['com.dotmarketing.persona.id'] || '';
+    if (copiedParams['mode']) {
+        finalParams['mode'] = copiedParams['mode'];
+    }
+    if (copiedParams['language_id']) {
+        finalParams['language_id'] = copiedParams['language_id'];
+    }
+    if (copiedParams['variantName']) {
+        finalParams['variantName'] = copiedParams['variantName'];
+    }
+    if (copiedParams['personaId'] || dotMarketingPersonaId) {
+        finalParams['personaId'] = copiedParams['personaId'] || dotMarketingPersonaId;
+    }
+    if (copiedParams['publishDate']) {
+        finalParams['publishDate'] = copiedParams['publishDate'];
+    }
+    return {
+        path,
+        ...finalParams
+    };
+};
+/**
+ * Checks if the code is running inside an editor.
+ *
+ * @return {*}  {boolean}
+ */
+const isPreviewMode = () => {
+    const queryParams = new URLSearchParams(window.location.search);
+    const editorMode = queryParams.get('editorMode');
+    return editorMode === exports.UVE_MODE.PREVIEW;
+};
+
 /**
  * Updates the navigation in the editor.
  *
@@ -1598,15 +1723,21 @@ function reorderMenu(config) {
     });
 }
 /**
- * Checks if the code is running inside an editor.
+ * Checks if the code is running inside the DotCMS Universal Visual Editor (UVE).
  *
- * @returns {boolean} Returns true if the code is running inside an editor, otherwise false.
+ * The function checks three conditions:
+ * 1. If window is defined (for SSR environments)
+ * 2. If the page is not in preview mode
+ * 3. If the current window is embedded in a parent frame
+ *
+ * @returns {boolean} Returns true if running inside the UVE editor, false if running standalone or in preview mode
  * @example
  * ```ts
+ * // Check if code is running in editor before initializing editor-specific features
  * if (isInsideEditor()) {
- *     console.log('Running inside the editor');
+ *     initEditor(config);
  * } else {
- *     console.log('Running outside the editor');
+ *     initStandaloneMode();
  * }
  * ```
  */
@@ -1614,6 +1745,9 @@ function isInsideEditor() {
     if (typeof window === 'undefined') {
         return false;
     }
+    if (isPreviewMode()) {
+        return false;
+    }
     return window.parent !== window;
 }
 function initDotUVE() {
@@ -1922,112 +2056,6 @@ class DotCmsClient {
 }
 _DotCmsClient_config = new WeakMap(), _DotCmsClient_requestOptions = new WeakMap(), _DotCmsClient_listeners = new WeakMap();
 
-/**
- * Transforms a GraphQL Page response to a Page Entity.
- *
- * @param {GraphQLPageResponse} graphQLPageResponse - The GraphQL Page response object.
- * @returns {object|null} The transformed Page Entity or null if the page is not present.
- *
- * @example
- * ```ts
- * const pageEntity = graphqlToPageEntity(graphQLPageResponse);
- * ```
- */
-const graphqlToPageEntity = (graphQLPageResponse) => {
-    const { page } = graphQLPageResponse;
-    // If there is no page, return null
-    if (!page) {
-        return null;
-    }
-    const { layout, template, containers, urlContentMap, viewAs, site, _map, ...pageAsset } = page;
-    const data = (_map || {});
-    return {
-        layout,
-        template,
-        viewAs,
-        urlContentMap,
-        site,
-        page: {
-            ...data,
-            ...pageAsset
-        },
-        containers: parseContainers(containers)
-    };
-};
-/**
- * Parses the containers from the GraphQL response.
- *
- * @param {Array<Record<string, unknown>>} [containers=[]] - The containers array from the GraphQL response.
- * @returns {Record<string, unknown>} The parsed containers.
- */
-const parseContainers = (containers = []) => {
-    return containers.reduce((acc, container) => {
-        const { path, identifier, containerStructures, containerContentlets, ...rest } = container;
-        const key = (path || identifier);
-        acc[key] = {
-            containerStructures,
-            container: {
-                path,
-                identifier,
-                ...rest
-            },
-            contentlets: parseContentletsToUuidMap(containerContentlets)
-        };
-        return acc;
-    }, {});
-};
-/**
- * Parses the contentlets from the GraphQL response.
- *
- * @param {Array<Record<string, unknown>>} containerContentlets - The contentlets array from the GraphQL response.
- * @returns {Record<string, Array<Record<string, unknown>>>} The parsed contentlets mapped by UUID.
- */
-const parseContentletsToUuidMap = (containerContentlets = []) => {
-    return containerContentlets.reduce((acc, containerContentlet) => {
-        const { uuid, contentlets } = containerContentlet;
-        // TODO: This is a temporary solution, we need to find a better way to handle this.
-        acc[uuid] = contentlets.map(({ _map = {}, ...rest }) => {
-            return {
-                ..._map,
-                ...rest
-            };
-        });
-        return acc;
-    }, {});
-};
-
-/**
- * Generates the page request parameters to be used in the API call.
- *
- * @param {PageRequestParamsProps} PageRequestParamsProps - The properties for the page request.
- * @returns {PageApiOptions} The options for the page API.
- * @example
- * ```ts
- * const pageApiOptions = getPageRequestParams({ path: '/api/v1/page', params: queryParams });
- * ```
- */
-const getPageRequestParams = ({ path = '', params = {} }) => {
-    const copiedParams = params instanceof URLSearchParams ? Object.fromEntries(params.entries()) : { ...params };
-    const finalParams = {};
-    const dotMarketingPersonaId = copiedParams['com.dotmarketing.persona.id'] || '';
-    if (copiedParams['mode']) {
-        finalParams['mode'] = copiedParams['mode'];
-    }
-    if (copiedParams['language_id']) {
-        finalParams['language_id'] = copiedParams['language_id'];
-    }
-    if (copiedParams['variantName']) {
-        finalParams['variantName'] = copiedParams['variantName'];
-    }
-    if (copiedParams['personaId'] || dotMarketingPersonaId) {
-        finalParams['personaId'] = copiedParams['personaId'] || dotMarketingPersonaId;
-    }
-    return {
-        path,
-        ...finalParams
-    };
-};
-
 exports.DotCmsClient = DotCmsClient;
 exports.destroyEditor = destroyEditor;
 exports.editContentlet = editContentlet;

package/index.esm.js

@@ -1523,6 +1523,131 @@ function fetchPageDataFromInsideUVE(pathname) {
     });
 }
 
+/**
+ * Transforms a GraphQL Page response to a Page Entity.
+ *
+ * @param {GraphQLPageResponse} graphQLPageResponse - The GraphQL Page response object.
+ * @returns {object|null} The transformed Page Entity or null if the page is not present.
+ *
+ * @example
+ * ```ts
+ * const pageEntity = graphqlToPageEntity(graphQLPageResponse);
+ * ```
+ */
+const graphqlToPageEntity = (graphQLPageResponse) => {
+    const { page } = graphQLPageResponse;
+    // If there is no page, return null
+    if (!page) {
+        return null;
+    }
+    const { layout, template, containers, urlContentMap, viewAs, site, _map, ...pageAsset } = page;
+    const data = (_map || {});
+    return {
+        layout,
+        template,
+        viewAs,
+        urlContentMap,
+        site,
+        page: {
+            ...data,
+            ...pageAsset
+        },
+        containers: parseContainers(containers)
+    };
+};
+/**
+ * Parses the containers from the GraphQL response.
+ *
+ * @param {Array<Record<string, unknown>>} [containers=[]] - The containers array from the GraphQL response.
+ * @returns {Record<string, unknown>} The parsed containers.
+ */
+const parseContainers = (containers = []) => {
+    return containers.reduce((acc, container) => {
+        const { path, identifier, containerStructures, containerContentlets, ...rest } = container;
+        const key = (path || identifier);
+        acc[key] = {
+            containerStructures,
+            container: {
+                path,
+                identifier,
+                ...rest
+            },
+            contentlets: parseContentletsToUuidMap(containerContentlets)
+        };
+        return acc;
+    }, {});
+};
+/**
+ * Parses the contentlets from the GraphQL response.
+ *
+ * @param {Array<Record<string, unknown>>} containerContentlets - The contentlets array from the GraphQL response.
+ * @returns {Record<string, Array<Record<string, unknown>>>} The parsed contentlets mapped by UUID.
+ */
+const parseContentletsToUuidMap = (containerContentlets = []) => {
+    return containerContentlets.reduce((acc, containerContentlet) => {
+        const { uuid, contentlets } = containerContentlet;
+        // TODO: This is a temporary solution, we need to find a better way to handle this.
+        acc[uuid] = contentlets.map(({ _map = {}, ...rest }) => {
+            return {
+                ..._map,
+                ...rest
+            };
+        });
+        return acc;
+    }, {});
+};
+
+var UVE_MODE;
+(function (UVE_MODE) {
+    UVE_MODE["EDIT"] = "edit";
+    UVE_MODE["PREVIEW"] = "preview";
+})(UVE_MODE || (UVE_MODE = {}));
+
+/**
+ * Generates the page request parameters to be used in the API call.
+ *
+ * @param {PageRequestParamsProps} PageRequestParamsProps - The properties for the page request.
+ * @returns {PageApiOptions} The options for the page API.
+ * @example
+ * ```ts
+ * const pageApiOptions = getPageRequestParams({ path: '/api/v1/page', params: queryParams });
+ * ```
+ */
+const getPageRequestParams = ({ path = '', params = {} }) => {
+    const copiedParams = params instanceof URLSearchParams ? Object.fromEntries(params.entries()) : { ...params };
+    const finalParams = {};
+    const dotMarketingPersonaId = copiedParams['com.dotmarketing.persona.id'] || '';
+    if (copiedParams['mode']) {
+        finalParams['mode'] = copiedParams['mode'];
+    }
+    if (copiedParams['language_id']) {
+        finalParams['language_id'] = copiedParams['language_id'];
+    }
+    if (copiedParams['variantName']) {
+        finalParams['variantName'] = copiedParams['variantName'];
+    }
+    if (copiedParams['personaId'] || dotMarketingPersonaId) {
+        finalParams['personaId'] = copiedParams['personaId'] || dotMarketingPersonaId;
+    }
+    if (copiedParams['publishDate']) {
+        finalParams['publishDate'] = copiedParams['publishDate'];
+    }
+    return {
+        path,
+        ...finalParams
+    };
+};
+/**
+ * Checks if the code is running inside an editor.
+ *
+ * @return {*}  {boolean}
+ */
+const isPreviewMode = () => {
+    const queryParams = new URLSearchParams(window.location.search);
+    const editorMode = queryParams.get('editorMode');
+    return editorMode === UVE_MODE.PREVIEW;
+};
+
 /**
  * Updates the navigation in the editor.
  *
@@ -1596,15 +1721,21 @@ function reorderMenu(config) {
     });
 }
 /**
- * Checks if the code is running inside an editor.
+ * Checks if the code is running inside the DotCMS Universal Visual Editor (UVE).
  *
- * @returns {boolean} Returns true if the code is running inside an editor, otherwise false.
+ * The function checks three conditions:
+ * 1. If window is defined (for SSR environments)
+ * 2. If the page is not in preview mode
+ * 3. If the current window is embedded in a parent frame
+ *
+ * @returns {boolean} Returns true if running inside the UVE editor, false if running standalone or in preview mode
  * @example
  * ```ts
+ * // Check if code is running in editor before initializing editor-specific features
  * if (isInsideEditor()) {
- *     console.log('Running inside the editor');
+ *     initEditor(config);
  * } else {
- *     console.log('Running outside the editor');
+ *     initStandaloneMode();
  * }
  * ```
  */
@@ -1612,6 +1743,9 @@ function isInsideEditor() {
     if (typeof window === 'undefined') {
         return false;
     }
+    if (isPreviewMode()) {
+        return false;
+    }
     return window.parent !== window;
 }
 function initDotUVE() {
@@ -1920,110 +2054,4 @@ class DotCmsClient {
 }
 _DotCmsClient_config = new WeakMap(), _DotCmsClient_requestOptions = new WeakMap(), _DotCmsClient_listeners = new WeakMap();
 
-/**
- * Transforms a GraphQL Page response to a Page Entity.
- *
- * @param {GraphQLPageResponse} graphQLPageResponse - The GraphQL Page response object.
- * @returns {object|null} The transformed Page Entity or null if the page is not present.
- *
- * @example
- * ```ts
- * const pageEntity = graphqlToPageEntity(graphQLPageResponse);
- * ```
- */
-const graphqlToPageEntity = (graphQLPageResponse) => {
-    const { page } = graphQLPageResponse;
-    // If there is no page, return null
-    if (!page) {
-        return null;
-    }
-    const { layout, template, containers, urlContentMap, viewAs, site, _map, ...pageAsset } = page;
-    const data = (_map || {});
-    return {
-        layout,
-        template,
-        viewAs,
-        urlContentMap,
-        site,
-        page: {
-            ...data,
-            ...pageAsset
-        },
-        containers: parseContainers(containers)
-    };
-};
-/**
- * Parses the containers from the GraphQL response.
- *
- * @param {Array<Record<string, unknown>>} [containers=[]] - The containers array from the GraphQL response.
- * @returns {Record<string, unknown>} The parsed containers.
- */
-const parseContainers = (containers = []) => {
-    return containers.reduce((acc, container) => {
-        const { path, identifier, containerStructures, containerContentlets, ...rest } = container;
-        const key = (path || identifier);
-        acc[key] = {
-            containerStructures,
-            container: {
-                path,
-                identifier,
-                ...rest
-            },
-            contentlets: parseContentletsToUuidMap(containerContentlets)
-        };
-        return acc;
-    }, {});
-};
-/**
- * Parses the contentlets from the GraphQL response.
- *
- * @param {Array<Record<string, unknown>>} containerContentlets - The contentlets array from the GraphQL response.
- * @returns {Record<string, Array<Record<string, unknown>>>} The parsed contentlets mapped by UUID.
- */
-const parseContentletsToUuidMap = (containerContentlets = []) => {
-    return containerContentlets.reduce((acc, containerContentlet) => {
-        const { uuid, contentlets } = containerContentlet;
-        // TODO: This is a temporary solution, we need to find a better way to handle this.
-        acc[uuid] = contentlets.map(({ _map = {}, ...rest }) => {
-            return {
-                ..._map,
-                ...rest
-            };
-        });
-        return acc;
-    }, {});
-};
-
-/**
- * Generates the page request parameters to be used in the API call.
- *
- * @param {PageRequestParamsProps} PageRequestParamsProps - The properties for the page request.
- * @returns {PageApiOptions} The options for the page API.
- * @example
- * ```ts
- * const pageApiOptions = getPageRequestParams({ path: '/api/v1/page', params: queryParams });
- * ```
- */
-const getPageRequestParams = ({ path = '', params = {} }) => {
-    const copiedParams = params instanceof URLSearchParams ? Object.fromEntries(params.entries()) : { ...params };
-    const finalParams = {};
-    const dotMarketingPersonaId = copiedParams['com.dotmarketing.persona.id'] || '';
-    if (copiedParams['mode']) {
-        finalParams['mode'] = copiedParams['mode'];
-    }
-    if (copiedParams['language_id']) {
-        finalParams['language_id'] = copiedParams['language_id'];
-    }
-    if (copiedParams['variantName']) {
-        finalParams['variantName'] = copiedParams['variantName'];
-    }
-    if (copiedParams['personaId'] || dotMarketingPersonaId) {
-        finalParams['personaId'] = copiedParams['personaId'] || dotMarketingPersonaId;
-    }
-    return {
-        path,
-        ...finalParams
-    };
-};
-
-export { CLIENT_ACTIONS, DotCmsClient, NOTIFY_CLIENT, destroyEditor, editContentlet, getPageRequestParams, graphqlToPageEntity, initEditor, initInlineEditing, isInsideEditor, postMessageToEditor, reorderMenu, updateNavigation };
+export { CLIENT_ACTIONS, DotCmsClient, NOTIFY_CLIENT, UVE_MODE, destroyEditor, editContentlet, getPageRequestParams, graphqlToPageEntity, initEditor, initInlineEditing, isInsideEditor, postMessageToEditor, reorderMenu, updateNavigation };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dotcms/client",
-  "version": "0.0.1-alpha.54",
+  "version": "0.0.1-alpha.56",
   "description": "Official JavaScript library for interacting with DotCMS REST APIs.",
   "repository": {
     "type": "git",

package/src/index.d.ts

@@ -1,8 +1,8 @@
 import { ClientConfig, DotCmsClient } from './lib/client/sdk-js-client';
 import { CLIENT_ACTIONS, postMessageToEditor } from './lib/editor/models/client.model';
-import { CustomClientParams, DotCMSPageEditorConfig, EditorConfig } from './lib/editor/models/editor.model';
+import { CustomClientParams, DotCMSPageEditorConfig, EditorConfig, UVE_MODE } from './lib/editor/models/editor.model';
 import { InlineEditorData, INLINE_EDITING_EVENT_KEY, InlineEditEventData } from './lib/editor/models/inline-event.model';
 import { NOTIFY_CLIENT } from './lib/editor/models/listeners.model';
 import { destroyEditor, editContentlet, reorderMenu, initEditor, isInsideEditor, updateNavigation, initInlineEditing } from './lib/editor/sdk-editor';
 import { getPageRequestParams, graphqlToPageEntity } from './lib/utils';
-export { graphqlToPageEntity, getPageRequestParams, isInsideEditor, editContentlet, reorderMenu, DotCmsClient, DotCMSPageEditorConfig, CLIENT_ACTIONS, NOTIFY_CLIENT, CustomClientParams, postMessageToEditor, EditorConfig, initEditor, updateNavigation, destroyEditor, ClientConfig, initInlineEditing, InlineEditEventData, InlineEditorData, INLINE_EDITING_EVENT_KEY };
+export { graphqlToPageEntity, getPageRequestParams, isInsideEditor, editContentlet, reorderMenu, DotCmsClient, DotCMSPageEditorConfig, CLIENT_ACTIONS, NOTIFY_CLIENT, CustomClientParams, postMessageToEditor, EditorConfig, initEditor, updateNavigation, destroyEditor, ClientConfig, initInlineEditing, InlineEditEventData, InlineEditorData, INLINE_EDITING_EVENT_KEY, UVE_MODE };

package/src/lib/editor/models/editor.model.d.ts

@@ -60,3 +60,7 @@ export interface ReorderMenuConfig {
      */
     depth: number;
 }
+export declare enum UVE_MODE {
+    EDIT = "edit",
+    PREVIEW = "preview"
+}

package/src/lib/editor/sdk-editor.d.ts

@@ -38,15 +38,21 @@ export declare function editContentlet<T>(contentlet: Contentlet<T>): void;
 export declare function initInlineEditing(type: INLINE_EDITING_EVENT_KEY, data?: InlineEditEventData): void;
 export declare function reorderMenu(config?: ReorderMenuConfig): void;
 /**
- * Checks if the code is running inside an editor.
+ * Checks if the code is running inside the DotCMS Universal Visual Editor (UVE).
  *
- * @returns {boolean} Returns true if the code is running inside an editor, otherwise false.
+ * The function checks three conditions:
+ * 1. If window is defined (for SSR environments)
+ * 2. If the page is not in preview mode
+ * 3. If the current window is embedded in a parent frame
+ *
+ * @returns {boolean} Returns true if running inside the UVE editor, false if running standalone or in preview mode
  * @example
  * ```ts
+ * // Check if code is running in editor before initializing editor-specific features
  * if (isInsideEditor()) {
- *     console.log('Running inside the editor');
+ *     initEditor(config);
  * } else {
- *     console.log('Running outside the editor');
+ *     initStandaloneMode();
  * }
  * ```
  */

package/src/lib/utils/page/common-utils.d.ts

@@ -31,3 +31,9 @@ export interface PageRequestParamsProps {
  * ```
  */
 export declare const getPageRequestParams: ({ path, params }: PageRequestParamsProps) => PageApiOptions;
+/**
+ * Checks if the code is running inside an editor.
+ *
+ * @return {*}  {boolean}
+ */
+export declare const isPreviewMode: () => boolean;