@zendeskgarden/react-chrome 8.62.1 → 8.63.0

package/dist/index.cjs.js

@@ -7,8 +7,6 @@
 
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var React = require('react');
 var PropTypes = require('prop-types');
 var styled = require('styled-components');
@@ -19,7 +17,7 @@ var containerUtilities = require('@zendeskgarden/container-utilities');
 var reactUid = require('react-uid');
 var mergeRefs = require('react-merge-refs');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -35,15 +33,14 @@ function _interopNamespace(e) {
       }
     });
   }
-  n["default"] = e;
+  n.default = e;
   return Object.freeze(n);
 }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
-var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-var mergeRefs__default = /*#__PURE__*/_interopDefaultLegacy(mergeRefs);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+var mergeRefs__default = /*#__PURE__*/_interopDefault(mergeRefs);
 
 function _extends$3() {
   _extends$3 = Object.assign ? Object.assign.bind() : function (target) {
@@ -60,7 +57,7 @@ function _extends$3() {
   return _extends$3.apply(this, arguments);
 }
 
-const ChromeContext = React__default["default"].createContext({
+const ChromeContext = React__namespace.default.createContext({
   hue: 'chromeHue'
 });
 const useChromeContext = () => {
@@ -68,9 +65,9 @@ const useChromeContext = () => {
 };
 
 const COMPONENT_ID$A = 'chrome.chrome';
-const StyledChrome = styled__default["default"].div.attrs({
+const StyledChrome = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$A,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledChrome",
   componentId: "sc-1uqm6u6-0"
@@ -80,9 +77,9 @@ StyledChrome.defaultProps = {
 };
 
 const COMPONENT_ID$z = 'chrome.header_item_icon';
-const StyledHeaderItemIcon = styled__default["default"].div.attrs({
+const StyledHeaderItemIcon = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$z,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledHeaderItemIcon",
   componentId: "sc-1jhhp6z-0"
@@ -97,9 +94,9 @@ const sizeStyles$4 = props => {
   const size = props.theme.space.base * 7.5;
   return styled.css(["padding:0 3px;min-width:", "px;height:", ";line-height:", ";"], size, props.maxY ? '100%' : `${size}px`, reactTheming.getLineHeight(size, props.theme.fontSizes.md));
 };
-const StyledBaseHeaderItem = styled__default["default"].button.attrs({
+const StyledBaseHeaderItem = styled__default.default.button.attrs({
   'data-garden-id': COMPONENT_ID$y,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledBaseHeaderItem",
   componentId: "sc-1qua7h6-0"
@@ -118,9 +115,9 @@ StyledBaseHeaderItem.defaultProps = {
 
 const COMPONENT_ID$x = 'chrome.header_item_text';
 const clippedStyling = styled.css(["position:absolute;margin:0;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden;white-space:nowrap;"]);
-const StyledHeaderItemText = styled__default["default"].span.attrs({
+const StyledHeaderItemText = styled__default.default.span.attrs({
   'data-garden-id': COMPONENT_ID$x,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledHeaderItemText",
   componentId: "sc-goz7la-0"
@@ -142,9 +139,9 @@ const getNavWidth = props => {
 const getExpandedNavWidth = () => {
   return `200px`;
 };
-const StyledNav = styled__default["default"].nav.attrs({
+const StyledNav = styled__default.default.nav.attrs({
   'data-garden-id': COMPONENT_ID$w,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledNav",
   componentId: "sc-6j462r-0"
@@ -174,9 +171,9 @@ const retrieveProductColor$1 = props => {
       return 'inherit';
   }
 };
-const StyledLogoHeaderItem = styled__default["default"](StyledBaseHeaderItem).attrs({
+const StyledLogoHeaderItem = styled__default.default(StyledBaseHeaderItem).attrs({
   'data-garden-id': COMPONENT_ID$v,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.63.0',
   as: 'div'
 }).withConfig({
   displayName: "StyledLogoHeaderItem",
@@ -195,9 +192,9 @@ const sizeStyles$3 = props => {
   const horizontalPadding = polished.math(`(${getNavWidth(props)} - ${props.theme.iconSizes.lg}) / 4`);
   return styled.css(["padding:", " ", ";min-height:", ";"], verticalPadding, horizontalPadding, getNavItemHeight);
 };
-const StyledBaseNavItem = styled__default["default"].button.attrs({
+const StyledBaseNavItem = styled__default.default.button.attrs({
   'data-garden-id': COMPONENT_ID$u,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledBaseNavItem",
   componentId: "sc-zvo43f-0"
@@ -210,9 +207,9 @@ const COMPONENT_ID$t = 'chrome.header';
 const getHeaderHeight = props => {
   return getNavItemHeight(props);
 };
-const StyledHeader = styled__default["default"].header.attrs({
+const StyledHeader = styled__default.default.header.attrs({
   'data-garden-id': COMPONENT_ID$t,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledHeader",
   componentId: "sc-1cexpz-0"
@@ -244,9 +241,9 @@ const sizeStyles$2 = props => {
   const lineHeight = reactTheming.getLineHeight(padding, fontSize);
   return styled.css(["top:", ";padding:", ";padding-", ":", ";line-height:", ";font-size:", ";"], top, padding, props.theme.rtl ? 'right' : 'left', paddingStart, lineHeight, fontSize);
 };
-const StyledSkipNav = styled__default["default"].a.attrs({
+const StyledSkipNav = styled__default.default.a.attrs({
   'data-garden-id': COMPONENT_ID$s,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSkipNav",
   componentId: "sc-1tsro34-0"
@@ -256,9 +253,7 @@ StyledSkipNav.defaultProps = {
 };
 
 var _path$2;
-
 function _extends$2() { _extends$2 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
-
 var SvgLinkStroke = function SvgLinkStroke(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$2({
     xmlns: "http://www.w3.org/2000/svg",
@@ -266,8 +261,7 @@ var SvgLinkStroke = function SvgLinkStroke(props) {
     height: 16,
     focusable: "false",
     viewBox: "0 0 16 16",
-    "aria-hidden": "true",
-    role: "img"
+    "aria-hidden": "true"
   }, props), _path$2 || (_path$2 = /*#__PURE__*/React__namespace.createElement("path", {
     fill: "currentColor",
     d: "M4.441 7.38l.095.083.939.939-.708.707-.939-.939-2 2-.132.142a2.829 2.829 0 003.99 3.99l.142-.132 2-2-.939-.939.707-.708.94.94a1 1 0 01.083 1.32l-.083.094-2 2A3.828 3.828 0 01.972 9.621l.15-.158 2-2A1 1 0 014.34 7.31l.101.07zm7.413-3.234a.5.5 0 01.057.638l-.057.07-7 7a.5.5 0 01-.765-.638l.057-.07 7-7a.5.5 0 01.708 0zm3.023-3.025a3.829 3.829 0 01.15 5.257l-.15.158-2 2a1 1 0 01-1.32.083l-.094-.083-.94-.94.708-.707.939.94 2-2 .132-.142a2.829 2.829 0 00-3.99-3.99l-.142.131-2 2 .939.939-.707.708-.94-.94a1 1 0 01-.082-1.32l.083-.094 2-2a3.828 3.828 0 015.414 0z"
@@ -280,9 +274,9 @@ const sizeStyles$1 = theme => {
   const size = theme.iconSizes.md;
   return styled.css(["margin-", ":", ";width:", ";height:", ";"], theme.rtl ? 'left' : 'right', margin, size, size);
 };
-const StyledSkipNavIcon = styled__default["default"](SvgLinkStroke).attrs({
+const StyledSkipNavIcon = styled__default.default(SvgLinkStroke).attrs({
   'data-garden-id': COMPONENT_ID$r,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSkipNavIcon",
   componentId: "sc-1ika5z4-0"
@@ -292,9 +286,9 @@ StyledSkipNavIcon.defaultProps = {
 };
 
 const COMPONENT_ID$q = 'chrome.body';
-const StyledBody = styled__default["default"].div.attrs({
+const StyledBody = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$q,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledBody",
   componentId: "sc-c7h9kv-0"
@@ -307,9 +301,9 @@ const COMPONENT_ID$p = 'chrome.footer';
 const getFooterHeight = props => {
   return `${props.theme.space.base * 20}px`;
 };
-const StyledFooter = styled__default["default"].footer.attrs({
+const StyledFooter = styled__default.default.footer.attrs({
   'data-garden-id': COMPONENT_ID$p,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledFooter",
   componentId: "sc-v7lib2-0"
@@ -319,9 +313,9 @@ StyledFooter.defaultProps = {
 };
 
 const COMPONENT_ID$o = 'chrome.content';
-const StyledContent = styled__default["default"].div.attrs({
+const StyledContent = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$o,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledContent",
   componentId: "sc-qcuzxn-0"
@@ -331,9 +325,9 @@ StyledContent.defaultProps = {
 };
 
 const COMPONENT_ID$n = 'chrome.main';
-const StyledMain = styled__default["default"].main.attrs({
+const StyledMain = styled__default.default.main.attrs({
   'data-garden-id': COMPONENT_ID$n,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledMain",
   componentId: "sc-t61cre-0"
@@ -343,9 +337,9 @@ StyledMain.defaultProps = {
 };
 
 const COMPONENT_ID$m = 'chrome.sidebar';
-const StyledSidebar = styled__default["default"].aside.attrs({
+const StyledSidebar = styled__default.default.aside.attrs({
   'data-garden-id': COMPONENT_ID$m,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSidebar",
   componentId: "sc-1q77fuw-0"
@@ -355,9 +349,9 @@ StyledSidebar.defaultProps = {
 };
 
 const COMPONENT_ID$l = 'chrome.footer_item';
-const StyledFooterItem = styled__default["default"].div.attrs({
+const StyledFooterItem = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$l,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledFooterItem",
   componentId: "sc-1cktm85-0"
@@ -371,9 +365,9 @@ const imgStyles = props => {
   const size = polished.math(`${getHeaderItemSize(props)} - ${props.theme.space.base * 2}`);
   return styled.css(["img{margin:0;border-radius:", ";width:", ";height:", ";}"], polished.math(`${props.theme.borderRadii.md} - 1`), size, size);
 };
-const StyledHeaderItem = styled__default["default"](StyledBaseHeaderItem).attrs({
+const StyledHeaderItem = styled__default.default(StyledBaseHeaderItem).attrs({
   'data-garden-id': COMPONENT_ID$k,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledHeaderItem",
   componentId: "sc-14sft6n-0"
@@ -394,9 +388,9 @@ StyledHeaderItem.defaultProps = {
 };
 
 const COMPONENT_ID$j = 'chrome.header_item_wrapper';
-const StyledHeaderItemWrapper = styled__default["default"](StyledBaseHeaderItem).attrs({
+const StyledHeaderItemWrapper = styled__default.default(StyledBaseHeaderItem).attrs({
   'data-garden-id': COMPONENT_ID$j,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.63.0',
   as: 'div'
 }).withConfig({
   displayName: "StyledHeaderItemWrapper",
@@ -432,9 +426,9 @@ const colorStyles$4 = props => {
   const color = props.isLight || props.isDark ? fillColor : retrieveProductColor(props.product);
   return styled.css(["color:", ";fill:", ";"], color, fillColor);
 };
-const StyledLogoNavItem = styled__default["default"](StyledBaseNavItem).attrs({
+const StyledLogoNavItem = styled__default.default(StyledBaseNavItem).attrs({
   'data-garden-id': COMPONENT_ID$i,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.63.0',
   as: 'div'
 }).withConfig({
   displayName: "StyledLogoNavItem",
@@ -445,9 +439,9 @@ StyledLogoNavItem.defaultProps = {
 };
 
 const COMPONENT_ID$h = 'chrome.brandmark_nav_item';
-const StyledBrandmarkNavItem = styled__default["default"](StyledBaseNavItem).attrs({
+const StyledBrandmarkNavItem = styled__default.default(StyledBaseNavItem).attrs({
   'data-garden-id': COMPONENT_ID$h,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.63.0',
   as: 'div'
 }).withConfig({
   displayName: "StyledBrandmarkNavItem",
@@ -458,9 +452,9 @@ StyledBrandmarkNavItem.defaultProps = {
 };
 
 const COMPONENT_ID$g = 'chrome.nav_item_icon';
-const StyledNavItemIcon = styled__default["default"].div.attrs({
+const StyledNavItemIcon = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$g,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledNavItemIcon",
   componentId: "sc-7w9rpt-0"
@@ -490,9 +484,9 @@ const colorStyles$3 = props => {
   const focusColor = polished.rgba(props.isLight ? BLACK : WHITE, 0.2);
   return styled.css(["opacity:", ";background-color:", ";&:hover{opacity:1;background-color:", ";}&[data-garden-focus-visible]{opacity:1;box-shadow:inset ", ";}&:active{background-color:", ";}"], props.isCurrent ? 1 : 0.6, currentColor, hoverColor, props.theme.shadows.md(focusColor), activeColor);
 };
-const StyledNavItem = styled__default["default"](StyledBaseNavItem).attrs({
+const StyledNavItem = styled__default.default(StyledBaseNavItem).attrs({
   'data-garden-id': COMPONENT_ID$f,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.63.0',
   as: 'button'
 }).withConfig({
   displayName: "StyledNavItem",
@@ -507,9 +501,9 @@ StyledNavItem.defaultProps = {
 };
 
 const COMPONENT_ID$e = 'chrome.nav_item_text';
-const StyledNavItemText = styled__default["default"].span.attrs({
+const StyledNavItemText = styled__default.default.span.attrs({
   'data-garden-id': COMPONENT_ID$e,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledNavItemText",
   componentId: "sc-13m84xl-0"
@@ -549,9 +543,9 @@ const colorStyles$2 = props => {
 const getSubNavItemHeight = props => {
   return `${props.theme.space.base * 7.5}px`;
 };
-const StyledSubNavItem = styled__default["default"].button.attrs({
+const StyledSubNavItem = styled__default.default.button.attrs({
   'data-garden-id': COMPONENT_ID$d,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSubNavItem",
   componentId: "sc-1yg9dpx-0"
@@ -572,9 +566,9 @@ const colorStyles$1 = props => {
   const foregroundColor = props.isLight ? props.theme.palette.grey[800] : props.theme.palette.white;
   return styled.css(["background-color:", ";color:", ";"], backgroundColor, foregroundColor);
 };
-const StyledSubNav = styled__default["default"].nav.attrs({
+const StyledSubNav = styled__default.default.nav.attrs({
   'data-garden-id': COMPONENT_ID$c,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSubNav",
   componentId: "sc-19hjou6-0"
@@ -590,9 +584,9 @@ const sizeStyles = props => {
   const lineHeight = reactTheming.getLineHeight(baseLineHeight, props.theme.fontSizes.md);
   return styled.css(["margin:", " 0;line-height:", ";"], verticalMargin, lineHeight);
 };
-const StyledSubNavItemText = styled__default["default"].span.attrs({
+const StyledSubNavItemText = styled__default.default.span.attrs({
   'data-garden-id': COMPONENT_ID$b,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSubNavItemText",
   componentId: "sc-1hy0pn7-0"
@@ -602,9 +596,9 @@ StyledSubNavItemText.defaultProps = {
 };
 
 const COMPONENT_ID$a = 'chrome.collapsible_sub_nav_item';
-const StyledSubNavItemHeader = styled__default["default"](StyledSubNavItem).attrs({
+const StyledSubNavItemHeader = styled__default.default(StyledSubNavItem).attrs({
   'data-garden-id': COMPONENT_ID$a,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.63.0',
   'data-garden-header': 'true'
 }).withConfig({
   displayName: "StyledSubNavItemHeader",
@@ -615,9 +609,7 @@ StyledSubNavItemHeader.defaultProps = {
 };
 
 var _path$1;
-
 function _extends$1() { _extends$1 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
-
 var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
     xmlns: "http://www.w3.org/2000/svg",
@@ -625,8 +617,7 @@ var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
     height: 12,
     focusable: "false",
     viewBox: "0 0 12 12",
-    "aria-hidden": "true",
-    role: "img"
+    "aria-hidden": "true"
   }, props), _path$1 || (_path$1 = /*#__PURE__*/React__namespace.createElement("path", {
     fill: "currentColor",
     d: "M1.646 3.646a.5.5 0 01.638-.057l.07.057L6 7.293l3.646-3.647a.5.5 0 01.638-.057l.07.057a.5.5 0 01.057.638l-.057.07-4 4a.5.5 0 01-.638.057l-.07-.057-4-4a.5.5 0 010-.708z"
@@ -634,27 +625,27 @@ var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
 };
 
 const COMPONENT_ID$9 = 'chrome.collapsible_sub_nav_item_icon';
-const FilteredChevronDownStrokeIcon = React__default["default"].forwardRef((_ref, ref) => {
+const FilteredChevronDownStrokeIcon = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     theme,
     isExpanded,
     ...validProps
   } = _ref;
-  return React__default["default"].createElement(SvgChevronDownStroke, _extends$3({
+  return React__namespace.default.createElement(SvgChevronDownStroke, _extends$3({
     ref: ref
   }, validProps));
 });
 FilteredChevronDownStrokeIcon.displayName = 'FilteredChevronDownStrokeIcon';
-const StyledSubNavItemIcon = styled__default["default"](FilteredChevronDownStrokeIcon).withConfig({
+const StyledSubNavItemIcon = styled__default.default(FilteredChevronDownStrokeIcon).withConfig({
   displayName: "StyledSubNavItemIcon",
   componentId: "sc-1d02hho-0"
 })(["width:", ";height:", ";"], props => props.theme.iconSizes.sm, props => props.theme.iconSizes.sm);
 StyledSubNavItemIcon.defaultProps = {
   theme: reactTheming.DEFAULT_THEME
 };
-const StyledSubNavItemIconWrapper = styled__default["default"].div.attrs({
+const StyledSubNavItemIconWrapper = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$9,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSubNavItemIcon__StyledSubNavItemIconWrapper",
   componentId: "sc-1d02hho-1"
@@ -670,9 +661,9 @@ StyledSubNavItemIconWrapper.defaultProps = {
 
 const PANEL_COMPONENT_ID = 'chrome.collapsible_sub_nav_item_panel';
 const hiddenStyling = styled.css(["visibility:hidden;max-height:0 !important;overflow:hidden;"]);
-const StyledSubNavPanel = styled__default["default"].div.attrs({
+const StyledSubNavPanel = styled__default.default.div.attrs({
   'data-garden-id': PANEL_COMPONENT_ID,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSubNavPanel",
   componentId: "sc-1jv3rpv-0"
@@ -701,9 +692,9 @@ const borderStyle = _ref => {
   }
   return `border${borderSide}: ${theme.borders.sm} ${borderColor};`;
 };
-const StyledSheet = styled__default["default"].aside.attrs({
+const StyledSheet = styled__default.default.aside.attrs({
   'data-garden-id': COMPONENT_ID$8,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSheet",
   componentId: "sc-dx8ijk-0"
@@ -713,9 +704,9 @@ StyledSheet.defaultProps = {
 };
 
 const COMPONENT_ID$7 = 'chrome.sheet_wrapper';
-const StyledSheetWrapper = styled__default["default"].div.attrs({
+const StyledSheetWrapper = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$7,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSheetWrapper",
   componentId: "sc-f6x9zb-0"
@@ -740,9 +731,9 @@ StyledSheetWrapper.defaultProps = {
 };
 
 const COMPONENT_ID$6 = 'chrome.sheet_title';
-const StyledSheetTitle = styled__default["default"].div.attrs({
+const StyledSheetTitle = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$6,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSheetTitle",
   componentId: "sc-1gogk75-0"
@@ -752,9 +743,9 @@ StyledSheetTitle.defaultProps = {
 };
 
 const COMPONENT_ID$5 = 'chrome.sheet_description';
-const StyledSheetDescription = styled__default["default"].div.attrs({
+const StyledSheetDescription = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSheetDescription",
   componentId: "sc-1puglb6-0"
@@ -764,9 +755,9 @@ StyledSheetDescription.defaultProps = {
 };
 
 const COMPONENT_ID$4 = 'chrome.sheet_body';
-const StyledSheetBody = styled__default["default"].div.attrs({
+const StyledSheetBody = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSheetBody",
   componentId: "sc-bt4eoj-0"
@@ -786,9 +777,9 @@ const colorStyles = props => {
   const foregroundColor = 'neutralHue';
   return styled.css(["background-color:transparent;color:", ";&:hover{background-color:", ";color:", ";}&[data-garden-focus-visible]{box-shadow:", ";}&:active{transition:background-color 0.1s ease-in-out,color 0.1s ease-in-out;background-color:", ";color:", ";}"], reactTheming.getColor(foregroundColor, 600, props.theme), reactTheming.getColor(backgroundColor, 600, props.theme, 0.08), reactTheming.getColor(foregroundColor, 700, props.theme), props.theme.shadows.md(reactTheming.getColor(backgroundColor, 600, props.theme, 0.35)), reactTheming.getColor(backgroundColor, 600, props.theme, 0.2), reactTheming.getColor(foregroundColor, 800, props.theme));
 };
-const StyledSheetClose = styled__default["default"].button.attrs({
+const StyledSheetClose = styled__default.default.button.attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSheetClose",
   componentId: "sc-1ab02oq-0"
@@ -798,9 +789,9 @@ StyledSheetClose.defaultProps = {
 };
 
 const COMPONENT_ID$2 = 'chrome.sheet_footer';
-const StyledSheetFooter = styled__default["default"].footer.attrs({
+const StyledSheetFooter = styled__default.default.footer.attrs({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSheetFooter",
   componentId: "sc-2cktos-0"
@@ -810,9 +801,9 @@ StyledSheetFooter.defaultProps = {
 };
 
 const COMPONENT_ID$1 = 'chrome.sheet_footer_item';
-const StyledSheetFooterItem = styled__default["default"].div.attrs({
+const StyledSheetFooterItem = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSheetFooterItem",
   componentId: "sc-r9ixh-0"
@@ -822,9 +813,9 @@ StyledSheetFooterItem.defaultProps = {
 };
 
 const COMPONENT_ID = 'chrome.sheet_header';
-const StyledSheetHeader = styled__default["default"].header.attrs({
+const StyledSheetHeader = styled__default.default.header.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.63.0'
 }).withConfig({
   displayName: "StyledSheetHeader",
   componentId: "sc-o2ry8i-0"
@@ -833,7 +824,7 @@ StyledSheetHeader.defaultProps = {
   theme: reactTheming.DEFAULT_THEME
 };
 
-const Chrome = React__default["default"].forwardRef((_ref, ref) => {
+const Chrome = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     hue,
     isFluid,
@@ -869,47 +860,47 @@ const Chrome = React__default["default"].forwardRef((_ref, ref) => {
     }
     return undefined;
   }, [environment, isFluid]);
-  return React__default["default"].createElement(ChromeContext.Provider, {
+  return React__namespace.default.createElement(ChromeContext.Provider, {
     value: chromeContextValue
-  }, React__default["default"].createElement(StyledChrome, _extends$3({
+  }, React__namespace.default.createElement(StyledChrome, _extends$3({
     ref: ref
   }, props)));
 });
 Chrome.displayName = 'Chrome';
 Chrome.propTypes = {
-  hue: PropTypes__default["default"].string
+  hue: PropTypes__default.default.string
 };
 
-const SkipNav = React__default["default"].forwardRef((_ref, ref) => {
+const SkipNav = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     targetId,
     zIndex,
     children,
     ...props
   } = _ref;
-  return React__default["default"].createElement(StyledSkipNav, _extends$3({
+  return React__namespace.default.createElement(StyledSkipNav, _extends$3({
     href: `#${targetId}`,
     zIndex: zIndex,
     ref: ref
-  }, props), React__default["default"].createElement(StyledSkipNavIcon, null), children);
+  }, props), React__namespace.default.createElement(StyledSkipNavIcon, null), children);
 });
 SkipNav.displayName = 'SkipNav';
 SkipNav.propTypes = {
-  targetId: PropTypes__default["default"].string.isRequired,
-  zIndex: PropTypes__default["default"].number
+  targetId: PropTypes__default.default.string.isRequired,
+  zIndex: PropTypes__default.default.number
 };
 SkipNav.defaultProps = {
   zIndex: 1
 };
 
-const BodyContext = React__default["default"].createContext({
+const BodyContext = React__namespace.default.createContext({
   hasFooter: true
 });
 const useBodyContext = () => {
   return React.useContext(BodyContext);
 };
 
-const Body$1 = React__default["default"].forwardRef((_ref, ref) => {
+const Body$1 = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     hasFooter,
     ...props
@@ -917,72 +908,72 @@ const Body$1 = React__default["default"].forwardRef((_ref, ref) => {
   const bodyContextValue = React.useMemo(() => ({
     hasFooter: !!hasFooter
   }), [hasFooter]);
-  return React__default["default"].createElement(BodyContext.Provider, {
+  return React__namespace.default.createElement(BodyContext.Provider, {
     value: bodyContextValue
-  }, React__default["default"].createElement(StyledBody, _extends$3({
+  }, React__namespace.default.createElement(StyledBody, _extends$3({
     ref: ref
   }, props)));
 });
 Body$1.displayName = 'Body';
 Body$1.propTypes = {
-  hasFooter: PropTypes__default["default"].bool
+  hasFooter: PropTypes__default.default.bool
 };
 
-const Content = React__default["default"].forwardRef((props, ref) => {
+const Content = React__namespace.default.forwardRef((props, ref) => {
   const {
     hasFooter
   } = useBodyContext();
-  return React__default["default"].createElement(StyledContent, _extends$3({
+  return React__namespace.default.createElement(StyledContent, _extends$3({
     ref: ref,
     hasFooter: hasFooter
   }, props));
 });
 Content.displayName = 'Content';
 
-const Main = React__default["default"].forwardRef((props, ref) => React__default["default"].createElement(StyledMain, _extends$3({
+const Main = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledMain, _extends$3({
   ref: ref
 }, props)));
 Main.displayName = 'Main';
 
-const Sidebar = React__default["default"].forwardRef((props, ref) => React__default["default"].createElement(StyledSidebar, _extends$3({
+const Sidebar = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledSidebar, _extends$3({
   ref: ref
 }, props)));
 Sidebar.displayName = 'Sidebar';
 
-const Header$1 = React__default["default"].forwardRef((props, ref) => React__default["default"].createElement(StyledHeader, _extends$3({
+const Header$1 = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledHeader, _extends$3({
   ref: ref
 }, props)));
 Header$1.displayName = 'Header';
 Header$1.propTypes = {
-  isStandalone: PropTypes__default["default"].bool
+  isStandalone: PropTypes__default.default.bool
 };
 
 const PLACEMENT = ['end', 'start'];
 const PRODUCT = ['chat', 'connect', 'explore', 'guide', 'message', 'support', 'talk'];
 
-const HeaderItem = React__default["default"].forwardRef((_ref, ref) => {
+const HeaderItem = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     hasLogo,
     product,
     ...other
   } = _ref;
   if (hasLogo) {
-    return React__default["default"].createElement(StyledLogoHeaderItem, _extends$3({
+    return React__namespace.default.createElement(StyledLogoHeaderItem, _extends$3({
       ref: ref,
       product: product
     }, other));
   }
-  return React__default["default"].createElement(StyledHeaderItem, _extends$3({
+  return React__namespace.default.createElement(StyledHeaderItem, _extends$3({
     ref: ref
   }, other));
 });
 HeaderItem.displayName = 'HeaderItem';
 HeaderItem.propTypes = {
-  maxX: PropTypes__default["default"].bool,
-  maxY: PropTypes__default["default"].bool,
-  isRound: PropTypes__default["default"].bool,
-  product: PropTypes__default["default"].oneOf(PRODUCT),
-  hasLogo: PropTypes__default["default"].bool
+  maxX: PropTypes__default.default.bool,
+  maxY: PropTypes__default.default.bool,
+  isRound: PropTypes__default.default.bool,
+  product: PropTypes__default.default.oneOf(PRODUCT),
+  hasLogo: PropTypes__default.default.bool
 };
 
 const HeaderItemIcon = _ref => {
@@ -1002,44 +993,44 @@ const HeaderItemIcon = _ref => {
         ...iconProps
       });
     };
-    return React__default["default"].createElement(StyledHeaderItemIcon, _extends$3({
+    return React__namespace.default.createElement(StyledHeaderItemIcon, _extends$3({
       as: Icon
     }, props));
   }
   return null;
 };
 
-const HeaderItemText = React__default["default"].forwardRef((props, ref) => React__default["default"].createElement(StyledHeaderItemText, _extends$3({
+const HeaderItemText = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledHeaderItemText, _extends$3({
   ref: ref
 }, props)));
 HeaderItemText.displayName = 'HeaderItemText';
 HeaderItemText.propTypes = {
-  isClipped: PropTypes__default["default"].bool
+  isClipped: PropTypes__default.default.bool
 };
 
-const HeaderItemWrapper = React__default["default"].forwardRef((props, ref) => React__default["default"].createElement(StyledHeaderItemWrapper, _extends$3({
+const HeaderItemWrapper = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledHeaderItemWrapper, _extends$3({
   ref: ref
 }, props)));
 HeaderItemWrapper.displayName = 'HeaderItemWrapper';
 
-const Footer$1 = React__default["default"].forwardRef((props, ref) => React__default["default"].createElement(StyledFooter, _extends$3({
+const Footer$1 = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledFooter, _extends$3({
   ref: ref
 }, props)));
 Footer$1.displayName = 'Footer';
 
-const FooterItem$1 = React__default["default"].forwardRef((props, ref) => React__default["default"].createElement(StyledFooterItem, _extends$3({
+const FooterItem$1 = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledFooterItem, _extends$3({
   ref: ref
 }, props)));
 FooterItem$1.displayName = 'FooterItem';
 
-const NavContext = React__default["default"].createContext({
+const NavContext = React__namespace.default.createContext({
   isExpanded: false
 });
 const useNavContext = () => {
   return React.useContext(NavContext);
 };
 
-const Nav = React__default["default"].forwardRef((props, ref) => {
+const Nav = React__namespace.default.forwardRef((props, ref) => {
   const {
     hue,
     isLight,
@@ -1048,9 +1039,9 @@ const Nav = React__default["default"].forwardRef((props, ref) => {
   const navContextValue = React.useMemo(() => ({
     isExpanded: !!props.isExpanded
   }), [props.isExpanded]);
-  return React__default["default"].createElement(NavContext.Provider, {
+  return React__namespace.default.createElement(NavContext.Provider, {
     value: navContextValue
-  }, React__default["default"].createElement(StyledNav, _extends$3({
+  }, React__namespace.default.createElement(StyledNav, _extends$3({
     ref: ref
   }, props, {
     hue: hue,
@@ -1060,10 +1051,10 @@ const Nav = React__default["default"].forwardRef((props, ref) => {
 });
 Nav.displayName = 'Nav';
 Nav.propTypes = {
-  isExpanded: PropTypes__default["default"].bool
+  isExpanded: PropTypes__default.default.bool
 };
 
-const NavItem = React__default["default"].forwardRef((_ref, ref) => {
+const NavItem = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     hasLogo,
     hasBrandmark,
@@ -1080,7 +1071,7 @@ const NavItem = React__default["default"].forwardRef((_ref, ref) => {
   } = useNavContext();
   const ariaCurrent = other.isCurrent || undefined;
   if (hasLogo) {
-    return React__default["default"].createElement(StyledLogoNavItem, _extends$3({
+    return React__namespace.default.createElement(StyledLogoNavItem, _extends$3({
       ref: ref,
       isDark: isDark,
       isLight: isLight,
@@ -1089,11 +1080,11 @@ const NavItem = React__default["default"].forwardRef((_ref, ref) => {
     }, other));
   }
   if (hasBrandmark) {
-    return React__default["default"].createElement(StyledBrandmarkNavItem, _extends$3({
+    return React__namespace.default.createElement(StyledBrandmarkNavItem, _extends$3({
       ref: ref
     }, other));
   }
-  return React__default["default"].createElement(StyledNavItem, _extends$3({
+  return React__namespace.default.createElement(StyledNavItem, _extends$3({
     tabIndex: 0,
     ref: ref,
     isExpanded: isExpanded,
@@ -1105,9 +1096,9 @@ const NavItem = React__default["default"].forwardRef((_ref, ref) => {
 });
 NavItem.displayName = 'NavItem';
 NavItem.propTypes = {
-  product: PropTypes__default["default"].oneOf(PRODUCT),
-  hasLogo: PropTypes__default["default"].bool,
-  hasBrandmark: PropTypes__default["default"].bool
+  product: PropTypes__default.default.oneOf(PRODUCT),
+  hasLogo: PropTypes__default.default.bool,
+  hasBrandmark: PropTypes__default.default.bool
 };
 
 const NavItemIcon = _ref => {
@@ -1127,34 +1118,34 @@ const NavItemIcon = _ref => {
         ...iconProps
       });
     };
-    return React__default["default"].createElement(StyledNavItemIcon, _extends$3({
+    return React__namespace.default.createElement(StyledNavItemIcon, _extends$3({
       as: Icon
     }, props));
   }
   return null;
 };
 
-const NavItemText = React__default["default"].forwardRef((props, ref) => {
+const NavItemText = React__namespace.default.forwardRef((props, ref) => {
   const {
     isExpanded
   } = useNavContext();
-  return React__default["default"].createElement(StyledNavItemText, _extends$3({
+  return React__namespace.default.createElement(StyledNavItemText, _extends$3({
     ref: ref,
     isExpanded: isExpanded
   }, props));
 });
 NavItemText.displayName = 'NavItemText';
 NavItemText.propTypes = {
-  isWrapped: PropTypes__default["default"].bool
+  isWrapped: PropTypes__default.default.bool
 };
 
-const SubNav = React__default["default"].forwardRef((props, ref) => {
+const SubNav = React__namespace.default.forwardRef((props, ref) => {
   const {
     hue,
     isLight,
     isDark
   } = useChromeContext();
-  return React__default["default"].createElement(StyledSubNav, _extends$3({
+  return React__namespace.default.createElement(StyledSubNav, _extends$3({
     ref: ref,
     hue: hue,
     isLight: isLight,
@@ -1163,12 +1154,12 @@ const SubNav = React__default["default"].forwardRef((props, ref) => {
 });
 SubNav.displayName = 'SubNav';
 
-const SubNavItem = React__default["default"].forwardRef((props, ref) => {
+const SubNavItem = React__namespace.default.forwardRef((props, ref) => {
   const {
     isDark,
     isLight
   } = useChromeContext();
-  return React__default["default"].createElement(StyledSubNavItem, _extends$3({
+  return React__namespace.default.createElement(StyledSubNavItem, _extends$3({
     ref: ref,
     isDark: isDark,
     isLight: isLight
@@ -1176,18 +1167,18 @@ const SubNavItem = React__default["default"].forwardRef((props, ref) => {
 });
 SubNavItem.displayName = 'SubNavItem';
 SubNavItem.propTypes = {
-  isCurrent: PropTypes__default["default"].bool
+  isCurrent: PropTypes__default.default.bool
 };
 
-const SubNavItemText = React__default["default"].forwardRef((props, ref) => React__default["default"].createElement(StyledSubNavItemText, _extends$3({
+const SubNavItemText = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledSubNavItemText, _extends$3({
   ref: ref
 }, props)));
 SubNavItemText.displayName = 'SubNavItemText';
 SubNavItemText.propTypes = {
-  isWrapped: PropTypes__default["default"].bool
+  isWrapped: PropTypes__default.default.bool
 };
 
-const CollapsibleSubNavItem = React__default["default"].forwardRef((_ref, ref) => {
+const CollapsibleSubNavItem = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     header,
     children,
@@ -1219,29 +1210,29 @@ const CollapsibleSubNavItem = React__default["default"].forwardRef((_ref, ref) =
       panelRef.current.style.maxHeight = `${panelRef.current.scrollHeight}px`;
     }
   }, [expanded, children]);
-  return React__default["default"].createElement("div", {
+  return React__namespace.default.createElement("div", {
     ref: ref
-  }, React__default["default"].createElement("div", getHeaderProps({
+  }, React__namespace.default.createElement("div", getHeaderProps({
     ariaLevel: 2
-  }), React__default["default"].createElement(StyledSubNavItemHeader, getTriggerProps({
+  }), React__namespace.default.createElement(StyledSubNavItemHeader, getTriggerProps({
     isExpanded: expanded,
     index: 0,
     role: null,
     tabIndex: null,
     ...other
-  }), React__default["default"].createElement(React__default["default"].Fragment, null, header, React__default["default"].createElement(StyledSubNavItemIconWrapper, {
+  }), React__namespace.default.createElement(React__namespace.default.Fragment, null, header, React__namespace.default.createElement(StyledSubNavItemIconWrapper, {
     isExpanded: expanded
-  }, React__default["default"].createElement(StyledSubNavItemIcon, null))))), React__default["default"].createElement(StyledSubNavPanel, getPanelProps({
+  }, React__namespace.default.createElement(StyledSubNavItemIcon, null))))), React__namespace.default.createElement(StyledSubNavPanel, getPanelProps({
     index: 0,
     isHidden: !expanded,
     ref: panelRef
   }), children));
 });
 CollapsibleSubNavItem.propTypes = {
-  header: PropTypes__default["default"].any,
-  isExpanded: PropTypes__default["default"].bool,
-  onChange: PropTypes__default["default"].func,
-  children: PropTypes__default["default"].node
+  header: PropTypes__default.default.any,
+  isExpanded: PropTypes__default.default.bool,
+  onChange: PropTypes__default.default.func,
+  children: PropTypes__default.default.node
 };
 CollapsibleSubNavItem.displayName = 'CollapsibleSubNavItem';
 
@@ -1298,7 +1289,7 @@ const SheetTitle = React.forwardRef((_ref, ref) => {
   const {
     titleId
   } = useSheetContext();
-  return React__default["default"].createElement(StyledSheetTitle, _extends$3({
+  return React__namespace.default.createElement(StyledSheetTitle, _extends$3({
     id: id || titleId,
     ref: ref
   }, props));
@@ -1314,7 +1305,7 @@ const SheetDescription = React.forwardRef((_ref, ref) => {
   const {
     descriptionId
   } = useSheetContext();
-  return React__default["default"].createElement(StyledSheetDescription, _extends$3({
+  return React__namespace.default.createElement(StyledSheetDescription, _extends$3({
     id: id || descriptionId,
     ref: ref
   }, props));
@@ -1326,7 +1317,7 @@ const SheetHeader = React.forwardRef((props, ref) => {
   const {
     isCloseButtonPresent
   } = useSheetContext();
-  return React__default["default"].createElement(StyledSheetHeader, _extends$3({
+  return React__namespace.default.createElement(StyledSheetHeader, _extends$3({
     ref: ref,
     isCloseButtonPresent: isCloseButtonPresent
   }, props));
@@ -1335,7 +1326,7 @@ SheetHeader.displayName = 'Sheet.Header';
 const Header = SheetHeader;
 
 const SheetBody = React.forwardRef((props, ref) => {
-  return React__default["default"].createElement(StyledSheetBody, _extends$3({
+  return React__namespace.default.createElement(StyledSheetBody, _extends$3({
     ref: ref
   }, props));
 });
@@ -1343,7 +1334,7 @@ SheetBody.displayName = 'Sheet.Body';
 const Body = SheetBody;
 
 const SheetFooter = React.forwardRef((props, ref) => {
-  return React__default["default"].createElement(StyledSheetFooter, _extends$3({
+  return React__namespace.default.createElement(StyledSheetFooter, _extends$3({
     ref: ref
   }, props));
 });
@@ -1351,7 +1342,7 @@ SheetFooter.displayName = 'Sheet.Footer';
 const Footer = SheetFooter;
 
 const SheetFooterItem = React.forwardRef((props, ref) => {
-  return React__default["default"].createElement(StyledSheetFooterItem, _extends$3({
+  return React__namespace.default.createElement(StyledSheetFooterItem, _extends$3({
     ref: ref
   }, props));
 });
@@ -1359,9 +1350,7 @@ SheetFooterItem.displayName = 'Sheet.FooterItem';
 const FooterItem = SheetFooterItem;
 
 var _path;
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 var SvgXStroke = function SvgXStroke(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -1369,8 +1358,7 @@ var SvgXStroke = function SvgXStroke(props) {
     height: 16,
     focusable: "false",
     viewBox: "0 0 16 16",
-    "aria-hidden": "true",
-    role: "img"
+    "aria-hidden": "true"
   }, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
     stroke: "currentColor",
     strokeLinecap: "round",
@@ -1386,15 +1374,15 @@ const SheetClose = React.forwardRef((props, ref) => {
     setIsCloseButtonPresent(true);
     return () => setIsCloseButtonPresent(false);
   }, [setIsCloseButtonPresent]);
-  return React__default["default"].createElement(StyledSheetClose, _extends$3({
+  return React__namespace.default.createElement(StyledSheetClose, _extends$3({
     "aria-label": "Close Sheet",
     ref: ref
-  }, props), React__default["default"].createElement(SvgXStroke, null));
+  }, props), React__namespace.default.createElement(SvgXStroke, null));
 });
 SheetClose.displayName = 'Sheet.Close';
 const Close = SheetClose;
 
-const SheetComponent = React__default["default"].forwardRef((_ref, ref) => {
+const SheetComponent = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     id,
     isOpen,
@@ -1409,7 +1397,7 @@ const SheetComponent = React__default["default"].forwardRef((_ref, ref) => {
   const sheetRef = React.useRef(null);
   const seed = reactUid.useUIDSeed();
   const [isCloseButtonPresent, setIsCloseButtonPresent] = React.useState(false);
-  const idPrefix = React.useMemo(() => id || seed(`sheet_${'8.62.1'}`), [id, seed]);
+  const idPrefix = React.useMemo(() => id || seed(`sheet_${'8.63.0'}`), [id, seed]);
   const titleId = `${idPrefix}--title`;
   const descriptionId = `${idPrefix}--description`;
   const sheetContext = React.useMemo(() => ({
@@ -1424,9 +1412,9 @@ const SheetComponent = React__default["default"].forwardRef((_ref, ref) => {
     focusOnMount,
     restoreFocus
   });
-  return React__default["default"].createElement(SheetContext.Provider, {
+  return React__namespace.default.createElement(SheetContext.Provider, {
     value: sheetContext
-  }, React__default["default"].createElement(StyledSheet, _extends$3({
+  }, React__namespace.default.createElement(StyledSheet, _extends$3({
     isOpen: isOpen,
     isAnimated: isAnimated,
     placement: placement,
@@ -1435,8 +1423,8 @@ const SheetComponent = React__default["default"].forwardRef((_ref, ref) => {
     id: idPrefix,
     "aria-labelledby": titleId,
     "aria-describedby": descriptionId,
-    ref: mergeRefs__default["default"]([sheetRef, ref])
-  }, props), React__default["default"].createElement(StyledSheetWrapper, {
+    ref: mergeRefs__default.default([sheetRef, ref])
+  }, props), React__namespace.default.createElement(StyledSheetWrapper, {
     isOpen: isOpen,
     isAnimated: isAnimated,
     placement: placement,
@@ -1445,13 +1433,13 @@ const SheetComponent = React__default["default"].forwardRef((_ref, ref) => {
 });
 SheetComponent.displayName = 'Sheet';
 SheetComponent.propTypes = {
-  id: PropTypes__default["default"].string,
-  isOpen: PropTypes__default["default"].bool,
-  isAnimated: PropTypes__default["default"].bool,
-  focusOnMount: PropTypes__default["default"].bool,
-  restoreFocus: PropTypes__default["default"].bool,
-  placement: PropTypes__default["default"].oneOf(PLACEMENT),
-  size: PropTypes__default["default"].string
+  id: PropTypes__default.default.string,
+  isOpen: PropTypes__default.default.bool,
+  isAnimated: PropTypes__default.default.bool,
+  focusOnMount: PropTypes__default.default.bool,
+  restoreFocus: PropTypes__default.default.bool,
+  placement: PropTypes__default.default.oneOf(PLACEMENT),
+  size: PropTypes__default.default.string
 };
 SheetComponent.defaultProps = {
   isAnimated: true,