@undp/design-system-react/dist/Sidebar.cjs

React based design system for UNDP

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(`w-full @2xl:w-1/2 @3xl:w-1/3 @7xl:w-1/4 @8xl:w-1/5`,{variants:{variant:{noEffect:``,background:`bg-surface`,border:`border-r border-r-stroke`}},defaultVariants:{variant:`background`}}),o=r.default.createContext({selectedValue:void 0,classNames:void 0,activeValue:void 0,onValueChange:()=>{}}),s=r.default.forwardRef(({className:e,children:n,variant:s,defaultValue:c,activeValue:l,activeItemClass:u,hoverItemClass:d,onValueChange:f,...p},m)=>{let[h,g]=r.default.useState(l||c||``),_=r.default.useCallback(e=>{g(l||e),f?.(e)},[f,l]),v=(0,r.useEffectEvent)(e=>{g(e||c||``)});(0,r.useEffect)(()=>{v(l)},[l]);let y=r.default.useMemo(()=>({activeItemClass:u,activeValue:l,selectedValue:h,hoverItemClass:d,onValueChange:_}),[u,l,h,d,_]);return(0,i.jsx)(o.Provider,{value:y,children:(0,i.jsx)(`div`,{className:`@container w-full`,children:(0,i.jsx)(`div`,{className:t.t(a({variant:s}),e),ref:m,...p,children:n})})})});s.displayName=`Sidebar`;var c=r.default.forwardRef(({className:e,children:n,value:a,...s},c)=>{let{selectedValue:l,classNames:u,onValueChange:d}=r.default.useContext(o);return(0,i.jsx)(`button`,{...s,ref:c,className:t.t(`flex w-full cursor-pointer items-center gap-2 border-0 bg-transparent p-4 text-base text-content-primary hover:bg-surface-hover`,e,u?.controls,l===a&&u?.active),onClick:()=>{a&&d(a)},children:n})});c.displayName=`SidebarItem`,exports.Sidebar=s,exports.SidebarItem=c;
//# sourceMappingURL=Sidebar.cjs.map