fix: types and focused date logic

formwerkjs · Feb 16, 2025 · 91876d5 · 91876d5
1 parent 390ca1a
commit 91876d5
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 4 deletions.
diff --git a/packages/core/src/useCalendar/useCalendar.ts b/packages/core/src/useCalendar/useCalendar.ts
@@ -237,7 +237,7 @@ export function useCalendar(_props: Reactivify<CalendarProps, 'field' | 'schema'
   watch(
     () => pickerContext?.isOpen(),
     async value => {
-      if (!value) {
+      if (pickerContext && !value) {
         focusedDay.value = undefined;
         setView('weeks');
         return;

diff --git a/packages/core/src/usePicker/usePicker.ts b/packages/core/src/usePicker/usePicker.ts
@@ -35,7 +35,7 @@ export function usePicker(_props: Reactivify<PickerProps>) {
     return withRefCapture(
       {
         role: 'dialog',
-        'aria-modal': 'true',
+        'aria-modal': 'true' as const,
         'aria-label': toValue(props.label),
       },
       pickerEl,

diff --git a/packages/playground/src/App.vue b/packages/playground/src/App.vue
@@ -9,7 +9,7 @@ const maxDate = new Date(2025, 1, 18, 0, 0, 0, 0);
 
 <template>
   <div class="flex flex-col gap-4">
-    <DateField
+    <!-- <DateField
       name="date"
       label="Date"
       :format-options="{
@@ -21,6 +21,8 @@ const maxDate = new Date(2025, 1, 18, 0, 0, 0, 0);
         minute: '2-digit',
         second: '2-digit',
       }"
-    />
+    /> -->
+
+    <Calendar label="Pick a date" :model-value="new Date('2025-09-16')" />
   </div>
 </template>