@weng-lab/visualization 2.4.0-beta.6 → 2.4.0-beta.8

package/dist/visualization.es298.js

@@ -1,25 +1,113 @@
-import { lowercaseSVGElements as r } from "./visualization.es538.js";
-function s(e) {
-  return (
-    /**
-     * If it's not a string, it's a custom React component. Currently we only support
-     * HTML custom React components.
-     */
-    typeof e != "string" || /**
-     * If it contains a dash, the element is a custom HTML webcomponent.
-     */
-    e.includes("-") ? !1 : (
-      /**
-       * If it's in our list of lowercase SVG tags, it's an SVG component
-       */
-      !!(r.indexOf(e) > -1 || /**
-       * If it contains a capital letter, it's an SVG component
-       */
-      /[A-Z]/u.test(e))
-    )
-  );
+import { time as v } from "./visualization.es299.js";
+import { JSAnimation as A } from "./visualization.es300.js";
+import { getFinalKeyframe as y } from "./visualization.es301.js";
+import { KeyframeResolver as g, flushKeyframeResolvers as R } from "./visualization.es302.js";
+import { NativeAnimationExtended as T } from "./visualization.es303.js";
+import { canAnimate as _ } from "./visualization.es304.js";
+import { makeAnimationInstant as w } from "./visualization.es305.js";
+import { WithPromise as K } from "./visualization.es306.js";
+import { supportsBrowserAnimation as D } from "./visualization.es307.js";
+import { MotionGlobalConfig as E } from "./visualization.es308.js";
+import { noop as k } from "./visualization.es309.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();
+  }
 }
 export {
-  s as isSVGComponent
+  H as AsyncMotionValueAnimation
 };
 //# sourceMappingURL=visualization.es298.js.map

package/dist/visualization.es298.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es298.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/render/dom/utils/is-svg-component.mjs"],"sourcesContent":["import { lowercaseSVGElements } from '../../svg/lowercase-elements.mjs';\n\nfunction isSVGComponent(Component) {\n    if (\n    /**\n     * If it's not a string, it's a custom React component. Currently we only support\n     * HTML custom React components.\n     */\n    typeof Component !== \"string\" ||\n        /**\n         * If it contains a dash, the element is a custom HTML webcomponent.\n         */\n        Component.includes(\"-\")) {\n        return false;\n    }\n    else if (\n    /**\n     * If it's in our list of lowercase SVG tags, it's an SVG component\n     */\n    lowercaseSVGElements.indexOf(Component) > -1 ||\n        /**\n         * If it contains a capital letter, it's an SVG component\n         */\n        /[A-Z]/u.test(Component)) {\n        return true;\n    }\n    return false;\n}\n\nexport { isSVGComponent };\n//# sourceMappingURL=is-svg-component.mjs.map\n"],"names":["isSVGComponent","Component","lowercaseSVGElements"],"mappings":";AAEA,SAASA,EAAeC,GAAW;AAC/B;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAOA,KAAc;AAAA;AAAA;AAAA,IAIjBA,EAAU,SAAS,GAAG,IACf;AAAA;AAAA;AAAA;AAAA,MAMX,GAAAC,EAAqB,QAAQD,CAAS,IAAI;AAAA;AAAA;AAAA,MAItC,SAAS,KAAKA,CAAS;AAAA;AAAA;AAI/B;","x_google_ignoreList":[0]}
+{"version":3,"file":"visualization.es298.js","sources":["../../../node_modules/.pnpm/motion-dom@12.38.0/node_modules/motion-dom/dist/es/animation/AsyncMotionValueAnimation.mjs"],"sourcesContent":["import { MotionGlobalConfig, noop } from 'motion-utils';\nimport { time } from '../frameloop/sync-time.mjs';\nimport { JSAnimation } from './JSAnimation.mjs';\nimport { getFinalKeyframe } from './keyframes/get-final.mjs';\nimport { KeyframeResolver, flushKeyframeResolvers } from './keyframes/KeyframesResolver.mjs';\nimport { NativeAnimationExtended } from './NativeAnimationExtended.mjs';\nimport { canAnimate } from './utils/can-animate.mjs';\nimport { makeAnimationInstant } from './utils/make-animation-instant.mjs';\nimport { WithPromise } from './utils/WithPromise.mjs';\nimport { supportsBrowserAnimation } from './waapi/supports/waapi.mjs';\n\n/**\n * Maximum time allowed between an animation being created and it being\n * resolved for us to use the latter as the start time.\n *\n * This is to ensure that while we prefer to \"start\" an animation as soon\n * as it's triggered, we also want to avoid a visual jump if there's a big delay\n * between these two moments.\n */\nconst MAX_RESOLVE_DELAY = 40;\nclass AsyncMotionValueAnimation extends WithPromise {\n    constructor({ autoplay = true, delay = 0, type = \"keyframes\", repeat = 0, repeatDelay = 0, repeatType = \"loop\", keyframes, name, motionValue, element, ...options }) {\n        super();\n        /**\n         * Bound to support return animation.stop pattern\n         */\n        this.stop = () => {\n            if (this._animation) {\n                this._animation.stop();\n                this.stopTimeline?.();\n            }\n            this.keyframeResolver?.cancel();\n        };\n        this.createdAt = time.now();\n        const optionsWithDefaults = {\n            autoplay,\n            delay,\n            type,\n            repeat,\n            repeatDelay,\n            repeatType,\n            name,\n            motionValue,\n            element,\n            ...options,\n        };\n        const KeyframeResolver$1 = element?.KeyframeResolver || KeyframeResolver;\n        this.keyframeResolver = new KeyframeResolver$1(keyframes, (resolvedKeyframes, finalKeyframe, forced) => this.onKeyframesResolved(resolvedKeyframes, finalKeyframe, optionsWithDefaults, !forced), name, motionValue, element);\n        this.keyframeResolver?.scheduleResolve();\n    }\n    onKeyframesResolved(keyframes, finalKeyframe, options, sync) {\n        this.keyframeResolver = undefined;\n        const { name, type, velocity, delay, isHandoff, onUpdate } = options;\n        this.resolvedAt = time.now();\n        /**\n         * If we can't animate this value with the resolved keyframes\n         * then we should complete it immediately.\n         */\n        let canAnimateValue = true;\n        if (!canAnimate(keyframes, name, type, velocity)) {\n            canAnimateValue = false;\n            if (MotionGlobalConfig.instantAnimations || !delay) {\n                onUpdate?.(getFinalKeyframe(keyframes, options, finalKeyframe));\n            }\n            keyframes[0] = keyframes[keyframes.length - 1];\n            makeAnimationInstant(options);\n            options.repeat = 0;\n        }\n        /**\n         * Resolve startTime for the animation.\n         *\n         * This method uses the createdAt and resolvedAt to calculate the\n         * animation startTime. *Ideally*, we would use the createdAt time as t=0\n         * as the following frame would then be the first frame of the animation in\n         * progress, which would feel snappier.\n         *\n         * However, if there's a delay (main thread work) between the creation of\n         * the animation and the first committed frame, we prefer to use resolvedAt\n         * to avoid a sudden jump into the animation.\n         */\n        const startTime = sync\n            ? !this.resolvedAt\n                ? this.createdAt\n                : this.resolvedAt - this.createdAt > MAX_RESOLVE_DELAY\n                    ? this.resolvedAt\n                    : this.createdAt\n            : undefined;\n        const resolvedOptions = {\n            startTime,\n            finalKeyframe,\n            ...options,\n            keyframes,\n        };\n        /**\n         * Animate via WAAPI if possible. If this is a handoff animation, the optimised animation will be running via\n         * WAAPI. Therefore, this animation must be JS to ensure it runs \"under\" the\n         * optimised animation.\n         *\n         * Also skip WAAPI when keyframes aren't animatable, as the resolved\n         * values may not be valid CSS and would trigger browser warnings.\n         */\n        const useWaapi = canAnimateValue &&\n            !isHandoff &&\n            supportsBrowserAnimation(resolvedOptions);\n        const element = resolvedOptions.motionValue?.owner?.current;\n        let animation;\n        if (useWaapi) {\n            try {\n                animation = new NativeAnimationExtended({\n                    ...resolvedOptions,\n                    element,\n                });\n            }\n            catch {\n                animation = new JSAnimation(resolvedOptions);\n            }\n        }\n        else {\n            animation = new JSAnimation(resolvedOptions);\n        }\n        animation.finished.then(() => {\n            this.notifyFinished();\n        }).catch(noop);\n        if (this.pendingTimeline) {\n            this.stopTimeline = animation.attachTimeline(this.pendingTimeline);\n            this.pendingTimeline = undefined;\n        }\n        this._animation = animation;\n    }\n    get finished() {\n        if (!this._animation) {\n            return this._finished;\n        }\n        else {\n            return this.animation.finished;\n        }\n    }\n    then(onResolve, _onReject) {\n        return this.finished.finally(onResolve).then(() => { });\n    }\n    get animation() {\n        if (!this._animation) {\n            this.keyframeResolver?.resume();\n            flushKeyframeResolvers();\n        }\n        return this._animation;\n    }\n    get duration() {\n        return this.animation.duration;\n    }\n    get iterationDuration() {\n        return this.animation.iterationDuration;\n    }\n    get time() {\n        return this.animation.time;\n    }\n    set time(newTime) {\n        this.animation.time = newTime;\n    }\n    get speed() {\n        return this.animation.speed;\n    }\n    get state() {\n        return this.animation.state;\n    }\n    set speed(newSpeed) {\n        this.animation.speed = newSpeed;\n    }\n    get startTime() {\n        return this.animation.startTime;\n    }\n    attachTimeline(timeline) {\n        if (this._animation) {\n            this.stopTimeline = this.animation.attachTimeline(timeline);\n        }\n        else {\n            this.pendingTimeline = timeline;\n        }\n        return () => this.stop();\n    }\n    play() {\n        this.animation.play();\n    }\n    pause() {\n        this.animation.pause();\n    }\n    complete() {\n        this.animation.complete();\n    }\n    cancel() {\n        if (this._animation) {\n            this.animation.cancel();\n        }\n        this.keyframeResolver?.cancel();\n    }\n}\n\nexport { AsyncMotionValueAnimation };\n//# sourceMappingURL=AsyncMotionValueAnimation.mjs.map\n"],"names":["MAX_RESOLVE_DELAY","AsyncMotionValueAnimation","WithPromise","autoplay","delay","type","repeat","repeatDelay","repeatType","keyframes","name","motionValue","element","options","time","optionsWithDefaults","KeyframeResolver$1","KeyframeResolver","resolvedKeyframes","finalKeyframe","forced","sync","velocity","isHandoff","onUpdate","canAnimateValue","canAnimate","MotionGlobalConfig","getFinalKeyframe","makeAnimationInstant","resolvedOptions","useWaapi","supportsBrowserAnimation","animation","NativeAnimationExtended","JSAnimation","noop","onResolve","_onReject","flushKeyframeResolvers","newTime","newSpeed","timeline"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/visualization.es299.js

@@ -1,41 +1,16 @@
-import { transformProps as s } from "./visualization.es341.js";
-import { getDefaultValueType as a } from "./visualization.es429.js";
-import { createBox as m } from "./visualization.es445.js";
-import { DOMVisualElement as i } from "./visualization.es439.js";
-import { camelToDash as u } from "./visualization.es355.js";
-import { buildSVGAttrs as n } from "./visualization.es446.js";
-import { camelCaseAttributes as p } from "./visualization.es447.js";
-import { isSVGTag as l } from "./visualization.es448.js";
-import { renderSVG as f } from "./visualization.es449.js";
-import { scrapeMotionValuesFromProps as V } from "./visualization.es450.js";
-class A extends i {
-  constructor() {
-    super(...arguments), this.type = "svg", this.isSVGTag = !1, this.measureInstanceViewportBox = m;
-  }
-  getBaseTargetFromProps(t, r) {
-    return t[r];
-  }
-  readValueFromInstance(t, r) {
-    if (s.has(r)) {
-      const e = a(r);
-      return e && e.default || 0;
-    }
-    return r = p.has(r) ? r : u(r), t.getAttribute(r);
-  }
-  scrapeMotionValuesFromProps(t, r, e) {
-    return V(t, r, e);
-  }
-  build(t, r, e) {
-    n(t, r, this.isSVGTag, e.transformTemplate, e.style);
-  }
-  renderInstance(t, r, e, o) {
-    f(t, r, e, o);
-  }
-  mount(t) {
-    this.isSVGTag = l(t.tagName), super.mount(t);
-  }
+import { frameData as n } from "./visualization.es337.js";
+import { MotionGlobalConfig as i } from "./visualization.es308.js";
+let e;
+function t() {
+  e = void 0;
 }
+const r = {
+  now: () => (e === void 0 && r.set(n.isProcessing || i.useManualTiming ? n.timestamp : performance.now()), e),
+  set: (o) => {
+    e = o, queueMicrotask(t);
+  }
+};
 export {
-  A as SVGVisualElement
+  r as time
 };
 //# sourceMappingURL=visualization.es299.js.map

package/dist/visualization.es299.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es299.js","sources":["../../../node_modules/.pnpm/motion-dom@12.38.0/node_modules/motion-dom/dist/es/render/svg/SVGVisualElement.mjs"],"sourcesContent":["import { transformProps } from '../utils/keys-transform.mjs';\nimport { getDefaultValueType } from '../../value/types/maps/defaults.mjs';\nimport { createBox } from '../../projection/geometry/models.mjs';\nimport { DOMVisualElement } from '../dom/DOMVisualElement.mjs';\nimport { camelToDash } from '../dom/utils/camel-to-dash.mjs';\nimport { buildSVGAttrs } from './utils/build-attrs.mjs';\nimport { camelCaseAttributes } from './utils/camel-case-attrs.mjs';\nimport { isSVGTag } from './utils/is-svg-tag.mjs';\nimport { renderSVG } from './utils/render.mjs';\nimport { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.mjs';\n\nclass SVGVisualElement extends DOMVisualElement {\n    constructor() {\n        super(...arguments);\n        this.type = \"svg\";\n        this.isSVGTag = false;\n        this.measureInstanceViewportBox = createBox;\n    }\n    getBaseTargetFromProps(props, key) {\n        return props[key];\n    }\n    readValueFromInstance(instance, key) {\n        if (transformProps.has(key)) {\n            const defaultType = getDefaultValueType(key);\n            return defaultType ? defaultType.default || 0 : 0;\n        }\n        key = !camelCaseAttributes.has(key) ? camelToDash(key) : key;\n        return instance.getAttribute(key);\n    }\n    scrapeMotionValuesFromProps(props, prevProps, visualElement) {\n        return scrapeMotionValuesFromProps(props, prevProps, visualElement);\n    }\n    build(renderState, latestValues, props) {\n        buildSVGAttrs(renderState, latestValues, this.isSVGTag, props.transformTemplate, props.style);\n    }\n    renderInstance(instance, renderState, styleProp, projection) {\n        renderSVG(instance, renderState, styleProp, projection);\n    }\n    mount(instance) {\n        this.isSVGTag = isSVGTag(instance.tagName);\n        super.mount(instance);\n    }\n}\n\nexport { SVGVisualElement };\n//# sourceMappingURL=SVGVisualElement.mjs.map\n"],"names":["SVGVisualElement","DOMVisualElement","createBox","props","key","instance","transformProps","defaultType","getDefaultValueType","camelCaseAttributes","camelToDash","prevProps","visualElement","scrapeMotionValuesFromProps","renderState","latestValues","buildSVGAttrs","styleProp","projection","renderSVG","isSVGTag"],"mappings":";;;;;;;;;;AAWA,MAAMA,UAAyBC,EAAiB;AAAA,EAC5C,cAAc;AACV,UAAM,GAAG,SAAS,GAClB,KAAK,OAAO,OACZ,KAAK,WAAW,IAChB,KAAK,6BAA6BC;AAAA,EACtC;AAAA,EACA,uBAAuBC,GAAOC,GAAK;AAC/B,WAAOD,EAAMC,CAAG;AAAA,EACpB;AAAA,EACA,sBAAsBC,GAAUD,GAAK;AACjC,QAAIE,EAAe,IAAIF,CAAG,GAAG;AACzB,YAAMG,IAAcC,EAAoBJ,CAAG;AAC3C,aAAOG,KAAcA,EAAY,WAAW;AAAA,IAChD;AACA,WAAAH,IAAOK,EAAoB,IAAIL,CAAG,IAAuBA,IAAnBM,EAAYN,CAAG,GAC9CC,EAAS,aAAaD,CAAG;AAAA,EACpC;AAAA,EACA,4BAA4BD,GAAOQ,GAAWC,GAAe;AACzD,WAAOC,EAA4BV,GAAOQ,GAAWC,CAAa;AAAA,EACtE;AAAA,EACA,MAAME,GAAaC,GAAcZ,GAAO;AACpC,IAAAa,EAAcF,GAAaC,GAAc,KAAK,UAAUZ,EAAM,mBAAmBA,EAAM,KAAK;AAAA,EAChG;AAAA,EACA,eAAeE,GAAUS,GAAaG,GAAWC,GAAY;AACzD,IAAAC,EAAUd,GAAUS,GAAaG,GAAWC,CAAU;AAAA,EAC1D;AAAA,EACA,MAAMb,GAAU;AACZ,SAAK,WAAWe,EAASf,EAAS,OAAO,GACzC,MAAM,MAAMA,CAAQ;AAAA,EACxB;AACJ;","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/frameloop/sync-time.mjs"],"sourcesContent":["import { MotionGlobalConfig } from 'motion-utils';\nimport { frameData } from './frame.mjs';\n\nlet now;\nfunction clearTime() {\n    now = undefined;\n}\n/**\n * An eventloop-synchronous alternative to performance.now().\n *\n * Ensures that time measurements remain consistent within a synchronous context.\n * Usually calling performance.now() twice within the same synchronous context\n * will return different values which isn't useful for animations when we're usually\n * trying to sync animations to the same frame.\n */\nconst time = {\n    now: () => {\n        if (now === undefined) {\n            time.set(frameData.isProcessing || MotionGlobalConfig.useManualTiming\n                ? frameData.timestamp\n                : performance.now());\n        }\n        return now;\n    },\n    set: (newTime) => {\n        now = newTime;\n        queueMicrotask(clearTime);\n    },\n};\n\nexport { time };\n//# sourceMappingURL=sync-time.mjs.map\n"],"names":["now","clearTime","time","frameData","MotionGlobalConfig","newTime"],"mappings":";;AAGA,IAAIA;AACJ,SAASC,IAAY;AACjB,EAAAD,IAAM;AACV;AASK,MAACE,IAAO;AAAA,EACT,KAAK,OACGF,MAAQ,UACRE,EAAK,IAAIC,EAAU,gBAAgBC,EAAmB,kBAChDD,EAAU,YACV,YAAY,IAAG,CAAE,GAEpBH;AAAA,EAEX,KAAK,CAACK,MAAY;AACd,IAAAL,IAAMK,GACN,eAAeJ,CAAS;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.es29.js";
+import { downloadSVGAsPNG as me, downloadAsSVG as he } from "./visualization.es31.js";
 import { useResponsiveParentSize as pe } from "./visualization.es18.js";
-import Zt from "./visualization.es23.js";
-import Bt from "./visualization.es22.js";
-import ue from "./visualization.es21.js";
-import q from "./visualization.es30.js";
-import ge from "./visualization.es71.js";
-import xe from "./visualization.es34.js";
-import J from "./visualization.es31.js";
-import ye from "./visualization.es64.js";
-import be from "./visualization.es72.js";
-import { defaultStyles as Se } from "./visualization.es25.js";
+import Zt from "./visualization.es26.js";
+import Bt from "./visualization.es25.js";
+import ue from "./visualization.es24.js";
+import q from "./visualization.es51.js";
+import ge from "./visualization.es55.js";
+import xe from "./visualization.es56.js";
+import J from "./visualization.es34.js";
+import ye from "./visualization.es21.js";
+import be from "./visualization.es22.js";
+import { defaultStyles as Se } from "./visualization.es28.js";
 import { ResponsiveContainer as te } from "./visualization.es14.js";
-import Le from "./visualization.es33.js";
+import Le from "./visualization.es52.js";
 function we(o, t, i) {
   const y = [], X = (t - o) / (i - 1);
   let w = o;

package/dist/visualization.es30.js

@@ -1,51 +1,58 @@
-import g from "./visualization.es157.js";
-import { jsx as t } from "react/jsx-runtime";
-const p = {
-  overflow: "visible"
+import { jsx as l, jsxs as $, Fragment as T } from "react/jsx-runtime";
+import { c as _ } from "react/compiler-runtime";
+import { useRef as v } from "react";
+import { getTextHeight as H } from "./visualization.es2.js";
+const G = (g) => {
+  const t = _(33), {
+    label: p,
+    getlollipopRadius: s,
+    height: e,
+    width: n,
+    legendValues: x,
+    spaceForCategory: W,
+    axisCenter: R,
+    loading: u
+  } = g, C = v(null), r = H(p, 12, "Times");
+  let a, c, d, f, i, h, o;
+  if (t[0] !== R || t[1] !== s || t[2] !== e || t[3] !== p || t[4] !== r || t[5] !== x || t[6] !== u || t[7] !== W || t[8] !== n) {
+    let k;
+    t[16] !== s ? (k = (y) => s(y) * 2 + 12, t[16] = s, t[17] = k) : k = t[17];
+    const S = x.map(k), F = S.reduce(I, 0) + 30 * (x.length - 1), j = r + 20 + F, w = u ? 0.3 : 1;
+    t[18] !== w ? (o = {
+      marginBottom: 10,
+      opacity: w
+    }, t[18] = w, t[19] = o) : o = t[19], a = e + 4, c = n + r + 4, d = "legend", f = `translate(${W / 1.2 + R - n / 2}, 0)`;
+    const z = n + r;
+    t[20] !== e || t[21] !== z ? (i = /* @__PURE__ */ l("rect", { height: e, width: z, stroke: "black", fill: "none", transform: "translate(2, 2)" }), t[20] = e, t[21] = z, t[22] = i) : i = t[22], h = u ? /* @__PURE__ */ l("text", { x: (n + r) / 2, y: e / 2, textAnchor: "middle", dominantBaseline: "middle", fontSize: 12, fill: "black", children: "Loading..." }) : /* @__PURE__ */ $(T, { children: [
+      /* @__PURE__ */ l("g", { transform: `translate(${n / 2 - j / 2 + 2}, ${e / 2 + 2})`, children: /* @__PURE__ */ l("text", { ref: C, x: 0, y: 3, textAnchor: "start", fill: "black", fontSize: 12, children: p }) }),
+      /* @__PURE__ */ $("g", { transform: `translate(${n / 2 - j / 2 + r + 10 + 2}, ${e / 2 + 2})`, children: [
+        /* @__PURE__ */ l("line", { x1: 0, y1: -e / 2, x2: 0, y2: e / 2, stroke: "black", strokeWidth: 1 }),
+        /* @__PURE__ */ l("g", { transform: `translate(${10 + r / 2}, 0)`, children: x.map((y, A) => {
+          const B = s(y), L = S.slice(0, A).reduce(V, 0) + A * 30;
+          return /* @__PURE__ */ $("g", { transform: `translate(${L}, 0)`, children: [
+            /* @__PURE__ */ l("circle", { r: B, cx: 0, cy: 0, fill: "black" }),
+            /* @__PURE__ */ l("text", { x: B + 12, y: 3, textAnchor: "start", fill: "black", fontSize: 10, children: y })
+          ] }, `legend${A}`);
+        }) })
+      ] })
+    ] }), t[0] = R, t[1] = s, t[2] = e, t[3] = p, t[4] = r, t[5] = x, t[6] = u, t[7] = W, t[8] = n, t[9] = a, t[10] = c, t[11] = d, t[12] = f, t[13] = i, t[14] = h, t[15] = o;
+  } else
+    a = t[9], c = t[10], d = t[11], f = t[12], i = t[13], h = t[14], o = t[15];
+  let m;
+  t[23] !== a || t[24] !== c || t[25] !== d || t[26] !== f || t[27] !== i || t[28] !== h ? (m = /* @__PURE__ */ $("svg", { height: a, width: c, id: d, transform: f, children: [
+    i,
+    h
+  ] }), t[23] = a, t[24] = c, t[25] = d, t[26] = f, t[27] = i, t[28] = h, t[29] = m) : m = t[29];
+  let b;
+  return t[30] !== o || t[31] !== m ? (b = /* @__PURE__ */ l("div", { style: o, children: m }), t[30] = o, t[31] = m, t[32] = b) : b = t[32], b;
 };
-function z(e) {
-  const {
-    dx: s = 0,
-    dy: i = 0,
-    textAnchor: l = "start",
-    innerRef: c,
-    innerTextRef: f,
-    verticalAnchor: u,
-    angle: T,
-    lineHeight: a = "1em",
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    scaleToFit: v = !1,
-    capHeight: w,
-    width: S,
-    ...n
-  } = e, {
-    x = 0,
-    fontSize: h
-  } = n, {
-    wordsByLines: r,
-    startDy: d,
-    transform: m
-  } = g(e);
-  return /* @__PURE__ */ t("svg", {
-    ref: c,
-    x: s,
-    y: i,
-    fontSize: h,
-    style: p,
-    children: r.length > 0 ? /* @__PURE__ */ t("text", {
-      ref: f,
-      transform: m,
-      ...n,
-      textAnchor: l,
-      children: r.map((y, o) => /* @__PURE__ */ t("tspan", {
-        x,
-        dy: o === 0 ? d : a,
-        children: y.words.join(" ")
-      }, o))
-    }) : null
-  });
+function I(g, t) {
+  return g + t;
+}
+function V(g, t) {
+  return g + t;
 }
 export {
-  z as default
+  G as default
 };
 //# sourceMappingURL=visualization.es30.js.map

package/dist/visualization.es30.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es30.js","sources":["../../../node_modules/.pnpm/@visx+text@4.0.0_@types+react@19.2.14_react@19.2.4/node_modules/@visx/text/esm/Text.js"],"sourcesContent":["import useText from \"./hooks/useText.js\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst SVG_STYLE = {\n  overflow: 'visible'\n};\nexport default function Text(props) {\n  const {\n    dx = 0,\n    dy = 0,\n    textAnchor = 'start',\n    innerRef,\n    innerTextRef,\n    verticalAnchor,\n    angle,\n    lineHeight = '1em',\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    scaleToFit = false,\n    capHeight,\n    width,\n    ...textProps\n  } = props;\n  const {\n    x = 0,\n    fontSize\n  } = textProps;\n  const {\n    wordsByLines,\n    startDy,\n    transform\n  } = useText(props);\n  return /*#__PURE__*/_jsx(\"svg\", {\n    ref: innerRef,\n    x: dx,\n    y: dy,\n    fontSize: fontSize,\n    style: SVG_STYLE,\n    children: wordsByLines.length > 0 ? /*#__PURE__*/_jsx(\"text\", {\n      ref: innerTextRef,\n      transform: transform,\n      ...textProps,\n      textAnchor: textAnchor,\n      children: wordsByLines.map((line, index) => /*#__PURE__*/_jsx(\"tspan\", {\n        x: x,\n        dy: index === 0 ? startDy : lineHeight,\n        children: line.words.join(' ')\n      }, index))\n    }) : null\n  });\n}"],"names":["SVG_STYLE","Text","props","dx","dy","textAnchor","innerRef","innerTextRef","verticalAnchor","angle","lineHeight","scaleToFit","capHeight","width","textProps","fontSize","wordsByLines","startDy","transform","useText","_jsx","line","index"],"mappings":";;AAEA,MAAMA,IAAY;AAAA,EAChB,UAAU;AACZ;AACe,SAASC,EAAKC,GAAO;AAClC,QAAM;AAAA,IACJ,IAAAC,IAAK;AAAA,IACL,IAAAC,IAAK;AAAA,IACL,YAAAC,IAAa;AAAA,IACb,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC,IAAa;AAAA;AAAA,IAEb,YAAAC,IAAa;AAAA,IACb,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,GAAGC;AAAA,EACP,IAAMZ,GACE;AAAA,IACJ,IAAI;AAAA,IACJ,UAAAa;AAAA,EACJ,IAAMD,GACE;AAAA,IACJ,cAAAE;AAAA,IACA,SAAAC;AAAA,IACA,WAAAC;AAAA,EACJ,IAAMC,EAAQjB,CAAK;AACjB,SAAoBkB,gBAAAA,EAAK,OAAO;AAAA,IAC9B,KAAKd;AAAA,IACL,GAAGH;AAAA,IACH,GAAGC;AAAA,IACH,UAAUW;AAAA,IACV,OAAOf;AAAA,IACP,UAAUgB,EAAa,SAAS,IAAiBI,gBAAAA,EAAK,QAAQ;AAAA,MAC5D,KAAKb;AAAA,MACL,WAAWW;AAAA,MACX,GAAGJ;AAAA,MACH,YAAYT;AAAA,MACZ,UAAUW,EAAa,IAAI,CAACK,GAAMC,MAAuBF,gBAAAA,EAAK,SAAS;AAAA,QACrE;AAAA,QACA,IAAIE,MAAU,IAAIL,IAAUP;AAAA,QAC5B,UAAUW,EAAK,MAAM,KAAK,GAAG;AAAA,MACrC,GAASC,CAAK,CAAC;AAAA,IACf,CAAK,IAAI;AAAA,EACT,CAAG;AACH;","x_google_ignoreList":[0]}
+{"version":3,"file":"visualization.es30.js","sources":["../src/components/BarPlot/legend.tsx"],"sourcesContent":["import React, { useRef } from \"react\";\nimport { LollipopLegendProps } from \"./types\";\nimport { getTextHeight } from \"./barplot\";\n\nconst Legend: React.FC<LollipopLegendProps> = ({\n    label,\n    getlollipopRadius,\n    height,\n    width,\n    legendValues,\n    spaceForCategory,\n    axisCenter,\n    loading\n}) => {\n    const gap = 30;\n    const labelRef = useRef<SVGTextElement>(null);\n\n    const labelWidth = getTextHeight(label, 12, \"Times\")\n\n    const itemWidths = legendValues.map(v => getlollipopRadius(v) * 2 + 12);\n    const totalItemsWidth =\n        itemWidths.reduce((sum, w) => sum + w, 0) + gap * (legendValues.length - 1);\n\n    const dividerGap = 10;\n\n    const totalWidth = labelWidth + dividerGap * 2 + totalItemsWidth;\n\n    return (\n        <div style={{ marginBottom: 10, opacity: loading ? 0.3 : 1 }}>\n            <svg height={height + 4} width={width + labelWidth + 4} id=\"legend\" transform={`translate(${spaceForCategory / 1.2 + axisCenter - width / 2}, 0)`}>\n                <rect height={height} width={width + labelWidth} stroke=\"black\" fill=\"none\" transform={`translate(2, 2)`} />\n                {loading ? (\n                    <text\n                        x={(width + labelWidth) / 2}\n                        y={height / 2}\n                        textAnchor=\"middle\"\n                        dominantBaseline=\"middle\"\n                        fontSize={12}\n                        fill=\"black\"\n                    >\n                        Loading...\n                    </text>\n                ) : (\n                    <>\n                        <g transform={`translate(${(width / 2 - totalWidth / 2) + 2}, ${(height / 2) + 2})`}>\n                            <text\n                                ref={labelRef}\n                                x={0}\n                                y={3}\n                                textAnchor=\"start\"\n                                fill=\"black\"\n                                fontSize={12}\n                            >\n                                {label}\n                            </text>\n                        </g>\n                        <g transform={`translate(${(width / 2 - totalWidth / 2 + labelWidth + dividerGap) + 2}, ${(height / 2) + 2})`}>\n                            <line\n                                x1={0}\n                                y1={-height / 2}\n                                x2={0}\n                                y2={height / 2}\n                                stroke=\"black\"\n                                strokeWidth={1}\n                            />\n                            <g transform={`translate(${dividerGap + labelWidth / 2}, 0)`}>\n                                {legendValues.map((value, idx) => {\n                                    const circleR = getlollipopRadius(value);\n                                    const offsetX =\n                                        itemWidths.slice(0, idx).reduce((sum, w) => sum + w, 0) +\n                                        idx * gap;\n\n                                    return (\n                                        <g key={`legend${idx}`} transform={`translate(${offsetX}, 0)`}>\n                                            <circle r={circleR} cx={0} cy={0} fill=\"black\" />\n                                            <text\n                                                x={circleR + 12}\n                                                y={3}\n                                                textAnchor=\"start\"\n                                                fill=\"black\"\n                                                fontSize={10}\n                                            >\n                                                {value}\n                                            </text>\n                                        </g>\n                                    );\n                                })}\n                            </g>\n                        </g>\n                    </>\n                )}\n\n            </svg>\n        </div>\n    );\n};\n\nexport default Legend;\n"],"names":["Legend","t0","$","_c","label","getlollipopRadius","height","width","legendValues","spaceForCategory","axisCenter","loading","labelRef","useRef","labelWidth","getTextHeight","t1","t2","t3","t4","t5","t6","t7","t8","v","itemWidths","map","totalItemsWidth","reduce","_temp","length","totalWidth","t9","marginBottom","opacity","t10","jsx","jsxs","Fragment","value","idx","circleR","offsetX","slice","_temp2","sum","w","sum_0","w_0"],"mappings":"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"}

package/dist/visualization.es300.js

@@ -1,38 +1,145 @@
-import { isCSSVariableName as s } from "./visualization.es338.js";
-import { transformProps as n } from "./visualization.es341.js";
-import { defaultTransformValue as a, readTransformValue as i } from "./visualization.es396.js";
-import { measureViewportBox as u } from "./visualization.es440.js";
-import { DOMVisualElement as p } from "./visualization.es439.js";
-import { buildHTMLStyles as l } from "./visualization.es441.js";
-import { renderHTML as f } from "./visualization.es442.js";
-import { scrapeMotionValuesFromProps as c } from "./visualization.es443.js";
-function d(m) {
-  return window.getComputedStyle(m);
-}
-class x extends p {
-  constructor() {
-    super(...arguments), this.type = "html", this.renderInstance = f;
-  }
-  readValueFromInstance(e, r) {
-    if (n.has(r))
-      return this.projection?.isProjecting ? a(r) : i(e, r);
-    {
-      const t = d(e), o = (s(r) ? t.getPropertyValue(r) : t[r]) || 0;
-      return typeof o == "string" ? o.trim() : o;
+import { time as p } from "./visualization.es299.js";
+import { mix as P } from "./visualization.es310.js";
+import { frameloopDriver as I } from "./visualization.es311.js";
+import { inertia as K } from "./visualization.es312.js";
+import { keyframes as u } from "./visualization.es313.js";
+import { calcGeneratorDuration as O } from "./visualization.es314.js";
+import { getGeneratorVelocity as V } from "./visualization.es315.js";
+import { getFinalKeyframe as C } from "./visualization.es301.js";
+import { replaceTransitionType as E } from "./visualization.es316.js";
+import { WithPromise as N } from "./visualization.es306.js";
+import { invariant as W } from "./visualization.es317.js";
+import { pipe as $ } from "./visualization.es318.js";
+import { millisecondsToSeconds as c, secondsToMilliseconds as B } from "./visualization.es319.js";
+import { clamp as J } from "./visualization.es320.js";
+const U = (g) => g / 100;
+class rt extends N {
+  constructor(t) {
+    super(), this.state = "idle", this.startTime = null, this.isStopped = !1, this.currentTime = 0, this.holdTime = null, this.playbackSpeed = 1, this.delayState = {
+      done: !1,
+      value: void 0
+    }, this.stop = () => {
+      const { motionValue: i } = this.options;
+      i && i.updatedAt !== p.now() && this.tick(p.now()), this.isStopped = !0, this.state !== "idle" && (this.teardown(), this.options.onStop?.());
+    }, this.options = t, this.initAnimation(), this.play(), t.autoplay === !1 && this.pause();
+  }
+  initAnimation() {
+    const { options: t } = this;
+    E(t);
+    const { type: i = u, repeat: s = 0, repeatDelay: r = 0, repeatType: m, velocity: f = 0 } = t;
+    let { keyframes: e } = t;
+    const h = i || u;
+    process.env.NODE_ENV !== "production" && h !== u && W(e.length <= 2, `Only two keyframes currently supported with spring and inertia animations. Trying to animate ${e}`, "spring-two-frames"), h !== u && typeof e[0] != "number" && (this.mixKeyframes = $(U, P(e[0], e[1])), e = [0, 100]);
+    const n = h({ ...t, keyframes: e });
+    m === "mirror" && (this.mirroredGenerator = h({
+      ...t,
+      keyframes: [...e].reverse(),
+      velocity: -f
+    })), n.calculatedDuration === null && (n.calculatedDuration = O(n));
+    const { calculatedDuration: l } = n;
+    this.calculatedDuration = l, this.resolvedDuration = l + r, this.totalDuration = this.resolvedDuration * (s + 1) - r, this.generator = n;
+  }
+  updateTime(t) {
+    const i = Math.round(t - this.startTime) * this.playbackSpeed;
+    this.holdTime !== null ? this.currentTime = this.holdTime : this.currentTime = i;
+  }
+  tick(t, i = !1) {
+    const { generator: s, totalDuration: r, mixKeyframes: m, mirroredGenerator: f, resolvedDuration: e, calculatedDuration: h } = this;
+    if (this.startTime === null)
+      return s.next(0);
+    const { delay: n = 0, keyframes: l, repeat: k, repeatType: D, repeatDelay: S, type: F, onUpdate: b, finalKeyframe: G } = this.options;
+    this.speed > 0 ? this.startTime = Math.min(this.startTime, t) : this.speed < 0 && (this.startTime = Math.min(t - r / this.speed, this.startTime)), i ? this.currentTime = t : this.updateTime(t);
+    const T = this.currentTime - n * (this.playbackSpeed >= 0 ? 1 : -1), y = this.playbackSpeed >= 0 ? T < 0 : T > r;
+    this.currentTime = Math.max(T, 0), this.state === "finished" && this.holdTime === null && (this.currentTime = r);
+    let x = this.currentTime, w = s;
+    if (k) {
+      const v = Math.min(this.currentTime, r) / e;
+      let d = Math.floor(v), o = v % 1;
+      !o && v >= 1 && (o = 1), o === 1 && d--, d = Math.min(d, k + 1), d % 2 && (D === "reverse" ? (o = 1 - o, S && (o -= S / e)) : D === "mirror" && (w = f)), x = J(0, 1, o) * e;
     }
+    let a;
+    y ? (this.delayState.value = l[0], a = this.delayState) : a = w.next(x), m && !y && (a.value = m(a.value));
+    let { done: M } = a;
+    !y && h !== null && (M = this.playbackSpeed >= 0 ? this.currentTime >= r : this.currentTime <= 0);
+    const A = this.holdTime === null && (this.state === "finished" || this.state === "running" && M);
+    return A && F !== K && (a.value = C(l, this.options, G, this.speed)), b && b(a.value), A && this.finish(), a;
+  }
+  /**
+   * Allows the returned animation to be awaited or promise-chained. Currently
+   * resolves when the animation finishes at all but in a future update could/should
+   * reject if its cancels.
+   */
+  then(t, i) {
+    return this.finished.then(t, i);
+  }
+  get duration() {
+    return c(this.calculatedDuration);
+  }
+  get iterationDuration() {
+    const { delay: t = 0 } = this.options || {};
+    return this.duration + c(t);
+  }
+  get time() {
+    return c(this.currentTime);
+  }
+  set time(t) {
+    t = B(t), this.currentTime = t, this.startTime === null || this.holdTime !== null || this.playbackSpeed === 0 ? this.holdTime = t : this.driver && (this.startTime = this.driver.now() - t / this.playbackSpeed), this.driver ? this.driver.start(!1) : (this.startTime = 0, this.state = "paused", this.holdTime = t, this.tick(t));
+  }
+  /**
+   * Returns the generator's velocity at the current time in units/second.
+   * Uses the analytical derivative when available (springs), avoiding
+   * the MotionValue's frame-dependent velocity estimation.
+   */
+  getGeneratorVelocity() {
+    const t = this.currentTime;
+    if (t <= 0)
+      return this.options.velocity || 0;
+    if (this.generator.velocity)
+      return this.generator.velocity(t);
+    const i = this.generator.next(t).value;
+    return V((s) => this.generator.next(s).value, t, i);
+  }
+  get speed() {
+    return this.playbackSpeed;
+  }
+  set speed(t) {
+    const i = this.playbackSpeed !== t;
+    i && this.driver && this.updateTime(p.now()), this.playbackSpeed = t, i && this.driver && (this.time = c(this.currentTime));
+  }
+  play() {
+    if (this.isStopped)
+      return;
+    const { driver: t = I, startTime: i } = this.options;
+    this.driver || (this.driver = t((r) => this.tick(r))), this.options.onPlay?.();
+    const s = this.driver.now();
+    this.state === "finished" ? (this.updateFinished(), this.startTime = s) : this.holdTime !== null ? this.startTime = s - this.holdTime : this.startTime || (this.startTime = i ?? s), this.state === "finished" && this.speed < 0 && (this.startTime += this.calculatedDuration), this.holdTime = null, this.state = "running", this.driver.start();
+  }
+  pause() {
+    this.state = "paused", this.updateTime(p.now()), this.holdTime = this.currentTime;
+  }
+  complete() {
+    this.state !== "running" && this.play(), this.state = "finished", this.holdTime = null;
+  }
+  finish() {
+    this.notifyFinished(), this.teardown(), this.state = "finished", this.options.onComplete?.();
+  }
+  cancel() {
+    this.holdTime = null, this.startTime = 0, this.tick(0), this.teardown(), this.options.onCancel?.();
+  }
+  teardown() {
+    this.state = "idle", this.stopDriver(), this.startTime = this.holdTime = null;
   }
-  measureInstanceViewportBox(e, { transformPagePoint: r }) {
-    return u(e, r);
+  stopDriver() {
+    this.driver && (this.driver.stop(), this.driver = void 0);
   }
-  build(e, r, t) {
-    l(e, r, t.transformTemplate);
+  sample(t) {
+    return this.startTime = 0, this.tick(t, !0);
   }
-  scrapeMotionValuesFromProps(e, r, t) {
-    return c(e, r, t);
+  attachTimeline(t) {
+    return this.options.allowFlatten && (this.options.type = "keyframes", this.options.ease = "linear", this.initAnimation()), this.driver?.stop(), t.observe(this);
   }
 }
 export {
-  x as HTMLVisualElement,
-  d as getComputedStyle
+  rt as JSAnimation
 };
 //# sourceMappingURL=visualization.es300.js.map