@mailstep/design-system 0.8.15 → 0.8.16-beta.1

package/ui/Blocks/CommonGrid/hooks/useColumnSizes.d.ts

@@ -9,5 +9,5 @@ type ReturnProps = {
     gridBoxRef: React.MutableRefObject<HTMLElement>;
     handleResizeDrag: (column: string, width: number) => void;
 };
-declare const useColumnSizes: (displayColumnsDefinitions: CommonGridProps["columnsDefinitions"], storeColumnsWidth: Required<GridSelectorsType>["columnsWidth"], storeColumnsWidthVariant: GridSelectorsType["columnsWidthVariant"], setColumnWidth: Required<GridActionsType>["setColumnWidth"], columnLayout: Required<CommonGridProps>["columnLayout"], minColumnWidth?: number) => ReturnProps;
+declare const useColumnSizes: (displayColumnsDefinitions: CommonGridProps['columnsDefinitions'], storeColumnsWidth: Required<GridSelectorsType>['columnsWidth'], storeColumnsWidthVariant: GridSelectorsType['columnsWidthVariant'], setColumnWidth: Required<GridActionsType>['setColumnWidth'], columnLayout: Required<CommonGridProps>['columnLayout'], minColumnWidth?: number) => ReturnProps;
 export default useColumnSizes;

package/ui/Blocks/CommonGrid/hooks/useEvent.d.ts

@@ -1,3 +1,3 @@
 type AnyFunction = (...args: any[]) => any;
-export declare const useEvent: <T extends AnyFunction>(callback?: T) => T;
+export declare const useEvent: <T extends AnyFunction>(callback?: T | undefined) => T;
 export {};

package/ui/Blocks/CommonGrid/hooks/useGridActionTrigger.d.ts

@@ -5,5 +5,5 @@ import { RowProps, UxState, ActionColumn, OnBatchActionFn } from '../types';
  * returns [subset of actions that are enabled, onSelect(value) - param1: selected action value]
  */
 type GridActionTriggerRet = [Required<ActionColumn>['actionOptions'], (value: any) => void];
-export declare const useGridActionTrigger: (rowsData: RowProps[], uxState: UxState, actionOptions?: ActionColumn["actionOptions"], onBatchAction?: OnBatchActionFn) => GridActionTriggerRet;
+export declare const useGridActionTrigger: (rowsData: RowProps[], uxState: UxState, actionOptions?: ActionColumn['actionOptions'], onBatchAction?: OnBatchActionFn) => GridActionTriggerRet;
 export {};

package/ui/Blocks/CommonGrid/hooks/useManageColumn.d.ts

@@ -11,7 +11,7 @@ declare const useManageColumn: ({ columns, gridSelectors, gridActions, onClose }
     columnsConfigValues: string[];
     setColumnsConfigOptions: import('react').Dispatch<import('react').SetStateAction<{
         [x: string]: {
-            isHidden?: boolean;
+            isHidden?: boolean | undefined;
         };
     }>>;
     onConfirmForm: () => void;

package/ui/Blocks/CommonGrid/hooks/useRowsKeyControls.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
 import { RowProps, UxState } from '../types';
 
-declare const useRowsKeyControls: (rowsData: RowProps[], uxState: UxState, onUxChange?: (uxKey: keyof UxState, uxValue: any) => void) => (e: React.KeyboardEvent<HTMLDivElement>) => void;
+declare const useRowsKeyControls: (rowsData: RowProps[], uxState: UxState, onUxChange?: ((uxKey: keyof UxState, uxValue: any) => void) | undefined) => (e: React.KeyboardEvent<HTMLDivElement>) => void;
 export default useRowsKeyControls;

package/ui/Blocks/CommonGrid/hooks/useToggleAllCheckbox.d.ts

@@ -5,5 +5,5 @@ import { RowProps, GridActionsType, UxState } from '../types';
  * returns [checked state, toggleAllHandler()] for checkbox
  */
 type ToggleAllCheckboxRet = [boolean, () => void];
-export declare const useToggleAllCheckbox: (rowsData?: RowProps[], uxState?: UxState, handleUxChange?: GridActionsType["handleUxChange"]) => ToggleAllCheckboxRet;
+export declare const useToggleAllCheckbox: (rowsData?: RowProps[], uxState?: UxState, handleUxChange?: GridActionsType['handleUxChange']) => ToggleAllCheckboxRet;
 export {};

package/ui/Blocks/CommonGrid/hooks/useUxReset.d.ts

@@ -1,4 +1,4 @@
 import { RowProps, GridActionsType, UxState } from '../types';
 
-declare const useUxReset: (rowsData: RowProps[], uxState: UxState, clearUxState: GridActionsType["clearUxState"]) => any;
+declare const useUxReset: (rowsData: RowProps[], uxState: UxState, clearUxState: GridActionsType['clearUxState']) => any;
 export default useUxReset;

package/ui/Blocks/CommonGrid/store/index.d.ts

@@ -1,9 +1,7 @@
 import { FilterProps, SortingValueType, InitProps, GridState, GridSelectorsType, ColumnConfig, Filtering, GridPresets } from '../types';
 
 type DefaultRootState = {};
-export type MultiState = {
-    [key: string]: GridState;
-};
+export type MultiState = Record<string, GridState>;
 export declare const initialState: GridState;
 export declare const actionPrefix = "@store/CommonGrid";
 export declare const actionTypes: {
@@ -22,6 +20,7 @@ export declare const actionTypes: {
     addFilter: string;
     setFilters: string;
     addSorting: string;
+    resetSorting: string;
     clearSettings: string;
     resetGrid: string;
     setColumnWidth: string;
@@ -32,7 +31,7 @@ export default _default;
 export declare const createActions: (gridName: string) => {
     init: (initProps?: InitProps) => Action;
     clearUxState: () => Action;
-    handleUxChange: (uxKey: keyof GridState["uxState"], uxValue: any) => Action;
+    handleUxChange: (uxKey: keyof GridState['uxState'], uxValue: any) => Action;
     openConfigForm: () => Action;
     closeConfigForm: () => Action;
     setColumnConfig: (columnConfig: ColumnConfig) => Action;
@@ -40,9 +39,7 @@ export declare const createActions: (gridName: string) => {
     setPresets: (presets: GridPresets) => Action;
     createPreset: (presetName: string, filters: Filtering) => Action;
     deletePreset: (presetName: string) => Action;
-    setColumnWidth: (columnsWidth: null | {
-        [anyKey: string]: number;
-    }, columnLayout: "normal" | "no-scroll" | "sticky") => Action;
+    setColumnWidth: (columnsWidth: null | Record<string, number>, columnLayout: 'normal' | 'no-scroll' | 'sticky') => Action;
     resetGrid: () => Action;
     setColumnsOrder: (columnsOrder: string[]) => Action;
     setRowsPerPage: (rowsPerPage: number) => Action;
@@ -50,19 +47,20 @@ export declare const createActions: (gridName: string) => {
     addFilter: (column: string, value: any, filterProps: FilterProps, others?: any) => Action;
     setFilters: (filters: Filtering) => Action;
     addSorting: (column: string, direction: SortingValueType) => Action;
+    resetSorting: () => Action;
     clearSettings: () => Action;
 };
 export declare const createSelectors: (gridName: string) => {
-    getUxState: (state: DefaultRootState) => GridState["uxState"];
-    isConfigFormOpen: (state: DefaultRootState) => GridState["isConfigFormOpen"];
-    getColumnConfig: (state: DefaultRootState) => GridState["columnConfig"];
-    getPage: (state: DefaultRootState) => GridState["page"];
-    getPresets: (state: DefaultRootState) => GridState["presets"];
-    getRowsPerPage: (state: DefaultRootState) => GridState["rowsPerPage"];
-    getFilter: (state: DefaultRootState) => GridState["filter"];
-    getSorting: (state: DefaultRootState) => GridState["sorting"];
-    getColumnsWidth: (state: DefaultRootState) => GridState["columnsWidth"];
-    getColumnsWidthVariant: (state: DefaultRootState) => GridState["columnsWidthVariant"];
-    getColumnsOrder: (state: DefaultRootState) => GridState["columnsOrder"];
+    getUxState: (state: DefaultRootState) => GridState['uxState'];
+    isConfigFormOpen: (state: DefaultRootState) => GridState['isConfigFormOpen'];
+    getColumnConfig: (state: DefaultRootState) => GridState['columnConfig'];
+    getPage: (state: DefaultRootState) => GridState['page'];
+    getPresets: (state: DefaultRootState) => GridState['presets'];
+    getRowsPerPage: (state: DefaultRootState) => GridState['rowsPerPage'];
+    getFilter: (state: DefaultRootState) => GridState['filter'];
+    getSorting: (state: DefaultRootState) => GridState['sorting'];
+    getColumnsWidth: (state: DefaultRootState) => GridState['columnsWidth'];
+    getColumnsWidthVariant: (state: DefaultRootState) => GridState['columnsWidthVariant'];
+    getColumnsOrder: (state: DefaultRootState) => GridState['columnsOrder'];
 };
-export declare const createFullSelector: (gridName: string) => ((state: DefaultRootState) => GridSelectorsType);
+export declare const createFullSelector: (gridName: string) => (state: DefaultRootState) => GridSelectorsType;

package/ui/Blocks/CommonGrid/store/index.js

@@ -46,6 +46,7 @@ export var actionTypes = {
     addFilter: "".concat(actionPrefix, "/addFilter"),
     setFilters: "".concat(actionPrefix, "/setFilters"),
     addSorting: "".concat(actionPrefix, "/addSorting"),
+    resetSorting: "".concat(actionPrefix, "/resetSorting"),
     clearSettings: "".concat(actionPrefix, "/clearSettings"),
     resetGrid: "".concat(actionPrefix, "/resetGrid"),
     setColumnWidth: "".concat(actionPrefix, "/setColumnWidth"),
@@ -56,7 +57,7 @@ export default (function (state, action) {
     if (state === void 0) { state = {}; }
     return produce(state, function (draft) {
         var _a, _b, _c;
-        var _d, _e, _f, _g, _h;
+        var _d, _e, _f, _g, _h, _j;
         // version migrations
         if (!migrationChecked && state && Object.keys(state).length > 0) {
             draft = migrateState(draft);
@@ -118,6 +119,9 @@ export default (function (state, action) {
                 }
                 draft[gridName].sorting = sorting;
                 break;
+            case actionTypes.resetSorting:
+                draft[gridName].sorting = ((_j = draft[gridName].defaultSorting) === null || _j === void 0 ? void 0 : _j.length) ? draft[gridName].defaultSorting : initialState.sorting;
+                break;
             case actionTypes.clearSettings:
                 draft[gridName].page = initialState.page;
                 draft[gridName].filter = initialState.filter;
@@ -211,6 +215,7 @@ export var createActions = function (gridName) { return ({
         column: column,
         direction: direction
     }); },
+    resetSorting: function () { return ({ gridName: gridName, type: actionTypes.resetSorting }); },
     clearSettings: function () { return ({ gridName: gridName, type: actionTypes.clearSettings }); }
 }); };
 export var createSelectors = function (gridName) { return ({
@@ -224,7 +229,9 @@ export var createSelectors = function (gridName) { return ({
         return getOr(initialState.columnConfig, "commonGrid.".concat(gridName, ".columnConfig"), state);
     },
     getPage: function (state) { return getOr(initialState.page, "commonGrid.".concat(gridName, ".page"), state); },
-    getPresets: function (state) { return getOr(initialState.presets, "commonGrid.".concat(gridName, ".presets"), state); },
+    getPresets: function (state) {
+        return getOr(initialState.presets, "commonGrid.".concat(gridName, ".presets"), state);
+    },
     getRowsPerPage: function (state) {
         return getOr(initialState.rowsPerPage, "commonGrid.".concat(gridName, ".rowsPerPage"), state);
     },

package/ui/Blocks/CommonGrid/storybook/stories/complexWithPaginationAndRedux.stories.d.ts

@@ -9,3 +9,33 @@ export declare const ComplexWithPaginationAndRedux: {
         name: string;
     };
 };
+export declare const ComplexWithReload: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};
+export declare const ComplexWithTooManyResults: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};
+export declare const ComplexWithCheckbox: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};
+export declare const ComplexWithEditButton: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};
+export declare const ComplexWithStickyColumn: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};

package/ui/Blocks/CommonGrid/storybook/stories/complexWithPaginationAndRedux.stories.js

@@ -5,16 +5,9 @@ import withReduxActions from '../../HoC/withReduxActions';
 import { useAddFilter } from '../../hooks/useAddFilter';
 import { ExtraControlButtonPosition } from '../../types';
 import { onRowEditClick, onRowReadClick, onRowAction, onRowClick, onBatchAction } from '../utils/actions';
-import { columnDefinitions, enumColumn } from '../utils/columnDefinition';
+import { columnDefinitions, enumColumn, columnDefinitionsWithSticky } from '../utils/columnDefinition';
 import { ReduxGrid, createRandomData, enumValues, gridDummyActions, onAsyncLoadFilterOptions } from '../utils/utils';
 import withRedux from '../utils/withRedux';
-var ActionColumnButtons = {
-    flexBasis: 80,
-    forceCheckboxes: true,
-    addRowNumbers: false,
-    canRowEdit: true,
-    canRowRead: false
-};
 var FilterSetter = function (_a) {
     var gridActions = _a.gridActions;
     var handleAddFilter = useAddFilter(gridActions === null || gridActions === void 0 ? void 0 : gridActions.addFilter);
@@ -30,6 +23,29 @@ var extraControlButtons = [
         position: ExtraControlButtonPosition.TopRight,
         label: 'Create',
         onClick: alert
+    },
+    {
+        position: ExtraControlButtonPosition.TopRight,
+        label: 'Print',
+        onSelect: function (value) {
+            console.log(value);
+        },
+        options: [
+            { label: 'CSV', value: 'CSV' },
+            { label: 'ODS', value: 'ODS' },
+            { label: 'XLSX', value: 'XLSX' }
+        ]
+    },
+    {
+        position: ExtraControlButtonPosition.TopRight,
+        label: 'Allocate',
+        onSelect: function (value) {
+            console.log(value);
+        },
+        options: [
+            { label: 'Allocate all', value: 'all' },
+            { label: 'Allocate selected', value: 'selected' }
+        ]
     }
 ];
 var comparators = {
@@ -47,7 +63,41 @@ export default {
     title: 'Blocks/CommonGrid',
     decorators: [withRedux]
 };
-export var ComplexWithPaginationAndRedux = function () { return (_jsxs(LinguiContainer, { children: [_jsx(ConnectedFilterSetter, { gridActions: gridDummyActions }), _jsx(ReduxGrid, { columnsDefinitions: columnDefinitions, actionColumnDefinition: ActionColumnButtons, rowsData: createRandomData(10), onRowAction: onRowAction, onRowClick: onRowClick, onRowReadClick: onRowReadClick, onRowEditClick: onRowEditClick, totalRowsCount: 200, onBatchAction: onBatchAction, getRowsPerPage: getRowsPerPage, onAsyncLoadFilterOptions: onAsyncLoadFilterOptions, quickFilter: "textColumn", extraControlButtons: extraControlButtons, comparators: comparators, gridName: "gridName" })] })); };
+export var ComplexWithPaginationAndRedux = function () { return (_jsxs(LinguiContainer, { children: [_jsx(ConnectedFilterSetter, { gridActions: gridDummyActions }), _jsx(ReduxGrid, { columnsDefinitions: columnDefinitions, rowsData: createRandomData(10), onRowAction: onRowAction, onRowClick: onRowClick, onRowReadClick: onRowReadClick, onRowEditClick: onRowEditClick, totalRowsCount: 200, onBatchAction: onBatchAction, getRowsPerPage: getRowsPerPage, onAsyncLoadFilterOptions: onAsyncLoadFilterOptions, quickFilter: "textColumn", extraControlButtons: extraControlButtons, comparators: comparators, gridName: "gridName" })] })); };
 ComplexWithPaginationAndRedux.story = {
     name: 'Complex, with pagination and redux'
 };
+export var ComplexWithReload = function () { return (_jsxs(LinguiContainer, { children: [_jsx(ConnectedFilterSetter, { gridActions: gridDummyActions }), _jsx(ReduxGrid, { columnsDefinitions: columnDefinitions, rowsData: createRandomData(10), onRowAction: onRowAction, onRowClick: onRowClick, onRowReadClick: onRowReadClick, onRowEditClick: onRowEditClick, totalRowsCount: 200, onBatchAction: onBatchAction, getRowsPerPage: getRowsPerPage, onAsyncLoadFilterOptions: onAsyncLoadFilterOptions, quickFilter: "textColumn", extraControlButtons: extraControlButtons, comparators: comparators, gridName: "gridName", onReload: function () {
+                console.log('reload');
+            } })] })); };
+ComplexWithReload.story = {
+    name: 'Complex, with reload button'
+};
+export var ComplexWithTooManyResults = function () { return (_jsxs(LinguiContainer, { children: [_jsx(ConnectedFilterSetter, { gridActions: gridDummyActions }), _jsx(ReduxGrid, { columnsDefinitions: columnDefinitions, rowsData: createRandomData(10), onRowAction: onRowAction, onRowClick: onRowClick, onRowReadClick: onRowReadClick, onRowEditClick: onRowEditClick, totalRowsCount: 200, onBatchAction: onBatchAction, getRowsPerPage: getRowsPerPage, onAsyncLoadFilterOptions: onAsyncLoadFilterOptions, quickFilter: "textColumn", extraControlButtons: extraControlButtons, comparators: comparators, gridName: "gridName", allowSortingOnlyUnderTotalRows: [10, 10] })] })); };
+ComplexWithTooManyResults.story = {
+    name: 'Complex, with too many results'
+};
+export var ComplexWithCheckbox = function () { return (_jsxs(LinguiContainer, { children: [_jsx(ConnectedFilterSetter, { gridActions: gridDummyActions }), _jsx(ReduxGrid, { columnsDefinitions: columnDefinitions, rowsData: createRandomData(10), onRowAction: onRowAction, onRowClick: onRowClick, onRowReadClick: onRowReadClick, onRowEditClick: onRowEditClick, totalRowsCount: 200, onBatchAction: onBatchAction, getRowsPerPage: getRowsPerPage, onAsyncLoadFilterOptions: onAsyncLoadFilterOptions, quickFilter: "textColumn", extraControlButtons: extraControlButtons, comparators: comparators, gridName: "gridName", actionColumnDefinition: {
+                flexBasis: 40,
+                forceCheckboxes: true,
+                addRowNumbers: false,
+                canRowEdit: false,
+                canRowRead: false
+            } })] })); };
+ComplexWithCheckbox.story = {
+    name: 'Complex, with checkbox'
+};
+export var ComplexWithEditButton = function () { return (_jsxs(LinguiContainer, { children: [_jsx(ConnectedFilterSetter, { gridActions: gridDummyActions }), _jsx(ReduxGrid, { columnsDefinitions: columnDefinitions, rowsData: createRandomData(10), onRowAction: onRowAction, onRowClick: onRowClick, onRowReadClick: onRowReadClick, onRowEditClick: onRowEditClick, totalRowsCount: 200, onBatchAction: onBatchAction, getRowsPerPage: getRowsPerPage, onAsyncLoadFilterOptions: onAsyncLoadFilterOptions, quickFilter: "textColumn", extraControlButtons: extraControlButtons, comparators: comparators, gridName: "gridName", actionColumnDefinition: {
+                flexBasis: 70,
+                forceCheckboxes: true,
+                addRowNumbers: false,
+                canRowEdit: true,
+                canRowRead: false
+            } })] })); };
+ComplexWithEditButton.story = {
+    name: 'Complex, with edit button'
+};
+export var ComplexWithStickyColumn = function () { return (_jsxs(LinguiContainer, { children: [_jsx(ConnectedFilterSetter, { gridActions: gridDummyActions }), _jsx(ReduxGrid, { columnsDefinitions: columnDefinitionsWithSticky, rowsData: createRandomData(10), onRowAction: onRowAction, onRowClick: onRowClick, onRowReadClick: onRowReadClick, onRowEditClick: onRowEditClick, totalRowsCount: 200, onBatchAction: onBatchAction, getRowsPerPage: getRowsPerPage, onAsyncLoadFilterOptions: onAsyncLoadFilterOptions, quickFilter: "textColumn", extraControlButtons: extraControlButtons, comparators: comparators, gridName: "gridNameSticky" })] })); };
+ComplexWithStickyColumn.story = {
+    name: 'Complex, with sticky column'
+};

package/ui/Blocks/CommonGrid/storybook/utils/columnDefinition.d.ts

@@ -8,3 +8,5 @@ export declare const oversizedColumnDefinition: {
 }[];
 export declare const enumColumn: ColumnDefinition;
 export declare const columnDefinitions: ColumnDefinition[];
+export declare const stickyColumn: ColumnDefinition;
+export declare const columnDefinitionsWithSticky: ColumnDefinition[];

package/ui/Blocks/CommonGrid/storybook/utils/columnDefinition.js

@@ -1,3 +1,12 @@
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
 import { ComplexCell } from '../components/ComplexCell';
 import { EnumCellExample } from '../components/EnumCellExample';
 import { enumValues } from './utils';
@@ -101,18 +110,19 @@ export var columnDefinitions = [
         flexBasis: 350,
         cellComponent: ComplexCell
     },
-    {
-        name: 'stickyColumn',
-        title: 'Sticky Column',
-        flexBasis: 160,
-        alwaysOn: true,
-        sticky: true,
-        stickTo: 'right'
-    },
     {
         name: 'alwaysOffColumn',
         title: 'Always Off Column',
         flexBasis: 0,
-        alwaysOff: true,
+        alwaysOff: true
     }
 ];
+export var stickyColumn = {
+    name: 'stickyColumn',
+    title: 'Sticky Column',
+    flexBasis: 160,
+    alwaysOn: true,
+    sticky: true,
+    stickTo: 'right'
+};
+export var columnDefinitionsWithSticky = __spreadArray(__spreadArray([], columnDefinitions, true), [stickyColumn], false);

package/ui/Blocks/CommonGrid/styles.d.ts

@@ -1,13 +1,14 @@
-export declare const BottomWrapper: import('styled-components').StyledComponent<(props: Omit<JSX.IntrinsicElements[string], "color">) => import('react').ReactElement<any, string>, import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
+/// <reference types="react" />
+export declare const BottomWrapper: import('styled-components').StyledComponent<(props: Omit<JSX.IntrinsicElements, "color">) => import('react').ReactElement<any, string>, import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
     withPagination: boolean;
 }, "color">;
-export declare const ContentContainer: import('styled-components').StyledComponent<(props: Omit<JSX.IntrinsicElements[string], "color">) => import('react').ReactElement<any, string>, import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, "color">;
-export declare const CommonGridWrap: import('styled-components').StyledComponent<(props: Omit<JSX.IntrinsicElements[string], "color">) => import('react').ReactElement<any, string>, import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
+export declare const ContentContainer: import('styled-components').StyledComponent<(props: Omit<JSX.IntrinsicElements, "color">) => import('react').ReactElement<any, string>, import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, "color">;
+export declare const CommonGridWrap: import('styled-components').StyledComponent<(props: Omit<JSX.IntrinsicElements, "color">) => import('react').ReactElement<any, string>, import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
     withPagination: boolean;
 }, "color">;
-export declare const StyledButtonStrip: import('styled-components').StyledComponent<(props: Omit<JSX.IntrinsicElements[string], "color">) => import('react').ReactElement<any, string>, import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, "color">;
+export declare const StyledButtonStrip: import('styled-components').StyledComponent<(props: Omit<JSX.IntrinsicElements, "color">) => import('react').ReactElement<any, string>, import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, "color">;
 export declare const CommonGridWithStyles: import('styled-components').StyledComponent<import('react').FC<import('./types').CommonGridProps & {
-    filters?: import('./types').FiltersConfig;
+    filters?: import('./types').FiltersConfig | undefined;
     handleDragEnd: (item: import('@dnd-kit/core').DragEndEvent) => void;
     displayColumnsDefinitions: import('./types').ColumnDefinition[];
     hasGroups: boolean;
@@ -15,4 +16,5 @@ export declare const CommonGridWithStyles: import('styled-components').StyledCom
 }>, import('@xstyled/system').Theme, {
     withButtonStrip: boolean;
     hasGroupsOrFilters: boolean;
+    hasGroups: boolean;
 }, never>;

package/ui/Blocks/CommonGrid/styles.js

@@ -21,14 +21,17 @@ export var CommonGridWrap = styled(x.div)(templateObject_3 || (templateObject_3
     var withPagination = _a.withPagination;
     return (withPagination ? gridFooterHeight : 0);
 });
-export var StyledButtonStrip = styled(x.div)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: relative;\n  padding: 18px 20px;\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  min-height: ", "px;\n  flex-wrap: wrap;\n  z-index: 3;\n"], ["\n  position: relative;\n  padding: 18px 20px;\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  min-height: ", "px;\n  flex-wrap: wrap;\n  z-index: 3;\n"])), gridButtonStripHeight);
-export var CommonGridWithStyles = styled(CommonGrid)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  height: calc(100% - ", "px);\n\n  & .cell {\n    padding: 0 4px;\n  }\n  & .dataRow {\n    font-size: 12px;\n    font-family: ", ";\n    color: typoPrimary;\n    font-weight: normal;\n    border-bottom: 1px solid;\n    border-color: lightGray3;\n    height: ", "px;\n  }\n  & .gridHead {\n    height: ", "px;\n    background-color: neutral20;\n    padding-bottom: 8px;\n    position: sticky;\n    top: -1px;\n    z-index: 2;\n    border-top: 1px solid ", ";\n  }\n  & .headRow {\n    font-size: 12px;\n    font-family: ", ";\n    color: typoPrimary;\n    font-weight: bold;\n    border-bottom: none; // TODO fix in common-grid\n\n    & .cell {\n      overflow: hidden;\n      max-height: 32px;\n      position: relative;\n    }\n\n    & .sticky {\n      background-color: bgLightGray1;\n    }\n  }\n\n  & .filterRow {\n    & .cell {\n      overflow: visible;\n    }\n\n    & .cell > div {\n      width: 100%; // TODO fix in common-grid\n    }\n\n    & .sticky {\n      background-color: bgLightGray1;\n    }\n    border-bottom: none; // TODO fix in common-grid\n  }\n\n  & .body {\n    flex-grow: 1;\n  }\n\n  & .gridWrapper {\n    background-color: ", ";\n    width: auto;\n    padding-bottom: 35px;\n\n    @media (min-width: 1024px) {\n      height: 100%;\n      overflow-y: auto;\n      padding-bottom: 0;\n    }\n    @media print {\n      margin: 0;\n      width: 100%;\n      height: auto;\n      overflow-x: hidden;\n    }\n  }\n\n  & .fullWidthGrid > .gridWrapper > div {\n    width: 100% !important;\n  }\n\n  & .paginatorWrapper,\n  & .buttonsStrip {\n    @media print {\n      display: none;\n    }\n  }\n  & .cell {\n    padding-left: 4px;\n    padding-right: 4px;\n    @media print {\n      white-space: unset;\n    }\n  }\n\n  .dataRow {\n    &.grayedOut {\n      background: lightGray1;\n    }\n\n    .sticky-right,\n    .sticky-left {\n      background: white;\n    }\n\n    .sticky-right {\n      border-left: 1px solid #dfe1e6;\n    }\n\n    .sticky-left {\n      border-right: 1px solid #dfe1e6;\n    }\n\n    &:hover,\n    &.checked,\n    &.selected {\n      background-color: red30;\n    }\n  }\n\n  .dataRow:nth-child(even) {\n    .sticky-left,\n    .sticky-right {\n      background-color: bgLightGray;\n    }\n  }\n\n  @media print {\n    .filterRow .sticky {\n      display: none;\n    }\n\n    .headRow .sticky {\n      display: none;\n    }\n\n    .dataRow .sticky {\n      display: none;\n    }\n  }\n\n  .resizer {\n    z-index: unset;\n  }\n\n  // hotfix table head\n  .cell .sortable {\n    display: flex;\n    align-items: center;\n    padding-right: 2px;\n  }\n\n  .sticky {\n    position: sticky !important;\n    z-index: 1;\n  }\n\n  .sticky-left {\n    left: 0;\n  }\n\n  .sticky-right {\n    right: 0;\n  }\n"], ["\n  height: calc(100% - ", "px);\n\n  & .cell {\n    padding: 0 4px;\n  }\n  & .dataRow {\n    font-size: 12px;\n    font-family: ", ";\n    color: typoPrimary;\n    font-weight: normal;\n    border-bottom: 1px solid;\n    border-color: lightGray3;\n    height: ", "px;\n  }\n  & .gridHead {\n    height: ", "px;\n    background-color: neutral20;\n    padding-bottom: 8px;\n    position: sticky;\n    top: -1px;\n    z-index: 2;\n    border-top: 1px solid ", ";\n  }\n  & .headRow {\n    font-size: 12px;\n    font-family: ", ";\n    color: typoPrimary;\n    font-weight: bold;\n    border-bottom: none; // TODO fix in common-grid\n\n    & .cell {\n      overflow: hidden;\n      max-height: 32px;\n      position: relative;\n    }\n\n    & .sticky {\n      background-color: bgLightGray1;\n    }\n  }\n\n  & .filterRow {\n    & .cell {\n      overflow: visible;\n    }\n\n    & .cell > div {\n      width: 100%; // TODO fix in common-grid\n    }\n\n    & .sticky {\n      background-color: bgLightGray1;\n    }\n    border-bottom: none; // TODO fix in common-grid\n  }\n\n  & .body {\n    flex-grow: 1;\n  }\n\n  & .gridWrapper {\n    background-color: ", ";\n    width: auto;\n    padding-bottom: 35px;\n\n    @media (min-width: 1024px) {\n      height: 100%;\n      overflow-y: auto;\n      padding-bottom: 0;\n    }\n    @media print {\n      margin: 0;\n      width: 100%;\n      height: auto;\n      overflow-x: hidden;\n    }\n  }\n\n  & .fullWidthGrid > .gridWrapper > div {\n    width: 100% !important;\n  }\n\n  & .paginatorWrapper,\n  & .buttonsStrip {\n    @media print {\n      display: none;\n    }\n  }\n  & .cell {\n    padding-left: 4px;\n    padding-right: 4px;\n    @media print {\n      white-space: unset;\n    }\n  }\n\n  .dataRow {\n    &.grayedOut {\n      background: lightGray1;\n    }\n\n    .sticky-right,\n    .sticky-left {\n      background: white;\n    }\n\n    .sticky-right {\n      border-left: 1px solid #dfe1e6;\n    }\n\n    .sticky-left {\n      border-right: 1px solid #dfe1e6;\n    }\n\n    &:hover,\n    &.checked,\n    &.selected {\n      background-color: red30;\n    }\n  }\n\n  .dataRow:nth-child(even) {\n    .sticky-left,\n    .sticky-right {\n      background-color: bgLightGray;\n    }\n  }\n\n  @media print {\n    .filterRow .sticky {\n      display: none;\n    }\n\n    .headRow .sticky {\n      display: none;\n    }\n\n    .dataRow .sticky {\n      display: none;\n    }\n  }\n\n  .resizer {\n    z-index: unset;\n  }\n\n  // hotfix table head\n  .cell .sortable {\n    display: flex;\n    align-items: center;\n    padding-right: 2px;\n  }\n\n  .sticky {\n    position: sticky !important;\n    z-index: 1;\n  }\n\n  .sticky-left {\n    left: 0;\n  }\n\n  .sticky-right {\n    right: 0;\n  }\n"])), function (_a) {
+export var StyledButtonStrip = styled(x.div)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: relative;\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  min-height: auto;\n  padding: 10px;\n  flex-wrap: wrap;\n  z-index: 3;\n\n  @media (min-width: 768px) {\n    min-height: ", "px;\n    padding: 18px 20px;\n  }\n"], ["\n  position: relative;\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  min-height: auto;\n  padding: 10px;\n  flex-wrap: wrap;\n  z-index: 3;\n\n  @media (min-width: 768px) {\n    min-height: ", "px;\n    padding: 18px 20px;\n  }\n"])), gridButtonStripHeight);
+export var CommonGridWithStyles = styled(CommonGrid)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  height: calc(100% - ", "px);\n\n  & .cell {\n    padding: 0 4px;\n  }\n  & .dataRow {\n    font-size: 12px;\n    font-family: ", ";\n    color: typoPrimary;\n    font-weight: normal;\n    border-bottom: 1px solid;\n    border-color: lightGray3;\n    height: ", "px;\n  }\n  & .gridHead {\n    height: ", "px;\n    background-color: neutral20;\n    padding-bottom: 8px;\n    position: sticky;\n    top: -1px;\n    z-index: 2;\n    border-top: 1px solid ", ";\n  }\n\n  & .filterRow {\n    display: none;\n  }\n\n  @media (min-width: 1023px) {\n    & .gridHead {\n      height: ", "px;\n    }\n    & .filterRow {\n      display: flex;\n    }\n  }\n  & .headRow {\n    font-size: 12px;\n    font-family: ", ";\n    color: typoPrimary;\n    font-weight: bold;\n    border-bottom: none; // TODO fix in common-grid\n\n    & .cell {\n      overflow: hidden;\n      max-height: 32px;\n      position: relative;\n    }\n\n    & .sticky {\n      background-color: bgLightGray1;\n    }\n  }\n\n  & .filterRow {\n    & .cell {\n      overflow: visible;\n    }\n\n    & .cell > div {\n      width: 100%; // TODO fix in common-grid\n    }\n\n    & .sticky {\n      background-color: bgLightGray1;\n    }\n    border-bottom: none; // TODO fix in common-grid\n  }\n\n  & .body {\n    flex-grow: 1;\n  }\n\n  & .gridWrapper {\n    background-color: ", ";\n    width: auto;\n    padding-bottom: 35px;\n\n    @media (min-width: 1024px) {\n      height: 100%;\n      overflow-y: auto;\n      padding-bottom: 0;\n    }\n    @media print {\n      margin: 0;\n      width: 100%;\n      height: auto;\n      overflow-x: hidden;\n    }\n  }\n\n  & .fullWidthGrid > .gridWrapper > div {\n    width: 100% !important;\n  }\n\n  & .paginatorWrapper,\n  & .buttonsStrip {\n    @media print {\n      display: none;\n    }\n  }\n  & .cell {\n    padding-left: 4px;\n    padding-right: 4px;\n    @media print {\n      white-space: unset;\n    }\n  }\n\n  .dataRow {\n    &.grayedOut {\n      background: lightGray1;\n    }\n\n    .sticky-right,\n    .sticky-left {\n      background: white;\n    }\n\n    .sticky-right {\n      border-left: 1px solid #dfe1e6;\n    }\n\n    .sticky-left {\n      border-right: 1px solid #dfe1e6;\n    }\n\n    &:hover,\n    &.checked,\n    &.selected {\n      background-color: red30;\n    }\n  }\n\n  .dataRow:nth-child(even) {\n    .sticky-left,\n    .sticky-right {\n      background-color: bgLightGray;\n    }\n  }\n\n  @media print {\n    .filterRow .sticky {\n      display: none;\n    }\n\n    .headRow .sticky {\n      display: none;\n    }\n\n    .dataRow .sticky {\n      display: none;\n    }\n  }\n\n  .resizer {\n    z-index: unset;\n  }\n\n  // hotfix table head\n  .cell .sortable {\n    display: flex;\n    align-items: center;\n    padding-right: 2px;\n  }\n\n  .sticky {\n    position: sticky !important;\n    z-index: 1;\n  }\n\n  .sticky-left {\n    left: 0;\n  }\n\n  .sticky-right {\n    right: 0;\n  }\n"], ["\n  height: calc(100% - ", "px);\n\n  & .cell {\n    padding: 0 4px;\n  }\n  & .dataRow {\n    font-size: 12px;\n    font-family: ", ";\n    color: typoPrimary;\n    font-weight: normal;\n    border-bottom: 1px solid;\n    border-color: lightGray3;\n    height: ", "px;\n  }\n  & .gridHead {\n    height: ", "px;\n    background-color: neutral20;\n    padding-bottom: 8px;\n    position: sticky;\n    top: -1px;\n    z-index: 2;\n    border-top: 1px solid ", ";\n  }\n\n  & .filterRow {\n    display: none;\n  }\n\n  @media (min-width: 1023px) {\n    & .gridHead {\n      height: ", "px;\n    }\n    & .filterRow {\n      display: flex;\n    }\n  }\n  & .headRow {\n    font-size: 12px;\n    font-family: ", ";\n    color: typoPrimary;\n    font-weight: bold;\n    border-bottom: none; // TODO fix in common-grid\n\n    & .cell {\n      overflow: hidden;\n      max-height: 32px;\n      position: relative;\n    }\n\n    & .sticky {\n      background-color: bgLightGray1;\n    }\n  }\n\n  & .filterRow {\n    & .cell {\n      overflow: visible;\n    }\n\n    & .cell > div {\n      width: 100%; // TODO fix in common-grid\n    }\n\n    & .sticky {\n      background-color: bgLightGray1;\n    }\n    border-bottom: none; // TODO fix in common-grid\n  }\n\n  & .body {\n    flex-grow: 1;\n  }\n\n  & .gridWrapper {\n    background-color: ", ";\n    width: auto;\n    padding-bottom: 35px;\n\n    @media (min-width: 1024px) {\n      height: 100%;\n      overflow-y: auto;\n      padding-bottom: 0;\n    }\n    @media print {\n      margin: 0;\n      width: 100%;\n      height: auto;\n      overflow-x: hidden;\n    }\n  }\n\n  & .fullWidthGrid > .gridWrapper > div {\n    width: 100% !important;\n  }\n\n  & .paginatorWrapper,\n  & .buttonsStrip {\n    @media print {\n      display: none;\n    }\n  }\n  & .cell {\n    padding-left: 4px;\n    padding-right: 4px;\n    @media print {\n      white-space: unset;\n    }\n  }\n\n  .dataRow {\n    &.grayedOut {\n      background: lightGray1;\n    }\n\n    .sticky-right,\n    .sticky-left {\n      background: white;\n    }\n\n    .sticky-right {\n      border-left: 1px solid #dfe1e6;\n    }\n\n    .sticky-left {\n      border-right: 1px solid #dfe1e6;\n    }\n\n    &:hover,\n    &.checked,\n    &.selected {\n      background-color: red30;\n    }\n  }\n\n  .dataRow:nth-child(even) {\n    .sticky-left,\n    .sticky-right {\n      background-color: bgLightGray;\n    }\n  }\n\n  @media print {\n    .filterRow .sticky {\n      display: none;\n    }\n\n    .headRow .sticky {\n      display: none;\n    }\n\n    .dataRow .sticky {\n      display: none;\n    }\n  }\n\n  .resizer {\n    z-index: unset;\n  }\n\n  // hotfix table head\n  .cell .sortable {\n    display: flex;\n    align-items: center;\n    padding-right: 2px;\n  }\n\n  .sticky {\n    position: sticky !important;\n    z-index: 1;\n  }\n\n  .sticky-left {\n    left: 0;\n  }\n\n  .sticky-right {\n    right: 0;\n  }\n"])), function (_a) {
     var withButtonStrip = _a.withButtonStrip;
     return (withButtonStrip ? gridButtonStripHeight : 0);
 }, th('fonts.primary'), gridRowHeight, function (_a) {
+    var hasGroups = _a.hasGroups;
+    return gridHeadHeight + (hasGroups ? gridFilterHeight : 0);
+}, th('colors.lightGray6'), function (_a) {
     var hasGroupsOrFilters = _a.hasGroupsOrFilters;
     return gridHeadHeight + (hasGroupsOrFilters ? gridFilterHeight : 0);
-}, th('colors.lightGray6'), th('fonts.primary'), function (_a) {
+}, th('fonts.primary'), function (_a) {
     var theme = _a.theme;
     return theme.colors.white;
 });

package/ui/Blocks/CommonGrid/types.d.ts

@@ -229,6 +229,7 @@ export type GridActionsType = {
     setFilters?: (filters: Filtering) => void;
     resetFilters?: () => void;
     addSorting?: (column: string, direction: SortingValueType) => void;
+    resetSorting?: () => void;
     openConfigForm?: () => void;
     closeConfigForm?: () => void;
     clearSettings?: () => void;

package/ui/Blocks/CommonGrid/utils/index.d.ts

@@ -14,10 +14,12 @@ export declare const calculatePaginator: (page: number, rowsPerPage: number) =>
     offset: number;
     limit: number;
 };
-export declare const createFilterType: (columnDefinition: ColumnDefinition) => FilterProps["type"];
+export declare const createFilterType: (columnDefinition: ColumnDefinition) => FilterProps['type'];
 export declare const getGroups: (columns: ColumnDefinition[]) => Group[];
 export declare const getGroupClassNames: (group?: Group) => string;
 export declare const getStickyCollClassNames: (sticky: boolean, stickTo?: StickTo) => string;
 export declare const getFilters: (optimizeFilters: boolean) => FiltersConfig;
+/** Returns true when a filter value should be counted / applied */
+export declare const isFilterActive: (value: any) => boolean;
 export declare const checksColumnsOrder: (colsOrder: string[], columnsDefinitions: ColumnDefinition[]) => void;
 export {};

package/ui/Blocks/CommonGrid/utils/index.js

@@ -76,6 +76,16 @@ export var getFilters = function (optimizeFilters) {
     }
     return filters;
 };
+/** Returns true when a filter value should be counted / applied */
+export var isFilterActive = function (value) {
+    if (value == null)
+        return false;
+    if (Array.isArray(value))
+        return !!value.length;
+    if (typeof value === 'object')
+        return value.value != null && value.value !== '';
+    return value !== '';
+};
 export var checksColumnsOrder = function (colsOrder, columnsDefinitions) {
     var stickyRightColls = columnsDefinitions.filter(function (col) { return col.sticky === true && col.stickTo === 'right'; });
     var stickyLeftColls = columnsDefinitions.filter(function (col) { return col.sticky === true && col.stickTo !== 'right'; });

package/ui/Blocks/Header/components/MenuItems/styles.d.ts

@@ -1,4 +1,4 @@
 export declare const MenuItemsList: import('styled-components').StyledComponent<"ul", import('@xstyled/system').Theme, {}, never>;
 export declare const MenuItemsListItem: import('styled-components').StyledComponent<"li", import('@xstyled/system').Theme, {
-    pointer?: boolean;
+    pointer?: boolean | undefined;
 }, never>;

package/ui/Blocks/Header/stories/Header.stories.d.ts

@@ -4,22 +4,22 @@ declare const meta: {
     title: string;
     component: FC<{
         homeLink: string;
-        isMobileMenuOpen?: boolean;
-        logo?: import('../../..').Brand;
-        logoVariant?: import('../../..').Variant;
-        logoSrc?: string;
-        logoSrcWidth?: string;
-        user?: import('../types').User | null;
-        currentLanguage?: string;
-        hasUserMenu?: boolean;
-        rightMenuItems?: import('../../SideMenu').MenuItemType[];
-        languageItems?: import('../../LanguageSwitch').LanguageItem[];
-        showLanguageWithTitle?: boolean;
-        languageFlagWrapBackgroundColor?: string;
-        onOpenMobileSideMenu?: () => void;
-        onChangeLanguage?: (language: string) => void;
-        onLogout?: () => void;
-        withLanguageSwitch?: boolean;
+        isMobileMenuOpen?: boolean | undefined;
+        logo?: import('../../..').Brand | undefined;
+        logoVariant?: import('../../..').Variant | undefined;
+        logoSrc?: string | undefined;
+        logoSrcWidth?: string | undefined;
+        user?: import('../types').User | null | undefined;
+        currentLanguage?: string | undefined;
+        hasUserMenu?: boolean | undefined;
+        rightMenuItems?: import('../../SideMenu').MenuItemType[] | undefined;
+        languageItems?: import('../../LanguageSwitch').LanguageItem[] | undefined;
+        showLanguageWithTitle?: boolean | undefined;
+        languageFlagWrapBackgroundColor?: string | undefined;
+        onOpenMobileSideMenu?: (() => void) | undefined;
+        onChangeLanguage?: ((language: string) => void) | undefined;
+        onLogout?: (() => void) | undefined;
+        withLanguageSwitch?: boolean | undefined;
     }>;
     tags: string[];
     argTypes: {};

package/ui/Blocks/ImageList/components/AddPhoto/index.js

@@ -8,8 +8,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");

package/ui/Blocks/ImageList/components/AddPhoto/styles.d.ts

@@ -1,5 +1,5 @@
 export declare const Container: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    isDisabled?: boolean;
-    hasRemove?: boolean;
+    isDisabled?: boolean | undefined;
+    hasRemove?: boolean | undefined;
 }, never>;
 export declare const HiddenInput: import('styled-components').StyledComponent<"input", import('@xstyled/system').Theme, {}, never>;

package/ui/Blocks/ImageList/components/CloseButton/styles.d.ts

@@ -1,3 +1,3 @@
 export declare const Container: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    isDisabled?: boolean;
+    isDisabled?: boolean | undefined;
 }, never>;

package/ui/Blocks/ImageList/components/ImageElement/styles.d.ts

@@ -1,6 +1,6 @@
 export declare const Container: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const Image: import('styled-components').StyledComponent<"img", import('@xstyled/system').Theme, {
-    selected?: boolean;
+    selected?: boolean | undefined;
 }, never>;
 export declare const ImageWrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
     visible: boolean;

package/ui/Blocks/ImageList/styles.d.ts

@@ -1,6 +1,6 @@
 export declare const ImageListContainer: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const Control: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    isLeft?: boolean;
+    isLeft?: boolean | undefined;
     isDisabled: boolean;
-    hasRemove?: boolean;
+    hasRemove?: boolean | undefined;
 }, never>;

package/ui/Blocks/LanguageSwitch/styles.d.ts

@@ -1,11 +1,11 @@
 import { Placement } from './types';
 
 export declare const StyledFlag: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
-export declare const StyledDropdownMenu: import('styled-components').StyledComponent<(<T extends import('../../Elements/DropdownMenu/types').Item>({ items, showMenu, className, ItemComponent, header, footer, ...rest }: import('../../Elements/DropdownMenu/types').DropdownMenuProps<T>) => import('react').ReactElement), import('@xstyled/system').Theme, {
+export declare const StyledDropdownMenu: import('styled-components').StyledComponent<(<T extends import('../../Elements/DropdownMenu/types').Item>({ items, showMenu, className, ItemComponent, header, footer, ...rest }: import('../../Elements/DropdownMenu/types').DropdownMenuProps<T>) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>), import('@xstyled/system').Theme, {
     placement: Placement;
 }, never>;
 export declare const LanguageSwitchWrap: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const LanguageFlagWrap: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    backgroundColor?: string;
-    withTitle?: boolean;
+    backgroundColor?: string | undefined;
+    withTitle?: boolean | undefined;
 }, never>;

package/ui/Blocks/LoginPage/stories/LoginPage.stories.js

@@ -8,8 +8,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");

package/ui/Blocks/LoginPage/styles.d.ts

@@ -1,7 +1,6 @@
-import { BackgroundImages } from './types';
-
+/// <reference types="react" />
 export declare const Wrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {
-    backgroundImage?: BackgroundImages;
+    backgroundImage?: "mailship" | undefined;
 }, never>;
 export declare const LanguageBox: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
 export declare const CardBodyWithLanguage: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;