react-ui-animate 5.3.1 → 5.4.0-next.0

package/dist/index.mjs

@@ -1 +1,4041 @@
-import{createContext as t,useRef as n,useState as i,useMemo as s,Children as e,isValidElement as o,useLayoutEffect as r,useEffect as a,useCallback as c,useContext as l,forwardRef as u,createElement as h}from"react";import{jsx as f,Fragment as d}from"react/jsx-runtime";function p(t,n){var i={};for(var s in t)({}).hasOwnProperty.call(t,s)&&0>n.indexOf(s)&&(i[s]=t[s]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var e=0;for(s=Object.getOwnPropertySymbols(t);e<s.length;e++)0>n.indexOf(s[e])&&{}.propertyIsEnumerable.call(t,s[e])&&(i[s[e]]=t[s[e]])}return i}"function"==typeof SuppressedError&&SuppressedError;const m=.01,v=["inset","normal","italic","bold","thin","medium","thick"],y=["translate","rotate","scale","skew","matrix","perspective"],g={transparent:"#00000000",black:"#000000ff",white:"#ffffffff",red:"#ff0000ff",green:"#008000ff",blue:"#0000ffff",yellow:"#ffff00ff",cyan:"#00ffffff",magenta:"#ff00ffff",gray:"#808080ff",grey:"#808080ff",darkgray:"#a9a9a9ff",darkgrey:"#a9a9a9ff",lightgray:"#d3d3d3ff",lightgrey:"#d3d3d3ff",dimgray:"#696969ff",dimgrey:"#696969ff",slategray:"#708090ff",slategrey:"#708090ff",darkslategray:"#2f4f4fff",darkslategrey:"#2f4f4fff",orange:"#ffa500ff",purple:"#800080ff",pink:"#ffc0cbff",brown:"#a52a2aff",navy:"#000080ff",teal:"#008080ff",silver:"#c0c0c0ff",gold:"#ffd700ff",aqua:"#00ffffff",fuchsia:"#ff00ffff",lime:"#00ff00ff",maroon:"#800000ff",olive:"#808000ff",rebeccapurple:"#663399ff"},b=/-?\d+(\.\d+)?/g,w=/^#(?:[0-9a-f]{3}|[0-9a-f]{4}|[0-9a-f]{6}|[0-9a-f]{8})$/i,x=/^rgba?\(\s*-?\d+(\.\d+)?%?(?:\s*,\s*-?\d+(\.\d+)?%?){2}(?:\s*,\s*(0|1|0?\.\d+))?\s*\)$/i,O=/^hsl\(\s*\d+(\.\d+)?(?:\s*,\s*\d+(\.\d+)?%){2}\s*\)$/i,j=/^hsla\(\s*\d+(\.\d+)?(?:\s*,\s*\d+(\.\d+)?%){2}\s*,\s*(0|1|0?\.\d+)\s*\)$/i,M=/^\s*(linear|radial|conic)-gradient\s*\(/i,$=/^([a-zA-Z$_][\w$]*)\((-?\d*\.?\d+)([a-zA-Z%]*)\)$/,F=/^(-?\d+(\.\d+)?)([a-zA-Z%]*)$/,k=/(\s+|[(),])/g;function S(t){const n=t.trim().toLowerCase();if(w.test(n)||void 0!==g[n])return!0;if(x.test(n)){const t=n.includes("%"),i=[...n.matchAll(b)].map((t=>+t[0])),[s,e,o,r=1]=i;return t?!(0>s||s>100||0>e||e>100||0>o||o>100||0>r||r>1):!(0>s||s>255||0>e||e>255||0>o||o>255||0>r||r>1)}if(O.test(n)){const t=[...n.matchAll(b)].map((t=>+t[0])),[i,s,e]=t;return!(0>i||i>360||0>s||s>100||0>e||e>100)}if(j.test(n)){const t=[...n.matchAll(b)].map((t=>+t[0])),[i,s,e,o]=t;return!(0>i||i>360||0>s||s>100||0>e||e>100||0>o||o>1)}return!1}function A(t){let n=t.trim().toLowerCase();if(g[n]&&(n=g[n]),w.test(n)){let t=n.slice(1);3===t.length?t=t[0]+t[0]+t[1]+t[1]+t[2]+t[2]:4===t.length&&(t=t[0]+t[0]+t[1]+t[1]+t[2]+t[2]+t[3]+t[3]);const i=8===t.length,s=parseInt(t,16);return[s>>(i?24:16)&255,s>>(i?16:8)&255,s>>(i?8:0)&255,i?(255&s)/255:1]}if(x.test(n)){const t=n.includes("%"),i=[...n.matchAll(b)].map((t=>+t[0]));let[s,e,o,r=1]=i;return t&&(s=Math.round(s/100*255),e=Math.round(e/100*255),o=Math.round(o/100*255)),[s,e,o,r]}const i=n.match(/hsla?\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)%\s*,\s*(\d+(?:\.\d+)?)%\s*(?:,\s*(\d+(?:\.\d+)?))?\s*\)/i);if(i){const t=parseFloat(i[1])%360,n=parseFloat(i[2])/100,s=parseFloat(i[3])/100,e=void 0!==i[4]?parseFloat(i[4]):1,[o,r,a]=function(t,n,i){const s=(1-Math.abs(2*i-1))*n,e=s*(1-Math.abs(t/60%2-1)),o=i-s/2;let r=0,a=0,c=0;return t>=0&&60>t?[r,a,c]=[s,e,0]:t>=60&&120>t?[r,a,c]=[e,s,0]:t>=120&&180>t?[r,a,c]=[0,s,e]:t>=180&&240>t?[r,a,c]=[0,e,s]:t>=240&&300>t?[r,a,c]=[e,0,s]:t>=300&&360>t&&([r,a,c]=[s,0,e]),[Math.round(255*(r+o)),Math.round(255*(a+o)),Math.round(255*(c+o))]}(t,n,s);return[o,r,a,e]}throw Error("Unrecognized CSS color: "+t)}function E(t){return t.toFixed(3).replace(/\.?0+$/,"")}function C(t){if(!t.includes(","))return!1;if(!t.includes("(")&&!t.includes(")"))return!0;if(/\)\s*,/.test(t))return!0;let n=0;for(let i=0;i<t.length;i++)if("("===t[i])n++;else if(")"===t[i])n--;else if(","===t[i]&&0===n)return!0;return!1}function I(t){if(!t.includes(","))return[t];const n=[];let i="",s=0;for(let e=0;e<t.length;e++){const o=t[e];"("===o?(s++,i+=o):")"===o?(s--,i+=o):","===o&&0===s?(n.push(i.trim()),i=""):i+=o}return i.trim()&&n.push(i.trim()),n.length>0?n:[t]}function T(t){const n=t.match(M);if(!n)return null;const i=n[1].toLowerCase(),s=n[0].length;let e=1,o=s;for(let r=s;r<t.length&&e>0;r++)if("("===t[r]?e++:")"===t[r]&&e--,0===e){o=r;break}return 0!==e?null:{type:i,content:t.substring(s,o)}}function q(t){let n=0,i=-1;for(let s=0;s<t.length;s++)if("("===t[s])n++;else if(")"===t[s])n--;else if(","===t[s]&&0===n){i=s;break}return-1===i?{firstParam:"",colorStops:t.trim()}:{firstParam:t.substring(0,i).trim(),colorStops:t.substring(i+1).trim()}}function L(t){return y.some((n=>t.toLowerCase().includes(n)))}function Y(t,n){if(!L(t)||!L(n))return!1;const i=t.split(k).filter((t=>""!==t)),s=n.split(k).filter((t=>""!==t));if(i.length!==s.length)return!0;const e=t.toLowerCase().includes("matrix"),o=n.toLowerCase().includes("matrix"),r=["translate","rotate","scale","skew"].some((n=>t.toLowerCase().includes(n))),a=["translate","rotate","scale","skew"].some((t=>n.toLowerCase().includes(t)));return e&&a||o&&r}function z(t,n,i){const s=T(t),e=T(n);return s&&e?function(t,n,i){const s=m>i?t.type:n.type,e=q(t.content),o=q(n.content);let r;if(t.type===n.type)if(e.firstParam&&o.firstParam)try{r=D(e.firstParam,o.firstParam,i)}catch(c){r=m>i?e.firstParam:o.firstParam}else r=m>i?e.firstParam:o.firstParam;else r=m>i?e.firstParam:o.firstParam;const a=D(e.colorStops,o.colorStops,i).replace(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/g,"rgba($1,$2,$3,1.000)");return`${s}-gradient(${r?`${r}, ${a}`:a})`}(s,e,i):(s||e||Y(t,n),m>i?t:n)}function H(t){const n=t.match(/^(\S+\s+)?(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?(?:\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?)?\s+(.+)$/);if(n){const t=n[1]||"",i=[];return n[2]&&i.push({num:n[2],unit:n[3]||""}),n[4]&&i.push({num:n[4],unit:n[5]||""}),n[6]&&i.push({num:n[6],unit:n[7]||""}),n[8]&&i.push({num:n[8],unit:n[9]||""}),{keyword:t,values:i,color:n[10]}}return null}function N(t){const n=H(t);if(n){const{keyword:t,values:i,color:s}=n,e=i.map((t=>t.unit?"0"+t.unit:"0")),o=s.replace(/rgba?\([^)]+\)/gi,(t=>t.toLowerCase().includes("rgba")||t.toLowerCase().includes("rgb")?"rgba(0,0,0,0)":t));return`${t}${e.join(" ")} ${o}`}return""}function D(t,n,i){var s,e;if(!t||""===t.trim()){const s=N(n);return s?D(s,n,i):m>i?t||"":n}if(!n||""===n.trim()){const s=N(t);if(s){const n=D(t,s,Math.min(2*i,1));if(i>=.5){const t=2*(i-.5),s=n.match(/^(\S+\s+)?(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(.+)$/);if(s){const n=Math.abs(parseFloat(s[2])),i=Math.abs(parseFloat(s[4])),e=Math.abs(parseFloat(s[6])),o=s[8].match(/rgba?\((\d+),\s*(\d+),\s*(\d+),\s*([-\d.]+)\)/),r=o?Math.abs(parseFloat(o[4])):0;if(.01>n&&.01>i&&.01>e&&.01>r&&t>.9)return""}return n}return n}return m>i?t:n||""}const o=t.match($),r=n.match($);if(o&&r&&o[1]===r[1]&&o[3]===r[3]){const t=parseFloat(o[2])+(parseFloat(r[2])-parseFloat(o[2]))*i;return`${o[1]}(${E(t)}${o[3]})`}if(S(t)&&S(n)){const[s,e,o,r]=A(t),[a,c,l,u]=A(n),h=Math.round(s+(a-s)*i),f=Math.round(e+(c-e)*i),d=Math.round(o+(l-o)*i),p=r+(u-r)*i,m=E(p);return 1>p?`rgba(${h},${f},${d},${m})`:`rgb(${h},${f},${d})`}const a=t.trim().match(M),c=n.trim().match(M);if(a||c)return z(t.trim(),n.trim(),i);if(Y(t,n))return z(t,n,i);if((t.includes(",")||n.includes(","))&&(C(t)||C(n)))return function(t,n,i){const s=I(t),e=I(n),o=Math.max(s.length,e.length),r=[];for(let a=0;o>a;a++){const t=s[a]||s[s.length-1]||s[0],n=e[a]||e[e.length-1]||e[0];r.push(D(t,n,i))}return r.join(", ")}(t,n,i);const l=t.trim().split(/\s+/),u=n.trim().split(/\s+/),h=null===(s=l[0])||void 0===s?void 0:s.toLowerCase(),f=null===(e=u[0])||void 0===e?void 0:e.toLowerCase(),d=h&&v.includes(h),p=f&&v.includes(f);if(d||p){const s=m>i?d?h:"":p?f:"",e=D(d?l.slice(1).join(" "):t,p?u.slice(1).join(" "):n,i);return s?`${s} ${e}`:e}const y=H(t),g=H(n);if(y&&g){const t=Math.max(y.values.length,g.values.length),n=(t,n)=>{if(!t)return null;const{keyword:i,values:s,color:e}=t;if(3===s.length&&4===n){const t=s[2].unit||"px";return{keyword:i,values:[...s,{num:"0",unit:t}],color:e}}return{keyword:i,values:s,color:e}},s=n(y,t),e=n(g,t);if(s&&e){const n=s.values.map(((t,n)=>{const s=e.values[n];if(!s)return t;if(t.unit===s.unit){const n=parseFloat(t.num);return{num:E(n+(parseFloat(s.num)-n)*i),unit:t.unit}}return m>i?t:s}));let o=s.color;if(s.color!==e.color)try{o=D(s.color,e.color,i)}catch(x){o=m>i?s.color:e.color}return`${m>i?s.keyword||e.keyword:e.keyword||s.keyword}${(4===t?n:n.slice(0,3)).map((t=>t.unit?`${t.num}${t.unit}`:t.num)).join(" ")} ${o}`}}const b=t.split(k).filter((t=>""!==t)),w=n.split(k).filter((t=>""!==t));if(b.length!==w.length){if(function(t,n){const i=t.match(M),s=n.match(M);return!(!i||!s)||Y(t,n)}(t,n))return z(t,n,i);throw Error(`interpolate: template mismatch:\n  "${t}"\n  vs "${n}"`)}return b.map(((t,n)=>{const s=w[n];if(t===s&&/\s+/.test(t))return()=>t;const e=t.match(F),o=s.match(F);if(e&&o&&e[3]===o[3]){const t=parseFloat(e[1])+(parseFloat(o[1])-parseFloat(e[1]))*i;return()=>`${E(t)}${e[3]}`}if(S(t)&&S(s))return()=>D(t,s,i);if(t===s)return()=>t;if(/^[a-zA-Z-]+$/.test(t)&&/^[a-zA-Z-]+$/.test(s)&&!(n+1<b.length&&"("===b[n+1]||n+1<w.length&&"("===w[n+1]))return()=>m>i?t:s;throw Error(`interpolate: cannot interpolate tokens "${t}" vs "${s}"`)})).map((t=>t())).join("")}function X(t,n,i){var s,e,o,r;const a=t.length;if(2>a||n.length!==a)throw Error("interpolate: inRange and outRange must be arrays of the same length >= 2");const c=null!==(e=null!==(s=null==i?void 0:i.extrapolateLeft)&&void 0!==s?s:null==i?void 0:i.extrapolate)&&void 0!==e?e:"extend",l=null!==(r=null!==(o=null==i?void 0:i.extrapolateRight)&&void 0!==o?o:null==i?void 0:i.extrapolate)&&void 0!==r?r:"extend",u=n.map((t=>"string"==typeof t?function(t){const n=Object.keys(g).map((t=>t.replace(/[-\\^$*+?.()|[\]{}]/g,"\\$&"))).join("|"),i=RegExp(`(#(?:[0-9A-Fa-f]{3,4}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})\\b|rgba?\\([^)]*\\)|hsla?\\([^)]*\\)|\\b(?:${n})\\b)`,"gi");return t.replace(i,(t=>{try{const[n,i,s,e]=A(t);return`rgba(${Math.round(n)},${Math.round(i)},${Math.round(s)},${parseFloat(e.toFixed(3)).toString()})`}catch(s){return t}}))}(t):t));return n=>{let s=n;n<t[0]&&"clamp"===c?s=t[0]:n>t[a-1]&&"clamp"===l&&(s=t[a-1]);let e=0;if(s>t[0])if(s<t[a-1]){for(let i=0;a-1>i;i++)if(s>=t[i]&&s<=t[i+1]){e=i;break}}else e=a-2;else e=0;const o=t[e];let r=(s-o)/(t[e+1]-o);(null==i?void 0:i.easing)&&(r=i.easing(r));const h=u[e],f=u[e+1];return"number"==typeof h&&"number"==typeof f?h+(f-h)*r:D(h+"",f+"",r)}}class P{constructor(t){this.subscribers=new Set,this.t=t,this.i=t}get current(){return this.t}get initial(){return this.i}set(t){var n;null===(n=this.controller)||void 0===n||n.cancel(),this.controller=void 0,this.o(t)}o(t){if(t!==this.t){this.t=t;for(const n of this.subscribers)n(t)}}subscribe(t){return this.subscribers.add(t),t(this.t),()=>{this.subscribers.delete(t)}}reset(){this.set(this.i)}destroy(){var t;this.subscribers.clear(),null===(t=this.controller)||void 0===t||t.cancel(),this.controller=void 0}to(t,n,i){if("function"==typeof t){const n=t,i=new P(n(this.t));return this.subscribe((t=>i.set(n(t)))),i}const s=X(t,n,i),e=new P(s(this.current));return this.subscribe((t=>e.set(s(t)))),e}setAnimationController(t){var n;null===(n=this.controller)||void 0===n||n.cancel(),this.controller=t}getAnimationController(){return this.controller}}function R(t){return t instanceof P}const U=new Set(["borderImageOutset","borderImageSlice","borderImageWidth","fontWeight","lineHeight","opacity","orphans","tabSize","widows","zIndex","zoom","fillOpacity","floodOpacity","stopOpacity","strokeDasharray","strokeDashoffset","strokeMiterlimit","strokeOpacity","strokeWidth","animationIterationCount","boxFlex","boxFlexGroup","boxOrdinalGroup","columnCount","flex","flexGrow","flexPositive","flexShrink","flexNegative","flexOrder","gridRow","gridColumn","order","lineClamp"]),V=["translateX","translateY","translateZ","rotate","rotateX","rotateY","rotateZ","scale","scaleX","scaleY","skewX","skewY","perspective"];function W(t,n,i){const s="number"!=typeof i||U.has(n)?i+"":i+"px";t.style[n]=s}function Z(t,n){const i=n&&"function"==typeof n.subscribe?n.current:n;if(Array.isArray(i))return`${t}(${i.join(",")})`;const s=i+"",{value:e,unit:o}=function(t){var n,i,s,e;return{value:+(null!==(i=null===(n=t.match(/-?\d+(\.\d+)?/))||void 0===n?void 0:n[0])&&void 0!==i?i:"0"),unit:null!==(e=null===(s=t.match(/px|rem|em|ex|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax/))||void 0===s?void 0:s[0])&&void 0!==e?e:""}}(s),r=o||function(t){return"perspective"===t||t.startsWith("translate")?"px":t.startsWith("rotate")||t.startsWith("skew")?"deg":""}(t);return`${t}(${e}${r})`}function G(t){return V.includes(t)}function _(t,n){const i=[];for(const[s,e]of Object.entries(n))R(e)?i.push(e.subscribe((n=>W(t,s,n)))):W(t,s,e);return i}function B(t,n){const i=[];for(const[s,e]of Object.entries(n)){const n=n=>{n?t.setAttribute(s,""):t.removeAttribute(s)},o=n=>{t.setAttribute(s,n+"")};R(e)?i.push(e.subscribe((i=>{"boolean"==typeof i?n(i):"string"==typeof i||"number"==typeof i?o(i):t.removeAttribute(s)}))):"boolean"==typeof e?n(e):("string"==typeof e||"number"==typeof e)&&o(e)}return i}function J(t,n){return function(t,n){const i=Object.keys(n).filter(G),s=i.length>0,e=()=>{if(s){const s=i.map((t=>Z(t,n[t])));t.style.transform=s.join(" ")}else"string"==typeof n.transform&&(t.style.transform=n.transform)};e();const o=[];if(s)for(const r of i){const t=n[r];t&&"function"==typeof t.subscribe&&o.push(t.subscribe(e))}return o}(t,n)}function K(t,n){return()=>{const i=Object.keys(n).filter(G);if(i.length>0){const s=i.map((t=>Z(t,n[t])));t.style.transform=s.join(" ")}}}function Q(t,n,i){return Math.min(Math.max(t,n),i)}function tt(t,n,i){return 0===n||Infinity===Math.abs(n)?function(t,n){return Math.pow(t,5*n)}(t,i):t*n*i/(n+i*t)}function nt(t,n,i,s=.15){return 0===s?Q(t,n,i):n>t?-tt(n-t,i-n,s)+n:t>i?+tt(t-i,i-n,s)+i:t}function it(t,n,i){const s=t+.2*n,e=t=>Math.abs(t-s),o=i.map(e),r=Math.min(...o);return i.reduce((function(t,n){return e(n)===r?n:t}))}function st(t,n,i){const s=t[n],e=t.length,o=n-i;if(o>0)return[...t.slice(0,i),s,...t.slice(i,n),...t.slice(n+1,e)];if(0>o){const o=i+1;return[...t.slice(0,n),...t.slice(n+1,o),s,...t.slice(o,e)]}return t}class et{constructor(t,n,i,s){this.value=t,this.velocity=n,this.deceleration=i,this.hooks=s,this.restSpeed=.01,this.isPaused=!1,this.isCancelled=!1,this.pausedAt=0,this.animate=t=>{var n,i,s,e,o,r;if(this.isCancelled||this.isPaused)return;const a=t-this.startTime,c=1-this.deceleration,l=this.velocity*Math.exp(-c*a);if(this.position=this.from+this.velocity/c*(1-Math.exp(-c*a)),this.clampBounds){const[t,n]=this.clampBounds;void 0!==this.elasticConstant?this.position=nt(this.position,t,n,this.elasticConstant):this.position<t?this.position=t:this.position>n&&(this.position=n)}this.value.o(this.position),null===(i=(n=this.hooks).onChange)||void 0===i||i.call(n,this.position),Math.abs(l)>this.restSpeed?this.frameId=requestAnimationFrame(this.animate):(cancelAnimationFrame(this.frameId),null===(e=(s=this.hooks).onChange)||void 0===e||e.call(s,this.position),null===(r=(o=this.hooks).onComplete)||void 0===r||r.call(o))},this.clampBounds=s.clamp,!0===s.elastic?this.elasticConstant=.15:"number"==typeof s.elastic&&(this.elasticConstant=s.elastic)}start(){var t,n;const i=this.value.getAnimationController();i instanceof et&&(this.velocity=i.velocity,this.deceleration=i.deceleration),null===(n=(t=this.hooks).onStart)||void 0===n||n.call(t),this.value.setAnimationController(this),this.isPaused=!1,this.isCancelled=!1,this.from=this.position=this.value.current,this.startTime=performance.now(),this.frameId=requestAnimationFrame(this.animate)}pause(){var t,n;this.isCancelled||this.isPaused||(this.isPaused=!0,this.pausedAt=performance.now(),cancelAnimationFrame(this.frameId),null===(n=(t=this.hooks).onPause)||void 0===n||n.call(t))}resume(){var t,n;if(this.isCancelled||!this.isPaused)return;const i=performance.now();this.startTime+=i-this.pausedAt,this.isPaused=!1,null===(n=(t=this.hooks).onResume)||void 0===n||n.call(t),this.frameId=requestAnimationFrame(this.animate)}cancel(){this.isCancelled=!0,cancelAnimationFrame(this.frameId)}reset(){this.cancel(),this.isPaused=!1,this.pausedAt=0,this.startTime=0}setOnComplete(t){this.hooks.onComplete=t}}function ot(t,n,i={}){const{decay:s=.998}=i,e=p(i,["decay"]);return new et(t,n,s,e)}class rt{constructor(t,n,i,s,e,o){this.value=t,this.target=n,this.stiffness=i,this.damping=s,this.mass=e,this.hooks=o,this.velocity=0,this.restDisplacement=.001,this.restSpeed=.001,this.isPaused=!1,this.isCancelled=!1,this.animate=()=>{var t,n,i,s,e,o;if(this.isCancelled||this.isPaused)return;const r=Date.now(),a=Math.min(r-this.startTime,64);this.startTime=r;const c=this.damping,l=this.mass,u=this.stiffness,h=-this.velocity,f=this.target-this.position,d=c/(2*Math.sqrt(u*l)),p=Math.sqrt(u/l),m=p*Math.sqrt(1-d**2),v=a/1e3,y=Math.sin(m*v),g=Math.cos(m*v),b=Math.exp(-d*p*v),w=b*(y*((h+d*p*f)/m)+f*g),x=this.target-w,O=d*p*w-b*(g*(h+d*p*f)-m*f*y),j=Math.exp(-p*v),M=this.target-j*(f+(h+p*f)*v),$=j*(h*(v*p-1)+v*f*p*p);this.value.o(this.position),null===(n=(t=this.hooks).onChange)||void 0===n||n.call(t,this.position);const F=Math.abs(this.velocity)<this.restSpeed,k=0===this.stiffness||Math.abs(this.target-this.position)<this.restDisplacement;if(1>d?(this.position=x,this.velocity=O):(this.position=M,this.velocity=$),F&&k)return this.velocity=0,this.position=this.target,this.value.o(this.position),null===(s=(i=this.hooks).onChange)||void 0===s||s.call(i,this.position),void(null===(o=(e=this.hooks).onComplete)||void 0===o||o.call(e));this.frameId=requestAnimationFrame(this.animate)},this.explicitFrom=o.from}start(){var t,n;if(void 0!==this.explicitFrom)this.position=this.startPosition=this.explicitFrom,this.value.o(this.explicitFrom),this.velocity=0,this.startTime=Date.now();else{const t=this.value.getAnimationController();t instanceof rt?(this.position=t.position,this.velocity=t.velocity,this.startTime=t.startTime):(this.position=this.startPosition=this.value.current,this.velocity=0,this.startTime=Date.now())}null===(n=(t=this.hooks).onStart)||void 0===n||n.call(t),this.value.setAnimationController(this),this.isPaused=!1,this.isCancelled=!1,this.frameId=requestAnimationFrame(this.animate)}pause(){var t,n;this.isCancelled||this.isPaused||(this.isPaused=!0,cancelAnimationFrame(this.frameId),null===(n=(t=this.hooks).onPause)||void 0===n||n.call(t))}resume(){var t,n;!this.isCancelled&&this.isPaused&&(this.isPaused=!1,null===(n=(t=this.hooks).onResume)||void 0===n||n.call(t),this.frameId=requestAnimationFrame(this.animate))}cancel(){this.isCancelled=!0,cancelAnimationFrame(this.frameId)}reset(){this.cancel(),this.isPaused=!1,this.velocity=0,this.position=this.startPosition,this.startTime=Date.now()}setOnComplete(t){this.hooks.onComplete=t}}function at(t,n,i={}){return function(t,n,i,s){if("number"==typeof t.current&&"number"==typeof n)return s(t,n,i);if("string"==typeof t.current&&"string"==typeof n)try{const e=new P(0),o=e.to([0,1],[t.current,n]),r=s(e,1,i);return t.setAnimationController(r),e.subscribe((()=>{t.getAnimationController()===r&&t.o(o.current)})),r}catch(e){throw Error(`[spring] Cannot animate from "${t.current}" to "${n}": ${e.message}`)}throw Error(`[spring] Unsupported type: ${typeof t.current} → ${typeof n}`)}(t,n,i,((t,n,i)=>{const{stiffness:s=170,damping:e=14,mass:o=1,from:r}=i,a=p(i,["stiffness","damping","mass","from"]);return new rt(t,n,s,e,o,Object.assign(Object.assign({},a),{from:r}))}))}var ct=.1,lt="function"==typeof Float32Array;function ut(t,n){return 1-3*n+3*t}function ht(t,n){return 3*n-6*t}function ft(t){return 3*t}function dt(t,n,i){return((ut(n,i)*t+ht(n,i))*t+ft(n))*t}function pt(t,n,i){return 3*ut(n,i)*t*t+2*ht(n,i)*t+ft(n)}function mt(t){return t}class vt{static step0(t){return t>0?1:0}static step1(t){return 1>t?0:1}static linear(t){return t}static ease(t){return yt(t)}static quad(t){return t*t}static cubic(t){return t*t*t}static poly(t){return n=>Math.pow(n,t)}static sin(t){return 1-Math.cos(t*Math.PI/2)}static circle(t){return 1-Math.sqrt(1-t*t)}static exp(t){return Math.pow(2,10*(t-1))}static elastic(t=1){var n=t*Math.PI;return t=>1-Math.pow(Math.cos(t*Math.PI/2),3)*Math.cos(t*n)}static back(t){return void 0===t&&(t=1.70158),n=>n*n*((t+1)*n-t)}static bounce(t){return 1/2.75>t?7.5625*t*t:2/2.75>t?7.5625*(t-=1.5/2.75)*t+.75:2.5/2.75>t?7.5625*(t-=2.25/2.75)*t+.9375:7.5625*(t-=2.625/2.75)*t+.984375}static bezier(t,n,i,s){return function(t,n,i,s){if(0>t||t>1||0>i||i>1)throw Error("bezier x values must be in [0, 1] range");if(t===n&&i===s)return mt;for(var e=lt?new Float32Array(11):[,,,,,,,,,,,],o=0;11>o;++o)e[o]=dt(o*ct,t,i);return function(o){return 0===o||1===o?o:dt(function(n){for(var s=0,o=1;10!==o&&e[o]<=n;++o)s+=ct;--o;var r=s+(n-e[o])/(e[o+1]-e[o])*ct,a=pt(r,t,i);return.001>a?0===a?r:function(t,n,i,s,e){var o,r,a=0;do{(o=dt(r=n+(i-n)/2,s,e)-t)>0?i=r:n=r}while(Math.abs(o)>1e-7&&10>++a);return r}(n,s,s+ct,t,i):function(t,n,i,s){for(var e=0;4>e;++e){var o=pt(n,i,s);if(0===o)return n;n-=(dt(n,i,s)-t)/o}return n}(n,r,t,i)}(o),n,s)}}(t,n,i,s)}static in(t){return t}static out(t){return n=>1-t(1-n)}static inOut(t){return n=>.5>n?t(2*n)/2:1-t(2*(1-n))/2}}var yt=vt.bezier(.42,0,1,1);class gt{constructor(t,n,i=300,s=vt.linear,e){this.value=t,this.target=n,this.duration=i,this.easing=s,this.hooks=e,this.isPaused=!1,this.isCancelled=!1,this.pausedAt=null,this.elapsedBeforePause=0,this.animate=t=>{var n,i,s,e,o,r;if(this.isCancelled||this.isPaused)return;let a=(this.elapsedBeforePause+(t-this.startTime))/this.duration;Number.isFinite(a)||(a=Infinity===a?1:0);const c=Math.min(1,Math.max(0,a));1>c?(this.position=this.fromValue+(this.target-this.fromValue)*this.easing(c),this.value.o(this.position),null===(i=(n=this.hooks).onChange)||void 0===i||i.call(n,this.position),this.frameId=requestAnimationFrame(this.animate)):(this.position=this.target,this.value.o(this.position),null===(e=(s=this.hooks).onChange)||void 0===e||e.call(s,this.position),null===(r=(o=this.hooks).onComplete)||void 0===r||r.call(o))},this.explicitFrom=e.from}start(){var t,n;if(void 0!==this.explicitFrom)this.fromValue=this.position=this.explicitFrom,this.value.o(this.explicitFrom),this.startTime=performance.now();else{const t=this.value.getAnimationController();t instanceof gt&&!t.isCancelled&&t.target===this.target&&t.startTime?(this.fromValue=t.fromValue,this.startTime=t.startTime):(this.fromValue=this.position=this.value.current,this.startTime=performance.now())}null===(n=(t=this.hooks).onStart)||void 0===n||n.call(t),this.value.setAnimationController(this),this.isPaused=!1,this.isCancelled=!1,this.pausedAt=null,this.elapsedBeforePause=0,this.frameId=requestAnimationFrame(this.animate)}pause(){var t,n;this.isCancelled||this.isPaused||(this.isPaused=!0,this.pausedAt=performance.now(),this.elapsedBeforePause+=this.pausedAt-this.startTime,this.startTime=0,cancelAnimationFrame(this.frameId),null===(n=(t=this.hooks).onPause)||void 0===n||n.call(t))}resume(){var t,n;!this.isCancelled&&this.isPaused&&(this.isPaused=!1,null===(n=(t=this.hooks).onResume)||void 0===n||n.call(t),this.startTime=performance.now(),this.pausedAt=null,this.frameId=requestAnimationFrame(this.animate))}cancel(){this.isCancelled=!0,cancelAnimationFrame(this.frameId)}reset(){this.cancel(),this.isPaused=!1,this.pausedAt=null,this.elapsedBeforePause=0,cancelAnimationFrame(this.frameId)}setOnComplete(t){this.hooks.onComplete=t}}function bt(t,n,i={}){return function(t,n,i,s){if("number"==typeof t.current&&"number"==typeof n)return s(t,n,i);if("string"==typeof t.current&&"string"==typeof n)try{const e=new P(0),o=e.to([0,1],[t.current,n]),r=s(e,1,i);return t.setAnimationController(r),e.subscribe((()=>{t.getAnimationController()===r&&t.o(o.current)})),r}catch(e){throw Error(`[timing] Cannot animate from "${t.current}" to "${n}": ${e.message}`)}throw Error(`[timing] Unsupported type: ${typeof t.current} → ${typeof n}`)}(t,n,i,((t,n,i)=>{const{duration:s=300,easing:e=vt.linear,from:o}=i,r=p(i,["duration","easing","from"]);return new gt(t,n,s,e,Object.assign(Object.assign({},r),{from:o}))}))}class wt{constructor(t,n={}){this.controllers=t,this.hooks=n,this.completedCount=0,this.isPaused=!1,this.isCancelled=!1,this.originalCompletes=t.map((t=>{var n;return null===(n=null==t?void 0:t.hooks)||void 0===n?void 0:n.onComplete}))}start(){var t,n;this.completedCount=0,this.isPaused=!1,this.isCancelled=!1,null===(n=(t=this.hooks).onStart)||void 0===n||n.call(t),this.controllers.forEach(((t,n)=>{var i;const s=this.originalCompletes[n];null===(i=t.setOnComplete)||void 0===i||i.call(t,(()=>{null==s||s(),this.handleComplete()})),t.start()}))}handleComplete(){var t,n,i;this.isCancelled||(this.completedCount+=1,this.completedCount===this.controllers.length&&(this.completedCount=0,null===(n=(t=this.hooks).onComplete)||void 0===n||n.call(t),null===(i=this.onComplete)||void 0===i||i.call(this)))}pause(){var t,n;this.isCancelled||this.isPaused||(this.isPaused=!0,null===(n=(t=this.hooks).onPause)||void 0===n||n.call(t),this.controllers.forEach((t=>t.pause())))}resume(){var t,n;!this.isCancelled&&this.isPaused&&(this.isPaused=!1,null===(n=(t=this.hooks).onResume)||void 0===n||n.call(t),this.controllers.forEach((t=>t.resume())))}cancel(){this.isCancelled||(this.isCancelled=!0,this.controllers.forEach((t=>t.cancel())))}reset(){this.isCancelled=!1,this.isPaused=!1,this.completedCount=0,this.controllers.forEach((t=>{var n;return null===(n=t.reset)||void 0===n?void 0:n.call(t)}))}setOnComplete(t){this.onComplete=t}}class xt{constructor(t,n={}){this.controllers=t,this.hooks=n,this.index=0,this.isPaused=!1,this.isCancelled=!1,this.current=null,this.originalCompletes=t.map((t=>{var n;return null===(n=null==t?void 0:t.hooks)||void 0===n?void 0:n.onComplete}))}runNext(){var t,n,i,s;if(this.isCancelled||this.isPaused)return;const e=this.index++,o=this.controllers[e];if(!o)return null===(t=this.onComplete)||void 0===t||t.call(this),void(null===(i=(n=this.hooks).onComplete)||void 0===i||i.call(n));this.current=o;const r=this.originalCompletes[e];null===(s=o.setOnComplete)||void 0===s||s.call(o,(()=>{null==r||r(),this.runNext()})),o.start()}start(){var t,n;this.index=0,this.isPaused=!1,this.isCancelled=!1,null===(n=(t=this.hooks).onStart)||void 0===n||n.call(t),this.runNext()}pause(){var t,n,i;this.isCancelled||(this.isPaused=!0,null===(t=this.current)||void 0===t||t.pause(),null===(i=(n=this.hooks).onPause)||void 0===i||i.call(n))}resume(){var t,n,i;!this.isCancelled&&this.isPaused&&(this.isPaused=!1,null===(t=this.current)||void 0===t||t.resume(),null===(i=(n=this.hooks).onResume)||void 0===i||i.call(n))}cancel(){var t;this.isCancelled=!0,null===(t=this.current)||void 0===t||t.cancel()}reset(){this.isCancelled=!1,this.isPaused=!1,this.index=0,this.controllers.forEach((t=>{var n;return null===(n=t.reset)||void 0===n?void 0:n.call(t)}))}setOnComplete(t){this.onComplete=t}}class Ot{constructor(t,n,i={}){var s;this.controller=t,this.iterations=n,this.hooks=i,this.count=0,this.isCancelled=!1,this.isPaused=!1,this.handleIterationComplete=()=>{var t,n,i,s,e,o;this.count++,null===(t=this.originalComplete)||void 0===t||t.call(this),this.count<this.iterations?(null===(i=(n=this.controller).reset)||void 0===i||i.call(n),this.runIteration()):(null===(s=this.onComplete)||void 0===s||s.call(this),null===(o=(e=this.hooks).onComplete)||void 0===o||o.call(e))},this.originalComplete=null===(s=null==t?void 0:t.hooks)||void 0===s?void 0:s.onComplete}runIteration(){var t,n;this.isCancelled||this.isPaused||(null===(n=(t=this.controller).setOnComplete)||void 0===n||n.call(t,this.handleIterationComplete),this.controller.start())}start(){var t,n;this.isCancelled=!1,this.isPaused=!1,this.count=0,this.controller.reset(),null===(n=(t=this.hooks).onStart)||void 0===n||n.call(t),this.runIteration()}pause(){var t,n;this.isPaused=!0,this.controller.pause(),null===(n=(t=this.hooks).onPause)||void 0===n||n.call(t)}resume(){var t,n;!this.isCancelled&&this.isPaused&&(this.isPaused=!1,this.controller.resume(),null===(n=(t=this.hooks).onResume)||void 0===n||n.call(t))}cancel(){this.isCancelled=!0,this.controller.cancel()}reset(){var t,n;this.isCancelled=!1,this.isPaused=!1,this.count=0,null===(n=(t=this.controller).reset)||void 0===n||n.call(t)}setOnComplete(t){this.onComplete=t}}class jt{constructor(t){this.duration=t}start(){this.timerId=window.setTimeout((()=>{var t;null===(t=this.onComplete)||void 0===t||t.call(this)}),this.duration)}pause(){}resume(){}cancel(){this.timerId&&clearTimeout(this.timerId)}reset(){this.cancel()}setOnComplete(t){this.onComplete=t}}function Mt(t,n={}){return new wt(t,n)}function $t(t,n={}){return new xt(t,n)}function Ft(t,n,i={}){return new Ot(t,n,i)}function kt(t){return new jt(t)}function St(t={},n){if(n)return t;const{onStart:i,onChange:s,onComplete:e}=t;return p(t,["onStart","onChange","onComplete"])}function At(t){return"object"==typeof t&&null!==t&&"type"in t&&"string"==typeof t.type}function Et(t,{type:n,to:i,options:s={}}){var e,o,r,a,c,l,u;switch(n){case"spring":return at(t,i,s);case"timing":return bt(t,i,s);case"decay":return ot(t,null!==(e=s.velocity)&&void 0!==e?e:0,s);case"delay":return kt(null!==(o=s.delay)&&void 0!==o?o:0);case"sequence":return $t((null!==(r=s.animations)&&void 0!==r?r:[]).map((n=>Et(t,n))),s);case"loop":{const n=s.animation;if(!n)return{start(){},pause(){},resume(){},cancel(){},reset(){}};let i;const e=t.initial;if("sequence"===n.type){const s=(null!==(c=null===(a=n.options)||void 0===a?void 0:a.animations)&&void 0!==c?c:[]).map(((n,i)=>{var s;if(0===i&&("spring"===n.type||"timing"===n.type)){const i=null===(s=n.options)||void 0===s?void 0:s.from;return Et(t,Object.assign(Object.assign({},n),{options:Object.assign(Object.assign({},n.options),{from:null!=i?i:e})}))}return Et(t,n)}));i=$t(s,n.options)}else if("spring"===n.type||"timing"===n.type){const s=null===(l=n.options)||void 0===l?void 0:l.from;i=Et(t,Object.assign(Object.assign({},n),{options:Object.assign(Object.assign({},n.options),{from:null!=s?s:e})}))}else i=Et(t,n);return Ft(i,null!==(u=s.iterations)&&void 0!==u?u:0,s)}default:return{start(){},pause(){},resume(){},cancel(){},reset(){}}}}function Ct(t,n){return Mt(Object.entries(t).filter((([t])=>"decay"===n.type||"delay"===n.type||void 0!==n.to[t])).map((([t,i],s)=>Et(i,{type:n.type,to:"decay"===n.type||"delay"===n.type?n.to:n.to[t],options:St(n.options,0===s)}))))}const It=t(null);function Tt(){const t=l(It);return t?[!t.isExiting,t.onExitComplete]:[!0,()=>{}]}function qt(){const t=l(It);return!t||!t.isExiting}function Lt({children:t,isExiting:n,mode:s}){const[e,o]=i(!1);return r((()=>{n&&!e&&o(!0)}),[n,e]),"popLayout"===s&&n?f("div",{style:{position:"absolute"},children:t}):t}function Yt({children:t,initial:l=!0,onExitComplete:u,mode:h="sync"}){const p=n(!0),[m,v]=i((()=>new Map)),y=n(0),g=s((()=>{const n=[];return e.forEach(t,(t=>{var i;if(o(t)){const s=null!==(i=t.key)&&void 0!==i?i:"default";n.push({key:s,element:t})}})),n}),[t]),b=s((()=>new Set(g.map((t=>t.key)))),[g]);r((()=>{v((t=>{const n=new Map,i=new Map(g.map((({key:t,element:n})=>[t,n])));for(const[s,e]of t)i.has(s)?(e.isExiting&&y.current--,n.set(s,{key:s,element:i.get(s),isExiting:!1})):(e.isExiting||y.current++,n.set(s,Object.assign(Object.assign({},e),{isExiting:!0})));for(const{key:s,element:e}of g)t.has(s)||n.set(s,{key:s,element:e,isExiting:!1});return n}))}),[g,b]),a((()=>{p.current&&(p.current=!1)}),[]);const w=c((t=>{v((n=>{const i=new Map(n);return i.delete(t),i})),y.current--,0===y.current&&u&&u()}),[u]),x=s((()=>{const t=[],n=Array.from(m.values()).some((t=>t.isExiting)),i="wait"===h&&n;for(const[s,e]of m){if(i&&!e.isExiting)continue;const n={isInitialMount:p.current&&l,isExiting:e.isExiting,onExitComplete:()=>w(s)};t.push(f(It.Provider,{value:n,children:f(Lt,{isExiting:e.isExiting,mode:h,children:e.element})},s))}return t}),[m,l,h,w]);return f(d,{children:x})}function zt(t){return"opacity"===t||"scale"===t||"scaleX"===t||"scaleY"===t?1:t.startsWith("translate")||t.startsWith("rotate")?0:["boxShadow","textShadow","background","backgroundImage","backgroundPosition","backgroundSize","border","borderColor","borderImage","borderRadius","color","fill","stroke","filter","backdropFilter","clipPath","mask","maskImage"].includes(t)?"":0}function Ht(t){return/\d+(px|rem|em|ex|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)$/i.test(t)}function Nt(t,n,i,s){const e=function(t){return!!G(t)||"opacity"===t||"zIndex"===t}(t),o=function(t,n){if(!t||!(n in t))return null;const i=t[n];if(null==i)return null;if(i&&"object"==typeof i&&"subscribe"in i)return null;if("number"==typeof i)return i;if("string"==typeof i){if([/\s/,/rgba?\(/,/hsla?\(/,/#[0-9a-fA-F]/,/linear-gradient|radial-gradient|conic-gradient/,/calc\(|var\(/].some((t=>t.test(i))))return i;if(/\d+(px|rem|em|ex|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)$/i.test(i))return i;const t=parseFloat(i);return isNaN(t)?i:t}return null}(n,t);if(null!==o){if(e&&"string"==typeof o){const n=parseFloat(o);return isNaN(n)?zt(t):n}return o}const r=i.style[t];if(r){if(e){const n=parseFloat(r);return isNaN(n)?zt(t):n}if(Ht(r))return r;const n=parseFloat(r);return isNaN(n)?r:n}const a=s.getPropertyValue(t.replace(/([A-Z])/g,"-$1").toLowerCase());if(a){const n=a.trim();if(e){const i=parseFloat(n);return isNaN(i)?zt(t):i}if("none"===n&&["boxShadow","textShadow","background","backgroundImage","backgroundPosition","backgroundSize","border","borderColor","borderImage","borderRadius","color","fill","stroke","filter","backdropFilter","clipPath","mask","maskImage"].includes(t))return"";if(Ht(n))return n;const i=parseFloat(n);return isNaN(i)?n:i}return zt(t)}function Dt(t,n,i){if(!t)return;const{node:s,style:e,computedStyle:o,animateValues:r,initialValues:a,stateControllers:c,cleanup:l}=i;c.forEach((t=>t.cancel())),c.length=0;const u=[];for(const[h,f]of Object.entries(t)){let t=r[h];if(t)if(h in a||(a[h]=n?t.current:Nt(h,e,s,o)),G(h)){const n=K(s,r);u.push(t.subscribe(n))}else u.push(t.subscribe((t=>{const n="number"!=typeof t||["opacity","zIndex","fontWeight","lineHeight"].includes(h)?t+"":t+"px";s.style[h]=n})));else{const n=Nt(h,e,s,o);if(t=new P(n),r[h]=t,a[h]=n,G(h)){const n=K(s,r);u.push(t.subscribe(n)),n()}else{const i=t=>{const n="number"!=typeof t||["opacity","zIndex","fontWeight","lineHeight"].includes(h)?t+"":t+"px";s.style[h]=n};u.push(t.subscribe(i)),i(n)}}const i="number"==typeof f||"string"==typeof f;if(n)if(i){const n=Et(t,{type:"spring",to:f,options:{}});c.push(n),n.start()}else{const n=Et(t,f);c.push(n),n.start()}else{const n=a[h];if(i){const i=Et(t,{type:"spring",to:n,options:{}});c.push(i),i.start()}else{const i=Et(t,{type:"spring",to:n,options:{}});c.push(i),i.start()}}}l.push(...u)}function Xt(...t){return n=>{for(const i of t)i&&("function"==typeof i?i(n):"current"in i&&(i.current=n))}}function Pt(t,n={}){const{root:s,rootMargin:e,threshold:o,once:r=!1}=n,[c,l]=i(!1);return a((()=>{const n=t.current;if(!n)return;const i=new IntersectionObserver((([t])=>{t.isIntersecting?(l(!0),r&&(i.unobserve(t.target),i.disconnect())):r||l(!1)}),{root:null!=s?s:null,rootMargin:e,threshold:o});return i.observe(n),()=>i.disconnect()}),[t,s,e,o,r]),c}function Rt(t){if(!t)return"";const n=t;return Object.keys(n).sort().map((t=>{const i=n[t];if("number"==typeof i||"string"==typeof i)return`${t}:${i}`;if("object"==typeof i&&null!==i&&"type"in i){const n=i;return`${t}:${n.type}:${JSON.stringify(n.to||"")}`}return t+":unknown"})).join("|")}function Ut(t){const i=u(((i,s)=>{const e=n(null),o=n(i),c=n(!1),u=n({}),f=n([]);o.current=i,function(t,i,s,e,o){const a=l(It),c=n([]),u=n([]),h=n(null),f=n(!1);r((()=>{var t;h.current=null!==(t=null==a?void 0:a.onExitComplete)&&void 0!==t?t:null})),r((()=>{var n;const{exit:r,style:l={}}=i.current,d=t.current,p=null!==(n=null==a?void 0:a.isExiting)&&void 0!==n&&n,m=f.current;if(f.current=p,p){if(!s.current&&r&&d)return!m&&p&&(s.current=!0,o.current.forEach((t=>t.cancel())),o.current=[],u.current.forEach((t=>t())),u.current=[],u.current=function(t){const{exitProp:n,animateValues:i,controllers:s,onExitComplete:e,node:o,style:r}=t;let a=0;const c=Object.keys(n).length,l=[],u=()=>{a++,c>a||e()},h=window.getComputedStyle(o);for(const m of Object.keys(n))if(!i[m]){const t=Nt(m,r,o,h);i[m]=new P(t)}const f=Object.assign({},r);for(const m of Object.keys(i))f[m]=i[m];const d={},p={};for(const[m,v]of Object.entries(f))v&&"object"==typeof v&&"subscribe"in v&&((G(m)?p:d)[m]=v);l.push(..._(o,d)),l.push(...J(o,p));for(const[m,v]of Object.entries(n)){const t=i[m];if(!t){u();continue}const n="number"==typeof v||"string"==typeof v?{type:"spring",to:v,options:{}}:v,e=Et(t,Object.assign(Object.assign({},n),{options:Object.assign(Object.assign({},n.options),{onComplete:()=>{var t,i;null===(i=null===(t=n.options)||void 0===t?void 0:t.onComplete)||void 0===i||i.call(t),u()}})}));s.push(e),e.start()}return l}({exitProp:r,animateValues:e.current,controllers:c.current,onExitComplete:()=>{s.current&&h.current&&(u.current.forEach((t=>t())),u.current=[],s.current=!1,h.current())},node:d,style:l})),()=>{s.current&&(c.current.forEach((t=>t.cancel())),c.current=[],u.current.forEach((t=>t())),u.current=[])}}else s.current&&(s.current=!1,c.current.forEach((t=>t.cancel())),c.current=[],u.current.forEach((t=>t())),u.current=[])}),[null==a?void 0:a.isExiting])}(e,o,c,u,f),function(t,i,s,e,o,a){const c=l(It),u=n([]),h=n(!1),f=n(""),d=n(!1);r((()=>{var n;const r=t.current,l=null!==(n=null==c?void 0:c.isExiting)&&void 0!==n&&n,m=d.current&&!l;if(d.current=l,!r||l||e.current)return;const v=i.current,{style:y={}}=v,g=p(v,["style"]),b=Rt(s),w=f.current!==b;if((!h.current||w||m)&&(a.current.forEach((t=>t.cancel())),a.current=[],s)){const t=window.getComputedStyle(r);if(0===Object.keys(o.current).length){const n={};for(const i of Object.keys(s)){const s=Nt(i,y,r,t);n[i]=new P(s)}o.current=n}!function(t,n,i){for(const[s,e]of Object.entries(t)){const t=n[s];if(!t)continue;const o=Et(t,"number"==typeof e||"string"==typeof e?{type:"spring",to:e,options:{}}:e);i.push(o),o.start()}}(s,o.current,a.current)}return u.current.forEach((t=>t())),u.current=function(t,n,i,s){const e=Object.assign({},n);for(const a of Object.keys(i))e[a]=i[a];const o={},r={};for(const[a,c]of Object.entries(e))(G(a)?r:o)[a]=c;return[..._(t,o),...J(t,e),...B(t,s)]}(r,y,o.current,g),f.current=b,h.current=!0,()=>{u.current.forEach((t=>t())),u.current=[]}}),[s,null==c?void 0:c.isExiting])}(e,o,i.animate,c,u,f),function(t,i,s,e,o,r){const c=n([]),l=n({}),u=n({isHovered:!1,isTapped:!1,isFocused:!1}),h=n(s),f=n(e),d=n(o);h.current=s,f.current=e,d.current=o;const p=(n,s)=>{if(!n)return;const e=t.current;if(!e)return;const o=window.getComputedStyle(e),{style:a={}}=i.current;Dt(n,s,{node:e,style:a,computedStyle:o,animateValues:r.current,initialValues:l.current,stateControllers:c.current,cleanup:[]})};a((()=>{const n=t.current;if(!n)return;const i=()=>{u.current.isHovered||(u.current.isHovered=!0,p(h.current,!0))},s=()=>{u.current.isHovered&&(u.current.isHovered=!1,p(h.current,!1))},e=()=>{u.current.isTapped||(u.current.isTapped=!0,p(f.current,!0))},o=()=>{u.current.isTapped&&(u.current.isTapped=!1,p(f.current,!1),u.current.isHovered&&h.current&&p(h.current,!0))},r=()=>{u.current.isTapped&&(u.current.isTapped=!1,p(f.current,!1),u.current.isHovered&&h.current&&p(h.current,!0))},a=()=>{u.current.isFocused||(u.current.isFocused=!0,p(d.current,!0))},l=()=>{u.current.isFocused&&(u.current.isFocused=!1,p(d.current,!1))};return h.current&&(n.addEventListener("mouseenter",i),n.addEventListener("mouseleave",s)),f.current&&(n.addEventListener("mousedown",e),n.addEventListener("mouseup",o),n.addEventListener("mouseleave",r),n.addEventListener("touchstart",e),n.addEventListener("touchend",o),n.addEventListener("touchcancel",r)),d.current&&function(t){return t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement||t instanceof HTMLSelectElement||t instanceof HTMLButtonElement||t instanceof HTMLAnchorElement||null!==t.getAttribute("tabindex")}(n)&&(n.addEventListener("focus",a),n.addEventListener("blur",l)),u.current.isHovered&&h.current&&p(h.current,!0),u.current.isTapped&&f.current&&p(f.current,!0),u.current.isFocused&&d.current&&p(d.current,!0),()=>{h.current&&(n.removeEventListener("mouseenter",i),n.removeEventListener("mouseleave",s)),f.current&&(n.removeEventListener("mousedown",e),n.removeEventListener("mouseup",o),n.removeEventListener("mouseleave",r),n.removeEventListener("touchstart",e),n.removeEventListener("touchend",o),n.removeEventListener("touchcancel",r)),d.current&&(n.removeEventListener("focus",a),n.removeEventListener("blur",l)),c.current.forEach((t=>t.cancel())),c.current=[]}}),[Rt(s),Rt(e),Rt(o)]),a((()=>()=>{c.current.forEach((t=>t.cancel())),c.current=[]}),[])}(e,o,i.hover,i.press,i.focus,u),function(t,i,s,e,o){const c=n([]),l=n({}),u=n([]),h=Pt(t,e||{}),f=n(!1);r((()=>{if(!s)return;const n=t.current;if(!n)return;if(f.current)return;const e=window.getComputedStyle(n),{style:r={}}=i.current;for(const t of Object.keys(s))if(!o.current[t]){const i=Nt(t,r,n,e),s=new P(i);if(o.current[t]=s,l.current[t]=i,G(t))K(n,o.current)();else{const s="number"!=typeof i||["opacity","zIndex","fontWeight","lineHeight"].includes(t)?i+"":i+"px";n.style[t]=s}}f.current=!0}),[s]),a((()=>{if(s)return(n=>{if(!s)return;const e=t.current;if(!e)return;u.current.forEach((t=>t())),u.current=[];const r=window.getComputedStyle(e),{style:a={}}=i.current,h={node:e,style:a,computedStyle:r,animateValues:o.current,initialValues:l.current,stateControllers:c.current,cleanup:u.current};Dt(s,n,h)})(h),()=>{c.current.forEach((t=>t.cancel())),c.current=[],u.current.forEach((t=>t())),u.current=[]}}),[h,s]),a((()=>()=>{c.current.forEach((t=>t.cancel())),c.current=[],u.current.forEach((t=>t())),u.current=[]}),[])}(e,o,i.view,i.viewOptions,u);const{animate:d,exit:m,hover:v,press:y,focus:g,view:b,viewOptions:w,style:x}=i,O=p(i,["animate","exit","hover","press","focus","view","viewOptions","style"]),j={},M=new Set([...Object.keys(u.current),...d?Object.keys(d):[]]);if(x)for(const[t,n]of Object.entries(x))G(t)||M.has(t)||n&&"object"==typeof n&&"subscribe"in n||(j[t]=n);return h(t,Object.assign(Object.assign({},O),{style:j,ref:Xt(e,s)}))}));return i.displayName="Animated."+t,i}const Vt=new Map,Wt=new Proxy({},{get:(t,n)=>(Vt.has(n)||Vt.set(n,Ut(n)),Vt.get(n))});function Zt(t,n){const i=t.map((t=>t.current)),s=new P(n(...i));return t.forEach((i=>i.subscribe((()=>(()=>{const i=t.map((t=>t.current));s.set(n(...i))})())))),s}function Gt(t,n,i,s){return X(n,i,s)(t)}const _t=(t,n)=>{var i,s,e;return{type:"spring",to:t,options:{stiffness:null!==(i=null==n?void 0:n.stiffness)&&void 0!==i?i:158,damping:null!==(s=null==n?void 0:n.damping)&&void 0!==s?s:20,mass:null!==(e=null==n?void 0:n.mass)&&void 0!==e?e:1,from:null==n?void 0:n.from,onStart:null==n?void 0:n.onStart,onChange:null==n?void 0:n.onChange,onComplete:null==n?void 0:n.onComplete}}},Bt=(t,n)=>({type:"timing",to:t,options:{duration:null==n?void 0:n.duration,easing:null==n?void 0:n.easing,from:null==n?void 0:n.from,onStart:null==n?void 0:n.onStart,onChange:null==n?void 0:n.onChange,onComplete:null==n?void 0:n.onComplete}}),Jt=(t,n)=>({type:"decay",options:{velocity:t,clamp:null==n?void 0:n.clamp,elastic:null==n?void 0:n.elastic,onStart:null==n?void 0:n.onStart,onChange:null==n?void 0:n.onChange,onComplete:null==n?void 0:n.onComplete}}),Kt=t=>({type:"delay",options:{delay:t}}),Qt=(t,n)=>({type:"sequence",options:{animations:t,onStart:null==n?void 0:n.onStart,onComplete:null==n?void 0:n.onComplete}}),tn=(t,n=Infinity,i)=>({type:"loop",options:{animation:t,iterations:n,onStart:null==i?void 0:i.onStart,onComplete:null==i?void 0:i.onComplete}});function nn(t){const i=n(null),e=s((()=>Array.isArray(t)?t.map((t=>new P(t))):"object"==typeof t?Object.fromEntries(Object.entries(t).map((([t,n])=>[t,new P(n)]))):new P(t)),[]);return[e,function(n){let s=null;s=Array.isArray(t)?function(t,n){var i,s;if(!At(n))return n.forEach(((n,i)=>{var s;null===(s=t[i])||void 0===s||s.set(n)})),null;const e=n,o=Object.fromEntries(t.map(((t,n)=>[n.toString(),t])));switch(e.type){case"sequence":{const t=e.options.animations.map((t=>{var n,i;return"delay"===t.type?kt(null!==(i=null===(n=t.options)||void 0===n?void 0:n.delay)&&void 0!==i?i:0):Ct(o,Object.assign(Object.assign({},t),{to:Array.isArray(t.to)?Object.fromEntries(t.to.map(((t,n)=>[n.toString(),t]))):t.to}))}));return $t(t,e.options)}case"loop":{const t=e.options.animation;return"sequence"===t.type?Ft($t(t.options.animations.map((t=>Ct(o,Object.assign(Object.assign({},t),{to:Array.isArray(t.to)?Object.fromEntries(t.to.map(((t,n)=>[n.toString(),t]))):t.to})))),St(t.options,!0)),null!==(i=e.options.iterations)&&void 0!==i?i:0,St(e.options,!0)):Ft(Ct(o,t),null!==(s=e.options.iterations)&&void 0!==s?s:0,St(e.options,!0))}default:return Ct(o,e)}}(e,n):"object"==typeof t?function(t,n){var i,s;if(At(n))switch(n.type){case"sequence":{const i=n.options.animations.map((n=>{var i;return"delay"===n.type?kt(null!==(i=n.options.delay)&&void 0!==i?i:0):Ct(t,n)}));return $t(i,n.options)}case"loop":{const e=n.options.animation;return"sequence"===e.type?Ft($t(e.options.animations.map((n=>Ct(t,n))),St(e.options,!0)),null!==(i=n.options.iterations)&&void 0!==i?i:0,St(n.options,!0)):Ft(Ct(t,e),null!==(s=n.options.iterations)&&void 0!==s?s:0,St(n.options,!0))}default:return Ct(t,n)}return Object.entries(n).forEach((([n,i])=>{var s;null===(s=t[n])||void 0===s||s.set(i)})),null}(e,n):function(t,n){var i,s,e,o,r,a,c,l,u;if("number"==typeof n||"string"==typeof n)return t.set(n),null;if("sequence"===n.type)return $t((null!==(s=null===(i=n.options)||void 0===i?void 0:i.animations)&&void 0!==s?s:[]).map((n=>Et(t,n))),n.options);if("loop"===n.type){const i=null===(e=n.options)||void 0===e?void 0:e.animation;return i?"sequence"===i.type?Ft($t((null!==(r=null===(o=i.options)||void 0===o?void 0:o.animations)&&void 0!==r?r:[]).map((n=>Et(t,n)))),null!==(c=null===(a=n.options)||void 0===a?void 0:a.iterations)&&void 0!==c?c:0,n.options):Ft(Et(t,i),null!==(u=null===(l=n.options)||void 0===l?void 0:l.iterations)&&void 0!==u?u:0,n.options):null}return Et(t,n)}(e,n),i.current=s,s&&s.start()},{start:()=>{var t;return null===(t=i.current)||void 0===t?void 0:t.start()},pause:()=>{var t;return null===(t=i.current)||void 0===t?void 0:t.pause()},resume:()=>{var t;return null===(t=i.current)||void 0===t?void 0:t.resume()},cancel:()=>{var t;return null===(t=i.current)||void 0===t?void 0:t.cancel()},reset:()=>{var t;return null===(t=i.current)||void 0===t?void 0:t.reset()}}]}const sn={opacity:_t(1,{stiffness:100,damping:15})},en={opacity:_t(0,{stiffness:100,damping:15})},on={opacity:_t(1,{stiffness:100,damping:15}),translateY:_t(0,{stiffness:100,damping:15})},rn={opacity:_t(1,{stiffness:100,damping:15}),translateY:_t(0,{stiffness:100,damping:15})},an={opacity:_t(1,{stiffness:100,damping:15}),translateX:_t(0,{stiffness:100,damping:15})},cn={opacity:_t(1,{stiffness:100,damping:15}),translateX:_t(0,{stiffness:100,damping:15})},ln={translateY:_t(0,{stiffness:100,damping:15})},un={translateY:_t(0,{stiffness:100,damping:15})},hn={translateX:_t(0,{stiffness:100,damping:15})},fn={translateX:_t(0,{stiffness:100,damping:15})},dn={translateY:_t(-100,{stiffness:100,damping:15})},pn={translateY:_t(100,{stiffness:100,damping:15})},mn={translateX:_t(-100,{stiffness:100,damping:15})},vn={translateX:_t(100,{stiffness:100,damping:15})},yn={scale:_t(1,{stiffness:200,damping:20}),opacity:_t(1,{stiffness:100,damping:15})},gn={scale:_t(0,{stiffness:200,damping:20}),opacity:_t(0,{stiffness:100,damping:15})},bn={scale:_t(1.1,{stiffness:150,damping:15})},wn={scale:_t(.9,{stiffness:150,damping:15})},xn={scale:_t(1,{stiffness:300,damping:10}),opacity:_t(1,{stiffness:100,damping:15})},On={scale:_t(0,{stiffness:300,damping:10}),opacity:_t(0,{stiffness:100,damping:15})},jn={rotate:_t(0,{stiffness:100,damping:15}),opacity:_t(1,{stiffness:100,damping:15})},Mn={rotate:_t(180,{stiffness:100,damping:15}),opacity:_t(0,{stiffness:100,damping:15})},$n={rotate:_t(360,{stiffness:50,damping:10})},Fn={scale:_t(1,{stiffness:200,damping:20}),opacity:_t(1,{stiffness:100,damping:15})},kn={scale:_t(0,{stiffness:200,damping:20}),opacity:_t(0,{stiffness:100,damping:15})},Sn={rotateX:_t(0,{stiffness:150,damping:15})},An={rotateY:_t(0,{stiffness:150,damping:15})},En={opacity:_t(1,{stiffness:100,damping:15}),translateY:_t(0,{stiffness:100,damping:15})},Cn={opacity:_t(0,{stiffness:100,damping:15}),translateY:_t(20,{stiffness:100,damping:15})},In={scale:_t(1,{stiffness:200,damping:20}),opacity:_t(1,{stiffness:100,damping:15})},Tn={scale:_t(.8,{stiffness:200,damping:20}),opacity:_t(0,{stiffness:100,damping:15})},qn={scale:_t(1.05,{stiffness:300,damping:20})},Ln={translateY:_t(-5,{stiffness:300,damping:20}),scale:_t(1.02,{stiffness:300,damping:20})},Yn={scale:_t(1.05,{stiffness:300,damping:20}),opacity:_t(.9,{stiffness:300,damping:20})},zn={scale:_t(.95,{stiffness:400,damping:25})},Hn={translateY:_t(2,{stiffness:400,damping:25}),scale:_t(.98,{stiffness:400,damping:25})},Nn={opacity:_t(0,{stiffness:100,damping:15})},Dn={opacity:_t(0,{stiffness:100,damping:15}),translateY:_t(-20,{stiffness:100,damping:15})},Xn={opacity:_t(0,{stiffness:100,damping:15}),translateY:_t(20,{stiffness:100,damping:15})},Pn={scale:_t(.8,{stiffness:200,damping:20}),opacity:_t(0,{stiffness:100,damping:15})},Rn={fadeIn:sn,fadeOut:en,fadeInUp:on,fadeInDown:rn,fadeInLeft:an,fadeInRight:cn,slideInUp:ln,slideInDown:un,slideInLeft:hn,slideInRight:fn,slideOutUp:dn,slideOutDown:pn,slideOutLeft:mn,slideOutRight:vn,scaleIn:yn,scaleOut:gn,scaleUp:bn,scaleDown:wn,bounceIn:xn,bounceOut:On,rotateIn:jn,rotateOut:Mn,spin:$n,zoomIn:Fn,zoomOut:kn,flipX:Sn,flipY:An,slideFadeIn:En,slideFadeOut:Cn,scaleFadeIn:In,scaleFadeOut:Tn,hoverScale:qn,hoverLift:Ln,hoverGlow:Yn,pressScale:zn,pressDown:Hn,exitFade:Nn,exitSlideUp:Dn,exitSlideDown:Xn,exitScale:Pn};function Un(t,i,s=[]){const e=n(i);a((()=>{e.current=i}),[i,...s]),a((()=>{function n(n){const i=t.current,s=n.target;i&&s&&s.isConnected&&i.isConnected&&(i.contains(s)||e.current(n))}return document.addEventListener("mousedown",n),document.addEventListener("touchstart",n),()=>{document.removeEventListener("mousedown",n),document.removeEventListener("touchstart",n)}}),[t])}class Vn{constructor(){this.changeListeners=new Set,this.endListeners=new Set}onChange(t){return this.changeListeners.add(t),this}onEnd(t){return this.endListeners.add(t),this}emitChange(t){this.changeListeners.forEach((n=>n(t)))}emitEnd(t){this.endListeners.forEach((n=>n(t)))}}Vn.VELOCITY_LIMIT=20;class Wn extends Vn{constructor(t={}){super(),this.prev={x:0,y:0},this.lastTime=0,this.movement={x:0,y:0},this.velocity={x:0,y:0},this.start={x:0,y:0},this.offset={x:0,y:0},this.pointerCaptured=!1,this.activePointerId=null,this.attachedEls=new Set,this.activeEl=null,this.pointerDownPos={x:0,y:0},this.thresholdPassed=!1,this.config=t}attach(t){if(t===window)return()=>{};const n=Array.isArray(t)?t:[t],i=this.onDown.bind(this),s=this.onMove.bind(this),e=this.onUp.bind(this);return n.forEach((t=>{this.attachedEls.add(t),t.addEventListener("pointerdown",i,{passive:!1})})),window.addEventListener("pointermove",s,{passive:!1}),window.addEventListener("pointerup",e),window.addEventListener("pointercancel",e),()=>{n.forEach((t=>{t.removeEventListener("pointerdown",i),this.attachedEls.delete(t)})),window.removeEventListener("pointermove",s),window.removeEventListener("pointerup",e),window.removeEventListener("pointercancel",e)}}onDown(t){var n,i,s;if(0!==t.button)return;const e=t.currentTarget;this.attachedEls.has(e)&&(this.activeEl=e,this.activePointerId=t.pointerId,this.pointerCaptured=!1,this.start=!1===this.thresholdPassed&&0===this.start.x&&0===this.start.y?null!==(s=null===(i=(n=this.config).initial)||void 0===i?void 0:i.call(n))&&void 0!==s?s:{x:0,y:0}:Object.assign({},this.offset),this.offset=Object.assign({},this.start),this.movement={x:0,y:0},this.velocity={x:0,y:0},this.pointerDownPos={x:t.clientX,y:t.clientY},this.thresholdPassed=!1,this.prev={x:t.clientX,y:t.clientY},this.lastTime=t.timeStamp,this.emitChange({down:!0,movement:{x:0,y:0},offset:Object.assign({},this.offset),velocity:{x:0,y:0},event:t,cancel:this.cancel.bind(this)}))}onMove(t){var n;if(this.activePointerId!==t.pointerId||!this.activeEl)return;const i=null!==(n=this.config.threshold)&&void 0!==n?n:0;if(!this.thresholdPassed){const n=t.clientX-this.pointerDownPos.x,s=t.clientY-this.pointerDownPos.y;if(i>Math.hypot(n,s))return;this.thresholdPassed=!0,this.activeEl.setPointerCapture(t.pointerId),this.pointerCaptured=!0}this.pointerCaptured&&t.preventDefault();const s=Math.max((t.timeStamp-this.lastTime)/1e3,1e-6);this.lastTime=t.timeStamp;const e=(t.clientX-this.prev.x)/s/1e3,o=(t.clientY-this.prev.y)/s/1e3;this.velocity={x:Q(e,-Vn.VELOCITY_LIMIT,Vn.VELOCITY_LIMIT),y:Q(o,-Vn.VELOCITY_LIMIT,Vn.VELOCITY_LIMIT)};const r={x:t.clientX-this.pointerDownPos.x,y:t.clientY-this.pointerDownPos.y};this.movement={x:"y"===this.config.axis?0:r.x,y:"x"===this.config.axis?0:r.y},this.offset={x:this.start.x+this.movement.x,y:this.start.y+this.movement.y},this.prev={x:t.clientX,y:t.clientY},this.emitChange({down:!0,movement:Object.assign({},this.movement),offset:Object.assign({},this.offset),velocity:Object.assign({},this.velocity),event:t,cancel:this.cancel.bind(this)})}onUp(t){this.activePointerId===t.pointerId&&this.activeEl&&(this.activeEl.releasePointerCapture(t.pointerId),this.emitEnd({down:!1,movement:Object.assign({},this.movement),offset:Object.assign({},this.offset),velocity:Object.assign({},this.velocity),event:t,cancel:this.cancel.bind(this)}),this.activePointerId=null,this.pointerCaptured=!1)}cancel(){this.activeEl&&null!==this.activePointerId&&(this.activeEl.releasePointerCapture(this.activePointerId),this.activePointerId=null,this.activeEl=null)}}function Zn(t,i,s,e){const o=Gn(s),r=Gn(e);if(i===window){const s=n();if(!s.current){const n=new t(r.current),i=t=>o.current(Object.assign(Object.assign({},t),{index:0}));n.onChange(i).onEnd(i),s.current=n}return void a((()=>{const t=s.current.attach(window);return()=>{t()}}),[i])}const c=Array.isArray(i)?i:[i],l=n([]),u=n([]),h=n(c.length);l.current.length!==c.length&&(l.current=c.map(((n,i)=>{const s=new t(r.current),e=t=>o.current(Object.assign(Object.assign({},t),{index:i}));return s.onChange(e).onEnd(e),s})),h.current=c.length),a((()=>{u.current.forEach((t=>t())),u.current=[];const t=[];return c.forEach(((n,i)=>{const s=n.current;if(s&&l.current[i]){const n=l.current[i].attach(s);t.push(n)}})),u.current=t,()=>{t.forEach((t=>t())),u.current=[]}}),[c])}function Gn(t){const i=n(t);return a((()=>{i.current=t}),[t]),i}function _n(t,n,i){return Zn(Wn,t,n,i)}class Bn extends Vn{constructor(){super(...arguments),this.attachedEls=new Set,this.prev={x:0,y:0},this.lastTime=0,this.movement={x:0,y:0},this.offset={x:0,y:0},this.velocity={x:0,y:0},this.startPos=null}attach(t){const n=Array.isArray(t)?t:[t],i=this.onMove.bind(this),s=this.onLeave.bind(this);return n.forEach((t=>{this.attachedEls.add(t),t.addEventListener("pointermove",i,{passive:!1}),t.addEventListener("pointerleave",s)})),()=>{n.forEach((t=>{t.removeEventListener("pointermove",i),t.removeEventListener("pointerleave",s),this.attachedEls.delete(t)}))}}cancel(){}onMove(t){const n=t.timeStamp;null===this.startPos&&(this.startPos={x:t.clientX,y:t.clientY},this.prev={x:t.clientX,y:t.clientY},this.lastTime=n);const i=Math.max((n-this.lastTime)/1e3,1e-6);this.lastTime=n;const s=t.clientX-this.prev.x,e=t.clientY-this.prev.y;this.prev={x:t.clientX,y:t.clientY},this.movement={x:t.clientX-this.startPos.x,y:t.clientY-this.startPos.y};const o=t.currentTarget,r=o instanceof HTMLElement?o.getBoundingClientRect():{left:0,top:0};this.offset={x:t.clientX-r.left,y:t.clientY-r.top};const a=s/i/1e3,c=e/i/1e3;this.velocity={x:Q(a,-Vn.VELOCITY_LIMIT,Vn.VELOCITY_LIMIT),y:Q(c,-Vn.VELOCITY_LIMIT,Vn.VELOCITY_LIMIT)},this.emitChange({movement:Object.assign({},this.movement),offset:Object.assign({},this.offset),velocity:Object.assign({},this.velocity),event:t,cancel:()=>this.onLeave(t)})}onLeave(t){this.emitEnd({movement:Object.assign({},this.movement),offset:Object.assign({},this.offset),velocity:Object.assign({},this.velocity),event:t,cancel:()=>{}})}}function Jn(t,n){return Zn(Bn,t,n)}class Kn extends Vn{constructor(){super(...arguments),this.attachedEls=new Set,this.movement={x:0,y:0},this.offset={x:0,y:0},this.velocity={x:0,y:0},this.prevScroll={x:0,y:0},this.lastTime=0}attach(t){const n=Array.isArray(t)?t:[t],i=this.onScroll.bind(this);return n.forEach((t=>{this.attachedEls.add(t),t.addEventListener("scroll",i,{passive:!0})})),()=>{n.forEach((t=>{t.removeEventListener("scroll",i),this.attachedEls.delete(t)})),null!=this.endTimeout&&(clearTimeout(this.endTimeout),this.endTimeout=void 0)}}cancel(){}onScroll(t){const n=Date.now(),i=Math.max((n-this.lastTime)/1e3,1e-6);this.lastTime=n;const s=t.currentTarget,e=s instanceof HTMLElement?s.scrollLeft:window.scrollX,o=s instanceof HTMLElement?s.scrollTop:window.scrollY,r=e-this.prevScroll.x,a=o-this.prevScroll.y;this.prevScroll={x:e,y:o},this.movement={x:r,y:a},this.offset={x:e,y:o};const c=r/i/1e3,l=a/i/1e3;this.velocity={x:Q(c,-Vn.VELOCITY_LIMIT,Vn.VELOCITY_LIMIT),y:Q(l,-Vn.VELOCITY_LIMIT,Vn.VELOCITY_LIMIT)},this.emitChange({movement:Object.assign({},this.movement),offset:Object.assign({},this.offset),velocity:Object.assign({},this.velocity),event:t,cancel:()=>{null!=this.endTimeout&&clearTimeout(this.endTimeout)}}),null!=this.endTimeout&&clearTimeout(this.endTimeout),this.endTimeout=window.setTimeout((()=>{this.emitEnd({movement:Object.assign({},this.movement),offset:Object.assign({},this.offset),velocity:Object.assign({},this.velocity),event:t,cancel:()=>{}})}),150)}}function Qn(t,{target:i,axis:s="y",offset:e=["start start","end end"],animate:o=!0,toDescriptor:r=(t=>_t(t))}={}){const[c,l]=nn(0),[u,h]=nn(0),f=n([0,0]);return a((()=>{var n;const o=t instanceof Window?window:t.current,r=null!==(n=null==i?void 0:i.current)&&void 0!==n?n:document.documentElement;f.current=function([t,n],i,s,e){return[ni(t,i,s,e),ni(n,i,s,e)]}(e,r,o,s)}),[t,i,s,e]),Zn(Kn,t,(t=>{const n="y"===s?t.offset.y:t.offset.x,[i,e]=f.current,a=Math.min(Math.max(e===i?i>n?0:1:(n-i)/(e-i),0),1),c=o?r:t=>t;"y"===s?(l(c(a)),h(0)):(h(c(a)),l(0))})),{scrollYProgress:c,scrollXProgress:u}}function ti(t,n){return t instanceof HTMLElement?"y"===n?t.clientHeight:t.clientWidth:"y"===n?window.innerHeight:window.innerWidth}function ni(t,n,i,s){const[e,o=e]=t.trim().split(/\s+/);if(i instanceof HTMLElement){const t=n.getBoundingClientRect(),r=i.getBoundingClientRect(),a=function(t,n){return t instanceof HTMLElement?"y"===n?t.scrollTop:t.scrollLeft:"y"===n?window.scrollY:window.scrollX}(i,s),c=("y"===s?t.top-r.top:t.left-r.left)+a,l="y"===s?t.height:t.width,u=ti(i,s);return ii(e,c,l,u)-ii(o,0,u,u)}return si(e,s,n,!1)-si(o,s,window,!0)}function ii(t,n,i,s){if("start"===t)return n;if("center"===t)return n+i/2;if("end"===t)return n+i;const e=t.match(/^(-?\d+(?:\.\d+)?)(px|%|vw|vh)?$/);if(!e)throw Error(`Invalid edge marker “${t}”`);const o=parseFloat(e[1]);switch(e[2]){case"px":return n+o;case"%":return n+o/100*i;case"vw":case"vh":return n+o/100*s;default:return n+o*i}}function si(t,n,i,s){const e=i;return ii(t,s?0:(()=>{if(!(i instanceof HTMLElement))throw Error("Expected HTMLElement for element-relative edge");const t=i.getBoundingClientRect(),s="y"===n?window.pageYOffset||window.scrollY:window.pageXOffset||window.scrollX;return("y"===n?t.top:t.left)+s})(),s?ti(i,n):(()=>{if(!(i instanceof HTMLElement))throw Error();const t=i.getBoundingClientRect();return"y"===n?t.height:t.width})(),ti(e,n))}function ei(t,n){return"function"==typeof n?Zn(Kn,t,n):Qn(t,n)}class oi extends Vn{constructor(){super(...arguments),this.attachedEls=new Set,this.movement={x:0,y:0},this.offset={x:0,y:0},this.velocity={x:0,y:0},this.lastTime=0}attach(t){const n=Array.isArray(t)?t:[t],i=this.onWheel.bind(this);return n.forEach((t=>{this.attachedEls.add(t),t.addEventListener("wheel",i,{passive:!1})})),()=>{n.forEach((t=>{t.removeEventListener("wheel",i),this.attachedEls.delete(t)})),null!=this.endTimeout&&(clearTimeout(this.endTimeout),this.endTimeout=void 0)}}cancel(){}onWheel(t){t.preventDefault();const n=t.timeStamp,i=Math.max((n-this.lastTime)/1e3,1e-6);this.lastTime=n;const s=t.deltaX,e=t.deltaY;this.movement={x:s,y:e},this.offset.x+=s,this.offset.y+=e;const o=s/i/1e3,r=e/i/1e3;this.velocity={x:Q(o,-Vn.VELOCITY_LIMIT,Vn.VELOCITY_LIMIT),y:Q(r,-Vn.VELOCITY_LIMIT,Vn.VELOCITY_LIMIT)},this.emitChange({movement:Object.assign({},this.movement),offset:Object.assign({},this.offset),velocity:Object.assign({},this.velocity),event:t,cancel:()=>{null!=this.endTimeout&&clearTimeout(this.endTimeout)}}),null!=this.endTimeout&&clearTimeout(this.endTimeout),this.endTimeout=window.setTimeout((()=>{this.emitEnd({movement:Object.assign({},this.movement),offset:Object.assign({},this.offset),velocity:Object.assign({},this.velocity),event:t,cancel:()=>{}})}),150)}}function ri(t,n){return Zn(oi,t,n)}export{P as AnimateValue,vt as Easing,Yt as Presence,It as PresenceContext,Wt as animate,xn as bounceIn,On as bounceOut,Q as clamp,Zt as combine,ot as decay,kt as delay,Nn as exitFade,Pn as exitScale,Xn as exitSlideDown,Dn as exitSlideUp,sn as fadeIn,rn as fadeInDown,an as fadeInLeft,cn as fadeInRight,on as fadeInUp,en as fadeOut,Sn as flipX,An as flipY,Yn as hoverGlow,Ln as hoverLift,qn as hoverScale,R as isAnimateValue,Ft as loop,Ut as makeAnimated,st as move,Mt as parallel,Hn as pressDown,zn as pressScale,Rn as recipes,jn as rotateIn,Mn as rotateOut,nt as rubberClamp,wn as scaleDown,In as scaleFadeIn,Tn as scaleFadeOut,yn as scaleIn,gn as scaleOut,bn as scaleUp,$t as sequence,En as slideFadeIn,Cn as slideFadeOut,un as slideInDown,hn as slideInLeft,fn as slideInRight,ln as slideInUp,pn as slideOutDown,mn as slideOutLeft,vn as slideOutRight,dn as slideOutUp,it as snapTo,$n as spin,at as spring,bt as timing,Gt as to,_n as useDrag,Pt as useInView,qt as useIsPresent,Jn as useMove,Un as useOutsideClick,Tt as usePresence,Zn as useRecognizer,ei as useScroll,Qn as useScrollProgress,nn as useValue,ri as useWheel,Jt as withDecay,Kt as withDelay,tn as withLoop,Qt as withSequence,_t as withSpring,Bt as withTiming,Fn as zoomIn,kn as zoomOut};
+import {createContext,useRef,useState,useMemo,Children,isValidElement,useLayoutEffect,useEffect,useCallback,useContext,forwardRef,createElement}from'react';import {jsx,Fragment}from'react/jsx-runtime';const SWITCH_THRESHOLD = 0.01;
+const OPTIONAL_KEYWORDS = ['inset', 'normal', 'italic', 'bold', 'thin', 'medium', 'thick'];
+const TRANSFORM_KEYWORDS = ['translate', 'rotate', 'scale', 'skew', 'matrix', 'perspective'];
+// Reduced to the most commonly used named colors; anything else should use hex/rgb/hsl.
+const namedColors = {
+    transparent: '#00000000',
+    black: '#000000ff',
+    white: '#ffffffff',
+    red: '#ff0000ff',
+    green: '#008000ff',
+    blue: '#0000ffff',
+    yellow: '#ffff00ff',
+    cyan: '#00ffffff',
+    magenta: '#ff00ffff',
+    gray: '#808080ff',
+    grey: '#808080ff',
+    darkgray: '#a9a9a9ff',
+    darkgrey: '#a9a9a9ff',
+    lightgray: '#d3d3d3ff',
+    lightgrey: '#d3d3d3ff',
+    dimgray: '#696969ff',
+    dimgrey: '#696969ff',
+    slategray: '#708090ff',
+    slategrey: '#708090ff',
+    darkslategray: '#2f4f4fff',
+    darkslategrey: '#2f4f4fff',
+    orange: '#ffa500ff',
+    purple: '#800080ff',
+    pink: '#ffc0cbff',
+    brown: '#a52a2aff',
+    navy: '#000080ff',
+    teal: '#008080ff',
+    silver: '#c0c0c0ff',
+    gold: '#ffd700ff',
+    aqua: '#00ffffff',
+    fuchsia: '#ff00ffff',
+    lime: '#00ff00ff',
+    maroon: '#800000ff',
+    olive: '#808000ff',
+    rebeccapurple: '#663399ff',
+};
+const numberRE = /-?\d+(\.\d+)?/g;
+const HEX_RE = /^#(?:[0-9a-f]{3}|[0-9a-f]{4}|[0-9a-f]{6}|[0-9a-f]{8})$/i;
+const RGB_RE = /^rgba?\(\s*-?\d+(\.\d+)?%?(?:\s*,\s*-?\d+(\.\d+)?%?){2}(?:\s*,\s*(0|1|0?\.\d+))?\s*\)$/i;
+const HSL_RE = /^hsl\(\s*\d+(\.\d+)?(?:\s*,\s*\d+(\.\d+)?%){2}\s*\)$/i;
+const HSLA_RE = /^hsla\(\s*\d+(\.\d+)?(?:\s*,\s*\d+(\.\d+)?%){2}\s*,\s*(0|1|0?\.\d+)\s*\)$/i;
+const GRADIENT_RE = /^\s*(linear|radial|conic)-gradient\s*\(/i;
+const SIMPLE_FUNC_RE = /^([a-zA-Z$_][\w$]*)\((-?\d*\.?\d+)([a-zA-Z%]*)\)$/;
+const NUM_UNIT_RE = /^(-?\d+(\.\d+)?)([a-zA-Z%]*)$/;
+const TOKEN_RE = /(\s+|[(),])/g;
+function isCssColorLiteral(s) {
+    const c = s.trim().toLowerCase();
+    if (HEX_RE.test(c) || namedColors[c] !== undefined) {
+        return true;
+    }
+    if (RGB_RE.test(c)) {
+        const percentage = c.includes('%');
+        const nums = [...c.matchAll(numberRE)].map((m) => +m[0]);
+        const [r, g, b, a = 1] = nums;
+        if (percentage) {
+            return r >= 0 && r <= 100 && g >= 0 && g <= 100 && b >= 0 && b <= 100 && a >= 0 && a <= 1;
+        }
+        else {
+            return r >= 0 && r <= 255 && g >= 0 && g <= 255 && b >= 0 && b <= 255 && a >= 0 && a <= 1;
+        }
+    }
+    if (HSL_RE.test(c)) {
+        const nums = [...c.matchAll(numberRE)].map((m) => +m[0]);
+        const [h, s, l] = nums;
+        return h >= 0 && h <= 360 && s >= 0 && s <= 100 && l >= 0 && l <= 100;
+    }
+    if (HSLA_RE.test(c)) {
+        const nums = [...c.matchAll(numberRE)].map((m) => +m[0]);
+        const [h, s, l, a] = nums;
+        return (h >= 0 && h <= 360 && s >= 0 && s <= 100 && l >= 0 && l <= 100 && a >= 0 && a <= 1);
+    }
+    return false;
+}
+function parseCssColor(c) {
+    let color = c.trim().toLowerCase();
+    if (namedColors[color])
+        color = namedColors[color];
+    if (HEX_RE.test(color)) {
+        let hex = color.slice(1);
+        if (hex.length === 3)
+            hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
+        else if (hex.length === 4)
+            hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2] + hex[3] + hex[3];
+        const hasA = hex.length === 8;
+        const v = parseInt(hex, 16);
+        const r = (v >> (hasA ? 24 : 16)) & 0xff;
+        const g = (v >> (hasA ? 16 : 8)) & 0xff;
+        const b = (v >> (hasA ? 8 : 0)) & 0xff;
+        const a = hasA ? (v & 0xff) / 255 : 1;
+        return [r, g, b, a];
+    }
+    if (RGB_RE.test(color)) {
+        const percentage = color.includes('%');
+        const nums = [...color.matchAll(numberRE)].map((m) => +m[0]);
+        let [r, g, b, a = 1] = nums;
+        if (percentage) {
+            r = Math.round((r / 100) * 255);
+            g = Math.round((g / 100) * 255);
+            b = Math.round((b / 100) * 255);
+        }
+        return [r, g, b, a];
+    }
+    const hslaMatch = color.match(/hsla?\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)%\s*,\s*(\d+(?:\.\d+)?)%\s*(?:,\s*(\d+(?:\.\d+)?))?\s*\)/i);
+    if (hslaMatch) {
+        const h = parseFloat(hslaMatch[1]) % 360;
+        const s = parseFloat(hslaMatch[2]) / 100;
+        const l = parseFloat(hslaMatch[3]) / 100;
+        const a = hslaMatch[4] !== undefined ? parseFloat(hslaMatch[4]) : 1;
+        const [r, g, b] = hslToRgb(h, s, l);
+        return [r, g, b, a];
+    }
+    throw new Error(`Unrecognized CSS color: ${c}`);
+}
+function hslToRgb(h, s, l) {
+    const C = (1 - Math.abs(2 * l - 1)) * s;
+    const X = C * (1 - Math.abs(((h / 60) % 2) - 1));
+    const m = l - C / 2;
+    let r = 0, g = 0, b = 0;
+    if (h >= 0 && h < 60)
+        [r, g, b] = [C, X, 0];
+    else if (h >= 60 && h < 120)
+        [r, g, b] = [X, C, 0];
+    else if (h >= 120 && h < 180)
+        [r, g, b] = [0, C, X];
+    else if (h >= 180 && h < 240)
+        [r, g, b] = [0, X, C];
+    else if (h >= 240 && h < 300)
+        [r, g, b] = [X, 0, C];
+    else if (h >= 300 && h < 360)
+        [r, g, b] = [C, 0, X];
+    return [
+        Math.round((r + m) * 255),
+        Math.round((g + m) * 255),
+        Math.round((b + m) * 255),
+    ];
+}
+function replaceCssColorsWithRgba(input) {
+    const hex = `#(?:[0-9A-Fa-f]{3,4}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})\\b`;
+    const rgbFunc = `rgba?\\([^)]*\\)`;
+    const hslFunc = `hsla?\\([^)]*\\)`;
+    const named = Object.keys(namedColors)
+        .map((n) => n.replace(/[-\\^$*+?.()|[\]{}]/g, '\\$&'))
+        .join('|');
+    const colorRe = new RegExp(`(${hex}|${rgbFunc}|${hslFunc}|\\b(?:${named})\\b)`, 'gi');
+    return input.replace(colorRe, (match) => {
+        try {
+            const [r, g, b, a] = parseCssColor(match);
+            const R = Math.round(r);
+            const G = Math.round(g);
+            const B = Math.round(b);
+            const A = parseFloat(a.toFixed(3)).toString();
+            return `rgba(${R},${G},${B},${A})`;
+        }
+        catch {
+            return match;
+        }
+    });
+}
+function formatNumber(val) {
+    let s = val.toFixed(3);
+    return s.replace(/\.?0+$/, '');
+}
+function hasListComma(str) {
+    if (!str.includes(','))
+        return false;
+    if (!str.includes('(') && !str.includes(')'))
+        return true;
+    if (/\)\s*,/.test(str))
+        return true;
+    let parenDepth = 0;
+    for (let i = 0; i < str.length; i++) {
+        if (str[i] === '(')
+            parenDepth++;
+        else if (str[i] === ')')
+            parenDepth--;
+        else if (str[i] === ',' && parenDepth === 0)
+            return true;
+    }
+    return false;
+}
+function splitByListCommas(str) {
+    if (!str.includes(','))
+        return [str];
+    const result = [];
+    let current = '';
+    let parenDepth = 0;
+    for (let i = 0; i < str.length; i++) {
+        const char = str[i];
+        if (char === '(') {
+            parenDepth++;
+            current += char;
+        }
+        else if (char === ')') {
+            parenDepth--;
+            current += char;
+        }
+        else if (char === ',' && parenDepth === 0) {
+            result.push(current.trim());
+            current = '';
+        }
+        else {
+            current += char;
+        }
+    }
+    if (current.trim()) {
+        result.push(current.trim());
+    }
+    return result.length > 0 ? result : [str];
+}
+function extractGradientContent(str) {
+    const match = str.match(GRADIENT_RE);
+    if (!match)
+        return null;
+    const type = match[1].toLowerCase();
+    const startIdx = match[0].length;
+    let depth = 1;
+    let endIdx = startIdx;
+    for (let i = startIdx; i < str.length && depth > 0; i++) {
+        if (str[i] === '(')
+            depth++;
+        else if (str[i] === ')')
+            depth--;
+        if (depth === 0) {
+            endIdx = i;
+            break;
+        }
+    }
+    if (depth !== 0)
+        return null;
+    return { type, content: str.substring(startIdx, endIdx) };
+}
+function parseGradientParams(content) {
+    let parenDepth = 0;
+    let firstCommaIdx = -1;
+    for (let i = 0; i < content.length; i++) {
+        if (content[i] === '(')
+            parenDepth++;
+        else if (content[i] === ')')
+            parenDepth--;
+        else if (content[i] === ',' && parenDepth === 0) {
+            firstCommaIdx = i;
+            break;
+        }
+    }
+    if (firstCommaIdx === -1) {
+        return { firstParam: '', colorStops: content.trim() };
+    }
+    return {
+        firstParam: content.substring(0, firstCommaIdx).trim(),
+        colorStops: content.substring(firstCommaIdx + 1).trim(),
+    };
+}
+function isTransform(str) {
+    return TRANSFORM_KEYWORDS.some((keyword) => str.toLowerCase().includes(keyword));
+}
+function hasDifferentTransformFormats(fromStr, toStr) {
+    if (!isTransform(fromStr) || !isTransform(toStr))
+        return false;
+    const fromParts = fromStr.split(TOKEN_RE).filter((s) => s !== '');
+    const toParts = toStr.split(TOKEN_RE).filter((s) => s !== '');
+    if (fromParts.length !== toParts.length)
+        return true;
+    const fromHasMatrix = fromStr.toLowerCase().includes('matrix');
+    const toHasMatrix = toStr.toLowerCase().includes('matrix');
+    const fromHasIndividual = ['translate', 'rotate', 'scale', 'skew'].some((k) => fromStr.toLowerCase().includes(k));
+    const toHasIndividual = ['translate', 'rotate', 'scale', 'skew'].some((k) => toStr.toLowerCase().includes(k));
+    return (fromHasMatrix && toHasIndividual) || (toHasMatrix && fromHasIndividual);
+}
+function canSwitchFunctionNames(fromStr, toStr) {
+    const fromGradient = fromStr.match(GRADIENT_RE);
+    const toGradient = toStr.match(GRADIENT_RE);
+    if (fromGradient && toGradient)
+        return true;
+    return hasDifferentTransformFormats(fromStr, toStr);
+}
+function interpolateCommaSeparatedList(fromStr, toStr, p) {
+    const fromList = splitByListCommas(fromStr);
+    const toList = splitByListCommas(toStr);
+    const maxLen = Math.max(fromList.length, toList.length);
+    const result = [];
+    for (let i = 0; i < maxLen; i++) {
+        const fromItem = fromList[i] || fromList[fromList.length - 1] || fromList[0];
+        const toItem = toList[i] || toList[toList.length - 1] || toList[0];
+        result.push(interpolateString(fromItem, toItem, p));
+    }
+    return result.join(', ');
+}
+function convertRgbToRgba(str) {
+    return str.replace(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/g, 'rgba($1,$2,$3,1.000)');
+}
+function interpolateGradients(fromGradient, toGradient, p) {
+    const gradientType = p < SWITCH_THRESHOLD ? fromGradient.type : toGradient.type;
+    const fromParams = parseGradientParams(fromGradient.content);
+    const toParams = parseGradientParams(toGradient.content);
+    let firstParam;
+    if (fromGradient.type === toGradient.type) {
+        if (fromParams.firstParam && toParams.firstParam) {
+            try {
+                firstParam = interpolateString(fromParams.firstParam, toParams.firstParam, p);
+            }
+            catch {
+                firstParam = p < SWITCH_THRESHOLD ? fromParams.firstParam : toParams.firstParam;
+            }
+        }
+        else {
+            firstParam = p < SWITCH_THRESHOLD ? fromParams.firstParam : toParams.firstParam;
+        }
+    }
+    else {
+        firstParam = p < SWITCH_THRESHOLD ? fromParams.firstParam : toParams.firstParam;
+    }
+    const colorStops = interpolateString(fromParams.colorStops, toParams.colorStops, p);
+    const normalizedColorStops = convertRgbToRgba(colorStops);
+    const content = firstParam ? `${firstParam}, ${normalizedColorStops}` : normalizedColorStops;
+    return `${gradientType}-gradient(${content})`;
+}
+function interpolateWithFunctionNameSwitch(fromStr, toStr, p) {
+    const fromGradient = extractGradientContent(fromStr);
+    const toGradient = extractGradientContent(toStr);
+    if (fromGradient && toGradient) {
+        return interpolateGradients(fromGradient, toGradient, p);
+    }
+    if (fromGradient || toGradient) {
+        return p < SWITCH_THRESHOLD ? fromStr : toStr;
+    }
+    if (hasDifferentTransformFormats(fromStr, toStr)) {
+        return p < SWITCH_THRESHOLD ? fromStr : toStr;
+    }
+    return p < SWITCH_THRESHOLD ? fromStr : toStr;
+}
+// box-shadow/text-shadow pattern: [keyword]? offsetX offsetY blur [spread]? color
+// (both the 3-value and 4-value forms).
+function parseBoxShadow(shadow) {
+    const shadowMatch = shadow.match(/^(\S+\s+)?(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?(?:\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?)?\s+(.+)$/);
+    if (shadowMatch) {
+        const keyword = shadowMatch[1] || '';
+        const values = [];
+        if (shadowMatch[2]) {
+            values.push({ num: shadowMatch[2], unit: shadowMatch[3] || '' }); // offsetX
+        }
+        if (shadowMatch[4]) {
+            values.push({ num: shadowMatch[4], unit: shadowMatch[5] || '' }); // offsetY
+        }
+        if (shadowMatch[6]) {
+            values.push({ num: shadowMatch[6], unit: shadowMatch[7] || '' }); // blur
+        }
+        if (shadowMatch[8]) {
+            values.push({ num: shadowMatch[8], unit: shadowMatch[9] || '' }); // spread (optional)
+        }
+        const color = shadowMatch[10];
+        return { keyword, values, color };
+    }
+    return null;
+}
+// e.g. "0 4px 12px rgba(0,0,0,0.3)" -> "0 0px 0px rgba(0,0,0,0)", preserving
+// each value's exact unit (including "no unit" for the first value).
+function createZeroValueFromTarget(target) {
+    const parsed = parseBoxShadow(target);
+    if (parsed) {
+        const { keyword, values, color } = parsed;
+        const zeroValues = values.map(v => (v.unit ? `0${v.unit}` : '0'));
+        const zeroColor = color.replace(/rgba?\([^)]+\)/gi, (match) => {
+            if (match.toLowerCase().includes('rgba')) {
+                return 'rgba(0,0,0,0)';
+            }
+            else if (match.toLowerCase().includes('rgb')) {
+                return 'rgba(0,0,0,0)';
+            }
+            return match;
+        });
+        return `${keyword}${zeroValues.join(' ')} ${zeroColor}`;
+    }
+    return '';
+}
+function interpolateString(fromStr, toStr, p) {
+    if (!fromStr || fromStr.trim() === '') {
+        const zeroFrom = createZeroValueFromTarget(toStr);
+        if (zeroFrom) {
+            return interpolateString(zeroFrom, toStr, p);
+        }
+        if (p >= SWITCH_THRESHOLD) {
+            return toStr;
+        }
+        return fromStr || '';
+    }
+    // Animating to an empty string fades through a zero-value version first,
+    // then fades that to nothing, instead of just switching at the threshold —
+    // so e.g. a box-shadow shrinks to zero-size before disappearing.
+    if (!toStr || toStr.trim() === '') {
+        const zeroTo = createZeroValueFromTarget(fromStr);
+        if (zeroTo) {
+            const zeroResult = interpolateString(fromStr, zeroTo, Math.min(p * 2, 1));
+            if (p >= 0.5) {
+                const emptyProgress = (p - 0.5) * 2; // 0 to 1 from 0.5 to 1.0
+                // Fade the zero version to empty by checking if values are close to zero
+                const zeroMatch = zeroResult.match(/^(\S+\s+)?(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(-?\d+(?:\.\d+)?)(px|rem|em|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)?\s+(.+)$/);
+                if (zeroMatch) {
+                    const x = Math.abs(parseFloat(zeroMatch[2]));
+                    const y = Math.abs(parseFloat(zeroMatch[4]));
+                    const z = Math.abs(parseFloat(zeroMatch[6]));
+                    const colorMatch = zeroMatch[8].match(/rgba?\((\d+),\s*(\d+),\s*(\d+),\s*([-\d.]+)\)/);
+                    const alpha = colorMatch ? Math.abs(parseFloat(colorMatch[4])) : 0;
+                    // If all values are close to zero and progress is high, return empty
+                    if (x < 0.01 && y < 0.01 && z < 0.01 && alpha < 0.01 && emptyProgress > 0.9) {
+                        return '';
+                    }
+                }
+                return zeroResult;
+            }
+            return zeroResult;
+        }
+        if (p < SWITCH_THRESHOLD) {
+            return fromStr;
+        }
+        return toStr || '';
+    }
+    const m1 = fromStr.match(SIMPLE_FUNC_RE);
+    const m2 = toStr.match(SIMPLE_FUNC_RE);
+    if (m1 && m2 && m1[1] === m2[1] && m1[3] === m2[3]) {
+        const val = parseFloat(m1[2]) + (parseFloat(m2[2]) - parseFloat(m1[2])) * p;
+        return `${m1[1]}(${formatNumber(val)}${m1[3]})`;
+    }
+    if (isCssColorLiteral(fromStr) && isCssColorLiteral(toStr)) {
+        const [r1, g1, b1, a1] = parseCssColor(fromStr);
+        const [r2, g2, b2, a2] = parseCssColor(toStr);
+        const R = Math.round(r1 + (r2 - r1) * p);
+        const G = Math.round(g1 + (g2 - g1) * p);
+        const B = Math.round(b1 + (b2 - b1) * p);
+        const A = a1 + (a2 - a1) * p;
+        const formattedAlpha = formatNumber(A);
+        return A < 1 ? `rgba(${R},${G},${B},${formattedAlpha})` : `rgb(${R},${G},${B})`;
+    }
+    const fromGradient = fromStr.trim().match(GRADIENT_RE);
+    const toGradient = toStr.trim().match(GRADIENT_RE);
+    if (fromGradient || toGradient) {
+        return interpolateWithFunctionNameSwitch(fromStr.trim(), toStr.trim(), p);
+    }
+    if (hasDifferentTransformFormats(fromStr, toStr)) {
+        return interpolateWithFunctionNameSwitch(fromStr, toStr, p);
+    }
+    if ((fromStr.includes(',') || toStr.includes(',')) && (hasListComma(fromStr) || hasListComma(toStr))) {
+        return interpolateCommaSeparatedList(fromStr, toStr, p);
+    }
+    // Optional leading keywords (e.g., "inset" in box-shadow)
+    const fromWords = fromStr.trim().split(/\s+/);
+    const toWords = toStr.trim().split(/\s+/);
+    const fromFirstWord = fromWords[0]?.toLowerCase();
+    const toFirstWord = toWords[0]?.toLowerCase();
+    const fromHasKeyword = fromFirstWord && OPTIONAL_KEYWORDS.includes(fromFirstWord);
+    const toHasKeyword = toFirstWord && OPTIONAL_KEYWORDS.includes(toFirstWord);
+    if (fromHasKeyword || toHasKeyword) {
+        const keyword = p < SWITCH_THRESHOLD
+            ? (fromHasKeyword ? fromFirstWord : '')
+            : (toHasKeyword ? toFirstWord : '');
+        const fromRest = fromHasKeyword ? fromWords.slice(1).join(' ') : fromStr;
+        const toRest = toHasKeyword ? toWords.slice(1).join(' ') : toStr;
+        const rest = interpolateString(fromRest, toRest, p);
+        return keyword ? `${keyword} ${rest}` : rest;
+    }
+    // box-shadow/text-shadow can be 3-value (offsetX offsetY blur color) or
+    // 4-value (...+ spread) — normalize both sides to the max value count
+    // (padding a missing spread with 0) before interpolating value-by-value.
+    const fromShadow = parseBoxShadow(fromStr);
+    const toShadow = parseBoxShadow(toStr);
+    if (fromShadow && toShadow) {
+        const maxValues = Math.max(fromShadow.values.length, toShadow.values.length);
+        const normalizeShadow = (shadow, targetLength) => {
+            if (!shadow)
+                return null;
+            const { keyword, values, color } = shadow;
+            if (values.length === 3 && targetLength === 4) {
+                const blurUnit = values[2].unit || 'px';
+                return { keyword, values: [...values, { num: '0', unit: blurUnit }], color };
+            }
+            return { keyword, values, color };
+        };
+        const normalizedFrom = normalizeShadow(fromShadow, maxValues);
+        const normalizedTo = normalizeShadow(toShadow, maxValues);
+        if (normalizedFrom && normalizedTo) {
+            const interpolatedValues = normalizedFrom.values.map((fromVal, i) => {
+                const toVal = normalizedTo.values[i];
+                if (!toVal)
+                    return fromVal;
+                if (fromVal.unit === toVal.unit) {
+                    const fromNum = parseFloat(fromVal.num);
+                    const toNum = parseFloat(toVal.num);
+                    const interpolated = fromNum + (toNum - fromNum) * p;
+                    return { num: formatNumber(interpolated), unit: fromVal.unit };
+                }
+                return p < SWITCH_THRESHOLD ? fromVal : toVal;
+            });
+            let interpolatedColor = normalizedFrom.color;
+            if (normalizedFrom.color !== normalizedTo.color) {
+                try {
+                    interpolatedColor = interpolateString(normalizedFrom.color, normalizedTo.color, p);
+                }
+                catch {
+                    interpolatedColor = p < SWITCH_THRESHOLD ? normalizedFrom.color : normalizedTo.color;
+                }
+            }
+            const keyword = p < SWITCH_THRESHOLD
+                ? (normalizedFrom.keyword || normalizedTo.keyword)
+                : (normalizedTo.keyword || normalizedFrom.keyword);
+            // Only 4-value output if either original side actually had a spread —
+            // don't leak the padding added above back into a 3-value result.
+            const shouldIncludeSpread = maxValues === 4;
+            const valuesToOutput = shouldIncludeSpread
+                ? interpolatedValues
+                : interpolatedValues.slice(0, 3);
+            const valuesStr = valuesToOutput.map(v => v.unit ? `${v.num}${v.unit}` : v.num).join(' ');
+            return `${keyword}${valuesStr} ${interpolatedColor}`;
+        }
+    }
+    const fromParts = fromStr.split(TOKEN_RE).filter((s) => s !== '');
+    const toParts = toStr.split(TOKEN_RE).filter((s) => s !== '');
+    if (fromParts.length !== toParts.length) {
+        if (canSwitchFunctionNames(fromStr, toStr)) {
+            return interpolateWithFunctionNameSwitch(fromStr, toStr, p);
+        }
+        throw new Error(`interpolate: template mismatch:\n  "${fromStr}"\n  vs "${toStr}"`);
+    }
+    const mappers = fromParts.map((fp, i) => {
+        const tp = toParts[i];
+        if (fp === tp && /\s+/.test(fp))
+            return () => fp;
+        const n1 = fp.match(NUM_UNIT_RE);
+        const n2 = tp.match(NUM_UNIT_RE);
+        if (n1 && n2 && n1[3] === n2[3]) {
+            const val = parseFloat(n1[1]) + (parseFloat(n2[1]) - parseFloat(n1[1])) * p;
+            return () => `${formatNumber(val)}${n1[3]}`;
+        }
+        if (isCssColorLiteral(fp) && isCssColorLiteral(tp)) {
+            return () => interpolateString(fp, tp, p);
+        }
+        if (fp === tp)
+            return () => fp;
+        // CSS keyword switching (e.g., "solid" vs "dashed")
+        const isSimpleWord = /^[a-zA-Z-]+$/.test(fp) && /^[a-zA-Z-]+$/.test(tp);
+        if (isSimpleWord) {
+            const isFunctionName = (i + 1 < fromParts.length && fromParts[i + 1] === '(') ||
+                (i + 1 < toParts.length && toParts[i + 1] === '(');
+            if (!isFunctionName) {
+                return () => (p < SWITCH_THRESHOLD ? fp : tp);
+            }
+        }
+        throw new Error(`interpolate: cannot interpolate tokens "${fp}" vs "${tp}"`);
+    });
+    return mappers.map((fn) => fn()).join('');
+}
+function to$1(inRange, outRange, config) {
+    const len = inRange.length;
+    if (len < 2 || outRange.length !== len) {
+        throw new Error('interpolate: inRange and outRange must be arrays of the same length >= 2');
+    }
+    const extrapolateLeft = config?.extrapolateLeft ?? config?.extrapolate ?? 'extend';
+    const extrapolateRight = config?.extrapolateRight ?? config?.extrapolate ?? 'extend';
+    const sanitizedOut = outRange.map((v) => typeof v === 'string' ? replaceCssColorsWithRgba(v) : v);
+    return (tRaw) => {
+        let t = tRaw;
+        if (tRaw < inRange[0] && extrapolateLeft === 'clamp') {
+            t = inRange[0];
+        }
+        else if (tRaw > inRange[len - 1] && extrapolateRight === 'clamp') {
+            t = inRange[len - 1];
+        }
+        let i = 0;
+        if (t <= inRange[0]) {
+            i = 0;
+        }
+        else if (t >= inRange[len - 1]) {
+            i = len - 2;
+        }
+        else {
+            for (let j = 0; j < len - 1; j++) {
+                if (t >= inRange[j] && t <= inRange[j + 1]) {
+                    i = j;
+                    break;
+                }
+            }
+        }
+        const t0 = inRange[i];
+        const t1 = inRange[i + 1];
+        let p = (t - t0) / (t1 - t0);
+        if (config?.easing)
+            p = config.easing(p);
+        const fromOut = sanitizedOut[i];
+        const toOut = sanitizedOut[i + 1];
+        if (typeof fromOut === 'number' && typeof toOut === 'number') {
+            return fromOut + (toOut - fromOut) * p;
+        }
+        return interpolateString(String(fromOut), String(toOut), p);
+    };
+}
+// combine function moved to utils/combine.ts to avoid circular dependency
+class AnimateValue {
+    constructor(initial) {
+        this.subscribers = new Set();
+        this._current = initial;
+        this._initial = initial;
+    }
+    get current() {
+        return this._current;
+    }
+    get initial() {
+        return this._initial;
+    }
+    set(value) {
+        this.controller?.cancel();
+        this.controller = undefined;
+        this._internalSet(value);
+    }
+    /**
+     * @internal only use internally
+     */
+    _internalSet(value) {
+        if (value === this._current)
+            return;
+        this._current = value;
+        for (const sub of this.subscribers)
+            sub(value);
+    }
+    subscribe(fn) {
+        this.subscribers.add(fn);
+        fn(this._current);
+        return () => {
+            this.subscribers.delete(fn);
+        };
+    }
+    reset() {
+        this.set(this._initial);
+    }
+    destroy() {
+        this.subscribers.clear();
+        this.controller?.cancel();
+        this.controller = undefined;
+    }
+    to(arg1, arg2, arg3) {
+        if (typeof arg1 === 'function') {
+            const mapFn = arg1;
+            const output = new AnimateValue(mapFn(this._current));
+            this.subscribe((value) => output.set(mapFn(value)));
+            return output;
+        }
+        const inRange = arg1;
+        const outRange = arg2;
+        const config = arg3;
+        const mapValue = to$1(inRange, outRange, config);
+        const output = new AnimateValue(mapValue(this.current));
+        this.subscribe((value) => output.set(mapValue(value)));
+        return output;
+    }
+    setAnimationController(controller) {
+        this.controller?.cancel();
+        this.controller = controller;
+    }
+    getAnimationController() {
+        return this.controller;
+    }
+}
+function isAnimateValue(value) {
+    return value instanceof AnimateValue;
+}const UNIT_LESS = new Set([
+    'borderImageOutset',
+    'borderImageSlice',
+    'borderImageWidth',
+    'fontWeight',
+    'lineHeight',
+    'opacity',
+    'orphans',
+    'tabSize',
+    'widows',
+    'zIndex',
+    'zoom',
+    'fillOpacity',
+    'floodOpacity',
+    'stopOpacity',
+    'strokeDasharray',
+    'strokeDashoffset',
+    'strokeMiterlimit',
+    'strokeOpacity',
+    'strokeWidth',
+    'animationIterationCount',
+    'boxFlex',
+    'boxFlexGroup',
+    'boxOrdinalGroup',
+    'columnCount',
+    'flex',
+    'flexGrow',
+    'flexPositive',
+    'flexShrink',
+    'flexNegative',
+    'flexOrder',
+    'gridRow',
+    'gridColumn',
+    'order',
+    'lineClamp',
+]);
+const transformKeys = [
+    'translateX',
+    'translateY',
+    'translateZ',
+    'rotate',
+    'rotateX',
+    'rotateY',
+    'rotateZ',
+    'scale',
+    'scaleX',
+    'scaleY',
+    'skewX',
+    'skewY',
+    'perspective',
+];
+// Internal-only pseudo transform keys reserved for the `layout` prop's own
+// translate/scale contribution. They're stored under these distinct object
+// keys (instead of e.g. "translateX") specifically so they never overwrite a
+// same-named transform the consumer is animating via `animate`/`hover`/
+// `press`/`view`/`style` on the same element — both contributions compose as
+// separate CSS transform functions in the final string instead.
+const LAYOUT_TRANSFORM_KEY_TO_CSS_FUNCTION = {
+    __layoutTranslateX: 'translateX',
+    __layoutTranslateY: 'translateY',
+    __layoutScaleX: 'scaleX',
+    __layoutScaleY: 'scaleY',
+    // Separate namespace for the `layoutId` shared transition's own FLIP
+    // contribution, so it can never collide with the `layout` prop's pseudo
+    // keys above if both happen to be set on the same element.
+    __layoutIdTranslateX: 'translateX',
+    __layoutIdTranslateY: 'translateY',
+    __layoutIdScaleX: 'scaleX',
+    __layoutIdScaleY: 'scaleY',
+};
+// Internal function - exported for testing only (not re-exported from main index)
+function applyStyleProp(el, key, v) {
+    const css = typeof v === 'number' && !UNIT_LESS.has(key) ? `${v}px` : String(v);
+    el.style[key] = css;
+}
+function splitCSSValueAndUnit(raw) {
+    const numMatch = raw.match(/-?\d+(\.\d+)?/)?.[0] ?? '0';
+    const unitMatch = raw.match(/px|rem|em|ex|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax/)?.[0] ?? '';
+    return { value: Number(numMatch), unit: unitMatch };
+}
+function defaultUnit(key) {
+    if (key === 'perspective' || key.startsWith('translate'))
+        return 'px';
+    if (key.startsWith('rotate') || key.startsWith('skew'))
+        return 'deg';
+    return '';
+}
+function formatTransformFunction(key, raw) {
+    const cssFunction = LAYOUT_TRANSFORM_KEY_TO_CSS_FUNCTION[key] ??
+        key;
+    const cur = raw && typeof raw.subscribe === 'function'
+        ? raw.current
+        : raw;
+    if (Array.isArray(cur)) {
+        return `${cssFunction}(${cur.join(',')})`;
+    }
+    const str = String(cur);
+    const { value, unit: parsedUnit } = splitCSSValueAndUnit(str);
+    const unit = parsedUnit || defaultUnit(cssFunction);
+    return `${cssFunction}(${value}${unit})`;
+}
+// Internal function - exported for internal use only
+function isTransformKey(key) {
+    return (transformKeys.includes(key) ||
+        key in LAYOUT_TRANSFORM_KEY_TO_CSS_FUNCTION);
+}
+// Formats an already-merged style/animateValues object (values may be raw
+// primitives or AnimateValue instances) into a single CSS transform string.
+// Exported so systems that manage their own transform rendering (e.g. the
+// `layout` prop) can compose with whatever else is contributing transforms
+// to the same element.
+function formatTransformString(txProps) {
+    const transformKeyList = Object.keys(txProps).filter(isTransformKey);
+    if (transformKeyList.length > 0) {
+        return transformKeyList
+            .map((key) => formatTransformFunction(key, txProps[key]))
+            .join(' ');
+    }
+    if (typeof txProps.transform === 'string')
+        return txProps.transform;
+    return '';
+}
+// Internal function - exported for testing only (not re-exported from main index)
+function applyTransformsStyle(node, txProps) {
+    const transformKeyList = Object.keys(txProps).filter(isTransformKey);
+    const hasTransformKeys = transformKeyList.length > 0;
+    const render = () => {
+        if (hasTransformKeys) {
+            const parts = transformKeyList.map((key) => formatTransformFunction(key, txProps[key]));
+            node.style.transform = parts.join(' ');
+        }
+        else if (typeof txProps.transform === 'string') {
+            node.style.transform = txProps.transform;
+        }
+    };
+    render();
+    const unsubs = [];
+    if (hasTransformKeys) {
+        for (const key of transformKeyList) {
+            const value = txProps[key];
+            if (value &&
+                typeof value.subscribe === 'function') {
+                unsubs.push(value.subscribe(render));
+            }
+        }
+    }
+    return unsubs;
+}
+function applyStyles(node, style) {
+    const subscriptions = [];
+    for (const [key, value] of Object.entries(style)) {
+        if (isAnimateValue(value)) {
+            subscriptions.push(value.subscribe((v) => applyStyleProp(node, key, v)));
+        }
+        else {
+            applyStyleProp(node, key, value);
+        }
+    }
+    return subscriptions;
+}
+function applyAttrs(node, props) {
+    const subscriptions = [];
+    for (const [key, value] of Object.entries(props)) {
+        const setBool = (v) => {
+            if (v)
+                node.setAttribute(key, '');
+            else
+                node.removeAttribute(key);
+        };
+        const setOther = (v) => {
+            node.setAttribute(key, String(v));
+        };
+        if (isAnimateValue(value)) {
+            subscriptions.push(value.subscribe((v) => {
+                if (typeof v === 'boolean')
+                    setBool(v);
+                else if (typeof v === 'string')
+                    setOther(v);
+                else if (typeof v === 'number')
+                    setOther(v);
+                else
+                    node.removeAttribute(key);
+            }));
+        }
+        else {
+            if (typeof value === 'boolean')
+                setBool(value);
+            else if (typeof value === 'string')
+                setOther(value);
+            else if (typeof value === 'number')
+                setOther(value);
+        }
+    }
+    return subscriptions;
+}
+function applyTransforms(elRef, txProps) {
+    return applyTransformsStyle(elRef, txProps);
+}
+function createTransformRenderer(node, animateValues) {
+    return () => {
+        const transformKeyList = Object.keys(animateValues).filter(isTransformKey);
+        if (transformKeyList.length > 0) {
+            const parts = transformKeyList.map((key) => formatTransformFunction(key, animateValues[key]));
+            node.style.transform = parts.join(' ');
+        }
+    };
+}function clamp(value, lowerbound, upperbound) {
+    return Math.min(Math.max(value, lowerbound), upperbound);
+}
+function rubber2(distanceFromEdge, constant) {
+    return Math.pow(distanceFromEdge, constant * 5);
+}
+function rubber(distanceFromEdge, dimension, constant) {
+    if (dimension === 0 || Math.abs(dimension) === Infinity)
+        return rubber2(distanceFromEdge, constant);
+    return ((distanceFromEdge * dimension * constant) /
+        (dimension + constant * distanceFromEdge));
+}
+function rubberClamp(value, lowerbound, upperbound, constant = 0.15) {
+    if (constant === 0)
+        return clamp(value, lowerbound, upperbound);
+    if (value < lowerbound) {
+        return (-rubber(lowerbound - value, upperbound - lowerbound, constant) +
+            lowerbound);
+    }
+    if (value > upperbound) {
+        return (+rubber(value - upperbound, upperbound - lowerbound, constant) +
+            upperbound);
+    }
+    return value;
+}
+function snapTo(value, velocity, snapPoints) {
+    const finalValue = value + velocity * 0.2;
+    const getDiff = (point) => Math.abs(point - finalValue);
+    const deltas = snapPoints.map(getDiff);
+    const minDelta = Math.min(...deltas);
+    return snapPoints.reduce(function (acc, point) {
+        if (getDiff(point) === minDelta) {
+            return point;
+        }
+        else {
+            return acc;
+        }
+    });
+}
+function move(array, moveIndex, toIndex) {
+    const item = array[moveIndex];
+    const length = array.length;
+    const diff = moveIndex - toIndex;
+    if (diff > 0) {
+        return [
+            ...array.slice(0, toIndex),
+            item,
+            ...array.slice(toIndex, moveIndex),
+            ...array.slice(moveIndex + 1, length),
+        ];
+    }
+    else if (diff < 0) {
+        const targetIndex = toIndex + 1;
+        return [
+            ...array.slice(0, moveIndex),
+            ...array.slice(moveIndex + 1, targetIndex),
+            item,
+            ...array.slice(targetIndex, length),
+        ];
+    }
+    return array;
+}class DecayController {
+    constructor(value, velocity, deceleration, hooks) {
+        this.value = value;
+        this.velocity = velocity;
+        this.deceleration = deceleration;
+        this.hooks = hooks;
+        this.restSpeed = 0.01;
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.pausedAt = 0;
+        this.animate = (now) => {
+            if (this.isCancelled || this.isPaused)
+                return;
+            const elapsed = now - this.startTime;
+            const k = 1 - this.deceleration;
+            const currentVelocity = this.velocity * Math.exp(-k * elapsed);
+            this.position =
+                this.from + (this.velocity / k) * (1 - Math.exp(-k * elapsed));
+            if (this.clampBounds) {
+                const [min, max] = this.clampBounds;
+                if (this.elasticConstant !== undefined) {
+                    this.position = rubberClamp(this.position, min, max, this.elasticConstant);
+                }
+                else {
+                    if (this.position < min) {
+                        this.position = min;
+                    }
+                    else if (this.position > max) {
+                        this.position = max;
+                    }
+                }
+            }
+            this.value._internalSet(this.position);
+            this.hooks.onChange?.(this.position);
+            if (Math.abs(currentVelocity) > this.restSpeed) {
+                this.frameId = requestAnimationFrame(this.animate);
+            }
+            else {
+                cancelAnimationFrame(this.frameId);
+                this.hooks.onChange?.(this.position);
+                this.hooks.onComplete?.();
+            }
+        };
+        this.clampBounds = hooks.clamp;
+        if (hooks.elastic === true) {
+            this.elasticConstant = 0.15;
+        }
+        else if (typeof hooks.elastic === 'number') {
+            this.elasticConstant = hooks.elastic;
+        }
+    }
+    start() {
+        const previous = this.value.getAnimationController();
+        if (previous instanceof DecayController) {
+            this.velocity = previous.velocity;
+            this.deceleration = previous.deceleration;
+        }
+        this.hooks.onStart?.();
+        this.value.setAnimationController(this);
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.from = this.position = this.value.current;
+        this.startTime = performance.now();
+        this.frameId = requestAnimationFrame(this.animate);
+    }
+    pause() {
+        if (this.isCancelled || this.isPaused)
+            return;
+        this.isPaused = true;
+        this.pausedAt = performance.now();
+        cancelAnimationFrame(this.frameId);
+        this.hooks.onPause?.();
+    }
+    resume() {
+        if (this.isCancelled || !this.isPaused)
+            return;
+        const now = performance.now();
+        this.startTime += now - this.pausedAt;
+        this.isPaused = false;
+        this.hooks.onResume?.();
+        this.frameId = requestAnimationFrame(this.animate);
+    }
+    cancel() {
+        this.isCancelled = true;
+        cancelAnimationFrame(this.frameId);
+    }
+    reset() {
+        this.cancel();
+        this.isPaused = false;
+        this.pausedAt = 0;
+        this.startTime = 0;
+    }
+    setOnComplete(fn) {
+        this.hooks.onComplete = fn;
+    }
+}
+function decay(value, velocity, options = {}) {
+    const { decay = 0.998, ...hooks } = options;
+    return new DecayController(value, velocity, decay, hooks);
+}function withInterpolation$1(value, target, options, factory) {
+    if (typeof value.current === 'number' && typeof target === 'number') {
+        return factory(value, target, options);
+    }
+    if (typeof value.current === 'string' && typeof target === 'string') {
+        try {
+            const progress = new AnimateValue(0);
+            const interpolated = progress.to([0, 1], [value.current, target]);
+            const controller = factory(progress, 1, options);
+            value.setAnimationController(controller);
+            progress.subscribe(() => {
+                if (value.getAnimationController() === controller) {
+                    value._internalSet(interpolated.current);
+                }
+            });
+            return controller;
+        }
+        catch (err) {
+            throw new Error(`[spring] Cannot animate from "${value.current}" to "${target}": ${err.message}`);
+        }
+    }
+    throw new Error(`[spring] Unsupported type: ${typeof value.current} → ${typeof target}`);
+}
+class SpringController {
+    constructor(value, target, stiffness, damping, mass, hooks) {
+        this.value = value;
+        this.target = target;
+        this.stiffness = stiffness;
+        this.damping = damping;
+        this.mass = mass;
+        this.hooks = hooks;
+        this.velocity = 0;
+        this.restDisplacement = 0.001;
+        this.restSpeed = 0.001;
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.animate = () => {
+            if (this.isCancelled || this.isPaused)
+                return;
+            const now = Date.now();
+            const deltaTime = Math.min(now - this.startTime, 64);
+            this.startTime = now;
+            const c = this.damping;
+            const m = this.mass;
+            const k = this.stiffness;
+            const v0 = -this.velocity;
+            const x0 = this.target - this.position;
+            const zeta = c / (2 * Math.sqrt(k * m));
+            const omega0 = Math.sqrt(k / m);
+            const omega1 = omega0 * Math.sqrt(1 - zeta ** 2);
+            const t = deltaTime / 1000;
+            const sin1 = Math.sin(omega1 * t);
+            const cos1 = Math.cos(omega1 * t);
+            const underDampedEnvelope = Math.exp(-zeta * omega0 * t);
+            const underDampedFrag1 = underDampedEnvelope *
+                (sin1 * ((v0 + zeta * omega0 * x0) / omega1) + x0 * cos1);
+            const underDampedPosition = this.target - underDampedFrag1;
+            const underDampedVelocity = zeta * omega0 * underDampedFrag1 -
+                underDampedEnvelope *
+                    (cos1 * (v0 + zeta * omega0 * x0) - omega1 * x0 * sin1);
+            const criticallyDampedEnvelope = Math.exp(-omega0 * t);
+            const criticallyDampedPosition = this.target - criticallyDampedEnvelope * (x0 + (v0 + omega0 * x0) * t);
+            const criticallyDampedVelocity = criticallyDampedEnvelope *
+                (v0 * (t * omega0 - 1) + t * x0 * omega0 * omega0);
+            this.value._internalSet(this.position);
+            this.hooks.onChange?.(this.position);
+            const isVelocity = Math.abs(this.velocity) < this.restSpeed;
+            const isDisplacement = this.stiffness === 0 ||
+                Math.abs(this.target - this.position) < this.restDisplacement;
+            if (zeta < 1) {
+                this.position = underDampedPosition;
+                this.velocity = underDampedVelocity;
+            }
+            else {
+                this.position = criticallyDampedPosition;
+                this.velocity = criticallyDampedVelocity;
+            }
+            if (isVelocity && isDisplacement) {
+                this.velocity = 0;
+                this.position = this.target;
+                this.value._internalSet(this.position);
+                this.hooks.onChange?.(this.position);
+                this.hooks.onComplete?.();
+                return;
+            }
+            this.frameId = requestAnimationFrame(this.animate);
+        };
+        this.explicitFrom = hooks.from;
+    }
+    start() {
+        // If explicit 'from' is provided, always use it (for loops, sequences, etc.)
+        if (this.explicitFrom !== undefined) {
+            this.position = this.startPosition = this.explicitFrom;
+            this.value._internalSet(this.explicitFrom);
+            this.velocity = 0;
+            this.startTime = Date.now();
+        }
+        else {
+            // Otherwise, try to inherit from previous controller for smooth chaining
+            const previous = this.value.getAnimationController();
+            if (previous instanceof SpringController) {
+                this.position = previous.position;
+                this.velocity = previous.velocity;
+                this.startTime = previous.startTime;
+            }
+            else {
+                this.position = this.startPosition = this.value.current;
+                this.velocity = 0;
+                this.startTime = Date.now();
+            }
+        }
+        this.hooks.onStart?.();
+        this.value.setAnimationController(this);
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.frameId = requestAnimationFrame(this.animate);
+    }
+    pause() {
+        if (this.isCancelled || this.isPaused)
+            return;
+        this.isPaused = true;
+        cancelAnimationFrame(this.frameId);
+        this.hooks.onPause?.();
+    }
+    resume() {
+        if (this.isCancelled || !this.isPaused)
+            return;
+        this.isPaused = false;
+        this.hooks.onResume?.();
+        this.frameId = requestAnimationFrame(this.animate);
+    }
+    cancel() {
+        this.isCancelled = true;
+        cancelAnimationFrame(this.frameId);
+    }
+    reset() {
+        this.cancel();
+        this.isPaused = false;
+        this.velocity = 0;
+        this.position = this.startPosition;
+        this.startTime = Date.now();
+    }
+    setOnComplete(fn) {
+        this.hooks.onComplete = fn;
+    }
+}
+function spring(value, target, options = {}) {
+    return withInterpolation$1(value, target, options, (v, t, opts) => {
+        const { stiffness = 170, damping = 14, mass = 1, from, ...hooks } = opts;
+        return new SpringController(v, t, stiffness, damping, mass, { ...hooks, from });
+    });
+}/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+/**
+ * https://github.com/gre/bezier-easing
+ * BezierEasing - use bezier curve for transition easing function
+ * by Gaëtan Renaudeau 2014 - 2015 – MIT License
+ */
+// These values are established by empiricism with tests (tradeoff: performance VS precision)
+var NEWTON_ITERATIONS = 4;
+var NEWTON_MIN_SLOPE = 0.001;
+var SUBDIVISION_PRECISION = 0.0000001;
+var SUBDIVISION_MAX_ITERATIONS = 10;
+var kSplineTableSize = 11;
+var kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);
+var float32ArraySupported = typeof Float32Array === "function";
+function A(aA1, aA2) {
+    return 1.0 - 3.0 * aA2 + 3.0 * aA1;
+}
+function B(aA1, aA2) {
+    return 3.0 * aA2 - 6.0 * aA1;
+}
+function C(aA1) {
+    return 3.0 * aA1;
+}
+function calcBezier(aT, aA1, aA2) {
+    return ((A(aA1, aA2) * aT + B(aA1, aA2)) * aT + C(aA1)) * aT;
+}
+function getSlope(aT, aA1, aA2) {
+    return 3.0 * A(aA1, aA2) * aT * aT + 2.0 * B(aA1, aA2) * aT + C(aA1);
+}
+function binarySubdivide(aX, aA, aB, mX1, mX2) {
+    var currentX, currentT, i = 0;
+    do {
+        currentT = aA + (aB - aA) / 2.0;
+        currentX = calcBezier(currentT, mX1, mX2) - aX;
+        if (currentX > 0.0) {
+            aB = currentT;
+        }
+        else {
+            aA = currentT;
+        }
+    } while (Math.abs(currentX) > SUBDIVISION_PRECISION &&
+        ++i < SUBDIVISION_MAX_ITERATIONS);
+    return currentT;
+}
+function newtonRaphsonIterate(aX, aGuessT, mX1, mX2) {
+    for (var i = 0; i < NEWTON_ITERATIONS; ++i) {
+        var currentSlope = getSlope(aGuessT, mX1, mX2);
+        if (currentSlope === 0.0) {
+            return aGuessT;
+        }
+        var currentX = calcBezier(aGuessT, mX1, mX2) - aX;
+        aGuessT -= currentX / currentSlope;
+    }
+    return aGuessT;
+}
+function LinearEasing(x) {
+    return x;
+}
+function bezier(mX1, mY1, mX2, mY2) {
+    if (!(0 <= mX1 && mX1 <= 1 && 0 <= mX2 && mX2 <= 1)) {
+        throw new Error("bezier x values must be in [0, 1] range");
+    }
+    if (mX1 === mY1 && mX2 === mY2) {
+        return LinearEasing;
+    }
+    var sampleValues = float32ArraySupported
+        ? new Float32Array(kSplineTableSize)
+        : new Array(kSplineTableSize);
+    for (var i = 0; i < kSplineTableSize; ++i) {
+        sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);
+    }
+    function getTForX(aX) {
+        var intervalStart = 0.0;
+        var currentSample = 1;
+        var lastSample = kSplineTableSize - 1;
+        for (; currentSample !== lastSample && sampleValues[currentSample] <= aX; ++currentSample) {
+            intervalStart += kSampleStepSize;
+        }
+        --currentSample;
+        var dist = (aX - sampleValues[currentSample]) /
+            (sampleValues[currentSample + 1] - sampleValues[currentSample]);
+        var guessForT = intervalStart + dist * kSampleStepSize;
+        var initialSlope = getSlope(guessForT, mX1, mX2);
+        if (initialSlope >= NEWTON_MIN_SLOPE) {
+            return newtonRaphsonIterate(aX, guessForT, mX1, mX2);
+        }
+        else if (initialSlope === 0.0) {
+            return guessForT;
+        }
+        else {
+            return binarySubdivide(aX, intervalStart, intervalStart + kSampleStepSize, mX1, mX2);
+        }
+    }
+    return function BezierEasing(x) {
+        // Because JavaScript number are imprecise, we should guarantee the extremes are right.
+        if (x === 0 || x === 1) {
+            return x;
+        }
+        return calcBezier(getTForX(x), mY1, mY2);
+    };
+}
+/**
+ * This class implements common easing functions. The math is pretty obscure,
+ * but this cool website has nice visual illustrations of what they represent:
+ * http://xaedes.de/dev/transitions/
+ */
+class Easing {
+    static step0(n) {
+        return n > 0 ? 1 : 0;
+    }
+    static step1(n) {
+        return n >= 1 ? 1 : 0;
+    }
+    static linear(t) {
+        return t;
+    }
+    static ease(t) {
+        return ease(t);
+    }
+    static quad(t) {
+        return t * t;
+    }
+    static cubic(t) {
+        return t * t * t;
+    }
+    static poly(n) {
+        return (t) => Math.pow(t, n);
+    }
+    static sin(t) {
+        return 1 - Math.cos((t * Math.PI) / 2);
+    }
+    static circle(t) {
+        return 1 - Math.sqrt(1 - t * t);
+    }
+    static exp(t) {
+        return Math.pow(2, 10 * (t - 1));
+    }
+    /**
+     * A simple elastic interaction, similar to a spring.  Default bounciness
+     * is 1, which overshoots a little bit once.  0 bounciness doesn't overshoot
+     * at all, and bounciness of N > 1 will overshoot about N times.
+     *
+     * Wolfram Plots:
+     *
+     *   http://tiny.cc/elastic_b_1 (default bounciness = 1)
+     *   http://tiny.cc/elastic_b_3 (bounciness = 3)
+     */
+    static elastic(bounciness = 1) {
+        var p = bounciness * Math.PI;
+        return (t) => 1 - Math.pow(Math.cos((t * Math.PI) / 2), 3) * Math.cos(t * p);
+    }
+    static back(s) {
+        if (s === undefined) {
+            s = 1.70158;
+        }
+        return (t) => t * t * ((s + 1) * t - s);
+    }
+    static bounce(t) {
+        if (t < 1 / 2.75) {
+            return 7.5625 * t * t;
+        }
+        if (t < 2 / 2.75) {
+            t -= 1.5 / 2.75;
+            return 7.5625 * t * t + 0.75;
+        }
+        if (t < 2.5 / 2.75) {
+            t -= 2.25 / 2.75;
+            return 7.5625 * t * t + 0.9375;
+        }
+        t -= 2.625 / 2.75;
+        return 7.5625 * t * t + 0.984375;
+    }
+    static bezier(x1, y1, x2, y2) {
+        return bezier(x1, y1, x2, y2);
+    }
+    static in(easing) {
+        return easing;
+    }
+    /**
+     * Runs an easing function backwards.
+     */
+    static out(easing) {
+        return (t) => 1 - easing(1 - t);
+    }
+    /**
+     * Makes any easing function symmetrical.
+     */
+    static inOut(easing) {
+        return (t) => {
+            if (t < 0.5) {
+                return easing(t * 2) / 2;
+            }
+            return 1 - easing((1 - t) * 2) / 2;
+        };
+    }
+}
+var ease = /*#__PURE__*/ Easing.bezier(0.42, 0, 1, 1);function withInterpolation(value, target, options, factory) {
+    if (typeof value.current === 'number' && typeof target === 'number') {
+        return factory(value, target, options);
+    }
+    if (typeof value.current === 'string' && typeof target === 'string') {
+        try {
+            const progress = new AnimateValue(0);
+            const interpolated = progress.to([0, 1], [value.current, target]);
+            const controller = factory(progress, 1, options);
+            value.setAnimationController(controller);
+            progress.subscribe(() => {
+                if (value.getAnimationController() === controller) {
+                    value._internalSet(interpolated.current);
+                }
+            });
+            return controller;
+        }
+        catch (err) {
+            throw new Error(`[timing] Cannot animate from "${value.current}" to "${target}": ${err.message}`);
+        }
+    }
+    throw new Error(`[timing] Unsupported type: ${typeof value.current} → ${typeof target}`);
+}
+class TimingController {
+    constructor(value, target, duration = 300, easing = Easing.linear, hooks) {
+        this.value = value;
+        this.target = target;
+        this.duration = duration;
+        this.easing = easing;
+        this.hooks = hooks;
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.pausedAt = null;
+        this.elapsedBeforePause = 0;
+        this.animate = (timestamp) => {
+            if (this.isCancelled || this.isPaused)
+                return;
+            const elapsed = this.elapsedBeforePause + (timestamp - this.startTime);
+            let progress = elapsed / this.duration;
+            if (!Number.isFinite(progress))
+                progress = progress === Infinity ? 1 : 0;
+            const t = Math.min(1, Math.max(0, progress));
+            if (t < 1) {
+                this.position = this.fromValue + (this.target - this.fromValue) * this.easing(t);
+                if (Math.abs(this.target - this.position) < 0.01) {
+                    this.position = this.target;
+                    this.value._internalSet(this.position);
+                    this.hooks.onChange?.(this.position);
+                    this.hooks.onComplete?.();
+                    return;
+                }
+                this.value._internalSet(this.position);
+                this.hooks.onChange?.(this.position);
+                this.frameId = requestAnimationFrame(this.animate);
+            }
+            else {
+                this.position = this.target;
+                this.value._internalSet(this.position);
+                this.hooks.onChange?.(this.position);
+                this.hooks.onComplete?.();
+            }
+        };
+        this.explicitFrom = hooks.from;
+    }
+    start() {
+        // If explicit 'from' is provided, always use it (for loops, sequences, etc.)
+        if (this.explicitFrom !== undefined) {
+            this.fromValue = this.position = this.explicitFrom;
+            this.value._internalSet(this.explicitFrom);
+            this.startTime = performance.now();
+        }
+        else {
+            // Otherwise, try to inherit from previous controller for smooth chaining
+            const previous = this.value.getAnimationController();
+            if (previous instanceof TimingController &&
+                !previous.isCancelled &&
+                previous.target === this.target &&
+                previous.startTime) {
+                this.fromValue = previous.fromValue;
+                this.startTime = previous.startTime;
+            }
+            else {
+                this.fromValue = this.position = this.value.current;
+                this.startTime = performance.now();
+            }
+        }
+        this.hooks.onStart?.();
+        this.value.setAnimationController(this);
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.pausedAt = null;
+        this.elapsedBeforePause = 0;
+        this.frameId = requestAnimationFrame(this.animate);
+    }
+    pause() {
+        if (this.isCancelled || this.isPaused)
+            return;
+        this.isPaused = true;
+        this.pausedAt = performance.now();
+        this.elapsedBeforePause += this.pausedAt - this.startTime;
+        this.startTime = 0;
+        cancelAnimationFrame(this.frameId);
+        this.hooks.onPause?.();
+    }
+    resume() {
+        if (this.isCancelled || !this.isPaused)
+            return;
+        this.isPaused = false;
+        this.hooks.onResume?.();
+        this.startTime = performance.now();
+        this.pausedAt = null;
+        this.frameId = requestAnimationFrame(this.animate);
+    }
+    cancel() {
+        this.isCancelled = true;
+        cancelAnimationFrame(this.frameId);
+    }
+    reset() {
+        this.cancel();
+        this.isPaused = false;
+        this.pausedAt = null;
+        this.elapsedBeforePause = 0;
+        cancelAnimationFrame(this.frameId);
+    }
+    setOnComplete(fn) {
+        this.hooks.onComplete = fn;
+    }
+}
+function timing(value, target, options = {}) {
+    return withInterpolation(value, target, options, (v, t, opts) => {
+        const { duration = 300, easing = Easing.linear, from, ...hooks } = opts;
+        return new TimingController(v, t, duration, easing, { ...hooks, from });
+    });
+}class ParallelController {
+    constructor(controllers, hooks = {}) {
+        this.controllers = controllers;
+        this.hooks = hooks;
+        this.completedCount = 0;
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.originalCompletes = controllers.map((ctrl) => ctrl?.hooks?.onComplete);
+    }
+    start() {
+        this.completedCount = 0;
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.hooks.onStart?.();
+        this.controllers.forEach((controller, index) => {
+            const original = this.originalCompletes[index];
+            controller.setOnComplete?.(() => {
+                original?.();
+                this.handleComplete();
+            });
+            controller.start();
+        });
+    }
+    handleComplete() {
+        if (this.isCancelled)
+            return;
+        this.completedCount += 1;
+        if (this.completedCount === this.controllers.length) {
+            this.completedCount = 0;
+            this.hooks.onComplete?.();
+            this.onComplete?.();
+        }
+    }
+    pause() {
+        if (this.isCancelled || this.isPaused)
+            return;
+        this.isPaused = true;
+        this.hooks.onPause?.();
+        this.controllers.forEach((controller) => controller.pause());
+    }
+    resume() {
+        if (this.isCancelled || !this.isPaused)
+            return;
+        this.isPaused = false;
+        this.hooks.onResume?.();
+        this.controllers.forEach((controller) => controller.resume());
+    }
+    cancel() {
+        if (this.isCancelled)
+            return;
+        this.isCancelled = true;
+        this.controllers.forEach((controller) => controller.cancel());
+    }
+    reset() {
+        this.isCancelled = false;
+        this.isPaused = false;
+        this.completedCount = 0;
+        this.controllers.forEach((controller) => controller.reset?.());
+    }
+    setOnComplete(fn) {
+        this.onComplete = fn;
+    }
+}
+class SequenceController {
+    constructor(controllers, hooks = {}) {
+        this.controllers = controllers;
+        this.hooks = hooks;
+        this.index = 0;
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.current = null;
+        this.originalCompletes = controllers.map((ctrl) => ctrl?.hooks?.onComplete);
+    }
+    runNext() {
+        if (this.isCancelled || this.isPaused)
+            return;
+        const index = this.index++;
+        const controller = this.controllers[index];
+        if (!controller) {
+            this.onComplete?.();
+            this.hooks.onComplete?.();
+            return;
+        }
+        this.current = controller;
+        const original = this.originalCompletes[index];
+        controller.setOnComplete?.(() => {
+            original?.();
+            this.runNext();
+        });
+        controller.start();
+    }
+    start() {
+        this.index = 0;
+        this.isPaused = false;
+        this.isCancelled = false;
+        this.hooks.onStart?.();
+        this.runNext();
+    }
+    pause() {
+        if (this.isCancelled)
+            return;
+        this.isPaused = true;
+        this.current?.pause();
+        this.hooks.onPause?.();
+    }
+    resume() {
+        if (this.isCancelled || !this.isPaused)
+            return;
+        this.isPaused = false;
+        this.current?.resume();
+        this.hooks.onResume?.();
+    }
+    cancel() {
+        this.isCancelled = true;
+        this.current?.cancel();
+    }
+    reset() {
+        this.isCancelled = false;
+        this.isPaused = false;
+        this.index = 0;
+        this.controllers.forEach((controller) => controller.reset?.());
+    }
+    setOnComplete(fn) {
+        this.onComplete = fn;
+    }
+}
+class LoopController {
+    constructor(controller, iterations, hooks = {}) {
+        this.controller = controller;
+        this.iterations = iterations;
+        this.hooks = hooks;
+        this.count = 0;
+        this.isCancelled = false;
+        this.isPaused = false;
+        this.handleIterationComplete = () => {
+            this.count++;
+            this.originalComplete?.();
+            if (this.count < this.iterations) {
+                this.controller.reset?.();
+                this.runIteration();
+            }
+            else {
+                this.onComplete?.();
+                this.hooks.onComplete?.();
+            }
+        };
+        this.originalComplete = controller?.hooks?.onComplete;
+    }
+    runIteration() {
+        if (this.isCancelled || this.isPaused)
+            return;
+        this.controller.setOnComplete?.(this.handleIterationComplete);
+        this.controller.start();
+    }
+    start() {
+        this.isCancelled = false;
+        this.isPaused = false;
+        this.count = 0;
+        this.controller.reset();
+        this.hooks.onStart?.();
+        this.runIteration();
+    }
+    pause() {
+        this.isPaused = true;
+        this.controller.pause();
+        this.hooks.onPause?.();
+    }
+    resume() {
+        if (this.isCancelled || !this.isPaused)
+            return;
+        this.isPaused = false;
+        this.controller.resume();
+        this.hooks.onResume?.();
+    }
+    cancel() {
+        this.isCancelled = true;
+        this.controller.cancel();
+    }
+    reset() {
+        this.isCancelled = false;
+        this.isPaused = false;
+        this.count = 0;
+        this.controller.reset?.();
+    }
+    setOnComplete(fn) {
+        this.onComplete = fn;
+    }
+}
+class DelayController {
+    constructor(duration) {
+        this.duration = duration;
+    }
+    start() {
+        this.timerId = window.setTimeout(() => {
+            this.onComplete?.();
+        }, this.duration);
+    }
+    pause() { }
+    resume() { }
+    cancel() {
+        if (this.timerId)
+            clearTimeout(this.timerId);
+    }
+    reset() {
+        this.cancel();
+    }
+    setOnComplete(fn) {
+        this.onComplete = fn;
+    }
+}
+function parallel(controllers, hooks = {}) {
+    return new ParallelController(controllers, hooks);
+}
+function sequence(controllers, hooks = {}) {
+    return new SequenceController(controllers, hooks);
+}
+function loop(controller, iterations, hooks = {}) {
+    return new LoopController(controller, iterations, hooks);
+}
+function delay(duration) {
+    return new DelayController(duration);
+}function filterCallbackOptions(options = {}, attach) {
+    if (attach)
+        return options;
+    const { onStart, onChange, onComplete, ...rest } = options;
+    return rest;
+}
+function isDescriptor(x) {
+    return (typeof x === 'object' &&
+        x !== null &&
+        'type' in x &&
+        typeof x.type === 'string');
+}function buildAnimation(value, { type, to, options = {} }) {
+    switch (type) {
+        case 'spring':
+            return spring(value, to, options);
+        case 'timing':
+            return timing(value, to, options);
+        case 'decay':
+            return decay(value, options.velocity ?? 0, options);
+        case 'delay':
+            return delay(options.delay ?? 0);
+        case 'sequence': {
+            const animations = options.animations ?? [];
+            const controllers = animations.map((step) => buildAnimation(value, step));
+            return sequence(controllers, options);
+        }
+        case 'loop': {
+            const innerDesc = options.animation;
+            if (!innerDesc) {
+                console.warn('[buildAnimation] loop missing `animation` descriptor');
+                return { start() { }, pause() { }, resume() { }, cancel() { }, reset() { } };
+            }
+            let innerController;
+            // Each loop iteration restarts from the AnimateValue's initial value
+            // (not its current value) unless a step already sets an explicit `from`.
+            const loopFromValue = value.initial;
+            if (innerDesc.type === 'sequence') {
+                const animations = innerDesc.options?.animations ?? [];
+                const controllers = animations.map((step, index) => {
+                    if (index === 0 && (step.type === 'spring' || step.type === 'timing')) {
+                        const explicitFrom = step.options?.from;
+                        return buildAnimation(value, {
+                            ...step,
+                            options: { ...step.options, from: explicitFrom ?? loopFromValue },
+                        });
+                    }
+                    return buildAnimation(value, step);
+                });
+                innerController = sequence(controllers, innerDesc.options);
+            }
+            else if (innerDesc.type === 'spring' || innerDesc.type === 'timing') {
+                const explicitFrom = innerDesc.options?.from;
+                innerController = buildAnimation(value, {
+                    ...innerDesc,
+                    options: { ...innerDesc.options, from: explicitFrom ?? loopFromValue },
+                });
+            }
+            else {
+                innerController = buildAnimation(value, innerDesc);
+            }
+            return loop(innerController, options.iterations ?? 0, options);
+        }
+        default:
+            console.warn(`Unsupported animation type: ${type}`);
+            return { start() { }, pause() { }, resume() { }, cancel() { }, reset() { } };
+    }
+}
+function buildParallel(valueMap, step) {
+    const entries = Object.entries(valueMap).filter(([key]) => {
+        return (step.type === 'decay' ||
+            step.type === 'delay' ||
+            step.to[key] !== undefined);
+    });
+    const controllers = entries.map(([key, value], idx) => buildAnimation(value, {
+        type: step.type,
+        to: step.type === 'decay' || step.type === 'delay'
+            ? step.to
+            : step.to[key],
+        options: filterCallbackOptions(step.options, idx === 0),
+    }));
+    return parallel(controllers);
+}const PresenceContext = createContext(null);
+/**
+ * Hook to access presence state from within an animated component.
+ */
+function usePresence() {
+    const context = useContext(PresenceContext);
+    if (!context)
+        return [true, () => { }];
+    return [!context.isExiting, context.onExitComplete];
+}
+/**
+ * Hook to check if this is the initial mount (for skipping initial animations).
+ */
+function useIsPresent() {
+    const context = useContext(PresenceContext);
+    return context ? !context.isExiting : true;
+}
+// `exitingState` forces a re-render once `isExiting` flips, so this subtree
+// re-reads the (now exiting) PresenceContext instead of staying stale.
+function PresenceChild({ children, isExiting, mode, }) {
+    const [exitingState, setExitingState] = useState(false);
+    useLayoutEffect(() => {
+        if (isExiting && !exitingState) {
+            setExitingState(true);
+        }
+    }, [isExiting, exitingState]);
+    if (mode === 'popLayout' && isExiting) {
+        return jsx("div", { style: { position: 'absolute' }, children: children });
+    }
+    return children;
+}
+/**
+ * Presence enables exit animations when children are removed from the tree.
+ *
+ * @example
+ * ```tsx
+ * <Presence>
+ *   {isVisible && (
+ *     <animate.div
+ *       key="modal"
+ *       style={{ opacity: 0 }}
+ *       animate={{ opacity: withTiming(1) }}
+ *       exit={{ opacity: withTiming(0) }}
+ *     />
+ *   )}
+ * </Presence>
+ * ```
+ */
+function Presence({ children, initial = true, onExitComplete, mode = 'sync', }) {
+    const isInitialMount = useRef(true);
+    const [childStates, setChildStates] = useState(() => new Map());
+    const exitingCount = useRef(0);
+    const currentChildren = useMemo(() => {
+        const result = [];
+        Children.forEach(children, (child) => {
+            if (isValidElement(child)) {
+                const key = child.key ?? 'default';
+                result.push({ key, element: child });
+            }
+        });
+        return result;
+    }, [children]);
+    const currentKeys = useMemo(() => new Set(currentChildren.map((c) => c.key)), [currentChildren]);
+    useLayoutEffect(() => {
+        setChildStates((prev) => {
+            const next = new Map();
+            const currentChildrenMap = new Map(currentChildren.map(({ key, element }) => [key, element]));
+            // Two passes: first carry forward everything from `prev` (updating
+            // elements that still exist, marking the rest as exiting), then append
+            // any brand-new keys — so existing children keep their render order
+            // and new ones land at the end.
+            for (const [key, state] of prev) {
+                if (currentChildrenMap.has(key)) {
+                    // Was exiting and came back before its exit finished re-entering.
+                    if (state.isExiting) {
+                        exitingCount.current--;
+                    }
+                    next.set(key, {
+                        key,
+                        element: currentChildrenMap.get(key),
+                        isExiting: false,
+                    });
+                }
+                else {
+                    if (!state.isExiting) {
+                        exitingCount.current++;
+                    }
+                    next.set(key, {
+                        ...state,
+                        isExiting: true,
+                    });
+                }
+            }
+            for (const { key, element } of currentChildren) {
+                if (!prev.has(key)) {
+                    next.set(key, {
+                        key,
+                        element,
+                        isExiting: false,
+                    });
+                }
+            }
+            return next;
+        });
+    }, [currentChildren, currentKeys]);
+    useEffect(() => {
+        if (isInitialMount.current) {
+            isInitialMount.current = false;
+        }
+    }, []);
+    const handleExitComplete = useCallback((key) => {
+        setChildStates((prev) => {
+            const next = new Map(prev);
+            next.delete(key);
+            return next;
+        });
+        exitingCount.current--;
+        if (exitingCount.current === 0 && onExitComplete) {
+            onExitComplete();
+        }
+    }, [onExitComplete]);
+    const renderedChildren = useMemo(() => {
+        const result = [];
+        // In 'wait' mode, entering children stay unrendered until nothing is exiting.
+        const hasExiting = Array.from(childStates.values()).some((s) => s.isExiting);
+        const shouldWait = mode === 'wait' && hasExiting;
+        for (const [key, state] of childStates) {
+            if (shouldWait && !state.isExiting) {
+                continue;
+            }
+            const contextValue = {
+                isInitialMount: isInitialMount.current && initial,
+                isExiting: state.isExiting,
+                onExitComplete: () => handleExitComplete(key),
+            };
+            result.push(jsx(PresenceContext.Provider, { value: contextValue, children: jsx(PresenceChild, { isExiting: state.isExiting, mode: mode, children: state.element }) }, key));
+        }
+        return result;
+    }, [childStates, initial, mode, handleExitComplete]);
+    return jsx(Fragment, { children: renderedChildren });
+}function getStaticStyleValue(style, key) {
+    if (!style || !(key in style))
+        return null;
+    const value = style[key];
+    if (value === undefined || value === null)
+        return null;
+    // Skip AnimateValues - we want static initial values
+    if (value && typeof value === 'object' && 'subscribe' in value)
+        return null;
+    if (typeof value === 'number')
+        return value;
+    if (typeof value === 'string') {
+        // Must check for complex CSS values (spaces, functions, colors, gradients)
+        // before attempting to parse as a number, or e.g. "0 0 0 rgba(0,0,0,0)"
+        // would get mangled.
+        const complexValuePatterns = [
+            /\s/,
+            /rgba?\(/,
+            /hsla?\(/,
+            /#[0-9a-fA-F]/,
+            /linear-gradient|radial-gradient|conic-gradient/,
+            /calc\(|var\(/,
+        ];
+        if (complexValuePatterns.some(pattern => pattern.test(value))) {
+            return value;
+        }
+        if (/\d+(px|rem|em|ex|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)$/i.test(value))
+            return value;
+        const num = parseFloat(value);
+        return isNaN(num) ? value : num;
+    }
+    return null;
+}
+function getDefaultInitialValue(key) {
+    if (key === 'opacity')
+        return 1;
+    if (key === 'scale' || key === 'scaleX' || key === 'scaleY')
+        return 1;
+    if (key.startsWith('translate'))
+        return 0;
+    if (key.startsWith('rotate'))
+        return 0;
+    const stringProperties = [
+        'boxShadow', 'textShadow', 'background', 'backgroundImage',
+        'backgroundPosition', 'backgroundSize', 'border', 'borderColor',
+        'borderImage', 'borderRadius', 'color', 'fill', 'stroke',
+        'filter', 'backdropFilter', 'clipPath', 'mask', 'maskImage'
+    ];
+    if (stringProperties.includes(key)) {
+        return '';
+    }
+    return 0;
+}
+function hasUnit(value) {
+    return /\d+(px|rem|em|ex|%|cm|mm|in|pt|pc|ch|vh|vw|vmin|vmax)$/i.test(value);
+}
+function isNumericProperty(key) {
+    if (isTransformKey(key))
+        return true;
+    if (key === 'opacity')
+        return true;
+    if (key === 'zIndex')
+        return true;
+    return false;
+}
+// Resolves in priority order: explicit style prop -> inline style -> computed
+// style -> a sensible per-property default.
+function getInitialValue(key, style, node, computedStyle) {
+    const shouldBeNumeric = isNumericProperty(key);
+    const staticValue = getStaticStyleValue(style, key);
+    if (staticValue !== null) {
+        if (shouldBeNumeric && typeof staticValue === 'string') {
+            const num = parseFloat(staticValue);
+            return isNaN(num) ? getDefaultInitialValue(key) : num;
+        }
+        return staticValue;
+    }
+    const inlineValue = node.style[key];
+    if (inlineValue) {
+        if (shouldBeNumeric) {
+            const num = parseFloat(inlineValue);
+            return isNaN(num) ? getDefaultInitialValue(key) : num;
+        }
+        if (hasUnit(inlineValue))
+            return inlineValue;
+        const num = parseFloat(inlineValue);
+        return isNaN(num) ? inlineValue : num;
+    }
+    const computedValue = computedStyle.getPropertyValue(key.replace(/([A-Z])/g, '-$1').toLowerCase());
+    if (computedValue) {
+        const trimmed = computedValue.trim();
+        if (shouldBeNumeric) {
+            const num = parseFloat(trimmed);
+            return isNaN(num) ? getDefaultInitialValue(key) : num;
+        }
+        // 'none' -> '' so a property can animate from "no value" to a value.
+        if (trimmed === 'none') {
+            const stringProperties = [
+                'boxShadow', 'textShadow', 'background', 'backgroundImage',
+                'backgroundPosition', 'backgroundSize', 'border', 'borderColor',
+                'borderImage', 'borderRadius', 'color', 'fill', 'stroke',
+                'filter', 'backdropFilter', 'clipPath', 'mask', 'maskImage'
+            ];
+            if (stringProperties.includes(key)) {
+                return '';
+            }
+        }
+        if (hasUnit(trimmed))
+            return trimmed;
+        const num = parseFloat(trimmed);
+        return isNaN(num) ? trimmed : num;
+    }
+    return getDefaultInitialValue(key);
+}// Unwraps a descriptor (including `withSequence`/`withDelay` chains) to find
+// the final numeric/string destination it's headed towards. Returns
+// `undefined` for open-ended animations (e.g. `withLoop`) that have no
+// settled target to speak of.
+function extractRestingTarget(descriptor) {
+    if (descriptor === undefined)
+        return undefined;
+    if (typeof descriptor === 'number' || typeof descriptor === 'string') {
+        return descriptor;
+    }
+    if (descriptor.type === 'sequence') {
+        const animations = descriptor.options?.animations ?? [];
+        for (let i = animations.length - 1; i >= 0; i--) {
+            const target = extractRestingTarget(animations[i]);
+            if (target !== undefined)
+                return target;
+        }
+        return undefined;
+    }
+    if (descriptor.type === 'loop' || descriptor.type === 'decay') {
+        return undefined;
+    }
+    if (typeof descriptor.to === 'number' || typeof descriptor.to === 'string') {
+        return descriptor.to;
+    }
+    return undefined;
+}
+function applyStateAnimation(stateProp, isActive, context) {
+    if (!stateProp)
+        return;
+    const { node, style, computedStyle, animateValues, initialValues, stateControllers, cleanup, restingTargets, } = context;
+    stateControllers.forEach((ctrl) => ctrl.cancel());
+    stateControllers.length = 0;
+    const newSubscriptions = [];
+    for (const [key, valueOrDescriptor] of Object.entries(stateProp)) {
+        let value = animateValues[key];
+        if (!value) {
+            const initial = getInitialValue(key, style, node, computedStyle);
+            value = new AnimateValue(initial);
+            animateValues[key] = value;
+            initialValues[key] = initial;
+            if (isTransformKey(key)) {
+                const render = createTransformRenderer(node, animateValues);
+                newSubscriptions.push(value.subscribe(render));
+                render();
+            }
+            else {
+                const updateStyle = (v) => {
+                    const css = typeof v === 'number' &&
+                        !['opacity', 'zIndex', 'fontWeight', 'lineHeight'].includes(key)
+                        ? `${v}px`
+                        : String(v);
+                    node.style[key] = css;
+                };
+                newSubscriptions.push(value.subscribe(updateStyle));
+                updateStyle(initial);
+            }
+        }
+        else {
+            // If value already exists (e.g. pre-initialized by `animate`/`view`),
+            // capture the revert target fresh on every activation rather than only
+            // once. The value right before a hover/press/focus starts is always
+            // the correct "resting" baseline to snap back to — a *view* (or
+            // `animate`) transition can move that baseline well after mount (e.g.
+            // translateY settling from 40 -> 0), and caching the target only once
+            // would permanently lock in whatever the value happened to be during
+            // the very first activation, even after the real baseline has moved on.
+            if (isActive) {
+                initialValues[key] = value.current;
+            }
+            else if (!(key in initialValues)) {
+                // Deactivating without ever having activated (shouldn't normally
+                // happen) — fall back to resolving from static style.
+                initialValues[key] = getInitialValue(key, style, node, computedStyle);
+            }
+            // AnimateValues created in useLayoutEffect (e.g. by the `view` prop)
+            // need their subscriptions (re)established here too, or they'd never
+            // reach the DOM.
+            if (isTransformKey(key)) {
+                const render = createTransformRenderer(node, animateValues);
+                newSubscriptions.push(value.subscribe(render));
+            }
+            else {
+                newSubscriptions.push(value.subscribe((v) => {
+                    const css = typeof v === 'number' &&
+                        !['opacity', 'zIndex', 'fontWeight', 'lineHeight'].includes(key)
+                        ? `${v}px`
+                        : String(v);
+                    node.style[key] = css;
+                }));
+            }
+        }
+        const isPrimitive = typeof valueOrDescriptor === 'number' ||
+            typeof valueOrDescriptor === 'string';
+        if (isActive) {
+            if (isPrimitive) {
+                const springDescriptor = {
+                    type: 'spring',
+                    to: valueOrDescriptor,
+                    options: {},
+                };
+                const controller = buildAnimation(value, springDescriptor);
+                stateControllers.push(controller);
+                controller.start();
+            }
+            else {
+                const controller = buildAnimation(value, valueOrDescriptor);
+                stateControllers.push(controller);
+                controller.start();
+            }
+        }
+        else {
+            // Revert to the real settled target if `animate`/`view` declares one
+            // for this key (see `restingTargets` doc above); otherwise fall back
+            // to the captured value.
+            const initialValue = restingTargets?.[key] ?? initialValues[key];
+            if (isPrimitive) {
+                const revertDescriptor = {
+                    type: 'spring',
+                    to: initialValue,
+                    options: {},
+                };
+                const controller = buildAnimation(value, revertDescriptor);
+                stateControllers.push(controller);
+                controller.start();
+            }
+            else {
+                const revertDescriptor = {
+                    type: 'spring',
+                    to: initialValue,
+                    options: {},
+                };
+                const controller = buildAnimation(value, revertDescriptor);
+                stateControllers.push(controller);
+                controller.start();
+            }
+        }
+    }
+    cleanup.push(...newSubscriptions);
+}function setupExitAnimations(context) {
+    const { exitProp, animateValues, controllers, onExitComplete, node, style } = context;
+    let completedCount = 0;
+    const totalAnimations = Object.keys(exitProp).length;
+    const newSubscriptions = [];
+    const checkComplete = () => {
+        completedCount++;
+        if (completedCount >= totalAnimations) {
+            onExitComplete();
+        }
+    };
+    const computedStyle = window.getComputedStyle(node);
+    for (const key of Object.keys(exitProp)) {
+        if (!animateValues[key]) {
+            const initial = getInitialValue(key, style, node, computedStyle);
+            animateValues[key] = new AnimateValue(initial);
+        }
+    }
+    // Re-apply the full merged style (including the exit-only AnimateValues
+    // just created above) so every value is actually subscribed to the DOM.
+    const mergedStyle = { ...style };
+    for (const key of Object.keys(animateValues)) {
+        mergedStyle[key] = animateValues[key];
+    }
+    const normal = {};
+    const transforms = {};
+    for (const [key, value] of Object.entries(mergedStyle)) {
+        if (value && typeof value === 'object' && 'subscribe' in value) {
+            (isTransformKey(key) ? transforms : normal)[key] = value;
+        }
+    }
+    newSubscriptions.push(...applyStyles(node, normal));
+    newSubscriptions.push(...applyTransforms(node, transforms));
+    for (const [key, valueOrDescriptor] of Object.entries(exitProp)) {
+        const value = animateValues[key];
+        if (!value) {
+            checkComplete();
+            continue;
+        }
+        const baseDescriptor = typeof valueOrDescriptor === 'number' ||
+            typeof valueOrDescriptor === 'string'
+            ? {
+                type: 'spring',
+                to: valueOrDescriptor,
+                options: {},
+            }
+            : valueOrDescriptor;
+        const exitDescriptor = {
+            ...baseDescriptor,
+            options: {
+                ...baseDescriptor.options,
+                onComplete: () => {
+                    baseDescriptor.options?.onComplete?.();
+                    checkComplete();
+                },
+            },
+        };
+        const controller = buildAnimation(value, exitDescriptor);
+        controllers.push(controller);
+        controller.start();
+    }
+    return newSubscriptions;
+}const LAYOUT_FLIP_KEYS = {
+    tx: '__layoutTranslateX',
+    ty: '__layoutTranslateY',
+    sx: '__layoutScaleX',
+    sy: '__layoutScaleY',
+};
+const LAYOUT_ID_FLIP_KEYS = {
+    tx: '__layoutIdTranslateX',
+    ty: '__layoutIdTranslateY',
+    sx: '__layoutIdScaleX',
+    sy: '__layoutIdScaleY',
+};
+const DEFAULT_LAYOUT_SPRING = {
+    stiffness: 500,
+    damping: 40,
+    mass: 1,
+};
+// Resolves `layoutOptions` into a spring/timing descriptor. Only those two
+// drivers make sense for a FLIP settle-to-identity; anything else falls back
+// to the default layout spring.
+function resolveLayoutTransition(layoutOptions) {
+    if (!layoutOptions) {
+        return { type: 'spring', to: 0, options: { ...DEFAULT_LAYOUT_SPRING } };
+    }
+    if (isDescriptor(layoutOptions)) {
+        if (layoutOptions.type === 'spring' || layoutOptions.type === 'timing') {
+            return {
+                type: layoutOptions.type,
+                to: 0,
+                options: { ...layoutOptions.options },
+            };
+        }
+        return { type: 'spring', to: 0, options: { ...DEFAULT_LAYOUT_SPRING } };
+    }
+    return {
+        type: 'spring',
+        to: 0,
+        options: { ...DEFAULT_LAYOUT_SPRING, ...layoutOptions },
+    };
+}
+// Shared FLIP (First, Last, Invert, Play) animation used by both the
+// `layout` prop (diffing an element's own rect across renders) and the
+// `layoutId` prop (diffing against a rect recorded by a different element).
+// Jumps to the inverted delta instantly, then animates back to identity
+// via the same `withSpring` / `withTiming` drivers used elsewhere.
+function runFlipAnimation(node, delta, keys, refs, layoutOptions) {
+    const { animateValuesRef, propsRef, controllersRef, unsubsRef, initializedRef, } = refs;
+    const animateValues = animateValuesRef.current;
+    if (!initializedRef.current) {
+        animateValues[keys.tx] = new AnimateValue(0);
+        animateValues[keys.ty] = new AnimateValue(0);
+        animateValues[keys.sx] = new AnimateValue(1);
+        animateValues[keys.sy] = new AnimateValue(1);
+        initializedRef.current = true;
+    }
+    controllersRef.current.forEach((ctrl) => ctrl.cancel());
+    controllersRef.current = [];
+    unsubsRef.current.forEach((unsub) => unsub());
+    unsubsRef.current = [];
+    const tx = animateValues[keys.tx];
+    const ty = animateValues[keys.ty];
+    const sx = animateValues[keys.sx];
+    const sy = animateValues[keys.sy];
+    tx.set(delta.x);
+    ty.set(delta.y);
+    sx.set(delta.scaleX);
+    sy.set(delta.scaleY);
+    node.style.transformOrigin = 'top left';
+    // Compose with whatever else is contributing to this element's transform
+    // (static `style` values, and any `animate`/`hover`/`press`/`view`-driven
+    // AnimateValues already sitting in animateValuesRef) rather than replacing it.
+    const render = () => {
+        const { style } = propsRef.current;
+        node.style.transform = formatTransformString({
+            ...style,
+            ...animateValuesRef.current,
+        });
+    };
+    render();
+    unsubsRef.current = [
+        tx.subscribe(render),
+        ty.subscribe(render),
+        sx.subscribe(render),
+        sy.subscribe(render),
+    ];
+    const transition = resolveLayoutTransition(layoutOptions);
+    // Translate channels settle at 0; scale channels settle at 1. Descriptor
+    // `to` (when present) is ignored so options-only forms like
+    // `withTiming({ duration: 300 })` work as layout transitions.
+    const controllers = [
+        buildAnimation(tx, { ...transition, to: 0 }),
+        buildAnimation(ty, { ...transition, to: 0 }),
+        buildAnimation(sx, { ...transition, to: 1 }),
+        buildAnimation(sy, { ...transition, to: 1 }),
+    ];
+    controllersRef.current = controllers;
+    controllers.forEach((ctrl) => ctrl.start());
+}
+// Measures `node`'s untransformed layout box. getBoundingClientRect()
+// reflects whatever CSS transform is currently applied (ours or the
+// consumer's own), which would corrupt the measurement — e.g. while a
+// previous layout animation is still in flight (rapid re-triggers), or if a
+// static/animated transform is set via `style`/`animate`. Briefly
+// neutralizing the transform happens entirely within useLayoutEffect, before
+// the browser paints, so it's never visible.
+function measureUntransformedRect(node) {
+    const previousTransform = node.style.transform;
+    node.style.transform = 'none';
+    const rect = node.getBoundingClientRect();
+    node.style.transform = previousTransform;
+    return rect;
+}
+// True if this element's FLIP pseudo-transform is currently displaced away
+// from identity (0 translate / 1 scale) with no controller actively driving
+// it back — i.e. a previously started FLIP was interrupted (its controllers
+// canceled) without a replacement being started. Used to recover from React
+// StrictMode double-invoking a `layoutId` element's mount effects: the
+// simulated "unmount" cancels the just-started spring, and without this
+// check the simulated "remount" would see no rect delta (it's comparing
+// against the rect it just registered for itself) and never resume it,
+// leaving the transform stuck at its initial inverted value.
+function readStrandedDisplacement(animateValues, keys, isAnimating) {
+    if (isAnimating)
+        return null;
+    const tx = animateValues[keys.tx];
+    if (!tx)
+        return null;
+    const x = Number(tx.current) || 0;
+    const y = Number(animateValues[keys.ty]?.current) || 0;
+    const scaleX = Number(animateValues[keys.sx]?.current ?? 1);
+    const scaleY = Number(animateValues[keys.sy]?.current ?? 1);
+    const isDisplaced = Math.abs(x) > 0.5 ||
+        Math.abs(y) > 0.5 ||
+        Math.abs(scaleX - 1) > 0.01 ||
+        Math.abs(scaleY - 1) > 0.01;
+    return isDisplaced ? { x, y, scaleX, scaleY } : null;
+}
+function diffRects(prevRect, nextRect) {
+    const deltaX = prevRect.left - nextRect.left;
+    const deltaY = prevRect.top - nextRect.top;
+    const scaleX = prevRect.width / nextRect.width;
+    const scaleY = prevRect.height / nextRect.height;
+    const hasMoved = Math.abs(deltaX) > 0.5 || Math.abs(deltaY) > 0.5;
+    const hasResized = Math.abs(scaleX - 1) > 0.01 || Math.abs(scaleY - 1) > 0.01;
+    if (!hasMoved && !hasResized)
+        return null;
+    return { x: deltaX, y: deltaY, scaleX, scaleY };
+}/**
+ * Animates an element's own layout changes across renders (`layout` prop).
+ * Measures the untransformed rect each commit; when it differs from the
+ * previous measurement, runs a FLIP spring back to identity.
+ */
+function useLayoutAnimations(nodeRef, propsRef, isExitingRef, animateValuesRef) {
+    const prevRectRef = useRef(null);
+    const hasMeasuredRef = useRef(false);
+    const initializedRef = useRef(false);
+    const controllersRef = useRef([]);
+    const unsubsRef = useRef([]);
+    useLayoutEffect(() => {
+        const node = nodeRef.current;
+        const { layout, layoutOptions } = propsRef.current;
+        if (!node || !layout || isExitingRef.current) {
+            hasMeasuredRef.current = false;
+            prevRectRef.current = null;
+            return;
+        }
+        const nextRect = measureUntransformedRect(node);
+        const prevRect = prevRectRef.current;
+        const shouldCompare = hasMeasuredRef.current;
+        hasMeasuredRef.current = true;
+        prevRectRef.current = nextRect;
+        // Skip the first measurement (mount) and degenerate (hidden) rects
+        if (!shouldCompare || !prevRect)
+            return;
+        if (nextRect.width === 0 || nextRect.height === 0)
+            return;
+        const delta = diffRects(prevRect, nextRect);
+        if (!delta)
+            return;
+        runFlipAnimation(node, delta, LAYOUT_FLIP_KEYS, {
+            animateValuesRef,
+            propsRef,
+            controllersRef,
+            unsubsRef,
+            initializedRef,
+        }, layoutOptions);
+    });
+    useEffect(() => {
+        return () => {
+            controllersRef.current.forEach((ctrl) => ctrl.cancel());
+            unsubsRef.current.forEach((unsub) => unsub());
+        };
+    }, []);
+}// Global registry mapping a `layoutId` to the last known rect of whichever
+// element most recently claimed it. A "claim" happens on every layout effect
+// flush of any element carrying that `layoutId`, so the registry naturally
+// captures the last position/size before an element unmounts (the
+// registration from its final render stays put) as well as before each
+// re-render of a persisting element (degrading gracefully to the same
+// per-node behavior as the `layout` prop). Note this is a single global map,
+// so `layoutId`s should be unique per active transition group.
+//
+// Stashed on `globalThis` (rather than a plain module-level variable) so
+// every copy of this module shares the SAME registry even if the host
+// bundler ends up evaluating this file more than once (e.g. duplicate
+// chunks from a symlinked/monorepo package, or a module re-executed by hot
+// reloading) — otherwise the "old" element's registration and the "new"
+// element's lookup could land in two different Maps, silently turning every
+// transition into a no-op (the new element just renders at its target rect
+// with no prior entry to diff against, so it appears to jump instead of
+// animate).
+const LAYOUT_ID_REGISTRY_KEY = '__REACT_UI_ANIMATE_LAYOUT_ID_REGISTRY__';
+const layoutIdRegistry = (() => {
+    const g = globalThis;
+    if (!g[LAYOUT_ID_REGISTRY_KEY]) {
+        g[LAYOUT_ID_REGISTRY_KEY] = new Map();
+    }
+    return g[LAYOUT_ID_REGISTRY_KEY];
+})();/**
+ * Shared-element transitions via `layoutId`. On each layout flush the
+ * element claims its id in the global registry; a newly mounted claimant
+ * FLIPs from the previous owner's last rect. Also recovers StrictMode
+ * stranded displacements (mount → cleanup cancels spring → remount).
+ */
+function useLayoutIdAnimations(nodeRef, propsRef, isExitingRef, animateValuesRef) {
+    const initializedRef = useRef(false);
+    const controllersRef = useRef([]);
+    const unsubsRef = useRef([]);
+    // Captures which (layoutId, node) pair this instance last claimed, read
+    // back on unmount — by then nodeRef.current/propsRef.current may already
+    // be cleared/stale, so the claim must be captured while still live.
+    const claimRef = useRef(null);
+    useLayoutEffect(() => {
+        const node = nodeRef.current;
+        const { layoutId, layoutOptions } = propsRef.current;
+        if (!node || !layoutId || isExitingRef.current)
+            return;
+        const nextRect = measureUntransformedRect(node);
+        const prevEntry = layoutIdRegistry.get(layoutId);
+        layoutIdRegistry.set(layoutId, { rect: nextRect, node });
+        claimRef.current = { layoutId, node };
+        // If a FLIP was already in flight but its controllers were canceled
+        // without anything resuming them (see readStrandedDisplacement — this
+        // happens under React StrictMode's mount/cleanup/remount simulation),
+        // resume it toward identity even though this element's own rect hasn't
+        // changed since it last registered.
+        const stranded = readStrandedDisplacement(animateValuesRef.current, LAYOUT_ID_FLIP_KEYS, controllersRef.current.length > 0);
+        if (!prevEntry && !stranded)
+            return;
+        if (nextRect.width === 0 || nextRect.height === 0)
+            return;
+        const delta = prevEntry ? diffRects(prevEntry.rect, nextRect) : null;
+        const flipDelta = delta ?? stranded;
+        if (!flipDelta)
+            return;
+        runFlipAnimation(node, flipDelta, LAYOUT_ID_FLIP_KEYS, {
+            animateValuesRef,
+            propsRef,
+            controllersRef,
+            unsubsRef,
+            initializedRef,
+        }, layoutOptions);
+    });
+    useEffect(() => {
+        return () => {
+            controllersRef.current.forEach((ctrl) => ctrl.cancel());
+            controllersRef.current = [];
+            unsubsRef.current.forEach((unsub) => unsub());
+            unsubsRef.current = [];
+            const claim = claimRef.current;
+            if (!claim)
+                return;
+            // A sibling element mounting with the same layoutId in this same
+            // commit (the normal cross-component transition case) re-registers
+            // synchronously before this runs, so it's safe to check back a tick
+            // later: if nothing has re-claimed the id by then, this was the last
+            // owner and the entry is genuinely abandoned — drop it so a much
+            // later, unrelated remount (a different page/story, or Fast Refresh)
+            // doesn't inherit a stale rect and produce a bogus transition.
+            queueMicrotask(() => {
+                const entry = layoutIdRegistry.get(claim.layoutId);
+                if (entry && entry.node === claim.node) {
+                    layoutIdRegistry.delete(claim.layoutId);
+                }
+            });
+        };
+    }, []);
+}function combineRefs(...refs) {
+    return (element) => {
+        for (const ref of refs) {
+            if (!ref)
+                continue;
+            if (typeof ref === 'function')
+                ref(element);
+            else if ('current' in ref)
+                ref.current = element;
+        }
+    };
+}function useInView(ref, options = {}) {
+    const { root, rootMargin, threshold, once = false } = options;
+    const [isInView, setIsInView] = useState(false);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        const observer = new IntersectionObserver(([entry]) => {
+            if (entry.isIntersecting) {
+                setIsInView(true);
+                if (once) {
+                    observer.unobserve(entry.target);
+                    observer.disconnect();
+                }
+            }
+            else if (!once) {
+                setIsInView(false);
+            }
+        }, { root: root ?? null, rootMargin, threshold });
+        observer.observe(el);
+        return () => observer.disconnect();
+    }, [ref, root, rootMargin, threshold, once]);
+    return isInView;
+}function serializeAnimateProp(prop) {
+    if (!prop)
+        return '';
+    const propRecord = prop;
+    const keys = Object.keys(propRecord).sort();
+    return keys
+        .map((key) => {
+        const value = propRecord[key];
+        if (typeof value === 'number' || typeof value === 'string') {
+            return `${key}:${value}`;
+        }
+        if (typeof value === 'object' && value !== null && 'type' in value) {
+            const desc = value;
+            return `${key}:${desc.type}:${JSON.stringify(desc.to || '')}`;
+        }
+        return `${key}:unknown`;
+    })
+        .join('|');
+}
+function startAnimations(animateProp, animateValues, controllers) {
+    for (const [key, valueOrDescriptor] of Object.entries(animateProp)) {
+        const value = animateValues[key];
+        if (!value)
+            continue;
+        const descriptor = typeof valueOrDescriptor === 'number' ||
+            typeof valueOrDescriptor === 'string'
+            ? {
+                type: 'spring',
+                to: valueOrDescriptor,
+                options: {},
+            }
+            : valueOrDescriptor;
+        const controller = buildAnimation(value, descriptor);
+        controllers.push(controller);
+        controller.start();
+    }
+}
+function applyStylesToNode(node, style, animateValues, rest) {
+    const mergedStyle = { ...style };
+    for (const key of Object.keys(animateValues)) {
+        mergedStyle[key] = animateValues[key];
+    }
+    const normal = {};
+    const transforms = {};
+    for (const [key, value] of Object.entries(mergedStyle)) {
+        (isTransformKey(key) ? transforms : normal)[key] = value;
+    }
+    return [
+        ...applyStyles(node, normal),
+        ...applyTransforms(node, mergedStyle),
+        ...applyAttrs(node, rest),
+    ];
+}
+function isFocusable(node) {
+    return (node instanceof HTMLInputElement ||
+        node instanceof HTMLTextAreaElement ||
+        node instanceof HTMLSelectElement ||
+        node instanceof HTMLButtonElement ||
+        node instanceof HTMLAnchorElement ||
+        node.getAttribute('tabindex') !== null);
+}
+function useEnterAnimations(nodeRef, propsRef, animateProp, isExitingRef, animateValuesRef, controllersRef) {
+    const presenceContext = useContext(PresenceContext);
+    const cleanupRef = useRef([]);
+    const hasMountedRef = useRef(false);
+    const prevAnimatePropKeyRef = useRef('');
+    const wasExitingRef = useRef(false);
+    useLayoutEffect(() => {
+        const node = nodeRef.current;
+        const isExiting = presenceContext?.isExiting ?? false;
+        const justReEntered = wasExitingRef.current && !isExiting;
+        wasExitingRef.current = isExiting;
+        if (!node || isExiting || isExitingRef.current)
+            return;
+        const { style: currentStyle = {}, ...rest } = propsRef.current;
+        const currentKey = serializeAnimateProp(animateProp);
+        const valuesChanged = prevAnimatePropKeyRef.current !== currentKey;
+        // isFirstMount only refers to the literal first mount of this component instance
+        const isFirstMount = !hasMountedRef.current;
+        const shouldRestart = isFirstMount || valuesChanged || justReEntered;
+        if (shouldRestart) {
+            controllersRef.current.forEach((ctrl) => ctrl.cancel());
+            controllersRef.current = [];
+            if (animateProp) {
+                const computedStyle = window.getComputedStyle(node);
+                if (Object.keys(animateValuesRef.current).length === 0) {
+                    const newAnimateValues = {};
+                    for (const key of Object.keys(animateProp)) {
+                        const initial = getInitialValue(key, currentStyle, node, computedStyle);
+                        newAnimateValues[key] = new AnimateValue(initial);
+                    }
+                    animateValuesRef.current = newAnimateValues;
+                }
+                startAnimations(animateProp, animateValuesRef.current, controllersRef.current);
+            }
+        }
+        // Always re-sync subscriptions to handle StrictMode or prop updates
+        // without restarting the animation timeline
+        cleanupRef.current.forEach((cleanup) => cleanup());
+        cleanupRef.current = applyStylesToNode(node, currentStyle, animateValuesRef.current, rest);
+        prevAnimatePropKeyRef.current = currentKey;
+        hasMountedRef.current = true;
+        return () => {
+            cleanupRef.current.forEach((cleanup) => cleanup());
+            cleanupRef.current = [];
+        };
+        // Removed 'style' from dependencies to prevent re-triggering on parent state changes
+    }, [animateProp, presenceContext?.isExiting]);
+}
+function useExitAnimations(nodeRef, propsRef, isExitingRef, animateValuesRef, enterControllersRef) {
+    const presenceContext = useContext(PresenceContext);
+    const exitControllersRef = useRef([]);
+    const exitCleanupRef = useRef([]);
+    const onExitCompleteRef = useRef(null);
+    const prevIsExitingRef = useRef(false);
+    useLayoutEffect(() => {
+        onExitCompleteRef.current = presenceContext?.onExitComplete ?? null;
+    });
+    // useLayoutEffect (not useEffect) so this runs in sync with useEnterAnimations.
+    useLayoutEffect(() => {
+        const { exit: exitProp, style: currentStyle = {} } = propsRef.current;
+        const node = nodeRef.current;
+        const isExiting = presenceContext?.isExiting ?? false;
+        const prevIsExiting = prevIsExitingRef.current;
+        prevIsExitingRef.current = isExiting;
+        if (!isExiting) {
+            if (isExitingRef.current) {
+                isExitingRef.current = false;
+                exitControllersRef.current.forEach((ctrl) => ctrl.cancel());
+                exitControllersRef.current = [];
+                exitCleanupRef.current.forEach((cleanup) => cleanup());
+                exitCleanupRef.current = [];
+            }
+            return;
+        }
+        if (isExitingRef.current || !exitProp || !node) {
+            return;
+        }
+        // Gate on the not-exiting -> exiting transition (not just `isExiting`)
+        // so a PresenceContext object identity change alone doesn't re-trigger
+        // (and cancel) an exit animation already in flight.
+        if (!prevIsExiting && isExiting) {
+            isExitingRef.current = true;
+            enterControllersRef.current.forEach((ctrl) => ctrl.cancel());
+            enterControllersRef.current = [];
+            exitCleanupRef.current.forEach((cleanup) => cleanup());
+            exitCleanupRef.current = [];
+            exitCleanupRef.current = setupExitAnimations({
+                exitProp,
+                animateValues: animateValuesRef.current,
+                controllers: exitControllersRef.current,
+                onExitComplete: () => {
+                    // Guard against a child that got re-added mid-exit and is no
+                    // longer exiting by the time this fires.
+                    if (isExitingRef.current && onExitCompleteRef.current) {
+                        exitCleanupRef.current.forEach((cleanup) => cleanup());
+                        exitCleanupRef.current = [];
+                        isExitingRef.current = false;
+                        onExitCompleteRef.current();
+                    }
+                },
+                node,
+                style: currentStyle,
+            });
+        }
+        return () => {
+            // Only tear down if actually exiting — this also runs on every
+            // non-exiting re-render, where there's nothing to clean up.
+            if (isExitingRef.current) {
+                exitControllersRef.current.forEach((ctrl) => ctrl.cancel());
+                exitControllersRef.current = [];
+                exitCleanupRef.current.forEach((cleanup) => cleanup());
+                exitCleanupRef.current = [];
+            }
+        };
+    }, [presenceContext?.isExiting]);
+}
+function useViewAnimations(nodeRef, propsRef, view, viewOptions, animateValuesRef) {
+    const stateControllersRef = useRef([]);
+    const initialValuesRef = useRef({});
+    const cleanupRef = useRef([]);
+    const isInView = useInView(nodeRef, viewOptions || {});
+    const hasInitializedRef = useRef(false);
+    // Applies initial values (e.g. opacity: 0) to the DOM immediately, before
+    // any animation runs, so the element never flashes with default styles.
+    useLayoutEffect(() => {
+        if (!view)
+            return;
+        const node = nodeRef.current;
+        if (!node)
+            return;
+        if (hasInitializedRef.current)
+            return;
+        const computedStyle = window.getComputedStyle(node);
+        const { style = {} } = propsRef.current;
+        for (const key of Object.keys(view)) {
+            if (!animateValuesRef.current[key]) {
+                const initial = getInitialValue(key, style, node, computedStyle);
+                const value = new AnimateValue(initial);
+                animateValuesRef.current[key] = value;
+                initialValuesRef.current[key] = initial;
+                if (isTransformKey(key)) {
+                    const render = createTransformRenderer(node, animateValuesRef.current);
+                    render();
+                }
+                else {
+                    const css = typeof initial === 'number' &&
+                        !['opacity', 'zIndex', 'fontWeight', 'lineHeight'].includes(key)
+                        ? `${initial}px`
+                        : String(initial);
+                    node.style[key] = css;
+                }
+            }
+        }
+        hasInitializedRef.current = true;
+    }, [view]);
+    const applyViewAnimationWrapper = (isActive) => {
+        if (!view)
+            return;
+        const node = nodeRef.current;
+        if (!node)
+            return;
+        cleanupRef.current.forEach((cleanup) => cleanup());
+        cleanupRef.current = [];
+        const computedStyle = window.getComputedStyle(node);
+        const { style = {} } = propsRef.current;
+        const context = {
+            node,
+            style,
+            computedStyle,
+            animateValues: animateValuesRef.current,
+            initialValues: initialValuesRef.current,
+            stateControllers: stateControllersRef.current,
+            cleanup: cleanupRef.current,
+        };
+        applyStateAnimation(view, isActive, context);
+    };
+    useEffect(() => {
+        if (!view)
+            return;
+        applyViewAnimationWrapper(isInView);
+        return () => {
+            stateControllersRef.current.forEach((ctrl) => ctrl.cancel());
+            stateControllersRef.current = [];
+            cleanupRef.current.forEach((cleanup) => cleanup());
+            cleanupRef.current = [];
+        };
+    }, [isInView, view]);
+    useEffect(() => {
+        return () => {
+            stateControllersRef.current.forEach((ctrl) => ctrl.cancel());
+            stateControllersRef.current = [];
+            cleanupRef.current.forEach((cleanup) => cleanup());
+            cleanupRef.current = [];
+        };
+    }, []);
+}
+function useStateAnimations(nodeRef, propsRef, hover, press, focus, animateValuesRef) {
+    const stateControllersRef = useRef([]);
+    const initialValuesRef = useRef({});
+    const stateRef = useRef({
+        isHovered: false,
+        isTapped: false,
+        isFocused: false,
+    });
+    const hoverRef = useRef(hover);
+    const pressRef = useRef(press);
+    const focusRef = useRef(focus);
+    hoverRef.current = hover;
+    pressRef.current = press;
+    focusRef.current = focus;
+    const applyStateAnimationWrapper = (stateProp, isActive) => {
+        if (!stateProp)
+            return;
+        const node = nodeRef.current;
+        if (!node)
+            return;
+        const computedStyle = window.getComputedStyle(node);
+        const { style = {}, animate: animateProp, view: viewProp } = propsRef.current;
+        // The real destination for each key, as declared by `animate`/`view` —
+        // used to revert to the true target instead of wherever a hover/press/
+        // focus interaction happened to interrupt an in-flight reveal.
+        const restingTargets = {};
+        for (const key of Object.keys(stateProp)) {
+            const viewRecord = viewProp;
+            const animateRecord = animateProp;
+            const target = (viewRecord && key in viewRecord
+                ? extractRestingTarget(viewRecord[key])
+                : undefined) ??
+                (animateRecord && key in animateRecord
+                    ? extractRestingTarget(animateRecord[key])
+                    : undefined);
+            if (target !== undefined)
+                restingTargets[key] = target;
+        }
+        const context = {
+            node,
+            style,
+            computedStyle,
+            animateValues: animateValuesRef.current,
+            initialValues: initialValuesRef.current,
+            stateControllers: stateControllersRef.current,
+            cleanup: [],
+            restingTargets,
+        };
+        applyStateAnimation(stateProp, isActive, context);
+    };
+    useEffect(() => {
+        const node = nodeRef.current;
+        if (!node)
+            return;
+        const handleMouseEnter = () => {
+            if (stateRef.current.isHovered)
+                return;
+            stateRef.current.isHovered = true;
+            applyStateAnimationWrapper(hoverRef.current, true);
+        };
+        const handleMouseLeave = () => {
+            if (!stateRef.current.isHovered)
+                return;
+            stateRef.current.isHovered = false;
+            applyStateAnimationWrapper(hoverRef.current, false);
+        };
+        const handleMouseDown = () => {
+            if (stateRef.current.isTapped)
+                return;
+            stateRef.current.isTapped = true;
+            applyStateAnimationWrapper(pressRef.current, true);
+        };
+        const handleMouseUp = () => {
+            if (!stateRef.current.isTapped)
+                return;
+            stateRef.current.isTapped = false;
+            applyStateAnimationWrapper(pressRef.current, false);
+            // Re-apply hover if still active
+            if (stateRef.current.isHovered && hoverRef.current) {
+                applyStateAnimationWrapper(hoverRef.current, true);
+            }
+        };
+        const handleMouseLeaveForPress = () => {
+            if (stateRef.current.isTapped) {
+                stateRef.current.isTapped = false;
+                applyStateAnimationWrapper(pressRef.current, false);
+                // Re-apply hover if still active
+                if (stateRef.current.isHovered && hoverRef.current) {
+                    applyStateAnimationWrapper(hoverRef.current, true);
+                }
+            }
+        };
+        const handleFocus = () => {
+            if (stateRef.current.isFocused)
+                return;
+            stateRef.current.isFocused = true;
+            applyStateAnimationWrapper(focusRef.current, true);
+        };
+        const handleBlur = () => {
+            if (!stateRef.current.isFocused)
+                return;
+            stateRef.current.isFocused = false;
+            applyStateAnimationWrapper(focusRef.current, false);
+        };
+        if (hoverRef.current) {
+            node.addEventListener('mouseenter', handleMouseEnter);
+            node.addEventListener('mouseleave', handleMouseLeave);
+        }
+        if (pressRef.current) {
+            node.addEventListener('mousedown', handleMouseDown);
+            node.addEventListener('mouseup', handleMouseUp);
+            node.addEventListener('mouseleave', handleMouseLeaveForPress);
+            node.addEventListener('touchstart', handleMouseDown);
+            node.addEventListener('touchend', handleMouseUp);
+            node.addEventListener('touchcancel', handleMouseLeaveForPress);
+        }
+        if (focusRef.current && isFocusable(node)) {
+            node.addEventListener('focus', handleFocus);
+            node.addEventListener('blur', handleBlur);
+        }
+        // Re-apply active state animations after effect re-runs (e.g. config change)
+        if (stateRef.current.isHovered && hoverRef.current) {
+            applyStateAnimationWrapper(hoverRef.current, true);
+        }
+        if (stateRef.current.isTapped && pressRef.current) {
+            applyStateAnimationWrapper(pressRef.current, true);
+        }
+        if (stateRef.current.isFocused && focusRef.current) {
+            applyStateAnimationWrapper(focusRef.current, true);
+        }
+        return () => {
+            if (hoverRef.current) {
+                node.removeEventListener('mouseenter', handleMouseEnter);
+                node.removeEventListener('mouseleave', handleMouseLeave);
+            }
+            if (pressRef.current) {
+                node.removeEventListener('mousedown', handleMouseDown);
+                node.removeEventListener('mouseup', handleMouseUp);
+                node.removeEventListener('mouseleave', handleMouseLeaveForPress);
+                node.removeEventListener('touchstart', handleMouseDown);
+                node.removeEventListener('touchend', handleMouseUp);
+                node.removeEventListener('touchcancel', handleMouseLeaveForPress);
+            }
+            if (focusRef.current) {
+                node.removeEventListener('focus', handleFocus);
+                node.removeEventListener('blur', handleBlur);
+            }
+            stateControllersRef.current.forEach((ctrl) => ctrl.cancel());
+            stateControllersRef.current = [];
+        };
+    }, [
+        serializeAnimateProp(hover),
+        serializeAnimateProp(press),
+        serializeAnimateProp(focus),
+    ]);
+    useEffect(() => {
+        return () => {
+            stateControllersRef.current.forEach((ctrl) => ctrl.cancel());
+            stateControllersRef.current = [];
+        };
+    }, []);
+}
+function makeAnimated(tag) {
+    const AnimatedComponent = forwardRef((props, ref) => {
+        const nodeRef = useRef(null);
+        const propsRef = useRef(props);
+        const isExitingRef = useRef(false);
+        const animateValuesRef = useRef({});
+        const enterControllersRef = useRef([]);
+        propsRef.current = props;
+        useExitAnimations(nodeRef, propsRef, isExitingRef, animateValuesRef, enterControllersRef);
+        useEnterAnimations(nodeRef, propsRef, props.animate, isExitingRef, animateValuesRef, enterControllersRef);
+        useStateAnimations(nodeRef, propsRef, props.hover, props.press, props.focus, animateValuesRef);
+        useViewAnimations(nodeRef, propsRef, props.view, props.viewOptions, animateValuesRef);
+        useLayoutAnimations(nodeRef, propsRef, isExitingRef, animateValuesRef);
+        useLayoutIdAnimations(nodeRef, propsRef, isExitingRef, animateValuesRef);
+        const { animate, exit, hover, press, focus, view, viewOptions, layout, layoutOptions, layoutId, style, ...restProps } = props;
+        // Filter style object to prevent conflicts between CSS and JS animations
+        const filteredStyle = {};
+        const animatedKeys = new Set([
+            ...Object.keys(animateValuesRef.current),
+            ...(animate ? Object.keys(animate) : []),
+        ]);
+        if (style) {
+            for (const [key, value] of Object.entries(style)) {
+                if (isTransformKey(key) || animatedKeys.has(key))
+                    continue;
+                if (value && typeof value === 'object' && 'subscribe' in value)
+                    continue;
+                filteredStyle[key] = value;
+            }
+        }
+        return createElement(tag, {
+            ...restProps,
+            style: filteredStyle,
+            ref: combineRefs(nodeRef, ref),
+        });
+    });
+    AnimatedComponent.displayName = `Animated.${tag}`;
+    return AnimatedComponent;
+}const cache = new Map();
+const animate = /*#__PURE__*/ new Proxy({}, {
+    get(_, tag) {
+        if (!cache.has(tag)) {
+            cache.set(tag, makeAnimated(tag));
+        }
+        return cache.get(tag);
+    },
+});/**
+ * Combines multiple AnimateValue instances into a single AnimateValue
+ * using a combiner function.
+ */
+function combine(inputs, combiner) {
+    const initial = inputs.map((value) => value.current);
+    const output = new AnimateValue(combiner(...initial));
+    const update = () => {
+        const values = inputs.map((value) => value.current);
+        output.set(combiner(...values));
+    };
+    inputs.forEach((value) => value.subscribe(() => update()));
+    return output;
+}function to(input, inRange, outRange, config) {
+    return to$1(inRange, outRange, config)(input);
+}const DEFAULT_STIFFNESS = 158;
+const DEFAULT_DAMPING = 20;
+const DEFAULT_MASS = 1;
+const SPRING_OPTION_KEYS = new Set([
+    'stiffness',
+    'damping',
+    'mass',
+    'from',
+    'onStart',
+    'onChange',
+    'onComplete',
+]);
+const TIMING_OPTION_KEYS = new Set([
+    'duration',
+    'easing',
+    'from',
+    'onStart',
+    'onChange',
+    'onComplete',
+]);
+// True when `value` is a plain options bag (every key is a known option),
+// including `{}`. Used to support the target-less overload:
+//   withSpring({ stiffness: 400 })
+//   withTiming({ duration: 300 })
+// without breaking object targets like withSpring({ x: 10, y: 20 }).
+function isOptionsOnly(value, optionKeys) {
+    if (value === null || typeof value !== 'object' || Array.isArray(value)) {
+        return false;
+    }
+    return Object.keys(value).every((key) => optionKeys.has(key));
+}
+function withSpring(toOrOpts, opts) {
+    if (opts === undefined && isOptionsOnly(toOrOpts, SPRING_OPTION_KEYS)) {
+        const options = toOrOpts;
+        return {
+            type: 'spring',
+            options: {
+                stiffness: options.stiffness ?? DEFAULT_STIFFNESS,
+                damping: options.damping ?? DEFAULT_DAMPING,
+                mass: options.mass ?? DEFAULT_MASS,
+                from: options.from,
+                onStart: options.onStart,
+                onChange: options.onChange,
+                onComplete: options.onComplete,
+            },
+        };
+    }
+    const to = toOrOpts;
+    return {
+        type: 'spring',
+        to,
+        options: {
+            stiffness: opts?.stiffness ?? DEFAULT_STIFFNESS,
+            damping: opts?.damping ?? DEFAULT_DAMPING,
+            mass: opts?.mass ?? DEFAULT_MASS,
+            from: opts?.from,
+            onStart: opts?.onStart,
+            onChange: opts?.onChange,
+            onComplete: opts?.onComplete,
+        },
+    };
+}
+function withTiming(toOrOpts, opts) {
+    if (opts === undefined && isOptionsOnly(toOrOpts, TIMING_OPTION_KEYS)) {
+        const options = toOrOpts;
+        return {
+            type: 'timing',
+            options: {
+                duration: options.duration,
+                easing: options.easing,
+                from: options.from,
+                onStart: options.onStart,
+                onChange: options.onChange,
+                onComplete: options.onComplete,
+            },
+        };
+    }
+    const to = toOrOpts;
+    return {
+        type: 'timing',
+        to,
+        options: {
+            duration: opts?.duration,
+            easing: opts?.easing,
+            from: opts?.from,
+            onStart: opts?.onStart,
+            onChange: opts?.onChange,
+            onComplete: opts?.onComplete,
+        },
+    };
+}
+const withDecay = (velocity, opts) => ({
+    type: 'decay',
+    options: {
+        velocity,
+        clamp: opts?.clamp,
+        elastic: opts?.elastic,
+        onStart: opts?.onStart,
+        onChange: opts?.onChange,
+        onComplete: opts?.onComplete,
+    },
+});
+const withDelay = (ms) => ({
+    type: 'delay',
+    options: { delay: ms },
+});
+const withSequence = (animations, opts) => ({
+    type: 'sequence',
+    options: {
+        animations,
+        onStart: opts?.onStart,
+        onComplete: opts?.onComplete,
+    },
+});
+// Wraps `descriptor` with a delay proportional to `index`, so animating a
+// list of items with increasing `index` makes them start one after another
+// instead of all at once. `each` is the delay step between consecutive
+// items (default 50ms); `delay` is a base delay applied before staggering
+// starts (default 0).
+const withStagger = (index, descriptor, opts) => {
+    const each = opts?.each ?? 50;
+    const baseDelay = opts?.delay ?? 0;
+    const totalDelay = baseDelay + index * each;
+    if (totalDelay <= 0)
+        return descriptor;
+    return withSequence([withDelay(totalDelay), descriptor]);
+};
+const withLoop = (animation, iterations = Infinity, opts) => ({
+    type: 'loop',
+    options: {
+        animation,
+        iterations,
+        onStart: opts?.onStart,
+        onComplete: opts?.onComplete,
+    },
+});function useValue(initial) {
+    const controllerRef = useRef(null);
+    const value = useMemo(() => {
+        if (Array.isArray(initial)) {
+            return initial.map((v) => new AnimateValue(v));
+        }
+        if (typeof initial === 'object') {
+            return Object.fromEntries(Object.entries(initial).map(([k, v]) => [k, new AnimateValue(v)]));
+        }
+        return new AnimateValue(initial);
+    }, []);
+    function set(to) {
+        let ctrl = null;
+        if (Array.isArray(initial)) {
+            ctrl = handleArray(value, to);
+        }
+        else if (typeof initial === 'object') {
+            ctrl = handleObject(value, to);
+        }
+        else {
+            ctrl = handlePrimitive(value, to);
+        }
+        controllerRef.current = ctrl;
+        if (ctrl)
+            ctrl.start();
+    }
+    const controls = {
+        start: () => controllerRef.current?.start(),
+        pause: () => controllerRef.current?.pause(),
+        resume: () => controllerRef.current?.resume(),
+        cancel: () => controllerRef.current?.cancel(),
+        reset: () => controllerRef.current?.reset(),
+    };
+    return [value, set, controls];
+}
+function handlePrimitive(value, to) {
+    if (typeof to === 'number' || typeof to === 'string') {
+        value.set(to);
+        return null;
+    }
+    if (to.type === 'sequence') {
+        const animations = to.options?.animations ?? [];
+        const controllers = animations.map((step) => buildAnimation(value, step));
+        return sequence(controllers, to.options);
+    }
+    if (to.type === 'loop') {
+        const animation = to.options?.animation;
+        if (!animation)
+            return null;
+        if (animation.type === 'sequence') {
+            const animations = animation.options?.animations ?? [];
+            const controllers = animations.map((step) => buildAnimation(value, step));
+            return loop(sequence(controllers), to.options?.iterations ?? 0, to.options);
+        }
+        return loop(buildAnimation(value, animation), to.options?.iterations ?? 0, to.options);
+    }
+    return buildAnimation(value, to);
+}
+function handleArray(values, to) {
+    if (!isDescriptor(to)) {
+        to.forEach((val, i) => {
+            values[i]?.set(val);
+        });
+        return null;
+    }
+    const desc = to;
+    const valuesRecord = Object.fromEntries(values.map((value, idx) => [idx.toString(), value]));
+    switch (desc.type) {
+        case 'sequence': {
+            const controllers = desc.options.animations.map((step) => step.type === 'delay'
+                ? delay(step.options?.delay ?? 0)
+                : buildParallel(valuesRecord, {
+                    ...step,
+                    to: Array.isArray(step.to)
+                        ? Object.fromEntries(step.to.map((v, i) => [i.toString(), v]))
+                        : step.to,
+                }));
+            return sequence(controllers, desc.options);
+        }
+        case 'loop': {
+            const inner = desc.options.animation;
+            if (inner.type === 'sequence') {
+                const seqControllers = inner.options.animations.map((step) => buildParallel(valuesRecord, {
+                    ...step,
+                    to: Array.isArray(step.to)
+                        ? Object.fromEntries(step.to.map((v, i) => [i.toString(), v]))
+                        : step.to,
+                }));
+                const seq = sequence(seqControllers, filterCallbackOptions(inner.options, true));
+                return loop(seq, desc.options.iterations ?? 0, filterCallbackOptions(desc.options, true));
+            }
+            const parallel = buildParallel(valuesRecord, inner);
+            return loop(parallel, desc.options.iterations ?? 0, filterCallbackOptions(desc.options, true));
+        }
+        case 'decay':
+            return buildParallel(valuesRecord, desc);
+        default:
+            return buildParallel(valuesRecord, desc);
+    }
+}
+function handleObject(values, to) {
+    if (isDescriptor(to)) {
+        switch (to.type) {
+            case 'sequence': {
+                const controllers = to.options.animations.map((step) => step.type === 'delay'
+                    ? delay(step.options.delay ?? 0)
+                    : buildParallel(values, step));
+                return sequence(controllers, to.options);
+            }
+            case 'loop': {
+                const inner = to.options.animation;
+                if (inner.type === 'sequence') {
+                    const controllers = inner.options.animations.map((step) => buildParallel(values, step));
+                    return loop(sequence(controllers, filterCallbackOptions(inner.options, true)), to.options.iterations ?? 0, filterCallbackOptions(to.options, true));
+                }
+                return loop(buildParallel(values, inner), to.options.iterations ?? 0, filterCallbackOptions(to.options, true));
+            }
+            case 'decay':
+                return buildParallel(values, to);
+            default:
+                return buildParallel(values, to);
+        }
+    }
+    Object.entries(to).forEach(([key, val]) => {
+        values[key]?.set(val);
+    });
+    return null;
+}/**
+ * Animation Recipes - Pre-built, tested animations for common use cases
+ */
+// Shared spring configs, reused across recipes below (deduped so the
+// minifier can collapse repeated `{ stiffness, damping }` literals into a
+// single shared reference instead of ~40 structurally-identical copies).
+const SOFT = { stiffness: 100, damping: 15 };
+const SCALE = { stiffness: 200, damping: 20 };
+const BOUNCE = { stiffness: 300, damping: 10 };
+const SPIN = { stiffness: 50, damping: 10 };
+const FLIP = { stiffness: 150, damping: 15 };
+const HOVER = { stiffness: 300, damping: 20 };
+const PRESS = { stiffness: 400, damping: 25 };
+const soft = (to) => /*#__PURE__*/ withSpring(to, SOFT);
+const scale = (to) => /*#__PURE__*/ withSpring(to, SCALE);
+const fadeIn = { opacity: soft(1) };
+const fadeOut = { opacity: soft(0) };
+const fadeInUp = { opacity: soft(1), translateY: soft(0) };
+const fadeInDown = { opacity: soft(1), translateY: soft(0) };
+const fadeInLeft = { opacity: soft(1), translateX: soft(0) };
+const fadeInRight = { opacity: soft(1), translateX: soft(0) };
+const slideInUp = { translateY: soft(0) };
+const slideInDown = { translateY: soft(0) };
+const slideInLeft = { translateX: soft(0) };
+const slideInRight = { translateX: soft(0) };
+const slideOutUp = { translateY: soft(-100) };
+const slideOutDown = { translateY: soft(100) };
+const slideOutLeft = { translateX: soft(-100) };
+const slideOutRight = { translateX: soft(100) };
+const scaleIn = { scale: scale(1), opacity: soft(1) };
+const scaleOut = { scale: scale(0), opacity: soft(0) };
+const scaleUp = {
+    scale: /*#__PURE__*/ withSpring(1.1, { stiffness: 150, damping: 15 }),
+};
+const scaleDown = {
+    scale: /*#__PURE__*/ withSpring(0.9, { stiffness: 150, damping: 15 }),
+};
+const bounceIn = {
+    scale: /*#__PURE__*/ withSpring(1, BOUNCE),
+    opacity: soft(1),
+};
+const bounceOut = {
+    scale: /*#__PURE__*/ withSpring(0, BOUNCE),
+    opacity: soft(0),
+};
+const rotateIn = { rotate: soft(0), opacity: soft(1) };
+const rotateOut = { rotate: soft(180), opacity: soft(0) };
+const spin = {
+    rotate: /*#__PURE__*/ withSpring(360, SPIN),
+};
+const zoomIn = { scale: scale(1), opacity: soft(1) };
+const zoomOut = { scale: scale(0), opacity: soft(0) };
+const flipX = {
+    rotateX: /*#__PURE__*/ withSpring(0, FLIP),
+};
+const flipY = {
+    rotateY: /*#__PURE__*/ withSpring(0, FLIP),
+};
+const slideFadeIn = { opacity: soft(1), translateY: soft(0) };
+const slideFadeOut = { opacity: soft(0), translateY: soft(20) };
+const scaleFadeIn = { scale: scale(1), opacity: soft(1) };
+const scaleFadeOut = {
+    scale: /*#__PURE__*/ withSpring(0.8, SCALE),
+    opacity: soft(0),
+};
+const hoverScale = {
+    scale: /*#__PURE__*/ withSpring(1.05, HOVER),
+};
+const hoverLift = {
+    translateY: /*#__PURE__*/ withSpring(-5, HOVER),
+    scale: /*#__PURE__*/ withSpring(1.02, HOVER),
+};
+const hoverGlow = {
+    scale: /*#__PURE__*/ withSpring(1.05, HOVER),
+    opacity: /*#__PURE__*/ withSpring(0.9, HOVER),
+};
+const pressScale = {
+    scale: /*#__PURE__*/ withSpring(0.95, PRESS),
+};
+const pressDown = {
+    translateY: /*#__PURE__*/ withSpring(2, PRESS),
+    scale: /*#__PURE__*/ withSpring(0.98, PRESS),
+};
+const exitFade = { opacity: soft(0) };
+const exitSlideUp = { opacity: soft(0), translateY: soft(-20) };
+const exitSlideDown = { opacity: soft(0), translateY: soft(20) };
+const exitScale = {
+    scale: /*#__PURE__*/ withSpring(0.8, SCALE),
+    opacity: soft(0),
+};
+const recipes = {
+    fadeIn,
+    fadeOut,
+    fadeInUp,
+    fadeInDown,
+    fadeInLeft,
+    fadeInRight,
+    slideInUp,
+    slideInDown,
+    slideInLeft,
+    slideInRight,
+    slideOutUp,
+    slideOutDown,
+    slideOutLeft,
+    slideOutRight,
+    scaleIn,
+    scaleOut,
+    scaleUp,
+    scaleDown,
+    bounceIn,
+    bounceOut,
+    rotateIn,
+    rotateOut,
+    spin,
+    zoomIn,
+    zoomOut,
+    flipX,
+    flipY,
+    slideFadeIn,
+    slideFadeOut,
+    scaleFadeIn,
+    scaleFadeOut,
+    hoverScale,
+    hoverLift,
+    hoverGlow,
+    pressScale,
+    pressDown,
+    exitFade,
+    exitSlideUp,
+    exitSlideDown,
+    exitScale,
+};function useOutsideClick(ref, callback, deps = []) {
+    const cbRef = useRef(callback);
+    useEffect(() => {
+        cbRef.current = callback;
+    }, [callback, ...deps]);
+    useEffect(() => {
+        function onClick(event) {
+            const el = ref.current;
+            const target = event.target;
+            if (!el || !target || !target.isConnected || !el.isConnected)
+                return;
+            if (!el.contains(target)) {
+                cbRef.current(event);
+            }
+        }
+        document.addEventListener('mousedown', onClick);
+        document.addEventListener('touchstart', onClick);
+        return () => {
+            document.removeEventListener('mousedown', onClick);
+            document.removeEventListener('touchstart', onClick);
+        };
+    }, [ref]);
+}class Gesture {
+    constructor() {
+        this.changeListeners = new Set();
+        this.endListeners = new Set();
+    }
+    onChange(listener) {
+        this.changeListeners.add(listener);
+        return this;
+    }
+    onEnd(listener) {
+        this.endListeners.add(listener);
+        return this;
+    }
+    emitChange(event) {
+        this.changeListeners.forEach((fn) => fn(event));
+    }
+    emitEnd(event) {
+        this.endListeners.forEach((fn) => fn(event));
+    }
+}
+Gesture.VELOCITY_LIMIT = 20;class DragGesture extends Gesture {
+    constructor(config = {}) {
+        super();
+        this.prev = { x: 0, y: 0 };
+        this.lastTime = 0;
+        this.movement = { x: 0, y: 0 };
+        this.velocity = { x: 0, y: 0 };
+        this.start = { x: 0, y: 0 };
+        this.offset = { x: 0, y: 0 };
+        this.pointerCaptured = false;
+        this.activePointerId = null;
+        this.attachedEls = new Set();
+        this.activeEl = null;
+        this.pointerDownPos = { x: 0, y: 0 };
+        this.thresholdPassed = false;
+        this.config = config;
+    }
+    attach(elements) {
+        if (elements === window)
+            return () => { };
+        const els = Array.isArray(elements) ? elements : [elements];
+        const down = this.onDown.bind(this);
+        const move = this.onMove.bind(this);
+        const up = this.onUp.bind(this);
+        els.forEach((el) => {
+            this.attachedEls.add(el);
+            el.addEventListener('pointerdown', down, { passive: false });
+        });
+        window.addEventListener('pointermove', move, { passive: false });
+        window.addEventListener('pointerup', up);
+        window.addEventListener('pointercancel', up);
+        return () => {
+            els.forEach((el) => {
+                el.removeEventListener('pointerdown', down);
+                this.attachedEls.delete(el);
+            });
+            window.removeEventListener('pointermove', move);
+            window.removeEventListener('pointerup', up);
+            window.removeEventListener('pointercancel', up);
+        };
+    }
+    onDown(e) {
+        if (e.button !== 0)
+            return;
+        const target = e.currentTarget;
+        if (!this.attachedEls.has(target))
+            return;
+        this.activeEl = target;
+        this.activePointerId = e.pointerId;
+        this.pointerCaptured = false;
+        this.start =
+            this.thresholdPassed === false && this.start.x === 0 && this.start.y === 0
+                ? this.config.initial?.() ?? { x: 0, y: 0 }
+                : { ...this.offset };
+        this.offset = { ...this.start };
+        this.movement = { x: 0, y: 0 };
+        this.velocity = { x: 0, y: 0 };
+        this.pointerDownPos = { x: e.clientX, y: e.clientY };
+        this.thresholdPassed = false;
+        this.prev = { x: e.clientX, y: e.clientY };
+        this.lastTime = e.timeStamp;
+        this.emitChange({
+            down: true,
+            movement: { x: 0, y: 0 },
+            offset: { ...this.offset },
+            velocity: { x: 0, y: 0 },
+            event: e,
+            cancel: this.cancel.bind(this),
+        });
+    }
+    onMove(e) {
+        if (this.activePointerId !== e.pointerId || !this.activeEl)
+            return;
+        const threshold = this.config.threshold ?? 0;
+        if (!this.thresholdPassed) {
+            const dxTotal = e.clientX - this.pointerDownPos.x;
+            const dyTotal = e.clientY - this.pointerDownPos.y;
+            const dist = Math.hypot(dxTotal, dyTotal);
+            if (dist < threshold)
+                return;
+            this.thresholdPassed = true;
+            this.activeEl.setPointerCapture(e.pointerId);
+            this.pointerCaptured = true;
+        }
+        if (this.pointerCaptured) {
+            e.preventDefault();
+        }
+        const dt = Math.max((e.timeStamp - this.lastTime) / 1000, 1e-6);
+        this.lastTime = e.timeStamp;
+        const dx = e.clientX - this.prev.x;
+        const dy = e.clientY - this.prev.y;
+        const rawX = dx / dt / 1000;
+        const rawY = dy / dt / 1000;
+        this.velocity = {
+            x: clamp(rawX, -Gesture.VELOCITY_LIMIT, Gesture.VELOCITY_LIMIT),
+            y: clamp(rawY, -Gesture.VELOCITY_LIMIT, Gesture.VELOCITY_LIMIT),
+        };
+        const moveRaw = {
+            x: e.clientX - this.pointerDownPos.x,
+            y: e.clientY - this.pointerDownPos.y,
+        };
+        this.movement = {
+            x: this.config.axis === 'y' ? 0 : moveRaw.x,
+            y: this.config.axis === 'x' ? 0 : moveRaw.y,
+        };
+        this.offset = {
+            x: this.start.x + this.movement.x,
+            y: this.start.y + this.movement.y,
+        };
+        this.prev = { x: e.clientX, y: e.clientY };
+        this.emitChange({
+            down: true,
+            movement: { ...this.movement },
+            offset: { ...this.offset },
+            velocity: { ...this.velocity },
+            event: e,
+            cancel: this.cancel.bind(this),
+        });
+    }
+    onUp(e) {
+        if (this.activePointerId !== e.pointerId || !this.activeEl)
+            return;
+        this.activeEl.releasePointerCapture(e.pointerId);
+        this.emitEnd({
+            down: false,
+            movement: { ...this.movement },
+            offset: { ...this.offset },
+            velocity: { ...this.velocity },
+            event: e,
+            cancel: this.cancel.bind(this),
+        });
+        this.activePointerId = null;
+        this.pointerCaptured = false;
+    }
+    cancel() {
+        if (this.activeEl && this.activePointerId !== null) {
+            this.activeEl.releasePointerCapture(this.activePointerId);
+            this.activePointerId = null;
+            this.activeEl = null;
+        }
+    }
+}function useRecognizer(GestureClass, refs, onEvent, config) {
+    const handlerRef = useLatest(onEvent);
+    const configRef = useLatest(config);
+    if (refs === window) {
+        const gestureRef = useRef();
+        if (!gestureRef.current) {
+            const g = new GestureClass(configRef.current);
+            const handler = (e) => handlerRef.current({ ...e, index: 0 });
+            g.onChange(handler).onEnd(handler);
+            gestureRef.current = g;
+        }
+        useEffect(() => {
+            const cleanup = gestureRef.current.attach(window);
+            return () => {
+                cleanup();
+            };
+        }, [refs]);
+        return;
+    }
+    const list = Array.isArray(refs) ? refs : [refs];
+    const gesturesRef = useRef([]);
+    const prevCleanupsRef = useRef([]);
+    const listLengthRef = useRef(list.length);
+    if (gesturesRef.current.length !== list.length) {
+        gesturesRef.current = list.map((_, i) => {
+            const g = new GestureClass(configRef.current);
+            const handler = (e) => handlerRef.current({ ...e, index: i });
+            g.onChange(handler).onEnd(handler);
+            return g;
+        });
+        listLengthRef.current = list.length;
+    }
+    useEffect(() => {
+        prevCleanupsRef.current.forEach((fn) => fn());
+        prevCleanupsRef.current = [];
+        const cleanups = [];
+        list.forEach((r, i) => {
+            const el = r.current;
+            if (el && gesturesRef.current[i]) {
+                const cleanup = gesturesRef.current[i].attach(el);
+                cleanups.push(cleanup);
+            }
+        });
+        prevCleanupsRef.current = cleanups;
+        return () => {
+            cleanups.forEach((fn) => fn());
+            prevCleanupsRef.current = [];
+        };
+    }, [list]);
+}
+function useLatest(value) {
+    const ref = useRef(value);
+    useEffect(() => {
+        ref.current = value;
+    }, [value]);
+    return ref;
+}function useDrag(refs, onDrag, config) {
+    return useRecognizer(DragGesture, refs, onDrag, config);
+}class MoveGesture extends Gesture {
+    constructor() {
+        super(...arguments);
+        this.attachedEls = new Set();
+        this.prev = { x: 0, y: 0 };
+        this.lastTime = 0;
+        this.movement = { x: 0, y: 0 };
+        this.offset = { x: 0, y: 0 };
+        this.velocity = { x: 0, y: 0 };
+        this.startPos = null;
+    }
+    attach(elements) {
+        const els = Array.isArray(elements) ? elements : [elements];
+        const move = this.onMove.bind(this);
+        const leave = this.onLeave.bind(this);
+        els.forEach((el) => {
+            this.attachedEls.add(el);
+            el.addEventListener('pointermove', move, { passive: false });
+            el.addEventListener('pointerleave', leave);
+        });
+        return () => {
+            els.forEach((el) => {
+                el.removeEventListener('pointermove', move);
+                el.removeEventListener('pointerleave', leave);
+                this.attachedEls.delete(el);
+            });
+        };
+    }
+    cancel() { }
+    onMove(e) {
+        const now = e.timeStamp;
+        if (this.startPos === null) {
+            this.startPos = { x: e.clientX, y: e.clientY };
+            this.prev = { x: e.clientX, y: e.clientY };
+            this.lastTime = now;
+        }
+        const dt = Math.max((now - this.lastTime) / 1000, 1e-6);
+        this.lastTime = now;
+        const dx = e.clientX - this.prev.x;
+        const dy = e.clientY - this.prev.y;
+        this.prev = { x: e.clientX, y: e.clientY };
+        this.movement = {
+            x: e.clientX - this.startPos.x,
+            y: e.clientY - this.startPos.y,
+        };
+        const tgt = e.currentTarget;
+        const rect = tgt instanceof HTMLElement
+            ? tgt.getBoundingClientRect()
+            : { left: 0, top: 0 };
+        this.offset = {
+            x: e.clientX - rect.left,
+            y: e.clientY - rect.top,
+        };
+        const rawVx = dx / dt / 1000;
+        const rawVy = dy / dt / 1000;
+        this.velocity = {
+            x: clamp(rawVx, -Gesture.VELOCITY_LIMIT, Gesture.VELOCITY_LIMIT),
+            y: clamp(rawVy, -Gesture.VELOCITY_LIMIT, Gesture.VELOCITY_LIMIT),
+        };
+        this.emitChange({
+            movement: { ...this.movement },
+            offset: { ...this.offset },
+            velocity: { ...this.velocity },
+            event: e,
+            cancel: () => this.onLeave(e),
+        });
+    }
+    onLeave(e) {
+        this.emitEnd({
+            movement: { ...this.movement },
+            offset: { ...this.offset },
+            velocity: { ...this.velocity },
+            event: e,
+            cancel: () => { },
+        });
+    }
+}function useMove(refs, onMove) {
+    return useRecognizer(MoveGesture, refs, onMove);
+}class ScrollGesture extends Gesture {
+    constructor() {
+        super(...arguments);
+        this.attachedEls = new Set();
+        this.movement = { x: 0, y: 0 };
+        this.offset = { x: 0, y: 0 };
+        this.velocity = { x: 0, y: 0 };
+        this.prevScroll = { x: 0, y: 0 };
+        this.lastTime = 0;
+    }
+    attach(elements) {
+        const els = Array.isArray(elements) ? elements : [elements];
+        const scroll = this.onScroll.bind(this);
+        els.forEach((el) => {
+            this.attachedEls.add(el);
+            el.addEventListener('scroll', scroll, { passive: true });
+        });
+        return () => {
+            els.forEach((el) => {
+                el.removeEventListener('scroll', scroll);
+                this.attachedEls.delete(el);
+            });
+            if (this.endTimeout != null) {
+                clearTimeout(this.endTimeout);
+                this.endTimeout = undefined;
+            }
+        };
+    }
+    cancel() { }
+    onScroll(e) {
+        const now = Date.now();
+        const dt = Math.max((now - this.lastTime) / 1000, 1e-6);
+        this.lastTime = now;
+        const tgt = e.currentTarget;
+        const x = tgt instanceof HTMLElement ? tgt.scrollLeft : window.scrollX;
+        const y = tgt instanceof HTMLElement ? tgt.scrollTop : window.scrollY;
+        const dx = x - this.prevScroll.x;
+        const dy = y - this.prevScroll.y;
+        this.prevScroll = { x, y };
+        this.movement = { x: dx, y: dy };
+        this.offset = { x, y };
+        const rawX = dx / dt / 1000;
+        const rawY = dy / dt / 1000;
+        this.velocity = {
+            x: clamp(rawX, -Gesture.VELOCITY_LIMIT, Gesture.VELOCITY_LIMIT),
+            y: clamp(rawY, -Gesture.VELOCITY_LIMIT, Gesture.VELOCITY_LIMIT),
+        };
+        this.emitChange({
+            movement: { ...this.movement },
+            offset: { ...this.offset },
+            velocity: { ...this.velocity },
+            event: e,
+            cancel: () => {
+                if (this.endTimeout != null)
+                    clearTimeout(this.endTimeout);
+            },
+        });
+        if (this.endTimeout != null)
+            clearTimeout(this.endTimeout);
+        this.endTimeout = window.setTimeout(() => {
+            this.emitEnd({
+                movement: { ...this.movement },
+                offset: { ...this.offset },
+                velocity: { ...this.velocity },
+                event: e,
+                cancel: () => { },
+            });
+        }, 150);
+    }
+}function useScrollProgress(refs, { target, axis = 'y', offset = ['start start', 'end end'], animate = true, toDescriptor = (v) => withSpring(v), } = {}) {
+    const [yProgress, setYProgress] = useValue(0);
+    const [xProgress, setXProgress] = useValue(0);
+    const rangeRef = useRef([0, 0]);
+    useEffect(() => {
+        const containerEl = refs instanceof Window ? window : refs.current;
+        const targetEl = target?.current ?? document.documentElement;
+        rangeRef.current = getScrollRange(offset, targetEl, containerEl, axis);
+    }, [refs, target, axis, offset]);
+    useRecognizer(ScrollGesture, refs, (e) => {
+        const pos = axis === 'y' ? e.offset.y : e.offset.x;
+        const [start, end] = rangeRef.current;
+        const raw = end === start ? (pos < start ? 0 : 1) : (pos - start) / (end - start);
+        const t = Math.min(Math.max(raw, 0), 1);
+        const apply = animate ? toDescriptor : (v) => v;
+        if (axis === 'y') {
+            setYProgress(apply(t));
+            setXProgress(0);
+        }
+        else {
+            setXProgress(apply(t));
+            setYProgress(0);
+        }
+    });
+    return { scrollYProgress: yProgress, scrollXProgress: xProgress };
+}
+function getScroll(el, axis) {
+    if (el instanceof HTMLElement) {
+        return axis === 'y' ? el.scrollTop : el.scrollLeft;
+    }
+    return axis === 'y' ? window.scrollY : window.scrollX;
+}
+function getSize(el, axis) {
+    if (el instanceof HTMLElement) {
+        return axis === 'y' ? el.clientHeight : el.clientWidth;
+    }
+    return axis === 'y' ? window.innerHeight : window.innerWidth;
+}
+function getScrollRange([startMarker, endMarker], targetEl, containerEl, axis) {
+    return [
+        resolveMarker(startMarker, targetEl, containerEl, axis),
+        resolveMarker(endMarker, targetEl, containerEl, axis),
+    ];
+}
+function resolveMarker(marker, targetEl, containerEl, axis) {
+    const [tMark, cMark = tMark] = marker.trim().split(/\s+/);
+    if (containerEl instanceof HTMLElement) {
+        const tRect = targetEl.getBoundingClientRect();
+        const cRect = containerEl.getBoundingClientRect();
+        const scroll = getScroll(containerEl, axis);
+        const elementStart = (axis === 'y' ? tRect.top - cRect.top : tRect.left - cRect.left) + scroll;
+        const elementSize = axis === 'y' ? tRect.height : tRect.width;
+        const containerSize = getSize(containerEl, axis);
+        const elemPos = resolveEdge(tMark, elementStart, elementSize, containerSize);
+        const contPos = resolveEdge(cMark, 0, containerSize, containerSize);
+        return elemPos - contPos;
+    }
+    else {
+        const elemPos = parseEdgeValue(tMark, axis, targetEl, false);
+        const contPos = parseEdgeValue(cMark, axis, window, true);
+        return elemPos - contPos;
+    }
+}
+function resolveEdge(edge, base, size, containerSize) {
+    if (edge === 'start')
+        return base;
+    if (edge === 'center')
+        return base + size / 2;
+    if (edge === 'end')
+        return base + size;
+    const m = edge.match(/^(-?\d+(?:\.\d+)?)(px|%|vw|vh)?$/);
+    if (!m)
+        throw new Error(`Invalid edge marker “${edge}”`);
+    const n = parseFloat(m[1]);
+    const unit = m[2];
+    switch (unit) {
+        case 'px':
+            return base + n;
+        case '%':
+            return base + (n / 100) * size;
+        case 'vw':
+            return base + (n / 100) * containerSize;
+        case 'vh':
+            return base + (n / 100) * containerSize;
+        default:
+            return base + n * size;
+    }
+}
+function parseEdgeValue(edge, axis, el, isContainer) {
+    const scrollTarget = isContainer ? el : el;
+    const base = isContainer
+        ? 0
+        : (() => {
+            if (!(el instanceof HTMLElement))
+                throw new Error('Expected HTMLElement for element-relative edge');
+            const rect = el.getBoundingClientRect();
+            const pageScroll = axis === 'y'
+                ? window.pageYOffset || window.scrollY
+                : window.pageXOffset || window.scrollX;
+            return (axis === 'y' ? rect.top : rect.left) + pageScroll;
+        })();
+    const size = isContainer
+        ? getSize(el, axis)
+        : (() => {
+            if (!(el instanceof HTMLElement))
+                throw new Error();
+            const rect = el.getBoundingClientRect();
+            return axis === 'y' ? rect.height : rect.width;
+        })();
+    return resolveEdge(edge, base, size, getSize(scrollTarget, axis));
+}function useScroll(refs, arg) {
+    if (typeof arg === 'function') {
+        return useRecognizer(ScrollGesture, refs, arg);
+    }
+    return useScrollProgress(refs, arg);
+}class WheelGesture extends Gesture {
+    constructor() {
+        super(...arguments);
+        this.attachedEls = new Set();
+        this.movement = { x: 0, y: 0 };
+        this.offset = { x: 0, y: 0 };
+        this.velocity = { x: 0, y: 0 };
+        this.lastTime = 0;
+    }
+    attach(elements) {
+        const els = Array.isArray(elements) ? elements : [elements];
+        const wheel = this.onWheel.bind(this);
+        els.forEach((el) => {
+            this.attachedEls.add(el);
+            el.addEventListener('wheel', wheel, { passive: false });
+        });
+        return () => {
+            els.forEach((el) => {
+                el.removeEventListener('wheel', wheel);
+                this.attachedEls.delete(el);
+            });
+            if (this.endTimeout != null) {
+                clearTimeout(this.endTimeout);
+                this.endTimeout = undefined;
+            }
+        };
+    }
+    cancel() { }
+    onWheel(e) {
+        e.preventDefault();
+        const now = e.timeStamp;
+        const dt = Math.max((now - this.lastTime) / 1000, 1e-6);
+        this.lastTime = now;
+        const dx = e.deltaX;
+        const dy = e.deltaY;
+        this.movement = { x: dx, y: dy };
+        this.offset.x += dx;
+        this.offset.y += dy;
+        const rawX = dx / dt / 1000;
+        const rawY = dy / dt / 1000;
+        this.velocity = {
+            x: clamp(rawX, -Gesture.VELOCITY_LIMIT, Gesture.VELOCITY_LIMIT),
+            y: clamp(rawY, -Gesture.VELOCITY_LIMIT, Gesture.VELOCITY_LIMIT),
+        };
+        this.emitChange({
+            movement: { ...this.movement },
+            offset: { ...this.offset },
+            velocity: { ...this.velocity },
+            event: e,
+            cancel: () => {
+                if (this.endTimeout != null)
+                    clearTimeout(this.endTimeout);
+            },
+        });
+        if (this.endTimeout != null)
+            clearTimeout(this.endTimeout);
+        this.endTimeout = window.setTimeout(() => {
+            this.emitEnd({
+                movement: { ...this.movement },
+                offset: { ...this.offset },
+                velocity: { ...this.velocity },
+                event: e,
+                cancel: () => { },
+            });
+        }, 150);
+    }
+}function useWheel(refs, onWheel) {
+    return useRecognizer(WheelGesture, refs, onWheel);
+}export{AnimateValue,Easing,Presence,PresenceContext,animate,bounceIn,bounceOut,clamp,combine,decay,delay,exitFade,exitScale,exitSlideDown,exitSlideUp,fadeIn,fadeInDown,fadeInLeft,fadeInRight,fadeInUp,fadeOut,flipX,flipY,hoverGlow,hoverLift,hoverScale,isAnimateValue,loop,makeAnimated,move,parallel,pressDown,pressScale,recipes,rotateIn,rotateOut,rubberClamp,scaleDown,scaleFadeIn,scaleFadeOut,scaleIn,scaleOut,scaleUp,sequence,slideFadeIn,slideFadeOut,slideInDown,slideInLeft,slideInRight,slideInUp,slideOutDown,slideOutLeft,slideOutRight,slideOutUp,snapTo,spin,spring,timing,to,useDrag,useInView,useIsPresent,useMove,useOutsideClick,usePresence,useRecognizer,useScroll,useScrollProgress,useValue,useWheel,withDecay,withDelay,withLoop,withSequence,withSpring,withStagger,withTiming,zoomIn,zoomOut};