@radix-ui/react-alert-dialog 1.1.0-rc.3 → 1.1.0-rc.5
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/index.d.mts +10 -11
- package/dist/index.d.ts +10 -11
- package/dist/index.js.map +2 -2
- package/dist/index.mjs.map +2 -2
- package/package.json +9 -9
- package/src/AlertDialog.tsx +8 -9
package/dist/index.d.mts
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
3
|
-
import * as Radix from '@radix-ui/react-primitive';
|
|
4
3
|
|
|
5
|
-
|
|
4
|
+
type Scope<C = any> = {
|
|
6
5
|
[scopeName: string]: React.Context<C>[];
|
|
7
6
|
} | undefined;
|
|
8
|
-
|
|
7
|
+
type ScopeHook = (scope: Scope) => {
|
|
9
8
|
[__scopeProp: string]: Scope;
|
|
10
9
|
};
|
|
11
10
|
interface CreateScope {
|
|
@@ -14,35 +13,35 @@ interface CreateScope {
|
|
|
14
13
|
}
|
|
15
14
|
|
|
16
15
|
declare const createAlertDialogScope: CreateScope;
|
|
17
|
-
|
|
16
|
+
type DialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;
|
|
18
17
|
interface AlertDialogProps extends Omit<DialogProps, 'modal'> {
|
|
19
18
|
}
|
|
20
19
|
declare const AlertDialog: React.FC<AlertDialogProps>;
|
|
21
|
-
|
|
20
|
+
type DialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;
|
|
22
21
|
interface AlertDialogTriggerProps extends DialogTriggerProps {
|
|
23
22
|
}
|
|
24
23
|
declare const AlertDialogTrigger: React.ForwardRefExoticComponent<AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
25
|
-
|
|
24
|
+
type DialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;
|
|
26
25
|
interface AlertDialogPortalProps extends DialogPortalProps {
|
|
27
26
|
}
|
|
28
27
|
declare const AlertDialogPortal: React.FC<AlertDialogPortalProps>;
|
|
29
|
-
|
|
28
|
+
type DialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;
|
|
30
29
|
interface AlertDialogOverlayProps extends DialogOverlayProps {
|
|
31
30
|
}
|
|
32
31
|
declare const AlertDialogOverlay: React.ForwardRefExoticComponent<AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
|
|
33
|
-
|
|
32
|
+
type DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;
|
|
34
33
|
interface AlertDialogContentProps extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {
|
|
35
34
|
}
|
|
36
35
|
declare const AlertDialogContent: React.ForwardRefExoticComponent<AlertDialogContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
37
|
-
|
|
36
|
+
type DialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;
|
|
38
37
|
interface AlertDialogTitleProps extends DialogTitleProps {
|
|
39
38
|
}
|
|
40
39
|
declare const AlertDialogTitle: React.ForwardRefExoticComponent<AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
41
|
-
|
|
40
|
+
type DialogDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;
|
|
42
41
|
interface AlertDialogDescriptionProps extends DialogDescriptionProps {
|
|
43
42
|
}
|
|
44
43
|
declare const AlertDialogDescription: React.ForwardRefExoticComponent<AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
45
|
-
|
|
44
|
+
type DialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;
|
|
46
45
|
interface AlertDialogActionProps extends DialogCloseProps {
|
|
47
46
|
}
|
|
48
47
|
declare const AlertDialogAction: React.ForwardRefExoticComponent<AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>>;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
3
|
-
import * as Radix from '@radix-ui/react-primitive';
|
|
4
3
|
|
|
5
|
-
|
|
4
|
+
type Scope<C = any> = {
|
|
6
5
|
[scopeName: string]: React.Context<C>[];
|
|
7
6
|
} | undefined;
|
|
8
|
-
|
|
7
|
+
type ScopeHook = (scope: Scope) => {
|
|
9
8
|
[__scopeProp: string]: Scope;
|
|
10
9
|
};
|
|
11
10
|
interface CreateScope {
|
|
@@ -14,35 +13,35 @@ interface CreateScope {
|
|
|
14
13
|
}
|
|
15
14
|
|
|
16
15
|
declare const createAlertDialogScope: CreateScope;
|
|
17
|
-
|
|
16
|
+
type DialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;
|
|
18
17
|
interface AlertDialogProps extends Omit<DialogProps, 'modal'> {
|
|
19
18
|
}
|
|
20
19
|
declare const AlertDialog: React.FC<AlertDialogProps>;
|
|
21
|
-
|
|
20
|
+
type DialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;
|
|
22
21
|
interface AlertDialogTriggerProps extends DialogTriggerProps {
|
|
23
22
|
}
|
|
24
23
|
declare const AlertDialogTrigger: React.ForwardRefExoticComponent<AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
25
|
-
|
|
24
|
+
type DialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;
|
|
26
25
|
interface AlertDialogPortalProps extends DialogPortalProps {
|
|
27
26
|
}
|
|
28
27
|
declare const AlertDialogPortal: React.FC<AlertDialogPortalProps>;
|
|
29
|
-
|
|
28
|
+
type DialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;
|
|
30
29
|
interface AlertDialogOverlayProps extends DialogOverlayProps {
|
|
31
30
|
}
|
|
32
31
|
declare const AlertDialogOverlay: React.ForwardRefExoticComponent<AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
|
|
33
|
-
|
|
32
|
+
type DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;
|
|
34
33
|
interface AlertDialogContentProps extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {
|
|
35
34
|
}
|
|
36
35
|
declare const AlertDialogContent: React.ForwardRefExoticComponent<AlertDialogContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
37
|
-
|
|
36
|
+
type DialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;
|
|
38
37
|
interface AlertDialogTitleProps extends DialogTitleProps {
|
|
39
38
|
}
|
|
40
39
|
declare const AlertDialogTitle: React.ForwardRefExoticComponent<AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
41
|
-
|
|
40
|
+
type DialogDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;
|
|
42
41
|
interface AlertDialogDescriptionProps extends DialogDescriptionProps {
|
|
43
42
|
}
|
|
44
43
|
declare const AlertDialogDescription: React.ForwardRefExoticComponent<AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
45
|
-
|
|
44
|
+
type DialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;
|
|
46
45
|
interface AlertDialogActionProps extends DialogCloseProps {
|
|
47
46
|
}
|
|
48
47
|
declare const AlertDialogAction: React.ForwardRefExoticComponent<AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>>;
|
package/dist/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts", "../src/AlertDialog.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client';\nexport {\n createAlertDialogScope,\n //\n AlertDialog,\n AlertDialogTrigger,\n AlertDialogPortal,\n AlertDialogOverlay,\n AlertDialogContent,\n AlertDialogAction,\n AlertDialogCancel,\n AlertDialogTitle,\n AlertDialogDescription,\n //\n Root,\n Trigger,\n Portal,\n Overlay,\n Content,\n Action,\n Cancel,\n Title,\n Description,\n} from './AlertDialog';\nexport type {\n AlertDialogProps,\n AlertDialogTriggerProps,\n AlertDialogPortalProps,\n AlertDialogOverlayProps,\n AlertDialogContentProps,\n AlertDialogActionProps,\n AlertDialogCancelProps,\n AlertDialogTitleProps,\n AlertDialogDescriptionProps,\n} from './AlertDialog';\n", "import * as React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { createDialogScope } from '@radix-ui/react-dialog';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Slottable } from '@radix-ui/react-slot';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst ROOT_NAME = 'AlertDialog';\n\ntype ScopedProps<P> = P & { __scopeAlertDialog?: Scope };\nconst [createAlertDialogContext, createAlertDialogScope] = createContextScope(ROOT_NAME, [\n createDialogScope,\n]);\nconst useDialogScope = createDialogScope();\n\ntype DialogProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;\ninterface AlertDialogProps extends Omit<DialogProps, 'modal'> {}\n\nconst AlertDialog: React.FC<AlertDialogProps> = (props: ScopedProps<AlertDialogProps>) => {\n const { __scopeAlertDialog, ...alertDialogProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Root {...dialogScope} {...alertDialogProps} modal={true} />;\n};\n\nAlertDialog.displayName = ROOT_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogTrigger\n * -----------------------------------------------------------------------------------------------*/\nconst TRIGGER_NAME = 'AlertDialogTrigger';\n\ntype AlertDialogTriggerElement = React.ElementRef<typeof DialogPrimitive.Trigger>;\ntype DialogTriggerProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;\ninterface AlertDialogTriggerProps extends DialogTriggerProps {}\n\nconst AlertDialogTrigger = React.forwardRef<AlertDialogTriggerElement, AlertDialogTriggerProps>(\n (props: ScopedProps<AlertDialogTriggerProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...triggerProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Trigger {...dialogScope} {...triggerProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'AlertDialogPortal';\n\ntype DialogPortalProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;\ninterface AlertDialogPortalProps extends DialogPortalProps {}\n\nconst AlertDialogPortal: React.FC<AlertDialogPortalProps> = (\n props: ScopedProps<AlertDialogPortalProps>\n) => {\n const { __scopeAlertDialog, ...portalProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Portal {...dialogScope} {...portalProps} />;\n};\n\nAlertDialogPortal.displayName = PORTAL_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'AlertDialogOverlay';\n\ntype AlertDialogOverlayElement = React.ElementRef<typeof DialogPrimitive.Overlay>;\ntype DialogOverlayProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;\ninterface AlertDialogOverlayProps extends DialogOverlayProps {}\n\nconst AlertDialogOverlay = React.forwardRef<AlertDialogOverlayElement, AlertDialogOverlayProps>(\n (props: ScopedProps<AlertDialogOverlayProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...overlayProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Overlay {...dialogScope} {...overlayProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogOverlay.displayName = OVERLAY_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AlertDialogContent';\n\ntype AlertDialogContentContextValue = {\n cancelRef: React.MutableRefObject<AlertDialogCancelElement | null>;\n};\n\nconst [AlertDialogContentProvider, useAlertDialogContentContext] =\n createAlertDialogContext<AlertDialogContentContextValue>(CONTENT_NAME);\n\ntype AlertDialogContentElement = React.ElementRef<typeof DialogPrimitive.Content>;\ntype DialogContentProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;\ninterface AlertDialogContentProps\n extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {}\n\nconst AlertDialogContent = React.forwardRef<AlertDialogContentElement, AlertDialogContentProps>(\n (props: ScopedProps<AlertDialogContentProps>, forwardedRef) => {\n const { __scopeAlertDialog, children, ...contentProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n const contentRef = React.useRef<AlertDialogContentElement>(null);\n const composedRefs = useComposedRefs(forwardedRef, contentRef);\n const cancelRef = React.useRef<AlertDialogCancelElement | null>(null);\n\n return (\n <DialogPrimitive.WarningProvider\n contentName={CONTENT_NAME}\n titleName={TITLE_NAME}\n docsSlug=\"alert-dialog\"\n >\n <AlertDialogContentProvider scope={__scopeAlertDialog} cancelRef={cancelRef}>\n <DialogPrimitive.Content\n role=\"alertdialog\"\n {...dialogScope}\n {...contentProps}\n ref={composedRefs}\n onOpenAutoFocus={composeEventHandlers(contentProps.onOpenAutoFocus, (event) => {\n event.preventDefault();\n cancelRef.current?.focus({ preventScroll: true });\n })}\n onPointerDownOutside={(event) => event.preventDefault()}\n onInteractOutside={(event) => event.preventDefault()}\n >\n {/**\n * We have to use `Slottable` here as we cannot wrap the `AlertDialogContentProvider`\n * around everything, otherwise the `DescriptionWarning` would be rendered straight away.\n * This is because we want the accessibility checks to run only once the content is actually\n * open and that behaviour is already encapsulated in `DialogContent`.\n */}\n <Slottable>{children}</Slottable>\n {process.env.NODE_ENV === 'development' && (\n <DescriptionWarning contentRef={contentRef} />\n )}\n </DialogPrimitive.Content>\n </AlertDialogContentProvider>\n </DialogPrimitive.WarningProvider>\n );\n }\n);\n\nAlertDialogContent.displayName = CONTENT_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'AlertDialogTitle';\n\ntype AlertDialogTitleElement = React.ElementRef<typeof DialogPrimitive.Title>;\ntype DialogTitleProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;\ninterface AlertDialogTitleProps extends DialogTitleProps {}\n\nconst AlertDialogTitle = React.forwardRef<AlertDialogTitleElement, AlertDialogTitleProps>(\n (props: ScopedProps<AlertDialogTitleProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...titleProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Title {...dialogScope} {...titleProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogTitle.displayName = TITLE_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DESCRIPTION_NAME = 'AlertDialogDescription';\n\ntype AlertDialogDescriptionElement = React.ElementRef<typeof DialogPrimitive.Description>;\ntype DialogDescriptionProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;\ninterface AlertDialogDescriptionProps extends DialogDescriptionProps {}\n\nconst AlertDialogDescription = React.forwardRef<\n AlertDialogDescriptionElement,\n AlertDialogDescriptionProps\n>((props: ScopedProps<AlertDialogDescriptionProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...descriptionProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Description {...dialogScope} {...descriptionProps} ref={forwardedRef} />;\n});\n\nAlertDialogDescription.displayName = DESCRIPTION_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogAction\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACTION_NAME = 'AlertDialogAction';\n\ntype AlertDialogActionElement = React.ElementRef<typeof DialogPrimitive.Close>;\ntype DialogCloseProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;\ninterface AlertDialogActionProps extends DialogCloseProps {}\n\nconst AlertDialogAction = React.forwardRef<AlertDialogActionElement, AlertDialogActionProps>(\n (props: ScopedProps<AlertDialogActionProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...actionProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Close {...dialogScope} {...actionProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogAction.displayName = ACTION_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogCancel\n * -----------------------------------------------------------------------------------------------*/\n\nconst CANCEL_NAME = 'AlertDialogCancel';\n\ntype AlertDialogCancelElement = React.ElementRef<typeof DialogPrimitive.Close>;\ninterface AlertDialogCancelProps extends DialogCloseProps {}\n\nconst AlertDialogCancel = React.forwardRef<AlertDialogCancelElement, AlertDialogCancelProps>(\n (props: ScopedProps<AlertDialogCancelProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...cancelProps } = props;\n const { cancelRef } = useAlertDialogContentContext(CANCEL_NAME, __scopeAlertDialog);\n const dialogScope = useDialogScope(__scopeAlertDialog);\n const ref = useComposedRefs(forwardedRef, cancelRef);\n return <DialogPrimitive.Close {...dialogScope} {...cancelProps} ref={ref} />;\n }\n);\n\nAlertDialogCancel.displayName = CANCEL_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<AlertDialogContentElement>;\n};\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef }) => {\n const MESSAGE = `\\`${CONTENT_NAME}\\` requires a description for the component to be accessible for screen reader users.\n\nYou can add a description to the \\`${CONTENT_NAME}\\` by passing a \\`${DESCRIPTION_NAME}\\` component as a child, which also benefits sighted users by adding visible context to the dialog.\n\nAlternatively, you can use your own component as a description by assigning it an \\`id\\` and passing the same value to the \\`aria-describedby\\` prop in \\`${CONTENT_NAME}\\`. If the description is confusing or duplicative for sighted users, you can use the \\`@radix-ui/react-visually-hidden\\` primitive as a wrapper around your description component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;\n\n React.useEffect(() => {\n const hasDescription = document.getElementById(\n contentRef.current?.getAttribute('aria-describedby')!\n );\n if (!hasDescription) console.warn(MESSAGE);\n }, [MESSAGE, contentRef]);\n\n return null;\n};\n\nconst Root = AlertDialog;\nconst Trigger = AlertDialogTrigger;\nconst Portal = AlertDialogPortal;\nconst Overlay = AlertDialogOverlay;\nconst Content = AlertDialogContent;\nconst Action = AlertDialogAction;\nconst Cancel = AlertDialogCancel;\nconst Title = AlertDialogTitle;\nconst Description = AlertDialogDescription;\n\nexport {\n createAlertDialogScope,\n //\n AlertDialog,\n AlertDialogTrigger,\n AlertDialogPortal,\n AlertDialogOverlay,\n AlertDialogContent,\n AlertDialogAction,\n AlertDialogCancel,\n AlertDialogTitle,\n AlertDialogDescription,\n //\n Root,\n Trigger,\n Portal,\n Overlay,\n Content,\n Action,\n Cancel,\n Title,\n Description,\n};\nexport type {\n AlertDialogProps,\n AlertDialogTriggerProps,\n AlertDialogPortalProps,\n AlertDialogOverlayProps,\n AlertDialogContentProps,\n AlertDialogActionProps,\n AlertDialogCancelProps,\n AlertDialogTitleProps,\n AlertDialogDescriptionProps,\n};\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAAAA;AAAA,EAAA,mBAAAC;AAAA,EAAA,eAAAC;AAAA,EAAA,cAAAC;AAAA,EAAA,YAAAC;AAAA,EAAA,aAAAC;AAAA,EAAA,eAAAC;AAAA,EAAA;AAAA;AAAA;;;ACAA,YAAuB;AACvB,2BAAmC;AACnC,gCAAgC;AAChC,sBAAiC;AACjC,0BAAkC;AAClC,uBAAqC;AACrC,wBAA0B;
|
|
4
|
+
"sourcesContent": ["'use client';\nexport {\n createAlertDialogScope,\n //\n AlertDialog,\n AlertDialogTrigger,\n AlertDialogPortal,\n AlertDialogOverlay,\n AlertDialogContent,\n AlertDialogAction,\n AlertDialogCancel,\n AlertDialogTitle,\n AlertDialogDescription,\n //\n Root,\n Trigger,\n Portal,\n Overlay,\n Content,\n Action,\n Cancel,\n Title,\n Description,\n} from './AlertDialog';\nexport type {\n AlertDialogProps,\n AlertDialogTriggerProps,\n AlertDialogPortalProps,\n AlertDialogOverlayProps,\n AlertDialogContentProps,\n AlertDialogActionProps,\n AlertDialogCancelProps,\n AlertDialogTitleProps,\n AlertDialogDescriptionProps,\n} from './AlertDialog';\n", "import * as React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { createDialogScope } from '@radix-ui/react-dialog';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Slottable } from '@radix-ui/react-slot';\n\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst ROOT_NAME = 'AlertDialog';\n\ntype ScopedProps<P> = P & { __scopeAlertDialog?: Scope };\nconst [createAlertDialogContext, createAlertDialogScope] = createContextScope(ROOT_NAME, [\n createDialogScope,\n]);\nconst useDialogScope = createDialogScope();\n\ntype DialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;\ninterface AlertDialogProps extends Omit<DialogProps, 'modal'> {}\n\nconst AlertDialog: React.FC<AlertDialogProps> = (props: ScopedProps<AlertDialogProps>) => {\n const { __scopeAlertDialog, ...alertDialogProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Root {...dialogScope} {...alertDialogProps} modal={true} />;\n};\n\nAlertDialog.displayName = ROOT_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogTrigger\n * -----------------------------------------------------------------------------------------------*/\nconst TRIGGER_NAME = 'AlertDialogTrigger';\n\ntype AlertDialogTriggerElement = React.ElementRef<typeof DialogPrimitive.Trigger>;\ntype DialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;\ninterface AlertDialogTriggerProps extends DialogTriggerProps {}\n\nconst AlertDialogTrigger = React.forwardRef<AlertDialogTriggerElement, AlertDialogTriggerProps>(\n (props: ScopedProps<AlertDialogTriggerProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...triggerProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Trigger {...dialogScope} {...triggerProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'AlertDialogPortal';\n\ntype DialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;\ninterface AlertDialogPortalProps extends DialogPortalProps {}\n\nconst AlertDialogPortal: React.FC<AlertDialogPortalProps> = (\n props: ScopedProps<AlertDialogPortalProps>\n) => {\n const { __scopeAlertDialog, ...portalProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Portal {...dialogScope} {...portalProps} />;\n};\n\nAlertDialogPortal.displayName = PORTAL_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'AlertDialogOverlay';\n\ntype AlertDialogOverlayElement = React.ElementRef<typeof DialogPrimitive.Overlay>;\ntype DialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;\ninterface AlertDialogOverlayProps extends DialogOverlayProps {}\n\nconst AlertDialogOverlay = React.forwardRef<AlertDialogOverlayElement, AlertDialogOverlayProps>(\n (props: ScopedProps<AlertDialogOverlayProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...overlayProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Overlay {...dialogScope} {...overlayProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogOverlay.displayName = OVERLAY_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AlertDialogContent';\n\ntype AlertDialogContentContextValue = {\n cancelRef: React.MutableRefObject<AlertDialogCancelElement | null>;\n};\n\nconst [AlertDialogContentProvider, useAlertDialogContentContext] =\n createAlertDialogContext<AlertDialogContentContextValue>(CONTENT_NAME);\n\ntype AlertDialogContentElement = React.ElementRef<typeof DialogPrimitive.Content>;\ntype DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;\ninterface AlertDialogContentProps\n extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {}\n\nconst AlertDialogContent = React.forwardRef<AlertDialogContentElement, AlertDialogContentProps>(\n (props: ScopedProps<AlertDialogContentProps>, forwardedRef) => {\n const { __scopeAlertDialog, children, ...contentProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n const contentRef = React.useRef<AlertDialogContentElement>(null);\n const composedRefs = useComposedRefs(forwardedRef, contentRef);\n const cancelRef = React.useRef<AlertDialogCancelElement | null>(null);\n\n return (\n <DialogPrimitive.WarningProvider\n contentName={CONTENT_NAME}\n titleName={TITLE_NAME}\n docsSlug=\"alert-dialog\"\n >\n <AlertDialogContentProvider scope={__scopeAlertDialog} cancelRef={cancelRef}>\n <DialogPrimitive.Content\n role=\"alertdialog\"\n {...dialogScope}\n {...contentProps}\n ref={composedRefs}\n onOpenAutoFocus={composeEventHandlers(contentProps.onOpenAutoFocus, (event) => {\n event.preventDefault();\n cancelRef.current?.focus({ preventScroll: true });\n })}\n onPointerDownOutside={(event) => event.preventDefault()}\n onInteractOutside={(event) => event.preventDefault()}\n >\n {/**\n * We have to use `Slottable` here as we cannot wrap the `AlertDialogContentProvider`\n * around everything, otherwise the `DescriptionWarning` would be rendered straight away.\n * This is because we want the accessibility checks to run only once the content is actually\n * open and that behaviour is already encapsulated in `DialogContent`.\n */}\n <Slottable>{children}</Slottable>\n {process.env.NODE_ENV === 'development' && (\n <DescriptionWarning contentRef={contentRef} />\n )}\n </DialogPrimitive.Content>\n </AlertDialogContentProvider>\n </DialogPrimitive.WarningProvider>\n );\n }\n);\n\nAlertDialogContent.displayName = CONTENT_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'AlertDialogTitle';\n\ntype AlertDialogTitleElement = React.ElementRef<typeof DialogPrimitive.Title>;\ntype DialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;\ninterface AlertDialogTitleProps extends DialogTitleProps {}\n\nconst AlertDialogTitle = React.forwardRef<AlertDialogTitleElement, AlertDialogTitleProps>(\n (props: ScopedProps<AlertDialogTitleProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...titleProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Title {...dialogScope} {...titleProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogTitle.displayName = TITLE_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DESCRIPTION_NAME = 'AlertDialogDescription';\n\ntype AlertDialogDescriptionElement = React.ElementRef<typeof DialogPrimitive.Description>;\ntype DialogDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;\ninterface AlertDialogDescriptionProps extends DialogDescriptionProps {}\n\nconst AlertDialogDescription = React.forwardRef<\n AlertDialogDescriptionElement,\n AlertDialogDescriptionProps\n>((props: ScopedProps<AlertDialogDescriptionProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...descriptionProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Description {...dialogScope} {...descriptionProps} ref={forwardedRef} />;\n});\n\nAlertDialogDescription.displayName = DESCRIPTION_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogAction\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACTION_NAME = 'AlertDialogAction';\n\ntype AlertDialogActionElement = React.ElementRef<typeof DialogPrimitive.Close>;\ntype DialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;\ninterface AlertDialogActionProps extends DialogCloseProps {}\n\nconst AlertDialogAction = React.forwardRef<AlertDialogActionElement, AlertDialogActionProps>(\n (props: ScopedProps<AlertDialogActionProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...actionProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Close {...dialogScope} {...actionProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogAction.displayName = ACTION_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogCancel\n * -----------------------------------------------------------------------------------------------*/\n\nconst CANCEL_NAME = 'AlertDialogCancel';\n\ntype AlertDialogCancelElement = React.ElementRef<typeof DialogPrimitive.Close>;\ninterface AlertDialogCancelProps extends DialogCloseProps {}\n\nconst AlertDialogCancel = React.forwardRef<AlertDialogCancelElement, AlertDialogCancelProps>(\n (props: ScopedProps<AlertDialogCancelProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...cancelProps } = props;\n const { cancelRef } = useAlertDialogContentContext(CANCEL_NAME, __scopeAlertDialog);\n const dialogScope = useDialogScope(__scopeAlertDialog);\n const ref = useComposedRefs(forwardedRef, cancelRef);\n return <DialogPrimitive.Close {...dialogScope} {...cancelProps} ref={ref} />;\n }\n);\n\nAlertDialogCancel.displayName = CANCEL_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<AlertDialogContentElement>;\n};\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef }) => {\n const MESSAGE = `\\`${CONTENT_NAME}\\` requires a description for the component to be accessible for screen reader users.\n\nYou can add a description to the \\`${CONTENT_NAME}\\` by passing a \\`${DESCRIPTION_NAME}\\` component as a child, which also benefits sighted users by adding visible context to the dialog.\n\nAlternatively, you can use your own component as a description by assigning it an \\`id\\` and passing the same value to the \\`aria-describedby\\` prop in \\`${CONTENT_NAME}\\`. If the description is confusing or duplicative for sighted users, you can use the \\`@radix-ui/react-visually-hidden\\` primitive as a wrapper around your description component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;\n\n React.useEffect(() => {\n const hasDescription = document.getElementById(\n contentRef.current?.getAttribute('aria-describedby')!\n );\n if (!hasDescription) console.warn(MESSAGE);\n }, [MESSAGE, contentRef]);\n\n return null;\n};\n\nconst Root = AlertDialog;\nconst Trigger = AlertDialogTrigger;\nconst Portal = AlertDialogPortal;\nconst Overlay = AlertDialogOverlay;\nconst Content = AlertDialogContent;\nconst Action = AlertDialogAction;\nconst Cancel = AlertDialogCancel;\nconst Title = AlertDialogTitle;\nconst Description = AlertDialogDescription;\n\nexport {\n createAlertDialogScope,\n //\n AlertDialog,\n AlertDialogTrigger,\n AlertDialogPortal,\n AlertDialogOverlay,\n AlertDialogContent,\n AlertDialogAction,\n AlertDialogCancel,\n AlertDialogTitle,\n AlertDialogDescription,\n //\n Root,\n Trigger,\n Portal,\n Overlay,\n Content,\n Action,\n Cancel,\n Title,\n Description,\n};\nexport type {\n AlertDialogProps,\n AlertDialogTriggerProps,\n AlertDialogPortalProps,\n AlertDialogOverlayProps,\n AlertDialogContentProps,\n AlertDialogActionProps,\n AlertDialogCancelProps,\n AlertDialogTitleProps,\n AlertDialogDescriptionProps,\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Content", "Description", "Overlay", "Portal", "Root", "Title", "Trigger", "Root", "Trigger", "Portal", "Overlay", "Content", "Title", "Description"]
|
|
7
7
|
}
|
package/dist/index.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/AlertDialog.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { createDialogScope } from '@radix-ui/react-dialog';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Slottable } from '@radix-ui/react-slot';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst ROOT_NAME = 'AlertDialog';\n\ntype ScopedProps<P> = P & { __scopeAlertDialog?: Scope };\nconst [createAlertDialogContext, createAlertDialogScope] = createContextScope(ROOT_NAME, [\n createDialogScope,\n]);\nconst useDialogScope = createDialogScope();\n\ntype DialogProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;\ninterface AlertDialogProps extends Omit<DialogProps, 'modal'> {}\n\nconst AlertDialog: React.FC<AlertDialogProps> = (props: ScopedProps<AlertDialogProps>) => {\n const { __scopeAlertDialog, ...alertDialogProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Root {...dialogScope} {...alertDialogProps} modal={true} />;\n};\n\nAlertDialog.displayName = ROOT_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogTrigger\n * -----------------------------------------------------------------------------------------------*/\nconst TRIGGER_NAME = 'AlertDialogTrigger';\n\ntype AlertDialogTriggerElement = React.ElementRef<typeof DialogPrimitive.Trigger>;\ntype DialogTriggerProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;\ninterface AlertDialogTriggerProps extends DialogTriggerProps {}\n\nconst AlertDialogTrigger = React.forwardRef<AlertDialogTriggerElement, AlertDialogTriggerProps>(\n (props: ScopedProps<AlertDialogTriggerProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...triggerProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Trigger {...dialogScope} {...triggerProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'AlertDialogPortal';\n\ntype DialogPortalProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;\ninterface AlertDialogPortalProps extends DialogPortalProps {}\n\nconst AlertDialogPortal: React.FC<AlertDialogPortalProps> = (\n props: ScopedProps<AlertDialogPortalProps>\n) => {\n const { __scopeAlertDialog, ...portalProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Portal {...dialogScope} {...portalProps} />;\n};\n\nAlertDialogPortal.displayName = PORTAL_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'AlertDialogOverlay';\n\ntype AlertDialogOverlayElement = React.ElementRef<typeof DialogPrimitive.Overlay>;\ntype DialogOverlayProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;\ninterface AlertDialogOverlayProps extends DialogOverlayProps {}\n\nconst AlertDialogOverlay = React.forwardRef<AlertDialogOverlayElement, AlertDialogOverlayProps>(\n (props: ScopedProps<AlertDialogOverlayProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...overlayProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Overlay {...dialogScope} {...overlayProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogOverlay.displayName = OVERLAY_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AlertDialogContent';\n\ntype AlertDialogContentContextValue = {\n cancelRef: React.MutableRefObject<AlertDialogCancelElement | null>;\n};\n\nconst [AlertDialogContentProvider, useAlertDialogContentContext] =\n createAlertDialogContext<AlertDialogContentContextValue>(CONTENT_NAME);\n\ntype AlertDialogContentElement = React.ElementRef<typeof DialogPrimitive.Content>;\ntype DialogContentProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;\ninterface AlertDialogContentProps\n extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {}\n\nconst AlertDialogContent = React.forwardRef<AlertDialogContentElement, AlertDialogContentProps>(\n (props: ScopedProps<AlertDialogContentProps>, forwardedRef) => {\n const { __scopeAlertDialog, children, ...contentProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n const contentRef = React.useRef<AlertDialogContentElement>(null);\n const composedRefs = useComposedRefs(forwardedRef, contentRef);\n const cancelRef = React.useRef<AlertDialogCancelElement | null>(null);\n\n return (\n <DialogPrimitive.WarningProvider\n contentName={CONTENT_NAME}\n titleName={TITLE_NAME}\n docsSlug=\"alert-dialog\"\n >\n <AlertDialogContentProvider scope={__scopeAlertDialog} cancelRef={cancelRef}>\n <DialogPrimitive.Content\n role=\"alertdialog\"\n {...dialogScope}\n {...contentProps}\n ref={composedRefs}\n onOpenAutoFocus={composeEventHandlers(contentProps.onOpenAutoFocus, (event) => {\n event.preventDefault();\n cancelRef.current?.focus({ preventScroll: true });\n })}\n onPointerDownOutside={(event) => event.preventDefault()}\n onInteractOutside={(event) => event.preventDefault()}\n >\n {/**\n * We have to use `Slottable` here as we cannot wrap the `AlertDialogContentProvider`\n * around everything, otherwise the `DescriptionWarning` would be rendered straight away.\n * This is because we want the accessibility checks to run only once the content is actually\n * open and that behaviour is already encapsulated in `DialogContent`.\n */}\n <Slottable>{children}</Slottable>\n {process.env.NODE_ENV === 'development' && (\n <DescriptionWarning contentRef={contentRef} />\n )}\n </DialogPrimitive.Content>\n </AlertDialogContentProvider>\n </DialogPrimitive.WarningProvider>\n );\n }\n);\n\nAlertDialogContent.displayName = CONTENT_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'AlertDialogTitle';\n\ntype AlertDialogTitleElement = React.ElementRef<typeof DialogPrimitive.Title>;\ntype DialogTitleProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;\ninterface AlertDialogTitleProps extends DialogTitleProps {}\n\nconst AlertDialogTitle = React.forwardRef<AlertDialogTitleElement, AlertDialogTitleProps>(\n (props: ScopedProps<AlertDialogTitleProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...titleProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Title {...dialogScope} {...titleProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogTitle.displayName = TITLE_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DESCRIPTION_NAME = 'AlertDialogDescription';\n\ntype AlertDialogDescriptionElement = React.ElementRef<typeof DialogPrimitive.Description>;\ntype DialogDescriptionProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;\ninterface AlertDialogDescriptionProps extends DialogDescriptionProps {}\n\nconst AlertDialogDescription = React.forwardRef<\n AlertDialogDescriptionElement,\n AlertDialogDescriptionProps\n>((props: ScopedProps<AlertDialogDescriptionProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...descriptionProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Description {...dialogScope} {...descriptionProps} ref={forwardedRef} />;\n});\n\nAlertDialogDescription.displayName = DESCRIPTION_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogAction\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACTION_NAME = 'AlertDialogAction';\n\ntype AlertDialogActionElement = React.ElementRef<typeof DialogPrimitive.Close>;\ntype DialogCloseProps = Radix.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;\ninterface AlertDialogActionProps extends DialogCloseProps {}\n\nconst AlertDialogAction = React.forwardRef<AlertDialogActionElement, AlertDialogActionProps>(\n (props: ScopedProps<AlertDialogActionProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...actionProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Close {...dialogScope} {...actionProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogAction.displayName = ACTION_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogCancel\n * -----------------------------------------------------------------------------------------------*/\n\nconst CANCEL_NAME = 'AlertDialogCancel';\n\ntype AlertDialogCancelElement = React.ElementRef<typeof DialogPrimitive.Close>;\ninterface AlertDialogCancelProps extends DialogCloseProps {}\n\nconst AlertDialogCancel = React.forwardRef<AlertDialogCancelElement, AlertDialogCancelProps>(\n (props: ScopedProps<AlertDialogCancelProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...cancelProps } = props;\n const { cancelRef } = useAlertDialogContentContext(CANCEL_NAME, __scopeAlertDialog);\n const dialogScope = useDialogScope(__scopeAlertDialog);\n const ref = useComposedRefs(forwardedRef, cancelRef);\n return <DialogPrimitive.Close {...dialogScope} {...cancelProps} ref={ref} />;\n }\n);\n\nAlertDialogCancel.displayName = CANCEL_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<AlertDialogContentElement>;\n};\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef }) => {\n const MESSAGE = `\\`${CONTENT_NAME}\\` requires a description for the component to be accessible for screen reader users.\n\nYou can add a description to the \\`${CONTENT_NAME}\\` by passing a \\`${DESCRIPTION_NAME}\\` component as a child, which also benefits sighted users by adding visible context to the dialog.\n\nAlternatively, you can use your own component as a description by assigning it an \\`id\\` and passing the same value to the \\`aria-describedby\\` prop in \\`${CONTENT_NAME}\\`. If the description is confusing or duplicative for sighted users, you can use the \\`@radix-ui/react-visually-hidden\\` primitive as a wrapper around your description component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;\n\n React.useEffect(() => {\n const hasDescription = document.getElementById(\n contentRef.current?.getAttribute('aria-describedby')!\n );\n if (!hasDescription) console.warn(MESSAGE);\n }, [MESSAGE, contentRef]);\n\n return null;\n};\n\nconst Root = AlertDialog;\nconst Trigger = AlertDialogTrigger;\nconst Portal = AlertDialogPortal;\nconst Overlay = AlertDialogOverlay;\nconst Content = AlertDialogContent;\nconst Action = AlertDialogAction;\nconst Cancel = AlertDialogCancel;\nconst Title = AlertDialogTitle;\nconst Description = AlertDialogDescription;\n\nexport {\n createAlertDialogScope,\n //\n AlertDialog,\n AlertDialogTrigger,\n AlertDialogPortal,\n AlertDialogOverlay,\n AlertDialogContent,\n AlertDialogAction,\n AlertDialogCancel,\n AlertDialogTitle,\n AlertDialogDescription,\n //\n Root,\n Trigger,\n Portal,\n Overlay,\n Content,\n Action,\n Cancel,\n Title,\n Description,\n};\nexport type {\n AlertDialogProps,\n AlertDialogTriggerProps,\n AlertDialogPortalProps,\n AlertDialogOverlayProps,\n AlertDialogContentProps,\n AlertDialogActionProps,\n AlertDialogCancelProps,\n AlertDialogTitleProps,\n AlertDialogDescriptionProps,\n};\n"],
|
|
5
|
-
"mappings": ";;;AAAA,YAAY,WAAW;AACvB,SAAS,0BAA0B;AACnC,SAAS,uBAAuB;AAChC,YAAY,qBAAqB;AACjC,SAAS,yBAAyB;AAClC,SAAS,4BAA4B;AACrC,SAAS,iBAAiB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { createDialogScope } from '@radix-ui/react-dialog';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Slottable } from '@radix-ui/react-slot';\n\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst ROOT_NAME = 'AlertDialog';\n\ntype ScopedProps<P> = P & { __scopeAlertDialog?: Scope };\nconst [createAlertDialogContext, createAlertDialogScope] = createContextScope(ROOT_NAME, [\n createDialogScope,\n]);\nconst useDialogScope = createDialogScope();\n\ntype DialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;\ninterface AlertDialogProps extends Omit<DialogProps, 'modal'> {}\n\nconst AlertDialog: React.FC<AlertDialogProps> = (props: ScopedProps<AlertDialogProps>) => {\n const { __scopeAlertDialog, ...alertDialogProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Root {...dialogScope} {...alertDialogProps} modal={true} />;\n};\n\nAlertDialog.displayName = ROOT_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogTrigger\n * -----------------------------------------------------------------------------------------------*/\nconst TRIGGER_NAME = 'AlertDialogTrigger';\n\ntype AlertDialogTriggerElement = React.ElementRef<typeof DialogPrimitive.Trigger>;\ntype DialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;\ninterface AlertDialogTriggerProps extends DialogTriggerProps {}\n\nconst AlertDialogTrigger = React.forwardRef<AlertDialogTriggerElement, AlertDialogTriggerProps>(\n (props: ScopedProps<AlertDialogTriggerProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...triggerProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Trigger {...dialogScope} {...triggerProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'AlertDialogPortal';\n\ntype DialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;\ninterface AlertDialogPortalProps extends DialogPortalProps {}\n\nconst AlertDialogPortal: React.FC<AlertDialogPortalProps> = (\n props: ScopedProps<AlertDialogPortalProps>\n) => {\n const { __scopeAlertDialog, ...portalProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Portal {...dialogScope} {...portalProps} />;\n};\n\nAlertDialogPortal.displayName = PORTAL_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'AlertDialogOverlay';\n\ntype AlertDialogOverlayElement = React.ElementRef<typeof DialogPrimitive.Overlay>;\ntype DialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;\ninterface AlertDialogOverlayProps extends DialogOverlayProps {}\n\nconst AlertDialogOverlay = React.forwardRef<AlertDialogOverlayElement, AlertDialogOverlayProps>(\n (props: ScopedProps<AlertDialogOverlayProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...overlayProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Overlay {...dialogScope} {...overlayProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogOverlay.displayName = OVERLAY_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AlertDialogContent';\n\ntype AlertDialogContentContextValue = {\n cancelRef: React.MutableRefObject<AlertDialogCancelElement | null>;\n};\n\nconst [AlertDialogContentProvider, useAlertDialogContentContext] =\n createAlertDialogContext<AlertDialogContentContextValue>(CONTENT_NAME);\n\ntype AlertDialogContentElement = React.ElementRef<typeof DialogPrimitive.Content>;\ntype DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;\ninterface AlertDialogContentProps\n extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {}\n\nconst AlertDialogContent = React.forwardRef<AlertDialogContentElement, AlertDialogContentProps>(\n (props: ScopedProps<AlertDialogContentProps>, forwardedRef) => {\n const { __scopeAlertDialog, children, ...contentProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n const contentRef = React.useRef<AlertDialogContentElement>(null);\n const composedRefs = useComposedRefs(forwardedRef, contentRef);\n const cancelRef = React.useRef<AlertDialogCancelElement | null>(null);\n\n return (\n <DialogPrimitive.WarningProvider\n contentName={CONTENT_NAME}\n titleName={TITLE_NAME}\n docsSlug=\"alert-dialog\"\n >\n <AlertDialogContentProvider scope={__scopeAlertDialog} cancelRef={cancelRef}>\n <DialogPrimitive.Content\n role=\"alertdialog\"\n {...dialogScope}\n {...contentProps}\n ref={composedRefs}\n onOpenAutoFocus={composeEventHandlers(contentProps.onOpenAutoFocus, (event) => {\n event.preventDefault();\n cancelRef.current?.focus({ preventScroll: true });\n })}\n onPointerDownOutside={(event) => event.preventDefault()}\n onInteractOutside={(event) => event.preventDefault()}\n >\n {/**\n * We have to use `Slottable` here as we cannot wrap the `AlertDialogContentProvider`\n * around everything, otherwise the `DescriptionWarning` would be rendered straight away.\n * This is because we want the accessibility checks to run only once the content is actually\n * open and that behaviour is already encapsulated in `DialogContent`.\n */}\n <Slottable>{children}</Slottable>\n {process.env.NODE_ENV === 'development' && (\n <DescriptionWarning contentRef={contentRef} />\n )}\n </DialogPrimitive.Content>\n </AlertDialogContentProvider>\n </DialogPrimitive.WarningProvider>\n );\n }\n);\n\nAlertDialogContent.displayName = CONTENT_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'AlertDialogTitle';\n\ntype AlertDialogTitleElement = React.ElementRef<typeof DialogPrimitive.Title>;\ntype DialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;\ninterface AlertDialogTitleProps extends DialogTitleProps {}\n\nconst AlertDialogTitle = React.forwardRef<AlertDialogTitleElement, AlertDialogTitleProps>(\n (props: ScopedProps<AlertDialogTitleProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...titleProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Title {...dialogScope} {...titleProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogTitle.displayName = TITLE_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DESCRIPTION_NAME = 'AlertDialogDescription';\n\ntype AlertDialogDescriptionElement = React.ElementRef<typeof DialogPrimitive.Description>;\ntype DialogDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;\ninterface AlertDialogDescriptionProps extends DialogDescriptionProps {}\n\nconst AlertDialogDescription = React.forwardRef<\n AlertDialogDescriptionElement,\n AlertDialogDescriptionProps\n>((props: ScopedProps<AlertDialogDescriptionProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...descriptionProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Description {...dialogScope} {...descriptionProps} ref={forwardedRef} />;\n});\n\nAlertDialogDescription.displayName = DESCRIPTION_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogAction\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACTION_NAME = 'AlertDialogAction';\n\ntype AlertDialogActionElement = React.ElementRef<typeof DialogPrimitive.Close>;\ntype DialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;\ninterface AlertDialogActionProps extends DialogCloseProps {}\n\nconst AlertDialogAction = React.forwardRef<AlertDialogActionElement, AlertDialogActionProps>(\n (props: ScopedProps<AlertDialogActionProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...actionProps } = props;\n const dialogScope = useDialogScope(__scopeAlertDialog);\n return <DialogPrimitive.Close {...dialogScope} {...actionProps} ref={forwardedRef} />;\n }\n);\n\nAlertDialogAction.displayName = ACTION_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AlertDialogCancel\n * -----------------------------------------------------------------------------------------------*/\n\nconst CANCEL_NAME = 'AlertDialogCancel';\n\ntype AlertDialogCancelElement = React.ElementRef<typeof DialogPrimitive.Close>;\ninterface AlertDialogCancelProps extends DialogCloseProps {}\n\nconst AlertDialogCancel = React.forwardRef<AlertDialogCancelElement, AlertDialogCancelProps>(\n (props: ScopedProps<AlertDialogCancelProps>, forwardedRef) => {\n const { __scopeAlertDialog, ...cancelProps } = props;\n const { cancelRef } = useAlertDialogContentContext(CANCEL_NAME, __scopeAlertDialog);\n const dialogScope = useDialogScope(__scopeAlertDialog);\n const ref = useComposedRefs(forwardedRef, cancelRef);\n return <DialogPrimitive.Close {...dialogScope} {...cancelProps} ref={ref} />;\n }\n);\n\nAlertDialogCancel.displayName = CANCEL_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<AlertDialogContentElement>;\n};\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef }) => {\n const MESSAGE = `\\`${CONTENT_NAME}\\` requires a description for the component to be accessible for screen reader users.\n\nYou can add a description to the \\`${CONTENT_NAME}\\` by passing a \\`${DESCRIPTION_NAME}\\` component as a child, which also benefits sighted users by adding visible context to the dialog.\n\nAlternatively, you can use your own component as a description by assigning it an \\`id\\` and passing the same value to the \\`aria-describedby\\` prop in \\`${CONTENT_NAME}\\`. If the description is confusing or duplicative for sighted users, you can use the \\`@radix-ui/react-visually-hidden\\` primitive as a wrapper around your description component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;\n\n React.useEffect(() => {\n const hasDescription = document.getElementById(\n contentRef.current?.getAttribute('aria-describedby')!\n );\n if (!hasDescription) console.warn(MESSAGE);\n }, [MESSAGE, contentRef]);\n\n return null;\n};\n\nconst Root = AlertDialog;\nconst Trigger = AlertDialogTrigger;\nconst Portal = AlertDialogPortal;\nconst Overlay = AlertDialogOverlay;\nconst Content = AlertDialogContent;\nconst Action = AlertDialogAction;\nconst Cancel = AlertDialogCancel;\nconst Title = AlertDialogTitle;\nconst Description = AlertDialogDescription;\n\nexport {\n createAlertDialogScope,\n //\n AlertDialog,\n AlertDialogTrigger,\n AlertDialogPortal,\n AlertDialogOverlay,\n AlertDialogContent,\n AlertDialogAction,\n AlertDialogCancel,\n AlertDialogTitle,\n AlertDialogDescription,\n //\n Root,\n Trigger,\n Portal,\n Overlay,\n Content,\n Action,\n Cancel,\n Title,\n Description,\n};\nexport type {\n AlertDialogProps,\n AlertDialogTriggerProps,\n AlertDialogPortalProps,\n AlertDialogOverlayProps,\n AlertDialogContentProps,\n AlertDialogActionProps,\n AlertDialogCancelProps,\n AlertDialogTitleProps,\n AlertDialogDescriptionProps,\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Root", "Trigger", "Portal", "Overlay", "Content", "Title", "Description"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@radix-ui/react-alert-dialog",
|
|
3
|
-
"version": "1.1.0-rc.
|
|
3
|
+
"version": "1.1.0-rc.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
@@ -28,18 +28,18 @@
|
|
|
28
28
|
"version": "yarn version"
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@radix-ui/primitive": "1.1.0-rc.
|
|
32
|
-
"@radix-ui/react-compose-refs": "1.1.0-rc.
|
|
33
|
-
"@radix-ui/react-context": "1.1.0-rc.
|
|
34
|
-
"@radix-ui/react-dialog": "1.1.0-rc.
|
|
35
|
-
"@radix-ui/react-primitive": "
|
|
36
|
-
"@radix-ui/react-slot": "1.1.0-rc.
|
|
31
|
+
"@radix-ui/primitive": "1.1.0-rc.5",
|
|
32
|
+
"@radix-ui/react-compose-refs": "1.1.0-rc.5",
|
|
33
|
+
"@radix-ui/react-context": "1.1.0-rc.5",
|
|
34
|
+
"@radix-ui/react-dialog": "1.1.0-rc.5",
|
|
35
|
+
"@radix-ui/react-primitive": "2.0.0-rc.2",
|
|
36
|
+
"@radix-ui/react-slot": "1.1.0-rc.5"
|
|
37
37
|
},
|
|
38
38
|
"peerDependencies": {
|
|
39
39
|
"@types/react": "*",
|
|
40
40
|
"@types/react-dom": "*",
|
|
41
|
-
"react": "^16.8 || ^17.0 || ^18.0",
|
|
42
|
-
"react-dom": "^16.8 || ^17.0 || ^18.0"
|
|
41
|
+
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0",
|
|
42
|
+
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0"
|
|
43
43
|
},
|
|
44
44
|
"peerDependenciesMeta": {
|
|
45
45
|
"@types/react": {
|
package/src/AlertDialog.tsx
CHANGED
|
@@ -6,7 +6,6 @@ import { createDialogScope } from '@radix-ui/react-dialog';
|
|
|
6
6
|
import { composeEventHandlers } from '@radix-ui/primitive';
|
|
7
7
|
import { Slottable } from '@radix-ui/react-slot';
|
|
8
8
|
|
|
9
|
-
import type * as Radix from '@radix-ui/react-primitive';
|
|
10
9
|
import type { Scope } from '@radix-ui/react-context';
|
|
11
10
|
|
|
12
11
|
/* -------------------------------------------------------------------------------------------------
|
|
@@ -21,7 +20,7 @@ const [createAlertDialogContext, createAlertDialogScope] = createContextScope(RO
|
|
|
21
20
|
]);
|
|
22
21
|
const useDialogScope = createDialogScope();
|
|
23
22
|
|
|
24
|
-
type DialogProps =
|
|
23
|
+
type DialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;
|
|
25
24
|
interface AlertDialogProps extends Omit<DialogProps, 'modal'> {}
|
|
26
25
|
|
|
27
26
|
const AlertDialog: React.FC<AlertDialogProps> = (props: ScopedProps<AlertDialogProps>) => {
|
|
@@ -38,7 +37,7 @@ AlertDialog.displayName = ROOT_NAME;
|
|
|
38
37
|
const TRIGGER_NAME = 'AlertDialogTrigger';
|
|
39
38
|
|
|
40
39
|
type AlertDialogTriggerElement = React.ElementRef<typeof DialogPrimitive.Trigger>;
|
|
41
|
-
type DialogTriggerProps =
|
|
40
|
+
type DialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;
|
|
42
41
|
interface AlertDialogTriggerProps extends DialogTriggerProps {}
|
|
43
42
|
|
|
44
43
|
const AlertDialogTrigger = React.forwardRef<AlertDialogTriggerElement, AlertDialogTriggerProps>(
|
|
@@ -57,7 +56,7 @@ AlertDialogTrigger.displayName = TRIGGER_NAME;
|
|
|
57
56
|
|
|
58
57
|
const PORTAL_NAME = 'AlertDialogPortal';
|
|
59
58
|
|
|
60
|
-
type DialogPortalProps =
|
|
59
|
+
type DialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;
|
|
61
60
|
interface AlertDialogPortalProps extends DialogPortalProps {}
|
|
62
61
|
|
|
63
62
|
const AlertDialogPortal: React.FC<AlertDialogPortalProps> = (
|
|
@@ -77,7 +76,7 @@ AlertDialogPortal.displayName = PORTAL_NAME;
|
|
|
77
76
|
const OVERLAY_NAME = 'AlertDialogOverlay';
|
|
78
77
|
|
|
79
78
|
type AlertDialogOverlayElement = React.ElementRef<typeof DialogPrimitive.Overlay>;
|
|
80
|
-
type DialogOverlayProps =
|
|
79
|
+
type DialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;
|
|
81
80
|
interface AlertDialogOverlayProps extends DialogOverlayProps {}
|
|
82
81
|
|
|
83
82
|
const AlertDialogOverlay = React.forwardRef<AlertDialogOverlayElement, AlertDialogOverlayProps>(
|
|
@@ -104,7 +103,7 @@ const [AlertDialogContentProvider, useAlertDialogContentContext] =
|
|
|
104
103
|
createAlertDialogContext<AlertDialogContentContextValue>(CONTENT_NAME);
|
|
105
104
|
|
|
106
105
|
type AlertDialogContentElement = React.ElementRef<typeof DialogPrimitive.Content>;
|
|
107
|
-
type DialogContentProps =
|
|
106
|
+
type DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;
|
|
108
107
|
interface AlertDialogContentProps
|
|
109
108
|
extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {}
|
|
110
109
|
|
|
@@ -161,7 +160,7 @@ AlertDialogContent.displayName = CONTENT_NAME;
|
|
|
161
160
|
const TITLE_NAME = 'AlertDialogTitle';
|
|
162
161
|
|
|
163
162
|
type AlertDialogTitleElement = React.ElementRef<typeof DialogPrimitive.Title>;
|
|
164
|
-
type DialogTitleProps =
|
|
163
|
+
type DialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;
|
|
165
164
|
interface AlertDialogTitleProps extends DialogTitleProps {}
|
|
166
165
|
|
|
167
166
|
const AlertDialogTitle = React.forwardRef<AlertDialogTitleElement, AlertDialogTitleProps>(
|
|
@@ -181,7 +180,7 @@ AlertDialogTitle.displayName = TITLE_NAME;
|
|
|
181
180
|
const DESCRIPTION_NAME = 'AlertDialogDescription';
|
|
182
181
|
|
|
183
182
|
type AlertDialogDescriptionElement = React.ElementRef<typeof DialogPrimitive.Description>;
|
|
184
|
-
type DialogDescriptionProps =
|
|
183
|
+
type DialogDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;
|
|
185
184
|
interface AlertDialogDescriptionProps extends DialogDescriptionProps {}
|
|
186
185
|
|
|
187
186
|
const AlertDialogDescription = React.forwardRef<
|
|
@@ -202,7 +201,7 @@ AlertDialogDescription.displayName = DESCRIPTION_NAME;
|
|
|
202
201
|
const ACTION_NAME = 'AlertDialogAction';
|
|
203
202
|
|
|
204
203
|
type AlertDialogActionElement = React.ElementRef<typeof DialogPrimitive.Close>;
|
|
205
|
-
type DialogCloseProps =
|
|
204
|
+
type DialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;
|
|
206
205
|
interface AlertDialogActionProps extends DialogCloseProps {}
|
|
207
206
|
|
|
208
207
|
const AlertDialogAction = React.forwardRef<AlertDialogActionElement, AlertDialogActionProps>(
|