@liberfi.io/ui-scaffold 0.1.8 → 0.1.10

package/dist/index.mjs

@@ -1,2 +1,2 @@
-import {memo,useState,useRef,useMemo,useEffect,useCallback}from'react';import {createPortal}from'react-dom';import {useValueRef,useCallbackRef,useEventEmitter}from'@liberfi.io/hooks';import {useTranslation}from'@liberfi.io/i18n';import {atomFamily,atomWithStorage,useAtom,useAtomValue,clsx,StyledTooltip,DraggableIcon,Button,RestoreWindowIcon,MinimizeIcon,UnMaximizeIcon,MaximizeIcon,XCloseIcon,useSetAtom,getDefaultStore,Link,StyledButton,ChevronLeftIcon,ChevronRightIcon,useDisclosure}from'@liberfi.io/ui';import {throttle}from'@liberfi.io/utils';import {jsxs,Fragment,jsx}from'react/jsx-runtime';var se=atomFamily(e=>atomWithStorage(`panelState.${e??"default"}`,"none",void 0,{getOnInit:true})),Fe=atomFamily(e=>atomWithStorage(`panelWidth.${e??"default"}`,350,void 0,{getOnInit:true})),He=atomFamily(e=>atomWithStorage(`panelMinWidth.${e??"default"}`,320,void 0,{getOnInit:true})),ke=atomFamily(e=>atomWithStorage(`panelMaxWidth.${e??"default"}`,440,void 0,{getOnInit:true})),yt=atomFamily(e=>atomWithStorage(`modalOpen.${e??"default"}`,false,void 0,{getOnInit:true})),Te=atomFamily(e=>atomWithStorage(`modalShouldStartDragging.${e??"default"}`,false,void 0,{getOnInit:true})),_e=atomFamily(e=>atomWithStorage(`modalSize.${e??"default"}`,{width:350,height:580},void 0,{getOnInit:true})),$e=atomFamily(e=>atomWithStorage(`modalRestoreSize.${e??"default"}`,{width:350,height:580},void 0,{getOnInit:true})),Xe=atomFamily(e=>atomWithStorage(`modalPosition.${e??"default"}`,{x:typeof window<"u"?Math.max(0,(window.innerWidth-350)/2):0,y:typeof window<"u"?Math.max(0,(window.innerHeight-580)/2):0},void 0,{getOnInit:true})),Be=atomFamily(e=>atomWithStorage(`modalRestorePosition.${e??"default"}`,{x:typeof window<"u"?Math.max(0,(window.innerWidth-350)/2):0,y:typeof window<"u"?Math.max(0,(window.innerHeight-580)/2):0},void 0,{getOnInit:true})),Ue=atomFamily(e=>atomWithStorage(`modalMinimized.${e??"default"}`,false,void 0,{getOnInit:true})),Ye=atomFamily(e=>atomWithStorage(`modalMinWidth.${e??"default"}`,200,void 0,{getOnInit:true})),Ve=atomFamily(e=>atomWithStorage(`modalMaxWidth.${e??"default"}`,typeof window<"u"?window.innerWidth-40:0,void 0,{getOnInit:true})),fe=atomFamily(e=>atomWithStorage(`lastPanelType.${e??"default"}`,"modal",void 0,{getOnInit:true})),je=atomWithStorage("panelOrders",{left:{},right:{}},void 0,{getOnInit:true});function pe(e){let[t,n]=useAtom(yt(e)),[l,i]=useAtom(Ue(e)),f=useAtomValue($e(e)),m=useAtomValue(Be(e)),o=useSetAtom(_e(e)),r=useSetAtom(Xe(e)),a=useSetAtom(Te(e)),d=useSetAtom(fe(e)),c=useCallback((z={})=>{let{shouldStartDragging:K,position:Q,size:de}=z;Q&&r(_=>({..._,...Q})),de&&o(_=>({..._,...de})),a(K??false),n(true),d("modal");},[n,r,o,a]),b=useCallback(()=>{n(false),l&&(o({...f}),r({...m}),i(false));},[l,f,m,i,n,o,r]);return useMemo(()=>({isOpen:t,onOpen:c,onClose:b}),[t,c,b])}function ge(e){let[t,n]=useAtom(se(e)),l=useSetAtom(Fe(e)),i=useSetAtom(fe(e)),f=useSetAtom(je),m=useCallback((d={})=>{let c=d.position??"left";l(d.width??320),n(c),i(c),f(({left:b,right:z})=>c==="left"?{left:{...b,[e]:Date.now()},right:z}:{left:b,right:{...z,[e]:Date.now()}});},[e,n,l]),o=useCallback(()=>{n("none");},[n]),r=useMemo(()=>t!=="none",[t]),a=useMemo(()=>t!=="none"?t:void 0,[t]);return useMemo(()=>({isOpen:r,position:a,onOpen:m,onClose:o}),[r,m,o])}var xo={width:200,height:48},Ie={width:typeof window<"u"?window.innerWidth-40:0,height:typeof window<"u"?window.innerHeight-40:0},yo={x:20,y:20},Dt=memo(function({id:t,title:n,minWidth:l=504,maxWidth:i=Ie.width,minHeight:f=200,maxHeight:m=Ie.height,leftSidebar:o,leftSidebarWidth:r=200,rightSidebar:a,rightSidebarWidth:d=200,aspectRatio:c,showHeader:b=true,header:z,headerHeight:K=44,children:Q}){let{t:de}=useTranslation(),{isOpen:_,onClose:Ce}=pe(t),{onOpen:Ke}=ge(t),[F,$]=useAtom(Ue(t)),[p,Qe]=useAtom(Xe(t)),[g,et]=useAtom(_e(t)),[ce,ue]=useAtom($e(t)),[ee,te]=useAtom(Be(t)),[Re,Pe]=useAtom(Te(t)),[S,oe]=useState(Re),[ze,x]=useState(false),[N,j]=useState(null),[ne,Z]=useState(null),[re,E]=useState(null),[me,J]=useState(null),X=useRef(null),Xt=useAtomValue(He(t)),Bt=useAtomValue(ke(t)),B=useValueRef(p),w=useCallbackRef(Qe),ie=useValueRef(g),I=useCallbackRef(et),Ut=useValueRef(r),Yt=useValueRef(!!o),Vt=useValueRef(d),jt=useValueRef(!!a),k=useValueRef(c),U=useValueRef(K),De=useValueRef(l),Oe=useValueRef(i),We=useValueRef(f),Se=useValueRef(m),Zt=useValueRef(S),ut=useValueRef(ne),tt=useValueRef(me),Jt=useCallbackRef(Ce),qt=useCallbackRef(Ke),Gt=useValueRef(Xt),Kt=useValueRef(Bt),Ne=useMemo(()=>g.width===Ie.width&&g.height===Ie.height,[g.width,g.height]);useEffect(()=>{(p.x<0||p.y<0)&&w({x:Math.max(0,p.x),y:Math.max(0,p.y)});let s=p.x+g.width,C=p.y+g.height;(s>window.innerWidth||C>window.innerHeight)&&w({x:Math.min(p.x,Math.max(0,window.innerWidth-g.width)),y:Math.min(p.y,Math.max(0,window.innerHeight-g.height))});},[t]),useEffect(()=>{if(_&&Re){oe(true);let s=q=>{w({x:q.clientX-g.width/2,y:q.clientY-20});},C=()=>{oe(false),Pe(false),document.removeEventListener("mousemove",s),document.removeEventListener("mouseup",C);};return document.addEventListener("mousemove",s),document.addEventListener("mouseup",C),document.body.style.cursor="grabbing",()=>{document.removeEventListener("mousemove",s),document.removeEventListener("mouseup",C),document.body.style.cursor="";}}},[_,Re,Pe,g.width]);let T=(s,C,q)=>{Pe(false),oe(false),x(false),j(null),C==="drag"?oe(true):C==="resize"&&(j(q||null),x(true));let mt=s.clientX,ht=s.clientY,L=ie.current.width,H=ie.current.height,A={...B.current},ft=()=>{document.removeEventListener("mousemove",pt),document.removeEventListener("mouseup",gt),document.body.style.cursor="",oe(false),x(false),j(null),Z(null),X.current&&(clearTimeout(X.current),X.current=null),J(null),E(null);},pt=Le=>{if(C==="drag"){let Y=Le.clientX-mt,V=Le.clientY-ht,v=A.x+Y,h=A.y+V,he=Yt.current?Ut.current:0,Ee=12+he,D=jt.current?Vt.current:0,M=window.innerWidth-12-L-D,Ae=window.innerHeight-12-44,R=v<=Ee?"left":v>=M?"right":null;R!==ut.current&&Z(R),X.current&&R&&E(R),X.current&&(tt.current==="left"&&(v>Ee||R!=="left")||tt.current==="right"&&(v<M||R!=="right"))&&(clearTimeout(X.current),X.current=null,J(null),E(null)),!X.current&&R&&tt.current!==R&&(J(R),E(R),X.current=setTimeout(()=>{Zt.current&&ut.current===R?(ft(),Jt(),qt({position:R,width:Math.min(Math.max(ie.current.width,Gt.current),Kt.current)})):J(null);},350)),v=Math.min(Math.max(v,12+he),M),h=Math.min(Math.max(h,12),Ae),w({x:v,y:h});}else if(C==="resize"&&q){let Y=Le.clientX-mt,V=Le.clientY-ht,v=(h,he,Ee)=>{let D=Math.min(Math.max(h,De.current),Oe.current),M=Math.min(Math.max(he,We.current),Se.current);if(k.current){if(Ee==="width")M=Math.min(Math.max(h/k.current+U.current,We.current),Se.current),D=(M-U.current)*k.current;else if(Ee==="height")D=Math.min(Math.max((he-U.current)*k.current,De.current),Oe.current),M=D/k.current+U.current;else {let Ae=h/k.current+U.current,R=(he-U.current)*k.current,bt=Math.abs(Y),xt=Math.abs(V);if(bt>1.1*xt)M=Math.min(Math.max(Ae,We.current),Se.current),D=(M-U.current)*k.current;else if(xt>1.1*bt)D=Math.min(Math.max(R,De.current),Oe.current),M=D/k.current+U.current;else {let to=(M+Ae)/2;D=Math.min(Math.max((D+R)/2,De.current),Oe.current),M=Math.min(Math.max(to,We.current),Se.current),D=(M-U.current)*k.current;}}D=Math.min(Math.max(D,De.current),Oe.current),M=Math.min(Math.max(M,We.current),Se.current);}return {width:D,height:M}};switch(q){case "topLeft":{let h=v(L-Y,H-V,"both");I(h),w({x:A.x+(L-h.width),y:A.y+(H-h.height)});break}case "topRight":{let h=v(L+Y,H-V,"both");I(h),w({x:A.x,y:A.y+(H-h.height)});break}case "bottomLeft":{let h=v(L-Y,H+V,"both");I(h),w({x:A.x+(L-h.width),y:A.y});break}case "bottomRight":{I(v(L+Y,H+V,"both"));break}case "top":{let h=v(L,H-V,"height");I(h),w({x:A.x,y:A.y+(H-h.height)});break}case "bottom":{I(v(L,H+V,"height"));break}case "left":{let h=v(L-Y,H,"width");I(h),w({x:A.x+(L-h.width),y:A.y});break}case "right":{I(v(L+Y,H,"width"));break}}}},gt=()=>{(p.x<0||p.y<0)&&w({x:Math.max(0,p.x),y:Math.max(0,p.y)}),ft();};document.addEventListener("mousemove",pt),document.addEventListener("mouseup",gt);},Qt=useCallback(()=>{F?(I({...ce}),w({...ee}),$(false)):(Ne?w({...ee}):(ue({...g}),te({...p})),I({...xo}),$(true));},[F,Ne,g,p,ce,ee,$,ue,te]),eo=useCallback(()=>{Ne?(I({...ce}),w({...ee})):(F?$(false):(ue({...g}),te({...p})),I({...Ie}),w({...yo}));},[Ne,F,g,p,ce,ee,$,ue,te]);return useEffect(()=>{let s=throttle(()=>{(B.current.x<0||B.current.y<0)&&w({x:Math.max(0,B.current.x),y:Math.max(0,B.current.y)});let C=B.current.x+ie.current.width,q=B.current.y+ie.current.height;(C>window.innerWidth||q>window.innerHeight)&&w({x:Math.min(B.current.x,Math.max(0,window.innerWidth-ie.current.width)),y:Math.min(B.current.y,Math.max(0,window.innerHeight-ie.current.height))});},100);return window.addEventListener("resize",s),()=>{window.removeEventListener("resize",s);}},[]),_?jsxs(Fragment,{children:[(S||ze)&&createPortal(jsx("div",{className:clsx("max-sm:hidden fixed inset-0 z-9999 bg-transparent w-full h-full select-none",S&&(me?"cursor-grabbing":"cursor-move"),!S&&{"cursor-ns-resize":N==="top"||N==="bottom","cursor-ew-resize":N==="left"||N==="right","cursor-nwse-resize":N==="topLeft"||N==="bottomRight","cursor-nesw-resize":N==="topRight"||N==="bottomLeft","cursor-auto":N===null})}),document.body),jsx("div",{className:clsx("max-sm:hidden fixed z-50 left-0 top-0",S?"will-change-transform":"will-change-auto",ze||S?"transition-none":"transition-transform duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]"),style:{transform:`translate(${Math.round(p.x-(o?r:0))}px, ${Math.round(p.y)}px)`},children:jsxs("div",{className:"flex relative z-50",children:[o&&jsx("div",{className:clsx("relative mt-1 z-10 transition-all duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]",S?"opacity-40 translate-x-4":"opacity-100 translate-x-0"),style:{width:r,height:F?40:g.height-8},children:o}),jsx("div",{className:clsx("z-50 relative bg-content1 border border-border rounded-lg overflow-hidden",S?"opacity-80 shadow-md scale-102 blur-[0.5px]":"opacity-100 shadow-lg scale-100 blur-none"),style:{width:g.width,height:g.height,transition:ze||S?"none":"transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s cubic-bezier(0.33, 1, 0.68, 1), height 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.33, 1, 0.68, 1)",contain:"content"},children:jsxs("div",{className:clsx("w-full h-full",re&&"animate-modal-shrink",re==="left"?"origin-left":"origin-right"),style:{contain:"paint"},children:[!F&&jsxs(Fragment,{children:[jsx("div",{className:"absolute top-0 left-0 w-3 h-3 cursor-nw-resize z-20",onMouseDown:s=>T(s,"resize","topLeft")}),jsx("div",{className:"absolute top-0 right-0 w-3 h-3 cursor-ne-resize z-20",onMouseDown:s=>T(s,"resize","topRight")}),jsx("div",{className:"absolute bottom-0 left-0 w-3 h-3 cursor-sw-resize z-20",onMouseDown:s=>T(s,"resize","bottomLeft")}),jsx("div",{className:"absolute bottom-0 right-0 w-3 h-3 cursor-se-resize z-20",onMouseDown:s=>T(s,"resize","bottomRight")}),jsx("div",{className:"absolute top-0 left-3 right-3 h-1.5 cursor-n-resize z-20",onMouseDown:s=>T(s,"resize","top")}),jsx("div",{className:"absolute bottom-0 left-3 right-3 h-1.5 cursor-s-resize z-20",onMouseDown:s=>T(s,"resize","bottom")}),jsx("div",{className:"absolute left-0 top-3 bottom-3 w-1.5 cursor-w-resize z-20",onMouseDown:s=>T(s,"resize","left")}),jsx("div",{className:"absolute right-0 top-3 bottom-3 w-1.5 cursor-e-resize z-20",onMouseDown:s=>T(s,"resize","right")})]}),b&&jsxs("div",{className:"relative border-b border-border/80 px-3 gap-4 flex items-center justify-between cursor-move select-none",onMouseDown:s=>T(s,"drag"),style:{height:K},children:[jsx(StyledTooltip,{placement:"top",closeDelay:0,content:de("scaffold.draggableModal.snapToEdge"),children:jsx(DraggableIcon,{className:"text-neutral absolute left-1/2 -translate-x-1/2 top-0"})}),z||jsxs(Fragment,{children:[jsx("div",{className:"min-w-0 flex-initial text-sm font-medium truncate cursor-auto",onMouseDown:s=>s.stopPropagation(),children:n}),jsxs("div",{className:"flex-none flex items-center justify-end gap-1",onMouseDown:s=>s.stopPropagation(),children:[jsx(Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:Qt,children:F?jsx(RestoreWindowIcon,{width:18,height:18,className:"text-neutral"}):jsx(MinimizeIcon,{width:18,height:18,className:"text-neutral"})}),jsx(Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:eo,children:Ne?jsx(UnMaximizeIcon,{width:18,height:18,className:"text-neutral"}):jsx(MaximizeIcon,{width:18,height:18,className:"text-neutral"})}),jsx(Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:Ce,children:jsx(XCloseIcon,{width:18,height:18,className:"text-neutral"})})]})]})]}),!F&&jsx("div",{className:b?"h-[calc(100%-44px)] overflow-x-hidden overflow-y-auto":"h-full overflow-x-hidden overflow-y-auto cursor-move",onMouseDown:b?void 0:s=>T(s,"drag"),children:Q})]})}),a&&jsx("div",{className:clsx("relative mt-1 z-10 transition-all duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]",S?"opacity-40 -translate-x-4":"opacity-100 translate-x-0"),style:{width:d,height:F?40:g.height-8},children:a})]})})]}):null});function dt({id:e,title:t,maxWidth:n=440,minWidth:l=320,position:i,showHeader:f=true,header:m,headerHeight:o=44,children:r}){let{t:a}=useTranslation(),d=useAtomValue(se(e)),[c,b]=useState(false),[z,K]=useState(false),[Q,de]=useAtom(Fe(e)),{onOpen:_}=pe(e),{onClose:Ce}=ge(e),Ke=useAtomValue(Ye(e)),F=useAtomValue(Ve(e)),$=useValueRef(Q),p=useValueRef(n),Qe=useValueRef(l),g=useValueRef(i),et=useValueRef(c),ce=useValueRef(z),ue=useCallbackRef(de),ee=useCallbackRef(_),te=useCallbackRef(Ce),Re=useValueRef(Ke),Pe=useValueRef(F),S=x=>{x.preventDefault(),x.stopPropagation(),b(true),document.body.style.cursor="ew-resize",document.body.style.userSelect="none",document.body.style.overflow="hidden",document.body.style.position="fixed",document.body.style.width="100%",document.body.style.height="100%";let N=x.clientX,j=$.current,ne=re=>{if(!et.current)return;let E=re.clientX-N,me=g.current==="right"?j-E:j+E,J=Math.min(Math.max(me,Qe.current),p.current);ue(J);},Z=()=>{b(false),document.body.style.cursor="",document.body.style.userSelect="",document.body.style.overflow="",document.body.style.position="",document.body.style.width="",document.body.style.height="",document.removeEventListener("mousemove",ne),document.removeEventListener("mouseup",Z);};document.addEventListener("mousemove",ne),document.addEventListener("mouseup",Z);},oe=x=>{if(x.target instanceof HTMLElement&&x.target.closest("button"))return;x.preventDefault(),K(true);let N=x.clientX,j=x.clientY,ne=()=>{document.removeEventListener("mousemove",Z),document.removeEventListener("mouseup",re),K(false);},Z=E=>{if(!ce.current)return;let me=Math.abs(E.clientX-N),J=Math.abs(E.clientY-j);(me>10||J>10)&&(ne(),te(),ee({shouldStartDragging:true,position:{x:E.clientX-$.current/2+20,y:E.clientY-20},size:{width:Math.min(Math.max($.current,Re.current),Pe.current)}}));},re=()=>{ne();};document.addEventListener("mousemove",Z),document.addEventListener("mouseup",re);},ze=()=>{te();};return d!==i?null:jsxs("div",{className:"max-sm:hidden flex-none flex flex-row overflow-hidden",children:[i==="right"&&jsx(Wt,{isResizing:c,handleResizeStart:S}),jsxs("div",{className:clsx("flex flex-col min-h-0 overflow-hidden bg-content1",z?"opacity-80 scale-98 blur-[1px]":"opacity-100 scale-100 blur-none"),style:{width:`${Q}px`,transition:c||z?"none":"transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s cubic-bezier(0.33, 1, 0.68, 1), height 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.33, 1, 0.68, 1)",contain:"content"},children:[f&&jsxs("div",{className:"flex-none relative border-b border-border/80 px-3 gap-4 flex items-center justify-between cursor-move select-none",onMouseDown:oe,style:{height:o},children:[jsx(StyledTooltip,{placement:"top",closeDelay:0,content:a("scaffold.draggablePanel.snapToModal"),children:jsx(DraggableIcon,{className:"text-neutral absolute left-1/2 -translate-x-1/2 top-0"})}),m||jsxs(Fragment,{children:[jsx("div",{className:"min-w-0 flex-initial text-sm font-medium truncate cursor-auto",onMouseDown:x=>x.stopPropagation(),children:t}),jsx("div",{className:"flex-none flex items-center justify-end gap-1",onMouseDown:x=>x.stopPropagation(),children:jsx(Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:ze,children:jsx(XCloseIcon,{width:18,height:18,className:"text-neutral"})})})]})]}),jsx("div",{className:"flex-auto min-h-0 overflow-y-auto",children:r})]}),i==="left"&&jsx(Wt,{isResizing:c,handleResizeStart:S})]})}function Wt({isResizing:e,handleResizeStart:t}){return jsxs("div",{className:"relative",children:[jsxs("div",{className:"relative w-1 h-full cursor-ew-resize bg-border/80 hover:bg-border transition-colors duration-150 ease-in-out group flex flex-col items-center justify-center gap-1",children:[jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsx("div",{className:"absolute inset-0 -left-1.5 -right-1.5 cursor-ew-resize",onMouseDown:t})]}),e&&jsx("div",{className:"fixed inset-0 z-50 cursor-ew-resize"})]})}function Bn({contents:e=[],className:t,classNames:n,children:l}){let i=useAtomValue(je);useEffect(()=>{let o=getDefaultStore();e.forEach(r=>{o.set(He(r.id),r.panelMinWidth??320),o.set(ke(r.id),r.panelMaxWidth??440),o.set(Ye(r.id),r.modalMinWidth??504),o.set(Ve(r.id),r.modalMaxWidth??window.innerWidth-40);});},[e]);let f=useMemo(()=>e.filter(o=>{let r=getDefaultStore();return i.left[o.id]?r.get(se(o.id))==="left":false}).sort((o,r)=>i.left[r.id]-i.left[o.id]),[e,i.left]),m=useMemo(()=>e.filter(o=>{let r=getDefaultStore();return i.right[o.id]?r.get(se(o.id))==="right":false}).sort((o,r)=>(i.right[o.id]??0)-(i.right[r.id]??0)),[e,i.right]);return jsxs(Fragment,{children:[jsxs("div",{className:clsx("w-full h-full flex flex-row overflow-hidden",t,n?.root),children:[jsx("div",{className:clsx("flex-none h-full flex flex-row",n?.left),children:f.map(o=>jsx(dt,{...o,position:"left",minWidth:o.panelMinWidth??320,maxWidth:o.panelMaxWidth??440},`left-${o.id}`))}),jsx("div",{className:clsx("flex-auto min-w-0 h-full",n?.content),children:l}),jsx("div",{className:clsx("flex-none h-full flex flex-row",n?.right),children:m.map(o=>jsx(dt,{...o,position:"right",minWidth:o.panelMinWidth??320,maxWidth:o.panelMaxWidth??440},`right-${o.id}`))})]}),e.map(o=>jsx(Dt,{...o,minWidth:o.modalMinWidth??504,maxWidth:o.modalMaxWidth??window.innerWidth-40},`modal-${o.id}`))]})}function Gn(e){let{isOpen:t,onOpen:n,onClose:l}=pe(e),{isOpen:i,onOpen:f,onClose:m}=ge(e),o=useAtomValue(fe(e)),r=useCallback(()=>{t||i||(o==="modal"?n():f({position:o}));},[t,i,o,n,f]),a=useCallback(()=>{t?l():i&&m();},[t,i,l,m]),d=useMemo(()=>t||i,[t,i]);return useMemo(()=>({isOpen:d,onOpen:r,onClose:a}),[d,r,a])}function ar({children:e,className:t}){return jsx("div",{className:clsx("max-sm:hidden flex-none w-full h-15 px-6 max-lg:px-4 gap-6 max-lg:gap-4 flex justify-between items-center border-b border-border bg-background",t),children:e})}function ur({children:e,className:t}){return jsx("div",{className:clsx("sm:hidden flex-none w-full h-11 px-2 flex justify-between items-center border-b border-border bg-background",t),children:e})}function pr({children:e,className:t}){return jsx("div",{className:clsx("sm:hidden flex-none w-full h-14 flex justify-evenly items-center border-t border-border bg-background",t),children:e})}function yr({children:e,className:t}){return jsx("div",{className:clsx("flex flex-col w-full h-screen max-sm:h-dvh overflow-hidden bg-background",t),children:e})}function Rr({className:e,children:t}){return jsx("div",{className:clsx("flex-auto w-full min-h-0",e),children:t})}function Wr({href:e="/",icon:t,miniIcon:n,className:l}){let{t:i}=useTranslation();return jsxs(Link,{href:e,className:clsx("flex-none flex justify-center items-center",l),"aria-label":i("scaffold.home"),children:[jsx("div",{className:clsx("flex justify-center items-center",!!n&&"max-xl:hidden"),children:t}),n&&jsx("div",{className:"flex justify-center items-center xl:hidden",children:n})]})}function Ir({href:e,title:t,active:n=false,className:l}){return jsx(Link,{"data-active":n,href:e,className:clsx("h-8 text-sm font-medium px-2 xl:px-3 data-[active=true]:text-primary hover:text-primary text-foreground hover:bg-primary-50 rounded-sm",l),"aria-label":t,children:t})}function Ht({scrollAmount:e,dependencies:t=[]}){let n=useRef(null),[l,i]=useState(false),[f,m]=useState(false),o=useCallback(()=>{let a=n.current;if(!a)return;let{scrollLeft:d,scrollWidth:c,clientWidth:b}=a;i(d>0),m(d<c-b-1);},[]),r=useCallback(a=>{let d=n.current;if(!d)return;let c=a==="left"?-e:e;d.scrollBy({left:c,behavior:"smooth"});},[e]);return useEffect(()=>{let a=n.current;if(!a)return;o(),a.addEventListener("scroll",o);let d=new ResizeObserver(o);return d.observe(a),()=>{a.removeEventListener("scroll",o),d.disconnect();}},[o,...t]),{showLeftArrow:l,showRightArrow:f,scroll:r,containerRef:n}}function Gr({scrollAmount:e=150,className:t,classNames:n,children:l}){let{showLeftArrow:i,showRightArrow:f,scroll:m,containerRef:o}=Ht({scrollAmount:e,dependencies:[l]}),[r,a]=useState(false),d=useCallback(()=>{a(true);},[]),c=useCallback(()=>{a(false);},[]),b=useCallback(()=>{m("left");},[m]),z=useCallback(()=>{m("right");},[m]);return jsxs("div",{className:clsx("relative flex",t,n?.root),onMouseEnter:d,onMouseLeave:c,children:[i&&jsx("div",{className:clsx("absolute left-0 top-0 w-8 h-full z-40 bg-gradient-to-r from-background/60 to-transparent flex items-center pointer-events-none",n?.leftArrow),children:jsx(StyledButton,{onPress:b,isIconOnly:true,disableRipple:true,disableAnimation:true,className:clsx("absolute left-0 w-6 h-6 bg-transparent flex items-center justify-center text-foreground/40 hover:text-foreground transition-all duration-125 ease-in-out opacity-0",r&&"opacity-100 pointer-events-auto",n?.leftArrowButton),children:jsx(ChevronLeftIcon,{width:18,height:18,className:n?.leftArrowIcon})})}),f&&jsx("div",{className:clsx("absolute right-0 top-0 w-8 h-full z-40 bg-gradient-to-l from-background/60 to-transparent flex items-center justify-end pointer-events-none",n?.rightArrow),children:jsx(StyledButton,{onPress:z,isIconOnly:true,disableRipple:true,disableAnimation:true,className:clsx("absolute right-0 w-6 h-6 bg-transparent flex items-center justify-center text-foreground/40 hover:text-foreground transition-all duration-125 ease-in-out opacity-0",r&&"opacity-100 pointer-events-auto",n?.rightArrowButton),children:jsx(ChevronRightIcon,{width:18,height:18,className:n?.rightArrowIcon})})}),jsx("div",{ref:o,className:clsx("flex overflow-x-auto overflow-y-hidden no-scrollbar",n?.content),children:l})]})}function si({id:e,children:t}){let n=useEventEmitter(),{isOpen:l,onOpen:i,onClose:f,onOpenChange:m}=useDisclosure(),[o,r]=useState(void 0),[a,d]=useState(void 0);return useEffect(()=>{let c=({params:b,onResult:z})=>{r(b),d(z),i();};return n.on(`open_modal:${e}`,c),()=>{n.off(`open_modal:${e}`,c);}},[e,i,n]),useEffect(()=>{let c=()=>{f();};return n.on(`close_modal:${e}`,c),()=>{n.off(`close_modal:${e}`,c);}},[e,f,n]),t({params:o,isOpen:l,onClose:f,onOpenChange:m,onResult:a})}function ci(e){let t=useEventEmitter(),n=useCallback(i=>{t.emit(`open_modal:${e}`,i);},[e,t]),l=useCallback(()=>{t.emit(`close_modal:${e}`);},[e,t]);return {onOpen:n,onClose:l}}typeof window<"u"&&(window.__LIBERFI_VERSION__=window.__LIBERFI_VERSION__||{},window.__LIBERFI_VERSION__["@liberfi.io/ui-scaffold"]="0.1.8");var nn="0.1.8";export{si as AsyncModal,Dt as DraggableModal,dt as DraggablePanel,Bn as DraggablePanelProvider,pr as Footer,ar as Header,Ir as HeaderNavigation,Gr as HorizontalScrollContainer,Wr as Logo,ur as MobileHeader,yr as Page,Rr as PageContent,ci as useAsyncModal,Gn as useDraggableDisclosure,pe as useDraggableModalDisclosure,ge as useDraggablePanelDisclosure,nn as version};//# sourceMappingURL=index.mjs.map
+import {memo,useState,useRef,useMemo,useEffect,useCallback}from'react';import {createPortal}from'react-dom';import {useValueRef,useCallbackRef,useEventEmitter}from'@liberfi.io/hooks';import {useTranslation}from'@liberfi.io/i18n';import {atomFamily,atomWithStorage,useAtom,useAtomValue,clsx,StyledTooltip,DraggableIcon,Button,RestoreWindowIcon,MinimizeIcon,UnMaximizeIcon,MaximizeIcon,XCloseIcon,useSetAtom,getDefaultStore,Link,useDisclosure}from'@liberfi.io/ui';import {throttle}from'@liberfi.io/utils';import {jsxs,Fragment,jsx}from'react/jsx-runtime';var se=atomFamily(e=>atomWithStorage(`panelState.${e??"default"}`,"none",void 0,{getOnInit:true})),Fe=atomFamily(e=>atomWithStorage(`panelWidth.${e??"default"}`,350,void 0,{getOnInit:true})),Le=atomFamily(e=>atomWithStorage(`panelMinWidth.${e??"default"}`,320,void 0,{getOnInit:true})),He=atomFamily(e=>atomWithStorage(`panelMaxWidth.${e??"default"}`,440,void 0,{getOnInit:true})),gt=atomFamily(e=>atomWithStorage(`modalOpen.${e??"default"}`,false,void 0,{getOnInit:true})),ke=atomFamily(e=>atomWithStorage(`modalShouldStartDragging.${e??"default"}`,false,void 0,{getOnInit:true})),Te=atomFamily(e=>atomWithStorage(`modalSize.${e??"default"}`,{width:350,height:580},void 0,{getOnInit:true})),Ae=atomFamily(e=>atomWithStorage(`modalRestoreSize.${e??"default"}`,{width:350,height:580},void 0,{getOnInit:true})),_e=atomFamily(e=>atomWithStorage(`modalPosition.${e??"default"}`,{x:typeof window<"u"?Math.max(0,(window.innerWidth-350)/2):0,y:typeof window<"u"?Math.max(0,(window.innerHeight-580)/2):0},void 0,{getOnInit:true})),$e=atomFamily(e=>atomWithStorage(`modalRestorePosition.${e??"default"}`,{x:typeof window<"u"?Math.max(0,(window.innerWidth-350)/2):0,y:typeof window<"u"?Math.max(0,(window.innerHeight-580)/2):0},void 0,{getOnInit:true})),Xe=atomFamily(e=>atomWithStorage(`modalMinimized.${e??"default"}`,false,void 0,{getOnInit:true})),Ye=atomFamily(e=>atomWithStorage(`modalMinWidth.${e??"default"}`,200,void 0,{getOnInit:true})),Be=atomFamily(e=>atomWithStorage(`modalMaxWidth.${e??"default"}`,typeof window<"u"?window.innerWidth-40:0,void 0,{getOnInit:true})),he=atomFamily(e=>atomWithStorage(`lastPanelType.${e??"default"}`,"modal",void 0,{getOnInit:true})),Ue=atomWithStorage("panelOrders",{left:{},right:{}},void 0,{getOnInit:true});function fe(e){let[t,o]=useAtom(gt(e)),[d,s]=useAtom(Xe(e)),h=useAtomValue(Ae(e)),g=useAtomValue($e(e)),n=useSetAtom(Te(e)),i=useSetAtom(_e(e)),w=useSetAtom(ke(e)),R=useSetAtom(he(e)),m=useCallback((S={})=>{let{shouldStartDragging:K,position:Q,size:le}=S;Q&&i(_=>({..._,...Q})),le&&n(_=>({..._,...le})),w(K??false),o(true),R("modal");},[o,i,n,w]),P=useCallback(()=>{o(false),d&&(n({...h}),i({...g}),s(false));},[d,h,g,s,o,n,i]);return useMemo(()=>({isOpen:t,onOpen:m,onClose:P}),[t,m,P])}function pe(e){let[t,o]=useAtom(se(e)),d=useSetAtom(Fe(e)),s=useSetAtom(he(e)),h=useSetAtom(Ue),g=useCallback((R={})=>{let m=R.position??"left";d(R.width??320),o(m),s(m),h(({left:P,right:S})=>m==="left"?{left:{...P,[e]:Date.now()},right:S}:{left:P,right:{...S,[e]:Date.now()}});},[e,o,d]),n=useCallback(()=>{o("none");},[o]),i=useMemo(()=>t!=="none",[t]),w=useMemo(()=>t!=="none"?t:void 0,[t]);return useMemo(()=>({isOpen:i,position:w,onOpen:g,onClose:n}),[i,g,n])}var cn={width:200,height:48},Se={width:typeof window<"u"?window.innerWidth-40:0,height:typeof window<"u"?window.innerHeight-40:0},mn={x:20,y:20},Rt=memo(function({id:t,title:o,minWidth:d=504,maxWidth:s=Se.width,minHeight:h=200,maxHeight:g=Se.height,leftSidebar:n,leftSidebarWidth:i=200,rightSidebar:w,rightSidebarWidth:R=200,aspectRatio:m,showHeader:P=true,header:S,headerHeight:K=44,children:Q}){let{t:le}=useTranslation(),{isOpen:_,onClose:Ee}=fe(t),{onOpen:Je}=pe(t),[H,$]=useAtom(Xe(t)),[u,qe]=useAtom(_e(t)),[c,Ge]=useAtom(Te(t)),[de,ue]=useAtom(Ae(t)),[ee,te]=useAtom($e(t)),[Me,ve]=useAtom(ke(t)),[O,ne]=useState(Me),[Re,f]=useState(false),[N,Z]=useState(null),[oe,j]=useState(null),[ie,E]=useState(null),[ce,J]=useState(null),X=useRef(null),Lt=useAtomValue(Le(t)),Ht=useAtomValue(He(t)),Y=useValueRef(u),x=useCallbackRef(qe),re=useValueRef(c),I=useCallbackRef(Ge),kt=useValueRef(i),Tt=useValueRef(!!n),At=useValueRef(R),_t=useValueRef(!!w),T=useValueRef(m),B=useValueRef(K),Pe=useValueRef(d),ze=useValueRef(s),De=useValueRef(h),We=useValueRef(g),$t=useValueRef(O),lt=useValueRef(oe),Ke=useValueRef(ce),Xt=useCallbackRef(Ee),Yt=useCallbackRef(Je),Bt=useValueRef(Lt),Ut=useValueRef(Ht),Oe=useMemo(()=>c.width===Se.width&&c.height===Se.height,[c.width,c.height]);useEffect(()=>{(u.x<0||u.y<0)&&x({x:Math.max(0,u.x),y:Math.max(0,u.y)});let r=u.x+c.width,C=u.y+c.height;(r>window.innerWidth||C>window.innerHeight)&&x({x:Math.min(u.x,Math.max(0,window.innerWidth-c.width)),y:Math.min(u.y,Math.max(0,window.innerHeight-c.height))});},[t]),useEffect(()=>{if(_&&Me){ne(true);let r=q=>{x({x:q.clientX-c.width/2,y:q.clientY-20});},C=()=>{ne(false),ve(false),document.removeEventListener("mousemove",r),document.removeEventListener("mouseup",C);};return document.addEventListener("mousemove",r),document.addEventListener("mouseup",C),document.body.style.cursor="grabbing",()=>{document.removeEventListener("mousemove",r),document.removeEventListener("mouseup",C),document.body.style.cursor="";}}},[_,Me,ve,c.width]);let A=(r,C,q)=>{ve(false),ne(false),f(false),Z(null),C==="drag"?ne(true):C==="resize"&&(Z(q||null),f(true));let dt=r.clientX,ut=r.clientY,F=re.current.width,k=re.current.height,L={...Y.current},ct=()=>{document.removeEventListener("mousemove",mt),document.removeEventListener("mouseup",ht),document.body.style.cursor="",ne(false),f(false),Z(null),j(null),X.current&&(clearTimeout(X.current),X.current=null),J(null),E(null);},mt=Ie=>{if(C==="drag"){let U=Ie.clientX-dt,V=Ie.clientY-ut,b=L.x+U,l=L.y+V,me=Tt.current?kt.current:0,Ne=12+me,z=_t.current?At.current:0,y=window.innerWidth-12-F-z,Ce=window.innerHeight-12-44,M=b<=Ne?"left":b>=y?"right":null;M!==lt.current&&j(M),X.current&&M&&E(M),X.current&&(Ke.current==="left"&&(b>Ne||M!=="left")||Ke.current==="right"&&(b<y||M!=="right"))&&(clearTimeout(X.current),X.current=null,J(null),E(null)),!X.current&&M&&Ke.current!==M&&(J(M),E(M),X.current=setTimeout(()=>{$t.current&&lt.current===M?(ct(),Xt(),Yt({position:M,width:Math.min(Math.max(re.current.width,Bt.current),Ut.current)})):J(null);},350)),b=Math.min(Math.max(b,12+me),y),l=Math.min(Math.max(l,12),Ce),x({x:b,y:l});}else if(C==="resize"&&q){let U=Ie.clientX-dt,V=Ie.clientY-ut,b=(l,me,Ne)=>{let z=Math.min(Math.max(l,Pe.current),ze.current),y=Math.min(Math.max(me,De.current),We.current);if(T.current){if(Ne==="width")y=Math.min(Math.max(l/T.current+B.current,De.current),We.current),z=(y-B.current)*T.current;else if(Ne==="height")z=Math.min(Math.max((me-B.current)*T.current,Pe.current),ze.current),y=z/T.current+B.current;else {let Ce=l/T.current+B.current,M=(me-B.current)*T.current,ft=Math.abs(U),pt=Math.abs(V);if(ft>1.1*pt)y=Math.min(Math.max(Ce,De.current),We.current),z=(y-B.current)*T.current;else if(pt>1.1*ft)z=Math.min(Math.max(M,Pe.current),ze.current),y=z/T.current+B.current;else {let jt=(y+Ce)/2;z=Math.min(Math.max((z+M)/2,Pe.current),ze.current),y=Math.min(Math.max(jt,De.current),We.current),z=(y-B.current)*T.current;}}z=Math.min(Math.max(z,Pe.current),ze.current),y=Math.min(Math.max(y,De.current),We.current);}return {width:z,height:y}};switch(q){case "topLeft":{let l=b(F-U,k-V,"both");I(l),x({x:L.x+(F-l.width),y:L.y+(k-l.height)});break}case "topRight":{let l=b(F+U,k-V,"both");I(l),x({x:L.x,y:L.y+(k-l.height)});break}case "bottomLeft":{let l=b(F-U,k+V,"both");I(l),x({x:L.x+(F-l.width),y:L.y});break}case "bottomRight":{I(b(F+U,k+V,"both"));break}case "top":{let l=b(F,k-V,"height");I(l),x({x:L.x,y:L.y+(k-l.height)});break}case "bottom":{I(b(F,k+V,"height"));break}case "left":{let l=b(F-U,k,"width");I(l),x({x:L.x+(F-l.width),y:L.y});break}case "right":{I(b(F+U,k,"width"));break}}}},ht=()=>{(u.x<0||u.y<0)&&x({x:Math.max(0,u.x),y:Math.max(0,u.y)}),ct();};document.addEventListener("mousemove",mt),document.addEventListener("mouseup",ht);},Vt=useCallback(()=>{H?(I({...de}),x({...ee}),$(false)):(Oe?x({...ee}):(ue({...c}),te({...u})),I({...cn}),$(true));},[H,Oe,c,u,de,ee,$,ue,te]),Zt=useCallback(()=>{Oe?(I({...de}),x({...ee})):(H?$(false):(ue({...c}),te({...u})),I({...Se}),x({...mn}));},[Oe,H,c,u,de,ee,$,ue,te]);return useEffect(()=>{let r=throttle(()=>{(Y.current.x<0||Y.current.y<0)&&x({x:Math.max(0,Y.current.x),y:Math.max(0,Y.current.y)});let C=Y.current.x+re.current.width,q=Y.current.y+re.current.height;(C>window.innerWidth||q>window.innerHeight)&&x({x:Math.min(Y.current.x,Math.max(0,window.innerWidth-re.current.width)),y:Math.min(Y.current.y,Math.max(0,window.innerHeight-re.current.height))});},100);return window.addEventListener("resize",r),()=>{window.removeEventListener("resize",r);}},[]),_?jsxs(Fragment,{children:[(O||Re)&&createPortal(jsx("div",{className:clsx("max-sm:hidden fixed inset-0 z-9999 bg-transparent w-full h-full select-none",O&&(ce?"cursor-grabbing":"cursor-move"),!O&&{"cursor-ns-resize":N==="top"||N==="bottom","cursor-ew-resize":N==="left"||N==="right","cursor-nwse-resize":N==="topLeft"||N==="bottomRight","cursor-nesw-resize":N==="topRight"||N==="bottomLeft","cursor-auto":N===null})}),document.body),jsx("div",{className:clsx("max-sm:hidden fixed z-50 left-0 top-0",O?"will-change-transform":"will-change-auto",Re||O?"transition-none":"transition-transform duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]"),style:{transform:`translate(${Math.round(u.x-(n?i:0))}px, ${Math.round(u.y)}px)`},children:jsxs("div",{className:"flex relative z-50",children:[n&&jsx("div",{className:clsx("relative mt-1 z-10 transition-all duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]",O?"opacity-40 translate-x-4":"opacity-100 translate-x-0"),style:{width:i,height:H?40:c.height-8},children:n}),jsx("div",{className:clsx("z-50 relative bg-content1 border border-border rounded-lg overflow-hidden",O?"opacity-80 shadow-md scale-102 blur-[0.5px]":"opacity-100 shadow-lg scale-100 blur-none"),style:{width:c.width,height:c.height,transition:Re||O?"none":"transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s cubic-bezier(0.33, 1, 0.68, 1), height 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.33, 1, 0.68, 1)",contain:"content"},children:jsxs("div",{className:clsx("w-full h-full",ie&&"animate-modal-shrink",ie==="left"?"origin-left":"origin-right"),style:{contain:"paint"},children:[!H&&jsxs(Fragment,{children:[jsx("div",{className:"absolute top-0 left-0 w-3 h-3 cursor-nw-resize z-20",onMouseDown:r=>A(r,"resize","topLeft")}),jsx("div",{className:"absolute top-0 right-0 w-3 h-3 cursor-ne-resize z-20",onMouseDown:r=>A(r,"resize","topRight")}),jsx("div",{className:"absolute bottom-0 left-0 w-3 h-3 cursor-sw-resize z-20",onMouseDown:r=>A(r,"resize","bottomLeft")}),jsx("div",{className:"absolute bottom-0 right-0 w-3 h-3 cursor-se-resize z-20",onMouseDown:r=>A(r,"resize","bottomRight")}),jsx("div",{className:"absolute top-0 left-3 right-3 h-1.5 cursor-n-resize z-20",onMouseDown:r=>A(r,"resize","top")}),jsx("div",{className:"absolute bottom-0 left-3 right-3 h-1.5 cursor-s-resize z-20",onMouseDown:r=>A(r,"resize","bottom")}),jsx("div",{className:"absolute left-0 top-3 bottom-3 w-1.5 cursor-w-resize z-20",onMouseDown:r=>A(r,"resize","left")}),jsx("div",{className:"absolute right-0 top-3 bottom-3 w-1.5 cursor-e-resize z-20",onMouseDown:r=>A(r,"resize","right")})]}),P&&jsxs("div",{className:"relative border-b border-border/80 px-3 gap-4 flex items-center justify-between cursor-move select-none",onMouseDown:r=>A(r,"drag"),style:{height:K},children:[jsx(StyledTooltip,{placement:"top",closeDelay:0,content:le("scaffold.draggableModal.snapToEdge"),children:jsx(DraggableIcon,{className:"text-neutral absolute left-1/2 -translate-x-1/2 top-0"})}),S||jsxs(Fragment,{children:[jsx("div",{className:"min-w-0 flex-initial text-sm font-medium truncate cursor-auto",onMouseDown:r=>r.stopPropagation(),children:o}),jsxs("div",{className:"flex-none flex items-center justify-end gap-1",onMouseDown:r=>r.stopPropagation(),children:[jsx(Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:Vt,children:H?jsx(RestoreWindowIcon,{width:18,height:18,className:"text-neutral"}):jsx(MinimizeIcon,{width:18,height:18,className:"text-neutral"})}),jsx(Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:Zt,children:Oe?jsx(UnMaximizeIcon,{width:18,height:18,className:"text-neutral"}):jsx(MaximizeIcon,{width:18,height:18,className:"text-neutral"})}),jsx(Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:Ee,children:jsx(XCloseIcon,{width:18,height:18,className:"text-neutral"})})]})]})]}),!H&&jsx("div",{className:P?"h-[calc(100%-44px)] overflow-x-hidden overflow-y-auto":"h-full overflow-x-hidden overflow-y-auto cursor-move",onMouseDown:P?void 0:r=>A(r,"drag"),children:Q})]})}),w&&jsx("div",{className:clsx("relative mt-1 z-10 transition-all duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]",O?"opacity-40 -translate-x-4":"opacity-100 translate-x-0"),style:{width:R,height:H?40:c.height-8},children:w})]})})]}):null});function st({id:e,title:t,maxWidth:o=440,minWidth:d=320,position:s,showHeader:h=true,header:g,headerHeight:n=44,children:i}){let{t:w}=useTranslation(),R=useAtomValue(se(e)),[m,P]=useState(false),[S,K]=useState(false),[Q,le]=useAtom(Fe(e)),{onOpen:_}=fe(e),{onClose:Ee}=pe(e),Je=useAtomValue(Ye(e)),H=useAtomValue(Be(e)),$=useValueRef(Q),u=useValueRef(o),qe=useValueRef(d),c=useValueRef(s),Ge=useValueRef(m),de=useValueRef(S),ue=useCallbackRef(le),ee=useCallbackRef(_),te=useCallbackRef(Ee),Me=useValueRef(Je),ve=useValueRef(H),O=f=>{f.preventDefault(),f.stopPropagation(),P(true),document.body.style.cursor="ew-resize",document.body.style.userSelect="none",document.body.style.overflow="hidden",document.body.style.position="fixed",document.body.style.width="100%",document.body.style.height="100%";let N=f.clientX,Z=$.current,oe=ie=>{if(!Ge.current)return;let E=ie.clientX-N,ce=c.current==="right"?Z-E:Z+E,J=Math.min(Math.max(ce,qe.current),u.current);ue(J);},j=()=>{P(false),document.body.style.cursor="",document.body.style.userSelect="",document.body.style.overflow="",document.body.style.position="",document.body.style.width="",document.body.style.height="",document.removeEventListener("mousemove",oe),document.removeEventListener("mouseup",j);};document.addEventListener("mousemove",oe),document.addEventListener("mouseup",j);},ne=f=>{if(f.target instanceof HTMLElement&&f.target.closest("button"))return;f.preventDefault(),K(true);let N=f.clientX,Z=f.clientY,oe=()=>{document.removeEventListener("mousemove",j),document.removeEventListener("mouseup",ie),K(false);},j=E=>{if(!de.current)return;let ce=Math.abs(E.clientX-N),J=Math.abs(E.clientY-Z);(ce>10||J>10)&&(oe(),te(),ee({shouldStartDragging:true,position:{x:E.clientX-$.current/2+20,y:E.clientY-20},size:{width:Math.min(Math.max($.current,Me.current),ve.current)}}));},ie=()=>{oe();};document.addEventListener("mousemove",j),document.addEventListener("mouseup",ie);},Re=()=>{te();};return R!==s?null:jsxs("div",{className:"max-sm:hidden flex-none flex flex-row overflow-hidden",children:[s==="right"&&jsx(zt,{isResizing:m,handleResizeStart:O}),jsxs("div",{className:clsx("flex flex-col min-h-0 overflow-hidden bg-content1",S?"opacity-80 scale-98 blur-[1px]":"opacity-100 scale-100 blur-none"),style:{width:`${Q}px`,transition:m||S?"none":"transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s cubic-bezier(0.33, 1, 0.68, 1), height 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.33, 1, 0.68, 1)",contain:"content"},children:[h&&jsxs("div",{className:"flex-none relative border-b border-border/80 px-3 gap-4 flex items-center justify-between cursor-move select-none",onMouseDown:ne,style:{height:n},children:[jsx(StyledTooltip,{placement:"top",closeDelay:0,content:w("scaffold.draggablePanel.snapToModal"),children:jsx(DraggableIcon,{className:"text-neutral absolute left-1/2 -translate-x-1/2 top-0"})}),g||jsxs(Fragment,{children:[jsx("div",{className:"min-w-0 flex-initial text-sm font-medium truncate cursor-auto",onMouseDown:f=>f.stopPropagation(),children:t}),jsx("div",{className:"flex-none flex items-center justify-end gap-1",onMouseDown:f=>f.stopPropagation(),children:jsx(Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:Re,children:jsx(XCloseIcon,{width:18,height:18,className:"text-neutral"})})})]})]}),jsx("div",{className:"flex-auto min-h-0 overflow-y-auto",children:i})]}),s==="left"&&jsx(zt,{isResizing:m,handleResizeStart:O})]})}function zt({isResizing:e,handleResizeStart:t}){return jsxs("div",{className:"relative",children:[jsxs("div",{className:"relative w-1 h-full cursor-ew-resize bg-border/80 hover:bg-border transition-colors duration-150 ease-in-out group flex flex-col items-center justify-center gap-1",children:[jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsx("div",{className:"absolute inset-0 -left-1.5 -right-1.5 cursor-ew-resize",onMouseDown:t})]}),e&&jsx("div",{className:"fixed inset-0 z-50 cursor-ew-resize"})]})}function So({contents:e=[],className:t,classNames:o,children:d}){let s=useAtomValue(Ue);useEffect(()=>{let n=getDefaultStore();e.forEach(i=>{n.set(Le(i.id),i.panelMinWidth??320),n.set(He(i.id),i.panelMaxWidth??440),n.set(Ye(i.id),i.modalMinWidth??504),n.set(Be(i.id),i.modalMaxWidth??window.innerWidth-40);});},[e]);let h=useMemo(()=>e.filter(n=>{let i=getDefaultStore();return s.left[n.id]?i.get(se(n.id))==="left":false}).sort((n,i)=>s.left[i.id]-s.left[n.id]),[e,s.left]),g=useMemo(()=>e.filter(n=>{let i=getDefaultStore();return s.right[n.id]?i.get(se(n.id))==="right":false}).sort((n,i)=>(s.right[n.id]??0)-(s.right[i.id]??0)),[e,s.right]);return jsxs(Fragment,{children:[jsxs("div",{className:clsx("w-full h-full flex flex-row overflow-hidden",t,o?.root),children:[jsx("div",{className:clsx("flex-none h-full flex flex-row",o?.left),children:h.map(n=>jsx(st,{...n,position:"left",minWidth:n.panelMinWidth??320,maxWidth:n.panelMaxWidth??440},`left-${n.id}`))}),jsx("div",{className:clsx("flex-auto min-w-0 h-full",o?.content),children:d}),jsx("div",{className:clsx("flex-none h-full flex flex-row",o?.right),children:g.map(n=>jsx(st,{...n,position:"right",minWidth:n.panelMinWidth??320,maxWidth:n.panelMaxWidth??440},`right-${n.id}`))})]}),e.map(n=>jsx(Rt,{...n,minWidth:n.modalMinWidth??504,maxWidth:n.modalMaxWidth??window.innerWidth-40},`modal-${n.id}`))]})}function To(e){let{isOpen:t,onOpen:o,onClose:d}=fe(e),{isOpen:s,onOpen:h,onClose:g}=pe(e),n=useAtomValue(he(e)),i=useCallback(()=>{t||s||(n==="modal"?o():h({position:n}));},[t,s,n,o,h]),w=useCallback(()=>{t?d():s&&g();},[t,s,d,g]),R=useMemo(()=>t||s,[t,s]);return useMemo(()=>({isOpen:R,onOpen:i,onClose:w}),[R,i,w])}function jo({children:e,className:t}){return jsx("div",{className:clsx("max-sm:hidden flex-none w-full h-15 px-6 max-lg:px-4 gap-6 max-lg:gap-4 flex justify-between items-center border-b border-border bg-background",t),children:e})}function Ko({children:e,className:t}){return jsx("div",{className:clsx("sm:hidden flex-none w-full h-11 px-2 flex justify-between items-center border-b border-border bg-background",t),children:e})}function ni({children:e,className:t}){return jsx("div",{className:clsx("sm:hidden flex-none w-full h-14 flex justify-evenly items-center border-t border-border bg-background",t),children:e})}function si({children:e,className:t}){return jsx("div",{className:clsx("flex flex-col w-full h-screen max-sm:h-dvh overflow-hidden bg-background",t),children:e})}function ui({className:e,children:t}){return jsx("div",{className:clsx("flex-auto w-full min-h-0",e),children:t})}function pi({href:e="/",icon:t,miniIcon:o,className:d}){let{t:s}=useTranslation();return jsxs(Link,{href:e,className:clsx("flex-none flex justify-center items-center",d),"aria-label":s("scaffold.home"),children:[jsx("div",{className:clsx("flex justify-center items-center",!!o&&"max-xl:hidden"),children:t}),o&&jsx("div",{className:"flex justify-center items-center xl:hidden",children:o})]})}function yi({href:e,title:t,active:o=false,className:d}){return jsx(Link,{"data-active":o,href:e,className:clsx("h-8 text-sm font-medium px-2 xl:px-3 data-[active=true]:text-primary hover:text-primary text-foreground hover:bg-primary-50 rounded-sm",d),"aria-label":t,children:t})}function Fi({id:e,children:t}){let o=useEventEmitter(),{isOpen:d,onOpen:s,onClose:h,onOpenChange:g}=useDisclosure(),[n,i]=useState(void 0),[w,R]=useState(void 0);return useEffect(()=>{let m=({params:P,onResult:S})=>{i(P),R(S),s();};return o.on(`open_modal:${e}`,m),()=>{o.off(`open_modal:${e}`,m);}},[e,s,o]),useEffect(()=>{let m=()=>{h();};return o.on(`close_modal:${e}`,m),()=>{o.off(`close_modal:${e}`,m);}},[e,h,o]),t({params:n,isOpen:d,onClose:h,onOpenChange:g,onResult:w})}function Ti(e){let t=useEventEmitter(),o=useCallback(s=>{t.emit(`open_modal:${e}`,s);},[e,t]),d=useCallback(()=>{t.emit(`close_modal:${e}`);},[e,t]);return {onOpen:o,onClose:d}}typeof window<"u"&&(window.__LIBERFI_VERSION__=window.__LIBERFI_VERSION__||{},window.__LIBERFI_VERSION__["@liberfi.io/ui-scaffold"]="0.1.8");var Bn="0.1.8";export{Fi as AsyncModal,Rt as DraggableModal,st as DraggablePanel,So as DraggablePanelProvider,ni as Footer,jo as Header,yi as HeaderNavigation,pi as Logo,Ko as MobileHeader,si as Page,ui as PageContent,Ti as useAsyncModal,To as useDraggableDisclosure,fe as useDraggableModalDisclosure,pe as useDraggablePanelDisclosure,Bn as version};//# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map