@linzjs/step-ag-grid 7.5.0 → 7.5.2

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.
@@ -5,7 +5,7 @@ export interface GridBaseRow {
5
5
  }
6
6
  export interface GridProps {
7
7
  selectable?: boolean;
8
- dataTestId?: string;
8
+ ["data-testid"]?: string;
9
9
  quickFilter?: boolean;
10
10
  quickFilterPlaceholder?: string;
11
11
  quickFilterValue?: string;
@@ -1,5 +1,5 @@
1
- /// <reference types="react" />
2
1
  import "./ActionButton.scss";
2
+ import { CSSProperties } from "react";
3
3
  import { IconName } from "@linzjs/lui/dist/components/LuiIcon/LuiIcon";
4
4
  import { LuiButtonProps } from "@linzjs/lui/dist/components/LuiButton/LuiButton";
5
5
  export interface ActionButtonProps {
@@ -11,9 +11,9 @@ export interface ActionButtonProps {
11
11
  dataTestId?: string;
12
12
  size?: "xs" | "sm" | "md" | "lg" | "xl" | "ns";
13
13
  iconPosition?: "left" | "right";
14
- className?: "ActionButton-fill" | string;
14
+ className?: "ActionButton-fill" | "ActionButton-tight" | string;
15
15
  onClick: () => Promise<void> | void;
16
16
  level?: LuiButtonProps["level"];
17
- style?: React.CSSProperties;
17
+ style?: CSSProperties;
18
18
  }
19
19
  export declare const ActionButton: ({ icon, name, inProgressName, dataTestId, style, className, title, onClick, size, iconPosition, level, "aria-label": ariaLabel, }: ActionButtonProps) => JSX.Element;
@@ -2815,7 +2815,7 @@ var Grid = function (params) {
2815
2815
  sizeColumnsToFit();
2816
2816
  }
2817
2817
  }, [columnDefs === null || columnDefs === void 0 ? void 0 : columnDefs.length, sizeColumnsToFit]);
2818
- return (jsxs("div", __assign({ "data-testid": params.dataTestId, className: clsx("Grid-container", "ag-theme-alpine", staleGrid && "Grid-sortIsStale") }, { children: [params.quickFilter && (jsx("div", __assign({ className: "Grid-quickFilter" }, { children: jsx("input", { "aria-label": "Search", className: "lui-margin-top-xxs lui-margin-bottom-xxs Grid-quickFilterBox", type: "text", placeholder: (_a = params.quickFilterPlaceholder) !== null && _a !== void 0 ? _a : "Search...", value: internalQuickFilter, onChange: function (event) {
2818
+ return (jsxs("div", __assign({ "data-testid": params["data-testid"], className: clsx("Grid-container", "ag-theme-alpine", staleGrid && "Grid-sortIsStale") }, { children: [params.quickFilter && (jsx("div", __assign({ className: "Grid-quickFilter" }, { children: jsx("input", { "aria-label": "Search", className: "lui-margin-top-xxs lui-margin-bottom-xxs Grid-quickFilterBox", type: "text", placeholder: (_a = params.quickFilterPlaceholder) !== null && _a !== void 0 ? _a : "Search...", value: internalQuickFilter, onChange: function (event) {
2819
2819
  setInternalQuickFilter(event.target.value);
2820
2820
  } }) }))), jsx(AgGridReact, { animateRows: params.animateRows, rowClassRules: params.rowClassRules, defaultColDef: params.defaultColDef, getRowId: function (params) { return "".concat(params.data.id); }, suppressRowClickSelection: true, rowSelection: "multiple", suppressBrowserResizeObserver: true, colResizeDefault: "shift", onFirstDataRendered: sizeColumnsToFit, onGridSizeChanged: sizeColumnsToFit, suppressClickEdit: true, onCellKeyPress: onCellKeyPress, onCellClicked: onCellClicked, onCellDoubleClicked: onCellDoubleClick, onCellEditingStarted: refreshSelectedRows, onCellEditingStopped: onCellEditingStopped, domLayout: params.domLayout, columnDefs: columnDefs, rowData: params.rowData, noRowsOverlayComponent: noRowsOverlayComponent, onGridReady: onGridReady, onSortChanged: ensureSelectedRowIsVisible, postSortRows: (_b = params.postSortRows) !== null && _b !== void 0 ? _b : postSortRows, onSelectionChanged: synchroniseExternalStateToGridSelection })] })));
2821
2821
  };
@@ -3357,7 +3357,7 @@ var GridFormDropDown = function (props) {
3357
3357
  return (jsxs("div", __assign({ style: { display: "flex", flexDirection: "column", width: "100%" } }, { children: [jsx("input", { autoFocus: true, className: "LuiTextInput-input", ref: ref, type: "text", placeholder: (_b = props.filterPlaceholder) !== null && _b !== void 0 ? _b : "Placeholder", "data-testid": "filteredMenu-free-text-input", defaultValue: filter, "data-disableenterautosave": true, "data-allowtabtosave": true, onChange: function (e) { return setFilter(e.target.value); }, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp }), props.filterHelpText && isNotEmpty(filter) && (jsx(FormError, { error: null, helpText: props.filterHelpText }))] })));
3358
3358
  } })), jsx(MenuDivider, {}, "$$divider_filter")] }))), jsx(ComponentLoadingWrapper, __assign({ loading: !options, className: "GridFormDropDown-options" }, { children: jsxs(Fragment$1, { children: [options && options.length == (filteredValues === null || filteredValues === void 0 ? void 0 : filteredValues.length) && (jsx(MenuItem, __assign({ className: "GridPopoverEditDropDown-noOptions" }, { children: "No Options" }), "".concat(fieldToString(field), "-empty"))), options === null || options === void 0 ? void 0 : options.map(function (item, index) {
3359
3359
  var _a;
3360
- return item.value === MenuSeparatorString ? (jsx(MenuDivider, {}, "$$divider_".concat(index))) : item.value === MenuHeaderString ? (jsx(MenuHeader, { children: item.label }, "$$header_".concat(index))) : filteredValues.includes(item.value) ? null : (jsxs("div", { children: [jsx(MenuItem, __assign({ disabled: !!item.disabled, title: item.disabled && typeof item.disabled !== "boolean" ? item.disabled : "", value: item.value, onClick: function (e) {
3360
+ return item.value === MenuSeparatorString ? (jsx(MenuDivider, {}, "$$divider_".concat(index))) : item.value === MenuHeaderString ? (jsx(MenuHeader, { children: item.label }, "$$header_".concat(index))) : filteredValues.includes(item.value) ? null : (jsxs("div", { children: [jsxs(MenuItem, __assign({ disabled: !!item.disabled, title: item.disabled && typeof item.disabled !== "boolean" ? item.disabled : "", value: item.value, onClick: function (e) {
3361
3361
  if (item.subComponent) {
3362
3362
  // toggle selection
3363
3363
  setSelectedSubComponent(selectedSubComponent === item ? null : item);
@@ -3372,8 +3372,7 @@ var GridFormDropDown = function (props) {
3372
3372
  : CloseReason.TAB_FORWARD
3373
3373
  : CloseReason.CLICK).then();
3374
3374
  }
3375
- } }, { children: ((_a = item.label) !== null && _a !== void 0 ? _a : (item.value == null ? "<".concat(item.value, ">") : "".concat(item.value))) +
3376
- (item.subComponent ? "..." : "") }), "".concat(fieldToString(field), "-").concat(index)), item.subComponent && selectedSubComponent === item && (jsx(FocusableItem, __assign({ className: "LuiDeprecatedForms" }, { children: function (ref) { return (jsx(GridSubComponentContext.Provider, __assign({ value: {
3375
+ } }, { children: [(_a = item.label) !== null && _a !== void 0 ? _a : (item.value == null ? "<".concat(item.value, ">") : "".concat(item.value)), item.subComponent ? "..." : ""] }), "".concat(fieldToString(field), "-").concat(index)), item.subComponent && selectedSubComponent === item && (jsx(FocusableItem, __assign({ className: "LuiDeprecatedForms" }, { children: function (ref) { return (jsx(GridSubComponentContext.Provider, __assign({ value: {
3377
3376
  context: { options: options },
3378
3377
  data: data,
3379
3378
  value: subSelectedValue,
@@ -4335,7 +4334,7 @@ var GridFormSubComponentTextArea = function (props) {
4335
4334
  return (jsx("div", __assign({ className: clsx("FreeTextInput", props.className) }, { children: jsx(TextAreaInput, { className: "free-text-input", value: value, onChange: function (e) { return setValue(e.target.value); }, error: invalid(), helpText: helpText, autoFocus: true, placeholder: props.placeholder }) })));
4336
4335
  };
4337
4336
 
4338
- var css_248z = ".ActionButton{align-items:center;display:flex}.ActionButton-minimal{padding-right:38px!important}.ActionButton .LuiIcon{margin:0 4px!important}.ActionButton-minimalArea{position:relative}.ActionButton-minimalAreaDisplay{position:absolute}.ActionButton-minimalAreaExpand{visibility:hidden}.ActionButton-inProgress{background-color:#e2f3f7!important;color:#007198!important;cursor:progress}.ActionButton-inProgress svg *{fill:#0000!important}.ActionButton-fill{justify-content:center;width:100%}";
4337
+ var css_248z = ".ActionButton{align-items:center;display:flex}.ActionButton-minimal.lui-button-lg.lui-button-icon-right{padding-right:38px}.ActionButton.lui-button-lg.lui-button-icon-right:not(.ActionButton-tight) .LuiIcon{margin:0 4px}.ActionButton.ActionButton-tight.lui-button-lg.lui-button-icon-right .LuiIcon{margin:0}.ActionButton-iconOnly.lui-button-lg.lui-button-icon-right:not(.ActionButton-tight){padding:8px 5px}.ActionButton-iconOnly.lui-button-lg.lui-button-icon-right.ActionButton-tight{padding:0}.ActionButton-minimalArea{position:relative}.ActionButton-minimalAreaDisplay{position:absolute}.ActionButton-minimalAreaExpand{visibility:hidden}.ActionButton-inProgress.lui-button-lg.lui-button-icon-right{background-color:#e2f3f7;color:#007198;cursor:progress}.ActionButton-inProgress.lui-button-lg.lui-button-icon-right svg *{fill:#0000}.ActionButton-fill{justify-content:center;width:100%}";
4339
4338
  styleInject(css_248z);
4340
4339
 
4341
4340
  /**
@@ -4418,7 +4417,7 @@ var ActionButton = function (_a) {
4418
4417
  inProgress ? setLocalInProgress(true) : setLocalInProgressDeferred(false, minimumInProgressTimeMs);
4419
4418
  }, [inProgress, lastInProgress, setLocalInProgress, setLocalInProgressDeferred]);
4420
4419
  var buttonText = (jsxs("span", __assign({ className: "ActionButton-minimalArea" }, { children: [jsx("span", __assign({ className: "ActionButton-minimalAreaDisplay" }, { children: (_b = (localInProgress ? inProgressName : name)) !== null && _b !== void 0 ? _b : name })), jsx("span", __assign({ className: "ActionButton-minimalAreaExpand" }, { children: name }))] })));
4421
- return (jsxs(LuiButton, __assign({ "data-testid": dataTestId, type: "button", level: level, title: (_c = title !== null && title !== void 0 ? title : ariaLabel) !== null && _c !== void 0 ? _c : name, "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : name, className: clsx("lui-button-icon-right", "ActionButton", className, localInProgress && "ActionButton-inProgress", name != null && !(className === null || className === void 0 ? void 0 : className.includes("ActionButton-fill")) && "ActionButton-minimal"), size: "lg", style: __assign(__assign({}, (name == null && { padding: "8px 5px" })), style), onClick: function () { return __awaiter(void 0, void 0, void 0, function () {
4420
+ return (jsxs(LuiButton, __assign({ "data-testid": dataTestId, type: "button", level: level, title: (_c = title !== null && title !== void 0 ? title : ariaLabel) !== null && _c !== void 0 ? _c : name, "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : name, className: clsx("lui-button-icon-right", "ActionButton", className, localInProgress && "ActionButton-inProgress", name != null && !(className === null || className === void 0 ? void 0 : className.includes("ActionButton-fill")) && "ActionButton-minimal", name == null && "ActionButton-iconOnly"), size: "lg", style: style, onClick: function () { return __awaiter(void 0, void 0, void 0, function () {
4422
4421
  var promise, isPromise;
4423
4422
  return __generator(this, function (_a) {
4424
4423
  switch (_a.label) {
@@ -4449,7 +4448,7 @@ var ActionButton = function (_a) {
4449
4448
  },
4450
4449
  role: "status",
4451
4450
  "aria-label": "Loading"
4452
- } })) : (jsx(LuiIcon, { name: icon, alt: (_d = ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : name) !== null && _d !== void 0 ? _d : "", size: size, spanProps: { style: iconPosition === "right" ? { transform: "scaleX(-1)" } : {} } })), iconPosition === "left" && buttonText] })));
4451
+ } })) : (jsx(LuiIcon, { name: icon, alt: (_d = ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : name) !== null && _d !== void 0 ? _d : "", size: size })), iconPosition === "left" && buttonText] })));
4453
4452
  };
4454
4453
 
4455
4454
  function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {