@mailstep/design-system 0.4.21 → 0.5.0-beta.10

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

@@ -0,0 +1,14 @@
+// v1 to v2
+var v2 = function (draft) {
+    Object.keys(draft).forEach(function (gridName) {
+        if (draft[gridName].columnConfig && Array.isArray(draft[gridName].columnConfig)) {
+            draft[gridName].columnConfig = {};
+        }
+    });
+    return draft;
+};
+// migration management
+export default (function (draft) {
+    draft = v2(draft);
+    return draft;
+});

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

@@ -0,0 +1,11 @@
+declare const _default: {
+    title: string;
+    decorators: ((story: Function) => JSX.Element)[];
+};
+export default _default;
+export declare const ComplexWithPaginationAndRedux: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};

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

@@ -0,0 +1,31 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { ReduxGrid, createRandomData, enumValues, gridDummyActions } from '../utils/utils';
+import { onRowEditClick, onRowReadClick, onRowAction, onBatchAction } from '../utils/actions';
+import { filters } from '../utils/filters';
+import { useAddFilter } from '../../utils/public';
+import withReduxActions from '../../HoC/withReduxActions';
+import { columnDefinitions, enumColumn } from '../utils/columnDefinition';
+import withRedux from '../utils/withRedux';
+var ActionColumnButtons = {
+    flexBasis: 160,
+    canRowRead: true,
+    canRowEdit: function (row) { return row.enumColumn !== 'option C'; },
+};
+var FilterSetter = function (_a) {
+    var gridActions = _a.gridActions;
+    var handleAddFilter = useAddFilter(gridActions === null || gridActions === void 0 ? void 0 : gridActions.addFilter);
+    React.useEffect(function () {
+        handleAddFilter(enumValues[1], enumColumn);
+    }, []);
+    return null;
+};
+var ConnectedFilterSetter = withReduxActions('testGrid')(FilterSetter);
+export default {
+    title: '@Blocks/CommonGrid',
+    decorators: [withRedux],
+};
+export var ComplexWithPaginationAndRedux = function () { return (_jsxs(_Fragment, { children: [_jsx(ConnectedFilterSetter, { gridActions: gridDummyActions }), _jsx(ReduxGrid, { filters: filters, columnsDefinitions: columnDefinitions, actionColumnDefinition: ActionColumnButtons, rowsData: createRandomData(10), onRowAction: onRowAction, onRowReadClick: onRowReadClick, onRowEditClick: onRowEditClick, totalRowsCount: 200, onBatchAction: onBatchAction, confirmOnReset: function () { return window.confirm('Are you sure you want to reset grid?'); } })] })); };
+ComplexWithPaginationAndRedux.story = {
+    name: 'Complex, with pagination and redux',
+};

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

@@ -0,0 +1,13 @@
+import { ExtraControlButton } from '../../types';
+export declare const extraControlButtons: ExtraControlButton[];
+declare const _default: {
+    title: string;
+    excludeStories: string[];
+};
+export default _default;
+export declare const CustomControllButtons: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};

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

@@ -0,0 +1,49 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import CommonGrid from '../../CommonGrid';
+import { createRandomData, gridSelectors, gridDummyActions } from '../utils/utils';
+import { oversizedColumnDefinition } from '../utils/columnDefinition';
+import { ExtraControlButtonPosition } from '../../types';
+export var extraControlButtons = [
+    {
+        label: _jsx(_Fragment, { children: "default left" }),
+        onClick: function () { return alert('test ok'); },
+    },
+    {
+        label: _jsx(_Fragment, { children: "right button" }),
+        onClick: function () { return alert('test ok'); },
+        position: ExtraControlButtonPosition.TopRight,
+    },
+    {
+        label: _jsx(_Fragment, { children: "bottom left button" }),
+        onClick: function () { return alert('test ok'); },
+        position: ExtraControlButtonPosition.BottomLeft,
+    },
+    {
+        label: _jsx(_Fragment, { children: "right options" }),
+        onClick: function () { return alert('test ok'); },
+        onSelect: function (value) { return alert(value); },
+        position: ExtraControlButtonPosition.TopRight,
+        options: [
+            {
+                label: 'Label A',
+                value: 'A',
+            },
+            {
+                label: 'Label B',
+                value: 'B',
+            },
+        ],
+    },
+    {
+        node: (_jsxs("span", { style: { marginLeft: '15px' }, children: [_jsx("span", { children: "custom node with btn - " }), _jsx("button", { onClick: function () { return alert('test ok'); }, children: "btn" })] })),
+        position: ExtraControlButtonPosition.TopRight,
+    },
+];
+export default {
+    title: '@Blocks/CommonGrid',
+    excludeStories: ['extraControlButtons'],
+};
+export var CustomControllButtons = function () { return (_jsx(CommonGrid, { rowsData: createRandomData(10), columnsDefinitions: oversizedColumnDefinition, extraControlButtons: extraControlButtons, hideColumnConfig: true, gridSelectors: gridSelectors, gridActions: gridDummyActions })); };
+CustomControllButtons.story = {
+    name: 'custom controll buttons',
+};

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

@@ -0,0 +1,6 @@
+declare const _default: {
+    title: string;
+    decorators: ((story: Function) => JSX.Element)[];
+};
+export default _default;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import CommonGrid from '../../CommonGrid';
+import { createRandomData, gridSelectors, gridDummyActions } from '../utils/utils';
+import { columnDefinitions } from '../utils/columnDefinition';
+import withTheme from '../utils/withTheme';
+import withRouter from '../utils/withRouter';
+import withRedux from '../utils/withRedux';
+export default {
+    title: '@Blocks/CommonGrid',
+    decorators: [withTheme, withRouter, withRedux],
+};
+export var Default = function () {
+    return (_jsx(CommonGrid, { columnsDefinitions: columnDefinitions, rowsData: createRandomData(10), gridActions: gridDummyActions, gridSelectors: gridSelectors }));
+};

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

@@ -0,0 +1,10 @@
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const LoadingState: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};

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

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import CommonGrid from '../../CommonGrid';
+import { createRandomData, gridSelectors, gridDummyActions } from '../utils/utils';
+import { columnDefinitions } from '../utils/columnDefinition';
+export default {
+    title: '@Blocks/CommonGrid',
+};
+export var LoadingState = function () { return (_jsx(CommonGrid, { columnsDefinitions: columnDefinitions, rowsData: createRandomData(10), gridSelectors: gridSelectors, gridActions: gridDummyActions, isLoading: true, hideColumnConfig: true })); };
+LoadingState.story = {
+    name: 'Loading state',
+};

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

@@ -0,0 +1,10 @@
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const ManyColumnsNoScrollLayout: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};

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

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import CommonGrid from '../../CommonGrid';
+import { createOversizedRandomData, gridSelectors, gridDummyActions } from '../utils/utils';
+import { oversizedColumnDefinition } from '../utils/columnDefinition';
+import { filters } from '../utils/filters';
+export default {
+    title: '@Blocks/CommonGrid',
+};
+export var ManyColumnsNoScrollLayout = function () { return (_jsx(CommonGrid, { rowsData: createOversizedRandomData(5), filters: filters, columnsDefinitions: oversizedColumnDefinition, columnLayout: "no-scroll", hideColumnConfig: true, gridSelectors: gridSelectors, gridActions: gridDummyActions })); };
+ManyColumnsNoScrollLayout.story = {
+    name: 'many columns no-scroll layout',
+};

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

@@ -0,0 +1,10 @@
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const ManyColumnsNormalLayoutANoControls: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};

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

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import CommonGrid from '../../CommonGrid';
+import { createOversizedRandomData, gridSelectors, gridDummyActions } from '../utils/utils';
+import { oversizedColumnDefinition } from '../utils/columnDefinition';
+import { filters } from '../utils/filters';
+export default {
+    title: '@Blocks/CommonGrid',
+};
+export var ManyColumnsNormalLayoutANoControls = function () { return (_jsx(CommonGrid, { rowsData: createOversizedRandomData(5), filters: filters, columnsDefinitions: oversizedColumnDefinition, hideColumnConfig: true, gridSelectors: gridSelectors, gridActions: gridDummyActions, hideAllControls: true })); };
+ManyColumnsNormalLayoutANoControls.story = {
+    name: 'many columns normal layout a no controls',
+};

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

@@ -0,0 +1,6 @@
+declare const _default: {
+    title: string;
+    decorators: ((story: Function) => JSX.Element)[];
+};
+export default _default;
+export declare const Styled: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ReduxGrid, createRandomData, gridSelectors, gridDummyActions } from '../utils/utils';
+import { filters } from '../utils/filters';
+import { onRowAction } from '../utils/actions';
+import { columnDefinitions } from '../utils/columnDefinition';
+import withTheme from '../utils/withTheme';
+import withRouter from '../utils/withRouter';
+import withRedux from '../utils/withRedux';
+export default {
+    title: '@Blocks/CommonGrid',
+    decorators: [withTheme, withRouter, withRedux],
+};
+export var Styled = function () {
+    return (_jsx("div", { className: "styled", children: _jsx(ReduxGrid, { filters: filters, columnsDefinitions: columnDefinitions, rowsData: createRandomData(10), onRowAction: onRowAction, gridActions: gridDummyActions, gridSelectors: gridSelectors }) }));
+};

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

@@ -0,0 +1,10 @@
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const WithCustomGridActions: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};

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

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import CommonGrid from '../../CommonGrid';
+import { createRandomData, gridSelectors, gridDummyActions } from '../utils/utils';
+import { columnDefinitions } from '../utils/columnDefinition';
+import { onRowAction } from '../utils/actions';
+import { filters } from '../utils/filters';
+export default {
+    title: '@Blocks/CommonGrid',
+};
+export var WithCustomGridActions = function () {
+    return (_jsx(CommonGrid, { filters: filters, columnsDefinitions: columnDefinitions, rowsData: createRandomData(10), onRowAction: onRowAction, gridSelectors: gridSelectors, gridActions: gridDummyActions, hideColumnConfig: true }));
+};
+WithCustomGridActions.story = {
+    name: 'With custom grid actions',
+};

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

@@ -0,0 +1,14 @@
+import { ActionColumn } from '../../types';
+export declare const ActionColumnCheckboxes: ActionColumn;
+declare const _default: {
+    title: string;
+    decorators: ((story: Function) => JSX.Element)[];
+    excludeStories: string[];
+};
+export default _default;
+export declare const WithForcedCheckboxesAndCustomTitle: {
+    (): import("react/jsx-runtime").JSX.Element;
+    story: {
+        name: string;
+    };
+};

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

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ReduxGrid, createRandomData } from '../utils/utils';
+import { onRowEditClick, onRowReadClick, onRowAction } from '../utils/actions';
+import { columnDefinitions } from '../utils/columnDefinition';
+import withRedux from '../utils/withRedux';
+export var ActionColumnCheckboxes = {
+    flexBasis: 160,
+    forceCheckboxes: true,
+};
+var components = {
+    ColumnTitle: function (_a) {
+        var title = _a.title, isSortable = _a.isSortable;
+        return _jsx("div", { children: "".concat(title, " is ").concat(isSortable ? '' : 'NOT', " sortable") });
+    },
+};
+export default {
+    title: '@Blocks/CommonGrid',
+    decorators: [withRedux],
+    excludeStories: ['ActionColumnCheckboxes'],
+};
+export var WithForcedCheckboxesAndCustomTitle = function () { return (_jsx(ReduxGrid, { columnsDefinitions: columnDefinitions, actionColumnDefinition: ActionColumnCheckboxes, rowsData: createRandomData(10), onRowAction: onRowAction, onRowReadClick: onRowReadClick, onRowEditClick: onRowEditClick, totalRowsCount: 200, components: components })); };
+WithForcedCheckboxesAndCustomTitle.story = {
+    name: 'With forced checkboxes and custom title',
+};

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

@@ -0,0 +1,4 @@
+export declare const onRowEditClick: (id: string, props: object) => void;
+export declare const onRowReadClick: (id: string, props: object) => void;
+export declare const onRowAction: (id: string, field: string, value: string | boolean) => void;
+export declare const onBatchAction: (action: string, affectedRows: object[]) => void;

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

@@ -0,0 +1,6 @@
+export var onRowEditClick = function (id, props) { return console.log('onRowEditClick', id, props); };
+export var onRowReadClick = function (id, props) { return console.log('onRowReadClick', id, props); };
+export var onRowAction = function (id, field, value) { return console.log('onRowAction', id, field, value); };
+export var onBatchAction = function (action, affectedRows) {
+    console.log('onBatchAction called', action, affectedRows);
+};

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

@@ -0,0 +1,10 @@
+import { ColumnDefinition } from '../../types';
+export declare const oversizedArrayColumns = 25;
+export declare const enumValues: string[];
+export declare const oversizedColumnDefinition: {
+    name: string;
+    title: string;
+    flexBasis: number;
+}[];
+export declare const enumColumn: ColumnDefinition;
+export declare const columnDefinitions: ColumnDefinition[];

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

@@ -0,0 +1,97 @@
+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 { jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+export var oversizedArrayColumns = 25;
+export var enumValues = ['option A', 'option B', 'option C'];
+var ComplexCell = function (props) {
+    var handleActionClick = React.useCallback(function () {
+        if (props.onRowAction)
+            props.onRowAction(props.rowData.id, 'get_invoice', null);
+        //     // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [props.rowData, props.onRowAction]);
+    return _jsxs("button", { onClick: handleActionClick, children: [" download ", props.rowData.id, " "] });
+};
+export var oversizedColumnDefinition = new Array(oversizedArrayColumns).fill(null).map(function (unused, index) { return ({
+    name: "column_".concat(index),
+    title: "column_".concat(index),
+    flexBasis: 120,
+}); });
+export var enumColumn = {
+    name: 'enumColumn',
+    title: 'Enum Column',
+    flexBasis: 160,
+    filterOptions: __spreadArray([{ value: '', label: 'all' }], enumValues.map(function (v) { return ({ value: v, label: v }); }), true),
+    filtering: true,
+    sorting: false,
+};
+export var columnDefinitions = [
+    {
+        name: 'textColumn',
+        title: 'Text column',
+        flexBasis: 160,
+        filtering: true,
+        sorting: true,
+    },
+    enumColumn,
+    {
+        name: 'numberColumn',
+        title: 'Number Column',
+        flexBasis: 160,
+        filtering: true,
+        filteringType: 'number',
+        sorting: true,
+    },
+    {
+        name: 'dateColumn',
+        group: 'group1',
+        title: 'Date Column',
+        flexBasis: 160,
+        filtering: true,
+        filteringType: 'date',
+        sorting: true,
+    },
+    {
+        name: 'boolColumn',
+        group: 'group1',
+        title: 'Bool Column',
+        flexBasis: 160,
+        filtering: true,
+        filteringType: 'flag',
+        sorting: true,
+        formatRowValue: function (row) {
+            return row.boolColumn ? 'Yes' : 'No';
+        },
+    },
+    {
+        name: 'advancedColumn',
+        group: 'group2',
+        title: 'Advanced Column',
+        flexBasis: 160,
+        formatRowValue: function (row) {
+            return "".concat((row.numberColumn / 4) * row.textColumn.length);
+        },
+    },
+    {
+        name: 'complexColumn',
+        group: 'group2',
+        title: 'Complex Column',
+        flexBasis: 350,
+        cellComponent: ComplexCell,
+    },
+    {
+        name: 'stickyColumn',
+        title: 'Sticky Column',
+        flexBasis: 160,
+        alwaysOn: true,
+        sticky: true,
+        stickTo: 'right',
+    },
+];

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

@@ -0,0 +1,2 @@
+import { FiltersConfig } from '../../types';
+export declare const filters: FiltersConfig;

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

@@ -0,0 +1,23 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+var DefaultSelect = function (props) { return (_jsx("select", __assign({ multiple: props.isMulti }, props, { children: (props.options || []).map(function (_a) {
+        var value = _a.value, label = _a.label;
+        return (_jsx("option", { value: value, children: label }, value));
+    }) }))); };
+export var filters = {
+    options: { CellComponent: DefaultSelect },
+    number: { CellComponent: function () { return _jsx("input", { type: "number" }); } },
+    text: { CellComponent: function () { return _jsx("input", { type: "text" }); } },
+    date: { CellComponent: function () { return _jsx("input", { type: "date" }); } },
+    flag: { CellComponent: function () { return _jsx("input", { type: "text" }); } },
+};

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

@@ -0,0 +1,17 @@
+import { GridActionsType, rowClassSymbol } from '../../types';
+export declare const enumValues: string[];
+export declare const oversizedArrayColumns = 25;
+export declare const gridSelectors: {};
+export declare const createRandomData: (count: number) => {
+    id: string;
+    stickyColumn: string;
+    textColumn: string;
+    enumColumn: string;
+    numberColumn: number;
+    dateColumn: string;
+    boolColumn: boolean;
+    [rowClassSymbol]: string | undefined;
+}[];
+export declare const gridDummyActions: Required<GridActionsType>;
+export declare const createOversizedRandomData: (count: number) => any[];
+export declare const ReduxGrid: (props: any) => JSX.Element;

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

@@ -0,0 +1,66 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import faker from 'faker';
+import { rowClassSymbol } from '../../types';
+import withReduxActions from '../../HoC/withReduxActions';
+import CommonGrid from '../../CommonGridContainer';
+export var enumValues = ['option A', 'option B', 'option C'];
+export var oversizedArrayColumns = 25;
+export var gridSelectors = {};
+/**
+ * randomly returns given data or undefined. used to simulate optional pros on object data types
+ */
+function makeOptional(fakerData, chance) {
+    chance = chance || 0.5;
+    return Math.random() < chance ? fakerData : undefined;
+}
+export var createRandomData = function (count) {
+    return new Array(count).fill(null).map(function () {
+        var _a;
+        return (_a = {
+                id: faker.random.uuid(),
+                stickyColumn: faker.random.word(),
+                textColumn: faker.random.word(),
+                enumColumn: enumValues[faker.random.number({ min: 0, max: 2 })],
+                numberColumn: faker.random.number(),
+                dateColumn: faker.date.recent().toISOString(),
+                boolColumn: faker.random.boolean()
+            },
+            _a[rowClassSymbol] = makeOptional('foo'),
+            _a);
+    });
+};
+export var gridDummyActions = {
+    // @see types for full list of actions
+    setPage: function (number) { return console.log('setPage', number); },
+    setRowsPerPage: function (number) { return console.log('setRowsPerPage', number); },
+    addFilter: function (column, value, filterProps) {
+        return console.log('setRowsPerPage', column, value, filterProps);
+    },
+};
+export var createOversizedRandomData = function (count) {
+    return new Array(count).fill(null).map(function () {
+        var newData = {
+            id: "".concat(faker.random.uuid()),
+        };
+        for (var index = 0; index < oversizedArrayColumns; index++) {
+            newData["column_".concat(index)] = faker.name.lastName();
+        }
+        return newData;
+    });
+};
+export var ReduxGrid = function (props) {
+    var WithActions = React.useMemo(function () { return withReduxActions('storybookGrid')(CommonGrid); }, []);
+    return _jsx(WithActions, __assign({}, props));
+};

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

@@ -0,0 +1,2 @@
+export declare const withProvider: (story: Function) => JSX.Element;
+export default withProvider;

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

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Provider } from 'react-redux';
+import { combineReducers, createStore } from 'redux';
+import commonGridReducer from '../../store';
+export var withProvider = function (story) {
+    var reducers = combineReducers({
+        commonGrid: commonGridReducer,
+    });
+    var store = createStore(reducers);
+    return _jsx(Provider, { store: store, children: story() });
+};
+export default withProvider;

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

@@ -0,0 +1,2 @@
+declare const withProvider: (story: Function) => JSX.Element;
+export default withProvider;

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

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { MemoryRouter } from 'react-router';
+var withProvider = function (story) { return _jsx(MemoryRouter, { children: story() }); };
+export default withProvider;

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

@@ -0,0 +1,2 @@
+declare const withProvider: (story: Function) => JSX.Element;
+export default withProvider;

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

@@ -0,0 +1,18 @@
+/*
+import React from 'react'
+import Theme from '@designSystem/Theme'
+import Normalize, { NormalizeBaseFonts } from '@designSystem/Normalize'
+
+const withProvider = (story: Function): JSX.Element => (
+  <Theme>
+    <Normalize />
+    <NormalizeBaseFonts />
+    {story()}
+  </Theme>
+)
+
+export default withProvider
+*/
+// @TODO do theme
+var withProvider = function (story) { return (story()); };
+export default withProvider;

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

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export declare const BottomWrapper: import("styled-components").StyledComponent<(props: Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "color">) => import("react").ReactElement<any, "div">, import("@xstyled/system").Theme, import("@xstyled/system").SystemProps<import("@xstyled/system").Theme> & {
+    isAbsolute?: boolean | undefined;
+}, "color">;
+export declare const ContentContainer: import("styled-components").StyledComponent<(props: Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "color">) => import("react").ReactElement<any, "div">, import("@xstyled/system").Theme, import("@xstyled/system").SystemProps<import("@xstyled/system").Theme>, "color">;
+export declare const CommonGridWrap: import("styled-components").StyledComponent<(props: Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "color">) => import("react").ReactElement<any, "div">, import("@xstyled/system").Theme, import("@xstyled/system").SystemProps<import("@xstyled/system").Theme>, "color">;
+export declare const StyledButtonStrip: import("styled-components").StyledComponent<(props: Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "color">) => import("react").ReactElement<any, "div">, import("@xstyled/system").Theme, import("@xstyled/system").SystemProps<import("@xstyled/system").Theme>, "color">;
+export declare const StyledColumnButton: import("styled-components").StyledComponent<({ isLoading, loadingText, icon, appearance, disabled, sizing, buttonRef, onClick, fullWidth, ...props }: import("../../Elements/Button/types").Props) => JSX.Element, import("@xstyled/system").Theme, {}, never>;
+export declare const CommonGridWithStyles: import("styled-components").StyledComponent<({ filters, gridSelectors, gridActions, isLoading, rowsData, hasColouredRows, columnsDefinitions, actionColumnDefinition, allowRowSelect, allowRowSelectOnAction, onRowAction, onRowEditClick, onRowReadClick, onRowClick, columnLayout, hideColumnConfig, className, gridRef, minColumnWidth, errorMessage, floatingButtonProps, }: import("./types").CommonGridProps) => JSX.Element, import("@xstyled/system").Theme, {
+    onRowClick?: Function | undefined;
+    height?: number | undefined;
+}, never>;