@pixodesk/svg-animator-vue 1.0.34 → 1.0.39

package/dist/index.js

@@ -1,7 +1,7 @@
 var Vue = window.Vue; var PixodeskAnimatorWeb = window.PixodeskAnimator;
 
 // src/PixodeskSvgAnimator.ts
-import { camelCaseToKebabWordIfNeeded, createAnimator, generateNewIds, getNormalizedProps, STYLE_ATTR_NAMES } from "@pixodesk/svg-animator-web";
+import { camelCaseToKebabWordIfNeeded, createAnimator, createDiagnostics, generateNewIds, getNormalizedProps, STYLE_ATTR_NAMES, applyAnimatorConfig, foldTimelineOverride, getAnimatorConfig, PxControlMode, resolveControlMode, controlModeTakesOverTrigger, PxDiagnosticKind, progressToTimeMs, DEFAULT_DURATION_MS } from "@pixodesk/svg-animator-web";
 import {
   computed,
   defineComponent,
@@ -11,7 +11,8 @@ import {
   shallowRef,
   watch
 } from "vue";
-function createVueAdapter(elementRefs) {
+var VUE_PROP = { ref: "ref" };
+function createVueAdapter(elementRefs, diag) {
   const warnedSelectors = /* @__PURE__ */ new Set();
   const adapter = {
     isConnected: () => true,
@@ -20,7 +21,7 @@ function createVueAdapter(elementRefs) {
       const element = elementRefs.get(id);
       if (!element && !warnedSelectors.has(id)) {
         warnedSelectors.add(id);
-        console.warn('setAttribute: No elements found for id "' + id + '"');
+        diag.warn(PxDiagnosticKind.host, 'setAttribute: No elements found for id "' + id + '"');
       }
       if (element) {
         element.setAttribute(attrName, value);
@@ -32,62 +33,31 @@ function createVueAdapter(elementRefs) {
   };
   return adapter;
 }
-function applyDocOverrides(doc, props, compMode) {
-  if (compMode !== "autoplay" /* autoplay */) {
-    const docStartOn = doc.animator?.trigger?.startOn;
-    if (docStartOn && docStartOn !== "programmatic") {
-      doc = {
-        ...doc,
-        animator: {
-          ...doc.animator,
-          trigger: { ...doc.animator?.trigger, startOn: "programmatic" }
-        }
-      };
+function applyDocOverrides(doc, props, compMode, diag) {
+  const { timeline, resetTimeline, duration, delay, iterations, startOn } = props;
+  const patch = foldTimelineOverride(timeline, { duration, delay, iterations, startOn });
+  const fullPatch = controlModeTakesOverTrigger(compMode) ? {
+    ...patch ?? {},
+    timeline: {
+      ...patch?.timeline ?? {},
+      trigger: { ...patch?.timeline?.trigger ?? {}, startOn: "programmatic" }
     }
-  }
-  const { mode, duration, delay, iterations, fill, direction, frameRate } = props;
-  if (mode !== void 0 || duration !== void 0 || delay !== void 0 || iterations !== void 0 || fill !== void 0 || direction !== void 0 || frameRate !== void 0) {
-    const animator = doc.animator || {};
-    doc = {
-      ...doc,
-      animator: {
-        ...animator,
-        mode: mode !== void 0 ? mode : animator.mode,
-        duration: duration !== void 0 ? duration : animator.duration,
-        delay: delay !== void 0 ? delay : animator.delay,
-        iterations: iterations !== void 0 ? iterations : animator.iterations,
-        fill: fill !== void 0 ? fill : animator.fill,
-        direction: direction !== void 0 ? direction : animator.direction,
-        frameRate: frameRate !== void 0 ? frameRate : animator.frameRate
-      }
-    };
-  }
-  const { startOn, outAction, scrollIntoViewThreshold } = props;
-  if (startOn !== void 0 || outAction !== void 0 || scrollIntoViewThreshold !== void 0) {
-    const trigger = doc.animator?.trigger || {};
-    doc = {
-      ...doc,
-      animator: {
-        ...doc.animator,
-        trigger: {
-          ...trigger,
-          startOn: startOn !== void 0 ? startOn : trigger.startOn,
-          outAction: outAction !== void 0 ? outAction : trigger.outAction,
-          scrollIntoViewThreshold: scrollIntoViewThreshold !== void 0 ? scrollIntoViewThreshold : trigger.scrollIntoViewThreshold
-        }
-      }
-    };
+  } : patch;
+  if (fullPatch !== void 0 || resetTimeline) {
+    const applied = applyAnimatorConfig(doc, fullPatch ?? {}, { resetDefaults: !!resetTimeline });
+    for (const w of applied.warnings) diag.warn(PxDiagnosticKind.usage, "timeline override: " + w);
+    doc = applied.doc;
   }
   return doc;
 }
 function calcSeekMs(doc, props) {
   let seekMs;
-  const animator = doc.animator || {};
+  const animator = getAnimatorConfig(doc) || {};
   if (props.progress !== void 0) {
     const iterationsValue = props.iterations ?? animator.iterations;
-    const iterationsCount = typeof iterationsValue === "number" && iterationsValue >= 1 ? iterationsValue : 1;
-    const singleDuration = props.duration ?? animator.duration ?? 1e3;
-    seekMs = props.progress * singleDuration * iterationsCount;
+    const iterationsCount = iterationsValue === "infinite" ? Infinity : typeof iterationsValue === "number" && iterationsValue >= 1 ? iterationsValue : 1;
+    const singleDuration = props.duration ?? animator.duration ?? DEFAULT_DURATION_MS;
+    seekMs = progressToTimeMs(props.progress, singleDuration, iterationsCount);
   }
   if (props.time !== void 0) seekMs = props.time;
   return seekMs;
@@ -97,48 +67,63 @@ var PixodeskSvgAnimator = defineComponent({
   props: {
     // -- Source
     doc: { type: Object, required: true },
-    // -- Rendering mode
-    mode: { type: String },
-    // -- Timing overrides
+    // -- Playback override: the document's `timeline` block as a patch (or a JSON string),
+    //    plus the four shortcuts people reach for most. The same names as React / RN.
+    timeline: { type: [Object, String] },
+    resetTimeline: { type: Boolean, default: void 0 },
+    duration: { type: Number },
     delay: { type: Number },
-    fill: { type: String },
     iterations: { type: [Number, String] },
-    duration: { type: Number },
-    direction: { type: String },
-    frameRate: { type: Number },
-    // -- Trigger overrides
     startOn: { type: String },
-    outAction: { type: String },
-    scrollIntoViewThreshold: { type: Number },
     // -- Declarative control
     autoplay: { type: Boolean, default: void 0 },
     play: { type: Boolean, default: void 0 },
     pause: { type: Boolean, default: void 0 },
     // -- Controlled time
     progress: { type: Number },
-    time: { type: Number }
+    time: { type: Number },
+    // -- Diagnostics (API review §5).
+    //    Function PROPS, not emits, on purpose: an emit handler always exists, so wiring
+    //    these to `emit` would permanently suppress the console fallback for anyone who
+    //    never listens. As props, "not given" really is undefined and the console still
+    //    speaks by default — the same contract as React and React Native.
+    onWarn: { type: Function },
+    onError: { type: Function },
+    //    `silent` takes `true` or just the kinds to quiet, so `platform` chatter can be
+    //    silenced while `document` problems still speak.
+    silent: { type: [Boolean, Array], default: void 0 }
   },
   emits: ["play", "stop", "pause", "cancel", "finish", "remove"],
   setup(props, { expose, emit }) {
     const elementRefs = /* @__PURE__ */ new Map();
     const apiRef = shallowRef(null);
-    const compMode = computed(() => {
-      if (props.autoplay) return "autoplay" /* autoplay */;
-      if (props.progress !== void 0 || props.time !== void 0) return "fixedTime" /* fixedTime */;
-      if (props.play !== void 0 || props.pause !== void 0) return "play" /* play */;
-      return "static" /* static */;
-    });
+    const makeDiag = () => createDiagnostics(
+      { onWarn: props.onWarn, onError: props.onError, silent: props.silent },
+      "[PixodeskSvgAnimator]"
+    );
+    const resolvedMode = computed(() => resolveControlMode({
+      progress: props.progress,
+      time: props.time,
+      play: props.play,
+      pause: props.pause,
+      autoplay: props.autoplay
+    }));
+    const compMode = computed(() => resolvedMode.value.mode);
+    watch(resolvedMode, (r) => {
+      const diag = makeDiag();
+      for (const w of r.warnings) diag.warn(PxDiagnosticKind.usage, w);
+    }, { immediate: true });
     const resolvedDoc = computed(() => {
       let doc = generateNewIds(props.doc);
-      return applyDocOverrides(doc, props, compMode.value);
+      return applyDocOverrides(doc, props, compMode.value, makeDiag());
     });
     function renderNode(node) {
       if (!node) return null;
       const { type, animate, meta, children, ...attrs } = node;
       const normProps = getNormalizedProps(attrs);
-      if (node["id"]) {
-        const nodeId = node["id"];
-        normProps["ref"] = (el) => {
+      if (node.id) {
+        const nodeId = node.id;
+        normProps[VUE_PROP.ref] = (el) => {
           if (el) {
             elementRefs.set(nodeId, el);
           } else {
@@ -147,32 +132,27 @@ var PixodeskSvgAnimator = defineComponent({
         };
       }
       const childVNodes = children?.map((child) => renderNode(child)).filter(Boolean);
-      return h(type, normProps, childVNodes);
+      const text = typeof node.textContent === "string" ? node.textContent : void 0;
+      return h(type, normProps, childVNodes?.length ? childVNodes : text);
     }
     function createApi() {
       destroyApi();
       const doc = resolvedDoc.value;
       if (!doc) return;
-      const callbacks = {
+      apiRef.value = createAnimator({
+        doc,
+        adapter: createVueAdapter(elementRefs, makeDiag()),
         onPlay: () => emit("play"),
-        onPause: () => {
-          emit("pause");
-          emit("stop");
-        },
-        onCancel: () => {
-          emit("cancel");
-          emit("stop");
-        },
-        onFinish: () => {
-          emit("finish");
-          emit("stop");
-        },
-        onRemove: () => {
-          emit("remove");
-          emit("stop");
-        }
-      };
-      apiRef.value = createAnimator({ data: doc, adapter: createVueAdapter(elementRefs), callbacks });
+        onPause: () => emit("pause"),
+        onCancel: () => emit("cancel"),
+        onFinish: () => emit("finish"),
+        onRemove: () => emit("remove"),
+        onStop: () => emit("stop"),
+        // The player's own diagnostics reach the same handlers as the component's.
+        onWarn: props.onWarn,
+        onError: props.onError,
+        silent: props.silent
+      });
       syncPlayState();
       applySeek();
     }
@@ -181,19 +161,19 @@ var PixodeskSvgAnimator = defineComponent({
       apiRef.value = null;
     }
     function syncPlayState() {
-      if (compMode.value !== "play" /* play */) return;
+      if (compMode.value !== PxControlMode.play) return;
       if (props.play && !props.pause) {
         apiRef.value?.play();
       } else if (props.pause) {
         apiRef.value?.pause();
       } else if (props.play === false) {
-        apiRef.value?.finish();
+        apiRef.value?.pause();
       } else {
         apiRef.value?.play();
       }
     }
     function applySeek() {
-      if (compMode.value !== "fixedTime" /* fixedTime */) return;
+      if (compMode.value !== PxControlMode.fixedTime) return;
       const doc = resolvedDoc.value;
       if (!doc) return;
       const seekMs = calcSeekMs(doc, props);
@@ -217,7 +197,9 @@ var PixodeskSvgAnimator = defineComponent({
       finish: () => apiRef.value?.finish(),
       setPlaybackRate: (rate) => apiRef.value?.setPlaybackRate(rate),
       getCurrentTime: () => apiRef.value?.getCurrentTime() ?? null,
-      setCurrentTime: (time) => apiRef.value?.setCurrentTime(time)
+      setCurrentTime: (time) => apiRef.value?.setCurrentTime(time),
+      getCurrentProgress: () => apiRef.value?.getCurrentProgress() ?? null,
+      setCurrentProgress: (progress) => apiRef.value?.setCurrentProgress(progress)
     };
     expose(publicApi);
     return () => {
@@ -229,13 +211,15 @@ var PixodeskSvgAnimator = defineComponent({
 var PixodeskSvgAnimator_default = PixodeskSvgAnimator;
 
 // src/PixodeskSvgCssAnimator.ts
+import { PX_TRIGGER_DEFAULTS } from "@pixodesk/svg-animator-web";
 import { computed as computed2, defineComponent as defineComponent2, h as h2, onMounted as onMounted2, onUnmounted as onUnmounted2, ref as ref2, useAttrs } from "vue";
 var PixodeskSvgCssAnimator = defineComponent2({
   name: "PixodeskSvgCssAnimator",
   inheritAttrs: false,
   props: {
     startOn: { type: String, default: "load" },
-    outAction: { type: String, default: "continue" }
+    outAction: { type: String, default: "continue" },
+    scrollIntoViewThreshold: { type: Number, default: PX_TRIGGER_DEFAULTS.scrollIntoViewThreshold }
   },
   setup(props, { slots }) {
     const attrs = useAttrs();
@@ -250,11 +234,13 @@ var PixodeskSvgCssAnimator = defineComponent2({
       const el = divRef.value;
       if (!el) return;
       const outState = props.outAction === "reset" ? "idle" : props.outAction === "pause" ? "paused" : "playing";
+      const threshold = props.scrollIntoViewThreshold;
+      const visible = (entry) => threshold > 0 ? entry.intersectionRatio >= threshold : entry.isIntersecting;
       const observer = new IntersectionObserver(
         ([entry]) => {
-          state.value = entry.isIntersecting ? "playing" : outState;
+          state.value = visible(entry) ? "playing" : outState;
         },
-        { threshold: 0.1 }
+        { threshold }
       );
       observer.observe(el);
       observerCleanup = () => observer.disconnect();

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/PixodeskSvgAnimator.ts","../src/PixodeskSvgCssAnimator.ts"],"sourcesContent":["/*---------------------------------------------------------------------------------------\n * Copyright (c) Pixodesk LTD.\n * Licensed under the MIT License. See the LICENSE file in the project root for details.\n *---------------------------------------------------------------------------------------*/\n\nimport type { PxAnimatedSvgDocument, PxAnimatorAPI, PxNode, PxPlatformAdapter, PxTrigger } from '@pixodesk/svg-animator-web';\nimport { camelCaseToKebabWordIfNeeded, createAnimator, FillMode, generateNewIds, getNormalizedProps, STYLE_ATTR_NAMES } from '@pixodesk/svg-animator-web';\nimport {\n    computed, defineComponent, h, onMounted, onUnmounted, ref, shallowRef, type PropType, type VNode,\n    watch,\n} from 'vue';\n\n\n// -- Public types -----------------------------------------------------------\n\nexport interface VueAnimatorApi {\n    /** Returns true if the animation is currently running. */\n    isPlaying(): boolean;\n\n    /** Starts or resumes the animation. */\n    play(): void;\n\n    /** Pauses the animation at its current state. */\n    pause(): void;\n\n    /** Stops the animation and resets it to its initial state. */\n    cancel(): void;\n\n    /** Jumps to the end of the animation and holds the final state. */\n    finish(): void;\n\n    /** Changes the speed of the animation. 1 is normal, 2 is double, -1 is reverse. */\n    setPlaybackRate(rate: number): void;\n\n    /** Returns the current playback time in milliseconds. */\n    getCurrentTime(): number | null;\n\n    /** Jumps to a specific time (in milliseconds) in the animation. */\n    setCurrentTime(time: number): void;\n}\n\n\n// -- Internal types ---------------------------------------------------------\n\nenum CompMode {\n    static = 'static',\n    autoplay = 'autoplay',\n    play = 'play',\n    fixedTime = 'fixedTime'\n}\n\n\n// -- Vue ↔ Animator bridge --------------------------------------------------\n\n/**\n * Creates a platform adapter that routes animator attribute updates\n * to the corresponding Vue-managed DOM element refs.\n */\nfunction createVueAdapter(elementRefs: Map<string, Element>) {\n    const warnedSelectors = new Set<string>();\n\n    const adapter: PxPlatformAdapter = {\n        isConnected: () => true,\n        setAttribute: (id, attrName, value) => {\n            attrName = camelCaseToKebabWordIfNeeded(attrName);\n\n            const element = elementRefs.get(id);\n\n            if (!element && !warnedSelectors.has(id)) {\n                warnedSelectors.add(id);\n                console.warn('setAttribute: No elements found for id \"' + id + '\"');\n            }\n\n            if (element) {\n                element.setAttribute(attrName, value);\n                if (STYLE_ATTR_NAMES.has(attrName)) {\n                    (element as HTMLElement).style[attrName as any] = value;\n                }\n            }\n        },\n    };\n    return adapter;\n}\n\n// FIXME: add model validation (e.g. isElementFileJson check)\n\n\n// -- Helper: apply doc overrides --------------------------------------------\n\ninterface DocOverrideProps {\n    mode?: 'waapi' | 'frames' | 'auto';\n    delay?: number;\n    fill?: FillMode;\n    iterations?: number | 'infinite';\n    duration?: number;\n    direction?: PlaybackDirection;\n    frameRate?: number;\n    startOn?: 'load' | 'mouseOver' | 'click' | 'scrollIntoView' | 'programmatic';\n    outAction?: 'continue' | 'pause' | 'reset' | 'reverse';\n    scrollIntoViewThreshold?: number;\n    progress?: number;\n    time?: number;\n}\n\nfunction applyDocOverrides(\n    doc: PxAnimatedSvgDocument,\n    props: DocOverrideProps,\n    compMode: CompMode,\n): PxAnimatedSvgDocument {\n\n    // In non-autoplay modes, override the document trigger to 'programmatic'\n    // so the component can manage playback itself.\n    if (compMode !== CompMode.autoplay) {\n        const docStartOn = doc.animator?.trigger?.startOn;\n        if (docStartOn && docStartOn !== 'programmatic') { // FIXME: use enum\n            doc = {\n                ...doc,\n                animator: {\n                    ...doc.animator,\n                    trigger: { ...doc.animator?.trigger, startOn: 'programmatic' }\n                }\n            };\n        }\n    }\n\n    // Apply timing overrides from props onto the document config.\n    const { mode, duration, delay, iterations, fill, direction, frameRate } = props;\n    if (\n        mode !== undefined || duration !== undefined || delay !== undefined ||\n        iterations !== undefined || fill !== undefined || direction !== undefined ||\n        frameRate !== undefined\n    ) {\n        const animator = doc.animator || {};\n        doc = {\n            ...doc,\n            animator: {\n                ...animator,\n                mode: mode !== undefined ? mode : animator.mode,\n                duration: duration !== undefined ? duration : animator.duration,\n                delay: delay !== undefined ? delay : animator.delay,\n                iterations: iterations !== undefined ? iterations : animator.iterations,\n                fill: fill !== undefined ? fill : animator.fill,\n                direction: direction !== undefined ? direction : animator.direction,\n                frameRate: frameRate !== undefined ? frameRate : animator.frameRate,\n            }\n        };\n    }\n\n    // Apply trigger overrides from props.\n    const { startOn, outAction, scrollIntoViewThreshold } = props;\n    if (startOn !== undefined || outAction !== undefined || scrollIntoViewThreshold !== undefined) {\n        const trigger: PxTrigger = doc.animator?.trigger || {};\n        doc = {\n            ...doc,\n            animator: {\n                ...doc.animator,\n                trigger: {\n                    ...trigger,\n                    startOn: startOn !== undefined ? startOn : trigger.startOn,\n                    outAction: outAction !== undefined ? outAction : trigger.outAction,\n                    scrollIntoViewThreshold: scrollIntoViewThreshold !== undefined ? scrollIntoViewThreshold : trigger.scrollIntoViewThreshold,\n                }\n            }\n        };\n    }\n\n    return doc;\n}\n\n/**\n * Controlled-time mode: absolute seek target in ms. `progress` is a fraction\n * (0–1) of the WHOLE timeline (duration × iterations); `time` is absolute.\n * Applied through the animator API (setCurrentTime) so scrubbing does NOT\n * recreate the animator.\n */\nfunction calcSeekMs(doc: PxAnimatedSvgDocument, props: DocOverrideProps): number | undefined {\n    let seekMs: number | undefined;\n    const animator = doc.animator || {};\n    if (props.progress !== undefined) {\n        const iterationsValue = props.iterations ?? animator.iterations;\n        const iterationsCount = typeof iterationsValue === 'number' && iterationsValue >= 1 ? iterationsValue : 1;\n        const singleDuration = props.duration ?? animator.duration ?? 1000; // engine default duration\n        seekMs = props.progress * singleDuration * iterationsCount;\n    }\n    if (props.time !== undefined) seekMs = props.time;\n    return seekMs;\n}\n\n\n// -- Main public component --------------------------------------------------\n\n/**\n * Vue component for rendering and controlling Pixodesk SVG animations.\n *\n * Supports four mutually-exclusive control modes:\n *\n * 1. **Autoplay** – uses triggers from the animation document.\n *    ```vue\n *    <PixodeskSvgAnimator :doc=\"animation\" autoplay />\n *    ```\n *\n * 2. **Declarative play/pause** – controlled via boolean props.\n *    ```vue\n *    <PixodeskSvgAnimator :doc=\"animation\" play :pause=\"false\" />\n *    ```\n *\n * 3. **Imperative** – exposes a ref-based API for full programmatic control.\n *    ```vue\n *    <PixodeskSvgAnimator :doc=\"animation\" ref=\"animator\" />\n *    <button @click=\"$refs.animator.play()\">Play</button>\n *    ```\n *\n * 4. **Controlled time** – renders a single frame at a given time.\n *    ```vue\n *    <PixodeskSvgAnimator :doc=\"animation\" :progress=\"0.5\" />\n *    <PixodeskSvgAnimator :doc=\"animation\" :time=\"500\" />\n *    ```\n */\nconst PixodeskSvgAnimator = defineComponent({\n    name: 'PixodeskSvgAnimator',\n\n    props: {\n        // -- Source\n        doc: { type: Object as PropType<PxAnimatedSvgDocument>, required: true },\n\n        // -- Rendering mode\n        mode: { type: String as PropType<'waapi' | 'frames' | 'auto'> },\n\n        // -- Timing overrides\n        delay: { type: Number },\n        fill: { type: String as PropType<FillMode> },\n        iterations: { type: [Number, String] as PropType<number | 'infinite'> },\n        duration: { type: Number },\n        direction: { type: String as PropType<PlaybackDirection> },\n        frameRate: { type: Number },\n\n        // -- Trigger overrides\n        startOn: { type: String as PropType<'load' | 'mouseOver' | 'click' | 'scrollIntoView' | 'programmatic'> },\n        outAction: { type: String as PropType<'continue' | 'pause' | 'reset' | 'reverse'> },\n        scrollIntoViewThreshold: { type: Number },\n\n        // -- Declarative control\n        autoplay: { type: Boolean, default: undefined },\n        play: { type: Boolean, default: undefined },\n        pause: { type: Boolean, default: undefined },\n\n        // -- Controlled time\n        progress: { type: Number },\n        time: { type: Number },\n    },\n\n    emits: ['play', 'stop', 'pause', 'cancel', 'finish', 'remove'],\n\n    setup(props, { expose, emit }) {\n        const elementRefs = new Map<string, Element>();\n        const apiRef = shallowRef<PxAnimatorAPI | null>(null);\n\n        // -- Determine control mode ---------------------------------------------\n\n        const compMode = computed<CompMode>(() => {\n            if (props.autoplay) return CompMode.autoplay;\n            if (props.progress !== undefined || props.time !== undefined) return CompMode.fixedTime;\n            if (props.play !== undefined || props.pause !== undefined) return CompMode.play;\n            return CompMode.static;\n        });\n\n        // -- Prepare the document with overrides --------------------------------\n\n        const resolvedDoc = computed(() => {\n            let doc = generateNewIds(props.doc);\n            return applyDocOverrides(doc, props, compMode.value);\n        });\n\n        // -- Render the SVG node tree -------------------------------------------\n\n        function renderNode(node: PxNode | undefined): VNode | null {\n            if (!node) return null;\n\n            const { type, animate, meta, children, ...attrs } = node;\n            const normProps = getNormalizedProps(attrs);\n\n            // Capture a ref to each element with an id.\n            if (node['id']) {\n                const nodeId = node['id'];\n                normProps['ref'] = (el: Element | null) => {\n                    if (el) {\n                        elementRefs.set(nodeId, el);\n                    } else {\n                        elementRefs.delete(nodeId);\n                    }\n                };\n            }\n\n            const childVNodes = children?.map(child => renderNode(child)).filter(Boolean) as VNode[] | undefined;\n            return h(type, normProps, childVNodes);\n        }\n\n        // -- Animator lifecycle -------------------------------------------------\n\n        function createApi() {\n            destroyApi();\n            const doc = resolvedDoc.value;\n            if (!doc) return;\n\n            // Route animator lifecycle events to Vue component events.\n            // `stop` fires alongside any event that halts playback.\n            const callbacks = {\n                onPlay:   () => emit('play'),\n                onPause:  () => { emit('pause');  emit('stop'); },\n                onCancel: () => { emit('cancel'); emit('stop'); },\n                onFinish: () => { emit('finish'); emit('stop'); },\n                onRemove: () => { emit('remove'); emit('stop'); },\n            };\n\n            apiRef.value = createAnimator({ data: doc, adapter: createVueAdapter(elementRefs), callbacks });\n\n            // (Re)apply the declarative control state to the fresh animator —\n            // covers both the initial mount (e.g. `:play=\"true\"` from the\n            // start) and doc swaps.\n            syncPlayState();\n            applySeek();\n        }\n\n        function destroyApi() {\n            apiRef.value?.destroy();\n            apiRef.value = null;\n        }\n\n        /** Declarative play/pause → animator calls. */\n        function syncPlayState() {\n            if (compMode.value !== CompMode.play) return;\n            if (props.play && !props.pause) {\n                apiRef.value?.play();\n            } else if (props.pause) {\n                apiRef.value?.pause();\n            } else if (props.play === false) {\n                // explicit play=false → jump to the end state\n                apiRef.value?.finish();\n            } else {\n                // pause-only usage: pause switched off → resume\n                apiRef.value?.play();\n            }\n        }\n\n        /** Controlled-time mode: seek through the animator API (no recreate). */\n        function applySeek() {\n            if (compMode.value !== CompMode.fixedTime) return;\n            const doc = resolvedDoc.value;\n            if (!doc) return;\n            const seekMs = calcSeekMs(doc, props);\n            if (seekMs !== undefined) {\n                apiRef.value?.setCurrentTime(seekMs);\n                apiRef.value?.pause();\n            }\n        }\n\n        // Create the animator once DOM refs are available.\n        onMounted(() => createApi());\n\n        // Recreate the animator when the resolved doc changes.\n        // `flush: 'post'` — the animator must be created AFTER the DOM is\n        // patched, otherwise the new root element isn't in the document yet\n        // and trigger setup fails (autoplay would never resume after a doc swap).\n        watch(resolvedDoc, () => createApi(), { flush: 'post' });\n\n        // Sync declarative play/pause props with the animator.\n        watch([compMode, () => props.play, () => props.pause], () => syncPlayState());\n\n        // Scrubbing progress/time only seeks — the animator is NOT recreated.\n        watch([compMode, () => props.progress, () => props.time], () => applySeek());\n\n        onUnmounted(() => {\n            destroyApi();\n        });\n\n        // -- Expose imperative API ----------------------------------------------\n\n        const publicApi: VueAnimatorApi = {\n            isPlaying: () => apiRef.value?.isPlaying() || false,\n            play: () => apiRef.value?.play(),\n            pause: () => apiRef.value?.pause(),\n            cancel: () => apiRef.value?.cancel(),\n            finish: () => apiRef.value?.finish(),\n            setPlaybackRate: (rate: number) => apiRef.value?.setPlaybackRate(rate),\n            getCurrentTime: () => apiRef.value?.getCurrentTime() ?? null,\n            setCurrentTime: (time: number) => apiRef.value?.setCurrentTime(time),\n        };\n\n        expose(publicApi);\n\n        // -- Render -------------------------------------------------------------\n\n        return () => {\n            const doc = resolvedDoc.value;\n            return doc ? renderNode(doc) : null;\n        };\n    },\n});\n\nexport default PixodeskSvgAnimator;\n","/*---------------------------------------------------------------------------------------\n * Copyright (c) Pixodesk LTD.\n * Licensed under the MIT License. See the LICENSE file in the project root for details.\n *---------------------------------------------------------------------------------------*/\n\nimport { OutAction, StartOn } from \"@pixodesk/svg-animator-web\";\nimport { computed, defineComponent, h, onMounted, onUnmounted, ref, useAttrs, type PropType } from 'vue';\n\n\ntype AnimState = 'idle' | 'paused' | 'playing';\n\n\n/**\n * Controls playback of a SVG+CSS animated file by toggling class names on a wrapper div.\n *\n * Intended for use with SVG files exported from the Pixodesk editor using the\n * **CSS Keyframes** flavor (no `<script>` tag). Import the SVG as a Vue component\n * via `vite-svg-loader` and pass it as the default slot:\n *\n * ```vue\n * <script setup>\n * import AnimationSvg from './animation.svg'; // vite-svg-loader\n * </script>\n *\n * <template>\n *   <PixodeskSvgCssAnimator startOn=\"mouseOver\" outAction=\"pause\">\n *     <AnimationSvg />\n *   </PixodeskSvgCssAnimator>\n * </template>\n * ```\n *\n * The wrapper div carries one of three animation states via CSS class names:\n * - *(no class)*                       — idle, animation not started\n * - `px-anim-enabled`                  — started but paused\n * - `px-anim-enabled px-anim-playing`  — actively playing\n *\n * @prop startOn   - What triggers the animation to start:\n *   - `'load'`           — plays immediately on mount (default)\n *   - `'mouseOver'`      — plays on hover\n *   - `'click'`          — plays on click, toggles on second click\n *   - `'scrollIntoView'` — plays when the element enters the viewport\n * @prop outAction - What happens when the trigger ends (hover/scroll out, second click):\n *   - `'continue'` — keeps playing (default)\n *   - `'pause'`    — pauses at the current frame\n *   - `'reset'`    — resets to the beginning\n */\nconst PixodeskSvgCssAnimator = defineComponent({\n    name: 'PixodeskSvgCssAnimator',\n\n    inheritAttrs: false,\n\n    props: {\n        startOn:   { type: String as PropType<StartOn>,   default: 'load' },\n        outAction: { type: String as PropType<OutAction>, default: 'continue' },\n    },\n\n    setup(props, { slots }) {\n        const attrs = useAttrs();\n        const state = ref<AnimState>(props.startOn === 'load' ? 'playing' : 'idle');\n        const divRef = ref<HTMLDivElement | null>(null);\n\n        const goOut = () => {\n            state.value =\n                props.outAction === 'reset' ? 'idle' :\n                props.outAction === 'pause' ? 'paused' : 'playing';\n        };\n\n        let observerCleanup: (() => void) | undefined;\n\n        onMounted(() => {\n            if (props.startOn !== 'scrollIntoView') return;\n            const el = divRef.value;\n            if (!el) return;\n            const outState: AnimState =\n                props.outAction === 'reset' ? 'idle' :\n                props.outAction === 'pause' ? 'paused' : 'playing';\n            const observer = new IntersectionObserver(\n                ([entry]) => { state.value = entry.isIntersecting ? 'playing' : outState; },\n                { threshold: 0.1 }\n            );\n            observer.observe(el);\n            observerCleanup = () => observer.disconnect();\n        });\n\n        onUnmounted(() => observerCleanup?.());\n\n        const animClass = computed(() =>\n            state.value === 'playing' ? 'px-anim-enabled px-anim-playing' :\n            state.value === 'paused'  ? 'px-anim-enabled' : ''\n        );\n\n        const handlers = computed(() =>\n            props.startOn === 'mouseOver' ? {\n                onMouseenter: () => { state.value = 'playing'; },\n                onMouseleave: goOut,\n            } :\n            props.startOn === 'click' ? {\n                onClick: () => state.value === 'playing' ? goOut() : (state.value = 'playing'),\n            } : {}\n        );\n\n        return () => h('div', {\n            ref: divRef,\n            ...attrs,\n            class: [attrs.class, animClass.value],\n            ...handlers.value,\n        }, slots.default?.());\n    },\n});\n\nexport default PixodeskSvgCssAnimator;\n"],"mappings":"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","names":["computed","defineComponent","h","onMounted","onUnmounted","ref"]}
+{"version":3,"sources":["../src/PixodeskSvgAnimator.ts","../src/PixodeskSvgCssAnimator.ts"],"sourcesContent":["/*---------------------------------------------------------------------------------------\n * Copyright (c) Pixodesk LTD.\n * Licensed under the MIT License. See the LICENSE file in the project root for details.\n *---------------------------------------------------------------------------------------*/\n\nimport type { PxAnimatedSvgDocument, PxAnimatorAPI, PxNode, PxPlatformAdapter, PxTimelineEngineExtra, PxTimelinePatch, PxTrigger } from '@pixodesk/svg-animator-web';\nimport { camelCaseToKebabWordIfNeeded, createAnimator, createDiagnostics, generateNewIds, getNormalizedProps, STYLE_ATTR_NAMES, applyAnimatorConfig, foldTimelineOverride, getAnimatorConfig, PxControlMode, resolveControlMode, controlModeTakesOverTrigger, PxDiagnosticKind, progressToTimeMs, DEFAULT_DURATION_MS, type PxAnimatorHandle, type PxControlProps, type PxPlaybackOverrideProps, type PxDiagnostic, type PxDiagnostics } from '@pixodesk/svg-animator-web';\nimport {\n    computed, defineComponent, h, onMounted, onUnmounted, ref, shallowRef, type PropType, type VNode,\n    watch,\n} from 'vue';\n\n\n// -- Public types -----------------------------------------------------------\n\n/** Vue's own prop names on the vnode — not wire keys. See the React twin. */\nconst VUE_PROP = { ref: 'ref' } as const;\n\n/**\n * The imperative handle the template ref exposes — core's `PxAnimatorHandle` under this\n * package's name (review §9). One definition for React, Vue and React Native.\n */\nexport type VueAnimatorApi = PxAnimatorHandle;\n\n\n// -- Internal types ---------------------------------------------------------\n\n// The control mode is core's `PxControlMode`, shared with React and React Native\n// (API review §1/§7) — one precedence rule, one set of conflict warnings.\n\n\n// -- Vue ↔ Animator bridge --------------------------------------------------\n\n/**\n * Creates a platform adapter that routes animator attribute updates\n * to the corresponding Vue-managed DOM element refs.\n */\nfunction createVueAdapter(elementRefs: Map<string, Element>, diag: PxDiagnostics) {\n    const warnedSelectors = new Set<string>();\n\n    const adapter: PxPlatformAdapter = {\n        isConnected: () => true,\n        setAttribute: (id, attrName, value) => {\n            attrName = camelCaseToKebabWordIfNeeded(attrName);\n\n            const element = elementRefs.get(id);\n\n            if (!element && !warnedSelectors.has(id)) {\n                warnedSelectors.add(id);\n                diag.warn(PxDiagnosticKind.host, 'setAttribute: No elements found for id \"' + id + '\"');\n            }\n\n            if (element) {\n                element.setAttribute(attrName, value);\n                if (STYLE_ATTR_NAMES.has(attrName)) {\n                    (element as HTMLElement).style[attrName as any] = value;\n                }\n            }\n        },\n    };\n    return adapter;\n}\n\n// FIXME: add model validation (e.g. isElementFileJson check)\n\n\n// -- Helper: apply doc overrides --------------------------------------------\n\n/**\n * What `applyDocOverrides` / `calcSeekMs` read off the props — core's shared shapes, not a local\n * copy (review §9). The runtime `props: {…}` block below stays Vue's own, because Vue needs\n * runtime prop declarations; this is only the TypeScript view of the same members.\n */\ntype DocOverrideProps = PxPlaybackOverrideProps & Pick<PxControlProps, 'progress' | 'time'>;\n\nfunction applyDocOverrides(\n    doc: PxAnimatedSvgDocument,\n    props: DocOverrideProps,\n    compMode: PxControlMode,\n    diag: PxDiagnostics,\n): PxAnimatedSvgDocument {\n\n    // ONE patch, applied ONCE: the props, plus the component's own need to take the trigger\n    // over in the non-autoplay control modes.\n    //\n    // This replaces three hand-rolled spread blocks that wrote the FLAT runtime keys. On a\n    // wire-format document — which is what every writer emits — `flattenAnimatorTimeline`\n    // overwrote them from `timeline` immediately afterwards, so the overrides were silently\n    // discarded. See PLAYBACK-OVERRIDE-PLAN.md §1.1.\n    const { timeline, resetTimeline, duration, delay, iterations, startOn } = props;\n    const patch = foldTimelineOverride(timeline, { duration, delay, iterations, startOn });\n    const fullPatch: any = controlModeTakesOverTrigger(compMode)\n        ? {\n            ...(patch ?? {}),\n            timeline: {\n                ...((patch as any)?.timeline ?? {}),\n                trigger: { ...((patch as any)?.timeline?.trigger ?? {}), startOn: 'programmatic' },\n            },\n        }\n        : patch;\n\n    if (fullPatch !== undefined || resetTimeline) {\n        const applied = applyAnimatorConfig(doc, fullPatch ?? {}, { resetDefaults: !!resetTimeline });\n        for (const w of applied.warnings) diag.warn(PxDiagnosticKind.usage, 'timeline override: ' + w);\n        doc = applied.doc;\n    }\n\n    return doc;\n}\n\n/**\n * Controlled-time mode: absolute seek target in ms. `progress` is a fraction\n * (0–1) of the WHOLE timeline (duration × iterations — ONE iteration when\n * endless); `time` is absolute. Applied through the animator API\n * (setCurrentTime) so scrubbing does NOT recreate the animator.\n */\nfunction calcSeekMs(doc: PxAnimatedSvgDocument, props: DocOverrideProps): number | undefined {\n    let seekMs: number | undefined;\n    // The FLAT runtime view, so this works on a wire-format document too — reading\n    // `doc.animator.duration` directly finds nothing there.\n    const animator = getAnimatorConfig(doc) || {};\n    if (props.progress !== undefined) {\n        // ONE rule for progress → time (core's `progressToTimeMs`): the same mapping\n        // `getCurrentProgress` reads back, so a prop of 0.5 and a read of 0.5 agree.\n        const iterationsValue = props.iterations ?? animator.iterations;\n        const iterationsCount = iterationsValue === 'infinite' ? Infinity\n            : (typeof iterationsValue === 'number' && iterationsValue >= 1 ? iterationsValue : 1);\n        const singleDuration = props.duration ?? animator.duration ?? DEFAULT_DURATION_MS;\n        seekMs = progressToTimeMs(props.progress, singleDuration, iterationsCount);\n    }\n    if (props.time !== undefined) seekMs = props.time;\n    return seekMs;\n}\n\n\n// -- Main public component --------------------------------------------------\n\n/**\n * Vue component for rendering and controlling Pixodesk SVG animations.\n *\n * Supports four mutually-exclusive control modes:\n *\n * 1. **Autoplay** – uses triggers from the animation document.\n *    ```vue\n *    <PixodeskSvgAnimator :doc=\"animation\" autoplay />\n *    ```\n *\n * 2. **Declarative play/pause** – controlled via boolean props.\n *    ```vue\n *    <PixodeskSvgAnimator :doc=\"animation\" play :pause=\"false\" />\n *    ```\n *\n * 3. **Imperative** – exposes a ref-based API for full programmatic control.\n *    ```vue\n *    <PixodeskSvgAnimator :doc=\"animation\" ref=\"animator\" />\n *    <button @click=\"$refs.animator.play()\">Play</button>\n *    ```\n *\n * 4. **Controlled time** – renders a single frame at a given time.\n *    ```vue\n *    <PixodeskSvgAnimator :doc=\"animation\" :progress=\"0.5\" />\n *    <PixodeskSvgAnimator :doc=\"animation\" :time=\"500\" />\n *    ```\n */\nconst PixodeskSvgAnimator = defineComponent({\n    name: 'PixodeskSvgAnimator',\n\n    props: {\n        // -- Source\n        doc: { type: Object as PropType<PxAnimatedSvgDocument>, required: true },\n\n        // -- Playback override: the document's `timeline` block as a patch (or a JSON string),\n        //    plus the four shortcuts people reach for most. The same names as React / RN.\n        timeline: { type: [Object, String] as PropType<PxTimelinePatch | string> },\n        resetTimeline: { type: Boolean, default: undefined },\n        duration: { type: Number },\n        delay: { type: Number },\n        iterations: { type: [Number, String] as PropType<number | 'infinite'> },\n        startOn: { type: String as PropType<'load' | 'mouseOver' | 'click' | 'scrollIntoView' | 'programmatic'> },\n\n        // -- Declarative control\n        autoplay: { type: Boolean, default: undefined },\n        play: { type: Boolean, default: undefined },\n        pause: { type: Boolean, default: undefined },\n\n        // -- Controlled time\n        progress: { type: Number },\n        time: { type: Number },\n\n        // -- Diagnostics (API review §5).\n        //    Function PROPS, not emits, on purpose: an emit handler always exists, so wiring\n        //    these to `emit` would permanently suppress the console fallback for anyone who\n        //    never listens. As props, \"not given\" really is undefined and the console still\n        //    speaks by default — the same contract as React and React Native.\n        onWarn: { type: Function as PropType<(diagnostic: PxDiagnostic) => void> },\n        onError: { type: Function as PropType<(diagnostic: PxDiagnostic) => void> },\n        //    `silent` takes `true` or just the kinds to quiet, so `platform` chatter can be\n        //    silenced while `document` problems still speak.\n        silent: { type: [Boolean, Array] as PropType<boolean | ReadonlyArray<PxDiagnosticKind>>, default: undefined },\n    },\n\n    emits: ['play', 'stop', 'pause', 'cancel', 'finish', 'remove'],\n\n    setup(props, { expose, emit }) {\n        const elementRefs = new Map<string, Element>();\n        const apiRef = shallowRef<PxAnimatorAPI | null>(null);\n\n        /**\n         * The diagnostics channel, built from the CURRENT props each time (API review §5).\n         * Not hoisted into a constant wrapper: `(m, d) => props.onWarn?.(m, d)` would always be\n         * a function, so the channel would think a handler exists and the console fallback\n         * would never fire for anyone who passed nothing.\n         */\n        const makeDiag = (): PxDiagnostics => createDiagnostics(\n            { onWarn: props.onWarn, onError: props.onError, silent: props.silent },\n            '[PixodeskSvgAnimator]',\n        );\n\n        // -- Determine control mode ---------------------------------------------\n\n        // ONE control-mode rule, decided in core (API review §1/§7). The template ref is not an\n        // input: it is exposed in every mode and never changes which one is chosen.\n        const resolvedMode = computed(() => resolveControlMode({\n            progress: props.progress, time: props.time,\n            play: props.play, pause: props.pause, autoplay: props.autoplay,\n        }));\n        const compMode = computed<PxControlMode>(() => resolvedMode.value.mode);\n\n        // Warn where the mode is COMPUTED, not inside `applyDocOverrides` — that runs again on\n        // every doc recompute and would repeat the same sentence.\n        watch(resolvedMode, r => {\n            const diag = makeDiag();\n            for (const w of r.warnings) diag.warn(PxDiagnosticKind.usage, w);\n        }, { immediate: true });\n\n        // -- Prepare the document with overrides --------------------------------\n\n        const resolvedDoc = computed(() => {\n            let doc = generateNewIds(props.doc);\n            return applyDocOverrides(doc, props, compMode.value, makeDiag());\n        });\n\n        // -- Render the SVG node tree -------------------------------------------\n\n        function renderNode(node: PxNode | undefined): VNode | null {\n            if (!node) return null;\n\n            const { type, animate, meta, children, ...attrs } = node;\n            const normProps = getNormalizedProps(attrs);\n\n            // Capture a ref to each element with an id.\n            if (node.id) {\n                const nodeId = node.id;\n                normProps[VUE_PROP.ref] = (el: Element | null) => {\n                    if (el) {\n                        elementRefs.set(nodeId, el);\n                    } else {\n                        elementRefs.delete(nodeId);\n                    }\n                };\n            }\n\n            const childVNodes = children?.map(child => renderNode(child)).filter(Boolean) as VNode[] | undefined;\n            // Text content: a node's own `textContent` renders only when it has no child nodes — a\n            // line <tspan> can carry both, and then its children are the styled spans (the React\n            // Native renderer's rule). `getNormalizedProps` strips `textContent` from the attributes.\n            const text = typeof node.textContent === 'string' ? node.textContent : undefined;\n            return h(type, normProps, childVNodes?.length ? childVNodes : text);\n        }\n\n        // -- Animator lifecycle -------------------------------------------------\n\n        function createApi() {\n            destroyApi();\n            const doc = resolvedDoc.value;\n            if (!doc) return;\n\n            // Route animator lifecycle events to Vue component events, INLINE under the same\n            // names every surface uses (review §9). `stop` fires alongside any event that halts\n            // playback — that is the PLAYER's rule, so `onStop` is passed through, not re-derived.\n            apiRef.value = createAnimator({\n                doc,\n                adapter:  createVueAdapter(elementRefs, makeDiag()),\n                onPlay:   () => emit('play'),\n                onPause:  () => emit('pause'),\n                onCancel: () => emit('cancel'),\n                onFinish: () => emit('finish'),\n                onRemove: () => emit('remove'),\n                onStop:   () => emit('stop'),\n                // The player's own diagnostics reach the same handlers as the component's.\n                onWarn:   props.onWarn,\n                onError:  props.onError,\n                silent:   props.silent,\n            });\n\n            // (Re)apply the declarative control state to the fresh animator —\n            // covers both the initial mount (e.g. `:play=\"true\"` from the\n            // start) and doc swaps.\n            syncPlayState();\n            applySeek();\n        }\n\n        function destroyApi() {\n            apiRef.value?.destroy();\n            apiRef.value = null;\n        }\n\n        /** Declarative play/pause → animator calls. */\n        function syncPlayState() {\n            if (compMode.value !== PxControlMode.play) return;\n            if (props.play && !props.pause) {\n                apiRef.value?.play();\n            } else if (props.pause) {\n                apiRef.value?.pause();\n            } else if (props.play === false) {\n                // explicit play=false → hold where it is (review §8). This used to `finish()`;\n                // a boolean whose `false` means \"jump to the end\" is not what anyone guesses.\n                apiRef.value?.pause();\n            } else {\n                // pause-only usage: pause switched off → resume\n                apiRef.value?.play();\n            }\n        }\n\n        /** Controlled-time mode: seek through the animator API (no recreate). */\n        function applySeek() {\n            if (compMode.value !== PxControlMode.fixedTime) return;\n            const doc = resolvedDoc.value;\n            if (!doc) return;\n            const seekMs = calcSeekMs(doc, props);\n            if (seekMs !== undefined) {\n                apiRef.value?.setCurrentTime(seekMs);\n                apiRef.value?.pause();\n            }\n        }\n\n        // Create the animator once DOM refs are available.\n        onMounted(() => createApi());\n\n        // Recreate the animator when the resolved doc changes.\n        // `flush: 'post'` — the animator must be created AFTER the DOM is\n        // patched, otherwise the new root element isn't in the document yet\n        // and trigger setup fails (autoplay would never resume after a doc swap).\n        watch(resolvedDoc, () => createApi(), { flush: 'post' });\n\n        // Sync declarative play/pause props with the animator.\n        watch([compMode, () => props.play, () => props.pause], () => syncPlayState());\n\n        // Scrubbing progress/time only seeks — the animator is NOT recreated.\n        watch([compMode, () => props.progress, () => props.time], () => applySeek());\n\n        onUnmounted(() => {\n            destroyApi();\n        });\n\n        // -- Expose imperative API ----------------------------------------------\n\n        const publicApi: VueAnimatorApi = {\n            isPlaying: () => apiRef.value?.isPlaying() || false,\n            play: () => apiRef.value?.play(),\n            pause: () => apiRef.value?.pause(),\n            cancel: () => apiRef.value?.cancel(),\n            finish: () => apiRef.value?.finish(),\n            setPlaybackRate: (rate: number) => apiRef.value?.setPlaybackRate(rate),\n            getCurrentTime: () => apiRef.value?.getCurrentTime() ?? null,\n            setCurrentTime: (time: number) => apiRef.value?.setCurrentTime(time),\n            getCurrentProgress: () => apiRef.value?.getCurrentProgress() ?? null,\n            setCurrentProgress: (progress: number) => apiRef.value?.setCurrentProgress(progress),\n        };\n\n        expose(publicApi);\n\n        // -- Render -------------------------------------------------------------\n\n        return () => {\n            const doc = resolvedDoc.value;\n            return doc ? renderNode(doc) : null;\n        };\n    },\n});\n\nexport default PixodeskSvgAnimator;\n","/*---------------------------------------------------------------------------------------\n * Copyright (c) Pixodesk LTD.\n * Licensed under the MIT License. See the LICENSE file in the project root for details.\n *---------------------------------------------------------------------------------------*/\n\nimport { PX_TRIGGER_DEFAULTS, PxOutAction, PxStartOn } from \"@pixodesk/svg-animator-web\";\nimport { computed, defineComponent, h, onMounted, onUnmounted, ref, useAttrs, type PropType } from 'vue';\n\n\ntype AnimState = 'idle' | 'paused' | 'playing';\n\n\n/**\n * Controls playback of a SVG+CSS animated file by toggling class names on a wrapper div.\n *\n * Intended for use with SVG files exported from the Pixodesk editor using the\n * **CSS Keyframes** flavor (no `<script>` tag). Import the SVG as a Vue component\n * via `vite-svg-loader` and pass it as the default slot:\n *\n * ```vue\n * <script setup>\n * import AnimationSvg from './animation.svg'; // vite-svg-loader\n * </script>\n *\n * <template>\n *   <PixodeskSvgCssAnimator startOn=\"mouseOver\" outAction=\"pause\">\n *     <AnimationSvg />\n *   </PixodeskSvgCssAnimator>\n * </template>\n * ```\n *\n * The wrapper div carries one of three animation states via CSS class names:\n * - *(no class)*                       — idle, animation not started\n * - `px-anim-enabled`                  — started but paused\n * - `px-anim-enabled px-anim-playing`  — actively playing\n *\n * @prop startOn   - What triggers the animation to start:\n *   - `'load'`           — plays immediately on mount (default)\n *   - `'mouseOver'`      — plays on hover\n *   - `'click'`          — plays on click, toggles on second click\n *   - `'scrollIntoView'` — plays when the element enters the viewport\n *   - `'programmatic'`   — **not supported here.** This wrapper exposes no `play()`, so there is\n *                          nothing to wait for and the animation never starts. The prop keeps the\n *                          shared `PxStartOn` type (one enum per wire key), so the value type-checks\n *                          — it simply has no effect. Use `PixodeskSvgAnimator` (the JSON player)\n *                          when you need to start an animation from code.\n * @prop outAction - What happens when the trigger ends (hover/scroll out, second click):\n *   - `'continue'` — keeps playing (default)\n *   - `'pause'`    — pauses at the current frame\n *   - `'reset'`    — resets to the beginning\n *   - `'reverse'`  — **acts as `'continue'` here.** A CSS class toggle cannot run keyframes\n *                    backwards. Accepted so the prop keeps the shared `PxOutAction` type.\n * @prop scrollIntoViewThreshold - For `'scrollIntoView'`: how much of the element must be\n *   visible (0–1) before it starts, and below which the out action applies. Defaults to the\n *   wire default (`0`, any pixel) — the same as the JSON player, not a private `0.1`.\n */\nconst PixodeskSvgCssAnimator = defineComponent({\n    name: 'PixodeskSvgCssAnimator',\n\n    inheritAttrs: false,\n\n    props: {\n        startOn:   { type: String as PropType<PxStartOn>,   default: 'load' },\n        outAction: { type: String as PropType<PxOutAction>, default: 'continue' },\n        scrollIntoViewThreshold: { type: Number, default: PX_TRIGGER_DEFAULTS.scrollIntoViewThreshold },\n    },\n\n    setup(props, { slots }) {\n        const attrs = useAttrs();\n        const state = ref<AnimState>(props.startOn === 'load' ? 'playing' : 'idle');\n        const divRef = ref<HTMLDivElement | null>(null);\n\n        const goOut = () => {\n            state.value =\n                props.outAction === 'reset' ? 'idle' :\n                props.outAction === 'pause' ? 'paused' : 'playing';\n        };\n\n        let observerCleanup: (() => void) | undefined;\n\n        onMounted(() => {\n            if (props.startOn !== 'scrollIntoView') return;\n            const el = divRef.value;\n            if (!el) return;\n            const outState: AnimState =\n                props.outAction === 'reset' ? 'idle' :\n                props.outAction === 'pause' ? 'paused' : 'playing';\n            // `isIntersecting` is true at ONE visible pixel, so with a threshold above 0 it could\n            // never report \"out\" — read the ratio against the threshold instead (review §13).\n            const threshold = props.scrollIntoViewThreshold;\n            const visible = (entry: IntersectionObserverEntry): boolean =>\n                threshold > 0 ? entry.intersectionRatio >= threshold : entry.isIntersecting;\n            const observer = new IntersectionObserver(\n                ([entry]) => { state.value = visible(entry) ? 'playing' : outState; },\n                { threshold }\n            );\n            observer.observe(el);\n            observerCleanup = () => observer.disconnect();\n        });\n\n        onUnmounted(() => observerCleanup?.());\n\n        const animClass = computed(() =>\n            state.value === 'playing' ? 'px-anim-enabled px-anim-playing' :\n            state.value === 'paused'  ? 'px-anim-enabled' : ''\n        );\n\n        const handlers = computed(() =>\n            props.startOn === 'mouseOver' ? {\n                onMouseenter: () => { state.value = 'playing'; },\n                onMouseleave: goOut,\n            } :\n            props.startOn === 'click' ? {\n                onClick: () => state.value === 'playing' ? goOut() : (state.value = 'playing'),\n            } : {}\n        );\n\n        return () => h('div', {\n            ref: divRef,\n            ...attrs,\n            class: [attrs.class, animClass.value],\n            ...handlers.value,\n        }, slots.default?.());\n    },\n});\n\nexport default PixodeskSvgCssAnimator;\n"],"mappings":"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","names":["computed","defineComponent","h","onMounted","onUnmounted","ref"]}