@carbon/react
Version:
React components for the Carbon Design System
115 lines (114 loc) • 4.67 kB
TypeScript
/**
* Copyright IBM Corp. 2016, 2024
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
import React from 'react';
import PropTypes from 'prop-types';
/**
* `ListBoxSelection` is used to provide controls for clearing a selection, in
* addition to conditionally rendering a badge if the control has more than one
* selection.
*/
export declare const translationIds: {
readonly 'clear.all': "clear.all";
readonly 'clear.selection': "clear.selection";
};
export type TranslationKey = keyof typeof translationIds;
export interface ListBoxSelectionProps {
/**
* Specify a function to be invoked when a user interacts with the clear
* selection element.
*/
clearSelection: (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => void;
/**
* Specify an optional `selectionCount` value that will be used to determine
* whether the selection should display a badge or a single clear icon.
*/
selectionCount?: number;
/**
* i18n hook used to provide the appropriate description for the given menu
* icon. This function takes in an id defined in `translationIds` and should
* return a string message for that given message id.
*/
translateWithId?: (id: TranslationKey) => string;
/**
* Specify whether or not the clear selection element should be disabled
*/
disabled?: boolean;
/**
* Whether or not the listbox is readonly
*/
readOnly?: boolean;
/**
* Specify an optional `onClearSelection` handler that is called when the underlying
* element is cleared
*/
onClearSelection?: (event: React.MouseEvent<HTMLButtonElement>) => void;
/**
* Specify an optional `onClick` handler that is called when the underlying
* clear selection element is clicked
*/
onClick?: React.MouseEventHandler<HTMLButtonElement>;
/**
* Specify an optional `onKeyDown` handler that is called when the underlying
* clear selection element fires a keydown event
*/
onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;
/**
* Specify an optional `onMouseUp` handler that is called when the underlying
* clear selection element fires a mouseup event
*/
onMouseUp?: React.MouseEventHandler<HTMLButtonElement>;
}
declare function ListBoxSelection({ clearSelection, selectionCount, translateWithId: t, disabled, readOnly, onClearSelection, ...rest }: ListBoxSelectionProps): import("react/jsx-runtime").JSX.Element;
declare namespace ListBoxSelection {
var propTypes: {
/**
* Specify a function to be invoked when a user interacts with the clear
* selection element.
*/
clearSelection: PropTypes.Validator<(...args: any[]) => any>;
/**
* Specify whether or not the clear selection element should be disabled
*/
disabled: PropTypes.Requireable<boolean>;
/**
* Whether or not the listbox is readonly
*/
readOnly: PropTypes.Requireable<boolean>;
/**
* Specify an optional `onClearSelection` handler that is called when the underlying
* element is cleared
*/
onClearSelection: PropTypes.Requireable<(...args: any[]) => any>;
/**
* Specify an optional `onClick` handler that is called when the underlying
* clear selection element is clicked
*/
onClick: PropTypes.Requireable<(...args: any[]) => any>;
/**
* Specify an optional `onClick` handler that is called when the underlying
* clear selection element is clicked
*/
onMouseUp: PropTypes.Requireable<(...args: any[]) => any>;
/**
* Specify an optional `onKeyDown` handler that is called when the underlying
* clear selection element fires a keydown event
*/
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
/**
* Specify an optional `selectionCount` value that will be used to determine
* whether the selection should display a badge or a single clear icon.
*/
selectionCount: PropTypes.Requireable<number>;
/**
* i18n hook used to provide the appropriate description for the given menu
* icon. This function takes in an id defined in `translationIds` and should
* return a string message for that given message id.
*/
translateWithId: PropTypes.Requireable<(...args: any[]) => any>;
};
}
export default ListBoxSelection;