kea-react/src/selector.d.ts

Componentes comunes de react

/// <reference types="react" />
import React = require("react");
import interfaces = require("./interfaces");
import * as ReactSelect from "react-select";
import { Observable } from "rxjs";
/**Genera un arreglo de numeros consecutivos iniciando en el 0 */
export declare function Rango(count: number): number[];
export declare type SelectorValueNotNull = string | number | boolean | Date;
export declare type SelectorValue = SelectorValueNotNull | undefined | null;
export declare type SelectorLabel = string | number | undefined | null;
/**Un elemento de un selector */
export interface SelectorElement {
    /**Valor del elemento. El indefinido sólo es válido si disabled == true */
    value?: SelectorValue;
    label: SelectorLabel;
    tooltip?: SelectorLabel;
    disabled?: boolean;
    style?: "danger" | "warning" | "success" | "info";
}
/**Propiedades de un selector de botones */
export interface SelectorProps extends interfaces.ControlledValueProps<SelectorValue, SelectorValue>, interfaces.FormFieldDefaultProps {
    /**Elementos del selector*/
    items?: SelectorElement[];
    error?: boolean;
}
export interface AsyncSelectorProps extends interfaces.AsyncControlledValueProps<SelectorValue, SelectorValue>, interfaces.FormFieldDefaultProps {
    /**Elementos del selector*/
    items?: SelectorElement[] | PromiseLike<SelectorElement[]>;
    error?: boolean;
    /**True para colorear de rojo el control si no hay ningun valor seleccionado */
    required?: boolean;
}
/**Componente que muestra un selector con botones */
export declare class ButtonSelector extends React.PureComponent<SelectorProps, {}> {
    private onClick(value);
    render(): JSX.Element;
}
/**Selector simple */
export declare const Select: React.ComponentClass<{
    items?: SelectorElement[] | PromiseLike<SelectorElement[]> | Observable<SelectorElement[] | PromiseLike<SelectorElement[]> | undefined> | undefined;
    error?: boolean | Observable<boolean | undefined> | undefined;
    required?: boolean | Observable<boolean | undefined> | undefined;
    value?: string | number | boolean | Date | PromiseLike<string | number | boolean | Date | null | undefined> | Observable<string | number | boolean | Date | PromiseLike<string | number | boolean | Date | null | undefined> | null | undefined> | null | undefined;
    onChange?: ((newValue: string | number | boolean | Date | null | undefined) => void) | Observable<((newValue: string | number | boolean | Date | null | undefined) => void) | undefined> | undefined;
    isReadOnly?: boolean | Observable<boolean | undefined> | undefined;
    label?: string | JSX.Element | Observable<string | JSX.Element | undefined> | undefined;
}>;
/**Props de un selector múltiple */
export interface MultiSelectProps extends interfaces.ControlledValueProps<SelectorValue[], SelectorValue[]> {
    items?: SelectorElement[] | PromiseLike<SelectorElement[]>;
    label?: JSX.Element | string;
    readonly?: boolean;
}
/**Selector múltiple. El valor seleccionado es un arreglo de los valores de los elementos */
export declare class MultiSelect extends React.PureComponent<MultiSelectProps, {}> {
    handleOnChange: (options: ReactSelect.Option<ReactSelect.OptionValues> | ReactSelect.Option<ReactSelect.OptionValues>[] | null) => void;
    private items();
    render(): JSX.Element;
}
/**Componente que muestra un selector de botones paginado, útil cuando existen demasiadas opciones  */
export declare class PaginatedButtonSelector extends React.PureComponent<SelectorProps, {}> {
    constructor(props: any);
    PageSize: number;
    /**Todos los items */
    readonly Items: SelectorElement[];
    handleOnChange: (value: string | number | boolean | Date | null | undefined) => void;
    GetValueAt(index: number): string | number | boolean | Date | null | undefined;
    readonly CurrentIndex: number | null;
    GetIndex(value: SelectorValue): number | null;
    /**Elementos de la página actual */
    readonly PageItems: SelectorElement[];
    /**Indice seleccionado */
    readonly SelectedIndex: number | null;
    /**Pagina actual */
    readonly CurrentPage: number;
    /**Cantidad de páginas */
    readonly PageCount: number;
    render(): JSX.Element;
}
export interface NeastedSelectorElement extends SelectorElement {
    parentValue: SelectorValue;
}
export interface NeastedSelectProps {
    /**Padre seleccionado en función del hijo seleccionado */
    parentValue: SelectorValue;
    /**Función que dibuja el elemento basado en el valor padre seleccionado */
    map: (parentValue: SelectorValue, onParentChange: (newValue: SelectorValue) => void) => JSX.Element | null;
    /**Cuando cambie el padre seleccionado, esta función se llamara con un valor de null para resetear el hijo seleccionado*/
    onChildChange?: (value: null) => void;
}
export interface NeastedSelectState {
    parentValue?: SelectorValue;
}
/**Un selector anidado */
export declare class NeastedSelector extends React.PureComponent<NeastedSelectProps, NeastedSelectState> {
    constructor(props: any);
    handleParentChange: (value: string | number | boolean | Date | null | undefined) => void;
    readonly PadreActual: string | number | boolean | Date | null | undefined;
    render(): JSX.Element | null;
}