@linzjs/step-ag-grid 7.5.1 → 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.
- package/dist/index.js +4 -4
- package/dist/index.js.map +1 -1
- package/dist/src/components/Grid.d.ts +1 -1
- package/dist/src/lui/ActionButton.d.ts +3 -3
- package/dist/step-ag-grid.esm.js +4 -4
- package/dist/step-ag-grid.esm.js.map +1 -1
- package/package.json +2 -2
- package/src/components/Grid.tsx +2 -2
- package/src/lui/ActionButton.scss +20 -8
- package/src/lui/ActionButton.tsx +6 -10
- package/src/stories/components/ActionButton.stories.tsx +9 -1
- package/src/stories/grid/GridPopoutBearing.stories.tsx +1 -0
|
@@ -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?:
|
|
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;
|
package/dist/step-ag-grid.esm.js
CHANGED
|
@@ -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
|
|
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
|
};
|
|
@@ -4334,7 +4334,7 @@ var GridFormSubComponentTextArea = function (props) {
|
|
|
4334
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 }) })));
|
|
4335
4335
|
};
|
|
4336
4336
|
|
|
4337
|
-
var css_248z = ".ActionButton{align-items:center;display:flex}.ActionButton-minimal{padding-right:38px
|
|
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%}";
|
|
4338
4338
|
styleInject(css_248z);
|
|
4339
4339
|
|
|
4340
4340
|
/**
|
|
@@ -4417,7 +4417,7 @@ var ActionButton = function (_a) {
|
|
|
4417
4417
|
inProgress ? setLocalInProgress(true) : setLocalInProgressDeferred(false, minimumInProgressTimeMs);
|
|
4418
4418
|
}, [inProgress, lastInProgress, setLocalInProgress, setLocalInProgressDeferred]);
|
|
4419
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 }))] })));
|
|
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"
|
|
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 () {
|
|
4421
4421
|
var promise, isPromise;
|
|
4422
4422
|
return __generator(this, function (_a) {
|
|
4423
4423
|
switch (_a.label) {
|
|
@@ -4448,7 +4448,7 @@ var ActionButton = function (_a) {
|
|
|
4448
4448
|
},
|
|
4449
4449
|
role: "status",
|
|
4450
4450
|
"aria-label": "Loading"
|
|
4451
|
-
} })) : (jsx(LuiIcon, { name: icon, alt: (_d = ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : name) !== null && _d !== void 0 ? _d : "", size: size
|
|
4451
|
+
} })) : (jsx(LuiIcon, { name: icon, alt: (_d = ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : name) !== null && _d !== void 0 ? _d : "", size: size })), iconPosition === "left" && buttonText] })));
|
|
4452
4452
|
};
|
|
4453
4453
|
|
|
4454
4454
|
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
|