@revisium/schema-toolkit-ui 0.6.6 → 0.6.8

package/dist/index.cjs

@@ -6681,11 +6681,25 @@ const FileRendererComponent = (0, mobx_react_lite.observer)(({ node }) => {
 	});
 });
 
+//#endregion
+//#region src/hooks/useAutoResize.ts
+const MIN_HEIGHT = 120;
+function useAutoResize(value) {
+	const ref = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		const el = ref.current;
+		if (!el) return;
+		el.style.height = "auto";
+		el.style.height = `${Math.max(el.scrollHeight, MIN_HEIGHT)}px`;
+	}, [value]);
+	return ref;
+}
+
 //#endregion
 //#region src/row-editor/ui/editors/MarkdownEditor.tsx
 const MarkdownEditor = ({ value, setValue, readonly, dataTestId }) => {
 	const [internalValue, setInternalValue] = (0, react.useState)(value);
-	const textareaRef = (0, react.useRef)(null);
+	const textareaRef = useAutoResize(internalValue);
 	(0, react.useEffect)(() => {
 		setInternalValue(value);
 	}, [value]);
@@ -6710,6 +6724,7 @@ const MarkdownEditor = ({ value, setValue, readonly, dataTestId }) => {
 			lineHeight: "1.5",
 			minHeight: "120px",
 			resize: "vertical",
+			overflow: "hidden",
 			borderColor: "gray.200",
 			_focus: {
 				borderColor: "blue.400",
@@ -7063,7 +7078,7 @@ function resolveRefColumn(child, fieldPath) {
 			systemFieldId: systemDef.id,
 			isDeprecated,
 			hasFormula,
-			isSortable: !isDeprecated && !hasFormula
+			isSortable: !isDeprecated
 		};
 	}
 	if (refValue === _revisium_schema_toolkit.SystemSchemaIds.File) return resolveFileRefColumns(child, fieldPath);
@@ -7089,7 +7104,8 @@ function stripDataPrefix(fieldPath) {
 }
 function createColumn(fieldPath, child, fieldType) {
 	const isDeprecated = child.metadata().deprecated ?? false;
-	const hasFormula = child.hasFormula();
+	const formula = child.formula();
+	const hasFormula = formula !== void 0;
 	return {
 		field: fieldPath,
 		label: stripDataPrefix(fieldPath),
@@ -7097,7 +7113,8 @@ function createColumn(fieldPath, child, fieldType) {
 		isSystem: false,
 		isDeprecated,
 		hasFormula,
-		isSortable: !isDeprecated && !hasFormula && fieldType !== FilterFieldType.File
+		formulaExpression: formula?.expression(),
+		isSortable: !isDeprecated && fieldType !== FilterFieldType.File
 	};
 }
 
@@ -13658,6 +13675,35 @@ const RowActionsMenu = ({ rowId, onSelect, onDuplicate, onDelete }) => {
 	});
 };
 
+//#endregion
+//#region src/table-editor/Status/model/CellInfoModel.ts
+var CellInfoModel = class {
+	_cellFSM;
+	_columnsModel;
+	constructor(cellFSM, columnsModel) {
+		this._cellFSM = cellFSM;
+		this._columnsModel = columnsModel;
+		(0, mobx.makeAutoObservable)(this, {}, { autoBind: true });
+	}
+	get _focusedColumn() {
+		const focused = this._cellFSM.focusedCell;
+		if (!focused) return null;
+		return this._columnsModel.allColumns.find((c) => c.field === focused.field) ?? null;
+	}
+	get isVisible() {
+		return this._focusedColumn !== null && !this._cellFSM.hasSelection;
+	}
+	get fieldLabel() {
+		return this._focusedColumn?.label ?? "";
+	}
+	get formulaExpression() {
+		return this._focusedColumn?.formulaExpression;
+	}
+	get foreignKeyTableId() {
+		return this._focusedColumn?.foreignKeyTableId;
+	}
+};
+
 //#endregion
 //#region src/table-editor/Status/model/RowCountModel.ts
 var RowCountModel = class {
@@ -13771,6 +13817,7 @@ var TableEditorCore = class {
 	cellFSM;
 	selection;
 	rowCount;
+	cellInfo;
 	_dataSource;
 	_pageSize;
 	_breadcrumbs;
@@ -13799,6 +13846,7 @@ var TableEditorCore = class {
 		this.cellFSM = new CellFSM();
 		this.selection = new SelectionModel();
 		this.rowCount = new RowCountModel();
+		this.cellInfo = new CellInfoModel(this.cellFSM, this.columns);
 		this.columns.setOnChange(() => this._handleColumnsChange());
 		this.filters.setOnChange(() => this._handleFilterChange());
 		this.filters.setOnApply((_where) => this._handleFilterApply());
@@ -14143,6 +14191,50 @@ var MockDataSource = class {
 	}
 };
 
+//#endregion
+//#region src/table-editor/Status/ui/CellInfoWidget.tsx
+const CellInfoWidget = (0, mobx_react_lite.observer)(({ model }) => {
+	if (!model.isVisible) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Flex, {
+		alignItems: "center",
+		gap: 2,
+		overflow: "hidden",
+		flexShrink: 1,
+		minW: 0,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_chakra_ui_react.Text, {
+				fontSize: "sm",
+				color: "gray.500",
+				overflow: "hidden",
+				textOverflow: "ellipsis",
+				whiteSpace: "nowrap",
+				"data-testid": "cell-info-field",
+				children: model.fieldLabel
+			}),
+			model.formulaExpression && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Text, {
+				fontSize: "sm",
+				color: "purple.400",
+				fontFamily: "mono",
+				overflow: "hidden",
+				textOverflow: "ellipsis",
+				whiteSpace: "nowrap",
+				"data-testid": "cell-info-formula",
+				children: ["= ", model.formulaExpression]
+			}),
+			model.foreignKeyTableId && !model.formulaExpression && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Text, {
+				fontSize: "sm",
+				color: "blue.400",
+				fontFamily: "mono",
+				overflow: "hidden",
+				textOverflow: "ellipsis",
+				whiteSpace: "nowrap",
+				"data-testid": "cell-info-fk",
+				children: ["→ ", model.foreignKeyTableId]
+			})
+		]
+	});
+});
+
 //#endregion
 //#region src/table-editor/Status/ui/RowCountWidget.tsx
 const RowCountWidget = (0, mobx_react_lite.observer)(({ model }) => {
@@ -14325,14 +14417,24 @@ const TableEditor = (0, mobx_react_lite.observer)(({ viewModel, useWindowScroll
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Flex, {
 				px: 3,
 				py: 2,
-				justifyContent: "space-between",
+				alignItems: "center",
+				overflow: "hidden",
 				...useWindowScroll && {
 					position: "sticky",
 					bottom: 0,
 					bg: "white",
 					zIndex: 3
 				},
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RowCountWidget, { model: viewModel.rowCount }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ViewSettingsBadge, { model: viewModel.viewBadge })]
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RowCountWidget, { model: viewModel.rowCount }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_chakra_ui_react.Flex, {
+					alignItems: "center",
+					gap: 3,
+					overflow: "hidden",
+					flexShrink: 1,
+					minW: 0,
+					flex: 1,
+					justifyContent: "flex-end",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CellInfoWidget, { model: viewModel.cellInfo }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ViewSettingsBadge, { model: viewModel.viewBadge })]
+				})]
 			})
 		]
 	});