@new-black/lyra 0.0.25 → 0.0.26

package/dist/lyra254.js

@@ -1,39 +1,329 @@
-import { PanSession as d } from "./lyra306.js";
-import { addPointerEvent as m } from "./lyra235.js";
-import { Feature as h } from "./lyra279.js";
-import { noop as p } from "./lyra195.js";
-import { frame as r } from "./lyra160.js";
-const s = (e) => (n, t) => {
-  e && r.update(() => e(n, t));
-};
-class l extends h {
-  constructor() {
-    super(...arguments), this.removePointerDownListener = p;
-  }
-  onPointerDown(n) {
-    this.session = new d(n, this.createPanHandlers(), { transformPagePoint: this.node.getTransformPagePoint() });
-  }
-  createPanHandlers() {
-    const { onPanSessionStart: n, onPanStart: t, onPan: i, onPanEnd: o } = this.node.getProps();
-    return {
-      onSessionStart: s(n),
-      onStart: s(t),
-      onMove: i,
-      onEnd: (a, P) => {
-        delete this.session, o && r.update(() => o(a, P));
+import { useRef as a, useState as d, useMemo as u, useEffect as B } from "react";
+import { useControlledState as A } from "./lyra66.js";
+import { compareNodeOrder as f, getFirstItem as E, getChildNodes as C } from "./lyra60.js";
+class c extends Set {
+  constructor(e, t, l) {
+    super(e), e instanceof c ? (this.anchorKey = t || e.anchorKey, this.currentKey = l || e.currentKey) : (this.anchorKey = t, this.currentKey = l);
+  }
+}
+function R(i, e) {
+  if (i.size !== e.size)
+    return !1;
+  for (let t of i)
+    if (!e.has(t))
+      return !1;
+  return !0;
+}
+function D(i) {
+  let { selectionMode: e = "none", disallowEmptySelection: t, allowDuplicateSelectionEvents: l, selectionBehavior: s = "toggle", disabledBehavior: n = "all" } = i, S = a(!1), [, p] = d(!1), y = a(null), K = a(null), [, v] = d(null), w = u(() => b(i.selectedKeys), [
+    i.selectedKeys
+  ]), $ = u(() => b(i.defaultSelectedKeys, new c()), [
+    i.defaultSelectedKeys
+  ]), [r, I] = A(w, $, i.onSelectionChange), M = u(() => i.disabledKeys ? new Set(i.disabledKeys) : /* @__PURE__ */ new Set(), [
+    i.disabledKeys
+  ]), [g, h] = d(s);
+  s === "replace" && g === "toggle" && typeof r == "object" && r.size === 0 && h("replace");
+  let m = a(s);
+  return B(() => {
+    s !== m.current && (h(s), m.current = s);
+  }, [
+    s
+  ]), {
+    selectionMode: e,
+    disallowEmptySelection: t,
+    selectionBehavior: g,
+    setSelectionBehavior: h,
+    get isFocused() {
+      return S.current;
+    },
+    setFocused(o) {
+      S.current = o, p(o);
+    },
+    get focusedKey() {
+      return y.current;
+    },
+    get childFocusStrategy() {
+      return K.current;
+    },
+    setFocusedKey(o, F = "first") {
+      y.current = o, K.current = F, v(o);
+    },
+    selectedKeys: r,
+    setSelectedKeys(o) {
+      (l || !R(o, r)) && I(o);
+    },
+    disabledKeys: M,
+    disabledBehavior: n
+  };
+}
+function b(i, e) {
+  return i ? i === "all" ? "all" : new c(i) : e;
+}
+class N {
+  /**
+  * The type of selection that is allowed in the collection.
+  */
+  get selectionMode() {
+    return this.state.selectionMode;
+  }
+  /**
+  * Whether the collection allows empty selection.
+  */
+  get disallowEmptySelection() {
+    return this.state.disallowEmptySelection;
+  }
+  /**
+  * The selection behavior for the collection.
+  */
+  get selectionBehavior() {
+    return this.state.selectionBehavior;
+  }
+  /**
+  * Sets the selection behavior for the collection.
+  */
+  setSelectionBehavior(e) {
+    this.state.setSelectionBehavior(e);
+  }
+  /**
+  * Whether the collection is currently focused.
+  */
+  get isFocused() {
+    return this.state.isFocused;
+  }
+  /**
+  * Sets whether the collection is focused.
+  */
+  setFocused(e) {
+    this.state.setFocused(e);
+  }
+  /**
+  * The current focused key in the collection.
+  */
+  get focusedKey() {
+    return this.state.focusedKey;
+  }
+  /** Whether the first or last child of the focused key should receive focus. */
+  get childFocusStrategy() {
+    return this.state.childFocusStrategy;
+  }
+  /**
+  * Sets the focused key.
+  */
+  setFocusedKey(e, t) {
+    (e == null || this.collection.getItem(e)) && this.state.setFocusedKey(e, t);
+  }
+  /**
+  * The currently selected keys in the collection.
+  */
+  get selectedKeys() {
+    return this.state.selectedKeys === "all" ? new Set(this.getSelectAllKeys()) : this.state.selectedKeys;
+  }
+  /**
+  * The raw selection value for the collection.
+  * Either 'all' for select all, or a set of keys.
+  */
+  get rawSelection() {
+    return this.state.selectedKeys;
+  }
+  /**
+  * Returns whether a key is selected.
+  */
+  isSelected(e) {
+    return this.state.selectionMode === "none" ? !1 : (e = this.getKey(e), this.state.selectedKeys === "all" ? this.canSelectItem(e) : this.state.selectedKeys.has(e));
+  }
+  /**
+  * Whether the selection is empty.
+  */
+  get isEmpty() {
+    return this.state.selectedKeys !== "all" && this.state.selectedKeys.size === 0;
+  }
+  /**
+  * Whether all items in the collection are selected.
+  */
+  get isSelectAll() {
+    if (this.isEmpty)
+      return !1;
+    if (this.state.selectedKeys === "all")
+      return !0;
+    if (this._isSelectAll != null)
+      return this._isSelectAll;
+    let e = this.getSelectAllKeys(), t = this.state.selectedKeys;
+    return this._isSelectAll = e.every((l) => t.has(l)), this._isSelectAll;
+  }
+  get firstSelectedKey() {
+    let e = null;
+    for (let t of this.state.selectedKeys) {
+      let l = this.collection.getItem(t);
+      (!e || l && f(this.collection, l, e) < 0) && (e = l);
+    }
+    return e == null ? void 0 : e.key;
+  }
+  get lastSelectedKey() {
+    let e = null;
+    for (let t of this.state.selectedKeys) {
+      let l = this.collection.getItem(t);
+      (!e || l && f(this.collection, l, e) > 0) && (e = l);
+    }
+    return e == null ? void 0 : e.key;
+  }
+  get disabledKeys() {
+    return this.state.disabledKeys;
+  }
+  get disabledBehavior() {
+    return this.state.disabledBehavior;
+  }
+  /**
+  * Extends the selection to the given key.
+  */
+  extendSelection(e) {
+    if (this.selectionMode === "none")
+      return;
+    if (this.selectionMode === "single") {
+      this.replaceSelection(e);
+      return;
+    }
+    e = this.getKey(e);
+    let t;
+    if (this.state.selectedKeys === "all")
+      t = new c([
+        e
+      ], e, e);
+    else {
+      let l = this.state.selectedKeys, s = l.anchorKey || e;
+      t = new c(l, s, e);
+      for (let n of this.getKeyRange(s, l.currentKey || e))
+        t.delete(n);
+      for (let n of this.getKeyRange(e, s))
+        this.canSelectItem(n) && t.add(n);
+    }
+    this.state.setSelectedKeys(t);
+  }
+  getKeyRange(e, t) {
+    let l = this.collection.getItem(e), s = this.collection.getItem(t);
+    return l && s ? f(this.collection, l, s) <= 0 ? this.getKeyRangeInternal(e, t) : this.getKeyRangeInternal(t, e) : [];
+  }
+  getKeyRangeInternal(e, t) {
+    let l = [], s = e;
+    for (; s; ) {
+      let n = this.collection.getItem(s);
+      if ((n && n.type === "item" || n.type === "cell" && this.allowsCellSelection) && l.push(s), s === t)
+        return l;
+      s = this.collection.getKeyAfter(s);
+    }
+    return [];
+  }
+  getKey(e) {
+    let t = this.collection.getItem(e);
+    if (!t || t.type === "cell" && this.allowsCellSelection)
+      return e;
+    for (; t.type !== "item" && t.parentKey != null; )
+      t = this.collection.getItem(t.parentKey);
+    return !t || t.type !== "item" ? null : t.key;
+  }
+  /**
+  * Toggles whether the given key is selected.
+  */
+  toggleSelection(e) {
+    if (this.selectionMode === "none")
+      return;
+    if (this.selectionMode === "single" && !this.isSelected(e)) {
+      this.replaceSelection(e);
+      return;
+    }
+    if (e = this.getKey(e), e == null)
+      return;
+    let t = new c(this.state.selectedKeys === "all" ? this.getSelectAllKeys() : this.state.selectedKeys);
+    t.has(e) ? t.delete(e) : this.canSelectItem(e) && (t.add(e), t.anchorKey = e, t.currentKey = e), !(this.disallowEmptySelection && t.size === 0) && this.state.setSelectedKeys(t);
+  }
+  /**
+  * Replaces the selection with only the given key.
+  */
+  replaceSelection(e) {
+    if (this.selectionMode === "none" || (e = this.getKey(e), e == null))
+      return;
+    let t = this.canSelectItem(e) ? new c([
+      e
+    ], e, e) : new c();
+    this.state.setSelectedKeys(t);
+  }
+  /**
+  * Replaces the selection with the given keys.
+  */
+  setSelectedKeys(e) {
+    if (this.selectionMode === "none")
+      return;
+    let t = new c();
+    for (let l of e)
+      if (l = this.getKey(l), l != null && (t.add(l), this.selectionMode === "single"))
+        break;
+    this.state.setSelectedKeys(t);
+  }
+  getSelectAllKeys() {
+    let e = [], t = (l) => {
+      for (; l; ) {
+        if (this.canSelectItem(l)) {
+          let s = this.collection.getItem(l);
+          s.type === "item" && e.push(l), s.hasChildNodes && (this.allowsCellSelection || s.type !== "item") && t(E(C(s, this.collection)).key);
+        }
+        l = this.collection.getKeyAfter(l);
       }
     };
+    return t(this.collection.getFirstKey()), e;
+  }
+  /**
+  * Selects all items in the collection.
+  */
+  selectAll() {
+    !this.isSelectAll && this.selectionMode === "multiple" && this.state.setSelectedKeys("all");
+  }
+  /**
+  * Removes all keys from the selection.
+  */
+  clearSelection() {
+    !this.disallowEmptySelection && (this.state.selectedKeys === "all" || this.state.selectedKeys.size > 0) && this.state.setSelectedKeys(new c());
+  }
+  /**
+  * Toggles between select all and an empty selection.
+  */
+  toggleSelectAll() {
+    this.isSelectAll ? this.clearSelection() : this.selectAll();
+  }
+  select(e, t) {
+    this.selectionMode !== "none" && (this.selectionMode === "single" ? this.isSelected(e) && !this.disallowEmptySelection ? this.toggleSelection(e) : this.replaceSelection(e) : this.selectionBehavior === "toggle" || t && (t.pointerType === "touch" || t.pointerType === "virtual") ? this.toggleSelection(e) : this.replaceSelection(e));
+  }
+  /**
+  * Returns whether the current selection is equal to the given selection.
+  */
+  isSelectionEqual(e) {
+    if (e === this.state.selectedKeys)
+      return !0;
+    let t = this.selectedKeys;
+    if (e.size !== t.size)
+      return !1;
+    for (let l of e)
+      if (!t.has(l))
+        return !1;
+    for (let l of t)
+      if (!e.has(l))
+        return !1;
+    return !0;
   }
-  mount() {
-    this.removePointerDownListener = m(this.node.current, "pointerdown", (n) => this.onPointerDown(n));
+  canSelectItem(e) {
+    if (this.state.selectionMode === "none" || this.state.disabledKeys.has(e))
+      return !1;
+    let t = this.collection.getItem(e);
+    return !(!t || t.type === "cell" && !this.allowsCellSelection);
   }
-  update() {
-    this.session && this.session.updateHandlers(this.createPanHandlers());
+  isDisabled(e) {
+    return this.state.disabledKeys.has(e) && this.state.disabledBehavior === "all";
   }
-  unmount() {
-    this.removePointerDownListener(), this.session && this.session.end();
+  constructor(e, t, l) {
+    this.collection = e, this.state = t;
+    var s;
+    this.allowsCellSelection = (s = l == null ? void 0 : l.allowsCellSelection) !== null && s !== void 0 ? s : !1, this._isSelectAll = null;
   }
 }
 export {
-  l as PanGesture
+  N as SelectionManager,
+  D as useMultipleSelectionState
 };

package/dist/lyra255.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./lyra160.cjs"),u=require("react"),p=require("./lyra146.cjs"),l=require("./lyra134.cjs"),m=require("./lyra157.cjs"),f=require("./lyra307.cjs"),n=require("./lyra308.cjs"),R=require("./lyra309.cjs"),h=require("./lyra177.cjs");class y extends u.Component{componentDidMount(){const{visualElement:e,layoutGroup:o,switchLayoutGroup:t,layoutId:s}=this.props,{projection:r}=e;h.addScaleCorrector(v),r&&(o.group&&o.group.add(r),t&&t.register&&s&&t.register(r),r.root.didUpdate(),r.addEventListener("animationComplete",()=>{this.safeToRemove()}),r.setOptions({...r.options,onExitComplete:()=>this.safeToRemove()})),f.globalProjectionState.hasEverUpdated=!0}getSnapshotBeforeUpdate(e){const{layoutDependency:o,visualElement:t,drag:s,isPresent:r}=this.props,i=t.projection;return i&&(i.isPresent=r,s||e.layoutDependency!==o||o===void 0?i.willUpdate():this.safeToRemove(),e.isPresent!==r&&(r?i.promote():i.relegate()||d.frame.postRender(()=>{const c=i.getStack();(!c||!c.members.length)&&this.safeToRemove()}))),null}componentDidUpdate(){const{projection:e}=this.props.visualElement;e&&(e.root.didUpdate(),queueMicrotask(()=>{!e.currentAnimation&&e.isLead()&&this.safeToRemove()}))}componentWillUnmount(){const{visualElement:e,layoutGroup:o,switchLayoutGroup:t}=this.props,{projection:s}=e;s&&(s.scheduleCheckAfterUnmount(),o&&o.group&&o.group.remove(s),t&&t.deregister&&t.deregister(s))}safeToRemove(){const{safeToRemove:e}=this.props;e&&e()}render(){return null}}function g(a){const[e,o]=p.usePresence(),t=u.useContext(l.LayoutGroupContext);return u.createElement(y,{...a,layoutGroup:t,switchLayoutGroup:u.useContext(m.SwitchLayoutGroupContext),isPresent:e,safeToRemove:o})}const v={borderRadius:{...n.correctBorderRadius,applyTo:["borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius"]},borderTopLeftRadius:n.correctBorderRadius,borderTopRightRadius:n.correctBorderRadius,borderBottomLeftRadius:n.correctBorderRadius,borderBottomRightRadius:n.correctBorderRadius,boxShadow:R.correctBoxShadow};exports.MeasureLayout=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./lyra117.cjs"),g=require("react");function l(o){let e=a.useOverlayTriggerState(o),[u,r]=g.useState(null);return{focusStrategy:u,...e,open(t=null){r(t),e.open()},toggle(t=null){r(t),e.toggle()}}}exports.useMenuTriggerState=l;

package/dist/lyra255.js

@@ -1,72 +1,18 @@
-import { frame as m } from "./lyra160.js";
-import d, { useContext as p } from "react";
-import { usePresence as c } from "./lyra146.js";
-import { LayoutGroupContext as f } from "./lyra134.js";
-import { SwitchLayoutGroupContext as l } from "./lyra157.js";
-import { globalProjectionState as h } from "./lyra307.js";
-import { correctBorderRadius as n } from "./lyra308.js";
-import { correctBoxShadow as R } from "./lyra309.js";
-import { addScaleCorrector as g } from "./lyra177.js";
-class y extends d.Component {
-  /**
-   * 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: e, layoutGroup: o, switchLayoutGroup: t, layoutId: i } = this.props, { projection: r } = e;
-    g(v), r && (o.group && o.group.add(r), t && t.register && i && t.register(r), r.root.didUpdate(), r.addEventListener("animationComplete", () => {
-      this.safeToRemove();
-    }), r.setOptions({
-      ...r.options,
-      onExitComplete: () => this.safeToRemove()
-    })), h.hasEverUpdated = !0;
-  }
-  getSnapshotBeforeUpdate(e) {
-    const { layoutDependency: o, visualElement: t, drag: i, isPresent: r } = this.props, s = t.projection;
-    return s && (s.isPresent = r, i || e.layoutDependency !== o || o === void 0 ? s.willUpdate() : this.safeToRemove(), e.isPresent !== r && (r ? s.promote() : s.relegate() || m.postRender(() => {
-      const u = s.getStack();
-      (!u || !u.members.length) && this.safeToRemove();
-    }))), null;
-  }
-  componentDidUpdate() {
-    const { projection: e } = this.props.visualElement;
-    e && (e.root.didUpdate(), queueMicrotask(() => {
-      !e.currentAnimation && e.isLead() && this.safeToRemove();
-    }));
-  }
-  componentWillUnmount() {
-    const { visualElement: e, layoutGroup: o, switchLayoutGroup: t } = this.props, { projection: i } = e;
-    i && (i.scheduleCheckAfterUnmount(), o && o.group && o.group.remove(i), t && t.deregister && t.deregister(i));
-  }
-  safeToRemove() {
-    const { safeToRemove: e } = this.props;
-    e && e();
-  }
-  render() {
-    return null;
-  }
+import { useOverlayTriggerState as g } from "./lyra117.js";
+import { useState as l } from "react";
+function f(o) {
+  let e = g(o), [a, r] = l(null);
+  return {
+    focusStrategy: a,
+    ...e,
+    open(t = null) {
+      r(t), e.open();
+    },
+    toggle(t = null) {
+      r(t), e.toggle();
+    }
+  };
 }
-function w(a) {
-  const [e, o] = c(), t = p(f);
-  return d.createElement(y, { ...a, layoutGroup: t, switchLayoutGroup: p(l), isPresent: e, safeToRemove: o });
-}
-const v = {
-  borderRadius: {
-    ...n,
-    applyTo: [
-      "borderTopLeftRadius",
-      "borderTopRightRadius",
-      "borderBottomLeftRadius",
-      "borderBottomRightRadius"
-    ]
-  },
-  borderTopLeftRadius: n,
-  borderTopRightRadius: n,
-  borderBottomLeftRadius: n,
-  borderBottomRightRadius: n,
-  boxShadow: R
-};
 export {
-  w as MeasureLayout
+  f as useMenuTriggerState
 };

package/dist/lyra256.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./lyra265.cjs"),n=require("./lyra266.cjs"),e={current:void 0},c=r.createProjectionNode({measureScroll:o=>({x:o.scrollLeft,y:o.scrollTop}),defaultParent:()=>{if(!e.current){const o=new n.DocumentProjectionNode({});o.mount(window),o.setOptions({layoutScroll:!0}),e.current=o}return e.current},resetTransform:(o,t)=>{o.style.transform=t!==void 0?t:"none"},checkIsScrollRoot:o=>window.getComputedStyle(o).position==="fixed"});exports.HTMLProjectionNode=c;exports.rootProjectionNode=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./lyra294.cjs");function r(e){return typeof e!="string"||e.includes("-")?!1:!!(t.lowercaseSVGElements.indexOf(e)>-1||/[A-Z]/.test(e))}exports.isSVGComponent=r;

package/dist/lyra256.js

@@ -1,25 +1,24 @@
-import { createProjectionNode as t } from "./lyra265.js";
-import { DocumentProjectionNode as n } from "./lyra266.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;
-    }
-    return e.current;
-  },
-  resetTransform: (o, r) => {
-    o.style.transform = r !== void 0 ? r : "none";
-  },
-  checkIsScrollRoot: (o) => window.getComputedStyle(o).position === "fixed"
-});
+import { lowercaseSVGElements as r } from "./lyra294.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]/.test(e))
+    )
+  );
+}
 export {
-  i as HTMLProjectionNode,
-  e as rootProjectionNode
+  s as isSVGComponent
 };

package/dist/lyra257.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./lyra300.cjs"),u=require("./lyra194.cjs"),l=require("./lyra168.cjs"),a=require("./lyra298.cjs"),c=require("./lyra301.cjs"),d=require("./lyra281.cjs"),p=require("./lyra302.cjs"),m=require("./lyra303.cjs"),V=require("./lyra140.cjs");function n(i){return window.getComputedStyle(i)}class h extends m.DOMVisualElement{readValueFromInstance(t,e){if(l.transformProps.has(e)){const r=d.getDefaultValueType(e);return r&&r.default||0}else{const r=n(t),s=(u.isCSSVariableName(e)?r.getPropertyValue(e):r[e])||0;return typeof s=="string"?s.trim():s}}measureInstanceViewportBox(t,{transformPagePoint:e}){return p.measureViewportBox(t,e)}build(t,e,r,s){o.buildHTMLStyles(t,e,r,s.transformTemplate)}scrapeMotionValuesFromProps(t,e){return a.scrapeMotionValuesFromProps(t,e)}handleChildMotionValue(){this.childSubscription&&(this.childSubscription(),delete this.childSubscription);const{children:t}=this.props;V.isMotionValue(t)&&(this.childSubscription=t.on("change",e=>{this.current&&(this.current.textContent=`${e}`)}))}renderInstance(t,e,r,s){c.renderHTML(t,e,r,s)}}exports.HTMLVisualElement=h;exports.getComputedStyle=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),P=require("./lyra295.cjs"),a=require("./lyra243.cjs"),p=require("./lyra256.cjs"),f=require("./lyra296.cjs"),q=require("./lyra154.cjs");function V(o=!1){return(e,s,n,{latestValues:i},u)=>{const c=(p.isSVGComponent(e)?f.useSVGProps:P.useHTMLProps)(s,i,u,e),l={...a.filterProps(s,typeof e=="string",o),...c,ref:n},{children:r}=s,d=t.useMemo(()=>q.isMotionValue(r)?r.get():r,[r]);return t.createElement(e,{...l,children:d})}}exports.createUseRender=V;

package/dist/lyra257.js

@@ -1,46 +1,22 @@
-import { buildHTMLStyles as n } from "./lyra300.js";
-import { isCSSVariableName as s } from "./lyra194.js";
-import { transformProps as l } from "./lyra168.js";
-import { scrapeMotionValuesFromProps as m } from "./lyra298.js";
-import { renderHTML as u } from "./lyra301.js";
-import { getDefaultValueType as a } from "./lyra281.js";
-import { measureViewportBox as p } from "./lyra302.js";
-import { DOMVisualElement as c } from "./lyra303.js";
-import { isMotionValue as d } from "./lyra140.js";
-function f(i) {
-  return window.getComputedStyle(i);
-}
-class w extends c {
-  readValueFromInstance(e, t) {
-    if (l.has(t)) {
-      const r = a(t);
-      return r && r.default || 0;
-    } else {
-      const r = f(e), o = (s(t) ? r.getPropertyValue(t) : r[t]) || 0;
-      return typeof o == "string" ? o.trim() : o;
-    }
-  }
-  measureInstanceViewportBox(e, { transformPagePoint: t }) {
-    return p(e, t);
-  }
-  build(e, t, r, o) {
-    n(e, t, r, o.transformTemplate);
-  }
-  scrapeMotionValuesFromProps(e, t) {
-    return m(e, t);
-  }
-  handleChildMotionValue() {
-    this.childSubscription && (this.childSubscription(), delete this.childSubscription);
-    const { children: e } = this.props;
-    d(e) && (this.childSubscription = e.on("change", (t) => {
-      this.current && (this.current.textContent = `${t}`);
-    }));
-  }
-  renderInstance(e, t, r, o) {
-    u(e, t, r, o);
-  }
+import { useMemo as c, createElement as f } from "react";
+import { useHTMLProps as p } from "./lyra295.js";
+import { filterProps as d } from "./lyra243.js";
+import { isSVGComponent as P } from "./lyra256.js";
+import { useSVGProps as a } from "./lyra296.js";
+import { isMotionValue as V } from "./lyra154.js";
+function E(o = !1) {
+  return (e, s, t, { latestValues: i }, n) => {
+    const u = (P(e) ? a : p)(s, i, n, e), l = {
+      ...d(s, typeof e == "string", o),
+      ...u,
+      ref: t
+    }, { children: r } = s, m = c(() => V(r) ? r.get() : r, [r]);
+    return f(e, {
+      ...l,
+      children: m
+    });
+  };
 }
 export {
-  w as HTMLVisualElement,
-  f as getComputedStyle
+  E as createUseRender
 };

package/dist/lyra258.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./lyra294.cjs"),u=require("./lyra303.cjs"),o=require("./lyra296.cjs"),n=require("./lyra199.cjs"),i=require("./lyra304.cjs"),l=require("./lyra168.cjs"),c=require("./lyra293.cjs"),m=require("./lyra281.cjs"),V=require("./lyra161.cjs"),d=require("./lyra297.cjs");class g extends u.DOMVisualElement{constructor(){super(...arguments),this.isSVGTag=!1}getBaseTargetFromProps(r,e){return r[e]}readValueFromInstance(r,e){if(l.transformProps.has(e)){const t=m.getDefaultValueType(e);return t&&t.default||0}return e=i.camelCaseAttributes.has(e)?e:n.camelToDash(e),r.getAttribute(e)}measureInstanceViewportBox(){return V.createBox()}scrapeMotionValuesFromProps(r,e){return a.scrapeMotionValuesFromProps(r,e)}build(r,e,t,s){o.buildSVGAttrs(r,e,t,this.isSVGTag,s.transformTemplate)}renderInstance(r,e,t,s){c.renderSVG(r,e,t,s)}mount(r){this.isSVGTag=d.isSVGTag(r.tagName),super.mount(r)}}exports.SVGVisualElement=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("./lyra297.cjs"),i=require("./lyra298.cjs"),a=require("./lyra244.cjs"),n=require("./lyra299.cjs"),u=require("./lyra300.cjs"),c=require("./lyra301.cjs"),g={useVisualState:a.makeUseVisualState({scrapeMotionValuesFromProps:i.scrapeMotionValuesFromProps,createRenderState:n.createSvgRenderState,onMount:(o,e,{renderState:t,latestValues:r})=>{try{t.dimensions=typeof e.getBBox=="function"?e.getBBox():e.getBoundingClientRect()}catch{t.dimensions={x:0,y:0,width:0,height:0}}u.buildSVGAttrs(t,r,{enableHardwareAcceleration:!1},c.isSVGTag(e.tagName),o.transformTemplate),s.renderSVG(e,t)}})};exports.svgMotionConfig=g;

package/dist/lyra258.js

@@ -1,43 +1,28 @@
-import { scrapeMotionValuesFromProps as s } from "./lyra294.js";
-import { DOMVisualElement as a } from "./lyra303.js";
-import { buildSVGAttrs as m } from "./lyra296.js";
-import { camelToDash as i } from "./lyra199.js";
-import { camelCaseAttributes as u } from "./lyra304.js";
-import { transformProps as n } from "./lyra168.js";
-import { renderSVG as p } from "./lyra293.js";
-import { getDefaultValueType as l } from "./lyra281.js";
-import { createBox as f } from "./lyra161.js";
-import { isSVGTag as V } from "./lyra297.js";
-class A extends a {
-  constructor() {
-    super(...arguments), this.isSVGTag = !1;
-  }
-  getBaseTargetFromProps(t, r) {
-    return t[r];
-  }
-  readValueFromInstance(t, r) {
-    if (n.has(r)) {
-      const e = l(r);
-      return e && e.default || 0;
+import { renderSVG as i } from "./lyra297.js";
+import { scrapeMotionValuesFromProps as m } from "./lyra298.js";
+import { makeUseVisualState as a } from "./lyra244.js";
+import { createSvgRenderState as s } from "./lyra299.js";
+import { buildSVGAttrs as p } from "./lyra300.js";
+import { isSVGTag as f } from "./lyra301.js";
+const B = {
+  useVisualState: a({
+    scrapeMotionValuesFromProps: m,
+    createRenderState: s,
+    onMount: (e, o, { renderState: t, latestValues: r }) => {
+      try {
+        t.dimensions = typeof o.getBBox == "function" ? o.getBBox() : o.getBoundingClientRect();
+      } catch {
+        t.dimensions = {
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0
+        };
+      }
+      p(t, r, { enableHardwareAcceleration: !1 }, f(o.tagName), e.transformTemplate), i(o, t);
     }
-    return r = u.has(r) ? r : i(r), t.getAttribute(r);
-  }
-  measureInstanceViewportBox() {
-    return f();
-  }
-  scrapeMotionValuesFromProps(t, r) {
-    return s(t, r);
-  }
-  build(t, r, e, o) {
-    m(t, r, e, this.isSVGTag, o.transformTemplate);
-  }
-  renderInstance(t, r, e, o) {
-    p(t, r, e, o);
-  }
-  mount(t) {
-    this.isSVGTag = V(t.tagName), super.mount(t);
-  }
-}
+  })
+};
 export {
-  A as SVGVisualElement
+  B as svgMotionConfig
 };