@reltio/components 1.4.2138 → 1.4.2139
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/ColumnsSettings/components/ColumnListItem/ColumnListItem.js +1 -1
- package/ConfigColumnPopup/ConfigColumnPopup.d.ts +14 -0
- package/ConfigColumnPopup/ConfigColumnPopup.js +24 -0
- package/ConfigColumnPopup/ConfigColumnPopup.test.d.ts +1 -0
- package/ConfigColumnPopup/ConfigColumnPopup.test.js +120 -0
- package/ConfigColumnPopup/index.d.ts +1 -0
- package/ConfigColumnPopup/index.js +1 -0
- package/DefaultHeadCellRendererWithTooltip/DefaultHeadCellRendererWithTooltip.d.ts +5 -1
- package/DefaultHeadCellRendererWithTooltip/DefaultHeadCellRendererWithTooltip.js +12 -5
- package/DefaultHeadCellRendererWithTooltip/DefaultHeadCellRendererWithTooltip.module.css.js +2 -2
- package/DefaultHeadCellRendererWithTooltip/index.d.ts +1 -1
- package/DefaultHeadCellRendererWithTooltip/index.js +1 -1
- package/HOCs/withColumnConfigurator/helpers.d.ts +2 -0
- package/HOCs/withColumnConfigurator/helpers.js +30 -0
- package/HOCs/withColumnConfigurator/index.d.ts +1 -0
- package/HOCs/withColumnConfigurator/index.js +1 -0
- package/HOCs/withColumnConfigurator/withColumnConfigurator.d.ts +13 -0
- package/HOCs/withColumnConfigurator/withColumnConfigurator.js +91 -0
- package/TableWithBars/components/HeadCellRenderer/HeadCellRenderer.d.ts +1 -1
- package/TableWithBars/components/HeadCellRenderer/HeadCellRenderer.js +1 -1
- package/cjs/ColumnsSettings/components/ColumnListItem/ColumnListItem.js +1 -1
- package/cjs/ConfigColumnPopup/ConfigColumnPopup.d.ts +14 -0
- package/cjs/ConfigColumnPopup/ConfigColumnPopup.js +31 -0
- package/cjs/ConfigColumnPopup/ConfigColumnPopup.test.d.ts +1 -0
- package/cjs/ConfigColumnPopup/ConfigColumnPopup.test.js +125 -0
- package/cjs/ConfigColumnPopup/index.d.ts +1 -0
- package/cjs/ConfigColumnPopup/index.js +8 -0
- package/cjs/DefaultHeadCellRendererWithTooltip/DefaultHeadCellRendererWithTooltip.d.ts +5 -1
- package/cjs/DefaultHeadCellRendererWithTooltip/DefaultHeadCellRendererWithTooltip.js +11 -6
- package/cjs/DefaultHeadCellRendererWithTooltip/DefaultHeadCellRendererWithTooltip.module.css.js +2 -2
- package/cjs/DefaultHeadCellRendererWithTooltip/index.d.ts +1 -1
- package/cjs/DefaultHeadCellRendererWithTooltip/index.js +4 -1
- package/cjs/HOCs/withColumnConfigurator/helpers.d.ts +2 -0
- package/cjs/HOCs/withColumnConfigurator/helpers.js +33 -0
- package/cjs/HOCs/withColumnConfigurator/index.d.ts +1 -0
- package/cjs/HOCs/withColumnConfigurator/index.js +5 -0
- package/cjs/HOCs/withColumnConfigurator/withColumnConfigurator.d.ts +13 -0
- package/cjs/HOCs/withColumnConfigurator/withColumnConfigurator.js +120 -0
- package/cjs/TableWithBars/components/HeadCellRenderer/HeadCellRenderer.d.ts +1 -1
- package/cjs/TableWithBars/components/HeadCellRenderer/HeadCellRenderer.js +1 -1
- package/cjs/index.d.ts +2 -0
- package/cjs/index.js +12 -5
- package/index.d.ts +2 -0
- package/index.js +2 -0
- package/package.json +1 -1
|
@@ -7,5 +7,5 @@ export var ColumnListItem = function (_a) {
|
|
|
7
7
|
var _b;
|
|
8
8
|
var item = _a.item, onClick = _a.onClick, checked = _a.checked, level = _a.level, style = _a.style, isFocused = _a.isFocused, isGroupItem = _a.isGroupItem, hideCheckBox = _a.hideCheckBox;
|
|
9
9
|
var styles = useStyles();
|
|
10
|
-
return (React.createElement(AttributeListItem, { hideCheckBox: hideCheckBox, key: item.id, onClick: onClick, checked: checked, level: level, data: item, label: React.createElement(Highlighter, { text: item.label, highlight: item.filterText }), labelInText: item.label, style: style, isFocused: isFocused, hideIcon: isGroupItem, className: classnames((_b = {}, _b[styles.groupItem] = isGroupItem, _b)) }));
|
|
10
|
+
return (React.createElement(AttributeListItem, { hideCheckBox: hideCheckBox, key: item.id, onClick: onClick, checked: checked, level: level, data: item, label: React.createElement(Highlighter, { text: item.label, highlight: item.filterText }), labelInText: item.label, style: style, isFocused: isFocused, hideIcon: isGroupItem, className: classnames((_b = {}, _b[styles.groupItem] = isGroupItem, _b)), notSelectable: hideCheckBox && isGroupItem }));
|
|
11
11
|
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const INSERT_LEFT = "left";
|
|
3
|
+
export declare const INSERT_RIGHT = "right";
|
|
4
|
+
export declare const HIDE = "hide";
|
|
5
|
+
export type ConfigColumnAction = typeof INSERT_LEFT | typeof INSERT_RIGHT | typeof HIDE;
|
|
6
|
+
type Props = {
|
|
7
|
+
open: boolean;
|
|
8
|
+
anchorEl: HTMLElement | null;
|
|
9
|
+
onClick: (action: ConfigColumnAction) => void;
|
|
10
|
+
onClose: () => void;
|
|
11
|
+
actions: ConfigColumnAction[];
|
|
12
|
+
};
|
|
13
|
+
export declare const ConfigColumnPopup: ({ open, anchorEl, onClick, onClose, actions }: Props) => React.JSX.Element;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import Popover from '@mui/material/Popover';
|
|
3
|
+
import List from '@mui/material/List';
|
|
4
|
+
import ListItem from '@mui/material/ListItem';
|
|
5
|
+
import ListItemText from '@mui/material/ListItemText';
|
|
6
|
+
import i18n from 'ui-i18n';
|
|
7
|
+
export var INSERT_LEFT = 'left';
|
|
8
|
+
export var INSERT_RIGHT = 'right';
|
|
9
|
+
export var HIDE = 'hide';
|
|
10
|
+
export var ConfigColumnPopup = function (_a) {
|
|
11
|
+
var _b;
|
|
12
|
+
var open = _a.open, anchorEl = _a.anchorEl, onClick = _a.onClick, onClose = _a.onClose, actions = _a.actions;
|
|
13
|
+
var TEXT = (_b = {},
|
|
14
|
+
_b[INSERT_LEFT] = i18n.text('Insert 1 left'),
|
|
15
|
+
_b[INSERT_RIGHT] = i18n.text('Insert 1 right'),
|
|
16
|
+
_b[HIDE] = i18n.text('Hide column'),
|
|
17
|
+
_b);
|
|
18
|
+
var getClickHandler = function (action) { return function () {
|
|
19
|
+
onClick(action);
|
|
20
|
+
}; };
|
|
21
|
+
return (React.createElement(Popover, { open: open, anchorEl: anchorEl, onClose: onClose },
|
|
22
|
+
React.createElement(List, { component: "div" }, actions.map(function (action, index) { return (React.createElement(ListItem, { button: true, component: "div", key: index, onClick: getClickHandler(action) },
|
|
23
|
+
React.createElement(ListItemText, { primary: TEXT[action], primaryTypographyProps: { variant: 'body2' } }))); }))));
|
|
24
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
13
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
14
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
15
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
16
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
17
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
18
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
22
|
+
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);
|
|
23
|
+
return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
24
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
25
|
+
function step(op) {
|
|
26
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
27
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
28
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
29
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
30
|
+
switch (op[0]) {
|
|
31
|
+
case 0: case 1: t = op; break;
|
|
32
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
33
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
34
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
35
|
+
default:
|
|
36
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
37
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
38
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
39
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
40
|
+
if (t[2]) _.ops.pop();
|
|
41
|
+
_.trys.pop(); continue;
|
|
42
|
+
}
|
|
43
|
+
op = body.call(thisArg, _);
|
|
44
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
45
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
import React from 'react';
|
|
49
|
+
import userEvent from '@testing-library/user-event';
|
|
50
|
+
import { render, screen } from '@testing-library/react';
|
|
51
|
+
import { ConfigColumnPopup, INSERT_LEFT, INSERT_RIGHT, HIDE } from './ConfigColumnPopup';
|
|
52
|
+
describe('ConfigColumnPopup tests', function () {
|
|
53
|
+
var defaultProps = {
|
|
54
|
+
open: true,
|
|
55
|
+
anchorEl: document.body,
|
|
56
|
+
onClick: jest.fn(),
|
|
57
|
+
onClose: jest.fn(),
|
|
58
|
+
actions: [INSERT_LEFT, INSERT_RIGHT, HIDE]
|
|
59
|
+
};
|
|
60
|
+
var setUp = function (props) {
|
|
61
|
+
if (props === void 0) { props = {}; }
|
|
62
|
+
var user = userEvent.setup();
|
|
63
|
+
return __assign({ user: user }, render(React.createElement(ConfigColumnPopup, __assign({}, defaultProps, props))));
|
|
64
|
+
};
|
|
65
|
+
afterEach(function () {
|
|
66
|
+
jest.clearAllMocks();
|
|
67
|
+
});
|
|
68
|
+
it('should render all action items', function () {
|
|
69
|
+
setUp();
|
|
70
|
+
expect(screen.getByText('Insert 1 left')).toBeInTheDocument();
|
|
71
|
+
expect(screen.getByText('Insert 1 right')).toBeInTheDocument();
|
|
72
|
+
expect(screen.getByText('Hide column')).toBeInTheDocument();
|
|
73
|
+
});
|
|
74
|
+
it('should call onClick with correct action when item is clicked', function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
75
|
+
var onClick, user;
|
|
76
|
+
return __generator(this, function (_a) {
|
|
77
|
+
switch (_a.label) {
|
|
78
|
+
case 0:
|
|
79
|
+
onClick = jest.fn();
|
|
80
|
+
user = setUp({ onClick: onClick }).user;
|
|
81
|
+
return [4 /*yield*/, user.click(screen.getByText('Insert 1 left'))];
|
|
82
|
+
case 1:
|
|
83
|
+
_a.sent();
|
|
84
|
+
expect(onClick).toHaveBeenCalledWith(INSERT_LEFT);
|
|
85
|
+
return [4 /*yield*/, user.click(screen.getByText('Insert 1 right'))];
|
|
86
|
+
case 2:
|
|
87
|
+
_a.sent();
|
|
88
|
+
expect(onClick).toHaveBeenCalledWith(INSERT_RIGHT);
|
|
89
|
+
return [4 /*yield*/, user.click(screen.getByText('Hide column'))];
|
|
90
|
+
case 3:
|
|
91
|
+
_a.sent();
|
|
92
|
+
expect(onClick).toHaveBeenCalledWith(HIDE);
|
|
93
|
+
expect(onClick).toHaveBeenCalledTimes(3);
|
|
94
|
+
return [2 /*return*/];
|
|
95
|
+
}
|
|
96
|
+
});
|
|
97
|
+
}); });
|
|
98
|
+
it('should not render anything when open is false', function () {
|
|
99
|
+
setUp({ open: false });
|
|
100
|
+
expect(screen.queryByText('Insert 1 left')).not.toBeInTheDocument();
|
|
101
|
+
expect(screen.queryByText('Insert 1 right')).not.toBeInTheDocument();
|
|
102
|
+
expect(screen.queryByText('Hide column')).not.toBeInTheDocument();
|
|
103
|
+
});
|
|
104
|
+
it('should call onClose when popover is closed', function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
105
|
+
var onClose, user, backdrop;
|
|
106
|
+
return __generator(this, function (_a) {
|
|
107
|
+
switch (_a.label) {
|
|
108
|
+
case 0:
|
|
109
|
+
onClose = jest.fn();
|
|
110
|
+
user = setUp({ onClose: onClose }).user;
|
|
111
|
+
backdrop = document.querySelector('.MuiBackdrop-root');
|
|
112
|
+
return [4 /*yield*/, user.click(backdrop)];
|
|
113
|
+
case 1:
|
|
114
|
+
_a.sent();
|
|
115
|
+
expect(onClose).toHaveBeenCalled();
|
|
116
|
+
return [2 /*return*/];
|
|
117
|
+
}
|
|
118
|
+
});
|
|
119
|
+
}); });
|
|
120
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { ConfigColumnPopup, INSERT_LEFT, INSERT_RIGHT, HIDE } from './ConfigColumnPopup';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { ConfigColumnPopup, INSERT_LEFT, INSERT_RIGHT, HIDE } from './ConfigColumnPopup';
|
|
@@ -11,5 +11,9 @@ export type DefaultHeadCellRendererWithTooltipProps = {
|
|
|
11
11
|
headLabel?: string;
|
|
12
12
|
};
|
|
13
13
|
dataReltioId?: string;
|
|
14
|
+
openConfigColumnPopup?: (index: number, event: React.MouseEvent<HTMLElement>) => void;
|
|
14
15
|
};
|
|
15
|
-
|
|
16
|
+
declare const _default: React.ComponentType<{
|
|
17
|
+
[x: string]: unknown;
|
|
18
|
+
}>;
|
|
19
|
+
export default _default;
|
|
@@ -20,16 +20,23 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
20
20
|
}
|
|
21
21
|
return t;
|
|
22
22
|
};
|
|
23
|
-
import classnames from 'classnames';
|
|
24
23
|
import React from 'react';
|
|
24
|
+
import classnames from 'classnames';
|
|
25
|
+
import { pick, pipe, defaultTo } from 'ramda';
|
|
26
|
+
import MoreVertIcon from '@mui/icons-material/MoreVert';
|
|
25
27
|
import DefaultHeadCellRenderer from 'react-components/dist/Table/DefaultHeadCellRenderer/DefaultHeadCellRenderer';
|
|
28
|
+
import { withTableContext } from '../HOCs/withTableContext';
|
|
26
29
|
import { ExpandedValueTooltip } from '../ExpandedValueTooltip';
|
|
30
|
+
import { SmallIconButton } from '../SmallIconButton';
|
|
27
31
|
import styles from './DefaultHeadCellRendererWithTooltip.module.css';
|
|
28
|
-
|
|
29
|
-
var _b = _a.classes, classes = _b === void 0 ? {} : _b, dataReltioId = _a.dataReltioId, headCellData = _a.headCellData, className = _a.className, props = __rest(_a, ["classes", "dataReltioId", "headCellData", "className"]);
|
|
32
|
+
var DefaultHeadCellRendererWithTooltip = function (_a) {
|
|
33
|
+
var _b = _a.classes, classes = _b === void 0 ? {} : _b, dataReltioId = _a.dataReltioId, headCellData = _a.headCellData, className = _a.className, openConfigColumnPopup = _a.openConfigColumnPopup, headIndex = _a.headIndex, props = __rest(_a, ["classes", "dataReltioId", "headCellData", "className", "openConfigColumnPopup", "headIndex"]);
|
|
30
34
|
var headCell = (classes === null || classes === void 0 ? void 0 : classes.headCell) || styles.headCell;
|
|
31
35
|
var headLabel = (classes === null || classes === void 0 ? void 0 : classes.headLabel) || styles.headLabel;
|
|
32
36
|
return (React.createElement("div", __assign({ className: classnames(headCell, className) }, (dataReltioId ? { 'data-reltio-id': dataReltioId } : {})),
|
|
33
|
-
React.createElement(DefaultHeadCellRenderer, __assign({}, props, { headCellData: __assign(__assign({}, headCellData), { label: (React.createElement(ExpandedValueTooltip, { value: headCellData.label },
|
|
34
|
-
React.createElement("div", { className: headLabel }, headCellData.label))) }) }))
|
|
37
|
+
React.createElement(DefaultHeadCellRenderer, __assign({}, props, { headIndex: headIndex, headCellData: __assign(__assign({}, headCellData), { label: (React.createElement(ExpandedValueTooltip, { value: headCellData.label },
|
|
38
|
+
React.createElement("div", { className: headLabel }, headCellData.label))) }) })),
|
|
39
|
+
openConfigColumnPopup && (React.createElement("div", { className: styles.menuButtonWrapper },
|
|
40
|
+
React.createElement(SmallIconButton, { icon: MoreVertIcon, onClick: function (e) { return openConfigColumnPopup && openConfigColumnPopup(headIndex, e); }, size: "S" })))));
|
|
35
41
|
};
|
|
42
|
+
export default withTableContext(pipe(defaultTo({}), pick(['openConfigColumnPopup'])))(DefaultHeadCellRendererWithTooltip);
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
const styles = {"headCell":"DefaultHeadCellRendererWithTooltip-headCell--JlLvL","headLabel":"DefaultHeadCellRendererWithTooltip-headLabel--fzLXE"};
|
|
1
|
+
const styles = {"headCell":"DefaultHeadCellRendererWithTooltip-headCell--JlLvL","menuButtonWrapper":"DefaultHeadCellRendererWithTooltip-menuButtonWrapper--tMePw","headLabel":"DefaultHeadCellRendererWithTooltip-headLabel--fzLXE"};
|
|
2
2
|
if (typeof document !== 'undefined') {
|
|
3
3
|
const head = document.head || document.getElementsByTagName('head')[0]
|
|
4
4
|
const style = document.createElement('style');
|
|
5
5
|
style.type = 'text/css'
|
|
6
|
-
style.innerHTML = `.DefaultHeadCellRendererWithTooltip-headCell--JlLvL{align-items:center;display:flex;height:100%}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL>div{padding:0 16px 0 22px;width:100%}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL>div>span{justify-content:flex-end;width:100%}.DefaultHeadCellRendererWithTooltip-headLabel--fzLXE{color:var(--mui-palette-text-primary);font-size:12px;font-weight:500;line-height:16px;overflow:hidden;white-space:nowrap}.DefaultHeadCellRendererWithTooltip-headLabel--fzLXE:after{background:linear-gradient(90deg,hsla(0,0%,100%,.2),#fff);content:"";height:100%;pointer-events:none;position:absolute;right:0;top:0;width:40px}`;
|
|
6
|
+
style.innerHTML = `.DefaultHeadCellRendererWithTooltip-headCell--JlLvL{align-items:center;box-sizing:border-box;display:flex;height:100%;width:100%}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL .DefaultHeadCellRendererWithTooltip-menuButtonWrapper--tMePw{align-items:center;display:flex;justify-content:flex-end;padding-right:0;position:absolute;right:0;top:50%;transform:translateY(-50%);visibility:hidden;width:fit-content;z-index:2}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL:hover .DefaultHeadCellRendererWithTooltip-menuButtonWrapper--tMePw{visibility:visible}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL>div{padding:0 16px 0 22px;width:100%}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL>div>span{justify-content:flex-end;width:100%}.DefaultHeadCellRendererWithTooltip-headLabel--fzLXE{color:var(--mui-palette-text-primary);font-size:12px;font-weight:500;line-height:16px;overflow:hidden;white-space:nowrap}.DefaultHeadCellRendererWithTooltip-headLabel--fzLXE:after{background:linear-gradient(90deg,hsla(0,0%,100%,.2),#fff);content:"";height:100%;pointer-events:none;position:absolute;right:0;top:0;width:40px}`;
|
|
7
7
|
head.appendChild(style);
|
|
8
8
|
}
|
|
9
9
|
export default styles;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { DefaultHeadCellRendererWithTooltip } from './DefaultHeadCellRendererWithTooltip';
|
|
1
|
+
export { default as DefaultHeadCellRendererWithTooltip } from './DefaultHeadCellRendererWithTooltip';
|
|
2
2
|
export type { DefaultHeadCellRendererWithTooltipProps } from './DefaultHeadCellRendererWithTooltip';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { DefaultHeadCellRendererWithTooltip } from './DefaultHeadCellRendererWithTooltip';
|
|
1
|
+
export { default as DefaultHeadCellRendererWithTooltip } from './DefaultHeadCellRendererWithTooltip';
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
import { has } from 'ramda';
|
|
13
|
+
function isGroupedColumns(node) {
|
|
14
|
+
return has('columns', node) && Array.isArray(node.columns);
|
|
15
|
+
}
|
|
16
|
+
export function getAvailableColumns(grouped, selectedColumns) {
|
|
17
|
+
return grouped
|
|
18
|
+
.map(function (node) {
|
|
19
|
+
if (isGroupedColumns(node)) {
|
|
20
|
+
var filtered = getAvailableColumns(node.columns, selectedColumns);
|
|
21
|
+
if (filtered.length === 0)
|
|
22
|
+
return null;
|
|
23
|
+
return __assign(__assign({}, node), { columns: filtered });
|
|
24
|
+
}
|
|
25
|
+
if (selectedColumns.includes(node.id))
|
|
26
|
+
return null;
|
|
27
|
+
return node;
|
|
28
|
+
})
|
|
29
|
+
.filter(Boolean);
|
|
30
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { withColumnConfigurator } from './withColumnConfigurator';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { withColumnConfigurator } from './withColumnConfigurator';
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ComponentType, MouseEvent, ReactElement } from 'react';
|
|
2
|
+
import { GroupedColumnsData, ColumnData } from '../../types/basicTable';
|
|
3
|
+
export declare function withColumnConfigurator<P extends object>(Table: ComponentType<P & {
|
|
4
|
+
openConfigColumnPopup: (index: number, e: MouseEvent<HTMLElement>) => void;
|
|
5
|
+
}>): (props: {
|
|
6
|
+
columns: GroupedColumnsData<ColumnData>[];
|
|
7
|
+
onChangeColumns(ids: string[]): void;
|
|
8
|
+
selectedColumns: string[];
|
|
9
|
+
} & Omit<P, keyof {
|
|
10
|
+
columns: GroupedColumnsData<ColumnData>[];
|
|
11
|
+
onChangeColumns(ids: string[]): void;
|
|
12
|
+
selectedColumns: string[];
|
|
13
|
+
} | "openConfigColumnPopup">) => ReactElement;
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
+
var t = {};
|
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
+
t[p] = s[p];
|
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
+
t[p[i]] = s[p[i]];
|
|
20
|
+
}
|
|
21
|
+
return t;
|
|
22
|
+
};
|
|
23
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
24
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
25
|
+
if (ar || !(i in from)) {
|
|
26
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
27
|
+
ar[i] = from[i];
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
31
|
+
};
|
|
32
|
+
import React, { useCallback, useState, useMemo, useRef } from 'react';
|
|
33
|
+
import i18n from 'ui-i18n';
|
|
34
|
+
import { ConfigColumnPopup, HIDE, INSERT_LEFT, INSERT_RIGHT } from '../../ConfigColumnPopup';
|
|
35
|
+
import { ColumnsSettingsPopup } from '../../ColumnsSettings';
|
|
36
|
+
import { getAvailableColumns } from './helpers';
|
|
37
|
+
export function withColumnConfigurator(Table) {
|
|
38
|
+
return function ColumnConfigurator(props) {
|
|
39
|
+
var columns = props.columns, onChangeColumns = props.onChangeColumns, selectedColumns = props.selectedColumns, tableProps = __rest(props, ["columns", "onChangeColumns", "selectedColumns"]);
|
|
40
|
+
var _a = useState(null), anchorEl = _a[0], setAnchorEl = _a[1];
|
|
41
|
+
var _b = useState(null), configIdx = _b[0], setConfigIdx = _b[1];
|
|
42
|
+
var _c = useState(null), popupMode = _c[0], setPopupMode = _c[1];
|
|
43
|
+
var placeForNewRef = useRef(null);
|
|
44
|
+
var availablelColumns = useMemo(function () { return getAvailableColumns(columns, selectedColumns); }, [columns, selectedColumns]);
|
|
45
|
+
var closeAll = useCallback(function () {
|
|
46
|
+
setAnchorEl(null);
|
|
47
|
+
setConfigIdx(null);
|
|
48
|
+
setPopupMode(null);
|
|
49
|
+
placeForNewRef.current = null;
|
|
50
|
+
}, []);
|
|
51
|
+
var openConfigColumnPopup = useCallback(function (index, e) {
|
|
52
|
+
setAnchorEl(e.currentTarget);
|
|
53
|
+
setConfigIdx(index);
|
|
54
|
+
setPopupMode('menu');
|
|
55
|
+
}, []);
|
|
56
|
+
var handleMenuAction = useCallback(function (action) {
|
|
57
|
+
if (configIdx === null)
|
|
58
|
+
return;
|
|
59
|
+
switch (action) {
|
|
60
|
+
case INSERT_LEFT:
|
|
61
|
+
placeForNewRef.current = configIdx;
|
|
62
|
+
setPopupMode('add');
|
|
63
|
+
break;
|
|
64
|
+
case INSERT_RIGHT:
|
|
65
|
+
placeForNewRef.current = configIdx + 1;
|
|
66
|
+
setPopupMode('add');
|
|
67
|
+
break;
|
|
68
|
+
case HIDE: {
|
|
69
|
+
var next = __spreadArray(__spreadArray([], selectedColumns.slice(0, configIdx), true), selectedColumns.slice(configIdx + 1), true);
|
|
70
|
+
onChangeColumns(next);
|
|
71
|
+
closeAll();
|
|
72
|
+
break;
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}, [selectedColumns, configIdx, onChangeColumns, closeAll]);
|
|
76
|
+
var handleAddColumn = useCallback(function (_a) {
|
|
77
|
+
var id = _a.id;
|
|
78
|
+
if (placeForNewRef.current === null)
|
|
79
|
+
return;
|
|
80
|
+
var next = __spreadArray(__spreadArray(__spreadArray([], selectedColumns.slice(0, placeForNewRef.current), true), [
|
|
81
|
+
id
|
|
82
|
+
], false), selectedColumns.slice(placeForNewRef.current), true);
|
|
83
|
+
onChangeColumns(next);
|
|
84
|
+
closeAll();
|
|
85
|
+
}, [selectedColumns, onChangeColumns, closeAll]);
|
|
86
|
+
return (React.createElement(React.Fragment, null,
|
|
87
|
+
React.createElement(Table, __assign({}, tableProps, { openConfigColumnPopup: openConfigColumnPopup })),
|
|
88
|
+
React.createElement(ColumnsSettingsPopup, { anchorEl: popupMode === 'add' ? anchorEl : null, onClose: closeAll, title: i18n.text('Add column'), columnsData: availablelColumns, onColumnClick: handleAddColumn, selectedColumns: selectedColumns, hideCheckBox: true }),
|
|
89
|
+
React.createElement(ConfigColumnPopup, { open: popupMode === 'menu', anchorEl: anchorEl, onClose: closeAll, onClick: handleMenuAction, actions: configIdx !== null && configIdx > 0 ? [INSERT_LEFT, INSERT_RIGHT, HIDE] : [INSERT_RIGHT] })));
|
|
90
|
+
};
|
|
91
|
+
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { DefaultHeadCellRendererWithTooltipProps } from '../../../DefaultHeadCellRendererWithTooltip
|
|
2
|
+
import { DefaultHeadCellRendererWithTooltipProps } from '../../../DefaultHeadCellRendererWithTooltip';
|
|
3
3
|
export declare const HeadCellRenderer: (props: DefaultHeadCellRendererWithTooltipProps) => React.JSX.Element;
|
|
@@ -10,7 +10,7 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
12
|
import React from 'react';
|
|
13
|
-
import { DefaultHeadCellRendererWithTooltip } from '../../../DefaultHeadCellRendererWithTooltip
|
|
13
|
+
import { DefaultHeadCellRendererWithTooltip } from '../../../DefaultHeadCellRendererWithTooltip';
|
|
14
14
|
import { useStyles } from './styles';
|
|
15
15
|
export var HeadCellRenderer = function (props) {
|
|
16
16
|
var styles = useStyles();
|
|
@@ -13,6 +13,6 @@ var ColumnListItem = function (_a) {
|
|
|
13
13
|
var _b;
|
|
14
14
|
var item = _a.item, onClick = _a.onClick, checked = _a.checked, level = _a.level, style = _a.style, isFocused = _a.isFocused, isGroupItem = _a.isGroupItem, hideCheckBox = _a.hideCheckBox;
|
|
15
15
|
var styles = (0, styles_1.useStyles)();
|
|
16
|
-
return (react_1.default.createElement(AttributeListItem_1.AttributeListItem, { hideCheckBox: hideCheckBox, key: item.id, onClick: onClick, checked: checked, level: level, data: item, label: react_1.default.createElement(Highlighter_1.Highlighter, { text: item.label, highlight: item.filterText }), labelInText: item.label, style: style, isFocused: isFocused, hideIcon: isGroupItem, className: (0, classnames_1.default)((_b = {}, _b[styles.groupItem] = isGroupItem, _b)) }));
|
|
16
|
+
return (react_1.default.createElement(AttributeListItem_1.AttributeListItem, { hideCheckBox: hideCheckBox, key: item.id, onClick: onClick, checked: checked, level: level, data: item, label: react_1.default.createElement(Highlighter_1.Highlighter, { text: item.label, highlight: item.filterText }), labelInText: item.label, style: style, isFocused: isFocused, hideIcon: isGroupItem, className: (0, classnames_1.default)((_b = {}, _b[styles.groupItem] = isGroupItem, _b)), notSelectable: hideCheckBox && isGroupItem }));
|
|
17
17
|
};
|
|
18
18
|
exports.ColumnListItem = ColumnListItem;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const INSERT_LEFT = "left";
|
|
3
|
+
export declare const INSERT_RIGHT = "right";
|
|
4
|
+
export declare const HIDE = "hide";
|
|
5
|
+
export type ConfigColumnAction = typeof INSERT_LEFT | typeof INSERT_RIGHT | typeof HIDE;
|
|
6
|
+
type Props = {
|
|
7
|
+
open: boolean;
|
|
8
|
+
anchorEl: HTMLElement | null;
|
|
9
|
+
onClick: (action: ConfigColumnAction) => void;
|
|
10
|
+
onClose: () => void;
|
|
11
|
+
actions: ConfigColumnAction[];
|
|
12
|
+
};
|
|
13
|
+
export declare const ConfigColumnPopup: ({ open, anchorEl, onClick, onClose, actions }: Props) => React.JSX.Element;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.ConfigColumnPopup = exports.HIDE = exports.INSERT_RIGHT = exports.INSERT_LEFT = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var Popover_1 = __importDefault(require("@mui/material/Popover"));
|
|
9
|
+
var List_1 = __importDefault(require("@mui/material/List"));
|
|
10
|
+
var ListItem_1 = __importDefault(require("@mui/material/ListItem"));
|
|
11
|
+
var ListItemText_1 = __importDefault(require("@mui/material/ListItemText"));
|
|
12
|
+
var ui_i18n_1 = __importDefault(require("ui-i18n"));
|
|
13
|
+
exports.INSERT_LEFT = 'left';
|
|
14
|
+
exports.INSERT_RIGHT = 'right';
|
|
15
|
+
exports.HIDE = 'hide';
|
|
16
|
+
var ConfigColumnPopup = function (_a) {
|
|
17
|
+
var _b;
|
|
18
|
+
var open = _a.open, anchorEl = _a.anchorEl, onClick = _a.onClick, onClose = _a.onClose, actions = _a.actions;
|
|
19
|
+
var TEXT = (_b = {},
|
|
20
|
+
_b[exports.INSERT_LEFT] = ui_i18n_1.default.text('Insert 1 left'),
|
|
21
|
+
_b[exports.INSERT_RIGHT] = ui_i18n_1.default.text('Insert 1 right'),
|
|
22
|
+
_b[exports.HIDE] = ui_i18n_1.default.text('Hide column'),
|
|
23
|
+
_b);
|
|
24
|
+
var getClickHandler = function (action) { return function () {
|
|
25
|
+
onClick(action);
|
|
26
|
+
}; };
|
|
27
|
+
return (react_1.default.createElement(Popover_1.default, { open: open, anchorEl: anchorEl, onClose: onClose },
|
|
28
|
+
react_1.default.createElement(List_1.default, { component: "div" }, actions.map(function (action, index) { return (react_1.default.createElement(ListItem_1.default, { button: true, component: "div", key: index, onClick: getClickHandler(action) },
|
|
29
|
+
react_1.default.createElement(ListItemText_1.default, { primary: TEXT[action], primaryTypographyProps: { variant: 'body2' } }))); }))));
|
|
30
|
+
};
|
|
31
|
+
exports.ConfigColumnPopup = ConfigColumnPopup;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
14
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
15
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
16
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
17
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
18
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
19
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
20
|
+
});
|
|
21
|
+
};
|
|
22
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
23
|
+
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);
|
|
24
|
+
return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
25
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
26
|
+
function step(op) {
|
|
27
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
28
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
29
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
30
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
31
|
+
switch (op[0]) {
|
|
32
|
+
case 0: case 1: t = op; break;
|
|
33
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
34
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
35
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
36
|
+
default:
|
|
37
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
38
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
39
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
40
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
41
|
+
if (t[2]) _.ops.pop();
|
|
42
|
+
_.trys.pop(); continue;
|
|
43
|
+
}
|
|
44
|
+
op = body.call(thisArg, _);
|
|
45
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
46
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
50
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
51
|
+
};
|
|
52
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
53
|
+
var react_1 = __importDefault(require("react"));
|
|
54
|
+
var user_event_1 = __importDefault(require("@testing-library/user-event"));
|
|
55
|
+
var react_2 = require("@testing-library/react");
|
|
56
|
+
var ConfigColumnPopup_1 = require("./ConfigColumnPopup");
|
|
57
|
+
describe('ConfigColumnPopup tests', function () {
|
|
58
|
+
var defaultProps = {
|
|
59
|
+
open: true,
|
|
60
|
+
anchorEl: document.body,
|
|
61
|
+
onClick: jest.fn(),
|
|
62
|
+
onClose: jest.fn(),
|
|
63
|
+
actions: [ConfigColumnPopup_1.INSERT_LEFT, ConfigColumnPopup_1.INSERT_RIGHT, ConfigColumnPopup_1.HIDE]
|
|
64
|
+
};
|
|
65
|
+
var setUp = function (props) {
|
|
66
|
+
if (props === void 0) { props = {}; }
|
|
67
|
+
var user = user_event_1.default.setup();
|
|
68
|
+
return __assign({ user: user }, (0, react_2.render)(react_1.default.createElement(ConfigColumnPopup_1.ConfigColumnPopup, __assign({}, defaultProps, props))));
|
|
69
|
+
};
|
|
70
|
+
afterEach(function () {
|
|
71
|
+
jest.clearAllMocks();
|
|
72
|
+
});
|
|
73
|
+
it('should render all action items', function () {
|
|
74
|
+
setUp();
|
|
75
|
+
expect(react_2.screen.getByText('Insert 1 left')).toBeInTheDocument();
|
|
76
|
+
expect(react_2.screen.getByText('Insert 1 right')).toBeInTheDocument();
|
|
77
|
+
expect(react_2.screen.getByText('Hide column')).toBeInTheDocument();
|
|
78
|
+
});
|
|
79
|
+
it('should call onClick with correct action when item is clicked', function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
80
|
+
var onClick, user;
|
|
81
|
+
return __generator(this, function (_a) {
|
|
82
|
+
switch (_a.label) {
|
|
83
|
+
case 0:
|
|
84
|
+
onClick = jest.fn();
|
|
85
|
+
user = setUp({ onClick: onClick }).user;
|
|
86
|
+
return [4 /*yield*/, user.click(react_2.screen.getByText('Insert 1 left'))];
|
|
87
|
+
case 1:
|
|
88
|
+
_a.sent();
|
|
89
|
+
expect(onClick).toHaveBeenCalledWith(ConfigColumnPopup_1.INSERT_LEFT);
|
|
90
|
+
return [4 /*yield*/, user.click(react_2.screen.getByText('Insert 1 right'))];
|
|
91
|
+
case 2:
|
|
92
|
+
_a.sent();
|
|
93
|
+
expect(onClick).toHaveBeenCalledWith(ConfigColumnPopup_1.INSERT_RIGHT);
|
|
94
|
+
return [4 /*yield*/, user.click(react_2.screen.getByText('Hide column'))];
|
|
95
|
+
case 3:
|
|
96
|
+
_a.sent();
|
|
97
|
+
expect(onClick).toHaveBeenCalledWith(ConfigColumnPopup_1.HIDE);
|
|
98
|
+
expect(onClick).toHaveBeenCalledTimes(3);
|
|
99
|
+
return [2 /*return*/];
|
|
100
|
+
}
|
|
101
|
+
});
|
|
102
|
+
}); });
|
|
103
|
+
it('should not render anything when open is false', function () {
|
|
104
|
+
setUp({ open: false });
|
|
105
|
+
expect(react_2.screen.queryByText('Insert 1 left')).not.toBeInTheDocument();
|
|
106
|
+
expect(react_2.screen.queryByText('Insert 1 right')).not.toBeInTheDocument();
|
|
107
|
+
expect(react_2.screen.queryByText('Hide column')).not.toBeInTheDocument();
|
|
108
|
+
});
|
|
109
|
+
it('should call onClose when popover is closed', function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
110
|
+
var onClose, user, backdrop;
|
|
111
|
+
return __generator(this, function (_a) {
|
|
112
|
+
switch (_a.label) {
|
|
113
|
+
case 0:
|
|
114
|
+
onClose = jest.fn();
|
|
115
|
+
user = setUp({ onClose: onClose }).user;
|
|
116
|
+
backdrop = document.querySelector('.MuiBackdrop-root');
|
|
117
|
+
return [4 /*yield*/, user.click(backdrop)];
|
|
118
|
+
case 1:
|
|
119
|
+
_a.sent();
|
|
120
|
+
expect(onClose).toHaveBeenCalled();
|
|
121
|
+
return [2 /*return*/];
|
|
122
|
+
}
|
|
123
|
+
});
|
|
124
|
+
}); });
|
|
125
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { ConfigColumnPopup, INSERT_LEFT, INSERT_RIGHT, HIDE } from './ConfigColumnPopup';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.HIDE = exports.INSERT_RIGHT = exports.INSERT_LEFT = exports.ConfigColumnPopup = void 0;
|
|
4
|
+
var ConfigColumnPopup_1 = require("./ConfigColumnPopup");
|
|
5
|
+
Object.defineProperty(exports, "ConfigColumnPopup", { enumerable: true, get: function () { return ConfigColumnPopup_1.ConfigColumnPopup; } });
|
|
6
|
+
Object.defineProperty(exports, "INSERT_LEFT", { enumerable: true, get: function () { return ConfigColumnPopup_1.INSERT_LEFT; } });
|
|
7
|
+
Object.defineProperty(exports, "INSERT_RIGHT", { enumerable: true, get: function () { return ConfigColumnPopup_1.INSERT_RIGHT; } });
|
|
8
|
+
Object.defineProperty(exports, "HIDE", { enumerable: true, get: function () { return ConfigColumnPopup_1.HIDE; } });
|
|
@@ -11,5 +11,9 @@ export type DefaultHeadCellRendererWithTooltipProps = {
|
|
|
11
11
|
headLabel?: string;
|
|
12
12
|
};
|
|
13
13
|
dataReltioId?: string;
|
|
14
|
+
openConfigColumnPopup?: (index: number, event: React.MouseEvent<HTMLElement>) => void;
|
|
14
15
|
};
|
|
15
|
-
|
|
16
|
+
declare const _default: React.ComponentType<{
|
|
17
|
+
[x: string]: unknown;
|
|
18
|
+
}>;
|
|
19
|
+
export default _default;
|
|
@@ -25,18 +25,23 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
25
25
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
26
|
};
|
|
27
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
-
exports.DefaultHeadCellRendererWithTooltip = void 0;
|
|
29
|
-
var classnames_1 = __importDefault(require("classnames"));
|
|
30
28
|
var react_1 = __importDefault(require("react"));
|
|
29
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
30
|
+
var ramda_1 = require("ramda");
|
|
31
|
+
var MoreVert_1 = __importDefault(require("@mui/icons-material/MoreVert"));
|
|
31
32
|
var DefaultHeadCellRenderer_1 = __importDefault(require("react-components/dist/Table/DefaultHeadCellRenderer/DefaultHeadCellRenderer"));
|
|
33
|
+
var withTableContext_1 = require("../HOCs/withTableContext");
|
|
32
34
|
var ExpandedValueTooltip_1 = require("../ExpandedValueTooltip");
|
|
35
|
+
var SmallIconButton_1 = require("../SmallIconButton");
|
|
33
36
|
var DefaultHeadCellRendererWithTooltip_module_css_1 = __importDefault(require("./DefaultHeadCellRendererWithTooltip.module.css"));
|
|
34
37
|
var DefaultHeadCellRendererWithTooltip = function (_a) {
|
|
35
|
-
var _b = _a.classes, classes = _b === void 0 ? {} : _b, dataReltioId = _a.dataReltioId, headCellData = _a.headCellData, className = _a.className, props = __rest(_a, ["classes", "dataReltioId", "headCellData", "className"]);
|
|
38
|
+
var _b = _a.classes, classes = _b === void 0 ? {} : _b, dataReltioId = _a.dataReltioId, headCellData = _a.headCellData, className = _a.className, openConfigColumnPopup = _a.openConfigColumnPopup, headIndex = _a.headIndex, props = __rest(_a, ["classes", "dataReltioId", "headCellData", "className", "openConfigColumnPopup", "headIndex"]);
|
|
36
39
|
var headCell = (classes === null || classes === void 0 ? void 0 : classes.headCell) || DefaultHeadCellRendererWithTooltip_module_css_1.default.headCell;
|
|
37
40
|
var headLabel = (classes === null || classes === void 0 ? void 0 : classes.headLabel) || DefaultHeadCellRendererWithTooltip_module_css_1.default.headLabel;
|
|
38
41
|
return (react_1.default.createElement("div", __assign({ className: (0, classnames_1.default)(headCell, className) }, (dataReltioId ? { 'data-reltio-id': dataReltioId } : {})),
|
|
39
|
-
react_1.default.createElement(DefaultHeadCellRenderer_1.default, __assign({}, props, { headCellData: __assign(__assign({}, headCellData), { label: (react_1.default.createElement(ExpandedValueTooltip_1.ExpandedValueTooltip, { value: headCellData.label },
|
|
40
|
-
react_1.default.createElement("div", { className: headLabel }, headCellData.label))) }) }))
|
|
42
|
+
react_1.default.createElement(DefaultHeadCellRenderer_1.default, __assign({}, props, { headIndex: headIndex, headCellData: __assign(__assign({}, headCellData), { label: (react_1.default.createElement(ExpandedValueTooltip_1.ExpandedValueTooltip, { value: headCellData.label },
|
|
43
|
+
react_1.default.createElement("div", { className: headLabel }, headCellData.label))) }) })),
|
|
44
|
+
openConfigColumnPopup && (react_1.default.createElement("div", { className: DefaultHeadCellRendererWithTooltip_module_css_1.default.menuButtonWrapper },
|
|
45
|
+
react_1.default.createElement(SmallIconButton_1.SmallIconButton, { icon: MoreVert_1.default, onClick: function (e) { return openConfigColumnPopup && openConfigColumnPopup(headIndex, e); }, size: "S" })))));
|
|
41
46
|
};
|
|
42
|
-
exports.
|
|
47
|
+
exports.default = (0, withTableContext_1.withTableContext)((0, ramda_1.pipe)((0, ramda_1.defaultTo)({}), (0, ramda_1.pick)(['openConfigColumnPopup'])))(DefaultHeadCellRendererWithTooltip);
|
package/cjs/DefaultHeadCellRendererWithTooltip/DefaultHeadCellRendererWithTooltip.module.css.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
const styles = {"headCell":"DefaultHeadCellRendererWithTooltip-headCell--JlLvL","headLabel":"DefaultHeadCellRendererWithTooltip-headLabel--fzLXE"};
|
|
1
|
+
const styles = {"headCell":"DefaultHeadCellRendererWithTooltip-headCell--JlLvL","menuButtonWrapper":"DefaultHeadCellRendererWithTooltip-menuButtonWrapper--tMePw","headLabel":"DefaultHeadCellRendererWithTooltip-headLabel--fzLXE"};
|
|
2
2
|
if (typeof document !== 'undefined') {
|
|
3
3
|
const head = document.head || document.getElementsByTagName('head')[0]
|
|
4
4
|
const style = document.createElement('style');
|
|
5
5
|
style.type = 'text/css'
|
|
6
|
-
style.innerHTML = `.DefaultHeadCellRendererWithTooltip-headCell--JlLvL{align-items:center;display:flex;height:100%}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL>div{padding:0 16px 0 22px;width:100%}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL>div>span{justify-content:flex-end;width:100%}.DefaultHeadCellRendererWithTooltip-headLabel--fzLXE{color:var(--mui-palette-text-primary);font-size:12px;font-weight:500;line-height:16px;overflow:hidden;white-space:nowrap}.DefaultHeadCellRendererWithTooltip-headLabel--fzLXE:after{background:linear-gradient(90deg,hsla(0,0%,100%,.2),#fff);content:"";height:100%;pointer-events:none;position:absolute;right:0;top:0;width:40px}`;
|
|
6
|
+
style.innerHTML = `.DefaultHeadCellRendererWithTooltip-headCell--JlLvL{align-items:center;box-sizing:border-box;display:flex;height:100%;width:100%}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL .DefaultHeadCellRendererWithTooltip-menuButtonWrapper--tMePw{align-items:center;display:flex;justify-content:flex-end;padding-right:0;position:absolute;right:0;top:50%;transform:translateY(-50%);visibility:hidden;width:fit-content;z-index:2}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL:hover .DefaultHeadCellRendererWithTooltip-menuButtonWrapper--tMePw{visibility:visible}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL>div{padding:0 16px 0 22px;width:100%}.DefaultHeadCellRendererWithTooltip-headCell--JlLvL>div>span{justify-content:flex-end;width:100%}.DefaultHeadCellRendererWithTooltip-headLabel--fzLXE{color:var(--mui-palette-text-primary);font-size:12px;font-weight:500;line-height:16px;overflow:hidden;white-space:nowrap}.DefaultHeadCellRendererWithTooltip-headLabel--fzLXE:after{background:linear-gradient(90deg,hsla(0,0%,100%,.2),#fff);content:"";height:100%;pointer-events:none;position:absolute;right:0;top:0;width:40px}`;
|
|
7
7
|
head.appendChild(style);
|
|
8
8
|
}
|
|
9
9
|
module.exports = styles;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { DefaultHeadCellRendererWithTooltip } from './DefaultHeadCellRendererWithTooltip';
|
|
1
|
+
export { default as DefaultHeadCellRendererWithTooltip } from './DefaultHeadCellRendererWithTooltip';
|
|
2
2
|
export type { DefaultHeadCellRendererWithTooltipProps } from './DefaultHeadCellRendererWithTooltip';
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
2
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
6
|
exports.DefaultHeadCellRendererWithTooltip = void 0;
|
|
4
7
|
var DefaultHeadCellRendererWithTooltip_1 = require("./DefaultHeadCellRendererWithTooltip");
|
|
5
|
-
Object.defineProperty(exports, "DefaultHeadCellRendererWithTooltip", { enumerable: true, get: function () { return DefaultHeadCellRendererWithTooltip_1.
|
|
8
|
+
Object.defineProperty(exports, "DefaultHeadCellRendererWithTooltip", { enumerable: true, get: function () { return __importDefault(DefaultHeadCellRendererWithTooltip_1).default; } });
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
+
exports.getAvailableColumns = getAvailableColumns;
|
|
15
|
+
var ramda_1 = require("ramda");
|
|
16
|
+
function isGroupedColumns(node) {
|
|
17
|
+
return (0, ramda_1.has)('columns', node) && Array.isArray(node.columns);
|
|
18
|
+
}
|
|
19
|
+
function getAvailableColumns(grouped, selectedColumns) {
|
|
20
|
+
return grouped
|
|
21
|
+
.map(function (node) {
|
|
22
|
+
if (isGroupedColumns(node)) {
|
|
23
|
+
var filtered = getAvailableColumns(node.columns, selectedColumns);
|
|
24
|
+
if (filtered.length === 0)
|
|
25
|
+
return null;
|
|
26
|
+
return __assign(__assign({}, node), { columns: filtered });
|
|
27
|
+
}
|
|
28
|
+
if (selectedColumns.includes(node.id))
|
|
29
|
+
return null;
|
|
30
|
+
return node;
|
|
31
|
+
})
|
|
32
|
+
.filter(Boolean);
|
|
33
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { withColumnConfigurator } from './withColumnConfigurator';
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.withColumnConfigurator = void 0;
|
|
4
|
+
var withColumnConfigurator_1 = require("./withColumnConfigurator");
|
|
5
|
+
Object.defineProperty(exports, "withColumnConfigurator", { enumerable: true, get: function () { return withColumnConfigurator_1.withColumnConfigurator; } });
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ComponentType, MouseEvent, ReactElement } from 'react';
|
|
2
|
+
import { GroupedColumnsData, ColumnData } from '../../types/basicTable';
|
|
3
|
+
export declare function withColumnConfigurator<P extends object>(Table: ComponentType<P & {
|
|
4
|
+
openConfigColumnPopup: (index: number, e: MouseEvent<HTMLElement>) => void;
|
|
5
|
+
}>): (props: {
|
|
6
|
+
columns: GroupedColumnsData<ColumnData>[];
|
|
7
|
+
onChangeColumns(ids: string[]): void;
|
|
8
|
+
selectedColumns: string[];
|
|
9
|
+
} & Omit<P, keyof {
|
|
10
|
+
columns: GroupedColumnsData<ColumnData>[];
|
|
11
|
+
onChangeColumns(ids: string[]): void;
|
|
12
|
+
selectedColumns: string[];
|
|
13
|
+
} | "openConfigColumnPopup">) => ReactElement;
|
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
+
if (k2 === undefined) k2 = k;
|
|
15
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
16
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
17
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
18
|
+
}
|
|
19
|
+
Object.defineProperty(o, k2, desc);
|
|
20
|
+
}) : (function(o, m, k, k2) {
|
|
21
|
+
if (k2 === undefined) k2 = k;
|
|
22
|
+
o[k2] = m[k];
|
|
23
|
+
}));
|
|
24
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
+
}) : function(o, v) {
|
|
27
|
+
o["default"] = v;
|
|
28
|
+
});
|
|
29
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
+
if (mod && mod.__esModule) return mod;
|
|
31
|
+
var result = {};
|
|
32
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
+
__setModuleDefault(result, mod);
|
|
34
|
+
return result;
|
|
35
|
+
};
|
|
36
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
37
|
+
var t = {};
|
|
38
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
39
|
+
t[p] = s[p];
|
|
40
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
41
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
42
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
43
|
+
t[p[i]] = s[p[i]];
|
|
44
|
+
}
|
|
45
|
+
return t;
|
|
46
|
+
};
|
|
47
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
48
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
49
|
+
if (ar || !(i in from)) {
|
|
50
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
51
|
+
ar[i] = from[i];
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
55
|
+
};
|
|
56
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
57
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
58
|
+
};
|
|
59
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
60
|
+
exports.withColumnConfigurator = withColumnConfigurator;
|
|
61
|
+
var react_1 = __importStar(require("react"));
|
|
62
|
+
var ui_i18n_1 = __importDefault(require("ui-i18n"));
|
|
63
|
+
var ConfigColumnPopup_1 = require("../../ConfigColumnPopup");
|
|
64
|
+
var ColumnsSettings_1 = require("../../ColumnsSettings");
|
|
65
|
+
var helpers_1 = require("./helpers");
|
|
66
|
+
function withColumnConfigurator(Table) {
|
|
67
|
+
return function ColumnConfigurator(props) {
|
|
68
|
+
var columns = props.columns, onChangeColumns = props.onChangeColumns, selectedColumns = props.selectedColumns, tableProps = __rest(props, ["columns", "onChangeColumns", "selectedColumns"]);
|
|
69
|
+
var _a = (0, react_1.useState)(null), anchorEl = _a[0], setAnchorEl = _a[1];
|
|
70
|
+
var _b = (0, react_1.useState)(null), configIdx = _b[0], setConfigIdx = _b[1];
|
|
71
|
+
var _c = (0, react_1.useState)(null), popupMode = _c[0], setPopupMode = _c[1];
|
|
72
|
+
var placeForNewRef = (0, react_1.useRef)(null);
|
|
73
|
+
var availablelColumns = (0, react_1.useMemo)(function () { return (0, helpers_1.getAvailableColumns)(columns, selectedColumns); }, [columns, selectedColumns]);
|
|
74
|
+
var closeAll = (0, react_1.useCallback)(function () {
|
|
75
|
+
setAnchorEl(null);
|
|
76
|
+
setConfigIdx(null);
|
|
77
|
+
setPopupMode(null);
|
|
78
|
+
placeForNewRef.current = null;
|
|
79
|
+
}, []);
|
|
80
|
+
var openConfigColumnPopup = (0, react_1.useCallback)(function (index, e) {
|
|
81
|
+
setAnchorEl(e.currentTarget);
|
|
82
|
+
setConfigIdx(index);
|
|
83
|
+
setPopupMode('menu');
|
|
84
|
+
}, []);
|
|
85
|
+
var handleMenuAction = (0, react_1.useCallback)(function (action) {
|
|
86
|
+
if (configIdx === null)
|
|
87
|
+
return;
|
|
88
|
+
switch (action) {
|
|
89
|
+
case ConfigColumnPopup_1.INSERT_LEFT:
|
|
90
|
+
placeForNewRef.current = configIdx;
|
|
91
|
+
setPopupMode('add');
|
|
92
|
+
break;
|
|
93
|
+
case ConfigColumnPopup_1.INSERT_RIGHT:
|
|
94
|
+
placeForNewRef.current = configIdx + 1;
|
|
95
|
+
setPopupMode('add');
|
|
96
|
+
break;
|
|
97
|
+
case ConfigColumnPopup_1.HIDE: {
|
|
98
|
+
var next = __spreadArray(__spreadArray([], selectedColumns.slice(0, configIdx), true), selectedColumns.slice(configIdx + 1), true);
|
|
99
|
+
onChangeColumns(next);
|
|
100
|
+
closeAll();
|
|
101
|
+
break;
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
}, [selectedColumns, configIdx, onChangeColumns, closeAll]);
|
|
105
|
+
var handleAddColumn = (0, react_1.useCallback)(function (_a) {
|
|
106
|
+
var id = _a.id;
|
|
107
|
+
if (placeForNewRef.current === null)
|
|
108
|
+
return;
|
|
109
|
+
var next = __spreadArray(__spreadArray(__spreadArray([], selectedColumns.slice(0, placeForNewRef.current), true), [
|
|
110
|
+
id
|
|
111
|
+
], false), selectedColumns.slice(placeForNewRef.current), true);
|
|
112
|
+
onChangeColumns(next);
|
|
113
|
+
closeAll();
|
|
114
|
+
}, [selectedColumns, onChangeColumns, closeAll]);
|
|
115
|
+
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
116
|
+
react_1.default.createElement(Table, __assign({}, tableProps, { openConfigColumnPopup: openConfigColumnPopup })),
|
|
117
|
+
react_1.default.createElement(ColumnsSettings_1.ColumnsSettingsPopup, { anchorEl: popupMode === 'add' ? anchorEl : null, onClose: closeAll, title: ui_i18n_1.default.text('Add column'), columnsData: availablelColumns, onColumnClick: handleAddColumn, selectedColumns: selectedColumns, hideCheckBox: true }),
|
|
118
|
+
react_1.default.createElement(ConfigColumnPopup_1.ConfigColumnPopup, { open: popupMode === 'menu', anchorEl: anchorEl, onClose: closeAll, onClick: handleMenuAction, actions: configIdx !== null && configIdx > 0 ? [ConfigColumnPopup_1.INSERT_LEFT, ConfigColumnPopup_1.INSERT_RIGHT, ConfigColumnPopup_1.HIDE] : [ConfigColumnPopup_1.INSERT_RIGHT] })));
|
|
119
|
+
};
|
|
120
|
+
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { DefaultHeadCellRendererWithTooltipProps } from '../../../DefaultHeadCellRendererWithTooltip
|
|
2
|
+
import { DefaultHeadCellRendererWithTooltipProps } from '../../../DefaultHeadCellRendererWithTooltip';
|
|
3
3
|
export declare const HeadCellRenderer: (props: DefaultHeadCellRendererWithTooltipProps) => React.JSX.Element;
|
|
@@ -16,7 +16,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
17
|
exports.HeadCellRenderer = void 0;
|
|
18
18
|
var react_1 = __importDefault(require("react"));
|
|
19
|
-
var DefaultHeadCellRendererWithTooltip_1 = require("../../../DefaultHeadCellRendererWithTooltip
|
|
19
|
+
var DefaultHeadCellRendererWithTooltip_1 = require("../../../DefaultHeadCellRendererWithTooltip");
|
|
20
20
|
var styles_1 = require("./styles");
|
|
21
21
|
var HeadCellRenderer = function (props) {
|
|
22
22
|
var styles = (0, styles_1.useStyles)();
|
package/cjs/index.d.ts
CHANGED
|
@@ -94,6 +94,7 @@ export { ReactSelectOptionWithCheckIcon } from './ReactSelectOptionWithCheckIcon
|
|
|
94
94
|
export { DropDownSelector } from './DropDownSelector';
|
|
95
95
|
export { ConnectionEditor } from './ConnectionEditor';
|
|
96
96
|
export { ConfigureColumnsPopup } from './ConfigureColumnsPopup';
|
|
97
|
+
export { ConfigColumnPopup, INSERT_LEFT, INSERT_RIGHT, HIDE } from './ConfigColumnPopup';
|
|
97
98
|
export { ErrorMessage } from './ErrorMessage';
|
|
98
99
|
export { ErrorWrapper } from './ErrorWrapper';
|
|
99
100
|
export { DateEditor } from './DateEditor';
|
|
@@ -192,6 +193,7 @@ export { withFilterAtBottom } from './HOCs/withFilterAtBottom';
|
|
|
192
193
|
export { withTableContext } from './HOCs/withTableContext';
|
|
193
194
|
export { withCollapseButton } from './HOCs/withCollapseButton';
|
|
194
195
|
export { withBlockNavigation } from './HOCs/withBlockNavigation';
|
|
196
|
+
export { withColumnConfigurator } from './HOCs/withColumnConfigurator';
|
|
195
197
|
export { MdmModuleProvider } from './contexts/MdmModuleContext';
|
|
196
198
|
export { AsyncMountContext } from './contexts/AsyncMountContext';
|
|
197
199
|
export { HistoryDiffContext } from './contexts/HistoryAppearanceContext';
|
package/cjs/index.js
CHANGED
|
@@ -16,11 +16,11 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
17
|
exports.NestedAttributeEditor = exports.NestedAttribute = exports.MoreAttributesButton = exports.InlineReferenceAttribute = exports.InlineNestedAttribute = exports.InlineImageAttribute = exports.InlineAttributesPager = exports.InfoIcon = exports.EditableImageAttributesLine = exports.FilterButton = exports.FacetViewHeader = exports.ExpandedValueTooltip = exports.EntitySelector = exports.EntityCreator = exports.AttributesPager = exports.AttributesList = exports.EditableAttribute = exports.DropDownMenuButton = exports.DescriptionIcon = exports.DefaultCellValueRenderer = exports.ControlAttributeIcon = exports.ColumnsSettingsPopup = exports.ColumnsSettings = exports.ColorBar = exports.CollapseRowButton = exports.BasicChartsFactory = exports.ChartsFactory = exports.CardinalityMessage = exports.BranchDecorator = exports.BasicViewHeader = exports.BasicViewContent = exports.BasicView = exports.BasicTablePagination = exports.basicTableViewState = exports.BasicTable = exports.BasicAttributeSelector = exports.BarChart = exports.AvatarWithFallback = exports.AutoSizeList = exports.AttributesView = exports.AttributesValuesEditor = exports.AttributesFiltersButton = exports.AttributesFiltersBuilder = exports.AttributesFilterSelector = exports.AttributesErrorsPanel = exports.AttributeListItem = exports.AttributeGroupIcon = exports.ArrowExpandButton = exports.ActionsPanel = exports.ActionButton = void 0;
|
|
18
18
|
exports.DropDownSelector = exports.ReactSelectOptionWithCheckIcon = exports.ReactSelectMenuWithPopper = exports.ReactSelectMenuList = exports.ReactSelectLoadMoreButton = exports.ReactSelectDropdownIndicatorWithIconButton = exports.ReactSelectDropdownIndicator = exports.Highlighter = exports.HierarchyNodeTitle = exports.HierarchicalAttributeTooltip = exports.HideOnShrink = exports.ExpandableSearchInput = exports.ErrorPopup = exports.ErrorBoundary = exports.SegmentIdLink = exports.EntityUriLink = exports.EntityTypesSelector = exports.EntityTypeIcon = exports.EntityTypeBadge = exports.EntityAvatar = exports.EMPTY_STATE_VARIANTS = exports.EMPTY_STATE_ICONS = exports.EmptyState = exports.Drawer = exports.DataTypeValue = exports.DataTenantBadge = exports.ConnectionRelationTypeSelector = exports.CollaborationItem = exports.ConfirmationDialog = exports.CommentsContainer = exports.ColoredSourceIcon = exports.CollapseButton = exports.TreeChart = exports.TableWithBars = exports.SourceIcon = exports.SmallIconButtonWithTooltip = exports.SmallIconButton = exports.SimpleAttributeEditor = exports.SimpleAttribute = exports.RowCellAutoSizer = exports.RelationTypeSelector = exports.ReferenceAttributeEditor = exports.ReferenceAttribute = exports.ImageAttributesLine = exports.ReadOnlyAttributesPager = exports.ReadOnlyAttributesList = exports.ReadOnlyAttribute = exports.ReadOnlyAttributeValuesBlock = exports.PieChart = exports.OvIcon = void 0;
|
|
19
|
-
exports.
|
|
20
|
-
exports.
|
|
21
|
-
exports.
|
|
22
|
-
exports.
|
|
23
|
-
exports.mockComputedStyles = exports.FakeMouseEvent = exports.rerenderWrapper = exports.mockElementSizes = exports.fixClicksOnResizablePanes = exports.mockBasicTableSizing = exports.getMuiIconsByName = exports.getMuiIconByName = exports.deepFreeze = exports.awaitMockPromises = exports.TestStylesProvider = exports.TestPerspectivesSettingsProvider = exports.getAttrPathFromColumnId = exports.getAttributeHeight = exports.getNestedPathByColumnId = exports.applyCompactValuesCountConstraint = exports.getAttributeSelectorItems = exports.mergeClasses = exports.isControlOrCommandPressed = exports.getValue = exports.getChecked = exports.showErrorMessage = exports.showDefaultErrorMessage = exports.enrichDataWithPercents = exports.defaultRenderRowCell = exports.defaultGetRowCellHeight = exports.columnFilterToMdmFilter = exports.buildColumnsSizeById = exports.buildColumnsFilter = exports.useSegmentsLoader = exports.useDndBasicTableScrollModifier = exports.useDynamicYAxisWidth = exports.useFilterAutoFocus = exports.useSegmentationRequest = exports.resolveMarkers = exports.useMarkers = exports.useMaskedAttribute = exports.useKeyboardNavigation = exports.useDynamicRowCellHeight = exports.useClickableStyle = exports.BasicTableCellRenderer = exports.useBasicTableCellRenderer = void 0;
|
|
19
|
+
exports.SimpleMatchRulesBuilder = exports.SimpleMatchRulesBlock = exports.SimpleMatchRules = exports.MatchRulesBlock = exports.LoadingSpinner = exports.Link = exports.LinearLoadIndicator = exports.ImportButton = exports.ReadableSearchQueryBuilder = exports.ReadableSearchQuery = exports.LogicOperator = exports.TableSkeleton = exports.StepNavigation = exports.TenantLabel = exports.RelevanceScoreBadge = exports.RequiredMark = exports.SettingsMenu = exports.TenantsDropDownSelector = exports.TenantIcon = exports.SourceSystemsSelector = exports.MatchRulesSelector = exports.MultiValueSelector = exports.ProfilesList = exports.NotMatchButton = exports.MergeButton = exports.ProfileMatchCard = exports.ImageGalleryDialog = exports.RelationTypesSelector = exports.ScreenProfileBand = exports.ProfileBandNavigation = exports.EmptyStub = exports.MaskingSwitcher = exports.FileTypeEditor = exports.EmptySearchResult = exports.DropDownEditor = exports.FilterValueEditor = exports.MultiValueChip = exports.TextEditor = exports.DateRangeEditor = exports.NumberEditor = exports.DataTypeValueEditor = exports.DateEditor = exports.ErrorWrapper = exports.ErrorMessage = exports.HIDE = exports.INSERT_RIGHT = exports.INSERT_LEFT = exports.ConfigColumnPopup = exports.ConfigureColumnsPopup = exports.ConnectionEditor = void 0;
|
|
20
|
+
exports.withDateRangeSelector = exports.withDragHandle = exports.withAsyncMount = exports.withTooltip = exports.DefaultHeadCellRendererWithTooltip = exports.LazyRenderer = exports.MetadataTypesSelector = exports.DateRangeSelector = exports.UpSetChart = exports.GaugeChart = exports.RelationEditor = exports.ReltioMap = exports.Marginator = exports.LightArrowTooltip = exports.ScrollableTabs = exports.VirtualGroupedList = exports.ViewMoreToggle = exports.VerticalHeadingsTable = exports.VerticalDivider = exports.AttributeTitle = exports.Spacer = exports.SimpleDropDownSelector = exports.SidePanelContentHeader = exports.SidePanel = exports.SidePanelEmptyState = exports.SideButtonsPanel = exports.SelectorWithOnlyOptionAutoSelect = exports.SelectionPopup = exports.WhiteSearchInput = exports.SearchInput = exports.ProfileResizablePanes = exports.ResizablePanes = exports.ReltioGridLayout = exports.RCTreeSwitchRenderer = exports.RCTreeLevelLines = exports.RCTree = exports.reactSortableTreeHelpers = exports.ReactSortableTree = exports.MultiSelect = exports.QueryBuilderRowsGroup = exports.QueryBuilderRow = exports.ProfileCard = exports.ProfileBand = exports.PotentialMatchReviewCard = exports.PopupWithArrow = exports.Popper = exports.MultipleInput = exports.ModeSwitcherSelect = exports.ModeSwitcher = exports.TransitiveMatchBlock = void 0;
|
|
21
|
+
exports.isHighlightedAttributeType = exports.isHighlightedErrorType = exports.ScrollType = exports.ScrollToElementProvider = exports.ScrollToElementContext = exports.SearchValueContext = exports.InterceptHandlersContext = exports.HighlightedValuesContext = exports.SnackbarContext = exports.SearchFiltersContext = exports.useReloadFacet = exports.ReloadFacetProvider = exports.useReloadAllFacets = exports.SandboxAPIContext = exports.EntityContext = exports.RelatedObjectUrisContext = exports.WorkflowTasksContext = exports.useEntityLoadingIndication = exports.EntityLoadingIndicationProvider = exports.EntityMarkerContext = exports.useAttributeExpanded = exports.ExpandedAttributesProvider = exports.useHighlightedCrosswalks = exports.useCrosswalkHighlight = exports.useCrosswalkFocus = exports.useCrosswalkColor = exports.CrosswalksDisplayProvider = exports.EntitiesMapContext = exports.IdContext = exports.ProfilePerspectiveViewContext = exports.usePerspectivesSettings = exports.PerspectivesSettingsContext = exports.PivotingAttributeContext = exports.UsersContext = exports.InitialCollaborationContextValue = exports.CollaborationContextProvider = exports.CollaborationContext = exports.BlockNavigationContext = exports.BlockImageGalleryDialogContext = exports.PopupBoundariesContext = exports.HistoryDiffContext = exports.AsyncMountContext = exports.MdmModuleProvider = exports.withColumnConfigurator = exports.withBlockNavigation = exports.withCollapseButton = exports.withTableContext = exports.withFilterAtBottom = exports.withPercents = exports.withContext = void 0;
|
|
22
|
+
exports.useLayoutResetter = exports.useIsMountedRef = exports.useSnackbar = exports.useSavedStateForEntityType = exports.useReadableSearchState = exports.useEditableConnection = exports.useCustomScripts = exports.useMarkAsNotMatchRequest = exports.useMergeAllRequest = exports.usePagingSimulator = exports.useMatchesLoader = exports.useConfigPermissions = exports.useWhyDidYouUpdate = exports.useUsers = exports.useSavedState = exports.useSafePromise = exports.useRunOnceAfterValueInitialization = exports.useRelationsLoader = exports.useRelationTypeSelector = exports.usePrevious = exports.useDidUpdateEffect = exports.useCommentsEntitiesMap = exports.useCollaboration = exports.useAsyncMount = exports.useAPI = exports.useActions = exports.useMatchesColumnsData = exports.useScrollToAttributeError = exports.ThemeProvider = exports.ProfileTablesContext = exports.HiddenAttributesContext = exports.BasicTableContext = exports.BasicTableRowCollapseContext = exports.useDeleteUnmaskedAttributeForRelation = exports.useUnmaskedAttributeValue = exports.useUnmaskAttributeValue = exports.useMaskAttributeValue = exports.MaskedAttributesProvider = exports.useReloadData = exports.ReloadDataProvider = exports.useAttributeValueConfigPermissions = exports.ConfigPermissionsContextProvider = exports.ConfigPermissionsContext = exports.useActionsHook = exports.ActionsHookProvider = exports.PageRequestsAbortingContext = exports.DependentLookupAutopopulationContext = exports.FeaturesContext = exports.LabelsContext = exports.UrlGeneratorsContext = void 0;
|
|
23
|
+
exports.mockComputedStyles = exports.FakeMouseEvent = exports.rerenderWrapper = exports.mockElementSizes = exports.fixClicksOnResizablePanes = exports.mockBasicTableSizing = exports.getMuiIconsByName = exports.getMuiIconByName = exports.deepFreeze = exports.awaitMockPromises = exports.TestStylesProvider = exports.TestPerspectivesSettingsProvider = exports.getAttrPathFromColumnId = exports.getAttributeHeight = exports.getNestedPathByColumnId = exports.applyCompactValuesCountConstraint = exports.getAttributeSelectorItems = exports.mergeClasses = exports.isControlOrCommandPressed = exports.getValue = exports.getChecked = exports.showErrorMessage = exports.showDefaultErrorMessage = exports.enrichDataWithPercents = exports.defaultRenderRowCell = exports.defaultGetRowCellHeight = exports.columnFilterToMdmFilter = exports.buildColumnsSizeById = exports.buildColumnsFilter = exports.useSegmentsLoader = exports.useDndBasicTableScrollModifier = exports.useDynamicYAxisWidth = exports.useFilterAutoFocus = exports.useSegmentationRequest = exports.resolveMarkers = exports.useMarkers = exports.useMaskedAttribute = exports.useKeyboardNavigation = exports.useDynamicRowCellHeight = exports.useClickableStyle = exports.BasicTableCellRenderer = exports.useBasicTableCellRenderer = exports.useHiddenAttributes = exports.useSavedSearchesRequest = exports.useRequestDCRReview = exports.useAutoFocus = exports.useExpandInvalidRelations = void 0;
|
|
24
24
|
// components
|
|
25
25
|
var ActionButton_1 = require("./ActionButton");
|
|
26
26
|
Object.defineProperty(exports, "ActionButton", { enumerable: true, get: function () { return ActionButton_1.ActionButton; } });
|
|
@@ -220,6 +220,11 @@ var ConnectionEditor_1 = require("./ConnectionEditor");
|
|
|
220
220
|
Object.defineProperty(exports, "ConnectionEditor", { enumerable: true, get: function () { return ConnectionEditor_1.ConnectionEditor; } });
|
|
221
221
|
var ConfigureColumnsPopup_1 = require("./ConfigureColumnsPopup");
|
|
222
222
|
Object.defineProperty(exports, "ConfigureColumnsPopup", { enumerable: true, get: function () { return ConfigureColumnsPopup_1.ConfigureColumnsPopup; } });
|
|
223
|
+
var ConfigColumnPopup_1 = require("./ConfigColumnPopup");
|
|
224
|
+
Object.defineProperty(exports, "ConfigColumnPopup", { enumerable: true, get: function () { return ConfigColumnPopup_1.ConfigColumnPopup; } });
|
|
225
|
+
Object.defineProperty(exports, "INSERT_LEFT", { enumerable: true, get: function () { return ConfigColumnPopup_1.INSERT_LEFT; } });
|
|
226
|
+
Object.defineProperty(exports, "INSERT_RIGHT", { enumerable: true, get: function () { return ConfigColumnPopup_1.INSERT_RIGHT; } });
|
|
227
|
+
Object.defineProperty(exports, "HIDE", { enumerable: true, get: function () { return ConfigColumnPopup_1.HIDE; } });
|
|
223
228
|
var ErrorMessage_1 = require("./ErrorMessage");
|
|
224
229
|
Object.defineProperty(exports, "ErrorMessage", { enumerable: true, get: function () { return ErrorMessage_1.ErrorMessage; } });
|
|
225
230
|
var ErrorWrapper_1 = require("./ErrorWrapper");
|
|
@@ -418,6 +423,8 @@ var withCollapseButton_1 = require("./HOCs/withCollapseButton");
|
|
|
418
423
|
Object.defineProperty(exports, "withCollapseButton", { enumerable: true, get: function () { return withCollapseButton_1.withCollapseButton; } });
|
|
419
424
|
var withBlockNavigation_1 = require("./HOCs/withBlockNavigation");
|
|
420
425
|
Object.defineProperty(exports, "withBlockNavigation", { enumerable: true, get: function () { return withBlockNavigation_1.withBlockNavigation; } });
|
|
426
|
+
var withColumnConfigurator_1 = require("./HOCs/withColumnConfigurator");
|
|
427
|
+
Object.defineProperty(exports, "withColumnConfigurator", { enumerable: true, get: function () { return withColumnConfigurator_1.withColumnConfigurator; } });
|
|
421
428
|
// contexts
|
|
422
429
|
var MdmModuleContext_1 = require("./contexts/MdmModuleContext");
|
|
423
430
|
Object.defineProperty(exports, "MdmModuleProvider", { enumerable: true, get: function () { return MdmModuleContext_1.MdmModuleProvider; } });
|
package/index.d.ts
CHANGED
|
@@ -94,6 +94,7 @@ export { ReactSelectOptionWithCheckIcon } from './ReactSelectOptionWithCheckIcon
|
|
|
94
94
|
export { DropDownSelector } from './DropDownSelector';
|
|
95
95
|
export { ConnectionEditor } from './ConnectionEditor';
|
|
96
96
|
export { ConfigureColumnsPopup } from './ConfigureColumnsPopup';
|
|
97
|
+
export { ConfigColumnPopup, INSERT_LEFT, INSERT_RIGHT, HIDE } from './ConfigColumnPopup';
|
|
97
98
|
export { ErrorMessage } from './ErrorMessage';
|
|
98
99
|
export { ErrorWrapper } from './ErrorWrapper';
|
|
99
100
|
export { DateEditor } from './DateEditor';
|
|
@@ -192,6 +193,7 @@ export { withFilterAtBottom } from './HOCs/withFilterAtBottom';
|
|
|
192
193
|
export { withTableContext } from './HOCs/withTableContext';
|
|
193
194
|
export { withCollapseButton } from './HOCs/withCollapseButton';
|
|
194
195
|
export { withBlockNavigation } from './HOCs/withBlockNavigation';
|
|
196
|
+
export { withColumnConfigurator } from './HOCs/withColumnConfigurator';
|
|
195
197
|
export { MdmModuleProvider } from './contexts/MdmModuleContext';
|
|
196
198
|
export { AsyncMountContext } from './contexts/AsyncMountContext';
|
|
197
199
|
export { HistoryDiffContext } from './contexts/HistoryAppearanceContext';
|
package/index.js
CHANGED
|
@@ -95,6 +95,7 @@ export { ReactSelectOptionWithCheckIcon } from './ReactSelectOptionWithCheckIcon
|
|
|
95
95
|
export { DropDownSelector } from './DropDownSelector';
|
|
96
96
|
export { ConnectionEditor } from './ConnectionEditor';
|
|
97
97
|
export { ConfigureColumnsPopup } from './ConfigureColumnsPopup';
|
|
98
|
+
export { ConfigColumnPopup, INSERT_LEFT, INSERT_RIGHT, HIDE } from './ConfigColumnPopup';
|
|
98
99
|
export { ErrorMessage } from './ErrorMessage';
|
|
99
100
|
export { ErrorWrapper } from './ErrorWrapper';
|
|
100
101
|
export { DateEditor } from './DateEditor';
|
|
@@ -193,6 +194,7 @@ export { withFilterAtBottom } from './HOCs/withFilterAtBottom';
|
|
|
193
194
|
export { withTableContext } from './HOCs/withTableContext';
|
|
194
195
|
export { withCollapseButton } from './HOCs/withCollapseButton';
|
|
195
196
|
export { withBlockNavigation } from './HOCs/withBlockNavigation';
|
|
197
|
+
export { withColumnConfigurator } from './HOCs/withColumnConfigurator';
|
|
196
198
|
// contexts
|
|
197
199
|
export { MdmModuleProvider } from './contexts/MdmModuleContext';
|
|
198
200
|
export { AsyncMountContext } from './contexts/AsyncMountContext';
|