@burdenoff/microfe-bigconsole 2026.613.2 → 2026.613.3

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

@@ -1,32 +1,32 @@
-import { getWidgetCategories as e, getWidgetKey as t } from "../widgets/WidgetRegistry.js";
-import { memo as n, useCallback as r, useMemo as i, useState as a } from "react";
-import { Activity as o, BarChart3 as s, Calendar as c, ChevronDown as l, ChevronRight as u, Columns as d, ExternalLink as f, FileText as p, Filter as m, Gauge as h, GitBranch as g, Grid3x3 as _, GripVertical as v, Layers as y, LayoutDashboard as b, List as x, MapPin as S, Puzzle as C, Search as w, Table as T, TrendingUp as E, Type as D, X as O } from "lucide-react";
-import { jsx as k, jsxs as A } from "react/jsx-runtime";
-import { Input as j } from "@burdenoff/fe-libs/ui";
+import { WIDGET_CATEGORY_LABELS as e, getWidgetCategories as t, getWidgetKey as n } from "../widgets/WidgetRegistry.js";
+import { memo as r, useCallback as i, useMemo as a, useState as o } from "react";
+import { Activity as s, BarChart3 as c, Calendar as l, ChevronDown as u, ChevronRight as d, Columns as f, ExternalLink as p, FileText as m, Filter as h, Gauge as g, GitBranch as _, Grid3x3 as v, GripVertical as y, Layers as b, LayoutDashboard as x, List as S, MapPin as C, Puzzle as w, Search as T, Table as E, TrendingUp as D, Type as O, X as k } from "lucide-react";
+import { jsx as A, jsxs as j } from "react/jsx-runtime";
+import { Input as M } from "@burdenoff/fe-libs/ui";
 //#region src/bigconsole/components/dashboard/WidgetPalette.tsx
-var M = {
-	TrendingUp: E,
-	BarChart3: s,
-	Filter: m,
-	Table: T,
-	Grid3x3: _,
-	Gauge: h,
-	Activity: o,
-	List: x,
-	FileText: p,
-	Type: D,
-	ExternalLink: f,
-	MapPin: S,
-	Calendar: c,
-	Columns: d,
-	GitBranch: g,
-	Puzzle: C,
-	LayoutDashboard: b
+var N = {
+	TrendingUp: D,
+	BarChart3: c,
+	Filter: h,
+	Table: E,
+	Grid3x3: v,
+	Gauge: g,
+	Activity: s,
+	List: S,
+	FileText: m,
+	Type: O,
+	ExternalLink: p,
+	MapPin: C,
+	Calendar: l,
+	Columns: f,
+	GitBranch: _,
+	Puzzle: w,
+	LayoutDashboard: x
 };
-function N(e) {
-	return M[e] || C;
+function P(e) {
+	return N[e] || w;
 }
-var P = {
+var F = {
 	container: {
 		width: "300px",
 		height: "100%",
@@ -266,8 +266,8 @@ var P = {
 		margin: 0,
 		textAlign: "center"
 	}
-}, F = n(function({ isOpen: n, onClose: o, onWidgetSelect: s, onDragStart: c, onDragEnd: d, installedWidgets: f = [], installedWidgetsLoading: p = !1 }) {
-	let [m, h] = a(""), [g, _] = a(new Set([
+}, I = r(function({ isOpen: r, onClose: s, onWidgetSelect: c, onDragStart: l, onDragEnd: f, installedWidgets: p = [], installedWidgetsLoading: m = !1, definitions: h }) {
+	let [g, _] = o(""), [v, x] = o(new Set([
 		"KPI",
 		"Visualization",
 		"Data",
@@ -275,22 +275,26 @@ var P = {
 		"Temporal",
 		"Custom",
 		"Installed"
-	])), [b, x] = a(null), S = i(() => e().map((e) => e.category === "Installed" ? {
+	])), [S, C] = o(null), w = a(() => (h ? Object.keys(e).map((t) => ({
+		category: t,
+		label: e[t],
+		widgets: h.filter((e) => e.category === t)
+	})) : t()).map((e) => e.category === "Installed" ? {
 		...e,
-		widgets: f
-	} : e).filter((e) => e.category !== "Installed" || e.widgets.length > 0), [f]), C = i(() => {
-		if (!m.trim()) return S;
-		let e = m.toLowerCase();
-		return S.map((t) => ({
+		widgets: p
+	} : e).filter((e) => e.category !== "Installed" || e.widgets.length > 0), [p, h]), E = a(() => {
+		if (!g.trim()) return w;
+		let e = g.toLowerCase();
+		return w.map((t) => ({
 			...t,
 			widgets: t.widgets.filter((t) => t.name.toLowerCase().includes(e) || t.description.toLowerCase().includes(e) || t.tags.some((t) => t.includes(e)))
 		})).filter((e) => e.widgets.length > 0);
-	}, [S, m]), T = r((e) => {
-		_((t) => {
+	}, [w, g]), D = i((e) => {
+		x((t) => {
 			let n = new Set(t);
 			return n.has(e) ? n.delete(e) : n.add(e), n;
 		});
-	}, []), E = r((e, t) => {
+	}, []), O = i((e, t) => {
 		e.dataTransfer.setData("application/json", JSON.stringify({
 			type: t.type,
 			name: t.name,
@@ -301,83 +305,83 @@ var P = {
 		let n = document.createElement("div");
 		n.style.cssText = "\n        position: absolute;\n        top: -1000px;\n        left: -1000px;\n        padding: 8px 12px;\n        background: var(--color-bg-surface);\n        border: 2px solid var(--color-action-primary-bg);\n        border-radius: 8px;\n        font-size: 14px;\n        font-weight: 500;\n        color: var(--color-text-primary);\n        box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n      ", n.textContent = t.name, document.body.appendChild(n), e.dataTransfer.setDragImage(n, 0, 0), setTimeout(() => {
 			document.body.removeChild(n);
-		}, 0), c?.(t.type, t);
-	}, [c]), D = r(() => {
-		d?.();
-	}, [d]), M = r((e) => {
-		s?.(e.type, e);
-	}, [s]);
-	return n ? /* @__PURE__ */ A("div", {
-		style: P.container,
+		}, 0), l?.(t.type, t);
+	}, [l]), N = i(() => {
+		f?.();
+	}, [f]), I = i((e) => {
+		c?.(e.type, e);
+	}, [c]);
+	return r ? /* @__PURE__ */ j("div", {
+		style: F.container,
 		children: [
-			/* @__PURE__ */ A("div", {
-				style: P.header,
-				children: [/* @__PURE__ */ A("div", {
-					style: P.headerTop,
-					children: [/* @__PURE__ */ A("div", {
-						style: P.headerTitle,
-						children: [/* @__PURE__ */ k("div", {
-							style: P.headerIcon,
-							children: /* @__PURE__ */ k(y, { style: {
+			/* @__PURE__ */ j("div", {
+				style: F.header,
+				children: [/* @__PURE__ */ j("div", {
+					style: F.headerTop,
+					children: [/* @__PURE__ */ j("div", {
+						style: F.headerTitle,
+						children: [/* @__PURE__ */ A("div", {
+							style: F.headerIcon,
+							children: /* @__PURE__ */ A(b, { style: {
 								width: "18px",
 								height: "18px",
 								color: "var(--color-action-primary-text)"
 							} })
-						}), /* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("h3", {
-							style: P.title,
+						}), /* @__PURE__ */ j("div", { children: [/* @__PURE__ */ A("h3", {
+							style: F.title,
 							children: "Widgets"
-						}), /* @__PURE__ */ k("p", {
-							style: P.subtitle,
+						}), /* @__PURE__ */ A("p", {
+							style: F.subtitle,
 							children: "Drag or click to add"
 						})] })]
-					}), /* @__PURE__ */ k("button", {
+					}), /* @__PURE__ */ A("button", {
 						type: "button",
-						onClick: o,
-						style: P.closeButton,
+						onClick: s,
+						style: F.closeButton,
 						onMouseOver: (e) => e.currentTarget.style.backgroundColor = "var(--color-bg-hover)",
 						onMouseOut: (e) => e.currentTarget.style.backgroundColor = "transparent",
-						children: /* @__PURE__ */ k(O, { style: {
+						children: /* @__PURE__ */ A(k, { style: {
 							width: "16px",
 							height: "16px"
 						} })
 					})]
-				}), /* @__PURE__ */ A("div", {
-					style: P.searchContainer,
-					children: [/* @__PURE__ */ k(w, { style: P.searchIcon }), /* @__PURE__ */ k(j, {
+				}), /* @__PURE__ */ j("div", {
+					style: F.searchContainer,
+					children: [/* @__PURE__ */ A(T, { style: F.searchIcon }), /* @__PURE__ */ A(M, {
 						type: "text",
 						placeholder: "Search widgets...",
-						value: m,
-						onChange: (e) => h(e.target.value),
-						style: P.searchInput
+						value: g,
+						onChange: (e) => _(e.target.value),
+						style: F.searchInput
 					})]
 				})]
 			}),
-			/* @__PURE__ */ k("div", {
-				style: P.content,
-				children: /* @__PURE__ */ A("div", {
-					style: P.scrollArea,
-					children: [C.map((e) => /* @__PURE__ */ A("div", {
-						style: P.categoryContainer,
-						children: [/* @__PURE__ */ A("button", {
+			/* @__PURE__ */ A("div", {
+				style: F.content,
+				children: /* @__PURE__ */ j("div", {
+					style: F.scrollArea,
+					children: [E.map((e) => /* @__PURE__ */ j("div", {
+						style: F.categoryContainer,
+						children: [/* @__PURE__ */ j("button", {
 							type: "button",
-							onClick: () => T(e.category),
-							style: P.categoryHeader,
+							onClick: () => D(e.category),
+							style: F.categoryHeader,
 							onMouseOver: (e) => e.currentTarget.style.backgroundColor = "var(--color-bg-hover)",
 							onMouseOut: (e) => e.currentTarget.style.backgroundColor = "transparent",
 							children: [
-								g.has(e.category) ? /* @__PURE__ */ k(l, { style: P.categoryChevron }) : /* @__PURE__ */ k(u, { style: P.categoryChevron }),
-								/* @__PURE__ */ k("span", {
-									style: P.categoryLabel,
+								v.has(e.category) ? /* @__PURE__ */ A(u, { style: F.categoryChevron }) : /* @__PURE__ */ A(d, { style: F.categoryChevron }),
+								/* @__PURE__ */ A("span", {
+									style: F.categoryLabel,
 									children: e.label
 								}),
-								/* @__PURE__ */ k("span", {
-									style: P.categoryCount,
+								/* @__PURE__ */ A("span", {
+									style: F.categoryCount,
 									children: e.widgets.length
 								})
 							]
-						}), g.has(e.category) && /* @__PURE__ */ A("div", {
-							style: P.widgetList,
-							children: [p && e.category === "Installed" && /* @__PURE__ */ k("div", {
+						}), v.has(e.category) && /* @__PURE__ */ j("div", {
+							style: F.widgetList,
+							children: [m && e.category === "Installed" && /* @__PURE__ */ A("div", {
 								style: {
 									fontSize: "var(--font-size-body-xs)",
 									color: "var(--color-text-muted)",
@@ -385,31 +389,31 @@ var P = {
 								},
 								children: "Loading..."
 							}), e.widgets.map((e) => {
-								let n = N(e.icon), r = t(e), i = b === r;
-								return /* @__PURE__ */ A("div", {
+								let t = P(e.icon), r = n(e), i = S === r;
+								return /* @__PURE__ */ j("div", {
 									draggable: !0,
-									onDragStart: (t) => E(t, e),
-									onDragEnd: D,
-									onClick: () => M(e),
-									onMouseEnter: () => x(r),
-									onMouseLeave: () => x(null),
+									onDragStart: (t) => O(t, e),
+									onDragEnd: N,
+									onClick: () => I(e),
+									onMouseEnter: () => C(r),
+									onMouseLeave: () => C(null),
 									style: {
-										...P.widgetCard,
-										...i ? P.widgetCardHover : {}
+										...F.widgetCard,
+										...i ? F.widgetCardHover : {}
 									},
 									children: [
-										/* @__PURE__ */ k(v, { style: P.dragHandle }),
-										/* @__PURE__ */ k("div", {
-											style: P.widgetIcon,
-											children: /* @__PURE__ */ k(n, { style: P.widgetIconInner })
-										}),
+										/* @__PURE__ */ A(y, { style: F.dragHandle }),
 										/* @__PURE__ */ A("div", {
-											style: P.widgetText,
-											children: [/* @__PURE__ */ k("div", {
-												style: P.widgetName,
+											style: F.widgetIcon,
+											children: /* @__PURE__ */ A(t, { style: F.widgetIconInner })
+										}),
+										/* @__PURE__ */ j("div", {
+											style: F.widgetText,
+											children: [/* @__PURE__ */ A("div", {
+												style: F.widgetName,
 												children: e.name
-											}), /* @__PURE__ */ k("div", {
-												style: P.widgetDescription,
+											}), /* @__PURE__ */ A("div", {
+												style: F.widgetDescription,
 												children: e.description
 											})]
 										})
@@ -417,39 +421,39 @@ var P = {
 								}, r);
 							})]
 						})]
-					}, e.category)), C.length === 0 && /* @__PURE__ */ A("div", {
-						style: P.emptyState,
+					}, e.category)), E.length === 0 && /* @__PURE__ */ j("div", {
+						style: F.emptyState,
 						children: [
-							/* @__PURE__ */ k("div", {
-								style: P.emptyIcon,
-								children: /* @__PURE__ */ k(w, { style: {
+							/* @__PURE__ */ A("div", {
+								style: F.emptyIcon,
+								children: /* @__PURE__ */ A(T, { style: {
 									width: "24px",
 									height: "24px",
 									color: "var(--color-text-muted)"
 								} })
 							}),
-							/* @__PURE__ */ A("p", {
-								style: P.emptyText,
+							/* @__PURE__ */ j("p", {
+								style: F.emptyText,
 								children: [
 									"No widgets found for \"",
-									/* @__PURE__ */ k("strong", { children: m }),
+									/* @__PURE__ */ A("strong", { children: g }),
 									"\""
 								]
 							}),
-							/* @__PURE__ */ k("button", {
+							/* @__PURE__ */ A("button", {
 								type: "button",
-								onClick: () => h(""),
-								style: P.clearButton,
+								onClick: () => _(""),
+								style: F.clearButton,
 								children: "Clear search"
 							})
 						]
 					})]
 				})
 			}),
-			/* @__PURE__ */ k("div", {
-				style: P.footer,
-				children: /* @__PURE__ */ k("p", {
-					style: P.footerText,
+			/* @__PURE__ */ A("div", {
+				style: F.footer,
+				children: /* @__PURE__ */ A("p", {
+					style: F.footerText,
 					children: "Drag widgets to position them on the canvas"
 				})
 			})
@@ -457,6 +461,6 @@ var P = {
 	}) : null;
 });
 //#endregion
-export { F as default };
+export { I as default };
 
 //# sourceMappingURL=WidgetPalette.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"WidgetPalette.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/WidgetPalette.tsx"],"sourcesContent":["/**\n * WidgetPalette Component\n *\n * Sidebar panel with draggable widget types for the dashboard builder.\n * Uses semantic tokens for consistent theming.\n * Features categorized widgets, search, and drag-and-drop support.\n */\n\nimport { type FC, memo, useState, useCallback, useMemo } from 'react';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport {\n  Search,\n  ChevronDown,\n  ChevronRight,\n  TrendingUp,\n  BarChart3,\n  Filter,\n  Table,\n  Grid3x3,\n  Gauge,\n  Activity,\n  List,\n  FileText,\n  Type,\n  ExternalLink,\n  MapPin,\n  Calendar,\n  Columns,\n  GitBranch,\n  Puzzle,\n  LayoutDashboard,\n  GripVertical,\n  X,\n  Layers,\n  type LucideIcon,\n} from 'lucide-react';\nimport { getWidgetCategories, getWidgetKey, type WidgetDefinition } from '../widgets/WidgetRegistry';\nimport type { WidgetType, WidgetCategory } from '../../types';\n\n// ============================================================================\n// Icon Mapping\n// ============================================================================\n\nconst ICON_MAP: Record<string, LucideIcon> = {\n  TrendingUp,\n  BarChart3,\n  Filter,\n  Table,\n  Grid3x3,\n  Gauge,\n  Activity,\n  List,\n  FileText,\n  Type,\n  ExternalLink,\n  MapPin,\n  Calendar,\n  Columns,\n  GitBranch,\n  Puzzle,\n  LayoutDashboard,\n};\n\nfunction getIconComponent(iconName: string): LucideIcon {\n  return ICON_MAP[iconName] || Puzzle;\n}\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface WidgetPaletteProps {\n  /** Whether the palette is open */\n  isOpen: boolean;\n  /** Callback to close the palette */\n  onClose: () => void;\n  /** Callback when a widget is selected (for quick add without drag) */\n  onWidgetSelect?: (type: WidgetType, definition?: WidgetDefinition) => void;\n  /** Callback when drag starts */\n  onDragStart?: (type: WidgetType, definition: WidgetDefinition) => void;\n  /** Callback when drag ends */\n  onDragEnd?: () => void;\n  /** Installed widgets from the store (fetched by parent) */\n  installedWidgets?: WidgetDefinition[];\n  /** Whether installed widgets are still loading */\n  installedWidgetsLoading?: boolean;\n}\n\n// ============================================================================\n// Styles using semantic tokens\n// ============================================================================\n\nconst styles = {\n  container: {\n    width: '300px',\n    height: '100%',\n    backgroundColor: 'var(--color-bg-surface)',\n    borderRight: '1px solid var(--color-border)',\n    display: 'flex',\n    flexDirection: 'column' as const,\n    flexShrink: 0,\n    overflow: 'hidden',\n    position: 'relative' as const,\n  },\n  header: {\n    padding: 'var(--space-formGap)',\n    borderBottom: '1px solid var(--color-border)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    flexShrink: 0,\n  },\n  headerTop: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    marginBottom: 'var(--space-controlGap)',\n  },\n  headerTitle: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: 'var(--space-iconGap)',\n  },\n  headerIcon: {\n    width: '32px',\n    height: '32px',\n    borderRadius: 'var(--radius-button)',\n    backgroundColor: 'var(--color-action-primary-bg)',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  title: {\n    fontSize: 'var(--font-size-body-md)',\n    fontWeight: 'var(--font-weight-semibold)' as const,\n    color: 'var(--color-text-primary)',\n    margin: 0,\n  },\n  subtitle: {\n    fontSize: 'var(--font-size-body-xs)',\n    color: 'var(--color-text-muted)',\n    margin: '2px 0 0 0',\n  },\n  closeButton: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '28px',\n    height: '28px',\n    border: 'none',\n    background: 'transparent',\n    borderRadius: 'var(--radius-button)',\n    cursor: 'pointer',\n    color: 'var(--color-text-secondary)',\n    transition: 'background-color 0.15s',\n  },\n  searchContainer: {\n    position: 'relative' as const,\n  },\n  searchIcon: {\n    position: 'absolute' as const,\n    left: '10px',\n    top: '50%',\n    transform: 'translateY(-50%)',\n    width: '16px',\n    height: '16px',\n    color: 'var(--color-text-muted)',\n    pointerEvents: 'none' as const,\n  },\n  searchInput: {\n    width: '100%',\n    paddingLeft: '36px',\n    height: 'var(--size-controlHeight-sm)',\n    fontSize: 'var(--font-size-body-sm)',\n  },\n  content: {\n    flex: '1 1 0',\n    minHeight: 0,\n    overflow: 'hidden',\n    position: 'relative' as const,\n  },\n  scrollArea: {\n    position: 'absolute' as const,\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    overflowY: 'auto' as const,\n    overflowX: 'hidden' as const,\n    padding: 'var(--space-controlGap)',\n  },\n  categoryContainer: {\n    marginBottom: 'var(--space-controlGap)',\n  },\n  categoryHeader: {\n    width: '100%',\n    display: 'flex',\n    alignItems: 'center',\n    gap: 'var(--space-iconGap)',\n    padding: 'var(--space-controlGap) var(--space-iconGap)',\n    border: 'none',\n    background: 'transparent',\n    cursor: 'pointer',\n    borderRadius: 'var(--radius-button)',\n    transition: 'background-color 0.15s',\n  },\n  categoryChevron: {\n    width: '16px',\n    height: '16px',\n    color: 'var(--color-text-muted)',\n    flexShrink: 0,\n  },\n  categoryLabel: {\n    flex: 1,\n    textAlign: 'left' as const,\n    fontSize: 'var(--font-size-body-xs)',\n    fontWeight: 'var(--font-weight-semibold)' as const,\n    color: 'var(--color-text-secondary)',\n    textTransform: 'uppercase' as const,\n    letterSpacing: '0.05em',\n  },\n  categoryCount: {\n    fontSize: 'var(--font-size-body-xs)',\n    color: 'var(--color-text-muted)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    padding: '2px 8px',\n    borderRadius: 'var(--radius-full)',\n  },\n  widgetList: {\n    display: 'flex',\n    flexDirection: 'column' as const,\n    gap: '4px',\n    marginTop: 'var(--space-controlGap)',\n    paddingLeft: '4px',\n  },\n  widgetCard: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: 'var(--space-iconGap)',\n    padding: 'var(--space-controlGap)',\n    borderRadius: 'var(--radius-card)',\n    cursor: 'grab',\n    backgroundColor: 'var(--color-bg-surface)',\n    border: '1px solid var(--color-border)',\n    transition: 'all 0.15s ease',\n  },\n  widgetCardHover: {\n    backgroundColor: 'var(--color-bg-hover)',\n    borderColor: 'var(--color-action-primary-border)',\n    boxShadow: 'var(--shadow-elevation-1)',\n  },\n  dragHandle: {\n    width: '16px',\n    height: '16px',\n    color: 'var(--color-text-muted)',\n    opacity: 0.5,\n    flexShrink: 0,\n  },\n  widgetIcon: {\n    width: '36px',\n    height: '36px',\n    borderRadius: 'var(--radius-button)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n  },\n  widgetIconInner: {\n    width: '18px',\n    height: '18px',\n    color: 'var(--color-action-primary-bg)',\n  },\n  widgetText: {\n    flex: 1,\n    minWidth: 0,\n    overflow: 'hidden',\n  },\n  widgetName: {\n    fontSize: 'var(--font-size-body-sm)',\n    fontWeight: 'var(--font-weight-medium)' as const,\n    color: 'var(--color-text-primary)',\n    whiteSpace: 'nowrap' as const,\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    marginBottom: '2px',\n  },\n  widgetDescription: {\n    fontSize: 'var(--font-size-body-xs)',\n    color: 'var(--color-text-muted)',\n    lineHeight: 1.3,\n    overflow: 'hidden',\n    display: '-webkit-box',\n    WebkitLineClamp: 2,\n    WebkitBoxOrient: 'vertical' as const,\n  },\n  emptyState: {\n    textAlign: 'center' as const,\n    padding: 'var(--space-pagePadding)',\n  },\n  emptyIcon: {\n    width: '48px',\n    height: '48px',\n    borderRadius: 'var(--radius-card)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    margin: '0 auto var(--space-formGap)',\n  },\n  emptyText: {\n    fontSize: 'var(--font-size-body-sm)',\n    color: 'var(--color-text-muted)',\n    margin: 0,\n  },\n  clearButton: {\n    marginTop: 'var(--space-controlGap)',\n    padding: 'var(--space-controlGap) var(--space-formGap)',\n    fontSize: 'var(--font-size-body-xs)',\n    fontWeight: 'var(--font-weight-medium)' as const,\n    color: 'var(--color-action-primary-text)',\n    backgroundColor: 'var(--color-action-primary-bg)',\n    border: 'none',\n    borderRadius: 'var(--radius-button)',\n    cursor: 'pointer',\n  },\n  footer: {\n    padding: 'var(--space-controlGap) var(--space-formGap)',\n    borderTop: '1px solid var(--color-border)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    flexShrink: 0,\n  },\n  footerText: {\n    fontSize: 'var(--font-size-body-xs)',\n    color: 'var(--color-text-muted)',\n    margin: 0,\n    textAlign: 'center' as const,\n  },\n};\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const WidgetPalette: FC<WidgetPaletteProps> = memo(function WidgetPalette({\n  isOpen,\n  onClose,\n  onWidgetSelect,\n  onDragStart,\n  onDragEnd,\n  installedWidgets = [],\n  installedWidgetsLoading = false,\n}) {\n  const [searchQuery, setSearchQuery] = useState('');\n  const [expandedCategories, setExpandedCategories] = useState<Set<WidgetCategory>>(\n    new Set(['KPI', 'Visualization', 'Data', 'Content', 'Temporal', 'Custom', 'Installed'])\n  );\n  const [hoveredWidget, setHoveredWidget] = useState<string | null>(null);\n\n  // Get categorized widgets, merging in installed widgets\n  const categories = useMemo(() => {\n    const staticCategories = getWidgetCategories();\n    return staticCategories\n      .map((cat) => {\n        if (cat.category === 'Installed') {\n          return { ...cat, widgets: installedWidgets };\n        }\n        return cat;\n      })\n      .filter((cat) => cat.category !== 'Installed' || cat.widgets.length > 0);\n  }, [installedWidgets]);\n\n  // Filter widgets by search query\n  const filteredCategories = useMemo(() => {\n    if (!searchQuery.trim()) {\n      return categories;\n    }\n\n    const query = searchQuery.toLowerCase();\n    return categories\n      .map((cat) => ({\n        ...cat,\n        widgets: cat.widgets.filter(\n          (w) =>\n            w.name.toLowerCase().includes(query) ||\n            w.description.toLowerCase().includes(query) ||\n            w.tags.some((tag) => tag.includes(query))\n        ),\n      }))\n      .filter((cat) => cat.widgets.length > 0);\n  }, [categories, searchQuery]);\n\n  // Toggle category expansion\n  const toggleCategory = useCallback((category: WidgetCategory) => {\n    setExpandedCategories((prev) => {\n      const next = new Set(prev);\n      if (next.has(category)) {\n        next.delete(category);\n      } else {\n        next.add(category);\n      }\n      return next;\n    });\n  }, []);\n\n  // Handle drag start\n  const handleDragStart = useCallback(\n    (e: React.DragEvent, widget: WidgetDefinition) => {\n      e.dataTransfer.setData(\n        'application/json',\n        JSON.stringify({\n          type: widget.type,\n          name: widget.name,\n          defaultSize: widget.defaultSize,\n          defaultConfig: widget.defaultConfig,\n          category: widget.category,\n        })\n      );\n      e.dataTransfer.effectAllowed = 'copy';\n\n      // Create custom drag image\n      const dragImage = document.createElement('div');\n      dragImage.style.cssText = `\n        position: absolute;\n        top: -1000px;\n        left: -1000px;\n        padding: 8px 12px;\n        background: var(--color-bg-surface);\n        border: 2px solid var(--color-action-primary-bg);\n        border-radius: 8px;\n        font-size: 14px;\n        font-weight: 500;\n        color: var(--color-text-primary);\n        box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n      `;\n      dragImage.textContent = widget.name;\n      document.body.appendChild(dragImage);\n      e.dataTransfer.setDragImage(dragImage, 0, 0);\n\n      setTimeout(() => {\n        document.body.removeChild(dragImage);\n      }, 0);\n\n      onDragStart?.(widget.type, widget);\n    },\n    [onDragStart]\n  );\n\n  // Handle drag end\n  const handleDragEnd = useCallback(() => {\n    onDragEnd?.();\n  }, [onDragEnd]);\n\n  // Handle click to quick-add\n  const handleWidgetClick = useCallback(\n    (widget: WidgetDefinition) => {\n      onWidgetSelect?.(widget.type, widget);\n    },\n    [onWidgetSelect]\n  );\n\n  if (!isOpen) {\n    return null;\n  }\n\n  return (\n    <div style={styles.container}>\n      {/* Header */}\n      <div style={styles.header}>\n        <div style={styles.headerTop}>\n          <div style={styles.headerTitle}>\n            <div style={styles.headerIcon}>\n              <Layers style={{ width: '18px', height: '18px', color: 'var(--color-action-primary-text)' }} />\n            </div>\n            <div>\n              <h3 style={styles.title}>Widgets</h3>\n              <p style={styles.subtitle}>Drag or click to add</p>\n            </div>\n          </div>\n          <button\n            type=\"button\"\n            onClick={onClose}\n            style={styles.closeButton}\n            onMouseOver={(e) => (e.currentTarget.style.backgroundColor = 'var(--color-bg-hover)')}\n            onMouseOut={(e) => (e.currentTarget.style.backgroundColor = 'transparent')}\n          >\n            <X style={{ width: '16px', height: '16px' }} />\n          </button>\n        </div>\n\n        {/* Search */}\n        <div style={styles.searchContainer}>\n          <Search style={styles.searchIcon} />\n          <Input\n            type=\"text\"\n            placeholder=\"Search widgets...\"\n            value={searchQuery}\n            onChange={(e) => setSearchQuery(e.target.value)}\n            style={styles.searchInput}\n          />\n        </div>\n      </div>\n\n      {/* Widget Categories */}\n      <div style={styles.content}>\n        <div style={styles.scrollArea}>\n          {filteredCategories.map((category) => (\n            <div key={category.category} style={styles.categoryContainer}>\n              {/* Category Header */}\n              <button\n                type=\"button\"\n                onClick={() => toggleCategory(category.category)}\n                style={styles.categoryHeader}\n                onMouseOver={(e) => (e.currentTarget.style.backgroundColor = 'var(--color-bg-hover)')}\n                onMouseOut={(e) => (e.currentTarget.style.backgroundColor = 'transparent')}\n              >\n                {expandedCategories.has(category.category) ? (\n                  <ChevronDown style={styles.categoryChevron} />\n                ) : (\n                  <ChevronRight style={styles.categoryChevron} />\n                )}\n                <span style={styles.categoryLabel}>{category.label}</span>\n                <span style={styles.categoryCount}>{category.widgets.length}</span>\n              </button>\n\n              {/* Widget Items */}\n              {expandedCategories.has(category.category) && (\n                <div style={styles.widgetList}>\n                  {installedWidgetsLoading && category.category === 'Installed' && (\n                    <div\n                      style={{\n                        fontSize: 'var(--font-size-body-xs)',\n                        color: 'var(--color-text-muted)',\n                        padding: 'var(--space-controlGap)',\n                      }}\n                    >\n                      Loading...\n                    </div>\n                  )}\n                  {category.widgets.map((widget) => {\n                    const IconComponent = getIconComponent(widget.icon);\n                    const widgetKey = getWidgetKey(widget);\n                    const isHovered = hoveredWidget === widgetKey;\n\n                    return (\n                      <div\n                        key={widgetKey}\n                        draggable\n                        onDragStart={(e) => handleDragStart(e, widget)}\n                        onDragEnd={handleDragEnd}\n                        onClick={() => handleWidgetClick(widget)}\n                        onMouseEnter={() => setHoveredWidget(widgetKey)}\n                        onMouseLeave={() => setHoveredWidget(null)}\n                        style={{\n                          ...styles.widgetCard,\n                          ...(isHovered ? styles.widgetCardHover : {}),\n                        }}\n                      >\n                        {/* Drag Handle */}\n                        <GripVertical style={styles.dragHandle} />\n\n                        {/* Icon */}\n                        <div style={styles.widgetIcon}>\n                          <IconComponent style={styles.widgetIconInner} />\n                        </div>\n\n                        {/* Text */}\n                        <div style={styles.widgetText}>\n                          <div style={styles.widgetName}>{widget.name}</div>\n                          <div style={styles.widgetDescription}>{widget.description}</div>\n                        </div>\n                      </div>\n                    );\n                  })}\n                </div>\n              )}\n            </div>\n          ))}\n\n          {filteredCategories.length === 0 && (\n            <div style={styles.emptyState}>\n              <div style={styles.emptyIcon}>\n                <Search style={{ width: '24px', height: '24px', color: 'var(--color-text-muted)' }} />\n              </div>\n              <p style={styles.emptyText}>\n                No widgets found for \"<strong>{searchQuery}</strong>\"\n              </p>\n              <button type=\"button\" onClick={() => setSearchQuery('')} style={styles.clearButton}>\n                Clear search\n              </button>\n            </div>\n          )}\n        </div>\n      </div>\n\n      {/* Footer */}\n      <div style={styles.footer}>\n        <p style={styles.footerText}>Drag widgets to position them on the canvas</p>\n      </div>\n    </div>\n  );\n});\n\nexport default WidgetPalette;\n"],"mappings":"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"}
+{"version":3,"file":"WidgetPalette.js","names":[],"sources":["../../../../src/bigconsole/components/dashboard/WidgetPalette.tsx"],"sourcesContent":["/**\n * WidgetPalette Component\n *\n * Sidebar panel with draggable widget types for the dashboard builder.\n * Uses semantic tokens for consistent theming.\n * Features categorized widgets, search, and drag-and-drop support.\n */\n\nimport { type FC, memo, useState, useCallback, useMemo } from 'react';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport {\n  Search,\n  ChevronDown,\n  ChevronRight,\n  TrendingUp,\n  BarChart3,\n  Filter,\n  Table,\n  Grid3x3,\n  Gauge,\n  Activity,\n  List,\n  FileText,\n  Type,\n  ExternalLink,\n  MapPin,\n  Calendar,\n  Columns,\n  GitBranch,\n  Puzzle,\n  LayoutDashboard,\n  GripVertical,\n  X,\n  Layers,\n  type LucideIcon,\n} from 'lucide-react';\nimport {\n  getWidgetCategories,\n  getWidgetKey,\n  WIDGET_CATEGORY_LABELS,\n  type WidgetDefinition,\n} from '../widgets/WidgetRegistry';\nimport type { WidgetType, WidgetCategory } from '../../types';\n\n// ============================================================================\n// Icon Mapping\n// ============================================================================\n\nconst ICON_MAP: Record<string, LucideIcon> = {\n  TrendingUp,\n  BarChart3,\n  Filter,\n  Table,\n  Grid3x3,\n  Gauge,\n  Activity,\n  List,\n  FileText,\n  Type,\n  ExternalLink,\n  MapPin,\n  Calendar,\n  Columns,\n  GitBranch,\n  Puzzle,\n  LayoutDashboard,\n};\n\nfunction getIconComponent(iconName: string): LucideIcon {\n  return ICON_MAP[iconName] || Puzzle;\n}\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface WidgetPaletteProps {\n  /** Whether the palette is open */\n  isOpen: boolean;\n  /** Callback to close the palette */\n  onClose: () => void;\n  /** Callback when a widget is selected (for quick add without drag) */\n  onWidgetSelect?: (type: WidgetType, definition?: WidgetDefinition) => void;\n  /** Callback when drag starts */\n  onDragStart?: (type: WidgetType, definition: WidgetDefinition) => void;\n  /** Callback when drag ends */\n  onDragEnd?: () => void;\n  /** Installed widgets from the store (fetched by parent) */\n  installedWidgets?: WidgetDefinition[];\n  /** Whether installed widgets are still loading */\n  installedWidgetsLoading?: boolean;\n  /**\n   * Built-in widget catalog (from the backend `getWidgetTypes`, fetched by the\n   * parent via useWidgetCatalog). When omitted, falls back to the bundled\n   * static registry.\n   */\n  definitions?: WidgetDefinition[];\n}\n\n// ============================================================================\n// Styles using semantic tokens\n// ============================================================================\n\nconst styles = {\n  container: {\n    width: '300px',\n    height: '100%',\n    backgroundColor: 'var(--color-bg-surface)',\n    borderRight: '1px solid var(--color-border)',\n    display: 'flex',\n    flexDirection: 'column' as const,\n    flexShrink: 0,\n    overflow: 'hidden',\n    position: 'relative' as const,\n  },\n  header: {\n    padding: 'var(--space-formGap)',\n    borderBottom: '1px solid var(--color-border)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    flexShrink: 0,\n  },\n  headerTop: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    marginBottom: 'var(--space-controlGap)',\n  },\n  headerTitle: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: 'var(--space-iconGap)',\n  },\n  headerIcon: {\n    width: '32px',\n    height: '32px',\n    borderRadius: 'var(--radius-button)',\n    backgroundColor: 'var(--color-action-primary-bg)',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  title: {\n    fontSize: 'var(--font-size-body-md)',\n    fontWeight: 'var(--font-weight-semibold)' as const,\n    color: 'var(--color-text-primary)',\n    margin: 0,\n  },\n  subtitle: {\n    fontSize: 'var(--font-size-body-xs)',\n    color: 'var(--color-text-muted)',\n    margin: '2px 0 0 0',\n  },\n  closeButton: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '28px',\n    height: '28px',\n    border: 'none',\n    background: 'transparent',\n    borderRadius: 'var(--radius-button)',\n    cursor: 'pointer',\n    color: 'var(--color-text-secondary)',\n    transition: 'background-color 0.15s',\n  },\n  searchContainer: {\n    position: 'relative' as const,\n  },\n  searchIcon: {\n    position: 'absolute' as const,\n    left: '10px',\n    top: '50%',\n    transform: 'translateY(-50%)',\n    width: '16px',\n    height: '16px',\n    color: 'var(--color-text-muted)',\n    pointerEvents: 'none' as const,\n  },\n  searchInput: {\n    width: '100%',\n    paddingLeft: '36px',\n    height: 'var(--size-controlHeight-sm)',\n    fontSize: 'var(--font-size-body-sm)',\n  },\n  content: {\n    flex: '1 1 0',\n    minHeight: 0,\n    overflow: 'hidden',\n    position: 'relative' as const,\n  },\n  scrollArea: {\n    position: 'absolute' as const,\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    overflowY: 'auto' as const,\n    overflowX: 'hidden' as const,\n    padding: 'var(--space-controlGap)',\n  },\n  categoryContainer: {\n    marginBottom: 'var(--space-controlGap)',\n  },\n  categoryHeader: {\n    width: '100%',\n    display: 'flex',\n    alignItems: 'center',\n    gap: 'var(--space-iconGap)',\n    padding: 'var(--space-controlGap) var(--space-iconGap)',\n    border: 'none',\n    background: 'transparent',\n    cursor: 'pointer',\n    borderRadius: 'var(--radius-button)',\n    transition: 'background-color 0.15s',\n  },\n  categoryChevron: {\n    width: '16px',\n    height: '16px',\n    color: 'var(--color-text-muted)',\n    flexShrink: 0,\n  },\n  categoryLabel: {\n    flex: 1,\n    textAlign: 'left' as const,\n    fontSize: 'var(--font-size-body-xs)',\n    fontWeight: 'var(--font-weight-semibold)' as const,\n    color: 'var(--color-text-secondary)',\n    textTransform: 'uppercase' as const,\n    letterSpacing: '0.05em',\n  },\n  categoryCount: {\n    fontSize: 'var(--font-size-body-xs)',\n    color: 'var(--color-text-muted)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    padding: '2px 8px',\n    borderRadius: 'var(--radius-full)',\n  },\n  widgetList: {\n    display: 'flex',\n    flexDirection: 'column' as const,\n    gap: '4px',\n    marginTop: 'var(--space-controlGap)',\n    paddingLeft: '4px',\n  },\n  widgetCard: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: 'var(--space-iconGap)',\n    padding: 'var(--space-controlGap)',\n    borderRadius: 'var(--radius-card)',\n    cursor: 'grab',\n    backgroundColor: 'var(--color-bg-surface)',\n    border: '1px solid var(--color-border)',\n    transition: 'all 0.15s ease',\n  },\n  widgetCardHover: {\n    backgroundColor: 'var(--color-bg-hover)',\n    borderColor: 'var(--color-action-primary-border)',\n    boxShadow: 'var(--shadow-elevation-1)',\n  },\n  dragHandle: {\n    width: '16px',\n    height: '16px',\n    color: 'var(--color-text-muted)',\n    opacity: 0.5,\n    flexShrink: 0,\n  },\n  widgetIcon: {\n    width: '36px',\n    height: '36px',\n    borderRadius: 'var(--radius-button)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n  },\n  widgetIconInner: {\n    width: '18px',\n    height: '18px',\n    color: 'var(--color-action-primary-bg)',\n  },\n  widgetText: {\n    flex: 1,\n    minWidth: 0,\n    overflow: 'hidden',\n  },\n  widgetName: {\n    fontSize: 'var(--font-size-body-sm)',\n    fontWeight: 'var(--font-weight-medium)' as const,\n    color: 'var(--color-text-primary)',\n    whiteSpace: 'nowrap' as const,\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    marginBottom: '2px',\n  },\n  widgetDescription: {\n    fontSize: 'var(--font-size-body-xs)',\n    color: 'var(--color-text-muted)',\n    lineHeight: 1.3,\n    overflow: 'hidden',\n    display: '-webkit-box',\n    WebkitLineClamp: 2,\n    WebkitBoxOrient: 'vertical' as const,\n  },\n  emptyState: {\n    textAlign: 'center' as const,\n    padding: 'var(--space-pagePadding)',\n  },\n  emptyIcon: {\n    width: '48px',\n    height: '48px',\n    borderRadius: 'var(--radius-card)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    margin: '0 auto var(--space-formGap)',\n  },\n  emptyText: {\n    fontSize: 'var(--font-size-body-sm)',\n    color: 'var(--color-text-muted)',\n    margin: 0,\n  },\n  clearButton: {\n    marginTop: 'var(--space-controlGap)',\n    padding: 'var(--space-controlGap) var(--space-formGap)',\n    fontSize: 'var(--font-size-body-xs)',\n    fontWeight: 'var(--font-weight-medium)' as const,\n    color: 'var(--color-action-primary-text)',\n    backgroundColor: 'var(--color-action-primary-bg)',\n    border: 'none',\n    borderRadius: 'var(--radius-button)',\n    cursor: 'pointer',\n  },\n  footer: {\n    padding: 'var(--space-controlGap) var(--space-formGap)',\n    borderTop: '1px solid var(--color-border)',\n    backgroundColor: 'var(--color-bg-sunken)',\n    flexShrink: 0,\n  },\n  footerText: {\n    fontSize: 'var(--font-size-body-xs)',\n    color: 'var(--color-text-muted)',\n    margin: 0,\n    textAlign: 'center' as const,\n  },\n};\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const WidgetPalette: FC<WidgetPaletteProps> = memo(function WidgetPalette({\n  isOpen,\n  onClose,\n  onWidgetSelect,\n  onDragStart,\n  onDragEnd,\n  installedWidgets = [],\n  installedWidgetsLoading = false,\n  definitions,\n}) {\n  const [searchQuery, setSearchQuery] = useState('');\n  const [expandedCategories, setExpandedCategories] = useState<Set<WidgetCategory>>(\n    new Set(['KPI', 'Visualization', 'Data', 'Content', 'Temporal', 'Custom', 'Installed'])\n  );\n  const [hoveredWidget, setHoveredWidget] = useState<string | null>(null);\n\n  // Get categorized widgets, merging in installed widgets. When the parent\n  // supplies a backend-sourced catalog (`definitions`), group that by category;\n  // otherwise fall back to the bundled static registry.\n  const categories = useMemo(() => {\n    const baseCategories = definitions\n      ? (Object.keys(WIDGET_CATEGORY_LABELS) as WidgetCategory[]).map((category) => ({\n          category,\n          label: WIDGET_CATEGORY_LABELS[category],\n          widgets: definitions.filter((def) => def.category === category),\n        }))\n      : getWidgetCategories();\n\n    return baseCategories\n      .map((cat) => {\n        if (cat.category === 'Installed') {\n          return { ...cat, widgets: installedWidgets };\n        }\n        return cat;\n      })\n      .filter((cat) => cat.category !== 'Installed' || cat.widgets.length > 0);\n  }, [installedWidgets, definitions]);\n\n  // Filter widgets by search query\n  const filteredCategories = useMemo(() => {\n    if (!searchQuery.trim()) {\n      return categories;\n    }\n\n    const query = searchQuery.toLowerCase();\n    return categories\n      .map((cat) => ({\n        ...cat,\n        widgets: cat.widgets.filter(\n          (w) =>\n            w.name.toLowerCase().includes(query) ||\n            w.description.toLowerCase().includes(query) ||\n            w.tags.some((tag) => tag.includes(query))\n        ),\n      }))\n      .filter((cat) => cat.widgets.length > 0);\n  }, [categories, searchQuery]);\n\n  // Toggle category expansion\n  const toggleCategory = useCallback((category: WidgetCategory) => {\n    setExpandedCategories((prev) => {\n      const next = new Set(prev);\n      if (next.has(category)) {\n        next.delete(category);\n      } else {\n        next.add(category);\n      }\n      return next;\n    });\n  }, []);\n\n  // Handle drag start\n  const handleDragStart = useCallback(\n    (e: React.DragEvent, widget: WidgetDefinition) => {\n      e.dataTransfer.setData(\n        'application/json',\n        JSON.stringify({\n          type: widget.type,\n          name: widget.name,\n          defaultSize: widget.defaultSize,\n          defaultConfig: widget.defaultConfig,\n          category: widget.category,\n        })\n      );\n      e.dataTransfer.effectAllowed = 'copy';\n\n      // Create custom drag image\n      const dragImage = document.createElement('div');\n      dragImage.style.cssText = `\n        position: absolute;\n        top: -1000px;\n        left: -1000px;\n        padding: 8px 12px;\n        background: var(--color-bg-surface);\n        border: 2px solid var(--color-action-primary-bg);\n        border-radius: 8px;\n        font-size: 14px;\n        font-weight: 500;\n        color: var(--color-text-primary);\n        box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n      `;\n      dragImage.textContent = widget.name;\n      document.body.appendChild(dragImage);\n      e.dataTransfer.setDragImage(dragImage, 0, 0);\n\n      setTimeout(() => {\n        document.body.removeChild(dragImage);\n      }, 0);\n\n      onDragStart?.(widget.type, widget);\n    },\n    [onDragStart]\n  );\n\n  // Handle drag end\n  const handleDragEnd = useCallback(() => {\n    onDragEnd?.();\n  }, [onDragEnd]);\n\n  // Handle click to quick-add\n  const handleWidgetClick = useCallback(\n    (widget: WidgetDefinition) => {\n      onWidgetSelect?.(widget.type, widget);\n    },\n    [onWidgetSelect]\n  );\n\n  if (!isOpen) {\n    return null;\n  }\n\n  return (\n    <div style={styles.container}>\n      {/* Header */}\n      <div style={styles.header}>\n        <div style={styles.headerTop}>\n          <div style={styles.headerTitle}>\n            <div style={styles.headerIcon}>\n              <Layers style={{ width: '18px', height: '18px', color: 'var(--color-action-primary-text)' }} />\n            </div>\n            <div>\n              <h3 style={styles.title}>Widgets</h3>\n              <p style={styles.subtitle}>Drag or click to add</p>\n            </div>\n          </div>\n          <button\n            type=\"button\"\n            onClick={onClose}\n            style={styles.closeButton}\n            onMouseOver={(e) => (e.currentTarget.style.backgroundColor = 'var(--color-bg-hover)')}\n            onMouseOut={(e) => (e.currentTarget.style.backgroundColor = 'transparent')}\n          >\n            <X style={{ width: '16px', height: '16px' }} />\n          </button>\n        </div>\n\n        {/* Search */}\n        <div style={styles.searchContainer}>\n          <Search style={styles.searchIcon} />\n          <Input\n            type=\"text\"\n            placeholder=\"Search widgets...\"\n            value={searchQuery}\n            onChange={(e) => setSearchQuery(e.target.value)}\n            style={styles.searchInput}\n          />\n        </div>\n      </div>\n\n      {/* Widget Categories */}\n      <div style={styles.content}>\n        <div style={styles.scrollArea}>\n          {filteredCategories.map((category) => (\n            <div key={category.category} style={styles.categoryContainer}>\n              {/* Category Header */}\n              <button\n                type=\"button\"\n                onClick={() => toggleCategory(category.category)}\n                style={styles.categoryHeader}\n                onMouseOver={(e) => (e.currentTarget.style.backgroundColor = 'var(--color-bg-hover)')}\n                onMouseOut={(e) => (e.currentTarget.style.backgroundColor = 'transparent')}\n              >\n                {expandedCategories.has(category.category) ? (\n                  <ChevronDown style={styles.categoryChevron} />\n                ) : (\n                  <ChevronRight style={styles.categoryChevron} />\n                )}\n                <span style={styles.categoryLabel}>{category.label}</span>\n                <span style={styles.categoryCount}>{category.widgets.length}</span>\n              </button>\n\n              {/* Widget Items */}\n              {expandedCategories.has(category.category) && (\n                <div style={styles.widgetList}>\n                  {installedWidgetsLoading && category.category === 'Installed' && (\n                    <div\n                      style={{\n                        fontSize: 'var(--font-size-body-xs)',\n                        color: 'var(--color-text-muted)',\n                        padding: 'var(--space-controlGap)',\n                      }}\n                    >\n                      Loading...\n                    </div>\n                  )}\n                  {category.widgets.map((widget) => {\n                    const IconComponent = getIconComponent(widget.icon);\n                    const widgetKey = getWidgetKey(widget);\n                    const isHovered = hoveredWidget === widgetKey;\n\n                    return (\n                      <div\n                        key={widgetKey}\n                        draggable\n                        onDragStart={(e) => handleDragStart(e, widget)}\n                        onDragEnd={handleDragEnd}\n                        onClick={() => handleWidgetClick(widget)}\n                        onMouseEnter={() => setHoveredWidget(widgetKey)}\n                        onMouseLeave={() => setHoveredWidget(null)}\n                        style={{\n                          ...styles.widgetCard,\n                          ...(isHovered ? styles.widgetCardHover : {}),\n                        }}\n                      >\n                        {/* Drag Handle */}\n                        <GripVertical style={styles.dragHandle} />\n\n                        {/* Icon */}\n                        <div style={styles.widgetIcon}>\n                          <IconComponent style={styles.widgetIconInner} />\n                        </div>\n\n                        {/* Text */}\n                        <div style={styles.widgetText}>\n                          <div style={styles.widgetName}>{widget.name}</div>\n                          <div style={styles.widgetDescription}>{widget.description}</div>\n                        </div>\n                      </div>\n                    );\n                  })}\n                </div>\n              )}\n            </div>\n          ))}\n\n          {filteredCategories.length === 0 && (\n            <div style={styles.emptyState}>\n              <div style={styles.emptyIcon}>\n                <Search style={{ width: '24px', height: '24px', color: 'var(--color-text-muted)' }} />\n              </div>\n              <p style={styles.emptyText}>\n                No widgets found for \"<strong>{searchQuery}</strong>\"\n              </p>\n              <button type=\"button\" onClick={() => setSearchQuery('')} style={styles.clearButton}>\n                Clear search\n              </button>\n            </div>\n          )}\n        </div>\n      </div>\n\n      {/* Footer */}\n      <div style={styles.footer}>\n        <p style={styles.footerText}>Drag widgets to position them on the canvas</p>\n      </div>\n    </div>\n  );\n});\n\nexport default WidgetPalette;\n"],"mappings":"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"}

package/dist/bigconsole/components/widgets/PropertiesPanel.js

@@ -1,12 +1,12 @@
 import { useWidgetStore as e } from "../../store/widgetStore.js";
 import "../../store/index.js";
-import t from "../../hooks/useWidgetOperations.js";
-import n from "../../hooks/useDrilldownOperations.js";
-import r from "../../hooks/useWidgetActions.js";
-import i from "../../hooks/useDataSinkOperations.js";
-import a from "../../hooks/useParserOperations.js";
+import { getWidgetDefinition as t } from "./WidgetRegistry.js";
+import n from "../../hooks/useWidgetOperations.js";
+import r from "../../hooks/useDrilldownOperations.js";
+import i from "../../hooks/useWidgetActions.js";
+import a from "../../hooks/useDataSinkOperations.js";
+import o from "../../hooks/useParserOperations.js";
 import "../../hooks/index.js";
-import { getWidgetDefinition as o } from "./WidgetRegistry.js";
 import s from "./chart/ChartConfig.js";
 import c from "./gauge/GaugeConfig.js";
 import l from "./list/ListConfig.js";
@@ -334,10 +334,10 @@ var Ee = p(function({ widget: e, onSave: t }) {
 			} : void 0
 		}), I(!1), f("idle")) : g(null);
 	}, [z]);
-	let { updateWidget: B } = t(z?.pageId, z?.dashboardId, { skipFetch: !0 }), { createDrilldown: V, updateDrilldown: H, deleteDrilldown: U } = n(), { dataSinks: W } = i({ skipFetch: !1 }), [G, K] = _(null), { executeParser: Oe } = a({
+	let { updateWidget: B } = n(z?.pageId, z?.dashboardId, { skipFetch: !0 }), { createDrilldown: V, updateDrilldown: H, deleteDrilldown: U } = r(), { dataSinks: W } = a({ skipFetch: !1 }), [G, K] = _(null), { executeParser: Oe } = o({
 		consoleId: z?.dashboardId,
 		skipFetch: !0
-	}), [ke, Ae] = _(!1), { actions: q, loading: J, createAction: je, updateAction: Me, deleteAction: Ne, reorderActions: Y } = r(L || void 0), [Pe, X] = _(!1), [Fe, Z] = _(void 0), [Ie, Le] = _(!1), Re = m(() => {
+	}), [ke, Ae] = _(!1), { actions: q, loading: J, createAction: je, updateAction: Me, deleteAction: Ne, reorderActions: Y } = i(L || void 0), [Pe, X] = _(!1), [Fe, Z] = _(void 0), [Ie, Le] = _(!1), Re = m(() => {
 		Z(void 0), X(!0);
 	}, []), ze = m((e) => {
 		Z(e), X(!0);
@@ -573,7 +573,7 @@ var Ee = p(function({ widget: e, onSave: t }) {
 			...t,
 			drilldownConfig: e
 		}), I(!0);
-	}, []), Xe = z ? o(z.type) : null, Ze = z ? Te(z.type) : null;
+	}, []), Xe = z ? t(z.type) : null, Ze = z ? Te(z.type) : null;
 	return /* @__PURE__ */ S(me, {
 		open: s,
 		onOpenChange: (e) => !e && c(),

package/dist/bigconsole/components/widgets/WidgetRegistry.js

@@ -801,10 +801,13 @@ function n(n) {
 		type: n
 	};
 }
-function r(t) {
+function r() {
+	return Object.values(e);
+}
+function i(t) {
 	return Object.values(e).filter((e) => e.category === t);
 }
-var i = {
+var a = {
 	KPI: "Metrics & KPIs",
 	Visualization: "Charts & Visualization",
 	Data: "Data Display",
@@ -813,7 +816,7 @@ var i = {
 	Custom: "Custom",
 	Installed: "Installed from Store"
 };
-function a() {
+function o() {
 	return [
 		"KPI",
 		"Visualization",
@@ -824,14 +827,14 @@ function a() {
 		"Installed"
 	].map((e) => ({
 		category: e,
-		label: i[e],
-		widgets: r(e)
+		label: a[e],
+		widgets: i(e)
 	}));
 }
-function o(e) {
+function s(e) {
 	return e.defaultConfig?.componentId ? `installed-${e.defaultConfig.componentId}` : e.category === "Installed" ? `installed-${e.name}` : e.type;
 }
 //#endregion
-export { i as WIDGET_CATEGORY_LABELS, e as default, a as getWidgetCategories, n as getWidgetDefinition, o as getWidgetKey, r as getWidgetsByCategory };
+export { a as WIDGET_CATEGORY_LABELS, e as default, r as getAllWidgetDefinitions, o as getWidgetCategories, n as getWidgetDefinition, s as getWidgetKey, i as getWidgetsByCategory };
 
 //# sourceMappingURL=WidgetRegistry.js.map