@clicktap/ui 1.2.1 → 2.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Accordion/Accordion.d.ts +76 -2
- package/components/Accordion/Accordion.js +1 -1
- package/components/Accordion/index.d.ts +2 -3
- package/components/Accordion/index.js +1 -1
- package/components/Badge/Badge.js +1 -1
- package/components/Badge/Badge.types.d.ts +27 -2
- package/components/Badge/index.js +1 -1
- package/components/Collapsible/Collapsible.js +1 -1
- package/components/Collection/CollectionFilters/CollectionFilters.js +1 -1
- package/components/Collection/CollectionFilters/index.js +1 -1
- package/components/Collection/CollectionToolbar/CollectionToolbar.js +1 -1
- package/components/Collection/ProductCardSwatches/ProductCardSwatches.js +1 -1
- package/components/Collection/index.js +1 -1
- package/components/ContextMenu/ContextMenu.js +1 -1
- package/components/DialogTrigger/DialogTrigger.d.ts +18 -10
- package/components/DialogTrigger/DialogTrigger.js +1 -1
- package/components/DialogTrigger/index.js +1 -1
- package/components/Drawer/Drawer.js +1 -1
- package/components/Menu/Menu.js +1 -1
- package/components/Meter/Meter.js +1 -1
- package/components/NumberTicker/DigitResolver.js +1 -1
- package/components/NumberTicker/NumberTicker.js +1 -1
- package/components/Pagination/Pagination.d.ts +27 -2
- package/components/Pagination/Pagination.js +1 -1
- package/components/Pagination/index.js +1 -1
- package/components/Progressbar/LinearProgressbar.js +1 -1
- package/components/Tabs/Tab.js +1 -1
- package/components/Tooltip/Tooltip.d.ts +9 -1
- package/components/Tooltip/Tooltip.js +1 -1
- package/components/Tooltip/Tooltip.types.d.ts +21 -2
- package/components/Tooltip/index.js +1 -1
- package/components/UploadImage/UploadImage.js +1 -1
- package/docs/migrations/2026/08/ui-2026-08-21-graphql-client-string-documents.md +45 -0
- package/docs/migrations/2026/08/ui-2026-08-21-graphql-peer-covered.md +26 -0
- package/docs/migrations/2026/08/ui-2026-08-21-heroui-removed.md +54 -0
- package/docs/migrations/2026/08/ui-2026-08-21-lazymotion-m-components.md +54 -0
- package/docs/migrations/2026/08/ui-2026-08-21-modal-triggers-wired-explicitly.md +43 -0
- package/docs/migrations/2026/08/ui-2026-08-21-next-image-fallback-keeps-fill.md +38 -0
- package/docs/migrations/2026/08/ui-2026-08-22-accordion-divider-between-items.md +30 -0
- package/docs/migrations/2026/08/ui-2026-08-22-accordion-divider-class-ownership.md +14 -0
- package/docs/migrations/2026/08/ui-2026-08-22-collection-accessibility-fixes.md +28 -0
- package/docs/migrations/2026/08/ui-2026-08-22-react-aria-moves-as-one-version-set.md +46 -0
- package/docs/migrations/index.json +101 -0
- package/next/Image.js +1 -1
- package/package.json +10 -38
- package/utils/createAuthAwareGraphqlClient.d.ts +104 -16
- package/utils/createAuthAwareGraphqlClient.js +1 -56
package/components/Menu/Menu.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsxs as Be,jsx as oe,Fragment as $t}from"react/jsx-runtime";import*as v from"react";import{useLayoutEffect as vt,useState as Nt,useRef as Wt,useId as Vt,cloneElement as Bt}from"react";import{motion as Ht}from"framer-motion";import*as Kt from"react-dom";function Te(){return typeof window<"u"}function ae(e){return wt(e)?(e.nodeName||"").toLowerCase():"#document"}function K(e){var t;return(e==null||(t=e.ownerDocument)==null?void 0:t.defaultView)||window}function J(e){var t;return(t=(wt(e)?e.ownerDocument:e.document)||window.document)==null?void 0:t.documentElement}function wt(e){return Te()?e instanceof Node||e instanceof K(e).Node:!1}function N(e){return Te()?e instanceof Element||e instanceof K(e).Element:!1}function X(e){return Te()?e instanceof HTMLElement||e instanceof K(e).HTMLElement:!1}function He(e){return!Te()||typeof ShadowRoot>"u"?!1:e instanceof ShadowRoot||e instanceof K(e).ShadowRoot}function Me(e){const{overflow:t,overflowX:n,overflowY:o,display:r}=j(e);return/auto|scroll|overlay|hidden|clip/.test(t+o+n)&&r!=="inline"&&r!=="contents"}function Xt(e){return/^(table|td|th)$/.test(ae(e))}function Se(e){try{if(e.matches(":popover-open"))return!0}catch{}try{return e.matches(":modal")}catch{return!1}}const Ut=/transform|translate|scale|rotate|perspective|filter/,jt=/paint|layout|strict|content/,ne=e=>!!e&&e!=="none";let Ie;function je(e){const t=N(e)?j(e):e;return ne(t.transform)||ne(t.translate)||ne(t.scale)||ne(t.rotate)||ne(t.perspective)||!Le()&&(ne(t.backdropFilter)||ne(t.filter))||Ut.test(t.willChange||"")||jt.test(t.contain||"")}function Yt(e){let t=te(e);for(;X(t)&&!Z(t);){if(je(t))return t;if(Se(t))return null;t=te(t)}return null}function Le(){return Ie==null&&(Ie=typeof CSS<"u"&&CSS.supports&&CSS.supports("-webkit-backdrop-filter","none")),Ie}function Z(e){return/^(html|body|#document)$/.test(ae(e))}function j(e){return K(e).getComputedStyle(e)}function Ae(e){return N(e)?{scrollLeft:e.scrollLeft,scrollTop:e.scrollTop}:{scrollLeft:e.scrollX,scrollTop:e.scrollY}}function te(e){if(ae(e)==="html")return e;const t=e.assignedSlot||e.parentNode||He(e)&&e.host||J(e);return He(t)?t.host:t}function yt(e){const t=te(e);return Z(t)?(e.ownerDocument||e).body:X(t)&&Me(t)?t:yt(t)}function ee(e,t,n){var o;t===void 0&&(t=[]),n===void 0&&(n=!0);const r=yt(e),s=r===((o=e.ownerDocument)==null?void 0:o.body),i=K(r);if(s){const c=Ke(i);return t.concat(i,i.visualViewport||[],Me(r)?r:[],c&&n?ee(c):[])}else return t.concat(r,ee(r,[],n))}function Ke(e){return e.parent&&Object.getPrototypeOf(e.parent)?e.frameElement:null}const ue=Math.min,ie=Math.max,Ee=Math.round,we=Math.floor,G=e=>({x:e,y:e}),zt={left:"right",right:"left",bottom:"top",top:"bottom"};function Rt(e,t,n){return ie(e,ue(t,n))}function he(e,t){return typeof e=="function"?e(t):e}function fe(e){return e.split("-")[0]}function ve(e){return e.split("-")[1]}function xt(e){return e==="x"?"y":"x"}function Ye(e){return e==="y"?"height":"width"}function Q(e){const t=e[0];return t==="t"||t==="b"?"y":"x"}function ze(e){return xt(Q(e))}function qt(e,t,n){n===void 0&&(n=!1);const o=ve(e),r=ze(e),s=Ye(r);let i=r==="x"?o===(n?"end":"start")?"right":"left":o==="start"?"bottom":"top";return t.reference[s]>t.floating[s]&&(i=Ce(i)),[i,Ce(i)]}function Gt(e){const t=Ce(e);return[Xe(e),t,Xe(t)]}function Xe(e){return e.includes("start")?e.replace("start","end"):e.replace("end","start")}const et=["left","right"],tt=["right","left"],Jt=["top","bottom"],Qt=["bottom","top"];function Zt(e,t,n){switch(e){case"top":case"bottom":return n?t?tt:et:t?et:tt;case"left":case"right":return t?Jt:Qt;default:return[]}}function en(e,t,n,o){const r=ve(e);let s=Zt(fe(e),n==="start",o);return r&&(s=s.map(i=>i+"-"+r),t&&(s=s.concat(s.map(Xe)))),s}function Ce(e){const t=fe(e);return zt[t]+e.slice(t.length)}function tn(e){var t,n,o,r;return{top:(t=e.top)!=null?t:0,right:(n=e.right)!=null?n:0,bottom:(o=e.bottom)!=null?o:0,left:(r=e.left)!=null?r:0}}function bt(e){return typeof e!="number"?tn(e):{top:e,right:e,bottom:e,left:e}}function Oe(e){const{x:t,y:n,width:o,height:r}=e;return{width:o,height:r,top:n,left:t,right:t+o,bottom:n+r,x:t,y:n}}function nn(){const e=navigator.userAgentData;return e!=null&&e.platform?e.platform:navigator.platform}function on(){const e=navigator.userAgentData;return e&&Array.isArray(e.brands)?e.brands.map(t=>{let{brand:n,version:o}=t;return n+"/"+o}).join(" "):navigator.userAgent}function rn(){return/apple/i.test(navigator.vendor)}function sn(){return nn().toLowerCase().startsWith("mac")&&!navigator.maxTouchPoints}function cn(){return on().includes("jsdom/")}const nt="data-floating-ui-focusable",ln="input:not([type='hidden']):not([disabled]),[contenteditable]:not([contenteditable='false']),textarea:not([disabled])";function ot(e){let t=e.activeElement;for(;((n=t)==null||(n=n.shadowRoot)==null?void 0:n.activeElement)!=null;){var n;t=t.shadowRoot.activeElement}return t}function me(e,t){if(!e||!t)return!1;const n=t.getRootNode==null?void 0:t.getRootNode();if(e.contains(t))return!0;if(n&&He(n)){let o=t;for(;o;){if(e===o)return!0;o=o.parentNode||o.host}}return!1}function ce(e){return"composedPath"in e?e.composedPath()[0]:e.target}function Fe(e,t){if(t==null)return!1;if("composedPath"in e)return e.composedPath().includes(t);const n=e;return n.target!=null&&t.contains(n.target)}function un(e){return e.matches("html,body")}function re(e){return e?.ownerDocument||document}function Et(e){return X(e)&&e.matches(ln)}function fn(e){if(!e||cn())return!0;try{return e.matches(":focus-visible")}catch{return!0}}function an(e){return e?e.hasAttribute(nt)?e:e.querySelector("["+nt+"]")||e:null}function Re(e,t,n){return n===void 0&&(n=!0),e.filter(r=>{var s;return r.parentId===t&&(!n||((s=r.context)==null?void 0:s.open))}).flatMap(r=>[r,...Re(e,r.id,n)])}function dn(e){return"nativeEvent"in e}function ge(e,t){const n=["mouse","pen"];return t||n.push("",void 0),n.includes(e)}var mn=typeof document<"u",gn=function(){},z=mn?vt:gn;const pn={...v};function ye(e){const t=v.useRef(e);return z(()=>{t.current=e}),t}const hn=pn.useInsertionEffect,vn=hn||(e=>e());function Y(e){const t=v.useRef(()=>{if(process.env.NODE_ENV!=="production")throw new Error("Cannot call an event handler while rendering.")});return vn(()=>{t.current=e}),v.useCallback(function(){for(var n=arguments.length,o=new Array(n),r=0;r<n;r++)o[r]=arguments[r];return t.current==null?void 0:t.current(...o)},[])}function rt(e,t,n){let{reference:o,floating:r}=e;const s=Q(t),i=ze(t),c=Ye(i),u=fe(t),f=s==="y",g=o.x+o.width/2-r.width/2,m=o.y+o.height/2-r.height/2,d=o[c]/2-r[c]/2;let l;switch(u){case"top":l={x:g,y:o.y-r.height};break;case"bottom":l={x:g,y:o.y+o.height};break;case"right":l={x:o.x+o.width,y:m};break;case"left":l={x:o.x-r.width,y:m};break;default:l={x:o.x,y:o.y}}const p=ve(t);return p&&(l[i]+=d*(p==="end"?1:-1)*(n&&f?-1:1)),l}async function wn(e,t){var n;t===void 0&&(t={});const{x:o,y:r,platform:s,rects:i,elements:c,strategy:u}=e,{boundary:f="clippingAncestors",rootBoundary:g="viewport",elementContext:m="floating",altBoundary:d=!1,padding:l=0}=he(t,e),p=bt(l),y=c[d?m==="floating"?"reference":"floating":m],w=Oe(await s.getClippingRect({element:(n=await(s.isElement==null?void 0:s.isElement(y)))==null||n?y:y.contextElement||await(s.getDocumentElement==null?void 0:s.getDocumentElement(c.floating)),boundary:f,rootBoundary:g,strategy:u})),x=m==="floating"?{x:o,y:r,width:i.floating.width,height:i.floating.height}:i.reference,T=await(s.getOffsetParent==null?void 0:s.getOffsetParent(c.floating)),E=await(s.isElement==null?void 0:s.isElement(T))&&await(s.getScale==null?void 0:s.getScale(T))||{x:1,y:1},M=Oe(s.convertOffsetParentRelativeRectToViewportRelativeRect?await s.convertOffsetParentRelativeRectToViewportRelativeRect({elements:c,rect:x,offsetParent:T,strategy:u}):x);return{top:(w.top-M.top+p.top)/E.y,bottom:(M.bottom-w.bottom+p.bottom)/E.y,left:(w.left-M.left+p.left)/E.x,right:(M.right-w.right+p.right)/E.x}}const yn=50,Rn=async(e,t,n)=>{const{placement:o="bottom",strategy:r="absolute",middleware:s=[],platform:i}=n,c=i.detectOverflow?i:{...i,detectOverflow:wn},u=await(i.isRTL==null?void 0:i.isRTL(t));let f=await i.getElementRects({reference:e,floating:t,strategy:r}),{x:g,y:m}=rt(f,o,u),d=o,l=0;const p={};for(let a=0;a<s.length;a++){const y=s[a];if(!y)continue;const{name:w,fn:x}=y,{x:T,y:E,data:M,reset:C}=await x({x:g,y:m,initialPlacement:o,placement:d,strategy:r,middlewareData:p,rects:f,platform:c,elements:{reference:e,floating:t}});g=T??g,m=E??m,p[w]={...p[w],...M},C&&l<yn&&(l++,typeof C=="object"&&(C.placement&&(d=C.placement),C.rects&&(f=C.rects===!0?await i.getElementRects({reference:e,floating:t,strategy:r}):C.rects),{x:g,y:m}=rt(f,d,u)),a=-1)}return{x:g,y:m,placement:d,strategy:r,middlewareData:p}},xn=e=>({name:"arrow",options:e,async fn(t){const{x:n,y:o,placement:r,rects:s,platform:i,elements:c,middlewareData:u}=t,{element:f,padding:g=0}=he(e,t)||{};if(f==null)return{};const m=bt(g),d={x:n,y:o},l=ze(r),p=Ye(l),a=await i.getDimensions(f),y=l==="y",w=y?"top":"left",x=y?"bottom":"right",T=y?"clientHeight":"clientWidth",E=s.reference[p]+s.reference[l]-d[l]-s.floating[p],M=d[l]-s.reference[l],C=await(i.getOffsetParent==null?void 0:i.getOffsetParent(f));let P=C?C[T]:0;(!P||!await(i.isElement==null?void 0:i.isElement(C)))&&(P=c.floating[T]||s.floating[p]);const S=E/2-M/2,$=P/2-a[p]/2-1,I=ue(m[w],$),W=ue(m[x],$),_=P-a[p]-W,F=P/2-a[p]/2+S,R=Rt(I,F,_),L=!u.arrow&&ve(r)!=null&&F!==R&&s.reference[p]/2-(F<I?I:W)-a[p]/2<0,A=L?F<I?F-I:F-_:0;return{[l]:d[l]+A,data:{[l]:R,centerOffset:F-R-A,...L&&{alignmentOffset:A}},reset:L}}}),bn=function(e){return e===void 0&&(e={}),{name:"flip",options:e,async fn(t){var n,o;const{placement:r,middlewareData:s,rects:i,initialPlacement:c,platform:u,elements:f}=t,{mainAxis:g=!0,crossAxis:m=!0,fallbackPlacements:d,fallbackStrategy:l="bestFit",fallbackAxisSideDirection:p="none",flipAlignment:a=!0,...y}=he(e,t);if((n=s.arrow)!=null&&n.alignmentOffset)return{};const w=fe(r),x=Q(c),T=fe(c)===c,E=await(u.isRTL==null?void 0:u.isRTL(f.floating)),M=d||(T||!a?[Ce(c)]:Gt(c)),C=p!=="none";!d&&C&&M.push(...en(c,a,p,E));const P=[c,...M],S=await u.detectOverflow(t,y),$=[];let I=((o=s.flip)==null?void 0:o.overflows)||[];if(g&&$.push(S[w]),m){const R=qt(r,i,E);$.push(S[R[0]],S[R[1]])}if(I=[...I,{placement:r,overflows:$}],!$.every(R=>R<=0)){var W,_;const R=(((W=s.flip)==null?void 0:W.index)||0)+1,L=P[R];if(L&&(!(m==="alignment"?x!==Q(L):!1)||I.every(h=>Q(h.placement)===x?h.overflows[0]>0:!0)))return{data:{index:R,overflows:I},reset:{placement:L}};let A=(_=I.filter(b=>b.overflows[0]<=0).sort((b,h)=>b.overflows[1]-h.overflows[1])[0])==null?void 0:_.placement;if(!A)switch(l){case"bestFit":{var F;const b=(F=I.filter(h=>{if(C){const O=Q(h.placement);return O===x||O==="y"}return!0}).map(h=>[h.placement,h.overflows.filter(O=>O>0).reduce((O,D)=>O+D,0)]).sort((h,O)=>h[1]-O[1])[0])==null?void 0:F[0];b&&(A=b);break}case"initialPlacement":A=c;break}if(r!==A)return{reset:{placement:A}}}return{}}}},En=new Set(["left","top"]);async function Cn(e,t){const{placement:n,platform:o,elements:r}=e,s=await(o.isRTL==null?void 0:o.isRTL(r.floating)),i=fe(n),c=ve(n),u=Q(n)==="y",f=En.has(i)?-1:1,g=s&&u?-1:1,m=he(t,e);let{mainAxis:d,crossAxis:l,alignmentAxis:p}=typeof m=="number"?{mainAxis:m,crossAxis:0,alignmentAxis:null}:{mainAxis:m.mainAxis||0,crossAxis:m.crossAxis||0,alignmentAxis:m.alignmentAxis};return c&&typeof p=="number"&&(l=c==="end"?p*-1:p),u?{x:l*g,y:d*f}:{x:d*f,y:l*g}}const On=function(e){return e===void 0&&(e=0),{name:"offset",options:e,async fn(t){var n,o;const{x:r,y:s,placement:i,middlewareData:c}=t,u=await Cn(t,e);return i===((n=c.offset)==null?void 0:n.placement)&&(o=c.arrow)!=null&&o.alignmentOffset?{}:{x:r+u.x,y:s+u.y,data:{...u,placement:i}}}}},Pn=function(e){return e===void 0&&(e={}),{name:"shift",options:e,async fn(t){const{x:n,y:o,placement:r,platform:s}=t,{mainAxis:i=!0,crossAxis:c=!1,limiter:u={fn:x=>{let{x:T,y:E}=x;return{x:T,y:E}}},...f}=he(e,t),g={x:n,y:o},m=await s.detectOverflow(t,f),d=Q(r),l=xt(d);let p=g[l],a=g[d];const y=(x,T)=>Rt(T+m[x==="y"?"top":"left"],T,T-m[x==="y"?"bottom":"right"]);i&&(p=y(l,p)),c&&(a=y(d,a));const w=u.fn({...t,[l]:p,[d]:a});return{...w,data:{x:w.x-n,y:w.y-o,enabled:{[l]:i,[d]:c}}}}}};function Ct(e){const t=j(e);let n=parseFloat(t.width)||0,o=parseFloat(t.height)||0;const r=X(e),s=r?e.offsetWidth:n,i=r?e.offsetHeight:o,c=Ee(n)!==s||Ee(o)!==i;return c&&(n=s,o=i),{width:n,height:o,$:c}}function qe(e){return N(e)?e:e.contextElement}function le(e){const t=qe(e);if(!X(t))return G(1);const n=t.getBoundingClientRect(),{width:o,height:r,$:s}=Ct(t);let i=(s?Ee(n.width):n.width)/o,c=(s?Ee(n.height):n.height)/r;return(!i||!Number.isFinite(i))&&(i=1),(!c||!Number.isFinite(c))&&(c=1),{x:i,y:c}}const Tn=G(0);function Ot(e){const t=K(e);return!Le()||!t.visualViewport?Tn:{x:t.visualViewport.offsetLeft,y:t.visualViewport.offsetTop}}function Mn(e,t,n){return t===void 0&&(t=!1),!!n&&t&&n===K(e)}function se(e,t,n,o){t===void 0&&(t=!1),n===void 0&&(n=!1);const r=e.getBoundingClientRect(),s=qe(e);let i=G(1);t&&(o?N(o)&&(i=le(o)):i=le(e));const c=Mn(s,n,o)?Ot(s):G(0);let u=(r.left+c.x)/i.x,f=(r.top+c.y)/i.y,g=r.width/i.x,m=r.height/i.y;if(s&&o){const d=K(s),l=N(o)?K(o):o;let p=d,a=Ke(p);for(;a&&l!==p;){const y=le(a),w=a.getBoundingClientRect(),x=j(a),T=w.left+(a.clientLeft+parseFloat(x.paddingLeft))*y.x,E=w.top+(a.clientTop+parseFloat(x.paddingTop))*y.y;u*=y.x,f*=y.y,g*=y.x,m*=y.y,u+=T,f+=E,p=K(a),a=Ke(p)}}return Oe({width:g,height:m,x:u,y:f})}function De(e,t){const n=Ae(e).scrollLeft;return t?t.left+n:se(J(e)).left+n}function Pt(e,t){const n=e.getBoundingClientRect(),o=n.left+t.scrollLeft-De(e,n),r=n.top+t.scrollTop;return{x:o,y:r}}function Sn(e){let{elements:t,rect:n,offsetParent:o,strategy:r}=e;const s=r==="fixed",i=J(o),c=t?Se(t.floating):!1;if(o===i||c&&s)return n;let u={scrollLeft:0,scrollTop:0},f=G(1);const g=G(0),m=X(o);if((m||!s)&&((ae(o)!=="body"||Me(i))&&(u=Ae(o)),m)){const l=se(o);f=le(o),g.x=l.x+o.clientLeft,g.y=l.y+o.clientTop}const d=i&&!m&&!s?Pt(i,u):G(0);return{width:n.width*f.x,height:n.height*f.y,x:n.x*f.x-u.scrollLeft*f.x+g.x+d.x,y:n.y*f.y-u.scrollTop*f.y+g.y+d.y}}function Ln(e){return e.getClientRects?Array.from(e.getClientRects()):[]}function An(e){const t=Ae(e),n=e.ownerDocument.body,o=ie(e.scrollWidth,e.clientWidth,n.scrollWidth,n.clientWidth),r=ie(e.scrollHeight,e.clientHeight,n.scrollHeight,n.clientHeight);let s=-t.scrollLeft+De(e);const i=-t.scrollTop;return j(n).direction==="rtl"&&(s+=ie(e.clientWidth,n.clientWidth)-o),{width:o,height:r,x:s,y:i}}const Dn=25;function kn(e,t,n){n===void 0&&(n="viewport");const o=n==="layoutViewport",r=K(e),s=J(e),i=r.visualViewport;let c=s.clientWidth,u=s.clientHeight,f=0,g=0;if(i){const d=!Le()||t==="fixed";o?d||(f=-i.offsetLeft,g=-i.offsetTop):(c=i.width,u=i.height,d&&(f=i.offsetLeft,g=i.offsetTop))}if(De(s)<=0){const d=s.ownerDocument,l=d.body,p=getComputedStyle(l),a=d.compatMode==="CSS1Compat"&&parseFloat(p.marginLeft)+parseFloat(p.marginRight)||0,y=Math.abs(s.clientWidth-l.clientWidth-a),w=getComputedStyle(s).scrollbarGutter==="stable both-edges"?y/2:y;w<=Dn&&(c-=w)}return{width:c,height:u,x:f,y:g}}function In(e,t){const n=se(e,!0,t==="fixed"),o=n.top+e.clientTop,r=n.left+e.clientLeft,s=le(e),i=e.clientWidth*s.x,c=e.clientHeight*s.y,u=r*s.x,f=o*s.y;return{width:i,height:c,x:u,y:f}}function it(e,t,n){let o;if(t==="viewport"||t==="layoutViewport")o=kn(e,n,t);else if(t==="document")o=An(J(e));else if(N(t))o=In(t,n);else{const r=Ot(e);o={x:t.x-r.x,y:t.y-r.y,width:t.width,height:t.height}}return Oe(o)}function Fn(e,t){const n=t.get(e);if(n)return n;let o=ee(e,[],!1).filter(c=>N(c)&&ae(c)!=="body"),r=null;const s=j(e).position==="fixed";let i=s?te(e):e;for(;N(i)&&!Z(i);){const c=j(i),u=je(i),f=r?r.position:s?"fixed":"";!u&&(f==="fixed"||f==="absolute"&&c.position==="static")?o=o.filter(m=>m!==i):r=c,i=te(i)}return t.set(e,o),o}function _n(e){let{element:t,boundary:n,rootBoundary:o,strategy:r}=e;const i=[...n==="clippingAncestors"?Se(t)?[]:Fn(t,this._c):[].concat(n),o],c=it(t,i[0],r);let u=c.top,f=c.right,g=c.bottom,m=c.left;for(let d=1;d<i.length;d++){const l=it(t,i[d],r);u=ie(l.top,u),f=ue(l.right,f),g=ue(l.bottom,g),m=ie(l.left,m)}return{width:f-m,height:g-u,x:m,y:u}}function $n(e){const{width:t,height:n}=Ct(e);return{width:t,height:n}}function Nn(e,t,n){const o=X(t),r=J(t),s=n==="fixed",i=se(e,!0,s,t);let c={scrollLeft:0,scrollTop:0};const u=G(0);if((o||!s)&&((ae(t)!=="body"||Me(r))&&(c=Ae(t)),o)){const d=se(t,!0,s,t);u.x=d.x+t.clientLeft,u.y=d.y+t.clientTop}!o&&r&&(u.x=De(r));const f=r&&!o&&!s?Pt(r,c):G(0),g=i.left+c.scrollLeft-u.x-f.x,m=i.top+c.scrollTop-u.y-f.y;return{x:g,y:m,width:i.width,height:i.height}}function _e(e){return j(e).position==="static"}function st(e,t){if(!X(e)||j(e).position==="fixed")return null;if(t)return t(e);let n=e.offsetParent;return J(e)===n&&(n=n.ownerDocument.body),n}function Tt(e,t){const n=K(e);if(Se(e))return n;if(!X(e)){let r=te(e);for(;r&&!Z(r);){if(N(r)&&!_e(r))return r;r=te(r)}return n}let o=st(e,t);for(;o&&Xt(o)&&_e(o);)o=st(o,t);return o&&Z(o)&&_e(o)&&!je(o)?n:o||Yt(e)||n}const Wn=async function(e){const t=this.getOffsetParent||Tt,n=this.getDimensions,o=await n(e.floating);return{reference:Nn(e.reference,await t(e.floating),e.strategy),floating:{x:0,y:0,width:o.width,height:o.height}}};function Vn(e){return j(e).direction==="rtl"}const Bn={convertOffsetParentRelativeRectToViewportRelativeRect:Sn,getDocumentElement:J,getClippingRect:_n,getOffsetParent:Tt,getElementRects:Wn,getClientRects:Ln,getDimensions:$n,getScale:le,isElement:N,isRTL:Vn};function Mt(e,t){return e.x===t.x&&e.y===t.y&&e.width===t.width&&e.height===t.height}function Hn(e,t,n){let o=null,r;const s=J(e);function i(){var g;clearTimeout(r),(g=o)==null||g.disconnect(),o=null}function c(g,m){g===void 0&&(g=!1),m===void 0&&(m=1),i();const d=e.getBoundingClientRect(),{left:l,top:p,width:a,height:y}=d;if(g||t(),!a||!y)return;const w=we(p),x=we(s.clientWidth-(l+a)),T=we(s.clientHeight-(p+y)),E=we(l),C={rootMargin:-w+"px "+-x+"px "+-T+"px "+-E+"px",threshold:ie(0,ue(1,m))||1};let P=!0;function S($){const I=$[0].intersectionRatio;if(!Mt(d,e.getBoundingClientRect()))return c();if(I!==m){if(!P)return c();I?c(!1,I):r=setTimeout(()=>{c(!1,1e-7)},1e3)}P=!1}try{o=new IntersectionObserver(S,{...C,root:s.ownerDocument})}catch{o=new IntersectionObserver(S,C)}o.observe(e)}const u=K(e),f=()=>c(n);return u.addEventListener("resize",f),c(!0),()=>{u.removeEventListener("resize",f),i()}}function Kn(e,t,n,o){o===void 0&&(o={});const{ancestorScroll:r=!0,ancestorResize:s=!0,elementResize:i=typeof ResizeObserver=="function",layoutShift:c=typeof IntersectionObserver=="function",animationFrame:u=!1}=o,f=qe(e),g=r||s?[...f?ee(f):[],...t?ee(t):[]]:[];g.forEach(w=>{r&&w.addEventListener("scroll",n),s&&w.addEventListener("resize",n)});const m=f&&c?Hn(f,n,s):null;let d=-1,l=null;i&&(l=new ResizeObserver(w=>{let[x]=w;x&&x.target===f&&l&&t&&(l.unobserve(t),cancelAnimationFrame(d),d=requestAnimationFrame(()=>{var T;(T=l)==null||T.observe(t)})),n()}),f&&!u&&l.observe(f),t&&l.observe(t));let p,a=u?se(e):null;u&&y();function y(){const w=se(e);a&&!Mt(a,w)&&n(),a=w,p=requestAnimationFrame(y)}return n(),()=>{var w;g.forEach(x=>{r&&x.removeEventListener("scroll",n),s&&x.removeEventListener("resize",n)}),m?.(),(w=l)==null||w.disconnect(),l=null,u&&cancelAnimationFrame(p)}}const Xn=On,Un=Pn,jn=bn,ct=xn,Yn=(e,t,n)=>{const o=new Map,r=n??{},s={...Bn,...r.platform,_c:o};return Rn(e,t,{...r,platform:s})};var zn=typeof document<"u",qn=function(){},xe=zn?vt:qn;function Pe(e,t){if(e===t)return!0;if(typeof e!=typeof t)return!1;if(typeof e=="function"&&e.toString()===t.toString())return!0;let n,o,r;if(e&&t&&typeof e=="object"){if(Array.isArray(e)){if(n=e.length,n!==t.length)return!1;for(o=n;o--!==0;)if(!Pe(e[o],t[o]))return!1;return!0}if(r=Object.keys(e),n=r.length,n!==Object.keys(t).length)return!1;for(o=n;o--!==0;)if(!{}.hasOwnProperty.call(t,r[o]))return!1;for(o=n;o--!==0;){const s=r[o];if(!(s==="_owner"&&e.$$typeof)&&!Pe(e[s],t[s]))return!1}return!0}return e!==e&&t!==t}function St(e){return typeof window>"u"?1:(e.ownerDocument.defaultView||window).devicePixelRatio||1}function lt(e,t){const n=St(e);return Math.round(t*n)/n}function $e(e){const t=v.useRef(e);return xe(()=>{t.current=e}),t}function Gn(e){e===void 0&&(e={});const{placement:t="bottom",strategy:n="absolute",middleware:o=[],platform:r,elements:{reference:s,floating:i}={},transform:c=!0,whileElementsMounted:u,open:f}=e,[g,m]=v.useState({x:0,y:0,strategy:n,placement:t,middlewareData:{},isPositioned:!1}),[d,l]=v.useState(o);Pe(d,o)||l(o);const[p,a]=v.useState(null),[y,w]=v.useState(null),x=v.useCallback(h=>{h!==C.current&&(C.current=h,a(h))},[]),T=v.useCallback(h=>{h!==P.current&&(P.current=h,w(h))},[]),E=s||p,M=i||y,C=v.useRef(null),P=v.useRef(null),S=v.useRef(g),$=u!=null,I=$e(u),W=$e(r),_=$e(f),F=v.useCallback(()=>{if(!C.current||!P.current)return;const h={placement:t,strategy:n,middleware:d};W.current&&(h.platform=W.current),Yn(C.current,P.current,h).then(O=>{const D={...O,isPositioned:_.current!==!1};R.current&&!Pe(S.current,D)&&(S.current=D,Kt.flushSync(()=>{m(D)}))})},[d,t,n,W,_]);xe(()=>{f===!1&&S.current.isPositioned&&(S.current.isPositioned=!1,m(h=>({...h,isPositioned:!1})))},[f]);const R=v.useRef(!1);xe(()=>(R.current=!0,()=>{R.current=!1}),[]),xe(()=>{if(E&&(C.current=E),M&&(P.current=M),E&&M){if(I.current)return I.current(E,M,F);F()}},[E,M,F,I,$]);const L=v.useMemo(()=>({reference:C,floating:P,setReference:x,setFloating:T}),[x,T]),A=v.useMemo(()=>({reference:E,floating:M}),[E,M]),b=v.useMemo(()=>{const h={position:n,left:0,top:0};if(!A.floating)return h;const O=lt(A.floating,g.x),D=lt(A.floating,g.y);return c?{...h,transform:"translate("+O+"px, "+D+"px)",...St(A.floating)>=1.5&&{willChange:"transform"}}:{position:n,left:O,top:D}},[n,c,A.floating,g.x,g.y]);return v.useMemo(()=>({...g,update:F,refs:L,elements:A,floatingStyles:b}),[g,F,L,A,b])}const Jn=e=>{function t(n){return{}.hasOwnProperty.call(n,"current")}return{name:"arrow",options:e,fn(n){const{element:o,padding:r}=typeof e=="function"?e(n):e;return o&&t(o)?o.current!=null?ct({element:o.current,padding:r}).fn(n):{}:o?ct({element:o,padding:r}).fn(n):{}}}},Qn=(e,t)=>{const n=Xn(e);return{name:n.name,fn:n.fn,options:[e,t]}},Zn=(e,t)=>{const n=Un(e);return{name:n.name,fn:n.fn,options:[e,t]}},eo=(e,t)=>{const n=jn(e);return{name:n.name,fn:n.fn,options:[e,t]}},to=(e,t)=>{const n=Jn(e);return{name:n.name,fn:n.fn,options:[e,t]}},no="data-floating-ui-focusable",ut="active",ft="selected",oo={...v};let at=!1,ro=0;const dt=()=>"floating-ui-"+Math.random().toString(36).slice(2,6)+ro++;function io(){const[e,t]=v.useState(()=>at?dt():void 0);return z(()=>{e==null&&t(dt())},[]),v.useEffect(()=>{at=!0},[]),e}const so=oo.useId,Ge=so||io;let pe;process.env.NODE_ENV!=="production"&&(pe=new Set);function co(){for(var e,t=arguments.length,n=new Array(t),o=0;o<t;o++)n[o]=arguments[o];const r="Floating UI: "+n.join(" ");if(!((e=pe)!=null&&e.has(r))){var s;(s=pe)==null||s.add(r),console.warn(r)}}function lo(){for(var e,t=arguments.length,n=new Array(t),o=0;o<t;o++)n[o]=arguments[o];const r="Floating UI: "+n.join(" ");if(!((e=pe)!=null&&e.has(r))){var s;(s=pe)==null||s.add(r),console.error(r)}}const uo=v.forwardRef(function(t,n){const{context:{placement:o,elements:{floating:r},middlewareData:{arrow:s,shift:i}},width:c=14,height:u=7,tipRadius:f=0,strokeWidth:g=0,staticOffset:m,stroke:d,d:l,style:{transform:p,...a}={},...y}=t;process.env.NODE_ENV!=="production"&&(n||co("The `ref` prop is required for `FloatingArrow`."));const w=Ge(),[x,T]=v.useState(!1);if(z(()=>{if(!r)return;j(r).direction==="rtl"&&T(!0)},[r]),!r)return null;const[E,M]=o.split("-"),C=E==="top"||E==="bottom";let P=m;(C&&i!=null&&i.x||!C&&i!=null&&i.y)&&(P=null);const S=g*2,$=S/2,I=c/2*(f/-8+1),W=u/2*f/4,_=!!l,F=P&&M==="end"?"bottom":"top";let R=P&&M==="end"?"right":"left";P&&x&&(R=M==="end"?"left":"right");const L=s?.x!=null?P||s.x:"",A=s?.y!=null?P||s.y:"",b=l||"M0,0"+(" H"+c)+(" L"+(c-I)+","+(u-W))+(" Q"+c/2+","+u+" "+I+","+(u-W))+" Z",h={top:_?"rotate(180deg)":"",left:_?"rotate(90deg)":"rotate(-90deg)",bottom:_?"":"rotate(180deg)",right:_?"rotate(-90deg)":"rotate(90deg)"}[E];return Be("svg",{...y,"aria-hidden":!0,ref:n,width:_?c:c+S,height:c,viewBox:"0 0 "+c+" "+(u>c?u:c),style:{position:"absolute",pointerEvents:"none",[R]:L,[F]:A,[E]:C||_?"100%":"calc(100% - "+S/2+"px)",transform:[h,p].filter(O=>!!O).join(" "),...a},children:[S>0&&oe("path",{clipPath:"url(#"+w+")",fill:"none",stroke:d,strokeWidth:S+(l?0:1),d:b}),oe("path",{stroke:S&&!l?y.fill:"none",d:b}),oe("clipPath",{id:w,children:oe("rect",{x:-$,y:$*(_?-1:1),width:c+S,height:c})})]})});function fo(){const e=new Map;return{emit(t,n){var o;(o=e.get(t))==null||o.forEach(r=>r(n))},on(t,n){e.has(t)||e.set(t,new Set),e.get(t).add(n)},off(t,n){var o;(o=e.get(t))==null||o.delete(n)}}}const ao=v.createContext(null),mo=v.createContext(null),Je=()=>{var e;return((e=v.useContext(ao))==null?void 0:e.id)||null},Qe=()=>v.useContext(mo);function Ze(e){return"data-floating-ui-"+e}function U(e){e.current!==-1&&(clearTimeout(e.current),e.current=-1)}const mt=Ze("safe-polygon");function be(e,t,n){if(n&&!ge(n))return 0;if(typeof e=="number")return e;if(typeof e=="function"){const o=e();return typeof o=="number"?o:o?.[t]}return e?.[t]}function Ne(e){return typeof e=="function"?e():e}function go(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,dataRef:r,events:s,elements:i}=e,{enabled:c=!0,delay:u=0,handleClose:f=null,mouseOnly:g=!1,restMs:m=0,move:d=!0}=t,l=Qe(),p=Je(),a=ye(f),y=ye(u),w=ye(n),x=ye(m),T=v.useRef(),E=v.useRef(-1),M=v.useRef(),C=v.useRef(-1),P=v.useRef(!0),S=v.useRef(!1),$=v.useRef(()=>{}),I=v.useRef(!1),W=Y(()=>{var b;const h=(b=r.current.openEvent)==null?void 0:b.type;return h?.includes("mouse")&&h!=="mousedown"});v.useEffect(()=>{if(!c)return;function b(h){let{open:O}=h;O||(U(E),U(C),P.current=!0,I.current=!1)}return s.on("openchange",b),()=>{s.off("openchange",b)}},[c,s]),v.useEffect(()=>{if(!c||!a.current||!n)return;function b(O){W()&&o(!1,O,"hover")}const h=re(i.floating).documentElement;return h.addEventListener("mouseleave",b),()=>{h.removeEventListener("mouseleave",b)}},[i.floating,n,o,c,a,W]);const _=v.useCallback(function(b,h,O){h===void 0&&(h=!0),O===void 0&&(O="hover");const D=be(y.current,"close",T.current);D&&!M.current?(U(E),E.current=window.setTimeout(()=>o(!1,b,O),D)):h&&(U(E),o(!1,b,O))},[y,o]),F=Y(()=>{$.current(),M.current=void 0}),R=Y(()=>{if(S.current){const b=re(i.floating).body;b.style.pointerEvents="",b.removeAttribute(mt),S.current=!1}}),L=Y(()=>r.current.openEvent?["click","mousedown"].includes(r.current.openEvent.type):!1);v.useEffect(()=>{if(!c)return;function b(k){if(U(E),P.current=!1,g&&!ge(T.current)||Ne(x.current)>0&&!be(y.current,"open"))return;const V=be(y.current,"open",T.current);V?E.current=window.setTimeout(()=>{w.current||o(!0,k,"hover")},V):n||o(!0,k,"hover")}function h(k){if(L()){R();return}$.current();const V=re(i.floating);if(U(C),I.current=!1,a.current&&r.current.floatingContext){n||U(E),M.current=a.current({...r.current.floatingContext,tree:l,x:k.clientX,y:k.clientY,onClose(){R(),F(),L()||_(k,!0,"safe-polygon")}});const H=M.current;V.addEventListener("mousemove",H),$.current=()=>{V.removeEventListener("mousemove",H)};return}(T.current!=="touch"||!me(i.floating,k.relatedTarget))&&_(k)}function O(k){L()||r.current.floatingContext&&(a.current==null||a.current({...r.current.floatingContext,tree:l,x:k.clientX,y:k.clientY,onClose(){R(),F(),L()||_(k)}})(k))}function D(){U(E)}function B(k){L()||_(k,!1)}if(N(i.domReference)){const k=i.domReference,V=i.floating;return n&&k.addEventListener("mouseleave",O),d&&k.addEventListener("mousemove",b,{once:!0}),k.addEventListener("mouseenter",b),k.addEventListener("mouseleave",h),V&&(V.addEventListener("mouseleave",O),V.addEventListener("mouseenter",D),V.addEventListener("mouseleave",B)),()=>{n&&k.removeEventListener("mouseleave",O),d&&k.removeEventListener("mousemove",b),k.removeEventListener("mouseenter",b),k.removeEventListener("mouseleave",h),V&&(V.removeEventListener("mouseleave",O),V.removeEventListener("mouseenter",D),V.removeEventListener("mouseleave",B))}}},[i,c,e,g,d,_,F,R,o,n,w,l,y,a,r,L,x]),z(()=>{var b;if(c&&n&&(b=a.current)!=null&&(b=b.__options)!=null&&b.blockPointerEvents&&W()){S.current=!0;const O=i.floating;if(N(i.domReference)&&O){var h;const D=re(i.floating).body;D.setAttribute(mt,"");const B=i.domReference,k=l==null||(h=l.nodesRef.current.find(V=>V.id===p))==null||(h=h.context)==null?void 0:h.elements.floating;return k&&(k.style.pointerEvents=""),D.style.pointerEvents="none",B.style.pointerEvents="auto",O.style.pointerEvents="auto",()=>{D.style.pointerEvents="",B.style.pointerEvents="",O.style.pointerEvents=""}}}},[c,n,p,i,l,a,W]),z(()=>{n||(T.current=void 0,I.current=!1,F(),R())},[n,F,R]),v.useEffect(()=>()=>{F(),U(E),U(C),R()},[c,i.domReference,F,R]);const A=v.useMemo(()=>{function b(h){T.current=h.pointerType}return{onPointerDown:b,onPointerEnter:b,onMouseMove(h){const{nativeEvent:O}=h;function D(){!P.current&&!w.current&&o(!0,O,"hover")}g&&!ge(T.current)||n||Ne(x.current)===0||I.current&&h.movementX**2+h.movementY**2<2||(U(C),T.current==="touch"?D():(I.current=!0,C.current=window.setTimeout(D,Ne(x.current))))}}},[g,o,n,w,x]);return v.useMemo(()=>c?{reference:A}:{},[c,A])}const Ue=()=>{},po=v.createContext({delay:0,initialDelay:0,timeoutMs:0,currentId:null,setCurrentId:Ue,setState:Ue,isInstantPhase:!1}),ho=()=>v.useContext(po);function vo(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,floatingId:r}=e,{id:s,enabled:i=!0}=t,c=s??r,u=ho(),{currentId:f,setCurrentId:g,initialDelay:m,setState:d,timeoutMs:l}=u;return z(()=>{i&&f&&(d({delay:{open:1,close:be(m,"close")}}),f!==c&&o(!1))},[i,c,o,d,f,m]),z(()=>{function p(){o(!1),d({delay:m,currentId:null})}if(i&&f&&!n&&f===c){if(l){const a=window.setTimeout(p,l);return()=>{clearTimeout(a)}}p()}},[i,n,d,f,c,o,m,l]),z(()=>{i&&(g===Ue||!n||g(c))},[i,n,g,c]),u}function gt(e){return X(e.target)&&e.target.tagName==="BUTTON"}function wo(e){return X(e.target)&&e.target.tagName==="A"}function pt(e){return Et(e)}function yo(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,dataRef:r,elements:{domReference:s}}=e,{enabled:i=!0,event:c="click",toggle:u=!0,ignoreMouse:f=!1,keyboardHandlers:g=!0,stickIfOpen:m=!0}=t,d=v.useRef(),l=v.useRef(!1),p=v.useMemo(()=>({onPointerDown(a){d.current=a.pointerType},onMouseDown(a){const y=d.current;a.button===0&&c!=="click"&&(ge(y,!0)&&f||(n&&u&&(!(r.current.openEvent&&m)||r.current.openEvent.type==="mousedown")?o(!1,a.nativeEvent,"click"):(a.preventDefault(),o(!0,a.nativeEvent,"click"))))},onClick(a){const y=d.current;if(c==="mousedown"&&d.current){d.current=void 0;return}ge(y,!0)&&f||(n&&u&&(!(r.current.openEvent&&m)||r.current.openEvent.type==="click")?o(!1,a.nativeEvent,"click"):o(!0,a.nativeEvent,"click"))},onKeyDown(a){d.current=void 0,!(a.defaultPrevented||!g||gt(a))&&(a.key===" "&&!pt(s)&&(a.preventDefault(),l.current=!0),!wo(a)&&a.key==="Enter"&&o(!(n&&u),a.nativeEvent,"click"))},onKeyUp(a){a.defaultPrevented||!g||gt(a)||pt(s)||a.key===" "&&l.current&&(l.current=!1,o(!(n&&u),a.nativeEvent,"click"))}}),[r,s,c,f,g,o,n,m,u]);return v.useMemo(()=>i?{reference:p}:{},[i,p])}const Ro={pointerdown:"onPointerDown",mousedown:"onMouseDown",click:"onClick"},xo={pointerdown:"onPointerDownCapture",mousedown:"onMouseDownCapture",click:"onClickCapture"},ht=e=>{var t,n;return{escapeKey:typeof e=="boolean"?e:(t=e?.escapeKey)!=null?t:!1,outsidePress:typeof e=="boolean"?e:(n=e?.outsidePress)!=null?n:!0}};function bo(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,elements:r,dataRef:s}=e,{enabled:i=!0,escapeKey:c=!0,outsidePress:u=!0,outsidePressEvent:f="pointerdown",referencePress:g=!1,referencePressEvent:m="pointerdown",ancestorScroll:d=!1,bubbles:l,capture:p}=t,a=Qe(),y=Y(typeof u=="function"?u:()=>!1),w=typeof u=="function"?y:u,x=v.useRef(!1),{escapeKey:T,outsidePress:E}=ht(l),{escapeKey:M,outsidePress:C}=ht(p),P=v.useRef(!1),S=Y(R=>{var L;if(!n||!i||!c||R.key!=="Escape"||P.current)return;const A=(L=s.current.floatingContext)==null?void 0:L.nodeId,b=a?Re(a.nodesRef.current,A):[];if(!T&&(R.stopPropagation(),b.length>0)){let h=!0;if(b.forEach(O=>{var D;if((D=O.context)!=null&&D.open&&!O.context.dataRef.current.__escapeKeyBubbles){h=!1;return}}),!h)return}o(!1,dn(R)?R.nativeEvent:R,"escape-key")}),$=Y(R=>{var L;const A=()=>{var b;S(R),(b=ce(R))==null||b.removeEventListener("keydown",A)};(L=ce(R))==null||L.addEventListener("keydown",A)}),I=Y(R=>{var L;const A=s.current.insideReactTree;s.current.insideReactTree=!1;const b=x.current;if(x.current=!1,f==="click"&&b||A||typeof w=="function"&&!w(R))return;const h=ce(R),O="["+Ze("inert")+"]",D=re(r.floating).querySelectorAll(O);let B=N(h)?h:null;for(;B&&!Z(B);){const H=te(B);if(Z(H)||!N(H))break;B=H}if(D.length&&N(h)&&!un(h)&&!me(h,r.floating)&&Array.from(D).every(H=>!me(B,H)))return;if(X(h)&&F){const H=Z(h),q=j(h),de=/auto|scroll/,Lt=H||de.test(q.overflowX),At=H||de.test(q.overflowY),Dt=Lt&&h.clientWidth>0&&h.scrollWidth>h.clientWidth,kt=At&&h.clientHeight>0&&h.scrollHeight>h.clientHeight,It=q.direction==="rtl",Ft=kt&&(It?R.offsetX<=h.offsetWidth-h.clientWidth:R.offsetX>h.clientWidth),_t=Dt&&R.offsetY>h.clientHeight;if(Ft||_t)return}const k=(L=s.current.floatingContext)==null?void 0:L.nodeId,V=a&&Re(a.nodesRef.current,k).some(H=>{var q;return Fe(R,(q=H.context)==null?void 0:q.elements.floating)});if(Fe(R,r.floating)||Fe(R,r.domReference)||V)return;const ke=a?Re(a.nodesRef.current,k):[];if(ke.length>0){let H=!0;if(ke.forEach(q=>{var de;if((de=q.context)!=null&&de.open&&!q.context.dataRef.current.__outsidePressBubbles){H=!1;return}}),!H)return}o(!1,R,"outside-press")}),W=Y(R=>{var L;const A=()=>{var b;I(R),(b=ce(R))==null||b.removeEventListener(f,A)};(L=ce(R))==null||L.addEventListener(f,A)});v.useEffect(()=>{if(!n||!i)return;s.current.__escapeKeyBubbles=T,s.current.__outsidePressBubbles=E;let R=-1;function L(D){o(!1,D,"ancestor-scroll")}function A(){window.clearTimeout(R),P.current=!0}function b(){R=window.setTimeout(()=>{P.current=!1},Le()?5:0)}const h=re(r.floating);c&&(h.addEventListener("keydown",M?$:S,M),h.addEventListener("compositionstart",A),h.addEventListener("compositionend",b)),w&&h.addEventListener(f,C?W:I,C);let O=[];return d&&(N(r.domReference)&&(O=ee(r.domReference)),N(r.floating)&&(O=O.concat(ee(r.floating))),!N(r.reference)&&r.reference&&r.reference.contextElement&&(O=O.concat(ee(r.reference.contextElement)))),O=O.filter(D=>{var B;return D!==((B=h.defaultView)==null?void 0:B.visualViewport)}),O.forEach(D=>{D.addEventListener("scroll",L)}),()=>{c&&(h.removeEventListener("keydown",M?$:S,M),h.removeEventListener("compositionstart",A),h.removeEventListener("compositionend",b)),w&&h.removeEventListener(f,C?W:I,C),O.forEach(D=>{D.removeEventListener("scroll",L)}),window.clearTimeout(R)}},[s,r,c,w,f,n,o,d,i,T,E,S,M,$,I,C,W]),v.useEffect(()=>{s.current.insideReactTree=!1},[s,w,f]);const _=v.useMemo(()=>({onKeyDown:S,...g&&{[Ro[m]]:R=>{o(!1,R.nativeEvent,"reference-press")},...m!=="click"&&{onClick(R){o(!1,R.nativeEvent,"reference-press")}}}}),[S,o,g,m]),F=v.useMemo(()=>{function R(L){L.button===0&&(x.current=!0)}return{onKeyDown:S,onMouseDown:R,onMouseUp:R,[xo[f]]:()=>{s.current.insideReactTree=!0}}},[S,f,s]);return v.useMemo(()=>i?{reference:_,floating:F}:{},[i,_,F])}function Eo(e){const{open:t=!1,onOpenChange:n,elements:o}=e,r=Ge(),s=v.useRef({}),[i]=v.useState(()=>fo()),c=Je()!=null;if(process.env.NODE_ENV!=="production"){const l=o.reference;l&&!N(l)&&lo("Cannot pass a virtual element to the `elements.reference` option,","as it must be a real DOM element. Use `refs.setPositionReference()`","instead.")}const[u,f]=v.useState(o.reference),g=Y((l,p,a)=>{s.current.openEvent=l?p:void 0,i.emit("openchange",{open:l,event:p,reason:a,nested:c}),n?.(l,p,a)}),m=v.useMemo(()=>({setPositionReference:f}),[]),d=v.useMemo(()=>({reference:u||o.reference||null,floating:o.floating||null,domReference:o.reference}),[u,o.reference,o.floating]);return v.useMemo(()=>({dataRef:s,open:t,onOpenChange:g,elements:d,events:i,floatingId:r,refs:m}),[t,g,d,i,r,m])}function Co(e){var t,n;let{elements:o,...r}=e===void 0?{}:e;const{nodeId:s}=r,i=Eo({...r,elements:{reference:(t=o?.reference)!=null?t:null,floating:(n=o?.floating)!=null?n:null}}),c=r.rootContext||i,u=c.elements,[f,g]=v.useState(null),[m,d]=v.useState(null),p=u?.domReference||f,a=v.useRef(null),y=Qe();z(()=>{p&&(a.current=p)},[p]);const w=Gn({...r,elements:{...u,...m&&{reference:m}}}),x=v.useCallback(P=>{const S=N(P)?{getBoundingClientRect:()=>P.getBoundingClientRect(),getClientRects:()=>P.getClientRects(),contextElement:P}:P;d(S),w.refs.setReference(S)},[w.refs]),T=v.useCallback(P=>{(N(P)||P===null)&&(a.current=P,g(P)),(N(w.refs.reference.current)||w.refs.reference.current===null||P!==null&&!N(P))&&w.refs.setReference(P)},[w.refs]),E=v.useMemo(()=>({...w.refs,setReference:T,setPositionReference:x,domReference:a}),[w.refs,T,x]),M=v.useMemo(()=>({...w.elements,domReference:p}),[w.elements,p]),C=v.useMemo(()=>({...w,...c,refs:E,elements:M,nodeId:s}),[w,E,M,s,c]);return z(()=>{c.dataRef.current.floatingContext=C;const P=y?.nodesRef.current.find(S=>S.id===s);P&&(P.context=C)}),v.useMemo(()=>({...w,context:C,refs:E,elements:M}),[w,E,M,C])}function We(){return sn()&&rn()}function Oo(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,events:r,dataRef:s,elements:i}=e,{enabled:c=!0,visibleOnly:u=!0}=t,f=v.useRef(!1),g=v.useRef(-1),m=v.useRef(!0);v.useEffect(()=>{if(!c)return;const l=K(i.domReference);function p(){!n&&X(i.domReference)&&i.domReference===ot(re(i.domReference))&&(f.current=!0)}function a(){m.current=!0}function y(){m.current=!1}return l.addEventListener("blur",p),We()&&(l.addEventListener("keydown",a,!0),l.addEventListener("pointerdown",y,!0)),()=>{l.removeEventListener("blur",p),We()&&(l.removeEventListener("keydown",a,!0),l.removeEventListener("pointerdown",y,!0))}},[i.domReference,n,c]),v.useEffect(()=>{if(!c)return;function l(p){let{reason:a}=p;(a==="reference-press"||a==="escape-key")&&(f.current=!0)}return r.on("openchange",l),()=>{r.off("openchange",l)}},[r,c]),v.useEffect(()=>()=>{U(g)},[]);const d=v.useMemo(()=>({onMouseLeave(){f.current=!1},onFocus(l){if(f.current)return;const p=ce(l.nativeEvent);if(u&&N(p)){if(We()&&!l.relatedTarget){if(!m.current&&!Et(p))return}else if(!fn(p))return}o(!0,l.nativeEvent,"focus")},onBlur(l){f.current=!1;const p=l.relatedTarget,a=l.nativeEvent,y=N(p)&&p.hasAttribute(Ze("focus-guard"))&&p.getAttribute("data-type")==="outside";g.current=window.setTimeout(()=>{var w;const x=ot(i.domReference?i.domReference.ownerDocument:document);!p&&x===i.domReference||me((w=s.current.floatingContext)==null?void 0:w.refs.floating.current,x)||me(i.domReference,x)||y||o(!1,a,"focus")})}}),[s,i.domReference,o,u]);return v.useMemo(()=>c?{reference:d}:{},[c,d])}function Ve(e,t,n){const o=new Map,r=n==="item";let s=e;if(r&&e){const{[ut]:i,[ft]:c,...u}=e;s=u}return{...n==="floating"&&{tabIndex:-1,[no]:""},...s,...t.map(i=>{const c=i?i[n]:null;return typeof c=="function"?e?c(e):null:c}).concat(e).reduce((i,c)=>(c&&Object.entries(c).forEach(u=>{let[f,g]=u;if(!(r&&[ut,ft].includes(f)))if(f.indexOf("on")===0){if(o.has(f)||o.set(f,[]),typeof g=="function"){var m;(m=o.get(f))==null||m.push(g),i[f]=function(){for(var d,l=arguments.length,p=new Array(l),a=0;a<l;a++)p[a]=arguments[a];return(d=o.get(f))==null?void 0:d.map(y=>y(...p)).find(y=>y!==void 0)}}}else i[f]=g}),i),{})}}function Po(e){e===void 0&&(e=[]);const t=e.map(c=>c?.reference),n=e.map(c=>c?.floating),o=e.map(c=>c?.item),r=v.useCallback(c=>Ve(c,e,"reference"),t),s=v.useCallback(c=>Ve(c,e,"floating"),n),i=v.useCallback(c=>Ve(c,e,"item"),o);return v.useMemo(()=>({getReferenceProps:r,getFloatingProps:s,getItemProps:i}),[r,s,i])}const To=new Map([["select","listbox"],["combobox","listbox"],["label",!1]]);function Mo(e,t){var n,o;t===void 0&&(t={});const{open:r,elements:s,floatingId:i}=e,{enabled:c=!0,role:u="dialog"}=t,f=Ge(),g=((n=s.domReference)==null?void 0:n.id)||f,m=v.useMemo(()=>{var x;return((x=an(s.floating))==null?void 0:x.id)||i},[s.floating,i]),d=(o=To.get(u))!=null?o:u,p=Je()!=null,a=v.useMemo(()=>d==="tooltip"||u==="label"?{["aria-"+(u==="label"?"labelledby":"describedby")]:r?m:void 0}:{"aria-expanded":r?"true":"false","aria-haspopup":d==="alertdialog"?"dialog":d,"aria-controls":r?m:void 0,...d==="listbox"&&{role:"combobox"},...d==="menu"&&{id:g},...d==="menu"&&p&&{role:"menuitem"},...u==="select"&&{"aria-autocomplete":"none"},...u==="combobox"&&{"aria-autocomplete":"list"}},[d,m,p,r,g,u]),y=v.useMemo(()=>{const x={id:m,...d&&{role:d}};return d==="tooltip"||u==="label"?x:{...x,...d==="menu"&&{"aria-labelledby":g}}},[d,m,g,u]),w=v.useCallback(x=>{let{active:T,selected:E}=x;const M={role:"option",...T&&{id:m+"-fui-option"}};switch(u){case"select":case"combobox":return{...M,"aria-selected":E}}return{}},[m,u]);return v.useMemo(()=>c?{reference:a,floating:y,item:w}:{},[c,a,y,w])}function Do({closeDelay:e=300,offset:t=20,openDelay:n=0,placement:o="bottom-start",slots:r,trigger:s=["hover","focus"],withArrow:i=!0,arrow:c,role:u="dialog",visible:f={},hidden:g={},floatingOptions:m={},isOpen:d,onOpenChange:l}){const[p,a]=Nt(!1),y=Wt(null),w=Vt(),{x,y:T,strategy:E,refs:M,context:C}=Co({placement:o,middleware:[Qn(t),eo(),Zn(),to({element:y})],open:d||p,onOpenChange:l||a,whileElementsMounted:Kn,...m}),P=bo(C),S=Mo(C,{role:u}),{delay:$}=vo(C,{id:w}),W=go(C,{delay:$||{open:n,close:e}}),_=Oo(C),F=yo(C),R=[s.find(k=>k==="hover")?W:void 0,s.find(k=>k==="click")?F:void 0,s.find(k=>k==="focus")?_:void 0,P,S],{getReferenceProps:L,getFloatingProps:A}=Po(R),{onClick:b,...h}=L(),O=String((r?.content?.props).className).includes("pressable")?{onPress:b}:{onClick:b},D=r?.content?Bt(r.content,{...r.content.props,ref:M.setReference,...h,...O}):oe("div",{ref:M.setReference,...L(),children:"Menu Action"}),B=r?.submenu?Be(Ht.nav,{ref:M.setFloating,style:{position:E,top:T??0,left:x??0,width:"max-content",zIndex:50},...A(),variants:{hidden:g,visible:f},initial:"hidden",animate:d||p?"visible":"hidden",children:[i&&oe(uo,{ref:y,context:C,...c}),r.submenu]}):oe("nav",{children:"Submenu"});return Be($t,{children:[D,B]})}export{Do as Menu,Do as default};
|
|
1
|
+
"use client";import{jsxs as Be,jsx as oe,Fragment as $t}from"react/jsx-runtime";import*as v from"react";import{useLayoutEffect as vt,useState as Nt,useRef as Wt,useId as Vt,cloneElement as Bt}from"react";import{m as Ht}from"framer-motion";import*as Kt from"react-dom";function Te(){return typeof window<"u"}function ae(e){return wt(e)?(e.nodeName||"").toLowerCase():"#document"}function K(e){var t;return(e==null||(t=e.ownerDocument)==null?void 0:t.defaultView)||window}function J(e){var t;return(t=(wt(e)?e.ownerDocument:e.document)||window.document)==null?void 0:t.documentElement}function wt(e){return Te()?e instanceof Node||e instanceof K(e).Node:!1}function N(e){return Te()?e instanceof Element||e instanceof K(e).Element:!1}function X(e){return Te()?e instanceof HTMLElement||e instanceof K(e).HTMLElement:!1}function He(e){return!Te()||typeof ShadowRoot>"u"?!1:e instanceof ShadowRoot||e instanceof K(e).ShadowRoot}function Me(e){const{overflow:t,overflowX:n,overflowY:o,display:r}=j(e);return/auto|scroll|overlay|hidden|clip/.test(t+o+n)&&r!=="inline"&&r!=="contents"}function Xt(e){return/^(table|td|th)$/.test(ae(e))}function Se(e){try{if(e.matches(":popover-open"))return!0}catch{}try{return e.matches(":modal")}catch{return!1}}const Ut=/transform|translate|scale|rotate|perspective|filter/,jt=/paint|layout|strict|content/,ne=e=>!!e&&e!=="none";let Ie;function je(e){const t=N(e)?j(e):e;return ne(t.transform)||ne(t.translate)||ne(t.scale)||ne(t.rotate)||ne(t.perspective)||!Le()&&(ne(t.backdropFilter)||ne(t.filter))||Ut.test(t.willChange||"")||jt.test(t.contain||"")}function Yt(e){let t=te(e);for(;X(t)&&!Z(t);){if(je(t))return t;if(Se(t))return null;t=te(t)}return null}function Le(){return Ie==null&&(Ie=typeof CSS<"u"&&CSS.supports&&CSS.supports("-webkit-backdrop-filter","none")),Ie}function Z(e){return/^(html|body|#document)$/.test(ae(e))}function j(e){return K(e).getComputedStyle(e)}function Ae(e){return N(e)?{scrollLeft:e.scrollLeft,scrollTop:e.scrollTop}:{scrollLeft:e.scrollX,scrollTop:e.scrollY}}function te(e){if(ae(e)==="html")return e;const t=e.assignedSlot||e.parentNode||He(e)&&e.host||J(e);return He(t)?t.host:t}function yt(e){const t=te(e);return Z(t)?(e.ownerDocument||e).body:X(t)&&Me(t)?t:yt(t)}function ee(e,t,n){var o;t===void 0&&(t=[]),n===void 0&&(n=!0);const r=yt(e),s=r===((o=e.ownerDocument)==null?void 0:o.body),i=K(r);if(s){const c=Ke(i);return t.concat(i,i.visualViewport||[],Me(r)?r:[],c&&n?ee(c):[])}else return t.concat(r,ee(r,[],n))}function Ke(e){return e.parent&&Object.getPrototypeOf(e.parent)?e.frameElement:null}const ue=Math.min,ie=Math.max,Ee=Math.round,we=Math.floor,G=e=>({x:e,y:e}),zt={left:"right",right:"left",bottom:"top",top:"bottom"};function Rt(e,t,n){return ie(e,ue(t,n))}function he(e,t){return typeof e=="function"?e(t):e}function fe(e){return e.split("-")[0]}function ve(e){return e.split("-")[1]}function xt(e){return e==="x"?"y":"x"}function Ye(e){return e==="y"?"height":"width"}function Q(e){const t=e[0];return t==="t"||t==="b"?"y":"x"}function ze(e){return xt(Q(e))}function qt(e,t,n){n===void 0&&(n=!1);const o=ve(e),r=ze(e),s=Ye(r);let i=r==="x"?o===(n?"end":"start")?"right":"left":o==="start"?"bottom":"top";return t.reference[s]>t.floating[s]&&(i=Ce(i)),[i,Ce(i)]}function Gt(e){const t=Ce(e);return[Xe(e),t,Xe(t)]}function Xe(e){return e.includes("start")?e.replace("start","end"):e.replace("end","start")}const et=["left","right"],tt=["right","left"],Jt=["top","bottom"],Qt=["bottom","top"];function Zt(e,t,n){switch(e){case"top":case"bottom":return n?t?tt:et:t?et:tt;case"left":case"right":return t?Jt:Qt;default:return[]}}function en(e,t,n,o){const r=ve(e);let s=Zt(fe(e),n==="start",o);return r&&(s=s.map(i=>i+"-"+r),t&&(s=s.concat(s.map(Xe)))),s}function Ce(e){const t=fe(e);return zt[t]+e.slice(t.length)}function tn(e){var t,n,o,r;return{top:(t=e.top)!=null?t:0,right:(n=e.right)!=null?n:0,bottom:(o=e.bottom)!=null?o:0,left:(r=e.left)!=null?r:0}}function bt(e){return typeof e!="number"?tn(e):{top:e,right:e,bottom:e,left:e}}function Oe(e){const{x:t,y:n,width:o,height:r}=e;return{width:o,height:r,top:n,left:t,right:t+o,bottom:n+r,x:t,y:n}}function nn(){const e=navigator.userAgentData;return e!=null&&e.platform?e.platform:navigator.platform}function on(){const e=navigator.userAgentData;return e&&Array.isArray(e.brands)?e.brands.map(t=>{let{brand:n,version:o}=t;return n+"/"+o}).join(" "):navigator.userAgent}function rn(){return/apple/i.test(navigator.vendor)}function sn(){return nn().toLowerCase().startsWith("mac")&&!navigator.maxTouchPoints}function cn(){return on().includes("jsdom/")}const nt="data-floating-ui-focusable",ln="input:not([type='hidden']):not([disabled]),[contenteditable]:not([contenteditable='false']),textarea:not([disabled])";function ot(e){let t=e.activeElement;for(;((n=t)==null||(n=n.shadowRoot)==null?void 0:n.activeElement)!=null;){var n;t=t.shadowRoot.activeElement}return t}function me(e,t){if(!e||!t)return!1;const n=t.getRootNode==null?void 0:t.getRootNode();if(e.contains(t))return!0;if(n&&He(n)){let o=t;for(;o;){if(e===o)return!0;o=o.parentNode||o.host}}return!1}function ce(e){return"composedPath"in e?e.composedPath()[0]:e.target}function Fe(e,t){if(t==null)return!1;if("composedPath"in e)return e.composedPath().includes(t);const n=e;return n.target!=null&&t.contains(n.target)}function un(e){return e.matches("html,body")}function re(e){return e?.ownerDocument||document}function Et(e){return X(e)&&e.matches(ln)}function fn(e){if(!e||cn())return!0;try{return e.matches(":focus-visible")}catch{return!0}}function an(e){return e?e.hasAttribute(nt)?e:e.querySelector("["+nt+"]")||e:null}function Re(e,t,n){return n===void 0&&(n=!0),e.filter(r=>{var s;return r.parentId===t&&(!n||((s=r.context)==null?void 0:s.open))}).flatMap(r=>[r,...Re(e,r.id,n)])}function dn(e){return"nativeEvent"in e}function ge(e,t){const n=["mouse","pen"];return t||n.push("",void 0),n.includes(e)}var mn=typeof document<"u",gn=function(){},z=mn?vt:gn;const pn={...v};function ye(e){const t=v.useRef(e);return z(()=>{t.current=e}),t}const hn=pn.useInsertionEffect,vn=hn||(e=>e());function Y(e){const t=v.useRef(()=>{if(process.env.NODE_ENV!=="production")throw new Error("Cannot call an event handler while rendering.")});return vn(()=>{t.current=e}),v.useCallback(function(){for(var n=arguments.length,o=new Array(n),r=0;r<n;r++)o[r]=arguments[r];return t.current==null?void 0:t.current(...o)},[])}function rt(e,t,n){let{reference:o,floating:r}=e;const s=Q(t),i=ze(t),c=Ye(i),u=fe(t),f=s==="y",g=o.x+o.width/2-r.width/2,m=o.y+o.height/2-r.height/2,d=o[c]/2-r[c]/2;let l;switch(u){case"top":l={x:g,y:o.y-r.height};break;case"bottom":l={x:g,y:o.y+o.height};break;case"right":l={x:o.x+o.width,y:m};break;case"left":l={x:o.x-r.width,y:m};break;default:l={x:o.x,y:o.y}}const p=ve(t);return p&&(l[i]+=d*(p==="end"?1:-1)*(n&&f?-1:1)),l}async function wn(e,t){var n;t===void 0&&(t={});const{x:o,y:r,platform:s,rects:i,elements:c,strategy:u}=e,{boundary:f="clippingAncestors",rootBoundary:g="viewport",elementContext:m="floating",altBoundary:d=!1,padding:l=0}=he(t,e),p=bt(l),y=c[d?m==="floating"?"reference":"floating":m],w=Oe(await s.getClippingRect({element:(n=await(s.isElement==null?void 0:s.isElement(y)))==null||n?y:y.contextElement||await(s.getDocumentElement==null?void 0:s.getDocumentElement(c.floating)),boundary:f,rootBoundary:g,strategy:u})),x=m==="floating"?{x:o,y:r,width:i.floating.width,height:i.floating.height}:i.reference,T=await(s.getOffsetParent==null?void 0:s.getOffsetParent(c.floating)),E=await(s.isElement==null?void 0:s.isElement(T))&&await(s.getScale==null?void 0:s.getScale(T))||{x:1,y:1},M=Oe(s.convertOffsetParentRelativeRectToViewportRelativeRect?await s.convertOffsetParentRelativeRectToViewportRelativeRect({elements:c,rect:x,offsetParent:T,strategy:u}):x);return{top:(w.top-M.top+p.top)/E.y,bottom:(M.bottom-w.bottom+p.bottom)/E.y,left:(w.left-M.left+p.left)/E.x,right:(M.right-w.right+p.right)/E.x}}const yn=50,Rn=async(e,t,n)=>{const{placement:o="bottom",strategy:r="absolute",middleware:s=[],platform:i}=n,c=i.detectOverflow?i:{...i,detectOverflow:wn},u=await(i.isRTL==null?void 0:i.isRTL(t));let f=await i.getElementRects({reference:e,floating:t,strategy:r}),{x:g,y:m}=rt(f,o,u),d=o,l=0;const p={};for(let a=0;a<s.length;a++){const y=s[a];if(!y)continue;const{name:w,fn:x}=y,{x:T,y:E,data:M,reset:C}=await x({x:g,y:m,initialPlacement:o,placement:d,strategy:r,middlewareData:p,rects:f,platform:c,elements:{reference:e,floating:t}});g=T??g,m=E??m,p[w]={...p[w],...M},C&&l<yn&&(l++,typeof C=="object"&&(C.placement&&(d=C.placement),C.rects&&(f=C.rects===!0?await i.getElementRects({reference:e,floating:t,strategy:r}):C.rects),{x:g,y:m}=rt(f,d,u)),a=-1)}return{x:g,y:m,placement:d,strategy:r,middlewareData:p}},xn=e=>({name:"arrow",options:e,async fn(t){const{x:n,y:o,placement:r,rects:s,platform:i,elements:c,middlewareData:u}=t,{element:f,padding:g=0}=he(e,t)||{};if(f==null)return{};const m=bt(g),d={x:n,y:o},l=ze(r),p=Ye(l),a=await i.getDimensions(f),y=l==="y",w=y?"top":"left",x=y?"bottom":"right",T=y?"clientHeight":"clientWidth",E=s.reference[p]+s.reference[l]-d[l]-s.floating[p],M=d[l]-s.reference[l],C=await(i.getOffsetParent==null?void 0:i.getOffsetParent(f));let P=C?C[T]:0;(!P||!await(i.isElement==null?void 0:i.isElement(C)))&&(P=c.floating[T]||s.floating[p]);const S=E/2-M/2,$=P/2-a[p]/2-1,I=ue(m[w],$),W=ue(m[x],$),_=P-a[p]-W,F=P/2-a[p]/2+S,R=Rt(I,F,_),L=!u.arrow&&ve(r)!=null&&F!==R&&s.reference[p]/2-(F<I?I:W)-a[p]/2<0,A=L?F<I?F-I:F-_:0;return{[l]:d[l]+A,data:{[l]:R,centerOffset:F-R-A,...L&&{alignmentOffset:A}},reset:L}}}),bn=function(e){return e===void 0&&(e={}),{name:"flip",options:e,async fn(t){var n,o;const{placement:r,middlewareData:s,rects:i,initialPlacement:c,platform:u,elements:f}=t,{mainAxis:g=!0,crossAxis:m=!0,fallbackPlacements:d,fallbackStrategy:l="bestFit",fallbackAxisSideDirection:p="none",flipAlignment:a=!0,...y}=he(e,t);if((n=s.arrow)!=null&&n.alignmentOffset)return{};const w=fe(r),x=Q(c),T=fe(c)===c,E=await(u.isRTL==null?void 0:u.isRTL(f.floating)),M=d||(T||!a?[Ce(c)]:Gt(c)),C=p!=="none";!d&&C&&M.push(...en(c,a,p,E));const P=[c,...M],S=await u.detectOverflow(t,y),$=[];let I=((o=s.flip)==null?void 0:o.overflows)||[];if(g&&$.push(S[w]),m){const R=qt(r,i,E);$.push(S[R[0]],S[R[1]])}if(I=[...I,{placement:r,overflows:$}],!$.every(R=>R<=0)){var W,_;const R=(((W=s.flip)==null?void 0:W.index)||0)+1,L=P[R];if(L&&(!(m==="alignment"?x!==Q(L):!1)||I.every(h=>Q(h.placement)===x?h.overflows[0]>0:!0)))return{data:{index:R,overflows:I},reset:{placement:L}};let A=(_=I.filter(b=>b.overflows[0]<=0).sort((b,h)=>b.overflows[1]-h.overflows[1])[0])==null?void 0:_.placement;if(!A)switch(l){case"bestFit":{var F;const b=(F=I.filter(h=>{if(C){const O=Q(h.placement);return O===x||O==="y"}return!0}).map(h=>[h.placement,h.overflows.filter(O=>O>0).reduce((O,D)=>O+D,0)]).sort((h,O)=>h[1]-O[1])[0])==null?void 0:F[0];b&&(A=b);break}case"initialPlacement":A=c;break}if(r!==A)return{reset:{placement:A}}}return{}}}},En=new Set(["left","top"]);async function Cn(e,t){const{placement:n,platform:o,elements:r}=e,s=await(o.isRTL==null?void 0:o.isRTL(r.floating)),i=fe(n),c=ve(n),u=Q(n)==="y",f=En.has(i)?-1:1,g=s&&u?-1:1,m=he(t,e);let{mainAxis:d,crossAxis:l,alignmentAxis:p}=typeof m=="number"?{mainAxis:m,crossAxis:0,alignmentAxis:null}:{mainAxis:m.mainAxis||0,crossAxis:m.crossAxis||0,alignmentAxis:m.alignmentAxis};return c&&typeof p=="number"&&(l=c==="end"?p*-1:p),u?{x:l*g,y:d*f}:{x:d*f,y:l*g}}const On=function(e){return e===void 0&&(e=0),{name:"offset",options:e,async fn(t){var n,o;const{x:r,y:s,placement:i,middlewareData:c}=t,u=await Cn(t,e);return i===((n=c.offset)==null?void 0:n.placement)&&(o=c.arrow)!=null&&o.alignmentOffset?{}:{x:r+u.x,y:s+u.y,data:{...u,placement:i}}}}},Pn=function(e){return e===void 0&&(e={}),{name:"shift",options:e,async fn(t){const{x:n,y:o,placement:r,platform:s}=t,{mainAxis:i=!0,crossAxis:c=!1,limiter:u={fn:x=>{let{x:T,y:E}=x;return{x:T,y:E}}},...f}=he(e,t),g={x:n,y:o},m=await s.detectOverflow(t,f),d=Q(r),l=xt(d);let p=g[l],a=g[d];const y=(x,T)=>Rt(T+m[x==="y"?"top":"left"],T,T-m[x==="y"?"bottom":"right"]);i&&(p=y(l,p)),c&&(a=y(d,a));const w=u.fn({...t,[l]:p,[d]:a});return{...w,data:{x:w.x-n,y:w.y-o,enabled:{[l]:i,[d]:c}}}}}};function Ct(e){const t=j(e);let n=parseFloat(t.width)||0,o=parseFloat(t.height)||0;const r=X(e),s=r?e.offsetWidth:n,i=r?e.offsetHeight:o,c=Ee(n)!==s||Ee(o)!==i;return c&&(n=s,o=i),{width:n,height:o,$:c}}function qe(e){return N(e)?e:e.contextElement}function le(e){const t=qe(e);if(!X(t))return G(1);const n=t.getBoundingClientRect(),{width:o,height:r,$:s}=Ct(t);let i=(s?Ee(n.width):n.width)/o,c=(s?Ee(n.height):n.height)/r;return(!i||!Number.isFinite(i))&&(i=1),(!c||!Number.isFinite(c))&&(c=1),{x:i,y:c}}const Tn=G(0);function Ot(e){const t=K(e);return!Le()||!t.visualViewport?Tn:{x:t.visualViewport.offsetLeft,y:t.visualViewport.offsetTop}}function Mn(e,t,n){return t===void 0&&(t=!1),!!n&&t&&n===K(e)}function se(e,t,n,o){t===void 0&&(t=!1),n===void 0&&(n=!1);const r=e.getBoundingClientRect(),s=qe(e);let i=G(1);t&&(o?N(o)&&(i=le(o)):i=le(e));const c=Mn(s,n,o)?Ot(s):G(0);let u=(r.left+c.x)/i.x,f=(r.top+c.y)/i.y,g=r.width/i.x,m=r.height/i.y;if(s&&o){const d=K(s),l=N(o)?K(o):o;let p=d,a=Ke(p);for(;a&&l!==p;){const y=le(a),w=a.getBoundingClientRect(),x=j(a),T=w.left+(a.clientLeft+parseFloat(x.paddingLeft))*y.x,E=w.top+(a.clientTop+parseFloat(x.paddingTop))*y.y;u*=y.x,f*=y.y,g*=y.x,m*=y.y,u+=T,f+=E,p=K(a),a=Ke(p)}}return Oe({width:g,height:m,x:u,y:f})}function De(e,t){const n=Ae(e).scrollLeft;return t?t.left+n:se(J(e)).left+n}function Pt(e,t){const n=e.getBoundingClientRect(),o=n.left+t.scrollLeft-De(e,n),r=n.top+t.scrollTop;return{x:o,y:r}}function Sn(e){let{elements:t,rect:n,offsetParent:o,strategy:r}=e;const s=r==="fixed",i=J(o),c=t?Se(t.floating):!1;if(o===i||c&&s)return n;let u={scrollLeft:0,scrollTop:0},f=G(1);const g=G(0),m=X(o);if((m||!s)&&((ae(o)!=="body"||Me(i))&&(u=Ae(o)),m)){const l=se(o);f=le(o),g.x=l.x+o.clientLeft,g.y=l.y+o.clientTop}const d=i&&!m&&!s?Pt(i,u):G(0);return{width:n.width*f.x,height:n.height*f.y,x:n.x*f.x-u.scrollLeft*f.x+g.x+d.x,y:n.y*f.y-u.scrollTop*f.y+g.y+d.y}}function Ln(e){return e.getClientRects?Array.from(e.getClientRects()):[]}function An(e){const t=Ae(e),n=e.ownerDocument.body,o=ie(e.scrollWidth,e.clientWidth,n.scrollWidth,n.clientWidth),r=ie(e.scrollHeight,e.clientHeight,n.scrollHeight,n.clientHeight);let s=-t.scrollLeft+De(e);const i=-t.scrollTop;return j(n).direction==="rtl"&&(s+=ie(e.clientWidth,n.clientWidth)-o),{width:o,height:r,x:s,y:i}}const Dn=25;function kn(e,t,n){n===void 0&&(n="viewport");const o=n==="layoutViewport",r=K(e),s=J(e),i=r.visualViewport;let c=s.clientWidth,u=s.clientHeight,f=0,g=0;if(i){const d=!Le()||t==="fixed";o?d||(f=-i.offsetLeft,g=-i.offsetTop):(c=i.width,u=i.height,d&&(f=i.offsetLeft,g=i.offsetTop))}if(De(s)<=0){const d=s.ownerDocument,l=d.body,p=getComputedStyle(l),a=d.compatMode==="CSS1Compat"&&parseFloat(p.marginLeft)+parseFloat(p.marginRight)||0,y=Math.abs(s.clientWidth-l.clientWidth-a),w=getComputedStyle(s).scrollbarGutter==="stable both-edges"?y/2:y;w<=Dn&&(c-=w)}return{width:c,height:u,x:f,y:g}}function In(e,t){const n=se(e,!0,t==="fixed"),o=n.top+e.clientTop,r=n.left+e.clientLeft,s=le(e),i=e.clientWidth*s.x,c=e.clientHeight*s.y,u=r*s.x,f=o*s.y;return{width:i,height:c,x:u,y:f}}function it(e,t,n){let o;if(t==="viewport"||t==="layoutViewport")o=kn(e,n,t);else if(t==="document")o=An(J(e));else if(N(t))o=In(t,n);else{const r=Ot(e);o={x:t.x-r.x,y:t.y-r.y,width:t.width,height:t.height}}return Oe(o)}function Fn(e,t){const n=t.get(e);if(n)return n;let o=ee(e,[],!1).filter(c=>N(c)&&ae(c)!=="body"),r=null;const s=j(e).position==="fixed";let i=s?te(e):e;for(;N(i)&&!Z(i);){const c=j(i),u=je(i),f=r?r.position:s?"fixed":"";!u&&(f==="fixed"||f==="absolute"&&c.position==="static")?o=o.filter(m=>m!==i):r=c,i=te(i)}return t.set(e,o),o}function _n(e){let{element:t,boundary:n,rootBoundary:o,strategy:r}=e;const i=[...n==="clippingAncestors"?Se(t)?[]:Fn(t,this._c):[].concat(n),o],c=it(t,i[0],r);let u=c.top,f=c.right,g=c.bottom,m=c.left;for(let d=1;d<i.length;d++){const l=it(t,i[d],r);u=ie(l.top,u),f=ue(l.right,f),g=ue(l.bottom,g),m=ie(l.left,m)}return{width:f-m,height:g-u,x:m,y:u}}function $n(e){const{width:t,height:n}=Ct(e);return{width:t,height:n}}function Nn(e,t,n){const o=X(t),r=J(t),s=n==="fixed",i=se(e,!0,s,t);let c={scrollLeft:0,scrollTop:0};const u=G(0);if((o||!s)&&((ae(t)!=="body"||Me(r))&&(c=Ae(t)),o)){const d=se(t,!0,s,t);u.x=d.x+t.clientLeft,u.y=d.y+t.clientTop}!o&&r&&(u.x=De(r));const f=r&&!o&&!s?Pt(r,c):G(0),g=i.left+c.scrollLeft-u.x-f.x,m=i.top+c.scrollTop-u.y-f.y;return{x:g,y:m,width:i.width,height:i.height}}function _e(e){return j(e).position==="static"}function st(e,t){if(!X(e)||j(e).position==="fixed")return null;if(t)return t(e);let n=e.offsetParent;return J(e)===n&&(n=n.ownerDocument.body),n}function Tt(e,t){const n=K(e);if(Se(e))return n;if(!X(e)){let r=te(e);for(;r&&!Z(r);){if(N(r)&&!_e(r))return r;r=te(r)}return n}let o=st(e,t);for(;o&&Xt(o)&&_e(o);)o=st(o,t);return o&&Z(o)&&_e(o)&&!je(o)?n:o||Yt(e)||n}const Wn=async function(e){const t=this.getOffsetParent||Tt,n=this.getDimensions,o=await n(e.floating);return{reference:Nn(e.reference,await t(e.floating),e.strategy),floating:{x:0,y:0,width:o.width,height:o.height}}};function Vn(e){return j(e).direction==="rtl"}const Bn={convertOffsetParentRelativeRectToViewportRelativeRect:Sn,getDocumentElement:J,getClippingRect:_n,getOffsetParent:Tt,getElementRects:Wn,getClientRects:Ln,getDimensions:$n,getScale:le,isElement:N,isRTL:Vn};function Mt(e,t){return e.x===t.x&&e.y===t.y&&e.width===t.width&&e.height===t.height}function Hn(e,t,n){let o=null,r;const s=J(e);function i(){var g;clearTimeout(r),(g=o)==null||g.disconnect(),o=null}function c(g,m){g===void 0&&(g=!1),m===void 0&&(m=1),i();const d=e.getBoundingClientRect(),{left:l,top:p,width:a,height:y}=d;if(g||t(),!a||!y)return;const w=we(p),x=we(s.clientWidth-(l+a)),T=we(s.clientHeight-(p+y)),E=we(l),C={rootMargin:-w+"px "+-x+"px "+-T+"px "+-E+"px",threshold:ie(0,ue(1,m))||1};let P=!0;function S($){const I=$[0].intersectionRatio;if(!Mt(d,e.getBoundingClientRect()))return c();if(I!==m){if(!P)return c();I?c(!1,I):r=setTimeout(()=>{c(!1,1e-7)},1e3)}P=!1}try{o=new IntersectionObserver(S,{...C,root:s.ownerDocument})}catch{o=new IntersectionObserver(S,C)}o.observe(e)}const u=K(e),f=()=>c(n);return u.addEventListener("resize",f),c(!0),()=>{u.removeEventListener("resize",f),i()}}function Kn(e,t,n,o){o===void 0&&(o={});const{ancestorScroll:r=!0,ancestorResize:s=!0,elementResize:i=typeof ResizeObserver=="function",layoutShift:c=typeof IntersectionObserver=="function",animationFrame:u=!1}=o,f=qe(e),g=r||s?[...f?ee(f):[],...t?ee(t):[]]:[];g.forEach(w=>{r&&w.addEventListener("scroll",n),s&&w.addEventListener("resize",n)});const m=f&&c?Hn(f,n,s):null;let d=-1,l=null;i&&(l=new ResizeObserver(w=>{let[x]=w;x&&x.target===f&&l&&t&&(l.unobserve(t),cancelAnimationFrame(d),d=requestAnimationFrame(()=>{var T;(T=l)==null||T.observe(t)})),n()}),f&&!u&&l.observe(f),t&&l.observe(t));let p,a=u?se(e):null;u&&y();function y(){const w=se(e);a&&!Mt(a,w)&&n(),a=w,p=requestAnimationFrame(y)}return n(),()=>{var w;g.forEach(x=>{r&&x.removeEventListener("scroll",n),s&&x.removeEventListener("resize",n)}),m?.(),(w=l)==null||w.disconnect(),l=null,u&&cancelAnimationFrame(p)}}const Xn=On,Un=Pn,jn=bn,ct=xn,Yn=(e,t,n)=>{const o=new Map,r=n??{},s={...Bn,...r.platform,_c:o};return Rn(e,t,{...r,platform:s})};var zn=typeof document<"u",qn=function(){},xe=zn?vt:qn;function Pe(e,t){if(e===t)return!0;if(typeof e!=typeof t)return!1;if(typeof e=="function"&&e.toString()===t.toString())return!0;let n,o,r;if(e&&t&&typeof e=="object"){if(Array.isArray(e)){if(n=e.length,n!==t.length)return!1;for(o=n;o--!==0;)if(!Pe(e[o],t[o]))return!1;return!0}if(r=Object.keys(e),n=r.length,n!==Object.keys(t).length)return!1;for(o=n;o--!==0;)if(!{}.hasOwnProperty.call(t,r[o]))return!1;for(o=n;o--!==0;){const s=r[o];if(!(s==="_owner"&&e.$$typeof)&&!Pe(e[s],t[s]))return!1}return!0}return e!==e&&t!==t}function St(e){return typeof window>"u"?1:(e.ownerDocument.defaultView||window).devicePixelRatio||1}function lt(e,t){const n=St(e);return Math.round(t*n)/n}function $e(e){const t=v.useRef(e);return xe(()=>{t.current=e}),t}function Gn(e){e===void 0&&(e={});const{placement:t="bottom",strategy:n="absolute",middleware:o=[],platform:r,elements:{reference:s,floating:i}={},transform:c=!0,whileElementsMounted:u,open:f}=e,[g,m]=v.useState({x:0,y:0,strategy:n,placement:t,middlewareData:{},isPositioned:!1}),[d,l]=v.useState(o);Pe(d,o)||l(o);const[p,a]=v.useState(null),[y,w]=v.useState(null),x=v.useCallback(h=>{h!==C.current&&(C.current=h,a(h))},[]),T=v.useCallback(h=>{h!==P.current&&(P.current=h,w(h))},[]),E=s||p,M=i||y,C=v.useRef(null),P=v.useRef(null),S=v.useRef(g),$=u!=null,I=$e(u),W=$e(r),_=$e(f),F=v.useCallback(()=>{if(!C.current||!P.current)return;const h={placement:t,strategy:n,middleware:d};W.current&&(h.platform=W.current),Yn(C.current,P.current,h).then(O=>{const D={...O,isPositioned:_.current!==!1};R.current&&!Pe(S.current,D)&&(S.current=D,Kt.flushSync(()=>{m(D)}))})},[d,t,n,W,_]);xe(()=>{f===!1&&S.current.isPositioned&&(S.current.isPositioned=!1,m(h=>({...h,isPositioned:!1})))},[f]);const R=v.useRef(!1);xe(()=>(R.current=!0,()=>{R.current=!1}),[]),xe(()=>{if(E&&(C.current=E),M&&(P.current=M),E&&M){if(I.current)return I.current(E,M,F);F()}},[E,M,F,I,$]);const L=v.useMemo(()=>({reference:C,floating:P,setReference:x,setFloating:T}),[x,T]),A=v.useMemo(()=>({reference:E,floating:M}),[E,M]),b=v.useMemo(()=>{const h={position:n,left:0,top:0};if(!A.floating)return h;const O=lt(A.floating,g.x),D=lt(A.floating,g.y);return c?{...h,transform:"translate("+O+"px, "+D+"px)",...St(A.floating)>=1.5&&{willChange:"transform"}}:{position:n,left:O,top:D}},[n,c,A.floating,g.x,g.y]);return v.useMemo(()=>({...g,update:F,refs:L,elements:A,floatingStyles:b}),[g,F,L,A,b])}const Jn=e=>{function t(n){return{}.hasOwnProperty.call(n,"current")}return{name:"arrow",options:e,fn(n){const{element:o,padding:r}=typeof e=="function"?e(n):e;return o&&t(o)?o.current!=null?ct({element:o.current,padding:r}).fn(n):{}:o?ct({element:o,padding:r}).fn(n):{}}}},Qn=(e,t)=>{const n=Xn(e);return{name:n.name,fn:n.fn,options:[e,t]}},Zn=(e,t)=>{const n=Un(e);return{name:n.name,fn:n.fn,options:[e,t]}},eo=(e,t)=>{const n=jn(e);return{name:n.name,fn:n.fn,options:[e,t]}},to=(e,t)=>{const n=Jn(e);return{name:n.name,fn:n.fn,options:[e,t]}},no="data-floating-ui-focusable",ut="active",ft="selected",oo={...v};let at=!1,ro=0;const dt=()=>"floating-ui-"+Math.random().toString(36).slice(2,6)+ro++;function io(){const[e,t]=v.useState(()=>at?dt():void 0);return z(()=>{e==null&&t(dt())},[]),v.useEffect(()=>{at=!0},[]),e}const so=oo.useId,Ge=so||io;let pe;process.env.NODE_ENV!=="production"&&(pe=new Set);function co(){for(var e,t=arguments.length,n=new Array(t),o=0;o<t;o++)n[o]=arguments[o];const r="Floating UI: "+n.join(" ");if(!((e=pe)!=null&&e.has(r))){var s;(s=pe)==null||s.add(r),console.warn(r)}}function lo(){for(var e,t=arguments.length,n=new Array(t),o=0;o<t;o++)n[o]=arguments[o];const r="Floating UI: "+n.join(" ");if(!((e=pe)!=null&&e.has(r))){var s;(s=pe)==null||s.add(r),console.error(r)}}const uo=v.forwardRef(function(t,n){const{context:{placement:o,elements:{floating:r},middlewareData:{arrow:s,shift:i}},width:c=14,height:u=7,tipRadius:f=0,strokeWidth:g=0,staticOffset:m,stroke:d,d:l,style:{transform:p,...a}={},...y}=t;process.env.NODE_ENV!=="production"&&(n||co("The `ref` prop is required for `FloatingArrow`."));const w=Ge(),[x,T]=v.useState(!1);if(z(()=>{if(!r)return;j(r).direction==="rtl"&&T(!0)},[r]),!r)return null;const[E,M]=o.split("-"),C=E==="top"||E==="bottom";let P=m;(C&&i!=null&&i.x||!C&&i!=null&&i.y)&&(P=null);const S=g*2,$=S/2,I=c/2*(f/-8+1),W=u/2*f/4,_=!!l,F=P&&M==="end"?"bottom":"top";let R=P&&M==="end"?"right":"left";P&&x&&(R=M==="end"?"left":"right");const L=s?.x!=null?P||s.x:"",A=s?.y!=null?P||s.y:"",b=l||"M0,0"+(" H"+c)+(" L"+(c-I)+","+(u-W))+(" Q"+c/2+","+u+" "+I+","+(u-W))+" Z",h={top:_?"rotate(180deg)":"",left:_?"rotate(90deg)":"rotate(-90deg)",bottom:_?"":"rotate(180deg)",right:_?"rotate(-90deg)":"rotate(90deg)"}[E];return Be("svg",{...y,"aria-hidden":!0,ref:n,width:_?c:c+S,height:c,viewBox:"0 0 "+c+" "+(u>c?u:c),style:{position:"absolute",pointerEvents:"none",[R]:L,[F]:A,[E]:C||_?"100%":"calc(100% - "+S/2+"px)",transform:[h,p].filter(O=>!!O).join(" "),...a},children:[S>0&&oe("path",{clipPath:"url(#"+w+")",fill:"none",stroke:d,strokeWidth:S+(l?0:1),d:b}),oe("path",{stroke:S&&!l?y.fill:"none",d:b}),oe("clipPath",{id:w,children:oe("rect",{x:-$,y:$*(_?-1:1),width:c+S,height:c})})]})});function fo(){const e=new Map;return{emit(t,n){var o;(o=e.get(t))==null||o.forEach(r=>r(n))},on(t,n){e.has(t)||e.set(t,new Set),e.get(t).add(n)},off(t,n){var o;(o=e.get(t))==null||o.delete(n)}}}const ao=v.createContext(null),mo=v.createContext(null),Je=()=>{var e;return((e=v.useContext(ao))==null?void 0:e.id)||null},Qe=()=>v.useContext(mo);function Ze(e){return"data-floating-ui-"+e}function U(e){e.current!==-1&&(clearTimeout(e.current),e.current=-1)}const mt=Ze("safe-polygon");function be(e,t,n){if(n&&!ge(n))return 0;if(typeof e=="number")return e;if(typeof e=="function"){const o=e();return typeof o=="number"?o:o?.[t]}return e?.[t]}function Ne(e){return typeof e=="function"?e():e}function go(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,dataRef:r,events:s,elements:i}=e,{enabled:c=!0,delay:u=0,handleClose:f=null,mouseOnly:g=!1,restMs:m=0,move:d=!0}=t,l=Qe(),p=Je(),a=ye(f),y=ye(u),w=ye(n),x=ye(m),T=v.useRef(),E=v.useRef(-1),M=v.useRef(),C=v.useRef(-1),P=v.useRef(!0),S=v.useRef(!1),$=v.useRef(()=>{}),I=v.useRef(!1),W=Y(()=>{var b;const h=(b=r.current.openEvent)==null?void 0:b.type;return h?.includes("mouse")&&h!=="mousedown"});v.useEffect(()=>{if(!c)return;function b(h){let{open:O}=h;O||(U(E),U(C),P.current=!0,I.current=!1)}return s.on("openchange",b),()=>{s.off("openchange",b)}},[c,s]),v.useEffect(()=>{if(!c||!a.current||!n)return;function b(O){W()&&o(!1,O,"hover")}const h=re(i.floating).documentElement;return h.addEventListener("mouseleave",b),()=>{h.removeEventListener("mouseleave",b)}},[i.floating,n,o,c,a,W]);const _=v.useCallback(function(b,h,O){h===void 0&&(h=!0),O===void 0&&(O="hover");const D=be(y.current,"close",T.current);D&&!M.current?(U(E),E.current=window.setTimeout(()=>o(!1,b,O),D)):h&&(U(E),o(!1,b,O))},[y,o]),F=Y(()=>{$.current(),M.current=void 0}),R=Y(()=>{if(S.current){const b=re(i.floating).body;b.style.pointerEvents="",b.removeAttribute(mt),S.current=!1}}),L=Y(()=>r.current.openEvent?["click","mousedown"].includes(r.current.openEvent.type):!1);v.useEffect(()=>{if(!c)return;function b(k){if(U(E),P.current=!1,g&&!ge(T.current)||Ne(x.current)>0&&!be(y.current,"open"))return;const V=be(y.current,"open",T.current);V?E.current=window.setTimeout(()=>{w.current||o(!0,k,"hover")},V):n||o(!0,k,"hover")}function h(k){if(L()){R();return}$.current();const V=re(i.floating);if(U(C),I.current=!1,a.current&&r.current.floatingContext){n||U(E),M.current=a.current({...r.current.floatingContext,tree:l,x:k.clientX,y:k.clientY,onClose(){R(),F(),L()||_(k,!0,"safe-polygon")}});const H=M.current;V.addEventListener("mousemove",H),$.current=()=>{V.removeEventListener("mousemove",H)};return}(T.current!=="touch"||!me(i.floating,k.relatedTarget))&&_(k)}function O(k){L()||r.current.floatingContext&&(a.current==null||a.current({...r.current.floatingContext,tree:l,x:k.clientX,y:k.clientY,onClose(){R(),F(),L()||_(k)}})(k))}function D(){U(E)}function B(k){L()||_(k,!1)}if(N(i.domReference)){const k=i.domReference,V=i.floating;return n&&k.addEventListener("mouseleave",O),d&&k.addEventListener("mousemove",b,{once:!0}),k.addEventListener("mouseenter",b),k.addEventListener("mouseleave",h),V&&(V.addEventListener("mouseleave",O),V.addEventListener("mouseenter",D),V.addEventListener("mouseleave",B)),()=>{n&&k.removeEventListener("mouseleave",O),d&&k.removeEventListener("mousemove",b),k.removeEventListener("mouseenter",b),k.removeEventListener("mouseleave",h),V&&(V.removeEventListener("mouseleave",O),V.removeEventListener("mouseenter",D),V.removeEventListener("mouseleave",B))}}},[i,c,e,g,d,_,F,R,o,n,w,l,y,a,r,L,x]),z(()=>{var b;if(c&&n&&(b=a.current)!=null&&(b=b.__options)!=null&&b.blockPointerEvents&&W()){S.current=!0;const O=i.floating;if(N(i.domReference)&&O){var h;const D=re(i.floating).body;D.setAttribute(mt,"");const B=i.domReference,k=l==null||(h=l.nodesRef.current.find(V=>V.id===p))==null||(h=h.context)==null?void 0:h.elements.floating;return k&&(k.style.pointerEvents=""),D.style.pointerEvents="none",B.style.pointerEvents="auto",O.style.pointerEvents="auto",()=>{D.style.pointerEvents="",B.style.pointerEvents="",O.style.pointerEvents=""}}}},[c,n,p,i,l,a,W]),z(()=>{n||(T.current=void 0,I.current=!1,F(),R())},[n,F,R]),v.useEffect(()=>()=>{F(),U(E),U(C),R()},[c,i.domReference,F,R]);const A=v.useMemo(()=>{function b(h){T.current=h.pointerType}return{onPointerDown:b,onPointerEnter:b,onMouseMove(h){const{nativeEvent:O}=h;function D(){!P.current&&!w.current&&o(!0,O,"hover")}g&&!ge(T.current)||n||Ne(x.current)===0||I.current&&h.movementX**2+h.movementY**2<2||(U(C),T.current==="touch"?D():(I.current=!0,C.current=window.setTimeout(D,Ne(x.current))))}}},[g,o,n,w,x]);return v.useMemo(()=>c?{reference:A}:{},[c,A])}const Ue=()=>{},po=v.createContext({delay:0,initialDelay:0,timeoutMs:0,currentId:null,setCurrentId:Ue,setState:Ue,isInstantPhase:!1}),ho=()=>v.useContext(po);function vo(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,floatingId:r}=e,{id:s,enabled:i=!0}=t,c=s??r,u=ho(),{currentId:f,setCurrentId:g,initialDelay:m,setState:d,timeoutMs:l}=u;return z(()=>{i&&f&&(d({delay:{open:1,close:be(m,"close")}}),f!==c&&o(!1))},[i,c,o,d,f,m]),z(()=>{function p(){o(!1),d({delay:m,currentId:null})}if(i&&f&&!n&&f===c){if(l){const a=window.setTimeout(p,l);return()=>{clearTimeout(a)}}p()}},[i,n,d,f,c,o,m,l]),z(()=>{i&&(g===Ue||!n||g(c))},[i,n,g,c]),u}function gt(e){return X(e.target)&&e.target.tagName==="BUTTON"}function wo(e){return X(e.target)&&e.target.tagName==="A"}function pt(e){return Et(e)}function yo(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,dataRef:r,elements:{domReference:s}}=e,{enabled:i=!0,event:c="click",toggle:u=!0,ignoreMouse:f=!1,keyboardHandlers:g=!0,stickIfOpen:m=!0}=t,d=v.useRef(),l=v.useRef(!1),p=v.useMemo(()=>({onPointerDown(a){d.current=a.pointerType},onMouseDown(a){const y=d.current;a.button===0&&c!=="click"&&(ge(y,!0)&&f||(n&&u&&(!(r.current.openEvent&&m)||r.current.openEvent.type==="mousedown")?o(!1,a.nativeEvent,"click"):(a.preventDefault(),o(!0,a.nativeEvent,"click"))))},onClick(a){const y=d.current;if(c==="mousedown"&&d.current){d.current=void 0;return}ge(y,!0)&&f||(n&&u&&(!(r.current.openEvent&&m)||r.current.openEvent.type==="click")?o(!1,a.nativeEvent,"click"):o(!0,a.nativeEvent,"click"))},onKeyDown(a){d.current=void 0,!(a.defaultPrevented||!g||gt(a))&&(a.key===" "&&!pt(s)&&(a.preventDefault(),l.current=!0),!wo(a)&&a.key==="Enter"&&o(!(n&&u),a.nativeEvent,"click"))},onKeyUp(a){a.defaultPrevented||!g||gt(a)||pt(s)||a.key===" "&&l.current&&(l.current=!1,o(!(n&&u),a.nativeEvent,"click"))}}),[r,s,c,f,g,o,n,m,u]);return v.useMemo(()=>i?{reference:p}:{},[i,p])}const Ro={pointerdown:"onPointerDown",mousedown:"onMouseDown",click:"onClick"},xo={pointerdown:"onPointerDownCapture",mousedown:"onMouseDownCapture",click:"onClickCapture"},ht=e=>{var t,n;return{escapeKey:typeof e=="boolean"?e:(t=e?.escapeKey)!=null?t:!1,outsidePress:typeof e=="boolean"?e:(n=e?.outsidePress)!=null?n:!0}};function bo(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,elements:r,dataRef:s}=e,{enabled:i=!0,escapeKey:c=!0,outsidePress:u=!0,outsidePressEvent:f="pointerdown",referencePress:g=!1,referencePressEvent:m="pointerdown",ancestorScroll:d=!1,bubbles:l,capture:p}=t,a=Qe(),y=Y(typeof u=="function"?u:()=>!1),w=typeof u=="function"?y:u,x=v.useRef(!1),{escapeKey:T,outsidePress:E}=ht(l),{escapeKey:M,outsidePress:C}=ht(p),P=v.useRef(!1),S=Y(R=>{var L;if(!n||!i||!c||R.key!=="Escape"||P.current)return;const A=(L=s.current.floatingContext)==null?void 0:L.nodeId,b=a?Re(a.nodesRef.current,A):[];if(!T&&(R.stopPropagation(),b.length>0)){let h=!0;if(b.forEach(O=>{var D;if((D=O.context)!=null&&D.open&&!O.context.dataRef.current.__escapeKeyBubbles){h=!1;return}}),!h)return}o(!1,dn(R)?R.nativeEvent:R,"escape-key")}),$=Y(R=>{var L;const A=()=>{var b;S(R),(b=ce(R))==null||b.removeEventListener("keydown",A)};(L=ce(R))==null||L.addEventListener("keydown",A)}),I=Y(R=>{var L;const A=s.current.insideReactTree;s.current.insideReactTree=!1;const b=x.current;if(x.current=!1,f==="click"&&b||A||typeof w=="function"&&!w(R))return;const h=ce(R),O="["+Ze("inert")+"]",D=re(r.floating).querySelectorAll(O);let B=N(h)?h:null;for(;B&&!Z(B);){const H=te(B);if(Z(H)||!N(H))break;B=H}if(D.length&&N(h)&&!un(h)&&!me(h,r.floating)&&Array.from(D).every(H=>!me(B,H)))return;if(X(h)&&F){const H=Z(h),q=j(h),de=/auto|scroll/,Lt=H||de.test(q.overflowX),At=H||de.test(q.overflowY),Dt=Lt&&h.clientWidth>0&&h.scrollWidth>h.clientWidth,kt=At&&h.clientHeight>0&&h.scrollHeight>h.clientHeight,It=q.direction==="rtl",Ft=kt&&(It?R.offsetX<=h.offsetWidth-h.clientWidth:R.offsetX>h.clientWidth),_t=Dt&&R.offsetY>h.clientHeight;if(Ft||_t)return}const k=(L=s.current.floatingContext)==null?void 0:L.nodeId,V=a&&Re(a.nodesRef.current,k).some(H=>{var q;return Fe(R,(q=H.context)==null?void 0:q.elements.floating)});if(Fe(R,r.floating)||Fe(R,r.domReference)||V)return;const ke=a?Re(a.nodesRef.current,k):[];if(ke.length>0){let H=!0;if(ke.forEach(q=>{var de;if((de=q.context)!=null&&de.open&&!q.context.dataRef.current.__outsidePressBubbles){H=!1;return}}),!H)return}o(!1,R,"outside-press")}),W=Y(R=>{var L;const A=()=>{var b;I(R),(b=ce(R))==null||b.removeEventListener(f,A)};(L=ce(R))==null||L.addEventListener(f,A)});v.useEffect(()=>{if(!n||!i)return;s.current.__escapeKeyBubbles=T,s.current.__outsidePressBubbles=E;let R=-1;function L(D){o(!1,D,"ancestor-scroll")}function A(){window.clearTimeout(R),P.current=!0}function b(){R=window.setTimeout(()=>{P.current=!1},Le()?5:0)}const h=re(r.floating);c&&(h.addEventListener("keydown",M?$:S,M),h.addEventListener("compositionstart",A),h.addEventListener("compositionend",b)),w&&h.addEventListener(f,C?W:I,C);let O=[];return d&&(N(r.domReference)&&(O=ee(r.domReference)),N(r.floating)&&(O=O.concat(ee(r.floating))),!N(r.reference)&&r.reference&&r.reference.contextElement&&(O=O.concat(ee(r.reference.contextElement)))),O=O.filter(D=>{var B;return D!==((B=h.defaultView)==null?void 0:B.visualViewport)}),O.forEach(D=>{D.addEventListener("scroll",L)}),()=>{c&&(h.removeEventListener("keydown",M?$:S,M),h.removeEventListener("compositionstart",A),h.removeEventListener("compositionend",b)),w&&h.removeEventListener(f,C?W:I,C),O.forEach(D=>{D.removeEventListener("scroll",L)}),window.clearTimeout(R)}},[s,r,c,w,f,n,o,d,i,T,E,S,M,$,I,C,W]),v.useEffect(()=>{s.current.insideReactTree=!1},[s,w,f]);const _=v.useMemo(()=>({onKeyDown:S,...g&&{[Ro[m]]:R=>{o(!1,R.nativeEvent,"reference-press")},...m!=="click"&&{onClick(R){o(!1,R.nativeEvent,"reference-press")}}}}),[S,o,g,m]),F=v.useMemo(()=>{function R(L){L.button===0&&(x.current=!0)}return{onKeyDown:S,onMouseDown:R,onMouseUp:R,[xo[f]]:()=>{s.current.insideReactTree=!0}}},[S,f,s]);return v.useMemo(()=>i?{reference:_,floating:F}:{},[i,_,F])}function Eo(e){const{open:t=!1,onOpenChange:n,elements:o}=e,r=Ge(),s=v.useRef({}),[i]=v.useState(()=>fo()),c=Je()!=null;if(process.env.NODE_ENV!=="production"){const l=o.reference;l&&!N(l)&&lo("Cannot pass a virtual element to the `elements.reference` option,","as it must be a real DOM element. Use `refs.setPositionReference()`","instead.")}const[u,f]=v.useState(o.reference),g=Y((l,p,a)=>{s.current.openEvent=l?p:void 0,i.emit("openchange",{open:l,event:p,reason:a,nested:c}),n?.(l,p,a)}),m=v.useMemo(()=>({setPositionReference:f}),[]),d=v.useMemo(()=>({reference:u||o.reference||null,floating:o.floating||null,domReference:o.reference}),[u,o.reference,o.floating]);return v.useMemo(()=>({dataRef:s,open:t,onOpenChange:g,elements:d,events:i,floatingId:r,refs:m}),[t,g,d,i,r,m])}function Co(e){var t,n;let{elements:o,...r}=e===void 0?{}:e;const{nodeId:s}=r,i=Eo({...r,elements:{reference:(t=o?.reference)!=null?t:null,floating:(n=o?.floating)!=null?n:null}}),c=r.rootContext||i,u=c.elements,[f,g]=v.useState(null),[m,d]=v.useState(null),p=u?.domReference||f,a=v.useRef(null),y=Qe();z(()=>{p&&(a.current=p)},[p]);const w=Gn({...r,elements:{...u,...m&&{reference:m}}}),x=v.useCallback(P=>{const S=N(P)?{getBoundingClientRect:()=>P.getBoundingClientRect(),getClientRects:()=>P.getClientRects(),contextElement:P}:P;d(S),w.refs.setReference(S)},[w.refs]),T=v.useCallback(P=>{(N(P)||P===null)&&(a.current=P,g(P)),(N(w.refs.reference.current)||w.refs.reference.current===null||P!==null&&!N(P))&&w.refs.setReference(P)},[w.refs]),E=v.useMemo(()=>({...w.refs,setReference:T,setPositionReference:x,domReference:a}),[w.refs,T,x]),M=v.useMemo(()=>({...w.elements,domReference:p}),[w.elements,p]),C=v.useMemo(()=>({...w,...c,refs:E,elements:M,nodeId:s}),[w,E,M,s,c]);return z(()=>{c.dataRef.current.floatingContext=C;const P=y?.nodesRef.current.find(S=>S.id===s);P&&(P.context=C)}),v.useMemo(()=>({...w,context:C,refs:E,elements:M}),[w,E,M,C])}function We(){return sn()&&rn()}function Oo(e,t){t===void 0&&(t={});const{open:n,onOpenChange:o,events:r,dataRef:s,elements:i}=e,{enabled:c=!0,visibleOnly:u=!0}=t,f=v.useRef(!1),g=v.useRef(-1),m=v.useRef(!0);v.useEffect(()=>{if(!c)return;const l=K(i.domReference);function p(){!n&&X(i.domReference)&&i.domReference===ot(re(i.domReference))&&(f.current=!0)}function a(){m.current=!0}function y(){m.current=!1}return l.addEventListener("blur",p),We()&&(l.addEventListener("keydown",a,!0),l.addEventListener("pointerdown",y,!0)),()=>{l.removeEventListener("blur",p),We()&&(l.removeEventListener("keydown",a,!0),l.removeEventListener("pointerdown",y,!0))}},[i.domReference,n,c]),v.useEffect(()=>{if(!c)return;function l(p){let{reason:a}=p;(a==="reference-press"||a==="escape-key")&&(f.current=!0)}return r.on("openchange",l),()=>{r.off("openchange",l)}},[r,c]),v.useEffect(()=>()=>{U(g)},[]);const d=v.useMemo(()=>({onMouseLeave(){f.current=!1},onFocus(l){if(f.current)return;const p=ce(l.nativeEvent);if(u&&N(p)){if(We()&&!l.relatedTarget){if(!m.current&&!Et(p))return}else if(!fn(p))return}o(!0,l.nativeEvent,"focus")},onBlur(l){f.current=!1;const p=l.relatedTarget,a=l.nativeEvent,y=N(p)&&p.hasAttribute(Ze("focus-guard"))&&p.getAttribute("data-type")==="outside";g.current=window.setTimeout(()=>{var w;const x=ot(i.domReference?i.domReference.ownerDocument:document);!p&&x===i.domReference||me((w=s.current.floatingContext)==null?void 0:w.refs.floating.current,x)||me(i.domReference,x)||y||o(!1,a,"focus")})}}),[s,i.domReference,o,u]);return v.useMemo(()=>c?{reference:d}:{},[c,d])}function Ve(e,t,n){const o=new Map,r=n==="item";let s=e;if(r&&e){const{[ut]:i,[ft]:c,...u}=e;s=u}return{...n==="floating"&&{tabIndex:-1,[no]:""},...s,...t.map(i=>{const c=i?i[n]:null;return typeof c=="function"?e?c(e):null:c}).concat(e).reduce((i,c)=>(c&&Object.entries(c).forEach(u=>{let[f,g]=u;if(!(r&&[ut,ft].includes(f)))if(f.indexOf("on")===0){if(o.has(f)||o.set(f,[]),typeof g=="function"){var m;(m=o.get(f))==null||m.push(g),i[f]=function(){for(var d,l=arguments.length,p=new Array(l),a=0;a<l;a++)p[a]=arguments[a];return(d=o.get(f))==null?void 0:d.map(y=>y(...p)).find(y=>y!==void 0)}}}else i[f]=g}),i),{})}}function Po(e){e===void 0&&(e=[]);const t=e.map(c=>c?.reference),n=e.map(c=>c?.floating),o=e.map(c=>c?.item),r=v.useCallback(c=>Ve(c,e,"reference"),t),s=v.useCallback(c=>Ve(c,e,"floating"),n),i=v.useCallback(c=>Ve(c,e,"item"),o);return v.useMemo(()=>({getReferenceProps:r,getFloatingProps:s,getItemProps:i}),[r,s,i])}const To=new Map([["select","listbox"],["combobox","listbox"],["label",!1]]);function Mo(e,t){var n,o;t===void 0&&(t={});const{open:r,elements:s,floatingId:i}=e,{enabled:c=!0,role:u="dialog"}=t,f=Ge(),g=((n=s.domReference)==null?void 0:n.id)||f,m=v.useMemo(()=>{var x;return((x=an(s.floating))==null?void 0:x.id)||i},[s.floating,i]),d=(o=To.get(u))!=null?o:u,p=Je()!=null,a=v.useMemo(()=>d==="tooltip"||u==="label"?{["aria-"+(u==="label"?"labelledby":"describedby")]:r?m:void 0}:{"aria-expanded":r?"true":"false","aria-haspopup":d==="alertdialog"?"dialog":d,"aria-controls":r?m:void 0,...d==="listbox"&&{role:"combobox"},...d==="menu"&&{id:g},...d==="menu"&&p&&{role:"menuitem"},...u==="select"&&{"aria-autocomplete":"none"},...u==="combobox"&&{"aria-autocomplete":"list"}},[d,m,p,r,g,u]),y=v.useMemo(()=>{const x={id:m,...d&&{role:d}};return d==="tooltip"||u==="label"?x:{...x,...d==="menu"&&{"aria-labelledby":g}}},[d,m,g,u]),w=v.useCallback(x=>{let{active:T,selected:E}=x;const M={role:"option",...T&&{id:m+"-fui-option"}};switch(u){case"select":case"combobox":return{...M,"aria-selected":E}}return{}},[m,u]);return v.useMemo(()=>c?{reference:a,floating:y,item:w}:{},[c,a,y,w])}function Do({closeDelay:e=300,offset:t=20,openDelay:n=0,placement:o="bottom-start",slots:r,trigger:s=["hover","focus"],withArrow:i=!0,arrow:c,role:u="dialog",visible:f={},hidden:g={},floatingOptions:m={},isOpen:d,onOpenChange:l}){const[p,a]=Nt(!1),y=Wt(null),w=Vt(),{x,y:T,strategy:E,refs:M,context:C}=Co({placement:o,middleware:[Qn(t),eo(),Zn(),to({element:y})],open:d||p,onOpenChange:l||a,whileElementsMounted:Kn,...m}),P=bo(C),S=Mo(C,{role:u}),{delay:$}=vo(C,{id:w}),W=go(C,{delay:$||{open:n,close:e}}),_=Oo(C),F=yo(C),R=[s.find(k=>k==="hover")?W:void 0,s.find(k=>k==="click")?F:void 0,s.find(k=>k==="focus")?_:void 0,P,S],{getReferenceProps:L,getFloatingProps:A}=Po(R),{onClick:b,...h}=L(),O=String((r?.content?.props).className).includes("pressable")?{onPress:b}:{onClick:b},D=r?.content?Bt(r.content,{...r.content.props,ref:M.setReference,...h,...O}):oe("div",{ref:M.setReference,...L(),children:"Menu Action"}),B=r?.submenu?Be(Ht.nav,{ref:M.setFloating,style:{position:E,top:T??0,left:x??0,width:"max-content",zIndex:50},...A(),variants:{hidden:g,visible:f},initial:"hidden",animate:d||p?"visible":"hidden",children:[i&&oe(uo,{ref:y,context:C,...c}),r.submenu]}):oe("nav",{children:"Submenu"});return Be($t,{children:[D,B]})}export{Do as Menu,Do as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as f}from"react/jsx-runtime";import{Meter as p,Label as h}from"react-aria-components";import{
|
|
1
|
+
"use client";import{jsx as t,jsxs as f}from"react/jsx-runtime";import{Meter as p,Label as h}from"react-aria-components";import{m as x}from"framer-motion";import{cn as e}from"../../utils/cn.js";function w({label:a,showValue:l=!0,value:n=0,minValue:o=0,maxValue:s=100,formatOptions:c={style:"percent"},className:d,classNames:r,...m}){return t(p,{className:e("flex flex-col gap-2",d),value:n,minValue:o,maxValue:s,formatOptions:c,...m,children:({percentage:i,valueText:u})=>f("div",{className:e("flex justify-between items-center gap-4",r?.labelWrapper),children:[a&&t(h,{className:e("text-sm",r?.label),children:a}),t("div",{className:e("flex-auto h-2.5 rounded-md bg-slate-300 forced-color-adjust-none overflow-hidden",r?.trackWrapepr),children:t(x.div,{className:e("h-full bg-surface-inverse-hover",r?.track),initial:{width:`${i}%`},animate:{width:`${i}%`},transition:{type:"spring",bounce:0}})}),l&&t("span",{className:e("text-sm tabular-nums ml-auto",r?.value),children:u})]})})}export{w as Meter,w as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsxs as h,jsx as
|
|
1
|
+
"use client";import{jsxs as h,jsx as n,Fragment as d}from"react/jsx-runtime";import{memo as p,useState as b,useCallback as f,useId as x,useMemo as g}from"react";import{m as s}from"framer-motion";import N from"./hooks/useColumnTransition.js";const k=/^-?\d*\.?\d+$/;function $({digit:i,tickerMotionProps:l,transition:m,updateTransition:e}){const[o,r]=b(0),a=f(t=>{t!==null&&r(t.clientHeight*parseInt(i,10))},[i]);return h("span",{className:"relative h-auto block",ref:a,"aria-hidden":!0,children:[n(s.span,{className:"absolute block bottom-0 h-[1000%]",initial:{x:0,y:o},animate:{x:0,y:o},transition:{...m},onAnimationComplete:e,style:{fontFeatureSettings:"tnum"},children:[9,8,7,6,5,4,3,2,1,0].map(t=>n(s.span,{className:"block text-[inherit] leading-[inherit] tabular-nums",...l,children:t},t))}),n(s.span,{className:"block text-[inherit] leading-[inherit] invisible","aria-hidden":!0,children:"0"})]})}const y=p($);function R({delta:i,digits:l,isNegative:m,tickerMotionProps:e,...o}){const r=x(),a=g(()=>typeof e=="function"?e({delta:i}):e,[i,e]),t=N({...o});return h(d,{children:[m&&n(s.span,{className:"block text-[inherit] leading-[inherit] tabular-nums","aria-hidden":!0,...a,children:"-"}),l.map((c,u)=>k.test(c)?n(y,{digit:c,tickerMotionProps:a,...t},`${r}_${u}`):n(s.span,{className:"block text-[inherit] leading-[inherit] tabular-nums","aria-hidden":!0,...a,children:c},`${r}_${u}`))]})}export{R as DigitResolver,R as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsxs as c,jsx as d}from"react/jsx-runtime";import{
|
|
1
|
+
"use client";import{jsxs as c,jsx as d}from"react/jsx-runtime";import{m as x}from"framer-motion";import{cn as N}from"../../utils/cn.js";import h from"./hooks/useNumberDelta.js";import w from"./hooks/useNumberTicker.js";import{DigitResolver as b}from"./DigitResolver.js";import"react";import"./hooks/useColumnTransition.js";function T({value:t,asLocal:r,localeConfig:o,precision:i,slots:e,skipFirstAnimation:m,transition:n,tickerMotionProps:a,className:s,...u}){const{digits:f,isNegative:l}=w({value:t,asLocal:r,localeConfig:o,precision:i}),p=h(t);return c(x.span,{className:N("flex h-auto flex-row flex-nowrap overflow-hidden relative text-[inherit]",s),"aria-valuenow":t,layout:!0,layoutRoot:!0,...u,children:[e?.startContent,d(b,{isNegative:l,digits:f,tickerMotionProps:a,skipFirstAnimation:m,transition:n,delta:p}),e?.endContent]})}export{T as NumberTicker,T as default};
|
|
@@ -1,3 +1,28 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Native pagination (CTAP-1383) — previously a styled wrapper around
|
|
3
|
+
* @heroui/pagination, the last @heroui consumer in this library. Standard
|
|
4
|
+
* boundary/sibling windowing with ellipses; heroui prop names kept for the
|
|
5
|
+
* call sites this repo uses (total, page/initialPage, onChange, boundaries,
|
|
6
|
+
* siblings, showControls, className, classNames).
|
|
7
|
+
*/
|
|
8
|
+
export type PaginationProps = {
|
|
9
|
+
total: number;
|
|
10
|
+
page?: number;
|
|
11
|
+
initialPage?: number;
|
|
12
|
+
onChange?: (page: number) => void;
|
|
13
|
+
boundaries?: number;
|
|
14
|
+
siblings?: number;
|
|
15
|
+
showControls?: boolean;
|
|
16
|
+
isCompact?: boolean;
|
|
17
|
+
isDisabled?: boolean;
|
|
18
|
+
className?: string;
|
|
19
|
+
classNames?: {
|
|
20
|
+
wrapper?: string;
|
|
21
|
+
item?: string;
|
|
22
|
+
prev?: string;
|
|
23
|
+
next?: string;
|
|
24
|
+
ellipsis?: string;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
export declare function Pagination({ total, page, initialPage, onChange, boundaries, siblings, showControls, isCompact, isDisabled, className, classNames, }: PaginationProps): import("react/jsx-runtime").JSX.Element;
|
|
3
28
|
export default Pagination;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as
|
|
1
|
+
"use client";import{jsx as a,jsxs as N}from"react/jsx-runtime";import{useState as j}from"react";import{cn as l}from"../../utils/cn.js";import{DownArrow as v}from"../Icon/DownArrow.js";const g=l("w-8 h-8 flex justify-center items-center cursor-pointer shadow-none","border border-solid border-border-subtle data-[disabled=true]:border-0","rounded transition-colors duration-300 focus-visible:outline-white focus-visible:outline-offset-4","bg-transparent hover:bg-slate-50 data-[disabled=true]:bg-surface-subtle data-[disabled=true]:text-fg-subtle","[&>svg]:w-4.5 [&>svg]:h-auto");function M(e,h,t,d){const s=(b,n)=>Array.from({length:n-b+1},(m,o)=>b+o);if(e<=t*2+d*2+3)return s(1,e);const f=Math.max(h-d,t+2),c=Math.min(h+d,e-t-1);return[...s(1,t),f>t+2?"ellipsis":t+1,...s(f,c),c<e-t-1?"ellipsis":e-t,...s(e-t+1,e)]}function $({total:e,page:h,initialPage:t=1,onChange:d,boundaries:s=1,siblings:f=1,showControls:c=!0,isCompact:b=!1,isDisabled:n,className:m,classNames:o}){const[w,x]=j(t),r=h??w,p=i=>{const u=Math.min(Math.max(i,1),e);u!==r&&(x(u),d?.(u))};return a("nav",{"aria-label":"Pagination",className:l("text-slate-600",m),children:N("ul",{className:l("flex flex-nowrap gap-2 lg:gap-3 list-none p-0 m-0",o?.wrapper),children:[c&&a("li",{children:a("button",{type:"button","aria-label":"Previous page",disabled:n||r<=1,"data-disabled":n||r<=1||void 0,onClick:()=>p(r-1),className:l(g,o?.prev),children:a(v,{className:"rotate-90 w-4 h-4"})})}),M(e,r,s,f).map((i,u)=>i==="ellipsis"?a("li",{"aria-hidden":"true",className:l("w-4 h-4.5 scale-110 translate-y-1",o?.ellipsis),children:"…"},`e-${u}`):a("li",{children:a("button",{type:"button","aria-label":`Page ${i}`,"aria-current":i===r?"page":void 0,disabled:n,"data-active":i===r||void 0,onClick:()=>p(i),className:l(b?"w-6 h-6 text-xs":"w-8 h-8 text-sm","flex justify-center items-center cursor-pointer rounded shadow-none","border-solid border border-slate-100 bg-transparent transition-colors duration-300","data-[active=true]:bg-slate-500 data-[active=true]:text-white focus-visible:outline-white focus-visible:outline-offset-4","hover:not-data-[active=true]:border-border-subtle",o?.item),children:i})},i)),c&&a("li",{children:a("button",{type:"button","aria-label":"Next page",disabled:n||r>=e,"data-disabled":n||r>=e||void 0,onClick:()=>p(r+1),className:l(g,o?.next),children:a(v,{className:"-rotate-90 w-4 h-4"})})})]})})}export{$ as Pagination,$ as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{Pagination as
|
|
1
|
+
import{Pagination as a}from"./Pagination.js";import"react/jsx-runtime";import"react";import"../../utils/cn.js";import"../Icon/DownArrow.js";export{a as Pagination};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as i,Fragment as m}from"react/jsx-runtime";import{ProgressBar as u,Label as h}from"react-aria-components";import{
|
|
1
|
+
"use client";import{jsx as t,jsxs as i,Fragment as m}from"react/jsx-runtime";import{ProgressBar as u,Label as h}from"react-aria-components";import{m as p}from"framer-motion";import{cn as r}from"../../utils/cn.js";function g({label:a,isIndeterminate:n,showValue:l=!0,width:d,className:s,classNames:e,...c}){return t(u,{style:{width:d||"100%"},className:r("overflow-hidden",s),...c,children:({percentage:o,valueText:f})=>i(m,{children:[i("div",{className:r("flex items-center justify-between gap-2 mb-1",e?.labelWrapper),children:[t(h,{className:r("text-sm",e?.label),children:a}),l&&t("span",{className:r("text-sm",e?.value),children:f})]}),t("div",{className:r("overflow-hidden forced-color-adjust-none h-2.5 rounded will-change-transform bg-slate-300",e?.trackWrapper),children:t(p.div,{style:{width:!n&&typeof o=="number"?`${o}%`:""},...n&&{animate:{x:["-100%","250px"]},transition:{repeat:1/0,duration:1.5}},className:r("h-full bg-surface-inverse-hover rounded transition-width duration-500 ease-in-out",{"w-1/2":n,"transition-none":n},e?.track)})})]})})}export{g as LinearProgressbar,g as default};
|
package/components/Tabs/Tab.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as d,jsxs as u,Fragment as c}from"react/jsx-runtime";import{useContext as b}from"react";import{Tab as f}from"react-aria-components";import{
|
|
1
|
+
"use client";import{jsx as d,jsxs as u,Fragment as c}from"react/jsx-runtime";import{useContext as b}from"react";import{Tab as f}from"react-aria-components";import{m}from"framer-motion";import{cn as i}from"../../utils/cn.js";import{TabsOrientationContext as p}from"./Tabs.context.js";function x({orientation:o,variant:e="base",className:l,children:t,...r}){return d(f,{className:i("flex items-center relative z-10","text-sm cursor-pointer forced-color-adjust-none","transition-all duration-300 ease-in-out","justify-center","disabled:opacity-50","selected:outline-0 hover:outline-0 hover:text-fg-muted",e==="underline"&&o==="vertical"&&"justify-start","py-2 px-3",e==="underline"&&o==="horizontal"&&"p-3",e==="underline"&&o==="vertical"&&"py-3 pr-3 pl-0",(e==="underline"||e==="outline"||e==="enclosed")&&"text-slate-800",e==="solid"&&"text-fg-subtle",(e==="underline"||e==="outline")&&"selected:text-slate-800",(e==="solid"||e==="enclosed")&&"selected:text-slate-100",l),...r,children:t})}function w({variant:o="base",children:e,className:l,classNames:t,...r}){const s=b(p);return d(x,{orientation:s,variant:o,className:l,...r,children:n=>u(c,{children:[typeof e=="function"?e({defaultChildren:void 0,...n}):e,(n.isFocusVisible||n.isSelected)&&d(m.span,{className:i("absolute z-0",o==="solid"&&"inset-0 rounded-lg bg-slate-600 mix-blend-color",o==="outline"&&"inset-0 rounded-lg border-solid border-2 border-surface-inverse-hover",o==="underline"&&"rounded-lg bg-surface-inverse-hover mix-blend-color bottom-0",o==="underline"&&s==="horizontal"&&"left-0 w-full h-px",o==="underline"&&s==="vertical"&&"right-0 w-px h-full",o==="enclosed"&&"inset-0 border-solid border-1 border-surface-inverse-hover -mb-px border-b-0 rounded-t-lg rounded-b-none bg-white mix-blend-difference",o==="base"&&"hidden",t?.overflow),layoutId:o,transition:{type:"spring",bounce:.2,duration:.75}})]})})}export{x as BaseTab,w as Tab,w as default};
|
|
@@ -1,2 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
import { TooltipProps } from './Tooltip.types';
|
|
2
|
+
/**
|
|
3
|
+
* Native tooltip on react-aria-components (CTAP-1383) — previously a styled
|
|
4
|
+
* wrapper around @heroui/tooltip, which pulled the @heroui system into any
|
|
5
|
+
* chunk that used it. RAC is already this library's base. Same call-site API:
|
|
6
|
+
* `<Tooltip content={...} offset={12}>{trigger}</Tooltip>` with an arbitrary
|
|
7
|
+
* trigger node (Focusable makes non-interactive children hoverable/focusable).
|
|
8
|
+
*/
|
|
9
|
+
export declare function Tooltip({ children, content, placement, offset, showArrow, isDisabled, delay, classNames, }: TooltipProps): import("react/jsx-runtime").JSX.Element;
|
|
2
10
|
export default Tooltip;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as
|
|
1
|
+
"use client";import{jsxs as l,jsx as e}from"react/jsx-runtime";import{TooltipTrigger as d,Focusable as f,Tooltip as m,OverlayArrow as b}from"react-aria-components";import{cn as t}from"../../utils/cn.js";function v({children:i,content:n,placement:s="top",offset:r=8,showArrow:a=!1,isDisabled:u,delay:c=500,classNames:o}){return l(d,{delay:c,isDisabled:u,children:[e(f,{children:e("span",{role:"button",tabIndex:0,className:"inline-flex outline-none",children:i})}),l(m,{placement:s,offset:r,className:t("z-50 outline-none","focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-slate-500",o?.base),children:[a&&e(b,{children:e("span",{className:"block rotate-45 w-2.5 h-2.5 -translate-y-1/2 rounded-sm bg-slate-500 shadow-sm"})}),e("div",{className:t("inline-flex flex-col items-center justify-center outline-none","w-full py-1 px-2.5 box-border bg-slate-500 rounded-md shadow-sm","text-sm text-white subpixel-antialiased",o?.content),children:n})]})]})}export{v as Tooltip,v as default};
|
|
@@ -1,2 +1,21 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Structural props (CTAP-1383) — previously re-exported from @heroui/tooltip.
|
|
4
|
+
* Covers the surface this repo uses; heroui prop names kept.
|
|
5
|
+
*/
|
|
6
|
+
export type TooltipProps = {
|
|
7
|
+
children: ReactNode;
|
|
8
|
+
/** Tooltip body. */
|
|
9
|
+
content?: ReactNode;
|
|
10
|
+
placement?: 'top' | 'bottom' | 'left' | 'right' | 'top start' | 'top end' | 'bottom start' | 'bottom end';
|
|
11
|
+
/** Distance from the trigger, px. */
|
|
12
|
+
offset?: number;
|
|
13
|
+
showArrow?: boolean;
|
|
14
|
+
isDisabled?: boolean;
|
|
15
|
+
/** ms before showing (heroui: delay). */
|
|
16
|
+
delay?: number;
|
|
17
|
+
classNames?: {
|
|
18
|
+
base?: string;
|
|
19
|
+
content?: string;
|
|
20
|
+
};
|
|
21
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{Tooltip as
|
|
1
|
+
import{Tooltip as m}from"./Tooltip.js";import"react/jsx-runtime";import"react-aria-components";import"../../utils/cn.js";export{m as Tooltip};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsxs as l,Fragment as u,jsx as e}from"react/jsx-runtime";import{forwardRef as y,useState as v}from"react";import{
|
|
1
|
+
"use client";import{jsxs as l,Fragment as u,jsx as e}from"react/jsx-runtime";import{forwardRef as y,useState as v}from"react";import{m as j}from"framer-motion";import{FieldError as V}from"react-aria-components";import{cn as r}from"../../utils/cn.js";import _ from"../../hooks/useIsClient.js";import{Skeleton as p}from"../Skeleton/Skeleton.js";function k({hasTitle:a,className:s}){return l("div",{className:"w-full h-full flex flex-col gap-4",children:[a&&e(p,{className:"w-1/2 h-8 mx-auto rounded-md z-20"}),e(p,{className:r("w-full h-56 rounded-md z-20 relative",s)})]})}const H=y(({title:a,description:s="Preview will display here.",fileExtension:m,actionTitle:g="select file",variant:i,errorMessage:h,defaultImagePath:n,classNames:f,...c},b)=>{const x=_(),[t,w]=v({src:null,alt:null}),C=!!h,N=m?m.split(",").map(o=>`image/${o.trim()}`).join(", "):"image/*";return l("div",{className:r("w-full h-full","flex flex-col gap-4"),children:[x?l(u,{children:[a&&e("h6",{className:r("text-center","text-2xl","m-0 mb-4"),children:a}),l("div",{className:r("w-full h-full","flex flex-col justify-between gap-5 items-center",["bg-surface-subtle",i==="base"&&"bg-transparent"],"rounded-md",[i==="base"&&"rounded-none"],["p-6 lg:p-7",i==="base"&&"p-0 lg:p-0"]),children:[l("label",{htmlFor:`${c?.name}-upload-file`,"aria-label":"image upload",onChange:o=>{const{target:{files:d}}=o;d&&w({src:URL.createObjectURL(d[0]),alt:d[0].name})},className:r("inline-flex justify-center items-center","uppercase text-base border-border-subtle","bg-transparent","border-1 border-solid","px-4 py-0","rounded-2xl","cursor-pointer","w-full h-9",["max-w-48",i==="base"&&"max-w-none"],"my-0 mx-auto","has-[:disabled]:bg-transparent has-[:disabled]:text-fg-strong","hover:bg-slate-100s hover:text-black",f?.label),children:[g,e("input",{id:`${c?.name}-upload-file`,accept:N,type:"file",hidden:!0,...c,ref:b,className:"hidden"})]}),n&&!t.src?e("div",{className:"flex justify-center items-center w-60",children:e("a",{href:n,target:"_blank",rel:"noreferrer",children:e("img",{src:n,alt:"",className:"w-full h-auto"})})}):l(u,{children:[e(j.div,{initial:{opacity:0},animate:{opacity:1},transition:{type:"spring",duration:3,bounce:0},className:"flex justify-center items-center w-52 h-auto",children:t.src?e("img",{src:t.src,height:96,width:200,alt:t.alt||"",className:"max-h-full object-contain"}):l("svg",{xmlns:"http://www.w3.org/2000/svg",width:"31",height:"55",viewBox:"0 0 31 55",fill:"none",children:[e("g",{clipPath:"url(#clip0_15607_32844)",children:e("path",{d:"M15.9521 0.721924C24.2431 0.721924 30.9521 7.36392 30.9521 15.5719V43.9219C30.9521 49.8889 26.0703 54.7219 20.0431 54.7219C14.0158 54.7219 9.13397 49.8889 9.13397 43.9219V20.9719C9.13397 17.2459 12.1885 14.2219 15.9521 14.2219C19.7158 14.2219 22.7703 17.2459 22.7703 20.9719V41.2219H17.3158V20.7289C17.3158 19.2439 14.5885 19.2439 14.5885 20.7289V43.9219C14.5885 46.8919 17.0431 49.3219 20.0431 49.3219C23.0431 49.3219 25.4976 46.8919 25.4976 43.9219V15.5719C25.4976 10.3609 21.2158 6.12192 15.9521 6.12192C10.6885 6.12192 6.40669 10.3609 6.40669 15.5719V41.2219H0.952148V15.5719C0.952148 7.36392 7.66124 0.721924 15.9521 0.721924Z",fill:"#646464"})}),e("defs",{children:e("clipPath",{id:"clip0_15607_32844",children:e("rect",{width:"30",height:"54",fill:"white",transform:"translate(0.952148 0.721924)"})})})]})},t.src),e("p",{className:"m-0 text-fg-strong text-center",children:t.alt||s})]})]})]}):e(k,{hasTitle:!!a,className:f?.skeleton}),C&&e(V,{className:r("-mt-2","self-start"),children:h})]})});export{H as UploadImage,H as default};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
# GraphQL Client Executes String Documents — graphql-request Removed
|
|
2
|
+
|
|
3
|
+
**Date:** 2026-08-21
|
|
4
|
+
**Package:** `@clicktap/ui`
|
|
5
|
+
**Affects:** `utils/createAuthAwareGraphqlClient` (public API)
|
|
6
|
+
**Classification:** COMPATIBILITY (breaking)
|
|
7
|
+
**Breaking:** Yes. AST `TypedDocumentNode` documents are no longer accepted; the `GraphQLClient` re-export is gone; `ClientError` is now this module's own class.
|
|
8
|
+
**Ticket:** CTAP-1383
|
|
9
|
+
|
|
10
|
+
## Problem
|
|
11
|
+
|
|
12
|
+
The auth-aware client wrapped `graphql-request`, whose static imports put the whole
|
|
13
|
+
`graphql` package (parser, lexer, printer, AST machinery) plus `cross-fetch` into every
|
|
14
|
+
consumer page's initial JS — ~30 KB gz that existed only to turn an AST back into the
|
|
15
|
+
query text codegen started from.
|
|
16
|
+
|
|
17
|
+
## Changes
|
|
18
|
+
|
|
19
|
+
- `createAuthAwareGraphqlClient()` executes documents as **text**: one JSON POST via
|
|
20
|
+
`fetch`. Same call signatures (`request(url, document, variables?, requestHeaders?)`
|
|
21
|
+
and `.withOptions({ …, signal })`), same partial-response semantics (HTTP 200 with
|
|
22
|
+
`data` + `errors` returns the partial data), same 401/403/5xx events on
|
|
23
|
+
`authAwareEvents`, same dev field-error logging.
|
|
24
|
+
- **Documents must be strings** — codegen `TypedDocumentString`
|
|
25
|
+
(`documentMode: 'string'`) or plain strings. The new `GraphqlDocument<TData,
|
|
26
|
+
TVariables>` type carries result/variable typing structurally, so response-type
|
|
27
|
+
inference at call sites is unchanged.
|
|
28
|
+
- **`ClientError` is now defined here**, shape-compatible with `graphql-request`'s
|
|
29
|
+
(`response.status/data/errors`, `request.query/variables`). `instanceof ClientError`
|
|
30
|
+
against this module's export now always matches — the dual-package hazard the old
|
|
31
|
+
re-export warned about is gone. The identity-agnostic `getRequestErrorStatus` from
|
|
32
|
+
`utils/error` continues to work untouched.
|
|
33
|
+
- **Removed:** the `GraphQLClient` re-export (nothing to re-export), and the
|
|
34
|
+
`graphql-request` dependency (dev + peer).
|
|
35
|
+
|
|
36
|
+
## Migration
|
|
37
|
+
|
|
38
|
+
1. Switch codegen to string documents: `presetConfig`/`config` → `documentMode:
|
|
39
|
+
'string'` (client-preset ≥ 4 for `TypedDocumentString`), regenerate.
|
|
40
|
+
2. Replace `TypedDocumentNode`/`RequestDocument` types at wrapper boundaries with
|
|
41
|
+
`GraphqlDocument` / `GraphqlVariables` from this module; `GraphQLClientRequestHeaders`
|
|
42
|
+
with the platform `HeadersInit`.
|
|
43
|
+
3. Sites that imported `ClientError` from `graphql-request` import it from here.
|
|
44
|
+
4. A call that must send `FormData` or custom cors/credentials keeps using
|
|
45
|
+
`createAuthAwareFetch()` (unchanged) and `String(document)` for the query text.
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
# `graphql` Peer Is Covered — No More Double Bundle
|
|
2
|
+
|
|
3
|
+
**Date:** 2026-08-21
|
|
4
|
+
**Package:** `@clicktap/ui`
|
|
5
|
+
**Affects:** consumers' bundle size (~12 KB gz of duplicated `graphql`)
|
|
6
|
+
**Classification:** BUGFIX (dependency resolution)
|
|
7
|
+
**Breaking:** No. `graphql ^16.6.0` is an optional peer, matching `@clicktap/state`.
|
|
8
|
+
**Ticket:** CTAP-1383
|
|
9
|
+
|
|
10
|
+
## Problem
|
|
11
|
+
|
|
12
|
+
The lib declared `graphql-request` (dev + optional peer) but not `graphql` itself.
|
|
13
|
+
With `auto-install-peers`, pnpm resolved `graphql-request`'s `graphql ^16` peer to the
|
|
14
|
+
**newest** matching version (16.14.0) while the app and `@clicktap/state` pinned 16.12.0.
|
|
15
|
+
Two full copies of the `graphql` package — parser, lexer, printer — shipped in every
|
|
16
|
+
page's initial JS. (The uncovered-peer-is-a-floating-install trap.)
|
|
17
|
+
|
|
18
|
+
## Changes
|
|
19
|
+
|
|
20
|
+
`graphql` is now declared: `16.12.0` in devDependencies, `^16.6.0` as an optional peer
|
|
21
|
+
(mirroring `@clicktap/state`). The whole runtime graph resolves a single `graphql@16.12.0`.
|
|
22
|
+
|
|
23
|
+
## What to check
|
|
24
|
+
|
|
25
|
+
After `pnpm install`, `ls node_modules/.pnpm | grep '^graphql@'` in a consuming app
|
|
26
|
+
should show one runtime version reachable from the frontend graph.
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
# The @heroui Dependency Is Gone — Accordion, Tooltip, Pagination, Badge Are Native
|
|
2
|
+
|
|
3
|
+
**Date:** 2026-08-21
|
|
4
|
+
**Package:** `@clicktap/ui`
|
|
5
|
+
**Ticket:** CTAP-1383 (epic CTAP-1380)
|
|
6
|
+
**Affects:** Accordion, Tooltip, Pagination, Badge. Peer/dev dependencies on `@heroui/*` removed.
|
|
7
|
+
**Classification:** COMPATIBILITY
|
|
8
|
+
**Breaking:** API-compatible for every usage shape in the reference repo (inventoried below). Consumers importing `@heroui`/`@nextui-org` types directly must switch to this package's exports.
|
|
9
|
+
|
|
10
|
+
## Why
|
|
11
|
+
|
|
12
|
+
Four components wrapped `@heroui/*` while supplying ALL of their own visual
|
|
13
|
+
styling — the wrapper bought two DOM elements and a positioning engine, and
|
|
14
|
+
cost the whole @heroui system + theme (~25 KiB gz) in the initial JS of every
|
|
15
|
+
page, anchored by the PLP filter sidebar's Accordion. This library's actual
|
|
16
|
+
base is react-aria-components; the rewrites cost nothing new:
|
|
17
|
+
|
|
18
|
+
- **Accordion** → RAC `DisclosureGroup`/`Disclosure`. Height animates with
|
|
19
|
+
the CSS grid-rows trick (no animation runtime).
|
|
20
|
+
- **Tooltip** → RAC `TooltipTrigger`/`Tooltip`/`OverlayArrow` (`Focusable`
|
|
21
|
+
makes arbitrary trigger nodes hoverable).
|
|
22
|
+
- **Pagination** → native boundary/sibling windowing.
|
|
23
|
+
- **Badge** → the two wrapper elements, inline.
|
|
24
|
+
|
|
25
|
+
## Preserved API surface (inventoried from real call sites)
|
|
26
|
+
|
|
27
|
+
- Accordion: `selectionMode`, `defaultSelectedKeys` (incl. `"all"`),
|
|
28
|
+
`defaultExpandedKeys`, controlled `selectedKeys` + `onSelectionChange`,
|
|
29
|
+
`disallowEmptySelection`, `hideIndicator` (group and per-item),
|
|
30
|
+
`showDivider`/`dividerProps` (an `<hr>` between items — `[&_hr]:hidden`
|
|
31
|
+
keeps working), `itemClasses`/per-item `classNames` slots, per-item
|
|
32
|
+
`title`/`subtitle`/`startContent`/`indicator` (a component still receives
|
|
33
|
+
`{ isOpen }` — import `AccordionItemIndicatorProps` from HERE now),
|
|
34
|
+
`disableIndicatorAnimation`, `onPress`, and the `data-open` attribute on
|
|
35
|
+
heading/trigger/indicator that `data-[open=true]:` selectors style.
|
|
36
|
+
- Tooltip: `content`, `offset`, `placement`, `showArrow`, `delay`,
|
|
37
|
+
`isDisabled`, `classNames.base/content`, arbitrary child as trigger.
|
|
38
|
+
- Pagination: `total`, `page`/`initialPage`, `onChange`, `boundaries`,
|
|
39
|
+
`siblings`, `showControls`, `isCompact`, `classNames` slots incl.
|
|
40
|
+
`data-[active=true]`/`data-[disabled=true]` styling hooks.
|
|
41
|
+
- Badge: unchanged names (`content`, `isInvisible`, `placement`, `shape`,
|
|
42
|
+
`size`, `variant`, `showOutline`, `isDot`, `classNames`).
|
|
43
|
+
|
|
44
|
+
## What you need to do
|
|
45
|
+
|
|
46
|
+
- Remove `@heroui/*` and `@nextui-org/*` from your app's dependencies if they
|
|
47
|
+
existed only for these components or their types; import the types from
|
|
48
|
+
this package instead (`AccordionItemIndicatorProps` moved here).
|
|
49
|
+
- If you used heroui props OUTSIDE the surface above, check the component
|
|
50
|
+
source — the compat layer is deliberate, not exhaustive.
|
|
51
|
+
- Verified on the reference storefront: PLP filter accordion (expand/
|
|
52
|
+
collapse/apply, all-open default, indicator rotation), checkout accordions
|
|
53
|
+
(controlled single-selection payment list, promo/gift-card items), cart
|
|
54
|
+
badge, dividers, `data-open` styling. ~54 KiB gz off the initial bundle.
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
# Animated Components Render `m.*` — Apps Must Provide LazyMotion Features
|
|
2
|
+
|
|
3
|
+
**Date:** 2026-08-21
|
|
4
|
+
**Package:** `@clicktap/ui`
|
|
5
|
+
**Ticket:** CTAP-1383 (epic CTAP-1380)
|
|
6
|
+
**Affects:** every animated component (ModalOverlay, Drawer, Dialog, Menu, ContextMenu, Tabs, Badge, Collapsible, NumberTicker, Meter, Progressbar, UploadImage).
|
|
7
|
+
**Classification:** COMPATIBILITY
|
|
8
|
+
**Breaking:** Animations no-op (components still render and function) until the consuming app mounts a `LazyMotion` provider.
|
|
9
|
+
|
|
10
|
+
## What changed
|
|
11
|
+
|
|
12
|
+
Every framer-motion element in this library is now `m.*` instead of
|
|
13
|
+
`motion.*`. Under framer's LazyMotion pattern, `m` components carry no
|
|
14
|
+
animation runtime of their own — the feature set loads from a provider the
|
|
15
|
+
APP mounts, as an async chunk.
|
|
16
|
+
|
|
17
|
+
Why: `motion.*` imports statically bundle the full framer runtime (~38 KiB
|
|
18
|
+
gz). Because overlay primitives (ModalOverlay, Drawer, Badge) sit in every
|
|
19
|
+
storefront's layout, that runtime shipped in the initial JS of every page.
|
|
20
|
+
With `m.*`, the initial bundle carries only framer's slim core and the
|
|
21
|
+
features arrive async — measured ~0.2-0.5s of simulated-mobile LCP on the
|
|
22
|
+
reference storefront.
|
|
23
|
+
|
|
24
|
+
## What you need to do
|
|
25
|
+
|
|
26
|
+
Mount a `LazyMotion` provider above everything that renders these components
|
|
27
|
+
(both root layouts in the reference app):
|
|
28
|
+
|
|
29
|
+
```tsx
|
|
30
|
+
'use client';
|
|
31
|
+
import { LazyMotion } from 'framer-motion';
|
|
32
|
+
|
|
33
|
+
const loadFeatures = () => import('./motionFeatures').then((m) => m.default);
|
|
34
|
+
// motionFeatures.ts: import { domMax } from 'framer-motion'; export default domMax;
|
|
35
|
+
|
|
36
|
+
export function MotionProvider({ children }) {
|
|
37
|
+
return <LazyMotion features={loadFeatures}>{children}</LazyMotion>;
|
|
38
|
+
}
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
Two load-bearing details:
|
|
42
|
+
|
|
43
|
+
- the features import lives in its OWN file — inlining `domMax` into the
|
|
44
|
+
provider keeps it in the provider's (initial) chunk, defeating the point;
|
|
45
|
+
- use `domMax` if anything in your tree uses layout animations
|
|
46
|
+
(`layout`/`layoutId` props); `domAnimation` otherwise.
|
|
47
|
+
|
|
48
|
+
Without a provider nothing errors: components mount, function, and simply
|
|
49
|
+
appear without transitions. If your drawers/dialogs "stopped animating"
|
|
50
|
+
after this release, the missing provider is why.
|
|
51
|
+
|
|
52
|
+
Do not use `strict` on the provider if any code in the tree still renders
|
|
53
|
+
full `motion.*` — full-motion elements are self-contained and coexist fine
|
|
54
|
+
without strict.
|