@dotcms/client 0.0.1-alpha.40 → 0.0.1-alpha.41

package/src/lib/client/{sdk-js-client.ts → sdk-js-client.d.ts}

@@ -1,11 +1,5 @@
 import { Content } from './content/content-api';
-import { ErrorMessages } from './models';
-import { DotcmsClientListener } from './models/types';
-
-import { isInsideEditor } from '../editor/sdk-editor';
-
 export type ClientOptions = Omit<RequestInit, 'body' | 'method'>;
-
 export interface ClientConfig {
     /**
      * The URL of the dotCMS instance.
@@ -44,7 +38,6 @@ export interface ClientConfig {
      */
     requestOptions?: ClientOptions;
 }
-
 export type PageApiOptions = {
     /**
      * The path of the page you want to retrieve.
@@ -97,7 +90,6 @@ export type PageApiOptions = {
      */
     depth?: number;
 };
-
 type NavApiOptions = {
     /**
      * The root path to begin traversing the folder tree.
@@ -131,15 +123,6 @@ type NavApiOptions = {
      */
     languageId?: number;
 };
-
-function getHostURL(url: string): URL | undefined {
-    try {
-        return new URL(url);
-    } catch (error) {
-        return undefined;
-    }
-}
-
 /**
  * `DotCmsClient` is a TypeScript class that provides methods to interact with the DotCMS REST API.
  * DotCMS is a hybrid-headless CMS and digital experience platform.
@@ -186,49 +169,13 @@ function getHostURL(url: string): URL | undefined {
  * client.editor.on('changes', (payload) => console.log('Changes detected:', payload));
  * ```
  */
-export class DotCmsClient {
+export declare class DotCmsClient {
+    #private;
     static instance: DotCmsClient;
-    #config: ClientConfig;
-    #requestOptions!: ClientOptions;
-    #listeners: DotcmsClientListener[] = [];
-
     dotcmsUrl?: string;
     content: Content;
-
-    constructor(
-        config: ClientConfig = { dotcmsUrl: '', authToken: '', requestOptions: {}, siteId: '' }
-    ) {
-        if (!config.dotcmsUrl) {
-            throw new Error("Invalid configuration - 'dotcmsUrl' is required");
-        }
-
-        this.dotcmsUrl = getHostURL(config.dotcmsUrl)?.origin;
-
-        if (!this.dotcmsUrl) {
-            throw new Error("Invalid configuration - 'dotcmsUrl' must be a valid URL");
-        }
-
-        if (!config.authToken) {
-            throw new Error("Invalid configuration - 'authToken' is required");
-        }
-
-        this.#config = {
-            ...config,
-            dotcmsUrl: this.dotcmsUrl
-        };
-
-        this.#requestOptions = {
-            ...this.#config.requestOptions,
-            headers: {
-                Authorization: `Bearer ${this.#config.authToken}`,
-                ...this.#config.requestOptions?.headers
-            }
-        };
-
-        this.content = new Content(this.#requestOptions, this.#config.dotcmsUrl);
-    }
-
-    page = {
+    constructor(config?: ClientConfig);
+    page: {
         /**
          * `page.get` is an asynchronous method of the `DotCmsClient` class that retrieves all the elements of any Page in your dotCMS system in JSON format.
          * It takes a `PageApiOptions` object as a parameter and returns a Promise that resolves to the response from the DotCMS API.
@@ -247,51 +194,9 @@ export class DotCmsClient {
          * client.page.get({ path: '/about-us' }).then(response => console.log(response));
          * ```
          */
-        get: async (options: PageApiOptions): Promise<unknown> => {
-            this.validatePageOptions(options);
-
-            const queryParamsObj: Record<string, string> = {};
-            for (const [key, value] of Object.entries(options)) {
-                if (value === undefined || key === 'path' || key === 'siteId') continue;
-
-                if (key === 'personaId') {
-                    queryParamsObj['com.dotmarketing.persona.id'] = String(value);
-                } else if (key === 'mode' && value) {
-                    queryParamsObj['mode'] = String(value);
-                } else {
-                    queryParamsObj[key] = String(value);
-                }
-            }
-
-            const queryHostId = options.siteId ?? this.#config.siteId ?? '';
-
-            if (queryHostId) {
-                queryParamsObj['host_id'] = queryHostId;
-            }
-
-            const queryParams = new URLSearchParams(queryParamsObj).toString();
-
-            const formattedPath = options.path.startsWith('/') ? options.path : `/${options.path}`;
-            const url = `${this.#config.dotcmsUrl}/api/v1/page/json${formattedPath}${
-                queryParams ? `?${queryParams}` : ''
-            }`;
-
-            const response = await fetch(url, this.#requestOptions);
-            if (!response.ok) {
-                const error = {
-                    status: response.status,
-                    message: ErrorMessages[response.status] || response.statusText
-                };
-
-                console.error(error);
-                throw error;
-            }
-
-            return response.json().then((data) => data.entity);
-        }
+        get: (options: PageApiOptions) => Promise<unknown>;
     };
-
-    editor = {
+    editor: {
         /**
          * `editor.on` is an asynchronous method of the `DotCmsClient` class that allows you to react to actions issued by the UVE.
          *
@@ -305,22 +210,7 @@ export class DotCmsClient {
          * });
          * ```
          */
-        on: (action: string, callbackFn: (payload: unknown) => void) => {
-            if (!isInsideEditor()) {
-                return;
-            }
-
-            if (action === 'changes') {
-                const messageCallback = (event: MessageEvent) => {
-                    if (event.data.name === 'SET_PAGE_DATA') {
-                        callbackFn(event.data.payload);
-                    }
-                };
-
-                window.addEventListener('message', messageCallback);
-                this.#listeners.push({ event: 'message', callback: messageCallback, action });
-            }
-        },
+        on: (action: string, callbackFn: (payload: unknown) => void) => void;
         /**
          * `editor.off` is a synchronous method of the `DotCmsClient` class that allows you to stop listening and reacting to an action issued by UVE.
          *
@@ -331,19 +221,9 @@ export class DotCmsClient {
          * client.editor.off('changes');
          * ```
          */
-        off: (action: string) => {
-            const listenerIndex = this.#listeners.findIndex(
-                (listener) => listener.action === action
-            );
-            if (listenerIndex !== -1) {
-                const listener = this.#listeners[listenerIndex];
-                window.removeEventListener(listener.event, listener.callback);
-                this.#listeners.splice(listenerIndex, 1);
-            }
-        }
+        off: (action: string) => void;
     };
-
-    nav = {
+    nav: {
         /**
          * `nav.get` is an asynchronous method of the `DotCmsClient` class that retrieves information about the dotCMS file and folder tree.
          * It takes a `NavApiOptions` object as a parameter (with default values) and returns a Promise that resolves to the response from the DotCMS API.
@@ -360,34 +240,8 @@ export class DotCmsClient {
          * client.nav.get({ path: '/about-us', depth: 2 }).then(response => console.log(response));
          * ```
          */
-        get: async (
-            options: NavApiOptions = { depth: 0, path: '/', languageId: 1 }
-        ): Promise<unknown> => {
-            this.validateNavOptions(options);
-
-            // Extract the 'path' from the options and prepare the rest as query parameters
-            const { path, ...queryParamsOptions } = options;
-            const queryParamsObj: Record<string, string> = {};
-            Object.entries(queryParamsOptions).forEach(([key, value]) => {
-                if (value !== undefined) {
-                    queryParamsObj[key] = String(value);
-                }
-            });
-
-            const queryParams = new URLSearchParams(queryParamsObj).toString();
-
-            // Format the URL correctly depending on the 'path' value
-            const formattedPath = path === '/' ? '/' : `/${path}`;
-            const url = `${this.#config.dotcmsUrl}/api/v1/nav${formattedPath}${
-                queryParams ? `?${queryParams}` : ''
-            }`;
-
-            const response = await fetch(url, this.#requestOptions);
-
-            return response.json();
-        }
+        get: (options?: NavApiOptions) => Promise<unknown>;
     };
-
     /**
      * Initializes the DotCmsClient instance with the provided configuration.
      * If an instance already exists, it returns the existing instance.
@@ -399,44 +253,24 @@ export class DotCmsClient {
      * const client = DotCmsClient.init({ dotcmsUrl: 'https://demo.dotcms.com', authToken: 'your-auth-token' });
      * ```
      */
-    static init(config: ClientConfig): DotCmsClient {
-        if (this.instance) {
-            console.warn(
-                'DotCmsClient has already been initialized. Please use the instance to interact with the DotCMS API.'
-            );
-        }
-
-        return this.instance ?? (this.instance = new DotCmsClient(config));
-    }
-
+    static init(config: ClientConfig): DotCmsClient;
     /**
      * Retrieves the DotCMS URL from the instance configuration.
      *
      * @returns {string} - The DotCMS URL.
      */
-    static get dotcmsUrl(): string {
-        return (this.instance && this.instance.#config.dotcmsUrl) || '';
-    }
-
+    static get dotcmsUrl(): string;
     /**
      * Throws an error if the path is not valid.
      *
      * @returns {string} - The authentication token.
      */
-    private validatePageOptions(options: PageApiOptions): void {
-        if (!options.path) {
-            throw new Error("The 'path' parameter is required for the Page API");
-        }
-    }
-
+    private validatePageOptions;
     /**
      * Throws an error if the path is not valid.
      *
      *  @returns {string} - The authentication token.
      */
-    private validateNavOptions(options: NavApiOptions): void {
-        if (!options.path) {
-            throw new Error("The 'path' parameter is required for the Nav API");
-        }
-    }
+    private validateNavOptions;
 }
+export {};

package/src/lib/editor/listeners/listeners.d.ts

@@ -0,0 +1,50 @@
+import { DotCMSPageEditorSubscription } from '../models/listeners.model';
+declare global {
+    interface Window {
+        lastScrollYPosition: number;
+    }
+}
+/**
+ * Represents an array of DotCMSPageEditorSubscription objects.
+ * Used to store the subscriptions for the editor and unsubscribe later.
+ */
+export declare const subscriptions: DotCMSPageEditorSubscription[];
+/**
+ * Listens for editor messages and performs corresponding actions based on the received message.
+ *
+ * @private
+ * @memberof DotCMSPageEditor
+ */
+export declare function listenEditorMessages(): void;
+/**
+ * Listens for pointer move events and extracts information about the hovered contentlet.
+ *
+ * @private
+ * @memberof DotCMSPageEditor
+ */
+export declare function listenHoveredContentlet(): void;
+/**
+ * Attaches a scroll event listener to the window
+ * and sends a message to the editor when the window is scrolled.
+ *
+ * @private
+ * @memberof DotCMSPageEditor
+ */
+export declare function scrollHandler(): void;
+/**
+ * Restores the scroll position of the window when an iframe is loaded.
+ * Only used in VTL Pages.
+ * @export
+ * @example
+ * ```ts
+ * preserveScrollOnIframe();
+ * ```
+ */
+export declare function preserveScrollOnIframe(): void;
+/**
+ * Sends a message to the editor to get the page data.
+ * @param {string} pathname - The pathname of the page.
+ * @private
+ * @memberof DotCMSPageEditor
+ */
+export declare function fetchPageDataFromInsideUVE(pathname: string): void;

package/src/lib/editor/models/{client.model.ts → client.model.d.ts}

@@ -4,62 +4,61 @@
  * @export
  * @enum {number}
  */
-export enum CUSTOMER_ACTIONS {
+export declare enum CUSTOMER_ACTIONS {
     /**
      * Tell the dotcms editor that page change
      */
-    NAVIGATION_UPDATE = 'set-url',
+    NAVIGATION_UPDATE = "set-url",
     /**
      * Send the element position of the rows, columnsm containers and contentlets
      */
-    SET_BOUNDS = 'set-bounds',
+    SET_BOUNDS = "set-bounds",
     /**
      * Send the information of the hovered contentlet
      */
-    SET_CONTENTLET = 'set-contentlet',
+    SET_CONTENTLET = "set-contentlet",
     /**
      * Tell the editor that the page is being scrolled
      */
-    IFRAME_SCROLL = 'scroll',
+    IFRAME_SCROLL = "scroll",
     /**
      * Tell the editor that the page has stopped scrolling
      */
-    IFRAME_SCROLL_END = 'scroll-end',
+    IFRAME_SCROLL_END = "scroll-end",
     /**
      * Ping the editor to see if the page is inside the editor
      */
-    PING_EDITOR = 'ping-editor',
+    PING_EDITOR = "ping-editor",
     /**
      * Tell the editor to init the inline editing editor.
      */
-    INIT_INLINE_EDITING = 'init-inline-editing',
+    INIT_INLINE_EDITING = "init-inline-editing",
     /**
      * Tell the editor to open the Copy-contentlet dialog
      * To copy a content and then edit it inline.
      */
-    COPY_CONTENTLET_INLINE_EDITING = 'copy-contentlet-inline-editing',
+    COPY_CONTENTLET_INLINE_EDITING = "copy-contentlet-inline-editing",
     /**
      * Tell the editor to save inline edited contentlet
      */
-    UPDATE_CONTENTLET_INLINE_EDITING = 'update-contentlet-inline-editing',
+    UPDATE_CONTENTLET_INLINE_EDITING = "update-contentlet-inline-editing",
     /**
      * Tell the editor to trigger a menu reorder
      */
-    REORDER_MENU = 'reorder-menu',
+    REORDER_MENU = "reorder-menu",
     /**
      * Tell the editor to send the page info to iframe
      */
-    GET_PAGE_DATA = 'get-page-data',
+    GET_PAGE_DATA = "get-page-data",
     /**
      * Tell the editor an user send a graphql query
      */
-    CLIENT_READY = 'client-ready',
+    CLIENT_READY = "client-ready",
     /**
      * Tell the editor to do nothing
      */
-    NOOP = 'noop'
+    NOOP = "noop"
 }
-
 /**
  * Post message props
  *
@@ -71,7 +70,6 @@ type PostMessageProps<T> = {
     action: CUSTOMER_ACTIONS;
     payload?: T;
 };
-
 /**
  * Post message to dotcms page editor
  *
@@ -79,6 +77,5 @@ type PostMessageProps<T> = {
  * @template T
  * @param {PostMessageProps<T>} message
  */
-export function postMessageToEditor<T = unknown>(message: PostMessageProps<T>) {
-    window.parent.postMessage(message, '*');
-}
+export declare function postMessageToEditor<T = unknown>(message: PostMessageProps<T>): void;
+export {};

package/src/lib/editor/models/{editor.model.ts → editor.model.d.ts}

@@ -4,19 +4,15 @@
 export type CustomClientParams = {
     depth: string;
 };
-
 /**
  * @description Union type for fetch configurations.
  * @typedef {GraphQLFetchConfig | PageAPIFetchConfig} DotCMSFetchConfig
  */
-export type EditorConfig =
-    | {
-          params: CustomClientParams;
-      }
-    | {
-          query: string;
-      };
-
+export type EditorConfig = {
+    params: CustomClientParams;
+} | {
+    query: string;
+};
 /**
  * Represents the configuration options for the DotCMS page editor.
  * @export

package/src/lib/editor/models/{listeners.model.ts → listeners.model.d.ts}

@@ -4,28 +4,26 @@
  * @export
  * @enum {number}
  */
-export enum NOTIFY_CUSTOMER {
+export declare enum NOTIFY_CUSTOMER {
     /**
      * Request to page to reload
      */
-    EMA_RELOAD_PAGE = 'ema-reload-page',
+    EMA_RELOAD_PAGE = "ema-reload-page",
     /**
      * Request the bounds for the elements
      */
-    EMA_REQUEST_BOUNDS = 'ema-request-bounds',
+    EMA_REQUEST_BOUNDS = "ema-request-bounds",
     /**
      * Received pong from the editor
      */
-    EMA_EDITOR_PONG = 'ema-editor-pong',
+    EMA_EDITOR_PONG = "ema-editor-pong",
     /**
      * Received scroll event trigger from the editor
      */
-    EMA_SCROLL_INSIDE_IFRAME = 'scroll-inside-iframe'
+    EMA_SCROLL_INSIDE_IFRAME = "scroll-inside-iframe"
 }
-
 type ListenerCallbackMessage = (event: MessageEvent) => void;
 type ListenerCallbackPointer = (event: PointerEvent) => void;
-
 /**
  * Listener for the dotcms editor
  *
@@ -36,7 +34,6 @@ interface DotCMSPageEditorListener {
     event: string;
     callback: ListenerCallbackMessage | ListenerCallbackPointer;
 }
-
 /**
  * Observer for the dotcms editor
  *
@@ -46,5 +43,5 @@ interface DotCMSPageEditorObserver {
     type: 'observer';
     observer: MutationObserver;
 }
-
 export type DotCMSPageEditorSubscription = DotCMSPageEditorListener | DotCMSPageEditorObserver;
+export {};

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

@@ -0,0 +1,6 @@
+declare global {
+    interface Window {
+        lastScrollYPosition: number;
+    }
+}
+export {};

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

@@ -0,0 +1,54 @@
+import { DotCMSPageEditorConfig } from './models/editor.model';
+/**
+ * Updates the navigation in the editor.
+ *
+ * @param {string} pathname - The pathname to update the navigation with.
+ * @memberof DotCMSPageEditor
+ * @example
+ * updateNavigation('/home'); // Sends a message to the editor to update the navigation to '/home'
+ */
+export declare function updateNavigation(pathname: string): void;
+/**
+ * Checks if the code is running inside an editor.
+ *
+ * @returns {boolean} Returns true if the code is running inside an editor, otherwise false.
+ * @example
+ * ```ts
+ * if (isInsideEditor()) {
+ *     console.log('Running inside the editor');
+ * } else {
+ *     console.log('Running outside the editor');
+ * }
+ * ```
+ */
+export declare function isInsideEditor(): boolean;
+/**
+ * Initializes the DotCMS page editor.
+ *
+ * @param {DotCMSPageEditorConfig} config - Optional configuration for the editor.
+ * @example
+ * ```ts
+ * const config = { pathname: '/home' };
+ * initEditor(config); // Initializes the editor with the provided configuration
+ * ```
+ */
+export declare function initEditor(config: DotCMSPageEditorConfig): void;
+/**
+ * Destroys the editor by removing event listeners and disconnecting observers.
+ *
+ * @example
+ * ```ts
+ * destroyEditor(); // Cleans up the editor by removing all event listeners and disconnecting observers
+ * ```
+ */
+export declare function destroyEditor(): void;
+/**
+ * Adds a style class to empty contentlets.
+ *
+ * @export
+ * @example
+ * ```ts
+ * addClassToEmptyContentlets(); // Adds the 'empty-contentlet' class to all contentlets that have no height
+ * ```
+ */
+export declare function addClassToEmptyContentlets(): void;