mats.bosson/PettyUI
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Fix Dialog activation and role

Browse Source 
Replace onMount+onCleanup with createEffect watching ctx.isOpen() and
ctx.modal(), so focusTrap/scrollLock/dismiss activate/deactivate
reactively on every open/close — including when forceMount keeps the
component mounted.
Note: role="dialog" was omitted; the project's Biome rules flag it as
redundant (noRedundantRoles) since <dialog> carries the implicit role.
This commit is contained in:
Mats Bosson 2026-03-29 05:49:57 +07:00
parent 69068fbee9
commit 87af246d71
1 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
packages/core/src/components/dialog/dialog-content.tsx
View File

@ -1,6 +1,6 @@
// packages/core/src/components/dialog/dialog-content.tsx // packages/core/src/components/dialog/dialog-content.tsx
import type { JSX } from "solid-js"; import type { JSX } from "solid-js";
import { Show, onCleanup, onMount, splitProps } from "solid-js"; import { Show, createEffect, onCleanup, splitProps } from "solid-js";
import { createDismiss } from "../../utilities/dismiss/create-dismiss"; import { createDismiss } from "../../utilities/dismiss/create-dismiss";
import { createFocusTrap } from "../../utilities/focus-trap/create-focus-trap"; import { createFocusTrap } from "../../utilities/focus-trap/create-focus-trap";
import { Portal } from "../../utilities/portal/portal"; import { Portal } from "../../utilities/portal/portal";
@ -42,18 +42,21 @@ export function DialogContent(props: DialogContentProps): JSX.Element {
onDismiss: () => ctx.setOpen(false), onDismiss: () => ctx.setOpen(false),
}); });
onMount(() => { createEffect(() => {
if (ctx.isOpen() && ctx.modal()) { if (ctx.isOpen() && ctx.modal()) {
focusTrap.activate(); focusTrap.activate();
scrollLock.lock(); scrollLock.lock();
dismiss.attach(); dismiss.attach();
} else {
focusTrap.deactivate();
scrollLock.unlock();
dismiss.detach();
} }
}); onCleanup(() => {
focusTrap.deactivate();
onCleanup(() => { scrollLock.unlock();
focusTrap.deactivate(); dismiss.detach();
scrollLock.unlock(); });
dismiss.detach();
}); });
return ( return (