UNPKG

@acrool/react-toaster

Version:
1,707 lines 187 kB
var Qr = Object.defineProperty; var to = (t, e, n) => e in t ? Qr(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n; var wt = (t, e, n) => to(t, typeof e != "symbol" ? e + "" : e, n); import * as q from "react"; import fn, { createContext as Lt, useRef as nt, useId as dn, useContext as N, useInsertionEffect as Ti, useCallback as Pe, useMemo as yt, useEffect as te, Children as eo, isValidElement as no, useLayoutEffect as so, useState as Ye, forwardRef as io, Fragment as xi, createElement as ro, Component as oo } from "react"; import ao from "react-dom"; var re = { exports: {} }, It = {}; /** * @license React * react-jsx-runtime.production.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var qn; function lo() { if (qn) return It; qn = 1; var t = Symbol.for("react.transitional.element"), e = Symbol.for("react.fragment"); function n(s, i, o) { var r = null; if (o !== void 0 && (r = "" + o), i.key !== void 0 && (r = "" + i.key), "key" in i) { o = {}; for (var a in i) a !== "key" && (o[a] = i[a]); } else o = i; return i = o.ref, { $$typeof: t, type: s, key: r, ref: i !== void 0 ? i : null, props: o }; } return It.Fragment = e, It.jsx = n, It.jsxs = n, It; } var _t = {}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var Xn; function co() { return Xn || (Xn = 1, process.env.NODE_ENV !== "production" && function() { function t(p) { if (p == null) return null; if (typeof p == "function") return p.$$typeof === W ? null : p.displayName || p.name || null; if (typeof p == "string") return p; switch (p) { case g: return "Fragment"; case y: return "Profiler"; case v: return "StrictMode"; case T: return "Suspense"; case V: return "SuspenseList"; case k: return "Activity"; } if (typeof p == "object") switch (typeof p.tag == "number" && console.error( "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue." ), p.$$typeof) { case m: return "Portal"; case P: return (p.displayName || "Context") + ".Provider"; case x: return (p._context.displayName || "Context") + ".Consumer"; case S: var A = p.render; return p = p.displayName, p || (p = A.displayName || A.name || "", p = p !== "" ? "ForwardRef(" + p + ")" : "ForwardRef"), p; case C: return A = p.displayName || null, A !== null ? A : t(p.type) || "Memo"; case b: A = p._payload, p = p._init; try { return t(p(A)); } catch { } } return null; } function e(p) { return "" + p; } function n(p) { try { e(p); var A = !1; } catch { A = !0; } if (A) { A = console; var R = A.error, I = typeof Symbol == "function" && Symbol.toStringTag && p[Symbol.toStringTag] || p.constructor.name || "Object"; return R.call( A, "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", I ), e(p); } } function s(p) { if (p === g) return "<>"; if (typeof p == "object" && p !== null && p.$$typeof === b) return "<...>"; try { var A = t(p); return A ? "<" + A + ">" : "<...>"; } catch { return "<...>"; } } function i() { var p = X.A; return p === null ? null : p.getOwner(); } function o() { return Error("react-stack-top-frame"); } function r(p) { if (Ft.call(p, "key")) { var A = Object.getOwnPropertyDescriptor(p, "key").get; if (A && A.isReactWarning) return !1; } return p.key !== void 0; } function a(p, A) { function R() { De || (De = !0, console.error( "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)", A )); } R.isReactWarning = !0, Object.defineProperty(p, "key", { get: R, configurable: !0 }); } function l() { var p = t(this.type); return Me[p] || (Me[p] = !0, console.error( "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release." )), p = this.props.ref, p !== void 0 ? p : null; } function c(p, A, R, I, rt, Z, Le, ke) { return R = Z.ref, p = { $$typeof: d, type: p, key: A, props: Z, _owner: rt }, (R !== void 0 ? R : null) !== null ? Object.defineProperty(p, "ref", { enumerable: !1, get: l }) : Object.defineProperty(p, "ref", { enumerable: !1, value: null }), p._store = {}, Object.defineProperty(p._store, "validated", { configurable: !1, enumerable: !1, writable: !0, value: 0 }), Object.defineProperty(p, "_debugInfo", { configurable: !1, enumerable: !1, writable: !0, value: null }), Object.defineProperty(p, "_debugStack", { configurable: !1, enumerable: !1, writable: !0, value: Le }), Object.defineProperty(p, "_debugTask", { configurable: !1, enumerable: !1, writable: !0, value: ke }), Object.freeze && (Object.freeze(p.props), Object.freeze(p)), p; } function u(p, A, R, I, rt, Z, Le, ke) { var _ = A.children; if (_ !== void 0) if (I) if (Re(_)) { for (I = 0; I < _.length; I++) h(_[I]); Object.freeze && Object.freeze(_); } else console.error( "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead." ); else h(_); if (Ft.call(A, "key")) { _ = t(p); var Pt = Object.keys(A).filter(function(Jr) { return Jr !== "key"; }); I = 0 < Pt.length ? "{key: someKey, " + Pt.join(": ..., ") + ": ...}" : "{key: someKey}", xt[_ + I] || (Pt = 0 < Pt.length ? "{" + Pt.join(": ..., ") + ": ...}" : "{}", console.error( `A props object containing a "key" prop is being spread into JSX: let props = %s; <%s {...props} /> React keys must be passed directly to JSX without using spread: let props = %s; <%s key={someKey} {...props} />`, I, _, Pt, _ ), xt[_ + I] = !0); } if (_ = null, R !== void 0 && (n(R), _ = "" + R), r(A) && (n(A.key), _ = "" + A.key), "key" in A) { R = {}; for (var Oe in A) Oe !== "key" && (R[Oe] = A[Oe]); } else R = A; return _ && a( R, typeof p == "function" ? p.displayName || p.name || "Unknown" : p ), c( p, _, Z, rt, i(), R, Le, ke ); } function h(p) { typeof p == "object" && p !== null && p.$$typeof === d && p._store && (p._store.validated = 1); } var f = fn, d = Symbol.for("react.transitional.element"), m = Symbol.for("react.portal"), g = Symbol.for("react.fragment"), v = Symbol.for("react.strict_mode"), y = Symbol.for("react.profiler"), x = Symbol.for("react.consumer"), P = Symbol.for("react.context"), S = Symbol.for("react.forward_ref"), T = Symbol.for("react.suspense"), V = Symbol.for("react.suspense_list"), C = Symbol.for("react.memo"), b = Symbol.for("react.lazy"), k = Symbol.for("react.activity"), W = Symbol.for("react.client.reference"), X = f.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Ft = Object.prototype.hasOwnProperty, Re = Array.isArray, Tt = console.createTask ? console.createTask : function() { return null; }; f = { "react-stack-bottom-frame": function(p) { return p(); } }; var De, Me = {}, O = f["react-stack-bottom-frame"].bind( f, o )(), K = Tt(s(o)), xt = {}; _t.Fragment = g, _t.jsx = function(p, A, R, I, rt) { var Z = 1e4 > X.recentlyCreatedOwnerStacks++; return u( p, A, R, !1, I, rt, Z ? Error("react-stack-top-frame") : O, Z ? Tt(s(p)) : K ); }, _t.jsxs = function(p, A, R, I, rt) { var Z = 1e4 > X.recentlyCreatedOwnerStacks++; return u( p, A, R, !0, I, rt, Z ? Error("react-stack-top-frame") : O, Z ? Tt(s(p)) : K ); }; }()), _t; } var Zn; function uo() { return Zn || (Zn = 1, process.env.NODE_ENV === "production" ? re.exports = lo() : re.exports = co()), re.exports; } var j = uo(), ho = Object.defineProperty, fo = (t, e, n) => e in t ? ho(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, He = (t, e, n) => fo(t, typeof e != "symbol" ? e + "" : e, n); function po(t) { return Object.keys(t); } function Jn(t) { const e = document.createElement("div"); return e.id = t.id, t.className && (e.className = t.className), t.style && po(t.style).forEach((n) => { var s; e.style[n] = (s = t.style) == null ? void 0 : s[n]; }), e; } class Pi extends fn.Component { constructor(e) { super(e), He(this, "_el", null), He(this, "renderPortal", () => this._el ? ao.createPortal( this.props.children, this._el ) : null), !(typeof window > "u") && (this._el = Jn(e)); } get typeProps() { return this.props; } componentDidMount() { this._el = this._el ? this._el : Jn(this.props); const e = this.typeProps.containerSelector(); e == null || e.appendChild(this._el); } componentWillUnmount() { if (!this._el) return; const e = this.typeProps.containerSelector(); e == null || e.removeChild(this._el); } render() { return this.renderPortal(); } } He(Pi, "defaultProps", { containerSelector: () => document.body }); function wi(t) { var e, n, s = ""; if (typeof t == "string" || typeof t == "number") s += t; else if (typeof t == "object") if (Array.isArray(t)) { var i = t.length; for (e = 0; e < i; e++) t[e] && (n = wi(t[e])) && (s && (s += " "), s += n); } else for (n in t) t[n] && (s && (s += " "), s += n); return s; } function bi() { for (var t, e, n = 0, s = "", i = arguments.length; n < i; n++) (t = arguments[n]) && (e = wi(t)) && (s && (s += " "), s += e); return s; } const pn = Lt({}); function mn(t) { const e = nt(null); return e.current === null && (e.current = t()), e.current; } const we = Lt(null), gn = Lt({ transformPagePoint: (t) => t, isStatic: !1, reducedMotion: "never" }); class mo extends q.Component { getSnapshotBeforeUpdate(e) { const n = this.props.childRef.current; if (n && e.isPresent && !this.props.isPresent) { const s = this.props.sizeRef.current; s.height = n.offsetHeight || 0, s.width = n.offsetWidth || 0, s.top = n.offsetTop, s.left = n.offsetLeft; } return null; } /** * Required with getSnapshotBeforeUpdate to stop React complaining. */ componentDidUpdate() { } render() { return this.props.children; } } function go({ children: t, isPresent: e }) { const n = dn(), s = nt(null), i = nt({ width: 0, height: 0, top: 0, left: 0 }), { nonce: o } = N(gn); return Ti(() => { const { width: r, height: a, top: l, left: c } = i.current; if (e || !s.current || !r || !a) return; s.current.dataset.motionPopId = n; const u = document.createElement("style"); return o && (u.nonce = o), document.head.appendChild(u), u.sheet && u.sheet.insertRule(` [data-motion-pop-id="${n}"] { position: absolute !important; width: ${r}px !important; height: ${a}px !important; top: ${l}px !important; left: ${c}px !important; } `), () => { document.head.removeChild(u); }; }, [e]), j.jsx(mo, { isPresent: e, childRef: s, sizeRef: i, children: q.cloneElement(t, { ref: s }) }); } const yo = ({ children: t, initial: e, isPresent: n, onExitComplete: s, custom: i, presenceAffectsLayout: o, mode: r }) => { const a = mn(vo), l = dn(), c = Pe((h) => { a.set(h, !0); for (const f of a.values()) if (!f) return; s && s(); }, [a, s]), u = yt( () => ({ id: l, initial: e, isPresent: n, custom: i, onExitComplete: c, register: (h) => (a.set(h, !1), () => a.delete(h)) }), /** * If the presence of a child affects the layout of the components around it, * we want to make a new context value to ensure they get re-rendered * so they can detect that layout change. */ o ? [Math.random(), c] : [n, c] ); return yt(() => { a.forEach((h, f) => a.set(f, !1)); }, [n]), q.useEffect(() => { !n && !a.size && s && s(); }, [n]), r === "popLayout" && (t = j.jsx(go, { isPresent: n, children: t })), j.jsx(we.Provider, { value: u, children: t }); }; function vo() { return /* @__PURE__ */ new Map(); } function Si(t = !0) { const e = N(we); if (e === null) return [!0, null]; const { isPresent: n, onExitComplete: s, register: i } = e, o = dn(); te(() => { t && i(o); }, [t]); const r = Pe(() => t && s && s(o), [o, s, t]); return !n && s ? [!1, r] : [!0]; } const oe = (t) => t.key || ""; function Qn(t) { const e = []; return eo.forEach(t, (n) => { no(n) && e.push(n); }), e; } const yn = typeof window < "u", Ai = yn ? so : te, To = ({ children: t, custom: e, initial: n = !0, onExitComplete: s, presenceAffectsLayout: i = !0, mode: o = "sync", propagate: r = !1 }) => { const [a, l] = Si(r), c = yt(() => Qn(t), [t]), u = r && !a ? [] : c.map(oe), h = nt(!0), f = nt(c), d = mn(() => /* @__PURE__ */ new Map()), [m, g] = Ye(c), [v, y] = Ye(c); Ai(() => { h.current = !1, f.current = c; for (let S = 0; S < v.length; S++) { const T = oe(v[S]); u.includes(T) ? d.delete(T) : d.get(T) !== !0 && d.set(T, !1); } }, [v, u.length, u.join("-")]); const x = []; if (c !== m) { let S = [...c]; for (let T = 0; T < v.length; T++) { const V = v[T], C = oe(V); u.includes(C) || (S.splice(T, 0, V), x.push(V)); } o === "wait" && x.length && (S = x), y(Qn(S)), g(c); return; } process.env.NODE_ENV !== "production" && o === "wait" && v.length > 1 && console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to "wait". This will lead to odd visual behaviour.`); const { forceRender: P } = N(pn); return j.jsx(j.Fragment, { children: v.map((S) => { const T = oe(S), V = r && !a ? !1 : c === v || u.includes(T), C = () => { if (d.has(T)) d.set(T, !0); else return; let b = !0; d.forEach((k) => { k || (b = !1); }), b && (P == null || P(), y(f.current), r && (l == null || l()), s && s()); }; return j.jsx(yo, { isPresent: V, initial: !h.current || n ? void 0 : !1, custom: V ? void 0 : e, presenceAffectsLayout: i, mode: o, onExitComplete: V ? void 0 : C, children: S }, T); }) }); }, $ = /* @__NO_SIDE_EFFECTS__ */ (t) => t; let kt = $, at = $; process.env.NODE_ENV !== "production" && (kt = (t, e) => { !t && typeof console < "u" && console.warn(e); }, at = (t, e) => { if (!t) throw new Error(e); }); // @__NO_SIDE_EFFECTS__ function vn(t) { let e; return () => (e === void 0 && (e = t()), e); } const Rt = /* @__NO_SIDE_EFFECTS__ */ (t, e, n) => { const s = e - t; return s === 0 ? 1 : (n - t) / s; }, J = /* @__NO_SIDE_EFFECTS__ */ (t) => t * 1e3, st = /* @__NO_SIDE_EFFECTS__ */ (t) => t / 1e3, xo = { useManualTiming: !1 }; function Po(t) { let e = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set(), s = !1, i = !1; const o = /* @__PURE__ */ new WeakSet(); let r = { delta: 0, timestamp: 0, isProcessing: !1 }; function a(c) { o.has(c) && (l.schedule(c), t()), c(r); } const l = { /** * Schedule a process to run on the next frame. */ schedule: (c, u = !1, h = !1) => { const d = h && s ? e : n; return u && o.add(c), d.has(c) || d.add(c), c; }, /** * Cancel the provided callback from running on the next frame. */ cancel: (c) => { n.delete(c), o.delete(c); }, /** * Execute all schedule callbacks. */ process: (c) => { if (r = c, s) { i = !0; return; } s = !0, [e, n] = [n, e], e.forEach(a), e.clear(), s = !1, i && (i = !1, l.process(c)); } }; return l; } const ae = [ "read", // Read "resolveKeyframes", // Write/Read/Write/Read "update", // Compute "preRender", // Compute "render", // Write "postRender" // Compute ], wo = 40; function Vi(t, e) { let n = !1, s = !0; const i = { delta: 0, timestamp: 0, isProcessing: !1 }, o = () => n = !0, r = ae.reduce((y, x) => (y[x] = Po(o), y), {}), { read: a, resolveKeyframes: l, update: c, preRender: u, render: h, postRender: f } = r, d = () => { const y = performance.now(); n = !1, i.delta = s ? 1e3 / 60 : Math.max(Math.min(y - i.timestamp, wo), 1), i.timestamp = y, i.isProcessing = !0, a.process(i), l.process(i), c.process(i), u.process(i), h.process(i), f.process(i), i.isProcessing = !1, n && e && (s = !1, t(d)); }, m = () => { n = !0, s = !0, i.isProcessing || t(d); }; return { schedule: ae.reduce((y, x) => { const P = r[x]; return y[x] = (S, T = !1, V = !1) => (n || m(), P.schedule(S, T, V)), y; }, {}), cancel: (y) => { for (let x = 0; x < ae.length; x++) r[ae[x]].cancel(y); }, state: i, steps: r }; } const { schedule: E, cancel: lt, state: F, steps: je } = Vi(typeof requestAnimationFrame < "u" ? requestAnimationFrame : $, !0), Ei = Lt({ strict: !1 }), ts = { animation: [ "animate", "variants", "whileHover", "whileTap", "exit", "whileInView", "whileFocus", "whileDrag" ], exit: ["exit"], drag: ["drag", "dragControls"], focus: ["whileFocus"], hover: ["whileHover", "onHoverStart", "onHoverEnd"], tap: ["whileTap", "onTap", "onTapStart", "onTapCancel"], pan: ["onPan", "onPanStart", "onPanSessionStart", "onPanEnd"], inView: ["whileInView", "onViewportEnter", "onViewportLeave"], layout: ["layout", "layoutId"] }, Dt = {}; for (const t in ts) Dt[t] = { isEnabled: (e) => ts[t].some((n) => !!e[n]) }; function bo(t) { for (const e in t) Dt[e] = { ...Dt[e], ...t[e] }; } const So = /* @__PURE__ */ new Set([ "animate", "exit", "variants", "initial", "style", "values", "variants", "transition", "transformTemplate", "custom", "inherit", "onBeforeLayoutMeasure", "onAnimationStart", "onAnimationComplete", "onUpdate", "onDragStart", "onDrag", "onDragEnd", "onMeasureDragConstraints", "onDirectionLock", "onDragTransitionEnd", "_dragX", "_dragY", "onHoverStart", "onHoverEnd", "onViewportEnter", "onViewportLeave", "globalTapTarget", "ignoreStrict", "viewport" ]); function pe(t) { return t.startsWith("while") || t.startsWith("drag") && t !== "draggable" || t.startsWith("layout") || t.startsWith("onTap") || t.startsWith("onPan") || t.startsWith("onLayout") || So.has(t); } let Ci = (t) => !pe(t); function Ao(t) { t && (Ci = (e) => e.startsWith("on") ? !pe(e) : t(e)); } try { Ao(require("@emotion/is-prop-valid").default); } catch { } function Vo(t, e, n) { const s = {}; for (const i in t) i === "values" && typeof t.values == "object" || (Ci(i) || n === !0 && pe(i) || !e && !pe(i) || // If trying to use native HTML drag events, forward drag listeners t.draggable && i.startsWith("onDrag")) && (s[i] = t[i]); return s; } const es = /* @__PURE__ */ new Set(); function be(t, e, n) { t || es.has(e) || (console.warn(e), es.add(e)); } function Eo(t) { if (typeof Proxy > "u") return t; const e = /* @__PURE__ */ new Map(), n = (...s) => (process.env.NODE_ENV !== "production" && be(!1, "motion() is deprecated. Use motion.create() instead."), t(...s)); return new Proxy(n, { /** * Called when `motion` is referenced with a prop: `motion.div`, `motion.input` etc. * The prop name is passed through as `key` and we can use that to generate a `motion` * DOM component with that name. */ get: (s, i) => i === "create" ? t : (e.has(i) || e.set(i, t(i)), e.get(i)) }); } const Se = Lt({}); function qt(t) { return typeof t == "string" || Array.isArray(t); } function Ae(t) { return t !== null && typeof t == "object" && typeof t.start == "function"; } const Tn = [ "animate", "whileInView", "whileFocus", "whileHover", "whileTap", "whileDrag", "exit" ], xn = ["initial", ...Tn]; function Ve(t) { return Ae(t.animate) || xn.some((e) => qt(t[e])); } function Ri(t) { return !!(Ve(t) || t.variants); } function Co(t, e) { if (Ve(t)) { const { initial: n, animate: s } = t; return { initial: n === !1 || qt(n) ? n : void 0, animate: qt(s) ? s : void 0 }; } return t.inherit !== !1 ? e : {}; } function Ro(t) { const { initial: e, animate: n } = Co(t, N(Se)); return yt(() => ({ initial: e, animate: n }), [ns(e), ns(n)]); } function ns(t) { return Array.isArray(t) ? t.join(" ") : t; } const Do = Symbol.for("motionComponentSymbol"); function St(t) { return t && typeof t == "object" && Object.prototype.hasOwnProperty.call(t, "current"); } function Mo(t, e, n) { return Pe( (s) => { s && t.onMount && t.onMount(s), e && (s ? e.mount(s) : e.unmount()), n && (typeof n == "function" ? n(s) : St(n) && (n.current = s)); }, /** * Only pass a new ref callback to React if we've received a visual element * factory. Otherwise we'll be mounting/remounting every time externalRef * or other dependencies change. */ [e] ); } const Pn = (t) => t.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase(), Lo = "framerAppearId", Di = "data-" + Pn(Lo), { schedule: wn } = Vi(queueMicrotask, !1), Mi = Lt({}); function ko(t, e, n, s, i) { var o, r; const { visualElement: a } = N(Se), l = N(Ei), c = N(we), u = N(gn).reducedMotion, h = nt(null); s = s || l.renderer, !h.current && s && (h.current = s(t, { visualState: e, parent: a, props: n, presenceContext: c, blockInitialAnimation: c ? c.initial === !1 : !1, reducedMotionConfig: u })); const f = h.current, d = N(Mi); f && !f.projection && i && (f.type === "html" || f.type === "svg") && Oo(h.current, n, i, d); const m = nt(!1); Ti(() => { f && m.current && f.update(n, c); }); const g = n[Di], v = nt(!!g && !(!((o = window.MotionHandoffIsComplete) === null || o === void 0) && o.call(window, g)) && ((r = window.MotionHasOptimisedAnimation) === null || r === void 0 ? void 0 : r.call(window, g))); return Ai(() => { f && (m.current = !0, window.MotionIsMounted = !0, f.updateFeatures(), wn.render(f.render), v.current && f.animationState && f.animationState.animateChanges()); }), te(() => { f && (!v.current && f.animationState && f.animationState.animateChanges(), v.current && (queueMicrotask(() => { var y; (y = window.MotionHandoffMarkAsComplete) === null || y === void 0 || y.call(window, g); }), v.current = !1)); }), f; } function Oo(t, e, n, s) { const { layoutId: i, layout: o, drag: r, dragConstraints: a, layoutScroll: l, layoutRoot: c } = e; t.projection = new n(t.latestValues, e["data-framer-portal-id"] ? void 0 : Li(t.parent)), t.projection.setOptions({ layoutId: i, layout: o, alwaysMeasureLayout: !!r || a && St(a), visualElement: t, /** * TODO: Update options in an effect. This could be tricky as it'll be too late * to update by the time layout animations run. * We also need to fix this safeToRemove by linking it up to the one returned by usePresence, * ensuring it gets called if there's no potential layout animations. * */ animationType: typeof o == "string" ? o : "both", initialPromotionConfig: s, layoutScroll: l, layoutRoot: c }); } function Li(t) { if (t) return t.options.allowProjection !== !1 ? t.projection : Li(t.parent); } function jo({ preloadedFeatures: t, createVisualElement: e, useRender: n, useVisualState: s, Component: i }) { var o, r; t && bo(t); function a(c, u) { let h; const f = { ...N(gn), ...c, layoutId: Fo(c) }, { isStatic: d } = f, m = Ro(c), g = s(c, d); if (!d && yn) { Io(f, t); const v = _o(f); h = v.MeasureLayout, m.visualElement = ko(i, g, f, e, v.ProjectionNode); } return j.jsxs(Se.Provider, { value: m, children: [h && m.visualElement ? j.jsx(h, { visualElement: m.visualElement, ...f }) : null, n(i, c, Mo(g, m.visualElement, u), g, d, m.visualElement)] }); } a.displayName = `motion.${typeof i == "string" ? i : `create(${(r = (o = i.displayName) !== null && o !== void 0 ? o : i.name) !== null && r !== void 0 ? r : ""})`}`; const l = io(a); return l[Do] = i, l; } function Fo({ layoutId: t }) { const e = N(pn).id; return e && t !== void 0 ? e + "-" + t : t; } function Io(t, e) { const n = N(Ei).strict; if (process.env.NODE_ENV !== "production" && e && n) { const s = "You have rendered a `motion` component within a `LazyMotion` component. This will break tree shaking. Import and render a `m` component instead."; t.ignoreStrict ? kt(!1, s) : at(!1, s); } } function _o(t) { const { drag: e, layout: n } = Dt; if (!e && !n) return {}; const s = { ...e, ...n }; return { MeasureLayout: e != null && e.isEnabled(t) || n != null && n.isEnabled(t) ? s.MeasureLayout : void 0, ProjectionNode: s.ProjectionNode }; } const Bo = [ "animate", "circle", "defs", "desc", "ellipse", "g", "image", "line", "filter", "marker", "mask", "metadata", "path", "pattern", "polygon", "polyline", "rect", "stop", "switch", "symbol", "svg", "text", "tspan", "use", "view" ]; function bn(t) { return ( /** * If it's not a string, it's a custom React component. Currently we only support * HTML custom React components. */ typeof t != "string" || /** * If it contains a dash, the element is a custom HTML webcomponent. */ t.includes("-") ? !1 : ( /** * If it's in our list of lowercase SVG tags, it's an SVG component */ !!(Bo.indexOf(t) > -1 || /** * If it contains a capital letter, it's an SVG component */ /[A-Z]/u.test(t)) ) ); } function ss(t) { const e = [{}, {}]; return t == null || t.values.forEach((n, s) => { e[0][s] = n.get(), e[1][s] = n.getVelocity(); }), e; } function Sn(t, e, n, s) { if (typeof e == "function") { const [i, o] = ss(s); e = e(n !== void 0 ? n : t.custom, i, o); } if (typeof e == "string" && (e = t.variants && t.variants[e]), typeof e == "function") { const [i, o] = ss(s); e = e(n !== void 0 ? n : t.custom, i, o); } return e; } const qe = (t) => Array.isArray(t), No = (t) => !!(t && typeof t == "object" && t.mix && t.toValue), Uo = (t) => qe(t) ? t[t.length - 1] || 0 : t, U = (t) => !!(t && t.getVelocity); function ue(t) { const e = U(t) ? t.get() : t; return No(e) ? e.toValue() : e; } function Wo({ scrapeMotionValuesFromProps: t, createRenderState: e, onUpdate: n }, s, i, o) { const r = { latestValues: $o(s, i, o, t), renderState: e() }; return n && (r.onMount = (a) => n({ props: s, current: a, ...r }), r.onUpdate = (a) => n(a)), r; } const ki = (t) => (e, n) => { const s = N(Se), i = N(we), o = () => Wo(t, e, s, i); return n ? o() : mn(o); }; function $o(t, e, n, s) { const i = {}, o = s(t, {}); for (const f in o) i[f] = ue(o[f]); let { initial: r, animate: a } = t; const l = Ve(t), c = Ri(t); e && c && !l && t.inherit !== !1 && (r === void 0 && (r = e.initial), a === void 0 && (a = e.animate)); let u = n ? n.initial === !1 : !1; u = u || r === !1; const h = u ? a : r; if (h && typeof h != "boolean" && !Ae(h)) { const f = Array.isArray(h) ? h : [h]; for (let d = 0; d < f.length; d++) { const m = Sn(t, f[d]); if (m) { const { transitionEnd: g, transition: v, ...y } = m; for (const x in y) { let P = y[x]; if (Array.isArray(P)) { const S = u ? P.length - 1 : 0; P = P[S]; } P !== null && (i[x] = P); } for (const x in g) i[x] = g[x]; } } } return i; } const Ot = [ "transformPerspective", "x", "y", "z", "translateX", "translateY", "translateZ", "scale", "scaleX", "scaleY", "rotate", "rotateX", "rotateY", "rotateZ", "skew", "skewX", "skewY" ], vt = new Set(Ot), Oi = (t) => (e) => typeof e == "string" && e.startsWith(t), ji = /* @__PURE__ */ Oi("--"), zo = /* @__PURE__ */ Oi("var(--"), An = (t) => zo(t) ? Ko.test(t.split("/*")[0].trim()) : !1, Ko = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu, Fi = (t, e) => e && typeof t == "number" ? e.transform(t) : t, it = (t, e, n) => n > e ? e : n < t ? t : n, jt = { test: (t) => typeof t == "number", parse: parseFloat, transform: (t) => t }, Xt = { ...jt, transform: (t) => it(0, 1, t) }, le = { ...jt, default: 1 }, ee = (t) => ({ test: (e) => typeof e == "string" && e.endsWith(t) && e.split(" ").length === 1, parse: parseFloat, transform: (e) => `${e}${t}` }), ot = /* @__PURE__ */ ee("deg"), Q = /* @__PURE__ */ ee("%"), w = /* @__PURE__ */ ee("px"), Go = /* @__PURE__ */ ee("vh"), Yo = /* @__PURE__ */ ee("vw"), is = { ...Q, parse: (t) => Q.parse(t) / 100, transform: (t) => Q.transform(t * 100) }, Ho = { // Border props borderWidth: w, borderTopWidth: w, borderRightWidth: w, borderBottomWidth: w, borderLeftWidth: w, borderRadius: w, radius: w, borderTopLeftRadius: w, borderTopRightRadius: w, borderBottomRightRadius: w, borderBottomLeftRadius: w, // Positioning props width: w, maxWidth: w, height: w, maxHeight: w, top: w, right: w, bottom: w, left: w, // Spacing props padding: w, paddingTop: w, paddingRight: w, paddingBottom: w, paddingLeft: w, margin: w, marginTop: w, marginRight: w, marginBottom: w, marginLeft: w, // Misc backgroundPositionX: w, backgroundPositionY: w }, qo = { rotate: ot, rotateX: ot, rotateY: ot, rotateZ: ot, scale: le, scaleX: le, scaleY: le, scaleZ: le, skew: ot, skewX: ot, skewY: ot, distance: w, translateX: w, translateY: w, translateZ: w, x: w, y: w, z: w, perspective: w, transformPerspective: w, opacity: Xt, originX: is, originY: is, originZ: w }, rs = { ...jt, transform: Math.round }, Vn = { ...Ho, ...qo, zIndex: rs, size: w, // SVG fillOpacity: Xt, strokeOpacity: Xt, numOctaves: rs }, Xo = { x: "translateX", y: "translateY", z: "translateZ", transformPerspective: "perspective" }, Zo = Ot.length; function Jo(t, e, n) { let s = "", i = !0; for (let o = 0; o < Zo; o++) { const r = Ot[o], a = t[r]; if (a === void 0) continue; let l = !0; if (typeof a == "number" ? l = a === (r.startsWith("scale") ? 1 : 0) : l = parseFloat(a) === 0, !l || n) { const c = Fi(a, Vn[r]); if (!l) { i = !1; const u = Xo[r] || r; s += `${u}(${c}) `; } n && (e[r] = c); } } return s = s.trim(), n ? s = n(e, i ? "" : s) : i && (s = "none"), s; } function En(t, e, n) { const { style: s, vars: i, transformOrigin: o } = t; let r = !1, a = !1; for (const l in e) { const c = e[l]; if (vt.has(l)) { r = !0; continue; } else if (ji(l)) { i[l] = c; continue; } else { const u = Fi(c, Vn[l]); l.startsWith("origin") ? (a = !0, o[l] = u) : s[l] = u; } } if (e.transform || (r || n ? s.transform = Jo(e, t.transform, n) : s.transform && (s.transform = "none")), a) { const { originX: l = "50%", originY: c = "50%", originZ: u = 0 } = o; s.transformOrigin = `${l} ${c} ${u}`; } } const Qo = { offset: "stroke-dashoffset", array: "stroke-dasharray" }, ta = { offset: "strokeDashoffset", array: "strokeDasharray" }; function ea(t, e, n = 1, s = 0, i = !0) { t.pathLength = 1; const o = i ? Qo : ta; t[o.offset] = w.transform(-s); const r = w.transform(e), a = w.transform(n); t[o.array] = `${r} ${a}`; } function os(t, e, n) { return typeof t == "string" ? t : w.transform(e + n * t); } function na(t, e, n) { const s = os(e, t.x, t.width), i = os(n, t.y, t.height); return `${s} ${i}`; } function Cn(t, { attrX: e, attrY: n, attrScale: s, originX: i, originY: o, pathLength: r, pathSpacing: a = 1, pathOffset: l = 0, // This is object creation, which we try to avoid per-frame. ...c }, u, h) { if (En(t, c, h), u) { t.style.viewBox && (t.attrs.viewBox = t.style.viewBox); return; } t.attrs = t.style, t.style = {}; const { attrs: f, style: d, dimensions: m } = t; f.transform && (m && (d.transform = f.transform), delete f.transform), m && (i !== void 0 || o !== void 0 || d.transform) && (d.transformOrigin = na(m, i !== void 0 ? i : 0.5, o !== void 0 ? o : 0.5)), e !== void 0 && (f.x = e), n !== void 0 && (f.y = n), s !== void 0 && (f.scale = s), r !== void 0 && ea(f, r, a, l, !1); } const Rn = () => ({ style: {}, transform: {}, transformOrigin: {}, vars: {} }), Ii = () => ({ ...Rn(), attrs: {} }), Dn = (t) => typeof t == "string" && t.toLowerCase() === "svg"; function _i(t, { style: e, vars: n }, s, i) { Object.assign(t.style, e, i && i.getProjectionStyles(s)); for (const o in n) t.style.setProperty(o, n[o]); } const Bi = /* @__PURE__ */ new Set([ "baseFrequency", "diffuseConstant", "kernelMatrix", "kernelUnitLength", "keySplines", "keyTimes", "limitingConeAngle", "markerHeight", "markerWidth", "numOctaves", "targetX", "targetY", "surfaceScale", "specularConstant", "specularExponent", "stdDeviation", "tableValues", "viewBox", "gradientTransform", "pathLength", "startOffset", "textLength", "lengthAdjust" ]); function Ni(t, e, n, s) { _i(t, e, void 0, s); for (const i in e.attrs) t.setAttribute(Bi.has(i) ? i : Pn(i), e.attrs[i]); } const me = {}; function sa(t) { Object.assign(me, t); } function Ui(t, { layout: e, layoutId: n }) { return vt.has(t) || t.startsWith("origin") || (e || n !== void 0) && (!!me[t] || t === "opacity"); } function Mn(t, e, n) { var s; const { style: i } = t, o = {}; for (const r in i) (U(i[r]) || e.style && U(e.style[r]) || Ui(r, t) || ((s = n == null ? void 0 : n.getValue(r)) === null || s === void 0 ? void 0 : s.liveStyle) !== void 0) && (o[r] = i[r]); return o; } function Wi(t, e, n) { const s = Mn(t, e, n); for (const i in t) if (U(t[i]) || U(e[i])) { const o = Ot.indexOf(i) !== -1 ? "attr" + i.charAt(0).toUpperCase() + i.substring(1) : i; s[o] = t[i]; } return s; } function ia(t, e) { try { e.dimensions = typeof t.getBBox == "function" ? t.getBBox() : t.getBoundingClientRect(); } catch { e.dimensions = { x: 0, y: 0, width: 0, height: 0 }; } } const as = ["x", "y", "width", "height", "cx", "cy", "r"], ra = { useVisualState: ki({ scrapeMotionValuesFromProps: Wi, createRenderState: Ii, onUpdate: ({ props: t, prevProps: e, current: n, renderState: s, latestValues: i }) => { if (!n) return; let o = !!t.drag; if (!o) { for (const a in i) if (vt.has(a)) { o = !0; break; } } if (!o) return; let r = !e; if (e) for (let a = 0; a < as.length; a++) { const l = as[a]; t[l] !== e[l] && (r = !0); } r && E.read(() => { ia(n, s), E.render(() => { Cn(s, i, Dn(n.tagName), t.transformTemplate), Ni(n, s); }); }); } }) }, oa = { useVisualState: ki({ scrapeMotionValuesFromProps: Mn, createRenderState: Rn }) }; function $i(t, e, n) { for (const s in e) !U(e[s]) && !Ui(s, n) && (t[s] = e[s]); } function aa({ transformTemplate: t }, e) { return yt(() => { const n = Rn(); return En(n, e, t), Object.assign({}, n.vars, n.style); }, [e]); } function la(t, e) { const n = t.style || {}, s = {}; return $i(s, n, t), Object.assign(s, aa(t, e)), s; } function ca(t, e) { const n = {}, s = la(t, e); return t.drag && t.dragListener !== !1 && (n.draggable = !1, s.userSelect = s.WebkitUserSelect = s.WebkitTouchCallout = "none", s.touchAction = t.drag === !0 ? "none" : `pan-${t.drag === "x" ? "y" : "x"}`), t.tabIndex === void 0 && (t.onTap || t.onTapStart || t.whileTap) && (n.tabIndex = 0), n.style = s, n; } function ua(t, e, n, s) { const i = yt(() => { const o = Ii(); return Cn(o, e, Dn(s), t.transformTemplate), { ...o.attrs, style: { ...o.style } }; }, [e]); if (t.style) { const o = {}; $i(o, t.style, t), i.style = { ...o, ...i.style }; } return i; } function ha(t = !1) { return (n, s, i, { latestValues: o }, r) => { const l = (bn(n) ? ua : ca)(s, o, r, n), c = Vo(s, typeof n == "string", t), u = n !== xi ? { ...c, ...l, ref: i } : {}, { children: h } = s, f = yt(() => U(h) ? h.get() : h, [h]); return ro(n, { ...u, children: f }); }; } function fa(t, e) { return function(s, { forwardMotionProps: i } = { forwardMotionProps: !1 }) { const r = { ...bn(s) ? ra : oa, preloadedFeatures: t, useRender: ha(i), createVisualElement: e, Component: s }; return jo(r); }; } function zi(t, e) { if (!Array.isArray(e)) return !1; const n = e.length; if (n !== t.length) return !1; for (let s = 0; s < n; s++) if (e[s] !== t[s]) return !1; return !0; } function Ee(t, e, n) { const s = t.getProps(); return Sn(s, e, n !== void 0 ? n : s.custom, t); } const da = /* @__PURE__ */ vn(() => window.ScrollTimeline !== void 0); class pa { constructor(e) { this.stop = () => this.runAll("stop"), this.animations = e.filter(Boolean); } get finished() { return Promise.all(this.animations.map((e) => "finished" in e ? e.finished : e)); } /** * TODO: Filter out cancelled or stopped animations before returning */ getAll(e) { return this.animations[0][e]; } setAll(e, n) { for (let s = 0; s < this.animations.length; s++) this.animations[s][e] = n; } attachTimeline(e, n) { const s = this.animations.map((i) => { if (da() && i.attachTimeline) return i.attachTimeline(e); if (typeof n == "function") return n(i); }); return () => { s.forEach((i, o) => { i && i(), this.animations[o].stop(); }); }; } get time() { return this.getAll("time"); } set time(e) { this.setAll("time", e); } get speed() { return this.getAll("speed"); } set speed(e) { this.setAll("speed", e); } get startTime() { return this.getAll("startTime"); } get duration() { let e = 0; for (let n = 0; n < this.animations.length; n++) e = Math.max(e, this.animations[n].duration); return e; } runAll(e) { this.animations.forEach((n) => n[e]()); } flatten() { this.runAll("flatten"); } play() { this.runAll("play"); } pause() { this.runAll("pause"); } cancel() { this.runAll("cancel"); } complete() { this.runAll("complete"); } } class ma extends pa { then(e, n) { return Promise.all(this.animations).then(e).catch(n); } } function Ln(t, e) { return t ? t[e] || t.default || t : void 0; } const Xe = 2e4; function Ki(t) { let e = 0; const n = 50; let s = t.next(e); for (; !s.done && e < Xe; ) e += n, s = t.next(e); return e >= Xe ? 1 / 0 : e; } function kn(t) { return typeof t == "function"; } function ls(t, e) { t.timeline = e, t.onfinish = null; } const On = (t) => Array.isArray(t) && typeof t[0] == "number", ga = { linearEasing: void 0 }; function ya(t, e) { const n = /* @__PURE__ */ vn(t); return () => { var s; return (s = ga[e]) !== null && s !== void 0 ? s : n(); }; } const ge = /* @__PURE__ */ ya(() => { try { document.createElement("div").animate({ opacity: 0 }, { easing: "linear(0, 1)" }); } catch { return !1; } return !0; }, "linearEasing"), Gi = (t, e, n = 10) => { let s = ""; const i = Math.max(Math.round(e / n), 2); for (let o = 0; o < i; o++) s += t(/* @__PURE__ */ Rt(0, i - 1, o)) + ", "; return `linear(${s.substring(0, s.length - 2)})`; }; function Yi(t) { return !!(typeof t == "function" && ge() || !t || typeof t == "string" && (t in Ze || ge()) || On(t) || Array.isArray(t) && t.every(Yi)); } const Ut = ([t, e, n, s]) => `cubic-bezier(${t}, ${e}, ${n}, ${s})`, Ze = { linear: "linear", ease: "ease", easeIn: "ease-in", easeOut: "ease-out", easeInOut: "ease-in-out", circIn: /* @__PURE__ */ Ut([0, 0.65, 0.55, 1]), circOut: /* @__PURE__ */ Ut([0.55, 0, 1, 0.45]), backIn: /* @__PURE__ */ Ut([0.31, 0.01, 0.66, -0.59]), backOut: /* @__PURE__ */ Ut([0.33, 1.53, 0.69, 0.99]) }; function Hi(t, e) { if (t) return typeof t == "function" && ge() ? Gi(t, e) : On(t) ? Ut(t) : Array.isArray(t) ? t.map((n) => Hi(n, e) || Ze.easeOut) : Ze[t]; } const H = { x: !1, y: !1 }; function qi() { return H.x || H.y; } function va(t, e, n) { var s; if (t instanceof Element) return [t]; if (typeof t == "string") { let i = document; const o = (s = void 0) !== null && s !== void 0 ? s : i.querySelectorAll(t); return o ? Array.from(o) : []; } return Array.from(t); } function Xi(t, e) { const n = va(t), s = new AbortController(), i = { passive: !0, ...e, signal: s.signal }; return [n, i, () => s.abort()]; } function cs(t) { return (e) => { e.pointerType === "touch" || qi() || t(e); }; } function Ta(t, e, n = {}) { const [s, i, o] = Xi(t, n), r = cs((a) => { const { target: l } = a, c = e(a); if (typeof c != "function" || !l) return; const u = cs((h) => { c(h), l.removeEventListener("pointerleave", u); }); l.addEventListener("pointerleave", u, i); }); return s.forEach((a) => { a.addEventListener("pointerenter", r, i); }), o; } const Zi = (t, e) => e ? t === e ? !0 : Zi(t, e.parentElement) : !1, jn = (t) => t.pointerType === "mouse" ? typeof t.button != "number" || t.button <= 0 : t.isPrimary !== !1, xa = /* @__PURE__ */ new Set([ "BUTTON", "INPUT", "SELECT", "TEXTAREA", "A" ]); function Pa(t) { return xa.has(t.tagName) || t.tabIndex !== -1; } const Wt = /* @__PURE__ */ new WeakSet(); function us(t) { return (e) => { e.key === "Enter" && t(e); }; } function Fe(t, e) { t.dispatchEvent(new PointerEvent("pointer" + e, { isPrimary: !0, bubbles: !0 })); } const wa = (t, e) => { const n = t.currentTarget; if (!n) return; const s = us(() => { if (Wt.has(n)) return; Fe(n, "down"); const i = us(() => { Fe(n, "up"); }), o = () => Fe(n, "cancel"); n.addEventListener("keyup", i, e), n.addEventListener("blur", o, e); }); n.addEventListener("keydown", s, e), n.addEventListener("blur", () => n.removeEventListener("keydown", s), e); }; function hs(t) { return jn(t) && !qi(); } function ba(t, e, n = {}) { const [s, i, o] = Xi(t, n), r = (a) => { const l = a.currentTarget; if (!hs(a) || Wt.has(l)) return; Wt.add(l); const c = e(a), u = (d, m) => { window.removeEventListener("pointerup", h), window.removeEventListener("pointercancel", f), !(!hs(d) || !Wt.has(l)) && (Wt.delete(l), typeof c == "function" && c(d, { success: m })); }, h = (d) => { u(d, n.useGlobalTarget || Zi(l, d.target)); }, f = (d) => { u(d, !1); }; window.addEventListener("pointerup", h, i), window.addEventListener("pointercancel", f, i); }; return s.forEach((a) => { !Pa(a) && a.getAttribute("tabindex") === null && (a.tabIndex = 0), (n.useGlobalTarget ? window : a).addEventListener("pointerdown", r, i), a.addEventListener("focus", (c) => wa(c, i), i); }), o; } function Sa(t) { return t === "x" || t === "y" ? H[t] ? null : (H[t] = !0, () => { H[t] = !1; }) : H.x || H.y ? null : (H.x = H.y = !0, () => { H.x = H.y = !1; }); } const Ji = /* @__PURE__ */ new Set([ "width", "height", "top", "left", "right", "bottom", ...Ot ]); let he; function Aa() { he = void 0; } const tt = { now: () => (he === void 0 && tt.set(F.isProcessing || xo.useManualTiming ? F.timestamp : performance.now()), he), set: (t) => { he = t, queueMicrotask(Aa); } }; function Fn(t, e) { t.indexOf(e) === -1 && t.push(e); } function In(t, e) { const n = t.indexOf(e); n > -1 && t.splice(n, 1); } class _n { constructor() { this.subscriptions = []; } add(e) { return Fn(this.subscriptions, e), () => In(this.subscriptions, e); } notify(e, n, s) { const i = this.subscriptions.length; if (i) if (i === 1) this.subscriptions[0](e, n, s); else for (let o = 0; o < i; o++) { const r = this.subscriptions[o]; r && r(e, n, s); } } getSize() { return this.subscriptions.length; } clear() { this.subscriptions.length = 0; } } function Qi(t, e) { return e ? t * (1e3 / e) : 0; } const fs = 30, Va = (t) => !isNaN(parseFloat(t)); class Ea { /** * @param init - The initiating value * @param config - Optional configuration options * * - `transformer`: A function to transform incoming values with. * * @internal */ constructor(e, n = {}) { this.version = "11.18.2", this.canTrackVelocity = null, this.events = {}, this.updateAndNotify = (s, i = !0) => { const o = tt.now(); this.updatedAt !== o && this.setPrevFrameValue(), this.prev = this.current, this.setCurrent(s), this.current !== this.prev && this.events.change && this.events.change.notify(this.current), i && this.events.renderRequest && this.events.renderRequest.notify(this.current); }, this.hasAnimated = !1, this.setCurrent(e), this.owner = n.owner; } setCurrent(e) { this.current = e, this.updatedAt = tt.now(), this.canTrackVelocity === null && e !== void 0 && (this.canTrackVelocity = Va(this.current)); } setPrevFrameValue(e = this.current) { this.prevFrameValue = e, this.prevUpdatedAt = this.updatedAt; } /** * Adds a function that will be notified when the `MotionValue` is updated. * * It returns a function that, when called, will cancel the subscription. * * When calling `onChange` inside a React component, it should be wrapped with the * `useEffect` hook. As it returns an unsubscribe function, this should be returned * from the `useEffect` function to ensure you don't add duplicate subscribers.. * * ```jsx * export const MyComponent = () => { * const x = useMotionValue(0) * const y = useMotionValue(0) * const opacity = useMotionValue(1) * * useEffect(() => { * function updateOpacity() { * const maxXY = Math.max(x.get(), y.get()) * const newOpacity = transform(maxXY, [0, 100], [1, 0]) * opacity.set(newOpacity) * } * * const unsubscribeX = x.on("change", updateOpacity) * const unsubscribeY = y.on("change", updateOpacity) * * return () => { * unsubscribeX() * unsubscribeY() * } * }, []) * * return <motion.div style={{ x }} /> * } * ``` * * @param subscriber - A function that receives the latest value. * @returns A function that, when called, will cancel this subscription. * * @deprecated */ onChange(e) { return process.env.NODE_ENV !== "production" && be(!1, 'value.onChange(callback) is deprecated. Switch to value.on("change", callback).'), this.on("change", e); } on(e, n) { this.events[e] || (this.events[e] = new _n()); const s = this.events[e].add(n); return e === "change" ? () => { s(), E.read(() => { this.events.change.getSize() || this.stop(); }); } : s; } clearListeners() { for (const e in this.events) this.events[e].clear(); } /** * Attaches a passive effect to the `MotionValue`. * * @internal */ attach(e, n) { this.passiveEffect = e, this.stopPassiveEffect = n; } /** * Sets the state of the `MotionValue`. * * @remarks * * ```jsx * const x = useMotionValue(0) * x.set(10) * ``` * * @param latest - Latest value to set. * @param render - Whether to notify render subscribers. Defaults to `true` * * @public */ set(e, n = !0) { !n || !this.passiveEffect ? this.updateAndNotify(e, n) : this.passiveEffect(e, this.updateAndNotify); } setWithVelocity(e, n, s) { this.set(n), this.prev =