@linzjs/step-ag-grid 7.0.0 → 7.0.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 +8 -8
- package/dist/index.js.map +1 -1
- package/dist/src/lui/ActionButton.d.ts +3 -2
- package/dist/step-ag-grid.esm.js +8 -8
- package/dist/step-ag-grid.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/GridCell.tsx +1 -1
- package/src/components/gridForm/GridFormDropDown.tsx +4 -3
- package/src/lui/ActionButton.scss +10 -0
- package/src/lui/ActionButton.tsx +11 -3
- package/src/react-menu3/components/ControlledMenu.tsx +1 -1
- package/src/stories/components/ActionButton.stories.tsx +2 -0
- package/src/stories/grid/FormTest.tsx +1 -1
- package/src/styles/GridFormDropDown.scss +4 -0
package/dist/index.js
CHANGED
|
@@ -1399,7 +1399,7 @@ var ControlledMenuFr = function (_a, externalRef) {
|
|
|
1399
1399
|
if (activeElement !== firstInputEl && activeElement !== lastInputEl)
|
|
1400
1400
|
return;
|
|
1401
1401
|
var isTextArea = activeElement.nodeName === "TEXTAREA";
|
|
1402
|
-
var suppressEnterAutoSave = activeElement.getAttribute("data-
|
|
1402
|
+
var suppressEnterAutoSave = activeElement.getAttribute("data-disableenterautosave") || isTextArea;
|
|
1403
1403
|
var allowTabToSave = activeElement.getAttribute("data-allowtabtoSave");
|
|
1404
1404
|
var invokeSave = function (reason) {
|
|
1405
1405
|
var _a, _b;
|
|
@@ -2887,7 +2887,7 @@ var GridCell = function (props, custom) {
|
|
|
2887
2887
|
})), { suppressKeyboardEvent: function (e) {
|
|
2888
2888
|
// It's important that aggrid doesn't trigger edit on enter
|
|
2889
2889
|
// as the incorrect selected rows will be returned
|
|
2890
|
-
return e.event.key
|
|
2890
|
+
return !["ArrowLeft", "ArrowRight", "ArrowDown", "ArrowUp", "Tab", " "].includes(e.event.key);
|
|
2891
2891
|
} }), ((custom === null || custom === void 0 ? void 0 : custom.editorParams) && {
|
|
2892
2892
|
cellEditorParams: __assign(__assign({}, custom.editorParams), { multiEdit: custom.multiEdit })
|
|
2893
2893
|
})), {
|
|
@@ -3010,7 +3010,7 @@ var GridRenderPopoutMenuCell = function (props) {
|
|
|
3010
3010
|
var css_248z$6 = ".GridMultiSelect-containerSmall .GridFormMultiSelect-options{max-height:130px;overflow-y:auto}.GridMultiSelect-containerMedium .GridFormMultiSelect-options{max-height:190px;overflow-y:auto}.GridMultiSelect-containerLarge .GridFormMultiSelect-options{max-height:320px;overflow-y:auto}.GridMultiSelect-containerUnlimited .GridFormMultiSelect-options{overflow-y:auto}";
|
|
3011
3011
|
styleInject(css_248z$6);
|
|
3012
3012
|
|
|
3013
|
-
var css_248z$5 = ".GridPopoverEditDropDown-containerSmall .GridFormDropDown-options{max-height:120px;overflow-y:auto}.GridPopoverEditDropDown-containerMedium .GridFormDropDown-options{max-height:220px;overflow-y:auto}.GridPopoverEditDropDown-containerLarge .GridFormDropDown-options{max-height:400px;overflow-y:auto}.GridPopoverEditDropDown-containerUnlimited .GridFormDropDown-options{overflow-y:auto}";
|
|
3013
|
+
var css_248z$5 = ".GridPopoverEditDropDown-containerSmall .GridFormDropDown-options{max-height:120px;overflow-y:auto}.GridPopoverEditDropDown-containerMedium .GridFormDropDown-options{max-height:220px;overflow-y:auto}.GridPopoverEditDropDown-containerLarge .GridFormDropDown-options{max-height:400px;overflow-y:auto}.GridPopoverEditDropDown-containerUnlimited .GridFormDropDown-options{overflow-y:auto}.GridPopoverEditDropDown-noOptions{justify-content:center}";
|
|
3014
3014
|
styleInject(css_248z$5);
|
|
3015
3015
|
|
|
3016
3016
|
/* global setTimeout, clearTimeout */
|
|
@@ -3281,8 +3281,8 @@ var GridFormDropDown = function (props) {
|
|
|
3281
3281
|
return popoverWrapper(jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [props.filtered && (jsxRuntime.jsxs("div", __assign({ className: "GridFormDropDown-filter" }, { children: [jsxRuntime.jsx(FocusableItem, __assign({ className: "filter-item" }, { children: function (_a) {
|
|
3282
3282
|
var _b;
|
|
3283
3283
|
var ref = _a.ref;
|
|
3284
|
-
return (jsxRuntime.jsx("div", __assign({ style: { display: "flex", width: "100%" } }, { children: jsxRuntime.jsx("input", { autoFocus: true, className: "
|
|
3285
|
-
} })), jsxRuntime.jsx(MenuDivider, {}, "$$divider_filter")] }))), jsxRuntime.jsx(ComponentLoadingWrapper, __assign({ loading: !options, className: "GridFormDropDown-options" }, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [options && options.length == (filteredValues === null || filteredValues === void 0 ? void 0 : filteredValues.length) && (jsxRuntime.jsx(MenuItem, { children: "
|
|
3284
|
+
return (jsxRuntime.jsx("div", __assign({ style: { display: "flex", width: "100%" } }, { children: jsxRuntime.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, onChange: function (e) { return setFilter(e.target.value.toLowerCase()); } }) })));
|
|
3285
|
+
} })), jsxRuntime.jsx(MenuDivider, {}, "$$divider_filter")] }))), jsxRuntime.jsx(ComponentLoadingWrapper, __assign({ loading: !options, className: "GridFormDropDown-options" }, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [options && options.length == (filteredValues === null || filteredValues === void 0 ? void 0 : filteredValues.length) && (jsxRuntime.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) {
|
|
3286
3286
|
var _a;
|
|
3287
3287
|
return item.value === MenuSeparatorString ? (jsxRuntime.jsx(MenuDivider, {}, "$$divider_".concat(index))) : item.value === MenuHeaderString ? (jsxRuntime.jsx(MenuHeader, { children: item.label }, "$$header_".concat(index))) : filteredValues.includes(item.value) ? null : (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs(MenuItem, __assign({ disabled: !!item.disabled, title: item.disabled && typeof item.disabled !== "boolean" ? item.disabled : "", value: item.value, onClick: function (e) {
|
|
3288
3288
|
if (item.subComponent) {
|
|
@@ -4212,7 +4212,7 @@ var GridFormSubComponentTextArea = function (props) {
|
|
|
4212
4212
|
return (jsxRuntime.jsx("div", __assign({ className: clsx("FreeTextInput LuiDeprecatedForms", props.className) }, { children: jsxRuntime.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 }) })));
|
|
4213
4213
|
};
|
|
4214
4214
|
|
|
4215
|
-
var css_248z = ".ActionButton{align-items:center;display:flex}.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}";
|
|
4215
|
+
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%}";
|
|
4216
4216
|
styleInject(css_248z);
|
|
4217
4217
|
|
|
4218
4218
|
/**
|
|
@@ -4285,7 +4285,7 @@ var useStateDeferred = function (initialValue) {
|
|
|
4285
4285
|
var minimumInProgressTimeMs = 950;
|
|
4286
4286
|
var ActionButton = function (_a) {
|
|
4287
4287
|
var _b, _c, _d;
|
|
4288
|
-
var icon = _a.icon, name = _a.name, inProgressName = _a.inProgressName, dataTestId = _a.dataTestId, className = _a.className, title = _a.title, onAction = _a.onAction, externalSetInProgress = _a.externalSetInProgress, _e = _a.size, size = _e === void 0 ? "sm" : _e, _f = _a.iconPosition, iconPosition = _f === void 0 ? "left" : _f, _g = _a.level, level = _g === void 0 ? "tertiary" : _g, ariaLabel = _a["aria-label"];
|
|
4288
|
+
var icon = _a.icon, name = _a.name, inProgressName = _a.inProgressName, dataTestId = _a.dataTestId, style = _a.style, className = _a.className, title = _a.title, onAction = _a.onAction, externalSetInProgress = _a.externalSetInProgress, _e = _a.size, size = _e === void 0 ? "sm" : _e, _f = _a.iconPosition, iconPosition = _f === void 0 ? "left" : _f, _g = _a.level, level = _g === void 0 ? "tertiary" : _g, ariaLabel = _a["aria-label"];
|
|
4289
4289
|
var _h = react.useState(false), inProgress = _h[0], setInProgress = _h[1];
|
|
4290
4290
|
var lastInProgress = usePrevious(inProgress !== null && inProgress !== void 0 ? inProgress : false);
|
|
4291
4291
|
var _j = useStateDeferred(inProgress), localInProgress = _j[0], setLocalInProgress = _j[1], setLocalInProgressDeferred = _j[2];
|
|
@@ -4295,7 +4295,7 @@ var ActionButton = function (_a) {
|
|
|
4295
4295
|
inProgress ? setLocalInProgress(true) : setLocalInProgressDeferred(false, minimumInProgressTimeMs);
|
|
4296
4296
|
}, [inProgress, lastInProgress, setLocalInProgress, setLocalInProgressDeferred]);
|
|
4297
4297
|
var buttonText = (jsxRuntime.jsxs("span", __assign({ className: "ActionButton-minimalArea" }, { children: [jsxRuntime.jsx("span", __assign({ className: "ActionButton-minimalAreaDisplay" }, { children: (_b = (localInProgress ? inProgressName : name)) !== null && _b !== void 0 ? _b : name })), jsxRuntime.jsx("span", __assign({ className: "ActionButton-minimalAreaExpand" }, { children: name }))] })));
|
|
4298
|
-
return (jsxRuntime.jsxs(lui.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"), size: "lg", style: name == null
|
|
4298
|
+
return (jsxRuntime.jsxs(lui.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 () {
|
|
4299
4299
|
var promise, isPromise;
|
|
4300
4300
|
return __generator(this, function (_a) {
|
|
4301
4301
|
switch (_a.label) {
|