import * as React from "react";
import { Menu, SelectOption } from "../types";

export interface GridColumnSuffix {
    suffix? : string;
}

export interface GridColumnProps {
    /** Column property */
    property : string;
    /** Column header title */
    title? : string;
    /** Column header tooltip */
    description? : string;
    readOnly? : boolean|string;
    visible? : boolean;
    menu? : Menu[];
    width? : number|string;
    groupSelect? : boolean|string;
}

export interface NumberColumnProps extends GridColumnProps, GridColumnSuffix {
    min? : number | string;
    max? : number | string;
    step? : number | string;
    decimals? : number;
}

export interface ToggleColumnProps extends GridColumnProps {
    on : string;
    off : string;
}

export interface ButtonColumnProps extends GridColumnProps {
    label : string;
}

export interface StringColumnProps extends GridColumnProps, GridColumnSuffix {
}

export interface ColorColumnProps extends GridColumnProps {
}

export let Option : React.StatelessComponent<SelectOption> = function Option(props : SelectOption) {
    return null;
};

Option.displayName = "Option";

export interface EnumColumnProps extends GridColumnProps {
    children? : any;
}

export namespace Column {

    export let Number : React.StatelessComponent<NumberColumnProps> = function Number(props : NumberColumnProps) {
        return null;
    };
    Number.displayName = "Number";

    export let Toggle : React.StatelessComponent<ToggleColumnProps> = function Toggle(props : ToggleColumnProps) {
        return null;
    };
    Toggle.displayName = "Toggle";

    export let Button : React.StatelessComponent<ButtonColumnProps> = function Button(props : ButtonColumnProps) {
        return null;
    };
    Button.displayName = "Button";

    export let Color : React.StatelessComponent<ColorColumnProps> = function Color(props : ColorColumnProps) {
        return null;
    };
    Color.displayName = "Color";

    export let Enum : React.StatelessComponent<EnumColumnProps> = function Enum(props : EnumColumnProps) {
        return null;
    };
    Enum.displayName = "Enum";

    export let String : React.StatelessComponent<StringColumnProps> = function String(props : StringColumnProps) {
        return null;
    };
    String.displayName = "String";
}

export const NumberColumn : React.StatelessComponent<NumberColumnProps> = Column.Number;
export const ToggleColumn : React.StatelessComponent<ToggleColumnProps> = Column.Toggle;
export const ButtonColumn : React.StatelessComponent<ButtonColumnProps> = Column.Button;
export const ColorColumn : React.StatelessComponent<ColorColumnProps> = Column.Color;
export const EnumColumn : React.StatelessComponent<EnumColumnProps> = Column.Enum;
export const StringColumn : React.StatelessComponent<StringColumnProps> = Column.String;