@reltio/components 1.4.1273 → 1.4.1274

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.
@@ -1,5 +1,5 @@
1
1
  export default DateRangeEditor;
2
- declare function DateRangeEditor({ label, values, options, getValuesDateRange, onChange, dataTypeDefinition, TextFieldProps, ...otherProps }: {
2
+ declare function DateRangeEditor({ label, values, options, getValuesDateRange, onChange, dataTypeDefinition, TextFieldProps, MenuProps, classes, ...otherProps }: {
3
3
  [x: string]: any;
4
4
  label: any;
5
5
  values: any;
@@ -8,6 +8,8 @@ declare function DateRangeEditor({ label, values, options, getValuesDateRange, o
8
8
  onChange?: any;
9
9
  dataTypeDefinition?: {};
10
10
  TextFieldProps?: {};
11
+ MenuProps?: {};
12
+ classes?: {};
11
13
  }): JSX.Element;
12
14
  declare namespace DateRangeEditor {
13
15
  namespace propTypes {
@@ -21,6 +23,8 @@ declare namespace DateRangeEditor {
21
23
  const onChange: PropTypes.Requireable<(...args: any[]) => any>;
22
24
  const dataTypeDefinition: PropTypes.Requireable<object>;
23
25
  const TextFieldProps: PropTypes.Requireable<object>;
26
+ const MenuProps: PropTypes.Requireable<object>;
27
+ const classes: PropTypes.Requireable<object>;
24
28
  }
25
29
  }
26
30
  import PropTypes from "prop-types";
@@ -78,15 +78,15 @@ var getEditorValue = ramda_1.curry(function (placeholder, dataTypeDefinition, va
78
78
  var convertValuesToDate = ramda_1.pipe(mdm_sdk_1.getDateRangeByValue, ramda_1.defaultTo([]), ramda_1.map(function (value) { return value && new Date(value); }));
79
79
  var DateRangeEditor = function (_a) {
80
80
  var _b;
81
- var label = _a.label, values = _a.values, options = _a.options, _c = _a.getValuesDateRange, getValuesDateRange = _c === void 0 ? convertValuesToDate : _c, _d = _a.onChange, onChange = _d === void 0 ? ramda_1.identity : _d, _e = _a.dataTypeDefinition, dataTypeDefinition = _e === void 0 ? {} : _e, _f = _a.TextFieldProps, TextFieldProps = _f === void 0 ? {} : _f, otherProps = __rest(_a, ["label", "values", "options", "getValuesDateRange", "onChange", "dataTypeDefinition", "TextFieldProps"]);
81
+ var label = _a.label, values = _a.values, options = _a.options, _c = _a.getValuesDateRange, getValuesDateRange = _c === void 0 ? convertValuesToDate : _c, _d = _a.onChange, onChange = _d === void 0 ? ramda_1.identity : _d, _e = _a.dataTypeDefinition, dataTypeDefinition = _e === void 0 ? {} : _e, _f = _a.TextFieldProps, TextFieldProps = _f === void 0 ? {} : _f, _g = _a.MenuProps, MenuProps = _g === void 0 ? {} : _g, _h = _a.classes, classes = _h === void 0 ? {} : _h, otherProps = __rest(_a, ["label", "values", "options", "getValuesDateRange", "onChange", "dataTypeDefinition", "TextFieldProps", "MenuProps", "classes"]);
82
82
  var placeholder = localeFormat + (dataTypeDefinition.type === mdm_sdk_1.DataTypes.TYPE_TIMESTAMP ? ' HH:MM' : '');
83
83
  var rangeOptions = react_1.useMemo(function () {
84
84
  return options ||
85
85
  Object.values(mdm_sdk_1.DateRangeValues).map(function (option) { return ({ value: option, label: mdm_sdk_1.getRangeOptionLabel(option) }); });
86
86
  }, [options]);
87
87
  var inputRef = react_1.useRef(null);
88
- var _g = react_1.useState(false), open = _g[0], setOpen = _g[1];
89
- var _h = react_1.useState(), customValue = _h[0], setCustomValue = _h[1];
88
+ var _j = react_1.useState(false), open = _j[0], setOpen = _j[1];
89
+ var _k = react_1.useState(), customValue = _k[0], setCustomValue = _k[1];
90
90
  var styles = styles_1.useStyles();
91
91
  var onItemClick = function (value) {
92
92
  if (value === mdm_sdk_1.DateRangeValues.PICK_DATE) {
@@ -104,22 +104,23 @@ var DateRangeEditor = function (_a) {
104
104
  setOpen(false);
105
105
  };
106
106
  return (react_1.default.createElement(react_1.default.Fragment, null,
107
- react_1.default.createElement(TextField_1.default, __assign({}, TextFieldProps, otherProps, { label: label, value: getEditorValue(placeholder, dataTypeDefinition, customValue || values, rangeOptions).label, onClick: handleToggle, variant: "filled", margin: "dense", ref: inputRef, InputProps: {
108
- endAdornment: (react_1.default.createElement(DropdownIndicatorWithIconButton_1.default, { selectProps: { classes: styles, menuIsOpen: open }, innerProps: {} })),
109
- classes: {
107
+ react_1.default.createElement(TextField_1.default, __assign({}, TextFieldProps, otherProps, { label: label, value: TextFieldProps.value ||
108
+ getEditorValue(placeholder, dataTypeDefinition, customValue || values, rangeOptions).label, onClick: handleToggle, variant: "filled", margin: "dense", ref: inputRef, InputProps: __assign({ endAdornment: (react_1.default.createElement(DropdownIndicatorWithIconButton_1.default, { selectProps: {
109
+ classes: {
110
+ dropdownIndicator: classnames_1.default(styles.dropdownIndicator, classes === null || classes === void 0 ? void 0 : classes.dropdownIndicator)
111
+ },
112
+ menuIsOpen: open
113
+ }, innerProps: {} })), classes: {
110
114
  root: styles.inputRoot,
111
115
  underline: classnames_1.default((_b = {}, _b[styles.underline] = open, _b)),
112
116
  adornedEnd: styles.adornedEnd
113
- },
114
- disableUnderline: ramda_1.isNil(values),
115
- readOnly: true
116
- }, InputLabelProps: {
117
+ }, disableUnderline: ramda_1.isNil(values), readOnly: true }, TextFieldProps.InputProps), InputLabelProps: {
117
118
  classes: {
118
119
  root: open ? styles.inputLabel : undefined
119
120
  },
120
121
  shrink: !ramda_1.isNil(label)
121
122
  }, placeholder: ui_i18n_1.default.text(placeholder + " \u2014 " + placeholder) })),
122
- react_1.default.createElement(Menu_1.default, { variant: "menu", open: open, autoFocus: false, classes: { paper: styles.paper }, anchorEl: inputRef.current, onClose: onCancel, anchorOrigin: {
123
+ react_1.default.createElement(Menu_1.default, __assign({ variant: "menu", open: open, autoFocus: false, classes: { paper: styles.paper }, anchorEl: inputRef.current, onClose: onCancel, anchorOrigin: {
123
124
  vertical: 'bottom',
124
125
  horizontal: 'left'
125
126
  }, transformOrigin: {
@@ -127,8 +128,10 @@ var DateRangeEditor = function (_a) {
127
128
  horizontal: 'left'
128
129
  }, elevation: 2, getContentAnchorEl: null, MenuListProps: {
129
130
  autoFocusItem: open,
130
- style: { width: customValue ? '100%' : ramda_1.prop('clientWidth', inputRef.current) }
131
- } }, customValue ? (react_1.default.createElement(DateRangePicker_1.default, { values: getValuesDateRange(values), onCancel: onCancel, onApply: onItemClick, type: dataTypeDefinition.type })) : (rangeOptions.map(function (option) { return (react_1.default.createElement(MenuItem_1.default, { key: option.value, value: option.value, onClick: function () { return onItemClick(option.value); }, className: styles.menuItem },
131
+ style: {
132
+ width: customValue ? '100%' : ramda_1.prop('clientWidth', inputRef.current)
133
+ }
134
+ } }, MenuProps), customValue ? (react_1.default.createElement(DateRangePicker_1.default, { values: getValuesDateRange(values), onCancel: onCancel, onApply: onItemClick, type: dataTypeDefinition.type })) : (rangeOptions.map(function (option) { return (react_1.default.createElement(MenuItem_1.default, { key: option.value, value: option.value, onClick: function () { return onItemClick(option.value); }, className: styles.menuItem },
132
135
  react_1.default.createElement(Typography_1.default, { classes: { root: styles.menuText } }, option.label))); })))));
133
136
  };
134
137
  DateRangeEditor.propTypes = {
@@ -141,6 +144,8 @@ DateRangeEditor.propTypes = {
141
144
  getValuesDateRange: prop_types_1.default.func,
142
145
  onChange: prop_types_1.default.func,
143
146
  dataTypeDefinition: prop_types_1.default.object,
144
- TextFieldProps: prop_types_1.default.object
147
+ TextFieldProps: prop_types_1.default.object,
148
+ MenuProps: prop_types_1.default.object,
149
+ classes: prop_types_1.default.object
145
150
  };
146
151
  exports.default = DateRangeEditor;
@@ -1,5 +1,5 @@
1
1
  export default DateRangeEditor;
2
- declare function DateRangeEditor({ label, values, options, getValuesDateRange, onChange, dataTypeDefinition, TextFieldProps, ...otherProps }: {
2
+ declare function DateRangeEditor({ label, values, options, getValuesDateRange, onChange, dataTypeDefinition, TextFieldProps, MenuProps, classes, ...otherProps }: {
3
3
  [x: string]: any;
4
4
  label: any;
5
5
  values: any;
@@ -8,6 +8,8 @@ declare function DateRangeEditor({ label, values, options, getValuesDateRange, o
8
8
  onChange?: any;
9
9
  dataTypeDefinition?: {};
10
10
  TextFieldProps?: {};
11
+ MenuProps?: {};
12
+ classes?: {};
11
13
  }): JSX.Element;
12
14
  declare namespace DateRangeEditor {
13
15
  namespace propTypes {
@@ -21,6 +23,8 @@ declare namespace DateRangeEditor {
21
23
  const onChange: PropTypes.Requireable<(...args: any[]) => any>;
22
24
  const dataTypeDefinition: PropTypes.Requireable<object>;
23
25
  const TextFieldProps: PropTypes.Requireable<object>;
26
+ const MenuProps: PropTypes.Requireable<object>;
27
+ const classes: PropTypes.Requireable<object>;
24
28
  }
25
29
  }
26
30
  import PropTypes from "prop-types";
@@ -54,15 +54,15 @@ var getEditorValue = curry(function (placeholder, dataTypeDefinition, value, opt
54
54
  var convertValuesToDate = pipe(getDateRangeByValue, defaultTo([]), map(function (value) { return value && new Date(value); }));
55
55
  var DateRangeEditor = function (_a) {
56
56
  var _b;
57
- var label = _a.label, values = _a.values, options = _a.options, _c = _a.getValuesDateRange, getValuesDateRange = _c === void 0 ? convertValuesToDate : _c, _d = _a.onChange, onChange = _d === void 0 ? identity : _d, _e = _a.dataTypeDefinition, dataTypeDefinition = _e === void 0 ? {} : _e, _f = _a.TextFieldProps, TextFieldProps = _f === void 0 ? {} : _f, otherProps = __rest(_a, ["label", "values", "options", "getValuesDateRange", "onChange", "dataTypeDefinition", "TextFieldProps"]);
57
+ var label = _a.label, values = _a.values, options = _a.options, _c = _a.getValuesDateRange, getValuesDateRange = _c === void 0 ? convertValuesToDate : _c, _d = _a.onChange, onChange = _d === void 0 ? identity : _d, _e = _a.dataTypeDefinition, dataTypeDefinition = _e === void 0 ? {} : _e, _f = _a.TextFieldProps, TextFieldProps = _f === void 0 ? {} : _f, _g = _a.MenuProps, MenuProps = _g === void 0 ? {} : _g, _h = _a.classes, classes = _h === void 0 ? {} : _h, otherProps = __rest(_a, ["label", "values", "options", "getValuesDateRange", "onChange", "dataTypeDefinition", "TextFieldProps", "MenuProps", "classes"]);
58
58
  var placeholder = localeFormat + (dataTypeDefinition.type === DataTypes.TYPE_TIMESTAMP ? ' HH:MM' : '');
59
59
  var rangeOptions = useMemo(function () {
60
60
  return options ||
61
61
  Object.values(DateRangeValues).map(function (option) { return ({ value: option, label: getRangeOptionLabel(option) }); });
62
62
  }, [options]);
63
63
  var inputRef = useRef(null);
64
- var _g = useState(false), open = _g[0], setOpen = _g[1];
65
- var _h = useState(), customValue = _h[0], setCustomValue = _h[1];
64
+ var _j = useState(false), open = _j[0], setOpen = _j[1];
65
+ var _k = useState(), customValue = _k[0], setCustomValue = _k[1];
66
66
  var styles = useStyles();
67
67
  var onItemClick = function (value) {
68
68
  if (value === DateRangeValues.PICK_DATE) {
@@ -80,22 +80,23 @@ var DateRangeEditor = function (_a) {
80
80
  setOpen(false);
81
81
  };
82
82
  return (React.createElement(React.Fragment, null,
83
- React.createElement(TextField, __assign({}, TextFieldProps, otherProps, { label: label, value: getEditorValue(placeholder, dataTypeDefinition, customValue || values, rangeOptions).label, onClick: handleToggle, variant: "filled", margin: "dense", ref: inputRef, InputProps: {
84
- endAdornment: (React.createElement(DropdownIndicatorWithIconButton, { selectProps: { classes: styles, menuIsOpen: open }, innerProps: {} })),
85
- classes: {
83
+ React.createElement(TextField, __assign({}, TextFieldProps, otherProps, { label: label, value: TextFieldProps.value ||
84
+ getEditorValue(placeholder, dataTypeDefinition, customValue || values, rangeOptions).label, onClick: handleToggle, variant: "filled", margin: "dense", ref: inputRef, InputProps: __assign({ endAdornment: (React.createElement(DropdownIndicatorWithIconButton, { selectProps: {
85
+ classes: {
86
+ dropdownIndicator: classnames(styles.dropdownIndicator, classes === null || classes === void 0 ? void 0 : classes.dropdownIndicator)
87
+ },
88
+ menuIsOpen: open
89
+ }, innerProps: {} })), classes: {
86
90
  root: styles.inputRoot,
87
91
  underline: classnames((_b = {}, _b[styles.underline] = open, _b)),
88
92
  adornedEnd: styles.adornedEnd
89
- },
90
- disableUnderline: isNil(values),
91
- readOnly: true
92
- }, InputLabelProps: {
93
+ }, disableUnderline: isNil(values), readOnly: true }, TextFieldProps.InputProps), InputLabelProps: {
93
94
  classes: {
94
95
  root: open ? styles.inputLabel : undefined
95
96
  },
96
97
  shrink: !isNil(label)
97
98
  }, placeholder: i18n.text(placeholder + " \u2014 " + placeholder) })),
98
- React.createElement(Menu, { variant: "menu", open: open, autoFocus: false, classes: { paper: styles.paper }, anchorEl: inputRef.current, onClose: onCancel, anchorOrigin: {
99
+ React.createElement(Menu, __assign({ variant: "menu", open: open, autoFocus: false, classes: { paper: styles.paper }, anchorEl: inputRef.current, onClose: onCancel, anchorOrigin: {
99
100
  vertical: 'bottom',
100
101
  horizontal: 'left'
101
102
  }, transformOrigin: {
@@ -103,8 +104,10 @@ var DateRangeEditor = function (_a) {
103
104
  horizontal: 'left'
104
105
  }, elevation: 2, getContentAnchorEl: null, MenuListProps: {
105
106
  autoFocusItem: open,
106
- style: { width: customValue ? '100%' : prop('clientWidth', inputRef.current) }
107
- } }, customValue ? (React.createElement(DateRangePicker, { values: getValuesDateRange(values), onCancel: onCancel, onApply: onItemClick, type: dataTypeDefinition.type })) : (rangeOptions.map(function (option) { return (React.createElement(MenuItem, { key: option.value, value: option.value, onClick: function () { return onItemClick(option.value); }, className: styles.menuItem },
107
+ style: {
108
+ width: customValue ? '100%' : prop('clientWidth', inputRef.current)
109
+ }
110
+ } }, MenuProps), customValue ? (React.createElement(DateRangePicker, { values: getValuesDateRange(values), onCancel: onCancel, onApply: onItemClick, type: dataTypeDefinition.type })) : (rangeOptions.map(function (option) { return (React.createElement(MenuItem, { key: option.value, value: option.value, onClick: function () { return onItemClick(option.value); }, className: styles.menuItem },
108
111
  React.createElement(Typography, { classes: { root: styles.menuText } }, option.label))); })))));
109
112
  };
110
113
  DateRangeEditor.propTypes = {
@@ -117,6 +120,8 @@ DateRangeEditor.propTypes = {
117
120
  getValuesDateRange: PropTypes.func,
118
121
  onChange: PropTypes.func,
119
122
  dataTypeDefinition: PropTypes.object,
120
- TextFieldProps: PropTypes.object
123
+ TextFieldProps: PropTypes.object,
124
+ MenuProps: PropTypes.object,
125
+ classes: PropTypes.object
121
126
  };
122
127
  export default DateRangeEditor;
package/package.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "name": "@reltio/components",
3
- "version": "1.4.1273",
3
+ "version": "1.4.1274",
4
4
  "license": "SEE LICENSE IN LICENSE FILE",
5
5
  "main": "./cjs/index.js",
6
6
  "module": "./esm/index.js",
7
7
  "dependencies": {
8
8
  "@date-io/moment": "^1.3.5",
9
9
  "@react-google-maps/api": "2.7.0",
10
- "@reltio/mdm-module": "^1.4.1273",
11
- "@reltio/mdm-sdk": "^1.4.1273",
10
+ "@reltio/mdm-module": "^1.4.1274",
11
+ "@reltio/mdm-sdk": "^1.4.1274",
12
12
  "classnames": "^2.2.5",
13
13
  "d3-cloud": "^1.2.5",
14
14
  "d3-geo": "^2.0.1",