elbe-ui 0.4.14 → 0.4.15

package/dist/ui/components/layout/app_base.d.ts

@@ -1,10 +1,12 @@
-import { ElbeChild, ElbeChildren, HeaderLogos } from "../../..";
+import { VNode } from "preact";
+import { NestedArray } from "preact-iso";
+import { ElbeChild, HeaderLogos } from "../../..";
 import { MenuItem } from "./menu";
 export type AppBaseProps = HeaderLogos & {
     initial?: string;
     menu: MenuItem[];
     globalActions?: ElbeChild[];
-    children: ElbeChildren;
+    children: NestedArray<VNode>;
 };
 /**
  * app base is a layout component that provides a side menu and a content area.
@@ -12,4 +14,8 @@ export type AppBaseProps = HeaderLogos & {
  * used to create a consistent layout for pages. You can also pass global actions
  * that will be displayed in the header of all pages.
  */
-export declare function AppBase(p: AppBaseProps): import("preact/compat").JSX.Element;
+export declare function AppBase(p: AppBaseProps): import("preact").JSX.Element;
+export declare const Redirect: (p: {
+    path: string;
+    to: string;
+}) => null;

package/dist/ui/components/layout/app_base.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
-import { useState } from "preact/compat";
+import { Router, useLocation } from "preact-iso";
+import { useEffect, useState } from "preact/compat";
 import { Box } from "../../..";
 import { AppBaseContext } from "./ctx_app_base";
 import { Menu } from "./menu";
@@ -10,7 +11,7 @@ import { Menu } from "./menu";
  * that will be displayed in the header of all pages.
  */
 export function AppBase(p) {
-    var _a;
+    var _a, _b;
     const [menuOpen, setMenuOpen] = useState(false);
     return (_jsx(AppBaseContext.Provider, { value: {
             menuOpen: menuOpen,
@@ -26,5 +27,12 @@ export function AppBase(p) {
                 display: "flex",
                 width: "100%",
                 minHeight: "100vh",
-            }, children: [_jsx(Menu, { items: p.menu }), _jsx("div", { style: { flex: 1 }, children: p.children })] }) }));
+            }, children: [_jsx(Menu, { items: p.menu }), _jsx("div", { style: { flex: 1 }, children: _jsxs(Router, { children: [_jsx(Redirect, { path: "/", to: `/${(_b = p.initial) !== null && _b !== void 0 ? _b : p.menu[0].id}` }), p.children] }) })] }) }));
 }
+export const Redirect = (p) => {
+    const location = useLocation();
+    useEffect(() => {
+        location.route(p.to, true);
+    }, [p.to]);
+    return null; // This component doesn't render anything
+};

package/dist/ui/components/layout/menu.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "preact/jsx-runtime";
-import { useComputed } from "@preact/signals";
 import { MenuIcon } from "lucide-react";
-import { route } from "preact-router";
+import { useLocation } from "preact-iso";
 import { useLayoutMode, useTheme, useThemeConfig } from "../../..";
 import { Card, elevatedShadow } from "../base/card";
 import { Button } from "../button/button";
@@ -54,10 +53,7 @@ export function Menu(p) {
                             } }), _jsx(Column, { flex: 1, scroll: true, noScrollbar: true, children: topBot.top.map((i) => (_jsx(_MenuItemView, { item: i }))) }), topBot.bottom.map((i) => (_jsx(_MenuItemView, { item: i })))] })) })] }));
 }
 function _MenuItemView({ item }) {
-    const selected = useComputed(() => {
-        const log = document.location.pathname;
-        return log.startsWith(`/${item.id}`);
-    });
+    const location = useLocation();
     const appBase = useAppBase();
-    return (_jsx(Button, { ariaLabel: item.label, contentAlign: "start", manner: selected.value ? "major" : "plain", label: appBase.menuOpen ? item.label : undefined, icon: item.icon, onTap: item.disabled ? undefined : () => route(`/${item.id}`, true) }));
+    return (_jsx(Button, { ariaLabel: item.label, contentAlign: "start", manner: location.path.startsWith(`/${item.id}`) ? "major" : "plain", label: appBase.menuOpen ? item.label : undefined, icon: item.icon, onTap: item.disabled ? undefined : () => location.route(`/${item.id}`, true) }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "elbe-ui",
-  "version": "0.4.14",
+  "version": "0.4.15",
   "author": "Robin Naumann",
   "license": "MIT",
   "repository": {
@@ -38,6 +38,7 @@
     "colors-convert": "^1.4.1",
     "lucide-react": "^0.438.0",
     "preact": "^10.24.2",
+    "preact-iso": "^2.9.1",
     "preact-router": "^4.1.2",
     "vite": "^5.4.10"
   }