@nascentdigital/funnel-core 4.5.7 → 4.6.1

package/dist/ui/Placement.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Placement = void 0;
+const TrackedValue_1 = require("../types/TrackedValue");
 // extension
 var Placement;
 (function (Placement) {
@@ -15,119 +16,130 @@ var Placement;
         };
     }
     Placement.getComponents = getComponents;
-    function forContent({ containerRect, containerPadding = 0, anchorRect, anchorOffset = 0, placement, contentSize }) {
+    function forContent({ containerRect, containerPadding = 0, anchorRect, anchorOffset = 0, placement, contentSize: trackedContentSize, viewportSize: trackedViewportSize, previousFrame }) {
+        // compute boundaries
         const containerInsets = typeof containerPadding === 'number'
             ? { left: containerPadding, right: containerPadding, top: containerPadding, bottom: containerPadding }
             : containerPadding;
-        // horizontal layout if left/right
+        const { previous: previousContentSize, current: contentSize } = TrackedValue_1.TrackedValue.filter(trackedContentSize)
+            ? trackedContentSize
+            : { previous: trackedContentSize, current: trackedContentSize };
+        const { changed: viewportSizeChanged, previous: previousViewportSize, current: viewportSize } = TrackedValue_1.TrackedValue.filter(trackedViewportSize)
+            ? trackedViewportSize
+            : { changed: false, previous: trackedViewportSize, current: trackedViewportSize };
         const { width: contentWidth, height: contentHeight } = contentSize;
         const { side: anchorSide, anchor: anchorPlacement } = getComponents(placement);
+        // reset frame if there's no previous value OR if the viewport size changed
         const popupFrame = {};
-        if (anchorSide === 'left' || anchorSide === 'right') {
-            // determine space to left/right
-            const spaceLeft = Math.max(0, anchorRect.left - containerRect.left - anchorOffset - containerInsets.left);
-            const spaceRight = Math.max(0, containerRect.right - anchorRect.right - anchorOffset - containerInsets.right);
-            // place left if it fits or if it fits better than on the right
-            if ((anchorSide === 'left' && (spaceLeft >= contentWidth || spaceLeft > spaceRight))
-                || (anchorSide === 'right' && spaceRight < contentWidth && spaceRight < spaceLeft)) {
-                // force over anchor if there's no room
-                if (spaceLeft < contentWidth) {
-                    popupFrame.left = containerRect.left + containerInsets.left;
-                    popupFrame.right = Math.min(popupFrame.left + contentWidth, containerRect.right - containerInsets.right);
+        if (viewportSizeChanged || !previousFrame) {
+            // horizontal layout if left/right
+            if (anchorSide === 'left' || anchorSide === 'right') {
+                // determine space to left/right
+                const spaceLeft = Math.max(0, anchorRect.left - containerRect.left - anchorOffset - containerInsets.left);
+                const spaceRight = Math.max(0, containerRect.right - anchorRect.right - anchorOffset - containerInsets.right);
+                // place left if it fits or if it fits better than on the right
+                if ((anchorSide === 'left' && (spaceLeft >= contentWidth || spaceLeft > spaceRight))
+                    || (anchorSide === 'right' && spaceRight < contentWidth && spaceRight < spaceLeft)) {
+                    // force over anchor if there's no room
+                    if (spaceLeft < contentWidth) {
+                        popupFrame.left = containerRect.left + containerInsets.left;
+                        popupFrame.right = Math.min(popupFrame.left + contentWidth, containerRect.right - containerInsets.right);
+                    }
+                    // or squeeze left
+                    else {
+                        popupFrame.right = containerRect.right - anchorRect.left + anchorOffset;
+                    }
                 }
-                // or squeeze left
+                // or place right
                 else {
-                    popupFrame.right = containerRect.right - anchorRect.left + anchorOffset;
+                    // force over anchor if there's no room
+                    if (spaceRight < contentWidth) {
+                        popupFrame.right = containerRect.right - containerInsets.right;
+                        popupFrame.left = Math.max(popupFrame.right - contentWidth, containerRect.left + containerInsets.left);
+                    }
+                    // or squeeze right
+                    else {
+                        popupFrame.left = anchorRect.right + anchorOffset;
+                    }
                 }
-            }
-            // or place right
-            else {
-                // force over anchor if there's no room
-                if (spaceRight < contentWidth) {
-                    popupFrame.right = containerRect.right - containerInsets.right;
-                    popupFrame.left = Math.max(popupFrame.right - contentWidth, containerRect.left + containerInsets.left);
-                }
-                // or squeeze right
-                else {
-                    popupFrame.left = anchorRect.right + anchorOffset;
+                // top-align on start
+                if (anchorPlacement === 'start') {
+                    popupFrame.top = anchorRect.top + containerInsets.top;
                 }
-            }
-            // top-align on start
-            if (anchorPlacement === 'start') {
-                popupFrame.top = anchorRect.top + containerInsets.top;
-            }
-            // bottom-align on end
-            else if (anchorPlacement === 'end') {
-                popupFrame.bottom = containerRect.bottom - containerInsets.bottom;
-            }
-            // match height
-            else if (anchorPlacement === 'match') {
-                popupFrame.top = anchorRect.top + containerInsets.top;
-                popupFrame.height = anchorRect.height;
-            }
-            // or center against anchor
-            else {
-                // set top bounds so it's centered
-                popupFrame.top = Math.max(anchorRect.top + (anchorRect.height - contentHeight) / 2, containerRect.top + containerInsets.top);
-                // offset if the bottom is bleeding over
-                if (popupFrame.top + contentHeight > containerRect.bottom + containerInsets.bottom) {
-                    popupFrame.top -= popupFrame.top + contentHeight - containerRect.bottom - containerInsets.bottom;
+                // bottom-align on end
+                else if (anchorPlacement === 'end') {
+                    popupFrame.bottom = containerRect.bottom - containerInsets.bottom;
                 }
-            }
-        }
-        // or standard vertical layout
-        else {
-            // determine space to top/bottom
-            const spaceTop = Math.max(0, anchorRect.top - containerRect.top - anchorOffset - containerInsets.top);
-            const spaceBottom = Math.max(0, containerRect.bottom - anchorRect.bottom - anchorOffset - containerInsets.bottom);
-            // place above if it fits or if it fits better than on the right
-            if ((anchorSide === 'top' && (spaceTop >= contentHeight || spaceBottom < spaceTop))
-                || (anchorSide === 'bottom' && spaceBottom < contentHeight && spaceBottom < spaceTop)) {
-                // force over anchor if there's no room
-                if (spaceTop < contentHeight) {
-                    popupFrame.top = containerRect.top + containerInsets.top;
-                    popupFrame.bottom = Math.min(popupFrame.top + contentHeight, containerRect.bottom - containerInsets.bottom);
+                // match height
+                else if (anchorPlacement === 'match') {
+                    popupFrame.top = anchorRect.top + containerInsets.top;
+                    popupFrame.height = anchorRect.height;
                 }
-                // or squeeze above
+                // or center against anchor
                 else {
-                    popupFrame.bottom = containerRect.bottom - anchorRect.top + anchorOffset;
+                    // set top bounds so it's centered
+                    popupFrame.top = Math.max(anchorRect.top + (anchorRect.height - contentHeight) / 2, containerRect.top + containerInsets.top);
+                    // offset if the bottom is bleeding over
+                    if (popupFrame.top + contentHeight > containerRect.bottom + containerInsets.bottom) {
+                        popupFrame.top -= popupFrame.top + contentHeight - containerRect.bottom - containerInsets.bottom;
+                    }
                 }
             }
-            // or place below
+            // or standard vertical layout
             else {
-                // force over anchor if there's no room
-                if (spaceBottom < contentHeight) {
-                    popupFrame.bottom = containerRect.bottom - containerInsets.bottom;
-                    popupFrame.top = Math.max(popupFrame.bottom - contentHeight, containerRect.top + containerInsets.top);
+                // determine space to top/bottom
+                const spaceTop = Math.max(0, anchorRect.top - containerRect.top - anchorOffset - containerInsets.top);
+                const spaceBottom = Math.max(0, containerRect.bottom - anchorRect.bottom - anchorOffset - containerInsets.bottom);
+                // place above if it fits or if it fits better than on the right
+                if ((anchorSide === 'top' && (spaceTop >= contentHeight || spaceBottom < spaceTop))
+                    || (anchorSide === 'bottom' && spaceBottom < contentHeight && spaceBottom < spaceTop)) {
+                    // force over anchor if there's no room
+                    if (spaceTop < contentHeight) {
+                        popupFrame.top = containerRect.top + containerInsets.top;
+                        popupFrame.bottom = Math.min(popupFrame.top + contentHeight, containerRect.bottom - containerInsets.bottom);
+                    }
+                    // or squeeze above
+                    else {
+                        popupFrame.bottom = containerRect.bottom - anchorRect.top + anchorOffset;
+                    }
                 }
-                // or squeeze right
+                // or place below
                 else {
-                    popupFrame.top = anchorRect.bottom + anchorOffset;
+                    // force over anchor if there's no room
+                    if (spaceBottom < contentHeight) {
+                        popupFrame.bottom = containerRect.bottom - containerInsets.bottom;
+                        popupFrame.top = Math.max(popupFrame.bottom - contentHeight, containerRect.top + containerInsets.top);
+                    }
+                    // or squeeze right
+                    else {
+                        popupFrame.top = anchorRect.bottom + anchorOffset;
+                    }
                 }
-            }
-            // left-align on start
-            if (anchorPlacement === 'start') {
-                popupFrame.left = anchorRect.left;
-            }
-            // right-align on end
-            else if (anchorPlacement === 'end') {
-                popupFrame.right = containerRect.right - anchorRect.right;
-            }
-            // match width
-            else if (anchorPlacement === 'match') {
-                popupFrame.left = anchorRect.left;
-                popupFrame.width = anchorRect.width;
-            }
-            // or center against anchor
-            else {
-                // set left bounds so it's centered
-                popupFrame.left = Math.max(anchorRect.left + (anchorRect.width - contentWidth) / 2, containerRect.left);
-                // offset if the right is bleeding over
-                if (popupFrame.left + contentWidth > containerRect.right) {
-                    popupFrame.left -= popupFrame.left + contentWidth - containerRect.right;
+                // left-align on start
+                if (anchorPlacement === 'start') {
+                    popupFrame.left = anchorRect.left;
+                }
+                // right-align on end
+                else if (anchorPlacement === 'end') {
+                    popupFrame.right = containerRect.right - anchorRect.right;
+                }
+                // match width
+                else if (anchorPlacement === 'match') {
+                    popupFrame.left = anchorRect.left;
+                    popupFrame.width = anchorRect.width;
+                }
+                // or center against anchor
+                else {
+                    // set left bounds so it's centered
+                    popupFrame.left = Math.max(anchorRect.left + (anchorRect.width - contentWidth) / 2, containerRect.left);
+                    // offset if the right is bleeding over
+                    if (popupFrame.left + contentWidth > containerRect.right) {
+                        popupFrame.left -= popupFrame.left + contentWidth - containerRect.right;
+                    }
                 }
             }
         }
+        // or
         // return position insets
         return popupFrame;
     }

package/dist/utils/ObjectUtils.js

@@ -30,7 +30,6 @@ var ObjectUtils;
     }
     ObjectUtils.createSeries = createSeries;
     function splitProps(mixedProps, keys) {
-        console.debug('[splitProps] splitting', { mixedProps, keys });
         // split props
         const splitProps = {};
         const props = {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nascentdigital/funnel-core",
-  "version": "4.5.7",
+  "version": "4.6.1",
   "repository": {
     "url": "git+https://github.com/nascentdigital/funnel.git",
     "directory": "libs/core"
@@ -65,5 +65,5 @@
     "jest-tsd": "^0.2.2",
     "ts-jest": "^29.3.2"
   },
-  "gitHead": "aa14b53e99044a968b850c4f426e40d312a9306a"
+  "gitHead": "4a1d18f6f87148196b5e820c0ada8f2a8111b9f6"
 }

package/dist/schema/LinkedPageModel.d.ts

@@ -1,11 +0,0 @@
-import { LinkedData } from './LinkedData';
-import { Page } from './Page';
-/**
- * Page model with refs resolved to values
- */
-export declare class LinkedPageModel<TPage extends Page> {
-    readonly data: Page.LinkedData<TPage>;
-    constructor(data: Page.LinkedData<TPage>);
-    get seo(): import("./Seo").Seo.LinkedData;
-    static fromPageData<TPage extends Page>(unlinkedData: Page.Data<TPage> | Page.Data.AsPreview<TPage>, resolvers: LinkedData.DynamicResolvers): Promise<LinkedPageModel<TPage>>;
-}

package/dist/schema/LinkedPageModel.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LinkedPageModel = void 0;
-const LinkedData_1 = require("./LinkedData");
-/**
- * Page model with refs resolved to values
- */
-class LinkedPageModel {
-    constructor(data) {
-        this.data = data;
-    }
-    get seo() {
-        var _a;
-        return (_a = this.data.discover) === null || _a === void 0 ? void 0 : _a.seo;
-    }
-    static async fromPageData(unlinkedData, resolvers) {
-        // transform
-        const linkedData = await LinkedData_1.LinkedData.resolve({
-            unlinkedData,
-            resolvers
-        });
-        // return linked page model
-        return new LinkedPageModel(linkedData);
-    }
-}
-exports.LinkedPageModel = LinkedPageModel;