@vvfx/sdk 0.2.8 → 0.2.10

package/dist/html-overlay/mime-utils.js

@@ -0,0 +1,21 @@
+export function getMimeType(path) {
+    if (path.endsWith('.css')) {
+        return 'text/css';
+    }
+    if (path.endsWith('.js') || path.endsWith('.mjs')) {
+        return 'text/javascript';
+    }
+    if (path.endsWith('.html') || path.endsWith('.htm')) {
+        return 'text/html';
+    }
+    if (path.endsWith('.svg')) {
+        return 'image/svg+xml';
+    }
+    if (path.endsWith('.json')) {
+        return 'application/json';
+    }
+    return 'text/plain';
+}
+export function createDataUrl(source, mimeType) {
+    return `data:${mimeType};charset=utf-8,${encodeURIComponent(source)}`;
+}

package/dist/html-overlay/overlay-transform.js

@@ -0,0 +1,57 @@
+export function getCardOverlayBoxStyle(box, width, height, offsetX = 0, offsetY = 0, _autoScale = true) {
+    if (box.corners.length === 4 && width > 0 && height > 0) {
+        const [rightTop, , leftBottom, leftTop] = box.corners;
+        const contentWidth = width;
+        const contentHeight = height;
+        const a = (rightTop.x - leftTop.x) / contentWidth;
+        const b = (rightTop.y - leftTop.y) / contentWidth;
+        const c = (leftBottom.x - leftTop.x) / contentHeight;
+        const d = (leftBottom.y - leftTop.y) / contentHeight;
+        const e = leftTop.x - offsetX;
+        const f = leftTop.y - offsetY;
+        return {
+            left: '0px',
+            top: '0px',
+            width: `${formatPixelNumber(contentWidth)}px`,
+            height: `${formatPixelNumber(contentHeight)}px`,
+            contentWidth,
+            contentHeight,
+            transform: `matrix(${formatMatrixNumber(a)}, ${formatMatrixNumber(b)}, ${formatMatrixNumber(c)}, ${formatMatrixNumber(d)}, ${formatMatrixNumber(e)}, ${formatMatrixNumber(f)})`,
+        };
+    }
+    const contentWidth = box.max.x - box.min.x;
+    const contentHeight = box.max.y - box.min.y;
+    return {
+        left: `${box.min.x - offsetX}px`,
+        top: `${box.min.y - offsetY}px`,
+        width: `${contentWidth}px`,
+        height: `${contentHeight}px`,
+        contentWidth,
+        contentHeight,
+        transform: '',
+    };
+}
+export function isPointInCardOverlayBox(box, point) {
+    if (box.corners.length !== 4) {
+        return point.x >= box.min.x && point.x <= box.max.x && point.y >= box.min.y && point.y <= box.max.y;
+    }
+    let inside = false;
+    for (let i = 0, j = box.corners.length - 1; i < box.corners.length; j = i, i += 1) {
+        const current = box.corners[i];
+        const previous = box.corners[j];
+        const intersects = ((current.y > point.y) !== (previous.y > point.y)) &&
+            (point.x < (previous.x - current.x) * (point.y - current.y) / (previous.y - current.y) + current.x);
+        if (intersects) {
+            inside = !inside;
+        }
+    }
+    return inside;
+}
+function formatMatrixNumber(value) {
+    const normalized = Object.is(value, -0) ? 0 : value;
+    return Number(normalized.toFixed(6)).toString();
+}
+function formatPixelNumber(value) {
+    const normalized = Object.is(value, -0) ? 0 : value;
+    return Number(normalized.toFixed(6)).toString();
+}

package/dist/html-overlay/path-utils.js

@@ -0,0 +1,35 @@
+export function normalizePath(path) {
+    const parts = [];
+    path.split('/').forEach((part) => {
+        if (!part || part === '.') {
+            return;
+        }
+        if (part === '..') {
+            parts.pop();
+            return;
+        }
+        parts.push(part);
+    });
+    return parts.join('/');
+}
+export function dirname(path) {
+    const normalizedPath = normalizePath(path);
+    const index = normalizedPath.lastIndexOf('/');
+    return index >= 0 ? normalizedPath.slice(0, index) : '';
+}
+export function resolvePath(path, fromPath) {
+    if (path.startsWith('/')) {
+        return normalizePath(path);
+    }
+    return normalizePath(`${dirname(fromPath)}/${path}`);
+}
+export function splitResourcePath(path) {
+    const match = /^([^?#]*)([?#].*)?$/.exec(path);
+    return {
+        path: match?.[1] ?? path,
+        suffix: match?.[2] ?? '',
+    };
+}
+export function shouldRewriteResource(url) {
+    return !/^(?:[a-z][a-z\d+.-]*:|#|\/\/)/i.test(url);
+}

package/dist/html-overlay/shell-runtime.js

@@ -0,0 +1,12 @@
+export function mountHTMLShell(container, content, shell) {
+    if (!shell) {
+        return { contentContainer: container };
+    }
+    const result = shell.render(container, {
+        content,
+    });
+    if (result instanceof HTMLElement) {
+        return { contentContainer: result };
+    }
+    return result;
+}

package/dist/index.cjs

@@ -3,7 +3,7 @@
  * Description: TODO
  * Author: Ant Group CO., Ltd.
  * Contributors: 赤芍,何即,不择,意绮
- * Version: v0.2.8
+ * Version: v0.2.10
  */
 
 'use strict';
@@ -70484,6 +70484,7 @@ var CONTENT_INTERACTION_NONE_SELECTOR = [
 var EDITING_VIEWPORT_PADDING = 48;
 var EDITING_VIEWPORT_BOX_SCALE = 1.1;
 var AUTO_HEIGHT_EPSILON = 0.5;
+var AUTO_HEIGHT_MAX_MULTIPLIER = 32;
 var CARD_RASTERIZE_READY_TIMEOUT = 3000;
 var CARD_HTML_EVENT_MESSAGE_SOURCE = 'vvfx-card-html-event';
 var requestHTMLOverlayFrame = function requestHTMLOverlayFrame(callback) {
@@ -70530,6 +70531,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             autoHeightModes: new Map(),
             autoHeightCleanups: new Map(),
             autoHeightFrames: new Map(),
+            autoHeightInitialHeights: new Map(),
             autoHeightStreamPhases: new Map()
         };
         this.handleContainerDoubleClick = function(event) {
@@ -70682,6 +70684,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             cancelHTMLOverlayFrame(frame);
         });
         this.state.autoHeightFrames.clear();
+        this.state.autoHeightInitialHeights.clear();
         this.state.autoHeightStreamPhases.clear();
         this.eventCleanups.forEach(function(cleanup) {
             cleanup();
@@ -71796,6 +71799,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
     _proto.removeOverlay = function removeOverlay(id) {
         var _this_state_elements_get, _this_state_selectionElements_get;
         this.cleanupOverlayContent(id);
+        this.state.autoHeightInitialHeights.delete(id);
         (_this_state_elements_get = this.state.elements.get(id)) == null ? void 0 : _this_state_elements_get.remove();
         (_this_state_selectionElements_get = this.state.selectionElements.get(id)) == null ? void 0 : _this_state_selectionElements_get.remove();
         this.state.elements.delete(id);
@@ -71990,7 +71994,8 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         if (!Number.isFinite(height) || height <= 0) {
             return;
         }
-        var nextHeight = Math.ceil(this.getAutoHeightItemHeight(item, height));
+        var measuredHeight = Math.ceil(this.getAutoHeightItemHeight(item, height));
+        var nextHeight = Math.min(measuredHeight, this.getAutoHeightLimit(item));
         if (this.isAutoHeightStreamActive(id) && nextHeight < item.property.height) {
             return;
         }
@@ -72031,6 +72036,15 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         }
         return contentHeight / displayedHeight * item.property.height;
     };
+    _proto.getAutoHeightLimit = function getAutoHeightLimit(item) {
+        var persistedInitialHeight = this.state.autoHeightInitialHeights.get(item.id);
+        if (persistedInitialHeight !== undefined) {
+            return persistedInitialHeight * AUTO_HEIGHT_MAX_MULTIPLIER;
+        }
+        var initialHeight = item.property.height;
+        this.state.autoHeightInitialHeights.set(item.id, initialHeight);
+        return initialHeight * AUTO_HEIGHT_MAX_MULTIPLIER;
+    };
     _proto.isAutoHeightEnabled = function isAutoHeightEnabled(item) {
         var _this_options_resolveCardTypeConfig;
         return isCardItem(item) && ((_this_options_resolveCardTypeConfig = this.options.resolveCardTypeConfig(item)) == null ? void 0 : _this_options_resolveCardTypeConfig.autoHeight) === true;
@@ -72390,6 +72404,15 @@ function withTimeout(promise, timeout) {
     });
 }
 
+function resolveTopAnchoredCardPosition(param) {
+    var nextHeight = param.nextHeight, position = param.position, previousHeight = param.previousHeight, scaleY = param.scaleY;
+    var normalizedScaleY = Number.isFinite(scaleY) ? scaleY : 1;
+    return [
+        position[0],
+        position[1] + (nextHeight - previousHeight) * normalizedScaleY / 2
+    ];
+}
+
 function orderSDKCanvasLayers(param) {
     var container = param.container, playerContainer = param.playerContainer, htmlOverlayLayer = param.htmlOverlayLayer, gestureCanvas = param.gestureCanvas;
     [
@@ -72502,6 +72525,8 @@ var SDK = /*#__PURE__*/ function() {
                 }, box);
             },
             setCardItemHeight: function setCardItemHeight(id, height, options) {
+                var _ref;
+                var _item_property_scale;
                 var item = _this.getSDKItem(id);
                 if (!isCardItem(item) || options.anchor === 'center') {
                     void _this.setItemProperty({
@@ -72512,17 +72537,18 @@ var SDK = /*#__PURE__*/ function() {
                     });
                     return;
                 }
-                var _item_property_position = item.property.position, x = _item_property_position[0], y = _item_property_position[1];
-                var deltaY = (height - options.previousHeight) / 2;
+                var position = resolveTopAnchoredCardPosition({
+                    nextHeight: height,
+                    position: item.property.position,
+                    previousHeight: options.previousHeight,
+                    scaleY: (_ref = (_item_property_scale = item.property.scale) == null ? void 0 : _item_property_scale[1]) != null ? _ref : 1
+                });
                 void _this.setItemProperty({
                     itemId: id,
                     type: SDKItemType.CARD,
                     property: {
                         height: height,
-                        position: [
-                            x,
-                            y + deltaY
-                        ]
+                        position: position
                     }
                 });
             },