@ntragas/pouncejstest
Version:
A collection of UI components from Panther labs
76 lines (75 loc) • 3.55 kB
TypeScript
import React from 'react';
export declare type MultiComboboxProps<T> = {
/** Callback when the selection changes */
onChange: (value: T[]) => void;
/** The label associated with this dropdown form element */
label: string;
/** The variant of the component that decides the colors */
variant?: 'solid' | 'outline';
/** Whether the label should get visually hidden */
hideLabel?: boolean;
/** A list of entries that the dropdown will have as options */
items: T[];
/**
* A function that converts the an item to a string. This is the value that the dropdown will
* expose to the user. This is also the value that the dropdown will use internally for comparisons
* so it should be unique (which should be by default since you wouldn't want to expose duplicate
* values to the user) */
itemToString?: (item: T) => string;
/**
* A function used to group the Menu Items.
*/
itemToGroup?: (item: T) => string;
/**
* A function that accepts an item as a parameter and returns `true` if the item should be
* disabled or `false` otherwise. Defaults to `() => false`.
*/
disableItem?: (item: T) => boolean;
/**
* The value of the item that is currently selected. The component is a controlled one,
* so the the selected value should be provided explicitly to the dropdown
* */
value: T[];
/** Whether the multi-combobox has an invalid value */
invalid?: boolean;
/** Whether the multi-combobox is required or not */
required?: boolean;
/** Whether the multi-combobox is disabled or not */
disabled?: boolean;
/** A placeholder that's visible when the user focuses on the Combobox */
placeholder?: string;
/** Whether the MultiCombobox should have an input to search results */
searchable?: boolean;
/** @ignore */
hidden?: boolean;
/**
* Allow the user to add custom entries to the dropdown instead of limiting selections to the
* predefined set of options. The `searchable` prop should be true in order for
* this functionality to work.
* */
allowAdditions?: boolean;
/**
* The maximum number of results that the MultiCombobox should show. Default value is
* `undefined` to display which displays all of them.
* */
maxResults?: number;
/** The maximum height (in pixels) of the MultiCombobox dropdown. Defaults to 300. */
maxHeight?: number;
/**
* A function that runs before a custom item is added by the user. If it returns `true`, then this
* item will be added to the selection. If not, then this item won't be added
* */
validateAddition?: (userEnteredInput: string, existing: T[]) => boolean;
/**
* This variable is used to determine if and when we are going show users the ability to clear
* everything they have added to the MultiCombobox
*/
canClearAllAfter?: number;
};
/**
* A simple MultiCombobox can be thought of as a typical `<select>` component. Whenever you would
* use a normal select, you should now pass the `<MultiCombobox>` component.
*/
declare function MultiCombobox<Item>({ onChange, value, variant, items, disableItem, searchable, label, hideLabel, disabled, placeholder, itemToString, itemToGroup, allowAdditions, validateAddition, maxHeight, maxResults, canClearAllAfter, invalid, hidden, ...rest }: MultiComboboxProps<Item>): React.ReactElement<MultiComboboxProps<Item>>;
declare const _default: typeof MultiCombobox;
export default _default;