@pixodesk/svg-animator-rn 1.0.35 → 1.0.40

package/dist/index.js

@@ -31,7 +31,8 @@ var __objRest = (source, exclude) => {
 };
 
 // src/PixodeskSvgAnimator.tsx
-import { reportDocumentDiagnostics, generateNewIds, getAnimatorConfig as getAnimatorConfig2, getDefs, materialiseAllInTree, validateNodeEffects, PxTimelineEngine as PxTimelineEngine2, applyAnimatorConfig, foldAnimatorConfigShortcuts } from "@pixodesk/svg-animator-core";
+import { clampSeekMs, createRunClock, isValidPlaybackRate, progressSpanMs, progressToTimeMs, PX_RATE_REJECTED, PxDiagnosticKind as PxDiagnosticKind2, seekCeilingMs, timeToProgress, generateNewIds, getAnimatorConfig as getAnimatorConfig2, getDefs, materializeAllInTree, resolveTrigger, validateNodeEffects, PxTimelineEngine as PxTimelineEngine2, PxControlMode, resolveControlMode, applyAnimatorConfig, foldTimelineOverride } from "@pixodesk/svg-animator-core";
+import { createDiagnostics as createDiagnostics2, reportDocumentDiagnostics } from "@pixodesk/svg-animator-core/internal";
 import { createElement as createElement2, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { Dimensions, Platform, Pressable, View } from "react-native";
 import Animated, {
@@ -47,16 +48,11 @@ import Animated, {
 } from "react-native-reanimated";
 
 // src/PxRnTracks.ts
-import {
-  calcAnimationValues,
-  getAnimatorConfig,
-  getNormalisedBindings,
-  DEFAULT_DURATION_MS,
-  PxTimelineEngine
-} from "@pixodesk/svg-animator-core";
+import { calcAnimationValues, getAnimatorConfig, getNormalizedBindings, PxTimelineEngine } from "@pixodesk/svg-animator-core";
+import { DEFAULT_DURATION_MS } from "@pixodesk/svg-animator-core/internal";
 
 // src/PxRnPropNames.ts
-import { kebabToCamelCaseWord } from "@pixodesk/svg-animator-core";
+import { kebabToCamelCaseWord } from "@pixodesk/svg-animator-core/internal";
 
 // src/PxRnMatrix.ts
 var DEG = Math.PI / 180;
@@ -173,7 +169,7 @@ function compileTracks(doc, opts) {
     ((_a2 = n == null ? void 0 : n.children) != null ? _a2 : []).forEach(indexTags);
   };
   indexTags(doc);
-  const bindings = getNormalisedBindings(doc, PxTimelineEngine.js) || [];
+  const bindings = getNormalizedBindings(doc, PxTimelineEngine.js) || [];
   const elements = [];
   for (const binding of bindings) {
     const animDef = binding.animate;
@@ -233,14 +229,8 @@ function sampleProps(tracks, tMs, stepMs, sampleCount, native = false) {
 }
 
 // src/PxRnRender.tsx
-import {
-  getNormalizedProps,
-  resolveStyle,
-  sanitiseAttributeValue,
-  DISALLOWED_SVG_TAGS_LOWER,
-  TEXT_ATTR,
-  TEXT_CONTENT_ATTR
-} from "@pixodesk/svg-animator-core";
+import { getNormalizedProps } from "@pixodesk/svg-animator-core";
+import { sanitizeAttributeValue, DISALLOWED_SVG_TAGS_LOWER, TEXT_CONTENT_ATTR } from "@pixodesk/svg-animator-core/internal";
 import { createElement } from "react";
 
 // src/PxRnTypeMap.ts
@@ -357,14 +347,14 @@ var RN_SVG_COMPONENTS = {
 
 // src/PxRnRender.tsx
 function toRnProps(props, warnings, tag) {
-  const normalised = getNormalizedProps(props);
+  const normalized = getNormalizedProps(props);
   const out = {};
-  for (const key of Object.keys(normalised)) {
-    const sanitised = sanitiseAttributeValue(key, normalised[key]);
-    if (sanitised === void 0) continue;
+  for (const key of Object.keys(normalized)) {
+    const sanitized = sanitizeAttributeValue(key, normalized[key]);
+    if (sanitized === void 0) continue;
     const rnKey = toRnPropName(key);
     if (!rnKey) continue;
-    out[rnKey] = toRnPropValue(rnKey, String(sanitised), tag);
+    out[rnKey] = toRnPropValue(rnKey, String(sanitized), tag);
   }
   return out;
 }
@@ -386,17 +376,17 @@ function renderRnNode(node, opts = {}, key) {
   }
   const rnProps = toRnProps(props, opts.warnings, tag);
   if (domType !== void 0) rnProps.type = domType;
-  const resolved = resolveStyle(style, opts.defs);
+  const resolved = style;
   if (resolved) {
     for (const [k, v] of Object.entries(resolved)) {
       const rnKey = toRnPropName(k);
       if (!rnKey || rnKey in rnProps) continue;
-      const sanitised = sanitiseAttributeValue(rnKey, v);
-      if (sanitised === void 0) continue;
-      rnProps[rnKey] = toRnPropValue(rnKey, String(sanitised), tag);
+      const sanitized = sanitizeAttributeValue(rnKey, v);
+      if (sanitized === void 0) continue;
+      rnProps[rnKey] = toRnPropValue(rnKey, String(sanitized), tag);
     }
   }
-  const textContent = props[TEXT_ATTR] || props[TEXT_CONTENT_ATTR];
+  const textContent = props[TEXT_CONTENT_ATTR];
   let childElements = void 0;
   if (Array.isArray(children) && children.length > 0) {
     childElements = children.map((ch, i) => {
@@ -422,6 +412,8 @@ function renderRnNode(node, opts = {}, key) {
 
 // src/PxRnErrorBoundary.tsx
 import { Component } from "react";
+import { PxDiagnosticKind } from "@pixodesk/svg-animator-core";
+import { createDiagnostics } from "@pixodesk/svg-animator-core/internal";
 var PxRnErrorBoundary = class extends Component {
   constructor() {
     super(...arguments);
@@ -431,9 +423,8 @@ var PxRnErrorBoundary = class extends Component {
     return { error };
   }
   componentDidCatch(error, info) {
-    var _a, _b, _c, _d;
-    (_c = (_b = this.props).onError) == null ? void 0 : _c.call(_b, error, (_a = info == null ? void 0 : info.componentStack) != null ? _a : void 0);
-    console.warn("[PixodeskSvgAnimator] render failed:", (_d = error == null ? void 0 : error.message) != null ? _d : error);
+    var _a, _b;
+    ((_a = this.props.diag) != null ? _a : createDiagnostics(void 0, "[PixodeskSvgAnimator]")).error(PxDiagnosticKind.internal, error, { componentStack: (_b = info == null ? void 0 : info.componentStack) != null ? _b : void 0 });
   }
   componentDidUpdate(prev) {
     if (this.state.error && prev.children !== this.props.children) {
@@ -448,7 +439,7 @@ var PxRnErrorBoundary = class extends Component {
 };
 
 // src/PxRnSafety.ts
-import { deepClone, generateUniqueId } from "@pixodesk/svg-animator-core";
+import { deepClone, generateUniqueId } from "@pixodesk/svg-animator-core/internal";
 function isClosedPath(d) {
   return typeof d === "string" && /[zZ]/.test(d);
 }
@@ -592,18 +583,18 @@ var EMPTY_TRACKS = {
   sampleCount: 2,
   elements: []
 };
-function compileDocument(doc, overrides) {
-  const { config, resetDocDefaults, duration, delay, iterations, startOn } = overrides;
+function compileDocument(doc, overrides, diag) {
+  const { timeline, resetTimeline, duration, delay, iterations, startOn } = overrides;
   const warnings = validateNodeEffects(doc);
-  for (const w of warnings) console.warn("[PixodeskSvgAnimator] effects shape warning:", w);
+  for (const w of warnings) diag.warn(PxDiagnosticKind2.document, "effects shape: " + w);
   reportDocumentDiagnostics(doc, "[PixodeskSvgAnimator]");
-  const patch = foldAnimatorConfigShortcuts(config, { duration, delay, iterations, startOn });
-  if (patch !== void 0 || resetDocDefaults) {
-    const applied = applyAnimatorConfig(doc, patch != null ? patch : {}, { resetDefaults: !!resetDocDefaults });
-    for (const w of applied.warnings) console.warn("[PixodeskSvgAnimator] config override:", w);
+  const patch = foldTimelineOverride(timeline, { duration, delay, iterations, startOn });
+  if (patch !== void 0 || resetTimeline) {
+    const applied = applyAnimatorConfig(doc, patch != null ? patch : {}, { resetDefaults: !!resetTimeline });
+    for (const w of applied.warnings) diag.warn(PxDiagnosticKind2.usage, "timeline override: " + w);
     doc = applied.doc;
   }
-  let prepared = materialiseAllInTree(doc, PxTimelineEngine2.native);
+  let prepared = materializeAllInTree(doc, PxTimelineEngine2.native);
   if (NATIVE_SVG_VIEWS) {
     prepared = openClosedTextPathTargets(prepared);
   }
@@ -613,8 +604,8 @@ function compileDocument(doc, overrides) {
 }
 function PixodeskSvgAnimator({
   doc,
-  config,
-  resetDocDefaults,
+  timeline,
+  resetTimeline,
   duration,
   delay,
   iterations,
@@ -631,25 +622,36 @@ function PixodeskSvgAnimator({
   onPause,
   onCancel,
   onFinish,
+  onRemove,
   onError,
-  fallback
+  fallback,
+  onWarn,
+  muteWarn,
+  muteError
 }) {
-  var _a, _b, _c, _d;
-  const configKey = typeof config === "string" ? config : JSON.stringify(config != null ? config : null);
+  var _a, _b;
+  const timelineKey = typeof timeline === "string" ? timeline : JSON.stringify(timeline != null ? timeline : null);
+  const makeDiag = () => createDiagnostics2(
+    { onWarn, onError, muteWarn, muteError },
+    "[PixodeskSvgAnimator]"
+  );
   const compiled = useMemo(() => {
     try {
       return compileDocument(
         doc,
-        { config, resetDocDefaults, duration, delay, iterations, startOn }
+        { timeline, resetTimeline, duration, delay, iterations, startOn },
+        makeDiag()
       );
     } catch (e) {
       const error = e instanceof Error ? e : new Error(String(e));
-      console.warn("[PixodeskSvgAnimator] could not compile the document:", error.message);
+      makeDiag().error(PxDiagnosticKind2.internal, error, { phase: "compile" });
       return { doc: null, tracks: EMPTY_TRACKS, error };
     }
-  }, [doc, configKey, resetDocDefaults, duration, delay, iterations, startOn]);
+  }, [doc, timelineKey, resetTimeline, duration, delay, iterations, startOn]);
   const tracks = compiled.tracks;
-  const totalDuration = tracks.duration * (tracks.iterations === Infinity ? 1 : tracks.iterations);
+  const totalDuration = progressSpanMs(tracks.duration, tracks.iterations);
+  const seekCeiling = seekCeilingMs(tracks.duration, tracks.iterations);
+  const runClock = useMemo(() => createRunClock(seekCeiling), [seekCeiling]);
   const progress = useSharedValue(0);
   const playingRef = useRef(false);
   const rateRef = useRef(1);
@@ -661,6 +663,8 @@ function PixodeskSvgAnimator({
   };
   const notifyFinish = () => {
     playingRef.current = false;
+    runClock.seek(Number.isFinite(seekCeiling) ? seekCeiling : tracks.duration);
+    runClock.stop();
     progress.value = restingPosition();
     onFinish == null ? void 0 : onFinish();
     onStop == null ? void 0 : onStop();
@@ -697,12 +701,15 @@ function PixodeskSvgAnimator({
   const api = {
     isPlaying: () => playingRef.current,
     play: () => {
+      if (Number.isFinite(seekCeiling) && runClock.now() >= seekCeiling) runClock.seek(0);
+      runClock.start(rateRef.current);
       startFrom(progress.value);
       onPlay == null ? void 0 : onPlay();
     },
     pause: () => {
       cancelAnimation(progress);
       playingRef.current = false;
+      runClock.stop();
       onPause == null ? void 0 : onPause();
       onStop == null ? void 0 : onStop();
     },
@@ -710,62 +717,82 @@ function PixodeskSvgAnimator({
       cancelAnimation(progress);
       progress.value = 0;
       playingRef.current = false;
+      runClock.seek(0);
+      runClock.stop();
       onCancel == null ? void 0 : onCancel();
       onStop == null ? void 0 : onStop();
     },
     finish: () => {
       cancelAnimation(progress);
       playingRef.current = false;
+      runClock.seek(Number.isFinite(seekCeiling) ? seekCeiling : tracks.duration);
+      runClock.stop();
       progress.value = restingPosition();
       onFinish == null ? void 0 : onFinish();
       onStop == null ? void 0 : onStop();
     },
     setPlaybackRate: (rate) => {
-      if (!isFinite(rate) || rate === 0) {
-        console.warn("setPlaybackRate: rate must be finite and non-zero");
+      if (!isValidPlaybackRate(rate)) {
+        makeDiag().warn(PxDiagnosticKind2.usage, PX_RATE_REJECTED);
         return;
       }
       rateRef.current = rate;
-      if (playingRef.current) startFrom(progress.value);
+      if (playingRef.current) {
+        runClock.start(rate);
+        startFrom(progress.value);
+      }
     },
-    getCurrentTime: () => progress.value,
+    // Ms from the start of the WHOLE run, like every other engine (review §3). This used
+    // to return `progress.value`, which is ms within the current iteration — so a slider
+    // built on it jumped back to 0 every time the animation repeated.
+    getCurrentTime: () => runClock.now(),
     setCurrentTime: (t) => {
       const wasPlaying = playingRef.current;
       cancelAnimation(progress);
       playingRef.current = false;
-      const clamped = Math.max(0, Math.min(t, totalDuration));
+      const clamped = clampSeekMs(t, seekCeiling);
+      runClock.seek(clamped);
       const withinIteration = tracks.duration > 0 ? clamped % tracks.duration || (clamped === 0 ? 0 : tracks.duration) : 0;
       progress.value = withinIteration;
       if (wasPlaying) startFrom(withinIteration);
+      else runClock.stop();
+    },
+    getCurrentProgress: () => timeToProgress(runClock.now(), tracks.duration, tracks.iterations),
+    setCurrentProgress: (p) => {
+      api.setCurrentTime(progressToTimeMs(p, tracks.duration, tracks.iterations));
     }
   };
   useImperativeHandle(apiRef, () => api, [compiled]);
-  const trigger = compiled.doc ? (_a = getAnimatorConfig2(compiled.doc)) == null ? void 0 : _a.trigger : void 0;
-  const effectiveStartOn = (_b = trigger == null ? void 0 : trigger.startOn) != null ? _b : "load";
-  const effectiveOutAction = (_c = trigger == null ? void 0 : trigger.outAction) != null ? _c : "pause";
+  const trigger = resolveTrigger(compiled.doc ? (_a = getAnimatorConfig2(compiled.doc)) == null ? void 0 : _a.trigger : void 0);
+  const effectiveStartOn = trigger.startOn;
+  const effectiveOutAction = trigger.outAction;
+  const { mode: compMode, warnings: modeWarnings } = resolveControlMode({ progress: progressProp, time, play, pause, autoplay });
+  useEffect(() => {
+    const diag = makeDiag();
+    for (const w of modeWarnings) diag.warn(PxDiagnosticKind2.usage, w);
+  }, [modeWarnings.join("|")]);
   useEffect(() => {
-    if (progressProp !== void 0 || time !== void 0) {
-      const seekMs = time !== void 0 ? time : (progressProp != null ? progressProp : 0) * totalDuration;
+    if (compMode === PxControlMode.fixedTime) {
+      const seekMs = time !== void 0 ? time : progressToTimeMs(progressProp != null ? progressProp : 0, tracks.duration, tracks.iterations);
       api.setCurrentTime(seekMs);
       return;
     }
-    if (play !== void 0 || pause !== void 0) {
+    if (compMode === PxControlMode.play) {
       if (play && !pause) api.play();
       else if (pause) api.pause();
-      else if (play === false) api.finish();
+      else if (play === false) api.pause();
       else api.play();
       return;
     }
-    if (autoplay && effectiveStartOn === "load") {
+    if (compMode === PxControlMode.autoplay && effectiveStartOn === "load") {
       api.play();
     }
-  }, [compiled, autoplay, play, pause, progressProp, time]);
+  }, [compiled, compMode, autoplay, play, pause, progressProp, time]);
   const scrollRef = useRef(null);
   const inViewRef = useRef(false);
   useEffect(() => {
-    var _a2;
     if (!autoplay || effectiveStartOn !== "scrollIntoView") return;
-    const threshold = (_a2 = trigger == null ? void 0 : trigger.scrollIntoViewThreshold) != null ? _a2 : 0;
+    const threshold = trigger.scrollIntoViewThreshold;
     inViewRef.current = false;
     const check = () => {
       const node = scrollRef.current;
@@ -796,6 +823,8 @@ function PixodeskSvgAnimator({
     return () => {
       cancelAnimation(progress);
       playingRef.current = false;
+      onRemove == null ? void 0 : onRemove();
+      onStop == null ? void 0 : onStop();
     };
   }, [compiled]);
   const trackById = useMemo(() => {
@@ -851,17 +880,15 @@ function PixodeskSvgAnimator({
     } catch (e) {
       const error = e instanceof Error ? e : new Error(String(e));
       renderErrorRef.current = error;
-      console.warn("[PixodeskSvgAnimator] could not render the document:", error.message);
+      makeDiag().error(PxDiagnosticKind2.internal, error, { phase: "render" });
       return null;
     }
   }, [compiled, trackById]);
   useEffect(() => {
-    for (const w of warningsRef.current) console.warn("[PixodeskSvgAnimator]", w);
+    const diag = makeDiag();
+    for (const w of warningsRef.current) diag.warn(PxDiagnosticKind2.platform, w);
   }, [root]);
-  const failure = (_d = compiled.error) != null ? _d : renderErrorRef.current;
-  useEffect(() => {
-    if (failure) onError == null ? void 0 : onError(failure);
-  }, [failure]);
+  const failure = (_b = compiled.error) != null ? _b : renderErrorRef.current;
   if (failure) return fallback ? fallback(failure) : null;
   let content = root;
   if (autoplay && effectiveStartOn === "scrollIntoView" && root) {
@@ -886,19 +913,11 @@ function PixodeskSvgAnimator({
       }
     );
   }
-  return /* @__PURE__ */ jsx(PxRnErrorBoundary, { onError, fallback, children: content });
+  return /* @__PURE__ */ jsx(PxRnErrorBoundary, { fallback, diag: makeDiag(), children: content });
 }
 var PixodeskSvgAnimator_default = PixodeskSvgAnimator;
 export {
   PixodeskSvgAnimator,
-  PxRnErrorBoundary,
-  RN_SVG_COMPONENTS,
-  compileTracks,
-  PixodeskSvgAnimator_default as default,
-  openClosedTextPathTargets,
-  renderRnNode,
-  sampleProps,
-  toRnPropName,
-  toRnProps
+  PixodeskSvgAnimator_default as default
 };
 //# sourceMappingURL=index.js.map