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

package/es/components/FluidMultiSelect/FluidMultiSelect.js

@@ -7,38 +7,37 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import { FilterableMultiSelect } from '../MultiSelect/FilterableMultiSelect.js';
 import { MultiSelect } from '../MultiSelect/MultiSelect.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-const FluidMultiSelect = /*#__PURE__*/React__default.forwardRef(function FluidMultiSelect(_ref, ref) {
-  let {
-    className,
-    isCondensed,
-    isFilterable,
-    ...other
-  } = _ref;
+const FluidMultiSelect = /*#__PURE__*/React.forwardRef(function FluidMultiSelect({
+  className,
+  isCondensed,
+  isFilterable,
+  ...other
+}, ref) {
   const prefix = usePrefix();
   const classNames = cx(`${prefix}--list-box__wrapper--fluid`, className, {
     [`${prefix}--list-box__wrapper--fluid--condensed`]: isCondensed
   });
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
   }, isFilterable ?
   /*#__PURE__*/
   // @ts-ignore
-  React__default.createElement(FilterableMultiSelect, _extends({
+  React.createElement(FilterableMultiSelect, _extends({
     ref: ref,
     className: classNames
   }, other)) :
   /*#__PURE__*/
   // @ts-ignore
-  React__default.createElement(MultiSelect, _extends({
+  React.createElement(MultiSelect, _extends({
     ref: ref,
     className: classNames
   }, other)));

package/es/components/FluidNumberInput/FluidNumberInput.Skeleton.js

@@ -7,26 +7,25 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-const FluidNumberInputSkeleton = _ref => {
-  let {
-    className,
-    ...other
-  } = _ref;
+const FluidNumberInputSkeleton = ({
+  className,
+  ...other
+}) => {
   const prefix = usePrefix();
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
-  }, /*#__PURE__*/React__default.createElement("div", _extends({
+  }, /*#__PURE__*/React.createElement("div", _extends({
     className: cx(`${prefix}--form-item ${prefix}--text-input--fluid__skeleton`, className)
-  }, other), /*#__PURE__*/React__default.createElement("span", {
+  }, other), /*#__PURE__*/React.createElement("span", {
     className: `${prefix}--label ${prefix}--skeleton`
-  }), /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--skeleton ${prefix}--text-input`
   })));
 };

package/es/components/FluidNumberInput/FluidNumberInput.d.ts

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
+import { type NumberFormatOptions } from '@carbon/utilities';
 export interface FluidNumberInputProps {
     /**
      * `true` to allow empty string.
@@ -26,6 +27,13 @@ export interface FluidNumberInputProps {
      * Specify if the control should be disabled, or not
      */
     disabled?: boolean;
+    /**
+     * **Experimental:** Specify Intl.NumberFormat options applied to internal
+     * number parsing and formatting. Use with `type="text"`, has no effect when
+     * `type="number"`.
+     * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat#options
+     */
+    formatOptions?: NumberFormatOptions;
     /**
      * Provide a description for up/down icons that can be read by screen readers
      */
@@ -34,6 +42,12 @@ export interface FluidNumberInputProps {
      * Specify a custom `id` for the input
      */
     id: string;
+    /**
+     * Instruct the browser which keyboard to display on mobile devices. Note that
+     * standard numeric keyboards vary across devices and operating systems.
+     * @see https://css-tricks.com/everything-you-ever-wanted-to-know-about-inputmode/
+     */
+    inputMode?: React.HTMLAttributes<HTMLInputElement>['inputMode'];
     /**
      * Specify if the currently value is invalid.
      */
@@ -47,6 +61,12 @@ export interface FluidNumberInputProps {
      * this field is for
      */
     label?: React.ReactNode;
+    /**
+     * **Experimental:** Specify a [BCP47](https://www.ietf.org/rfc/bcp/bcp47.txt)
+     * language code for parsing and formatting. Use with `type="text"`, has no
+     * effect when `type="number"`.
+     */
+    locale?: string;
     /**
      * The maximum value.
      */
@@ -55,7 +75,15 @@ export interface FluidNumberInputProps {
      * The minimum value.
      */
     min?: number;
-    onChange?: (event: React.MouseEvent<HTMLButtonElement>, state: {
+    /**
+     * Provide an optional handler that is called when the internal state of
+     * NumberInput changes. This handler is called with event and state info.
+     * When type="number", this is called on every change of the input.
+     * When type="text", this is only called on blur after the number has been
+     * parsed and formatted.
+     * `(event, { value, direction }) => void`
+     */
+    onChange?: (event: React.MouseEvent<HTMLButtonElement> | React.FocusEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement>, state: {
         value: number | string;
         direction: string;
     }) => void;
@@ -70,6 +98,11 @@ export interface FluidNumberInputProps {
      * Provide an optional function to be called when a key is pressed in the number input
      */
     onKeyUp?: React.KeyboardEventHandler<HTMLInputElement>;
+    /**
+     * When type="text", provide an optional pattern to restrict user input. Has
+     * no effect when type="number".
+     */
+    pattern?: string;
     /**
      * Specify how much the values should increase/decrease upon clicking on up/down button
      */
@@ -78,6 +111,12 @@ export interface FluidNumberInputProps {
      * Provide custom text for the component for each translation id
      */
     translateWithId?: (id: string) => string;
+    /**
+     * **Experimental**: Specify if the input should be of type text or number.
+     * Use type="text" with `locale`, `formatOptions`, and guide user input with
+     * `pattern` and `inputMode`.
+     */
+    type?: 'number' | 'text';
     /**
      * Specify the value of the input
      */

package/es/components/FluidNumberInput/FluidNumberInput.js

@@ -7,25 +7,25 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import '../NumberInput/NumberInput.Skeleton.js';
 import { NumberInput } from '../NumberInput/NumberInput.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
+import { NumberFormatOptionsPropType } from '../NumberInput/NumberFormatPropTypes.js';
 
-const FluidNumberInput = /*#__PURE__*/React__default.forwardRef(function FluidNumberInput(_ref, ref) {
-  let {
-    className,
-    ...other
-  } = _ref;
+const FluidNumberInput = /*#__PURE__*/React.forwardRef(function FluidNumberInput({
+  className,
+  ...other
+}, ref) {
   const prefix = usePrefix();
   const classNames = cx(`${prefix}--number-input--fluid`, className);
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
-  }, /*#__PURE__*/React__default.createElement(NumberInput, _extends({
+  }, /*#__PURE__*/React.createElement(NumberInput, _extends({
     ref: ref,
     className: classNames
   }, other)));
@@ -51,6 +51,13 @@ FluidNumberInput.propTypes = {
    * Specify if the control should be disabled, or not
    */
   disabled: PropTypes.bool,
+  /**
+   * **Experimental:** Specify Intl.NumberFormat options applied to internal
+   * number parsing and formatting. Use with `type="text"`, has no effect when
+   * `type="number"`.
+   * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat#options
+   */
+  formatOptions: NumberFormatOptionsPropType,
   /**
    * Provide a description for up/down icons that can be read by screen readers
    */
@@ -59,6 +66,12 @@ FluidNumberInput.propTypes = {
    * Specify a custom `id` for the input
    */
   id: PropTypes.string.isRequired,
+  /**
+   * Instruct the browser which keyboard to display on mobile devices. Note that
+   * standard numeric keyboards vary across devices and operating systems.
+   * @see https://css-tricks.com/everything-you-ever-wanted-to-know-about-inputmode/
+   */
+  inputMode: PropTypes.oneOf(['none', 'text', 'tel', 'url', 'email', 'numeric', 'decimal', 'search']),
   /**
    * Specify if the currently value is invalid.
    */
@@ -72,6 +85,12 @@ FluidNumberInput.propTypes = {
    * this field is for
    */
   label: PropTypes.node,
+  /**
+   * **Experimental:** Specify a [BCP47](https://www.ietf.org/rfc/bcp/bcp47.txt)
+   * language code for parsing and formatting. Use with `type="text"`, has no
+   * effect when `type="number"`.
+   */
+  locale: PropTypes.string,
   /**
    * The maximum value.
    */
@@ -83,6 +102,9 @@ FluidNumberInput.propTypes = {
   /**
    * Provide an optional handler that is called when the internal state of
    * NumberInput changes. This handler is called with event and state info.
+   * When type="number", this is called on every change of the input.
+   * When type="text", this is only called on blur after the number has been
+   * parsed and formatted.
    * `(event, { value, direction }) => void`
    */
   onChange: PropTypes.func,
@@ -94,6 +116,11 @@ FluidNumberInput.propTypes = {
    * Provide an optional function to be called when a key is pressed in the number input
    */
   onKeyUp: PropTypes.func,
+  /**
+   * When type="text", provide an optional pattern to restrict user input. Has
+   * no effect when type="number".
+   */
+  pattern: PropTypes.string,
   /**
    * Specify how much the values should increase/decrease upon clicking on up/down button
    */
@@ -102,6 +129,12 @@ FluidNumberInput.propTypes = {
    * Provide custom text for the component for each translation id
    */
   translateWithId: PropTypes.func,
+  /**
+   * **Experimental**: Specify if the input should be of type text or number.
+   * Use type="text" with `locale`, `formatOptions`, and guide user input with
+   * `pattern` and `inputMode`.
+   */
+  type: PropTypes.oneOf(['number', 'text']),
   /**
    * Specify the value of the input
    */

package/es/components/FluidSearch/FluidSearch.Skeleton.js

@@ -7,26 +7,25 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-const FluidSearchSkeleton = _ref => {
-  let {
-    className,
-    ...other
-  } = _ref;
+const FluidSearchSkeleton = ({
+  className,
+  ...other
+}) => {
   const prefix = usePrefix();
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
-  }, /*#__PURE__*/React__default.createElement("div", _extends({
+  }, /*#__PURE__*/React.createElement("div", _extends({
     className: cx(`${prefix}--form-item ${prefix}--text-input--fluid__skeleton`, className)
-  }, other), /*#__PURE__*/React__default.createElement("span", {
+  }, other), /*#__PURE__*/React.createElement("span", {
     className: `${prefix}--label ${prefix}--skeleton`
-  }), /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--skeleton ${prefix}--text-input`
   })));
 };

package/es/components/FluidSearch/FluidSearch.js

@@ -7,25 +7,24 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import Search from '../Search/Search.js';
 import '../Search/Search.Skeleton.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-const FluidSearch = /*#__PURE__*/React__default.forwardRef(function FluidSearch(_ref, ref) {
-  let {
-    className,
-    ...other
-  } = _ref;
+const FluidSearch = /*#__PURE__*/React.forwardRef(function FluidSearch({
+  className,
+  ...other
+}, ref) {
   const prefix = usePrefix();
   const classNames = cx(`${prefix}--search--fluid`, className);
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
-  }, /*#__PURE__*/React__default.createElement(Search, _extends({
+  }, /*#__PURE__*/React.createElement(Search, _extends({
     ref: ref,
     className: classNames
   }, other)));

package/es/components/FluidSelect/FluidSelect.Skeleton.js

@@ -7,24 +7,23 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 
-const FluidSelectSkeleton = _ref => {
-  let {
-    className,
-    ...rest
-  } = _ref;
+const FluidSelectSkeleton = ({
+  className,
+  ...rest
+}) => {
   const prefix = usePrefix();
   const wrapperClasses = cx(className, `${prefix}--list-box__wrapper--fluid`);
-  return /*#__PURE__*/React__default.createElement("div", _extends({
+  return /*#__PURE__*/React.createElement("div", _extends({
     className: wrapperClasses
-  }, rest), /*#__PURE__*/React__default.createElement("div", {
+  }, rest), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--skeleton ${prefix}--list-box`
-  }, /*#__PURE__*/React__default.createElement("span", {
+  }, /*#__PURE__*/React.createElement("span", {
     className: `${prefix}--list-box__label`
-  }), /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--list-box__field`
   })));
 };

package/es/components/FluidSelect/FluidSelect.js

@@ -7,26 +7,25 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import Select from '../Select/Select.js';
 import '../Select/Select.Skeleton.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-const FluidSelect = /*#__PURE__*/React__default.forwardRef(function FluidSelect(_ref, ref) {
-  let {
-    className,
-    children,
-    ...other
-  } = _ref;
+const FluidSelect = /*#__PURE__*/React.forwardRef(function FluidSelect({
+  className,
+  children,
+  ...other
+}, ref) {
   const prefix = usePrefix();
   const classNames = cx(`${prefix}--select--fluid`, className);
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
-  }, /*#__PURE__*/React__default.createElement(Select, _extends({
+  }, /*#__PURE__*/React.createElement(Select, _extends({
     ref: ref,
     className: classNames
   }, other), children));

package/es/components/FluidTextArea/FluidTextArea.Skeleton.js

@@ -7,26 +7,25 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-const FluidTextAreaSkeleton = _ref => {
-  let {
-    className,
-    ...other
-  } = _ref;
+const FluidTextAreaSkeleton = ({
+  className,
+  ...other
+}) => {
   const prefix = usePrefix();
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
-  }, /*#__PURE__*/React__default.createElement("div", _extends({
+  }, /*#__PURE__*/React.createElement("div", _extends({
     className: cx(`${prefix}--form-item ${prefix}--text-area--fluid__skeleton`, className)
-  }, other), /*#__PURE__*/React__default.createElement("span", {
+  }, other), /*#__PURE__*/React.createElement("span", {
     className: `${prefix}--label ${prefix}--skeleton`
-  }), /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--skeleton ${prefix}--text-area`
   })));
 };

package/es/components/FluidTextArea/FluidTextArea.js

@@ -7,7 +7,7 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import TextArea from '../TextArea/TextArea.js';
 import '../TextArea/TextArea.Skeleton.js';
@@ -15,18 +15,17 @@ import deprecate from '../../prop-types/deprecate.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-const FluidTextArea = _ref => {
-  let {
-    className,
-    ...other
-  } = _ref;
+const FluidTextArea = ({
+  className,
+  ...other
+}) => {
   const prefix = usePrefix();
   const classNames = cx(`${prefix}--text-area--fluid`, className);
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
-  }, /*#__PURE__*/React__default.createElement(TextArea, _extends({
+  }, /*#__PURE__*/React.createElement(TextArea, _extends({
     className: classNames
   }, other)));
 };

package/es/components/FluidTextInput/FluidTextInput.Skeleton.js

@@ -7,26 +7,25 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-const FluidTextInputSkeleton = _ref => {
-  let {
-    className,
-    ...other
-  } = _ref;
+const FluidTextInputSkeleton = ({
+  className,
+  ...other
+}) => {
   const prefix = usePrefix();
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
-  }, /*#__PURE__*/React__default.createElement("div", _extends({
+  }, /*#__PURE__*/React.createElement("div", _extends({
     className: cx(`${prefix}--form-item ${prefix}--text-input--fluid__skeleton`, className)
-  }, other), /*#__PURE__*/React__default.createElement("span", {
+  }, other), /*#__PURE__*/React.createElement("span", {
     className: `${prefix}--label ${prefix}--skeleton`
-  }), /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--skeleton ${prefix}--text-input`
   })));
 };

package/es/components/FluidTextInput/FluidTextInput.js

@@ -7,7 +7,7 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import TextInput from '../TextInput/TextInput.js';
 import '../TextInput/TextInput.Skeleton.js';
@@ -16,24 +16,23 @@ import PasswordInput from '../TextInput/PasswordInput.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-const FluidTextInput = /*#__PURE__*/React__default.forwardRef(function FluidTextInput(_ref, ref) {
-  let {
-    className,
-    isPassword,
-    ...other
-  } = _ref;
+const FluidTextInput = /*#__PURE__*/React.forwardRef(function FluidTextInput({
+  className,
+  isPassword,
+  ...other
+}, ref) {
   const prefix = usePrefix();
   const classNames = cx(className, {
     [`${prefix}--text-input--fluid`]: !isPassword
   });
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: {
       isFluid: true
     }
-  }, isPassword ? /*#__PURE__*/React__default.createElement(PasswordInput, _extends({
+  }, isPassword ? /*#__PURE__*/React.createElement(PasswordInput, _extends({
     className: classNames,
     ref: ref
-  }, other)) : /*#__PURE__*/React__default.createElement(TextInput, _extends({
+  }, other)) : /*#__PURE__*/React.createElement(TextInput, _extends({
     className: classNames,
     ref: ref
   }, other)));

package/es/components/FluidTimePicker/FluidTimePicker.Skeleton.js

@@ -7,7 +7,7 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import '../FluidTextInput/FluidTextInput.js';
@@ -17,19 +17,18 @@ import '../FluidSelect/FluidSelect.js';
 import FluidSelectSkeleton from '../FluidSelect/FluidSelect.Skeleton.js';
 
 var _FluidTextInputSkelet, _FluidSelectSkeleton, _FluidSelectSkeleton2;
-const FluidTimePickerSkeleton = _ref => {
-  let {
-    className,
-    isOnlyTwo,
-    ...rest
-  } = _ref;
+const FluidTimePickerSkeleton = ({
+  className,
+  isOnlyTwo,
+  ...rest
+}) => {
   const prefix = usePrefix();
   const wrapperClasses = cx(className, `${prefix}--time-picker--fluid--skeleton`, {
     [`${prefix}--time-picker--equal-width`]: isOnlyTwo
   });
-  return /*#__PURE__*/React__default.createElement("div", _extends({
+  return /*#__PURE__*/React.createElement("div", _extends({
     className: wrapperClasses
-  }, rest), _FluidTextInputSkelet || (_FluidTextInputSkelet = /*#__PURE__*/React__default.createElement(FluidTextInputSkeleton, null)), _FluidSelectSkeleton || (_FluidSelectSkeleton = /*#__PURE__*/React__default.createElement(FluidSelectSkeleton, null)), !isOnlyTwo ? _FluidSelectSkeleton2 || (_FluidSelectSkeleton2 = /*#__PURE__*/React__default.createElement(FluidSelectSkeleton, null)) : null);
+  }, rest), _FluidTextInputSkelet || (_FluidTextInputSkelet = /*#__PURE__*/React.createElement(FluidTextInputSkeleton, null)), _FluidSelectSkeleton || (_FluidSelectSkeleton = /*#__PURE__*/React.createElement(FluidSelectSkeleton, null)), !isOnlyTwo ? _FluidSelectSkeleton2 || (_FluidSelectSkeleton2 = /*#__PURE__*/React.createElement(FluidSelectSkeleton, null)) : null);
 };
 FluidTimePickerSkeleton.propTypes = {
   /**