@lobehub/ui 5.48.2 → 5.49.0

package/es/dashboard/ConsoleNav/type.d.mts

@@ -0,0 +1,71 @@
+import { IconProps } from "../../Icon/type.mjs";
+import "../../Icon/index.mjs";
+import { ReactNode } from "react";
+//#region src/dashboard/ConsoleNav/type.d.ts
+interface ConsoleNavItem {
+  /** Count shown beside the label. Collapses to a dot on the icon rail. */
+  badge?: number;
+  /** Match only this path, not its descendants. `/` is always exact. */
+  end?: boolean;
+  /** Opens in a new tab. The default anchor adds `target` and `rel`. */
+  external?: boolean;
+  href: string;
+  /** Omit for a text-only row. Items without an icon are left off the icon rail. */
+  icon?: IconProps['icon'];
+  label: string;
+}
+interface ConsoleNavGroup {
+  /** Start open or closed, overriding the nav-wide `defaultExpanded` for this group. */
+  defaultExpanded?: boolean;
+  /** Nested groups, listed after this group's own items. */
+  groups?: ConsoleNavGroup[];
+  /** Overview page for the group. On the icon rail, a group with an icon links here. */
+  href?: string;
+  /** Shown before the label. On the icon rail the whole group folds into this icon. */
+  icon?: IconProps['icon'];
+  items?: ConsoleNavItem[];
+  key: string;
+  label: string;
+}
+interface ConsoleNavLinkProps {
+  'aria-current'?: 'page';
+  'aria-label'?: string;
+  'children': ReactNode;
+  'className': string;
+  'data-active': boolean;
+  'data-collapsed': boolean;
+  /** Nesting depth used for inline padding. Spread it onto the rendered link. */
+  'data-indent': number;
+  'external'?: boolean;
+  'href': string;
+  'onClick': () => void;
+  'title'?: string;
+}
+interface ConsoleNavProps {
+  /** Show the icon rail. Defaults to the enclosing `ConsoleShell` state. */
+  collapsed?: boolean;
+  /**
+   * `all` opens every group. `active` starts with every group closed and opens
+   * the branch holding the current page, including after navigation.
+   * @default 'all'
+   */
+  defaultExpanded?: 'active' | 'all';
+  groups?: ConsoleNavGroup[];
+  /** Ungrouped links listed before the groups. */
+  items?: ConsoleNavItem[];
+  /** Accessible name for the navigation landmark. */
+  label?: string;
+  /** Called with the item href. Prevents the anchor navigation when set. */
+  onNavigate?: (href: string) => void;
+  pathname: string;
+  /**
+   * Renders each item link. Use this to plug in a router `Link`.
+   * The default render is an anchor.
+   */
+  renderLink?: (props: ConsoleNavLinkProps) => ReactNode;
+  /** Persists which groups were opened or closed by hand. */
+  storageKey?: string;
+}
+//#endregion
+export { ConsoleNavGroup, ConsoleNavItem, ConsoleNavLinkProps, ConsoleNavProps };
+//# sourceMappingURL=type.d.mts.map

package/es/dashboard/ConsoleShell/ConsoleBrand.d.mts

@@ -0,0 +1,9 @@
+import { ConsoleBrandProps } from "./type.mjs";
+//#region src/dashboard/ConsoleShell/ConsoleBrand.d.ts
+declare function ConsoleBrand({ href, label, logo, renderLink, title }: ConsoleBrandProps): string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react").JSX.Element | null | undefined;
+declare namespace ConsoleBrand {
+  var displayName: string;
+}
+//#endregion
+export { ConsoleBrand as default };
+//# sourceMappingURL=ConsoleBrand.d.mts.map

package/es/dashboard/ConsoleShell/ConsoleBrand.mjs

@@ -0,0 +1,37 @@
+"use client";
+import { useConsoleShellState } from "./context.mjs";
+import { styles } from "./style.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/dashboard/ConsoleShell/ConsoleBrand.tsx
+function ConsoleBrand({ href = "/", label, logo, renderLink, title }) {
+	const shell = useConsoleShellState();
+	const collapsed = shell?.collapsed ?? false;
+	const lockup = title == null || title === false || title === "" ? logo : /* @__PURE__ */ jsxs("span", {
+		className: styles.brandLockup,
+		children: [logo, /* @__PURE__ */ jsx("span", {
+			className: styles.brandName,
+			children: title
+		})]
+	});
+	const content = collapsed ? logo : lockup;
+	const linkProps = {
+		"aria-label": label ?? (typeof title === "string" ? title : "Home"),
+		"children": content,
+		"className": styles.brandAnchor,
+		href,
+		"onClick": () => shell?.closeNavigation()
+	};
+	if (renderLink) return renderLink(linkProps);
+	return /* @__PURE__ */ jsx("a", {
+		"aria-label": linkProps["aria-label"],
+		className: linkProps.className,
+		href,
+		onClick: linkProps.onClick,
+		children: content
+	});
+}
+ConsoleBrand.displayName = "ConsoleBrand";
+//#endregion
+export { ConsoleBrand as default };
+
+//# sourceMappingURL=ConsoleBrand.mjs.map

package/es/dashboard/ConsoleShell/ConsoleBrand.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConsoleBrand.mjs","names":[],"sources":["../../../src/dashboard/ConsoleShell/ConsoleBrand.tsx"],"sourcesContent":["'use client';\n\nimport { useConsoleShellState } from './context';\nimport { styles } from './style';\nimport type { ConsoleBrandProps } from './type';\n\nfunction ConsoleBrand({ href = '/', label, logo, renderLink, title }: ConsoleBrandProps) {\n  const shell = useConsoleShellState();\n  const collapsed = shell?.collapsed ?? false;\n  const lockup =\n    title == null || title === false || title === '' ? (\n      logo\n    ) : (\n      <span className={styles.brandLockup}>\n        {logo}\n        <span className={styles.brandName}>{title}</span>\n      </span>\n    );\n  const content = collapsed ? logo : lockup;\n  const linkProps = {\n    'aria-label': label ?? (typeof title === 'string' ? title : 'Home'),\n    'children': content,\n    'className': styles.brandAnchor,\n    href,\n    'onClick': () => shell?.closeNavigation(),\n  };\n  if (renderLink) return renderLink(linkProps);\n  return (\n    <a\n      aria-label={linkProps['aria-label']}\n      className={linkProps.className}\n      href={href}\n      onClick={linkProps.onClick}\n    >\n      {content}\n    </a>\n  );\n}\n\nConsoleBrand.displayName = 'ConsoleBrand';\n\nexport default ConsoleBrand;\n"],"mappings":";;;;;AAMA,SAAS,aAAa,EAAE,OAAO,KAAK,OAAO,MAAM,YAAY,SAA4B;CACvF,MAAM,QAAQ,qBAAqB;CACnC,MAAM,YAAY,OAAO,aAAa;CACtC,MAAM,SACJ,SAAS,QAAQ,UAAU,SAAS,UAAU,KAC5C,OAEA,qBAAC,QAAD;EAAM,WAAW,OAAO;EAAxB,UAAA,CACG,MACD,oBAAC,QAAD;GAAM,WAAW,OAAO;GAAY,UAAA;EAAY,CAAA,CAC5C;;CAEV,MAAM,UAAU,YAAY,OAAO;CACnC,MAAM,YAAY;EAChB,cAAc,UAAU,OAAO,UAAU,WAAW,QAAQ;EAC5D,YAAY;EACZ,aAAa,OAAO;EACpB;EACA,iBAAiB,OAAO,gBAAgB;CAC1C;CACA,IAAI,YAAY,OAAO,WAAW,SAAS;CAC3C,OACE,oBAAC,KAAD;EACE,cAAY,UAAU;EACtB,WAAW,UAAU;EACf;EACN,SAAS,UAAU;EAElB,UAAA;CACA,CAAA;AAEP;AAEA,aAAa,cAAc"}

package/es/dashboard/ConsoleShell/ConsoleShell.d.mts

@@ -0,0 +1,9 @@
+import { ConsoleShellProps } from "./type.mjs";
+//#region src/dashboard/ConsoleShell/ConsoleShell.d.ts
+declare function ConsoleShell({ brand, breadcrumb, children, className, collapsed, collapseLabel, defaultCollapsed, expandLabel, footer, hotkey, navigation, onCollapsedChange, openNavigationLabel, skipToContentLabel, storageKey, tools, ...rest }: ConsoleShellProps): import("react").JSX.Element;
+declare namespace ConsoleShell {
+  var displayName: string;
+}
+//#endregion
+export { ConsoleShell as default };
+//# sourceMappingURL=ConsoleShell.d.mts.map

package/es/dashboard/ConsoleShell/ConsoleShell.mjs

@@ -0,0 +1,149 @@
+"use client";
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import Button from "../../base-ui/Button/Button.mjs";
+import Drawer from "../../base-ui/Drawer/Drawer.mjs";
+import { ConsoleShellContext } from "./context.mjs";
+import { useIsCompact, useLocalStorage, usePrefersReducedMotion } from "../hooks.mjs";
+import { styles } from "./style.mjs";
+import { useEffect, useId, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { PanelLeft } from "lucide-react";
+//#region src/dashboard/ConsoleShell/ConsoleShell.tsx
+function isTypingTarget(target) {
+	if (!(target instanceof HTMLElement)) return false;
+	const tag = target.tagName;
+	return tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT" || target.isContentEditable;
+}
+function ConsoleShell({ brand, breadcrumb, children, className, collapsed, collapseLabel = "Collapse sidebar", defaultCollapsed = false, expandLabel = "Expand sidebar", footer, hotkey = true, navigation, onCollapsedChange, openNavigationLabel = "Open navigation", skipToContentLabel = "Skip to content", storageKey, tools, ...rest }) {
+	const mainId = `console-main-${useId().replaceAll(":", "")}`;
+	const shellRef = useRef(null);
+	const isCompact = useIsCompact();
+	const reducedMotion = usePrefersReducedMotion();
+	const [storedCollapsed, setStoredCollapsed] = useLocalStorage(storageKey, defaultCollapsed);
+	const [drawerOpen, setDrawerOpen] = useState(false);
+	const isControlled = collapsed !== void 0;
+	const railCollapsed = isControlled ? collapsed : storedCollapsed;
+	const railed = railCollapsed && !isCompact;
+	const setCollapsed = (next) => {
+		if (!isControlled) setStoredCollapsed(next);
+		onCollapsedChange?.(next);
+	};
+	const closeNavigation = () => setDrawerOpen(false);
+	const toggleNavigation = () => {
+		if (isCompact) {
+			setDrawerOpen((open) => !open);
+			return;
+		}
+		setCollapsed(!railCollapsed);
+	};
+	const toggleRef = useRef(toggleNavigation);
+	toggleRef.current = toggleNavigation;
+	useEffect(() => {
+		if (!hotkey) return;
+		const node = shellRef.current;
+		if (!node) return;
+		const onKeyDown = (event) => {
+			if (event.key.toLowerCase() !== "b" || !(event.metaKey || event.ctrlKey) || event.altKey) return;
+			if (event.repeat || isTypingTarget(event.target)) return;
+			if (!node.contains(event.target)) return;
+			event.preventDefault();
+			toggleRef.current();
+		};
+		document.addEventListener("keydown", onKeyDown);
+		return () => document.removeEventListener("keydown", onKeyDown);
+	}, [hotkey]);
+	const stateFor = (rail) => ({
+		closeNavigation,
+		collapsed: rail,
+		compact: isCompact
+	});
+	const sidebar = (rail) => /* @__PURE__ */ jsxs(ConsoleShellContext, {
+		value: stateFor(rail),
+		children: [
+			brand ? /* @__PURE__ */ jsx("div", {
+				className: styles.brand,
+				"data-collapsed": rail,
+				children: brand
+			}) : null,
+			navigation ? /* @__PURE__ */ jsx("div", {
+				className: styles.navSlot,
+				children: navigation
+			}) : null,
+			footer ? /* @__PURE__ */ jsx("div", {
+				className: styles.sidebarBottom,
+				children: footer
+			}) : null
+		]
+	});
+	const toggleLabel = isCompact ? openNavigationLabel : railed ? expandLabel : collapseLabel;
+	return /* @__PURE__ */ jsxs("div", {
+		className: className ? `${styles.shell} ${className}` : styles.shell,
+		"data-console-shell": "",
+		ref: shellRef,
+		...rest,
+		children: [
+			/* @__PURE__ */ jsx("a", {
+				className: styles.skipLink,
+				href: `#${mainId}`,
+				onClick: (event) => {
+					event.preventDefault();
+					document.getElementById(mainId)?.focus();
+				},
+				children: skipToContentLabel
+			}),
+			/* @__PURE__ */ jsx("aside", {
+				className: styles.sidebar,
+				"data-collapsed": railed,
+				"data-instant": reducedMotion,
+				children: !isCompact && sidebar(railed)
+			}),
+			isCompact ? /* @__PURE__ */ jsx(Drawer, {
+				noHeader: true,
+				open: drawerOpen,
+				placement: "left",
+				width: 272,
+				onClose: closeNavigation,
+				children: /* @__PURE__ */ jsx(FlexBasic_default, {
+					height: "100%",
+					children: sidebar(false)
+				})
+			}) : null,
+			/* @__PURE__ */ jsxs("div", {
+				className: styles.workspace,
+				children: [/* @__PURE__ */ jsxs("header", {
+					className: styles.topbar,
+					children: [
+						/* @__PURE__ */ jsx(Button, {
+							"aria-label": toggleLabel,
+							icon: PanelLeft,
+							type: "text",
+							onClick: toggleNavigation
+						}),
+						/* @__PURE__ */ jsx("span", {
+							"aria-hidden": true,
+							className: styles.topbarDivider
+						}),
+						/* @__PURE__ */ jsx("div", {
+							className: styles.topbarMain,
+							children: breadcrumb
+						}),
+						tools ? /* @__PURE__ */ jsx("div", {
+							className: styles.tools,
+							children: tools
+						}) : null
+					]
+				}), /* @__PURE__ */ jsx("main", {
+					className: styles.main,
+					id: mainId,
+					tabIndex: -1,
+					children
+				})]
+			})
+		]
+	});
+}
+ConsoleShell.displayName = "ConsoleShell";
+//#endregion
+export { ConsoleShell as default };
+
+//# sourceMappingURL=ConsoleShell.mjs.map

package/es/dashboard/ConsoleShell/ConsoleShell.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConsoleShell.mjs","names":["Flexbox"],"sources":["../../../src/dashboard/ConsoleShell/ConsoleShell.tsx"],"sourcesContent":["'use client';\n\nimport { PanelLeft } from 'lucide-react';\nimport { useEffect, useId, useRef, useState } from 'react';\n\nimport Button from '@/base-ui/Button';\nimport { Drawer } from '@/base-ui/Drawer';\nimport { Flexbox } from '@/Flex';\n\nimport { useIsCompact, useLocalStorage, usePrefersReducedMotion } from '../hooks';\nimport { ConsoleShellContext } from './context';\nimport { styles } from './style';\nimport type { ConsoleShellProps, ConsoleShellState } from './type';\n\nfunction isTypingTarget(target: EventTarget | null) {\n  if (!(target instanceof HTMLElement)) return false;\n  const tag = target.tagName;\n  return tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT' || target.isContentEditable;\n}\n\nfunction ConsoleShell({\n  brand,\n  breadcrumb,\n  children,\n  className,\n  collapsed,\n  collapseLabel = 'Collapse sidebar',\n  defaultCollapsed = false,\n  expandLabel = 'Expand sidebar',\n  footer,\n  hotkey = true,\n  navigation,\n  onCollapsedChange,\n  openNavigationLabel = 'Open navigation',\n  skipToContentLabel = 'Skip to content',\n  storageKey,\n  tools,\n  ...rest\n}: ConsoleShellProps) {\n  const mainId = `console-main-${useId().replaceAll(':', '')}`;\n  const shellRef = useRef<HTMLDivElement>(null);\n  const isCompact = useIsCompact();\n  const reducedMotion = usePrefersReducedMotion();\n  const [storedCollapsed, setStoredCollapsed] = useLocalStorage(storageKey, defaultCollapsed);\n  const [drawerOpen, setDrawerOpen] = useState(false);\n  const isControlled = collapsed !== undefined;\n  const railCollapsed = isControlled ? collapsed : storedCollapsed;\n  const railed = railCollapsed && !isCompact;\n\n  const setCollapsed = (next: boolean) => {\n    if (!isControlled) setStoredCollapsed(next);\n    onCollapsedChange?.(next);\n  };\n\n  const closeNavigation = () => setDrawerOpen(false);\n  const toggleNavigation = () => {\n    if (isCompact) {\n      setDrawerOpen((open) => !open);\n      return;\n    }\n    setCollapsed(!railCollapsed);\n  };\n  const toggleRef = useRef(toggleNavigation);\n  toggleRef.current = toggleNavigation;\n\n  useEffect(() => {\n    if (!hotkey) return;\n    const node = shellRef.current;\n    if (!node) return;\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key.toLowerCase() !== 'b' || !(event.metaKey || event.ctrlKey) || event.altKey) {\n        return;\n      }\n      if (event.repeat || isTypingTarget(event.target)) return;\n      if (!node.contains(event.target as Node)) return;\n      event.preventDefault();\n      toggleRef.current();\n    };\n\n    document.addEventListener('keydown', onKeyDown);\n    return () => document.removeEventListener('keydown', onKeyDown);\n  }, [hotkey]);\n\n  const stateFor = (rail: boolean): ConsoleShellState => ({\n    closeNavigation,\n    collapsed: rail,\n    compact: isCompact,\n  });\n\n  const sidebar = (rail: boolean) => (\n    <ConsoleShellContext value={stateFor(rail)}>\n      {brand ? (\n        <div className={styles.brand} data-collapsed={rail}>\n          {brand}\n        </div>\n      ) : null}\n      {navigation ? <div className={styles.navSlot}>{navigation}</div> : null}\n      {footer ? <div className={styles.sidebarBottom}>{footer}</div> : null}\n    </ConsoleShellContext>\n  );\n\n  const toggleLabel = isCompact ? openNavigationLabel : railed ? expandLabel : collapseLabel;\n\n  return (\n    <div\n      className={className ? `${styles.shell} ${className}` : styles.shell}\n      data-console-shell=\"\"\n      ref={shellRef}\n      {...rest}\n    >\n      <a\n        className={styles.skipLink}\n        href={`#${mainId}`}\n        onClick={(event) => {\n          event.preventDefault();\n          document.getElementById(mainId)?.focus();\n        }}\n      >\n        {skipToContentLabel}\n      </a>\n      <aside className={styles.sidebar} data-collapsed={railed} data-instant={reducedMotion}>\n        {!isCompact && sidebar(railed)}\n      </aside>\n      {isCompact ? (\n        <Drawer noHeader open={drawerOpen} placement=\"left\" width={272} onClose={closeNavigation}>\n          <Flexbox height=\"100%\">{sidebar(false)}</Flexbox>\n        </Drawer>\n      ) : null}\n      <div className={styles.workspace}>\n        <header className={styles.topbar}>\n          <Button\n            aria-label={toggleLabel}\n            icon={PanelLeft}\n            type=\"text\"\n            onClick={toggleNavigation}\n          />\n          <span aria-hidden className={styles.topbarDivider} />\n          <div className={styles.topbarMain}>{breadcrumb}</div>\n          {tools ? <div className={styles.tools}>{tools}</div> : null}\n        </header>\n        <main className={styles.main} id={mainId} tabIndex={-1}>\n          {children}\n        </main>\n      </div>\n    </div>\n  );\n}\n\nConsoleShell.displayName = 'ConsoleShell';\n\nexport default ConsoleShell;\n"],"mappings":"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"}

package/es/dashboard/ConsoleShell/context.d.mts

@@ -0,0 +1,6 @@
+import { ConsoleShellState } from "./type.mjs";
+//#region src/dashboard/ConsoleShell/context.d.ts
+declare function useConsoleShell(): ConsoleShellState;
+//#endregion
+export { useConsoleShell };
+//# sourceMappingURL=context.d.mts.map

package/es/dashboard/ConsoleShell/context.mjs

@@ -0,0 +1,16 @@
+"use client";
+import { createContext, use } from "react";
+//#region src/dashboard/ConsoleShell/context.ts
+const ConsoleShellContext = createContext(null);
+function useConsoleShell() {
+	const value = use(ConsoleShellContext);
+	if (!value) throw new Error("useConsoleShell must be used within ConsoleShell");
+	return value;
+}
+function useConsoleShellState() {
+	return use(ConsoleShellContext);
+}
+//#endregion
+export { ConsoleShellContext, useConsoleShell, useConsoleShellState };
+
+//# sourceMappingURL=context.mjs.map

package/es/dashboard/ConsoleShell/context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.mjs","names":[],"sources":["../../../src/dashboard/ConsoleShell/context.ts"],"sourcesContent":["'use client';\n\nimport { createContext, use } from 'react';\n\nimport type { ConsoleShellState } from './type';\n\nexport const ConsoleShellContext = createContext<ConsoleShellState | null>(null);\n\nexport function useConsoleShell(): ConsoleShellState {\n  const value = use(ConsoleShellContext);\n  if (!value) throw new Error('useConsoleShell must be used within ConsoleShell');\n  return value;\n}\n\nexport function useConsoleShellState(): ConsoleShellState | null {\n  return use(ConsoleShellContext);\n}\n"],"mappings":";;;AAMA,MAAa,sBAAsB,cAAwC,IAAI;AAE/E,SAAgB,kBAAqC;CACnD,MAAM,QAAQ,IAAI,mBAAmB;CACrC,IAAI,CAAC,OAAO,MAAM,IAAI,MAAM,kDAAkD;CAC9E,OAAO;AACT;AAEA,SAAgB,uBAAiD;CAC/D,OAAO,IAAI,mBAAmB;AAChC"}

package/es/dashboard/ConsoleShell/index.d.mts

@@ -0,0 +1,5 @@
+import { ConsoleBrandLinkProps, ConsoleBrandProps, ConsoleShellProps, ConsoleShellState } from "./type.mjs";
+import ConsoleBrand from "./ConsoleBrand.mjs";
+import ConsoleShell from "./ConsoleShell.mjs";
+import { useConsoleShell } from "./context.mjs";
+export { ConsoleBrand, type ConsoleBrandProps, type ConsoleShellProps, type ConsoleShellState, ConsoleShell as default, useConsoleShell };

package/es/dashboard/ConsoleShell/style.mjs

@@ -0,0 +1,209 @@
+import { createStaticStyles } from "antd-style";
+//#region src/dashboard/ConsoleShell/style.ts
+const SIDEBAR_INLINE_SIZE = 248;
+const SIDEBAR_RAIL_INLINE_SIZE = 64;
+const WORKSPACE_INSET = 8;
+/**
+* `responsive.laptop`, not `responsive.tablet`. The aliases are named for
+* devices, and only `laptop` (max-width 991px) lines up with `useIsCompact`.
+*/
+const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
+	brand: css`
+    display: flex;
+    flex: none;
+    align-items: center;
+
+    block-size: 56px;
+    margin-block-start: ${WORKSPACE_INSET}px;
+    padding-inline: 16px;
+
+    color: ${cssVar.colorText};
+
+    &[data-collapsed='true'] {
+      justify-content: center;
+      padding-inline: 0;
+
+      > * {
+        justify-content: center;
+        inline-size: auto;
+      }
+    }
+
+    ${responsive.laptop} {
+      margin-block-start: 0;
+    }
+  `,
+	brandAnchor: css`
+    display: flex;
+    align-items: center;
+
+    inline-size: 100%;
+    min-inline-size: 0;
+
+    color: inherit;
+    text-decoration: none;
+  `,
+	brandLockup: css`
+    display: flex;
+    gap: 10px;
+    align-items: center;
+    min-inline-size: 0;
+  `,
+	brandName: css`
+    overflow: hidden;
+
+    font-size: 14px;
+    font-weight: 600;
+    line-height: 1.3;
+    color: ${cssVar.colorText};
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  `,
+	main: css`
+    overflow: auto;
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    gap: 20px;
+
+    min-inline-size: 0;
+    min-block-size: 0;
+    padding: 24px;
+
+    /*
+     * A page that owns a full-height split sets data-page-layout="flush" and
+     * takes over padding and scrolling, so its sidebar can sit on the card edge.
+     */
+    &:has([data-page-layout='flush']) {
+      overflow: hidden;
+      gap: 0;
+      padding: 0;
+    }
+
+    ${responsive.mobile} {
+      gap: 16px;
+      padding: 16px;
+    }
+  `,
+	navSlot: css`
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    min-block-size: 0;
+  `,
+	shell: css`
+    overflow: hidden;
+    display: flex;
+    flex: 1;
+
+    block-size: 100%;
+    min-block-size: 0;
+
+    background: ${cssVar.colorBgLayout};
+  `,
+	sidebar: css`
+    display: flex;
+    flex: none;
+    flex-direction: column;
+
+    inline-size: ${SIDEBAR_INLINE_SIZE}px;
+    block-size: 100%;
+    min-block-size: 0;
+
+    transition: inline-size 200ms ease;
+
+    &[data-collapsed='true'] {
+      inline-size: ${SIDEBAR_RAIL_INLINE_SIZE}px;
+    }
+
+    &[data-instant='true'] {
+      transition: none;
+    }
+
+    ${responsive.laptop} {
+      display: none;
+    }
+  `,
+	sidebarBottom: css`
+    flex: none;
+    padding: 8px;
+  `,
+	skipLink: css`
+    position: fixed;
+    z-index: 2000;
+    inset-block-start: -100px;
+    inset-inline-start: 12px;
+
+    padding-block: 8px;
+    padding-inline: 12px;
+    border-radius: ${cssVar.borderRadius};
+
+    color: ${cssVar.colorText};
+
+    background: ${cssVar.colorBgElevated};
+
+    &:focus {
+      inset-block-start: 12px;
+    }
+  `,
+	topbar: css`
+    display: flex;
+    flex: none;
+    gap: 8px;
+    align-items: center;
+
+    block-size: 56px;
+    padding-inline: 12px;
+    border-block-end: 1px solid ${cssVar.colorBorderSecondary};
+  `,
+	topbarDivider: css`
+    flex: none;
+
+    inline-size: 1px;
+    block-size: 18px;
+    margin-inline: 2px;
+
+    background: ${cssVar.colorBorderSecondary};
+  `,
+	topbarMain: css`
+    display: flex;
+    flex: 1;
+    align-items: center;
+    min-inline-size: 0;
+  `,
+	tools: css`
+    display: flex;
+    flex: none;
+    gap: 6px;
+    align-items: center;
+
+    margin-inline-start: auto;
+  `,
+	workspace: css`
+    overflow: hidden;
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+
+    min-inline-size: 0;
+    min-block-size: 0;
+    margin-block: ${WORKSPACE_INSET}px;
+    margin-inline: 0 ${WORKSPACE_INSET}px;
+    border: 1px solid ${cssVar.colorBorderSecondary};
+    border-radius: ${cssVar.borderRadiusLG};
+
+    background: ${cssVar.colorBgContainer};
+    box-shadow: ${cssVar.boxShadowTertiary};
+
+    ${responsive.laptop} {
+      margin: 0;
+      border: none;
+      border-radius: 0;
+      box-shadow: none;
+    }
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/dashboard/ConsoleShell/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/ConsoleShell/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nconst SIDEBAR_INLINE_SIZE = 248;\nconst SIDEBAR_RAIL_INLINE_SIZE = 64;\nconst WORKSPACE_INSET = 8;\n\n/**\n * `responsive.laptop`, not `responsive.tablet`. The aliases are named for\n * devices, and only `laptop` (max-width 991px) lines up with `useIsCompact`.\n */\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n  brand: css`\n    display: flex;\n    flex: none;\n    align-items: center;\n\n    block-size: 56px;\n    margin-block-start: ${WORKSPACE_INSET}px;\n    padding-inline: 16px;\n\n    color: ${cssVar.colorText};\n\n    &[data-collapsed='true'] {\n      justify-content: center;\n      padding-inline: 0;\n\n      > * {\n        justify-content: center;\n        inline-size: auto;\n      }\n    }\n\n    ${responsive.laptop} {\n      margin-block-start: 0;\n    }\n  `,\n  brandAnchor: css`\n    display: flex;\n    align-items: center;\n\n    inline-size: 100%;\n    min-inline-size: 0;\n\n    color: inherit;\n    text-decoration: none;\n  `,\n  brandLockup: css`\n    display: flex;\n    gap: 10px;\n    align-items: center;\n    min-inline-size: 0;\n  `,\n  brandName: css`\n    overflow: hidden;\n\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ${cssVar.colorText};\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  `,\n  main: css`\n    overflow: auto;\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    gap: 20px;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n    padding: 24px;\n\n    /*\n     * A page that owns a full-height split sets data-page-layout=\"flush\" and\n     * takes over padding and scrolling, so its sidebar can sit on the card edge.\n     */\n    &:has([data-page-layout='flush']) {\n      overflow: hidden;\n      gap: 0;\n      padding: 0;\n    }\n\n    ${responsive.mobile} {\n      gap: 16px;\n      padding: 16px;\n    }\n  `,\n  navSlot: css`\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    min-block-size: 0;\n  `,\n  shell: css`\n    overflow: hidden;\n    display: flex;\n    flex: 1;\n\n    block-size: 100%;\n    min-block-size: 0;\n\n    background: ${cssVar.colorBgLayout};\n  `,\n  sidebar: css`\n    display: flex;\n    flex: none;\n    flex-direction: column;\n\n    inline-size: ${SIDEBAR_INLINE_SIZE}px;\n    block-size: 100%;\n    min-block-size: 0;\n\n    transition: inline-size 200ms ease;\n\n    &[data-collapsed='true'] {\n      inline-size: ${SIDEBAR_RAIL_INLINE_SIZE}px;\n    }\n\n    &[data-instant='true'] {\n      transition: none;\n    }\n\n    ${responsive.laptop} {\n      display: none;\n    }\n  `,\n  sidebarBottom: css`\n    flex: none;\n    padding: 8px;\n  `,\n  skipLink: css`\n    position: fixed;\n    z-index: 2000;\n    inset-block-start: -100px;\n    inset-inline-start: 12px;\n\n    padding-block: 8px;\n    padding-inline: 12px;\n    border-radius: ${cssVar.borderRadius};\n\n    color: ${cssVar.colorText};\n\n    background: ${cssVar.colorBgElevated};\n\n    &:focus {\n      inset-block-start: 12px;\n    }\n  `,\n  topbar: css`\n    display: flex;\n    flex: none;\n    gap: 8px;\n    align-items: center;\n\n    block-size: 56px;\n    padding-inline: 12px;\n    border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n  `,\n  topbarDivider: css`\n    flex: none;\n\n    inline-size: 1px;\n    block-size: 18px;\n    margin-inline: 2px;\n\n    background: ${cssVar.colorBorderSecondary};\n  `,\n  topbarMain: css`\n    display: flex;\n    flex: 1;\n    align-items: center;\n    min-inline-size: 0;\n  `,\n  tools: css`\n    display: flex;\n    flex: none;\n    gap: 6px;\n    align-items: center;\n\n    margin-inline-start: auto;\n  `,\n  workspace: css`\n    overflow: hidden;\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n    margin-block: ${WORKSPACE_INSET}px;\n    margin-inline: 0 ${WORKSPACE_INSET}px;\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: ${cssVar.borderRadiusLG};\n\n    background: ${cssVar.colorBgContainer};\n    box-shadow: ${cssVar.boxShadowTertiary};\n\n    ${responsive.laptop} {\n      margin: 0;\n      border: none;\n      border-radius: 0;\n      box-shadow: none;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAM,sBAAsB;AAC5B,MAAM,2BAA2B;AACjC,MAAM,kBAAkB;;;;;AAMxB,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,OAAO,GAAG;;;;;;0BAMc,gBAAgB;;;aAG7B,OAAO,UAAU;;;;;;;;;;;;MAYxB,WAAW,OAAO;;;;CAItB,aAAa,GAAG;;;;;;;;;;CAUhB,aAAa,GAAG;;;;;;CAMhB,WAAW,GAAG;;;;;;aAMH,OAAO,UAAU;;;;CAI5B,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;MAqBL,WAAW,OAAO;;;;;CAKtB,SAAS,GAAG;;;;;;CAMZ,OAAO,GAAG;;;;;;;;kBAQM,OAAO,cAAc;;CAErC,SAAS,GAAG;;;;;mBAKK,oBAAoB;;;;;;;qBAOlB,yBAAyB;;;;;;;MAOxC,WAAW,OAAO;;;;CAItB,eAAe,GAAG;;;;CAIlB,UAAU,GAAG;;;;;;;;qBAQM,OAAO,aAAa;;aAE5B,OAAO,UAAU;;kBAEZ,OAAO,gBAAgB;;;;;;CAMvC,QAAQ,GAAG;;;;;;;;kCAQqB,OAAO,qBAAqB;;CAE5D,eAAe,GAAG;;;;;;;kBAOF,OAAO,qBAAqB;;CAE5C,YAAY,GAAG;;;;;;CAMf,OAAO,GAAG;;;;;;;;CAQV,WAAW,GAAG;;;;;;;;oBAQI,gBAAgB;uBACb,gBAAgB;wBACf,OAAO,qBAAqB;qBAC/B,OAAO,eAAe;;kBAEzB,OAAO,iBAAiB;kBACxB,OAAO,kBAAkB;;MAErC,WAAW,OAAO;;;;;;;AAOxB,EAAE"}

package/es/dashboard/ConsoleShell/type.d.mts

@@ -0,0 +1,67 @@
+import { HTMLAttributes, ReactNode } from "react";
+//#region src/dashboard/ConsoleShell/type.d.ts
+interface ConsoleShellState {
+  /** Closes the compact navigation drawer. */
+  closeNavigation: () => void;
+  /** Icon rail, only when the sidebar is collapsed on a wide viewport. */
+  collapsed: boolean;
+  /** Sidebar is a drawer. Matches the laptop breakpoint. */
+  compact: boolean;
+}
+interface ConsoleBrandLinkProps {
+  'aria-label': string;
+  'children': ReactNode;
+  'className': string;
+  'href': string;
+  'onClick': () => void;
+}
+interface ConsoleBrandProps {
+  href?: string;
+  /** Accessible name for the home link. Defaults to `title`. */
+  label?: string;
+  /** Mark shown on its own when the sidebar is an icon rail. */
+  logo: ReactNode;
+  /**
+   * Renders the home link. Use this to plug in a router `Link`.
+   * The default render is an anchor.
+   */
+  renderLink?: (props: ConsoleBrandLinkProps) => ReactNode;
+  /**
+   * Name beside the mark. Omit when `logo` already includes the wordmark,
+   * such as a combine lockup.
+   */
+  title?: ReactNode;
+}
+interface ConsoleShellProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+  /** Home mark. Rendered at the top of the sidebar. */
+  brand?: ReactNode;
+  /** Location shown in the top bar, usually a `Breadcrumb`. */
+  breadcrumb?: ReactNode;
+  children?: ReactNode;
+  /** Collapse the sidebar to an icon rail. Ignored while compact. */
+  collapsed?: boolean;
+  collapseLabel?: string;
+  defaultCollapsed?: boolean;
+  expandLabel?: string;
+  /** Account menu or other content pinned to the bottom of the sidebar. */
+  footer?: ReactNode;
+  /**
+   * Collapse and expand with Mod+B while focus is inside the shell.
+   * @default true
+   */
+  hotkey?: boolean;
+  /** Grouped navigation. Collapsed state comes from the shell. */
+  navigation?: ReactNode;
+  onCollapsedChange?: (collapsed: boolean) => void;
+  openNavigationLabel?: string;
+  skipToContentLabel?: string;
+  /**
+   * Persists the collapsed rail. Omit to keep the choice in memory only.
+   */
+  storageKey?: string;
+  /** Actions at the end of the top bar. */
+  tools?: ReactNode;
+}
+//#endregion
+export { ConsoleBrandLinkProps, ConsoleBrandProps, ConsoleShellProps, ConsoleShellState };
+//# sourceMappingURL=type.d.mts.map

package/es/dashboard/FilterSidebar/FilterSidebar.d.mts

@@ -0,0 +1,17 @@
+import { FilterOptionProps, FilterRowProps, FilterSidebarProps } from "./type.mjs";
+//#region src/dashboard/FilterSidebar/FilterSidebar.d.ts
+declare function FilterSidebar({ body, children, flush, head, header, label, storageKey, summary, wide }: FilterSidebarProps): import("react").JSX.Element;
+declare namespace FilterSidebar {
+  var displayName: string;
+}
+declare function FilterRow({ count, name }: FilterRowProps): import("react").JSX.Element;
+declare namespace FilterRow {
+  var displayName: string;
+}
+declare function FilterOption({ count, icon, label, name, onClick, selected, title }: FilterOptionProps): import("react").JSX.Element;
+declare namespace FilterOption {
+  var displayName: string;
+}
+//#endregion
+export { FilterOption, FilterRow, FilterSidebar as default };
+//# sourceMappingURL=FilterSidebar.d.mts.map