@revideo/2d 0.3.5-alpha.967 → 0.3.5-beta.967

package/lib/utils/diff.js

@@ -1,97 +1,94 @@
 function getIdMap(list) {
-    const map = new Map();
-    let before = undefined;
-    for (const [index, current] of list.entries()) {
-        const currentArray = map.get(current.id) ?? [];
-        if (!map.has(current.id)) {
-            map.set(current.id, currentArray);
-        }
-        currentArray.push({
-            before,
-            current,
-            beforeIdIndex: before ? map.get(before.id).length - 1 : -1,
-            currentIndex: index,
-        });
-        before = current;
+  const map = new Map();
+  let before = undefined;
+  for (const [index, current] of list.entries()) {
+    const currentArray = map.get(current.id) ?? [];
+    if (!map.has(current.id)) {
+      map.set(current.id, currentArray);
     }
-    return map;
+    currentArray.push({
+      before,
+      current,
+      beforeIdIndex: before ? map.get(before.id).length - 1 : -1,
+      currentIndex: index,
+    });
+    before = current;
+  }
+  return map;
 }
 export function getTransformDiff(from, to) {
-    const diff = {
-        inserted: [],
-        deleted: [],
-        transformed: [],
-    };
-    const fromMap = getIdMap(from);
-    const toMap = getIdMap(to);
-    for (const [key, fromItem] of fromMap.entries()) {
-        const toItem = toMap.get(key);
-        if (toItem) {
-            toMap.delete(key);
-            for (let i = 0; i < Math.max(fromItem.length, toItem.length); i++) {
-                const insert = i >= fromItem.length;
-                const remove = i >= toItem.length;
-                const fromNode = !insert ? fromItem[i] : fromItem[fromItem.length - 1];
-                const toNode = !remove ? toItem[i] : toItem[toItem.length - 1];
-                diff.transformed.push({
-                    insert,
-                    remove,
-                    from: fromNode,
-                    to: toNode,
-                });
-            }
-        }
-        else {
-            for (const node of fromItem) {
-                diff.deleted.push(node);
-            }
-        }
+  const diff = {
+    inserted: [],
+    deleted: [],
+    transformed: [],
+  };
+  const fromMap = getIdMap(from);
+  const toMap = getIdMap(to);
+  for (const [key, fromItem] of fromMap.entries()) {
+    const toItem = toMap.get(key);
+    if (toItem) {
+      toMap.delete(key);
+      for (let i = 0; i < Math.max(fromItem.length, toItem.length); i++) {
+        const insert = i >= fromItem.length;
+        const remove = i >= toItem.length;
+        const fromNode = !insert ? fromItem[i] : fromItem[fromItem.length - 1];
+        const toNode = !remove ? toItem[i] : toItem[toItem.length - 1];
+        diff.transformed.push({
+          insert,
+          remove,
+          from: fromNode,
+          to: toNode,
+        });
+      }
+    } else {
+      for (const node of fromItem) {
+        diff.deleted.push(node);
+      }
     }
-    for (const toItem of toMap.values()) {
-        for (const node of toItem) {
-            diff.inserted.push(node);
-        }
+  }
+  for (const toItem of toMap.values()) {
+    for (const node of toItem) {
+      diff.inserted.push(node);
     }
-    return diff;
+  }
+  return diff;
 }
 export function applyTransformDiff(current, diff, cloner) {
-    function insert(item) {
-        let idIndex = -1;
-        const index = item.before
-            ? current.findIndex(({ id }) => {
-                if (id === item.before?.id) {
-                    idIndex++;
-                    if (idIndex === item.beforeIdIndex)
-                        return true;
-                }
-                return false;
-            })
-            : 0;
-        current.splice(index + 1, 0, item.current);
-    }
-    const result = {
-        inserted: diff.inserted.map(item => ({
-            item,
-            order: item.currentIndex,
-        })),
+  function insert(item) {
+    let idIndex = -1;
+    const index = item.before
+      ? current.findIndex(({id}) => {
+          if (id === item.before?.id) {
+            idIndex++;
+            if (idIndex === item.beforeIdIndex) return true;
+          }
+          return false;
+        })
+      : 0;
+    current.splice(index + 1, 0, item.current);
+  }
+  const result = {
+    inserted: diff.inserted.map(item => ({
+      item,
+      order: item.currentIndex,
+    })),
+  };
+  for (const item of diff.transformed) {
+    if (!item.insert) continue;
+    const from = item.from;
+    item.from = {
+      ...item.to,
+      current: cloner(from.current),
     };
-    for (const item of diff.transformed) {
-        if (!item.insert)
-            continue;
-        const from = item.from;
-        item.from = {
-            ...item.to,
-            current: cloner(from.current),
-        };
-        result.inserted.push({
-            item: item.from,
-            order: item.to.currentIndex,
-        });
-    }
-    result.inserted.sort((a, b) => a.order - b.order);
-    for (const item of result.inserted) {
-        insert(item.item);
-    }
-    return result;
+    result.inserted.push({
+      item: item.from,
+      order: item.to.currentIndex,
+    });
+  }
+  result.inserted.sort((a, b) => a.order - b.order);
+  for (const item of result.inserted) {
+    insert(item.item);
+  }
+  return result;
 }
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlmZi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9saWIvdXRpbHMvZGlmZi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQ0EsU0FBUyxRQUFRLENBQW1CLElBQVM7SUFDM0MsTUFBTSxHQUFHLEdBQUcsSUFBSSxHQUFHLEVBQWtDLENBQUM7SUFDdEQsSUFBSSxNQUFNLEdBQWtCLFNBQVMsQ0FBQztJQUN0QyxLQUFLLE1BQU0sQ0FBQyxLQUFLLEVBQUUsT0FBTyxDQUFDLElBQUksSUFBSSxDQUFDLE9BQU8sRUFBRSxFQUFFLENBQUM7UUFDOUMsTUFBTSxZQUFZLEdBQUcsR0FBRyxDQUFDLEdBQUcsQ0FBQyxPQUFPLENBQUMsRUFBRSxDQUFDLElBQUksRUFBRSxDQUFDO1FBQy9DLElBQUksQ0FBQyxHQUFHLENBQUMsR0FBRyxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUMsRUFBRSxDQUFDO1lBQ3pCLEdBQUcsQ0FBQyxHQUFHLENBQUMsT0FBTyxDQUFDLEVBQUUsRUFBRSxZQUFZLENBQUMsQ0FBQztRQUNwQyxDQUFDO1FBRUQsWUFBWSxDQUFDLElBQUksQ0FBQztZQUNoQixNQUFNO1lBQ04sT0FBTztZQUNQLGFBQWEsRUFBRSxNQUFNLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUMsTUFBTSxDQUFDLEVBQUUsQ0FBRSxDQUFDLE1BQU0sR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUMzRCxZQUFZLEVBQUUsS0FBSztTQUNwQixDQUFDLENBQUM7UUFDSCxNQUFNLEdBQUcsT0FBTyxDQUFDO0lBQ25CLENBQUM7SUFDRCxPQUFPLEdBQUcsQ0FBQztBQUNiLENBQUM7QUFFRCxNQUFNLFVBQVUsZ0JBQWdCLENBQzlCLElBQVMsRUFDVCxFQUFPO0lBRVAsTUFBTSxJQUFJLEdBQXFCO1FBQzdCLFFBQVEsRUFBRSxFQUFFO1FBQ1osT0FBTyxFQUFFLEVBQUU7UUFDWCxXQUFXLEVBQUUsRUFBRTtLQUNo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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlmZi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9saWIvdXRpbHMvZGlmZi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQ0EsU0FBUyxRQUFRLENBQW1CLElBQVM7SUFDM0MsTUFBTSxHQUFHLEdBQUcsSUFBSSxHQUFHLEVBQWtDLENBQUM7SUFDdEQsSUFBSSxNQUFNLEdBQWtCLFNBQVMsQ0FBQztJQUN0QyxLQUFLLE1BQU0sQ0FBQyxLQUFLLEVBQUUsT0FBTyxDQUFDLElBQUksSUFBSSxDQUFDLE9BQU8sRUFBRSxFQUFFLENBQUM7UUFDOUMsTUFBTSxZQUFZLEdBQUcsR0FBRyxDQUFDLEdBQUcsQ0FBQyxPQUFPLENBQUMsRUFBRSxDQUFDLElBQUksRUFBRSxDQUFDO1FBQy9DLElBQUksQ0FBQyxHQUFHLENBQUMsR0FBRyxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUMsRUFBRSxDQUFDO1lBQ3pCLEdBQUcsQ0FBQyxHQUFHLENBQUMsT0FBTyxDQUFDLEVBQUUsRUFBRSxZQUFZLENBQUMsQ0FBQztRQUNwQyxDQUFDO1FBRUQsWUFBWSxDQUFDLElBQUksQ0FBQztZQUNoQixNQUFNO1lBQ04sT0FBTztZQUNQLGFBQWEsRUFBRSxNQUFNLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUMsTUFBTSxDQUFDLEVBQUUsQ0FBRSxDQUFDLE1BQU0sR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUMzRCxZQUFZLEVBQUUsS0FBSztTQUNwQixDQUFDLENBQUM7UUFDSCxNQUFNLEdBQUcsT0FBTyxDQUFDO0lBQ25CLENBQUM7SUFDRCxPQUFPLEdBQUcsQ0FBQztBQUNiLENBQUM7QUFFRCxNQUFNLFVBQVUsZ0JBQWdCLENBQzlCLElBQVMsRUFDVCxFQUFPO0lBRVAsTUFBTSxJQUFJLEdBQXFCO1FBQzdCLFFBQVEsRUFBRSxFQUFFO1FBQ1osT0FBTyxFQUFFLEVBQUU7UUFDWCxXQUFXLEVBQUUsRUFBRTtLQUNo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

package/lib/utils/index.d.ts

@@ -1,3 +1,3 @@
 export * from './CanvasUtils';
 export * from './is';
-//# sourceMappingURL=index.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/index.js

@@ -1,3 +1,3 @@
 export * from './CanvasUtils';
 export * from './is';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL3V0aWxzL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsZUFBZSxDQUFDO0FBQzlCLGNBQWMsTUFBTSxDQUFDIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL3V0aWxzL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsZUFBZSxDQUFDO0FBQzlCLGNBQWMsTUFBTSxDQUFDIn0=

package/lib/utils/is.d.ts

@@ -4,5 +4,7 @@
  *
  * @param klass - The class to check against.
  */
-export declare function is<T>(klass: new (...args: any[]) => T): (object: any) => object is T;
-//# sourceMappingURL=is.d.ts.map
+export declare function is<T>(
+  klass: new (...args: any[]) => T,
+): (object: any) => object is T;
+//# sourceMappingURL=is.d.ts.map

package/lib/utils/is.js

@@ -5,6 +5,6 @@
  * @param klass - The class to check against.
  */
 export function is(klass) {
-    return (object) => object instanceof klass;
+  return object => object instanceof klass;
 }
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL3V0aWxzL2lzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7OztHQUtHO0FBQ0gsTUFBTSxVQUFVLEVBQUUsQ0FDaEIsS0FBZ0M7SUFFaEMsT0FBTyxDQUFDLE1BQU0sRUFBZSxFQUFFLENBQUMsTUFBTSxZQUFZLEtBQUssQ0FBQztBQUMxRCxDQUFDIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL3V0aWxzL2lzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7OztHQUtHO0FBQ0gsTUFBTSxVQUFVLEVBQUUsQ0FDaEIsS0FBZ0M7SUFFaEMsT0FBTyxDQUFDLE1BQU0sRUFBZSxFQUFFLENBQUMsTUFBTSxZQUFZLEtBQUssQ0FBQztBQUMxRCxDQUFDIn0=

package/lib/utils/makeSignalExtensions.d.ts

@@ -1,4 +1,11 @@
-import { SignalExtensions } from '@revideo/core';
-import { PropertyMetadata } from '../decorators';
-export declare function makeSignalExtensions<TSetterValue, TValue extends TSetterValue>(meta?: Partial<PropertyMetadata<TValue>>, owner?: any, name?: string): Partial<SignalExtensions<TSetterValue, TValue>>;
-//# sourceMappingURL=makeSignalExtensions.d.ts.map
+import {SignalExtensions} from '@revideo/core';
+import {PropertyMetadata} from '../decorators';
+export declare function makeSignalExtensions<
+  TSetterValue,
+  TValue extends TSetterValue,
+>(
+  meta?: Partial<PropertyMetadata<TValue>>,
+  owner?: any,
+  name?: string,
+): Partial<SignalExtensions<TSetterValue, TValue>>;
+//# sourceMappingURL=makeSignalExtensions.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@revideo/2d",
-  "version": "0.3.5-alpha.967+522d629",
+  "version": "0.3.5-beta.967+669ecc1",
   "description": "A 2D renderer for revideo",
   "author": "revideo",
   "homepage": "https://re.video/",
@@ -30,7 +30,7 @@
   "devDependencies": {
     "@preact/signals": "^1.2.1",
     "@revideo/internal": "^0.0.0",
-    "@revideo/ui": "^0.3.5-alpha.967+522d629",
+    "@revideo/ui": "^0.3.5-beta.967+669ecc1",
     "clsx": "^2.0.0",
     "jsdom": "^22.1.0",
     "preact": "^10.19.2",
@@ -40,10 +40,10 @@
     "@codemirror/language": "^6.10.1",
     "@lezer/common": "^1.2.1",
     "@lezer/highlight": "^1.2.0",
-    "@revideo/core": "^0.3.5-alpha.967+522d629",
+    "@revideo/core": "^0.3.5-beta.967+669ecc1",
     "code-fns": "^0.8.2",
     "mathjax-full": "^3.2.2",
     "parse-svg-path": "^0.1.2"
   },
-  "gitHead": "522d6298356da6ee44f1e97932b52e08edb19a12"
+  "gitHead": "669ecc1de9dade89c7508968ee31cb83b35095ec"
 }

package/src/lib/components/Media.ts

@@ -7,7 +7,7 @@ import {
   useLogger,
   useThread,
 } from '@revideo/core';
-import {computed, initial, signal} from '../decorators';
+import {computed, initial, nodeName, signal} from '../decorators';
 import {Rect, RectProps} from './Rect';
 import reactivePlaybackRate from './__logs__/reactive-playback-rate.md';
 
@@ -20,6 +20,7 @@ export interface MediaProps extends RectProps {
   play?: boolean;
 }
 
+@nodeName('Media')
 export abstract class Media extends Rect {
   @signal()
   public declare readonly src: SimpleSignal<string, this>;

package/src/lib/components/Video.ts

@@ -22,9 +22,9 @@ export interface VideoProps extends MediaProps {
    */
   smoothing?: SignalValue<boolean>;
   /**
-   * {@inheritDoc Video.transparency}
+   * {@inheritDoc Video.png}
    */
-  transparency?: SignalValue<boolean>;
+  png?: SignalValue<boolean>;
 }
 
 class ImageCommunication {
@@ -56,7 +56,7 @@ class ImageCommunication {
     time: number,
     duration: number,
     fps: number,
-    transparency: boolean,
+    png: boolean,
   ) {
     return new Promise<HTMLImageElement>((resolve, reject) => {
       if (!import.meta.hot) {
@@ -68,7 +68,7 @@ class ImageCommunication {
         const image = new Image();
 
         const uint8Array = new Uint8Array(event.data.frame.data);
-        const type = transparency ? 'image/png' : 'image/jpeg';
+        const type = png ? 'image/png' : 'image/jpeg';
         const blob = new Blob([uint8Array], {type});
         const url = URL.createObjectURL(blob);
 
@@ -88,7 +88,7 @@ class ImageCommunication {
           startTime: time,
           duration,
           fps,
-          transparency,
+          png,
         },
       });
     });
@@ -122,17 +122,18 @@ export class Video extends Media {
   public declare readonly smoothing: SimpleSignal<boolean, this>;
 
   /**
-   * Whether the video should be rendered as partially transparent.
+   * Whether the video frames should be extracted as PNGs. Uses JPEGs when
+   * set to false.
    *
    * @remarks
-   * When enabled, the video frames will be extracted as PNGs with an alpha
-   * channel. This is significantly slower than using JPEGs which is the default.
+   * PNGs have better image quality and support transparency, but they make
+   * rendering slower.
    *
    * @defaultValue false
    */
-  @initial(false)
+  @initial(true)
   @signal()
-  public declare readonly transparency: SimpleSignal<boolean, this>;
+  public declare readonly png: SimpleSignal<boolean, this>;
 
   private static readonly pool: Record<string, HTMLVideoElement> = {};
 
@@ -280,7 +281,7 @@ export class Video extends Media {
       time,
       duration,
       fps,
-      this.transparency(),
+      this.png(),
     );
     this.lastFrame = frame;
     this.lastTime = time;