@fabio.caffarello/react-design-system 1.23.4 → 1.23.6

package/dist/index.cjs

@@ -500,7 +500,7 @@ React keys must be passed directly to JSX without using spread:
                   text-fg-tertiary
                   transition-transform
                   ${C?"-rotate-90":"rotate-0"}
-                `,style:{transitionDuration:`${g}ms`},"aria-hidden":"true"})]})]}),a?n.jsx(xa,{open:!C,duration:g,children:n.jsx("div",{id:`sidebar-group-${e}`,className:"px-3 py-2",children:i})}):n.jsx("div",{className:"px-3 py-2",children:i})]}))}function yo({id:e,children:t}){const{activeSlot:r,registerSlot:s,unregisterSlot:a}=Ks();return l.useEffect(()=>(s(e,t),()=>a(e)),[e,t,s,a]),r!==e?null:n.jsx(n.Fragment,{children:t})}function wo({fallback:e=null}){const{activeSlot:t,slots:r}=Ks();return!t||!r.has(t)?n.jsx(n.Fragment,{children:e}):n.jsx(n.Fragment,{children:r.get(t)})}function ct(a){var o=a,{children:e,className:t="",style:r}=o,s=O(o,["children","className","style"]);const i=lt(),c=it(),u=l.useRef(null),[d,f]=l.useState(0),[p,m]=l.useState(!1),[h,x]=l.useState(!1),[y,k]=l.useState(null),g=l.useCallback(()=>m(!0),[]),j=l.useCallback(()=>m(!1),[]),C=l.useCallback(()=>x(!0),[]),b=l.useCallback(()=>x(!1),[]),v=l.useMemo(()=>({collapsed:i.collapsed,currentWidth:i.currentWidth,isMobile:i.isMobile,sidebarRef:u,scrollPosition:d,setScrollPosition:f,hasHeader:p,hasFooter:h,registerHeader:g,unregisterHeader:j,registerFooter:C,unregisterFooter:b,activeGroup:y,setActiveGroup:k}),[i.collapsed,i.currentWidth,i.isMobile,d,p,h,g,j,C,b,y]),N=br(c.contentWidth),_=br(c.navigationWidth),S=N-_;return n.jsx(Or.Provider,{value:v,children:n.jsx("aside",P(T({ref:u,id:"side-navbar-sidebar",className:w("flex","flex-col","h-full","bg-surface-subtle","border-r","border-line-default","overflow-hidden",t),style:T({width:i.collapsed?0:S,opacity:i.collapsed?0:1,visibility:i.collapsed?"hidden":"visible",transitionProperty:"width, opacity, visibility",transitionDuration:`${c.animationDuration}ms`,transitionTimingFunction:c.animationEasing},r),"aria-hidden":i.collapsed},s),{children:e}))})}ct.Header=bo;ct.Content=go;ct.Footer=xo;ct.Group=vo;ct.Slot=yo;ct.SlotContent=wo;function Ce(M){var F=M,{mode:e="full",variant:t="default",navigationWidth:r="56px",width:s="320px",animationDuration:a=300,resizable:o=!1,minWidth:i,maxWidth:c,snapPoints:u,responsive:d=!1,mobileBreakpoint:f=768,mobileVariant:p="collapse",overlayBackdrop:m=!0,storageKey:h,persistWidth:x=!1,defaultCollapsed:y=!1,collapsed:k,onCollapseChange:g,onWidthChange:j,onMobileChange:C,exclusiveGroups:b=!1,showToggle:v=!0,togglePosition:N="floating",children:_}=F,S=O(F,["mode","variant","navigationWidth","width","animationDuration","resizable","minWidth","maxWidth","snapPoints","responsive","mobileBreakpoint","mobileVariant","overlayBackdrop","storageKey","persistWidth","defaultCollapsed","collapsed","onCollapseChange","onWidthChange","onMobileChange","exclusiveGroups","showToggle","togglePosition","children"]);const A=l.useMemo(()=>({showMainToggle:v,mainTogglePosition:N}),[v,N]);return n.jsx(_r.Provider,{value:A,children:n.jsx(qs,{variant:t,navigationWidth:r,contentWidth:s,animationDuration:a,mode:e,resizable:o,minWidth:i,maxWidth:c,snapPoints:u,responsive:d,mobileBreakpoint:f,mobileVariant:p,overlayBackdrop:m,storageKey:h,persistWidth:x,defaultCollapsed:y,collapsed:k,onCollapseChange:g,onWidthChange:j,onMobileChange:C,exclusiveGroups:b,children:n.jsx(uo,P(T({},S),{children:_}))})})}Ce.Navbar=vt;Ce.Sidebar=ct;Ce.Toggle=Zs;Ce.ResizeHandle=Xs;Ce.Backdrop=Js;Ce.Provider=qs;Ce.ThemeProvider=Hs;Ce.ConfigProvider=Bs;Ce.StateProvider=Us;Ce.SlotProvider=co;function Hd({defaultStates:e={},persist:t=!1,storageKey:r}={}){const s=()=>{if(t&&r&&typeof window!="undefined"){const d=localStorage.getItem(`${r}-groups`);if(d)try{const f=JSON.parse(d);return T(T({},e),f)}catch(f){}}return e},[a,o]=l.useState(s);l.useEffect(()=>{t&&r&&typeof window!="undefined"&&localStorage.setItem(`${r}-groups`,JSON.stringify(a))},[t,r,a]);const i=l.useCallback(d=>{o(f=>P(T({},f),{[d]:!f[d]}))},[]),c=l.useCallback((d,f)=>{o(p=>P(T({},p),{[d]:f}))},[]),u=l.useCallback(()=>{o(e)},[e]);return{groupStates:a,toggleGroup:i,setGroupCollapsed:c,resetGroups:u}}function Bd(){const{activeItem:e,setActiveItem:t}=zr(),r=Gs(),s=l.useCallback((a,o)=>{t(a),o&&(r!=null&&r.setActiveSlot)&&r.setActiveSlot(o)},[t,r]);return{activeItem:e,setActiveItem:t,navigate:s}}function Ud(){var r,s,a,o;const e=Gs(),t=ho();return{activeSlot:(r=e==null?void 0:e.activeSlot)!=null?r:null,setActiveSlot:(s=e==null?void 0:e.setActiveSlot)!=null?s:(()=>{}),scrollPosition:(a=t==null?void 0:t.scrollPosition)!=null?a:0,setScrollPosition:(o=t==null?void 0:t.setScrollPosition)!=null?o:(()=>{})}}function qd(){const e=useSideNavbarThemeRequired(),t=useSideNavbarConfigRequired(),r=useSideNavbarStateRequired();return{theme:e,config:t,state:r}}function ko({children:e,asChild:t=!1}){const{onOpenChange:r}=Dt();return t&&l.isValidElement(e)?l.cloneElement(e,{onClick:s=>{r(!0),e.props.onClick&&e.props.onClick(s)}}):n.jsx("button",{type:"button",onClick:()=>r(!0),"aria-haspopup":"dialog",children:e})}function Qs(i){var c=i,{children:e,size:t="md",closeOnOverlayClick:r=!0,closeOnEscape:s=!0,className:a=""}=c,o=O(c,["children","size","closeOnOverlayClick","closeOnEscape","className"]);const{isOpen:u,onClose:d,titleId:f,descriptionId:p}=Dt(),m=l.useRef(null),h=l.useRef(null);if(l.useEffect(()=>{if(!u)return;const g=setTimeout(()=>{var N;const b=(N=m.current)==null?void 0:N.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'),v=b==null?void 0:b[0];v==null||v.focus()},0),j=b=>{s&&b.key==="Escape"&&d()},C=b=>{if(b.key!=="Tab"||!m.current)return;const v=Array.from(m.current.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(S=>!S.disabled&&S.offsetParent!==null);if(v.length===0){b.preventDefault();return}const N=v[0],_=v[v.length-1];b.shiftKey?document.activeElement===N&&(b.preventDefault(),_.focus()):document.activeElement===_&&(b.preventDefault(),N.focus())};return document.addEventListener("keydown",j),document.addEventListener("keydown",C),()=>{clearTimeout(g),document.removeEventListener("keydown",j),document.removeEventListener("keydown",C)}},[u,d,s]),!u)return null;const x={sm:"max-w-sm",md:"max-w-md",lg:"max-w-lg",xl:"max-w-2xl",fullscreen:"max-w-full h-full m-0 rounded-none"},y=g=>{r&&g.target===h.current&&d()},k=n.jsxs("div",{className:`fixed inset-0 ${ue("modal")} overflow-y-auto`,onClick:y,children:[n.jsx("div",{ref:h,className:"fixed inset-0 bg-scrim transition-opacity","aria-hidden":"true"}),n.jsx("div",{className:"flex min-h-full items-center justify-center p-4",children:n.jsx("div",P(T({ref:m,role:"dialog","aria-modal":"true","aria-labelledby":f,"aria-describedby":p,className:`
+                `,style:{transitionDuration:`${g}ms`},"aria-hidden":"true"})]})]}),a?n.jsx(xa,{open:!C,duration:g,children:n.jsx("div",{id:`sidebar-group-${e}`,className:"px-3 py-2",children:i})}):n.jsx("div",{className:"px-3 py-2",children:i})]}))}function yo({id:e,children:t}){const{activeSlot:r,registerSlot:s,unregisterSlot:a}=Ks();return l.useEffect(()=>(s(e,t),()=>a(e)),[e,t,s,a]),r!==e?null:n.jsx(n.Fragment,{children:t})}function wo({fallback:e=null}){const{activeSlot:t,slots:r}=Ks();return!t||!r.has(t)?n.jsx(n.Fragment,{children:e}):n.jsx(n.Fragment,{children:r.get(t)})}function ct(a){var o=a,{children:e,className:t="",style:r}=o,s=O(o,["children","className","style"]);const i=lt(),c=it(),u=l.useRef(null),[d,f]=l.useState(0),[p,m]=l.useState(!1),[h,x]=l.useState(!1),[y,k]=l.useState(null),g=l.useCallback(()=>m(!0),[]),j=l.useCallback(()=>m(!1),[]),C=l.useCallback(()=>x(!0),[]),b=l.useCallback(()=>x(!1),[]),v=l.useMemo(()=>({collapsed:i.collapsed,currentWidth:i.currentWidth,isMobile:i.isMobile,sidebarRef:u,scrollPosition:d,setScrollPosition:f,hasHeader:p,hasFooter:h,registerHeader:g,unregisterHeader:j,registerFooter:C,unregisterFooter:b,activeGroup:y,setActiveGroup:k}),[i.collapsed,i.currentWidth,i.isMobile,d,p,h,g,j,C,b,y]),N=br(c.contentWidth),_=br(c.navigationWidth),S=N-_;return n.jsx(Or.Provider,{value:v,children:n.jsx("div",P(T({ref:u,id:"side-navbar-sidebar",className:w("flex","flex-col","h-full","bg-surface-subtle","border-r","border-line-default","overflow-hidden",t),style:T({width:i.collapsed?0:S,opacity:i.collapsed?0:1,visibility:i.collapsed?"hidden":"visible",transitionProperty:"width, opacity, visibility",transitionDuration:`${c.animationDuration}ms`,transitionTimingFunction:c.animationEasing},r),"aria-hidden":i.collapsed},s),{children:e}))})}ct.Header=bo;ct.Content=go;ct.Footer=xo;ct.Group=vo;ct.Slot=yo;ct.SlotContent=wo;function Ce(M){var F=M,{mode:e="full",variant:t="default",navigationWidth:r="56px",width:s="320px",animationDuration:a=300,resizable:o=!1,minWidth:i,maxWidth:c,snapPoints:u,responsive:d=!1,mobileBreakpoint:f=768,mobileVariant:p="collapse",overlayBackdrop:m=!0,storageKey:h,persistWidth:x=!1,defaultCollapsed:y=!1,collapsed:k,onCollapseChange:g,onWidthChange:j,onMobileChange:C,exclusiveGroups:b=!1,showToggle:v=!0,togglePosition:N="floating",children:_}=F,S=O(F,["mode","variant","navigationWidth","width","animationDuration","resizable","minWidth","maxWidth","snapPoints","responsive","mobileBreakpoint","mobileVariant","overlayBackdrop","storageKey","persistWidth","defaultCollapsed","collapsed","onCollapseChange","onWidthChange","onMobileChange","exclusiveGroups","showToggle","togglePosition","children"]);const A=l.useMemo(()=>({showMainToggle:v,mainTogglePosition:N}),[v,N]);return n.jsx(_r.Provider,{value:A,children:n.jsx(qs,{variant:t,navigationWidth:r,contentWidth:s,animationDuration:a,mode:e,resizable:o,minWidth:i,maxWidth:c,snapPoints:u,responsive:d,mobileBreakpoint:f,mobileVariant:p,overlayBackdrop:m,storageKey:h,persistWidth:x,defaultCollapsed:y,collapsed:k,onCollapseChange:g,onWidthChange:j,onMobileChange:C,exclusiveGroups:b,children:n.jsx(uo,P(T({},S),{children:_}))})})}Ce.Navbar=vt;Ce.Sidebar=ct;Ce.Toggle=Zs;Ce.ResizeHandle=Xs;Ce.Backdrop=Js;Ce.Provider=qs;Ce.ThemeProvider=Hs;Ce.ConfigProvider=Bs;Ce.StateProvider=Us;Ce.SlotProvider=co;function Hd({defaultStates:e={},persist:t=!1,storageKey:r}={}){const s=()=>{if(t&&r&&typeof window!="undefined"){const d=localStorage.getItem(`${r}-groups`);if(d)try{const f=JSON.parse(d);return T(T({},e),f)}catch(f){}}return e},[a,o]=l.useState(s);l.useEffect(()=>{t&&r&&typeof window!="undefined"&&localStorage.setItem(`${r}-groups`,JSON.stringify(a))},[t,r,a]);const i=l.useCallback(d=>{o(f=>P(T({},f),{[d]:!f[d]}))},[]),c=l.useCallback((d,f)=>{o(p=>P(T({},p),{[d]:f}))},[]),u=l.useCallback(()=>{o(e)},[e]);return{groupStates:a,toggleGroup:i,setGroupCollapsed:c,resetGroups:u}}function Bd(){const{activeItem:e,setActiveItem:t}=zr(),r=Gs(),s=l.useCallback((a,o)=>{t(a),o&&(r!=null&&r.setActiveSlot)&&r.setActiveSlot(o)},[t,r]);return{activeItem:e,setActiveItem:t,navigate:s}}function Ud(){var r,s,a,o;const e=Gs(),t=ho();return{activeSlot:(r=e==null?void 0:e.activeSlot)!=null?r:null,setActiveSlot:(s=e==null?void 0:e.setActiveSlot)!=null?s:(()=>{}),scrollPosition:(a=t==null?void 0:t.scrollPosition)!=null?a:0,setScrollPosition:(o=t==null?void 0:t.setScrollPosition)!=null?o:(()=>{})}}function qd(){const e=useSideNavbarThemeRequired(),t=useSideNavbarConfigRequired(),r=useSideNavbarStateRequired();return{theme:e,config:t,state:r}}function ko({children:e,asChild:t=!1}){const{onOpenChange:r}=Dt();return t&&l.isValidElement(e)?l.cloneElement(e,{onClick:s=>{r(!0),e.props.onClick&&e.props.onClick(s)}}):n.jsx("button",{type:"button",onClick:()=>r(!0),"aria-haspopup":"dialog",children:e})}function Qs(i){var c=i,{children:e,size:t="md",closeOnOverlayClick:r=!0,closeOnEscape:s=!0,className:a=""}=c,o=O(c,["children","size","closeOnOverlayClick","closeOnEscape","className"]);const{isOpen:u,onClose:d,titleId:f,descriptionId:p}=Dt(),m=l.useRef(null),h=l.useRef(null);if(l.useEffect(()=>{if(!u)return;const g=setTimeout(()=>{var N;const b=(N=m.current)==null?void 0:N.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'),v=b==null?void 0:b[0];v==null||v.focus()},0),j=b=>{s&&b.key==="Escape"&&d()},C=b=>{if(b.key!=="Tab"||!m.current)return;const v=Array.from(m.current.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(S=>!S.disabled&&S.offsetParent!==null);if(v.length===0){b.preventDefault();return}const N=v[0],_=v[v.length-1];b.shiftKey?document.activeElement===N&&(b.preventDefault(),_.focus()):document.activeElement===_&&(b.preventDefault(),N.focus())};return document.addEventListener("keydown",j),document.addEventListener("keydown",C),()=>{clearTimeout(g),document.removeEventListener("keydown",j),document.removeEventListener("keydown",C)}},[u,d,s]),!u)return null;const x={sm:"max-w-sm",md:"max-w-md",lg:"max-w-lg",xl:"max-w-2xl",fullscreen:"max-w-full h-full m-0 rounded-none"},y=g=>{r&&g.target===h.current&&d()},k=n.jsxs("div",{className:`fixed inset-0 ${ue("modal")} overflow-y-auto`,onClick:y,children:[n.jsx("div",{ref:h,className:"fixed inset-0 bg-scrim transition-opacity","aria-hidden":"true"}),n.jsx("div",{className:"flex min-h-full items-center justify-center p-4",children:n.jsx("div",P(T({ref:m,role:"dialog","aria-modal":"true","aria-labelledby":f,"aria-describedby":p,className:`
             relative ${ue("modal")} w-full
             ${x[t]}
             bg-surface-overlay