@vvfx/sdk 0.2.2-beta.9 → 0.2.3

package/dist/index.mjs

@@ -3,7 +3,7 @@
  * Description: TODO
  * Author: Ant Group CO., Ltd.
  * Contributors: 赤芍,何即,不择,意绮
- * Version: v0.2.2-beta.9
+ * Version: v0.2.3
  */
 
 'use strict';
@@ -24032,9 +24032,21 @@ function getUniqueName(name, names) {
     };
     _create_class(TextItem, [
         {
-            key: "text",
+            key: "pixelWidth",
             get: // ==================== 便捷访问器 ====================
-            /**
+            function get() {
+                return this.width;
+            }
+        },
+        {
+            key: "pixelHeight",
+            get: function get() {
+                return this.height;
+            }
+        },
+        {
+            key: "text",
+            get: /**
    * @description 文本内容
    */ function get() {
                 return this.property.text;
@@ -25172,150 +25184,6 @@ var ItemOrderAction = /*#__PURE__*/ function(ItemOrderAction) {
     return _instanceof(obj, FrameItem);
 }
 
-/**
- * @description 卡片元素 SDKItem 类
- * @description 在 Player 中以 SpriteItem 形式渲染（透明占位，无图）
- * @description 支持设置卡片类型（cardType）
- */ var CardItem = /*#__PURE__*/ function(BaseItem) {
-    _inherits(CardItem, BaseItem);
-    function CardItem(options) {
-        var _this;
-        var _ref, _ref1, _ref2, _ref3, _ref4, _ref5;
-        var _options_property, _options_property1, _options_property2, _options_property3, _options_property4, _options_property5;
-        _this = BaseItem.call(this, options) || this, /**
-   * @description 元素类型
-   */ _this.type = SDKItemType.CARD;
-        // 初始化属性（包含 cardType）
-        _this.property = {
-            position: (_ref = (_options_property = options.property) == null ? void 0 : _options_property.position) != null ? _ref : [
-                0,
-                0
-            ],
-            rotation: (_ref1 = (_options_property1 = options.property) == null ? void 0 : _options_property1.rotation) != null ? _ref1 : [
-                0,
-                0,
-                0
-            ],
-            width: (_ref2 = (_options_property2 = options.property) == null ? void 0 : _options_property2.width) != null ? _ref2 : 0,
-            height: (_ref3 = (_options_property3 = options.property) == null ? void 0 : _options_property3.height) != null ? _ref3 : 0,
-            scale: (_ref4 = (_options_property4 = options.property) == null ? void 0 : _options_property4.scale) != null ? _ref4 : [
-                1,
-                1
-            ],
-            cardType: (_ref5 = (_options_property5 = options.property) == null ? void 0 : _options_property5.cardType) != null ? _ref5 : 'unknown'
-        };
-        return _this;
-    }
-    var _proto = CardItem.prototype;
-    // ==================== 实现抽象方法 ====================
-    /**
-   * @description 转换为 CardCreateInfo
-   * @param withParent 是否包含父节点ID
-   */ _proto.toCreateInfo = function toCreateInfo(withParent) {
-        var extension = this.getAllExtension();
-        return {
-            type: SDKItemType.CARD,
-            id: this.id,
-            name: this.name,
-            parentId: withParent ? this.parentId : undefined,
-            extension: Object.keys(extension).length > 0 ? extension : undefined,
-            property: deepClone(this.property)
-        };
-    };
-    /**
-   * @description 克隆 SDKItem
-   */ _proto.clone = function clone() {
-        return new CardItem({
-            id: EFFECTS.generateGUID(),
-            name: this.name,
-            parentId: this.parentId,
-            duration: this.duration,
-            delay: this.delay,
-            endBehavior: this.endBehavior,
-            isLocked: this.isLocked,
-            isCoreEditable: this.isCoreEditable,
-            property: deepClone(this.property),
-            extension: this.getAllExtension()
-        });
-    };
-    _create_class(CardItem, [
-        {
-            key: "cardType",
-            get: // ==================== cardType 访问器 ====================
-            /**
-   * @description 卡片类型
-   */ function get() {
-                return this.property.cardType;
-            },
-            set: function set(value) {
-                this.property.cardType = value;
-            }
-        },
-        {
-            key: "position",
-            get: // ==================== 便捷访问器 ====================
-            /**
-   * @description 位置
-   */ function get() {
-                return this.property.position;
-            },
-            set: function set(value) {
-                this.property.position = value;
-            }
-        },
-        {
-            key: "width",
-            get: /**
-   * @description 宽度
-   */ function get() {
-                return this.property.width;
-            },
-            set: function set(value) {
-                this.property.width = value;
-            }
-        },
-        {
-            key: "height",
-            get: /**
-   * @description 高度
-   */ function get() {
-                return this.property.height;
-            },
-            set: function set(value) {
-                this.property.height = value;
-            }
-        },
-        {
-            key: "rotation",
-            get: /**
-   * @description 旋转（二维旋转角度）
-   */ function get() {
-                return this.property.rotation[2];
-            },
-            set: function set(value) {
-                this.property.rotation[2] = value;
-            }
-        },
-        {
-            key: "fullRotation",
-            get: /**
-   * @description 完整旋转（包含 x, y, z）
-   */ function get() {
-                return this.property.rotation;
-            },
-            set: function set(value) {
-                this.property.rotation = value;
-            }
-        }
-    ]);
-    return CardItem;
-}(BaseItem);
-/**
- * @description 类型守卫：检查是否是 CardItem
- */ function isCardItem(obj) {
-    return _instanceof(obj, CardItem);
-}
-
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
     try {
         var info = gen[key](arg);
@@ -47317,7 +47185,7 @@ var SelectorGizmo = /*#__PURE__*/ function(Gizmo) {
         var preSelectedItem = this.pageDataUtils.getPreSelectedItem();
         var preSelectedItemBox = this.pageDataUtils.getViewBoxById((_ref = preSelectedItem == null ? void 0 : preSelectedItem.id) != null ? _ref : '');
         var _SDK_config_gestureHandlerConfig_selectorGizmoConfig = SDK.config.gestureHandlerConfig.selectorGizmoConfig, regionBoxColor = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.regionBoxColor, regionBoxAlpha = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.regionBoxAlpha, preSelectedWidth = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.preSelectedWidth, preSelectedColor = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.preSelectedColor, regionWireframeWidth = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.regionWireframeWidth, regionWireframeColor = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.regionWireframeColor, regionWireframeAlpha = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.regionWireframeAlpha;
-        if (!(preSelectedItemBox == null ? void 0 : preSelectedItemBox.isEmpty()) && !isCardItem(preSelectedItem)) {
+        if (!(preSelectedItemBox == null ? void 0 : preSelectedItemBox.isEmpty())) {
             this.graphics.lineStyle(preSelectedWidth, preSelectedColor);
             this.graphics.drawBox(preSelectedItemBox);
         }
@@ -55577,16 +55445,6 @@ var TransformGizmo = /*#__PURE__*/ function(Gizmo) {
                                 newWidth,
                                 newHeight
                             ], translation1);
-                        } else if (selectedItem && selectedItems.length === 1 && isCardItem(selectedItem)) {
-                            void this._pageDataUtils.setItemProperty({
-                                itemId: selectedItem.id,
-                                type: SDKItemType.CARD,
-                                property: {
-                                    width: selectedItem.width * resultScalar1.x,
-                                    height: selectedItem.height * resultScalar1.y
-                                }
-                            });
-                            this._pageDataUtils.moveItem(selectedItem.id, translation1);
                         } else {
                             // 普通元素的缩放逻辑
                             selectedItems.forEach(function(item) {
@@ -55911,7 +55769,6 @@ var TransformGizmo = /*#__PURE__*/ function(Gizmo) {
         var selectedItems = this._pageDataUtils.getSelectedItems();
         var isTemplateMode = SDK.config.mode === 'template';
         var selectedItem = selectedItems.length === 1 ? selectedItems[0] : undefined;
-        var isSingleCardItem = isCardItem(selectedItem);
         var isGeneratorItem = (selectedItem == null ? void 0 : selectedItem.type) === SDKItemType.GENERATOR;
         var isAutoLayoutFrame = (selectedItem == null ? void 0 : selectedItem.type) === SDKItemType.FRAME && (selectedItem == null ? void 0 : selectedItem.layoutMode) === FrameLayoutMode.AUTO;
         var canScale = selectedItems.length === 1 && (selectedItem == null ? void 0 : selectedItem.type) !== SDKItemType.GROUP && !isAutoLayoutFrame && !isGeneratorItem;
@@ -55951,11 +55808,9 @@ var TransformGizmo = /*#__PURE__*/ function(Gizmo) {
         this.wireframe.totalBox.copyFrom(box).expandByScalar(totalBoxExpandScalar);
         // 根据box获取边缘线
         var corners = this.wireframe.box.corners;
-        if (!isSingleCardItem) {
-            corners.forEach(function(corner, i) {
-                _this.wireframe.edges.push(new Line2(new Vector2().copyFrom(corner), new Vector2().copyFrom(corners[(i + 1) % 4])));
-            });
-        }
+        corners.forEach(function(corner, i) {
+            _this.wireframe.edges.push(new Line2(new Vector2().copyFrom(corner), new Vector2().copyFrom(corners[(i + 1) % 4])));
+        });
         var _SDK_config_gestureHandlerConfig_transformGizmoConfig = SDK.config.gestureHandlerConfig.transformGizmoConfig, scaleCircleSize = _SDK_config_gestureHandlerConfig_transformGizmoConfig.scaleCircleSize, rotationCircleSize = _SDK_config_gestureHandlerConfig_transformGizmoConfig.rotationCircleSize;
         // 成组暂不支持缩放
         if (selectedItems.length === 1) {
@@ -56748,6 +56603,10 @@ var cursorMap = {
         type: 'preset',
         content: 'crosshair'
     },
+    'box-select': {
+        type: 'preset',
+        content: 'crosshair'
+    },
     'text-rotation': {
         type: 'svg',
         content: 'default',
@@ -59806,6 +59665,12 @@ var MAX_ITEM_DISTANCE_THRESHOLD = 100000;
 /**
  * @description SDKItem position 属性的数字精度（保留小数位数）
  */ var POSITION_PRECISION = 4;
+function isCardHTMLContentValue(value) {
+    return (value == null ? void 0 : value.kind) === 'inline' || (value == null ? void 0 : value.kind) === 'dom' || (value == null ? void 0 : value.kind) === 'document';
+}
+function isCardHTMLValue(value) {
+    return isCardHTMLContentValue(value == null ? void 0 : value.content);
+}
 var PageDataUtils = /*#__PURE__*/ function() {
     function PageDataUtils(player, container, emitter, sdk) {
         this.player = player;
@@ -60623,10 +60488,11 @@ var PageDataUtils = /*#__PURE__*/ function() {
                 property: property
             }));
         } else if ((existingSDKItem == null ? void 0 : existingSDKItem.type) == SDKItemType.CARD) {
-            var cardType = existingSDKItem.cardType;
+            var cardType = existingSDKItem.cardType, html = existingSDKItem.html;
             sdkItem = new CardItem(_extends({}, baseOptions, {
                 property: _extends({}, property, {
-                    cardType: cardType
+                    cardType: cardType,
+                    html: html
                 })
             }));
         } else {
@@ -60853,19 +60719,6 @@ var PageDataUtils = /*#__PURE__*/ function() {
         }).call(this);
     };
     /**
-   * @description 设置元素extension字段
-   */ _proto.setItemExtension = function setItemExtension(itemId, extension) {
-        var item = this.getSDKItem(itemId);
-        if (!item) {
-            console.warn('setItemExtension: item not found');
-            return;
-        }
-        for(var _iterator = _create_for_of_iterator_helper_loose(Object.entries(extension)), _step; !(_step = _iterator()).done;){
-            var _step_value = _step.value, key = _step_value[0], value = _step_value[1];
-            item.extension.set(key, value);
-        }
-    };
-    /**
    * @description 场景 1: 设置单个元素的单个属性
    */ _proto.setSingleItemSingleProperty = function setSingleItemSingleProperty(param) {
         return _async_to_generator(function() {
@@ -61122,7 +60975,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
    * @description 更新 PlayerItem 的 Property 属性
    */ _proto.updatePlayerItemPropertyAttribute = function updatePlayerItemPropertyAttribute(playerItem, targetItem, propertyName, propertyValue) {
         return _async_to_generator(function() {
-            var _this, _playerItem_getComponent, _playerItem_getComponent1, color, _array_, array, family, textComponent, textComponent1, lineCount, textHeight, _playerItem_getComponent2, textComponent2, textHeight1, textComponent3, outlineColor, textComponent4, textComponent5, textComponent6, originFontSize, lineCount1, textHeight2, textComponent7, textHeight3, viewSize, worldSizeX, originSize, originChildBoxes, originBox, worldScaleX, originScale, originWidth, currentWidth, ratio, originScale1, textComponent8, originChildBoxes1, originBox1, worldScaleY, originScale2, originHeight, currentHeight, ratio1, originScale3, viewSize1, worldSizeY, originSize1, textComponent9, textHeight4, _playerItem_getComponent3, _, _playerItem_getComponent4, _1, _propertyValue_compositions_find, _ref, subCompositionItem, compositionId, mainComposition, effectsSize, viewSize2, worldSize, compositionItem, component, videoComponent, videoComponent1, videoComponent2, pixelTranslation, viewTranslation, translation, rotation, currentScale, scaleRatio, frameComponent, _SDK_config_itemConfig_frameConfig, freeLayoutBackgroundColor, autoLayoutBackgroundColor, color1, childrenItem, time;
+            var _this, _playerItem_getComponent, _playerItem_getComponent1, color, _array_, array, family, textComponent, textComponent1, lineCount, textHeight, _playerItem_getComponent2, textComponent2, textHeight1, textComponent3, outlineColor, textComponent4, textComponent5, textComponent6, originFontSize, lineCount1, textHeight2, textComponent7, textHeight3, viewSize, worldSizeX, originSize, originChildBoxes, originBox, worldScaleX, originScale, originWidth, currentWidth, ratio, originScale1, textComponent8, originChildBoxes1, originBox1, worldScaleY, originScale2, originHeight, currentHeight, ratio1, originScale3, viewSize1, worldSizeY, originSize1, textComponent9, textHeight4, _playerItem_getComponent3, _, _playerItem_getComponent4, _1, _propertyValue_compositions_find, _ref, subCompositionItem, compositionId, mainComposition, effectsSize, viewSize2, worldSize, compositionItem, component, videoPlayStates, videoComponent, videoComponent1, videoComponent2, pixelTranslation, viewTranslation, translation, rotation, currentScale, scaleRatio, frameComponent, _SDK_config_itemConfig_frameConfig, freeLayoutBackgroundColor, autoLayoutBackgroundColor, color1, childrenItem, time, videoPlayStates1;
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
@@ -61223,35 +61076,40 @@ var PageDataUtils = /*#__PURE__*/ function() {
                                     3,
                                     31
                                 ];
-                            case 'position':
+                            case 'html':
                                 return [
                                     3,
                                     32
                                 ];
-                            case 'rotation':
+                            case 'position':
                                 return [
                                     3,
                                     33
                                 ];
-                            case 'scale':
+                            case 'rotation':
                                 return [
                                     3,
                                     34
                                 ];
-                            case 'layoutMode':
+                            case 'scale':
                                 return [
                                     3,
                                     35
                                 ];
-                            case 'visible':
+                            case 'layoutMode':
                                 return [
                                     3,
                                     36
                                 ];
+                            case 'visible':
+                                return [
+                                    3,
+                                    37
+                                ];
                         }
                         return [
                             3,
-                            37
+                            38
                         ];
                     case 1:
                         {
@@ -61264,7 +61122,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 2:
@@ -61275,7 +61133,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 3:
@@ -61307,7 +61165,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                     case 5:
                         return [
                             3,
-                            38
+                            39
                         ];
                     case 6:
                         {
@@ -61324,7 +61182,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 7:
@@ -61338,7 +61196,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 8:
@@ -61351,7 +61209,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 9:
@@ -61365,7 +61223,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 10:
@@ -61378,7 +61236,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 11:
@@ -61391,7 +61249,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 12:
@@ -61411,7 +61269,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 13:
@@ -61453,7 +61311,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 14:
@@ -61488,7 +61346,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 15:
@@ -61502,7 +61360,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 16:
@@ -61534,7 +61392,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                     case 20:
                         return [
                             3,
-                            38
+                            39
                         ];
                     case 21:
                         if (!(typeof propertyValue === 'string' && playerItem.type === EFFECTS.spec.ItemType.video)) return [
@@ -61565,7 +61423,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                     case 25:
                         return [
                             3,
-                            38
+                            39
                         ];
                     case 26:
                         if (!(playerItem.type === EFFECTS.spec.ItemType.null)) return [
@@ -61605,12 +61463,15 @@ var PageDataUtils = /*#__PURE__*/ function() {
                         compositionItem.parentId = playerItem.getInstanceId();
                         component = compositionItem.components[0];
                         component == null ? void 0 : component.pause();
+                        // 刷新前快照视频播放态，刷新后恢复，避免更换特效导致全量视频被自动播放
+                        videoPlayStates = this.snapshotVideoPlayStates();
                         this.sdk.player.gotoAndPlay(0);
+                        this.restoreVideoPlayStates(videoPlayStates);
                         _state.label = 28;
                     case 28:
                         return [
                             3,
-                            38
+                            39
                         ];
                     case 29:
                         {
@@ -61622,7 +61483,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 30:
@@ -61635,7 +61496,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 31:
@@ -61648,10 +61509,20 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
                     case 32:
+                        {
+                            if (isCardItem(targetItem)) {
+                                targetItem.html = isCardHTMLValue(propertyValue) ? propertyValue : undefined;
+                            }
+                            return [
+                                3,
+                                39
+                            ];
+                        }
+                    case 33:
                         {
                             if (Array.isArray(propertyValue) && propertyValue.length === 2) {
                                 pixelTranslation = propertyValue.map(function(v, i) {
@@ -61664,10 +61535,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
-                    case 33:
+                    case 34:
                         {
                             if (Array.isArray(propertyValue) && propertyValue.length === 3) {
                                 rotation = propertyValue.map(function(v, i) {
@@ -61678,10 +61549,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
-                    case 34:
+                    case 35:
                         {
                             if (Array.isArray(propertyValue) && propertyValue.length === 2) {
                                 currentScale = targetItem.property.scale;
@@ -61695,10 +61566,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
-                    case 35:
+                    case 36:
                         {
                             if (propertyValue === FrameLayoutMode.AUTO || propertyValue === FrameLayoutMode.FREE) {
                                 frameComponent = playerItem.getComponent(EFFECTS.FrameComponent);
@@ -61708,10 +61579,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
-                    case 36:
+                    case 37:
                         {
                             if (typeof propertyValue === 'boolean') {
                                 playerItem.setVisible(propertyValue);
@@ -61724,10 +61595,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             }
                             return [
                                 3,
-                                38
+                                39
                             ];
                         }
-                    case 37:
+                    case 38:
                         {
                             console.log('ignore property name ', propertyName);
                             // 对于未明确处理的属性，尝试直接设置到 property 对象
@@ -61735,8 +61606,8 @@ var PageDataUtils = /*#__PURE__*/ function() {
                                 targetItem.property[propertyName] = propertyValue;
                             }
                         }
-                        _state.label = 38;
-                    case 38:
+                        _state.label = 39;
+                    case 39:
                         // 非位置属性需要刷新播放器
                         // template 模式下保持暂停态以避免播放器自动播放，editor 模式继续推进
                         if (![
@@ -61745,11 +61616,14 @@ var PageDataUtils = /*#__PURE__*/ function() {
                             'size'
                         ].includes(propertyName)) {
                             time = this.sdk.pageData.time;
+                            // 刷新前快照视频播放态，刷新后恢复，避免设置属性导致全量视频被自动播放
+                            videoPlayStates1 = this.snapshotVideoPlayStates();
                             if (SDK.config.mode === 'editor') {
                                 this.player.gotoAndPlay(time);
                             } else {
                                 this.player.gotoAndStop(time);
                             }
+                            this.restoreVideoPlayStates(videoPlayStates1);
                         }
                         return [
                             2
@@ -62616,10 +62490,6 @@ var PageDataUtils = /*#__PURE__*/ function() {
                     }
                     break;
                 }
-            case 'cardType':
-                {
-                    break;
-                }
             default:
                 {
                     console.warn("Target property " + propertyName + " can not be changed.");
@@ -63212,15 +63082,12 @@ var PageDataUtils = /*#__PURE__*/ function() {
         var _cardInfo_name = cardInfo.name, name = _cardInfo_name === void 0 ? '卡片' : _cardInfo_name, _cardInfo_property = cardInfo.property, width = _cardInfo_property.width, height = _cardInfo_property.height, _cardInfo_property_scale = _cardInfo_property.scale, scale = _cardInfo_property_scale === void 0 ? [
             1,
             1
-        ] : _cardInfo_property_scale, cardType = _cardInfo_property.cardType, tmp = _cardInfo_property.rotation, sourceRotation = tmp === void 0 ? 0 : tmp, sourcePosition = _cardInfo_property.position, parentId = cardInfo.parentId, _cardInfo_id = cardInfo.id, id = _cardInfo_id === void 0 ? EFFECTS.generateGUID() : _cardInfo_id, extension = cardInfo.extension;
+        ] : _cardInfo_property_scale, cardType = _cardInfo_property.cardType, tmp = _cardInfo_property.rotation, sourceRotation = tmp === void 0 ? 0 : tmp, sourcePosition = _cardInfo_property.position, autoHeight = _cardInfo_property.autoHeight, html = _cardInfo_property.html, parentId = cardInfo.parentId, _cardInfo_id = cardInfo.id, id = _cardInfo_id === void 0 ? EFFECTS.generateGUID() : _cardInfo_id, extension = cardInfo.extension;
         // 校验 cardType 是否已在配置中注册
-        var cardTypeConfig = SDK.config.itemConfig.cardConfig.cardTypes.find(function(t) {
-            return t.type === cardType;
-        });
         var registeredTypes = SDK.config.itemConfig.cardConfig.cardTypes.map(function(t) {
             return t.type;
         });
-        if (!cardTypeConfig) {
+        if (!registeredTypes.includes(cardType)) {
             console.warn('CardItem cardType "' + cardType + '" is not registered. Registered types: ' + registeredTypes.join(', '));
             return;
         }
@@ -63264,7 +63131,9 @@ var PageDataUtils = /*#__PURE__*/ function() {
                 width: width,
                 height: height,
                 scale: [].concat(scale),
-                cardType: cardType
+                cardType: cardType,
+                autoHeight: autoHeight,
+                html: html
             },
             extension: extension
         });
@@ -64646,7 +64515,8 @@ var PageDataUtils = /*#__PURE__*/ function() {
                                 scalar.y
                             ],
                             rotation: [].concat(rotation),
-                            position: [].concat(resultPosition)
+                            position: [].concat(resultPosition),
+                            html: sdkItem.html
                         },
                         extension: extension
                     };
@@ -64731,7 +64601,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                         };
                         addTextItemIntoNewScene = function addTextItemIntoNewScene(textCreateInfo, sceneSize, itemViewPosition) {
                             var _scene_fonts;
-                            var _textCreateInfo_id = textCreateInfo.id, id = _textCreateInfo_id === void 0 ? EFFECTS.generateGUID() : _textCreateInfo_id, _textCreateInfo_name = textCreateInfo.name, name = _textCreateInfo_name === void 0 ? '文本' : _textCreateInfo_name, _textCreateInfo_property = textCreateInfo.property, lineHeight = _textCreateInfo_property.lineHeight, textWidth = _textCreateInfo_property.width, tmp = _textCreateInfo_property.height, textHeight = tmp === void 0 ? lineHeight : tmp, fontFamily = _textCreateInfo_property.fontFamily, fontSize = _textCreateInfo_property.fontSize, _textCreateInfo_property_fontWeight = _textCreateInfo_property.fontWeight, fontWeight = _textCreateInfo_property_fontWeight === void 0 ? EFFECTS.spec.TextWeight.normal : _textCreateInfo_property_fontWeight, _textCreateInfo_property_fontStyle = _textCreateInfo_property.fontStyle, fontStyle = _textCreateInfo_property_fontStyle === void 0 ? EFFECTS.spec.FontStyle.normal : _textCreateInfo_property_fontStyle, _textCreateInfo_property_textAlign = _textCreateInfo_property.textAlign, textAlign = _textCreateInfo_property_textAlign === void 0 ? EFFECTS.spec.TextAlignment.left : _textCreateInfo_property_textAlign, text = _textCreateInfo_property.text, textColor = _textCreateInfo_property.color, tmp1 = _textCreateInfo_property.rotation, sourceRotation = tmp1 === void 0 ? 0 : tmp1, url = _textCreateInfo_property.fontUrl, outlineColor = _textCreateInfo_property.outlineColor, outlineWidth = _textCreateInfo_property.outlineWidth, outlineEnabled = _textCreateInfo_property.outlineEnabled;
+                            var _textCreateInfo_id = textCreateInfo.id, id = _textCreateInfo_id === void 0 ? EFFECTS.generateGUID() : _textCreateInfo_id, _textCreateInfo_name = textCreateInfo.name, name = _textCreateInfo_name === void 0 ? '文本' : _textCreateInfo_name, _textCreateInfo_property = textCreateInfo.property, lineHeight = _textCreateInfo_property.lineHeight, textWidth = _textCreateInfo_property.width, tmp = _textCreateInfo_property.height, textHeight = tmp === void 0 ? lineHeight : tmp, fontFamily = _textCreateInfo_property.fontFamily, fontSize = _textCreateInfo_property.fontSize, _textCreateInfo_property_fontWeight = _textCreateInfo_property.fontWeight, fontWeight = _textCreateInfo_property_fontWeight === void 0 ? EFFECTS.spec.TextWeight.normal : _textCreateInfo_property_fontWeight, _textCreateInfo_property_fontStyle = _textCreateInfo_property.fontStyle, fontStyle = _textCreateInfo_property_fontStyle === void 0 ? EFFECTS.spec.FontStyle.normal : _textCreateInfo_property_fontStyle, _textCreateInfo_property_textAlign = _textCreateInfo_property.textAlign, textAlign = _textCreateInfo_property_textAlign === void 0 ? EFFECTS.spec.TextAlignment.left : _textCreateInfo_property_textAlign, text = _textCreateInfo_property.text, textColor = _textCreateInfo_property.color, tmp1 = _textCreateInfo_property.rotation, sourceRotation = tmp1 === void 0 ? 0 : tmp1, url = _textCreateInfo_property.fontUrl, outlineColor = _textCreateInfo_property.outlineColor, outlineWidth = _textCreateInfo_property.outlineWidth, outlineEnabled = _textCreateInfo_property.outlineEnabled, letterSpacing = _textCreateInfo_property.letterSpacing;
                             var rotation = Array.isArray(sourceRotation) ? [].concat(sourceRotation) : [
                                 0,
                                 0,
@@ -64761,7 +64631,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                                 fontSize: fontSize,
                                 textColor: resutlTextColor,
                                 fontWeight: fontWeight,
-                                letterSpace: 0,
+                                letterSpace: letterSpacing,
                                 textAlign: textAlign,
                                 fontStyle: fontStyle,
                                 textWidth: textWidth,
@@ -65692,7 +65562,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                         _this = this;
                         changeProeprty = function changeProeprty(targetCreateInfo) {
                             return _async_to_generator(function() {
-                                var currentCreateInfo, itemId;
+                                var currentCreateInfo;
                                 return _ts_generator(this, function(_state) {
                                     switch(_state.label){
                                         case 0:
@@ -65703,20 +65573,16 @@ var PageDataUtils = /*#__PURE__*/ function() {
                                                     2
                                                 ];
                                             }
-                                            itemId = targetCreateInfo.id;
                                             return [
                                                 4,
                                                 this.setItemProperty({
-                                                    itemId: itemId,
+                                                    itemId: currentCreateInfo.id,
                                                     type: currentCreateInfo.type,
                                                     property: targetCreateInfo.property
                                                 })
                                             ];
                                         case 1:
                                             _state.sent();
-                                            if (targetCreateInfo.extension) {
-                                                this.setItemExtension(itemId, targetCreateInfo.extension);
-                                            }
                                             return [
                                                 2
                                             ];
@@ -65772,6 +65638,51 @@ var PageDataUtils = /*#__PURE__*/ function() {
         var result = box.clone().scale(scale, center).translate(translation);
         return result;
     };
+    /**
+   * @description 快照当前所有视频元素的播放状态（播放/暂停 + 当前播放进度），用于属性刷新后恢复，
+   *  避免设置属性导致全量视频被自动播放或进度被重置回 0s
+   */ _proto.snapshotVideoPlayStates = function snapshotVideoPlayStates() {
+        var states = new Map();
+        var composition = this.getCurrentComposition();
+        for(var _iterator = _create_for_of_iterator_helper_loose(composition.items), _step; !(_step = _iterator()).done;){
+            var item = _step.value;
+            if (item.type === EFFECTS.spec.ItemType.video) {
+                var videoComponent = item.getComponent(VideoComponent);
+                if (!videoComponent) {
+                    continue;
+                }
+                //@ts-expect-error @赤芍 played 字段未在类型中声明，参见 rebuildCompositionItems 处用法
+                var played = !!videoComponent.played;
+                var time = videoComponent.getCurrentTime();
+                states.set(item.getInstanceId(), {
+                    played: played,
+                    time: time
+                });
+            }
+        }
+        return states;
+    };
+    /**
+   * @description 按快照恢复视频元素的播放状态（先 pause 再 seek，最后按原状态 play/pause，避免进度抖动）
+   */ _proto.restoreVideoPlayStates = function restoreVideoPlayStates(states) {
+        for(var _iterator = _create_for_of_iterator_helper_loose(states), _step; !(_step = _iterator()).done;){
+            var _step_value = _step.value, id = _step_value[0], _step_value_ = _step_value[1], played = _step_value_.played, time = _step_value_.time;
+            var playerItem = this.getPlayerItemById(id);
+            if ((playerItem == null ? void 0 : playerItem.type) !== EFFECTS.spec.ItemType.video) {
+                continue;
+            }
+            var videoComponent = playerItem.getComponent(VideoComponent);
+            if (!videoComponent) {
+                continue;
+            }
+            // 先暂停再 seek，避免播放状态下 seek 导致画面抖动
+            videoComponent.pauseVideo();
+            videoComponent.setCurrentTime(time);
+            if (played) {
+                videoComponent.playVideo();
+            }
+        }
+    };
     _proto.playVideoItem = function playVideoItem(id) {
         var playerItem = this.getPlayerItemById(id);
         if ((playerItem == null ? void 0 : playerItem.type) !== EFFECTS.spec.ItemType.video) {
@@ -66034,56 +65945,35 @@ var PageDataUtils = /*#__PURE__*/ function() {
     };
     _proto.asyncAddItemByCreateInfos = function asyncAddItemByCreateInfos(createInfos) {
         return _async_to_generator(function() {
-            var _loop, _this, createInfoWithIds, itemToTextureInfo, _iterator, _step, toAddedCreateInfo, groupCreateInfos, frameCreateInfos, ids, composition, loadTexture;
+            var _this, createInfoWithIds, itemToTextureInfo, _iterator, _step, createInfo, id, type, url, textureId, toAddedCreateInfo, groupCreateInfos, frameCreateInfos, ids, composition, loadTexture;
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
-                        _loop = function() {
-                            var createInfo = _step.value;
-                            var _ref = function() {
-                                switch(createInfo.type){
-                                    case SDKItemType.SPRITE:
-                                        {
-                                            return {
-                                                url: createInfo.property.image,
-                                                type: 'image'
-                                            };
-                                        }
-                                    case SDKItemType.VIDEO:
-                                        {
-                                            return {
-                                                url: createInfo.property.video,
-                                                type: 'video'
-                                            };
-                                        }
-                                    default:
-                                        {
-                                            return {};
-                                        }
-                                }
-                            }(), url = _ref.url, type = _ref.type;
-                            if (url && type) {
-                                var textureId = EFFECTS.generateGUID();
-                                itemToTextureInfo.set(createInfo.id, {
+                        _this = this;
+                        createInfoWithIds = createInfos.map(function(createInfo) {
+                            return Object.assign({}, createInfo, createInfo.id ? {} : {
+                                id: EFFECTS.generateGUID()
+                            });
+                        });
+                        itemToTextureInfo = new Map();
+                        // 预处理所有 createInfo，分配 textureId
+                        for(_iterator = _create_for_of_iterator_helper_loose(createInfoWithIds); !(_step = _iterator()).done;){
+                            createInfo = _step.value;
+                            id = createInfo.id;
+                            type = createInfo.type;
+                            url = type === SDKItemType.SPRITE ? createInfo.property.image : type === SDKItemType.VIDEO ? createInfo.property.video : undefined;
+                            if ((type === SDKItemType.SPRITE || type === SDKItemType.VIDEO) && url) {
+                                textureId = EFFECTS.generateGUID();
+                                itemToTextureInfo.set(id, {
                                     id: textureId,
                                     url: url,
-                                    type: type
+                                    type: type === SDKItemType.SPRITE ? 'image' : 'video'
                                 });
                                 Object.assign(createInfo, {
                                     textureId: textureId
                                 });
                             }
-                        };
-                        _this = this;
-                        createInfoWithIds = createInfos.map(function(createInfo) {
-                            var _createInfo_id;
-                            return Object.assign({}, createInfo, {
-                                id: (_createInfo_id = createInfo.id) != null ? _createInfo_id : EFFECTS.generateGUID()
-                            });
-                        });
-                        itemToTextureInfo = new Map();
-                        // 预处理所有 createInfo，分配 textureId
-                        for(_iterator = _create_for_of_iterator_helper_loose(createInfoWithIds); !(_step = _iterator()).done;)_loop();
+                        }
                         // 并行创建所有 item
                         toAddedCreateInfo = createInfoWithIds.filter(function(createInfo) {
                             return ![
@@ -67358,7 +67248,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
     };
     _proto.autoLayoutPage = function autoLayoutPage() {
         return _async_to_generator(function(param) {
-            var _this, pageData, _param_mode, mode, ids, _param_focus, focus, _param_gap, gap, isPartialLayout, targetItems, layoutElements, moveInfos, anchor, _iterator, _step, moveInfo, sdkItem;
+            var _this, pageData, _param_mode, mode, ids, _param_focus, focus, _param_gap, gap, shift, isPartialLayout, targetItems, layoutElements, moveInfos, anchor, _iterator, _step, moveInfo, sdkItem;
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
@@ -67373,7 +67263,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                                 2
                             ];
                         }
-                        _param_mode = param.mode, mode = _param_mode === void 0 ? SDK.config.pageConfig.autoLayoutDefaultMode : _param_mode, ids = param.ids, _param_focus = param.focus, focus = _param_focus === void 0 ? true : _param_focus, _param_gap = param.gap, gap = _param_gap === void 0 ? SDK.config.pageConfig.autoLayoutDefaultGap : _param_gap;
+                        _param_mode = param.mode, mode = _param_mode === void 0 ? SDK.config.pageConfig.autoLayoutDefaultMode : _param_mode, ids = param.ids, _param_focus = param.focus, focus = _param_focus === void 0 ? true : _param_focus, _param_gap = param.gap, gap = _param_gap === void 0 ? SDK.config.pageConfig.autoLayoutDefaultGap : _param_gap, shift = param.shift;
                         isPartialLayout = !!(ids == null ? void 0 : ids.length);
                         // 1. 确定参与排布的顶层元素（过滤子元素）
                         targetItems = pageData.items.filter(function(item) {
@@ -67402,7 +67292,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                         // 4. 计算锚点偏移
                         // - 选中元素排布：以原始包围盒左上角为锚点
                         // - 全量排布：以视口中心为锚点
-                        anchor = isPartialLayout ? this.getPartialLayoutAnchor(layoutElements, moveInfos.boundingBox) : this.getGlobalLayoutAnchor(moveInfos.boundingBox);
+                        anchor = isPartialLayout ? this.getPartialLayoutAnchor(layoutElements, moveInfos.boundingBox) : this.getGlobalLayoutAnchor(moveInfos.boundingBox, shift);
                         _iterator = _create_for_of_iterator_helper_loose(moveInfos.items);
                         _state.label = 1;
                     case 1:
@@ -67445,7 +67335,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
                         if (focus) {
                             this.setPageZoom(1, undefined, true);
                             this.setPageMove(new Vector2());
-                            this.viewportFit(undefined, moveInfos.boundingBox.translate(anchor));
+                            this.viewportFit(shift, moveInfos.boundingBox.translate(anchor));
                         }
                         return [
                             2
@@ -67469,8 +67359,9 @@ var PageDataUtils = /*#__PURE__*/ function() {
     /**
    * @description 计算全量排布的锚点偏移：以视口中心为锚点
    * @param layoutBoundingBox 排布算法输出的包围盒
-   */ _proto.getGlobalLayoutAnchor = function getGlobalLayoutAnchor(layoutBoundingBox) {
-        var viewCenter = new Vector2(this.sdk._container.offsetWidth / 2, this.sdk._container.offsetHeight / 2);
+   */ _proto.getGlobalLayoutAnchor = function getGlobalLayoutAnchor(layoutBoundingBox, shift) {
+        var _ref = shift != null ? shift : {}, _ref_top = _ref.top, top = _ref_top === void 0 ? 0 : _ref_top, _ref_bottom = _ref.bottom, bottom = _ref_bottom === void 0 ? 0 : _ref_bottom, _ref_left = _ref.left, left = _ref_left === void 0 ? 0 : _ref_left, _ref_right = _ref.right, right = _ref_right === void 0 ? 0 : _ref_right;
+        var viewCenter = new Vector2(this.sdk._container.offsetWidth / 2 + left - right, this.sdk._container.offsetHeight / 2 + top - bottom);
         var boundCenter = layoutBoundingBox.getCenter();
         return new Vector2(viewCenter.x - boundCenter.x, viewCenter.y - boundCenter.y);
     };
@@ -69072,6 +68963,8 @@ var MaskGizmo = /*#__PURE__*/ function(Gizmo) {
    */ _this.maskSprite = null, _this._config = {}, _this.boxGraphics = new Graphics(), _this.type = 'mask', _this.mode = 'paint', /**
    * 蒙版工具独立的撤销重做实例
    */ _this._undoRedo = new GizmoUndoRedo(), /**
+   * 框选擦除进行中标记（按下到松开之间），用于实时选框描边的显示控制
+   */ _this._isBoxErasing = false, /**
    * 鼠标状态绘制结果
    */ _this.cursorResult = {
             type: 'normal',
@@ -69088,10 +68981,22 @@ var MaskGizmo = /*#__PURE__*/ function(Gizmo) {
     var _proto = MaskGizmo.prototype;
     /**
    * 设置模式
-   * @param mode 模式类型：'paint' 表示涂抹，'erase' 表示擦除
+   * @param mode 模式类型：'paint' 笔刷涂抹、'erase' 笔刷逐笔擦除、'box-erase' 框选擦除、'box-paint' 框选涂抹
    */ _proto.setMode = function setMode(mode) {
         this.mode = mode;
     };
+    /**
+   * @description 判断点是否在包围盒内
+   */ _proto._isPointInBox = function _isPointInBox(p, box) {
+        return p.x >= box.min.x && p.x <= box.max.x && p.y >= box.min.y && p.y <= box.max.y;
+    };
+    /**
+   * @description 将屏幕坐标转换为包围盒内的归一化坐标 [0,1]（钳制在范围内）
+   */ _proto._toNormalized = function _toNormalized(p, box) {
+        var x = Math.max(0, Math.min(1, (p.x - box.min.x) / (box.max.x - box.min.x)));
+        var y = Math.max(0, Math.min(1, (p.y - box.min.y) / (box.max.y - box.min.y)));
+        return new Vector2(x, y);
+    };
     _proto.initialize = function initialize() {};
     _proto.preparationAction = function preparationAction(event) {
         if (!this.interactive) {
@@ -69110,6 +69015,26 @@ var MaskGizmo = /*#__PURE__*/ function(Gizmo) {
         };
         // 更新鼠标位置
         this.result.point = new Vector2(event.offsetX, event.offsetY);
+        // 框选模式（框选擦除 / 框选涂抹）：仅在元素包围盒内按下才触发
+        if (this.mode === 'box-erase' || this.mode === 'box-paint') {
+            var box = this.result.box;
+            if (!box || !this._isPointInBox(this.result.point, box)) {
+                // 包围盒外按下：不触发框选，交由其它 gizmo
+                return undefined;
+            }
+            var start = this._toNormalized(this.result.point, box);
+            this.result.lines.push({
+                type: this.mode === 'box-paint' ? 'paint' : 'erase',
+                shape: 'rect',
+                brushSize: 0,
+                points: [
+                    start,
+                    start.clone()
+                ]
+            });
+            this._isBoxErasing = true;
+            return this.type;
+        }
         // 开启新画笔
         this.result.lines.push({
             type: this.mode,
@@ -69119,32 +69044,61 @@ var MaskGizmo = /*#__PURE__*/ function(Gizmo) {
         return this.type;
     };
     _proto.action = function action(event) {
-        var // 记录鼠标划线位置
-        _this_result_lines_;
         if (!this.interactive || this.result.status === 'init') {
             return;
         }
         // 更新鼠标位置
         var box = this.result.box;
-        var point = new Vector2((event.offsetX - box.min.x) / (box.max.x - box.min.x), (event.offsetY - box.min.y) / (box.max.y - box.min.y));
-        (_this_result_lines_ = this.result.lines[this.result.lines.length - 1]) == null ? void 0 : _this_result_lines_.points.push(point);
+        var point = new Vector2(event.offsetX, event.offsetY);
+        this.result.point = point;
+        var lastLine = this.result.lines[this.result.lines.length - 1];
+        // 框选擦除：更新框选终点（钳制到包围盒内）
+        if ((lastLine == null ? void 0 : lastLine.shape) === 'rect') {
+            lastLine.points[1] = this._toNormalized(point, box);
+            return;
+        }
+        // 记录鼠标划线位置（笔刷模式）
+        var np = new Vector2((event.offsetX - box.min.x) / (box.max.x - box.min.x), (event.offsetY - box.min.y) / (box.max.y - box.min.y));
+        lastLine == null ? void 0 : lastLine.points.push(np);
     };
     _proto.endAction = function endAction() {
         if (!this.interactive) {
             return undefined;
         }
-        // 记录操作到 undoRedo（仅当画线有实际点时才记录）
         var lastLine = this.result.lines[this.result.lines.length - 1];
+        // 框选擦除：起点==终点视为空框选，移除；否则提交 undoRedo
+        if ((lastLine == null ? void 0 : lastLine.shape) === 'rect') {
+            this._isBoxErasing = false;
+            var _lastLine_points = lastLine.points, a = _lastLine_points[0], b = _lastLine_points[1];
+            var isEmpty = !!a && !!b && a.x === b.x && a.y === b.y;
+            if (this._oldLines && !isEmpty) {
+                var operation = {
+                    type: 'update',
+                    oldData: this._oldLines,
+                    newData: {
+                        lines: JSON.parse(JSON.stringify(this.result.lines))
+                    }
+                };
+                this._undoRedo.push(operation);
+                this._eventEmitter.emit('maskGizmoUndoRedoChange', operation);
+            } else {
+                // 空框选移除
+                this.result.lines.pop();
+            }
+            this._oldLines = undefined;
+            return this.type;
+        }
+        // 记录操作到 undoRedo（仅当画线有实际点时才记录）
         if (this._oldLines && lastLine && lastLine.points.length > 0) {
-            var operation = {
+            var operation1 = {
                 type: 'update',
                 oldData: this._oldLines,
                 newData: {
                     lines: JSON.parse(JSON.stringify(this.result.lines))
                 }
             };
-            this._undoRedo.push(operation);
-            this._eventEmitter.emit('maskGizmoUndoRedoChange', operation);
+            this._undoRedo.push(operation1);
+            this._eventEmitter.emit('maskGizmoUndoRedoChange', operation1);
         } else if ((lastLine == null ? void 0 : lastLine.points.length) === 0) {
             // 如果没有实际绘制点，移除空的线条
             this.result.lines.pop();
@@ -69269,6 +69223,17 @@ var MaskGizmo = /*#__PURE__*/ function(Gizmo) {
         this.boxGraphics.lineStyle(boxLineWidth, boxLineColor, boxLineAlpha);
         this.boxGraphics.drawBox(box);
         this.boxGraphics.endFill();
+        // 框选擦除进行中：叠加当前拖动矩形的可视描边
+        var lastLine = this.result.lines[this.result.lines.length - 1];
+        if (this._isBoxErasing && (lastLine == null ? void 0 : lastLine.shape) === 'rect' && lastLine.points.length >= 2) {
+            var _lastLine_points = lastLine.points, a = _lastLine_points[0], b = _lastLine_points[1];
+            if (a && b) {
+                var selBox = new Box2(new Vector2(box.min.x + Math.min(a.x, b.x) * (box.max.x - box.min.x), box.min.y + Math.min(a.y, b.y) * (box.max.y - box.min.y)), new Vector2(box.min.x + Math.max(a.x, b.x) * (box.max.x - box.min.x), box.min.y + Math.max(a.y, b.y) * (box.max.y - box.min.y)));
+                this.boxGraphics.lineStyle(boxLineWidth, boxLineColor, boxLineAlpha);
+                this.boxGraphics.drawBox(selBox);
+                this.boxGraphics.endFill();
+            }
+        }
         // 1. 画线形（只用于遮罩，不直接显示
         for(var _iterator = _create_for_of_iterator_helper_loose(this.result.lines), _step; !(_step = _iterator()).done;){
             var line = _step.value;
@@ -69276,6 +69241,32 @@ var MaskGizmo = /*#__PURE__*/ function(Gizmo) {
                 continue;
             }
             var lineGraphics = new Graphics();
+            // 矩形框选：填充矩形，paint 用 NORMAL 叠加，erase 用 DST_OUT 抠除
+            if (line.shape === 'rect') {
+                var a1 = line.points[0];
+                var b1 = line.points[1];
+                if (a1 && b1) {
+                    var w = box.max.x - box.min.x;
+                    var h = box.max.y - box.min.y;
+                    var x0 = Math.min(a1.x, b1.x) * w;
+                    var y0 = Math.min(a1.y, b1.y) * h;
+                    var x1 = Math.max(a1.x, b1.x) * w;
+                    var y1 = Math.max(a1.y, b1.y) * h;
+                    // 太小（纯点击）不渲染，避免 1px 擦除/涂抹点
+                    if (x1 - x0 > 0.5 || y1 - y0 > 0.5) {
+                        lineGraphics.beginFill(brushColor);
+                        lineGraphics.drawRect(x0, y0, x1 - x0, y1 - y0);
+                        lineGraphics.endFill();
+                        lineGraphics.blendMode = line.type === 'paint' ? BLEND_MODES.NORMAL : BLEND_MODES.DST_OUT;
+                        this._app.renderer.render(lineGraphics, {
+                            renderTexture: this.maskRenderTexture,
+                            clear: false
+                        });
+                    }
+                }
+                lineGraphics.destroy();
+                continue;
+            }
             lineGraphics.blendMode = line.type === 'paint' ? BLEND_MODES.NORMAL : BLEND_MODES.DST_OUT;
             lineGraphics.lineStyle({
                 width: line.brushSize * viewportParam.scale,
@@ -69319,14 +69310,24 @@ var MaskGizmo = /*#__PURE__*/ function(Gizmo) {
         if (!point || !box) {
             return;
         }
-        if (point.x >= box.min.x && point.x <= box.max.x && point.y >= box.min.y && point.y <= box.max.y) {
-            var viewportParam = this._pageDataUtils.interactionUtils.viewportParam;
+        var inside = point.x >= box.min.x && point.x <= box.max.x && point.y >= box.min.y && point.y <= box.max.y;
+        if (!inside) {
+            return;
+        }
+        // 框选模式（框选擦除 / 框选涂抹）：crosshair
+        if (this.mode === 'box-erase' || this.mode === 'box-paint') {
             this.cursorResult = {
-                type: 'circle',
-                angle: 0,
-                radius: this.config.brushSize * viewportParam.scale / 2
+                type: 'box-select',
+                angle: 0
             };
+            return;
         }
+        var viewportParam = this._pageDataUtils.interactionUtils.viewportParam;
+        this.cursorResult = {
+            type: 'circle',
+            angle: 0,
+            radius: this.config.brushSize * viewportParam.scale / 2
+        };
     };
     _proto.close = function close() {
         this._config.maskImage = undefined;
@@ -69474,6 +69475,21 @@ var MaskGizmo = /*#__PURE__*/ function(Gizmo) {
             if (!line || line.points.length === 0) {
                 continue;
             }
+            // 矩形框选：填充矩形
+            if (line.shape === 'rect') {
+                var _line_points = line.points, a = _line_points[0], b1 = _line_points[1];
+                if (!a || !b1) {
+                    continue;
+                }
+                var x0 = Math.min(a.x, b1.x) * width;
+                var y0 = Math.min(a.y, b1.y) * height;
+                var x1 = Math.max(a.x, b1.x) * width;
+                var y1 = Math.max(a.y, b1.y) * height;
+                ctx.globalCompositeOperation = 'source-over';
+                ctx.fillStyle = line.type === 'paint' ? maskHexColor : maskBackgroundHexColor;
+                ctx.fillRect(x0, y0, Math.max(1, x1 - x0), Math.max(1, y1 - y0));
+                continue;
+            }
             ctx.lineWidth = line.brushSize * scale;
             ctx.lineCap = 'round';
             ctx.lineJoin = 'round';
@@ -71479,7 +71495,8 @@ var GestureHandler = /*#__PURE__*/ function() {
             'active-hand',
             'pointer',
             'text-create',
-            'frame-create'
+            'frame-create',
+            'box-select'
         ].includes(result.type)) {
             var cursor = cursorMap[result.type];
             if (cursor.type === 'svg') {
@@ -71651,6 +71668,7 @@ var GestureHandler = /*#__PURE__*/ function() {
             return;
         }
         this.maskGizmo.setMode(mode);
+        this.render();
     };
     _proto.openLoadingGizmo = function openLoadingGizmo(id, options) {
         var _this__emitter;
@@ -83256,12 +83274,43 @@ var BaseConfig = {
         },
         cardConfig: {
             backgroundColor: [
-                1,
-                1,
-                1,
-                0
+                0.6,
+                0.6,
+                0.6,
+                0.12
             ],
-            cardTypes: []
+            cardTypes: [
+                {
+                    type: 'character',
+                    label: '角色图',
+                    iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
+                },
+                {
+                    type: 'environment',
+                    label: '环境图',
+                    iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
+                },
+                {
+                    type: 'storyboard',
+                    label: '分镜图',
+                    iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
+                },
+                {
+                    type: 'scene-clip',
+                    label: '场景剪辑',
+                    iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
+                },
+                {
+                    type: 'video-compose',
+                    label: '视频合成',
+                    iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
+                },
+                {
+                    type: 'video-generate',
+                    label: '生成视频',
+                    iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
+                }
+            ]
         }
     }
 };
@@ -91590,18 +91639,11 @@ function isCardHTMLAutoHeightMessage(data, id) {
     var message = data;
     return message.source === 'vvfx-card-html-auto-height' && message.id === id && typeof message.height === 'number';
 }
-function requestCardHTMLAutoHeight(iframe, id) {
-    var _iframe_contentWindow;
-    (_iframe_contentWindow = iframe.contentWindow) == null ? void 0 : _iframe_contentWindow.postMessage({
-        source: 'vvfx-card-html-auto-height-request',
-        id: id
-    }, '*');
-}
 function withCardHTMLAutoHeightBridge(html, id) {
     if (!id) {
         return html;
     }
-    var script = "\n<script data-vvfx-card-html-auto-height>\n(() => {\n  const id = " + JSON.stringify(id) + ";\n  let frame = 0;\n  const getNodeHeight = (node) => {\n    if (node.nodeType === Node.ELEMENT_NODE) {\n      const rect = node.getBoundingClientRect();\n      return rect.bottom + window.scrollY;\n    }\n    if (node.nodeType === Node.TEXT_NODE && node.textContent.trim()) {\n      const range = document.createRange();\n      range.selectNodeContents(node);\n      const rects = Array.from(range.getClientRects());\n      range.detach();\n      return rects.reduce((height, rect) => Math.max(height, rect.bottom + window.scrollY), 0);\n    }\n\n    return 0;\n  };\n  const getContentHeight = (element) => {\n    if (!element) return 0;\n    return Array.from(element.childNodes).reduce((height, child) => {\n      return Math.max(height, getNodeHeight(child));\n    }, 0);\n  };\n  const getHeight = () => {\n    const body = document.body;\n    const root = document.documentElement;\n    const contentHeight = getContentHeight(body);\n    const scrollHeight = Math.max(root.scrollHeight, body ? body.scrollHeight : 0);\n    return Math.ceil(contentHeight > 0 ? contentHeight : scrollHeight);\n  };\n  const postHeight = () => {\n    frame = 0;\n    window.parent.postMessage({\n      source: 'vvfx-card-html-auto-height',\n      id,\n      height: getHeight(),\n    }, '*');\n  };\n  const schedule = () => {\n    if (frame) return;\n    frame = requestAnimationFrame(postHeight);\n  };\n  window.addEventListener('message', (event) => {\n    const message = event.data;\n    if (!message || message.source !== 'vvfx-card-html-auto-height-request' || message.id !== id) {\n      return;\n    }\n\n    schedule();\n  });\n  window.addEventListener('load', schedule);\n  window.addEventListener('resize', schedule);\n  new ResizeObserver(schedule).observe(document.documentElement);\n  if (document.body) {\n    new ResizeObserver(schedule).observe(document.body);\n    new MutationObserver(schedule).observe(document.body, {\n      attributes: true,\n      childList: true,\n      subtree: true,\n      characterData: true,\n    });\n  }\n  schedule();\n})();\n</script>";
+    var script = "\n<script data-vvfx-card-html-auto-height>\n(() => {\n  const id = " + JSON.stringify(id) + ";\n  let frame = 0;\n  const getChildrenHeight = (element) => {\n    if (!element) return 0;\n    return Array.from(element.children).reduce((height, child) => {\n      const rect = child.getBoundingClientRect();\n      return Math.max(height, rect.bottom + window.scrollY);\n    }, 0);\n  };\n  const getHeight = () => {\n    const body = document.body;\n    const root = document.documentElement;\n    const childHeight = getChildrenHeight(body);\n    const scrollHeight = Math.max(root.scrollHeight, body ? body.scrollHeight : 0);\n    return Math.ceil(Math.max(childHeight, scrollHeight));\n  };\n  const postHeight = () => {\n    frame = 0;\n    window.parent.postMessage({\n      source: 'vvfx-card-html-auto-height',\n      id,\n      height: getHeight(),\n    }, '*');\n  };\n  const schedule = () => {\n    if (frame) return;\n    frame = requestAnimationFrame(postHeight);\n  };\n  window.addEventListener('load', schedule);\n  window.addEventListener('resize', schedule);\n  new ResizeObserver(schedule).observe(document.documentElement);\n  if (document.body) {\n    new ResizeObserver(schedule).observe(document.body);\n    new MutationObserver(schedule).observe(document.body, {\n      attributes: true,\n      childList: true,\n      subtree: true,\n      characterData: true,\n    });\n  }\n  schedule();\n})();\n</script>";
     if (/<\/body>/i.test(html)) {
         return html.replace(/<\/body>/i, "" + script + "</body>");
     }
@@ -91874,38 +91916,30 @@ function syncElementStackOrder(_container, elements) {
     });
 }
 
-function getCardOverlayBoxStyle(box, width, height, offsetX, offsetY, _autoScale) {
+function getCardOverlayBoxStyle(box, width, height, offsetX, offsetY) {
     if (offsetX === void 0) offsetX = 0;
     if (offsetY === void 0) offsetY = 0;
     if (box.corners.length === 4 && width > 0 && height > 0) {
         var _box_corners = box.corners, rightTop = _box_corners[0], leftBottom = _box_corners[2], leftTop = _box_corners[3];
-        var contentWidth = width;
-        var contentHeight = height;
-        var a = (rightTop.x - leftTop.x) / contentWidth;
-        var b = (rightTop.y - leftTop.y) / contentWidth;
-        var c = (leftBottom.x - leftTop.x) / contentHeight;
-        var d = (leftBottom.y - leftTop.y) / contentHeight;
+        var a = (rightTop.x - leftTop.x) / width;
+        var b = (rightTop.y - leftTop.y) / width;
+        var c = (leftBottom.x - leftTop.x) / height;
+        var d = (leftBottom.y - leftTop.y) / height;
         var e = leftTop.x - offsetX;
         var f = leftTop.y - offsetY;
         return {
             left: '0px',
             top: '0px',
-            width: "" + formatPixelNumber(contentWidth) + "px",
-            height: "" + formatPixelNumber(contentHeight) + "px",
-            contentWidth: contentWidth,
-            contentHeight: contentHeight,
+            width: "" + width + "px",
+            height: "" + height + "px",
             transform: "matrix(" + formatMatrixNumber(a) + ", " + formatMatrixNumber(b) + ", " + formatMatrixNumber(c) + ", " + formatMatrixNumber(d) + ", " + formatMatrixNumber(e) + ", " + formatMatrixNumber(f) + ")"
         };
     }
-    var contentWidth1 = box.max.x - box.min.x;
-    var contentHeight1 = box.max.y - box.min.y;
     return {
         left: "" + (box.min.x - offsetX) + "px",
         top: "" + (box.min.y - offsetY) + "px",
-        width: "" + contentWidth1 + "px",
-        height: "" + contentHeight1 + "px",
-        contentWidth: contentWidth1,
-        contentHeight: contentHeight1,
+        width: "" + (box.max.x - box.min.x) + "px",
+        height: "" + (box.max.y - box.min.y) + "px",
         transform: ''
     };
 }
@@ -91928,10 +91962,6 @@ function formatMatrixNumber(value) {
     var normalized = Object.is(value, -0) ? 0 : value;
     return Number(normalized.toFixed(6)).toString();
 }
-function formatPixelNumber(value) {
-    var normalized = Object.is(value, -0) ? 0 : value;
-    return Number(normalized.toFixed(6)).toString();
-}
 
 function mountHTMLShell(container, content, shell) {
     if (!shell) {
@@ -91952,26 +91982,6 @@ function mountHTMLShell(container, content, shell) {
 
 var SHELL_INTERACTIVE_SELECTOR = '[data-vvfx-html-shell-interactive="true"]';
 var EDITING_INTERACTIVE_SELECTOR = '[data-vvfx-html-editing-interactive="true"]';
-var CONTENT_INTERACTIVE_SELECTOR = [
-    '[data-vvfx-html-interaction-zone="self"]',
-    '[data-vvfx-html-interaction-zone="subtree"]',
-    'a[href]',
-    'button:not([disabled])',
-    'input:not([disabled])',
-    'textarea:not([disabled])',
-    'select:not([disabled])',
-    'summary',
-    'video[controls]',
-    'audio[controls]',
-    '[contenteditable]:not([contenteditable="false"])',
-    '[role="button"]',
-    '[role="link"]',
-    '[role="textbox"]',
-    '[tabindex]:not([tabindex="-1"])'
-].join(', ');
-var CONTENT_INTERACTION_NONE_SELECTOR = [
-    '[data-vvfx-html-interaction-zone="none"]'
-].join(', ');
 var EDITING_VIEWPORT_PADDING = 48;
 var EDITING_VIEWPORT_BOX_SCALE = 1.1;
 var AUTO_HEIGHT_EPSILON = 0.5;
@@ -91981,20 +91991,14 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         var _this = this;
         this.options = options;
         this.eventCleanups = [];
-        this.htmlRootConfigCleanups = new WeakMap();
         this.state = {
             frameElements: new Map(),
             elements: new Map(),
-            selectionElements: new Map(),
             contentScaleElements: new Map(),
             contentElements: new Map(),
             contentMountElements: new Map(),
-            contentInteractionZones: new Map(),
-            contentInteractionZoneCleanups: new Map(),
-            contentInteractionResizeCleanups: new Map(),
             contents: new Map(),
             cleanups: new Map(),
-            autoHeightModes: new Map(),
             autoHeightCleanups: new Map(),
             autoHeightFrames: new Map()
         };
@@ -92011,9 +92015,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
                 }
                 return;
             }
-            if (!_this.isEditableCard(targetId)) {
-                return;
-            }
             event.preventDefault();
             event.stopPropagation();
             _this.enterEditing(targetId);
@@ -92029,7 +92030,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             _this.exitEditing();
         };
         this.handleContainerMouseMove = function(event) {
-            _this.scheduleActiveContentInteractionSync(event);
             var hoverShellInteractiveId = _this.getHoverShellInteractiveIdByEvent(event);
             if (_this.state.hoverShellInteractiveId === hoverShellInteractiveId) {
                 return;
@@ -92043,16 +92043,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
                 _this.syncContentInteraction(hoverShellInteractiveId);
             }
         };
-        this.handleContainerMouseLeave = function(event) {
-            if (_this.isMouseLeaveWithinContainer(event)) {
-                return;
-            }
-            if (_this.contentInteractionFrame !== undefined) {
-                cancelAnimationFrame(_this.contentInteractionFrame);
-                _this.contentInteractionFrame = undefined;
-            }
-            _this.pendingContentInteractionEvent = undefined;
-            _this.setActiveContentInteraction(undefined);
+        this.handleContainerMouseLeave = function() {
             var previousId = _this.state.hoverShellInteractiveId;
             if (!previousId) {
                 return;
@@ -92060,33 +92051,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             _this.state.hoverShellInteractiveId = undefined;
             _this.syncContentInteraction(previousId);
         };
-        this.handleContainerContextMenu = function(event) {
-            var activeInteraction = _this.state.activeContentInteraction;
-            if (!activeInteraction || !_this.isEventInsideOverlay(activeInteraction.id, event) || _this.isHTMLContextMenuEvent(event)) {
-                return;
-            }
-            var canvas = _this.options.getCanvasEventTarget == null ? void 0 : _this.options.getCanvasEventTarget.call(_this.options);
-            if (!canvas) {
-                return;
-            }
-            event.preventDefault();
-            event.stopPropagation();
-            _this.setActiveContentInteraction(undefined);
-            canvas.dispatchEvent(new MouseEvent('contextmenu', {
-                bubbles: true,
-                cancelable: true,
-                clientX: event.clientX,
-                clientY: event.clientY,
-                screenX: event.screenX,
-                screenY: event.screenY,
-                button: event.button,
-                buttons: event.buttons,
-                ctrlKey: event.ctrlKey,
-                shiftKey: event.shiftKey,
-                altKey: event.altKey,
-                metaKey: event.metaKey
-            }));
-        };
         this.isAutoHeightMessage = isCardHTMLAutoHeightMessage;
     }
     var _proto = HTMLOverlayManager.prototype;
@@ -92100,6 +92064,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         layer.style.position = 'absolute';
         layer.style.inset = '0';
         layer.style.pointerEvents = 'none';
+        layer.style.zIndex = '1';
         container.appendChild(layer);
         this.state.layer = layer;
         this.initDOMEvents();
@@ -92112,32 +92077,16 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             cancelAnimationFrame(this.state.updateFrame);
             this.state.updateFrame = undefined;
         }
-        if (this.contentInteractionFrame !== undefined) {
-            cancelAnimationFrame(this.contentInteractionFrame);
-            this.contentInteractionFrame = undefined;
-        }
-        this.pendingContentInteractionEvent = undefined;
         this.state.cleanups.forEach(function(cleanup) {
             cleanup();
         });
         this.state.frameElements.clear();
         this.state.elements.clear();
-        this.state.selectionElements.clear();
         this.state.contentScaleElements.clear();
         this.state.contentElements.clear();
         this.state.contentMountElements.clear();
-        this.state.contentInteractionZones.clear();
-        this.state.contentInteractionZoneCleanups.forEach(function(cleanup) {
-            cleanup();
-        });
-        this.state.contentInteractionZoneCleanups.clear();
-        this.state.contentInteractionResizeCleanups.forEach(function(cleanup) {
-            cleanup();
-        });
-        this.state.contentInteractionResizeCleanups.clear();
         this.state.contents.clear();
         this.state.cleanups.clear();
-        this.state.autoHeightModes.clear();
         this.state.autoHeightCleanups.forEach(function(cleanup) {
             cleanup();
         });
@@ -92152,12 +92101,10 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         this.eventCleanups = [];
         (_this_state_layer = this.state.layer) == null ? void 0 : _this_state_layer.remove();
         this.state.layer = undefined;
-        this.state.selectionLayer = undefined;
         this.options.container.removeEventListener('dblclick', this.handleContainerDoubleClick, true);
         this.options.container.removeEventListener('mousedown', this.handleContainerMouseDown, true);
         this.options.container.removeEventListener('mousemove', this.handleContainerMouseMove, true);
         this.options.container.removeEventListener('mouseleave', this.handleContainerMouseLeave, true);
-        this.options.container.removeEventListener('contextmenu', this.handleContainerContextMenu, true);
     };
     _proto.scheduleRender = function scheduleRender() {
         var _this = this;
@@ -92169,10 +92116,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             _this.render();
         });
     };
-    _proto.invalidateCardHTML = function invalidateCardHTML(id) {
-        this.cleanupOverlayContent(id);
-        this.invalidateContentInteractionZones(id);
-    };
     _proto.rasterizeCard = function rasterizeCard(id, options) {
         return _async_to_generator(function() {
             var contentOverlay, capture, _ref, _options_pixelRatio, image, error;
@@ -92265,7 +92208,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         var events = [
             'pageDataChange',
             'selectedItemChange',
-            'preSelectedItemChange',
             'itemPropertyChange',
             'viewportTransform',
             'viewRebuildFinish'
@@ -92275,7 +92217,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
                 if (event === 'viewportTransform') {
                     _this.handleViewportTransform();
                 }
-                _this.invalidateContentInteractionZones();
                 _this.scheduleRender();
             });
         });
@@ -92285,24 +92226,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         this.options.container.addEventListener('mousedown', this.handleContainerMouseDown, true);
         this.options.container.addEventListener('mousemove', this.handleContainerMouseMove, true);
         this.options.container.addEventListener('mouseleave', this.handleContainerMouseLeave, true);
-        this.options.container.addEventListener('contextmenu', this.handleContainerContextMenu, true);
-    };
-    _proto.isMouseLeaveWithinContainer = function isMouseLeaveWithinContainer(event) {
-        var relatedTarget = event.relatedTarget;
-        if (!relatedTarget) {
-            return false;
-        }
-        try {
-            return this.options.container.contains(relatedTarget);
-        } catch (unused) {
-            return false;
-        }
-    };
-    _proto.isHTMLContextMenuEvent = function isHTMLContextMenuEvent(event) {
-        if (typeof Element !== 'function' || !_instanceof(event.target, Element)) {
-            return false;
-        }
-        return !!event.target.closest('[data-interaction-contextmenu="self"], [data-vvfx-html-contextmenu="self"]');
     };
     _proto.handleViewportTransform = function handleViewportTransform() {
         var editing = this.state.editing;
@@ -92322,16 +92245,11 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         }
         var items = this.options.getItems();
         var frameByChildId = this.renderFrameOverlays(items, layer);
-        var selectionLayer = this.getOrCreateSelectionLayer(layer);
         var visibleCardIds = new Set();
         var editingVisible = false;
         items.forEach(function(item) {
             var _this_state_editing;
-            if (!isCardItem(item) || !item.visible) {
-                return;
-            }
-            var html = _this.options.resolveCardHTML(item);
-            if (html === undefined) {
+            if (!isCardItem(item) || !item.visible || item.html === undefined) {
                 return;
             }
             var itemBox = _this.options.getViewBoxById(item.id);
@@ -92346,31 +92264,21 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             var frameBox = frameId ? _this.options.getViewBoxById(frameId) : undefined;
             var overlay = _this.getOrCreateOverlay(item.id, parentOverlay, elements);
             var contentOverlay = _this.getOrCreateContentOverlay(item.id, overlay);
-            var selectionOverlay = _this.getOrCreateSelectionOverlay(item.id, selectionLayer);
-            if (!_this.state.contents.has(item.id)) {
+            var html = item.html;
+            if (html && _this.state.contents.get(item.id) !== html) {
                 _this.renderOverlayHTML(item.id, contentOverlay, html);
             }
-            _this.applyHTMLRootConfig(overlay, html);
             var offsetX = frameBox && !frameBox.isEmpty() ? frameBox.min.x : 0;
             var offsetY = frameBox && !frameBox.isEmpty() ? frameBox.min.y : 0;
-            var boxStyle = getCardOverlayBoxStyle(itemBox, item.property.width, item.property.height, offsetX, offsetY, _this.isAutoScaleEnabled(item));
+            var boxStyle = getCardOverlayBoxStyle(itemBox, item.property.width, item.property.height, offsetX, offsetY);
             overlay.style.left = boxStyle.left;
             overlay.style.top = boxStyle.top;
             overlay.style.width = boxStyle.width;
             overlay.style.height = boxStyle.height;
             overlay.style.transform = boxStyle.transform;
             overlay.style.transformOrigin = '0 0';
-            var selectionBoxStyle = getCardOverlayBoxStyle(itemBox, item.property.width, item.property.height, 0, 0, _this.isAutoScaleEnabled(item));
-            selectionOverlay.style.left = selectionBoxStyle.left;
-            selectionOverlay.style.top = selectionBoxStyle.top;
-            selectionOverlay.style.width = selectionBoxStyle.width;
-            selectionOverlay.style.height = selectionBoxStyle.height;
-            selectionOverlay.style.transform = selectionBoxStyle.transform;
-            selectionOverlay.style.transformOrigin = '0 0';
-            _this.applyHTMLRootConfig(selectionOverlay, html);
-            _this.syncOverlaySelection(item.id, overlay, selectionOverlay);
-            _this.syncContentScale(item.id, boxStyle.contentWidth, boxStyle.contentHeight);
-            _this.syncAutoHeight(item.id, _this.isAutoHeightEnabled(item));
+            _this.syncContentScale(item.id, item.property.width, item.property.height);
+            _this.syncAutoHeight(item.id, item.property.autoHeight === true);
             _this.syncContentInteraction(item.id);
         });
         elements.forEach(function(_overlay, id) {
@@ -92409,9 +92317,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             }
         }
         syncElementStackOrder(layer, rootElements);
-        if (this.state.selectionLayer) {
-            this.state.selectionLayer.style.zIndex = "" + (rootElements.length + 1);
-        }
         this.state.frameElements.forEach(function(frameOverlay, frameId) {
             var frameElements = [];
             for(var _iterator = _create_for_of_iterator_helper_loose(items), _step; !(_step = _iterator()).done;){
@@ -92427,28 +92332,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             syncElementStackOrder(frameOverlay, frameElements);
         });
     };
-    _proto.getOrCreateSelectionLayer = function getOrCreateSelectionLayer(layer) {
-        var _layer_ownerDocument;
-        if (this.state.selectionLayer) {
-            if (this.state.selectionLayer.parentElement !== layer) {
-                layer.appendChild(this.state.selectionLayer);
-            }
-            return this.state.selectionLayer;
-        }
-        var ownerDocument = (_layer_ownerDocument = layer.ownerDocument) != null ? _layer_ownerDocument : typeof document === 'undefined' ? undefined : document;
-        if (!ownerDocument) {
-            return layer;
-        }
-        var selectionLayer = ownerDocument.createElement('div');
-        selectionLayer.className = 'vvfx-card-html-overlay-selection-layer';
-        selectionLayer.style.position = 'absolute';
-        selectionLayer.style.inset = '0';
-        selectionLayer.style.pointerEvents = 'none';
-        selectionLayer.style.zIndex = '1';
-        layer.appendChild(selectionLayer);
-        this.state.selectionLayer = selectionLayer;
-        return selectionLayer;
-    };
     _proto.renderFrameOverlays = function renderFrameOverlays(items, layer) {
         var _this = this;
         var visibleFrameIds = new Set();
@@ -92513,41 +92396,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         elements.set(id, overlay);
         return overlay;
     };
-    _proto.getOrCreateSelectionOverlay = function getOrCreateSelectionOverlay(id, parent) {
-        var selectionOverlay = this.state.selectionElements.get(id);
-        if (selectionOverlay) {
-            if (selectionOverlay.parentElement !== parent) {
-                parent.appendChild(selectionOverlay);
-            }
-            return selectionOverlay;
-        }
-        selectionOverlay = document.createElement('div');
-        selectionOverlay.className = 'vvfx-card-html-overlay-selection';
-        selectionOverlay.dataset.itemId = id;
-        selectionOverlay.style.position = 'absolute';
-        selectionOverlay.style.pointerEvents = 'none';
-        selectionOverlay.style.zIndex = '1';
-        parent.appendChild(selectionOverlay);
-        this.state.selectionElements.set(id, selectionOverlay);
-        return selectionOverlay;
-    };
-    _proto.syncOverlaySelection = function syncOverlaySelection(id, overlay, selectionOverlay) {
-        var isSelected = this.options.getSelectedItemIds().includes(id);
-        var isPreSelected = !isSelected && this.options.getPreSelectedItemId() === id;
-        overlay.dataset.selected = isSelected ? 'true' : 'false';
-        overlay.dataset.preSelected = isPreSelected ? 'true' : 'false';
-        selectionOverlay.dataset.selected = isSelected ? 'true' : 'false';
-        selectionOverlay.dataset.preSelected = isPreSelected ? 'true' : 'false';
-        selectionOverlay.style.boxShadow = isSelected ? this.getSelectionBoxShadow() : isPreSelected ? this.getPreSelectionBoxShadow() : '';
-    };
-    _proto.getSelectionBoxShadow = function getSelectionBoxShadow() {
-        var _this_options_getSelectionEdgeStyle = this.options.getSelectionEdgeStyle(), color = _this_options_getSelectionEdgeStyle.color, alpha = _this_options_getSelectionEdgeStyle.alpha, width = _this_options_getSelectionEdgeStyle.width;
-        return "inset 0 0 0 " + formatCssNumber(width) + "px " + formatCssColor(color, alpha);
-    };
-    _proto.getPreSelectionBoxShadow = function getPreSelectionBoxShadow() {
-        var _this_options_getPreSelectionEdgeStyle = this.options.getPreSelectionEdgeStyle(), color = _this_options_getPreSelectionEdgeStyle.color, alpha = _this_options_getPreSelectionEdgeStyle.alpha, width = _this_options_getPreSelectionEdgeStyle.width;
-        return "inset 0 0 0 " + formatCssNumber(width) + "px " + formatCssColor(color, alpha);
-    };
     _proto.getHTMLCardIdByEvent = function getHTMLCardIdByEvent(event) {
         var layer = this.state.layer;
         if (!layer) {
@@ -92557,7 +92405,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         var items = this.options.getItems();
         for(var i = items.length - 1; i >= 0; i--){
             var item = items[i];
-            if (!isCardItem(item) || !item.visible || this.options.resolveCardHTML(item) === undefined) {
+            if (!isCardItem(item) || !item.visible || item.html === undefined) {
                 continue;
             }
             var box = this.options.getViewBoxById(item.id);
@@ -92576,7 +92424,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         var items = this.options.getItems();
         for(var i = items.length - 1; i >= 0; i--){
             var item = items[i];
-            if (!isCardItem(item) || !item.visible || this.options.resolveCardHTML(item) === undefined) {
+            if (!isCardItem(item) || !item.visible || item.html === undefined) {
                 continue;
             }
             var box = this.options.getViewBoxById(item.id);
@@ -92586,206 +92434,13 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             var contentOverlay = this.state.contentElements.get(item.id);
             var interactiveElements = contentOverlay ? Array.from(contentOverlay.querySelectorAll(SHELL_INTERACTIVE_SELECTOR)) : [];
             var isHoveringShellInteractive = interactiveElements.some(function(element) {
-                return isMouseEventInsideRect(event, element.getBoundingClientRect());
+                var rect = element.getBoundingClientRect();
+                return event.clientX >= rect.left && event.clientX <= rect.right && event.clientY >= rect.top && event.clientY <= rect.bottom;
             });
             return isHoveringShellInteractive ? item.id : undefined;
         }
         return undefined;
     };
-    _proto.syncActiveContentInteraction = function syncActiveContentInteraction(event) {
-        var decision = this.resolveHTMLInteractionTarget(event);
-        if (decision.kind === 'canvas' && this.shouldKeepActiveContentInteractionForFocusedElement()) {
-            return;
-        }
-        this.setActiveContentInteraction(decision.kind === 'html' ? decision.interaction : undefined);
-    };
-    _proto.scheduleActiveContentInteractionSync = function scheduleActiveContentInteractionSync(event) {
-        var _this = this;
-        if (typeof requestAnimationFrame !== 'function') {
-            this.syncActiveContentInteraction(event);
-            return;
-        }
-        this.pendingContentInteractionEvent = event;
-        if (this.contentInteractionFrame !== undefined) {
-            return;
-        }
-        this.contentInteractionFrame = requestAnimationFrame(function() {
-            _this.contentInteractionFrame = undefined;
-            var pendingEvent = _this.pendingContentInteractionEvent;
-            _this.pendingContentInteractionEvent = undefined;
-            if (pendingEvent) {
-                _this.syncActiveContentInteraction(pendingEvent);
-            }
-        });
-    };
-    _proto.setActiveContentInteraction = function setActiveContentInteraction(zone) {
-        var _this = this;
-        var previous = this.state.activeContentInteraction;
-        if ((previous == null ? void 0 : previous.id) === (zone == null ? void 0 : zone.id) && (previous == null ? void 0 : previous.element) === (zone == null ? void 0 : zone.element) && (previous == null ? void 0 : previous.zone) === (zone == null ? void 0 : zone.zone)) {
-            return;
-        }
-        this.state.activeContentInteraction = zone;
-        var changedIds = new Set();
-        if (previous) {
-            changedIds.add(previous.id);
-        }
-        if (zone) {
-            changedIds.add(zone.id);
-        }
-        changedIds.forEach(function(id) {
-            _this.syncContentInteraction(id);
-        });
-    };
-    _proto.shouldKeepActiveContentInteractionForFocusedElement = function shouldKeepActiveContentInteractionForFocusedElement() {
-        var activeInteraction = this.state.activeContentInteraction;
-        if (!activeInteraction || typeof document === 'undefined') {
-            return false;
-        }
-        var activeElement = document.activeElement;
-        if (!activeElement || activeElement === document.body) {
-            return false;
-        }
-        var interactionElement = activeInteraction.element;
-        return interactionElement === activeElement || typeof interactionElement.contains === 'function' && interactionElement.contains(activeElement);
-    };
-    _proto.resolveHTMLInteractionTarget = function resolveHTMLInteractionTarget(event) {
-        var id = this.getHTMLCardIdByEvent(event);
-        if (!id || this.isEditableCard(id)) {
-            return {
-                kind: 'canvas',
-                id: id
-            };
-        }
-        var contentOverlay = this.state.contentElements.get(id);
-        if (!contentOverlay) {
-            return {
-                kind: 'canvas',
-                id: id
-            };
-        }
-        var activeSubtree = this.getActiveSubtreeInteractionAtEvent(id, event);
-        if (activeSubtree) {
-            return {
-                kind: 'html',
-                interaction: activeSubtree
-            };
-        }
-        var matchedZones = this.getContentInteractionZones(id, contentOverlay).filter(function(zone) {
-            return isMouseEventInsideRect(event, zone.rect);
-        });
-        var zone = this.resolveContentInteractionZone(matchedZones);
-        if (zone) {
-            return {
-                kind: 'html',
-                interaction: {
-                    id: id,
-                    element: zone.element,
-                    zone: zone.zone
-                }
-            };
-        }
-        return {
-            kind: 'canvas',
-            id: id
-        };
-    };
-    _proto.getActiveSubtreeInteractionAtEvent = function getActiveSubtreeInteractionAtEvent(id, event) {
-        var activeInteraction = this.state.activeContentInteraction;
-        if ((activeInteraction == null ? void 0 : activeInteraction.id) !== id || activeInteraction.zone !== 'subtree') {
-            return undefined;
-        }
-        var rect = activeInteraction.element.getBoundingClientRect();
-        return isMouseEventInsideRect(event, rect) ? activeInteraction : undefined;
-    };
-    _proto.resolveContentInteractionZone = function resolveContentInteractionZone(zones) {
-        if (zones.length <= 1) {
-            return zones[0];
-        }
-        var subtreeRoot = zones.find(function(candidate) {
-            return candidate.zone === 'subtree' && typeof candidate.element.contains === 'function' && zones.some(function(zone) {
-                return zone.element !== candidate.element && candidate.element.contains(zone.element);
-            });
-        });
-        return subtreeRoot != null ? subtreeRoot : zones[0];
-    };
-    _proto.getContentInteractionZones = function getContentInteractionZones(id, contentOverlay) {
-        var _this = this;
-        var cachedZones = this.state.contentInteractionZones.get(id);
-        if (cachedZones) {
-            return cachedZones;
-        }
-        var zones = Array.from(contentOverlay.querySelectorAll(this.getContentInteractiveSelector(id))).filter(function(element) {
-            return !_this.isContentInteractionDisabled(element);
-        }).map(function(element) {
-            return {
-                element: element,
-                rect: element.getBoundingClientRect(),
-                zone: _this.getContentInteractionZoneMode(element)
-            };
-        });
-        this.state.contentInteractionZones.set(id, zones);
-        this.observeContentInteractionZoneResizes(id, zones);
-        return zones;
-    };
-    _proto.getContentInteractiveSelector = function getContentInteractiveSelector(id) {
-        var _ref;
-        var _this_options_resolveCardTypeConfig_htmlInteractionSelectors, _this_options_resolveCardTypeConfig;
-        var item = this.options.getItems().find(function(item) {
-            return item.id === id;
-        });
-        if (!item) {
-            return CONTENT_INTERACTIVE_SELECTOR;
-        }
-        var selectors = (_ref = (_this_options_resolveCardTypeConfig = this.options.resolveCardTypeConfig(item)) == null ? void 0 : (_this_options_resolveCardTypeConfig_htmlInteractionSelectors = _this_options_resolveCardTypeConfig.htmlInteractionSelectors) == null ? void 0 : _this_options_resolveCardTypeConfig_htmlInteractionSelectors.filter(Boolean)) != null ? _ref : [];
-        if (selectors.length === 0) {
-            return CONTENT_INTERACTIVE_SELECTOR;
-        }
-        return [].concat([
-            CONTENT_INTERACTIVE_SELECTOR
-        ], selectors).join(', ');
-    };
-    _proto.isContentInteractionDisabled = function isContentInteractionDisabled(element) {
-        if (typeof element.closest !== 'function') {
-            return false;
-        }
-        return !!element.closest(CONTENT_INTERACTION_NONE_SELECTOR);
-    };
-    _proto.getContentInteractionZoneMode = function getContentInteractionZoneMode(element) {
-        var zone = element.dataset.vvfxHtmlInteractionZone;
-        return zone === 'subtree' ? 'subtree' : 'self';
-    };
-    _proto.invalidateContentInteractionZones = function invalidateContentInteractionZones(id) {
-        if (id) {
-            var _this_state_contentInteractionResizeCleanups_get;
-            this.state.contentInteractionZones.delete(id);
-            (_this_state_contentInteractionResizeCleanups_get = this.state.contentInteractionResizeCleanups.get(id)) == null ? void 0 : _this_state_contentInteractionResizeCleanups_get();
-            this.state.contentInteractionResizeCleanups.delete(id);
-            return;
-        }
-        this.state.contentInteractionZones.clear();
-        this.state.contentInteractionResizeCleanups.forEach(function(cleanup) {
-            cleanup();
-        });
-        this.state.contentInteractionResizeCleanups.clear();
-    };
-    _proto.observeContentInteractionZoneResizes = function observeContentInteractionZoneResizes(id, zones) {
-        var _this = this;
-        var _this_state_contentInteractionResizeCleanups_get;
-        (_this_state_contentInteractionResizeCleanups_get = this.state.contentInteractionResizeCleanups.get(id)) == null ? void 0 : _this_state_contentInteractionResizeCleanups_get();
-        this.state.contentInteractionResizeCleanups.delete(id);
-        if (zones.length === 0 || typeof ResizeObserver !== 'function') {
-            return;
-        }
-        var observer = new ResizeObserver(function() {
-            _this.invalidateContentInteractionZones(id);
-        });
-        zones.forEach(function(zone) {
-            observer.observe(zone.element);
-        });
-        this.state.contentInteractionResizeCleanups.set(id, function() {
-            observer.disconnect();
-        });
-    };
     _proto.getLayerPoint = function getLayerPoint(event) {
         var rect = this.options.container.getBoundingClientRect();
         return {
@@ -92842,35 +92497,19 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         if (!scaleOverlay || !contentOverlay || width <= 0 || height <= 0) {
             return;
         }
-        var nextWidth = "" + width + "px";
-        var nextHeight = "" + height + "px";
-        var sizeChanged = scaleOverlay.style.width !== nextWidth || scaleOverlay.style.height !== nextHeight;
-        scaleOverlay.style.width = nextWidth;
-        scaleOverlay.style.height = nextHeight;
+        scaleOverlay.style.width = "" + width + "px";
+        scaleOverlay.style.height = "" + height + "px";
         scaleOverlay.style.transform = 'none';
-        contentOverlay.style.width = nextWidth;
-        contentOverlay.style.height = nextHeight;
-        if (sizeChanged && this.state.autoHeightModes.get(id) === 'message') {
-            this.requestAutoHeightFromIframes(id, contentOverlay);
-        }
-        if (sizeChanged) {
-            this.invalidateContentInteractionZones(id);
-        }
-    };
-    _proto.requestAutoHeightFromIframes = function requestAutoHeightFromIframes(id, contentOverlay) {
-        contentOverlay.querySelectorAll('iframe').forEach(function(iframe) {
-            requestCardHTMLAutoHeight(iframe, id);
-        });
+        contentOverlay.style.width = "" + width + "px";
+        contentOverlay.style.height = "" + height + "px";
     };
     _proto.syncContentInteraction = function syncContentInteraction(id) {
-        var _this_state_editing, _this_state_activeContentInteraction;
+        var _this_state_editing;
         var isEditing = ((_this_state_editing = this.state.editing) == null ? void 0 : _this_state_editing.id) === id;
-        var activeInteraction = ((_this_state_activeContentInteraction = this.state.activeContentInteraction) == null ? void 0 : _this_state_activeContentInteraction.id) === id ? this.state.activeContentInteraction : undefined;
         var overlay = this.state.elements.get(id);
         var scaleOverlay = this.state.contentScaleElements.get(id);
         var contentOverlay = this.state.contentElements.get(id);
         var contentMount = this.state.contentMountElements.get(id);
-        var isInteractive = isEditing || !!activeInteraction;
         if (overlay) {
             overlay.dataset.editing = isEditing ? 'true' : 'false';
             overlay.style.pointerEvents = 'none';
@@ -92881,62 +92520,34 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         }
         if (contentOverlay) {
             contentOverlay.dataset.editing = isEditing ? 'true' : 'false';
-            contentOverlay.style.pointerEvents = isInteractive ? 'auto' : 'none';
+            contentOverlay.style.pointerEvents = 'none';
             contentOverlay.querySelectorAll('iframe').forEach(function(iframe) {
-                var isActiveIframe = isEditing || (activeInteraction == null ? void 0 : activeInteraction.element) === iframe;
-                iframe.style.pointerEvents = isActiveIframe ? 'auto' : 'none';
-                iframe.tabIndex = isActiveIframe ? 0 : -1;
+                iframe.style.pointerEvents = isEditing ? 'auto' : 'none';
+                iframe.tabIndex = isEditing ? 0 : -1;
             });
-            this.syncShellInteraction(id, contentOverlay, isInteractive);
-            this.syncContentInteractionZones(id, contentOverlay, activeInteraction, isEditing, isInteractive);
+            this.syncShellInteraction(id, contentOverlay, isEditing);
         }
         if (contentMount) {
             contentMount.dataset.editing = isEditing ? 'true' : 'false';
-            contentMount.style.pointerEvents = isInteractive ? 'auto' : 'none';
-            contentMount.inert = !isInteractive;
-            if (isInteractive) {
+            contentMount.style.pointerEvents = isEditing ? 'auto' : 'none';
+            contentMount.inert = !isEditing;
+            if (isEditing) {
                 contentMount.removeAttribute('aria-hidden');
             } else {
                 contentMount.setAttribute('aria-hidden', 'true');
             }
         }
     };
-    _proto.syncContentInteractionZones = function syncContentInteractionZones(id, contentOverlay, activeInteraction, isEditing, isInteractive) {
-        var _this = this;
-        var activeElement = activeInteraction == null ? void 0 : activeInteraction.element;
-        contentOverlay.querySelectorAll(this.getContentInteractiveSelector(id)).forEach(function(element) {
-            if ((activeInteraction == null ? void 0 : activeInteraction.zone) === 'subtree' && activeElement && element !== activeElement && typeof activeElement.contains === 'function' && activeElement.contains(element)) {
-                _this.clearContentInteractionState(element);
-                return;
-            }
-            if (!isInteractive) {
-                _this.clearContentInteractionState(element);
-                return;
-            }
-            if (_this.isContentInteractionDisabled(element)) {
-                element.dataset.vvfxHtmlInteractionActive = 'false';
-                element.style.pointerEvents = 'none';
-                return;
-            }
-            var isElementInteractive = isEditing || activeElement === element || (activeInteraction == null ? void 0 : activeInteraction.zone) === 'subtree' && typeof (activeElement == null ? void 0 : activeElement.contains) === 'function' && activeElement.contains(element);
-            element.dataset.vvfxHtmlInteractionActive = isElementInteractive ? 'true' : 'false';
-            element.style.pointerEvents = isElementInteractive ? 'auto' : 'none';
-        });
-    };
-    _proto.clearContentInteractionState = function clearContentInteractionState(element) {
-        delete element.dataset.vvfxHtmlInteractionActive;
-        element.style.pointerEvents = '';
-    };
-    _proto.syncShellInteraction = function syncShellInteraction(id, contentOverlay, isInteractive) {
+    _proto.syncShellInteraction = function syncShellInteraction(id, contentOverlay, isEditing) {
         var isHoveringShellInteractive = this.state.hoverShellInteractiveId === id;
-        var isShellInteractiveActive = isInteractive || isHoveringShellInteractive;
+        var isShellInteractiveActive = isEditing || isHoveringShellInteractive;
         contentOverlay.querySelectorAll(SHELL_INTERACTIVE_SELECTOR).forEach(function(element) {
             element.dataset.vvfxHtmlShellInteractiveHover = isHoveringShellInteractive ? 'true' : 'false';
             element.dataset.vvfxHtmlShellInteractiveActive = isShellInteractiveActive ? 'true' : 'false';
             element.style.pointerEvents = isShellInteractiveActive ? 'auto' : 'none';
         });
         contentOverlay.querySelectorAll(EDITING_INTERACTIVE_SELECTOR).forEach(function(element) {
-            element.style.pointerEvents = isInteractive ? 'auto' : 'none';
+            element.style.pointerEvents = isEditing ? 'auto' : 'none';
         });
     };
     _proto.enterEditing = function enterEditing(id) {
@@ -92944,9 +92555,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         if (((_this_state_editing = this.state.editing) == null ? void 0 : _this_state_editing.id) === id) {
             return;
         }
-        if (!this.isEditableCard(id)) {
-            return;
-        }
         var box = this.options.getViewBoxById(id);
         if (box.isEmpty()) {
             return;
@@ -92990,13 +92598,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         this.options.setViewport(editing.restoreViewport);
         this.scheduleRender();
     };
-    _proto.isEditableCard = function isEditableCard(id) {
-        var _this_options_resolveCardTypeConfig;
-        var item = this.options.getItems().find(function(item) {
-            return item.id === id;
-        });
-        return isCardItem(item) && ((_this_options_resolveCardTypeConfig = this.options.resolveCardTypeConfig(item)) == null ? void 0 : _this_options_resolveCardTypeConfig.editable) !== false;
-    };
     _proto.getEditingFitZoom = function getEditingFitZoom(box, currentZoom) {
         var viewportElement = this.options.container.parentElement;
         if (!viewportElement) {
@@ -93021,7 +92622,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
     };
     _proto.renderOverlayHTML = function renderOverlayHTML(id, overlay, html) {
         this.cleanupOverlayContent(id);
-        this.invalidateContentInteractionZones(id);
         overlay.innerHTML = '';
         var shell = mountHTMLShell(overlay, html.content, html.shell);
         var autoHeightMeasureElement = shell.contentContainer.isConnected ? shell.contentContainer : overlay;
@@ -93031,81 +92631,18 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         });
         var contentCleanup = this.renderOverlayContent(shell.contentContainer, html.content, {
             id: id,
-            autoHeight: this.isAutoHeightEnabled(item)
+            autoHeight: isCardItem(item) && item.property.autoHeight === true
         });
-        this.observeContentInteractionZones(id, shell.contentContainer);
         this.state.cleanups.set(id, function() {
             contentCleanup == null ? void 0 : contentCleanup();
             shell.cleanup == null ? void 0 : shell.cleanup.call(shell);
         });
         this.state.contents.set(id, html);
     };
-    _proto.observeContentInteractionZones = function observeContentInteractionZones(id, contentContainer) {
-        var _this = this;
-        var _this_state_contentInteractionZoneCleanups_get;
-        (_this_state_contentInteractionZoneCleanups_get = this.state.contentInteractionZoneCleanups.get(id)) == null ? void 0 : _this_state_contentInteractionZoneCleanups_get();
-        this.state.contentInteractionZoneCleanups.delete(id);
-        if (typeof MutationObserver !== 'function') {
-            return;
-        }
-        var observer = new MutationObserver(function() {
-            _this.invalidateContentInteractionZones(id);
-        });
-        observer.observe(contentContainer, {
-            attributes: true,
-            childList: true,
-            subtree: true
-        });
-        this.state.contentInteractionZoneCleanups.set(id, function() {
-            observer.disconnect();
-        });
-    };
-    _proto.applyHTMLRootConfig = function applyHTMLRootConfig(root, html) {
-        var _ref, _config_style;
-        var _this_htmlRootConfigCleanups_get, _config_className;
-        (_this_htmlRootConfigCleanups_get = this.htmlRootConfigCleanups.get(root)) == null ? void 0 : _this_htmlRootConfigCleanups_get();
-        this.htmlRootConfigCleanups.delete(root);
-        var config = html.root;
-        if (!config) {
-            return;
-        }
-        var classNames = (_ref = (_config_className = config.className) == null ? void 0 : _config_className.split(/\s+/).filter(Boolean)) != null ? _ref : [];
-        var styleProperties = [];
-        classNames.forEach(function(className) {
-            root.classList.add(className);
-        });
-        Object.entries((_config_style = config.style) != null ? _config_style : {}).forEach(function(param) {
-            var property = param[0], value = param[1];
-            if (value === undefined) {
-                return;
-            }
-            styleProperties.push(property);
-            if (property.startsWith('--') || property.includes('-')) {
-                root.style.setProperty(property, String(value));
-                return;
-            }
-            root.style[property] = String(value);
-        });
-        this.htmlRootConfigCleanups.set(root, function() {
-            classNames.forEach(function(className) {
-                root.classList.remove(className);
-            });
-            styleProperties.forEach(function(property) {
-                if (property.startsWith('--') || property.includes('-')) {
-                    root.style.removeProperty(property);
-                    return;
-                }
-                root.style[property] = '';
-            });
-        });
-    };
     _proto.renderOverlayContent = function renderOverlayContent(overlay, content, options) {
         var _this = this;
         switch(content.kind){
             case 'inline':
-                if (options == null ? void 0 : options.autoHeight) {
-                    this.state.autoHeightModes.set(options.id, 'message');
-                }
                 return this.chainCleanups(function() {
                     return content.cleanup == null ? void 0 : content.cleanup.call(content, overlay);
                 }, renderDocumentContent(overlay, {
@@ -93122,9 +92659,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
                 }));
             case 'dom':
                 {
-                    if (options == null ? void 0 : options.autoHeight) {
-                        this.state.autoHeightModes.set(options.id, 'measure');
-                    }
                     if (content.target === 'iframe') {
                         return renderDOMContentInIframe(overlay, content.render, content.cleanup);
                     }
@@ -93134,9 +92668,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
                     } : undefined;
                 }
             case 'document':
-                if (options == null ? void 0 : options.autoHeight) {
-                    this.state.autoHeightModes.set(options.id, 'message');
-                }
                 return this.chainCleanups(function() {
                     return content.cleanup == null ? void 0 : content.cleanup.call(content, overlay);
                 }, renderDocumentContent(overlay, content, {
@@ -93164,7 +92695,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         };
     };
     _proto.cleanupOverlayContent = function cleanupOverlayContent(id) {
-        var _this_state_contentInteractionZoneCleanups_get;
         var cleanup = this.state.cleanups.get(id);
         if (cleanup) {
             cleanup();
@@ -93172,19 +92702,13 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         }
         this.state.contents.delete(id);
         this.state.contentMountElements.delete(id);
-        this.state.autoHeightModes.delete(id);
-        this.invalidateContentInteractionZones(id);
-        (_this_state_contentInteractionZoneCleanups_get = this.state.contentInteractionZoneCleanups.get(id)) == null ? void 0 : _this_state_contentInteractionZoneCleanups_get();
-        this.state.contentInteractionZoneCleanups.delete(id);
         this.cleanupAutoHeight(id);
     };
     _proto.removeOverlay = function removeOverlay(id) {
-        var _this_state_elements_get, _this_state_selectionElements_get;
+        var _this_state_elements_get;
         this.cleanupOverlayContent(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);
-        this.state.selectionElements.delete(id);
         this.state.contentScaleElements.delete(id);
         this.state.contentElements.delete(id);
     };
@@ -93193,27 +92717,11 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
             this.cleanupAutoHeight(id);
             return;
         }
-        this.ensureAutoHeightMode(id);
-        if (this.state.autoHeightModes.get(id) === 'message') {
-            this.cleanupAutoHeight(id);
-            return;
-        }
         if (!this.state.autoHeightCleanups.has(id)) {
             this.state.autoHeightCleanups.set(id, this.createAutoHeightObserver(id));
         }
         this.scheduleAutoHeightMeasure(id);
     };
-    _proto.ensureAutoHeightMode = function ensureAutoHeightMode(id) {
-        var _this_state_contents_get;
-        if (this.state.autoHeightModes.has(id)) {
-            return;
-        }
-        var content = (_this_state_contents_get = this.state.contents.get(id)) == null ? void 0 : _this_state_contents_get.content;
-        if (!content) {
-            return;
-        }
-        this.state.autoHeightModes.set(id, content.kind === 'inline' || content.kind === 'document' ? 'message' : 'measure');
-    };
     _proto.createAutoHeightObserver = function createAutoHeightObserver(id) {
         var _this = this;
         var cleanupFns = [];
@@ -93301,7 +92809,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         var item = this.options.getItems().find(function(candidate) {
             return candidate.id === id;
         });
-        if (!this.isAutoHeightEnabled(item)) {
+        if (!isCardItem(item) || item.property.autoHeight !== true) {
             this.cleanupAutoHeight(id);
             return;
         }
@@ -93320,9 +92828,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         }).filter(function(height) {
             return typeof height === 'number' && Number.isFinite(height) && height > 0;
         });
-        var childHeight = this.getChildrenNaturalHeight(element, {
-            includeIframes: iframeHeights.length === 0
-        });
+        var childHeight = this.getChildrenNaturalHeight(element);
         var naturalHeight = (_Math = Math).max.apply(_Math, [].concat([
             childHeight
         ], iframeHeights));
@@ -93342,29 +92848,10 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         }
         return Math.max(documentElement.scrollHeight, (_ref = body == null ? void 0 : body.scrollHeight) != null ? _ref : 0);
     };
-    _proto.getChildrenNaturalHeight = function getChildrenNaturalHeight(element, options) {
-        var _ref;
-        var includeIframes = (_ref = options == null ? void 0 : options.includeIframes) != null ? _ref : true;
-        return Array.from(element.childNodes).reduce(function(height, child) {
-            var _child_textContent;
-            if (child.nodeType === Node.ELEMENT_NODE) {
-                var childElement = child;
-                if (!includeIframes && childElement.tagName === 'IFRAME') {
-                    return height;
-                }
-                return Math.max(height, childElement.offsetTop + childElement.offsetHeight);
-            }
-            if (child.nodeType === Node.TEXT_NODE && ((_child_textContent = child.textContent) == null ? void 0 : _child_textContent.trim())) {
-                var range = element.ownerDocument.createRange();
-                range.selectNodeContents(child);
-                var rects = Array.from(range.getClientRects());
-                // eslint-disable-next-line @typescript-eslint/no-deprecated
-                range.detach();
-                return rects.reduce(function(textHeight, rect) {
-                    return Math.max(textHeight, rect.bottom - element.getBoundingClientRect().top);
-                }, height);
-            }
-            return height;
+    _proto.getChildrenNaturalHeight = function getChildrenNaturalHeight(element) {
+        return Array.from(element.children).reduce(function(height, child) {
+            var childElement = child;
+            return Math.max(height, childElement.offsetTop + childElement.offsetHeight);
         }, 0);
     };
     _proto.cleanupAutoHeight = function cleanupAutoHeight(id) {
@@ -93383,48 +92870,14 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
         var item = this.options.getItems().find(function(candidate) {
             return candidate.id === id;
         });
-        if (!isCardItem(item) || !this.isAutoHeightEnabled(item)) {
+        if (!isCardItem(item) || item.property.autoHeight !== true) {
             return;
         }
-        if (!Number.isFinite(height) || height <= 0) {
+        if (!Number.isFinite(height) || height <= 0 || Math.abs(height - item.property.height) <= AUTO_HEIGHT_EPSILON) {
             return;
         }
-        var nextHeight = Math.ceil(this.getAutoHeightItemHeight(item, height));
-        if (Math.abs(nextHeight - item.property.height) <= AUTO_HEIGHT_EPSILON) {
-            return;
-        }
-        this.options.setCardItemHeight(id, nextHeight);
-    };
-    _proto.getAutoHeightItemHeight = function getAutoHeightItemHeight(item, contentHeight) {
-        if (!isCardItem(item) || this.isAutoScaleEnabled(item)) {
-            return contentHeight;
-        }
-        var scaleOverlay = this.state.contentScaleElements.get(item.id);
-        var displayedHeight = scaleOverlay ? Number.parseFloat(scaleOverlay.style.height) : 0;
-        if (!Number.isFinite(displayedHeight) || displayedHeight <= 0 || item.property.height <= 0) {
-            return contentHeight;
-        }
-        return contentHeight / displayedHeight * item.property.height;
-    };
-    _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;
+        this.options.setCardItemHeight(id, Math.ceil(height));
     };
-    _proto.isAutoScaleEnabled = function isAutoScaleEnabled(item) {
-        var _this_options_resolveCardTypeConfig;
-        if (!isCardItem(item)) {
-            return true;
-        }
-        return ((_this_options_resolveCardTypeConfig = this.options.resolveCardTypeConfig(item)) == null ? void 0 : _this_options_resolveCardTypeConfig.autoScale) !== false;
-    };
-    _create_class(HTMLOverlayManager, [
-        {
-            key: "layerElement",
-            get: function get() {
-                return this.state.layer;
-            }
-        }
-    ]);
     return HTMLOverlayManager;
 }();
 function waitForCardCaptureReady(root) {
@@ -93466,17 +92919,6 @@ function waitForCardCaptureReady(root) {
         });
     })();
 }
-function formatCssColor(color, alpha) {
-    var normalizedColor = Math.max(0, Math.min(0xFFFFFF, Math.round(color)));
-    var red = normalizedColor >> 16 & 0xFF;
-    var green = normalizedColor >> 8 & 0xFF;
-    var blue = normalizedColor & 0xFF;
-    return "rgba(" + red + ", " + green + ", " + blue + ", " + formatCssNumber(alpha) + ")";
-}
-function formatCssNumber(value) {
-    var normalized = Number.isFinite(value) ? value : 0;
-    return Number(normalized.toFixed(6)).toString();
-}
 function nextAnimationFrame() {
     return new Promise(function(resolve) {
         requestAnimationFrame(function() {
@@ -93895,9 +93337,6 @@ function createFlattenedContent(target, frameStyle, ownerDocument) {
     });
     return replacement;
 }
-function isMouseEventInsideRect(event, rect) {
-    return event.clientX >= rect.left && event.clientX <= rect.right && event.clientY >= rect.top && event.clientY <= rect.bottom;
-}
 function createFlattenedIframeContent(iframe) {
     var doc = iframe.contentDocument;
     if (!doc) {
@@ -93937,19 +93376,6 @@ function withTimeout(promise, timeout) {
     });
 }
 
-function orderSDKCanvasLayers(param) {
-    var container = param.container, playerContainer = param.playerContainer, htmlOverlayLayer = param.htmlOverlayLayer, gestureCanvas = param.gestureCanvas;
-    [
-        playerContainer,
-        htmlOverlayLayer,
-        gestureCanvas
-    ].forEach(function(layer) {
-        if ((layer == null ? void 0 : layer.parentElement) === container) {
-            container.appendChild(layer);
-        }
-    });
-}
-
 var HTML_CARD_EDITING_VIEWPORT_PADDING = 48;
 var SDK = /*#__PURE__*/ function() {
     function SDK(container, mode) {
@@ -94055,45 +93481,9 @@ var SDK = /*#__PURE__*/ function() {
                     propertyName: 'height',
                     propertyValue: height
                 });
-            },
-            getSelectedItemIds: function getSelectedItemIds() {
-                var _ref;
-                var _this__pageData;
-                return (_ref = (_this__pageData = _this._pageData) == null ? void 0 : _this__pageData.activeData.selectedItems) != null ? _ref : [];
-            },
-            getPreSelectedItemId: function getPreSelectedItemId() {
-                var _this__pageData;
-                return (_this__pageData = _this._pageData) == null ? void 0 : _this__pageData.activeData.preSelectedItem;
-            },
-            getSelectionEdgeStyle: function getSelectionEdgeStyle() {
-                var _SDK_config_gestureHandlerConfig_transformGizmoConfig = SDK.config.gestureHandlerConfig.transformGizmoConfig, wireframeColor = _SDK_config_gestureHandlerConfig_transformGizmoConfig.wireframeColor, wireframeAlpha = _SDK_config_gestureHandlerConfig_transformGizmoConfig.wireframeAlpha, wireframeWidth = _SDK_config_gestureHandlerConfig_transformGizmoConfig.wireframeWidth;
-                return {
-                    color: wireframeColor,
-                    alpha: wireframeAlpha,
-                    width: wireframeWidth
-                };
-            },
-            getPreSelectionEdgeStyle: function getPreSelectionEdgeStyle() {
-                var _SDK_config_gestureHandlerConfig_selectorGizmoConfig = SDK.config.gestureHandlerConfig.selectorGizmoConfig, preSelectedColor = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.preSelectedColor, preSelectedWidth = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.preSelectedWidth;
-                return {
-                    color: preSelectedColor,
-                    alpha: 1,
-                    width: preSelectedWidth
-                };
-            },
-            getCanvasEventTarget: function getCanvasEventTarget() {
-                var _this__gestureHandler;
-                return (_this__gestureHandler = _this._gestureHandler) == null ? void 0 : _this__gestureHandler.wireframeApplication.view;
-            },
-            resolveCardHTML: function resolveCardHTML(item) {
-                return isCardItem(item) ? _this.resolveCardHTML(item) : undefined;
-            },
-            resolveCardTypeConfig: function resolveCardTypeConfig(item) {
-                return isCardItem(item) ? _this.resolveCardTypeConfig(item) : undefined;
             }
         });
         this._htmlOverlayManager.attach();
-        this.syncCanvasLayerOrder();
     }
     var _proto = SDK.prototype;
     _proto.dispose = function dispose() {
@@ -94189,7 +93579,6 @@ var SDK = /*#__PURE__*/ function() {
                                 this.initPlayer(SDK.config.mode);
                                 this._pageDataUtils = new PageDataUtils(this.player, this._playerContainer, this._eventEmitter, this);
                                 this._gestureHandler = new GestureHandler(this._container);
-                                this.syncCanvasLayerOrder();
                                 return [
                                     4,
                                     this.runByPageData(this.pageData)
@@ -94239,16 +93628,6 @@ var SDK = /*#__PURE__*/ function() {
             env: 'editor'
         });
         this.player.resize();
-        this.syncCanvasLayerOrder();
-    };
-    _proto.syncCanvasLayerOrder = function syncCanvasLayerOrder() {
-        var _this__htmlOverlayManager, _this__gestureHandler;
-        orderSDKCanvasLayers({
-            container: this._container,
-            playerContainer: this._playerContainer,
-            htmlOverlayLayer: (_this__htmlOverlayManager = this._htmlOverlayManager) == null ? void 0 : _this__htmlOverlayManager.layerElement,
-            gestureCanvas: (_this__gestureHandler = this._gestureHandler) == null ? void 0 : _this__gestureHandler.wireframeApplication.view
-        });
     };
     _proto.getInitParam = function getInitParam(param) {
         return _async_to_generator(function() {
@@ -95343,7 +94722,8 @@ var SDK = /*#__PURE__*/ function() {
    * @param ignoreClamp 是否忽视约束
    */ _proto.setPageZoom = function setPageZoom(zoom, center, ignoreClamp) {
         EFFECTS.assertExist(this._pageData);
-        this._pageDataUtils.setPageZoom(zoom, center, ignoreClamp);
+        this._pageData.property.zoom = zoom;
+        this._pageDataUtils.setPageZoom(this._pageData.property.zoom, center, ignoreClamp);
         this._gestureHandler.render();
     };
     /**
@@ -95583,7 +94963,7 @@ var SDK = /*#__PURE__*/ function() {
     };
     /**
    * @description 设置蒙版工具模式
-   * @param mode 模式类型：'paint' 表示涂抹，'erase' 表示擦除
+   * @param mode 模式类型：'paint' 笔刷涂抹、'erase' 笔刷逐笔擦除、'box-erase' 框选擦除、'box-paint' 框选涂抹
    */ _proto.setMaskGizmoMode = function setMaskGizmoMode(mode) {
         this._gestureHandler.setMaskGizmoMode(mode);
     };
@@ -96239,44 +95619,6 @@ var SDK = /*#__PURE__*/ function() {
         });
     };
     /**
-   * @description 按 cardType 从注册表解析卡片的 HTML 渲染配置。
-   * @param item 卡片元素
-   * @returns HTML 渲染配置
-   */ _proto.resolveCardHTML = function resolveCardHTML(item) {
-        var _cardTypeConfig_html;
-        var cardTypeConfig = this.resolveCardTypeConfig(item);
-        return cardTypeConfig == null ? void 0 : (_cardTypeConfig_html = cardTypeConfig.html) == null ? void 0 : _cardTypeConfig_html.call(cardTypeConfig, item);
-    };
-    /**
-   * @description 按 cardType 从注册表解析卡片类型配置。
-   * @param item 卡片元素
-   * @returns 卡片类型配置
-   */ _proto.resolveCardTypeConfig = function resolveCardTypeConfig(item) {
-        return SDK.config.itemConfig.cardConfig.cardTypes.find(function(t) {
-            return t.type === item.cardType;
-        });
-    };
-    /**
-   * @description 重新解析并挂载指定卡片的 HTML 内容。
-   * @description 当 inline/document 内容依赖 extension 或外部状态变化时，可调用此方法刷新 DOM。
-   * @param id 卡片元素 ID
-   * @returns 是否成功触发刷新
-   */ _proto.refreshCardHTML = function refreshCardHTML(id) {
-        var _this__htmlOverlayManager, _this__htmlOverlayManager1;
-        var item = this.getSDKItem(id);
-        if (!isCardItem(item)) {
-            console.warn('CardItem "' + id + '" not found.');
-            return false;
-        }
-        if (!this.resolveCardHTML(item)) {
-            console.warn('CardItem "' + id + '" has no registered HTML renderer.');
-            return false;
-        }
-        (_this__htmlOverlayManager = this._htmlOverlayManager) == null ? void 0 : _this__htmlOverlayManager.invalidateCardHTML(id);
-        (_this__htmlOverlayManager1 = this._htmlOverlayManager) == null ? void 0 : _this__htmlOverlayManager1.scheduleRender();
-        return true;
-    };
-    /**
    * @description 创建卡片元素
    * @description 底层以透明 SpriteItem 形式渲染，支持 cardType 属性
    * @param createInfo 卡片创建信息
@@ -96563,6 +95905,167 @@ var SDK = /*#__PURE__*/ function() {
 }();
 SDK.config = BaseConfig;
 
+/**
+ * @description 卡片元素 SDKItem 类
+ * @description 在 Player 中以 SpriteItem 形式渲染（透明占位，无图）
+ * @description 支持设置卡片类型（cardType）
+ */ var CardItem = /*#__PURE__*/ function(BaseItem) {
+    _inherits(CardItem, BaseItem);
+    function CardItem(options) {
+        var _this;
+        var _ref, _ref1, _ref2, _ref3, _ref4, _ref5, _ref6;
+        var _options_property, _options_property1, _options_property2, _options_property3, _options_property4, _options_property5, _SDK_config_itemConfig_cardConfig_cardTypes_, _options_property6, _options_property7;
+        _this = BaseItem.call(this, options) || this, /**
+   * @description 元素类型
+   */ _this.type = SDKItemType.CARD;
+        // 初始化属性（包含 cardType）
+        _this.property = {
+            position: (_ref = (_options_property = options.property) == null ? void 0 : _options_property.position) != null ? _ref : [
+                0,
+                0
+            ],
+            rotation: (_ref1 = (_options_property1 = options.property) == null ? void 0 : _options_property1.rotation) != null ? _ref1 : [
+                0,
+                0,
+                0
+            ],
+            width: (_ref2 = (_options_property2 = options.property) == null ? void 0 : _options_property2.width) != null ? _ref2 : 0,
+            height: (_ref3 = (_options_property3 = options.property) == null ? void 0 : _options_property3.height) != null ? _ref3 : 0,
+            scale: (_ref4 = (_options_property4 = options.property) == null ? void 0 : _options_property4.scale) != null ? _ref4 : [
+                1,
+                1
+            ],
+            cardType: (_ref5 = (_ref6 = (_options_property5 = options.property) == null ? void 0 : _options_property5.cardType) != null ? _ref6 : (_SDK_config_itemConfig_cardConfig_cardTypes_ = SDK.config.itemConfig.cardConfig.cardTypes[0]) == null ? void 0 : _SDK_config_itemConfig_cardConfig_cardTypes_.type) != null ? _ref5 : '',
+            autoHeight: (_options_property6 = options.property) == null ? void 0 : _options_property6.autoHeight,
+            html: (_options_property7 = options.property) == null ? void 0 : _options_property7.html
+        };
+        return _this;
+    }
+    var _proto = CardItem.prototype;
+    // ==================== 实现抽象方法 ====================
+    /**
+   * @description 转换为 CardCreateInfo
+   * @param withParent 是否包含父节点ID
+   */ _proto.toCreateInfo = function toCreateInfo(withParent) {
+        var extension = this.getAllExtension();
+        var property = deepClone(this.property);
+        property.html = this.html;
+        return {
+            type: SDKItemType.CARD,
+            id: this.id,
+            name: this.name,
+            parentId: withParent ? this.parentId : undefined,
+            extension: Object.keys(extension).length > 0 ? extension : undefined,
+            property: property
+        };
+    };
+    /**
+   * @description 克隆 SDKItem
+   */ _proto.clone = function clone() {
+        var property = deepClone(this.property);
+        property.html = this.html;
+        return new CardItem({
+            id: EFFECTS.generateGUID(),
+            name: this.name,
+            parentId: this.parentId,
+            duration: this.duration,
+            delay: this.delay,
+            endBehavior: this.endBehavior,
+            isLocked: this.isLocked,
+            isCoreEditable: this.isCoreEditable,
+            property: property,
+            extension: this.getAllExtension()
+        });
+    };
+    _create_class(CardItem, [
+        {
+            key: "cardType",
+            get: // ==================== cardType 访问器 ====================
+            /**
+   * @description 卡片类型
+   */ function get() {
+                return this.property.cardType;
+            },
+            set: function set(value) {
+                this.property.cardType = value;
+            }
+        },
+        {
+            key: "html",
+            get: /**
+   * @description HTML 覆盖层配置
+   */ function get() {
+                return this.property.html;
+            },
+            set: function set(value) {
+                this.property.html = value;
+            }
+        },
+        {
+            key: "position",
+            get: // ==================== 便捷访问器 ====================
+            /**
+   * @description 位置
+   */ function get() {
+                return this.property.position;
+            },
+            set: function set(value) {
+                this.property.position = value;
+            }
+        },
+        {
+            key: "width",
+            get: /**
+   * @description 宽度
+   */ function get() {
+                return this.property.width;
+            },
+            set: function set(value) {
+                this.property.width = value;
+            }
+        },
+        {
+            key: "height",
+            get: /**
+   * @description 高度
+   */ function get() {
+                return this.property.height;
+            },
+            set: function set(value) {
+                this.property.height = value;
+            }
+        },
+        {
+            key: "rotation",
+            get: /**
+   * @description 旋转（二维旋转角度）
+   */ function get() {
+                return this.property.rotation[2];
+            },
+            set: function set(value) {
+                this.property.rotation[2] = value;
+            }
+        },
+        {
+            key: "fullRotation",
+            get: /**
+   * @description 完整旋转（包含 x, y, z）
+   */ function get() {
+                return this.property.rotation;
+            },
+            set: function set(value) {
+                this.property.rotation = value;
+            }
+        }
+    ]);
+    return CardItem;
+}(BaseItem);
+/**
+ * @description 类型守卫：检查是否是 CardItem
+ */ function isCardItem(obj) {
+    return _instanceof(obj, CardItem);
+}
+
 Object.defineProperty(exports, "generateGUID", {
     enumerable: true,
     get: function () { return EFFECTS.generateGUID; }