@weng-lab/visualization 2.4.0-beta.2 → 2.4.0-beta.4

package/dist/visualization.es299.js

@@ -1,61 +1,75 @@
-import { jsx as m } from "react/jsx-runtime";
-import { useContext as u, Component as l } from "react";
-import { usePresence as c } from "./visualization.es173.js";
-import { LayoutGroupContext as f } from "./visualization.es174.js";
-import { SwitchLayoutGroupContext as d } from "./visualization.es176.js";
-import { frame as h } from "./visualization.es340.js";
-import { microtask as y } from "./visualization.es379.js";
-import { globalProjectionState as g } from "./visualization.es475.js";
-let i = !1;
-class v extends l {
-  /**
-   * This only mounts projection nodes for components that
-   * need measuring, we might want to do it for all components
-   * in order to incorporate transforms
-   */
-  componentDidMount() {
-    const { visualElement: t, layoutGroup: o, switchLayoutGroup: e, layoutId: s } = this.props, { projection: n } = t;
-    n && (o.group && o.group.add(n), e && e.register && s && e.register(n), i && n.root.didUpdate(), n.addEventListener("animationComplete", () => {
-      this.safeToRemove();
-    }), n.setOptions({
-      ...n.options,
-      layoutDependency: this.props.layoutDependency,
-      onExitComplete: () => this.safeToRemove()
-    })), g.hasEverUpdated = !0;
-  }
-  getSnapshotBeforeUpdate(t) {
-    const { layoutDependency: o, visualElement: e, drag: s, isPresent: n } = this.props, { projection: r } = e;
-    return r && (r.isPresent = n, t.layoutDependency !== o && r.setOptions({
-      ...r.options,
-      layoutDependency: o
-    }), i = !0, s || t.layoutDependency !== o || o === void 0 || t.isPresent !== n ? r.willUpdate() : this.safeToRemove(), t.isPresent !== n && (n ? r.promote() : r.relegate() || h.postRender(() => {
-      const p = r.getStack();
-      (!p || !p.members.length) && this.safeToRemove();
-    }))), null;
-  }
-  componentDidUpdate() {
-    const { visualElement: t, layoutAnchor: o } = this.props, { projection: e } = t;
-    e && (e.options.layoutAnchor = o, e.root.didUpdate(), y.postRender(() => {
-      !e.currentAnimation && e.isLead() && this.safeToRemove();
-    }));
-  }
-  componentWillUnmount() {
-    const { visualElement: t, layoutGroup: o, switchLayoutGroup: e } = this.props, { projection: s } = t;
-    i = !0, s && (s.scheduleCheckAfterUnmount(), o && o.group && o.group.remove(s), e && e.deregister && e.deregister(s));
-  }
-  safeToRemove() {
-    const { safeToRemove: t } = this.props;
-    t && t();
-  }
-  render() {
-    return null;
+import { fillWildcards as y } from "./visualization.es358.js";
+import { removeNonTranslationalTransform as p } from "./visualization.es357.js";
+import { frame as c } from "./visualization.es334.js";
+const l = /* @__PURE__ */ new Set();
+let f = !1, d = !1, m = !1;
+function u() {
+  if (d) {
+    const a = Array.from(l).filter((e) => e.needsMeasurement), s = new Set(a.map((e) => e.element)), r = /* @__PURE__ */ new Map();
+    s.forEach((e) => {
+      const t = p(e);
+      t.length && (r.set(e, t), e.render());
+    }), a.forEach((e) => e.measureInitialState()), s.forEach((e) => {
+      e.render();
+      const t = r.get(e);
+      t && t.forEach(([n, i]) => {
+        e.getValue(n)?.set(i);
+      });
+    }), a.forEach((e) => e.measureEndState()), a.forEach((e) => {
+      e.suspendedScrollY !== void 0 && window.scrollTo(0, e.suspendedScrollY);
+    });
   }
+  d = !1, f = !1, l.forEach((a) => a.complete(m)), l.clear();
 }
-function E(a) {
-  const [t, o] = c(), e = u(f);
-  return m(v, { ...a, layoutGroup: e, switchLayoutGroup: u(d), isPresent: t, safeToRemove: o });
+function h() {
+  l.forEach((a) => {
+    a.readKeyframes(), a.needsMeasurement && (d = !0);
+  });
+}
+function S() {
+  m = !0, h(), u(), m = !1;
+}
+class g {
+  constructor(s, r, e, t, n, i = !1) {
+    this.state = "pending", this.isAsync = !1, this.needsMeasurement = !1, this.unresolvedKeyframes = [...s], this.onComplete = r, this.name = e, this.motionValue = t, this.element = n, this.isAsync = i;
+  }
+  scheduleResolve() {
+    this.state = "scheduled", this.isAsync ? (l.add(this), f || (f = !0, c.read(h), c.resolveKeyframes(u))) : (this.readKeyframes(), this.complete());
+  }
+  readKeyframes() {
+    const { unresolvedKeyframes: s, name: r, element: e, motionValue: t } = this;
+    if (s[0] === null) {
+      const n = t?.get(), i = s[s.length - 1];
+      if (n !== void 0)
+        s[0] = n;
+      else if (e && r) {
+        const o = e.readValue(r, i);
+        o != null && (s[0] = o);
+      }
+      s[0] === void 0 && (s[0] = i), t && n === void 0 && t.set(s[0]);
+    }
+    y(s);
+  }
+  setFinalKeyframe() {
+  }
+  measureInitialState() {
+  }
+  renderEndStyles() {
+  }
+  measureEndState() {
+  }
+  complete(s = !1) {
+    this.state = "complete", this.onComplete(this.unresolvedKeyframes, this.finalKeyframe, s), l.delete(this);
+  }
+  cancel() {
+    this.state === "scheduled" && (l.delete(this), this.state = "pending");
+  }
+  resume() {
+    this.state === "pending" && this.scheduleResolve();
+  }
 }
 export {
-  E as MeasureLayout
+  g as KeyframeResolver,
+  S as flushKeyframeResolvers
 };
 //# sourceMappingURL=visualization.es299.js.map

package/dist/visualization.es299.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es299.js","sources":["../../../node_modules/.pnpm/framer-motion@12.38.0_@emotion+is-prop-valid@1.4.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/framer-motion/dist/es/motion/features/layout/MeasureLayout.mjs"],"sourcesContent":["\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { globalProjectionState, frame, microtask } from 'motion-dom';\nimport { useContext, Component } from 'react';\nimport { usePresence } from '../../../components/AnimatePresence/use-presence.mjs';\nimport { LayoutGroupContext } from '../../../context/LayoutGroupContext.mjs';\nimport { SwitchLayoutGroupContext } from '../../../context/SwitchLayoutGroupContext.mjs';\n\n/**\n * Track whether we've taken any snapshots yet. If not,\n * we can safely skip notification of didUpdate.\n *\n * Difficult to capture in a test but to prevent flickering\n * we must set this to true either on update or unmount.\n * Running `next-env/layout-id` in Safari will show this behaviour if broken.\n */\nlet hasTakenAnySnapshot = false;\nclass MeasureLayoutWithContext extends Component {\n    /**\n     * This only mounts projection nodes for components that\n     * need measuring, we might want to do it for all components\n     * in order to incorporate transforms\n     */\n    componentDidMount() {\n        const { visualElement, layoutGroup, switchLayoutGroup, layoutId } = this.props;\n        const { projection } = visualElement;\n        if (projection) {\n            if (layoutGroup.group)\n                layoutGroup.group.add(projection);\n            if (switchLayoutGroup && switchLayoutGroup.register && layoutId) {\n                switchLayoutGroup.register(projection);\n            }\n            if (hasTakenAnySnapshot) {\n                projection.root.didUpdate();\n            }\n            projection.addEventListener(\"animationComplete\", () => {\n                this.safeToRemove();\n            });\n            projection.setOptions({\n                ...projection.options,\n                layoutDependency: this.props.layoutDependency,\n                onExitComplete: () => this.safeToRemove(),\n            });\n        }\n        globalProjectionState.hasEverUpdated = true;\n    }\n    getSnapshotBeforeUpdate(prevProps) {\n        const { layoutDependency, visualElement, drag, isPresent } = this.props;\n        const { projection } = visualElement;\n        if (!projection)\n            return null;\n        /**\n         * TODO: We use this data in relegate to determine whether to\n         * promote a previous element. There's no guarantee its presence data\n         * will have updated by this point - if a bug like this arises it will\n         * have to be that we markForRelegation and then find a new lead some other way,\n         * perhaps in didUpdate\n         */\n        projection.isPresent = isPresent;\n        if (prevProps.layoutDependency !== layoutDependency) {\n            projection.setOptions({\n                ...projection.options,\n                layoutDependency,\n            });\n        }\n        hasTakenAnySnapshot = true;\n        if (drag ||\n            prevProps.layoutDependency !== layoutDependency ||\n            layoutDependency === undefined ||\n            prevProps.isPresent !== isPresent) {\n            projection.willUpdate();\n        }\n        else {\n            this.safeToRemove();\n        }\n        if (prevProps.isPresent !== isPresent) {\n            if (isPresent) {\n                projection.promote();\n            }\n            else if (!projection.relegate()) {\n                /**\n                 * If there's another stack member taking over from this one,\n                 * it's in charge of the exit animation and therefore should\n                 * be in charge of the safe to remove. Otherwise we call it here.\n                 */\n                frame.postRender(() => {\n                    const stack = projection.getStack();\n                    if (!stack || !stack.members.length) {\n                        this.safeToRemove();\n                    }\n                });\n            }\n        }\n        return null;\n    }\n    componentDidUpdate() {\n        const { visualElement, layoutAnchor } = this.props;\n        const { projection } = visualElement;\n        if (projection) {\n            projection.options.layoutAnchor = layoutAnchor;\n            projection.root.didUpdate();\n            microtask.postRender(() => {\n                if (!projection.currentAnimation && projection.isLead()) {\n                    this.safeToRemove();\n                }\n            });\n        }\n    }\n    componentWillUnmount() {\n        const { visualElement, layoutGroup, switchLayoutGroup: promoteContext, } = this.props;\n        const { projection } = visualElement;\n        hasTakenAnySnapshot = true;\n        if (projection) {\n            projection.scheduleCheckAfterUnmount();\n            if (layoutGroup && layoutGroup.group)\n                layoutGroup.group.remove(projection);\n            if (promoteContext && promoteContext.deregister)\n                promoteContext.deregister(projection);\n        }\n    }\n    safeToRemove() {\n        const { safeToRemove } = this.props;\n        safeToRemove && safeToRemove();\n    }\n    render() {\n        return null;\n    }\n}\nfunction MeasureLayout(props) {\n    const [isPresent, safeToRemove] = usePresence();\n    const layoutGroup = useContext(LayoutGroupContext);\n    return (jsx(MeasureLayoutWithContext, { ...props, layoutGroup: layoutGroup, switchLayoutGroup: useContext(SwitchLayoutGroupContext), isPresent: isPresent, safeToRemove: safeToRemove }));\n}\n\nexport { MeasureLayout };\n//# sourceMappingURL=MeasureLayout.mjs.map\n"],"names":["hasTakenAnySnapshot","MeasureLayoutWithContext","Component","visualElement","layoutGroup","switchLayoutGroup","layoutId","projection","globalProjectionState","prevProps","layoutDependency","drag","isPresent","frame","stack","layoutAnchor","microtask","promoteContext","safeToRemove","MeasureLayout","props","usePresence","useContext","LayoutGroupContext","jsx","SwitchLayoutGroupContext"],"mappings":";;;;;;;;AAgBA,IAAIA,IAAsB;AAC1B,MAAMC,UAAiCC,EAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAM7C,oBAAoB;AAChB,UAAM,EAAE,eAAAC,GAAe,aAAAC,GAAa,mBAAAC,GAAmB,UAAAC,EAAQ,IAAK,KAAK,OACnE,EAAE,YAAAC,EAAU,IAAKJ;AACvB,IAAII,MACIH,EAAY,SACZA,EAAY,MAAM,IAAIG,CAAU,GAChCF,KAAqBA,EAAkB,YAAYC,KACnDD,EAAkB,SAASE,CAAU,GAErCP,KACAO,EAAW,KAAK,UAAS,GAE7BA,EAAW,iBAAiB,qBAAqB,MAAM;AACnD,WAAK,aAAY;AAAA,IACrB,CAAC,GACDA,EAAW,WAAW;AAAA,MAClB,GAAGA,EAAW;AAAA,MACd,kBAAkB,KAAK,MAAM;AAAA,MAC7B,gBAAgB,MAAM,KAAK,aAAY;AAAA,IACvD,CAAa,IAELC,EAAsB,iBAAiB;AAAA,EAC3C;AAAA,EACA,wBAAwBC,GAAW;AAC/B,UAAM,EAAE,kBAAAC,GAAkB,eAAAP,GAAe,MAAAQ,GAAM,WAAAC,EAAS,IAAK,KAAK,OAC5D,EAAE,YAAAL,EAAU,IAAKJ;AACvB,WAAKI,MASLA,EAAW,YAAYK,GACnBH,EAAU,qBAAqBC,KAC/BH,EAAW,WAAW;AAAA,MAClB,GAAGA,EAAW;AAAA,MACd,kBAAAG;AAAA,IAChB,CAAa,GAELV,IAAsB,IAClBW,KACAF,EAAU,qBAAqBC,KAC/BA,MAAqB,UACrBD,EAAU,cAAcG,IACxBL,EAAW,WAAU,IAGrB,KAAK,aAAY,GAEjBE,EAAU,cAAcG,MACpBA,IACAL,EAAW,QAAO,IAEZA,EAAW,cAMjBM,EAAM,WAAW,MAAM;AACnB,YAAMC,IAAQP,EAAW,SAAQ;AACjC,OAAI,CAACO,KAAS,CAACA,EAAM,QAAQ,WACzB,KAAK,aAAY;AAAA,IAEzB,CAAC,KAGF;AAAA,EACX;AAAA,EACA,qBAAqB;AACjB,UAAM,EAAE,eAAAX,GAAe,cAAAY,EAAY,IAAK,KAAK,OACvC,EAAE,YAAAR,EAAU,IAAKJ;AACvB,IAAII,MACAA,EAAW,QAAQ,eAAeQ,GAClCR,EAAW,KAAK,UAAS,GACzBS,EAAU,WAAW,MAAM;AACvB,MAAI,CAACT,EAAW,oBAAoBA,EAAW,OAAM,KACjD,KAAK,aAAY;AAAA,IAEzB,CAAC;AAAA,EAET;AAAA,EACA,uBAAuB;AACnB,UAAM,EAAE,eAAAJ,GAAe,aAAAC,GAAa,mBAAmBa,EAAc,IAAM,KAAK,OAC1E,EAAE,YAAAV,EAAU,IAAKJ;AACvB,IAAAH,IAAsB,IAClBO,MACAA,EAAW,0BAAyB,GAChCH,KAAeA,EAAY,SAC3BA,EAAY,MAAM,OAAOG,CAAU,GACnCU,KAAkBA,EAAe,cACjCA,EAAe,WAAWV,CAAU;AAAA,EAEhD;AAAA,EACA,eAAe;AACX,UAAM,EAAE,cAAAW,MAAiB,KAAK;AAC9B,IAAAA,KAAgBA,EAAY;AAAA,EAChC;AAAA,EACA,SAAS;AACL,WAAO;AAAA,EACX;AACJ;AACA,SAASC,EAAcC,GAAO;AAC1B,QAAM,CAACR,GAAWM,CAAY,IAAIG,EAAW,GACvCjB,IAAckB,EAAWC,CAAkB;AACjD,SAAQC,EAAIvB,GAA0B,EAAE,GAAGmB,GAAO,aAAahB,GAAa,mBAAmBkB,EAAWG,CAAwB,GAAG,WAAWb,GAAW,cAAcM,EAAY,CAAE;AAC3L;","x_google_ignoreList":[0]}
+{"version":3,"file":"visualization.es299.js","sources":["../../../node_modules/.pnpm/motion-dom@12.38.0/node_modules/motion-dom/dist/es/animation/keyframes/KeyframesResolver.mjs"],"sourcesContent":["import { fillWildcards } from './utils/fill-wildcards.mjs';\nimport { removeNonTranslationalTransform } from './utils/unit-conversion.mjs';\nimport { frame } from '../../frameloop/frame.mjs';\n\nconst toResolve = new Set();\nlet isScheduled = false;\nlet anyNeedsMeasurement = false;\nlet isForced = false;\nfunction measureAllKeyframes() {\n    if (anyNeedsMeasurement) {\n        const resolversToMeasure = Array.from(toResolve).filter((resolver) => resolver.needsMeasurement);\n        const elementsToMeasure = new Set(resolversToMeasure.map((resolver) => resolver.element));\n        const transformsToRestore = new Map();\n        /**\n         * Write pass\n         * If we're measuring elements we want to remove bounding box-changing transforms.\n         */\n        elementsToMeasure.forEach((element) => {\n            const removedTransforms = removeNonTranslationalTransform(element);\n            if (!removedTransforms.length)\n                return;\n            transformsToRestore.set(element, removedTransforms);\n            element.render();\n        });\n        // Read\n        resolversToMeasure.forEach((resolver) => resolver.measureInitialState());\n        // Write\n        elementsToMeasure.forEach((element) => {\n            element.render();\n            const restore = transformsToRestore.get(element);\n            if (restore) {\n                restore.forEach(([key, value]) => {\n                    element.getValue(key)?.set(value);\n                });\n            }\n        });\n        // Read\n        resolversToMeasure.forEach((resolver) => resolver.measureEndState());\n        // Write\n        resolversToMeasure.forEach((resolver) => {\n            if (resolver.suspendedScrollY !== undefined) {\n                window.scrollTo(0, resolver.suspendedScrollY);\n            }\n        });\n    }\n    anyNeedsMeasurement = false;\n    isScheduled = false;\n    toResolve.forEach((resolver) => resolver.complete(isForced));\n    toResolve.clear();\n}\nfunction readAllKeyframes() {\n    toResolve.forEach((resolver) => {\n        resolver.readKeyframes();\n        if (resolver.needsMeasurement) {\n            anyNeedsMeasurement = true;\n        }\n    });\n}\nfunction flushKeyframeResolvers() {\n    isForced = true;\n    readAllKeyframes();\n    measureAllKeyframes();\n    isForced = false;\n}\nclass KeyframeResolver {\n    constructor(unresolvedKeyframes, onComplete, name, motionValue, element, isAsync = false) {\n        this.state = \"pending\";\n        /**\n         * Track whether this resolver is async. If it is, it'll be added to the\n         * resolver queue and flushed in the next frame. Resolvers that aren't going\n         * to trigger read/write thrashing don't need to be async.\n         */\n        this.isAsync = false;\n        /**\n         * Track whether this resolver needs to perform a measurement\n         * to resolve its keyframes.\n         */\n        this.needsMeasurement = false;\n        this.unresolvedKeyframes = [...unresolvedKeyframes];\n        this.onComplete = onComplete;\n        this.name = name;\n        this.motionValue = motionValue;\n        this.element = element;\n        this.isAsync = isAsync;\n    }\n    scheduleResolve() {\n        this.state = \"scheduled\";\n        if (this.isAsync) {\n            toResolve.add(this);\n            if (!isScheduled) {\n                isScheduled = true;\n                frame.read(readAllKeyframes);\n                frame.resolveKeyframes(measureAllKeyframes);\n            }\n        }\n        else {\n            this.readKeyframes();\n            this.complete();\n        }\n    }\n    readKeyframes() {\n        const { unresolvedKeyframes, name, element, motionValue } = this;\n        // If initial keyframe is null we need to read it from the DOM\n        if (unresolvedKeyframes[0] === null) {\n            const currentValue = motionValue?.get();\n            // TODO: This doesn't work if the final keyframe is a wildcard\n            const finalKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1];\n            if (currentValue !== undefined) {\n                unresolvedKeyframes[0] = currentValue;\n            }\n            else if (element && name) {\n                const valueAsRead = element.readValue(name, finalKeyframe);\n                if (valueAsRead !== undefined && valueAsRead !== null) {\n                    unresolvedKeyframes[0] = valueAsRead;\n                }\n            }\n            if (unresolvedKeyframes[0] === undefined) {\n                unresolvedKeyframes[0] = finalKeyframe;\n            }\n            if (motionValue && currentValue === undefined) {\n                motionValue.set(unresolvedKeyframes[0]);\n            }\n        }\n        fillWildcards(unresolvedKeyframes);\n    }\n    setFinalKeyframe() { }\n    measureInitialState() { }\n    renderEndStyles() { }\n    measureEndState() { }\n    complete(isForcedComplete = false) {\n        this.state = \"complete\";\n        this.onComplete(this.unresolvedKeyframes, this.finalKeyframe, isForcedComplete);\n        toResolve.delete(this);\n    }\n    cancel() {\n        if (this.state === \"scheduled\") {\n            toResolve.delete(this);\n            this.state = \"pending\";\n        }\n    }\n    resume() {\n        if (this.state === \"pending\")\n            this.scheduleResolve();\n    }\n}\n\nexport { KeyframeResolver, flushKeyframeResolvers };\n//# sourceMappingURL=KeyframesResolver.mjs.map\n"],"names":["toResolve","isScheduled","anyNeedsMeasurement","isForced","measureAllKeyframes","resolversToMeasure","resolver","elementsToMeasure","transformsToRestore","element","removedTransforms","removeNonTranslationalTransform","restore","key","value","readAllKeyframes","flushKeyframeResolvers","KeyframeResolver","unresolvedKeyframes","onComplete","name","motionValue","isAsync","frame","currentValue","finalKeyframe","valueAsRead","fillWildcards","isForcedComplete"],"mappings":";;;AAIA,MAAMA,IAAY,oBAAI,IAAG;AACzB,IAAIC,IAAc,IACdC,IAAsB,IACtBC,IAAW;AACf,SAASC,IAAsB;AAC3B,MAAIF,GAAqB;AACrB,UAAMG,IAAqB,MAAM,KAAKL,CAAS,EAAE,OAAO,CAACM,MAAaA,EAAS,gBAAgB,GACzFC,IAAoB,IAAI,IAAIF,EAAmB,IAAI,CAACC,MAAaA,EAAS,OAAO,CAAC,GAClFE,IAAsB,oBAAI,IAAG;AAKnC,IAAAD,EAAkB,QAAQ,CAACE,MAAY;AACnC,YAAMC,IAAoBC,EAAgCF,CAAO;AACjE,MAAKC,EAAkB,WAEvBF,EAAoB,IAAIC,GAASC,CAAiB,GAClDD,EAAQ,OAAM;AAAA,IAClB,CAAC,GAEDJ,EAAmB,QAAQ,CAACC,MAAaA,EAAS,oBAAmB,CAAE,GAEvEC,EAAkB,QAAQ,CAACE,MAAY;AACnC,MAAAA,EAAQ,OAAM;AACd,YAAMG,IAAUJ,EAAoB,IAAIC,CAAO;AAC/C,MAAIG,KACAA,EAAQ,QAAQ,CAAC,CAACC,GAAKC,CAAK,MAAM;AAC9B,QAAAL,EAAQ,SAASI,CAAG,GAAG,IAAIC,CAAK;AAAA,MACpC,CAAC;AAAA,IAET,CAAC,GAEDT,EAAmB,QAAQ,CAACC,MAAaA,EAAS,gBAAe,CAAE,GAEnED,EAAmB,QAAQ,CAACC,MAAa;AACrC,MAAIA,EAAS,qBAAqB,UAC9B,OAAO,SAAS,GAAGA,EAAS,gBAAgB;AAAA,IAEpD,CAAC;AAAA,EACL;AACA,EAAAJ,IAAsB,IACtBD,IAAc,IACdD,EAAU,QAAQ,CAACM,MAAaA,EAAS,SAASH,CAAQ,CAAC,GAC3DH,EAAU,MAAK;AACnB;AACA,SAASe,IAAmB;AACxB,EAAAf,EAAU,QAAQ,CAACM,MAAa;AAC5B,IAAAA,EAAS,cAAa,GAClBA,EAAS,qBACTJ,IAAsB;AAAA,EAE9B,CAAC;AACL;AACA,SAASc,IAAyB;AAC9B,EAAAb,IAAW,IACXY,EAAgB,GAChBX,EAAmB,GACnBD,IAAW;AACf;AACA,MAAMc,EAAiB;AAAA,EACnB,YAAYC,GAAqBC,GAAYC,GAAMC,GAAaZ,GAASa,IAAU,IAAO;AACtF,SAAK,QAAQ,WAMb,KAAK,UAAU,IAKf,KAAK,mBAAmB,IACxB,KAAK,sBAAsB,CAAC,GAAGJ,CAAmB,GAClD,KAAK,aAAaC,GAClB,KAAK,OAAOC,GACZ,KAAK,cAAcC,GACnB,KAAK,UAAUZ,GACf,KAAK,UAAUa;AAAA,EACnB;AAAA,EACA,kBAAkB;AACd,SAAK,QAAQ,aACT,KAAK,WACLtB,EAAU,IAAI,IAAI,GACbC,MACDA,IAAc,IACdsB,EAAM,KAAKR,CAAgB,GAC3BQ,EAAM,iBAAiBnB,CAAmB,OAI9C,KAAK,cAAa,GAClB,KAAK,SAAQ;AAAA,EAErB;AAAA,EACA,gBAAgB;AACZ,UAAM,EAAE,qBAAAc,GAAqB,MAAAE,GAAM,SAAAX,GAAS,aAAAY,EAAW,IAAK;AAE5D,QAAIH,EAAoB,CAAC,MAAM,MAAM;AACjC,YAAMM,IAAeH,GAAa,IAAG,GAE/BI,IAAgBP,EAAoBA,EAAoB,SAAS,CAAC;AACxE,UAAIM,MAAiB;AACjB,QAAAN,EAAoB,CAAC,IAAIM;AAAA,eAEpBf,KAAWW,GAAM;AACtB,cAAMM,IAAcjB,EAAQ,UAAUW,GAAMK,CAAa;AACzD,QAAiCC,KAAgB,SAC7CR,EAAoB,CAAC,IAAIQ;AAAA,MAEjC;AACA,MAAIR,EAAoB,CAAC,MAAM,WAC3BA,EAAoB,CAAC,IAAIO,IAEzBJ,KAAeG,MAAiB,UAChCH,EAAY,IAAIH,EAAoB,CAAC,CAAC;AAAA,IAE9C;AACA,IAAAS,EAAcT,CAAmB;AAAA,EACrC;AAAA,EACA,mBAAmB;AAAA,EAAE;AAAA,EACrB,sBAAsB;AAAA,EAAE;AAAA,EACxB,kBAAkB;AAAA,EAAE;AAAA,EACpB,kBAAkB;AAAA,EAAE;AAAA,EACpB,SAASU,IAAmB,IAAO;AAC/B,SAAK,QAAQ,YACb,KAAK,WAAW,KAAK,qBAAqB,KAAK,eAAeA,CAAgB,GAC9E5B,EAAU,OAAO,IAAI;AAAA,EACzB;AAAA,EACA,SAAS;AACL,IAAI,KAAK,UAAU,gBACfA,EAAU,OAAO,IAAI,GACrB,KAAK,QAAQ;AAAA,EAErB;AAAA,EACA,SAAS;AACL,IAAI,KAAK,UAAU,aACf,KAAK,gBAAe;AAAA,EAC5B;AACJ;","x_google_ignoreList":[0]}

package/dist/visualization.es3.js

@@ -1,20 +1,20 @@
 import { jsxs as s, Fragment as wt, jsx as n } from "react/jsx-runtime";
 import { c as ce } from "react/compiler-runtime";
 import { useRef as ae, useImperativeHandle as de, useState as fe } from "react";
-import { downloadSVGAsPNG as me, downloadAsSVG as he } from "./visualization.es22.js";
+import { downloadSVGAsPNG as me, downloadAsSVG as he } from "./visualization.es43.js";
 import { useResponsiveParentSize as pe } from "./visualization.es18.js";
-import Zt from "./visualization.es23.js";
+import Zt from "./visualization.es39.js";
 import Bt from "./visualization.es24.js";
-import ue from "./visualization.es46.js";
+import ue from "./visualization.es22.js";
 import q from "./visualization.es25.js";
-import ge from "./visualization.es47.js";
-import xe from "./visualization.es29.js";
-import J from "./visualization.es26.js";
-import ye from "./visualization.es48.js";
-import be from "./visualization.es49.js";
-import { defaultStyles as Se } from "./visualization.es50.js";
+import ge from "./visualization.es57.js";
+import xe from "./visualization.es50.js";
+import J from "./visualization.es36.js";
+import ye from "./visualization.es20.js";
+import be from "./visualization.es21.js";
+import { defaultStyles as Se } from "./visualization.es28.js";
 import { ResponsiveContainer as te } from "./visualization.es14.js";
-import Le from "./visualization.es28.js";
+import Le from "./visualization.es26.js";
 function we(o, t, i) {
   const y = [], X = (t - o) / (i - 1);
   let w = o;

package/dist/visualization.es30.js

@@ -1,55 +1,32 @@
-import { jsxs as m, jsx as o } from "react/jsx-runtime";
-import Y from "./visualization.es98.js";
-import { truncateTextToWidth as j, getLabelPlacement as A } from "./visualization.es99.js";
-import D, { useCallback as R } from "react";
-import E from "./visualization.es46.js";
-import F from "./visualization.es48.js";
-import $ from "./visualization.es49.js";
-const Z = (t) => {
-  function i(e) {
-    return e.children && e.children.length > 0 ? e.children.reduce((d, X) => d + i(X), 0) : e.data.value ?? 0;
-  }
-  const c = t.node.children !== void 0 && t.node.children.length > 0, r = c ? t.node.data.displayValue ?? i(t.node) : t.node.data.value ?? 0, k = t.fontSize, n = t.node.data.style?.color || t.node.parent?.data.style?.color || "black", h = t.node.data.style?.labelColor || n, x = t.node.data.style?.strokeColor || n, u = t.node.data.style?.strokeWidth === 0 ? 0 : t.node.data.style?.strokeWidth || t.strokeWidth, v = t.isHovered ? u + 2 : u, l = t.node.x1 - t.node.x0, a = t.node.y1 - t.node.y0, b = t.node.data.label, C = j(b, l - 8, k, "sans-serif"), f = a > 55 && l > 50 && r > 0, g = a > 20, {
-    textX: T,
-    textY: S,
-    textAnchor: W,
-    valueAnchor: B,
-    baseline: L,
-    valueY: M,
-    valueX: w
-  } = A(t.node, t.labelPlacement, f, c), {
-    tooltipData: s,
-    tooltipLeft: N,
-    tooltipTop: z,
-    tooltipOpen: V,
-    showTooltip: y,
-    hideTooltip: H
-  } = E(), O = R((e) => {
-    if (!t.tooltipBody) return;
-    const d = t.tooltipBody(t.node.data);
-    y({
-      tooltipLeft: e.clientX + 10,
-      tooltipTop: e.clientY + 10,
-      tooltipData: d
-    });
-  }, [t.tooltipBody, t.node.data, y]), P = () => {
-    t.onNodeClicked && t.onNodeClicked(t.node.data);
-  };
-  return /* @__PURE__ */ m(D.Fragment, { children: [
-    /* @__PURE__ */ m("g", { onMouseEnter: () => t.onHover(!0), onMouseLeave: () => {
-      t.onHover(!1), H?.();
-    }, onMouseMove: O, onClick: P, style: {
-      cursor: "pointer",
-      transition: "stroke-width 0.2s"
-    }, children: [
-      /* @__PURE__ */ o("rect", { x: t.node.x0, y: t.node.y0, width: l, height: a, fill: n, fillOpacity: t.opacity, stroke: x, strokeWidth: v, rx: t.borderRadius }),
-      g && /* @__PURE__ */ o("text", { x: T, y: S, textAnchor: W, dominantBaseline: L, fill: h, fontSize: t.fontSize, fontWeight: 500, children: C }),
-      f && /* @__PURE__ */ o(Y, { cx: w, cy: M, color: h, value: r, align: B })
-    ] }),
-    t.tooltipBody && V && s && /* @__PURE__ */ o(F, { children: /* @__PURE__ */ o($, { left: (N ?? 0) + 10, top: z, children: s }) })
-  ] }, `frag-${t.node.data.label}`);
-};
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import { memo as o } from "react";
+import { ControlPanel as c } from "./visualization.es91.js";
+import { ZoomSurface as d } from "./visualization.es92.js";
+import { TOTAL_INNER_DIAMETER as n } from "./visualization.es7.js";
+import m from "./visualization.es36.js";
+const x = o(function({
+  zoom: r,
+  totalWidth: i,
+  totalHeight: t,
+  children: g,
+  toggleBranchLength: s
+}) {
+  return /* @__PURE__ */ a("div", { style: {
+    position: "relative",
+    width: i,
+    height: t
+  }, children: [
+    /* @__PURE__ */ e(c, { scaleZoom: r.scale, resetZoom: r.reset, toggleBranchLength: s }),
+    /* @__PURE__ */ a("svg", { width: i, height: t, style: {
+      cursor: r.isDragging ? "grabbing" : "grab",
+      touchAction: "none"
+    }, viewBox: `0 0 ${n} ${n}`, preserveAspectRatio: "xMidYMid meet", ref: r.containerRef, children: [
+      /* @__PURE__ */ e(d, { dragStart: r.dragStart, dragEnd: r.dragEnd, dragMove: r.dragMove, scale: r.scale, isDragging: r.isDragging }),
+      /* @__PURE__ */ e(m, { transform: r.toString(), children: g })
+    ] })
+  ] });
+});
 export {
-  Z as default
+  x as ZoomFrame
 };
 //# sourceMappingURL=visualization.es30.js.map

package/dist/visualization.es30.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es30.js","sources":["../src/components/TreeMap/SingleNode.tsx"],"sourcesContent":["import { SingleNodeProps, TreemapNode } from \"./types\";\nimport ValueOval from \"./ValueOval\";\nimport { getLabelPlacement, truncateTextToWidth } from \"./helpers\";\nimport { ReactNode, useCallback } from \"react\";\nimport { Portal, TooltipWithBounds, useTooltip } from \"@visx/tooltip\";\nimport React from \"react\";\nimport { HierarchyRectangularNode } from \"@visx/hierarchy\";\n\nconst SingleNode = <T,>(\n    props: SingleNodeProps<T>\n) => {\n    function getNodeValue(node: HierarchyRectangularNode<TreemapNode<T>>): number {\n        // If the node has children, sum their values\n        if (node.children && node.children.length > 0) {\n            return node.children.reduce((sum: number, child) => {\n                return sum + getNodeValue(child);\n            }, 0);\n        }\n\n        // Otherwise use the leaf's data value\n        return node.data.value ?? 0;\n    }\n\n    const hasChildren = props.node.children !== undefined && props.node.children.length > 0;\n    \n    const value = hasChildren ? props.node.data.displayValue ?? getNodeValue(props.node) : props.node.data.value ?? 0\n\n    const fontSize = props.fontSize\n    const nodeColor = props.node.data.style?.color ||  props.node.parent?.data.style?.color || \"black\"\n    const labelColor = props.node.data.style?.labelColor || nodeColor;\n    const nodeStrokeColor = props.node.data.style?.strokeColor || nodeColor;\n    const nodeStroke = props.node.data.style?.strokeWidth === 0 ? 0 : props.node.data.style?.strokeWidth || props.strokeWidth;\n    const stroke = props.isHovered ? nodeStroke + 2 : nodeStroke;\n\n    const width = props.node.x1 - props.node.x0;\n    const height = props.node.y1 - props.node.y0;\n\n    const fullLabel = props.node.data.label;\n    const truncatedLabel = truncateTextToWidth(fullLabel, width - 8, fontSize, \"sans-serif\");\n    const showValue = height > 55 && width > 50 && value > 0;\n    const showText = height > 20;\n\n    const { textX, textY, textAnchor, valueAnchor, baseline, valueY, valueX } = getLabelPlacement(\n        props.node,\n        props.labelPlacement,\n        showValue,\n        hasChildren\n    );\n\n    const {\n        tooltipData,\n        tooltipLeft,\n        tooltipTop,\n        tooltipOpen,\n        showTooltip,\n        hideTooltip,\n    } = useTooltip<ReactNode>();\n\n    const handleMouseMove = useCallback(\n        (event: React.MouseEvent<SVGElement>) => {\n            if (!props.tooltipBody) return;\n\n            const tooltipContent = props.tooltipBody(props.node.data);\n\n            showTooltip({\n                tooltipLeft: event.clientX + 10,\n                tooltipTop: event.clientY + 10,\n                tooltipData: tooltipContent,\n            });\n        },\n        [props.tooltipBody, props.node.data, showTooltip]\n    );\n\n    const handleNodeClick = () => {\n        if (!props.onNodeClicked) return;\n        props.onNodeClicked(props.node.data);\n    };\n\n    return (\n        <React.Fragment key={`frag-${props.node.data.label}`}>\n            <g\n                onMouseEnter={() => props.onHover(true)}\n                onMouseLeave={() => {\n                    props.onHover(false);\n                    hideTooltip?.();\n                }}\n                onMouseMove={handleMouseMove}\n                onClick={handleNodeClick}\n                style={{ cursor: \"pointer\", transition: \"stroke-width 0.2s\" }}\n            >\n                <rect\n                    x={props.node.x0}\n                    y={props.node.y0}\n                    width={width}\n                    height={height}\n                    fill={nodeColor}\n                    fillOpacity={props.opacity}\n                    stroke={nodeStrokeColor}\n                    strokeWidth={stroke}\n                    rx={props.borderRadius}\n                />\n                {showText && (\n                    <text\n                        x={textX}\n                        y={textY}\n                        textAnchor={textAnchor}\n                        dominantBaseline={baseline}\n                        fill={labelColor}\n                        fontSize={props.fontSize}\n                        fontWeight={500}\n                    >\n                        {truncatedLabel}\n                    </text>\n                )}\n                {showValue && (\n                    <ValueOval\n                        cx={valueX}\n                        cy={valueY}\n                        color={labelColor}\n                        value={value}\n                        align={valueAnchor}\n                    />\n                )}\n            </g>\n            {props.tooltipBody && tooltipOpen && tooltipData && (\n                <Portal>\n                    <TooltipWithBounds left={(tooltipLeft ?? 0) + 10} top={tooltipTop}>\n                        {tooltipData}\n                    </TooltipWithBounds>\n                </Portal>\n            )}\n        </React.Fragment>\n    );\n};\n\nexport default SingleNode;"],"names":["SingleNode","props","getNodeValue","node","children","length","reduce","sum","child","data","value","hasChildren","undefined","displayValue","fontSize","nodeColor","style","color","parent","labelColor","nodeStrokeColor","strokeColor","nodeStroke","strokeWidth","stroke","isHovered","width","x1","x0","height","y1","y0","fullLabel","label","truncatedLabel","truncateTextToWidth","showValue","showText","textX","textY","textAnchor","valueAnchor","baseline","valueY","valueX","getLabelPlacement","labelPlacement","tooltipData","tooltipLeft","tooltipTop","tooltipOpen","showTooltip","hideTooltip","useTooltip","handleMouseMove","useCallback","event","tooltipBody","tooltipContent","clientX","clientY","handleNodeClick","onNodeClicked","jsxs","React","onHover","cursor","transition","jsx","opacity","borderRadius","ValueOval","Portal","TooltipWithBounds"],"mappings":"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"}
+{"version":3,"file":"visualization.es30.js","sources":["../src/components/PhyloTree/ZoomFrame.tsx"],"sourcesContent":["import { ProvidedZoom } from \"@visx/zoom\";\nimport { memo, ReactNode, useState } from \"react\";\nimport { ZoomState } from \"./types\";\nimport { ControlPanel } from \"./ControlPanel\";\nimport { ZoomSurface } from \"./ZoomSurface\";\nimport { Group } from \"@visx/group\";\nimport { TOTAL_INNER_DIAMETER } from \"./PhyloTree\";\n\nexport type ZoomFrameProps = {\n  zoom: ProvidedZoom<SVGSVGElement> & ZoomState;\n  totalHeight: number;\n  totalWidth: number;\n  toggleBranchLength: () => void;\n  children: ReactNode\n};\n\nexport const ZoomFrame = memo(function({ zoom, totalWidth, totalHeight, children, toggleBranchLength }: ZoomFrameProps) {\n  return (\n    <div\n      style={{\n        position: \"relative\",\n        width: totalWidth,\n        height: totalHeight,\n      }}\n    >\n      <ControlPanel scaleZoom={zoom.scale} resetZoom={zoom.reset} toggleBranchLength={toggleBranchLength} />\n      <svg\n        width={totalWidth}\n        height={totalHeight}\n        style={{ cursor: zoom.isDragging ? \"grabbing\" : \"grab\", touchAction: \"none\" }}\n        viewBox={`0 0 ${TOTAL_INNER_DIAMETER} ${TOTAL_INNER_DIAMETER}`}\n        preserveAspectRatio=\"xMidYMid meet\"\n        ref={zoom.containerRef}\n      >\n        <ZoomSurface\n          dragStart={zoom.dragStart}\n          dragEnd={zoom.dragEnd}\n          dragMove={zoom.dragMove}\n          scale={zoom.scale}\n          isDragging={zoom.isDragging}\n        />\n        <Group transform={zoom.toString()}>\n          {children}\n        </Group>\n      </svg>\n    </div>\n  );\n});\n"],"names":["ZoomFrame","memo","zoom","totalWidth","totalHeight","children","toggleBranchLength","jsxs","position","width","height","jsx","ControlPanel","scale","reset","cursor","isDragging","touchAction","TOTAL_INNER_DIAMETER","containerRef","ZoomSurface","dragStart","dragEnd","dragMove","Group","toString"],"mappings":";;;;;;AAgBO,MAAMA,IAAYC,EAAK,SAAS;AAAA,EAAEC,MAAAA;AAAAA,EAAMC,YAAAA;AAAAA,EAAYC,aAAAA;AAAAA,EAAaC,UAAAA;AAAAA,EAAUC,oBAAAA;AAAmC,GAAG;AACtH,SACE,gBAAAC,EAAC,SACC,OAAO;AAAA,IACLC,UAAU;AAAA,IACVC,OAAON;AAAAA,IACPO,QAAQN;AAAAA,EAAAA,GAGV,UAAA;AAAA,IAAA,gBAAAO,EAACC,KAAa,WAAWV,EAAKW,OAAO,WAAWX,EAAKY,OAAO,oBAAAR,GAAuC;AAAA,sBAClG,OAAA,EACC,OAAOH,GACP,QAAQC,GACR,OAAO;AAAA,MAAEW,QAAQb,EAAKc,aAAa,aAAa;AAAA,MAAQC,aAAa;AAAA,IAAA,GACrE,SAAS,OAAOC,CAAoB,IAAIA,CAAoB,IAC5D,qBAAoB,iBACpB,KAAKhB,EAAKiB,cAEV,UAAA;AAAA,MAAA,gBAAAR,EAACS,GAAA,EACC,WAAWlB,EAAKmB,WAChB,SAASnB,EAAKoB,SACd,UAAUpB,EAAKqB,UACf,OAAOrB,EAAKW,OACZ,YAAYX,EAAKc,YAAW;AAAA,wBAE7BQ,GAAA,EAAM,WAAWtB,EAAKuB,SAAAA,GACpBpB,UAAAA,EAAAA,CACH;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GACF;AAEJ,CAAC;"}

package/dist/visualization.es300.js

@@ -1,26 +1,39 @@
-import { createProjectionNode as t } from "./visualization.es473.js";
-import { DocumentProjectionNode as n } from "./visualization.es476.js";
-const e = {
-  current: void 0
-}, i = t({
-  measureScroll: (o) => ({
-    x: o.scrollLeft,
-    y: o.scrollTop
-  }),
-  defaultParent: () => {
-    if (!e.current) {
-      const o = new n({});
-      o.mount(window), o.setOptions({ layoutScroll: !0 }), e.current = o;
+import { time as p } from "./visualization.es296.js";
+import { setStyle as c } from "./visualization.es319.js";
+import { JSAnimation as f } from "./visualization.es297.js";
+import { NativeAnimation as u } from "./visualization.es318.js";
+import { replaceTransitionType as d } from "./visualization.es313.js";
+import { replaceStringEasing as h } from "./visualization.es323.js";
+import { clamp as T } from "./visualization.es317.js";
+const o = 10;
+class N extends u {
+  constructor(t) {
+    h(t), d(t), super(t), t.startTime !== void 0 && t.autoplay !== !1 && (this.startTime = t.startTime), this.options = t;
+  }
+  /**
+   * WAAPI doesn't natively have any interruption capabilities.
+   *
+   * Rather than read committed styles back out of the DOM, we can
+   * create a renderless JS animation and sample it twice to calculate
+   * its current value, "previous" value, and therefore allow
+   * Motion to calculate velocity for any subsequent animation.
+   */
+  updateMotionValue(t) {
+    const { motionValue: e, onUpdate: y, onComplete: A, element: m, ...l } = this.options;
+    if (!e)
+      return;
+    if (t !== void 0) {
+      e.set(t);
+      return;
     }
-    return e.current;
-  },
-  resetTransform: (o, r) => {
-    o.style.transform = r !== void 0 ? r : "none";
-  },
-  checkIsScrollRoot: (o) => window.getComputedStyle(o).position === "fixed"
-});
+    const i = new f({
+      ...l,
+      autoplay: !1
+    }), a = Math.max(o, p.now() - this.startTime), n = T(0, o, a - o), r = i.sample(a).value, { name: s } = this.options;
+    m && s && c(m, s, r), e.setWithVelocity(i.sample(Math.max(0, a - n)).value, r, n), i.stop();
+  }
+}
 export {
-  i as HTMLProjectionNode,
-  e as rootProjectionNode
+  N as NativeAnimationExtended
 };
 //# sourceMappingURL=visualization.es300.js.map

package/dist/visualization.es300.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es300.js","sources":["../../../node_modules/.pnpm/motion-dom@12.38.0/node_modules/motion-dom/dist/es/projection/node/HTMLProjectionNode.mjs"],"sourcesContent":["import { createProjectionNode } from './create-projection-node.mjs';\nimport { DocumentProjectionNode } from './DocumentProjectionNode.mjs';\n\nconst rootProjectionNode = {\n    current: undefined,\n};\nconst HTMLProjectionNode = createProjectionNode({\n    measureScroll: (instance) => ({\n        x: instance.scrollLeft,\n        y: instance.scrollTop,\n    }),\n    defaultParent: () => {\n        if (!rootProjectionNode.current) {\n            const documentNode = new DocumentProjectionNode({});\n            documentNode.mount(window);\n            documentNode.setOptions({ layoutScroll: true });\n            rootProjectionNode.current = documentNode;\n        }\n        return rootProjectionNode.current;\n    },\n    resetTransform: (instance, value) => {\n        instance.style.transform = value !== undefined ? value : \"none\";\n    },\n    checkIsScrollRoot: (instance) => Boolean(window.getComputedStyle(instance).position === \"fixed\"),\n});\n\nexport { HTMLProjectionNode, rootProjectionNode };\n//# sourceMappingURL=HTMLProjectionNode.mjs.map\n"],"names":["rootProjectionNode","HTMLProjectionNode","createProjectionNode","instance","documentNode","DocumentProjectionNode","value"],"mappings":";;AAGK,MAACA,IAAqB;AAAA,EACvB,SAAS;AACb,GACMC,IAAqBC,EAAqB;AAAA,EAC5C,eAAe,CAACC,OAAc;AAAA,IAC1B,GAAGA,EAAS;AAAA,IACZ,GAAGA,EAAS;AAAA,EACpB;AAAA,EACI,eAAe,MAAM;AACjB,QAAI,CAACH,EAAmB,SAAS;AAC7B,YAAMI,IAAe,IAAIC,EAAuB,EAAE;AAClD,MAAAD,EAAa,MAAM,MAAM,GACzBA,EAAa,WAAW,EAAE,cAAc,GAAI,CAAE,GAC9CJ,EAAmB,UAAUI;AAAA,IACjC;AACA,WAAOJ,EAAmB;AAAA,EAC9B;AAAA,EACA,gBAAgB,CAACG,GAAUG,MAAU;AACjC,IAAAH,EAAS,MAAM,YAAYG,MAAU,SAAYA,IAAQ;AAAA,EAC7D;AAAA,EACA,mBAAmB,CAACH,MAAqB,OAAO,iBAAiBA,CAAQ,EAAE,aAAa;AAC5F,CAAC;","x_google_ignoreList":[0]}
+{"version":3,"file":"visualization.es300.js","sources":["../../../node_modules/.pnpm/motion-dom@12.38.0/node_modules/motion-dom/dist/es/animation/NativeAnimationExtended.mjs"],"sourcesContent":["import { clamp } from 'motion-utils';\nimport { time } from '../frameloop/sync-time.mjs';\nimport { setStyle } from '../render/dom/style-set.mjs';\nimport { JSAnimation } from './JSAnimation.mjs';\nimport { NativeAnimation } from './NativeAnimation.mjs';\nimport { replaceTransitionType } from './utils/replace-transition-type.mjs';\nimport { replaceStringEasing } from './waapi/utils/unsupported-easing.mjs';\n\n/**\n * 10ms is chosen here as it strikes a balance between smooth\n * results (more than one keyframe per frame at 60fps) and\n * keyframe quantity.\n */\nconst sampleDelta = 10; //ms\nclass NativeAnimationExtended extends NativeAnimation {\n    constructor(options) {\n        /**\n         * The base NativeAnimation function only supports a subset\n         * of Motion easings, and WAAPI also only supports some\n         * easing functions via string/cubic-bezier definitions.\n         *\n         * This function replaces those unsupported easing functions\n         * with a JS easing function. This will later get compiled\n         * to a linear() easing function.\n         */\n        replaceStringEasing(options);\n        /**\n         * Ensure we replace the transition type with a generator function\n         * before passing to WAAPI.\n         *\n         * TODO: Does this have a better home? It could be shared with\n         * JSAnimation.\n         */\n        replaceTransitionType(options);\n        super(options);\n        /**\n         * Only set startTime when the animation should autoplay.\n         * Setting startTime on a paused WAAPI animation unpauses it\n         * (per the WAAPI spec), which breaks autoplay: false.\n         */\n        if (options.startTime !== undefined && options.autoplay !== false) {\n            this.startTime = options.startTime;\n        }\n        this.options = options;\n    }\n    /**\n     * WAAPI doesn't natively have any interruption capabilities.\n     *\n     * Rather than read committed styles back out of the DOM, we can\n     * create a renderless JS animation and sample it twice to calculate\n     * its current value, \"previous\" value, and therefore allow\n     * Motion to calculate velocity for any subsequent animation.\n     */\n    updateMotionValue(value) {\n        const { motionValue, onUpdate, onComplete, element, ...options } = this.options;\n        if (!motionValue)\n            return;\n        if (value !== undefined) {\n            motionValue.set(value);\n            return;\n        }\n        const sampleAnimation = new JSAnimation({\n            ...options,\n            autoplay: false,\n        });\n        /**\n         * Use wall-clock elapsed time for sampling.\n         * Under CPU load, WAAPI's currentTime may not reflect actual\n         * elapsed time, causing incorrect sampling and visual jumps.\n         */\n        const sampleTime = Math.max(sampleDelta, time.now() - this.startTime);\n        const delta = clamp(0, sampleDelta, sampleTime - sampleDelta);\n        const current = sampleAnimation.sample(sampleTime).value;\n        /**\n         * Write the estimated value to inline style so it persists\n         * after cancel(), covering the async gap before the next\n         * animation starts.\n         */\n        const { name } = this.options;\n        if (element && name)\n            setStyle(element, name, current);\n        motionValue.setWithVelocity(sampleAnimation.sample(Math.max(0, sampleTime - delta)).value, current, delta);\n        sampleAnimation.stop();\n    }\n}\n\nexport { NativeAnimationExtended };\n//# sourceMappingURL=NativeAnimationExtended.mjs.map\n"],"names":["sampleDelta","NativeAnimationExtended","NativeAnimation","options","replaceStringEasing","replaceTransitionType","value","motionValue","onUpdate","onComplete","element","sampleAnimation","JSAnimation","sampleTime","time","delta","clamp","current","name","setStyle"],"mappings":";;;;;;;AAaA,MAAMA,IAAc;AACpB,MAAMC,UAAgCC,EAAgB;AAAA,EAClD,YAAYC,GAAS;AAUjB,IAAAC,EAAoBD,CAAO,GAQ3BE,EAAsBF,CAAO,GAC7B,MAAMA,CAAO,GAMTA,EAAQ,cAAc,UAAaA,EAAQ,aAAa,OACxD,KAAK,YAAYA,EAAQ,YAE7B,KAAK,UAAUA;AAAA,EACnB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASA,kBAAkBG,GAAO;AACrB,UAAM,EAAE,aAAAC,GAAa,UAAAC,GAAU,YAAAC,GAAY,SAAAC,GAAS,GAAGP,EAAO,IAAK,KAAK;AACxE,QAAI,CAACI;AACD;AACJ,QAAID,MAAU,QAAW;AACrB,MAAAC,EAAY,IAAID,CAAK;AACrB;AAAA,IACJ;AACA,UAAMK,IAAkB,IAAIC,EAAY;AAAA,MACpC,GAAGT;AAAA,MACH,UAAU;AAAA,IACtB,CAAS,GAMKU,IAAa,KAAK,IAAIb,GAAac,EAAK,IAAG,IAAK,KAAK,SAAS,GAC9DC,IAAQC,EAAM,GAAGhB,GAAaa,IAAab,CAAW,GACtDiB,IAAUN,EAAgB,OAAOE,CAAU,EAAE,OAM7C,EAAE,MAAAK,MAAS,KAAK;AACtB,IAAIR,KAAWQ,KACXC,EAAST,GAASQ,GAAMD,CAAO,GACnCV,EAAY,gBAAgBI,EAAgB,OAAO,KAAK,IAAI,GAAGE,IAAaE,CAAK,CAAC,EAAE,OAAOE,GAASF,CAAK,GACzGJ,EAAgB,KAAI;AAAA,EACxB;AACJ;","x_google_ignoreList":[0]}

package/dist/visualization.es301.js

@@ -1,113 +1,24 @@
-import { time as v } from "./visualization.es302.js";
-import { JSAnimation as A } from "./visualization.es303.js";
-import { getFinalKeyframe as y } from "./visualization.es304.js";
-import { KeyframeResolver as g, flushKeyframeResolvers as R } from "./visualization.es305.js";
-import { NativeAnimationExtended as T } from "./visualization.es306.js";
-import { canAnimate as _ } from "./visualization.es307.js";
-import { makeAnimationInstant as w } from "./visualization.es308.js";
-import { WithPromise as K } from "./visualization.es309.js";
-import { supportsBrowserAnimation as D } from "./visualization.es310.js";
-import { MotionGlobalConfig as E } from "./visualization.es311.js";
-import { noop as k } from "./visualization.es312.js";
-const x = 40;
-class H extends K {
-  constructor({ autoplay: t = !0, delay: s = 0, type: e = "keyframes", repeat: h = 0, repeatDelay: l = 0, repeatType: f = "loop", keyframes: d, name: o, motionValue: r, element: a, ...m }) {
-    super(), this.stop = () => {
-      this._animation && (this._animation.stop(), this.stopTimeline?.()), this.keyframeResolver?.cancel();
-    }, this.createdAt = v.now();
-    const u = {
-      autoplay: t,
-      delay: s,
-      type: e,
-      repeat: h,
-      repeatDelay: l,
-      repeatType: f,
-      name: o,
-      motionValue: r,
-      element: a,
-      ...m
-    }, n = a?.KeyframeResolver || g;
-    this.keyframeResolver = new n(d, (c, p, i) => this.onKeyframesResolved(c, p, u, !i), o, r, a), this.keyframeResolver?.scheduleResolve();
-  }
-  onKeyframesResolved(t, s, e, h) {
-    this.keyframeResolver = void 0;
-    const { name: l, type: f, velocity: d, delay: o, isHandoff: r, onUpdate: a } = e;
-    this.resolvedAt = v.now();
-    let m = !0;
-    _(t, l, f, d) || (m = !1, (E.instantAnimations || !o) && a?.(y(t, e, s)), t[0] = t[t.length - 1], w(e), e.repeat = 0);
-    const n = {
-      startTime: h ? this.resolvedAt ? this.resolvedAt - this.createdAt > x ? this.resolvedAt : this.createdAt : this.createdAt : void 0,
-      finalKeyframe: s,
-      ...e,
-      keyframes: t
-    }, c = m && !r && D(n), p = n.motionValue?.owner?.current;
-    let i;
-    if (c)
-      try {
-        i = new T({
-          ...n,
-          element: p
-        });
-      } catch {
-        i = new A(n);
-      }
-    else
-      i = new A(n);
-    i.finished.then(() => {
-      this.notifyFinished();
-    }).catch(k), this.pendingTimeline && (this.stopTimeline = i.attachTimeline(this.pendingTimeline), this.pendingTimeline = void 0), this._animation = i;
-  }
-  get finished() {
-    return this._animation ? this.animation.finished : this._finished;
-  }
-  then(t, s) {
-    return this.finished.finally(t).then(() => {
-    });
-  }
-  get animation() {
-    return this._animation || (this.keyframeResolver?.resume(), R()), this._animation;
-  }
-  get duration() {
-    return this.animation.duration;
-  }
-  get iterationDuration() {
-    return this.animation.iterationDuration;
-  }
-  get time() {
-    return this.animation.time;
-  }
-  set time(t) {
-    this.animation.time = t;
-  }
-  get speed() {
-    return this.animation.speed;
-  }
-  get state() {
-    return this.animation.state;
-  }
-  set speed(t) {
-    this.animation.speed = t;
-  }
-  get startTime() {
-    return this.animation.startTime;
-  }
-  attachTimeline(t) {
-    return this._animation ? this.stopTimeline = this.animation.attachTimeline(t) : this.pendingTimeline = t, () => this.stop();
-  }
-  play() {
-    this.animation.play();
-  }
-  pause() {
-    this.animation.pause();
-  }
-  complete() {
-    this.animation.complete();
-  }
-  cancel() {
-    this._animation && this.animation.cancel(), this.keyframeResolver?.cancel();
-  }
+import { isGenerator as f } from "./visualization.es352.js";
+import { isAnimatable as l } from "./visualization.es539.js";
+import { warning as g } from "./visualization.es314.js";
+function s(t) {
+  const i = t[0];
+  if (t.length === 1)
+    return !0;
+  for (let n = 0; n < t.length; n++)
+    if (t[n] !== i)
+      return !0;
+}
+function h(t, i, n, u) {
+  const r = t[0];
+  if (r === null)
+    return !1;
+  if (i === "display" || i === "visibility")
+    return !0;
+  const o = t[t.length - 1], a = l(r, i), e = l(o, i);
+  return g(a === e, `You are trying to animate ${i} from "${r}" to "${o}". "${a ? o : r}" is not an animatable value.`, "value-not-animatable"), !a || !e ? !1 : s(t) || (n === "spring" || f(n)) && u;
 }
 export {
-  H as AsyncMotionValueAnimation
+  h as canAnimate
 };
 //# sourceMappingURL=visualization.es301.js.map