@immich/ui 0.65.0 → 0.65.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.
@@ -25,6 +25,7 @@
25
25
  expandable?: boolean;
26
26
  closeOnEsc?: boolean;
27
27
  closeOnBackdropClick?: boolean;
28
+ focusOnOpen?: boolean;
28
29
  children: Snippet;
29
30
  onClose?: () => void;
30
31
  onEscapeKeydown?: (event: KeyboardEvent) => void;
@@ -40,6 +41,7 @@
40
41
  class: className,
41
42
  closeOnEsc = true,
42
43
  closeOnBackdropClick = false,
44
+ focusOnOpen = false,
43
45
  children,
44
46
  onOpenAutoFocus,
45
47
  }: Props = $props();
@@ -96,6 +98,14 @@
96
98
  onEscapeKeydown?.(event);
97
99
  };
98
100
 
101
+ const handleOpenAutoFocus = (event: Event) => {
102
+ if (onOpenAutoFocus) {
103
+ onOpenAutoFocus(event);
104
+ } else if (!focusOnOpen) {
105
+ event.preventDefault();
106
+ }
107
+ };
108
+
99
109
  onMount(() => {
100
110
  layer = modalState.incrementLayer();
101
111
 
@@ -107,7 +117,7 @@
107
117
  <Dialog.Portal>
108
118
  <Dialog.Overlay class="{zIndex.ModalBackdrop} fixed start-0 top-0 flex h-dvh max-h-dvh w-screen bg-black/30" />
109
119
  <Dialog.Content
110
- {onOpenAutoFocus}
120
+ onOpenAutoFocus={handleOpenAutoFocus}
111
121
  onEscapeKeydown={handleEscapeKeydown}
112
122
  {escapeKeydownBehavior}
113
123
  {interactOutsideBehavior}
@@ -8,6 +8,7 @@ type Props = {
8
8
  expandable?: boolean;
9
9
  closeOnEsc?: boolean;
10
10
  closeOnBackdropClick?: boolean;
11
+ focusOnOpen?: boolean;
11
12
  children: Snippet;
12
13
  onClose?: () => void;
13
14
  onEscapeKeydown?: (event: KeyboardEvent) => void;
@@ -73,7 +73,7 @@
73
73
  ]}
74
74
  />
75
75
 
76
- <Modal size="large" {onClose} closeOnBackdropClick class="max-h-[85vh] lg:max-h-[75vh]">
76
+ <Modal size="large" {onClose} closeOnBackdropClick focusOnOpen class="max-h-[85vh] lg:max-h-[75vh]">
77
77
  <ModalHeader>
78
78
  <div class="flex place-items-center gap-1">
79
79
  <Input
@@ -102,16 +102,20 @@
102
102
  </DatePicker.Segment>
103
103
  {/each}
104
104
  </div>
105
- <DatePicker.Trigger class="mr-2 rounded-full">
106
- <IconButton
107
- variant="ghost"
108
- shape="round"
109
- color="secondary"
110
- {size}
111
- icon={mdiCalendar}
112
- {disabled}
113
- aria-label={t('open_calendar')}
114
- />
105
+ <DatePicker.Trigger>
106
+ {#snippet child({ props })}
107
+ <IconButton
108
+ {...props}
109
+ class="me-2 shrink-0 rounded-full"
110
+ variant="ghost"
111
+ shape="round"
112
+ color="secondary"
113
+ {size}
114
+ icon={mdiCalendar}
115
+ {disabled}
116
+ aria-label={t('open_calendar')}
117
+ />
118
+ {/snippet}
115
119
  </DatePicker.Trigger>
116
120
  {/snippet}
117
121
  </DatePicker.Input>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@immich/ui",
3
- "version": "0.65.0",
3
+ "version": "0.65.2",
4
4
  "license": "GNU Affero General Public License version 3",
5
5
  "repository": {
6
6
  "type": "git",
@@ -58,7 +58,7 @@
58
58
  "@immich/svelte-markdown-preprocess": "^0.2.1"
59
59
  },
60
60
  "volta": {
61
- "node": "24.13.1"
61
+ "node": "24.14.0"
62
62
  },
63
63
  "scripts": {
64
64
  "create": "node scripts/create.js",