@contrail/documents 2.1.0-alpha.5e3a42c → 2.1.0-alpha.a738b01

package/CHANGELOG.md

@@ -20,25 +20,6 @@ Versioning follows [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 - `SECTION_ELEMENT_TYPE`, `FRAME_ELEMENT_TYPE` and `SHAPE_ELEMENT_TYPES` in
   `document-element-constants`, so the rule above has one definition rather than one per app.
 
-### Changed (breaking)
-
-- `isContainerBinding()` becomes `DynamicTextUtil.takesValueFromContainer()`. Same rule, named for
-  what it decides: whether the binding's value comes from the container rather than a type property.
-
-### Fixed
-
-- A dynamic text is now anchored at its position rather than its centre when deciding which
-  container it belongs to, and `DynamicTextUtil.isDynamicText` is the shared test for one. Its size
-  comes from the value it resolves to, and that value depends on the container, so letting its width
-  feed membership meant its own text could choose its container: near an edge the two answers
-  disagreed indefinitely, flipping between a value and "Move to a frame" on every read. Everything
-  else still resolves on its centre.
-- `min` and `max` rendered an infinity sign when every member value was empty. The early return
-  checked the list length before the empty values were filtered out, so `Math.min` of nothing
-  reached the formatter. Both now fall through to `n/a`.
-- `DynamicTextUtil.calculateSize` threw on an element that reached it without a `size`, which on
-  the server failed the read for the whole document. It now measures from a zero size instead.
-
 ### Changed
 
 - `DocumentElementFactory.getBoundingClientRect` multiplies the measured size by the element's

package/lib/containers/document-container-index.d.ts

@@ -1,10 +1,9 @@
-import { DocumentElement, PositionDefinition } from '../types';
+import { PositionDefinition } from '../types';
 import { ContainerElementType } from './container-kind';
 import { DocumentContainer } from './document-container';
 export declare class DocumentContainerIndex {
     private readonly data;
     constructor(data: {
-        documentElementsById: Map<string, DocumentElement>;
         containersById: Map<string, DocumentContainer>;
         containerPathsByDocumentElementId: Map<string, Map<string, string[]>>;
         memberIdsByContainerId: Map<string, string[]>;
@@ -12,13 +11,11 @@ export declare class DocumentContainerIndex {
     });
     getContainer(containerId: string): DocumentContainer | null;
     containersOf(documentElementId: string, elementType: ContainerElementType): DocumentContainer[];
-    containerIdsOf(documentElementId: string, elementType: ContainerElementType): readonly string[];
+    containerIdsOf(documentElementId: string, elementType: ContainerElementType): string[];
     innermostContainerIdOf(documentElementId: string, elementType: ContainerElementType): string | null;
-    memberIdsOf(containerId: string): readonly string[];
-    memberDocumentElementsOf(containerId: string): DocumentElement[];
-    containerPathAtPoint(point: PositionDefinition, elementType: ContainerElementType): readonly string[];
+    memberIdsOf(containerId: string): string[];
+    containerPathAtPoint(point: PositionDefinition, elementType: ContainerElementType): string[];
     maxDepth(elementType: ContainerElementType): number;
     private containersOfType;
-    private resolveAll;
     private containerPath;
 }

package/lib/containers/document-container-index.js

@@ -11,7 +11,9 @@ class DocumentContainerIndex {
         return (_a = this.data.containersById.get(containerId)) !== null && _a !== void 0 ? _a : null;
     }
     containersOf(documentElementId, elementType) {
-        return this.resolveAll(this.containerIdsOf(documentElementId, elementType));
+        return this.containerIdsOf(documentElementId, elementType)
+            .map((containerId) => this.data.containersById.get(containerId))
+            .filter(Boolean);
     }
     containerIdsOf(documentElementId, elementType) {
         return this.containerPath(documentElementId, elementType);
@@ -24,16 +26,6 @@ class DocumentContainerIndex {
         var _a;
         return (_a = this.data.memberIdsByContainerId.get(containerId)) !== null && _a !== void 0 ? _a : [];
     }
-    memberDocumentElementsOf(containerId) {
-        const members = [];
-        for (const memberId of this.memberIdsOf(containerId)) {
-            const member = this.data.documentElementsById.get(memberId);
-            if (member) {
-                members.push(member);
-            }
-        }
-        return members;
-    }
     containerPathAtPoint(point, elementType) {
         const covering = this.containersOfType(elementType).filter((container) => (0, document_container_1.containsPoint)(container.box, point));
         return (0, document_container_1.topmostPerDepth)(covering).map((container) => container.id);
@@ -43,17 +35,9 @@ class DocumentContainerIndex {
     }
     containersOfType(elementType) {
         var _a;
-        return this.resolveAll((_a = this.data.containerIdsByElementType.get(elementType)) !== null && _a !== void 0 ? _a : []);
-    }
-    resolveAll(containerIds) {
-        const containers = [];
-        for (const containerId of containerIds) {
-            const container = this.data.containersById.get(containerId);
-            if (container) {
-                containers.push(container);
-            }
-        }
-        return containers;
+        return ((_a = this.data.containerIdsByElementType.get(elementType)) !== null && _a !== void 0 ? _a : [])
+            .map((containerId) => this.data.containersById.get(containerId))
+            .filter(Boolean);
     }
     containerPath(documentElementId, elementType) {
         var _a, _b;

package/lib/containers/document-container.d.ts

@@ -16,7 +16,6 @@ export interface MeasuredDocumentElement {
 }
 export declare function toCoordinateBox(x: number, y: number, width: number, height: number): CoordinateBox;
 export declare function centerOf(box: CoordinateBox): PositionDefinition;
-export declare function anchorOf(documentElement: DocumentElement, box: CoordinateBox): PositionDefinition;
 export declare function containsPoint(box: CoordinateBox, point: PositionDefinition): boolean;
 export declare function encloses(outer: CoordinateBox, inner: CoordinateBox): boolean;
 export declare function isWiderAndTallerThan(box: CoordinateBox, other: CoordinateBox): boolean;

package/lib/containers/document-container.js

@@ -2,21 +2,16 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.toCoordinateBox = toCoordinateBox;
 exports.centerOf = centerOf;
-exports.anchorOf = anchorOf;
 exports.containsPoint = containsPoint;
 exports.encloses = encloses;
 exports.isWiderAndTallerThan = isWiderAndTallerThan;
 exports.topmostPerDepth = topmostPerDepth;
-const dynamic_text_util_1 = require("../util/dynamic-text/dynamic-text-util");
 function toCoordinateBox(x, y, width, height) {
     return { x, y, width, height, left: x, right: x + width, top: y, bottom: y + height };
 }
 function centerOf(box) {
     return { x: box.left + box.width / 2, y: box.top + box.height / 2 };
 }
-function anchorOf(documentElement, box) {
-    return dynamic_text_util_1.DynamicTextUtil.isDynamicText(documentElement) ? { x: box.left, y: box.top } : centerOf(box);
-}
 function containsPoint(box, point) {
     return point.x >= box.left && point.x <= box.right && point.y >= box.top && point.y <= box.bottom;
 }

package/lib/containers/document-container.service.d.ts

@@ -1,8 +1,14 @@
 import { DocumentElement } from '../types';
 import { ContainerKind } from './container-kind';
 import { DocumentContainerIndex } from './document-container-index';
+export type MeasureDocumentElement = (documentElement: DocumentElement, startElement?: DocumentElement, endElement?: DocumentElement) => {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+} | null;
 export declare class DocumentContainerService {
-    static buildIndex(documentElements: readonly DocumentElement[], kinds?: ContainerKind[]): DocumentContainerIndex;
+    static buildIndex(documentElements: readonly DocumentElement[], kinds?: ContainerKind[], measure?: MeasureDocumentElement): DocumentContainerIndex;
     static isContainer(documentElement: DocumentElement, kinds?: ContainerKind[]): boolean;
     private static measureDocumentElements;
     private static measure;

package/lib/containers/document-container.service.js

@@ -7,8 +7,8 @@ const container_kind_1 = require("./container-kind");
 const document_container_index_1 = require("./document-container-index");
 const document_container_1 = require("./document-container");
 class DocumentContainerService {
-    static buildIndex(documentElements, kinds = container_kind_1.CONTAINER_KINDS) {
-        const measuredDocumentElements = this.measureDocumentElements(documentElements !== null && documentElements !== void 0 ? documentElements : []);
+    static buildIndex(documentElements, kinds = container_kind_1.CONTAINER_KINDS, measure) {
+        const measuredDocumentElements = this.measureDocumentElements(documentElements !== null && documentElements !== void 0 ? documentElements : [], measure);
         const nestingByElementType = new Map(kinds.map((kind) => [kind.elementType, this.buildNesting(measuredDocumentElements, kind)]));
         const containersById = new Map();
         const containerIdsByElementType = new Map();
@@ -37,7 +37,6 @@ class DocumentContainerService {
             containerPathsByDocumentElementId.set(documentElementId, pathsByElementType);
         }
         return new document_container_index_1.DocumentContainerIndex({
-            documentElementsById: new Map(measuredDocumentElements.map((measured) => [measured.documentElement.id, measured.documentElement])),
             containersById,
             containerPathsByDocumentElementId,
             memberIdsByContainerId,
@@ -47,15 +46,15 @@ class DocumentContainerService {
     static isContainer(documentElement, kinds = container_kind_1.CONTAINER_KINDS) {
         return kinds.some((kind) => kind.elementType === (documentElement === null || documentElement === void 0 ? void 0 : documentElement.type));
     }
-    static measureDocumentElements(documentElements) {
+    static measureDocumentElements(documentElements, measure) {
         const documentElementsById = new Map(documentElements.map((documentElement) => [documentElement.id, documentElement]));
         return documentElements.map((documentElement, drawOrder) => ({
             documentElement,
             drawOrder,
-            box: this.measure(documentElement, documentElementsById),
+            box: this.measure(documentElement, documentElementsById, measure),
         }));
     }
-    static measure(documentElement, documentElementsById) {
+    static measure(documentElement, documentElementsById, measure) {
         var _a, _b;
         if (!(documentElement === null || documentElement === void 0 ? void 0 : documentElement.position)) {
             return null;
@@ -63,8 +62,10 @@ class DocumentContainerService {
         try {
             const start = ((_a = documentElement.start) === null || _a === void 0 ? void 0 : _a.id) ? documentElementsById.get(documentElement.start.id) : undefined;
             const end = ((_b = documentElement.end) === null || _b === void 0 ? void 0 : _b.id) ? documentElementsById.get(documentElement.end.id) : undefined;
-            const { x, y, width, height } = document_element_factory_1.DocumentElementFactory.getBoundingClientRect(documentElement, start, end);
-            return (0, document_container_1.toCoordinateBox)(x, y, width, height);
+            const rect = measure
+                ? measure(documentElement, start, end)
+                : document_element_factory_1.DocumentElementFactory.getBoundingClientRect(documentElement, start, end);
+            return rect ? (0, document_container_1.toCoordinateBox)(rect.x, rect.y, rect.width, rect.height) : null;
         }
         catch (_c) {
             return null;
@@ -125,14 +126,14 @@ class DocumentContainerService {
         return (0, document_container_1.topmostPerDepth)(containers).map((container) => container.id);
     }
     static candidateContainers(measured, containers) {
-        const anchor = (0, document_container_1.anchorOf)(measured.documentElement, measured.box);
+        const center = (0, document_container_1.centerOf)(measured.box);
         const isShape = document_element_constants_1.SHAPE_ELEMENT_TYPES.includes(measured.documentElement.type);
         return containers.filter((container) => {
             var _a;
             if (container.id === measured.documentElement.id || measured.drawOrder <= container.drawOrder) {
                 return false;
             }
-            if (!(0, document_container_1.containsPoint)(container.box, anchor)) {
+            if (!(0, document_container_1.containsPoint)(container.box, center)) {
                 return false;
             }
             if (isShape && (0, document_container_1.isWiderAndTallerThan)(measured.box, container.box)) {

package/lib/util/dynamic-text/dynamic-text-util.d.ts

@@ -48,9 +48,8 @@ export declare const HARD_CODED_TEXT: {
     'section.itemOptionCount': string;
     'section.colorCount': string;
 };
+export declare function isContainerBinding(bindingProperty: string | null | undefined): boolean;
 export declare class DynamicTextUtil {
-    static isDynamicText(documentElement: DocumentElement): boolean;
-    static takesValueFromContainer(bindingProperty: string | null | undefined): boolean;
     static getDynamicTextValue(dynamicTextElement: DocumentElement, property: TypeProperty, propertyLevel: PropertyLevel, container: DynamicTextContainer | null, componentModels: any[], ownerReferenceModel?: any): string;
     static calculateSize(dynamicTextElement: DocumentElement, entityType: any, text: string): import("../..").SizeDefinition;
     static getTextFromFrameMemberValues(displayFunction: string, property: any, memberValues: any[]): string;

package/lib/util/dynamic-text/dynamic-text-util.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DynamicTextUtil = exports.HARD_CODED_TEXT = exports.CLICK_TO_CONFIGURE = exports.MOVE_TO_SECTION_TEXT = exports.MOVE_TO_FRAME_TEXT = exports.DynamicTextDisplayFunction = exports.DYNAMIC_TEXT_DATA_SOURCE = void 0;
+exports.isContainerBinding = isContainerBinding;
 const types_1 = require("@contrail/types");
 const util_1 = require("@contrail/util");
 const document_util_1 = require("@contrail/document-util");
@@ -50,19 +51,14 @@ exports.HARD_CODED_TEXT = {
 };
 const CONTAINER_PROPERTY_SLUGS = ['name', 'count', 'itemFamilyCount', 'itemOptionCount', 'colorCount'];
 const CONTAINER_SOURCES = [DYNAMIC_TEXT_DATA_SOURCE.FRAME, DYNAMIC_TEXT_DATA_SOURCE.SECTION];
-class DynamicTextUtil {
-    static isDynamicText(documentElement) {
-        return ((documentElement === null || documentElement === void 0 ? void 0 : documentElement.type) === 'text' &&
-            !!documentElement.propertyBindings &&
-            !!documentElement.propertyBindingsMetaData);
-    }
-    static takesValueFromContainer(bindingProperty) {
-        if (!bindingProperty) {
-            return false;
-        }
-        const [entityType, propertySlug] = bindingProperty.split('.');
-        return CONTAINER_SOURCES.includes(entityType) && CONTAINER_PROPERTY_SLUGS.includes(propertySlug);
+function isContainerBinding(bindingProperty) {
+    if (!bindingProperty) {
+        return false;
     }
+    const [entityType, propertySlug] = bindingProperty.split('.');
+    return CONTAINER_SOURCES.includes(entityType) && CONTAINER_PROPERTY_SLUGS.includes(propertySlug);
+}
+class DynamicTextUtil {
     static getDynamicTextValue(dynamicTextElement, property, propertyLevel, container, componentModels, ownerReferenceModel = null) {
         var _a, _b, _c, _d;
         if (!dynamicTextElement.propertyBindings || !dynamicTextElement.propertyBindings.text) {
@@ -154,12 +150,12 @@ class DynamicTextUtil {
         return text;
     }
     static calculateSize(dynamicTextElement, entityType, text) {
-        var _a, _b, _c, _d, _e;
-        let size = (_a = dynamicTextElement.size) !== null && _a !== void 0 ? _a : { width: 0, height: 0 };
-        const fontFamily = (_b = document_util_1.DocumentStyleUtil.getFirstFontFamily(dynamicTextElement === null || dynamicTextElement === void 0 ? void 0 : dynamicTextElement.text)) !== null && _b !== void 0 ? _b : document_util_1.DEFAULT_TEXT_FONT_FAMILY;
-        const fontSize = (_e = (dynamicTextElement.isTextTool
-            ? (_d = (_c = dynamicTextElement.style) === null || _c === void 0 ? void 0 : _c.font) === null || _d === void 0 ? void 0 : _d.size
-            : document_util_1.DocumentStyleUtil.getFirstFontSize(dynamicTextElement === null || dynamicTextElement === void 0 ? void 0 : dynamicTextElement.text, true))) !== null && _e !== void 0 ? _e : document_util_1.DEFAULT_TEXT_FONT_SIZE;
+        var _a, _b, _c, _d;
+        let size = dynamicTextElement.size;
+        const fontFamily = (_a = document_util_1.DocumentStyleUtil.getFirstFontFamily(dynamicTextElement === null || dynamicTextElement === void 0 ? void 0 : dynamicTextElement.text)) !== null && _a !== void 0 ? _a : document_util_1.DEFAULT_TEXT_FONT_FAMILY;
+        const fontSize = (_d = (dynamicTextElement.isTextTool
+            ? (_c = (_b = dynamicTextElement.style) === null || _b === void 0 ? void 0 : _b.font) === null || _c === void 0 ? void 0 : _c.size
+            : document_util_1.DocumentStyleUtil.getFirstFontSize(dynamicTextElement === null || dynamicTextElement === void 0 ? void 0 : dynamicTextElement.text, true))) !== null && _d !== void 0 ? _d : document_util_1.DEFAULT_TEXT_FONT_SIZE;
         const fontSizePx = document_util_1.DocumentStyleUtil.toPx(fontSize, 4);
         const padding = dynamicTextElement.isTextTool ? document_util_1.TEXT_TOOL_PADDING : document_util_1.TEXT_BOX_PADDING;
         const bold = document_util_1.DocumentStyleUtil.isBold(dynamicTextElement === null || dynamicTextElement === void 0 ? void 0 : dynamicTextElement.text, fontFamily);
@@ -173,7 +169,7 @@ class DynamicTextUtil {
             italic,
         };
         if (!dynamicTextElement.isTextTool) {
-            measureTextSettings.width = size.width - padding * 2;
+            measureTextSettings.width = dynamicTextElement.size.width - padding * 2;
         }
         try {
             const dimensions = document_util_1.DocumentTextUtil.measureText(text, measureTextSettings);
@@ -216,14 +212,13 @@ class DynamicTextUtil {
         else if (displayFunction === DynamicTextDisplayFunction.LAST) {
             text = formatter.formatValueForProperty(memberValues[memberValues.length - 1], property);
         }
-        else if (displayFunction === DynamicTextDisplayFunction.MIN ||
-            displayFunction === DynamicTextDisplayFunction.MAX) {
-            const present = memberValues.filter((e) => e !== null && e !== undefined);
-            if (!present.length) {
-                return '';
-            }
-            const extreme = displayFunction === DynamicTextDisplayFunction.MIN ? Math.min(...present) : Math.max(...present);
-            text = formatter.formatValueForProperty(extreme, property);
+        else if (displayFunction === DynamicTextDisplayFunction.MIN) {
+            memberValues = memberValues.filter((e) => e !== null && e !== undefined);
+            text = formatter.formatValueForProperty(Math.min(...memberValues), property);
+        }
+        else if (displayFunction === DynamicTextDisplayFunction.MAX) {
+            memberValues = memberValues.filter((e) => e !== null && e !== undefined);
+            text = formatter.formatValueForProperty(Math.max(...memberValues), property);
         }
         return text;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contrail/documents",
-  "version": "2.1.0-alpha.5e3a42c",
+  "version": "2.1.0-alpha.a738b01",
   "description": "Documents library for contrail platform",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",