@onesy/ui-react 1.0.181 → 1.0.183
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/Calendar/Calendar.js +4 -2
- package/CalendarMonth/CalendarMonth.js +1 -1
- package/DatePicker/DatePicker.js +64 -57
- package/DateTimePicker/DateTimePicker.js +51 -45
- package/Tab/Tab.js +1 -1
- package/TimePicker/TimePicker.js +64 -59
- package/Watch/Watch.d.ts +1 -0
- package/Watch/Watch.js +3 -2
- package/esm/Calendar/Calendar.js +4 -2
- package/esm/CalendarMonth/CalendarMonth.js +1 -1
- package/esm/DatePicker/DatePicker.js +64 -57
- package/esm/DateTimePicker/DateTimePicker.js +51 -45
- package/esm/Tab/Tab.js +1 -1
- package/esm/TimePicker/TimePicker.js +64 -59
- package/esm/Watch/Watch.js +3 -2
- package/esm/index.js +1 -1
- package/index.js +1 -1
- package/package.json +2 -2
|
@@ -148,18 +148,23 @@ const DateTimePicker = props__ => {
|
|
|
148
148
|
const touch = useMediaQuery('(pointer: coarse)', {
|
|
149
149
|
element: refs.root.current
|
|
150
150
|
});
|
|
151
|
+
const onResolveValue = valueNew => {
|
|
152
|
+
const array = (is('array', valueNew) ? valueNew : [valueNew]).filter(Boolean);
|
|
153
|
+
const sorted = array.sort((a, b) => a?.milliseconds - b?.milliseconds);
|
|
154
|
+
return sorted;
|
|
155
|
+
};
|
|
151
156
|
const [value, setValue] = React.useState(() => {
|
|
152
157
|
const valueResult = (valueDefault !== undefined ? valueDefault : value_) || now && (range ? [new OnesyDate(), new OnesyDate()] : [new OnesyDate()]);
|
|
153
|
-
return (
|
|
158
|
+
return onResolveValue(valueResult);
|
|
154
159
|
});
|
|
155
160
|
const [calendar, setCalendar] = React.useState(value[0]);
|
|
156
161
|
const [open, setOpen] = React.useState(false);
|
|
157
162
|
const [error, setError] = React.useState(false);
|
|
158
163
|
const [tab, setTab] = React.useState('date');
|
|
159
164
|
refs.value.current = value;
|
|
160
|
-
const valueToInput = (
|
|
165
|
+
const valueToInput = (valueNew_0 = refs.value.current) => {
|
|
161
166
|
let result_0 = '';
|
|
162
|
-
const [from, to] =
|
|
167
|
+
const [from, to] = valueNew_0;
|
|
163
168
|
if (!(from || to)) return '';
|
|
164
169
|
const method = item_0 => {
|
|
165
170
|
let formatValue = `${formatMethod(item_0, 'DD')}/${formatMethod(item_0, 'MM')}/${formatMethod(item_0, 'YYYY')}`;
|
|
@@ -185,15 +190,16 @@ const DateTimePicker = props__ => {
|
|
|
185
190
|
if (version === 'auto') {
|
|
186
191
|
if (touch) version = 'mobile';else version = 'desktop';
|
|
187
192
|
}
|
|
188
|
-
const onUpdateValue =
|
|
189
|
-
|
|
193
|
+
const onUpdateValue = valueNew_ => {
|
|
194
|
+
const valueNew_1 = onResolveValue(valueNew_);
|
|
195
|
+
setValue(valueNew_1);
|
|
190
196
|
|
|
191
197
|
// Update input
|
|
192
|
-
setInput(valueToInput(
|
|
198
|
+
setInput(valueToInput(valueNew_1));
|
|
193
199
|
};
|
|
194
|
-
const errorCheck = (
|
|
200
|
+
const errorCheck = (valueNew_2 = value) => {
|
|
195
201
|
// Error
|
|
196
|
-
setError((
|
|
202
|
+
setError((valueNew_2 || []).some((item_1, index) => !valid(item_1)));
|
|
197
203
|
};
|
|
198
204
|
|
|
199
205
|
// Init
|
|
@@ -204,12 +210,12 @@ const DateTimePicker = props__ => {
|
|
|
204
210
|
|
|
205
211
|
// Value
|
|
206
212
|
React.useEffect(() => {
|
|
207
|
-
if (value_ !== undefined && value_ !== value) onUpdateValue(
|
|
213
|
+
if (value_ !== undefined && value_ !== value) onUpdateValue(value_);
|
|
208
214
|
}, [value_]);
|
|
209
|
-
const onUpdate =
|
|
215
|
+
const onUpdate = valueNew_3 => {
|
|
210
216
|
// Inner update
|
|
211
|
-
if (!props.hasOwnProperty('value')) setValue(
|
|
212
|
-
if (is('function', onChange)) onChange(!range ?
|
|
217
|
+
if (!props.hasOwnProperty('value')) setValue(valueNew_3);
|
|
218
|
+
if (is('function', onChange)) onChange(!range ? valueNew_3[0] : valueNew_3);
|
|
213
219
|
};
|
|
214
220
|
const onPickSwitch = () => {
|
|
215
221
|
setTab(previous => previous === 'date' ? 'time' : 'date');
|
|
@@ -219,15 +225,15 @@ const DateTimePicker = props__ => {
|
|
|
219
225
|
// since it might be canceled
|
|
220
226
|
// only use onChange on
|
|
221
227
|
// input change, or ok
|
|
222
|
-
const onPickerChange =
|
|
223
|
-
const
|
|
224
|
-
if (
|
|
228
|
+
const onPickerChange = valueNew__0 => {
|
|
229
|
+
const valueNew_4 = onResolveValue(valueNew__0);
|
|
230
|
+
if (valueNew_4 !== value) setValue(valueNew_4);
|
|
225
231
|
};
|
|
226
|
-
const onChangeCalendar =
|
|
227
|
-
if (
|
|
232
|
+
const onChangeCalendar = valueNew_5 => {
|
|
233
|
+
if (valueNew_5 !== calendar) setCalendar(valueNew_5);
|
|
228
234
|
};
|
|
229
|
-
const textToOnesyDate =
|
|
230
|
-
const [date, ...valueOther] =
|
|
235
|
+
const textToOnesyDate = valueNew_6 => {
|
|
236
|
+
const [date, ...valueOther] = valueNew_6.split(' ');
|
|
231
237
|
const time = valueOther.join(' ');
|
|
232
238
|
const [valueDay, valueMonth, valueYear] = (date || '').split('/');
|
|
233
239
|
const [times, dayTime] = (time || '').split(' ');
|
|
@@ -255,73 +261,73 @@ const DateTimePicker = props__ => {
|
|
|
255
261
|
}
|
|
256
262
|
return onesyDate;
|
|
257
263
|
};
|
|
258
|
-
const inputToValue = (
|
|
259
|
-
let
|
|
260
|
-
let [from_0, to_0] =
|
|
264
|
+
const inputToValue = (valueNew__1 = input) => {
|
|
265
|
+
let valueNew_7 = valueNew__1;
|
|
266
|
+
let [from_0, to_0] = valueNew_7.split(SEPARATOR);
|
|
261
267
|
from_0 = textToOnesyDate(from_0);
|
|
262
268
|
if (to_0) to_0 = textToOnesyDate(to_0);
|
|
263
|
-
|
|
264
|
-
return
|
|
269
|
+
valueNew_7 = [from_0, to_0].filter(Boolean);
|
|
270
|
+
return valueNew_7;
|
|
265
271
|
};
|
|
266
|
-
const onInputChange =
|
|
267
|
-
const
|
|
268
|
-
const validValues =
|
|
272
|
+
const onInputChange = valueNew__2 => {
|
|
273
|
+
const valueNew_8 = inputToValue(valueNew__2);
|
|
274
|
+
const validValues = valueNew_8.every(item_2 => item_2.valid);
|
|
269
275
|
|
|
270
276
|
// Only update values if input is valid
|
|
271
277
|
// format used to make the value
|
|
272
278
|
if (validValues) {
|
|
273
279
|
// Error
|
|
274
|
-
errorCheck(
|
|
280
|
+
errorCheck(valueNew_8);
|
|
275
281
|
|
|
276
282
|
// Update value
|
|
277
|
-
onUpdate(
|
|
283
|
+
onUpdate(valueNew_8);
|
|
278
284
|
|
|
279
285
|
// Update calendar
|
|
280
|
-
setCalendar(
|
|
286
|
+
setCalendar(valueNew_8[0]);
|
|
281
287
|
}
|
|
282
|
-
if (!
|
|
288
|
+
if (!valueNew__2) {
|
|
283
289
|
onUpdate([null, null]);
|
|
284
290
|
}
|
|
285
291
|
|
|
286
292
|
// Update input for free typing
|
|
287
|
-
setInput(
|
|
293
|
+
setInput(valueNew__2);
|
|
288
294
|
};
|
|
289
295
|
const onReset = () => {
|
|
290
|
-
let
|
|
291
|
-
const isValid =
|
|
296
|
+
let valueNew_9 = inputToValue();
|
|
297
|
+
const isValid = valueNew_9 && valueNew_9?.[0]?.valid;
|
|
292
298
|
if (isValid) {
|
|
293
299
|
// Update value
|
|
294
|
-
onUpdate(
|
|
300
|
+
onUpdate(valueNew_9);
|
|
295
301
|
} else {
|
|
296
|
-
|
|
302
|
+
valueNew_9 = [];
|
|
297
303
|
|
|
298
304
|
// Update value
|
|
299
|
-
onUpdate(
|
|
305
|
+
onUpdate(valueNew_9);
|
|
300
306
|
|
|
301
307
|
// Update input
|
|
302
|
-
setInput(valueToInput(
|
|
308
|
+
setInput(valueToInput(valueNew_9));
|
|
303
309
|
}
|
|
304
310
|
};
|
|
305
311
|
const onToday = event => {
|
|
306
|
-
const
|
|
307
|
-
if (range)
|
|
312
|
+
const valueNew_10 = [new OnesyDate()];
|
|
313
|
+
if (range) valueNew_10.push(new OnesyDate());
|
|
308
314
|
|
|
309
315
|
// Update value
|
|
310
|
-
onUpdate(
|
|
316
|
+
onUpdate(valueNew_10);
|
|
311
317
|
|
|
312
318
|
// Update input
|
|
313
|
-
setInput(valueToInput(
|
|
319
|
+
setInput(valueToInput(valueNew_10));
|
|
314
320
|
onClose(event);
|
|
315
321
|
if (is('function', onToday_)) onToday_(event);
|
|
316
322
|
};
|
|
317
323
|
const onClear = event_0 => {
|
|
318
|
-
const
|
|
324
|
+
const valueNew_11 = [];
|
|
319
325
|
|
|
320
326
|
// Update value
|
|
321
|
-
onUpdate(
|
|
327
|
+
onUpdate(valueNew_11);
|
|
322
328
|
|
|
323
329
|
// Update input
|
|
324
|
-
setInput(valueToInput(
|
|
330
|
+
setInput(valueToInput(valueNew_11));
|
|
325
331
|
onClose(event_0);
|
|
326
332
|
if (is('function', onClear_)) onClear_(event_0);
|
|
327
333
|
};
|
package/esm/Tab/Tab.js
CHANGED
|
@@ -32,7 +32,7 @@ const useStyle = styleMethod(theme => ({
|
|
|
32
32
|
alignSelf: 'stretch',
|
|
33
33
|
userSelect: 'none',
|
|
34
34
|
cursor: 'pointer',
|
|
35
|
-
opacity: theme.palette.visual_contrast.default.opacity.
|
|
35
|
+
opacity: theme.palette.visual_contrast.default.opacity.tertiary,
|
|
36
36
|
transition: theme.methods.transitions.make('opacity')
|
|
37
37
|
},
|
|
38
38
|
size_small: {
|
|
@@ -327,9 +327,14 @@ const TimePicker = props__ => {
|
|
|
327
327
|
const touch = useMediaQuery('(pointer: coarse)', {
|
|
328
328
|
element: refs.root.current
|
|
329
329
|
});
|
|
330
|
+
const onResolveValue = valueNew => {
|
|
331
|
+
const array = (is('array', valueNew) ? valueNew : [valueNew]).filter(Boolean);
|
|
332
|
+
const sorted = array.sort((a, b) => a?.milliseconds - b?.milliseconds);
|
|
333
|
+
return sorted;
|
|
334
|
+
};
|
|
330
335
|
const [value, setValue] = React.useState(() => {
|
|
331
336
|
const valueResult = (valueDefault !== undefined ? valueDefault : value_) || now && (range ? [new OnesyDate(), new OnesyDate()] : [new OnesyDate()]);
|
|
332
|
-
return (
|
|
337
|
+
return onResolveValue(valueResult);
|
|
333
338
|
});
|
|
334
339
|
const [selecting, setSelecting] = React.useState(() => {
|
|
335
340
|
const valueResult_0 = (selectingDefault !== undefined ? selectingDefault : selecting_) || ['hour', 'hour'];
|
|
@@ -345,9 +350,9 @@ const TimePicker = props__ => {
|
|
|
345
350
|
refs.value.current = value;
|
|
346
351
|
refs.mode.current = mode;
|
|
347
352
|
refs.dayTime.current = dayTime;
|
|
348
|
-
const valueToInput = (
|
|
353
|
+
const valueToInput = (valueNew_0 = refs.value.current) => {
|
|
349
354
|
let result_0 = '';
|
|
350
|
-
const [from, to] = is('array',
|
|
355
|
+
const [from, to] = is('array', valueNew_0) ? valueNew_0 : [valueNew_0];
|
|
351
356
|
if (!(from || to)) return '';
|
|
352
357
|
const method = item_1 => {
|
|
353
358
|
let formatValue = '';
|
|
@@ -367,20 +372,20 @@ const TimePicker = props__ => {
|
|
|
367
372
|
if (touch) version = 'mobile';else version = 'desktop';
|
|
368
373
|
}
|
|
369
374
|
const onUpdateValue = valueNew_ => {
|
|
370
|
-
const
|
|
375
|
+
const valueNew_1 = onResolveValue(valueNew_);
|
|
371
376
|
|
|
372
377
|
// Update value
|
|
373
|
-
setValue(
|
|
378
|
+
setValue(valueNew_1);
|
|
374
379
|
|
|
375
380
|
// Update input
|
|
376
|
-
setInput(valueToInput(
|
|
381
|
+
setInput(valueToInput(valueNew_1));
|
|
377
382
|
|
|
378
383
|
// Update dayTime
|
|
379
|
-
setDayTime(
|
|
384
|
+
setDayTime(valueNew_1.map(item_2 => formatDate(item_2, 'a')));
|
|
380
385
|
};
|
|
381
|
-
const errorCheck = (
|
|
386
|
+
const errorCheck = (valueNew_2 = value) => {
|
|
382
387
|
// Error
|
|
383
|
-
setError((
|
|
388
|
+
setError((valueNew_2 || []).some((item_3, index) => !valid(item_3)));
|
|
384
389
|
};
|
|
385
390
|
|
|
386
391
|
// Init
|
|
@@ -391,22 +396,22 @@ const TimePicker = props__ => {
|
|
|
391
396
|
|
|
392
397
|
// Value
|
|
393
398
|
React.useEffect(() => {
|
|
394
|
-
if (value_ !== undefined && value_ !== value) onUpdateValue(
|
|
399
|
+
if (value_ !== undefined && value_ !== value) onUpdateValue(value_);
|
|
395
400
|
}, [value_]);
|
|
396
401
|
const onUpdate = valueNew__0 => {
|
|
397
|
-
const
|
|
402
|
+
const valueNew_3 = resolve(valueNew__0);
|
|
398
403
|
|
|
399
404
|
// Inner update
|
|
400
|
-
if (!props.hasOwnProperty('value')) setValue(
|
|
401
|
-
if (is('function', onChange)) onChange(!range ?
|
|
405
|
+
if (!props.hasOwnProperty('value')) setValue(valueNew_3);
|
|
406
|
+
if (is('function', onChange)) onChange(!range ? valueNew_3[0] : valueNew_3);
|
|
402
407
|
};
|
|
403
408
|
const onUpdateSelecting = (valueNew__1, index_0) => {
|
|
404
|
-
const
|
|
405
|
-
|
|
409
|
+
const valueNew_4 = [...selecting];
|
|
410
|
+
valueNew_4[index_0] = valueNew__1;
|
|
406
411
|
|
|
407
412
|
// Inner update
|
|
408
|
-
if (!props.hasOwnProperty('selecting')) setSelecting(
|
|
409
|
-
if (is('function', onChangeSelecting)) onChangeSelecting(
|
|
413
|
+
if (!props.hasOwnProperty('selecting')) setSelecting(valueNew_4);
|
|
414
|
+
if (is('function', onChangeSelecting)) onChangeSelecting(valueNew_4);
|
|
410
415
|
};
|
|
411
416
|
const valid = (...args) => {
|
|
412
417
|
if (is('function', valid_)) return valid_(...args);
|
|
@@ -420,8 +425,8 @@ const TimePicker = props__ => {
|
|
|
420
425
|
}
|
|
421
426
|
return true;
|
|
422
427
|
};
|
|
423
|
-
const textToOnesyDate =
|
|
424
|
-
const [times, dayTime_] = (
|
|
428
|
+
const textToOnesyDate = valueNew_5 => {
|
|
429
|
+
const [times, dayTime_] = (valueNew_5 || '').split(' ');
|
|
425
430
|
const values = times.split(':');
|
|
426
431
|
let valueTime;
|
|
427
432
|
let onesyDate_0 = new OnesyDate();
|
|
@@ -445,15 +450,15 @@ const TimePicker = props__ => {
|
|
|
445
450
|
}
|
|
446
451
|
return onesyDate_0;
|
|
447
452
|
};
|
|
448
|
-
const onInputModalChange = (
|
|
449
|
-
let valueTime_0 =
|
|
453
|
+
const onInputModalChange = (valueNew_6, unit, index_1) => {
|
|
454
|
+
let valueTime_0 = valueNew_6;
|
|
450
455
|
if (is('string', valueTime_0) && valueTime_0.startsWith('0')) valueTime_0 = valueTime_0.slice(1);
|
|
451
456
|
valueTime_0 = +valueTime_0;
|
|
452
457
|
value[index_1] = set(valueTime_0, unit || selecting[index_1], value[index_1]);
|
|
453
458
|
(!actions_ ? onUpdate : setValue)(resolve(value));
|
|
454
459
|
};
|
|
455
|
-
const resolve = (
|
|
456
|
-
const values_0 =
|
|
460
|
+
const resolve = (valueNew_7 = refs.value.current, dayTimeNew = refs.dayTime.current) => {
|
|
461
|
+
const values_0 = onResolveValue(valueNew_7).map((item_4, index_2) => {
|
|
457
462
|
// Resolve the range value
|
|
458
463
|
const valueHour = item_4.hour;
|
|
459
464
|
if (format === '12') {
|
|
@@ -465,35 +470,35 @@ const TimePicker = props__ => {
|
|
|
465
470
|
return values_0;
|
|
466
471
|
};
|
|
467
472
|
const updateDayTime = (valueNew__2, index_3) => {
|
|
468
|
-
const
|
|
473
|
+
const valueNew_8 = valueNew__2[0];
|
|
469
474
|
|
|
470
475
|
// Update dayTime
|
|
471
476
|
const dayTimeNew_0 = [...dayTime];
|
|
472
|
-
dayTimeNew_0[index_3] =
|
|
477
|
+
dayTimeNew_0[index_3] = valueNew_8;
|
|
473
478
|
refs.dayTime.current = dayTimeNew_0;
|
|
474
479
|
setDayTime(dayTimeNew_0);
|
|
475
480
|
(!actions_ ? onUpdate : setValue)(resolve(refs.value.current));
|
|
476
481
|
};
|
|
477
482
|
const inputToValue = (valueNew__3 = input) => {
|
|
478
|
-
let
|
|
479
|
-
let [from_0, to_0] =
|
|
483
|
+
let valueNew_9 = valueNew__3;
|
|
484
|
+
let [from_0, to_0] = valueNew_9.split(SEPARATOR);
|
|
480
485
|
from_0 = textToOnesyDate(from_0);
|
|
481
486
|
if (to_0) to_0 = textToOnesyDate(to_0);
|
|
482
|
-
|
|
483
|
-
return
|
|
487
|
+
valueNew_9 = [from_0, to_0].filter(Boolean).filter(item_5 => item_5?.valid);
|
|
488
|
+
return valueNew_9;
|
|
484
489
|
};
|
|
485
490
|
const onInputChange = valueNew__4 => {
|
|
486
|
-
const
|
|
487
|
-
const validValues =
|
|
491
|
+
const valueNew_10 = inputToValue(valueNew__4);
|
|
492
|
+
const validValues = valueNew_10.every(item_6 => item_6.valid);
|
|
488
493
|
|
|
489
494
|
// Only update values if input is valid
|
|
490
495
|
// format used to make the value
|
|
491
496
|
if (validValues) {
|
|
492
497
|
// Error
|
|
493
|
-
errorCheck(
|
|
498
|
+
errorCheck(valueNew_10);
|
|
494
499
|
|
|
495
500
|
// Update value
|
|
496
|
-
onUpdate(
|
|
501
|
+
onUpdate(valueNew_10);
|
|
497
502
|
}
|
|
498
503
|
if (!valueNew__4) {
|
|
499
504
|
onUpdate([null, null]);
|
|
@@ -503,21 +508,21 @@ const TimePicker = props__ => {
|
|
|
503
508
|
setInput(valueNew__4);
|
|
504
509
|
};
|
|
505
510
|
const onChangeClock = (valueNew__5, index_4 = 0) => {
|
|
506
|
-
const
|
|
511
|
+
const valueNew_11 = [...value];
|
|
507
512
|
if (valueNew__5 !== value[index_4]) {
|
|
508
|
-
|
|
509
|
-
(!actions_ ? onUpdate : setValue)(resolve(
|
|
513
|
+
valueNew_11[index_4] = valueNew__5;
|
|
514
|
+
(!actions_ ? onUpdate : setValue)(resolve(valueNew_11));
|
|
510
515
|
|
|
511
516
|
// Error
|
|
512
|
-
errorCheck(
|
|
517
|
+
errorCheck(valueNew_11);
|
|
513
518
|
}
|
|
514
519
|
};
|
|
515
|
-
const onChangeSelectingClock = (
|
|
520
|
+
const onChangeSelectingClock = (valueNew_12, index_5 = 0) => {
|
|
516
521
|
const selectingValue = selecting;
|
|
517
|
-
selectingValue[index_5] =
|
|
518
|
-
if (
|
|
522
|
+
selectingValue[index_5] = valueNew_12;
|
|
523
|
+
if (valueNew_12 !== selecting[0]) setSelecting([...selectingValue]);
|
|
519
524
|
};
|
|
520
|
-
const onDoneSelecting = (
|
|
525
|
+
const onDoneSelecting = (valueNew_13, selectingNew) => {
|
|
521
526
|
// AutoCloseOnLast
|
|
522
527
|
if (autoCloseOnLast && refs.mode.current === 'select') {
|
|
523
528
|
if (['hour', 'minute', 'second'].includes(selectingNew)) {
|
|
@@ -540,40 +545,40 @@ const TimePicker = props__ => {
|
|
|
540
545
|
if (is('function', onClose_)) onClose_(event);
|
|
541
546
|
};
|
|
542
547
|
const onReset = () => {
|
|
543
|
-
const
|
|
548
|
+
const valueNew_14 = inputToValue();
|
|
544
549
|
|
|
545
550
|
// Update value
|
|
546
|
-
onUpdate(
|
|
551
|
+
onUpdate(valueNew_14);
|
|
547
552
|
|
|
548
553
|
// Update dayTime
|
|
549
|
-
setDayTime(
|
|
554
|
+
setDayTime(valueNew_14.map(item_7 => formatDate(item_7, 'a')));
|
|
550
555
|
};
|
|
551
556
|
const onToday = event_0 => {
|
|
552
|
-
const
|
|
553
|
-
if (range)
|
|
557
|
+
const valueNew_15 = [new OnesyDate()];
|
|
558
|
+
if (range) valueNew_15.push(new OnesyDate());
|
|
554
559
|
|
|
555
560
|
// Update value
|
|
556
|
-
onUpdate(
|
|
561
|
+
onUpdate(valueNew_15);
|
|
557
562
|
|
|
558
563
|
// Update input
|
|
559
|
-
setInput(valueToInput(
|
|
564
|
+
setInput(valueToInput(valueNew_15));
|
|
560
565
|
|
|
561
566
|
// Update dayTime
|
|
562
|
-
setDayTime(
|
|
567
|
+
setDayTime(valueNew_15.map(item_8 => formatDate(item_8, 'a')));
|
|
563
568
|
onClose(event_0);
|
|
564
569
|
if (is('function', onToday_)) onToday_(event_0);
|
|
565
570
|
};
|
|
566
571
|
const onClear = event_1 => {
|
|
567
|
-
const
|
|
572
|
+
const valueNew_16 = [];
|
|
568
573
|
|
|
569
574
|
// Update value
|
|
570
|
-
onUpdate(
|
|
575
|
+
onUpdate(valueNew_16);
|
|
571
576
|
|
|
572
577
|
// Update input
|
|
573
|
-
setInput(valueToInput(
|
|
578
|
+
setInput(valueToInput(valueNew_16));
|
|
574
579
|
|
|
575
580
|
// Update dayTime
|
|
576
|
-
setDayTime(
|
|
581
|
+
setDayTime(valueNew_16.map(item_9 => formatDate(item_9, 'a')));
|
|
577
582
|
onClose(event_1);
|
|
578
583
|
if (is('function', onClear_)) onClear_(event_1);
|
|
579
584
|
};
|
|
@@ -663,8 +668,8 @@ const TimePicker = props__ => {
|
|
|
663
668
|
value: value[index_6] || new OnesyDate(),
|
|
664
669
|
dayTime: dayTime[index_6] || formatDate(new OnesyDate(), 'a'),
|
|
665
670
|
selecting: selecting[index_6],
|
|
666
|
-
onChange:
|
|
667
|
-
onChangeSelecting:
|
|
671
|
+
onChange: valueNew_17 => onChangeClock(valueNew_17, index_6),
|
|
672
|
+
onChangeSelecting: valueNew_18 => onChangeSelectingClock(valueNew_18, index_6),
|
|
668
673
|
onDoneSelecting: onDoneSelecting,
|
|
669
674
|
renderValue: renderValue,
|
|
670
675
|
valid: valid,
|
|
@@ -731,7 +736,7 @@ const TimePicker = props__ => {
|
|
|
731
736
|
inputs.push(/*#__PURE__*/_jsx(AdvancedTextField, _objectSpread({
|
|
732
737
|
helperText: l('Hour'),
|
|
733
738
|
value: formatDate(value[index_7], format === '12' ? 'hh' : 'HH'),
|
|
734
|
-
onChange:
|
|
739
|
+
onChange: valueNew_19 => onInputModalChange(valueNew_19, 'hour', index_7),
|
|
735
740
|
placeholder: "00",
|
|
736
741
|
mask: [...(format === '12' ? [{
|
|
737
742
|
pattern: '[0-1]'
|
|
@@ -753,7 +758,7 @@ const TimePicker = props__ => {
|
|
|
753
758
|
inputs.push(/*#__PURE__*/_jsx(AdvancedTextField, _objectSpread({
|
|
754
759
|
helperText: l('Minute'),
|
|
755
760
|
value: formatDate(value[index_7], 'mm'),
|
|
756
|
-
onChange:
|
|
761
|
+
onChange: valueNew_20 => onInputModalChange(valueNew_20, 'minute', index_7),
|
|
757
762
|
placeholder: "00",
|
|
758
763
|
mask: [{
|
|
759
764
|
pattern: '[0-5]'
|
|
@@ -775,7 +780,7 @@ const TimePicker = props__ => {
|
|
|
775
780
|
inputs.push(/*#__PURE__*/_jsx(AdvancedTextField, _objectSpread({
|
|
776
781
|
helperText: l('Second'),
|
|
777
782
|
value: formatDate(value[index_7], 'ss'),
|
|
778
|
-
onChange:
|
|
783
|
+
onChange: valueNew_21 => onInputModalChange(valueNew_21, 'second', index_7),
|
|
779
784
|
placeholder: "00",
|
|
780
785
|
mask: [{
|
|
781
786
|
pattern: '[0-5]'
|
|
@@ -820,7 +825,7 @@ const TimePicker = props__ => {
|
|
|
820
825
|
size: size,
|
|
821
826
|
orientation: orientationValue,
|
|
822
827
|
value: dayTime[index_8] || formatDate(new OnesyDate(), 'a'),
|
|
823
|
-
onChange:
|
|
828
|
+
onChange: valueNew_22 => updateDayTime(valueNew_22, index_8),
|
|
824
829
|
select: "single",
|
|
825
830
|
unselect: false
|
|
826
831
|
}, ToggleButtonsProps), {}, {
|
package/esm/Watch/Watch.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
-
const _excluded = ["tonal", "color", "version", "size", "start", "timeVisible", "timeOfDayVisible", "dateVisible", "timeFormatString", "dateFormatString", "renderTime", "renderDate", "shadow", "AnalogProps", "RegularProps", "MinimalProps", "ModernProps", "RoundMeterProps", "Component", "className", "children"];
|
|
3
|
+
const _excluded = ["tonal", "color", "version", "size", "start", "valueDefault", "timeVisible", "timeOfDayVisible", "dateVisible", "timeFormatString", "dateFormatString", "renderTime", "renderDate", "shadow", "AnalogProps", "RegularProps", "MinimalProps", "ModernProps", "RoundMeterProps", "Component", "className", "children"];
|
|
4
4
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
5
5
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
6
6
|
import React from 'react';
|
|
@@ -111,6 +111,7 @@ const Watch = props_ => {
|
|
|
111
111
|
version = 'regular',
|
|
112
112
|
size = 'regular',
|
|
113
113
|
start = true,
|
|
114
|
+
valueDefault,
|
|
114
115
|
timeVisible = true,
|
|
115
116
|
timeOfDayVisible = true,
|
|
116
117
|
dateVisible = true,
|
|
@@ -136,7 +137,7 @@ const Watch = props_ => {
|
|
|
136
137
|
value: React.useRef(undefined),
|
|
137
138
|
requestAnimationFrameID: React.useRef(undefined)
|
|
138
139
|
};
|
|
139
|
-
const [value, setValue] = React.useState(OnesyDate.onesyDate);
|
|
140
|
+
const [value, setValue] = React.useState(valueDefault ?? OnesyDate.onesyDate);
|
|
140
141
|
const update = () => {
|
|
141
142
|
setValue(OnesyDate.onesyDate);
|
|
142
143
|
refs.requestAnimationFrameID.current = requestAnimationFrame(update);
|
package/esm/index.js
CHANGED
package/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@onesy/ui-react",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.183",
|
|
4
4
|
"description": "UI for React",
|
|
5
5
|
"repository": "https://github.com/onesy-me/onesy.git",
|
|
6
6
|
"author": "Lazar Erić <lazareric1@proton.me>",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
],
|
|
32
32
|
"peerDependencies": {
|
|
33
33
|
"@onesy/icons-material-rounded-react": "^1.0.11",
|
|
34
|
-
"@onesy/style-react": "^1.0.
|
|
34
|
+
"@onesy/style-react": "^1.0.8",
|
|
35
35
|
"react": "19.2.0",
|
|
36
36
|
"react-dom": "19.2.0",
|
|
37
37
|
"react-router-dom": "7.9.6"
|