main repo

node_modules/@radix-ui/react-alert-dialog/README.md

@@ -0,0 +1,13 @@
+# `react-alert-dialog`
+
+## Installation
+
+```sh
+$ yarn add @radix-ui/react-alert-dialog
+# or
+$ npm install @radix-ui/react-alert-dialog
+```
+
+## Usage
+
+View docs [here](https://radix-ui.com/primitives/docs/components/alert-dialog).

node_modules/@radix-ui/react-alert-dialog/dist/index.d.mts

@@ -0,0 +1,61 @@
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+
+type Scope<C = any> = {
+    [scopeName: string]: React.Context<C>[];
+} | undefined;
+type ScopeHook = (scope: Scope) => {
+    [__scopeProp: string]: Scope;
+};
+interface CreateScope {
+    scopeName: string;
+    (): ScopeHook;
+}
+
+declare const createAlertDialogScope: CreateScope;
+type DialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;
+interface AlertDialogProps extends Omit<DialogProps, 'modal'> {
+}
+declare const AlertDialog: React.FC<AlertDialogProps>;
+type DialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;
+interface AlertDialogTriggerProps extends DialogTriggerProps {
+}
+declare const AlertDialogTrigger: React.ForwardRefExoticComponent<AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+type DialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;
+interface AlertDialogPortalProps extends DialogPortalProps {
+}
+declare const AlertDialogPortal: React.FC<AlertDialogPortalProps>;
+type DialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;
+interface AlertDialogOverlayProps extends DialogOverlayProps {
+}
+declare const AlertDialogOverlay: React.ForwardRefExoticComponent<AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
+type DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;
+interface AlertDialogContentProps extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {
+}
+declare const AlertDialogContent: React.ForwardRefExoticComponent<AlertDialogContentProps & React.RefAttributes<HTMLDivElement>>;
+type DialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;
+interface AlertDialogTitleProps extends DialogTitleProps {
+}
+declare const AlertDialogTitle: React.ForwardRefExoticComponent<AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+type DialogDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;
+interface AlertDialogDescriptionProps extends DialogDescriptionProps {
+}
+declare const AlertDialogDescription: React.ForwardRefExoticComponent<AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+type DialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;
+interface AlertDialogActionProps extends DialogCloseProps {
+}
+declare const AlertDialogAction: React.ForwardRefExoticComponent<AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>>;
+interface AlertDialogCancelProps extends DialogCloseProps {
+}
+declare const AlertDialogCancel: React.ForwardRefExoticComponent<AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Root: React.FC<AlertDialogProps>;
+declare const Trigger: React.ForwardRefExoticComponent<AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Portal: React.FC<AlertDialogPortalProps>;
+declare const Overlay: React.ForwardRefExoticComponent<AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
+declare const Content: React.ForwardRefExoticComponent<AlertDialogContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const Action: React.ForwardRefExoticComponent<AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Cancel: React.ForwardRefExoticComponent<AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Title: React.ForwardRefExoticComponent<AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+declare const Description: React.ForwardRefExoticComponent<AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+
+export { Action, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogOverlay, type AlertDialogOverlayProps, AlertDialogPortal, type AlertDialogPortalProps, type AlertDialogProps, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertDialogTriggerProps, Cancel, Content, Description, Overlay, Portal, Root, Title, Trigger, createAlertDialogScope };

node_modules/@radix-ui/react-alert-dialog/dist/index.d.ts

@@ -0,0 +1,61 @@
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+
+type Scope<C = any> = {
+    [scopeName: string]: React.Context<C>[];
+} | undefined;
+type ScopeHook = (scope: Scope) => {
+    [__scopeProp: string]: Scope;
+};
+interface CreateScope {
+    scopeName: string;
+    (): ScopeHook;
+}
+
+declare const createAlertDialogScope: CreateScope;
+type DialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;
+interface AlertDialogProps extends Omit<DialogProps, 'modal'> {
+}
+declare const AlertDialog: React.FC<AlertDialogProps>;
+type DialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;
+interface AlertDialogTriggerProps extends DialogTriggerProps {
+}
+declare const AlertDialogTrigger: React.ForwardRefExoticComponent<AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+type DialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;
+interface AlertDialogPortalProps extends DialogPortalProps {
+}
+declare const AlertDialogPortal: React.FC<AlertDialogPortalProps>;
+type DialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;
+interface AlertDialogOverlayProps extends DialogOverlayProps {
+}
+declare const AlertDialogOverlay: React.ForwardRefExoticComponent<AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
+type DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;
+interface AlertDialogContentProps extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {
+}
+declare const AlertDialogContent: React.ForwardRefExoticComponent<AlertDialogContentProps & React.RefAttributes<HTMLDivElement>>;
+type DialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;
+interface AlertDialogTitleProps extends DialogTitleProps {
+}
+declare const AlertDialogTitle: React.ForwardRefExoticComponent<AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+type DialogDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;
+interface AlertDialogDescriptionProps extends DialogDescriptionProps {
+}
+declare const AlertDialogDescription: React.ForwardRefExoticComponent<AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+type DialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;
+interface AlertDialogActionProps extends DialogCloseProps {
+}
+declare const AlertDialogAction: React.ForwardRefExoticComponent<AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>>;
+interface AlertDialogCancelProps extends DialogCloseProps {
+}
+declare const AlertDialogCancel: React.ForwardRefExoticComponent<AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Root: React.FC<AlertDialogProps>;
+declare const Trigger: React.ForwardRefExoticComponent<AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Portal: React.FC<AlertDialogPortalProps>;
+declare const Overlay: React.ForwardRefExoticComponent<AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
+declare const Content: React.ForwardRefExoticComponent<AlertDialogContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const Action: React.ForwardRefExoticComponent<AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Cancel: React.ForwardRefExoticComponent<AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Title: React.ForwardRefExoticComponent<AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+declare const Description: React.ForwardRefExoticComponent<AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+
+export { Action, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogOverlay, type AlertDialogOverlayProps, AlertDialogPortal, type AlertDialogPortalProps, type AlertDialogProps, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertDialogTriggerProps, Cancel, Content, Description, Overlay, Portal, Root, Title, Trigger, createAlertDialogScope };

node_modules/@radix-ui/react-alert-dialog/dist/index.js

@@ -0,0 +1,201 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/react/alert-dialog/src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  Action: () => Action,
+  AlertDialog: () => AlertDialog,
+  AlertDialogAction: () => AlertDialogAction,
+  AlertDialogCancel: () => AlertDialogCancel,
+  AlertDialogContent: () => AlertDialogContent,
+  AlertDialogDescription: () => AlertDialogDescription,
+  AlertDialogOverlay: () => AlertDialogOverlay,
+  AlertDialogPortal: () => AlertDialogPortal,
+  AlertDialogTitle: () => AlertDialogTitle,
+  AlertDialogTrigger: () => AlertDialogTrigger,
+  Cancel: () => Cancel,
+  Content: () => Content2,
+  Description: () => Description2,
+  Overlay: () => Overlay2,
+  Portal: () => Portal2,
+  Root: () => Root2,
+  Title: () => Title2,
+  Trigger: () => Trigger2,
+  createAlertDialogScope: () => createAlertDialogScope
+});
+module.exports = __toCommonJS(src_exports);
+
+// packages/react/alert-dialog/src/AlertDialog.tsx
+var React = __toESM(require("react"));
+var import_react_context = require("@radix-ui/react-context");
+var import_react_compose_refs = require("@radix-ui/react-compose-refs");
+var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"));
+var import_react_dialog = require("@radix-ui/react-dialog");
+var import_primitive = require("@radix-ui/primitive");
+var import_react_slot = require("@radix-ui/react-slot");
+var import_jsx_runtime = require("react/jsx-runtime");
+var ROOT_NAME = "AlertDialog";
+var [createAlertDialogContext, createAlertDialogScope] = (0, import_react_context.createContextScope)(ROOT_NAME, [
+  import_react_dialog.createDialogScope
+]);
+var useDialogScope = (0, import_react_dialog.createDialogScope)();
+var AlertDialog = (props) => {
+  const { __scopeAlertDialog, ...alertDialogProps } = props;
+  const dialogScope = useDialogScope(__scopeAlertDialog);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPrimitive.Root, { ...dialogScope, ...alertDialogProps, modal: true });
+};
+AlertDialog.displayName = ROOT_NAME;
+var TRIGGER_NAME = "AlertDialogTrigger";
+var AlertDialogTrigger = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...triggerProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPrimitive.Trigger, { ...dialogScope, ...triggerProps, ref: forwardedRef });
+  }
+);
+AlertDialogTrigger.displayName = TRIGGER_NAME;
+var PORTAL_NAME = "AlertDialogPortal";
+var AlertDialogPortal = (props) => {
+  const { __scopeAlertDialog, ...portalProps } = props;
+  const dialogScope = useDialogScope(__scopeAlertDialog);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPrimitive.Portal, { ...dialogScope, ...portalProps });
+};
+AlertDialogPortal.displayName = PORTAL_NAME;
+var OVERLAY_NAME = "AlertDialogOverlay";
+var AlertDialogOverlay = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...overlayProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPrimitive.Overlay, { ...dialogScope, ...overlayProps, ref: forwardedRef });
+  }
+);
+AlertDialogOverlay.displayName = OVERLAY_NAME;
+var CONTENT_NAME = "AlertDialogContent";
+var [AlertDialogContentProvider, useAlertDialogContentContext] = createAlertDialogContext(CONTENT_NAME);
+var AlertDialogContent = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, children, ...contentProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    const contentRef = React.useRef(null);
+    const composedRefs = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, contentRef);
+    const cancelRef = React.useRef(null);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      DialogPrimitive.WarningProvider,
+      {
+        contentName: CONTENT_NAME,
+        titleName: TITLE_NAME,
+        docsSlug: "alert-dialog",
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertDialogContentProvider, { scope: __scopeAlertDialog, cancelRef, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          DialogPrimitive.Content,
+          {
+            role: "alertdialog",
+            ...dialogScope,
+            ...contentProps,
+            ref: composedRefs,
+            onOpenAutoFocus: (0, import_primitive.composeEventHandlers)(contentProps.onOpenAutoFocus, (event) => {
+              event.preventDefault();
+              cancelRef.current?.focus({ preventScroll: true });
+            }),
+            onPointerDownOutside: (event) => event.preventDefault(),
+            onInteractOutside: (event) => event.preventDefault(),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_slot.Slottable, { children }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DescriptionWarning, { contentRef })
+            ]
+          }
+        ) })
+      }
+    );
+  }
+);
+AlertDialogContent.displayName = CONTENT_NAME;
+var TITLE_NAME = "AlertDialogTitle";
+var AlertDialogTitle = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...titleProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPrimitive.Title, { ...dialogScope, ...titleProps, ref: forwardedRef });
+  }
+);
+AlertDialogTitle.displayName = TITLE_NAME;
+var DESCRIPTION_NAME = "AlertDialogDescription";
+var AlertDialogDescription = React.forwardRef((props, forwardedRef) => {
+  const { __scopeAlertDialog, ...descriptionProps } = props;
+  const dialogScope = useDialogScope(__scopeAlertDialog);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPrimitive.Description, { ...dialogScope, ...descriptionProps, ref: forwardedRef });
+});
+AlertDialogDescription.displayName = DESCRIPTION_NAME;
+var ACTION_NAME = "AlertDialogAction";
+var AlertDialogAction = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...actionProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPrimitive.Close, { ...dialogScope, ...actionProps, ref: forwardedRef });
+  }
+);
+AlertDialogAction.displayName = ACTION_NAME;
+var CANCEL_NAME = "AlertDialogCancel";
+var AlertDialogCancel = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...cancelProps } = props;
+    const { cancelRef } = useAlertDialogContentContext(CANCEL_NAME, __scopeAlertDialog);
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    const ref = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, cancelRef);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPrimitive.Close, { ...dialogScope, ...cancelProps, ref });
+  }
+);
+AlertDialogCancel.displayName = CANCEL_NAME;
+var DescriptionWarning = ({ contentRef }) => {
+  const MESSAGE = `\`${CONTENT_NAME}\` requires a description for the component to be accessible for screen reader users.
+
+You 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.
+
+Alternatively, 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.
+
+For more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;
+  React.useEffect(() => {
+    const hasDescription = document.getElementById(
+      contentRef.current?.getAttribute("aria-describedby")
+    );
+    if (!hasDescription) console.warn(MESSAGE);
+  }, [MESSAGE, contentRef]);
+  return null;
+};
+var Root2 = AlertDialog;
+var Trigger2 = AlertDialogTrigger;
+var Portal2 = AlertDialogPortal;
+var Overlay2 = AlertDialogOverlay;
+var Content2 = AlertDialogContent;
+var Action = AlertDialogAction;
+var Cancel = AlertDialogCancel;
+var Title2 = AlertDialogTitle;
+var Description2 = AlertDialogDescription;
+//# sourceMappingURL=index.js.map

node_modules/@radix-ui/react-alert-dialog/dist/index.mjs

@@ -0,0 +1,169 @@
+"use client";
+
+// packages/react/alert-dialog/src/AlertDialog.tsx
+import * as React from "react";
+import { createContextScope } from "@radix-ui/react-context";
+import { useComposedRefs } from "@radix-ui/react-compose-refs";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { createDialogScope } from "@radix-ui/react-dialog";
+import { composeEventHandlers } from "@radix-ui/primitive";
+import { Slottable } from "@radix-ui/react-slot";
+import { jsx, jsxs } from "react/jsx-runtime";
+var ROOT_NAME = "AlertDialog";
+var [createAlertDialogContext, createAlertDialogScope] = createContextScope(ROOT_NAME, [
+  createDialogScope
+]);
+var useDialogScope = createDialogScope();
+var AlertDialog = (props) => {
+  const { __scopeAlertDialog, ...alertDialogProps } = props;
+  const dialogScope = useDialogScope(__scopeAlertDialog);
+  return /* @__PURE__ */ jsx(DialogPrimitive.Root, { ...dialogScope, ...alertDialogProps, modal: true });
+};
+AlertDialog.displayName = ROOT_NAME;
+var TRIGGER_NAME = "AlertDialogTrigger";
+var AlertDialogTrigger = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...triggerProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return /* @__PURE__ */ jsx(DialogPrimitive.Trigger, { ...dialogScope, ...triggerProps, ref: forwardedRef });
+  }
+);
+AlertDialogTrigger.displayName = TRIGGER_NAME;
+var PORTAL_NAME = "AlertDialogPortal";
+var AlertDialogPortal = (props) => {
+  const { __scopeAlertDialog, ...portalProps } = props;
+  const dialogScope = useDialogScope(__scopeAlertDialog);
+  return /* @__PURE__ */ jsx(DialogPrimitive.Portal, { ...dialogScope, ...portalProps });
+};
+AlertDialogPortal.displayName = PORTAL_NAME;
+var OVERLAY_NAME = "AlertDialogOverlay";
+var AlertDialogOverlay = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...overlayProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return /* @__PURE__ */ jsx(DialogPrimitive.Overlay, { ...dialogScope, ...overlayProps, ref: forwardedRef });
+  }
+);
+AlertDialogOverlay.displayName = OVERLAY_NAME;
+var CONTENT_NAME = "AlertDialogContent";
+var [AlertDialogContentProvider, useAlertDialogContentContext] = createAlertDialogContext(CONTENT_NAME);
+var AlertDialogContent = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, children, ...contentProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    const contentRef = React.useRef(null);
+    const composedRefs = useComposedRefs(forwardedRef, contentRef);
+    const cancelRef = React.useRef(null);
+    return /* @__PURE__ */ jsx(
+      DialogPrimitive.WarningProvider,
+      {
+        contentName: CONTENT_NAME,
+        titleName: TITLE_NAME,
+        docsSlug: "alert-dialog",
+        children: /* @__PURE__ */ jsx(AlertDialogContentProvider, { scope: __scopeAlertDialog, cancelRef, children: /* @__PURE__ */ jsxs(
+          DialogPrimitive.Content,
+          {
+            role: "alertdialog",
+            ...dialogScope,
+            ...contentProps,
+            ref: composedRefs,
+            onOpenAutoFocus: composeEventHandlers(contentProps.onOpenAutoFocus, (event) => {
+              event.preventDefault();
+              cancelRef.current?.focus({ preventScroll: true });
+            }),
+            onPointerDownOutside: (event) => event.preventDefault(),
+            onInteractOutside: (event) => event.preventDefault(),
+            children: [
+              /* @__PURE__ */ jsx(Slottable, { children }),
+              /* @__PURE__ */ jsx(DescriptionWarning, { contentRef })
+            ]
+          }
+        ) })
+      }
+    );
+  }
+);
+AlertDialogContent.displayName = CONTENT_NAME;
+var TITLE_NAME = "AlertDialogTitle";
+var AlertDialogTitle = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...titleProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return /* @__PURE__ */ jsx(DialogPrimitive.Title, { ...dialogScope, ...titleProps, ref: forwardedRef });
+  }
+);
+AlertDialogTitle.displayName = TITLE_NAME;
+var DESCRIPTION_NAME = "AlertDialogDescription";
+var AlertDialogDescription = React.forwardRef((props, forwardedRef) => {
+  const { __scopeAlertDialog, ...descriptionProps } = props;
+  const dialogScope = useDialogScope(__scopeAlertDialog);
+  return /* @__PURE__ */ jsx(DialogPrimitive.Description, { ...dialogScope, ...descriptionProps, ref: forwardedRef });
+});
+AlertDialogDescription.displayName = DESCRIPTION_NAME;
+var ACTION_NAME = "AlertDialogAction";
+var AlertDialogAction = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...actionProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return /* @__PURE__ */ jsx(DialogPrimitive.Close, { ...dialogScope, ...actionProps, ref: forwardedRef });
+  }
+);
+AlertDialogAction.displayName = ACTION_NAME;
+var CANCEL_NAME = "AlertDialogCancel";
+var AlertDialogCancel = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAlertDialog, ...cancelProps } = props;
+    const { cancelRef } = useAlertDialogContentContext(CANCEL_NAME, __scopeAlertDialog);
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    const ref = useComposedRefs(forwardedRef, cancelRef);
+    return /* @__PURE__ */ jsx(DialogPrimitive.Close, { ...dialogScope, ...cancelProps, ref });
+  }
+);
+AlertDialogCancel.displayName = CANCEL_NAME;
+var DescriptionWarning = ({ contentRef }) => {
+  const MESSAGE = `\`${CONTENT_NAME}\` requires a description for the component to be accessible for screen reader users.
+
+You 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.
+
+Alternatively, 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.
+
+For more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;
+  React.useEffect(() => {
+    const hasDescription = document.getElementById(
+      contentRef.current?.getAttribute("aria-describedby")
+    );
+    if (!hasDescription) console.warn(MESSAGE);
+  }, [MESSAGE, contentRef]);
+  return null;
+};
+var Root2 = AlertDialog;
+var Trigger2 = AlertDialogTrigger;
+var Portal2 = AlertDialogPortal;
+var Overlay2 = AlertDialogOverlay;
+var Content2 = AlertDialogContent;
+var Action = AlertDialogAction;
+var Cancel = AlertDialogCancel;
+var Title2 = AlertDialogTitle;
+var Description2 = AlertDialogDescription;
+export {
+  Action,
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogOverlay,
+  AlertDialogPortal,
+  AlertDialogTitle,
+  AlertDialogTrigger,
+  Cancel,
+  Content2 as Content,
+  Description2 as Description,
+  Overlay2 as Overlay,
+  Portal2 as Portal,
+  Root2 as Root,
+  Title2 as Title,
+  Trigger2 as Trigger,
+  createAlertDialogScope
+};
+//# sourceMappingURL=index.mjs.map

node_modules/@radix-ui/react-alert-dialog/package.json

@@ -0,0 +1,60 @@
+{
+  "name": "@radix-ui/react-alert-dialog",
+  "version": "1.1.2",
+  "license": "MIT",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      }
+    }
+  },
+  "source": "./src/index.ts",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "src",
+    "dist"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "clean": "rm -rf dist",
+    "version": "yarn version"
+  },
+  "dependencies": {
+    "@radix-ui/primitive": "1.1.0",
+    "@radix-ui/react-compose-refs": "1.1.0",
+    "@radix-ui/react-context": "1.1.1",
+    "@radix-ui/react-dialog": "1.1.2",
+    "@radix-ui/react-primitive": "2.0.0",
+    "@radix-ui/react-slot": "1.1.0"
+  },
+  "peerDependencies": {
+    "@types/react": "*",
+    "@types/react-dom": "*",
+    "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+    "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+  },
+  "peerDependenciesMeta": {
+    "@types/react": {
+      "optional": true
+    },
+    "@types/react-dom": {
+      "optional": true
+    }
+  },
+  "homepage": "https://radix-ui.com/primitives",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/radix-ui/primitives.git"
+  },
+  "bugs": {
+    "url": "https://github.com/radix-ui/primitives/issues"
+  }
+}

node_modules/@radix-ui/react-alert-dialog/src/AlertDialog.stories.tsx

@@ -0,0 +1,353 @@
+import * as React from 'react';
+import { css } from '../../../../stitches.config';
+import * as AlertDialog from '@radix-ui/react-alert-dialog';
+
+export default { title: 'Components/AlertDialog' };
+
+export const Styled = () => (
+  <AlertDialog.Root>
+    <AlertDialog.Trigger className={triggerClass()}>delete everything</AlertDialog.Trigger>
+    <AlertDialog.Portal>
+      <AlertDialog.Overlay className={overlayClass()} />
+      <AlertDialog.Content className={contentClass()}>
+        <AlertDialog.Title className={titleClass()}>Are you sure?</AlertDialog.Title>
+        <AlertDialog.Description className={descriptionClass()}>
+          This will do a very dangerous thing. Thar be dragons!
+        </AlertDialog.Description>
+        <AlertDialog.Action className={actionClass()}>yolo, do it</AlertDialog.Action>
+        <AlertDialog.Cancel className={cancelClass()}>maybe not</AlertDialog.Cancel>
+      </AlertDialog.Content>
+    </AlertDialog.Portal>
+  </AlertDialog.Root>
+);
+
+export const Controlled = () => {
+  const [open, setOpen] = React.useState(false);
+  const [housePurchased, setHousePurchased] = React.useState(false);
+
+  return (
+    <div>
+      <div>
+        <img src="https://i.ibb.co/K54hsKt/house.jpg" alt="a large white house with a red roof" />
+      </div>
+      <AlertDialog.Root open={open} onOpenChange={setOpen}>
+        <AlertDialog.Trigger
+          onClick={(e) => {
+            if (housePurchased) {
+              e.preventDefault();
+              setHousePurchased(false);
+            }
+          }}
+        >
+          {housePurchased ? 'You bought the house! Sell it!' : 'Buy this house'}
+        </AlertDialog.Trigger>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay className={overlayClass()} />
+          <AlertDialog.Content className={contentClass()}>
+            <AlertDialog.Title>Are you sure?</AlertDialog.Title>
+            <AlertDialog.Description>
+              Houses are very expensive and it looks like you only have €20 in the bank. Maybe
+              consult with a financial advisor?
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionClass()} onClick={() => setHousePurchased(true)}>
+              buy it anyway
+            </AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelClass()}>
+              good point, I'll reconsider
+            </AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+      </AlertDialog.Root>
+    </div>
+  );
+};
+
+export const Chromatic = () => (
+  <div
+    style={{
+      display: 'grid',
+      gridTemplateColumns: 'repeat(4, 1fr)',
+      gridTemplateRows: 'repeat(2, 1fr)',
+      height: '100vh',
+    }}
+  >
+    <div>
+      <h1>Uncontrolled</h1>
+      <h2>Closed</h2>
+      <AlertDialog.Root>
+        <AlertDialog.Trigger className={triggerClass()}>delete everything</AlertDialog.Trigger>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay className={overlayClass()} />
+          <AlertDialog.Content className={chromaticContentClass()}>
+            <AlertDialog.Title className={titleClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+      </AlertDialog.Root>
+
+      <h2>Open</h2>
+      <AlertDialog.Root defaultOpen>
+        <AlertDialog.Trigger className={triggerClass()}>delete everything</AlertDialog.Trigger>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay
+            className={overlayClass()}
+            style={{ left: 0, bottom: '50%', width: '25%' }}
+          />
+          <AlertDialog.Content
+            className={chromaticContentClass()}
+            style={{ top: '25%', left: '12%' }}
+          >
+            <AlertDialog.Title className={titleClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+      </AlertDialog.Root>
+    </div>
+
+    <div>
+      <h1>Uncontrolled with reordered parts</h1>
+      <h2>Closed</h2>
+      <AlertDialog.Root>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay className={overlayClass()} />
+          <AlertDialog.Content className={chromaticContentClass()}>
+            <AlertDialog.Title className={titleClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+        <AlertDialog.Trigger className={triggerClass()}>delete everything</AlertDialog.Trigger>
+      </AlertDialog.Root>
+
+      <h2>Open</h2>
+      <AlertDialog.Root defaultOpen>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay
+            className={overlayClass()}
+            style={{ left: '25%', bottom: '50%', width: '25%' }}
+          />
+          <AlertDialog.Content
+            className={chromaticContentClass()}
+            style={{ top: '25%', left: '37%' }}
+          >
+            <AlertDialog.Title className={titleClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+        <AlertDialog.Trigger className={triggerClass()}>delete everything</AlertDialog.Trigger>
+      </AlertDialog.Root>
+    </div>
+
+    <div>
+      <h1>Controlled</h1>
+      <h2>Closed</h2>
+      <AlertDialog.Root open={false}>
+        <AlertDialog.Trigger className={triggerClass()}>delete everything</AlertDialog.Trigger>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay className={overlayClass()} />
+          <AlertDialog.Content className={chromaticContentClass()}>
+            <AlertDialog.Title className={titleClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+      </AlertDialog.Root>
+
+      <h2>Open</h2>
+      <AlertDialog.Root open>
+        <AlertDialog.Trigger className={triggerClass()}>delete everything</AlertDialog.Trigger>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay
+            className={overlayClass()}
+            style={{ left: '50%', bottom: '50%', width: '25%' }}
+          />
+          <AlertDialog.Content
+            className={chromaticContentClass()}
+            style={{ top: '25%', left: '62%' }}
+          >
+            <AlertDialog.Title className={titleClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+      </AlertDialog.Root>
+    </div>
+
+    <div>
+      <h1>Controlled with reordered parts</h1>
+      <h2>Closed</h2>
+      <AlertDialog.Root open={false}>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay className={overlayClass()} />
+          <AlertDialog.Content className={chromaticContentClass()}>
+            <AlertDialog.Title className={titleClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+        <AlertDialog.Trigger className={triggerClass()}>delete everything</AlertDialog.Trigger>
+      </AlertDialog.Root>
+
+      <h2>Open</h2>
+      <AlertDialog.Root open>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay
+            className={overlayClass()}
+            style={{ left: '75%', bottom: '50%', width: '25%' }}
+          />
+          <AlertDialog.Content
+            className={chromaticContentClass()}
+            style={{ top: '25%', left: '88%' }}
+          >
+            <AlertDialog.Title className={titleClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+        <AlertDialog.Trigger className={triggerClass()}>delete everything</AlertDialog.Trigger>
+      </AlertDialog.Root>
+    </div>
+
+    <div>
+      <h1>State attributes</h1>
+      <h2>Closed</h2>
+      <AlertDialog.Root>
+        <AlertDialog.Trigger className={triggerAttrClass()}>delete everything</AlertDialog.Trigger>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay className={overlayAttrClass()} />
+          <AlertDialog.Content className={contentAttrClass()}>
+            <AlertDialog.Title className={titleAttrClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionAttrClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionAttrClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelAttrClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+      </AlertDialog.Root>
+
+      <h2>Open</h2>
+      <AlertDialog.Root defaultOpen>
+        <AlertDialog.Trigger className={triggerAttrClass()}>delete everything</AlertDialog.Trigger>
+        <AlertDialog.Portal>
+          <AlertDialog.Overlay className={overlayAttrClass()} style={{ top: '50%' }} />
+          <AlertDialog.Content className={contentAttrClass()} style={{ top: '75%' }}>
+            <AlertDialog.Title className={titleAttrClass()}>Title</AlertDialog.Title>
+            <AlertDialog.Description className={descriptionAttrClass()}>
+              Description
+            </AlertDialog.Description>
+            <AlertDialog.Action className={actionAttrClass()}>Confirm</AlertDialog.Action>
+            <AlertDialog.Cancel className={cancelAttrClass()}>Cancel</AlertDialog.Cancel>
+          </AlertDialog.Content>
+        </AlertDialog.Portal>
+      </AlertDialog.Root>
+    </div>
+  </div>
+);
+Chromatic.parameters = { chromatic: { disable: false } };
+
+const triggerClass = css({});
+
+const RECOMMENDED_CSS__ALERT_DIALOG__OVERLAY: any = {
+  // ensures overlay is positionned correctly
+  position: 'fixed',
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+};
+
+const overlayClass = css({
+  ...RECOMMENDED_CSS__ALERT_DIALOG__OVERLAY,
+  backgroundColor: 'black',
+  opacity: 0.2,
+});
+
+const RECOMMENDED_CSS__ALERT_DIALOG__CONTENT: any = {
+  // ensures good default position for content
+  position: 'fixed',
+  top: 0,
+  left: 0,
+};
+
+const contentClass = css({
+  ...RECOMMENDED_CSS__ALERT_DIALOG__CONTENT,
+  top: '50%',
+  left: '50%',
+  transform: 'translate(-50%, -50%)',
+  background: 'white',
+  minWidth: 300,
+  minHeight: 150,
+  padding: 50,
+  borderRadius: 10,
+  backgroundColor: 'white',
+  boxShadow: '0 2px 10px rgba(0, 0, 0, 0.12)',
+});
+
+const cancelClass = css({
+  appearance: 'none',
+  padding: 10,
+  border: 'none',
+  background: '$grey100',
+});
+
+const actionClass = css({
+  appearance: 'none',
+  padding: 10,
+  border: 'none',
+  backgroundColor: '$red',
+  color: '$white',
+});
+
+const titleClass = css({});
+
+const descriptionClass = css({});
+
+const chromaticContentClass = css(contentClass, {
+  padding: 10,
+  minWidth: 'auto',
+  minHeight: 'auto',
+});
+
+const styles = {
+  backgroundColor: 'rgba(0, 0, 255, 0.3)',
+  border: '2px solid blue',
+  padding: 10,
+
+  '&[data-state="closed"]': { borderColor: 'red' },
+  '&[data-state="open"]': { borderColor: 'green' },
+};
+const triggerAttrClass = css(styles);
+const overlayAttrClass = css(overlayClass, styles);
+const contentAttrClass = css(chromaticContentClass, styles);
+const cancelAttrClass = css(styles);
+const actionAttrClass = css(styles);
+const titleAttrClass = css(styles);
+const descriptionAttrClass = css(styles);

node_modules/@radix-ui/react-alert-dialog/src/AlertDialog.test.tsx

@@ -0,0 +1,61 @@
+import React from 'react';
+import { axe } from 'jest-axe';
+import { RenderResult } from '@testing-library/react';
+import { render, fireEvent } from '@testing-library/react';
+import * as AlertDialog from '@radix-ui/react-alert-dialog';
+
+const OPEN_TEXT = 'Open';
+const CANCEL_TEXT = 'Cancel';
+const ACTION_TEXT = 'Do it';
+const TITLE_TEXT = 'Warning';
+const DESC_TEXT = 'This is a warning';
+const OVERLAY_TEST_ID = 'test-overlay';
+
+const DialogTest = (props: React.ComponentProps<typeof AlertDialog.Root>) => (
+  <AlertDialog.Root {...props}>
+    <AlertDialog.Trigger>{OPEN_TEXT}</AlertDialog.Trigger>
+    <AlertDialog.Overlay data-testid={OVERLAY_TEST_ID} />
+    <AlertDialog.Content>
+      <AlertDialog.Title>{TITLE_TEXT}</AlertDialog.Title>
+      <AlertDialog.Description>{DESC_TEXT}</AlertDialog.Description>
+      <AlertDialog.Cancel>{CANCEL_TEXT}</AlertDialog.Cancel>
+      <AlertDialog.Action>{ACTION_TEXT}</AlertDialog.Action>
+    </AlertDialog.Content>
+  </AlertDialog.Root>
+);
+
+describe('given a default Dialog', () => {
+  let rendered: RenderResult;
+  let title: HTMLElement;
+  let trigger: HTMLElement;
+  let cancelButton: HTMLElement;
+
+  beforeEach(() => {
+    rendered = render(<DialogTest />);
+    trigger = rendered.getByText(OPEN_TEXT);
+  });
+
+  it('should have no accessibility violations in default state', async () => {
+    expect(await axe(rendered.container)).toHaveNoViolations();
+  });
+
+  describe('after clicking the trigger', () => {
+    beforeEach(() => {
+      fireEvent.click(trigger);
+      title = rendered.getByText(TITLE_TEXT);
+      cancelButton = rendered.getByText(CANCEL_TEXT);
+    });
+
+    it('should open the content', () => {
+      expect(title).toBeVisible();
+    });
+
+    it('should have no accessibility violations when open', async () => {
+      expect(await axe(rendered.container)).toHaveNoViolations();
+    });
+
+    it('should focus the cancel button', () => {
+      expect(cancelButton).toHaveFocus();
+    });
+  });
+});

node_modules/@radix-ui/react-alert-dialog/src/AlertDialog.tsx

@@ -0,0 +1,306 @@
+import * as React from 'react';
+import { createContextScope } from '@radix-ui/react-context';
+import { useComposedRefs } from '@radix-ui/react-compose-refs';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { createDialogScope } from '@radix-ui/react-dialog';
+import { composeEventHandlers } from '@radix-ui/primitive';
+import { Slottable } from '@radix-ui/react-slot';
+
+import type { Scope } from '@radix-ui/react-context';
+
+/* -------------------------------------------------------------------------------------------------
+ * AlertDialog
+ * -----------------------------------------------------------------------------------------------*/
+
+const ROOT_NAME = 'AlertDialog';
+
+type ScopedProps<P> = P & { __scopeAlertDialog?: Scope };
+const [createAlertDialogContext, createAlertDialogScope] = createContextScope(ROOT_NAME, [
+  createDialogScope,
+]);
+const useDialogScope = createDialogScope();
+
+type DialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;
+interface AlertDialogProps extends Omit<DialogProps, 'modal'> {}
+
+const AlertDialog: React.FC<AlertDialogProps> = (props: ScopedProps<AlertDialogProps>) => {
+  const { __scopeAlertDialog, ...alertDialogProps } = props;
+  const dialogScope = useDialogScope(__scopeAlertDialog);
+  return <DialogPrimitive.Root {...dialogScope} {...alertDialogProps} modal={true} />;
+};
+
+AlertDialog.displayName = ROOT_NAME;
+
+/* -------------------------------------------------------------------------------------------------
+ * AlertDialogTrigger
+ * -----------------------------------------------------------------------------------------------*/
+const TRIGGER_NAME = 'AlertDialogTrigger';
+
+type AlertDialogTriggerElement = React.ElementRef<typeof DialogPrimitive.Trigger>;
+type DialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;
+interface AlertDialogTriggerProps extends DialogTriggerProps {}
+
+const AlertDialogTrigger = React.forwardRef<AlertDialogTriggerElement, AlertDialogTriggerProps>(
+  (props: ScopedProps<AlertDialogTriggerProps>, forwardedRef) => {
+    const { __scopeAlertDialog, ...triggerProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return <DialogPrimitive.Trigger {...dialogScope} {...triggerProps} ref={forwardedRef} />;
+  }
+);
+
+AlertDialogTrigger.displayName = TRIGGER_NAME;
+
+/* -------------------------------------------------------------------------------------------------
+ * AlertDialogPortal
+ * -----------------------------------------------------------------------------------------------*/
+
+const PORTAL_NAME = 'AlertDialogPortal';
+
+type DialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;
+interface AlertDialogPortalProps extends DialogPortalProps {}
+
+const AlertDialogPortal: React.FC<AlertDialogPortalProps> = (
+  props: ScopedProps<AlertDialogPortalProps>
+) => {
+  const { __scopeAlertDialog, ...portalProps } = props;
+  const dialogScope = useDialogScope(__scopeAlertDialog);
+  return <DialogPrimitive.Portal {...dialogScope} {...portalProps} />;
+};
+
+AlertDialogPortal.displayName = PORTAL_NAME;
+
+/* -------------------------------------------------------------------------------------------------
+ * AlertDialogOverlay
+ * -----------------------------------------------------------------------------------------------*/
+
+const OVERLAY_NAME = 'AlertDialogOverlay';
+
+type AlertDialogOverlayElement = React.ElementRef<typeof DialogPrimitive.Overlay>;
+type DialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;
+interface AlertDialogOverlayProps extends DialogOverlayProps {}
+
+const AlertDialogOverlay = React.forwardRef<AlertDialogOverlayElement, AlertDialogOverlayProps>(
+  (props: ScopedProps<AlertDialogOverlayProps>, forwardedRef) => {
+    const { __scopeAlertDialog, ...overlayProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return <DialogPrimitive.Overlay {...dialogScope} {...overlayProps} ref={forwardedRef} />;
+  }
+);
+
+AlertDialogOverlay.displayName = OVERLAY_NAME;
+
+/* -------------------------------------------------------------------------------------------------
+ * AlertDialogContent
+ * -----------------------------------------------------------------------------------------------*/
+
+const CONTENT_NAME = 'AlertDialogContent';
+
+type AlertDialogContentContextValue = {
+  cancelRef: React.MutableRefObject<AlertDialogCancelElement | null>;
+};
+
+const [AlertDialogContentProvider, useAlertDialogContentContext] =
+  createAlertDialogContext<AlertDialogContentContextValue>(CONTENT_NAME);
+
+type AlertDialogContentElement = React.ElementRef<typeof DialogPrimitive.Content>;
+type DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;
+interface AlertDialogContentProps
+  extends Omit<DialogContentProps, 'onPointerDownOutside' | 'onInteractOutside'> {}
+
+const AlertDialogContent = React.forwardRef<AlertDialogContentElement, AlertDialogContentProps>(
+  (props: ScopedProps<AlertDialogContentProps>, forwardedRef) => {
+    const { __scopeAlertDialog, children, ...contentProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    const contentRef = React.useRef<AlertDialogContentElement>(null);
+    const composedRefs = useComposedRefs(forwardedRef, contentRef);
+    const cancelRef = React.useRef<AlertDialogCancelElement | null>(null);
+
+    return (
+      <DialogPrimitive.WarningProvider
+        contentName={CONTENT_NAME}
+        titleName={TITLE_NAME}
+        docsSlug="alert-dialog"
+      >
+        <AlertDialogContentProvider scope={__scopeAlertDialog} cancelRef={cancelRef}>
+          <DialogPrimitive.Content
+            role="alertdialog"
+            {...dialogScope}
+            {...contentProps}
+            ref={composedRefs}
+            onOpenAutoFocus={composeEventHandlers(contentProps.onOpenAutoFocus, (event) => {
+              event.preventDefault();
+              cancelRef.current?.focus({ preventScroll: true });
+            })}
+            onPointerDownOutside={(event) => event.preventDefault()}
+            onInteractOutside={(event) => event.preventDefault()}
+          >
+            {/**
+             * We have to use `Slottable` here as we cannot wrap the `AlertDialogContentProvider`
+             * around everything, otherwise the `DescriptionWarning` would be rendered straight away.
+             * This is because we want the accessibility checks to run only once the content is actually
+             * open and that behaviour is already encapsulated in `DialogContent`.
+             */}
+            <Slottable>{children}</Slottable>
+            {process.env.NODE_ENV === 'development' && (
+              <DescriptionWarning contentRef={contentRef} />
+            )}
+          </DialogPrimitive.Content>
+        </AlertDialogContentProvider>
+      </DialogPrimitive.WarningProvider>
+    );
+  }
+);
+
+AlertDialogContent.displayName = CONTENT_NAME;
+
+/* -------------------------------------------------------------------------------------------------
+ * AlertDialogTitle
+ * -----------------------------------------------------------------------------------------------*/
+
+const TITLE_NAME = 'AlertDialogTitle';
+
+type AlertDialogTitleElement = React.ElementRef<typeof DialogPrimitive.Title>;
+type DialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;
+interface AlertDialogTitleProps extends DialogTitleProps {}
+
+const AlertDialogTitle = React.forwardRef<AlertDialogTitleElement, AlertDialogTitleProps>(
+  (props: ScopedProps<AlertDialogTitleProps>, forwardedRef) => {
+    const { __scopeAlertDialog, ...titleProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return <DialogPrimitive.Title {...dialogScope} {...titleProps} ref={forwardedRef} />;
+  }
+);
+
+AlertDialogTitle.displayName = TITLE_NAME;
+
+/* -------------------------------------------------------------------------------------------------
+ * AlertDialogDescription
+ * -----------------------------------------------------------------------------------------------*/
+
+const DESCRIPTION_NAME = 'AlertDialogDescription';
+
+type AlertDialogDescriptionElement = React.ElementRef<typeof DialogPrimitive.Description>;
+type DialogDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;
+interface AlertDialogDescriptionProps extends DialogDescriptionProps {}
+
+const AlertDialogDescription = React.forwardRef<
+  AlertDialogDescriptionElement,
+  AlertDialogDescriptionProps
+>((props: ScopedProps<AlertDialogDescriptionProps>, forwardedRef) => {
+  const { __scopeAlertDialog, ...descriptionProps } = props;
+  const dialogScope = useDialogScope(__scopeAlertDialog);
+  return <DialogPrimitive.Description {...dialogScope} {...descriptionProps} ref={forwardedRef} />;
+});
+
+AlertDialogDescription.displayName = DESCRIPTION_NAME;
+
+/* -------------------------------------------------------------------------------------------------
+ * AlertDialogAction
+ * -----------------------------------------------------------------------------------------------*/
+
+const ACTION_NAME = 'AlertDialogAction';
+
+type AlertDialogActionElement = React.ElementRef<typeof DialogPrimitive.Close>;
+type DialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;
+interface AlertDialogActionProps extends DialogCloseProps {}
+
+const AlertDialogAction = React.forwardRef<AlertDialogActionElement, AlertDialogActionProps>(
+  (props: ScopedProps<AlertDialogActionProps>, forwardedRef) => {
+    const { __scopeAlertDialog, ...actionProps } = props;
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    return <DialogPrimitive.Close {...dialogScope} {...actionProps} ref={forwardedRef} />;
+  }
+);
+
+AlertDialogAction.displayName = ACTION_NAME;
+
+/* -------------------------------------------------------------------------------------------------
+ * AlertDialogCancel
+ * -----------------------------------------------------------------------------------------------*/
+
+const CANCEL_NAME = 'AlertDialogCancel';
+
+type AlertDialogCancelElement = React.ElementRef<typeof DialogPrimitive.Close>;
+interface AlertDialogCancelProps extends DialogCloseProps {}
+
+const AlertDialogCancel = React.forwardRef<AlertDialogCancelElement, AlertDialogCancelProps>(
+  (props: ScopedProps<AlertDialogCancelProps>, forwardedRef) => {
+    const { __scopeAlertDialog, ...cancelProps } = props;
+    const { cancelRef } = useAlertDialogContentContext(CANCEL_NAME, __scopeAlertDialog);
+    const dialogScope = useDialogScope(__scopeAlertDialog);
+    const ref = useComposedRefs(forwardedRef, cancelRef);
+    return <DialogPrimitive.Close {...dialogScope} {...cancelProps} ref={ref} />;
+  }
+);
+
+AlertDialogCancel.displayName = CANCEL_NAME;
+
+/* ---------------------------------------------------------------------------------------------- */
+
+type DescriptionWarningProps = {
+  contentRef: React.RefObject<AlertDialogContentElement>;
+};
+
+const DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef }) => {
+  const MESSAGE = `\`${CONTENT_NAME}\` requires a description for the component to be accessible for screen reader users.
+
+You 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.
+
+Alternatively, 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.
+
+For more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;
+
+  React.useEffect(() => {
+    const hasDescription = document.getElementById(
+      contentRef.current?.getAttribute('aria-describedby')!
+    );
+    if (!hasDescription) console.warn(MESSAGE);
+  }, [MESSAGE, contentRef]);
+
+  return null;
+};
+
+const Root = AlertDialog;
+const Trigger = AlertDialogTrigger;
+const Portal = AlertDialogPortal;
+const Overlay = AlertDialogOverlay;
+const Content = AlertDialogContent;
+const Action = AlertDialogAction;
+const Cancel = AlertDialogCancel;
+const Title = AlertDialogTitle;
+const Description = AlertDialogDescription;
+
+export {
+  createAlertDialogScope,
+  //
+  AlertDialog,
+  AlertDialogTrigger,
+  AlertDialogPortal,
+  AlertDialogOverlay,
+  AlertDialogContent,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogTitle,
+  AlertDialogDescription,
+  //
+  Root,
+  Trigger,
+  Portal,
+  Overlay,
+  Content,
+  Action,
+  Cancel,
+  Title,
+  Description,
+};
+export type {
+  AlertDialogProps,
+  AlertDialogTriggerProps,
+  AlertDialogPortalProps,
+  AlertDialogOverlayProps,
+  AlertDialogContentProps,
+  AlertDialogActionProps,
+  AlertDialogCancelProps,
+  AlertDialogTitleProps,
+  AlertDialogDescriptionProps,
+};

node_modules/@radix-ui/react-alert-dialog/src/index.ts

@@ -0,0 +1,35 @@
+'use client';
+export {
+  createAlertDialogScope,
+  //
+  AlertDialog,
+  AlertDialogTrigger,
+  AlertDialogPortal,
+  AlertDialogOverlay,
+  AlertDialogContent,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogTitle,
+  AlertDialogDescription,
+  //
+  Root,
+  Trigger,
+  Portal,
+  Overlay,
+  Content,
+  Action,
+  Cancel,
+  Title,
+  Description,
+} from './AlertDialog';
+export type {
+  AlertDialogProps,
+  AlertDialogTriggerProps,
+  AlertDialogPortalProps,
+  AlertDialogOverlayProps,
+  AlertDialogContentProps,
+  AlertDialogActionProps,
+  AlertDialogCancelProps,
+  AlertDialogTitleProps,
+  AlertDialogDescriptionProps,
+} from './AlertDialog';