@carbon/react 1.21.0 → 1.22.0

package/lib/components/FluidTextInput/index.js

@@ -10,10 +10,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var FluidTextInput = require('./FluidTextInput.js');
-var FluidTextInput_Skeleton = require('./FluidTextInput.Skeleton.js');
 
 
 
 exports.FluidTextInput = FluidTextInput["default"];
 exports["default"] = FluidTextInput["default"];
-exports.FluidTextInputSkeleton = FluidTextInput_Skeleton["default"];

package/lib/components/FluidTimePicker/FluidTimePicker.Skeleton.js

@@ -14,9 +14,7 @@ var PropTypes = require('prop-types');
 var React = require('react');
 var cx = require('classnames');
 var usePrefix = require('../../internal/usePrefix.js');
-require('../FluidTextInput/FluidTextInput.js');
 var FluidTextInput_Skeleton = require('../FluidTextInput/FluidTextInput.Skeleton.js');
-require('../FluidSelect/FluidSelect.js');
 var FluidSelect_Skeleton = require('../FluidSelect/FluidSelect.Skeleton.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -52,5 +50,6 @@ FluidTimePickerSkeleton.propTypes = {
    */
   isOnlyTwo: PropTypes__default["default"].bool
 };
+var FluidTimePickerSkeleton$1 = FluidTimePickerSkeleton;
 
-exports["default"] = FluidTimePickerSkeleton;
+exports["default"] = FluidTimePickerSkeleton$1;

package/lib/components/FluidTimePicker/FluidTimePicker.js

@@ -14,7 +14,6 @@ var PropTypes = require('prop-types');
 var React = require('react');
 var cx = require('classnames');
 var FluidTextInput = require('../FluidTextInput/FluidTextInput.js');
-require('../FluidTextInput/FluidTextInput.Skeleton.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var iconsReact = require('@carbon/icons-react');
 
@@ -116,5 +115,6 @@ FluidTimePicker.propTypes = {
    */
   warnText: PropTypes__default["default"].node
 };
+var FluidTimePicker$1 = FluidTimePicker;
 
-exports["default"] = FluidTimePicker;
+exports["default"] = FluidTimePicker$1;

package/lib/components/FluidTimePickerSelect/FluidTimePickerSelect.js

@@ -13,7 +13,6 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
 var React = require('react');
 var PropTypes = require('prop-types');
 var FluidSelect = require('../FluidSelect/FluidSelect.js');
-require('../FluidSelect/FluidSelect.Skeleton.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -69,5 +68,6 @@ FluidTimePickerSelect.propTypes = {
    */
   onChange: PropTypes__default["default"].func
 };
+var FluidTimePickerSelect$1 = FluidTimePickerSelect;
 
-exports["default"] = FluidTimePickerSelect;
+exports["default"] = FluidTimePickerSelect$1;

package/lib/components/Form/Form.js

@@ -46,5 +46,6 @@ Form.propTypes = {
    */
   className: PropTypes__default["default"].string
 };
+var Form$1 = Form;
 
-exports["default"] = Form;
+exports["default"] = Form$1;

package/lib/components/FormGroup/FormGroup.js

@@ -91,5 +91,6 @@ FormGroup.defaultProps = {
   message: false,
   messageText: ''
 };
+var FormGroup$1 = FormGroup;
 
-exports["default"] = FormGroup;
+exports["default"] = FormGroup$1;

package/lib/components/IconButton/index.js

@@ -13,8 +13,6 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
 var PropTypes = require('prop-types');
 var React = require('react');
 var Button = require('../Button/Button.js');
-require('../Button/Button.Skeleton.js');
-require('../Tooltip/DefinitionTooltip.js');
 var Tooltip = require('../Tooltip/Tooltip.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var cx = require('classnames');
@@ -44,6 +42,7 @@ var IconButton = /*#__PURE__*/React__default["default"].forwardRef(function Icon
   return /*#__PURE__*/React__default["default"].createElement(Tooltip.Tooltip, {
     align: align,
     className: "".concat(prefix, "--icon-tooltip"),
+    closeOnActivation: true,
     defaultOpen: defaultOpen,
     enterDelayMs: enterDelayMs,
     label: label,

package/lib/components/InlineCheckbox/InlineCheckbox.js

@@ -19,6 +19,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
+/** @type any */
+
 var InlineCheckbox = /*#__PURE__*/React__default["default"].forwardRef(function InlineCheckbox(props, forwardRef) {
   var ariaLabel = props.ariaLabel,
       _props$checked = props.checked,
@@ -125,5 +127,6 @@ InlineCheckbox.propTypes = {
    */
   title: PropTypes__default["default"].string
 };
+var InlineCheckbox$1 = InlineCheckbox;
 
-exports["default"] = InlineCheckbox;
+exports["default"] = InlineCheckbox$1;

package/lib/components/Link/Link.js

@@ -103,5 +103,6 @@ Link.propTypes = {
    */
   visited: PropTypes__default["default"].bool
 };
+var Link$1 = Link;
 
-exports["default"] = Link;
+exports["default"] = Link$1;

package/lib/components/ListBox/ListBox.d.ts

@@ -0,0 +1,60 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * 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 { ListBoxType, ListBoxSize } from './ListBoxPropTypes';
+import { ForwardRefReturn, ReactAttr } from '../../types/common';
+type ExcludedAttributes = 'onKeyDown' | 'onKeyPress' | 'ref';
+export interface ListBoxProps extends Omit<ReactAttr<HTMLDivElement>, ExcludedAttributes> {
+    /**
+     * Specify whether the ListBox is currently disabled
+     */
+    disabled?: boolean;
+    /**
+     * Specify whether the control is currently invalid
+     */
+    invalid?: boolean;
+    /**
+     * Specify the text to be displayed when the control is invalid
+     */
+    invalidText?: React.ReactNode;
+    /**
+     * Specify if the control should render open
+     */
+    isOpen?: boolean;
+    /**
+     * `true` to use the light version. For use on $ui-01 backgrounds only.
+     * Don't use this to make tile background color same as container background color.
+     *
+     * @deprecated The `light` prop for `ListBox` has been deprecated in favor of
+     * the new `Layer` component. It will be removed in the next major release.
+     */
+    light?: boolean;
+    /**
+     * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
+     */
+    size?: ListBoxSize;
+    /**
+     * Specify the "type" of the ListBox. Currently supports either `default` or
+     * `inline` as an option.
+     */
+    type?: ListBoxType;
+    /**
+     * Specify whether the control is currently in warning state
+     */
+    warn?: boolean;
+    /**
+     * Provide the text that is displayed when the control is in warning state
+     */
+    warnText?: React.ReactNode;
+}
+export type ListBoxComponent = ForwardRefReturn<HTMLDivElement, ListBoxProps>;
+/**
+ * `ListBox` is a generic container component that handles creating the
+ * container class name in response to certain props.
+ */
+declare const ListBox: ListBoxComponent;
+export default ListBox;

package/lib/components/ListBox/ListBox.js

@@ -16,11 +16,6 @@ var PropTypes = require('prop-types');
 var deprecate = require('../../prop-types/deprecate.js');
 var ListBoxPropTypes = require('./ListBoxPropTypes.js');
 var usePrefix = require('../../internal/usePrefix.js');
-var ListBoxField = require('./ListBoxField.js');
-var ListBoxMenu = require('./ListBoxMenu.js');
-var ListBoxMenuIcon = require('./ListBoxMenuIcon.js');
-var ListBoxMenuItem = require('./ListBoxMenuItem.js');
-var ListBoxSelection = require('./ListBoxSelection.js');
 require('../FluidForm/FluidForm.js');
 var FormContext = require('../FluidForm/FormContext.js');
 
@@ -42,14 +37,13 @@ var handleClick = function handleClick(event) {
   event.preventDefault();
   event.stopPropagation();
 };
+
 /**
  * `ListBox` is a generic container component that handles creating the
  * container class name in response to certain props.
  */
-
-
 var ListBox = /*#__PURE__*/React__default["default"].forwardRef(function ListBox(_ref, ref) {
-  var _cx;
+  var _objectSpread2;
 
   var children = _ref.children,
       containerClassName = _ref.className,
@@ -70,7 +64,7 @@ var ListBox = /*#__PURE__*/React__default["default"].forwardRef(function ListBox
       isFluid = _useContext.isFluid;
 
   var showWarning = !invalid && warn;
-  var className = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, containerClassName, !!containerClassName), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--list-box"), true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--list-box--").concat(size), size), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--list-box--inline"), type === 'inline'), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--list-box--disabled"), disabled), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--list-box--light"), light), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--list-box--expanded"), isOpen), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--list-box--invalid"), invalid), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--list-box--warning"), showWarning), _cx));
+  var className = cx__default["default"](_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, containerClassName && _rollupPluginBabelHelpers.defineProperty({}, containerClassName, true)), {}, (_objectSpread2 = {}, _rollupPluginBabelHelpers.defineProperty(_objectSpread2, "".concat(prefix, "--list-box"), true), _rollupPluginBabelHelpers.defineProperty(_objectSpread2, "".concat(prefix, "--list-box--").concat(size), size), _rollupPluginBabelHelpers.defineProperty(_objectSpread2, "".concat(prefix, "--list-box--inline"), type === 'inline'), _rollupPluginBabelHelpers.defineProperty(_objectSpread2, "".concat(prefix, "--list-box--disabled"), disabled), _rollupPluginBabelHelpers.defineProperty(_objectSpread2, "".concat(prefix, "--list-box--light"), light), _rollupPluginBabelHelpers.defineProperty(_objectSpread2, "".concat(prefix, "--list-box--expanded"), isOpen), _rollupPluginBabelHelpers.defineProperty(_objectSpread2, "".concat(prefix, "--list-box--invalid"), invalid), _rollupPluginBabelHelpers.defineProperty(_objectSpread2, "".concat(prefix, "--list-box--warning"), showWarning), _objectSpread2)));
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: className,
     ref: ref,
@@ -148,10 +142,5 @@ ListBox.defaultProps = {
   disabled: false,
   type: 'default'
 };
-ListBox.Field = ListBoxField["default"];
-ListBox.Menu = ListBoxMenu["default"];
-ListBox.MenuIcon = ListBoxMenuIcon["default"];
-ListBox.MenuItem = ListBoxMenuItem["default"];
-ListBox.Selection = ListBoxSelection["default"];
 
 exports["default"] = ListBox;

package/lib/components/ListBox/ListBoxField.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * 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 { ReactAttr } from '../../types/common';
+export declare const translationIds: {};
+export interface ListBoxFieldProps extends ReactAttr<HTMLDivElement> {
+    /**
+     * Specify if the parent <ListBox> is disabled
+     */
+    disabled?: boolean;
+}
+export type ListBoxFieldComponent = React.FC<ListBoxFieldProps>;
+declare const _default: ListBoxFieldComponent;
+export default _default;

package/lib/components/ListBox/ListBoxField.js

@@ -20,12 +20,12 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
 var _excluded = ["children", "disabled", "tabIndex"];
+
 /**
  * `ListBoxField` is responsible for creating the containing node for valid
  * elements inside of a field. It also provides a11y-related attributes like
  * `role` to make sure a user can focus the given field.
  */
-
 function ListBoxField(_ref) {
   var children = _ref.children,
       disabled = _ref.disabled,

package/lib/components/ListBox/ListBoxMenu.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * 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 { ForwardRefReturn, ReactAttr } from '../../types/common';
+type ExcludedAttributes = 'id';
+export interface ListBoxMenuProps extends Omit<ReactAttr<HTMLDivElement>, ExcludedAttributes> {
+    /**
+     * Specify a custom `id`
+     */
+    id: string;
+}
+export type ListBoxMenuComponent = ForwardRefReturn<HTMLDivElement, ListBoxMenuProps>;
+/**
+ * `ListBoxMenu` is a simple container node that isolates the `list-box__menu`
+ * class into a single component. It is also being used to validate given
+ * `children` components.
+ */
+declare const ListBoxMenu: ListBoxMenuComponent;
+export default ListBoxMenu;

package/lib/components/ListBox/ListBoxMenu.js

@@ -21,12 +21,12 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
 var _excluded = ["children", "id"];
+
 /**
  * `ListBoxMenu` is a simple container node that isolates the `list-box__menu`
  * class into a single component. It is also being used to validate given
  * `children` components.
  */
-
 var ListBoxMenu = /*#__PURE__*/React__default["default"].forwardRef(function ListBoxMenu(_ref, ref) {
   var children = _ref.children,
       id = _ref.id,
@@ -45,7 +45,7 @@ ListBoxMenu.propTypes = {
   /**
    * Provide the contents of your ListBoxMenu
    */
-  children: PropTypes__default["default"].oneOfType([PropTypes__default["default"].node, PropTypes__default["default"].arrayOf(ListBoxMenuItem["default"]),
+  children: PropTypes__default["default"].oneOfType([PropTypes__default["default"].node, PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOf([ListBoxMenuItem["default"]])),
   /**
    * allow single item using the workaround for functional components
    * https://github.com/facebook/react/issues/2979#issuecomment-222379916

package/lib/components/ListBox/ListBoxMenuIcon.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * 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';
+export declare const translationIds: {
+    'close.menu': string;
+    'open.menu': string;
+};
+export interface ListBoxMenuIconProps {
+    /**
+     * Specify whether the menu is currently open, which will influence the
+     * direction of the menu icon
+     */
+    isOpen: boolean;
+    /**
+     * 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?(messageId: string, args?: Record<string, unknown>): string;
+}
+export type ListBoxMenuIconComponent = React.FC<ListBoxMenuIconProps>;
+/**
+ * `ListBoxMenuIcon` is used to orient the icon up or down depending on the
+ * state of the menu for a given `ListBox`
+ */
+declare const ListBoxMenuIcon: ListBoxMenuIconComponent;
+export default ListBoxMenuIcon;

package/lib/components/ListBox/ListBoxMenuIcon.js

@@ -28,14 +28,19 @@ var translationIds = {
   'open.menu': 'open.menu'
 };
 var defaultTranslations = (_defaultTranslations = {}, _rollupPluginBabelHelpers.defineProperty(_defaultTranslations, translationIds['close.menu'], 'Close menu'), _rollupPluginBabelHelpers.defineProperty(_defaultTranslations, translationIds['open.menu'], 'Open menu'), _defaultTranslations);
+
+var defaultTranslateWithId = function defaultTranslateWithId(id) {
+  return defaultTranslations[id];
+};
+
 /**
  * `ListBoxMenuIcon` is used to orient the icon up or down depending on the
  * state of the menu for a given `ListBox`
  */
-
 var ListBoxMenuIcon = function ListBoxMenuIcon(_ref) {
   var isOpen = _ref.isOpen,
-      t = _ref.translateWithId;
+      _ref$translateWithId = _ref.translateWithId,
+      t = _ref$translateWithId === void 0 ? defaultTranslateWithId : _ref$translateWithId;
   var prefix = usePrefix.usePrefix();
   var className = cx__default["default"]("".concat(prefix, "--list-box__menu-icon"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--list-box__menu-icon--open"), isOpen));
   var description = isOpen ? t('close.menu') : t('open.menu');
@@ -62,9 +67,7 @@ ListBoxMenuIcon.propTypes = {
   translateWithId: PropTypes__default["default"].func.isRequired
 };
 ListBoxMenuIcon.defaultProps = {
-  translateWithId: function translateWithId(id) {
-    return defaultTranslations[id];
-  }
+  translateWithId: defaultTranslateWithId
 };
 
 exports["default"] = ListBoxMenuIcon;

package/lib/components/ListBox/ListBoxMenuItem.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * 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, { ForwardedRef } from 'react';
+import { ForwardRefReturn, ReactAttr } from '../../types/common';
+export interface ListBoxMenuItemProps extends ReactAttr<HTMLDivElement> {
+    /**
+     * Specify whether the current menu item is "active".
+     */
+    isActive?: boolean;
+    /**
+     * Specify whether the current menu item is "highlighted".
+     */
+    isHighlighted?: boolean;
+}
+export type ListBoxMenuItemForwardedRef = ForwardedRef<HTMLDivElement> & {
+    menuItemOptionRef?: React.Ref<HTMLDivElement>;
+} | null;
+export type ListBoxMenuItemComponent = ForwardRefReturn<ListBoxMenuItemForwardedRef, ListBoxMenuItemProps>;
+declare const _default: ListBoxMenuItemComponent;
+export default _default;

package/lib/components/ListBox/ListBoxMenuItem.js

@@ -37,13 +37,12 @@ function useIsTruncated(ref) {
   }, [ref, setIsTruncated]);
   return isTruncated;
 }
+
 /**
  * `ListBoxMenuItem` is a helper component for managing the container class
  * name, alongside any classes for any corresponding states, for a generic list
  * box menu item.
  */
-
-
 var ListBoxMenuItem = /*#__PURE__*/React__default["default"].forwardRef(function ListBoxMenuItem(_ref, forwardedRef) {
   var _cx;
 
@@ -60,7 +59,7 @@ var ListBoxMenuItem = /*#__PURE__*/React__default["default"].forwardRef(function
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: className,
     title: isTruncated ? title : undefined,
-    tabIndex: "-1"
+    tabIndex: -1
   }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(prefix, "--list-box__menu-item__option"),
     ref: (forwardedRef === null || forwardedRef === void 0 ? void 0 : forwardedRef.menuItemOptionRef) || ref

package/lib/components/ListBox/ListBoxPropTypes.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * 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 PropTypes from 'prop-types';
+declare const listBoxTypes: readonly ["default", "inline"];
+declare const listBoxSizes: readonly ["sm", "md", "lg"];
+export type ListBoxType = typeof listBoxTypes[number];
+export type ListBoxSize = typeof listBoxSizes[number];
+export declare const ListBoxType: PropTypes.Requireable<"default" | "inline">;
+export declare const ListBoxSize: PropTypes.Requireable<"md" | "sm" | "lg">;
+export {};

package/lib/components/ListBox/ListBoxPropTypes.js

@@ -15,8 +15,10 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
-var ListBoxType = PropTypes__default["default"].oneOf(['default', 'inline']);
-var ListBoxSize = PropTypes__default["default"].oneOf(['sm', 'md', 'lg']);
+var listBoxTypes = ['default', 'inline'];
+var listBoxSizes = ['sm', 'md', 'lg'];
+var ListBoxType = PropTypes__default["default"].oneOf(listBoxTypes);
+var ListBoxSize = PropTypes__default["default"].oneOf(listBoxSizes);
 
 exports.ListBoxSize = ListBoxSize;
 exports.ListBoxType = ListBoxType;

package/lib/components/ListBox/ListBoxSelection.d.ts

@@ -0,0 +1,51 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * 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 { KeyboardEvent, MouseEvent } from 'react';
+export interface ListBoxSelectionProps {
+    /**
+     * Specify a function to be invoked when a user interacts with the clear
+     * selection element.
+     */
+    clearSelection(event: MouseEvent<HTMLDivElement> | KeyboardEvent<HTMLDivElement>): void;
+    /**
+     * Specify whether or not the clear selection element should be disabled
+     */
+    disabled?: boolean;
+    /**
+     * Specify an optional `onClearSelection` handler that is called when the underlying
+     * element is cleared
+     */
+    onClearSelection?(event: MouseEvent<HTMLDivElement> | KeyboardEvent<HTMLDivElement>): void;
+    /**
+     * Whether or not the Dropdown is readonly
+     */
+    readOnly?: boolean;
+    /**
+     * 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(messageId: string, args?: Record<string, unknown>): string;
+}
+export type ListBoxSelectionComponent = React.FC<ListBoxSelectionProps>;
+/**
+ * `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.
+ */
+declare const ListBoxSelection: ListBoxSelectionComponent;
+export declare const translationIds: {
+    'clear.all': string;
+    'clear.selection': string;
+};
+export default ListBoxSelection;

package/lib/components/ListBox/ListBoxSelection.js

@@ -14,9 +14,9 @@ var cx = require('classnames');
 var React = require('react');
 var PropTypes = require('prop-types');
 var iconsReact = require('@carbon/icons-react');
-var keys = require('../../internal/keyboard/keys.js');
-var match = require('../../internal/keyboard/match.js');
 var usePrefix = require('../../internal/usePrefix.js');
+var match = require('../../internal/keyboard/match.js');
+var keys = require('../../internal/keyboard/keys.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -25,13 +25,13 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
 var _Close, _Close2, _defaultTranslations;
+
 /**
  * `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.
  */
-
-function ListBoxSelection(_ref) {
+var ListBoxSelection = function ListBoxSelection(_ref) {
   var _cx;
 
   var clearSelection = _ref.clearSelection,
@@ -65,7 +65,7 @@ function ListBoxSelection(_ref) {
     } // When a user hits ENTER, we'll clear the selection
 
 
-    if (match.match(event, keys.Enter)) {
+    if (match.match(event.code, keys.Enter)) {
       clearSelection(event);
 
       if (onClearSelection) {
@@ -80,14 +80,13 @@ function ListBoxSelection(_ref) {
     className: tagClasses
   }, /*#__PURE__*/React__default["default"].createElement("span", {
     className: "".concat(prefix, "--tag__label"),
-    title: selectionCount
+    title: "".concat(selectionCount)
   }, selectionCount), /*#__PURE__*/React__default["default"].createElement("div", {
     role: "button",
     tabIndex: disabled ? -1 : 0,
     className: "".concat(prefix, "--tag__close-icon"),
     onClick: handleOnClick,
     onKeyDown: handleOnKeyDown,
-    disabled: disabled,
     "aria-label": t('clear.all'),
     title: description,
     "aria-disabled": readOnly ? true : undefined
@@ -100,7 +99,7 @@ function ListBoxSelection(_ref) {
     "aria-label": description,
     title: description
   }, selectionCount, _Close2 || (_Close2 = /*#__PURE__*/React__default["default"].createElement(iconsReact.Close, null)));
-}
+};
 
 var translationIds = {
   'clear.all': 'clear.all',
@@ -125,18 +124,6 @@ ListBoxSelection.propTypes = {
    */
   onClearSelection: PropTypes__default["default"].func,
 
-  /**
-   * Specify an optional `onClick` handler that is called when the underlying
-   * clear selection element is clicked
-   */
-  onClick: PropTypes__default["default"].func,
-
-  /**
-   * Specify an optional `onKeyDown` handler that is called when the underlying
-   * clear selection element fires a keydown event
-   */
-  onKeyDown: PropTypes__default["default"].func,
-
   /**
    * Whether or not the Dropdown is readonly
    */

package/lib/components/ListBox/index.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export * as PropTypes from './ListBoxPropTypes';
+export * from './ListBoxPropTypes';
+import { ListBoxComponent as ListBoxPartialComponent } from './ListBox';
+import { ListBoxFieldComponent } from './ListBoxField';
+import { ListBoxMenuComponent } from './ListBoxMenu';
+import { ListBoxMenuIconComponent } from './ListBoxMenuIcon';
+import { ListBoxMenuItemComponent } from './ListBoxMenuItem';
+import { ListBoxSelectionComponent } from './ListBoxSelection';
+export interface ListBoxComponent extends ListBoxPartialComponent {
+    readonly Field: ListBoxFieldComponent;
+    readonly Menu: ListBoxMenuComponent;
+    readonly MenuIcon: ListBoxMenuIconComponent;
+    readonly MenuItem: ListBoxMenuItemComponent;
+    readonly Selection: ListBoxSelectionComponent;
+}
+declare const ListBox: ListBoxComponent;
+export default ListBox;

package/lib/components/ListBox/index.js

@@ -9,18 +9,22 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./ListBoxPropTypes.js');
-var ListBox = require('./ListBox.js');
+var ListBoxPropTypes = require('./ListBoxPropTypes.js');
+var ListBox$1 = require('./ListBox.js');
 var ListBoxField = require('./ListBoxField.js');
 var ListBoxMenu = require('./ListBoxMenu.js');
 var ListBoxMenuIcon = require('./ListBoxMenuIcon.js');
 var ListBoxMenuItem = require('./ListBoxMenuItem.js');
 var ListBoxSelection = require('./ListBoxSelection.js');
 
-ListBox["default"].Field = ListBoxField["default"];
-ListBox["default"].Menu = ListBoxMenu["default"];
-ListBox["default"].MenuIcon = ListBoxMenuIcon["default"];
-ListBox["default"].MenuItem = ListBoxMenuItem["default"];
-ListBox["default"].Selection = ListBoxSelection["default"];
+var ListBox = Object.assign(ListBox$1["default"], {
+  Field: ListBoxField["default"],
+  Menu: ListBoxMenu["default"],
+  MenuIcon: ListBoxMenuIcon["default"],
+  MenuItem: ListBoxMenuItem["default"],
+  Selection: ListBoxSelection["default"]
+});
 
-exports["default"] = ListBox["default"];
+exports.ListBoxSize = ListBoxPropTypes.ListBoxSize;
+exports.ListBoxType = ListBoxPropTypes.ListBoxType;
+exports["default"] = ListBox;