@revideo/2d 0.2.1-alpha.891 → 0.2.2

package/lib/components/Video.js

@@ -1,151 +1,148 @@
-var __decorate =
-  (this && this.__decorate) ||
-  function (decorators, target, key, desc) {
-    var c = arguments.length,
-      r =
-        c < 3
-          ? target
-          : desc === null
-            ? (desc = Object.getOwnPropertyDescriptor(target, key))
-            : desc,
-      d;
-    if (typeof Reflect === 'object' && typeof Reflect.decorate === 'function')
-      r = Reflect.decorate(decorators, target, key, desc);
-    else
-      for (var i = decorators.length - 1; i >= 0; i--)
-        if ((d = decorators[i]))
-          r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
-  };
+};
 var Video_1;
-import {BBox, DependencyContext, PlaybackState, viaProxy} from '@revideo/core';
-import {computed, initial, nodeName, signal} from '../decorators';
-import {drawImage} from '../utils';
-import {Media} from './Media';
-let Video = (Video_1 = class Video extends Media {
-  constructor(props) {
-    super(props);
-  }
-  desiredSize() {
-    const custom = super.desiredSize();
-    if (custom.x === null && custom.y === null) {
-      const image = this.video();
-      return {
-        x: image.videoWidth,
-        y: image.videoHeight,
-      };
+import { BBox, DependencyContext, PlaybackState, viaProxy, } from '@revideo/core';
+import { computed, initial, nodeName, signal } from '../decorators';
+import { drawImage } from '../utils';
+import { Media } from './Media';
+let Video = Video_1 = class Video extends Media {
+    constructor(props) {
+        super(props);
     }
-    return custom;
-  }
-  mediaElement() {
-    return this.video();
-  }
-  seekedMedia() {
-    return this.seekedVideo();
-  }
-  fastSeekedMedia() {
-    return this.fastSeekedVideo();
-  }
-  video() {
-    const src = viaProxy(this.src());
-    const key = `${this.key}/${src}`;
-    let video = Video_1.pool[key];
-    if (!video) {
-      video = document.createElement('video');
-      video.crossOrigin = 'anonymous';
-      video.src = src;
-      Video_1.pool[key] = video;
+    desiredSize() {
+        const custom = super.desiredSize();
+        if (custom.x === null && custom.y === null) {
+            const image = this.video();
+            return {
+                x: image.videoWidth,
+                y: image.videoHeight,
+            };
+        }
+        return custom;
     }
-    if (video.readyState < 2) {
-      DependencyContext.collectPromise(
-        new Promise(resolve => {
-          const listener = () => {
-            resolve();
-            video.removeEventListener('canplay', listener);
-          };
-          video.addEventListener('canplay', listener);
-        }),
-      );
+    mediaElement() {
+        return this.video();
     }
-    return video;
-  }
-  seekedVideo() {
-    const video = this.video();
-    const time = this.clampTime(this.time());
-    video.playbackRate = this.playbackRate();
-    if (!video.paused) {
-      video.pause();
+    seekedMedia() {
+        return this.seekedVideo();
     }
-    if (this.lastTime === time) {
-      return video;
+    fastSeekedMedia() {
+        return this.fastSeekedVideo();
     }
-    this.setCurrentTime(time);
-    return video;
-  }
-  fastSeekedVideo() {
-    const video = this.video();
-    const time = this.clampTime(this.time());
-    video.playbackRate = this.playbackRate();
-    if (this.lastTime === time) {
-      return video;
+    video() {
+        const src = viaProxy(this.src());
+        const key = `${this.key}/${src}`;
+        let video = Video_1.pool[key];
+        if (!video) {
+            video = document.createElement('video');
+            video.crossOrigin = 'anonymous';
+            video.src = src;
+            Video_1.pool[key] = video;
+        }
+        if (video.readyState < 2) {
+            DependencyContext.collectPromise(new Promise(resolve => {
+                const listener = () => {
+                    resolve();
+                    video.removeEventListener('canplay', listener);
+                };
+                video.addEventListener('canplay', listener);
+            }));
+        }
+        return video;
     }
-    const playing =
-      this.playing() && time < video.duration && video.playbackRate > 0;
-    if (playing) {
-      if (video.paused) {
-        DependencyContext.collectPromise(video.play());
-      }
-    } else {
-      if (!video.paused) {
-        video.pause();
-      }
+    seekedVideo() {
+        const video = this.video();
+        const time = this.clampTime(this.time());
+        video.playbackRate = this.playbackRate();
+        if (!video.paused) {
+            video.pause();
+        }
+        if (this.lastTime === time) {
+            return video;
+        }
+        this.setCurrentTime(time);
+        return video;
     }
-    if (Math.abs(video.currentTime - time) > 0.3) {
-      this.setCurrentTime(time);
-    } else if (!playing) {
-      video.currentTime = time;
+    fastSeekedVideo() {
+        const video = this.video();
+        const time = this.clampTime(this.time());
+        video.playbackRate = this.playbackRate();
+        if (this.lastTime === time) {
+            return video;
+        }
+        const playing = this.playing() && time < video.duration && video.playbackRate > 0;
+        if (playing) {
+            if (video.paused) {
+                DependencyContext.collectPromise(video.play());
+            }
+        }
+        else {
+            if (!video.paused) {
+                video.pause();
+            }
+        }
+        if (Math.abs(video.currentTime - time) > 0.3) {
+            this.setCurrentTime(time);
+        }
+        else if (!playing) {
+            video.currentTime = time;
+        }
+        return video;
     }
-    return video;
-  }
-  draw(context) {
-    this.drawShape(context);
-    const alpha = this.alpha();
-    if (alpha > 0) {
-      const playbackState = this.view().playbackState();
-      const video =
-        playbackState === PlaybackState.Playing ||
-        playbackState === PlaybackState.Presenting
-          ? this.fastSeekedVideo()
-          : this.seekedVideo();
-      const box = BBox.fromSizeCentered(this.computedSize());
-      context.save();
-      context.clip(this.getPath());
-      if (alpha < 1) {
-        context.globalAlpha *= alpha;
-      }
-      context.imageSmoothingEnabled = this.smoothing();
-      drawImage(context, video, box);
-      context.restore();
+    draw(context) {
+        this.drawShape(context);
+        const alpha = this.alpha();
+        if (alpha > 0) {
+            const playbackState = this.view().playbackState();
+            const video = playbackState === PlaybackState.Playing ||
+                playbackState === PlaybackState.Presenting
+                ? this.fastSeekedVideo()
+                : this.seekedVideo();
+            const box = BBox.fromSizeCentered(this.computedSize());
+            context.save();
+            context.clip(this.getPath());
+            if (alpha < 1) {
+                context.globalAlpha *= alpha;
+            }
+            context.imageSmoothingEnabled = this.smoothing();
+            drawImage(context, video, box);
+            context.restore();
+        }
+        if (this.clip()) {
+            context.clip(this.getPath());
+        }
+        this.drawChildren(context);
     }
-    if (this.clip()) {
-      context.clip(this.getPath());
+    applyFlex() {
+        super.applyFlex();
+        const video = this.video();
+        this.element.style.aspectRatio = (this.ratio() ?? video.videoWidth / video.videoHeight).toString();
     }
-    this.drawChildren(context);
-  }
-  applyFlex() {
-    super.applyFlex();
-    const video = this.video();
-    this.element.style.aspectRatio = (
-      this.ratio() ?? video.videoWidth / video.videoHeight
-    ).toString();
-  }
-});
+};
 Video.pool = {};
-__decorate([initial(1), signal()], Video.prototype, 'alpha', void 0);
-__decorate([initial(true), signal()], Video.prototype, 'smoothing', void 0);
-__decorate([computed()], Video.prototype, 'video', null);
-__decorate([computed()], Video.prototype, 'seekedVideo', null);
-__decorate([computed()], Video.prototype, 'fastSeekedVideo', null);
-Video = Video_1 = __decorate([nodeName('Video')], Video);
-export {Video};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVmlkZW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL2NvbXBvbmVudHMvVmlkZW8udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQUFBLE9BQU8sRUFDTCxJQUFJLEVBQ0osaUJBQWlCLEVBQ2pCLGFBQWEsRUFJYixRQUFRLEdBQ1QsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFDLFFBQVEsRUFBRSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUVsRSxPQUFPLEVBQUMsU0FBUyxFQUFDLE1BQU0sVUFBVSxDQUFDO0FBQ25DLE9BQU8sRUFBQyxLQUFLLEVBQWEsTUFBTSxTQUFTLENBQUM7QUFjbkMsSUFBTSxLQUFLLGFBQVgsTUFBTSxLQUFNLFNBQVEsS0FBSztJQTJCOUIsWUFBbUIsS0FBaUI7UUFDbEMsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ2YsQ0FBQztJQUVrQixXQUFXO1FBQzVCLE1BQU0sTUFBTSxHQUFHLEtBQUssQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUNuQyxJQUFJLE1BQU0sQ0FBQyxDQUFDLEtBQUssSUFBSSxJQUFJLE1BQU0sQ0FBQyxDQUFDLEtBQUssSUFBSSxFQUFFLENBQUM7WUFDM0MsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO1lBQzNCLE9BQU87Z0JBQ0wsQ0FBQyxFQUFFLEtBQUssQ0FBQyxVQUFVO2dCQUNuQixDQUFDLEVBQUUsS0FBSyxDQUFDLFdBQVc7YUFDckIsQ0FBQztRQUNKLENBQUM7UUFFRCxPQUFPLE1BQU0sQ0FBQztJQUNoQixDQUFDO0lBRVMsWUFBWTtRQUNwQixPQUFPLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRVMsV0FBVztRQUNuQixPQUFPLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztJQUM1QixDQUFDO0lBRVMsZUFBZTtRQUN2QixPQUFPLElBQUksQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUNoQyxDQUFDO0lBR08sS0FBSztRQUNYLE1BQU0sR0FBRyxHQUFHLFFBQVEsQ0FBQyxJQUFJLENBQUMsR0FBRyxFQUFFLENBQUMsQ0FBQztRQUNqQyxNQUFNLEdBQUcsR0FBRyxHQUFHLElBQUksQ0FBQyxHQUFHLElBQUksR0FBRyxFQUFFLENBQUM7UUFDakMsSUFBSSxLQUFLLEdBQUcsT0FBSyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztRQUM1QixJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDWCxLQUFLLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyxPQUFPLENBQUMsQ0FBQztZQUN4QyxLQUFLLENBQUMsV0FBVyxHQUFHLFdBQVcsQ0FBQztZQUNoQyxLQUFLLENBQUMsR0FBRyxHQUFHLEdBQUcsQ0FBQztZQUNoQixPQUFLLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxHQUFHLEtBQUssQ0FBQztRQUMxQixDQUFDO1FBRUQsSUFBSSxLQUFLLENBQUMsVUFBVSxHQUFHLENBQUMsRUFBRSxDQUFDO1lBQ3pCLGlCQUFpQixDQUFDLGNBQWMsQ0FDOUIsSUFBSSxPQUFPLENBQU8sT0FBTyxDQUFDLEVBQUU7Z0JBQzFCLE1BQU0sUUFBUSxHQUFHLEdBQUcsRUFBRTtvQkFDcEIsT0FBTyxFQUFFLENBQUM7b0JBQ1YsS0FBSyxDQUFDLG1CQUFtQixDQUFDLFNBQVMsRUFBRSxRQUFRLENBQUMsQ0FBQztnQkFDakQsQ0FBQyxDQUFDO2dCQUNGLEtBQUssQ0FBQyxnQkFBZ0IsQ0FBQyxTQUFTLEVBQUUsUUFBUSxDQUFDLENBQUM7WUFDOUMsQ0FBQyxDQUFDLENBQ0gsQ0FBQztRQUNKLENBQUM7UUFFRCxPQUFPLEtBQUssQ0FBQztJQUNmLENBQUM7SUFHUyxXQUFXO1FBQ25CLE1BQU0sS0FBSyxHQUFHLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztRQUMzQixNQUFNLElBQUksR0FBRyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQyxDQUFDO1FBRXpDLEtBQUssQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1FBRXpDLElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxFQUFFLENBQUM7WUFDbEIsS0FBSyxDQUFDLEtBQUssRUFBRSxDQUFDO1FBQ2hCLENBQUM7UUFFRCxJQUFJLElBQUksQ0FBQyxRQUFRLEtBQUssSUFBSSxFQUFFLENBQUM7WUFDM0IsT0FBTyxLQUFLLENBQUM7UUFDZixDQUFDO1FBRUQsSUFBSSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUUxQixPQUFPLEtBQUssQ0FBQztJQUNmLENBQUM7SUFHUyxlQUFlO1FBQ3ZCLE1BQU0sS0FBSyxHQUFHLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztRQUMzQixNQUFNLElBQUksR0FBRyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQyxDQUFDO1FBRXpDLEtBQUssQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1FBRXpDLElBQUksSUFBSSxDQUFDLFFBQVEsS0FBSyxJQUFJLEVBQUUsQ0FBQztZQUMzQixPQUFPLEtBQUssQ0FBQztRQUNmLENBQUM7UUFFRCxNQUFNLE9BQU8sR0FDWCxJQUFJLENBQUMsT0FBTyxFQUFFLElBQUksSUFBSSxHQUFHLEtBQUssQ0FBQyxRQUFRLElBQUksS0FBSyxDQUFDLFlBQVksR0FBRyxDQUFDLENBQUM7UUFDcEUsSUFBSSxPQUFPLEVBQUUsQ0FBQztZQUNaLElBQUksS0FBSyxDQUFDLE1BQU0sRUFBRSxDQUFDO2dCQUNqQixpQkFBaUIsQ0FBQyxjQUFjLENBQUMsS0FBSyxDQUFDLElBQUksRUFBRSxDQUFDLENBQUM7WUFDakQsQ0FBQztRQUNILENBQUM7YUFBTSxDQUFDO1lBQ04sSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLEVBQUUsQ0FBQztnQkFDbEIsS0FBSyxDQUFDLEtBQUssRUFBRSxDQUFDO1lBQ2hCLENBQUM7UUFDSCxDQUFDO1FBRUQsSUFBSSxJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDLEdBQUcsR0FBRyxFQUFFLENBQUM7WUFDN0MsSUFBSSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUM1QixDQUFDO2FBQU0sSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO1lBQ3BCLEtBQUssQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDO1FBQzNCLENBQUM7UUFFRCxPQUFPLEtBQUssQ0FBQztJQUNmLENBQUM7SUFFa0IsSUFBSSxDQUFDLE9BQWlDO1FBQ3ZELElBQUksQ0FBQyxTQUFTLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDeEIsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO1FBQzNCLElBQUksS0FBSyxHQUFHLENBQUMsRUFBRSxDQUFDO1lBQ2QsTUFBTSxhQUFhLEdBQUcsSUFBSSxDQUFDLElBQUksRUFBRSxDQUFDLGFBQWEsRUFBRSxDQUFDO1lBQ2xELE1BQU0sS0FBSyxHQUNULGFBQWEsS0FBSyxhQUFhLENBQUMsT0FBTztnQkFDdkMsYUFBYSxLQUFLLGFBQWEsQ0FBQyxVQUFVO2dCQUN4QyxDQUFDLENBQUMsSUFBSSxDQUFDLGVBQWUsRUFBRTtnQkFDeEIsQ0FBQyxDQUFDLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztZQUV6QixNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDLENBQUM7WUFDdkQsT0FBTyxDQUFDLElBQUksRUFBRSxDQUFDO1lBQ2YsT0FBTyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUMsQ0FBQztZQUM3QixJQUFJLEtBQUssR0FBRyxDQUFDLEVBQUUsQ0FBQztnQkFDZCxPQUFPLENBQUMsV0FBVyxJQUFJLEtBQUssQ0FBQztZQUMvQixDQUFDO1lBQ0QsT0FBTyxDQUFDLHFCQUFxQixHQUFHLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztZQUNqRCxTQUFTLENBQUMsT0FBTyxFQUFFLEtBQUssRUFBRSxHQUFHLENBQUMsQ0FBQztZQUMvQixPQUFPLENBQUMsT0FBTyxFQUFFLENBQUM7UUFDcEIsQ0FBQztRQUVELElBQUksSUFBSSxDQUFDLElBQUksRUFBRSxFQUFFLENBQUM7WUFDaEIsT0FBTyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUMsQ0FBQztRQUMvQixDQUFDO1FBRUQsSUFBSSxDQUFDLFlBQVksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUM3QixDQUFDO0lBRWtCLFNBQVM7UUFDMUIsS0FBSyxDQUFDLFNBQVMsRUFBRSxDQUFDO1FBQ2xCLE1BQU0sS0FBSyxHQUFHLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztRQUMzQixJQUFJLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxXQUFXLEdBQUcsQ0FDL0IsSUFBSSxDQUFDLEtBQUssRUFBRSxJQUFJLEtBQUssQ0FBQyxVQUFVLEdBQUcsS0FBSyxDQUFDLFdBQVcsQ0FDckQsQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNmLENBQUM7O0FBakp1QixVQUFJLEdBQXFDLEVBQUUsQUFBdkMsQ0FBd0M7QUFmNUM7SUFGdkIsT0FBTyxDQUFDLENBQUMsQ0FBQztJQUNWLE1BQU0sRUFBRTtvQ0FDaUQ7QUFhbEM7SUFGdkIsT0FBTyxDQUFDLElBQUksQ0FBQztJQUNiLE1BQU0sRUFBRTt3Q0FDc0Q7QUFrQ3ZEO0lBRFAsUUFBUSxFQUFFO2tDQXlCVjtBQUdTO0lBRFQsUUFBUSxFQUFFO3dDQWtCVjtBQUdTO0lBRFQsUUFBUSxFQUFFOzRDQThCVjtBQXJJVSxLQUFLO0lBRGpCLFFBQVEsQ0FBQyxPQUFPLENBQUM7R0FDTCxLQUFLLENBMktqQiJ9
+__decorate([
+    initial(1),
+    signal()
+], Video.prototype, "alpha", void 0);
+__decorate([
+    initial(true),
+    signal()
+], Video.prototype, "smoothing", void 0);
+__decorate([
+    computed()
+], Video.prototype, "video", null);
+__decorate([
+    computed()
+], Video.prototype, "seekedVideo", null);
+__decorate([
+    computed()
+], Video.prototype, "fastSeekedVideo", null);
+Video = Video_1 = __decorate([
+    nodeName('Video')
+], Video);
+export { Video };
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVmlkZW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL2NvbXBvbmVudHMvVmlkZW8udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQUFBLE9BQU8sRUFDTCxJQUFJLEVBQ0osaUJBQWlCLEVBQ2pCLGFBQWEsRUFJYixRQUFRLEdBQ1QsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFDLFFBQVEsRUFBRSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUVsRSxPQUFPLEVBQUMsU0FBUyxFQUFDLE1BQU0sVUFBVSxDQUFDO0FBQ25DLE9BQU8sRUFBQyxLQUFLLEVBQWEsTUFBTSxTQUFTLENBQUM7QUFjbkMsSUFBTSxLQUFLLGFBQVgsTUFBTSxLQUFNLFNBQVEsS0FBSztJQTJCOUIsWUFBbUIsS0FBaUI7UUFDbEMsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ2YsQ0FBQztJQUVrQixXQUFXO1FBQzVCLE1BQU0sTUFBTSxHQUFHLEtBQUssQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUNuQyxJQUFJLE1BQU0sQ0FBQyxDQUFDLEtBQUssSUFBSSxJQUFJLE1BQU0sQ0FBQyxDQUFDLEtBQUssSUFBSSxFQUFFLENBQUM7WUFDM0MsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO1lBQzNCLE9BQU87Z0JBQ0wsQ0FBQyxFQUFFLEtBQUssQ0FBQyxVQUFVO2dCQUNuQixDQUFDLEVBQUUsS0FBSyxDQUFDLFdBQVc7YUFDckIsQ0FBQztRQUNKLENBQUM7UUFFRCxPQUFPLE1BQU0sQ0FBQztJQUNoQixDQUFDO0lBRVMsWUFBWTtRQUNwQixPQUFPLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRVMsV0FBVztRQUNuQixPQUFPLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztJQUM1QixDQUFDO0lBRVMsZUFBZTtRQUN2QixPQUFPLElBQUksQ0FB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

package/lib/components/View2D.d.ts

@@ -1,25 +1,25 @@
-import {PlaybackState, SimpleSignal} from '@revideo/core';
-import type {Node} from './Node';
-import {Rect, RectProps} from './Rect';
+import { PlaybackState, SimpleSignal } from '@revideo/core';
+import type { Node } from './Node';
+import { Rect, RectProps } from './Rect';
 export interface View2DProps extends RectProps {
-  assetHash: string;
+    assetHash: string;
 }
 export declare class View2D extends Rect {
-  static shadowRoot: ShadowRoot;
-  readonly playbackState: SimpleSignal<PlaybackState, this>;
-  readonly globalTime: SimpleSignal<number, this>;
-  readonly assetHash: SimpleSignal<string, this>;
-  constructor(props: View2DProps);
-  dispose(): void;
-  render(context: CanvasRenderingContext2D): void;
-  /**
-   * Find a node by its key.
-   *
-   * @param key - The key of the node.
-   */
-  findKey<T extends Node = Node>(key: string): T | null;
-  protected requestLayoutUpdate(): void;
-  protected requestFontUpdate(): void;
-  view(): View2D;
+    static shadowRoot: ShadowRoot;
+    readonly playbackState: SimpleSignal<PlaybackState, this>;
+    readonly globalTime: SimpleSignal<number, this>;
+    readonly assetHash: SimpleSignal<string, this>;
+    constructor(props: View2DProps);
+    dispose(): void;
+    render(context: CanvasRenderingContext2D): void;
+    /**
+     * Find a node by its key.
+     *
+     * @param key - The key of the node.
+     */
+    findKey<T extends Node = Node>(key: string): T | null;
+    protected requestLayoutUpdate(): void;
+    protected requestFontUpdate(): void;
+    view(): View2D;
 }
-//# sourceMappingURL=View2D.d.ts.map
+//# sourceMappingURL=View2D.d.ts.map

package/lib/components/View2D.js

@@ -1,101 +1,88 @@
-var __decorate =
-  (this && this.__decorate) ||
-  function (decorators, target, key, desc) {
-    var c = arguments.length,
-      r =
-        c < 3
-          ? target
-          : desc === null
-            ? (desc = Object.getOwnPropertyDescriptor(target, key))
-            : desc,
-      d;
-    if (typeof Reflect === 'object' && typeof Reflect.decorate === 'function')
-      r = Reflect.decorate(decorators, target, key, desc);
-    else
-      for (var i = decorators.length - 1; i >= 0; i--)
-        if ((d = decorators[i]))
-          r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
-  };
+};
 var View2D_1;
-import {PlaybackState, lazy} from '@revideo/core';
-import {initial, signal} from '../decorators';
-import {nodeName} from '../decorators/nodeName';
-import {useScene2D} from '../scenes/useScene2D';
-import {Rect} from './Rect';
-let View2D = (View2D_1 = class View2D extends Rect {
-  constructor(props) {
-    super({
-      composite: true,
-      fontFamily: 'Roboto',
-      fontSize: 48,
-      lineHeight: '120%',
-      textWrap: false,
-      fontStyle: 'normal',
-      ...props,
-    });
-    this.view2D = this;
-    View2D_1.shadowRoot.append(this.element);
-    this.applyFlex();
-  }
-  dispose() {
-    this.removeChildren();
-    super.dispose();
-  }
-  render(context) {
-    this.computedSize();
-    this.computedPosition();
-    super.render(context);
-  }
-  /**
-   * Find a node by its key.
-   *
-   * @param key - The key of the node.
-   */
-  findKey(key) {
-    return useScene2D().getNode(key) ?? null;
-  }
-  requestLayoutUpdate() {
-    this.updateLayout();
-  }
-  requestFontUpdate() {
-    this.applyFont();
-  }
-  view() {
-    return this;
-  }
-});
-__decorate(
-  [initial(PlaybackState.Paused), signal()],
-  View2D.prototype,
-  'playbackState',
-  void 0,
-);
-__decorate([initial(0), signal()], View2D.prototype, 'globalTime', void 0);
-__decorate([signal()], View2D.prototype, 'assetHash', void 0);
-__decorate(
-  [
+import { PlaybackState, lazy } from '@revideo/core';
+import { initial, signal } from '../decorators';
+import { nodeName } from '../decorators/nodeName';
+import { useScene2D } from '../scenes/useScene2D';
+import { Rect } from './Rect';
+let View2D = View2D_1 = class View2D extends Rect {
+    constructor(props) {
+        super({
+            composite: true,
+            fontFamily: 'Roboto',
+            fontSize: 48,
+            lineHeight: '120%',
+            textWrap: false,
+            fontStyle: 'normal',
+            ...props,
+        });
+        this.view2D = this;
+        View2D_1.shadowRoot.append(this.element);
+        this.applyFlex();
+    }
+    dispose() {
+        this.removeChildren();
+        super.dispose();
+    }
+    render(context) {
+        this.computedSize();
+        this.computedPosition();
+        super.render(context);
+    }
+    /**
+     * Find a node by its key.
+     *
+     * @param key - The key of the node.
+     */
+    findKey(key) {
+        return useScene2D().getNode(key) ?? null;
+    }
+    requestLayoutUpdate() {
+        this.updateLayout();
+    }
+    requestFontUpdate() {
+        this.applyFont();
+    }
+    view() {
+        return this;
+    }
+};
+__decorate([
+    initial(PlaybackState.Paused),
+    signal()
+], View2D.prototype, "playbackState", void 0);
+__decorate([
+    initial(0),
+    signal()
+], View2D.prototype, "globalTime", void 0);
+__decorate([
+    signal()
+], View2D.prototype, "assetHash", void 0);
+__decorate([
     lazy(() => {
-      const frameID = 'revideo-2d-frame';
-      let frame = document.querySelector(`#${frameID}`);
-      if (!frame) {
-        frame = document.createElement('div');
-        frame.id = frameID;
-        frame.style.position = 'absolute';
-        frame.style.pointerEvents = 'none';
-        frame.style.top = '0';
-        frame.style.left = '0';
-        frame.style.opacity = '0';
-        frame.style.overflow = 'hidden';
-        document.body.prepend(frame);
-      }
-      return frame.shadowRoot ?? frame.attachShadow({mode: 'open'});
-    }),
-  ],
-  View2D,
-  'shadowRoot',
-  void 0,
-);
-View2D = View2D_1 = __decorate([nodeName('View2D')], View2D);
-export {View2D};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVmlldzJELmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2xpYi9jb21wb25lbnRzL1ZpZXcyRC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBQUEsT0FBTyxFQUFDLGFBQWEsRUFBZ0IsSUFBSSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ2hFLE9BQU8sRUFBQyxPQUFPLEVBQUUsTUFBTSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQzlDLE9BQU8sRUFBQyxRQUFRLEVBQUMsTUFBTSx3QkFBd0IsQ0FBQztBQUNoRCxPQUFPLEVBQUMsVUFBVSxFQUFDLE1BQU0sc0JBQXNCLENBQUM7QUFFaEQsT0FBTyxFQUFDLElBQUksRUFBWSxNQUFNLFFBQVEsQ0FBQztBQU9oQyxJQUFNLE1BQU0sY0FBWixNQUFNLE1BQU8sU0FBUSxJQUFJO0lBOEI5QixZQUFtQixLQUFrQjtRQUNuQyxLQUFLLENBQUM7WUFDSixTQUFTLEVBQUUsSUFBSTtZQUNmLFVBQVUsRUFBRSxRQUFRO1lBQ3BCLFFBQVEsRUFBRSxFQUFFO1lBQ1osVUFBVSxFQUFFLE1BQU07WUFDbEIsUUFBUSxFQUFFLEtBQUs7WUFDZixTQUFTLEVBQUUsUUFBUTtZQUNuQixHQUFHLEtBQUs7U0FDVCxDQUFDLENBQUM7UUFDSCxJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQztRQUVuQixRQUFNLENBQUMsVUFBVSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDdkMsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO0lBQ25CLENBQUM7SUFFZSxPQUFPO1FBQ3JCLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUN0QixLQUFLLENBQUMsT0FBTyxFQUFFLENBQUM7SUFDbEIsQ0FBQztJQUVlLE1BQU0sQ0FBQyxPQUFpQztRQUN0RCxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDcEIsSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7UUFDeEIsS0FBSyxDQUFDLE1BQU0sQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUN4QixDQUFDO0lBRUQ7Ozs7T0FJRztJQUNJLE9BQU8sQ0FBd0IsR0FBVztRQUMvQyxPQUFRLFVBQVUsRUFBRSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQU8sSUFBSSxJQUFJLENBQUM7SUFDbEQsQ0FBQztJQUVrQixtQkFBbUI7UUFDcEMsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3RCLENBQUM7SUFFa0IsaUJBQWlCO1FBQ2xDLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztJQUNuQixDQUFDO0lBRWUsSUFBSTtRQUNsQixPQUFPLElBQUksQ0FBQztJQUNkLENBQUM7Q0FDRixDQUFBO0FBeER5QjtJQUZ2QixPQUFPLENBQUMsYUFBYSxDQUFDLE1BQU0sQ0FBQztJQUM3QixNQUFNLEVBQUU7NkNBQ2dFO0FBSWpEO0lBRnZCLE9BQU8sQ0FBQyxDQUFDLENBQUM7SUFDVixNQUFNLEVBQUU7MENBQ3NEO0FBR3ZDO0lBRHZCLE1BQU0sRUFBRTt5Q0FDcUQ7QUFYaEQ7SUFoQmIsSUFBSSxDQUFDLEdBQUcsRUFBRTtRQUNULE1BQU0sT0FBTyxHQUFHLGtCQUFrQixDQUFDO1FBQ25DLElBQUksS0FBSyxHQUFHLFFBQVEsQ0FBQyxhQUFhLENBQWlCLElBQUksT0FBTyxFQUFFLENBQUMsQ0FBQztRQUNsRSxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDWCxLQUFLLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUN0QyxLQUFLLENBQUMsRUFBRSxHQUFHLE9BQU8sQ0FBQztZQUNuQixLQUFLLENBQUMsS0FBSyxDQUFDLFFBQVEsR0FBRyxVQUFVLENBQUM7WUFDbEMsS0FBSyxDQUFDLEtBQUssQ0FBQyxhQUFhLEdBQUcsTUFBTSxDQUFDO1lBQ25DLEtBQUssQ0FBQyxLQUFLLENBQUMsR0FBRyxHQUFHLEdBQUcsQ0FBQztZQUN0QixLQUFLLENBQUMsS0FBSyxDQUFDLElBQUksR0FBRyxHQUFHLENBQUM7WUFDdkIsS0FBSyxDQUFDLEtBQUssQ0FBQyxPQUFPLEdBQUcsR0FBRyxDQUFDO1lBQzFCLEtBQUssQ0FBQyxLQUFLLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQztZQUNoQyxRQUFRLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUMvQixDQUFDO1FBQ0QsT0FBTyxLQUFLLENBQUMsVUFBVSxJQUFJLEtBQUssQ0FBQyxZQUFZLENBQUMsRUFBQyxJQUFJLEVBQUUsTUFBTSxFQUFDLENBQUMsQ0FBQztJQUNoRSxDQUFDLENBQUM7Z0NBQ21DO0FBakIxQixNQUFNO0lBRGxCLFFBQVEsQ0FBQyxRQUFRLENBQUM7R0FDTixNQUFNLENBNkVsQiJ9
+        const frameID = 'revideo-2d-frame';
+        let frame = document.querySelector(`#${frameID}`);
+        if (!frame) {
+            frame = document.createElement('div');
+            frame.id = frameID;
+            frame.style.position = 'absolute';
+            frame.style.pointerEvents = 'none';
+            frame.style.top = '0';
+            frame.style.left = '0';
+            frame.style.opacity = '0';
+            frame.style.overflow = 'hidden';
+            document.body.prepend(frame);
+        }
+        return frame.shadowRoot ?? frame.attachShadow({ mode: 'open' });
+    })
+], View2D, "shadowRoot", void 0);
+View2D = View2D_1 = __decorate([
+    nodeName('View2D')
+], View2D);
+export { View2D };
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVmlldzJELmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2xpYi9jb21wb25lbnRzL1ZpZXcyRC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBQUEsT0FBTyxFQUFDLGFBQWEsRUFBZ0IsSUFBSSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ2hFLE9BQU8sRUFBQyxPQUFPLEVBQUUsTUFBTSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQzlDLE9BQU8sRUFBQyxRQUFRLEVBQUMsTUFBTSx3QkFBd0IsQ0FBQztBQUNoRCxPQUFPLEVBQUMsVUFBVSxFQUFDLE1BQU0sc0JBQXNCLENBQUM7QUFFaEQsT0FBTyxFQUFDLElBQUksRUFBWSxNQUFNLFFBQVEsQ0FBQztBQU9oQyxJQUFNLE1BQU0sY0FBWixNQUFNLE1BQU8sU0FBUSxJQUFJO0lBOEI5QixZQUFtQixLQUFrQjtRQUNuQyxLQUFLLENBQUM7WUFDSixTQUFTLEVBQUUsSUFBSTtZQUNmLFVBQVUsRUFBRSxRQUFRO1lBQ3BCLFFBQVEsRUFBRSxFQUFFO1lBQ1osVUFBVSxFQUFFLE1BQU07WUFDbEIsUUFBUSxFQUFFLEtBQUs7WUFDZixTQUFTLEVBQUUsUUFBUTtZQUNuQixHQUFHLEtBQUs7U0FDVCxDQUFDLENBQUM7UUFDSCxJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQztRQUVuQixRQUFNLENBQUMsVUFBVSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDdkMsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO0lBQ25CLENBQUM7SUFFZSxPQUFPO1FBQ3JCLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUN0QixLQUFLLENBQUMsT0FBTyxFQUFFLENBQUM7SUFDbEIsQ0FBQztJQUVlLE1BQU0sQ0FBQyxPQUFpQztRQUN0RCxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDcEIsSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7UUFDeEIsS0FBSyxDQUFDLE1BQU0sQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUN4QixDQUFDO0lBRUQ7Ozs7T0FJRztJQUNJLE9BQU8sQ0FBd0IsR0FBVztRQUMvQyxPQUFRLFVBQVUsRUFBRSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQU8sSUFBSSxJQUFJLENBQUM7SUFDbEQsQ0FBQztJQUVrQixtQkFBbUI7UUFDcEMsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3RCLENBQUM7SUFFa0IsaUJBQWlCO1FBQ2xDLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztJQUNuQixDQUFDO0lBRWUsSUFBSTtRQUNsQixPQUFPLElBQUksQ0FBQztJQUNkLENBQUM7Q0FDRixDQUFBO0FBeER5QjtJQUZ2QixPQUFPLENBQUMsYUFBYSxDQUFDLE1BQU0sQ0FBQztJQUM3QixNQUFNLEVBQUU7NkNBQ2dFO0FBSWpEO0lBRnZCLE9BQU8sQ0FBQyxDQUFDLENBQUM7SUFDVixNQUFNLEVBQUU7MENBQ3NEO0FBR3ZDO0lBRHZCLE1BQU0sRUFBRTt5Q0FDcUQ7QUFYaEQ7SUFoQmIsSUFBSSxDQUFDLEdBQUcsRUFBRTtRQUNULE1BQU0sT0FBTyxHQUFHLGtCQUFrQixDQUFDO1FBQ25DLElBQUksS0FBSyxHQUFHLFFBQVEsQ0FBQyxhQUFhLENBQWlCLElBQUksT0FBTyxFQUFFLENBQUMsQ0FBQztRQUNsRSxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDWCxLQUFLLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUN0QyxLQUFLLENBQUMsRUFBRSxHQUFHLE9BQU8sQ0FBQztZQUNuQixLQUFLLENBQUMsS0FBSyxDQUFDLFFBQVEsR0FBRyxVQUFVLENBQUM7WUFDbEMsS0FBSyxDQUFDLEtBQUssQ0FBQyxhQUFhLEdBQUcsTUFBTSxDQUFDO1lBQ25DLEtBQUssQ0FBQyxLQUFLLENBQUMsR0FBRyxHQUFHLEdBQUcsQ0FBQztZQUN0QixLQUFLLENBQUMsS0FBSyxDQUFDLElBQUksR0FBRyxHQUFHLENBQUM7WUFDdkIsS0FBSyxDQUFDLEtBQUssQ0FBQyxPQUFPLEdBQUcsR0FBRyxDQUFDO1lBQzFCLEtBQUssQ0FBQyxLQUFLLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQztZQUNoQyxRQUFRLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUMvQixDQUFDO1FBQ0QsT0FBTyxLQUFLLENBQUMsVUFBVSxJQUFJLEtBQUssQ0FBQyxZQUFZLENBQUMsRUFBQyxJQUFJLEVBQUUsTUFBTSxFQUFDLENBQUMsQ0FBQztJQUNoRSxDQUFDLENBQUM7Z0NBQ21DO0FBakIxQixNQUFNO0lBRGxCLFFBQVEsQ0FBQyxRQUFRLENBQUM7R0FDTixNQUFNLENBNkVsQiJ9

package/lib/components/index.d.ts

@@ -24,4 +24,4 @@ export * from './Txt';
 export * from './Video';
 export * from './View2D';
 export * from './types';
-//# sourceMappingURL=index.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/lib/components/index.js

@@ -24,4 +24,4 @@ export * from './Txt';
 export * from './Video';
 export * from './View2D';
 export * from './types';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL2NvbXBvbmVudHMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxlQUFlLENBQUM7QUFDOUIsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxPQUFPLENBQUM7QUFDdEIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxXQUFXLENBQUM7QUFDMUIsY0FBYyxjQUFjLENBQUM7QUFDN0IsY0FBYyxPQUFPLENBQUM7QUFDdEIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxPQUFPLENBQUM7QUFDdEIsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxPQUFPLENBQUM7QUFDdEIsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxTQUFTLENBQUMifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL2NvbXBvbmVudHMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxlQUFlLENBQUM7QUFDOUIsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxPQUFPLENBQUM7QUFDdEIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxXQUFXLENBQUM7QUFDMUIsY0FBYyxjQUFjLENBQUM7QUFDN0IsY0FBYyxPQUFPLENBQUM7QUFDdEIsY0FBYyxRQUFRLENBQUM7QUFDdkIsY0FBYyxPQUFPLENBQUM7QUFDdEIsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxPQUFPLENBQUM7QUFDdEIsY0FBYyxTQUFTLENBQUM7QUFDeEIsY0FBYyxVQUFVLENBQUM7QUFDekIsY0FBYyxTQUFTLENBQUMifQ==

package/lib/components/types.d.ts

@@ -1,30 +1,17 @@
-import type {ReferenceReceiver} from '@revideo/core';
-import type {Node} from './Node';
-export type ComponentChild =
-  | Node
-  | object
-  | string
-  | number
-  | bigint
-  | boolean
-  | null
-  | undefined;
+import type { ReferenceReceiver } from '@revideo/core';
+import type { Node } from './Node';
+export type ComponentChild = Node | object | string | number | bigint | boolean | null | undefined;
 export type ComponentChildren = ComponentChild | ComponentChild[];
 export type NodeChildren = Node | Node[];
-export type PropsOf<T> =
-  T extends NodeConstructor<infer P>
-    ? P
-    : T extends FunctionComponent<infer P>
-      ? P
-      : never;
+export type PropsOf<T> = T extends NodeConstructor<infer P> ? P : T extends FunctionComponent<infer P> ? P : never;
 export interface JSXProps {
-  children?: ComponentChildren;
-  ref?: ReferenceReceiver<Node>;
+    children?: ComponentChildren;
+    ref?: ReferenceReceiver<Node>;
 }
 export interface FunctionComponent<T = any> {
-  (props: T): Node | null;
+    (props: T): Node | null;
 }
 export interface NodeConstructor<TProps = any, TNode = Node> {
-  new (props: TProps): TNode;
+    new (props: TProps): TNode;
 }
-//# sourceMappingURL=types.d.ts.map
+//# sourceMappingURL=types.d.ts.map

package/lib/components/types.js

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL2NvbXBvbmVudHMvdHlwZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL2NvbXBvbmVudHMvdHlwZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiJ9