UNPKG

@vela-ui/react

Version:

Vela UI React components

3 lines (2 loc) 2.15 kB
"use client" import{Modal as p,ModalOverlay as x,composeRenderProps as d}from"react-aria-components";import{tv as u}from"tailwind-variants";import{jsx as l}from"react/jsx-runtime";var v=u({base:"fixed inset-0 z-50 flex w-full items-center justify-center bg-black/50",variants:{placement:{top:"items-start",center:"items-center",bottom:"items-end"},scrollBehavior:{inside:"items-stretch overflow-hidden",outside:"overflow-auto"},isBlurred:{true:"backdrop-blur-md backdrop-saturate-150"},isEntering:{true:"animate-in fade-in duration-300 ease-out"},isExiting:{true:"animate-out fade-out duration-200 ease-in"}},compoundVariants:[{placement:"center",scrollBehavior:"outside",className:"[&>div]:m-auto"},{placement:"bottom",scrollBehavior:"outside",className:"[&>div]:mt-auto"}],defaultVariants:{placement:"top",scrollBehavior:"outside",isBlurred:!1}}),f=u({base:"bg-background my-16 w-full max-w-[calc(100%-2rem)] rounded-lg border shadow-lg transition",variants:{scrollBehavior:{inside:"max-h-[calc(100%-7.5rem)]",outside:""},isEntering:{true:"animate-in zoom-in-95 duration-300 ease-out"},isExiting:{true:"animate-out zoom-out-95 duration-200 ease-in"},size:{xs:"sm:max-w-xs",sm:"sm:max-w-sm",md:"sm:max-w-md",lg:"sm:max-w-lg",xl:"sm:max-w-xl","2xl":"sm:max-w-2xl","3xl":"sm:max-w-3xl","4xl":"sm:max-w-4xl","5xl":"sm:max-w-5xl",full:"my-0 h-dvh max-w-full rounded-none"}},defaultVariants:{size:"lg"}});function y({className:a,placement:e,scrollBehavior:o,isBlurred:t,...s}){return l(x,{"data-slot":"modal-overlay",style:{height:"var(--visual-viewport-height)"},className:d(a,(r,i)=>v({...i,placement:e,scrollBehavior:o,isBlurred:t,className:r})),...s})}function h({className:a,size:e,scrollBehavior:o,...t}){return l(p,{"data-slot":"modal",className:d(a,(s,r)=>f({...r,size:e,scrollBehavior:o,className:s})),...t})}function g({className:a,overlayClassName:e,isDismissable:o=!0,isOpen:t,onOpenChange:s,size:r,placement:i,scrollBehavior:n,isBlurred:c,...m}){return l(y,{isDismissable:o,isOpen:t,onOpenChange:s,className:e,placement:i,scrollBehavior:n,isBlurred:c,...m,children:l(h,{className:a,size:r,scrollBehavior:n,...m})})}export{y as a,h as b,g as c};