pixi-effects 0.28.2 → 0.30.0

package/dist/Base-CB1_FPZD.d.cts

@@ -0,0 +1,60 @@
+import { Container } from 'pixi.js';
+import { S as SequenceSpec, C as CompositionShape } from './types-BzIB65Vk.cjs';
+
+/**
+ * Resolves a routed keyframe path to a concrete tween target.
+ * `path` is everything after the registered prefix + dot (for
+ * `three.cube.rotation.y` under prefix `three`, path = `cube.rotation.y`).
+ * Return null to skip the key (the router is expected to have warned).
+ */
+type PathRouter = (path: string) => {
+    target: object;
+    prop: string;
+} | null;
+type PathRouters = Record<string, PathRouter>;
+
+/** Variables available to expression evaluation. */
+interface Scope {
+    w: number;
+    h: number;
+    W: number;
+    H: number;
+    GW: number;
+    GH: number;
+    contain: number;
+    cover: number;
+    t: number;
+    d: number;
+    T: number;
+}
+
+declare abstract class Sequence {
+    spec: SequenceSpec;
+    parent: CompositionShape | null;
+    root: CompositionShape;
+    target: Container | null;
+    intrinsicWidth: number;
+    intrinsicHeight: number;
+    at: number;
+    duration: number | undefined;
+    constructor(spec: SequenceSpec, parent: CompositionShape | null, root: CompositionShape);
+    abstract build(): Promise<void>;
+    buildFilters(): void;
+    scope(): Scope;
+    /**
+     * Prefix routers contributed to the keyframe pipeline (e.g. `three.` in
+     * pixi-effects/three). Base sequences route nothing extra.
+     */
+    protected pathRouters(): PathRouters;
+    /**
+     * The `initial` and `keyframes` that go onto the display object. A layer whose `time` runs a clock (video, composition) takes `time`
+     * out of them: it is not a property of the display object.
+     */
+    protected displayProps(): {
+        initial: SequenceSpec['initial'];
+        keyframes: SequenceSpec['keyframes'];
+    };
+    destroy(): void;
+}
+
+export { type PathRouters as P, Sequence as S };

package/dist/Base-Ne74ztNl.d.ts

@@ -0,0 +1,60 @@
+import { Container } from 'pixi.js';
+import { S as SequenceSpec, C as CompositionShape } from './types-BzIB65Vk.js';
+
+/**
+ * Resolves a routed keyframe path to a concrete tween target.
+ * `path` is everything after the registered prefix + dot (for
+ * `three.cube.rotation.y` under prefix `three`, path = `cube.rotation.y`).
+ * Return null to skip the key (the router is expected to have warned).
+ */
+type PathRouter = (path: string) => {
+    target: object;
+    prop: string;
+} | null;
+type PathRouters = Record<string, PathRouter>;
+
+/** Variables available to expression evaluation. */
+interface Scope {
+    w: number;
+    h: number;
+    W: number;
+    H: number;
+    GW: number;
+    GH: number;
+    contain: number;
+    cover: number;
+    t: number;
+    d: number;
+    T: number;
+}
+
+declare abstract class Sequence {
+    spec: SequenceSpec;
+    parent: CompositionShape | null;
+    root: CompositionShape;
+    target: Container | null;
+    intrinsicWidth: number;
+    intrinsicHeight: number;
+    at: number;
+    duration: number | undefined;
+    constructor(spec: SequenceSpec, parent: CompositionShape | null, root: CompositionShape);
+    abstract build(): Promise<void>;
+    buildFilters(): void;
+    scope(): Scope;
+    /**
+     * Prefix routers contributed to the keyframe pipeline (e.g. `three.` in
+     * pixi-effects/three). Base sequences route nothing extra.
+     */
+    protected pathRouters(): PathRouters;
+    /**
+     * The `initial` and `keyframes` that go onto the display object. A layer whose `time` runs a clock (video, composition) takes `time`
+     * out of them: it is not a property of the display object.
+     */
+    protected displayProps(): {
+        initial: SequenceSpec['initial'];
+        keyframes: SequenceSpec['keyframes'];
+    };
+    destroy(): void;
+}
+
+export { type PathRouters as P, Sequence as S };

package/dist/Composition-MUKR3FYD.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+var chunkWHNADXXG_cjs = require('./chunk-WHNADXXG.cjs');
+require('./chunk-ZVUO325O.cjs');
+require('./chunk-2DXPTKQZ.cjs');
+require('./chunk-LYOKH7KE.cjs');
+require('./chunk-TWZNOUM7.cjs');
+
+
+
+Object.defineProperty(exports, "CompositionSequence", {
+  enumerable: true,
+  get: function () { return chunkWHNADXXG_cjs.CompositionSequence; }
+});
+//# sourceMappingURL=Composition-MUKR3FYD.cjs.map
+//# sourceMappingURL=Composition-MUKR3FYD.cjs.map

package/dist/{Composition-K6B3APM5.cjs.map → Composition-MUKR3FYD.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"Composition-K6B3APM5.cjs"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"Composition-MUKR3FYD.cjs"}

package/dist/Composition-RJGA7KDU.js

@@ -0,0 +1,7 @@
+export { CompositionSequence } from './chunk-A3Q3SDSH.js';
+import './chunk-ZAXYPXKW.js';
+import './chunk-4KB3GUEK.js';
+import './chunk-RCVZX2JP.js';
+import './chunk-BXOCEZ4U.js';
+//# sourceMappingURL=Composition-RJGA7KDU.js.map
+//# sourceMappingURL=Composition-RJGA7KDU.js.map

package/dist/{Composition-H7UNR5F5.js.map → Composition-RJGA7KDU.js.map}

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"Composition-H7UNR5F5.js"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"Composition-RJGA7KDU.js"}

package/dist/Controller.cjs

@@ -2,18 +2,7 @@
 
 var chunkTWZNOUM7_cjs = require('./chunk-TWZNOUM7.cjs');
 
-// src/Controller.ts
-var ICONS = {
-  play: '<svg viewBox="0 0 16 16" width="16" height="16" fill="currentColor"><path d="M3 2 L13 8 L3 14 Z"/></svg>',
-  pause: '<svg viewBox="0 0 16 16" width="16" height="16" fill="currentColor"><rect x="3" y="2" width="3.5" height="12"/><rect x="9.5" y="2" width="3.5" height="12"/></svg>',
-  volumeOn: '<svg viewBox="0 0 16 16" width="16" height="16" fill="currentColor"><path d="M2 6 H5 L9 2 V14 L5 10 H2 Z"/><path d="M11 5 Q13 8 11 11" fill="none" stroke="currentColor" stroke-width="1.2"/><path d="M12.5 3.5 Q15.5 8 12.5 12.5" fill="none" stroke="currentColor" stroke-width="1.2"/></svg>',
-  volumeOff: '<svg viewBox="0 0 16 16" width="16" height="16" fill="currentColor"><path d="M2 6 H5 L9 2 V14 L5 10 H2 Z"/><path d="M11 5 L15 11 M15 5 L11 11" fill="none" stroke="currentColor" stroke-width="1.4"/></svg>',
-  download: '<svg viewBox="0 0 16 16" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M8 2 V11 M4 7 L8 11 L12 7 M3 13 H13"/></svg>',
-  fullscreenEnter: '<svg viewBox="0 0 16 16" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M2 6 V2 H6 M14 6 V2 H10 M2 10 V14 H6 M14 10 V14 H10"/></svg>',
-  present: '<svg viewBox="0 0 16 16" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M2 2.5 H14 V10.5 H2 Z M8 10.5 V13.5 M5 13.5 H11"/></svg>',
-  fullscreenExit: '<svg viewBox="0 0 16 16" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M6 2 V6 H2 M10 2 V6 H14 M6 14 V10 H2 M10 14 V10 H14"/></svg>'
-};
-var STYLE_ATTR = "data-movie-controller";
+// src/controller/css.ts
 var CONTROLLER_CSS = `
 .movie-controller-wrap { position: relative; display: inline-block; line-height: 0; }
 .movie-controller {
@@ -232,22 +221,8 @@ var CONTROLLER_CSS = `
   font-family: Menlo, Monaco, monospace;
 }
 `;
-var styleRefCount = 0;
-function installStyles() {
-  if (styleRefCount === 0) {
-    const el = document.createElement("style");
-    el.setAttribute(STYLE_ATTR, "");
-    el.textContent = CONTROLLER_CSS;
-    document.head.appendChild(el);
-  }
-  styleRefCount++;
-}
-function uninstallStyles() {
-  styleRefCount = Math.max(0, styleRefCount - 1);
-  if (styleRefCount === 0) {
-    document.head.querySelectorAll(`style[${STYLE_ATTR}]`).forEach((n) => n.remove());
-  }
-}
+
+// src/controller/helpers.ts
 function formatTime(seconds) {
   const s = Math.max(0, Math.floor(seconds));
   const m = Math.floor(s / 60);
@@ -272,7 +247,6 @@ function pxToFraction(clientX, rect, inset = 0) {
   const ratio = (clientX - innerLeft) / innerWidth;
   return Math.min(Math.max(ratio, 0), 1);
 }
-var PDF_QUALITY = { "low": 0.6, "medium": 0.75, "high": 0.88, "very-high": 0.95 };
 function extensionForMimeType(mime) {
   const t = (mime || "").toLowerCase();
   if (t.includes("pdf")) return "pdf";
@@ -281,6 +255,36 @@ function extensionForMimeType(mime) {
   if (t.includes("matroska") || t.includes("mkv")) return "mkv";
   return "mp4";
 }
+
+// src/Controller.ts
+var ICONS = {
+  play: '<svg viewBox="0 0 16 16" width="16" height="16" fill="currentColor"><path d="M3 2 L13 8 L3 14 Z"/></svg>',
+  pause: '<svg viewBox="0 0 16 16" width="16" height="16" fill="currentColor"><rect x="3" y="2" width="3.5" height="12"/><rect x="9.5" y="2" width="3.5" height="12"/></svg>',
+  volumeOn: '<svg viewBox="0 0 16 16" width="16" height="16" fill="currentColor"><path d="M2 6 H5 L9 2 V14 L5 10 H2 Z"/><path d="M11 5 Q13 8 11 11" fill="none" stroke="currentColor" stroke-width="1.2"/><path d="M12.5 3.5 Q15.5 8 12.5 12.5" fill="none" stroke="currentColor" stroke-width="1.2"/></svg>',
+  volumeOff: '<svg viewBox="0 0 16 16" width="16" height="16" fill="currentColor"><path d="M2 6 H5 L9 2 V14 L5 10 H2 Z"/><path d="M11 5 L15 11 M15 5 L11 11" fill="none" stroke="currentColor" stroke-width="1.4"/></svg>',
+  download: '<svg viewBox="0 0 16 16" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M8 2 V11 M4 7 L8 11 L12 7 M3 13 H13"/></svg>',
+  fullscreenEnter: '<svg viewBox="0 0 16 16" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M2 6 V2 H6 M14 6 V2 H10 M2 10 V14 H6 M14 10 V14 H10"/></svg>',
+  present: '<svg viewBox="0 0 16 16" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M2 2.5 H14 V10.5 H2 Z M8 10.5 V13.5 M5 13.5 H11"/></svg>',
+  fullscreenExit: '<svg viewBox="0 0 16 16" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M6 2 V6 H2 M10 2 V6 H14 M6 14 V10 H2 M10 14 V10 H14"/></svg>'
+};
+var STYLE_ATTR = "data-movie-controller";
+var styleRefCount = 0;
+function installStyles() {
+  if (styleRefCount === 0) {
+    const el = document.createElement("style");
+    el.setAttribute(STYLE_ATTR, "");
+    el.textContent = CONTROLLER_CSS;
+    document.head.appendChild(el);
+  }
+  styleRefCount++;
+}
+function uninstallStyles() {
+  styleRefCount = Math.max(0, styleRefCount - 1);
+  if (styleRefCount === 0) {
+    document.head.querySelectorAll(`style[${STYLE_ATTR}]`).forEach((n) => n.remove());
+  }
+}
+var PDF_QUALITY = { "low": 0.6, "medium": 0.75, "high": 0.88, "very-high": 0.95 };
 var THEME_PROPERTIES = {
   accent: "--mc-accent",
   foreground: "--mc-fg",
@@ -289,6 +293,7 @@ var THEME_PROPERTIES = {
   trackHeight: "--mc-track-height",
   font: "--mc-font"
 };
+var CONTROLLER_OPTION_KEYS = ["canvas", "theme", "exportButton", "keyboard", "clickToPlay", "presentButton", "pauseAtStops", "className"];
 var Controller = class _Controller {
   movie;
   options;
@@ -331,6 +336,16 @@ var Controller = class _Controller {
   settingsOutsideHandler = null;
   onReady = null;
   presenter = null;
+  /** `pixi-effects/present`, loaded as soon as the movie has stops (a press of play must not wait for it). */
+  present = null;
+  presentLoading = null;
+  playStarting = false;
+  loadPresent() {
+    return this.presentLoading ??= import('./present.cjs').then((m) => this.present = m, (err) => {
+      this.presentLoading = null;
+      throw err;
+    });
+  }
   presentBtn = null;
   onFrame = null;
   onPlay = null;
@@ -356,13 +371,14 @@ var Controller = class _Controller {
     if (!options || !options.canvas) {
       throw new Error("Controller requires options.canvas (HTMLCanvasElement).");
     }
+    chunkTWZNOUM7_cjs.warnUnknownOptions("Controller", options, CONTROLLER_OPTION_KEYS);
     this.movie = movie;
     this.options = {
       canvas: options.canvas,
-      showExportButton: options.showExportButton ?? true,
-      enableKeyboardShortcuts: options.enableKeyboardShortcuts ?? true,
+      exportButton: options.exportButton ?? true,
+      keyboard: options.keyboard ?? true,
       clickToPlay: options.clickToPlay ?? true,
-      present: options.present ?? true,
+      presentButton: options.presentButton ?? true,
       pauseAtStops: options.pauseAtStops ?? true,
       className: options.className ?? "movie-controller"
     };
@@ -391,10 +407,10 @@ var Controller = class _Controller {
     this.bindExportPopover();
     this.bindFullscreen();
     this.bindVisibility();
-    if (this.options.enableKeyboardShortcuts) this.bindKeyboard();
+    if (this.options.keyboard) this.bindKeyboard();
   }
   buildBar() {
-    const popoverHtml = this.options.showExportButton ? `
+    const popoverHtml = this.options.exportButton ? `
       <div class="mc-settings-popover" role="dialog" aria-label="Export settings" data-open="false">
         <label class="mc-settings-row">
           <span>Format</span>
@@ -433,7 +449,7 @@ var Controller = class _Controller {
         </div>
         <span class="mc-time">0:00 / 0:00</span>
         <div class="mc-spacer"></div>
-        ${this.options.showExportButton ? `<button class="mc-btn mc-export" aria-label="Export" aria-expanded="false">${ICONS.download}</button>` : ""}
+        ${this.options.exportButton ? `<button class="mc-btn mc-export" aria-label="Export" aria-expanded="false">${ICONS.download}</button>` : ""}
         <button class="mc-btn mc-fullscreen" aria-label="Enter fullscreen">${ICONS.fullscreenEnter}</button>
       </div>
     `;
@@ -577,6 +593,8 @@ var Controller = class _Controller {
       this.presentBtn = null;
       return;
     }
+    this.loadPresent().catch(() => {
+    });
     const total = this.movie.totalFrames || 1;
     const holder = document.createElement("div");
     holder.className = "mc-stops";
@@ -588,7 +606,7 @@ var Controller = class _Controller {
       holder.appendChild(tick);
     }
     this.progressEl.appendChild(holder);
-    if (this.options.present && !this.presentBtn && this.fullscreenBtn) {
+    if (this.options.presentButton && !this.presentBtn && this.fullscreenBtn) {
       const btn = document.createElement("button");
       btn.className = "mc-btn mc-present";
       btn.setAttribute("aria-label", "Present");
@@ -633,13 +651,29 @@ var Controller = class _Controller {
   async startPlaying() {
     if (this.options.pauseAtStops && (this.movie.stops?.length ?? 0) > 0) {
       if (this.movie.currentFrame >= this.movie.totalFrames) await this.movie.gotoFrame(0, true);
-      await this.movie.next();
+      let present = this.present;
+      if (!present) {
+        if (this.playStarting) return;
+        this.playStarting = true;
+        try {
+          present = await this.loadPresent();
+        } catch (err) {
+          console.warn("pixi-effects: could not load pixi-effects/present, playing straight through:", err);
+        } finally {
+          this.playStarting = false;
+        }
+      }
+      if (!present) {
+        this.movie.play();
+        return;
+      }
+      await present.next(this.movie);
     } else this.movie.play();
   }
   /** Hand the page over to a Presenter (fullscreen, keys, click and swipe move through the stops); Escape gives it back. */
   async startPresenting() {
     if (this.presenter || this.destroyed) return;
-    const { Presenter } = await import('./Presenter.cjs');
+    const { Presenter } = await this.loadPresent();
     if (this.presenter || this.destroyed) return;
     const p = new Presenter(this.movie, { canvas: this.options.canvas, onExit: () => this.stopPresenting() });
     this.presenter = p;
@@ -937,7 +971,7 @@ var Controller = class _Controller {
       this.exportPages = { done: 0, total };
     } else this.showExportOverlay();
     try {
-      const blob = pdf ? await this.movie.exportPDF({
+      const blob = pdf ? await (await this.loadPresent()).exportPDF(this.movie, {
         which: this.exportFormat === "pdf-steps" ? "stops" : "pages",
         quality: PDF_QUALITY[this.exportQuality],
         onImage: () => this.pdfPageDone()
@@ -1219,12 +1253,6 @@ var Controller = class _Controller {
   }
 };
 
-exports.CONTROLLER_CSS = CONTROLLER_CSS;
 exports.Controller = Controller;
-exports.extensionForMimeType = extensionForMimeType;
-exports.formatTime = formatTime;
-exports.frameToPercent = frameToPercent;
-exports.pxToFraction = pxToFraction;
-exports.pxToFrame = pxToFrame;
 //# sourceMappingURL=Controller.cjs.map
 //# sourceMappingURL=Controller.cjs.map