@undp/design-system-react
Version:
React based design system for UNDP
2 lines • 3.64 kB
JavaScript
const e=require("./rolldown-runtime-mLOUI7ql.cjs"),t=require("./utils-Dd9-5CFr.cjs"),n=require("./x-bed1YSbv.cjs"),r=require("./dist-B4Xu9oo7.cjs"),i=require("./dist-BTkvAJGr.cjs");let a=require("react");a=e.r(a,1);let o=require("react/jsx-runtime");var s=i.t;i.c;var c=i.o;i.n;var l=a.default.forwardRef(({className:e,...n},r)=>(0,o.jsx)(i.a,{...n,ref:r,className:t.t(`data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-surface/90 backdrop-blur-[18px] data-[state=closed]:animate-out data-[state=open]:animate-in`,e)}));l.displayName=i.a.displayName;var u=a.default.forwardRef(({className:e,children:n,onOpenChange:r,inPortal:a=!1,overlayClassName:s,...u},d)=>{let f=(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(l,{onClick:()=>r?.(!1),className:s}),(0,o.jsx)(i.r,{...u,ref:d,className:t.t(`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 max-h-[90vh] w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 overflow-auto border border-stroke-xs bg-background p-6 shadow-lg duration-200 data-[state=closed]:animate-out data-[state=open]:animate-in`,e),children:n})]});return a?(0,o.jsx)(c,{"data-slot":`drawer-portal`,children:f}):f});u.displayName=i.r.displayName;function d({className:e,...n}){return(0,o.jsx)(`div`,{...n,className:t.t(`flex flex-col gap-1.5 text-center sm:text-left`,e)})}d.displayName=`DialogHeader`;function f({className:e,children:t,...n}){return(0,o.jsx)(`div`,{...n,className:e,children:t})}f.displayName=`DialogFooter`;var p=a.default.forwardRef(({className:e,...n},r)=>(0,o.jsx)(i.s,{...n,ref:r,className:t.t(`mb-0 p-0 font-normal text-content-primary text-h4-xs md:text-h4-sm lg:text-h4`,e)}));p.displayName=i.s.displayName;var m=a.default.forwardRef(({className:e,...n},r)=>(0,o.jsx)(i.i,{...n,ref:r,className:t.t(`m-0 text-content-secondary text-sm`,e)}));m.displayName=i.i.displayName;function h(e){let{title:i,description:c,children:l,footer:h,open:g,onClose:_,className:v,titleClassName:y,footerClassName:b,descriptionClassName:x,overlayClassName:S,closeButtonClassName:C,showCloseButton:w=!0,inPortal:T=!1}=e,E=a.default.useId(),D=a.default.useId();return(0,o.jsx)(s,{open:g,onOpenChange:e=>{e||_?.()},children:(0,o.jsxs)(u,{inPortal:T,className:t.t(`undp-scrollbar max-w-(--breakpoint-xl) p-16`,`data-[state=closed]:animate-out data-[state=open]:animate-in`,`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-top-[2%] data-[state=open]:slide-in-from-top-[2%]`,v),overlayClassName:S,onOpenChange:e=>{e||_?.()},"aria-describedby":c?E:void 0,"aria-labelledby":i?D:void 0,children:[w&&(0,o.jsx)(`button`,{type:`button`,onClick:()=>{_?.()},className:t.t(`absolute top-6 right-6 rounded-full border border-stroke bg-surface p-2 ring-offset-background transition-opacity hover:bg-surface-hover disabled:pointer-events-none data-[state=open]:bg-surface data-[state=open]:text-content-primary`,C),children:(0,o.jsx)(n.t,{className:`h-6 w-6`})}),i||c?(0,o.jsxs)(d,{children:[i&&(0,o.jsx)(p,{id:D,className:y,children:i}),c&&(0,o.jsx)(m,{className:x,id:E,children:c})]}):(0,o.jsx)(r.t,{children:(0,o.jsx)(p,{children:`This a modal`})}),l,h&&(0,o.jsx)(f,{className:b,children:h})]})})}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return h}});
//# sourceMappingURL=modal-ChzlMFpC.cjs.map