/**
 * Web FormStatus Component
 */
import React from 'react';
import type { GlobalStatusConfigObject } from '../GlobalStatus';
import type { IconIcon, IconSize } from '../Icon';
import type { SkeletonShow } from '../Skeleton';
import type { SpacingProps, SpaceTypeAll } from '../../shared/types';
export type FormStatusText = string | boolean | (() => React.ReactNode) | React.ReactNode;
export type FormStatusState = 'error' | 'warning' | 'information' | 'success' | 'marketing';
export type FormStatusVariant = 'plain' | 'outlined';
export type FormStatusSize = 'default' | 'large';
export type FormStatusAttributes = string | Record<string, unknown>;
export type FormStatusChildren = string | (() => React.ReactNode) | React.ReactNode;
/**
 * Shared status-related props used by form components that display a FormStatus.
 */
export type FormStatusBaseProps = {
    /**
     * Text with a status message. The style defaults to an error message. You can use `true` to only get the status color, without a message.
     */
    status?: FormStatusText;
    /**
     * Defines the state of the status. Valid states are `error`, `warning`, `information`, `success` and `marketing`. Defaults to `error`.
     */
    statusState?: FormStatusState;
    /**
     * Use an object to define additional FormStatus properties.
     */
    statusProps?: FormStatusProps;
    /**
     * Set to `true` to disable the status animation. Defaults to `false`.
     */
    statusNoAnimation?: boolean;
    /**
     * The [configuration](/uilib/components/global-status/properties/#configuration-object) used for the target [GlobalStatus](/uilib/components/global-status).
     */
    globalStatus?: GlobalStatusConfigObject;
};
export type FormStatusProps = {
    id?: string;
    /**
     * The `title` attribute in the status.
     */
    title?: string;
    label?: React.ReactNode;
    /**
     * Provide `false` if you want to animate the visibility. Defaults to `true`.
     */
    show?: boolean;
    /**
     * The `text` appears as the status message. Beside plain text, you can send in a React component as well.
     */
    text?: FormStatusText;
    /**
     * The [configuration](/uilib/components/global-status/properties/#configuration-object) used for the target [GlobalStatus](/uilib/components/global-status).
     */
    globalStatus?: GlobalStatusConfigObject;
    /**
     * The `icon` show before the status text. Default: `error`
     */
    icon?: IconIcon;
    /**
     * The icon size of the icon shows. Default: `medium`
     */
    iconSize?: IconSize;
    /**
     * Defines the visual appearance of the status. These are the statuses `error`, `warning`, `information` and `marketing`. The default status is `error`.
     */
    state?: FormStatusState;
    /**
     * As of now, there is the `plain` and the `outlined` variant. Defaults to `plain`.
     */
    variant?: FormStatusVariant;
    /**
     * Defines the appearance size. There are these sizes `default`, `large`. The default status is `default`.
     */
    size?: FormStatusSize;
    attributes?: FormStatusAttributes;
    textId?: string;
    widthSelector?: string;
    widthElement?: {
        current: HTMLElement | null;
    } | null;
    /**
     * NB: Animation is disabled as of now. ~~use `true` to omit the animation on content visibility. Defaults to `false`.~~
     */
    noAnimation?: boolean;
    /**
     * If set to `true`, an overlaying skeleton with animation will be shown.
     */
    skeleton?: SkeletonShow;
    /**
     * If set to `true`, then the FormStatus will be 100% in available `width`. **NB:** Only use this on independent status messages.
     */
    stretch?: boolean;
    /**
     * The `role` attribute for accessibility, defaults to `alert`.
     */
    role?: string;
    /**
     * Use it to set an inner margin. It supports the same properties as [Space](/uilib/layout/space/properties). Useful for animation.
     */
    shellSpace?: SpaceTypeAll;
    className?: string;
    /**
     * The `text` appears as the status message. Beside plain text, you can send in a React component as well.
     */
    children?: FormStatusChildren;
} & Omit<React.HTMLProps<HTMLElement>, 'ref' | 'label' | 'value' | 'onFocus' | 'onBlur' | 'children' | 'size'> & SpacingProps;
export type ErrorIconProps = React.SVGProps<SVGSVGElement> & {
    /**
     * The `title` attribute in the status.
     */
    title?: string;
    state?: FormStatusState;
};
export type WarnIconProps = React.SVGProps<SVGSVGElement> & {
    /**
     * The `title` attribute in the status.
     */
    title?: string;
    state?: FormStatusState;
};
export type InfoIconProps = React.SVGProps<SVGSVGElement> & {
    /**
     * The `title` attribute in the status.
     */
    title?: string;
    state?: FormStatusState;
};
export type MarketingIconProps = React.SVGProps<SVGSVGElement> & {
    /**
     * The `title` attribute in the status.
     */
    title?: string;
    state?: FormStatusState;
};
export type FormStatusIcon = typeof ErrorIcon | typeof WarnIcon | typeof InfoIcon | typeof MarketingIcon;
declare const FormStatus: React.MemoExoticComponent<(props: FormStatusProps & {
    ref?: React.Ref<HTMLElement>;
}) => React.ReactNode>;
export default FormStatus;
export declare const ErrorIcon: (props: ErrorIconProps) => import("react/jsx-runtime").JSX.Element;
export declare const WarnIcon: (props: WarnIconProps) => import("react/jsx-runtime").JSX.Element;
export declare const InfoIcon: (props: InfoIconProps) => import("react/jsx-runtime").JSX.Element;
export declare const MarketingIcon: (props: MarketingIconProps) => import("react/jsx-runtime").JSX.Element;
export declare function setMaxWidthToElement({ element, id, widthElement, widthSelector, }: {
    element: HTMLElement;
    id?: string | null;
    widthElement?: HTMLElement | null;
    widthSelector?: string | null;
}): void;