@pautena/react-design-system 0.12.2 → 0.13.0-alpha.1

package/dist/index.d.ts

@@ -1,1113 +0,0 @@
-/// <reference types="react" />
-import * as React$1 from 'react';
-import React__default, { PropsWithChildren, FunctionComponent, ReactElement, ReactNode, FormEvent, Dispatch, SetStateAction } from 'react';
-import * as _mui_material from '@mui/material';
-import { SxProps, Theme, GridProps, PropTypes, AppBarProps, DrawerProps as DrawerProps$1, ListSubheaderProps, ChipTypeMap, AutocompleteProps as AutocompleteProps$1, TextFieldProps as TextFieldProps$1, AlertColor, Color } from '@mui/material';
-import * as _mui_system from '@mui/system';
-import { ResponsiveStyleValue } from '@mui/system';
-import { LabelVariant as LabelVariant$1 } from '~/components/data-display';
-import { MarkdownToJSX } from 'markdown-to-jsx';
-import * as _emotion_styled from '@emotion/styled';
-import * as csstype from 'csstype';
-import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
-import { SelectInputProps } from '@mui/material/Select/SelectInput';
-import { Variant } from '@mui/material/styles/createTypography';
-import { LoremUnit } from 'lorem-ipsum/types/src/constants/units';
-
-interface ValueEditButtonsProps {
-    onClickCancel: () => void;
-    onClickSubmit: () => void;
-    sx?: SxProps<Theme>;
-}
-declare const ValueEditButtons: ({ onClickCancel, onClickSubmit, sx }: ValueEditButtonsProps) => JSX.Element;
-/**
- * Hook to manage the editing behaviour
- */
-declare const useEditableValueDisplay: <T>(initialValue: T | undefined, onEdit: (value?: T | undefined) => void) => {
-    isEditing: boolean;
-    cancelEdit: () => void;
-    editValue: T | undefined;
-    setEditValue: React__default.Dispatch<React__default.SetStateAction<T | undefined>>;
-    startEdit: () => void;
-    submitEdit: () => void;
-};
-interface ValueEditButtonProps {
-    dense?: boolean;
-    onClick: () => void;
-}
-declare const ValueEditButton: ({ dense, onClick }: ValueEditButtonProps) => JSX.Element;
-
-interface BaseValueProps<T> {
-    /**
-     * Name of the displayed value
-     */
-    label: string;
-    /**
-     * Value displayed
-     */
-    value?: T;
-    /**
-     * String rendered if value is undefined
-     */
-    placeholder?: string;
-    /**
-     * The value has to be displayed as compact or not.
-     * False by default
-     */
-    dense?: boolean;
-}
-interface EditableValueProps<T> {
-    /**
-     * This field can be edited or not
-     */
-    editable?: boolean;
-    /**
-     * Callback executed when the value is edited
-     */
-    onEdit?: (value?: T) => void;
-}
-declare const DefaultPlaceholder = "-";
-
-type ValueTextProps = BaseValueProps<string | number> & EditableValueProps<string>;
-/**
- * Displays a string value with a label
- */
-declare const ValueText: ({ label, value: valueProp, placeholder, editable, dense, onEdit, }: ValueTextProps) => JSX.Element;
-
-type ValueCardProps = PropsWithChildren;
-/**
- * Container to show a labeled value
- */
-declare const ValueCard: ({ children }: ValueCardProps) => JSX.Element;
-
-type ValueBooleanProps = BaseValueProps<boolean> & EditableValueProps<boolean>;
-/**
- * Displays a boolean value with a label
- */
-declare const ValueBoolean: ({ label, value, placeholder, editable, dense, onEdit, }: ValueBooleanProps) => JSX.Element;
-
-type EditInputType = "datetime" | "date" | "time";
-interface ValueDatetimeProps extends BaseValueProps<Date>, EditableValueProps<Date> {
-    /**
-     * Datetime format
-     */
-    format: string;
-    /**
-     * Edit input type
-     */
-    editInputType?: EditInputType;
-}
-/**
- * Displays a formated datetime with a label
- */
-declare const ValueDatetime: ({ label, value: valueProp, format: fmt, placeholder, editable, editInputType, dense, onEdit, }: ValueDatetimeProps) => JSX.Element;
-
-type ValueItemProps = PropsWithChildren<Omit<GridProps, "item" | "container"> & {
-    bordered?: ResponsiveStyleValue<boolean>;
-}>;
-type ValueItemComponent = FunctionComponent<ValueItemProps>;
-type ValueItemElement = ReactElement<ValueItemProps, ValueItemComponent>;
-declare const valueItemClasses: {
-    root: string;
-    content: string;
-};
-declare const ValueItem: ValueItemComponent;
-
-interface GroupValueCardProps {
-    title: string;
-    subtitle?: string;
-    centered?: boolean;
-    children: ValueItemElement | ValueItemElement[];
-    dense?: boolean;
-}
-declare const GroupValueCard: ({ title, subtitle, centered, children, dense, }: GroupValueCardProps) => JSX.Element;
-
-type ValueRatingProps = BaseValueProps<number> & {
-    maxRating?: number;
-} & EditableValueProps<number>;
-/**
- * Displays a number using stars
- */
-declare const ValueRating: ({ label, value, maxRating, editable, dense, onEdit, }: ValueRatingProps) => JSX.Element;
-
-type ValueLabelProps = BaseValueProps<string | number | string[] | number[]> & {
-    variant: LabelVariant$1 | LabelVariant$1[];
-};
-/**
- * Displays a label component value with a label
- */
-declare const ValueLabel: ({ label, value: valueProp, placeholder, variant, }: ValueLabelProps) => JSX.Element;
-
-/**
- * Displays a centered loading indicator
- */
-declare const LoadingArea: () => JSX.Element;
-
-interface QueryContainerError {
-    /**
-     * The error title
-     */
-    name?: string;
-    /**
-     * The description of the error
-     */
-    message: string;
-}
-interface QueryContainerSuccess {
-    /**
-     * The success title
-     */
-    name?: string;
-    /**
-     * The success text
-     */
-    message: string;
-}
-type QueryContainerProps = PropsWithChildren<{
-    /**
-     * There is a query in progress and we have available data
-     */
-    fetching?: boolean | boolean[];
-    /**
-     * There is a query in progress and we don't have available data
-     */
-    loading?: boolean | boolean[];
-    /**
-     * The query has returned an error
-     */
-    error?: QueryContainerError;
-    /**
-     * The query has finished successfully
-     */
-    success?: QueryContainerSuccess;
-}>;
-/**
- * Component to show different indicators based on the usual api query statuses
- */
-declare function QueryContainer({ fetching: fetchingProp, loading: loadingProp, error, success, children, }: QueryContainerProps): JSX.Element;
-
-type BulletVariant = "primary" | "secondary" | "default" | "info" | "warning" | "error";
-declare const bulletClasses: {
-    root: string;
-};
-interface BulletProps {
-    /**
-     * Color palette used to draw the component
-     */
-    variant?: BulletVariant;
-    /**
-     * Custom styles
-     */
-    sx?: SxProps<Theme>;
-}
-/**
- * Dot to attract the user attention
- */
-declare const Bullet: ({ variant, sx }: BulletProps) => JSX.Element;
-
-type LabelVariant = "primary" | "secondary" | "default" | "info" | "warning" | "error" | "success";
-declare const labelClasses: {
-    root: string;
-};
-interface LabelProps {
-    /**
-     * Content of the component
-     */
-    text: string;
-    /**
-     * Color palette used to draw the component
-     */
-    variant?: LabelVariant;
-    /**
-     * Custom styles
-     */
-    sx?: SxProps<Theme>;
-    /**
-     * Show the text as uppercase
-     */
-    textTransform?: "none" | "capitalize" | "uppercase";
-}
-/**
- * Compact element to represent a text
- */
-declare const Label: ({ text, variant, textTransform, sx, }: LabelProps) => JSX.Element;
-
-type HeaderPreset = PropTypes.Color | "transparent";
-type HeaderActionVariant = "text" | "outlined" | "contained";
-type HeaderAction = {
-    id: string;
-    text: string;
-    disabled?: boolean;
-    href?: string;
-    onClick?: () => void;
-};
-interface HeaderBreadcrumb {
-    id: string;
-    text: string;
-    link: string;
-}
-interface HeaderTab {
-    id: string;
-    label: string;
-    disabled?: boolean;
-    href?: string;
-}
-interface HeaderNavigationButton {
-    /**
-     * Button text
-     */
-    text: string;
-    /**
-     * Url where the user has to be redirected
-     */
-    href: string;
-    /**
-     * Icon to be shown before the button
-     */
-    icon?: ReactElement;
-}
-type HeaderProps = {
-    /**
-     * Title of the header
-     */
-    title?: string | ReactElement;
-    /**
-     * Show a loading indicator in the title position
-     */
-    loadingTitle?: boolean;
-    /**
-     * Subtitle of the header
-     */
-    subtitle?: string | ReactElement;
-    /**
-     * Show a loading indicator in the subtitle position
-     */
-    loadingSubtitle?: boolean;
-    /**
-     * Color palete used to render the component
-     */
-    preset?: HeaderPreset;
-    /**
-     * List of breadcumbs to represent the path to reach
-     * the page that we are
-     */
-    breadcrumbs?: HeaderBreadcrumb[];
-    /**
-     * List of actions that can be performed by the user.
-     * Each action will be a button in the header.
-     */
-    actions?: HeaderAction[];
-    /**
-     * Variant used to render the actions
-     */
-    actionsVariant?: HeaderActionVariant;
-    /**
-     * If is set, a list of tabs is dispayed at the bottom
-     */
-    tabs?: HeaderTab[];
-    /**
-     * The tabs will work using
-     * - a panel container (panel)
-     * - using a the navigation system (navigation).
-     */
-    tabsMode?: "panel" | "navigation";
-    /**
-     * A single button that helps the user to navigate to
-     * a screen related to the current screen
-     */
-    navigationButton?: HeaderNavigationButton;
-};
-type HeaderComponent = FunctionComponent<HeaderProps>;
-type HeaderElement = ReactElement<HeaderProps, HeaderComponent>;
-
-/**
- * Section used to explain give basic information about the page
- * and put the main actions
- */
-declare const Header: HeaderComponent;
-
-type HeaderTitleProps = PropsWithChildren<{
-    loading?: boolean;
-}>;
-declare const HeaderTitle: ({ loading, children }: HeaderTitleProps) => JSX.Element;
-type HeaderSubtitleProps = PropsWithChildren<{
-    loading?: boolean;
-}>;
-declare const HeaderSubtitle: ({ loading, children }: HeaderSubtitleProps) => JSX.Element;
-
-type BoardProps = PropsWithChildren<{
-    markdown?: string;
-    content?: string | string[];
-    spacing?: 0 | 1 | 2 | 3 | 4 | 5;
-    sx?: SxProps<Theme>;
-}>;
-declare const Board: ({ markdown: markdownProps, content: contentProp, spacing, children, sx, }: BoardProps) => JSX.Element;
-
-interface MarkdownProps {
-    content: string;
-    options?: MarkdownToJSX.Options;
-}
-declare const markdownDefaultOptions: MarkdownToJSX.Options;
-declare const Markdown: ({ content, options }: MarkdownProps) => JSX.Element;
-
-type ContentProps = PropsWithChildren;
-type ContentComponent = FunctionComponent<ContentProps>;
-type ContentElement = ReactElement<ContentElement, ContentComponent>;
-
-declare const Content: ({ children }: ContentProps) => JSX.Element;
-
-interface CenterContainerProps {
-    children: ReactNode | undefined;
-    centerVertical?: boolean;
-    centerHorizontal?: boolean;
-    sx?: SxProps<Theme>;
-}
-declare function CenterContainer({ children, centerVertical, centerHorizontal, sx, }: CenterContainerProps): JSX.Element;
-
-interface ListPanelItem {
-    id: string;
-    text: string;
-    tooltip?: string;
-}
-type ListPanelProps = PropsWithChildren<{
-    defaultSelectedItem?: string;
-    items: ListPanelItem[];
-    colBreakpoint?: number;
-    onSelectedItemChange?: (id: string) => void;
-}>;
-declare const ListPanel: ({ items, defaultSelectedItem, colBreakpoint, children, onSelectedItemChange, }: ListPanelProps) => JSX.Element;
-
-declare const ListPanelContext: React$1.Context<string | undefined>;
-declare const ListPanelContextProvider: React$1.Provider<string | undefined>;
-declare const useListPanel: () => string | undefined;
-
-interface DrawerAppBarProps extends AppBarProps {
-    title?: string;
-}
-declare const DrawerAppBar: ({ title, sx, children, ...rest }: DrawerAppBarProps) => JSX.Element;
-
-type DrawerVariant = "temporary" | "mini" | "persistent" | "clipped";
-type DrawerState = "open" | "collapse" | "close";
-type DrawerSize = "small" | "medium";
-interface DrawerItemAvatar {
-    src: string;
-    alt: string;
-}
-interface DrawerItemLabel {
-    text: string;
-    variant: LabelVariant;
-}
-interface DrawerItemBullet {
-    variant: BulletVariant;
-}
-interface DrawerNavigationItemLink {
-    id: string;
-    text: string;
-    href: string;
-    icon?: ReactElement;
-    avatar?: DrawerItemAvatar;
-    label?: DrawerItemLabel;
-    bullet?: DrawerItemBullet;
-}
-type DrawerNavigationItemCollapsable = Pick<DrawerNavigationItemLink, "id" | "text" | "icon"> & {
-    items: DrawerNavigationItem[];
-};
-type DrawerNavigationItem = DrawerNavigationItemLink | DrawerNavigationItemCollapsable;
-interface DrawerNavigationSection {
-    title?: string;
-    items: DrawerNavigationItem[];
-}
-interface DrawerNavigation {
-    items: DrawerNavigationSection[];
-}
-interface DrawerContentProps {
-    /**
-     * Object with the content that has to be rendered
-     */
-    nav: DrawerNavigation;
-    /**
-     * Item size. default to medium
-     */
-    size?: DrawerSize;
-}
-type DrawerContentComponent = FunctionComponent<DrawerContentProps>;
-type DrawerContentElement = ReactElement<DrawerContentProps, DrawerContentComponent>;
-interface DrawerProps extends DrawerProps$1 {
-    children: DrawerContentElement;
-}
-type DrawerComponent = FunctionComponent<DrawerProps>;
-type DrawerElement = ReactElement<DrawerProps, DrawerComponent>;
-declare const getDrawerItemColors: (theme: Theme, selected: boolean | undefined) => {
-    color: string | undefined;
-    fontWeight: csstype.Property.FontWeight | undefined;
-};
-type DrawerAppBarComponent = FunctionComponent<DrawerAppBarProps>;
-type DrawerAppBarElement = ReactElement<DrawerAppBarProps, DrawerAppBarComponent>;
-
-declare const DrawerHeader: _emotion_styled.StyledComponent<_mui_system.MUIStyledCommonProps<Theme>, React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-declare const Drawer: DrawerComponent;
-
-type DrawerProviderProps = PropsWithChildren<{
-    initialState?: DrawerState;
-    underAppBar?: boolean;
-    drawerWidth?: number;
-    variant?: DrawerVariant;
-    selectedItemId?: string;
-    onStateChange?: (newState: DrawerState) => void;
-}>;
-declare const DrawerProvider: ({ children, initialState: initialStateProp, variant, drawerWidth: drawerWidthProp, underAppBar, selectedItemId, onStateChange, }: DrawerProviderProps) => JSX.Element;
-
-interface DrawerContextProps {
-    selectedItemId?: string;
-    state: DrawerState;
-    variant: DrawerVariant;
-    drawerWidth: number;
-    underAppBar: boolean;
-    switchState(): void;
-    close(): void;
-    collapse(): void;
-    open(): void;
-    setState: (state: DrawerState) => void;
-}
-declare const DrawerContext: React$1.Context<DrawerContextProps | undefined>;
-declare const UndefinedProvider: Error;
-declare const useDrawer: () => DrawerContextProps;
-
-/**
- * Content to be shown inside a navigation
- */
-declare const DrawerContent: DrawerContentComponent;
-
-interface DrawerSectionProps {
-    /**
-     * Section title
-     */
-    title?: string;
-    /**
-     * List of items of that section
-     */
-    items: DrawerNavigationItem[];
-    /**
-     * Item size. default to medium
-     */
-    size?: DrawerSize;
-}
-/**
- * Render a group of items inside the drawer
- * with an optional title
- */
-declare const DrawerSection: ({ title, items, size }: DrawerSectionProps) => JSX.Element;
-
-interface DrawerSubheaderProps extends ListSubheaderProps {
-    /**
-     * Item size. default to medium
-     */
-    size?: DrawerSize;
-}
-declare const DrawerSubheader: _emotion_styled.StyledComponent<{
-    children?: any;
-    classes?: Partial<_mui_material.ListSubheaderClasses> | undefined;
-    color?: "default" | "inherit" | "primary" | undefined;
-    disableGutters?: boolean | undefined;
-    disableSticky?: boolean | undefined;
-    inset?: boolean | undefined;
-    sx?: _mui_material.SxProps<_mui_material.Theme> | undefined;
-} & _mui_material_OverridableComponent.CommonProps & Omit<Omit<React$1.DetailedHTMLProps<React$1.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
-    ref?: ((instance: HTMLLIElement | null) => void) | React$1.RefObject<HTMLLIElement> | null | undefined;
-}, "color" | "inset" | "sx" | keyof _mui_material_OverridableComponent.CommonProps | "children" | "disableGutters" | "disableSticky"> & _mui_system.MUIStyledCommonProps<_mui_material.Theme> & DrawerSubheaderProps, {}, {}>;
-
-type DrawerMainProps = PropsWithChildren;
-declare const DrawerMain: ({ children }: DrawerMainProps) => JSX.Element;
-
-type SelectSize = "small" | "medium";
-interface SelectProps<T> {
-    label: string;
-    value: T;
-    loading?: boolean;
-    fetching?: boolean;
-    size?: SelectSize;
-    color?: string;
-    fullWidth?: boolean;
-    children?: ReactNode;
-    onChange?: SelectInputProps<T>["onChange"];
-}
-declare const Select: <T extends any>({ label, value, loading, fetching, size, fullWidth, color, children, onChange, }: SelectProps<T>) => JSX.Element;
-
-interface SignInProps {
-    title: string;
-    subtitle: string;
-    error?: Error;
-    loading?: boolean;
-    onSubmitSignIn: (email: string, password: string) => void;
-}
-declare const SignIn: ({ title, subtitle, loading, error, onSubmitSignIn }: SignInProps) => JSX.Element;
-
-interface AutocompleteProps<T, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined, ChipComponent extends React__default.ElementType = ChipTypeMap["defaultComponent"]> extends Omit<AutocompleteProps$1<T, Multiple, DisableClearable, FreeSolo, ChipComponent>, "renderInput" | "onChange" | "color"> {
-    label: string;
-    helperText?: string;
-    color?: string;
-    fetching?: boolean;
-    onChangeValue?: (value: T) => void;
-}
-declare const Autocomplete: <T, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined, ChipComponent extends React__default.ElementType<any> = "div">(props: AutocompleteProps<T, Multiple, DisableClearable, FreeSolo, ChipComponent>) => JSX.Element;
-
-type DateRange$1 = [Date, Date | undefined];
-interface DateRangePickerProps {
-    label: string;
-    defaultValue: DateRange$1;
-    format: string;
-    fullWidth?: boolean;
-    size?: "small" | "medium";
-    onValueChange: (value: DateRange$1, index: number) => void;
-}
-declare const DateRangePicker: ({ defaultValue, format: fmt, label, fullWidth, onValueChange, size, }: DateRangePickerProps) => JSX.Element;
-
-type DateRange = [Date, Date | undefined];
-interface DateRangeCalendarProps {
-    defaultValue: DateRange;
-    onValueChange: (value: DateRange, updatedIndex: number) => void;
-}
-declare const DateRangeCalendar: ({ defaultValue, onValueChange }: DateRangeCalendarProps) => JSX.Element;
-
-type TextFieldProps = TextFieldProps$1 & {
-    fetching?: boolean;
-    loading?: boolean;
-    hexColor?: string;
-};
-declare const TextField: ({ id: overrideId, label, InputLabelProps, InputProps, fetching, loading, helperText, hexColor, size, fullWidth, sx, ...rest }: TextFieldProps) => JSX.Element;
-
-type ActionVariant$1 = "primary" | "error" | "warning" | "success";
-interface ActionProps {
-    variant: ActionVariant$1;
-    title: string;
-    titleVariant?: Extract<Variant, "h4" | "h5" | "h6">;
-    description?: string | ReactElement;
-    descriptionVariant?: Variant;
-    helperText?: string;
-    helperTextVariant?: Variant;
-    buttonText: string;
-    confirmable?: boolean;
-    confirmTitle?: string;
-    confirmDescription?: string;
-    passphrase?: string;
-    onAction: () => void;
-}
-declare const Action: ({ variant, title, titleVariant, description, descriptionVariant, buttonText, helperText, helperTextVariant, confirmable, passphrase, confirmTitle, confirmDescription, onAction, }: ActionProps) => JSX.Element;
-
-type ActionVariant = "primary" | "error" | "warning" | "success";
-interface ActionHeaderProps {
-    variant?: ActionVariant;
-    title: string;
-    titleVariant?: Extract<Variant, "h4" | "h5" | "h6">;
-}
-declare const ActionHeader: ({ title, titleVariant, variant, }: ActionHeaderProps) => JSX.Element;
-
-interface TabData {
-    text: string;
-    icon?: ReactElement;
-}
-type TabCardProps = PropsWithChildren<{
-    tabs: TabData[];
-    initialTab?: number;
-    onChangeTab?: (tab: TabData, index: number) => void;
-}>;
-declare const TabCard: ({ children, tabs, initialTab, onChangeTab, }: TabCardProps) => JSX.Element;
-
-type TabCardPanelProps = PropsWithChildren<{
-    index: number | number[];
-    sx?: SxProps<Theme>;
-}>;
-declare const TabCardPanel: ({ index, children, sx }: TabCardPanelProps) => JSX.Element | null;
-
-interface TabPanelProps {
-    children?: React__default.ReactNode;
-    index: number | number[];
-}
-declare function TabPanel({ children, index }: TabPanelProps): JSX.Element;
-
-type Order = "asc" | "desc";
-interface HeadCell<T> {
-    disablePadding: boolean;
-    id: keyof T;
-    label: string;
-    numeric: boolean;
-    sort: boolean;
-}
-interface EnhancedTableHeadProps<T> {
-    onRequestSort: (property: keyof T) => void;
-    order: Order;
-    orderBy: keyof T;
-    headCells: HeadCell<T>[];
-}
-declare const EnhancedTableHead: <T>({ order, orderBy, headCells, onRequestSort, }: EnhancedTableHeadProps<T>) => JSX.Element;
-
-interface Props<T> {
-    readonly data: T[];
-    search?: boolean;
-    defaultSort: keyof T;
-    defaultOrder?: Order;
-    loading?: boolean;
-    columns: HeadCell<T>[];
-    children: (data: T[]) => ReactNode;
-}
-declare const EnhancedTable: {
-    <T>({ children, data, search, columns, defaultSort, defaultOrder, loading, }: Props<T>): JSX.Element;
-    defaultProps: {
-        defaultOrder: string;
-    };
-};
-
-interface EnhancedRemoteTableProps<T> {
-    data: T[];
-    loading: boolean;
-    defaultSort: keyof T;
-    defaultOrder?: Order;
-    columns: HeadCell<T>[];
-    children: (data: T, index: number) => ReactNode;
-    onRequestSort: (col: keyof T, orderBy: "asc" | "desc") => void;
-}
-declare const EnhancedRemoteTable: <T>({ children, data, loading, columns, defaultSort, defaultOrder, onRequestSort, }: EnhancedRemoteTableProps<T>) => JSX.Element;
-
-type IconColor = "inherit" | "action" | "disabled" | "primary" | "secondary" | "error" | "info" | "success" | "warning";
-interface PlaceholderAction {
-    id: string;
-    text: string;
-    href?: string;
-    onClick?: () => void;
-}
-interface PlaceholderIconArgs {
-    size: number;
-    color: IconColor;
-}
-type PlaceholderIcon = ({ size, color }: PlaceholderIconArgs) => ReactElement;
-interface PlaceholderProps {
-    title: string;
-    subtitle: string;
-    iconSize?: number;
-    icon?: PlaceholderIcon;
-    actions?: PlaceholderAction[];
-}
-declare const Placeholder: ({ title, subtitle, icon, iconSize, actions, }: PlaceholderProps) => JSX.Element;
-
-interface SkeletonGridProps {
-    size?: number;
-}
-declare const SkeletonGrid: ({ size }: SkeletonGridProps) => JSX.Element;
-
-interface SkeletonCardProps {
-    width?: number | string;
-    animation?: "pulse" | "wave" | false;
-}
-declare const SkeletonCard: ({ width, animation }: SkeletonCardProps) => JSX.Element;
-
-type ContentPlaceholderProps = PropsWithChildren<{
-    size?: number;
-    p?: number;
-}>;
-declare const ContentPlaceholder: ({ size, children, p }: ContentPlaceholderProps) => JSX.Element;
-
-interface LoremIpsumPlaceholderProps {
-    count?: number;
-    units?: LoremUnit;
-    variant?: Variant;
-}
-declare const LoremIpsumPlaceholder: ({ count, units, variant, }: LoremIpsumPlaceholderProps) => JSX.Element;
-
-interface ExpandableAlertProps {
-    severity: AlertColor;
-    iconMapping?: Partial<Record<AlertColor, React__default.ReactNode>>;
-    title?: string;
-    message: string;
-    metadata?: string | string[];
-    metadataComponent?: ReactElement;
-    onClose: () => void;
-    sx?: SxProps<Theme>;
-}
-declare const ExpandableAlert: React__default.ForwardRefExoticComponent<ExpandableAlertProps & React__default.RefAttributes<any>>;
-
-interface DialogAction {
-    id: string;
-    text: string;
-    type?: "button" | "submit";
-    color?: "inherit" | "primary" | "secondary" | "success" | "error" | "info" | "warning";
-    onClick?: () => void;
-}
-type BootstrapDialogDialogProps = PropsWithChildren<{
-    open: boolean;
-    title: string;
-    loading?: boolean;
-    disabled?: boolean;
-    disableAccept?: boolean;
-    disableCancel?: boolean;
-    cancelable?: boolean;
-    acceptable?: boolean;
-    callCloseWhenCancel?: boolean;
-    actions?: DialogAction[];
-    cancelText?: string;
-    acceptText?: string;
-    acceptType?: "button" | "submit";
-    onClose: () => void;
-    onCancel?: () => void;
-    onAccept?: () => void;
-    component?: React.ElementType;
-    componentProps?: any;
-}>;
-
-type OmitBaseDialogProps$1 = "cancelable" | "acceptable" | "onAccept" | "onCancel" | "onClose" | "actions" | "callCloseWhenCancel" | "component" | "acceptType";
-interface ConfirmDialogProps extends Omit<BootstrapDialogDialogProps, OmitBaseDialogProps$1> {
-    confirmText?: string;
-    canceText?: string;
-    passphrase?: string;
-    onCancel: () => void;
-    onConfirm: () => void;
-}
-declare const ConfirmDialog: ({ open, title, loading, disabled, confirmText, cancelText, passphrase, children, onConfirm, onCancel, }: ConfirmDialogProps) => JSX.Element;
-
-type OmitBaseDialogProps = "cancelable" | "acceptable" | "onAccept" | "onCancel" | "onClose" | "actions" | "callCloseWhenCancel" | "component" | "acceptType";
-interface FormDialogProps<T> extends Omit<BootstrapDialogDialogProps, OmitBaseDialogProps> {
-    submitText?: string;
-    canceText?: string;
-    onCancel: () => void;
-    onSubmit: (data: T) => void;
-}
-declare const FormDialog: <T>({ open, title, loading, disabled, submitText, cancelText, children, onSubmit, onCancel, }: FormDialogProps<T>) => JSX.Element;
-
-declare const BootstrapDialog: ({ open, title, component, componentProps, disabled, disableAccept, disableCancel, actions, children, loading, cancelable, callCloseWhenCancel, acceptable, acceptText, cancelText, onAccept, onCancel, onClose, acceptType, }: BootstrapDialogDialogProps) => JSX.Element;
-
-declare const useDialog: (intialOpen?: boolean) => {
-    isOpen: boolean;
-    open: () => void;
-    close: () => void;
-    setIsOpen: React$1.Dispatch<React$1.SetStateAction<boolean>>;
-};
-
-declare const newArrayWithSize: <T>(size: number, fillValue: T) => any;
-declare const getRandomItem: <T>(items: T[]) => {
-    index: number;
-    item: T;
-};
-
-declare const useGetDefaultThemeColor: ({ lightWeight, darkWeight, }?: {
-    lightWeight?: keyof Color | undefined;
-    darkWeight?: keyof Color | undefined;
-}) => string;
-
-interface Breakpoints$1 {
-    xs: number;
-    sm: number;
-    md: number;
-    lg: number;
-    xl: number;
-}
-interface BreakpointsCounter extends Breakpoints$1 {
-    increment(breakpoints: Partial<Breakpoints$1>): ResponsiveStyleValue<boolean>;
-}
-declare const newBreakpointsCounter: (breakpoint?: number) => BreakpointsCounter;
-
-declare const getFormData: <T>(e: FormEvent<HTMLFormElement>) => T;
-
-interface DrawerLayoutProps {
-    drawerProviderProps?: DrawerProviderProps;
-    children: [DrawerElement, DrawerAppBarElement, ReactNode];
-}
-declare const DrawerLayout: ({ drawerProviderProps, children: childrenProps, }: DrawerLayoutProps) => JSX.Element;
-
-interface HeaderLayoutError {
-    icon?: PlaceholderIcon;
-    title?: string;
-    message: string;
-}
-interface HeaderLayoutProps {
-    loading?: boolean;
-    fetching?: boolean;
-    error?: HeaderLayoutError;
-    children: [HeaderElement, ContentElement];
-}
-declare const HeaderLayout: ({ loading, children, fetching, error }: HeaderLayoutProps) => JSX.Element;
-
-/**
- * MODEL TYPES
- * Types used to specify the model
- */
-type ModelFieldTypes = "string" | "number" | "string[]" | "number[]" | "boolean" | "enum" | "multienum" | "date" | "time" | "datetime";
-type Base = {
-    id: string;
-    description: string;
-    name: string;
-    listable?: boolean;
-    updatable?: boolean;
-    required?: boolean;
-};
-type Breakpoints = {
-    xs?: number;
-    sm?: number;
-    md?: number;
-    lg?: number;
-    xl?: number;
-};
-type StringField = {
-    type: "string";
-};
-type StringArrayField = {
-    type: "string[]";
-};
-type NumberField = {
-    type: "number";
-};
-type NumberArrayField = {
-    type: "number[]";
-};
-type BooleanField = {
-    type: "boolean";
-};
-type EnumField = {
-    type: "enum";
-    value: string[];
-};
-type MultiEnumField = {
-    type: "multienum";
-    value: string[];
-};
-type DateField = {
-    type: "date";
-    format: string;
-    default: Date;
-};
-type TimeField = {
-    type: "time";
-    format: string;
-    default: Date;
-};
-type DatetimeField = {
-    type: "datetime";
-    format: string;
-    default: Date;
-};
-type SingleFields = StringField | NumberField | StringArrayField | NumberArrayField | BooleanField | EnumField | MultiEnumField | DateField | TimeField | DatetimeField;
-type GroupField = {
-    type: "group";
-    value: (Base & Breakpoints & SingleFields)[];
-} & Base;
-type ArrayGroupField = {
-    type: "group[]";
-    value: (Base & Breakpoints & SingleFields)[];
-} & Base;
-type Fields = SingleFields | GroupField | ArrayGroupField;
-type ModelField = Base & Breakpoints & Fields;
-type Model = {
-    fields: ModelField[];
-};
-/**
- * INSTANCE TYPES
- * Types used to represent an instance of a model specification
- */
-type BaseFieldType = string | number | boolean | Date;
-type ArrayFieldType = string[] | number[];
-type SingleFieldType = BaseFieldType | ArrayFieldType;
-type GroupInstanceType = {
-    [key: string]: SingleFieldType;
-};
-type ArrayInstanceType = {
-    [key: string]: SingleFieldType;
-}[];
-type FieldType = SingleFieldType | GroupInstanceType;
-interface BasicModelInstance {
-    id: string;
-    [key: string]: FieldType;
-}
-declare const newInstanceFromValuesOrZeroValue: <T extends BasicModelInstance>(model: Model, values?: T | undefined) => T;
-
-interface ObjectDetailsProps<T extends BasicModelInstance> {
-    model: Model;
-    dense?: boolean;
-    instance: T;
-}
-declare const ObjectDetails: <T extends BasicModelInstance>({ model, instance, dense, }: ObjectDetailsProps<T>) => JSX.Element;
-
-interface RequestState {
-    idle?: boolean;
-    loading?: boolean;
-    error?: string;
-    success?: boolean;
-}
-declare const IdleRequest: RequestState;
-declare const LoadingRequest: RequestState;
-declare const SuccessRequest: RequestState;
-
-interface BaseScreenProps {
-    /**
-     * UI-friendly string that represents the model
-     */
-    modelName: string;
-    /**
-     * Structure that represents the fields of the model
-     */
-    model: Model;
-    /**
-     * Path to attach before each internal ModelRouter path
-     */
-    basePath?: string;
-    /**
-     * If true delete features are enabled
-     */
-    deleteFeature?: boolean;
-    /**
-     * If true update features are enabled
-     */
-    updateFeature?: boolean;
-    /**
-     * If true add features are enabled
-     */
-    addFeature?: boolean;
-    /**
-     * If true details features are enabled
-     */
-    detailsFeature?: boolean;
-}
-
-interface UpdateScreenProps<T extends BasicModelInstance> extends BaseScreenProps {
-    /**
-     * Callback executed when the user wants to update
-     * an item
-     */
-    onSubmitUpdateItem: (obj: T) => void;
-    /**
-     * Current status of the request to update an item
-     */
-    submitUpdateItemRequest: RequestState;
-    /**
-     * Current status of the request to retrieve
-     * the item to be updated
-     */
-    updateItemRequest: RequestState;
-    /**
-     * Callback executed to retrive the item that
-     * has to going tobe updated
-     */
-    onRequestUpdateItem: (id: string) => void;
-    /**
-     * Item that is going to be updated
-     */
-    updateItem?: T;
-}
-
-interface ListScreenProps<T extends BasicModelInstance> extends BaseScreenProps {
-    /**
-     * Callback executed each time the list screen
-     * requests for a data update
-     */
-    onRequestList: () => void;
-    /**
-     * List of items to be displayed in the list screen
-     */
-    listData: T[];
-    /**
-     * Callback executed when the user clicks an option
-     * to delete an item
-     */
-    onClickDeleteItem: (item: T) => void;
-    /**
-     * Current status of the request to retrieve
-     * the list items
-     */
-    listRequest: RequestState;
-    /**
-     * Current status of the request to delete
-     * an item
-     */
-    deleteRequest: RequestState;
-}
-
-interface AddScreenProps<T extends BasicModelInstance> extends BaseScreenProps {
-    /**
-     * Callback executed when the user wants to
-     * add a new item
-     */
-    onSubmitNewItem: (obj: T) => void;
-    /**
-     * Current status of the request to retrieve
-     * add a new item
-     */
-    newItemRequest: RequestState;
-}
-
-interface DetailsScreenProps<T extends BasicModelInstance> extends BaseScreenProps {
-    /**
-     * Callback executed each time we want
-     * the details information of an item
-     */
-    onRequestItem: (id: string) => void;
-    /**
-     * Current status of the request to retrieve
-     * an item
-     */
-    itemRequest: RequestState;
-    /**
-     * Item to be displayed
-     */
-    detailsItem?: T;
-}
-
-type ModelRouterProps<T extends BasicModelInstance> = DetailsScreenProps<T> & ListScreenProps<T> & AddScreenProps<T> & UpdateScreenProps<T>;
-declare const ModelRouter: <T extends BasicModelInstance>(props: ModelRouterProps<T>) => JSX.Element;
-
-interface ModelFormProps<T extends BasicModelInstance> {
-    model: Model;
-    dense?: boolean;
-    initialValues?: T;
-    saveButtonText: string;
-    onSubmit: (values: T) => void;
-}
-declare const ModelForm: <T extends BasicModelInstance>({ model, saveButtonText, dense, onSubmit, initialValues, }: ModelFormProps<T>) => JSX.Element;
-
-interface TableRowOption<T extends BasicModelInstance> {
-    id: string;
-    label: string;
-    onClick: (item: T) => void;
-}
-interface TableListProps<T extends BasicModelInstance> {
-    columns: HeadCell<T>[];
-    data: T[];
-    search?: boolean;
-    defaultSort: string;
-    defaultOrder?: Order;
-    loading?: boolean;
-    options?: TableRowOption<T>[];
-    onClick?: (d: T) => void;
-}
-declare const TableList: <T extends BasicModelInstance>({ columns: columnsProp, options, data, onClick, search, defaultSort, defaultOrder, loading, }: TableListProps<T>) => JSX.Element;
-
-type NotificationCenterProviderProps = PropsWithChildren<{
-    autoHideDuration?: number;
-}>;
-declare const NotificationCenterProvider: ({ children, autoHideDuration, }: NotificationCenterProviderProps) => JSX.Element;
-
-declare const NotificationCenterProviderUndefinedError: Error;
-interface Notification {
-    severity: AlertColor;
-    title?: string;
-    message: string;
-}
-interface NotificationCenterProps {
-    show(notification: Notification): void;
-    hide(): void;
-}
-declare const NotificationCenterContext: React__default.Context<NotificationCenterProps | undefined>;
-declare const useNotificationCenter: () => NotificationCenterProps;
-
-interface NotifyWhenValueChangesOptions<T> {
-    from: T;
-    to: T;
-}
-declare const useNotifyWhenValueChanges: <T>(notification: Notification, value: T | undefined, { from, to }: NotifyWhenValueChangesOptions<T>) => void;
-
-declare const TabContext: React$1.Context<[number, Dispatch<SetStateAction<number>>]>;
-declare const TabContextProvider: React$1.Provider<[number, Dispatch<SetStateAction<number>>]>;
-declare const useTab: () => [number, Dispatch<SetStateAction<number>>];
-
-type TabProviderProps = PropsWithChildren<{
-    initialValue?: number;
-}>;
-declare const TabProvider: ({ children, initialValue }: TabProviderProps) => JSX.Element;
-
-export { Action, ActionHeader, ActionHeaderProps, ActionProps, ActionVariant$1 as ActionVariant, ArrayFieldType, ArrayGroupField, ArrayInstanceType, Autocomplete, AutocompleteProps, BaseFieldType, BaseValueProps, BasicModelInstance, Board, BoardProps, BootstrapDialog, BootstrapDialogDialogProps, Bullet, BulletProps, BulletVariant, CenterContainer, CenterContainerProps, ConfirmDialog, ConfirmDialogProps, Content, ContentComponent, ContentElement, ContentPlaceholder, ContentPlaceholderProps, ContentProps, DateRangeCalendar, DateRangeCalendarProps, DateRangePicker, DateRangePickerProps, DefaultPlaceholder, DialogAction, Drawer, DrawerAppBar, DrawerAppBarComponent, DrawerAppBarElement, DrawerAppBarProps, DrawerComponent, DrawerContent, DrawerContentComponent, DrawerContentElement, DrawerContentProps, DrawerContext, DrawerContextProps, DrawerElement, DrawerHeader, DrawerItemAvatar, DrawerItemBullet, DrawerItemLabel, DrawerLayout, DrawerLayoutProps, DrawerMain, DrawerMainProps, DrawerNavigation, DrawerNavigationItem, DrawerNavigationItemCollapsable, DrawerNavigationItemLink, DrawerNavigationSection, DrawerProps, DrawerProvider, DrawerProviderProps, DrawerSection, DrawerSectionProps, DrawerSize, DrawerState, DrawerSubheader, DrawerSubheaderProps, DrawerVariant, EditInputType, EditableValueProps, EnhancedRemoteTable, EnhancedRemoteTableProps, EnhancedTable, EnhancedTableHead, ExpandableAlert, ExpandableAlertProps, FieldType, FormDialog, FormDialogProps, GroupField, GroupInstanceType, GroupValueCard, GroupValueCardProps, HeadCell, Header, HeaderAction, HeaderActionVariant, HeaderBreadcrumb, HeaderComponent, HeaderElement, HeaderLayout, HeaderLayoutError, HeaderLayoutProps, HeaderNavigationButton, HeaderPreset, HeaderProps, HeaderSubtitle, HeaderSubtitleProps, HeaderTab, HeaderTitle, HeaderTitleProps, IdleRequest, Label, LabelProps, LabelVariant, ListPanel, ListPanelContext, ListPanelContextProvider, ListPanelItem, ListPanelProps, LoadingArea, LoadingRequest, LoremIpsumPlaceholder, LoremIpsumPlaceholderProps, Markdown, MarkdownProps, Model, ModelField, ModelFieldTypes, ModelForm, ModelFormProps, ModelRouter, ModelRouterProps, Notification, NotificationCenterContext, NotificationCenterProps, NotificationCenterProvider, NotificationCenterProviderProps, NotificationCenterProviderUndefinedError, NotifyWhenValueChangesOptions, ObjectDetails, ObjectDetailsProps, Order, Placeholder, PlaceholderAction, PlaceholderIcon, PlaceholderIconArgs, PlaceholderProps, QueryContainer, QueryContainerError, QueryContainerProps, QueryContainerSuccess, RequestState, Select, SelectProps, SelectSize, SignIn, SignInProps, SingleFieldType, SkeletonCard, SkeletonCardProps, SkeletonGrid, SkeletonGridProps, SuccessRequest, TabCard, TabCardPanel, TabCardPanelProps, TabCardProps, TabContext, TabContextProvider, TabData, TabPanel, TabProvider, TableList, TableListProps, TableRowOption, TextField, TextFieldProps, UndefinedProvider, ValueBoolean, ValueBooleanProps, ValueCard, ValueCardProps, ValueDatetime, ValueDatetimeProps, ValueEditButton, ValueEditButtonProps, ValueEditButtons, ValueEditButtonsProps, ValueItem, ValueItemComponent, ValueItemElement, ValueItemProps, ValueLabel, ValueLabelProps, ValueRating, ValueRatingProps, ValueText, ValueTextProps, bulletClasses, getDrawerItemColors, getFormData, getRandomItem, labelClasses, markdownDefaultOptions, newArrayWithSize, newBreakpointsCounter, newInstanceFromValuesOrZeroValue, useDialog, useDrawer, useEditableValueDisplay, useGetDefaultThemeColor, useListPanel, useNotificationCenter, useNotifyWhenValueChanges, useTab, valueItemClasses };