@linzjs/step-ag-grid 22.1.0 → 22.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.css CHANGED
@@ -435,6 +435,7 @@
435
435
 
436
436
  .GridCellAlignCenter .GridCell-container {
437
437
  display: flex;
438
+ justify-content: center;
438
439
  }
439
440
 
440
441
  .GridCellAlignCenter .ag-wrapper {
@@ -0,0 +1,12 @@
1
+ import { ICellEditorParams } from "ag-grid-community";
2
+ import { ColDefT } from "../GridCell";
3
+ import { GenericCellColDef } from "../gridRender";
4
+ import { GridBaseRow } from "../Grid";
5
+ export interface GridButtonProps<TData> {
6
+ visible?: (cellEditorParams: ICellEditorParams) => boolean;
7
+ onClick?: (props: {
8
+ selectedRows: TData[];
9
+ selectedRowIds: (string | number)[];
10
+ }) => void;
11
+ }
12
+ export declare const GridButton: <TData extends GridBaseRow>(colDef: GenericCellColDef<TData, boolean>, editor: GridButtonProps<TData>) => ColDefT<TData>;
@@ -1,3 +1,4 @@
1
+ export * from "./GridButton";
1
2
  export * from "./GridEditBoolean";
2
3
  export * from "./GridPopoutEditMultiSelect";
3
4
  export * from "./GridPopoutEditMultiSelectGrid";
@@ -4435,6 +4435,41 @@ const GridFormTextInput = (props) => {
4435
4435
  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 }) }));
4436
4436
  };
4437
4437
 
4438
+ const ButtonCellRenderer = (props) => {
4439
+ const { data, node, column, colDef, api } = props;
4440
+ const inputRef = React.useRef(null);
4441
+ React.useEffect(() => {
4442
+ const checkFocus = (event) => {
4443
+ if (event.rowIndex === node.rowIndex && event.column === column) {
4444
+ inputRef.current?.focus();
4445
+ }
4446
+ };
4447
+ api.addEventListener("cellFocused", checkFocus);
4448
+ return () => {
4449
+ api.removeEventListener("cellFocused", checkFocus);
4450
+ };
4451
+ }, [api, column, node.rowIndex]);
4452
+ return (jsxRuntime.jsx(lui.LuiButton, { ref: inputRef, className: "lui-button-icon-only", size: "sm", level: "text", onClick: () => {
4453
+ const selectedRows = [data];
4454
+ const selectedRowIds = selectedRows.map((r) => r.id);
4455
+ colDef?.cellEditorParams.onClick?.({ selectedRows, selectedRowIds });
4456
+ }, style: { display: colDef?.cellEditorParams?.visible?.(props) !== false ? "" : "none" }, children: jsxRuntime.jsx(lui.LuiIcon, { name: "ic_redo", alt: "revert", size: "md" }) }));
4457
+ };
4458
+ const GridButton = (colDef, editor) => {
4459
+ return GridCell({
4460
+ minWidth: 72,
4461
+ maxWidth: 72,
4462
+ resizable: false,
4463
+ headerClass: "GridHeaderAlignCenter",
4464
+ cellClass: "GridCellAlignCenter",
4465
+ cellRenderer: ButtonCellRenderer,
4466
+ cellEditorParams: {
4467
+ ...editor,
4468
+ },
4469
+ ...colDef,
4470
+ });
4471
+ };
4472
+
4438
4473
  const BooleanCellRenderer = (props) => {
4439
4474
  const { onValueChange, value, api, node, column, colDef, data } = props;
4440
4475
  const inputRef = React.useRef(null);
@@ -5345,6 +5380,7 @@ exports.FocusableItem = FocusableItem;
5345
5380
  exports.FormError = FormError;
5346
5381
  exports.GenericCellEditorComponentWrapper = GenericCellEditorComponentWrapper;
5347
5382
  exports.Grid = Grid;
5383
+ exports.GridButton = GridButton;
5348
5384
  exports.GridCell = GridCell;
5349
5385
  exports.GridCellFiller = GridCellFiller;
5350
5386
  exports.GridCellFillerColId = GridCellFillerColId;