@clayui/form
Version:
ClayForm component
81 lines (80 loc) • 2.34 kB
TypeScript
/**
* SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
* SPDX-License-Identifier: BSD-3-Clause
*/
import React from 'react';
import { TItem } from './SelectBox';
declare type BoxProps = {
/**
* Id of the selectbox to be used with the label
*/
id?: string;
/**
* Label of the left Select Box.
*/
label?: string;
/**
* Handler that triggers when a new item is selected in the left Select Box.
*/
onSelectChange?: (val: Array<string>) => void;
/**
* Array of selected items in the left Select Box.
*/
selected?: Array<string>;
};
interface IProps extends React.HTMLAttributes<HTMLDivElement> {
/**
* Labels for the aria attributes
*/
ariaLabels?: {
error?: string;
transferLTR: string;
transferRTL: string;
};
/**
* Disables the component.
*/
disabled?: boolean;
/**
* Disables the button responsible for moving items from right to left box.
*/
disableRTL?: boolean;
/**
* Disables the button responsible for moving items from left to right box.
*/
disableLTR?: boolean;
/**
* Items spread across two arrays that will be displayed in the two Select Boxes.
*/
items: Array<Array<TItem>>;
/**
* Handler that triggers when the content of the items prop are changed. Caused by either reordering or transfering of items.
*/
onItemsChange: (value: Array<Array<TItem>>) => void;
/**
* Props for the left Select Box.
*/
left?: BoxProps;
/**
* Props for the right Select Box.
*/
right?: BoxProps;
/**
* 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;
/**
* Sets the maximum value of items on the left side.
*/
leftMaxItems?: number;
/**
* Sets the maximum value of items on the right side.
*/
rightMaxItems?: number;
}
declare const DualListBox: ({ ariaLabels, className, disabled, disableLTR, disableRTL, items, left, leftMaxItems, onItemsChange, right, rightMaxItems, size, spritemap, ...otherProps }: IProps) => JSX.Element;
export default DualListBox;