@tker-react/layout 0.2.2 → 0.2.4

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Joey
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.d.mts

@@ -85,6 +85,8 @@ interface LayoutContextValue {
     setActivePath: (path: string, fullPath?: string) => void;
     toggleCollapse: () => void;
     setCollapsed: (collapsed: boolean) => void;
+    openKeys: Set<string>;
+    toggleMenuOpen: (path: string, forceOpen?: boolean) => void;
     setExpandedWidth: (width: string) => void;
     setCollapsedWidth: (width: string) => void;
     setLayoutMode: (mode: "side-menu" | "top-menu") => void;

package/dist/index.d.ts

@@ -85,6 +85,8 @@ interface LayoutContextValue {
     setActivePath: (path: string, fullPath?: string) => void;
     toggleCollapse: () => void;
     setCollapsed: (collapsed: boolean) => void;
+    openKeys: Set<string>;
+    toggleMenuOpen: (path: string, forceOpen?: boolean) => void;
     setExpandedWidth: (width: string) => void;
     setCollapsedWidth: (width: string) => void;
     setLayoutMode: (mode: "side-menu" | "top-menu") => void;

package/dist/index.mjs

@@ -99,10 +99,37 @@ function LayoutProvider({ children }) {
     "side-menu"
   );
   const setMenus = useCallback((data) => setMenuData(data), []);
-  const toggleCollapse = useCallback(
-    () => setCollapsedState((p) => !p),
-    []
-  );
+  const [openKeys, setOpenKeys] = useState(/* @__PURE__ */ new Set());
+  const savedOpenKeysRef = useRef(/* @__PURE__ */ new Set());
+  const openKeysRef = useRef(openKeys);
+  openKeysRef.current = openKeys;
+  const collapsedRef = useRef(collapsed);
+  collapsedRef.current = collapsed;
+  const toggleMenuOpen = useCallback((path, forceOpen) => {
+    setOpenKeys((prev) => {
+      const next = new Set(prev);
+      if (forceOpen === true) {
+        next.add(path);
+      } else if (forceOpen === false) {
+        next.delete(path);
+      } else if (next.has(path)) {
+        next.delete(path);
+      } else {
+        next.add(path);
+      }
+      return next;
+    });
+  }, []);
+  const toggleCollapse = useCallback(() => {
+    const nextCollapsed = !collapsedRef.current;
+    if (nextCollapsed) {
+      savedOpenKeysRef.current = new Set(openKeysRef.current);
+      setOpenKeys(/* @__PURE__ */ new Set());
+    } else {
+      setOpenKeys(new Set(savedOpenKeysRef.current));
+    }
+    setCollapsedState(nextCollapsed);
+  }, []);
   const pathParamsMap = useRef(/* @__PURE__ */ new Map());
   const storePathParams = useCallback((path, fullPath) => {
     if (fullPath && fullPath !== path) {
@@ -153,7 +180,17 @@ function LayoutProvider({ children }) {
       setMenus,
       setActivePath,
       toggleCollapse,
-      setCollapsed: setCollapsedState,
+      setCollapsed: (val) => {
+        if (val) {
+          savedOpenKeysRef.current = new Set(openKeysRef.current);
+          setOpenKeys(/* @__PURE__ */ new Set());
+        } else {
+          setOpenKeys(new Set(savedOpenKeysRef.current));
+        }
+        setCollapsedState(val);
+      },
+      openKeys,
+      toggleMenuOpen,
       setExpandedWidth,
       setCollapsedWidth,
       setLayoutMode,
@@ -183,6 +220,8 @@ function LayoutProvider({ children }) {
       setMenus,
       setActivePath,
       toggleCollapse,
+      openKeys,
+      toggleMenuOpen,
       isConcretePage,
       getFullPath,
       setNavigateAdapter,

package/package.json

@@ -1,43 +1,36 @@
 {
-    "name": "@tker-react/layout",
-    "version": "0.2.2",
-    "private": false,
-    "license": "MIT",
-    "type": "module",
-    "scripts": {
-        "build": "pnpm unbuild"
-    },
-    "files": [
-        "dist"
-    ],
-    "sideEffects": [
-        "**/*.css"
-    ],
-    "exports": {
-        ".": {
-            "types": "./dist/index.d.ts",
-            "development": "./src/index.ts",
-            "default": "./dist/index.mjs"
-        }
-    },
-    "publishConfig": {
-        "access": "public",
-        "exports": {
-            ".": {
-                "types": "./dist/index.d.ts",
-                "default": "./dist/index.mjs"
-            }
-        }
-    },
-    "peerDependencies": {
-        "react": ">=18",
-        "react-dom": ">=18"
-    },
-    "devDependencies": {
-        "@tker-react/tsconfig": "workspace:*",
-        "@types/react": "catalog:",
-        "@types/react-dom": "catalog:",
-        "react": "catalog:",
-        "react-dom": "catalog:"
+  "name": "@tker-react/layout",
+  "version": "0.2.4",
+  "private": false,
+  "license": "MIT",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.mjs"
     }
-}
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "react": "^19.2.6",
+    "react-dom": "^19.2.6",
+    "@tker-react/tsconfig": "0.0.1"
+  },
+  "scripts": {
+    "build": "pnpm unbuild"
+  }
+}