@burdenoff/microfe-bigconsole 2026.510.54

package/dist/bigconsole/components/dashboard/GlobalFiltersBar/FilterEditor.js

@@ -0,0 +1,415 @@
+import { useEffect as e, useState as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/bigconsole/components/dashboard/GlobalFiltersBar/FilterEditor.tsx
+var i = (e) => ({
+	bgPrimary: e ? "#1f2937" : "#ffffff",
+	bgSecondary: e ? "#374151" : "#f9fafb",
+	textPrimary: e ? "#f9fafb" : "#111827",
+	textSecondary: e ? "#9ca3af" : "#6b7280",
+	borderDefault: e ? "#4b5563" : "#e5e7eb",
+	actionPrimaryBg: "#6366f1",
+	actionPrimaryBgSubtle: e ? "#312e81" : "#eef2ff",
+	actionPrimaryFg: "#ffffff",
+	bgTertiary: e ? "#4b5563" : "#f3f4f6",
+	textTertiary: e ? "#6b7280" : "#9ca3af",
+	statusErrorText: "#dc2626",
+	backdropBg: "rgba(0, 0, 0, 0.5)"
+}), a = [
+	{
+		value: "CATEGORY",
+		label: "Category",
+		description: "Selection from predefined categories"
+	},
+	{
+		value: "DATE_RANGE",
+		label: "Date Range",
+		description: "Start and end date selection"
+	},
+	{
+		value: "NUMERIC_RANGE",
+		label: "Numeric Range",
+		description: "Min and max number values"
+	},
+	{
+		value: "TEXT_SEARCH",
+		label: "Text Search",
+		description: "Free text search input"
+	},
+	{
+		value: "CUSTOM",
+		label: "Custom",
+		description: "Custom filter configuration"
+	}
+];
+function o({ filter: o, onSave: s, onClose: c }) {
+	let [l, u] = t(o?.name || ""), [d, f] = t(o?.type || "CATEGORY"), [p, m] = t(o?.isRequired || !1), [h, g] = t(o?.config?.options || [{
+		value: "",
+		label: ""
+	}]), [_, v] = t(o?.config?.placeholder || ""), [y, b] = t(!1);
+	e(() => {
+		let e = () => {
+			b(document.documentElement.classList.contains("dark"));
+		};
+		e();
+		let t = new MutationObserver(e);
+		return t.observe(document.documentElement, {
+			attributes: !0,
+			attributeFilter: ["class"]
+		}), () => t.disconnect();
+	}, []);
+	let x = i(y), S = !!o, C = () => {
+		g([...h, {
+			value: "",
+			label: ""
+		}]);
+	}, w = (e) => {
+		g(h.filter((t, n) => n !== e));
+	}, T = (e, t, n) => {
+		g(h.map((r, i) => i === e ? {
+			...r,
+			[t]: n
+		} : r));
+	}, E = () => {
+		let e = {};
+		d === "CATEGORY" && (e.options = h.filter((e) => e.value && e.label)), _ && (e.placeholder = _), s({
+			name: l,
+			type: d,
+			config: e,
+			isRequired: p
+		});
+	}, D = l.trim() !== "" && (d !== "CATEGORY" || h.some((e) => e.value && e.label));
+	return /* @__PURE__ */ n("div", {
+		style: {
+			position: "fixed",
+			top: 0,
+			left: 0,
+			right: 0,
+			bottom: 0,
+			width: "100vw",
+			height: "100vh",
+			backgroundColor: x.backdropBg,
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "center",
+			zIndex: 1e4,
+			isolation: "isolate"
+		},
+		onClick: c,
+		children: /* @__PURE__ */ r("div", {
+			style: {
+				width: "480px",
+				maxWidth: "90vw",
+				maxHeight: "80vh",
+				backgroundColor: x.bgPrimary,
+				borderRadius: "8px",
+				boxShadow: "0 8px 32px rgba(0, 0, 0, 0.3)",
+				overflow: "hidden",
+				position: "relative"
+			},
+			onClick: (e) => e.stopPropagation(),
+			children: [
+				/* @__PURE__ */ r("div", {
+					style: {
+						padding: "16px 20px",
+						borderBottom: `1px solid ${x.borderDefault}`,
+						display: "flex",
+						alignItems: "center",
+						justifyContent: "space-between",
+						backgroundColor: x.bgPrimary
+					},
+					children: [/* @__PURE__ */ n("h3", {
+						style: {
+							margin: 0,
+							fontSize: "16px",
+							fontWeight: 600,
+							color: x.textPrimary
+						},
+						children: S ? "Edit Filter" : "Add Filter"
+					}), /* @__PURE__ */ n("button", {
+						onClick: c,
+						style: {
+							background: "none",
+							border: "none",
+							fontSize: "20px",
+							cursor: "pointer",
+							color: x.textSecondary,
+							lineHeight: 1
+						},
+						children: "×"
+					})]
+				}),
+				/* @__PURE__ */ r("div", {
+					style: {
+						padding: "20px",
+						overflowY: "auto",
+						maxHeight: "calc(80vh - 130px)",
+						backgroundColor: x.bgPrimary
+					},
+					children: [
+						/* @__PURE__ */ r("div", {
+							style: { marginBottom: "16px" },
+							children: [/* @__PURE__ */ n("label", {
+								style: {
+									display: "block",
+									marginBottom: "6px",
+									fontSize: "13px",
+									fontWeight: 500,
+									color: x.textPrimary
+								},
+								children: "Filter Name *"
+							}), /* @__PURE__ */ n("input", {
+								type: "text",
+								value: l,
+								onChange: (e) => u(e.target.value),
+								placeholder: "e.g., Status, Date Range, Category",
+								style: {
+									width: "100%",
+									padding: "10px 12px",
+									border: `1px solid ${x.borderDefault}`,
+									borderRadius: "6px",
+									fontSize: "14px",
+									boxSizing: "border-box",
+									backgroundColor: x.bgPrimary,
+									color: x.textPrimary
+								}
+							})]
+						}),
+						!S && /* @__PURE__ */ r("div", {
+							style: { marginBottom: "16px" },
+							children: [/* @__PURE__ */ n("label", {
+								style: {
+									display: "block",
+									marginBottom: "8px",
+									fontSize: "13px",
+									fontWeight: 500,
+									color: x.textPrimary
+								},
+								children: "Filter Type *"
+							}), /* @__PURE__ */ n("div", {
+								style: {
+									display: "grid",
+									gridTemplateColumns: "repeat(2, 1fr)",
+									gap: "10px"
+								},
+								children: a.map((e) => /* @__PURE__ */ r("button", {
+									onClick: () => f(e.value),
+									type: "button",
+									style: {
+										padding: "12px",
+										textAlign: "left",
+										backgroundColor: d === e.value ? x.actionPrimaryBgSubtle : x.bgSecondary,
+										border: `2px solid ${d === e.value ? x.actionPrimaryBg : x.borderDefault}`,
+										borderRadius: "6px",
+										cursor: "pointer",
+										transition: "all 0.2s ease",
+										minHeight: "60px"
+									},
+									children: [/* @__PURE__ */ n("div", {
+										style: {
+											fontWeight: 500,
+											fontSize: "13px",
+											color: x.textPrimary
+										},
+										children: e.label
+									}), /* @__PURE__ */ n("div", {
+										style: {
+											fontSize: "11px",
+											color: x.textSecondary,
+											marginTop: "4px",
+											lineHeight: "1.3"
+										},
+										children: e.description
+									})]
+								}, e.value))
+							})]
+						}),
+						d === "CATEGORY" && /* @__PURE__ */ r("div", {
+							style: { marginBottom: "16px" },
+							children: [/* @__PURE__ */ n("label", {
+								style: {
+									display: "block",
+									marginBottom: "8px",
+									fontSize: "13px",
+									fontWeight: 500,
+									color: x.textPrimary
+								},
+								children: "Options"
+							}), /* @__PURE__ */ r("div", {
+								style: {
+									display: "flex",
+									flexDirection: "column",
+									gap: "8px"
+								},
+								children: [h.map((e, t) => /* @__PURE__ */ r("div", {
+									style: {
+										display: "flex",
+										gap: "8px",
+										alignItems: "center"
+									},
+									children: [
+										/* @__PURE__ */ n("input", {
+											type: "text",
+											value: e.value,
+											onChange: (e) => T(t, "value", e.target.value),
+											placeholder: "Value",
+											style: {
+												flex: 1,
+												padding: "8px 10px",
+												border: `1px solid ${x.borderDefault}`,
+												borderRadius: "4px",
+												fontSize: "13px",
+												boxSizing: "border-box",
+												backgroundColor: x.bgPrimary,
+												color: x.textPrimary
+											}
+										}),
+										/* @__PURE__ */ n("input", {
+											type: "text",
+											value: e.label,
+											onChange: (e) => T(t, "label", e.target.value),
+											placeholder: "Label",
+											style: {
+												flex: 1,
+												padding: "8px 10px",
+												border: `1px solid ${x.borderDefault}`,
+												borderRadius: "4px",
+												fontSize: "13px",
+												boxSizing: "border-box",
+												backgroundColor: x.bgPrimary,
+												color: x.textPrimary
+											}
+										}),
+										h.length > 1 && /* @__PURE__ */ n("button", {
+											type: "button",
+											onClick: () => w(t),
+											style: {
+												padding: "6px 10px",
+												backgroundColor: "transparent",
+												border: `1px solid ${x.statusErrorText}`,
+												borderRadius: "4px",
+												cursor: "pointer",
+												color: x.statusErrorText,
+												fontSize: "12px"
+											},
+											children: "Remove"
+										})
+									]
+								}, t)), /* @__PURE__ */ n("button", {
+									type: "button",
+									onClick: C,
+									style: {
+										padding: "8px",
+										backgroundColor: "transparent",
+										border: `1px dashed ${x.borderDefault}`,
+										borderRadius: "4px",
+										cursor: "pointer",
+										color: x.textSecondary,
+										fontSize: "12px"
+									},
+									children: "+ Add Option"
+								})]
+							})]
+						}),
+						(d === "TEXT_SEARCH" || d === "CATEGORY") && /* @__PURE__ */ r("div", {
+							style: { marginBottom: "16px" },
+							children: [/* @__PURE__ */ n("label", {
+								style: {
+									display: "block",
+									marginBottom: "8px",
+									fontSize: "13px",
+									fontWeight: 500,
+									color: x.textPrimary
+								},
+								children: "Placeholder Text"
+							}), /* @__PURE__ */ n("input", {
+								type: "text",
+								value: _,
+								onChange: (e) => v(e.target.value),
+								placeholder: "e.g., Select an option...",
+								style: {
+									width: "100%",
+									padding: "10px 12px",
+									border: `1px solid ${x.borderDefault}`,
+									borderRadius: "6px",
+									fontSize: "14px",
+									boxSizing: "border-box",
+									backgroundColor: x.bgPrimary,
+									color: x.textPrimary
+								}
+							})]
+						}),
+						/* @__PURE__ */ n("div", {
+							style: { marginBottom: "16px" },
+							children: /* @__PURE__ */ r("label", {
+								style: {
+									display: "flex",
+									alignItems: "center",
+									gap: "8px",
+									cursor: "pointer"
+								},
+								children: [/* @__PURE__ */ n("input", {
+									type: "checkbox",
+									checked: p,
+									onChange: (e) => m(e.target.checked),
+									style: {
+										width: "16px",
+										height: "16px"
+									}
+								}), /* @__PURE__ */ n("span", {
+									style: {
+										fontSize: "13px",
+										color: x.textPrimary
+									},
+									children: "Required filter (must have a value)"
+								})]
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ r("div", {
+					style: {
+						padding: "16px 20px",
+						borderTop: `1px solid ${x.borderDefault}`,
+						display: "flex",
+						justifyContent: "flex-end",
+						gap: "12px",
+						backgroundColor: x.bgPrimary
+					},
+					children: [/* @__PURE__ */ n("button", {
+						type: "button",
+						onClick: c,
+						style: {
+							padding: "10px 20px",
+							backgroundColor: x.bgPrimary,
+							border: `1px solid ${x.borderDefault}`,
+							borderRadius: "6px",
+							cursor: "pointer",
+							fontSize: "14px",
+							color: x.textSecondary
+						},
+						children: "Cancel"
+					}), /* @__PURE__ */ n("button", {
+						type: "button",
+						onClick: E,
+						disabled: !D,
+						style: {
+							padding: "10px 20px",
+							backgroundColor: D ? x.actionPrimaryBg : x.bgTertiary,
+							color: D ? x.actionPrimaryFg : x.textTertiary,
+							border: "none",
+							borderRadius: "6px",
+							cursor: D ? "pointer" : "not-allowed",
+							fontSize: "14px",
+							fontWeight: 500
+						},
+						children: S ? "Save Changes" : "Add Filter"
+					})]
+				})
+			]
+		})
+	});
+}
+//#endregion
+export { o as default };
+
+//# sourceMappingURL=FilterEditor.js.map

package/dist/bigconsole/components/dashboard/GlobalFiltersBar/FilterEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterEditor.js","names":[],"sources":["../../../../../src/bigconsole/components/dashboard/GlobalFiltersBar/FilterEditor.tsx"],"sourcesContent":["/**\n * FilterEditor Component\n *\n * Modal for creating/editing global filters.\n */\n\nimport React, { useState, useEffect } from 'react';\nimport type { GlobalFilter, FilterType } from '../../../hooks';\n\n// Dynamic colors that respect dark mode\nconst getColors = (isDark: boolean) => ({\n  bgPrimary: isDark ? '#1f2937' : '#ffffff',\n  bgSecondary: isDark ? '#374151' : '#f9fafb',\n  textPrimary: isDark ? '#f9fafb' : '#111827',\n  textSecondary: isDark ? '#9ca3af' : '#6b7280',\n  borderDefault: isDark ? '#4b5563' : '#e5e7eb',\n  actionPrimaryBg: '#6366f1',\n  actionPrimaryBgSubtle: isDark ? '#312e81' : '#eef2ff',\n  actionPrimaryFg: '#ffffff',\n  bgTertiary: isDark ? '#4b5563' : '#f3f4f6',\n  textTertiary: isDark ? '#6b7280' : '#9ca3af',\n  statusErrorText: '#dc2626',\n  backdropBg: 'rgba(0, 0, 0, 0.5)',\n});\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface FilterEditorProps {\n  filter: GlobalFilter | null;\n  onSave: (data: {\n    name: string;\n    type: FilterType;\n    config: Record<string, unknown>;\n    defaultValue?: unknown;\n    isRequired?: boolean;\n  }) => void;\n  onClose: () => void;\n}\n\n/**\n * Filter types as per spec (03-graphql-contract.md)\n * Spec values: date_range, category, custom, numeric_range, text_search\n */\nconst FILTER_TYPES: { value: FilterType; label: string; description: string }[] = [\n  { value: 'CATEGORY', label: 'Category', description: 'Selection from predefined categories' },\n  { value: 'DATE_RANGE', label: 'Date Range', description: 'Start and end date selection' },\n  { value: 'NUMERIC_RANGE', label: 'Numeric Range', description: 'Min and max number values' },\n  { value: 'TEXT_SEARCH', label: 'Text Search', description: 'Free text search input' },\n  { value: 'CUSTOM', label: 'Custom', description: 'Custom filter configuration' },\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function FilterEditor({ filter, onSave, onClose }: FilterEditorProps) {\n  const [name, setName] = useState(filter?.name || '');\n  const [type, setType] = useState<FilterType>(filter?.type || 'CATEGORY');\n  const [isRequired, setIsRequired] = useState(filter?.isRequired || false);\n  const [options, setOptions] = useState<{ value: string; label: string }[]>(\n    (filter?.config?.options as { value: string; label: string }[] | undefined) || [{ value: '', label: '' }]\n  );\n  const [placeholder, setPlaceholder] = useState((filter?.config?.placeholder as string) || '');\n  const [isDarkMode, setIsDarkMode] = useState(false);\n\n  // Detect dark mode\n  useEffect(() => {\n    const checkDarkMode = () => {\n      setIsDarkMode(document.documentElement.classList.contains('dark'));\n    };\n    checkDarkMode();\n\n    // Watch for theme changes\n    const observer = new MutationObserver(checkDarkMode);\n    observer.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] });\n    return () => observer.disconnect();\n  }, []);\n\n  const COLORS = getColors(isDarkMode);\n  const isEditing = !!filter;\n\n  const handleAddOption = () => {\n    setOptions([...options, { value: '', label: '' }]);\n  };\n\n  const handleRemoveOption = (index: number) => {\n    setOptions(options.filter((_, i) => i !== index));\n  };\n\n  const handleOptionChange = (index: number, field: 'value' | 'label', value: string) => {\n    setOptions(options.map((opt, i) => (i === index ? { ...opt, [field]: value } : opt)));\n  };\n\n  const handleSave = () => {\n    const config: Record<string, unknown> = {};\n\n    // CATEGORY type uses options for selection\n    if (type === 'CATEGORY') {\n      config.options = options.filter((opt) => opt.value && opt.label);\n    }\n\n    if (placeholder) {\n      config.placeholder = placeholder;\n    }\n\n    onSave({\n      name,\n      type,\n      config,\n      isRequired,\n    });\n  };\n\n  const isValid = name.trim() !== '' && (type !== 'CATEGORY' || options.some((opt) => opt.value && opt.label));\n\n  return (\n    <div\n      style={{\n        position: 'fixed',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n        width: '100vw',\n        height: '100vh',\n        backgroundColor: COLORS.backdropBg,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        zIndex: 10000,\n        isolation: 'isolate',\n      }}\n      onClick={onClose}\n    >\n      <div\n        style={{\n          width: '480px',\n          maxWidth: '90vw',\n          maxHeight: '80vh',\n          backgroundColor: COLORS.bgPrimary,\n          borderRadius: '8px',\n          boxShadow: '0 8px 32px rgba(0, 0, 0, 0.3)',\n          overflow: 'hidden',\n          position: 'relative',\n        }}\n        onClick={(e) => e.stopPropagation()}\n      >\n        {/* Header */}\n        <div\n          style={{\n            padding: '16px 20px',\n            borderBottom: `1px solid ${COLORS.borderDefault}`,\n            display: 'flex',\n            alignItems: 'center',\n            justifyContent: 'space-between',\n            backgroundColor: COLORS.bgPrimary,\n          }}\n        >\n          <h3 style={{ margin: 0, fontSize: '16px', fontWeight: 600, color: COLORS.textPrimary }}>\n            {isEditing ? 'Edit Filter' : 'Add Filter'}\n          </h3>\n          <button\n            onClick={onClose}\n            style={{\n              background: 'none',\n              border: 'none',\n              fontSize: '20px',\n              cursor: 'pointer',\n              color: COLORS.textSecondary,\n              lineHeight: 1,\n            }}\n          >\n            ×\n          </button>\n        </div>\n\n        {/* Content */}\n        <div\n          style={{\n            padding: '20px',\n            overflowY: 'auto',\n            maxHeight: 'calc(80vh - 130px)',\n            backgroundColor: COLORS.bgPrimary,\n          }}\n        >\n          {/* Filter Name */}\n          <div style={{ marginBottom: '16px' }}>\n            <label\n              style={{\n                display: 'block',\n                marginBottom: '6px',\n                fontSize: '13px',\n                fontWeight: 500,\n                color: COLORS.textPrimary,\n              }}\n            >\n              Filter Name *\n            </label>\n            <input\n              type=\"text\"\n              value={name}\n              onChange={(e) => setName(e.target.value)}\n              placeholder=\"e.g., Status, Date Range, Category\"\n              style={{\n                width: '100%',\n                padding: '10px 12px',\n                border: `1px solid ${COLORS.borderDefault}`,\n                borderRadius: '6px',\n                fontSize: '14px',\n                boxSizing: 'border-box',\n                backgroundColor: COLORS.bgPrimary,\n                color: COLORS.textPrimary,\n              }}\n            />\n          </div>\n\n          {/* Filter Type */}\n          {!isEditing && (\n            <div style={{ marginBottom: '16px' }}>\n              <label\n                style={{\n                  display: 'block',\n                  marginBottom: '8px',\n                  fontSize: '13px',\n                  fontWeight: 500,\n                  color: COLORS.textPrimary,\n                }}\n              >\n                Filter Type *\n              </label>\n              <div style={{ display: 'grid', gridTemplateColumns: 'repeat(2, 1fr)', gap: '10px' }}>\n                {FILTER_TYPES.map((ft) => (\n                  <button\n                    key={ft.value}\n                    onClick={() => setType(ft.value)}\n                    type=\"button\"\n                    style={{\n                      padding: '12px',\n                      textAlign: 'left',\n                      backgroundColor: type === ft.value ? COLORS.actionPrimaryBgSubtle : COLORS.bgSecondary,\n                      border: `2px solid ${type === ft.value ? COLORS.actionPrimaryBg : COLORS.borderDefault}`,\n                      borderRadius: '6px',\n                      cursor: 'pointer',\n                      transition: 'all 0.2s ease',\n                      minHeight: '60px',\n                    }}\n                  >\n                    <div style={{ fontWeight: 500, fontSize: '13px', color: COLORS.textPrimary }}>{ft.label}</div>\n                    <div\n                      style={{\n                        fontSize: '11px',\n                        color: COLORS.textSecondary,\n                        marginTop: '4px',\n                        lineHeight: '1.3',\n                      }}\n                    >\n                      {ft.description}\n                    </div>\n                  </button>\n                ))}\n              </div>\n            </div>\n          )}\n\n          {/* Options (for CATEGORY type) */}\n          {type === 'CATEGORY' && (\n            <div style={{ marginBottom: '16px' }}>\n              <label\n                style={{\n                  display: 'block',\n                  marginBottom: '8px',\n                  fontSize: '13px',\n                  fontWeight: 500,\n                  color: COLORS.textPrimary,\n                }}\n              >\n                Options\n              </label>\n              <div style={{ display: 'flex', flexDirection: 'column', gap: '8px' }}>\n                {options.map((opt, index) => (\n                  <div key={index} style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>\n                    <input\n                      type=\"text\"\n                      value={opt.value}\n                      onChange={(e) => handleOptionChange(index, 'value', e.target.value)}\n                      placeholder=\"Value\"\n                      style={{\n                        flex: 1,\n                        padding: '8px 10px',\n                        border: `1px solid ${COLORS.borderDefault}`,\n                        borderRadius: '4px',\n                        fontSize: '13px',\n                        boxSizing: 'border-box',\n                        backgroundColor: COLORS.bgPrimary,\n                        color: COLORS.textPrimary,\n                      }}\n                    />\n                    <input\n                      type=\"text\"\n                      value={opt.label}\n                      onChange={(e) => handleOptionChange(index, 'label', e.target.value)}\n                      placeholder=\"Label\"\n                      style={{\n                        flex: 1,\n                        padding: '8px 10px',\n                        border: `1px solid ${COLORS.borderDefault}`,\n                        borderRadius: '4px',\n                        fontSize: '13px',\n                        boxSizing: 'border-box',\n                        backgroundColor: COLORS.bgPrimary,\n                        color: COLORS.textPrimary,\n                      }}\n                    />\n                    {options.length > 1 && (\n                      <button\n                        type=\"button\"\n                        onClick={() => handleRemoveOption(index)}\n                        style={{\n                          padding: '6px 10px',\n                          backgroundColor: 'transparent',\n                          border: `1px solid ${COLORS.statusErrorText}`,\n                          borderRadius: '4px',\n                          cursor: 'pointer',\n                          color: COLORS.statusErrorText,\n                          fontSize: '12px',\n                        }}\n                      >\n                        Remove\n                      </button>\n                    )}\n                  </div>\n                ))}\n                <button\n                  type=\"button\"\n                  onClick={handleAddOption}\n                  style={{\n                    padding: '8px',\n                    backgroundColor: 'transparent',\n                    border: `1px dashed ${COLORS.borderDefault}`,\n                    borderRadius: '4px',\n                    cursor: 'pointer',\n                    color: COLORS.textSecondary,\n                    fontSize: '12px',\n                  }}\n                >\n                  + Add Option\n                </button>\n              </div>\n            </div>\n          )}\n\n          {/* Placeholder */}\n          {(type === 'TEXT_SEARCH' || type === 'CATEGORY') && (\n            <div style={{ marginBottom: '16px' }}>\n              <label\n                style={{\n                  display: 'block',\n                  marginBottom: '8px',\n                  fontSize: '13px',\n                  fontWeight: 500,\n                  color: COLORS.textPrimary,\n                }}\n              >\n                Placeholder Text\n              </label>\n              <input\n                type=\"text\"\n                value={placeholder}\n                onChange={(e) => setPlaceholder(e.target.value)}\n                placeholder=\"e.g., Select an option...\"\n                style={{\n                  width: '100%',\n                  padding: '10px 12px',\n                  border: `1px solid ${COLORS.borderDefault}`,\n                  borderRadius: '6px',\n                  fontSize: '14px',\n                  boxSizing: 'border-box',\n                  backgroundColor: COLORS.bgPrimary,\n                  color: COLORS.textPrimary,\n                }}\n              />\n            </div>\n          )}\n\n          {/* Required Toggle */}\n          <div style={{ marginBottom: '16px' }}>\n            <label\n              style={{\n                display: 'flex',\n                alignItems: 'center',\n                gap: '8px',\n                cursor: 'pointer',\n              }}\n            >\n              <input\n                type=\"checkbox\"\n                checked={isRequired}\n                onChange={(e) => setIsRequired(e.target.checked)}\n                style={{ width: '16px', height: '16px' }}\n              />\n              <span style={{ fontSize: '13px', color: COLORS.textPrimary }}>Required filter (must have a value)</span>\n            </label>\n          </div>\n        </div>\n\n        {/* Footer */}\n        <div\n          style={{\n            padding: '16px 20px',\n            borderTop: `1px solid ${COLORS.borderDefault}`,\n            display: 'flex',\n            justifyContent: 'flex-end',\n            gap: '12px',\n            backgroundColor: COLORS.bgPrimary,\n          }}\n        >\n          <button\n            type=\"button\"\n            onClick={onClose}\n            style={{\n              padding: '10px 20px',\n              backgroundColor: COLORS.bgPrimary,\n              border: `1px solid ${COLORS.borderDefault}`,\n              borderRadius: '6px',\n              cursor: 'pointer',\n              fontSize: '14px',\n              color: COLORS.textSecondary,\n            }}\n          >\n            Cancel\n          </button>\n          <button\n            type=\"button\"\n            onClick={handleSave}\n            disabled={!isValid}\n            style={{\n              padding: '10px 20px',\n              backgroundColor: isValid ? COLORS.actionPrimaryBg : COLORS.bgTertiary,\n              color: isValid ? COLORS.actionPrimaryFg : COLORS.textTertiary,\n              border: 'none',\n              borderRadius: '6px',\n              cursor: isValid ? 'pointer' : 'not-allowed',\n              fontSize: '14px',\n              fontWeight: 500,\n            }}\n          >\n            {isEditing ? 'Save Changes' : 'Add Filter'}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default FilterEditor;\n"],"mappings":"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"}

package/dist/bigconsole/components/dashboard/GlobalFiltersBar/FilterPresetSelector.d.ts

@@ -0,0 +1,13 @@
+import { FilterPreset } from '../../../hooks/useFilterPresets';
+
+export interface FilterPresetSelectorProps {
+    presets: FilterPreset[];
+    activePresetId: string | null;
+    onApplyPreset: (presetId: string) => void;
+    onSavePreset: (name: string, description?: string) => void;
+    onDeletePreset: (presetId: string) => void;
+    disabled?: boolean;
+}
+export declare function FilterPresetSelector({ presets, activePresetId, onApplyPreset, onSavePreset, onDeletePreset, disabled, }: FilterPresetSelectorProps): import("react/jsx-runtime").JSX.Element;
+export default FilterPresetSelector;
+//# sourceMappingURL=FilterPresetSelector.d.ts.map

package/dist/bigconsole/components/dashboard/GlobalFiltersBar/FilterPresetSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterPresetSelector.d.ts","sourceRoot":"","sources":["../../../../../src/bigconsole/components/dashboard/GlobalFiltersBar/FilterPresetSelector.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAOpE,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,aAAa,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,cAAc,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAMD,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EACP,cAAc,EACd,aAAa,EACb,YAAY,EACZ,cAAc,EACd,QAAgB,GACjB,EAAE,yBAAyB,2CA+V3B;AAED,eAAe,oBAAoB,CAAC"}