analytica-frontend-lib/dist/Modal/index.d.mts

Repositório público dos componentes utilizados nas plataformas da Analytica Ensino

import * as react_jsx_runtime from 'react/jsx-runtime';
import { ReactNode } from 'react';

/**
 * Modal component props interface
 */
type ModalProps = {
    /** Whether the modal is open */
    isOpen: boolean;
    /** Function to close the modal */
    onClose: () => void;
    /** Modal title */
    title: string;
    /** Modal description/content */
    children?: ReactNode;
    /** Size of the modal */
    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
    /** Additional CSS classes for the modal content */
    className?: string;
    /** Whether pressing Escape should close the modal */
    closeOnEscape?: boolean;
    /** Footer content (typically buttons) */
    footer?: ReactNode;
    /** Hide the close button */
    hideCloseButton?: boolean;
    /** Modal variant */
    variant?: 'default' | 'activity';
    /** Description for activity variant */
    description?: string;
    /** Image URL for activity variant */
    image?: string;
    /** Alt text for activity image (leave empty for decorative images) */
    imageAlt?: string;
    /** Action link for activity variant */
    actionLink?: string;
    /** Action button label for activity variant */
    actionLabel?: string;
};
/**
 * Modal component for Analytica Ensino platforms
 *
 * A flexible modal component with multiple size variants and customizable behavior.
 *
 * @param isOpen - Whether the modal is currently open
 * @param onClose - Callback function called when the modal should be closed
 * @param title - The title displayed at the top of the modal
 * @param children - The main content of the modal
 * @param size - The size variant (xs, sm, md, lg, xl)
 * @param className - Additional CSS classes for the modal content
 * @param closeOnEscape - Whether pressing Escape closes the modal (default: true)
 * @param footer - Footer content, typically action buttons
 * @param hideCloseButton - Whether to hide the X close button (default: false)
 * @returns A modal overlay with content
 *
 * @example
 * ```tsx
 * <Modal
 *   isOpen={isModalOpen}
 *   onClose={() => setIsModalOpen(false)}
 *   title="Invite your team"
 *   size="md"
 *   footer={
 *     <div className="flex gap-3">
 *       <Button variant="outline" onClick={() => setIsModalOpen(false)}>Cancel</Button>
 *       <Button variant="solid" onClick={handleExplore}>Explore</Button>
 *     </div>
 *   }
 * >
 *   Elevate user interactions with our versatile modals.
 * </Modal>
 * ```
 */
declare const Modal: ({ isOpen, onClose, title, children, size, className, closeOnEscape, footer, hideCloseButton, variant, description, image, imageAlt, actionLink, actionLabel, }: ModalProps) => react_jsx_runtime.JSX.Element | null;

export { Modal as default };