@carbon/react 1.17.0-rc.2 → 1.18.0-rc.0

package/es/components/DataTable/tools/denormalize.js

@@ -38,6 +38,4 @@ var denormalize = function denormalize(rowIds, rowsById, cellsById) {
   });
 };
 
-var denormalize$1 = denormalize;
-
-export { denormalize$1 as default };
+export { denormalize as default };

package/es/components/DataTable/tools/instanceId.js

@@ -16,6 +16,4 @@ var setupGetInstanceId = function setupGetInstanceId() {
   };
 };
 
-var setupGetInstanceId$1 = setupGetInstanceId;
-
-export { setupGetInstanceId$1 as default };
+export { setupGetInstanceId as default };

package/es/components/DataTable/tools/normalize.js

@@ -73,6 +73,4 @@ var normalize = function normalize(rows, headers) {
   };
 };
 
-var normalize$1 = normalize;
-
-export { normalize$1 as default };
+export { normalize as default };

package/es/components/DataTableSkeleton/DataTableSkeleton.js

@@ -128,6 +128,5 @@ DataTableSkeleton.defaultProps = {
   showHeader: true,
   showToolbar: true
 };
-var DataTableSkeleton$1 = DataTableSkeleton;
 
-export { DataTableSkeleton$1 as default };
+export { DataTableSkeleton as default };

package/es/components/DatePicker/DatePicker.Skeleton.js

@@ -64,6 +64,5 @@ DatePickerSkeleton.propTypes = {
    */
   range: PropTypes.bool
 };
-var DatePickerSkeleton$1 = DatePickerSkeleton;
 
-export { DatePickerSkeleton$1 as default };
+export { DatePickerSkeleton as default };

package/es/components/DatePicker/DatePicker.js

@@ -16,14 +16,15 @@ import carbonFlatpickrAppendToPlugin from './plugins/appendToPlugin.js';
 import carbonFlatpickrFixEventsPlugin from './plugins/fixEventsPlugin.js';
 import carbonFlatpickrRangePlugin from './plugins/rangePlugin.js';
 import deprecate from '../../prop-types/deprecate.js';
+import { Escape, ArrowDown } from '../../internal/keyboard/keys.js';
+import { match } from '../../internal/keyboard/match.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { useSavedCallback } from '../../internal/useSavedCallback.js';
-import { WarningFilled, WarningAltFilled } from '@carbon/icons-react';
+import '../FluidForm/FluidForm.js';
 import { FormContext } from '../FluidForm/FormContext.js';
-import { match } from '../../internal/keyboard/match.js';
-import { ArrowDown } from '../../internal/keyboard/keys.js';
+import { WarningFilled, WarningAltFilled } from '@carbon/icons-react';
 
-var _excluded = ["allowInput", "appendTo", "children", "className", "closeOnSelect", "dateFormat", "datePickerType", "disable", "enable", "inline", "invalid", "invalidText", "warn", "warnText", "light", "locale", "maxDate", "minDate", "onChange", "onClose", "onOpen", "short", "value"];
+var _excluded = ["allowInput", "appendTo", "children", "className", "closeOnSelect", "dateFormat", "datePickerType", "disable", "enable", "inline", "invalid", "invalidText", "warn", "warnText", "light", "locale", "maxDate", "minDate", "onChange", "onClose", "onOpen", "readOnly", "short", "value"];
 
 l10n.en.weekdays.shorthand.forEach(function (_day, index) {
   var currentDay = l10n.en.weekdays.shorthand;
@@ -84,13 +85,15 @@ var carbonFlatpickrMonthSelectPlugin = function carbonFlatpickrMonthSelectPlugin
     };
 
     var updateCurrentMonth = function updateCurrentMonth() {
-      var monthStr = monthToStr(fp.currentMonth, config.shorthand === true, fp.l10n);
-      fp.yearElements.forEach(function (elem) {
-        var currentMonthContainer = elem.closest(config.selectorFlatpickrMonthYearContainer);
-        Array.prototype.forEach.call(currentMonthContainer.querySelectorAll('.cur-month'), function (monthElement) {
-          monthElement.textContent = monthStr;
+      if (fp.monthElements) {
+        var monthStr = monthToStr(fp.currentMonth, config.shorthand === true, fp.l10n);
+        fp.yearElements.forEach(function (elem) {
+          var currentMonthContainer = elem.closest(config.selectorFlatpickrMonthYearContainer);
+          Array.prototype.forEach.call(currentMonthContainer.querySelectorAll('.cur-month'), function (monthElement) {
+            monthElement.textContent = monthStr;
+          });
         });
-      });
+      }
     };
 
     var register = function register() {
@@ -176,6 +179,8 @@ var DatePicker = /*#__PURE__*/React__default.forwardRef(function DatePicker(_ref
       onChange = _ref.onChange,
       onClose = _ref.onClose,
       onOpen = _ref.onOpen,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       _ref$short = _ref.short,
       short = _ref$short === void 0 ? false : _ref$short,
       value = _ref.value,
@@ -198,26 +203,30 @@ var DatePicker = /*#__PURE__*/React__default.forwardRef(function DatePicker(_ref
     if (index === 0 && child.type === React__default.createElement(DatePickerInput, child.props).type) {
       return /*#__PURE__*/React__default.cloneElement(child, {
         datePickerType: datePickerType,
-        ref: startInputField
+        ref: startInputField,
+        readOnly: readOnly
       });
     }
 
     if (index === 1 && child.type === React__default.createElement(DatePickerInput, child.props).type) {
       return /*#__PURE__*/React__default.cloneElement(child, {
         datePickerType: datePickerType,
-        ref: endInputField
+        ref: endInputField,
+        readOnly: readOnly
       });
     }
 
     if (index === 0) {
       return /*#__PURE__*/React__default.cloneElement(child, {
-        ref: startInputField
+        ref: startInputField,
+        readOnly: readOnly
       });
     }
 
     if (index === 1) {
       return /*#__PURE__*/React__default.cloneElement(child, {
-        ref: endInputField
+        ref: endInputField,
+        readOnly: readOnly
       });
     }
   });
@@ -234,6 +243,14 @@ var DatePicker = /*#__PURE__*/React__default.forwardRef(function DatePicker(_ref
 
     var onHook = function onHook(_electedDates, _dateStr, instance, prefix) {
       updateClassNames(instance, prefix);
+
+      if (startInputField !== null && startInputField !== void 0 && startInputField.current) {
+        startInputField.current.readOnly = readOnly;
+      }
+
+      if (endInputField !== null && endInputField !== void 0 && endInputField.current) {
+        endInputField.current.readOnly = readOnly;
+      }
     }; // Logic to determine if `enable` or `disable` will be passed down. If neither
     // is provided, we return the default empty disabled array, allowing all dates.
 
@@ -281,8 +298,8 @@ var DatePicker = /*#__PURE__*/React__default.forwardRef(function DatePicker(_ref
     }), carbonFlatpickrFixEventsPlugin({
       inputFrom: startInputField.current,
       inputTo: endInputField.current
-    })]), _defineProperty(_flatpickr, "clickOpens", true), _defineProperty(_flatpickr, "nextArrow", rightArrowHTML), _defineProperty(_flatpickr, "prevArrow", leftArrowHTML), _defineProperty(_flatpickr, "onChange", function onChange() {
-      if (savedOnChange) {
+    })]), _defineProperty(_flatpickr, "clickOpens", !readOnly), _defineProperty(_flatpickr, "noCalendar", readOnly), _defineProperty(_flatpickr, "nextArrow", rightArrowHTML), _defineProperty(_flatpickr, "prevArrow", leftArrowHTML), _defineProperty(_flatpickr, "onChange", function onChange() {
+      if (savedOnChange && !readOnly) {
         savedOnChange.apply(void 0, arguments);
       }
     }), _defineProperty(_flatpickr, "onClose", savedOnClose), _defineProperty(_flatpickr, "onReady", onHook), _defineProperty(_flatpickr, "onMonthChange", onHook), _defineProperty(_flatpickr, "onYearChange", onHook), _defineProperty(_flatpickr, "onOpen", function onOpen() {
@@ -292,6 +309,10 @@ var DatePicker = /*#__PURE__*/React__default.forwardRef(function DatePicker(_ref
     calendarRef.current = calendar;
 
     function handleArrowDown(event) {
+      if (match(event, Escape)) {
+        calendar.calendarContainer.classList.remove('open');
+      }
+
       if (match(event, ArrowDown)) {
         var calendarContainer = calendar.calendarContainer,
             fpSelectedDateElem = calendar.selectedDateElem,
@@ -303,6 +324,10 @@ var DatePicker = /*#__PURE__*/React__default.forwardRef(function DatePicker(_ref
     }
 
     function handleOnChange() {
+      if (datePickerType == 'single') {
+        calendar.calendarContainer.classList.remove('open');
+      }
+
       if (start.value !== '') {
         return;
       }
@@ -321,13 +346,16 @@ var DatePicker = /*#__PURE__*/React__default.forwardRef(function DatePicker(_ref
 
     if (start) {
       start.addEventListener('keydown', handleArrowDown);
-      start.addEventListener('change', handleOnChange); // Flatpickr's calendar dialog is not rendered in a landmark causing an
-      // error with IBM Equal Access Accessibility Checker so we add an aria
-      // role to the container div.
+      start.addEventListener('change', handleOnChange);
 
-      calendar.calendarContainer.setAttribute('role', 'application'); // IBM EAAC requires an aria-label on a role='region'
+      if (calendar && calendar.calendarContainer) {
+        // Flatpickr's calendar dialog is not rendered in a landmark causing an
+        // error with IBM Equal Access Accessibility Checker so we add an aria
+        // role to the container div.
+        calendar.calendarContainer.setAttribute('role', 'application'); // IBM EAAC requires an aria-label on a role='region'
 
-      calendar.calendarContainer.setAttribute('aria-label', 'calendar-container');
+        calendar.calendarContainer.setAttribute('aria-label', 'calendar-container');
+      }
     }
 
     if (end) {
@@ -353,42 +381,56 @@ var DatePicker = /*#__PURE__*/React__default.forwardRef(function DatePicker(_ref
         end.removeEventListener('change', handleOnChange);
       }
     };
-  }, [savedOnChange, savedOnClose, savedOnOpen]); //eslint-disable-line react-hooks/exhaustive-deps
+  }, [savedOnChange, savedOnClose, savedOnOpen, readOnly]); //eslint-disable-line react-hooks/exhaustive-deps
 
   useEffect(function () {
-    if (calendarRef.current) {
+    var _calendarRef$current;
+
+    if (calendarRef !== null && calendarRef !== void 0 && (_calendarRef$current = calendarRef.current) !== null && _calendarRef$current !== void 0 && _calendarRef$current.set) {
       calendarRef.current.set({
         dateFormat: dateFormat
       });
     }
   }, [dateFormat]);
   useEffect(function () {
-    if (calendarRef.current) {
+    var _calendarRef$current2;
+
+    if (calendarRef !== null && calendarRef !== void 0 && (_calendarRef$current2 = calendarRef.current) !== null && _calendarRef$current2 !== void 0 && _calendarRef$current2.set) {
       calendarRef.current.set('minDate', minDate);
     }
   }, [minDate]);
   useEffect(function () {
-    if (calendarRef.current) {
+    var _calendarRef$current3;
+
+    if (calendarRef !== null && calendarRef !== void 0 && (_calendarRef$current3 = calendarRef.current) !== null && _calendarRef$current3 !== void 0 && _calendarRef$current3.set) {
       calendarRef.current.set('maxDate', maxDate);
     }
   }, [maxDate]);
   useEffect(function () {
-    if (calendarRef.current && disable) {
-      calendarRef.current.set('disbale', disable);
+    var _calendarRef$current4;
+
+    if (calendarRef !== null && calendarRef !== void 0 && (_calendarRef$current4 = calendarRef.current) !== null && _calendarRef$current4 !== void 0 && _calendarRef$current4.set && disable) {
+      calendarRef.current.set('disable', disable);
     }
   }, [disable]);
   useEffect(function () {
-    if (calendarRef.current && enable) {
+    var _calendarRef$current5;
+
+    if (calendarRef !== null && calendarRef !== void 0 && (_calendarRef$current5 = calendarRef.current) !== null && _calendarRef$current5 !== void 0 && _calendarRef$current5.set && enable) {
       calendarRef.current.set('enable', enable);
     }
   }, [enable]);
   useEffect(function () {
-    if (calendarRef.current && inline) {
+    var _calendarRef$current6;
+
+    if (calendarRef !== null && calendarRef !== void 0 && (_calendarRef$current6 = calendarRef.current) !== null && _calendarRef$current6 !== void 0 && _calendarRef$current6.set && inline) {
       calendarRef.current.set('inline', inline);
     }
   }, [inline]);
   useEffect(function () {
-    if (calendarRef.current) {
+    var _calendarRef$current7;
+
+    if (calendarRef !== null && calendarRef !== void 0 && (_calendarRef$current7 = calendarRef.current) !== null && _calendarRef$current7 !== void 0 && _calendarRef$current7.set) {
       if (value !== undefined) {
         calendarRef.current.setDate(value);
       }
@@ -591,6 +633,13 @@ DatePicker.propTypes = {
    */
   onOpen: PropTypes.func,
 
+  /**
+   * whether the DatePicker is to be readOnly
+   * if boolean applies to all inputs
+   * if array applies to each input in order
+   */
+  readOnly: PropTypes.oneOfType([PropTypes.bool, PropTypes.array]),
+
   /**
    * `true` to use the short version.
    */
@@ -612,6 +661,5 @@ DatePicker.propTypes = {
    */
   warnText: PropTypes.node
 };
-var DatePicker$1 = DatePicker;
 
-export { DatePicker$1 as default };
+export { DatePicker as default };

package/es/components/DatePicker/plugins/fixEventsPlugin.js

@@ -5,8 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { match } from '../../../internal/keyboard/match.js';
 import { Enter, ArrowLeft, ArrowRight, ArrowDown } from '../../../internal/keyboard/keys.js';
+import { match } from '../../../internal/keyboard/match.js';
 
 /**
  * @param {object} config Plugin configuration.

package/es/components/DatePickerInput/DatePickerInput.js

@@ -5,12 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { WarningFilled, WarningAltFilled, Calendar } from '@carbon/icons-react';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React__default, { useContext } from 'react';
 import { usePrefix } from '../../internal/usePrefix.js';
+import '../FluidForm/FluidForm.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
 var _excluded = ["datePickerType", "disabled", "helperText", "hideLabel", "id", "invalid", "invalidText", "labelText", "onClick", "onChange", "pattern", "placeholder", "size", "type", "warn", "warnText"];
@@ -64,20 +65,22 @@ var DatePickerInput = /*#__PURE__*/React__default.forwardRef(function DatePicker
     type: type
   };
   var wrapperClasses = cx("".concat(prefix, "--date-picker-input__wrapper"), (_cx = {}, _defineProperty(_cx, "".concat(prefix, "--date-picker-input__wrapper--invalid"), invalid), _defineProperty(_cx, "".concat(prefix, "--date-picker-input__wrapper--warn"), warn), _cx));
-  var labelClasses = cx("".concat(prefix, "--label"), (_cx2 = {}, _defineProperty(_cx2, "".concat(prefix, "--visually-hidden"), hideLabel), _defineProperty(_cx2, "".concat(prefix, "--label--disabled"), disabled), _cx2));
+  var labelClasses = cx("".concat(prefix, "--label"), (_cx2 = {}, _defineProperty(_cx2, "".concat(prefix, "--visually-hidden"), hideLabel), _defineProperty(_cx2, "".concat(prefix, "--label--disabled"), disabled), _defineProperty(_cx2, "".concat(prefix, "--label--readonly"), rest.readOnly), _cx2));
   var helperTextClasses = cx("".concat(prefix, "--form__helper-text"), _defineProperty({}, "".concat(prefix, "--form__helper-text--disabled"), disabled));
   var inputClasses = cx("".concat(prefix, "--date-picker__input"), (_cx4 = {}, _defineProperty(_cx4, "".concat(prefix, "--date-picker__input--").concat(size), size), _defineProperty(_cx4, "".concat(prefix, "--date-picker__input--invalid"), invalid), _defineProperty(_cx4, "".concat(prefix, "--date-picker__input--warn"), warn), _cx4));
   var containerClasses = cx("".concat(prefix, "--date-picker-container"), (_cx5 = {}, _defineProperty(_cx5, "".concat(prefix, "--date-picker--nolabel"), !labelText), _defineProperty(_cx5, "".concat(prefix, "--date-picker--fluid--invalid"), isFluid && invalid), _defineProperty(_cx5, "".concat(prefix, "--date-picker--fluid--warn"), isFluid && warn), _cx5));
-  var input = invalid ? /*#__PURE__*/React__default.createElement("input", _extends({}, rest, datePickerInputProps, {
-    disabled: disabled,
-    ref: ref,
-    "data-invalid": true,
-    className: inputClasses
-  })) : /*#__PURE__*/React__default.createElement("input", _extends({}, rest, datePickerInputProps, {
-    disabled: disabled,
+
+  var inputProps = _objectSpread2(_objectSpread2(_objectSpread2({}, rest), datePickerInputProps), {}, {
     className: inputClasses,
+    disabled: disabled,
     ref: ref
-  }));
+  });
+
+  if (invalid) {
+    inputProps['data-invalid'] = true;
+  }
+
+  var input = /*#__PURE__*/React__default.createElement("input", inputProps);
   return /*#__PURE__*/React__default.createElement("div", {
     className: containerClasses
   }, labelText && /*#__PURE__*/React__default.createElement("label", {
@@ -180,6 +183,11 @@ DatePickerInput.propTypes = {
    */
   placeholder: PropTypes.string,
 
+  /**
+   * whether the DatePicker is to be readOnly
+   */
+  readOnly: PropTypes.bool,
+
   /**
    * Specify the size of the Date Picker Input. Currently supports either `sm`, `md`, or `lg` as an option.
    */
@@ -255,6 +263,5 @@ DatePickerIcon.propTypes = {
    */
   warn: PropTypes.bool
 };
-var DatePickerInput$1 = DatePickerInput;
 
-export { DatePickerInput$1 as default };
+export { DatePickerInput as default };

package/es/components/Dropdown/Dropdown.Skeleton.js

@@ -9,6 +9,7 @@ import { objectWithoutProperties as _objectWithoutProperties, defineProperty as
 import PropTypes from 'prop-types';
 import React__default from 'react';
 import cx from 'classnames';
+import '../ListBox/index.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { ListBoxSize } from '../ListBox/ListBoxPropTypes.js';
 
@@ -41,6 +42,5 @@ DropdownSkeleton.propTypes = {
    */
   size: ListBoxSize
 };
-var DropdownSkeleton$1 = DropdownSkeleton;
 
-export { DropdownSkeleton$1 as default };
+export { DropdownSkeleton as default };

package/es/components/Dropdown/Dropdown.js

@@ -16,9 +16,10 @@ import mergeRefs from '../../tools/mergeRefs.js';
 import deprecate from '../../prop-types/deprecate.js';
 import { useFeatureFlag } from '../FeatureFlags/index.js';
 import { usePrefix } from '../../internal/usePrefix.js';
+import '../FluidForm/FluidForm.js';
 import { FormContext } from '../FluidForm/FormContext.js';
-import ListBox from '../ListBox/ListBox.js';
 import { ListBoxSize, ListBoxType } from '../ListBox/ListBoxPropTypes.js';
+import ListBox from '../ListBox/ListBox.js';
 
 var _excluded = ["className", "disabled", "direction", "items", "label", "ariaLabel", "itemToString", "itemToElement", "renderSelectedItem", "type", "size", "onChange", "id", "titleText", "hideLabel", "helperText", "translateWithId", "light", "invalid", "invalidText", "warn", "warnText", "initialSelectedItem", "selectedItem", "downshiftProps"];
 
@@ -328,6 +329,5 @@ Dropdown.defaultProps = {
   helperText: '',
   direction: 'bottom'
 };
-var Dropdown$1 = Dropdown;
 
-export { Dropdown$1 as default };
+export { Dropdown as default };

package/es/components/ErrorBoundary/ErrorBoundary.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, defineProperty as _defineProperty, assertThisInitialized as _assertThisInitialized, createClass as _createClass } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { inherits as _inherits, createSuper as _createSuper, createClass as _createClass, defineProperty as _defineProperty, classCallCheck as _classCallCheck, assertThisInitialized as _assertThisInitialized } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
 import PropTypes from 'prop-types';
 import { ErrorBoundaryContext } from './ErrorBoundaryContext.js';

package/es/components/ExpandableSearch/ExpandableSearch.js

@@ -9,6 +9,7 @@ import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _
 import React__default, { useState, useRef } from 'react';
 import cx from 'classnames';
 import Search from '../Search/Search.js';
+import '../Search/Search.Skeleton.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { composeEventHandlers } from '../../tools/events.js';
 

package/es/components/FileUploader/FileUploader.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, defineProperty as _defineProperty, assertThisInitialized as _assertThisInitialized, createClass as _createClass, objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { inherits as _inherits, createSuper as _createSuper, createClass as _createClass, defineProperty as _defineProperty, classCallCheck as _classCallCheck, assertThisInitialized as _assertThisInitialized, objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import * as FeatureFlags from '@carbon/feature-flags';
@@ -13,9 +13,9 @@ import React__default from 'react';
 import Filename from './Filename.js';
 import FileUploaderButton from './FileUploaderButton.js';
 import { ButtonKinds } from '../../prop-types/types.js';
-import { PrefixContext } from '../../internal/usePrefix.js';
-import { matches } from '../../internal/keyboard/match.js';
 import { Enter, Space } from '../../internal/keyboard/keys.js';
+import { matches } from '../../internal/keyboard/match.js';
+import { PrefixContext } from '../../internal/usePrefix.js';
 
 var _excluded = ["iconDescription", "buttonLabel", "buttonKind", "disabled", "filenameStatus", "labelDescription", "labelTitle", "className", "multiple", "accept", "name", "size", "onDelete"];
 

package/es/components/FileUploader/FileUploaderButton.js

@@ -9,12 +9,12 @@ import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React__default, { useState, useRef } from 'react';
+import { Enter, Space } from '../../internal/keyboard/keys.js';
+import { matches } from '../../internal/keyboard/match.js';
 import { ButtonKinds } from '../../prop-types/types.js';
 import uniqueId from '../../tools/uniqueId.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import * as FeatureFlags from '@carbon/feature-flags';
-import { matches } from '../../internal/keyboard/match.js';
-import { Enter, Space } from '../../internal/keyboard/keys.js';
 
 var _excluded = ["accept", "buttonKind", "className", "disabled", "disableLabelChanges", "id", "labelText", "multiple", "onChange", "role", "name", "size", "tabIndex", "innerRef"];
 

package/es/components/FileUploader/FileUploaderDropContainer.js

@@ -9,10 +9,10 @@ import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _
 import React__default, { useRef, useState } from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
+import { Enter, Space } from '../../internal/keyboard/keys.js';
+import { matches } from '../../internal/keyboard/match.js';
 import uniqueId from '../../tools/uniqueId.js';
 import { usePrefix } from '../../internal/usePrefix.js';
-import { matches } from '../../internal/keyboard/match.js';
-import { Enter, Space } from '../../internal/keyboard/keys.js';
 
 var _excluded = ["accept", "className", "id", "disabled", "labelText", "multiple", "name", "onAddFiles", "pattern", "role", "tabIndex", "innerRef"];
 

package/es/components/FileUploader/FileUploaderItem.js

@@ -10,11 +10,11 @@ import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React__default, { useRef } from 'react';
 import Filename from './Filename.js';
+import { Enter, Space } from '../../internal/keyboard/keys.js';
+import { matches } from '../../internal/keyboard/match.js';
 import uniqueId from '../../tools/uniqueId.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import * as FeatureFlags from '@carbon/feature-flags';
-import { matches } from '../../internal/keyboard/match.js';
-import { Enter, Space } from '../../internal/keyboard/keys.js';
 
 var _excluded = ["uuid", "name", "status", "iconDescription", "onDelete", "invalid", "errorSubject", "errorBody", "size"];
 

package/es/components/FluidComboBox/FluidComboBox.Skeleton.js

@@ -36,6 +36,5 @@ FluidComboBoxSkeleton.propTypes = {
    */
   className: PropTypes.string
 };
-var FluidComboBoxSkeleton$1 = FluidComboBoxSkeleton;
 
-export { FluidComboBoxSkeleton$1 as default };
+export { FluidComboBoxSkeleton as default };

package/es/components/FluidComboBox/FluidComboBox.js

@@ -135,6 +135,5 @@ FluidComboBox.propTypes = {
    */
   warnText: PropTypes.node
 };
-var FluidComboBox$1 = FluidComboBox;
 
-export { FluidComboBox$1 as default };
+export { FluidComboBox as default };

package/es/components/FluidDatePicker/FluidDatePicker.Skeleton.js

@@ -0,0 +1,67 @@
+/**
+ * Copyright IBM Corp. 2016, 2022
+ *
+ * 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 { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import PropTypes from 'prop-types';
+import React__default from 'react';
+import cx from 'classnames';
+import { usePrefix } from '../../internal/usePrefix.js';
+import { FormContext } from '../FluidForm/FormContext.js';
+import { Calendar } from '@carbon/icons-react';
+
+var _excluded = ["className", "datePickerType"];
+
+function FluidDatePickerSkeleton(_ref) {
+  var className = _ref.className,
+      _ref$datePickerType = _ref.datePickerType,
+      datePickerType = _ref$datePickerType === void 0 ? 'single' : _ref$datePickerType,
+      other = _objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix();
+  var classNames = cx(className, "".concat(prefix, "--form-item ").concat(prefix, "--date-picker--fluid__skeleton"), _defineProperty({}, "".concat(prefix, "--date-picker--fluid__skeleton--range"), datePickerType === 'range'));
+  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
+    value: {
+      isFluid: true
+    }
+  }, /*#__PURE__*/React__default.createElement("div", _extends({
+    className: classNames
+  }, other), /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(prefix, "--date-picker--fluid__skeleton--container")
+  }, /*#__PURE__*/React__default.createElement("span", {
+    className: "".concat(prefix, "--label ").concat(prefix, "--skeleton")
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(prefix, "--skeleton ").concat(prefix, "--text-input")
+  }), datePickerType !== 'simple' && /*#__PURE__*/React__default.createElement(Calendar, {
+    className: "".concat(prefix, "--date-picker__icon"),
+    role: "img",
+    "aria-hidden": "true"
+  })), datePickerType === 'range' && /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(prefix, "--date-picker--fluid__skeleton--container")
+  }, /*#__PURE__*/React__default.createElement("span", {
+    className: "".concat(prefix, "--label ").concat(prefix, "--skeleton")
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: "".concat(prefix, "--skeleton ").concat(prefix, "--text-input")
+  }), /*#__PURE__*/React__default.createElement(Calendar, {
+    className: "".concat(prefix, "--date-picker__icon"),
+    role: "img",
+    "aria-hidden": "true"
+  }))));
+}
+
+FluidDatePickerSkeleton.propTypes = {
+  /**
+   * Specify an optional className to be applied to the outer FluidForm wrapper
+   */
+  className: PropTypes.string,
+
+  /**
+   * Specify which variant of the DatePicker the skeleton should mimic
+   */
+  datePickerType: PropTypes.oneOf(['simple', 'single', 'range'])
+};
+
+export { FluidDatePickerSkeleton as default };

package/es/components/FluidDatePicker/FluidDatePicker.js

@@ -9,6 +9,7 @@ import { objectWithoutProperties as _objectWithoutProperties, defineProperty as
 import PropTypes from 'prop-types';
 import React__default from 'react';
 import cx from 'classnames';
+import '../DatePicker/DatePicker.Skeleton.js';
 import DatePicker from '../DatePicker/DatePicker.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
@@ -71,6 +72,5 @@ FluidDatePicker.propTypes = {
    */
   warnText: PropTypes.node
 };
-var FluidDatePicker$1 = FluidDatePicker;
 
-export { FluidDatePicker$1 as default };
+export { FluidDatePicker as default };

package/es/components/FluidDatePickerInput/FluidDatePickerInput.js

@@ -21,6 +21,5 @@ var FluidDatePickerInput = /*#__PURE__*/React__default.forwardRef(function Fluid
     ref: ref
   }, other)));
 });
-var FluidDatePickerInput$1 = FluidDatePickerInput;
 
-export { FluidDatePickerInput$1 as default };
+export { FluidDatePickerInput as default };

package/es/components/FluidDropdown/FluidDropdown.Skeleton.js

@@ -36,6 +36,5 @@ FluidDropdownSkeleton.propTypes = {
    */
   className: PropTypes.string
 };
-var FluidDropdownSkeleton$1 = FluidDropdownSkeleton;
 
-export { FluidDropdownSkeleton$1 as default };
+export { FluidDropdownSkeleton as default };

package/es/components/FluidDropdown/FluidDropdown.js

@@ -9,6 +9,7 @@ import { objectWithoutProperties as _objectWithoutProperties, defineProperty as
 import PropTypes from 'prop-types';
 import React__default from 'react';
 import cx from 'classnames';
+import '../Dropdown/Dropdown.Skeleton.js';
 import Dropdown from '../Dropdown/Dropdown.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
@@ -135,6 +136,5 @@ FluidDropdown.propTypes = {
    */
   warnText: PropTypes.node
 };
-var FluidDropdown$1 = FluidDropdown;
 
-export { FluidDropdown$1 as default };
+export { FluidDropdown as default };

package/es/components/FluidMultiSelect/FluidMultiSelect.Skeleton.js

@@ -36,6 +36,5 @@ FluidMultiSelectSkeleton.propTypes = {
    */
   className: PropTypes.string
 };
-var FluidMultiSelectSkeleton$1 = FluidMultiSelectSkeleton;
 
-export { FluidMultiSelectSkeleton$1 as default };
+export { FluidMultiSelectSkeleton as default };