dinocollab-core 1.0.3 → 1.0.5
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/dist/_virtual/_rollupPluginBabelHelpers.js +1 -487
- package/dist/_virtual/_rollupPluginBabelHelpers.js.map +1 -1
- package/dist/api-context/alert-global.js +1 -165
- package/dist/api-context/alert-global.js.map +1 -1
- package/dist/api-context/drawer-global.js +1 -111
- package/dist/api-context/drawer-global.js.map +1 -1
- package/dist/api-context/global-modal.js +1 -94
- package/dist/api-context/global-modal.js.map +1 -1
- package/dist/api-context/popover-global.js +1 -109
- package/dist/api-context/popover-global.js.map +1 -1
- package/dist/api-context/popover.js +1 -93
- package/dist/api-context/popover.js.map +1 -1
- package/dist/api-context/ui.units.js +1 -22
- package/dist/api-context/ui.units.js.map +1 -1
- package/dist/components/breadcrumbs.js +1 -64
- package/dist/components/breadcrumbs.js.map +1 -1
- package/dist/components/copy-to-clipboard.js +1 -111
- package/dist/components/copy-to-clipboard.js.map +1 -1
- package/dist/components/create.multi-select-dropdown.js +2 -0
- package/dist/components/create.multi-select-dropdown.js.map +1 -0
- package/dist/components/help-tooltip.js +1 -103
- package/dist/components/help-tooltip.js.map +1 -1
- package/dist/components/image-with-fallback.js +1 -50
- package/dist/components/image-with-fallback.js.map +1 -1
- package/dist/components/text-editor.js +1 -117
- package/dist/components/text-editor.js.map +1 -1
- package/dist/components/text-editor.preview.js +1 -26
- package/dist/components/text-editor.preview.js.map +1 -1
- package/dist/filter-bar/base.js +2 -0
- package/dist/filter-bar/base.js.map +1 -0
- package/dist/filter-bar/create.filter-bar.js +2 -0
- package/dist/filter-bar/create.filter-bar.js.map +1 -0
- package/dist/filter-bar/create.filter-menu.js +2 -0
- package/dist/filter-bar/create.filter-menu.js.map +1 -0
- package/dist/filter-bar/create.filter-panel.js +2 -0
- package/dist/filter-bar/create.filter-panel.js.map +1 -0
- package/dist/filter-bar/create.filtered.js +2 -0
- package/dist/filter-bar/create.filtered.js.map +1 -0
- package/dist/filter-bar/create.sort-menu.js +2 -0
- package/dist/filter-bar/create.sort-menu.js.map +1 -0
- package/dist/filter-bar/demo.js +2 -0
- package/dist/filter-bar/demo.js.map +1 -0
- package/dist/filter-bar/types.js +2 -0
- package/dist/filter-bar/types.js.map +1 -0
- package/dist/filter-bar/ui.units.js +2 -0
- package/dist/filter-bar/ui.units.js.map +1 -0
- package/dist/form/create.autocomplete.chips.js +1 -227
- package/dist/form/create.autocomplete.chips.js.map +1 -1
- package/dist/form/create.date-expired.js +1 -210
- package/dist/form/create.date-expired.js.map +1 -1
- package/dist/form/create.date-picker.js +1 -127
- package/dist/form/create.date-picker.js.map +1 -1
- package/dist/form/create.form-base.js +1 -140
- package/dist/form/create.form-base.js.map +1 -1
- package/dist/form/create.form-comfirm.js +1 -130
- package/dist/form/create.form-comfirm.js.map +1 -1
- package/dist/form/create.form-grid-layout.js +1 -187
- package/dist/form/create.form-grid-layout.js.map +1 -1
- package/dist/form/create.form-grid-layout.units.js +1 -41
- package/dist/form/create.form-grid-layout.units.js.map +1 -1
- package/dist/form/create.input.file.js +1 -78
- package/dist/form/create.input.file.js.map +1 -1
- package/dist/form/create.input.js +1 -275
- package/dist/form/create.input.js.map +1 -1
- package/dist/form/create.select-simple.js +1 -113
- package/dist/form/create.select-simple.js.map +1 -1
- package/dist/form/create.select-with-api.js +1 -276
- package/dist/form/create.select-with-api.js.map +1 -1
- package/dist/form/create.text-editor.js +1 -180
- package/dist/form/create.text-editor.js.map +1 -1
- package/dist/form/dino-form.js +1 -40
- package/dist/form/dino-form.js.map +1 -1
- package/dist/form/helper.js +1 -156
- package/dist/form/helper.js.map +1 -1
- package/dist/form/modal-wrapper.js +1 -81
- package/dist/form/modal-wrapper.js.map +1 -1
- package/dist/form/validator.js +1 -189
- package/dist/form/validator.js.map +1 -1
- package/dist/hooks/index.js +1 -47
- package/dist/hooks/index.js.map +1 -1
- package/dist/index.js +1 -32
- package/dist/index.js.map +1 -1
- package/dist/redux/create.hoc-lazy.js +1 -70
- package/dist/redux/create.hoc-lazy.js.map +1 -1
- package/dist/redux/dino.js +1 -10
- package/dist/redux/dino.js.map +1 -1
- package/dist/redux/types.js +1 -8
- package/dist/redux/types.js.map +1 -1
- package/dist/redux/ui.error-page.js +1 -88
- package/dist/redux/ui.error-page.js.map +1 -1
- package/dist/redux/vector-404.webp.js +1 -3
- package/dist/redux/vector-404.webp.js.map +1 -1
- package/dist/table/context.js +1 -14
- package/dist/table/context.js.map +1 -1
- package/dist/table/create.action-row.js +1 -143
- package/dist/table/create.action-row.js.map +1 -1
- package/dist/table/create.table.js +1 -245
- package/dist/table/create.table.js.map +1 -1
- package/dist/table/custom.filter-operators.js +1 -88
- package/dist/table/custom.filter-operators.js.map +1 -1
- package/dist/table/dino.js +1 -135
- package/dist/table/dino.js.map +1 -1
- package/dist/table/helpers.js +1 -114
- package/dist/table/helpers.js.map +1 -1
- package/dist/table/model-filter.js +1 -22
- package/dist/table/model-filter.js.map +1 -1
- package/dist/table/toolbar-pannel.js +1 -142
- package/dist/table/toolbar-pannel.js.map +1 -1
- package/dist/table/ui.buttons.js +1 -66
- package/dist/table/ui.buttons.js.map +1 -1
- package/dist/table/ui.units.js +1 -247
- package/dist/table/ui.units.js.map +1 -1
- package/dist/table-grid/create.table-grid.js +2 -0
- package/dist/table-grid/create.table-grid.js.map +1 -0
- package/dist/table-grid/dino.js +2 -0
- package/dist/table-grid/dino.js.map +1 -0
- package/dist/table-grid/helpers.js +2 -0
- package/dist/table-grid/helpers.js.map +1 -0
- package/dist/table-grid/item-actions.js +2 -0
- package/dist/table-grid/item-actions.js.map +1 -0
- package/dist/table-grid/toolbar-pannel.js +2 -0
- package/dist/table-grid/toolbar-pannel.js.map +1 -0
- package/dist/types/{lab → components}/create.multi-select-dropdown.d.ts +5 -5
- package/dist/types/components/index.d.ts +2 -0
- package/dist/types/index.d.ts +1 -0
- package/dist/types/lab/{create.select-mul-with-api/index.d.ts → select-mul-with-api/create.select-mul-with-api.d.ts} +1 -1
- package/dist/types/lab/select-mul-with-api/index.d.ts +2 -0
- package/dist/types/lab/{create.select-mul-with-api → select-mul-with-api}/types.d.ts +1 -1
- package/dist/types/{lab/table-grid → table-grid}/item-actions.d.ts +1 -1
- package/dist/types/{lab/table-grid → table-grid}/toolbar-pannel.d.ts +1 -1
- package/dist/types/{lab/table-grid → table-grid}/types.d.ts +1 -1
- package/dist/utils/dayjs-config.js +1 -11
- package/dist/utils/dayjs-config.js.map +1 -1
- package/dist/utils/helpers.js +1 -198
- package/dist/utils/helpers.js.map +1 -1
- package/dist/utils/json-object.js +1 -37
- package/dist/utils/json-object.js.map +1 -1
- package/dist/utils/query-param.js +1 -171
- package/dist/utils/query-param.js.map +1 -1
- package/package.json +3 -8
- package/dist/index.d.ts +0 -928
- /package/dist/types/{lab/filter-bar → filter-bar}/base.d.ts +0 -0
- /package/dist/types/{lab/filter-bar → filter-bar}/create.filter-bar.d.ts +0 -0
- /package/dist/types/{lab/filter-bar → filter-bar}/create.filter-menu.d.ts +0 -0
- /package/dist/types/{lab/filter-bar → filter-bar}/create.filter-panel.d.ts +0 -0
- /package/dist/types/{lab/filter-bar → filter-bar}/create.filtered.d.ts +0 -0
- /package/dist/types/{lab/filter-bar → filter-bar}/create.sort-menu.d.ts +0 -0
- /package/dist/types/{lab/filter-bar → filter-bar}/demo.d.ts +0 -0
- /package/dist/types/{lab/filter-bar → filter-bar}/index.d.ts +0 -0
- /package/dist/types/{lab/filter-bar → filter-bar}/types.d.ts +0 -0
- /package/dist/types/{lab/filter-bar → filter-bar}/ui.units.d.ts +0 -0
- /package/dist/types/lab/{create.select-mul-with-api → select-mul-with-api}/table-custom.d.ts +0 -0
- /package/dist/types/lab/{create.select-mul-with-api → select-mul-with-api}/ui.units.d.ts +0 -0
- /package/dist/types/{lab/table-grid → table-grid}/create.table-grid.d.ts +0 -0
- /package/dist/types/{lab/table-grid → table-grid}/demo.d.ts +0 -0
- /package/dist/types/{lab/table-grid → table-grid}/dino.d.ts +0 -0
- /package/dist/types/{lab/table-grid → table-grid}/helpers.d.ts +0 -0
- /package/dist/types/{lab/table-grid → table-grid}/index.d.ts +0 -0
|
@@ -1,228 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { createElement, Component } from 'react';
|
|
4
|
-
import { styled, Autocomplete, TextField, Chip, Typography, Tooltip, IconButton } from '@mui/material';
|
|
5
|
-
import RemoveIcon from '@mui/icons-material/Remove';
|
|
6
|
-
import { getErrorMessage } from './helper.js';
|
|
7
|
-
|
|
8
|
-
var _AutocompleteChipStore;
|
|
9
|
-
function CreateAutocompleteChip(params) {
|
|
10
|
-
var separator = (params === null || params === void 0 ? void 0 : params.separator) || '|';
|
|
11
|
-
var limitTags = (params === null || params === void 0 ? void 0 : params.limitTags) || 2;
|
|
12
|
-
var storeItems = params !== null && params !== void 0 && params.saveLocalStorageByKey ? AutocompleteChipStore.initial(params.saveLocalStorageByKey) : undefined;
|
|
13
|
-
var AutocompleteChip = /*#__PURE__*/function (_Component) {
|
|
14
|
-
function AutocompleteChip(props) {
|
|
15
|
-
var _this;
|
|
16
|
-
_classCallCheck(this, AutocompleteChip);
|
|
17
|
-
_this = _callSuper(this, AutocompleteChip, [props]);
|
|
18
|
-
_defineProperty(_this, "refInput", null);
|
|
19
|
-
_defineProperty(_this, "handleRemoveItem", function (e, value) {
|
|
20
|
-
var _storeItems$delete;
|
|
21
|
-
e.preventDefault();
|
|
22
|
-
e.stopPropagation();
|
|
23
|
-
console.log(value);
|
|
24
|
-
var list = (_storeItems$delete = storeItems === null || storeItems === void 0 ? void 0 : storeItems["delete"](value)) !== null && _storeItems$delete !== void 0 ? _storeItems$delete : [];
|
|
25
|
-
_this.setState({
|
|
26
|
-
options: list
|
|
27
|
-
});
|
|
28
|
-
});
|
|
29
|
-
_defineProperty(_this, "handleAddOption", function (_, newValue) {
|
|
30
|
-
if (params !== null && params !== void 0 && params.saveLocalStorageByKey) {
|
|
31
|
-
var _storeItems$setItems;
|
|
32
|
-
var options = (_storeItems$setItems = storeItems === null || storeItems === void 0 ? void 0 : storeItems.setItems(_this.state.options, newValue)) !== null && _storeItems$setItems !== void 0 ? _storeItems$setItems : _this.state.options;
|
|
33
|
-
_this.setState({
|
|
34
|
-
value: newValue,
|
|
35
|
-
options: options
|
|
36
|
-
});
|
|
37
|
-
} else {
|
|
38
|
-
_this.setState({
|
|
39
|
-
value: newValue
|
|
40
|
-
});
|
|
41
|
-
}
|
|
42
|
-
if (_this.refInput) {
|
|
43
|
-
_this.refInput.value = newValue.join(separator);
|
|
44
|
-
}
|
|
45
|
-
_this.props.name && _this.props.onBlur && _this.props.onBlur(_this.props.name);
|
|
46
|
-
});
|
|
47
|
-
_defineProperty(_this, "isBtnRemoveOption", function (value) {
|
|
48
|
-
var _ref, _params$optionItems, _this$props$slots;
|
|
49
|
-
var isSelectedOption = _this.state.value.findIndex(function (x) {
|
|
50
|
-
return x === value;
|
|
51
|
-
}) < 0;
|
|
52
|
-
var selectOptions = (_ref = (_params$optionItems = params === null || params === void 0 ? void 0 : params.optionItems) !== null && _params$optionItems !== void 0 ? _params$optionItems : (_this$props$slots = _this.props.slots) === null || _this$props$slots === void 0 ? void 0 : _this$props$slots.optionItems) !== null && _ref !== void 0 ? _ref : [];
|
|
53
|
-
var isDefault = selectOptions.findIndex(function (x) {
|
|
54
|
-
return x === value;
|
|
55
|
-
}) < 0;
|
|
56
|
-
return isDefault && isSelectedOption;
|
|
57
|
-
});
|
|
58
|
-
_defineProperty(_this, "getSelectOptions", function () {
|
|
59
|
-
var _params$optionItems2;
|
|
60
|
-
var items = (_params$optionItems2 = params === null || params === void 0 ? void 0 : params.optionItems) !== null && _params$optionItems2 !== void 0 ? _params$optionItems2 : [];
|
|
61
|
-
if (params !== null && params !== void 0 && params.saveLocalStorageByKey) {
|
|
62
|
-
var _storeItems$getItemsA;
|
|
63
|
-
items = (_storeItems$getItemsA = storeItems === null || storeItems === void 0 ? void 0 : storeItems.getItemsAndMerge(items)) !== null && _storeItems$getItemsA !== void 0 ? _storeItems$getItemsA : [];
|
|
64
|
-
}
|
|
65
|
-
return items;
|
|
66
|
-
});
|
|
67
|
-
_defineProperty(_this, "getTextFieldProps", function () {
|
|
68
|
-
var _this$props = _this.props,
|
|
69
|
-
name = _this$props.name,
|
|
70
|
-
label = _this$props.label,
|
|
71
|
-
placeholder = _this$props.placeholder,
|
|
72
|
-
_onBlur = _this$props.onBlur,
|
|
73
|
-
messageErrors = _this$props.messageErrors;
|
|
74
|
-
var eMessage = getErrorMessage(messageErrors, name);
|
|
75
|
-
return {
|
|
76
|
-
label: label,
|
|
77
|
-
placeholder: placeholder || 'Add new',
|
|
78
|
-
onBlur: function onBlur() {
|
|
79
|
-
if (!name) return;
|
|
80
|
-
_onBlur && _onBlur(name);
|
|
81
|
-
},
|
|
82
|
-
error: eMessage.error,
|
|
83
|
-
helperText: eMessage.message
|
|
84
|
-
};
|
|
85
|
-
});
|
|
86
|
-
_defineProperty(_this, "getDefaultValue", function () {
|
|
87
|
-
var _data$name, _value$split$filter;
|
|
88
|
-
var _this$props2 = _this.props,
|
|
89
|
-
name = _this$props2.name,
|
|
90
|
-
data = _this$props2.data;
|
|
91
|
-
var value = name ? data === null || data === void 0 || (_data$name = data[name]) === null || _data$name === void 0 ? void 0 : _data$name.toString() : '';
|
|
92
|
-
return (_value$split$filter = value === null || value === void 0 ? void 0 : value.split(separator).filter(function (x) {
|
|
93
|
-
return !!x;
|
|
94
|
-
})) !== null && _value$split$filter !== void 0 ? _value$split$filter : [];
|
|
95
|
-
});
|
|
96
|
-
_this.state = {
|
|
97
|
-
value: _this.getDefaultValue(),
|
|
98
|
-
options: _this.getSelectOptions()
|
|
99
|
-
};
|
|
100
|
-
return _this;
|
|
101
|
-
}
|
|
102
|
-
_inherits(AutocompleteChip, _Component);
|
|
103
|
-
return _createClass(AutocompleteChip, [{
|
|
104
|
-
key: "render",
|
|
105
|
-
value: function render() {
|
|
106
|
-
var _this2 = this;
|
|
107
|
-
var name = this.props.name;
|
|
108
|
-
return jsxs(Fragment, {
|
|
109
|
-
children: [jsx(Autocomplete, {
|
|
110
|
-
multiple: true,
|
|
111
|
-
freeSolo: true,
|
|
112
|
-
limitTags: limitTags,
|
|
113
|
-
value: this.state.value,
|
|
114
|
-
onChange: this.handleAddOption,
|
|
115
|
-
options: this.state.options,
|
|
116
|
-
renderOption: function renderOption(props, option) {
|
|
117
|
-
return /*#__PURE__*/createElement(ItemOption, _objectSpread2(_objectSpread2({}, props), {}, {
|
|
118
|
-
key: option
|
|
119
|
-
}), jsx(Typography, {
|
|
120
|
-
variant: 'subtitle1',
|
|
121
|
-
sx: {
|
|
122
|
-
flex: 1
|
|
123
|
-
},
|
|
124
|
-
children: option
|
|
125
|
-
}), _this2.isBtnRemoveOption(option) && jsx(Tooltip, {
|
|
126
|
-
title: 'Remove option',
|
|
127
|
-
arrow: true,
|
|
128
|
-
placement: 'left',
|
|
129
|
-
children: jsx(IconButton, {
|
|
130
|
-
size: 'small',
|
|
131
|
-
onClick: function onClick(e) {
|
|
132
|
-
return _this2.handleRemoveItem(e, option);
|
|
133
|
-
},
|
|
134
|
-
children: jsx(RemoveIcon, {
|
|
135
|
-
fontSize: 'small'
|
|
136
|
-
})
|
|
137
|
-
})
|
|
138
|
-
}));
|
|
139
|
-
},
|
|
140
|
-
renderTags: function renderTags(tagValue, getTagProps) {
|
|
141
|
-
return tagValue.map(function (option, index) {
|
|
142
|
-
return /*#__PURE__*/createElement(Chip, _objectSpread2(_objectSpread2({
|
|
143
|
-
label: option
|
|
144
|
-
}, getTagProps({
|
|
145
|
-
index: index
|
|
146
|
-
})), {}, {
|
|
147
|
-
key: option.toString()
|
|
148
|
-
}));
|
|
149
|
-
});
|
|
150
|
-
},
|
|
151
|
-
renderInput: function renderInput(params) {
|
|
152
|
-
return jsx(TextField, _objectSpread2(_objectSpread2({}, params), {}, {
|
|
153
|
-
variant: 'outlined'
|
|
154
|
-
}, _this2.getTextFieldProps()));
|
|
155
|
-
}
|
|
156
|
-
}), jsx("input", {
|
|
157
|
-
ref: function ref(_ref2) {
|
|
158
|
-
_this2.refInput = _ref2;
|
|
159
|
-
},
|
|
160
|
-
hidden: true,
|
|
161
|
-
type: 'text',
|
|
162
|
-
name: name === null || name === void 0 ? void 0 : name.toString(),
|
|
163
|
-
defaultValue: this.state.value.join(separator)
|
|
164
|
-
})]
|
|
165
|
-
});
|
|
166
|
-
}
|
|
167
|
-
}]);
|
|
168
|
-
}(Component);
|
|
169
|
-
return AutocompleteChip;
|
|
170
|
-
}
|
|
171
|
-
var ItemOption = styled('li')({
|
|
172
|
-
display: 'flex',
|
|
173
|
-
alignItems: 'center'
|
|
174
|
-
});
|
|
175
|
-
var AutocompleteChipStore = /*#__PURE__*/_createClass(function AutocompleteChipStore(key, defaultValue) {
|
|
176
|
-
var _this3 = this;
|
|
177
|
-
_classCallCheck(this, AutocompleteChipStore);
|
|
178
|
-
_defineProperty(this, "storeKeyRoot", 'autocomplete_chip_store');
|
|
179
|
-
_defineProperty(this, "getRoot", function () {
|
|
180
|
-
try {
|
|
181
|
-
var res = window.localStorage.getItem(_this3.storeKeyRoot);
|
|
182
|
-
return JSON.parse(res !== null && res !== void 0 ? res : '{}');
|
|
183
|
-
} catch (error) {
|
|
184
|
-
return {};
|
|
185
|
-
}
|
|
186
|
-
});
|
|
187
|
-
_defineProperty(this, "getChild", function () {
|
|
188
|
-
return _this3.getRoot()[_this3.storeKey];
|
|
189
|
-
});
|
|
190
|
-
_defineProperty(this, "setRoot", function (value) {
|
|
191
|
-
window.localStorage.setItem(_this3.storeKeyRoot, JSON.stringify(value));
|
|
192
|
-
});
|
|
193
|
-
_defineProperty(this, "setChild", function (value) {
|
|
194
|
-
var obj = _this3.getRoot();
|
|
195
|
-
obj[_this3.storeKey] = value;
|
|
196
|
-
_this3.setRoot(obj);
|
|
197
|
-
});
|
|
198
|
-
_defineProperty(this, "getItemsAndMerge", function (value) {
|
|
199
|
-
try {
|
|
200
|
-
return Array.from(new Set([].concat(_toConsumableArray(_this3.getChild()), _toConsumableArray(value)))).sort();
|
|
201
|
-
} catch (error) {
|
|
202
|
-
return value;
|
|
203
|
-
}
|
|
204
|
-
});
|
|
205
|
-
_defineProperty(this, "setItems", function (options, value) {
|
|
206
|
-
var list = Array.from(new Set([].concat(_toConsumableArray(options), _toConsumableArray(value)))).sort();
|
|
207
|
-
_this3.setChild(list);
|
|
208
|
-
return list;
|
|
209
|
-
});
|
|
210
|
-
_defineProperty(this, "delete", function (value) {
|
|
211
|
-
var list = _this3.getChild().filter(function (x) {
|
|
212
|
-
return x !== value;
|
|
213
|
-
});
|
|
214
|
-
_this3.setChild(list);
|
|
215
|
-
return list;
|
|
216
|
-
});
|
|
217
|
-
this.storeKey = key;
|
|
218
|
-
if (defaultValue) {
|
|
219
|
-
this.setChild(defaultValue);
|
|
220
|
-
}
|
|
221
|
-
});
|
|
222
|
-
_AutocompleteChipStore = AutocompleteChipStore;
|
|
223
|
-
_defineProperty(AutocompleteChipStore, "initial", function (key, defaultValue) {
|
|
224
|
-
return new _AutocompleteChipStore(key, defaultValue);
|
|
225
|
-
});
|
|
226
|
-
|
|
227
|
-
export { CreateAutocompleteChip as default };
|
|
1
|
+
import{defineProperty as t,createClass as e,classCallCheck as n,toConsumableArray as o,inherits as r,objectSpread2 as i,callSuper as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as a,Fragment as s,jsx as u}from"react/jsx-runtime";import{createElement as p,Component as d}from"react";import{styled as c,Autocomplete as v,TextField as f,Chip as m,Typography as h,Tooltip as g,IconButton as y}from"@mui/material";import S from"@mui/icons-material/Remove";import{getErrorMessage as I}from"./helper.js";var R;function C(o){var c=(null==o?void 0:o.separator)||"|",R=(null==o?void 0:o.limitTags)||2,C=null!=o&&o.saveLocalStorageByKey?B.initial(o.saveLocalStorageByKey):void 0,K=function(){function B(e){var r;return n(this,B),r=l(this,B,[e]),t(r,"refInput",null),t(r,"handleRemoveItem",(function(t,e){var n;t.preventDefault(),t.stopPropagation(),console.log(e);var o=null!==(n=null==C?void 0:C.delete(e))&&void 0!==n?n:[];r.setState({options:o})})),t(r,"handleAddOption",(function(t,e){if(null!=o&&o.saveLocalStorageByKey){var n,i=null!==(n=null==C?void 0:C.setItems(r.state.options,e))&&void 0!==n?n:r.state.options;r.setState({value:e,options:i})}else r.setState({value:e});r.refInput&&(r.refInput.value=e.join(c)),r.props.name&&r.props.onBlur&&r.props.onBlur(r.props.name)})),t(r,"isBtnRemoveOption",(function(t){var e,n,i,l=r.state.value.findIndex((function(e){return e===t}))<0;return(null!==(e=null!==(n=null==o?void 0:o.optionItems)&&void 0!==n?n:null===(i=r.props.slots)||void 0===i?void 0:i.optionItems)&&void 0!==e?e:[]).findIndex((function(e){return e===t}))<0&&l})),t(r,"getSelectOptions",(function(){var t,e,n=null!==(t=null==o?void 0:o.optionItems)&&void 0!==t?t:[];null!=o&&o.saveLocalStorageByKey&&(n=null!==(e=null==C?void 0:C.getItemsAndMerge(n))&&void 0!==e?e:[]);return n})),t(r,"getTextFieldProps",(function(){var t=r.props,e=t.name,n=t.label,o=t.placeholder,i=t.onBlur,l=t.messageErrors,a=I(l,e);return{label:n,placeholder:o||"Add new",onBlur:function(){e&&i&&i(e)},error:a.error,helperText:a.message}})),t(r,"getDefaultValue",(function(){var t,e,n=r.props,o=n.name,i=n.data,l=o?null==i||null===(t=i[o])||void 0===t?void 0:t.toString():"";return null!==(e=null==l?void 0:l.split(c).filter((function(t){return!!t})))&&void 0!==e?e:[]})),r.state={value:r.getDefaultValue(),options:r.getSelectOptions()},r}return r(B,d),e(B,[{key:"render",value:function(){var t=this,e=this.props.name;return a(s,{children:[u(v,{multiple:!0,freeSolo:!0,limitTags:R,value:this.state.value,onChange:this.handleAddOption,options:this.state.options,renderOption:function(e,n){return p(x,i(i({},e),{},{key:n}),u(h,{variant:"subtitle1",sx:{flex:1},children:n}),t.isBtnRemoveOption(n)&&u(g,{title:"Remove option",arrow:!0,placement:"left",children:u(y,{size:"small",onClick:function(e){return t.handleRemoveItem(e,n)},children:u(S,{fontSize:"small"})})}))},renderTags:function(t,e){return t.map((function(t,n){return p(m,i(i({label:t},e({index:n})),{},{key:t.toString()}))}))},renderInput:function(e){return u(f,i(i({},e),{},{variant:"outlined"},t.getTextFieldProps()))}}),u("input",{ref:function(e){t.refInput=e},hidden:!0,type:"text",name:null==e?void 0:e.toString(),defaultValue:this.state.value.join(c)})]})}}])}();return K}var x=c("li")({display:"flex",alignItems:"center"}),B=e((function e(r,i){var l=this;n(this,e),t(this,"storeKeyRoot","autocomplete_chip_store"),t(this,"getRoot",(function(){try{var t=window.localStorage.getItem(l.storeKeyRoot);return JSON.parse(null!=t?t:"{}")}catch(t){return{}}})),t(this,"getChild",(function(){return l.getRoot()[l.storeKey]})),t(this,"setRoot",(function(t){window.localStorage.setItem(l.storeKeyRoot,JSON.stringify(t))})),t(this,"setChild",(function(t){var e=l.getRoot();e[l.storeKey]=t,l.setRoot(e)})),t(this,"getItemsAndMerge",(function(t){try{return Array.from(new Set([].concat(o(l.getChild()),o(t)))).sort()}catch(e){return t}})),t(this,"setItems",(function(t,e){var n=Array.from(new Set([].concat(o(t),o(e)))).sort();return l.setChild(n),n})),t(this,"delete",(function(t){var e=l.getChild().filter((function(e){return e!==t}));return l.setChild(e),e})),this.storeKey=r,i&&this.setChild(i)}));R=B,t(B,"initial",(function(t,e){return new R(t,e)}));export{C as default};
|
|
228
2
|
//# sourceMappingURL=create.autocomplete.chips.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create.autocomplete.chips.js","sources":["../../src/form/create.autocomplete.chips.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Autocomplete, Chip, IconButton, styled, TextField, TextFieldProps, Tooltip, Typography } from '@mui/material'\r\nimport RemoveIcon from '@mui/icons-material/Remove'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helper'\r\n\r\nexport interface IAutocompleteChipParams {\r\n optionItems?: string[]\r\n limitTags?: number\r\n separator?: string\r\n saveLocalStorageByKey?: string\r\n}\r\n\r\nexport interface IAutocompleteChipProps<T> extends IFormInputBase<T, IAutocompleteChipParams> {}\r\n\r\nexport interface IAutocompleteChipState {\r\n value: string[]\r\n options: string[]\r\n}\r\n\r\nfunction CreateAutocompleteChip<T>(params?: IAutocompleteChipParams): ComponentType<IAutocompleteChipProps<T>> {\r\n const separator = params?.separator || '|'\r\n const limitTags = params?.limitTags || 2\r\n const storeItems = params?.saveLocalStorageByKey ? AutocompleteChipStore.initial(params.saveLocalStorageByKey) : undefined\r\n\r\n class AutocompleteChip extends Component<IAutocompleteChipProps<T>, IAutocompleteChipState> {\r\n constructor(props: IAutocompleteChipProps<T>) {\r\n super(props)\r\n this.state = {\r\n value: this.getDefaultValue(),\r\n options: this.getSelectOptions()\r\n }\r\n }\r\n\r\n refInput: HTMLInputElement | null = null\r\n render() {\r\n const { name } = this.props\r\n return (\r\n <>\r\n <Autocomplete\r\n multiple\r\n freeSolo\r\n limitTags={limitTags}\r\n value={this.state.value}\r\n onChange={this.handleAddOption}\r\n options={this.state.options}\r\n renderOption={(props, option) => (\r\n <ItemOption {...props} key={option}>\r\n <Typography variant='subtitle1' sx={{ flex: 1 }}>\r\n {option}\r\n </Typography>\r\n {this.isBtnRemoveOption(option) && (\r\n <Tooltip title='Remove option' arrow placement='left'>\r\n <IconButton size='small' onClick={(e) => this.handleRemoveItem(e, option)}>\r\n <RemoveIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n </ItemOption>\r\n )}\r\n renderTags={(tagValue, getTagProps) => {\r\n return tagValue.map((option, index) => <Chip label={option} {...getTagProps({ index })} key={option.toString()} />)\r\n }}\r\n renderInput={(params) => <TextField {...params} variant='outlined' {...this.getTextFieldProps()} />}\r\n />\r\n <input\r\n ref={(ref) => {\r\n this.refInput = ref\r\n }}\r\n hidden\r\n type='text'\r\n name={name?.toString()}\r\n defaultValue={this.state.value.join(separator)}\r\n />\r\n </>\r\n )\r\n }\r\n\r\n handleRemoveItem = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>, value: string) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n console.log(value)\r\n const list = storeItems?.delete(value) ?? []\r\n this.setState({ options: list })\r\n }\r\n\r\n handleAddOption = (_: React.SyntheticEvent, newValue: string[]) => {\r\n if (params?.saveLocalStorageByKey) {\r\n const options = storeItems?.setItems(this.state.options, newValue) ?? this.state.options\r\n this.setState({ value: newValue, options })\r\n } else {\r\n this.setState({ value: newValue })\r\n }\r\n if (this.refInput) {\r\n this.refInput.value = newValue.join(separator)\r\n }\r\n this.props.name && this.props.onBlur && this.props.onBlur(this.props.name)\r\n }\r\n\r\n isBtnRemoveOption = (value: string) => {\r\n const isSelectedOption = this.state.value.findIndex((x) => x === value) < 0\r\n const selectOptions = params?.optionItems ?? this.props.slots?.optionItems ?? []\r\n const isDefault = selectOptions.findIndex((x) => x === value) < 0\r\n return isDefault && isSelectedOption\r\n }\r\n\r\n getSelectOptions = () => {\r\n let items = params?.optionItems ?? []\r\n if (params?.saveLocalStorageByKey) {\r\n items = storeItems?.getItemsAndMerge(items) ?? []\r\n }\r\n return items\r\n }\r\n\r\n getTextFieldProps = (): TextFieldProps => {\r\n const { name, label, placeholder, onBlur, messageErrors } = this.props\r\n const eMessage = getErrorMessage(messageErrors, name)\r\n return {\r\n label,\r\n placeholder: placeholder || 'Add new',\r\n onBlur: () => {\r\n if (!name) return\r\n onBlur && onBlur(name)\r\n },\r\n error: eMessage.error,\r\n helperText: eMessage.message\r\n }\r\n }\r\n\r\n getDefaultValue = (): string[] => {\r\n const { name, data } = this.props\r\n const value = name ? data?.[name]?.toString() : ''\r\n return value?.split(separator).filter((x) => !!x) ?? []\r\n }\r\n }\r\n\r\n return AutocompleteChip\r\n}\r\n\r\nexport default CreateAutocompleteChip\r\n\r\nconst ItemOption = styled('li')({\r\n display: 'flex',\r\n alignItems: 'center'\r\n})\r\n\r\ntype TChipStoreRoot = { [key: string]: string[] }\r\n\r\nclass AutocompleteChipStore {\r\n private storeKeyRoot = 'autocomplete_chip_store'\r\n private storeKey: string\r\n constructor(key: string, defaultValue?: string[]) {\r\n this.storeKey = key\r\n if (defaultValue) {\r\n this.setChild(defaultValue)\r\n }\r\n }\r\n\r\n static initial = (key: string, defaultValue?: string[]) => new AutocompleteChipStore(key, defaultValue)\r\n\r\n private getRoot = (): TChipStoreRoot => {\r\n try {\r\n const res = window.localStorage.getItem(this.storeKeyRoot)\r\n return JSON.parse(res ?? '{}')\r\n } catch (error) {\r\n return {}\r\n }\r\n }\r\n\r\n private getChild = (): string[] => {\r\n return this.getRoot()[this.storeKey]\r\n }\r\n\r\n private setRoot = (value: TChipStoreRoot) => {\r\n window.localStorage.setItem(this.storeKeyRoot, JSON.stringify(value))\r\n }\r\n\r\n private setChild = (value: string[]) => {\r\n const obj = this.getRoot()\r\n obj[this.storeKey] = value\r\n this.setRoot(obj)\r\n }\r\n\r\n getItemsAndMerge = (value: string[]): string[] => {\r\n try {\r\n return Array.from(new Set([...this.getChild(), ...value])).sort()\r\n } catch (error) {\r\n return value\r\n }\r\n }\r\n\r\n setItems = (options: string[], value: string[]): string[] => {\r\n const list = Array.from(new Set([...options, ...value])).sort()\r\n this.setChild(list)\r\n return list\r\n }\r\n\r\n delete = (value: string) => {\r\n const list = this.getChild().filter((x) => x !== value)\r\n this.setChild(list)\r\n return list\r\n }\r\n}\r\n"],"names":["CreateAutocompleteChip","params","separator","limitTags","storeItems","saveLocalStorageByKey","AutocompleteChipStore","initial","undefined","AutocompleteChip","_Component","props","_this","_classCallCheck","_callSuper","_defineProperty","e","value","_storeItems$delete","preventDefault","stopPropagation","console","log","list","setState","options","_","newValue","_storeItems$setItems","setItems","state","refInput","join","name","onBlur","_ref","_params$optionItems","_this$props$slots","isSelectedOption","findIndex","x","selectOptions","optionItems","slots","isDefault","_params$optionItems2","items","_storeItems$getItemsA","getItemsAndMerge","_this$props","label","placeholder","messageErrors","eMessage","getErrorMessage","error","helperText","message","_data$name","_value$split$filter","_this$props2","data","toString","split","filter","getDefaultValue","getSelectOptions","_inherits","_createClass","key","render","_this2","_jsxs","_Fragment","children","_jsx","Autocomplete","multiple","freeSolo","onChange","handleAddOption","renderOption","option","_createElement","ItemOption","_objectSpread","Typography","variant","sx","flex","isBtnRemoveOption","Tooltip","title","arrow","placement","IconButton","size","onClick","handleRemoveItem","RemoveIcon","fontSize","renderTags","tagValue","getTagProps","map","index","Chip","renderInput","TextField","getTextFieldProps","ref","hidden","type","defaultValue","Component","styled","display","alignItems","_this3","res","window","localStorage","getItem","storeKeyRoot","JSON","parse","getRoot","storeKey","setItem","stringify","obj","setRoot","Array","from","Set","concat","_toConsumableArray","getChild","sort","setChild","_AutocompleteChipStore"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"create.autocomplete.chips.js","sources":["../../src/form/create.autocomplete.chips.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Autocomplete, Chip, IconButton, styled, TextField, TextFieldProps, Tooltip, Typography } from '@mui/material'\r\nimport RemoveIcon from '@mui/icons-material/Remove'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helper'\r\n\r\nexport interface IAutocompleteChipParams {\r\n optionItems?: string[]\r\n limitTags?: number\r\n separator?: string\r\n saveLocalStorageByKey?: string\r\n}\r\n\r\nexport interface IAutocompleteChipProps<T> extends IFormInputBase<T, IAutocompleteChipParams> {}\r\n\r\nexport interface IAutocompleteChipState {\r\n value: string[]\r\n options: string[]\r\n}\r\n\r\nfunction CreateAutocompleteChip<T>(params?: IAutocompleteChipParams): ComponentType<IAutocompleteChipProps<T>> {\r\n const separator = params?.separator || '|'\r\n const limitTags = params?.limitTags || 2\r\n const storeItems = params?.saveLocalStorageByKey ? AutocompleteChipStore.initial(params.saveLocalStorageByKey) : undefined\r\n\r\n class AutocompleteChip extends Component<IAutocompleteChipProps<T>, IAutocompleteChipState> {\r\n constructor(props: IAutocompleteChipProps<T>) {\r\n super(props)\r\n this.state = {\r\n value: this.getDefaultValue(),\r\n options: this.getSelectOptions()\r\n }\r\n }\r\n\r\n refInput: HTMLInputElement | null = null\r\n render() {\r\n const { name } = this.props\r\n return (\r\n <>\r\n <Autocomplete\r\n multiple\r\n freeSolo\r\n limitTags={limitTags}\r\n value={this.state.value}\r\n onChange={this.handleAddOption}\r\n options={this.state.options}\r\n renderOption={(props, option) => (\r\n <ItemOption {...props} key={option}>\r\n <Typography variant='subtitle1' sx={{ flex: 1 }}>\r\n {option}\r\n </Typography>\r\n {this.isBtnRemoveOption(option) && (\r\n <Tooltip title='Remove option' arrow placement='left'>\r\n <IconButton size='small' onClick={(e) => this.handleRemoveItem(e, option)}>\r\n <RemoveIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n </ItemOption>\r\n )}\r\n renderTags={(tagValue, getTagProps) => {\r\n return tagValue.map((option, index) => <Chip label={option} {...getTagProps({ index })} key={option.toString()} />)\r\n }}\r\n renderInput={(params) => <TextField {...params} variant='outlined' {...this.getTextFieldProps()} />}\r\n />\r\n <input\r\n ref={(ref) => {\r\n this.refInput = ref\r\n }}\r\n hidden\r\n type='text'\r\n name={name?.toString()}\r\n defaultValue={this.state.value.join(separator)}\r\n />\r\n </>\r\n )\r\n }\r\n\r\n handleRemoveItem = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>, value: string) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n console.log(value)\r\n const list = storeItems?.delete(value) ?? []\r\n this.setState({ options: list })\r\n }\r\n\r\n handleAddOption = (_: React.SyntheticEvent, newValue: string[]) => {\r\n if (params?.saveLocalStorageByKey) {\r\n const options = storeItems?.setItems(this.state.options, newValue) ?? this.state.options\r\n this.setState({ value: newValue, options })\r\n } else {\r\n this.setState({ value: newValue })\r\n }\r\n if (this.refInput) {\r\n this.refInput.value = newValue.join(separator)\r\n }\r\n this.props.name && this.props.onBlur && this.props.onBlur(this.props.name)\r\n }\r\n\r\n isBtnRemoveOption = (value: string) => {\r\n const isSelectedOption = this.state.value.findIndex((x) => x === value) < 0\r\n const selectOptions = params?.optionItems ?? this.props.slots?.optionItems ?? []\r\n const isDefault = selectOptions.findIndex((x) => x === value) < 0\r\n return isDefault && isSelectedOption\r\n }\r\n\r\n getSelectOptions = () => {\r\n let items = params?.optionItems ?? []\r\n if (params?.saveLocalStorageByKey) {\r\n items = storeItems?.getItemsAndMerge(items) ?? []\r\n }\r\n return items\r\n }\r\n\r\n getTextFieldProps = (): TextFieldProps => {\r\n const { name, label, placeholder, onBlur, messageErrors } = this.props\r\n const eMessage = getErrorMessage(messageErrors, name)\r\n return {\r\n label,\r\n placeholder: placeholder || 'Add new',\r\n onBlur: () => {\r\n if (!name) return\r\n onBlur && onBlur(name)\r\n },\r\n error: eMessage.error,\r\n helperText: eMessage.message\r\n }\r\n }\r\n\r\n getDefaultValue = (): string[] => {\r\n const { name, data } = this.props\r\n const value = name ? data?.[name]?.toString() : ''\r\n return value?.split(separator).filter((x) => !!x) ?? []\r\n }\r\n }\r\n\r\n return AutocompleteChip\r\n}\r\n\r\nexport default CreateAutocompleteChip\r\n\r\nconst ItemOption = styled('li')({\r\n display: 'flex',\r\n alignItems: 'center'\r\n})\r\n\r\ntype TChipStoreRoot = { [key: string]: string[] }\r\n\r\nclass AutocompleteChipStore {\r\n private storeKeyRoot = 'autocomplete_chip_store'\r\n private storeKey: string\r\n constructor(key: string, defaultValue?: string[]) {\r\n this.storeKey = key\r\n if (defaultValue) {\r\n this.setChild(defaultValue)\r\n }\r\n }\r\n\r\n static initial = (key: string, defaultValue?: string[]) => new AutocompleteChipStore(key, defaultValue)\r\n\r\n private getRoot = (): TChipStoreRoot => {\r\n try {\r\n const res = window.localStorage.getItem(this.storeKeyRoot)\r\n return JSON.parse(res ?? '{}')\r\n } catch (error) {\r\n return {}\r\n }\r\n }\r\n\r\n private getChild = (): string[] => {\r\n return this.getRoot()[this.storeKey]\r\n }\r\n\r\n private setRoot = (value: TChipStoreRoot) => {\r\n window.localStorage.setItem(this.storeKeyRoot, JSON.stringify(value))\r\n }\r\n\r\n private setChild = (value: string[]) => {\r\n const obj = this.getRoot()\r\n obj[this.storeKey] = value\r\n this.setRoot(obj)\r\n }\r\n\r\n getItemsAndMerge = (value: string[]): string[] => {\r\n try {\r\n return Array.from(new Set([...this.getChild(), ...value])).sort()\r\n } catch (error) {\r\n return value\r\n }\r\n }\r\n\r\n setItems = (options: string[], value: string[]): string[] => {\r\n const list = Array.from(new Set([...options, ...value])).sort()\r\n this.setChild(list)\r\n return list\r\n }\r\n\r\n delete = (value: string) => {\r\n const list = this.getChild().filter((x) => x !== value)\r\n this.setChild(list)\r\n return list\r\n }\r\n}\r\n"],"names":["CreateAutocompleteChip","params","separator","limitTags","storeItems","saveLocalStorageByKey","AutocompleteChipStore","initial","undefined","AutocompleteChip","props","_this","_classCallCheck","_callSuper","_defineProperty","e","value","_storeItems$delete","preventDefault","stopPropagation","console","log","list","setState","options","_","newValue","_storeItems$setItems","setItems","state","refInput","join","name","onBlur","_ref","_params$optionItems","_this$props$slots","isSelectedOption","findIndex","x","optionItems","slots","_params$optionItems2","_storeItems$getItemsA","items","getItemsAndMerge","_this$props","label","placeholder","messageErrors","eMessage","getErrorMessage","error","helperText","message","_data$name","_value$split$filter","_this$props2","data","toString","split","filter","getDefaultValue","getSelectOptions","_inherits","Component","_createClass","key","_this2","this","_jsxs","_Fragment","children","_jsx","Autocomplete","multiple","freeSolo","onChange","handleAddOption","renderOption","option","_createElement","ItemOption","_objectSpread","Typography","variant","sx","flex","isBtnRemoveOption","Tooltip","title","arrow","placement","IconButton","size","onClick","handleRemoveItem","RemoveIcon","fontSize","renderTags","tagValue","getTagProps","map","index","Chip","renderInput","TextField","getTextFieldProps","ref","hidden","type","defaultValue","styled","display","alignItems","_this3","res","window","localStorage","getItem","storeKeyRoot","JSON","parse","getRoot","storeKey","setItem","stringify","obj","setRoot","Array","from","Set","concat","_toConsumableArray","getChild","sort","setChild","_AutocompleteChipStore"],"mappings":"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"}
|
|
@@ -1,211 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
-
import { Component } from 'react';
|
|
4
|
-
import { LocalizationProvider } from '@mui/x-date-pickers';
|
|
5
|
-
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
|
|
6
|
-
import { styled, Box, TextField, Typography, Switch } from '@mui/material';
|
|
7
|
-
import { getErrorMessage } from './helper.js';
|
|
8
|
-
import { mergeObjects as _mergeObjects, tryParseIntRequired } from '../utils/helpers.js';
|
|
9
|
-
import '../utils/query-param.js';
|
|
10
|
-
import '../utils/dayjs-config.js';
|
|
11
|
-
import dayjs from 'dayjs';
|
|
12
|
-
|
|
13
|
-
var defaultFormatString = 'MM-DD-YYYY';
|
|
14
|
-
var dateExpiredClasses = {
|
|
15
|
-
root: 'DateExpired-root',
|
|
16
|
-
control: 'DateExpired-control',
|
|
17
|
-
label: 'DateExpired-label',
|
|
18
|
-
labelSwitch: 'DateExpired-labelSwitch',
|
|
19
|
-
input: 'DateExpired-input',
|
|
20
|
-
"switch": 'DateExpired-switch'
|
|
21
|
-
};
|
|
22
|
-
function CreateDateExpired(params) {
|
|
23
|
-
var DateExpired = /*#__PURE__*/function (_Component) {
|
|
24
|
-
function DateExpired(props) {
|
|
25
|
-
var _this;
|
|
26
|
-
_classCallCheck(this, DateExpired);
|
|
27
|
-
_this = _callSuper(this, DateExpired, [props]);
|
|
28
|
-
_defineProperty(_this, "defaultNumberOfDays", 30);
|
|
29
|
-
_defineProperty(_this, "getNumberOfDays", function () {
|
|
30
|
-
if (_this.slots.type === 'number') {
|
|
31
|
-
return tryParseIntRequired(_this.defaulValue, _this.defaultNumberOfDays);
|
|
32
|
-
} else {
|
|
33
|
-
return _this.getDaysUntilDate(_this.defaulValue, _this.defaultNumberOfDays);
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
//#endregion
|
|
37
|
-
_defineProperty(_this, "mapTextFieldProps", function () {
|
|
38
|
-
var _this$props = _this.props,
|
|
39
|
-
messageErrors = _this$props.messageErrors,
|
|
40
|
-
name = _this$props.name,
|
|
41
|
-
onBlur = _this$props.onBlur;
|
|
42
|
-
var disabled = _this.props.disabled || !_this.state.switchChecked;
|
|
43
|
-
var obj = {
|
|
44
|
-
fullWidth: true,
|
|
45
|
-
className: dateExpiredClasses.input,
|
|
46
|
-
label: jsxs("span", {
|
|
47
|
-
className: dateExpiredClasses.label,
|
|
48
|
-
children: ["Expiry date", _this.state.switchChecked && jsx("b", {
|
|
49
|
-
children: _this.getOffsetDate(_this.state.numberOfDays)
|
|
50
|
-
})]
|
|
51
|
-
}),
|
|
52
|
-
variant: 'outlined',
|
|
53
|
-
type: 'number',
|
|
54
|
-
disabled: disabled,
|
|
55
|
-
value: _this.state.switchChecked ? _this.state.numberOfDays : 0,
|
|
56
|
-
onChange: _this.handleChange
|
|
57
|
-
};
|
|
58
|
-
if (!!name) {
|
|
59
|
-
obj.onBlur = function () {
|
|
60
|
-
return onBlur && onBlur(name);
|
|
61
|
-
};
|
|
62
|
-
var temp = getErrorMessage(messageErrors, name);
|
|
63
|
-
if (temp.error) {
|
|
64
|
-
var _temp$message;
|
|
65
|
-
obj.error = Boolean(temp.error);
|
|
66
|
-
obj.helperText = (_temp$message = temp.message) !== null && _temp$message !== void 0 ? _temp$message : '';
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
return _mergeObjects({}, obj, _this.slots.textFieldProps);
|
|
70
|
-
});
|
|
71
|
-
_defineProperty(_this, "handleChange", function (e) {
|
|
72
|
-
var numberOfDays = e.target.value != '' ? parseInt(e.target.value) : 0;
|
|
73
|
-
_this.setState({
|
|
74
|
-
numberOfDays: numberOfDays
|
|
75
|
-
});
|
|
76
|
-
});
|
|
77
|
-
_defineProperty(_this, "getOffsetDate", function (num) {
|
|
78
|
-
var formatString = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultFormatString;
|
|
79
|
-
return dayjs().add(num, 'day').format(formatString);
|
|
80
|
-
});
|
|
81
|
-
_defineProperty(_this, "getDaysUntilDate", function (value) {
|
|
82
|
-
var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
83
|
-
try {
|
|
84
|
-
if (!value) return defaultValue;
|
|
85
|
-
var target = dayjs(value);
|
|
86
|
-
var today = dayjs();
|
|
87
|
-
var diff = target.diff(today, 'day', true);
|
|
88
|
-
return Math.round(diff);
|
|
89
|
-
} catch (_unused) {
|
|
90
|
-
return defaultValue;
|
|
91
|
-
}
|
|
92
|
-
});
|
|
93
|
-
_this.state = {
|
|
94
|
-
numberOfDays: _this.getNumberOfDays(),
|
|
95
|
-
switchChecked: _this.slots.switchChecked
|
|
96
|
-
};
|
|
97
|
-
_this.id = new Date().getTime().toString();
|
|
98
|
-
return _this;
|
|
99
|
-
}
|
|
100
|
-
_inherits(DateExpired, _Component);
|
|
101
|
-
return _createClass(DateExpired, [{
|
|
102
|
-
key: "slots",
|
|
103
|
-
get: function get() {
|
|
104
|
-
var _this$props$slots, _ref2;
|
|
105
|
-
var _ref = (_this$props$slots = this.props.slots) !== null && _this$props$slots !== void 0 ? _this$props$slots : {},
|
|
106
|
-
switchChecked = _ref.switchChecked,
|
|
107
|
-
switchCheckedGetter = _ref.switchCheckedGetter;
|
|
108
|
-
var obj = _mergeObjects(params, this.props.slots);
|
|
109
|
-
var check = (_ref2 = this.defaulValue ? !!this.defaulValue : switchChecked) !== null && _ref2 !== void 0 ? _ref2 : true;
|
|
110
|
-
if (switchCheckedGetter) check = switchCheckedGetter(this.defaulValue, this.props.data);
|
|
111
|
-
return _objectSpread2(_objectSpread2({}, obj), {}, {
|
|
112
|
-
switchChecked: check
|
|
113
|
-
});
|
|
114
|
-
}
|
|
115
|
-
}, {
|
|
116
|
-
key: "defaulValue",
|
|
117
|
-
get: function get() {
|
|
118
|
-
var _this$props$defaultVa, _data$name;
|
|
119
|
-
var _this$props2 = this.props,
|
|
120
|
-
data = _this$props2.data,
|
|
121
|
-
name = _this$props2.name;
|
|
122
|
-
return (_this$props$defaultVa = this.props.defaultValue) !== null && _this$props$defaultVa !== void 0 ? _this$props$defaultVa : !!data && !!name ? (_data$name = data[name]) === null || _data$name === void 0 ? void 0 : _data$name.toString() : undefined;
|
|
123
|
-
}
|
|
124
|
-
}, {
|
|
125
|
-
key: "defaultValueInput",
|
|
126
|
-
get: function get() {
|
|
127
|
-
if (this.slots.type === 'number') {
|
|
128
|
-
return this.state.numberOfDays;
|
|
129
|
-
} else {
|
|
130
|
-
return this.getOffsetDate(this.state.numberOfDays, 'YYYY-MM-DDTHH:mm:ss.sssZ');
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
}, {
|
|
134
|
-
key: "render",
|
|
135
|
-
value:
|
|
136
|
-
//#region Render
|
|
137
|
-
function render() {
|
|
138
|
-
var _this$props$name,
|
|
139
|
-
_this2 = this;
|
|
140
|
-
return jsx(LocalizationProvider, {
|
|
141
|
-
dateAdapter: AdapterDayjs,
|
|
142
|
-
children: jsxs(Wrap, {
|
|
143
|
-
className: dateExpiredClasses.root,
|
|
144
|
-
children: [jsx("input", {
|
|
145
|
-
type: 'text',
|
|
146
|
-
hidden: true,
|
|
147
|
-
name: (_this$props$name = this.props.name) === null || _this$props$name === void 0 ? void 0 : _this$props$name.toString(),
|
|
148
|
-
defaultValue: this.defaultValueInput
|
|
149
|
-
}, this.defaultValueInput), jsx(TextField, _objectSpread2({}, this.mapTextFieldProps())), jsxs("div", {
|
|
150
|
-
className: dateExpiredClasses.control,
|
|
151
|
-
children: [jsx(Typography, _objectSpread2(_objectSpread2({
|
|
152
|
-
variant: 'caption',
|
|
153
|
-
className: dateExpiredClasses.labelSwitch
|
|
154
|
-
}, {
|
|
155
|
-
component: 'label',
|
|
156
|
-
htmlFor: this.id
|
|
157
|
-
}), {}, {
|
|
158
|
-
sx: {
|
|
159
|
-
color: this.state.switchChecked ? 'success.main' : '#767676'
|
|
160
|
-
},
|
|
161
|
-
children: this.state.switchChecked ? 'Use Expiration Date' : 'No Expiration'
|
|
162
|
-
})), jsx(Switch, {
|
|
163
|
-
id: this.id,
|
|
164
|
-
size: 'small',
|
|
165
|
-
color: 'success',
|
|
166
|
-
checked: this.state.switchChecked,
|
|
167
|
-
onChange: function onChange(_, checked) {
|
|
168
|
-
return _this2.setState({
|
|
169
|
-
switchChecked: checked
|
|
170
|
-
});
|
|
171
|
-
}
|
|
172
|
-
})]
|
|
173
|
-
})]
|
|
174
|
-
})
|
|
175
|
-
});
|
|
176
|
-
}
|
|
177
|
-
}]);
|
|
178
|
-
}(Component);
|
|
179
|
-
return DateExpired;
|
|
180
|
-
}
|
|
181
|
-
var Wrap = styled(Box)(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
|
|
182
|
-
display: 'flex',
|
|
183
|
-
alignItems: 'center',
|
|
184
|
-
gap: '10px',
|
|
185
|
-
position: 'relative'
|
|
186
|
-
}, ".".concat(dateExpiredClasses["switch"]), {
|
|
187
|
-
margin: 0,
|
|
188
|
-
flex: '0 0 auto'
|
|
189
|
-
}), ".".concat(dateExpiredClasses.label), {
|
|
190
|
-
b: {
|
|
191
|
-
color: '#1976d2',
|
|
192
|
-
marginLeft: '8px'
|
|
193
|
-
}
|
|
194
|
-
}), ".".concat(dateExpiredClasses.labelSwitch), {
|
|
195
|
-
fontWeight: 600,
|
|
196
|
-
cursor: 'pointer'
|
|
197
|
-
}), ".".concat(dateExpiredClasses.control), {
|
|
198
|
-
position: 'absolute',
|
|
199
|
-
top: 0,
|
|
200
|
-
right: 0,
|
|
201
|
-
height: '100%',
|
|
202
|
-
display: 'flex',
|
|
203
|
-
alignItems: 'center'
|
|
204
|
-
}), ".".concat(dateExpiredClasses.input), {
|
|
205
|
-
'.MuiInputBase-input': {
|
|
206
|
-
paddingRight: '160px'
|
|
207
|
-
}
|
|
208
|
-
}));
|
|
209
|
-
|
|
210
|
-
export { CreateDateExpired as default };
|
|
1
|
+
import{defineProperty as e,inherits as t,createClass as a,objectSpread2 as r,classCallCheck as s,callSuper as i}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as l}from"react/jsx-runtime";import{Component as o}from"react";import{LocalizationProvider as u}from"@mui/x-date-pickers";import{AdapterDayjs as d}from"@mui/x-date-pickers/AdapterDayjs";import{styled as c,Box as p,TextField as h,Typography as f,Switch as m}from"@mui/material";import{getErrorMessage as g}from"./helper.js";import{mergeObjects as v,tryParseIntRequired as y}from"../utils/helpers.js";import"../utils/query-param.js";import"../utils/dayjs-config.js";import D from"dayjs";var b="DateExpired-root",x="DateExpired-control",k="DateExpired-label",C="DateExpired-labelSwitch",w="DateExpired-input",O="DateExpired-switch";function j(c){var p=function(){function p(t){var a;return s(this,p),a=i(this,p,[t]),e(a,"defaultNumberOfDays",30),e(a,"getNumberOfDays",(function(){return"number"===a.slots.type?y(a.defaulValue,a.defaultNumberOfDays):a.getDaysUntilDate(a.defaulValue,a.defaultNumberOfDays)})),e(a,"mapTextFieldProps",(function(){var e=a.props,t=e.messageErrors,r=e.name,s=e.onBlur,i=a.props.disabled||!a.state.switchChecked,o={fullWidth:!0,className:w,label:l("span",{className:k,children:["Expiry date",a.state.switchChecked&&n("b",{children:a.getOffsetDate(a.state.numberOfDays)})]}),variant:"outlined",type:"number",disabled:i,value:a.state.switchChecked?a.state.numberOfDays:0,onChange:a.handleChange};if(r){o.onBlur=function(){return s&&s(r)};var u,d=g(t,r);if(d.error)o.error=Boolean(d.error),o.helperText=null!==(u=d.message)&&void 0!==u?u:""}return v({},o,a.slots.textFieldProps)})),e(a,"handleChange",(function(e){var t=""!=e.target.value?parseInt(e.target.value):0;a.setState({numberOfDays:t})})),e(a,"getOffsetDate",(function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"MM-DD-YYYY";return D().add(e,"day").format(t)})),e(a,"getDaysUntilDate",(function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;try{if(!e)return t;var a=D(e),r=D(),s=a.diff(r,"day",!0);return Math.round(s)}catch(e){return t}})),a.state={numberOfDays:a.getNumberOfDays(),switchChecked:a.slots.switchChecked},a.id=(new Date).getTime().toString(),a}return t(p,o),a(p,[{key:"slots",get:function(){var e,t,a=null!==(e=this.props.slots)&&void 0!==e?e:{},s=a.switchChecked,i=a.switchCheckedGetter,n=v(c,this.props.slots),l=null===(t=this.defaulValue?!!this.defaulValue:s)||void 0===t||t;return i&&(l=i(this.defaulValue,this.props.data)),r(r({},n),{},{switchChecked:l})}},{key:"defaulValue",get:function(){var e,t,a=this.props,r=a.data,s=a.name;return null!==(e=this.props.defaultValue)&&void 0!==e?e:r&&s?null===(t=r[s])||void 0===t?void 0:t.toString():void 0}},{key:"defaultValueInput",get:function(){return"number"===this.slots.type?this.state.numberOfDays:this.getOffsetDate(this.state.numberOfDays,"YYYY-MM-DDTHH:mm:ss.sssZ")}},{key:"render",value:function(){var e,t=this;return n(u,{dateAdapter:d,children:l(N,{className:b,children:[n("input",{type:"text",hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.defaultValueInput},this.defaultValueInput),n(h,r({},this.mapTextFieldProps())),l("div",{className:x,children:[n(f,r(r({variant:"caption",className:C},{component:"label",htmlFor:this.id}),{},{sx:{color:this.state.switchChecked?"success.main":"#767676"},children:this.state.switchChecked?"Use Expiration Date":"No Expiration"})),n(m,{id:this.id,size:"small",color:"success",checked:this.state.switchChecked,onChange:function(e,a){return t.setState({switchChecked:a})}})]})]})})}}])}();return p}var N=c(p)(e(e(e(e(e({display:"flex",alignItems:"center",gap:"10px",position:"relative"},".".concat(O),{margin:0,flex:"0 0 auto"}),".".concat(k),{b:{color:"#1976d2",marginLeft:"8px"}}),".".concat(C),{fontWeight:600,cursor:"pointer"}),".".concat(x),{position:"absolute",top:0,right:0,height:"100%",display:"flex",alignItems:"center"}),".".concat(w),{".MuiInputBase-input":{paddingRight:"160px"}}));export{j as default};
|
|
211
2
|
//# sourceMappingURL=create.date-expired.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create.date-expired.js","sources":["../../src/form/create.date-expired.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { LocalizationProvider } from '@mui/x-date-pickers'\r\nimport { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'\r\nimport { Switch, Typography, TextField, styled, Box, TextFieldProps } from '@mui/material'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helper'\r\nimport { dayjsCustom, mergeObjects, tryParseIntRequired } from '../utils'\r\n\r\nconst defaultFormatString = 'MM-DD-YYYY'\r\n\r\nconst dateExpiredClasses = {\r\n root: 'DateExpired-root',\r\n control: 'DateExpired-control',\r\n label: 'DateExpired-label',\r\n labelSwitch: 'DateExpired-labelSwitch',\r\n input: 'DateExpired-input',\r\n switch: 'DateExpired-switch'\r\n}\r\n\r\nexport interface IDateExpiredSlots<T> {\r\n /** @default string */\r\n type?: 'number' | 'string'\r\n textFieldProps?: Partial<TextFieldProps>\r\n switchChecked?: boolean\r\n switchCheckedGetter?: (value: any, model?: Partial<T>) => boolean\r\n}\r\n\r\nexport interface IDateExpiredProps<T> extends IFormInputBase<T> {\r\n slots?: IDateExpiredSlots<T>\r\n}\r\n\r\nexport interface IDateExpiredState {\r\n numberOfDays: number\r\n switchChecked: boolean\r\n}\r\n\r\nfunction CreateDateExpired<T>(params?: IDateExpiredSlots<T>): React.ComponentType<IDateExpiredProps<T>> {\r\n class DateExpired extends Component<IDateExpiredProps<T>, IDateExpiredState> {\r\n defaultNumberOfDays: number = 30\r\n private id\r\n constructor(props: IDateExpiredProps<T>) {\r\n super(props)\r\n this.state = {\r\n numberOfDays: this.getNumberOfDays(),\r\n switchChecked: this.slots.switchChecked\r\n }\r\n this.id = new Date().getTime().toString()\r\n }\r\n\r\n get slots(): IDateExpiredSlots<T> & { switchChecked: boolean } {\r\n const { switchChecked, switchCheckedGetter } = this.props.slots ?? {}\r\n const obj = mergeObjects(params, this.props.slots)\r\n let check = (this.defaulValue ? !!this.defaulValue : switchChecked) ?? true\r\n if (switchCheckedGetter) check = switchCheckedGetter(this.defaulValue, this.props.data)\r\n return { ...obj, switchChecked: check }\r\n }\r\n\r\n get defaulValue(): string {\r\n const { data, name } = this.props\r\n return this.props.defaultValue ?? (!!data && !!name ? data[name]?.toString() : undefined)\r\n }\r\n\r\n get defaultValueInput(): string | number {\r\n if (this.slots.type === 'number') {\r\n return this.state.numberOfDays\r\n } else {\r\n return this.getOffsetDate(this.state.numberOfDays, 'YYYY-MM-DDTHH:mm:ss.sssZ')\r\n }\r\n }\r\n\r\n getNumberOfDays = (): number => {\r\n if (this.slots.type === 'number') {\r\n return tryParseIntRequired(this.defaulValue, this.defaultNumberOfDays)\r\n } else {\r\n return this.getDaysUntilDate(this.defaulValue, this.defaultNumberOfDays)\r\n }\r\n }\r\n\r\n //#region Render\r\n render() {\r\n return (\r\n <LocalizationProvider dateAdapter={AdapterDayjs}>\r\n <Wrap className={dateExpiredClasses.root}>\r\n <input key={this.defaultValueInput} type='text' hidden name={this.props.name?.toString()} defaultValue={this.defaultValueInput} />\r\n <TextField {...this.mapTextFieldProps()} />\r\n <div className={dateExpiredClasses.control}>\r\n <Typography\r\n variant='caption'\r\n className={dateExpiredClasses.labelSwitch}\r\n {...{ component: 'label', htmlFor: this.id }}\r\n sx={{ color: this.state.switchChecked ? 'success.main' : '#767676' }}\r\n >\r\n {this.state.switchChecked ? 'Use Expiration Date' : 'No Expiration'}\r\n </Typography>\r\n <Switch\r\n id={this.id}\r\n size='small'\r\n color='success'\r\n checked={this.state.switchChecked}\r\n onChange={(_, checked) => this.setState({ switchChecked: checked })}\r\n />\r\n </div>\r\n </Wrap>\r\n </LocalizationProvider>\r\n )\r\n }\r\n //#endregion\r\n\r\n mapTextFieldProps = (): TextFieldProps => {\r\n const { messageErrors, name, onBlur } = this.props\r\n const disabled = this.props.disabled || !this.state.switchChecked\r\n const obj: TextFieldProps = {\r\n fullWidth: true,\r\n className: dateExpiredClasses.input,\r\n label: (\r\n <span className={dateExpiredClasses.label}>\r\n Expiry date\r\n {this.state.switchChecked && <b>{this.getOffsetDate(this.state.numberOfDays)}</b>}\r\n </span>\r\n ),\r\n variant: 'outlined',\r\n type: 'number',\r\n disabled: disabled,\r\n value: this.state.switchChecked ? this.state.numberOfDays : 0,\r\n onChange: this.handleChange\r\n }\r\n if (!!name) {\r\n obj.onBlur = () => onBlur && onBlur(name)\r\n const temp = getErrorMessage(messageErrors, name)\r\n if (temp.error) {\r\n obj.error = Boolean(temp.error)\r\n obj.helperText = temp.message ?? ''\r\n }\r\n }\r\n return mergeObjects<TextFieldProps>({}, obj, this.slots.textFieldProps)\r\n }\r\n\r\n handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n const numberOfDays: number = e.target.value != '' ? parseInt(e.target.value) : 0\r\n this.setState({ numberOfDays })\r\n }\r\n\r\n getOffsetDate = (num: number, formatString = defaultFormatString): string => {\r\n return dayjsCustom().add(num, 'day').format(formatString)\r\n }\r\n\r\n getDaysUntilDate = (value?: string, defaultValue = 0): number => {\r\n try {\r\n if (!value) return defaultValue\r\n const target = dayjsCustom(value)\r\n const today = dayjsCustom()\r\n const diff = target.diff(today, 'day', true)\r\n return Math.round(diff)\r\n } catch {\r\n return defaultValue\r\n }\r\n }\r\n }\r\n return DateExpired\r\n}\r\nexport default CreateDateExpired\r\n\r\nconst Wrap = styled(Box)({\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: '10px',\r\n position: 'relative',\r\n [`.${dateExpiredClasses.switch}`]: {\r\n margin: 0,\r\n flex: '0 0 auto'\r\n },\r\n [`.${dateExpiredClasses.label}`]: {\r\n b: {\r\n color: '#1976d2',\r\n marginLeft: '8px'\r\n }\r\n },\r\n [`.${dateExpiredClasses.labelSwitch}`]: {\r\n fontWeight: 600,\r\n cursor: 'pointer'\r\n },\r\n [`.${dateExpiredClasses.control}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n right: 0,\r\n height: '100%',\r\n display: 'flex',\r\n alignItems: 'center'\r\n },\r\n [`.${dateExpiredClasses.input}`]: {\r\n '.MuiInputBase-input': {\r\n paddingRight: '160px'\r\n }\r\n }\r\n})\r\n"],"names":["defaultFormatString","dateExpiredClasses","root","control","label","labelSwitch","input","CreateDateExpired","params","DateExpired","_Component","props","_this","_classCallCheck","_callSuper","_defineProperty","slots","type","tryParseIntRequired","defaulValue","defaultNumberOfDays","getDaysUntilDate","_this$props","messageErrors","name","onBlur","disabled","state","switchChecked","obj","fullWidth","className","_jsxs","children","_jsx","getOffsetDate","numberOfDays","variant","value","onChange","handleChange","temp","getErrorMessage","error","_temp$message","Boolean","helperText","message","mergeObjects","textFieldProps","e","target","parseInt","setState","num","formatString","arguments","length","undefined","dayjsCustom","add","format","defaultValue","today","diff","Math","round","_unused","getNumberOfDays","id","Date","getTime","toString","_inherits","_createClass","key","get","_this$props$slots","_ref2","_ref","switchCheckedGetter","check","data","_objectSpread","_this$props$defaultVa","_data$name","_this$props2","render","_this$props$name","_this2","LocalizationProvider","dateAdapter","AdapterDayjs","Wrap","hidden","defaultValueInput","TextField","mapTextFieldProps","Typography","component","htmlFor","sx","color","Switch","size","checked","_","Component","styled","Box","display","alignItems","gap","position","concat","margin","flex","b","marginLeft","fontWeight","cursor","top","right","height","paddingRight"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"create.date-expired.js","sources":["../../src/form/create.date-expired.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { LocalizationProvider } from '@mui/x-date-pickers'\r\nimport { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'\r\nimport { Switch, Typography, TextField, styled, Box, TextFieldProps } from '@mui/material'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helper'\r\nimport { dayjsCustom, mergeObjects, tryParseIntRequired } from '../utils'\r\n\r\nconst defaultFormatString = 'MM-DD-YYYY'\r\n\r\nconst dateExpiredClasses = {\r\n root: 'DateExpired-root',\r\n control: 'DateExpired-control',\r\n label: 'DateExpired-label',\r\n labelSwitch: 'DateExpired-labelSwitch',\r\n input: 'DateExpired-input',\r\n switch: 'DateExpired-switch'\r\n}\r\n\r\nexport interface IDateExpiredSlots<T> {\r\n /** @default string */\r\n type?: 'number' | 'string'\r\n textFieldProps?: Partial<TextFieldProps>\r\n switchChecked?: boolean\r\n switchCheckedGetter?: (value: any, model?: Partial<T>) => boolean\r\n}\r\n\r\nexport interface IDateExpiredProps<T> extends IFormInputBase<T> {\r\n slots?: IDateExpiredSlots<T>\r\n}\r\n\r\nexport interface IDateExpiredState {\r\n numberOfDays: number\r\n switchChecked: boolean\r\n}\r\n\r\nfunction CreateDateExpired<T>(params?: IDateExpiredSlots<T>): React.ComponentType<IDateExpiredProps<T>> {\r\n class DateExpired extends Component<IDateExpiredProps<T>, IDateExpiredState> {\r\n defaultNumberOfDays: number = 30\r\n private id\r\n constructor(props: IDateExpiredProps<T>) {\r\n super(props)\r\n this.state = {\r\n numberOfDays: this.getNumberOfDays(),\r\n switchChecked: this.slots.switchChecked\r\n }\r\n this.id = new Date().getTime().toString()\r\n }\r\n\r\n get slots(): IDateExpiredSlots<T> & { switchChecked: boolean } {\r\n const { switchChecked, switchCheckedGetter } = this.props.slots ?? {}\r\n const obj = mergeObjects(params, this.props.slots)\r\n let check = (this.defaulValue ? !!this.defaulValue : switchChecked) ?? true\r\n if (switchCheckedGetter) check = switchCheckedGetter(this.defaulValue, this.props.data)\r\n return { ...obj, switchChecked: check }\r\n }\r\n\r\n get defaulValue(): string {\r\n const { data, name } = this.props\r\n return this.props.defaultValue ?? (!!data && !!name ? data[name]?.toString() : undefined)\r\n }\r\n\r\n get defaultValueInput(): string | number {\r\n if (this.slots.type === 'number') {\r\n return this.state.numberOfDays\r\n } else {\r\n return this.getOffsetDate(this.state.numberOfDays, 'YYYY-MM-DDTHH:mm:ss.sssZ')\r\n }\r\n }\r\n\r\n getNumberOfDays = (): number => {\r\n if (this.slots.type === 'number') {\r\n return tryParseIntRequired(this.defaulValue, this.defaultNumberOfDays)\r\n } else {\r\n return this.getDaysUntilDate(this.defaulValue, this.defaultNumberOfDays)\r\n }\r\n }\r\n\r\n //#region Render\r\n render() {\r\n return (\r\n <LocalizationProvider dateAdapter={AdapterDayjs}>\r\n <Wrap className={dateExpiredClasses.root}>\r\n <input key={this.defaultValueInput} type='text' hidden name={this.props.name?.toString()} defaultValue={this.defaultValueInput} />\r\n <TextField {...this.mapTextFieldProps()} />\r\n <div className={dateExpiredClasses.control}>\r\n <Typography\r\n variant='caption'\r\n className={dateExpiredClasses.labelSwitch}\r\n {...{ component: 'label', htmlFor: this.id }}\r\n sx={{ color: this.state.switchChecked ? 'success.main' : '#767676' }}\r\n >\r\n {this.state.switchChecked ? 'Use Expiration Date' : 'No Expiration'}\r\n </Typography>\r\n <Switch\r\n id={this.id}\r\n size='small'\r\n color='success'\r\n checked={this.state.switchChecked}\r\n onChange={(_, checked) => this.setState({ switchChecked: checked })}\r\n />\r\n </div>\r\n </Wrap>\r\n </LocalizationProvider>\r\n )\r\n }\r\n //#endregion\r\n\r\n mapTextFieldProps = (): TextFieldProps => {\r\n const { messageErrors, name, onBlur } = this.props\r\n const disabled = this.props.disabled || !this.state.switchChecked\r\n const obj: TextFieldProps = {\r\n fullWidth: true,\r\n className: dateExpiredClasses.input,\r\n label: (\r\n <span className={dateExpiredClasses.label}>\r\n Expiry date\r\n {this.state.switchChecked && <b>{this.getOffsetDate(this.state.numberOfDays)}</b>}\r\n </span>\r\n ),\r\n variant: 'outlined',\r\n type: 'number',\r\n disabled: disabled,\r\n value: this.state.switchChecked ? this.state.numberOfDays : 0,\r\n onChange: this.handleChange\r\n }\r\n if (!!name) {\r\n obj.onBlur = () => onBlur && onBlur(name)\r\n const temp = getErrorMessage(messageErrors, name)\r\n if (temp.error) {\r\n obj.error = Boolean(temp.error)\r\n obj.helperText = temp.message ?? ''\r\n }\r\n }\r\n return mergeObjects<TextFieldProps>({}, obj, this.slots.textFieldProps)\r\n }\r\n\r\n handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n const numberOfDays: number = e.target.value != '' ? parseInt(e.target.value) : 0\r\n this.setState({ numberOfDays })\r\n }\r\n\r\n getOffsetDate = (num: number, formatString = defaultFormatString): string => {\r\n return dayjsCustom().add(num, 'day').format(formatString)\r\n }\r\n\r\n getDaysUntilDate = (value?: string, defaultValue = 0): number => {\r\n try {\r\n if (!value) return defaultValue\r\n const target = dayjsCustom(value)\r\n const today = dayjsCustom()\r\n const diff = target.diff(today, 'day', true)\r\n return Math.round(diff)\r\n } catch {\r\n return defaultValue\r\n }\r\n }\r\n }\r\n return DateExpired\r\n}\r\nexport default CreateDateExpired\r\n\r\nconst Wrap = styled(Box)({\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: '10px',\r\n position: 'relative',\r\n [`.${dateExpiredClasses.switch}`]: {\r\n margin: 0,\r\n flex: '0 0 auto'\r\n },\r\n [`.${dateExpiredClasses.label}`]: {\r\n b: {\r\n color: '#1976d2',\r\n marginLeft: '8px'\r\n }\r\n },\r\n [`.${dateExpiredClasses.labelSwitch}`]: {\r\n fontWeight: 600,\r\n cursor: 'pointer'\r\n },\r\n [`.${dateExpiredClasses.control}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n right: 0,\r\n height: '100%',\r\n display: 'flex',\r\n alignItems: 'center'\r\n },\r\n [`.${dateExpiredClasses.input}`]: {\r\n '.MuiInputBase-input': {\r\n paddingRight: '160px'\r\n }\r\n }\r\n})\r\n"],"names":["dateExpiredClasses","CreateDateExpired","params","DateExpired","props","_this","_classCallCheck","_callSuper","_defineProperty","slots","type","tryParseIntRequired","defaulValue","defaultNumberOfDays","getDaysUntilDate","_this$props","messageErrors","name","onBlur","disabled","state","switchChecked","obj","fullWidth","className","label","_jsxs","children","_jsx","getOffsetDate","numberOfDays","variant","value","onChange","handleChange","_temp$message","temp","getErrorMessage","error","Boolean","helperText","message","mergeObjects","textFieldProps","e","target","parseInt","setState","num","formatString","arguments","length","undefined","dayjsCustom","add","format","defaultValue","today","diff","Math","round","_unused","getNumberOfDays","id","Date","getTime","toString","_inherits","Component","_createClass","key","get","_this$props$slots","_ref2","_ref","this","switchCheckedGetter","check","data","_objectSpread","_this$props$defaultVa","_data$name","_this$props2","_this$props$name","_this2","LocalizationProvider","dateAdapter","AdapterDayjs","Wrap","hidden","defaultValueInput","TextField","mapTextFieldProps","Typography","component","htmlFor","sx","color","Switch","size","checked","_","styled","Box","display","alignItems","gap","position","concat","margin","flex","b","marginLeft","fontWeight","cursor","top","right","height","paddingRight"],"mappings":"ypBAQA,IAEMA,EACE,mBADFA,EAEK,sBAFLA,EAGG,oBAHHA,EAIS,0BAJTA,EAKG,oBALHA,EAMI,qBAoBV,SAASC,EAAqBC,GAA6B,IACnDC,aAGJ,SAAAA,EAAYC,GAA2B,IAAAC,EAMI,OANJC,OAAAH,GACrCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAAA,sBAHgB,IAAEG,EAAAH,EAAA,mBAgCd,WAChB,MAAwB,WAApBA,EAAKI,MAAMC,KACNC,EAAoBN,EAAKO,YAAaP,EAAKQ,qBAE3CR,EAAKS,iBAAiBT,EAAKO,YAAaP,EAAKQ,wBAgCxDL,EAAAH,EAAA,qBAEoB,WAClB,IAAAU,EAAwCV,EAAKD,MAArCY,EAAaD,EAAbC,cAAeC,EAAIF,EAAJE,KAAMC,EAAMH,EAANG,OACvBC,EAAWd,EAAKD,MAAMe,WAAad,EAAKe,MAAMC,cAC9CC,EAAsB,CAC1BC,WAAW,EACXC,UAAWxB,EACXyB,MACEC,EAAM,OAAA,CAAAF,UAAWxB,EAEd2B,SAAA,CAAA,cAAAtB,EAAKe,MAAMC,eAAiBO,EAAA,IAAA,CAAAD,SAAItB,EAAKwB,cAAcxB,EAAKe,MAAMU,mBAGnEC,QAAS,WACTrB,KAAM,SACNS,SAAUA,EACVa,MAAO3B,EAAKe,MAAMC,cAAgBhB,EAAKe,MAAMU,aAAe,EAC5DG,SAAU5B,EAAK6B,cAEjB,GAAMjB,EAAM,CACVK,EAAIJ,OAAS,WAAA,OAAMA,GAAUA,EAAOD,EAAK,EACzC,IACgBkB,EADVC,EAAOC,EAAgBrB,EAAeC,GAC5C,GAAImB,EAAKE,MACPhB,EAAIgB,MAAQC,QAAQH,EAAKE,OACzBhB,EAAIkB,WAAyBL,QAAfA,EAAGC,EAAKK,eAAON,IAAAA,EAAAA,EAAI,EAEpC,CACD,OAAOO,EAA6B,CAAA,EAAIpB,EAAKjB,EAAKI,MAAMkC,mBACzDnC,EAAAH,EAEc,gBAAA,SAACuC,GACd,IAAMd,EAAyC,IAAlBc,EAAEC,OAAOb,MAAcc,SAASF,EAAEC,OAAOb,OAAS,EAC/E3B,EAAK0C,SAAS,CAAEjB,aAAAA,OACjBtB,EAAAH,EAEe,iBAAA,SAAC2C,GAA2D,IAA9CC,EAAYC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAtIlB,aAuItB,OAAOG,IAAcC,IAAIN,EAAK,OAAOO,OAAON,MAC7CzC,EAAAH,EAEkB,oBAAA,SAAC2B,GAA4C,IAA5BwB,EAAYN,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,EACjD,IACE,IAAKlB,EAAO,OAAOwB,EACnB,IAAMX,EAASQ,EAAYrB,GACrByB,EAAQJ,IACRK,EAAOb,EAAOa,KAAKD,EAAO,OAAO,GACvC,OAAOE,KAAKC,MAAMF,EACnB,CAAC,MAAAG,GACA,OAAOL,CACR,KAjHDnD,EAAKe,MAAQ,CACXU,aAAczB,EAAKyD,kBACnBzC,cAAehB,EAAKI,MAAMY,eAE5BhB,EAAK0D,IAAK,IAAIC,MAAOC,UAAUC,WAAU7D,CAC3C,CAAC,OAAA8D,EAAAhE,EAVuBiE,GAUvBC,EAAAlE,EAAA,CAAA,CAAAmE,IAAA,QAAAC,IAED,WAAS,IAAAC,EAAAC,EACPC,UAAAF,EAA+CG,KAAKvE,MAAMK,aAAK,IAAA+D,EAAAA,EAAI,CAAE,EAA7DnD,EAAaqD,EAAbrD,cAAeuD,EAAmBF,EAAnBE,oBACjBtD,EAAMoB,EAAaxC,EAAQyE,KAAKvE,MAAMK,OACxCoE,EAA8D,QAAzDJ,EAAIE,KAAK/D,cAAgB+D,KAAK/D,YAAcS,SAAaoD,IAAAA,GAAAA,EAElE,OADIG,IAAqBC,EAAQD,EAAoBD,KAAK/D,YAAa+D,KAAKvE,MAAM0E,OAClFC,EAAAA,EAAA,CAAA,EAAYzD,GAAG,CAAA,EAAA,CAAED,cAAewD,GAClC,GAAC,CAAAP,IAAA,cAAAC,IAED,WAAe,IAAAS,EAAAC,EACbC,EAAuBP,KAAKvE,MAApB0E,EAAII,EAAJJ,KAAM7D,EAAIiE,EAAJjE,KACd,OAA8B+D,QAA9BA,EAAOL,KAAKvE,MAAMoD,wBAAYwB,EAAAA,EAAOF,GAAU7D,EAAiB,QAAbgE,EAAGH,EAAK7D,UAAK,IAAAgE,OAAA,EAAVA,EAAYf,gBAAad,CACjF,GAAC,CAAAkB,IAAA,oBAAAC,IAED,WACE,MAAwB,WAApBI,KAAKlE,MAAMC,KACNiE,KAAKvD,MAAMU,aAEX6C,KAAK9C,cAAc8C,KAAKvD,MAAMU,aAAc,2BAEvD,GAAC,CAAAwC,IAAA,SAAAtC,MAWD,WAAM,IAAAmD,EAAAC,EAAAT,KACJ,OACE/C,EAACyD,EAAqB,CAAAC,YAAaC,EAAY5D,SAC7CD,EAAC8D,GAAKhE,UAAWxB,YACf4B,EAAoC,QAAA,CAAAlB,KAAK,OAAO+E,QAAM,EAACxE,KAAqB,QAAjBkE,EAAER,KAAKvE,MAAMa,YAAXkE,IAAeA,OAAfA,EAAAA,EAAiBjB,WAAYV,aAAcmB,KAAKe,mBAAjGf,KAAKe,mBACjB9D,EAAC+D,EAASZ,KAAKJ,KAAKiB,sBACpBlE,EAAK,MAAA,CAAAF,UAAWxB,EACd2B,SAAA,CAAAC,EAACiE,EAAUd,EAAAA,EAAA,CACThD,QAAQ,UACRP,UAAWxB,GACP,CAAE8F,UAAW,QAASC,QAASpB,KAAKZ,KAAI,CAAA,EAAA,CAC5CiC,GAAI,CAAEC,MAAOtB,KAAKvD,MAAMC,cAAgB,eAAiB,WAAWM,SAEnEgD,KAAKvD,MAAMC,cAAgB,sBAAwB,mBAEtDO,EAACsE,EACC,CAAAnC,GAAIY,KAAKZ,GACToC,KAAK,QACLF,MAAM,UACNG,QAASzB,KAAKvD,MAAMC,cACpBY,SAAU,SAACoE,EAAGD,GAAO,OAAKhB,EAAKrC,SAAS,CAAE1B,cAAe+E,GAAU,WAM/E,IAAC,IAqDH,OAAOjG,CACT,CAGA,IAAMqF,EAAOc,EAAOC,EAAPD,CAAW9F,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CACtBgG,QAAS,OACTC,WAAY,SACZC,IAAK,OACLC,SAAU,YAAU,IAAAC,OACf5G,GAA8B,CACjC6G,OAAQ,EACRC,KAAM,iBACPF,OACI5G,GAA6B,CAChC+G,EAAG,CACDd,MAAO,UACPe,WAAY,aAEfJ,OACI5G,GAAmC,CACtCiH,WAAY,IACZC,OAAQ,gBACTN,OACI5G,GAA+B,CAClC2G,SAAU,WACVQ,IAAK,EACLC,MAAO,EACPC,OAAQ,OACRb,QAAS,OACTC,WAAY,eACbG,OACI5G,GAA6B,CAChC,sBAAuB,CACrBsH,aAAc"}
|