@dotcms/client - npm Package Compare versions

Comparing version 0.0.1-alpha.14 to 0.0.1-alpha.15

package.json

 {
   "name": "@dotcms/client",
-  "version": "0.0.1-alpha.14",
+  "version": "0.0.1-alpha.15",
   "type": "module",
@@ -5,0 +5,0 @@ "description": "Official JavaScript library for interacting with DotCMS REST APIs.",

src/index.d.ts

@@ -5,1 +5,2 @@ export * from './lib/client/sdk-js-client';
 export * from './lib/editor/models/client.model';
+export * from './lib/query-builder/sdk-query-builder';

src/index.js

@@ -5,2 +5,3 @@ export * from './lib/client/sdk-js-client';
 export * from './lib/editor/models/client.model';
+export * from './lib/query-builder/sdk-query-builder';
 //# sourceMappingURL=index.js.map

src/lib/editor/listeners/listeners.js

 import { CUSTOMER_ACTIONS, postMessageToEditor } from '../models/client.model';
 import { NOTIFY_CUSTOMER } from '../models/listeners.model';
-import { findVTLData, findDotElement, getClosestContainerData, getPageElementBound } from '../utils/editor.utils';
+import { findVTLData, findDotElement, getClosestContainerData, getPageElementBound, scrollIsInBottom } from '../utils/editor.utils';
 /**
@@ -60,2 +60,15 @@ * Default reload function that reloads the current window.
         }
+        if (event.data.name === NOTIFY_CUSTOMER.EMA_SCROLL_INSIDE_IFRAME) {
+            const direction = event.data.direction;
+            if ((window.scrollY === 0 && direction === 'up') ||
+                (scrollIsInBottom() && direction === 'down')) {
+                /**
+                 * If the iframe scroll is in the top of bottom, we dont send anything.
+                 * This to avoid the lost of scrollend event
+                 **/
+                return;
+            }
+            const scrollY = direction === 'up' ? -120 : 120;
+            window.scrollBy({ left: 0, top: scrollY, behavior: 'smooth' });
+        }
     };
@@ -143,6 +156,17 @@ window.addEventListener('message', messageCallback);
     };
+    const scrollEndCallback = () => {
+        postMessageToEditor({
+            action: CUSTOMER_ACTIONS.IFRAME_SCROLL_END
+        });
+    };
     window.addEventListener('scroll', scrollCallback);
+    window.addEventListener('scrollend', scrollEndCallback);
     subscriptions.push({
         type: 'listener',
         event: 'scroll',
+        callback: scrollEndCallback
+    });
+    subscriptions.push({
+        type: 'listener',
+        event: 'scroll',
         callback: scrollCallback
@@ -149,0 +173,0 @@ });

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

@@ -25,2 +25,6 @@ /**
     /**
+     * Tell the editor that the page has stopped scrolling
+     */
+    IFRAME_SCROLL_END = "scroll-end",
+    /**
      * Ping the editor to see if the page is inside the editor
@@ -27,0 +31,0 @@ */

src/lib/editor/models/client.model.js

@@ -26,2 +26,6 @@ /**
     /**
+     * Tell the editor that the page has stopped scrolling
+     */
+    CUSTOMER_ACTIONS["IFRAME_SCROLL_END"] = "scroll-end";
+    /**
      * Ping the editor to see if the page is inside the editor
@@ -28,0 +32,0 @@ */

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

@@ -19,3 +19,7 @@ /**
      */
-    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"
 }
@@ -22,0 +26,0 @@ type ListenerCallbackMessage = (event: MessageEvent) => void;

src/lib/editor/models/listeners.model.js

@@ -21,3 +21,7 @@ /**
     NOTIFY_CUSTOMER["EMA_EDITOR_PONG"] = "ema-editor-pong";
+    /**
+     * Received scroll event trigger from the editor
+     */
+    NOTIFY_CUSTOMER["EMA_SCROLL_INSIDE_IFRAME"] = "scroll-inside-iframe";
 })(NOTIFY_CUSTOMER || (NOTIFY_CUSTOMER = {}));
 //# sourceMappingURL=listeners.model.js.map

src/lib/editor/sdk-editor-vtl.js

 import { listenEditorMessages, listenHoveredContentlet, pingEditor, preserveScrollOnIframe, scrollHandler } from './listeners/listeners';
-import { isInsideEditor } from './sdk-editor';
+import { isInsideEditor, addClassToEmptyContentlets } from './sdk-editor';
 /**
@@ -19,3 +19,4 @@ * This is the main entry point for the SDK VTL.
     listenHoveredContentlet();
+    addClassToEmptyContentlets();
 }
 //# sourceMappingURL=sdk-editor-vtl.js.map

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

@@ -24,1 +24,7 @@ import { DotCMSPageEditorConfig } from './models/editor.model';
 export declare function destroyEditor(): void;
+/**
+ * Adds a class to empty contentlets.
+ *
+ * @export
+ */
+export declare function addClassToEmptyContentlets(): void;

src/lib/editor/sdk-editor.js

@@ -54,2 +54,16 @@ import { listenEditorMessages, listenHoveredContentlet, pingEditor, scrollHandler, setPageEditorConfig, subscriptions } from './listeners/listeners';
 }
+/**
+ * Adds a class to empty contentlets.
+ *
+ * @export
+ */
+export function addClassToEmptyContentlets() {
+    const contentlets = document.querySelectorAll('[data-dot-object="contentlet"]');
+    contentlets.forEach((contentlet) => {
+        if (contentlet.clientHeight) {
+            return;
+        }
+        contentlet.classList.add('empty-contentlet');
+    });
+}
 //# sourceMappingURL=sdk-editor.js.map

src/lib/editor/utils/editor.utils.d.ts

@@ -82,2 +82,3 @@ /**
 }[] | null;
+export declare function scrollIsInBottom(): boolean;
 export {};

src/lib/editor/utils/editor.utils.js

@@ -128,2 +128,8 @@ /**
 }
+export function scrollIsInBottom() {
+    const documentHeight = document.documentElement.scrollHeight;
+    const viewportHeight = window.innerHeight;
+    const scrollY = window.scrollY;
+    return scrollY + viewportHeight >= documentHeight;
+}
 //# sourceMappingURL=editor.utils.js.map

No alert changes

Improved metrics

Total package byte prevSize

88092

increased by58.11%

Number of package files

47

increased by62.07%

Lines of code

1833

increased by70.19%

No dependency changes