dgz-ui
Version:
Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript
8 lines (4 loc) • 6.02 kB
JavaScript
;const r=require("./jsx-runtime-h4oGeKUK.cjs"),B=require("react"),J=require("./index-Dyp2JWEo.cjs"),A=require("./index-C1oWDt_I.cjs"),l=require("./index-O9lmnOYp.cjs"),K=require("./index-OHKxBzpT.cjs"),Q=require("./index-BbYJWkTf.cjs"),D=require("./button-BZdVaLIh.cjs"),c=require("./utils-BeXF6FlA.cjs");function U(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=U(B);var v="AlertDialog",[X,ue]=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 Z="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=Z;var ee="AlertDialogPortal",y=e=>{const{__scopeAlertDialog:t,...o}=e,a=n(t);return r.jsxRuntimeExports.jsx(l.Portal,{...a,...o})};y.displayName=ee;var te="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=te;var d="AlertDialogContent",[oe,ae]=X(d),re=Q.createSlottable("AlertDialogContent"),E=s.forwardRef((e,t)=>{const{__scopeAlertDialog:o,children:a,...i}=e,g=n(o),u=s.useRef(null),Y=A.useComposedRefs(t,u),x=s.useRef(null);return r.jsxRuntimeExports.jsx(l.WarningProvider,{contentName:d,titleName:_,docsSlug:"alert-dialog",children:r.jsxRuntimeExports.jsx(oe,{scope:o,cancelRef:x,children:r.jsxRuntimeExports.jsxs(l.Content,{role:"alertdialog",...g,...i,ref:Y,onOpenAutoFocus:K.composeEventHandlers(i.onOpenAutoFocus,p=>{var f;p.preventDefault(),(f=x.current)==null||f.focus({preventScroll:!0})}),onPointerDownOutside:p=>p.preventDefault(),onInteractOutside:p=>p.preventDefault(),children:[r.jsxRuntimeExports.jsx(re,{children:a}),r.jsxRuntimeExports.jsx(ie,{contentRef:u})]})})})});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 se="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=se;var w="AlertDialogCancel",O=s.forwardRef((e,t)=>{const{__scopeAlertDialog:o,...a}=e,{cancelRef:i}=ae(w,o),g=n(o),u=A.useComposedRefs(t,i);return r.jsxRuntimeExports.jsx(l.Close,{...g,...a,ref:u})});O.displayName=w;var ie=({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},le=j,ne=R,ce=y,P=N,T=E,$=h,M=O,q=b,I=S;const de=le,pe=ne,F=ce,m=s.forwardRef(({className:e,...t},o)=>r.jsxRuntimeExports.jsx(P,{className:c.cn("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80",e),...t,ref:o}));m.displayName=P.displayName;const z=s.forwardRef(({className:e,...t},o)=>r.jsxRuntimeExports.jsxs(F,{children:[r.jsxRuntimeExports.jsx(m,{}),r.jsxRuntimeExports.jsx(T,{ref:o,className:c.cn("bg-background 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%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 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 gap-2 sm:justify-end",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-muted-foreground text-sm",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"}),e),...t}));W.displayName=M.displayName;exports.AlertDialog=de;exports.AlertDialogAction=V;exports.AlertDialogCancel=W;exports.AlertDialogContent=z;exports.AlertDialogDescription=G;exports.AlertDialogFooter=L;exports.AlertDialogHeader=H;exports.AlertDialogOverlay=m;exports.AlertDialogPortal=F;exports.AlertDialogTitle=k;exports.AlertDialogTrigger=pe;