@zendeskgarden/react-forms 8.62.1 → 8.62.2

package/dist/index.cjs.js

@@ -7,8 +7,6 @@
 
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var React = require('react');
 var containerField = require('@zendeskgarden/container-field');
 var styled = require('styled-components');
@@ -20,7 +18,7 @@ var mergeRefs = require('react-merge-refs');
 var debounce = require('lodash.debounce');
 var containerSlider = require('@zendeskgarden/container-slider');
 
-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;
@@ -36,16 +34,15 @@ function _interopNamespace(e) {
       }
     });
   }
-  n["default"] = e;
+  n.default = e;
   return Object.freeze(n);
 }
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
-var mergeRefs__default = /*#__PURE__*/_interopDefaultLegacy(mergeRefs);
-var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var mergeRefs__default = /*#__PURE__*/_interopDefault(mergeRefs);
+var debounce__default = /*#__PURE__*/_interopDefault(debounce);
 
 function _extends$t() {
   _extends$t = Object.assign ? Object.assign.bind() : function (target) {
@@ -69,9 +66,9 @@ const useFieldContext = () => {
 };
 
 const COMPONENT_ID$K = 'forms.field';
-const StyledField = styled__default["default"].div.attrs({
+const StyledField = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$K,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledField",
   componentId: "sc-12gzfsu-0"
@@ -81,10 +78,10 @@ StyledField.defaultProps = {
 };
 
 const COMPONENT_ID$J = 'forms.fieldset';
-const StyledFieldset = styled__default["default"](StyledField).attrs({
+const StyledFieldset = styled__default.default(StyledField).attrs({
   as: 'fieldset',
   'data-garden-id': COMPONENT_ID$J,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledFieldset",
   componentId: "sc-1vr4mxv-0"
@@ -94,9 +91,9 @@ StyledFieldset.defaultProps = {
 };
 
 const COMPONENT_ID$I = 'forms.input_label';
-const StyledLabel = styled__default["default"].label.attrs({
+const StyledLabel = styled__default.default.label.attrs({
   'data-garden-id': COMPONENT_ID$I,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledLabel",
   componentId: "sc-2utmsz-0"
@@ -106,10 +103,10 @@ StyledLabel.defaultProps = {
 };
 
 const COMPONENT_ID$H = 'forms.fieldset_legend';
-const StyledLegend = styled__default["default"](StyledLabel).attrs({
+const StyledLegend = styled__default.default(StyledLabel).attrs({
   as: 'legend',
   'data-garden-id': COMPONENT_ID$H,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledLegend",
   componentId: "sc-6s0zwq-0"
@@ -119,9 +116,9 @@ StyledLegend.defaultProps = {
 };
 
 const COMPONENT_ID$G = 'forms.input_hint';
-const StyledHint = styled__default["default"].div.attrs({
+const StyledHint = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$G,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledHint",
   componentId: "sc-17c2wu8-0"
@@ -222,20 +219,20 @@ const MessageIcon = _ref => {
   } = _ref;
   let retVal;
   if (validation === 'error') {
-    retVal = React__default["default"].createElement(SvgAlertErrorStroke, props);
+    retVal = React__namespace.default.createElement(SvgAlertErrorStroke, props);
   } else if (validation === 'success') {
-    retVal = React__default["default"].createElement(SvgCheckCircleStroke$1, props);
+    retVal = React__namespace.default.createElement(SvgCheckCircleStroke$1, props);
   } else if (validation === 'warning') {
-    retVal = React__default["default"].createElement(SvgAlertWarningStroke, props);
+    retVal = React__namespace.default.createElement(SvgAlertWarningStroke, props);
   } else {
-    retVal = React__default["default"].cloneElement(React.Children.only(children));
+    retVal = React__namespace.default.cloneElement(React.Children.only(children));
   }
   return retVal;
 };
 const COMPONENT_ID$F = 'forms.input_message_icon';
-const StyledMessageIcon = styled__default["default"](MessageIcon).attrs({
+const StyledMessageIcon = styled__default.default(MessageIcon).attrs({
   'data-garden-id': COMPONENT_ID$F,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   'aria-hidden': null
 }).withConfig({
   displayName: "StyledMessageIcon",
@@ -261,9 +258,9 @@ const validationStyles = props => {
   return styled.css(["padding-", ":", ";color:", ";"], rtl ? 'right' : 'left', props.validation && padding, color);
 };
 const COMPONENT_ID$E = 'forms.input_message';
-const StyledMessage = styled__default["default"].div.attrs({
+const StyledMessage = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$E,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledMessage",
   componentId: "sc-30hgg7-0"
@@ -340,9 +337,9 @@ const sizeStyles$f = props => {
   const swatchMarginHorizontal = polished.math(`${paddingVertical} + ${swatchMarginVertical} - ${paddingHorizontal}`);
   return styled.css(["padding:", ";min-height:", ";line-height:", ";font-size:", ";&::-ms-browse{font-size:", ";}&[type='date'],&[type='datetime-local'],&[type='file'],&[type='month'],&[type='time'],&[type='week']{max-height:", ";}&[type='file']{line-height:1;}@supports (-ms-ime-align:auto){&[type='color']{padding:", ";}}&::-moz-color-swatch{margin-top:", ";margin-left:", ";width:calc(100% + ", ");height:", ";}&::-webkit-color-swatch{margin:", " ", ";}", ":not([hidden]) + &&,", " + &&,", " + &&,&& + ", ",&& + ", "{margin-top:", "px;}"], padding, props.isBare ? '1em' : height, reactTheming.getLineHeight(lineHeight, fontSize), fontSize, browseFontSize, height, props.isCompact ? '0 2px' : '1px 3px', swatchMarginVertical, swatchMarginHorizontal, polished.math(`${swatchMarginHorizontal} * -2`), swatchHeight, swatchMarginVertical, swatchMarginHorizontal, StyledLabel, StyledHint, StyledMessage, StyledHint, StyledMessage, props.theme.space.base * (props.isCompact ? 1 : 2));
 };
-const StyledTextInput = styled__default["default"].input.attrs(props => ({
+const StyledTextInput = styled__default.default.input.attrs(props => ({
   'data-garden-id': COMPONENT_ID$D,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   'aria-invalid': isInvalid(props.validation)
 })).withConfig({
   displayName: "StyledTextInput",
@@ -362,10 +359,10 @@ const hiddenStyles = `
   left: 0;
   transform: translateZ(0);
 `;
-const StyledTextarea = styled__default["default"](StyledTextInput).attrs({
+const StyledTextarea = styled__default.default(StyledTextInput).attrs({
   as: 'textarea',
   'data-garden-id': COMPONENT_ID$C,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledTextarea",
   componentId: "sc-wxschl-0"
@@ -396,7 +393,7 @@ const sizeStyles$e = props => {
   }
   return styled.css(["margin:", ";width:", ";height:", ";"], margin, size, size);
 };
-const StyledTextMediaFigure = styled__default["default"](
+const StyledTextMediaFigure = styled__default.default(
 _ref => {
   let {
     children,
@@ -408,10 +405,10 @@ _ref => {
     theme,
     ...props
   } = _ref;
-  return React__default["default"].cloneElement(React.Children.only(children), props);
+  return React__namespace.default.cloneElement(React.Children.only(children), props);
 }).attrs({
   'data-garden-id': COMPONENT_ID$B,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledTextMediaFigure",
   componentId: "sc-1qepknj-0"
@@ -421,12 +418,12 @@ StyledTextMediaFigure.defaultProps = {
 };
 
 const COMPONENT_ID$A = 'forms.faux_input';
-const StyledTextFauxInput = styled__default["default"](StyledTextInput).attrs(props => ({
+const StyledTextFauxInput = styled__default.default(StyledTextInput).attrs(props => ({
   as: 'div',
   'aria-readonly': props.isReadOnly,
   'aria-disabled': props.isDisabled,
   'data-garden-id': COMPONENT_ID$A,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 })).withConfig({
   displayName: "StyledTextFauxInput",
   componentId: "sc-yqw7j9-0"
@@ -436,9 +433,9 @@ StyledTextFauxInput.defaultProps = {
 };
 
 const COMPONENT_ID$z = 'forms.media_input';
-const StyledTextMediaInput = styled__default["default"](StyledTextInput).attrs({
+const StyledTextMediaInput = styled__default.default(StyledTextInput).attrs({
   'data-garden-id': COMPONENT_ID$z,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   isBare: true
 }).withConfig({
   displayName: "StyledTextMediaInput",
@@ -459,9 +456,9 @@ const itemStyles = props => {
   const horizontal = props.theme.rtl ? 'right' : 'left';
   return styled.css(["& > *{margin-", ":-", " !important;z-index:-1;}& > ", ":hover,& > button:hover,& > ", "[data-garden-focus-visible],& > button[data-garden-focus-visible],& > ", ":active,& > button:active{z-index:1;}& > button:disabled{border-top-width:0;border-bottom-width:0;}& > ", ":disabled{z-index:-2;}& > *:first-child:not(:last-child){margin-", ":0;border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:last-child:not(:first-child){border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:not(:first-child):not(:last-child){border-radius:0;}"], horizontal, props.theme.borderWidths.sm, StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, props.theme.rtl ? 'right' : 'left', props.theme.rtl ? 'left' : 'right', props.theme.rtl ? 'left' : 'right', props.theme.rtl ? 'right' : 'left', props.theme.rtl ? 'right' : 'left');
 };
-const StyledInputGroup = styled__default["default"].div.attrs({
+const StyledInputGroup = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$y,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledInputGroup",
   componentId: "sc-kjh1f0-0"
@@ -477,9 +474,9 @@ const sizeStyles$d = props => {
   const lineHeight = props.theme.space.base * 5;
   return styled.css(["padding-", ":", "px;&[hidden]{padding-", ":", "px;line-height:", "px;}"], props.theme.rtl ? 'right' : 'left', padding, props.theme.rtl ? 'right' : 'left', size, lineHeight);
 };
-const StyledRadioLabel = styled__default["default"](StyledLabel).attrs({
+const StyledRadioLabel = styled__default.default(StyledLabel).attrs({
   'data-garden-id': COMPONENT_ID$x,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   isRadio: true
 }).withConfig({
   displayName: "StyledRadioLabel",
@@ -490,9 +487,9 @@ StyledRadioLabel.defaultProps = {
 };
 
 const COMPONENT_ID$w = 'forms.checkbox_label';
-const StyledCheckLabel = styled__default["default"](StyledRadioLabel).attrs({
+const StyledCheckLabel = styled__default.default(StyledRadioLabel).attrs({
   'data-garden-id': COMPONENT_ID$w,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledCheckLabel",
   componentId: "sc-x7nr1-0"
@@ -502,9 +499,9 @@ StyledCheckLabel.defaultProps = {
 };
 
 const COMPONENT_ID$v = 'forms.radio_hint';
-const StyledRadioHint = styled__default["default"](StyledHint).attrs({
+const StyledRadioHint = styled__default.default(StyledHint).attrs({
   'data-garden-id': COMPONENT_ID$v,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledRadioHint",
   componentId: "sc-eo8twg-0"
@@ -514,9 +511,9 @@ StyledRadioHint.defaultProps = {
 };
 
 const COMPONENT_ID$u = 'forms.checkbox_hint';
-const StyledCheckHint = styled__default["default"](StyledRadioHint).attrs({
+const StyledCheckHint = styled__default.default(StyledRadioHint).attrs({
   'data-garden-id': COMPONENT_ID$u,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledCheckHint",
   componentId: "sc-1kl8e8c-0"
@@ -556,9 +553,9 @@ const sizeStyles$c = props => {
   const marginTop = `${props.theme.space.base * (props.isCompact ? 1 : 2)}px`;
   return styled.css(["top:", ";width:", ";height:", ";& ~ ", "::before{top:", ";background-size:", ";width:", ";height:", ";box-sizing:border-box;}& ~ ", " > svg{top:", ";", ":", ";width:", ";height:", ";}&& ~ ", " ~ ", "{margin-top:", ";}"], top, size, size, StyledRadioLabel, top, props.theme.iconSizes.sm, size, size, StyledRadioLabel, iconTop, props.theme.rtl ? 'right' : 'left', iconPosition, iconSize, iconSize, StyledRadioLabel, StyledMessage, marginTop);
 };
-const StyledRadioInput = styled__default["default"].input.attrs({
+const StyledRadioInput = styled__default.default.input.attrs({
   'data-garden-id': COMPONENT_ID$t,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   type: 'radio'
 }).withConfig({
   displayName: "StyledRadioInput",
@@ -578,9 +575,9 @@ const colorStyles$8 = props => {
   const indeterminateDisabledBackgroundColor = reactTheming.getColor('neutralHue', SHADE - 400, props.theme);
   return styled.css(["&:indeterminate ~ ", "::before{border-color:", ";background-color:", ";}&:enabled:indeterminate ~ ", ":active::before{border-color:", ";background-color:", ";}&:disabled:indeterminate ~ ", "::before{border-color:transparent;background-color:", ";}"], StyledCheckLabel, indeterminateBorderColor, indeterminateBackgroundColor, StyledCheckLabel, indeterminateActiveBorderColor, indeterminateActiveBackgroundColor, StyledCheckLabel, indeterminateDisabledBackgroundColor);
 };
-const StyledCheckInput = styled__default["default"](StyledRadioInput).attrs({
+const StyledCheckInput = styled__default.default(StyledRadioInput).attrs({
   'data-garden-id': COMPONENT_ID$s,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   type: 'checkbox'
 }).withConfig({
   displayName: "StyledCheckInput",
@@ -591,9 +588,9 @@ StyledCheckInput.defaultProps = {
 };
 
 const COMPONENT_ID$r = 'forms.radio_message';
-const StyledRadioMessage = styled__default["default"](StyledMessage).attrs({
+const StyledRadioMessage = styled__default.default(StyledMessage).attrs({
   'data-garden-id': COMPONENT_ID$r,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledRadioMessage",
   componentId: "sc-1pmi0q8-0"
@@ -603,9 +600,9 @@ StyledRadioMessage.defaultProps = {
 };
 
 const COMPONENT_ID$q = 'forms.checkbox_message';
-const StyledCheckMessage = styled__default["default"](StyledRadioMessage).attrs({
+const StyledCheckMessage = styled__default.default(StyledRadioMessage).attrs({
   'data-garden-id': COMPONENT_ID$q,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledCheckMessage",
   componentId: "sc-s4p6kd-0"
@@ -638,9 +635,9 @@ var SvgCheckSmFill = function SvgCheckSmFill(props) {
 };
 
 const COMPONENT_ID$p = 'forms.check_svg';
-const StyledCheckSvg = styled__default["default"](SvgCheckSmFill).attrs({
+const StyledCheckSvg = styled__default.default(SvgCheckSmFill).attrs({
   'data-garden-id': COMPONENT_ID$p,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledCheckSvg",
   componentId: "sc-fvxetk-0"
@@ -671,9 +668,9 @@ var SvgDashFill = function SvgDashFill(props) {
 };
 
 const COMPONENT_ID$o = 'forms.dash_svg';
-const StyledDashSvg = styled__default["default"](SvgDashFill).attrs({
+const StyledDashSvg = styled__default.default(SvgDashFill).attrs({
   'data-garden-id': COMPONENT_ID$o,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledDashSvg",
   componentId: "sc-z3vq71-0"
@@ -700,9 +697,9 @@ const sizeStyles$b = props => {
   const lineHeight = reactTheming.getLineHeight(props.theme.space.base * 5, fontSize);
   return styled.css(["padding:", " ", ";min-width:4em;line-height:", ";font-size:", ";", ":not([hidden]) + &&,", " + &&,", " + &&,&& + ", ",&& + ", "{margin-top:", ";}"], paddingVertical, paddingHorizontal, lineHeight, fontSize, StyledLabel, StyledHint, StyledMessage, StyledHint, StyledMessage, marginTop);
 };
-const StyledFileUpload = styled__default["default"].div.attrs({
+const StyledFileUpload = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$n,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledFileUpload",
   componentId: "sc-1rodjgn-0"
@@ -712,9 +709,9 @@ StyledFileUpload.defaultProps = {
 };
 
 const COMPONENT_ID$m = 'forms.file.close';
-const StyledFileClose = styled__default["default"].div.attrs({
+const StyledFileClose = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$m,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledFileClose",
   componentId: "sc-1m31jbf-0"
@@ -779,9 +776,9 @@ const sizeStyles$a = props => {
     }
   `;
 };
-const StyledFile = styled__default["default"].div.attrs({
+const StyledFile = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$l,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledFile",
   componentId: "sc-195lzp1-0"
@@ -791,9 +788,9 @@ StyledFile.defaultProps = {
 };
 
 const COMPONENT_ID$k = 'forms.file.delete';
-const StyledFileDelete = styled__default["default"](StyledFileClose).attrs({
+const StyledFileDelete = styled__default.default(StyledFileClose).attrs({
   'data-garden-id': COMPONENT_ID$k,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledFileDelete",
   componentId: "sc-a8nnhx-0"
@@ -803,17 +800,17 @@ StyledFileDelete.defaultProps = {
 };
 
 const COMPONENT_ID$j = 'forms.file.icon';
-const StyledFileIcon = styled__default["default"](_ref => {
+const StyledFileIcon = styled__default.default(_ref => {
   let {
     children,
     isCompact,
     theme,
     ...props
   } = _ref;
-  return React__default["default"].cloneElement(React.Children.only(children), props);
+  return React__namespace.default.cloneElement(React.Children.only(children), props);
 }).attrs({
   'data-garden-id': COMPONENT_ID$j,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledFileIcon",
   componentId: "sc-7b3q0c-0"
@@ -823,9 +820,9 @@ StyledFileIcon.defaultProps = {
 };
 
 const COMPONENT_ID$i = 'forms.file_list';
-const StyledFileList = styled__default["default"].ul.attrs({
+const StyledFileList = styled__default.default.ul.attrs({
   'data-garden-id': COMPONENT_ID$i,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledFileList",
   componentId: "sc-gbahjg-0"
@@ -835,9 +832,9 @@ StyledFileList.defaultProps = {
 };
 
 const COMPONENT_ID$h = 'forms.file_list.item';
-const StyledFileListItem = styled__default["default"].li.attrs({
+const StyledFileListItem = styled__default.default.li.attrs({
   'data-garden-id': COMPONENT_ID$h,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledFileListItem",
   componentId: "sc-1ova3lo-0"
@@ -868,9 +865,9 @@ var SvgCircleSmFill$1 = function SvgCircleSmFill(props) {
 };
 
 const COMPONENT_ID$g = 'forms.radio_svg';
-const StyledRadioSvg = styled__default["default"](SvgCircleSmFill$1).attrs({
+const StyledRadioSvg = styled__default.default(SvgCircleSmFill$1).attrs({
   'data-garden-id': COMPONENT_ID$g,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledRadioSvg",
   componentId: "sc-1r1qtr1-0"
@@ -885,9 +882,9 @@ const sizeStyles$9 = props => {
   const padding = size + props.theme.space.base * 2;
   return styled.css(["padding-", ":", "px;&[hidden]{padding-", ":", "px;}"], props.theme.rtl ? 'right' : 'left', padding, props.theme.rtl ? 'right' : 'left', size);
 };
-const StyledToggleLabel = styled__default["default"](StyledCheckLabel).attrs({
+const StyledToggleLabel = styled__default.default(StyledCheckLabel).attrs({
   'data-garden-id': COMPONENT_ID$f,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledToggleLabel",
   componentId: "sc-e0asdk-0"
@@ -897,9 +894,9 @@ StyledToggleLabel.defaultProps = {
 };
 
 const COMPONENT_ID$e = 'forms.toggle_hint';
-const StyledToggleHint = styled__default["default"](StyledHint).attrs({
+const StyledToggleHint = styled__default.default(StyledHint).attrs({
   'data-garden-id': COMPONENT_ID$e,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledToggleHint",
   componentId: "sc-nziggu-0"
@@ -924,9 +921,9 @@ const sizeStyles$8 = props => {
   const checkedIconPosition = polished.math(`${width} - ${iconSize} - ${iconPosition}`);
   return styled.css(["top:0;width:", ";height:", ";& ~ ", "::before{width:", ";height:", ";}& ~ ", " > svg{top:", ";", ":", ";width:", ";height:", ";}&:checked ~ ", " > svg{", ":", ";}"], width, height, StyledToggleLabel, width, height, StyledToggleLabel, iconPosition, props.theme.rtl ? 'right' : 'left', iconPosition, iconSize, iconSize, StyledToggleLabel, props.theme.rtl ? 'right' : 'left', checkedIconPosition);
 };
-const StyledToggleInput = styled__default["default"](StyledCheckInput).attrs({
+const StyledToggleInput = styled__default.default(StyledCheckInput).attrs({
   'data-garden-id': COMPONENT_ID$d,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledToggleInput",
   componentId: "sc-sgp47s-0"
@@ -936,9 +933,9 @@ StyledToggleInput.defaultProps = {
 };
 
 const COMPONENT_ID$c = 'forms.toggle_message';
-const StyledToggleMessage = styled__default["default"](StyledMessage).attrs({
+const StyledToggleMessage = styled__default.default(StyledMessage).attrs({
   'data-garden-id': COMPONENT_ID$c,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledToggleMessage",
   componentId: "sc-13vuvl1-0"
@@ -969,9 +966,9 @@ var SvgCircleSmFill = function SvgCircleSmFill(props) {
 };
 
 const COMPONENT_ID$b = 'forms.toggle_svg';
-const StyledToggleSvg = styled__default["default"](SvgCircleSmFill).attrs({
+const StyledToggleSvg = styled__default.default(SvgCircleSmFill).attrs({
   'data-garden-id': COMPONENT_ID$b,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledToggleSvg",
   componentId: "sc-162xbyx-0"
@@ -991,9 +988,9 @@ const sizeStyles$7 = props => {
   const iconHorizontalPosition = `${props.theme.space.base * 3}px`;
   return styled.css(["padding-", ":", ";& + ", "{top:", ";", ":", ";}"], props.theme.rtl ? 'left' : 'right', !props.isBare && padding, StyledTextMediaFigure, iconVerticalPosition, props.theme.rtl ? 'left' : 'right', iconHorizontalPosition);
 };
-const StyledSelect = styled__default["default"](StyledTextInput).attrs({
+const StyledSelect = styled__default.default(StyledTextInput).attrs({
   'data-garden-id': COMPONENT_ID$a,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   as: 'select'
 }).withConfig({
   displayName: "StyledSelect",
@@ -1004,9 +1001,9 @@ StyledSelect.defaultProps = {
 };
 
 const COMPONENT_ID$9 = 'forms.select_wrapper';
-const StyledSelectWrapper = styled__default["default"](StyledTextFauxInput).attrs({
+const StyledSelectWrapper = styled__default.default(StyledTextFauxInput).attrs({
   'data-garden-id': COMPONENT_ID$9,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   isBare: true
 }).withConfig({
   displayName: "StyledSelectWrapper",
@@ -1128,9 +1125,9 @@ const sizeStyles$6 = props => {
       height: ${trackHeight};
     `));
 };
-const StyledRangeInput = styled__default["default"].input.attrs(props => ({
+const StyledRangeInput = styled__default.default.input.attrs(props => ({
   'data-garden-id': COMPONENT_ID$8,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   type: 'range',
   style: {
     backgroundSize: props.hasLowerTrack && props.backgroundSize
@@ -1161,9 +1158,9 @@ StyledRangeInput.defaultProps = {
 };
 
 const COMPONENT_ID$7 = 'forms.slider';
-const StyledSlider = styled__default["default"].div.attrs({
+const StyledSlider = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$7,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledSlider",
   componentId: "sc-1di437a-0"
@@ -1192,9 +1189,9 @@ const sizeStyles$5 = props => {
   const marginTop = polished.math(`${size} / -2`);
   return styled.css(["margin-top:", ";width:", ";height:", ";"], marginTop, size, size);
 };
-const StyledSliderThumb = styled__default["default"].div.attrs(props => ({
+const StyledSliderThumb = styled__default.default.div.attrs(props => ({
   'data-garden-id': COMPONENT_ID$6,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   'aria-disabled': props.isDisabled
 })).withConfig({
   displayName: "StyledSliderThumb",
@@ -1222,9 +1219,9 @@ const sizeStyles$4 = props => {
   const padding = polished.math(`${props.theme.space.base} * 2.5px`);
   return styled.css(["margin-top:", ";border-radius:", ";background-position:", ";background-size:", ";padding:0 ", ";"], marginTop, borderRadius, backgroundPosition, backgroundSize, padding);
 };
-const StyledSliderTrack = styled__default["default"].div.attrs(props => ({
+const StyledSliderTrack = styled__default.default.div.attrs(props => ({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   'aria-disabled': props.isDisabled
 })).withConfig({
   displayName: "StyledSliderTrack",
@@ -1242,9 +1239,9 @@ const sizeStyles$3 = props => {
   const margin = polished.math(`${props.theme.space.base} * 2.5px`);
   return styled.css(["margin:0 ", " 0 ", ";height:", ";"], props.theme.rtl ? `-${margin}` : margin, props.theme.rtl ? margin : `-${margin}`, height);
 };
-const StyledSliderTrackRail = styled__default["default"].div.attrs({
+const StyledSliderTrackRail = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledSliderTrackRail",
   componentId: "sc-1o5owbd-0"
@@ -1269,9 +1266,9 @@ const sizeStyles$2 = props => {
   }
   return styled.css(["position:", ";top:", ";", ";& > *{width:", ";height:", ";}"], position, top, horizontalValue, iconSize, iconSize);
 };
-const StyledTileIcon = styled__default["default"].span.attrs({
+const StyledTileIcon = styled__default.default.span.attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledTileIcon",
   componentId: "sc-1wazhg4-0"
@@ -1304,9 +1301,9 @@ const colorStyles = props => {
   const selectedDisabledBackgroundColor = disabledBorderColor;
   return styled.css(["border:", " ", ";border-color:", ";background-color:", ";color:", ";", "{color:", ";}&:focus{outline:none;}&:hover:not([aria-disabled='true']){border-color:", ";background-color:", ";", "{color:", ";}}&[data-garden-focus-visible='true']{border-color:", ";box-shadow:", ";}&:active:not([aria-disabled='true']){border-color:", ";background-color:", ";", "{color:", ";}}&[data-garden-selected='true']{border-color:", ";background-color:", ";color:", ";", "{color:", ";}}&[data-garden-selected='true']:not([aria-disabled='true']):hover{border-color:", ";background-color:", ";color:", ";", "{color:", ";}}&[data-garden-selected='true']:not([aria-disabled='true']):active{border-color:", ";background-color:", ";color:", ";", "{color:", ";}}&[aria-disabled='true']{border-color:", ";background-color:", ";color:", ";", "{color:", ";}}&[data-garden-selected='true'][aria-disabled='true']{background-color:", ";color:", ";", "{color:", ";}}"], props.theme.borders.sm, reactTheming.getColor('neutralHue', SHADE - 300, props.theme), borderColor, props.theme.colors.background, color, StyledTileIcon, iconColor, hoverBorderColor, hoverBackgroundColor, StyledTileIcon, color, focusBorderColor, focusBoxShadow, activeBorderColor, activeBackgroundColor, StyledTileIcon, color, selectedBorderColor, selectedBackgroundColor, props.theme.colors.background, StyledTileIcon, props.theme.colors.background, selectedHoverBorderColor, selectedHoverBackgroundColor, props.theme.colors.background, StyledTileIcon, props.theme.colors.background, selectedActiveBorderColor, selectedActiveBackgroundColor, props.theme.colors.background, StyledTileIcon, props.theme.colors.background, disabledBorderColor, disabledBackgroundColor, disabledColor, StyledTileIcon, disabledColor, selectedDisabledBackgroundColor, disabledColor, StyledTileIcon, disabledColor);
 };
-const StyledTile = styled__default["default"].label.attrs(props => ({
+const StyledTile = styled__default.default.label.attrs(props => ({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '8.62.1',
+  'data-garden-version': '8.62.2',
   'data-garden-focus-visible': props.isFocused,
   'data-garden-selected': props.isSelected
 })).withConfig({
@@ -1329,9 +1326,9 @@ const sizeStyles$1 = props => {
   }
   return styled.css(["margin-top:", "px;margin-", ":", ";"], props.theme.space.base, marginDirection, marginValue);
 };
-const StyledTileDescription = styled__default["default"].span.attrs({
+const StyledTileDescription = styled__default.default.span.attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledTileDescription",
   componentId: "sc-xfuu7u-0"
@@ -1340,7 +1337,7 @@ StyledTileDescription.defaultProps = {
   theme: reactTheming.DEFAULT_THEME
 };
 
-const StyledTileInput = styled__default["default"].input.withConfig({
+const StyledTileInput = styled__default.default.input.withConfig({
   displayName: "StyledTileInput",
   componentId: "sc-1nq2m6q-0"
 })(["position:absolute;border:0;clip:rect(1px,1px,1px,1px);padding:0;width:1px;height:1px;overflow:hidden;white-space:nowrap;"]);
@@ -1362,9 +1359,9 @@ const sizeStyles = props => {
   }
   return styled.css(["margin-top:", ";margin-", ":", ";"], marginTop, marginDirection, marginValue);
 };
-const StyledTileLabel = styled__default["default"].span.attrs({
+const StyledTileLabel = styled__default.default.span.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '8.62.1'
+  'data-garden-version': '8.62.2'
 }).withConfig({
   displayName: "StyledTileLabel",
   componentId: "sc-1mypv27-0"
@@ -1373,7 +1370,7 @@ StyledTileLabel.defaultProps = {
   theme: reactTheming.DEFAULT_THEME
 };
 
-const Field = React__default["default"].forwardRef((props, ref) => {
+const Field = React__namespace.default.forwardRef((props, ref) => {
   const [hasHint, setHasHint] = React.useState(false);
   const [hasMessage, setHasMessage] = React.useState(false);
   const [isLabelActive, setIsLabelActive] = React.useState(false);
@@ -1408,9 +1405,9 @@ const Field = React__default["default"].forwardRef((props, ref) => {
     setHasMessage,
     multiThumbRangeRef
   }), [propGetters, getInputProps, getMessageProps, isLabelActive, isLabelHovered, hasHint, hasMessage]);
-  return React__default["default"].createElement(FieldContext.Provider, {
+  return React__namespace.default.createElement(FieldContext.Provider, {
     value: fieldProps
-  }, React__default["default"].createElement(StyledField, _extends$t({}, props, {
+  }, React__namespace.default.createElement(StyledField, _extends$t({}, props, {
     ref: ref
   })));
 });
@@ -1424,7 +1421,7 @@ const useFieldsetContext = () => {
 
 const LegendComponent = React.forwardRef((props, ref) => {
   const fieldsetContext = useFieldsetContext();
-  return React__default["default"].createElement(StyledLegend, _extends$t({}, props, fieldsetContext, {
+  return React__namespace.default.createElement(StyledLegend, _extends$t({}, props, fieldsetContext, {
     ref: ref
   }));
 });
@@ -1435,15 +1432,15 @@ const FieldsetComponent = React.forwardRef((props, ref) => {
   const fieldsetContext = React.useMemo(() => ({
     isCompact: props.isCompact
   }), [props.isCompact]);
-  return React__default["default"].createElement(FieldsetContext.Provider, {
+  return React__namespace.default.createElement(FieldsetContext.Provider, {
     value: fieldsetContext
-  }, React__default["default"].createElement(StyledFieldset, _extends$t({}, props, {
+  }, React__namespace.default.createElement(StyledFieldset, _extends$t({}, props, {
     ref: ref
   })));
 });
 FieldsetComponent.displayName = 'Fieldset';
 FieldsetComponent.propTypes = {
-  isCompact: PropTypes__default["default"].bool
+  isCompact: PropTypes__default.default.bool
 };
 const Fieldset = FieldsetComponent;
 Fieldset.Legend = Legend;
@@ -1453,7 +1450,7 @@ const useInputContext = () => {
   return React.useContext(InputContext);
 };
 
-const Hint = React__default["default"].forwardRef((props, ref) => {
+const Hint = React__namespace.default.forwardRef((props, ref) => {
   const {
     hasHint,
     setHasHint,
@@ -1484,13 +1481,13 @@ const Hint = React__default["default"].forwardRef((props, ref) => {
   if (getHintProps) {
     combinedProps = getHintProps(combinedProps);
   }
-  return React__default["default"].createElement(HintComponent, _extends$t({
+  return React__namespace.default.createElement(HintComponent, _extends$t({
     ref: ref
   }, combinedProps));
 });
 Hint.displayName = 'Hint';
 
-const Label$1 = React__default["default"].forwardRef((props, ref) => {
+const Label$1 = React__namespace.default.forwardRef((props, ref) => {
   const fieldContext = useFieldContext();
   const fieldsetContext = useFieldsetContext();
   const type = useInputContext();
@@ -1530,9 +1527,9 @@ const Label$1 = React__default["default"].forwardRef((props, ref) => {
     };
   }
   if (type === 'radio') {
-    return React__default["default"].createElement(StyledRadioLabel, _extends$t({
+    return React__namespace.default.createElement(StyledRadioLabel, _extends$t({
       ref: ref
-    }, combinedProps), React__default["default"].createElement(StyledRadioSvg, null), props.children);
+    }, combinedProps), React__namespace.default.createElement(StyledRadioSvg, null), props.children);
   } else if (type === 'checkbox') {
     const onLabelSelect = e => {
       const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
@@ -1553,28 +1550,28 @@ const Label$1 = React__default["default"].forwardRef((props, ref) => {
       ...combinedProps,
       onClick: containerUtilities.composeEventHandlers(combinedProps.onClick, onLabelSelect)
     };
-    return React__default["default"].createElement(StyledCheckLabel, _extends$t({
+    return React__namespace.default.createElement(StyledCheckLabel, _extends$t({
       ref: ref
-    }, combinedProps), React__default["default"].createElement(StyledCheckSvg, null), React__default["default"].createElement(StyledDashSvg, null), props.children);
+    }, combinedProps), React__namespace.default.createElement(StyledCheckSvg, null), React__namespace.default.createElement(StyledDashSvg, null), props.children);
   } else if (type === 'toggle') {
-    return React__default["default"].createElement(StyledToggleLabel, _extends$t({
+    return React__namespace.default.createElement(StyledToggleLabel, _extends$t({
       ref: ref
-    }, combinedProps), React__default["default"].createElement(StyledToggleSvg, null), props.children);
+    }, combinedProps), React__namespace.default.createElement(StyledToggleSvg, null), props.children);
   }
-  return React__default["default"].createElement(StyledLabel, _extends$t({
+  return React__namespace.default.createElement(StyledLabel, _extends$t({
     ref: ref
   }, combinedProps));
 });
 Label$1.displayName = 'Label';
 Label$1.propTypes = {
-  isRegular: PropTypes__default["default"].bool
+  isRegular: PropTypes__default.default.bool
 };
 
 const VALIDATION = ['success', 'warning', 'error'];
 const FILE_VALIDATION = ['success', 'error'];
 const FILE_TYPE = ['pdf', 'zip', 'image', 'document', 'spreadsheet', 'presentation', 'generic'];
 
-const Message = React__default["default"].forwardRef((_ref, ref) => {
+const Message = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     validation,
     validationLabel,
@@ -1616,20 +1613,20 @@ const Message = React__default["default"].forwardRef((_ref, ref) => {
     combinedProps = getMessageProps(combinedProps);
   }
   const ariaLabel = reactTheming.useText(Message, combinedProps, 'validationLabel', validation);
-  return React__default["default"].createElement(MessageComponent, _extends$t({
+  return React__namespace.default.createElement(MessageComponent, _extends$t({
     ref: ref
-  }, combinedProps), validation && React__default["default"].createElement(StyledMessageIcon, {
+  }, combinedProps), validation && React__namespace.default.createElement(StyledMessageIcon, {
     validation: validation,
     "aria-label": ariaLabel
   }), children);
 });
 Message.displayName = 'Message';
 Message.propTypes = {
-  validation: PropTypes__default["default"].oneOf(VALIDATION),
-  validationLabel: PropTypes__default["default"].string
+  validation: PropTypes__default.default.oneOf(VALIDATION),
+  validationLabel: PropTypes__default.default.string
 };
 
-const Checkbox = React__default["default"].forwardRef((_ref, ref) => {
+const Checkbox = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     indeterminate,
     children,
@@ -1659,14 +1656,14 @@ const Checkbox = React__default["default"].forwardRef((_ref, ref) => {
   if (fieldContext) {
     combinedProps = fieldContext.getInputProps(combinedProps);
   }
-  return React__default["default"].createElement(InputContext.Provider, {
+  return React__namespace.default.createElement(InputContext.Provider, {
     value: "checkbox"
-  }, React__default["default"].createElement(StyledCheckInput, combinedProps), children);
+  }, React__namespace.default.createElement(StyledCheckInput, combinedProps), children);
 });
 Checkbox.displayName = 'Checkbox';
 Checkbox.propTypes = {
-  isCompact: PropTypes__default["default"].bool,
-  indeterminate: PropTypes__default["default"].bool
+  isCompact: PropTypes__default.default.bool,
+  indeterminate: PropTypes__default.default.bool
 };
 
 const InputGroupContext = React.createContext(undefined);
@@ -1674,7 +1671,7 @@ const useInputGroupContext = () => {
   return React.useContext(InputGroupContext);
 };
 
-const Input = React__default["default"].forwardRef((_ref, ref) => {
+const Input = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     onSelect,
     ...props
@@ -1699,17 +1696,17 @@ const Input = React__default["default"].forwardRef((_ref, ref) => {
   if (fieldContext) {
     combinedProps = fieldContext.getInputProps(combinedProps);
   }
-  return React__default["default"].createElement(StyledTextInput, combinedProps);
+  return React__namespace.default.createElement(StyledTextInput, combinedProps);
 });
 Input.propTypes = {
-  isCompact: PropTypes__default["default"].bool,
-  isBare: PropTypes__default["default"].bool,
-  focusInset: PropTypes__default["default"].bool,
-  validation: PropTypes__default["default"].oneOf(VALIDATION)
+  isCompact: PropTypes__default.default.bool,
+  isBare: PropTypes__default.default.bool,
+  focusInset: PropTypes__default.default.bool,
+  validation: PropTypes__default.default.oneOf(VALIDATION)
 };
 Input.displayName = 'Input';
 
-const Radio = React__default["default"].forwardRef((_ref, ref) => {
+const Radio = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     children,
     ...props
@@ -1724,16 +1721,16 @@ const Radio = React__default["default"].forwardRef((_ref, ref) => {
   if (fieldContext) {
     combinedProps = fieldContext.getInputProps(combinedProps);
   }
-  return React__default["default"].createElement(InputContext.Provider, {
+  return React__namespace.default.createElement(InputContext.Provider, {
     value: "radio"
-  }, React__default["default"].createElement(StyledRadioInput, combinedProps), children);
+  }, React__namespace.default.createElement(StyledRadioInput, combinedProps), children);
 });
 Radio.displayName = 'Radio';
 Radio.propTypes = {
-  isCompact: PropTypes__default["default"].bool
+  isCompact: PropTypes__default.default.bool
 };
 
-const Range = React__default["default"].forwardRef((_ref, ref) => {
+const Range = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     hasLowerTrack,
     min,
@@ -1763,7 +1760,7 @@ const Range = React__default["default"].forwardRef((_ref, ref) => {
     updateBackgroundWidthFromInput(event.target);
   }) : props.onChange;
   let combinedProps = {
-    ref: mergeRefs__default["default"]([rangeRef, ref]),
+    ref: mergeRefs__default.default([rangeRef, ref]),
     hasLowerTrack,
     min,
     max,
@@ -1777,7 +1774,7 @@ const Range = React__default["default"].forwardRef((_ref, ref) => {
       isDescribed: true
     });
   }
-  return React__default["default"].createElement(StyledRangeInput, combinedProps);
+  return React__namespace.default.createElement(StyledRangeInput, combinedProps);
 });
 Range.defaultProps = {
   hasLowerTrack: true,
@@ -1790,7 +1787,7 @@ Range.displayName = 'Range';
 const parseStyleValue = value => {
   return parseInt(value, 10) || 0;
 };
-const Textarea = React__default["default"].forwardRef((_ref, ref) => {
+const Textarea = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     minRows,
     maxRows,
@@ -1859,7 +1856,7 @@ const Textarea = React__default["default"].forwardRef((_ref, ref) => {
     }
     if (environment) {
       const win = environment.defaultView || window;
-      const resizeHandler = debounce__default["default"](calculateHeight);
+      const resizeHandler = debounce__default.default(calculateHeight);
       win.addEventListener('resize', resizeHandler);
       return () => {
         resizeHandler.cancel();
@@ -1880,7 +1877,7 @@ const Textarea = React__default["default"].forwardRef((_ref, ref) => {
     event.currentTarget.select();
   }) : onSelect;
   let combinedProps = {
-    ref: mergeRefs__default["default"]([textAreaRef, ref]),
+    ref: mergeRefs__default.default([textAreaRef, ref]),
     rows: minRows,
     onChange: onChangeHandler,
     onSelect: onSelectHandler,
@@ -1895,7 +1892,7 @@ const Textarea = React__default["default"].forwardRef((_ref, ref) => {
       isDescribed: true
     });
   }
-  return React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(StyledTextarea, combinedProps), isAutoResizable && React__default["default"].createElement(StyledTextarea, {
+  return React__namespace.default.createElement(React__namespace.default.Fragment, null, React__namespace.default.createElement(StyledTextarea, combinedProps), isAutoResizable && React__namespace.default.createElement(StyledTextarea, {
     "aria-hidden": true,
     readOnly: true,
     isHidden: true,
@@ -1908,17 +1905,17 @@ const Textarea = React__default["default"].forwardRef((_ref, ref) => {
   }));
 });
 Textarea.propTypes = {
-  isCompact: PropTypes__default["default"].bool,
-  isBare: PropTypes__default["default"].bool,
-  focusInset: PropTypes__default["default"].bool,
-  isResizable: PropTypes__default["default"].bool,
-  minRows: PropTypes__default["default"].number,
-  maxRows: PropTypes__default["default"].number,
-  validation: PropTypes__default["default"].oneOf(VALIDATION)
+  isCompact: PropTypes__default.default.bool,
+  isBare: PropTypes__default.default.bool,
+  focusInset: PropTypes__default.default.bool,
+  isResizable: PropTypes__default.default.bool,
+  minRows: PropTypes__default.default.number,
+  maxRows: PropTypes__default.default.number,
+  validation: PropTypes__default.default.oneOf(VALIDATION)
 };
 Textarea.displayName = 'Textarea';
 
-const Toggle = React__default["default"].forwardRef((_ref, ref) => {
+const Toggle = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     children,
     ...props
@@ -1933,13 +1930,13 @@ const Toggle = React__default["default"].forwardRef((_ref, ref) => {
   if (fieldContext) {
     combinedProps = fieldContext.getInputProps(combinedProps);
   }
-  return React__default["default"].createElement(InputContext.Provider, {
+  return React__namespace.default.createElement(InputContext.Provider, {
     value: "toggle"
-  }, React__default["default"].createElement(StyledToggleInput, combinedProps), children);
+  }, React__namespace.default.createElement(StyledToggleInput, combinedProps), children);
 });
 Toggle.displayName = 'Toggle';
 Toggle.propTypes = {
-  isCompact: PropTypes__default["default"].bool
+  isCompact: PropTypes__default.default.bool
 };
 
 var _path$k;
@@ -1961,13 +1958,13 @@ var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
   })));
 };
 
-const StartIconComponent = props => React__default["default"].createElement(StyledTextMediaFigure, _extends$t({
+const StartIconComponent = props => React__namespace.default.createElement(StyledTextMediaFigure, _extends$t({
   position: "start"
 }, props));
 StartIconComponent.displayName = 'FauxInput.StartIcon';
 const StartIcon = StartIconComponent;
 
-const EndIconComponent = props => React__default["default"].createElement(StyledTextMediaFigure, _extends$t({
+const EndIconComponent = props => React__namespace.default.createElement(StyledTextMediaFigure, _extends$t({
   position: "end"
 }, props));
 EndIconComponent.displayName = 'FauxInput.EndIcon';
@@ -1989,7 +1986,7 @@ const FauxInputComponent = React.forwardRef((_ref, ref) => {
   const onBlurHandler = containerUtilities.composeEventHandlers(onBlur, () => {
     setIsFocused(false);
   });
-  return React__default["default"].createElement(StyledTextFauxInput, _extends$t({
+  return React__namespace.default.createElement(StyledTextFauxInput, _extends$t({
     onFocus: onFocusHandler,
     onBlur: onBlurHandler,
     isFocused: controlledIsFocused === undefined ? isFocused : controlledIsFocused,
@@ -2002,20 +1999,20 @@ const FauxInputComponent = React.forwardRef((_ref, ref) => {
 });
 FauxInputComponent.displayName = 'FauxInput';
 FauxInputComponent.propTypes = {
-  isCompact: PropTypes__default["default"].bool,
-  isBare: PropTypes__default["default"].bool,
-  focusInset: PropTypes__default["default"].bool,
-  disabled: PropTypes__default["default"].bool,
-  readOnly: PropTypes__default["default"].bool,
-  validation: PropTypes__default["default"].oneOf(VALIDATION),
-  isFocused: PropTypes__default["default"].bool,
-  isHovered: PropTypes__default["default"].bool
+  isCompact: PropTypes__default.default.bool,
+  isBare: PropTypes__default.default.bool,
+  focusInset: PropTypes__default.default.bool,
+  disabled: PropTypes__default.default.bool,
+  readOnly: PropTypes__default.default.bool,
+  validation: PropTypes__default.default.oneOf(VALIDATION),
+  isFocused: PropTypes__default.default.bool,
+  isHovered: PropTypes__default.default.bool
 };
 const FauxInput = FauxInputComponent;
 FauxInput.EndIcon = EndIcon;
 FauxInput.StartIcon = StartIcon;
 
-const Select = React__default["default"].forwardRef((_ref, ref) => {
+const Select = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     disabled,
     isCompact,
@@ -2033,17 +2030,17 @@ const Select = React__default["default"].forwardRef((_ref, ref) => {
       isDescribed: true
     });
   }
-  return React__default["default"].createElement(StyledSelectWrapper, {
+  return React__namespace.default.createElement(StyledSelectWrapper, {
     isCompact: isCompact
-  }, React__default["default"].createElement(StyledSelect, combinedProps), !props.isBare && React__default["default"].createElement(FauxInput.EndIcon, {
+  }, React__namespace.default.createElement(StyledSelect, combinedProps), !props.isBare && React__namespace.default.createElement(FauxInput.EndIcon, {
     isDisabled: disabled
-  }, React__default["default"].createElement(SvgChevronDownStroke, null)));
+  }, React__namespace.default.createElement(SvgChevronDownStroke, null)));
 });
 Select.propTypes = {
-  isCompact: PropTypes__default["default"].bool,
-  isBare: PropTypes__default["default"].bool,
-  focusInset: PropTypes__default["default"].bool,
-  validation: PropTypes__default["default"].oneOf(VALIDATION)
+  isCompact: PropTypes__default.default.bool,
+  isBare: PropTypes__default.default.bool,
+  focusInset: PropTypes__default.default.bool,
+  validation: PropTypes__default.default.oneOf(VALIDATION)
 };
 Select.displayName = 'Select';
 
@@ -2109,16 +2106,16 @@ const MultiThumbRange = React.forwardRef((_ref, ref) => {
   const minPosition = (updatedMinValue - min) / (max - min) * trackRect.width;
   const maxPosition = (updatedMaxValue - min) / (max - min) * trackRect.width;
   const sliderBackgroundSize = Math.abs(maxPosition) - Math.abs(minPosition);
-  return React__default["default"].createElement(StyledSlider, _extends$t({
+  return React__namespace.default.createElement(StyledSlider, _extends$t({
     ref: ref,
     onMouseDown: onSliderMouseDown
-  }, props), React__default["default"].createElement(StyledSliderTrack, {
+  }, props), React__namespace.default.createElement(StyledSliderTrack, {
     backgroundSize: sliderBackgroundSize,
     backgroundPosition: theme.rtl ? trackRect.width - maxPosition : minPosition,
     isDisabled: disabled
-  }, React__default["default"].createElement(StyledSliderTrackRail, _extends$t({}, trackProps, {
+  }, React__namespace.default.createElement(StyledSliderTrackRail, _extends$t({}, trackProps, {
     ref: trackRailRef
-  }), React__default["default"].createElement(StyledSliderThumb, _extends$t({}, getMinThumbProps({
+  }), React__namespace.default.createElement(StyledSliderThumb, _extends$t({}, getMinThumbProps({
     'aria-label': updatedMinValue
   }), {
     isDisabled: disabled,
@@ -2126,7 +2123,7 @@ const MultiThumbRange = React.forwardRef((_ref, ref) => {
     ref: minThumbRef,
     "data-garden-active": isLabelActive,
     "data-garden-hover": isLabelHovered
-  })), React__default["default"].createElement(StyledSliderThumb, _extends$t({}, getMaxThumbProps({
+  })), React__namespace.default.createElement(StyledSliderThumb, _extends$t({}, getMaxThumbProps({
     'aria-label': updatedMaxValue
   }), {
     isDisabled: disabled,
@@ -2136,14 +2133,14 @@ const MultiThumbRange = React.forwardRef((_ref, ref) => {
 });
 MultiThumbRange.displayName = 'MultiThumbRange';
 MultiThumbRange.propTypes = {
-  min: PropTypes__default["default"].number,
-  max: PropTypes__default["default"].number,
-  minValue: PropTypes__default["default"].number,
-  maxValue: PropTypes__default["default"].number,
-  step: PropTypes__default["default"].number,
-  jump: PropTypes__default["default"].number,
-  disabled: PropTypes__default["default"].bool,
-  onChange: PropTypes__default["default"].func
+  min: PropTypes__default.default.number,
+  max: PropTypes__default.default.number,
+  minValue: PropTypes__default.default.number,
+  maxValue: PropTypes__default.default.number,
+  step: PropTypes__default.default.number,
+  jump: PropTypes__default.default.number,
+  disabled: PropTypes__default.default.bool,
+  onChange: PropTypes__default.default.func
 };
 MultiThumbRange.defaultProps = {
   min: MIN,
@@ -2156,7 +2153,7 @@ const useTilesContext = () => {
   return React.useContext(TilesContext);
 };
 
-const TileComponent = React__default["default"].forwardRef((_ref, ref) => {
+const TileComponent = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     children,
     value,
@@ -2174,13 +2171,13 @@ const TileComponent = React__default["default"].forwardRef((_ref, ref) => {
       onChange: tilesContext.onChange
     };
   }
-  return React__default["default"].createElement(StyledTile, _extends$t({
+  return React__namespace.default.createElement(StyledTile, _extends$t({
     ref: ref,
     "aria-disabled": disabled,
     isDisabled: disabled,
     isFocused: isFocused,
     isSelected: tilesContext && tilesContext.value === value
-  }, props), children, React__default["default"].createElement(StyledTileInput, _extends$t({}, inputProps, {
+  }, props), children, React__namespace.default.createElement(StyledTileInput, _extends$t({}, inputProps, {
     disabled: disabled,
     value: value,
     onBlur: () => setIsFocused(false),
@@ -2198,14 +2195,14 @@ const TileComponent = React__default["default"].forwardRef((_ref, ref) => {
 });
 TileComponent.displayName = 'Tiles.Tile';
 TileComponent.propTypes = {
-  value: PropTypes__default["default"].string,
-  disabled: PropTypes__default["default"].bool
+  value: PropTypes__default.default.string,
+  disabled: PropTypes__default.default.bool
 };
 const Tile = TileComponent;
 
 const DescriptionComponent = React.forwardRef((props, ref) => {
   const tilesContext = useTilesContext();
-  return React__default["default"].createElement(StyledTileDescription, _extends$t({
+  return React__namespace.default.createElement(StyledTileDescription, _extends$t({
     ref: ref,
     isCentered: tilesContext && tilesContext.isCentered
   }, props));
@@ -2215,7 +2212,7 @@ const Description = DescriptionComponent;
 
 const IconComponent = React.forwardRef((props, ref) => {
   const tileContext = useTilesContext();
-  return React__default["default"].createElement(StyledTileIcon, _extends$t({
+  return React__namespace.default.createElement(StyledTileIcon, _extends$t({
     ref: ref,
     isCentered: tileContext && tileContext.isCentered
   }, props));
@@ -2232,8 +2229,8 @@ const LabelComponent = React.forwardRef((props, forwardedRef) => {
       setTitle(ref.current.textContent || undefined);
     }
   }, [ref]);
-  return React__default["default"].createElement(StyledTileLabel, _extends$t({
-    ref: mergeRefs__default["default"]([ref, forwardedRef]),
+  return React__namespace.default.createElement(StyledTileLabel, _extends$t({
+    ref: mergeRefs__default.default([ref, forwardedRef]),
     title: title,
     isCentered: tilesContext && tilesContext.isCentered
   }, props));
@@ -2266,19 +2263,19 @@ const TilesComponent = React.forwardRef((_ref, ref) => {
     name,
     isCentered
   }), [handleOnChange, selectedValue, name, isCentered]);
-  return React__default["default"].createElement(TilesContext.Provider, {
+  return React__namespace.default.createElement(TilesContext.Provider, {
     value: tileContext
-  }, React__default["default"].createElement("div", _extends$t({
+  }, React__namespace.default.createElement("div", _extends$t({
     ref: ref,
     role: "radiogroup"
   }, props)));
 });
 TilesComponent.displayName = 'Tiles';
 TilesComponent.propTypes = {
-  value: PropTypes__default["default"].string,
-  onChange: PropTypes__default["default"].func,
-  name: PropTypes__default["default"].string.isRequired,
-  isCentered: PropTypes__default["default"].bool
+  value: PropTypes__default.default.string,
+  onChange: PropTypes__default.default.func,
+  name: PropTypes__default.default.string.isRequired,
+  isCentered: PropTypes__default.default.bool
 };
 TilesComponent.defaultProps = {
   isCentered: true
@@ -2289,7 +2286,7 @@ Tiles.Icon = Icon;
 Tiles.Label = Label;
 Tiles.Tile = Tile;
 
-const InputGroup = React__default["default"].forwardRef((_ref, ref) => {
+const InputGroup = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     isCompact,
     ...props
@@ -2297,32 +2294,34 @@ const InputGroup = React__default["default"].forwardRef((_ref, ref) => {
   const contextValue = React.useMemo(() => ({
     isCompact
   }), [isCompact]);
-  return React__default["default"].createElement(InputGroupContext.Provider, {
+  return React__namespace.default.createElement(InputGroupContext.Provider, {
     value: contextValue
-  }, React__default["default"].createElement(StyledInputGroup, _extends$t({
+  }, React__namespace.default.createElement(StyledInputGroup, _extends$t({
     ref: ref,
     isCompact: isCompact
   }, props)));
 });
 InputGroup.displayName = 'InputGroup';
 InputGroup.propTypes = {
-  isCompact: PropTypes__default["default"].bool
+  isCompact: PropTypes__default.default.bool
 };
 
-const FileUpload = React__default["default"].forwardRef((_ref, ref) => {
+const FileUpload = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     disabled,
     ...props
   } = _ref;
-  return React__default["default"].createElement(StyledFileUpload, _extends$t({
+  return React__namespace.default.createElement(StyledFileUpload, _extends$t({
     ref: ref,
     "aria-disabled": disabled
-  }, props));
+  }, props, {
+    role: "button"
+  }));
 });
 FileUpload.propTypes = {
-  isDragging: PropTypes__default["default"].bool,
-  isCompact: PropTypes__default["default"].bool,
-  disabled: PropTypes__default["default"].bool
+  isDragging: PropTypes__default.default.bool,
+  isCompact: PropTypes__default.default.bool,
+  disabled: PropTypes__default.default.bool
 };
 FileUpload.displayName = 'FileUpload';
 
@@ -2330,7 +2329,7 @@ const ItemComponent = React.forwardRef((_ref, ref) => {
   let {
     ...props
   } = _ref;
-  return React__default["default"].createElement(StyledFileListItem, _extends$t({}, props, {
+  return React__namespace.default.createElement(StyledFileListItem, _extends$t({}, props, {
     ref: ref
   }));
 });
@@ -2341,7 +2340,7 @@ const FileListComponent = React.forwardRef((_ref, ref) => {
   let {
     ...props
   } = _ref;
-  return React__default["default"].createElement(StyledFileList, _extends$t({}, props, {
+  return React__namespace.default.createElement(StyledFileList, _extends$t({}, props, {
     ref: ref
   }));
 });
@@ -2394,15 +2393,15 @@ const useFileContext = () => {
   return React.useContext(FileContext);
 };
 
-const CloseComponent = React__default["default"].forwardRef((props, ref) => {
+const CloseComponent = React__namespace.default.forwardRef((props, ref) => {
   const fileContext = useFileContext();
   const onMouseDown = containerUtilities.composeEventHandlers(props.onMouseDown, event => event.preventDefault()
   );
-  return React__default["default"].createElement(StyledFileClose, _extends$t({
+  return React__namespace.default.createElement(StyledFileClose, _extends$t({
     ref: ref
   }, props, {
     onMouseDown: onMouseDown
-  }), fileContext && fileContext.isCompact ? React__default["default"].createElement(SvgXStroke$1, null) : React__default["default"].createElement(SvgXStroke, null));
+  }), fileContext && fileContext.isCompact ? React__namespace.default.createElement(SvgXStroke$1, null) : React__namespace.default.createElement(SvgXStroke, null));
 });
 CloseComponent.displayName = 'File.Close';
 const Close = CloseComponent;
@@ -2449,15 +2448,15 @@ var SvgTrashStroke = function SvgTrashStroke(props) {
   })));
 };
 
-const DeleteComponent = React__default["default"].forwardRef((props, ref) => {
+const DeleteComponent = React__namespace.default.forwardRef((props, ref) => {
   const fileContext = useFileContext();
   const onMouseDown = containerUtilities.composeEventHandlers(props.onMouseDown, event => event.preventDefault()
   );
-  return React__default["default"].createElement(StyledFileDelete, _extends$t({
+  return React__namespace.default.createElement(StyledFileDelete, _extends$t({
     ref: ref
   }, props, {
     onMouseDown: onMouseDown
-  }), fileContext && fileContext.isCompact ? React__default["default"].createElement(SvgTrashStroke$1, null) : React__default["default"].createElement(SvgTrashStroke, null));
+  }), fileContext && fileContext.isCompact ? React__namespace.default.createElement(SvgTrashStroke$1, null) : React__namespace.default.createElement(SvgTrashStroke, null));
 });
 DeleteComponent.displayName = 'File.Delete';
 const Delete = DeleteComponent;
@@ -2849,26 +2848,26 @@ var SvgFileErrorStroke = function SvgFileErrorStroke(props) {
 };
 
 const fileIconsDefault = {
-  pdf: React__default["default"].createElement(SvgFilePdfStroke, null),
-  zip: React__default["default"].createElement(SvgFileZipStroke, null),
-  image: React__default["default"].createElement(SvgFileImageStroke, null),
-  document: React__default["default"].createElement(SvgFileDocumentStroke, null),
-  spreadsheet: React__default["default"].createElement(SvgFileSpreadsheetStroke, null),
-  presentation: React__default["default"].createElement(SvgFilePresentationStroke, null),
-  generic: React__default["default"].createElement(SvgFileGenericStroke, null),
-  success: React__default["default"].createElement(SvgCheckCircleStroke$1, null),
-  error: React__default["default"].createElement(SvgFileErrorStroke, null)
+  pdf: React__namespace.default.createElement(SvgFilePdfStroke, null),
+  zip: React__namespace.default.createElement(SvgFileZipStroke, null),
+  image: React__namespace.default.createElement(SvgFileImageStroke, null),
+  document: React__namespace.default.createElement(SvgFileDocumentStroke, null),
+  spreadsheet: React__namespace.default.createElement(SvgFileSpreadsheetStroke, null),
+  presentation: React__namespace.default.createElement(SvgFilePresentationStroke, null),
+  generic: React__namespace.default.createElement(SvgFileGenericStroke, null),
+  success: React__namespace.default.createElement(SvgCheckCircleStroke$1, null),
+  error: React__namespace.default.createElement(SvgFileErrorStroke, null)
 };
 const fileIconsCompact = {
-  pdf: React__default["default"].createElement(SvgFilePdfStroke$1, null),
-  zip: React__default["default"].createElement(SvgFileZipStroke$1, null),
-  image: React__default["default"].createElement(SvgFileImageStroke$1, null),
-  document: React__default["default"].createElement(SvgFileDocumentStroke$1, null),
-  spreadsheet: React__default["default"].createElement(SvgFileSpreadsheetStroke$1, null),
-  presentation: React__default["default"].createElement(SvgFilePresentationStroke$1, null),
-  generic: React__default["default"].createElement(SvgFileGenericStroke$1, null),
-  success: React__default["default"].createElement(SvgCheckCircleStroke, null),
-  error: React__default["default"].createElement(SvgFileErrorStroke$1, null)
+  pdf: React__namespace.default.createElement(SvgFilePdfStroke$1, null),
+  zip: React__namespace.default.createElement(SvgFileZipStroke$1, null),
+  image: React__namespace.default.createElement(SvgFileImageStroke$1, null),
+  document: React__namespace.default.createElement(SvgFileDocumentStroke$1, null),
+  spreadsheet: React__namespace.default.createElement(SvgFileSpreadsheetStroke$1, null),
+  presentation: React__namespace.default.createElement(SvgFilePresentationStroke$1, null),
+  generic: React__namespace.default.createElement(SvgFileGenericStroke$1, null),
+  success: React__namespace.default.createElement(SvgCheckCircleStroke, null),
+  error: React__namespace.default.createElement(SvgFileErrorStroke$1, null)
 };
 
 const FileComponent = React.forwardRef((_ref, ref) => {
@@ -2884,29 +2883,29 @@ const FileComponent = React.forwardRef((_ref, ref) => {
     isCompact
   }), [isCompact]);
   const validationType = validation || type;
-  return React__default["default"].createElement(FileContext.Provider, {
+  return React__namespace.default.createElement(FileContext.Provider, {
     value: fileContextValue
-  }, React__default["default"].createElement(StyledFile, _extends$t({}, props, {
+  }, React__namespace.default.createElement(StyledFile, _extends$t({}, props, {
     isCompact: isCompact,
     focusInset: focusInset,
     validation: validation,
     ref: ref
-  }), validationType && React__default["default"].createElement(StyledFileIcon, {
+  }), validationType && React__namespace.default.createElement(StyledFileIcon, {
     isCompact: isCompact
-  }, isCompact ? fileIconsCompact[validationType] : fileIconsDefault[validationType]), React.Children.map(children, child => typeof child === 'string' ? React__default["default"].createElement("span", null, child) : child)));
+  }, isCompact ? fileIconsCompact[validationType] : fileIconsDefault[validationType]), React.Children.map(children, child => typeof child === 'string' ? React__namespace.default.createElement("span", null, child) : child)));
 });
 FileComponent.displayName = 'File';
 FileComponent.propTypes = {
-  focusInset: PropTypes__default["default"].bool,
-  isCompact: PropTypes__default["default"].bool,
-  type: PropTypes__default["default"].oneOf(FILE_TYPE),
-  validation: PropTypes__default["default"].oneOf(FILE_VALIDATION)
+  focusInset: PropTypes__default.default.bool,
+  isCompact: PropTypes__default.default.bool,
+  type: PropTypes__default.default.oneOf(FILE_TYPE),
+  validation: PropTypes__default.default.oneOf(FILE_VALIDATION)
 };
 const File = FileComponent;
 File.Close = Close;
 File.Delete = Delete;
 
-const MediaInput = React__default["default"].forwardRef((_ref, ref) => {
+const MediaInput = React__namespace.default.forwardRef((_ref, ref) => {
   let {
     start,
     end,
@@ -2954,7 +2953,7 @@ const MediaInput = React__default["default"].forwardRef((_ref, ref) => {
   let combinedProps = {
     disabled,
     readOnly,
-    ref: mergeRefs__default["default"]([inputRef, ref]),
+    ref: mergeRefs__default.default([inputRef, ref]),
     onSelect: onSelectHandler,
     ...props
   };
@@ -2965,7 +2964,7 @@ const MediaInput = React__default["default"].forwardRef((_ref, ref) => {
     });
     isLabelHovered = fieldContext.isLabelHovered;
   }
-  return React__default["default"].createElement(FauxInput, _extends$t({
+  return React__namespace.default.createElement(FauxInput, _extends$t({
     tabIndex: null,
     onClick: onFauxInputClickHandler,
     onFocus: onFauxInputFocusHandler,
@@ -2983,25 +2982,25 @@ const MediaInput = React__default["default"].forwardRef((_ref, ref) => {
     mediaLayout: true
   }, otherWrapperProps, {
     ref: wrapperRef
-  }), start && React__default["default"].createElement(FauxInput.StartIcon, {
+  }), start && React__namespace.default.createElement(FauxInput.StartIcon, {
     isDisabled: disabled,
     isFocused: isFocused,
     isHovered: isHovered || isLabelHovered
-  }, start), React__default["default"].createElement(StyledTextMediaInput, combinedProps), end && React__default["default"].createElement(FauxInput.EndIcon, {
+  }, start), React__namespace.default.createElement(StyledTextMediaInput, combinedProps), end && React__namespace.default.createElement(FauxInput.EndIcon, {
     isDisabled: disabled,
     isFocused: isFocused,
     isHovered: isHovered || isLabelHovered
   }, end));
 });
 MediaInput.propTypes = {
-  isCompact: PropTypes__default["default"].bool,
-  isBare: PropTypes__default["default"].bool,
-  focusInset: PropTypes__default["default"].bool,
-  validation: PropTypes__default["default"].oneOf(VALIDATION),
-  start: PropTypes__default["default"].node,
-  end: PropTypes__default["default"].node,
-  wrapperProps: PropTypes__default["default"].object,
-  wrapperRef: PropTypes__default["default"].any
+  isCompact: PropTypes__default.default.bool,
+  isBare: PropTypes__default.default.bool,
+  focusInset: PropTypes__default.default.bool,
+  validation: PropTypes__default.default.oneOf(VALIDATION),
+  start: PropTypes__default.default.node,
+  end: PropTypes__default.default.node,
+  wrapperProps: PropTypes__default.default.object,
+  wrapperRef: PropTypes__default.default.any
 };
 MediaInput.displayName = 'MediaInput';