compote-ui 0.63.0 → 0.63.1
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.
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import { DateInput } from '@ark-ui/svelte/date-input';
|
|
3
3
|
import { Field, useFieldContext } from '@ark-ui/svelte/field';
|
|
4
4
|
import { toDateValue, fromDateValue, dateValueShape } from '../../utils/date';
|
|
5
|
+
import { getLocalTimeZone } from '@internationalized/date';
|
|
5
6
|
import type { DateValueShape } from '../../utils/date';
|
|
6
7
|
import type { DateInputProps } from './types';
|
|
7
8
|
|
|
@@ -26,6 +27,11 @@
|
|
|
26
27
|
const isReadOnly = $derived(readOnly ?? field?.()?.readOnly ?? false);
|
|
27
28
|
const isDisabled = $derived(disabled ?? field?.()?.disabled ?? false);
|
|
28
29
|
|
|
30
|
+
// Default the display zone to the user's local zone. Without this Ark/zag
|
|
31
|
+
// formats segments in UTC, so a UTC value (e.g. 21:00Z) would show as 21:00
|
|
32
|
+
// instead of the local 23:00. A UTC string still round-trips back to UTC.
|
|
33
|
+
const tz = $derived(timeZone ?? getLocalTimeZone());
|
|
34
|
+
|
|
29
35
|
// Remember the shape the consumer bound the value as, so changes are emitted
|
|
30
36
|
// back in the same shape (string in → string out, Date in → Date out).
|
|
31
37
|
// When the bound value starts null (e.g. a nullable DB column), default to
|
|
@@ -35,16 +41,16 @@
|
|
|
35
41
|
const arkValue = $derived.by(() => {
|
|
36
42
|
const s = dateValueShape(value) ?? dateValueShape(defaultValue);
|
|
37
43
|
if (s) shape = s;
|
|
38
|
-
return toDateValue(value,
|
|
44
|
+
return toDateValue(value, tz);
|
|
39
45
|
});
|
|
40
|
-
const arkDefault = $derived(toDateValue(defaultValue,
|
|
46
|
+
const arkDefault = $derived(toDateValue(defaultValue, tz));
|
|
41
47
|
</script>
|
|
42
48
|
|
|
43
49
|
<DateInput.Root
|
|
44
50
|
{...restProps}
|
|
45
51
|
{granularity}
|
|
46
52
|
{hourCycle}
|
|
47
|
-
{
|
|
53
|
+
timeZone={tz}
|
|
48
54
|
{hideTimeZone}
|
|
49
55
|
invalid={isInvalid}
|
|
50
56
|
readOnly={isReadOnly}
|
|
@@ -55,7 +61,7 @@
|
|
|
55
61
|
const dv = details.value[0] ?? null;
|
|
56
62
|
// Guard: skip if Ark UI echoes back the same date (prevents reactive loop)
|
|
57
63
|
if (dv?.toString() === arkValue?.toString()) return;
|
|
58
|
-
value = fromDateValue(dv, shape,
|
|
64
|
+
value = fromDateValue(dv, shape, tz);
|
|
59
65
|
onValueChange?.(details);
|
|
60
66
|
}}
|
|
61
67
|
>
|