UNPKG

@undp/design-system-react

Version:

React based design system for UNDP

2 lines 2.79 kB
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./rolldown-runtime-mLOUI7ql.cjs"),t=require("./utils-Dd9-5CFr.cjs"),n=require("./dist-BZMXZCSu.cjs");let r=require("react");r=e.r(r,1);let i=require("react/jsx-runtime");var a=n.t(``,{variants:{backgroundColor:{transparent:`bg-transparent text-content-primary`,background:`bg-background text-content-primary`,"background-soft":`bg-background-soft text-content-primary`,foreground:`bg-foreground text-content-reverse`,"foreground-soft":`bg-foreground-soft text-content-reverse`,primary:`bg-primary text-content-reverse`,secondary:`bg-secondary text-content-reverse`,tertiary:`bg-tertiary text-content-reverse`,quaternary:`bg-quaternary text-content-primary`,success:`bg-success text-content-reverse`,warning:`bg-warning text-content-reverse`,info:`bg-info text-content-reverse`,error:`bg-error text-content-reverse`},padding:{none:`py-24 px-0`,"2xs":`py-24 px-1`,xs:`py-24 px-2`,sm:`py-24 px-3`,base:`py-24 px-4`,lg:`py-24 px-5`,xl:`py-24 px-6`,"2xl":`py-24 px-8`,"3xl":`py-24 px-10`}},defaultVariants:{backgroundColor:`transparent`,padding:`base`}}),o=n.t(`flex flex-row items-stretch flex-wrap w-full`,{variants:{bodyMaxWidth:{xs:`max-w-[1024px] mx-auto`,sm:`max-w-[1272px] mx-auto`,base:`max-w-[1440px] mx-auto`,lg:`max-w-[1600px] mx-auto`,xl:`max-w-[1980px] mx-auto`,full:`max-w-none`},bodyGap:{none:`gap-0`,"2xs":`gap-1`,xs:`gap-2`,sm:`gap-3`,base:`gap-4`,lg:`gap-5`,xl:`gap-6`,"2xl":`gap-7`,"3xl":`gap-8`}},defaultVariants:{bodyGap:`base`,bodyMaxWidth:`full`}}),s=n.t(`w-full`,{variants:{sidebarWidth:{sm:`sm:w-1/4`,base:`sm:w-1/3`,lg:`sm:w-1/2`,full:``}},defaultVariants:{sidebarWidth:`base`}}),c=r.default.createContext(null),l=r.default.forwardRef(({className:e,backgroundColor:n,sidebarWidth:o,bodyGap:s,bodyMaxWidth:l,padding:u,...d},f)=>{let p=r.default.useMemo(()=>({backgroundColor:n,sidebarWidth:o,bodyGap:s,bodyMaxWidth:l,padding:u}),[n,o,s,l,u]);return(0,i.jsx)(c.Provider,{value:p,children:(0,i.jsx)(`div`,{...d,className:t.t(a({backgroundColor:n,padding:u}),e),ref:f})})});l.displayName=`Banner`;var u=r.default.forwardRef(({className:e,...n},a)=>{let s=r.default.useContext(c);return(0,i.jsx)(`div`,{...n,className:t.t(o({bodyMaxWidth:s?.bodyMaxWidth,bodyGap:s?.bodyGap}),e),ref:a})});u.displayName=`BannerBody`;var d=r.default.forwardRef(({className:e,...n},a)=>{let o=r.default.useContext(c);return(0,i.jsx)(`div`,{...n,className:t.t(s({sidebarWidth:o?.sidebarWidth}),e),ref:a})});d.displayName=`BannerBodySidebar`;var f=r.default.forwardRef(({className:e,...n},r)=>(0,i.jsx)(`div`,{...n,className:t.t(`flex-1`,e),ref:r}));f.displayName=`BannerBodyContent`,exports.Banner=l,exports.BannerBody=u,exports.BannerBodyContent=f,exports.BannerBodySidebar=d; //# sourceMappingURL=Banner.cjs.map