/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { FormComponentProps, KendoMouse } from '@progress/kendo-react-common';
import { ChipProps } from './Chip.js';
import { ChipListChangeEvent, ChipListDataChangeEvent } from './../models/index';
import * as React from 'react';
/**
 * Represents the properties of [ChipList](https://www.telerik.com/kendo-react-ui/components/buttons/api/chiplist) component.
 */
export interface ChipListProps extends FormComponentProps, KendoMouse<ChipListHandle, HTMLDivElement> {
    /**
     * Sets the `id` property of the top div element of the ChipList.
     *
     * @example
     * ```jsx
     * <ChipList id="chiplist1" />
     * ```
     */
    id?: string;
    /**
     * Sets additional classes to the ChipList.
     *
     * @example
     * ```jsx
     * <ChipList className="custom-chiplist" />
     * ```
     */
    className?: string;
    /**
     * Sets the `tabIndex` attribute.
     *
     * @example
     * ```jsx
     * <ChipList tabIndex={0} />
     * ```
     */
    tabIndex?: number;
    /**
     * Sets additional CSS styles to the ChipList.
     *
     * @example
     * ```jsx
     * <ChipList style={{ margin: '10px' }} />
     * ```
     */
    style?: React.CSSProperties;
    /**
     * Represents Chip component.
     *
     * @example
     * ```jsx
     * <ChipList chip={CustomChip} />
     * ```
     */
    chip?: React.ComponentType<ChipProps>;
    /**
     * Represents the data about the child Chips.
     *
     * @example
     * ```jsx
     * <ChipList data={[{ text: 'Chip1' }, { text: 'Chip2' }]} />
     * ```
     */
    data?: any;
    /**
     * Represents the default data about the child Chips.
     *
     * @example
     * ```jsx
     * <ChipList defaultData={[{ text: 'DefaultChip1' }, { text: 'DefaultChip2' }]} />
     * ```
     */
    defaultData?: any[];
    /**
     * Fires after Chip data change.
     *
     * @example
     * ```jsx
     * <ChipList onDataChange={(event) => console.log(event.value)} />
     * ```
     */
    onDataChange?: (event: ChipListDataChangeEvent) => void;
    /**
     * Represents the selection state of Chip component.
     *
     * @example
     * ```jsx
     * <ChipList value={[{ text: 'SelectedChip' }]} />
     * ```
     */
    value?: any | any[];
    /**
     * Represents the default value of the selection state of Chip component.
     *
     * @example
     * ```jsx
     * <ChipList defaultValue={[{ text: 'DefaultSelectedChip' }]} />
     * ```
     */
    defaultValue?: any | any[];
    /**
     * Fires after value change.
     *
     * @example
     * ```jsx
     * <ChipList onChange={(event) => console.log(event.value)} />
     * ```
     */
    onChange?: (event: ChipListChangeEvent) => void;
    /**
     * Represents the selection state of Chip component.
     *
     * @example
     * ```jsx
     * <ChipList selection="multiple" />
     * ```
     */
    selection?: string;
    /**
     * Represents the `text` field of Chip, used for the `label`.
     *
     * @example
     * ```jsx
     * <ChipList textField="name" />
     * ```
     */
    textField?: string;
    /**
     * Represents the `value` field of Chip, used for setting the Chip `id`.
     *
     * @example
     * ```jsx
     * <ChipList valueField="id" />
     * ```
     */
    valueField?: string;
    /**
     * Determines of ChipList is disabled.
     *
     * @example
     * ```jsx
     * <ChipList disabled={true} />
     * ```
     */
    disabled?: boolean;
    /**
     * The ChipList direction 'ltr' as default or 'rtl'.
     *
     * @example
     * ```jsx
     * <ChipList dir="rtl" />
     * ```
     */
    dir?: string;
    /**
     * Identifies the element(s) which describe the component, similar to [HTML aria-describedby attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute).
     * For example, these elements could contain error or hint message.
     *
     * @example
     * ```jsx
     * <ChipList ariaDescribedBy="description" />
     * ```
     *
     * @remarks
     * This property is related to accessibility.
     */
    ariaDescribedBy?: string;
    /**
     * Identifies the element(s) which label the component.
     *
     * @example
     * ```jsx
     * <ChipList ariaLabelledBy="label" />
     * ```
     *
     * @remarks
     * This property is related to accessibility.
     */
    ariaLabelledBy?: string;
    /**
     * The accessible label of the component.
     *
     * @example
     * ```jsx
     * <ChipList ariaLabel="ChipList" />
     * ```
     *
     * @remarks
     * This property is related to accessibility.
     */
    ariaLabel?: string;
    /**
     * Configures the `size` of the ChipList.
     *
     * The available options are:
     * - `small`
     * - `medium`
     * - `large`
     *
     * @default undefined (theme-controlled)
     *
     * @example
     * ```jsx
     * <ChipList size="large" />
     * ```
     */
    size?: 'small' | 'medium' | 'large';
}
/**
 * Represents the target(element and props) of the ChipListChangeEvent.
 */
export interface ChipListHandle {
    /**
     * The current element or `null` if there is no one.
     */
    element: HTMLDivElement | null;
    /**
     * The props values of the ChipList.
     */
    props: ChipListProps;
}
/**
 * Represents the ChipList component.
 */
export declare const ChipList: React.ForwardRefExoticComponent<ChipListProps & React.RefAttributes<ChipListHandle | null>>;