apphouse
Version:
Component library for React that uses observable state management and theme-able components.
57 lines (56 loc) • 1.52 kB
TypeScript
/// <reference types="react" />
import { CSSProperties } from 'glamor';
import { ApphouseComponent } from './component.interfaces';
import { ApphouseTheme } from '../styles/defaults/themes.interface';
/**
* Interface for styles to be applied to the search input component
*/
export interface SearchInputStyles {
/**
* Styles for the container of the search input.
*/
container?: CSSProperties;
/**
* Styles for the input component.
*/
input?: CSSProperties;
/**
* Styles for the button component.
*/
button?: CSSProperties;
/**
* Styles for the wrapper of the search icon.
*/
icon?: CSSProperties;
}
interface SearchInputProps extends ApphouseComponent<SearchInputStyles> {
/**
* Unique id for the input
*/
id: string;
/**
* If true, it will hide the search icon.
* @default false
*/
hideSearchIcon?: boolean;
/**
* A callback to be triggered when the user clicks the search button.
*/
onSearchClick: () => void;
/**
* A callback to be triggered when the user types in the input box
*/
onChange?: (value: string) => void;
/**
* The value of the input box.
*/
value?: string;
}
/**
* A search input component.
* It contains an input and a button to trigger the search.
* as well an icon
*/
export declare const SearchInput: React.FC<SearchInputProps>;
export declare const getSearchInputStyles: (theme: ApphouseTheme) => SearchInputStyles;
export {};