@rolster/react-components 18.14.1 → 18.15.2
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/cjs/assets/{index--xgdaD5z.css → index-Dbh6DUCn.css} +66 -96
- package/dist/cjs/index.js +1790 -1180
- package/dist/cjs/index.js.map +1 -1
- package/dist/es/assets/{index--xgdaD5z.css → index-Dbh6DUCn.css} +66 -96
- package/dist/es/index.js +1674 -1064
- package/dist/es/index.js.map +1 -1
- package/dist/esm/components/atoms/Amount/Amount.js +1 -1
- package/dist/esm/components/atoms/Amount/Amount.js.map +1 -1
- package/dist/esm/components/atoms/Avatar/Avatar.css +1 -1
- package/dist/esm/components/atoms/Button/Button.d.ts +2 -2
- package/dist/esm/components/atoms/CheckBox/CheckBox.js +2 -2
- package/dist/esm/components/atoms/CheckBox/CheckBox.js.map +1 -1
- package/dist/esm/components/atoms/Input/Input.js +4 -7
- package/dist/esm/components/atoms/Input/Input.js.map +1 -1
- package/dist/esm/components/atoms/InputMoney/InputMoney.css +2 -0
- package/dist/esm/components/atoms/InputMoney/InputMoney.js +2 -2
- package/dist/esm/components/atoms/InputMoney/InputMoney.js.map +1 -1
- package/dist/esm/components/atoms/InputNumber/InputNumber.js +2 -2
- package/dist/esm/components/atoms/InputPassword/InputPassword.js +1 -4
- package/dist/esm/components/atoms/InputPassword/InputPassword.js.map +1 -1
- package/dist/esm/components/atoms/{SearchInput/SearchInput.css → InputSearch/InputSearch.css} +1 -2
- package/dist/esm/components/atoms/InputSearch/InputSearch.d.ts +9 -0
- package/dist/esm/components/atoms/{SearchInput/SearchInput.js → InputSearch/InputSearch.js} +4 -4
- package/dist/esm/components/atoms/{SearchInput/SearchInput.js.map → InputSearch/InputSearch.js.map} +1 -1
- package/dist/esm/components/atoms/InputText/InputText.js +2 -2
- package/dist/esm/components/atoms/InputText/InputText.js.map +1 -1
- package/dist/esm/components/atoms/Label/Label.css +6 -0
- package/dist/esm/components/atoms/Poster/Poster.css +4 -3
- package/dist/esm/components/atoms/ProgressBar/ProgressBar.css +1 -2
- package/dist/esm/components/atoms/RadioButton/RadioButton.css +0 -1
- package/dist/esm/components/atoms/Skeleton/Skeleton.css +3 -4
- package/dist/esm/components/atoms/SkeletonText/SkeletonText.css +8 -48
- package/dist/esm/components/atoms/SkeletonText/SkeletonText.js +2 -2
- package/dist/esm/components/atoms/SkeletonText/SkeletonText.js.map +1 -1
- package/dist/esm/components/atoms/Switch/Switch.js +2 -2
- package/dist/esm/components/atoms/TabularText/TabularText.css +5 -2
- package/dist/esm/components/atoms/index.d.ts +1 -1
- package/dist/esm/components/atoms/index.js +1 -1
- package/dist/esm/components/atoms/index.js.map +1 -1
- package/dist/esm/components/molecules/Ballot/Ballot.css +1 -1
- package/dist/esm/components/molecules/ButtonToggle/ButtonToggle.d.ts +2 -2
- package/dist/esm/components/molecules/ButtonToggle/ButtonToggle.js.map +1 -1
- package/dist/esm/components/molecules/FieldMoney/FieldMoney.js +1 -1
- package/dist/esm/components/molecules/FieldMoney/FieldMoney.js.map +1 -1
- package/dist/esm/components/molecules/FieldNumber/FieldNumber.js +1 -1
- package/dist/esm/components/molecules/FieldNumber/FieldNumber.js.map +1 -1
- package/dist/esm/components/molecules/FieldPassword/FieldPassword.js +1 -1
- package/dist/esm/components/molecules/FieldPassword/FieldPassword.js.map +1 -1
- package/dist/esm/components/molecules/FieldText/FieldText.js +1 -1
- package/dist/esm/components/molecules/FieldText/FieldText.js.map +1 -1
- package/dist/esm/components/molecules/LabelCheckBox/LabelCheckBox.js +4 -4
- package/dist/esm/components/molecules/LabelCheckBox/LabelCheckBox.js.map +1 -1
- package/dist/esm/components/molecules/LabelRadioButton/LabelRadioButton.js +4 -4
- package/dist/esm/components/molecules/LabelRadioButton/LabelRadioButton.js.map +1 -1
- package/dist/esm/components/molecules/LabelSwitch/LabelSwitch.js +4 -4
- package/dist/esm/components/molecules/LabelSwitch/LabelSwitch.js.map +1 -1
- package/dist/esm/components/molecules/MessageFormError/{MesageFormError.js → MessageFormError.js} +1 -1
- package/dist/esm/components/molecules/MessageFormError/MessageFormError.js.map +1 -0
- package/dist/esm/components/molecules/Pagination/Pagination.d.ts +7 -19
- package/dist/esm/components/molecules/Pagination/Pagination.js +42 -198
- package/dist/esm/components/molecules/Pagination/Pagination.js.map +1 -1
- package/dist/esm/components/molecules/PickerDay/PickerDay.css +5 -3
- package/dist/esm/components/molecules/PickerDay/PickerDay.js +9 -9
- package/dist/esm/components/molecules/PickerDay/PickerDay.js.map +1 -1
- package/dist/esm/components/molecules/PickerDayRange/PickerDayRange.d.ts +1 -1
- package/dist/esm/components/molecules/PickerDayRange/PickerDayRange.js +6 -6
- package/dist/esm/components/molecules/PickerDayRange/PickerDayRange.js.map +1 -1
- package/dist/esm/components/molecules/PickerMonth/PickerMonth.js +8 -8
- package/dist/esm/components/molecules/PickerMonth/PickerMonth.js.map +1 -1
- package/dist/esm/components/molecules/PickerMonthTitle/PickerMonthTitle.css +1 -1
- package/dist/esm/components/molecules/PickerMonthTitle/PickerMonthTitle.js +19 -19
- package/dist/esm/components/molecules/PickerMonthTitle/PickerMonthTitle.js.map +1 -1
- package/dist/esm/components/molecules/PickerYear/PickerYear.css +8 -3
- package/dist/esm/components/molecules/PickerYear/PickerYear.js +8 -8
- package/dist/esm/components/molecules/PickerYear/PickerYear.js.map +1 -1
- package/dist/esm/components/molecules/index.d.ts +1 -1
- package/dist/esm/components/molecules/index.js +1 -1
- package/dist/esm/components/molecules/index.js.map +1 -1
- package/dist/esm/components/organisms/Confirmation/Confirmation.css +15 -12
- package/dist/esm/components/organisms/Confirmation/Confirmation.d.ts +1 -1
- package/dist/esm/components/organisms/Confirmation/Confirmation.js +2 -10
- package/dist/esm/components/organisms/Confirmation/Confirmation.js.map +1 -1
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocomplete.d.ts +8 -8
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocomplete.js +14 -14
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocomplete.js.map +1 -1
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocompleteHook.d.ts +4 -4
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocompleteHook.js +6 -6
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocompleteHook.js.map +1 -1
- package/dist/esm/components/organisms/FieldDate/FieldDate.d.ts +3 -2
- package/dist/esm/components/organisms/FieldDate/FieldDate.js +19 -22
- package/dist/esm/components/organisms/FieldDate/FieldDate.js.map +1 -1
- package/dist/esm/components/organisms/FieldDateRange/FieldDateRange.d.ts +2 -2
- package/dist/esm/components/organisms/FieldDateRange/FieldDateRange.js +3 -3
- package/dist/esm/components/organisms/FieldDateRange/FieldDateRange.js.map +1 -1
- package/dist/esm/components/organisms/FieldSelect/FieldSelect.d.ts +6 -6
- package/dist/esm/components/organisms/FieldSelect/FieldSelect.js +9 -9
- package/dist/esm/components/organisms/FieldSelect/FieldSelect.js.map +1 -1
- package/dist/esm/components/organisms/FieldSelect/FieldSelectHook.d.ts +2 -2
- package/dist/esm/components/organisms/FieldSelect/FieldSelectHook.js +4 -4
- package/dist/esm/components/organisms/FieldSelect/FieldSelectHook.js.map +1 -1
- package/dist/esm/components/organisms/PickerDate/PickerDate.css +1 -3
- package/dist/esm/components/organisms/PickerDate/PickerDate.d.ts +2 -2
- package/dist/esm/components/organisms/PickerDate/PickerDate.js +26 -26
- package/dist/esm/components/organisms/PickerDate/PickerDate.js.map +1 -1
- package/dist/esm/components/organisms/PickerDateRange/PickerDateRange.d.ts +3 -3
- package/dist/esm/components/organisms/PickerDateRange/PickerDateRange.js +15 -15
- package/dist/esm/components/organisms/PickerDateRange/PickerDateRange.js.map +1 -1
- package/dist/esm/helpers/date-range-picker.d.ts +1 -1
- package/dist/esm/helpers/date-range-picker.js +1 -1
- package/dist/esm/helpers/date-range-picker.js.map +1 -1
- package/dist/esm/hooks/DatatableHook.js +7 -4
- package/dist/esm/hooks/DatatableHook.js.map +1 -1
- package/dist/esm/hooks/ListControlHook.d.ts +14 -12
- package/dist/esm/hooks/ListControlHook.js +44 -36
- package/dist/esm/hooks/ListControlHook.js.map +1 -1
- package/package.json +19 -18
- package/dist/esm/components/atoms/SearchInput/SearchInput.d.ts +0 -9
- package/dist/esm/components/molecules/MessageFormError/MesageFormError.css +0 -0
- package/dist/esm/components/molecules/MessageFormError/MesageFormError.js.map +0 -1
- /package/dist/esm/components/molecules/MessageFormError/{MesageFormError.d.ts → MessageFormError.d.ts} +0 -0
package/dist/cjs/index.js
CHANGED
|
@@ -1,15 +1,1361 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var helpersDate = require('@rolster/helpers-date');
|
|
3
|
+
var require$$0 = require('react');
|
|
4
|
+
var commons = require('@rolster/commons');
|
|
5
|
+
var components = require('@rolster/components');
|
|
6
|
+
var dates = require('@rolster/dates');
|
|
8
7
|
var ReactDOM = require('react-dom');
|
|
9
8
|
var i18n = require('@rolster/i18n');
|
|
10
|
-
var
|
|
11
|
-
|
|
12
|
-
var
|
|
9
|
+
var reactForms = require('@rolster/react-forms');
|
|
10
|
+
|
|
11
|
+
var jsxRuntime = {exports: {}};
|
|
12
|
+
|
|
13
|
+
var reactJsxRuntime_production_min = {};
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* @license React
|
|
17
|
+
* react-jsx-runtime.production.min.js
|
|
18
|
+
*
|
|
19
|
+
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
20
|
+
*
|
|
21
|
+
* This source code is licensed under the MIT license found in the
|
|
22
|
+
* LICENSE file in the root directory of this source tree.
|
|
23
|
+
*/
|
|
24
|
+
|
|
25
|
+
var hasRequiredReactJsxRuntime_production_min;
|
|
26
|
+
|
|
27
|
+
function requireReactJsxRuntime_production_min () {
|
|
28
|
+
if (hasRequiredReactJsxRuntime_production_min) return reactJsxRuntime_production_min;
|
|
29
|
+
hasRequiredReactJsxRuntime_production_min = 1;
|
|
30
|
+
var f=require$$0,k=Symbol.for("react.element"),l=Symbol.for("react.fragment"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};
|
|
31
|
+
function q(c,a,g){var b,d={},e=null,h=null;void 0!==g&&(e=""+g);void 0!==a.key&&(e=""+a.key);void 0!==a.ref&&(h=a.ref);for(b in a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return {$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}reactJsxRuntime_production_min.Fragment=l;reactJsxRuntime_production_min.jsx=q;reactJsxRuntime_production_min.jsxs=q;
|
|
32
|
+
return reactJsxRuntime_production_min;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
var reactJsxRuntime_development = {};
|
|
36
|
+
|
|
37
|
+
/**
|
|
38
|
+
* @license React
|
|
39
|
+
* react-jsx-runtime.development.js
|
|
40
|
+
*
|
|
41
|
+
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
42
|
+
*
|
|
43
|
+
* This source code is licensed under the MIT license found in the
|
|
44
|
+
* LICENSE file in the root directory of this source tree.
|
|
45
|
+
*/
|
|
46
|
+
|
|
47
|
+
var hasRequiredReactJsxRuntime_development;
|
|
48
|
+
|
|
49
|
+
function requireReactJsxRuntime_development () {
|
|
50
|
+
if (hasRequiredReactJsxRuntime_development) return reactJsxRuntime_development;
|
|
51
|
+
hasRequiredReactJsxRuntime_development = 1;
|
|
52
|
+
|
|
53
|
+
if (process.env.NODE_ENV !== "production") {
|
|
54
|
+
(function() {
|
|
55
|
+
|
|
56
|
+
var React = require$$0;
|
|
57
|
+
|
|
58
|
+
// ATTENTION
|
|
59
|
+
// When adding new symbols to this file,
|
|
60
|
+
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
|
|
61
|
+
// The Symbol used to tag the ReactElement-like types.
|
|
62
|
+
var REACT_ELEMENT_TYPE = Symbol.for('react.element');
|
|
63
|
+
var REACT_PORTAL_TYPE = Symbol.for('react.portal');
|
|
64
|
+
var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
|
|
65
|
+
var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode');
|
|
66
|
+
var REACT_PROFILER_TYPE = Symbol.for('react.profiler');
|
|
67
|
+
var REACT_PROVIDER_TYPE = Symbol.for('react.provider');
|
|
68
|
+
var REACT_CONTEXT_TYPE = Symbol.for('react.context');
|
|
69
|
+
var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref');
|
|
70
|
+
var REACT_SUSPENSE_TYPE = Symbol.for('react.suspense');
|
|
71
|
+
var REACT_SUSPENSE_LIST_TYPE = Symbol.for('react.suspense_list');
|
|
72
|
+
var REACT_MEMO_TYPE = Symbol.for('react.memo');
|
|
73
|
+
var REACT_LAZY_TYPE = Symbol.for('react.lazy');
|
|
74
|
+
var REACT_OFFSCREEN_TYPE = Symbol.for('react.offscreen');
|
|
75
|
+
var MAYBE_ITERATOR_SYMBOL = Symbol.iterator;
|
|
76
|
+
var FAUX_ITERATOR_SYMBOL = '@@iterator';
|
|
77
|
+
function getIteratorFn(maybeIterable) {
|
|
78
|
+
if (maybeIterable === null || typeof maybeIterable !== 'object') {
|
|
79
|
+
return null;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
|
|
83
|
+
|
|
84
|
+
if (typeof maybeIterator === 'function') {
|
|
85
|
+
return maybeIterator;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
return null;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
var ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
|
92
|
+
|
|
93
|
+
function error(format) {
|
|
94
|
+
{
|
|
95
|
+
{
|
|
96
|
+
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
|
97
|
+
args[_key2 - 1] = arguments[_key2];
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
printWarning('error', format, args);
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
function printWarning(level, format, args) {
|
|
106
|
+
// When changing this logic, you might want to also
|
|
107
|
+
// update consoleWithStackDev.www.js as well.
|
|
108
|
+
{
|
|
109
|
+
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
110
|
+
var stack = ReactDebugCurrentFrame.getStackAddendum();
|
|
111
|
+
|
|
112
|
+
if (stack !== '') {
|
|
113
|
+
format += '%s';
|
|
114
|
+
args = args.concat([stack]);
|
|
115
|
+
} // eslint-disable-next-line react-internal/safe-string-coercion
|
|
116
|
+
|
|
117
|
+
|
|
118
|
+
var argsWithFormat = args.map(function (item) {
|
|
119
|
+
return String(item);
|
|
120
|
+
}); // Careful: RN currently depends on this prefix
|
|
121
|
+
|
|
122
|
+
argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
|
|
123
|
+
// breaks IE9: https://github.com/facebook/react/issues/13610
|
|
124
|
+
// eslint-disable-next-line react-internal/no-production-logging
|
|
125
|
+
|
|
126
|
+
Function.prototype.apply.call(console[level], console, argsWithFormat);
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
// -----------------------------------------------------------------------------
|
|
131
|
+
|
|
132
|
+
var enableScopeAPI = false; // Experimental Create Event Handle API.
|
|
133
|
+
var enableCacheElement = false;
|
|
134
|
+
var enableTransitionTracing = false; // No known bugs, but needs performance testing
|
|
135
|
+
|
|
136
|
+
var enableLegacyHidden = false; // Enables unstable_avoidThisFallback feature in Fiber
|
|
137
|
+
// stuff. Intended to enable React core members to more easily debug scheduling
|
|
138
|
+
// issues in DEV builds.
|
|
139
|
+
|
|
140
|
+
var enableDebugTracing = false; // Track which Fiber(s) schedule render work.
|
|
141
|
+
|
|
142
|
+
var REACT_MODULE_REFERENCE;
|
|
143
|
+
|
|
144
|
+
{
|
|
145
|
+
REACT_MODULE_REFERENCE = Symbol.for('react.module.reference');
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
function isValidElementType(type) {
|
|
149
|
+
if (typeof type === 'string' || typeof type === 'function') {
|
|
150
|
+
return true;
|
|
151
|
+
} // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
|
|
152
|
+
|
|
153
|
+
|
|
154
|
+
if (type === REACT_FRAGMENT_TYPE || type === REACT_PROFILER_TYPE || enableDebugTracing || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || enableLegacyHidden || type === REACT_OFFSCREEN_TYPE || enableScopeAPI || enableCacheElement || enableTransitionTracing ) {
|
|
155
|
+
return true;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
if (typeof type === 'object' && type !== null) {
|
|
159
|
+
if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || // This needs to include all possible module reference object
|
|
160
|
+
// types supported by any Flight configuration anywhere since
|
|
161
|
+
// we don't know which Flight build this will end up being used
|
|
162
|
+
// with.
|
|
163
|
+
type.$$typeof === REACT_MODULE_REFERENCE || type.getModuleId !== undefined) {
|
|
164
|
+
return true;
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
return false;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
function getWrappedName(outerType, innerType, wrapperName) {
|
|
172
|
+
var displayName = outerType.displayName;
|
|
173
|
+
|
|
174
|
+
if (displayName) {
|
|
175
|
+
return displayName;
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
var functionName = innerType.displayName || innerType.name || '';
|
|
179
|
+
return functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName;
|
|
180
|
+
} // Keep in sync with react-reconciler/getComponentNameFromFiber
|
|
181
|
+
|
|
182
|
+
|
|
183
|
+
function getContextName(type) {
|
|
184
|
+
return type.displayName || 'Context';
|
|
185
|
+
} // Note that the reconciler package should generally prefer to use getComponentNameFromFiber() instead.
|
|
186
|
+
|
|
187
|
+
|
|
188
|
+
function getComponentNameFromType(type) {
|
|
189
|
+
if (type == null) {
|
|
190
|
+
// Host root, text node or just invalid type.
|
|
191
|
+
return null;
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
{
|
|
195
|
+
if (typeof type.tag === 'number') {
|
|
196
|
+
error('Received an unexpected object in getComponentNameFromType(). ' + 'This is likely a bug in React. Please file an issue.');
|
|
197
|
+
}
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
if (typeof type === 'function') {
|
|
201
|
+
return type.displayName || type.name || null;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
if (typeof type === 'string') {
|
|
205
|
+
return type;
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
switch (type) {
|
|
209
|
+
case REACT_FRAGMENT_TYPE:
|
|
210
|
+
return 'Fragment';
|
|
211
|
+
|
|
212
|
+
case REACT_PORTAL_TYPE:
|
|
213
|
+
return 'Portal';
|
|
214
|
+
|
|
215
|
+
case REACT_PROFILER_TYPE:
|
|
216
|
+
return 'Profiler';
|
|
217
|
+
|
|
218
|
+
case REACT_STRICT_MODE_TYPE:
|
|
219
|
+
return 'StrictMode';
|
|
220
|
+
|
|
221
|
+
case REACT_SUSPENSE_TYPE:
|
|
222
|
+
return 'Suspense';
|
|
223
|
+
|
|
224
|
+
case REACT_SUSPENSE_LIST_TYPE:
|
|
225
|
+
return 'SuspenseList';
|
|
226
|
+
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
if (typeof type === 'object') {
|
|
230
|
+
switch (type.$$typeof) {
|
|
231
|
+
case REACT_CONTEXT_TYPE:
|
|
232
|
+
var context = type;
|
|
233
|
+
return getContextName(context) + '.Consumer';
|
|
234
|
+
|
|
235
|
+
case REACT_PROVIDER_TYPE:
|
|
236
|
+
var provider = type;
|
|
237
|
+
return getContextName(provider._context) + '.Provider';
|
|
238
|
+
|
|
239
|
+
case REACT_FORWARD_REF_TYPE:
|
|
240
|
+
return getWrappedName(type, type.render, 'ForwardRef');
|
|
241
|
+
|
|
242
|
+
case REACT_MEMO_TYPE:
|
|
243
|
+
var outerName = type.displayName || null;
|
|
244
|
+
|
|
245
|
+
if (outerName !== null) {
|
|
246
|
+
return outerName;
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
return getComponentNameFromType(type.type) || 'Memo';
|
|
250
|
+
|
|
251
|
+
case REACT_LAZY_TYPE:
|
|
252
|
+
{
|
|
253
|
+
var lazyComponent = type;
|
|
254
|
+
var payload = lazyComponent._payload;
|
|
255
|
+
var init = lazyComponent._init;
|
|
256
|
+
|
|
257
|
+
try {
|
|
258
|
+
return getComponentNameFromType(init(payload));
|
|
259
|
+
} catch (x) {
|
|
260
|
+
return null;
|
|
261
|
+
}
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
// eslint-disable-next-line no-fallthrough
|
|
265
|
+
}
|
|
266
|
+
}
|
|
267
|
+
|
|
268
|
+
return null;
|
|
269
|
+
}
|
|
270
|
+
|
|
271
|
+
var assign = Object.assign;
|
|
272
|
+
|
|
273
|
+
// Helpers to patch console.logs to avoid logging during side-effect free
|
|
274
|
+
// replaying on render function. This currently only patches the object
|
|
275
|
+
// lazily which won't cover if the log function was extracted eagerly.
|
|
276
|
+
// We could also eagerly patch the method.
|
|
277
|
+
var disabledDepth = 0;
|
|
278
|
+
var prevLog;
|
|
279
|
+
var prevInfo;
|
|
280
|
+
var prevWarn;
|
|
281
|
+
var prevError;
|
|
282
|
+
var prevGroup;
|
|
283
|
+
var prevGroupCollapsed;
|
|
284
|
+
var prevGroupEnd;
|
|
285
|
+
|
|
286
|
+
function disabledLog() {}
|
|
287
|
+
|
|
288
|
+
disabledLog.__reactDisabledLog = true;
|
|
289
|
+
function disableLogs() {
|
|
290
|
+
{
|
|
291
|
+
if (disabledDepth === 0) {
|
|
292
|
+
/* eslint-disable react-internal/no-production-logging */
|
|
293
|
+
prevLog = console.log;
|
|
294
|
+
prevInfo = console.info;
|
|
295
|
+
prevWarn = console.warn;
|
|
296
|
+
prevError = console.error;
|
|
297
|
+
prevGroup = console.group;
|
|
298
|
+
prevGroupCollapsed = console.groupCollapsed;
|
|
299
|
+
prevGroupEnd = console.groupEnd; // https://github.com/facebook/react/issues/19099
|
|
300
|
+
|
|
301
|
+
var props = {
|
|
302
|
+
configurable: true,
|
|
303
|
+
enumerable: true,
|
|
304
|
+
value: disabledLog,
|
|
305
|
+
writable: true
|
|
306
|
+
}; // $FlowFixMe Flow thinks console is immutable.
|
|
307
|
+
|
|
308
|
+
Object.defineProperties(console, {
|
|
309
|
+
info: props,
|
|
310
|
+
log: props,
|
|
311
|
+
warn: props,
|
|
312
|
+
error: props,
|
|
313
|
+
group: props,
|
|
314
|
+
groupCollapsed: props,
|
|
315
|
+
groupEnd: props
|
|
316
|
+
});
|
|
317
|
+
/* eslint-enable react-internal/no-production-logging */
|
|
318
|
+
}
|
|
319
|
+
|
|
320
|
+
disabledDepth++;
|
|
321
|
+
}
|
|
322
|
+
}
|
|
323
|
+
function reenableLogs() {
|
|
324
|
+
{
|
|
325
|
+
disabledDepth--;
|
|
326
|
+
|
|
327
|
+
if (disabledDepth === 0) {
|
|
328
|
+
/* eslint-disable react-internal/no-production-logging */
|
|
329
|
+
var props = {
|
|
330
|
+
configurable: true,
|
|
331
|
+
enumerable: true,
|
|
332
|
+
writable: true
|
|
333
|
+
}; // $FlowFixMe Flow thinks console is immutable.
|
|
334
|
+
|
|
335
|
+
Object.defineProperties(console, {
|
|
336
|
+
log: assign({}, props, {
|
|
337
|
+
value: prevLog
|
|
338
|
+
}),
|
|
339
|
+
info: assign({}, props, {
|
|
340
|
+
value: prevInfo
|
|
341
|
+
}),
|
|
342
|
+
warn: assign({}, props, {
|
|
343
|
+
value: prevWarn
|
|
344
|
+
}),
|
|
345
|
+
error: assign({}, props, {
|
|
346
|
+
value: prevError
|
|
347
|
+
}),
|
|
348
|
+
group: assign({}, props, {
|
|
349
|
+
value: prevGroup
|
|
350
|
+
}),
|
|
351
|
+
groupCollapsed: assign({}, props, {
|
|
352
|
+
value: prevGroupCollapsed
|
|
353
|
+
}),
|
|
354
|
+
groupEnd: assign({}, props, {
|
|
355
|
+
value: prevGroupEnd
|
|
356
|
+
})
|
|
357
|
+
});
|
|
358
|
+
/* eslint-enable react-internal/no-production-logging */
|
|
359
|
+
}
|
|
360
|
+
|
|
361
|
+
if (disabledDepth < 0) {
|
|
362
|
+
error('disabledDepth fell below zero. ' + 'This is a bug in React. Please file an issue.');
|
|
363
|
+
}
|
|
364
|
+
}
|
|
365
|
+
}
|
|
366
|
+
|
|
367
|
+
var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
|
|
368
|
+
var prefix;
|
|
369
|
+
function describeBuiltInComponentFrame(name, source, ownerFn) {
|
|
370
|
+
{
|
|
371
|
+
if (prefix === undefined) {
|
|
372
|
+
// Extract the VM specific prefix used by each line.
|
|
373
|
+
try {
|
|
374
|
+
throw Error();
|
|
375
|
+
} catch (x) {
|
|
376
|
+
var match = x.stack.trim().match(/\n( *(at )?)/);
|
|
377
|
+
prefix = match && match[1] || '';
|
|
378
|
+
}
|
|
379
|
+
} // We use the prefix to ensure our stacks line up with native stack frames.
|
|
380
|
+
|
|
381
|
+
|
|
382
|
+
return '\n' + prefix + name;
|
|
383
|
+
}
|
|
384
|
+
}
|
|
385
|
+
var reentry = false;
|
|
386
|
+
var componentFrameCache;
|
|
387
|
+
|
|
388
|
+
{
|
|
389
|
+
var PossiblyWeakMap = typeof WeakMap === 'function' ? WeakMap : Map;
|
|
390
|
+
componentFrameCache = new PossiblyWeakMap();
|
|
391
|
+
}
|
|
392
|
+
|
|
393
|
+
function describeNativeComponentFrame(fn, construct) {
|
|
394
|
+
// If something asked for a stack inside a fake render, it should get ignored.
|
|
395
|
+
if ( !fn || reentry) {
|
|
396
|
+
return '';
|
|
397
|
+
}
|
|
398
|
+
|
|
399
|
+
{
|
|
400
|
+
var frame = componentFrameCache.get(fn);
|
|
401
|
+
|
|
402
|
+
if (frame !== undefined) {
|
|
403
|
+
return frame;
|
|
404
|
+
}
|
|
405
|
+
}
|
|
406
|
+
|
|
407
|
+
var control;
|
|
408
|
+
reentry = true;
|
|
409
|
+
var previousPrepareStackTrace = Error.prepareStackTrace; // $FlowFixMe It does accept undefined.
|
|
410
|
+
|
|
411
|
+
Error.prepareStackTrace = undefined;
|
|
412
|
+
var previousDispatcher;
|
|
413
|
+
|
|
414
|
+
{
|
|
415
|
+
previousDispatcher = ReactCurrentDispatcher.current; // Set the dispatcher in DEV because this might be call in the render function
|
|
416
|
+
// for warnings.
|
|
417
|
+
|
|
418
|
+
ReactCurrentDispatcher.current = null;
|
|
419
|
+
disableLogs();
|
|
420
|
+
}
|
|
421
|
+
|
|
422
|
+
try {
|
|
423
|
+
// This should throw.
|
|
424
|
+
if (construct) {
|
|
425
|
+
// Something should be setting the props in the constructor.
|
|
426
|
+
var Fake = function () {
|
|
427
|
+
throw Error();
|
|
428
|
+
}; // $FlowFixMe
|
|
429
|
+
|
|
430
|
+
|
|
431
|
+
Object.defineProperty(Fake.prototype, 'props', {
|
|
432
|
+
set: function () {
|
|
433
|
+
// We use a throwing setter instead of frozen or non-writable props
|
|
434
|
+
// because that won't throw in a non-strict mode function.
|
|
435
|
+
throw Error();
|
|
436
|
+
}
|
|
437
|
+
});
|
|
438
|
+
|
|
439
|
+
if (typeof Reflect === 'object' && Reflect.construct) {
|
|
440
|
+
// We construct a different control for this case to include any extra
|
|
441
|
+
// frames added by the construct call.
|
|
442
|
+
try {
|
|
443
|
+
Reflect.construct(Fake, []);
|
|
444
|
+
} catch (x) {
|
|
445
|
+
control = x;
|
|
446
|
+
}
|
|
447
|
+
|
|
448
|
+
Reflect.construct(fn, [], Fake);
|
|
449
|
+
} else {
|
|
450
|
+
try {
|
|
451
|
+
Fake.call();
|
|
452
|
+
} catch (x) {
|
|
453
|
+
control = x;
|
|
454
|
+
}
|
|
455
|
+
|
|
456
|
+
fn.call(Fake.prototype);
|
|
457
|
+
}
|
|
458
|
+
} else {
|
|
459
|
+
try {
|
|
460
|
+
throw Error();
|
|
461
|
+
} catch (x) {
|
|
462
|
+
control = x;
|
|
463
|
+
}
|
|
464
|
+
|
|
465
|
+
fn();
|
|
466
|
+
}
|
|
467
|
+
} catch (sample) {
|
|
468
|
+
// This is inlined manually because closure doesn't do it for us.
|
|
469
|
+
if (sample && control && typeof sample.stack === 'string') {
|
|
470
|
+
// This extracts the first frame from the sample that isn't also in the control.
|
|
471
|
+
// Skipping one frame that we assume is the frame that calls the two.
|
|
472
|
+
var sampleLines = sample.stack.split('\n');
|
|
473
|
+
var controlLines = control.stack.split('\n');
|
|
474
|
+
var s = sampleLines.length - 1;
|
|
475
|
+
var c = controlLines.length - 1;
|
|
476
|
+
|
|
477
|
+
while (s >= 1 && c >= 0 && sampleLines[s] !== controlLines[c]) {
|
|
478
|
+
// We expect at least one stack frame to be shared.
|
|
479
|
+
// Typically this will be the root most one. However, stack frames may be
|
|
480
|
+
// cut off due to maximum stack limits. In this case, one maybe cut off
|
|
481
|
+
// earlier than the other. We assume that the sample is longer or the same
|
|
482
|
+
// and there for cut off earlier. So we should find the root most frame in
|
|
483
|
+
// the sample somewhere in the control.
|
|
484
|
+
c--;
|
|
485
|
+
}
|
|
486
|
+
|
|
487
|
+
for (; s >= 1 && c >= 0; s--, c--) {
|
|
488
|
+
// Next we find the first one that isn't the same which should be the
|
|
489
|
+
// frame that called our sample function and the control.
|
|
490
|
+
if (sampleLines[s] !== controlLines[c]) {
|
|
491
|
+
// In V8, the first line is describing the message but other VMs don't.
|
|
492
|
+
// If we're about to return the first line, and the control is also on the same
|
|
493
|
+
// line, that's a pretty good indicator that our sample threw at same line as
|
|
494
|
+
// the control. I.e. before we entered the sample frame. So we ignore this result.
|
|
495
|
+
// This can happen if you passed a class to function component, or non-function.
|
|
496
|
+
if (s !== 1 || c !== 1) {
|
|
497
|
+
do {
|
|
498
|
+
s--;
|
|
499
|
+
c--; // We may still have similar intermediate frames from the construct call.
|
|
500
|
+
// The next one that isn't the same should be our match though.
|
|
501
|
+
|
|
502
|
+
if (c < 0 || sampleLines[s] !== controlLines[c]) {
|
|
503
|
+
// V8 adds a "new" prefix for native classes. Let's remove it to make it prettier.
|
|
504
|
+
var _frame = '\n' + sampleLines[s].replace(' at new ', ' at '); // If our component frame is labeled "<anonymous>"
|
|
505
|
+
// but we have a user-provided "displayName"
|
|
506
|
+
// splice it in to make the stack more readable.
|
|
507
|
+
|
|
508
|
+
|
|
509
|
+
if (fn.displayName && _frame.includes('<anonymous>')) {
|
|
510
|
+
_frame = _frame.replace('<anonymous>', fn.displayName);
|
|
511
|
+
}
|
|
512
|
+
|
|
513
|
+
{
|
|
514
|
+
if (typeof fn === 'function') {
|
|
515
|
+
componentFrameCache.set(fn, _frame);
|
|
516
|
+
}
|
|
517
|
+
} // Return the line we found.
|
|
518
|
+
|
|
519
|
+
|
|
520
|
+
return _frame;
|
|
521
|
+
}
|
|
522
|
+
} while (s >= 1 && c >= 0);
|
|
523
|
+
}
|
|
524
|
+
|
|
525
|
+
break;
|
|
526
|
+
}
|
|
527
|
+
}
|
|
528
|
+
}
|
|
529
|
+
} finally {
|
|
530
|
+
reentry = false;
|
|
531
|
+
|
|
532
|
+
{
|
|
533
|
+
ReactCurrentDispatcher.current = previousDispatcher;
|
|
534
|
+
reenableLogs();
|
|
535
|
+
}
|
|
536
|
+
|
|
537
|
+
Error.prepareStackTrace = previousPrepareStackTrace;
|
|
538
|
+
} // Fallback to just using the name if we couldn't make it throw.
|
|
539
|
+
|
|
540
|
+
|
|
541
|
+
var name = fn ? fn.displayName || fn.name : '';
|
|
542
|
+
var syntheticFrame = name ? describeBuiltInComponentFrame(name) : '';
|
|
543
|
+
|
|
544
|
+
{
|
|
545
|
+
if (typeof fn === 'function') {
|
|
546
|
+
componentFrameCache.set(fn, syntheticFrame);
|
|
547
|
+
}
|
|
548
|
+
}
|
|
549
|
+
|
|
550
|
+
return syntheticFrame;
|
|
551
|
+
}
|
|
552
|
+
function describeFunctionComponentFrame(fn, source, ownerFn) {
|
|
553
|
+
{
|
|
554
|
+
return describeNativeComponentFrame(fn, false);
|
|
555
|
+
}
|
|
556
|
+
}
|
|
557
|
+
|
|
558
|
+
function shouldConstruct(Component) {
|
|
559
|
+
var prototype = Component.prototype;
|
|
560
|
+
return !!(prototype && prototype.isReactComponent);
|
|
561
|
+
}
|
|
562
|
+
|
|
563
|
+
function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) {
|
|
564
|
+
|
|
565
|
+
if (type == null) {
|
|
566
|
+
return '';
|
|
567
|
+
}
|
|
568
|
+
|
|
569
|
+
if (typeof type === 'function') {
|
|
570
|
+
{
|
|
571
|
+
return describeNativeComponentFrame(type, shouldConstruct(type));
|
|
572
|
+
}
|
|
573
|
+
}
|
|
574
|
+
|
|
575
|
+
if (typeof type === 'string') {
|
|
576
|
+
return describeBuiltInComponentFrame(type);
|
|
577
|
+
}
|
|
578
|
+
|
|
579
|
+
switch (type) {
|
|
580
|
+
case REACT_SUSPENSE_TYPE:
|
|
581
|
+
return describeBuiltInComponentFrame('Suspense');
|
|
582
|
+
|
|
583
|
+
case REACT_SUSPENSE_LIST_TYPE:
|
|
584
|
+
return describeBuiltInComponentFrame('SuspenseList');
|
|
585
|
+
}
|
|
586
|
+
|
|
587
|
+
if (typeof type === 'object') {
|
|
588
|
+
switch (type.$$typeof) {
|
|
589
|
+
case REACT_FORWARD_REF_TYPE:
|
|
590
|
+
return describeFunctionComponentFrame(type.render);
|
|
591
|
+
|
|
592
|
+
case REACT_MEMO_TYPE:
|
|
593
|
+
// Memo may contain any component type so we recursively resolve it.
|
|
594
|
+
return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn);
|
|
595
|
+
|
|
596
|
+
case REACT_LAZY_TYPE:
|
|
597
|
+
{
|
|
598
|
+
var lazyComponent = type;
|
|
599
|
+
var payload = lazyComponent._payload;
|
|
600
|
+
var init = lazyComponent._init;
|
|
601
|
+
|
|
602
|
+
try {
|
|
603
|
+
// Lazy may contain any component type so we recursively resolve it.
|
|
604
|
+
return describeUnknownElementTypeFrameInDEV(init(payload), source, ownerFn);
|
|
605
|
+
} catch (x) {}
|
|
606
|
+
}
|
|
607
|
+
}
|
|
608
|
+
}
|
|
609
|
+
|
|
610
|
+
return '';
|
|
611
|
+
}
|
|
612
|
+
|
|
613
|
+
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
|
614
|
+
|
|
615
|
+
var loggedTypeFailures = {};
|
|
616
|
+
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
617
|
+
|
|
618
|
+
function setCurrentlyValidatingElement(element) {
|
|
619
|
+
{
|
|
620
|
+
if (element) {
|
|
621
|
+
var owner = element._owner;
|
|
622
|
+
var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null);
|
|
623
|
+
ReactDebugCurrentFrame.setExtraStackFrame(stack);
|
|
624
|
+
} else {
|
|
625
|
+
ReactDebugCurrentFrame.setExtraStackFrame(null);
|
|
626
|
+
}
|
|
627
|
+
}
|
|
628
|
+
}
|
|
629
|
+
|
|
630
|
+
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
|
631
|
+
{
|
|
632
|
+
// $FlowFixMe This is okay but Flow doesn't know it.
|
|
633
|
+
var has = Function.call.bind(hasOwnProperty);
|
|
634
|
+
|
|
635
|
+
for (var typeSpecName in typeSpecs) {
|
|
636
|
+
if (has(typeSpecs, typeSpecName)) {
|
|
637
|
+
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
|
638
|
+
// fail the render phase where it didn't fail before. So we log it.
|
|
639
|
+
// After these have been cleaned up, we'll let them throw.
|
|
640
|
+
|
|
641
|
+
try {
|
|
642
|
+
// This is intentionally an invariant that gets caught. It's the same
|
|
643
|
+
// behavior as without this statement except with a better message.
|
|
644
|
+
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
|
645
|
+
// eslint-disable-next-line react-internal/prod-error-codes
|
|
646
|
+
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
|
647
|
+
err.name = 'Invariant Violation';
|
|
648
|
+
throw err;
|
|
649
|
+
}
|
|
650
|
+
|
|
651
|
+
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
|
652
|
+
} catch (ex) {
|
|
653
|
+
error$1 = ex;
|
|
654
|
+
}
|
|
655
|
+
|
|
656
|
+
if (error$1 && !(error$1 instanceof Error)) {
|
|
657
|
+
setCurrentlyValidatingElement(element);
|
|
658
|
+
|
|
659
|
+
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
|
660
|
+
|
|
661
|
+
setCurrentlyValidatingElement(null);
|
|
662
|
+
}
|
|
663
|
+
|
|
664
|
+
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
|
665
|
+
// Only monitor this failure once because there tends to be a lot of the
|
|
666
|
+
// same error.
|
|
667
|
+
loggedTypeFailures[error$1.message] = true;
|
|
668
|
+
setCurrentlyValidatingElement(element);
|
|
669
|
+
|
|
670
|
+
error('Failed %s type: %s', location, error$1.message);
|
|
671
|
+
|
|
672
|
+
setCurrentlyValidatingElement(null);
|
|
673
|
+
}
|
|
674
|
+
}
|
|
675
|
+
}
|
|
676
|
+
}
|
|
677
|
+
}
|
|
678
|
+
|
|
679
|
+
var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare
|
|
680
|
+
|
|
681
|
+
function isArray(a) {
|
|
682
|
+
return isArrayImpl(a);
|
|
683
|
+
}
|
|
684
|
+
|
|
685
|
+
/*
|
|
686
|
+
* The `'' + value` pattern (used in in perf-sensitive code) throws for Symbol
|
|
687
|
+
* and Temporal.* types. See https://github.com/facebook/react/pull/22064.
|
|
688
|
+
*
|
|
689
|
+
* The functions in this module will throw an easier-to-understand,
|
|
690
|
+
* easier-to-debug exception with a clear errors message message explaining the
|
|
691
|
+
* problem. (Instead of a confusing exception thrown inside the implementation
|
|
692
|
+
* of the `value` object).
|
|
693
|
+
*/
|
|
694
|
+
// $FlowFixMe only called in DEV, so void return is not possible.
|
|
695
|
+
function typeName(value) {
|
|
696
|
+
{
|
|
697
|
+
// toStringTag is needed for namespaced types like Temporal.Instant
|
|
698
|
+
var hasToStringTag = typeof Symbol === 'function' && Symbol.toStringTag;
|
|
699
|
+
var type = hasToStringTag && value[Symbol.toStringTag] || value.constructor.name || 'Object';
|
|
700
|
+
return type;
|
|
701
|
+
}
|
|
702
|
+
} // $FlowFixMe only called in DEV, so void return is not possible.
|
|
703
|
+
|
|
704
|
+
|
|
705
|
+
function willCoercionThrow(value) {
|
|
706
|
+
{
|
|
707
|
+
try {
|
|
708
|
+
testStringCoercion(value);
|
|
709
|
+
return false;
|
|
710
|
+
} catch (e) {
|
|
711
|
+
return true;
|
|
712
|
+
}
|
|
713
|
+
}
|
|
714
|
+
}
|
|
715
|
+
|
|
716
|
+
function testStringCoercion(value) {
|
|
717
|
+
// If you ended up here by following an exception call stack, here's what's
|
|
718
|
+
// happened: you supplied an object or symbol value to React (as a prop, key,
|
|
719
|
+
// DOM attribute, CSS property, string ref, etc.) and when React tried to
|
|
720
|
+
// coerce it to a string using `'' + value`, an exception was thrown.
|
|
721
|
+
//
|
|
722
|
+
// The most common types that will cause this exception are `Symbol` instances
|
|
723
|
+
// and Temporal objects like `Temporal.Instant`. But any object that has a
|
|
724
|
+
// `valueOf` or `[Symbol.toPrimitive]` method that throws will also cause this
|
|
725
|
+
// exception. (Library authors do this to prevent users from using built-in
|
|
726
|
+
// numeric operators like `+` or comparison operators like `>=` because custom
|
|
727
|
+
// methods are needed to perform accurate arithmetic or comparison.)
|
|
728
|
+
//
|
|
729
|
+
// To fix the problem, coerce this object or symbol value to a string before
|
|
730
|
+
// passing it to React. The most reliable way is usually `String(value)`.
|
|
731
|
+
//
|
|
732
|
+
// To find which value is throwing, check the browser or debugger console.
|
|
733
|
+
// Before this exception was thrown, there should be `console.error` output
|
|
734
|
+
// that shows the type (Symbol, Temporal.PlainDate, etc.) that caused the
|
|
735
|
+
// problem and how that type was used: key, atrribute, input value prop, etc.
|
|
736
|
+
// In most cases, this console output also shows the component and its
|
|
737
|
+
// ancestor components where the exception happened.
|
|
738
|
+
//
|
|
739
|
+
// eslint-disable-next-line react-internal/safe-string-coercion
|
|
740
|
+
return '' + value;
|
|
741
|
+
}
|
|
742
|
+
function checkKeyStringCoercion(value) {
|
|
743
|
+
{
|
|
744
|
+
if (willCoercionThrow(value)) {
|
|
745
|
+
error('The provided key is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value));
|
|
746
|
+
|
|
747
|
+
return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
|
|
748
|
+
}
|
|
749
|
+
}
|
|
750
|
+
}
|
|
751
|
+
|
|
752
|
+
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
|
|
753
|
+
var RESERVED_PROPS = {
|
|
754
|
+
key: true,
|
|
755
|
+
ref: true,
|
|
756
|
+
__self: true,
|
|
757
|
+
__source: true
|
|
758
|
+
};
|
|
759
|
+
var specialPropKeyWarningShown;
|
|
760
|
+
var specialPropRefWarningShown;
|
|
761
|
+
var didWarnAboutStringRefs;
|
|
762
|
+
|
|
763
|
+
{
|
|
764
|
+
didWarnAboutStringRefs = {};
|
|
765
|
+
}
|
|
766
|
+
|
|
767
|
+
function hasValidRef(config) {
|
|
768
|
+
{
|
|
769
|
+
if (hasOwnProperty.call(config, 'ref')) {
|
|
770
|
+
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
|
771
|
+
|
|
772
|
+
if (getter && getter.isReactWarning) {
|
|
773
|
+
return false;
|
|
774
|
+
}
|
|
775
|
+
}
|
|
776
|
+
}
|
|
777
|
+
|
|
778
|
+
return config.ref !== undefined;
|
|
779
|
+
}
|
|
780
|
+
|
|
781
|
+
function hasValidKey(config) {
|
|
782
|
+
{
|
|
783
|
+
if (hasOwnProperty.call(config, 'key')) {
|
|
784
|
+
var getter = Object.getOwnPropertyDescriptor(config, 'key').get;
|
|
785
|
+
|
|
786
|
+
if (getter && getter.isReactWarning) {
|
|
787
|
+
return false;
|
|
788
|
+
}
|
|
789
|
+
}
|
|
790
|
+
}
|
|
791
|
+
|
|
792
|
+
return config.key !== undefined;
|
|
793
|
+
}
|
|
794
|
+
|
|
795
|
+
function warnIfStringRefCannotBeAutoConverted(config, self) {
|
|
796
|
+
{
|
|
797
|
+
if (typeof config.ref === 'string' && ReactCurrentOwner.current && self && ReactCurrentOwner.current.stateNode !== self) {
|
|
798
|
+
var componentName = getComponentNameFromType(ReactCurrentOwner.current.type);
|
|
799
|
+
|
|
800
|
+
if (!didWarnAboutStringRefs[componentName]) {
|
|
801
|
+
error('Component "%s" contains the string ref "%s". ' + 'Support for string refs will be removed in a future major release. ' + 'This case cannot be automatically converted to an arrow function. ' + 'We ask you to manually fix this case by using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', getComponentNameFromType(ReactCurrentOwner.current.type), config.ref);
|
|
802
|
+
|
|
803
|
+
didWarnAboutStringRefs[componentName] = true;
|
|
804
|
+
}
|
|
805
|
+
}
|
|
806
|
+
}
|
|
807
|
+
}
|
|
808
|
+
|
|
809
|
+
function defineKeyPropWarningGetter(props, displayName) {
|
|
810
|
+
{
|
|
811
|
+
var warnAboutAccessingKey = function () {
|
|
812
|
+
if (!specialPropKeyWarningShown) {
|
|
813
|
+
specialPropKeyWarningShown = true;
|
|
814
|
+
|
|
815
|
+
error('%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
|
816
|
+
}
|
|
817
|
+
};
|
|
818
|
+
|
|
819
|
+
warnAboutAccessingKey.isReactWarning = true;
|
|
820
|
+
Object.defineProperty(props, 'key', {
|
|
821
|
+
get: warnAboutAccessingKey,
|
|
822
|
+
configurable: true
|
|
823
|
+
});
|
|
824
|
+
}
|
|
825
|
+
}
|
|
826
|
+
|
|
827
|
+
function defineRefPropWarningGetter(props, displayName) {
|
|
828
|
+
{
|
|
829
|
+
var warnAboutAccessingRef = function () {
|
|
830
|
+
if (!specialPropRefWarningShown) {
|
|
831
|
+
specialPropRefWarningShown = true;
|
|
832
|
+
|
|
833
|
+
error('%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
|
834
|
+
}
|
|
835
|
+
};
|
|
836
|
+
|
|
837
|
+
warnAboutAccessingRef.isReactWarning = true;
|
|
838
|
+
Object.defineProperty(props, 'ref', {
|
|
839
|
+
get: warnAboutAccessingRef,
|
|
840
|
+
configurable: true
|
|
841
|
+
});
|
|
842
|
+
}
|
|
843
|
+
}
|
|
844
|
+
/**
|
|
845
|
+
* Factory method to create a new React element. This no longer adheres to
|
|
846
|
+
* the class pattern, so do not use new to call it. Also, instanceof check
|
|
847
|
+
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
|
848
|
+
* if something is a React Element.
|
|
849
|
+
*
|
|
850
|
+
* @param {*} type
|
|
851
|
+
* @param {*} props
|
|
852
|
+
* @param {*} key
|
|
853
|
+
* @param {string|object} ref
|
|
854
|
+
* @param {*} owner
|
|
855
|
+
* @param {*} self A *temporary* helper to detect places where `this` is
|
|
856
|
+
* different from the `owner` when React.createElement is called, so that we
|
|
857
|
+
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
|
858
|
+
* functions, and as long as `this` and owner are the same, there will be no
|
|
859
|
+
* change in behavior.
|
|
860
|
+
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
|
861
|
+
* indicating filename, line number, and/or other information.
|
|
862
|
+
* @internal
|
|
863
|
+
*/
|
|
864
|
+
|
|
865
|
+
|
|
866
|
+
var ReactElement = function (type, key, ref, self, source, owner, props) {
|
|
867
|
+
var element = {
|
|
868
|
+
// This tag allows us to uniquely identify this as a React Element
|
|
869
|
+
$$typeof: REACT_ELEMENT_TYPE,
|
|
870
|
+
// Built-in properties that belong on the element
|
|
871
|
+
type: type,
|
|
872
|
+
key: key,
|
|
873
|
+
ref: ref,
|
|
874
|
+
props: props,
|
|
875
|
+
// Record the component responsible for creating this element.
|
|
876
|
+
_owner: owner
|
|
877
|
+
};
|
|
878
|
+
|
|
879
|
+
{
|
|
880
|
+
// The validation flag is currently mutative. We put it on
|
|
881
|
+
// an external backing store so that we can freeze the whole object.
|
|
882
|
+
// This can be replaced with a WeakMap once they are implemented in
|
|
883
|
+
// commonly used development environments.
|
|
884
|
+
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
|
885
|
+
// the validation flag non-enumerable (where possible, which should
|
|
886
|
+
// include every environment we run tests in), so the test framework
|
|
887
|
+
// ignores it.
|
|
888
|
+
|
|
889
|
+
Object.defineProperty(element._store, 'validated', {
|
|
890
|
+
configurable: false,
|
|
891
|
+
enumerable: false,
|
|
892
|
+
writable: true,
|
|
893
|
+
value: false
|
|
894
|
+
}); // self and source are DEV only properties.
|
|
895
|
+
|
|
896
|
+
Object.defineProperty(element, '_self', {
|
|
897
|
+
configurable: false,
|
|
898
|
+
enumerable: false,
|
|
899
|
+
writable: false,
|
|
900
|
+
value: self
|
|
901
|
+
}); // Two elements created in two different places should be considered
|
|
902
|
+
// equal for testing purposes and therefore we hide it from enumeration.
|
|
903
|
+
|
|
904
|
+
Object.defineProperty(element, '_source', {
|
|
905
|
+
configurable: false,
|
|
906
|
+
enumerable: false,
|
|
907
|
+
writable: false,
|
|
908
|
+
value: source
|
|
909
|
+
});
|
|
910
|
+
|
|
911
|
+
if (Object.freeze) {
|
|
912
|
+
Object.freeze(element.props);
|
|
913
|
+
Object.freeze(element);
|
|
914
|
+
}
|
|
915
|
+
}
|
|
916
|
+
|
|
917
|
+
return element;
|
|
918
|
+
};
|
|
919
|
+
/**
|
|
920
|
+
* https://github.com/reactjs/rfcs/pull/107
|
|
921
|
+
* @param {*} type
|
|
922
|
+
* @param {object} props
|
|
923
|
+
* @param {string} key
|
|
924
|
+
*/
|
|
925
|
+
|
|
926
|
+
function jsxDEV(type, config, maybeKey, source, self) {
|
|
927
|
+
{
|
|
928
|
+
var propName; // Reserved names are extracted
|
|
929
|
+
|
|
930
|
+
var props = {};
|
|
931
|
+
var key = null;
|
|
932
|
+
var ref = null; // Currently, key can be spread in as a prop. This causes a potential
|
|
933
|
+
// issue if key is also explicitly declared (ie. <div {...props} key="Hi" />
|
|
934
|
+
// or <div key="Hi" {...props} /> ). We want to deprecate key spread,
|
|
935
|
+
// but as an intermediary step, we will use jsxDEV for everything except
|
|
936
|
+
// <div {...props} key="Hi" />, because we aren't currently able to tell if
|
|
937
|
+
// key is explicitly declared to be undefined or not.
|
|
938
|
+
|
|
939
|
+
if (maybeKey !== undefined) {
|
|
940
|
+
{
|
|
941
|
+
checkKeyStringCoercion(maybeKey);
|
|
942
|
+
}
|
|
943
|
+
|
|
944
|
+
key = '' + maybeKey;
|
|
945
|
+
}
|
|
946
|
+
|
|
947
|
+
if (hasValidKey(config)) {
|
|
948
|
+
{
|
|
949
|
+
checkKeyStringCoercion(config.key);
|
|
950
|
+
}
|
|
951
|
+
|
|
952
|
+
key = '' + config.key;
|
|
953
|
+
}
|
|
954
|
+
|
|
955
|
+
if (hasValidRef(config)) {
|
|
956
|
+
ref = config.ref;
|
|
957
|
+
warnIfStringRefCannotBeAutoConverted(config, self);
|
|
958
|
+
} // Remaining properties are added to a new props object
|
|
959
|
+
|
|
960
|
+
|
|
961
|
+
for (propName in config) {
|
|
962
|
+
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
|
963
|
+
props[propName] = config[propName];
|
|
964
|
+
}
|
|
965
|
+
} // Resolve default props
|
|
966
|
+
|
|
967
|
+
|
|
968
|
+
if (type && type.defaultProps) {
|
|
969
|
+
var defaultProps = type.defaultProps;
|
|
970
|
+
|
|
971
|
+
for (propName in defaultProps) {
|
|
972
|
+
if (props[propName] === undefined) {
|
|
973
|
+
props[propName] = defaultProps[propName];
|
|
974
|
+
}
|
|
975
|
+
}
|
|
976
|
+
}
|
|
977
|
+
|
|
978
|
+
if (key || ref) {
|
|
979
|
+
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
|
980
|
+
|
|
981
|
+
if (key) {
|
|
982
|
+
defineKeyPropWarningGetter(props, displayName);
|
|
983
|
+
}
|
|
984
|
+
|
|
985
|
+
if (ref) {
|
|
986
|
+
defineRefPropWarningGetter(props, displayName);
|
|
987
|
+
}
|
|
988
|
+
}
|
|
989
|
+
|
|
990
|
+
return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
|
|
991
|
+
}
|
|
992
|
+
}
|
|
993
|
+
|
|
994
|
+
var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
|
|
995
|
+
var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
996
|
+
|
|
997
|
+
function setCurrentlyValidatingElement$1(element) {
|
|
998
|
+
{
|
|
999
|
+
if (element) {
|
|
1000
|
+
var owner = element._owner;
|
|
1001
|
+
var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null);
|
|
1002
|
+
ReactDebugCurrentFrame$1.setExtraStackFrame(stack);
|
|
1003
|
+
} else {
|
|
1004
|
+
ReactDebugCurrentFrame$1.setExtraStackFrame(null);
|
|
1005
|
+
}
|
|
1006
|
+
}
|
|
1007
|
+
}
|
|
1008
|
+
|
|
1009
|
+
var propTypesMisspellWarningShown;
|
|
1010
|
+
|
|
1011
|
+
{
|
|
1012
|
+
propTypesMisspellWarningShown = false;
|
|
1013
|
+
}
|
|
1014
|
+
/**
|
|
1015
|
+
* Verifies the object is a ReactElement.
|
|
1016
|
+
* See https://reactjs.org/docs/react-api.html#isvalidelement
|
|
1017
|
+
* @param {?object} object
|
|
1018
|
+
* @return {boolean} True if `object` is a ReactElement.
|
|
1019
|
+
* @final
|
|
1020
|
+
*/
|
|
1021
|
+
|
|
1022
|
+
|
|
1023
|
+
function isValidElement(object) {
|
|
1024
|
+
{
|
|
1025
|
+
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
|
1026
|
+
}
|
|
1027
|
+
}
|
|
1028
|
+
|
|
1029
|
+
function getDeclarationErrorAddendum() {
|
|
1030
|
+
{
|
|
1031
|
+
if (ReactCurrentOwner$1.current) {
|
|
1032
|
+
var name = getComponentNameFromType(ReactCurrentOwner$1.current.type);
|
|
1033
|
+
|
|
1034
|
+
if (name) {
|
|
1035
|
+
return '\n\nCheck the render method of `' + name + '`.';
|
|
1036
|
+
}
|
|
1037
|
+
}
|
|
1038
|
+
|
|
1039
|
+
return '';
|
|
1040
|
+
}
|
|
1041
|
+
}
|
|
1042
|
+
|
|
1043
|
+
function getSourceInfoErrorAddendum(source) {
|
|
1044
|
+
{
|
|
1045
|
+
|
|
1046
|
+
return '';
|
|
1047
|
+
}
|
|
1048
|
+
}
|
|
1049
|
+
/**
|
|
1050
|
+
* Warn if there's no key explicitly set on dynamic arrays of children or
|
|
1051
|
+
* object keys are not valid. This allows us to keep track of children between
|
|
1052
|
+
* updates.
|
|
1053
|
+
*/
|
|
1054
|
+
|
|
1055
|
+
|
|
1056
|
+
var ownerHasKeyUseWarning = {};
|
|
1057
|
+
|
|
1058
|
+
function getCurrentComponentErrorInfo(parentType) {
|
|
1059
|
+
{
|
|
1060
|
+
var info = getDeclarationErrorAddendum();
|
|
1061
|
+
|
|
1062
|
+
if (!info) {
|
|
1063
|
+
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
|
1064
|
+
|
|
1065
|
+
if (parentName) {
|
|
1066
|
+
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
|
1067
|
+
}
|
|
1068
|
+
}
|
|
1069
|
+
|
|
1070
|
+
return info;
|
|
1071
|
+
}
|
|
1072
|
+
}
|
|
1073
|
+
/**
|
|
1074
|
+
* Warn if the element doesn't have an explicit key assigned to it.
|
|
1075
|
+
* This element is in an array. The array could grow and shrink or be
|
|
1076
|
+
* reordered. All children that haven't already been validated are required to
|
|
1077
|
+
* have a "key" property assigned to it. Error statuses are cached so a warning
|
|
1078
|
+
* will only be shown once.
|
|
1079
|
+
*
|
|
1080
|
+
* @internal
|
|
1081
|
+
* @param {ReactElement} element Element that requires a key.
|
|
1082
|
+
* @param {*} parentType element's parent's type.
|
|
1083
|
+
*/
|
|
1084
|
+
|
|
1085
|
+
|
|
1086
|
+
function validateExplicitKey(element, parentType) {
|
|
1087
|
+
{
|
|
1088
|
+
if (!element._store || element._store.validated || element.key != null) {
|
|
1089
|
+
return;
|
|
1090
|
+
}
|
|
1091
|
+
|
|
1092
|
+
element._store.validated = true;
|
|
1093
|
+
var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
|
|
1094
|
+
|
|
1095
|
+
if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
|
|
1096
|
+
return;
|
|
1097
|
+
}
|
|
1098
|
+
|
|
1099
|
+
ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a
|
|
1100
|
+
// property, it may be the creator of the child that's responsible for
|
|
1101
|
+
// assigning it a key.
|
|
1102
|
+
|
|
1103
|
+
var childOwner = '';
|
|
1104
|
+
|
|
1105
|
+
if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
|
|
1106
|
+
// Give the component that originally created this child.
|
|
1107
|
+
childOwner = " It was passed a child from " + getComponentNameFromType(element._owner.type) + ".";
|
|
1108
|
+
}
|
|
1109
|
+
|
|
1110
|
+
setCurrentlyValidatingElement$1(element);
|
|
1111
|
+
|
|
1112
|
+
error('Each child in a list should have a unique "key" prop.' + '%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
|
|
1113
|
+
|
|
1114
|
+
setCurrentlyValidatingElement$1(null);
|
|
1115
|
+
}
|
|
1116
|
+
}
|
|
1117
|
+
/**
|
|
1118
|
+
* Ensure that every element either is passed in a static location, in an
|
|
1119
|
+
* array with an explicit keys property defined, or in an object literal
|
|
1120
|
+
* with valid key property.
|
|
1121
|
+
*
|
|
1122
|
+
* @internal
|
|
1123
|
+
* @param {ReactNode} node Statically passed child of any type.
|
|
1124
|
+
* @param {*} parentType node's parent's type.
|
|
1125
|
+
*/
|
|
1126
|
+
|
|
1127
|
+
|
|
1128
|
+
function validateChildKeys(node, parentType) {
|
|
1129
|
+
{
|
|
1130
|
+
if (typeof node !== 'object') {
|
|
1131
|
+
return;
|
|
1132
|
+
}
|
|
1133
|
+
|
|
1134
|
+
if (isArray(node)) {
|
|
1135
|
+
for (var i = 0; i < node.length; i++) {
|
|
1136
|
+
var child = node[i];
|
|
1137
|
+
|
|
1138
|
+
if (isValidElement(child)) {
|
|
1139
|
+
validateExplicitKey(child, parentType);
|
|
1140
|
+
}
|
|
1141
|
+
}
|
|
1142
|
+
} else if (isValidElement(node)) {
|
|
1143
|
+
// This element was passed in a valid location.
|
|
1144
|
+
if (node._store) {
|
|
1145
|
+
node._store.validated = true;
|
|
1146
|
+
}
|
|
1147
|
+
} else if (node) {
|
|
1148
|
+
var iteratorFn = getIteratorFn(node);
|
|
1149
|
+
|
|
1150
|
+
if (typeof iteratorFn === 'function') {
|
|
1151
|
+
// Entry iterators used to provide implicit keys,
|
|
1152
|
+
// but now we print a separate warning for them later.
|
|
1153
|
+
if (iteratorFn !== node.entries) {
|
|
1154
|
+
var iterator = iteratorFn.call(node);
|
|
1155
|
+
var step;
|
|
1156
|
+
|
|
1157
|
+
while (!(step = iterator.next()).done) {
|
|
1158
|
+
if (isValidElement(step.value)) {
|
|
1159
|
+
validateExplicitKey(step.value, parentType);
|
|
1160
|
+
}
|
|
1161
|
+
}
|
|
1162
|
+
}
|
|
1163
|
+
}
|
|
1164
|
+
}
|
|
1165
|
+
}
|
|
1166
|
+
}
|
|
1167
|
+
/**
|
|
1168
|
+
* Given an element, validate that its props follow the propTypes definition,
|
|
1169
|
+
* provided by the type.
|
|
1170
|
+
*
|
|
1171
|
+
* @param {ReactElement} element
|
|
1172
|
+
*/
|
|
1173
|
+
|
|
1174
|
+
|
|
1175
|
+
function validatePropTypes(element) {
|
|
1176
|
+
{
|
|
1177
|
+
var type = element.type;
|
|
1178
|
+
|
|
1179
|
+
if (type === null || type === undefined || typeof type === 'string') {
|
|
1180
|
+
return;
|
|
1181
|
+
}
|
|
1182
|
+
|
|
1183
|
+
var propTypes;
|
|
1184
|
+
|
|
1185
|
+
if (typeof type === 'function') {
|
|
1186
|
+
propTypes = type.propTypes;
|
|
1187
|
+
} else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
|
|
1188
|
+
// Inner props are checked in the reconciler.
|
|
1189
|
+
type.$$typeof === REACT_MEMO_TYPE)) {
|
|
1190
|
+
propTypes = type.propTypes;
|
|
1191
|
+
} else {
|
|
1192
|
+
return;
|
|
1193
|
+
}
|
|
1194
|
+
|
|
1195
|
+
if (propTypes) {
|
|
1196
|
+
// Intentionally inside to avoid triggering lazy initializers:
|
|
1197
|
+
var name = getComponentNameFromType(type);
|
|
1198
|
+
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
|
1199
|
+
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
|
1200
|
+
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
|
1201
|
+
|
|
1202
|
+
var _name = getComponentNameFromType(type);
|
|
1203
|
+
|
|
1204
|
+
error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
|
|
1205
|
+
}
|
|
1206
|
+
|
|
1207
|
+
if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) {
|
|
1208
|
+
error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.');
|
|
1209
|
+
}
|
|
1210
|
+
}
|
|
1211
|
+
}
|
|
1212
|
+
/**
|
|
1213
|
+
* Given a fragment, validate that it can only be provided with fragment props
|
|
1214
|
+
* @param {ReactElement} fragment
|
|
1215
|
+
*/
|
|
1216
|
+
|
|
1217
|
+
|
|
1218
|
+
function validateFragmentProps(fragment) {
|
|
1219
|
+
{
|
|
1220
|
+
var keys = Object.keys(fragment.props);
|
|
1221
|
+
|
|
1222
|
+
for (var i = 0; i < keys.length; i++) {
|
|
1223
|
+
var key = keys[i];
|
|
1224
|
+
|
|
1225
|
+
if (key !== 'children' && key !== 'key') {
|
|
1226
|
+
setCurrentlyValidatingElement$1(fragment);
|
|
1227
|
+
|
|
1228
|
+
error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key);
|
|
1229
|
+
|
|
1230
|
+
setCurrentlyValidatingElement$1(null);
|
|
1231
|
+
break;
|
|
1232
|
+
}
|
|
1233
|
+
}
|
|
1234
|
+
|
|
1235
|
+
if (fragment.ref !== null) {
|
|
1236
|
+
setCurrentlyValidatingElement$1(fragment);
|
|
1237
|
+
|
|
1238
|
+
error('Invalid attribute `ref` supplied to `React.Fragment`.');
|
|
1239
|
+
|
|
1240
|
+
setCurrentlyValidatingElement$1(null);
|
|
1241
|
+
}
|
|
1242
|
+
}
|
|
1243
|
+
}
|
|
1244
|
+
|
|
1245
|
+
function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
|
|
1246
|
+
{
|
|
1247
|
+
var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
|
|
1248
|
+
// succeed and there will likely be errors in render.
|
|
1249
|
+
|
|
1250
|
+
if (!validType) {
|
|
1251
|
+
var info = '';
|
|
1252
|
+
|
|
1253
|
+
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
|
1254
|
+
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports.";
|
|
1255
|
+
}
|
|
1256
|
+
|
|
1257
|
+
var sourceInfo = getSourceInfoErrorAddendum();
|
|
1258
|
+
|
|
1259
|
+
if (sourceInfo) {
|
|
1260
|
+
info += sourceInfo;
|
|
1261
|
+
} else {
|
|
1262
|
+
info += getDeclarationErrorAddendum();
|
|
1263
|
+
}
|
|
1264
|
+
|
|
1265
|
+
var typeString;
|
|
1266
|
+
|
|
1267
|
+
if (type === null) {
|
|
1268
|
+
typeString = 'null';
|
|
1269
|
+
} else if (isArray(type)) {
|
|
1270
|
+
typeString = 'array';
|
|
1271
|
+
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
|
1272
|
+
typeString = "<" + (getComponentNameFromType(type.type) || 'Unknown') + " />";
|
|
1273
|
+
info = ' Did you accidentally export a JSX literal instead of a component?';
|
|
1274
|
+
} else {
|
|
1275
|
+
typeString = typeof type;
|
|
1276
|
+
}
|
|
1277
|
+
|
|
1278
|
+
error('React.jsx: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', typeString, info);
|
|
1279
|
+
}
|
|
1280
|
+
|
|
1281
|
+
var element = jsxDEV(type, props, key, source, self); // The result can be nullish if a mock or a custom function is used.
|
|
1282
|
+
// TODO: Drop this when these are no longer allowed as the type argument.
|
|
1283
|
+
|
|
1284
|
+
if (element == null) {
|
|
1285
|
+
return element;
|
|
1286
|
+
} // Skip key warning if the type isn't valid since our key validation logic
|
|
1287
|
+
// doesn't expect a non-string/function type and can throw confusing errors.
|
|
1288
|
+
// We don't want exception behavior to differ between dev and prod.
|
|
1289
|
+
// (Rendering will throw with a helpful message and as soon as the type is
|
|
1290
|
+
// fixed, the key warnings will appear.)
|
|
1291
|
+
|
|
1292
|
+
|
|
1293
|
+
if (validType) {
|
|
1294
|
+
var children = props.children;
|
|
1295
|
+
|
|
1296
|
+
if (children !== undefined) {
|
|
1297
|
+
if (isStaticChildren) {
|
|
1298
|
+
if (isArray(children)) {
|
|
1299
|
+
for (var i = 0; i < children.length; i++) {
|
|
1300
|
+
validateChildKeys(children[i], type);
|
|
1301
|
+
}
|
|
1302
|
+
|
|
1303
|
+
if (Object.freeze) {
|
|
1304
|
+
Object.freeze(children);
|
|
1305
|
+
}
|
|
1306
|
+
} else {
|
|
1307
|
+
error('React.jsx: Static children should always be an array. ' + 'You are likely explicitly calling React.jsxs or React.jsxDEV. ' + 'Use the Babel transform instead.');
|
|
1308
|
+
}
|
|
1309
|
+
} else {
|
|
1310
|
+
validateChildKeys(children, type);
|
|
1311
|
+
}
|
|
1312
|
+
}
|
|
1313
|
+
}
|
|
1314
|
+
|
|
1315
|
+
if (type === REACT_FRAGMENT_TYPE) {
|
|
1316
|
+
validateFragmentProps(element);
|
|
1317
|
+
} else {
|
|
1318
|
+
validatePropTypes(element);
|
|
1319
|
+
}
|
|
1320
|
+
|
|
1321
|
+
return element;
|
|
1322
|
+
}
|
|
1323
|
+
} // These two functions exist to still get child warnings in dev
|
|
1324
|
+
// even with the prod transform. This means that jsxDEV is purely
|
|
1325
|
+
// opt-in behavior for better messages but that we won't stop
|
|
1326
|
+
// giving you warnings if you use production apis.
|
|
1327
|
+
|
|
1328
|
+
function jsxWithValidationStatic(type, props, key) {
|
|
1329
|
+
{
|
|
1330
|
+
return jsxWithValidation(type, props, key, true);
|
|
1331
|
+
}
|
|
1332
|
+
}
|
|
1333
|
+
function jsxWithValidationDynamic(type, props, key) {
|
|
1334
|
+
{
|
|
1335
|
+
return jsxWithValidation(type, props, key, false);
|
|
1336
|
+
}
|
|
1337
|
+
}
|
|
1338
|
+
|
|
1339
|
+
var jsx = jsxWithValidationDynamic ; // we may want to special case jsxs internally to take advantage of static children.
|
|
1340
|
+
// for now we can ship identical prod functions
|
|
1341
|
+
|
|
1342
|
+
var jsxs = jsxWithValidationStatic ;
|
|
1343
|
+
|
|
1344
|
+
reactJsxRuntime_development.Fragment = REACT_FRAGMENT_TYPE;
|
|
1345
|
+
reactJsxRuntime_development.jsx = jsx;
|
|
1346
|
+
reactJsxRuntime_development.jsxs = jsxs;
|
|
1347
|
+
})();
|
|
1348
|
+
}
|
|
1349
|
+
return reactJsxRuntime_development;
|
|
1350
|
+
}
|
|
1351
|
+
|
|
1352
|
+
if (process.env.NODE_ENV === 'production') {
|
|
1353
|
+
jsxRuntime.exports = requireReactJsxRuntime_production_min();
|
|
1354
|
+
} else {
|
|
1355
|
+
jsxRuntime.exports = requireReactJsxRuntime_development();
|
|
1356
|
+
}
|
|
1357
|
+
|
|
1358
|
+
var jsxRuntimeExports = jsxRuntime.exports;
|
|
13
1359
|
|
|
14
1360
|
const baseCls = 'rls-tabular-text';
|
|
15
1361
|
const pointers = ['.', ','];
|
|
@@ -17,11 +1363,11 @@ function charClass(char) {
|
|
|
17
1363
|
return pointers.includes(char) ? `${baseCls}__pointer` : `${baseCls}__char`;
|
|
18
1364
|
}
|
|
19
1365
|
function RlsTabularText({ value }) {
|
|
20
|
-
return (
|
|
1366
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-tabular-text", children: value?.split('').map((char, index) => (jsxRuntimeExports.jsx("span", { className: charClass(char), children: char }, index))) }));
|
|
21
1367
|
}
|
|
22
1368
|
|
|
23
1369
|
function RlsAmount({ value, decimals, rlsTheme, symbol }) {
|
|
24
|
-
return (
|
|
1370
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-amount", "rls-theme": rlsTheme, children: [symbol && jsxRuntimeExports.jsx("span", { children: symbol }), jsxRuntimeExports.jsx(RlsTabularText, { value: commons.currencyFormat({ value, decimals }) })] }));
|
|
25
1371
|
}
|
|
26
1372
|
|
|
27
1373
|
function renderClassStatus(base, status = {}, aditionals) {
|
|
@@ -40,45 +1386,45 @@ function renderClassStatus(base, status = {}, aditionals) {
|
|
|
40
1386
|
}
|
|
41
1387
|
|
|
42
1388
|
function RlsAvatar({ children, rounded, skeleton, rlsTheme }) {
|
|
43
|
-
return (
|
|
1389
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-avatar', { rounded, skeleton }), "rls-theme": rlsTheme, children: children }));
|
|
44
1390
|
}
|
|
45
1391
|
|
|
46
1392
|
function RlsBadge({ children, rlsTheme }) {
|
|
47
|
-
return (
|
|
1393
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-badge", "rls-theme": rlsTheme, children: children }));
|
|
48
1394
|
}
|
|
49
1395
|
|
|
50
1396
|
function RlsBreadcrumb({ labels }) {
|
|
51
|
-
return (
|
|
1397
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-breadcrumb", children: labels.map(({ label, onClick }, index) => (jsxRuntimeExports.jsx("label", { className: "rls-breadcrumb__label", onClick: onClick, children: jsxRuntimeExports.jsx("a", { className: "rls-breadcrumb__label__a", children: label }) }, index))) }));
|
|
52
1398
|
}
|
|
53
1399
|
|
|
54
1400
|
function RlsIcon({ value, skeleton }) {
|
|
55
|
-
return (
|
|
1401
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-icon', { skeleton }), children: jsxRuntimeExports.jsx("i", { className: `rls-icon-${value}` }) }));
|
|
56
1402
|
}
|
|
57
1403
|
|
|
58
1404
|
function RlsButton({ type, children, disabled, prefixIcon, suffixIcon, rlsTheme, onClick }) {
|
|
59
|
-
return (
|
|
1405
|
+
return (jsxRuntimeExports.jsx("button", { className: "rls-button", onClick: onClick, "rls-theme": rlsTheme, disabled: disabled, children: jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-button__content', { type }), children: [prefixIcon && jsxRuntimeExports.jsx(RlsIcon, { value: prefixIcon }), children && jsxRuntimeExports.jsx("div", { className: "rls-button__label", children: children }), suffixIcon && jsxRuntimeExports.jsx(RlsIcon, { value: suffixIcon })] }) }));
|
|
60
1406
|
}
|
|
61
1407
|
|
|
62
1408
|
function RlsButtonAction({ icon, disabled, tooltip, onClick }) {
|
|
63
|
-
return (
|
|
1409
|
+
return (jsxRuntimeExports.jsxs("button", { className: "rls-button-action", onClick: onClick, disabled: disabled, children: [jsxRuntimeExports.jsx("div", { className: "rls-button-action__content", children: jsxRuntimeExports.jsx(RlsIcon, { value: icon }) }), tooltip && (jsxRuntimeExports.jsx("div", { className: "rls-button-action__tooltip caption-semibold", children: jsxRuntimeExports.jsx("span", { children: tooltip }) }))] }));
|
|
64
1410
|
}
|
|
65
1411
|
|
|
66
1412
|
function RlsCheckBox({ checked, disabled, onClick, rlsTheme }) {
|
|
67
|
-
return (
|
|
1413
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-checkbox', { checked, disabled }), onClick: onClick, "rls-theme": rlsTheme, children: jsxRuntimeExports.jsx("div", { className: "rls-checkbox__component" }) }));
|
|
68
1414
|
}
|
|
69
1415
|
function RlsCheckBoxControl({ formControl, disabled, rlsTheme }) {
|
|
70
|
-
return (
|
|
71
|
-
formControl.
|
|
1416
|
+
return (jsxRuntimeExports.jsx(RlsCheckBox, { checked: !!formControl.value, disabled: disabled, onClick: () => {
|
|
1417
|
+
formControl.setValue(!formControl.value);
|
|
72
1418
|
}, rlsTheme: rlsTheme }));
|
|
73
1419
|
}
|
|
74
1420
|
|
|
75
1421
|
function RlsInput({ children, disabled, formControl, placeholder, type, value, onValue }) {
|
|
76
|
-
const [focused, setFocused] =
|
|
1422
|
+
const [focused, setFocused] = require$$0.useState(false);
|
|
77
1423
|
function onChange(event) {
|
|
78
|
-
|
|
1424
|
+
setValue(type === 'number' ? +event.target.value : event.target.value);
|
|
79
1425
|
}
|
|
80
|
-
function
|
|
81
|
-
formControl?.
|
|
1426
|
+
function setValue(value) {
|
|
1427
|
+
formControl?.setValue(value);
|
|
82
1428
|
if (onValue) {
|
|
83
1429
|
onValue(value);
|
|
84
1430
|
}
|
|
@@ -88,21 +1434,18 @@ function RlsInput({ children, disabled, formControl, placeholder, type, value, o
|
|
|
88
1434
|
setFocused(true);
|
|
89
1435
|
}
|
|
90
1436
|
function onBlur() {
|
|
91
|
-
if (formControl && !formControl.touched) {
|
|
92
|
-
formControl.touch();
|
|
93
|
-
}
|
|
94
1437
|
formControl?.blur();
|
|
95
1438
|
setFocused(false);
|
|
96
1439
|
}
|
|
97
|
-
return (
|
|
1440
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-input', {
|
|
98
1441
|
focused: formControl?.focused || focused,
|
|
99
1442
|
disabled: formControl?.disabled || disabled
|
|
100
|
-
}), children: [
|
|
1443
|
+
}), children: [jsxRuntimeExports.jsx("input", { ref: formControl?.elementRef, className: "rls-input__component", autoComplete: "off", type: type || 'text', placeholder: placeholder, disabled: formControl?.disabled || disabled, onFocus: onFocus, onBlur: onBlur, onChange: onChange, value: formControl?.value || value || '' }), jsxRuntimeExports.jsx("span", { className: "rls-input__value", children: children })] }));
|
|
101
1444
|
}
|
|
102
1445
|
|
|
103
1446
|
function RlsInputMoney({ decimals, disabled, formControl, placeholder, symbol, value, onValue }) {
|
|
104
|
-
const [valueInput, setValueInput] =
|
|
105
|
-
function
|
|
1447
|
+
const [valueInput, setValueInput] = require$$0.useState(value || 0);
|
|
1448
|
+
function onChange(value) {
|
|
106
1449
|
if (!formControl) {
|
|
107
1450
|
setValueInput(value);
|
|
108
1451
|
}
|
|
@@ -110,12 +1453,12 @@ function RlsInputMoney({ decimals, disabled, formControl, placeholder, symbol, v
|
|
|
110
1453
|
onValue(value);
|
|
111
1454
|
}
|
|
112
1455
|
}
|
|
113
|
-
return (
|
|
1456
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-input-money", children: jsxRuntimeExports.jsx(RlsInput, { formControl: formControl, type: "number", value: value, disabled: disabled, placeholder: placeholder, onValue: onChange, children: jsxRuntimeExports.jsx(RlsAmount, { value: formControl?.value || value || valueInput, symbol: symbol, decimals: decimals }) }) }));
|
|
114
1457
|
}
|
|
115
1458
|
|
|
116
1459
|
function RlsInputNumber({ disabled, formControl, placeholder, value, onValue }) {
|
|
117
|
-
const [valueInput, setValueInput] =
|
|
118
|
-
function
|
|
1460
|
+
const [valueInput, setValueInput] = require$$0.useState(value || 0);
|
|
1461
|
+
function onChange(value) {
|
|
119
1462
|
if (!formControl) {
|
|
120
1463
|
setValueInput(value);
|
|
121
1464
|
}
|
|
@@ -123,13 +1466,13 @@ function RlsInputNumber({ disabled, formControl, placeholder, value, onValue })
|
|
|
123
1466
|
onValue(value);
|
|
124
1467
|
}
|
|
125
1468
|
}
|
|
126
|
-
return (
|
|
1469
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-input-number", children: jsxRuntimeExports.jsx(RlsInput, { formControl: formControl, type: "number", value: value, disabled: disabled, placeholder: placeholder, onValue: onChange, children: formControl?.value || value || valueInput }) }));
|
|
127
1470
|
}
|
|
128
1471
|
|
|
129
1472
|
function RlsInputPassword({ disabled, formControl, placeholder, type, onValue }) {
|
|
130
|
-
const [focused, setFocused] =
|
|
1473
|
+
const [focused, setFocused] = require$$0.useState(false);
|
|
131
1474
|
function onChange(event) {
|
|
132
|
-
formControl?.
|
|
1475
|
+
formControl?.setValue(event.target.value);
|
|
133
1476
|
if (onValue) {
|
|
134
1477
|
onValue(event.target.value);
|
|
135
1478
|
}
|
|
@@ -139,21 +1482,22 @@ function RlsInputPassword({ disabled, formControl, placeholder, type, onValue })
|
|
|
139
1482
|
setFocused(true);
|
|
140
1483
|
}
|
|
141
1484
|
function onBlur() {
|
|
142
|
-
if (formControl && !formControl.touched) {
|
|
143
|
-
formControl.touch();
|
|
144
|
-
}
|
|
145
1485
|
formControl?.blur();
|
|
146
1486
|
setFocused(false);
|
|
147
1487
|
}
|
|
148
|
-
return (
|
|
1488
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-input-password', {
|
|
149
1489
|
focused: formControl?.focused || focused,
|
|
150
1490
|
disabled
|
|
151
|
-
}), children:
|
|
1491
|
+
}), children: jsxRuntimeExports.jsx("input", { className: "rls-input-password__component", autoComplete: "off", type: type || 'password', placeholder: placeholder, disabled: disabled, onFocus: onFocus, onBlur: onBlur, onChange: onChange }) }));
|
|
1492
|
+
}
|
|
1493
|
+
|
|
1494
|
+
function RlsInputSearch({ formControl, placeholder, onSearch }) {
|
|
1495
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-input-search", children: [jsxRuntimeExports.jsx(RlsInput, { formControl: formControl, placeholder: placeholder }), onSearch && jsxRuntimeExports.jsx(RlsButtonAction, { icon: "search", onClick: onSearch })] }));
|
|
152
1496
|
}
|
|
153
1497
|
|
|
154
1498
|
function RlsInputText({ disabled, formControl, placeholder, value, onValue }) {
|
|
155
|
-
const [valueInput, setValueInput] =
|
|
156
|
-
function
|
|
1499
|
+
const [valueInput, setValueInput] = require$$0.useState(value || '');
|
|
1500
|
+
function onChange(value) {
|
|
157
1501
|
if (!formControl) {
|
|
158
1502
|
setValueInput(value);
|
|
159
1503
|
}
|
|
@@ -161,68 +1505,64 @@ function RlsInputText({ disabled, formControl, placeholder, value, onValue }) {
|
|
|
161
1505
|
onValue(value);
|
|
162
1506
|
}
|
|
163
1507
|
}
|
|
164
|
-
return (
|
|
1508
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-input-text", children: jsxRuntimeExports.jsx(RlsInput, { formControl: formControl, type: "text", value: value, disabled: disabled, placeholder: placeholder, onValue: onChange, children: formControl?.value || value || valueInput }) }));
|
|
165
1509
|
}
|
|
166
1510
|
|
|
167
1511
|
function RlsLabel({ children, rlsTheme }) {
|
|
168
|
-
return (
|
|
1512
|
+
return (jsxRuntimeExports.jsx("label", { className: "rls-label", "rls-theme": rlsTheme, children: children }));
|
|
169
1513
|
}
|
|
170
1514
|
|
|
171
1515
|
function RlsMessageIcon({ icon, children, rlsTheme }) {
|
|
172
|
-
return (
|
|
1516
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-message-icon", "rls-theme": rlsTheme, children: [icon && jsxRuntimeExports.jsx(RlsIcon, { value: icon }), jsxRuntimeExports.jsx("span", { className: "truncate", children: children })] }));
|
|
173
1517
|
}
|
|
174
1518
|
|
|
175
1519
|
function RlsPoster({ children, rlsTheme }) {
|
|
176
|
-
return (
|
|
1520
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-poster", "rls-theme": rlsTheme, children: children }));
|
|
177
1521
|
}
|
|
178
1522
|
|
|
179
1523
|
function RlsProgressBar({ indeterminate, percentage, rlsTheme }) {
|
|
180
|
-
return (
|
|
1524
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-progress-bar', { indeterminate }), "rls-theme": rlsTheme, children: jsxRuntimeExports.jsx("div", { className: "rls-progress-bar__component", style: { width: `${percentage || 0}%` } }) }));
|
|
181
1525
|
}
|
|
182
1526
|
|
|
183
1527
|
function RlsProgressCircular({ rlsTheme }) {
|
|
184
|
-
return (
|
|
1528
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-progress-circular", "rls-theme": rlsTheme, children: jsxRuntimeExports.jsx("svg", { className: "rls-progress-circular__svg", viewBox: "0 0 36 36", children: jsxRuntimeExports.jsx("circle", { className: "rls-progress-circular__circle", cx: "18", cy: "18", r: "12" }) }) }));
|
|
185
1529
|
}
|
|
186
1530
|
|
|
187
1531
|
function RlsRadioButton({ checked, disabled, rlsTheme, onClick }) {
|
|
188
|
-
return (
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
function RlsSearchInput({ formControl, placeholder, onSearch }) {
|
|
192
|
-
return (jsxRuntime.jsxs("div", { className: "rls-search-input", children: [jsxRuntime.jsx(RlsInput, { formControl: formControl, placeholder: placeholder }), onSearch && jsxRuntime.jsx(RlsButtonAction, { icon: "search", onClick: onSearch })] }));
|
|
1532
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-radiobutton', { checked, disabled }), onClick: onClick, "rls-theme": rlsTheme, children: jsxRuntimeExports.jsx("div", { className: "rls-radiobutton__component" }) }));
|
|
193
1533
|
}
|
|
194
1534
|
|
|
195
1535
|
function RlsSkeleton({ rlsTheme }) {
|
|
196
|
-
return
|
|
1536
|
+
return jsxRuntimeExports.jsx("div", { className: "rls-skeleton", "rls-theme": rlsTheme });
|
|
197
1537
|
}
|
|
198
1538
|
|
|
199
1539
|
function RlsSkeletonText({ active, children, rlsTheme }) {
|
|
200
|
-
return (
|
|
1540
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-skeleton-text", "rls-theme": rlsTheme, children: active ? (jsxRuntimeExports.jsx(RlsSkeleton, {})) : (jsxRuntimeExports.jsx("span", { className: "rls-skeleton-text__value", children: children })) }));
|
|
201
1541
|
}
|
|
202
1542
|
|
|
203
1543
|
function RlsSwitch({ checked, disabled, rlsTheme, onClick }) {
|
|
204
|
-
return (
|
|
1544
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-switch', { checked, disabled }), onClick: onClick, "rls-theme": rlsTheme, children: jsxRuntimeExports.jsxs("div", { className: "rls-switch__component", children: [jsxRuntimeExports.jsx("div", { className: "rls-switch__component__element" }), jsxRuntimeExports.jsx("div", { className: "rls-switch__component__bar" })] }) }));
|
|
205
1545
|
}
|
|
206
1546
|
function RlsSwitchControl({ formControl, disabled, rlsTheme }) {
|
|
207
|
-
return (
|
|
208
|
-
formControl.
|
|
1547
|
+
return (jsxRuntimeExports.jsx(RlsSwitch, { checked: formControl.value || false, disabled: disabled, onClick: () => {
|
|
1548
|
+
formControl.setValue(!formControl.value);
|
|
209
1549
|
}, rlsTheme: rlsTheme }));
|
|
210
1550
|
}
|
|
211
1551
|
|
|
212
1552
|
function RlsBallot({ bordered, children, img, initials, skeleton, subtitle, rlsTheme }) {
|
|
213
|
-
return (
|
|
1553
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-ballot', { bordered, skeleton }), "rls-theme": rlsTheme, children: [(img || initials) && (jsxRuntimeExports.jsxs(RlsAvatar, { skeleton: skeleton, children: [img && jsxRuntimeExports.jsx("img", { src: img }), initials && jsxRuntimeExports.jsx("span", { children: initials })] })), jsxRuntimeExports.jsxs("div", { className: "rls-ballot__component", children: [jsxRuntimeExports.jsx("label", { className: "rls-ballot__title", children: jsxRuntimeExports.jsx(RlsSkeletonText, { active: skeleton, children: children }) }), subtitle && (jsxRuntimeExports.jsx("label", { className: "rls-ballot__subtitle", children: jsxRuntimeExports.jsx(RlsSkeletonText, { active: skeleton, children: subtitle }) }))] })] }));
|
|
214
1554
|
}
|
|
215
1555
|
|
|
216
1556
|
function RlsButtonProgress({ icon, disabled, onClick, progressing, rlsTheme }) {
|
|
217
|
-
return (
|
|
1557
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-button-progress', { progressing }), "rls-theme": rlsTheme, children: [!progressing && (jsxRuntimeExports.jsx(RlsButtonAction, { icon: icon, onClick: onClick, disabled: disabled })), progressing && jsxRuntimeExports.jsx(RlsProgressCircular, {})] }));
|
|
218
1558
|
}
|
|
219
1559
|
|
|
220
1560
|
function RlsButtonToggle({ onAction, options, type, automatic, disabled, rlsTheme }) {
|
|
221
|
-
const componentRef =
|
|
1561
|
+
const componentRef = require$$0.useRef(null);
|
|
222
1562
|
const [firstAction] = options;
|
|
223
|
-
const [action, setAction] =
|
|
224
|
-
const [visible, setVisible] =
|
|
225
|
-
|
|
1563
|
+
const [action, setAction] = require$$0.useState(firstAction);
|
|
1564
|
+
const [visible, setVisible] = require$$0.useState(false);
|
|
1565
|
+
require$$0.useEffect(() => {
|
|
226
1566
|
function onCloseMenu({ target }) {
|
|
227
1567
|
if (!componentRef?.current?.contains(target)) {
|
|
228
1568
|
setVisible(false);
|
|
@@ -243,824 +1583,187 @@ function RlsButtonToggle({ onAction, options, type, automatic, disabled, rlsThem
|
|
|
243
1583
|
onAction(action.value);
|
|
244
1584
|
}
|
|
245
1585
|
}
|
|
246
|
-
return (
|
|
1586
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-button-toggle", ref: componentRef, "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: "rls-button-toggle__content", children: [action && (jsxRuntimeExports.jsx("div", { className: "rls-button-toggle__action", children: jsxRuntimeExports.jsx(RlsButton, { disabled: disabled, type: type, onClick: () => onAction(action.value), children: action.label }) })), jsxRuntimeExports.jsx("div", { className: "rls-button-toggle__icon", children: jsxRuntimeExports.jsx(RlsButton, { type: type, prefixIcon: "arrow-ios-down", disabled: disabled, onClick: onClickMenu }) })] }), jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-button-toggle__list', {
|
|
247
1587
|
visible,
|
|
248
1588
|
hide: !visible
|
|
249
|
-
}), children:
|
|
1589
|
+
}), children: jsxRuntimeExports.jsx("ul", { children: options.map((action, index) => (jsxRuntimeExports.jsx("li", { className: "truncate", onClick: () => onSelectAction(action), children: action.label }, index))) }) })] }));
|
|
250
1590
|
}
|
|
251
1591
|
|
|
252
1592
|
function RlsMessageFormError({ className, formControl }) {
|
|
253
|
-
return (
|
|
1593
|
+
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: formControl?.wrong && (jsxRuntimeExports.jsx("div", { className: className, children: jsxRuntimeExports.jsx(RlsMessageIcon, { icon: "alert-triangle", rlsTheme: "danger", children: formControl?.error?.message }) })) }));
|
|
254
1594
|
}
|
|
255
1595
|
|
|
256
1596
|
function RlsFieldMoney({ children, decimals, disabled, formControl, placeholder, symbol, rlsTheme, value, onValue }) {
|
|
257
|
-
return (
|
|
1597
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', {
|
|
258
1598
|
focused: formControl?.focused,
|
|
259
1599
|
error: formControl?.wrong,
|
|
260
1600
|
disabled: formControl?.disabled || disabled
|
|
261
|
-
}, 'rls-field-money'), "rls-theme": rlsTheme, children: [children &&
|
|
1601
|
+
}, 'rls-field-money'), "rls-theme": rlsTheme, children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsx("div", { className: "rls-field-box__body", children: jsxRuntimeExports.jsx(RlsInputMoney, { formControl: formControl, value: value, disabled: disabled, placeholder: placeholder, symbol: symbol, decimals: decimals, onValue: onValue }) }) }), jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })] }));
|
|
262
1602
|
}
|
|
263
1603
|
|
|
264
1604
|
function RlsFieldNumber({ children, disabled, formControl, placeholder, rlsTheme, value, onValue }) {
|
|
265
|
-
return (
|
|
1605
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', {
|
|
266
1606
|
focused: formControl?.focused,
|
|
267
1607
|
error: formControl?.wrong,
|
|
268
1608
|
disabled: formControl?.disabled || disabled
|
|
269
|
-
}, 'rls-field-number'), "rls-theme": rlsTheme, children: [children &&
|
|
1609
|
+
}, 'rls-field-number'), "rls-theme": rlsTheme, children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsx("div", { className: "rls-field-box__body", children: jsxRuntimeExports.jsx(RlsInputNumber, { formControl: formControl, value: value, disabled: disabled, placeholder: placeholder, onValue: onValue }) }) }), jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })] }));
|
|
270
1610
|
}
|
|
271
1611
|
|
|
272
1612
|
function RlsFieldPassword({ children, disabled, formControl, placeholder, rlsTheme }) {
|
|
273
|
-
const [password, setPassword] =
|
|
1613
|
+
const [password, setPassword] = require$$0.useState(true);
|
|
274
1614
|
function onToggleInput() {
|
|
275
1615
|
setPassword(!password);
|
|
276
1616
|
}
|
|
277
|
-
return (
|
|
1617
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus(' rls-field-box', {
|
|
278
1618
|
focused: formControl?.focused,
|
|
279
1619
|
error: formControl?.wrong,
|
|
280
1620
|
disabled: formControl?.disabled || disabled
|
|
281
|
-
}, 'rls-field-password'), "rls-theme": rlsTheme, children: [children &&
|
|
1621
|
+
}, 'rls-field-password'), "rls-theme": rlsTheme, children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-box__body", children: [jsxRuntimeExports.jsx(RlsInputPassword, { formControl: formControl, disabled: disabled, placeholder: placeholder, type: password ? 'password' : 'text' }), jsxRuntimeExports.jsx(RlsButtonAction, { icon: password ? 'eye' : 'eye-off', onClick: onToggleInput })] }) }), jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })] }));
|
|
282
1622
|
}
|
|
283
1623
|
|
|
284
1624
|
function RlsFieldText({ children, disabled, formControl, placeholder, rlsTheme, value, onValue }) {
|
|
285
|
-
return (
|
|
1625
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', {
|
|
286
1626
|
focused: formControl?.focused,
|
|
287
1627
|
error: formControl?.wrong,
|
|
288
1628
|
disabled: formControl?.disabled || disabled
|
|
289
|
-
}, 'rls-field-text'), "rls-theme": rlsTheme, children: [children &&
|
|
1629
|
+
}, 'rls-field-text'), "rls-theme": rlsTheme, children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsx("div", { className: "rls-field-box__body", children: jsxRuntimeExports.jsx(RlsInputText, { formControl: formControl, value: value, disabled: disabled, placeholder: placeholder, onValue: onValue }) }) }), jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })] }));
|
|
290
1630
|
}
|
|
291
1631
|
|
|
292
1632
|
function RlsLabelCheckBox({ children, disabled, extended, formControl, rlsTheme }) {
|
|
293
|
-
const [checked, setChecked] =
|
|
294
|
-
|
|
295
|
-
setChecked(formControl?.
|
|
296
|
-
}, [formControl?.
|
|
1633
|
+
const [checked, setChecked] = require$$0.useState(!!formControl?.value);
|
|
1634
|
+
require$$0.useEffect(() => {
|
|
1635
|
+
setChecked(!!formControl?.value);
|
|
1636
|
+
}, [formControl?.value]);
|
|
297
1637
|
function onToggle() {
|
|
298
1638
|
if (formControl) {
|
|
299
|
-
formControl?.
|
|
1639
|
+
formControl?.setValue(!formControl.value);
|
|
300
1640
|
}
|
|
301
1641
|
else {
|
|
302
1642
|
setChecked(!checked);
|
|
303
1643
|
}
|
|
304
1644
|
}
|
|
305
|
-
return (
|
|
1645
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-label-checkbox', {
|
|
306
1646
|
disabled,
|
|
307
1647
|
extended
|
|
308
|
-
}), "rls-theme": rlsTheme, children: [
|
|
1648
|
+
}), "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsx("div", { className: "rls-label-checkbox__component", onClick: onToggle, children: jsxRuntimeExports.jsx(RlsCheckBox, { checked: checked, disabled: disabled }) }), jsxRuntimeExports.jsx("label", { className: "rls-label-checkbox__text", children: children })] }));
|
|
309
1649
|
}
|
|
310
1650
|
|
|
311
1651
|
function RlsLabelRadioButton({ children, disabled, extended, formControl, rlsTheme, value }) {
|
|
312
|
-
const [checked, setChecked] =
|
|
313
|
-
|
|
314
|
-
setChecked(formControl?.
|
|
315
|
-
}, [formControl?.
|
|
1652
|
+
const [checked, setChecked] = require$$0.useState(formControl?.value === value);
|
|
1653
|
+
require$$0.useEffect(() => {
|
|
1654
|
+
setChecked(formControl?.value === value);
|
|
1655
|
+
}, [formControl?.value]);
|
|
316
1656
|
function onSelect() {
|
|
317
1657
|
if (formControl) {
|
|
318
|
-
formControl?.
|
|
1658
|
+
formControl?.setValue(value);
|
|
319
1659
|
}
|
|
320
1660
|
}
|
|
321
|
-
return (
|
|
1661
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-label-radiobutton', {
|
|
322
1662
|
disabled,
|
|
323
1663
|
extended
|
|
324
|
-
}), "rls-theme": rlsTheme, children: [
|
|
1664
|
+
}), "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsx("div", { className: "rls-label-radiobutton__component", onClick: onSelect, children: jsxRuntimeExports.jsx(RlsRadioButton, { checked: checked, disabled: disabled }) }), jsxRuntimeExports.jsx("label", { className: "rls-label-radiobutton__text", children: children })] }));
|
|
325
1665
|
}
|
|
326
1666
|
|
|
327
1667
|
function RlsLabelSwitch({ children, disabled, extended, formControl, rlsTheme }) {
|
|
328
|
-
const [checked, setChecked] =
|
|
329
|
-
|
|
330
|
-
setChecked(formControl?.
|
|
331
|
-
}, [formControl?.
|
|
1668
|
+
const [checked, setChecked] = require$$0.useState(!!formControl?.value);
|
|
1669
|
+
require$$0.useEffect(() => {
|
|
1670
|
+
setChecked(!!formControl?.value);
|
|
1671
|
+
}, [formControl?.value]);
|
|
332
1672
|
function onToggle() {
|
|
333
1673
|
if (formControl) {
|
|
334
|
-
formControl?.
|
|
1674
|
+
formControl?.setValue(!formControl.value);
|
|
335
1675
|
}
|
|
336
1676
|
else {
|
|
337
1677
|
setChecked(!checked);
|
|
338
1678
|
}
|
|
339
1679
|
}
|
|
340
|
-
return (
|
|
341
|
-
}
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
const
|
|
345
|
-
const
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
}, [
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
const isLastPage = currentPagination?.value === maxPage - 1;
|
|
363
|
-
setFirstPage(isFirstPage);
|
|
364
|
-
setLastPage(isLastPage);
|
|
365
|
-
if (onPagination) {
|
|
366
|
-
onPagination({ firstPage: isFirstPage, lastPage: isLastPage });
|
|
367
|
-
}
|
|
368
|
-
}, [currentPagination]);
|
|
369
|
-
react.useEffect(() => {
|
|
370
|
-
refreshFromFilter(filter);
|
|
1680
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-label-switch', { disabled, extended }), "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsx("div", { className: "rls-label-switch__component", onClick: onToggle, children: jsxRuntimeExports.jsx(RlsSwitch, { checked: checked, disabled: disabled }) }), jsxRuntimeExports.jsx("label", { className: "rls-label-switch__text", children: children })] }));
|
|
1681
|
+
}
|
|
1682
|
+
|
|
1683
|
+
function RlsPagination({ suggestions, count, filter, onPagination }) {
|
|
1684
|
+
const controller = require$$0.useRef(new components.PaginationController({ suggestions, count }));
|
|
1685
|
+
const [template, setTemplate] = require$$0.useState(controller.current.template);
|
|
1686
|
+
require$$0.useEffect(() => {
|
|
1687
|
+
controller.current = new components.PaginationController({
|
|
1688
|
+
suggestions,
|
|
1689
|
+
count,
|
|
1690
|
+
position: template.currentPage.value
|
|
1691
|
+
});
|
|
1692
|
+
onPagination &&
|
|
1693
|
+
onPagination({
|
|
1694
|
+
firstPage: controller.current.template.firstPage,
|
|
1695
|
+
lastPage: controller.current.template.lastPage,
|
|
1696
|
+
suggestions: controller.current.page.collection
|
|
1697
|
+
});
|
|
1698
|
+
setTemplate(controller.current.template);
|
|
1699
|
+
}, [suggestions, count]);
|
|
1700
|
+
require$$0.useEffect(() => {
|
|
1701
|
+
refreshPagination(controller.current.filtrable(filter));
|
|
371
1702
|
}, [filter]);
|
|
372
|
-
function
|
|
373
|
-
if (
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
1703
|
+
function refreshPagination(pagination) {
|
|
1704
|
+
if (pagination) {
|
|
1705
|
+
const { page, template } = pagination;
|
|
1706
|
+
const { firstPage, lastPage } = template;
|
|
1707
|
+
onPagination &&
|
|
1708
|
+
onPagination({
|
|
1709
|
+
firstPage,
|
|
1710
|
+
lastPage,
|
|
1711
|
+
suggestions: page.collection
|
|
1712
|
+
});
|
|
1713
|
+
setTemplate(template);
|
|
1714
|
+
}
|
|
1715
|
+
}
|
|
1716
|
+
function goToPagination(page) {
|
|
1717
|
+
refreshPagination(controller.current.goToPage(page));
|
|
386
1718
|
}
|
|
387
|
-
function
|
|
388
|
-
|
|
389
|
-
currentPagination.active = false;
|
|
390
|
-
}
|
|
391
|
-
onSelectPagination(pagination);
|
|
1719
|
+
function goFirstPagination() {
|
|
1720
|
+
refreshPagination(controller.current.goFirstPage());
|
|
392
1721
|
}
|
|
393
1722
|
function goPreviousPagination() {
|
|
394
|
-
|
|
395
|
-
const { prev, value } = currentPagination;
|
|
396
|
-
if (prev) {
|
|
397
|
-
onSelectPagination(prev);
|
|
398
|
-
currentPagination.active = false;
|
|
399
|
-
}
|
|
400
|
-
else {
|
|
401
|
-
const prevIndex = value - MIN_NUMBER_PAGE;
|
|
402
|
-
if (prevIndex >= FIRST_PAGE) {
|
|
403
|
-
refreshFromChanged(clonePageFromIndex(prevIndex));
|
|
404
|
-
}
|
|
405
|
-
}
|
|
406
|
-
}
|
|
407
|
-
}
|
|
408
|
-
function goFirstPagination() {
|
|
409
|
-
if (collection.length) {
|
|
410
|
-
refreshFromChanged(clonePageFromIndex(FIRST_PAGE));
|
|
411
|
-
}
|
|
1723
|
+
refreshPagination(controller.current.goPreviousPage());
|
|
412
1724
|
}
|
|
413
1725
|
function goNextPagination() {
|
|
414
|
-
|
|
415
|
-
const { next, value } = currentPagination;
|
|
416
|
-
if (next) {
|
|
417
|
-
onSelectPagination(next);
|
|
418
|
-
currentPagination.active = false;
|
|
419
|
-
}
|
|
420
|
-
else {
|
|
421
|
-
const nextIndex = value + 1;
|
|
422
|
-
if (nextIndex <= maxPage) {
|
|
423
|
-
refreshFromChanged(clonePageFromIndex(nextIndex));
|
|
424
|
-
}
|
|
425
|
-
}
|
|
426
|
-
}
|
|
1726
|
+
refreshPagination(controller.current.goNextPage());
|
|
427
1727
|
}
|
|
428
1728
|
function goLastPagination() {
|
|
429
|
-
|
|
430
|
-
refreshFromChanged(clonePageFromIndex(maxPage - MIN_NUMBER_PAGE));
|
|
431
|
-
}
|
|
432
|
-
}
|
|
433
|
-
function createPageCollection(props) {
|
|
434
|
-
const { collection, count, index } = props;
|
|
435
|
-
if (collection.length) {
|
|
436
|
-
const finish = (index + MIN_NUMBER_PAGE) * count;
|
|
437
|
-
const start = index * count;
|
|
438
|
-
return collection.slice(start, finish);
|
|
439
|
-
}
|
|
440
|
-
return [];
|
|
441
|
-
}
|
|
442
|
-
function refreshFromElements(elements) {
|
|
443
|
-
elements.length
|
|
444
|
-
? refreshFromChanged(refreshPage(elements, filter))
|
|
445
|
-
: rebootPagination();
|
|
446
|
-
}
|
|
447
|
-
function refreshFromFilter(filter) {
|
|
448
|
-
refreshFromChanged(refreshPage(elements, filter));
|
|
449
|
-
}
|
|
450
|
-
function refreshFromChanged(page) {
|
|
451
|
-
refreshPaginations(page);
|
|
452
|
-
refreshDescription(page);
|
|
453
|
-
onChangeElements(createPageCollection(page));
|
|
454
|
-
}
|
|
455
|
-
function refreshCollection(elements, filter) {
|
|
456
|
-
const collection = filter
|
|
457
|
-
? elements.filter((element) => helpersString.hasPattern(JSON.stringify(element), filter))
|
|
458
|
-
: elements;
|
|
459
|
-
setCollection(collection);
|
|
460
|
-
return collection;
|
|
461
|
-
}
|
|
462
|
-
function refreshMaxPage(collection, count) {
|
|
463
|
-
const maxPage = calculateMaxPage(collection, count);
|
|
464
|
-
setMaxPage(maxPage);
|
|
465
|
-
return maxPage;
|
|
466
|
-
}
|
|
467
|
-
function refreshIndex(collection, currentMaxPage) {
|
|
468
|
-
const maxPage = currentMaxPage || refreshMaxPage(collection, count);
|
|
469
|
-
if (index < maxPage || index === FIRST_PAGE) {
|
|
470
|
-
return index;
|
|
471
|
-
}
|
|
472
|
-
const newIndex = maxPage - 1;
|
|
473
|
-
setIndex(newIndex);
|
|
474
|
-
return newIndex;
|
|
475
|
-
}
|
|
476
|
-
function refreshDescription(page) {
|
|
477
|
-
const { collection, count, index } = page;
|
|
478
|
-
const totalCount = elements.length;
|
|
479
|
-
const start = index * count + MIN_NUMBER_PAGE;
|
|
480
|
-
let end = (index + MIN_NUMBER_PAGE) * count;
|
|
481
|
-
if (end > collection.length) {
|
|
482
|
-
end = collection.length;
|
|
483
|
-
}
|
|
484
|
-
setDescription(`${start} - ${end} de ${totalCount}`);
|
|
485
|
-
}
|
|
486
|
-
function refreshPaginations({ index, maxPage }) {
|
|
487
|
-
let maxPageVisible = index + DEFAULT_MAX_VISIBLE;
|
|
488
|
-
if (maxPageVisible > maxPage) {
|
|
489
|
-
maxPageVisible = maxPage;
|
|
490
|
-
}
|
|
491
|
-
let minIndexPage = maxPageVisible - DEFAULT_MAX_VISIBLE;
|
|
492
|
-
if (minIndexPage < 0) {
|
|
493
|
-
minIndexPage = 0;
|
|
494
|
-
}
|
|
495
|
-
if (minIndexPage > index) {
|
|
496
|
-
minIndexPage = index;
|
|
497
|
-
}
|
|
498
|
-
let prevPagination = undefined;
|
|
499
|
-
const paginations = [];
|
|
500
|
-
for (let i = minIndexPage; i < maxPageVisible; i++) {
|
|
501
|
-
const pagination = createPagination(i, index);
|
|
502
|
-
paginations.push(pagination);
|
|
503
|
-
pagination.prev = prevPagination;
|
|
504
|
-
if (prevPagination) {
|
|
505
|
-
prevPagination.next = pagination;
|
|
506
|
-
}
|
|
507
|
-
prevPagination = pagination;
|
|
508
|
-
}
|
|
509
|
-
setPaginations(paginations);
|
|
1729
|
+
refreshPagination(controller.current.goLastPage());
|
|
510
1730
|
}
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
collection: pagePartial.collection || collection,
|
|
514
|
-
index: typeof pagePartial.index === 'number' ? pagePartial.index : index,
|
|
515
|
-
count: pagePartial.count || count,
|
|
516
|
-
maxPage: typeof pagePartial.maxPage === 'number' ? pagePartial.maxPage : maxPage
|
|
517
|
-
};
|
|
518
|
-
}
|
|
519
|
-
function clonePageFromIndex(index) {
|
|
520
|
-
return clonePage({ index });
|
|
521
|
-
}
|
|
522
|
-
function refreshPage(elements, filter) {
|
|
523
|
-
const collection = refreshCollection(elements, filter);
|
|
524
|
-
const maxPage = refreshMaxPage(collection, count);
|
|
525
|
-
const index = refreshIndex(collection, maxPage);
|
|
526
|
-
return clonePage({ collection, index, maxPage });
|
|
527
|
-
}
|
|
528
|
-
function createPagination(value, index) {
|
|
529
|
-
const active = value === index;
|
|
530
|
-
const pagination = {
|
|
531
|
-
label: (value + 1).toString(),
|
|
532
|
-
value,
|
|
533
|
-
active
|
|
534
|
-
};
|
|
535
|
-
if (active) {
|
|
536
|
-
setCurrentPagination(pagination);
|
|
537
|
-
}
|
|
538
|
-
return pagination;
|
|
539
|
-
}
|
|
540
|
-
function rebootPagination() {
|
|
541
|
-
setCollection([]);
|
|
542
|
-
setMaxPage(0);
|
|
543
|
-
setIndex(0);
|
|
544
|
-
setPaginations([]);
|
|
545
|
-
onChangeElements([]);
|
|
546
|
-
}
|
|
547
|
-
return (jsxRuntime.jsxs("div", { className: "rls-pagination", children: [jsxRuntime.jsxs("div", { className: "rls-pagination__actions", children: [jsxRuntime.jsx("button", { className: "rls-pagination__action", onClick: goFirstPagination, disabled: firstPage, children: jsxRuntime.jsx(RlsIcon, { value: "arrowhead-left" }) }), jsxRuntime.jsx("button", { className: "rls-pagination__action", onClick: goPreviousPagination, disabled: firstPage, children: jsxRuntime.jsx(RlsIcon, { value: "arrow-ios-left" }) })] }), jsxRuntime.jsx("div", { className: "rls-pagination__pages", children: paginations.map((page, index) => {
|
|
548
|
-
return (jsxRuntime.jsx("div", { className: renderClassStatus('rls-pagination__page', {
|
|
1731
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-pagination", children: [jsxRuntimeExports.jsxs("div", { className: "rls-pagination__actions", children: [jsxRuntimeExports.jsx("button", { className: "rls-pagination__action", onClick: goFirstPagination, disabled: template.firstPage, children: jsxRuntimeExports.jsx(RlsIcon, { value: "arrowhead-left" }) }), jsxRuntimeExports.jsx("button", { className: "rls-pagination__action", onClick: goPreviousPagination, disabled: template.firstPage, children: jsxRuntimeExports.jsx(RlsIcon, { value: "arrow-ios-left" }) })] }), jsxRuntimeExports.jsx("div", { className: "rls-pagination__pages", children: template.pages.map((page, index) => {
|
|
1732
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-pagination__page', {
|
|
549
1733
|
active: page.active
|
|
550
1734
|
}), onClick: () => {
|
|
551
|
-
|
|
1735
|
+
goToPagination(page);
|
|
552
1736
|
}, children: page.label }, index));
|
|
553
|
-
}) }),
|
|
554
|
-
}
|
|
555
|
-
|
|
556
|
-
function dateIsOutRangeMin(props) {
|
|
557
|
-
const { date, minDate } = props;
|
|
558
|
-
return !!minDate && helpersDate.dateIsBefore(helpersDate.normalizeMinTime(minDate), date);
|
|
559
|
-
}
|
|
560
|
-
function dateIsOutRangeMax(props) {
|
|
561
|
-
const { date, maxDate } = props;
|
|
562
|
-
return !!maxDate && helpersDate.dateIsAfter(helpersDate.normalizeMaxTime(maxDate), date);
|
|
563
|
-
}
|
|
564
|
-
function dateOutRange(props) {
|
|
565
|
-
return dateIsOutRangeMin(props) || dateIsOutRangeMax(props);
|
|
566
|
-
}
|
|
567
|
-
function checkDateRange(props) {
|
|
568
|
-
const { date, maxDate, minDate } = props;
|
|
569
|
-
return minDate && dateIsOutRangeMax(props)
|
|
570
|
-
? minDate
|
|
571
|
-
: maxDate && dateIsOutRangeMax(props)
|
|
572
|
-
? maxDate
|
|
573
|
-
: date;
|
|
574
|
-
}
|
|
575
|
-
|
|
576
|
-
const DAYS_WEEK = 7;
|
|
577
|
-
const COUNT_YEAR_RANGE = 4;
|
|
578
|
-
|
|
579
|
-
function createDayState(props, today, value) {
|
|
580
|
-
const { date, day, month, year } = props;
|
|
581
|
-
const dateValue = value && new Date(year, month, value);
|
|
582
|
-
return {
|
|
583
|
-
disabled: dayIsOutside(props, value || 0),
|
|
584
|
-
focused: !!value && day === value,
|
|
585
|
-
forbidden: !value,
|
|
586
|
-
selected: !!dateValue && helpersDate.dateIsEqualsWeight(date, dateValue),
|
|
587
|
-
today: !!dateValue && helpersDate.dateIsEqualsWeight(today, dateValue),
|
|
588
|
-
value
|
|
589
|
-
};
|
|
590
|
-
}
|
|
591
|
-
function createFirstWeek$1(props, date, today) {
|
|
592
|
-
const days = [];
|
|
593
|
-
let day = 1;
|
|
594
|
-
for (let start = 0; start < date.getDay(); start++) {
|
|
595
|
-
days.push(createDayState(props, today));
|
|
596
|
-
}
|
|
597
|
-
for (let end = date.getDay(); end < 7; end++) {
|
|
598
|
-
days.push(createDayState(props, today, day));
|
|
599
|
-
day++;
|
|
600
|
-
}
|
|
601
|
-
return { days };
|
|
602
|
-
}
|
|
603
|
-
function createDaysPending$1(props, today, days) {
|
|
604
|
-
const daysPending = [];
|
|
605
|
-
const length = 7 - days;
|
|
606
|
-
for (let index = 0; index < length; index++) {
|
|
607
|
-
daysPending.push(createDayState(props, today));
|
|
608
|
-
}
|
|
609
|
-
return daysPending;
|
|
610
|
-
}
|
|
611
|
-
function createNextWeeks$1(props, date, today) {
|
|
612
|
-
const daysMonth = helpersDate.getDaysOfMonth(date.getFullYear(), date.getMonth());
|
|
613
|
-
const weeks = [];
|
|
614
|
-
let days = [];
|
|
615
|
-
let countDays = 1;
|
|
616
|
-
let day = DAYS_WEEK - date.getDay() + 1;
|
|
617
|
-
do {
|
|
618
|
-
days.push(createDayState(props, today, day));
|
|
619
|
-
day++;
|
|
620
|
-
countDays++;
|
|
621
|
-
if (countDays > DAYS_WEEK) {
|
|
622
|
-
weeks.push({ days });
|
|
623
|
-
days = [];
|
|
624
|
-
countDays = 1;
|
|
625
|
-
}
|
|
626
|
-
} while (day <= daysMonth);
|
|
627
|
-
if (days.length && days.length < DAYS_WEEK) {
|
|
628
|
-
weeks.push({
|
|
629
|
-
days: [...days, ...createDaysPending$1(props, today, days.length)]
|
|
630
|
-
});
|
|
631
|
-
}
|
|
632
|
-
return weeks;
|
|
633
|
-
}
|
|
634
|
-
function dayIsOutsideMin(props, day) {
|
|
635
|
-
const { month, year, minDate } = props;
|
|
636
|
-
return minDate
|
|
637
|
-
? helpersDate.getDateWeight(new Date(year, month, day)) < helpersDate.getDateWeight(minDate)
|
|
638
|
-
: false;
|
|
639
|
-
}
|
|
640
|
-
function dayIsOutsideMax(props, day) {
|
|
641
|
-
const { month, year, maxDate } = props;
|
|
642
|
-
return maxDate
|
|
643
|
-
? helpersDate.getDateWeight(new Date(year, month, day)) > helpersDate.getDateWeight(maxDate)
|
|
644
|
-
: false;
|
|
645
|
-
}
|
|
646
|
-
function dayIsOutside(props, day) {
|
|
647
|
-
return dayIsOutsideMin(props, day) || dayIsOutsideMax(props, day);
|
|
648
|
-
}
|
|
649
|
-
function checkDayPicker(props) {
|
|
650
|
-
const { day, maxDate, minDate } = props;
|
|
651
|
-
return minDate && dayIsOutsideMin(props, day)
|
|
652
|
-
? minDate.getDate()
|
|
653
|
-
: maxDate && dayIsOutsideMax(props, day)
|
|
654
|
-
? maxDate.getDate()
|
|
655
|
-
: undefined;
|
|
656
|
-
}
|
|
657
|
-
function createDayPicker(props) {
|
|
658
|
-
const date = new Date(props.year, props.month, 1);
|
|
659
|
-
const today = new Date();
|
|
660
|
-
const firstWeek = createFirstWeek$1(props, date, today);
|
|
661
|
-
const nextWeeks = createNextWeeks$1(props, date, today);
|
|
662
|
-
return [firstWeek, ...nextWeeks];
|
|
663
|
-
}
|
|
664
|
-
|
|
665
|
-
function dateIsSelected(base, date, day) {
|
|
666
|
-
return (date.getFullYear() === base.getFullYear() &&
|
|
667
|
-
date.getMonth() === base.getMonth() &&
|
|
668
|
-
day === date.getDate());
|
|
669
|
-
}
|
|
670
|
-
function sourceIsSelected({ sourceDate }, base, day) {
|
|
671
|
-
return dateIsSelected(base, sourceDate, day);
|
|
672
|
-
}
|
|
673
|
-
function rangeIsSelected({ range }, base, day) {
|
|
674
|
-
return (dateIsSelected(base, range.minDate, day) ||
|
|
675
|
-
dateIsSelected(base, range.maxDate, day));
|
|
676
|
-
}
|
|
677
|
-
function dayIsRange({ range }, base, day) {
|
|
678
|
-
return helpersDate.dateIsBetween(range.minDate, range.maxDate, helpersDate.assignDayInDate(base, day));
|
|
679
|
-
}
|
|
680
|
-
function createDayRangeState(props, base, day) {
|
|
681
|
-
return {
|
|
682
|
-
disabled: dayRangeIsOutside(props, day || 0),
|
|
683
|
-
end: day ? rangeIsSelected(props, base, day) : false,
|
|
684
|
-
forbidden: !day,
|
|
685
|
-
ranged: day ? dayIsRange(props, base, day) : false,
|
|
686
|
-
source: day ? sourceIsSelected(props, base, day) : false,
|
|
687
|
-
value: day
|
|
688
|
-
};
|
|
689
|
-
}
|
|
690
|
-
function createFirstWeek(props, base) {
|
|
691
|
-
const days = [];
|
|
692
|
-
let day = 1;
|
|
693
|
-
for (let start = 0; start < base.getDay(); start++) {
|
|
694
|
-
days.push(createDayRangeState(props, base));
|
|
695
|
-
}
|
|
696
|
-
for (let end = base.getDay(); end < 7; end++) {
|
|
697
|
-
days.push(createDayRangeState(props, base, day));
|
|
698
|
-
day++;
|
|
699
|
-
}
|
|
700
|
-
return { days };
|
|
701
|
-
}
|
|
702
|
-
function createDaysPending(props, base, days) {
|
|
703
|
-
const daysPending = [];
|
|
704
|
-
const length = 7 - days;
|
|
705
|
-
for (let index = 0; index < length; index++) {
|
|
706
|
-
daysPending.push(createDayRangeState(props, base));
|
|
707
|
-
}
|
|
708
|
-
return daysPending;
|
|
709
|
-
}
|
|
710
|
-
function createNextWeeks(props, base) {
|
|
711
|
-
const weeks = [];
|
|
712
|
-
const { date } = props;
|
|
713
|
-
const dayCount = helpersDate.getDaysOfMonth(date.getFullYear(), date.getMonth());
|
|
714
|
-
let days = [];
|
|
715
|
-
let countDays = 1;
|
|
716
|
-
let day = DAYS_WEEK - base.getDay() + 1;
|
|
717
|
-
do {
|
|
718
|
-
days.push(createDayRangeState(props, date, day));
|
|
719
|
-
day++;
|
|
720
|
-
countDays++;
|
|
721
|
-
if (countDays > 7) {
|
|
722
|
-
weeks.push({ days });
|
|
723
|
-
days = [];
|
|
724
|
-
countDays = 1;
|
|
725
|
-
}
|
|
726
|
-
} while (day <= dayCount);
|
|
727
|
-
if (days.length && days.length < DAYS_WEEK) {
|
|
728
|
-
weeks.push({
|
|
729
|
-
days: [...days, ...createDaysPending(props, base, days.length)]
|
|
730
|
-
});
|
|
731
|
-
}
|
|
732
|
-
return weeks;
|
|
733
|
-
}
|
|
734
|
-
function dayRangeIsOutsideMin(props, day) {
|
|
735
|
-
const { date, minDate } = props;
|
|
736
|
-
return minDate
|
|
737
|
-
? helpersDate.getDateWeight(helpersDate.assignDayInDate(date, day)) < helpersDate.getDateWeight(minDate)
|
|
738
|
-
: false;
|
|
739
|
-
}
|
|
740
|
-
function dayRangeIsOutsideMax(props, day) {
|
|
741
|
-
const { date, maxDate } = props;
|
|
742
|
-
return maxDate
|
|
743
|
-
? helpersDate.getDateWeight(helpersDate.assignDayInDate(date, day)) > helpersDate.getDateWeight(maxDate)
|
|
744
|
-
: false;
|
|
745
|
-
}
|
|
746
|
-
function dayRangeIsOutside(props, day) {
|
|
747
|
-
return dayRangeIsOutsideMin(props, day) || dayRangeIsOutsideMax(props, day);
|
|
748
|
-
}
|
|
749
|
-
function createDayRangePicker(props) {
|
|
750
|
-
const date = new Date(props.date.getFullYear(), props.date.getMonth(), 1);
|
|
751
|
-
const firstWeek = createFirstWeek(props, date);
|
|
752
|
-
const nextWeeks = createNextWeeks(props, date);
|
|
753
|
-
return [firstWeek, ...nextWeeks];
|
|
754
|
-
}
|
|
755
|
-
|
|
756
|
-
function createMonthState(props, value) {
|
|
757
|
-
const { date, month, year } = props;
|
|
758
|
-
return {
|
|
759
|
-
disabled: monthIsOutside(props, value),
|
|
760
|
-
focused: value === month,
|
|
761
|
-
label: helpersDate.MONTH_NAMES()[value],
|
|
762
|
-
selected: date.getFullYear() === year && value === date.getMonth(),
|
|
763
|
-
value
|
|
764
|
-
};
|
|
765
|
-
}
|
|
766
|
-
function monthIsOutsideMin(props, month) {
|
|
767
|
-
const { year, minDate } = props;
|
|
768
|
-
return minDate
|
|
769
|
-
? minDate.getFullYear() === year && month < minDate.getMonth()
|
|
770
|
-
: false;
|
|
771
|
-
}
|
|
772
|
-
function monthIsOutsideMax(props, month) {
|
|
773
|
-
const { year, maxDate } = props;
|
|
774
|
-
return maxDate
|
|
775
|
-
? maxDate.getFullYear() === year && month > maxDate.getMonth()
|
|
776
|
-
: false;
|
|
777
|
-
}
|
|
778
|
-
function monthIsOutside(props, month) {
|
|
779
|
-
return monthIsOutsideMin(props, month) || monthIsOutsideMax(props, month);
|
|
780
|
-
}
|
|
781
|
-
function checkMonthPicker(props) {
|
|
782
|
-
const { maxDate, minDate, month } = props;
|
|
783
|
-
return minDate && monthIsOutsideMin(props, month)
|
|
784
|
-
? minDate.getMonth()
|
|
785
|
-
: maxDate && monthIsOutsideMax(props, month)
|
|
786
|
-
? maxDate.getMonth()
|
|
787
|
-
: undefined;
|
|
788
|
-
}
|
|
789
|
-
function createMonthPicker(props) {
|
|
790
|
-
return [
|
|
791
|
-
createMonthState(props, helpersDate.Month.January),
|
|
792
|
-
createMonthState(props, helpersDate.Month.February),
|
|
793
|
-
createMonthState(props, helpersDate.Month.March),
|
|
794
|
-
createMonthState(props, helpersDate.Month.April),
|
|
795
|
-
createMonthState(props, helpersDate.Month.May),
|
|
796
|
-
createMonthState(props, helpersDate.Month.June),
|
|
797
|
-
createMonthState(props, helpersDate.Month.July),
|
|
798
|
-
createMonthState(props, helpersDate.Month.August),
|
|
799
|
-
createMonthState(props, helpersDate.Month.September),
|
|
800
|
-
createMonthState(props, helpersDate.Month.October),
|
|
801
|
-
createMonthState(props, helpersDate.Month.November),
|
|
802
|
-
createMonthState(props, helpersDate.Month.December)
|
|
803
|
-
];
|
|
804
|
-
}
|
|
805
|
-
function monthIsLimitMin(props) {
|
|
806
|
-
const { month, date, minDate } = props;
|
|
807
|
-
if (helpersAdvanced.itIsDefined(month) && date) {
|
|
808
|
-
const minYear = minDate ? minDate.getFullYear() : 0;
|
|
809
|
-
const minMonth = minDate ? minDate.getMonth() : 0;
|
|
810
|
-
return date.getFullYear() === minYear && month <= minMonth;
|
|
811
|
-
}
|
|
812
|
-
return false;
|
|
813
|
-
}
|
|
814
|
-
function monthIsLimitMax(props) {
|
|
815
|
-
const { month, date, maxDate } = props;
|
|
816
|
-
if (helpersAdvanced.itIsDefined(month) && date) {
|
|
817
|
-
const maxYear = maxDate ? maxDate.getFullYear() : 10000;
|
|
818
|
-
const maxMonth = maxDate ? maxDate.getMonth() : 11;
|
|
819
|
-
return date.getFullYear() === maxYear && month >= maxMonth;
|
|
820
|
-
}
|
|
821
|
-
return false;
|
|
822
|
-
}
|
|
823
|
-
function monthLimitTemplate(props) {
|
|
824
|
-
return {
|
|
825
|
-
limitNext: monthIsLimitMax(props),
|
|
826
|
-
limitPrevious: monthIsLimitMin(props)
|
|
827
|
-
};
|
|
828
|
-
}
|
|
829
|
-
|
|
830
|
-
var PickerListenerType;
|
|
831
|
-
(function (PickerListenerType) {
|
|
832
|
-
PickerListenerType["Select"] = "PickerSelect";
|
|
833
|
-
PickerListenerType["Now"] = "PickerNow";
|
|
834
|
-
PickerListenerType["Cancel"] = "PickerCancel";
|
|
835
|
-
})(PickerListenerType || (PickerListenerType = {}));
|
|
836
|
-
|
|
837
|
-
function createYear(props, value) {
|
|
838
|
-
const { date, year } = props;
|
|
839
|
-
return {
|
|
840
|
-
disabled: !value,
|
|
841
|
-
focused: value === year,
|
|
842
|
-
selected: value === date.getFullYear(),
|
|
843
|
-
value
|
|
844
|
-
};
|
|
845
|
-
}
|
|
846
|
-
function yearIsOutlineMin(props) {
|
|
847
|
-
const { year, minDate } = props;
|
|
848
|
-
return minDate ? year < minDate.getFullYear() : false;
|
|
849
|
-
}
|
|
850
|
-
function yearIsOutlineMax(props) {
|
|
851
|
-
const { year, maxDate } = props;
|
|
852
|
-
return maxDate ? year > maxDate.getFullYear() : false;
|
|
853
|
-
}
|
|
854
|
-
function checkYearPicker(props) {
|
|
855
|
-
const { maxDate, minDate } = props;
|
|
856
|
-
return minDate && yearIsOutlineMin(props)
|
|
857
|
-
? minDate.getFullYear()
|
|
858
|
-
: maxDate && yearIsOutlineMax(props)
|
|
859
|
-
? maxDate.getFullYear()
|
|
860
|
-
: undefined;
|
|
861
|
-
}
|
|
862
|
-
function createYearPicker(props) {
|
|
863
|
-
const { year, maxDate, minDate } = props;
|
|
864
|
-
const prevYears = [];
|
|
865
|
-
const nextYears = [];
|
|
866
|
-
let minRange = year;
|
|
867
|
-
let maxRange = year;
|
|
868
|
-
const minYear = minDate?.getFullYear() || 0;
|
|
869
|
-
const maxYear = maxDate?.getFullYear() || 10000;
|
|
870
|
-
for (let index = 0; index < COUNT_YEAR_RANGE; index++) {
|
|
871
|
-
const prevValue = year - COUNT_YEAR_RANGE + index;
|
|
872
|
-
const nextValue = year + index + 1;
|
|
873
|
-
const prevYear = prevValue >= minYear ? prevValue : undefined;
|
|
874
|
-
const nextYear = nextValue <= maxYear ? nextValue : undefined;
|
|
875
|
-
const prevState = createYear(props, prevYear);
|
|
876
|
-
const nextState = createYear(props, nextYear);
|
|
877
|
-
prevYears.push(prevState);
|
|
878
|
-
nextYears.push(nextState);
|
|
879
|
-
if (!!prevState.value && minRange > prevState.value) {
|
|
880
|
-
minRange = prevState.value;
|
|
881
|
-
}
|
|
882
|
-
if (!!nextState.value && maxRange < nextState.value) {
|
|
883
|
-
maxRange = nextState.value;
|
|
884
|
-
}
|
|
885
|
-
}
|
|
886
|
-
const yearCenter = createYear(props, year);
|
|
887
|
-
return {
|
|
888
|
-
canPrevious: minYear < minRange,
|
|
889
|
-
canNext: maxYear > maxRange,
|
|
890
|
-
maxRange,
|
|
891
|
-
minRange,
|
|
892
|
-
years: [...prevYears, yearCenter, ...nextYears]
|
|
893
|
-
};
|
|
894
|
-
}
|
|
895
|
-
|
|
896
|
-
function createEmptyStore() {
|
|
897
|
-
return {
|
|
898
|
-
coincidences: undefined,
|
|
899
|
-
pattern: '',
|
|
900
|
-
previous: null
|
|
901
|
-
};
|
|
902
|
-
}
|
|
903
|
-
function searchForPattern(props) {
|
|
904
|
-
const { pattern, store } = props;
|
|
905
|
-
if (!store?.pattern) {
|
|
906
|
-
return null;
|
|
907
|
-
}
|
|
908
|
-
let newStore = store;
|
|
909
|
-
let search = false;
|
|
910
|
-
while (!search && newStore) {
|
|
911
|
-
search = helpersString.hasPattern(pattern || '', newStore.pattern, true);
|
|
912
|
-
if (!search) {
|
|
913
|
-
newStore = newStore.previous;
|
|
914
|
-
}
|
|
915
|
-
}
|
|
916
|
-
return newStore || createEmptyStore();
|
|
917
|
-
}
|
|
918
|
-
function createStoreAutocomplete(props) {
|
|
919
|
-
const { pattern, suggestions, reboot } = props;
|
|
920
|
-
if (!pattern) {
|
|
921
|
-
return { collection: suggestions, store: createEmptyStore() };
|
|
922
|
-
}
|
|
923
|
-
const store = reboot ? createEmptyStore() : searchForPattern(props);
|
|
924
|
-
const elements = store?.coincidences || suggestions;
|
|
925
|
-
const coincidences = elements.filter((element) => element.hasCoincidence(pattern));
|
|
926
|
-
return {
|
|
927
|
-
collection: coincidences,
|
|
928
|
-
store: {
|
|
929
|
-
coincidences,
|
|
930
|
-
pattern,
|
|
931
|
-
previous: store
|
|
932
|
-
}
|
|
933
|
-
};
|
|
934
|
-
}
|
|
935
|
-
|
|
936
|
-
const classElement = '.rls-list-field__element';
|
|
937
|
-
const POSITION_INITIAL = 0;
|
|
938
|
-
function locationListIsBottom(contentElement, listElement) {
|
|
939
|
-
if (contentElement && listElement) {
|
|
940
|
-
const { top, height } = contentElement.getBoundingClientRect();
|
|
941
|
-
const { clientHeight } = listElement;
|
|
942
|
-
return top + height + clientHeight < window.innerHeight;
|
|
943
|
-
}
|
|
944
|
-
return true;
|
|
945
|
-
}
|
|
946
|
-
function navigationInputDown(props) {
|
|
947
|
-
const { contentElement, listElement } = props;
|
|
948
|
-
if (!locationListIsBottom(contentElement, listElement)) {
|
|
949
|
-
return undefined;
|
|
950
|
-
}
|
|
951
|
-
const elements = listElement?.querySelectorAll(classElement);
|
|
952
|
-
if (elements?.length) {
|
|
953
|
-
elements.item(0).focus();
|
|
954
|
-
setTimeout(() => {
|
|
955
|
-
listElement?.scroll({ top: 0, behavior: 'smooth' });
|
|
956
|
-
}, 100);
|
|
957
|
-
}
|
|
958
|
-
return POSITION_INITIAL;
|
|
959
|
-
}
|
|
960
|
-
function navigationInputUp(props) {
|
|
961
|
-
const { contentElement, listElement } = props;
|
|
962
|
-
if (locationListIsBottom(contentElement, listElement)) {
|
|
963
|
-
return undefined;
|
|
964
|
-
}
|
|
965
|
-
const elements = listElement?.querySelectorAll(classElement);
|
|
966
|
-
if (!elements?.length) {
|
|
967
|
-
return POSITION_INITIAL;
|
|
968
|
-
}
|
|
969
|
-
const position = elements.length - 1;
|
|
970
|
-
const element = elements.item(position);
|
|
971
|
-
element?.focus();
|
|
972
|
-
setTimeout(() => {
|
|
973
|
-
listElement?.scroll({
|
|
974
|
-
top: element?.offsetTop + element?.offsetLeft,
|
|
975
|
-
behavior: 'smooth'
|
|
976
|
-
});
|
|
977
|
-
}, 100);
|
|
978
|
-
return position;
|
|
979
|
-
}
|
|
980
|
-
function navigationElementDown(props) {
|
|
981
|
-
const { contentElement, inputElement, listElement, position } = props;
|
|
982
|
-
const elements = listElement?.querySelectorAll(classElement);
|
|
983
|
-
const newPosition = position + 1;
|
|
984
|
-
if (newPosition < (elements?.length || 0)) {
|
|
985
|
-
elements?.item(newPosition)?.focus();
|
|
986
|
-
return newPosition;
|
|
987
|
-
}
|
|
988
|
-
if (!locationListIsBottom(contentElement, listElement)) {
|
|
989
|
-
inputElement?.focus();
|
|
990
|
-
}
|
|
991
|
-
return position;
|
|
992
|
-
}
|
|
993
|
-
function navigationElementUp(props) {
|
|
994
|
-
const { contentElement, inputElement, listElement, position } = props;
|
|
995
|
-
if (position > 0) {
|
|
996
|
-
const elements = listElement?.querySelectorAll(classElement);
|
|
997
|
-
const newPosition = position - 1;
|
|
998
|
-
elements?.item(newPosition)?.focus();
|
|
999
|
-
return newPosition;
|
|
1000
|
-
}
|
|
1001
|
-
if (locationListIsBottom(contentElement, listElement)) {
|
|
1002
|
-
inputElement?.focus();
|
|
1003
|
-
}
|
|
1004
|
-
return POSITION_INITIAL;
|
|
1005
|
-
}
|
|
1006
|
-
function listNavigationInput(props) {
|
|
1007
|
-
switch (props.event.code) {
|
|
1008
|
-
case 'ArrowDown':
|
|
1009
|
-
return navigationInputDown(props);
|
|
1010
|
-
case 'ArrowUp':
|
|
1011
|
-
return navigationInputUp(props);
|
|
1012
|
-
default:
|
|
1013
|
-
return undefined;
|
|
1014
|
-
}
|
|
1015
|
-
}
|
|
1016
|
-
function listNavigationElement(props) {
|
|
1017
|
-
const { event } = props;
|
|
1018
|
-
switch (event.code) {
|
|
1019
|
-
case 'ArrowDown':
|
|
1020
|
-
return navigationElementDown(props);
|
|
1021
|
-
case 'ArrowUp':
|
|
1022
|
-
return navigationElementUp(props);
|
|
1023
|
-
default:
|
|
1024
|
-
return POSITION_INITIAL;
|
|
1025
|
-
}
|
|
1026
|
-
}
|
|
1027
|
-
|
|
1028
|
-
class ListCollection {
|
|
1029
|
-
constructor(value) {
|
|
1030
|
-
this.value = value;
|
|
1031
|
-
}
|
|
1032
|
-
find(element) {
|
|
1033
|
-
return this.value.find((current) => current.compareTo(element));
|
|
1034
|
-
}
|
|
1737
|
+
}) }), jsxRuntimeExports.jsx("div", { className: "rls-pagination__description", children: template.description }), jsxRuntimeExports.jsxs("div", { className: "rls-pagination__actions", children: [jsxRuntimeExports.jsx("button", { className: "rls-pagination__action", onClick: goNextPagination, disabled: template.lastPage, children: jsxRuntimeExports.jsx(RlsIcon, { value: "arrow-ios-right" }) }), jsxRuntimeExports.jsx("button", { className: "rls-pagination__action", onClick: goLastPagination, disabled: template.lastPage, children: jsxRuntimeExports.jsx(RlsIcon, { value: "arrowhead-right" }) })] })] }));
|
|
1035
1738
|
}
|
|
1036
1739
|
|
|
1037
1740
|
function RlsPickerDay({ date, disabled: disabledPicker, formControl, maxDate, month, minDate, onValue, rlsTheme, year }) {
|
|
1038
1741
|
const currentDate = date || new Date(); // Initial date
|
|
1039
|
-
const [weeks, setWeeks] =
|
|
1040
|
-
const [value, setValue] =
|
|
1041
|
-
|
|
1742
|
+
const [weeks, setWeeks] = require$$0.useState([]);
|
|
1743
|
+
const [value, setValue] = require$$0.useState(formControl?.value || currentDate.getDate());
|
|
1744
|
+
require$$0.useEffect(() => {
|
|
1042
1745
|
const props = createPickerProps();
|
|
1043
|
-
const day = checkDayPicker(props);
|
|
1044
|
-
day ? setDayValue(day) : setWeeks(createDayPicker(props));
|
|
1746
|
+
const day = components.checkDayPicker(props);
|
|
1747
|
+
day ? setDayValue(day) : setWeeks(components.createDayPicker(props));
|
|
1045
1748
|
}, [date, month, year, value, minDate, maxDate]);
|
|
1046
|
-
|
|
1047
|
-
const day = checkDayPicker(createPickerProps());
|
|
1749
|
+
require$$0.useEffect(() => {
|
|
1750
|
+
const day = components.checkDayPicker(createPickerProps());
|
|
1048
1751
|
day
|
|
1049
|
-
? formControl?.
|
|
1050
|
-
: setValue(formControl?.
|
|
1051
|
-
}, [formControl?.
|
|
1752
|
+
? formControl?.setValue(day)
|
|
1753
|
+
: setValue(formControl?.value || currentDate.getDate());
|
|
1754
|
+
}, [formControl?.value]);
|
|
1052
1755
|
function createPickerProps() {
|
|
1053
1756
|
return {
|
|
1054
1757
|
date: currentDate,
|
|
1055
|
-
day: formControl?.
|
|
1056
|
-
month:
|
|
1758
|
+
day: formControl?.value || value,
|
|
1759
|
+
month: commons.itIsDefined(month) ? month : currentDate.getMonth(),
|
|
1057
1760
|
year: year || currentDate.getFullYear(),
|
|
1058
1761
|
minDate,
|
|
1059
1762
|
maxDate
|
|
1060
1763
|
};
|
|
1061
1764
|
}
|
|
1062
1765
|
function setDayValue(value) {
|
|
1063
|
-
formControl ? formControl.
|
|
1766
|
+
formControl ? formControl.setValue(value) : setValue(value);
|
|
1064
1767
|
}
|
|
1065
1768
|
function onChange(value) {
|
|
1066
1769
|
setDayValue(value);
|
|
@@ -1068,25 +1771,24 @@ function RlsPickerDay({ date, disabled: disabledPicker, formControl, maxDate, mo
|
|
|
1068
1771
|
onValue(value);
|
|
1069
1772
|
}
|
|
1070
1773
|
}
|
|
1071
|
-
return (
|
|
1774
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-day", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsx("div", { className: "rls-picker-day__header", children: dates.DAY_LABELS().map((title, index) => (jsxRuntimeExports.jsx("label", { className: "rls-picker-day__label", children: title }, index))) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-day__component", children: weeks.map(({ days }, index) => (jsxRuntimeExports.jsx("div", { className: "rls-picker-day__week", children: days.map(({ value, disabled, focused, forbidden, selected, today }, index) => (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-picker-day__element', {
|
|
1072
1775
|
disabled: disabled || disabledPicker,
|
|
1073
1776
|
focused,
|
|
1074
1777
|
forbidden,
|
|
1075
1778
|
selected,
|
|
1076
1779
|
today
|
|
1077
|
-
}), onClick: value && !disabledPicker ? () => onChange(value) : undefined, children:
|
|
1780
|
+
}), onClick: value && !disabledPicker ? () => onChange(value) : undefined, children: jsxRuntimeExports.jsx("span", { className: "rls-picker-day__element__span", children: value || '??' }) }, index))) }, index))) })] }));
|
|
1078
1781
|
}
|
|
1079
1782
|
|
|
1080
|
-
const
|
|
1081
|
-
|
|
1783
|
+
const FORMAT_RANGE = '{dd}/{mx}/{aa}';
|
|
1082
1784
|
function RlsPickerDayRange({ date, disabled: disabledPicker, formControl, maxDate, minDate, rlsTheme }) {
|
|
1083
|
-
const currentRange = formControl?.
|
|
1084
|
-
const currentDate =
|
|
1085
|
-
const sourceDate =
|
|
1086
|
-
const [weeks, setWeeks] =
|
|
1087
|
-
const [range, setRange] =
|
|
1088
|
-
|
|
1089
|
-
setWeeks(createDayRangePicker({
|
|
1785
|
+
const currentRange = formControl?.value || dates.DateRange.now();
|
|
1786
|
+
const currentDate = dates.normalizeMinTime(date || currentRange.minDate);
|
|
1787
|
+
const sourceDate = require$$0.useRef(currentRange.minDate);
|
|
1788
|
+
const [weeks, setWeeks] = require$$0.useState([]);
|
|
1789
|
+
const [range, setRange] = require$$0.useState(currentRange);
|
|
1790
|
+
require$$0.useEffect(() => {
|
|
1791
|
+
setWeeks(components.createDayRangePicker({
|
|
1090
1792
|
date: currentDate,
|
|
1091
1793
|
range,
|
|
1092
1794
|
sourceDate: sourceDate.current,
|
|
@@ -1095,49 +1797,49 @@ function RlsPickerDayRange({ date, disabled: disabledPicker, formControl, maxDat
|
|
|
1095
1797
|
}));
|
|
1096
1798
|
}, [range, date, minDate, maxDate]);
|
|
1097
1799
|
function onChange(value) {
|
|
1098
|
-
const date =
|
|
1099
|
-
const range =
|
|
1100
|
-
? new
|
|
1101
|
-
: new
|
|
1800
|
+
const date = dates.assignDayInDate(currentDate, value);
|
|
1801
|
+
const range = dates.dateIsBefore(date, sourceDate.current)
|
|
1802
|
+
? new dates.DateRange(sourceDate.current, date)
|
|
1803
|
+
: new dates.DateRange(date, sourceDate.current);
|
|
1102
1804
|
sourceDate.current = date;
|
|
1103
1805
|
setRange(range);
|
|
1104
|
-
formControl?.
|
|
1806
|
+
formControl?.setValue(range);
|
|
1105
1807
|
}
|
|
1106
|
-
return (
|
|
1808
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-day-range", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsx("div", { className: "rls-picker-day-range__title", children: dates.dateFormatTemplate(sourceDate.current, FORMAT_RANGE) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-day-range__header", children: dates.DAY_LABELS().map((title, index) => (jsxRuntimeExports.jsx("label", { className: "rls-picker-day-range__label", children: title }, index))) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-day-range__component", children: weeks.map(({ days }, index) => (jsxRuntimeExports.jsx("div", { className: "rls-picker-day-range__week", children: days.map(({ disabled, end, forbidden, source, ranged, value }, index) => (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-picker-day-range__element', {
|
|
1107
1809
|
disabled: disabled || disabledPicker,
|
|
1108
1810
|
end,
|
|
1109
1811
|
forbidden,
|
|
1110
1812
|
ranged,
|
|
1111
1813
|
source
|
|
1112
|
-
}), onClick: value && !disabledPicker ? () => onChange(value) : undefined, children:
|
|
1814
|
+
}), onClick: value && !disabledPicker ? () => onChange(value) : undefined, children: jsxRuntimeExports.jsx("span", { className: "rls-picker-day-range__element__span", children: value || '??' }) }, index))) }, index))) })] }));
|
|
1113
1815
|
}
|
|
1114
1816
|
|
|
1115
1817
|
function RlsPickerMonth({ date, disabled: disabledPicker, formControl, maxDate, minDate, onValue, rlsTheme, year }) {
|
|
1116
1818
|
const currentDate = date || new Date();
|
|
1117
|
-
const [months, setMonths] =
|
|
1118
|
-
const [value, setValue] =
|
|
1119
|
-
|
|
1819
|
+
const [months, setMonths] = require$$0.useState([]);
|
|
1820
|
+
const [value, setValue] = require$$0.useState(formControl?.value || currentDate.getMonth());
|
|
1821
|
+
require$$0.useEffect(() => {
|
|
1120
1822
|
const props = createPickerProps(); // MonthPickerProps
|
|
1121
|
-
const month = checkMonthPicker(props);
|
|
1122
|
-
month ? setMonthValue(month) : setMonths(createMonthPicker(props));
|
|
1823
|
+
const month = components.checkMonthPicker(props);
|
|
1824
|
+
month ? setMonthValue(month) : setMonths(components.createMonthPicker(props));
|
|
1123
1825
|
}, [date, year, value, minDate, maxDate]);
|
|
1124
|
-
|
|
1125
|
-
const month = checkMonthPicker(createPickerProps());
|
|
1126
|
-
|
|
1127
|
-
? formControl?.
|
|
1128
|
-
: setValue(formControl?.
|
|
1129
|
-
}, [formControl?.
|
|
1826
|
+
require$$0.useEffect(() => {
|
|
1827
|
+
const month = components.checkMonthPicker(createPickerProps());
|
|
1828
|
+
commons.itIsDefined(month)
|
|
1829
|
+
? formControl?.setValue(month)
|
|
1830
|
+
: setValue(formControl?.value || currentDate.getMonth());
|
|
1831
|
+
}, [formControl?.value]);
|
|
1130
1832
|
function createPickerProps() {
|
|
1131
1833
|
return {
|
|
1132
1834
|
date: currentDate,
|
|
1133
|
-
month:
|
|
1835
|
+
month: commons.itIsDefined(formControl?.value) ? formControl?.value : value,
|
|
1134
1836
|
year: year || currentDate.getFullYear(),
|
|
1135
1837
|
minDate,
|
|
1136
1838
|
maxDate
|
|
1137
1839
|
};
|
|
1138
1840
|
}
|
|
1139
1841
|
function setMonthValue(value) {
|
|
1140
|
-
formControl ? formControl.
|
|
1842
|
+
formControl ? formControl.setValue(value) : setValue(value);
|
|
1141
1843
|
}
|
|
1142
1844
|
function onChange(value) {
|
|
1143
1845
|
setMonthValue(value);
|
|
@@ -1145,80 +1847,80 @@ function RlsPickerMonth({ date, disabled: disabledPicker, formControl, maxDate,
|
|
|
1145
1847
|
onValue(value);
|
|
1146
1848
|
}
|
|
1147
1849
|
}
|
|
1148
|
-
return (
|
|
1850
|
+
return (jsxRuntimeExports.jsx("div", { className: "rls-picker-month", "rls-theme": rlsTheme, children: months.map(({ label, value, disabled, focused, selected }, index) => (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-picker-month__component', {
|
|
1149
1851
|
disabled: disabled || disabledPicker,
|
|
1150
1852
|
focused,
|
|
1151
1853
|
selected
|
|
1152
|
-
}), onClick: !(disabled || disabledPicker) ? () => onChange(value) : undefined, children:
|
|
1854
|
+
}), onClick: !(disabled || disabledPicker) ? () => onChange(value) : undefined, children: jsxRuntimeExports.jsx("span", { className: "rls-picker-month__span", children: label }) }, index))) }));
|
|
1153
1855
|
}
|
|
1154
1856
|
|
|
1155
1857
|
function RlsPickerMonthTitle({ monthControl, type, yearControl, date, disabled, maxDate, minDate, onClick }) {
|
|
1156
|
-
const { limitNext, limitPrevious } = monthLimitTemplate({
|
|
1858
|
+
const { limitNext, limitPrevious } = components.monthLimitTemplate({
|
|
1157
1859
|
date,
|
|
1158
1860
|
maxDate,
|
|
1159
1861
|
minDate,
|
|
1160
|
-
month: monthControl.
|
|
1862
|
+
month: monthControl.value
|
|
1161
1863
|
});
|
|
1162
|
-
const monthName =
|
|
1864
|
+
const monthName = dates.MONTH_NAMES()[monthControl.value || 0];
|
|
1163
1865
|
function onPreviousMonth() {
|
|
1164
|
-
if (
|
|
1165
|
-
if (monthControl.
|
|
1166
|
-
monthControl.
|
|
1866
|
+
if (commons.itIsDefined(monthControl.value) && commons.itIsDefined(yearControl.value)) {
|
|
1867
|
+
if (monthControl.value > dates.Month.January) {
|
|
1868
|
+
monthControl.setValue(monthControl.value - 1);
|
|
1167
1869
|
}
|
|
1168
1870
|
else {
|
|
1169
|
-
monthControl.
|
|
1170
|
-
yearControl.
|
|
1871
|
+
monthControl.setValue(dates.Month.December);
|
|
1872
|
+
yearControl.setValue(yearControl.value - 1);
|
|
1171
1873
|
}
|
|
1172
1874
|
}
|
|
1173
1875
|
}
|
|
1174
1876
|
function onPreviousYear() {
|
|
1175
|
-
if (
|
|
1176
|
-
yearControl.
|
|
1877
|
+
if (commons.itIsDefined(yearControl.value)) {
|
|
1878
|
+
yearControl.setValue(yearControl.value - 1);
|
|
1177
1879
|
}
|
|
1178
1880
|
}
|
|
1179
1881
|
function onPrevious() {
|
|
1180
1882
|
type === 'month' ? onPreviousMonth() : onPreviousYear();
|
|
1181
1883
|
}
|
|
1182
1884
|
function onNextMonth() {
|
|
1183
|
-
if (
|
|
1184
|
-
if (monthControl.
|
|
1185
|
-
monthControl.
|
|
1885
|
+
if (commons.itIsDefined(monthControl.value) && commons.itIsDefined(yearControl.value)) {
|
|
1886
|
+
if (monthControl.value < dates.Month.December) {
|
|
1887
|
+
monthControl.setValue(monthControl.value + 1);
|
|
1186
1888
|
}
|
|
1187
1889
|
else {
|
|
1188
|
-
monthControl.
|
|
1189
|
-
yearControl.
|
|
1890
|
+
monthControl.setValue(dates.Month.January);
|
|
1891
|
+
yearControl.setValue(yearControl.value + 1);
|
|
1190
1892
|
}
|
|
1191
1893
|
}
|
|
1192
1894
|
}
|
|
1193
1895
|
function onNextYear() {
|
|
1194
|
-
if (
|
|
1195
|
-
yearControl.
|
|
1896
|
+
if (commons.itIsDefined(yearControl.value)) {
|
|
1897
|
+
yearControl.setValue(yearControl.value + 1);
|
|
1196
1898
|
}
|
|
1197
1899
|
}
|
|
1198
1900
|
function onNext() {
|
|
1199
1901
|
type === 'month' ? onNextMonth() : onNextYear();
|
|
1200
1902
|
}
|
|
1201
|
-
return (
|
|
1903
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-month-title", children: [jsxRuntimeExports.jsx(RlsButtonAction, { icon: "arrow-ios-left", onClick: onPrevious, disabled: limitPrevious || disabled }), jsxRuntimeExports.jsx("span", { onClick: onClick, children: monthName }), jsxRuntimeExports.jsx(RlsButtonAction, { icon: "arrow-ios-right", onClick: onNext, disabled: limitNext || disabled })] }));
|
|
1202
1904
|
}
|
|
1203
1905
|
|
|
1204
1906
|
function RlsPickerYear({ date, disabled: disabledPicker, formControl, maxDate, minDate, onValue, rlsTheme }) {
|
|
1205
1907
|
const currentDate = date || new Date();
|
|
1206
|
-
const [value, setValue] =
|
|
1207
|
-
const [year, setYear] =
|
|
1208
|
-
const [template, setTemplate] =
|
|
1209
|
-
|
|
1908
|
+
const [value, setValue] = require$$0.useState(formControl?.value || currentDate.getFullYear());
|
|
1909
|
+
const [year, setYear] = require$$0.useState(formControl?.value || currentDate.getFullYear());
|
|
1910
|
+
const [template, setTemplate] = require$$0.useState(components.createYearPicker(createPickerProps()));
|
|
1911
|
+
require$$0.useEffect(() => {
|
|
1210
1912
|
const props = createPickerProps(); // YearPickerProps
|
|
1211
|
-
const year = checkYearPicker(props);
|
|
1913
|
+
const year = components.checkYearPicker(props);
|
|
1212
1914
|
year
|
|
1213
1915
|
? setYearValue(year)
|
|
1214
|
-
: setTemplate(createYearPicker(createPickerProps()));
|
|
1916
|
+
: setTemplate(components.createYearPicker(createPickerProps()));
|
|
1215
1917
|
}, [date, year, value, minDate, maxDate]);
|
|
1216
|
-
|
|
1217
|
-
const year = checkYearPicker(createPickerProps());
|
|
1218
|
-
|
|
1219
|
-
? formControl?.
|
|
1220
|
-
: setValue(formControl?.
|
|
1221
|
-
}, [formControl?.
|
|
1918
|
+
require$$0.useEffect(() => {
|
|
1919
|
+
const year = components.checkYearPicker(createPickerProps());
|
|
1920
|
+
commons.itIsDefined(year)
|
|
1921
|
+
? formControl?.setValue(year)
|
|
1922
|
+
: setValue(formControl?.value || currentDate.getFullYear());
|
|
1923
|
+
}, [formControl?.value]);
|
|
1222
1924
|
function createPickerProps() {
|
|
1223
1925
|
return {
|
|
1224
1926
|
date: currentDate,
|
|
@@ -1228,7 +1930,7 @@ function RlsPickerYear({ date, disabled: disabledPicker, formControl, maxDate, m
|
|
|
1228
1930
|
};
|
|
1229
1931
|
}
|
|
1230
1932
|
function setYearValue(value) {
|
|
1231
|
-
formControl ? formControl.
|
|
1933
|
+
formControl ? formControl.setValue(value) : setValue(value);
|
|
1232
1934
|
setYear(value);
|
|
1233
1935
|
}
|
|
1234
1936
|
function onClickPrev() {
|
|
@@ -1243,19 +1945,19 @@ function RlsPickerYear({ date, disabled: disabledPicker, formControl, maxDate, m
|
|
|
1243
1945
|
onValue(value);
|
|
1244
1946
|
}
|
|
1245
1947
|
}
|
|
1246
|
-
return (
|
|
1948
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-year", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: "rls-picker-year__header", children: [jsxRuntimeExports.jsx("div", { className: "rls-picker-year__action rls-picker-year__action--prev", children: jsxRuntimeExports.jsx(RlsButtonAction, { icon: "arrow-ios-left", onClick: onClickPrev, disabled: !template.canPrevious || disabledPicker }) }), jsxRuntimeExports.jsxs("label", { className: "rls-title-bold", children: [template.minRange, " - ", template.maxRange] }), jsxRuntimeExports.jsx("div", { className: "rls-picker-year__action rls-picker-year__action--next", children: jsxRuntimeExports.jsx(RlsButtonAction, { icon: "arrow-ios-right", onClick: onClickNext, disabled: !template.canNext || disabledPicker }) })] }), jsxRuntimeExports.jsx("div", { className: "rls-picker-year__component", children: template.years.map(({ value, disabled, focused, selected }, index) => (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-picker-year__year', {
|
|
1247
1949
|
disabled: disabled || disabledPicker,
|
|
1248
1950
|
focused,
|
|
1249
1951
|
selected
|
|
1250
|
-
}), onClick: value && !disabledPicker ? () => onChange(value) : undefined, children:
|
|
1952
|
+
}), onClick: value && !disabledPicker ? () => onChange(value) : undefined, children: jsxRuntimeExports.jsx("span", { className: "rls-picker-year__year__span rls-body1-medium", children: value || '????' }) }, index))) })] }));
|
|
1251
1953
|
}
|
|
1252
1954
|
|
|
1253
1955
|
function RlsToolbar({ actions, children, subtitle }) {
|
|
1254
|
-
return (
|
|
1956
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-toolbar", children: [jsxRuntimeExports.jsxs("div", { className: "rls-toolbar__description", children: [children && jsxRuntimeExports.jsx("label", { className: "rls-toolbar__title", children: children }), subtitle && (jsxRuntimeExports.jsx("label", { className: "rls-toolbar__subtitle smalltext-semibold", children: subtitle }))] }), actions && (jsxRuntimeExports.jsx("div", { className: "rls-toolbar__actions", children: actions.map((action, index) => (jsxRuntimeExports.jsx("div", { children: action }, index))) }))] }));
|
|
1255
1957
|
}
|
|
1256
1958
|
|
|
1257
1959
|
function RlsCard({ children, outline, rlsTheme }) {
|
|
1258
|
-
return (
|
|
1960
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-card', { outline }), "rls-theme": rlsTheme, children: jsxRuntimeExports.jsx("div", { className: "rls-card__content", children: children }) }));
|
|
1259
1961
|
}
|
|
1260
1962
|
|
|
1261
1963
|
const reactI18n = i18n.i18n({
|
|
@@ -1279,7 +1981,7 @@ const reactI18n = i18n.i18n({
|
|
|
1279
1981
|
}
|
|
1280
1982
|
});
|
|
1281
1983
|
|
|
1282
|
-
class ConfirmationResult extends
|
|
1984
|
+
class ConfirmationResult extends commons.PartialSealed {
|
|
1283
1985
|
static approved() {
|
|
1284
1986
|
return new ConfirmationResult('approved');
|
|
1285
1987
|
}
|
|
@@ -1288,20 +1990,12 @@ class ConfirmationResult extends helpersAdvanced.PartialSealed {
|
|
|
1288
1990
|
}
|
|
1289
1991
|
}
|
|
1290
1992
|
function RlsConfirmation({ approved, content, reject, rlsTheme, subtitle, title, visible }) {
|
|
1291
|
-
return (
|
|
1292
|
-
if (approved.onClick) {
|
|
1293
|
-
approved.onClick();
|
|
1294
|
-
}
|
|
1295
|
-
}, children: approved.label })), reject && (jsxRuntime.jsx(RlsButton, { type: "outline", onClick: () => {
|
|
1296
|
-
if (reject.onClick) {
|
|
1297
|
-
reject.onClick();
|
|
1298
|
-
}
|
|
1299
|
-
}, children: reject.label }))] }) }))] }), jsxRuntime.jsx("div", { className: "rls-confirmation__backdrop" })] }));
|
|
1993
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-confirmation', { visible }), "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: "rls-confirmation__component", children: [jsxRuntimeExports.jsxs("div", { className: "rls-confirmation__header", children: [title && jsxRuntimeExports.jsx("div", { className: "rls-confirmation__title", children: title }), subtitle && (jsxRuntimeExports.jsx("div", { className: "rls-confirmation__subtitle", children: subtitle }))] }), jsxRuntimeExports.jsx("div", { className: "rls-confirmation__body", children: content && (jsxRuntimeExports.jsx("div", { className: "rls-confirmation__message", children: content })) }), (approved || reject) && (jsxRuntimeExports.jsx("div", { className: "rls-confirmation__footer", children: jsxRuntimeExports.jsxs("div", { className: "rls-confirmation__actions", children: [approved && (jsxRuntimeExports.jsx(RlsButton, { type: "raised", onClick: approved.onClick, children: approved.label })), reject && (jsxRuntimeExports.jsx(RlsButton, { type: "outline", onClick: reject.onClick, children: reject.label }))] }) }))] }), jsxRuntimeExports.jsx("div", { className: "rls-confirmation__backdrop" })] }));
|
|
1300
1994
|
}
|
|
1301
1995
|
function useConfirmationService() {
|
|
1302
|
-
const [config, setConfig] =
|
|
1303
|
-
const [visible, setVisible] =
|
|
1304
|
-
const rlsConfirmation = ReactDOM.createPortal(
|
|
1996
|
+
const [config, setConfig] = require$$0.useState({});
|
|
1997
|
+
const [visible, setVisible] = require$$0.useState(false);
|
|
1998
|
+
const rlsConfirmation = ReactDOM.createPortal(jsxRuntimeExports.jsx(RlsConfirmation, { ...config, visible: visible }), document.body);
|
|
1305
1999
|
function confirmation(config) {
|
|
1306
2000
|
return new Promise((resolve) => {
|
|
1307
2001
|
const { content, rlsTheme, subtitle, title, approved, reject } = config;
|
|
@@ -1337,62 +2031,66 @@ function useConfirmationService() {
|
|
|
1337
2031
|
}
|
|
1338
2032
|
|
|
1339
2033
|
function RlsDatatableHeader({ children }) {
|
|
1340
|
-
return
|
|
2034
|
+
return jsxRuntimeExports.jsx("tr", { className: "rls-datatable__header", children: children });
|
|
1341
2035
|
}
|
|
1342
2036
|
function RlsDatatableTitle({ children, className, control }) {
|
|
1343
|
-
return (
|
|
2037
|
+
return (jsxRuntimeExports.jsx("th", { className: renderClassStatus('rls-datatable__title', { control }, className).trim(), children: children }));
|
|
1344
2038
|
}
|
|
1345
2039
|
function RlsDatatableData({ children, className, error }) {
|
|
1346
|
-
return (
|
|
2040
|
+
return (jsxRuntimeExports.jsx("tr", { className: renderClassStatus('rls-datatable__data', { error }, className).trim(), children: children }));
|
|
1347
2041
|
}
|
|
1348
2042
|
function RlsDatatableCell({ children, className, control, overflow }) {
|
|
1349
|
-
return (
|
|
2043
|
+
return (jsxRuntimeExports.jsx("th", { className: renderClassStatus('rls-datatable__cell', { control, overflow }, className).trim(), children: children }));
|
|
1350
2044
|
}
|
|
1351
2045
|
function RlsDatatableTotals({ children, className, error }) {
|
|
1352
|
-
return (
|
|
2046
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-datatable__totals', { error }, className).trim(), children: children }));
|
|
1353
2047
|
}
|
|
1354
2048
|
function RlsDatatableInfo({ children, className, control, overflow }) {
|
|
1355
|
-
return (
|
|
2049
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-datatable__info', { control, overflow }, className).trim(), children: children }));
|
|
1356
2050
|
}
|
|
1357
2051
|
function RlsDatatable({ children, datatable, footer, header, rlsTheme, summary }) {
|
|
1358
|
-
return (
|
|
2052
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-datatable', {
|
|
1359
2053
|
scrolleable: datatable?.scrolleable
|
|
1360
|
-
}), "rls-theme": rlsTheme, children: [
|
|
2054
|
+
}), "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("table", { children: [header && jsxRuntimeExports.jsx("thead", { className: "rls-datatable__thead", children: header }), jsxRuntimeExports.jsx("tbody", { ref: datatable?.bodyRef, className: "rls-datatable__tbody", children: children })] }), summary && jsxRuntimeExports.jsx("div", { className: "rls-datatable__tsummary", children: summary }), footer && jsxRuntimeExports.jsx("div", { className: "rls-datatable__tfooter", children: footer })] }));
|
|
1361
2055
|
}
|
|
1362
2056
|
|
|
1363
2057
|
function useDatatable() {
|
|
1364
|
-
const [scrolleable, setScrolleable] =
|
|
1365
|
-
const bodyRef =
|
|
1366
|
-
|
|
2058
|
+
const [scrolleable, setScrolleable] = require$$0.useState(false);
|
|
2059
|
+
const bodyRef = require$$0.useRef(null);
|
|
2060
|
+
require$$0.useEffect(() => {
|
|
1367
2061
|
let observer;
|
|
1368
|
-
|
|
2062
|
+
const body = bodyRef?.current;
|
|
2063
|
+
if (body) {
|
|
1369
2064
|
observer = new ResizeObserver(() => {
|
|
1370
|
-
const scrollHeight =
|
|
1371
|
-
const clientHeight =
|
|
2065
|
+
const scrollHeight = body.scrollHeight || 0;
|
|
2066
|
+
const clientHeight = body.clientHeight || 0;
|
|
1372
2067
|
setScrolleable(scrollHeight > clientHeight);
|
|
1373
2068
|
});
|
|
1374
2069
|
observer.observe(bodyRef?.current);
|
|
1375
2070
|
}
|
|
1376
|
-
return () =>
|
|
2071
|
+
return () => {
|
|
2072
|
+
observer?.disconnect();
|
|
2073
|
+
};
|
|
1377
2074
|
}, []);
|
|
1378
2075
|
return { bodyRef, scrolleable };
|
|
1379
2076
|
}
|
|
1380
2077
|
|
|
1381
2078
|
function useListControl({ suggestions, formControl }) {
|
|
1382
|
-
const
|
|
1383
|
-
const listRef =
|
|
1384
|
-
const inputRef =
|
|
1385
|
-
const [
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
2079
|
+
const contentRef = require$$0.useRef(null);
|
|
2080
|
+
const listRef = require$$0.useRef(null);
|
|
2081
|
+
const inputRef = require$$0.useRef(null);
|
|
2082
|
+
const [state, setState] = require$$0.useState({
|
|
2083
|
+
collection: new components.ListCollection([]),
|
|
2084
|
+
focused: false,
|
|
2085
|
+
higher: false,
|
|
2086
|
+
value: '',
|
|
2087
|
+
visible: false
|
|
2088
|
+
});
|
|
2089
|
+
const position = require$$0.useRef(0);
|
|
2090
|
+
require$$0.useEffect(() => {
|
|
1393
2091
|
function onCloseSuggestions({ target }) {
|
|
1394
|
-
if (!
|
|
1395
|
-
|
|
2092
|
+
if (!contentRef?.current?.contains(target)) {
|
|
2093
|
+
setState((state) => ({ ...state, visible: false }));
|
|
1396
2094
|
}
|
|
1397
2095
|
}
|
|
1398
2096
|
document.addEventListener('click', onCloseSuggestions);
|
|
@@ -1400,76 +2098,84 @@ function useListControl({ suggestions, formControl }) {
|
|
|
1400
2098
|
document.removeEventListener('click', onCloseSuggestions);
|
|
1401
2099
|
};
|
|
1402
2100
|
}, []);
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
}, [visible]);
|
|
1412
|
-
|
|
1413
|
-
|
|
2101
|
+
require$$0.useEffect(() => {
|
|
2102
|
+
const content = contentRef.current;
|
|
2103
|
+
const list = listRef.current;
|
|
2104
|
+
formControl?.touch();
|
|
2105
|
+
setState((state) => ({
|
|
2106
|
+
...state,
|
|
2107
|
+
higher: components.locationListCanTop(content, list)
|
|
2108
|
+
}));
|
|
2109
|
+
}, [state.visible]);
|
|
2110
|
+
require$$0.useEffect(() => {
|
|
2111
|
+
setState((state) => ({
|
|
2112
|
+
...state,
|
|
2113
|
+
collection: new components.ListCollection(suggestions)
|
|
2114
|
+
}));
|
|
1414
2115
|
}, [suggestions]);
|
|
2116
|
+
function setFocused(focused) {
|
|
2117
|
+
setState((state) => ({ ...state, focused }));
|
|
2118
|
+
}
|
|
2119
|
+
function setValue(value) {
|
|
2120
|
+
setState((state) => ({ ...state, value }));
|
|
2121
|
+
}
|
|
2122
|
+
function setVisible(visible) {
|
|
2123
|
+
setState((state) => ({ ...state, visible }));
|
|
2124
|
+
}
|
|
1415
2125
|
function navigationInput(event) {
|
|
1416
|
-
if (visible) {
|
|
1417
|
-
const newPosition =
|
|
1418
|
-
|
|
2126
|
+
if (state.visible) {
|
|
2127
|
+
const newPosition = components.navigationListFromInput({
|
|
2128
|
+
content: contentRef.current,
|
|
1419
2129
|
event: event,
|
|
1420
|
-
|
|
2130
|
+
list: listRef.current
|
|
1421
2131
|
});
|
|
1422
|
-
position.current =
|
|
2132
|
+
position.current = newPosition || 0;
|
|
1423
2133
|
}
|
|
1424
2134
|
}
|
|
1425
2135
|
function navigationElement(event) {
|
|
1426
|
-
position.current =
|
|
1427
|
-
|
|
2136
|
+
position.current = components.navigationListFromElement({
|
|
2137
|
+
content: contentRef.current,
|
|
1428
2138
|
event: event,
|
|
1429
|
-
|
|
1430
|
-
|
|
2139
|
+
input: inputRef.current,
|
|
2140
|
+
list: listRef.current,
|
|
1431
2141
|
position: position.current
|
|
1432
2142
|
});
|
|
1433
2143
|
}
|
|
1434
2144
|
return {
|
|
1435
|
-
|
|
1436
|
-
|
|
1437
|
-
focused,
|
|
1438
|
-
higher,
|
|
2145
|
+
...state,
|
|
2146
|
+
contentRef,
|
|
1439
2147
|
inputRef,
|
|
1440
2148
|
listRef,
|
|
1441
2149
|
navigationElement,
|
|
1442
2150
|
navigationInput,
|
|
1443
2151
|
setFocused,
|
|
1444
2152
|
setValue,
|
|
1445
|
-
setVisible
|
|
1446
|
-
value,
|
|
1447
|
-
visible
|
|
2153
|
+
setVisible
|
|
1448
2154
|
};
|
|
1449
2155
|
}
|
|
1450
2156
|
|
|
1451
2157
|
const DURATION_ANIMATION$1 = 240;
|
|
1452
2158
|
const MAX_ELEMENTS = 6;
|
|
1453
2159
|
function useFieldAutocomplete({ disabled, formControl, onSelect, onValue, suggestions }) {
|
|
1454
|
-
const [pattern, setPattern] =
|
|
1455
|
-
const [coincidences, setCoincidences] =
|
|
1456
|
-
const currentStore =
|
|
2160
|
+
const [pattern, setPattern] = require$$0.useState('');
|
|
2161
|
+
const [coincidences, setCoincidences] = require$$0.useState([]);
|
|
2162
|
+
const currentStore = require$$0.useRef({
|
|
1457
2163
|
pattern: '',
|
|
1458
2164
|
coincidences: [],
|
|
1459
2165
|
previous: null
|
|
1460
2166
|
});
|
|
1461
2167
|
const listControl = useListControl({ suggestions, formControl });
|
|
1462
2168
|
const { collection, inputRef, navigationElement, navigationInput, setFocused, setValue, setVisible } = listControl;
|
|
1463
|
-
const initializedState =
|
|
1464
|
-
const initializedCollection =
|
|
1465
|
-
const changeInternal =
|
|
1466
|
-
|
|
2169
|
+
const initializedState = require$$0.useRef(false);
|
|
2170
|
+
const initializedCollection = require$$0.useRef(false);
|
|
2171
|
+
const changeInternal = require$$0.useRef(false);
|
|
2172
|
+
require$$0.useEffect(() => {
|
|
1467
2173
|
refreshCoincidences(pattern, true);
|
|
1468
2174
|
}, [suggestions]);
|
|
1469
|
-
|
|
2175
|
+
require$$0.useEffect(() => {
|
|
1470
2176
|
refreshCoincidences(pattern);
|
|
1471
2177
|
}, [pattern]);
|
|
1472
|
-
|
|
2178
|
+
require$$0.useEffect(() => {
|
|
1473
2179
|
if (!initializedState.current || !initializedCollection.current) {
|
|
1474
2180
|
initializedState.current = true;
|
|
1475
2181
|
return;
|
|
@@ -1478,14 +2184,14 @@ function useFieldAutocomplete({ disabled, formControl, onSelect, onValue, sugges
|
|
|
1478
2184
|
changeInternal.current = false;
|
|
1479
2185
|
return;
|
|
1480
2186
|
}
|
|
1481
|
-
refresh(collection, formControl?.
|
|
1482
|
-
}, [formControl?.
|
|
1483
|
-
|
|
2187
|
+
refresh(collection, formControl?.value);
|
|
2188
|
+
}, [formControl?.value]);
|
|
2189
|
+
require$$0.useEffect(() => {
|
|
1484
2190
|
if (!initializedCollection.current || !initializedState.current) {
|
|
1485
2191
|
initializedCollection.current = true;
|
|
1486
2192
|
return;
|
|
1487
2193
|
}
|
|
1488
|
-
refresh(collection, formControl?.
|
|
2194
|
+
refresh(collection, formControl?.value);
|
|
1489
2195
|
}, [collection]);
|
|
1490
2196
|
function refresh(collection, state) {
|
|
1491
2197
|
if (!state) {
|
|
@@ -1501,7 +2207,7 @@ function useFieldAutocomplete({ disabled, formControl, onSelect, onValue, sugges
|
|
|
1501
2207
|
function setFormState(value) {
|
|
1502
2208
|
if (formControl) {
|
|
1503
2209
|
changeInternal.current = true;
|
|
1504
|
-
formControl.
|
|
2210
|
+
formControl.setValue(value);
|
|
1505
2211
|
}
|
|
1506
2212
|
}
|
|
1507
2213
|
function onClickControl() {
|
|
@@ -1564,7 +2270,7 @@ function useFieldAutocomplete({ disabled, formControl, onSelect, onValue, sugges
|
|
|
1564
2270
|
}
|
|
1565
2271
|
}
|
|
1566
2272
|
function refreshCoincidences(pattern, reboot = false) {
|
|
1567
|
-
const { collection, store } =
|
|
2273
|
+
const { collection, store } = components.createAutocompleteStore({
|
|
1568
2274
|
pattern,
|
|
1569
2275
|
suggestions,
|
|
1570
2276
|
reboot,
|
|
@@ -1589,171 +2295,77 @@ function useFieldAutocomplete({ disabled, formControl, onSelect, onValue, sugges
|
|
|
1589
2295
|
};
|
|
1590
2296
|
}
|
|
1591
2297
|
|
|
1592
|
-
function RlsFieldAutocompleteTemplate({ suggestions, children, disabled, formControl, hiddenIcon,
|
|
1593
|
-
const
|
|
2298
|
+
function RlsFieldAutocompleteTemplate({ render, suggestions, children, disabled, formControl, hiddenIcon, onSearch, onSelect, onValue, placeholder, rlsTheme, searching }) {
|
|
2299
|
+
const fieldAutocomplete = useFieldAutocomplete({
|
|
1594
2300
|
suggestions,
|
|
1595
2301
|
disabled,
|
|
1596
2302
|
formControl,
|
|
1597
2303
|
onSelect,
|
|
1598
2304
|
onValue
|
|
1599
2305
|
});
|
|
1600
|
-
return (
|
|
2306
|
+
return (jsxRuntimeExports.jsxs("div", { ref: fieldAutocomplete.listControl.contentRef, className: renderClassStatus('rls-field-box', {
|
|
1601
2307
|
disabled,
|
|
1602
|
-
focused: listControl.focused,
|
|
1603
|
-
selected: !!listControl.value
|
|
1604
|
-
}, 'rls-field-list rls-field-autocomplete'), "rls-theme": rlsTheme, children: [children &&
|
|
1605
|
-
visible: listControl.visible,
|
|
1606
|
-
hide: !listControl.visible,
|
|
1607
|
-
higher: listControl.higher
|
|
1608
|
-
}), children: [
|
|
1609
|
-
setPattern(value);
|
|
1610
|
-
}, disabled: disabled || searching, onFocus: onFocusInput, onBlur: onBlurInput, onKeyDown: onKeydownInput }), onSearch && (
|
|
1611
|
-
onSearch(pattern);
|
|
1612
|
-
}, children:
|
|
2308
|
+
focused: fieldAutocomplete.listControl.focused,
|
|
2309
|
+
selected: !!fieldAutocomplete.listControl.value
|
|
2310
|
+
}, 'rls-field-list rls-field-autocomplete'), "rls-theme": rlsTheme, children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-box__body", children: [jsxRuntimeExports.jsx("label", { className: "rls-field-list__control", onClick: fieldAutocomplete.onClickControl, children: fieldAutocomplete.listControl.value ? (jsxRuntimeExports.jsx("span", { className: "rls-field-list__control__description", children: fieldAutocomplete.listControl.value })) : (jsxRuntimeExports.jsx("span", { className: "rls-field-list__control__placeholder", children: placeholder })) }), !hiddenIcon && fieldAutocomplete.listControl.value && (jsxRuntimeExports.jsx("button", { className: "rls-field-list__action", disabled: disabled, onClick: fieldAutocomplete.onClickAction, children: jsxRuntimeExports.jsx(RlsIcon, { value: "trash-2" }) }))] }) }), jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }), jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-list__suggestions', {
|
|
2311
|
+
visible: fieldAutocomplete.listControl.visible,
|
|
2312
|
+
hide: !fieldAutocomplete.listControl.visible,
|
|
2313
|
+
higher: fieldAutocomplete.listControl.higher
|
|
2314
|
+
}), children: [jsxRuntimeExports.jsx("div", { className: "rls-field-list__suggestions__body", children: jsxRuntimeExports.jsxs("ul", { ref: fieldAutocomplete.listControl.listRef, className: "rls-field-list__ul", children: [jsxRuntimeExports.jsxs("div", { className: "rls-field-list__ul__search", children: [jsxRuntimeExports.jsx("input", { ref: fieldAutocomplete.listControl.inputRef, className: "rls-field-list__ul__control", type: "text", placeholder: reactI18n('listInputPlaceholder'), value: fieldAutocomplete.pattern, onChange: ({ target: { value } }) => {
|
|
2315
|
+
fieldAutocomplete.setPattern(value);
|
|
2316
|
+
}, disabled: disabled || searching, onFocus: fieldAutocomplete.onFocusInput, onBlur: fieldAutocomplete.onBlurInput, onKeyDown: fieldAutocomplete.onKeydownInput }), onSearch && (jsxRuntimeExports.jsx("button", { disabled: disabled || searching, onClick: () => {
|
|
2317
|
+
onSearch(fieldAutocomplete.pattern);
|
|
2318
|
+
}, children: jsxRuntimeExports.jsx(RlsIcon, { value: "search" }) }))] }), searching && jsxRuntimeExports.jsx(RlsProgressBar, { indeterminate: true }), fieldAutocomplete.coincidences.map((element, index) => (jsxRuntimeExports.jsx("li", { className: "rls-field-list__element", tabIndex: -1, onClick: fieldAutocomplete.onClickElement(element), onKeyDown: fieldAutocomplete.onKeydownElement(element), children: render(element) }, index))), !fieldAutocomplete.coincidences.length && (jsxRuntimeExports.jsx("li", { className: "rls-field-list__empty", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-list__empty__description", children: [jsxRuntimeExports.jsx("label", { className: "rls-label-bold truncate", children: reactI18n('listEmptyTitle') }), jsxRuntimeExports.jsx("p", { className: "rls-caption-regular", children: reactI18n('listEmptyDescription') })] }) }))] }) }), jsxRuntimeExports.jsx("div", { className: "rls-field-list__backdrop", onClick: fieldAutocomplete.onClickBackdrop })] })] }));
|
|
1613
2319
|
}
|
|
1614
2320
|
function RlsFieldAutocomplete(props) {
|
|
1615
|
-
return (
|
|
2321
|
+
return (jsxRuntimeExports.jsx(RlsFieldAutocompleteTemplate, { ...props, render: (element) => (jsxRuntimeExports.jsx(RlsBallot, { subtitle: element.subtitle, img: element.img, initials: element.initials, children: element.title })) }));
|
|
1616
2322
|
}
|
|
1617
2323
|
|
|
2324
|
+
const DATE_RANGE_FORMAT = '{dd}/{mx}/{aa}';
|
|
2325
|
+
|
|
1618
2326
|
function rangeFormatTemplate({ maxDate, minDate }) {
|
|
1619
|
-
const minFormat =
|
|
1620
|
-
const maxFormat =
|
|
2327
|
+
const minFormat = dates.dateFormatTemplate(minDate, DATE_RANGE_FORMAT);
|
|
2328
|
+
const maxFormat = dates.dateFormatTemplate(maxDate, DATE_RANGE_FORMAT);
|
|
1621
2329
|
return `${minFormat} - ${maxFormat}`;
|
|
1622
2330
|
}
|
|
1623
2331
|
|
|
1624
2332
|
function RlsModal({ children, visible, rlsTheme }) {
|
|
1625
|
-
return ReactDOM.createPortal(
|
|
1626
|
-
}
|
|
1627
|
-
|
|
1628
|
-
const
|
|
1629
|
-
const { state, validators } = props;
|
|
1630
|
-
return validators.reduce((errors, validator) => {
|
|
1631
|
-
const error = validator(state);
|
|
1632
|
-
if (error) {
|
|
1633
|
-
errors.push(error);
|
|
1634
|
-
}
|
|
1635
|
-
return errors;
|
|
1636
|
-
}, []);
|
|
1637
|
-
};
|
|
1638
|
-
|
|
1639
|
-
function useControl(controlProps, controlValidators) {
|
|
1640
|
-
const props = helpersForms.createFormControlProps(controlProps, controlValidators);
|
|
1641
|
-
const [state, setCurrentState] = react.useState(props.state);
|
|
1642
|
-
const [value, setValue] = react.useState(props.state);
|
|
1643
|
-
const [touched, setTouched] = react.useState(props.touched || false);
|
|
1644
|
-
const [dirty, setDirty] = react.useState(false);
|
|
1645
|
-
const [focused, setFocused] = react.useState(false);
|
|
1646
|
-
const [disabled, setDisabled] = react.useState(false);
|
|
1647
|
-
const [initialValue] = react.useState(props.state);
|
|
1648
|
-
const [validators, setValidators] = react.useState(props.validators);
|
|
1649
|
-
const [subscribers] = react.useState(new rxjs.BehaviorSubject(props.state));
|
|
1650
|
-
const elementRef = react.useRef(null);
|
|
1651
|
-
const errors = (() => validators ? controlIsValid({ state, validators }) : [])();
|
|
1652
|
-
const error = (() => errors[0])();
|
|
1653
|
-
const valid = (() => errors.length === 0)();
|
|
1654
|
-
react.useEffect(() => {
|
|
1655
|
-
if (state !== null && state !== undefined) {
|
|
1656
|
-
setValue(state);
|
|
1657
|
-
}
|
|
1658
|
-
subscribers.next(state);
|
|
1659
|
-
}, [state]);
|
|
1660
|
-
function focus() {
|
|
1661
|
-
setFocused(true);
|
|
1662
|
-
}
|
|
1663
|
-
function blur() {
|
|
1664
|
-
setFocused(false);
|
|
1665
|
-
}
|
|
1666
|
-
function disable() {
|
|
1667
|
-
setDisabled(true);
|
|
1668
|
-
}
|
|
1669
|
-
function enable() {
|
|
1670
|
-
setDisabled(false);
|
|
1671
|
-
}
|
|
1672
|
-
function touch() {
|
|
1673
|
-
setTouched(true);
|
|
1674
|
-
}
|
|
1675
|
-
function untouch() {
|
|
1676
|
-
setTouched(false);
|
|
1677
|
-
}
|
|
1678
|
-
function setState(state) {
|
|
1679
|
-
setDirty(true);
|
|
1680
|
-
setCurrentState(state);
|
|
1681
|
-
}
|
|
1682
|
-
function reset() {
|
|
1683
|
-
setTouched(false);
|
|
1684
|
-
setDirty(false);
|
|
1685
|
-
setCurrentState(initialValue);
|
|
1686
|
-
}
|
|
1687
|
-
function subscribe(subscriber) {
|
|
1688
|
-
const subscription = subscribers.subscribe(subscriber);
|
|
1689
|
-
return () => subscription.unsubscribe();
|
|
1690
|
-
}
|
|
1691
|
-
return {
|
|
1692
|
-
blur,
|
|
1693
|
-
dirty,
|
|
1694
|
-
disable,
|
|
1695
|
-
disabled,
|
|
1696
|
-
elementRef,
|
|
1697
|
-
enable,
|
|
1698
|
-
enabled: !disabled,
|
|
1699
|
-
error,
|
|
1700
|
-
errors,
|
|
1701
|
-
focus,
|
|
1702
|
-
focused,
|
|
1703
|
-
invalid: !valid,
|
|
1704
|
-
pristine: !dirty,
|
|
1705
|
-
reset,
|
|
1706
|
-
setState,
|
|
1707
|
-
setValidators,
|
|
1708
|
-
state,
|
|
1709
|
-
subscribe,
|
|
1710
|
-
touch,
|
|
1711
|
-
touched,
|
|
1712
|
-
unfocused: !focused,
|
|
1713
|
-
untouch,
|
|
1714
|
-
untouched: !touched,
|
|
1715
|
-
valid,
|
|
1716
|
-
value,
|
|
1717
|
-
wrong: touched && !valid
|
|
1718
|
-
};
|
|
1719
|
-
}
|
|
1720
|
-
function useReactControl(controlProps, controlValidators) {
|
|
1721
|
-
return useControl(controlProps, controlValidators);
|
|
1722
|
-
}
|
|
1723
|
-
|
|
1724
|
-
const FORMAT_DESCRIPTION = '{dw}, {mx} {dd} de {aa}';
|
|
2333
|
+
return ReactDOM.createPortal(jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-modal', { visible }), "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsx("div", { className: "rls-modal__component", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-modal__backdrop" })] }), document.body);
|
|
2334
|
+
}
|
|
2335
|
+
|
|
2336
|
+
const FORMAT_TITLE = '{dw}, {mx} {dd} de {aa}';
|
|
1725
2337
|
function RlsPickerDate({ automatic, date, disabled, formControl, maxDate, minDate, onListener, rlsTheme }) {
|
|
1726
2338
|
const today = new Date(); // Initial current date in component
|
|
1727
|
-
const dateInitial = formControl?.
|
|
1728
|
-
const yearControl = useReactControl(dateInitial.getFullYear());
|
|
1729
|
-
const dayControl = useReactControl(dateInitial.getDate());
|
|
1730
|
-
const monthControl = useReactControl(dateInitial.getMonth());
|
|
1731
|
-
const [value, setValue] =
|
|
1732
|
-
const [visibility, setVisibility] =
|
|
1733
|
-
|
|
1734
|
-
const dateCheck = checkDateRange({
|
|
1735
|
-
date: formControl?.
|
|
2339
|
+
const dateInitial = formControl?.value || date || today;
|
|
2340
|
+
const yearControl = reactForms.useReactControl(dateInitial.getFullYear());
|
|
2341
|
+
const dayControl = reactForms.useReactControl(dateInitial.getDate());
|
|
2342
|
+
const monthControl = reactForms.useReactControl(dateInitial.getMonth());
|
|
2343
|
+
const [value, setValue] = require$$0.useState(dateInitial);
|
|
2344
|
+
const [visibility, setVisibility] = require$$0.useState('DAY');
|
|
2345
|
+
require$$0.useEffect(() => {
|
|
2346
|
+
const dateCheck = components.checkDateRange({
|
|
2347
|
+
date: formControl?.value || date || today,
|
|
1736
2348
|
minDate,
|
|
1737
2349
|
maxDate
|
|
1738
2350
|
});
|
|
1739
2351
|
setValue(dateCheck);
|
|
1740
|
-
formControl?.
|
|
2352
|
+
formControl?.setValue(dateCheck);
|
|
1741
2353
|
}, []);
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
}, [yearControl.
|
|
1747
|
-
|
|
1748
|
-
|
|
1749
|
-
|
|
1750
|
-
|
|
1751
|
-
}, [monthControl.
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
1755
|
-
|
|
1756
|
-
}, [dayControl.
|
|
2354
|
+
require$$0.useEffect(() => {
|
|
2355
|
+
if (commons.itIsDefined(yearControl.value)) {
|
|
2356
|
+
setValue(dates.assignYearInDate(value, yearControl.value));
|
|
2357
|
+
}
|
|
2358
|
+
}, [yearControl.value]);
|
|
2359
|
+
require$$0.useEffect(() => {
|
|
2360
|
+
if (commons.itIsDefined(monthControl.value)) {
|
|
2361
|
+
setValue(dates.assignMonthInDate(value, monthControl.value));
|
|
2362
|
+
}
|
|
2363
|
+
}, [monthControl.value]);
|
|
2364
|
+
require$$0.useEffect(() => {
|
|
2365
|
+
if (commons.itIsDefined(dayControl.value)) {
|
|
2366
|
+
setValue(dates.assignDayInDate(value, dayControl.value));
|
|
2367
|
+
}
|
|
2368
|
+
}, [dayControl.value]);
|
|
1757
2369
|
function onVisibilityDay() {
|
|
1758
2370
|
setVisibility('DAY');
|
|
1759
2371
|
}
|
|
@@ -1765,107 +2377,105 @@ function RlsPickerDate({ automatic, date, disabled, formControl, maxDate, minDat
|
|
|
1765
2377
|
}
|
|
1766
2378
|
function onCancel() {
|
|
1767
2379
|
if (onListener) {
|
|
1768
|
-
onListener({ type: PickerListenerType.Cancel });
|
|
2380
|
+
onListener({ type: components.PickerListenerType.Cancel });
|
|
1769
2381
|
}
|
|
1770
2382
|
}
|
|
1771
2383
|
function onToday() {
|
|
1772
|
-
yearControl.
|
|
1773
|
-
dayControl.
|
|
1774
|
-
monthControl.
|
|
1775
|
-
formControl?.
|
|
2384
|
+
yearControl.setValue(today.getFullYear());
|
|
2385
|
+
dayControl.setValue(today.getDate());
|
|
2386
|
+
monthControl.setValue(today.getMonth());
|
|
2387
|
+
formControl?.setValue(today);
|
|
1776
2388
|
if (onListener) {
|
|
1777
|
-
onListener({ type: PickerListenerType.Now, value: today });
|
|
2389
|
+
onListener({ type: components.PickerListenerType.Now, value: today });
|
|
1778
2390
|
}
|
|
1779
2391
|
}
|
|
1780
2392
|
function onSelect() {
|
|
1781
|
-
formControl?.
|
|
2393
|
+
formControl?.setValue(value);
|
|
1782
2394
|
if (onListener) {
|
|
1783
|
-
onListener({ type: PickerListenerType.Select, value });
|
|
2395
|
+
onListener({ type: components.PickerListenerType.Select, value });
|
|
1784
2396
|
}
|
|
1785
2397
|
}
|
|
1786
|
-
return (
|
|
2398
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-date", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: "rls-picker-date__header", children: [jsxRuntimeExports.jsx("div", { className: "rls-picker-date__title rls-picker-date__title--description", children: jsxRuntimeExports.jsx("span", { onClick: onVisibilityDay, children: dates.dateFormatTemplate(dateInitial, FORMAT_TITLE) }) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-date__title rls-picker-date__title--year", children: jsxRuntimeExports.jsx("span", { onClick: onVisibilityYear, children: yearControl.value }) }), jsxRuntimeExports.jsx(RlsPickerMonthTitle, { monthControl: monthControl, yearControl: yearControl, date: value, maxDate: maxDate, minDate: minDate, disabled: visibility === 'YEAR', type: 'month', onClick: onVisibilityMonth })] }), jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-picker-date__component', {
|
|
1787
2399
|
day: visibility === 'DAY',
|
|
1788
2400
|
month: visibility === 'MONTH',
|
|
1789
2401
|
year: visibility === 'YEAR'
|
|
1790
|
-
}), children: [
|
|
2402
|
+
}), children: [jsxRuntimeExports.jsx(RlsPickerDay, { formControl: dayControl, date: dateInitial, month: monthControl.value, year: yearControl.value, maxDate: maxDate, minDate: minDate, disabled: disabled }), jsxRuntimeExports.jsx(RlsPickerMonth, { formControl: monthControl, date: dateInitial, year: yearControl.value, maxDate: maxDate, minDate: minDate, disabled: disabled, onValue: onVisibilityDay }), jsxRuntimeExports.jsx(RlsPickerYear, { formControl: yearControl, date: dateInitial, maxDate: maxDate, minDate: minDate, disabled: disabled, onValue: onVisibilityDay })] }), !automatic && (jsxRuntimeExports.jsx("div", { className: "rls-picker-date__footer", children: jsxRuntimeExports.jsxs("div", { className: "rls-picker-date__actions", children: [jsxRuntimeExports.jsx("div", { className: "rls-picker-date__actions--cancel", children: jsxRuntimeExports.jsx(RlsButton, { type: "ghost", onClick: onCancel, children: reactI18n('dateActionCancel') }) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-date__actions--today", children: jsxRuntimeExports.jsx(RlsButton, { type: "ghost", onClick: onToday, disabled: components.dateOutRange({ date: today, maxDate, minDate }), children: reactI18n('dateActionToday') }) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-date__actions--ok", children: jsxRuntimeExports.jsx(RlsButton, { type: "raised", onClick: onSelect, children: reactI18n('dateActionSelect') }) })] }) }))] }));
|
|
1791
2403
|
}
|
|
1792
2404
|
|
|
1793
|
-
|
|
2405
|
+
const FORMAT_DATE = '{dd}/{mx}/{aa}';
|
|
2406
|
+
function RlsFieldDate({ children, date, disabled, formControl, format, maxDate, minDate, onValue, placeholder, rlsTheme }) {
|
|
1794
2407
|
const today = new Date(); // Initial current date in component
|
|
1795
|
-
const [value, setValue] =
|
|
1796
|
-
const [modalIsVisible, setModalIsVisible] =
|
|
1797
|
-
|
|
1798
|
-
const dateCheck = checkDateRange({
|
|
1799
|
-
date: formControl?.
|
|
2408
|
+
const [value, setValue] = require$$0.useState();
|
|
2409
|
+
const [modalIsVisible, setModalIsVisible] = require$$0.useState(false);
|
|
2410
|
+
require$$0.useEffect(() => {
|
|
2411
|
+
const dateCheck = components.checkDateRange({
|
|
2412
|
+
date: formControl?.value || date || today,
|
|
1800
2413
|
minDate,
|
|
1801
2414
|
maxDate
|
|
1802
2415
|
});
|
|
1803
2416
|
setValue(dateCheck);
|
|
1804
|
-
formControl?.
|
|
2417
|
+
formControl?.setValue(dateCheck);
|
|
1805
2418
|
}, []);
|
|
1806
|
-
function
|
|
1807
|
-
setModalIsVisible(true);
|
|
1808
|
-
}
|
|
1809
|
-
function onChange(value, ignoreControl = false) {
|
|
1810
|
-
if (!ignoreControl) {
|
|
1811
|
-
formControl?.setState(value);
|
|
1812
|
-
}
|
|
2419
|
+
function onChange(value) {
|
|
1813
2420
|
setValue(value);
|
|
1814
2421
|
if (onValue) {
|
|
1815
2422
|
onValue(value);
|
|
1816
2423
|
}
|
|
1817
2424
|
}
|
|
1818
|
-
function
|
|
2425
|
+
function onClickInput() {
|
|
2426
|
+
setModalIsVisible(true);
|
|
2427
|
+
}
|
|
2428
|
+
function onClickAction() {
|
|
1819
2429
|
if (value) {
|
|
2430
|
+
formControl?.setValue(undefined);
|
|
2431
|
+
formControl?.touch();
|
|
1820
2432
|
onChange(undefined);
|
|
1821
|
-
if (formControl && !formControl.touched) {
|
|
1822
|
-
formControl.touch();
|
|
1823
|
-
}
|
|
1824
2433
|
}
|
|
1825
2434
|
else {
|
|
1826
2435
|
setModalIsVisible(true);
|
|
1827
2436
|
}
|
|
1828
2437
|
}
|
|
1829
|
-
|
|
1830
|
-
|
|
1831
|
-
|
|
2438
|
+
const valueInput = value
|
|
2439
|
+
? dates.dateFormatTemplate(value, format || FORMAT_DATE)
|
|
2440
|
+
: '';
|
|
2441
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-field-date", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', { disabled }), children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-box__body", children: [jsxRuntimeExports.jsx("input", { className: "rls-field-date__control", type: "text", value: valueInput, readOnly: true, placeholder: placeholder, onClick: onClickInput, disabled: disabled }), jsxRuntimeExports.jsx("button", { className: "rls-field-date__action", onClick: onClickAction, disabled: disabled, children: jsxRuntimeExports.jsx(RlsIcon, { value: value ? 'trash-2' : 'calendar' }) })] }) }), jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })] }), jsxRuntimeExports.jsx(RlsModal, { visible: modalIsVisible, rlsTheme: rlsTheme, children: jsxRuntimeExports.jsx(RlsPickerDate, { formControl: formControl, date: date, disabled: disabled, maxDate: maxDate, minDate: minDate, onListener: ({ value, type }) => {
|
|
2442
|
+
if (type !== components.PickerListenerType.Cancel) {
|
|
2443
|
+
onChange(value);
|
|
1832
2444
|
}
|
|
2445
|
+
formControl?.touch();
|
|
1833
2446
|
setModalIsVisible(false);
|
|
1834
|
-
if (!formControl?.touched) {
|
|
1835
|
-
formControl?.touch();
|
|
1836
|
-
}
|
|
1837
2447
|
} }) })] }));
|
|
1838
2448
|
}
|
|
1839
2449
|
|
|
1840
2450
|
function RlsPickerDateRange({ automatic, date: datePicker, disabled, formControl, maxDate, minDate, onListener, rlsTheme }) {
|
|
1841
|
-
const dateInitial =
|
|
1842
|
-
const rangeInitial = formControl?.
|
|
1843
|
-
const yearControl = useReactControl(dateInitial.getFullYear());
|
|
1844
|
-
const monthControl = useReactControl(dateInitial.getMonth());
|
|
1845
|
-
const dayControl = useReactControl(rangeInitial);
|
|
1846
|
-
const [value, setValue] =
|
|
1847
|
-
const [date, setDate] =
|
|
1848
|
-
const [visibility, setVisibility] =
|
|
1849
|
-
|
|
2451
|
+
const dateInitial = dates.normalizeMinTime(datePicker || new Date());
|
|
2452
|
+
const rangeInitial = formControl?.value || dates.DateRange.now();
|
|
2453
|
+
const yearControl = reactForms.useReactControl(dateInitial.getFullYear());
|
|
2454
|
+
const monthControl = reactForms.useReactControl(dateInitial.getMonth());
|
|
2455
|
+
const dayControl = reactForms.useReactControl(rangeInitial);
|
|
2456
|
+
const [value, setValue] = require$$0.useState(rangeInitial);
|
|
2457
|
+
const [date, setDate] = require$$0.useState(dateInitial);
|
|
2458
|
+
const [visibility, setVisibility] = require$$0.useState('DAY');
|
|
2459
|
+
require$$0.useEffect(() => {
|
|
1850
2460
|
setDate((prevValue) => {
|
|
1851
|
-
return typeof yearControl.
|
|
1852
|
-
?
|
|
2461
|
+
return typeof yearControl.value === 'number'
|
|
2462
|
+
? dates.assignYearInDate(prevValue, yearControl.value)
|
|
1853
2463
|
: prevValue;
|
|
1854
2464
|
});
|
|
1855
|
-
}, [yearControl.
|
|
1856
|
-
|
|
2465
|
+
}, [yearControl.value]);
|
|
2466
|
+
require$$0.useEffect(() => {
|
|
1857
2467
|
setDate((prevValue) => {
|
|
1858
|
-
return typeof monthControl.
|
|
1859
|
-
?
|
|
2468
|
+
return typeof monthControl.value === 'number'
|
|
2469
|
+
? dates.assignMonthInDate(prevValue, monthControl.value)
|
|
1860
2470
|
: prevValue;
|
|
1861
2471
|
});
|
|
1862
|
-
}, [monthControl.
|
|
1863
|
-
|
|
1864
|
-
if (dayControl.
|
|
1865
|
-
setValue(dayControl.
|
|
2472
|
+
}, [monthControl.value]);
|
|
2473
|
+
require$$0.useEffect(() => {
|
|
2474
|
+
if (dayControl.value) {
|
|
2475
|
+
setValue(dayControl.value);
|
|
1866
2476
|
}
|
|
1867
2477
|
setVisibility('DAY');
|
|
1868
|
-
}, [dayControl.
|
|
2478
|
+
}, [dayControl.value]);
|
|
1869
2479
|
function onVisibilityDay() {
|
|
1870
2480
|
setVisibility('DAY');
|
|
1871
2481
|
}
|
|
@@ -1877,42 +2487,42 @@ function RlsPickerDateRange({ automatic, date: datePicker, disabled, formControl
|
|
|
1877
2487
|
}
|
|
1878
2488
|
function onCancel() {
|
|
1879
2489
|
if (onListener) {
|
|
1880
|
-
onListener({ type: PickerListenerType.Cancel });
|
|
2490
|
+
onListener({ type: components.PickerListenerType.Cancel });
|
|
1881
2491
|
}
|
|
1882
2492
|
}
|
|
1883
2493
|
function onSelect() {
|
|
1884
|
-
formControl?.
|
|
2494
|
+
formControl?.setValue(value);
|
|
1885
2495
|
if (onListener) {
|
|
1886
|
-
onListener({ type: PickerListenerType.Select, value });
|
|
2496
|
+
onListener({ type: components.PickerListenerType.Select, value });
|
|
1887
2497
|
}
|
|
1888
2498
|
}
|
|
1889
|
-
return (
|
|
2499
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-date-range", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: "rls-picker-date-range__header", children: [jsxRuntimeExports.jsx("div", { className: "rls-picker-date-range__title rls-picker-date-range__title--description", children: jsxRuntimeExports.jsx("span", { onClick: onVisibilityDay, children: rangeFormatTemplate(value) }) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-date-range__title rls-picker-date-range__title--year", children: jsxRuntimeExports.jsx("span", { onClick: onVisibilityYear, children: yearControl.value }) }), jsxRuntimeExports.jsx(RlsPickerMonthTitle, { monthControl: monthControl, yearControl: yearControl, date: date, maxDate: maxDate, minDate: minDate, disabled: visibility === 'YEAR', type: visibility === 'MONTH' ? 'year' : 'month', onClick: onVisibilityMonth })] }), jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-picker-date-range__component', {
|
|
1890
2500
|
day: visibility === 'DAY',
|
|
1891
2501
|
month: visibility === 'MONTH',
|
|
1892
2502
|
year: visibility === 'YEAR'
|
|
1893
|
-
}), children: [
|
|
2503
|
+
}), children: [jsxRuntimeExports.jsx(RlsPickerDayRange, { formControl: dayControl, date: date, maxDate: maxDate, minDate: minDate, disabled: disabled }), jsxRuntimeExports.jsx(RlsPickerMonth, { formControl: monthControl, year: yearControl.value, maxDate: maxDate, minDate: minDate, disabled: disabled, onValue: onVisibilityDay }), jsxRuntimeExports.jsx(RlsPickerYear, { formControl: yearControl, maxDate: maxDate, minDate: minDate, disabled: disabled, onValue: onVisibilityDay })] }), jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-picker-date-range__footer', {
|
|
1894
2504
|
automatic
|
|
1895
|
-
}), children:
|
|
2505
|
+
}), children: jsxRuntimeExports.jsxs("div", { className: "rls-picker-date-range__actions", children: [jsxRuntimeExports.jsx("div", { className: "rls-picker-date-range__actions--cancel", children: jsxRuntimeExports.jsx(RlsButton, { type: "ghost", onClick: onCancel, children: reactI18n('dateActionCancel') }) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-date-range__actions--ok", children: jsxRuntimeExports.jsx(RlsButton, { type: "raised", onClick: onSelect, children: reactI18n('dateActionSelect') }) })] }) })] }));
|
|
1896
2506
|
}
|
|
1897
2507
|
|
|
1898
2508
|
function RlsFieldDateRange({ children, date: datePicker, disabled, formControl, maxDate, minDate, placeholder, rlsTheme }) {
|
|
1899
|
-
const currentRange = formControl?.
|
|
2509
|
+
const currentRange = formControl?.value || dates.DateRange.now();
|
|
1900
2510
|
const currentDate = datePicker || new Date();
|
|
1901
|
-
const [value, setValue] =
|
|
1902
|
-
const [modalIsVisible, setModalIsVisible] =
|
|
2511
|
+
const [value, setValue] = require$$0.useState(currentRange);
|
|
2512
|
+
const [modalIsVisible, setModalIsVisible] = require$$0.useState(false);
|
|
1903
2513
|
function onClickInput() {
|
|
1904
2514
|
setModalIsVisible(true);
|
|
1905
2515
|
}
|
|
1906
2516
|
function onClickAction() {
|
|
1907
2517
|
if (value) {
|
|
1908
|
-
formControl?.
|
|
2518
|
+
formControl?.setValue(undefined);
|
|
1909
2519
|
setValue(undefined);
|
|
1910
2520
|
}
|
|
1911
2521
|
else {
|
|
1912
2522
|
setModalIsVisible(true);
|
|
1913
2523
|
}
|
|
1914
2524
|
}
|
|
1915
|
-
return (
|
|
2525
|
+
return (jsxRuntimeExports.jsxs("div", { className: "rls-field-date-range", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', { disabled }), children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-box__body", children: [jsxRuntimeExports.jsx("input", { className: "rls-field-date-range__control", type: "text", value: value ? rangeFormatTemplate(value) : '', readOnly: true, placeholder: placeholder, onClick: onClickInput, disabled: disabled }), jsxRuntimeExports.jsx("button", { className: "rls-field-date-range__action", onClick: onClickAction, disabled: disabled, children: jsxRuntimeExports.jsx(RlsIcon, { value: value ? 'trash-2' : 'calendar' }) })] }) }), jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })] }), jsxRuntimeExports.jsx(RlsModal, { visible: modalIsVisible, rlsTheme: rlsTheme, children: jsxRuntimeExports.jsx(RlsPickerDateRange, { formControl: formControl, date: currentDate, disabled: disabled, maxDate: maxDate, minDate: minDate, onListener: ({ value }) => {
|
|
1916
2526
|
if (value) {
|
|
1917
2527
|
setValue(value);
|
|
1918
2528
|
}
|
|
@@ -1923,10 +2533,10 @@ function RlsFieldDateRange({ children, date: datePicker, disabled, formControl,
|
|
|
1923
2533
|
function useFieldSelect({ suggestions, formControl, onSelect, onValue }) {
|
|
1924
2534
|
const listControl = useListControl({ suggestions, formControl });
|
|
1925
2535
|
const { collection, inputRef, visible, navigationElement, navigationInput, setFocused, setValue, setVisible } = listControl;
|
|
1926
|
-
const initializedState =
|
|
1927
|
-
const initializedCollection =
|
|
1928
|
-
const changeInternal =
|
|
1929
|
-
|
|
2536
|
+
const initializedState = require$$0.useRef(false);
|
|
2537
|
+
const initializedCollection = require$$0.useRef(false);
|
|
2538
|
+
const changeInternal = require$$0.useRef(false);
|
|
2539
|
+
require$$0.useEffect(() => {
|
|
1930
2540
|
if (!initializedState.current || !initializedCollection.current) {
|
|
1931
2541
|
initializedState.current = true;
|
|
1932
2542
|
return;
|
|
@@ -1935,14 +2545,14 @@ function useFieldSelect({ suggestions, formControl, onSelect, onValue }) {
|
|
|
1935
2545
|
changeInternal.current = false;
|
|
1936
2546
|
return;
|
|
1937
2547
|
}
|
|
1938
|
-
refresh(collection, formControl?.
|
|
1939
|
-
}, [formControl?.
|
|
1940
|
-
|
|
2548
|
+
refresh(collection, formControl?.value);
|
|
2549
|
+
}, [formControl?.value]);
|
|
2550
|
+
require$$0.useEffect(() => {
|
|
1941
2551
|
if (!initializedCollection.current || !initializedState.current) {
|
|
1942
2552
|
initializedCollection.current = true;
|
|
1943
2553
|
return;
|
|
1944
2554
|
}
|
|
1945
|
-
refresh(collection, formControl?.
|
|
2555
|
+
refresh(collection, formControl?.value);
|
|
1946
2556
|
}, [collection]);
|
|
1947
2557
|
function refresh(collection, state) {
|
|
1948
2558
|
if (!state) {
|
|
@@ -1958,7 +2568,7 @@ function useFieldSelect({ suggestions, formControl, onSelect, onValue }) {
|
|
|
1958
2568
|
function setFormState(value) {
|
|
1959
2569
|
if (formControl) {
|
|
1960
2570
|
changeInternal.current = true;
|
|
1961
|
-
formControl.
|
|
2571
|
+
formControl.setValue(value);
|
|
1962
2572
|
}
|
|
1963
2573
|
}
|
|
1964
2574
|
function onFocusInput() {
|
|
@@ -2031,28 +2641,28 @@ function useFieldSelect({ suggestions, formControl, onSelect, onValue }) {
|
|
|
2031
2641
|
};
|
|
2032
2642
|
}
|
|
2033
2643
|
|
|
2034
|
-
function RlsFieldSelectTemplate({ suggestions, children, disabled, formControl,
|
|
2035
|
-
const
|
|
2644
|
+
function RlsFieldSelectTemplate({ render, suggestions, children, disabled, formControl, onSelect, onValue, placeholder, rlsTheme }) {
|
|
2645
|
+
const fieldSelect = useFieldSelect({
|
|
2036
2646
|
suggestions,
|
|
2037
2647
|
disabled,
|
|
2038
2648
|
formControl,
|
|
2039
2649
|
onSelect,
|
|
2040
2650
|
onValue
|
|
2041
2651
|
});
|
|
2042
|
-
return (
|
|
2043
|
-
visible: listControl.visible
|
|
2044
|
-
}), disabled: disabled, onClick: onClickAction, children:
|
|
2045
|
-
visible: listControl.visible,
|
|
2046
|
-
hide: !listControl.visible,
|
|
2047
|
-
higher: listControl.higher
|
|
2048
|
-
}), children: [
|
|
2652
|
+
return (jsxRuntimeExports.jsxs("div", { ref: fieldSelect.listControl.contentRef, className: renderClassStatus('rls-field-box', { focused: fieldSelect.listControl.focused, disabled }, 'rls-field-list rls-field-select'), "rls-theme": rlsTheme, children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-box__body", children: [jsxRuntimeExports.jsx("input", { ref: fieldSelect.listControl.inputRef, className: "rls-field-list__control", readOnly: true, disabled: disabled, placeholder: placeholder, value: fieldSelect.listControl.value, onFocus: fieldSelect.onFocusInput, onBlur: fieldSelect.onBlurInput, onClick: fieldSelect.onClickInput, onKeyDown: fieldSelect.onKeydownInput }), jsxRuntimeExports.jsx("button", { className: renderClassStatus('rls-field-list__action', {
|
|
2653
|
+
visible: fieldSelect.listControl.visible
|
|
2654
|
+
}), disabled: disabled, onClick: fieldSelect.onClickAction, children: jsxRuntimeExports.jsx(RlsIcon, { value: "arrow-ios-down" }) })] }) }), jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }), jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-list__suggestions', {
|
|
2655
|
+
visible: fieldSelect.listControl.visible,
|
|
2656
|
+
hide: !fieldSelect.listControl.visible,
|
|
2657
|
+
higher: fieldSelect.listControl.higher
|
|
2658
|
+
}), children: [jsxRuntimeExports.jsx("div", { className: "rls-field-list__suggestions__body", children: jsxRuntimeExports.jsxs("ul", { ref: fieldSelect.listControl.listRef, className: "rls-field-list__ul", children: [suggestions.map((element, index) => (jsxRuntimeExports.jsx("li", { className: "rls-field-list__element", tabIndex: -1, onClick: fieldSelect.onClickElement(element), onKeyDown: fieldSelect.onKeydownElement(element), children: render(element) }, index))), !suggestions.length && (jsxRuntimeExports.jsx("li", { className: "rls-field-list__empty", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-list__empty__description", children: [jsxRuntimeExports.jsx("label", { className: "rls-label-bold truncate", children: reactI18n('listEmptyTitle') }), jsxRuntimeExports.jsx("p", { className: "rls-caption-regular", children: reactI18n('listEmptyDescription') })] }) }))] }) }), jsxRuntimeExports.jsx("div", { className: "rls-field-list__backdrop", onClick: fieldSelect.onClickBackdrop })] })] }));
|
|
2049
2659
|
}
|
|
2050
2660
|
function RlsFieldSelect(props) {
|
|
2051
|
-
return (
|
|
2661
|
+
return (jsxRuntimeExports.jsx(RlsFieldSelectTemplate, { ...props, render: (element) => (jsxRuntimeExports.jsx(RlsBallot, { subtitle: element.subtitle, img: element.img, initials: element.initials, children: element.title })) }));
|
|
2052
2662
|
}
|
|
2053
2663
|
|
|
2054
2664
|
function RlsFormNavigation({ children, visible, rlsTheme }) {
|
|
2055
|
-
return (
|
|
2665
|
+
return (jsxRuntimeExports.jsx("div", { className: renderClassStatus('rls-form-navigation', { visible }), "rls-theme": rlsTheme, children: jsxRuntimeExports.jsx("div", { className: "rls-form-navigation__body", children: children }) }));
|
|
2056
2666
|
}
|
|
2057
2667
|
|
|
2058
2668
|
const DURATION_ANIMATION = 240;
|
|
@@ -2071,15 +2681,15 @@ function calculateDuration({ length }) {
|
|
|
2071
2681
|
return duration + DURATION_RESET;
|
|
2072
2682
|
}
|
|
2073
2683
|
function RlsSnackbar({ content, icon, title, visible, rlsTheme }) {
|
|
2074
|
-
return (
|
|
2684
|
+
return (jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-snackbar', { visible }), "rls-theme": rlsTheme, children: [icon && (jsxRuntimeExports.jsx("div", { className: "rls-snackbar__avatar", children: jsxRuntimeExports.jsx(RlsIcon, { value: icon }) })), jsxRuntimeExports.jsxs("div", { className: "rls-snackbar__component", children: [title && jsxRuntimeExports.jsx("div", { className: "rls-snackbar__title", children: title }), jsxRuntimeExports.jsx("div", { className: "rls-snackbar__content", children: content })] })] }));
|
|
2075
2685
|
}
|
|
2076
2686
|
function useSnackbarService() {
|
|
2077
|
-
const [config, setConfig] =
|
|
2078
|
-
const [duration, setDuration] =
|
|
2079
|
-
const [timeoutId, setTimeoutId] =
|
|
2080
|
-
const [visible, setVisible] =
|
|
2081
|
-
const rlsSnackbar =
|
|
2082
|
-
|
|
2687
|
+
const [config, setConfig] = require$$0.useState({});
|
|
2688
|
+
const [duration, setDuration] = require$$0.useState(4000);
|
|
2689
|
+
const [timeoutId, setTimeoutId] = require$$0.useState();
|
|
2690
|
+
const [visible, setVisible] = require$$0.useState(false);
|
|
2691
|
+
const rlsSnackbar = jsxRuntimeExports.jsx(RlsSnackbar, { ...config, visible: visible });
|
|
2692
|
+
require$$0.useEffect(() => {
|
|
2083
2693
|
if (visible) {
|
|
2084
2694
|
const timeoutId = setTimeout(() => {
|
|
2085
2695
|
setVisible(false);
|
|
@@ -2104,7 +2714,7 @@ function useSnackbarService() {
|
|
|
2104
2714
|
};
|
|
2105
2715
|
}
|
|
2106
2716
|
|
|
2107
|
-
const RlsContext =
|
|
2717
|
+
const RlsContext = require$$0.createContext({
|
|
2108
2718
|
confirmation: () => {
|
|
2109
2719
|
return Promise.resolve(ConfirmationResult.approved());
|
|
2110
2720
|
},
|
|
@@ -2113,7 +2723,7 @@ const RlsContext = react.createContext({
|
|
|
2113
2723
|
function RlsApplication({ children }) {
|
|
2114
2724
|
const { RlsConfirmation, confirmation } = useConfirmationService();
|
|
2115
2725
|
const { RlsSnackbar, snackbar } = useSnackbarService();
|
|
2116
|
-
return (
|
|
2726
|
+
return (jsxRuntimeExports.jsxs(RlsContext.Provider, { value: { confirmation, snackbar }, children: [jsxRuntimeExports.jsx("div", { className: "rls-app__body", children: children }), RlsSnackbar, RlsConfirmation] }));
|
|
2117
2727
|
}
|
|
2118
2728
|
|
|
2119
2729
|
exports.ConfirmationResult = ConfirmationResult;
|
|
@@ -2155,6 +2765,7 @@ exports.RlsInput = RlsInput;
|
|
|
2155
2765
|
exports.RlsInputMoney = RlsInputMoney;
|
|
2156
2766
|
exports.RlsInputNumber = RlsInputNumber;
|
|
2157
2767
|
exports.RlsInputPassword = RlsInputPassword;
|
|
2768
|
+
exports.RlsInputSearch = RlsInputSearch;
|
|
2158
2769
|
exports.RlsInputText = RlsInputText;
|
|
2159
2770
|
exports.RlsLabel = RlsLabel;
|
|
2160
2771
|
exports.RlsLabelCheckBox = RlsLabelCheckBox;
|
|
@@ -2175,7 +2786,6 @@ exports.RlsPoster = RlsPoster;
|
|
|
2175
2786
|
exports.RlsProgressBar = RlsProgressBar;
|
|
2176
2787
|
exports.RlsProgressCircular = RlsProgressCircular;
|
|
2177
2788
|
exports.RlsRadioButton = RlsRadioButton;
|
|
2178
|
-
exports.RlsSearchInput = RlsSearchInput;
|
|
2179
2789
|
exports.RlsSkeleton = RlsSkeleton;
|
|
2180
2790
|
exports.RlsSkeletonText = RlsSkeletonText;
|
|
2181
2791
|
exports.RlsSnackbar = RlsSnackbar;
|