@clayui/form/lib/SelectBox.d.ts

ClayForm component

/**
 * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
 * SPDX-License-Identifier: BSD-3-Clause
 */
import React from 'react';
export declare type TItem = {
    label: string;
    value: string;
};
interface IProps extends React.HTMLAttributes<HTMLSelectElement> {
    /**
     * Labels for aria attributes
     */
    ariaLabels?: {
        reorderUp: string;
        reorderDown: string;
    };
    /**
     * Aligns the buttons used to reorder items relative to the Select Box.
     */
    buttonAlignment?: 'center' | 'end';
    /**
     * Disables the component.
     */
    disabled?: boolean;
    /**
     * Items to be displayed in the Select Box.
     */
    items: Array<TItem>;
    /**
     * Label to be displayed above the Select Box.
     */
    label?: string;
    /**
     * Defines whether the Select Box supports selection of multiple items.
     */
    multiple?: boolean;
    /**
     * Handler that triggers when the content of the items prop are changed caused by reordering of items.
     */
    onItemsChange?: (items: Array<TItem>) => void;
    /**
     * Handler that triggers when a new item is selected.
     */
    onSelectChange: (value: Array<string>) => void;
    /**
     *  Selected indexes, most commonly used in combination with the  Dual Listbox component
     */
    selectedIndexes?: Array<number>;
    /**
     * Amount of items that can fit inside the both Select Boxes before a scrollbar is introduced.
     */
    size?: number;
    /**
     * Defines whether the component should render buttons that allow reordering of items.
     */
    showArrows?: boolean;
    /**
     * Value of the component.
     */
    value: string | Array<string>;
    /**
     * Path to the spritemap that Icon should use when referencing symbols.
     */
    spritemap?: string;
}
export declare const getSelectedIndexes: (items: Array<TItem>, selectedValues: Array<number | string>) => number[];
declare const SelectBox: ({ ariaLabels, buttonAlignment, className, disabled, id, items, label, multiple, onItemsChange, onSelectChange, showArrows, size, spritemap, value, ...otherProps }: IProps) => JSX.Element;
export default SelectBox;