@mailstep/design-system 0.7.65-beta.2 → 0.7.65
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/ui/Blocks/CommonGrid/CommonGrid.js +3 -1
- package/ui/Blocks/CommonGrid/components/GridStatus/index.d.ts +2 -3
- package/ui/Blocks/CommonGrid/components/GridStatus/index.js +1 -2
- package/ui/Blocks/SideMenu/MenuItem.js +1 -1
- package/ui/Elements/Icon/icons/index.d.ts +0 -1
- package/ui/Elements/Icon/icons/index.js +0 -1
- package/ui/ThemeProvider/themes/default.d.ts +0 -8
- package/ui/ThemeProvider/themes/default.js +1 -9
- package/ui/ThemeProvider/themes/index.d.ts +0 -8
- package/ui/index.es.js +7602 -7609
- package/ui/index.umd.js +552 -552
- package/ui/Elements/Icon/icons/Layout.d.ts +0 -3
- package/ui/Elements/Icon/icons/Layout.js +0 -15
package/package.json
CHANGED
|
@@ -51,7 +51,9 @@ var CommonGrid = function (_a) {
|
|
|
51
51
|
var commonGridRef = React.useCallback(function (node) {
|
|
52
52
|
gridBoxRef.current = node;
|
|
53
53
|
}, []);
|
|
54
|
-
|
|
54
|
+
var isEmpty = !isLoading && !errorMessage && (!rowsData || rowsData.length < 1);
|
|
55
|
+
var hasFloatingChildren = isLoading || errorMessage || isEmpty;
|
|
56
|
+
return (_jsxs(_Fragment, { children: [_jsx(x.div, { className: className || '', children: _jsxs(OversizedScroll, { columnLayout: columnLayout, totalColumnsWidth: totalColumnsWidth, floatingChildren: hasFloatingChildren && _jsx(GridStatus, { isLoading: isLoading, isEmpty: isEmpty, errorMessage: errorMessage }), ref: commonGridRef, children: [_jsxs("div", { className: "gridHead", children: [hasGroups && (_jsx(GroupRow, { actionColumn: actionColumnDefinition, columns: displayColumnsDefinitions, displayColumnsWidth: displayColumnsWidth, groups: groups })), _jsx(HeadRow, { columns: displayColumnsDefinitions, onAddSort: addSorting, columnLayout: columnLayout, sortingValues: sorting, displayColumnsWidth: displayColumnsWidth, handleResizeDrag: handleResizeDrag, groups: groups, handleDragEnd: handleDragEnd, isSortTerminated: isSortTerminated }), hasFilters && (_jsx(FilterRow, { filters: filters, comparators: comparators, columns: displayColumnsDefinitions, actionColumn: actionColumnDefinition, onChange: addFilter, filterValues: filter, displayColumnsWidth: displayColumnsWidth, groups: groups, rowsData: rowsData, uxState: uxState, handleUxChange: handleUxChange }))] }), _jsx("div", { className: "body flx_1", style: rowsStyles, tabIndex: -1, onKeyDown: handleRowsKeyDown, children: !isLoading &&
|
|
55
57
|
rowsData &&
|
|
56
58
|
displayColumnsDefinitions &&
|
|
57
59
|
rowsData.map(function (row, index) {
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import type { FC } from 'react';
|
|
2
|
-
|
|
3
|
-
type Props<TData extends RowProps = RowProps> = {
|
|
2
|
+
type Props = {
|
|
4
3
|
isLoading?: boolean;
|
|
5
|
-
|
|
4
|
+
isEmpty?: boolean;
|
|
6
5
|
errorMessage?: string;
|
|
7
6
|
};
|
|
8
7
|
export declare const GridStatus: FC<Props>;
|
|
@@ -2,9 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { Row, MessageCell, MessageCellBody } from '../Table';
|
|
3
3
|
import { Trans } from '@lingui/react';
|
|
4
4
|
export var GridStatus = function (_a) {
|
|
5
|
-
var isLoading = _a.isLoading,
|
|
5
|
+
var isLoading = _a.isLoading, isEmpty = _a.isEmpty, errorMessage = _a.errorMessage;
|
|
6
6
|
var hasError = !isLoading && errorMessage;
|
|
7
|
-
var isEmpty = !isLoading && !errorMessage && (!rowsData || rowsData.length < 1);
|
|
8
7
|
var variant = hasError ? 'error' : 'info';
|
|
9
8
|
return (_jsx(Row, { className: "dataRow", align: "center", children: _jsx(MessageCell, { children: _jsxs(MessageCellBody, { variant: variant, children: [isLoading && _jsx(Trans, { id: "dataGrid.status.loadingData", message: "... loading data ..." }), hasError && errorMessage, isEmpty && _jsx(Trans, { id: "dataGrid.status.noDataFound", message: "No data found." })] }) }) }));
|
|
10
9
|
};
|
|
@@ -49,6 +49,6 @@ var MenuItem = function (_a) {
|
|
|
49
49
|
}, [items, link]);
|
|
50
50
|
return (_jsxs(_Fragment, { children: [separator && _jsx(ItemsSeparator, {}), _jsxs(MenuItemContainer, { ref: parentRef, "$isCompact": isCompact, "$lightMode": lightMode, hasChildren: hasChildren, isHovering: isHovering, children: [_jsxs(ItemLinkWrap, __assign({}, linkProps, { onMouseOver: handleMouseOver, exact: true, activeClassName: hasChildren ? 'selected' : undefined, onClick: toggleChildren, "$isCompact": isCompact, className: itemLinkWrapClassName,
|
|
51
51
|
// @ts-expect-error
|
|
52
|
-
isActive: isActive, "$lightMode": lightMode, children: [_jsxs(ItemLabel, { "$isCompact": isCompact, isSubitem: isSubitem, children: [!isSubitem && icon && (_jsx(ItemIcon, { className: "mainIcon", "$isCompact": isCompact, children: typeof icon === 'string' ? _jsx(Icon, { icon: icon, fill: "none" }) : icon })), _jsx(Title, { variant: "semiBold", mt: 0, mb: 0, textAlign:
|
|
52
|
+
isActive: isActive, "$lightMode": lightMode, children: [_jsxs(ItemLabel, { "$isCompact": isCompact, isSubitem: isSubitem, children: [!isSubitem && icon && (_jsx(ItemIcon, { className: "mainIcon", "$isCompact": isCompact, children: typeof icon === 'string' ? _jsx(Icon, { icon: icon, fill: "none" }) : icon })), _jsx(Title, { variant: "semiBold", mt: 0, mb: 0, textAlign: "left", children: _jsx(OverflowWithEllipsis, { children: title }) })] }), !isCompact && hasChildren && _jsx(ItemDropdownArrow, { icon: "goDown", "$lightMode": lightMode })] })), isHovering && isCompact && hasChildren && !listExpandedItems && (_jsx(SubitemTooltip, { items: items, childRef: childRef, parentRef: parentRef, isLeftMenuOpen: isLeftMenuOpen, onCloseLeftMenu: onCloseLeftMenu, lightMode: lightMode }))] }), hasChildren && listExpandedItems && (_jsx(SubItemsWrap, { children: items === null || items === void 0 ? void 0 : items.map(function (item, index) { return (_jsx(MenuItem, __assign({ isCompact: isCompact, lightMode: lightMode }, item, { onCloseLeftMenu: onCloseLeftMenu, isSubitem: true }), "".concat(index))); }) }))] }));
|
|
53
53
|
};
|
|
54
54
|
export default memo(MenuItem);
|
|
@@ -29,7 +29,6 @@ export { Inventory2 } from './Inventory2';
|
|
|
29
29
|
export { Logout1 } from './Logout1';
|
|
30
30
|
export { Puzzle1 } from './Puzzle1';
|
|
31
31
|
export { AddPhoto } from './AddPhoto';
|
|
32
|
-
export { Layout } from './Layout';
|
|
33
32
|
export { Link } from './Link';
|
|
34
33
|
export { OpenBox } from './OpenBox';
|
|
35
34
|
export { Box } from './Box';
|
|
@@ -29,7 +29,6 @@ export { Inventory2 } from './Inventory2';
|
|
|
29
29
|
export { Logout1 } from './Logout1';
|
|
30
30
|
export { Puzzle1 } from './Puzzle1';
|
|
31
31
|
export { AddPhoto } from './AddPhoto';
|
|
32
|
-
export { Layout } from './Layout';
|
|
33
32
|
export { Link } from './Link';
|
|
34
33
|
export { OpenBox } from './OpenBox';
|
|
35
34
|
export { Box } from './Box';
|
|
@@ -29,9 +29,6 @@ declare const defaultTheme: {
|
|
|
29
29
|
typoPrimary: string;
|
|
30
30
|
blue10: string;
|
|
31
31
|
blue20: string;
|
|
32
|
-
blue30: string;
|
|
33
|
-
blue40: string;
|
|
34
|
-
blue50: string;
|
|
35
32
|
blue60: string;
|
|
36
33
|
blue70: string;
|
|
37
34
|
blue80: string;
|
|
@@ -82,13 +79,8 @@ declare const defaultTheme: {
|
|
|
82
79
|
purple60: string;
|
|
83
80
|
purple80: string;
|
|
84
81
|
purple90: string;
|
|
85
|
-
magenta10: string;
|
|
86
82
|
magenta20: string;
|
|
87
|
-
magenta30: string;
|
|
88
|
-
magenta40: string;
|
|
89
|
-
magenta50: string;
|
|
90
83
|
magenta60: string;
|
|
91
|
-
magenta70: string;
|
|
92
84
|
magenta80: string;
|
|
93
85
|
magenta90: string;
|
|
94
86
|
};
|
|
@@ -29,9 +29,6 @@ var defaultTheme = {
|
|
|
29
29
|
typoPrimary: '#22394E',
|
|
30
30
|
blue10: '#F3F9FF',
|
|
31
31
|
blue20: '#DCEFFF',
|
|
32
|
-
blue30: '#BFE0FF',
|
|
33
|
-
blue40: '#6FADFF',
|
|
34
|
-
blue50: '#2684FF',
|
|
35
32
|
blue60: '#0065FF',
|
|
36
33
|
blue70: '#0052CC',
|
|
37
34
|
blue80: '#0747A6',
|
|
@@ -82,15 +79,10 @@ var defaultTheme = {
|
|
|
82
79
|
purple60: '#6554C0',
|
|
83
80
|
purple80: '#403294',
|
|
84
81
|
purple90: '#03235f',
|
|
85
|
-
magenta10: '#FFF7FB',
|
|
86
82
|
magenta20: '#FCF1F7',
|
|
87
|
-
magenta30: '#FFD6E8',
|
|
88
|
-
magenta40: '#FFAFD2',
|
|
89
|
-
magenta50: '#FF7EB6',
|
|
90
83
|
magenta60: '#EE5396',
|
|
91
|
-
magenta70: '#D12771',
|
|
92
84
|
magenta80: '#9F1853',
|
|
93
|
-
magenta90: '#
|
|
85
|
+
magenta90: '#872e8b',
|
|
94
86
|
},
|
|
95
87
|
fonts: {
|
|
96
88
|
primary: 'Inter, sans-serif',
|
|
@@ -30,9 +30,6 @@ declare const themes: {
|
|
|
30
30
|
typoPrimary: string;
|
|
31
31
|
blue10: string;
|
|
32
32
|
blue20: string;
|
|
33
|
-
blue30: string;
|
|
34
|
-
blue40: string;
|
|
35
|
-
blue50: string;
|
|
36
33
|
blue60: string;
|
|
37
34
|
blue70: string;
|
|
38
35
|
blue80: string;
|
|
@@ -83,13 +80,8 @@ declare const themes: {
|
|
|
83
80
|
purple60: string;
|
|
84
81
|
purple80: string;
|
|
85
82
|
purple90: string;
|
|
86
|
-
magenta10: string;
|
|
87
83
|
magenta20: string;
|
|
88
|
-
magenta30: string;
|
|
89
|
-
magenta40: string;
|
|
90
|
-
magenta50: string;
|
|
91
84
|
magenta60: string;
|
|
92
|
-
magenta70: string;
|
|
93
85
|
magenta80: string;
|
|
94
86
|
magenta90: string;
|
|
95
87
|
};
|