@acrool/react-picker
Version:
This is a react method to quickly combine buttons with Picker
1,705 lines • 189 kB
JavaScript
import * as yn from "react";
import Es, { createContext as wt, useContext as N, useRef as K, useId as vn, useInsertionEffect as Cs, useCallback as z, useMemo as Pt, useEffect as st, Children as ao, isValidElement as lo, useLayoutEffect as co, useState as Ct, forwardRef as Re, Fragment as Ds, createElement as uo, Component as ho } from "react";
import fo from "react-dom";
var it = /* @__PURE__ */ ((t) => (t.bottom = "bottom", t.top = "top", t))(it || {}), Et = /* @__PURE__ */ ((t) => (t.left = "left", t.center = "center", t.right = "right", t))(Et || {});
const se = [
"color: #fff",
"display: inline-block",
"font-size: 11px",
"line-height: 20px",
"padding-right: 8px",
"border-radius: 4px"
], re = {
primary: "#0055a9",
success: "#009422",
info: "#17a2b8",
warning: "#d7a000",
danger: "#ec2127"
};
function oe(t, e, ...n) {
console.log(`%c ${t}`, e, ...n);
}
function mo(t, ...e) {
const n = se.concat([
`background-color: ${re.primary}`
]).join(";");
oe(t, n, ...e);
}
function po(t, ...e) {
const n = se.concat([
`background-color: ${re.success}`
]).join(";");
oe(t, n, ...e);
}
function go(t, ...e) {
const n = se.concat([
`background-color: ${re.info}`
]).join(";");
oe(t, n, ...e);
}
function yo(t, ...e) {
const n = se.concat([
`background-color: ${re.warning}`
]).join(";");
oe(t, n, ...e);
}
function vo(t, ...e) {
const n = se.concat([
`background-color: ${re.danger}`
]).join(";");
oe(t, n, ...e);
}
const ct = {
primary: mo,
success: po,
info: go,
warning: yo,
danger: vo
}, xn = wt({
hide: () => ct.warning("No hide method detected, did you embed your app with Acrool/PickerPortal?"),
show: () => ct.warning("No show method detected, did you embed your app with Acrool/PickerPortal?"),
toggle: () => ct.warning("No toggle method detected, did you embed your app with Acrool/PickerPortal?"),
isVisible: !1,
inputFocus: () => ct.warning("No focus method detected, did you embed your app with Acrool/PickerPortal?"),
inputBlur: () => ct.warning("No blur method detected, did you embed your app with Acrool/PickerPortal?"),
isInputFocus: !1,
onChange: () => ct.warning("No onChange method detected, did you embed your app with Acrool/PickerPortal?"),
vertical: it.bottom,
setVertical: () => ct.warning("No onChange method detected, did you embed your app with Acrool/PickerPortal?")
}), bh = xn.Consumer, xo = () => N(xn);
var he = { exports: {} }, $t = {};
/**
* @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 ni;
function To() {
if (ni) return $t;
ni = 1;
var t = Symbol.for("react.transitional.element"), e = Symbol.for("react.fragment");
function n(i, s, o) {
var r = null;
if (o !== void 0 && (r = "" + o), s.key !== void 0 && (r = "" + s.key), "key" in s) {
o = {};
for (var a in s)
a !== "key" && (o[a] = s[a]);
} else o = s;
return s = o.ref, {
$$typeof: t,
type: i,
key: r,
ref: s !== void 0 ? s : null,
props: o
};
}
return $t.Fragment = e, $t.jsx = n, $t.jsxs = n, $t;
}
var Wt = {};
/**
* @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 ii;
function bo() {
return ii || (ii = 1, process.env.NODE_ENV !== "production" && function() {
function t(m) {
if (m == null) return null;
if (typeof m == "function")
return m.$$typeof === _ ? null : m.displayName || m.name || null;
if (typeof m == "string") return m;
switch (m) {
case p:
return "Fragment";
case y:
return "Profiler";
case v:
return "StrictMode";
case T:
return "Suspense";
case A:
return "SuspenseList";
case F:
return "Activity";
}
if (typeof m == "object")
switch (typeof m.tag == "number" && console.error(
"Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
), m.$$typeof) {
case g:
return "Portal";
case b:
return (m.displayName || "Context") + ".Provider";
case x:
return (m._context.displayName || "Context") + ".Consumer";
case w:
var V = m.render;
return m = m.displayName, m || (m = V.displayName || V.name || "", m = m !== "" ? "ForwardRef(" + m + ")" : "ForwardRef"), m;
case D:
return V = m.displayName || null, V !== null ? V : t(m.type) || "Memo";
case S:
V = m._payload, m = m._init;
try {
return t(m(V));
} catch {
}
}
return null;
}
function e(m) {
return "" + m;
}
function n(m) {
try {
e(m);
var V = !1;
} catch {
V = !0;
}
if (V) {
V = console;
var k = V.error, U = typeof Symbol == "function" && Symbol.toStringTag && m[Symbol.toStringTag] || m.constructor.name || "Object";
return k.call(
V,
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
U
), e(m);
}
}
function i(m) {
if (m === p) return "<>";
if (typeof m == "object" && m !== null && m.$$typeof === S)
return "<...>";
try {
var V = t(m);
return V ? "<" + V + ">" : "<...>";
} catch {
return "<...>";
}
}
function s() {
var m = X.A;
return m === null ? null : m.getOwner();
}
function o() {
return Error("react-stack-top-frame");
}
function r(m) {
if (pt.call(m, "key")) {
var V = Object.getOwnPropertyDescriptor(m, "key").get;
if (V && V.isReactWarning) return !1;
}
return m.key !== void 0;
}
function a(m, V) {
function k() {
Ut || (Ut = !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)",
V
));
}
k.isReactWarning = !0, Object.defineProperty(m, "key", {
get: k,
configurable: !0
});
}
function l() {
var m = t(this.type);
return R[m] || (R[m] = !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."
)), m = this.props.ref, m !== void 0 ? m : null;
}
function c(m, V, k, U, lt, Q, Ie, Ne) {
return k = Q.ref, m = {
$$typeof: d,
type: m,
key: V,
props: Q,
_owner: lt
}, (k !== void 0 ? k : null) !== null ? Object.defineProperty(m, "ref", {
enumerable: !1,
get: l
}) : Object.defineProperty(m, "ref", { enumerable: !1, value: null }), m._store = {}, Object.defineProperty(m._store, "validated", {
configurable: !1,
enumerable: !1,
writable: !0,
value: 0
}), Object.defineProperty(m, "_debugInfo", {
configurable: !1,
enumerable: !1,
writable: !0,
value: null
}), Object.defineProperty(m, "_debugStack", {
configurable: !1,
enumerable: !1,
writable: !0,
value: Ie
}), Object.defineProperty(m, "_debugTask", {
configurable: !1,
enumerable: !1,
writable: !0,
value: Ne
}), Object.freeze && (Object.freeze(m.props), Object.freeze(m)), m;
}
function u(m, V, k, U, lt, Q, Ie, Ne) {
var $ = V.children;
if ($ !== void 0)
if (U)
if (_t($)) {
for (U = 0; U < $.length; U++)
h($[U]);
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 (pt.call(V, "key")) {
$ = t(m);
var Vt = Object.keys(V).filter(function(oo) {
return oo !== "key";
});
U = 0 < Vt.length ? "{key: someKey, " + Vt.join(": ..., ") + ": ...}" : "{key: someKey}", At[$ + U] || (Vt = 0 < Vt.length ? "{" + Vt.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} />`,
U,
$,
Vt,
$
), At[$ + U] = !0);
}
if ($ = null, k !== void 0 && (n(k), $ = "" + k), r(V) && (n(V.key), $ = "" + V.key), "key" in V) {
k = {};
for (var _e in V)
_e !== "key" && (k[_e] = V[_e]);
} else k = V;
return $ && a(
k,
typeof m == "function" ? m.displayName || m.name || "Unknown" : m
), c(
m,
$,
Q,
lt,
s(),
k,
Ie,
Ne
);
}
function h(m) {
typeof m == "object" && m !== null && m.$$typeof === d && m._store && (m._store.validated = 1);
}
var f = Es, d = Symbol.for("react.transitional.element"), g = Symbol.for("react.portal"), p = Symbol.for("react.fragment"), v = Symbol.for("react.strict_mode"), y = Symbol.for("react.profiler"), x = Symbol.for("react.consumer"), b = Symbol.for("react.context"), w = Symbol.for("react.forward_ref"), T = Symbol.for("react.suspense"), A = Symbol.for("react.suspense_list"), D = Symbol.for("react.memo"), S = Symbol.for("react.lazy"), F = Symbol.for("react.activity"), _ = Symbol.for("react.client.reference"), X = f.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, pt = Object.prototype.hasOwnProperty, _t = Array.isArray, at = console.createTask ? console.createTask : function() {
return null;
};
f = {
"react-stack-bottom-frame": function(m) {
return m();
}
};
var Ut, R = {}, C = f["react-stack-bottom-frame"].bind(
f,
o
)(), B = at(i(o)), At = {};
Wt.Fragment = p, Wt.jsx = function(m, V, k, U, lt) {
var Q = 1e4 > X.recentlyCreatedOwnerStacks++;
return u(
m,
V,
k,
!1,
U,
lt,
Q ? Error("react-stack-top-frame") : C,
Q ? at(i(m)) : B
);
}, Wt.jsxs = function(m, V, k, U, lt) {
var Q = 1e4 > X.recentlyCreatedOwnerStacks++;
return u(
m,
V,
k,
!0,
U,
lt,
Q ? Error("react-stack-top-frame") : C,
Q ? at(i(m)) : B
);
};
}()), Wt;
}
var si;
function Po() {
return si || (si = 1, process.env.NODE_ENV === "production" ? he.exports = To() : he.exports = bo()), he.exports;
}
var E = Po(), wo = Object.defineProperty, So = (t, e, n) => e in t ? wo(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, Qe = (t, e, n) => So(t, typeof e != "symbol" ? e + "" : e, n);
function Ao(t) {
return Object.keys(t);
}
function ri(t) {
const e = document.createElement("div");
return e.id = t.id, t.className && (e.className = t.className), t.style && Ao(t.style).forEach((n) => {
var i;
e.style[n] = (i = t.style) == null ? void 0 : i[n];
}), e;
}
class Rs extends Es.Component {
constructor(e) {
super(e), Qe(this, "_el", null), Qe(this, "renderPortal", () => this._el ? fo.createPortal(
this.props.children,
this._el
) : null), !(typeof window > "u") && (this._el = ri(e));
}
get typeProps() {
return this.props;
}
componentDidMount() {
this._el = this._el ? this._el : ri(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();
}
}
Qe(Rs, "defaultProps", {
containerSelector: () => document.body
});
const Tn = wt({});
function bn(t) {
const e = K(null);
return e.current === null && (e.current = t()), e.current;
}
const Me = wt(null), Pn = wt({
transformPagePoint: (t) => t,
isStatic: !1,
reducedMotion: "never"
});
class Vo extends yn.Component {
getSnapshotBeforeUpdate(e) {
const n = this.props.childRef.current;
if (n && e.isPresent && !this.props.isPresent) {
const i = this.props.sizeRef.current;
i.height = n.offsetHeight || 0, i.width = n.offsetWidth || 0, i.top = n.offsetTop, i.left = n.offsetLeft;
}
return null;
}
/**
* Required with getSnapshotBeforeUpdate to stop React complaining.
*/
componentDidUpdate() {
}
render() {
return this.props.children;
}
}
function Eo({ children: t, isPresent: e }) {
const n = vn(), i = K(null), s = K({
width: 0,
height: 0,
top: 0,
left: 0
}), { nonce: o } = N(Pn);
return Cs(() => {
const { width: r, height: a, top: l, left: c } = s.current;
if (e || !i.current || !r || !a)
return;
i.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]), E.jsx(Vo, { isPresent: e, childRef: i, sizeRef: s, children: yn.cloneElement(t, { ref: i }) });
}
const Co = ({ children: t, initial: e, isPresent: n, onExitComplete: i, custom: s, presenceAffectsLayout: o, mode: r }) => {
const a = bn(Do), l = vn(), c = z((h) => {
a.set(h, !0);
for (const f of a.values())
if (!f)
return;
i && i();
}, [a, i]), u = Pt(
() => ({
id: l,
initial: e,
isPresent: n,
custom: s,
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 Pt(() => {
a.forEach((h, f) => a.set(f, !1));
}, [n]), yn.useEffect(() => {
!n && !a.size && i && i();
}, [n]), r === "popLayout" && (t = E.jsx(Eo, { isPresent: n, children: t })), E.jsx(Me.Provider, { value: u, children: t });
};
function Do() {
return /* @__PURE__ */ new Map();
}
function Ms(t = !0) {
const e = N(Me);
if (e === null)
return [!0, null];
const { isPresent: n, onExitComplete: i, register: s } = e, o = vn();
st(() => {
t && s(o);
}, [t]);
const r = z(() => t && i && i(o), [o, i, t]);
return !n && i ? [!1, r] : [!0];
}
const fe = (t) => t.key || "";
function oi(t) {
const e = [];
return ao.forEach(t, (n) => {
lo(n) && e.push(n);
}), e;
}
const wn = typeof window < "u", ks = wn ? co : st, Ro = ({ children: t, custom: e, initial: n = !0, onExitComplete: i, presenceAffectsLayout: s = !0, mode: o = "sync", propagate: r = !1 }) => {
const [a, l] = Ms(r), c = Pt(() => oi(t), [t]), u = r && !a ? [] : c.map(fe), h = K(!0), f = K(c), d = bn(() => /* @__PURE__ */ new Map()), [g, p] = Ct(c), [v, y] = Ct(c);
ks(() => {
h.current = !1, f.current = c;
for (let w = 0; w < v.length; w++) {
const T = fe(v[w]);
u.includes(T) ? d.delete(T) : d.get(T) !== !0 && d.set(T, !1);
}
}, [v, u.length, u.join("-")]);
const x = [];
if (c !== g) {
let w = [...c];
for (let T = 0; T < v.length; T++) {
const A = v[T], D = fe(A);
u.includes(D) || (w.splice(T, 0, A), x.push(A));
}
o === "wait" && x.length && (w = x), y(oi(w)), p(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: b } = N(Tn);
return E.jsx(E.Fragment, { children: v.map((w) => {
const T = fe(w), A = r && !a ? !1 : c === v || u.includes(T), D = () => {
if (d.has(T))
d.set(T, !0);
else
return;
let S = !0;
d.forEach((F) => {
F || (S = !1);
}), S && (b == null || b(), y(f.current), r && (l == null || l()), i && i());
};
return E.jsx(Co, { isPresent: A, initial: !h.current || n ? void 0 : !1, custom: A ? void 0 : e, presenceAffectsLayout: s, mode: o, onExitComplete: A ? void 0 : D, children: w }, T);
}) });
}, H = /* @__NO_SIDE_EFFECTS__ */ (t) => t;
let Bt = H, ht = H;
process.env.NODE_ENV !== "production" && (Bt = (t, e) => {
!t && typeof console < "u" && console.warn(e);
}, ht = (t, e) => {
if (!t)
throw new Error(e);
});
// @__NO_SIDE_EFFECTS__
function Sn(t) {
let e;
return () => (e === void 0 && (e = t()), e);
}
const jt = /* @__NO_SIDE_EFFECTS__ */ (t, e, n) => {
const i = e - t;
return i === 0 ? 1 : (n - t) / i;
}, tt = /* @__NO_SIDE_EFFECTS__ */ (t) => t * 1e3, rt = /* @__NO_SIDE_EFFECTS__ */ (t) => t / 1e3, Mo = {
useManualTiming: !1
};
function ko(t) {
let e = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set(), i = !1, s = !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 && i ? 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, i) {
s = !0;
return;
}
i = !0, [e, n] = [n, e], e.forEach(a), e.clear(), i = !1, s && (s = !1, l.process(c));
}
};
return l;
}
const de = [
"read",
// Read
"resolveKeyframes",
// Write/Read/Write/Read
"update",
// Compute
"preRender",
// Compute
"render",
// Write
"postRender"
// Compute
], Lo = 40;
function Ls(t, e) {
let n = !1, i = !0;
const s = {
delta: 0,
timestamp: 0,
isProcessing: !1
}, o = () => n = !0, r = de.reduce((y, x) => (y[x] = ko(o), y), {}), { read: a, resolveKeyframes: l, update: c, preRender: u, render: h, postRender: f } = r, d = () => {
const y = performance.now();
n = !1, s.delta = i ? 1e3 / 60 : Math.max(Math.min(y - s.timestamp, Lo), 1), s.timestamp = y, s.isProcessing = !0, a.process(s), l.process(s), c.process(s), u.process(s), h.process(s), f.process(s), s.isProcessing = !1, n && e && (i = !1, t(d));
}, g = () => {
n = !0, i = !0, s.isProcessing || t(d);
};
return { schedule: de.reduce((y, x) => {
const b = r[x];
return y[x] = (w, T = !1, A = !1) => (n || g(), b.schedule(w, T, A)), y;
}, {}), cancel: (y) => {
for (let x = 0; x < de.length; x++)
r[de[x]].cancel(y);
}, state: s, steps: r };
}
const { schedule: M, cancel: ft, state: I, steps: Ue } = Ls(typeof requestAnimationFrame < "u" ? requestAnimationFrame : H, !0), js = wt({ strict: !1 }), ai = {
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"]
}, Ot = {};
for (const t in ai)
Ot[t] = {
isEnabled: (e) => ai[t].some((n) => !!e[n])
};
function jo(t) {
for (const e in t)
Ot[e] = {
...Ot[e],
...t[e]
};
}
const Oo = /* @__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 be(t) {
return t.startsWith("while") || t.startsWith("drag") && t !== "draggable" || t.startsWith("layout") || t.startsWith("onTap") || t.startsWith("onPan") || t.startsWith("onLayout") || Oo.has(t);
}
let Os = (t) => !be(t);
function Fo(t) {
t && (Os = (e) => e.startsWith("on") ? !be(e) : t(e));
}
try {
Fo(require("@emotion/is-prop-valid").default);
} catch {
}
function Bo(t, e, n) {
const i = {};
for (const s in t)
s === "values" && typeof t.values == "object" || (Os(s) || n === !0 && be(s) || !e && !be(s) || // If trying to use native HTML drag events, forward drag listeners
t.draggable && s.startsWith("onDrag")) && (i[s] = t[s]);
return i;
}
const li = /* @__PURE__ */ new Set();
function ke(t, e, n) {
t || li.has(e) || (console.warn(e), li.add(e));
}
function Io(t) {
if (typeof Proxy > "u")
return t;
const e = /* @__PURE__ */ new Map(), n = (...i) => (process.env.NODE_ENV !== "production" && ke(!1, "motion() is deprecated. Use motion.create() instead."), t(...i));
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: (i, s) => s === "create" ? t : (e.has(s) || e.set(s, t(s)), e.get(s))
});
}
const Le = wt({});
function Qt(t) {
return typeof t == "string" || Array.isArray(t);
}
function je(t) {
return t !== null && typeof t == "object" && typeof t.start == "function";
}
const An = [
"animate",
"whileInView",
"whileFocus",
"whileHover",
"whileTap",
"whileDrag",
"exit"
], Vn = ["initial", ...An];
function Oe(t) {
return je(t.animate) || Vn.some((e) => Qt(t[e]));
}
function Fs(t) {
return !!(Oe(t) || t.variants);
}
function No(t, e) {
if (Oe(t)) {
const { initial: n, animate: i } = t;
return {
initial: n === !1 || Qt(n) ? n : void 0,
animate: Qt(i) ? i : void 0
};
}
return t.inherit !== !1 ? e : {};
}
function _o(t) {
const { initial: e, animate: n } = No(t, N(Le));
return Pt(() => ({ initial: e, animate: n }), [ci(e), ci(n)]);
}
function ci(t) {
return Array.isArray(t) ? t.join(" ") : t;
}
const Uo = Symbol.for("motionComponentSymbol");
function Dt(t) {
return t && typeof t == "object" && Object.prototype.hasOwnProperty.call(t, "current");
}
function $o(t, e, n) {
return z(
(i) => {
i && t.onMount && t.onMount(i), e && (i ? e.mount(i) : e.unmount()), n && (typeof n == "function" ? n(i) : Dt(n) && (n.current = i));
},
/**
* 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 En = (t) => t.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase(), Wo = "framerAppearId", Bs = "data-" + En(Wo), { schedule: Cn } = Ls(queueMicrotask, !1), Is = wt({});
function Go(t, e, n, i, s) {
var o, r;
const { visualElement: a } = N(Le), l = N(js), c = N(Me), u = N(Pn).reducedMotion, h = K(null);
i = i || l.renderer, !h.current && i && (h.current = i(t, {
visualState: e,
parent: a,
props: n,
presenceContext: c,
blockInitialAnimation: c ? c.initial === !1 : !1,
reducedMotionConfig: u
}));
const f = h.current, d = N(Is);
f && !f.projection && s && (f.type === "html" || f.type === "svg") && Ko(h.current, n, s, d);
const g = K(!1);
Cs(() => {
f && g.current && f.update(n, c);
});
const p = n[Bs], v = K(!!p && !(!((o = window.MotionHandoffIsComplete) === null || o === void 0) && o.call(window, p)) && ((r = window.MotionHasOptimisedAnimation) === null || r === void 0 ? void 0 : r.call(window, p)));
return ks(() => {
f && (g.current = !0, window.MotionIsMounted = !0, f.updateFeatures(), Cn.render(f.render), v.current && f.animationState && f.animationState.animateChanges());
}), st(() => {
f && (!v.current && f.animationState && f.animationState.animateChanges(), v.current && (queueMicrotask(() => {
var y;
(y = window.MotionHandoffMarkAsComplete) === null || y === void 0 || y.call(window, p);
}), v.current = !1));
}), f;
}
function Ko(t, e, n, i) {
const { layoutId: s, layout: o, drag: r, dragConstraints: a, layoutScroll: l, layoutRoot: c } = e;
t.projection = new n(t.latestValues, e["data-framer-portal-id"] ? void 0 : Ns(t.parent)), t.projection.setOptions({
layoutId: s,
layout: o,
alwaysMeasureLayout: !!r || a && Dt(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: i,
layoutScroll: l,
layoutRoot: c
});
}
function Ns(t) {
if (t)
return t.options.allowProjection !== !1 ? t.projection : Ns(t.parent);
}
function Ho({ preloadedFeatures: t, createVisualElement: e, useRender: n, useVisualState: i, Component: s }) {
var o, r;
t && jo(t);
function a(c, u) {
let h;
const f = {
...N(Pn),
...c,
layoutId: zo(c)
}, { isStatic: d } = f, g = _o(c), p = i(c, d);
if (!d && wn) {
Yo(f, t);
const v = Xo(f);
h = v.MeasureLayout, g.visualElement = Go(s, p, f, e, v.ProjectionNode);
}
return E.jsxs(Le.Provider, { value: g, children: [h && g.visualElement ? E.jsx(h, { visualElement: g.visualElement, ...f }) : null, n(s, c, $o(p, g.visualElement, u), p, d, g.visualElement)] });
}
a.displayName = `motion.${typeof s == "string" ? s : `create(${(r = (o = s.displayName) !== null && o !== void 0 ? o : s.name) !== null && r !== void 0 ? r : ""})`}`;
const l = Re(a);
return l[Uo] = s, l;
}
function zo({ layoutId: t }) {
const e = N(Tn).id;
return e && t !== void 0 ? e + "-" + t : t;
}
function Yo(t, e) {
const n = N(js).strict;
if (process.env.NODE_ENV !== "production" && e && n) {
const i = "You have rendered a `motion` component within a `LazyMotion` component. This will break tree shaking. Import and render a `m` component instead.";
t.ignoreStrict ? Bt(!1, i) : ht(!1, i);
}
}
function Xo(t) {
const { drag: e, layout: n } = Ot;
if (!e && !n)
return {};
const i = { ...e, ...n };
return {
MeasureLayout: e != null && e.isEnabled(t) || n != null && n.isEnabled(t) ? i.MeasureLayout : void 0,
ProjectionNode: i.ProjectionNode
};
}
const qo = [
"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 Dn(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
*/
!!(qo.indexOf(t) > -1 || /**
* If it contains a capital letter, it's an SVG component
*/
/[A-Z]/u.test(t))
)
);
}
function ui(t) {
const e = [{}, {}];
return t == null || t.values.forEach((n, i) => {
e[0][i] = n.get(), e[1][i] = n.getVelocity();
}), e;
}
function Rn(t, e, n, i) {
if (typeof e == "function") {
const [s, o] = ui(i);
e = e(n !== void 0 ? n : t.custom, s, o);
}
if (typeof e == "string" && (e = t.variants && t.variants[e]), typeof e == "function") {
const [s, o] = ui(i);
e = e(n !== void 0 ? n : t.custom, s, o);
}
return e;
}
const tn = (t) => Array.isArray(t), Zo = (t) => !!(t && typeof t == "object" && t.mix && t.toValue), Jo = (t) => tn(t) ? t[t.length - 1] || 0 : t, G = (t) => !!(t && t.getVelocity);
function ye(t) {
const e = G(t) ? t.get() : t;
return Zo(e) ? e.toValue() : e;
}
function Qo({ scrapeMotionValuesFromProps: t, createRenderState: e, onUpdate: n }, i, s, o) {
const r = {
latestValues: ta(i, s, o, t),
renderState: e()
};
return n && (r.onMount = (a) => n({ props: i, current: a, ...r }), r.onUpdate = (a) => n(a)), r;
}
const _s = (t) => (e, n) => {
const i = N(Le), s = N(Me), o = () => Qo(t, e, i, s);
return n ? o() : bn(o);
};
function ta(t, e, n, i) {
const s = {}, o = i(t, {});
for (const f in o)
s[f] = ye(o[f]);
let { initial: r, animate: a } = t;
const l = Oe(t), c = Fs(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" && !je(h)) {
const f = Array.isArray(h) ? h : [h];
for (let d = 0; d < f.length; d++) {
const g = Rn(t, f[d]);
if (g) {
const { transitionEnd: p, transition: v, ...y } = g;
for (const x in y) {
let b = y[x];
if (Array.isArray(b)) {
const w = u ? b.length - 1 : 0;
b = b[w];
}
b !== null && (s[x] = b);
}
for (const x in p)
s[x] = p[x];
}
}
}
return s;
}
const It = [
"transformPerspective",
"x",
"y",
"z",
"translateX",
"translateY",
"translateZ",
"scale",
"scaleX",
"scaleY",
"rotate",
"rotateX",
"rotateY",
"rotateZ",
"skew",
"skewX",
"skewY"
], St = new Set(It), Us = (t) => (e) => typeof e == "string" && e.startsWith(t), $s = /* @__PURE__ */ Us("--"), ea = /* @__PURE__ */ Us("var(--"), Mn = (t) => ea(t) ? na.test(t.split("/*")[0].trim()) : !1, na = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu, Ws = (t, e) => e && typeof t == "number" ? e.transform(t) : t, ot = (t, e, n) => n > e ? e : n < t ? t : n, Nt = {
test: (t) => typeof t == "number",
parse: parseFloat,
transform: (t) => t
}, te = {
...Nt,
transform: (t) => ot(0, 1, t)
}, me = {
...Nt,
default: 1
}, ae = (t) => ({
test: (e) => typeof e == "string" && e.endsWith(t) && e.split(" ").length === 1,
parse: parseFloat,
transform: (e) => `${e}${t}`
}), ut = /* @__PURE__ */ ae("deg"), et = /* @__PURE__ */ ae("%"), P = /* @__PURE__ */ ae("px"), ia = /* @__PURE__ */ ae("vh"), sa = /* @__PURE__ */ ae("vw"), hi = {
...et,
parse: (t) => et.parse(t) / 100,
transform: (t) => et.transform(t * 100)
}, ra = {
// Border props
borderWidth: P,
borderTopWidth: P,
borderRightWidth: P,
borderBottomWidth: P,
borderLeftWidth: P,
borderRadius: P,
radius: P,
borderTopLeftRadius: P,
borderTopRightRadius: P,
borderBottomRightRadius: P,
borderBottomLeftRadius: P,
// Positioning props
width: P,
maxWidth: P,
height: P,
maxHeight: P,
top: P,
right: P,
bottom: P,
left: P,
// Spacing props
padding: P,
paddingTop: P,
paddingRight: P,
paddingBottom: P,
paddingLeft: P,
margin: P,
marginTop: P,
marginRight: P,
marginBottom: P,
marginLeft: P,
// Misc
backgroundPositionX: P,
backgroundPositionY: P
}, oa = {
rotate: ut,
rotateX: ut,
rotateY: ut,
rotateZ: ut,
scale: me,
scaleX: me,
scaleY: me,
scaleZ: me,
skew: ut,
skewX: ut,
skewY: ut,
distance: P,
translateX: P,
translateY: P,
translateZ: P,
x: P,
y: P,
z: P,
perspective: P,
transformPerspective: P,
opacity: te,
originX: hi,
originY: hi,
originZ: P
}, fi = {
...Nt,
transform: Math.round
}, kn = {
...ra,
...oa,
zIndex: fi,
size: P,
// SVG
fillOpacity: te,
strokeOpacity: te,
numOctaves: fi
}, aa = {
x: "translateX",
y: "translateY",
z: "translateZ",
transformPerspective: "perspective"
}, la = It.length;
function ca(t, e, n) {
let i = "", s = !0;
for (let o = 0; o < la; o++) {
const r = It[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 = Ws(a, kn[r]);
if (!l) {
s = !1;
const u = aa[r] || r;
i += `${u}(${c}) `;
}
n && (e[r] = c);
}
}
return i = i.trim(), n ? i = n(e, s ? "" : i) : s && (i = "none"), i;
}
function Ln(t, e, n) {
const { style: i, vars: s, transformOrigin: o } = t;
let r = !1, a = !1;
for (const l in e) {
const c = e[l];
if (St.has(l)) {
r = !0;
continue;
} else if ($s(l)) {
s[l] = c;
continue;
} else {
const u = Ws(c, kn[l]);
l.startsWith("origin") ? (a = !0, o[l] = u) : i[l] = u;
}
}
if (e.transform || (r || n ? i.transform = ca(e, t.transform, n) : i.transform && (i.transform = "none")), a) {
const { originX: l = "50%", originY: c = "50%", originZ: u = 0 } = o;
i.transformOrigin = `${l} ${c} ${u}`;
}
}
const ua = {
offset: "stroke-dashoffset",
array: "stroke-dasharray"
}, ha = {
offset: "strokeDashoffset",
array: "strokeDasharray"
};
function fa(t, e, n = 1, i = 0, s = !0) {
t.pathLength = 1;
const o = s ? ua : ha;
t[o.offset] = P.transform(-i);
const r = P.transform(e), a = P.transform(n);
t[o.array] = `${r} ${a}`;
}
function di(t, e, n) {
return typeof t == "string" ? t : P.transform(e + n * t);
}
function da(t, e, n) {
const i = di(e, t.x, t.width), s = di(n, t.y, t.height);
return `${i} ${s}`;
}
function jn(t, {
attrX: e,
attrY: n,
attrScale: i,
originX: s,
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 (Ln(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: g } = t;
f.transform && (g && (d.transform = f.transform), delete f.transform), g && (s !== void 0 || o !== void 0 || d.transform) && (d.transformOrigin = da(g, s !== void 0 ? s : 0.5, o !== void 0 ? o : 0.5)), e !== void 0 && (f.x = e), n !== void 0 && (f.y = n), i !== void 0 && (f.scale = i), r !== void 0 && fa(f, r, a, l, !1);
}
const On = () => ({
style: {},
transform: {},
transformOrigin: {},
vars: {}
}), Gs = () => ({
...On(),
attrs: {}
}), Fn = (t) => typeof t == "string" && t.toLowerCase() === "svg";
function Ks(t, { style: e, vars: n }, i, s) {
Object.assign(t.style, e, s && s.getProjectionStyles(i));
for (const o in n)
t.style.setProperty(o, n[o]);
}
const Hs = /* @__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 zs(t, e, n, i) {
Ks(t, e, void 0, i);
for (const s in e.attrs)
t.setAttribute(Hs.has(s) ? s : En(s), e.attrs[s]);
}
const Pe = {};
function ma(t) {
Object.assign(Pe, t);
}
function Ys(t, { layout: e, layoutId: n }) {
return St.has(t) || t.startsWith("origin") || (e || n !== void 0) && (!!Pe[t] || t === "opacity");
}
function Bn(t, e, n) {
var i;
const { style: s } = t, o = {};
for (const r in s)
(G(s[r]) || e.style && G(e.style[r]) || Ys(r, t) || ((i = n == null ? void 0 : n.getValue(r)) === null || i === void 0 ? void 0 : i.liveStyle) !== void 0) && (o[r] = s[r]);
return o;
}
function Xs(t, e, n) {
const i = Bn(t, e, n);
for (const s in t)
if (G(t[s]) || G(e[s])) {
const o = It.indexOf(s) !== -1 ? "attr" + s.charAt(0).toUpperCase() + s.substring(1) : s;
i[o] = t[s];
}
return i;
}
function pa(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 mi = ["x", "y", "width", "height", "cx", "cy", "r"], ga = {
useVisualState: _s({
scrapeMotionValuesFromProps: Xs,
createRenderState: Gs,
onUpdate: ({ props: t, prevProps: e, current: n, renderState: i, latestValues: s }) => {
if (!n)
return;
let o = !!t.drag;
if (!o) {
for (const a in s)
if (St.has(a)) {
o = !0;
break;
}
}
if (!o)
return;
let r = !e;
if (e)
for (let a = 0; a < mi.length; a++) {
const l = mi[a];
t[l] !== e[l] && (r = !0);
}
r && M.read(() => {
pa(n, i), M.render(() => {
jn(i, s, Fn(n.tagName), t.transformTemplate), zs(n, i);
});
});
}
})
}, ya = {
useVisualState: _s({
scrapeMotionValuesFromProps: Bn,
createRenderState: On
})
};
function qs(t, e, n) {
for (const i in e)
!G(e[i]) && !Ys(i, n) && (t[i] = e[i]);
}
function va({ transformTemplate: t }, e) {
return Pt(() => {
const n = On();
return Ln(n, e, t), Object.assign({}, n.vars, n.style);
}, [e]);
}
function xa(t, e) {
const n = t.style || {}, i = {};
return qs(i, n, t), Object.assign(i, va(t, e)), i;
}
function Ta(t, e) {
const n = {}, i = xa(t, e);
return t.drag && t.dragListener !== !1 && (n.draggable = !1, i.userSelect = i.WebkitUserSelect = i.WebkitTouchCallout = "none", i.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 = i, n;
}
function ba(t, e, n, i) {
const s = Pt(() => {
const o = Gs();
return jn(o, e, Fn(i), t.transformTemplate), {
...o.attrs,
style: { ...o.style }
};
}, [e]);
if (t.style) {
const o = {};
qs(o, t.style, t), s.style = { ...o, ...s.style };
}
return s;
}
function Pa(t = !1) {
return (n, i, s, { latestValues: o }, r) => {
const l = (Dn(n) ? ba : Ta)(i, o, r, n), c = Bo(i, typeof n == "string", t), u = n !== Ds ? { ...c, ...l, ref: s } : {}, { children: h } = i, f = Pt(() => G(h) ? h.get() : h, [h]);
return uo(n, {
...u,
children: f
});
};
}
function wa(t, e) {
return function(i, { forwardMotionProps: s } = { forwardMotionProps: !1 }) {
const r = {
...Dn(i) ? ga : ya,
preloadedFeatures: t,
useRender: Pa(s),
createVisualElement: e,
Component: i
};
return Ho(r);
};
}
function Zs(t, e) {
if (!Array.isArray(e))
return !1;
const n = e.length;
if (n !== t.length)
return !1;
for (let i = 0; i < n; i++)
if (e[i] !== t[i])
return !1;
return !0;
}
function Fe(t, e, n) {
const i = t.getProps();
return Rn(i, e, n !== void 0 ? n : i.custom, t);
}
const Sa = /* @__PURE__ */ Sn(() => window.ScrollTimeline !== void 0);
class Aa {
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 i = 0; i < this.animations.length; i++)
this.animations[i][e] = n;
}
attachTimeline(e, n) {
const i = this.animations.map((s) => {
if (Sa() && s.attachTimeline)
return s.attachTimeline(e);
if (typeof n == "function")
return n(s);
});
return () => {
i.forEach((s, o) => {
s && s(), 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 Va extends Aa {
then(e, n) {
return Promise.all(this.animations).then(e).catch(n);
}
}
function In(t, e) {
return t ? t[e] || t.default || t : void 0;
}
const en = 2e4;
function Js(t) {
let e = 0;
const n = 50;
let i = t.next(e);
for (; !i.done && e < en; )
e += n, i = t.next(e);
return e >= en ? 1 / 0 : e;
}
function Nn(t) {
return typeof t == "function";
}
function pi(t, e) {
t.timeline = e, t.onfinish = null;
}
const _n = (t) => Array.isArray(t) && typeof t[0] == "number", Ea = {
linearEasing: void 0
};
function Ca(t, e) {
const n = /* @__PURE__ */ Sn(t);
return () => {
var i;
return (i = Ea[e]) !== null && i !== void 0 ? i : n();
};
}
const we = /* @__PURE__ */ Ca(() => {
try {
document.createElement("div").animate({ opacity: 0 }, { easing: "linear(0, 1)" });
} catch {
return !1;
}
return !0;
}, "linearEasing"), Qs = (t, e, n = 10) => {
let i = "";
const s = Math.max(Math.round(e / n), 2);
for (let o = 0; o < s; o++)
i += t(/* @__PURE__ */ jt(0, s - 1, o)) + ", ";
return `linear(${i.substring(0, i.length - 2)})`;
};
function tr(t) {
return !!(typeof t == "function" && we() || !t || typeof t == "string" && (t in nn || we()) || _n(t) || Array.isArray(t) && t.every(tr));
}
const Kt = ([t, e, n, i]) => `cubic-bezier(${t}, ${e}, ${n}, ${i})`, nn = {
linear: "linear",
ease: "ease",
easeIn: "ease-in",
easeOut: "ease-out",
easeInOut: "ease-in-out",
circIn: /* @__PURE__ */ Kt([0, 0.65, 0.55, 1]),
circOut: /* @__PURE__ */ Kt([0.55, 0, 1, 0.45]),
backIn: /* @__PURE__ */ Kt([0.31, 0.01, 0.66, -0.59]),
backOut: /* @__PURE__ */ Kt([0.33, 1.53, 0.69, 0.99])
};
function er(t, e) {
if (t)
return typeof t == "function" && we() ? Qs(t, e) : _n(t) ? Kt(t) : Array.isArray(t) ? t.map((n) => er(n, e) || nn.easeOut) : nn[t];
}
const J = {
x: !1,
y: !1
};
function nr() {
return J.x || J.y;
}
function Da(t, e, n) {
var i;
if (t instanceof Element)
return [t];
if (typeof t == "string") {
let s = document;
const o = (i = void 0) !== null && i !== void 0 ? i : s.querySelectorAll(t);
return o ? Array.from(o) : [];
}
return Array.from(t);
}
function ir(t, e) {
const n = Da(t), i = new AbortController(), s = {
passive: !0,
...e,
signal: i.signal
};
return [n, s, () => i.abort()];
}
function gi(t) {
return (e) => {
e.pointerType === "touch" || nr() || t(e);
};
}
function Ra(t, e, n = {}) {
const [i, s, o] = ir(t, n), r = gi((a) => {
const { target: l } = a, c = e(a);
if (typeof c != "function" || !l)
return;
const u = gi((h) => {
c(h), l.removeEventListener("pointerleave", u);
});
l.addEventListener("pointerleave", u, s);
});
return i.forEach((a) => {
a.addEventListener("pointerenter", r, s);
}), o;
}
const sr = (t, e) => e ? t === e ? !0 : sr(t, e.parentElement) : !1, Un = (t) => t.pointerType === "mouse" ? typeof t.button != "number" || t.button <= 0 : t.isPrimary !== !1, Ma = /* @__PURE__ */ new Set([
"BUTTON",
"INPUT",
"SELECT",
"TEXTAREA",
"A"
]);
function ka(t) {
return Ma.has(t.tagName) || t.tabIndex !== -1;
}
const Ht = /* @__PURE__ */ new WeakSet();
function yi(t) {
return (e) => {
e.key === "Enter" && t(e);
};
}
function $e(t, e) {
t.dispatchEvent(new PointerEvent("pointer" + e, { isPrimary: !0, bubbles: !0 }));
}
const La = (t, e) => {
const n = t.currentTarget;
if (!n)
return;
const i = yi(() => {
if (Ht.has(n))
return;
$e(n, "down");
const s = yi(() => {
$e(n, "up");
}), o = () => $e(n, "cancel");
n.addEventListener("keyup", s, e), n.addEventListener("blur", o, e);
});
n.addEventListener("keydown", i, e), n.addEventListener("blur", () => n.removeEventListener("keydown", i), e);
};
function vi(t) {
return Un(t) && !nr();
}
function ja(t, e, n = {}) {
const [i, s, o] = ir(t, n), r = (a) => {
const l = a.currentTarget;
if (!vi(a) || Ht.has(l))
return;
Ht.add(l);
const c = e(a), u = (d, g) => {
window.removeEventListener("pointerup", h), window.removeEventListener("pointercancel", f), !(!vi(d) || !Ht.has(l)) && (Ht.delete(l), typeof c == "function" && c(d, { success: g }));
}, h = (d) => {
u(d, n.useGlobalTarget || sr(l, d.target));
}, f = (d) => {
u(d, !1);
};
window.addEventListener("pointerup", h, s), window.addEventListener("pointercancel", f, s);
};
return i.forEach((a) => {
!ka(a) && a.getAttribute("tabindex") === null && (a.tabIndex = 0), (n.useGlobalTarget ? window : a).addEventListener("pointerdown", r, s), a.addEventListener("focus", (c) => La(c, s), s);
}), o;
}
function Oa(t) {
return t === "x" || t === "y" ? J[t] ? null : (J[t] = !0, () => {
J[t] = !1;
}) : J.x || J.y ? null : (J.x = J.y = !0, () => {
J.x = J.y = !1;
});
}
const rr = /* @__PURE__ */ new Set([
"width",
"height",
"top",
"left",
"right",
"bottom",
...It
]);
let ve;
function Fa() {
ve = void 0;
}
const nt = {
now: () => (ve === void 0 && nt.set(I.isProcessing || Mo.useManualTiming ? I.timestamp : performance.now()), ve),
set: (t) => {
ve = t, queueMicrotask(Fa);
}
};
function $n(t, e) {
t.indexOf(e) === -1 && t.push(e);
}
function Wn(t, e) {
const n = t.indexOf(e);
n > -1 && t.splice(n, 1);
}
class Gn {
constructor() {
this.subscriptions = [];
}
add(e) {
return $n(this.subscriptions, e), () => Wn(this.subscriptions, e);
}
notify(e, n, i) {
const s = this.subscriptions.length;
if (s)
if (s === 1)
this.subscriptions[0](e, n, i);
else
for (let o = 0; o < s; o++) {
const r = this.subscriptions[o];
r && r(e, n, i);
}
}
getSize() {
return this.subscriptions.length;
}
clear() {
this.subscriptions.length = 0;
}
}
function or(t, e) {
return e ? t * (1e3 / e) : 0;
}
const xi = 30, Ba = (t) => !isNaN(parseFloat(t));
class Ia {
/**
* @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 = (i, s = !0) => {
const o = nt.now();
this.updatedAt !== o && this.setPrevFrameValue(), this.prev = this.current, this.setCurrent(i), this.current !== this.prev && this.events.change && this.events.change.notify(this.current), s && 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 = nt.now(), this.canTrackVelocity === null && e !== void 0 && (this.canTrackVelocity = Ba(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 st