frontend-hamroun/dist/types.d.ts

A lightweight frontend JavaScript framework with React-like syntax

export interface VNode {
    type: string | Function;
    props: Record<string, any>;
    key?: string | number;
    ref?: any;
}
export interface ComponentProps {
    children?: any;
    key?: string | number;
    ref?: any;
    [key: string]: any;
}
export interface FunctionComponent<P = {}> {
    (props: P): VNode | null;
    displayName?: string;
}
export interface ClassComponent<P = {}, S = {}> {
    new (props: P): Component<P, S>;
}
export type ComponentType<P = {}> = FunctionComponent<P> | ClassComponent<P>;
export interface RefObject<T> {
    current: T;
}
export interface MutableRefObject<T> {
    current: T;
}
export type Ref<T> = RefObject<T> | MutableRefObject<T> | null;
export type Key = string | number;
export interface ReactElement<P = any, T extends string | Function = string | Function> {
    type: T;
    props: P;
    key: Key | null;
    ref: any;
}
export interface HTMLAttributes<T> {
    className?: string;
    id?: string;
    style?: Record<string, string | number>;
    onClick?: (event: MouseEvent) => void;
    onChange?: (event: Event) => void;
    onSubmit?: (event: Event) => void;
    onKeyPress?: (event: KeyboardEvent) => void;
    onKeyDown?: (event: KeyboardEvent) => void;
    onKeyUp?: (event: KeyboardEvent) => void;
    onFocus?: (event: FocusEvent) => void;
    onBlur?: (event: FocusEvent) => void;
    onMouseEnter?: (event: MouseEvent) => void;
    onMouseLeave?: (event: MouseEvent) => void;
    [key: string]: any;
}
export interface InputHTMLAttributes<T> extends HTMLAttributes<T> {
    type?: string;
    value?: string | number;
    placeholder?: string;
    disabled?: boolean;
    required?: boolean;
    checked?: boolean;
    defaultValue?: string | number;
    defaultChecked?: boolean;
    min?: string | number;
    max?: string | number;
    step?: string | number;
    name?: string;
}
export interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
    type?: 'button' | 'submit' | 'reset';
    disabled?: boolean;
    form?: string;
}
export interface SelectHTMLAttributes<T> extends HTMLAttributes<T> {
    value?: string | number;
    disabled?: boolean;
    multiple?: boolean;
    required?: boolean;
    size?: number;
    name?: string;
}
export interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
    value?: string;
    placeholder?: string;
    disabled?: boolean;
    required?: boolean;
    rows?: number;
    cols?: number;
    name?: string;
}
export interface FormHTMLAttributes<T> extends HTMLAttributes<T> {
    action?: string;
    method?: string;
    encType?: string;
    target?: string;
    noValidate?: boolean;
}
export type StateSetter<T> = (value: T | ((prev: T) => T)) => void;
export type StateHook<T> = [T, StateSetter<T>];
export type EffectCallback = () => void | (() => void);
export type DependencyList = ReadonlyArray<any>;
export type MemoFactory<T> = () => T;
export interface Context<T> {
    Provider: ComponentType<{
        value: T;
        children?: any;
    }>;
    Consumer: ComponentType<{
        children: (value: T) => any;
    }>;
    displayName?: string;
}
export interface Component<P = {}, S = {}> {
    props: P;
    state: S;
    setState(partialState: Partial<S>): void;
    render(): VNode | null;
    componentDidMount?(): void;
    componentDidUpdate?(prevProps: P, prevState: S): void;
    componentWillUnmount?(): void;
}
export interface SyntheticEvent<T = Element> {
    currentTarget: T;
    target: EventTarget & T;
    preventDefault(): void;
    stopPropagation(): void;
    nativeEvent: Event;
}
export interface MouseEvent<T = Element> extends SyntheticEvent<T> {
    button: number;
    buttons: number;
    clientX: number;
    clientY: number;
    ctrlKey: boolean;
    metaKey: boolean;
    shiftKey: boolean;
    altKey: boolean;
}
export interface KeyboardEvent<T = Element> extends SyntheticEvent<T> {
    key: string;
    code: string;
    ctrlKey: boolean;
    metaKey: boolean;
    shiftKey: boolean;
    altKey: boolean;
}
export interface FocusEvent<T = Element> extends SyntheticEvent<T> {
    relatedTarget: EventTarget | null;
}
export interface ChangeEvent<T = Element> extends SyntheticEvent<T> {
    target: EventTarget & T;
}
export interface FormEvent<T = Element> extends SyntheticEvent<T> {
}
declare global {
    namespace JSX {
        interface IntrinsicElements {
            div: HTMLAttributes<HTMLDivElement>;
            span: HTMLAttributes<HTMLSpanElement>;
            p: HTMLAttributes<HTMLParagraphElement>;
            h1: HTMLAttributes<HTMLHeadingElement>;
            h2: HTMLAttributes<HTMLHeadingElement>;
            h3: HTMLAttributes<HTMLHeadingElement>;
            h4: HTMLAttributes<HTMLHeadingElement>;
            h5: HTMLAttributes<HTMLHeadingElement>;
            h6: HTMLAttributes<HTMLHeadingElement>;
            a: HTMLAttributes<HTMLAnchorElement> & {
                href?: string;
                target?: string;
            };
            img: HTMLAttributes<HTMLImageElement> & {
                src?: string;
                alt?: string;
                width?: number;
                height?: number;
            };
            input: InputHTMLAttributes<HTMLInputElement>;
            button: ButtonHTMLAttributes<HTMLButtonElement>;
            select: SelectHTMLAttributes<HTMLSelectElement>;
            option: HTMLAttributes<HTMLOptionElement> & {
                value?: string | number;
                selected?: boolean;
            };
            textarea: TextareaHTMLAttributes<HTMLTextAreaElement>;
            form: FormHTMLAttributes<HTMLFormElement>;
            label: HTMLAttributes<HTMLLabelElement> & {
                htmlFor?: string;
            };
            ul: HTMLAttributes<HTMLUListElement>;
            ol: HTMLAttributes<HTMLOListElement>;
            li: HTMLAttributes<HTMLLIElement>;
            table: HTMLAttributes<HTMLTableElement>;
            thead: HTMLAttributes<HTMLTableSectionElement>;
            tbody: HTMLAttributes<HTMLTableSectionElement>;
            tr: HTMLAttributes<HTMLTableRowElement>;
            td: HTMLAttributes<HTMLTableCellElement>;
            th: HTMLAttributes<HTMLTableCellElement>;
            nav: HTMLAttributes<HTMLElement>;
            header: HTMLAttributes<HTMLElement>;
            footer: HTMLAttributes<HTMLElement>;
            main: HTMLAttributes<HTMLElement>;
            section: HTMLAttributes<HTMLElement>;
            article: HTMLAttributes<HTMLElement>;
            aside: HTMLAttributes<HTMLElement>;
            pre: HTMLAttributes<HTMLPreElement>;
            code: HTMLAttributes<HTMLElement>;
            strong: HTMLAttributes<HTMLElement>;
            em: HTMLAttributes<HTMLElement>;
            br: HTMLAttributes<HTMLBRElement>;
            hr: HTMLAttributes<HTMLHRElement>;
            iframe: HTMLAttributes<HTMLIFrameElement> & {
                src?: string;
                width?: number;
                height?: number;
            };
            svg: HTMLAttributes<SVGSVGElement> & {
                viewBox?: string;
                width?: number;
                height?: number;
            };
            path: HTMLAttributes<SVGPathElement> & {
                d?: string;
                fill?: string;
                stroke?: string;
            };
            circle: HTMLAttributes<SVGCircleElement> & {
                cx?: number;
                cy?: number;
                r?: number;
                fill?: string;
                stroke?: string;
            };
            rect: HTMLAttributes<SVGRectElement> & {
                x?: number;
                y?: number;
                width?: number;
                height?: number;
                fill?: string;
                stroke?: string;
            };
        }
        interface Element extends VNode {
        }
        interface ElementClass extends Component {
        }
        interface ElementAttributesProperty {
            props: {};
        }
        interface ElementChildrenAttribute {
            children: {};
        }
    }
}
export declare namespace React {
    type FC<P = {}> = FunctionComponent<P>;
    type ReactNode = any;
    interface MouseEvent<T = Element> extends SyntheticEvent<T> {
        button: number;
        buttons: number;
        clientX: number;
        clientY: number;
        ctrlKey: boolean;
        metaKey: boolean;
        shiftKey: boolean;
        altKey: boolean;
    }
    interface KeyboardEvent<T = Element> extends SyntheticEvent<T> {
        key: string;
        code: string;
        ctrlKey: boolean;
        metaKey: boolean;
        shiftKey: boolean;
        altKey: boolean;
    }
}
//# sourceMappingURL=types.d.ts.map