@versa_ai/vmml-editor 1.0.4 → 1.0.5

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.
@@ -1,10 +1,10 @@
1
1
 
2
- > @versa_ai/vmml-editor@1.0.4 build D:\code\work\vmml-player\packages\editor
2
+ > @versa_ai/vmml-editor@1.0.5 build D:\code\work\vmml-player\packages\editor
3
3
  > tsup
4
4
 
5
- CLI Building entry: ./src/index.tsx
5
+ CLI Building entry: src/index.tsx
6
6
  CLI Using tsconfig: tsconfig.json
7
- CLI tsup v8.2.4
7
+ CLI tsup v8.3.5
8
8
  CLI Using tsup config: D:\code\work\vmml-player\packages\editor\tsup.config.ts
9
9
  CLI Target: node16
10
10
  CJS Build start
@@ -89,66 +89,6 @@ More info and automated migrator: https://sass-lang.com/d/slash-div [35
89
89
 
90
90
 
91
91
 
92
-  WARN  ▲ [WARNING] Sass's behavior for declarations that appear after nested
93
- rules will be changing to match the behavior specified by CSS in an upcoming
94
- version. To keep the existing behavior, move the declaration above the nested
95
- rule. To opt into the new behavior, wrap the declaration in & {}.
96
-
97
- More info: https://sass-lang.com/d/mixed-decls [plugin sass-plugin]
98
-
99
- src/assets/css/editorTextMenu.scss:104:4:
100
-  104 │ -ms-overflow-style: none
101
- ╵ ^
102
-
103
- The plugin "sass-plugin" was triggered by this import
104
-
105
- src/components/TextMenu.tsx:2:7:
106
-  2 │ import "../assets/css/editorTextMenu.scss";
107
- ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
108
-
109
-
110
-
111
-
112
-  WARN  ▲ [WARNING] Sass's behavior for declarations that appear after nested
113
- rules will be changing to match the behavior specified by CSS in an upcoming
114
- version. To keep the existing behavior, move the declaration above the nested
115
- rule. To opt into the new behavior, wrap the declaration in & {}.
116
-
117
- More info: https://sass-lang.com/d/mixed-decls [plugin sass-plugin]
118
-
119
- src/assets/css/editorTextMenu.scss:105:4:
120
-  105 │ scrollbar-width: none
121
- ╵ ^
122
-
123
- The plugin "sass-plugin" was triggered by this import
124
-
125
- src/components/TextMenu.tsx:2:7:
126
-  2 │ import "../assets/css/editorTextMenu.scss";
127
- ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
128
-
129
-
130
-
131
-
132
-  WARN  ▲ [WARNING] Sass's behavior for declarations that appear after nested
133
- rules will be changing to match the behavior specified by CSS in an upcoming
134
- version. To keep the existing behavior, move the declaration above the nested
135
- rule. To opt into the new behavior, wrap the declaration in & {}.
136
-
137
- More info: https://sass-lang.com/d/mixed-decls [plugin sass-plugin]
138
-
139
- src/assets/css/editorTextMenu.scss:106:4:
140
-  106 │ transition: all 0.1s
141
- ╵ ^
142
-
143
- The plugin "sass-plugin" was triggered by this import
144
-
145
- src/components/TextMenu.tsx:2:7:
146
-  2 │ import "../assets/css/editorTextMenu.scss";
147
- ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
148
-
149
-
150
-
151
-
152
92
   WARN  ▲ [WARNING] Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.
153
93
 
154
94
  Recommendation: math.div($px, 750) or calc($px / 750)
@@ -246,66 +186,6 @@ More info and automated migrator: https://sass-lang.com/d/slash-div [35
246
186
 
247
187
 
248
188
 
249
-  WARN  ▲ [WARNING] Sass's behavior for declarations that appear after nested
250
- rules will be changing to match the behavior specified by CSS in an upcoming
251
- version. To keep the existing behavior, move the declaration above the nested
252
- rule. To opt into the new behavior, wrap the declaration in & {}.
253
-
254
- More info: https://sass-lang.com/d/mixed-decls [plugin sass-plugin]
255
-
256
- src/assets/css/editorTextMenu.scss:104:4:
257
-  104 │ -ms-overflow-style: none
258
- ╵ ^
259
-
260
- The plugin "sass-plugin" was triggered by this import
261
-
262
- src/components/TextMenu.tsx:2:7:
263
-  2 │ import "../assets/css/editorTextMenu.scss";
264
- ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
265
-
266
-
267
-
268
-
269
-  WARN  ▲ [WARNING] Sass's behavior for declarations that appear after nested
270
- rules will be changing to match the behavior specified by CSS in an upcoming
271
- version. To keep the existing behavior, move the declaration above the nested
272
- rule. To opt into the new behavior, wrap the declaration in & {}.
273
-
274
- More info: https://sass-lang.com/d/mixed-decls [plugin sass-plugin]
275
-
276
- src/assets/css/editorTextMenu.scss:105:4:
277
-  105 │ scrollbar-width: none
278
- ╵ ^
279
-
280
- The plugin "sass-plugin" was triggered by this import
281
-
282
- src/components/TextMenu.tsx:2:7:
283
-  2 │ import "../assets/css/editorTextMenu.scss";
284
- ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
285
-
286
-
287
-
288
-
289
-  WARN  ▲ [WARNING] Sass's behavior for declarations that appear after nested
290
- rules will be changing to match the behavior specified by CSS in an upcoming
291
- version. To keep the existing behavior, move the declaration above the nested
292
- rule. To opt into the new behavior, wrap the declaration in & {}.
293
-
294
- More info: https://sass-lang.com/d/mixed-decls [plugin sass-plugin]
295
-
296
- src/assets/css/editorTextMenu.scss:106:4:
297
-  106 │ transition: all 0.1s
298
- ╵ ^
299
-
300
- The plugin "sass-plugin" was triggered by this import
301
-
302
- src/components/TextMenu.tsx:2:7:
303
-  2 │ import "../assets/css/editorTextMenu.scss";
304
- ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
305
-
306
-
307
-
308
-
309
189
   WARN  ▲ [WARNING] Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.
310
190
 
311
191
  Recommendation: math.div($px, 750) or calc($px / 750)
@@ -324,12 +204,12 @@ More info and automated migrator: https://sass-lang.com/d/slash-div [35
324
204
 
325
205
 
326
206
 
327
- CJS dist\index.js 103.88 KB
328
- CJS dist\index.js.map 204.06 KB
329
- CJS âšĦ️ Build success in 819ms
330
- ESM dist\index.mjs 102.35 KB
331
- ESM dist\index.mjs.map 203.78 KB
332
- ESM âšĦ️ Build success in 818ms
333
- DTS âšĦ️ Build success in 1809ms
207
+ ESM dist\index.mjs 102.41 KB
208
+ ESM dist\index.mjs.map 197.55 KB
209
+ ESM âšĦ️ Build success in 793ms
210
+ CJS dist\index.js 103.94 KB
211
+ CJS dist\index.js.map 197.83 KB
212
+ CJS âšĦ️ Build success in 793ms
213
+ DTS âšĦ️ Build success in 1760ms
334
214
  DTS dist\index.d.ts 158.00 B
335
215
  DTS dist\index.d.mts 158.00 B
package/dist/index.js CHANGED
@@ -297,7 +297,7 @@ var SeekBar = ({ player, vmmlRef, frame, durationInFrames, intoEdit, setDragStat
297
297
  if (e.button !== 0) {
298
298
  return;
299
299
  }
300
- const { left, width } = (_a = containerRef.current) == null ? void 0 : _a.getBoundingClientRect();
300
+ const { left, width } = (_a = containerRef.current) == null ? undefined : _a.getBoundingClientRect();
301
301
  const _frame = getFrameFromX(
302
302
  e.clientX - left,
303
303
  durationInFrames,
@@ -317,7 +317,7 @@ var SeekBar = ({ player, vmmlRef, frame, durationInFrames, intoEdit, setDragStat
317
317
  if (!dragging.dragging) {
318
318
  return;
319
319
  }
320
- const { left, width } = (_a = containerRef.current) == null ? void 0 : _a.getBoundingClientRect();
320
+ const { left, width } = (_a = containerRef.current) == null ? undefined : _a.getBoundingClientRect();
321
321
  const _frame = getFrameFromX(
322
322
  e.clientX - left,
323
323
  durationInFrames,
@@ -655,7 +655,7 @@ var VmmlConverter = class {
655
655
  existClip = originClip;
656
656
  } else {
657
657
  const editorTrack = this.tracks.find((track) => track.editorType === type);
658
- existClip = ((editorTrack == null ? void 0 : editorTrack.clips) || []).find((clip) => clip.id === id);
658
+ existClip = ((editorTrack == null ? undefined : editorTrack.clips) || []).find((clip) => clip.id === id);
659
659
  }
660
660
  if (existClip) {
661
661
  !originClip && (existClip.fObj = fObj);
@@ -794,11 +794,11 @@ var VmmlConverter = class {
794
794
  };
795
795
  var VmmlConverter_default = VmmlConverter;
796
796
  function drawImg(ctx, left, top, img, wSize, hSize, angle) {
797
- if (angle === void 0) return;
797
+ if (angle === undefined) return;
798
798
  ctx.save();
799
799
  ctx.translate(left, top);
800
800
  ctx.rotate(fabric.fabric.util.degreesToRadians(angle));
801
- ctx.drawImage(img, -wSize / 2, -hSize / 2, wSize, hSize);
801
+ ctx.drawImage(img, -28 / 2, -28 / 2, wSize, hSize);
802
802
  ctx.restore();
803
803
  }
804
804
  function usePeekControl(canvas) {
@@ -839,7 +839,7 @@ function usePeekControl(canvas) {
839
839
  const renderMuteIcon = (ctx, left, top, styleOverride, fabricObject) => {
840
840
  if (!fabricObject.clipData) return false;
841
841
  if (fabricObject.clipData.type === "\u8868\u60C5\u5305") {
842
- if (fabricObject.clipData.isMute === null || fabricObject.clipData.isMute === void 0) return false;
842
+ if (fabricObject.clipData.isMute === null || fabricObject.clipData.isMute === undefined) return false;
843
843
  if (fabricObject.clipData.isMute) {
844
844
  drawImg(ctx, left, top, muteImg, 28, 28, fabricObject.angle);
845
845
  } else {
@@ -982,10 +982,10 @@ var EditorCanvas = react.forwardRef(
982
982
  const objects = fc.getObjects();
983
983
  objects.forEach((item) => {
984
984
  var _a, _b, _c;
985
- if (((_a = item == null ? void 0 : item.clipData) == null ? void 0 : _a.type) === "\u6587\u5B57") {
985
+ if (((_a = item == null ? undefined : item.clipData) == null ? undefined : _a.type) === "\u6587\u5B57") {
986
986
  item.set("visible", ns >= item.clipData.inPoint && ns < item.clipData.inPoint + (item.clipData.duration || vmml.template.duration));
987
987
  } else {
988
- item.set("visible", ns >= item.clipData.inPoint && ns < item.clipData.inPoint + ((_c = (_b = item.clipData) == null ? void 0 : _b.fileUrl) == null ? void 0 : _c.duration));
988
+ item.set("visible", ns >= item.clipData.inPoint && ns < item.clipData.inPoint + ((_c = (_b = item.clipData) == null ? undefined : _b.fileUrl) == null ? undefined : _c.duration));
989
989
  }
990
990
  });
991
991
  fc.discardActiveObject();
@@ -1119,7 +1119,7 @@ var EditorCanvas = react.forwardRef(
1119
1119
  if (canvas) {
1120
1120
  const imgs = canvas.getObjects().filter((item) => {
1121
1121
  var _a;
1122
- return ((_a = item == null ? void 0 : item.clipData) == null ? void 0 : _a.type) === "\u8868\u60C5\u5305";
1122
+ return ((_a = item == null ? undefined : item.clipData) == null ? undefined : _a.type) === "\u8868\u60C5\u5305";
1123
1123
  });
1124
1124
  const target = imgs.find((item) => item.clipData.id === id);
1125
1125
  if (target) {
@@ -1129,7 +1129,7 @@ var EditorCanvas = react.forwardRef(
1129
1129
  });
1130
1130
  }
1131
1131
  } else {
1132
- waitFcTasks.current.push(updateImage.bind(void 0, id, base64));
1132
+ waitFcTasks.current.push(updateImage.bind(undefined, id, base64));
1133
1133
  }
1134
1134
  };
1135
1135
  const createImageFromClip = (clip, fc2) => {
@@ -1176,7 +1176,7 @@ var EditorCanvas = react.forwardRef(
1176
1176
  });
1177
1177
  });
1178
1178
  } else {
1179
- waitFcTasks.current.push(createImageFromClip.bind(void 0, clip));
1179
+ waitFcTasks.current.push(createImageFromClip.bind(undefined, clip));
1180
1180
  }
1181
1181
  };
1182
1182
  const handleRedo = () => {
@@ -1256,7 +1256,7 @@ var EditorCanvas = react.forwardRef(
1256
1256
  canvas.add(imgData).renderAll();
1257
1257
  });
1258
1258
  } else {
1259
- waitFcTasks.current.push(createTextFromClip.bind(void 0, clip));
1259
+ waitFcTasks.current.push(createTextFromClip.bind(undefined, clip));
1260
1260
  }
1261
1261
  };
1262
1262
  const embedFontInSVG = async (svgString, url) => {
@@ -1295,7 +1295,7 @@ var EditorCanvas = react.forwardRef(
1295
1295
  container.style.padding = "6.5px 7px 6.5px 7px";
1296
1296
  container.style.borderRadius = "5px";
1297
1297
  document.body.appendChild(container);
1298
- const { width, height } = container == null ? void 0 : container.getBoundingClientRect();
1298
+ const { width, height } = container == null ? undefined : container.getBoundingClientRect();
1299
1299
  const dataurl = await domToImage.toSvg(container);
1300
1300
  document.body.removeChild(container);
1301
1301
  const base64Image = await embedFontInSVG(dataurl, fontAssetUrl);
@@ -1718,14 +1718,14 @@ var stopMove = () => {
1718
1718
  const currentTouchPositionY = e.touches[0].clientY;
1719
1719
  const deltaX = currentTouchPositionX - lastTouchPositionX;
1720
1720
  const deltaY = currentTouchPositionY - lastTouchPositionY;
1721
- if (["text-header", "overlay", "text_bg_change"].includes((_a = e.target) == null ? void 0 : _a.className)) {
1721
+ if (["text-header", "overlay", "text_bg_change"].includes((_a = e.target) == null ? undefined : _a.className)) {
1722
1722
  e.preventDefault();
1723
1723
  }
1724
1724
  if (element) {
1725
1725
  const willOverflow = element.scrollHeight > element.clientHeight;
1726
1726
  if (willOverflow) {
1727
1727
  return;
1728
- } else if (((_b = e.target) == null ? void 0 : _b.className.split(" ").includes("color-item")) || ((_c = e.target) == null ? void 0 : _c.className) === "text_color_change") {
1728
+ } else if (((_b = e.target) == null ? undefined : _b.className.split(" ").includes("color-item")) || ((_c = e.target) == null ? undefined : _c.className) === "text_color_change") {
1729
1729
  if (deltaX < 0 || deltaX > 0) {
1730
1730
  return;
1731
1731
  } else {
@@ -1904,7 +1904,7 @@ var ColorSelector_default = ColorSelector;
1904
1904
  var formatText = (text, maxLengthBase = 40) => {
1905
1905
  var _a;
1906
1906
  const newlineRegex = /(\r\n|\r|\n)/g;
1907
- const matches = ((_a = text.match(newlineRegex)) == null ? void 0 : _a.length) || 0;
1907
+ const matches = ((_a = text.match(newlineRegex)) == null ? undefined : _a.length) || 0;
1908
1908
  const maxLength = maxLengthBase + matches;
1909
1909
  let trimmedText = text.substring(0, maxLength);
1910
1910
  if (text.length - matches === maxLengthBase) {
@@ -2229,7 +2229,7 @@ var EditorFn = ({
2229
2229
  const [frame, setFrame] = react.useState(pauseFrame);
2230
2230
  const [isPlaying, setIsPlaying] = react.useState(false);
2231
2231
  const [showCanvas, setShowCanvas] = react.useState(false);
2232
- const [durationInFrames, setDurationInFrames] = react.useState(vmmlUtils.getFrames(((_a = vmml == null ? void 0 : vmml.template) == null ? void 0 : _a.duration) || 1, fps));
2232
+ const [durationInFrames, setDurationInFrames] = react.useState(vmmlUtils.getFrames(((_a = vmml == null ? undefined : vmml.template) == null ? undefined : _a.duration) || 1, fps));
2233
2233
  const [previewState, setPreviewState] = react.useState(true);
2234
2234
  const [menuState, setMenuState] = react.useState("");
2235
2235
  const [canvasSize, setCanvasSize] = react.useState({ width: 0, height: 0, top: 0 });
@@ -2517,8 +2517,8 @@ var EditorFn = ({
2517
2517
  if (player) {
2518
2518
  const parent = player.getContainerNode();
2519
2519
  if (!canvasSize.width) {
2520
- const playerElement = parent == null ? void 0 : parent.children[0];
2521
- const { width, height } = (playerElement == null ? void 0 : playerElement.getBoundingClientRect()) || {};
2520
+ const playerElement = parent == null ? undefined : parent.children[0];
2521
+ const { width, height } = (playerElement == null ? undefined : playerElement.getBoundingClientRect()) || {};
2522
2522
  setCanvasSize({ width, height, top: playerElement.offsetTop });
2523
2523
  }
2524
2524
  player.addEventListener("play", onPlay);