@orsetra/shared-ui 1.0.8 → 1.0.9

package/components/layout/index.ts

@@ -1,5 +1,5 @@
 // Layout components exports
-export { MainSidebar } from './sidebar/main-sidebar'
+export { MainSidebar, type SidebarMode } from './sidebar/main-sidebar'
 export { 
   Sidebar,
   SidebarContent,

package/components/layout/layout-container.tsx

@@ -2,9 +2,10 @@
 
 import { useState, useEffect } from "react"
 import { usePathname } from "next/navigation"
-import { MainSidebar, Sidebar, SidebarProvider, useSidebar } from "./index"
-import { UserMenu } from "../ui"
+import { MainSidebar, Sidebar, SidebarProvider, useSidebar, type SidebarMode } from "./index"
+import { UserMenu, Button } from "../ui"
 import { getMenuFromPath } from "../../lib/menu-utils"
+import { Menu } from "lucide-react"
 
 export interface SidebarMenus {
   [key: string]: any[]
@@ -15,13 +16,16 @@ interface LayoutContainerProps {
   sidebarMenus: SidebarMenus
   user?: { profile?: { email?: string; preferred_username?: string } } | null
   onSignOut?: () => void
+  mode?: SidebarMode
 }
 
-function LayoutContent({ children, sidebarMenus, user, onSignOut }: LayoutContainerProps) {
+function LayoutContent({ children, sidebarMenus, user, onSignOut, mode = 'expanded' }: LayoutContainerProps) {
   const pathname = usePathname()
   const { setOpen } = useSidebar()
   const [isMainSidebarOpen, setIsMainSidebarOpen] = useState(false)
   const [currentMenu, setCurrentMenu] = useState<string>("overview")
+  const isMinimized = mode === 'minimized'
+  const isHidden = mode === 'hidden'
 
   useEffect(() => {
     const contextualMenu = getMenuFromPath(pathname)
@@ -45,22 +49,55 @@ function LayoutContent({ children, sidebarMenus, user, onSignOut }: LayoutContai
 
   return (
     <div className="flex h-screen w-full bg-white">
-      <Sidebar 
-        currentMenu={currentMenu}
-        onMainMenuToggle={handleMainSidebarToggle}
-      />
+      {/* Sidebar secondaire - caché en mode minimized et hidden */}
+      {!isMinimized && !isHidden && (
+        <Sidebar 
+          currentMenu={currentMenu}
+          onMainMenuToggle={handleMainSidebarToggle}
+        />
+      )}
       
-      <MainSidebar 
-        isOpen={isMainSidebarOpen}
-        onToggle={handleMainSidebarToggle}
-        onMenuSelect={handleMenuSelect}
-        currentMenu={currentMenu}
-        onSecondarySidebarOpen={handleSecondarySidebarOpen}
-      />
+      {/* MainSidebar - en mode hidden, il s'ouvre comme un overlay */}
+      {!isHidden && (
+        <MainSidebar 
+          isOpen={isMainSidebarOpen}
+          onToggle={handleMainSidebarToggle}
+          onMenuSelect={handleMenuSelect}
+          currentMenu={currentMenu}
+          onSecondarySidebarOpen={handleSecondarySidebarOpen}
+          mode={mode}
+        />
+      )}
+
+      {/* MainSidebar overlay en mode hidden */}
+      {isHidden && (
+        <MainSidebar 
+          isOpen={isMainSidebarOpen}
+          onToggle={handleMainSidebarToggle}
+          onMenuSelect={handleMenuSelect}
+          currentMenu={currentMenu}
+          onSecondarySidebarOpen={handleSecondarySidebarOpen}
+          mode="expanded"
+        />
+      )}
       
       <div className="flex-1 flex flex-col">
         <header className="h-14 bg-white border-b border-ui-border flex-shrink-0">
-          <div className="h-full px-6 flex items-center justify-end">
+          <div className="h-full px-6 flex items-center justify-between">
+            {/* Bouton menu - affiché en mode hidden */}
+            {isHidden ? (
+              <Button
+                variant="ghost"
+                size="sm"
+                onClick={handleMainSidebarToggle}
+                className="h-8 w-8 p-0 hover:bg-ui-background text-text-secondary"
+                title="Ouvrir le menu principal"
+              >
+                <Menu className="h-5 w-5" />
+              </Button>
+            ) : (
+              <div />
+            )}
             <UserMenu 
               username={user?.profile?.email || user?.profile?.preferred_username} 
               onSignOut={onSignOut || (() => {})} 

package/components/layout/sidebar/main-sidebar.tsx

@@ -10,7 +10,7 @@ import { menuItems, menuSubItems } from "./data"
 import { X, Menu } from "lucide-react"
 import Link from "next/link"
 
-export type SidebarMode = 'expanded' | 'minimized'
+export type SidebarMode = 'expanded' | 'minimized' | 'hidden'
 
 interface MainSidebarProps {
   isOpen: boolean

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orsetra/shared-ui",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "description": "Shared UI components for Orsetra platform",
   "main": "./index.ts",
   "types": "./index.ts",