@orsetra/shared-ui 1.0.62 → 1.0.63

package/components/layout/sidebar/sidebar.tsx

@@ -224,7 +224,7 @@ function Sidebar({ currentMenu, onMainMenuToggle, sidebarMenus = {}, main_base_u
 
       {/* En-tête du menu principal sélectionné */}
       {currentMenu && menuLabels[currentMenu] && (
-        <div className="px-4 py-3 border-b border-ui-border">
+        <div className="px-4 py-3  border-ui-border">
           <div className="flex items-center gap-2">
             {currentMenu === "assets" && <Rocket className="h-4 w-4 text-interactive" />}
             {currentMenu === "runtime" && <Package className="h-4 w-4 text-interactive" />}

package/components/ui/page-header.tsx

@@ -4,28 +4,32 @@ import type { ReactNode } from "react"
 
 interface PageHeaderProps {
   title: string
+  description?: string
   backLink?: string
   actions?: ReactNode
   statusNode?: ReactNode
 }
 
-export function PageHeader({ title, backLink, actions, statusNode}: PageHeaderProps) {
+export function PageHeader({ title, description, backLink, actions, statusNode}: PageHeaderProps) {
   return (
-    <div className="sticky top-0 z-10 bg-white border-b border-gray-200 -mx-6 px-6 py-3 mb-6">
-      <div className="flex items-center justify-between gap-4">
+    <div className="mb-4 sm:mb-8">
+      <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
         <div className="flex items-center space-x-3 min-w-0">
           {backLink && (
             <Link href={backLink} className="flex-shrink-0">
-              <ArrowLeft className="h-4 w-4 text-text-secondary" />
+              <ArrowLeft className="h-5 w-5 sm:h-6 sm:w-6 text-text-secondary" />
             </Link>
           )}
-          <div className="flex items-center space-x-3 min-w-0">
-            <h2 className="text-base font-semibold text-text-primary truncate">{title}</h2>
-            {statusNode && <div className="flex-shrink-0">{statusNode}</div>}
+          <div className="min-w-0">
+            <div className="flex items-center space-x-3">
+              <h1 className="text-xl sm:text-2xl font-semibold text-text-primary truncate">{title}</h1>
+              {statusNode && <div className="mt-2 flex-shrink-0">{statusNode}</div>}
+            </div>
+            {description && <p className="text-sm sm:text-base text-text-secondary line-clamp-2">{description}</p>}
           </div>
         </div>
-        {actions && <div className="flex items-center space-x-2 flex-shrink-0">{actions}</div>}
+        {actions && <div className="flex items-center space-x-2 sm:space-x-4 flex-shrink-0">{actions}</div>}
       </div>
     </div>
   )
-}
+} 

package/package.json

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