@reltio/components 1.4.845 → 1.4.846

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.
Files changed (68) hide show
  1. package/components/AttributeSelector/AttributeSelector.d.ts +14 -0
  2. package/components/{activityLog/ActivityFilterEditor → AttributeSelector}/AttributeSelector.js +10 -10
  3. package/components/AttributeSelector/styles.d.ts +4 -0
  4. package/components/AttributeSelector/styles.js +41 -0
  5. package/components/DateIntervalSelector/DateIntervalSelector.d.ts +8 -0
  6. package/components/{activityLog/ActivityFilterEditor/IntervalSelector.js → DateIntervalSelector/DateIntervalSelector.js} +8 -17
  7. package/components/DateIntervalSelector/styles.d.ts +1 -0
  8. package/components/DateIntervalSelector/styles.js +25 -0
  9. package/components/DateRangePicker/styles.d.ts +1 -1
  10. package/components/ImageGalleryDialog/styles.d.ts +1 -1
  11. package/components/UploadImageDialog/ImageByUrlField/styles.d.ts +1 -1
  12. package/components/UserSelector/UserSelector.d.ts +9 -0
  13. package/components/{activityLog/ActivityFilterEditor → UserSelector}/UserSelector.js +6 -6
  14. package/components/UserSelector/styles.d.ts +5 -0
  15. package/components/UserSelector/styles.js +39 -0
  16. package/components/activityLog/ActivityFilterEditor/ActivityFilterEditor.js +4 -4
  17. package/components/activityLog/ActivityFilterEditor/DateRangeSelector.d.ts +3 -3
  18. package/components/activityLog/ActivityFilterEditor/DateRangeSelector.js +6 -6
  19. package/components/activityLog/ActivityFilterEditor/styles.d.ts +1 -1
  20. package/components/activityLog/ActivityFilterEditor/styles.js +3 -32
  21. package/components/activityLog/ActivityLogFilter/helpers.js +1 -1
  22. package/components/activityLog/types/ActivitiesFilter.d.ts +2 -7
  23. package/components/activityLog/types/index.d.ts +1 -3
  24. package/components/activityLog/types/index.js +1 -3
  25. package/components/activityLog/utils/filters.d.ts +2 -2
  26. package/components/activityLog/utils/filters.js +1 -1
  27. package/components/attributes/inline/SimpleAttributeEditor/styles.d.ts +1 -1
  28. package/components/{activityLog/ActivityFilterEditor/ActivityDateRangeEditor.d.ts → editors/CustomDateRangeEditor/CustomDateRangeEditor.d.ts} +3 -3
  29. package/components/{activityLog/ActivityFilterEditor/ActivityDateRangeEditor.js → editors/CustomDateRangeEditor/CustomDateRangeEditor.js} +6 -5
  30. package/components/editors/CustomDateRangeEditor/styles.d.ts +1 -0
  31. package/components/editors/CustomDateRangeEditor/styles.js +25 -0
  32. package/components/editors/DateRangeEditor/styles.d.ts +1 -1
  33. package/components/history/DateRangeSelector/DateRangeSelector.d.ts +9 -0
  34. package/components/history/DateRangeSelector/DateRangeSelector.js +91 -0
  35. package/components/history/DateRangeSelector/styles.d.ts +1 -0
  36. package/components/history/DateRangeSelector/styles.js +22 -0
  37. package/components/history/DateRangeSelector/utils.d.ts +3 -0
  38. package/components/history/DateRangeSelector/utils.js +19 -0
  39. package/components/history/HistoryActivitySelector/HistoryActivitySelector.d.ts +9 -0
  40. package/components/history/HistoryActivitySelector/HistoryActivitySelector.js +27 -0
  41. package/components/history/HistoryActivitySelector/styles.d.ts +4 -0
  42. package/components/history/HistoryActivitySelector/styles.js +42 -0
  43. package/components/history/HistoryActivitySelector/utils.d.ts +3 -0
  44. package/components/history/HistoryActivitySelector/utils.js +23 -0
  45. package/components/history/HistoryFilterButton/HistoryFilterButton.d.ts +10 -0
  46. package/components/history/HistoryFilterButton/HistoryFilterButton.js +87 -0
  47. package/components/history/HistoryFilterButton/styles.d.ts +1 -1
  48. package/components/history/HistoryFilterButton/styles.js +26 -0
  49. package/components/history/HistoryHeader/HistoryHeader.d.ts +6 -1
  50. package/components/history/HistoryHeader/HistoryHeader.js +3 -3
  51. package/components/history/index.d.ts +2 -1
  52. package/components/history/index.js +13 -2
  53. package/components/history/types/HistoryFilter.d.ts +12 -0
  54. package/components/history/types/HistoryFilter.js +9 -0
  55. package/components/history/types/index.d.ts +2 -0
  56. package/components/history/types/index.js +5 -0
  57. package/package.json +3 -3
  58. package/types/index.d.ts +17 -0
  59. package/types/index.js +7 -0
  60. package/components/activityLog/ActivityFilterEditor/AttributeSelector.d.ts +0 -10
  61. package/components/activityLog/ActivityFilterEditor/IntervalSelector.d.ts +0 -8
  62. package/components/activityLog/ActivityFilterEditor/UserSelector.d.ts +0 -7
  63. package/components/activityLog/types/AttributeOption.d.ts +0 -8
  64. package/components/activityLog/types/AttributeOption.js +0 -2
  65. package/components/activityLog/types/DateRangeTypes.d.ts +0 -5
  66. package/components/activityLog/types/DateRangeTypes.js +0 -9
  67. package/components/history/HistoryFilterButton/HistoryFilterBitton.d.ts +0 -3
  68. package/components/history/HistoryFilterButton/HistoryFilterBitton.js +0 -14
@@ -0,0 +1,9 @@
1
+ /// <reference types="react" />
2
+ import { DateRangeFilter } from '../../../types';
3
+ declare type Props = {
4
+ value: DateRangeFilter;
5
+ onChange: (range: DateRangeFilter) => void;
6
+ className?: string;
7
+ };
8
+ declare const DateRangeSelector: ({ value, onChange, className }: Props) => JSX.Element;
9
+ export default DateRangeSelector;
@@ -0,0 +1,91 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
5
+ }) : (function(o, m, k, k2) {
6
+ if (k2 === undefined) k2 = k;
7
+ o[k2] = m[k];
8
+ }));
9
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
10
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
11
+ }) : function(o, v) {
12
+ o["default"] = v;
13
+ });
14
+ var __importStar = (this && this.__importStar) || function (mod) {
15
+ if (mod && mod.__esModule) return mod;
16
+ var result = {};
17
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
18
+ __setModuleDefault(result, mod);
19
+ return result;
20
+ };
21
+ var __importDefault = (this && this.__importDefault) || function (mod) {
22
+ return (mod && mod.__esModule) ? mod : { "default": mod };
23
+ };
24
+ Object.defineProperty(exports, "__esModule", { value: true });
25
+ var react_1 = __importStar(require("react"));
26
+ var ui_i18n_1 = __importDefault(require("ui-i18n"));
27
+ var classnames_1 = __importDefault(require("classnames"));
28
+ var Typography_1 = __importDefault(require("@material-ui/core/Typography"));
29
+ var SimpleDropDownSelector_1 = __importDefault(require("../../SimpleDropDownSelector/SimpleDropDownSelector"));
30
+ var utils_1 = require("./utils");
31
+ var DateIntervalSelector_1 = __importDefault(require("../../DateIntervalSelector/DateIntervalSelector"));
32
+ var hooks_1 = require("../../../hooks");
33
+ var CustomDateRangeEditor_1 = __importDefault(require("../../editors/CustomDateRangeEditor/CustomDateRangeEditor"));
34
+ var types_1 = require("../../../types");
35
+ var styles_1 = require("./styles");
36
+ var emptyDates = [null, null];
37
+ var emptyInterval = [null, 'hours'];
38
+ var DateRangeSelector = function (_a) {
39
+ var value = _a.value, onChange = _a.onChange, className = _a.className;
40
+ var styles = styles_1.useStyles();
41
+ var isIntervalType = function (type) { return type === types_1.DateRangeTypes.WITHIN || type === types_1.DateRangeTypes.AGO; };
42
+ var isBetweenType = function (type) { return type === types_1.DateRangeTypes.BETWEEN; };
43
+ var initDatesInterval = isBetweenType(value === null || value === void 0 ? void 0 : value.type) ? value.period : emptyDates;
44
+ var initInterval = isIntervalType(value === null || value === void 0 ? void 0 : value.type) ? value.period : emptyInterval;
45
+ var _b = react_1.useState(initDatesInterval), datesInterval = _b[0], setDatesInterval = _b[1];
46
+ var _c = react_1.useState(initInterval), interval = _c[0], setInterval = _c[1];
47
+ var selectedType = (value === null || value === void 0 ? void 0 : value.type) || types_1.DateRangeTypes.WITHIN;
48
+ var getCurrentPeriodByType = function (type) {
49
+ if (isIntervalType(type)) {
50
+ return interval;
51
+ }
52
+ else if (isBetweenType(type)) {
53
+ return datesInterval;
54
+ }
55
+ };
56
+ var changeType = function (_a) {
57
+ var type = _a.value;
58
+ if ((value === null || value === void 0 ? void 0 : value.type) !== type) {
59
+ onChange({ period: getCurrentPeriodByType(type), type: type });
60
+ }
61
+ };
62
+ var changePeriod = function (period) {
63
+ onChange({ type: selectedType, period: period });
64
+ };
65
+ hooks_1.useDidUpdateEffect(function () {
66
+ if (value) {
67
+ if (isIntervalType(value.type)) {
68
+ setInterval(value.period);
69
+ }
70
+ else if (isBetweenType(value.type)) {
71
+ setDatesInterval(value.period);
72
+ }
73
+ }
74
+ else {
75
+ setDatesInterval(emptyDates);
76
+ setInterval(emptyInterval);
77
+ }
78
+ }, [value]);
79
+ return (react_1.default.createElement("div", { className: classnames_1.default(styles.root, className) },
80
+ react_1.default.createElement(Typography_1.default, { className: styles.title, variant: 'subtitle1' }, ui_i18n_1.default.text('Date')),
81
+ react_1.default.createElement("div", { className: styles.intervalContainer },
82
+ react_1.default.createElement(SimpleDropDownSelector_1.default, { label: '', className: styles.typeInput, value: {
83
+ value: selectedType,
84
+ label: utils_1.getDateRangeTypeLabel(selectedType)
85
+ }, options: utils_1.dateRangeTypeOptions.map(function (option) { return ({
86
+ value: option,
87
+ label: utils_1.getDateRangeTypeLabel(option)
88
+ }); }), onChange: changeType }),
89
+ isIntervalType(selectedType) ? (react_1.default.createElement(DateIntervalSelector_1.default, { interval: interval, onChange: changePeriod })) : (react_1.default.createElement(CustomDateRangeEditor_1.default, { values: datesInterval, onChange: changePeriod })))));
90
+ };
91
+ exports.default = DateRangeSelector;
@@ -0,0 +1 @@
1
+ export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"title" | "root" | "intervalContainer" | "typeInput">;
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useStyles = void 0;
4
+ var styles_1 = require("@material-ui/core/styles");
5
+ exports.useStyles = styles_1.makeStyles({
6
+ root: {
7
+ flex: 1
8
+ },
9
+ title: {
10
+ paddingBottom: '10px',
11
+ paddingLeft: '5px',
12
+ fontSize: '14px'
13
+ },
14
+ intervalContainer: {
15
+ display: 'flex',
16
+ justifyContent: 'space-between'
17
+ },
18
+ typeInput: {
19
+ width: 160,
20
+ marginRight: 10
21
+ }
22
+ });
@@ -0,0 +1,3 @@
1
+ import { DateRangeTypes } from '../../../types';
2
+ export declare const dateRangeTypeOptions: DateRangeTypes[];
3
+ export declare const getDateRangeTypeLabel: (type: DateRangeTypes) => string;
@@ -0,0 +1,19 @@
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.getDateRangeTypeLabel = exports.dateRangeTypeOptions = void 0;
7
+ var ui_i18n_1 = __importDefault(require("ui-i18n"));
8
+ var types_1 = require("../../../types");
9
+ exports.dateRangeTypeOptions = [types_1.DateRangeTypes.WITHIN, types_1.DateRangeTypes.AGO, types_1.DateRangeTypes.BETWEEN];
10
+ var getDateRangeTypeLabel = function (type) {
11
+ var _a;
12
+ var labels = (_a = {},
13
+ _a[types_1.DateRangeTypes.WITHIN] = ui_i18n_1.default.text('Within the last'),
14
+ _a[types_1.DateRangeTypes.AGO] = ui_i18n_1.default.text('More than'),
15
+ _a[types_1.DateRangeTypes.BETWEEN] = ui_i18n_1.default.text('Date range'),
16
+ _a);
17
+ return labels[type] || '';
18
+ };
19
+ exports.getDateRangeTypeLabel = getDateRangeTypeLabel;
@@ -0,0 +1,9 @@
1
+ /// <reference types="react" />
2
+ import { HistoryActivityType } from '../types/HistoryFilter';
3
+ declare type Props = {
4
+ selectedHistoryActivityTypes: HistoryActivityType[];
5
+ onChange: (activities: HistoryActivityType[]) => void;
6
+ className?: string;
7
+ };
8
+ declare const HistoryActivitySelector: ({ selectedHistoryActivityTypes, onChange, className }: Props) => JSX.Element;
9
+ export default HistoryActivitySelector;
@@ -0,0 +1,27 @@
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
+ var react_1 = __importDefault(require("react"));
7
+ var ui_i18n_1 = __importDefault(require("ui-i18n"));
8
+ var ramda_1 = require("ramda");
9
+ var classnames_1 = __importDefault(require("classnames"));
10
+ var Typography_1 = __importDefault(require("@material-ui/core/Typography"));
11
+ var MultiSelect_1 = __importDefault(require("../../ReactSelect/MultiSelect"));
12
+ var DropdownIndicatorWithIconButton_1 = __importDefault(require("../../commonReactSelectComponents/DropdownIndicatorWithIconButton"));
13
+ var utils_1 = require("./utils");
14
+ var styles_1 = require("./styles");
15
+ var HistoryActivitySelector = function (_a) {
16
+ var selectedHistoryActivityTypes = _a.selectedHistoryActivityTypes, onChange = _a.onChange, className = _a.className;
17
+ var styles = styles_1.useStyles();
18
+ var valueToOption = function (value) { return ({ value: value, label: utils_1.getHistoryActivityLabel(value) }); };
19
+ var prepareValues = function (values) { return values.map(valueToOption); };
20
+ var options = prepareValues(utils_1.historyActivityOptions);
21
+ return (react_1.default.createElement("div", { className: classnames_1.default(styles.root, className) },
22
+ react_1.default.createElement(Typography_1.default, { className: styles.title, variant: 'subtitle1' }, ui_i18n_1.default.text('Activity')),
23
+ react_1.default.createElement(MultiSelect_1.default, { value: prepareValues(selectedHistoryActivityTypes), onChange: ramda_1.pipe(ramda_1.defaultTo([]), ramda_1.pluck('value'), onChange), options: options, TextFieldProps: { classes: { root: styles.dropDownInput } }, components: {
24
+ DropdownIndicator: DropdownIndicatorWithIconButton_1.default
25
+ }, styles: styles_1.customStyles, classes: styles, menuPlacement: "bottom" })));
26
+ };
27
+ exports.default = HistoryActivitySelector;
@@ -0,0 +1,4 @@
1
+ export declare const customStyles: {
2
+ input: (currentStyles: any) => any;
3
+ };
4
+ export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"option" | "title" | "root" | "dropDownInput" | "valueContainer">;
@@ -0,0 +1,42 @@
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.useStyles = exports.customStyles = void 0;
15
+ var styles_1 = require("@material-ui/core/styles");
16
+ exports.customStyles = {
17
+ input: function (currentStyles) { return (__assign(__assign({}, currentStyles), { fontSize: '14px' })); }
18
+ };
19
+ exports.useStyles = styles_1.makeStyles({
20
+ root: {
21
+ flex: 1
22
+ },
23
+ title: {
24
+ paddingBottom: '10px',
25
+ paddingLeft: '5px',
26
+ fontSize: '14px'
27
+ },
28
+ dropDownInput: {
29
+ width: '100%',
30
+ justifyContent: 'center',
31
+ backgroundColor: 'rgba(0, 0, 0, 0.03)',
32
+ borderTop: '4px'
33
+ },
34
+ valueContainer: {
35
+ overflowY: 'auto',
36
+ height: 44
37
+ },
38
+ option: {
39
+ fontSize: '14px',
40
+ height: '32px'
41
+ }
42
+ });
@@ -0,0 +1,3 @@
1
+ import { HistoryActivityType } from '../types/HistoryFilter';
2
+ export declare const historyActivityOptions: HistoryActivityType[];
3
+ export declare const getHistoryActivityLabel: (type: HistoryActivityType) => string;
@@ -0,0 +1,23 @@
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.getHistoryActivityLabel = exports.historyActivityOptions = void 0;
7
+ var ui_i18n_1 = __importDefault(require("ui-i18n"));
8
+ var HistoryFilter_1 = require("../types/HistoryFilter");
9
+ exports.historyActivityOptions = [
10
+ HistoryFilter_1.HistoryActivityType.UPDATE,
11
+ HistoryFilter_1.HistoryActivityType.MERGE,
12
+ HistoryFilter_1.HistoryActivityType.UNMERGE
13
+ ];
14
+ var getHistoryActivityLabel = function (type) {
15
+ var _a;
16
+ var labels = (_a = {},
17
+ _a[HistoryFilter_1.HistoryActivityType.UPDATE] = ui_i18n_1.default.text('Update'),
18
+ _a[HistoryFilter_1.HistoryActivityType.MERGE] = ui_i18n_1.default.text('Merge'),
19
+ _a[HistoryFilter_1.HistoryActivityType.UNMERGE] = ui_i18n_1.default.text('Unmerge'),
20
+ _a);
21
+ return labels[type] || '';
22
+ };
23
+ exports.getHistoryActivityLabel = getHistoryActivityLabel;
@@ -0,0 +1,10 @@
1
+ /// <reference types="react" />
2
+ import { TEntityType } from '@reltio/mdm-sdk';
3
+ import { HistoryFilter } from '../types';
4
+ declare type Props = {
5
+ filter: HistoryFilter;
6
+ onApplyFilter: (filter: HistoryFilter) => void;
7
+ entityType: TEntityType;
8
+ };
9
+ declare const HistoryFilterButton: ({ filter, onApplyFilter, entityType }: Props) => JSX.Element;
10
+ export default HistoryFilterButton;
@@ -0,0 +1,87 @@
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
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
16
+ }) : (function(o, m, k, k2) {
17
+ if (k2 === undefined) k2 = k;
18
+ o[k2] = m[k];
19
+ }));
20
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
21
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
22
+ }) : function(o, v) {
23
+ o["default"] = v;
24
+ });
25
+ var __importStar = (this && this.__importStar) || function (mod) {
26
+ if (mod && mod.__esModule) return mod;
27
+ var result = {};
28
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
29
+ __setModuleDefault(result, mod);
30
+ return result;
31
+ };
32
+ var __importDefault = (this && this.__importDefault) || function (mod) {
33
+ return (mod && mod.__esModule) ? mod : { "default": mod };
34
+ };
35
+ Object.defineProperty(exports, "__esModule", { value: true });
36
+ var react_1 = __importStar(require("react"));
37
+ var ui_i18n_1 = __importDefault(require("ui-i18n"));
38
+ var ramda_1 = require("ramda");
39
+ var FilterList_1 = __importDefault(require("@material-ui/icons/FilterList"));
40
+ var Button_1 = __importDefault(require("@material-ui/core/Button"));
41
+ var Popover_1 = __importDefault(require("@material-ui/core/Popover"));
42
+ var Typography_1 = __importDefault(require("@material-ui/core/Typography"));
43
+ var SmallIconButton_1 = require("../../SmallIconButton");
44
+ var UserSelector_1 = __importDefault(require("../../UserSelector/UserSelector"));
45
+ var AttributeSelector_1 = __importDefault(require("../../AttributeSelector/AttributeSelector"));
46
+ var DateRangeSelector_1 = __importDefault(require("../DateRangeSelector/DateRangeSelector"));
47
+ var HistoryActivitySelector_1 = __importDefault(require("../HistoryActivitySelector/HistoryActivitySelector"));
48
+ var styles_1 = require("./styles");
49
+ var HistoryFilterButton = function (_a) {
50
+ var filter = _a.filter, onApplyFilter = _a.onApplyFilter, entityType = _a.entityType;
51
+ var styles = styles_1.useStyles();
52
+ var _b = react_1.useState(null), anchorEl = _b[0], setAnchorEl = _b[1];
53
+ var openPopup = function (event) { return setAnchorEl(event.currentTarget); };
54
+ var closePopup = function () { return setAnchorEl(null); };
55
+ var _c = react_1.useState(filter), currentValue = _c[0], setCurrentValue = _c[1];
56
+ var clearCurrentValue = function () { return setCurrentValue(null); };
57
+ var handlePropChange = ramda_1.curry(function (propName, value) {
58
+ setCurrentValue(function (filterValue) {
59
+ var _a;
60
+ return (__assign(__assign({}, filterValue), (_a = {}, _a[propName] = value, _a)));
61
+ });
62
+ });
63
+ var _d = currentValue || {}, _e = _d.activities, activities = _e === void 0 ? [] : _e, _f = _d.attributes, attributes = _f === void 0 ? [] : _f, _g = _d.dateRange, dateRange = _g === void 0 ? null : _g, _h = _d.users, users = _h === void 0 ? [] : _h;
64
+ return (react_1.default.createElement(react_1.default.Fragment, null,
65
+ react_1.default.createElement(SmallIconButton_1.SmallIconButton, { icon: FilterList_1.default, size: "XS", onClick: openPopup, className: styles.icon }),
66
+ react_1.default.createElement(Popover_1.default, { classes: { paper: styles.popup }, open: !!anchorEl, anchorEl: anchorEl, onClose: closePopup, anchorOrigin: {
67
+ vertical: 'bottom',
68
+ horizontal: 'right'
69
+ }, transformOrigin: {
70
+ vertical: 'top',
71
+ horizontal: 'right'
72
+ } },
73
+ react_1.default.createElement("div", { className: styles.filterContainer },
74
+ react_1.default.createElement(Typography_1.default, { variant: "h6" }, ui_i18n_1.default.text('Filter')),
75
+ react_1.default.createElement(DateRangeSelector_1.default, { value: dateRange, onChange: handlePropChange('dateRange'), className: styles.filterItem }),
76
+ react_1.default.createElement(UserSelector_1.default, { selectedUsers: users, onChange: handlePropChange('users'), className: styles.filterItem }),
77
+ react_1.default.createElement(HistoryActivitySelector_1.default, { selectedHistoryActivityTypes: activities, onChange: handlePropChange('activities'), className: styles.filterItem }),
78
+ react_1.default.createElement(AttributeSelector_1.default, { selectedAttributes: attributes, entityType: entityType, onChange: handlePropChange('attributes'), className: styles.filterItem, title: ui_i18n_1.default.text('Attribute updated'), menuPlacement: "top" })),
79
+ react_1.default.createElement("div", { className: styles.filterControls },
80
+ react_1.default.createElement(Button_1.default, { onClick: clearCurrentValue, className: styles.clearButton }, ui_i18n_1.default.text('Clear all')),
81
+ react_1.default.createElement(Button_1.default, { onClick: closePopup }, ui_i18n_1.default.text('Cancel')),
82
+ react_1.default.createElement(Button_1.default, { color: "primary", onClick: function () {
83
+ onApplyFilter(currentValue);
84
+ closePopup();
85
+ } }, ui_i18n_1.default.text('Apply'))))));
86
+ };
87
+ exports.default = HistoryFilterButton;
@@ -1 +1 @@
1
- export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"icon">;
1
+ export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"icon" | "input" | "popup" | "filterControls" | "clearButton" | "filterContainer" | "filterItem">;
@@ -5,5 +5,31 @@ var styles_1 = require("@material-ui/core/styles");
5
5
  exports.useStyles = styles_1.makeStyles({
6
6
  icon: {
7
7
  margin: 5
8
+ },
9
+ popup: {
10
+ width: 500,
11
+ height: 500,
12
+ overflowY: 'hidden'
13
+ },
14
+ filterContainer: {
15
+ padding: 20,
16
+ height: 410,
17
+ overflowY: 'auto'
18
+ },
19
+ filterItem: {
20
+ marginTop: 15
21
+ },
22
+ filterControls: {
23
+ display: 'flex',
24
+ padding: '10px 12px 0',
25
+ borderTop: 'solid 1px rgba(0, 0, 0, 0.12)'
26
+ },
27
+ clearButton: {
28
+ marginRight: 'auto'
29
+ },
30
+ input: {
31
+ height: '100%',
32
+ paddingLeft: '12px',
33
+ paddingRight: '8px'
8
34
  }
9
35
  });
@@ -1,6 +1,11 @@
1
1
  /// <reference types="react" />
2
+ import { TEntityType } from '@reltio/mdm-sdk';
3
+ import { HistoryFilter } from '../types';
2
4
  declare type Props = {
3
5
  total: number;
6
+ entityType: TEntityType;
7
+ filter: HistoryFilter;
8
+ onApplyFilter: (value: HistoryFilter) => void;
4
9
  };
5
- declare const HistoryHeader: ({ total }: Props) => JSX.Element;
10
+ declare const HistoryHeader: ({ total, entityType, filter, onApplyFilter }: Props) => JSX.Element;
6
11
  export default HistoryHeader;
@@ -9,11 +9,11 @@ var Divider_1 = __importDefault(require("@material-ui/core/Divider"));
9
9
  var Typography_1 = __importDefault(require("@material-ui/core/Typography"));
10
10
  var ramda_1 = require("ramda");
11
11
  var Spacer_1 = __importDefault(require("../../Spacer/Spacer"));
12
- var HistoryFilterBitton_1 = __importDefault(require("../HistoryFilterButton/HistoryFilterBitton"));
12
+ var HistoryFilterButton_1 = __importDefault(require("../HistoryFilterButton/HistoryFilterButton"));
13
13
  var HistoryMenuButton_1 = __importDefault(require("../HistoryMenuButton/HistoryMenuButton"));
14
14
  var styles_1 = require("./styles");
15
15
  var HistoryHeader = function (_a) {
16
- var total = _a.total;
16
+ var total = _a.total, entityType = _a.entityType, filter = _a.filter, onApplyFilter = _a.onApplyFilter;
17
17
  var styles = styles_1.useStyles();
18
18
  return (react_1.default.createElement("div", { className: styles.root },
19
19
  react_1.default.createElement(Typography_1.default, { variant: "h6" }, ui_i18n_1.default.text('History')),
@@ -22,7 +22,7 @@ var HistoryHeader = function (_a) {
22
22
  ? ui_i18n_1.default.text('${count} contributing profile', { count: total })
23
23
  : ui_i18n_1.default.text('${count} contributing profiles', { count: total }))),
24
24
  react_1.default.createElement(Spacer_1.default, null),
25
- react_1.default.createElement(HistoryFilterBitton_1.default, null),
25
+ react_1.default.createElement(HistoryFilterButton_1.default, { entityType: entityType, filter: filter, onApplyFilter: onApplyFilter }),
26
26
  react_1.default.createElement(HistoryMenuButton_1.default, null)));
27
27
  };
28
28
  exports.default = HistoryHeader;
@@ -2,5 +2,6 @@ export { useHistoricUris } from './hooks/useHistoricUris';
2
2
  export { useHistoryWithTotal } from './hooks/useHistoryWithTotal';
3
3
  export { default as HistoryView } from './HistoryView/HistoryView';
4
4
  export { default as HistoryHeader } from './HistoryHeader/HistoryHeader';
5
- export { default as HistoryFilterButton } from './HistoryFilterButton/HistoryFilterBitton';
5
+ export { default as HistoryFilterButton } from './HistoryFilterButton/HistoryFilterButton';
6
6
  export { default as HistoryMenuButton } from './HistoryMenuButton/HistoryMenuButton';
7
+ export * from './types';
@@ -1,4 +1,14 @@
1
1
  "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
5
+ }) : (function(o, m, k, k2) {
6
+ if (k2 === undefined) k2 = k;
7
+ o[k2] = m[k];
8
+ }));
9
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
11
+ };
2
12
  var __importDefault = (this && this.__importDefault) || function (mod) {
3
13
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
14
  };
@@ -12,7 +22,8 @@ var HistoryView_1 = require("./HistoryView/HistoryView");
12
22
  Object.defineProperty(exports, "HistoryView", { enumerable: true, get: function () { return __importDefault(HistoryView_1).default; } });
13
23
  var HistoryHeader_1 = require("./HistoryHeader/HistoryHeader");
14
24
  Object.defineProperty(exports, "HistoryHeader", { enumerable: true, get: function () { return __importDefault(HistoryHeader_1).default; } });
15
- var HistoryFilterBitton_1 = require("./HistoryFilterButton/HistoryFilterBitton");
16
- Object.defineProperty(exports, "HistoryFilterButton", { enumerable: true, get: function () { return __importDefault(HistoryFilterBitton_1).default; } });
25
+ var HistoryFilterButton_1 = require("./HistoryFilterButton/HistoryFilterButton");
26
+ Object.defineProperty(exports, "HistoryFilterButton", { enumerable: true, get: function () { return __importDefault(HistoryFilterButton_1).default; } });
17
27
  var HistoryMenuButton_1 = require("./HistoryMenuButton/HistoryMenuButton");
18
28
  Object.defineProperty(exports, "HistoryMenuButton", { enumerable: true, get: function () { return __importDefault(HistoryMenuButton_1).default; } });
29
+ __exportStar(require("./types"), exports);
@@ -0,0 +1,12 @@
1
+ import { AttributeOption, DateRangeFilter } from '../../../types';
2
+ export declare enum HistoryActivityType {
3
+ UPDATE = "UPDATE",
4
+ MERGE = "MERGE",
5
+ UNMERGE = "UNMERGE"
6
+ }
7
+ export declare type HistoryFilter = {
8
+ dateRange?: DateRangeFilter;
9
+ users?: string[];
10
+ activities?: HistoryActivityType[];
11
+ attributes?: AttributeOption[];
12
+ };
@@ -0,0 +1,9 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.HistoryActivityType = void 0;
4
+ var HistoryActivityType;
5
+ (function (HistoryActivityType) {
6
+ HistoryActivityType["UPDATE"] = "UPDATE";
7
+ HistoryActivityType["MERGE"] = "MERGE";
8
+ HistoryActivityType["UNMERGE"] = "UNMERGE";
9
+ })(HistoryActivityType = exports.HistoryActivityType || (exports.HistoryActivityType = {}));
@@ -0,0 +1,2 @@
1
+ export type { HistoryFilter } from './HistoryFilter';
2
+ export { HistoryActivityType } from './HistoryFilter';
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.HistoryActivityType = void 0;
4
+ var HistoryFilter_1 = require("./HistoryFilter");
5
+ Object.defineProperty(exports, "HistoryActivityType", { enumerable: true, get: function () { return HistoryFilter_1.HistoryActivityType; } });
package/package.json CHANGED
@@ -1,13 +1,13 @@
1
1
  {
2
2
  "name": "@reltio/components",
3
- "version": "1.4.845",
3
+ "version": "1.4.846",
4
4
  "license": "SEE LICENSE IN LICENSE FILE",
5
5
  "main": "index.js",
6
6
  "dependencies": {
7
7
  "@date-io/moment": "^1.3.5",
8
8
  "@react-google-maps/api": "^2.7.0",
9
- "@reltio/mdm-module": "^1.4.845",
10
- "@reltio/mdm-sdk": "^1.4.845",
9
+ "@reltio/mdm-module": "^1.4.846",
10
+ "@reltio/mdm-sdk": "^1.4.846",
11
11
  "classnames": "^2.2.5",
12
12
  "frontend-collective-react-dnd-scrollzone": "^1.0.2",
13
13
  "nanoid": "^2.0.0",
package/types/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import { AttributeType } from '@reltio/mdm-sdk';
1
2
  export declare type ReactGridLayoutItem = {
2
3
  i: string;
3
4
  x: number;
@@ -23,3 +24,19 @@ export declare type ReltioGridLayoutItem = {
23
24
  isStatic?: boolean;
24
25
  autosizing?: boolean;
25
26
  };
27
+ export declare type AttributeOption = {
28
+ label: string;
29
+ value: string;
30
+ attrType: AttributeType;
31
+ chipLabel: string;
32
+ level: number;
33
+ };
34
+ export declare enum DateRangeTypes {
35
+ WITHIN = "within",
36
+ AGO = "ago",
37
+ BETWEEN = "between"
38
+ }
39
+ export declare type DateRangeFilter = {
40
+ type: DateRangeTypes;
41
+ period: [number, string] | [Date, Date];
42
+ };
package/types/index.js CHANGED
@@ -1,2 +1,9 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.DateRangeTypes = void 0;
4
+ var DateRangeTypes;
5
+ (function (DateRangeTypes) {
6
+ DateRangeTypes["WITHIN"] = "within";
7
+ DateRangeTypes["AGO"] = "ago";
8
+ DateRangeTypes["BETWEEN"] = "between";
9
+ })(DateRangeTypes = exports.DateRangeTypes || (exports.DateRangeTypes = {}));
@@ -1,10 +0,0 @@
1
- /// <reference types="react" />
2
- import { AttributeOption } from '../types';
3
- import { TEntityType } from '@reltio/mdm-sdk';
4
- declare type Props = {
5
- entityType: TEntityType;
6
- selectedAttributes: AttributeOption[];
7
- onChange?: (attributes: AttributeOption[]) => void;
8
- };
9
- declare const AttributeSelector: ({ selectedAttributes, entityType, onChange }: Props) => JSX.Element;
10
- export default AttributeSelector;
@@ -1,8 +0,0 @@
1
- /// <reference types="react" />
2
- declare type Props = {
3
- interval: [number, string];
4
- onChange: ([number, string]: [any, any]) => void;
5
- onFocus: () => void;
6
- };
7
- declare const IntervalSelector: ({ interval: [value, unit], onChange, onFocus }: Props) => JSX.Element;
8
- export default IntervalSelector;
@@ -1,7 +0,0 @@
1
- /// <reference types="react" />
2
- declare type Props = {
3
- selectedUsers: string[];
4
- onChange: (activities: string[]) => void;
5
- };
6
- declare const UserSelector: ({ selectedUsers, onChange }: Props) => JSX.Element;
7
- export default UserSelector;
@@ -1,8 +0,0 @@
1
- import { AttributeType } from '@reltio/mdm-sdk';
2
- export declare type AttributeOption = {
3
- label: string;
4
- value: string;
5
- attrType: AttributeType;
6
- chipLabel: string;
7
- level: number;
8
- };
@@ -1,2 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
@@ -1,5 +0,0 @@
1
- export declare enum DateRangeTypes {
2
- WITHIN = "within",
3
- AGO = "ago",
4
- BETWEEN = "between"
5
- }
@@ -1,9 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.DateRangeTypes = void 0;
4
- var DateRangeTypes;
5
- (function (DateRangeTypes) {
6
- DateRangeTypes["WITHIN"] = "within";
7
- DateRangeTypes["AGO"] = "ago";
8
- DateRangeTypes["BETWEEN"] = "between";
9
- })(DateRangeTypes = exports.DateRangeTypes || (exports.DateRangeTypes = {}));