@reopt-ai/opt-ui 1.12.5 → 1.14.0

package/dist/index.cjs

@@ -1,114 +1,16 @@
 "use client";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_text_truncate = require("./text-truncate-CqdiQuj8.cjs");
-const require_key_pad_menu = require("./key-pad-menu-BpQebDyw.cjs");
-const require_field_sidebar = require("./field-sidebar-DwtrYSSt.cjs");
+const require_text_truncate = require("./text-truncate-BeYW6XZu.cjs");
+const require_key_pad_menu = require("./key-pad-menu-BgtSL3xe.cjs");
+const require_field_sidebar = require("./field-sidebar-ePqFX6MN.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
 let react = require("react");
 react = require_text_truncate.__toESM(react, 1);
-let _reopt_ai_opt_ui_primitives = require("@reopt-ai/opt-ui-primitives");
 let lucide_react = require("lucide-react");
-let _reopt_ai_opt_palette = require("@reopt-ai/opt-palette");
 let _reopt_ai_opt_charts = require("@reopt-ai/opt-charts");
 let match_sorter = require("match-sorter");
 let next_navigation = require("next/navigation");
-//#region src/core/callout.tsx
-const _excluded$2 = [
-	"tone",
-	"title",
-	"icon",
-	"action",
-	"size",
-	"className",
-	"children"
-];
-const toneStyles = {
-	info: "border-info/40 bg-info-subtle",
-	success: "border-success/40 bg-success-subtle",
-	warning: "border-warning/40 bg-warning-subtle",
-	danger: "border-danger/40 bg-danger-subtle",
-	neutral: "border-border bg-bg-subtle"
-};
-const iconTone = {
-	info: "text-info-fg",
-	success: "text-success-fg",
-	warning: "text-warning-fg",
-	danger: "text-danger-fg",
-	neutral: "text-text-tertiary"
-};
-const titleTone = {
-	info: "text-info-fg",
-	success: "text-success-fg",
-	warning: "text-warning-fg",
-	danger: "text-danger-fg",
-	neutral: "text-text-primary"
-};
-const defaultIcons = {
-	info: lucide_react.Info,
-	success: lucide_react.CircleCheck,
-	warning: lucide_react.TriangleAlert,
-	danger: lucide_react.CircleAlert,
-	neutral: null
-};
-const sizeStyles$3 = {
-	sm: "gap-2 p-2.5 text-xs [&_svg]:size-3.5",
-	md: "gap-3 p-3 text-sm [&_svg]:size-4"
-};
-/**
-* Callout — a notice that belongs to the page, not to the moment.
-*
-* `Alert` reports something that just happened and can be dismissed once read.
-* A callout is the opposite: it is part of the layout, it is true for as long
-* as the condition holds, and dismissing it would only hide a fact that is
-* still true. "12 new events to triage" above a list, or "these numbers come
-* from a 10,000-row sample" above a chart — both are read many times and
-* dismissed never.
-*
-* That is why there is no `onDismiss` here, and why `action` takes one control:
-* a notice earns its space by naming the single thing to do about it.
-*
-* @example
-* ```tsx
-* <Callout tone="info" title="정리할 신규 이벤트 12개"
-*   action={<Button size="sm" onClick={showNew}>보기</Button>}>
-*   7일 안에 처음 관측된 이벤트입니다.
-* </Callout>
-* ```
-*/
-function Callout(_ref) {
-	let { tone = "info", title, icon, action, size = "md", className, children } = _ref, props = require_text_truncate._objectWithoutProperties(_ref, _excluded$2);
-	const DefaultIcon = defaultIcons[tone];
-	const glyph = icon === void 0 ? DefaultIcon ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DefaultIcon, { "aria-hidden": "true" }) : null : icon;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({
-		role: "status",
-		className: require_text_truncate.cn("flex items-start rounded-lg border", toneStyles[tone], sizeStyles$3[size], className)
-	}, props), {}, {
-		"data-opt-id": "AT7TX",
-		"data-opt-slug": "callout.Callout",
-		"data-tone": tone,
-		children: [
-			glyph && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: require_text_truncate.cn("mt-0.5 shrink-0", iconTone[tone]),
-				children: glyph
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: "min-w-0 flex-1",
-				children: [title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-					className: require_text_truncate.cn("font-medium", titleTone[tone]),
-					children: title
-				}), children && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: require_text_truncate.cn("text-text-secondary", title && "mt-1"),
-					children
-				})]
-			}),
-			action && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "shrink-0 self-center",
-				children: action
-			})
-		]
-	}));
-}
-//#endregion
+let _reopt_ai_opt_ui_primitives = require("@reopt-ai/opt-ui-primitives");
 //#region src/core/status-dot.tsx
 const _excluded$1 = [
 	"tone",
@@ -133,7 +35,7 @@ const textTone = {
 	warning: "text-text-secondary",
 	danger: "text-text-secondary"
 };
-const sizeStyles$2 = {
+const sizeStyles$1 = {
 	sm: "gap-1.5 text-[11px]",
 	md: "gap-2 text-xs"
 };
@@ -164,7 +66,7 @@ const dotSize = {
 function StatusDot(_ref) {
 	let { tone = "neutral", size = "md", hint, className, children } = _ref, props = require_text_truncate._objectWithoutProperties(_ref, _excluded$1);
 	const dot = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({
-		className: require_text_truncate.cn("inline-flex items-center whitespace-nowrap", sizeStyles$2[size], textTone[tone], hint && "focus-visible:ring-ring rounded-sm outline-none focus-visible:ring-2", className),
+		className: require_text_truncate.cn("inline-flex items-center whitespace-nowrap", sizeStyles$1[size], textTone[tone], hint && "focus-visible:ring-ring rounded-sm outline-none focus-visible:ring-2", className),
 		tabIndex: hint ? 0 : void 0
 	}, props), {}, {
 		"data-opt-id": "N51AT",
@@ -191,12 +93,12 @@ const _excluded = [
 	"disabled",
 	"onClick"
 ];
-const defaultLabels$35 = {
+const defaultLabels$34 = {
 	copy: "복사",
 	copied: "복사됨",
 	failed: "복사할 수 없습니다"
 };
-const sizeStyles$1 = {
+const sizeStyles = {
 	sm: "h-6 gap-1 text-[11px] [&>svg]:size-3",
 	md: "h-7 gap-1.5 text-xs [&>svg]:size-3.5"
 };
@@ -238,7 +140,7 @@ const stateTone = {
 */
 function CopyButton(_ref) {
 	let { value, variant = "icon", size = "md", feedbackDuration = 1500, onCopy, labels: customLabels, className, disabled, onClick } = _ref, props = require_text_truncate._objectWithoutProperties(_ref, _excluded);
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$35), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$34), customLabels);
 	const [state, setState] = (0, react.useState)("idle");
 	const timer = (0, react.useRef)(null);
 	(0, react.useEffect)(() => () => {
@@ -271,7 +173,7 @@ function CopyButton(_ref) {
 		onClick: handleClick,
 		disabled,
 		"aria-label": variant === "icon" ? label : void 0,
-		className: require_text_truncate.cn("inline-flex shrink-0 items-center rounded transition-colors", "disabled:pointer-events-none disabled:opacity-50", require_text_truncate.OPT_FOCUS_VISIBLE, sizeStyles$1[size], paddingStyles[variant][size], stateTone[state], className)
+		className: require_text_truncate.cn("inline-flex shrink-0 items-center rounded transition-colors", "disabled:pointer-events-none disabled:opacity-50", require_text_truncate.OPT_FOCUS_VISIBLE, sizeStyles[size], paddingStyles[variant][size], stateTone[state], className)
 	}, props), {}, {
 		"data-opt-id": "E0C8T",
 		"data-opt-slug": "copy-button.CopyButton",
@@ -289,76 +191,6 @@ function CopyButton(_ref) {
 	}));
 }
 //#endregion
-//#region src/core/segmented-control.tsx
-const sizeStyles = {
-	sm: "h-7 text-[11px] [&_svg]:size-3",
-	md: "h-8 text-xs [&_svg]:size-3.5"
-};
-const segmentPadding = {
-	sm: "gap-1 px-2",
-	md: "gap-1.5 px-2.5"
-};
-/**
-* SegmentedControl — one of a few views, all of them visible.
-*
-* A `Select` hides the alternatives behind a click; a `ToggleGroup` presses
-* buttons that may be on together. Neither is what "이벤트 | 속성" is: exactly
-* one is true, the set is small enough to show, and the reader is choosing a
-* view rather than filtering anything.
-*
-* Built on the radio-group primitive rather than on buttons, so the arrow keys,
-* the group name and the checked state come from the platform. A control that
-* merely looks like a radiogroup is one a keyboard cannot drive.
-*
-* @example
-* ```tsx
-* <SegmentedControl
-*   aria-label="카탈로그 탭"
-*   options={[
-*     { value: "events", label: "이벤트", badge: 128 },
-*     { value: "properties", label: "속성", badge: 341 },
-*   ]}
-*   value={tab}
-*   onChange={setTab}
-* />
-* ```
-*/
-function SegmentedControl({ options, value, onChange, size = "md", fullWidth = false, disabled = false, "aria-label": ariaLabel, className }) {
-	const name = (0, react.useId)();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_reopt_ai_opt_ui_primitives.RadioGroupRoot, {
-		value,
-		onValueChange: (next) => onChange(next),
-		disabled,
-		orientation: "horizontal",
-		name,
-		"aria-label": ariaLabel,
-		className: require_text_truncate.cn("inline-flex items-center rounded-lg border border-border bg-bg-subtle p-0.5", fullWidth && "flex w-full", sizeStyles[size], className),
-		"data-opt-id": "YKENE",
-		"data-opt-slug": "segmented-control.SegmentedControl",
-		children: options.map((option) => {
-			const selected = option.value === value;
-			const itemDisabled = disabled || option.disabled;
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
-				className: require_text_truncate.cn("relative inline-flex h-full cursor-pointer items-center justify-center", "rounded-md font-medium whitespace-nowrap transition-colors", "has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-ring has-[:focus-visible]:ring-offset-1 has-[:focus-visible]:ring-offset-ring-offset", segmentPadding[size], fullWidth && "flex-1", selected ? "bg-surface text-text-primary shadow-sm" : "text-text-tertiary hover:text-text-secondary", itemDisabled && "pointer-events-none opacity-50"),
-				"data-selected": selected || void 0,
-				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_reopt_ai_opt_ui_primitives.Radio, {
-						value: option.value,
-						disabled: itemDisabled,
-						className: "absolute inset-0 m-0 h-full w-full cursor-pointer opacity-0"
-					}),
-					option.icon,
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: option.label }),
-					option.badge != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: require_text_truncate.cn("tabular-nums", selected ? "text-text-tertiary" : "text-text-tertiary/70"),
-						children: option.badge
-					})
-				]
-			}, option.value);
-		})
-	});
-}
-//#endregion
 //#region src/lib/schema-validator.ts
 /** Handles schema validator. */
 function schemaValidator(schema) {
@@ -433,7 +265,7 @@ function PageAside({ header, children, footer, widthClassName = "w-60", label, h
 PageAside.displayName = "PageAside";
 //#endregion
 //#region src/shells/task-list.tsx
-const defaultLabels$34 = {
+const defaultLabels$33 = {
 	title: "작업 목록",
 	emptyMessage: "작업이 없습니다",
 	completedOf: "{completed}/{total} 완료",
@@ -453,9 +285,9 @@ const defaultLabels$34 = {
 };
 /** Renders the task list component. */
 function TaskList({ tasks, title, onTaskClick, onTaskStatusChange, emptyMessage, showSubtasks = false, maxItems, labels: customLabels, className }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$34), customLabels), {}, {
-		priority: require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$34.priority), customLabels === null || customLabels === void 0 ? void 0 : customLabels.priority),
-		status: require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$34.status), customLabels === null || customLabels === void 0 ? void 0 : customLabels.status)
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$33), customLabels), {}, {
+		priority: require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$33.priority), customLabels === null || customLabels === void 0 ? void 0 : customLabels.priority),
+		status: require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$33.status), customLabels === null || customLabels === void 0 ? void 0 : customLabels.status)
 	});
 	const displayTitle = title !== null && title !== void 0 ? title : labels.title;
 	const displayEmptyMessage = emptyMessage !== null && emptyMessage !== void 0 ? emptyMessage : labels.emptyMessage;
@@ -613,7 +445,7 @@ function TaskList({ tasks, title, onTaskClick, onTaskStatusChange, emptyMessage,
 }
 //#endregion
 //#region src/shells/activity-feed.tsx
-const defaultLabels$33 = {
+const defaultLabels$32 = {
 	title: "활동 피드",
 	emptyMessage: "활동이 없습니다",
 	moreItems: "{count}개 더 보기",
@@ -663,24 +495,24 @@ const variantBorder = {
 function ActivityFeed({ activities, title, maxItems, onActivityClick, onShowMore, emptyMessage, labels: customLabels, locale = "ko-KR", loading = false, layout = "list", renderActions, className }) {
 	var _customLabels$timeAgo, _customLabels$timeAgo2, _customLabels$timeAgo3, _customLabels$timeAgo4, _customLabels$timeAgo5, _customLabels$timeAgo6, _customLabels$timeAgo7, _customLabels$timeAgo8, _customLabels$activit, _customLabels$activit2, _customLabels$activit3, _customLabels$activit4, _customLabels$activit5, _customLabels$activit6, _customLabels$activit7, _customLabels$activit8, _customLabels$activit9, _customLabels$activit10, _customLabels$activit11, _customLabels$activit12, _customLabels$activit13, _customLabels$activit14, _customLabels$title, _customLabels$emptyMe, _customLabels$moreIte;
 	const mergedTimeAgo = {
-		justNow: (_customLabels$timeAgo = customLabels === null || customLabels === void 0 || (_customLabels$timeAgo2 = customLabels.timeAgo) === null || _customLabels$timeAgo2 === void 0 ? void 0 : _customLabels$timeAgo2.justNow) !== null && _customLabels$timeAgo !== void 0 ? _customLabels$timeAgo : defaultLabels$33.timeAgo.justNow,
-		minutesAgo: (_customLabels$timeAgo3 = customLabels === null || customLabels === void 0 || (_customLabels$timeAgo4 = customLabels.timeAgo) === null || _customLabels$timeAgo4 === void 0 ? void 0 : _customLabels$timeAgo4.minutesAgo) !== null && _customLabels$timeAgo3 !== void 0 ? _customLabels$timeAgo3 : defaultLabels$33.timeAgo.minutesAgo,
-		hoursAgo: (_customLabels$timeAgo5 = customLabels === null || customLabels === void 0 || (_customLabels$timeAgo6 = customLabels.timeAgo) === null || _customLabels$timeAgo6 === void 0 ? void 0 : _customLabels$timeAgo6.hoursAgo) !== null && _customLabels$timeAgo5 !== void 0 ? _customLabels$timeAgo5 : defaultLabels$33.timeAgo.hoursAgo,
-		daysAgo: (_customLabels$timeAgo7 = customLabels === null || customLabels === void 0 || (_customLabels$timeAgo8 = customLabels.timeAgo) === null || _customLabels$timeAgo8 === void 0 ? void 0 : _customLabels$timeAgo8.daysAgo) !== null && _customLabels$timeAgo7 !== void 0 ? _customLabels$timeAgo7 : defaultLabels$33.timeAgo.daysAgo
+		justNow: (_customLabels$timeAgo = customLabels === null || customLabels === void 0 || (_customLabels$timeAgo2 = customLabels.timeAgo) === null || _customLabels$timeAgo2 === void 0 ? void 0 : _customLabels$timeAgo2.justNow) !== null && _customLabels$timeAgo !== void 0 ? _customLabels$timeAgo : defaultLabels$32.timeAgo.justNow,
+		minutesAgo: (_customLabels$timeAgo3 = customLabels === null || customLabels === void 0 || (_customLabels$timeAgo4 = customLabels.timeAgo) === null || _customLabels$timeAgo4 === void 0 ? void 0 : _customLabels$timeAgo4.minutesAgo) !== null && _customLabels$timeAgo3 !== void 0 ? _customLabels$timeAgo3 : defaultLabels$32.timeAgo.minutesAgo,
+		hoursAgo: (_customLabels$timeAgo5 = customLabels === null || customLabels === void 0 || (_customLabels$timeAgo6 = customLabels.timeAgo) === null || _customLabels$timeAgo6 === void 0 ? void 0 : _customLabels$timeAgo6.hoursAgo) !== null && _customLabels$timeAgo5 !== void 0 ? _customLabels$timeAgo5 : defaultLabels$32.timeAgo.hoursAgo,
+		daysAgo: (_customLabels$timeAgo7 = customLabels === null || customLabels === void 0 || (_customLabels$timeAgo8 = customLabels.timeAgo) === null || _customLabels$timeAgo8 === void 0 ? void 0 : _customLabels$timeAgo8.daysAgo) !== null && _customLabels$timeAgo7 !== void 0 ? _customLabels$timeAgo7 : defaultLabels$32.timeAgo.daysAgo
 	};
 	const mergedActivityVerbs = {
-		created: (_customLabels$activit = customLabels === null || customLabels === void 0 || (_customLabels$activit2 = customLabels.activityVerbs) === null || _customLabels$activit2 === void 0 ? void 0 : _customLabels$activit2.created) !== null && _customLabels$activit !== void 0 ? _customLabels$activit : defaultLabels$33.activityVerbs.created,
-		updated: (_customLabels$activit3 = customLabels === null || customLabels === void 0 || (_customLabels$activit4 = customLabels.activityVerbs) === null || _customLabels$activit4 === void 0 ? void 0 : _customLabels$activit4.updated) !== null && _customLabels$activit3 !== void 0 ? _customLabels$activit3 : defaultLabels$33.activityVerbs.updated,
-		completed: (_customLabels$activit5 = customLabels === null || customLabels === void 0 || (_customLabels$activit6 = customLabels.activityVerbs) === null || _customLabels$activit6 === void 0 ? void 0 : _customLabels$activit6.completed) !== null && _customLabels$activit5 !== void 0 ? _customLabels$activit5 : defaultLabels$33.activityVerbs.completed,
-		commented: (_customLabels$activit7 = customLabels === null || customLabels === void 0 || (_customLabels$activit8 = customLabels.activityVerbs) === null || _customLabels$activit8 === void 0 ? void 0 : _customLabels$activit8.commented) !== null && _customLabels$activit7 !== void 0 ? _customLabels$activit7 : defaultLabels$33.activityVerbs.commented,
-		assigned: (_customLabels$activit9 = customLabels === null || customLabels === void 0 || (_customLabels$activit10 = customLabels.activityVerbs) === null || _customLabels$activit10 === void 0 ? void 0 : _customLabels$activit10.assigned) !== null && _customLabels$activit9 !== void 0 ? _customLabels$activit9 : defaultLabels$33.activityVerbs.assigned,
-		deployed: (_customLabels$activit11 = customLabels === null || customLabels === void 0 || (_customLabels$activit12 = customLabels.activityVerbs) === null || _customLabels$activit12 === void 0 ? void 0 : _customLabels$activit12.deployed) !== null && _customLabels$activit11 !== void 0 ? _customLabels$activit11 : defaultLabels$33.activityVerbs.deployed,
-		merged: (_customLabels$activit13 = customLabels === null || customLabels === void 0 || (_customLabels$activit14 = customLabels.activityVerbs) === null || _customLabels$activit14 === void 0 ? void 0 : _customLabels$activit14.merged) !== null && _customLabels$activit13 !== void 0 ? _customLabels$activit13 : defaultLabels$33.activityVerbs.merged
+		created: (_customLabels$activit = customLabels === null || customLabels === void 0 || (_customLabels$activit2 = customLabels.activityVerbs) === null || _customLabels$activit2 === void 0 ? void 0 : _customLabels$activit2.created) !== null && _customLabels$activit !== void 0 ? _customLabels$activit : defaultLabels$32.activityVerbs.created,
+		updated: (_customLabels$activit3 = customLabels === null || customLabels === void 0 || (_customLabels$activit4 = customLabels.activityVerbs) === null || _customLabels$activit4 === void 0 ? void 0 : _customLabels$activit4.updated) !== null && _customLabels$activit3 !== void 0 ? _customLabels$activit3 : defaultLabels$32.activityVerbs.updated,
+		completed: (_customLabels$activit5 = customLabels === null || customLabels === void 0 || (_customLabels$activit6 = customLabels.activityVerbs) === null || _customLabels$activit6 === void 0 ? void 0 : _customLabels$activit6.completed) !== null && _customLabels$activit5 !== void 0 ? _customLabels$activit5 : defaultLabels$32.activityVerbs.completed,
+		commented: (_customLabels$activit7 = customLabels === null || customLabels === void 0 || (_customLabels$activit8 = customLabels.activityVerbs) === null || _customLabels$activit8 === void 0 ? void 0 : _customLabels$activit8.commented) !== null && _customLabels$activit7 !== void 0 ? _customLabels$activit7 : defaultLabels$32.activityVerbs.commented,
+		assigned: (_customLabels$activit9 = customLabels === null || customLabels === void 0 || (_customLabels$activit10 = customLabels.activityVerbs) === null || _customLabels$activit10 === void 0 ? void 0 : _customLabels$activit10.assigned) !== null && _customLabels$activit9 !== void 0 ? _customLabels$activit9 : defaultLabels$32.activityVerbs.assigned,
+		deployed: (_customLabels$activit11 = customLabels === null || customLabels === void 0 || (_customLabels$activit12 = customLabels.activityVerbs) === null || _customLabels$activit12 === void 0 ? void 0 : _customLabels$activit12.deployed) !== null && _customLabels$activit11 !== void 0 ? _customLabels$activit11 : defaultLabels$32.activityVerbs.deployed,
+		merged: (_customLabels$activit13 = customLabels === null || customLabels === void 0 || (_customLabels$activit14 = customLabels.activityVerbs) === null || _customLabels$activit14 === void 0 ? void 0 : _customLabels$activit14.merged) !== null && _customLabels$activit13 !== void 0 ? _customLabels$activit13 : defaultLabels$32.activityVerbs.merged
 	};
 	const labels = {
-		title: (_customLabels$title = customLabels === null || customLabels === void 0 ? void 0 : customLabels.title) !== null && _customLabels$title !== void 0 ? _customLabels$title : defaultLabels$33.title,
-		emptyMessage: (_customLabels$emptyMe = customLabels === null || customLabels === void 0 ? void 0 : customLabels.emptyMessage) !== null && _customLabels$emptyMe !== void 0 ? _customLabels$emptyMe : defaultLabels$33.emptyMessage,
-		moreItems: (_customLabels$moreIte = customLabels === null || customLabels === void 0 ? void 0 : customLabels.moreItems) !== null && _customLabels$moreIte !== void 0 ? _customLabels$moreIte : defaultLabels$33.moreItems,
+		title: (_customLabels$title = customLabels === null || customLabels === void 0 ? void 0 : customLabels.title) !== null && _customLabels$title !== void 0 ? _customLabels$title : defaultLabels$32.title,
+		emptyMessage: (_customLabels$emptyMe = customLabels === null || customLabels === void 0 ? void 0 : customLabels.emptyMessage) !== null && _customLabels$emptyMe !== void 0 ? _customLabels$emptyMe : defaultLabels$32.emptyMessage,
+		moreItems: (_customLabels$moreIte = customLabels === null || customLabels === void 0 ? void 0 : customLabels.moreItems) !== null && _customLabels$moreIte !== void 0 ? _customLabels$moreIte : defaultLabels$32.moreItems,
 		timeAgo: mergedTimeAgo,
 		activityVerbs: mergedActivityVerbs
 	};
@@ -808,13 +640,13 @@ function ActivityFeed({ activities, title, maxItems, onActivityClick, onShowMore
 ActivityFeed.displayName = "ActivityFeed";
 //#endregion
 //#region src/shells/filter-bar.tsx
-const defaultLabels$32 = {
+const defaultLabels$31 = {
 	clearAll: "필터 초기화",
 	searchPlaceholder: "검색..."
 };
 /** Renders the filter bar component. */
 function FilterBar({ filters, onFilterChange, onDateRangeChange, onClearAll, labels: customLabels, presetActions, className }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$32), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$31), customLabels);
 	const [searchValues, setSearchValues] = (0, react.useState)({});
 	const [tagInputValues, setTagInputValues] = (0, react.useState)({});
 	const [multiSelectOpen, setMultiSelectOpen] = (0, react.useState)({});
@@ -1001,7 +833,7 @@ function FilterBar({ filters, onFilterChange, onDateRangeChange, onClearAll, lab
 						})]
 					}, filter.id);
 				}
-				if (filter.type === "toggle") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.Switch, {
+				if (filter.type === "toggle") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.Switch, {
 					label: filter.label,
 					size: "sm",
 					checked: filter.value === true,
@@ -1040,10 +872,10 @@ function matchesShortcut(event, shortcut) {
 	if (requiresMeta && !event.metaKey) return false;
 	return event.key.toLowerCase() === key;
 }
-const defaultLabels$31 = { title: "빠른 작업" };
+const defaultLabels$30 = { title: "빠른 작업" };
 /** Renders the quick actions component. */
 function QuickActions({ actions, title, layout = "grid", columns = 3, showDescriptionInGrid = false, bindShortcuts = false, labels: customLabels, className }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$31), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$30), customLabels);
 	const displayTitle = title !== null && title !== void 0 ? title : labels.title;
 	const titleId = (0, react.useId)();
 	(0, react.useEffect)(() => {
@@ -1121,7 +953,7 @@ function QuickActions({ actions, title, layout = "grid", columns = 3, showDescri
 QuickActions.displayName = "QuickActions";
 //#endregion
 //#region src/shells/team-member-list.tsx
-const defaultLabels$30 = {
+const defaultLabels$29 = {
 	title: "팀원",
 	emptyMessage: "팀원이 없습니다",
 	onlineCount: "{online}/{total} 온라인",
@@ -1142,7 +974,7 @@ const statusDot = {
 };
 /** Renders the team member list component. */
 function TeamMemberList({ members, title, layout = "list", maxDisplay, onMemberClick, onShowMore, emptyMessage, labels: customLabels, className }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$30), customLabels), {}, { status: require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$30.status), customLabels === null || customLabels === void 0 ? void 0 : customLabels.status) });
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$29), customLabels), {}, { status: require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$29.status), customLabels === null || customLabels === void 0 ? void 0 : customLabels.status) });
 	const displayTitle = title !== null && title !== void 0 ? title : labels.title;
 	const displayEmptyMessage = emptyMessage !== null && emptyMessage !== void 0 ? emptyMessage : labels.emptyMessage;
 	const titleId = (0, react.useId)();
@@ -2042,7 +1874,7 @@ const COLOR_PRESETS = [
 	"#f97316",
 	"#14b8a6"
 ];
-const defaultLabels$29 = {
+const defaultLabels$28 = {
 	eventLabelPrefix: "Event",
 	defaultAriaLabel: "Event icon"
 };
@@ -2073,7 +1905,7 @@ function getEventIconStyle(color) {
 /** Renders the event icon component. */
 function EventIcon({ icon, color, size = "md", className, labels: customLabels }) {
 	var _iconEntry$label;
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$29), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$28), customLabels);
 	const sizes = SIZE_MAP[size];
 	const resolvedColor = (color === null || color === void 0 ? void 0 : color.trim()) ? color : void 0;
 	const iconEntry = typeof icon === "string" ? require_text_truncate.getIconRegistryEntry(icon) : void 0;
@@ -2165,14 +1997,14 @@ function ConnectionIndicator({ status, tone, label, showLabel = true, pulse, cla
 ConnectionIndicator.displayName = "ConnectionIndicator";
 //#endregion
 //#region src/shells/floating-action-bar.tsx
-const defaultLabels$28 = {
+const defaultLabels$27 = {
 	toolbarAriaLabel: "Actions",
 	selectedLabel: (count) => `${count} selected`,
 	dismissAriaLabel: "Dismiss"
 };
 /** Renders the floating action bar component. */
 function FloatingActionBar({ actions, selectedCount, onAction, onDismiss, className, labels: customLabels }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$28), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$27), customLabels);
 	if (actions.length === 0) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		role: "toolbar",
@@ -2209,7 +2041,7 @@ function FloatingActionBar({ actions, selectedCount, onAction, onDismiss, classN
 FloatingActionBar.displayName = "FloatingActionBar";
 //#endregion
 //#region src/shells/template-picker.tsx
-const defaultLabels$27 = {
+const defaultLabels$26 = {
 	ariaLabel: "Templates",
 	defaultCategory: "General",
 	searchPlaceholder: "Search templates...",
@@ -2217,7 +2049,7 @@ const defaultLabels$27 = {
 };
 /** Renders the template picker component. */
 function TemplatePicker({ templates, selected, onSelect, labels: customLabels, showSearch = false, className }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$27), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$26), customLabels);
 	const [search, setSearch] = react.useState("");
 	const filtered = react.useMemo(() => {
 		if (!showSearch || !search) return templates;
@@ -2303,7 +2135,7 @@ function TemplatePicker({ templates, selected, onSelect, labels: customLabels, s
 TemplatePicker.displayName = "TemplatePicker";
 //#endregion
 //#region src/shells/code-snippet-viewer.tsx
-const defaultLabels$26 = {
+const defaultLabels$25 = {
 	copy: "Copy",
 	copied: "Copied!",
 	codeRegion: "Code snippet"
@@ -2341,7 +2173,7 @@ const syntaxThemeClasses = {
 /** Renders the code snippet viewer component. */
 function CodeSnippetViewer({ code, language = "text", title, showLineNumbers = true, showCopyButton = true, maxHeight = 400, syntaxTheme = "default", className, labels: customLabels }) {
 	var _syntaxThemeClasses$s;
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$26), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$25), customLabels);
 	const [copied, setCopied] = react.useState(false);
 	const lines = code.split("\n");
 	const theme = (_syntaxThemeClasses$s = syntaxThemeClasses[syntaxTheme]) !== null && _syntaxThemeClasses$s !== void 0 ? _syntaxThemeClasses$s : syntaxThemeClasses.default;
@@ -2393,7 +2225,7 @@ function CodeSnippetViewer({ code, language = "text", title, showLineNumbers = t
 CodeSnippetViewer.displayName = "CodeSnippetViewer";
 //#endregion
 //#region src/shells/property-explorer.tsx
-const defaultLabels$25 = {
+const defaultLabels$24 = {
 	searchPlaceholder: "Search properties...",
 	noPropertiesFound: "No properties found",
 	edit: (property) => `${property} 편집`,
@@ -2401,7 +2233,7 @@ const defaultLabels$25 = {
 };
 /** Renders the property explorer component. */
 function PropertyExplorer({ groups, onSelect, onEdit, className, labels: customLabels }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$25), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$24), customLabels);
 	const [search, setSearch] = react.useState("");
 	const filtered = react.useMemo(() => {
 		if (!search) return groups;
@@ -2485,96 +2317,206 @@ function PropertyExplorer({ groups, onSelect, onEdit, className, labels: customL
 }
 PropertyExplorer.displayName = "PropertyExplorer";
 //#endregion
-//#region src/shells/query-results-table.tsx
-const defaultLabels$24 = {
-	emptyMessage: "No results",
-	loadingMessage: "Running query...",
-	rowsSuffix: "row(s)"
-};
-/** Renders the query results table component. */
-function QueryResultsTable({ columns, rows, maxHeight = 400, emptyMessage, loading = false, error, labels: customLabels, className }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$24), customLabels);
-	if (error) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: require_text_truncate.cn("border-danger bg-danger-subtle rounded-lg border p-4", className),
-		role: "alert",
-		"aria-live": "assertive",
-		"data-opt-id": "PNC1V",
-		"data-opt-slug": "query-results-table.QueryResultsTable",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-			className: "text-danger-fg font-mono text-sm",
-			children: error
-		})
-	});
-	if (loading) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_text_truncate.cn("border-border rounded-lg border p-8 text-center", className),
-		role: "status",
-		"aria-live": "polite",
-		"aria-busy": "true",
-		"data-opt-id": "PNC1V",
-		"data-opt-slug": "query-results-table.QueryResultsTable",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "border-border border-t-accent inline-block h-5 w-5 animate-spin rounded-full border-2",
-			"aria-hidden": "true"
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-			className: "text-text-tertiary mt-2 text-sm",
-			children: labels.loadingMessage
-		})]
-	});
-	if (rows.length === 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: require_text_truncate.cn("border-border rounded-lg border p-8 text-center", className),
-		"data-opt-id": "PNC1V",
-		"data-opt-slug": "query-results-table.QueryResultsTable",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-			className: "text-text-tertiary text-sm",
-			children: emptyMessage !== null && emptyMessage !== void 0 ? emptyMessage : labels.emptyMessage
-		})
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_text_truncate.cn("border-border overflow-hidden rounded-lg border", className),
-		"data-opt-id": "PNC1V",
-		"data-opt-slug": "query-results-table.QueryResultsTable",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "overflow-auto",
-			style: { maxHeight },
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("table", {
-				className: "w-full text-sm",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("thead", {
-					className: "bg-surface-inset sticky top-0",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("tr", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
-						className: "text-text-tertiary w-10 px-3 py-2 text-left text-xs font-medium",
-						children: "#"
-					}), columns.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
-						className: "text-text-tertiary px-3 py-2 text-left text-xs font-medium whitespace-nowrap",
-						children: col
-					}, col))] })
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tbody", { children: rows.map((row, ri) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("tr", {
-					className: "border-border-subtle hover:bg-bg-subtle border-t",
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
-						className: "text-text-tertiary px-3 py-1.5 font-mono text-xs",
-						children: ri + 1
-					}), columns.map((col) => {
-						var _row$col;
-						return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
-							className: "text-text-primary px-3 py-1.5 font-mono whitespace-nowrap",
-							children: String((_row$col = row[col]) !== null && _row$col !== void 0 ? _row$col : "")
-						}, col);
-					})]
-				}, ri)) })]
-			})
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "border-border-subtle bg-surface-inset border-t px-3 py-1.5",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-				className: "text-text-tertiary text-xs",
-				children: [
-					rows.length,
-					" ",
-					labels.rowsSuffix
-				]
-			})
-		})]
-	});
+//#region src/lib/sql/statements.ts
+/**
+* Split editor text into statements on top-level semicolons.
+*
+* Blank statements (two semicolons in a row, a trailing semicolon) are dropped.
+*/
+function splitSqlStatements(text) {
+	const out = [];
+	let segmentStart = 0;
+	let i = 0;
+	const length = text.length;
+	const push = (from, to) => {
+		let start = from;
+		let end = to;
+		while (start < end && /\s/.test(text[start])) start++;
+		while (end > start && /\s/.test(text[end - 1])) end--;
+		if (end > start) out.push({
+			text: text.slice(start, end),
+			start,
+			end
+		});
+	};
+	while (i < length) {
+		const ch = text[i];
+		const next = text[i + 1];
+		if (ch === "'" || ch === "\"" || ch === "`") {
+			i = skipQuoted(text, i, ch);
+			continue;
+		}
+		if (ch === "-" && next === "-") {
+			i = skipLineComment(text, i + 2);
+			continue;
+		}
+		if (ch === "/" && next === "*") {
+			i = skipBlockComment(text, i + 2);
+			continue;
+		}
+		if (ch === ";") {
+			push(segmentStart, i);
+			segmentStart = i + 1;
+		}
+		i++;
+	}
+	push(segmentStart, length);
+	return out;
+}
+/**
+* The statement the cursor is in, or the nearest one when the cursor sits in
+* the whitespace between two. `null` only when there are no statements.
+*
+* "Nearest" prefers the statement before the cursor: a reader who just typed a
+* semicolon and pressed run means the thing they finished, not the empty line
+* after it.
+*/
+function sqlStatementAtOffset(statements, offset) {
+	var _before;
+	if (statements.length === 0) return null;
+	let before = null;
+	for (const statement of statements) {
+		if (offset >= statement.start && offset <= statement.end) return statement;
+		if (statement.end < offset) before = statement;
+		else break;
+	}
+	return (_before = before) !== null && _before !== void 0 ? _before : statements[0];
+}
+/**
+* Whether the SQL uses a `{name}` placeholder outside strings and comments.
+* Also matches `{name.` and `{name(` so a `{filters(...)}` binding counts.
+*/
+function sqlUsesPlaceholder(sql, name) {
+	const needle = `{${name}`;
+	let i = 0;
+	const length = sql.length;
+	while (i < length) {
+		const ch = sql[i];
+		const next = sql[i + 1];
+		if (ch === "'" || ch === "\"" || ch === "`") {
+			i = skipQuoted(sql, i, ch);
+			continue;
+		}
+		if (ch === "-" && next === "-") {
+			i = skipLineComment(sql, i + 2);
+			continue;
+		}
+		if (ch === "/" && next === "*") {
+			i = skipBlockComment(sql, i + 2);
+			continue;
+		}
+		if (sql.startsWith(needle, i)) {
+			const after = sql[i + needle.length];
+			if (after === "}" || after === "." || after === "(") return true;
+		}
+		i++;
+	}
+	return false;
+}
+/**
+* Replace every `{name}` placeholder outside strings and comments with the
+* given text. A `{name(...)}` binding is left alone — that form carries
+* arguments the caller must interpret, and a blind substitution would corrupt it.
+*/
+function replaceSqlPlaceholder(sql, name, replacement) {
+	const needle = `{${name}}`;
+	let out = "";
+	let i = 0;
+	const length = sql.length;
+	while (i < length) {
+		const ch = sql[i];
+		const next = sql[i + 1];
+		let skipTo = -1;
+		if (ch === "'" || ch === "\"" || ch === "`") skipTo = skipQuoted(sql, i, ch);
+		else if (ch === "-" && next === "-") skipTo = skipLineComment(sql, i + 2);
+		else if (ch === "/" && next === "*") skipTo = skipBlockComment(sql, i + 2);
+		if (skipTo !== -1) {
+			out += sql.slice(i, skipTo);
+			i = skipTo;
+			continue;
+		}
+		if (sql.startsWith(needle, i)) {
+			out += replacement;
+			i += needle.length;
+			continue;
+		}
+		out += ch;
+		i++;
+	}
+	return out;
+}
+/** Names of every `{name}` / `{name.x}` placeholder, in order of first use. */
+function sqlPlaceholderNames(sql) {
+	const names = [];
+	const seen = /* @__PURE__ */ new Set();
+	let i = 0;
+	const length = sql.length;
+	while (i < length) {
+		const ch = sql[i];
+		const next = sql[i + 1];
+		if (ch === "'" || ch === "\"" || ch === "`") {
+			i = skipQuoted(sql, i, ch);
+			continue;
+		}
+		if (ch === "-" && next === "-") {
+			i = skipLineComment(sql, i + 2);
+			continue;
+		}
+		if (ch === "/" && next === "*") {
+			i = skipBlockComment(sql, i + 2);
+			continue;
+		}
+		if (ch === "{") {
+			const match = /^\{([A-Za-z_][A-Za-z0-9_]*)/.exec(sql.slice(i));
+			if (match) {
+				const name = match[1];
+				if (!seen.has(name)) {
+					seen.add(name);
+					names.push(name);
+				}
+				i += match[0].length;
+				continue;
+			}
+		}
+		i++;
+	}
+	return names;
+}
+function skipQuoted(text, from, quote) {
+	let i = from + 1;
+	const length = text.length;
+	while (i < length) {
+		const ch = text[i];
+		if (ch === "\\") {
+			i += 2;
+			continue;
+		}
+		if (ch === quote) {
+			if (text[i + 1] === quote) {
+				i += 2;
+				continue;
+			}
+			return i + 1;
+		}
+		i++;
+	}
+	return length;
+}
+function skipLineComment(text, from) {
+	let i = from;
+	const length = text.length;
+	while (i < length && text[i] !== "\n") i++;
+	return i;
+}
+function skipBlockComment(text, from) {
+	let i = from;
+	const length = text.length;
+	while (i < length) {
+		if (text[i] === "*" && text[i + 1] === "/") return i + 2;
+		i++;
+	}
+	return length;
 }
-QueryResultsTable.displayName = "QueryResultsTable";
 //#endregion
 //#region src/shells/alert-builder.tsx
 const defaultLabels$23 = {
@@ -2802,188 +2744,8 @@ function AlertBuilder({ value, onChange, metrics = [
 }
 AlertBuilder.displayName = "AlertBuilder";
 //#endregion
-//#region src/shells/sql-editor.tsx
-const defaultLabels$22 = {
-	placeholder: "SELECT * FROM events LIMIT 100",
-	runHint: "Ctrl+Enter to run",
-	runButton: "Run Query",
-	editor: "SQL 편집기"
-};
-/** Renders the sql editor component. */
-function SqlEditor({ value, onChange, onRun, onRunAndAdvance, placeholder, readOnly = false, height = 200, schema, completionSources, keymap: customKeymap, extensions: customExtensions, ariaLabel, autoFocus = false, showFooter, labels: customLabels, className }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$22), customLabels);
-	const fill = height === "fill";
-	const footerVisible = showFooter !== null && showFooter !== void 0 ? showFooter : Boolean(onRun);
-	const editorRef = react.useRef(null);
-	const viewRef = react.useRef(null);
-	const completionCompartmentRef = react.useRef(null);
-	const editableCompartmentRef = react.useRef(null);
-	const buildCompletionRef = react.useRef(null);
-	const latestValueRef = react.useRef(value);
-	const onChangeRef = react.useRef(onChange);
-	const onRunRef = react.useRef(onRun);
-	const onRunAndAdvanceRef = react.useRef(onRunAndAdvance);
-	const customKeymapRef = react.useRef(customKeymap);
-	const schemaRef = react.useRef(schema);
-	const completionSourcesRef = react.useRef(completionSources);
-	const autoFocusRef = react.useRef(autoFocus);
-	latestValueRef.current = value;
-	onChangeRef.current = onChange;
-	onRunRef.current = onRun;
-	onRunAndAdvanceRef.current = onRunAndAdvance;
-	customKeymapRef.current = customKeymap;
-	schemaRef.current = schema;
-	completionSourcesRef.current = completionSources;
-	autoFocusRef.current = autoFocus;
-	const autocompleteEnabled = react.useRef(schema !== void 0 || completionSources !== void 0).current;
-	react.useEffect(() => {
-		let view = null;
-		let cancelled = false;
-		async function init() {
-			var _customKeymapRef$curr;
-			const parent = editorRef.current;
-			if (!parent) return;
-			const [{ EditorView, keymap: cmKeymap, placeholder: cmPlaceholder }, { Compartment, EditorState }, langSql, { oneDark }, autocomplete] = await Promise.all([
-				import("@codemirror/view"),
-				import("@codemirror/state"),
-				import("@codemirror/lang-sql"),
-				import("@codemirror/theme-one-dark"),
-				autocompleteEnabled ? import("@codemirror/autocomplete") : Promise.resolve(null)
-			]);
-			if (cancelled || !parent.isConnected) return;
-			const completionCompartment = new Compartment();
-			const editableCompartment = new Compartment();
-			completionCompartmentRef.current = completionCompartment;
-			editableCompartmentRef.current = editableCompartment;
-			const buildCompletion = (nextSchema, nextSources) => {
-				if (!autocomplete) return [];
-				const dialect = langSql.PostgreSQL;
-				return [autocomplete.autocompletion({ override: [
-					langSql.schemaCompletionSource({
-						dialect,
-						schema: nextSchema !== null && nextSchema !== void 0 ? nextSchema : {}
-					}),
-					langSql.keywordCompletionSource(dialect),
-					...nextSources !== null && nextSources !== void 0 ? nextSources : []
-				] }), cmKeymap.of(autocomplete.completionKeymap)];
-			};
-			buildCompletionRef.current = buildCompletion;
-			const runKeymap = [{
-				key: "Shift-Enter",
-				run: (target) => {
-					const handler = onRunAndAdvanceRef.current;
-					if (!handler) return false;
-					handler(target.state.doc.toString());
-					return true;
-				}
-			}, {
-				key: "Mod-Enter",
-				run: (target) => {
-					const handler = onRunRef.current;
-					if (!handler) return false;
-					handler(target.state.doc.toString());
-					return true;
-				}
-			}];
-			const extensions = [
-				langSql.PostgreSQL.extension,
-				completionCompartment.of(buildCompletion(schemaRef.current, completionSourcesRef.current)),
-				oneDark,
-				cmKeymap.of([...(_customKeymapRef$curr = customKeymapRef.current) !== null && _customKeymapRef$curr !== void 0 ? _customKeymapRef$curr : [], ...runKeymap]),
-				EditorView.theme({
-					"&": { height: "100%" },
-					"&.cm-focused": {
-						outline: "2px solid var(--opt-ring)",
-						outlineOffset: "-2px"
-					},
-					".cm-scroller": {
-						height: "100%",
-						overflow: "auto"
-					}
-				}),
-				cmPlaceholder(placeholder !== null && placeholder !== void 0 ? placeholder : labels.placeholder),
-				EditorView.lineWrapping,
-				EditorView.updateListener.of((update) => {
-					if (update.docChanged) onChangeRef.current(update.state.doc.toString());
-				}),
-				editableCompartment.of(EditorView.editable.of(!readOnly)),
-				EditorView.contentAttributes.of({ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : labels.editor }),
-				...customExtensions !== null && customExtensions !== void 0 ? customExtensions : []
-			];
-			view = new EditorView({
-				state: EditorState.create({
-					doc: latestValueRef.current,
-					extensions
-				}),
-				parent
-			});
-			viewRef.current = view;
-			if (autoFocusRef.current) view.focus();
-		}
-		init();
-		return () => {
-			cancelled = true;
-			view === null || view === void 0 || view.destroy();
-			if (viewRef.current === view) viewRef.current = null;
-			completionCompartmentRef.current = null;
-			editableCompartmentRef.current = null;
-			buildCompletionRef.current = null;
-		};
-	}, []);
-	react.useEffect(() => {
-		const view = viewRef.current;
-		if (view && view.state.doc.toString() !== value) view.dispatch({ changes: {
-			from: 0,
-			to: view.state.doc.length,
-			insert: value
-		} });
-	}, [value]);
-	react.useEffect(() => {
-		const view = viewRef.current;
-		const compartment = completionCompartmentRef.current;
-		const build = buildCompletionRef.current;
-		if (!view || !compartment || !build) return;
-		view.dispatch({ effects: compartment.reconfigure(build(schema, completionSources)) });
-	}, [schema, completionSources]);
-	react.useEffect(() => {
-		const view = viewRef.current;
-		const compartment = editableCompartmentRef.current;
-		if (!view || !compartment) return;
-		let cancelled = false;
-		import("@codemirror/view").then(({ EditorView }) => {
-			if (cancelled || viewRef.current !== view) return;
-			view.dispatch({ effects: compartment.reconfigure(EditorView.editable.of(!readOnly)) });
-		});
-		return () => {
-			cancelled = true;
-		};
-	}, [readOnly]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_text_truncate.cn("gap-element flex flex-col", fill && "h-full min-h-0", className),
-		"data-opt-id": "RSGKV",
-		"data-opt-slug": "sql-editor.SqlEditor",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			ref: editorRef,
-			className: require_text_truncate.cn("border-border overflow-hidden rounded-lg border", fill && "min-h-0 flex-1"),
-			style: fill ? void 0 : { height }
-		}), footerVisible && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			className: "flex flex-none items-center justify-between",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "text-text-tertiary text-xs",
-				children: labels.runHint
-			}), onRun && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.Button, {
-				variant: "primary",
-				size: "sm",
-				onClick: () => onRun(value),
-				children: labels.runButton
-			})]
-		})]
-	});
-}
-SqlEditor.displayName = "SqlEditor";
-//#endregion
 //#region src/shells/event-meta-editor.tsx
-const defaultLabels$21 = {
+const defaultLabels$22 = {
 	icon: "Icon",
 	color: "Color",
 	name: "Event name",
@@ -3001,7 +2763,7 @@ const defaultLabels$21 = {
 };
 /** Renders the event meta editor component. */
 function EventMetaEditor({ value, onChange, icons, sections, footer, className, labels: customLabels }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$21), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$22), customLabels);
 	const hasTags = value.tags.length > 0;
 	const nameId = react.useId();
 	const displayNameId = react.useId();
@@ -3124,10 +2886,10 @@ function EventMetaEditor({ value, onChange, icons, sections, footer, className,
 EventMetaEditor.displayName = "EventMetaEditor";
 //#endregion
 //#region src/shells/widget-grid.tsx
-const defaultLabels$20 = { emptyMessage: "No widgets to display" };
+const defaultLabels$21 = { emptyMessage: "No widgets to display" };
 /** Renders the widget grid component. */
 function WidgetGrid({ widgets, cols = 12, rowHeight = 80, gap = 16, editable = false, onReorder, labels: customLabels, className }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$20), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$21), customLabels);
 	const [dragIdx, setDragIdx] = react.useState(null);
 	const [overIdx, setOverIdx] = react.useState(null);
 	if (widgets.length === 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -3172,7 +2934,7 @@ function WidgetGrid({ widgets, cols = 12, rowHeight = 80, gap = 16, editable = f
 WidgetGrid.displayName = "WidgetGrid";
 //#endregion
 //#region src/shells/report-builder.tsx
-const defaultLabels$19 = {
+const defaultLabels$20 = {
 	stepsLabel: "Report steps",
 	stepType: "Chart Type",
 	stepConfig: "Data Config",
@@ -3248,7 +3010,7 @@ const STEPS = [
 ];
 /** Renders the report builder component. */
 function ReportBuilder({ chartTypes = DEFAULT_CHART_TYPES, dataSources = [], onSave, onCancel, configForm, styleForm, preview, onChartTypeChange, onDataSourceChange, onStepChange, selectedChartType: controlledChartType, selectedDataSource: controlledDataSource, labels: customLabels, className }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$19), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$20), customLabels);
 	const [stepIndex, setStepIndex] = react.useState(0);
 	const [internalChartType, setInternalChartType] = react.useState(null);
 	const [internalDataSource, setInternalDataSource] = react.useState("");
@@ -3468,7 +3230,7 @@ function ReportBuilder({ chartTypes = DEFAULT_CHART_TYPES, dataSources = [], onS
 ReportBuilder.displayName = "ReportBuilder";
 //#endregion
 //#region src/shells/audit-timeline.tsx
-const defaultLabels$18 = {
+const defaultLabels$19 = {
 	title: "변경 이력",
 	empty: "변경 이력이 없습니다",
 	expand: "상세 보기",
@@ -3547,7 +3309,7 @@ function DiffTable({ changes, labels }) {
 }
 /** Renders the audit timeline component. */
 function AuditTimeline({ entries, labels: customLabels, className, onEntryClick }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$18), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$19), customLabels);
 	const [expandedIds, setExpandedIds] = react.useState(/* @__PURE__ */ new Set());
 	const toggleExpanded = react.useCallback((id) => {
 		setExpandedIds((prev) => {
@@ -3670,7 +3432,7 @@ function AuditTimeline({ entries, labels: customLabels, className, onEntryClick
 AuditTimeline.displayName = "AuditTimeline";
 //#endregion
 //#region src/shells/segment-builder.tsx
-const defaultLabels$17 = {
+const defaultLabels$18 = {
 	match: "Match",
 	ofTheFollowing: "of the following",
 	groupLabel: "Segment group",
@@ -3791,7 +3553,7 @@ function SegmentBuilder({ groups, onChange, eventOptions = [
 	"New Users",
 	"Power Users"
 ], className, labels: customLabels }) {
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$17), customLabels);
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$18), customLabels);
 	const builderId = react.useId().replace(/:/g, "");
 	const nextIdRef = react.useRef(1);
 	const createId = react.useCallback(() => {
@@ -4003,57 +3765,754 @@ function SegmentBuilder({ groups, onChange, eventOptions = [
 }
 SegmentBuilder.displayName = "SegmentBuilder";
 //#endregion
-//#region src/shells/insights-panel.tsx
-const defaultLabels$16 = {
-	title: "Insights",
-	dismiss: "Dismiss",
-	showDismissed: "Show dismissed",
-	hideDismissed: "Hide dismissed",
-	emptyTitle: "No insights",
-	emptyDescription: "No anomalies or notable events detected.",
-	detectionTitle: "Detection Settings",
-	daysLabel: "Days",
-	zScoreLabel: "Z-Score"
+//#region src/shells/criteria-builder.tsx
+const defaultLabels$17 = {
+	builder: "조건 빌더",
+	rootLogicLegend: "그룹 결합 방식",
+	matchAllGroups: "모든 그룹 일치",
+	matchAnyGroup: "하나 이상 일치",
+	groupLogicLegend: (letter) => `그룹 ${letter} 조건 결합 방식`,
+	matchAllCriteria: "모두 충족",
+	matchAnyCriteria: "하나 이상 충족",
+	and: "그리고",
+	or: "또는",
+	groupLabel: (letter) => `그룹 ${letter}`,
+	criterionLabel: (letter, index) => `조건 ${letter}.${index}`,
+	actionLabel: (action, target) => `${action}: ${target}`,
+	addCriterion: "조건 추가",
+	addGroup: "그룹 추가",
+	kindMenuTitle: "조건 유형",
+	duplicateCriterion: "조건 복제",
+	removeCriterion: "조건 제거",
+	moveUp: "위로 이동",
+	moveDown: "아래로 이동",
+	negate: "제외",
+	duplicateGroup: "그룹 복제",
+	removeGroup: "그룹 제거",
+	emptyGroup: "이 그룹에는 아직 조건이 없습니다.",
+	unknownKind: (kind) => `알 수 없는 조건 유형 "${kind}"`,
+	unknownKindDescription: "이 조건은 표시할 수 없습니다. 유형을 바꾸거나 제거하세요.",
+	replaceKind: "유형 바꾸기",
+	emptyTitle: "조건이 없습니다",
+	emptyDescription: "첫 그룹을 추가해 누가 포함되는지 정의하세요.",
+	emptyAction: "첫 조건 추가",
+	keyboardHint: "조건 추가 · 그룹 추가",
+	maxGroupsReached: (max) => `그룹은 최대 ${max}개까지 추가할 수 있습니다.`,
+	maxCriteriaReached: (max) => `한 그룹에는 조건을 최대 ${max}개까지 추가할 수 있습니다.`
 };
-const severityConfig = {
-	critical: {
-		icon: "!!",
-		color: "text-danger-fg",
-		bg: "bg-danger-subtle border-danger"
-	},
-	warning: {
-		icon: "!",
-		color: "text-warning-fg",
-		bg: "bg-warning-subtle border-warning"
-	},
-	info: {
-		icon: "i",
-		color: "text-info-fg",
-		bg: "bg-info-subtle border-info"
+/** `A`, `B`, … `Z`, `AA`, `AB` — the badge a group wears. */
+function criteriaGroupLetter(index) {
+	let n = Math.max(0, Math.floor(index));
+	let out = "";
+	do {
+		out = String.fromCharCode(65 + n % 26) + out;
+		n = Math.floor(n / 26) - 1;
+	} while (n >= 0);
+	return out;
+}
+function collectIds(value) {
+	const ids = /* @__PURE__ */ new Set();
+	for (const group of value.groups) {
+		ids.add(group.id);
+		for (const criterion of group.criteria) ids.add(criterion.id);
 	}
-};
-/** Renders the insights panel component. */
-function InsightsPanel({ insights, stats, detectionTypes, onDetectionTypeToggle, detectionConfig, onDetectionConfigChange, onDismiss, onInsightClick, onStatClick, header, actions, labels: customLabels, className }) {
-	var _detectionConfig$days, _detectionConfig$zSco;
-	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$16), customLabels);
-	const [showDismissed, setShowDismissed] = react.useState(false);
-	const visibleInsights = showDismissed ? insights : insights.filter((i) => !i.dismissed);
-	const hasStats = stats && stats.length > 0;
-	const hasDetection = detectionTypes && detectionTypes.length > 0 || detectionConfig != null;
-	const isEmpty = visibleInsights.length === 0;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_text_truncate.cn("gap-group flex flex-col", className),
-		"data-opt-id": "HCYZV",
-		"data-opt-slug": "insights-panel.InsightsPanel",
-		children: [
-			header || actions ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: "flex items-center justify-between",
-				children: [header && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: header }), actions && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: "gap-element flex items-center",
-					children: actions
-				})]
-			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: "flex items-center justify-between",
+	return ids;
+}
+function uniqueId(base, taken) {
+	if (!taken.has(base)) return base;
+	let n = 2;
+	while (taken.has(`${base}-${n}`)) n += 1;
+	return `${base}-${n}`;
+}
+function replaceGroup(value, groupIndex, next) {
+	return require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, value), {}, { groups: value.groups.map((group, i) => i === groupIndex ? next : group) });
+}
+/**
+* Moves one criterion a step up or down inside its group. Returns the same
+* value when the move is impossible, so a caller can `===` to know nothing
+* changed.
+*/
+function criteriaBuilderMove(value, groupIndex, index, direction) {
+	const group = value.groups[groupIndex];
+	if (!group) return value;
+	const target = direction === "up" ? index - 1 : index + 1;
+	if (index < 0 || target < 0 || target >= group.criteria.length) return value;
+	const criteria = [...group.criteria];
+	const [moved] = criteria.splice(index, 1);
+	criteria.splice(target, 0, moved);
+	return replaceGroup(value, groupIndex, require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, group), {}, { criteria }));
+}
+/**
+* Inserts a copy of one criterion *before* the original, so the copy takes the
+* original's place in the reading order and the original follows as the thing
+* to edit.
+*/
+function criteriaBuilderDuplicate(value, groupIndex, index, clone) {
+	const group = value.groups[groupIndex];
+	const original = group === null || group === void 0 ? void 0 : group.criteria[index];
+	if (!group || !original) return value;
+	const criteria = [...group.criteria];
+	criteria.splice(index, 0, clone(original));
+	return replaceGroup(value, groupIndex, require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, group), {}, { criteria }));
+}
+/** Removes one criterion. The group stays, even when it empties. */
+function criteriaBuilderRemove(value, groupIndex, index) {
+	const group = value.groups[groupIndex];
+	if (!group || index < 0 || index >= group.criteria.length) return value;
+	return replaceGroup(value, groupIndex, require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, group), {}, { criteria: group.criteria.filter((_, i) => i !== index) }));
+}
+/** Appends a criterion to a group, or inserts it at `at`. */
+function criteriaBuilderInsert(value, groupIndex, criterion, at) {
+	const group = value.groups[groupIndex];
+	if (!group) return value;
+	const criteria = [...group.criteria];
+	const position = at === void 0 ? criteria.length : Math.max(0, Math.min(at, criteria.length));
+	criteria.splice(position, 0, criterion);
+	return replaceGroup(value, groupIndex, require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, group), {}, { criteria }));
+}
+/** Removes one group. */
+function criteriaBuilderRemoveGroup(value, groupIndex) {
+	if (groupIndex < 0 || groupIndex >= value.groups.length) return value;
+	return require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, value), {}, { groups: value.groups.filter((_, i) => i !== groupIndex) });
+}
+/** Inserts a copy of one group — every criterion cloned — before the original. */
+function criteriaBuilderDuplicateGroup(value, groupIndex, groupId, clone) {
+	const group = value.groups[groupIndex];
+	if (!group) return value;
+	const copy = {
+		id: groupId,
+		logic: group.logic,
+		criteria: group.criteria.map(clone)
+	};
+	const groups = [...value.groups];
+	groups.splice(groupIndex, 0, copy);
+	return require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, value), {}, { groups });
+}
+const EDITABLE_TARGET = "input, textarea, select, [contenteditable=\"\"], [contenteditable=\"true\"], [role=\"combobox\"], [role=\"textbox\"], [role=\"menu\"], [role=\"menuitem\"], [role=\"listbox\"], [role=\"option\"]";
+function isEditableTarget(target) {
+	return target instanceof Element && target.closest(EDITABLE_TARGET) !== null;
+}
+function sectionKinds(kinds) {
+	const sections = [];
+	const byHeading = /* @__PURE__ */ new Map();
+	for (const option of kinds) {
+		let section = byHeading.get(option.group);
+		if (!section) {
+			section = {
+				heading: option.group,
+				entries: []
+			};
+			byHeading.set(option.group, section);
+			sections.push(section);
+		}
+		section.entries.push({
+			key: option.kind,
+			kind: option.kind,
+			negate: false,
+			option
+		});
+		if (option.negatedLabel) section.entries.push({
+			key: `${option.kind}:not`,
+			kind: option.kind,
+			negate: true,
+			option
+		});
+	}
+	return [...sections.filter((s) => s.heading === void 0), ...sections.filter((s) => s.heading !== void 0)];
+}
+function KindMenu({ kinds, menuLabel, triggerLabel, triggerAriaLabel, triggerIcon, disabled = false, disabledReason, variant = "ghost", onPick, addTarget }) {
+	const sections = react.useMemo(() => sectionKinds(kinds), [kinds]);
+	const trigger = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_text_truncate.DropdownTrigger, {
+		disabled,
+		"aria-label": triggerAriaLabel,
+		title: disabled ? disabledReason : void 0,
+		"data-criteria-add": addTarget,
+		className: require_text_truncate.cn("inline-flex cursor-pointer items-center justify-center rounded-lg font-medium transition-colors", "h-[var(--opt-control-sm)] gap-[var(--opt-space-1-5)] px-[var(--opt-control-padding-sm)] text-xs", variant === "secondary" ? "border-border bg-surface text-text-primary hover:bg-bg-subtle active:bg-bg-muted border" : "text-text-secondary hover:bg-bg-subtle active:bg-bg-muted", "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50", "[&_svg]:size-3.5", require_text_truncate.OPT_FOCUS_VISIBLE),
+		children: [triggerIcon, triggerLabel]
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_text_truncate.DropdownMenu, {
+		animated: false,
+		children: [trigger, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownContent, {
+			"aria-label": menuLabel,
+			"aria-labelledby": void 0,
+			className: "min-w-56",
+			children: sections.map((section, si) => {
+				var _section$heading;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [
+					si > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownSeparator, {}),
+					section.heading !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						role: "presentation",
+						className: "text-text-tertiary px-2 pt-1.5 pb-1 text-[11px] font-semibold tracking-wide uppercase",
+						children: section.heading
+					}),
+					section.entries.map((entry) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_text_truncate.DropdownItem, {
+						onClick: () => onPick(entry.kind, entry.negate),
+						className: "flex items-start gap-2",
+						children: [entry.option.icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-text-tertiary mt-0.5 shrink-0 [&_svg]:size-3.5",
+							children: entry.option.icon
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: "flex min-w-0 flex-col",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: require_text_truncate.cn("text-sm", entry.negate && "text-danger-fg"),
+								children: entry.negate ? entry.option.negatedLabel : entry.option.label
+							}), !entry.negate && entry.option.description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "text-text-tertiary text-xs",
+								children: entry.option.description
+							})]
+						})]
+					}, entry.key))
+				] }, (_section$heading = section.heading) !== null && _section$heading !== void 0 ? _section$heading : "__none");
+			})
+		})]
+	});
+}
+function IconAction({ icon, label, onClick, disabled = false, danger = false }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		onClick,
+		disabled,
+		"aria-label": label,
+		title: label,
+		className: require_text_truncate.cn("inline-flex size-7 shrink-0 items-center justify-center rounded-md transition-colors [&_svg]:size-3.5", danger ? "text-text-tertiary hover:bg-danger-subtle hover:text-danger-fg" : "text-text-tertiary hover:bg-bg-muted hover:text-text-primary", "disabled:pointer-events-none disabled:opacity-40", require_text_truncate.OPT_FOCUS_VISIBLE),
+		children: icon
+	});
+}
+function LogicDivider({ label, emphasis }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		role: "separator",
+		"aria-label": label,
+		className: require_text_truncate.cn("flex items-center", emphasis === "root" ? "gap-group" : "gap-element"),
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: require_text_truncate.cn("h-px flex-1", emphasis === "root" ? "bg-border" : "bg-border-subtle") }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: require_text_truncate.cn("text-[11px] font-semibold tracking-wide uppercase", emphasis === "root" ? "bg-bg-subtle text-text-secondary border-border rounded-full border px-2 py-0.5" : "text-text-tertiary"),
+				children: label
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: require_text_truncate.cn("h-px flex-1", emphasis === "root" ? "bg-border" : "bg-border-subtle") })
+		]
+	});
+}
+function Lettermark({ letter }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		"aria-hidden": "true",
+		className: "bg-accent-subtle text-accent inline-flex size-6 shrink-0 items-center justify-center rounded-md text-xs font-semibold tabular-nums",
+		children: letter
+	});
+}
+/**
+* CriteriaBuilder — a two-level tree of criteria, edited as sentences.
+*
+* The builder owns what every criteria editor needs and nothing a particular
+* product does: groups and their AND/OR, the order of criteria, negation,
+* inline errors, the "add" menu, and the keyboard. The consumer owns the
+* criterion type and renders each one — usually as `Expression` chips whose
+* values open an editor — so the same shell serves a cohort of users, an
+* alert condition, or a feature-flag rollout without knowing which.
+*
+* Kinds the builder does not know render as an invalid row with a warning and
+* a replace/remove pair, never as some other kind's fields: a criterion saved
+* by a newer client should look broken, not silently different.
+*
+* @example
+* ```tsx
+* <CriteriaBuilder
+*   value={value}
+*   onChange={setValue}
+*   kinds={[
+*     { kind: "performed", label: "이벤트를 수행함", negatedLabel: "이벤트를 수행하지 않음" },
+*     { kind: "property", label: "속성이 일치함" },
+*   ]}
+*   createCriterion={(kind, negate) => ({ id: nextId(), kind, negate, event: "" })}
+*   renderCriterion={(c, api) => (
+*     <ExpressionGroup>
+*       <Expression description="이벤트" value={c.event} onClick={() => open(c.id)} />
+*     </ExpressionGroup>
+*   )}
+* />
+* ```
+*/
+function CriteriaBuilder({ value, onChange, kinds, createCriterion, renderCriterion, cloneCriterion, createGroupId, errors, maxGroups = 10, maxCriteriaPerGroup = 20, allowNegation = true, disabled = false, aside, labels: customLabels, className, "aria-label": ariaLabel }) {
+	const labels = react.useMemo(() => require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$17), customLabels), [customLabels]);
+	const baseId = react.useId().replace(/:/g, "");
+	const nextGroupRef = react.useRef(1);
+	const rootRef = react.useRef(null);
+	const [pendingOpen, setPendingOpen] = react.useState(null);
+	const knownKinds = react.useMemo(() => new Set(kinds.map((k) => k.kind)), [kinds]);
+	const groupsFull = value.groups.length >= maxGroups;
+	const newGroupId = react.useCallback(() => {
+		const taken = collectIds(value);
+		if (createGroupId) return uniqueId(createGroupId(), taken);
+		let id = "";
+		do
+			id = `group-${nextGroupRef.current++}`;
+		while (taken.has(id));
+		return id;
+	}, [createGroupId, value]);
+	const clone = react.useCallback((criterion, taken) => {
+		if (cloneCriterion) return cloneCriterion(criterion);
+		const id = uniqueId(`${criterion.id}-copy`, taken);
+		taken.add(id);
+		return require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, criterion), {}, { id });
+	}, [cloneCriterion]);
+	const addGroup = react.useCallback(() => {
+		if (disabled || groupsFull) return null;
+		const id = newGroupId();
+		onChange(require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, value), {}, { groups: [...value.groups, {
+			id,
+			logic: "and",
+			criteria: []
+		}] }));
+		return id;
+	}, [
+		disabled,
+		groupsFull,
+		newGroupId,
+		onChange,
+		value
+	]);
+	const addCriterion = react.useCallback((groupIndex, kind, negate) => {
+		const group = value.groups[groupIndex];
+		if (!group || group.criteria.length >= maxCriteriaPerGroup) return;
+		onChange(criteriaBuilderInsert(value, groupIndex, createCriterion(kind, negate)));
+	}, [
+		createCriterion,
+		maxCriteriaPerGroup,
+		onChange,
+		value
+	]);
+	const addFirst = react.useCallback((kind, negate) => {
+		if (disabled) return;
+		onChange(require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, value), {}, { groups: [{
+			id: newGroupId(),
+			logic: "and",
+			criteria: [createCriterion(kind, negate)]
+		}] }));
+	}, [
+		createCriterion,
+		disabled,
+		newGroupId,
+		onChange,
+		value
+	]);
+	const replaceCriterion = react.useCallback((groupIndex, index, kind, negate) => {
+		const group = value.groups[groupIndex];
+		const current = group === null || group === void 0 ? void 0 : group.criteria[index];
+		if (!group || !current) return;
+		const replacement = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, createCriterion(kind, negate)), {}, { id: current.id });
+		onChange(replaceGroup(value, groupIndex, require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, group), {}, { criteria: group.criteria.map((c, i) => i === index ? replacement : c) })));
+	}, [
+		createCriterion,
+		onChange,
+		value
+	]);
+	const updateCriterion = react.useCallback((groupIndex, index, patch) => {
+		const group = value.groups[groupIndex];
+		if (!group) return;
+		onChange(replaceGroup(value, groupIndex, require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, group), {}, { criteria: group.criteria.map((c, i) => i === index ? require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, c), patch) : c) })));
+	}, [onChange, value]);
+	const findAddTrigger = react.useCallback((groupId) => {
+		var _rootRef$current$quer, _rootRef$current;
+		return (_rootRef$current$quer = (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.querySelector(`[data-criteria-add="${groupId.replace(/["\\]/g, "\\$&")}"]`)) !== null && _rootRef$current$quer !== void 0 ? _rootRef$current$quer : null;
+	}, []);
+	react.useEffect(() => {
+		if (!pendingOpen) return;
+		const trigger = findAddTrigger(pendingOpen);
+		if (!trigger) return;
+		setPendingOpen(null);
+		trigger.focus();
+		trigger.click();
+	}, [
+		findAddTrigger,
+		pendingOpen,
+		value
+	]);
+	const handleKeyDown = react.useCallback((event) => {
+		if (disabled || event.defaultPrevented) return;
+		if (event.altKey || event.ctrlKey || event.metaKey) return;
+		if (isEditableTarget(event.target)) return;
+		const key = event.key.toLowerCase();
+		if (key === "g") {
+			const id = addGroup();
+			if (id) {
+				event.preventDefault();
+				setPendingOpen(id);
+			}
+			return;
+		}
+		if (key === "a") {
+			const host = event.target instanceof Element ? event.target.closest("[data-criteria-group]") : null;
+			const groupId = host === null || host === void 0 ? void 0 : host.dataset.criteriaGroup;
+			const trigger = groupId ? findAddTrigger(groupId) : null;
+			if (trigger && !trigger.disabled) {
+				event.preventDefault();
+				trigger.focus();
+				trigger.click();
+			}
+		}
+	}, [
+		addGroup,
+		disabled,
+		findAddTrigger
+	]);
+	const rootLogicOptions = react.useMemo(() => [{
+		value: "and",
+		label: labels.matchAllGroups
+	}, {
+		value: "or",
+		label: labels.matchAnyGroup
+	}], [labels]);
+	const groupLogicOptions = react.useMemo(() => [{
+		value: "and",
+		label: labels.matchAllCriteria
+	}, {
+		value: "or",
+		label: labels.matchAnyCriteria
+	}], [labels]);
+	const isEmpty = value.groups.length === 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		ref: rootRef,
+		role: "group",
+		"aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : labels.builder,
+		className: require_text_truncate.cn("gap-section flex flex-col lg:flex-row", className),
+		onKeyDown: handleKeyDown,
+		"data-opt-id": "6F4JG",
+		"data-opt-slug": "criteria-builder.CriteriaBuilder",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "gap-group flex min-w-0 flex-1 flex-col",
+			children: isEmpty ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.EmptyState, {
+				title: labels.emptyTitle,
+				description: labels.emptyDescription,
+				hasBorder: true,
+				tone: "subdued",
+				actions: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(KindMenu, {
+					kinds,
+					menuLabel: labels.kindMenuTitle,
+					triggerLabel: labels.emptyAction,
+					triggerAriaLabel: labels.emptyAction,
+					triggerIcon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, { "aria-hidden": "true" }),
+					variant: "secondary",
+					disabled,
+					onPick: addFirst
+				}),
+				footer: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "gap-element inline-flex items-center",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.Kbd, {
+							hint: true,
+							children: "A"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.Kbd, {
+							hint: true,
+							children: "G"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: labels.keyboardHint })
+					]
+				})
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("fieldset", {
+					className: "gap-group m-0 flex min-w-0 flex-wrap items-center border-0 p-0",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("legend", {
+							className: "sr-only",
+							children: labels.rootLogicLegend
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_field_sidebar.SegmentedControl, {
+							"aria-label": labels.rootLogicLegend,
+							size: "sm",
+							options: rootLogicOptions,
+							value: value.logic,
+							onChange: (logic) => onChange(require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, value), {}, { logic })),
+							disabled
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: "text-text-tertiary gap-element hidden items-center text-xs sm:inline-flex",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.Kbd, {
+									hint: true,
+									children: "A"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.Kbd, {
+									hint: true,
+									children: "G"
+								}),
+								labels.keyboardHint
+							]
+						})
+					]
+				}),
+				value.groups.map((group, groupIndex) => {
+					const letter = criteriaGroupLetter(groupIndex);
+					const groupName = labels.groupLabel(letter);
+					const groupLabelId = `${baseId}-${group.id}-label`;
+					const groupError = errors === null || errors === void 0 ? void 0 : errors[group.id];
+					const groupErrorId = `${baseId}-${group.id}-error`;
+					const criteriaFull = group.criteria.length >= maxCriteriaPerGroup;
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [groupIndex > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LogicDivider, {
+						emphasis: "root",
+						label: value.logic === "and" ? labels.and : labels.or
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						role: "group",
+						"aria-labelledby": groupLabelId,
+						"aria-describedby": groupError ? groupErrorId : void 0,
+						"data-criteria-group": group.id,
+						"data-invalid": groupError ? true : void 0,
+						className: require_text_truncate.cn("bg-bg-subtle gap-element flex flex-col rounded-lg border p-3", groupError ? "border-danger/40" : "border-border"),
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								id: groupLabelId,
+								className: "sr-only",
+								children: groupName
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "gap-element flex flex-wrap items-center justify-between",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "gap-element flex items-center",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Lettermark, { letter }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("fieldset", {
+										className: "m-0 border-0 p-0",
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("legend", {
+											className: "sr-only",
+											children: labels.groupLogicLegend(letter)
+										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_field_sidebar.SegmentedControl, {
+											"aria-label": labels.groupLogicLegend(letter),
+											size: "sm",
+											options: groupLogicOptions,
+											value: group.logic,
+											onChange: (logic) => onChange(replaceGroup(value, groupIndex, require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, group), {}, { logic }))),
+											disabled
+										})]
+									})]
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "flex items-center gap-0.5",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconAction, {
+										icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Copy, { "aria-hidden": "true" }),
+										label: labels.actionLabel(labels.duplicateGroup, groupName),
+										disabled: disabled || groupsFull,
+										onClick: () => {
+											const taken = collectIds(value);
+											const id = newGroupId();
+											taken.add(id);
+											onChange(criteriaBuilderDuplicateGroup(value, groupIndex, id, (c) => clone(c, taken)));
+										}
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconAction, {
+										icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Trash2, { "aria-hidden": "true" }),
+										label: labels.actionLabel(labels.removeGroup, groupName),
+										disabled,
+										danger: true,
+										onClick: () => onChange(criteriaBuilderRemoveGroup(value, groupIndex))
+									})]
+								})]
+							}),
+							group.criteria.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+								className: "text-text-tertiary text-xs",
+								children: labels.emptyGroup
+							}),
+							group.criteria.map((criterion, index) => {
+								const criterionName = labels.criterionLabel(letter, index + 1);
+								const rowLabelId = `${baseId}-${criterion.id}-label`;
+								const error = errors === null || errors === void 0 ? void 0 : errors[criterion.id];
+								const errorId = `${baseId}-${criterion.id}-error`;
+								const known = knownKinds.has(criterion.kind);
+								const negated = criterion.negate === true;
+								const api = {
+									update: (patch) => updateCriterion(groupIndex, index, patch),
+									invalid: Boolean(error) || !known,
+									error,
+									disabled,
+									groupIndex,
+									index
+								};
+								return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [index > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LogicDivider, {
+									emphasis: "group",
+									label: group.logic === "and" ? labels.and : labels.or
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									role: "group",
+									"aria-labelledby": rowLabelId,
+									"aria-describedby": error ? errorId : void 0,
+									"data-criterion-kind": criterion.kind,
+									"data-negated": negated || void 0,
+									"data-invalid": error || !known ? true : void 0,
+									className: require_text_truncate.cn("bg-surface gap-element flex flex-col rounded-md border p-2", error || !known ? "border-danger/40" : "border-border-subtle"),
+									children: [
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+											id: rowLabelId,
+											className: "sr-only",
+											children: criterionName
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+											className: "gap-element flex flex-wrap items-start",
+											children: [
+												allowNegation && known && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+													type: "button",
+													"aria-pressed": negated,
+													"aria-label": labels.actionLabel(labels.negate, criterionName),
+													disabled,
+													onClick: () => updateCriterion(groupIndex, index, { negate: !negated }),
+													className: require_text_truncate.cn("inline-flex h-7 shrink-0 items-center rounded-md border px-2 text-[11px] font-semibold tracking-wide uppercase transition-colors", negated ? "border-danger/40 bg-danger-subtle text-danger-fg" : "border-border bg-bg-subtle text-text-tertiary hover:text-text-secondary", "disabled:pointer-events-none disabled:opacity-50", "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-ring-offset"),
+													children: labels.negate
+												}),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+													className: "min-w-0 flex-1",
+													children: known ? renderCriterion(criterion, api) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_field_sidebar.Callout, {
+														tone: "warning",
+														size: "sm",
+														title: labels.unknownKind(criterion.kind),
+														icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.TriangleAlert, { "aria-hidden": "true" }),
+														action: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(KindMenu, {
+															kinds,
+															menuLabel: labels.kindMenuTitle,
+															triggerLabel: labels.replaceKind,
+															triggerAriaLabel: labels.actionLabel(labels.replaceKind, criterionName),
+															variant: "secondary",
+															disabled,
+															onPick: (kind, negate) => replaceCriterion(groupIndex, index, kind, negate)
+														}),
+														children: labels.unknownKindDescription
+													})
+												}),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+													className: "flex items-center gap-0.5",
+													children: [
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconAction, {
+															icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ArrowUp, { "aria-hidden": "true" }),
+															label: labels.actionLabel(labels.moveUp, criterionName),
+															disabled: disabled || index === 0,
+															onClick: () => onChange(criteriaBuilderMove(value, groupIndex, index, "up"))
+														}),
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconAction, {
+															icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ArrowDown, { "aria-hidden": "true" }),
+															label: labels.actionLabel(labels.moveDown, criterionName),
+															disabled: disabled || index === group.criteria.length - 1,
+															onClick: () => onChange(criteriaBuilderMove(value, groupIndex, index, "down"))
+														}),
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconAction, {
+															icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Copy, { "aria-hidden": "true" }),
+															label: labels.actionLabel(labels.duplicateCriterion, criterionName),
+															disabled: disabled || criteriaFull,
+															onClick: () => onChange(criteriaBuilderDuplicate(value, groupIndex, index, (c) => clone(c, collectIds(value))))
+														}),
+														/* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconAction, {
+															icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Trash2, { "aria-hidden": "true" }),
+															label: labels.actionLabel(labels.removeCriterion, criterionName),
+															disabled,
+															danger: true,
+															onClick: () => onChange(criteriaBuilderRemove(value, groupIndex, index))
+														})
+													]
+												})
+											]
+										}),
+										error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+											id: errorId,
+											className: "text-danger-fg text-xs",
+											children: error
+										})
+									]
+								})] }, criterion.id);
+							}),
+							groupError && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+								id: groupErrorId,
+								className: "text-danger-fg text-xs",
+								children: groupError
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "gap-element flex flex-wrap items-center",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(KindMenu, {
+									kinds,
+									menuLabel: labels.kindMenuTitle,
+									triggerLabel: labels.addCriterion,
+									triggerAriaLabel: labels.actionLabel(labels.addCriterion, groupName),
+									triggerIcon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, { "aria-hidden": "true" }),
+									disabled: disabled || criteriaFull,
+									disabledReason: labels.maxCriteriaReached(maxCriteriaPerGroup),
+									onPick: (kind, negate) => addCriterion(groupIndex, kind, negate),
+									addTarget: group.id
+								}), criteriaFull && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "text-text-tertiary text-xs",
+									children: labels.maxCriteriaReached(maxCriteriaPerGroup)
+								})]
+							})
+						]
+					})] }, group.id);
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "gap-element flex flex-wrap items-center",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.Button, {
+						variant: "secondary",
+						size: "sm",
+						leftIcon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, { "aria-hidden": "true" }),
+						disabled: disabled || groupsFull,
+						title: groupsFull ? labels.maxGroupsReached(maxGroups) : void 0,
+						onClick: () => {
+							const id = addGroup();
+							if (id) setPendingOpen(id);
+						},
+						children: labels.addGroup
+					}), groupsFull && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-text-tertiary text-xs",
+						children: labels.maxGroupsReached(maxGroups)
+					})]
+				})
+			] })
+		}), aside !== void 0 && aside !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("aside", {
+			className: "min-w-0 lg:w-72 lg:shrink-0",
+			children: aside
+		})]
+	});
+}
+CriteriaBuilder.displayName = "CriteriaBuilder";
+//#endregion
+//#region src/shells/insights-panel.tsx
+const defaultLabels$16 = {
+	title: "Insights",
+	dismiss: "Dismiss",
+	showDismissed: "Show dismissed",
+	hideDismissed: "Hide dismissed",
+	emptyTitle: "No insights",
+	emptyDescription: "No anomalies or notable events detected.",
+	detectionTitle: "Detection Settings",
+	daysLabel: "Days",
+	zScoreLabel: "Z-Score"
+};
+const severityConfig = {
+	critical: {
+		icon: "!!",
+		color: "text-danger-fg",
+		bg: "bg-danger-subtle border-danger"
+	},
+	warning: {
+		icon: "!",
+		color: "text-warning-fg",
+		bg: "bg-warning-subtle border-warning"
+	},
+	info: {
+		icon: "i",
+		color: "text-info-fg",
+		bg: "bg-info-subtle border-info"
+	}
+};
+/** Renders the insights panel component. */
+function InsightsPanel({ insights, stats, detectionTypes, onDetectionTypeToggle, detectionConfig, onDetectionConfigChange, onDismiss, onInsightClick, onStatClick, header, actions, labels: customLabels, className }) {
+	var _detectionConfig$days, _detectionConfig$zSco;
+	const labels = require_text_truncate._objectSpread2(require_text_truncate._objectSpread2({}, defaultLabels$16), customLabels);
+	const [showDismissed, setShowDismissed] = react.useState(false);
+	const visibleInsights = showDismissed ? insights : insights.filter((i) => !i.dismissed);
+	const hasStats = stats && stats.length > 0;
+	const hasDetection = detectionTypes && detectionTypes.length > 0 || detectionConfig != null;
+	const isEmpty = visibleInsights.length === 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: require_text_truncate.cn("gap-group flex flex-col", className),
+		"data-opt-id": "HCYZV",
+		"data-opt-slug": "insights-panel.InsightsPanel",
+		children: [
+			header || actions ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex items-center justify-between",
+				children: [header && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: header }), actions && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "gap-element flex items-center",
+					children: actions
+				})]
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex items-center justify-between",
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
 					className: "text-text-primary text-lg font-semibold",
 					children: labels.title
@@ -4408,17 +4867,17 @@ function ExportButton({ data, columns, fileName = "export", formats = ["csv", "j
 			})
 		})]
 	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_key_pad_menu.DropdownMenu, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_text_truncate.DropdownMenu, {
 		"data-opt-id": "MGP2B",
 		"data-opt-slug": "export-button.ExportButton",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_key_pad_menu.DropdownTrigger, {
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_text_truncate.DropdownTrigger, {
 			className: require_text_truncate.cn("inline-flex items-center justify-center rounded-lg font-medium transition-colors", "border-border bg-surface text-text-primary hover:bg-bg-subtle active:bg-bg-muted border", "h-8 gap-1.5 px-3 text-xs", className),
 			"aria-label": labels.export,
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				"aria-hidden": "true",
 				children: "⬇"
 			}), labels.export]
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.DropdownContent, { children: formats.map((fmt, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [i > 0 && fmt === "pdf" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.DropdownSeparator, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.DropdownItem, {
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownContent, { children: formats.map((fmt, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [i > 0 && fmt === "pdf" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownSeparator, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownItem, {
 			onClick: () => handleExport(fmt),
 			children: formatLabels[fmt]
 		})] }, fmt)) })]
@@ -4565,28 +5024,6 @@ function matchesQueryObject(query, row, options = {}) {
 	return matchesQuery(query, read, searchable);
 }
 //#endregion
-//#region src/lib/use-media-query.ts
-/**
-* Whether a media query matches, kept in sync with the browser.
-*
-* `useSyncExternalStore` rather than an effect: a layout that switches on width
-* must not render the wrong shape for a frame first. The server snapshot is the
-* caller's `serverFallback`, because the server does not know the viewport and
-* guessing "narrow" collapses a wide layout on every first paint.
-*
-* Internal. Exported from `lib` for the components in this package, not from
-* the package barrel — a hook that answers "is this viewport wide" invites
-* layout decisions that belong in CSS.
-*/
-function useMediaQuery(query, serverFallback = false) {
-	return (0, react.useSyncExternalStore)((onChange) => {
-		if (typeof window === "undefined") return () => {};
-		const list = window.matchMedia(query);
-		list.addEventListener("change", onChange);
-		return () => list.removeEventListener("change", onChange);
-	}, () => typeof window === "undefined" ? serverFallback : window.matchMedia(query).matches, () => serverFallback);
-}
-//#endregion
 //#region src/shells/inspector-layout.tsx
 /** Tailwind needs whole class names, so the queries and widths are literals. */
 const breakpointQuery = {
@@ -4635,7 +5072,7 @@ const flyoutSize = {
 * ```
 */
 function InspectorLayout({ children, inspector, open, onClose, title, description, actions, footer, breakpoint = "xl", width = "md", labels, className }) {
-	const canPush = useMediaQuery(breakpointQuery[breakpoint], true);
+	const canPush = require_field_sidebar.useMediaQuery(breakpointQuery[breakpoint], true);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: require_text_truncate.cn("flex min-w-0 items-stretch gap-group", className),
 		"data-opt-id": "MN44T",
@@ -4859,13 +5296,13 @@ function CatalogRowActions({ item, actions, visibleCount = 2, labels }) {
 			size: "sm",
 			onClick: () => action.onSelect(item),
 			children: [action.icon, action.label]
-		}, action.id)), overflow.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_key_pad_menu.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.DropdownTrigger, {
+		}, action.id)), overflow.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_text_truncate.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownTrigger, {
 			"aria-label": (_labels$moreActions = labels === null || labels === void 0 ? void 0 : labels.moreActions) !== null && _labels$moreActions !== void 0 ? _labels$moreActions : "더 보기",
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.MoreHorizontal, {
 				"aria-hidden": "true",
 				className: "size-4"
 			})
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.DropdownContent, { children: overflow.map((action) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.DropdownItem, {
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownContent, { children: overflow.map((action) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownItem, {
 			onClick: () => action.onSelect(item),
 			children: action.label
 		}, action.id)) })] })]
@@ -5122,853 +5559,6 @@ function ComparisonSelector({ segments, valueA, valueB, onChangeA, onChangeB, va
 	});
 }
 ComparisonSelector.displayName = "ComparisonSelector";
-const THEME_REGISTRY = {
-	default: {
-		id: "default",
-		label: "Default",
-		description: "Blue accent, balanced radius & shadow",
-		palette: {
-			seed: "#2563eb",
-			harmony: "split-complementary",
-			radiusScale: "medium",
-			shadowIntensity: "subtle",
-			neutralTemperature: "cool"
-		},
-		switcherSwatches: [
-			"hsl(221 83% 53%)",
-			"hsl(142 71% 45%)",
-			"hsl(38 92% 50%)"
-		]
-	},
-	minimal: {
-		id: "minimal",
-		label: "Minimal",
-		description: "Monochrome, no shadow, sharp edges",
-		palette: {
-			seed: "#333333",
-			harmony: "analogous",
-			radiusScale: "sharp",
-			shadowIntensity: "none",
-			neutralTemperature: "cool"
-		},
-		switcherSwatches: [
-			"hsl(0 0% 20%)",
-			"hsl(0 0% 45%)",
-			"hsl(0 0% 70%)"
-		]
-	},
-	natural: {
-		id: "natural",
-		label: "Natural",
-		description: "Always light — sage accent, warm cream",
-		forceLightOnly: true,
-		palette: {
-			seed: "#5a9376",
-			harmony: "complementary",
-			radiusScale: "medium",
-			shadowIntensity: "subtle",
-			neutralTemperature: "warm"
-		},
-		switcherSwatches: [
-			"hsl(155 38% 45%)",
-			"hsl(25 65% 55%)",
-			"hsl(45 75% 50%)"
-		]
-	},
-	pro: {
-		id: "pro",
-		label: "Pro",
-		description: "Neon blue accent, mono headings, ultra-dense",
-		palette: {
-			seed: "#0080ff",
-			harmony: "tetradic",
-			radiusScale: "sharp",
-			shadowIntensity: "subtle",
-			neutralTemperature: "cool"
-		},
-		switcherSwatches: [
-			"hsl(210 100% 55%)",
-			"hsl(170 90% 48%)",
-			"hsl(290 85% 60%)"
-		]
-	},
-	"mono-dark": {
-		id: "mono-dark",
-		label: "Mono Dark",
-		description: "OLED-friendly black, neon cyan accent, mono headings",
-		palette: {
-			seed: "#00d4ff",
-			harmony: "tetradic",
-			radiusScale: "sharp",
-			shadowIntensity: "subtle",
-			neutralTemperature: "cool"
-		},
-		switcherSwatches: [
-			"hsl(190 100% 50%)",
-			"hsl(0 0% 8%)",
-			"hsl(280 90% 65%)"
-		]
-	}
-};
-/** All registered preset ids in declaration order. */
-const THEME_PRESET_IDS = Object.keys(THEME_REGISTRY);
-/** Look up a descriptor by id. Returns `undefined` for unknown ids. */
-function getThemeDescriptor(id) {
-	return THEME_REGISTRY[id];
-}
-/** Type guard for a known preset id. */
-function isThemePresetId(id) {
-	return id in THEME_REGISTRY;
-}
-/** Preset ids that suppress dark mode generation. */
-const FORCE_LIGHT_PRESET_IDS = new Set(THEME_PRESET_IDS.filter((id) => THEME_REGISTRY[id].forceLightOnly));
-/**
-* Map from removed preset ids to the closest surviving preset. Boot script and
-* `readStoredTheme` consult this so users with persisted `corporate`/`playful`
-* values silently land on a working preset on next page load instead of
-* showing the global default fallback for an unknown id.
-*
-* Keep this around indefinitely — localStorage values are forever and the
-* cost of two extra entries is negligible.
-*/
-const DEPRECATED_PRESET_MIGRATIONS = Object.freeze({
-	corporate: "default",
-	playful: "default"
-});
-/**
-* Resolve a possibly-deprecated preset id to a registered one. Returns the
-* input unchanged when it is already valid; returns the migration target when
-* it is a known deprecated id; returns `null` when the id is unknown
-* altogether (caller should fall back to its default).
-*/
-function migrateDeprecatedPresetId(id) {
-	if (!id) return null;
-	if (isThemePresetId(id)) return id;
-	if (id in DEPRECATED_PRESET_MIGRATIONS) return DEPRECATED_PRESET_MIGRATIONS[id];
-	return null;
-}
-//#endregion
-//#region src/lib/theme/theme-types.ts
-/**
-* Author canonical theme overrides with token-name autocomplete.
-* ThemeOverrides remains broad for backward compatibility with older custom
-* variables; new themes should use this helper as the governed entry point.
-*/
-function defineThemeOverrides(overrides) {
-	return overrides;
-}
-/** Construct a `PresetThemeSpec` — convenience for the common case. */
-function presetTheme(preset, overrides) {
-	return overrides ? {
-		kind: "preset",
-		preset,
-		overrides
-	} : {
-		kind: "preset",
-		preset
-	};
-}
-/** Construct a `GeneratedThemeSpec` from an inline `PaletteConfig`. */
-function generatedTheme(palette, options) {
-	return require_text_truncate._objectSpread2({
-		kind: "generated",
-		palette
-	}, options);
-}
-/** True when `spec` references a registered preset id. */
-function isPresetSpec(spec) {
-	return spec.kind === "preset";
-}
-/** True when `spec` carries an inline `PaletteConfig`. */
-function isGeneratedSpec(spec) {
-	return spec.kind === "generated";
-}
-/** True when `spec` wraps a fully-formed `ThemeDescriptor`. */
-function isDescriptorSpec(spec) {
-	return spec.kind === "descriptor";
-}
-//#endregion
-//#region src/lib/theme/theme-serialize.ts
-/**
-* theme-serialize.ts
-*
-* Pure helpers that turn a `ThemeSpec` into the artifacts the runtime needs:
-* resolved descriptor + mode, computed token maps for generated palettes, and
-* `<style>` CSS strings ready to be injected into `<head>`.
-*
-* Kept side-effect free so the boot script and the provider can share the
-* same logic without dragging React into the client bundle's critical path.
-*/
-/** Element id used for the global generated theme style tag. */
-const GLOBAL_THEME_STYLE_ID = "opt-global-theme";
-/** localStorage key for the persisted ThemeSpec (generated mode). */
-const THEME_SPEC_STORAGE_KEY = "opt-theme-spec";
-/**
-* localStorage key for the cached, pre-serialized token maps that match the
-* spec under `THEME_SPEC_STORAGE_KEY`. The boot script reads this directly so
-* it can inline tokens without invoking opt-palette at startup.
-*/
-const THEME_TOKENS_STORAGE_KEY = "opt-theme-tokens";
-/** Stable id used for unnamed generated themes. */
-const GENERATED_THEME_ID_DEFAULT = "generated";
-/** Cached token maps keyed by spec hash. Lazy-built per process. */
-const generatedCache = /* @__PURE__ */ new Map();
-/** Build a stable cache key for a `PaletteConfig`. */
-function paletteCacheKey(config) {
-	return JSON.stringify(config);
-}
-/** Run opt-palette with caching. */
-function generatePaletteCached(config) {
-	const key = paletteCacheKey(config);
-	let cached = generatedCache.get(key);
-	if (!cached) {
-		cached = (0, _reopt_ai_opt_palette.generatePalette)(config);
-		generatedCache.set(key, cached);
-	}
-	return cached;
-}
-/** Apply sparse override maps onto a base token record. */
-function applyOverrides(base, overrides, mode) {
-	if (!overrides) return base;
-	const merged = require_text_truncate._objectSpread2({}, base);
-	if (overrides.shared) Object.assign(merged, overrides.shared);
-	const modeOverrides = mode === "light" ? overrides.light : overrides.dark;
-	if (modeOverrides) Object.assign(merged, modeOverrides);
-	return merged;
-}
-/**
-* Stable id used in `<html data-theme>` and the `<style>` selector.
-* - preset → the preset id (force-light) or `${id}` / `${id}-dark`
-* - generated → `spec.id ?? "generated"` with `-dark` suffix when applicable
-* - descriptor → `descriptor.id` with same suffix logic
-*/
-function getCompoundIdForSpec(spec, resolvedMode, forceLightOnly) {
-	const baseId = baseIdFor(spec);
-	if (forceLightOnly) return baseId;
-	return resolvedMode === "dark" ? `${baseId}-dark` : baseId;
-}
-function baseIdFor(spec) {
-	var _spec$id;
-	if (isPresetSpec(spec)) return spec.preset;
-	if (isDescriptorSpec(spec)) return spec.descriptor.id;
-	return (_spec$id = spec.id) !== null && _spec$id !== void 0 ? _spec$id : GENERATED_THEME_ID_DEFAULT;
-}
-/** Whether the given spec emits dark variants at all. */
-function isForceLightSpec(spec) {
-	if (isPresetSpec(spec)) {
-		const desc = THEME_REGISTRY[spec.preset];
-		return (desc === null || desc === void 0 ? void 0 : desc.forceLightOnly) === true;
-	}
-	if (isDescriptorSpec(spec)) return spec.descriptor.forceLightOnly === true;
-	return spec.forceLightOnly === true;
-}
-/**
-* Compute the inline tokens for a `GeneratedThemeSpec` or
-* `DescriptorThemeSpec` whose descriptor carries a `palette`. Returns `null`
-* for preset specs (their tokens live in the static CSS files).
-*/
-function computeGeneratedTokens(spec) {
-	if (isPresetSpec(spec)) return null;
-	let palette;
-	let overrides;
-	let id;
-	let forceLight;
-	if (isGeneratedSpec(spec)) {
-		var _spec$id2;
-		palette = spec.palette;
-		overrides = spec.overrides;
-		id = (_spec$id2 = spec.id) !== null && _spec$id2 !== void 0 ? _spec$id2 : GENERATED_THEME_ID_DEFAULT;
-		forceLight = spec.forceLightOnly === true;
-	} else {
-		palette = spec.descriptor.palette;
-		overrides = spec.overrides;
-		id = spec.descriptor.id;
-		forceLight = spec.descriptor.forceLightOnly === true;
-	}
-	if (!palette) return null;
-	const generated = generatePaletteCached(palette);
-	return {
-		id,
-		light: applyOverrides(generated.light, overrides, "light"),
-		dark: forceLight ? null : applyOverrides(generated.dark, overrides, "dark")
-	};
-}
-/**
-* Serialize a token record into a CSS rule body — `--name:value;...` — without
-* surrounding selector or braces. Values are not escaped; callers are
-* responsible for trusted input. Boot script and provider both rely on this
-* shape.
-*/
-function serializeTokenBody(tokens) {
-	return Object.entries(tokens).map(([k, v]) => `${k}:${v}`).join(";");
-}
-/**
-* Build a CSS rule scoped to `[data-theme="<id>"]`.
-*/
-function serializeThemeRule(themeId, tokens) {
-	return `[data-theme="${themeId}"]{${serializeTokenBody(tokens)}}`;
-}
-/**
-* Build the full CSS for a generated theme style tag — covers light + dark
-* selectors based on the computed tokens. Caller chooses the id used in
-* the selector (typically the spec base id).
-*/
-function serializeGeneratedTheme(tokens) {
-	const { id, light, dark } = tokens;
-	let css = serializeThemeRule(id, light);
-	if (dark) css += serializeThemeRule(`${id}-dark`, dark);
-	return css;
-}
-/**
-* Resolve a spec into its descriptor counterpart. Preset specs map to
-* `THEME_REGISTRY[preset]`. Generated specs are wrapped into a synthetic
-* descriptor so callers can treat them uniformly.
-*/
-function resolveDescriptor(spec) {
-	if (isPresetSpec(spec)) {
-		const desc = THEME_REGISTRY[spec.preset];
-		if (!desc) throw new Error(`[opt-ui] Unknown theme preset id: "${spec.preset}". Registered ids: ${Object.keys(THEME_REGISTRY).join(", ")}`);
-		return desc;
-	}
-	if (isDescriptorSpec(spec)) return spec.descriptor;
-	return generatedSpecToDescriptor(spec);
-}
-function generatedSpecToDescriptor(spec) {
-	var _spec$id3, _spec$label;
-	return {
-		id: (_spec$id3 = spec.id) !== null && _spec$id3 !== void 0 ? _spec$id3 : GENERATED_THEME_ID_DEFAULT,
-		label: (_spec$label = spec.label) !== null && _spec$label !== void 0 ? _spec$label : "Custom",
-		description: "Generated theme",
-		palette: spec.palette,
-		forceLightOnly: spec.forceLightOnly
-	};
-}
-/**
-* Validate a `ThemeSpec` parsed from localStorage. Returns the spec on
-* success or `null` if any required field is missing or the preset id is
-* unknown. Defensive parsing — never throws.
-*/
-function safeParseStoredSpec(json) {
-	if (!json) return null;
-	try {
-		const parsed = JSON.parse(json);
-		if (!parsed || typeof parsed !== "object" || !("kind" in parsed)) return null;
-		if (parsed.kind === "preset") {
-			const preset = parsed.preset;
-			if (typeof preset !== "string" || !isThemePresetId(preset)) return null;
-			return {
-				kind: "preset",
-				preset
-			};
-		}
-		if (parsed.kind === "generated") {
-			const palette = parsed.palette;
-			if (!isPaletteConfig(palette)) return null;
-			return {
-				kind: "generated",
-				palette,
-				id: typeof parsed.id === "string" ? parsed.id : void 0,
-				label: typeof parsed.label === "string" ? parsed.label : void 0,
-				forceLightOnly: parsed.forceLightOnly === true,
-				overrides: isObjectMap(parsed.overrides) ? parsed.overrides : void 0
-			};
-		}
-		return null;
-	} catch (_unused) {
-		return null;
-	}
-}
-function isObjectMap(value) {
-	return value !== null && typeof value === "object" && !Array.isArray(value);
-}
-function isPaletteConfig(value) {
-	if (!isObjectMap(value)) return false;
-	const v = value;
-	return typeof v.seed === "string" && typeof v.harmony === "string" && typeof v.radiusScale === "string" && typeof v.shadowIntensity === "string" && typeof v.neutralTemperature === "string";
-}
-/**
-* Parse the cached token payload from localStorage. Returns `null` on any
-* shape mismatch — caller will recompute from the spec.
-*/
-function safeParseStoredTokens(json) {
-	if (!json) return null;
-	try {
-		const parsed = JSON.parse(json);
-		if (!parsed || typeof parsed.id !== "string" || !isObjectMap(parsed.light)) return null;
-		return {
-			id: parsed.id,
-			light: parsed.light,
-			dark: isObjectMap(parsed.dark) ? parsed.dark : void 0
-		};
-	} catch (_unused2) {
-		return null;
-	}
-}
-/** Build the storage payload that pairs with `opt-theme-spec`. */
-function buildTokenCache(tokens) {
-	var _tokens$dark;
-	return {
-		id: tokens.id,
-		light: tokens.light,
-		dark: (_tokens$dark = tokens.dark) !== null && _tokens$dark !== void 0 ? _tokens$dark : void 0
-	};
-}
-//#endregion
-//#region src/lib/theme/theme-resolution.ts
-/**
-* Registered preset id list. Preferred for runtime iteration.
-* @deprecated Prefer `THEME_PRESET_IDS` from `./presets`.
-*/
-const THEME_PRESET_VALUES = THEME_PRESET_IDS;
-const THEME_MODE_VALUES = [
-	"light",
-	"dark",
-	"system"
-];
-const LEGACY_THEME_STORAGE_KEY = "opt-theme";
-const THEME_PRESET_STORAGE_KEY = "opt-preset";
-const THEME_MODE_STORAGE_KEY = "opt-mode";
-const DARK_MQ = "(prefers-color-scheme: dark)";
-/**
-* Presets that force light mode regardless of system dark/light preference.
-* Mirrors `FORCE_LIGHT_PRESET_IDS` from `./presets` — kept as alias for
-* existing imports.
-*/
-const FORCE_LIGHT_PRESETS = FORCE_LIGHT_PRESET_IDS;
-/** All valid compound theme names. Useful for static enumeration. */
-const ALL_COMPOUND_THEMES = THEME_PRESET_IDS.flatMap((id) => FORCE_LIGHT_PRESET_IDS.has(id) ? [id] : [id, `${id}-dark`]);
-function hasStorageMutation(storage) {
-	return typeof storage.setItem === "function" && typeof storage.removeItem === "function";
-}
-/** Handles is theme mode. */
-function isThemeMode(value) {
-	return typeof value === "string" && THEME_MODE_VALUES.includes(value);
-}
-/** Compute compound theme name from preset + resolved mode. */
-function getCompoundTheme(preset, resolvedMode) {
-	if (FORCE_LIGHT_PRESETS.has(preset)) return preset;
-	return resolvedMode === "dark" ? `${preset}-dark` : preset;
-}
-/** Handles resolve theme mode. */
-function resolveThemeMode(preset, mode, systemDark) {
-	if (FORCE_LIGHT_PRESETS.has(preset)) return "light";
-	if (mode === "system") return systemDark ? "dark" : "light";
-	return mode;
-}
-/** Handles read stored theme. */
-function readStoredTheme(storage, defaultPreset, defaultMode, options = {}) {
-	const legacy = storage.getItem(LEGACY_THEME_STORAGE_KEY);
-	const storedPreset = storage.getItem(THEME_PRESET_STORAGE_KEY);
-	const storedMode = storage.getItem(THEME_MODE_STORAGE_KEY);
-	let preset = defaultPreset;
-	if (typeof legacy === "string") {
-		const migratedLegacy = migrateDeprecatedPresetId(legacy);
-		if (migratedLegacy) {
-			if (options.migrateLegacy && hasStorageMutation(storage)) {
-				storage.setItem(THEME_PRESET_STORAGE_KEY, migratedLegacy);
-				storage.removeItem(LEGACY_THEME_STORAGE_KEY);
-			}
-			preset = migratedLegacy;
-		}
-	} else if (typeof storedPreset === "string") {
-		const migrated = migrateDeprecatedPresetId(storedPreset);
-		if (migrated) {
-			preset = migrated;
-			if (hasStorageMutation(storage) && migrated !== storedPreset && storedPreset in DEPRECATED_PRESET_MIGRATIONS) storage.setItem(THEME_PRESET_STORAGE_KEY, migrated);
-		}
-	}
-	const mode = isThemeMode(storedMode) ? storedMode : defaultMode;
-	return {
-		preset,
-		mode
-	};
-}
-/** Normalize a mode against an optional allowed-mode list. */
-function coerceThemeMode(mode, allowedModes, fallback = "system") {
-	var _allowedModes$;
-	if (!allowedModes || allowedModes.length === 0) return mode;
-	if (allowedModes.includes(mode)) return mode;
-	if (allowedModes.includes(fallback)) return fallback;
-	return (_allowedModes$ = allowedModes[0]) !== null && _allowedModes$ !== void 0 ? _allowedModes$ : fallback;
-}
-/**
-* Build the inline `<head>` boot script that paints the correct theme before
-* React mounts. Two paths:
-*
-* 1. **Generated** — when both `opt-theme-spec` (kind: "generated") and
-*    `opt-theme-tokens` are present and well-formed, a `<style id="…">` tag
-*    is inserted with the cached tokens and `<html data-theme>` is set to the
-*    generated id (with optional `-dark` suffix). This bypasses opt-palette
-*    at startup so first paint is instant.
-* 2. **Preset (legacy)** — falls through to the existing preset selector,
-*    including legacy `opt-theme` → `opt-preset` migration.
-*
-* Returned as a single minified line; intended for `dangerouslySetInnerHTML`.
-*/
-function createThemeBootScript(defaultPreset = "default", defaultMode = "system", options = {}) {
-	var _options$allowedModes, _allowedModes$2;
-	const presetValues = JSON.stringify(THEME_PRESET_VALUES);
-	const modeValues = JSON.stringify(THEME_MODE_VALUES);
-	const allowedModes = ((_options$allowedModes = options.allowedModes) === null || _options$allowedModes === void 0 ? void 0 : _options$allowedModes.length) ? options.allowedModes : THEME_MODE_VALUES;
-	const allowedModeValues = JSON.stringify(allowedModes);
-	const forceLightPresets = JSON.stringify(Array.from(FORCE_LIGHT_PRESETS));
-	const deprecatedMap = JSON.stringify(DEPRECATED_PRESET_MIGRATIONS);
-	const lockedPreset = options.lockedPreset;
-	const defaultPresetLiteral = JSON.stringify(lockedPreset !== null && lockedPreset !== void 0 ? lockedPreset : defaultPreset);
-	const defaultModeLiteral = JSON.stringify(coerceThemeMode(defaultMode, allowedModes, (_allowedModes$2 = allowedModes[0]) !== null && _allowedModes$2 !== void 0 ? _allowedModes$2 : "system"));
-	const lockedPresetLiteral = JSON.stringify(lockedPreset !== null && lockedPreset !== void 0 ? lockedPreset : null);
-	const styleId = JSON.stringify(GLOBAL_THEME_STYLE_ID);
-	const specKey = JSON.stringify(THEME_SPEC_STORAGE_KEY);
-	const tokensKey = JSON.stringify(THEME_TOKENS_STORAGE_KEY);
-	const presetKey = JSON.stringify(THEME_PRESET_STORAGE_KEY);
-	const modeKey = JSON.stringify(THEME_MODE_STORAGE_KEY);
-	const legacyKey = JSON.stringify(LEGACY_THEME_STORAGE_KEY);
-	const darkMq = JSON.stringify(DARK_MQ);
-	return `
-try {
-  var pv=${presetValues},mv=${modeValues},am=${allowedModeValues},fp=${forceLightPresets},dm=${deprecatedMap},lk=${lockedPresetLiteral};
-  function mp(v){if(typeof v!=="string")return null;if(pv.indexOf(v)>=0)return v;return Object.prototype.hasOwnProperty.call(dm,v)?dm[v]:null;}
-  var p=${defaultPresetLiteral};
-  if(!lk){
-    var lp=localStorage.getItem(${legacyKey}),sp=localStorage.getItem(${presetKey});
-    var lpm=mp(lp),spm=mp(sp);
-    p=lpm||spm||${defaultPresetLiteral};
-    if(lpm){localStorage.setItem(${presetKey},lpm);localStorage.removeItem(${legacyKey});}
-    else if(sp&&spm&&sp!==spm){localStorage.setItem(${presetKey},spm);}
-  }
-  var sm=localStorage.getItem(${modeKey});
-  var m=(typeof sm==="string"&&mv.indexOf(sm)>=0&&am.indexOf(sm)>=0)?sm:${defaultModeLiteral};
-  var spec=null,tk=null;
-  if(!lk){try{var sj=localStorage.getItem(${specKey});if(sj)spec=JSON.parse(sj);}catch(e){}}
-  if(!lk){try{var tj=localStorage.getItem(${tokensKey});if(tj)tk=JSON.parse(tj);}catch(e){}}
-  if(!lk&&spec&&spec.kind==="generated"&&tk&&typeof tk.id==="string"&&tk.light&&typeof tk.light==="object"){
-    var fld=spec.forceLightOnly===true;
-    var dk=!fld&&(m==="dark"||(m==="system"&&matchMedia(${darkMq}).matches));
-    var tt=(dk&&tk.dark)?tk.dark:tk.light;
-    var cid=(dk&&tk.dark)?(tk.id+"-dark"):tk.id;
-    var css="";
-    for(var k in tt){if(Object.prototype.hasOwnProperty.call(tt,k))css+=k+":"+tt[k]+";"}
-    var st=document.getElementById(${styleId});
-    if(!st){st=document.createElement("style");st.id=${styleId};document.head.appendChild(st);}
-    st.textContent='[data-theme="'+cid+'"]{'+css+'}';
-    document.documentElement.setAttribute("data-theme",cid);
-  } else {
-    var d=fp.indexOf(p)<0&&(m==="dark"||(m==="system"&&matchMedia(${darkMq}).matches));
-    document.documentElement.setAttribute("data-theme",d?p+"-dark":p);
-  }
-} catch(e){}`.replace(/\n\s*/g, "");
-}
-//#endregion
-//#region src/lib/theme/theme-controller-context.tsx
-const OptThemeControllerContext = (0, react.createContext)(null);
-/**
-* Reads the controller exposed by the nearest `OptThemeProvider`. Returns
-* `null` when used outside a provider — callers should treat that as "no
-* promotion available" and behave as if scope === "override".
-*/
-function useOptThemeController() {
-	return (0, react.useContext)(OptThemeControllerContext);
-}
-//#endregion
-//#region src/lib/theme/theme-provider.tsx
-const THEME_STORAGE_KEYS = /* @__PURE__ */ new Set([
-	LEGACY_THEME_STORAGE_KEY,
-	THEME_PRESET_STORAGE_KEY,
-	THEME_MODE_STORAGE_KEY,
-	THEME_SPEC_STORAGE_KEY,
-	THEME_TOKENS_STORAGE_KEY
-]);
-function getSystemDark() {
-	if (typeof window === "undefined") return false;
-	return window.matchMedia(DARK_MQ).matches;
-}
-function subscribeSystemDark(cb) {
-	if (typeof window === "undefined") return () => {};
-	const mql = window.matchMedia(DARK_MQ);
-	mql.addEventListener("change", cb);
-	return () => mql.removeEventListener("change", cb);
-}
-/**
-* Read the persisted ThemeSpec, preferring a generated spec when present.
-* Falls back to the legacy preset path otherwise. Does not touch localStorage
-* apart from the legacy migration handled by `readStoredTheme`.
-*/
-function readStoredSpec(defaultPreset, defaultMode, options = {}) {
-	const generated = safeParseStoredSpec(window.localStorage.getItem(THEME_SPEC_STORAGE_KEY));
-	const { preset, mode } = readStoredTheme(window.localStorage, defaultPreset, defaultMode, options);
-	if (generated && generated.kind === "generated") return {
-		spec: generated,
-		mode,
-		presetShadow: preset
-	};
-	return {
-		spec: presetTheme(preset),
-		mode,
-		presetShadow: preset
-	};
-}
-function persistSpec(spec) {
-	if (isPresetSpec(spec)) {
-		window.localStorage.setItem(THEME_PRESET_STORAGE_KEY, spec.preset);
-		window.localStorage.removeItem(THEME_SPEC_STORAGE_KEY);
-		window.localStorage.removeItem(THEME_TOKENS_STORAGE_KEY);
-		return;
-	}
-	if (isGeneratedSpec(spec)) {
-		const tokens = computeGeneratedTokens(spec);
-		window.localStorage.setItem(THEME_SPEC_STORAGE_KEY, JSON.stringify(spec));
-		if (tokens) window.localStorage.setItem(THEME_TOKENS_STORAGE_KEY, JSON.stringify(buildTokenCache(tokens)));
-		else window.localStorage.removeItem(THEME_TOKENS_STORAGE_KEY);
-		return;
-	}
-	const descriptor = spec.descriptor;
-	if (isThemePresetId(descriptor.id) && !descriptor.palette) {
-		window.localStorage.setItem(THEME_PRESET_STORAGE_KEY, descriptor.id);
-		window.localStorage.removeItem(THEME_SPEC_STORAGE_KEY);
-		window.localStorage.removeItem(THEME_TOKENS_STORAGE_KEY);
-		return;
-	}
-	if (descriptor.palette) persistSpec({
-		kind: "generated",
-		id: descriptor.id,
-		label: descriptor.label,
-		palette: descriptor.palette,
-		forceLightOnly: descriptor.forceLightOnly
-	});
-}
-function upsertGlobalStyle(css) {
-	if (typeof document === "undefined") return;
-	let node = document.getElementById(GLOBAL_THEME_STYLE_ID);
-	if (!node) {
-		node = document.createElement("style");
-		node.id = GLOBAL_THEME_STYLE_ID;
-		document.head.appendChild(node);
-	}
-	if (node.textContent !== css) node.textContent = css;
-}
-function removeGlobalStyle() {
-	var _document$getElementB;
-	if (typeof document === "undefined") return;
-	(_document$getElementB = document.getElementById("opt-global-theme")) === null || _document$getElementB === void 0 || _document$getElementB.remove();
-}
-const ThemeContext = (0, react.createContext)(void 0);
-/** Renders the opt theme provider component. */
-function OptThemeProvider({ children, defaultTheme, controlledTheme, defaultPreset = "default", defaultMode = "system", lockedPreset, allowedModes, allowThemePromotion = true }) {
-	var _allowedModes$, _ref, _effectiveStackTop$sp;
-	const normalizedDefaultMode = coerceThemeMode(defaultMode, allowedModes, (_allowedModes$ = allowedModes === null || allowedModes === void 0 ? void 0 : allowedModes[0]) !== null && _allowedModes$ !== void 0 ? _allowedModes$ : "system");
-	const initialSpec = (_ref = controlledTheme !== null && controlledTheme !== void 0 ? controlledTheme : lockedPreset ? presetTheme(lockedPreset) : defaultTheme) !== null && _ref !== void 0 ? _ref : presetTheme(defaultPreset);
-	const initialPresetShadow = isPresetSpec(initialSpec) ? initialSpec.preset : lockedPreset !== null && lockedPreset !== void 0 ? lockedPreset : defaultPreset;
-	const [theme, setThemeState] = (0, react.useState)(initialSpec);
-	const [presetShadow, setPresetShadow] = (0, react.useState)(initialPresetShadow);
-	const [mode, setModeState] = (0, react.useState)(normalizedDefaultMode);
-	/**
-	* Transient theme override stack — descendants (typically harnesses in
-	* promote-global mode) push specs that take priority over `controlledTheme`
-	* and persisted state. The stack is intentionally kept out of localStorage.
-	*/
-	const [stack, setStack] = (0, react.useState)([]);
-	const isControlled = controlledTheme !== void 0;
-	const isLocked = !isControlled && lockedPreset !== void 0;
-	(0, react.useEffect)(() => {
-		if (!isControlled) return;
-		setThemeState(controlledTheme);
-		if (isPresetSpec(controlledTheme)) setPresetShadow(controlledTheme.preset);
-	}, [controlledTheme, isControlled]);
-	(0, react.useEffect)(() => {
-		if (isControlled) return;
-		if (isLocked) {
-			const locked = lockedPreset !== null && lockedPreset !== void 0 ? lockedPreset : defaultPreset;
-			const { mode: storedMode } = readStoredTheme(window.localStorage, locked, normalizedDefaultMode);
-			const nextMode = coerceThemeMode(storedMode, allowedModes, normalizedDefaultMode);
-			const nextSpec = presetTheme(locked);
-			setThemeState((prev) => themeEqual(prev, nextSpec) ? prev : nextSpec);
-			setPresetShadow((prev) => prev === locked ? prev : locked);
-			setModeState((prev) => prev === nextMode ? prev : nextMode);
-			return;
-		}
-		const next = readStoredSpec(defaultPreset, defaultMode, { migrateLegacy: true });
-		const nextMode = coerceThemeMode(next.mode, allowedModes, normalizedDefaultMode);
-		setThemeState((prev) => themeEqual(prev, next.spec) ? prev : next.spec);
-		setPresetShadow((prev) => prev === next.presetShadow ? prev : next.presetShadow);
-		setModeState((prev) => prev === nextMode ? prev : nextMode);
-	}, [
-		allowedModes,
-		isControlled,
-		isLocked,
-		lockedPreset,
-		normalizedDefaultMode
-	]);
-	(0, react.useEffect)(() => {
-		if (isControlled) return;
-		function handleStorage(event) {
-			if (event.storageArea && event.storageArea !== window.localStorage) return;
-			if (event.key != null && !THEME_STORAGE_KEYS.has(event.key)) return;
-			if (isLocked) {
-				const locked = lockedPreset !== null && lockedPreset !== void 0 ? lockedPreset : defaultPreset;
-				const { mode: storedMode } = readStoredTheme(window.localStorage, locked, normalizedDefaultMode);
-				const nextMode = coerceThemeMode(storedMode, allowedModes, normalizedDefaultMode);
-				const nextSpec = presetTheme(locked);
-				setThemeState((prev) => themeEqual(prev, nextSpec) ? prev : nextSpec);
-				setPresetShadow((prev) => prev === locked ? prev : locked);
-				setModeState((prev) => prev === nextMode ? prev : nextMode);
-				return;
-			}
-			const next = readStoredSpec(defaultPreset, defaultMode, { migrateLegacy: event.key === LEGACY_THEME_STORAGE_KEY });
-			const nextMode = coerceThemeMode(next.mode, allowedModes, normalizedDefaultMode);
-			setThemeState((prev) => themeEqual(prev, next.spec) ? prev : next.spec);
-			setPresetShadow((prev) => prev === next.presetShadow ? prev : next.presetShadow);
-			setModeState((prev) => prev === nextMode ? prev : nextMode);
-		}
-		window.addEventListener("storage", handleStorage);
-		return () => window.removeEventListener("storage", handleStorage);
-	}, [
-		allowedModes,
-		isControlled,
-		isLocked,
-		defaultMode,
-		defaultPreset,
-		lockedPreset,
-		normalizedDefaultMode
-	]);
-	const systemDark = (0, react.useSyncExternalStore)(subscribeSystemDark, getSystemDark, () => false);
-	const stackTop = stack.length > 0 ? stack[stack.length - 1] : null;
-	const effectiveStackTop = allowThemePromotion ? stackTop : null;
-	const isPromoted = effectiveStackTop !== null;
-	const effectiveSpec = (_effectiveStackTop$sp = effectiveStackTop === null || effectiveStackTop === void 0 ? void 0 : effectiveStackTop.spec) !== null && _effectiveStackTop$sp !== void 0 ? _effectiveStackTop$sp : theme;
-	const forceLight = isForceLightSpec(effectiveSpec);
-	const resolvedMode = computeResolvedMode(forceLight, mode, systemDark);
-	const compoundId = getCompoundIdForSpec(effectiveSpec, resolvedMode, forceLight);
-	const [hydrated, setHydrated] = (0, react.useState)(false);
-	(0, react.useEffect)(() => {
-		setHydrated(true);
-	}, []);
-	(0, react.useEffect)(() => {
-		if (!hydrated) return;
-		if (document.documentElement.getAttribute("data-theme") !== compoundId) document.documentElement.setAttribute("data-theme", compoundId);
-	}, [compoundId, hydrated]);
-	(0, react.useEffect)(() => {
-		if (isPresetSpec(effectiveSpec)) {
-			removeGlobalStyle();
-			return;
-		}
-		const tokens = computeGeneratedTokens(effectiveSpec);
-		if (!tokens) {
-			removeGlobalStyle();
-			return;
-		}
-		upsertGlobalStyle(serializeGeneratedTheme(tokens));
-		if (!isControlled && !isPromoted && effectiveSpec === theme) try {
-			window.localStorage.setItem(THEME_TOKENS_STORAGE_KEY, JSON.stringify(buildTokenCache(tokens)));
-		} catch (_unused) {}
-	}, [
-		effectiveSpec,
-		theme,
-		isControlled,
-		isPromoted
-	]);
-	const setTheme = (0, react.useCallback)((next) => {
-		if (isLocked) {
-			if (process.env.NODE_ENV !== "production") console.warn("[OptThemeProvider] setTheme called while lockedPreset is set — ignoring.");
-			return;
-		}
-		if (isControlled) {
-			if (process.env.NODE_ENV !== "production") console.warn("[OptThemeProvider] setTheme called while controlledTheme is set — ignoring.");
-			return;
-		}
-		setThemeState(next);
-		if (isPresetSpec(next)) setPresetShadow(next.preset);
-		try {
-			persistSpec(next);
-		} catch (_unused2) {}
-	}, [isControlled, isLocked]);
-	const setPreset = (0, react.useCallback)((p) => {
-		setTheme(presetTheme(p));
-	}, [setTheme]);
-	const setMode = (0, react.useCallback)((m) => {
-		const nextMode = coerceThemeMode(m, allowedModes, normalizedDefaultMode);
-		setModeState(nextMode);
-		if (!isControlled) try {
-			window.localStorage.setItem(THEME_MODE_STORAGE_KEY, nextMode);
-		} catch (_unused3) {}
-	}, [
-		allowedModes,
-		isControlled,
-		normalizedDefaultMode
-	]);
-	const controller = (0, react.useMemo)(() => ({
-		pushTheme(id, spec) {
-			if (!allowThemePromotion) return;
-			setStack((prev) => {
-				return [...prev.filter((entry) => entry.id !== id), {
-					id,
-					spec
-				}];
-			});
-		},
-		popTheme(id) {
-			if (!allowThemePromotion) return;
-			setStack((prev) => prev.filter((entry) => entry.id !== id));
-		}
-	}), [allowThemePromotion]);
-	const value = (0, react.useMemo)(() => ({
-		theme: effectiveSpec,
-		setTheme,
-		preset: presetShadow,
-		setPreset,
-		mode,
-		setMode,
-		resolvedMode,
-		isControlled,
-		isGenerated: !isPresetSpec(effectiveSpec),
-		isPromoted
-	}), [
-		effectiveSpec,
-		setTheme,
-		presetShadow,
-		setPreset,
-		mode,
-		setMode,
-		resolvedMode,
-		isControlled,
-		isPromoted
-	]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ThemeContext.Provider, {
-		value,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OptThemeControllerContext.Provider, {
-			value: controller,
-			children
-		})
-	});
-}
-/** Provides opt theme. */
-function useOptTheme() {
-	const ctx = (0, react.useContext)(ThemeContext);
-	if (!ctx) throw new Error("useOptTheme must be used within OptThemeProvider");
-	return ctx;
-}
-/** Reads opt theme context when present without requiring a provider. */
-function useOptionalOptTheme() {
-	return (0, react.useContext)(ThemeContext);
-}
-function computeResolvedMode(forceLight, mode, systemDark) {
-	if (forceLight) return "light";
-	if (mode === "system") return systemDark ? "dark" : "light";
-	return mode;
-}
-function themeEqual(a, b) {
-	if (a === b) return true;
-	if (a.kind !== b.kind) return false;
-	if (a.kind === "preset" && b.kind === "preset") return a.preset === b.preset && overridesEqual(a.overrides, b.overrides);
-	if (a.kind === "generated" && b.kind === "generated") return a.id === b.id && a.label === b.label && a.forceLightOnly === b.forceLightOnly && JSON.stringify(a.palette) === JSON.stringify(b.palette) && overridesEqual(a.overrides, b.overrides);
-	if (a.kind === "descriptor" && b.kind === "descriptor") return a.descriptor === b.descriptor && overridesEqual(a.overrides, b.overrides);
-	return false;
-}
-function overridesEqual(a, b) {
-	if (a === b) return true;
-	if (!a && !b) return true;
-	if (!a || !b) return false;
-	return JSON.stringify(a) === JSON.stringify(b);
-}
 //#endregion
 //#region src/shells/theme-switcher.tsx
 const FALLBACK_SWATCHES = [
@@ -5977,9 +5567,9 @@ const FALLBACK_SWATCHES = [
 	"var(--opt-text)"
 ];
 function buildThemeOptions() {
-	return THEME_PRESET_IDS.map((id) => {
+	return require_field_sidebar.THEME_PRESET_IDS.map((id) => {
 		var _descriptor$switcherS;
-		const descriptor = THEME_REGISTRY[id];
+		const descriptor = require_field_sidebar.THEME_REGISTRY[id];
 		return {
 			value: id,
 			label: descriptor.label,
@@ -6060,7 +5650,7 @@ function resolveLabels(user) {
 /** Renders the theme switcher component. */
 function ThemeSwitcher({ className, labels: userLabels, variant = "default", customPresetEditor, preset: controlledPreset, onPresetChange, mode: controlledMode, onModeChange }) {
 	var _ref;
-	const themeContext = useOptionalOptTheme();
+	const themeContext = require_field_sidebar.useOptionalOptTheme();
 	const preset = controlledPreset !== null && controlledPreset !== void 0 ? controlledPreset : themeContext === null || themeContext === void 0 ? void 0 : themeContext.preset;
 	const mode = (_ref = controlledMode !== null && controlledMode !== void 0 ? controlledMode : themeContext === null || themeContext === void 0 ? void 0 : themeContext.mode) !== null && _ref !== void 0 ? _ref : "light";
 	const setPreset = onPresetChange !== null && onPresetChange !== void 0 ? onPresetChange : themeContext === null || themeContext === void 0 ? void 0 : themeContext.setPreset;
@@ -6069,7 +5659,7 @@ function ThemeSwitcher({ className, labels: userLabels, variant = "default", cus
 	const labels = resolveLabels(userLabels);
 	const options = buildThemeOptions();
 	const activePreset = preset;
-	const forcedMode = FORCE_LIGHT_PRESET_IDS.has(activePreset);
+	const forcedMode = require_field_sidebar.FORCE_LIGHT_PRESET_IDS.has(activePreset);
 	const showCustomBadge = controlledPreset === void 0 && ((themeContext === null || themeContext === void 0 ? void 0 : themeContext.isGenerated) === true || (themeContext === null || themeContext === void 0 ? void 0 : themeContext.isPromoted) === true);
 	if (options.length === 0) return null;
 	if (variant === "compact") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -6762,10 +6352,10 @@ function BulkActions({ selectedCount, actions, onAction, onClear, labels: custom
 					labels.selected
 				]
 			}),
-			hasActions ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_key_pad_menu.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.DropdownTrigger, {
+			hasActions ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_text_truncate.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownTrigger, {
 				className: "border-border bg-surface text-text-primary hover:bg-bg-subtle inline-flex h-8 items-center rounded-md border px-3 text-sm font-medium",
 				children: labels.actions
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.DropdownContent, { children: actions.map((action) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.DropdownItem, {
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownContent, { children: actions.map((action) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.DropdownItem, {
 				onClick: () => onAction(action.id),
 				className: action.variant === "danger" ? "text-danger" : void 0,
 				children: action.label
@@ -7800,7 +7390,7 @@ function FeatureFlagPanel({ flags, onToggle, onRolloutChange, environments, clas
 							className: "text-text-tertiary text-xs",
 							children: flag.description
 						})]
-					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_key_pad_menu.Switch, {
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_truncate.Switch, {
 						checked: flag.enabled,
 						onChange: (checked) => onToggle(flag.id, checked),
 						label: flag.enabled ? labels.enabled : labels.disabled
@@ -9284,7 +8874,7 @@ const enStarRatingLabels = {
 };
 const enBreadcrumbLabels = { navAriaLabel: "Go to {label}" };
 //#endregion
-exports.ALL_COMPOUND_THEMES = ALL_COMPOUND_THEMES;
+exports.ALL_COMPOUND_THEMES = require_field_sidebar.ALL_COMPOUND_THEMES;
 exports.AccordionContent = require_key_pad_menu.AccordionContent;
 exports.AccordionItem = require_key_pad_menu.AccordionItem;
 exports.AccordionRoot = require_key_pad_menu.AccordionRoot;
@@ -9308,7 +8898,7 @@ exports.Breadcrumb = require_key_pad_menu.Breadcrumb;
 exports.BulkActions = BulkActions;
 exports.Button = require_text_truncate.Button;
 exports.COLOR_PRESETS = COLOR_PRESETS;
-exports.Callout = Callout;
+exports.Callout = require_field_sidebar.Callout;
 exports.Card = require_key_pad_menu.Card;
 exports.CardContent = require_key_pad_menu.CardContent;
 exports.CardDescription = require_key_pad_menu.CardDescription;
@@ -9360,6 +8950,7 @@ exports.ConnectionIndicator = ConnectionIndicator;
 exports.Container = require_key_pad_menu.Container;
 exports.ContentTabs = require_field_sidebar.ContentTabs;
 exports.CopyButton = CopyButton;
+exports.CriteriaBuilder = CriteriaBuilder;
 exports.DEFAULT_PRESETS = require_text_truncate.DEFAULT_PRESETS;
 exports.DEFAULT_TIME_PRESETS = require_field_sidebar.DEFAULT_TIME_PRESETS;
 exports.DashboardGrid = require_field_sidebar.DashboardGrid;
@@ -9367,7 +8958,7 @@ exports.DataImportWizard = DataImportWizard;
 exports.DataTable = require_field_sidebar.DataTable;
 exports.DateRangePicker = require_text_truncate.DateRangePicker;
 exports.DeploymentTimeline = require_field_sidebar.DeploymentTimeline;
-exports.DescriptionList = require_key_pad_menu.DescriptionList;
+exports.DescriptionList = require_text_truncate.DescriptionList;
 exports.DesignGuidePanel = DesignGuidePanel;
 exports.DialogBody = require_text_truncate.DialogBody;
 exports.DialogDescription = require_text_truncate.DialogDescription;
@@ -9385,13 +8976,14 @@ exports.DomainTable = require_field_sidebar.DomainTable;
 exports.DrawerClose = require_key_pad_menu.DrawerClose;
 exports.DrawerPanel = require_key_pad_menu.DrawerPanel;
 exports.DrawerRoot = require_key_pad_menu.DrawerRoot;
-exports.DropdownContent = require_key_pad_menu.DropdownContent;
-exports.DropdownItem = require_key_pad_menu.DropdownItem;
-exports.DropdownMenu = require_key_pad_menu.DropdownMenu;
-exports.DropdownSeparator = require_key_pad_menu.DropdownSeparator;
-exports.DropdownTrigger = require_key_pad_menu.DropdownTrigger;
+exports.DropdownContent = require_text_truncate.DropdownContent;
+exports.DropdownItem = require_text_truncate.DropdownItem;
+exports.DropdownMenu = require_text_truncate.DropdownMenu;
+exports.DropdownSeparator = require_text_truncate.DropdownSeparator;
+exports.DropdownTrigger = require_text_truncate.DropdownTrigger;
 exports.DynamicFieldForm = DynamicFieldForm;
 exports.EMPTY_QUERY = require_field_sidebar.EMPTY_QUERY;
+exports.EMPTY_QUERY_FILTERS = require_field_sidebar.EMPTY_QUERY_FILTERS;
 exports.EditorToolbar = require_field_sidebar.EditorToolbar;
 exports.EmptyState = require_text_truncate.EmptyState;
 exports.EnvPanel = require_field_sidebar.EnvPanel;
@@ -9409,8 +9001,8 @@ exports.ExportButton = ExportButton;
 exports.Expression = require_key_pad_menu.Expression;
 exports.ExpressionGroup = require_key_pad_menu.ExpressionGroup;
 exports.FIELD_TYPE_TOKENS = require_text_truncate.FIELD_TYPE_TOKENS;
-exports.FORCE_LIGHT_PRESETS = FORCE_LIGHT_PRESETS;
-exports.FORCE_LIGHT_PRESET_IDS = FORCE_LIGHT_PRESET_IDS;
+exports.FORCE_LIGHT_PRESETS = require_field_sidebar.FORCE_LIGHT_PRESETS;
+exports.FORCE_LIGHT_PRESET_IDS = require_field_sidebar.FORCE_LIGHT_PRESET_IDS;
 exports.Facet = require_key_pad_menu.Facet;
 exports.FacetGroup = require_key_pad_menu.FacetGroup;
 exports.FailureList = require_field_sidebar.FailureList;
@@ -9452,8 +9044,8 @@ exports.FormSubmit = require_text_truncate.FormSubmit;
 exports.FormSwitch = require_text_truncate.FormSwitch;
 exports.FormTagInput = require_text_truncate.FormTagInput;
 exports.FormTextarea = require_text_truncate.FormTextarea;
-exports.GENERATED_THEME_ID_DEFAULT = GENERATED_THEME_ID_DEFAULT;
-exports.GLOBAL_THEME_STYLE_ID = GLOBAL_THEME_STYLE_ID;
+exports.GENERATED_THEME_ID_DEFAULT = require_field_sidebar.GENERATED_THEME_ID_DEFAULT;
+exports.GLOBAL_THEME_STYLE_ID = require_field_sidebar.GLOBAL_THEME_STYLE_ID;
 exports.Heading = require_key_pad_menu.Heading;
 exports.Highlight = require_text_truncate.Highlight;
 exports.IconPicker = require_text_truncate.IconPicker;
@@ -9494,8 +9086,8 @@ exports.NotificationToast = require_field_sidebar.NotificationToast;
 exports.NumberInput = require_text_truncate.NumberInput;
 exports.OPT_TEXT_PRIMARY = require_text_truncate.OPT_TEXT_PRIMARY;
 exports.OPT_TEXT_SECONDARY = require_text_truncate.OPT_TEXT_SECONDARY;
-exports.OptThemeControllerContext = OptThemeControllerContext;
-exports.OptThemeProvider = OptThemeProvider;
+exports.OptThemeControllerContext = require_field_sidebar.OptThemeControllerContext;
+exports.OptThemeProvider = require_field_sidebar.OptThemeProvider;
 exports.OtpField = require_key_pad_menu.OtpField;
 exports.POPULAR_ICONS = POPULAR_ICONS;
 exports.PageAside = PageAside;
@@ -9511,7 +9103,14 @@ exports.PromptTemplate = PromptTemplate;
 exports.PropertyExplorer = PropertyExplorer;
 exports.QueryBar = require_field_sidebar.QueryBar;
 exports.QueryFilterBar = QueryFilterBar;
-exports.QueryResultsTable = QueryResultsTable;
+exports.QueryFiltersMenu = require_field_sidebar.QueryFiltersMenu;
+exports.QueryHistoryList = require_field_sidebar.QueryHistoryList;
+exports.QueryOutputPane = require_field_sidebar.QueryOutputPane;
+exports.QueryResultChart = require_field_sidebar.QueryResultChart;
+exports.QueryResultsTable = require_field_sidebar.QueryResultsTable;
+exports.QueryToolbar = require_field_sidebar.QueryToolbar;
+exports.QueryVariablesMenu = require_field_sidebar.QueryVariablesMenu;
+exports.QueryWorkspace = require_field_sidebar.QueryWorkspace;
 exports.QuickActions = QuickActions;
 exports.Radio = require_key_pad_menu.Radio;
 exports.RadioGroup = require_key_pad_menu.RadioGroup;
@@ -9522,9 +9121,9 @@ Object.defineProperty(exports, "ReportWidget", {
 		return _reopt_ai_opt_charts.ReportWidget;
 	}
 });
-exports.ResizableHandle = require_key_pad_menu.ResizableHandle;
-exports.ResizablePanel = require_key_pad_menu.ResizablePanel;
-exports.ResizablePanelGroup = require_key_pad_menu.ResizablePanelGroup;
+exports.ResizableHandle = require_text_truncate.ResizableHandle;
+exports.ResizablePanel = require_text_truncate.ResizablePanel;
+exports.ResizablePanelGroup = require_text_truncate.ResizablePanelGroup;
 exports.RichTextEditor = RichTextEditor;
 exports.RouteFocusManager = RouteFocusManager;
 exports.SHADER_OVERLAY_PARAM_KEYS = require_key_pad_menu.SHADER_OVERLAY_PARAM_KEYS;
@@ -9532,13 +9131,15 @@ exports.SHADER_PARAM_FALLBACK = require_key_pad_menu.SHADER_PARAM_FALLBACK;
 exports.SHADER_PARAM_KEYS = require_key_pad_menu.SHADER_PARAM_KEYS;
 exports.SHADER_PRESETS = require_key_pad_menu.SHADER_PRESETS;
 exports.SHADER_PRESET_IDS = require_key_pad_menu.SHADER_PRESET_IDS;
+exports.SaveQueryDialog = require_field_sidebar.SaveQueryDialog;
 exports.SavedFilters = SavedFilters;
+exports.SchemaTree = require_field_sidebar.SchemaTree;
 exports.ScoreBreakdown = require_field_sidebar.ScoreBreakdown;
 exports.ScrollArea = require_key_pad_menu.ScrollArea;
 exports.SearchCombobox = require_field_sidebar.SearchCombobox;
 exports.Section = require_key_pad_menu.Section;
 exports.SegmentBuilder = SegmentBuilder;
-exports.SegmentedControl = SegmentedControl;
+exports.SegmentedControl = require_field_sidebar.SegmentedControl;
 exports.SelectItem = require_text_truncate.SelectItem;
 exports.SelectLabel = require_text_truncate.SelectLabel;
 exports.SelectPopover = require_text_truncate.SelectPopover;
@@ -9557,7 +9158,7 @@ exports.SkeletonText = require_text_truncate.SkeletonText;
 exports.Slider = require_text_truncate.Slider;
 exports.SpatialNavProvider = SpatialNavProvider;
 exports.Spinner = require_text_truncate.Spinner;
-exports.SqlEditor = SqlEditor;
+exports.SqlEditor = require_field_sidebar.SqlEditor;
 exports.StarRating = require_text_truncate.StarRating;
 exports.StatCard = require_text_truncate.StatCard;
 exports.StatusDot = StatusDot;
@@ -9565,12 +9166,12 @@ exports.StatusSelect = require_field_sidebar.StatusSelect;
 exports.StepBuilder = require_key_pad_menu.StepBuilder;
 exports.SummaryRow = SummaryRow;
 exports.SurfaceLayout = require_key_pad_menu.BlockLayout;
-exports.Switch = require_key_pad_menu.Switch;
+exports.Switch = require_text_truncate.Switch;
 exports.THEME_PALETTES = require_key_pad_menu.THEME_PALETTES;
-exports.THEME_PRESET_IDS = THEME_PRESET_IDS;
-exports.THEME_REGISTRY = THEME_REGISTRY;
-exports.THEME_SPEC_STORAGE_KEY = THEME_SPEC_STORAGE_KEY;
-exports.THEME_TOKENS_STORAGE_KEY = THEME_TOKENS_STORAGE_KEY;
+exports.THEME_PRESET_IDS = require_field_sidebar.THEME_PRESET_IDS;
+exports.THEME_REGISTRY = require_field_sidebar.THEME_REGISTRY;
+exports.THEME_SPEC_STORAGE_KEY = require_field_sidebar.THEME_SPEC_STORAGE_KEY;
+exports.THEME_TOKENS_STORAGE_KEY = require_field_sidebar.THEME_TOKENS_STORAGE_KEY;
 exports.Tab = require_text_truncate.Tab;
 exports.TabList = require_text_truncate.TabList;
 exports.TabPanel = require_text_truncate.TabPanel;
@@ -9581,7 +9182,7 @@ exports.TeamMemberList = TeamMemberList;
 exports.TemplatePicker = TemplatePicker;
 exports.Text = require_key_pad_menu.Text;
 exports.TextTruncate = require_text_truncate.TextTruncate;
-exports.Textarea = require_key_pad_menu.Textarea;
+exports.Textarea = require_text_truncate.Textarea;
 exports.ThemeSwitcher = ThemeSwitcher;
 exports.TimeRangeControl = require_field_sidebar.TimeRangeControl;
 exports.TimeRangeSelector = TimeRangeSelector;
@@ -9603,6 +9204,7 @@ Object.defineProperty(exports, "TrendChart", {
 		return _reopt_ai_opt_charts.TrendChart;
 	}
 });
+exports.VALUELESS_OPERATORS = require_field_sidebar.VALUELESS_OPERATORS;
 exports.VerticalTabs = VerticalTabs;
 exports.VirtualList = require_key_pad_menu.VirtualList;
 exports.WebhookConfig = WebhookConfig;
@@ -9611,15 +9213,24 @@ exports.WizardForm = WizardForm;
 exports.WorkflowCanvas = require_field_sidebar.WorkflowCanvas;
 exports.addClause = require_field_sidebar.addClause;
 exports.applyCellAction = require_field_sidebar.applyCellAction;
-exports.buildTokenCache = buildTokenCache;
+exports.buildTokenCache = require_field_sidebar.buildTokenCache;
 exports.cn = require_text_truncate.cn;
-exports.coerceThemeMode = coerceThemeMode;
-exports.computeGeneratedTokens = computeGeneratedTokens;
+exports.coerceThemeMode = require_field_sidebar.coerceThemeMode;
+exports.computeGeneratedTokens = require_field_sidebar.computeGeneratedTokens;
 exports.computeSpatialTargets = computeSpatialTargets;
+exports.countActiveQueryFilters = require_field_sidebar.countActiveQueryFilters;
 exports.createBlock = require_key_pad_menu.createBlock;
 exports.createSurface = require_key_pad_menu.createBlock;
-exports.createThemeBootScript = createThemeBootScript;
-exports.defineThemeOverrides = defineThemeOverrides;
+exports.createThemeBootScript = require_field_sidebar.createThemeBootScript;
+exports.criteriaBuilderDuplicate = criteriaBuilderDuplicate;
+exports.criteriaBuilderDuplicateGroup = criteriaBuilderDuplicateGroup;
+exports.criteriaBuilderInsert = criteriaBuilderInsert;
+exports.criteriaBuilderMove = criteriaBuilderMove;
+exports.criteriaBuilderRemove = criteriaBuilderRemove;
+exports.criteriaBuilderRemoveGroup = criteriaBuilderRemoveGroup;
+exports.criteriaGroupLetter = criteriaGroupLetter;
+exports.defaultQueryChartConfig = require_field_sidebar.defaultQueryChartConfig;
+exports.defineThemeOverrides = require_field_sidebar.defineThemeOverrides;
 exports.describeClause = require_field_sidebar.describeClause;
 exports.enBreadcrumbLabels = enBreadcrumbLabels;
 exports.enComboboxLabels = enComboboxLabels;
@@ -9631,42 +9242,51 @@ exports.formatOptNumber = require_text_truncate.formatOptNumber;
 exports.formatOptShortDate = require_text_truncate.formatOptShortDate;
 exports.formatOptTime = require_text_truncate.formatOptTime;
 exports.formatQuery = require_field_sidebar.formatQuery;
-exports.generatedTheme = generatedTheme;
-exports.getCompoundIdForSpec = getCompoundIdForSpec;
-exports.getCompoundTheme = getCompoundTheme;
+exports.formatQueryCell = require_field_sidebar.formatQueryCell;
+exports.generatedTheme = require_field_sidebar.generatedTheme;
+exports.getCompoundIdForSpec = require_field_sidebar.getCompoundIdForSpec;
+exports.getCompoundTheme = require_field_sidebar.getCompoundTheme;
 exports.getShaderFragment = require_key_pad_menu.getShaderFragment;
 exports.getShaderPreset = require_key_pad_menu.getShaderPreset;
-exports.getThemeDescriptor = getThemeDescriptor;
+exports.getThemeDescriptor = require_field_sidebar.getThemeDescriptor;
 exports.getTrappedContextRole = getTrappedContextRole;
 exports.hasActiveQuery = hasActiveQuery;
-exports.isDescriptorSpec = isDescriptorSpec;
+exports.hasActiveQueryFilters = require_field_sidebar.hasActiveQueryFilters;
+exports.isDescriptorSpec = require_field_sidebar.isDescriptorSpec;
 exports.isEmptyQuery = require_field_sidebar.isEmptyQuery;
-exports.isForceLightSpec = isForceLightSpec;
-exports.isGeneratedSpec = isGeneratedSpec;
-exports.isPresetSpec = isPresetSpec;
-exports.isThemePresetId = isThemePresetId;
+exports.isForceLightSpec = require_field_sidebar.isForceLightSpec;
+exports.isGeneratedSpec = require_field_sidebar.isGeneratedSpec;
+exports.isPresetSpec = require_field_sidebar.isPresetSpec;
+exports.isThemePresetId = require_field_sidebar.isThemePresetId;
+exports.isValidQueryVariableName = require_field_sidebar.isValidQueryVariableName;
 exports.koBreadcrumbLabels = require_text_truncate.koBreadcrumbLabels;
 exports.koComboboxLabels = require_text_truncate.koComboboxLabels;
 exports.koStarRatingLabels = require_text_truncate.koStarRatingLabels;
 exports.matchesQuery = matchesQuery;
 exports.matchesQueryObject = matchesQueryObject;
+exports.numericResultColumns = require_field_sidebar.numericResultColumns;
 exports.parseQuery = require_field_sidebar.parseQuery;
 exports.parseQueryWithDiagnostics = require_field_sidebar.parseQueryWithDiagnostics;
-exports.presetTheme = presetTheme;
+exports.presetTheme = require_field_sidebar.presetTheme;
 exports.queryFields = require_field_sidebar.queryFields;
 exports.quoteValue = require_field_sidebar.quoteValue;
-exports.readStoredTheme = readStoredTheme;
+exports.readStoredTheme = require_field_sidebar.readStoredTheme;
 exports.removeClause = require_field_sidebar.removeClause;
-exports.resolveDescriptor = resolveDescriptor;
+exports.replaceSqlPlaceholder = replaceSqlPlaceholder;
+exports.resolveDescriptor = require_field_sidebar.resolveDescriptor;
 exports.resolveFieldType = require_text_truncate.resolveFieldType;
-exports.resolveThemeMode = resolveThemeMode;
-exports.safeParseStoredSpec = safeParseStoredSpec;
-exports.safeParseStoredTokens = safeParseStoredTokens;
+exports.resolveThemeMode = require_field_sidebar.resolveThemeMode;
+exports.safeParseStoredSpec = require_field_sidebar.safeParseStoredSpec;
+exports.safeParseStoredTokens = require_field_sidebar.safeParseStoredTokens;
 exports.schemaValidator = schemaValidator;
-exports.serializeGeneratedTheme = serializeGeneratedTheme;
-exports.serializeThemeRule = serializeThemeRule;
-exports.serializeTokenBody = serializeTokenBody;
+exports.serializeGeneratedTheme = require_field_sidebar.serializeGeneratedTheme;
+exports.serializeThemeRule = require_field_sidebar.serializeThemeRule;
+exports.serializeTokenBody = require_field_sidebar.serializeTokenBody;
 exports.shouldSkipArrow = shouldSkipArrow;
+exports.splitSqlStatements = splitSqlStatements;
+exports.sqlPlaceholderNames = sqlPlaceholderNames;
+exports.sqlStatementAtOffset = sqlStatementAtOffset;
+exports.sqlUsesPlaceholder = sqlUsesPlaceholder;
 exports.toast = require_field_sidebar.toast;
 exports.useAutoRefresh = require_field_sidebar.useAutoRefresh;
 exports.useControlledState = require_text_truncate.useControlledState;
@@ -9674,9 +9294,9 @@ exports.useFieldValue = _reopt_ai_opt_ui_primitives.useFieldValue;
 exports.useFormContext = _reopt_ai_opt_ui_primitives.useFormContext;
 exports.useFormStore = _reopt_ai_opt_ui_primitives.useFormStore;
 exports.useInputId = require_text_truncate.useInputId;
-exports.useOptTheme = useOptTheme;
-exports.useOptThemeController = useOptThemeController;
-exports.useOptionalOptTheme = useOptionalOptTheme;
+exports.useOptTheme = require_field_sidebar.useOptTheme;
+exports.useOptThemeController = require_field_sidebar.useOptThemeController;
+exports.useOptionalOptTheme = require_field_sidebar.useOptionalOptTheme;
 exports.useSidebar = useSidebar;
 exports.useToast = require_field_sidebar.useToast;
 exports.withFieldValue = require_field_sidebar.withFieldValue;