Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

vaul

Package Overview
Dependencies
Maintainers
1
Versions
66
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

vaul - npm Package Compare versions

Comparing version 0.8.0 to 0.8.1

dist/index.css

4

dist/index.d.ts

@@ -28,4 +28,6 @@ import * as DialogPrimitive from '@radix-ui/react-dialog';

onClose?: () => void;
direction?: 'top' | 'bottom' | 'left' | 'right';
preventScrollRestoration?: boolean;
} & (WithFadeFromProps | WithoutFadeFromProps);
declare function Root({ open: openProp, onOpenChange, children, shouldScaleBackground, onDrag: onDragProp, onRelease: onReleaseProp, snapPoints, nested, closeThreshold, scrollLockTimeout, dismissible, fadeFromIndex, activeSnapPoint: activeSnapPointProp, setActiveSnapPoint: setActiveSnapPointProp, fixed, modal, onClose, }: DialogProps): React.JSX.Element;
declare function Root({ open: openProp, onOpenChange, children, shouldScaleBackground, onDrag: onDragProp, onRelease: onReleaseProp, snapPoints, nested, closeThreshold, scrollLockTimeout, dismissible, fadeFromIndex, activeSnapPoint: activeSnapPointProp, setActiveSnapPoint: setActiveSnapPointProp, fixed, modal, onClose, direction, preventScrollRestoration, }: DialogProps): React.JSX.Element;
declare function NestedRoot({ onDrag, onOpenChange, ...rest }: DialogProps): React.JSX.Element;

@@ -32,0 +34,0 @@ declare const Drawer: {

"use client"
"use client";var pt=Object.create;var ue=Object.defineProperty;var gt=Object.getOwnPropertyDescriptor;var bt=Object.getOwnPropertyNames;var vt=Object.getPrototypeOf,ht=Object.prototype.hasOwnProperty;var wt=(e,n)=>{for(var t in n)ue(e,t,{get:n[t],enumerable:!0})},Ve=(e,n,t,r)=>{if(n&&typeof n=="object"||typeof n=="function")for(let a of bt(n))!ht.call(e,a)&&a!==t&&ue(e,a,{get:()=>n[a],enumerable:!(r=gt(n,a))||r.enumerable});return e};var Y=(e,n,t)=>(t=e!=null?pt(vt(e)):{},Ve(n||!e||!e.__esModule?ue(t,"default",{value:e,enumerable:!0}):t,e)),Et=e=>Ve(ue({},"__esModule",{value:!0}),e);var Nt={};wt(Nt,{Drawer:()=>It});module.exports=Et(Nt);var H=Y(require("@radix-ui/react-dialog")),d=Y(require("react"));var Ee=Y(require("react")),Te=Ee.default.createContext({drawerRef:{current:null},overlayRef:{current:null},scaleBackground:()=>{},onPress:()=>{},onRelease:()=>{},onDrag:()=>{},onNestedDrag:()=>{},onNestedOpenChange:()=>{},onNestedRelease:()=>{},openProp:void 0,dismissible:!1,isOpen:!1,keyboardIsOpen:{current:!1},snapPointsOffset:null,snapPoints:null,modal:!1,shouldFade:!1,activeSnapPoint:null,onOpenChange:()=>{},setActiveSnapPoint:()=>{},visible:!1,closeDrawer:()=>{},setVisible:()=>{}}),ce=()=>Ee.default.useContext(Te);function ye(e,{insertAt:n}={}){if(!e||typeof document=="undefined")return;let t=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css",n==="top"&&t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}ye(`[vaul-drawer]{touch-action:none;transform:translate3d(0,100%,0);transition:transform .5s cubic-bezier(.32,.72,0,1)}.vaul-dragging .vaul-scrollable{overflow-y:hidden!important}[vaul-drawer][vaul-drawer-visible=true]{transform:translate3d(0,var(--snap-point-height, 0),0)}[vaul-overlay]{opacity:0;transition:opacity .5s cubic-bezier(.32,.72,0,1)}[vaul-overlay][vaul-drawer-visible=true]{opacity:1}[vaul-drawer]:after{content:"";position:absolute;top:100%;background:inherit;background-color:inherit;left:0;right:0;height:200%}[vaul-overlay][vaul-snap-points=true]:not([vaul-snap-points-overlay="true"]):not([data-state="closed"]){opacity:0}[vaul-overlay][vaul-snap-points-overlay=true]:not([vaul-drawer-visible="false"]){opacity:1}@keyframes fake-animation{}@media (hover: hover) and (pointer: fine){[vaul-drawer]{user-select:none}}
`);var me=require("react"),Tt=typeof window!="undefined"?me.useLayoutEffect:me.useEffect;function Re(...e){return(...n)=>{for(let t of e)typeof t=="function"&&t(...n)}}function yt(){return He(/^Mac/)}function Dt(){return He(/^iPhone/)}function St(){return He(/^iPad/)||yt()&&navigator.maxTouchPoints>1}function xe(){return Dt()||St()}function He(e){return typeof window!="undefined"&&window.navigator!=null?e.test(window.navigator.platform):void 0}var De=typeof document!="undefined"&&window.visualViewport;function Fe(e){let n=window.getComputedStyle(e);return/(auto|scroll)/.test(n.overflow+n.overflowX+n.overflowY)}function We(e){for(Fe(e)&&(e=e.parentElement);e&&!Fe(e);)e=e.parentElement;return e||document.scrollingElement||document.documentElement}var Rt=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]),fe=0,Se;function je(e={}){let{isDisabled:n}=e;Tt(()=>{if(!n)return fe++,fe===1&&(xe()?Se=Ht():Se=xt()),()=>{fe--,fe===0&&Se()}},[n])}function xt(){return Re(de(document.documentElement,"paddingRight",`${window.innerWidth-document.documentElement.clientWidth}px`),de(document.documentElement,"overflow","hidden"))}function Ht(){let e,n=0,t=u=>{e=We(u.target),!(e===document.documentElement&&e===document.body)&&(n=u.changedTouches[0].pageY)},r=u=>{if(!e||e===document.documentElement||e===document.body){u.preventDefault();return}let o=u.changedTouches[0].pageY,A=e.scrollTop,M=e.scrollHeight-e.clientHeight;M!==0&&((A<=0&&o>n||A>=M&&o<n)&&u.preventDefault(),n=o)},a=u=>{let o=u.target;ee(o)&&o!==document.activeElement&&(u.preventDefault(),o.style.transform="translateY(-2000px)",o.focus(),requestAnimationFrame(()=>{o.style.transform=""}))},i=u=>{let o=u.target;ee(o)&&(o.style.transform="translateY(-2000px)",requestAnimationFrame(()=>{o.style.transform="",De&&(De.height<window.innerHeight?requestAnimationFrame(()=>{Ue(o)}):De.addEventListener("resize",()=>Ue(o),{once:!0}))}))},l=()=>{window.scrollTo(0,0)},w=window.pageXOffset,D=window.pageYOffset,E=Re(de(document.documentElement,"paddingRight",`${window.innerWidth-document.documentElement.clientWidth}px`),de(document.documentElement,"overflow","hidden"));window.scrollTo(0,0);let T=Re(Z(document,"touchstart",t,{passive:!1,capture:!0}),Z(document,"touchmove",r,{passive:!1,capture:!0}),Z(document,"touchend",a,{passive:!1,capture:!0}),Z(document,"focus",i,!0),Z(window,"scroll",l));return()=>{E(),T(),window.scrollTo(w,D)}}function de(e,n,t){let r=e.style[n];return e.style[n]=t,()=>{e.style[n]=r}}function Z(e,n,t,r){return e.addEventListener(n,t,r),()=>{e.removeEventListener(n,t,r)}}function Ue(e){let n=document.scrollingElement||document.documentElement;for(;e&&e!==n;){let t=We(e);if(t!==document.documentElement&&t!==document.body&&t!==e){let r=t.getBoundingClientRect().top,a=e.getBoundingClientRect().top,i=e.getBoundingClientRect().bottom,l=t.getBoundingClientRect().bottom;i>l&&(t.scrollTop+=a-r)}e=t.parentElement}}function ee(e){return e instanceof HTMLInputElement&&!Rt.has(e.type)||e instanceof HTMLTextAreaElement||e instanceof HTMLElement&&e.isContentEditable}var Ye=Y(require("react"));function Mt(e,n){typeof e=="function"?e(n):e!=null&&(e.current=n)}function Lt(...e){return n=>e.forEach(t=>Mt(t,n))}function Me(...e){return Ye.useCallback(Lt(...e),e)}var te=Y(require("react")),V=null;function ke({isOpen:e,modal:n,nested:t,hasBeenOpened:r}){let[a,i]=te.default.useState(typeof window!="undefined"?window.location.href:""),l=te.default.useRef(0);function w(){if(V===null&&e){V={position:document.body.style.position,top:document.body.style.top,left:document.body.style.left,height:document.body.style.height};let{scrollX:E,innerHeight:T}=window;document.body.style.setProperty("position","fixed","important"),document.body.style.top=`${-l.current}px`,document.body.style.left=`${-E}px`,document.body.style.right="0px",document.body.style.height="auto",setTimeout(()=>requestAnimationFrame(()=>{let u=T-window.innerHeight;u&&l.current>=T&&(document.body.style.top=`${-(l.current+u)}px`)}),300)}}function D(){if(V!==null){let E=-parseInt(document.body.style.top,10),T=-parseInt(document.body.style.left,10);document.body.style.position=V.position,document.body.style.top=V.top,document.body.style.left=V.left,document.body.style.height=V.height,document.body.style.right="unset",requestAnimationFrame(()=>{if(a!==window.location.href){i(window.location.href);return}window.scrollTo(T,E)}),V=null}}return te.default.useEffect(()=>{function E(){l.current=window.scrollY}return E(),window.addEventListener("scroll",E),()=>{window.removeEventListener("scroll",E)}},[]),te.default.useEffect(()=>{t||!r||(e?(w(),n||setTimeout(()=>{D()},500)):D())},[e,r,a]),{restorePositionSetting:D}}var k=Y(require("react"));var ze=new WeakMap;function h(e,n,t=!1){if(!e||!(e instanceof HTMLElement)||!n)return;let r={};Object.entries(n).forEach(([a,i])=>{if(a.startsWith("--")){e.style.setProperty(a,i);return}r[a]=e.style[a],e.style[a]=i}),!t&&ze.set(e,r)}function ne(e,n){if(!e||!(e instanceof HTMLElement))return;let t=ze.get(e);t&&(n?e.style[n]=t[n]:Object.entries(t).forEach(([r,a])=>{e.style[r]=a}))}function re(e){let n=window.getComputedStyle(e),t=n.transform||n.webkitTransform||n.mozTransform,r=t.match(/^matrix3d\((.+)\)$/);return r?parseFloat(r[1].split(", ")[13]):(r=t.match(/^matrix\((.+)\)$/),r?parseFloat(r[1].split(", ")[5]):null)}function Be(e){return 8*(Math.log(e+1)-2)}var p={DURATION:.5,EASE:[.32,.72,0,1]},pe=.4;var F=Y(require("react"));function _e(e){let n=F.default.useRef(e);return F.default.useEffect(()=>{n.current=e}),F.default.useMemo(()=>(...t)=>{var r;return(r=n.current)==null?void 0:r.call(n,...t)},[])}function Ct({defaultProp:e,onChange:n}){let t=F.default.useState(e),[r]=t,a=F.default.useRef(r),i=_e(n);return F.default.useEffect(()=>{a.current!==r&&(i(r),a.current=r)},[r,a,i]),t}function qe({prop:e,defaultProp:n,onChange:t=()=>{}}){let[r,a]=Ct({defaultProp:n,onChange:t}),i=e!==void 0,l=i?e:r,w=_e(t),D=F.default.useCallback(E=>{if(i){let u=typeof E=="function"?E(e):E;u!==e&&w(u)}else a(E)},[i,e,a,w]);return[l,D]}function Ke({activeSnapPointProp:e,setActiveSnapPointProp:n,snapPoints:t,drawerRef:r,overlayRef:a,fadeFromIndex:i,onSnapPointChange:l}){let[w,D]=qe({prop:e,defaultProp:t==null?void 0:t[0],onChange:n}),E=k.default.useMemo(()=>w===(t==null?void 0:t[t.length-1]),[t,w]),T=t&&t.length>0&&(i||i===0)&&!Number.isNaN(i)&&t[i]===w||!t,u=k.default.useMemo(()=>{var v;return(v=t==null?void 0:t.findIndex(g=>g===w))!=null?v:null},[t,w]),o=k.default.useMemo(()=>{var v;return(v=t==null?void 0:t.map(g=>{let b=typeof window!="undefined",C=typeof g=="string",L=0;C&&(L=parseInt(g,10));let P=C?L:b?g*window.innerHeight:0;return b?window.innerHeight-P:P}))!=null?v:[]},[t]),A=k.default.useMemo(()=>u!==null?o==null?void 0:o[u]:null,[o,u]),M=k.default.useCallback(v=>{var b;let g=(b=o==null?void 0:o.findIndex(C=>C===v))!=null?b:null;l(g),h(r.current,{transition:`transform ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`,transform:`translate3d(0, ${v}px, 0)`}),o&&g!==o.length-1&&g!==i?h(a.current,{transition:`opacity ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`,opacity:"0"}):h(a.current,{transition:`opacity ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`,opacity:"1"}),D(g!==null?t==null?void 0:t[g]:null)},[r.current,t,o,i,a,D]);k.default.useEffect(()=>{var v;if(e){let g=(v=t==null?void 0:t.findIndex(b=>b===e))!=null?v:null;o&&g&&typeof o[g]=="number"&&M(o[g])}},[e,t,o,M]);function N({draggedDistance:v,closeDrawer:g,velocity:b,dismissible:C}){if(i===void 0)return;let L=A-v,P=u===i-1,B=u===0,W=v>0;if(P&&h(a.current,{transition:`opacity ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`}),b>2&&!W){C?g():M(o[0]);return}if(b>2&&W&&o&&t){M(o[t.length-1]);return}let oe=o==null?void 0:o.reduce(($,_)=>typeof $!="number"||typeof _!="number"?$:Math.abs(_-L)<Math.abs($-L)?_:$);if(b>pe&&Math.abs(v)<window.innerHeight*.4){let $=W?1:-1;if($>0&&E){M(o[t.length-1]);return}if(B&&$<0&&C&&g(),u===null)return;M(o[u+$]);return}M(oe)}function U({draggedDistance:v}){if(A===null)return;let g=A-v;h(r.current,{transform:`translate3d(0, ${g}px, 0)`})}function S(v,g){if(!t||typeof u!="number"||!o||i===void 0)return null;let b=u===i-1;if(u>=i&&g)return 0;if(b&&!g)return 1;if(!T&&!b)return null;let L=b?u+1:u-1,P=b?o[L]-o[L-1]:o[L+1]-o[L],B=v/Math.abs(P);return b?1-B:B}return{isLastSnapPoint:E,activeSnapPoint:w,shouldFade:T,getPercentageDragged:S,setActiveSnapPoint:D,activeSnapPointIndex:u,onRelease:N,onDrag:U,snapPointsOffset:o}}var Ot=.25,At=100,Xe=8,z=16,Ge=26,Je="vaul-dragging";function Qe({open:e,onOpenChange:n,children:t,shouldScaleBackground:r,onDrag:a,onRelease:i,snapPoints:l,nested:w,closeThreshold:D=Ot,scrollLockTimeout:E=At,dismissible:T=!0,fadeFromIndex:u=l&&l.length-1,activeSnapPoint:o,setActiveSnapPoint:A,fixed:M,modal:N=!0,onClose:U}){var Pe;let[S=!1,v]=d.default.useState(!1),[g,b]=d.default.useState(!1),[C,L]=d.default.useState(!1),[P,B]=d.default.useState(!1),[W,oe]=d.default.useState(!1),[$,_]=d.default.useState(!1),j=d.default.useRef(null),ie=d.default.useRef(null),ge=d.default.useRef(null),Le=d.default.useRef(null),X=d.default.useRef(null),G=d.default.useRef(!1),be=d.default.useRef(null),ve=d.default.useRef(0),q=d.default.useRef(!1),Ce=d.default.useRef(0),f=d.default.useRef(null),Oe=d.default.useRef(((Pe=f.current)==null?void 0:Pe.getBoundingClientRect().height)||0),he=d.default.useRef(0),tt=d.default.useCallback(s=>{l&&s===Q.length-1&&(ie.current=new Date)},[]),{activeSnapPoint:nt,activeSnapPointIndex:J,setActiveSnapPoint:Ae,onRelease:rt,snapPointsOffset:Q,onDrag:ot,shouldFade:$e,getPercentageDragged:it}=Ke({snapPoints:l,activeSnapPointProp:o,setActiveSnapPointProp:A,drawerRef:f,fadeFromIndex:u,overlayRef:j,onSnapPointChange:tt});je({isDisabled:!S||W||!N||$||!g});let{restorePositionSetting:at}=ke({isOpen:S,modal:N,nested:w,hasBeenOpened:g});function ae(){return(window.innerWidth-Ge)/window.innerWidth}function lt(s){var c;!T&&!l||f.current&&!f.current.contains(s.target)||(Oe.current=((c=f.current)==null?void 0:c.getBoundingClientRect().height)||0,oe(!0),ge.current=new Date,xe()&&window.addEventListener("touchend",()=>G.current=!1,{once:!0}),s.target.setPointerCapture(s.pointerId),ve.current=s.screenY)}function Ie(s,c){var O;let m=s,R=(O=window.getSelection())==null?void 0:O.toString(),x=f.current?re(f.current):null,y=new Date;if(ie.current&&y.getTime()-ie.current.getTime()<500)return!1;if(x>0)return!0;if(R&&R.length>0)return!1;if(X.current&&y.getTime()-X.current.getTime()<E&&x===0||c)return X.current=y,!1;for(;m;){if(m.scrollHeight>m.clientHeight){if(m.scrollTop!==0)return X.current=new Date,!1;if(m.getAttribute("role")==="dialog")return!0}m=m.parentNode}return!0}function st(s){if(W){let c=ve.current-s.screenY,m=c>0;if(l&&J===0&&!T||!G.current&&!Ie(s.target,m))return;if(f.current.classList.add(Je),G.current=!0,h(f.current,{transition:"none"}),h(j.current,{transition:"none"}),l&&ot({draggedDistance:c}),m&&!l){let I=Be(c);h(f.current,{transform:`translate3d(0, ${Math.min(I*-1,0)}px, 0)`});return}let R=Math.abs(c),x=document.querySelector("[vaul-drawer-wrapper]"),y=R/Oe.current,O=it(R,m);O!==null&&(y=O);let we=1-y;if(($e||u&&J===u-1)&&(a==null||a(s,y),h(j.current,{opacity:`${we}`,transition:"none"},!0)),x&&j.current&&r){let I=Math.min(ae()+y*(1-ae()),1),se=8-y*8,mt=Math.max(0,14-y*14);h(x,{borderRadius:`${se}px`,transform:`scale(${I}) translate3d(0, ${mt}px, 0)`,transition:"none"},!0)}l||h(f.current,{transform:`translate3d(0, ${R}px, 0)`})}}d.default.useEffect(()=>()=>{le(!1),at()},[]),d.default.useEffect(()=>{var c;function s(){var R;if(!f.current)return;let m=document.activeElement;if(ee(m)||q.current){let x=((R=window.visualViewport)==null?void 0:R.height)||0,y=window.innerHeight-x,O=f.current.getBoundingClientRect().height||0;he.current||(he.current=O);let we=f.current.getBoundingClientRect().top;if(Math.abs(Ce.current-y)>60&&(q.current=!q.current),l&&l.length>0&&Q&&J){let I=Q[J]||0;y+=I}if(Ce.current=y,O>x||q.current){let I=f.current.getBoundingClientRect().height,se=I;I>x&&(se=x-Ge),M?f.current.style.height=`${I-Math.max(y,0)}px`:f.current.style.height=`${Math.max(se,x-we)}px`}else f.current.style.height=`${he.current}px`;l&&l.length>0&&!q.current?f.current.style.bottom="0px":f.current.style.bottom=`${Math.max(y,0)}px`}}return(c=window.visualViewport)==null||c.addEventListener("resize",s),()=>{var m;return(m=window.visualViewport)==null?void 0:m.removeEventListener("resize",s)}},[J,l,Q]);function K(){f.current&&(U==null||U(),h(f.current,{transform:"translate3d(0, 100%, 0)",transition:`transform ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`}),h(j.current,{opacity:"0",transition:`opacity ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`}),le(!1),setTimeout(()=>{L(!1),v(!1)},300),setTimeout(()=>{l&&Ae(l[0])},p.DURATION*1e3))}d.default.useEffect(()=>{if(!S&&r){let s=setTimeout(()=>{ne(document.body)},200);return()=>clearTimeout(s)}},[S,r]),d.default.useEffect(()=>{e?(v(!0),b(!0)):K()},[e]),d.default.useEffect(()=>{P&&(n==null||n(S))},[S]),d.default.useEffect(()=>{B(!0)},[]);function Ne(){if(!f.current)return;let s=document.querySelector("[vaul-drawer-wrapper]"),c=re(f.current);h(f.current,{transform:"translate3d(0, 0, 0)",transition:`transform ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`}),h(j.current,{transition:`opacity ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`,opacity:"1"}),r&&c&&c>0&&S&&h(s,{borderRadius:`${Xe}px`,overflow:"hidden",transform:`scale(${ae()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`,transformOrigin:"top",transitionProperty:"transform, border-radius",transitionDuration:`${p.DURATION}s`,transitionTimingFunction:`cubic-bezier(${p.EASE.join(",")})`},!0)}function ut(s){var O;if(!W||!f.current)return;G.current&&ee(s.target)&&s.target.blur(),f.current.classList.remove(Je),G.current=!1,oe(!1),Le.current=new Date;let c=re(f.current);if(!Ie(s.target,!1)||!c||Number.isNaN(c)||ge.current===null)return;let m=Le.current.getTime()-ge.current.getTime(),R=ve.current-s.screenY,x=Math.abs(R)/m;if(x>.05&&(_(!0),setTimeout(()=>{_(!1)},200)),l){rt({draggedDistance:R,closeDrawer:K,velocity:x,dismissible:T}),i==null||i(s,!0);return}if(R>0){Ne(),i==null||i(s,!0);return}if(x>pe){K(),i==null||i(s,!1);return}let y=Math.min((O=f.current.getBoundingClientRect().height)!=null?O:0,window.innerHeight);if(c>=y*D){K(),i==null||i(s,!1);return}i==null||i(s,!0),Ne()}d.default.useEffect(()=>{S&&(ie.current=new Date,le(!0))},[S]),d.default.useEffect(()=>{C&&f.current.querySelectorAll("*").forEach(c=>{let m=c;(m.scrollHeight>m.clientHeight||m.scrollWidth>m.clientWidth)&&m.classList.add("vaul-scrollable")})},[C]);function le(s){let c=document.querySelector("[vaul-drawer-wrapper]");!c||!r||(s?(h(document.body,{background:"black"},!0),h(c,{borderRadius:`${Xe}px`,overflow:"hidden",transform:`scale(${ae()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`,transformOrigin:"top",transitionProperty:"transform, border-radius",transitionDuration:`${p.DURATION}s`,transitionTimingFunction:`cubic-bezier(${p.EASE.join(",")})`})):(ne(c,"overflow"),ne(c,"transform"),ne(c,"borderRadius"),h(c,{transitionProperty:"transform, border-radius",transitionDuration:`${p.DURATION}s`,transitionTimingFunction:`cubic-bezier(${p.EASE.join(",")})`})))}function ct(s){let c=s?(window.innerWidth-z)/window.innerWidth:1,m=s?-z:0;be.current&&window.clearTimeout(be.current),h(f.current,{transition:`transform ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`,transform:`scale(${c}) translate3d(0, ${m}px, 0)`}),!s&&f.current&&(be.current=setTimeout(()=>{h(f.current,{transition:"none",transform:`translate3d(0, ${re(f.current)}px, 0)`})},500))}function ft(s,c){if(c<0)return;let m=(window.innerWidth-z)/window.innerWidth,R=m+c*(1-m),x=-z+c*z;h(f.current,{transform:`scale(${R}) translate3d(0, ${x}px, 0)`,transition:"none"})}function dt(s,c){let m=c?(window.innerWidth-z)/window.innerWidth:1,R=c?-z:0;c&&h(f.current,{transition:`transform ${p.DURATION}s cubic-bezier(${p.EASE.join(",")})`,transform:`scale(${m}) translate3d(0, ${R}px, 0)`})}return d.default.createElement(H.Root,{modal:N,onOpenChange:s=>{if(e!==void 0){n==null||n(s);return}s?(b(!0),v(s)):K()},open:S},d.default.createElement(Te.Provider,{value:{visible:C,activeSnapPoint:nt,snapPoints:l,setActiveSnapPoint:Ae,drawerRef:f,overlayRef:j,scaleBackground:le,onOpenChange:n,onPress:lt,setVisible:L,onRelease:ut,onDrag:st,dismissible:T,isOpen:S,shouldFade:$e,closeDrawer:K,onNestedDrag:ft,onNestedOpenChange:ct,onNestedRelease:dt,keyboardIsOpen:q,openProp:e,modal:N,snapPointsOffset:Q}},t))}var Ze=d.default.forwardRef(function({children:e,...n},t){let{overlayRef:r,snapPoints:a,onRelease:i,shouldFade:l,isOpen:w,visible:D}=ce(),E=Me(t,r),T=a&&a.length>0;return d.default.createElement(H.Overlay,{onMouseUp:i,ref:E,"vaul-drawer-visible":D?"true":"false","vaul-overlay":"","vaul-snap-points":w&&T?"true":"false","vaul-snap-points-overlay":w&&l?"true":"false",...n})});Ze.displayName="Drawer.Overlay";var et=d.default.forwardRef(function({onOpenAutoFocus:e,onPointerDownOutside:n,onAnimationEnd:t,style:r,...a},i){let{drawerRef:l,onPress:w,onRelease:D,onDrag:E,dismissible:T,keyboardIsOpen:u,snapPointsOffset:o,visible:A,closeDrawer:M,modal:N,openProp:U,onOpenChange:S,setVisible:v}=ce(),g=Me(i,l);return d.default.useEffect(()=>{v(!0)},[]),d.default.createElement(H.Content,{onOpenAutoFocus:b=>{e?e(b):(b.preventDefault(),l.current.focus())},onPointerDown:w,onPointerDownOutside:b=>{if(n==null||n(b),!N){b.preventDefault();return}u.current&&(u.current=!1),b.preventDefault(),S==null||S(!1),!(!T||U!==void 0)&&M()},onPointerMove:E,onPointerUp:D,ref:g,style:o&&o.length>0?{"--snap-point-height":`${o[0]}px`,...r}:r,...a,"vaul-drawer":"","vaul-drawer-visible":A?"true":"false"})});et.displayName="Drawer.Content";function $t({onDrag:e,onOpenChange:n,...t}){let{onNestedDrag:r,onNestedOpenChange:a,onNestedRelease:i}=ce();if(!r)throw new Error("Drawer.NestedRoot must be placed in another drawer");return d.default.createElement(Qe,{nested:!0,onClose:()=>{a(!1)},onDrag:(l,w)=>{r(l,w),e==null||e(l,w)},onOpenChange:l=>{l&&a(l),n==null||n(l)},onRelease:i,...t})}var It={Root:Qe,NestedRoot:$t,Content:et,Overlay:Ze,Trigger:H.Trigger,Portal:H.Portal,Close:H.Close,Title:H.Title,Description:H.Description};0&&(module.exports={Drawer});
"use client";var wt=Object.create;var me=Object.defineProperty;var ht=Object.getOwnPropertyDescriptor;var Et=Object.getOwnPropertyNames;var Tt=Object.getPrototypeOf,yt=Object.prototype.hasOwnProperty;var Dt=(e,n)=>{for(var t in n)me(e,t,{get:n[t],enumerable:!0})},je=(e,n,t,r)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of Et(n))!yt.call(e,i)&&i!==t&&me(e,i,{get:()=>n[i],enumerable:!(r=ht(n,i))||r.enumerable});return e};var z=(e,n,t)=>(t=e!=null?wt(Tt(e)):{},je(n||!e||!e.__esModule?me(t,"default",{value:e,enumerable:!0}):t,e)),St=e=>je(me({},"__esModule",{value:!0}),e);var Ft={};Dt(Ft,{Drawer:()=>Wt});module.exports=St(Ft);var L=z(require("@radix-ui/react-dialog")),m=z(require("react"));var De=z(require("react")),Se=De.default.createContext({drawerRef:{current:null},overlayRef:{current:null},scaleBackground:()=>{},onPress:()=>{},onRelease:()=>{},onDrag:()=>{},onNestedDrag:()=>{},onNestedOpenChange:()=>{},onNestedRelease:()=>{},openProp:void 0,dismissible:!1,isOpen:!1,keyboardIsOpen:{current:!1},snapPointsOffset:null,snapPoints:null,modal:!1,shouldFade:!1,activeSnapPoint:null,onOpenChange:()=>{},setActiveSnapPoint:()=>{},visible:!1,closeDrawer:()=>{},setVisible:()=>{},direction:"bottom"}),ge=()=>De.default.useContext(Se);function Re(e,{insertAt:n}={}){if(!e||typeof document=="undefined")return;let t=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css",n==="top"&&t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}Re(`[vaul-drawer]{touch-action:none;transition:transform .5s cubic-bezier(.32,.72,0,1)}[vaul-drawer][vaul-drawer-direction=bottom]{transform:translate3d(0,100%,0)}[vaul-drawer][vaul-drawer-direction=top]{transform:translate3d(0,-100%,0)}[vaul-drawer][vaul-drawer-direction=left]{transform:translate3d(-100%,0,0)}[vaul-drawer][vaul-drawer-direction=right]{transform:translate3d(100%,0,0)}.vaul-dragging .vaul-scrollable [vault-drawer-direction=top],.vaul-dragging .vaul-scrollable [vault-drawer-direction=bottom]{overflow-y:hidden!important}.vaul-dragging .vaul-scrollable [vault-drawer-direction=left],.vaul-dragging .vaul-scrollable [vault-drawer-direction=right]{overflow-x:hidden!important}[vaul-drawer][vaul-drawer-visible=true][vaul-drawer-direction=top],[vaul-drawer][vaul-drawer-visible=true][vaul-drawer-direction=bottom]{transform:translate3d(0,var(--snap-point-height, 0),0)}[vaul-drawer][vaul-drawer-visible=true][vaul-drawer-direction=left],[vaul-drawer][vaul-drawer-visible=true][vaul-drawer-direction=right]{transform:translate3d(var(--snap-point-height, 0),0,0)}[vaul-overlay]{opacity:0;transition:opacity .5s cubic-bezier(.32,.72,0,1)}[vaul-overlay][vaul-drawer-visible=true]{opacity:1}[vaul-drawer]:after{content:"";position:absolute;background:inherit;background-color:inherit}[vaul-drawer][vaul-drawer-direction=top]:after{top:initial;bottom:100%;left:0;right:0;height:200%}[vaul-drawer][vaul-drawer-direction=bottom]:after{top:100%;bottom:initial;left:0;right:0;height:200%}[vaul-drawer][vaul-drawer-direction=left]:after{left:initial;right:100%;top:0;bottom:0;width:200%}[vaul-drawer][vaul-drawer-direction=right]:after{left:100%;right:initial;top:0;bottom:0;width:200%}[vaul-overlay][vaul-snap-points=true]:not([vaul-snap-points-overlay="true"]):not([data-state="closed"]){opacity:0}[vaul-overlay][vaul-snap-points-overlay=true]:not([vaul-drawer-visible="false"]){opacity:1}@keyframes fake-animation{}@media (hover: hover) and (pointer: fine){[vaul-drawer]{user-select:none}}
`);var ve=require("react"),Rt=typeof window!="undefined"?ve.useLayoutEffect:ve.useEffect;function Me(...e){return(...n)=>{for(let t of e)typeof t=="function"&&t(...n)}}function xt(){return Le(/^Mac/)}function Ht(){return Le(/^iPhone/)}function Mt(){return Le(/^iPad/)||xt()&&navigator.maxTouchPoints>1}function $e(){return Ht()||Mt()}function Le(e){return typeof window!="undefined"&&window.navigator!=null?e.test(window.navigator.platform):void 0}var xe=typeof document!="undefined"&&window.visualViewport;function ke(e){let n=window.getComputedStyle(e);return/(auto|scroll)/.test(n.overflow+n.overflowX+n.overflowY)}function ze(e){for(ke(e)&&(e=e.parentElement);e&&!ke(e);)e=e.parentElement;return e||document.scrollingElement||document.documentElement}var $t=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]),be=0,He;function Ye(e={}){let{isDisabled:n}=e;Rt(()=>{if(!n)return be++,be===1&&($e()?He=Ct():He=Lt()),()=>{be--,be===0&&He()}},[n])}function Lt(){return Me(_e(document.documentElement,"paddingRight",`${window.innerWidth-document.documentElement.clientWidth}px`))}function Ct(){let e,n=0,t=h=>{e=ze(h.target),!(e===document.documentElement&&e===document.body)&&(n=h.changedTouches[0].pageY)},r=h=>{if(!e||e===document.documentElement||e===document.body){h.preventDefault();return}let d=h.changedTouches[0].pageY,u=e.scrollTop,$=e.scrollHeight-e.clientHeight;$!==0&&((u<=0&&d>n||u>=$&&d<n)&&h.preventDefault(),n=d)},i=h=>{let d=h.target;pe(d)&&d!==document.activeElement&&(h.preventDefault(),d.style.transform="translateY(-2000px)",d.focus(),requestAnimationFrame(()=>{d.style.transform=""}))},o=h=>{let d=h.target;pe(d)&&(d.style.transform="translateY(-2000px)",requestAnimationFrame(()=>{d.style.transform="",xe&&(xe.height<window.innerHeight?requestAnimationFrame(()=>{Be(d)}):xe.addEventListener("resize",()=>Be(d),{once:!0}))}))},s=()=>{window.scrollTo(0,0)},b=window.pageXOffset,H=window.pageYOffset,x=Me(_e(document.documentElement,"paddingRight",`${window.innerWidth-document.documentElement.clientWidth}px`));window.scrollTo(0,0);let S=Me(ie(document,"touchstart",t,{passive:!1,capture:!0}),ie(document,"touchmove",r,{passive:!1,capture:!0}),ie(document,"touchend",i,{passive:!1,capture:!0}),ie(document,"focus",o,!0),ie(window,"scroll",s));return()=>{x(),S(),window.scrollTo(b,H)}}function _e(e,n,t){let r=e.style[n];return e.style[n]=t,()=>{e.style[n]=r}}function ie(e,n,t,r){return e.addEventListener(n,t,r),()=>{e.removeEventListener(n,t,r)}}function Be(e){let n=document.scrollingElement||document.documentElement;for(;e&&e!==n;){let t=ze(e);if(t!==document.documentElement&&t!==document.body&&t!==e){let r=t.getBoundingClientRect().top,i=e.getBoundingClientRect().top,o=e.getBoundingClientRect().bottom,s=t.getBoundingClientRect().bottom;o>s&&(t.scrollTop+=i-r)}e=t.parentElement}}function pe(e){return e instanceof HTMLInputElement&&!$t.has(e.type)||e instanceof HTMLTextAreaElement||e instanceof HTMLElement&&e.isContentEditable}var qe=z(require("react"));function At(e,n){typeof e=="function"?e(n):e!=null&&(e.current=n)}function Ot(...e){return n=>e.forEach(t=>At(t,n))}function Ce(...e){return qe.useCallback(Ot(...e),e)}var Y=z(require("react")),F=null;function Xe({isOpen:e,modal:n,nested:t,hasBeenOpened:r,preventScrollRestoration:i}){let[o,s]=Y.default.useState(typeof window!="undefined"?window.location.href:""),b=Y.default.useRef(0),H=Y.default.useCallback(()=>{if(F===null&&e){F={position:document.body.style.position,top:document.body.style.top,left:document.body.style.left,height:document.body.style.height};let{scrollX:S,innerHeight:h}=window;document.body.style.setProperty("position","fixed","important"),document.body.style.top=`${-b.current}px`,document.body.style.left=`${-S}px`,document.body.style.right="0px",document.body.style.height="auto",setTimeout(()=>requestAnimationFrame(()=>{let d=h-window.innerHeight;d&&b.current>=h&&(document.body.style.top=`${-(b.current+d)}px`)}),300)}},[e]),x=Y.default.useCallback(()=>{if(F!==null){let S=-parseInt(document.body.style.top,10),h=-parseInt(document.body.style.left,10);document.body.style.position=F.position,document.body.style.top=F.top,document.body.style.left=F.left,document.body.style.height=F.height,document.body.style.right="unset",requestAnimationFrame(()=>{if(i&&o!==window.location.href){s(window.location.href);return}window.scrollTo(h,S)}),F=null}},[o]);return Y.default.useEffect(()=>{function S(){b.current=window.scrollY}return S(),window.addEventListener("scroll",S),()=>{window.removeEventListener("scroll",S)}},[]),Y.default.useEffect(()=>{t||!r||(e?(H(),n||setTimeout(()=>{x()},500)):x())},[e,r,o,n,t,H,x]),{restorePositionSetting:x}}var _=z(require("react"));var Ke=new WeakMap;function y(e,n,t=!1){if(!e||!(e instanceof HTMLElement)||!n)return;let r={};Object.entries(n).forEach(([i,o])=>{if(i.startsWith("--")){e.style.setProperty(i,o);return}r[i]=e.style[i],e.style[i]=o}),!t&&Ke.set(e,r)}function ae(e,n){if(!e||!(e instanceof HTMLElement))return;let t=Ke.get(e);t&&(n?e.style[n]=t[n]:Object.entries(t).forEach(([r,i])=>{e.style[r]=i}))}var R=e=>{switch(e){case"top":case"bottom":return!0;case"left":case"right":return!1;default:return e}};function le(e,n){let t=window.getComputedStyle(e),r=t.transform||t.webkitTransform||t.mozTransform,i=r.match(/^matrix3d\((.+)\)$/);return i?parseFloat(i[1].split(", ")[R(n)?13:12]):(i=r.match(/^matrix\((.+)\)$/),i?parseFloat(i[1].split(", ")[R(n)?5:4]):null)}function Ge(e){return 8*(Math.log(e+1)-2)}var T={DURATION:.5,EASE:[.32,.72,0,1]},we=.4;var U=z(require("react"));function Je(e){let n=U.default.useRef(e);return U.default.useEffect(()=>{n.current=e}),U.default.useMemo(()=>(...t)=>{var r;return(r=n.current)==null?void 0:r.call(n,...t)},[])}function It({defaultProp:e,onChange:n}){let t=U.default.useState(e),[r]=t,i=U.default.useRef(r),o=Je(n);return U.default.useEffect(()=>{i.current!==r&&(o(r),i.current=r)},[r,i,o]),t}function Qe({prop:e,defaultProp:n,onChange:t=()=>{}}){let[r,i]=It({defaultProp:n,onChange:t}),o=e!==void 0,s=o?e:r,b=Je(t),H=U.default.useCallback(x=>{if(o){let h=typeof x=="function"?x(e):x;h!==e&&b(h)}else i(x)},[o,e,i,b]);return[s,H]}function Ze({activeSnapPointProp:e,setActiveSnapPointProp:n,snapPoints:t,drawerRef:r,overlayRef:i,fadeFromIndex:o,onSnapPointChange:s,direction:b="bottom"}){let[H,x]=Qe({prop:e,defaultProp:t==null?void 0:t[0],onChange:n}),S=_.default.useMemo(()=>H===(t==null?void 0:t[t.length-1])||null,[t,H]),h=t&&t.length>0&&(o||o===0)&&!Number.isNaN(o)&&t[o]===H||!t,d=_.default.useMemo(()=>t==null?void 0:t.findIndex(g=>g===H),[t,H]),u=_.default.useMemo(()=>{var g;return(g=t==null?void 0:t.map(p=>{let v=typeof window!="undefined",C=typeof p=="string",A=0;if(C&&(A=parseInt(p,10)),R(b)){let P=C?A:v?p*window.innerHeight:0;return v?b==="bottom"?window.innerHeight-P:-window.innerHeight+P:P}let N=C?A:v?p*window.innerWidth:0;return v?b==="right"?window.innerWidth-N:-window.innerWidth+N:N}))!=null?g:[]},[t]),$=_.default.useMemo(()=>d!==null?u==null?void 0:u[d]:null,[u,d]),I=_.default.useCallback(g=>{var v;let p=(v=u==null?void 0:u.findIndex(C=>C===g))!=null?v:null;s(p),y(r.current,{transition:`transform ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`,transform:R(b)?`translate3d(0, ${g}px, 0)`:`translate3d(${g}px, 0, 0)`}),u&&p!==u.length-1&&p!==o?y(i.current,{transition:`opacity ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`,opacity:"0"}):y(i.current,{transition:`opacity ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`,opacity:"1"}),x(p!==null?t==null?void 0:t[p]:null)},[r.current,t,u,o,i,x]);_.default.useEffect(()=>{var g;if(e){let p=(g=t==null?void 0:t.findIndex(v=>v===e))!=null?g:-1;u&&p!==-1&&typeof u[p]=="number"&&I(u[p])}},[e,t,u,I]);function j({draggedDistance:g,closeDrawer:p,velocity:v,dismissible:C}){if(o===void 0)return;let A=b==="bottom"||b==="right"?($!=null?$:0)-g:($!=null?$:0)+g,N=d===o-1,P=d===0,Z=g>0;if(N&&y(i.current,{transition:`opacity ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`}),v>2&&!Z){C?p():I(u[0]);return}if(v>2&&Z&&u&&t){I(u[t.length-1]);return}let ee=u==null?void 0:u.reduce((V,X)=>typeof V!="number"||typeof X!="number"?V:Math.abs(X-A)<Math.abs(V-A)?X:V),se=R(b)?window.innerHeight:window.innerWidth;if(v>we&&Math.abs(g)<se*.4){let V=Z?1:-1;if(V>0&&S){I(u[t.length-1]);return}if(P&&V<0&&C&&p(),d===null)return;I(u[d+V]);return}I(ee)}function f({draggedDistance:g}){if($===null)return;let p=b==="bottom"||b==="right"?$-g:$+g;(b==="bottom"||b==="right")&&p<u[u.length-1]||(b==="top"||b==="left")&&p>u[u.length-1]||y(r.current,{transform:R(b)?`translate3d(0, ${p}px, 0)`:`translate3d(${p}px, 0, 0)`})}function Q(g,p){if(!t||typeof d!="number"||!u||o===void 0)return null;let v=d===o-1;if(d>=o&&p)return 0;if(v&&!p)return 1;if(!h&&!v)return null;let A=v?d+1:d-1,N=v?u[A]-u[A-1]:u[A+1]-u[A],P=g/Math.abs(N);return v?1-P:P}return{isLastSnapPoint:S,activeSnapPoint:H,shouldFade:h,getPercentageDragged:Q,setActiveSnapPoint:x,activeSnapPointIndex:d,onRelease:j,onDrag:f,snapPointsOffset:u}}var Nt=.25,Pt=100,et=8,q=16,tt=26,nt="vaul-dragging";function rt({open:e,onOpenChange:n,children:t,shouldScaleBackground:r,onDrag:i,onRelease:o,snapPoints:s,nested:b=!1,closeThreshold:H=Nt,scrollLockTimeout:x=Pt,dismissible:S=!0,fadeFromIndex:h=s&&s.length-1,activeSnapPoint:d,setActiveSnapPoint:u,fixed:$,modal:I=!0,onClose:j,direction:f="bottom",preventScrollRestoration:Q=!0}){var Fe;let[g=!1,p]=m.default.useState(!1),[v,C]=m.default.useState(!1),[A,N]=m.default.useState(!1),[P,Z]=m.default.useState(!1),[ee,se]=m.default.useState(!1),[V,X]=m.default.useState(!1),k=m.default.useRef(null),ue=m.default.useRef(null),he=m.default.useRef(null),Ae=m.default.useRef(null),te=m.default.useRef(null),ce=m.default.useRef(!1),Ee=m.default.useRef(null),Te=m.default.useRef(0),K=m.default.useRef(!1),Oe=m.default.useRef(0),l=m.default.useRef(null),Ie=m.default.useRef(((Fe=l.current)==null?void 0:Fe.getBoundingClientRect().height)||0),ye=m.default.useRef(0),at=m.default.useCallback(a=>{s&&a===re.length-1&&(ue.current=new Date)},[]),{activeSnapPoint:lt,activeSnapPointIndex:ne,setActiveSnapPoint:Ne,onRelease:st,snapPointsOffset:re,onDrag:ut,shouldFade:Pe,getPercentageDragged:ct}=Ze({snapPoints:s,activeSnapPointProp:d,setActiveSnapPointProp:u,drawerRef:l,fadeFromIndex:h,overlayRef:k,onSnapPointChange:at,direction:f});Ye({isDisabled:!g||ee||!I||V||!v});let{restorePositionSetting:dt}=Xe({isOpen:g,modal:I,nested:b,hasBeenOpened:v,preventScrollRestoration:Q});function G(){return(window.innerWidth-tt)/window.innerWidth}function ft(a){var c;!S&&!s||l.current&&!l.current.contains(a.target)||(Ie.current=((c=l.current)==null?void 0:c.getBoundingClientRect().height)||0,se(!0),he.current=new Date,$e()&&window.addEventListener("touchend",()=>ce.current=!1,{once:!0}),a.target.setPointerCapture(a.pointerId),Te.current=R(f)?a.screenY:a.screenX)}function Ve(a,c){var O;let w=a,E=(O=window.getSelection())==null?void 0:O.toString(),D=l.current?le(l.current,f):null,M=new Date;if(w.hasAttribute("data-vaul-no-drag"))return!1;if(f==="right"||f==="left")return!0;if(ue.current&&M.getTime()-ue.current.getTime()<500)return!1;if(D!==null&&(f==="bottom"?D>0:D<0))return!0;if(E&&E.length>0)return!1;if(te.current&&M.getTime()-te.current.getTime()<x&&D===0||c)return te.current=M,!1;for(;w;){if(w.scrollHeight>w.clientHeight){if(w.scrollTop!==0)return te.current=new Date,!1;if(w.getAttribute("role")==="dialog")return!0}w=w.parentNode}return!0}function mt(a){if(l.current&&ee){let c=f==="bottom"||f==="right"?1:-1,w=(Te.current-(R(f)?a.screenY:a.screenX))*c,E=w>0;if(s&&ne===0&&!S||!ce.current&&!Ve(a.target,E))return;if(l.current.classList.add(nt),ce.current=!0,y(l.current,{transition:"none"}),y(k.current,{transition:"none"}),s&&ut({draggedDistance:w}),E&&!s){let W=Ge(w),fe=Math.min(W*-1,0)*c;y(l.current,{transform:R(f)?`translate3d(0, ${fe}px, 0)`:`translate3d(${fe}px, 0, 0)`});return}let D=Math.abs(w),M=document.querySelector("[vaul-drawer-wrapper]"),O=D/Ie.current,oe=ct(D,E);oe!==null&&(O=oe);let B=1-O;if((Pe||h&&ne===h-1)&&(i==null||i(a,O),y(k.current,{opacity:`${B}`,transition:"none"},!0)),M&&k.current&&r){let W=Math.min(G()+O*(1-G()),1),fe=8-O*8,Ue=Math.max(0,14-O*14);y(M,{borderRadius:`${fe}px`,transform:R(f)?`scale(${W}) translate3d(0, ${Ue}px, 0)`:`scale(${W}) translate3d(${Ue}px, 0, 0)`,transition:"none"},!0)}if(!s){let W=D*c;y(l.current,{transform:R(f)?`translate3d(0, ${W}px, 0)`:`translate3d(${W}px, 0, 0)`})}}}m.default.useEffect(()=>()=>{de(!1),dt()},[]),m.default.useEffect(()=>{var c;function a(){var E;if(!l.current)return;let w=document.activeElement;if(pe(w)||K.current){let D=((E=window.visualViewport)==null?void 0:E.height)||0,M=window.innerHeight-D,O=l.current.getBoundingClientRect().height||0;ye.current||(ye.current=O);let oe=l.current.getBoundingClientRect().top;if(Math.abs(Oe.current-M)>60&&(K.current=!K.current),s&&s.length>0&&re&&ne){let B=re[ne]||0;M+=B}if(Oe.current=M,O>D||K.current){let B=l.current.getBoundingClientRect().height,W=B;B>D&&(W=D-tt),$?l.current.style.height=`${B-Math.max(M,0)}px`:l.current.style.height=`${Math.max(W,D-oe)}px`}else l.current.style.height=`${ye.current}px`;s&&s.length>0&&!K.current?l.current.style.bottom="0px":l.current.style.bottom=`${Math.max(M,0)}px`}}return(c=window.visualViewport)==null||c.addEventListener("resize",a),()=>{var w;return(w=window.visualViewport)==null?void 0:w.removeEventListener("resize",a)}},[ne,s,re]);function J(){l.current&&(j==null||j(),y(l.current,{transform:R(f)?`translate3d(0, ${f==="bottom"?"100%":"-100%"}, 0)`:`translate3d(${f==="right"?"100%":"-100%"}, 0, 0)`,transition:`transform ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`}),y(k.current,{opacity:"0",transition:`opacity ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`}),de(!1),setTimeout(()=>{N(!1),p(!1)},300),setTimeout(()=>{s&&Ne(s[0])},T.DURATION*1e3))}m.default.useEffect(()=>{if(!g&&r){let a=setTimeout(()=>{ae(document.body)},200);return()=>clearTimeout(a)}},[g,r]),m.default.useEffect(()=>{e?(p(!0),C(!0)):J()},[e]),m.default.useEffect(()=>{P&&(n==null||n(g))},[g]),m.default.useEffect(()=>{Z(!0)},[]);function We(){if(!l.current)return;let a=document.querySelector("[vaul-drawer-wrapper]"),c=le(l.current,f);y(l.current,{transform:"translate3d(0, 0, 0)",transition:`transform ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`}),y(k.current,{transition:`opacity ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`,opacity:"1"}),r&&c&&c>0&&g&&y(a,{borderRadius:`${et}px`,overflow:"hidden",...R(f)?{transform:`scale(${G()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`,transformOrigin:"top"}:{transform:`scale(${G()}) translate3d(calc(env(safe-area-inset-top) + 14px), 0, 0)`,transformOrigin:"left"},transitionProperty:"transform, border-radius",transitionDuration:`${T.DURATION}s`,transitionTimingFunction:`cubic-bezier(${T.EASE.join(",")})`},!0)}function gt(a){var O;if(!ee||!l.current)return;l.current.classList.remove(nt),ce.current=!1,se(!1),Ae.current=new Date;let c=le(l.current,f);if(!Ve(a.target,!1)||!c||Number.isNaN(c)||he.current===null)return;let w=Ae.current.getTime()-he.current.getTime(),E=Te.current-(R(f)?a.screenY:a.screenX),D=Math.abs(E)/w;if(D>.05&&(X(!0),setTimeout(()=>{X(!1)},200)),s){st({draggedDistance:E*(f==="bottom"||f==="right"?1:-1),closeDrawer:J,velocity:D,dismissible:S}),o==null||o(a,!0);return}if(f==="bottom"||f==="right"?E>0:E<0){We(),o==null||o(a,!0);return}if(D>we){J(),o==null||o(a,!1);return}let M=Math.min((O=l.current.getBoundingClientRect().height)!=null?O:0,window.innerHeight);if(c>=M*H){J(),o==null||o(a,!1);return}o==null||o(a,!0),We()}m.default.useEffect(()=>{g&&(y(document.documentElement,{scrollBehavior:"auto"}),ue.current=new Date,de(!0))},[g]),m.default.useEffect(()=>{var a;if(l.current&&A){let c=(a=l==null?void 0:l.current)==null?void 0:a.querySelectorAll("*");c==null||c.forEach(w=>{let E=w;(E.scrollHeight>E.clientHeight||E.scrollWidth>E.clientWidth)&&E.classList.add("vaul-scrollable")})}},[A]);function de(a){let c=document.querySelector("[vaul-drawer-wrapper]");!c||!r||(a?(y(document.body,{background:document.body.style.backgroundColor||document.body.style.background}),y(document.body,{background:"black"},!0),y(c,{borderRadius:`${et}px`,overflow:"hidden",...R(f)?{transform:`scale(${G()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`,transformOrigin:"top"}:{transform:`scale(${G()}) translate3d(calc(env(safe-area-inset-top) + 14px), 0, 0)`,transformOrigin:"left"},transitionProperty:"transform, border-radius",transitionDuration:`${T.DURATION}s`,transitionTimingFunction:`cubic-bezier(${T.EASE.join(",")})`})):(ae(c,"overflow"),ae(c,"transform"),ae(c,"borderRadius"),y(c,{transitionProperty:"transform, border-radius",transitionDuration:`${T.DURATION}s`,transitionTimingFunction:`cubic-bezier(${T.EASE.join(",")})`})))}function bt(a){let c=a?(window.innerWidth-q)/window.innerWidth:1,w=a?-q:0;Ee.current&&window.clearTimeout(Ee.current),y(l.current,{transition:`transform ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`,transform:`scale(${c}) translate3d(0, ${w}px, 0)`}),!a&&l.current&&(Ee.current=setTimeout(()=>{let E=le(l.current,f);y(l.current,{transition:"none",transform:R(f)?`translate3d(0, ${E}px, 0)`:`translate3d(${E}px, 0, 0)`})},500))}function pt(a,c){if(c<0)return;let w=R(f)?window.innerHeight:window.innerWidth,E=(w-q)/w,D=E+c*(1-E),M=-q+c*q;y(l.current,{transform:R(f)?`scale(${D}) translate3d(0, ${M}px, 0)`:`scale(${D}) translate3d(${M}px, 0, 0)`,transition:"none"})}function vt(a,c){let w=R(f)?window.innerHeight:window.innerWidth,E=c?(w-q)/w:1,D=c?-q:0;c&&y(l.current,{transition:`transform ${T.DURATION}s cubic-bezier(${T.EASE.join(",")})`,transform:R(f)?`scale(${E}) translate3d(0, ${D}px, 0)`:`scale(${E}) translate3d(${D}px, 0, 0)`})}return m.default.createElement(L.Root,{modal:I,onOpenChange:a=>{if(e!==void 0){n==null||n(a);return}a?(C(!0),p(a)):J()},open:g},m.default.createElement(Se.Provider,{value:{visible:A,activeSnapPoint:lt,snapPoints:s,setActiveSnapPoint:Ne,drawerRef:l,overlayRef:k,scaleBackground:de,onOpenChange:n,onPress:ft,setVisible:N,onRelease:gt,onDrag:mt,dismissible:S,isOpen:g,shouldFade:Pe,closeDrawer:J,onNestedDrag:pt,onNestedOpenChange:bt,onNestedRelease:vt,keyboardIsOpen:K,openProp:e,modal:I,snapPointsOffset:re,direction:f}},t))}var ot=m.default.forwardRef(function({children:e,...n},t){let{overlayRef:r,snapPoints:i,onRelease:o,shouldFade:s,isOpen:b,visible:H}=ge(),x=Ce(t,r),S=i&&i.length>0;return m.default.createElement(L.Overlay,{onMouseUp:o,ref:x,"vaul-drawer-visible":H?"true":"false","vaul-overlay":"","vaul-snap-points":b&&S?"true":"false","vaul-snap-points-overlay":b&&s?"true":"false",...n})});ot.displayName="Drawer.Overlay";var it=m.default.forwardRef(function({onOpenAutoFocus:e,onPointerDownOutside:n,onAnimationEnd:t,style:r,...i},o){let{drawerRef:s,onPress:b,onRelease:H,onDrag:x,dismissible:S,keyboardIsOpen:h,snapPointsOffset:d,visible:u,closeDrawer:$,modal:I,openProp:j,onOpenChange:f,setVisible:Q,direction:g}=ge(),p=Ce(o,s);return m.default.useEffect(()=>{Q(!0)},[]),m.default.createElement(L.Content,{onOpenAutoFocus:v=>{var C;e?e(v):(v.preventDefault(),(C=s.current)==null||C.focus())},onPointerDown:b,onPointerDownOutside:v=>{if(n==null||n(v),!I||v.defaultPrevented){v.preventDefault();return}h.current&&(h.current=!1),v.preventDefault(),f==null||f(!1),!(!S||j!==void 0)&&$()},onPointerMove:x,onPointerUp:H,ref:p,style:d&&d.length>0?{"--snap-point-height":`${d[0]}px`,...r}:r,...i,"vaul-drawer":"","vaul-drawer-direction":g,"vaul-drawer-visible":u?"true":"false"})});it.displayName="Drawer.Content";function Vt({onDrag:e,onOpenChange:n,...t}){let{onNestedDrag:r,onNestedOpenChange:i,onNestedRelease:o}=ge();if(!r)throw new Error("Drawer.NestedRoot must be placed in another drawer");return m.default.createElement(rt,{nested:!0,onClose:()=>{i(!1)},onDrag:(s,b)=>{r(s,b),e==null||e(s,b)},onOpenChange:s=>{s&&i(s),n==null||n(s)},onRelease:o,...t})}var Wt={Root:rt,NestedRoot:Vt,Content:it,Overlay:ot,Trigger:L.Trigger,Portal:L.Portal,Close:L.Close,Title:L.Title,Description:L.Description};0&&(module.exports={Drawer});
//# sourceMappingURL=index.js.map
{
"name": "vaul",
"version": "0.8.0",
"version": "0.8.1",
"description": "Drawer component for React.",

@@ -5,0 +5,0 @@ "main": "dist/index.js",

https://github.com/emilkowalski/vaul/assets/36730035/fdf8c5e8-ade8-433b-8bb0-4ce10e722516
Vaul is an unstyled drawer component for React that can be used as a Dialog replacement on tablet and mobile devices. It uses [Radix's Dialog primitive](https://www.radix-ui.com/docs/primitives/components/dialog#trigger) under the hood and is inspired by [this tweet](https://twitter.com/devongovett/status/1674470185783402496).
Vaul is an unstyled drawer component for React that can be used as a Dialog replacement on tablet and mobile devices. You can read about why and how it was built [here](https://emilkowal.ski/ui/building-a-drawer-component).
## Usage
To start using the library, install it in your project:
To start using the library, install it in your project:,

@@ -41,2 +41,3 @@ ```bash

- [Scrollable with inputs](https://codesandbox.io/p/sandbox/drawer-with-scale-forked-73f8jw?file=%2Fapp%2Fmy-drawer.tsx%3A1%2C1)
- [Drawer from right instead of bottom](https://codesandbox.io/p/devbox/drawer-direction-right-n338ml?file=%2Fapp%2Fmy-drawer.tsx%3A47%2C2)
- [Nested drawers](https://codesandbox.io/p/sandbox/drawer-non-dismissable-forked-5z2r3j?file=%2Fapp%2Fmy-drawer.tsx%3A49%2C16-49%2C246)

@@ -50,3 +51,3 @@ - [Non-dismissible](https://codesandbox.io/p/sandbox/drawer-without-scale-forked-kxh9j5?file=%2Fapp%2Fmy-drawer.tsx%3A1%2C1)

Contains all parts of a dialog. Use `shouldScaleBackground` to enable background scaling, it requires an element with `[vaul-drawer-wrapper]` data attribute to scale its background.
Can be controlled with the `value` and `onOpenChange` props. Can be opened by default via `defaultOpen` prop.
Can be controlled with the `value` and `onOpenChange` props. Can be opened by default via the `open` prop.

@@ -65,2 +66,6 @@ Additional props:

`direction`: Direction of the drawer. Can be `top` or `bottom`, `left`, `right`. Defaults to `bottom`.
`preventScrollRestoration`: When `true` it prevents scroll restoration when the drawer is closed after a navigation happens inside of it. Defaults to `true`.
### Trigger

@@ -67,0 +72,0 @@

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc