@reopt-ai/opt-ui 1.7.0 → 1.9.0

package/dist/{field-sidebar-Cs-J-5VE.js → field-sidebar-B7QkWvMG.js}

@@ -1,5 +1,5 @@
 "use client";
-import { $ as TooltipAnchor$1, A as FormSwitch$1, An as OPT_SURFACE_POPOVER, At as SelectPopover$1, Bn as _objectSpread2, Bt as Composite, C as FormRoot$1, Cn as OPT_FOCUS, Dt as DialogRoot$1, E as FormSelectPopover, En as OPT_INPUT, Et as DialogPanel$1, F as useFormStore, Fn as OPT_TEXT_LABEL, Ft as TabPanel$1, G as PopoverTrigger$1, Hn as Kbd, Ht as CompositeProvider, In as OPT_TEXT_PRIMARY, It as TabsRoot$1, J as ToolbarButton$1, Jt as Alert, Kt as Input, Ln as OPT_TEXT_SECONDARY, Lt as DisclosureContent$1, M as FormTextarea, Mn as OPT_TD, Mt as SelectTrigger$1, Nn as OPT_TD_MUTED, Nt as Tab$1, On as OPT_ITEM_BASE, Ot as SelectItem$1, Pt as TabList$1, Q as Tooltip$1, Qt as Button, R as TagInput, Rn as OPT_TEXT_TERTIARY, Rt as DisclosureRoot$1, Sn as OPT_DOT_YELLOW, T as FormSelectItem, Tt as DialogHeading$1, U as PopoverContent$1, Un as cn, Ut as CompositeRow, Vn as _objectWithoutProperties, Vt as CompositeItem, W as PopoverRoot$1, X as ToolbarRoot$1, Xt as Badge, Y as ToolbarContainer$1, Yt as Spinner, Z as ToolbarSeparator$1, Zt as EmptyState, _n as OPT_DISCLOSURE_TRIGGER, _t as ComboboxRoot$1, at as MenuPopover$1, b as FormRadioGroup$1, bn as OPT_DOT_GREEN, bt as DialogDescription$1, ct as MenuTrigger$1, dn as OPT_BADGE_GREEN, dt as ComboboxEmpty, et as TooltipProvider$1, fn as OPT_BADGE_NEUTRAL, gn as OPT_DISCLOSURE_CONTENT, gt as ComboboxPopover$1, h as FormLabel$1, hn as OPT_BORDER, ht as ComboboxItem$1, i as FormCheckbox$1, it as MenuItemRadio$1, jn as OPT_TABLE_ROW_ACTIVE, jt as SelectRoot$1, k as FormSubmit$1, kn as OPT_SURFACE, kt as SelectLabel$1, l as FormError$1, ln as OPT_ANIMATE_ENTER_EXIT, lt as MenubarContainer$1, m as FormInput$1, mn as OPT_BADGE_YELLOW, mt as ComboboxInput$1, n as Checkbox, nn as StatCard, nt as MenuItem$1, ot as MenuRoot$1, pn as OPT_BADGE_RED, rt as MenuItemCheckbox$1, sn as OPT_ACTIVE_ITEM, st as MenuSeparator$1, t as Pagination, tt as MenuButtonArrow$1, un as OPT_BADGE_BLUE, ut as MenubarRoot$1, vn as OPT_DIVIDER, w as FormSelect, wn as OPT_FOCUS_VISIBLE, xn as OPT_DOT_RED, y as FormRadio$1, zn as OPT_TH, zt as DisclosureTrigger$1 } from "./pagination-DWbvACuN.js";
+import { $ as ToolbarContainer$1, $t as Spinner, A as FormSelectPopover, An as OPT_INPUT, At as DialogPanel$1, Bn as OPT_TEXT_PRIMARY, Bt as TabsRoot$1, C as FormRadio$1, D as FormRoot$1, Dn as OPT_FOCUS, En as OPT_DOT_YELLOW, Fn as OPT_TABLE_ROW_ACTIVE, Ft as SelectRoot$1, Gn as _objectWithoutProperties, Gt as CompositeItem, H as TagInput, Hn as OPT_TEXT_TERTIARY, Ht as DisclosureRoot$1, I as FormTextarea, In as OPT_TD, It as SelectTrigger$1, J as PopoverRoot$1, Kn as Kbd, Kt as CompositeProvider, Ln as OPT_TD_MUTED, Lt as Tab$1, Mn as OPT_ITEM_BASE, Mt as SelectItem$1, N as FormSubmit$1, Nn as OPT_SURFACE, Nt as SelectLabel$1, O as FormSelect, On as OPT_FOCUS_VISIBLE, P as FormSwitch$1, Pn as OPT_SURFACE_POPOVER, Pt as SelectPopover$1, Q as ToolbarButton$1, Qt as Alert, Rt as TabList$1, Sn as OPT_DIVIDER, Tn as OPT_DOT_RED, Un as OPT_TH, Ut as DisclosureTrigger$1, Vn as OPT_TEXT_SECONDARY, Vt as DisclosureContent$1, Wn as _objectSpread2, Wt as Composite, Xt as Input, Y as PopoverTrigger$1, _n as OPT_BADGE_RED, a as Pagination, at as MenuButtonArrow$1, bn as OPT_DISCLOSURE_CONTENT, bt as ComboboxPopover$1, c as FormCheckbox$1, ct as MenuItemRadio$1, dn as OPT_ACTIVE_ITEM, dt as MenuSeparator$1, en as Badge, et as ToolbarRoot$1, ft as MenuTrigger$1, gn as OPT_BADGE_NEUTRAL, hn as OPT_BADGE_GREEN, ht as ComboboxEmpty, it as TooltipProvider$1, jt as DialogRoot$1, k as FormSelectItem, kt as DialogHeading$1, lt as MenuPopover$1, mn as OPT_BADGE_BLUE, mt as MenubarRoot$1, nn as Button, nt as Tooltip$1, o as Checkbox, on as StatCard, ot as MenuItem$1, p as FormError$1, pn as OPT_ANIMATE_ENTER_EXIT, pt as MenubarContainer$1, q as PopoverContent$1, qn as cn, qt as CompositeRow, r as FieldToken, rt as TooltipAnchor$1, st as MenuItemCheckbox$1, t as Highlight, tn as EmptyState, tt as ToolbarSeparator$1, ut as MenuRoot$1, v as FormInput$1, vn as OPT_BADGE_YELLOW, vt as ComboboxInput$1, w as FormRadioGroup$1, wn as OPT_DOT_GREEN, wt as DialogDescription$1, xn as OPT_DISCLOSURE_TRIGGER, xt as ComboboxRoot$1, y as FormLabel$1, yn as OPT_BORDER, yt as ComboboxItem$1, z as useFormStore, zn as OPT_TEXT_LABEL, zt as TabPanel$1 } from "./highlight-C2sfnJN8.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Fragment as Fragment$1, createContext, forwardRef, memo, useCallback, useContext, useEffect, useId, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
@@ -3057,7 +3057,9 @@ const defaultLabels$2 = {
 	filterFor: (value) => `Filter for ${value}`,
 	filterOut: (value) => `Filter out ${value}`,
 	sortAscending: "Sort ascending",
-	sortDescending: "Sort descending"
+	sortDescending: "Sort descending",
+	moveLeft: (column) => `Move ${column} left`,
+	moveRight: (column) => `Move ${column} right`
 };
 /** Rows rendered beyond the viewport on each side, so a fast scroll stays filled. */
 const OVERSCAN = 10;
@@ -3116,7 +3118,7 @@ function columnStyle(column) {
 * />
 * ```
 */
-function LogTableInner({ rows, columns, getRowId, selectedId = null, onSelect, onLoadMore, hasMore = false, loadingMore = false, prepending = false, onFollowChange, isNew, sort = null, onSortChange, onCellAction, density = "normal", showHeader = true, emptyState, labels: customLabels, className }, ref) {
+function LogTableInner({ rows, columns, getRowId, selectedId = null, onSelect, onLoadMore, hasMore = false, loadingMore = false, prepending = false, onFollowChange, isNew, sort = null, onSortChange, onCellAction, highlightTerms, onColumnMove, density = "normal", showHeader = true, emptyState, labels: customLabels, className }, ref) {
 	const labels = _objectSpread2(_objectSpread2({}, defaultLabels$2), customLabels);
 	const rowHeight = ROW_HEIGHT[density];
 	const scrollRef = useRef(null);
@@ -3242,12 +3244,13 @@ function LogTableInner({ rows, columns, getRowId, selectedId = null, onSelect, o
 	]);
 	return /* @__PURE__ */ jsxs("div", {
 		className: cn("@container/log flex min-h-0 flex-col", className),
-		"data-opt-id": "NJ4N9",
+		"data-opt-id": "3ZR82",
 		"data-opt-slug": "log-table.LogTable",
 		children: [showHeader && /* @__PURE__ */ jsx(LogTableHeader, {
 			columns,
 			sort,
 			onSortChange,
+			onColumnMove,
 			density,
 			labels
 		}), /* @__PURE__ */ jsxs("div", {
@@ -3276,6 +3279,7 @@ function LogTableInner({ rows, columns, getRowId, selectedId = null, onSelect, o
 							isNew: (_isNew = isNew === null || isNew === void 0 ? void 0 : isNew(row)) !== null && _isNew !== void 0 ? _isNew : false,
 							onSelect,
 							onCellAction,
+							highlightTerms,
 							labels
 						}, id);
 					})
@@ -3302,15 +3306,16 @@ function LogTableInner({ rows, columns, getRowId, selectedId = null, onSelect, o
 * widens it to its constraint and takes the column callbacks' types with it.
 */
 const LogTable = forwardRef(LogTableInner);
-function LogTableHeader({ columns, sort, onSortChange, density, labels }) {
+function LogTableHeader({ columns, sort, onSortChange, onColumnMove, density, labels }) {
 	return /* @__PURE__ */ jsx("div", {
 		role: "row",
 		className: cn("border-border-subtle text-text-tertiary flex shrink-0 items-center gap-3 border-b px-3", DENSITY_TEXT[density]),
 		style: { height: ROW_HEIGHT[density] },
-		children: columns.map((column) => {
+		children: columns.map((column, index) => {
 			var _column$priority;
 			const active = (sort === null || sort === void 0 ? void 0 : sort.columnId) === column.id;
 			const sortable = column.sortable && onSortChange;
+			const columnLabel = typeof column.header === "string" ? column.header : column.id;
 			const content = /* @__PURE__ */ jsxs(Fragment, { children: [
 				column.marker && /* @__PURE__ */ jsx("span", {
 					"aria-hidden": true,
@@ -3328,12 +3333,12 @@ function LogTableHeader({ columns, sort, onSortChange, density, labels }) {
 					"aria-hidden": true
 				}))
 			] });
-			return /* @__PURE__ */ jsx("div", {
+			return /* @__PURE__ */ jsxs("div", {
 				role: "columnheader",
 				"aria-sort": active ? sort.direction === "asc" ? "ascending" : "descending" : void 0,
-				className: cn("flex items-center gap-1.5", column.align === "right" && "justify-end", HIDE_BELOW[(_column$priority = column.priority) !== null && _column$priority !== void 0 ? _column$priority : "always"]),
+				className: cn("group/header flex items-center gap-1.5", column.align === "right" && "justify-end", HIDE_BELOW[(_column$priority = column.priority) !== null && _column$priority !== void 0 ? _column$priority : "always"]),
 				style: columnStyle(column),
-				children: sortable ? /* @__PURE__ */ jsx("button", {
+				children: [sortable ? /* @__PURE__ */ jsx("button", {
 					type: "button",
 					className: "hover:text-text-primary flex cursor-pointer items-center gap-1.5 truncate",
 					title: active && sort.direction === "desc" ? labels.sortAscending : labels.sortDescending,
@@ -3342,12 +3347,35 @@ function LogTableHeader({ columns, sort, onSortChange, density, labels }) {
 						direction: active && sort.direction === "desc" ? "asc" : "desc"
 					}),
 					children: content
-				}) : content
+				}) : content, onColumnMove && /* @__PURE__ */ jsxs("span", {
+					className: cn("ml-auto flex shrink-0 items-center gap-0.5", "opacity-0 transition-opacity", "group-hover/header:opacity-100 focus-within:opacity-100"),
+					children: [index > 0 && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						className: "hover:text-text-primary cursor-pointer",
+						"aria-label": labels.moveLeft(columnLabel),
+						title: labels.moveLeft(columnLabel),
+						onClick: () => onColumnMove(column.id, "left"),
+						children: /* @__PURE__ */ jsx(ChevronLeft, {
+							className: "size-3",
+							"aria-hidden": true
+						})
+					}), index < columns.length - 1 && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						className: "hover:text-text-primary cursor-pointer",
+						"aria-label": labels.moveRight(columnLabel),
+						title: labels.moveRight(columnLabel),
+						onClick: () => onColumnMove(column.id, "right"),
+						children: /* @__PURE__ */ jsx(ChevronRight, {
+							className: "size-3",
+							"aria-hidden": true
+						})
+					})]
+				})]
 			}, column.id);
 		})
 	});
 }
-function LogTableRowImpl({ id, row, columns, top, height, density, selected, isNew, onSelect, onCellAction, labels }) {
+function LogTableRowImpl({ id, row, columns, top, height, density, selected, isNew, onSelect, onCellAction, highlightTerms, labels }) {
 	return /* @__PURE__ */ jsx("div", {
 		role: "option",
 		"aria-selected": selected,
@@ -3381,7 +3409,10 @@ function LogTableRowImpl({ id, row, columns, top, height, density, selected, isN
 					/* @__PURE__ */ jsx("span", {
 						className: cn("truncate", column.mono && "font-mono", text ? "text-text-secondary" : ABSENT),
 						title: text || void 0,
-						children: column.render ? column.render(row) : text || EM_DASH
+						children: column.render ? column.render(row) : text ? highlightTerms && highlightTerms.length > 0 ? /* @__PURE__ */ jsx(Highlight, {
+							text,
+							search: highlightTerms
+						}) : text : EM_DASH
 					}),
 					onCellAction && column.field && text && /* @__PURE__ */ jsx(CellActions, {
 						field: column.field,
@@ -3410,7 +3441,7 @@ const LogTableRow = memo(LogTableRowImpl);
 function CellActions({ field, value, onAction, labels }) {
 	const button = "cursor-pointer rounded-sm p-0.5 text-text-tertiary hover:bg-bg-muted hover:text-text-primary";
 	return /* @__PURE__ */ jsxs("span", {
-		className: cn("bg-surface/90 ml-auto hidden shrink-0 items-center gap-0.5 rounded pl-1", "group-hover/cell:flex focus-within:flex"),
+		className: cn("bg-surface/90 ml-auto flex shrink-0 items-center gap-0.5 rounded pl-1", "opacity-0 transition-opacity", "group-hover/cell:opacity-100 focus-within:opacity-100"),
 		children: [/* @__PURE__ */ jsx("button", {
 			type: "button",
 			className: button,
@@ -4117,7 +4148,7 @@ function FieldSidebar({ fields, expandedField = null, onExpandedFieldChange, val
 }
 FieldSidebar.displayName = "FieldSidebar";
 function FieldRow({ field, expanded, onToggleExpanded, onToggleColumn, labels, children }) {
-	var _field$columnable, _field$inTable;
+	var _field$columnable, _field$type, _field$inTable;
 	const columnable = (_field$columnable = field.columnable) !== null && _field$columnable !== void 0 ? _field$columnable : true;
 	return /* @__PURE__ */ jsxs("li", { children: [/* @__PURE__ */ jsxs("div", {
 		className: "hover:bg-bg-subtle group/field flex items-center gap-1.5 px-3 py-1",
@@ -4126,7 +4157,11 @@ function FieldRow({ field, expanded, onToggleExpanded, onToggleColumn, labels, c
 			className: "flex min-w-0 flex-1 cursor-pointer items-center gap-2 text-left",
 			"aria-expanded": expanded,
 			onClick: onToggleExpanded,
-			children: [field.type && /* @__PURE__ */ jsx("span", {
+			children: [field.dataType ? /* @__PURE__ */ jsx(FieldToken, {
+				type: field.dataType,
+				size: "xs",
+				title: (_field$type = field.type) !== null && _field$type !== void 0 ? _field$type : field.dataType
+			}) : field.type && /* @__PURE__ */ jsx("span", {
 				className: cn("text-text-tertiary", "w-8 shrink-0 truncate font-mono text-[10px] uppercase"),
 				children: field.type
 			}), /* @__PURE__ */ jsx("span", {
@@ -4192,7 +4227,7 @@ function FieldValues({ values, loading, total, sampledRows, onFilter, labels })
 							children: [Math.round(share * 100), "%"]
 						}),
 						onFilter && /* @__PURE__ */ jsxs("span", {
-							className: "hidden shrink-0 items-center gap-0.5 group-hover/value:flex focus-within:flex",
+							className: cn("flex shrink-0 items-center gap-0.5", "opacity-0 transition-opacity", "group-hover/value:opacity-100 focus-within:opacity-100"),
 							children: [/* @__PURE__ */ jsx("button", {
 								type: "button",
 								className: "text-text-tertiary hover:text-text-primary cursor-pointer",
@@ -4230,4 +4265,4 @@ function FieldValues({ values, loading, total, sampledRows, onFilter, labels })
 //#endregion
 export { CommandList$1 as $, DataTable as A, SidebarNav as B, WorkflowCanvas as C, ToastProvider as D, NotificationToast as E, DeploymentTimeline as F, CommandPaletteTrigger as G, StatusSelect as H, SettingsForm as I, CommandDialog as J, CommandPalette as K, FaqAccordion as L, BranchSelect as M, EnvPanel as N, toast as O, ProjectSwitcher as P, CommandItem$1 as Q, ContentTabs as R, useAutoRefresh as S, FailureList as T, SearchCombobox as U, AppMenubar as V, DashboardGrid as W, CommandGroup$1 as X, CommandEmpty$1 as Y, CommandInput$1 as Z, withoutField as _, formatQuery as a, DEFAULT_TIME_PRESETS as b, parseQueryWithDiagnostics as c, applyCellAction as d, CommandSeparator$1 as et, fieldValues as f, withFieldValue as g, removeClause as h, formatClause as i, DomainTable as j, useToast as k, EMPTY_QUERY as l, queryFields as m, QueryBar as n, quoteValue as o, isEmptyQuery as p, Command as q, describeClause as r, parseQuery as s, FieldSidebar as t, CommandShortcut as tt, addClause as u, LogTable as v, KeyValueEditor as w, TimeRangeControl as x, TimeSeriesPanel as y, EditorToolbar as z };
 
-//# sourceMappingURL=field-sidebar-Cs-J-5VE.js.map
+//# sourceMappingURL=field-sidebar-B7QkWvMG.js.map