@vvfx/sdk 0.2.2-beta.9 → 0.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -3,7 +3,7 @@
3
3
  * Description: TODO
4
4
  * Author: Ant Group CO., Ltd.
5
5
  * Contributors: 赤芍,何即,不择,意绮
6
- * Version: v0.2.2-beta.9
6
+ * Version: v0.2.2
7
7
  */
8
8
 
9
9
  import * as EFFECTS from '@galacean/effects';
@@ -24013,9 +24013,21 @@ function getUniqueName(name, names) {
24013
24013
  };
24014
24014
  _create_class(TextItem, [
24015
24015
  {
24016
- key: "text",
24016
+ key: "pixelWidth",
24017
24017
  get: // ==================== 便捷访问器 ====================
24018
- /**
24018
+ function get() {
24019
+ return this.width;
24020
+ }
24021
+ },
24022
+ {
24023
+ key: "pixelHeight",
24024
+ get: function get() {
24025
+ return this.height;
24026
+ }
24027
+ },
24028
+ {
24029
+ key: "text",
24030
+ get: /**
24019
24031
  * @description 文本内容
24020
24032
  */ function get() {
24021
24033
  return this.property.text;
@@ -25153,150 +25165,6 @@ var ItemOrderAction = /*#__PURE__*/ function(ItemOrderAction) {
25153
25165
  return _instanceof(obj, FrameItem);
25154
25166
  }
25155
25167
 
25156
- /**
25157
- * @description 卡片元素 SDKItem 类
25158
- * @description 在 Player 中以 SpriteItem 形式渲染(透明占位,无图)
25159
- * @description 支持设置卡片类型(cardType)
25160
- */ var CardItem = /*#__PURE__*/ function(BaseItem) {
25161
- _inherits(CardItem, BaseItem);
25162
- function CardItem(options) {
25163
- var _this;
25164
- var _ref, _ref1, _ref2, _ref3, _ref4, _ref5;
25165
- var _options_property, _options_property1, _options_property2, _options_property3, _options_property4, _options_property5;
25166
- _this = BaseItem.call(this, options) || this, /**
25167
- * @description 元素类型
25168
- */ _this.type = SDKItemType.CARD;
25169
- // 初始化属性(包含 cardType)
25170
- _this.property = {
25171
- position: (_ref = (_options_property = options.property) == null ? void 0 : _options_property.position) != null ? _ref : [
25172
- 0,
25173
- 0
25174
- ],
25175
- rotation: (_ref1 = (_options_property1 = options.property) == null ? void 0 : _options_property1.rotation) != null ? _ref1 : [
25176
- 0,
25177
- 0,
25178
- 0
25179
- ],
25180
- width: (_ref2 = (_options_property2 = options.property) == null ? void 0 : _options_property2.width) != null ? _ref2 : 0,
25181
- height: (_ref3 = (_options_property3 = options.property) == null ? void 0 : _options_property3.height) != null ? _ref3 : 0,
25182
- scale: (_ref4 = (_options_property4 = options.property) == null ? void 0 : _options_property4.scale) != null ? _ref4 : [
25183
- 1,
25184
- 1
25185
- ],
25186
- cardType: (_ref5 = (_options_property5 = options.property) == null ? void 0 : _options_property5.cardType) != null ? _ref5 : 'unknown'
25187
- };
25188
- return _this;
25189
- }
25190
- var _proto = CardItem.prototype;
25191
- // ==================== 实现抽象方法 ====================
25192
- /**
25193
- * @description 转换为 CardCreateInfo
25194
- * @param withParent 是否包含父节点ID
25195
- */ _proto.toCreateInfo = function toCreateInfo(withParent) {
25196
- var extension = this.getAllExtension();
25197
- return {
25198
- type: SDKItemType.CARD,
25199
- id: this.id,
25200
- name: this.name,
25201
- parentId: withParent ? this.parentId : undefined,
25202
- extension: Object.keys(extension).length > 0 ? extension : undefined,
25203
- property: deepClone(this.property)
25204
- };
25205
- };
25206
- /**
25207
- * @description 克隆 SDKItem
25208
- */ _proto.clone = function clone() {
25209
- return new CardItem({
25210
- id: generateGUID(),
25211
- name: this.name,
25212
- parentId: this.parentId,
25213
- duration: this.duration,
25214
- delay: this.delay,
25215
- endBehavior: this.endBehavior,
25216
- isLocked: this.isLocked,
25217
- isCoreEditable: this.isCoreEditable,
25218
- property: deepClone(this.property),
25219
- extension: this.getAllExtension()
25220
- });
25221
- };
25222
- _create_class(CardItem, [
25223
- {
25224
- key: "cardType",
25225
- get: // ==================== cardType 访问器 ====================
25226
- /**
25227
- * @description 卡片类型
25228
- */ function get() {
25229
- return this.property.cardType;
25230
- },
25231
- set: function set(value) {
25232
- this.property.cardType = value;
25233
- }
25234
- },
25235
- {
25236
- key: "position",
25237
- get: // ==================== 便捷访问器 ====================
25238
- /**
25239
- * @description 位置
25240
- */ function get() {
25241
- return this.property.position;
25242
- },
25243
- set: function set(value) {
25244
- this.property.position = value;
25245
- }
25246
- },
25247
- {
25248
- key: "width",
25249
- get: /**
25250
- * @description 宽度
25251
- */ function get() {
25252
- return this.property.width;
25253
- },
25254
- set: function set(value) {
25255
- this.property.width = value;
25256
- }
25257
- },
25258
- {
25259
- key: "height",
25260
- get: /**
25261
- * @description 高度
25262
- */ function get() {
25263
- return this.property.height;
25264
- },
25265
- set: function set(value) {
25266
- this.property.height = value;
25267
- }
25268
- },
25269
- {
25270
- key: "rotation",
25271
- get: /**
25272
- * @description 旋转(二维旋转角度)
25273
- */ function get() {
25274
- return this.property.rotation[2];
25275
- },
25276
- set: function set(value) {
25277
- this.property.rotation[2] = value;
25278
- }
25279
- },
25280
- {
25281
- key: "fullRotation",
25282
- get: /**
25283
- * @description 完整旋转(包含 x, y, z)
25284
- */ function get() {
25285
- return this.property.rotation;
25286
- },
25287
- set: function set(value) {
25288
- this.property.rotation = value;
25289
- }
25290
- }
25291
- ]);
25292
- return CardItem;
25293
- }(BaseItem);
25294
- /**
25295
- * @description 类型守卫:检查是否是 CardItem
25296
- */ function isCardItem(obj) {
25297
- return _instanceof(obj, CardItem);
25298
- }
25299
-
25300
25168
  function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
25301
25169
  try {
25302
25170
  var info = gen[key](arg);
@@ -47298,7 +47166,7 @@ var SelectorGizmo = /*#__PURE__*/ function(Gizmo) {
47298
47166
  var preSelectedItem = this.pageDataUtils.getPreSelectedItem();
47299
47167
  var preSelectedItemBox = this.pageDataUtils.getViewBoxById((_ref = preSelectedItem == null ? void 0 : preSelectedItem.id) != null ? _ref : '');
47300
47168
  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;
47301
- if (!(preSelectedItemBox == null ? void 0 : preSelectedItemBox.isEmpty()) && !isCardItem(preSelectedItem)) {
47169
+ if (!(preSelectedItemBox == null ? void 0 : preSelectedItemBox.isEmpty())) {
47302
47170
  this.graphics.lineStyle(preSelectedWidth, preSelectedColor);
47303
47171
  this.graphics.drawBox(preSelectedItemBox);
47304
47172
  }
@@ -55558,16 +55426,6 @@ var TransformGizmo = /*#__PURE__*/ function(Gizmo) {
55558
55426
  newWidth,
55559
55427
  newHeight
55560
55428
  ], translation1);
55561
- } else if (selectedItem && selectedItems.length === 1 && isCardItem(selectedItem)) {
55562
- void this._pageDataUtils.setItemProperty({
55563
- itemId: selectedItem.id,
55564
- type: SDKItemType.CARD,
55565
- property: {
55566
- width: selectedItem.width * resultScalar1.x,
55567
- height: selectedItem.height * resultScalar1.y
55568
- }
55569
- });
55570
- this._pageDataUtils.moveItem(selectedItem.id, translation1);
55571
55429
  } else {
55572
55430
  // 普通元素的缩放逻辑
55573
55431
  selectedItems.forEach(function(item) {
@@ -55892,7 +55750,6 @@ var TransformGizmo = /*#__PURE__*/ function(Gizmo) {
55892
55750
  var selectedItems = this._pageDataUtils.getSelectedItems();
55893
55751
  var isTemplateMode = SDK.config.mode === 'template';
55894
55752
  var selectedItem = selectedItems.length === 1 ? selectedItems[0] : undefined;
55895
- var isSingleCardItem = isCardItem(selectedItem);
55896
55753
  var isGeneratorItem = (selectedItem == null ? void 0 : selectedItem.type) === SDKItemType.GENERATOR;
55897
55754
  var isAutoLayoutFrame = (selectedItem == null ? void 0 : selectedItem.type) === SDKItemType.FRAME && (selectedItem == null ? void 0 : selectedItem.layoutMode) === FrameLayoutMode.AUTO;
55898
55755
  var canScale = selectedItems.length === 1 && (selectedItem == null ? void 0 : selectedItem.type) !== SDKItemType.GROUP && !isAutoLayoutFrame && !isGeneratorItem;
@@ -55932,11 +55789,9 @@ var TransformGizmo = /*#__PURE__*/ function(Gizmo) {
55932
55789
  this.wireframe.totalBox.copyFrom(box).expandByScalar(totalBoxExpandScalar);
55933
55790
  // 根据box获取边缘线
55934
55791
  var corners = this.wireframe.box.corners;
55935
- if (!isSingleCardItem) {
55936
- corners.forEach(function(corner, i) {
55937
- _this.wireframe.edges.push(new Line2(new Vector2().copyFrom(corner), new Vector2().copyFrom(corners[(i + 1) % 4])));
55938
- });
55939
- }
55792
+ corners.forEach(function(corner, i) {
55793
+ _this.wireframe.edges.push(new Line2(new Vector2().copyFrom(corner), new Vector2().copyFrom(corners[(i + 1) % 4])));
55794
+ });
55940
55795
  var _SDK_config_gestureHandlerConfig_transformGizmoConfig = SDK.config.gestureHandlerConfig.transformGizmoConfig, scaleCircleSize = _SDK_config_gestureHandlerConfig_transformGizmoConfig.scaleCircleSize, rotationCircleSize = _SDK_config_gestureHandlerConfig_transformGizmoConfig.rotationCircleSize;
55941
55796
  // 成组暂不支持缩放
55942
55797
  if (selectedItems.length === 1) {
@@ -59787,6 +59642,12 @@ var MAX_ITEM_DISTANCE_THRESHOLD = 100000;
59787
59642
  /**
59788
59643
  * @description SDKItem position 属性的数字精度(保留小数位数)
59789
59644
  */ var POSITION_PRECISION = 4;
59645
+ function isCardHTMLContentValue(value) {
59646
+ return (value == null ? void 0 : value.kind) === 'inline' || (value == null ? void 0 : value.kind) === 'dom' || (value == null ? void 0 : value.kind) === 'document';
59647
+ }
59648
+ function isCardHTMLValue(value) {
59649
+ return isCardHTMLContentValue(value == null ? void 0 : value.content);
59650
+ }
59790
59651
  var PageDataUtils = /*#__PURE__*/ function() {
59791
59652
  function PageDataUtils(player, container, emitter, sdk) {
59792
59653
  this.player = player;
@@ -60604,10 +60465,11 @@ var PageDataUtils = /*#__PURE__*/ function() {
60604
60465
  property: property
60605
60466
  }));
60606
60467
  } else if ((existingSDKItem == null ? void 0 : existingSDKItem.type) == SDKItemType.CARD) {
60607
- var cardType = existingSDKItem.cardType;
60468
+ var cardType = existingSDKItem.cardType, html = existingSDKItem.html;
60608
60469
  sdkItem = new CardItem(_extends({}, baseOptions, {
60609
60470
  property: _extends({}, property, {
60610
- cardType: cardType
60471
+ cardType: cardType,
60472
+ html: html
60611
60473
  })
60612
60474
  }));
60613
60475
  } else {
@@ -60834,19 +60696,6 @@ var PageDataUtils = /*#__PURE__*/ function() {
60834
60696
  }).call(this);
60835
60697
  };
60836
60698
  /**
60837
- * @description 设置元素extension字段
60838
- */ _proto.setItemExtension = function setItemExtension(itemId, extension) {
60839
- var item = this.getSDKItem(itemId);
60840
- if (!item) {
60841
- console.warn('setItemExtension: item not found');
60842
- return;
60843
- }
60844
- for(var _iterator = _create_for_of_iterator_helper_loose(Object.entries(extension)), _step; !(_step = _iterator()).done;){
60845
- var _step_value = _step.value, key = _step_value[0], value = _step_value[1];
60846
- item.extension.set(key, value);
60847
- }
60848
- };
60849
- /**
60850
60699
  * @description 场景 1: 设置单个元素的单个属性
60851
60700
  */ _proto.setSingleItemSingleProperty = function setSingleItemSingleProperty(param) {
60852
60701
  return _async_to_generator(function() {
@@ -61204,35 +61053,40 @@ var PageDataUtils = /*#__PURE__*/ function() {
61204
61053
  3,
61205
61054
  31
61206
61055
  ];
61207
- case 'position':
61056
+ case 'html':
61208
61057
  return [
61209
61058
  3,
61210
61059
  32
61211
61060
  ];
61212
- case 'rotation':
61061
+ case 'position':
61213
61062
  return [
61214
61063
  3,
61215
61064
  33
61216
61065
  ];
61217
- case 'scale':
61066
+ case 'rotation':
61218
61067
  return [
61219
61068
  3,
61220
61069
  34
61221
61070
  ];
61222
- case 'layoutMode':
61071
+ case 'scale':
61223
61072
  return [
61224
61073
  3,
61225
61074
  35
61226
61075
  ];
61227
- case 'visible':
61076
+ case 'layoutMode':
61228
61077
  return [
61229
61078
  3,
61230
61079
  36
61231
61080
  ];
61081
+ case 'visible':
61082
+ return [
61083
+ 3,
61084
+ 37
61085
+ ];
61232
61086
  }
61233
61087
  return [
61234
61088
  3,
61235
- 37
61089
+ 38
61236
61090
  ];
61237
61091
  case 1:
61238
61092
  {
@@ -61245,7 +61099,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61245
61099
  }
61246
61100
  return [
61247
61101
  3,
61248
- 38
61102
+ 39
61249
61103
  ];
61250
61104
  }
61251
61105
  case 2:
@@ -61256,7 +61110,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61256
61110
  }
61257
61111
  return [
61258
61112
  3,
61259
- 38
61113
+ 39
61260
61114
  ];
61261
61115
  }
61262
61116
  case 3:
@@ -61288,7 +61142,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61288
61142
  case 5:
61289
61143
  return [
61290
61144
  3,
61291
- 38
61145
+ 39
61292
61146
  ];
61293
61147
  case 6:
61294
61148
  {
@@ -61305,7 +61159,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61305
61159
  }
61306
61160
  return [
61307
61161
  3,
61308
- 38
61162
+ 39
61309
61163
  ];
61310
61164
  }
61311
61165
  case 7:
@@ -61319,7 +61173,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61319
61173
  }
61320
61174
  return [
61321
61175
  3,
61322
- 38
61176
+ 39
61323
61177
  ];
61324
61178
  }
61325
61179
  case 8:
@@ -61332,7 +61186,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61332
61186
  }
61333
61187
  return [
61334
61188
  3,
61335
- 38
61189
+ 39
61336
61190
  ];
61337
61191
  }
61338
61192
  case 9:
@@ -61346,7 +61200,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61346
61200
  }
61347
61201
  return [
61348
61202
  3,
61349
- 38
61203
+ 39
61350
61204
  ];
61351
61205
  }
61352
61206
  case 10:
@@ -61359,7 +61213,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61359
61213
  }
61360
61214
  return [
61361
61215
  3,
61362
- 38
61216
+ 39
61363
61217
  ];
61364
61218
  }
61365
61219
  case 11:
@@ -61372,7 +61226,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61372
61226
  }
61373
61227
  return [
61374
61228
  3,
61375
- 38
61229
+ 39
61376
61230
  ];
61377
61231
  }
61378
61232
  case 12:
@@ -61392,7 +61246,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61392
61246
  }
61393
61247
  return [
61394
61248
  3,
61395
- 38
61249
+ 39
61396
61250
  ];
61397
61251
  }
61398
61252
  case 13:
@@ -61434,7 +61288,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61434
61288
  }
61435
61289
  return [
61436
61290
  3,
61437
- 38
61291
+ 39
61438
61292
  ];
61439
61293
  }
61440
61294
  case 14:
@@ -61469,7 +61323,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61469
61323
  }
61470
61324
  return [
61471
61325
  3,
61472
- 38
61326
+ 39
61473
61327
  ];
61474
61328
  }
61475
61329
  case 15:
@@ -61483,7 +61337,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61483
61337
  }
61484
61338
  return [
61485
61339
  3,
61486
- 38
61340
+ 39
61487
61341
  ];
61488
61342
  }
61489
61343
  case 16:
@@ -61515,7 +61369,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61515
61369
  case 20:
61516
61370
  return [
61517
61371
  3,
61518
- 38
61372
+ 39
61519
61373
  ];
61520
61374
  case 21:
61521
61375
  if (!(typeof propertyValue === 'string' && playerItem.type === spec.ItemType.video)) return [
@@ -61546,7 +61400,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61546
61400
  case 25:
61547
61401
  return [
61548
61402
  3,
61549
- 38
61403
+ 39
61550
61404
  ];
61551
61405
  case 26:
61552
61406
  if (!(playerItem.type === spec.ItemType.null)) return [
@@ -61591,7 +61445,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61591
61445
  case 28:
61592
61446
  return [
61593
61447
  3,
61594
- 38
61448
+ 39
61595
61449
  ];
61596
61450
  case 29:
61597
61451
  {
@@ -61603,7 +61457,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61603
61457
  }
61604
61458
  return [
61605
61459
  3,
61606
- 38
61460
+ 39
61607
61461
  ];
61608
61462
  }
61609
61463
  case 30:
@@ -61616,7 +61470,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
61616
61470
  }
61617
61471
  return [
61618
61472
  3,
61619
- 38
61473
+ 39
61620
61474
  ];
61621
61475
  }
61622
61476
  case 31:
@@ -61629,10 +61483,20 @@ var PageDataUtils = /*#__PURE__*/ function() {
61629
61483
  }
61630
61484
  return [
61631
61485
  3,
61632
- 38
61486
+ 39
61633
61487
  ];
61634
61488
  }
61635
61489
  case 32:
61490
+ {
61491
+ if (isCardItem(targetItem)) {
61492
+ targetItem.html = isCardHTMLValue(propertyValue) ? propertyValue : undefined;
61493
+ }
61494
+ return [
61495
+ 3,
61496
+ 39
61497
+ ];
61498
+ }
61499
+ case 33:
61636
61500
  {
61637
61501
  if (Array.isArray(propertyValue) && propertyValue.length === 2) {
61638
61502
  pixelTranslation = propertyValue.map(function(v, i) {
@@ -61645,10 +61509,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
61645
61509
  }
61646
61510
  return [
61647
61511
  3,
61648
- 38
61512
+ 39
61649
61513
  ];
61650
61514
  }
61651
- case 33:
61515
+ case 34:
61652
61516
  {
61653
61517
  if (Array.isArray(propertyValue) && propertyValue.length === 3) {
61654
61518
  rotation = propertyValue.map(function(v, i) {
@@ -61659,10 +61523,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
61659
61523
  }
61660
61524
  return [
61661
61525
  3,
61662
- 38
61526
+ 39
61663
61527
  ];
61664
61528
  }
61665
- case 34:
61529
+ case 35:
61666
61530
  {
61667
61531
  if (Array.isArray(propertyValue) && propertyValue.length === 2) {
61668
61532
  currentScale = targetItem.property.scale;
@@ -61676,10 +61540,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
61676
61540
  }
61677
61541
  return [
61678
61542
  3,
61679
- 38
61543
+ 39
61680
61544
  ];
61681
61545
  }
61682
- case 35:
61546
+ case 36:
61683
61547
  {
61684
61548
  if (propertyValue === FrameLayoutMode.AUTO || propertyValue === FrameLayoutMode.FREE) {
61685
61549
  frameComponent = playerItem.getComponent(FrameComponent);
@@ -61689,10 +61553,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
61689
61553
  }
61690
61554
  return [
61691
61555
  3,
61692
- 38
61556
+ 39
61693
61557
  ];
61694
61558
  }
61695
- case 36:
61559
+ case 37:
61696
61560
  {
61697
61561
  if (typeof propertyValue === 'boolean') {
61698
61562
  playerItem.setVisible(propertyValue);
@@ -61705,10 +61569,10 @@ var PageDataUtils = /*#__PURE__*/ function() {
61705
61569
  }
61706
61570
  return [
61707
61571
  3,
61708
- 38
61572
+ 39
61709
61573
  ];
61710
61574
  }
61711
- case 37:
61575
+ case 38:
61712
61576
  {
61713
61577
  console.log('ignore property name ', propertyName);
61714
61578
  // 对于未明确处理的属性,尝试直接设置到 property 对象
@@ -61716,8 +61580,8 @@ var PageDataUtils = /*#__PURE__*/ function() {
61716
61580
  targetItem.property[propertyName] = propertyValue;
61717
61581
  }
61718
61582
  }
61719
- _state.label = 38;
61720
- case 38:
61583
+ _state.label = 39;
61584
+ case 39:
61721
61585
  // 非位置属性需要刷新播放器
61722
61586
  // template 模式下保持暂停态以避免播放器自动播放,editor 模式继续推进
61723
61587
  if (![
@@ -62597,10 +62461,6 @@ var PageDataUtils = /*#__PURE__*/ function() {
62597
62461
  }
62598
62462
  break;
62599
62463
  }
62600
- case 'cardType':
62601
- {
62602
- break;
62603
- }
62604
62464
  default:
62605
62465
  {
62606
62466
  console.warn("Target property " + propertyName + " can not be changed.");
@@ -63193,15 +63053,12 @@ var PageDataUtils = /*#__PURE__*/ function() {
63193
63053
  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 ? [
63194
63054
  1,
63195
63055
  1
63196
- ] : _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 ? generateGUID() : _cardInfo_id, extension = cardInfo.extension;
63056
+ ] : _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 ? generateGUID() : _cardInfo_id, extension = cardInfo.extension;
63197
63057
  // 校验 cardType 是否已在配置中注册
63198
- var cardTypeConfig = SDK.config.itemConfig.cardConfig.cardTypes.find(function(t) {
63199
- return t.type === cardType;
63200
- });
63201
63058
  var registeredTypes = SDK.config.itemConfig.cardConfig.cardTypes.map(function(t) {
63202
63059
  return t.type;
63203
63060
  });
63204
- if (!cardTypeConfig) {
63061
+ if (!registeredTypes.includes(cardType)) {
63205
63062
  console.warn('CardItem cardType "' + cardType + '" is not registered. Registered types: ' + registeredTypes.join(', '));
63206
63063
  return;
63207
63064
  }
@@ -63245,7 +63102,9 @@ var PageDataUtils = /*#__PURE__*/ function() {
63245
63102
  width: width,
63246
63103
  height: height,
63247
63104
  scale: [].concat(scale),
63248
- cardType: cardType
63105
+ cardType: cardType,
63106
+ autoHeight: autoHeight,
63107
+ html: html
63249
63108
  },
63250
63109
  extension: extension
63251
63110
  });
@@ -64627,7 +64486,8 @@ var PageDataUtils = /*#__PURE__*/ function() {
64627
64486
  scalar.y
64628
64487
  ],
64629
64488
  rotation: [].concat(rotation),
64630
- position: [].concat(resultPosition)
64489
+ position: [].concat(resultPosition),
64490
+ html: sdkItem.html
64631
64491
  },
64632
64492
  extension: extension
64633
64493
  };
@@ -64712,7 +64572,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
64712
64572
  };
64713
64573
  addTextItemIntoNewScene = function addTextItemIntoNewScene(textCreateInfo, sceneSize, itemViewPosition) {
64714
64574
  var _scene_fonts;
64715
- var _textCreateInfo_id = textCreateInfo.id, id = _textCreateInfo_id === void 0 ? 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 ? spec.TextWeight.normal : _textCreateInfo_property_fontWeight, _textCreateInfo_property_fontStyle = _textCreateInfo_property.fontStyle, fontStyle = _textCreateInfo_property_fontStyle === void 0 ? spec.FontStyle.normal : _textCreateInfo_property_fontStyle, _textCreateInfo_property_textAlign = _textCreateInfo_property.textAlign, textAlign = _textCreateInfo_property_textAlign === void 0 ? 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;
64575
+ var _textCreateInfo_id = textCreateInfo.id, id = _textCreateInfo_id === void 0 ? 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 ? spec.TextWeight.normal : _textCreateInfo_property_fontWeight, _textCreateInfo_property_fontStyle = _textCreateInfo_property.fontStyle, fontStyle = _textCreateInfo_property_fontStyle === void 0 ? spec.FontStyle.normal : _textCreateInfo_property_fontStyle, _textCreateInfo_property_textAlign = _textCreateInfo_property.textAlign, textAlign = _textCreateInfo_property_textAlign === void 0 ? 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;
64716
64576
  var rotation = Array.isArray(sourceRotation) ? [].concat(sourceRotation) : [
64717
64577
  0,
64718
64578
  0,
@@ -64742,7 +64602,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
64742
64602
  fontSize: fontSize,
64743
64603
  textColor: resutlTextColor,
64744
64604
  fontWeight: fontWeight,
64745
- letterSpace: 0,
64605
+ letterSpace: letterSpacing,
64746
64606
  textAlign: textAlign,
64747
64607
  fontStyle: fontStyle,
64748
64608
  textWidth: textWidth,
@@ -65673,7 +65533,7 @@ var PageDataUtils = /*#__PURE__*/ function() {
65673
65533
  _this = this;
65674
65534
  changeProeprty = function changeProeprty(targetCreateInfo) {
65675
65535
  return _async_to_generator(function() {
65676
- var currentCreateInfo, itemId;
65536
+ var currentCreateInfo;
65677
65537
  return _ts_generator(this, function(_state) {
65678
65538
  switch(_state.label){
65679
65539
  case 0:
@@ -65684,20 +65544,16 @@ var PageDataUtils = /*#__PURE__*/ function() {
65684
65544
  2
65685
65545
  ];
65686
65546
  }
65687
- itemId = targetCreateInfo.id;
65688
65547
  return [
65689
65548
  4,
65690
65549
  this.setItemProperty({
65691
- itemId: itemId,
65550
+ itemId: currentCreateInfo.id,
65692
65551
  type: currentCreateInfo.type,
65693
65552
  property: targetCreateInfo.property
65694
65553
  })
65695
65554
  ];
65696
65555
  case 1:
65697
65556
  _state.sent();
65698
- if (targetCreateInfo.extension) {
65699
- this.setItemExtension(itemId, targetCreateInfo.extension);
65700
- }
65701
65557
  return [
65702
65558
  2
65703
65559
  ];
@@ -66015,56 +65871,35 @@ var PageDataUtils = /*#__PURE__*/ function() {
66015
65871
  };
66016
65872
  _proto.asyncAddItemByCreateInfos = function asyncAddItemByCreateInfos(createInfos) {
66017
65873
  return _async_to_generator(function() {
66018
- var _loop, _this, createInfoWithIds, itemToTextureInfo, _iterator, _step, toAddedCreateInfo, groupCreateInfos, frameCreateInfos, ids, composition, loadTexture;
65874
+ var _this, createInfoWithIds, itemToTextureInfo, _iterator, _step, createInfo, id, type, url, textureId, toAddedCreateInfo, groupCreateInfos, frameCreateInfos, ids, composition, loadTexture;
66019
65875
  return _ts_generator(this, function(_state) {
66020
65876
  switch(_state.label){
66021
65877
  case 0:
66022
- _loop = function() {
66023
- var createInfo = _step.value;
66024
- var _ref = function() {
66025
- switch(createInfo.type){
66026
- case SDKItemType.SPRITE:
66027
- {
66028
- return {
66029
- url: createInfo.property.image,
66030
- type: 'image'
66031
- };
66032
- }
66033
- case SDKItemType.VIDEO:
66034
- {
66035
- return {
66036
- url: createInfo.property.video,
66037
- type: 'video'
66038
- };
66039
- }
66040
- default:
66041
- {
66042
- return {};
66043
- }
66044
- }
66045
- }(), url = _ref.url, type = _ref.type;
66046
- if (url && type) {
66047
- var textureId = generateGUID();
66048
- itemToTextureInfo.set(createInfo.id, {
65878
+ _this = this;
65879
+ createInfoWithIds = createInfos.map(function(createInfo) {
65880
+ return Object.assign({}, createInfo, createInfo.id ? {} : {
65881
+ id: generateGUID()
65882
+ });
65883
+ });
65884
+ itemToTextureInfo = new Map();
65885
+ // 预处理所有 createInfo,分配 textureId
65886
+ for(_iterator = _create_for_of_iterator_helper_loose(createInfoWithIds); !(_step = _iterator()).done;){
65887
+ createInfo = _step.value;
65888
+ id = createInfo.id;
65889
+ type = createInfo.type;
65890
+ url = type === SDKItemType.SPRITE ? createInfo.property.image : type === SDKItemType.VIDEO ? createInfo.property.video : undefined;
65891
+ if ((type === SDKItemType.SPRITE || type === SDKItemType.VIDEO) && url) {
65892
+ textureId = generateGUID();
65893
+ itemToTextureInfo.set(id, {
66049
65894
  id: textureId,
66050
65895
  url: url,
66051
- type: type
65896
+ type: type === SDKItemType.SPRITE ? 'image' : 'video'
66052
65897
  });
66053
65898
  Object.assign(createInfo, {
66054
65899
  textureId: textureId
66055
65900
  });
66056
65901
  }
66057
- };
66058
- _this = this;
66059
- createInfoWithIds = createInfos.map(function(createInfo) {
66060
- var _createInfo_id;
66061
- return Object.assign({}, createInfo, {
66062
- id: (_createInfo_id = createInfo.id) != null ? _createInfo_id : generateGUID()
66063
- });
66064
- });
66065
- itemToTextureInfo = new Map();
66066
- // 预处理所有 createInfo,分配 textureId
66067
- for(_iterator = _create_for_of_iterator_helper_loose(createInfoWithIds); !(_step = _iterator()).done;)_loop();
65902
+ }
66068
65903
  // 并行创建所有 item
66069
65904
  toAddedCreateInfo = createInfoWithIds.filter(function(createInfo) {
66070
65905
  return ![
@@ -83237,12 +83072,43 @@ var BaseConfig = {
83237
83072
  },
83238
83073
  cardConfig: {
83239
83074
  backgroundColor: [
83240
- 1,
83241
- 1,
83242
- 1,
83243
- 0
83075
+ 0.6,
83076
+ 0.6,
83077
+ 0.6,
83078
+ 0.12
83244
83079
  ],
83245
- cardTypes: []
83080
+ cardTypes: [
83081
+ {
83082
+ type: 'character',
83083
+ label: '角色图',
83084
+ iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
83085
+ },
83086
+ {
83087
+ type: 'environment',
83088
+ label: '环境图',
83089
+ iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
83090
+ },
83091
+ {
83092
+ type: 'storyboard',
83093
+ label: '分镜图',
83094
+ iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
83095
+ },
83096
+ {
83097
+ type: 'scene-clip',
83098
+ label: '场景剪辑',
83099
+ iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
83100
+ },
83101
+ {
83102
+ type: 'video-compose',
83103
+ label: '视频合成',
83104
+ iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
83105
+ },
83106
+ {
83107
+ type: 'video-generate',
83108
+ label: '生成视频',
83109
+ iconUrl: 'https://mdn.alipayobjects.com/huamei_ixsp8m/afts/img/A*F2wVS7x0MfIAAAAAQBAAAAgAev-aAQ/original'
83110
+ }
83111
+ ]
83246
83112
  }
83247
83113
  }
83248
83114
  };
@@ -91571,18 +91437,11 @@ function isCardHTMLAutoHeightMessage(data, id) {
91571
91437
  var message = data;
91572
91438
  return message.source === 'vvfx-card-html-auto-height' && message.id === id && typeof message.height === 'number';
91573
91439
  }
91574
- function requestCardHTMLAutoHeight(iframe, id) {
91575
- var _iframe_contentWindow;
91576
- (_iframe_contentWindow = iframe.contentWindow) == null ? void 0 : _iframe_contentWindow.postMessage({
91577
- source: 'vvfx-card-html-auto-height-request',
91578
- id: id
91579
- }, '*');
91580
- }
91581
91440
  function withCardHTMLAutoHeightBridge(html, id) {
91582
91441
  if (!id) {
91583
91442
  return html;
91584
91443
  }
91585
- 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>";
91444
+ 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>";
91586
91445
  if (/<\/body>/i.test(html)) {
91587
91446
  return html.replace(/<\/body>/i, "" + script + "</body>");
91588
91447
  }
@@ -91855,38 +91714,30 @@ function syncElementStackOrder(_container, elements) {
91855
91714
  });
91856
91715
  }
91857
91716
 
91858
- function getCardOverlayBoxStyle(box, width, height, offsetX, offsetY, _autoScale) {
91717
+ function getCardOverlayBoxStyle(box, width, height, offsetX, offsetY) {
91859
91718
  if (offsetX === void 0) offsetX = 0;
91860
91719
  if (offsetY === void 0) offsetY = 0;
91861
91720
  if (box.corners.length === 4 && width > 0 && height > 0) {
91862
91721
  var _box_corners = box.corners, rightTop = _box_corners[0], leftBottom = _box_corners[2], leftTop = _box_corners[3];
91863
- var contentWidth = width;
91864
- var contentHeight = height;
91865
- var a = (rightTop.x - leftTop.x) / contentWidth;
91866
- var b = (rightTop.y - leftTop.y) / contentWidth;
91867
- var c = (leftBottom.x - leftTop.x) / contentHeight;
91868
- var d = (leftBottom.y - leftTop.y) / contentHeight;
91722
+ var a = (rightTop.x - leftTop.x) / width;
91723
+ var b = (rightTop.y - leftTop.y) / width;
91724
+ var c = (leftBottom.x - leftTop.x) / height;
91725
+ var d = (leftBottom.y - leftTop.y) / height;
91869
91726
  var e = leftTop.x - offsetX;
91870
91727
  var f = leftTop.y - offsetY;
91871
91728
  return {
91872
91729
  left: '0px',
91873
91730
  top: '0px',
91874
- width: "" + formatPixelNumber(contentWidth) + "px",
91875
- height: "" + formatPixelNumber(contentHeight) + "px",
91876
- contentWidth: contentWidth,
91877
- contentHeight: contentHeight,
91731
+ width: "" + width + "px",
91732
+ height: "" + height + "px",
91878
91733
  transform: "matrix(" + formatMatrixNumber(a) + ", " + formatMatrixNumber(b) + ", " + formatMatrixNumber(c) + ", " + formatMatrixNumber(d) + ", " + formatMatrixNumber(e) + ", " + formatMatrixNumber(f) + ")"
91879
91734
  };
91880
91735
  }
91881
- var contentWidth1 = box.max.x - box.min.x;
91882
- var contentHeight1 = box.max.y - box.min.y;
91883
91736
  return {
91884
91737
  left: "" + (box.min.x - offsetX) + "px",
91885
91738
  top: "" + (box.min.y - offsetY) + "px",
91886
- width: "" + contentWidth1 + "px",
91887
- height: "" + contentHeight1 + "px",
91888
- contentWidth: contentWidth1,
91889
- contentHeight: contentHeight1,
91739
+ width: "" + (box.max.x - box.min.x) + "px",
91740
+ height: "" + (box.max.y - box.min.y) + "px",
91890
91741
  transform: ''
91891
91742
  };
91892
91743
  }
@@ -91909,10 +91760,6 @@ function formatMatrixNumber(value) {
91909
91760
  var normalized = Object.is(value, -0) ? 0 : value;
91910
91761
  return Number(normalized.toFixed(6)).toString();
91911
91762
  }
91912
- function formatPixelNumber(value) {
91913
- var normalized = Object.is(value, -0) ? 0 : value;
91914
- return Number(normalized.toFixed(6)).toString();
91915
- }
91916
91763
 
91917
91764
  function mountHTMLShell(container, content, shell) {
91918
91765
  if (!shell) {
@@ -91933,26 +91780,6 @@ function mountHTMLShell(container, content, shell) {
91933
91780
 
91934
91781
  var SHELL_INTERACTIVE_SELECTOR = '[data-vvfx-html-shell-interactive="true"]';
91935
91782
  var EDITING_INTERACTIVE_SELECTOR = '[data-vvfx-html-editing-interactive="true"]';
91936
- var CONTENT_INTERACTIVE_SELECTOR = [
91937
- '[data-vvfx-html-interaction-zone="self"]',
91938
- '[data-vvfx-html-interaction-zone="subtree"]',
91939
- 'a[href]',
91940
- 'button:not([disabled])',
91941
- 'input:not([disabled])',
91942
- 'textarea:not([disabled])',
91943
- 'select:not([disabled])',
91944
- 'summary',
91945
- 'video[controls]',
91946
- 'audio[controls]',
91947
- '[contenteditable]:not([contenteditable="false"])',
91948
- '[role="button"]',
91949
- '[role="link"]',
91950
- '[role="textbox"]',
91951
- '[tabindex]:not([tabindex="-1"])'
91952
- ].join(', ');
91953
- var CONTENT_INTERACTION_NONE_SELECTOR = [
91954
- '[data-vvfx-html-interaction-zone="none"]'
91955
- ].join(', ');
91956
91783
  var EDITING_VIEWPORT_PADDING = 48;
91957
91784
  var EDITING_VIEWPORT_BOX_SCALE = 1.1;
91958
91785
  var AUTO_HEIGHT_EPSILON = 0.5;
@@ -91962,20 +91789,14 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
91962
91789
  var _this = this;
91963
91790
  this.options = options;
91964
91791
  this.eventCleanups = [];
91965
- this.htmlRootConfigCleanups = new WeakMap();
91966
91792
  this.state = {
91967
91793
  frameElements: new Map(),
91968
91794
  elements: new Map(),
91969
- selectionElements: new Map(),
91970
91795
  contentScaleElements: new Map(),
91971
91796
  contentElements: new Map(),
91972
91797
  contentMountElements: new Map(),
91973
- contentInteractionZones: new Map(),
91974
- contentInteractionZoneCleanups: new Map(),
91975
- contentInteractionResizeCleanups: new Map(),
91976
91798
  contents: new Map(),
91977
91799
  cleanups: new Map(),
91978
- autoHeightModes: new Map(),
91979
91800
  autoHeightCleanups: new Map(),
91980
91801
  autoHeightFrames: new Map()
91981
91802
  };
@@ -91992,9 +91813,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
91992
91813
  }
91993
91814
  return;
91994
91815
  }
91995
- if (!_this.isEditableCard(targetId)) {
91996
- return;
91997
- }
91998
91816
  event.preventDefault();
91999
91817
  event.stopPropagation();
92000
91818
  _this.enterEditing(targetId);
@@ -92010,7 +91828,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92010
91828
  _this.exitEditing();
92011
91829
  };
92012
91830
  this.handleContainerMouseMove = function(event) {
92013
- _this.scheduleActiveContentInteractionSync(event);
92014
91831
  var hoverShellInteractiveId = _this.getHoverShellInteractiveIdByEvent(event);
92015
91832
  if (_this.state.hoverShellInteractiveId === hoverShellInteractiveId) {
92016
91833
  return;
@@ -92024,16 +91841,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92024
91841
  _this.syncContentInteraction(hoverShellInteractiveId);
92025
91842
  }
92026
91843
  };
92027
- this.handleContainerMouseLeave = function(event) {
92028
- if (_this.isMouseLeaveWithinContainer(event)) {
92029
- return;
92030
- }
92031
- if (_this.contentInteractionFrame !== undefined) {
92032
- cancelAnimationFrame(_this.contentInteractionFrame);
92033
- _this.contentInteractionFrame = undefined;
92034
- }
92035
- _this.pendingContentInteractionEvent = undefined;
92036
- _this.setActiveContentInteraction(undefined);
91844
+ this.handleContainerMouseLeave = function() {
92037
91845
  var previousId = _this.state.hoverShellInteractiveId;
92038
91846
  if (!previousId) {
92039
91847
  return;
@@ -92041,33 +91849,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92041
91849
  _this.state.hoverShellInteractiveId = undefined;
92042
91850
  _this.syncContentInteraction(previousId);
92043
91851
  };
92044
- this.handleContainerContextMenu = function(event) {
92045
- var activeInteraction = _this.state.activeContentInteraction;
92046
- if (!activeInteraction || !_this.isEventInsideOverlay(activeInteraction.id, event) || _this.isHTMLContextMenuEvent(event)) {
92047
- return;
92048
- }
92049
- var canvas = _this.options.getCanvasEventTarget == null ? void 0 : _this.options.getCanvasEventTarget.call(_this.options);
92050
- if (!canvas) {
92051
- return;
92052
- }
92053
- event.preventDefault();
92054
- event.stopPropagation();
92055
- _this.setActiveContentInteraction(undefined);
92056
- canvas.dispatchEvent(new MouseEvent('contextmenu', {
92057
- bubbles: true,
92058
- cancelable: true,
92059
- clientX: event.clientX,
92060
- clientY: event.clientY,
92061
- screenX: event.screenX,
92062
- screenY: event.screenY,
92063
- button: event.button,
92064
- buttons: event.buttons,
92065
- ctrlKey: event.ctrlKey,
92066
- shiftKey: event.shiftKey,
92067
- altKey: event.altKey,
92068
- metaKey: event.metaKey
92069
- }));
92070
- };
92071
91852
  this.isAutoHeightMessage = isCardHTMLAutoHeightMessage;
92072
91853
  }
92073
91854
  var _proto = HTMLOverlayManager.prototype;
@@ -92081,6 +91862,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92081
91862
  layer.style.position = 'absolute';
92082
91863
  layer.style.inset = '0';
92083
91864
  layer.style.pointerEvents = 'none';
91865
+ layer.style.zIndex = '1';
92084
91866
  container.appendChild(layer);
92085
91867
  this.state.layer = layer;
92086
91868
  this.initDOMEvents();
@@ -92093,32 +91875,16 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92093
91875
  cancelAnimationFrame(this.state.updateFrame);
92094
91876
  this.state.updateFrame = undefined;
92095
91877
  }
92096
- if (this.contentInteractionFrame !== undefined) {
92097
- cancelAnimationFrame(this.contentInteractionFrame);
92098
- this.contentInteractionFrame = undefined;
92099
- }
92100
- this.pendingContentInteractionEvent = undefined;
92101
91878
  this.state.cleanups.forEach(function(cleanup) {
92102
91879
  cleanup();
92103
91880
  });
92104
91881
  this.state.frameElements.clear();
92105
91882
  this.state.elements.clear();
92106
- this.state.selectionElements.clear();
92107
91883
  this.state.contentScaleElements.clear();
92108
91884
  this.state.contentElements.clear();
92109
91885
  this.state.contentMountElements.clear();
92110
- this.state.contentInteractionZones.clear();
92111
- this.state.contentInteractionZoneCleanups.forEach(function(cleanup) {
92112
- cleanup();
92113
- });
92114
- this.state.contentInteractionZoneCleanups.clear();
92115
- this.state.contentInteractionResizeCleanups.forEach(function(cleanup) {
92116
- cleanup();
92117
- });
92118
- this.state.contentInteractionResizeCleanups.clear();
92119
91886
  this.state.contents.clear();
92120
91887
  this.state.cleanups.clear();
92121
- this.state.autoHeightModes.clear();
92122
91888
  this.state.autoHeightCleanups.forEach(function(cleanup) {
92123
91889
  cleanup();
92124
91890
  });
@@ -92133,12 +91899,10 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92133
91899
  this.eventCleanups = [];
92134
91900
  (_this_state_layer = this.state.layer) == null ? void 0 : _this_state_layer.remove();
92135
91901
  this.state.layer = undefined;
92136
- this.state.selectionLayer = undefined;
92137
91902
  this.options.container.removeEventListener('dblclick', this.handleContainerDoubleClick, true);
92138
91903
  this.options.container.removeEventListener('mousedown', this.handleContainerMouseDown, true);
92139
91904
  this.options.container.removeEventListener('mousemove', this.handleContainerMouseMove, true);
92140
91905
  this.options.container.removeEventListener('mouseleave', this.handleContainerMouseLeave, true);
92141
- this.options.container.removeEventListener('contextmenu', this.handleContainerContextMenu, true);
92142
91906
  };
92143
91907
  _proto.scheduleRender = function scheduleRender() {
92144
91908
  var _this = this;
@@ -92150,10 +91914,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92150
91914
  _this.render();
92151
91915
  });
92152
91916
  };
92153
- _proto.invalidateCardHTML = function invalidateCardHTML(id) {
92154
- this.cleanupOverlayContent(id);
92155
- this.invalidateContentInteractionZones(id);
92156
- };
92157
91917
  _proto.rasterizeCard = function rasterizeCard(id, options) {
92158
91918
  return _async_to_generator(function() {
92159
91919
  var contentOverlay, capture, _ref, _options_pixelRatio, image, error;
@@ -92246,7 +92006,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92246
92006
  var events = [
92247
92007
  'pageDataChange',
92248
92008
  'selectedItemChange',
92249
- 'preSelectedItemChange',
92250
92009
  'itemPropertyChange',
92251
92010
  'viewportTransform',
92252
92011
  'viewRebuildFinish'
@@ -92256,7 +92015,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92256
92015
  if (event === 'viewportTransform') {
92257
92016
  _this.handleViewportTransform();
92258
92017
  }
92259
- _this.invalidateContentInteractionZones();
92260
92018
  _this.scheduleRender();
92261
92019
  });
92262
92020
  });
@@ -92266,24 +92024,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92266
92024
  this.options.container.addEventListener('mousedown', this.handleContainerMouseDown, true);
92267
92025
  this.options.container.addEventListener('mousemove', this.handleContainerMouseMove, true);
92268
92026
  this.options.container.addEventListener('mouseleave', this.handleContainerMouseLeave, true);
92269
- this.options.container.addEventListener('contextmenu', this.handleContainerContextMenu, true);
92270
- };
92271
- _proto.isMouseLeaveWithinContainer = function isMouseLeaveWithinContainer(event) {
92272
- var relatedTarget = event.relatedTarget;
92273
- if (!relatedTarget) {
92274
- return false;
92275
- }
92276
- try {
92277
- return this.options.container.contains(relatedTarget);
92278
- } catch (unused) {
92279
- return false;
92280
- }
92281
- };
92282
- _proto.isHTMLContextMenuEvent = function isHTMLContextMenuEvent(event) {
92283
- if (typeof Element !== 'function' || !_instanceof(event.target, Element)) {
92284
- return false;
92285
- }
92286
- return !!event.target.closest('[data-interaction-contextmenu="self"], [data-vvfx-html-contextmenu="self"]');
92287
92027
  };
92288
92028
  _proto.handleViewportTransform = function handleViewportTransform() {
92289
92029
  var editing = this.state.editing;
@@ -92303,16 +92043,11 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92303
92043
  }
92304
92044
  var items = this.options.getItems();
92305
92045
  var frameByChildId = this.renderFrameOverlays(items, layer);
92306
- var selectionLayer = this.getOrCreateSelectionLayer(layer);
92307
92046
  var visibleCardIds = new Set();
92308
92047
  var editingVisible = false;
92309
92048
  items.forEach(function(item) {
92310
92049
  var _this_state_editing;
92311
- if (!isCardItem(item) || !item.visible) {
92312
- return;
92313
- }
92314
- var html = _this.options.resolveCardHTML(item);
92315
- if (html === undefined) {
92050
+ if (!isCardItem(item) || !item.visible || item.html === undefined) {
92316
92051
  return;
92317
92052
  }
92318
92053
  var itemBox = _this.options.getViewBoxById(item.id);
@@ -92327,31 +92062,21 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92327
92062
  var frameBox = frameId ? _this.options.getViewBoxById(frameId) : undefined;
92328
92063
  var overlay = _this.getOrCreateOverlay(item.id, parentOverlay, elements);
92329
92064
  var contentOverlay = _this.getOrCreateContentOverlay(item.id, overlay);
92330
- var selectionOverlay = _this.getOrCreateSelectionOverlay(item.id, selectionLayer);
92331
- if (!_this.state.contents.has(item.id)) {
92065
+ var html = item.html;
92066
+ if (html && _this.state.contents.get(item.id) !== html) {
92332
92067
  _this.renderOverlayHTML(item.id, contentOverlay, html);
92333
92068
  }
92334
- _this.applyHTMLRootConfig(overlay, html);
92335
92069
  var offsetX = frameBox && !frameBox.isEmpty() ? frameBox.min.x : 0;
92336
92070
  var offsetY = frameBox && !frameBox.isEmpty() ? frameBox.min.y : 0;
92337
- var boxStyle = getCardOverlayBoxStyle(itemBox, item.property.width, item.property.height, offsetX, offsetY, _this.isAutoScaleEnabled(item));
92071
+ var boxStyle = getCardOverlayBoxStyle(itemBox, item.property.width, item.property.height, offsetX, offsetY);
92338
92072
  overlay.style.left = boxStyle.left;
92339
92073
  overlay.style.top = boxStyle.top;
92340
92074
  overlay.style.width = boxStyle.width;
92341
92075
  overlay.style.height = boxStyle.height;
92342
92076
  overlay.style.transform = boxStyle.transform;
92343
92077
  overlay.style.transformOrigin = '0 0';
92344
- var selectionBoxStyle = getCardOverlayBoxStyle(itemBox, item.property.width, item.property.height, 0, 0, _this.isAutoScaleEnabled(item));
92345
- selectionOverlay.style.left = selectionBoxStyle.left;
92346
- selectionOverlay.style.top = selectionBoxStyle.top;
92347
- selectionOverlay.style.width = selectionBoxStyle.width;
92348
- selectionOverlay.style.height = selectionBoxStyle.height;
92349
- selectionOverlay.style.transform = selectionBoxStyle.transform;
92350
- selectionOverlay.style.transformOrigin = '0 0';
92351
- _this.applyHTMLRootConfig(selectionOverlay, html);
92352
- _this.syncOverlaySelection(item.id, overlay, selectionOverlay);
92353
- _this.syncContentScale(item.id, boxStyle.contentWidth, boxStyle.contentHeight);
92354
- _this.syncAutoHeight(item.id, _this.isAutoHeightEnabled(item));
92078
+ _this.syncContentScale(item.id, item.property.width, item.property.height);
92079
+ _this.syncAutoHeight(item.id, item.property.autoHeight === true);
92355
92080
  _this.syncContentInteraction(item.id);
92356
92081
  });
92357
92082
  elements.forEach(function(_overlay, id) {
@@ -92390,9 +92115,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92390
92115
  }
92391
92116
  }
92392
92117
  syncElementStackOrder(layer, rootElements);
92393
- if (this.state.selectionLayer) {
92394
- this.state.selectionLayer.style.zIndex = "" + (rootElements.length + 1);
92395
- }
92396
92118
  this.state.frameElements.forEach(function(frameOverlay, frameId) {
92397
92119
  var frameElements = [];
92398
92120
  for(var _iterator = _create_for_of_iterator_helper_loose(items), _step; !(_step = _iterator()).done;){
@@ -92408,28 +92130,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92408
92130
  syncElementStackOrder(frameOverlay, frameElements);
92409
92131
  });
92410
92132
  };
92411
- _proto.getOrCreateSelectionLayer = function getOrCreateSelectionLayer(layer) {
92412
- var _layer_ownerDocument;
92413
- if (this.state.selectionLayer) {
92414
- if (this.state.selectionLayer.parentElement !== layer) {
92415
- layer.appendChild(this.state.selectionLayer);
92416
- }
92417
- return this.state.selectionLayer;
92418
- }
92419
- var ownerDocument = (_layer_ownerDocument = layer.ownerDocument) != null ? _layer_ownerDocument : typeof document === 'undefined' ? undefined : document;
92420
- if (!ownerDocument) {
92421
- return layer;
92422
- }
92423
- var selectionLayer = ownerDocument.createElement('div');
92424
- selectionLayer.className = 'vvfx-card-html-overlay-selection-layer';
92425
- selectionLayer.style.position = 'absolute';
92426
- selectionLayer.style.inset = '0';
92427
- selectionLayer.style.pointerEvents = 'none';
92428
- selectionLayer.style.zIndex = '1';
92429
- layer.appendChild(selectionLayer);
92430
- this.state.selectionLayer = selectionLayer;
92431
- return selectionLayer;
92432
- };
92433
92133
  _proto.renderFrameOverlays = function renderFrameOverlays(items, layer) {
92434
92134
  var _this = this;
92435
92135
  var visibleFrameIds = new Set();
@@ -92494,41 +92194,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92494
92194
  elements.set(id, overlay);
92495
92195
  return overlay;
92496
92196
  };
92497
- _proto.getOrCreateSelectionOverlay = function getOrCreateSelectionOverlay(id, parent) {
92498
- var selectionOverlay = this.state.selectionElements.get(id);
92499
- if (selectionOverlay) {
92500
- if (selectionOverlay.parentElement !== parent) {
92501
- parent.appendChild(selectionOverlay);
92502
- }
92503
- return selectionOverlay;
92504
- }
92505
- selectionOverlay = document.createElement('div');
92506
- selectionOverlay.className = 'vvfx-card-html-overlay-selection';
92507
- selectionOverlay.dataset.itemId = id;
92508
- selectionOverlay.style.position = 'absolute';
92509
- selectionOverlay.style.pointerEvents = 'none';
92510
- selectionOverlay.style.zIndex = '1';
92511
- parent.appendChild(selectionOverlay);
92512
- this.state.selectionElements.set(id, selectionOverlay);
92513
- return selectionOverlay;
92514
- };
92515
- _proto.syncOverlaySelection = function syncOverlaySelection(id, overlay, selectionOverlay) {
92516
- var isSelected = this.options.getSelectedItemIds().includes(id);
92517
- var isPreSelected = !isSelected && this.options.getPreSelectedItemId() === id;
92518
- overlay.dataset.selected = isSelected ? 'true' : 'false';
92519
- overlay.dataset.preSelected = isPreSelected ? 'true' : 'false';
92520
- selectionOverlay.dataset.selected = isSelected ? 'true' : 'false';
92521
- selectionOverlay.dataset.preSelected = isPreSelected ? 'true' : 'false';
92522
- selectionOverlay.style.boxShadow = isSelected ? this.getSelectionBoxShadow() : isPreSelected ? this.getPreSelectionBoxShadow() : '';
92523
- };
92524
- _proto.getSelectionBoxShadow = function getSelectionBoxShadow() {
92525
- var _this_options_getSelectionEdgeStyle = this.options.getSelectionEdgeStyle(), color = _this_options_getSelectionEdgeStyle.color, alpha = _this_options_getSelectionEdgeStyle.alpha, width = _this_options_getSelectionEdgeStyle.width;
92526
- return "inset 0 0 0 " + formatCssNumber(width) + "px " + formatCssColor(color, alpha);
92527
- };
92528
- _proto.getPreSelectionBoxShadow = function getPreSelectionBoxShadow() {
92529
- var _this_options_getPreSelectionEdgeStyle = this.options.getPreSelectionEdgeStyle(), color = _this_options_getPreSelectionEdgeStyle.color, alpha = _this_options_getPreSelectionEdgeStyle.alpha, width = _this_options_getPreSelectionEdgeStyle.width;
92530
- return "inset 0 0 0 " + formatCssNumber(width) + "px " + formatCssColor(color, alpha);
92531
- };
92532
92197
  _proto.getHTMLCardIdByEvent = function getHTMLCardIdByEvent(event) {
92533
92198
  var layer = this.state.layer;
92534
92199
  if (!layer) {
@@ -92538,7 +92203,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92538
92203
  var items = this.options.getItems();
92539
92204
  for(var i = items.length - 1; i >= 0; i--){
92540
92205
  var item = items[i];
92541
- if (!isCardItem(item) || !item.visible || this.options.resolveCardHTML(item) === undefined) {
92206
+ if (!isCardItem(item) || !item.visible || item.html === undefined) {
92542
92207
  continue;
92543
92208
  }
92544
92209
  var box = this.options.getViewBoxById(item.id);
@@ -92557,7 +92222,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92557
92222
  var items = this.options.getItems();
92558
92223
  for(var i = items.length - 1; i >= 0; i--){
92559
92224
  var item = items[i];
92560
- if (!isCardItem(item) || !item.visible || this.options.resolveCardHTML(item) === undefined) {
92225
+ if (!isCardItem(item) || !item.visible || item.html === undefined) {
92561
92226
  continue;
92562
92227
  }
92563
92228
  var box = this.options.getViewBoxById(item.id);
@@ -92567,206 +92232,13 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92567
92232
  var contentOverlay = this.state.contentElements.get(item.id);
92568
92233
  var interactiveElements = contentOverlay ? Array.from(contentOverlay.querySelectorAll(SHELL_INTERACTIVE_SELECTOR)) : [];
92569
92234
  var isHoveringShellInteractive = interactiveElements.some(function(element) {
92570
- return isMouseEventInsideRect(event, element.getBoundingClientRect());
92235
+ var rect = element.getBoundingClientRect();
92236
+ return event.clientX >= rect.left && event.clientX <= rect.right && event.clientY >= rect.top && event.clientY <= rect.bottom;
92571
92237
  });
92572
92238
  return isHoveringShellInteractive ? item.id : undefined;
92573
92239
  }
92574
92240
  return undefined;
92575
92241
  };
92576
- _proto.syncActiveContentInteraction = function syncActiveContentInteraction(event) {
92577
- var decision = this.resolveHTMLInteractionTarget(event);
92578
- if (decision.kind === 'canvas' && this.shouldKeepActiveContentInteractionForFocusedElement()) {
92579
- return;
92580
- }
92581
- this.setActiveContentInteraction(decision.kind === 'html' ? decision.interaction : undefined);
92582
- };
92583
- _proto.scheduleActiveContentInteractionSync = function scheduleActiveContentInteractionSync(event) {
92584
- var _this = this;
92585
- if (typeof requestAnimationFrame !== 'function') {
92586
- this.syncActiveContentInteraction(event);
92587
- return;
92588
- }
92589
- this.pendingContentInteractionEvent = event;
92590
- if (this.contentInteractionFrame !== undefined) {
92591
- return;
92592
- }
92593
- this.contentInteractionFrame = requestAnimationFrame(function() {
92594
- _this.contentInteractionFrame = undefined;
92595
- var pendingEvent = _this.pendingContentInteractionEvent;
92596
- _this.pendingContentInteractionEvent = undefined;
92597
- if (pendingEvent) {
92598
- _this.syncActiveContentInteraction(pendingEvent);
92599
- }
92600
- });
92601
- };
92602
- _proto.setActiveContentInteraction = function setActiveContentInteraction(zone) {
92603
- var _this = this;
92604
- var previous = this.state.activeContentInteraction;
92605
- 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)) {
92606
- return;
92607
- }
92608
- this.state.activeContentInteraction = zone;
92609
- var changedIds = new Set();
92610
- if (previous) {
92611
- changedIds.add(previous.id);
92612
- }
92613
- if (zone) {
92614
- changedIds.add(zone.id);
92615
- }
92616
- changedIds.forEach(function(id) {
92617
- _this.syncContentInteraction(id);
92618
- });
92619
- };
92620
- _proto.shouldKeepActiveContentInteractionForFocusedElement = function shouldKeepActiveContentInteractionForFocusedElement() {
92621
- var activeInteraction = this.state.activeContentInteraction;
92622
- if (!activeInteraction || typeof document === 'undefined') {
92623
- return false;
92624
- }
92625
- var activeElement = document.activeElement;
92626
- if (!activeElement || activeElement === document.body) {
92627
- return false;
92628
- }
92629
- var interactionElement = activeInteraction.element;
92630
- return interactionElement === activeElement || typeof interactionElement.contains === 'function' && interactionElement.contains(activeElement);
92631
- };
92632
- _proto.resolveHTMLInteractionTarget = function resolveHTMLInteractionTarget(event) {
92633
- var id = this.getHTMLCardIdByEvent(event);
92634
- if (!id || this.isEditableCard(id)) {
92635
- return {
92636
- kind: 'canvas',
92637
- id: id
92638
- };
92639
- }
92640
- var contentOverlay = this.state.contentElements.get(id);
92641
- if (!contentOverlay) {
92642
- return {
92643
- kind: 'canvas',
92644
- id: id
92645
- };
92646
- }
92647
- var activeSubtree = this.getActiveSubtreeInteractionAtEvent(id, event);
92648
- if (activeSubtree) {
92649
- return {
92650
- kind: 'html',
92651
- interaction: activeSubtree
92652
- };
92653
- }
92654
- var matchedZones = this.getContentInteractionZones(id, contentOverlay).filter(function(zone) {
92655
- return isMouseEventInsideRect(event, zone.rect);
92656
- });
92657
- var zone = this.resolveContentInteractionZone(matchedZones);
92658
- if (zone) {
92659
- return {
92660
- kind: 'html',
92661
- interaction: {
92662
- id: id,
92663
- element: zone.element,
92664
- zone: zone.zone
92665
- }
92666
- };
92667
- }
92668
- return {
92669
- kind: 'canvas',
92670
- id: id
92671
- };
92672
- };
92673
- _proto.getActiveSubtreeInteractionAtEvent = function getActiveSubtreeInteractionAtEvent(id, event) {
92674
- var activeInteraction = this.state.activeContentInteraction;
92675
- if ((activeInteraction == null ? void 0 : activeInteraction.id) !== id || activeInteraction.zone !== 'subtree') {
92676
- return undefined;
92677
- }
92678
- var rect = activeInteraction.element.getBoundingClientRect();
92679
- return isMouseEventInsideRect(event, rect) ? activeInteraction : undefined;
92680
- };
92681
- _proto.resolveContentInteractionZone = function resolveContentInteractionZone(zones) {
92682
- if (zones.length <= 1) {
92683
- return zones[0];
92684
- }
92685
- var subtreeRoot = zones.find(function(candidate) {
92686
- return candidate.zone === 'subtree' && typeof candidate.element.contains === 'function' && zones.some(function(zone) {
92687
- return zone.element !== candidate.element && candidate.element.contains(zone.element);
92688
- });
92689
- });
92690
- return subtreeRoot != null ? subtreeRoot : zones[0];
92691
- };
92692
- _proto.getContentInteractionZones = function getContentInteractionZones(id, contentOverlay) {
92693
- var _this = this;
92694
- var cachedZones = this.state.contentInteractionZones.get(id);
92695
- if (cachedZones) {
92696
- return cachedZones;
92697
- }
92698
- var zones = Array.from(contentOverlay.querySelectorAll(this.getContentInteractiveSelector(id))).filter(function(element) {
92699
- return !_this.isContentInteractionDisabled(element);
92700
- }).map(function(element) {
92701
- return {
92702
- element: element,
92703
- rect: element.getBoundingClientRect(),
92704
- zone: _this.getContentInteractionZoneMode(element)
92705
- };
92706
- });
92707
- this.state.contentInteractionZones.set(id, zones);
92708
- this.observeContentInteractionZoneResizes(id, zones);
92709
- return zones;
92710
- };
92711
- _proto.getContentInteractiveSelector = function getContentInteractiveSelector(id) {
92712
- var _ref;
92713
- var _this_options_resolveCardTypeConfig_htmlInteractionSelectors, _this_options_resolveCardTypeConfig;
92714
- var item = this.options.getItems().find(function(item) {
92715
- return item.id === id;
92716
- });
92717
- if (!item) {
92718
- return CONTENT_INTERACTIVE_SELECTOR;
92719
- }
92720
- 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 : [];
92721
- if (selectors.length === 0) {
92722
- return CONTENT_INTERACTIVE_SELECTOR;
92723
- }
92724
- return [].concat([
92725
- CONTENT_INTERACTIVE_SELECTOR
92726
- ], selectors).join(', ');
92727
- };
92728
- _proto.isContentInteractionDisabled = function isContentInteractionDisabled(element) {
92729
- if (typeof element.closest !== 'function') {
92730
- return false;
92731
- }
92732
- return !!element.closest(CONTENT_INTERACTION_NONE_SELECTOR);
92733
- };
92734
- _proto.getContentInteractionZoneMode = function getContentInteractionZoneMode(element) {
92735
- var zone = element.dataset.vvfxHtmlInteractionZone;
92736
- return zone === 'subtree' ? 'subtree' : 'self';
92737
- };
92738
- _proto.invalidateContentInteractionZones = function invalidateContentInteractionZones(id) {
92739
- if (id) {
92740
- var _this_state_contentInteractionResizeCleanups_get;
92741
- this.state.contentInteractionZones.delete(id);
92742
- (_this_state_contentInteractionResizeCleanups_get = this.state.contentInteractionResizeCleanups.get(id)) == null ? void 0 : _this_state_contentInteractionResizeCleanups_get();
92743
- this.state.contentInteractionResizeCleanups.delete(id);
92744
- return;
92745
- }
92746
- this.state.contentInteractionZones.clear();
92747
- this.state.contentInteractionResizeCleanups.forEach(function(cleanup) {
92748
- cleanup();
92749
- });
92750
- this.state.contentInteractionResizeCleanups.clear();
92751
- };
92752
- _proto.observeContentInteractionZoneResizes = function observeContentInteractionZoneResizes(id, zones) {
92753
- var _this = this;
92754
- var _this_state_contentInteractionResizeCleanups_get;
92755
- (_this_state_contentInteractionResizeCleanups_get = this.state.contentInteractionResizeCleanups.get(id)) == null ? void 0 : _this_state_contentInteractionResizeCleanups_get();
92756
- this.state.contentInteractionResizeCleanups.delete(id);
92757
- if (zones.length === 0 || typeof ResizeObserver !== 'function') {
92758
- return;
92759
- }
92760
- var observer = new ResizeObserver(function() {
92761
- _this.invalidateContentInteractionZones(id);
92762
- });
92763
- zones.forEach(function(zone) {
92764
- observer.observe(zone.element);
92765
- });
92766
- this.state.contentInteractionResizeCleanups.set(id, function() {
92767
- observer.disconnect();
92768
- });
92769
- };
92770
92242
  _proto.getLayerPoint = function getLayerPoint(event) {
92771
92243
  var rect = this.options.container.getBoundingClientRect();
92772
92244
  return {
@@ -92823,35 +92295,19 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92823
92295
  if (!scaleOverlay || !contentOverlay || width <= 0 || height <= 0) {
92824
92296
  return;
92825
92297
  }
92826
- var nextWidth = "" + width + "px";
92827
- var nextHeight = "" + height + "px";
92828
- var sizeChanged = scaleOverlay.style.width !== nextWidth || scaleOverlay.style.height !== nextHeight;
92829
- scaleOverlay.style.width = nextWidth;
92830
- scaleOverlay.style.height = nextHeight;
92298
+ scaleOverlay.style.width = "" + width + "px";
92299
+ scaleOverlay.style.height = "" + height + "px";
92831
92300
  scaleOverlay.style.transform = 'none';
92832
- contentOverlay.style.width = nextWidth;
92833
- contentOverlay.style.height = nextHeight;
92834
- if (sizeChanged && this.state.autoHeightModes.get(id) === 'message') {
92835
- this.requestAutoHeightFromIframes(id, contentOverlay);
92836
- }
92837
- if (sizeChanged) {
92838
- this.invalidateContentInteractionZones(id);
92839
- }
92840
- };
92841
- _proto.requestAutoHeightFromIframes = function requestAutoHeightFromIframes(id, contentOverlay) {
92842
- contentOverlay.querySelectorAll('iframe').forEach(function(iframe) {
92843
- requestCardHTMLAutoHeight(iframe, id);
92844
- });
92301
+ contentOverlay.style.width = "" + width + "px";
92302
+ contentOverlay.style.height = "" + height + "px";
92845
92303
  };
92846
92304
  _proto.syncContentInteraction = function syncContentInteraction(id) {
92847
- var _this_state_editing, _this_state_activeContentInteraction;
92305
+ var _this_state_editing;
92848
92306
  var isEditing = ((_this_state_editing = this.state.editing) == null ? void 0 : _this_state_editing.id) === id;
92849
- var activeInteraction = ((_this_state_activeContentInteraction = this.state.activeContentInteraction) == null ? void 0 : _this_state_activeContentInteraction.id) === id ? this.state.activeContentInteraction : undefined;
92850
92307
  var overlay = this.state.elements.get(id);
92851
92308
  var scaleOverlay = this.state.contentScaleElements.get(id);
92852
92309
  var contentOverlay = this.state.contentElements.get(id);
92853
92310
  var contentMount = this.state.contentMountElements.get(id);
92854
- var isInteractive = isEditing || !!activeInteraction;
92855
92311
  if (overlay) {
92856
92312
  overlay.dataset.editing = isEditing ? 'true' : 'false';
92857
92313
  overlay.style.pointerEvents = 'none';
@@ -92862,62 +92318,34 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92862
92318
  }
92863
92319
  if (contentOverlay) {
92864
92320
  contentOverlay.dataset.editing = isEditing ? 'true' : 'false';
92865
- contentOverlay.style.pointerEvents = isInteractive ? 'auto' : 'none';
92321
+ contentOverlay.style.pointerEvents = 'none';
92866
92322
  contentOverlay.querySelectorAll('iframe').forEach(function(iframe) {
92867
- var isActiveIframe = isEditing || (activeInteraction == null ? void 0 : activeInteraction.element) === iframe;
92868
- iframe.style.pointerEvents = isActiveIframe ? 'auto' : 'none';
92869
- iframe.tabIndex = isActiveIframe ? 0 : -1;
92323
+ iframe.style.pointerEvents = isEditing ? 'auto' : 'none';
92324
+ iframe.tabIndex = isEditing ? 0 : -1;
92870
92325
  });
92871
- this.syncShellInteraction(id, contentOverlay, isInteractive);
92872
- this.syncContentInteractionZones(id, contentOverlay, activeInteraction, isEditing, isInteractive);
92326
+ this.syncShellInteraction(id, contentOverlay, isEditing);
92873
92327
  }
92874
92328
  if (contentMount) {
92875
92329
  contentMount.dataset.editing = isEditing ? 'true' : 'false';
92876
- contentMount.style.pointerEvents = isInteractive ? 'auto' : 'none';
92877
- contentMount.inert = !isInteractive;
92878
- if (isInteractive) {
92330
+ contentMount.style.pointerEvents = isEditing ? 'auto' : 'none';
92331
+ contentMount.inert = !isEditing;
92332
+ if (isEditing) {
92879
92333
  contentMount.removeAttribute('aria-hidden');
92880
92334
  } else {
92881
92335
  contentMount.setAttribute('aria-hidden', 'true');
92882
92336
  }
92883
92337
  }
92884
92338
  };
92885
- _proto.syncContentInteractionZones = function syncContentInteractionZones(id, contentOverlay, activeInteraction, isEditing, isInteractive) {
92886
- var _this = this;
92887
- var activeElement = activeInteraction == null ? void 0 : activeInteraction.element;
92888
- contentOverlay.querySelectorAll(this.getContentInteractiveSelector(id)).forEach(function(element) {
92889
- if ((activeInteraction == null ? void 0 : activeInteraction.zone) === 'subtree' && activeElement && element !== activeElement && typeof activeElement.contains === 'function' && activeElement.contains(element)) {
92890
- _this.clearContentInteractionState(element);
92891
- return;
92892
- }
92893
- if (!isInteractive) {
92894
- _this.clearContentInteractionState(element);
92895
- return;
92896
- }
92897
- if (_this.isContentInteractionDisabled(element)) {
92898
- element.dataset.vvfxHtmlInteractionActive = 'false';
92899
- element.style.pointerEvents = 'none';
92900
- return;
92901
- }
92902
- var isElementInteractive = isEditing || activeElement === element || (activeInteraction == null ? void 0 : activeInteraction.zone) === 'subtree' && typeof (activeElement == null ? void 0 : activeElement.contains) === 'function' && activeElement.contains(element);
92903
- element.dataset.vvfxHtmlInteractionActive = isElementInteractive ? 'true' : 'false';
92904
- element.style.pointerEvents = isElementInteractive ? 'auto' : 'none';
92905
- });
92906
- };
92907
- _proto.clearContentInteractionState = function clearContentInteractionState(element) {
92908
- delete element.dataset.vvfxHtmlInteractionActive;
92909
- element.style.pointerEvents = '';
92910
- };
92911
- _proto.syncShellInteraction = function syncShellInteraction(id, contentOverlay, isInteractive) {
92339
+ _proto.syncShellInteraction = function syncShellInteraction(id, contentOverlay, isEditing) {
92912
92340
  var isHoveringShellInteractive = this.state.hoverShellInteractiveId === id;
92913
- var isShellInteractiveActive = isInteractive || isHoveringShellInteractive;
92341
+ var isShellInteractiveActive = isEditing || isHoveringShellInteractive;
92914
92342
  contentOverlay.querySelectorAll(SHELL_INTERACTIVE_SELECTOR).forEach(function(element) {
92915
92343
  element.dataset.vvfxHtmlShellInteractiveHover = isHoveringShellInteractive ? 'true' : 'false';
92916
92344
  element.dataset.vvfxHtmlShellInteractiveActive = isShellInteractiveActive ? 'true' : 'false';
92917
92345
  element.style.pointerEvents = isShellInteractiveActive ? 'auto' : 'none';
92918
92346
  });
92919
92347
  contentOverlay.querySelectorAll(EDITING_INTERACTIVE_SELECTOR).forEach(function(element) {
92920
- element.style.pointerEvents = isInteractive ? 'auto' : 'none';
92348
+ element.style.pointerEvents = isEditing ? 'auto' : 'none';
92921
92349
  });
92922
92350
  };
92923
92351
  _proto.enterEditing = function enterEditing(id) {
@@ -92925,9 +92353,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92925
92353
  if (((_this_state_editing = this.state.editing) == null ? void 0 : _this_state_editing.id) === id) {
92926
92354
  return;
92927
92355
  }
92928
- if (!this.isEditableCard(id)) {
92929
- return;
92930
- }
92931
92356
  var box = this.options.getViewBoxById(id);
92932
92357
  if (box.isEmpty()) {
92933
92358
  return;
@@ -92971,13 +92396,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
92971
92396
  this.options.setViewport(editing.restoreViewport);
92972
92397
  this.scheduleRender();
92973
92398
  };
92974
- _proto.isEditableCard = function isEditableCard(id) {
92975
- var _this_options_resolveCardTypeConfig;
92976
- var item = this.options.getItems().find(function(item) {
92977
- return item.id === id;
92978
- });
92979
- return isCardItem(item) && ((_this_options_resolveCardTypeConfig = this.options.resolveCardTypeConfig(item)) == null ? void 0 : _this_options_resolveCardTypeConfig.editable) !== false;
92980
- };
92981
92399
  _proto.getEditingFitZoom = function getEditingFitZoom(box, currentZoom) {
92982
92400
  var viewportElement = this.options.container.parentElement;
92983
92401
  if (!viewportElement) {
@@ -93002,7 +92420,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93002
92420
  };
93003
92421
  _proto.renderOverlayHTML = function renderOverlayHTML(id, overlay, html) {
93004
92422
  this.cleanupOverlayContent(id);
93005
- this.invalidateContentInteractionZones(id);
93006
92423
  overlay.innerHTML = '';
93007
92424
  var shell = mountHTMLShell(overlay, html.content, html.shell);
93008
92425
  var autoHeightMeasureElement = shell.contentContainer.isConnected ? shell.contentContainer : overlay;
@@ -93012,81 +92429,18 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93012
92429
  });
93013
92430
  var contentCleanup = this.renderOverlayContent(shell.contentContainer, html.content, {
93014
92431
  id: id,
93015
- autoHeight: this.isAutoHeightEnabled(item)
92432
+ autoHeight: isCardItem(item) && item.property.autoHeight === true
93016
92433
  });
93017
- this.observeContentInteractionZones(id, shell.contentContainer);
93018
92434
  this.state.cleanups.set(id, function() {
93019
92435
  contentCleanup == null ? void 0 : contentCleanup();
93020
92436
  shell.cleanup == null ? void 0 : shell.cleanup.call(shell);
93021
92437
  });
93022
92438
  this.state.contents.set(id, html);
93023
92439
  };
93024
- _proto.observeContentInteractionZones = function observeContentInteractionZones(id, contentContainer) {
93025
- var _this = this;
93026
- var _this_state_contentInteractionZoneCleanups_get;
93027
- (_this_state_contentInteractionZoneCleanups_get = this.state.contentInteractionZoneCleanups.get(id)) == null ? void 0 : _this_state_contentInteractionZoneCleanups_get();
93028
- this.state.contentInteractionZoneCleanups.delete(id);
93029
- if (typeof MutationObserver !== 'function') {
93030
- return;
93031
- }
93032
- var observer = new MutationObserver(function() {
93033
- _this.invalidateContentInteractionZones(id);
93034
- });
93035
- observer.observe(contentContainer, {
93036
- attributes: true,
93037
- childList: true,
93038
- subtree: true
93039
- });
93040
- this.state.contentInteractionZoneCleanups.set(id, function() {
93041
- observer.disconnect();
93042
- });
93043
- };
93044
- _proto.applyHTMLRootConfig = function applyHTMLRootConfig(root, html) {
93045
- var _ref, _config_style;
93046
- var _this_htmlRootConfigCleanups_get, _config_className;
93047
- (_this_htmlRootConfigCleanups_get = this.htmlRootConfigCleanups.get(root)) == null ? void 0 : _this_htmlRootConfigCleanups_get();
93048
- this.htmlRootConfigCleanups.delete(root);
93049
- var config = html.root;
93050
- if (!config) {
93051
- return;
93052
- }
93053
- var classNames = (_ref = (_config_className = config.className) == null ? void 0 : _config_className.split(/\s+/).filter(Boolean)) != null ? _ref : [];
93054
- var styleProperties = [];
93055
- classNames.forEach(function(className) {
93056
- root.classList.add(className);
93057
- });
93058
- Object.entries((_config_style = config.style) != null ? _config_style : {}).forEach(function(param) {
93059
- var property = param[0], value = param[1];
93060
- if (value === undefined) {
93061
- return;
93062
- }
93063
- styleProperties.push(property);
93064
- if (property.startsWith('--') || property.includes('-')) {
93065
- root.style.setProperty(property, String(value));
93066
- return;
93067
- }
93068
- root.style[property] = String(value);
93069
- });
93070
- this.htmlRootConfigCleanups.set(root, function() {
93071
- classNames.forEach(function(className) {
93072
- root.classList.remove(className);
93073
- });
93074
- styleProperties.forEach(function(property) {
93075
- if (property.startsWith('--') || property.includes('-')) {
93076
- root.style.removeProperty(property);
93077
- return;
93078
- }
93079
- root.style[property] = '';
93080
- });
93081
- });
93082
- };
93083
92440
  _proto.renderOverlayContent = function renderOverlayContent(overlay, content, options) {
93084
92441
  var _this = this;
93085
92442
  switch(content.kind){
93086
92443
  case 'inline':
93087
- if (options == null ? void 0 : options.autoHeight) {
93088
- this.state.autoHeightModes.set(options.id, 'message');
93089
- }
93090
92444
  return this.chainCleanups(function() {
93091
92445
  return content.cleanup == null ? void 0 : content.cleanup.call(content, overlay);
93092
92446
  }, renderDocumentContent(overlay, {
@@ -93103,9 +92457,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93103
92457
  }));
93104
92458
  case 'dom':
93105
92459
  {
93106
- if (options == null ? void 0 : options.autoHeight) {
93107
- this.state.autoHeightModes.set(options.id, 'measure');
93108
- }
93109
92460
  if (content.target === 'iframe') {
93110
92461
  return renderDOMContentInIframe(overlay, content.render, content.cleanup);
93111
92462
  }
@@ -93115,9 +92466,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93115
92466
  } : undefined;
93116
92467
  }
93117
92468
  case 'document':
93118
- if (options == null ? void 0 : options.autoHeight) {
93119
- this.state.autoHeightModes.set(options.id, 'message');
93120
- }
93121
92469
  return this.chainCleanups(function() {
93122
92470
  return content.cleanup == null ? void 0 : content.cleanup.call(content, overlay);
93123
92471
  }, renderDocumentContent(overlay, content, {
@@ -93145,7 +92493,6 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93145
92493
  };
93146
92494
  };
93147
92495
  _proto.cleanupOverlayContent = function cleanupOverlayContent(id) {
93148
- var _this_state_contentInteractionZoneCleanups_get;
93149
92496
  var cleanup = this.state.cleanups.get(id);
93150
92497
  if (cleanup) {
93151
92498
  cleanup();
@@ -93153,19 +92500,13 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93153
92500
  }
93154
92501
  this.state.contents.delete(id);
93155
92502
  this.state.contentMountElements.delete(id);
93156
- this.state.autoHeightModes.delete(id);
93157
- this.invalidateContentInteractionZones(id);
93158
- (_this_state_contentInteractionZoneCleanups_get = this.state.contentInteractionZoneCleanups.get(id)) == null ? void 0 : _this_state_contentInteractionZoneCleanups_get();
93159
- this.state.contentInteractionZoneCleanups.delete(id);
93160
92503
  this.cleanupAutoHeight(id);
93161
92504
  };
93162
92505
  _proto.removeOverlay = function removeOverlay(id) {
93163
- var _this_state_elements_get, _this_state_selectionElements_get;
92506
+ var _this_state_elements_get;
93164
92507
  this.cleanupOverlayContent(id);
93165
92508
  (_this_state_elements_get = this.state.elements.get(id)) == null ? void 0 : _this_state_elements_get.remove();
93166
- (_this_state_selectionElements_get = this.state.selectionElements.get(id)) == null ? void 0 : _this_state_selectionElements_get.remove();
93167
92509
  this.state.elements.delete(id);
93168
- this.state.selectionElements.delete(id);
93169
92510
  this.state.contentScaleElements.delete(id);
93170
92511
  this.state.contentElements.delete(id);
93171
92512
  };
@@ -93174,27 +92515,11 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93174
92515
  this.cleanupAutoHeight(id);
93175
92516
  return;
93176
92517
  }
93177
- this.ensureAutoHeightMode(id);
93178
- if (this.state.autoHeightModes.get(id) === 'message') {
93179
- this.cleanupAutoHeight(id);
93180
- return;
93181
- }
93182
92518
  if (!this.state.autoHeightCleanups.has(id)) {
93183
92519
  this.state.autoHeightCleanups.set(id, this.createAutoHeightObserver(id));
93184
92520
  }
93185
92521
  this.scheduleAutoHeightMeasure(id);
93186
92522
  };
93187
- _proto.ensureAutoHeightMode = function ensureAutoHeightMode(id) {
93188
- var _this_state_contents_get;
93189
- if (this.state.autoHeightModes.has(id)) {
93190
- return;
93191
- }
93192
- var content = (_this_state_contents_get = this.state.contents.get(id)) == null ? void 0 : _this_state_contents_get.content;
93193
- if (!content) {
93194
- return;
93195
- }
93196
- this.state.autoHeightModes.set(id, content.kind === 'inline' || content.kind === 'document' ? 'message' : 'measure');
93197
- };
93198
92523
  _proto.createAutoHeightObserver = function createAutoHeightObserver(id) {
93199
92524
  var _this = this;
93200
92525
  var cleanupFns = [];
@@ -93282,7 +92607,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93282
92607
  var item = this.options.getItems().find(function(candidate) {
93283
92608
  return candidate.id === id;
93284
92609
  });
93285
- if (!this.isAutoHeightEnabled(item)) {
92610
+ if (!isCardItem(item) || item.property.autoHeight !== true) {
93286
92611
  this.cleanupAutoHeight(id);
93287
92612
  return;
93288
92613
  }
@@ -93301,9 +92626,7 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93301
92626
  }).filter(function(height) {
93302
92627
  return typeof height === 'number' && Number.isFinite(height) && height > 0;
93303
92628
  });
93304
- var childHeight = this.getChildrenNaturalHeight(element, {
93305
- includeIframes: iframeHeights.length === 0
93306
- });
92629
+ var childHeight = this.getChildrenNaturalHeight(element);
93307
92630
  var naturalHeight = (_Math = Math).max.apply(_Math, [].concat([
93308
92631
  childHeight
93309
92632
  ], iframeHeights));
@@ -93323,29 +92646,10 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93323
92646
  }
93324
92647
  return Math.max(documentElement.scrollHeight, (_ref = body == null ? void 0 : body.scrollHeight) != null ? _ref : 0);
93325
92648
  };
93326
- _proto.getChildrenNaturalHeight = function getChildrenNaturalHeight(element, options) {
93327
- var _ref;
93328
- var includeIframes = (_ref = options == null ? void 0 : options.includeIframes) != null ? _ref : true;
93329
- return Array.from(element.childNodes).reduce(function(height, child) {
93330
- var _child_textContent;
93331
- if (child.nodeType === Node.ELEMENT_NODE) {
93332
- var childElement = child;
93333
- if (!includeIframes && childElement.tagName === 'IFRAME') {
93334
- return height;
93335
- }
93336
- return Math.max(height, childElement.offsetTop + childElement.offsetHeight);
93337
- }
93338
- if (child.nodeType === Node.TEXT_NODE && ((_child_textContent = child.textContent) == null ? void 0 : _child_textContent.trim())) {
93339
- var range = element.ownerDocument.createRange();
93340
- range.selectNodeContents(child);
93341
- var rects = Array.from(range.getClientRects());
93342
- // eslint-disable-next-line @typescript-eslint/no-deprecated
93343
- range.detach();
93344
- return rects.reduce(function(textHeight, rect) {
93345
- return Math.max(textHeight, rect.bottom - element.getBoundingClientRect().top);
93346
- }, height);
93347
- }
93348
- return height;
92649
+ _proto.getChildrenNaturalHeight = function getChildrenNaturalHeight(element) {
92650
+ return Array.from(element.children).reduce(function(height, child) {
92651
+ var childElement = child;
92652
+ return Math.max(height, childElement.offsetTop + childElement.offsetHeight);
93349
92653
  }, 0);
93350
92654
  };
93351
92655
  _proto.cleanupAutoHeight = function cleanupAutoHeight(id) {
@@ -93364,48 +92668,14 @@ var HTMLOverlayManager = /*#__PURE__*/ function() {
93364
92668
  var item = this.options.getItems().find(function(candidate) {
93365
92669
  return candidate.id === id;
93366
92670
  });
93367
- if (!isCardItem(item) || !this.isAutoHeightEnabled(item)) {
92671
+ if (!isCardItem(item) || item.property.autoHeight !== true) {
93368
92672
  return;
93369
92673
  }
93370
- if (!Number.isFinite(height) || height <= 0) {
92674
+ if (!Number.isFinite(height) || height <= 0 || Math.abs(height - item.property.height) <= AUTO_HEIGHT_EPSILON) {
93371
92675
  return;
93372
92676
  }
93373
- var nextHeight = Math.ceil(this.getAutoHeightItemHeight(item, height));
93374
- if (Math.abs(nextHeight - item.property.height) <= AUTO_HEIGHT_EPSILON) {
93375
- return;
93376
- }
93377
- this.options.setCardItemHeight(id, nextHeight);
93378
- };
93379
- _proto.getAutoHeightItemHeight = function getAutoHeightItemHeight(item, contentHeight) {
93380
- if (!isCardItem(item) || this.isAutoScaleEnabled(item)) {
93381
- return contentHeight;
93382
- }
93383
- var scaleOverlay = this.state.contentScaleElements.get(item.id);
93384
- var displayedHeight = scaleOverlay ? Number.parseFloat(scaleOverlay.style.height) : 0;
93385
- if (!Number.isFinite(displayedHeight) || displayedHeight <= 0 || item.property.height <= 0) {
93386
- return contentHeight;
93387
- }
93388
- return contentHeight / displayedHeight * item.property.height;
93389
- };
93390
- _proto.isAutoHeightEnabled = function isAutoHeightEnabled(item) {
93391
- var _this_options_resolveCardTypeConfig;
93392
- return isCardItem(item) && ((_this_options_resolveCardTypeConfig = this.options.resolveCardTypeConfig(item)) == null ? void 0 : _this_options_resolveCardTypeConfig.autoHeight) === true;
92677
+ this.options.setCardItemHeight(id, Math.ceil(height));
93393
92678
  };
93394
- _proto.isAutoScaleEnabled = function isAutoScaleEnabled(item) {
93395
- var _this_options_resolveCardTypeConfig;
93396
- if (!isCardItem(item)) {
93397
- return true;
93398
- }
93399
- return ((_this_options_resolveCardTypeConfig = this.options.resolveCardTypeConfig(item)) == null ? void 0 : _this_options_resolveCardTypeConfig.autoScale) !== false;
93400
- };
93401
- _create_class(HTMLOverlayManager, [
93402
- {
93403
- key: "layerElement",
93404
- get: function get() {
93405
- return this.state.layer;
93406
- }
93407
- }
93408
- ]);
93409
92679
  return HTMLOverlayManager;
93410
92680
  }();
93411
92681
  function waitForCardCaptureReady(root) {
@@ -93447,17 +92717,6 @@ function waitForCardCaptureReady(root) {
93447
92717
  });
93448
92718
  })();
93449
92719
  }
93450
- function formatCssColor(color, alpha) {
93451
- var normalizedColor = Math.max(0, Math.min(0xFFFFFF, Math.round(color)));
93452
- var red = normalizedColor >> 16 & 0xFF;
93453
- var green = normalizedColor >> 8 & 0xFF;
93454
- var blue = normalizedColor & 0xFF;
93455
- return "rgba(" + red + ", " + green + ", " + blue + ", " + formatCssNumber(alpha) + ")";
93456
- }
93457
- function formatCssNumber(value) {
93458
- var normalized = Number.isFinite(value) ? value : 0;
93459
- return Number(normalized.toFixed(6)).toString();
93460
- }
93461
92720
  function nextAnimationFrame() {
93462
92721
  return new Promise(function(resolve) {
93463
92722
  requestAnimationFrame(function() {
@@ -93876,9 +93135,6 @@ function createFlattenedContent(target, frameStyle, ownerDocument) {
93876
93135
  });
93877
93136
  return replacement;
93878
93137
  }
93879
- function isMouseEventInsideRect(event, rect) {
93880
- return event.clientX >= rect.left && event.clientX <= rect.right && event.clientY >= rect.top && event.clientY <= rect.bottom;
93881
- }
93882
93138
  function createFlattenedIframeContent(iframe) {
93883
93139
  var doc = iframe.contentDocument;
93884
93140
  if (!doc) {
@@ -93918,19 +93174,6 @@ function withTimeout(promise, timeout) {
93918
93174
  });
93919
93175
  }
93920
93176
 
93921
- function orderSDKCanvasLayers(param) {
93922
- var container = param.container, playerContainer = param.playerContainer, htmlOverlayLayer = param.htmlOverlayLayer, gestureCanvas = param.gestureCanvas;
93923
- [
93924
- playerContainer,
93925
- htmlOverlayLayer,
93926
- gestureCanvas
93927
- ].forEach(function(layer) {
93928
- if ((layer == null ? void 0 : layer.parentElement) === container) {
93929
- container.appendChild(layer);
93930
- }
93931
- });
93932
- }
93933
-
93934
93177
  var HTML_CARD_EDITING_VIEWPORT_PADDING = 48;
93935
93178
  var SDK = /*#__PURE__*/ function() {
93936
93179
  function SDK(container, mode) {
@@ -94036,45 +93279,9 @@ var SDK = /*#__PURE__*/ function() {
94036
93279
  propertyName: 'height',
94037
93280
  propertyValue: height
94038
93281
  });
94039
- },
94040
- getSelectedItemIds: function getSelectedItemIds() {
94041
- var _ref;
94042
- var _this__pageData;
94043
- return (_ref = (_this__pageData = _this._pageData) == null ? void 0 : _this__pageData.activeData.selectedItems) != null ? _ref : [];
94044
- },
94045
- getPreSelectedItemId: function getPreSelectedItemId() {
94046
- var _this__pageData;
94047
- return (_this__pageData = _this._pageData) == null ? void 0 : _this__pageData.activeData.preSelectedItem;
94048
- },
94049
- getSelectionEdgeStyle: function getSelectionEdgeStyle() {
94050
- 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;
94051
- return {
94052
- color: wireframeColor,
94053
- alpha: wireframeAlpha,
94054
- width: wireframeWidth
94055
- };
94056
- },
94057
- getPreSelectionEdgeStyle: function getPreSelectionEdgeStyle() {
94058
- var _SDK_config_gestureHandlerConfig_selectorGizmoConfig = SDK.config.gestureHandlerConfig.selectorGizmoConfig, preSelectedColor = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.preSelectedColor, preSelectedWidth = _SDK_config_gestureHandlerConfig_selectorGizmoConfig.preSelectedWidth;
94059
- return {
94060
- color: preSelectedColor,
94061
- alpha: 1,
94062
- width: preSelectedWidth
94063
- };
94064
- },
94065
- getCanvasEventTarget: function getCanvasEventTarget() {
94066
- var _this__gestureHandler;
94067
- return (_this__gestureHandler = _this._gestureHandler) == null ? void 0 : _this__gestureHandler.wireframeApplication.view;
94068
- },
94069
- resolveCardHTML: function resolveCardHTML(item) {
94070
- return isCardItem(item) ? _this.resolveCardHTML(item) : undefined;
94071
- },
94072
- resolveCardTypeConfig: function resolveCardTypeConfig(item) {
94073
- return isCardItem(item) ? _this.resolveCardTypeConfig(item) : undefined;
94074
93282
  }
94075
93283
  });
94076
93284
  this._htmlOverlayManager.attach();
94077
- this.syncCanvasLayerOrder();
94078
93285
  }
94079
93286
  var _proto = SDK.prototype;
94080
93287
  _proto.dispose = function dispose() {
@@ -94170,7 +93377,6 @@ var SDK = /*#__PURE__*/ function() {
94170
93377
  this.initPlayer(SDK.config.mode);
94171
93378
  this._pageDataUtils = new PageDataUtils(this.player, this._playerContainer, this._eventEmitter, this);
94172
93379
  this._gestureHandler = new GestureHandler(this._container);
94173
- this.syncCanvasLayerOrder();
94174
93380
  return [
94175
93381
  4,
94176
93382
  this.runByPageData(this.pageData)
@@ -94220,16 +93426,6 @@ var SDK = /*#__PURE__*/ function() {
94220
93426
  env: 'editor'
94221
93427
  });
94222
93428
  this.player.resize();
94223
- this.syncCanvasLayerOrder();
94224
- };
94225
- _proto.syncCanvasLayerOrder = function syncCanvasLayerOrder() {
94226
- var _this__htmlOverlayManager, _this__gestureHandler;
94227
- orderSDKCanvasLayers({
94228
- container: this._container,
94229
- playerContainer: this._playerContainer,
94230
- htmlOverlayLayer: (_this__htmlOverlayManager = this._htmlOverlayManager) == null ? void 0 : _this__htmlOverlayManager.layerElement,
94231
- gestureCanvas: (_this__gestureHandler = this._gestureHandler) == null ? void 0 : _this__gestureHandler.wireframeApplication.view
94232
- });
94233
93429
  };
94234
93430
  _proto.getInitParam = function getInitParam(param) {
94235
93431
  return _async_to_generator(function() {
@@ -95324,7 +94520,8 @@ var SDK = /*#__PURE__*/ function() {
95324
94520
  * @param ignoreClamp 是否忽视约束
95325
94521
  */ _proto.setPageZoom = function setPageZoom(zoom, center, ignoreClamp) {
95326
94522
  assertExist$1(this._pageData);
95327
- this._pageDataUtils.setPageZoom(zoom, center, ignoreClamp);
94523
+ this._pageData.property.zoom = zoom;
94524
+ this._pageDataUtils.setPageZoom(this._pageData.property.zoom, center, ignoreClamp);
95328
94525
  this._gestureHandler.render();
95329
94526
  };
95330
94527
  /**
@@ -96220,44 +95417,6 @@ var SDK = /*#__PURE__*/ function() {
96220
95417
  });
96221
95418
  };
96222
95419
  /**
96223
- * @description 按 cardType 从注册表解析卡片的 HTML 渲染配置。
96224
- * @param item 卡片元素
96225
- * @returns HTML 渲染配置
96226
- */ _proto.resolveCardHTML = function resolveCardHTML(item) {
96227
- var _cardTypeConfig_html;
96228
- var cardTypeConfig = this.resolveCardTypeConfig(item);
96229
- return cardTypeConfig == null ? void 0 : (_cardTypeConfig_html = cardTypeConfig.html) == null ? void 0 : _cardTypeConfig_html.call(cardTypeConfig, item);
96230
- };
96231
- /**
96232
- * @description 按 cardType 从注册表解析卡片类型配置。
96233
- * @param item 卡片元素
96234
- * @returns 卡片类型配置
96235
- */ _proto.resolveCardTypeConfig = function resolveCardTypeConfig(item) {
96236
- return SDK.config.itemConfig.cardConfig.cardTypes.find(function(t) {
96237
- return t.type === item.cardType;
96238
- });
96239
- };
96240
- /**
96241
- * @description 重新解析并挂载指定卡片的 HTML 内容。
96242
- * @description 当 inline/document 内容依赖 extension 或外部状态变化时,可调用此方法刷新 DOM。
96243
- * @param id 卡片元素 ID
96244
- * @returns 是否成功触发刷新
96245
- */ _proto.refreshCardHTML = function refreshCardHTML(id) {
96246
- var _this__htmlOverlayManager, _this__htmlOverlayManager1;
96247
- var item = this.getSDKItem(id);
96248
- if (!isCardItem(item)) {
96249
- console.warn('CardItem "' + id + '" not found.');
96250
- return false;
96251
- }
96252
- if (!this.resolveCardHTML(item)) {
96253
- console.warn('CardItem "' + id + '" has no registered HTML renderer.');
96254
- return false;
96255
- }
96256
- (_this__htmlOverlayManager = this._htmlOverlayManager) == null ? void 0 : _this__htmlOverlayManager.invalidateCardHTML(id);
96257
- (_this__htmlOverlayManager1 = this._htmlOverlayManager) == null ? void 0 : _this__htmlOverlayManager1.scheduleRender();
96258
- return true;
96259
- };
96260
- /**
96261
95420
  * @description 创建卡片元素
96262
95421
  * @description 底层以透明 SpriteItem 形式渲染,支持 cardType 属性
96263
95422
  * @param createInfo 卡片创建信息
@@ -96544,5 +95703,166 @@ var SDK = /*#__PURE__*/ function() {
96544
95703
  }();
96545
95704
  SDK.config = BaseConfig;
96546
95705
 
95706
+ /**
95707
+ * @description 卡片元素 SDKItem 类
95708
+ * @description 在 Player 中以 SpriteItem 形式渲染(透明占位,无图)
95709
+ * @description 支持设置卡片类型(cardType)
95710
+ */ var CardItem = /*#__PURE__*/ function(BaseItem) {
95711
+ _inherits(CardItem, BaseItem);
95712
+ function CardItem(options) {
95713
+ var _this;
95714
+ var _ref, _ref1, _ref2, _ref3, _ref4, _ref5, _ref6;
95715
+ var _options_property, _options_property1, _options_property2, _options_property3, _options_property4, _options_property5, _SDK_config_itemConfig_cardConfig_cardTypes_, _options_property6, _options_property7;
95716
+ _this = BaseItem.call(this, options) || this, /**
95717
+ * @description 元素类型
95718
+ */ _this.type = SDKItemType.CARD;
95719
+ // 初始化属性(包含 cardType)
95720
+ _this.property = {
95721
+ position: (_ref = (_options_property = options.property) == null ? void 0 : _options_property.position) != null ? _ref : [
95722
+ 0,
95723
+ 0
95724
+ ],
95725
+ rotation: (_ref1 = (_options_property1 = options.property) == null ? void 0 : _options_property1.rotation) != null ? _ref1 : [
95726
+ 0,
95727
+ 0,
95728
+ 0
95729
+ ],
95730
+ width: (_ref2 = (_options_property2 = options.property) == null ? void 0 : _options_property2.width) != null ? _ref2 : 0,
95731
+ height: (_ref3 = (_options_property3 = options.property) == null ? void 0 : _options_property3.height) != null ? _ref3 : 0,
95732
+ scale: (_ref4 = (_options_property4 = options.property) == null ? void 0 : _options_property4.scale) != null ? _ref4 : [
95733
+ 1,
95734
+ 1
95735
+ ],
95736
+ 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 : '',
95737
+ autoHeight: (_options_property6 = options.property) == null ? void 0 : _options_property6.autoHeight,
95738
+ html: (_options_property7 = options.property) == null ? void 0 : _options_property7.html
95739
+ };
95740
+ return _this;
95741
+ }
95742
+ var _proto = CardItem.prototype;
95743
+ // ==================== 实现抽象方法 ====================
95744
+ /**
95745
+ * @description 转换为 CardCreateInfo
95746
+ * @param withParent 是否包含父节点ID
95747
+ */ _proto.toCreateInfo = function toCreateInfo(withParent) {
95748
+ var extension = this.getAllExtension();
95749
+ var property = deepClone(this.property);
95750
+ property.html = this.html;
95751
+ return {
95752
+ type: SDKItemType.CARD,
95753
+ id: this.id,
95754
+ name: this.name,
95755
+ parentId: withParent ? this.parentId : undefined,
95756
+ extension: Object.keys(extension).length > 0 ? extension : undefined,
95757
+ property: property
95758
+ };
95759
+ };
95760
+ /**
95761
+ * @description 克隆 SDKItem
95762
+ */ _proto.clone = function clone() {
95763
+ var property = deepClone(this.property);
95764
+ property.html = this.html;
95765
+ return new CardItem({
95766
+ id: generateGUID(),
95767
+ name: this.name,
95768
+ parentId: this.parentId,
95769
+ duration: this.duration,
95770
+ delay: this.delay,
95771
+ endBehavior: this.endBehavior,
95772
+ isLocked: this.isLocked,
95773
+ isCoreEditable: this.isCoreEditable,
95774
+ property: property,
95775
+ extension: this.getAllExtension()
95776
+ });
95777
+ };
95778
+ _create_class(CardItem, [
95779
+ {
95780
+ key: "cardType",
95781
+ get: // ==================== cardType 访问器 ====================
95782
+ /**
95783
+ * @description 卡片类型
95784
+ */ function get() {
95785
+ return this.property.cardType;
95786
+ },
95787
+ set: function set(value) {
95788
+ this.property.cardType = value;
95789
+ }
95790
+ },
95791
+ {
95792
+ key: "html",
95793
+ get: /**
95794
+ * @description HTML 覆盖层配置
95795
+ */ function get() {
95796
+ return this.property.html;
95797
+ },
95798
+ set: function set(value) {
95799
+ this.property.html = value;
95800
+ }
95801
+ },
95802
+ {
95803
+ key: "position",
95804
+ get: // ==================== 便捷访问器 ====================
95805
+ /**
95806
+ * @description 位置
95807
+ */ function get() {
95808
+ return this.property.position;
95809
+ },
95810
+ set: function set(value) {
95811
+ this.property.position = value;
95812
+ }
95813
+ },
95814
+ {
95815
+ key: "width",
95816
+ get: /**
95817
+ * @description 宽度
95818
+ */ function get() {
95819
+ return this.property.width;
95820
+ },
95821
+ set: function set(value) {
95822
+ this.property.width = value;
95823
+ }
95824
+ },
95825
+ {
95826
+ key: "height",
95827
+ get: /**
95828
+ * @description 高度
95829
+ */ function get() {
95830
+ return this.property.height;
95831
+ },
95832
+ set: function set(value) {
95833
+ this.property.height = value;
95834
+ }
95835
+ },
95836
+ {
95837
+ key: "rotation",
95838
+ get: /**
95839
+ * @description 旋转(二维旋转角度)
95840
+ */ function get() {
95841
+ return this.property.rotation[2];
95842
+ },
95843
+ set: function set(value) {
95844
+ this.property.rotation[2] = value;
95845
+ }
95846
+ },
95847
+ {
95848
+ key: "fullRotation",
95849
+ get: /**
95850
+ * @description 完整旋转(包含 x, y, z)
95851
+ */ function get() {
95852
+ return this.property.rotation;
95853
+ },
95854
+ set: function set(value) {
95855
+ this.property.rotation = value;
95856
+ }
95857
+ }
95858
+ ]);
95859
+ return CardItem;
95860
+ }(BaseItem);
95861
+ /**
95862
+ * @description 类型守卫:检查是否是 CardItem
95863
+ */ function isCardItem(obj) {
95864
+ return _instanceof(obj, CardItem);
95865
+ }
95866
+
96547
95867
  export { BackgroundManager, BaseItem, Box2, CardItem, DefaultVFXItems, EffectsItem, FrameItem, GeneratorItem, GroupItem, InteractionUtils, ItemOrderAction, PageDataUtils, SDK, SDKItemType, SafeConstraint, SpriteItem, TextItem, VFXItemFactory, Vector2, VideoItem, addCompositionItemByComposition, addItemInfoToScene, adjustOtherElementsLayoutInfo, arrAdd, assertExist, asserts, autoLayout, calculateAutoLayoutIndicatorLine, calculateAutoLayoutPositionByMouse, calculateDisplacement, calculateInsertPositionFromLayout, calculateLayoutDisplacements, clearItemParentInfo, createCompositionItemJSON, createFrameCompositionScene, createNullItemJSON, createSpriteItemJSON, createTextItemJSON, createVideoGeneratorItemJSON, createVideoItemJSON, deepClone, deepEquals, deleteCompositionFromScene, deleteCompositionItemFromScene, deleteItemInfoFromScene, downloadBlob, extractSubCompositionToScene, fixStandardJSON, getBasicScene, getColorByNormalizeColor, getCompositionDataByRefCompositionItemId, getCompositionIdByRefCompositionItemId, getNormalizeColorByColor, getTextureUrlById, getTransformRatioByViewAndCamera, getUniqueName, globalAutoLayout, isBaseItem, isCardItem, isEffectsItem, isEqual, isFrameItem, isGeneratorItem, isGroupItem, isObj, isSpriteItem, isTextItem, isVideoItem, loadScriptAsync, logger, moveItemBetweenCompositions, removeItemInfoFromScene, resetSubCompositionItemId, setItemJSONParentId, setJSONItemName, updateItemLayoutInfo };
96548
95868
  //# sourceMappingURL=index.js.map