@camunda/design-system 0.32.2 → 0.33.0
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.
- package/dist/src/components/ui/alert-dialog.d.ts +9 -1
- package/dist/src/components/ui/alert-dialog.d.ts.map +1 -1
- package/dist/src/components/ui/alert-dialog.js +8 -3
- package/dist/src/components/ui/alert-dialog.js.map +1 -1
- package/dist/src/components/ui/dialog.d.ts +9 -1
- package/dist/src/components/ui/dialog.d.ts.map +1 -1
- package/dist/src/components/ui/dialog.js +10 -3
- package/dist/src/components/ui/dialog.js.map +1 -1
- package/dist/src/components/ui/dropdown.d.ts +11 -1
- package/dist/src/components/ui/dropdown.d.ts.map +1 -1
- package/dist/src/components/ui/dropdown.js +9 -5
- package/dist/src/components/ui/dropdown.js.map +1 -1
- package/dist/src/components/ui/popover.d.ts +9 -1
- package/dist/src/components/ui/popover.d.ts.map +1 -1
- package/dist/src/components/ui/popover.js +8 -3
- package/dist/src/components/ui/popover.js.map +1 -1
- package/dist/src/components/ui/select.d.ts +10 -1
- package/dist/src/components/ui/select.d.ts.map +1 -1
- package/dist/src/components/ui/select.js +9 -5
- package/dist/src/components/ui/select.js.map +1 -1
- package/dist/src/components/ui/sheet.d.ts +8 -1
- package/dist/src/components/ui/sheet.d.ts.map +1 -1
- package/dist/src/components/ui/sheet.js +8 -3
- package/dist/src/components/ui/sheet.js.map +1 -1
- package/dist/src/lib/focus-visible-on-close.d.ts +34 -4
- package/dist/src/lib/focus-visible-on-close.d.ts.map +1 -1
- package/dist/src/lib/focus-visible-on-close.js +86 -18
- package/dist/src/lib/focus-visible-on-close.js.map +1 -1
- package/package.json +1 -1
|
@@ -4,7 +4,15 @@ declare function AlertDialog({ ...props }: React.ComponentProps<typeof AlertDial
|
|
|
4
4
|
declare function AlertDialogTrigger({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>): React.JSX.Element;
|
|
5
5
|
declare function AlertDialogPortal({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Portal>): React.JSX.Element;
|
|
6
6
|
declare function AlertDialogOverlay({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>): React.JSX.Element;
|
|
7
|
-
declare function AlertDialogContent({ className, onCloseAutoFocus, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content>
|
|
7
|
+
declare function AlertDialogContent({ className, onOpenAutoFocus, onCloseAutoFocus, restoreFocusRef, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {
|
|
8
|
+
/**
|
|
9
|
+
* Element to refocus when the dialog closes, instead of the auto-captured
|
|
10
|
+
* launcher. Required when the launcher isn't the focused element at open
|
|
11
|
+
* time — e.g. a `DropdownMenuItem` that opens this dialog. Point it at a
|
|
12
|
+
* still-mounted element, typically the menu's own trigger.
|
|
13
|
+
*/
|
|
14
|
+
restoreFocusRef?: React.RefObject<HTMLElement | null>;
|
|
15
|
+
}): React.JSX.Element;
|
|
8
16
|
declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
|
|
9
17
|
declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
|
|
10
18
|
declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Title>): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAW/D,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,qBAExD;AAED,iBAAS,kBAAkB,CAAC,EAC1B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,qBAI3D;AAED,iBAAS,iBAAiB,CAAC,EACzB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,MAAM,CAAC,qBAI1D;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,qBAW3D;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG;IAC7D;;;;;OAKG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACvD,qBA8BA;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQ7B;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7B;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,KAAK,CAAC,qBAWzD;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,WAAW,CAAC,qBAQ/D;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,MAAM,CAAC,qBAO1D;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,MAAM,CAAC,qBAO1D;AAED,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,GAClB,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { AlertDialog as AlertDialogPrimitive } from "radix-ui";
|
|
5
5
|
import { cn } from "../../lib/utils.js";
|
|
6
|
-
import { composeCloseAutoFocus } from "../../lib/focus-visible-on-close.js";
|
|
6
|
+
import { composeCloseAutoFocus, composeOpenAutoFocus, useDialogFocusReturn, } from "../../lib/focus-visible-on-close.js";
|
|
7
7
|
import { C4Provider } from "./c4-provider.js";
|
|
8
8
|
import { buttonVariants } from "./button.js";
|
|
9
9
|
function AlertDialog({ ...props }) {
|
|
@@ -18,11 +18,16 @@ function AlertDialogPortal({ ...props }) {
|
|
|
18
18
|
function AlertDialogOverlay({ className, ...props }) {
|
|
19
19
|
return (_jsx(AlertDialogPrimitive.Overlay, { "data-slot": "alert-dialog-overlay", className: cn("fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0", className), ...props }));
|
|
20
20
|
}
|
|
21
|
-
function AlertDialogContent({ className, onCloseAutoFocus, ...props }) {
|
|
21
|
+
function AlertDialogContent({ className, onOpenAutoFocus, onCloseAutoFocus, restoreFocusRef, ...props }) {
|
|
22
|
+
const dialogFocusReturn = useDialogFocusReturn(restoreFocusRef);
|
|
22
23
|
return (_jsx(AlertDialogPortal, { children: _jsxs(C4Provider, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Content, { "data-slot": "alert-dialog-content",
|
|
24
|
+
// #26413 — restore focus to the real launcher on close, even for
|
|
25
|
+
// controlled-`open` usage with no `AlertDialogTrigger` (see
|
|
26
|
+
// focus-visible-on-close).
|
|
27
|
+
onOpenAutoFocus: composeOpenAutoFocus(onOpenAutoFocus, dialogFocusReturn.onOpenAutoFocus),
|
|
23
28
|
// #259 — make the trigger's restored focus ring visible on a mouse
|
|
24
29
|
// close (see focus-visible-on-close).
|
|
25
|
-
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus), className: cn("fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-border duration-100 outline-none sm:max-w-sm data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95", className), ...props })] }) }));
|
|
30
|
+
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus, dialogFocusReturn.onCloseAutoFocus), className: cn("fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-border duration-100 outline-none sm:max-w-sm data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95", className), ...props })] }) }));
|
|
26
31
|
}
|
|
27
32
|
function AlertDialogHeader({ className, ...props }) {
|
|
28
33
|
return (_jsx("div", { "data-slot": "alert-dialog-header", className: cn("flex flex-col gap-2", className), ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog.js","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAE/D,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,
|
|
1
|
+
{"version":3,"file":"alert-dialog.js","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"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"}
|
|
@@ -5,8 +5,16 @@ declare function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogP
|
|
|
5
5
|
declare function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>): React.JSX.Element;
|
|
6
6
|
declare function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): React.JSX.Element;
|
|
7
7
|
declare function DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>): React.JSX.Element;
|
|
8
|
-
declare function DialogContent({ className, children, showCloseButton, onCloseAutoFocus, ...props }: React.ComponentProps<typeof DialogPrimitive.Content> & {
|
|
8
|
+
declare function DialogContent({ className, children, showCloseButton, onOpenAutoFocus, onCloseAutoFocus, restoreFocusRef, ...props }: React.ComponentProps<typeof DialogPrimitive.Content> & {
|
|
9
9
|
showCloseButton?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* Element to refocus when the dialog closes, instead of the auto-captured
|
|
12
|
+
* launcher. Required when the launcher isn't the focused element at open
|
|
13
|
+
* time — e.g. a `DropdownMenuItem` that opens this dialog (the menu, and
|
|
14
|
+
* the item with it, unmounts before the dialog's `onOpenAutoFocus` runs).
|
|
15
|
+
* Point it at a still-mounted element, typically the menu's own trigger.
|
|
16
|
+
*/
|
|
17
|
+
restoreFocusRef?: React.RefObject<HTMLElement | null>;
|
|
10
18
|
}): React.JSX.Element;
|
|
11
19
|
declare function DialogHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
|
|
12
20
|
declare function DialogBody({ className, children, style, ...props }: React.ComponentProps<"div">): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AAYrD,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,qBAEnD;AAED,iBAAS,aAAa,CAAC,EACrB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,qBAEtD;AAED,iBAAS,YAAY,CAAC,EACpB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,CAAC,qBAErD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAEpD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,qBAWtD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,eAAsB,EACtB,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACvD,qBA4EA;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQzE;AAQD,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAkH7B;AAED,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,eAAuB,EACvB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,qBAkBA;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAWpD;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,WAAW,CAAC,qBAW1D;AAED,OAAO,EACL,MAAM,EACN,UAAU,EACV,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,GACd,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { Dialog as DialogPrimitive } from "radix-ui";
|
|
5
5
|
import { cn } from "../../lib/utils.js";
|
|
6
|
-
import { composeCloseAutoFocus } from "../../lib/focus-visible-on-close.js";
|
|
6
|
+
import { composeCloseAutoFocus, composeOpenAutoFocus, useDialogFocusReturn, } from "../../lib/focus-visible-on-close.js";
|
|
7
7
|
import { C4Provider } from "./c4-provider.js";
|
|
8
8
|
import { Button } from "../ui/button.js";
|
|
9
9
|
import { XIcon } from "lucide-react";
|
|
@@ -22,14 +22,21 @@ function DialogClose({ ...props }) {
|
|
|
22
22
|
function DialogOverlay({ className, ...props }) {
|
|
23
23
|
return (_jsx(DialogPrimitive.Overlay, { "data-slot": "dialog-overlay", className: cn("fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0", className), ...props }));
|
|
24
24
|
}
|
|
25
|
-
function DialogContent({ className, children, showCloseButton = true, onCloseAutoFocus, ...props }) {
|
|
25
|
+
function DialogContent({ className, children, showCloseButton = true, onOpenAutoFocus, onCloseAutoFocus, restoreFocusRef, ...props }) {
|
|
26
|
+
const dialogFocusReturn = useDialogFocusReturn(restoreFocusRef);
|
|
26
27
|
return (_jsx(DialogPortal, { children: _jsxs(C4Provider, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { "data-slot": "dialog-content",
|
|
28
|
+
// #26413 — Radix's native close-restore only works when it owns
|
|
29
|
+
// the element that opened the dialog (a `DialogTrigger` still
|
|
30
|
+
// mounted at close time); it fails for controlled-`open` usage with
|
|
31
|
+
// no trigger. `useDialogFocusReturn` captures the real launcher at
|
|
32
|
+
// open and refocuses it at close (see focus-visible-on-close).
|
|
33
|
+
onOpenAutoFocus: composeOpenAutoFocus(onOpenAutoFocus, dialogFocusReturn.onOpenAutoFocus),
|
|
27
34
|
// #259 — Radix restores focus to the trigger with a programmatic
|
|
28
35
|
// `.focus()`; on a mouse close that leaves the trigger focused but
|
|
29
36
|
// ring-less. Stamp a transient marker so the ring shows regardless of
|
|
30
37
|
// input modality (runs after the consumer's handler, no-op if it
|
|
31
38
|
// prevented the default restore).
|
|
32
|
-
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus), className: cn(
|
|
39
|
+
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus, dialogFocusReturn.onCloseAutoFocus), className: cn(
|
|
33
40
|
// Mobile inset uses `w-[calc(100%-2rem)]` (a width constraint that
|
|
34
41
|
// actually shrinks the border box) instead of the previous
|
|
35
42
|
// `max-w-[calc(100%-2rem)]`. Using a base-variant `max-w-*` for
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../../../src/components/ui/dialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AAErD,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,
|
|
1
|
+
{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../../../src/components/ui/dialog.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,7 +3,17 @@ import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
|
|
|
3
3
|
declare function DropdownMenu({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Root>): React.JSX.Element;
|
|
4
4
|
declare function DropdownMenuPortal({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>): React.JSX.Element;
|
|
5
5
|
declare function DropdownMenuTrigger({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>): React.JSX.Element;
|
|
6
|
-
declare function DropdownMenuContent({ className, sideOffset, onCloseAutoFocus, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Content>
|
|
6
|
+
declare function DropdownMenuContent({ className, sideOffset, onCloseAutoFocus, restoreFocusRef, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Content> & {
|
|
7
|
+
/**
|
|
8
|
+
* Element to refocus when the menu closes, instead of the default restore
|
|
9
|
+
* target. Radix's underlying `Menu.Content` doesn't expose
|
|
10
|
+
* `onOpenAutoFocus` (it's reserved for the menu's own internal
|
|
11
|
+
* roving-focus/submenu handling), so unlike Dialog/AlertDialog/Sheet/Popover
|
|
12
|
+
* this component cannot auto-capture the launcher — pass this explicitly
|
|
13
|
+
* for any non-`DropdownMenuTrigger` launcher (e.g. opened programmatically).
|
|
14
|
+
*/
|
|
15
|
+
restoreFocusRef?: React.RefObject<HTMLElement | null>;
|
|
16
|
+
}): React.JSX.Element;
|
|
7
17
|
declare function DropdownMenuGroup({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Group>): React.JSX.Element;
|
|
8
18
|
declare function DropdownMenuItem({ className, inset, variant, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
|
|
9
19
|
inset?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dropdown.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,IAAI,qBAAqB,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dropdown.tsx"],"names":[],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ import * as React from "react";
|
|
|
4
4
|
import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
|
|
5
5
|
import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
|
|
6
6
|
import { cn } from "../../lib/utils.js";
|
|
7
|
-
import { composeCloseAutoFocus } from "../../lib/focus-visible-on-close.js";
|
|
7
|
+
import { composeCloseAutoFocus, useDialogFocusReturn, } from "../../lib/focus-visible-on-close.js";
|
|
8
8
|
import { C4Provider } from "./c4-provider.js";
|
|
9
9
|
function DropdownMenu({ ...props }) {
|
|
10
10
|
return _jsx(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
|
|
@@ -15,11 +15,15 @@ function DropdownMenuPortal({ ...props }) {
|
|
|
15
15
|
function DropdownMenuTrigger({ ...props }) {
|
|
16
16
|
return (_jsx(DropdownMenuPrimitive.Trigger, { "data-slot": "dropdown-menu-trigger", ...props }));
|
|
17
17
|
}
|
|
18
|
-
function DropdownMenuContent({ className, sideOffset = 4, onCloseAutoFocus, ...props }) {
|
|
18
|
+
function DropdownMenuContent({ className, sideOffset = 4, onCloseAutoFocus, restoreFocusRef, ...props }) {
|
|
19
|
+
const dialogFocusReturn = useDialogFocusReturn(restoreFocusRef);
|
|
19
20
|
return (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(C4Provider, { children: _jsx(DropdownMenuPrimitive.Content, { "data-slot": "dropdown-menu-content", sideOffset: sideOffset,
|
|
20
|
-
// #259
|
|
21
|
-
//
|
|
22
|
-
|
|
21
|
+
// #259 / #26413 — restore focus to `restoreFocusRef` if passed,
|
|
22
|
+
// else fall back to Radix's native trigger-restore, and make the
|
|
23
|
+
// restored focus ring visible on a mouse close (see
|
|
24
|
+
// focus-visible-on-close). No `onOpenAutoFocus` auto-capture here —
|
|
25
|
+
// Radix's Menu.Content doesn't expose that hook.
|
|
26
|
+
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus, dialogFocusReturn.onCloseAutoFocus), className: cn("relative z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-36 origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-border data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95", className), ...props }) }) }));
|
|
23
27
|
}
|
|
24
28
|
function DropdownMenuGroup({ ...props }) {
|
|
25
29
|
return (_jsx(DropdownMenuPrimitive.Group, { "data-slot": "dropdown-menu-group", ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../../src/components/ui/dropdown.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,IAAI,qBAAqB,EAAE,MAAM,UAAU,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAEvE,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,
|
|
1
|
+
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../../src/components/ui/dropdown.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,7 +2,15 @@ import * as React from "react";
|
|
|
2
2
|
import { Popover as PopoverPrimitive } from "radix-ui";
|
|
3
3
|
declare function Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>): React.JSX.Element;
|
|
4
4
|
declare function PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>): React.JSX.Element;
|
|
5
|
-
declare function PopoverContent({ className, align, sideOffset, onCloseAutoFocus, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content>
|
|
5
|
+
declare function PopoverContent({ className, align, sideOffset, onOpenAutoFocus, onCloseAutoFocus, restoreFocusRef, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content> & {
|
|
6
|
+
/**
|
|
7
|
+
* Element to refocus when the popover closes, instead of the auto-captured
|
|
8
|
+
* launcher. Required when the launcher isn't the focused element at open
|
|
9
|
+
* time — e.g. a `DropdownMenuItem` that opens this popover. Point it at a
|
|
10
|
+
* still-mounted element, typically the menu's own trigger.
|
|
11
|
+
*/
|
|
12
|
+
restoreFocusRef?: React.RefObject<HTMLElement | null>;
|
|
13
|
+
}): React.JSX.Element;
|
|
6
14
|
declare function PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>): React.JSX.Element;
|
|
7
15
|
declare function PopoverHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
|
|
8
16
|
declare function PopoverTitle({ className, ...props }: React.ComponentProps<"h2">): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAUvD,iBAAS,OAAO,CAAC,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,qBAEpD;AAED,iBAAS,cAAc,CAAC,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,qBAEvD;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,KAAgB,EAChB,UAAc,EACd,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,GAAG;IACzD;;;;;OAKG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACvD,qBA+BA;AAED,iBAAS,aAAa,CAAC,EACrB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,MAAM,CAAC,qBAEtD;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQ1E;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,qBAQxE;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,qBAQ3B;AAED,OAAO,EACL,OAAO,EACP,aAAa,EACb,cAAc,EACd,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,cAAc,GACf,CAAC"}
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import { Popover as PopoverPrimitive } from "radix-ui";
|
|
4
4
|
import { cn } from "../../lib/utils.js";
|
|
5
|
-
import { composeCloseAutoFocus } from "../../lib/focus-visible-on-close.js";
|
|
5
|
+
import { composeCloseAutoFocus, composeOpenAutoFocus, useDialogFocusReturn, } from "../../lib/focus-visible-on-close.js";
|
|
6
6
|
import { C4Provider } from "./c4-provider.js";
|
|
7
7
|
function Popover({ ...props }) {
|
|
8
8
|
return _jsx(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
|
|
@@ -10,11 +10,16 @@ function Popover({ ...props }) {
|
|
|
10
10
|
function PopoverTrigger({ ...props }) {
|
|
11
11
|
return _jsx(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
|
|
12
12
|
}
|
|
13
|
-
function PopoverContent({ className, align = "center", sideOffset = 4, onCloseAutoFocus, ...props }) {
|
|
13
|
+
function PopoverContent({ className, align = "center", sideOffset = 4, onOpenAutoFocus, onCloseAutoFocus, restoreFocusRef, ...props }) {
|
|
14
|
+
const dialogFocusReturn = useDialogFocusReturn(restoreFocusRef);
|
|
14
15
|
return (_jsx(PopoverPrimitive.Portal, { children: _jsx(C4Provider, { children: _jsx(PopoverPrimitive.Content, { "data-slot": "popover-content", align: align, sideOffset: sideOffset,
|
|
16
|
+
// #26413 — restore focus to the real launcher on close, even for
|
|
17
|
+
// controlled-`open` usage with no `PopoverTrigger` (see
|
|
18
|
+
// focus-visible-on-close).
|
|
19
|
+
onOpenAutoFocus: composeOpenAutoFocus(onOpenAutoFocus, dialogFocusReturn.onOpenAutoFocus),
|
|
15
20
|
// #259 — make the trigger's restored focus ring visible on a mouse
|
|
16
21
|
// close (see focus-visible-on-close).
|
|
17
|
-
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus), className: cn("z-50 flex w-72 origin-(--radix-popover-content-transform-origin) flex-col gap-2.5 rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-border outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className), ...props }) }) }));
|
|
22
|
+
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus, dialogFocusReturn.onCloseAutoFocus), className: cn("z-50 flex w-72 origin-(--radix-popover-content-transform-origin) flex-col gap-2.5 rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-border outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className), ...props }) }) }));
|
|
18
23
|
}
|
|
19
24
|
function PopoverAnchor({ ...props }) {
|
|
20
25
|
return _jsx(PopoverPrimitive.Anchor, { "data-slot": "popover-anchor", ...props });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover.js","sourceRoot":"","sources":["../../../../src/components/ui/popover.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEvD,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,
|
|
1
|
+
{"version":3,"file":"popover.js","sourceRoot":"","sources":["../../../../src/components/ui/popover.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEvD,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,EACL,qBAAqB,EACrB,oBAAoB,EACpB,oBAAoB,GACrB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,SAAS,OAAO,CAAC,EACf,GAAG,KAAK,EAC2C;IACnD,OAAO,KAAC,gBAAgB,CAAC,IAAI,iBAAW,SAAS,KAAK,KAAK,GAAI,CAAC;AAClE,CAAC;AAED,SAAS,cAAc,CAAC,EACtB,GAAG,KAAK,EAC8C;IACtD,OAAO,KAAC,gBAAgB,CAAC,OAAO,iBAAW,iBAAiB,KAAK,KAAK,GAAI,CAAC;AAC7E,CAAC;AAED,SAAS,cAAc,CAAC,EACtB,SAAS,EACT,KAAK,GAAG,QAAQ,EAChB,UAAU,GAAG,CAAC,EACd,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,GAAG,KAAK,EAST;IACC,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,eAAe,CAAC,CAAC;IAChE,OAAO,CACL,KAAC,gBAAgB,CAAC,MAAM,cACtB,KAAC,UAAU,cACT,KAAC,gBAAgB,CAAC,OAAO,iBACb,iBAAiB,EAC3B,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU;gBACtB,iEAAiE;gBACjE,wDAAwD;gBACxD,2BAA2B;gBAC3B,eAAe,EAAE,oBAAoB,CACnC,eAAe,EACf,iBAAiB,CAAC,eAAe,CAClC;gBACD,mEAAmE;gBACnE,sCAAsC;gBACtC,gBAAgB,EAAE,qBAAqB,CACrC,gBAAgB,EAChB,iBAAiB,CAAC,gBAAgB,CACnC,EACD,SAAS,EAAE,EAAE,CACX,yeAAye,EACze,SAAS,CACV,KACG,KAAK,GACT,GACS,GACW,CAC3B,CAAC;AACJ,CAAC;AAED,SAAS,aAAa,CAAC,EACrB,GAAG,KAAK,EAC6C;IACrD,OAAO,KAAC,gBAAgB,CAAC,MAAM,iBAAW,gBAAgB,KAAK,KAAK,GAAI,CAAC;AAC3E,CAAC;AAED,SAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACzE,OAAO,CACL,2BACY,gBAAgB,EAC1B,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,SAAS,CAAC,KACrD,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA8B;IACvE,OAAO,CACL,2BACY,eAAe,EACzB,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,SAAS,CAAC,KACnC,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACkB;IAC1B,OAAO,CACL,yBACY,qBAAqB,EAC/B,SAAS,EAAE,EAAE,CAAC,gCAAgC,EAAE,SAAS,CAAC,KACtD,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EACL,OAAO,EACP,aAAa,EACb,cAAc,EACd,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,cAAc,GACf,CAAC"}
|
|
@@ -6,7 +6,16 @@ declare function SelectValue({ ...props }: React.ComponentProps<typeof SelectPri
|
|
|
6
6
|
declare function SelectTrigger({ className, size, children, ...props }: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
|
|
7
7
|
size?: "sm" | "default";
|
|
8
8
|
}): React.JSX.Element;
|
|
9
|
-
declare function SelectContent({ className, children, position, onCloseAutoFocus, ...props }: React.ComponentProps<typeof SelectPrimitive.Content>
|
|
9
|
+
declare function SelectContent({ className, children, position, onCloseAutoFocus, restoreFocusRef, ...props }: React.ComponentProps<typeof SelectPrimitive.Content> & {
|
|
10
|
+
/**
|
|
11
|
+
* Element to refocus when the select closes, instead of the default
|
|
12
|
+
* restore target. Radix's `Select.Content` doesn't expose `onOpenAutoFocus`
|
|
13
|
+
* (it manages open-focus internally, to land on the selected item), so
|
|
14
|
+
* unlike the other 5 DS overlays this component cannot auto-capture the
|
|
15
|
+
* launcher — pass this explicitly for any non-`SelectTrigger` launcher.
|
|
16
|
+
*/
|
|
17
|
+
restoreFocusRef?: React.RefObject<HTMLElement | null>;
|
|
18
|
+
}): React.JSX.Element;
|
|
10
19
|
declare function SelectLabel({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Label>): React.JSX.Element;
|
|
11
20
|
declare function SelectItem({ className, children, ...props }: React.ComponentProps<typeof SelectPrimitive.Item>): React.JSX.Element;
|
|
12
21
|
declare function SelectSeparator({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Separator>): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AAUrD,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,qBAEnD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAEpD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAEpD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,IAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxD,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC;CACzB,qBAiBA;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,QAAmB,EACnB,gBAAgB,EAChB,eAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxD;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACvD,qBAwCA;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAWpD;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,qBAkBnD;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,SAAS,CAAC,qBAQxD;AAED,iBAAS,oBAAoB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,cAAc,CAAC,qBAa7D;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,gBAAgB,CAAC,qBAa/D;AAED,OAAO,EACL,MAAM,EACN,aAAa,EACb,WAAW,EACX,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,WAAW,GACZ,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { Select as SelectPrimitive } from "radix-ui";
|
|
5
5
|
import { cn } from "../../lib/utils.js";
|
|
6
|
-
import { composeCloseAutoFocus } from "../../lib/focus-visible-on-close.js";
|
|
6
|
+
import { composeCloseAutoFocus, useDialogFocusReturn, } from "../../lib/focus-visible-on-close.js";
|
|
7
7
|
import { C4Provider } from "./c4-provider.js";
|
|
8
8
|
import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react";
|
|
9
9
|
function Select({ ...props }) {
|
|
@@ -18,11 +18,15 @@ function SelectValue({ ...props }) {
|
|
|
18
18
|
function SelectTrigger({ className, size = "default", children, ...props }) {
|
|
19
19
|
return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": size, className: cn("flex w-fit min-w-0 items-center justify-between gap-2 rounded-lg border border-input bg-input-background px-3 py-2 text-sm whitespace-nowrap transition-all duration-200 outline-none select-none focus-visible:border-primary-border-strong dark:focus-visible:border-primary-border-subtle focus-visible:ring-3 focus-visible:ring-ring data-[focus-visible-restore]:border-primary-border-strong dark:data-[focus-visible-restore]:border-primary-border-subtle data-[focus-visible-restore]:ring-3 data-[focus-visible-restore]:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-danger-action-default aria-invalid:ring-3 aria-invalid:ring-danger-action-default/20 data-placeholder:text-neutral-foreground-subtle data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:hover:bg-neutral-background-medium dark:aria-invalid:border-danger-action-default/50 dark:aria-invalid:ring-danger-action-default/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDownIcon, { className: "pointer-events-none size-4 opacity-50" }) })] }));
|
|
20
20
|
}
|
|
21
|
-
function SelectContent({ className, children, position = "popper", onCloseAutoFocus, ...props }) {
|
|
21
|
+
function SelectContent({ className, children, position = "popper", onCloseAutoFocus, restoreFocusRef, ...props }) {
|
|
22
|
+
const dialogFocusReturn = useDialogFocusReturn(restoreFocusRef);
|
|
22
23
|
return (_jsx(SelectPrimitive.Portal, { children: _jsx(C4Provider, { children: _jsxs(SelectPrimitive.Content, { "data-slot": "select-content",
|
|
23
|
-
// #259
|
|
24
|
-
//
|
|
25
|
-
|
|
24
|
+
// #259 / #26413 — restore focus to `restoreFocusRef` if passed,
|
|
25
|
+
// else fall back to Radix's native trigger-restore, and make the
|
|
26
|
+
// restored focus ring visible on a mouse close (see
|
|
27
|
+
// focus-visible-on-close). No `onOpenAutoFocus` auto-capture here —
|
|
28
|
+
// Radix's Select.Content doesn't expose that hook.
|
|
29
|
+
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus, dialogFocusReturn.onCloseAutoFocus), className: cn("relative z-50 max-h-(--radix-select-content-available-height) min-w-36 origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-input bg-popover text-popover-foreground shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", position === "popper" &&
|
|
26
30
|
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className), position: position, ...props, children: [_jsx(SelectScrollUpButton, {}), _jsx(SelectPrimitive.Viewport, { className: cn("p-1", position === "popper" &&
|
|
27
31
|
"h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width) scroll-my-1"), children: children }), _jsx(SelectScrollDownButton, {})] }) }) }));
|
|
28
32
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","sourceRoot":"","sources":["../../../../src/components/ui/select.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AAErD,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,
|
|
1
|
+
{"version":3,"file":"select.js","sourceRoot":"","sources":["../../../../src/components/ui/select.tsx"],"names":[],"mappings":"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"}
|
|
@@ -9,8 +9,15 @@ declare function SheetOverlay({ className, ...props }: React.ComponentProps<type
|
|
|
9
9
|
declare const sheetVariants: (props?: ({
|
|
10
10
|
side?: "left" | "right" | "top" | "bottom" | null | undefined;
|
|
11
11
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
12
|
-
declare function SheetContent({ className, children, side, showCloseButton, onCloseAutoFocus, ...props }: React.ComponentProps<typeof SheetPrimitive.Content> & VariantProps<typeof sheetVariants> & {
|
|
12
|
+
declare function SheetContent({ className, children, side, showCloseButton, onOpenAutoFocus, onCloseAutoFocus, restoreFocusRef, ...props }: React.ComponentProps<typeof SheetPrimitive.Content> & VariantProps<typeof sheetVariants> & {
|
|
13
13
|
showCloseButton?: boolean;
|
|
14
|
+
/**
|
|
15
|
+
* Element to refocus when the sheet closes, instead of the auto-captured
|
|
16
|
+
* launcher. Required when the launcher isn't the focused element at open
|
|
17
|
+
* time — e.g. a `DropdownMenuItem` that opens this sheet. Point it at a
|
|
18
|
+
* still-mounted element, typically the menu's own trigger.
|
|
19
|
+
*/
|
|
20
|
+
restoreFocusRef?: React.RefObject<HTMLElement | null>;
|
|
14
21
|
}): React.JSX.Element;
|
|
15
22
|
declare function SheetHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
|
|
16
23
|
declare function SheetFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sheet.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/sheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"sheet.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/sheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAYlE,iBAAS,KAAK,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,IAAI,CAAC,qBAE5E;AAED,iBAAS,YAAY,CAAC,EACpB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,OAAO,CAAC,qBAErD;AAED,iBAAS,UAAU,CAAC,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,KAAK,CAAC,qBAEnD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,MAAM,CAAC,qBAEpD;AAED,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,OAAO,CAAC,qBAcrD;AAED,QAAA,MAAM,aAAa;;8EAelB,CAAC;AAEF,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,IAAa,EACb,eAAsB,EACtB,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,OAAO,CAAC,GACpD,YAAY,CAAC,OAAO,aAAa,CAAC,GAAG;IACnC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACvD,qBA0CF;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,KAAK,CAAC,qBAWnD;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,WAAW,CAAC,qBAQzD;AAED,OAAO,EACL,KAAK,EACL,UAAU,EACV,YAAY,EACZ,gBAAgB,EAChB,WAAW,EACX,WAAW,EACX,YAAY,EACZ,WAAW,EACX,aAAa,EACb,UAAU,EACV,YAAY,GACb,CAAC"}
|
|
@@ -5,7 +5,7 @@ import { Dialog as SheetPrimitive } from "radix-ui";
|
|
|
5
5
|
import { cva } from "class-variance-authority";
|
|
6
6
|
import { XIcon } from "lucide-react";
|
|
7
7
|
import { cn } from "../../lib/utils.js";
|
|
8
|
-
import { composeCloseAutoFocus } from "../../lib/focus-visible-on-close.js";
|
|
8
|
+
import { composeCloseAutoFocus, composeOpenAutoFocus, useDialogFocusReturn, } from "../../lib/focus-visible-on-close.js";
|
|
9
9
|
import { C4Provider } from "./c4-provider.js";
|
|
10
10
|
import { Button } from "../ui/button.js";
|
|
11
11
|
function Sheet({ ...props }) {
|
|
@@ -38,11 +38,16 @@ const sheetVariants = cva("fixed z-50 flex flex-col bg-popover text-sm text-popo
|
|
|
38
38
|
},
|
|
39
39
|
defaultVariants: { side: "left" },
|
|
40
40
|
});
|
|
41
|
-
function SheetContent({ className, children, side = "left", showCloseButton = true, onCloseAutoFocus, ...props }) {
|
|
41
|
+
function SheetContent({ className, children, side = "left", showCloseButton = true, onOpenAutoFocus, onCloseAutoFocus, restoreFocusRef, ...props }) {
|
|
42
|
+
const dialogFocusReturn = useDialogFocusReturn(restoreFocusRef);
|
|
42
43
|
return (_jsx(SheetPortal, { children: _jsxs(C4Provider, { children: [_jsx(SheetOverlay, {}), _jsxs(SheetPrimitive.Content, { "data-slot": "sheet-content", "data-side": side,
|
|
44
|
+
// #26413 — restore focus to the real launcher on close, even for
|
|
45
|
+
// controlled-`open` usage with no `SheetTrigger` (see
|
|
46
|
+
// focus-visible-on-close).
|
|
47
|
+
onOpenAutoFocus: composeOpenAutoFocus(onOpenAutoFocus, dialogFocusReturn.onOpenAutoFocus),
|
|
43
48
|
// #259 — make the trigger's restored focus ring visible on a mouse
|
|
44
49
|
// close (see focus-visible-on-close).
|
|
45
|
-
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus), className: cn(sheetVariants({ side }), className), ...props, children: [children, showCloseButton && (_jsx(SheetPrimitive.Close, { "data-slot": "sheet-close", asChild: true, children: _jsxs(Button, { variant: "ghost", className: "absolute top-2 right-2", size: "icon-sm", children: [_jsx(XIcon, {}), _jsx("span", { className: "sr-only", children: "Close" })] }) }))] })] }) }));
|
|
50
|
+
onCloseAutoFocus: composeCloseAutoFocus(onCloseAutoFocus, dialogFocusReturn.onCloseAutoFocus), className: cn(sheetVariants({ side }), className), ...props, children: [children, showCloseButton && (_jsx(SheetPrimitive.Close, { "data-slot": "sheet-close", asChild: true, children: _jsxs(Button, { variant: "ghost", className: "absolute top-2 right-2", size: "icon-sm", children: [_jsx(XIcon, {}), _jsx("span", { className: "sr-only", children: "Close" })] }) }))] })] }) }));
|
|
46
51
|
}
|
|
47
52
|
function SheetHeader({ className, ...props }) {
|
|
48
53
|
return (_jsx("div", { "data-slot": "sheet-header", className: cn("flex flex-col gap-1.5 p-4", className), ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sheet.js","sourceRoot":"","sources":["../../../../src/components/ui/sheet.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAErC,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,
|
|
1
|
+
{"version":3,"file":"sheet.js","sourceRoot":"","sources":["../../../../src/components/ui/sheet.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as React from "react";
|
|
1
2
|
/**
|
|
2
3
|
* Makes the focus ring visible when a modal overlay restores focus to its
|
|
3
4
|
* trigger on close (#259 follow-up).
|
|
@@ -31,9 +32,38 @@ export declare const FOCUS_VISIBLE_RESTORE_ATTR = "data-focus-visible-restore";
|
|
|
31
32
|
export declare function markFocusVisibleOnClose(event: Event): void;
|
|
32
33
|
/**
|
|
33
34
|
* Wraps a Radix overlay `Content`'s `onCloseAutoFocus`: runs the consumer's
|
|
34
|
-
* handler first (so it can `preventDefault`), then
|
|
35
|
-
* marker.
|
|
36
|
-
* focus
|
|
35
|
+
* handler first (so it can `preventDefault`), then runs `defaultHandler`
|
|
36
|
+
* (default: the #259 focus-visible marker). Every DS overlay composes its
|
|
37
|
+
* default focus-RETURN handling (`useDialogFocusReturn`) through the second
|
|
38
|
+
* parameter instead of calling `markFocusVisibleOnClose` directly, since that
|
|
39
|
+
* handler already stamps the marker itself once it settles on a final target.
|
|
37
40
|
*/
|
|
38
|
-
export declare function composeCloseAutoFocus(handler?: (event: Event) => void): (event: Event) => void;
|
|
41
|
+
export declare function composeCloseAutoFocus(handler?: (event: Event) => void, defaultHandler?: (event: Event) => void): (event: Event) => void;
|
|
42
|
+
/** Same composition shape as {@link composeCloseAutoFocus}, for `onOpenAutoFocus`. */
|
|
43
|
+
export declare function composeOpenAutoFocus(handler: ((event: Event) => void) | undefined, defaultHandler: (event: Event) => void): (event: Event) => void;
|
|
44
|
+
/**
|
|
45
|
+
* Default focus-RETURN for DS overlay `Content` components (issue #26413).
|
|
46
|
+
*
|
|
47
|
+
* Radix's own close-restore only works when it owns the element that opened
|
|
48
|
+
* the overlay (a `<...Trigger>` still mounted at close time). It fails for the
|
|
49
|
+
* common controlled-`open` usage with no `Trigger` — e.g. a persistent
|
|
50
|
+
* `<Button onClick={() => setOpen(true)}>` — where focus falls back to
|
|
51
|
+
* `<body>` on close (a WCAG 2.4.3 regression).
|
|
52
|
+
*
|
|
53
|
+
* `onOpenAutoFocus` fires before Radix moves focus into the overlay, so
|
|
54
|
+
* `document.activeElement` at that point is still whatever launched it. We
|
|
55
|
+
* capture it (without `preventDefault` — Radix must still move focus in) and
|
|
56
|
+
* refocus it in `onCloseAutoFocus`.
|
|
57
|
+
*
|
|
58
|
+
* That auto-capture cannot recover a launcher that has already unmounted by
|
|
59
|
+
* open time — a `DropdownMenuItem` opening a dialog: the menu (and the item)
|
|
60
|
+
* closes and unmounts before `onOpenAutoFocus` runs, so `activeElement` is
|
|
61
|
+
* already `<body>`. Consumers in that shape must pass `restoreFocusRef`
|
|
62
|
+
* pointing at a still-mounted element (typically the menu's own trigger);
|
|
63
|
+
* `restoreFocusRef` always takes precedence over the auto-captured element.
|
|
64
|
+
*/
|
|
65
|
+
export declare function useDialogFocusReturn(restoreFocusRef?: React.RefObject<HTMLElement | null>): {
|
|
66
|
+
onOpenAutoFocus: (event: Event) => void;
|
|
67
|
+
onCloseAutoFocus: (event: Event) => void;
|
|
68
|
+
};
|
|
39
69
|
//# sourceMappingURL=focus-visible-on-close.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"focus-visible-on-close.d.ts","sourceRoot":"","sources":["../../../src/lib/focus-visible-on-close.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,eAAO,MAAM,0BAA0B,+BAA+B,CAAC;
|
|
1
|
+
{"version":3,"file":"focus-visible-on-close.d.ts","sourceRoot":"","sources":["../../../src/lib/focus-visible-on-close.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,eAAO,MAAM,0BAA0B,+BAA+B,CAAC;AA8BvE;;;;;;GAMG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAM1D;AAED;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,EAChC,cAAc,GAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAA8B,GAC/D,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAKxB;AAED,sFAAsF;AACtF,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,CAAC,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC,GAAG,SAAS,EAC7C,cAAc,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,GACrC,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAKxB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,oBAAoB,CAClC,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GACpD;IACD,eAAe,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACxC,gBAAgB,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CAC1C,CA6BA"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as React from "react";
|
|
1
2
|
/**
|
|
2
3
|
* Makes the focus ring visible when a modal overlay restores focus to its
|
|
3
4
|
* trigger on close (#259 follow-up).
|
|
@@ -21,6 +22,32 @@
|
|
|
21
22
|
* inert body-child mirror in `inert-aria-hidden.ts`.
|
|
22
23
|
*/
|
|
23
24
|
export const FOCUS_VISIBLE_RESTORE_ATTR = "data-focus-visible-restore";
|
|
25
|
+
function applyFocusVisibleMarker(el) {
|
|
26
|
+
el.setAttribute(FOCUS_VISIBLE_RESTORE_ATTR, "");
|
|
27
|
+
const clear = () => {
|
|
28
|
+
el.removeAttribute(FOCUS_VISIBLE_RESTORE_ATTR);
|
|
29
|
+
el.removeEventListener("blur", clear);
|
|
30
|
+
document.removeEventListener("pointerdown", clear, true);
|
|
31
|
+
};
|
|
32
|
+
el.addEventListener("blur", clear);
|
|
33
|
+
document.addEventListener("pointerdown", clear, true);
|
|
34
|
+
}
|
|
35
|
+
/**
|
|
36
|
+
* Stamps the marker on whatever `getElement()` resolves to, one frame later —
|
|
37
|
+
* late enough that a synchronous `.focus()` call earlier in the same tick has
|
|
38
|
+
* already committed, so `getElement` can sanity-check against
|
|
39
|
+
* `document.activeElement` before stamping.
|
|
40
|
+
*/
|
|
41
|
+
function scheduleFocusVisibleMarker(getElement) {
|
|
42
|
+
if (typeof requestAnimationFrame === "undefined")
|
|
43
|
+
return;
|
|
44
|
+
requestAnimationFrame(() => {
|
|
45
|
+
const el = getElement();
|
|
46
|
+
if (el == null)
|
|
47
|
+
return;
|
|
48
|
+
applyFocusVisibleMarker(el);
|
|
49
|
+
});
|
|
50
|
+
}
|
|
24
51
|
/**
|
|
25
52
|
* Use as a Radix overlay `Content`'s `onCloseAutoFocus`. Does not
|
|
26
53
|
* `preventDefault`, so Radix still restores focus to the trigger; on the next
|
|
@@ -29,33 +56,74 @@ export const FOCUS_VISIBLE_RESTORE_ATTR = "data-focus-visible-restore";
|
|
|
29
56
|
* restore.
|
|
30
57
|
*/
|
|
31
58
|
export function markFocusVisibleOnClose(event) {
|
|
32
|
-
if (event.defaultPrevented
|
|
59
|
+
if (event.defaultPrevented)
|
|
33
60
|
return;
|
|
34
|
-
|
|
35
|
-
requestAnimationFrame(() => {
|
|
61
|
+
scheduleFocusVisibleMarker(() => {
|
|
36
62
|
const el = document.activeElement;
|
|
37
|
-
|
|
38
|
-
return;
|
|
39
|
-
el.setAttribute(FOCUS_VISIBLE_RESTORE_ATTR, "");
|
|
40
|
-
const clear = () => {
|
|
41
|
-
el.removeAttribute(FOCUS_VISIBLE_RESTORE_ATTR);
|
|
42
|
-
el.removeEventListener("blur", clear);
|
|
43
|
-
document.removeEventListener("pointerdown", clear, true);
|
|
44
|
-
};
|
|
45
|
-
el.addEventListener("blur", clear);
|
|
46
|
-
document.addEventListener("pointerdown", clear, true);
|
|
63
|
+
return el instanceof HTMLElement && el !== document.body ? el : null;
|
|
47
64
|
});
|
|
48
65
|
}
|
|
49
66
|
/**
|
|
50
67
|
* Wraps a Radix overlay `Content`'s `onCloseAutoFocus`: runs the consumer's
|
|
51
|
-
* handler first (so it can `preventDefault`), then
|
|
52
|
-
* marker.
|
|
53
|
-
* focus
|
|
68
|
+
* handler first (so it can `preventDefault`), then runs `defaultHandler`
|
|
69
|
+
* (default: the #259 focus-visible marker). Every DS overlay composes its
|
|
70
|
+
* default focus-RETURN handling (`useDialogFocusReturn`) through the second
|
|
71
|
+
* parameter instead of calling `markFocusVisibleOnClose` directly, since that
|
|
72
|
+
* handler already stamps the marker itself once it settles on a final target.
|
|
54
73
|
*/
|
|
55
|
-
export function composeCloseAutoFocus(handler) {
|
|
74
|
+
export function composeCloseAutoFocus(handler, defaultHandler = markFocusVisibleOnClose) {
|
|
56
75
|
return (event) => {
|
|
57
76
|
handler?.(event);
|
|
58
|
-
|
|
77
|
+
defaultHandler(event);
|
|
59
78
|
};
|
|
60
79
|
}
|
|
80
|
+
/** Same composition shape as {@link composeCloseAutoFocus}, for `onOpenAutoFocus`. */
|
|
81
|
+
export function composeOpenAutoFocus(handler, defaultHandler) {
|
|
82
|
+
return (event) => {
|
|
83
|
+
handler?.(event);
|
|
84
|
+
defaultHandler(event);
|
|
85
|
+
};
|
|
86
|
+
}
|
|
87
|
+
/**
|
|
88
|
+
* Default focus-RETURN for DS overlay `Content` components (issue #26413).
|
|
89
|
+
*
|
|
90
|
+
* Radix's own close-restore only works when it owns the element that opened
|
|
91
|
+
* the overlay (a `<...Trigger>` still mounted at close time). It fails for the
|
|
92
|
+
* common controlled-`open` usage with no `Trigger` — e.g. a persistent
|
|
93
|
+
* `<Button onClick={() => setOpen(true)}>` — where focus falls back to
|
|
94
|
+
* `<body>` on close (a WCAG 2.4.3 regression).
|
|
95
|
+
*
|
|
96
|
+
* `onOpenAutoFocus` fires before Radix moves focus into the overlay, so
|
|
97
|
+
* `document.activeElement` at that point is still whatever launched it. We
|
|
98
|
+
* capture it (without `preventDefault` — Radix must still move focus in) and
|
|
99
|
+
* refocus it in `onCloseAutoFocus`.
|
|
100
|
+
*
|
|
101
|
+
* That auto-capture cannot recover a launcher that has already unmounted by
|
|
102
|
+
* open time — a `DropdownMenuItem` opening a dialog: the menu (and the item)
|
|
103
|
+
* closes and unmounts before `onOpenAutoFocus` runs, so `activeElement` is
|
|
104
|
+
* already `<body>`. Consumers in that shape must pass `restoreFocusRef`
|
|
105
|
+
* pointing at a still-mounted element (typically the menu's own trigger);
|
|
106
|
+
* `restoreFocusRef` always takes precedence over the auto-captured element.
|
|
107
|
+
*/
|
|
108
|
+
export function useDialogFocusReturn(restoreFocusRef) {
|
|
109
|
+
const capturedFocusRef = React.useRef(null);
|
|
110
|
+
const onOpenAutoFocus = React.useCallback(() => {
|
|
111
|
+
const active = document.activeElement;
|
|
112
|
+
capturedFocusRef.current =
|
|
113
|
+
active instanceof HTMLElement && active !== document.body ? active : null;
|
|
114
|
+
}, []);
|
|
115
|
+
const onCloseAutoFocus = React.useCallback((event) => {
|
|
116
|
+
if (event.defaultPrevented)
|
|
117
|
+
return;
|
|
118
|
+
const target = restoreFocusRef?.current ?? capturedFocusRef.current;
|
|
119
|
+
if (target != null && target.isConnected) {
|
|
120
|
+
event.preventDefault();
|
|
121
|
+
target.focus();
|
|
122
|
+
scheduleFocusVisibleMarker(() => document.activeElement === target ? target : null);
|
|
123
|
+
return;
|
|
124
|
+
}
|
|
125
|
+
markFocusVisibleOnClose(event);
|
|
126
|
+
}, [restoreFocusRef]);
|
|
127
|
+
return { onOpenAutoFocus, onCloseAutoFocus };
|
|
128
|
+
}
|
|
61
129
|
//# sourceMappingURL=focus-visible-on-close.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"focus-visible-on-close.js","sourceRoot":"","sources":["../../../src/lib/focus-visible-on-close.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,MAAM,CAAC,MAAM,0BAA0B,GAAG,4BAA4B,CAAC;AAEvE
|
|
1
|
+
{"version":3,"file":"focus-visible-on-close.js","sourceRoot":"","sources":["../../../src/lib/focus-visible-on-close.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@camunda/design-system",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.33.0",
|
|
4
4
|
"description": "Camunda's AI-first design system. shadcn + Tailwind components, design tokens aligned to Camunda's identity, and AI tooling for component authoring + migration.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"repository": {
|