@rws-aoa/react-library/dist/components/molecules/form-modal/FormModal.d.ts

RWS AOA Design System

import { AoaButtonProps } from '../../atoms/button/Button';
import { AoaModalProps } from '../modal/Modal';
import { AoaModalCloseButtonProps } from '../modal-close-button/ModalCloseButton';
export interface AoaFormModalQAs {
    /**
     * Data-qa tag applied to the "cancel" button
     */
    cancelButton?: string;
    /**
     * Data-qa tag applied to the `DialogActions` component
     */
    dialogActions?: string;
    /**
     * Data-qa tag applied to the HTML `form` element
     */
    form?: string;
    /**
     * Data-qa tag applied to the "submit" button
     */
    submitButton?: string;
}
export interface AoaFormModalLabels {
    cancel: string;
    submit: string;
}
export interface AoaFormModalProps extends Omit<AoaModalProps, 'dialogActions'>, AoaModalCloseButtonProps {
    /**
     * Additional properties to provide to the {@link AoaButton | submit button}
     */
    AoaSubmitButtonProps?: Omit<AoaButtonProps, 'buttonType' | 'data-qa' | 'disabled' | 'onClick' | 'type'> & {
        disableWithFormState?: boolean;
    };
    /**
     * Labels for the buttons in {@link DialogActions}
     */
    formLabels: AoaFormModalLabels;
    /**
     * data-qa tags for the components in the form section of the modal
     */
    formModalQas?: AoaFormModalQAs;
    /**
     * Optionally the `name` property for the HTML form element
     */
    formName?: string;
}
/**
 * Constructs a modal **for holding a Form** using pre-defined Rijks styling
 *
 * For a modal without a form see `AoaModal`
 *
 * This component is intended for internal use only and should always be used through `<form.AoaFormModal />`
 *
 * @internal
 * @param props - Props to pass to the modal - {@link ModalProps}
 * @example
 * ```jsx
 * <form.AppForm>
 *   <form.AoaFormModal
 *     open={true}
 *     formLabels={{
 *       submit: 'submit',
 *       cancel: 'cancel'
 *     }}
 *     formModalQas={{
 *       cancelButton: 'cancel-button',
 *       dialogActions: 'dialog-actions,
 *       form: 'form',
 *       submitButton: 'confirm-button'
 *     }}
 *     closeAction={handleClose}
 *     topic='topic'
 *     modalQas={{
 *       modal: 'modal',
 *       content: 'modal-content',
 *       title: 'modal-title'
 *     }}
 *     formName='form'
 *     dialogContent={content}
 *   />
 * </form.AppForm>
 * ```
 */
export declare function AoaFormModal({ formModalQas, formLabels, formName, DialogProps, DialogTitleProps, DialogContentProps, AoaSubmitButtonProps: { disableWithFormState, ...AoaSubmitButtonProps }, modalQas, open, topic, dialogContent, closeAction }: Readonly<AoaFormModalProps>): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=FormModal.d.ts.map