dgz-ui
Version:
Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript
8 lines (4 loc) • 6 kB
JavaScript
;const r=require("./jsx-runtime-DUiatUiq.cjs"),B=require("react"),J=require("./index-DcWZbXs6.cjs"),m=require("./index-t1JFNXJ1.cjs"),l=require("./index-D3IRm5Ny.cjs"),K=require("./index-Ch6ABCiC.cjs"),c=require("./utils-C1Nf1RtL.cjs"),D=require("./button-Dz5atwuT.cjs");function Q(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const a=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(t,o,a.get?a:{enumerable:!0,get:()=>e[o]})}}return t.default=e,Object.freeze(t)}const s=Q(B);var v="AlertDialog",[U,pe]=J.createContextScope(v,[l.createDialogScope]),n=l.createDialogScope(),j=e=>{const{__scopeAlertDialog:t,...o}=e,a=n(t);return r.jsxRuntimeExports.jsx(l.Root,{...a,...o,modal:!0})};j.displayName=v;var X="AlertDialogTrigger",R=s.forwardRef((e,t)=>{const{__scopeAlertDialog:o,...a}=e,i=n(o);return r.jsxRuntimeExports.jsx(l.Trigger,{...i,...a,ref:t})});R.displayName=X;var Z="AlertDialogPortal",y=e=>{const{__scopeAlertDialog:t,...o}=e,a=n(t);return r.jsxRuntimeExports.jsx(l.Portal,{...a,...o})};y.displayName=Z;var ee="AlertDialogOverlay",N=s.forwardRef((e,t)=>{const{__scopeAlertDialog:o,...a}=e,i=n(o);return r.jsxRuntimeExports.jsx(l.Overlay,{...i,...a,ref:t})});N.displayName=ee;var d="AlertDialogContent",[te,oe]=U(d),ae=m.createSlottable("AlertDialogContent"),E=s.forwardRef((e,t)=>{const{__scopeAlertDialog:o,children:a,...i}=e,u=n(o),g=s.useRef(null),Y=m.useComposedRefs(t,g),f=s.useRef(null);return r.jsxRuntimeExports.jsx(l.WarningProvider,{contentName:d,titleName:_,docsSlug:"alert-dialog",children:r.jsxRuntimeExports.jsx(te,{scope:o,cancelRef:f,children:r.jsxRuntimeExports.jsxs(l.Content,{role:"alertdialog",...u,...i,ref:Y,onOpenAutoFocus:K.composeEventHandlers(i.onOpenAutoFocus,p=>{var A;p.preventDefault(),(A=f.current)==null||A.focus({preventScroll:!0})}),onPointerDownOutside:p=>p.preventDefault(),onInteractOutside:p=>p.preventDefault(),children:[r.jsxRuntimeExports.jsx(ae,{children:a}),r.jsxRuntimeExports.jsx(se,{contentRef:g})]})})})});E.displayName=d;var _="AlertDialogTitle",b=s.forwardRef((e,t)=>{const{__scopeAlertDialog:o,...a}=e,i=n(o);return r.jsxRuntimeExports.jsx(l.Title,{...i,...a,ref:t})});b.displayName=_;var C="AlertDialogDescription",S=s.forwardRef((e,t)=>{const{__scopeAlertDialog:o,...a}=e,i=n(o);return r.jsxRuntimeExports.jsx(l.Description,{...i,...a,ref:t})});S.displayName=C;var re="AlertDialogAction",h=s.forwardRef((e,t)=>{const{__scopeAlertDialog:o,...a}=e,i=n(o);return r.jsxRuntimeExports.jsx(l.Close,{...i,...a,ref:t})});h.displayName=re;var w="AlertDialogCancel",O=s.forwardRef((e,t)=>{const{__scopeAlertDialog:o,...a}=e,{cancelRef:i}=oe(w,o),u=n(o),g=m.useComposedRefs(t,i);return r.jsxRuntimeExports.jsx(l.Close,{...u,...a,ref:g})});O.displayName=w;var se=({contentRef:e})=>{const t=`\`${d}\` requires a description for the component to be accessible for screen reader users.
You can add a description to the \`${d}\` by passing a \`${C}\` component as a child, which also benefits sighted users by adding visible context to the dialog.
Alternatively, you can use your own component as a description by assigning it an \`id\` and passing the same value to the \`aria-describedby\` prop in \`${d}\`. If the description is confusing or duplicative for sighted users, you can use the \`@radix-ui/react-visually-hidden\` primitive as a wrapper around your description component.
For more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;return s.useEffect(()=>{var a;document.getElementById((a=e.current)==null?void 0:a.getAttribute("aria-describedby"))||console.warn(t)},[t,e]),null},ie=j,le=R,ne=y,P=N,T=E,$=h,M=O,q=b,I=S;const ce=ie,de=le,F=ne,x=s.forwardRef(({className:e,...t},o)=>r.jsxRuntimeExports.jsx(P,{className:c.cn("fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",e),...t,ref:o}));x.displayName=P.displayName;const z=s.forwardRef(({className:e,...t},o)=>r.jsxRuntimeExports.jsxs(F,{children:[r.jsxRuntimeExports.jsx(x,{}),r.jsxRuntimeExports.jsx(T,{ref:o,className:c.cn("fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",e),...t})]}));z.displayName=T.displayName;const H=({className:e,...t})=>r.jsxRuntimeExports.jsx("div",{className:c.cn("flex flex-col space-y-2 text-center sm:text-left",e),...t});H.displayName="AlertDialogHeader";const L=({className:e,...t})=>r.jsxRuntimeExports.jsx("div",{className:c.cn("flex sm:justify-end gap-2",e),...t});L.displayName="AlertDialogFooter";const k=s.forwardRef(({className:e,...t},o)=>r.jsxRuntimeExports.jsx(q,{ref:o,className:c.cn("text-lg font-semibold",e),...t}));k.displayName=q.displayName;const G=s.forwardRef(({className:e,...t},o)=>r.jsxRuntimeExports.jsx(I,{ref:o,className:c.cn("text-sm text-muted-foreground",e),...t}));G.displayName=I.displayName;const V=s.forwardRef(({className:e,...t},o)=>r.jsxRuntimeExports.jsx($,{ref:o,className:c.cn(D.buttonVariants(),e),...t}));V.displayName=$.displayName;const W=s.forwardRef(({className:e,...t},o)=>r.jsxRuntimeExports.jsx(M,{ref:o,className:c.cn(D.buttonVariants({variant:"tertiary"}),"mt-2 sm:mt-0",e),...t}));W.displayName=M.displayName;exports.AlertDialog=ce;exports.AlertDialogAction=V;exports.AlertDialogCancel=W;exports.AlertDialogContent=z;exports.AlertDialogDescription=G;exports.AlertDialogFooter=L;exports.AlertDialogHeader=H;exports.AlertDialogOverlay=x;exports.AlertDialogPortal=F;exports.AlertDialogTitle=k;exports.AlertDialogTrigger=de;