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

ClayForm component

/**
 * SPDX-FileCopyrightText: (c) 2026 Liferay, Inc. https://liferay.com
 * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
 */
import React from 'react';
export declare type TItem = {
    label: string;
    value: string;
};
interface IProps extends React.HTMLAttributes<HTMLSelectElement> {
    /**
     * Labels for aria attributes
     */
    ariaLabels?: {
        reorderDown: string;
        reorderUp: 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>;
    /**
     * Defines whether the component should render buttons that allow reordering of items.
     */
    showArrows?: boolean;
    /**
     * Amount of items that can fit inside the both Select Boxes before a scrollbar is introduced.
     */
    size?: number;
    /**
     * Path to the spritemap that Icon should use when referencing symbols.
     */
    spritemap?: string;
    /**
     * Value of the component.
     */
    value: string | Array<string>;
}
export declare function getSelectedIndexes(items: Array<TItem>, selectedValues: Array<number | string>): number[];
declare function SelectBox({ ariaLabels, buttonAlignment, className, disabled, id, items, label, multiple, onItemsChange, onSelectChange, showArrows, size, spritemap, value, ...otherProps }: IProps): React.JSX.Element;
export default SelectBox;