@mailstep/design-system 0.8.31-beta.4 → 0.8.31

package/ui/Blocks/CommonGrid/storybook/components/EnumCellExample.js

@@ -1,16 +1,22 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { EnumInCell } from '../../components/gridCells/EnumInCell';
-var packagingTypeAppearance = {
-    'option A': 'neutralSubtle',
-    'option B': 'orangeSubtle',
-    'option C': 'greenSubtle'
+import { EnumInCell } from "../../components/gridCells/EnumInCell.js";
+import { jsx } from "react/jsx-runtime";
+//#region packages/ui/Blocks/CommonGrid/storybook/components/EnumCellExample.tsx
+const packagingTypeAppearance = {
+	"option A": "neutralSubtle",
+	"option B": "orangeSubtle",
+	"option C": "greenSubtle"
 };
-var PackagingTypeTrans = {
-    'option A': function () { return 'option A'; },
-    'option B': function () { return 'option B'; },
-    'option C': function () { return 'option C'; }
+const PackagingTypeTrans = {
+	"option A": () => "option A",
+	"option B": () => "option B",
+	"option C": () => "option C"
 };
-export var EnumCellExample = function (_a) {
-    var rowData = _a.rowData;
-    return _jsx(EnumInCell, { value: rowData.enumColumn, enumObj: PackagingTypeTrans, appearanceMap: packagingTypeAppearance });
+const EnumCellExample = ({ rowData }) => {
+	return /* @__PURE__ */ jsx(EnumInCell, {
+		value: rowData.enumColumn,
+		enumObj: PackagingTypeTrans,
+		appearanceMap: packagingTypeAppearance
+	});
 };
+//#endregion
+export { EnumCellExample };

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

@@ -1,5 +1,4 @@
 import { ActionColumn } from '../../types';
-
 export declare const ActionColumnCheckboxes: ActionColumn;
 declare const _default: {
     title: string;

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

@@ -1,7 +1,10 @@
-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 onRowClick = function (id, field, value) { return console.log('onRowClick', id, field); };
-export var onBatchAction = function (action, affectedRows) {
-    console.log('onBatchAction called', action, affectedRows);
+//#region packages/ui/Blocks/CommonGrid/storybook/utils/actions.ts
+const onRowEditClick = (id, props) => console.log("onRowEditClick", id, props);
+const onRowReadClick = (id, props) => console.log("onRowReadClick", id, props);
+const onRowAction = (id, field, value) => console.log("onRowAction", id, field, value);
+const onRowClick = (id, field, value) => console.log("onRowClick", id, field);
+const onBatchAction = (action, affectedRows) => {
+	console.log("onBatchAction called", action, affectedRows);
 };
+//#endregion
+export { onBatchAction, onRowAction, onRowClick, onRowEditClick, onRowReadClick };

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

@@ -1,5 +1,4 @@
-import { ColumnDefinition } from '../../types';
-
+import type { ColumnDefinition } from '../../types';
 export declare const oversizedArrayColumns = 25;
 export declare const oversizedColumnDefinition: {
     name: string;

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

@@ -1,128 +1,125 @@
-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.js";
+import { EnumCellExample } from "../components/EnumCellExample.js";
+import { enumValues } from "./utils.js";
+//#region packages/ui/Blocks/CommonGrid/storybook/utils/columnDefinition.tsx
+const oversizedArrayColumns = 25;
+const oversizedColumnDefinition = new Array(25).fill(null).map((unused, index) => ({
+	name: `column_${index}`,
+	title: `column_${index}`,
+	flexBasis: 120
+}));
+const enumColumn = {
+	name: "enumColumn",
+	title: "Enum Column",
+	flexBasis: 160,
+	filterOptions: enumValues.map((v) => ({
+		value: v,
+		label: v
+	})),
+	filterExtraProps: {
+		isMulti: true,
+		checkAllButton: true
+	},
+	filtering: true,
+	sorting: false,
+	cellComponent: EnumCellExample
 };
-import { ComplexCell } from '../components/ComplexCell';
-import { EnumCellExample } from '../components/EnumCellExample';
-import { enumValues } from './utils';
-export var oversizedArrayColumns = 25;
-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: enumValues.map(function (v) { return ({ value: v, label: v }); }),
-    filterExtraProps: { isMulti: true, checkAllButton: true },
-    filtering: true,
-    sorting: false,
-    cellComponent: EnumCellExample
-};
-export var columnDefinitions = [
-    {
-        name: 'hiddenColumn',
-        title: 'Hidden column',
-        flexBasis: 160,
-        filtering: true,
-        sorting: true,
-        defaultHidden: true
-    },
-    {
-        name: 'textColumn',
-        title: 'Text column',
-        flexBasis: 160,
-        filtering: true,
-        sorting: true
-    },
-    enumColumn,
-    {
-        name: 'enumColumnAsync',
-        title: 'Enum Column Async',
-        flexBasis: 160,
-        filterExtraProps: { isMulti: true, checkAllButton: true },
-        filtering: true,
-        sorting: true,
-        asyncLoadKey: 'enumColumnAsync'
-    },
-    {
-        name: 'numberColumn',
-        title: 'Number Column',
-        flexBasis: 160,
-        filtering: true,
-        filteringType: 'number',
-        filterExtraProps: {
-            decimals: 2
-        },
-        sorting: true
-    },
-    {
-        name: 'numberFloatColumn',
-        title: 'Number Float Column',
-        flexBasis: 160,
-        filtering: true,
-        filteringType: 'number',
-        sorting: true,
-        filterExtraProps: {
-            isFloat: true
-        }
-    },
-    {
-        name: 'dateColumn',
-        title: 'Date Column',
-        flexBasis: 160,
-        filtering: true,
-        filteringType: 'date',
-        sorting: true,
-        filterExtraProps: {
-            filterTime: true
-        }
-    },
-    {
-        name: 'boolColumn',
-        title: 'Bool Column',
-        flexBasis: 160,
-        filtering: true,
-        filteringType: 'flag',
-        sorting: true,
-        formatRowValue: function (row) {
-            return row.boolColumn ? 'Yes' : 'No';
-        }
-    },
-    {
-        name: 'advancedColumn',
-        title: 'Advanced Column',
-        flexBasis: 160,
-        formatRowValue: function (row) {
-            return "".concat((row.numberColumn / 4) * row.textColumn.length);
-        }
-    },
-    {
-        name: 'complexColumn',
-        title: 'Complex Column',
-        flexBasis: 350,
-        cellComponent: ComplexCell
-    },
-    {
-        name: 'alwaysOffColumn',
-        title: 'Always Off Column',
-        flexBasis: 0,
-        alwaysOff: true
-    }
+const columnDefinitions = [
+	{
+		name: "hiddenColumn",
+		title: "Hidden column",
+		flexBasis: 160,
+		filtering: true,
+		sorting: true,
+		defaultHidden: true
+	},
+	{
+		name: "textColumn",
+		title: "Text column",
+		flexBasis: 160,
+		filtering: true,
+		sorting: true
+	},
+	enumColumn,
+	{
+		name: "enumColumnAsync",
+		title: "Enum Column Async",
+		flexBasis: 160,
+		filterExtraProps: {
+			isMulti: true,
+			checkAllButton: true
+		},
+		filtering: true,
+		sorting: true,
+		asyncLoadKey: "enumColumnAsync"
+	},
+	{
+		name: "numberColumn",
+		title: "Number Column",
+		flexBasis: 160,
+		filtering: true,
+		filteringType: "number",
+		filterExtraProps: { decimals: 2 },
+		sorting: true
+	},
+	{
+		name: "numberFloatColumn",
+		title: "Number Float Column",
+		flexBasis: 160,
+		filtering: true,
+		filteringType: "number",
+		sorting: true,
+		filterExtraProps: { isFloat: true }
+	},
+	{
+		name: "dateColumn",
+		title: "Date Column",
+		flexBasis: 160,
+		filtering: true,
+		filteringType: "date",
+		sorting: true,
+		filterExtraProps: { filterTime: true }
+	},
+	{
+		name: "boolColumn",
+		title: "Bool Column",
+		flexBasis: 160,
+		filtering: true,
+		filteringType: "flag",
+		sorting: true,
+		formatRowValue: (row) => {
+			return row.boolColumn ? "Yes" : "No";
+		}
+	},
+	{
+		name: "advancedColumn",
+		title: "Advanced Column",
+		flexBasis: 160,
+		formatRowValue: (row) => {
+			return `${row.numberColumn / 4 * row.textColumn.length}`;
+		}
+	},
+	{
+		name: "complexColumn",
+		title: "Complex Column",
+		flexBasis: 350,
+		cellComponent: ComplexCell
+	},
+	{
+		name: "alwaysOffColumn",
+		title: "Always Off Column",
+		flexBasis: 0,
+		alwaysOff: true
+	}
 ];
-export var stickyColumn = {
-    name: 'stickyColumn',
-    title: 'Sticky Column',
-    flexBasis: 160,
-    alwaysOn: true,
-    sticky: true,
-    stickTo: 'right'
+const stickyColumn = {
+	name: "stickyColumn",
+	title: "Sticky Column",
+	flexBasis: 160,
+	alwaysOn: true,
+	sticky: true,
+	stickTo: "right"
 };
-export var columnDefinitionsWithSticky = __spreadArray(__spreadArray([], columnDefinitions, true), [stickyColumn], false);
+const columnDefinitionsWithSticky = [...columnDefinitions, stickyColumn];
+//#endregion
+export { columnDefinitions, columnDefinitionsWithSticky, enumColumn, oversizedArrayColumns, oversizedColumnDefinition, stickyColumn };

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

@@ -1,6 +1,5 @@
-import { FC } from 'react';
-import { GridActionsType, rowClassSymbol, ExtraControlButton } from '../../types';
-
+import type { FC } from 'react';
+import { type GridActionsType, rowClassSymbol, type ExtraControlButton } from '../../types';
 export declare const enumValues: string[];
 export declare const oversizedArrayColumns = 25;
 export declare const gridSelectors: {};

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

@@ -1,93 +1,114 @@
-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 CommonGrid from '../../CommonGridContainer';
-import withReduxActions from '../../HoC/withReduxActions';
-import { rowClassSymbol, ExtraControlButtonPosition } from '../../types';
-export var enumValues = ['option A', 'option B', 'option C'];
-export var oversizedArrayColumns = 25;
-export var gridSelectors = {};
+import { rowClassSymbol } from "../../types.js";
+import CommonGridContainer from "../../CommonGridContainer.js";
+import withReduxActions from "../../HoC/withReduxActions.js";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+import faker from "faker";
+//#region packages/ui/Blocks/CommonGrid/storybook/utils/utils.tsx
+const enumValues = [
+	"option A",
+	"option B",
+	"option C"
+];
+const oversizedArrayColumns = 25;
+const gridSelectors = {};
 /**
- * randomly returns given data or undefined. used to simulate optional pros on object data types
- */
+* 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;
+	chance = chance || .5;
+	return Math.random() < chance ? fakerData : void 0;
 }
-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) {
-        console.log('setPage', number);
-    },
-    setRowsPerPage: function (number) {
-        console.log('setRowsPerPage', number);
-    },
-    addFilter: function (column, value, filterProps, others) {
-        console.log('addFilter', column, value, filterProps, others);
-    }
+const createRandomData = (count) => new Array(count).fill(null).map(() => ({
+	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(),
+	[rowClassSymbol]: makeOptional("foo")
+}));
+const gridDummyActions = {
+	setPage: (number) => {
+		console.log("setPage", number);
+	},
+	setRowsPerPage: (number) => {
+		console.log("setRowsPerPage", number);
+	},
+	addFilter: (column, value, filterProps, others) => {
+		console.log("addFilter", column, value, filterProps, others);
+	}
 };
-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;
-    });
+const createOversizedRandomData = (count) => new Array(count).fill(null).map(() => {
+	const newData = { id: `${faker.random.uuid()}` };
+	for (let index = 0; index < 25; index++) newData[`column_${index}`] = faker.name.lastName();
+	return newData;
+});
+const ReduxGrid = (props) => {
+	return /* @__PURE__ */ jsx(React.useMemo(() => withReduxActions("storybookGrid")(CommonGridContainer), []), { ...props });
 };
-export var ReduxGrid = function (props) {
-    var WithActions = React.useMemo(function () { return withReduxActions('storybookGrid')(CommonGrid); }, []);
-    return _jsx(WithActions, __assign({}, props));
-};
-export var extraControlButtons = [
-    { label: 'Reload', position: ExtraControlButtonPosition.TopLeft },
-    { label: 'Export all', position: ExtraControlButtonPosition.TopRight }
-];
-export var onAsyncLoadFilterOptions = function (key, value) {
-    return new Promise(function (resolve) {
-        setTimeout(function () {
-            resolve([
-                { label: 'Apple', value: 'apple' },
-                { label: 'Banana', value: 'banana' },
-                { label: 'Cherry', value: 'cherry' },
-                { label: 'Date', value: 'date' },
-                { label: 'Elderberry', value: 'elderberry' },
-                { label: 'Fig', value: 'fig' },
-                { label: 'Grape', value: 'grape' },
-                { label: 'Honeydew', value: 'honeydew' },
-                { label: 'Kiwi', value: 'kiwi' },
-                { label: 'Lemon', value: 'lemon' },
-                { label: 'Lime', value: 'lime' },
-            ]);
-        }, 1000);
-    });
+const extraControlButtons = [{
+	label: "Reload",
+	position: "top-left"
+}, {
+	label: "Export all",
+	position: "top-right"
+}];
+const onAsyncLoadFilterOptions = (key, value) => {
+	return new Promise((resolve) => {
+		setTimeout(() => {
+			resolve([
+				{
+					label: "Apple",
+					value: "apple"
+				},
+				{
+					label: "Banana",
+					value: "banana"
+				},
+				{
+					label: "Cherry",
+					value: "cherry"
+				},
+				{
+					label: "Date",
+					value: "date"
+				},
+				{
+					label: "Elderberry",
+					value: "elderberry"
+				},
+				{
+					label: "Fig",
+					value: "fig"
+				},
+				{
+					label: "Grape",
+					value: "grape"
+				},
+				{
+					label: "Honeydew",
+					value: "honeydew"
+				},
+				{
+					label: "Kiwi",
+					value: "kiwi"
+				},
+				{
+					label: "Lemon",
+					value: "lemon"
+				},
+				{
+					label: "Lime",
+					value: "lime"
+				}
+			]);
+		}, 1e3);
+	});
 };
+//#endregion
+export { ReduxGrid, createOversizedRandomData, createRandomData, enumValues, extraControlButtons, gridDummyActions, gridSelectors, onAsyncLoadFilterOptions, oversizedArrayColumns };

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

@@ -1,14 +1,14 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Provider } from 'react-redux';
-import { combineReducers, createStore, compose } from 'redux';
-import commonGridReducer from '../../store';
-// @ts-expect-error
-export var reduxComposeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
-export var withProvider = function (story) {
-    var reducers = combineReducers({
-        commonGrid: commonGridReducer
-    });
-    var store = createStore(reducers, {}, reduxComposeEnhancer());
-    return _jsx(Provider, { store: store, children: story() });
+import store_default from "../../store/index.js";
+import { jsx } from "react/jsx-runtime";
+import { Provider } from "react-redux";
+import { combineReducers, compose, createStore } from "redux";
+//#region packages/ui/Blocks/CommonGrid/storybook/utils/withRedux.tsx
+const reduxComposeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
+const withProvider = (story) => {
+	return /* @__PURE__ */ jsx(Provider, {
+		store: createStore(combineReducers({ commonGrid: store_default }), {}, reduxComposeEnhancer()),
+		children: story()
+	});
 };
-export default withProvider;
+//#endregion
+export { withProvider as default, withProvider, reduxComposeEnhancer };

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

@@ -1,4 +1,7 @@
-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;
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { MemoryRouter } from "react-router";
+//#region packages/ui/Blocks/CommonGrid/storybook/utils/withRouter.tsx
+const withProvider = (story) => /* @__PURE__ */ jsx(MemoryRouter, { children: story() });
+//#endregion
+export { withProvider as default };

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

@@ -1,2 +1,4 @@
-var withProvider = function (story) { return story(); };
-export default withProvider;
+//#region packages/ui/Blocks/CommonGrid/storybook/utils/withTheme.tsx
+const withProvider = (story) => story();
+//#endregion
+export { withProvider as default };

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

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