linear-react-components-ui 1.1.24-beta.7 → 1.1.24-rc.0
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/lib/alerts/AlertProvider.js +1 -2
- package/lib/alerts/BaseAlert.js +1 -1
- package/lib/alerts/Message.js +2 -3
- package/lib/alerts/withAlert.js +1 -2
- package/lib/avatar/index.js +9 -11
- package/lib/badge/index.js +4 -4
- package/lib/buttons/Button.js +1 -2
- package/lib/buttons/DangerButton.js +1 -1
- package/lib/buttons/DefaultButton.js +5 -14
- package/lib/buttons/InfoButton.js +1 -1
- package/lib/buttons/PrimaryButton.js +1 -1
- package/lib/buttons/SuccessButton.js +1 -1
- package/lib/buttons/WarningButton.js +1 -1
- package/lib/buttons/button_container/index.js +1 -1
- package/lib/buttons/split_button/index.js +2 -2
- package/lib/calendar/base/Day.js +2 -3
- package/lib/calendar/base/Month.js +1 -1
- package/lib/calendar/base/helpers.js +2 -2
- package/lib/calendar/base/index.js +8 -7
- package/lib/checkbox/index.js +2 -3
- package/lib/dialog/Custom.js +2 -3
- package/lib/dialog/Question.js +5 -4
- package/lib/dialog/base/Content.js +2 -3
- package/lib/dialog/base/Header.js +3 -4
- package/lib/dialog/base/index.js +10 -9
- package/lib/dialog/form/index.js +6 -6
- package/lib/dialog/wizard/index.js +1 -2
- package/lib/dialog/wizard/progressbar.js +1 -1
- package/lib/dialog/wizard/step.js +1 -1
- package/lib/dialog/wizard/useWizard.js +1 -2
- package/lib/drawer/Content.js +1 -2
- package/lib/drawer/Drawer.js +5 -6
- package/lib/drawer/Header.js +2 -3
- package/lib/dropdown/Popup.js +7 -7
- package/lib/dropdown/helper.js +1 -1
- package/lib/dropdown/withDropdown.js +3 -4
- package/lib/fieldset/index.js +8 -9
- package/lib/form/Field.js +2 -3
- package/lib/form/FieldArray.js +2 -3
- package/lib/form/FieldNumber.js +4 -5
- package/lib/form/FieldPeriod.js +3 -4
- package/lib/form/index.js +3 -4
- package/lib/form/withFieldHOC.js +1 -2
- package/lib/form/withFormSecurity.js +1 -2
- package/lib/form2/helpers.js +1 -1
- package/lib/form2/index.d.ts +1 -1
- package/lib/form2/useForm/index.js +17 -11
- package/lib/gridlayout/GridCol.js +5 -5
- package/lib/gridlayout/GridRow.js +1 -4
- package/lib/hint/index.js +1 -7
- package/lib/icons/index.js +9 -9
- package/lib/index-11944b1a.d.ts +26 -0
- package/lib/index-789dd9a5.d.ts +41 -0
- package/lib/index-7ad68789.d.ts +15 -0
- package/lib/inputs/base/InputTextBase.js +9 -8
- package/lib/inputs/base/helpers.js +3 -7
- package/lib/inputs/color/index.js +1 -2
- package/lib/inputs/date/Dropdown.js +6 -4
- package/lib/inputs/date/index.js +31 -19
- package/lib/inputs/errorMessage/index.js +2 -3
- package/lib/inputs/file/DefaultFile.js +7 -7
- package/lib/inputs/file/DragDropFile.js +18 -17
- package/lib/inputs/file/File.js +5 -5
- package/lib/inputs/inputHOC.js +1 -2
- package/lib/inputs/mask/BaseMask.js +1 -2
- package/lib/inputs/mask/Cnpj.js +1 -2
- package/lib/inputs/mask/Cpf.js +1 -2
- package/lib/inputs/multiSelect/ActionButtons.js +1 -2
- package/lib/inputs/multiSelect/Dropdown.js +11 -11
- package/lib/inputs/multiSelect/helper.js +2 -1
- package/lib/inputs/multiSelect/index.js +10 -9
- package/lib/inputs/number/BaseNumber.js +1 -1
- package/lib/inputs/number/index.js +3 -3
- package/lib/inputs/period/Dropdown.js +7 -4
- package/lib/inputs/period/PeriodList.js +1 -1
- package/lib/inputs/period/helper.js +1 -3
- package/lib/inputs/period/index.js +56 -32
- package/lib/inputs/search/index.js +2 -3
- package/lib/inputs/select/ActionButtons.js +1 -1
- package/lib/inputs/select/Dropdown.js +3 -4
- package/lib/inputs/select/helper.js +13 -10
- package/lib/inputs/select/multiple/Selecteds.js +2 -2
- package/lib/inputs/select/multiple/index.js +14 -11
- package/lib/inputs/select/simple/index.js +19 -13
- package/lib/inputs/textarea/index.js +1 -1
- package/lib/inputs2/checkboxfield/index.d.ts +1 -1
- package/lib/inputs2/checkboxfield/index.js +15 -15
- package/lib/inputs2/colorfield/index.js +5 -5
- package/lib/inputs2/date/base/constants.js +2 -1
- package/lib/inputs2/date/base/index.js +5 -6
- package/lib/inputs2/date/datefield/calendarbox.d.ts +1 -1
- package/lib/inputs2/date/datefield/calendarbox.js +3 -2
- package/lib/inputs2/date/datefield/index.js +37 -28
- package/lib/inputs2/date/datefield/triggers.js +1 -2
- package/lib/inputs2/date/dateperiodfield/calendarbox.d.ts +1 -1
- package/lib/inputs2/date/dateperiodfield/calendarbox.js +8 -6
- package/lib/inputs2/date/dateperiodfield/index.js +61 -44
- package/lib/inputs2/date/dateperiodfield/triggers.js +19 -14
- package/lib/inputs2/filefield/index.js +33 -27
- package/lib/inputs2/index.d.ts +3 -3
- package/lib/inputs2/index.js +1 -2
- package/lib/inputs2/mask/BaseMask.js +7 -7
- package/lib/inputs2/mask/Cnpj.js +4 -5
- package/lib/inputs2/mask/Cpf.js +4 -5
- package/lib/inputs2/mask/Phone.js +1 -2
- package/lib/inputs2/mask/ZipCode.js +1 -2
- package/lib/inputs2/numberfield/currency.js +6 -6
- package/lib/inputs2/numberfield/decimal.js +6 -6
- package/lib/inputs2/numberfield/index.js +6 -6
- package/lib/inputs2/radiofield/index.d.ts +1 -1
- package/lib/inputs2/radiofield/index.js +14 -13
- package/lib/inputs2/selectfield/index.d.ts +1 -1
- package/lib/inputs2/selectfield/index.js +71 -54
- package/lib/inputs2/selectfield/item.d.ts +1 -1
- package/lib/inputs2/selectfield/item.js +4 -4
- package/lib/inputs2/selectfield/listbox.d.ts +1 -1
- package/lib/inputs2/selectfield/listbox.js +7 -4
- package/lib/inputs2/selectfield/options.d.ts +1 -1
- package/lib/inputs2/selectfield/search.d.ts +1 -1
- package/lib/inputs2/selectfield/search.js +3 -4
- package/lib/inputs2/selectfield/selections.d.ts +1 -1
- package/lib/inputs2/selectfield/selections.js +3 -2
- package/lib/inputs2/selectfield/triggers.js +6 -5
- package/lib/inputs2/slot/index.d.ts +2 -2
- package/lib/inputs2/textareafield/index.js +21 -18
- package/lib/inputs2/textfield/index.js +15 -14
- package/lib/labelMessages/index.js +4 -6
- package/lib/labels/DefaultLabel.js +2 -6
- package/lib/labels/label_container/index.js +1 -1
- package/lib/list/Header.js +1 -1
- package/lib/list/Item.js +10 -12
- package/lib/list/index.js +2 -4
- package/lib/menus/float/MenuItem.js +3 -4
- package/lib/menus/float/SubMenuContainer.js +2 -3
- package/lib/menus/float/index.js +1 -1
- package/lib/menus/sidenav/ExpandMenu.js +1 -1
- package/lib/menus/sidenav/MenuLink.js +1 -2
- package/lib/menus/sidenav/NavMenuGroup.js +2 -3
- package/lib/menus/sidenav/NavMenuItem.js +10 -9
- package/lib/menus/sidenav/NavSubMenuItem.js +2 -3
- package/lib/menus/sidenav/helpers.js +1 -1
- package/lib/menus/sidenav/index.js +6 -7
- package/lib/menus/sidenav/popup_menu_search/index.js +1 -2
- package/lib/panel/Content.js +9 -8
- package/lib/panel/Default.js +3 -4
- package/lib/panel/Header.js +4 -5
- package/lib/permissionValidations.js +1 -1
- package/lib/popover/PopoverText.js +1 -2
- package/lib/popover/index.js +1 -1
- package/lib/progress/Bar.js +6 -6
- package/lib/radio/index.js +3 -4
- package/lib/shortcuts/index.js +1 -1
- package/lib/skeleton/SkeletonContainer.js +1 -2
- package/lib/skeleton/index.js +1 -4
- package/lib/spinner/index.js +3 -4
- package/lib/split/Split.js +2 -3
- package/lib/split/SplitSide.js +4 -5
- package/lib/table/Body.js +4 -5
- package/lib/table/Header.js +9 -7
- package/lib/table/HeaderColumn.js +2 -3
- package/lib/table/Row.js +4 -5
- package/lib/table/RowColumn.js +2 -3
- package/lib/table/index.js +2 -8
- package/lib/tabs/DropdownTabs.js +2 -3
- package/lib/tabs/Menu.js +1 -1
- package/lib/tabs/MenuTabs.js +4 -9
- package/lib/tabs/Panel.js +8 -7
- package/lib/tabs/context.js +7 -5
- package/lib/tabs/index.js +1 -2
- package/lib/textContent/index.js +2 -3
- package/lib/toolbar/ButtonBar.js +2 -3
- package/lib/toolbar/LabelBar.js +1 -2
- package/lib/toolbar/index.js +1 -1
- package/lib/tooltip/TooltipContent.js +8 -9
- package/lib/tooltip/useTooltip.js +8 -8
- package/lib/treetable/Body.js +2 -3
- package/lib/treetable/Header.js +3 -4
- package/lib/treetable/Row.js +9 -10
- package/lib/treeview/Header.js +1 -1
- package/lib/treeview/Node.js +5 -6
- package/lib/treeview/index.js +5 -6
- package/lib/uitour/index.js +9 -8
- package/package.json +1 -1
- package/lib/index-19761a50.d.ts +0 -26
- package/lib/index-35ba9ed8.d.ts +0 -15
- package/lib/index-efe0a0e4.d.ts +0 -41
|
@@ -21,8 +21,7 @@ var _errorMessage = require("../errorMessage");
|
|
|
21
21
|
var _textContent = _interopRequireDefault(require("../../textContent"));
|
|
22
22
|
var _popover = _interopRequireDefault(require("../../popover"));
|
|
23
23
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
24
|
-
function
|
|
25
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
24
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
26
25
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
27
26
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
28
27
|
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
@@ -66,10 +65,12 @@ const PeriodPicker = props => {
|
|
|
66
65
|
const inputFinalRef = (0, _react.useRef)(null);
|
|
67
66
|
const calendarContainerRef = (0, _react.useRef)(null);
|
|
68
67
|
const onScreenResize = () => {
|
|
69
|
-
|
|
68
|
+
var _inputContainerRef$cu;
|
|
69
|
+
setInputDimensions(inputContainerRef === null || inputContainerRef === void 0 ? void 0 : (_inputContainerRef$cu = inputContainerRef.current) === null || _inputContainerRef$cu === void 0 ? void 0 : _inputContainerRef$cu.getBoundingClientRect());
|
|
70
70
|
};
|
|
71
71
|
const onBlurWithoutWrapper = event => {
|
|
72
|
-
|
|
72
|
+
var _wrapperBaseInputPeri;
|
|
73
|
+
const focusOnAnotherField = !((_wrapperBaseInputPeri = wrapperBaseInputPeriodRef.current) !== null && _wrapperBaseInputPeri !== void 0 && _wrapperBaseInputPeri.contains(event.relatedTarget));
|
|
73
74
|
if (!showCalendarInDialog && showCalendarValueInitial && focusOnAnotherField) {
|
|
74
75
|
setShowCalendarValueInitial(false);
|
|
75
76
|
}
|
|
@@ -87,25 +88,29 @@ const PeriodPicker = props => {
|
|
|
87
88
|
targetElement.focus();
|
|
88
89
|
if (showCalendarValueInitial) {
|
|
89
90
|
if (targetElement.id !== 'valueInitial') {
|
|
90
|
-
|
|
91
|
+
var _inputInitialRef$curr;
|
|
92
|
+
(_inputInitialRef$curr = inputInitialRef.current) === null || _inputInitialRef$curr === void 0 ? void 0 : _inputInitialRef$curr.focus();
|
|
91
93
|
}
|
|
92
94
|
setShowCalendarValueInitial(false);
|
|
93
95
|
}
|
|
94
96
|
if (showCalendarValueFinal) {
|
|
95
97
|
if (targetElement.id !== 'valueFinal') {
|
|
96
|
-
|
|
98
|
+
var _inputFinalRef$curren;
|
|
99
|
+
(_inputFinalRef$curren = inputFinalRef.current) === null || _inputFinalRef$curren === void 0 ? void 0 : _inputFinalRef$curren.focus();
|
|
97
100
|
}
|
|
98
101
|
setShowCalendarValueFinal(false);
|
|
99
102
|
}
|
|
100
103
|
if (showPeriodSelection) {
|
|
104
|
+
var _inputFinalRef$curren2;
|
|
101
105
|
setShowPeriodSelection(false);
|
|
102
|
-
inputFinalRef.current
|
|
106
|
+
(_inputFinalRef$curren2 = inputFinalRef.current) === null || _inputFinalRef$curren2 === void 0 ? void 0 : _inputFinalRef$curren2.focus();
|
|
103
107
|
setShowCalendarValueFinal(false);
|
|
104
108
|
}
|
|
105
109
|
}
|
|
106
110
|
if (calendarContainerRef.current && event && event.key && event.key === 'Tab') {
|
|
107
|
-
|
|
108
|
-
const
|
|
111
|
+
var _calendarContainerRef, _calendarContainerRef2;
|
|
112
|
+
const buttonForNavigateCalendar = (_calendarContainerRef = calendarContainerRef.current) === null || _calendarContainerRef === void 0 ? void 0 : _calendarContainerRef.getElementsByClassName('navbutton');
|
|
113
|
+
const datePicked = (_calendarContainerRef2 = calendarContainerRef.current) === null || _calendarContainerRef2 === void 0 ? void 0 : _calendarContainerRef2.getElementsByClassName('-selectedday');
|
|
109
114
|
const buttonDatePicked = datePicked[0].firstChild;
|
|
110
115
|
const buttonsForFocus = Array.from([...buttonForNavigateCalendar, buttonDatePicked]);
|
|
111
116
|
const firstElement = buttonsForFocus[0];
|
|
@@ -116,34 +121,39 @@ const PeriodPicker = props => {
|
|
|
116
121
|
firstElement.focus();
|
|
117
122
|
}
|
|
118
123
|
if (event.shiftKey && calendarOpenedIsInitial && document.activeElement === firstElement) {
|
|
124
|
+
var _inputInitialRef$curr2;
|
|
119
125
|
event.preventDefault();
|
|
120
|
-
inputInitialRef.current
|
|
126
|
+
(_inputInitialRef$curr2 = inputInitialRef.current) === null || _inputInitialRef$curr2 === void 0 ? void 0 : _inputInitialRef$curr2.focus();
|
|
121
127
|
}
|
|
122
128
|
if (!event.shiftKey && calendarOpenedIsInitial && document.activeElement === lastElement) {
|
|
129
|
+
var _inputFinalRef$curren3;
|
|
123
130
|
event.preventDefault();
|
|
124
|
-
inputFinalRef.current
|
|
131
|
+
(_inputFinalRef$curren3 = inputFinalRef.current) === null || _inputFinalRef$curren3 === void 0 ? void 0 : _inputFinalRef$curren3.focus();
|
|
125
132
|
}
|
|
126
133
|
}
|
|
127
134
|
event.stopPropagation();
|
|
128
135
|
};
|
|
129
136
|
const keepPositionCalendarByScroll = () => {
|
|
130
|
-
|
|
137
|
+
var _inputContainerRef$cu2;
|
|
138
|
+
const inputDateDimensions = (_inputContainerRef$cu2 = inputContainerRef.current) === null || _inputContainerRef$cu2 === void 0 ? void 0 : _inputContainerRef$cu2.getBoundingClientRect();
|
|
131
139
|
const positionTop = inputDateDimensions && inputDateDimensions.bottom;
|
|
132
140
|
if (dropdownCalendarContainer && dropdownCalendarContainer.current && inputDateDimensions) {
|
|
133
141
|
dropdownCalendarContainer.current.style.top = String(positionTop).concat('px');
|
|
134
142
|
}
|
|
135
143
|
};
|
|
136
144
|
(0, _react.useEffect)(() => {
|
|
145
|
+
var _document$getElementB;
|
|
137
146
|
window.addEventListener('resize', onScreenResize);
|
|
138
147
|
document.addEventListener('scroll', keepPositionCalendarByScroll);
|
|
139
|
-
document.getElementById('modal-dialog-content')
|
|
148
|
+
(_document$getElementB = document.getElementById('modal-dialog-content')) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.addEventListener('scroll', keepPositionCalendarByScroll);
|
|
140
149
|
if (inputContainerRef.current) onScreenResize();
|
|
141
150
|
if (inputInitialRef && inputInitialRef.current) inputInitialRef.current.id = idValueInitial;
|
|
142
151
|
if (inputFinalRef && inputFinalRef.current) inputFinalRef.current.id = idValueFinal;
|
|
143
152
|
return () => {
|
|
153
|
+
var _document$getElementB2;
|
|
144
154
|
window.removeEventListener('resize', onScreenResize);
|
|
145
155
|
document.removeEventListener('scroll', keepPositionCalendarByScroll);
|
|
146
|
-
document.getElementById('modal-dialog-content')
|
|
156
|
+
(_document$getElementB2 = document.getElementById('modal-dialog-content')) === null || _document$getElementB2 === void 0 ? void 0 : _document$getElementB2.removeEventListener('scroll', keepPositionCalendarByScroll);
|
|
147
157
|
};
|
|
148
158
|
}, []);
|
|
149
159
|
(0, _react.useEffect)(() => {
|
|
@@ -175,10 +185,12 @@ const PeriodPicker = props => {
|
|
|
175
185
|
setCurrentTypeDate('valueInitial');
|
|
176
186
|
setShowCalendarValueFinal(false);
|
|
177
187
|
if (!showCalendarValueInitial) {
|
|
178
|
-
|
|
188
|
+
var _inputInitialRef$curr3;
|
|
189
|
+
(_inputInitialRef$curr3 = inputInitialRef.current) === null || _inputInitialRef$curr3 === void 0 ? void 0 : _inputInitialRef$curr3.focus();
|
|
179
190
|
if (showCalendarInDialog) {
|
|
180
191
|
setTimeout(() => {
|
|
181
|
-
|
|
192
|
+
var _currentDateButtonRef;
|
|
193
|
+
(_currentDateButtonRef = currentDateButtonRef.current) === null || _currentDateButtonRef === void 0 ? void 0 : _currentDateButtonRef.focus();
|
|
182
194
|
}, 100);
|
|
183
195
|
}
|
|
184
196
|
setShowCalendarValueInitial(true);
|
|
@@ -188,10 +200,12 @@ const PeriodPicker = props => {
|
|
|
188
200
|
setCurrentTypeDate('valueFinal');
|
|
189
201
|
setShowCalendarValueInitial(false);
|
|
190
202
|
if (!showCalendarValueFinal) {
|
|
191
|
-
|
|
203
|
+
var _inputFinalRef$curren4;
|
|
204
|
+
(_inputFinalRef$curren4 = inputFinalRef.current) === null || _inputFinalRef$curren4 === void 0 ? void 0 : _inputFinalRef$curren4.focus();
|
|
192
205
|
if (showCalendarInDialog) {
|
|
193
206
|
setTimeout(() => {
|
|
194
|
-
|
|
207
|
+
var _currentDateButtonRef2;
|
|
208
|
+
(_currentDateButtonRef2 = currentDateButtonRef.current) === null || _currentDateButtonRef2 === void 0 ? void 0 : _currentDateButtonRef2.focus();
|
|
195
209
|
}, 100);
|
|
196
210
|
}
|
|
197
211
|
setShowCalendarValueFinal(true);
|
|
@@ -203,10 +217,12 @@ const PeriodPicker = props => {
|
|
|
203
217
|
};
|
|
204
218
|
const closeCalendar = calendarName => {
|
|
205
219
|
if (calendarName === 'valueInitial') {
|
|
206
|
-
|
|
220
|
+
var _inputInitialRef$curr4;
|
|
221
|
+
(_inputInitialRef$curr4 = inputInitialRef.current) === null || _inputInitialRef$curr4 === void 0 ? void 0 : _inputInitialRef$curr4.focus();
|
|
207
222
|
}
|
|
208
223
|
if (calendarName === 'valueFinal') {
|
|
209
|
-
|
|
224
|
+
var _inputFinalRef$curren5;
|
|
225
|
+
(_inputFinalRef$curren5 = inputFinalRef.current) === null || _inputFinalRef$curren5 === void 0 ? void 0 : _inputFinalRef$curren5.focus();
|
|
210
226
|
}
|
|
211
227
|
setShowCalendarValueInitial(false);
|
|
212
228
|
setShowCalendarValueFinal(false);
|
|
@@ -214,16 +230,19 @@ const PeriodPicker = props => {
|
|
|
214
230
|
const onCloseDateDialog = calendarName => {
|
|
215
231
|
setTimeout(() => {
|
|
216
232
|
if (calendarName === 'valueInitial') {
|
|
217
|
-
|
|
233
|
+
var _inputInitialRef$curr5;
|
|
234
|
+
(_inputInitialRef$curr5 = inputInitialRef.current) === null || _inputInitialRef$curr5 === void 0 ? void 0 : _inputInitialRef$curr5.focus();
|
|
218
235
|
setShowCalendarValueInitial(false);
|
|
219
236
|
}
|
|
220
237
|
if (calendarName === 'valueFinal') {
|
|
221
|
-
|
|
238
|
+
var _inputFinalRef$curren6;
|
|
239
|
+
(_inputFinalRef$curren6 = inputFinalRef.current) === null || _inputFinalRef$curren6 === void 0 ? void 0 : _inputFinalRef$curren6.focus();
|
|
222
240
|
setShowCalendarValueFinal(false);
|
|
223
241
|
}
|
|
224
242
|
if (calendarName === 'periodSelection') {
|
|
243
|
+
var _inputFinalRef$curren7;
|
|
225
244
|
setShowPeriodSelection(false);
|
|
226
|
-
inputFinalRef.current
|
|
245
|
+
(_inputFinalRef$curren7 = inputFinalRef.current) === null || _inputFinalRef$curren7 === void 0 ? void 0 : _inputFinalRef$curren7.focus();
|
|
227
246
|
setShowCalendarValueFinal(false);
|
|
228
247
|
}
|
|
229
248
|
}, 100);
|
|
@@ -263,11 +282,12 @@ const PeriodPicker = props => {
|
|
|
263
282
|
}
|
|
264
283
|
};
|
|
265
284
|
const setValue = function (event, value) {
|
|
285
|
+
var _inputInitialRef$curr6, _inputFinalRef$curren8;
|
|
266
286
|
let shouldOpenDropdown = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
|
|
267
287
|
const valueDateName = event ? event.target.name : '';
|
|
268
288
|
const dateObj = (0, _moment.default)(value, 'DD/MM/YYYY');
|
|
269
|
-
if (showCalendarValueInitial) inputInitialRef.current
|
|
270
|
-
if (showCalendarValueFinal) inputFinalRef.current
|
|
289
|
+
if (showCalendarValueInitial) (_inputInitialRef$curr6 = inputInitialRef.current) === null || _inputInitialRef$curr6 === void 0 ? void 0 : _inputInitialRef$curr6.focus();
|
|
290
|
+
if (showCalendarValueFinal) (_inputFinalRef$curren8 = inputFinalRef.current) === null || _inputFinalRef$curren8 === void 0 ? void 0 : _inputFinalRef$curren8.focus();
|
|
271
291
|
if (valueDateName === 'valueFinal' && valueInitial && dateObj.isBefore(valueInitial)) {
|
|
272
292
|
setValueInitial(dateObj);
|
|
273
293
|
setValueFinal(valueInitial);
|
|
@@ -296,7 +316,8 @@ const PeriodPicker = props => {
|
|
|
296
316
|
});
|
|
297
317
|
}
|
|
298
318
|
if (valueDateName === 'valueInitial' && !valueFinal && shouldOpenDropdown) {
|
|
299
|
-
|
|
319
|
+
var _inputFinalRef$curren9;
|
|
320
|
+
(_inputFinalRef$curren9 = inputFinalRef.current) === null || _inputFinalRef$curren9 === void 0 ? void 0 : _inputFinalRef$curren9.focus();
|
|
300
321
|
setTimeout(() => setShowCalendarValueFinal(true), 100);
|
|
301
322
|
}
|
|
302
323
|
if (shouldCloseOnSelect) {
|
|
@@ -346,8 +367,9 @@ const PeriodPicker = props => {
|
|
|
346
367
|
}
|
|
347
368
|
};
|
|
348
369
|
const closePeriodSelection = () => {
|
|
370
|
+
var _inputFinalRef$curren0;
|
|
349
371
|
setShowPeriodSelection(false);
|
|
350
|
-
inputFinalRef.current
|
|
372
|
+
(_inputFinalRef$curren0 = inputFinalRef.current) === null || _inputFinalRef$curren0 === void 0 ? void 0 : _inputFinalRef$curren0.focus();
|
|
351
373
|
setShowCalendarValueFinal(false);
|
|
352
374
|
};
|
|
353
375
|
const getButtonSelectPeriod = (0, _react.useCallback)(() => {
|
|
@@ -380,8 +402,10 @@ const PeriodPicker = props => {
|
|
|
380
402
|
currentDateButton: buttonElement => currentDateButtonRef.current = buttonElement
|
|
381
403
|
});
|
|
382
404
|
const setPeriodDates = (selected, dates) => {
|
|
405
|
+
var _inputFinalRef$curren1;
|
|
383
406
|
if (selected === 'custom') {
|
|
384
|
-
|
|
407
|
+
var _inputInitialRef$curr7;
|
|
408
|
+
(_inputInitialRef$curr7 = inputInitialRef.current) === null || _inputInitialRef$curr7 === void 0 ? void 0 : _inputInitialRef$curr7.focus();
|
|
385
409
|
setValuePeriodSelection(selected);
|
|
386
410
|
setShowPeriodSelection(false);
|
|
387
411
|
return;
|
|
@@ -394,7 +418,7 @@ const PeriodPicker = props => {
|
|
|
394
418
|
if (shouldCloseOnSelect) {
|
|
395
419
|
setShowPeriodSelection(false);
|
|
396
420
|
}
|
|
397
|
-
inputFinalRef.current
|
|
421
|
+
(_inputFinalRef$curren1 = inputFinalRef.current) === null || _inputFinalRef$curren1 === void 0 ? void 0 : _inputFinalRef$curren1.focus();
|
|
398
422
|
setShowCalendarValueFinal(false);
|
|
399
423
|
};
|
|
400
424
|
const getCalendarInitial = () => {
|
|
@@ -469,7 +493,7 @@ const PeriodPicker = props => {
|
|
|
469
493
|
display: 'flex'
|
|
470
494
|
}
|
|
471
495
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
472
|
-
className:
|
|
496
|
+
className: "label ".concat(props.customClassForLabel, " ").concat(props.labelUppercase && ' -uppercase'),
|
|
473
497
|
style: {
|
|
474
498
|
alignSelf: 'center'
|
|
475
499
|
}
|
|
@@ -486,10 +510,10 @@ const PeriodPicker = props => {
|
|
|
486
510
|
width: 20
|
|
487
511
|
}
|
|
488
512
|
}, hint))), /*#__PURE__*/_react.default.createElement(_textContent.default, null)), /*#__PURE__*/_react.default.createElement("div", {
|
|
489
|
-
className:
|
|
513
|
+
className: "periodpicker-component ".concat(helperBase.getInputWrapperClass(_objectSpread(_objectSpread({}, props), {}, {
|
|
490
514
|
value: !valueInitial ? '' : (0, _moment.default)(valueInitial).format('DD/MM/YYYY'),
|
|
491
515
|
disabled: shouldDisable()
|
|
492
|
-
}))
|
|
516
|
+
}))),
|
|
493
517
|
ref: inputContainerRef
|
|
494
518
|
}, /*#__PURE__*/_react.default.createElement(_BaseMask.default, {
|
|
495
519
|
gridLayout: undefined,
|
|
@@ -12,8 +12,7 @@ require("../../assets/styles/search.scss");
|
|
|
12
12
|
var _drawer = _interopRequireWildcard(require("../../drawer"));
|
|
13
13
|
const _excluded = ["headerTitle", "content", "onStateChange"];
|
|
14
14
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
|
-
function
|
|
16
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
15
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
17
16
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
18
17
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
19
18
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
@@ -49,7 +48,7 @@ const SearchField = props => {
|
|
|
49
48
|
};
|
|
50
49
|
const shouldDisable = () => props.disabled || onDenied && (onDenied.disabled || onDenied.hideContent);
|
|
51
50
|
const shouldBeReadOnly = () => props.readOnly || onDenied && onDenied.readOnly;
|
|
52
|
-
const hideContent = onDenied
|
|
51
|
+
const hideContent = onDenied === null || onDenied === void 0 ? void 0 : onDenied.hideContent;
|
|
53
52
|
const buttonProps = () => {
|
|
54
53
|
const disableCallbacks = shouldBeReadOnly() || shouldDisable() || hideContent;
|
|
55
54
|
let propsButton = {
|
|
@@ -17,7 +17,7 @@ const ActionButtons = props => {
|
|
|
17
17
|
customClassForSideButtons
|
|
18
18
|
} = props;
|
|
19
19
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
20
|
-
className:
|
|
20
|
+
className: "actionbuttonsselect ".concat(customClassForSideButtons)
|
|
21
21
|
}, showClearButton && /*#__PURE__*/_react.default.createElement("button", {
|
|
22
22
|
disabled: disabled,
|
|
23
23
|
tabIndex: -1,
|
|
@@ -10,8 +10,7 @@ var _avatar = _interopRequireDefault(require("../../avatar"));
|
|
|
10
10
|
var helper = _interopRequireWildcard(require("./helper"));
|
|
11
11
|
var _Popup = _interopRequireDefault(require("../../dropdown/Popup"));
|
|
12
12
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
13
|
-
function
|
|
14
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
13
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
15
14
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
16
15
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
17
16
|
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
@@ -50,7 +49,7 @@ const Dropdown = props => {
|
|
|
50
49
|
align: "left",
|
|
51
50
|
leftPosition: dropdownDynamicStyles.left,
|
|
52
51
|
topPosition: dropdownDynamicStyles.top,
|
|
53
|
-
targetRef: selectFieldRef
|
|
52
|
+
targetRef: selectFieldRef === null || selectFieldRef === void 0 ? void 0 : selectFieldRef.current
|
|
54
53
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
55
54
|
className: "select-dropdown",
|
|
56
55
|
ref: dropdownRef,
|
|
@@ -82,7 +81,7 @@ const Dropdown = props => {
|
|
|
82
81
|
const disabled = currents && currents.length > 0 ? currents.some(s => s[idKey] === item[idKey]) : false;
|
|
83
82
|
const itemSelected = Boolean(selected && selected[idKey] === item[idKey]);
|
|
84
83
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
85
|
-
key:
|
|
84
|
+
key: "dropdowmIten ".concat(item[idKey], "}"),
|
|
86
85
|
className: helper.getDropdownItemCssClass(itemSelected, disabled, striped)
|
|
87
86
|
}, /*#__PURE__*/_react.default.createElement("button", {
|
|
88
87
|
className: "menubutton",
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.returnDropdownDynamicStyles = exports.getFilteredSimpleDataCombo = exports.getFilteredMultipleDataCombo = exports.getDropdownItemCssClass = exports.contentClass = void 0;
|
|
7
|
-
const contentClass = props =>
|
|
7
|
+
const contentClass = props => "content ".concat(props.showClearButton ? '' : 'noclear');
|
|
8
8
|
exports.contentClass = contentClass;
|
|
9
9
|
const getDropdownItemCssClass = (selected, disabled, striped) => {
|
|
10
10
|
let className = 'item';
|
|
@@ -21,10 +21,12 @@ const getFilteredSimpleDataCombo = _ref => {
|
|
|
21
21
|
inputText
|
|
22
22
|
} = _ref;
|
|
23
23
|
return dataSource && dataSource.filter(item => {
|
|
24
|
+
var _descriptionKey;
|
|
24
25
|
if (typeof descriptionKey === 'string') {
|
|
25
|
-
|
|
26
|
+
var _item$descriptionKey;
|
|
27
|
+
return ((_item$descriptionKey = item[descriptionKey]) === null || _item$descriptionKey === void 0 ? void 0 : _item$descriptionKey.toLowerCase().indexOf(inputText === null || inputText === void 0 ? void 0 : inputText.toString().toLowerCase())) > -1;
|
|
26
28
|
}
|
|
27
|
-
return descriptionKey(item)
|
|
29
|
+
return ((_descriptionKey = descriptionKey(item)) === null || _descriptionKey === void 0 ? void 0 : _descriptionKey.toLowerCase().indexOf(inputText === null || inputText === void 0 ? void 0 : inputText.toString().toLowerCase())) > -1;
|
|
28
30
|
});
|
|
29
31
|
};
|
|
30
32
|
exports.getFilteredSimpleDataCombo = getFilteredSimpleDataCombo;
|
|
@@ -36,10 +38,11 @@ const getFilteredMultipleDataCombo = _ref2 => {
|
|
|
36
38
|
currents
|
|
37
39
|
} = _ref2;
|
|
38
40
|
return dataSource.filter(item => {
|
|
41
|
+
var _descriptionKey2;
|
|
39
42
|
if (typeof descriptionKey === 'string') {
|
|
40
|
-
return item[descriptionKey].toLowerCase().indexOf(inputText
|
|
43
|
+
return item[descriptionKey].toLowerCase().indexOf(inputText === null || inputText === void 0 ? void 0 : inputText.toString().toLowerCase()) > -1 && !currents.includes(item);
|
|
41
44
|
}
|
|
42
|
-
return descriptionKey(item)
|
|
45
|
+
return ((_descriptionKey2 = descriptionKey(item)) === null || _descriptionKey2 === void 0 ? void 0 : _descriptionKey2.toLowerCase().indexOf(inputText === null || inputText === void 0 ? void 0 : inputText.toString().toLowerCase())) > -1 && !currents.includes(item);
|
|
43
46
|
});
|
|
44
47
|
};
|
|
45
48
|
exports.getFilteredMultipleDataCombo = getFilteredMultipleDataCombo;
|
|
@@ -51,7 +54,7 @@ const returnDropdownPosition = function (_ref3) {
|
|
|
51
54
|
} = _ref3;
|
|
52
55
|
let aboveDropdown = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
53
56
|
const DEFAULT_MARGIN_BOTTOM = 10;
|
|
54
|
-
if (aboveDropdown && dropdownRef
|
|
57
|
+
if (aboveDropdown && dropdownRef !== null && dropdownRef !== void 0 && dropdownRef.current && dropdownRects !== null && dropdownRects !== void 0 && dropdownRects.height) {
|
|
55
58
|
return selectFieldRects.top + window.scrollY - (dropdownRef.current && dropdownRects.height) - DEFAULT_MARGIN_BOTTOM;
|
|
56
59
|
}
|
|
57
60
|
return selectFieldRects.top + window.scrollY + selectFieldRects.height;
|
|
@@ -62,10 +65,10 @@ const returnDropdownDynamicStyles = _ref4 => {
|
|
|
62
65
|
dropdownMaxHeight,
|
|
63
66
|
dropdownRef
|
|
64
67
|
} = _ref4;
|
|
65
|
-
const selectFieldRects = selectFieldRef
|
|
66
|
-
const dropdownRects = dropdownRef
|
|
67
|
-
const selectFieldRectsBottom = selectFieldRects ? selectFieldRects
|
|
68
|
-
const selectFieldRectsTop = selectFieldRects ? selectFieldRects
|
|
68
|
+
const selectFieldRects = selectFieldRef !== null && selectFieldRef !== void 0 && selectFieldRef.current ? selectFieldRef.current.getBoundingClientRect() : undefined;
|
|
69
|
+
const dropdownRects = dropdownRef !== null && dropdownRef !== void 0 && dropdownRef.current ? dropdownRef.current.getBoundingClientRect() : undefined;
|
|
70
|
+
const selectFieldRectsBottom = selectFieldRects ? selectFieldRects === null || selectFieldRects === void 0 ? void 0 : selectFieldRects.bottom : 0;
|
|
71
|
+
const selectFieldRectsTop = selectFieldRects ? selectFieldRects === null || selectFieldRects === void 0 ? void 0 : selectFieldRects.top : 0;
|
|
69
72
|
const dropdownBottomDistance = window.innerHeight - selectFieldRectsBottom;
|
|
70
73
|
const bottomOffset = 30;
|
|
71
74
|
let maxDropdownBottomDistance = 200;
|
|
@@ -15,8 +15,8 @@ const Selecteds = _ref => {
|
|
|
15
15
|
handlerOnUnselect
|
|
16
16
|
} = _ref;
|
|
17
17
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, currents.map(selected => /*#__PURE__*/_react.default.createElement("div", {
|
|
18
|
-
className:
|
|
19
|
-
key:
|
|
18
|
+
className: "selecteditem ".concat(disabled ? '-disabled' : ''),
|
|
19
|
+
key: "selected-".concat(selected[idKey])
|
|
20
20
|
}, typeof descriptionKey === 'string' ? selected[descriptionKey] : descriptionKey(selected), /*#__PURE__*/_react.default.createElement("button", {
|
|
21
21
|
disabled: disabled,
|
|
22
22
|
className: "close",
|
|
@@ -15,8 +15,7 @@ var _InputTextBase = _interopRequireDefault(require("../../base/InputTextBase"))
|
|
|
15
15
|
var _helper = require("../helper");
|
|
16
16
|
var _hint = _interopRequireDefault(require("../../../hint"));
|
|
17
17
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
18
|
-
function
|
|
19
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
18
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
20
19
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
21
20
|
const MultipleSelect = props => {
|
|
22
21
|
const {
|
|
@@ -45,7 +44,7 @@ const MultipleSelect = props => {
|
|
|
45
44
|
const [insideComponent, setInsideComponent] = (0, _react.useState)(false);
|
|
46
45
|
const [onDenied, setOnDeniedSelect] = (0, _react.useState)();
|
|
47
46
|
const [valueFromProps, setValueFromProps] = (0, _react.useState)([]);
|
|
48
|
-
const componentId =
|
|
47
|
+
const componentId = "select-component".concat(uuid.v1());
|
|
49
48
|
const componentRef = (0, _react.useRef)(null);
|
|
50
49
|
const dropdownRef = (0, _react.useRef)(null);
|
|
51
50
|
const selectWrapper = (0, _react.useRef)();
|
|
@@ -65,10 +64,11 @@ const MultipleSelect = props => {
|
|
|
65
64
|
}
|
|
66
65
|
};
|
|
67
66
|
const onMouseMove = event => {
|
|
67
|
+
var _dropdownRef$current, _dropdownRef$current$;
|
|
68
68
|
const target = event.target;
|
|
69
|
-
const idDropdown = dropdownRef.current
|
|
69
|
+
const idDropdown = ((_dropdownRef$current = dropdownRef.current) === null || _dropdownRef$current === void 0 ? void 0 : (_dropdownRef$current$ = _dropdownRef$current.parentElement) === null || _dropdownRef$current$ === void 0 ? void 0 : _dropdownRef$current$.id) || '';
|
|
70
70
|
const dropdownElement = document.getElementById(idDropdown);
|
|
71
|
-
const keepDropdownOpen = Boolean(dropdownElement
|
|
71
|
+
const keepDropdownOpen = Boolean(dropdownElement === null || dropdownElement === void 0 ? void 0 : dropdownElement.contains(target));
|
|
72
72
|
setInsideComponent(keepDropdownOpen);
|
|
73
73
|
};
|
|
74
74
|
const onClearClick = () => {
|
|
@@ -105,6 +105,7 @@ const MultipleSelect = props => {
|
|
|
105
105
|
setDropdownWidth(dropdownWidthFocus);
|
|
106
106
|
};
|
|
107
107
|
const onSelect = select => {
|
|
108
|
+
var _dropdownRef$current2;
|
|
108
109
|
if (select === null) return;
|
|
109
110
|
const currentsSelect = [...currents, select];
|
|
110
111
|
setCurrents(currentsSelect);
|
|
@@ -112,16 +113,17 @@ const MultipleSelect = props => {
|
|
|
112
113
|
setInputValue([]);
|
|
113
114
|
if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();
|
|
114
115
|
if (props.onSelect) setSelected(props.onSelect(currentsSelect.map(i => i[idKey])));
|
|
115
|
-
dropdownRef.current
|
|
116
|
+
(_dropdownRef$current2 = dropdownRef.current) === null || _dropdownRef$current2 === void 0 ? void 0 : _dropdownRef$current2.focus();
|
|
116
117
|
};
|
|
117
118
|
const onUnselect = id => {
|
|
118
119
|
if (currents) {
|
|
120
|
+
var _dropdownRef$current3;
|
|
119
121
|
const result = currents.filter(item => item[idKey] !== id);
|
|
120
122
|
setCurrents(result);
|
|
121
123
|
if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();
|
|
122
124
|
setOpened(false);
|
|
123
125
|
if (props.onSelect) setSelected(props.onSelect(result.map(i => i[idKey])));
|
|
124
|
-
dropdownRef.current
|
|
126
|
+
(_dropdownRef$current3 = dropdownRef.current) === null || _dropdownRef$current3 === void 0 ? void 0 : _dropdownRef$current3.focus();
|
|
125
127
|
}
|
|
126
128
|
};
|
|
127
129
|
const onOpenClose = () => {
|
|
@@ -141,7 +143,8 @@ const MultipleSelect = props => {
|
|
|
141
143
|
const onInputKeyDown = e => {
|
|
142
144
|
if (e.keyCode) {
|
|
143
145
|
if ((e.keyCode === constants.keyCodes.ENTER || e.key === constants.keys.TAB) && selected && opened) {
|
|
144
|
-
|
|
146
|
+
var _e$preventDefault;
|
|
147
|
+
if (e.keyCode === constants.keyCodes.ENTER) (_e$preventDefault = e.preventDefault) === null || _e$preventDefault === void 0 ? void 0 : _e$preventDefault.call(e);
|
|
145
148
|
if (!currents.some(current => current[idKey] === selected[idKey])) {
|
|
146
149
|
onSelect(selected);
|
|
147
150
|
}
|
|
@@ -188,7 +191,7 @@ const MultipleSelect = props => {
|
|
|
188
191
|
}, []);
|
|
189
192
|
(0, _react.useEffect)(() => {
|
|
190
193
|
if (props.gridLayout) {
|
|
191
|
-
const gridEl = document.querySelector(
|
|
194
|
+
const gridEl = document.querySelector("#".concat(componentId, ">.-withinput.grid-container"));
|
|
192
195
|
if (gridElRef.current !== gridEl && gridEl) gridElRef.current = gridEl;
|
|
193
196
|
}
|
|
194
197
|
}, []);
|
|
@@ -241,8 +244,8 @@ const MultipleSelect = props => {
|
|
|
241
244
|
onClick: onFocus,
|
|
242
245
|
onKeyDown: onInputKeyDown,
|
|
243
246
|
customClassForLabel: customClassForLabel,
|
|
244
|
-
customClassForWrapper:
|
|
245
|
-
customClassForInputContent:
|
|
247
|
+
customClassForWrapper: "selectwrapper ".concat((props.readOnly || shouldDisable() || shouldBeReadOnly()) && ' -undigitable', " ").concat(customClassForWrapper),
|
|
248
|
+
customClassForInputContent: "multiselect ".concat(customClassForInputContent),
|
|
246
249
|
inputBaseRef: r => {
|
|
247
250
|
selectWrapper.current = r;
|
|
248
251
|
},
|
|
@@ -13,8 +13,7 @@ var constants = _interopRequireWildcard(require("../../../internals/constants"))
|
|
|
13
13
|
var _helper = require("../helper");
|
|
14
14
|
var _InputTextBase = _interopRequireDefault(require("../../base/InputTextBase"));
|
|
15
15
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
|
-
function
|
|
17
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
16
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
18
17
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
19
18
|
const SimpleSelect = props => {
|
|
20
19
|
const {
|
|
@@ -55,7 +54,7 @@ const SimpleSelect = props => {
|
|
|
55
54
|
const [onDenied, setOnDeniedSelect] = (0, _react.useState)();
|
|
56
55
|
const [isTyping, setIsTyping] = (0, _react.useState)(false);
|
|
57
56
|
const dropdownRef = (0, _react.useRef)(null);
|
|
58
|
-
const componentId =
|
|
57
|
+
const componentId = "select-component-".concat(name, "-").concat(uuid.v1());
|
|
59
58
|
const componentRef = (0, _react.useRef)(null);
|
|
60
59
|
const selectWrapper = (0, _react.useRef)();
|
|
61
60
|
const gridElement = (0, _react.useRef)();
|
|
@@ -64,18 +63,20 @@ const SimpleSelect = props => {
|
|
|
64
63
|
if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);
|
|
65
64
|
};
|
|
66
65
|
const onClickOutside = event => {
|
|
66
|
+
var _selectWrapper$curren, _dropdownRef$current;
|
|
67
67
|
const {
|
|
68
68
|
target
|
|
69
69
|
} = event;
|
|
70
|
-
if (target !== selectWrapper.current && !selectWrapper.current
|
|
70
|
+
if (target !== selectWrapper.current && !((_selectWrapper$curren = selectWrapper.current) !== null && _selectWrapper$curren !== void 0 && _selectWrapper$curren.contains(target)) && !((_dropdownRef$current = dropdownRef.current) !== null && _dropdownRef$current !== void 0 && _dropdownRef$current.contains(target))) {
|
|
71
71
|
setOpened(false);
|
|
72
72
|
}
|
|
73
73
|
};
|
|
74
74
|
const onMouseMove = event => {
|
|
75
|
+
var _dropdownRef$current2, _dropdownRef$current3;
|
|
75
76
|
const target = event.target;
|
|
76
|
-
const idDropdown = dropdownRef.current
|
|
77
|
+
const idDropdown = ((_dropdownRef$current2 = dropdownRef.current) === null || _dropdownRef$current2 === void 0 ? void 0 : (_dropdownRef$current3 = _dropdownRef$current2.parentElement) === null || _dropdownRef$current3 === void 0 ? void 0 : _dropdownRef$current3.id) || '';
|
|
77
78
|
const dropdownElement = document.getElementById(idDropdown);
|
|
78
|
-
const keepDropdownOpen = Boolean(dropdownElement
|
|
79
|
+
const keepDropdownOpen = Boolean(dropdownElement === null || dropdownElement === void 0 ? void 0 : dropdownElement.contains(target));
|
|
79
80
|
setInsideComponent(keepDropdownOpen);
|
|
80
81
|
};
|
|
81
82
|
const getSelectEvent = selectedEvent => ({
|
|
@@ -115,6 +116,7 @@ const SimpleSelect = props => {
|
|
|
115
116
|
}
|
|
116
117
|
};
|
|
117
118
|
const onSelect = selectedDropdown => {
|
|
119
|
+
var _dropdownRef$current4;
|
|
118
120
|
if (!selectedDropdown) return;
|
|
119
121
|
setSelected(selectedDropdown);
|
|
120
122
|
if (descriptionKeyIsString) setInputText(selectedDropdown[descriptionKey]);else setInputText(descriptionKey(selectedDropdown));
|
|
@@ -124,7 +126,7 @@ const SimpleSelect = props => {
|
|
|
124
126
|
if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();
|
|
125
127
|
setOpened(false);
|
|
126
128
|
});
|
|
127
|
-
dropdownRef.current
|
|
129
|
+
(_dropdownRef$current4 = dropdownRef.current) === null || _dropdownRef$current4 === void 0 ? void 0 : _dropdownRef$current4.focus();
|
|
128
130
|
};
|
|
129
131
|
const onOpenClose = () => {
|
|
130
132
|
setOpened(prevState => !prevState);
|
|
@@ -160,7 +162,8 @@ const SimpleSelect = props => {
|
|
|
160
162
|
const onInputKeyDown = e => {
|
|
161
163
|
if (e.keyCode) {
|
|
162
164
|
if ((e.keyCode === constants.keyCodes.ENTER || e.key === constants.keys.TAB) && selected && opened) {
|
|
163
|
-
|
|
165
|
+
var _e$preventDefault;
|
|
166
|
+
if (e.keyCode === constants.keyCodes.ENTER) (_e$preventDefault = e.preventDefault) === null || _e$preventDefault === void 0 ? void 0 : _e$preventDefault.call(e);
|
|
164
167
|
onSelect(selected);
|
|
165
168
|
} else if ([constants.keyCodes.ARROW_UP, constants.keyCodes.ARROW_DOWN].includes(e.keyCode)) {
|
|
166
169
|
if (!opened) setOpened(true);
|
|
@@ -168,7 +171,7 @@ const SimpleSelect = props => {
|
|
|
168
171
|
if (e.keyCode === constants.keyCodes.ARROW_DOWN) {
|
|
169
172
|
index = dataCombo && index === dataCombo.length - 1 ? 0 : index + 1;
|
|
170
173
|
} else {
|
|
171
|
-
index = dataCombo && index === 0 ? dataCombo
|
|
174
|
+
index = dataCombo && index === 0 ? (dataCombo === null || dataCombo === void 0 ? void 0 : dataCombo.length) - 1 : index - 1;
|
|
172
175
|
}
|
|
173
176
|
setSelected(dataCombo[index]);
|
|
174
177
|
if (descriptionKeyIsString) setInputText(dataCombo[index][descriptionKey]);
|
|
@@ -205,7 +208,7 @@ const SimpleSelect = props => {
|
|
|
205
208
|
}, []);
|
|
206
209
|
(0, _react.useEffect)(() => {
|
|
207
210
|
if (gridLayout) {
|
|
208
|
-
const gridEl = document.querySelector(
|
|
211
|
+
const gridEl = document.querySelector("#".concat(componentId, ">.-withinput.grid-container"));
|
|
209
212
|
if (gridElement.current !== gridEl && gridEl) gridElement.current = gridEl;
|
|
210
213
|
}
|
|
211
214
|
}, [gridLayout]);
|
|
@@ -213,7 +216,10 @@ const SimpleSelect = props => {
|
|
|
213
216
|
if (dataSourceWithAllOptions.length > 0) {
|
|
214
217
|
let newCurrent = null;
|
|
215
218
|
if (value || value === 0) {
|
|
216
|
-
newCurrent = dataSourceWithAllOptions.find(i =>
|
|
219
|
+
newCurrent = dataSourceWithAllOptions.find(i => {
|
|
220
|
+
var _i$idKey;
|
|
221
|
+
return (value || value === 0) && ((_i$idKey = i[idKey]) === null || _i$idKey === void 0 ? void 0 : _i$idKey.toString().toLowerCase()) === (value === null || value === void 0 ? void 0 : value.toString().toLowerCase());
|
|
222
|
+
});
|
|
217
223
|
} else if (dataSourceWithAllOptions.length > 0 && selectFirstOnEnter) {
|
|
218
224
|
newCurrent = dataSourceWithAllOptions[0];
|
|
219
225
|
}
|
|
@@ -270,8 +276,8 @@ const SimpleSelect = props => {
|
|
|
270
276
|
onClick: onFocus,
|
|
271
277
|
onKeyDown: onInputKeyDown,
|
|
272
278
|
customClassForLabel: customClassForLabel,
|
|
273
|
-
customClassForWrapper:
|
|
274
|
-
customClassForInputContent:
|
|
279
|
+
customClassForWrapper: "selectwrapper ".concat((undigitable || searchOnDropdown || shouldBeReadOnly()) && ' -undigitable', " ").concat(customClassForWrapper),
|
|
280
|
+
customClassForInputContent: "multiselect ".concat(customClassForInputContent),
|
|
275
281
|
inputBaseRef: r => {
|
|
276
282
|
selectWrapper.current = r;
|
|
277
283
|
},
|
|
@@ -4,4 +4,4 @@ import '../../@types/ColorStyles.js';
|
|
|
4
4
|
import '../../tooltip/types.js';
|
|
5
5
|
import '../../@types/Position.js';
|
|
6
6
|
import '../../@types/PermissionAttr.js';
|
|
7
|
-
export { C as CheckboxFieldInputProps, I as Input } from '../../index-
|
|
7
|
+
export { C as CheckboxFieldInputProps, I as Input } from '../../index-789dd9a5.js';
|