@moda/om 17.6.0 → 17.8.0

package/dist/index.cjs.js

@@ -1170,6 +1170,10 @@ function _extends$1() {
   return _extends$1.apply(this, arguments);
 }
 
+function _objectDestructuringEmpty(obj) {
+  if (obj == null) throw new TypeError("Cannot destructure undefined");
+}
+
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
@@ -1340,7 +1344,7 @@ var classnames = {exports: {}};
 
 var classNames = classnames.exports;
 
-var _excluded$E = ["className", "children", "space", "direction", "alignItems", "justifyContent", "style"];
+var _excluded$F = ["className", "children", "space", "direction", "alignItems", "justifyContent", "style"];
 var Stack = function Stack(_ref) {
   var className = _ref.className,
       children = _ref.children,
@@ -1350,7 +1354,7 @@ var Stack = function Stack(_ref) {
       alignItems = _ref.alignItems,
       justifyContent = _ref.justifyContent,
       style = _ref.style,
-      rest = _objectWithoutProperties(_ref, _excluded$E);
+      rest = _objectWithoutProperties(_ref, _excluded$F);
 
   return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
     className: classNames("Stack Stack--".concat(direction, "-").concat(space), className),
@@ -1424,11 +1428,11 @@ var StatesProps = function StatesProps(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement("span", null, children.type.displayName || children.type.name), !isEmpty(props) && /*#__PURE__*/React__default["default"].createElement("strong", null, stringifyProps(props)), !isRenderProps(children) && !isEmpty(childrenProps) && /*#__PURE__*/React__default["default"].createElement("span", null, stringifyProps(childrenProps)), /*#__PURE__*/React__default["default"].createElement("span", null, " "));
 };
 
-var _excluded$D = ["props", "children"];
+var _excluded$E = ["props", "children"];
 var State = function State(_ref) {
   var props = _ref.props,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$D);
+      rest = _objectWithoutProperties(_ref, _excluded$E);
 
   var Specimen = isRenderProps(children) ? children(props) : /*#__PURE__*/React__default["default"].cloneElement(children, props);
   var innerChildren = isRenderProps(children) ? children(props) : children;
@@ -1441,12 +1445,12 @@ var State = function State(_ref) {
   }, innerChildren)));
 };
 
-var _excluded$C = ["states", "children"];
+var _excluded$D = ["states", "children"];
 var States = function States(_ref) {
   var _ref$states = _ref.states,
       states = _ref$states === void 0 ? [{}] : _ref$states,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$C);
+      rest = _objectWithoutProperties(_ref, _excluded$D);
 
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "States"
@@ -5410,7 +5414,7 @@ var scale = {};
   __exportStar(scale, exports);
 })(dist$3);
 
-var _excluded$B = ["aspectWidth", "aspectHeight", "maxWidth", "maxHeight", "outlined", "children", "className"];
+var _excluded$C = ["aspectWidth", "aspectHeight", "maxWidth", "maxHeight", "outlined", "children", "className"];
 var DEFAULT_PRODUCT_ASPECT_WIDTH = 128;
 var DEFAULT_PRODUCT_ASPECT_HEIGHT = 205;
 var DEFAULT_PRODUCT_ASPECT_RATIO = DEFAULT_PRODUCT_ASPECT_HEIGHT / DEFAULT_PRODUCT_ASPECT_WIDTH;
@@ -5425,7 +5429,7 @@ var AspectRatioBox = /*#__PURE__*/React__default["default"].forwardRef(function
       outlined = _ref$outlined === void 0 ? false : _ref$outlined,
       children = _ref.children,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$B);
+      rest = _objectWithoutProperties(_ref, _excluded$C);
 
   var _scale = dist$3.scale({
     width: aspectWidth,
@@ -5455,23 +5459,23 @@ var AspectRatioBox = /*#__PURE__*/React__default["default"].forwardRef(function
 });
 AspectRatioBox.displayName = 'AspectRatioBox';
 
-var _excluded$A = ["className", "theme", "children"];
+var _excluded$B = ["className", "theme", "children"];
 var Badge = function Badge(_ref) {
   var className = _ref.className,
       theme = _ref.theme,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$A);
+      rest = _objectWithoutProperties(_ref, _excluded$B);
 
   return /*#__PURE__*/React__default["default"].createElement("span", _extends$1({
     className: classNames('Badge', theme && "Badge--".concat(theme), className)
   }, rest), children);
 };
 
-var _excluded$z = ["children", "className"];
+var _excluded$A = ["children", "className"];
 var Breadcrumbs = function Breadcrumbs(_ref) {
   var children = _ref.children,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$z);
+      rest = _objectWithoutProperties(_ref, _excluded$A);
 
   var position = 0;
   return /*#__PURE__*/React__default["default"].createElement("ol", _extends$1({
@@ -5491,7 +5495,7 @@ var Breadcrumbs = function Breadcrumbs(_ref) {
   }));
 };
 
-var _excluded$y = ["className", "styleless", "disabled"];
+var _excluded$z = ["className", "styleless", "disabled"];
 
 var isLink = function isLink(props) {
   return 'to' in props;
@@ -5510,7 +5514,7 @@ var Clickable = /*#__PURE__*/React__default["default"].forwardRef(function (_ref
       _ref$styleless = _ref.styleless,
       styleless = _ref$styleless === void 0 ? false : _ref$styleless,
       disabled = _ref.disabled,
-      rest = _objectWithoutProperties(_ref, _excluded$y);
+      rest = _objectWithoutProperties(_ref, _excluded$z);
 
   var props = _objectSpread2(_objectSpread2({}, rest), {}, {
     className: classNames({
@@ -5533,14 +5537,14 @@ var Clickable = /*#__PURE__*/React__default["default"].forwardRef(function (_ref
 });
 Clickable.displayName = 'Clickable';
 
-var _excluded$x = ["className", "disabled", "children", "underlined"];
+var _excluded$y = ["className", "disabled", "children", "underlined"];
 var ControlLink = function ControlLink(_ref) {
   var className = _ref.className,
       disabled = _ref.disabled,
       children = _ref.children,
       _ref$underlined = _ref.underlined,
       underlined = _ref$underlined === void 0 ? true : _ref$underlined,
-      rest = _objectWithoutProperties(_ref, _excluded$x);
+      rest = _objectWithoutProperties(_ref, _excluded$y);
 
   return /*#__PURE__*/React__default["default"].createElement(Clickable, _extends$1({}, rest, {
     className: classNames('ControlLink', {
@@ -5552,12 +5556,12 @@ var ControlLink = function ControlLink(_ref) {
   }), children);
 };
 
-var _excluded$w = ["children", "position", "className"];
+var _excluded$x = ["children", "position", "className"];
 var Breadcrumb = function Breadcrumb(_ref) {
   var children = _ref.children,
       position = _ref.position,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$w);
+      rest = _objectWithoutProperties(_ref, _excluded$x);
 
   return /*#__PURE__*/React__default["default"].createElement("li", {
     className: classNames('Breadcrumb', className),
@@ -5691,10 +5695,10 @@ var useBreakpoint = function useBreakpoint(props) {
   };
 };
 
-var _excluded$v = ["children"];
+var _excluded$w = ["children"];
 var Breakpoint = function Breakpoint(_ref) {
   var children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$v);
+      rest = _objectWithoutProperties(_ref, _excluded$w);
 
   var _discriminate = discriminate(rest),
       mode = _discriminate.mode,
@@ -5708,7 +5712,7 @@ var Breakpoint = function Breakpoint(_ref) {
   }, children) : null;
 };
 
-var _excluded$u = ["secondary", "chip", "hover", "focus", "disabled", "className"];
+var _excluded$v = ["secondary", "chip", "hover", "focus", "disabled", "className"];
 var Button = function Button(_ref) {
   var secondary = _ref.secondary,
       chip = _ref.chip,
@@ -5716,7 +5720,7 @@ var Button = function Button(_ref) {
       focus = _ref.focus,
       disabled = _ref.disabled,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$u);
+      rest = _objectWithoutProperties(_ref, _excluded$v);
 
   return /*#__PURE__*/React__default["default"].createElement(Clickable, _extends$1({
     className: classNames('Button', {
@@ -5867,7 +5871,7 @@ var Circle12 = function Circle12(_a) {
 
 Circle12.displayName = 'Circle12';
 
-var _excluded$t = ["className", "defaultChecked", "checked", "children", "value", "onChange", "disabled", "checkIcon", "dataTestId"];
+var _excluded$u = ["className", "defaultChecked", "checked", "children", "value", "onChange", "disabled", "checkIcon", "dataTestId"];
 var CHECKED_ITEM_PROPS = {
   className: 'Checkbox__check-mark',
   height: '85%',
@@ -5886,7 +5890,7 @@ var Checkbox = function Checkbox(_ref) {
       _ref$checkIcon = _ref.checkIcon,
       checkIcon = _ref$checkIcon === void 0 ? 'checkmark' : _ref$checkIcon,
       dataTestId = _ref.dataTestId,
-      rest = _objectWithoutProperties(_ref, _excluded$t);
+      rest = _objectWithoutProperties(_ref, _excluded$u);
 
   var _useState = React.useState((_ref2 = checked !== null && checked !== void 0 ? checked : defaultChecked) !== null && _ref2 !== void 0 ? _ref2 : false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -5979,7 +5983,7 @@ var SKU_COLORS = {
   yellow: '#ffca44'
 };
 
-var _excluded$s = ["className", "size", "color", "backgroundUrl", "focus", "hover", "selected", "soldOut", "onSale", "onClick", "onMouseEnter", "disabled", "title"];
+var _excluded$t = ["className", "size", "color", "backgroundUrl", "focus", "hover", "selected", "soldOut", "onSale", "onClick", "onMouseEnter", "disabled", "title"];
 var ColorSwatch = function ColorSwatch(_ref) {
   var _SKU_COLORS;
 
@@ -5996,7 +6000,7 @@ var ColorSwatch = function ColorSwatch(_ref) {
       onMouseEnter = _ref.onMouseEnter,
       disabled = _ref.disabled,
       title = _ref.title,
-      rest = _objectWithoutProperties(_ref, _excluded$s);
+      rest = _objectWithoutProperties(_ref, _excluded$t);
 
   var handleClick = React.useCallback(function (_event) {
     onClick && onClick(color, title);
@@ -6034,22 +6038,22 @@ var ColorSwatch = function ColorSwatch(_ref) {
   }));
 };
 
-var _excluded$r = ["className", "children"];
+var _excluded$s = ["className", "children"];
 var Constrain = function Constrain(_ref) {
   var className = _ref.className,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$r);
+      rest = _objectWithoutProperties(_ref, _excluded$s);
 
   return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
     className: classNames('Constrain', className)
   }, rest), children);
 };
 
-var _excluded$q = ["className", "children"];
+var _excluded$r = ["className", "children"];
 var ExceedConstrain = function ExceedConstrain(_ref) {
   var className = _ref.className,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$q);
+      rest = _objectWithoutProperties(_ref, _excluded$r);
 
   return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
     className: classNames('ExceedConstrain', className)
@@ -8461,7 +8465,7 @@ var Warning16 = function Warning16(_a) {
 
 Warning16.displayName = 'Warning16';
 
-var _excluded$p = ["className", "disabled", "error", "focus", "placeholder", "label", "onChange", "onChangeEvent"];
+var _excluded$q = ["className", "disabled", "error", "focus", "placeholder", "label", "onChange", "onChangeEvent"];
 var TextInput = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
   var className = _ref.className,
       disabled = _ref.disabled,
@@ -8471,7 +8475,7 @@ var TextInput = /*#__PURE__*/React__default["default"].forwardRef(function (_ref
       label = _ref.label,
       _onChange = _ref.onChange,
       onChangeEvent = _ref.onChangeEvent,
-      rest = _objectWithoutProperties(_ref, _excluded$p);
+      rest = _objectWithoutProperties(_ref, _excluded$q);
 
   return /*#__PURE__*/React__default["default"].createElement("input", _extends$1({
     className: classNames('TextInput', className, {
@@ -8839,7 +8843,7 @@ var useUpdateEffect = function useUpdateEffect(effect, deps) {
   }, deps);
 };
 
-var _excluded$o = ["className", "treatment", "color", "family", "children", "style"];
+var _excluded$p = ["className", "treatment", "color", "family", "children", "style"];
 var Text = function Text(_ref) {
   var className = _ref.className,
       _ref$treatment = _ref.treatment,
@@ -8849,7 +8853,7 @@ var Text = function Text(_ref) {
       family = _ref.family,
       children = _ref.children,
       style = _ref.style,
-      rest = _objectWithoutProperties(_ref, _excluded$o);
+      rest = _objectWithoutProperties(_ref, _excluded$p);
 
   return /*#__PURE__*/React__default["default"].createElement("span", _extends$1({
     className: classNames("Text Text--".concat(treatment, " ").concat(family ? "Text--".concat(family) : ''), className),
@@ -9006,7 +9010,7 @@ var Search20 = function Search20(_a) {
 
 Search20.displayName = 'Search20';
 
-var _excluded$n = ["className", "onChange", "onChangeValue", "onClear", "value"];
+var _excluded$o = ["className", "onChange", "onChangeValue", "onClear", "value"];
 var DEFAULT_INPUT_VALUE = '';
 var SearchInput = function SearchInput(_ref) {
   var className = _ref.className,
@@ -9015,7 +9019,7 @@ var SearchInput = function SearchInput(_ref) {
       onClear = _ref.onClear,
       _ref$value = _ref.value,
       value = _ref$value === void 0 ? DEFAULT_INPUT_VALUE : _ref$value,
-      rest = _objectWithoutProperties(_ref, _excluded$n);
+      rest = _objectWithoutProperties(_ref, _excluded$o);
 
   var ref = React.useRef(null);
 
@@ -9243,7 +9247,7 @@ var SelectOption = function SelectOption(_ref) {
   }, option.label);
 };
 
-var _excluded$m = ["idRef", "searchable", "autoFocus", "options", "selectedOption", "onSelect", "onFocus", "className", "dataTestId"];
+var _excluded$n = ["idRef", "searchable", "autoFocus", "options", "selectedOption", "onSelect", "onFocus", "className", "dataTestId"];
 var SelectOptions = function SelectOptions(_ref) {
   var idRef = _ref.idRef,
       searchable = _ref.searchable,
@@ -9255,7 +9259,7 @@ var SelectOptions = function SelectOptions(_ref) {
       onFocus = _ref.onFocus,
       className = _ref.className,
       dataTestId = _ref.dataTestId,
-      rest = _objectWithoutProperties(_ref, _excluded$m);
+      rest = _objectWithoutProperties(_ref, _excluded$n);
 
   var _useState = React.useState(''),
       _useState2 = _slicedToArray(_useState, 2),
@@ -9434,7 +9438,7 @@ var useSelect = function useSelect(_ref) {
   };
 };
 
-var _excluded$l = ["allowAutoFill", "autoSelect", "className", "defaultValue", "disabled", "dropDirection", "error", "idRef", "label", "name", "onChange", "options", "placeholder", "searchable", "shiftIconLeftwards", "value", "dataTestId"];
+var _excluded$m = ["allowAutoFill", "autoSelect", "className", "defaultValue", "disabled", "dropDirection", "error", "idRef", "label", "name", "onChange", "options", "placeholder", "searchable", "shiftIconLeftwards", "value", "dataTestId"];
 var Select = function Select(_ref) {
   var _ref2;
 
@@ -9461,7 +9465,7 @@ var Select = function Select(_ref) {
       shiftIconLeftwards = _ref$shiftIconLeftwar === void 0 ? false : _ref$shiftIconLeftwar,
       value = _ref.value,
       dataTestId = _ref.dataTestId,
-      rest = _objectWithoutProperties(_ref, _excluded$l);
+      rest = _objectWithoutProperties(_ref, _excluded$m);
 
   var _useSelect = useSelect({
     value: value,
@@ -11136,7 +11140,7 @@ var Exit16 = function Exit16(_a) {
 
 Exit16.displayName = 'Exit16';
 
-var _excluded$k = ["className", "defaultValue", "disabled", "dropDirection", "error", "idRef", "onChange", "options", "searchable", "shiftIconLeftwards", "value"];
+var _excluded$l = ["className", "defaultValue", "disabled", "dropDirection", "error", "idRef", "onChange", "options", "searchable", "shiftIconLeftwards", "value"];
 var MultiSelect = function MultiSelect(_ref) {
   var className = _ref.className,
       defaultValue = _ref.defaultValue,
@@ -11151,7 +11155,7 @@ var MultiSelect = function MultiSelect(_ref) {
       searchable = _ref.searchable,
       shiftIconLeftwards = _ref.shiftIconLeftwards,
       value = _ref.value,
-      rest = _objectWithoutProperties(_ref, _excluded$k);
+      rest = _objectWithoutProperties(_ref, _excluded$l);
 
   var _useSelect = useSelect({
     value: value,
@@ -11251,14 +11255,14 @@ var MultiSelect = function MultiSelect(_ref) {
   }));
 };
 
-var _excluded$j = ["className", "children", "error", "label", "placeholder"];
+var _excluded$k = ["className", "children", "error", "label", "placeholder"];
 var Field = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
   var className = _ref.className,
       children = _ref.children,
       error = _ref.error,
       label = _ref.label,
       placeholder = _ref.placeholder,
-      rest = _objectWithoutProperties(_ref, _excluded$j);
+      rest = _objectWithoutProperties(_ref, _excluded$k);
 
   return /*#__PURE__*/React__default["default"].createElement("label", {
     className: classNames('Field', className)
@@ -11287,17 +11291,17 @@ var Field = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, re
 });
 Field.displayName = 'Field';
 
-var _excluded$i = ["onChange"];
+var _excluded$j = ["onChange"];
 var CreditCardNumberInputField = function CreditCardNumberInputField(_ref) {
   var onChange = _ref.onChange,
-      rest = _objectWithoutProperties(_ref, _excluded$i);
+      rest = _objectWithoutProperties(_ref, _excluded$j);
 
   return /*#__PURE__*/React__default["default"].createElement(Field, _extends$1({}, rest, {
     onChangeEvent: onChange
   }));
 };
 
-var _excluded$h = ["value", "disabled", "readOnly", "defaultValue", "maskChar", "alwaysShowMask", "onMouseDown", "onFocus", "onBlur", "onChange"];
+var _excluded$i = ["value", "disabled", "readOnly", "defaultValue", "maskChar", "alwaysShowMask", "onMouseDown", "onFocus", "onBlur", "onChange"];
 var DEFAULT_MASK = '9999 9999 9999 9999';
 var CreditCardNumberInput = function CreditCardNumberInput(_ref) {
   var _ref2;
@@ -11312,7 +11316,7 @@ var CreditCardNumberInput = function CreditCardNumberInput(_ref) {
       onFocus = _ref.onFocus,
       onBlur = _ref.onBlur,
       onChange = _ref.onChange,
-      rest = _objectWithoutProperties(_ref, _excluded$h);
+      rest = _objectWithoutProperties(_ref, _excluded$i);
 
   var _useState = React.useState((_ref2 = propsValue !== null && propsValue !== void 0 ? propsValue : defaultValue) !== null && _ref2 !== void 0 ? _ref2 : ''),
       _useState2 = _slicedToArray(_useState, 2),
@@ -11358,19 +11362,19 @@ var CreditCardNumberInput = function CreditCardNumberInput(_ref) {
   }, renderInputField);
 };
 
-var _excluded$g = ["term", "children", "className"];
+var _excluded$h = ["term", "children", "className"];
 var DefinitionList = function DefinitionList(_ref) {
   var term = _ref.term,
       children = _ref.children,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$g);
+      rest = _objectWithoutProperties(_ref, _excluded$h);
 
   return /*#__PURE__*/React__default["default"].createElement("dl", _extends$1({
     className: classNames('DefinitionList', className)
   }, rest), /*#__PURE__*/React__default["default"].createElement("dt", null, term), /*#__PURE__*/React__default["default"].createElement("dd", null, children));
 };
 
-var _excluded$f = ["name", "children", "className", "virtual", "icon", "data-testid", "defaultExpanded", "expanded", "onToggle", "background", "border"];
+var _excluded$g = ["name", "children", "className", "virtual", "icon", "data-testid", "defaultExpanded", "expanded", "onToggle", "background", "border"];
 var Expandable = function Expandable(_ref) {
   var name = _ref.name,
       children = _ref.children,
@@ -11388,7 +11392,7 @@ var Expandable = function Expandable(_ref) {
       background = _ref$background === void 0 ? 'light' : _ref$background,
       _ref$border = _ref.border,
       border = _ref$border === void 0 ? true : _ref$border,
-      rest = _objectWithoutProperties(_ref, _excluded$f);
+      rest = _objectWithoutProperties(_ref, _excluded$g);
 
   var _useState = React.useState(defaultExpanded),
       _useState2 = _slicedToArray(_useState, 2),
@@ -11421,7 +11425,7 @@ var Expandable = function Expandable(_ref) {
   }, expanded || !virtual ? children : null));
 };
 
-var _excluded$e = ["text", "treatment", "color", "family", "type", "className"];
+var _excluded$f = ["text", "treatment", "color", "family", "type", "className"];
 var Divider = function Divider(_ref) {
   var text = _ref.text,
       treatment = _ref.treatment,
@@ -11429,7 +11433,7 @@ var Divider = function Divider(_ref) {
       family = _ref.family,
       type = _ref.type,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$e);
+      rest = _objectWithoutProperties(_ref, _excluded$f);
 
   var defaultTreatment = type === 'two-line' ? 'eyebrow' : 'h5';
   var defaultFamily = type === 'two-line' ? undefined : 'serif';
@@ -11455,11 +11459,11 @@ var NoLineDivider = function NoLineDivider(props) {
   }));
 };
 
-var _excluded$d = ["className", "hidden"];
+var _excluded$e = ["className", "hidden"];
 var Label = function Label(_ref) {
   var className = _ref.className,
       hidden = _ref.hidden,
-      rest = _objectWithoutProperties(_ref, _excluded$d);
+      rest = _objectWithoutProperties(_ref, _excluded$e);
 
   return /*#__PURE__*/React__default["default"].createElement("label", _extends$1({
     className: classNames('Label', className, {
@@ -11591,11 +11595,11 @@ var ArcWindow = function ArcWindow() {
   }));
 };
 
-var _excluded$c = ["className"];
+var _excluded$d = ["className"];
 var FRAMES = [Triangle, Diamond, ArcWindow, Circle];
 var Loading = function Loading(_ref) {
   var className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$c);
+      rest = _objectWithoutProperties(_ref, _excluded$d);
 
   var _useCursor = dist.useCursor({
     max: FRAMES.length
@@ -11671,13 +11675,13 @@ var LoadingBalls = function LoadingBalls(_ref) {
   })));
 };
 
-var _excluded$b = ["className", "children", "onClose", "shards"];
+var _excluded$c = ["className", "children", "onClose", "shards"];
 var Modal = function Modal(_ref) {
   var className = _ref.className,
       children = _ref.children,
       onClose = _ref.onClose,
       shards = _ref.shards,
-      rest = _objectWithoutProperties(_ref, _excluded$b);
+      rest = _objectWithoutProperties(_ref, _excluded$c);
 
   return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
     className: classNames('Modal', className)
@@ -11688,14 +11692,14 @@ var Modal = function Modal(_ref) {
   }, children));
 };
 
-var _excluded$a = ["className", "children", "show"];
+var _excluded$b = ["className", "children", "show"];
 var UNMOUNT_DELAY_MS = 500;
 var Overlay = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
   var className = _ref.className,
       children = _ref.children,
       _ref$show = _ref.show,
       show = _ref$show === void 0 ? true : _ref$show,
-      rest = _objectWithoutProperties(_ref, _excluded$a);
+      rest = _objectWithoutProperties(_ref, _excluded$b);
 
   var _useState = React.useState(show),
       _useState2 = _slicedToArray(_useState, 2),
@@ -11725,7 +11729,7 @@ var Overlay = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
 });
 Overlay.displayName = 'Overlay';
 
-var _excluded$9 = ["children", "className", "contentClassName", "onClose", "overlayClassName", "show", "shards"];
+var _excluded$a = ["children", "className", "contentClassName", "onClose", "overlayClassName", "show", "shards"];
 var ModalOverlay = function ModalOverlay(_ref) {
   var children = _ref.children,
       className = _ref.className,
@@ -11735,7 +11739,7 @@ var ModalOverlay = function ModalOverlay(_ref) {
       _ref$show = _ref.show,
       show = _ref$show === void 0 ? true : _ref$show,
       shards = _ref.shards,
-      rest = _objectWithoutProperties(_ref, _excluded$9);
+      rest = _objectWithoutProperties(_ref, _excluded$a);
 
   var element = React.useMemo(function () {
     return typeof document !== 'undefined' ? document.createElement('div') : null;
@@ -12006,7 +12010,7 @@ var Paginator = function Paginator(_ref) {
   })));
 };
 
-var _excluded$8 = ["className", "children", "content", "open", "anchor", "zIndex", "autoPreview", "smoothTransitioning"];
+var _excluded$9 = ["className", "children", "content", "open", "anchor", "zIndex", "autoPreview", "smoothTransitioning"];
 var POPOVER_MOUSEOUT_DELAY_MS = 200;
 var THREE_QUARTER_SECOND_DELAY = 750;
 var ONE_SECOND_DELAY = 1000;
@@ -12034,7 +12038,7 @@ var Popover = function Popover(_ref) {
       autoPreview = _ref$autoPreview === void 0 ? false : _ref$autoPreview,
       _ref$smoothTransition = _ref.smoothTransitioning,
       smoothTransitioning = _ref$smoothTransition === void 0 ? false : _ref$smoothTransition,
-      rest = _objectWithoutProperties(_ref, _excluded$8);
+      rest = _objectWithoutProperties(_ref, _excluded$9);
 
   var _useState = React.useState(function () {
     if (open && smoothTransitioning) {
@@ -12137,11 +12141,11 @@ var Popover = function Popover(_ref) {
   }, content)), children));
 };
 
-var _excluded$7 = ["className", "children"];
+var _excluded$8 = ["className", "children"];
 var PromoBanner = function PromoBanner(_ref) {
   var className = _ref.className,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$7);
+      rest = _objectWithoutProperties(_ref, _excluded$8);
 
   var length = React.Children.count(children);
   return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
@@ -12160,7 +12164,7 @@ var PromoBanner = function PromoBanner(_ref) {
   })));
 };
 
-var _excluded$6 = ["className", "checked", "children", "value", "tabIndex", "disabled"];
+var _excluded$7 = ["className", "checked", "children", "value", "tabIndex", "disabled"];
 var RadioButton = function RadioButton(_ref) {
   var className = _ref.className,
       checked = _ref.checked,
@@ -12168,12 +12172,12 @@ var RadioButton = function RadioButton(_ref) {
       value = _ref.value,
       tabIndex = _ref.tabIndex,
       disabled = _ref.disabled,
-      rest = _objectWithoutProperties(_ref, _excluded$6);
+      rest = _objectWithoutProperties(_ref, _excluded$7);
 
   var inputRef = React.useRef(null);
   return /*#__PURE__*/React__default["default"].createElement("label", {
     tabIndex: tabIndex !== null && tabIndex !== void 0 ? tabIndex : 0,
-    onKeyPress: function onKeyPress(_ref2) {
+    onKeyDown: function onKeyDown(_ref2) {
       var _inputRef$current;
 
       var key = _ref2.key;
@@ -12205,14 +12209,14 @@ var RadioButton = function RadioButton(_ref) {
   }, children));
 };
 
-var _excluded$5 = ["className", "hover", "selected", "unavailable", "children"];
+var _excluded$6 = ["className", "hover", "selected", "unavailable", "children"];
 var SelectableButton = function SelectableButton(_ref) {
   var className = _ref.className,
       hover = _ref.hover,
       selected = _ref.selected,
       unavailable = _ref.unavailable,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$5);
+      rest = _objectWithoutProperties(_ref, _excluded$6);
 
   return /*#__PURE__*/React__default["default"].createElement(Clickable, _extends$1({
     className: classNames('SelectableButton', {
@@ -12223,13 +12227,13 @@ var SelectableButton = function SelectableButton(_ref) {
   }, rest), /*#__PURE__*/React__default["default"].createElement("span", null, children));
 };
 
-var _excluded$4 = ["className", "disabled", "onRemove", "children"];
+var _excluded$5 = ["className", "disabled", "onRemove", "children"];
 var Tag = function Tag(_ref) {
   var className = _ref.className,
       disabled = _ref.disabled,
       onRemove = _ref.onRemove,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$4);
+      rest = _objectWithoutProperties(_ref, _excluded$5);
 
   return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
     className: classNames('Tag', className, {
@@ -12242,13 +12246,13 @@ var Tag = function Tag(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement(Exit16, null)));
 };
 
-var _excluded$3 = ["tabs", "onTabClicked", "activeTab", "className"];
+var _excluded$4 = ["tabs", "onTabClicked", "activeTab", "className"];
 var Tabs = function Tabs(_ref) {
   var tabs = _ref.tabs,
       onTabClicked = _ref.onTabClicked,
       activeTab = _ref.activeTab,
       className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded$3);
+      rest = _objectWithoutProperties(_ref, _excluded$4);
 
   var _useState = React.useState(activeTab || tabs[0].name),
       _useState2 = _slicedToArray(_useState, 2),
@@ -12328,7 +12332,7 @@ var TabPanel = function TabPanel(_ref) {
   }, children);
 };
 
-var _excluded$2 = ["className", "disabled", "error", "focus", "placeholder", "label", "onChange"];
+var _excluded$3 = ["className", "disabled", "error", "focus", "placeholder", "label", "onChange"];
 var Textarea = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
   var className = _ref.className,
       disabled = _ref.disabled,
@@ -12337,7 +12341,7 @@ var Textarea = /*#__PURE__*/React__default["default"].forwardRef(function (_ref,
       placeholder = _ref.placeholder,
       label = _ref.label,
       _onChange = _ref.onChange,
-      rest = _objectWithoutProperties(_ref, _excluded$2);
+      rest = _objectWithoutProperties(_ref, _excluded$3);
 
   return /*#__PURE__*/React__default["default"].createElement("textarea", _extends$1({
     className: classNames('Textarea', className, {
@@ -12356,13 +12360,13 @@ var Textarea = /*#__PURE__*/React__default["default"].forwardRef(function (_ref,
 });
 Textarea.displayName = 'Textarea';
 
-var _excluded$1 = ["theme", "className", "onRemove", "children"];
+var _excluded$2 = ["theme", "className", "onRemove", "children"];
 var Toast = function Toast(_ref) {
   var theme = _ref.theme,
       className = _ref.className,
       onRemove = _ref.onRemove,
       children = _ref.children,
-      rest = _objectWithoutProperties(_ref, _excluded$1);
+      rest = _objectWithoutProperties(_ref, _excluded$2);
 
   return /*#__PURE__*/React__default["default"].createElement(Stack, _extends$1({
     className: classNames('Toast', "Toast--".concat(theme), className),
@@ -12379,11 +12383,11 @@ var Toast = function Toast(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement(Exit16, null)));
 };
 
-var _excluded = ["className", "double"];
+var _excluded$1 = ["className", "double"];
 var VerticalDivider = function VerticalDivider(_ref) {
   var className = _ref.className,
       _double = _ref["double"],
-      rest = _objectWithoutProperties(_ref, _excluded);
+      rest = _objectWithoutProperties(_ref, _excluded$1);
 
   return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
     className: classNames('VerticalDivider', {
@@ -12393,7 +12397,7 @@ var VerticalDivider = function VerticalDivider(_ref) {
 };
 
 var PasswordInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var rest = _extends$1({}, _ref);
+  var rest = _extends$1({}, (_objectDestructuringEmpty(_ref), _ref));
 
   var _useState = React.useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -12422,6 +12426,44 @@ var PasswordInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
 });
 PasswordInput.displayName = 'PasswordInput';
 
+var _excluded = ["className", "title", "visible", "children", "onClose"];
+var SlidingPane = function SlidingPane(_ref) {
+  var className = _ref.className,
+      title = _ref.title,
+      visible = _ref.visible,
+      children = _ref.children,
+      onClose = _ref.onClose,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames('SlidingPane__overlay', {
+      'SlidingPane__overlay--active': visible
+    }),
+    onClick: onClose
+  }), /*#__PURE__*/React__default["default"].createElement(FocusOn, {
+    enabled: visible,
+    onClickOutside: onClose,
+    onEscapeKey: onClose
+  }, /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
+    className: classNames('SlidingPane', className, {
+      'SlidingPane--active': visible
+    })
+  }, rest), /*#__PURE__*/React__default["default"].createElement(Stack, {
+    space: 0,
+    justifyContent: "center",
+    direction: "horizontal",
+    className: "SlidingPane__top"
+  }, /*#__PURE__*/React__default["default"].createElement(Text, {
+    treatment: "h5",
+    family: "serif"
+  }, title), /*#__PURE__*/React__default["default"].createElement(Clickable, {
+    className: "SlidingPane__close",
+    onClick: onClose
+  }, /*#__PURE__*/React__default["default"].createElement(Exit16, null))), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "SlidingPane__content"
+  }, children))));
+};
+
 var tokens = {
   colors: dist$4.colors,
   typography: dist$4.typography,
@@ -12474,6 +12516,7 @@ exports.SKU_COLORS = SKU_COLORS;
 exports.SearchInput = SearchInput;
 exports.Select = Select;
 exports.SelectableButton = SelectableButton;
+exports.SlidingPane = SlidingPane;
 exports.Stack = Stack;
 exports.Tab = Tab;
 exports.TabList = TabList;