jobiqo-cl
Version:
[](https://circleci.com/gh/jobiqo/jobiqo-cl)
54 lines (53 loc) • 1.54 kB
TypeScript
/**
* @file index.tsx
*
* @fileoverview Renders a searcheable select component using the downshift library.
*/
import { FocusEvent } from 'react';
import { SelectItem } from 'src/models/forms';
export declare const DownshiftInput: any;
export declare const ControlButton: import("styled-components").StyledComponent<"div", any, any, never>;
export interface SelectProps {
/**
* The id for this select. It will be used for accessibility purposes.
*/
id?: string;
/**
* An array of selected items for the select.
*
* @default []
*/
items: SelectItem[];
/**
* The value that is selected.
*/
selectedValue?: string;
/**
* Placeholder. The text displayed inside the input of the select box.
*
* @default "Search an item"
*/
placeholder?: string;
/**
* The label for the select.
*/
label?: string;
/**
* If the select is a required element.
*/
required?: boolean;
/**
* The event to fire when something changes in the select.
*/
onChange?(item: SelectItem): any;
/**
* The event to fire when the user clicks outside the select.
*/
onBlur?(e: FocusEvent<HTMLInputElement>): void;
}
/**
* A select widget that uses downshift internally. Renders a select where the user can search items.
* Focuses on accessibility.
*/
export declare const Select: ({ id, items, label, required, placeholder, onChange, onBlur, selectedValue }: SelectProps) => JSX.Element;
export default Select;