@ornikar/kitt-universal 31.4.1-canary.2fdbcaad37b7e76ba2442f7c56a4939349d51eb1.0 → 32.0.1

package/dist/index.es.web.js

@@ -856,15 +856,15 @@ var card = {
   }
 };
 
-var webAnimationContentDuration$1 = 400;
-var webAnimationContentEasing$1 = {
+var webAnimationContentDuration$2 = 400;
+var webAnimationContentEasing$2 = {
   x1: 0.77,
   y1: 0,
   x2: 0.175,
   y2: 1
 };
-var webAnimationOverlayDuration$1 = 250;
-var webAnimationOverlayEasing$1 = {
+var webAnimationOverlayDuration$2 = 250;
+var webAnimationOverlayEasing$2 = {
   x1: 0.42,
   y1: 0,
   x2: 1,
@@ -899,12 +899,12 @@ var cardModal = {
   },
   animation: {
     overlay: {
-      duration: webAnimationOverlayDuration$1,
-      easing: webAnimationOverlayEasing$1
+      duration: webAnimationOverlayDuration$2,
+      easing: webAnimationOverlayEasing$2
     },
     content: {
-      duration: webAnimationContentDuration$1,
-      easing: webAnimationContentEasing$1
+      duration: webAnimationContentDuration$2,
+      easing: webAnimationContentEasing$2
     }
   }
 };
@@ -960,15 +960,15 @@ var choices = {
   }
 };
 
-var webAnimationContentDuration = 400;
-var webAnimationContentEasing = {
+var webAnimationContentDuration$1 = 400;
+var webAnimationContentEasing$1 = {
   x1: 0.77,
   y1: 0,
   x2: 0.175,
   y2: 1
 };
-var webAnimationOverlayDuration = 250;
-var webAnimationOverlayEasing = {
+var webAnimationOverlayDuration$1 = 250;
+var webAnimationOverlayEasing$1 = {
   x1: 0.42,
   y1: 0,
   x2: 1,
@@ -990,12 +990,12 @@ var dialogModal = {
   },
   animation: {
     overlay: {
-      duration: webAnimationOverlayDuration,
-      easing: webAnimationOverlayEasing
+      duration: webAnimationOverlayDuration$1,
+      easing: webAnimationOverlayEasing$1
     },
     content: {
-      duration: webAnimationContentDuration,
-      easing: webAnimationContentEasing
+      duration: webAnimationContentDuration$1,
+      easing: webAnimationContentEasing$1
     }
   }
 };
@@ -1904,6 +1904,20 @@ var forms = {
   timePicker: timePicker
 };
 
+var webAnimationContentDuration = 600;
+var webAnimationContentEasing = {
+  x1: 0.77,
+  y1: 0,
+  x2: 0.175,
+  y2: 1
+};
+var webAnimationOverlayDuration = 250;
+var webAnimationOverlayEasing = {
+  x1: 0.42,
+  y1: 0,
+  x2: 1,
+  y2: 1
+};
 var fullscreenModal = {
   header: {
     height: 56
@@ -1917,22 +1931,12 @@ var fullscreenModal = {
   },
   animation: {
     overlay: {
-      duration: 250,
-      easing: {
-        x1: 0.42,
-        y1: 0,
-        x2: 1,
-        y2: 1
-      }
+      duration: webAnimationOverlayDuration,
+      easing: webAnimationOverlayEasing
     },
     content: {
-      duration: 600,
-      easing: {
-        x1: 0.77,
-        y1: 0,
-        x2: 0.175,
-        y2: 1
-      }
+      duration: webAnimationContentDuration,
+      easing: webAnimationContentEasing
     }
   }
 };
@@ -2859,7 +2863,7 @@ function ActionCardDisabled(_ref) {
   });
 }
 
-var _excluded$P = ["children", "variant", "borderVariant", "borderRadius", "disabled", "isHovered", "isPressed", "isFocused"];
+var _excluded$Q = ["children", "variant", "borderVariant", "borderRadius", "disabled", "isHovered", "isPressed", "isFocused"];
 function ActionCard(_ref) {
   var children = _ref.children,
     _ref$variant = _ref.variant,
@@ -2872,7 +2876,7 @@ function ActionCard(_ref) {
     isHovered = _ref.isHovered,
     isPressed = _ref.isPressed,
     isFocused = _ref.isFocused,
-    props = _objectWithoutProperties(_ref, _excluded$P);
+    props = _objectWithoutProperties(_ref, _excluded$Q);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
     children: disabled ? /*#__PURE__*/jsx(ActionCardDisabled, {
       borderRadius: borderRadius,
@@ -3204,7 +3208,7 @@ var getTypographyTypeWithAncestorValue = function (type, typographyTypeInContext
   return !!isAllValuesUndefined && !!typographyTypeInContext ? typographyTypeInContext : type;
 };
 
-var _excluded$O = ["accessibilityRole", "base", "small", "medium", "large", "wide", "type", "variant", "color"];
+var _excluded$P = ["accessibilityRole", "base", "small", "medium", "large", "wide", "type", "variant", "color"];
 var TypographyFamilyContext = /*#__PURE__*/createContext(null);
 var TypographyTypeContext = /*#__PURE__*/createContext(null);
 var TypographyVariantContext = /*#__PURE__*/createContext(undefined);
@@ -3329,7 +3333,7 @@ var TypographyBase = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     } : _ref2$type,
     variant = _ref2.variant,
     color = _ref2.color,
-    otherProps = _objectWithoutProperties(_ref2, _excluded$O);
+    otherProps = _objectWithoutProperties(_ref2, _excluded$P);
   var sx = useSx();
 
   // ancestors
@@ -3491,12 +3495,12 @@ function Icon(_ref) {
   });
 }
 
-var _excluded$N = ["color", "size"],
+var _excluded$O = ["color", "size"],
   _excluded2$6 = ["color"];
 function TypographyIconSpecifiedColor(_ref) {
   var color = _ref.color,
     size = _ref.size,
-    props = _objectWithoutProperties(_ref, _excluded$N);
+    props = _objectWithoutProperties(_ref, _excluded$O);
   var colorValue = getTypographyColorValue(color);
   var sx = useSx();
   var _sx = sx({
@@ -3536,7 +3540,7 @@ var getButtonTextColorByType = function (type, variant, isHovered, isPressed, is
   return "".concat(baseKey, ".default");
 };
 
-var _excluded$M = ["type", "variant", "isDisabled", "icon", "children", "isHovered", "isPressed", "isFocused", "innerSpacing", "size"];
+var _excluded$N = ["type", "variant", "isDisabled", "icon", "children", "isHovered", "isPressed", "isFocused", "innerSpacing", "size"];
 function ButtonContentChildren(_ref) {
   var type = _ref.type,
     icon = _ref.icon,
@@ -3636,7 +3640,7 @@ function ButtonContent(_ref2) {
     _ref2.isFocused;
     var innerSpacing = _ref2.innerSpacing,
     size = _ref2.size,
-    props = _objectWithoutProperties(_ref2, _excluded$M);
+    props = _objectWithoutProperties(_ref2, _excluded$N);
   var color = getButtonTextColorByType(type, variant, isHovered, isPressed, isDisabled);
   return /*#__PURE__*/jsx(View, {
     _web: {
@@ -3937,7 +3941,7 @@ function LoaderIcon(_ref) {
   });
 }
 
-var _excluded$L = ["as", "onPress", "disabled", "icon", "stretch"];
+var _excluded$M = ["as", "onPress", "disabled", "icon", "stretch"];
 var ActionsItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var as = _ref.as,
     onPress = _ref.onPress,
@@ -3948,7 +3952,7 @@ var ActionsItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
       base: true,
       medium: false
     } : _ref$stretch,
-    props = _objectWithoutProperties(_ref, _excluded$L);
+    props = _objectWithoutProperties(_ref, _excluded$M);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isLoading = _useState2[0],
@@ -4026,7 +4030,7 @@ function ActionsButton(_ref) {
   }, props));
 }
 
-var _excluded$K = ["children", "layout", "reversed"];
+var _excluded$L = ["children", "layout", "reversed"];
 function getCurrentLayout(layout) {
   if (!layout) return {
     base: 'stretch',
@@ -4058,7 +4062,7 @@ function Actions(_ref) {
     reversed = _ref$reversed === void 0 ? {
       base: false
     } : _ref$reversed,
-    props = _objectWithoutProperties(_ref, _excluded$K);
+    props = _objectWithoutProperties(_ref, _excluded$L);
   var shouldReverse = typeof reversed === 'boolean' ? {
     base: !!reversed
   } : createResponsiveStyleFromProp(reversed, true, false);
@@ -4111,7 +4115,7 @@ function getInitials(firstname, lastname) {
   return "".concat(firstname[0]).concat(lastname[0]).toUpperCase();
 }
 
-var _excluded$J = ["size", "round", "light", "sizeVariant", "width", "height", "dark", "disabled"];
+var _excluded$K = ["size", "round", "light", "sizeVariant", "width", "height", "dark", "disabled"];
 function AvatarContent(_ref) {
   var size = _ref.size,
     src = _ref.src,
@@ -4174,7 +4178,7 @@ function Avatar(_ref2) {
     height = _ref2.height,
     dark = _ref2.dark,
     disabled = _ref2.disabled,
-    props = _objectWithoutProperties(_ref2, _excluded$J);
+    props = _objectWithoutProperties(_ref2, _excluded$K);
   var currentSize = getCurrentSize({
     size: size,
     sizeVariant: sizeVariant
@@ -4359,7 +4363,7 @@ var CardModalRotationContainer = /*#__PURE__*/forwardRef(function (props, ref) {
   }));
 });
 
-var _excluded$I = ["children", "appear", "visible", "unmountOnExit", "isAnimationEnabled", "onEnter", "onEntered", "onExit", "onExited", "onClose"];
+var _excluded$J = ["children", "appear", "visible", "unmountOnExit", "isAnimationEnabled", "onEnter", "onEntered", "onExit", "onExited", "onClose"];
 var contentAnimationEnter = "kitt-u_contentAnimationEnter_c11xxy4r";
 var contentAnimatioEnterActive = "kitt-u_contentAnimatioEnterActive_cl52117";
 var contentAnimatioExit = "kitt-u_contentAnimatioExit_cyjczep";
@@ -4372,17 +4376,17 @@ var contentAnimationClassNames = {
   exit: contentAnimatioExit,
   exitActive: contentAnimatioExitActive
 };
-var opacityEnter = "kitt-u_opacityEnter_o1ae40dx";
-var opacityEnterActive = "kitt-u_opacityEnterActive_o1t4vl7b";
-var opacityExit = "kitt-u_opacityExit_ogyytm1";
-var opacityExitActive = "kitt-u_opacityExitActive_o18xvk52";
-var opacityClassNames = {
-  appear: opacityEnter,
-  appearActive: opacityEnterActive,
-  enter: opacityEnter,
-  enterActive: opacityEnterActive,
-  exit: opacityExit,
-  exitActive: opacityExitActive
+var opacityEnter$1 = "kitt-u_opacityEnter_o1ae40dx";
+var opacityEnterActive$1 = "kitt-u_opacityEnterActive_o1t4vl7b";
+var opacityExit$1 = "kitt-u_opacityExit_ogyytm1";
+var opacityExitActive$1 = "kitt-u_opacityExitActive_o18xvk52";
+var opacityClassNames$1 = {
+  appear: opacityEnter$1,
+  appearActive: opacityEnterActive$1,
+  enter: opacityEnter$1,
+  enterActive: opacityEnterActive$1,
+  exit: opacityExit$1,
+  exitActive: opacityExitActive$1
 };
 function CardModalAnimation(_ref) {
   var children = _ref.children,
@@ -4398,7 +4402,7 @@ function CardModalAnimation(_ref) {
     onExit = _ref.onExit,
     onExited = _ref.onExited,
     onClose = _ref.onClose,
-    props = _objectWithoutProperties(_ref, _excluded$I);
+    props = _objectWithoutProperties(_ref, _excluded$J);
   // React 19 has removed the ReactDOM.findDOMNode method. We need to use refs to access DOM nodes in CSSTransition.
   // See https://github.com/reactjs/react-transition-group/issues/918
   var overlayRef = useRef(null);
@@ -4416,7 +4420,7 @@ function CardModalAnimation(_ref) {
     children: [/*#__PURE__*/jsx(CSSTransition, _objectSpread(_objectSpread({}, sharedProps), {}, {
       nodeRef: overlayRef,
       timeout: isAnimationEnabled ? animation.overlay.duration : 0,
-      classNames: opacityClassNames,
+      classNames: opacityClassNames$1,
       children: /*#__PURE__*/jsx(Overlay, {
         ref: overlayRef,
         onPress: onClose
@@ -4439,13 +4443,13 @@ function CardModalAnimation(_ref) {
   }));
 }
 
-var _excluded$H = ["children", "visible", "onClose", "onExited"];
+var _excluded$I = ["children", "visible", "onClose", "onExited"];
 function CardModalBehaviour(_ref) {
   var children = _ref.children,
     visible = _ref.visible,
     onClose = _ref.onClose,
     onExited = _ref.onExited,
-    props = _objectWithoutProperties(_ref, _excluded$H);
+    props = _objectWithoutProperties(_ref, _excluded$I);
   var _useState = useState(visible),
     _useState2 = _slicedToArray(_useState, 2),
     isModalBehaviourVisible = _useState2[0],
@@ -4470,12 +4474,12 @@ function CardModalBehaviour(_ref) {
   });
 }
 
-var _excluded$G = ["children", "padding"];
+var _excluded$H = ["children", "padding"];
 function CardModalBody(_ref) {
   var children = _ref.children,
     _ref$padding = _ref.padding,
     padding = _ref$padding === void 0 ? 'kitt.4' : _ref$padding,
-    props = _objectWithoutProperties(_ref, _excluded$G);
+    props = _objectWithoutProperties(_ref, _excluded$H);
   return /*#__PURE__*/jsx(ScrollView, _objectSpread(_objectSpread({
     showsVerticalScrollIndicator: false,
     _contentContainerStyle: {
@@ -4486,7 +4490,7 @@ function CardModalBody(_ref) {
   }));
 }
 
-var _excluded$F = ["children", "padding", "hasSeparator"];
+var _excluded$G = ["children", "padding", "hasSeparator"];
 function CardModalFooter(_ref) {
   var children = _ref.children,
     _ref$padding = _ref.padding,
@@ -4496,7 +4500,7 @@ function CardModalFooter(_ref) {
     } : _ref$padding,
     _ref$hasSeparator = _ref.hasSeparator,
     hasSeparator = _ref$hasSeparator === void 0 ? true : _ref$hasSeparator,
-    props = _objectWithoutProperties(_ref, _excluded$F);
+    props = _objectWithoutProperties(_ref, _excluded$G);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
     marginTop: "kitt.2",
     padding: padding,
@@ -4540,7 +4544,7 @@ var getButtonTypeAndVariant = function (iconColor) {
   }
 };
 
-var _excluded$E = ["color", "ariaLabel"];
+var _excluded$F = ["color", "ariaLabel"];
 /**
  * @deprecated IconButton should only be used as a navigation button
  * Other use cases should use a <Button> component with an icon
@@ -4549,7 +4553,7 @@ function IconButton(_ref) {
   var _ref$color = _ref.color,
     color = _ref$color === void 0 ? 'black' : _ref$color;
     _ref.ariaLabel;
-    var props = _objectWithoutProperties(_ref, _excluded$E);
+    var props = _objectWithoutProperties(_ref, _excluded$F);
   var _getButtonTypeAndVari = getButtonTypeAndVariant(color),
     legacyColorToType = _getButtonTypeAndVari.type,
     legacyColorToVariant = _getButtonTypeAndVari.variant;
@@ -4656,7 +4660,7 @@ function CardModalHeader(props) {
   return /*#__PURE__*/jsx(TopNavBar, _objectSpread({}, props));
 }
 
-var _excluded$D = ["backgroundColor", "maxWidth", "withoutShadow", "children"];
+var _excluded$E = ["backgroundColor", "maxWidth", "withoutShadow", "children"];
 function CardModal(_ref) {
   var _ref$backgroundColor = _ref.backgroundColor,
     backgroundColor = _ref$backgroundColor === void 0 ? 'kitt.uiBackgroundLight' : _ref$backgroundColor,
@@ -4664,7 +4668,7 @@ function CardModal(_ref) {
     maxWidth = _ref$maxWidth === void 0 ? 'kitt.cardModal.maxWidth' : _ref$maxWidth,
     withoutShadow = _ref.withoutShadow,
     children = _ref.children,
-    props = _objectWithoutProperties(_ref, _excluded$D);
+    props = _objectWithoutProperties(_ref, _excluded$E);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
     overflow: "hidden",
     backgroundColor: backgroundColor,
@@ -4880,11 +4884,11 @@ function ChoiceItemContainer(_ref) {
   }));
 }
 
-var _excluded$C = ["direction", "contentContainerStyle"];
+var _excluded$D = ["direction", "contentContainerStyle"];
 function ChoicesContainer(_ref) {
   var direction = _ref.direction,
     contentContainerStyle = _ref.contentContainerStyle,
-    props = _objectWithoutProperties(_ref, _excluded$C);
+    props = _objectWithoutProperties(_ref, _excluded$D);
   if (direction === 'row') {
     return /*#__PURE__*/jsx(ScrollView$2, _objectSpread({
       horizontal: true,
@@ -5061,7 +5065,8 @@ function DialogModalAnimation(_ref) {
     onEntered = _ref.onEntered,
     onExit = _ref.onExit,
     onExited = _ref.onExited,
-    onClose = _ref.onClose;
+    onClose = _ref.onClose,
+    testID = _ref.testID;
   var _useState = useState(visible),
     _useState2 = _slicedToArray(_useState, 2),
     isModalVisible = _useState2[0],
@@ -5100,6 +5105,7 @@ function DialogModalAnimation(_ref) {
       flexGrow: 1,
       justifyContent: "center",
       alignItems: "center",
+      testID: testID,
       children: [/*#__PURE__*/jsx(NativeOpacityAnimation, {
         visible: isContentVisible,
         onExited: handleAnimationExited,
@@ -5120,13 +5126,13 @@ function DialogModalAnimation(_ref) {
   });
 }
 
-var _excluded$B = ["children", "visible", "onClose", "onExited"];
+var _excluded$C = ["children", "visible", "onClose", "onExited"];
 function DialogModalBehaviour(_ref) {
   var children = _ref.children,
     visible = _ref.visible,
     onClose = _ref.onClose,
     onExited = _ref.onExited,
-    props = _objectWithoutProperties(_ref, _excluded$B);
+    props = _objectWithoutProperties(_ref, _excluded$C);
   var _useState = useState(visible),
     _useState2 = _slicedToArray(_useState, 2),
     isModalBehaviourVisible = _useState2[0],
@@ -5157,7 +5163,7 @@ function DialogModalBehaviour(_ref) {
   });
 }
 
-var _excluded$A = ["stretch"];
+var _excluded$B = ["stretch"];
 function DialogModal(_ref) {
   var illustration = _ref.illustration,
     title = _ref.title,
@@ -5197,7 +5203,7 @@ DialogModal.ModalBehaviour = DialogModalBehaviour;
 function DialogModalButton(_ref2) {
   var _ref2$stretch = _ref2.stretch,
     stretch = _ref2$stretch === void 0 ? true : _ref2$stretch,
-    props = _objectWithoutProperties(_ref2, _excluded$A);
+    props = _objectWithoutProperties(_ref2, _excluded$B);
   return /*#__PURE__*/jsx(Actions.Button, _objectSpread({
     stretch: stretch
   }, props));
@@ -5234,7 +5240,7 @@ function Emoji(_ref) {
   });
 }
 
-var _excluded$z = ["as", "appScheme", "appValue", "onPress", "onOpenAppError"],
+var _excluded$A = ["as", "appScheme", "appValue", "onPress", "onOpenAppError"],
   _excluded2$5 = ["phoneNumber", "children"],
   _excluded3$4 = ["phoneNumber", "children"],
   _excluded4$3 = ["emailAddress", "children"];
@@ -5244,7 +5250,7 @@ function ExternalAppLink(_ref) {
     appValue = _ref.appValue,
     onPress = _ref.onPress,
     onOpenAppError = _ref.onOpenAppError,
-    rest = _objectWithoutProperties(_ref, _excluded$z);
+    rest = _objectWithoutProperties(_ref, _excluded$A);
   var href = "".concat(appScheme, ":").concat(appValue);
   var handleOnPress = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(e) {
@@ -5339,14 +5345,14 @@ var defaultOpenLinkBehavior = {
   web: 'targetBlank'
 };
 
-var _excluded$y = ["as", "href", "openLinkBehavior", "onPress"];
+var _excluded$z = ["as", "href", "openLinkBehavior", "onPress"];
 function ExternalLink(_ref) {
   var Component = _ref.as,
     href = _ref.href,
     _ref$openLinkBehavior = _ref.openLinkBehavior,
     openLinkBehavior = _ref$openLinkBehavior === void 0 ? defaultOpenLinkBehavior : _ref$openLinkBehavior,
     onPress = _ref.onPress,
-    rest = _objectWithoutProperties(_ref, _excluded$y);
+    rest = _objectWithoutProperties(_ref, _excluded$z);
   return /*#__PURE__*/jsx(Component, _objectSpread(_objectSpread({}, rest), {}, {
     accessibilityRole: "link",
     href: href,
@@ -5422,7 +5428,7 @@ function InputTextContainer(props) {
   }, props));
 }
 
-var _excluded$x = ["id", "right", "state", "variant", "internalForceState", "disabled", "autoCorrect", "textContentType", "autoComplete", "inputMode", "multiline", "height", "onSubmitEditing"];
+var _excluded$y = ["id", "right", "state", "variant", "internalForceState", "disabled", "autoCorrect", "textContentType", "autoComplete", "inputMode", "multiline", "height", "onSubmitEditing"];
 var InputText = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var id = _ref.id,
     right = _ref.right;
@@ -5443,7 +5449,7 @@ var InputText = /*#__PURE__*/forwardRef(function (_ref, ref) {
     multiline = _ref.multiline,
     height = _ref.height,
     onSubmitEditing = _ref.onSubmitEditing,
-    props = _objectWithoutProperties(_ref, _excluded$x);
+    props = _objectWithoutProperties(_ref, _excluded$y);
   var theme = useTheme();
   var fontSizeForNativeBase = createNativeBaseFontSize({
     base: 'body-m'
@@ -5567,12 +5573,12 @@ function AutocompleteItemsListContainer(_ref) {
   });
 }
 
-var _excluded$w = ["children", "testID"];
+var _excluded$x = ["children", "testID"];
 function AutocompleteOption(_ref) {
   var children = _ref.children,
     _ref$testID = _ref.testID,
     testID = _ref$testID === void 0 ? 'kitt.Autocomplete.option' : _ref$testID,
-    props = _objectWithoutProperties(_ref, _excluded$w);
+    props = _objectWithoutProperties(_ref, _excluded$x);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({
     paddingX: {
       base: 'kitt.2',
@@ -5585,7 +5591,7 @@ function AutocompleteOption(_ref) {
   }));
 }
 
-var _excluded$v = ["children", "name", "disabled", "placeholder", "isInitialOpen", "initialValue", "containerProps", "filterItemBasedOnCurrentInputValue", "checkSelectedItem", "itemToString", "right", "onChange", "onFocus", "onBlur", "onInputChange", "onSelectItem", "onOuterPress", "errorElement", "emptyResultsElement", "inputTestID", "listContainerTestID", "zIndex", "maxItemContainerHeight"],
+var _excluded$w = ["children", "name", "disabled", "placeholder", "isInitialOpen", "initialValue", "containerProps", "filterItemBasedOnCurrentInputValue", "checkSelectedItem", "itemToString", "right", "onChange", "onFocus", "onBlur", "onInputChange", "onSelectItem", "onOuterPress", "errorElement", "emptyResultsElement", "inputTestID", "listContainerTestID", "zIndex", "maxItemContainerHeight"],
   _excluded2$4 = ["onClick", "onPress"],
   _excluded3$3 = ["onKeyDown", "onFocus", "onBlur", "onChange"],
   _excluded4$2 = ["onClick", "onPress", "role", "aria-selected"];
@@ -5619,7 +5625,7 @@ function Autocomplete(_ref) {
     _ref$zIndex = _ref.zIndex,
     zIndex = _ref$zIndex === void 0 ? 1000 : _ref$zIndex,
     maxItemContainerHeight = _ref.maxItemContainerHeight,
-    props = _objectWithoutProperties(_ref, _excluded$v);
+    props = _objectWithoutProperties(_ref, _excluded$w);
   var childrenArray = Children.toArray(children);
   var items = childrenArray.filter(isReactElement).map(function (child) {
     return {
@@ -5826,7 +5832,7 @@ function getBorderColor$1(_ref) {
   return 'kitt.forms.checkbox.default.borderColor';
 }
 
-var _excluded$u = ["checked", "hitSlop", "children", "disabled", "onChange", "onBlur", "onFocus"];
+var _excluded$v = ["checked", "hitSlop", "children", "disabled", "onChange", "onBlur", "onFocus"];
 var Checkbox = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var checked = _ref.checked,
     _ref$hitSlop = _ref.hitSlop,
@@ -5836,7 +5842,7 @@ var Checkbox = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onChange = _ref.onChange,
     onBlur = _ref.onBlur,
     onFocus = _ref.onFocus,
-    props = _objectWithoutProperties(_ref, _excluded$u);
+    props = _objectWithoutProperties(_ref, _excluded$v);
   var theme = useTheme();
   return /*#__PURE__*/jsx(Pressable, _objectSpread(_objectSpread({
     hitSlop: hitSlop
@@ -6152,7 +6158,7 @@ function PartContainer(_ref) {
   });
 }
 
-var _excluded$t = ["id", "value", "testID", "stretch", "placeholder", "minDate", "maxDate", "disabled", "isFocusedInternal", "isHoveredInternal", "isPressedInternal", "enterKeyHint", "onChange", "onBlur", "onFocus", "onSubmitEditing"];
+var _excluded$u = ["id", "value", "testID", "stretch", "placeholder", "minDate", "maxDate", "disabled", "isFocusedInternal", "isHoveredInternal", "isPressedInternal", "enterKeyHint", "onChange", "onBlur", "onFocus", "onSubmitEditing"];
 var KeyboardDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var id = _ref.id,
     value = _ref.value,
@@ -6170,7 +6176,7 @@ var KeyboardDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onBlur = _ref.onBlur,
     onFocus = _ref.onFocus,
     onSubmitEditing = _ref.onSubmitEditing;
-    _objectWithoutProperties(_ref, _excluded$t);
+    _objectWithoutProperties(_ref, _excluded$u);
   var monthRef = useRef(null);
   var yearRef = useRef(null);
   var defaultValue = value;
@@ -6310,10 +6316,10 @@ var KeyboardDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
   });
 });
 
-var _excluded$s = ["value"];
+var _excluded$t = ["value"];
 var DatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var value = _ref.value,
-    props = _objectWithoutProperties(_ref, _excluded$s);
+    props = _objectWithoutProperties(_ref, _excluded$t);
   // in apps, final-form can give a string value that will break the component
   var currentValue = value || undefined;
   return /*#__PURE__*/jsx(KeyboardDatePicker, _objectSpread(_objectSpread({
@@ -6424,6 +6430,84 @@ function ImagePicker(_ref) {
   });
 }
 
+function InputAddressOption(_ref) {
+  var item = _ref.item,
+    mainText = _ref.mainText,
+    secondaryText = _ref.secondaryText;
+  var sharedTransform = {
+    style: {
+      transform: 'translateY(4px)'
+    }
+  };
+  return /*#__PURE__*/jsx(Autocomplete.Option, {
+    item: item,
+    testID: "kitt.InputAddressOption.item",
+    children: /*#__PURE__*/jsxs(HStack, {
+      space: "kitt.2",
+      children: [/*#__PURE__*/jsx(View, {
+        _web: sharedTransform,
+        _ios: sharedTransform,
+        _android: sharedTransform,
+        children: /*#__PURE__*/jsx(TypographyIcon, {
+          icon: /*#__PURE__*/jsx(MapPinRegularIcon, {}),
+          color: "black"
+        })
+      }), /*#__PURE__*/jsx(View, {
+        flexShrink: 1,
+        children: /*#__PURE__*/jsxs(Typography.Text, {
+          children: [/*#__PURE__*/jsx(Typography.Text, {
+            variant: "bold",
+            children: mainText
+          }), secondaryText ? /*#__PURE__*/jsxs(Typography.Text, {
+            color: "black-light",
+            variant: "bold",
+            children: [' ', secondaryText]
+          }) : null]
+        })
+      })]
+    })
+  });
+}
+
+var _excluded$s = ["errorElement", "initialValue", "emptyResultsElement", "onChange", "items", "isLoading", "hasError", "onInputChange", "onSelectItem", "convertInitialValue", "renderItem"];
+function InputAddress(_ref) {
+  var errorElement = _ref.errorElement,
+    initialValue = _ref.initialValue,
+    emptyResultsElement = _ref.emptyResultsElement,
+    _onChange = _ref.onChange,
+    items = _ref.items,
+    isLoading = _ref.isLoading,
+    hasError = _ref.hasError,
+    _onInputChange = _ref.onInputChange,
+    onSelectItem = _ref.onSelectItem,
+    convertInitialValue = _ref.convertInitialValue,
+    renderItem = _ref.renderItem,
+    props = _objectWithoutProperties(_ref, _excluded$s);
+  var formattedInitialValue = initialValue ? convertInitialValue(initialValue) : undefined;
+  return /*#__PURE__*/jsx(Autocomplete, _objectSpread(_objectSpread({}, props), {}, {
+    initialValue: formattedInitialValue,
+    right: isLoading ? /*#__PURE__*/jsx(Icon, {
+      icon: /*#__PURE__*/jsx(LoaderIcon, {}),
+      color: "kitt.black"
+    }) : undefined,
+    errorElement: hasError ? errorElement : null,
+    emptyResultsElement: items.length === 0 ? emptyResultsElement : null,
+    onInputChange: function (value) {
+      return _onInputChange(value);
+    },
+    onChange: function (item) {
+      return onSelectItem(item, _onChange);
+    },
+    children: items.map(function (item) {
+      var itemElement = renderItem(item);
+      return /*#__PURE__*/cloneElement(itemElement, {
+        item: item
+      });
+    })
+  }));
+}
+InputAddress.Option = InputAddressOption;
+
 var GoogleMapsApiKeyContext = /*#__PURE__*/createContext(undefined);
 function GoogleMapsApiKeyProvider(_ref) {
   var children = _ref.children,
@@ -6829,7 +6913,7 @@ function useGoogleMapsAutocomplete() {
   return context;
 }
 
-function InputAddressOption(_ref) {
+function InputAddressOptionLegacy(_ref) {
   var item = _ref.item;
   var sharedTransform = {
     style: {
@@ -6838,7 +6922,7 @@ function InputAddressOption(_ref) {
   };
   return /*#__PURE__*/jsx(Autocomplete.Option, {
     item: item,
-    testID: "kitt.InputAddressOption.item",
+    testID: "kitt.InputAddressOptionLegacy.item",
     children: /*#__PURE__*/jsxs(HStack, {
       space: "kitt.2",
       children: [/*#__PURE__*/jsx(View, {
@@ -6898,7 +6982,7 @@ function formatInitialValueToAutocompletePrediction(address, placeId) {
 }
 
 var _excluded$r = ["initialValue", "itemToString", "errorElement", "emptyResultsElement", "onChange"];
-function InputAddress(_ref) {
+function InputAddressLegacy(_ref) {
   var initialValue = _ref.initialValue,
     _ref$itemToString = _ref.itemToString,
     itemToString = _ref$itemToString === void 0 ? defaultItemToString : _ref$itemToString,
@@ -6932,13 +7016,13 @@ function InputAddress(_ref) {
       onSelectItem(v, _onChange);
     },
     children: state.items.map(function (item) {
-      return /*#__PURE__*/jsx(InputAddressOption, {
+      return /*#__PURE__*/jsx(InputAddressOptionLegacy, {
         item: item
       }, item.place_id);
     })
   }));
 }
-InputAddress.Option = InputAddressOption;
+InputAddressLegacy.Option = InputAddressOptionLegacy;
 
 var InputEmail = /*#__PURE__*/forwardRef(function (props, ref) {
   return /*#__PURE__*/jsx(InputText, _objectSpread({
@@ -7824,24 +7908,30 @@ function FullscreenModalFooter(_ref) {
   }));
 }
 
-var styles$1 = {"overlay-enter":"FullscreenModalAnimation-module_overlay-enter__L1J1X","overlay-enter-active":"FullscreenModalAnimation-module_overlay-enter-active__gDEVb","overlay-exit":"FullscreenModalAnimation-module_overlay-exit__Qx1WE","overlay-exit-active":"FullscreenModalAnimation-module_overlay-exit-active__lFR3x","content-enter":"FullscreenModalAnimation-module_content-enter__JmCWa","content-enter-active":"FullscreenModalAnimation-module_content-enter-active__iaNRs","content-exit":"FullscreenModalAnimation-module_content-exit__hB0wY","content-exit-active":"FullscreenModalAnimation-module_content-exit-active__BPVPo"};
-
 var _excluded$i = ["children", "appear", "visible", "unmountOnExit", "isAnimationEnabled", "onEnter", "onEntered", "onExit", "onExited", "onClose"];
-var overlayClassNames = {
-  appear: styles$1['overlay-enter'],
-  appearActive: styles$1['overlay-enter-active'],
-  enter: styles$1['overlay-enter'],
-  enterActive: styles$1['overlay-enter-active'],
-  exit: styles$1['overlay-exit'],
-  exitActive: styles$1['overlay-exit-active']
-};
+var slideInFromBottomEnter = "kitt-u_slideInFromBottomEnter_s1717rto";
+var slideInFromBottomEnterActive = "kitt-u_slideInFromBottomEnterActive_sux6xgc";
+var slideInFromBottomExit = "kitt-u_slideInFromBottomExit_sl0lsxt";
+var slideInFromBottomExitActive = "kitt-u_slideInFromBottomExitActive_srlzzmu";
 var slideInClassNames = {
-  appear: styles$1['content-enter'],
-  appearActive: styles$1['content-enter-active'],
-  enter: styles$1['content-enter'],
-  enterActive: styles$1['content-enter-active'],
-  exit: styles$1['content-exit'],
-  exitActive: styles$1['content-exit-active']
+  appear: slideInFromBottomEnter,
+  appearActive: slideInFromBottomEnterActive,
+  enter: slideInFromBottomEnter,
+  enterActive: slideInFromBottomEnterActive,
+  exit: slideInFromBottomExit,
+  exitActive: slideInFromBottomExitActive
+};
+var opacityEnter = "kitt-u_opacityEnter_okm44hr";
+var opacityEnterActive = "kitt-u_opacityEnterActive_o2w8t0i";
+var opacityExit = "kitt-u_opacityExit_o14r8iix";
+var opacityExitActive = "kitt-u_opacityExitActive_oim72y2";
+var opacityClassNames = {
+  appear: opacityEnter,
+  appearActive: opacityEnterActive,
+  enter: opacityEnter,
+  enterActive: opacityEnterActive,
+  exit: opacityExit,
+  exitActive: opacityExitActive
 };
 function FullscreenModalAnimation(_ref) {
   var children = _ref.children,
@@ -7869,41 +7959,28 @@ function FullscreenModalAnimation(_ref) {
     appear: appear,
     unmountOnExit: unmountOnExit
   };
-
-  // CSS custom properties for theme-based animation values
-  var overlayEasing = animation.overlay.easing;
-  var contentEasing = animation.content.easing;
-  var cssVariables = {
-    '--overlay-duration': "".concat(animation.overlay.duration, "ms"),
-    '--overlay-easing': "cubic-bezier(".concat(overlayEasing.x1, ", ").concat(overlayEasing.y1, ", ").concat(overlayEasing.x2, ", ").concat(overlayEasing.y2, ")"),
-    '--content-duration': "".concat(animation.content.duration, "ms"),
-    '--content-easing': "cubic-bezier(".concat(contentEasing.x1, ", ").concat(contentEasing.y1, ", ").concat(contentEasing.x2, ", ").concat(contentEasing.y2, ")")
-  };
-  return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
-    children: /*#__PURE__*/jsxs("div", {
-      style: cssVariables,
-      children: [/*#__PURE__*/jsx(CSSTransition, _objectSpread(_objectSpread({}, sharedProps), {}, {
-        nodeRef: overlayRef,
-        timeout: isAnimationEnabled ? animation.overlay.duration : 0,
-        classNames: overlayClassNames,
-        children: /*#__PURE__*/jsx(Overlay, {
-          ref: overlayRef,
-          onPress: onClose
-        })
-      })), /*#__PURE__*/jsx(CSSTransition, _objectSpread(_objectSpread({}, sharedProps), {}, {
-        nodeRef: contentRef,
-        timeout: isAnimationEnabled ? animation.content.duration : 0,
-        classNames: slideInClassNames,
-        onEnter: onEnter,
-        onEntered: onEntered,
-        onExit: onExit,
-        onExited: onExited,
-        children: /*#__PURE__*/jsx(View, {
-          ref: contentRef,
-          children: children
-        })
-      }))]
-    })
+  return /*#__PURE__*/jsxs(View, _objectSpread(_objectSpread({}, props), {}, {
+    children: [/*#__PURE__*/jsx(CSSTransition, _objectSpread(_objectSpread({}, sharedProps), {}, {
+      nodeRef: overlayRef,
+      timeout: isAnimationEnabled ? animation.overlay.duration : 0,
+      classNames: opacityClassNames,
+      children: /*#__PURE__*/jsx(Overlay, {
+        ref: overlayRef,
+        onPress: onClose
+      })
+    })), /*#__PURE__*/jsx(CSSTransition, _objectSpread(_objectSpread({}, sharedProps), {}, {
+      nodeRef: contentRef,
+      timeout: isAnimationEnabled ? animation.content.duration : 0,
+      classNames: slideInClassNames,
+      onEnter: onEnter,
+      onEntered: onEntered,
+      onExit: onExit,
+      onExited: onExited,
+      children: /*#__PURE__*/jsx(View, {
+        ref: contentRef,
+        children: children
+      })
+    }))]
   }));
 }
 
@@ -13915,5 +13992,5 @@ function VerticalSteps(_ref) {
 VerticalSteps.Step = Step;
 VerticalSteps.BorderlessStep = BorderlessStep;
 
-export { ActionCard, Actions, Autocomplete, Avatar, BottomSheet, Button, ButtonBadge, CardModal, Center, Checkbox, ChoicesElements, ChromaticReducedMotionDecorator, CloseIconButton, DatePicker, DialogModal, DocumentPicker, Emoji, ExternalAppLink, ExternalLink, FilePicker, FlatList, Flex, FullscreenModal, GoogleMapsApiKeyProvider, GoogleMapsAutocompleteProvider, GroupTags, HStack, Highlight, Icon, IconButton, Image, ImagePicker, InfoCard, InputAddress, InputEmail, InputFeedback, InputField, InputIban, InputIcon, InputNumber, InputPassword, InputPhone, InputPressable, InputTag, InputText, KittBreakpointNameEnum, KittBreakpoints, KittBreakpointsMax, KittMapConfigProvider, KittNativeBaseProvider, KittThemeDecorator, KittThemeProvider, Label, ListItem, LoaderIcon, MapMarker, MapMarkerVariantEnum, MatchWindowSize, Message, ModalBehaviour, NativeOnlyFlatList, NavigationBottomSheet, NavigationModal, Notification, Overlay, PageLoader, Picker, Pressable, RadioWithRef as Radio, RadioButtonGroup, ScrollView, DeprecatedSection as Section, SectionList, SegmentedProgressBar, Skeleton, SpinningIcon, Stack, StaticMap, Sticker, Story, StoryBlock, StoryContainer, StoryDecorator, StoryGrid, StorySection, StoryTitle, StyleWebWrapper, SwitchBreakpoints, TabBar, Tag, TextArea, TimePicker, ToastComponent, Toggle, Tooltip, TopNavBar, Typography, TypographyEmoji, TypographyIcon, TypographyLink, VStack, VerticalSteps, View, createChoicesComponent, createResponsiveStyleFromProp, getStaticMapImageUrl, getValueForBreakpoint, hex2rgba, matchWindowSize, storyPadding, theme, useBottomSheet, useBreakpointValue, useCurrentBreakpointName, useGetStaticMapImageUrl, useKittMapConfig, useKittTheme, useMatchWindowSize, useOpenExternalLink, useStaticBottomSheet, useStoryBlockColor, useTheme };
+export { ActionCard, Actions, Autocomplete, Avatar, BottomSheet, Button, ButtonBadge, CardModal, Center, Checkbox, ChoicesElements, ChromaticReducedMotionDecorator, CloseIconButton, DatePicker, DialogModal, DocumentPicker, Emoji, ExternalAppLink, ExternalLink, FilePicker, FlatList, Flex, FullscreenModal, GoogleMapsApiKeyProvider, GoogleMapsAutocompleteProvider, GroupTags, HStack, Highlight, Icon, IconButton, Image, ImagePicker, InfoCard, InputAddress, InputAddressLegacy, InputEmail, InputFeedback, InputField, InputIban, InputIcon, InputNumber, InputPassword, InputPhone, InputPressable, InputTag, InputText, KittBreakpointNameEnum, KittBreakpoints, KittBreakpointsMax, KittMapConfigProvider, KittNativeBaseProvider, KittThemeDecorator, KittThemeProvider, Label, ListItem, LoaderIcon, MapMarker, MapMarkerVariantEnum, MatchWindowSize, Message, ModalBehaviour, NativeOnlyFlatList, NavigationBottomSheet, NavigationModal, Notification, Overlay, PageLoader, Picker, Pressable, RadioWithRef as Radio, RadioButtonGroup, ScrollView, DeprecatedSection as Section, SectionList, SegmentedProgressBar, Skeleton, SpinningIcon, Stack, StaticMap, Sticker, Story, StoryBlock, StoryContainer, StoryDecorator, StoryGrid, StorySection, StoryTitle, StyleWebWrapper, SwitchBreakpoints, TabBar, Tag, TextArea, TimePicker, ToastComponent, Toggle, Tooltip, TopNavBar, Typography, TypographyEmoji, TypographyIcon, TypographyLink, VStack, VerticalSteps, View, createChoicesComponent, createResponsiveStyleFromProp, getStaticMapImageUrl, getValueForBreakpoint, hex2rgba, matchWindowSize, storyPadding, theme, useBottomSheet, useBreakpointValue, useCurrentBreakpointName, useGetStaticMapImageUrl, useKittMapConfig, useKittTheme, useMatchWindowSize, useOpenExternalLink, useStaticBottomSheet, useStoryBlockColor, useTheme };
 //# sourceMappingURL=index.es.web.js.map