@revisium/schema-toolkit-ui 0.6.2 → 0.6.4

package/README.md

@@ -236,6 +236,7 @@ All callbacks are optional and passed via `TableEditorOptions.callbacks`:
 | `onBreadcrumbClick` | `(segment, index) => void` | Navigate on breadcrumb click |
 | `onCreateRow` | `() => void` | Create a new row (shows "+" button) |
 | `onOpenRow` | `(rowId: string) => void` | Navigate to row detail view |
+| `onPickRow` | `(rowId: string) => void` | Pick a row (e.g. foreign key selection). When set, the primary row action becomes "Pick" and the table behaves as read-only |
 | `onDuplicateRow` | `(rowId: string) => void` | Duplicate a row |
 | `onSearchForeignKey` | `SearchForeignKeySearchFn` | Foreign key search handler |
 | `onUploadFile` | `(params: { rowId: string; fileId: string; file: File }) => Promise<Record<string, unknown> \| null>` | Upload a file for a file field |

package/dist/index.cjs

@@ -5757,21 +5757,25 @@ const Row = ({ node, name, guides, isCollapsible = false, isExpanded = true, onT
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Flex, {
 				width: "100%",
 				alignItems: "center",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Flex, { children: [
-					!skipDot && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Dot, {
-						isCollapsed,
-						isCollapsible,
-						toggleCollapsed: onToggle,
-						testId
-					}),
-					!skipField && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
-						name,
-						formula,
-						description,
-						isDeprecated
-					}),
-					children
-				] }), !skipMore && isCollapsed && collapsedLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(More, {
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Flex, {
+					flex: skipDot && skipField ? 1 : void 0,
+					minWidth: 0,
+					children: [
+						!skipDot && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Dot, {
+							isCollapsed,
+							isCollapsible,
+							toggleCollapsed: onToggle,
+							testId
+						}),
+						!skipField && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Field, {
+							name,
+							formula,
+							description,
+							isDeprecated
+						}),
+						children
+					]
+				}), !skipMore && isCollapsed && collapsedLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(More, {
 					onClick: onToggle,
 					label: collapsedLabel
 				})]
@@ -6997,7 +7001,10 @@ var SchemaContext = class {
 		const wrapped = wrapDataSchema(dataSchema);
 		this._wrappedDataSchema = wrapped;
 		const rowSchema = buildRowSchema(wrapped);
-		this._rootNode = new _revisium_schema_toolkit.SchemaParser().parse(rowSchema, this._fullRefSchemas);
+		const parser = new _revisium_schema_toolkit.SchemaParser();
+		this._rootNode = parser.parse(rowSchema, this._fullRefSchemas);
+		const tree = (0, _revisium_schema_toolkit.createSchemaTree)(this._rootNode);
+		parser.parseFormulas(tree);
 		this._allColumns = extractColumns(this._rootNode);
 	}
 };
@@ -7067,7 +7074,11 @@ function resolveFileRefColumns(child, fieldPath) {
 	if (child.isObject()) for (const subField of child.properties()) {
 		const subFieldPath = buildFieldPath(fieldPath, subField.name());
 		const fieldType = NODE_TYPE_TO_FIELD_TYPE[subField.nodeType()];
-		if (fieldType) result.push(createColumn(subFieldPath, subField, fieldType));
+		if (fieldType) {
+			const subCol = createColumn(subFieldPath, subField, fieldType);
+			subCol.parentFileField = fieldPath;
+			result.push(subCol);
+		}
 	}
 	return result;
 }
@@ -7156,6 +7167,9 @@ var ColumnsModel = class {
 	constructor() {
 		(0, mobx.makeAutoObservable)(this, {}, { autoBind: true });
 	}
+	get allColumns() {
+		return this._allColumns;
+	}
 	get visibleColumns() {
 		const lookup = this._columnLookup;
 		const result = [];
@@ -7588,6 +7602,49 @@ var ColumnsModel = class {
 	}
 };
 
+//#endregion
+//#region src/table-editor/Columns/model/groupFileFields.ts
+function isFileFieldGroup(item) {
+	return "parent" in item && "children" in item;
+}
+function groupFileFields(columns, allColumns) {
+	const allLookup = allColumns ? new Map(allColumns.map((c) => [c.field, c])) : null;
+	const groups = /* @__PURE__ */ new Map();
+	const result = [];
+	for (const col of columns) if (col.fieldType === FilterFieldType.File) {
+		const existing = groups.get(col.field);
+		if (existing) {
+			existing.parent = col;
+			existing.parentVisible = false;
+		} else {
+			const group = {
+				parent: col,
+				children: [],
+				parentVisible: false
+			};
+			groups.set(col.field, group);
+			result.push(group);
+		}
+	} else if (col.parentFileField) {
+		let group = groups.get(col.parentFileField);
+		if (!group) {
+			const parentCol = allLookup?.get(col.parentFileField);
+			if (parentCol) {
+				group = {
+					parent: parentCol,
+					children: [],
+					parentVisible: true
+				};
+				groups.set(col.parentFileField, group);
+				result.push(group);
+			}
+		}
+		if (group) group.children.push(col);
+		else result.push(col);
+	} else result.push(col);
+	return result;
+}
+
 //#endregion
 //#region src/table-editor/Filters/model/utils/operators.ts
 let FilterOperator = /* @__PURE__ */ function(FilterOperator) {
@@ -8049,15 +8106,15 @@ function parseValue(value, fieldType) {
 	}
 	return value;
 }
-function buildOperatorClause(operator, value, fieldType) {
+function buildOperatorClause(operator, value, fieldType, isSystemField) {
 	const parsed = parseValue(value, fieldType);
 	switch (operator) {
 		case FilterOperator.Equals: return { equals: parsed };
 		case FilterOperator.NotEquals: return { not: { equals: parsed } };
-		case FilterOperator.Contains: return { string_contains: value };
-		case FilterOperator.NotContains: return { not: { string_contains: value } };
-		case FilterOperator.StartsWith: return { string_starts_with: value };
-		case FilterOperator.EndsWith: return { string_ends_with: value };
+		case FilterOperator.Contains: return isSystemField ? { contains: value } : { string_contains: value };
+		case FilterOperator.NotContains: return isSystemField ? { not: { contains: value } } : { not: { string_contains: value } };
+		case FilterOperator.StartsWith: return isSystemField ? { startsWith: value } : { string_starts_with: value };
+		case FilterOperator.EndsWith: return isSystemField ? { endsWith: value } : { string_ends_with: value };
 		case FilterOperator.Gt: return { gt: parsed };
 		case FilterOperator.Gte: return { gte: parsed };
 		case FilterOperator.Lt: return { lt: parsed };
@@ -8084,8 +8141,9 @@ function buildConditionClause(condition) {
 			searchType: condition.searchType || "plain"
 		} };
 	}
-	const opClause = buildOperatorClause(condition.operator, condition.value, condition.fieldType);
-	if (SYSTEM_FIELD_IDS.has(condition.field)) return { [condition.field]: opClause };
+	const isSystemField = SYSTEM_FIELD_IDS.has(condition.field);
+	const opClause = buildOperatorClause(condition.operator, condition.value, condition.fieldType, isSystemField);
+	if (isSystemField) return { [condition.field]: opClause };
 	return { data: {
 		path: stripDataFieldPrefix(condition.field),
 		...opClause
@@ -9254,7 +9312,10 @@ const SearchWidget = (0, mobx_react_lite.observer)(({ model }) => {
 				right: "0",
 				top: "50%",
 				transform: "translateY(-50%)",
-				onClick: () => model.clear(),
+				onClick: () => {
+					model.clear();
+					setExpanded(false);
+				},
 				color: "gray.400",
 				_hover: { color: "black" },
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_pi.PiXBold, {})
@@ -12125,6 +12186,19 @@ const FilterIndicator = (0, mobx_react_lite.observer)(({ field, filterModel }) =
 	});
 });
 
+//#endregion
+//#region src/table-editor/Table/ui/Header/FormulaIndicator.tsx
+const FormulaIndicator = ({ column }) => {
+	if (!column.hasFormula) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Flex, {
+		alignItems: "center",
+		color: "gray.400",
+		flexShrink: 0,
+		"data-testid": `formula-indicator-${column.field}`,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_pi.PiFunction, { size: 12 })
+	});
+};
+
 //#endregion
 //#region src/table-editor/Table/ui/Header/SortSubmenu.tsx
 const SortSubmenu = (0, mobx_react_lite.observer)(({ field, sortModel }) => {
@@ -12248,10 +12322,69 @@ const FieldMenuItem = (0, react.memo)(({ field, name, fieldType, valuePrefix, on
 	});
 });
 
+//#endregion
+//#region src/table-editor/Table/ui/Header/FileFieldSubmenu.tsx
+const FileFieldSubmenu = ({ group, parentVisible, valuePrefix, onClick }) => {
+	if (group.children.length === 0 && !parentVisible) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldMenuItem, {
+		field: group.parent.field,
+		name: group.parent.label,
+		fieldType: group.parent.fieldType,
+		valuePrefix,
+		onClick
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.Root, {
+		positioning: {
+			placement: "right-start",
+			gutter: 2
+		},
+		lazyMount: true,
+		unmountOnExit: true,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.TriggerItem, {
+			"data-testid": `file-group-${group.parent.field}`,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Box, {
+				display: "flex",
+				alignItems: "center",
+				gap: 2,
+				flex: 1,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Box, {
+					as: "span",
+					fontSize: "xs",
+					fontWeight: "medium",
+					color: "gray.400",
+					fontFamily: "mono",
+					minWidth: "20px",
+					children: getFieldTypeIcon(group.parent.fieldType)
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Text, {
+					truncate: true,
+					children: group.parent.label
+				})]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_lu.LuChevronRight, {})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Positioner, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.Content, {
+			maxH: "300px",
+			minW: "200px",
+			overflowY: "auto",
+			children: [!parentVisible && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldMenuItem, {
+				field: group.parent.field,
+				name: group.parent.label,
+				fieldType: group.parent.fieldType,
+				valuePrefix,
+				onClick
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Separator, {})] }), group.children.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldMenuItem, {
+				field: col.field,
+				name: col.label,
+				fieldType: col.fieldType,
+				valuePrefix,
+				onClick
+			}, col.field))]
+		}) }) })]
+	});
+};
+
 //#endregion
 //#region src/table-editor/Table/ui/Header/InsertColumnSubmenu.tsx
-const InsertColumnSubmenu = ({ label, valuePrefix, availableFields, onSelect }) => {
+const InsertColumnSubmenu = ({ label, valuePrefix, availableFields, allColumns, onSelect }) => {
 	if (availableFields.length === 0) return null;
+	const groupedFields = groupFileFields(availableFields, allColumns);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.Root, {
 		positioning: {
 			placement: "right-start",
@@ -12266,13 +12399,18 @@ const InsertColumnSubmenu = ({ label, valuePrefix, availableFields, onSelect })
 			maxH: "300px",
 			minW: "200px",
 			overflowY: "auto",
-			children: availableFields.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldMenuItem, {
-				field: col.field,
-				name: col.label,
-				fieldType: col.fieldType,
+			children: groupedFields.map((item) => isFileFieldGroup(item) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FileFieldSubmenu, {
+				group: item,
+				parentVisible: item.parentVisible,
 				valuePrefix,
 				onClick: onSelect
-			}, col.field))
+			}, item.parent.field) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldMenuItem, {
+				field: item.field,
+				name: item.label,
+				fieldType: item.fieldType,
+				valuePrefix,
+				onClick: onSelect
+			}, item.field))
 		}) }) })]
 	});
 };
@@ -12329,10 +12467,6 @@ const ColumnHeaderMenu = (0, mobx_react_lite.observer)(({ column, columnsModel,
 				onClick: handleAddFilter,
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_lu.LuFilter, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Text, { children: "Add filter" })]
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Separator, {})] }),
-			canMove && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MoveColumnSubmenu, {
-				field: column.field,
-				columnsModel
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Separator, {})] }),
 			isPinned ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.Item, {
 				value: "unpin",
 				onClick: handleUnpin,
@@ -12350,17 +12484,23 @@ const ColumnHeaderMenu = (0, mobx_react_lite.observer)(({ column, columnsModel,
 				}),
 				(canPinLeft || canPinRight) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Separator, {})
 			] }),
+			canMove && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MoveColumnSubmenu, {
+				field: column.field,
+				columnsModel
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Separator, {})] }),
 			hasInsertableFields && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InsertColumnSubmenu, {
 					label: "Insert before",
 					valuePrefix: "before",
 					availableFields: insertableFields,
+					allColumns: columnsModel.allColumns,
 					onSelect: handleInsertBefore
 				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InsertColumnSubmenu, {
 					label: "Insert after",
 					valuePrefix: "after",
 					availableFields: insertableFields,
+					allColumns: columnsModel.allColumns,
 					onSelect: handleInsertAfter
 				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Separator, {})
@@ -12474,6 +12614,7 @@ const ColumnHeader = (0, mobx_react_lite.observer)(({ column, columnsModel, sort
 							textDecoration: column.isDeprecated ? "line-through" : void 0,
 							children: column.label
 						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormulaIndicator, { column }),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PinIndicator, {
 							field: column.field,
 							columnsModel
@@ -12509,6 +12650,7 @@ const AddColumnButton = (0, mobx_react_lite.observer)(({ columnsModel }) => {
 	const availableFields = columnsModel.availableFieldsToAdd;
 	const availableSystemFields = columnsModel.availableSystemFieldsToAdd;
 	if (!columnsModel.hasHiddenColumns) return null;
+	const groupedFields = groupFileFields(availableFields, columnsModel.allColumns);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Flex, {
 		alignItems: "center",
 		px: "4px",
@@ -12542,17 +12684,21 @@ const AddColumnButton = (0, mobx_react_lite.observer)(({ columnsModel }) => {
 						onClick: columnsModel.addAll,
 						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_pi.PiListBullets, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Text, { children: "Add all columns" })]
 					}),
-					availableFields.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Separator, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.ItemGroup, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.ItemGroupLabel, {
+					groupedFields.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Separator, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.ItemGroup, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.ItemGroupLabel, {
 						fontWeight: "medium",
 						color: "gray.500",
 						fontSize: "xs",
 						children: "Data fields"
-					}), availableFields.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldMenuItem, {
-						field: col.field,
-						name: col.label,
-						fieldType: col.fieldType,
+					}), groupedFields.map((item) => isFileFieldGroup(item) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FileFieldSubmenu, {
+						group: item,
+						parentVisible: item.parentVisible,
 						onClick: columnsModel.showColumn
-					}, col.field))] })] }),
+					}, item.parent.field) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldMenuItem, {
+						field: item.field,
+						name: item.label,
+						fieldType: item.fieldType,
+						onClick: columnsModel.showColumn
+					}, item.field))] })] }),
 					availableSystemFields.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.Separator, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.ItemGroup, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Menu.ItemGroupLabel, {
 						fontWeight: "medium",
 						color: "gray.500",
@@ -12670,8 +12816,12 @@ const RowActionMenuItems = ({ rowId, testIdPrefix, onSelect, onDuplicate, onDele
 
 //#endregion
 //#region src/table-editor/Table/ui/RowActionOverlay.tsx
-const RowActionOverlay = ({ rowId, onOpen, onSelect, onDuplicate, onDelete }) => {
+const RowActionOverlay = ({ rowId, onOpen, onPick, onSelect, onDuplicate, onDelete }) => {
 	const [isMenuOpen, setIsMenuOpen] = (0, react.useState)(false);
+	const primaryAction = onPick ?? onOpen;
+	const primaryIcon = onPick ? react_icons_pi.PiCheckSquare : react_icons_pi.PiArrowSquareRightLight;
+	const primaryTestId = onPick ? `row-action-pick-${rowId}` : `row-action-open-${rowId}`;
+	const hasMenuItems = Boolean(onOpen || onSelect || onDuplicate || onDelete);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Flex, {
 		position: "absolute",
 		right: "8px",
@@ -12689,7 +12839,7 @@ const RowActionOverlay = ({ rowId, onOpen, onSelect, onDuplicate, onDelete }) =>
 			boxShadow: "0px 2px 8px rgba(0,0,0,0.16)",
 			overflow: "hidden",
 			"data-testid": `row-action-split-${rowId}`,
-			children: [onOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Flex, {
+			children: [primaryAction && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Flex, {
 				alignItems: "center",
 				justifyContent: "center",
 				height: "100%",
@@ -12699,15 +12849,15 @@ const RowActionOverlay = ({ rowId, onOpen, onSelect, onDuplicate, onDelete }) =>
 				_hover: { bg: "gray.100" },
 				onClick: (e) => {
 					e.stopPropagation();
-					onOpen(rowId);
+					primaryAction(rowId);
 				},
-				"data-testid": `row-action-open-${rowId}`,
+				"data-testid": primaryTestId,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Icon, {
 					boxSize: "20px",
 					color: "gray.400",
-					as: react_icons_pi.PiArrowSquareRightLight
+					as: primaryIcon
 				})
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.Root, {
+			}), hasMenuItems && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Menu.Root, {
 				lazyMount: true,
 				unmountOnExit: true,
 				onOpenChange: ({ open }) => setIsMenuOpen(open),
@@ -12721,7 +12871,7 @@ const RowActionOverlay = ({ rowId, onOpen, onSelect, onDuplicate, onDelete }) =>
 						width: "18px",
 						minWidth: "18px",
 						cursor: "pointer",
-						borderLeft: onOpen ? "1px solid" : void 0,
+						borderLeft: primaryAction ? "1px solid" : void 0,
 						borderColor: "gray.100",
 						_hover: { bg: "gray.100" },
 						onClick: (e) => e.stopPropagation(),
@@ -12847,8 +12997,8 @@ function getCellBoxShadow(isSticky, side) {
 	if (!isSticky) return BOTTOM_BORDER_SHADOW;
 	return `${BOTTOM_BORDER_SHADOW}, ${side === "left" ? `inset -1px 0 0 0 ${CELL_BORDER_COLOR}` : `inset 1px 0 0 0 ${CELL_BORDER_COLOR}`}`;
 }
-const DataRow = (0, mobx_react_lite.observer)(({ row, columnsModel, showSelection, onSearchForeignKey, onUploadFile, onOpenFile, onOpenRow, onSelectRow, onDuplicateRow, onDeleteRow }) => {
-	const hasRowActions = Boolean(onOpenRow || onSelectRow || onDuplicateRow || onDeleteRow);
+const DataRow = (0, mobx_react_lite.observer)(({ row, columnsModel, showSelection, onSearchForeignKey, onUploadFile, onOpenFile, onOpenRow, onPickRow, onSelectRow, onDuplicateRow, onDeleteRow }) => {
+	const hasRowActions = Boolean(onOpenRow || onPickRow || onSelectRow || onDuplicateRow || onDeleteRow);
 	const selectionWidth = showSelection ? SELECTION_COLUMN_WIDTH : 0;
 	const addColumnStickyRight = columnsModel.hasHiddenColumns;
 	const addColOffset = addColumnStickyRight ? ADD_COLUMN_BUTTON_WIDTH : 0;
@@ -12895,6 +13045,7 @@ const DataRow = (0, mobx_react_lite.observer)(({ row, columnsModel, showSelectio
 				}), showOverlay && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RowActionOverlay, {
 					rowId: row.rowId,
 					onOpen: onOpenRow,
+					onPick: onPickRow,
 					onSelect: onSelectRow,
 					onDuplicate: onDuplicateRow,
 					onDelete: onDeleteRow
@@ -12927,45 +13078,48 @@ const SelectionToolbar = (0, mobx_react_lite.observer)(({ selection, allRowIds,
 	const isAllSelected = selection.isAllSelected(allRowIds);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.ActionBar.Root, {
 		open: selection.isSelectionMode,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.ActionBar.Positioner, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.ActionBar.Content, {
-			"data-testid": "selection-toolbar",
-			children: [
-				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.ActionBar.SelectionTrigger, { children: [selection.selectedCount, " selected"] }),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.ActionBar.Separator, {}),
-				!isAllSelected && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Button, {
-					variant: "outline",
-					size: "sm",
-					onClick: () => selection.selectAll(allRowIds),
-					"data-testid": "select-all",
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_pi.PiCheckSquare, {}), "Select all"]
-				}),
-				onDuplicate && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Button, {
-					variant: "outline",
-					size: "sm",
-					onClick: () => onDuplicate(selection.selectedIds),
-					"data-testid": "duplicate-selected",
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_lu.LuCopy, {}), "Duplicate"]
-				}),
-				onDelete && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Button, {
-					variant: "outline",
-					size: "sm",
-					onClick: () => onDelete(selection.selectedIds),
-					"data-testid": "delete-selected",
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_lu.LuTrash2, {}), "Delete"]
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.ActionBar.CloseTrigger, {
-					asChild: true,
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Button, {
-						variant: "ghost",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.ActionBar.Positioner, {
+			zIndex: 5,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.ActionBar.Content, {
+				"data-testid": "selection-toolbar",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.ActionBar.SelectionTrigger, { children: [selection.selectedCount, " selected"] }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.ActionBar.Separator, {}),
+					!isAllSelected && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Button, {
+						variant: "outline",
 						size: "sm",
-						"aria-label": "Exit selection",
-						onClick: () => selection.exitSelectionMode(),
-						"data-testid": "exit-selection",
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_pi.PiX, {})
+						onClick: () => selection.selectAll(allRowIds),
+						"data-testid": "select-all",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_pi.PiCheckSquare, {}), "Select all"]
+					}),
+					onDuplicate && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Button, {
+						variant: "outline",
+						size: "sm",
+						onClick: () => onDuplicate(selection.selectedIds),
+						"data-testid": "duplicate-selected",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_lu.LuCopy, {}), "Duplicate"]
+					}),
+					onDelete && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Button, {
+						variant: "outline",
+						size: "sm",
+						onClick: () => onDelete(selection.selectedIds),
+						"data-testid": "delete-selected",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_lu.LuTrash2, {}), "Delete"]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.ActionBar.CloseTrigger, {
+						asChild: true,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Button, {
+							variant: "ghost",
+							size: "sm",
+							"aria-label": "Exit selection",
+							onClick: () => selection.exitSelectionMode(),
+							"data-testid": "exit-selection",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_icons_pi.PiX, {})
+						})
 					})
-				})
-			]
-		}) }) })
+				]
+			})
+		}) })
 	});
 });
 
@@ -13182,7 +13336,7 @@ const baseComponents = {
 	Table: TableComponent,
 	TableRow: TableRowComponent
 };
-const TableWidget = (0, mobx_react_lite.observer)(({ rows, columnsModel, cellFSM, selection, sortModel, filterModel, onSearchForeignKey, onUploadFile, onOpenFile, onOpenRow, onDeleteSelected, onDuplicateSelected, onDeleteRow, onDuplicateRow, onCopyPath, onEndReached, isLoadingMore, useWindowScroll: useWindowScrollProp }) => {
+const TableWidget = (0, mobx_react_lite.observer)(({ rows, columnsModel, cellFSM, selection, sortModel, filterModel, onSearchForeignKey, onUploadFile, onOpenFile, onOpenRow, onPickRow, onDeleteSelected, onDuplicateSelected, onDeleteRow, onDuplicateRow, onCopyPath, onEndReached, isLoadingMore, useWindowScroll: useWindowScrollProp }) => {
 	const showSelection = selection.isSelectionMode;
 	const allRowIds = rows.map((r) => r.rowId);
 	const [deleteConfirm, setDeleteConfirm] = (0, react.useState)(null);
@@ -13309,6 +13463,7 @@ const TableWidget = (0, mobx_react_lite.observer)(({ rows, columnsModel, cellFSM
 		onUploadFile,
 		onOpenFile,
 		onOpenRow,
+		onPickRow,
 		onSelectRow: canSelect ? handleSelectRow : void 0,
 		onDuplicateRow: canDuplicateRow ? onDuplicateRow : void 0,
 		onDeleteRow: canDeleteRow ? handleDeleteRowRequest : void 0
@@ -13319,6 +13474,7 @@ const TableWidget = (0, mobx_react_lite.observer)(({ rows, columnsModel, cellFSM
 		onUploadFile,
 		onOpenFile,
 		onOpenRow,
+		onPickRow,
 		canSelect,
 		canDeleteRow,
 		canDuplicateRow,
@@ -14149,6 +14305,7 @@ const TableEditor = (0, mobx_react_lite.observer)(({ viewModel, useWindowScroll
 					isLoadingMore: viewModel.isLoadingMore,
 					onEndReached: viewModel.loadMore,
 					onOpenRow: callbacks.onOpenRow,
+					onPickRow: callbacks.onPickRow,
 					onDeleteRow: isReadonly ? void 0 : (id) => viewModel.deleteRows([id]),
 					onDuplicateRow: isReadonly ? void 0 : callbacks.onDuplicateRow,
 					onDeleteSelected: isReadonly ? void 0 : (ids) => viewModel.deleteRows(ids),
@@ -14264,6 +14421,8 @@ exports.getDefaultOperator = getDefaultOperator;
 exports.getLabelByRef = getLabelByRef;
 exports.getOperatorLabel = getOperatorLabel;
 exports.getOperatorsForType = getOperatorsForType;
+exports.groupFileFields = groupFileFields;
+exports.isFileFieldGroup = isFileFieldGroup;
 exports.operatorRequiresValue = operatorRequiresValue;
 exports.selectDefaultColumns = selectDefaultColumns;
 exports.typeMenuGroups = typeMenuGroups;