@burdenoff/microfe-bigconsole 2026.510.54

package/dist/bigconsole/components/dashboard/DashboardToolbar.js

@@ -0,0 +1,131 @@
+import { useWidgetStore as e } from "../../store/widgetStore.js";
+import { useDashboardStore as t } from "../../store/dashboardStore.js";
+import "../../store/index.js";
+import n from "./SavedViewsDropdown/SavedViewsDropdown.js";
+import "./SavedViewsDropdown/index.js";
+import { memo as r, useCallback as i } from "react";
+import { Clipboard as a, Download as o, Eye as s, Minus as c, PanelLeft as l, PanelLeftClose as u, Pencil as d, Plus as f, RotateCcw as p, Save as m, Share2 as h } from "lucide-react";
+import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
+import { Button as y, Spinner as b, Tooltip as x, TooltipContent as S, TooltipProvider as C, TooltipTrigger as w } from "@burdenoff/fe-libs/ui";
+//#region src/bigconsole/components/dashboard/DashboardToolbar.tsx
+var T = r(function({ dashboardId: r, title: T, onAddWidget: E, onTogglePalette: D, isPaletteOpen: O = !1, onPaste: k, onSave: A, isSaving: j = !1, onExport: M, onShare: N }) {
+	let P = t((e) => e.viewMode === "edit"), F = t((e) => e.toggleViewMode), I = t((e) => e.zoomLevel), L = t((e) => e.setZoomLevel), R = !!e((e) => e.clipboardWidgetId), z = i(() => {
+		R && k && k();
+	}, [R, k]);
+	return /* @__PURE__ */ _(C, { children: /* @__PURE__ */ v("div", {
+		className: "flex items-center justify-between px-4 py-2 bg-background border-b",
+		children: [
+			/* @__PURE__ */ v("div", {
+				className: "flex items-center gap-4",
+				children: [T && /* @__PURE__ */ _("h1", {
+					className: "text-lg font-semibold",
+					children: T
+				}), r && /* @__PURE__ */ _(n, { dashboardId: r })]
+			}),
+			/* @__PURE__ */ v("div", {
+				className: "flex items-center gap-1",
+				children: [
+					/* @__PURE__ */ v(x, { children: [/* @__PURE__ */ _(w, {
+						asChild: !0,
+						children: /* @__PURE__ */ _(y, {
+							variant: "ghost",
+							size: "icon-sm",
+							onClick: () => L(Math.max(50, I - 10)),
+							disabled: I <= 50,
+							children: /* @__PURE__ */ _(c, { className: "size-4" })
+						})
+					}), /* @__PURE__ */ _(S, { children: "Zoom out" })] }),
+					/* @__PURE__ */ v("span", {
+						className: "text-sm text-muted-foreground w-12 text-center",
+						children: [I, "%"]
+					}),
+					/* @__PURE__ */ v(x, { children: [/* @__PURE__ */ _(w, {
+						asChild: !0,
+						children: /* @__PURE__ */ _(y, {
+							variant: "ghost",
+							size: "icon-sm",
+							onClick: () => L(Math.min(200, I + 10)),
+							disabled: I >= 200,
+							children: /* @__PURE__ */ _(f, { className: "size-4" })
+						})
+					}), /* @__PURE__ */ _(S, { children: "Zoom in" })] }),
+					/* @__PURE__ */ v(x, { children: [/* @__PURE__ */ _(w, {
+						asChild: !0,
+						children: /* @__PURE__ */ v(y, {
+							variant: "ghost",
+							size: "sm",
+							onClick: () => L(100),
+							children: [/* @__PURE__ */ _(p, { className: "size-3.5 mr-1" }), "Reset"]
+						})
+					}), /* @__PURE__ */ _(S, { children: "Reset zoom to 100%" })] })
+				]
+			}),
+			/* @__PURE__ */ v("div", {
+				className: "flex items-center gap-2",
+				children: [
+					P && /* @__PURE__ */ v(g, { children: [
+						D && /* @__PURE__ */ v(x, { children: [/* @__PURE__ */ _(w, {
+							asChild: !0,
+							children: /* @__PURE__ */ v(y, {
+								variant: O ? "secondary" : "outline",
+								size: "sm",
+								onClick: D,
+								children: [_(O ? u : l, { className: "size-4" }), "Widgets"]
+							})
+						}), /* @__PURE__ */ _(S, { children: O ? "Hide widget palette" : "Show widget palette for drag & drop" })] }),
+						/* @__PURE__ */ v(x, { children: [/* @__PURE__ */ _(w, {
+							asChild: !0,
+							children: /* @__PURE__ */ v(y, {
+								variant: "ghost",
+								size: "sm",
+								onClick: z,
+								disabled: !R,
+								children: [/* @__PURE__ */ _(a, { className: "size-4" }), "Paste"]
+							})
+						}), /* @__PURE__ */ _(S, { children: "Paste widget from clipboard" })] }),
+						/* @__PURE__ */ v(y, {
+							size: "sm",
+							onClick: E,
+							children: [/* @__PURE__ */ _(f, { className: "size-4" }), "Add Widget"]
+						})
+					] }),
+					/* @__PURE__ */ _(y, {
+						variant: P ? "secondary" : "outline",
+						size: "sm",
+						onClick: F,
+						children: P ? /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(s, { className: "size-4" }), "Preview"] }) : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(d, { className: "size-4" }), "Edit"] })
+					}),
+					A && /* @__PURE__ */ _(y, {
+						variant: "outline",
+						size: "sm",
+						onClick: A,
+						disabled: j,
+						children: j ? /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(b, { className: "size-4" }), "Saving..."] }) : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(m, { className: "size-4" }), "Save"] })
+					}),
+					N && /* @__PURE__ */ v(x, { children: [/* @__PURE__ */ _(w, {
+						asChild: !0,
+						children: /* @__PURE__ */ v(y, {
+							variant: "outline",
+							size: "sm",
+							onClick: N,
+							children: [/* @__PURE__ */ _(h, { className: "size-4" }), "Share"]
+						})
+					}), /* @__PURE__ */ _(S, { children: "Share dashboard with others" })] }),
+					M && /* @__PURE__ */ v(x, { children: [/* @__PURE__ */ _(w, {
+						asChild: !0,
+						children: /* @__PURE__ */ v(y, {
+							variant: "outline",
+							size: "sm",
+							onClick: M,
+							children: [/* @__PURE__ */ _(o, { className: "size-4" }), "Export"]
+						})
+					}), /* @__PURE__ */ _(S, { children: "Export dashboard to JSON" })] })
+				]
+			})
+		]
+	}) });
+});
+//#endregion
+export { T as default };
+
+//# sourceMappingURL=DashboardToolbar.js.map

package/dist/bigconsole/components/dashboard/DashboardToolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardToolbar.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/DashboardToolbar.tsx"],"sourcesContent":["/**\n * DashboardToolbar Component\n *\n * Toolbar for dashboard actions and controls.\n * Uses fe-libs shared components for consistent styling.\n * Phase 2: Added SavedViewsDropdown and Share button.\n */\n\nimport { type FC, memo, useCallback } from 'react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@burdenoff/fe-libs/ui';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport {\n  Plus,\n  Clipboard,\n  Eye,\n  Pencil,\n  Save,\n  Download,\n  Minus,\n  RotateCcw,\n  Share2,\n  LayoutGrid,\n  PanelLeftClose,\n  PanelLeft,\n} from 'lucide-react';\nimport { useDashboardStore, useWidgetStore } from '../../store';\nimport { SavedViewsDropdown } from './SavedViewsDropdown';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface DashboardToolbarProps {\n  /** Dashboard ID for saved views */\n  dashboardId?: string;\n  /** Dashboard title */\n  title?: string;\n  /** Callback to add widget */\n  onAddWidget: () => void;\n  /** Callback to toggle widget palette */\n  onTogglePalette?: () => void;\n  /** Whether palette is open */\n  isPaletteOpen?: boolean;\n  /** Callback to paste widget */\n  onPaste?: () => void;\n  /** Callback to save dashboard */\n  onSave?: () => void;\n  /** Whether save is in progress */\n  isSaving?: boolean;\n  /** Callback to export dashboard */\n  onExport?: () => void;\n  /** Callback to open share dialog */\n  onShare?: () => void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const DashboardToolbar: FC<DashboardToolbarProps> = memo(function DashboardToolbar({\n  dashboardId,\n  title,\n  onAddWidget,\n  onTogglePalette,\n  isPaletteOpen = false,\n  onPaste,\n  onSave,\n  isSaving = false,\n  onExport,\n  onShare,\n}) {\n  const isEditMode = useDashboardStore((state) => state.viewMode === 'edit');\n  const toggleViewMode = useDashboardStore((state) => state.toggleViewMode);\n  const zoomLevel = useDashboardStore((state) => state.zoomLevel);\n  const setZoomLevel = useDashboardStore((state) => state.setZoomLevel);\n\n  const clipboardWidgetId = useWidgetStore((state) => state.clipboardWidgetId);\n  const hasClipboard = !!clipboardWidgetId;\n\n  // Handle paste - use provided callback or fallback\n  const handlePaste = useCallback(() => {\n    if (hasClipboard && onPaste) {\n      onPaste();\n    }\n  }, [hasClipboard, onPaste]);\n\n  return (\n    <TooltipProvider>\n      <div className=\"flex items-center justify-between px-4 py-2 bg-background border-b\">\n        {/* Left section */}\n        <div className=\"flex items-center gap-4\">\n          {title && <h1 className=\"text-lg font-semibold\">{title}</h1>}\n          {/* Saved Views Dropdown */}\n          {dashboardId && <SavedViewsDropdown dashboardId={dashboardId} />}\n        </div>\n\n        {/* Center section - Zoom controls */}\n        <div className=\"flex items-center gap-1\">\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <Button\n                variant=\"ghost\"\n                size=\"icon-sm\"\n                onClick={() => setZoomLevel(Math.max(50, zoomLevel - 10))}\n                disabled={zoomLevel <= 50}\n              >\n                <Minus className=\"size-4\" />\n              </Button>\n            </TooltipTrigger>\n            <TooltipContent>Zoom out</TooltipContent>\n          </Tooltip>\n\n          <span className=\"text-sm text-muted-foreground w-12 text-center\">{zoomLevel}%</span>\n\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <Button\n                variant=\"ghost\"\n                size=\"icon-sm\"\n                onClick={() => setZoomLevel(Math.min(200, zoomLevel + 10))}\n                disabled={zoomLevel >= 200}\n              >\n                <Plus className=\"size-4\" />\n              </Button>\n            </TooltipTrigger>\n            <TooltipContent>Zoom in</TooltipContent>\n          </Tooltip>\n\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <Button variant=\"ghost\" size=\"sm\" onClick={() => setZoomLevel(100)}>\n                <RotateCcw className=\"size-3.5 mr-1\" />\n                Reset\n              </Button>\n            </TooltipTrigger>\n            <TooltipContent>Reset zoom to 100%</TooltipContent>\n          </Tooltip>\n        </div>\n\n        {/* Right section - Actions */}\n        <div className=\"flex items-center gap-2\">\n          {isEditMode && (\n            <>\n              {/* Widget Palette Toggle */}\n              {onTogglePalette && (\n                <Tooltip>\n                  <TooltipTrigger asChild>\n                    <Button variant={isPaletteOpen ? 'secondary' : 'outline'} size=\"sm\" onClick={onTogglePalette}>\n                      {isPaletteOpen ? <PanelLeftClose className=\"size-4\" /> : <PanelLeft className=\"size-4\" />}\n                      Widgets\n                    </Button>\n                  </TooltipTrigger>\n                  <TooltipContent>\n                    {isPaletteOpen ? 'Hide widget palette' : 'Show widget palette for drag & drop'}\n                  </TooltipContent>\n                </Tooltip>\n              )}\n\n              {/* Paste */}\n              <Tooltip>\n                <TooltipTrigger asChild>\n                  <Button variant=\"ghost\" size=\"sm\" onClick={handlePaste} disabled={!hasClipboard}>\n                    <Clipboard className=\"size-4\" />\n                    Paste\n                  </Button>\n                </TooltipTrigger>\n                <TooltipContent>Paste widget from clipboard</TooltipContent>\n              </Tooltip>\n\n              {/* Add Widget (Dialog) */}\n              <Button size=\"sm\" onClick={onAddWidget}>\n                <Plus className=\"size-4\" />\n                Add Widget\n              </Button>\n            </>\n          )}\n\n          {/* Edit/View Mode Toggle */}\n          <Button variant={isEditMode ? 'secondary' : 'outline'} size=\"sm\" onClick={toggleViewMode}>\n            {isEditMode ? (\n              <>\n                <Eye className=\"size-4\" />\n                Preview\n              </>\n            ) : (\n              <>\n                <Pencil className=\"size-4\" />\n                Edit\n              </>\n            )}\n          </Button>\n\n          {/* Save */}\n          {onSave && (\n            <Button variant=\"outline\" size=\"sm\" onClick={onSave} disabled={isSaving}>\n              {isSaving ? (\n                <>\n                  <Spinner className=\"size-4\" />\n                  Saving...\n                </>\n              ) : (\n                <>\n                  <Save className=\"size-4\" />\n                  Save\n                </>\n              )}\n            </Button>\n          )}\n\n          {/* Share */}\n          {onShare && (\n            <Tooltip>\n              <TooltipTrigger asChild>\n                <Button variant=\"outline\" size=\"sm\" onClick={onShare}>\n                  <Share2 className=\"size-4\" />\n                  Share\n                </Button>\n              </TooltipTrigger>\n              <TooltipContent>Share dashboard with others</TooltipContent>\n            </Tooltip>\n          )}\n\n          {/* Export */}\n          {onExport && (\n            <Tooltip>\n              <TooltipTrigger asChild>\n                <Button variant=\"outline\" size=\"sm\" onClick={onExport}>\n                  <Download className=\"size-4\" />\n                  Export\n                </Button>\n              </TooltipTrigger>\n              <TooltipContent>Export dashboard to JSON</TooltipContent>\n            </Tooltip>\n          )}\n        </div>\n      </div>\n    </TooltipProvider>\n  );\n});\n\nexport default DashboardToolbar;\n"],"mappings":"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"}

package/dist/bigconsole/components/dashboard/DrilldownBreadcrumb.d.ts

@@ -0,0 +1,26 @@
+/**
+ * DrilldownBreadcrumb Component
+ *
+ * Displays a breadcrumb trail showing the drilldown navigation path.
+ * Allows users to navigate back up the drilldown hierarchy.
+ *
+ * URL Parameters Used:
+ * - drilldown_depth: Current depth in drilldown hierarchy
+ * - drilldown_parent: Parent dashboard ID
+ * - drilldown_path: JSON array of dashboard IDs in the path
+ */
+interface DrilldownBreadcrumbProps {
+    /** Additional CSS classes */
+    className?: string;
+    /** Current dashboard ID */
+    currentDashboardId?: string;
+    /** Current dashboard name */
+    currentDashboardName?: string;
+    /** Whether to show the home/root link */
+    showHome?: boolean;
+    /** Base path for dashboard URLs */
+    basePath?: string;
+}
+export declare const DrilldownBreadcrumb: import('react').NamedExoticComponent<DrilldownBreadcrumbProps>;
+export default DrilldownBreadcrumb;
+//# sourceMappingURL=DrilldownBreadcrumb.d.ts.map

package/dist/bigconsole/components/dashboard/DrilldownBreadcrumb.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrilldownBreadcrumb.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/dashboard/DrilldownBreadcrumb.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAYH,UAAU,wBAAwB;IAChC,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2BAA2B;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,6BAA6B;IAC7B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,yCAAyC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAYD,eAAO,MAAM,mBAAmB,gEAuK9B,CAAC;AAEH,eAAe,mBAAmB,CAAC"}

package/dist/bigconsole/components/dashboard/DrilldownBreadcrumb.js

@@ -0,0 +1,107 @@
+import { useDashboardStore as e } from "../../store/dashboardStore.js";
+import "../../store/index.js";
+import { useBigConsoleNavigate as t } from "../../context/BigConsoleContext.js";
+import "../../context/index.js";
+import n from "../../hooks/useFilterUrlSync.js";
+import { memo as r, useCallback as i, useEffect as a, useState as o } from "react";
+import { ArrowLeft as s, ChevronRight as c, Home as l } from "lucide-react";
+import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+//#region src/bigconsole/components/dashboard/DrilldownBreadcrumb.tsx
+var p = r(function({ className: r = "", currentDashboardId: p, currentDashboardName: m, showHome: h = !0, basePath: g = "/bigconsole/dashboards" }) {
+	let _ = t(), { getDrilldownMetadata: v, isInDrilldown: y, drilldownDepth: b } = n(), x = e((e) => e.dashboards), [S, C] = o([]);
+	a(() => {
+		if (!y) {
+			C([]);
+			return;
+		}
+		let { path: e } = v();
+		if (e.length === 0) {
+			C([]);
+			return;
+		}
+		C(e.map((e) => ({
+			id: e,
+			name: x.get(e)?.name || `Dashboard ${e.slice(0, 8)}...`,
+			href: `${g}/${e}`
+		})));
+	}, [
+		y,
+		v,
+		x,
+		g
+	]);
+	let w = i((e, t) => {
+		let n = v().path.slice(0, t), r = t, i = new URL(e.href, window.location.origin);
+		i.searchParams.set("drilldown_depth", String(r)), n.length > 0 && i.searchParams.set("drilldown_path", encodeURIComponent(JSON.stringify(n))), t > 0 && n.length > 0 && i.searchParams.set("drilldown_parent", n[n.length - 1]), _(i.pathname + i.search);
+	}, [v, _]), T = i(() => {
+		let e = v();
+		if (e.parent) {
+			let t = e.path.slice(0, -1), n = e.depth - 1, r = new URL(`${g}/${e.parent}`, window.location.origin);
+			r.searchParams.set("drilldown_depth", String(n)), t.length > 0 && (r.searchParams.set("drilldown_path", encodeURIComponent(JSON.stringify(t))), r.searchParams.set("drilldown_parent", t[t.length - 1])), _(r.pathname + r.search);
+		} else if (S.length > 0) {
+			let e = S[S.length - 1];
+			w(e, S.length - 1);
+		}
+	}, [
+		v,
+		g,
+		_,
+		S,
+		w
+	]), E = i((e) => {
+		e.preventDefault(), _(g);
+	}, [_, g]);
+	return y ? /* @__PURE__ */ f("nav", {
+		className: `flex items-center gap-2 px-4 py-2 bg-bg-surface border-b border-border-default ${r}`,
+		"aria-label": "Drilldown breadcrumb",
+		children: [
+			/* @__PURE__ */ f("button", {
+				type: "button",
+				onClick: T,
+				className: "flex items-center gap-1 px-2 py-1 text-sm font-medium text-action-primary-bg hover:bg-action-primary-bg/10 rounded-md transition-colors",
+				"aria-label": "Go back",
+				children: [/* @__PURE__ */ d(s, { className: "w-4 h-4" }), /* @__PURE__ */ d("span", {
+					className: "hidden sm:inline",
+					children: "Back"
+				})]
+			}),
+			/* @__PURE__ */ d("span", {
+				className: "text-border-default",
+				children: "|"
+			}),
+			h && /* @__PURE__ */ f(u, { children: [/* @__PURE__ */ f("a", {
+				href: g,
+				onClick: E,
+				className: "flex items-center gap-1 text-sm text-text-secondary hover:text-text-primary transition-colors",
+				"aria-label": "Home",
+				children: [/* @__PURE__ */ d(l, { className: "w-4 h-4" }), /* @__PURE__ */ d("span", {
+					className: "hidden sm:inline",
+					children: "Dashboards"
+				})]
+			}), /* @__PURE__ */ d(c, { className: "w-4 h-4 text-text-tertiary" })] }),
+			S.map((e, t) => /* @__PURE__ */ f("div", {
+				className: "flex items-center gap-2",
+				children: [/* @__PURE__ */ d("button", {
+					type: "button",
+					onClick: () => w(e, t),
+					className: "text-sm text-text-secondary hover:text-text-primary hover:underline transition-colors max-w-[150px] truncate",
+					title: e.name,
+					children: e.name
+				}), /* @__PURE__ */ d(c, { className: "w-4 h-4 text-text-tertiary" })]
+			}, e.id)),
+			m && /* @__PURE__ */ d("span", {
+				className: "text-sm font-medium text-text-primary max-w-[200px] truncate",
+				title: m,
+				children: m
+			}),
+			/* @__PURE__ */ f("span", {
+				className: "ml-auto text-xs text-text-tertiary bg-bg-muted px-2 py-0.5 rounded",
+				children: ["Level ", b]
+			})
+		]
+	}) : null;
+});
+//#endregion
+export { p as default };
+
+//# sourceMappingURL=DrilldownBreadcrumb.js.map

package/dist/bigconsole/components/dashboard/DrilldownBreadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrilldownBreadcrumb.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/DrilldownBreadcrumb.tsx"],"sourcesContent":["/**\n * DrilldownBreadcrumb Component\n *\n * Displays a breadcrumb trail showing the drilldown navigation path.\n * Allows users to navigate back up the drilldown hierarchy.\n *\n * URL Parameters Used:\n * - drilldown_depth: Current depth in drilldown hierarchy\n * - drilldown_parent: Parent dashboard ID\n * - drilldown_path: JSON array of dashboard IDs in the path\n */\n\nimport { memo, useCallback, useEffect, useState } from 'react';\nimport { useBigConsoleNavigate } from '../../context';\nimport { useFilterUrlSync } from '../../hooks/useFilterUrlSync';\nimport { useDashboardStore } from '../../store';\nimport { ChevronRight, Home, ArrowLeft } from 'lucide-react';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface DrilldownBreadcrumbProps {\n  /** Additional CSS classes */\n  className?: string;\n  /** Current dashboard ID */\n  currentDashboardId?: string;\n  /** Current dashboard name */\n  currentDashboardName?: string;\n  /** Whether to show the home/root link */\n  showHome?: boolean;\n  /** Base path for dashboard URLs */\n  basePath?: string;\n}\n\ninterface BreadcrumbItem {\n  id: string;\n  name: string;\n  href: string;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const DrilldownBreadcrumb = memo(function DrilldownBreadcrumb({\n  className = '',\n  currentDashboardId,\n  currentDashboardName,\n  showHome = true,\n  basePath = '/bigconsole/dashboards',\n}: DrilldownBreadcrumbProps) {\n  const navigate = useBigConsoleNavigate();\n  const { getDrilldownMetadata, isInDrilldown, drilldownDepth } = useFilterUrlSync();\n\n  // Get dashboards from store for name lookup\n  const dashboards = useDashboardStore((state) => state.dashboards);\n\n  const [breadcrumbs, setBreadcrumbs] = useState<BreadcrumbItem[]>([]);\n\n  // Build breadcrumb items from path\n  useEffect(() => {\n    if (!isInDrilldown) {\n      setBreadcrumbs([]);\n      return;\n    }\n\n    const metadata = getDrilldownMetadata();\n    const { path } = metadata;\n\n    if (path.length === 0) {\n      setBreadcrumbs([]);\n      return;\n    }\n\n    // Map path IDs to breadcrumb items\n    const items: BreadcrumbItem[] = path.map((dashboardId) => {\n      // Try to find dashboard name in store\n      const dashboard = dashboards.get(dashboardId);\n      const name = dashboard?.name || `Dashboard ${dashboardId.slice(0, 8)}...`;\n\n      return {\n        id: dashboardId,\n        name,\n        href: `${basePath}/${dashboardId}`,\n      };\n    });\n\n    setBreadcrumbs(items);\n  }, [isInDrilldown, getDrilldownMetadata, dashboards, basePath]);\n\n  // Handle navigation to a breadcrumb item\n  const handleNavigate = useCallback(\n    (item: BreadcrumbItem, index: number) => {\n      // Build URL preserving context up to this point\n      const metadata = getDrilldownMetadata();\n      const newPath = metadata.path.slice(0, index);\n      const newDepth = index;\n\n      // Build URL with updated drilldown params\n      const url = new URL(item.href, window.location.origin);\n      url.searchParams.set('drilldown_depth', String(newDepth));\n      if (newPath.length > 0) {\n        url.searchParams.set('drilldown_path', encodeURIComponent(JSON.stringify(newPath)));\n      }\n      if (index > 0 && newPath.length > 0) {\n        url.searchParams.set('drilldown_parent', newPath[newPath.length - 1]);\n      }\n\n      navigate(url.pathname + url.search);\n    },\n    [getDrilldownMetadata, navigate]\n  );\n\n  // Handle back button click\n  const handleBack = useCallback(() => {\n    const metadata = getDrilldownMetadata();\n\n    if (metadata.parent) {\n      // Navigate to parent dashboard\n      const newPath = metadata.path.slice(0, -1);\n      const newDepth = metadata.depth - 1;\n\n      const url = new URL(`${basePath}/${metadata.parent}`, window.location.origin);\n      url.searchParams.set('drilldown_depth', String(newDepth));\n      if (newPath.length > 0) {\n        url.searchParams.set('drilldown_path', encodeURIComponent(JSON.stringify(newPath)));\n        url.searchParams.set('drilldown_parent', newPath[newPath.length - 1]);\n      }\n\n      navigate(url.pathname + url.search);\n    } else if (breadcrumbs.length > 0) {\n      // Navigate to last breadcrumb\n      const lastBreadcrumb = breadcrumbs[breadcrumbs.length - 1];\n      handleNavigate(lastBreadcrumb, breadcrumbs.length - 1);\n    }\n  }, [getDrilldownMetadata, basePath, navigate, breadcrumbs, handleNavigate]);\n\n  // Handle home click\n  const handleHomeClick = useCallback(\n    (e: React.MouseEvent) => {\n      e.preventDefault();\n      navigate(basePath);\n    },\n    [navigate, basePath]\n  );\n\n  // Don't render if not in drilldown mode\n  if (!isInDrilldown) {\n    return null;\n  }\n\n  return (\n    <nav\n      className={`flex items-center gap-2 px-4 py-2 bg-bg-surface border-b border-border-default ${className}`}\n      aria-label=\"Drilldown breadcrumb\"\n    >\n      {/* Back button */}\n      <button\n        type=\"button\"\n        onClick={handleBack}\n        className=\"flex items-center gap-1 px-2 py-1 text-sm font-medium text-action-primary-bg hover:bg-action-primary-bg/10 rounded-md transition-colors\"\n        aria-label=\"Go back\"\n      >\n        <ArrowLeft className=\"w-4 h-4\" />\n        <span className=\"hidden sm:inline\">Back</span>\n      </button>\n\n      <span className=\"text-border-default\">|</span>\n\n      {/* Home link */}\n      {showHome && (\n        <>\n          <a\n            href={basePath}\n            onClick={handleHomeClick}\n            className=\"flex items-center gap-1 text-sm text-text-secondary hover:text-text-primary transition-colors\"\n            aria-label=\"Home\"\n          >\n            <Home className=\"w-4 h-4\" />\n            <span className=\"hidden sm:inline\">Dashboards</span>\n          </a>\n          <ChevronRight className=\"w-4 h-4 text-text-tertiary\" />\n        </>\n      )}\n\n      {/* Breadcrumb items */}\n      {breadcrumbs.map((item, index) => (\n        <div key={item.id} className=\"flex items-center gap-2\">\n          <button\n            type=\"button\"\n            onClick={() => handleNavigate(item, index)}\n            className=\"text-sm text-text-secondary hover:text-text-primary hover:underline transition-colors max-w-[150px] truncate\"\n            title={item.name}\n          >\n            {item.name}\n          </button>\n          <ChevronRight className=\"w-4 h-4 text-text-tertiary\" />\n        </div>\n      ))}\n\n      {/* Current dashboard (non-clickable) */}\n      {currentDashboardName && (\n        <span className=\"text-sm font-medium text-text-primary max-w-[200px] truncate\" title={currentDashboardName}>\n          {currentDashboardName}\n        </span>\n      )}\n\n      {/* Depth indicator */}\n      <span className=\"ml-auto text-xs text-text-tertiary bg-bg-muted px-2 py-0.5 rounded\">Level {drilldownDepth}</span>\n    </nav>\n  );\n});\n\nexport default DrilldownBreadcrumb;\n"],"mappings":"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"}

package/dist/bigconsole/components/dashboard/ExportDashboardDialog.d.ts

@@ -0,0 +1,17 @@
+import { FC } from 'react';
+
+export interface ExportDashboardDialogProps {
+    /** Whether dialog is open */
+    isOpen: boolean;
+    /** Dashboard ID to export */
+    dashboardId: string | null;
+    /** Dashboard name for filename */
+    dashboardName?: string;
+    /** Callback when dialog is closed */
+    onClose: () => void;
+    /** Callback when export succeeds */
+    onSuccess?: () => void;
+}
+export declare const ExportDashboardDialog: FC<ExportDashboardDialogProps>;
+export default ExportDashboardDialog;
+//# sourceMappingURL=ExportDashboardDialog.d.ts.map

package/dist/bigconsole/components/dashboard/ExportDashboardDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExportDashboardDialog.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/dashboard/ExportDashboardDialog.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,KAAK,EAAE,EAA0C,MAAM,OAAO,CAAC;AAUxE,MAAM,WAAW,0BAA0B;IACzC,6BAA6B;IAC7B,MAAM,EAAE,OAAO,CAAC;IAChB,6BAA6B;IAC7B,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,kCAAkC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAkOD,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC,0BAA0B,CAiK/D,CAAC;AAEH,eAAe,qBAAqB,CAAC"}