@carbon/react 1.6.0-rc.0 → 1.7.0

package/lib/components/Popover/index.js

@@ -13,6 +13,8 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
 var cx = require('classnames');
 var PropTypes = require('prop-types');
 var React = require('react');
+var useIsomorphicEffect = require('../../internal/useIsomorphicEffect.js');
+var useMergedRefs = require('../../internal/useMergedRefs.js');
 var usePrefix = require('../../internal/usePrefix.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -21,15 +23,22 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["align", "as", "caret", "className", "children", "dropShadow", "highContrast", "open"],
+var _excluded = ["align", "as", "autoAlign", "caret", "className", "children", "dropShadow", "highContrast", "open"],
     _excluded2 = ["className", "children"];
-var Popover = /*#__PURE__*/React__default["default"].forwardRef(function Popover(props, ref) {
+var PopoverContext = /*#__PURE__*/React__default["default"].createContext({
+  floating: {
+    current: null
+  }
+});
+var Popover = /*#__PURE__*/React__default["default"].forwardRef(function Popover(props, forwardRef) {
   var _cx;
 
   var _props$align = props.align,
       align = _props$align === void 0 ? 'bottom' : _props$align,
       _props$as = props.as,
       BaseComponent = _props$as === void 0 ? 'span' : _props$as,
+      _props$autoAlign = props.autoAlign,
+      autoAlign = _props$autoAlign === void 0 ? false : _props$autoAlign,
       _props$caret = props.caret,
       caret = _props$caret === void 0 ? true : _props$caret,
       customClassName = props.className,
@@ -42,11 +51,121 @@ var Popover = /*#__PURE__*/React__default["default"].forwardRef(function Popover
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(props, _excluded);
 
   var prefix = usePrefix.usePrefix();
-  var className = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover-container"), true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--caret"), caret), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--drop-shadow"), dropShadow), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--high-contrast"), highContrast), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--open"), open), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--").concat(align), true), _rollupPluginBabelHelpers.defineProperty(_cx, customClassName, !!customClassName), _cx));
-  return /*#__PURE__*/React__default["default"].createElement(BaseComponent, _rollupPluginBabelHelpers["extends"]({}, rest, {
+  var floating = React.useRef();
+  var popover = React.useRef();
+  var value = React.useMemo(function () {
+    return {
+      floating: floating
+    };
+  }, []);
+  var ref = useMergedRefs.useMergedRefs([forwardRef, popover]);
+
+  var _useState = React.useState(false),
+      _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+      autoAligned = _useState2[0],
+      setAutoAligned = _useState2[1];
+
+  var _useState3 = React.useState(align),
+      _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
+      autoAlignment = _useState4[0],
+      setAutoAlignment = _useState4[1];
+
+  var className = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover-container"), true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--caret"), caret), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--drop-shadow"), dropShadow), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--high-contrast"), highContrast), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--open"), open), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--").concat(autoAlignment), autoAligned), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--popover--").concat(align), !autoAligned), _rollupPluginBabelHelpers.defineProperty(_cx, customClassName, !!customClassName), _cx));
+  useIsomorphicEffect["default"](function () {
+    if (!autoAlign) {
+      setAutoAligned(false);
+      return;
+    }
+
+    if (!floating.current) {
+      return;
+    }
+
+    if (autoAligned === true) {
+      return;
+    }
+
+    var rect = floating.current.getBoundingClientRect(); // The conditions, per side, of when the popover is not visible, excluding the popover's internal padding(16)
+
+    var conditions = {
+      left: rect.x < -16,
+      top: rect.y < -16,
+      right: rect.x + (rect.width - 16) > document.documentElement.clientWidth,
+      bottom: rect.y + (rect.height - 16) > document.documentElement.clientHeight
+    };
+
+    if (!conditions.left && !conditions.top && !conditions.right && !conditions.bottom) {
+      setAutoAligned(false);
+      return;
+    }
+
+    var alignments = ['top', 'top-left', 'right-bottom', 'right', 'right-top', 'bottom-left', 'bottom', 'bottom-right', 'left-top', 'left', 'left-bottom', 'top-right']; // Creates the prioritized list of options depending on ideal alignment coming from `align`
+
+    var options = [align];
+    var option = alignments[(alignments.indexOf(align) + 1) % alignments.length];
+
+    while (option) {
+      if (options.includes(option)) {
+        break;
+      }
+
+      options.push(option);
+      option = alignments[(alignments.indexOf(option) + 1) % alignments.length];
+    }
+
+    function isVisible(alignment) {
+      popover.current.classList.add("".concat(prefix, "--popover--").concat(alignment));
+      var rect = floating.current.getBoundingClientRect(); // Check if popover is not visible to the left of the screen
+
+      if (rect.x < -16) {
+        popover.current.classList.remove("".concat(prefix, "--popover--").concat(alignment));
+        return false;
+      } // Check if popover is not visible at the top of the screen
+
+
+      if (rect.y < -16) {
+        popover.current.classList.remove("".concat(prefix, "--popover--").concat(alignment));
+        return false;
+      } // Check if popover is not visible to right of screen
+
+
+      if (rect.x + (rect.width - 16) > document.documentElement.clientWidth) {
+        popover.current.classList.remove("".concat(prefix, "--popover--").concat(alignment));
+        return false;
+      } // Check if popover is not visible to bottom of screen
+
+
+      if (rect.y + (rect.height - 16) > document.documentElement.clientHeight) {
+        popover.current.classList.remove("".concat(prefix, "--popover--").concat(alignment));
+        return false;
+      }
+
+      popover.current.classList.remove("".concat(prefix, "--popover--").concat(alignment));
+      return true;
+    }
+
+    var alignment = null;
+
+    for (var i = 0; i < options.length; i++) {
+      var _option = options[i];
+
+      if (isVisible(_option)) {
+        alignment = _option;
+        break;
+      }
+    }
+
+    if (alignment) {
+      setAutoAligned(true);
+      setAutoAlignment(alignment);
+    }
+  }, [autoAligned, align, autoAlign, prefix]);
+  return /*#__PURE__*/React__default["default"].createElement(PopoverContext.Provider, {
+    value: value
+  }, /*#__PURE__*/React__default["default"].createElement(BaseComponent, _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: className,
     ref: ref
-  }), children);
+  }), children));
 }); // Note: this displayName is temporarily set so that Storybook ArgTable
 // correctly displays the name of this component
 
@@ -66,6 +185,11 @@ Popover.propTypes = {
    */
   as: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].elementType]),
 
+  /**
+   * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to futurue changes.
+   */
+  autoAlign: PropTypes__default["default"].bool,
+
   /**
    * Specify whether a caret should be rendered
    */
@@ -97,12 +221,17 @@ Popover.propTypes = {
    */
   open: PropTypes__default["default"].bool.isRequired
 };
-var PopoverContent = /*#__PURE__*/React__default["default"].forwardRef(function PopoverContent(_ref, ref) {
+var PopoverContent = /*#__PURE__*/React__default["default"].forwardRef(function PopoverContent(_ref, forwardRef) {
   var className = _ref.className,
       children = _ref.children,
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded2);
 
   var prefix = usePrefix.usePrefix();
+
+  var _React$useContext = React__default["default"].useContext(PopoverContext),
+      floating = _React$useContext.floating;
+
+  var ref = useMergedRefs.useMergedRefs([floating, forwardRef]);
   return /*#__PURE__*/React__default["default"].createElement("span", _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: "".concat(prefix, "--popover")
   }), /*#__PURE__*/React__default["default"].createElement("span", {

package/lib/components/ProgressBar/ProgressBar.js

@@ -94,9 +94,9 @@ function ProgressBar(_ref) {
   })), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(prefix, "--progress-bar__track"),
     role: "progressbar",
+    "aria-busy": !isFinished,
     "aria-invalid": isError,
     "aria-labelledby": labelId,
-    "aria-describedby": helperText ? helperId : null,
     "aria-valuemin": !indeterminate ? 0 : null,
     "aria-valuemax": !indeterminate ? max : null,
     "aria-valuenow": !indeterminate ? cappedValue : null
@@ -106,9 +106,12 @@ function ProgressBar(_ref) {
       transform: "scaleX(".concat(percentage, ")")
     } : null
   })), helperText && /*#__PURE__*/React__default["default"].createElement("div", {
-    id: helperId,
     className: "".concat(prefix, "--progress-bar__helper-text")
-  }, helperText));
+  }, helperText, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "".concat(prefix, "--visually-hidden"),
+    "aria-live": "polite",
+    id: helperId
+  }, isFinished ? 'Done' : 'Loading')));
 }
 
 ProgressBar.propTypes = {

package/lib/components/Select/Select.js

@@ -30,18 +30,25 @@ var Select = /*#__PURE__*/React__default["default"].forwardRef(function Select(_
 
   var className = _ref.className,
       id = _ref.id,
-      inline = _ref.inline,
+      _ref$inline = _ref.inline,
+      inline = _ref$inline === void 0 ? false : _ref$inline,
       labelText = _ref.labelText,
-      disabled = _ref.disabled,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       children = _ref.children,
-      noLabel = _ref.noLabel,
-      hideLabel = _ref.hideLabel,
-      invalid = _ref.invalid,
+      _ref$noLabel = _ref.noLabel,
+      noLabel = _ref$noLabel === void 0 ? false : _ref$noLabel,
+      _ref$hideLabel = _ref.hideLabel,
+      hideLabel = _ref$hideLabel === void 0 ? false : _ref$hideLabel,
+      _ref$invalid = _ref.invalid,
+      invalid = _ref$invalid === void 0 ? false : _ref$invalid,
       invalidText = _ref.invalidText,
       helperText = _ref.helperText,
-      light = _ref.light,
+      _ref$light = _ref.light,
+      light = _ref$light === void 0 ? false : _ref$light,
       size = _ref.size,
-      warn = _ref.warn,
+      _ref$warn = _ref.warn,
+      warn = _ref$warn === void 0 ? false : _ref$warn,
       warnText = _ref.warnText,
       other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
 

package/lib/components/UIShell/HeaderMenu.js

@@ -173,7 +173,7 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
         'aria-label': ariaLabel,
         'aria-labelledby': ariaLabelledBy
       };
-      var className = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--header__submenu"), true), _rollupPluginBabelHelpers.defineProperty(_cx, customClassName, true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--header__submenu--current"), isCurrentPage), _cx)); // Notes on eslint comments and based on the examples in:
+      var className = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--header__submenu"), true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--header__submenu--current"), isCurrentPage), _rollupPluginBabelHelpers.defineProperty(_cx, customClassName, !!customClassName), _cx)); // Notes on eslint comments and based on the examples in:
       // https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/menubar-1.html#
       // - The focus is handled by the <a> menuitem, onMouseOver is for mouse
       // users

package/lib/components/UIShell/HeaderMenuButton.js

@@ -27,7 +27,7 @@ var _Menu, _Close;
 
 var _excluded = ["aria-label", "aria-labelledby", "className", "renderMenuIcon", "renderCloseIcon", "onClick", "isActive", "isCollapsible"];
 
-var HeaderMenuButton = function HeaderMenuButton(_ref) {
+function HeaderMenuButton(_ref) {
   var _cx;
 
   var ariaLabel = _ref['aria-label'],
@@ -58,7 +58,7 @@ var HeaderMenuButton = function HeaderMenuButton(_ref) {
     type: "button",
     onClick: onClick
   }), isActive ? closeIcon : menuIcon);
-};
+}
 
 HeaderMenuButton.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, AriaPropTypes.AriaLabelPropType), {}, {
   /**
@@ -74,6 +74,5 @@ HeaderMenuButton.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPlug
    */
   onClick: PropTypes__default["default"].func
 });
-var HeaderMenuButton$1 = HeaderMenuButton;
 
-exports["default"] = HeaderMenuButton$1;
+exports["default"] = HeaderMenuButton;

package/lib/components/UIShell/HeaderName.js

@@ -24,7 +24,7 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
 var _excluded = ["children", "className", "prefix", "href"];
 
-var HeaderName = function HeaderName(_ref) {
+function HeaderName(_ref) {
   var children = _ref.children,
       customClassName = _ref.className,
       prefix = _ref.prefix,
@@ -39,7 +39,7 @@ var HeaderName = function HeaderName(_ref) {
   }), prefix && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
     className: "".concat(selectorPrefix, "--header__name--prefix")
   }, prefix), "\xA0"), children);
-};
+}
 
 HeaderName.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, Link.LinkPropTypes), {}, {
   /**
@@ -67,6 +67,5 @@ HeaderName.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabe
 HeaderName.defaultProps = {
   prefix: 'IBM'
 };
-var HeaderName$1 = HeaderName;
 
-exports["default"] = HeaderName$1;
+exports["default"] = HeaderName;

package/lib/components/UIShell/HeaderNavigation.js

@@ -24,75 +24,29 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
 var _excluded = ["aria-label", "aria-labelledby", "children", "className"];
 
-var HeaderNavigation = /*#__PURE__*/function (_React$Component) {
-  _rollupPluginBabelHelpers.inherits(HeaderNavigation, _React$Component);
-
-  var _super = _rollupPluginBabelHelpers.createSuper(HeaderNavigation);
-
-  function HeaderNavigation(props) {
-    var _this;
-
-    _rollupPluginBabelHelpers.classCallCheck(this, HeaderNavigation);
-
-    _this = _super.call(this, props);
-
-    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "handleItemRef", function (index) {
-      return function (node) {
-        _this.items[index] = node;
-      };
-    });
-
-    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "_renderNavItem", function (child, index) {
-      if ( /*#__PURE__*/React__default["default"].isValidElement(child)) {
-        return /*#__PURE__*/React__default["default"].cloneElement(child, {
-          ref: _this.handleItemRef(index)
-        });
-      }
-    });
-
-    _this.items = [];
-    _this.state = {
-      selectedIndex: 0
-    };
-    return _this;
-  }
-
-  _rollupPluginBabelHelpers.createClass(HeaderNavigation, [{
-    key: "render",
-    value: function render() {
-      var prefix = this.context;
-
-      var _this$props = this.props,
-          ariaLabel = _this$props['aria-label'],
-          ariaLabelledBy = _this$props['aria-labelledby'],
-          children = _this$props.children,
-          customClassName = _this$props.className,
-          rest = _rollupPluginBabelHelpers.objectWithoutProperties(_this$props, _excluded);
-
-      var className = cx__default["default"]("".concat(prefix, "--header__nav"), customClassName); // Assign both label strategies in this option, only one should be defined
-      // so when we spread that should be the one that is applied to the node
-
-      var accessibilityLabel = {
-        'aria-label': ariaLabel,
-        'aria-labelledby': ariaLabelledBy
-      };
-      return /*#__PURE__*/React__default["default"].createElement("nav", _rollupPluginBabelHelpers["extends"]({}, rest, accessibilityLabel, {
-        className: className
-      }), /*#__PURE__*/React__default["default"].createElement("ul", _rollupPluginBabelHelpers["extends"]({}, accessibilityLabel, {
-        className: "".concat(prefix, "--header__menu-bar")
-      }), React__default["default"].Children.map(children, this._renderNavItem)));
-    }
-    /**
-     * Render an individual menuitem, adding a `ref` for each child inside of
-     * `this.items` to properly manage focus.
-     */
-
-  }]);
-
-  return HeaderNavigation;
-}(React__default["default"].Component);
-
-_rollupPluginBabelHelpers.defineProperty(HeaderNavigation, "propTypes", _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, AriaPropTypes.AriaLabelPropType), {}, {
+function HeaderNavigation(props) {
+  var ariaLabel = props['aria-label'],
+      ariaLabelledBy = props['aria-labelledby'],
+      children = props.children,
+      customClassName = props.className,
+      rest = _rollupPluginBabelHelpers.objectWithoutProperties(props, _excluded);
+
+  var prefix = usePrefix.usePrefix();
+  var className = cx__default["default"]("".concat(prefix, "--header__nav"), customClassName); // Assign both label strategies in this option, only one should be defined
+  // so when we spread that should be the one that is applied to the node
+
+  var accessibilityLabel = {
+    'aria-label': ariaLabel,
+    'aria-labelledby': ariaLabelledBy
+  };
+  return /*#__PURE__*/React__default["default"].createElement("nav", _rollupPluginBabelHelpers["extends"]({}, rest, accessibilityLabel, {
+    className: className
+  }), /*#__PURE__*/React__default["default"].createElement("ul", {
+    className: "".concat(prefix, "--header__menu-bar")
+  }, children));
+}
+
+HeaderNavigation.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, AriaPropTypes.AriaLabelPropType), {}, {
   /**
    * Provide valid children of HeaderNavigation, for example `HeaderMenuItem`
    * or `HeaderMenu`
@@ -103,8 +57,6 @@ _rollupPluginBabelHelpers.defineProperty(HeaderNavigation, "propTypes", _rollupP
    * Optionally provide a custom class to apply to the underlying <nav> node
    */
   className: PropTypes__default["default"].string
-}));
-
-_rollupPluginBabelHelpers.defineProperty(HeaderNavigation, "contextType", usePrefix.PrefixContext);
+});
 
-exports["default"] = HeaderNavigation;
+exports.HeaderNavigation = HeaderNavigation;

package/lib/components/UIShell/SideNavDetails.js

@@ -9,6 +9,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var cx = require('classnames');
 var PropTypes = require('prop-types');
 var React = require('react');
@@ -20,15 +21,19 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
+var _excluded = ["children", "className", "title"];
+
 var SideNavDetails = function SideNavDetails(_ref) {
   var children = _ref.children,
       customClassName = _ref.className,
-      title = _ref.title;
+      title = _ref.title,
+      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+
   var prefix = usePrefix.usePrefix();
   var className = cx__default["default"]("".concat(prefix, "--side-nav__details"), customClassName);
-  return /*#__PURE__*/React__default["default"].createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     className: className
-  }, /*#__PURE__*/React__default["default"].createElement("h2", {
+  }, rest), /*#__PURE__*/React__default["default"].createElement("h2", {
     className: "".concat(prefix, "--side-nav__title"),
     title: title
   }, title), children);

package/lib/components/UIShell/SideNavFooter.js

@@ -28,7 +28,7 @@ var _Close, _ChevronRight;
  * user interaction to expand or collapse the side navigation.
  */
 
-var SideNavFooter = function SideNavFooter(_ref) {
+function SideNavFooter(_ref) {
   var assistiveText = _ref.assistiveText,
       customClassName = _ref.className,
       expanded = _ref.expanded,
@@ -53,7 +53,7 @@ var SideNavFooter = function SideNavFooter(_ref) {
   }))), /*#__PURE__*/React__default["default"].createElement("span", {
     className: "".concat(prefix, "--assistive-text")
   }, assistiveText)));
-};
+}
 
 SideNavFooter.propTypes = {
   /**
@@ -68,12 +68,6 @@ SideNavFooter.propTypes = {
    */
   expanded: PropTypes__default["default"].bool.isRequired,
 
-  /**
-   * Property to indicate if the side nav container is open (or not). Use to
-   * keep local state and styling in step with the SideNav expansion state.
-   */
-  isSideNavExpanded: PropTypes__default["default"].bool,
-
   /**
    * Provide a function that is called when the toggle button is interacted
    * with. Useful for controlling the expansion state of the side navigation.
@@ -83,6 +77,5 @@ SideNavFooter.propTypes = {
 SideNavFooter.defaultProps = {
   assistiveText: 'Toggle opening or closing the side navigation'
 };
-var SideNavFooter$1 = SideNavFooter;
 
-exports["default"] = SideNavFooter$1;
+exports["default"] = SideNavFooter;

package/lib/components/UIShell/SideNavIcon.js

@@ -21,7 +21,7 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var SideNavIcon = function SideNavIcon(_ref) {
+function SideNavIcon(_ref) {
   var _cx;
 
   var children = _ref.children,
@@ -32,7 +32,7 @@ var SideNavIcon = function SideNavIcon(_ref) {
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: className
   }, children);
-};
+}
 
 SideNavIcon.propTypes = {
   /**
@@ -54,6 +54,5 @@ SideNavIcon.propTypes = {
 SideNavIcon.defaultProps = {
   small: false
 };
-var SideNavIcon$1 = SideNavIcon;
 
-exports["default"] = SideNavIcon$1;
+exports["default"] = SideNavIcon;

package/lib/components/UIShell/SideNavItem.js

@@ -21,7 +21,7 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var SideNavItem = function SideNavItem(_ref) {
+function SideNavItem(_ref) {
   var _cx;
 
   var customClassName = _ref.className,
@@ -33,11 +33,11 @@ var SideNavItem = function SideNavItem(_ref) {
   return /*#__PURE__*/React__default["default"].createElement("li", {
     className: className
   }, children);
-};
+}
 
 SideNavItem.propTypes = {
   /**
-   * Provide a single icon as the child to `SideNavIcon` to render in the
+   * Provide a single icon as the child to `SideNavItem` to render in the
    * container
    */
   children: PropTypes__default["default"].node.isRequired,
@@ -52,6 +52,5 @@ SideNavItem.propTypes = {
    */
   large: PropTypes__default["default"].bool
 };
-var SideNavItem$1 = SideNavItem;
 
-exports["default"] = SideNavItem$1;
+exports["default"] = SideNavItem;

package/lib/components/UIShell/SideNavLink.js

@@ -59,12 +59,6 @@ SideNavLink.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBab
    */
   className: PropTypes__default["default"].string,
 
-  /**
-   * Property to indicate if the side nav container is open (or not). Use to
-   * keep local state and styling in step with the SideNav expansion state.
-   */
-  isSideNavExpanded: PropTypes__default["default"].bool,
-
   /**
    * Specify if this is a large variation of the SideNavLink
    */

package/lib/components/UIShell/SideNavLinkText.js

@@ -23,7 +23,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var _excluded = ["className", "children"];
 
-var SideNavLinkText = function SideNavLinkText(_ref) {
+function SideNavLinkText(_ref) {
   var customClassName = _ref.className,
       children = _ref.children,
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
@@ -33,7 +33,7 @@ var SideNavLinkText = function SideNavLinkText(_ref) {
   return /*#__PURE__*/React__default["default"].createElement("span", _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: className
   }), children);
-};
+}
 
 SideNavLinkText.propTypes = {
   /**
@@ -46,6 +46,5 @@ SideNavLinkText.propTypes = {
    */
   className: PropTypes__default["default"].string
 };
-var SideNavLinkText$1 = SideNavLinkText;
 
-exports["default"] = SideNavLinkText$1;
+exports["default"] = SideNavLinkText;