@demokit-ui/demokit 0.1.0

package/dist/app/demo1-shell.js

@@ -0,0 +1,616 @@
+import { jsxs as t, Fragment as Z, jsx as e } from "react/jsx-runtime";
+import { useEffect as f, useState as D, useMemo as le, useCallback as ie } from "react";
+import { ThemeToggle as ae } from "../kit/themes/theme-toggle.js";
+import { RiApps2Line as ce, RiMenuLine as de, RiSearchLine as me, RiNotification3Line as ue, RiCheckDoubleLine as he, RiArrowRightSLine as K, RiUserLine as pe, RiFileTextLine as B, RiSettings4Line as fe, RiShieldUserLine as ge, RiLogoutBoxRLine as xe } from "@remixicon/react";
+import { ChevronFirst as be } from "lucide-react";
+import { useLocation as j, Outlet as Ne, useNavigate as ve, Link as A } from "react-router-dom";
+import { toast as p } from "sonner";
+import { cn as v } from "../lib/utils.js";
+import { useSettings as ee } from "../providers/settings-provider.js";
+import { BackgroundDecor as ye } from "./background-decor.js";
+import { Container as te } from "./container.js";
+import { Sheet as we, SheetTrigger as Ce, SheetContent as Se, SheetHeader as Me, SheetBody as ke } from "../kit/components/feedback/sheet/sheet.js";
+import { Button as z } from "../kit/components/form/button/button.js";
+import { Popover as ze, PopoverTrigger as De, PopoverContent as Le } from "../kit/components/feedback/popover/popover.js";
+import { Badge as P } from "../kit/components/data-display/badge/badge.js";
+import { DropdownMenu as Ie, DropdownMenuTrigger as Te, DropdownMenuContent as Ae, DropdownMenuSeparator as E, DropdownMenuLabel as Re, DropdownMenuItem as k } from "../kit/components/feedback/dropdown-menu/dropdown-menu.js";
+import { Avatar as U, AvatarFallback as H } from "../kit/components/data-display/avatar/avatar.js";
+import { Dialog as Ee, DialogContent as $e, DialogHeader as Pe, DialogTitle as Oe, DialogDescription as je } from "../kit/components/feedback/dialog/dialog.js";
+import { Command as _e, CommandInput as Fe, CommandList as Ke, CommandEmpty as Be, CommandGroup as V, CommandItem as W, CommandSeparator as Ue } from "../kit/components/form/command/command.js";
+import { AccordionMenu as He, AccordionMenuLabel as Ve, AccordionMenuItem as T, AccordionMenuSub as G, AccordionMenuSubTrigger as Y, AccordionMenuSubContent as Q, AccordionMenuGroup as q } from "../kit/components/navigation/accordion-menu/accordion-menu.js";
+const J = 992, X = {
+  title: "DemoKit",
+  shortTitle: "D",
+  href: "/",
+  logoIcon: ce
+}, We = {
+  name: "张建国",
+  description: "软件中心 · 项目经理",
+  initials: "张"
+}, Ge = {
+  root: "lg:ps-1 space-y-3",
+  group: "gap-px",
+  label: "uppercase text-xs font-medium text-muted-foreground/70 pt-2.25 pb-px",
+  separator: "",
+  item: "h-8 hover:bg-transparent text-accent-foreground hover:text-primary data-[selected=true]:text-primary data-[selected=true]:bg-muted data-[selected=true]:font-medium",
+  sub: "",
+  subTrigger: "h-8 hover:bg-transparent text-accent-foreground hover:text-primary data-[selected=true]:text-primary data-[selected=true]:bg-muted data-[selected=true]:font-medium",
+  subContent: "py-0",
+  indicator: ""
+};
+function re() {
+  const [s, i] = D(void 0);
+  return f(() => {
+    const l = window.matchMedia(
+      `(max-width: ${J - 1}px)`
+    ), c = () => i(window.innerWidth < J);
+    return l.addEventListener("change", c), c(), () => l.removeEventListener("change", c);
+  }, []), !!s;
+}
+function Ye() {
+  const [s, i] = D(0);
+  return f(() => {
+    const l = () => i(window.scrollY);
+    return window.addEventListener("scroll", l), l(), () => window.removeEventListener("scroll", l);
+  }, []), s;
+}
+function Qe(s, i) {
+  return i ? i === "/" ? i === s : s.startsWith(i) : !1;
+}
+function O(s, i) {
+  for (const l of s) {
+    if (l.path && Qe(i, l.path))
+      return l.children?.length ? O(l.children, i) ?? l : l;
+    if (l.children?.length) {
+      const c = O(l.children, i);
+      if (c) return c;
+    }
+  }
+}
+function $(s) {
+  const i = s.icon;
+  return i ? /* @__PURE__ */ e(i, { "data-slot": "accordion-menu-icon" }) : null;
+}
+function ne({
+  menu: s,
+  disabledBadgeLabel: i
+}) {
+  const { pathname: l } = j(), c = ie(
+    (r) => r === l || r.length > 1 && l.startsWith(r),
+    [l]
+  ), h = (r) => r.map((o, a) => o.heading ? b(o, a) : o.disabled ? w(o, a) : y(o, a)), y = (r, o) => r.children ? /* @__PURE__ */ t(G, { value: r.path || `root-${o}`, children: [
+    /* @__PURE__ */ t(Y, { className: "text-sm font-medium", children: [
+      $(r),
+      /* @__PURE__ */ e("span", { "data-slot": "accordion-menu-title", children: r.title })
+    ] }),
+    /* @__PURE__ */ e(
+      Q,
+      {
+        type: "single",
+        collapsible: !0,
+        parentValue: r.path || `root-${o}`,
+        className: "ps-6",
+        children: /* @__PURE__ */ e(q, { children: g(r.children, 1) })
+      }
+    )
+  ] }, o) : /* @__PURE__ */ e(
+    T,
+    {
+      value: r.path || "",
+      className: "text-sm font-medium",
+      children: /* @__PURE__ */ t(A, { to: r.path || "#", className: "flex items-center grow gap-2", children: [
+        $(r),
+        /* @__PURE__ */ e("span", { "data-slot": "accordion-menu-title", children: r.title })
+      ] })
+    },
+    o
+  ), w = (r, o) => /* @__PURE__ */ t(
+    T,
+    {
+      value: `disabled-${o}`,
+      className: "text-sm font-medium",
+      children: [
+        $(r),
+        /* @__PURE__ */ e("span", { "data-slot": "accordion-menu-title", children: r.title }),
+        /* @__PURE__ */ e(P, { variant: "secondary", size: "sm", className: "ms-auto me-[-10px]", children: i })
+      ]
+    },
+    o
+  ), g = (r, o = 0) => r.map((a, m) => a.disabled ? C(a, m, o) : d(a, m, o)), d = (r, o, a = 0) => r.children ? /* @__PURE__ */ t(
+    G,
+    {
+      value: r.path || `child-${a}-${o}`,
+      children: [
+        /* @__PURE__ */ e(Y, { className: "text-[13px]", children: r.collapse ? /* @__PURE__ */ t("span", { className: "text-muted-foreground", children: [
+          /* @__PURE__ */ e("span", { className: "hidden [[data-state=open]>span>&]:inline", children: r.collapseTitle }),
+          /* @__PURE__ */ e("span", { className: "inline [[data-state=open]>span>&]:hidden", children: r.expandTitle })
+        ] }) : r.title }),
+        /* @__PURE__ */ e(
+          Q,
+          {
+            type: "single",
+            collapsible: !0,
+            parentValue: r.path || `child-${a}-${o}`,
+            className: v("ps-4", !r.collapse && "relative"),
+            children: /* @__PURE__ */ e(q, { children: g(
+              r.children,
+              r.collapse ? a : a + 1
+            ) })
+          }
+        )
+      ]
+    },
+    o
+  ) : /* @__PURE__ */ e(
+    T,
+    {
+      value: r.path || "",
+      className: "text-[13px]",
+      children: /* @__PURE__ */ e(A, { to: r.path || "#", children: r.title })
+    },
+    o
+  ), C = (r, o, a = 0) => /* @__PURE__ */ t(
+    T,
+    {
+      value: `disabled-child-${a}-${o}`,
+      className: "text-[13px]",
+      children: [
+        /* @__PURE__ */ e("span", { "data-slot": "accordion-menu-title", children: r.title }),
+        /* @__PURE__ */ e(P, { variant: "secondary", size: "sm", className: "ms-auto me-[-10px]", children: i })
+      ]
+    },
+    o
+  ), b = (r, o) => /* @__PURE__ */ e(Ve, { children: r.heading }, o);
+  return /* @__PURE__ */ e("div", { className: "kt-scrollable-y-hover flex-1 min-h-0 overflow-y-auto py-5 px-5", children: /* @__PURE__ */ e(
+    He,
+    {
+      selectedValue: l,
+      matchPath: c,
+      type: "single",
+      collapsible: !0,
+      classNames: Ge,
+      children: h(s)
+    }
+  ) });
+}
+function qe({ brand: s }) {
+  const { settings: i, storeOption: l } = ee(), c = s.logoIcon, h = () => {
+    l(
+      "layouts.demo1.sidebarCollapse",
+      !i.layouts.demo1.sidebarCollapse
+    );
+  };
+  return /* @__PURE__ */ t("div", { className: "sidebar-header hidden lg:flex items-center relative justify-between px-3 lg:px-6 shrink-0", children: [
+    /* @__PURE__ */ t(A, { to: s.href ?? "/", className: "flex items-center gap-2", children: [
+      s.logoSrc ? /* @__PURE__ */ e(
+        "img",
+        {
+          src: s.logoSrc,
+          alt: s.logoAlt ?? s.title,
+          className: "size-7 rounded-md"
+        }
+      ) : c ? /* @__PURE__ */ e("span", { className: "size-7 rounded-md inline-flex items-center justify-center bg-primary/10 text-primary", children: /* @__PURE__ */ e(c, { className: "size-4" }) }) : /* @__PURE__ */ e("span", { className: "size-7 rounded-md inline-flex items-center justify-center bg-primary/10 text-primary text-xs font-semibold", children: s.shortTitle ?? s.title.slice(0, 1) }),
+      /* @__PURE__ */ e("span", { className: "font-semibold text-[15px] text-foreground default-logo", children: s.title }),
+      /* @__PURE__ */ e("span", { className: "font-semibold text-[15px] text-foreground small-logo hidden", children: s.shortTitle ?? s.title.slice(0, 1) })
+    ] }),
+    /* @__PURE__ */ e(
+      z,
+      {
+        onClick: h,
+        size: "sm",
+        mode: "icon",
+        variant: "outline",
+        className: v(
+          "size-7 absolute start-full top-2/4 rtl:translate-x-2/4 -translate-x-2/4 -translate-y-2/4",
+          i.layouts.demo1.sidebarCollapse ? "ltr:rotate-180" : "rtl:rotate-180"
+        ),
+        children: /* @__PURE__ */ e(be, { className: "size-4!" })
+      }
+    )
+  ] });
+}
+function Je({
+  brand: s,
+  menu: i,
+  disabledBadgeLabel: l
+}) {
+  return /* @__PURE__ */ t("div", { className: "sidebar bg-background lg:border-e lg:border-border lg:fixed lg:top-0 lg:bottom-0 lg:z-20 lg:flex flex-col items-stretch shrink-0", children: [
+    /* @__PURE__ */ e(qe, { brand: s }),
+    /* @__PURE__ */ e("div", { className: "w-full overflow-hidden flex-1 flex flex-col min-h-0", children: /* @__PURE__ */ t("div", { className: "w-(--sidebar-default-width) flex-1 flex flex-col min-h-0", children: [
+      /* @__PURE__ */ e(
+        ne,
+        {
+          menu: i,
+          disabledBadgeLabel: l
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: "mt-auto shrink-0", children: /* @__PURE__ */ e(ae, {}) })
+    ] }) })
+  ] });
+}
+function Xe({
+  brand: s,
+  menu: i,
+  title: l,
+  disabledBadgeLabel: c,
+  searchPlaceholder: h,
+  searchQuickNav: y,
+  searchRecent: w,
+  notifications: g,
+  user: d
+}) {
+  const [C, b] = D(!1), [r, o] = D(!1), [a, m] = D(g), { pathname: L } = j(), S = ve(), I = re(), x = Ye() > 0, N = le(
+    () => a.filter((n) => n.unread).length,
+    [a]
+  );
+  f(() => {
+    b(!1);
+  }, [L]), f(() => {
+    m(g);
+  }, [g]), f(() => {
+    const n = (u) => {
+      (u.metaKey || u.ctrlKey) && u.key.toLowerCase() === "k" && (u.preventDefault(), o((M) => !M));
+    };
+    return document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n);
+  }, []);
+  const F = (n) => {
+    S(n), o(!1);
+  }, se = () => m(
+    (n) => n.map((u) => ({ ...u, unread: !1 }))
+  ), oe = (n) => {
+    m(
+      (M) => M.map(
+        (R) => R.id === n ? { ...R, unread: !1 } : R
+      )
+    );
+    const u = a.find((M) => M.id === n);
+    u && p.info(u.title, { description: u.desc });
+  };
+  return /* @__PURE__ */ t(Z, { children: [
+    /* @__PURE__ */ e(
+      "header",
+      {
+        className: v(
+          "header fixed top-0 z-10 start-0 flex items-stretch shrink-0 end-0 pe-[var(--removed-body-scroll-bar-size,0px)] transition-[background-color,border-color,backdrop-filter] duration-200",
+          x ? "bg-background/80 backdrop-blur-xl border-b border-border" : "bg-transparent border-b border-transparent"
+        ),
+        children: /* @__PURE__ */ t(te, { className: "flex justify-between items-stretch lg:gap-4", children: [
+          /* @__PURE__ */ t("div", { className: "flex gap-2.5 lg:hidden items-center", children: [
+            /* @__PURE__ */ e(
+              A,
+              {
+                to: s.href ?? "/",
+                className: "shrink-0 font-semibold text-base text-foreground",
+                children: s.title
+              }
+            ),
+            I && /* @__PURE__ */ t(
+              we,
+              {
+                open: C,
+                onOpenChange: b,
+                children: [
+                  /* @__PURE__ */ e(Ce, { asChild: !0, children: /* @__PURE__ */ e(z, { variant: "ghost", mode: "icon", children: /* @__PURE__ */ e(de, { className: "text-muted-foreground" }) }) }),
+                  /* @__PURE__ */ t(
+                    Se,
+                    {
+                      className: "p-0 gap-0 w-[275px]",
+                      side: "left",
+                      close: !1,
+                      children: [
+                        /* @__PURE__ */ e(Me, { className: "p-0 space-y-0" }),
+                        /* @__PURE__ */ e(ke, { className: "p-0 overflow-y-auto", children: /* @__PURE__ */ e(
+                          ne,
+                          {
+                            menu: i,
+                            disabledBadgeLabel: c
+                          }
+                        ) })
+                      ]
+                    }
+                  )
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ e("div", { className: "flex items-center grow lg:ms-0 ms-2", children: /* @__PURE__ */ e("h1", { className: "text-sm font-medium hidden lg:block text-foreground", children: l }) }),
+          /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ e(
+              z,
+              {
+                variant: "ghost",
+                mode: "icon",
+                shape: "circle",
+                onClick: () => o(!0),
+                title: "搜索 (⌘K)",
+                className: "size-9 [&_svg]:text-muted-foreground hover:bg-primary/10 hover:[&_svg]:text-primary",
+                children: /* @__PURE__ */ e(me, { className: "size-4.5!" })
+              }
+            ),
+            /* @__PURE__ */ t(ze, { children: [
+              /* @__PURE__ */ e(De, { asChild: !0, children: /* @__PURE__ */ t(
+                z,
+                {
+                  variant: "ghost",
+                  mode: "icon",
+                  shape: "circle",
+                  title: "通知",
+                  className: "size-9 relative [&_svg]:text-muted-foreground hover:bg-primary/10 hover:[&_svg]:text-primary",
+                  children: [
+                    /* @__PURE__ */ e(ue, { className: "size-4.5!" }),
+                    N > 0 && /* @__PURE__ */ e("span", { className: "absolute top-1.5 right-1.5 size-2 rounded-full bg-destructive" })
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ t(Le, { align: "end", className: "w-80 p-0", children: [
+                /* @__PURE__ */ t("div", { className: "flex items-center justify-between px-3 py-2.5 border-b border-border", children: [
+                  /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ e("span", { className: "text-sm font-semibold text-foreground", children: "通知" }),
+                    N > 0 && /* @__PURE__ */ t(P, { variant: "destructive", appearance: "light", size: "xs", children: [
+                      N,
+                      " 未读"
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ t(
+                    z,
+                    {
+                      variant: "ghost",
+                      size: "sm",
+                      className: "h-6 px-2 text-xs",
+                      disabled: N === 0,
+                      onClick: se,
+                      children: [
+                        /* @__PURE__ */ e(he, { className: "size-3.5" }),
+                        "全部已读"
+                      ]
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ e("div", { className: "max-h-80 overflow-y-auto", children: a.map((n) => /* @__PURE__ */ t(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => oe(n.id),
+                    className: v(
+                      "w-full text-left px-3 py-2.5 border-b border-border last:border-0 hover:bg-muted/60 transition-colors flex gap-2.5",
+                      n.unread && "bg-primary/[0.03]"
+                    ),
+                    children: [
+                      /* @__PURE__ */ e(
+                        "span",
+                        {
+                          className: v(
+                            "mt-1.5 size-1.5 rounded-full shrink-0",
+                            n.type === "warning" && "bg-warning",
+                            n.type === "info" && "bg-primary",
+                            n.type === "success" && "bg-success",
+                            !n.unread && "opacity-30"
+                          )
+                        }
+                      ),
+                      /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
+                        /* @__PURE__ */ t("div", { className: "flex items-baseline justify-between gap-2", children: [
+                          /* @__PURE__ */ e(
+                            "span",
+                            {
+                              className: v(
+                                "text-sm truncate",
+                                n.unread ? "text-foreground font-medium" : "text-muted-foreground"
+                              ),
+                              children: n.title
+                            }
+                          ),
+                          /* @__PURE__ */ e("span", { className: "text-[10px] text-muted-foreground shrink-0 font-mono", children: n.time })
+                        ] }),
+                        /* @__PURE__ */ e("p", { className: "text-xs text-muted-foreground mt-0.5 line-clamp-2", children: n.desc })
+                      ] })
+                    ]
+                  },
+                  n.id
+                )) }),
+                /* @__PURE__ */ e("div", { className: "px-3 py-2 border-t border-border", children: /* @__PURE__ */ t(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => p.info("跳转到通知中心（示例）"),
+                    className: "text-xs text-primary hover:underline inline-flex items-center gap-0.5",
+                    children: [
+                      "查看全部通知 ",
+                      /* @__PURE__ */ e(K, { className: "size-3.5" })
+                    ]
+                  }
+                ) })
+              ] })
+            ] }),
+            /* @__PURE__ */ t(Ie, { children: [
+              /* @__PURE__ */ e(Te, { asChild: !0, children: /* @__PURE__ */ t(
+                "button",
+                {
+                  type: "button",
+                  className: "ms-1 flex items-center gap-2 px-2 py-1 rounded-full cursor-pointer hover:bg-muted/60 transition-colors outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                  children: [
+                    /* @__PURE__ */ e(U, { className: "size-8", children: /* @__PURE__ */ e(H, { className: "bg-primary text-primary-foreground text-xs font-semibold", children: d.initials ?? d.name.slice(0, 1) }) }),
+                    /* @__PURE__ */ e("span", { className: "text-sm hidden md:inline text-foreground", children: d.name })
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ t(Ae, { align: "end", className: "w-56", children: [
+                /* @__PURE__ */ t("div", { className: "px-2 py-2 flex items-center gap-2.5", children: [
+                  /* @__PURE__ */ e(U, { className: "size-10", children: /* @__PURE__ */ e(H, { className: "bg-primary text-primary-foreground font-semibold", children: d.initials ?? d.name.slice(0, 1) }) }),
+                  /* @__PURE__ */ t("div", { className: "min-w-0", children: [
+                    /* @__PURE__ */ e("div", { className: "text-sm font-semibold text-foreground truncate", children: d.name }),
+                    d.description && /* @__PURE__ */ e("div", { className: "text-xs text-muted-foreground truncate", children: d.description })
+                  ] })
+                ] }),
+                /* @__PURE__ */ e(E, {}),
+                /* @__PURE__ */ e(Re, { className: "text-[10px] text-muted-foreground uppercase tracking-wider", children: "账户" }),
+                /* @__PURE__ */ t(
+                  k,
+                  {
+                    onSelect: () => p.info("打开个人主页（示例）"),
+                    children: [
+                      /* @__PURE__ */ e(pe, { className: "size-3.5" }),
+                      "个人主页"
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ t(
+                  k,
+                  {
+                    onSelect: () => p.info("打开我的任务（示例）"),
+                    children: [
+                      /* @__PURE__ */ e(B, { className: "size-3.5" }),
+                      "我的任务"
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ t(
+                  k,
+                  {
+                    onSelect: () => p.info("打开账户设置（示例）"),
+                    children: [
+                      /* @__PURE__ */ e(fe, { className: "size-3.5" }),
+                      "账户设置"
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ e(E, {}),
+                /* @__PURE__ */ t(
+                  k,
+                  {
+                    onSelect: () => d.permissionsPath ? S(d.permissionsPath) : p.info("打开权限与角色（示例）"),
+                    children: [
+                      /* @__PURE__ */ e(ge, { className: "size-3.5" }),
+                      "权限与角色"
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ e(E, {}),
+                /* @__PURE__ */ t(
+                  k,
+                  {
+                    variant: "destructive",
+                    onSelect: () => p.success("已退出登录（示例）"),
+                    children: [
+                      /* @__PURE__ */ e(xe, { className: "size-3.5" }),
+                      "退出登录"
+                    ]
+                  }
+                )
+              ] })
+            ] })
+          ] })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ e(Ee, { open: r, onOpenChange: o, children: /* @__PURE__ */ t($e, { className: "p-0 gap-0 sm:max-w-lg overflow-hidden", children: [
+      /* @__PURE__ */ t(Pe, { className: "sr-only", children: [
+        /* @__PURE__ */ e(Oe, { children: "全局搜索" }),
+        /* @__PURE__ */ e(je, { children: h })
+      ] }),
+      /* @__PURE__ */ t(_e, { children: [
+        /* @__PURE__ */ e(Fe, { placeholder: h }),
+        /* @__PURE__ */ t(Ke, { children: [
+          /* @__PURE__ */ e(Be, { children: "没有匹配结果" }),
+          /* @__PURE__ */ e(V, { heading: "快速跳转", children: y.map((n) => /* @__PURE__ */ t(
+            W,
+            {
+              onSelect: () => n.path ? F(n.path) : p.info("打开：" + n.title),
+              children: [
+                /* @__PURE__ */ e(K, { className: "size-3.5 text-muted-foreground" }),
+                /* @__PURE__ */ e("span", { children: n.title }),
+                n.hint && /* @__PURE__ */ e("span", { className: "ml-auto text-[10px] font-mono text-muted-foreground", children: n.hint })
+              ]
+            },
+            `${n.title}-${n.path ?? n.hint}`
+          )) }),
+          /* @__PURE__ */ e(Ue, {}),
+          /* @__PURE__ */ e(V, { heading: "最近访问", children: w.map((n) => /* @__PURE__ */ t(
+            W,
+            {
+              onSelect: () => n.path ? F(n.path) : p.info("打开：" + n.title),
+              children: [
+                /* @__PURE__ */ e(B, { className: "size-3.5 text-muted-foreground" }),
+                /* @__PURE__ */ e("span", { className: "truncate", children: n.title }),
+                n.hint && /* @__PURE__ */ e("span", { className: "ml-auto text-[10px] text-muted-foreground shrink-0", children: n.hint })
+              ]
+            },
+            `${n.title}-${n.hint}`
+          )) })
+        ] })
+      ] })
+    ] }) })
+  ] });
+}
+function Ze({ footer: s }) {
+  return /* @__PURE__ */ e("footer", { className: "footer", children: /* @__PURE__ */ e(te, { children: /* @__PURE__ */ e("div", { className: "flex flex-col md:flex-row justify-center md:justify-between items-center gap-3 py-5", children: /* @__PURE__ */ e("div", { className: "text-muted-foreground text-sm", children: s }) }) }) });
+}
+function vt({
+  menu: s,
+  brand: i = X,
+  titleFallback: l = "个人工作台",
+  footer: c,
+  disabledBadgeLabel: h = "Soon",
+  searchPlaceholder: y = "搜索页面、缺陷、凭证、成员...",
+  searchQuickNav: w = [],
+  searchRecent: g = [],
+  notifications: d = [],
+  user: C = We,
+  children: b
+}) {
+  const r = re(), { pathname: o } = j(), m = O(s, o)?.title ?? l, { settings: L, setOption: S } = ee(), I = { ...X, ...i }, _ = c ?? `${(/* @__PURE__ */ new Date()).getFullYear()} © DemoKit · Demo design system`;
+  return f(() => {
+    const x = document.body.classList;
+    L.layouts.demo1.sidebarCollapse ? x.add("sidebar-collapse") : x.remove("sidebar-collapse");
+  }, [L.layouts.demo1.sidebarCollapse]), f(() => {
+    S("layout", "demo1");
+  }, [S]), f(() => {
+    const x = document.body.classList;
+    x.add("demo1", "sidebar-fixed", "header-fixed");
+    const N = window.setTimeout(() => {
+      x.add("layout-initialized");
+    }, 1e3);
+    return () => {
+      x.remove(
+        "demo1",
+        "sidebar-fixed",
+        "sidebar-collapse",
+        "header-fixed",
+        "layout-initialized"
+      ), window.clearTimeout(N);
+    };
+  }, []), f(() => {
+    document.title = m;
+  }, [m]), /* @__PURE__ */ t(Z, { children: [
+    /* @__PURE__ */ e(ye, {}),
+    !r && /* @__PURE__ */ e(
+      Je,
+      {
+        brand: I,
+        menu: s,
+        disabledBadgeLabel: h
+      }
+    ),
+    /* @__PURE__ */ t("div", { className: "wrapper flex grow flex-col", children: [
+      /* @__PURE__ */ e(
+        Xe,
+        {
+          brand: I,
+          menu: s,
+          title: m,
+          disabledBadgeLabel: h,
+          searchPlaceholder: y,
+          searchQuickNav: w,
+          searchRecent: g,
+          notifications: d,
+          user: C
+        }
+      ),
+      /* @__PURE__ */ e("main", { className: "grow pt-5", role: "content", children: b ?? /* @__PURE__ */ e(Ne, {}) }),
+      /* @__PURE__ */ e(Ze, { footer: _ })
+    ] })
+  ] });
+}
+export {
+  vt as Demo1Shell
+};

package/dist/app/tweak-panel.d.ts

@@ -0,0 +1,22 @@
+import { ComponentProps, ComponentPropsWithoutRef, ReactNode } from 'react';
+import { PopoverContent } from '../kit/components';
+export interface TweakPanelProps {
+    triggerLabel?: ReactNode;
+    triggerTitle?: string;
+    title?: ReactNode;
+    description?: ReactNode;
+    resetLabel?: ReactNode;
+    side?: ComponentProps<typeof PopoverContent>['side'];
+    align?: ComponentProps<typeof PopoverContent>['align'];
+    sideOffset?: ComponentProps<typeof PopoverContent>['sideOffset'];
+    triggerClassName?: string;
+    contentClassName?: string;
+    showTheme?: boolean;
+    showDensity?: boolean;
+    showRadius?: boolean;
+    showContainer?: boolean;
+}
+export interface TweakScopeProps extends ComponentPropsWithoutRef<'div'> {
+}
+export declare function TweakScope({ className, ...props }: TweakScopeProps): import("react/jsx-runtime").JSX.Element;
+export declare function TweakPanel({ triggerLabel, triggerTitle, title, description, resetLabel, side, align, sideOffset, triggerClassName, contentClassName, showTheme, showDensity, showRadius, showContainer, }: TweakPanelProps): import("react/jsx-runtime").JSX.Element;