@postxl/ui-components 1.3.9 → 1.3.11

package/dist/index.js

@@ -3926,11 +3926,12 @@ const DataGridRow = React$29.memo(DataGridRowImpl, (prev, next) => {
 	}
 	if (prev.selectionSize !== next.selectionSize) return false;
 	if (prev.visibleColumnIds !== next.visibleColumnIds) return false;
+	if (prev.columnPinningKey !== next.columnPinningKey) return false;
 	if (prev.isHighlighted !== next.isHighlighted) return false;
 	if (prev.columnDefsVersion !== next.columnDefsVersion) return false;
 	return true;
 });
-function DataGridRowImpl({ row, virtualRowIndex, virtualStart, rowVirtualizer, rowMapRef, rowHeight, focusedCell, editingCell: _editingCell, selectionSize: _selectionSize, visibleColumnIds: _visibleColumnIds, columnDefsVersion: _columnDefsVersion, isHighlighted = false, onRowClick, ref, className,...props }) {
+function DataGridRowImpl({ row, virtualRowIndex, virtualStart, rowVirtualizer, rowMapRef, rowHeight, focusedCell, editingCell: _editingCell, selectionSize: _selectionSize, visibleColumnIds: _visibleColumnIds, columnPinningKey: _columnPinningKey, columnDefsVersion: _columnDefsVersion, isHighlighted = false, onRowClick, ref, className,...props }) {
 	const rowRef = useComposedRefs(ref, (node) => {
 		if (node && typeof virtualRowIndex !== "undefined") {
 			rowVirtualizer.measureElement(node);
@@ -4132,7 +4133,7 @@ function DataGridSearchImpl({ searchMatches, matchIndex, searchOpen, onSearchOpe
 
 //#endregion
 //#region src/data-grid/data-grid.tsx
-function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirtualizer, height, searchState, columnSizeVars, onRowAdd, className,...props }) {
+function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirtualizer, height, forceHeight = false, searchState, columnSizeVars, onRowAdd, className,...props }) {
 	const rows = table.getRowModel().rows;
 	const columns = table.getAllColumns();
 	const meta = table.options.meta;
@@ -4144,6 +4145,8 @@ function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirt
 	const onRowClick = meta?.onRowClick;
 	const columnDefsVersion = meta?.columnDefsVersion ?? 0;
 	const visibleColumnIds = table.getVisibleLeafColumns().map((c) => c.id).join(",");
+	const pinningState = table.getState().columnPinning;
+	const columnPinningKey = `${(pinningState.left ?? []).join(",")}|${(pinningState.right ?? []).join(",")}`;
 	const prevVisibleColumnIdsRef = React$25.useRef(visibleColumnIds);
 	if (prevVisibleColumnIdsRef.current !== visibleColumnIds) {
 		rowMapRef.current.clear();
@@ -4181,10 +4184,10 @@ function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirt
 				"data-slot": "grid",
 				tabIndex: 0,
 				ref: dataGridRef,
-				className: "relative grid select-none overflow-auto rounded-md border border-border focus:outline-none",
+				className: cn("relative grid select-none overflow-auto rounded-md border border-border focus:outline-none", forceHeight && "content-start"),
 				style: {
 					...columnSizeVars,
-					height: `${Math.min(rowVirtualizer.getTotalSize() + headerHeight + footerHeight + scrollbarHeight + 3, height ?? Infinity)}px`
+					height: `${forceHeight && height ? height : Math.min(rowVirtualizer.getTotalSize() + headerHeight + footerHeight + scrollbarHeight + 3, height ?? Infinity)}px`
 				},
 				onContextMenu: onGridContextMenu,
 				children: [
@@ -4255,6 +4258,7 @@ function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirt
 								editingCell,
 								selectionSize,
 								visibleColumnIds,
+								columnPinningKey,
 								columnDefsVersion,
 								isHighlighted: highlightedRowIndex === virtualItem.index,
 								onRowClick
@@ -5633,6 +5637,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
 		setRenameValue("");
 		setDeletingViewId(null);
 		setUpdatingViewId(null);
+		setSearchQuery("");
 	}
 	const tableColumnOrder = table.getState().columnOrder;
 	React$14.useEffect(() => {
@@ -6005,6 +6010,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
 					isCreating ? /* @__PURE__ */ jsxs("div", {
 						className: "px-2 pb-2 space-y-1",
 						children: [/* @__PURE__ */ jsx(Input, {
+							variant: "simple",
 							value: newViewName,
 							onChange: (e) => setNewViewName(e.target.value),
 							onKeyDown: (e) => {
@@ -6027,7 +6033,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
 									"Share with all users"
 								]
 							}), /* @__PURE__ */ jsxs("div", {
-								className: "flex items-center gap-1",
+								className: "ml-auto flex items-center gap-1 py-1",
 								children: [/* @__PURE__ */ jsx(Button, {
 									variant: "ghost",
 									size: "sm",
@@ -6098,7 +6104,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
 									}),
 									/* @__PURE__ */ jsx("span", {
 										className: "truncate",
-										children: column.columnDef.meta?.label ?? column.id
+										children: column.columnDef.meta?.label ?? (typeof column.columnDef.header === "string" ? column.columnDef.header : column.id)
 									}),
 									/* @__PURE__ */ jsx(CheckIcon$1, { className: cn(
 										"ml-auto size-4 shrink-0",
@@ -6681,6 +6687,13 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
 		debouncedRowClick
 	]);
 	const onCellEditingStart = React$13.useCallback((rowIndex, columnId) => {
+		const col = tableRef.current?.getColumn(columnId);
+		const editable = col?.columnDef?.meta?.editable;
+		if (editable === false) return;
+		if (typeof editable === "function") {
+			const row = tableRef.current?.getRowModel().rows[rowIndex]?.original;
+			if (row && !editable(row)) return;
+		}
 		store.batch(() => {
 			store.setState("focusedCell", {
 				rowIndex,