@carbon/react 1.83.0-rc.0 → 1.84.0-rc.0

package/lib/components/Tag/DismissibleTag.js

@@ -32,23 +32,22 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _Close;
-const DismissibleTag = /*#__PURE__*/React.forwardRef((_ref, forwardRef) => {
-  let {
-    className,
-    decorator,
-    disabled,
-    id,
-    renderIcon,
-    title = 'Dismiss',
-    onClose,
-    slug,
-    size,
-    text,
-    tagTitle,
-    type,
-    dismissTooltipLabel = 'Dismiss tag',
-    ...other
-  } = _ref;
+const DismissibleTag = /*#__PURE__*/React.forwardRef(({
+  className,
+  decorator,
+  disabled,
+  id,
+  renderIcon,
+  title = 'Dismiss',
+  onClose,
+  slug,
+  size,
+  text,
+  tagTitle,
+  type,
+  dismissTooltipLabel = 'Dismiss tag',
+  ...other
+}, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagLabelRef = React.useRef(null);
   const tagId = id || `tag-${useId.useId()}`;

package/lib/components/Tag/OperationalTag.js

@@ -41,17 +41,16 @@ const TYPES = {
   'cool-gray': 'Cool-Gray',
   'warm-gray': 'Warm-Gray'
 };
-const OperationalTag = /*#__PURE__*/React.forwardRef((_ref, forwardRef) => {
-  let {
-    className,
-    disabled,
-    id,
-    renderIcon,
-    size,
-    text,
-    type = 'gray',
-    ...other
-  } = _ref;
+const OperationalTag = /*#__PURE__*/React.forwardRef(({
+  className,
+  disabled,
+  id,
+  renderIcon,
+  size,
+  text,
+  type = 'gray',
+  ...other
+}, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
   const tagId = id || `tag-${useId.useId()}`;

package/lib/components/Tag/SelectableTag.js

@@ -30,20 +30,19 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-const SelectableTag = /*#__PURE__*/React.forwardRef((_ref, forwardRef) => {
-  let {
-    className,
-    disabled,
-    id,
-    renderIcon,
-    onChange,
-    onClick,
-    selected,
-    size,
-    text,
-    defaultSelected = false,
-    ...other
-  } = _ref;
+const SelectableTag = /*#__PURE__*/React.forwardRef(({
+  className,
+  disabled,
+  id,
+  renderIcon,
+  onChange,
+  onClick,
+  selected,
+  size,
+  text,
+  defaultSelected = false,
+  ...other
+}, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
   const tagId = id || `tag-${useId.useId()}`;

package/lib/components/Tag/Tag.Skeleton.js

@@ -21,12 +21,11 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-function TagSkeleton(_ref) {
-  let {
-    className,
-    size,
-    ...rest
-  } = _ref;
+function TagSkeleton({
+  className,
+  size,
+  ...rest
+}) {
   const prefix = usePrefix.usePrefix();
   const tagClasses = cx__default["default"](`${prefix}--tag`, `${prefix}--skeleton`, className, {
     [`${prefix}--tag--${size}`]: size,

package/lib/components/Tag/Tag.js

@@ -50,26 +50,25 @@ const SIZES = {
   md: 'md',
   lg: 'lg'
 };
-const TagBase = /*#__PURE__*/React__default["default"].forwardRef((_ref, forwardRef) => {
-  let {
-    children,
-    className,
-    decorator,
-    id,
-    type,
-    filter,
-    // remove filter in next major release - V12
-    renderIcon: CustomIconElement,
-    title = 'Clear filter',
-    // remove title in next major release - V12
-    disabled,
-    onClose,
-    // remove onClose in next major release - V12
-    size,
-    as: BaseComponent,
-    slug,
-    ...other
-  } = _ref;
+const TagBase = /*#__PURE__*/React__default["default"].forwardRef(({
+  children,
+  className,
+  decorator,
+  id,
+  type,
+  filter,
+  // remove filter in next major release - V12
+  renderIcon: CustomIconElement,
+  title = 'Clear filter',
+  // remove title in next major release - V12
+  disabled,
+  onClose,
+  // remove onClose in next major release - V12
+  size,
+  as: BaseComponent,
+  slug,
+  ...other
+}, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
   if (filter) {

package/lib/components/Text/Text.js

@@ -20,13 +20,12 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const TextBase = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
-  let {
-    as,
-    children,
-    dir = 'auto',
-    ...rest
-  } = _ref;
+const TextBase = /*#__PURE__*/React__default["default"].forwardRef(({
+  as,
+  children,
+  dir = 'auto',
+  ...rest
+}, ref) => {
   const context = React.useContext(TextDirectionContext.TextDirectionContext);
   const textProps = {};
   const BaseComponent = as ?? 'span';

package/lib/components/Text/TextDirection.js

@@ -19,12 +19,11 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const TextDirection = _ref => {
-  let {
-    children,
-    dir = 'auto',
-    getTextDirection
-  } = _ref;
+const TextDirection = ({
+  children,
+  dir = 'auto',
+  getTextDirection
+}) => {
   const savedCallback = React.useRef(getTextDirection);
   const value = React.useMemo(() => {
     return {

package/lib/components/TextArea/TextArea.js

@@ -18,7 +18,7 @@ var iconsReact = require('@carbon/icons-react');
 var usePrefix = require('../../internal/usePrefix.js');
 require('../FluidForm/FluidForm.js');
 var FormContext = require('../FluidForm/FormContext.js');
-var useAnnouncer = require('../../internal/useAnnouncer.js');
+var getAnnouncement = require('../../internal/getAnnouncement.js');
 var useIsomorphicEffect = require('../../internal/useIsomorphicEffect.js');
 var useMergedRefs = require('../../internal/useMergedRefs.js');
 var useId = require('../../internal/useId.js');
@@ -50,7 +50,7 @@ const TextArea = frFn((props, forwardRef) => {
     light,
     placeholder = '',
     enableCounter = false,
-    maxCount = undefined,
+    maxCount,
     counterMode = 'character',
     warn = false,
     warnText = '',
@@ -230,7 +230,7 @@ const TextArea = frFn((props, forwardRef) => {
   }
   const announcerRef = React.useRef(null);
   const [prevAnnouncement, setPrevAnnouncement] = React.useState('');
-  const ariaAnnouncement = useAnnouncer.useAnnouncer(textCount, maxCount, counterMode === 'word' ? 'words' : undefined);
+  const ariaAnnouncement = getAnnouncement.getAnnouncement(textCount, maxCount, counterMode === 'word' ? 'word' : undefined, counterMode === 'word' ? 'words' : undefined);
   React.useEffect(() => {
     if (ariaAnnouncement && ariaAnnouncement !== prevAnnouncement) {
       const announcer = announcerRef.current;

package/lib/components/TextInput/ControlledPasswordInput.d.ts

@@ -4,9 +4,8 @@
  * 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 interface ControlledPasswordInputProps extends ReactAttr<HTMLInputElement> {
+import React, { type HTMLAttributes } from 'react';
+export interface ControlledPasswordInputProps extends HTMLAttributes<HTMLInputElement> {
     /**
      * Provide a custom className that is applied directly to the underlying
      * `<input>` node

package/lib/components/TextInput/ControlledPasswordInput.js

@@ -26,31 +26,30 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
-const ControlledPasswordInput = /*#__PURE__*/React__default["default"].forwardRef(function ControlledPasswordInput(_ref, ref) {
-  let {
-    labelText,
-    className,
-    id,
-    placeholder,
-    onChange = noopFn.noopFn,
-    onClick = noopFn.noopFn,
-    disabled = false,
-    hideLabel,
-    invalid = false,
-    invalidText = '',
-    helperText = '',
-    light,
-    // eslint-disable-next-line react/prop-types
-    type = 'password',
-    // eslint-disable-next-line react/prop-types
-    togglePasswordVisibility,
-    tooltipPosition = 'bottom',
-    tooltipAlignment = 'center',
-    hidePasswordLabel = 'Hide password',
-    showPasswordLabel = 'Show password',
-    size = undefined,
-    ...other
-  } = _ref;
+const ControlledPasswordInput = /*#__PURE__*/React__default["default"].forwardRef(function ControlledPasswordInput({
+  labelText,
+  className,
+  id,
+  placeholder,
+  onChange = noopFn.noopFn,
+  onClick = noopFn.noopFn,
+  disabled = false,
+  hideLabel,
+  invalid = false,
+  invalidText = '',
+  helperText = '',
+  light,
+  // eslint-disable-next-line react/prop-types
+  type = 'password',
+  // eslint-disable-next-line react/prop-types
+  togglePasswordVisibility,
+  tooltipPosition = 'bottom',
+  tooltipAlignment = 'center',
+  hidePasswordLabel = 'Hide password',
+  showPasswordLabel = 'Show password',
+  size = undefined,
+  ...other
+}, ref) {
   const prefix = usePrefix.usePrefix();
   const controlledPasswordInstanceId = useId.useId();
   const errorId = id + '-error-msg';

package/lib/components/TextInput/PasswordInput.js

@@ -29,33 +29,32 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
-const PasswordInput = /*#__PURE__*/React__default["default"].forwardRef(function PasswordInput(_ref, ref) {
-  let {
-    className,
-    disabled = false,
-    helperText,
-    hideLabel,
-    hidePasswordLabel = 'Hide password',
-    id,
-    inline,
-    invalid = false,
-    invalidText,
-    labelText,
-    light,
-    onChange = () => {},
-    onClick = () => {},
-    onTogglePasswordVisibility,
-    placeholder,
-    readOnly,
-    size = 'md',
-    showPasswordLabel = 'Show password',
-    tooltipPosition = 'bottom',
-    tooltipAlignment = 'end',
-    type = 'password',
-    warn = false,
-    warnText,
-    ...rest
-  } = _ref;
+const PasswordInput = /*#__PURE__*/React__default["default"].forwardRef(function PasswordInput({
+  className,
+  disabled = false,
+  helperText,
+  hideLabel,
+  hidePasswordLabel = 'Hide password',
+  id,
+  inline,
+  invalid = false,
+  invalidText,
+  labelText,
+  light,
+  onChange = () => {},
+  onClick = () => {},
+  onTogglePasswordVisibility,
+  placeholder,
+  readOnly,
+  size = 'md',
+  showPasswordLabel = 'Show password',
+  tooltipPosition = 'bottom',
+  tooltipAlignment = 'end',
+  type = 'password',
+  warn = false,
+  warnText,
+  ...rest
+}, ref) {
   const [inputType, setInputType] = React.useState(type);
   const prefix = usePrefix.usePrefix();
   const normalizedProps = useNormalizedInputProps.useNormalizedInputProps({

package/lib/components/TextInput/TextInput.Skeleton.js

@@ -21,12 +21,11 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-const TextInputSkeleton = _ref => {
-  let {
-    hideLabel,
-    className,
-    ...rest
-  } = _ref;
+const TextInputSkeleton = ({
+  hideLabel,
+  className,
+  ...rest
+}) => {
   const prefix = usePrefix.usePrefix();
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     className: cx__default["default"](`${prefix}--form-item`, className)

package/lib/components/TextInput/TextInput.js

@@ -18,7 +18,7 @@ var util = require('./util.js');
 require('../FluidForm/FluidForm.js');
 var FormContext = require('../FluidForm/FormContext.js');
 var usePrefix = require('../../internal/usePrefix.js');
-var useAnnouncer = require('../../internal/useAnnouncer.js');
+var getAnnouncement = require('../../internal/getAnnouncement.js');
 require('../Text/index.js');
 var Text = require('../Text/Text.js');
 
@@ -28,32 +28,31 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-const TextInput = /*#__PURE__*/React__default["default"].forwardRef(function TextInput(_ref, ref) {
-  let {
-    className,
-    decorator,
-    disabled = false,
-    helperText,
-    hideLabel,
-    id,
-    inline = false,
-    invalid = false,
-    invalidText,
-    labelText,
-    light,
-    onChange = () => {},
-    onClick = () => {},
-    placeholder,
-    readOnly,
-    size,
-    type = 'text',
-    warn = false,
-    warnText,
-    enableCounter = false,
-    maxCount,
-    slug,
-    ...rest
-  } = _ref;
+const TextInput = /*#__PURE__*/React__default["default"].forwardRef(function TextInput({
+  className,
+  decorator,
+  disabled = false,
+  helperText,
+  hideLabel,
+  id,
+  inline = false,
+  invalid = false,
+  invalidText,
+  labelText,
+  light,
+  onChange = () => {},
+  onClick = () => {},
+  placeholder,
+  readOnly,
+  size,
+  type = 'text',
+  warn = false,
+  warnText,
+  enableCounter = false,
+  maxCount,
+  slug,
+  ...rest
+}, ref) {
   const prefix = usePrefix.usePrefix();
   const {
     defaultValue,
@@ -164,7 +163,7 @@ const TextInput = /*#__PURE__*/React__default["default"].forwardRef(function Tex
   } = React.useContext(FormContext.FormContext);
   const announcerRef = React.useRef(null);
   const [prevAnnouncement, setPrevAnnouncement] = React.useState('');
-  const ariaAnnouncement = useAnnouncer.useAnnouncer(textCount, maxCount);
+  const ariaAnnouncement = getAnnouncement.getAnnouncement(textCount, maxCount);
   React.useEffect(() => {
     if (ariaAnnouncement && ariaAnnouncement !== prevAnnouncement) {
       const announcer = announcerRef.current;

package/lib/components/TextInput/util.js

@@ -25,22 +25,19 @@ const helperProps = helperId => ({
  * @param {{sharedTextInputProps: object, invalid?: boolean, invalidId?: string, warn?: boolean, warnId?: string, hasHelper?: boolean, helperId?: string}} config
  * @returns {object}
  */
-const textInputProps = _ref => {
-  let {
-    sharedTextInputProps,
-    invalid,
-    invalidId,
-    warn,
-    warnId,
-    hasHelper,
-    helperId
-  } = _ref;
-  return {
-    ...sharedTextInputProps,
-    ...(invalid ? invalidProps(invalidId) : {}),
-    ...(warn ? warnProps(warnId) : {}),
-    ...(hasHelper ? helperProps(helperId) : {})
-  };
-};
+const textInputProps = ({
+  sharedTextInputProps,
+  invalid,
+  invalidId,
+  warn,
+  warnId,
+  hasHelper,
+  helperId
+}) => ({
+  ...sharedTextInputProps,
+  ...(invalid ? invalidProps(invalidId) : {}),
+  ...(warn ? warnProps(warnId) : {}),
+  ...(hasHelper ? helperProps(helperId) : {})
+});
 
 exports.textInputProps = textInputProps;

package/lib/components/Theme/index.js

@@ -26,11 +26,10 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 const ThemeContext = /*#__PURE__*/React__default["default"].createContext({
   theme: 'white'
 });
-const GlobalTheme = /*#__PURE__*/React__default["default"].forwardRef(function GlobalTheme(_ref, ref) {
-  let {
-    children,
-    theme
-  } = _ref;
+const GlobalTheme = /*#__PURE__*/React__default["default"].forwardRef(function GlobalTheme({
+  children,
+  theme
+}, ref) {
   const value = React.useMemo(() => {
     return {
       theme
@@ -57,13 +56,12 @@ GlobalTheme.propTypes = {
 /**
  * Specify the theme to be applied to a page, or a region in a page
  */
-function Theme(_ref2) {
-  let {
-    as: BaseComponent = 'div',
-    className: customClassName,
-    theme,
-    ...rest
-  } = _ref2;
+function Theme({
+  as: BaseComponent = 'div',
+  className: customClassName,
+  theme,
+  ...rest
+}) {
   const prefix = usePrefix.usePrefix();
   const className = cx__default["default"](customClassName, {
     [`${prefix}--white`]: theme === 'white',