/// <reference types="react" />
import React, { FC, MouseEventHandler } from 'react';
import { AppearanceTypes } from 'react-toast-notifications';

interface sidebarProps {
}
declare const Sidebar: ({}: sidebarProps) => JSX.Element;

interface SideBarItemProps {
    index: any;
    icon: any;
    title: string;
    route: string;
    showTitle: boolean;
}
declare const SidebarItem: ({ index, icon, title, route, showTitle }: SideBarItemProps) => JSX.Element;

interface ContentProps {
    children: JSX.Element[] | JSX.Element;
    hideSideBar?: boolean;
    fullDisplay?: boolean;
}
declare const Base: ({ children, hideSideBar, fullDisplay }: ContentProps) => JSX.Element;

declare const Navbar: () => JSX.Element;

declare type BulletProps = {
    value: number;
    target: number;
    caption: string;
};
declare const Bullet: FC<BulletProps>;

declare type GaugeDatasource = {
    chart: {
        lowerLimit: number;
        upperLimit: number;
        numberSuffix: string;
    };
    colorRange: {
        color: Array<colorSection>;
    };
    dials: {
        dial: [
            {
                value: number;
            }
        ];
    };
};
declare type colorSection = {
    minValue: string;
    maxValue: string;
    code: string;
};

declare type GaugeProps = {
    data?: GaugeDatasource;
    type?: string;
    value: number;
    caption?: string;
};
declare const Gauge: FC<GaugeProps>;

declare type PieChartProps = {
    data: {
        Fat: number;
        HC: number;
        Prot: number;
    };
    caption: string;
};
declare const PieChart: FC<PieChartProps>;

declare const GroupChart: FC<PieChartProps>;

declare type OverlapingBarsProps = {
    data: Array<{
        recomended: number | String;
        value: number | String;
    }>;
};
declare const OverlapingBars: FC<OverlapingBarsProps>;

declare type ModalProps = {
    title?: string;
    children: JSX.Element;
    show: boolean | undefined;
    backbutton?: JSX.Element | undefined;
    onHide?: React.MouseEventHandler<HTMLButtonElement>;
};
declare const BaseModal: FC<ModalProps>;

declare type DeleteAlertProps = {
    onClose: React.MouseEventHandler<HTMLButtonElement> | undefined;
    onConfirm: React.MouseEventHandler<HTMLButtonElement> | undefined;
};
declare const DeleteAlert: FC<DeleteAlertProps>;

declare type FormInputs = {
    header: string;
    [name: string]: string | {
        type: "text" | "number" | "date" | "email" | "select" | "checkbox" | "radio";
        value: string;
        options?: Array<string>;
        id: string;
    };
};

declare type ModalFormProps = {
    image?: Boolean;
    title?: string;
    sectionData?: FormInputs;
    formData?: FormInputs[];
    formDataIndex?: number;
    errors: any;
    handleOnChange?: React.Dispatch<React.SetStateAction<FormInputs[]>>;
    onAccept?: MouseEventHandler<HTMLButtonElement> | undefined;
};
declare const ModalForm: FC<ModalFormProps>;

declare type ModalIntakesProps = {
    onAccept?: MouseEventHandler<HTMLButtonElement> | undefined;
};
declare const ModalIntakes: FC<ModalIntakesProps>;

interface TableProps {
    header: Array<string | JSX.Element>;
    Tablekey?: number;
    children: Array<JSX.Element> | JSX.Element | void;
    buttons?: boolean;
    type: "form" | "list";
}
declare const Table: FC<TableProps>;

declare type FormData = {
    options: string[];
    [name: string]: string[] | string;
};

interface TableFormItemProps extends React.HTMLAttributes<HTMLTableRowElement> {
    buttons?: Array<JSX.Element>;
    options?: Array<string> | string;
    inputs?: Array<JSX.Element>;
    sectionData?: FormData;
    formData?: FormData[];
    formDataIndex?: number;
    pinned?: boolean;
    disable?: boolean;
    handleOnChange?: React.Dispatch<React.SetStateAction<FormData[]>>;
}
declare const TableFormItem: FC<TableFormItemProps>;

interface TableListItemProps extends React.HTMLAttributes<HTMLTableRowElement> {
    data: Array<string>;
    buttons?: Array<JSX.Element>;
    selectable?: boolean;
    index?: any;
    disable?: boolean;
    checked?: boolean;
}
declare const TableItem: FC<TableListItemProps>;

interface SectionProps {
    title?: string;
    subtitle?: string;
    description?: string;
    codeExample?: string;
    componentExample?: JSX.Element;
    id?: string;
}
declare const Section: ({ title, subtitle, description, codeExample, componentExample, id }: SectionProps) => JSX.Element;

interface ActionProps {
    content: String;
    variant: AppearanceTypes | undefined;
}
declare const Action: FC<ActionProps>;

declare type AvatarProps = {
    id: string;
    name?: string;
    value: string;
    onChange?: (base64: string) => void;
};
declare const Avatar: FC<AvatarProps>;

interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
    disabled?: boolean;
    label?: string;
    variant?: "delete" | "edit" | "add" | "info" | "view" | "config" | "search" | "file" | "secondary" | "secondary-mini" | "primary-mini";
    buttonClass?: string;
    onClick?: any;
}
declare const Button: FC<ButtonProps>;

interface CheckBoxProps {
    disable?: boolean;
    checked: boolean;
    index: any;
    handleCheck?: any;
}
declare const CheckBox: ({ disable, checked, index, handleCheck }: CheckBoxProps) => JSX.Element;

declare type HeaderProps = {
    title?: string;
    buttons?: Array<JSX.Element>;
    search?: boolean;
    onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined;
    onChange?: React.ChangeEventHandler<HTMLInputElement> | undefined;
};
declare const Header: FC<HeaderProps>;

interface ItemNavbarDropdownProps {
    onChange?: (event: React.MouseEvent<HTMLElement>) => void;
    title: string;
}
declare const ItemNavbarDropdown: ({ title, onChange }: ItemNavbarDropdownProps) => JSX.Element;

declare const Login: () => JSX.Element;

interface DropDownProps {
    id: string;
    items: JSX.Element[] | JSX.Element;
    icon?: string;
    label?: string;
}
declare const Dropdown: ({ id, items, icon, label }: DropDownProps) => JSX.Element;

declare const NotificationComplete: FC<ActionProps>;

interface ProgressBarProps {
    label?: String;
    unit?: String;
    current: number;
    target: number;
}
declare const ProgressBarComponent: FC<ProgressBarProps>;

declare type SearchBarProps = {
    onClick?: undefined | React.MouseEventHandler<HTMLButtonElement>;
    onChange?: React.ChangeEventHandler<HTMLInputElement> | undefined;
};
declare const SearchBar: FC<SearchBarProps>;

interface SwitchProps {
    isOn: boolean;
    handleToggle: any;
    disabled?: boolean;
    label?: String;
}
declare const Switch: FC<SwitchProps>;

interface TabType {
    type: "tab" | "select";
    options?: string[];
    view: JSX.Element[];
}
interface TabProp {
    title: string;
    body: TabType;
}
interface TabsProps {
    headerTabs: TabProp[];
}
declare const Tabs: ({ headerTabs }: TabsProps) => JSX.Element;

interface TextFieldProps extends React.InputHTMLAttributes<HTMLInputElement> {
    value?: any;
    label?: string;
    options?: Array<string>;
    onChange?: any;
    inputType?: string;
    keyform?: string;
    error?: string;
    className?: string;
}
declare const TextField: (props: TextFieldProps) => JSX.Element;

declare const UI_Example: () => JSX.Element;

declare type VerticalFormData = {
    type: string;
    [name: string]: string;
};

interface VerticalFormProps {
    items: VerticalFormData[];
    itemIndex: number;
    onChange: (data: VerticalFormData[]) => void;
    sectionData?: VerticalFormData;
}
declare const VerticalForm: FC<VerticalFormProps>;

declare const ErrorPage: () => JSX.Element;

export { Action, Avatar, Base, BaseModal, Bullet, Button, CheckBox, DeleteAlert, Dropdown, ErrorPage, Gauge, GroupChart, Header, ItemNavbarDropdown, Login, ModalForm, ModalIntakes, Navbar as NavBar, NotificationComplete, OverlapingBars, PieChart, ProgressBarComponent, SearchBar, Section, Sidebar, SidebarItem, Switch, Table, TableFormItem, TableItem, Tabs, TextField, UI_Example, VerticalForm };
