@ttoss/layouts 0.4.17 → 0.4.19

package/dist/esm/index.js

@@ -2278,9 +2278,6 @@ Icon2.displayName = "Icon";
 import { Box as Box3, Flex as Flex2, IconButton as IconButton2 } from "@ttoss/ui";
 import * as React5 from "react";
 
-// src/components/LayoutProvider.tsx
-import * as React3 from "react";
-
 // src/useIsDesktop.ts
 import { useBreakpointIndex } from "@ttoss/ui";
 var useIsDesktop = () => {
@@ -2292,6 +2289,7 @@ var useIsDesktop = () => {
 };
 
 // src/components/LayoutProvider.tsx
+import * as React3 from "react";
 import { jsx as jsx3 } from "react/jsx-runtime";
 var LayoutContext = React3.createContext({
   isSidebarOpen: true,
@@ -2467,6 +2465,9 @@ var Header = ({
     isSidebarOpen,
     toggleSidebar
   } = useLayout();
+  const {
+    isDesktop
+  } = useIsDesktop();
   const sidebarButton = React5.useMemo(() => {
     if (!showSidebarButton) {
       return null;
@@ -2494,9 +2495,9 @@ var Header = ({
     }
     return /* @__PURE__ */jsxs2(Flex2, {
       sx: {
-        minWidth: SIDEBAR_WIDTH,
-        width: SIDEBAR_WIDTH,
-        borderRight: "sm",
+        minWidth: ["12rem", "3xs", SIDEBAR_WIDTH],
+        width: ["12rem", "3xs", SIDEBAR_WIDTH],
+        borderRight: isDesktop ? "sm" : "none",
         borderColor: "display.border.muted.default",
         alignItems: "center",
         gap: "2",
@@ -2504,7 +2505,7 @@ var Header = ({
       },
       children: [sidebarButton, sidebarSlot]
     });
-  }, [sidebarButton, sidebarSlot]);
+  }, [isDesktop, sidebarButton, sidebarSlot]);
   return /* @__PURE__ */jsxs2(Flex2, {
     variant: "layout.header",
     ...boxProps,
@@ -2521,7 +2522,9 @@ var Header = ({
     },
     children: [memoizedSidebarSlot, /* @__PURE__ */jsx5(Box3, {
       sx: {
-        width: "100%",
+        width: "full",
+        display: ["flex", "unset", "unset"],
+        justifyContent: ["center", "unset", "unset"],
         ...(sidebarSlot ? paddingSx : {})
       },
       children

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/layouts",
-  "version": "0.4.17",
+  "version": "0.4.19",
   "description": "Layout components for React",
   "license": "MIT",
   "author": "ttoss",
@@ -34,11 +34,11 @@
     "jest": "^29.7.0",
     "react": "^19.0.0",
     "tsup": "^8.3.5",
+    "@ttoss/components": "^2.2.9",
+    "@ttoss/config": "^1.35.2",
     "@ttoss/react-icons": "^0.4.9",
     "@ttoss/test-utils": "^2.1.22",
-    "@ttoss/config": "^1.35.2",
-    "@ttoss/ui": "^5.5.5",
-    "@ttoss/components": "^2.2.9"
+    "@ttoss/ui": "^5.5.5"
   },
   "keywords": [
     "React"