@lumx/react 3.0.2 → 3.0.3

package/index.d.ts

@@ -0,0 +1,2686 @@
+import React, { ReactNode, SyntheticEvent, ReactElement, MouseEventHandler, KeyboardEventHandler, AriaAttributes, DetailedHTMLProps, ButtonHTMLAttributes, InputHTMLAttributes, Ref, RefObject, ImgHTMLAttributes, CSSProperties, SetStateAction, Key } from 'react';
+import { K as Kind, C as Comp, G as GenericProps, H as HasTheme, a as HorizontalAlignment, S as Size, b as Color, E as Emphasis, V as ValueOf, c as Callback, d as ColorPalette, A as Alignment, e as VerticalAlignment, O as Orientation, f as ColorVariant, T as Typography, g as TextElement, h as HeadingElement, i as AspectRatio, F as Falsy, j as FocusPoint, k as ThumbnailSize, l as ThumbnailVariant, m as GlobalSize, n as TypographyInterface } from './_internal/types.js';
+export { A as Alignment, i as AspectRatio, b as Color, d as ColorPalette, f as ColorVariant, E as Emphasis, j as FocusPoint, m as GlobalSize, a as HorizontalAlignment, K as Kind, O as Orientation, S as Size, o as Theme, r as ThumbnailAspectRatio, k as ThumbnailSize, l as ThumbnailVariant, T as Typography, q as TypographyCustom, n as TypographyInterface, p as TypographyTitleCustom, e as VerticalAlignment } from './_internal/types.js';
+
+interface AlertDialogProps extends Omit<DialogProps, 'header' | 'footer'> {
+    /** Message variant. */
+    kind?: Kind;
+    /** Dialog title. */
+    title?: string;
+    /** Props forwarded to the confirm button */
+    confirmProps: ButtonProps & {
+        onClick(): void;
+        label: string;
+    };
+    /**
+     * Props forwarded to the cancel button.
+     * Will not render a cancel button if undefined.
+     */
+    cancelProps?: ButtonProps & {
+        onClick(): void;
+        label: string;
+    };
+}
+/**
+ * AlertDialog component.
+ *
+ * An alert dialog is a modal dialog that interrupts the user's workflow to
+ * communicate an important message and acquire a response.
+ *
+ * It should not have a complex content.
+ * Children of this component should only be strings, paragraphs or links.
+ */
+declare const AlertDialog: Comp<AlertDialogProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface AutocompleteProps extends GenericProps, HasTheme {
+    /**
+     * Whether the suggestions list should display anchored to the input or to the wrapper.
+     * @see {@link DropdownProps#anchorToInput}
+     */
+    anchorToInput?: boolean;
+    /**
+     * Props to pass to the clear button (minus those already set by the TextField props).
+     * If not specified, the button won't be displayed.
+     * @see {@link TextFieldProps#clearButtonProps}
+     */
+    clearButtonProps?: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;
+    /**
+     * Reference to the <input> or <textarea> element.
+     * @see {@link TextFieldProps#inputRef}
+     */
+    inputRef?: TextFieldProps['inputRef'];
+    /**
+     * The offset that will be applied to the Dropdown position.
+     * @see {@link DropdownProps#offset}
+     */
+    offset?: Offset;
+    /**
+     * The preferred Dropdown location against the anchor element.
+     * @see {@link DropdownProps#placement}
+     */
+    placement?: Placement;
+    /**
+     * Whether the dropdown should fit to the anchor width or not.
+     * @see {@link DropdownProps#fitToAnchorWidth}
+     */
+    fitToAnchorWidth?: boolean;
+    /**
+     * The error related to the component.
+     * @see {@link TextFieldProps#error}
+     */
+    error?: string | ReactNode;
+    /**
+     * Whether the text field is displayed with error style or not.
+     * @see {@link TextFieldProps#hasError}
+     */
+    hasError?: boolean;
+    /**
+     * Whether the text box should be focused upon closing the suggestions or not.
+     */
+    shouldFocusOnClose?: boolean;
+    /**
+     * The helper message of the text field.
+     * @see {@link TextFieldProps#helper}
+     */
+    helper?: string;
+    /**
+     * The icon of the text field (SVG path).
+     * @see {@link TextFieldProps#icon}
+     */
+    icon?: string;
+    /**
+     * Whether the component is disabled or not.
+     * @see {@link TextFieldProps#isDisabled}
+     */
+    isDisabled?: boolean;
+    /**
+     * Whether the component is required or not.
+     * @see {@link TextFieldProps#isRequired}
+     */
+    isRequired?: boolean;
+    /**
+     * Whether the text field is displayed with valid style or not.
+     * @see {@link TextFieldProps#isValid}
+     */
+    isValid?: boolean;
+    /**
+     * The label of the text field displayed in a label tag.
+     * @see {@link TextFieldProps#label}
+     */
+    label?: string;
+    /**
+     * The placeholder message of the text field.
+     * @see {@link TextFieldProps#placeholder}
+     */
+    placeholder?: string;
+    /** List of suggestions to display during autocomplete. */
+    children: React.ReactNode;
+    /**
+     * The list of chips to be displayed before the text field input.
+     */
+    chips?: React.ReactNode;
+    /**
+     * The value of the text field.
+     * @see {@link TextFieldProps#value}
+     */
+    value: string;
+    /**
+     * Whether the suggestions from the autocomplete should be displayed or not.
+     * @see {@link DropdownProps#isOpen}
+     */
+    isOpen: boolean;
+    /**
+     * The native input name property.
+     * @see {@link TextFieldProps#name}
+     */
+    name?: string;
+    /**
+     * Whether a click in the Autocomplete dropdown would close it or not.
+     * @see {@link DropdownProps#closeOnClick}
+     */
+    closeOnClick?: boolean;
+    /**
+     * Whether a click anywhere out of the Autocomplete would close it or not.
+     * @see {@link DropdownProps#closeOnClickAway}
+     */
+    closeOnClickAway?: boolean;
+    /**
+     * Whether an escape key press would close the Autocomplete or not.
+     * @see {@link DropdownProps#closeOnEscape}
+     */
+    closeOnEscape?: boolean;
+    /**
+     * The function called on blur.
+     * @see {@link TextFieldProps#onBlur}
+     */
+    onBlur?(event: React.FocusEvent): void;
+    /**
+     * On change callback.
+     * @see {@link TextFieldProps#onChange}
+     */
+    onChange(value: string, name?: string, event?: SyntheticEvent): void;
+    /**
+     * The function called on close.
+     * @see {@link DropdownProps#onClose}
+     */
+    onClose?(): void;
+    /**
+     * The function called on focus.
+     * @see {@link TextFieldProps#onFocus}
+     */
+    onFocus?(event: React.FocusEvent): void;
+    /**
+     * The function called when the bottom of the dropdown is reached.
+     * @see {@link DropdownProps#onInfiniteScroll}
+     */
+    onInfiniteScroll?(): void;
+}
+/**
+ * Autocomplete component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Autocomplete: Comp<AutocompleteProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface AutocompleteMultipleProps extends AutocompleteProps {
+    /** Selected values. */
+    values: any[];
+    /** Alignment of the chips in the autocomplete. */
+    chipsAlignment?: HorizontalAlignment;
+    /** Selected value render function. Default: Renders the value inside of a Chip. */
+    selectedChipRender(choice: any, index: number, onClear?: (event: React.MouseEvent, choice: any) => void, isDisabled?: boolean): ReactNode | string;
+}
+/**
+ * AutocompleteMultiple component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const AutocompleteMultiple: Comp<AutocompleteMultipleProps, HTMLDivElement>;
+
+/**
+ * Avatar sizes.
+ */
+declare type AvatarSize = Extract<Size, 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'>;
+/**
+ * Defines the props of the component.
+ */
+interface AvatarProps extends GenericProps, HasTheme {
+    /** Action toolbar content. */
+    actions?: ReactNode;
+    /** Image alternative text. */
+    alt: string;
+    /** Badge. */
+    badge?: ReactElement;
+    /** Image URL. */
+    image: string;
+    /** Props to pass to the link wrapping the thumbnail. */
+    linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;
+    /** Custom react component for the link (can be used to inject react router Link). */
+    linkAs?: 'a' | any;
+    /** On click callback. */
+    onClick?: MouseEventHandler<HTMLDivElement>;
+    /** On key press callback. */
+    onKeyPress?: KeyboardEventHandler<HTMLDivElement>;
+    /** Size variant. */
+    size?: AvatarSize;
+    /** Props to pass to the thumbnail (minus those already set by the Avatar props). */
+    thumbnailProps?: Omit<ThumbnailProps, 'image' | 'alt' | 'size' | 'theme' | 'align' | 'fillHeight' | 'variant' | 'aspectRatio'>;
+}
+/**
+ * Avatar component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Avatar: Comp<AvatarProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface BadgeProps extends GenericProps {
+    /** Badge content. */
+    children?: ReactNode;
+    /** Color variant. */
+    color?: Color;
+}
+/**
+ * Badge component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Badge: Comp<BadgeProps, HTMLDivElement>;
+
+declare type HTMLButtonProps = DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
+/**
+ * Button size definition.
+ */
+declare type ButtonSize = Extract<Size, 's' | 'm'>;
+interface BaseButtonProps extends GenericProps, Pick<AriaAttributes, 'aria-expanded' | 'aria-haspopup' | 'aria-pressed' | 'aria-label'>, HasTheme {
+    /** Color variant. */
+    color?: Color;
+    /** Emphasis variant. */
+    emphasis?: Emphasis;
+    /** Whether or not the button has a background color in low emphasis. */
+    hasBackground?: boolean;
+    /** Native anchor href property. It determines whether the Button will be a <button> or an <a>. */
+    href?: string;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Whether the component is selected or not. */
+    isSelected?: boolean;
+    /** Native button name property. */
+    name?: string;
+    /** Size variant. */
+    size?: ButtonSize;
+    /** Native anchor target property. */
+    target?: '_self' | '_blank' | '_parent' | '_top';
+    /** Native button type. */
+    type?: HTMLButtonProps['type'];
+    /** Custom react component for the link (can be used to inject react router Link). */
+    linkAs?: 'a' | any;
+}
+
+/**
+ * Button emphasis definition.
+ * @deprecated Use Emphasis instead.
+ */
+declare const ButtonEmphasis: {
+    readonly low: "low";
+    readonly medium: "medium";
+    readonly high: "high";
+};
+/**
+ * Defines the props of the component.
+ */
+interface ButtonProps extends BaseButtonProps {
+    /** Button content. */
+    children?: ReactNode;
+    /** Left icon (SVG path). */
+    leftIcon?: string;
+    /** Right icon (SVG path). */
+    rightIcon?: string;
+    /** When `true`, the button gets as large as possible. */
+    fullWidth?: boolean;
+}
+/**
+ * Button component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Button: Comp<ButtonProps, HTMLButtonElement | HTMLAnchorElement>;
+
+interface IconButtonProps extends BaseButtonProps {
+    /**
+     * Icon (SVG path).
+     * If `image` is also set, `image` will be used instead.
+     */
+    icon?: string;
+    /**
+     * Image (image url).
+     * Has priority over `icon`.
+     */
+    image?: string;
+    /**
+     * Label text (required for a11y purpose).
+     * If you really don't want an aria-label, you can set an empty label (this is not recommended).
+     */
+    label: string;
+    /**
+     * Props to pass to the tooltip.
+     * If undefined or if tooltipProps.label is undefined, the label prop will be used as tooltip label.
+     * */
+    tooltipProps?: Partial<TooltipProps>;
+    /** Whether the tooltip should be hidden or not. */
+    hideTooltip?: boolean;
+}
+/**
+ * IconButton component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const IconButton: Comp<IconButtonProps, HTMLButtonElement>;
+
+/**
+ * Defines the props of the component
+ */
+declare type ButtonGroupProps = GenericProps;
+/**
+ * ButtonGroup component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ButtonGroup: Comp<ButtonGroupProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface CheckboxProps extends GenericProps, HasTheme {
+    /** Helper text. */
+    helper?: string;
+    /** Native input id property. */
+    id?: string;
+    /** Native input ref. */
+    inputRef?: React.Ref<HTMLInputElement>;
+    /** Whether it is checked or not. */
+    isChecked?: boolean;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Label text. */
+    label?: ReactNode;
+    /** Native input name property. */
+    name?: string;
+    /** Native input value property. */
+    value?: string;
+    /** On change callback. */
+    onChange?(isChecked: boolean, value?: string, name?: string, event?: SyntheticEvent): void;
+    /** optional props for input */
+    inputProps?: InputHTMLAttributes<HTMLInputElement>;
+}
+/**
+ * Checkbox component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Checkbox: Comp<CheckboxProps, HTMLDivElement>;
+
+/**
+ * Chip sizes.
+ */
+declare type ChipSize = Extract<Size, 's' | 'm'>;
+/**
+ * Defines the props of the component.
+ */
+interface ChipProps extends GenericProps, HasTheme {
+    /** A component to be rendered after the content. */
+    after?: ReactNode;
+    /** A component to be rendered before the content. */
+    before?: ReactNode;
+    /** Color variant. */
+    color?: Color;
+    /** Whether the component is clickable or not. */
+    isClickable?: boolean;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Whether the chip is currently in a highlighted state or not. */
+    isHighlighted?: boolean;
+    /** Whether the component is selected or not. */
+    isSelected?: boolean;
+    /** Size variant. */
+    size?: ChipSize;
+    /** On "after" element clicked callback. */
+    onAfterClick?: MouseEventHandler;
+    /** On "before" element clicked callback. */
+    onBeforeClick?: MouseEventHandler;
+}
+/**
+ * Chip component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Chip: Comp<ChipProps, HTMLAnchorElement>;
+
+interface UseChipGroupNavigation {
+    /** the current active chip index */
+    activeChip: number;
+    /** callback to be executed when the backspace was pressed */
+    onBackspacePressed(): void;
+    /** function that allows to reset the navigation */
+    resetChipNavigation(): void;
+}
+declare type useChipGroupNavigationType<C = any> = (chips: C[], onChipDeleted: (chip: C) => void, initialActiveChip?: number) => UseChipGroupNavigation;
+
+/**
+ * Defines the props of the component.
+ */
+interface ChipGroupProps extends GenericProps {
+    /** Chip horizontal alignment. */
+    align?: HorizontalAlignment;
+    /** List of Chip. */
+    children: ReactNode;
+}
+declare const ChipGroup: Comp<ChipGroupProps, HTMLDivElement> & {
+    useChipGroupNavigation: useChipGroupNavigationType<any>;
+};
+
+/**
+ * Comment block variants.
+ */
+declare const CommentBlockVariant: {
+    readonly indented: "indented";
+    readonly linear: "linear";
+};
+declare type CommentBlockVariant = ValueOf<typeof CommentBlockVariant>;
+/**
+ * Defines the props of the component.
+ */
+interface CommentBlockProps extends GenericProps, HasTheme {
+    /** Action toolbar content. */
+    actions?: ReactNode;
+    /** Props to pass to the avatar. */
+    avatarProps: AvatarProps;
+    /** Comment block replies. */
+    children?: ReactNode;
+    /** Comment date with the minimal timestamp informations (xx minutes, x hours, yesterday, 6 days, Month Day, Month Day Year)*/
+    date: string;
+    /** Comment date with the full timestamp informations (day, month, year, time) */
+    fullDate?: string;
+    /** Whether the component has actions to display or not. */
+    hasActions?: boolean;
+    /** Action toolbar header content. */
+    headerActions?: ReactNode;
+    /** Whether the component is open or not. */
+    isOpen?: boolean;
+    /** Whether the comment is relevant or not. */
+    isRelevant?: boolean;
+    /** Comment author name. */
+    name: string;
+    /** On click callback. */
+    onClick?(): void;
+    /** On mouse enter callback. */
+    onMouseEnter?(): void;
+    /** On mouse leave callback. */
+    onMouseLeave?(): void;
+    /** Comment content. */
+    text: ReactNode | string;
+    /** Comment variant. */
+    variant?: CommentBlockVariant;
+}
+/**
+ * CommentBlock component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const CommentBlock: Comp<CommentBlockProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface DatePickerProps extends GenericProps {
+    /** Default month. */
+    defaultMonth?: Date;
+    /** Locale (language or region) to use. */
+    locale: string;
+    /** Date after which dates can't be selected. */
+    maxDate?: Date;
+    /** Date before which dates can't be selected. */
+    minDate?: Date;
+    /** Props to pass to the next month button (minus those already set by the DatePickerControlled props). */
+    nextButtonProps: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;
+    /** Props to pass to the previous month button (minus those already set by the DatePickerControlled props). */
+    previousButtonProps: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;
+    /** Reference to the <button> element corresponding to the current date or the selected date. */
+    todayOrSelectedDateRef?: Ref<HTMLButtonElement>;
+    /** Currently selected date. */
+    value: Date | undefined;
+    /** On change callback. */
+    onChange(value: Date | undefined): void;
+}
+
+/**
+ * DatePicker component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const DatePicker: Comp<DatePickerProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface DatePickerControlledProps extends DatePickerProps {
+    /** Selected month to display. */
+    selectedMonth: Date;
+    /** On previous month change callback. */
+    onPrevMonthChange(): void;
+    /** On next month change callback. */
+    onNextMonthChange(): void;
+}
+/**
+ * DatePickerControlled component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const DatePickerControlled: Comp<DatePickerControlledProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface DatePickerFieldProps extends GenericProps {
+    /** Default month. */
+    defaultMonth?: Date;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Locale (language or region) to use. */
+    locale: string;
+    /** Date after which dates can't be selected. */
+    maxDate?: Date;
+    /** Date before which dates can't be selected. */
+    minDate?: Date;
+    /** Native input name property. */
+    name?: string;
+    /** Props to pass to the next month button (minus those already set by the DatePickerControlled props). */
+    nextButtonProps: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;
+    /** Props to pass to the previous month button (minus those already set by the DatePickerControlled props). */
+    previousButtonProps: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;
+    /** Currently selected date. */
+    value: Date | undefined;
+    /** On change callback. */
+    onChange(value: Date | undefined, name?: string, event?: SyntheticEvent): void;
+}
+/**
+ * DatePickerField component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const DatePickerField: Comp<DatePickerFieldProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface DialogProps extends GenericProps {
+    /** Footer content. */
+    footer?: ReactNode;
+    /** Whether the divider between the dialog content and the footer is always displayed (instead of showing it on scroll). */
+    forceFooterDivider?: boolean;
+    /** Header content. */
+    header?: ReactNode;
+    /** Whether the divider between the dialog content and the footer is always displayed (instead of showing it on scroll). */
+    forceHeaderDivider?: boolean;
+    /** Whether the indefinite progress indicator over the dialog content is displayed or not. */
+    isLoading?: boolean;
+    /** Whether the component is open or not. */
+    isOpen?: boolean;
+    /** Reference to the parent element that triggered modal opening (will get back focus on close). */
+    parentElement?: RefObject<HTMLElement>;
+    /** Reference to the dialog content element. */
+    contentRef?: Ref<HTMLDivElement>;
+    /** Reference to the of the element that should get the focus when the dialogs opens. By default, the first child will take focus. */
+    focusElement?: RefObject<HTMLElement>;
+    /** Whether to keep the dialog open on clickaway or escape press. */
+    preventAutoClose?: boolean;
+    /** Size variant. */
+    size?: DialogSizes;
+    /** Z-axis position. */
+    zIndex?: number;
+    /** Z-axis position. */
+    dialogProps?: GenericProps;
+    /** On close callback. */
+    onClose?(): void;
+    /** Callback called when the open animation starts and the close animation finishes. */
+    onVisibilityChange?(isVisible: boolean): void;
+}
+declare type DialogSizes = Extract<Size, 'tiny' | 'regular' | 'big' | 'huge'>;
+/**
+ * Dialog component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Dialog: Comp<DialogProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface DividerProps extends GenericProps, HasTheme {
+}
+/**
+ * Divider component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Divider: Comp<DividerProps, HTMLHRElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface DragHandleProps extends GenericProps, HasTheme {
+}
+/**
+ * DragHandle component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const DragHandle: Comp<DragHandleProps, HTMLDivElement>;
+
+/**
+ * Different possible placements for the popover.
+ */
+declare const Placement: {
+    readonly AUTO: "auto";
+    readonly AUTO_END: "auto-end";
+    readonly AUTO_START: "auto-start";
+    readonly TOP: "top";
+    readonly TOP_END: "top-end";
+    readonly TOP_START: "top-start";
+    readonly RIGHT: "right";
+    readonly RIGHT_END: "right-end";
+    readonly RIGHT_START: "right-start";
+    readonly BOTTOM: "bottom";
+    readonly BOTTOM_END: "bottom-end";
+    readonly BOTTOM_START: "bottom-start";
+    readonly LEFT: "left";
+    readonly LEFT_END: "left-end";
+    readonly LEFT_START: "left-start";
+};
+declare type Placement = ValueOf<typeof Placement>;
+/**
+ * Offset of the popover.
+ */
+interface Offset {
+    /** Offset size along the reference. */
+    along?: number;
+    /** Offset size away from the reference. */
+    away?: number;
+}
+/**
+ * Popover elevation index.
+ */
+declare type Elevation = 1 | 2 | 3 | 4 | 5;
+/**
+ * Defines the props of the component.
+ */
+interface PopoverProps extends GenericProps {
+    /** Reference to the DOM element used to set the position of the popover. */
+    anchorRef: React.RefObject<HTMLElement>;
+    /** Element which will act as boundary when opening the popover. */
+    boundaryRef?: RefObject<HTMLElement>;
+    /** Content. */
+    children: ReactNode;
+    /** Whether a click anywhere out of the popover would close it. */
+    closeOnClickAway?: boolean;
+    /** Whether an escape key press would close the popover. */
+    closeOnEscape?: boolean;
+    /** Shadow elevation. */
+    elevation?: Elevation;
+    /** Whether the dropdown should fit to the anchor width (if dropdown is smaller). */
+    fitToAnchorWidth?: boolean;
+    /** Shrink popover if even after flipping there is not enough space. */
+    fitWithinViewportHeight?: boolean;
+    /** Element to focus when opening the popover. */
+    focusElement?: RefObject<HTMLElement>;
+    /** Whether the focus should go back on the anchor when popover closes and focus is within. */
+    focusAnchorOnClose?: boolean;
+    /** Whether we put an arrow or not. */
+    hasArrow?: boolean;
+    /** Whether the popover is open or not. */
+    isOpen: boolean;
+    /** Offset placement relative to anchor. */
+    offset?: Offset;
+    /** Reference to the parent element that triggered the popover (will get back focus on close or else fallback on the anchor element). */
+    parentElement?: RefObject<HTMLElement>;
+    /** Placement relative to anchor. */
+    placement?: Placement;
+    /** Whether the popover should be rendered into a DOM node that exists outside the DOM hierarchy of the parent component. */
+    usePortal?: boolean;
+    /** Z-axis position. */
+    zIndex?: number;
+    /** On close callback (on click away or Escape pressed). */
+    onClose?(): void;
+}
+/**
+ * Popover component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Popover: Comp<PopoverProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface DropdownProps extends GenericProps {
+    /**
+     * Reference to the element around which the dropdown is placed.
+     * @see {@link PopoverProps#anchorRef}
+     */
+    anchorRef: PopoverProps['anchorRef'];
+    /** Dropdown content. */
+    children: React.ReactNode;
+    /**
+     * Whether a click anywhere out of the Dropdown would close it or not.
+     * @see {@link PopoverProps#closeOnClickAway}
+     */
+    closeOnClickAway?: boolean;
+    /**
+     * Whether to close the Dropdown when clicking in it or not.
+     */
+    closeOnClick?: boolean;
+    /**
+     * Whether an escape key press would close the Dropdown or not.
+     * @see {@link PopoverProps#closeOnEscape}
+     */
+    closeOnEscape?: boolean;
+    /**
+     * Whether the dropdown should fit to the anchor width (if dropdown is smaller) or not.
+     * @see {@link PopoverProps#fitToAnchorWidth}
+     */
+    fitToAnchorWidth?: boolean;
+    /**
+     * Whether the dropdown should shrink to fit within the viewport height or not.
+     * @see {@link PopoverProps#fitWithinViewportHeight}
+     */
+    fitWithinViewportHeight?: boolean;
+    /**
+     * Whether the dropdown should be displayed or not. Useful to control the Dropdown from outside the component.
+     * @see {@link PopoverProps#isOpen}
+     */
+    isOpen: boolean;
+    /**
+     * Offset applied to the Dropdown position.
+     * @see {@link PopoverProps#offset}
+     */
+    offset?: Offset;
+    /**
+     * Preferred Dropdown placement against the anchor element.
+     * @see {@link PopoverProps#placement}
+     */
+    placement?: Placement;
+    /** Whether the focus should be set on the list when the dropdown is open or not. */
+    shouldFocusOnOpen?: boolean;
+    /** Whether the focus should go back on the anchor when dropdown closes and focus is within. */
+    focusAnchorOnClose?: boolean;
+    /**
+     * Z-axis position.
+     * @see {@link PopoverProps#zIndex}
+     */
+    zIndex?: number;
+    /**
+     * On close callback.
+     * @see {@link PopoverProps#onClose}
+     */
+    onClose?(): void;
+    /** On scroll end callback. */
+    onInfiniteScroll?(): void;
+}
+/**
+ * Dropdown component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Dropdown: Comp<DropdownProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface ExpansionPanelProps extends GenericProps, HasTheme {
+    /** Whether the expansion panel has a background. */
+    hasBackground?: boolean;
+    /** Whether the header has a divider. */
+    hasHeaderDivider?: boolean;
+    /** Whether the component is open or not. */
+    isOpen?: boolean;
+    /** Label text (overwritten if a `<header>` is provided in the children). */
+    label?: string;
+    /** On open callback. */
+    onOpen?: Callback;
+    /** On close callback. */
+    onClose?: Callback;
+    /** Props to pass to the toggle button (minus those already set by the ExpansionPanel props). */
+    toggleButtonProps: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;
+    /** On toggle open or close callback. */
+    onToggleOpen?(shouldOpen: boolean): void;
+}
+/**
+ * ExpansionPanel component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ExpansionPanel: Comp<ExpansionPanelProps, HTMLDivElement>;
+
+interface FlagProps extends GenericProps, HasTheme {
+    /** Color of the component. */
+    color?: ColorPalette;
+    /** Icon to use before the label. */
+    icon?: string;
+    /** Text label of the flag. */
+    label: string;
+}
+/**
+ * Flag component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Flag: Comp<FlagProps, HTMLDivElement>;
+
+declare type MarginAutoAlignment = Extract<Alignment, 'top' | 'bottom' | 'right' | 'left'>;
+declare type GapSize = Extract<Size, 'tiny' | 'regular' | 'medium' | 'big' | 'huge'>;
+declare type SpaceAlignment = Extract<Alignment, 'space-between' | 'space-evenly' | 'space-around'>;
+declare type FlexVerticalAlignment = VerticalAlignment | SpaceAlignment;
+declare type FlexHorizontalAlignment = HorizontalAlignment | SpaceAlignment;
+/**
+ * Defines the props of the component.
+ */
+interface FlexBoxProps extends GenericProps {
+    /** Customize the root element. */
+    as?: React.ElementType;
+    /** Children elements. */
+    children?: ReactNode;
+    /** Whether the "content filling space" is enabled or not. */
+    fillSpace?: boolean;
+    /** Gap space between flexbox items. */
+    gap?: GapSize;
+    /** Flex horizontal alignment. */
+    hAlign?: FlexVerticalAlignment;
+    /** Whether the "auto margin" is enabled all around or not. */
+    marginAuto?: MarginAutoAlignment | MarginAutoAlignment[];
+    /** Whether the "content shrink" is disabled or not. */
+    noShrink?: boolean;
+    /** Flex direction. */
+    orientation?: Orientation;
+    /** Flex vertical alignment. */
+    vAlign?: FlexHorizontalAlignment;
+    /** Whether the "flex wrap" is enabled or not. */
+    wrap?: boolean;
+}
+/**
+ * FlexBox component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const FlexBox: Comp<FlexBoxProps, HTMLDivElement>;
+
+/**
+ * Accepted gap sizes for the generic block.
+ */
+declare const GenericBlockGapSize: Pick<{
+    readonly xxs: "xxs";
+    readonly xs: "xs";
+    readonly s: "s";
+    readonly m: "m";
+    readonly l: "l";
+    readonly xl: "xl";
+    readonly xxl: "xxl";
+    readonly tiny: "tiny";
+    readonly regular: "regular";
+    readonly medium: "medium";
+    readonly big: "big";
+    readonly huge: "huge";
+}, "tiny" | "regular" | "medium" | "big" | "huge">;
+declare type GenericBlockGapSize = ValueOf<typeof GenericBlockGapSize>;
+
+interface GenericBlockProps extends FlexBoxProps {
+    /**
+     * Component to use as visual element.
+     */
+    figure?: ReactNode;
+    /**
+     * Actions to set after the main content.
+     */
+    actions?: ReactNode;
+    /**
+     * Main content to display or sections components
+     * ({@see GenericBlock.Figure}, {@see GenericBlock.Content} & {@see GenericBlock.Actions})
+     */
+    children: ReactNode;
+    /**
+     * Orientation of the 3 sections
+     */
+    orientation?: FlexBoxProps['orientation'];
+    /**
+     * Horizontal alignment.
+     */
+    hAlign?: FlexBoxProps['hAlign'];
+    /**
+     * Vertical alignment.
+     */
+    vAlign?: FlexBoxProps['vAlign'];
+    /**
+     * The props to forward to the content.
+     * By default, the content will have the same alignment as wrapper.
+     */
+    contentProps?: Omit<FlexBoxProps, 'children'>;
+    /**
+     * props to forward to the actions element.
+     */
+    actionsProps?: Omit<FlexBoxProps, 'children'>;
+    /**
+     * props to forward to the figure element.
+     */
+    figureProps?: Omit<FlexBoxProps, 'children'>;
+    /**
+     * Gap space between sections.
+     */
+    gap?: GenericBlockGapSize;
+}
+interface GenericBlockSectionProps extends FlexBoxProps {
+    /**
+     * Gap space between items.
+     */
+    gap?: GenericBlockGapSize;
+}
+declare type BaseGenericBlock = Comp<GenericBlockProps, HTMLDivElement>;
+/**
+ * The GenericBlock is a layout component made of 3 sections that can be
+ * displayed either horizontally of vertically with the same gap between each section.
+ *
+ * The sections are:
+ * - `Figure` => A visual element to display before the main content.
+ * - `Content` => The main content displayed
+ * - `Actions` => One or more actions to set after the element.
+ *
+ * @see https://www.figma.com/file/lzzrQmsfaXRaOyRfoEogPZ/DS%3A-playground?node-id=1%3A4076
+ */
+declare const BaseGenericBlock: BaseGenericBlock;
+interface GenericBlock extends BaseGenericBlock {
+    /**
+     * Use `GenericBlock.Figure` component as children of the `GenericBlock` component as an alternative way to inject
+     * the "figure" section of the block (instead of using `figure` and `figureProps` props).
+     */
+    Figure: Comp<GenericBlockSectionProps>;
+    /**
+     * Use `GenericBlock.Content` component as children of the `GenericBlock` component as an alternative way to inject
+     * the "content" section of the block (instead of using `content` and `contentProps` props).
+     */
+    Content: Comp<GenericBlockSectionProps>;
+    /**
+     * Use `GenericBlock.Actions` component as children of the `GenericBlock` component as an alternative way to inject
+     * the "actions" section of the block (instead of using `actions` and `actionsProps` props).
+     */
+    Actions: Comp<GenericBlockSectionProps>;
+}
+declare const GenericBlock: GenericBlock;
+
+/**
+ * Defines the props of the component.
+ */
+interface TextProps extends GenericProps {
+    /**
+     * Color variant.
+     */
+    color?: ColorPalette;
+    /**
+     * Lightened or darkened variant of the selected color.
+     */
+    colorVariant?: ColorVariant;
+    /**
+     * Typography variant.
+     */
+    typography?: Typography;
+    /**
+     * Custom component to render the text.
+     */
+    as: TextElement;
+    /**
+     * Control whether the text should truncate or not.
+     * Setting as `true` will make the text truncate on a single line.
+     * Setting as `{ lines: number }` will make the text truncate on a multiple lines.
+     */
+    truncate?: boolean | {
+        lines: number;
+    };
+    /**
+     * Prevents text to wrap on multiple lines
+     * (automatically activated when single line text truncate is activated).
+     */
+    noWrap?: boolean;
+}
+/**
+ * Text component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Text: Comp<TextProps>;
+
+/**
+ * Defines the props of the component.
+ */
+interface HeadingProps extends Partial<TextProps> {
+    /**
+     * Display a specific heading level instead of the one provided by parent context provider.
+     */
+    as?: HeadingElement;
+}
+/**
+ * Renders a heading component.
+ * Extends the `Text` Component with the heading level automatically computed based on
+ * the current level provided by the context.
+ */
+declare const Heading: Comp<HeadingProps>;
+
+interface HeadingLevelProviderProps {
+    /** The heading level to start at. If left undefined, the parent context will be used, if any. */
+    level?: number;
+    /** The children to display */
+    children: ReactNode;
+}
+/**
+ * Provide a new heading level context.
+ */
+declare const HeadingLevelProvider: React.FC<HeadingLevelProviderProps>;
+
+declare const useHeadingLevel: () => {
+    level: number;
+    headingElement: HeadingElement;
+};
+
+declare type GridGutterSize = Extract<Size, 'regular' | 'big' | 'huge'>;
+/**
+ * Defines the props of the component.
+ */
+interface GridProps extends GenericProps {
+    /** Orientation. */
+    orientation?: Orientation;
+    /** Whether the children are wrapped or not. */
+    wrap?: string;
+    /** Vertical alignment. */
+    vAlign?: Alignment;
+    /** Horizontal alignment. */
+    hAlign?: Alignment;
+    /** Gutter size. */
+    gutter?: GridGutterSize;
+}
+/**
+ * Grid component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Grid: Comp<GridProps, HTMLDivElement>;
+
+declare type Columns = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12';
+/**
+ * Defines the props of the component.
+ */
+interface GridItemProps extends GenericProps {
+    /** Alignment. */
+    align?: Alignment;
+    /** Order. */
+    order?: Columns;
+    /** Width. */
+    width?: Columns;
+}
+/**
+ * GridItem component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const GridItem: Comp<GridItemProps, HTMLDivElement>;
+
+declare type IconSizes = Extract<Size, 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'>;
+/**
+ * Defines the props of the component.
+ */
+interface IconProps extends GenericProps, HasTheme {
+    /** Color variant. */
+    color?: Color;
+    /** Lightened or darkened variant of the selected icon color. */
+    colorVariant?: ColorVariant;
+    /** Whether the icon has a shape. */
+    hasShape?: boolean;
+    /**
+     * Icon (SVG path) draw code (`d` property of the `<path>` SVG element).
+     * See https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths
+     */
+    icon: string;
+    /** Size variant. */
+    size?: IconSizes;
+    /** Sets an alternative text on the svg. Will set an `img` role to the svg. */
+    alt?: string;
+}
+/**
+ * Icon component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Icon: Comp<IconProps, HTMLElement>;
+
+declare type ImgHTMLProps = ImgHTMLAttributes<HTMLImageElement>;
+/**
+ * Defines the props of the component.
+ */
+interface ThumbnailProps extends GenericProps, HasTheme {
+    /** Alignment of the thumbnail in it's parent (requires flex parent). */
+    align?: HorizontalAlignment;
+    /** Image alternative text. */
+    alt: string;
+    /** Image aspect ratio. */
+    aspectRatio?: AspectRatio;
+    /** Badge. */
+    badge?: ReactElement | Falsy;
+    /** Image cross origin resource policy. */
+    crossOrigin?: ImgHTMLProps['crossOrigin'];
+    /** Fallback icon (SVG path) or react node when image fails to load. */
+    fallback?: string | ReactNode;
+    /** Whether the thumbnail should fill it's parent size (requires flex parent) or not. */
+    fillHeight?: boolean;
+    /** Apply relative vertical and horizontal shift (from -1 to 1) on the image position inside the thumbnail. */
+    focusPoint?: FocusPoint;
+    /** Image URL. */
+    image: string;
+    /** Props to inject into the native <img> element. */
+    imgProps?: ImgHTMLProps;
+    /** Reference to the native <img> element. */
+    imgRef?: Ref<HTMLImageElement>;
+    /** Set to true to force the display of the loading skeleton. */
+    isLoading?: boolean;
+    /** Size variant of the component. */
+    size?: ThumbnailSize;
+    /** Image loading mode. */
+    loading?: ImgHTMLProps['loading'];
+    /** On click callback. */
+    onClick?: MouseEventHandler<HTMLDivElement>;
+    /** On key press callback. */
+    onKeyPress?: KeyboardEventHandler<HTMLDivElement>;
+    /** Variant of the component. */
+    variant?: ThumbnailVariant;
+    /** Props to pass to the link wrapping the thumbnail. */
+    linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;
+    /** Custom react component for the link (can be used to inject react router Link). */
+    linkAs?: 'a' | any;
+}
+/**
+ * Thumbnail component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Thumbnail: Comp<ThumbnailProps>;
+
+/**
+ * Image block variants.
+ */
+declare const ImageBlockCaptionPosition: {
+    readonly below: "below";
+    readonly over: "over";
+};
+declare type ImageBlockCaptionPosition = ValueOf<typeof ImageBlockCaptionPosition>;
+/**
+ *  Image block sizes.
+ */
+declare type ImageBlockSize = Extract<Size, 'xl' | 'xxl'>;
+/**
+ * Defines the props of the component.
+ */
+interface ImageBlockProps extends GenericProps, HasTheme {
+    /** Action toolbar content. */
+    actions?: ReactNode;
+    /** Alignment. */
+    align?: HorizontalAlignment;
+    /** Image alternative text. */
+    alt: string;
+    /** Caption position. */
+    captionPosition?: ImageBlockCaptionPosition;
+    /** Caption custom CSS style. */
+    captionStyle?: CSSProperties;
+    /** Image description. Can be either a string, or sanitized html. */
+    description?: string | {
+        __html: string;
+    };
+    /** Whether the image has to fill its container height or not. */
+    fillHeight?: boolean;
+    /** Image URL. */
+    image: string;
+    /** Size variant. */
+    size?: ImageBlockSize;
+    /** Tag content. */
+    tags?: ReactNode;
+    /** Props to pass to the thumbnail (minus those already set by the ImageBlock props). */
+    thumbnailProps?: Omit<ThumbnailProps, 'image' | 'size' | 'theme' | 'align' | 'fillHeight'>;
+    /** Image title to display in the caption. */
+    title?: string;
+}
+/**
+ * ImageBlock component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ImageBlock: Comp<ImageBlockProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface InlineListProps extends GenericProps {
+    /**
+     * Text color.
+     */
+    color?: ColorPalette;
+    /**
+     * Lightened or darkened variant of the selected color.
+     */
+    colorVariant?: ColorVariant;
+    /**
+     * Typography variant.
+     */
+    typography?: Typography;
+}
+/**
+ * InlineList component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const InlineList: Comp<InlineListProps>;
+
+/**
+ * Defines the props of the component.
+ */
+interface InputHelperProps extends GenericProps, HasTheme {
+    /** Helper content. */
+    children: string | ReactNode;
+    /** Helper variant. */
+    kind?: Kind;
+}
+/**
+ * InputHelper component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const InputHelper: Comp<InputHelperProps, HTMLSpanElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface InputLabelProps extends GenericProps, HasTheme {
+    /** Label content. */
+    children: string | ReactNode;
+    /** Native htmlFor property. */
+    htmlFor: string;
+    /** Whether the component is required or not. */
+    isRequired?: boolean;
+}
+/**
+ * InputLabel component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const InputLabel: Comp<InputLabelProps, HTMLLabelElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface LightboxProps extends GenericProps, HasTheme {
+    /** Props to pass to the close button (minus those already set by the Lightbox props). */
+    closeButtonProps?: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;
+    /** Whether the component is open or not. */
+    isOpen?: boolean;
+    /** Reference to the element that triggered modal opening to set focus on. */
+    parentElement: RefObject<any>;
+    /** Whether to keep the dialog open on clickaway or escape press. */
+    preventAutoClose?: boolean;
+    /** Z-axis position. */
+    zIndex?: number;
+    /** On close callback. */
+    onClose?(): void;
+}
+/**
+ * Lightbox component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Lightbox: Comp<LightboxProps, HTMLDivElement>;
+
+declare type HTMLAnchorProps = React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;
+/**
+ * Defines the props of the component.
+ */
+interface LinkProps extends GenericProps {
+    /** Color variant. */
+    color?: Color;
+    /** Lightened or darkened variant of the selected icon color. */
+    colorVariant?: ColorVariant;
+    /** Link href. */
+    href?: HTMLAnchorProps['href'];
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Left icon (SVG path). */
+    leftIcon?: string;
+    /** Custom react component for the link (can be used to inject react router Link). */
+    linkAs?: 'a' | any;
+    /** Right icon (SVG path). */
+    rightIcon?: string;
+    /** Link target. */
+    target?: HTMLAnchorProps['target'];
+    /** Typography variant. */
+    typography?: Typography;
+}
+/**
+ * Link component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Link: Comp<LinkProps, HTMLAnchorElement | HTMLButtonElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface LinkPreviewProps extends GenericProps, HasTheme {
+    /** Description. */
+    description?: string;
+    /** Link URL. */
+    link: string;
+    /** Custom react component for the link (can be used to inject react router Link). */
+    linkAs?: 'a' | any;
+    /** Props to pass to the link (minus those already set by the LinkPreview props). */
+    linkProps?: Omit<LinkProps, 'color' | 'colorVariant' | 'href' | 'target'>;
+    /** Size variant. */
+    size?: Extract<Size, 'regular' | 'big'>;
+    /** Thumbnail for the link preview. */
+    thumbnailProps?: ThumbnailProps;
+    /** Title. */
+    title?: string;
+    /** Customize the title heading tag. */
+    titleHeading?: HeadingElement;
+}
+/**
+ * LinkPreview component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const LinkPreview: Comp<LinkPreviewProps, HTMLDivElement>;
+
+declare type Listener = (evt: KeyboardEvent) => void;
+interface UseKeyboardListNavigationType {
+    /** the current active index */
+    activeItemIndex: number;
+    /** callback to be used when a key is pressed. usually used with the native prop `onKeyDown` */
+    onKeyboardNavigation: Listener;
+    /** Resets the active index to the initial state */
+    resetActiveIndex(): void;
+    /** Sets the active index to a given value */
+    setActiveItemIndex(value: SetStateAction<number>): void;
+}
+declare type useKeyboardListNavigationType = <I>(items: I[], ref: RefObject<HTMLElement>, onListItemSelected: (itemSelected: I) => void, onListItemNavigated?: (itemSelected: I) => void, onEnterPressed?: (itemSelected: string) => void, onBackspacePressed?: Listener, keepFocusAfterSelection?: boolean, initialIndex?: number, preventTabOnEnteredValue?: boolean) => UseKeyboardListNavigationType;
+
+/**
+ * Defines the props of the component.
+ */
+interface ListProps extends GenericProps {
+    /** List content (should be ListItem, ListSubheader or ListDivider). */
+    children: ReactNode;
+    /**
+     * Whether the list items are clickable.
+     * @deprecated not needed anymore.
+     */
+    isClickable?: boolean;
+    /** Item padding size. */
+    itemPadding?: Extract<Size, 'big' | 'huge'>;
+    /** Tab index of the list. Default to -1 */
+    tabIndex?: number;
+    /**
+     * On list item selected callback.
+     *
+     * @param key   React key of the selected item.
+     * @param index Index of the selected item among the sibling items.
+     * @param evt   Source event (either mouse or keyboard event).
+     */
+    onListItemSelected?(key: Key, index: number, evt: SyntheticEvent): void;
+}
+declare const List: Comp<ListProps, HTMLUListElement> & {
+    useKeyboardListNavigation: useKeyboardListNavigationType;
+};
+
+declare type ListItemSize = Extract<Size, 'tiny' | 'regular' | 'big' | 'huge'>;
+/**
+ * Defines the props of the component.
+ */
+interface ListItemProps extends GenericProps {
+    /** A component to be rendered after the content. */
+    after?: ReactNode;
+    /** A component to be rendered before the content. */
+    before?: ReactNode;
+    /** Content. */
+    children: string | ReactNode;
+    /** Whether the list item should be highlighted or not. */
+    isHighlighted?: boolean;
+    /** Whether the component is selected or not. */
+    isSelected?: boolean;
+    /** Whether link/button is disabled or not. */
+    isDisabled?: boolean;
+    /** Reference to the <li> element. */
+    listItemRef?: Ref<HTMLLIElement>;
+    /** Custom react component for the link (can be used to inject react router Link). */
+    linkAs?: 'a' | any;
+    /** Props that will be passed on to the Link */
+    linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;
+    /** Reference to the link element. */
+    linkRef?: Ref<HTMLAnchorElement>;
+    /** Size variant. */
+    size?: ListItemSize;
+    /** On selected callback. */
+    onItemSelected?(evt: SyntheticEvent): void;
+}
+/**
+ * Check if the list item is clickable.
+ * @return `true` if the list item is clickable; `false` otherwise.
+ */
+declare function isClickable({ linkProps, onItemSelected }: Partial<ListItemProps>): boolean;
+/**
+ * ListItem component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ListItem: Comp<ListItemProps, HTMLLIElement>;
+
+/**
+ * Defines the props of the component.
+ */
+declare type ListDividerProps = GenericProps;
+/**
+ * ListDivider component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ListDivider: Comp<ListDividerProps, HTMLLIElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface ListSubheaderProps extends GenericProps {
+    /** Content. */
+    children: string | ReactNode;
+}
+/**
+ * ListSubheader component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ListSubheader: Comp<ListSubheaderProps, HTMLLIElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface MessageProps extends GenericProps {
+    /** Content. */
+    children?: ReactNode;
+    /** Whether the message has a background or not. */
+    hasBackground?: boolean;
+    /** Message variant. */
+    kind?: Kind;
+    /** Message custom icon SVG path. */
+    icon?: string;
+}
+/**
+ * Message component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Message: Comp<MessageProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface MosaicProps extends GenericProps, HasTheme {
+    /** Thumbnails. */
+    thumbnails: ThumbnailProps[];
+    /** On image click callback. */
+    onImageClick?(index: number): void;
+}
+/**
+ * Mosaic component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Mosaic: Comp<MosaicProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface NotificationProps extends GenericProps, HasTheme {
+    /** Action button label. */
+    actionLabel?: string;
+    /** Content. */
+    content?: React.ReactNode;
+    /** Whether the component is open or not. */
+    isOpen?: boolean;
+    /** Notification type. */
+    type?: Kind;
+    /** Z-axis position. */
+    zIndex?: number;
+    /** On action button click callback. */
+    onActionClick?(): void;
+    /** On click callback. */
+    onClick?(): void;
+}
+/**
+ * Notification component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Notification: Comp<NotificationProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface PostBlockProps extends GenericProps, HasTheme {
+    /** Action toolbar content. */
+    actions?: ReactNode;
+    /** Attachment content. */
+    attachments?: ReactNode;
+    /** Author content. */
+    author?: ReactNode;
+    /** Metadata content. */
+    meta?: ReactNode;
+    /** Orientation. */
+    orientation?: Orientation;
+    /** Tag content. */
+    tags?: ReactNode;
+    /** Content (string, or sanitized html). */
+    text?: string | {
+        __html: string;
+    };
+    /** Thumbnail. */
+    thumbnailProps?: ThumbnailProps;
+    /** Title. */
+    title: string;
+    /** On click callback. */
+    onClick?(): void;
+}
+/**
+ * PostBlock component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const PostBlock: Comp<PostBlockProps, HTMLDivElement>;
+
+/**
+ * Progress variants.
+ */
+declare const ProgressVariant: {
+    readonly linear: "linear";
+    readonly circular: "circular";
+};
+declare type ProgressVariant = ValueOf<typeof ProgressVariant>;
+/**
+ * Defines the props of the component.
+ */
+interface ProgressProps extends GenericProps, HasTheme {
+    /** Progress variant. */
+    variant?: ProgressVariant;
+}
+/**
+ * Progress component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Progress: Comp<ProgressProps, HTMLDivElement>;
+
+interface ProgressTrackerProviderProps {
+    /** Active step index. */
+    activeStepIndex?: number;
+    /** ProgressTrackerProvider children. */
+    children: ReactNode;
+    /** Step panel children should not render if the step panel is hidden. */
+    isLazy?: boolean;
+    /** Activate tabs on focus. */
+    shouldActivateOnFocus?: boolean;
+    /** Step change callback. */
+    onChange?(index: number): void;
+}
+/**
+ * This component provides a context in which steps can be defined and linked to their step panel.
+ *
+ * It does not produce any markup so you can wrap it around any React elements and then split the ProgressTracker and ProgressTrackerPanel
+ * components in the react tree.
+ *
+ * This works exactly as TabProvider so it uses TabProviderContext and tabs state.
+ *
+ * @param  props React component props.
+ * @return React element.
+ */
+declare const ProgressTrackerProvider: React.FC<ProgressTrackerProviderProps>;
+
+/**
+ * Defines the props of the component.
+ */
+interface ProgressTrackerProps extends GenericProps {
+    /** ARIA label (purpose of the set of steps). */
+    ['aria-label']: string;
+    /** Step list. */
+    children: ReactNode;
+}
+/**
+ * ProgressTracker component.
+ *
+ * Implements WAI-ARIA `tablist` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ProgressTracker: Comp<ProgressTrackerProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface ProgressTrackerStepProps extends GenericProps {
+    /** Children are not supported. */
+    children?: never;
+    /** Whether the step should be in error state or not. */
+    hasError?: boolean;
+    /** Helper text. */
+    helper?: string | null;
+    /** Native id property. */
+    id?: string;
+    /** Whether the current step is active or not. */
+    isActive?: boolean;
+    /** Whether the current step is completed or not. */
+    isComplete?: boolean;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Label text. */
+    label?: string | null;
+}
+/**
+ * ProgressTrackerStep component.
+ *
+ * Implements WAI-ARIA `tab` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ProgressTrackerStep: Comp<ProgressTrackerStepProps, HTMLButtonElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface ProgressTrackerStepPanelProps extends GenericProps {
+    /** Native id property. */
+    id?: string;
+    /** Whether the step is active or not. */
+    isActive?: boolean;
+}
+/**
+ * ProgressTrackerStepPanel component.
+ *
+ * Implements WAI-ARIA `tabpanel` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ProgressTrackerStepPanel: Comp<ProgressTrackerStepPanelProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface RadioButtonProps extends GenericProps, HasTheme {
+    /** Helper text. */
+    helper?: string;
+    /** Native input id property. */
+    id?: string;
+    /** Native input ref. */
+    inputRef?: React.Ref<HTMLInputElement>;
+    /** Whether it is checked or not. */
+    isChecked?: boolean;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Label content. */
+    label?: ReactNode;
+    /** Native input name property. */
+    name?: string;
+    /** Native input value property. */
+    value?: string;
+    /** On change callback. */
+    onChange?(value?: string, name?: string, event?: SyntheticEvent): void;
+}
+/**
+ * RadioButton component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const RadioButton: Comp<RadioButtonProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface RadioGroupProps extends GenericProps {
+    /** RadioButton elements */
+    children: ReactNode;
+}
+/**
+ * RadioGroup component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const RadioGroup: Comp<RadioGroupProps, HTMLDivElement>;
+
+/**
+ * Select variants.
+ */
+declare const SelectVariant: {
+    readonly input: "input";
+    readonly chip: "chip";
+};
+declare type SelectVariant = ValueOf<typeof SelectVariant>;
+interface CoreSelectProps extends GenericProps, HasTheme {
+    /** Props to pass to the clear button (minus those already set by the Select props). If not specified, the button won't be displayed. */
+    clearButtonProps?: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;
+    /** Whether the select (input variant) is displayed with error style or not. */
+    hasError?: boolean;
+    /** Error message. */
+    error?: string | ReactNode;
+    /** Helper text. */
+    helper?: string;
+    /** Whether the select should close on click. */
+    closeOnClick?: boolean;
+    /** Icon (SVG path). */
+    icon?: string;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Whether the component is required or not. */
+    isRequired?: boolean;
+    /** Whether the component is open or not. */
+    isOpen?: boolean;
+    /** Whether the select (input variant) is displayed with valid style or not. */
+    isValid?: boolean;
+    /** Label text. */
+    label?: string;
+    /** Placeholder input text. */
+    placeholder?: string;
+    /** Select variant. */
+    variant?: SelectVariant;
+    /** On clear callback. */
+    onClear?(event: SyntheticEvent, value?: string): void;
+    /** On blur callback. */
+    onBlur?(): void;
+    /** On filter text change callback (with 500ms debounce). */
+    onFilter?(): void;
+    /** On input click callback (can be used for dropdown toggle). */
+    onInputClick?(): void;
+    /** On dropdown close callback. */
+    onDropdownClose?(): void;
+    /** On scroll end callback. */
+    onInfiniteScroll?(): void;
+    /** Render value function. Default: Renders the value as a string. */
+    selectedValueRender?(choice: string): ReactNode | string;
+}
+
+/** Defines the props of the component. */
+interface SelectProps extends CoreSelectProps {
+    /** Selected value. */
+    value: string;
+}
+
+/**
+ * Select component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Select: Comp<SelectProps, HTMLDivElement>;
+
+/** Defines the props of the component. */
+interface SelectMultipleProps extends CoreSelectProps {
+    /** Selected values. */
+    value: string[];
+    /** Selected value render function. Default: Renders the value inside of a Chip. */
+    selectedChipRender?(choice: string, index: number, onClear?: (event: SyntheticEvent, choice: string) => void, isDisabled?: boolean, theme?: any): ReactNode | string;
+}
+declare const SelectMultipleField: React.FC<SelectMultipleProps>;
+/**
+ * SelectMultiple component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const SelectMultiple: Comp<SelectMultipleProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface SideNavigationProps extends GenericProps, HasTheme {
+    /** SideNavigationItem elements. */
+    children: ReactNode;
+}
+/**
+ * SideNavigation component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const SideNavigation: Comp<SideNavigationProps, HTMLUListElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface SideNavigationItemProps extends GenericProps {
+    /** SideNavigationItem elements. */
+    children?: ReactNode;
+    /** Emphasis variant. */
+    emphasis?: Emphasis;
+    /** Label content. */
+    label: string | ReactNode;
+    /** Icon (SVG path). */
+    icon?: string;
+    /** Whether the component is open or not. */
+    isOpen?: boolean;
+    /** Whether the component is selected or not. */
+    isSelected?: boolean;
+    /** Custom react component for the link (can be used to inject react router Link). */
+    linkAs?: 'a' | any;
+    /** Props to pass to the link (minus those already set by the SideNavigationItem props). */
+    linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;
+    /** Props to pass to the toggle button (minus those already set by the SideNavigationItem props). */
+    toggleButtonProps: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color' | 'size'>;
+    /**
+     * Choose how the children are hidden when closed
+     * ('hide' keeps the children in DOM but hide them, 'unmount' remove the children from the DOM).
+     */
+    closeMode?: 'hide' | 'unmount';
+    /** On action button click callback. */
+    onActionClick?(evt: React.MouseEvent): void;
+    /** On click callback. */
+    onClick?(evt: React.MouseEvent): void;
+}
+/**
+ * SideNavigationItem component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const SideNavigationItem: Comp<SideNavigationItemProps, HTMLLIElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface SkeletonCircleProps extends GenericProps, HasTheme {
+    /** Size variant. */
+    size: GlobalSize;
+    /** The color of the skeleton. */
+    color?: ColorPalette;
+}
+/**
+ * SkeletonCircle component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const SkeletonCircle: Comp<SkeletonCircleProps, HTMLDivElement>;
+
+/**
+ * Skeleton variants.
+ */
+declare const SkeletonRectangleVariant: {
+    readonly squared: "squared";
+    readonly rounded: "rounded";
+    readonly pill: "pill";
+};
+declare type SkeletonRectangleVariant = ValueOf<typeof SkeletonRectangleVariant>;
+/**
+ * Defines the props of the component.
+ */
+interface SkeletonRectangleProps extends GenericProps, HasTheme {
+    /** Aspect ratio (use with width and not height). */
+    aspectRatio?: Extract<AspectRatio, 'square' | 'horizontal' | 'vertical' | 'wide'>;
+    /** Height size. */
+    height?: GlobalSize;
+    /** Border variant. */
+    variant?: SkeletonRectangleVariant;
+    /** Width size. */
+    width?: GlobalSize;
+    /** The color of the skeleton. */
+    color?: ColorPalette;
+}
+/**
+ * SkeletonRectangle component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const SkeletonRectangle: Comp<SkeletonRectangleProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface SkeletonTypographyProps extends GenericProps, HasTheme {
+    /** Typography variant. */
+    typography: TypographyInterface;
+    /** Width CSS property. */
+    width?: CSSProperties['width'];
+    /** The color of the skeleton. */
+    color?: ColorPalette;
+}
+/**
+ * SkeletonTypography component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const SkeletonTypography: Comp<SkeletonTypographyProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface SliderProps extends GenericProps, HasTheme {
+    /** Helper text. */
+    helper?: string;
+    /** Whether the min and max labels should be hidden or not. */
+    hideMinMaxLabel?: boolean;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Label text. */
+    label?: string;
+    /** Maximum value on the range. */
+    max: number;
+    /** Minimum value of the range. */
+    min: number;
+    /** Native input name property. */
+    name?: string;
+    /** Number of digits in the fractional part of the selected value. */
+    precision?: number;
+    /** Range step value. */
+    steps?: number;
+    /** Selected ranged value. */
+    value: number;
+    /** On change callback. */
+    onChange(value: number, name?: string, event?: SyntheticEvent): void;
+    /** On click callback. */
+    onMouseDown?(event: React.SyntheticEvent): void;
+}
+/**
+ * Slider component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Slider: Comp<SliderProps, HTMLDivElement>;
+
+/**
+ * Clamp value in range.
+ *
+ * @param value Value to clamp.
+ * @param min   Minimum value.
+ * @param max   Maximum value.
+ * @return Clamped value.
+ */
+declare const clamp: (value: number, min: number, max: number) => number;
+
+/**
+ * Defines the props of the component.
+ */
+interface SlideshowProps extends GenericProps, Pick<SlidesProps, 'autoPlay' | 'slidesId' | 'id' | 'theme' | 'fillHeight' | 'groupBy' | 'slideGroupLabel'> {
+    /** current slide active */
+    activeIndex?: SlidesProps['activeIndex'];
+    /** Interval between each slide when automatic rotation is enabled. */
+    interval?: number;
+    /** Props to pass to the slideshow controls (minus those already set by the Slideshow props). */
+    slideshowControlsProps?: Pick<SlideshowControlsProps, 'nextButtonProps' | 'previousButtonProps' | 'paginationItemProps'> & Omit<SlideshowControlsProps, 'activeIndex' | 'onPaginationClick' | 'onNextClick' | 'onPreviousClick' | 'slidesCount' | 'parentRef' | 'theme'>;
+    /** Callback when slide changes */
+    onChange?(index: number): void;
+}
+/**
+ * Slideshow component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Slideshow: Comp<SlideshowProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface SlideshowItemProps extends GenericProps {
+    /** interval in which slides are automatically shown */
+    interval?: number;
+}
+/**
+ * SlideshowItem component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const SlideshowItem: Comp<SlideshowItemProps, HTMLDivElement>;
+
+interface UseSlideshowControlsOptions {
+    /** default active index to be displayed */
+    defaultActiveIndex?: number;
+    /** total slides to display */
+    itemsCount: number;
+    /** Index of the current slide. */
+    activeIndex?: number;
+    /** Whether the automatic rotation of the slideshow is enabled or not. */
+    autoPlay?: boolean;
+    /** Whether the image has to fill its container height or not. */
+    fillHeight?: boolean;
+    /** Number of slides to group together. */
+    groupBy?: number;
+    /** Interval between each slide when automatic rotation is enabled. */
+    interval?: number;
+    /** Callback when slide changes */
+    onChange?(index: number): void;
+    /** slideshow HTML id attribute */
+    id?: string;
+    /** slides wrapper HTML id attribute */
+    slidesId?: string;
+}
+interface UseSlideshowControls {
+    /** Index for the first visible slide, should be used when groupBy is passed in */
+    startIndexVisible: number;
+    /** Index for the last visible slide, should be used when groupBy is passed in */
+    endIndexVisible: number;
+    /** total slides to be displayed */
+    slidesCount: number;
+    /** callback to set  */
+    setSlideshow: (element: HTMLDivElement | null) => void;
+    /** reference to the slideshow element */
+    slideshow: HTMLDivElement | null;
+    /** id to be used for the slideshow */
+    slideshowId: string;
+    /** id to be used for the wrapper that contains the slides */
+    slideshowSlidesId: string;
+    /** callback that triggers the previous slide while using the slideshow controls  */
+    onPreviousClick: (loopback: boolean) => void;
+    /** callback that triggers the next slide while using the slideshow controls */
+    onNextClick: (loopback: boolean) => void;
+    /** callback that triggers a specific page while using the slideshow controls */
+    onPaginationClick: (index: number) => void;
+    /** whether the slideshow is autoplaying or not */
+    isAutoPlaying: boolean;
+    /** whether the slideshow was force paused or not */
+    isForcePaused: boolean;
+    /** callback to change whether the slideshow is autoplaying or not */
+    toggleAutoPlay: () => void;
+    /** calback to change whether the slideshow should be force paused or not */
+    toggleForcePause: () => void;
+    /** current active slide index  */
+    activeIndex: number;
+    /** set the current index as the active one */
+    setActiveIndex: (index: number) => void;
+    /** callback that stops the auto play */
+    stopAutoPlay: () => void;
+    /** callback that starts the auto play */
+    startAutoPlay: () => void;
+}
+
+/**
+ * Defines the props of the component.
+ */
+interface SlideshowControlsProps extends GenericProps, HasTheme {
+    /** Index of the current slide. */
+    activeIndex?: number;
+    /** Props to pass to the next button (minus those already set by the SlideshowControls props). */
+    nextButtonProps: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;
+    /** Reference to the parent element on which we want to listen touch swipe. */
+    parentRef?: RefObject<HTMLDivElement> | HTMLDivElement | null;
+    /** Props to pass to the previous button (minus those already set by the SlideshowControls props). */
+    previousButtonProps: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;
+    /** Props to pass to the pagination wrapper */
+    paginationProps?: Omit<React.HTMLAttributes<HTMLDivElement>, 'className' | 'style' | 'role'>;
+    /** Number of slides. */
+    slidesCount: number;
+    /** On next button click callback. */
+    onNextClick?(loopback?: boolean): void;
+    /** On pagination change callback. */
+    onPaginationClick?(index: number): void;
+    /** On previous button click callback. */
+    onPreviousClick?(loopback?: boolean): void;
+    /** whether the slideshow is currently playing */
+    isAutoPlaying?: boolean;
+    /**
+     * function to be executed in order to retrieve the label for the pagination item
+     * @deprecated Use paginationItemProps instead.
+     * */
+    paginationItemLabel?: (index: number) => string;
+    /**
+     * function to be executed in order to retrieve the props for a pagination item.
+     */
+    paginationItemProps?: (itemIndex: number) => React.HTMLAttributes<HTMLButtonElement> & {
+        label?: string;
+    };
+    /** Props to pass to the lay button (minus those already set by the SlideshowControls props). */
+    playButtonProps?: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;
+}
+declare const SlideshowControls: Comp<SlideshowControlsProps, HTMLDivElement> & {
+    useSlideshowControls: ({ activeIndex, groupBy, interval, autoPlay, defaultActiveIndex, onChange, itemsCount, id, slidesId, }: UseSlideshowControlsOptions) => UseSlideshowControls;
+    useSlideshowControlsDefaultOptions: Partial<UseSlideshowControlsOptions>;
+};
+
+interface SlidesProps extends GenericProps, HasTheme {
+    /** current slide active */
+    activeIndex: number;
+    /** slides id to be added to the wrapper */
+    id?: string;
+    /** Whether the automatic rotation of the slideshow is enabled or not. */
+    autoPlay?: boolean;
+    /** Whether the image has to fill its container height or not. */
+    fillHeight?: boolean;
+    /** Number of slides to group together. */
+    groupBy?: number;
+    /** whether the slides are currently playing or not */
+    isAutoPlaying?: boolean;
+    /** id to be passed in into the slides */
+    slidesId?: string;
+    /** callback to change whether the slideshow is playing or not */
+    toggleAutoPlay: () => void;
+    /** component to be rendered after the slides */
+    afterSlides?: React.ReactNode;
+    /** Whether the slides have controls linked */
+    hasControls?: boolean;
+    /**
+     * Accessible label to set on a slide group.
+     * Receives the group position starting from 1 and the total number of groups.
+     * */
+    slideGroupLabel?: (groupPosition: number, groupTotal: number) => string;
+}
+/**
+ * Slides component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Slides: Comp<SlidesProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface SwitchProps extends GenericProps, HasTheme {
+    /** Helper text. */
+    helper?: string;
+    /** Whether it is checked or not. */
+    isChecked?: boolean;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Native input name property. */
+    name?: string;
+    /** Position of the switch relative to the label. */
+    position?: Extract<Alignment, 'right' | 'left'>;
+    /** Native input value property. */
+    value?: string;
+    /** On change callback. */
+    onChange?(isChecked: boolean, value?: string, name?: string, event?: SyntheticEvent): void;
+    /** optional props for input */
+    inputProps?: InputHTMLAttributes<HTMLInputElement>;
+}
+/**
+ * Switch component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Switch: Comp<SwitchProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface TableProps extends GenericProps, HasTheme {
+    /** Whether the table has checkbox or thumbnail on first cell or not. */
+    hasBefore?: boolean;
+    /** Whether the table has dividers or not. */
+    hasDividers?: boolean;
+}
+/**
+ * Table component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Table: Comp<TableProps, HTMLTableElement>;
+
+/**
+ * Defines the props of the component.
+ */
+declare type TableBodyProps = GenericProps;
+/**
+ * TableBody component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const TableBody: Comp<TableBodyProps, HTMLTableSectionElement>;
+
+/**
+ * Table head cell sort order.
+ */
+declare const ThOrder: {
+    readonly asc: "asc";
+    readonly desc: "desc";
+};
+declare type ThOrder = ValueOf<typeof ThOrder>;
+/**
+ * Table cell variants.
+ */
+declare const TableCellVariant: {
+    readonly body: "body";
+    readonly head: "head";
+};
+declare type TableCellVariant = ValueOf<typeof TableCellVariant>;
+/**
+ * Defines the props of the component.
+ */
+interface TableCellProps extends GenericProps {
+    /** Icon (SVG path).(thead only). */
+    icon?: string;
+    /** Whether the column is sortable or not (thead only). */
+    isSortable?: boolean;
+    /** Sort order displayed as icon (sortable thead only). */
+    sortOrder?: ThOrder;
+    /** Variant. */
+    variant?: TableCellVariant;
+    /** On header cell click callback. */
+    onHeaderClick?(): void;
+}
+/**
+ * TableCell component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const TableCell: Comp<TableCellProps, HTMLTableCellElement>;
+
+/**
+ * Defines the props of the component.
+ */
+declare type TableHeaderProps = GenericProps;
+/**
+ * TableHeader component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const TableHeader: Comp<TableHeaderProps, HTMLTableSectionElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface TableRowProps extends GenericProps {
+    /** Whether the component is clickable or not. */
+    isClickable?: boolean;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Whether the component is selected or not. */
+    isSelected?: boolean;
+}
+/**
+ * TableRow component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const TableRow: Comp<TableRowProps, HTMLTableRowElement>;
+
+interface TabProviderProps {
+    /** Active tab index. */
+    activeTabIndex?: number;
+    /** Tab provider children. */
+    children: ReactNode;
+    /** Tab panel children should not render if the tab panel is hidden. */
+    isLazy?: boolean;
+    /** Activate tabs on focus. */
+    shouldActivateOnFocus?: boolean;
+    /** Tab change callback. */
+    onChange?(index: number): void;
+}
+/**
+ * This component provides a context in which tabs can be defined and linked to their tab panel.
+ *
+ * It does not produce any markup so you can wrap it around any React elements and then split the TabList and TabPanel
+ * components in the react tree.
+ *
+ * @param  props React component props.
+ * @return React element.
+ */
+declare const TabProvider: React.FC<TabProviderProps>;
+
+declare enum TabListLayout {
+    clustered = "clustered",
+    fixed = "fixed"
+}
+/**
+ * Defines the props of the component.
+ */
+interface TabListProps extends GenericProps, HasTheme {
+    /** ARIA label (purpose of the set of tabs). */
+    ['aria-label']: string;
+    /** Tab list. */
+    children: ReactNode;
+    /** Layout of the tabs in the list. */
+    layout?: TabListLayout;
+    /** Position of the tabs in the list (requires 'clustered' layout). */
+    position?: Alignment;
+}
+/**
+ * TabList component.
+ *
+ * Implements WAI-ARIA `tablist` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const TabList: Comp<TabListProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface TabProps extends GenericProps {
+    /** Children are not supported. */
+    children?: never;
+    /** Icon (SVG path). */
+    icon?: IconProps['icon'];
+    /** Native id property. */
+    id?: string;
+    /** Whether the tab is active or not. */
+    isActive?: boolean;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Label content. */
+    label: string | ReactNode;
+}
+/**
+ * Tab component.
+ *
+ * Implements WAI-ARIA `tab` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Tab: Comp<TabProps, HTMLButtonElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface TabPanelProps extends GenericProps {
+    /** Native id property */
+    id?: string;
+    /** Whether the tab is active or not. */
+    isActive?: boolean;
+}
+/**
+ * TabPanel component.
+ *
+ * Implements WAI-ARIA `tabpanel` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const TabPanel: Comp<TabPanelProps, HTMLDivElement>;
+
+/**
+ * Defines the props of the component.
+ */
+interface TextFieldProps extends GenericProps, HasTheme {
+    /** Chip Group to be rendered before the main text input. */
+    chips?: HTMLElement | ReactNode;
+    /** Props to pass to the clear button (minus those already set by the TextField props). If not specified, the button won't be displayed. */
+    clearButtonProps?: Pick<IconButtonProps, 'label'> & Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;
+    /** Error message. */
+    error?: string | ReactNode;
+    /** Whether we force the focus style or not. */
+    forceFocusStyle?: boolean;
+    /** Whether the text field is displayed with error style or not. */
+    hasError?: boolean;
+    /** Additional element to put at the end of the text field. */
+    afterElement?: ReactNode;
+    /** Helper text. */
+    helper?: string | ReactNode;
+    /** Icon (SVG path). */
+    icon?: string;
+    /** Native input id property (generated if not provided to link the label element). */
+    id?: string;
+    /** Reference to the <input> or <textarea> element. */
+    inputRef?: Ref<HTMLInputElement | HTMLTextAreaElement>;
+    /** Whether the component is disabled or not. */
+    isDisabled?: boolean;
+    /** Whether the component is required or not. */
+    isRequired?: boolean;
+    /** Whether the text field is displayed with valid style or not. */
+    isValid?: boolean;
+    /** Label text. */
+    label?: string;
+    /** Max string length the input accepts (constrains the input and displays a character counter). */
+    maxLength?: number;
+    /** Minimum number of rows displayed in multiline mode (requires `multiline` to be enabled). */
+    minimumRows?: number;
+    /** Whether the text field is a textarea or an input. */
+    multiline?: boolean;
+    /** Native input name property. */
+    name?: string;
+    /** Placeholder text. */
+    placeholder?: string;
+    /** Reference to the wrapper. */
+    textFieldRef?: Ref<HTMLDivElement>;
+    /** Value. */
+    value?: string;
+    /** On blur callback. */
+    onBlur?(event: React.FocusEvent): void;
+    /** On change callback. */
+    onChange(value: string, name?: string, event?: SyntheticEvent): void;
+    /** On focus callback. */
+    onFocus?(event: React.FocusEvent): void;
+}
+/**
+ * TextField component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const TextField: Comp<TextFieldProps, HTMLDivElement>;
+
+declare const useFocusPointStyle: ({ image, aspectRatio, focusPoint, imgProps: { width, height } }: ThumbnailProps, element: HTMLImageElement | undefined, isLoaded: boolean) => CSSProperties;
+
+/**
+ * Defines the props of the component.
+ */
+interface ToolbarProps extends GenericProps {
+    /** After content (placed after the label). */
+    after?: ReactNode;
+    /** Before content (placed before the label). */
+    before?: ReactNode;
+    /** Label content. */
+    label?: ReactNode;
+}
+/**
+ * Toolbar component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Toolbar: Comp<ToolbarProps, HTMLDivElement>;
+
+/** Position of the tooltip relative to the anchor element. */
+declare type TooltipPlacement = Extract<Placement, 'top' | 'right' | 'bottom' | 'left'>;
+/**
+ * Defines the props of the component.
+ */
+interface TooltipProps extends GenericProps {
+    /** Anchor (element on which we activate the tooltip). */
+    children: ReactNode;
+    /** Delay (in ms) before closing the tooltip. */
+    delay?: number;
+    /** Whether the tooltip is displayed even without the mouse hovering the anchor. */
+    forceOpen?: boolean;
+    /** Label text. */
+    label?: string | null | false;
+    /** Placement of the tooltip relative to the anchor. */
+    placement?: TooltipPlacement;
+}
+/**
+ * Tooltip component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Tooltip: Comp<TooltipProps, HTMLDivElement>;
+
+/**
+ * Uploader variants.
+ */
+declare const UploaderVariant: {
+    readonly square: "square";
+    readonly rounded: "rounded";
+    readonly circle: "circle";
+};
+declare type UploaderVariant = ValueOf<typeof UploaderVariant>;
+/**
+ * Uploader sizes.
+ */
+declare type UploaderSize = Extract<Size, 'xl' | 'xxl'>;
+/**
+ * Defines the props of the component.
+ */
+interface UploaderProps extends GenericProps, HasTheme {
+    /** Image aspect ratio. */
+    aspectRatio?: AspectRatio;
+    /** Icon (SVG path). */
+    icon?: string;
+    /** Label text. */
+    label?: string;
+    /** Size variant. */
+    size?: UploaderSize;
+    /** Variant. */
+    variant?: UploaderVariant;
+    /** On click callback. */
+    onClick?: MouseEventHandler<HTMLDivElement>;
+}
+/**
+ * Uploader component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Uploader: Comp<UploaderProps, HTMLDivElement>;
+
+/**
+ * User block sizes.
+ */
+declare type UserBlockSize = Extract<Size, 's' | 'm' | 'l'>;
+/**
+ * Defines the props of the component.
+ */
+interface UserBlockProps extends GenericProps, HasTheme {
+    /** Props to pass to the avatar. */
+    avatarProps?: Omit<AvatarProps, 'alt'>;
+    /** Additional fields used to describe the user. */
+    fields?: string[];
+    /** Props to pass to the link wrapping the avatar thumbnail. */
+    linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;
+    /** Custom react component for the link (can be used to inject react router Link). */
+    linkAs?: 'a' | any;
+    /** Multiple action toolbar content. */
+    multipleActions?: ReactNode;
+    /** User name. */
+    name?: string;
+    /** Props to pass to the name block. */
+    nameProps?: GenericProps;
+    /** Orientation. */
+    orientation?: Orientation;
+    /** Simple action toolbar content. */
+    simpleAction?: ReactNode;
+    /** Size variant. */
+    size?: UserBlockSize;
+    /** On click callback. */
+    onClick?(): void;
+    /** On mouse enter callback. */
+    onMouseEnter?(): void;
+    /** On mouse leave callback. */
+    onMouseLeave?(): void;
+}
+/**
+ * UserBlock component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const UserBlock: Comp<UserBlockProps, HTMLDivElement>;
+
+export { AlertDialog, AlertDialogProps, Autocomplete, AutocompleteMultiple, AutocompleteMultipleProps, AutocompleteProps, Avatar, AvatarProps, AvatarSize, Badge, BadgeProps, Button, ButtonEmphasis, ButtonGroup, ButtonGroupProps, ButtonProps, Checkbox, CheckboxProps, Chip, ChipGroup, ChipGroupProps, ChipProps, CommentBlock, CommentBlockProps, CommentBlockVariant, DatePicker, DatePickerControlled, DatePickerControlledProps, DatePickerField, DatePickerFieldProps, DatePickerProps, Dialog, DialogProps, DialogSizes, Divider, DividerProps, DragHandle, DragHandleProps, Dropdown, DropdownProps, Elevation, ExpansionPanel, ExpansionPanelProps, Flag, FlagProps, FlexBox, FlexBoxProps, FlexHorizontalAlignment, FlexVerticalAlignment, GapSize, GenericBlock, GenericBlockGapSize, GenericBlockProps, Grid, GridItem, GridItemProps, GridProps, Heading, HeadingLevelProvider, HeadingLevelProviderProps, HeadingProps, Icon, IconButton, IconButtonProps, IconProps, IconSizes, ImageBlock, ImageBlockCaptionPosition, ImageBlockProps, ImageBlockSize, InlineList, InlineListProps, InputHelper, InputHelperProps, InputLabel, InputLabelProps, Lightbox, LightboxProps, Link, LinkPreview, LinkPreviewProps, LinkProps, List, ListDivider, ListDividerProps, ListItem, ListItemProps, ListItemSize, ListProps, ListSubheader, ListSubheaderProps, MarginAutoAlignment, Message, MessageProps, Mosaic, MosaicProps, Notification, NotificationProps, Offset, Placement, Popover, PopoverProps, PostBlock, PostBlockProps, Progress, ProgressProps, ProgressTracker, ProgressTrackerProps, ProgressTrackerProvider, ProgressTrackerProviderProps, ProgressTrackerStep, ProgressTrackerStepPanel, ProgressTrackerStepPanelProps, ProgressTrackerStepProps, ProgressVariant, RadioButton, RadioButtonProps, RadioGroup, RadioGroupProps, Select, SelectMultiple, SelectMultipleField, SelectMultipleProps, SelectProps, SelectVariant, SideNavigation, SideNavigationItem, SideNavigationItemProps, SideNavigationProps, SkeletonCircle, SkeletonCircleProps, SkeletonRectangle, SkeletonRectangleProps, SkeletonRectangleVariant, SkeletonTypography, SkeletonTypographyProps, Slider, SliderProps, Slides, SlidesProps, Slideshow, SlideshowControls, SlideshowControlsProps, SlideshowItem, SlideshowItemProps, SlideshowProps, Switch, SwitchProps, Tab, TabList, TabListLayout, TabListProps, TabPanel, TabPanelProps, TabProps, TabProvider, TabProviderProps, Table, TableBody, TableBodyProps, TableCell, TableCellProps, TableCellVariant, TableHeader, TableHeaderProps, TableProps, TableRow, TableRowProps, Text, TextField, TextFieldProps, TextProps, ThOrder, Thumbnail, ThumbnailProps, Toolbar, ToolbarProps, Tooltip, TooltipPlacement, TooltipProps, Uploader, UploaderProps, UploaderSize, UploaderVariant, UserBlock, UserBlockProps, UserBlockSize, clamp, isClickable, useFocusPointStyle, useHeadingLevel };