adalal/solidtime
1
0
Fork 0
mirror of https://github.com/solidtime-io/solidtime.git synced 2026-10-14 16:53:17 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix radix dialog focus restore behaviour

Browse Source
This commit is contained in:
Gregor Vostrak
2026-09-04 14:55:09 +02:00
parent 169d522da0
commit 82ea9af8b5
5 changed files with 149 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
resources/js/packages/ui/src/dialog/DialogContent.vue
View File

@@ -1,5 +1,6 @@
<script setup lang="ts">
import { cn } from '../utils/cn';
import { useDialogFocusRestore } from '../utils/useDialogFocusRestore';
import {
DialogContent,
type DialogContentEmits,
@@ -20,6 +21,10 @@ const delegatedProps = computed(() => {
});
const forwarded = useForwardPropsEmits(delegatedProps, emits);
// Forwarded consumer listeners run first, so a consumer can still take over
// by calling preventDefault() on close-auto-focus.
const { onOpenAutoFocus, onCloseAutoFocus } = useDialogFocusRestore();
</script>
<template>
@@ -36,7 +41,9 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
'my-3 md:my-14 xl:my-24 bg-default-background grid w-full max-w-lg border border-border-tertiary shadow-lg duration-200 rounded-lg outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',
props.class
)
">
"
@open-auto-focus="onOpenAutoFocus"
@close-auto-focus="onCloseAutoFocus">
<slot />
</DialogContent>
</div>

7
resources/js/packages/ui/src/dialog/DialogScrollContent.vue
View File

@@ -1,5 +1,6 @@
<script setup lang="ts">
import { cn } from '../utils/cn';
import { useDialogFocusRestore } from '../utils/useDialogFocusRestore';
import { X } from '@lucide/vue';
import {
DialogClose,
@@ -22,6 +23,10 @@ const delegatedProps = computed(() => {
});
const forwarded = useForwardPropsEmits(delegatedProps, emits);
// Forwarded consumer listeners run first, so a consumer can still take over
// by calling preventDefault() on close-auto-focus.
const { onOpenAutoFocus, onCloseAutoFocus } = useDialogFocusRestore();
</script>
<template>
@@ -36,6 +41,8 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
)
"
v-bind="forwarded"
@open-auto-focus="onOpenAutoFocus"
@close-auto-focus="onCloseAutoFocus"
@pointer-down-outside="
(event) => {
const originalEvent = event.detail.originalEvent;