@mailstep/design-system 0.8.16-beta.2 → 0.8.16-beta.4
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/package.json +12 -6
- package/ui/Blocks/CommonGrid/CommonGridContainer.js +3 -9
- package/ui/Blocks/CommonGrid/HoC/withReduxActions.js +0 -1
- package/ui/Blocks/CommonGrid/components/ControlButtons/ControlButtons.d.ts +0 -3
- package/ui/Blocks/CommonGrid/components/ControlButtons/ControlButtons.js +8 -16
- package/ui/Blocks/CommonGrid/components/ControlButtons/styles.d.ts +1 -0
- package/ui/Blocks/CommonGrid/components/ExtraControlButtons/ExtraControlButtons.d.ts +1 -2
- package/ui/Blocks/CommonGrid/components/ExtraControlButtons/ExtraControlButtons.js +10 -30
- package/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/DatePickerRange.d.ts +0 -1
- package/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/DatePickerRange.js +5 -17
- package/ui/Blocks/CommonGrid/components/Filters/GridSelect/GridSelect.js +2 -2
- package/ui/Blocks/CommonGrid/components/GridInfo/index.js +1 -3
- package/ui/Blocks/CommonGrid/components/IconList/IconList.d.ts +1 -1
- package/ui/Blocks/CommonGrid/components/ManageColumnForm/styles.d.ts +2 -2
- package/ui/Blocks/CommonGrid/components/QuickFilter/QuickFilter.d.ts +1 -1
- package/ui/Blocks/CommonGrid/components/QuickFilter/QuickFilter.js +2 -2
- package/ui/Blocks/CommonGrid/components/Table.d.ts +28 -28
- package/ui/Blocks/CommonGrid/components/Table.js +1 -1
- package/ui/Blocks/CommonGrid/hooks/useAddFilter.d.ts +1 -1
- package/ui/Blocks/CommonGrid/hooks/useColumnSizes.d.ts +1 -1
- package/ui/Blocks/CommonGrid/hooks/useEvent.d.ts +1 -1
- package/ui/Blocks/CommonGrid/hooks/useGridActionTrigger.d.ts +1 -1
- package/ui/Blocks/CommonGrid/hooks/useManageColumn.d.ts +1 -1
- package/ui/Blocks/CommonGrid/hooks/useRowsKeyControls.d.ts +1 -1
- package/ui/Blocks/CommonGrid/hooks/useToggleAllCheckbox.d.ts +1 -1
- package/ui/Blocks/CommonGrid/hooks/useUxReset.d.ts +1 -1
- package/ui/Blocks/CommonGrid/store/index.d.ts +19 -17
- package/ui/Blocks/CommonGrid/store/index.js +2 -9
- package/ui/Blocks/CommonGrid/storybook/stories/complexWithPaginationAndRedux.stories.d.ts +0 -30
- package/ui/Blocks/CommonGrid/storybook/stories/complexWithPaginationAndRedux.stories.js +9 -59
- package/ui/Blocks/CommonGrid/storybook/utils/columnDefinition.d.ts +0 -2
- package/ui/Blocks/CommonGrid/storybook/utils/columnDefinition.js +9 -19
- package/ui/Blocks/CommonGrid/styles.d.ts +6 -6
- package/ui/Blocks/CommonGrid/styles.js +3 -6
- package/ui/Blocks/CommonGrid/types.d.ts +0 -1
- package/ui/Blocks/CommonGrid/utils/index.d.ts +1 -3
- package/ui/Blocks/CommonGrid/utils/index.js +0 -10
- package/ui/Blocks/Header/components/MenuItems/styles.d.ts +1 -1
- package/ui/Blocks/Header/stories/Header.stories.d.ts +16 -16
- package/ui/Blocks/ImageList/components/AddPhoto/index.js +2 -2
- package/ui/Blocks/ImageList/components/AddPhoto/styles.d.ts +2 -2
- package/ui/Blocks/ImageList/components/CloseButton/styles.d.ts +1 -1
- package/ui/Blocks/ImageList/components/ImageElement/styles.d.ts +1 -1
- package/ui/Blocks/ImageList/styles.d.ts +2 -2
- package/ui/Blocks/LanguageSwitch/styles.d.ts +3 -3
- package/ui/Blocks/LoginPage/stories/LoginPage.stories.js +2 -2
- package/ui/Blocks/LoginPage/styles.d.ts +2 -3
- package/ui/Blocks/Modal/styles.d.ts +7 -7
- package/ui/Blocks/Scheduler/components/Groups/styles.d.ts +1 -1
- package/ui/Blocks/Scheduler/components/TimeSlots/styles.d.ts +1 -1
- package/ui/Blocks/SideMenu/components/Footer.d.ts +1 -1
- package/ui/Blocks/SideMenu/stories/SideMenu.stories.d.ts +1 -0
- package/ui/Blocks/SideMenu/styles.d.ts +15 -15
- package/ui/Blocks/Stepper/components/StepCircle/styles.d.ts +2 -2
- package/ui/Blocks/Stepper/components/StepItem/styles.d.ts +3 -3
- package/ui/Blocks/Table/stories/Table.stories.d.ts +3 -2
- package/ui/Blocks/Tabs/styles.d.ts +6 -5
- package/ui/Elements/Alert/styles.d.ts +18 -17
- package/ui/Elements/AsyncSelect/stories/AsyncSelect.stories.d.ts +2 -1
- package/ui/Elements/AsyncSelect/stories/AsyncSelect.stories.js +2 -2
- package/ui/Elements/BarChartSymbol/styles.d.ts +2 -2
- package/ui/Elements/BorderedBox/types.d.ts +1 -0
- package/ui/Elements/Button/styles.d.ts +6 -5
- package/ui/Elements/Card/styles.d.ts +2 -2
- package/ui/Elements/Card/types.d.ts +1 -0
- package/ui/Elements/CheckedCircle/storries/CheckedCircle.stories.d.ts +2 -2
- package/ui/Elements/DatePicker/Datetime/components/FooterRow.d.ts +1 -1
- package/ui/Elements/DatePicker/Datetime/views/DaysView.js +1 -1
- package/ui/Elements/DatePicker/styles.d.ts +2 -1
- package/ui/Elements/DropdownMenu/components/MenuItem.js +1 -1
- package/ui/Elements/Icon/Icon.js +6 -6
- package/ui/Elements/Icon/icons/index.d.ts +0 -2
- package/ui/Elements/Icon/icons/index.js +0 -2
- package/ui/Elements/Icon/stories/BadgeIcon.stories.d.ts +1 -1
- package/ui/Elements/Label/Label.d.ts +1 -1
- package/ui/Elements/Label/stories/Label.stories.d.ts +1 -1
- package/ui/Elements/Link/stories/Link.stories.d.ts +12 -12
- package/ui/Elements/Logo/Logo.js +2 -2
- package/ui/Elements/Pagination/styled.d.ts +2 -1
- package/ui/Elements/ProgressBar/stories/ProgressBar.stories.d.ts +5 -5
- package/ui/Elements/ProgressBar/styles.d.ts +1 -1
- package/ui/Elements/Select/Select.js +2 -2
- package/ui/Elements/Select/components/SimplifiedOption.d.ts +1 -0
- package/ui/Elements/Select/themes/index.d.ts +1 -1
- package/ui/Elements/Select/themes/selectStyles.d.ts +1 -1
- package/ui/Elements/SingleSelect/SingleSelect.js +2 -2
- package/ui/Elements/SpaceAround/types.d.ts +1 -0
- package/ui/Elements/Spinner/styles.d.ts +1 -1
- package/ui/Elements/Tag/types.d.ts +1 -0
- package/ui/Elements/Toast/styles.d.ts +1 -1
- package/ui/Forms/Checkbox/styles.d.ts +2 -1
- package/ui/Forms/Input/styles.d.ts +3 -3
- package/ui/Forms/TextArea/styles.d.ts +5 -5
- package/ui/ThemeProvider/ThemeProvider.d.ts +2 -1
- package/ui/ThemeProvider/ThemeProvider.js +1 -1
- package/ui/ThemeProvider/themes/dark.d.ts +152 -0
- package/ui/ThemeProvider/themes/dark.js +14 -0
- package/ui/ThemeProvider/themes/default.js +1 -1
- package/ui/ThemeProvider/themes/index.d.ts +151 -1
- package/ui/ThemeProvider/themes/index.js +3 -3
- package/ui/ThemeProvider/themes/mailwise.js +1 -1
- package/ui/ThemeProvider/types.d.ts +13 -33
- package/ui/index.es.js +15174 -15262
- package/ui/index.umd.js +464 -502
- package/ui/utils/index.js +1 -1
- package/ui/utils/translations.d.ts +4 -1
- package/ui/utils/translations.js +2 -2
- package/ui/Blocks/CommonGrid/components/MobileFilterModal.d.ts +0 -20
- package/ui/Blocks/CommonGrid/components/MobileFilterModal.js +0 -69
- package/ui/Blocks/CommonGrid/components/MobileOverlayWrapper.d.ts +0 -1
- package/ui/Blocks/CommonGrid/components/MobileOverlayWrapper.js +0 -7
- package/ui/Blocks/CommonGrid/components/MobileSortModal.d.ts +0 -13
- package/ui/Blocks/CommonGrid/components/MobileSortModal.js +0 -34
- package/ui/Elements/Icon/icons/Filter.d.ts +0 -4
- package/ui/Elements/Icon/icons/Filter.js +0 -13
- package/ui/Elements/Icon/icons/Sort.d.ts +0 -4
- package/ui/Elements/Icon/icons/Sort.js +0 -13
- package/ui/ThemeProvider/themes/light.d.ts +0 -4
- package/ui/ThemeProvider/themes/light.js +0 -7
package/ui/utils/index.js
CHANGED
package/ui/utils/translations.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Trans } from '@lingui/react';
|
|
3
3
|
/** catalog for lungui to track translations - DO NOT REMOVE */
|
|
4
|
-
var Translations = function () {
|
|
5
|
-
return (_jsxs(_Fragment, { children: [_jsx(Trans, { id: "dataGrid.filterCell.time", message: "Time" }), _jsx(Trans, { id: "dataGrid.status.loadingData", message: "... loading data ..." }), _jsx(Trans, { id: "dataGrid.status.noDataFound", message: "No data found." }), _jsx(Trans, { id: "dataGrid.buttonClearConfig", message: "Reset config" }), _jsx(Trans, { id: "dataGrid.buttonGridConfig", message: "Configure columns" }), _jsx(Trans, { id: "dataGrid.config.title", message: "Configure columns" }), _jsx(Trans, { id: "dataGrid.config.buttonReset", message: "Reset all" }), _jsx(Trans, { id: "dataGrid.resultsPerPage", message: "Results per page" }), _jsx(Trans, { id: "manageColumn.title", message: "Manage column" }), _jsx(Trans, { id: "dataGrid.buttonClearSettings", message: "Reset" }), _jsx(Trans, { id: "dataGrid.sortingTerminatedAppeal", message: "Too many results, please set a filter" }), _jsx(Trans, { id: "dataGrid.sortingTerminated", message: "Too many results, sorting cannot be used" }), _jsx(Trans, { id: "form.buttonCancel", message: "Cancel" }), _jsx(Trans, { id: "form.buttonConfirm", message: "Confirm" }), ",", _jsx(Trans, { id: "dataGrid.actionOptions.createNew", message: "Create new" }), ",", _jsx(Trans, { id: "form.buttonImport", message: "Import" }), ",", _jsx(Trans, { id: "dataGrid.actionOptions.export", message: "Export" }), ",", _jsx(Trans, { id: "form.buttonConfirm", message: "Confirm" }), ",", _jsx(Trans, { id: "dataGrid.actionOptions.createNew", message: "Create new" }), ",", _jsx(Trans, { id: "dataGrid.checkAll", message: "Check all" }), ",", _jsx(Trans, { id: "datagrid.filterCell.selectAllLabel", message: "select all" }), _jsx(Trans, { id: "datagrid.filterCell.optionsSelectedLabel", message: '{count} options' }), ",", _jsx(Trans, { id: "dataGrid.deleteItem", message: "Delete" }), ",", _jsx(Trans, { id: "dataGrid.columnLot.NA", message: "N/A" }), ",", _jsx(Trans, { id: "dataGrid.buttonActions", message: "Actions" }), ",", _jsx(Trans, { id: "dataGrid.errors.ipValidationError", message: "Value is not valid ip" }), ",", _jsx(Trans, { id: "dataGrid.columnActive.filterOptions.all", message: "All" }), ",", _jsx(Trans, { id: "dataGrid.columnActive.filterOptions.yes", message: "Yes" }), ",", _jsx(Trans, { id: "dataGrid.columnActive.filterOptions.no", message: "No" }), _jsx(Trans, { id: "dataGrid.checkedRowsCount", message: "Selected {checkedRowsCount} items" }), ",", _jsx(Trans, { id: "dataGrid.filterCell", message: "Type to filter" }), ",", _jsx(Trans, { id: "dataGrid.filterCell.from", message: "From" }), ",", _jsx(Trans, { id: "dataGrid.filterCell.to", message: "To" }), ",", _jsx(Trans, { id: "manageColumn.searchPlaceholder", message: "Find column..." }), ",", _jsx(Trans, { id: "dataGrid.comparator.equals", message: "Equals" }), ",", _jsx(Trans, { id: "dataGrid.comparator.notEquals", message: "Not equal" }), ",", _jsx(Trans, { id: "dataGrid.comparator.lessThan", message: "Less than" }), ",", _jsx(Trans, { id: "dataGrid.comparator.lessThanOrEquals", message: "Less than or equals" }), ",", _jsx(Trans, { id: "dataGrid.comparator.greaterThan", message: "Greater than" }), ",", _jsx(Trans, { id: "dataGrid.comparator.greaterThanOrEquals", message: "Greater than or equal" }), ",", _jsx(Trans, { id: "dataGrid.comparator.contains", message: "Contains" }), ",", _jsx(Trans, { id: "dataGrid.comparator.notContains", message: "Not contains" }), ",", _jsx(Trans, { id: "dataGrid.comparator.startsWith", message: "Starts with'" }), ",", _jsx(Trans, { id: "dataGrid.comparator.endsWith", message: "Ends with" }), ",", _jsx(Trans, { id: "select.noOptions", message: "no options" }), ",", _jsx(Trans, { id: "components.dropdown.loading", message: "Loading..." }), ",", _jsx(Trans, { id: "components.dropdown.placeholder", message: "Select..." }), ",", _jsx(Trans, { id: "components.dropdown.notReact", message: "Select related values first..." }), ",", _jsx(Trans, { id: "components.dropdown.writeMoreChars", message: "Write at least ${asyncLoadMinChars} characters." }), ",", _jsx(Trans, { id: "components.dropdown.noOptions", message: "No options" }), ",", _jsx(Trans, { id: "components.dropdown.newOption", message: "new value" }), ",", _jsx(Trans, { id: "form.general.min2Chars", message: "Minimal length is 2 characters." }), ",", _jsx(Trans, { id: "controlButtons.searchPlaceholder", message: "Search ${translatedValue} ..." }), ",", _jsx(Trans, { id: "dataGrid.everyToday", message: "Every today" }), ",", _jsx(Trans, { id: "dataGrid.everyYesterday", message: "Every yesterday" }), ",", _jsx(Trans, { id: "dataGrid.timepicker.from", message: "from" }), ",", _jsx(Trans, { id: "dataGrid.timepicker.to", message: "to" }), ",", _jsx(Trans, { id: "dataGrid.timepicker.at", message: "at" }), ",", _jsx(Trans, { id: "dataGrid.repeat", message: "Repeat" }), ",", _jsx(Trans, { id: "dataGrid.noRepeat", message: "No repeat" }), ",", _jsx(Trans, { id: "dataGrid.
|
|
4
|
+
export var Translations = function () {
|
|
5
|
+
return (_jsxs(_Fragment, { children: [_jsx(Trans, { id: "dataGrid.filterCell.time", message: "Time" }), _jsx(Trans, { id: "dataGrid.status.loadingData", message: "... loading data ..." }), _jsx(Trans, { id: "dataGrid.status.noDataFound", message: "No data found." }), _jsx(Trans, { id: "dataGrid.buttonClearConfig", message: "Reset config" }), _jsx(Trans, { id: "dataGrid.buttonGridConfig", message: "Configure columns" }), _jsx(Trans, { id: "dataGrid.config.title", message: "Configure columns" }), _jsx(Trans, { id: "dataGrid.config.buttonReset", message: "Reset all" }), _jsx(Trans, { id: "dataGrid.resultsPerPage", message: "Results per page" }), _jsx(Trans, { id: "manageColumn.title", message: "Manage column" }), _jsx(Trans, { id: "dataGrid.buttonClearSettings", message: "Reset" }), _jsx(Trans, { id: "dataGrid.sortingTerminatedAppeal", message: "Too many results, please set a filter" }), _jsx(Trans, { id: "dataGrid.sortingTerminated", message: "Too many results, sorting cannot be used" }), _jsx(Trans, { id: "form.buttonCancel", message: "Cancel" }), _jsx(Trans, { id: "form.buttonConfirm", message: "Confirm" }), ",", _jsx(Trans, { id: "dataGrid.actionOptions.createNew", message: "Create new" }), ",", _jsx(Trans, { id: "form.buttonImport", message: "Import" }), ",", _jsx(Trans, { id: "dataGrid.actionOptions.export", message: "Export" }), ",", _jsx(Trans, { id: "form.buttonConfirm", message: "Confirm" }), ",", _jsx(Trans, { id: "dataGrid.actionOptions.createNew", message: "Create new" }), ",", _jsx(Trans, { id: "dataGrid.checkAll", message: "Check all" }), ",", _jsx(Trans, { id: "datagrid.filterCell.selectAllLabel", message: "select all" }), _jsx(Trans, { id: "datagrid.filterCell.optionsSelectedLabel", message: '{count} options' }), ",", _jsx(Trans, { id: "dataGrid.deleteItem", message: "Delete" }), ",", _jsx(Trans, { id: "dataGrid.columnLot.NA", message: "N/A" }), ",", _jsx(Trans, { id: "dataGrid.buttonActions", message: "Actions" }), ",", _jsx(Trans, { id: "dataGrid.errors.ipValidationError", message: "Value is not valid ip" }), ",", _jsx(Trans, { id: "dataGrid.columnActive.filterOptions.all", message: "All" }), ",", _jsx(Trans, { id: "dataGrid.columnActive.filterOptions.yes", message: "Yes" }), ",", _jsx(Trans, { id: "dataGrid.columnActive.filterOptions.no", message: "No" }), _jsx(Trans, { id: "dataGrid.checkedRowsCount", message: "Selected {checkedRowsCount} items" }), ",", _jsx(Trans, { id: "dataGrid.filterCell", message: "Type to filter" }), ",", _jsx(Trans, { id: "dataGrid.filterCell.from", message: "From" }), ",", _jsx(Trans, { id: "dataGrid.filterCell.to", message: "To" }), ",", _jsx(Trans, { id: "manageColumn.searchPlaceholder", message: "Find column..." }), ",", _jsx(Trans, { id: "dataGrid.comparator.equals", message: "Equals" }), ",", _jsx(Trans, { id: "dataGrid.comparator.notEquals", message: "Not equal" }), ",", _jsx(Trans, { id: "dataGrid.comparator.lessThan", message: "Less than" }), ",", _jsx(Trans, { id: "dataGrid.comparator.lessThanOrEquals", message: "Less than or equals" }), ",", _jsx(Trans, { id: "dataGrid.comparator.greaterThan", message: "Greater than" }), ",", _jsx(Trans, { id: "dataGrid.comparator.greaterThanOrEquals", message: "Greater than or equal" }), ",", _jsx(Trans, { id: "dataGrid.comparator.contains", message: "Contains" }), ",", _jsx(Trans, { id: "dataGrid.comparator.notContains", message: "Not contains" }), ",", _jsx(Trans, { id: "dataGrid.comparator.startsWith", message: "Starts with'" }), ",", _jsx(Trans, { id: "dataGrid.comparator.endsWith", message: "Ends with" }), ",", _jsx(Trans, { id: "select.noOptions", message: "no options" }), ",", _jsx(Trans, { id: "components.dropdown.loading", message: "Loading..." }), ",", _jsx(Trans, { id: "components.dropdown.placeholder", message: "Select..." }), ",", _jsx(Trans, { id: "components.dropdown.notReact", message: "Select related values first..." }), ",", _jsx(Trans, { id: "components.dropdown.writeMoreChars", message: "Write at least ${asyncLoadMinChars} characters." }), ",", _jsx(Trans, { id: "components.dropdown.noOptions", message: "No options" }), ",", _jsx(Trans, { id: "components.dropdown.newOption", message: "new value" }), ",", _jsx(Trans, { id: "form.general.min2Chars", message: "Minimal length is 2 characters." }), ",", _jsx(Trans, { id: "controlButtons.searchPlaceholder", message: "Search ${translatedValue} ..." }), ",", _jsx(Trans, { id: "dataGrid.everyToday", message: "Every today" }), ",", _jsx(Trans, { id: "dataGrid.everyYesterday", message: "Every yesterday" }), ",", _jsx(Trans, { id: "dataGrid.timepicker.from", message: "from" }), ",", _jsx(Trans, { id: "dataGrid.timepicker.to", message: "to" }), ",", _jsx(Trans, { id: "dataGrid.timepicker.at", message: "at" }), ",", _jsx(Trans, { id: "dataGrid.repeat", message: "Repeat" }), ",", _jsx(Trans, { id: "dataGrid.noRepeat", message: "No repeat" }), ",", _jsx(Trans, { id: "dataGrid.presets.title", message: "Presets" }), _jsx(Trans, { id: "dataGrid.presetName.title", message: "Preset name" }), _jsx(Trans, { id: "dataGrid.deletePreset.title", message: "Delete preset" }), _jsx(Trans, { id: "dataGrid.deletePreset.confirm", message: "Are you sure you want to delete preset" }), _jsx(Trans, { id: "dataGrid.noPresets.title", message: "No presets available" }), _jsx(Trans, { id: "dataGrid.exportPreset.title", message: "Export presets" }), _jsx(Trans, { id: "dataGrid.importPreset.title", message: "Import presets" }), _jsx(Trans, { id: "dataGrid.createNewPreset.title", message: "Create new preset" }), _jsx(Trans, { id: "dataGrid.importPresets.gridNameNotSame", message: "Grid name in file is not the same as current grid." }), _jsx(Trans, { id: "dataGrid.importPresets.error", message: "Error with importing files." }), _jsx(Trans, { id: "card.entrustLogisticsEshopProfessionals", message: "Entrust the logistics of your e-shop to professionals." }), _jsx(Trans, { id: "form.heading.support", message: "Support:" }), _jsx(Trans, { id: "requiredField", message: "Required field" }), _jsx(Trans, { id: "form.login.label", message: "Login" }), _jsx(Trans, { id: "form.password.label", message: "Password" }), _jsx(Trans, { id: "form.distributionCenter.label", message: "Distribution center" }), _jsx(Trans, { id: "form.buttonSignIn", message: "Sign in" }), _jsx(Trans, { id: "footer.collapse", message: "Collapse" }), _jsx(Trans, { id: "step", message: "Step" }), _jsx(Trans, { id: "logout", message: "Logout" })] }));
|
|
6
6
|
};
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
2
|
-
import { ColumnDefinition, GridActionsType, FiltersConfig, CustomComparators, ActionColumn, UxState, RowProps, GridSelectorsType } from '../types';
|
|
3
|
-
|
|
4
|
-
type Props = {
|
|
5
|
-
isShown: boolean;
|
|
6
|
-
onClose: () => void;
|
|
7
|
-
columns: ColumnDefinition[];
|
|
8
|
-
actionColumn?: ActionColumn;
|
|
9
|
-
filters?: FiltersConfig;
|
|
10
|
-
comparators?: CustomComparators;
|
|
11
|
-
filterValues?: GridSelectorsType['filter'];
|
|
12
|
-
setFilters: Required<GridActionsType>['setFilters'];
|
|
13
|
-
rowsData: RowProps[];
|
|
14
|
-
uxState: UxState;
|
|
15
|
-
handleUxChange?: GridActionsType['handleUxChange'];
|
|
16
|
-
onAsyncLoadFilterOptions?: (key: string, value: string) => void;
|
|
17
|
-
onClearSettings?: () => void;
|
|
18
|
-
};
|
|
19
|
-
declare const MobileFilterModal: FC<Props>;
|
|
20
|
-
export default MobileFilterModal;
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
-
import { useCallback, useEffect, useState } from 'react';
|
|
14
|
-
import { H6 } from '../../../Elements/Typography';
|
|
15
|
-
import { Modal } from '../../Modal/Modal';
|
|
16
|
-
import { createFilterType, getFilterName, isFilterActive } from '../utils';
|
|
17
|
-
import { Trans } from '@lingui/react';
|
|
18
|
-
import { x } from '@xstyled/styled-components';
|
|
19
|
-
import get from 'lodash/fp/get';
|
|
20
|
-
import { MobileOverlayWrapper } from './MobileOverlayWrapper';
|
|
21
|
-
var MobileFilterModal = function (_a) {
|
|
22
|
-
var isShown = _a.isShown, onClose = _a.onClose, columns = _a.columns, filters = _a.filters, comparators = _a.comparators, _b = _a.filterValues, filterValues = _b === void 0 ? {} : _b, setFilters = _a.setFilters, rowsData = _a.rowsData, uxState = _a.uxState, handleUxChange = _a.handleUxChange, onAsyncLoadFilterOptions = _a.onAsyncLoadFilterOptions, actionColumn = _a.actionColumn, onClearSettings = _a.onClearSettings;
|
|
23
|
-
var filterableColumns = columns.filter(function (col) { return col.filtering && col.title; });
|
|
24
|
-
var _c = useState(filterValues !== null && filterValues !== void 0 ? filterValues : {}), localFilterValues = _c[0], setLocalFilterValues = _c[1];
|
|
25
|
-
// Re-sync local state whenever the modal is opened
|
|
26
|
-
useEffect(function () {
|
|
27
|
-
if (isShown) {
|
|
28
|
-
setLocalFilterValues(filterValues !== null && filterValues !== void 0 ? filterValues : {});
|
|
29
|
-
}
|
|
30
|
-
}, [isShown]);
|
|
31
|
-
var hasActiveFilters = Object.values(localFilterValues).some(function (item) { return isFilterActive(item.value); });
|
|
32
|
-
var handleChange = useCallback(function (column) {
|
|
33
|
-
return function (event, extraOthers) {
|
|
34
|
-
var value = (event === null || event === void 0 ? void 0 : event.target) ? event.target.value : event;
|
|
35
|
-
setLocalFilterValues(function (prev) {
|
|
36
|
-
var _a;
|
|
37
|
-
return (__assign(__assign({}, prev), (_a = {}, _a[getFilterName(column)] = {
|
|
38
|
-
value: value,
|
|
39
|
-
filterProps: {
|
|
40
|
-
type: createFilterType(column),
|
|
41
|
-
filterExtraProps: column.filterExtraProps || {},
|
|
42
|
-
computedValue: column.getFilterCriteria ? column.getFilterCriteria(value) : null
|
|
43
|
-
},
|
|
44
|
-
others: extraOthers
|
|
45
|
-
}, _a)));
|
|
46
|
-
});
|
|
47
|
-
};
|
|
48
|
-
}, []);
|
|
49
|
-
var handleApplyFilters = useCallback(function (close) {
|
|
50
|
-
setFilters(localFilterValues);
|
|
51
|
-
close();
|
|
52
|
-
}, [localFilterValues, setFilters]);
|
|
53
|
-
var handleReset = useCallback(function () {
|
|
54
|
-
setLocalFilterValues({});
|
|
55
|
-
onClearSettings === null || onClearSettings === void 0 ? void 0 : onClearSettings();
|
|
56
|
-
}, [onClearSettings]);
|
|
57
|
-
return (_jsx(Modal, { isShown: isShown, onClose: onClose, title: _jsx(Trans, { id: "dataGrid.filter", message: "Filter" }), onCancel: handleReset, cancelLabel: _jsx(Trans, { id: "dataGrid.buttonClearSettings", message: "Reset" }), onConfirm: handleApplyFilters, confirmLabel: _jsx(Trans, { id: "dataGrid.filter", message: "Filter" }), hasFooter: hasActiveFilters, width: "narrow", children: _jsx(x.div, { display: "flex", flexDirection: "column", gap: "16px", p: "8px 4px", children: filterableColumns.map(function (column) {
|
|
58
|
-
var filterType = createFilterType(column);
|
|
59
|
-
var filterConfig = filters === null || filters === void 0 ? void 0 : filters[filterType];
|
|
60
|
-
var defaultComparators = comparators === null || comparators === void 0 ? void 0 : comparators[filterType];
|
|
61
|
-
var value = get([getFilterName(column), 'value'], localFilterValues);
|
|
62
|
-
var others = get([getFilterName(column), 'others'], localFilterValues);
|
|
63
|
-
if (!(filterConfig === null || filterConfig === void 0 ? void 0 : filterConfig.CellComponent))
|
|
64
|
-
return null;
|
|
65
|
-
var RenderComponent = filterConfig.CellComponent;
|
|
66
|
-
return (_jsxs(x.div, { display: "flex", flexDirection: "column", gap: "6px", position: "relative", children: [column.title && (_jsx(H6, { mt: 0, mb: 0, variant: "semiBold", children: column.title })), _jsx(RenderComponent, __assign({ asyncLoadKey: column.asyncLoadKey, "data-test": column.name, name: column.name, onChange: handleChange(column), value: value, others: others, OverlayComponent: MobileOverlayWrapper, comparators: defaultComparators, actionColumn: actionColumn, rowsData: rowsData, uxState: uxState, handleUxChange: handleUxChange, onAsyncLoadFilterOptions: onAsyncLoadFilterOptions }, (filterType === 'date' && { compact: true }), (filterType === 'options' && { options: column.filterOptions }), filterConfig === null || filterConfig === void 0 ? void 0 : filterConfig.defaultExtraProps, column.filterExtraProps))] }, column.name));
|
|
67
|
-
}) }) }));
|
|
68
|
-
};
|
|
69
|
-
export default MobileFilterModal;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const MobileOverlayWrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
2
|
-
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
3
|
-
return cooked;
|
|
4
|
-
};
|
|
5
|
-
import styled from '@xstyled/styled-components';
|
|
6
|
-
export var MobileOverlayWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: absolute;\n z-index: 10;\n top: 100%;\n left: 0;\n right: 0;\n background-color: white;\n border-radius: 4px;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);\n"], ["\n position: absolute;\n z-index: 10;\n top: 100%;\n left: 0;\n right: 0;\n background-color: white;\n border-radius: 4px;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);\n"])));
|
|
7
|
-
var templateObject_1;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
2
|
-
import { ColumnDefinition, GridActionsType, GridSelectorsType } from '../types';
|
|
3
|
-
|
|
4
|
-
type Props = {
|
|
5
|
-
isShown: boolean;
|
|
6
|
-
onClose: () => void;
|
|
7
|
-
columns: ColumnDefinition[];
|
|
8
|
-
sortingValues?: GridSelectorsType['sorting'];
|
|
9
|
-
onAddSorting: Required<GridActionsType>['addSorting'];
|
|
10
|
-
onResetSorting?: GridActionsType['resetSorting'];
|
|
11
|
-
};
|
|
12
|
-
declare const MobileSortModal: FC<Props>;
|
|
13
|
-
export default MobileSortModal;
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { useCallback } from 'react';
|
|
3
|
-
import Button from '../../../Elements/Button';
|
|
4
|
-
import { Modal } from '../../Modal/Modal';
|
|
5
|
-
import { getSortName } from '../utils';
|
|
6
|
-
import { SortingUp, SortingDown } from './icons/Sorting';
|
|
7
|
-
import { Trans } from '@lingui/react';
|
|
8
|
-
import { x } from '@xstyled/styled-components';
|
|
9
|
-
var AscIcon = _jsx(SortingUp, { width: "16", fill: "white" });
|
|
10
|
-
var DescIcon = _jsx(SortingDown, { width: "16", fill: "white" });
|
|
11
|
-
var SortRow = function (_a) {
|
|
12
|
-
var column = _a.column, currentDirection = _a.currentDirection, onCycle = _a.onCycle;
|
|
13
|
-
var handleClick = useCallback(function () {
|
|
14
|
-
onCycle(column);
|
|
15
|
-
}, [column, onCycle]);
|
|
16
|
-
var icon = currentDirection === 'asc' ? AscIcon : currentDirection === 'desc' ? DescIcon : null;
|
|
17
|
-
return (_jsx(Button, { type: "button", onClick: handleClick, appearance: currentDirection ? 'primary' : 'secondary', iconRight: icon, fullWidth: true, children: column.title }));
|
|
18
|
-
};
|
|
19
|
-
var MobileSortModal = function (_a) {
|
|
20
|
-
var isShown = _a.isShown, onClose = _a.onClose, columns = _a.columns, _b = _a.sortingValues, sortingValues = _b === void 0 ? [] : _b, onAddSorting = _a.onAddSorting, onResetSorting = _a.onResetSorting;
|
|
21
|
-
var sortableColumns = columns.filter(function (col) { return col.sorting; });
|
|
22
|
-
var getCurrentDirection = useCallback(function (column) { var _a; return ((_a = sortingValues.find(function (s) { return s.column === getSortName(column); })) === null || _a === void 0 ? void 0 : _a.direction) || null; }, [sortingValues]);
|
|
23
|
-
var activeSortedColumn = sortableColumns.find(function (col) { return getCurrentDirection(col) !== null; });
|
|
24
|
-
var handleCycle = useCallback(function (column) {
|
|
25
|
-
var current = getCurrentDirection(column);
|
|
26
|
-
var next = current ? (current === 'asc' ? 'desc' : null) : 'asc';
|
|
27
|
-
onAddSorting(getSortName(column), next);
|
|
28
|
-
}, [getCurrentDirection, onAddSorting]);
|
|
29
|
-
var handleClearSort = useCallback(function () {
|
|
30
|
-
onResetSorting === null || onResetSorting === void 0 ? void 0 : onResetSorting();
|
|
31
|
-
}, [onResetSorting]);
|
|
32
|
-
return (_jsx(Modal, { isShown: isShown, onClose: onClose, title: _jsx(Trans, { id: "dataGrid.sort", message: "Sort" }), onConfirm: activeSortedColumn ? handleClearSort : undefined, confirmLabel: _jsx(Trans, { id: "dataGrid.buttonClearSettings", message: "Reset" }), width: "narrow", children: _jsx(x.div, { display: "flex", flexDirection: "column", gap: "8px", p: "8px 4px", children: sortableColumns.map(function (column) { return (_jsx(SortRow, { column: column, currentDirection: getCurrentDirection(column), onCycle: handleCycle }, column.name)); }) }) }));
|
|
33
|
-
};
|
|
34
|
-
export default MobileSortModal;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
-
export var Filter = function (props) { return (_jsx("svg", __assign({ width: "14", height: "9", viewBox: "0 0 14 9", fill: "#DB2B19", xmlns: "http://www.w3.org/2000/svg" }, props, { children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0 0V1.5H13.5V0H0ZM5.25 9H8.25V7.5H5.25V9ZM11.25 5.25H2.25V3.75H11.25V5.25Z" }) }))); };
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
-
export var Sort = function (props) { return (_jsxs("svg", __assign({ width: "14", height: "14", viewBox: "0 0 14 14", stroke: "#DB2B19", xmlns: "http://www.w3.org/2000/svg" }, props, { children: [_jsx("path", { d: "M3.5 1.5V12.5M3.5 12.5L1.5 10.5M3.5 12.5L5.5 10.5", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M10.5 12.5V1.5M10.5 1.5L8.5 3.5M10.5 1.5L12.5 3.5", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }))); };
|