declare module "css/themes" {
    export const blur: {
        [key in string]: string;
    };
    export const dark: {
        [key in string]: string;
    };
    export const light: {
        [key in string]: string;
    };
}
declare module "lib/SupportedThemes" {
    export const enum SupportedThemes {
        light = 0,
        gray = 1,
        dark = 2,
        blur = 3,
        auto = 4,
        autoDark = 5,
        autoLight = 6
    }
}
declare module "types/actions" {
    export type ButtonActions = {
        title: string;
        action: () => void;
    };
    export const enum ButtonStyle {
        Inline = "inline",
        Normal = "normal",
        Secondary = "secondary",
        Spinner = "spinner",
        Progress = "progress"
    }
}
declare module "types/RenderingX" {
    /**
     * @deprecated Please use Component
     */
    export interface RenderElement {
        draw: () => HTMLElement;
    }
    export type Component = HTMLElement | RenderElement;
}
declare module "types/card" {
    export const enum CardTypes {
        Default = 0,
        Modern = 1,
        Note = 2,
        Rich = 3,
        Headless = 4
    }
    export type CommonCard = {
        draw: (preCard: HTMLElement) => HTMLElement;
        getSize: () => {
            width?: number;
            height?: number;
        };
    };
}
declare module "types/html" {
    export type HTMLStringy = HTMLElement | string;
}
declare module "types/ViewOptions" {
    import { Component } from "types/RenderingX";
    export type ViewOptions<State> = {
        use: (comp: Component) => void;
        state: Partial<State>;
        update: (data: Partial<State>) => void;
    };
    export type ViewOptionsFunc<State> = (opt: ViewOptions<State>) => void;
}
declare module "types/index" {
    export * from "types/actions";
    export * from "types/RenderingX";
    export * from "types/card";
    export * from "types/html";
    export * from "types/ViewOptions";
}
declare module "components/generic/Icon" {
    import { Component } from "types/index";
    export const Icon: (icon: string, ...classList: string[]) => Component;
    export const enum CommonIconType {
        ArrowDown = 0,
        Done = 1,
        Close = 2,
        Download = 3,
        Edit = 4,
        Delete = 5
    }
    export const CommonIcon: (icon: CommonIconType) => string;
}
declare module "components/Helper" {
    import { Component } from "types/index";
    export const conditionalCSSClass: (element: HTMLElement, condition: boolean | undefined, className: string) => void;
    export const nullish: (...components: (Component | null | undefined)[]) => Component[];
}
declare module "components/Components" {
    import { Component } from "types/index";
    export const createElement: (type: string) => HTMLElement;
    export function draw(component: Component): HTMLElement;
    export function action(element: HTMLElement, type: string, value: unknown): void;
    export const span: (message: undefined | string | HTMLElement, ...classList: string[]) => HTMLElement;
    export const img: (source: string | undefined, ...classList: string[]) => HTMLImageElement;
    export function custom(type: string, message: undefined | string | HTMLElement, ...classList: string[]): HTMLElement;
    /**
     * #Actions
     *  @value (list)
     * @deprecated Please use Vertical()
     */
    export function list(options: {
        margin?: boolean;
        style?: "none" | "default";
        noHeigthLimit?: boolean;
    }, ...listRaw: {
        left: Component | string;
        right?: Component | string;
        click?: () => void;
        actions?: {
            type: Component;
            click: () => void;
        }[];
    }[]): HTMLElement;
}
declare module "lib/Color" {
    export const enum Color {
        Disabled = "disabled",
        Grayscaled = "grayscaled",
        Colored = "colored",
        Critical = "critical"
    }
}
declare module "types/Colors" {
    import { Color } from "lib/Color";
    export type ColorDef = {
        [color in Color]: [hue: number, saturation: number, lightness: number, font: string];
    };
}
declare module "lib/Style" {
    import { SupportedThemes } from "lib/SupportedThemes";
    import { WebGenOptions } from "webgen";
    import { ColorDef } from "types/Colors";
    export class Style {
        private theme;
        private current;
        private mediaQuery;
        private options;
        constructor(options: WebGenOptions);
        setImage(src: String): void;
        clearImage(): void;
        getTheme: () => SupportedThemes;
        getColors: () => ColorDef;
        overrideTheme(data: {
            [key in string]: string;
        }): void;
        private mapColorDef;
        private applyStyles;
        updateTheme(theme: SupportedThemes): void;
        private getMapping;
    }
}
declare module "lib/icons/none" {
    export class Icons {
    }
}
declare module "components/cards/searchCard" {
    import { CommonCard } from "types/card";
    import '../../css/search.webgen.static.css';
    export type SearchEntry = {
        name: string;
        icon?: string;
        tags?: string[];
        category?: string;
        suffix?: string;
        id: string;
    };
    export const enum SearchMode {
        ShowBegin = 0,
        HideBegin = 1,
        HideWhenEmpty = 2
    }
    export const searchCard: (settings: {
        type: "smart" | "default";
        maxWidth?: string | "default";
        mode?: SearchMode;
        placeholder?: string;
        notfound?: string;
        icons?: {
            edit: string;
            close: string;
            remove: string;
            download: string;
        };
        actions?: {
            close?: () => void;
            click?: (arg: SearchEntry) => void;
            download?: (arg: SearchEntry) => void;
            edit?: (arg: SearchEntry) => void;
            remove?: (arg: SearchEntry) => void;
        };
        index: SearchEntry[];
        width?: number;
    }) => CommonCard;
}
declare module "components/cards/defaultCard" {
    import { CommonCard } from "types/card";
    import { HTMLStringy } from "types/html";
    import '../../css/cards.lline.webgen.static.css';
    export const defaultCard: (options: {
        title: HTMLStringy;
        subtitle?: string;
        small?: boolean;
        width?: number;
        height?: number;
    }) => CommonCard;
}
declare module "components/cards/headlessCard" {
    import { CommonCard } from "types/index";
    export const headless: (element: HTMLElement) => CommonCard;
}
declare module "components/generic/Input" {
    import { Color } from "lib/Color";
    import { Component } from "types/index";
    import '../../css/input.webgen.static.css';
    export const Input: ({ color, value, changeOn, blurOn, placeholder, type, autoFocus }: {
        type?: "text" | "email" | "password" | "url";
        color?: Color;
        placeholder: string;
        value?: string;
        autoFocus?: boolean;
        blurOn?: (value: string) => void;
        changeOn?: (value: string) => void;
    }) => Component;
}
declare module "components/generic/Stacks" {
    import { CommonCard, Component } from "types/index";
    import '../../css/stack.webgen.static.css';
    export type StackOpts = {
        gap?: string;
        classes?: string[];
        align?: 'center' | 'flex-start' | 'flex-end' | 'space-between' | 'space-evenly' | 'space-around';
        margin?: string;
    };
    export const Horizontal: (opts: StackOpts, ...components: Component[]) => Component;
    export const Vertical: (opts: StackOpts, ...components: Component[]) => Component;
    export const Grid: ({ minColumnWidth, maxWidth, gap }: {
        minColumnWidth?: number;
        maxWidth?: string;
        gap?: number;
    }, ...cardArray: CommonCard[]) => Component;
}
declare module "components/light-components/loadingWheel" {
    export const loadingWheel: () => SVGSVGElement;
}
declare module "lib/Accessibility" {
    import { Color } from "lib/Color";
    export const accessibilityButton: (button: HTMLElement) => (ev: KeyboardEvent) => any;
    export const accessibilityDisableTabOnDisabled: (color: Color | undefined) => number;
}
declare module "components/generic/Button" {
    import { Color } from "lib/Color";
    import { ButtonStyle, Component } from "types/index";
    import '../../css/buttons.webgen.static.css';
    export type ButtonAction = {
        setProgress: (progress: number) => void;
        setEnabled: (enable: boolean) => void;
        changeState: (state: ButtonStyle) => void;
    };
    export const Button: ({ state, text, pressOn, progress, color, href, dropdown, selectedOn, arrowDownIcon }: {
        state?: ButtonStyle;
        color?: Color;
        progress?: number;
        href?: string;
        dropdown?: ([displayName: string, action: () => void])[];
        text: string;
        pressOn?: (e: ButtonAction) => void;
        selectedOn?: () => void;
        arrowDownIcon?: string;
    }) => Component;
}
declare module "components/cards/richCard" {
    import { ButtonStyle } from "types/actions";
    import { CommonCard } from "types/card";
    import { HTMLStringy } from "types/html";
    import '../../css/cards.rich.webgen.static.css';
    import { Color } from "lib/Color";
    export const richCard: (options: {
        title: HTMLStringy;
        content: (HTMLStringy)[] | (HTMLStringy);
        buttonListLeftArea?: HTMLElement;
        buttons?: {
            title: string;
            action: (() => void) | (() => Promise<void>);
            variant?: ButtonStyle;
            color?: Color;
        }[];
        width?: number;
        height?: number;
    }) => CommonCard;
}
declare module "components/cards/loginCard" {
    export const loginCard: ({ titleText, email, url, button, password, makeLogin, errorMessage }: {
        titleText?: string;
        email?: {
            text: string;
            default?: string;
        };
        url?: {
            text: string;
            default?: string;
        };
        button?: string;
        password?: {
            text: string;
            default?: string;
        };
        errorMessage?: string;
        makeLogin: (loginData: {
            password: string;
            email?: string;
            url?: string;
        }) => Promise<boolean>;
    }) => import("types").CommonCard;
}
declare module "components/cards/modernCard" {
    import { CommonCard } from "types/index";
    import { HTMLStringy } from "types/html";
    import '../../css/cards.modern.webgen.static.css';
    export const modernCard: (options: {
        title: HTMLStringy;
        subtitle?: string;
        description?: HTMLStringy;
        align?: "right" | "left" | "down";
        icon?: string | {
            svg: string;
        };
        width?: number;
        height?: number;
    }) => CommonCard;
}
declare module "components/cards/noteCard" {
    import { CommonCard } from "types/card";
    import { HTMLStringy } from "types/html";
    import '../../css/cards.note.webgen.static.css';
    export const noteCard: (options: {
        title: HTMLStringy;
        icon: string;
        width?: number;
        height?: number;
    }) => CommonCard;
}
declare module "components/generic/Title" {
    import { RenderElement } from "types/index";
    export const Title: (settings: {
        title: string;
        subtitle?: string;
        img?: string;
        type: "small" | "big";
    }) => RenderElement;
}
declare module "components/generic/Tab" {
    import { Color } from "lib/Color";
    import { Component } from "types/index";
    import '../../css/tab.webgen.static.css';
    export const Tab: ({ color, selectedIndex, selectedOn }: {
        color?: Color;
        selectedIndex?: number;
        selectedOn?: (index: number) => void;
    }, ...dropdown: ([displayName: string, action: () => void])[]) => Component;
}
declare module "components/generic/Checkbox" {
    import { Color } from "lib/Color";
    import { Component } from "types/index";
    import '../../css/checkbox.webgen.static.css';
    export const Checkbox: ({ color, selected, toggledOn, icon }: {
        color?: Color;
        selected?: boolean;
        toggledOn?: (value: boolean) => void;
        icon?: string;
    }) => Component;
}
declare module "components/generic/IconButton" {
    import { Color } from "lib/Color";
    import { Component } from "types/index";
    import '../../css/iconbutton.webgen.static.css';
    import { CommonIconType } from "components/generic/Icon";
    export const IconButton: ({ color, icon, clickOn }: {
        color?: Color;
        icon: CommonIconType | string;
        clickOn?: () => void;
    }) => Component;
}
declare module "components/generic/Custom" {
    import { RenderElement } from "types/index";
    export const Custom: (text: HTMLElement) => RenderElement;
}
declare module "components/generic/Card" {
    import { Component } from "types/index";
    export const Card: (compoent: Component) => Component;
}
declare module "components/generic/PageTitle" {
    import { RenderElement } from "types/index";
    export const PageTitle: (text: string) => RenderElement;
}
declare module "lib/icons/BootstrapIcons" {
    import 'bootstrap-icons/font/bootstrap-icons.css';
    import { Icons } from "lib/icons/none";
    export class BootstrapIcons extends Icons {
        constructor();
    }
}
declare module "lib/icons/MaterialIcons" {
    import 'material-icons/iconfont/round.css';
    import { Icons } from "lib/icons/none";
    export class MaterialIcons extends Icons {
        constructor();
    }
}
declare module "lib/RenderingX" {
    import '../css/cards.webgen.static.css';
    import '../css/dialog.webgen.static.css';
    export class RenderingX {
        private staticNotify;
        constructor();
        notify(test: string, keepOpenUntilDone?: () => Promise<undefined>): void;
    }
}
declare module "lib/View" {
    import '../css/cards.webgen.static.css';
    import { ViewOptions, ViewOptionsFunc } from "types/ViewOptions";
    export type ViewData = {
        setMaxWidth: (maxWidth: string) => ViewData;
        addClass: (...classes: string[]) => ViewData;
        enableCenterFromMiddle: () => ViewData;
        appendOn: (component: HTMLElement) => ViewData;
        unsafeViewOptions: <StateType>() => ViewOptions<StateType>;
    };
    export function View<State>(render: ViewOptionsFunc<State>): ViewData;
}
declare module "lib/Dialog" {
    import '../css/dialog.webgen.static.css';
    import { ButtonStyle } from "types/index";
    import { ViewOptions, ViewOptionsFunc } from "types/ViewOptions";
    import { Color } from "lib/Color";
    type DialogeFinal = void | undefined | 'close' | 'remove';
    type DialogButtonAction = ((() => DialogeFinal) | (() => Promise<DialogeFinal>) | 'close' | 'remove');
    export type DialogButton = {
        label: string;
        action: DialogButtonAction;
        color: Color;
        state?: ButtonStyle.Inline | ButtonStyle.Normal | ButtonStyle.Secondary;
    };
    export type DialogData = {
        addButton: (label: string, action: DialogButtonAction, style?: DialogButton["color"], state?: DialogButton["state"]) => DialogData;
        setTitle: (text: string) => DialogData;
        allowUserClose: () => DialogData;
        addClass: (...classes: string[]) => DialogData;
        onClose: (action: () => void) => DialogData;
        close: () => DialogData;
        open: () => DialogData;
        remove: () => void;
        unsafeViewOptions: <TypeT>() => ViewOptions<TypeT>;
    };
    export function Dialog<State>(render: ViewOptionsFunc<State>): DialogData;
}
declare module "webgen" {
    import { Style } from "lib/Style";
    import { SupportedThemes } from "lib/SupportedThemes";
    export { SupportedThemes } from "lib/SupportedThemes";
    import './css/webgen.static.css';
    import './css/elements.css';
    import './css/grouping.css';
    import './css/master.css';
    import './css/modern.css';
    import { ColorDef } from "types/Colors";
    import { Icons } from "lib/icons/none";
    export * from "components/Components";
    export * from "components/Helper";
    export * from "components/cards/searchCard";
    export * from "components/cards/defaultCard";
    export * from "components/cards/headlessCard";
    export * from "components/cards/loginCard";
    export * from "components/cards/modernCard";
    export * from "components/cards/noteCard";
    export * from "components/cards/richCard";
    export * from "components/cards/searchCard";
    export * from "components/generic/Title";
    export * from "components/generic/Tab";
    export * from "components/generic/Checkbox";
    export * from "components/generic/Input";
    export * from "components/generic/Icon";
    export * from "components/generic/IconButton";
    export * from "components/generic/Custom";
    export * from "components/generic/Card";
    export * from "components/generic/Stacks";
    export * from "components/generic/PageTitle";
    export * from "components/generic/Button";
    export * from "components/light-components/loadingWheel";
    export * from "types/index";
    export * from "lib/icons/BootstrapIcons";
    export * from "lib/icons/MaterialIcons";
    export * from "lib/RenderingX";
    export * from "lib/View";
    export * from "lib/Dialog";
    export * from "lib/Color";
    export type WebGenOptions = {
        autoLoadFonts?: boolean;
        updateThemeOnInit?: false;
        colors?: ColorDef;
        icon?: Icons;
        events?: {
            "themeChanged"?: (data: SupportedThemes, options: Style) => void;
            "themeRefreshed"?: (data: SupportedThemes, options: Style) => void;
        };
        theme?: SupportedThemes;
        defaultElementToHookStylesIn?: HTMLElement;
    };
    export const WebGen: (options?: WebGenOptions) => {
        theme: Style;
    };
}