@ultraviolet/plus/dist/components/SteppedListCard/SteppedListCard.d.ts

Ultraviolet Plus

import type { ReactNode } from 'react';
type SteppedListContainerProps = {
    /**
     * Title of the section, introduces the feature.
     */
    header: ReactNode;
    /**
     * List of steps
     */
    steps: string[];
    /**
     * Define here the content of each step
     */
    children: ReactNode;
    /**
     * Function called when the component is closed. This function will overload the default behavior.
     */
    onClickHide?: () => void;
} & ({
    /**
     * Show the toggle option
     */
    showToggleOption: false;
    hideTooltipText?: never;
    hideText?: never;
    showText?: never;
    showTooltipText?: never;
} | {
    /**
     * Show the toggle option
     */
    showToggleOption?: true;
    /**
     * Text of the tooltip on the hide button
     */
    hideTooltipText?: string;
    /**
     * Text of the "hide" button
     */
    hideText?: string;
    /**
     * Text of the "show" button
     */
    showText?: string;
    /**
     * Text of tooltip on the "show" button
     */
    showTooltipText?: string;
});
/**
 * SteppedListCard is a component created for guiding users through steps in a structured and linear manner.
 * It can pass prop "nextStep" to its children.
 */
declare const SteppedListCard: {
    ({ header, showToggleOption, hideTooltipText, hideText, showText, showTooltipText, children, steps, onClickHide, }: SteppedListContainerProps): import("@emotion/react/jsx-runtime").JSX.Element;
    Step: ({ subHeader, children, image, stepNumber, completed, }: {
        subHeader?: ReactNode;
        children: ((nextStep: (completed: boolean) => void) => ReactNode) | ReactNode;
        image?: ReactNode;
        stepNumber: number;
        completed?: boolean;
    }) => import("@emotion/react/jsx-runtime").JSX.Element | null;
};
export { SteppedListCard };