linear-react-components-ui 2.1.0-beta.2 → 2.1.0-beta.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/assets/styles/datepicker2.css +8 -11
- package/lib/inputs2/date/calendarbox.js.map +1 -1
- package/lib/inputs2/date/datefield/base.js +435 -334
- package/lib/inputs2/date/datefield/base.js.map +1 -1
- package/lib/inputs2/date/dateperiodfield/base.js +544 -528
- package/lib/inputs2/date/dateperiodfield/base.js.map +1 -1
- package/lib/inputs2/date/dateperiodfield/triggers.js.map +1 -1
- package/lib/inputs2/date/dateperiodfield/types.d.ts +6 -0
- package/lib/inputs2/date/helpers.d.ts +24 -1
- package/lib/inputs2/date/helpers.js +137 -1
- package/lib/inputs2/date/helpers.js.map +1 -1
- package/lib/inputs2/date/hooks/useCalendarPosition.js.map +1 -1
- package/lib/inputs2/date/hooks/useDateCalendarState.js.map +1 -1
- package/lib/inputs2/date/hooks/useDateMask.d.ts +3 -1
- package/lib/inputs2/date/hooks/useDateMask.js +75 -111
- package/lib/inputs2/date/hooks/useDateMask.js.map +1 -1
- package/lib/inputs2/date/timeselector.d.ts +4 -2
- package/lib/inputs2/date/timeselector.js +115 -117
- package/lib/inputs2/date/timeselector.js.map +1 -1
- package/lib/inputs2/date/types.d.ts +6 -0
- package/lib/inputs2/date/types.js.map +1 -1
- package/package.json +1 -1
|
@@ -14,12 +14,12 @@ import { Label, Root, Container, Input } from "../base/index.js";
|
|
|
14
14
|
import { useDateMask } from "../hooks/useDateMask.js";
|
|
15
15
|
import { useDateCalendarState } from "../hooks/useDateCalendarState.js";
|
|
16
16
|
import { TimeSelector } from "../timeselector.js";
|
|
17
|
-
import {
|
|
17
|
+
import { parseBoundary, TOKEN_ISO_FORMAT, parseDateValue, getDateFormats, getPredefinedPeriodRange, clampDateToBounds, isDayOutOfBounds, resolveAssumedTime, completePartialDateTime, getTimeSelection, formatPartialDateTime } from "../helpers.js";
|
|
18
18
|
import { CalendarBox } from "../calendarbox.js";
|
|
19
19
|
import { Triggers } from "./triggers.js";
|
|
20
20
|
import { DatePeriodFieldContext } from "./context.js";
|
|
21
21
|
const InputBase = React.forwardRef((props, __) => {
|
|
22
|
-
const $ = compilerRuntimeExports.c(
|
|
22
|
+
const $ = compilerRuntimeExports.c(155);
|
|
23
23
|
const {
|
|
24
24
|
label,
|
|
25
25
|
errors,
|
|
@@ -46,6 +46,7 @@ const InputBase = React.forwardRef((props, __) => {
|
|
|
46
46
|
shouldCloseOnSelect,
|
|
47
47
|
min,
|
|
48
48
|
max,
|
|
49
|
+
onChange,
|
|
49
50
|
tooltip,
|
|
50
51
|
tooltipPosition,
|
|
51
52
|
tooltipWidth,
|
|
@@ -141,12 +142,14 @@ const InputBase = React.forwardRef((props, __) => {
|
|
|
141
142
|
setMaskValue: setInitialMaskValue,
|
|
142
143
|
unmaskedValue: initialUnmaskedValue,
|
|
143
144
|
handleOnPaste,
|
|
144
|
-
handleOnBeforeInput
|
|
145
|
+
handleOnBeforeInput,
|
|
146
|
+
handleOnKeyDownCapture: handleInitialKeyDownCapture
|
|
145
147
|
} = useDateMask({
|
|
146
148
|
inputRef: initialInputRef,
|
|
147
149
|
variant,
|
|
148
150
|
defaultValue: selectedDate.inicial?.format(ptbrFormat),
|
|
149
151
|
undigitable,
|
|
152
|
+
readOnly,
|
|
150
153
|
onCommit: (date) => handleChangeUpdateDateState({
|
|
151
154
|
date,
|
|
152
155
|
inputType: "initial",
|
|
@@ -158,12 +161,14 @@ const InputBase = React.forwardRef((props, __) => {
|
|
|
158
161
|
const {
|
|
159
162
|
maskedValue: finalMaskedValue,
|
|
160
163
|
setMaskValue: setFinalMaskValue,
|
|
161
|
-
unmaskedValue: finalUnmaskedValue
|
|
164
|
+
unmaskedValue: finalUnmaskedValue,
|
|
165
|
+
handleOnKeyDownCapture: handleFinalKeyDownCapture
|
|
162
166
|
} = useDateMask({
|
|
163
167
|
inputRef: finalInputRef,
|
|
164
168
|
variant,
|
|
165
169
|
defaultValue: selectedDate.final?.format(ptbrFormat),
|
|
166
170
|
undigitable,
|
|
171
|
+
readOnly,
|
|
167
172
|
onCommit: (date_0) => handleChangeUpdateDateState({
|
|
168
173
|
date: date_0,
|
|
169
174
|
inputType: "final",
|
|
@@ -173,36 +178,47 @@ const InputBase = React.forwardRef((props, __) => {
|
|
|
173
178
|
onBeforeInput: props.onBeforeInput
|
|
174
179
|
});
|
|
175
180
|
let t22;
|
|
176
|
-
if ($[7] !==
|
|
177
|
-
t22 =
|
|
178
|
-
$[7] =
|
|
179
|
-
$[8] =
|
|
181
|
+
if ($[7] !== finalUnmaskedValue || $[8] !== initialUnmaskedValue || $[9] !== variant) {
|
|
182
|
+
t22 = (inputType) => getTimeSelection(inputType === "initial" ? initialUnmaskedValue : finalUnmaskedValue, variant);
|
|
183
|
+
$[7] = finalUnmaskedValue;
|
|
184
|
+
$[8] = initialUnmaskedValue;
|
|
185
|
+
$[9] = variant;
|
|
186
|
+
$[10] = t22;
|
|
180
187
|
} else {
|
|
181
|
-
t22 = $[
|
|
188
|
+
t22 = $[10];
|
|
182
189
|
}
|
|
183
|
-
const
|
|
184
|
-
const
|
|
185
|
-
const hasValidationErrors = Boolean(errors?.length);
|
|
190
|
+
const timeSelectionOf = t22;
|
|
191
|
+
const activeTimeSelection = timeSelectionOf(activeInputType);
|
|
186
192
|
let t23;
|
|
187
|
-
if ($[
|
|
188
|
-
t23 = ()
|
|
189
|
-
|
|
190
|
-
const isValidInitialValue = !_.isEmpty(objectValue[initialName]);
|
|
191
|
-
const isValidFinalValue = !_.isEmpty(objectValue[finalName]);
|
|
192
|
-
return isValidInitialValue && isValidFinalValue;
|
|
193
|
-
};
|
|
194
|
-
$[9] = finalName;
|
|
195
|
-
$[10] = initialName;
|
|
196
|
-
$[11] = props.value;
|
|
193
|
+
if ($[11] !== props.label) {
|
|
194
|
+
t23 = _.isEmpty(props?.label);
|
|
195
|
+
$[11] = props.label;
|
|
197
196
|
$[12] = t23;
|
|
198
197
|
} else {
|
|
199
198
|
t23 = $[12];
|
|
200
199
|
}
|
|
201
|
-
const
|
|
200
|
+
const hasLabel = !t23;
|
|
201
|
+
const hasHintMessages = Boolean(props.hint?.length);
|
|
202
|
+
const hasValidationErrors = Boolean(errors?.length);
|
|
203
|
+
const objectValue = props?.value;
|
|
204
|
+
const receivedInitialValue = _.toString(objectValue?.[initialName]);
|
|
205
|
+
const receivedFinalValue = _.toString(objectValue?.[finalName]);
|
|
206
|
+
const verifyPeriodSelectedIsValid = () => !_.isEmpty(receivedInitialValue) && !_.isEmpty(receivedFinalValue);
|
|
207
|
+
const emitPeriodChange = (inicial, final) => {
|
|
208
|
+
onChange?.({
|
|
209
|
+
target: {
|
|
210
|
+
name: props.name,
|
|
211
|
+
value: {
|
|
212
|
+
[initialName]: returnValueType === "default" ? inicial?.format(isoFormat) : inicial?.toISOString(),
|
|
213
|
+
[finalName]: returnValueType === "default" ? final?.format(isoFormat) : final?.toISOString()
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
});
|
|
217
|
+
};
|
|
202
218
|
let t24;
|
|
203
|
-
if ($[13] !== finalName || $[14] !== handleSetCalendarBoxOpen || $[15] !== initialName || $[16] !==
|
|
219
|
+
if ($[13] !== finalName || $[14] !== handleSetCalendarBoxOpen || $[15] !== initialName || $[16] !== onChange || $[17] !== props.name || $[18] !== setFinalMaskValue || $[19] !== setInitialMaskValue) {
|
|
204
220
|
t24 = () => {
|
|
205
|
-
|
|
221
|
+
onChange?.({
|
|
206
222
|
target: {
|
|
207
223
|
name: props.name,
|
|
208
224
|
value: {
|
|
@@ -219,10 +235,10 @@ const InputBase = React.forwardRef((props, __) => {
|
|
|
219
235
|
$[13] = finalName;
|
|
220
236
|
$[14] = handleSetCalendarBoxOpen;
|
|
221
237
|
$[15] = initialName;
|
|
222
|
-
$[16] =
|
|
223
|
-
$[17] =
|
|
224
|
-
$[18] =
|
|
225
|
-
$[19] =
|
|
238
|
+
$[16] = onChange;
|
|
239
|
+
$[17] = props.name;
|
|
240
|
+
$[18] = setFinalMaskValue;
|
|
241
|
+
$[19] = setInitialMaskValue;
|
|
226
242
|
$[20] = t24;
|
|
227
243
|
} else {
|
|
228
244
|
t24 = $[20];
|
|
@@ -231,363 +247,366 @@ const InputBase = React.forwardRef((props, __) => {
|
|
|
231
247
|
const handleChangeUpdateDateState = (params) => {
|
|
232
248
|
const {
|
|
233
249
|
date: date_1,
|
|
234
|
-
inputType,
|
|
250
|
+
inputType: inputType_0,
|
|
235
251
|
typing
|
|
236
252
|
} = params;
|
|
237
253
|
const rawDate = date_1.clone();
|
|
238
|
-
const
|
|
239
|
-
|
|
254
|
+
const resolveDateRange = (initialDate, finalDate) => {
|
|
255
|
+
if (typing) {
|
|
256
|
+
return {
|
|
257
|
+
inicial: initialDate,
|
|
258
|
+
final: finalDate
|
|
259
|
+
};
|
|
260
|
+
}
|
|
261
|
+
const inicial_0 = initialDate?.isAfter(finalDate) ? finalDate : initialDate;
|
|
262
|
+
const final_0 = initialDate?.isAfter(finalDate) ? initialDate : finalDate;
|
|
263
|
+
return {
|
|
264
|
+
inicial: inicial_0,
|
|
265
|
+
final: final_0
|
|
266
|
+
};
|
|
267
|
+
};
|
|
268
|
+
bb223: switch (inputType_0) {
|
|
240
269
|
case "initial": {
|
|
241
270
|
setSelectedDate((prevSelectedDate_0) => {
|
|
242
271
|
const {
|
|
243
|
-
inicial:
|
|
244
|
-
final:
|
|
245
|
-
} =
|
|
272
|
+
inicial: inicial_3,
|
|
273
|
+
final: final_3
|
|
274
|
+
} = resolveDateRange(rawDate, prevSelectedDate_0.final);
|
|
246
275
|
const updatedState_0 = {
|
|
247
|
-
inicial:
|
|
248
|
-
final:
|
|
276
|
+
inicial: inicial_3,
|
|
277
|
+
final: final_3
|
|
249
278
|
};
|
|
250
279
|
return updatedState_0;
|
|
251
280
|
});
|
|
252
281
|
const {
|
|
253
|
-
inicial:
|
|
254
|
-
final:
|
|
255
|
-
} =
|
|
256
|
-
|
|
257
|
-
target: {
|
|
258
|
-
name: props.name,
|
|
259
|
-
value: {
|
|
260
|
-
[initialName]: returnValueType === "default" ? inicial_3?.format(isoFormat) : inicial_3?.toISOString(),
|
|
261
|
-
[finalName]: returnValueType === "default" ? final_3?.format(isoFormat) : final_3?.toISOString()
|
|
262
|
-
}
|
|
263
|
-
}
|
|
264
|
-
});
|
|
282
|
+
inicial: inicial_4,
|
|
283
|
+
final: final_4
|
|
284
|
+
} = resolveDateRange(rawDate, selectedDate.final);
|
|
285
|
+
emitPeriodChange(inicial_4, final_4);
|
|
265
286
|
requestAnimationFrame(() => {
|
|
266
|
-
if (!typing) {
|
|
287
|
+
if (!typing && !isDateTime) {
|
|
267
288
|
finalInputRef.current?.focus?.();
|
|
268
289
|
}
|
|
269
290
|
});
|
|
270
|
-
break
|
|
291
|
+
break bb223;
|
|
271
292
|
}
|
|
272
293
|
case "final": {
|
|
273
294
|
setSelectedDate((prevSelectedDate) => {
|
|
274
295
|
const {
|
|
275
|
-
inicial:
|
|
276
|
-
final:
|
|
277
|
-
} =
|
|
296
|
+
inicial: inicial_1,
|
|
297
|
+
final: final_1
|
|
298
|
+
} = resolveDateRange(prevSelectedDate.inicial, rawDate);
|
|
278
299
|
const updatedState = {
|
|
279
|
-
inicial:
|
|
280
|
-
final:
|
|
300
|
+
inicial: inicial_1,
|
|
301
|
+
final: final_1
|
|
281
302
|
};
|
|
282
303
|
return updatedState;
|
|
283
304
|
});
|
|
284
305
|
const {
|
|
285
|
-
inicial:
|
|
286
|
-
final:
|
|
287
|
-
} =
|
|
288
|
-
|
|
289
|
-
target: {
|
|
290
|
-
name: props.name,
|
|
291
|
-
value: {
|
|
292
|
-
[initialName]: returnValueType === "default" ? inicial_1?.format(isoFormat) : inicial_1?.toISOString(),
|
|
293
|
-
[finalName]: returnValueType === "default" ? final_1?.format(isoFormat) : final_1?.toISOString()
|
|
294
|
-
}
|
|
295
|
-
}
|
|
296
|
-
});
|
|
306
|
+
inicial: inicial_2,
|
|
307
|
+
final: final_2
|
|
308
|
+
} = resolveDateRange(selectedDate.inicial, rawDate);
|
|
309
|
+
emitPeriodChange(inicial_2, final_2);
|
|
297
310
|
if (shouldCloseCalendarOnSelect) {
|
|
298
311
|
handleSetCalendarBoxOpen(false);
|
|
299
312
|
}
|
|
300
|
-
break
|
|
313
|
+
break bb223;
|
|
301
314
|
}
|
|
302
315
|
}
|
|
303
316
|
handleChangeActiveDescendant(rawDate.format(TOKEN_ISO_FORMAT));
|
|
304
317
|
handleChangeCalendarDisplayDate(rawDate.clone());
|
|
305
318
|
};
|
|
306
319
|
let t25;
|
|
307
|
-
if ($[21] !==
|
|
308
|
-
t25 = (
|
|
309
|
-
const localOnChange = (initialDate_0, finalDate_0) => {
|
|
310
|
-
const valueToUpdate = {
|
|
311
|
-
[initialName]: returnValueType === "default" ? initialDate_0.format(isoFormat) : initialDate_0.toISOString(),
|
|
312
|
-
[finalName]: returnValueType === "default" ? finalDate_0.format(isoFormat) : finalDate_0.toISOString()
|
|
313
|
-
};
|
|
314
|
-
setSelectedDate(() => {
|
|
315
|
-
const updatedState_1 = {
|
|
316
|
-
inicial: initialDate_0.clone(),
|
|
317
|
-
final: finalDate_0.clone()
|
|
318
|
-
};
|
|
319
|
-
return updatedState_1;
|
|
320
|
-
});
|
|
321
|
-
props.onChange?.({
|
|
322
|
-
target: {
|
|
323
|
-
name: props.name,
|
|
324
|
-
value: valueToUpdate
|
|
325
|
-
}
|
|
326
|
-
});
|
|
327
|
-
};
|
|
320
|
+
if ($[21] !== handleChangeActiveDescendant || $[22] !== handleChangeCalendarDisplayDate || $[23] !== setFinalMaskValue || $[24] !== setInitialMaskValue) {
|
|
321
|
+
t25 = (params_0) => {
|
|
328
322
|
const {
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
323
|
+
date: date_2,
|
|
324
|
+
inputType: inputType_1,
|
|
325
|
+
hour,
|
|
326
|
+
minute
|
|
327
|
+
} = params_0;
|
|
328
|
+
setSelectedDate((prevSelectedDate_1) => inputType_1 === "initial" ? {
|
|
329
|
+
...prevSelectedDate_1,
|
|
330
|
+
inicial: date_2.clone()
|
|
331
|
+
} : {
|
|
332
|
+
...prevSelectedDate_1,
|
|
333
|
+
final: date_2.clone()
|
|
334
|
+
});
|
|
335
|
+
const setMaskValue = inputType_1 === "initial" ? setInitialMaskValue : setFinalMaskValue;
|
|
336
|
+
setMaskValue(formatPartialDateTime(date_2, hour, minute));
|
|
337
|
+
handleChangeActiveDescendant(date_2.format(TOKEN_ISO_FORMAT));
|
|
338
|
+
handleChangeCalendarDisplayDate(date_2.clone());
|
|
337
339
|
};
|
|
338
|
-
$[21] =
|
|
339
|
-
$[22] =
|
|
340
|
-
$[23] =
|
|
341
|
-
$[24] =
|
|
342
|
-
$[25] =
|
|
343
|
-
$[26] = minDate;
|
|
344
|
-
$[27] = props;
|
|
345
|
-
$[28] = returnValueType;
|
|
346
|
-
$[29] = setSelectedDate;
|
|
347
|
-
$[30] = shouldCloseCalendarOnSelect;
|
|
348
|
-
$[31] = t25;
|
|
340
|
+
$[21] = handleChangeActiveDescendant;
|
|
341
|
+
$[22] = handleChangeCalendarDisplayDate;
|
|
342
|
+
$[23] = setFinalMaskValue;
|
|
343
|
+
$[24] = setInitialMaskValue;
|
|
344
|
+
$[25] = t25;
|
|
349
345
|
} else {
|
|
350
|
-
t25 = $[
|
|
346
|
+
t25 = $[25];
|
|
351
347
|
}
|
|
352
|
-
const
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
}
|
|
371
|
-
}
|
|
372
|
-
if (inputType_0 === "final") {
|
|
373
|
-
if (event.relatedTarget?.id !== initialInputName) {
|
|
374
|
-
handleSetCalendarBoxOpen(false);
|
|
375
|
-
}
|
|
376
|
-
if (calendarBoxOpen) {
|
|
377
|
-
handleChangeActiveDescendant((selectedDate.final ?? hooks()).format(TOKEN_ISO_FORMAT));
|
|
378
|
-
handleChangeCalendarDisplayDate(selectedDate.final ?? hooks());
|
|
379
|
-
}
|
|
380
|
-
if (_.size(finalUnmaskedValue) !== digits) {
|
|
381
|
-
const date_3 = hooks(selectedDate.final, TOKEN_ISO_FORMAT);
|
|
382
|
-
if (date_3.isValid()) {
|
|
383
|
-
setFinalMaskValue(date_3.format(ptbrFormat));
|
|
384
|
-
}
|
|
348
|
+
const handleUpdateDraftState = t25;
|
|
349
|
+
const handleChangeUpdateDateStateWithPredefinedPeriod = (period) => {
|
|
350
|
+
const localOnChange = (initialDate_0, finalDate_0) => {
|
|
351
|
+
const valueToUpdate = {
|
|
352
|
+
[initialName]: returnValueType === "default" ? initialDate_0.format(isoFormat) : initialDate_0.toISOString(),
|
|
353
|
+
[finalName]: returnValueType === "default" ? finalDate_0.format(isoFormat) : finalDate_0.toISOString()
|
|
354
|
+
};
|
|
355
|
+
setSelectedDate(() => {
|
|
356
|
+
const updatedState_1 = {
|
|
357
|
+
inicial: initialDate_0.clone(),
|
|
358
|
+
final: finalDate_0.clone()
|
|
359
|
+
};
|
|
360
|
+
return updatedState_1;
|
|
361
|
+
});
|
|
362
|
+
onChange?.({
|
|
363
|
+
target: {
|
|
364
|
+
name: props.name,
|
|
365
|
+
value: valueToUpdate
|
|
385
366
|
}
|
|
386
|
-
}
|
|
367
|
+
});
|
|
387
368
|
};
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
369
|
+
const {
|
|
370
|
+
initialDate: initialDate_1,
|
|
371
|
+
finalDate: finalDate_1
|
|
372
|
+
} = getPredefinedPeriodRange(period);
|
|
373
|
+
localOnChange(clampDateToBounds(initialDate_1, minDate, maxDate), clampDateToBounds(finalDate_1, minDate, maxDate));
|
|
374
|
+
finalInputRef?.current?.focus?.();
|
|
375
|
+
if (shouldCloseCalendarOnSelect) {
|
|
376
|
+
handleSetCalendarBoxOpen(false);
|
|
377
|
+
}
|
|
378
|
+
};
|
|
379
|
+
const handleCompleteDraftOnBlur = (inputType_2) => {
|
|
380
|
+
const unmaskedValue = inputType_2 === "initial" ? initialUnmaskedValue : finalUnmaskedValue;
|
|
381
|
+
const completedDate = completePartialDateTime({
|
|
382
|
+
unmaskedValue,
|
|
383
|
+
variant,
|
|
384
|
+
min: minDate,
|
|
385
|
+
max: maxDate
|
|
386
|
+
});
|
|
387
|
+
if (!completedDate) {
|
|
388
|
+
return false;
|
|
389
|
+
}
|
|
390
|
+
const inicial_5 = inputType_2 === "initial" ? completedDate : selectedDate.inicial;
|
|
391
|
+
const final_5 = inputType_2 === "final" ? completedDate : selectedDate.final;
|
|
392
|
+
const isInverted = Boolean(inicial_5 && final_5 && inicial_5.isAfter(final_5));
|
|
393
|
+
const ordered = isInverted ? {
|
|
394
|
+
inicial: final_5,
|
|
395
|
+
final: inicial_5
|
|
396
|
+
} : {
|
|
397
|
+
inicial: inicial_5,
|
|
398
|
+
final: final_5
|
|
399
|
+
};
|
|
400
|
+
setSelectedDate(ordered);
|
|
401
|
+
if (ordered.inicial) {
|
|
402
|
+
setInitialMaskValue(ordered.inicial.format(ptbrFormat));
|
|
403
|
+
}
|
|
404
|
+
if (ordered.final) {
|
|
405
|
+
setFinalMaskValue(ordered.final.format(ptbrFormat));
|
|
406
|
+
}
|
|
407
|
+
emitPeriodChange(ordered.inicial, ordered.final);
|
|
408
|
+
return true;
|
|
409
|
+
};
|
|
410
|
+
const handleOnBlurMaskInput = (event, inputType_3) => {
|
|
411
|
+
props?.onBlur?.(event);
|
|
412
|
+
const isInitialInput = inputType_3 === "initial";
|
|
413
|
+
const siblingInputName = isInitialInput ? finalInputName : initialInputName;
|
|
414
|
+
const currentSelectedDate = isInitialInput ? selectedDate.inicial : selectedDate.final;
|
|
415
|
+
if (event.relatedTarget?.id !== siblingInputName) {
|
|
416
|
+
handleSetCalendarBoxOpen(false);
|
|
417
|
+
}
|
|
418
|
+
if (calendarBoxOpen) {
|
|
419
|
+
handleChangeActiveDescendant((currentSelectedDate ?? hooks()).format(TOKEN_ISO_FORMAT));
|
|
420
|
+
handleChangeCalendarDisplayDate(currentSelectedDate ?? hooks());
|
|
421
|
+
}
|
|
422
|
+
if (handleCompleteDraftOnBlur(inputType_3)) {
|
|
423
|
+
return;
|
|
424
|
+
}
|
|
425
|
+
const unmaskedValue_0 = isInitialInput ? initialUnmaskedValue : finalUnmaskedValue;
|
|
426
|
+
const setMaskValue_0 = isInitialInput ? setInitialMaskValue : setFinalMaskValue;
|
|
427
|
+
if (_.size(unmaskedValue_0) !== digits) {
|
|
428
|
+
const date_3 = hooks(currentSelectedDate, TOKEN_ISO_FORMAT);
|
|
429
|
+
if (date_3.isValid()) {
|
|
430
|
+
setMaskValue_0(date_3.format(ptbrFormat));
|
|
431
|
+
}
|
|
432
|
+
}
|
|
433
|
+
handleReorderPeriodOnBlur();
|
|
434
|
+
};
|
|
435
|
+
const handleReorderPeriodOnBlur = () => {
|
|
436
|
+
const {
|
|
437
|
+
inicial: inicial_6,
|
|
438
|
+
final: final_6
|
|
439
|
+
} = selectedDate;
|
|
440
|
+
if (!inicial_6 || !final_6 || !inicial_6.isAfter(final_6)) {
|
|
441
|
+
return;
|
|
442
|
+
}
|
|
443
|
+
setSelectedDate({
|
|
444
|
+
inicial: final_6,
|
|
445
|
+
final: inicial_6
|
|
446
|
+
});
|
|
447
|
+
setInitialMaskValue(final_6.format(ptbrFormat));
|
|
448
|
+
setFinalMaskValue(inicial_6.format(ptbrFormat));
|
|
449
|
+
emitPeriodChange(final_6, inicial_6);
|
|
450
|
+
};
|
|
451
|
+
let t26;
|
|
452
|
+
if ($[26] !== calendarBoxOpen || $[27] !== handleChangeActiveDescendant || $[28] !== handleChangeCalendarDisplayDate || $[29] !== handleSetCalendarBoxOpen || $[30] !== openCalendarOnFocus || $[31] !== props || $[32] !== readOnly || $[33] !== selectedDate.final || $[34] !== selectedDate.inicial) {
|
|
453
|
+
t26 = (event_0, inputType_4) => {
|
|
411
454
|
props?.onFocus?.(event_0);
|
|
412
455
|
if (!readOnly && !calendarBoxOpen && openCalendarOnFocus) {
|
|
413
456
|
handleSetCalendarBoxOpen(true);
|
|
414
457
|
}
|
|
415
|
-
setActiveInputType(
|
|
416
|
-
if (
|
|
458
|
+
setActiveInputType(inputType_4);
|
|
459
|
+
if (inputType_4 === "initial") {
|
|
417
460
|
handleChangeActiveDescendant((selectedDate.inicial ?? hooks()).format(TOKEN_ISO_FORMAT));
|
|
418
461
|
handleChangeCalendarDisplayDate(selectedDate.inicial ?? hooks());
|
|
419
462
|
}
|
|
420
|
-
if (
|
|
463
|
+
if (inputType_4 === "final") {
|
|
421
464
|
handleChangeActiveDescendant((selectedDate.final ?? hooks()).format(TOKEN_ISO_FORMAT));
|
|
422
465
|
handleChangeCalendarDisplayDate(selectedDate.final ?? hooks());
|
|
423
466
|
}
|
|
424
467
|
};
|
|
425
|
-
$[
|
|
426
|
-
$[
|
|
427
|
-
$[
|
|
428
|
-
$[
|
|
429
|
-
$[
|
|
430
|
-
$[
|
|
431
|
-
$[
|
|
432
|
-
$[
|
|
433
|
-
$[
|
|
434
|
-
$[
|
|
435
|
-
$[58] = t27;
|
|
468
|
+
$[26] = calendarBoxOpen;
|
|
469
|
+
$[27] = handleChangeActiveDescendant;
|
|
470
|
+
$[28] = handleChangeCalendarDisplayDate;
|
|
471
|
+
$[29] = handleSetCalendarBoxOpen;
|
|
472
|
+
$[30] = openCalendarOnFocus;
|
|
473
|
+
$[31] = props;
|
|
474
|
+
$[32] = readOnly;
|
|
475
|
+
$[33] = selectedDate.final;
|
|
476
|
+
$[34] = selectedDate.inicial;
|
|
477
|
+
$[35] = t26;
|
|
436
478
|
} else {
|
|
437
|
-
|
|
479
|
+
t26 = $[35];
|
|
438
480
|
}
|
|
439
|
-
const handleOnFocusMaskInput =
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
481
|
+
const handleOnFocusMaskInput = t26;
|
|
482
|
+
const handleOnKeyDownMaskInput = (event_1, inputType_5) => {
|
|
483
|
+
props?.onKeyDown?.(event_1);
|
|
484
|
+
if (calendarBoxOpen && event_1.key && !event_1.shiftKey && !event_1.altKey && event_1.key === Keys.enter) {
|
|
485
|
+
event_1.preventDefault();
|
|
486
|
+
handleSelectDay(hooks(_.toString(activeDescendant), TOKEN_ISO_FORMAT), inputType_5);
|
|
487
|
+
}
|
|
488
|
+
};
|
|
489
|
+
const getDayState = (day) => {
|
|
490
|
+
const {
|
|
491
|
+
inicial: inicial_7,
|
|
492
|
+
final: final_7
|
|
493
|
+
} = selectedDate;
|
|
494
|
+
return {
|
|
495
|
+
isSelected: Boolean(inicial_7 && day.isSame(inicial_7, "day") || final_7 && day.isSame(final_7, "day")),
|
|
496
|
+
isInRange: Boolean(inicial_7 && final_7 && day.isAfter(inicial_7, "day") && day.isBefore(final_7, "day")),
|
|
497
|
+
...hasBounds && {
|
|
498
|
+
isDisabled: isDayOutOfBounds(day, minDate, maxDate)
|
|
449
499
|
}
|
|
450
500
|
};
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
...hasBounds && {
|
|
462
|
-
isDisabled: isDayOutOfBounds(day, minDate, maxDate)
|
|
463
|
-
}
|
|
464
|
-
};
|
|
465
|
-
};
|
|
466
|
-
$[73] = hasBounds;
|
|
467
|
-
$[74] = maxDate;
|
|
468
|
-
$[75] = minDate;
|
|
469
|
-
$[76] = selectedDate;
|
|
470
|
-
$[77] = t282;
|
|
471
|
-
} else {
|
|
472
|
-
t282 = $[77];
|
|
473
|
-
}
|
|
474
|
-
getDayState = t282;
|
|
475
|
-
let t292;
|
|
476
|
-
if ($[78] !== finalInputName || $[79] !== initialInputName) {
|
|
477
|
-
t292 = () => {
|
|
478
|
-
const focusedInputId = document.activeElement?.id;
|
|
479
|
-
if (focusedInputId === initialInputName) {
|
|
480
|
-
return "initial";
|
|
481
|
-
}
|
|
482
|
-
if (focusedInputId === finalInputName) {
|
|
483
|
-
return "final";
|
|
484
|
-
}
|
|
485
|
-
};
|
|
486
|
-
$[78] = finalInputName;
|
|
487
|
-
$[79] = initialInputName;
|
|
488
|
-
$[80] = t292;
|
|
489
|
-
} else {
|
|
490
|
-
t292 = $[80];
|
|
491
|
-
}
|
|
492
|
-
const resolveInputTypeFromFocus = t292;
|
|
493
|
-
handleSelectDay = (daySelected, targetInputType) => {
|
|
494
|
-
const inputType_3 = targetInputType ?? resolveInputTypeFromFocus();
|
|
495
|
-
if (_.isUndefined(inputType_3)) {
|
|
496
|
-
return;
|
|
501
|
+
};
|
|
502
|
+
let t27;
|
|
503
|
+
if ($[36] !== finalInputName || $[37] !== initialInputName) {
|
|
504
|
+
t27 = () => {
|
|
505
|
+
const focusedInputId = document.activeElement?.id;
|
|
506
|
+
if (focusedInputId === initialInputName) {
|
|
507
|
+
return "initial";
|
|
508
|
+
}
|
|
509
|
+
if (focusedInputId === finalInputName) {
|
|
510
|
+
return "final";
|
|
497
511
|
}
|
|
498
|
-
const current = inputType_3 === "initial" ? selectedDate.inicial : selectedDate.final;
|
|
499
|
-
const dayWithTime = isDateTime && current ? daySelected.clone().hour(current.hour()).minute(current.minute()) : daySelected;
|
|
500
|
-
handleChangeUpdateDateState({
|
|
501
|
-
date: clampDateToBounds(dayWithTime, minDate, maxDate),
|
|
502
|
-
inputType: inputType_3
|
|
503
|
-
});
|
|
504
512
|
};
|
|
505
|
-
$[
|
|
506
|
-
$[
|
|
507
|
-
$[
|
|
508
|
-
$[62] = handleChangeUpdateDateState;
|
|
509
|
-
$[63] = hasBounds;
|
|
510
|
-
$[64] = initialInputName;
|
|
511
|
-
$[65] = isDateTime;
|
|
512
|
-
$[66] = maxDate;
|
|
513
|
-
$[67] = minDate;
|
|
514
|
-
$[68] = props;
|
|
515
|
-
$[69] = selectedDate;
|
|
516
|
-
$[70] = getDayState;
|
|
517
|
-
$[71] = handleOnKeyDownMaskInput;
|
|
518
|
-
$[72] = handleSelectDay;
|
|
513
|
+
$[36] = finalInputName;
|
|
514
|
+
$[37] = initialInputName;
|
|
515
|
+
$[38] = t27;
|
|
519
516
|
} else {
|
|
520
|
-
|
|
521
|
-
handleOnKeyDownMaskInput = $[71];
|
|
522
|
-
handleSelectDay = $[72];
|
|
517
|
+
t27 = $[38];
|
|
523
518
|
}
|
|
519
|
+
const resolveInputTypeFromFocus = t27;
|
|
520
|
+
const handleSelectDay = (daySelected, targetInputType) => {
|
|
521
|
+
const inputType_6 = targetInputType ?? resolveInputTypeFromFocus();
|
|
522
|
+
if (_.isUndefined(inputType_6)) {
|
|
523
|
+
return;
|
|
524
|
+
}
|
|
525
|
+
const {
|
|
526
|
+
hour: hour_0,
|
|
527
|
+
minute: minute_0,
|
|
528
|
+
isComplete
|
|
529
|
+
} = timeSelectionOf(inputType_6);
|
|
530
|
+
if (isDateTime && !isComplete) {
|
|
531
|
+
handleUpdateDraftState({
|
|
532
|
+
date: daySelected.clone().hour(hour_0 ?? 0).minute(minute_0 ?? 0),
|
|
533
|
+
inputType: inputType_6,
|
|
534
|
+
hour: hour_0,
|
|
535
|
+
minute: minute_0
|
|
536
|
+
});
|
|
537
|
+
return;
|
|
538
|
+
}
|
|
539
|
+
const current = inputType_6 === "initial" ? selectedDate.inicial : selectedDate.final;
|
|
540
|
+
const dayWithTime = isDateTime && current ? daySelected.clone().hour(current.hour()).minute(current.minute()) : daySelected;
|
|
541
|
+
handleChangeUpdateDateState({
|
|
542
|
+
date: clampDateToBounds(dayWithTime, minDate, maxDate),
|
|
543
|
+
inputType: inputType_6
|
|
544
|
+
});
|
|
545
|
+
};
|
|
524
546
|
const activeSelectedDate = activeInputType === "initial" ? selectedDate.inicial : selectedDate.final;
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
547
|
+
const handleSelectHour = (hour_1) => {
|
|
548
|
+
if (!activeSelectedDate) {
|
|
549
|
+
return;
|
|
550
|
+
}
|
|
551
|
+
const {
|
|
552
|
+
minute: minute_1
|
|
553
|
+
} = activeTimeSelection;
|
|
554
|
+
if (_.isNull(minute_1)) {
|
|
555
|
+
handleUpdateDraftState({
|
|
556
|
+
date: activeSelectedDate.clone().hour(hour_1),
|
|
533
557
|
inputType: activeInputType,
|
|
534
|
-
|
|
558
|
+
hour: hour_1,
|
|
559
|
+
minute: null
|
|
535
560
|
});
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
}
|
|
544
|
-
const
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
}
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
const t32 = Boolean(readOnly);
|
|
583
|
-
const t33 = Boolean(disabled);
|
|
584
|
-
const t34 = verifyPeriodSelectedIsValid();
|
|
585
|
-
let t35;
|
|
586
|
-
if ($[96] !== calendarState || $[97] !== finalInputName || $[98] !== handleChangeUpdateDateState || $[99] !== handleChangeUpdateDateStateWithPredefinedPeriod || $[100] !== handleOnClickClearSelectedPeriod || $[101] !== hasValidationErrors || $[102] !== initialInputName || $[103] !== initialInputRef || $[104] !== maxDate || $[105] !== minDate || $[106] !== openCalendarOnFocus || $[107] !== selectedDate || $[108] !== showCalendarButton || $[109] !== showClearDateButton || $[110] !== showPredefinedPeriodsButton || $[111] !== skeletonize || $[112] !== t32 || $[113] !== t33 || $[114] !== t34 || $[115] !== undigitable) {
|
|
587
|
-
t35 = {
|
|
561
|
+
return;
|
|
562
|
+
}
|
|
563
|
+
handleChangeUpdateDateState({
|
|
564
|
+
date: activeSelectedDate.clone().hour(hour_1).minute(minute_1).second(0),
|
|
565
|
+
inputType: activeInputType,
|
|
566
|
+
typing: true
|
|
567
|
+
});
|
|
568
|
+
};
|
|
569
|
+
const handleSelectMinute = (minute_2) => {
|
|
570
|
+
if (!activeSelectedDate) {
|
|
571
|
+
return;
|
|
572
|
+
}
|
|
573
|
+
const {
|
|
574
|
+
hour: hour_2
|
|
575
|
+
} = activeTimeSelection;
|
|
576
|
+
handleChangeUpdateDateState({
|
|
577
|
+
date: _.isNull(hour_2) ? resolveAssumedTime({
|
|
578
|
+
date: activeSelectedDate,
|
|
579
|
+
hour: null,
|
|
580
|
+
minute: minute_2,
|
|
581
|
+
min: minDate,
|
|
582
|
+
max: maxDate
|
|
583
|
+
}) : activeSelectedDate.clone().hour(hour_2).minute(minute_2).second(0),
|
|
584
|
+
inputType: activeInputType,
|
|
585
|
+
typing: true
|
|
586
|
+
});
|
|
587
|
+
};
|
|
588
|
+
React.useEffect(() => {
|
|
589
|
+
if (props?.value) {
|
|
590
|
+
const initialDate_2 = parseDateValue(receivedInitialValue, variant);
|
|
591
|
+
const finalDate_2 = parseDateValue(receivedFinalValue, variant);
|
|
592
|
+
setSelectedDate(() => ({
|
|
593
|
+
inicial: initialDate_2.isValid() ? initialDate_2 : null,
|
|
594
|
+
final: finalDate_2.isValid() ? finalDate_2 : null
|
|
595
|
+
}));
|
|
596
|
+
setInitialMaskValue(initialDate_2.format(ptbrFormat));
|
|
597
|
+
setFinalMaskValue(finalDate_2.format(ptbrFormat));
|
|
598
|
+
}
|
|
599
|
+
}, [receivedInitialValue, receivedFinalValue]);
|
|
600
|
+
const t28 = Boolean(readOnly);
|
|
601
|
+
const t29 = Boolean(disabled);
|
|
602
|
+
const t30 = handleChangeUpdateDateState;
|
|
603
|
+
const t31 = verifyPeriodSelectedIsValid();
|
|
604
|
+
let t32;
|
|
605
|
+
if ($[39] !== calendarState || $[40] !== finalInputName || $[41] !== finalInputRef || $[42] !== handleChangeUpdateDateStateWithPredefinedPeriod || $[43] !== handleOnClickClearSelectedPeriod || $[44] !== hasValidationErrors || $[45] !== initialInputName || $[46] !== initialInputRef || $[47] !== maxDate || $[48] !== minDate || $[49] !== openCalendarOnFocus || $[50] !== selectedDate || $[51] !== showCalendarButton || $[52] !== showClearDateButton || $[53] !== showPredefinedPeriodsButton || $[54] !== skeletonize || $[55] !== t28 || $[56] !== t29 || $[57] !== t30 || $[58] !== t31 || $[59] !== undigitable) {
|
|
606
|
+
t32 = {
|
|
588
607
|
...calendarState,
|
|
589
|
-
isReadOnly:
|
|
590
|
-
isDisabled:
|
|
608
|
+
isReadOnly: t28,
|
|
609
|
+
isDisabled: t29,
|
|
591
610
|
undigitable,
|
|
592
611
|
skeletonize,
|
|
593
612
|
selectedDate,
|
|
@@ -602,248 +621,253 @@ const InputBase = React.forwardRef((props, __) => {
|
|
|
602
621
|
openCalendarOnFocus,
|
|
603
622
|
showPredefinedPeriodsButton,
|
|
604
623
|
showClearDateButton,
|
|
605
|
-
handleChangeUpdateDateState,
|
|
624
|
+
handleChangeUpdateDateState: t30,
|
|
606
625
|
handleOnClickClearSelectedPeriod,
|
|
607
626
|
handleChangeUpdateDateStateWithPredefinedPeriod,
|
|
608
|
-
hasValidPeriodSelected:
|
|
627
|
+
hasValidPeriodSelected: t31
|
|
609
628
|
};
|
|
610
|
-
$[
|
|
611
|
-
$[
|
|
612
|
-
$[
|
|
613
|
-
$[
|
|
614
|
-
$[
|
|
615
|
-
$[
|
|
616
|
-
$[
|
|
617
|
-
$[
|
|
618
|
-
$[
|
|
619
|
-
$[
|
|
620
|
-
$[
|
|
621
|
-
$[
|
|
622
|
-
$[
|
|
623
|
-
$[
|
|
624
|
-
$[
|
|
625
|
-
$[
|
|
626
|
-
$[
|
|
627
|
-
$[
|
|
628
|
-
$[
|
|
629
|
-
$[
|
|
630
|
-
$[
|
|
629
|
+
$[39] = calendarState;
|
|
630
|
+
$[40] = finalInputName;
|
|
631
|
+
$[41] = finalInputRef;
|
|
632
|
+
$[42] = handleChangeUpdateDateStateWithPredefinedPeriod;
|
|
633
|
+
$[43] = handleOnClickClearSelectedPeriod;
|
|
634
|
+
$[44] = hasValidationErrors;
|
|
635
|
+
$[45] = initialInputName;
|
|
636
|
+
$[46] = initialInputRef;
|
|
637
|
+
$[47] = maxDate;
|
|
638
|
+
$[48] = minDate;
|
|
639
|
+
$[49] = openCalendarOnFocus;
|
|
640
|
+
$[50] = selectedDate;
|
|
641
|
+
$[51] = showCalendarButton;
|
|
642
|
+
$[52] = showClearDateButton;
|
|
643
|
+
$[53] = showPredefinedPeriodsButton;
|
|
644
|
+
$[54] = skeletonize;
|
|
645
|
+
$[55] = t28;
|
|
646
|
+
$[56] = t29;
|
|
647
|
+
$[57] = t30;
|
|
648
|
+
$[58] = t31;
|
|
649
|
+
$[59] = undigitable;
|
|
650
|
+
$[60] = t32;
|
|
651
|
+
} else {
|
|
652
|
+
t32 = $[60];
|
|
653
|
+
}
|
|
654
|
+
const contextValues = t32;
|
|
655
|
+
let t33;
|
|
656
|
+
if ($[61] !== customClassLabel || $[62] !== disabled || $[63] !== hasHintMessages || $[64] !== hasLabel || $[65] !== hintPosition || $[66] !== initialInputName || $[67] !== label || $[68] !== labelUppercase || $[69] !== popoverAlign || $[70] !== props.hint || $[71] !== props.required || $[72] !== readOnly || $[73] !== skeletonize || $[74] !== themePopover) {
|
|
657
|
+
t33 = hasLabel && /* @__PURE__ */ jsx(Label, { "data-testid": "test-date-period-field-label", label, inputId: initialInputName, hint: props?.hint, isDisabled: disabled, isReadOnly: readOnly, skeletonize, required: props?.required, hintPosition, themePopover, popoverAlign, labelUppercase, hasHintMessages, customClassLabel });
|
|
658
|
+
$[61] = customClassLabel;
|
|
659
|
+
$[62] = disabled;
|
|
660
|
+
$[63] = hasHintMessages;
|
|
661
|
+
$[64] = hasLabel;
|
|
662
|
+
$[65] = hintPosition;
|
|
663
|
+
$[66] = initialInputName;
|
|
664
|
+
$[67] = label;
|
|
665
|
+
$[68] = labelUppercase;
|
|
666
|
+
$[69] = popoverAlign;
|
|
667
|
+
$[70] = props.hint;
|
|
668
|
+
$[71] = props.required;
|
|
669
|
+
$[72] = readOnly;
|
|
670
|
+
$[73] = skeletonize;
|
|
671
|
+
$[74] = themePopover;
|
|
672
|
+
$[75] = t33;
|
|
631
673
|
} else {
|
|
632
|
-
|
|
674
|
+
t33 = $[75];
|
|
633
675
|
}
|
|
634
|
-
const
|
|
676
|
+
const t34 = _.omit(rest, ["initialRef", "finalRef"]);
|
|
677
|
+
const t35 = props?.initialRef;
|
|
635
678
|
let t36;
|
|
636
|
-
if ($[
|
|
637
|
-
t36 =
|
|
638
|
-
$[
|
|
639
|
-
$[
|
|
640
|
-
$[
|
|
641
|
-
|
|
642
|
-
$[
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
$[
|
|
648
|
-
$[
|
|
649
|
-
|
|
650
|
-
$[
|
|
651
|
-
|
|
652
|
-
|
|
679
|
+
if ($[76] !== initialInputRef || $[77] !== t35) {
|
|
680
|
+
t36 = mergeRefs(initialInputRef, t35);
|
|
681
|
+
$[76] = initialInputRef;
|
|
682
|
+
$[77] = t35;
|
|
683
|
+
$[78] = t36;
|
|
684
|
+
} else {
|
|
685
|
+
t36 = $[78];
|
|
686
|
+
}
|
|
687
|
+
let t37;
|
|
688
|
+
if ($[79] !== handleOnBlurMaskInput) {
|
|
689
|
+
t37 = (event_2) => handleOnBlurMaskInput(event_2, "initial");
|
|
690
|
+
$[79] = handleOnBlurMaskInput;
|
|
691
|
+
$[80] = t37;
|
|
692
|
+
} else {
|
|
693
|
+
t37 = $[80];
|
|
694
|
+
}
|
|
695
|
+
let t38;
|
|
696
|
+
if ($[81] !== handleOnFocusMaskInput) {
|
|
697
|
+
t38 = (event_3) => handleOnFocusMaskInput(event_3, "initial");
|
|
698
|
+
$[81] = handleOnFocusMaskInput;
|
|
699
|
+
$[82] = t38;
|
|
653
700
|
} else {
|
|
654
|
-
|
|
701
|
+
t38 = $[82];
|
|
655
702
|
}
|
|
656
|
-
const t37 = _.omit(rest, ["initialRef", "finalRef"]);
|
|
657
|
-
const t38 = props?.initialRef;
|
|
658
703
|
let t39;
|
|
659
|
-
if ($[
|
|
660
|
-
t39 =
|
|
661
|
-
$[
|
|
662
|
-
$[
|
|
663
|
-
$[134] = t39;
|
|
704
|
+
if ($[83] !== handleOnKeyDownMaskInput) {
|
|
705
|
+
t39 = (event_4) => handleOnKeyDownMaskInput(event_4, "initial");
|
|
706
|
+
$[83] = handleOnKeyDownMaskInput;
|
|
707
|
+
$[84] = t39;
|
|
664
708
|
} else {
|
|
665
|
-
t39 = $[
|
|
709
|
+
t39 = $[84];
|
|
666
710
|
}
|
|
667
711
|
let t40;
|
|
668
|
-
if ($[
|
|
669
|
-
t40 =
|
|
670
|
-
$[
|
|
671
|
-
$[136] = t40;
|
|
712
|
+
if ($[85] === Symbol.for("react.memo_cache_sentinel")) {
|
|
713
|
+
t40 = /* @__PURE__ */ jsx(Icon, { name: "arrow_right", size: 10 });
|
|
714
|
+
$[85] = t40;
|
|
672
715
|
} else {
|
|
673
|
-
t40 = $[
|
|
716
|
+
t40 = $[85];
|
|
674
717
|
}
|
|
675
718
|
let t41;
|
|
676
|
-
if ($[
|
|
677
|
-
t41 =
|
|
678
|
-
$[
|
|
679
|
-
$[
|
|
719
|
+
if ($[86] !== disabled || $[87] !== readOnly) {
|
|
720
|
+
t41 = /* @__PURE__ */ jsx("span", { className: "separator", "data-state-disabled": disabled, "data-state-read-only": readOnly, onMouseDown: _temp2, children: t40 });
|
|
721
|
+
$[86] = disabled;
|
|
722
|
+
$[87] = readOnly;
|
|
723
|
+
$[88] = t41;
|
|
680
724
|
} else {
|
|
681
|
-
t41 = $[
|
|
725
|
+
t41 = $[88];
|
|
682
726
|
}
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
727
|
+
const t42 = inputs2_date_base_index;
|
|
728
|
+
const t43 = _.omit(rest, ["initialRef", "finalRef"]);
|
|
729
|
+
const t44 = props?.finalRef;
|
|
730
|
+
let t45;
|
|
731
|
+
if ($[89] !== finalInputRef || $[90] !== t44) {
|
|
732
|
+
t45 = mergeRefs(finalInputRef, t44);
|
|
733
|
+
$[89] = finalInputRef;
|
|
734
|
+
$[90] = t44;
|
|
735
|
+
$[91] = t45;
|
|
688
736
|
} else {
|
|
689
|
-
|
|
737
|
+
t45 = $[91];
|
|
690
738
|
}
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
739
|
+
const t46 = !readOnly && !skeletonize ? 0 : -1;
|
|
740
|
+
let t47;
|
|
741
|
+
if ($[92] !== handleOnBlurMaskInput) {
|
|
742
|
+
t47 = (event_6) => handleOnBlurMaskInput(event_6, "final");
|
|
743
|
+
$[92] = handleOnBlurMaskInput;
|
|
744
|
+
$[93] = t47;
|
|
695
745
|
} else {
|
|
696
|
-
|
|
746
|
+
t47 = $[93];
|
|
697
747
|
}
|
|
698
|
-
let
|
|
699
|
-
if ($[
|
|
700
|
-
|
|
701
|
-
$[
|
|
702
|
-
$[
|
|
703
|
-
$[144] = t44;
|
|
748
|
+
let t48;
|
|
749
|
+
if ($[94] !== handleOnFocusMaskInput) {
|
|
750
|
+
t48 = (event_7) => handleOnFocusMaskInput(event_7, "final");
|
|
751
|
+
$[94] = handleOnFocusMaskInput;
|
|
752
|
+
$[95] = t48;
|
|
704
753
|
} else {
|
|
705
|
-
|
|
754
|
+
t48 = $[95];
|
|
706
755
|
}
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
t48 = mergeRefs(finalInputRef, t47);
|
|
713
|
-
$[145] = t47;
|
|
714
|
-
$[146] = t48;
|
|
756
|
+
let t49;
|
|
757
|
+
if ($[96] !== handleOnKeyDownMaskInput) {
|
|
758
|
+
t49 = (event_8) => handleOnKeyDownMaskInput(event_8, "final");
|
|
759
|
+
$[96] = handleOnKeyDownMaskInput;
|
|
760
|
+
$[97] = t49;
|
|
715
761
|
} else {
|
|
716
|
-
|
|
762
|
+
t49 = $[97];
|
|
717
763
|
}
|
|
718
|
-
const t49 = !readOnly && !skeletonize ? 0 : -1;
|
|
719
764
|
let t50;
|
|
720
|
-
if ($[
|
|
721
|
-
t50 =
|
|
722
|
-
$[
|
|
723
|
-
$[
|
|
765
|
+
if ($[98] !== activeDescendant || $[99] !== calendarBoxOpen || $[100] !== customClass || $[101] !== disabled || $[102] !== finalInputName || $[103] !== finalMaskedValue || $[104] !== handleFinalKeyDownCapture || $[105] !== handleOnBeforeInput || $[106] !== handleOnPaste || $[107] !== hasValidationErrors || $[108] !== inputPlaceholder || $[109] !== readOnly || $[110] !== skeletonize || $[111] !== t42.Input || $[112] !== t43 || $[113] !== t45 || $[114] !== t46 || $[115] !== t47 || $[116] !== t48 || $[117] !== t49 || $[118] !== textAlign || $[119] !== undigitable) {
|
|
766
|
+
t50 = /* @__PURE__ */ jsx(t42.Input, { ...t43, ref: t45, id: finalInputName, name: finalInputName, value: finalMaskedValue, readOnly, disabled, customClass, tabIndex: t46, placeholder: inputPlaceholder, "aria-autocomplete": "list", "aria-activedescendant": activeDescendant, "aria-expanded": calendarBoxOpen, "aria-controls": finalInputName, "aria-labelledby": finalInputName, "data-testid": "test-date-period-field-final-input", "data-state-is-period-input": true, "data-state-error": hasValidationErrors, "data-state-read-only": readOnly, "data-state-text-align": textAlign, "data-state-undigitable": undigitable, "data-state-skeletonize": skeletonize, onPaste: handleOnPaste, onBeforeInput: handleOnBeforeInput, onBlur: t47, onFocus: t48, onKeyDown: t49, onKeyDownCapture: handleFinalKeyDownCapture });
|
|
767
|
+
$[98] = activeDescendant;
|
|
768
|
+
$[99] = calendarBoxOpen;
|
|
769
|
+
$[100] = customClass;
|
|
770
|
+
$[101] = disabled;
|
|
771
|
+
$[102] = finalInputName;
|
|
772
|
+
$[103] = finalMaskedValue;
|
|
773
|
+
$[104] = handleFinalKeyDownCapture;
|
|
774
|
+
$[105] = handleOnBeforeInput;
|
|
775
|
+
$[106] = handleOnPaste;
|
|
776
|
+
$[107] = hasValidationErrors;
|
|
777
|
+
$[108] = inputPlaceholder;
|
|
778
|
+
$[109] = readOnly;
|
|
779
|
+
$[110] = skeletonize;
|
|
780
|
+
$[111] = t42.Input;
|
|
781
|
+
$[112] = t43;
|
|
782
|
+
$[113] = t45;
|
|
783
|
+
$[114] = t46;
|
|
784
|
+
$[115] = t47;
|
|
785
|
+
$[116] = t48;
|
|
786
|
+
$[117] = t49;
|
|
787
|
+
$[118] = textAlign;
|
|
788
|
+
$[119] = undigitable;
|
|
789
|
+
$[120] = t50;
|
|
724
790
|
} else {
|
|
725
|
-
t50 = $[
|
|
791
|
+
t50 = $[120];
|
|
726
792
|
}
|
|
727
793
|
let t51;
|
|
728
|
-
if ($[
|
|
729
|
-
t51 =
|
|
730
|
-
$[
|
|
731
|
-
$[150] = t51;
|
|
794
|
+
if ($[121] === Symbol.for("react.memo_cache_sentinel")) {
|
|
795
|
+
t51 = /* @__PURE__ */ jsx(Triggers, {});
|
|
796
|
+
$[121] = t51;
|
|
732
797
|
} else {
|
|
733
|
-
t51 = $[
|
|
798
|
+
t51 = $[121];
|
|
734
799
|
}
|
|
735
800
|
let t52;
|
|
736
|
-
if ($[
|
|
737
|
-
t52 = (
|
|
738
|
-
$[
|
|
739
|
-
$[
|
|
801
|
+
if ($[122] !== activeDescendant || $[123] !== activeSelectedDate || $[124] !== activeTimeSelection || $[125] !== calendarBoxOpen || $[126] !== calendarDisplayDate || $[127] !== calendarRef || $[128] !== dateContainerRef || $[129] !== getDayState || $[130] !== handleNextMonth || $[131] !== handlePreviousMonth || $[132] !== handleSelectDay || $[133] !== handleSelectHour || $[134] !== handleSelectMinute || $[135] !== initialInputName || $[136] !== isDateTime || $[137] !== maxDate || $[138] !== minDate) {
|
|
802
|
+
t52 = calendarBoxOpen && createPortal(/* @__PURE__ */ jsx(CalendarBox, { ref: calendarRef, testIdPrefix: "test-date-period-field", headerId: initialInputName, calendarBoxOpen, activeDescendant, calendarDisplayDate, containerRef: dateContainerRef, onNextMonth: handleNextMonth, onPreviousMonth: handlePreviousMonth, getDayState, onSelectDay: handleSelectDay, children: isDateTime && /* @__PURE__ */ jsx(TimeSelector, { value: activeSelectedDate, selectedHour: activeTimeSelection.hour, selectedMinute: activeTimeSelection.minute, onSelectHour: handleSelectHour, onSelectMinute: handleSelectMinute, min: minDate, max: maxDate, testIdPrefix: "test-date-period-field" }) }), document.body);
|
|
803
|
+
$[122] = activeDescendant;
|
|
804
|
+
$[123] = activeSelectedDate;
|
|
805
|
+
$[124] = activeTimeSelection;
|
|
806
|
+
$[125] = calendarBoxOpen;
|
|
807
|
+
$[126] = calendarDisplayDate;
|
|
808
|
+
$[127] = calendarRef;
|
|
809
|
+
$[128] = dateContainerRef;
|
|
810
|
+
$[129] = getDayState;
|
|
811
|
+
$[130] = handleNextMonth;
|
|
812
|
+
$[131] = handlePreviousMonth;
|
|
813
|
+
$[132] = handleSelectDay;
|
|
814
|
+
$[133] = handleSelectHour;
|
|
815
|
+
$[134] = handleSelectMinute;
|
|
816
|
+
$[135] = initialInputName;
|
|
817
|
+
$[136] = isDateTime;
|
|
818
|
+
$[137] = maxDate;
|
|
819
|
+
$[138] = minDate;
|
|
820
|
+
$[139] = t52;
|
|
740
821
|
} else {
|
|
741
|
-
t52 = $[
|
|
822
|
+
t52 = $[139];
|
|
742
823
|
}
|
|
743
824
|
let t53;
|
|
744
|
-
if ($[
|
|
745
|
-
t53 = /* @__PURE__ */ jsx(
|
|
746
|
-
$[
|
|
747
|
-
$[
|
|
748
|
-
$[
|
|
749
|
-
$[
|
|
750
|
-
$[
|
|
751
|
-
$[
|
|
752
|
-
$[159] = handleOnBeforeInput;
|
|
753
|
-
$[160] = handleOnPaste;
|
|
754
|
-
$[161] = hasValidationErrors;
|
|
755
|
-
$[162] = inputPlaceholder;
|
|
756
|
-
$[163] = readOnly;
|
|
757
|
-
$[164] = skeletonize;
|
|
758
|
-
$[165] = t45.Input;
|
|
759
|
-
$[166] = t46;
|
|
760
|
-
$[167] = t48;
|
|
761
|
-
$[168] = t49;
|
|
762
|
-
$[169] = t50;
|
|
763
|
-
$[170] = t51;
|
|
764
|
-
$[171] = t52;
|
|
765
|
-
$[172] = textAlign;
|
|
766
|
-
$[173] = undigitable;
|
|
767
|
-
$[174] = t53;
|
|
825
|
+
if ($[140] !== disabled || $[141] !== hasHintMessages || $[142] !== hintPosition || $[143] !== props.hint || $[144] !== skeletonize) {
|
|
826
|
+
t53 = hintPosition === "below" && /* @__PURE__ */ jsx(Hint, { customClass: "hint", description: props.hint, disabled, skeletonize, visible: hasHintMessages });
|
|
827
|
+
$[140] = disabled;
|
|
828
|
+
$[141] = hasHintMessages;
|
|
829
|
+
$[142] = hintPosition;
|
|
830
|
+
$[143] = props.hint;
|
|
831
|
+
$[144] = skeletonize;
|
|
832
|
+
$[145] = t53;
|
|
768
833
|
} else {
|
|
769
|
-
t53 = $[
|
|
834
|
+
t53 = $[145];
|
|
770
835
|
}
|
|
771
836
|
let t54;
|
|
772
|
-
if ($[
|
|
773
|
-
t54 = /* @__PURE__ */ jsx(
|
|
774
|
-
$[
|
|
837
|
+
if ($[146] !== errors || $[147] !== hasValidationErrors || $[148] !== label || $[149] !== skeletonize) {
|
|
838
|
+
t54 = hasValidationErrors && /* @__PURE__ */ jsx("span", { "data-testid": "test-date-period-field-list-errors", className: "error", "data-state-skeletonize": skeletonize, "aria-describedby": String(label).concat("-errors"), children: errors?.map(_temp3) });
|
|
839
|
+
$[146] = errors;
|
|
840
|
+
$[147] = hasValidationErrors;
|
|
841
|
+
$[148] = label;
|
|
842
|
+
$[149] = skeletonize;
|
|
843
|
+
$[150] = t54;
|
|
775
844
|
} else {
|
|
776
|
-
t54 = $[
|
|
845
|
+
t54 = $[150];
|
|
777
846
|
}
|
|
778
847
|
let t55;
|
|
779
|
-
if ($[
|
|
780
|
-
t55 =
|
|
781
|
-
$[
|
|
782
|
-
$[
|
|
783
|
-
$[
|
|
784
|
-
$[
|
|
785
|
-
$[180] = calendarRef;
|
|
786
|
-
$[181] = dateContainerRef;
|
|
787
|
-
$[182] = getDayState;
|
|
788
|
-
$[183] = handleNextMonth;
|
|
789
|
-
$[184] = handlePreviousMonth;
|
|
790
|
-
$[185] = handleSelectDay;
|
|
791
|
-
$[186] = handleSelectTime;
|
|
792
|
-
$[187] = initialInputName;
|
|
793
|
-
$[188] = isDateTime;
|
|
794
|
-
$[189] = maxDate;
|
|
795
|
-
$[190] = minDate;
|
|
796
|
-
$[191] = t55;
|
|
797
|
-
} else {
|
|
798
|
-
t55 = $[191];
|
|
799
|
-
}
|
|
800
|
-
let t56;
|
|
801
|
-
if ($[192] !== disabled || $[193] !== hasHintMessages || $[194] !== hintPosition || $[195] !== props.hint || $[196] !== skeletonize) {
|
|
802
|
-
t56 = hintPosition === "below" && /* @__PURE__ */ jsx(Hint, { customClass: "hint", description: props.hint, disabled, skeletonize, visible: hasHintMessages });
|
|
803
|
-
$[192] = disabled;
|
|
804
|
-
$[193] = hasHintMessages;
|
|
805
|
-
$[194] = hintPosition;
|
|
806
|
-
$[195] = props.hint;
|
|
807
|
-
$[196] = skeletonize;
|
|
808
|
-
$[197] = t56;
|
|
809
|
-
} else {
|
|
810
|
-
t56 = $[197];
|
|
811
|
-
}
|
|
812
|
-
let t57;
|
|
813
|
-
if ($[198] !== errors || $[199] !== hasValidationErrors || $[200] !== label || $[201] !== skeletonize) {
|
|
814
|
-
t57 = hasValidationErrors && /* @__PURE__ */ jsx("span", { "data-testid": "test-date-period-field-list-errors", className: "error", "data-state-skeletonize": skeletonize, "aria-describedby": String(label).concat("-errors"), children: errors?.map(_temp4) });
|
|
815
|
-
$[198] = errors;
|
|
816
|
-
$[199] = hasValidationErrors;
|
|
817
|
-
$[200] = label;
|
|
818
|
-
$[201] = skeletonize;
|
|
819
|
-
$[202] = t57;
|
|
820
|
-
} else {
|
|
821
|
-
t57 = $[202];
|
|
822
|
-
}
|
|
823
|
-
let t58;
|
|
824
|
-
if ($[203] !== tooltip || $[204] !== tooltipPosition || $[205] !== tooltipWidth) {
|
|
825
|
-
t58 = /* @__PURE__ */ jsx(Tooltip, { targetRef: inputRootRef, text: tooltip, width: tooltipWidth, position: tooltipPosition });
|
|
826
|
-
$[203] = tooltip;
|
|
827
|
-
$[204] = tooltipPosition;
|
|
828
|
-
$[205] = tooltipWidth;
|
|
829
|
-
$[206] = t58;
|
|
848
|
+
if ($[151] !== tooltip || $[152] !== tooltipPosition || $[153] !== tooltipWidth) {
|
|
849
|
+
t55 = /* @__PURE__ */ jsx(Tooltip, { targetRef: inputRootRef, text: tooltip, width: tooltipWidth, position: tooltipPosition });
|
|
850
|
+
$[151] = tooltip;
|
|
851
|
+
$[152] = tooltipPosition;
|
|
852
|
+
$[153] = tooltipWidth;
|
|
853
|
+
$[154] = t55;
|
|
830
854
|
} else {
|
|
831
|
-
|
|
855
|
+
t55 = $[154];
|
|
832
856
|
}
|
|
833
857
|
return /* @__PURE__ */ jsxs(React.Fragment, { children: [
|
|
834
858
|
/* @__PURE__ */ jsx(DatePeriodFieldContext.Provider, { value: contextValues, children: /* @__PURE__ */ jsxs(Root, { ref: inputRootRef, "data-testid": "test-date-period-field-root", "data-state-error": hasValidationErrors, customClassWrapper, children: [
|
|
835
|
-
|
|
859
|
+
t33,
|
|
836
860
|
/* @__PURE__ */ jsxs(Container, { ref: dateContainerRef, "data-testid": "test-date-period-field-container", onKeyDown: handleKeyDownNavigation, skeletonize, customClassInputContainer, children: [
|
|
837
|
-
/* @__PURE__ */ jsx(Input, { ...
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
861
|
+
/* @__PURE__ */ jsx(Input, { ...t34, ref: t36, id: initialInputName, name: initialInputName, value: initialMaskedValue, disabled, readOnly, customClass, tabIndex: !readOnly && !skeletonize ? 0 : -1, placeholder: inputPlaceholder, "aria-autocomplete": "list", "aria-activedescendant": activeDescendant, "aria-expanded": calendarBoxOpen, "aria-controls": initialInputName, "aria-labelledby": initialInputName, "data-testid": "test-date-period-field-initial-input", "data-state-is-period-input": true, "data-state-error": hasValidationErrors, "data-state-read-only": readOnly, "data-state-text-align": textAlign, "data-state-undigitable": undigitable, "data-state-skeletonize": skeletonize, onPaste: handleOnPaste, onBeforeInput: handleOnBeforeInput, onBlur: t37, onFocus: t38, onKeyDown: t39, onKeyDownCapture: handleInitialKeyDownCapture }),
|
|
862
|
+
t41,
|
|
863
|
+
t50,
|
|
864
|
+
t51
|
|
841
865
|
] }),
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
866
|
+
t52,
|
|
867
|
+
t53,
|
|
868
|
+
t54
|
|
845
869
|
] }) }),
|
|
846
|
-
|
|
870
|
+
t55
|
|
847
871
|
] });
|
|
848
872
|
});
|
|
849
873
|
InputBase.displayName = "DatePeriodFieldInputBase";
|
|
@@ -853,18 +877,10 @@ function _temp() {
|
|
|
853
877
|
final: null
|
|
854
878
|
};
|
|
855
879
|
}
|
|
856
|
-
function _temp2(
|
|
857
|
-
const inicial = initialDate?.isAfter(finalDate) ? finalDate : initialDate;
|
|
858
|
-
const final = initialDate?.isAfter(finalDate) ? initialDate : finalDate;
|
|
859
|
-
return {
|
|
860
|
-
inicial,
|
|
861
|
-
final
|
|
862
|
-
};
|
|
863
|
-
}
|
|
864
|
-
function _temp3(event_5) {
|
|
880
|
+
function _temp2(event_5) {
|
|
865
881
|
event_5.preventDefault();
|
|
866
882
|
}
|
|
867
|
-
function
|
|
883
|
+
function _temp3(error, index) {
|
|
868
884
|
return /* @__PURE__ */ jsxs(React.Fragment, { children: [
|
|
869
885
|
error,
|
|
870
886
|
" "
|