@arc-ui/components 11.6.0 → 11.8.0

package/dist/Modal/Modal.esm.d.ts

@@ -0,0 +1,53 @@
+/// <reference types="react" />
+import React from "react";
+import { FC } from "react";
+import { ButtonProps } from "../_shared/esm/Button-d1dbcf79";
+/** Use `Modal` to focus a user's attention to an urgent or required prompt for interaction or input. */
+declare const Modal: FC<ModalProps>;
+interface ModalProps {
+    /**
+     * Title for the modal. This will be announced by screen readers when the modal opens.
+     */
+    title: string;
+    /**
+     * Role for the modal. use alertdialog if explicit user input is required e.g deleting an account. role alertdialog will remove the ability to close the modal by either the esc key being pressed, clicking the cross icon or clicking outside.
+     */
+    role?: "dialog" | "alertdialog";
+    /**
+     * Whether to return focus to the element that was focused before the modal opened. True by default.
+     */
+    shouldReturnFocus?: boolean;
+    /**
+     * Description for the modal. This will be announced by screen readers when the modal opens.
+     */
+    description?: string;
+    /**
+     * ID for the element description to be announced by screenreaders in addition to the title.
+     */
+    ariaDescribedBy?: string;
+    /**
+     * Configurable actions for the modal.
+     */
+    actions?: Pick<ButtonProps, "form" | "type" | "fill" | "icon" | "iconPosition" | "href" | "id" | "label" | "onClick" | "isDisabled" | "ariaLabel" | "rel">[];
+    /**
+     * Function to be called when the modal has been requested to close by either the esc key being pressed, outside the dialog being clicked or the close button being clicked. The callback must set the open state of the modal to false. This function is ignored if the `role` prop is set to `alertdialog`. You can prevent this behavior with the `dialog` role by ommitting this prop.
+     */
+    onRequestClose?: () => void;
+    /**
+     * Size of the modal dialog.
+     */
+    size?: "s" | "m" | "l";
+    /**
+     * Set modal open or closed.
+     */
+    isOpen?: boolean;
+    /**
+     * Enables the dialog content to be scrolled internally.
+     */
+    isContentScrollable?: boolean;
+    /**
+     * Custom content for `Modal`.
+     */
+    children?: React.ReactNode;
+}
+export { Modal };