@linzjs/step-ag-grid 22.1.1 → 22.2.0

package/dist/src/components/gridPopoverEdit/GridButton.d.ts

@@ -0,0 +1,12 @@
+import { ICellEditorParams } from "ag-grid-community";
+import { ColDefT } from "../GridCell";
+import { GenericCellColDef } from "../gridRender";
+import { GridBaseRow } from "../Grid";
+export interface GridButtonProps<TData> {
+    visible?: (cellEditorParams: ICellEditorParams) => boolean;
+    onClick?: (props: {
+        selectedRows: TData[];
+        selectedRowIds: (string | number)[];
+    }) => void;
+}
+export declare const GridButton: <TData extends GridBaseRow>(colDef: GenericCellColDef<TData, boolean>, editor: GridButtonProps<TData>) => ColDefT<TData>;

package/dist/src/components/gridPopoverEdit/index.d.ts

@@ -1,3 +1,4 @@
+export * from "./GridButton";
 export * from "./GridEditBoolean";
 export * from "./GridPopoutEditMultiSelect";
 export * from "./GridPopoutEditMultiSelectGrid";

package/dist/step-ag-grid.cjs.js

@@ -4435,6 +4435,41 @@ const GridFormTextInput = (props) => {
     return popoverWrapper(jsxRuntime.jsx("div", { style: { display: "flex", flexDirection: "row" }, className: "FormTest subComponent", children: jsxRuntime.jsx(TextInputFormatted, { value: value, onChange: (e) => setValue(e.target.value), error: invalid(), formatted: props.units, style: { width: props.width ?? 240 }, placeholder: props.placeholder ?? "Type here", helpText: helpText }) }));
 };
 
+const ButtonCellRenderer = (props) => {
+    const { data, node, column, colDef, api } = props;
+    const inputRef = React.useRef(null);
+    React.useEffect(() => {
+        const checkFocus = (event) => {
+            if (event.rowIndex === node.rowIndex && event.column === column) {
+                inputRef.current?.focus();
+            }
+        };
+        api.addEventListener("cellFocused", checkFocus);
+        return () => {
+            api.removeEventListener("cellFocused", checkFocus);
+        };
+    }, [api, column, node.rowIndex]);
+    return (jsxRuntime.jsx(lui.LuiButton, { ref: inputRef, className: "lui-button-icon-only", size: "sm", level: "text", onClick: () => {
+            const selectedRows = [data];
+            const selectedRowIds = selectedRows.map((r) => r.id);
+            colDef?.cellEditorParams.onClick?.({ selectedRows, selectedRowIds });
+        }, style: { display: colDef?.cellEditorParams?.visible?.(props) !== false ? "" : "none" }, children: jsxRuntime.jsx(lui.LuiIcon, { name: "ic_redo", alt: "revert", size: "md" }) }));
+};
+const GridButton = (colDef, editor) => {
+    return GridCell({
+        minWidth: 72,
+        maxWidth: 72,
+        resizable: false,
+        headerClass: "GridHeaderAlignCenter",
+        cellClass: "GridCellAlignCenter",
+        cellRenderer: ButtonCellRenderer,
+        cellEditorParams: {
+            ...editor,
+        },
+        ...colDef,
+    });
+};
+
 const BooleanCellRenderer = (props) => {
     const { onValueChange, value, api, node, column, colDef, data } = props;
     const inputRef = React.useRef(null);
@@ -5345,6 +5380,7 @@ exports.FocusableItem = FocusableItem;
 exports.FormError = FormError;
 exports.GenericCellEditorComponentWrapper = GenericCellEditorComponentWrapper;
 exports.Grid = Grid;
+exports.GridButton = GridButton;
 exports.GridCell = GridCell;
 exports.GridCellFiller = GridCellFiller;
 exports.GridCellFillerColId = GridCellFillerColId;