@ornikar/kitt-universal 31.3.2-canary.d9333a410786c9c1a722ce408a27e7980c9146a4.0 → 32.0.0

package/dist/index.es.js

@@ -2865,7 +2865,7 @@ function ActionCardDisabled(_ref) {
   });
 }
 
-var _excluded$S = ["children", "variant", "borderVariant", "borderRadius", "disabled", "isHovered", "isPressed", "isFocused"];
+var _excluded$T = ["children", "variant", "borderVariant", "borderRadius", "disabled", "isHovered", "isPressed", "isFocused"];
 function ActionCard(_ref) {
   var children = _ref.children,
     _ref$variant = _ref.variant,
@@ -2878,7 +2878,7 @@ function ActionCard(_ref) {
     isHovered = _ref.isHovered,
     isPressed = _ref.isPressed,
     isFocused = _ref.isFocused,
-    props = _objectWithoutProperties(_ref, _excluded$S);
+    props = _objectWithoutProperties(_ref, _excluded$T);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
     children: disabled ? /*#__PURE__*/jsx(ActionCardDisabled, {
       borderRadius: borderRadius,
@@ -3202,7 +3202,7 @@ var getTypographyTypeWithAncestorValue = function (type, typographyTypeInContext
   return !!isAllValuesUndefined && !!typographyTypeInContext ? typographyTypeInContext : type;
 };
 
-var _excluded$R = ["accessibilityRole", "base", "small", "medium", "large", "wide", "type", "variant", "color"];
+var _excluded$S = ["accessibilityRole", "base", "small", "medium", "large", "wide", "type", "variant", "color"];
 var TypographyFamilyContext = /*#__PURE__*/createContext(null);
 var TypographyTypeContext = /*#__PURE__*/createContext(null);
 var TypographyVariantContext = /*#__PURE__*/createContext(undefined);
@@ -3327,7 +3327,7 @@ var TypographyBase = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     } : _ref2$type,
     variant = _ref2.variant,
     color = _ref2.color,
-    otherProps = _objectWithoutProperties(_ref2, _excluded$R);
+    otherProps = _objectWithoutProperties(_ref2, _excluded$S);
   var sx = useSx();
 
   // ancestors
@@ -3489,12 +3489,12 @@ function Icon(_ref) {
   });
 }
 
-var _excluded$Q = ["color", "size"],
+var _excluded$R = ["color", "size"],
   _excluded2$5 = ["color"];
 function TypographyIconSpecifiedColor(_ref) {
   var color = _ref.color,
     size = _ref.size,
-    props = _objectWithoutProperties(_ref, _excluded$Q);
+    props = _objectWithoutProperties(_ref, _excluded$R);
   var colorValue = getTypographyColorValue(color);
   var sx = useSx();
   var _sx = sx({
@@ -3534,7 +3534,7 @@ var getButtonTextColorByType = function (type, variant, isHovered, isPressed, is
   return "".concat(baseKey, ".default");
 };
 
-var _excluded$P = ["type", "variant", "isDisabled", "icon", "children", "isHovered", "isPressed", "isFocused", "innerSpacing", "size"];
+var _excluded$Q = ["type", "variant", "isDisabled", "icon", "children", "isHovered", "isPressed", "isFocused", "innerSpacing", "size"];
 function ButtonContentChildren(_ref) {
   var type = _ref.type,
     icon = _ref.icon,
@@ -3634,7 +3634,7 @@ function ButtonContent(_ref2) {
     _ref2.isFocused;
     var innerSpacing = _ref2.innerSpacing,
     size = _ref2.size,
-    props = _objectWithoutProperties(_ref2, _excluded$P);
+    props = _objectWithoutProperties(_ref2, _excluded$Q);
   var color = getButtonTextColorByType(type, variant, isHovered, isPressed, isDisabled);
   return /*#__PURE__*/jsx(View, {
     _web: {
@@ -3955,7 +3955,7 @@ function LoaderIcon(_ref) {
   });
 }
 
-var _excluded$O = ["as", "onPress", "disabled", "icon", "stretch"];
+var _excluded$P = ["as", "onPress", "disabled", "icon", "stretch"];
 var ActionsItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var as = _ref.as,
     onPress = _ref.onPress,
@@ -3966,7 +3966,7 @@ var ActionsItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
       base: true,
       medium: false
     } : _ref$stretch,
-    props = _objectWithoutProperties(_ref, _excluded$O);
+    props = _objectWithoutProperties(_ref, _excluded$P);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isLoading = _useState2[0],
@@ -4044,7 +4044,7 @@ function ActionsButton(_ref) {
   }, props));
 }
 
-var _excluded$N = ["children", "layout", "reversed"];
+var _excluded$O = ["children", "layout", "reversed"];
 function getCurrentLayout(layout) {
   if (!layout) return {
     base: 'stretch',
@@ -4076,7 +4076,7 @@ function Actions(_ref) {
     reversed = _ref$reversed === void 0 ? {
       base: false
     } : _ref$reversed,
-    props = _objectWithoutProperties(_ref, _excluded$N);
+    props = _objectWithoutProperties(_ref, _excluded$O);
   var shouldReverse = typeof reversed === 'boolean' ? {
     base: !!reversed
   } : createResponsiveStyleFromProp(reversed, true, false);
@@ -4129,7 +4129,7 @@ function getInitials(firstname, lastname) {
   return "".concat(firstname[0]).concat(lastname[0]).toUpperCase();
 }
 
-var _excluded$M = ["size", "round", "light", "sizeVariant", "width", "height", "dark", "disabled"];
+var _excluded$N = ["size", "round", "light", "sizeVariant", "width", "height", "dark", "disabled"];
 function AvatarContent(_ref) {
   var size = _ref.size,
     src = _ref.src,
@@ -4192,7 +4192,7 @@ function Avatar(_ref2) {
     height = _ref2.height,
     dark = _ref2.dark,
     disabled = _ref2.disabled,
-    props = _objectWithoutProperties(_ref2, _excluded$M);
+    props = _objectWithoutProperties(_ref2, _excluded$N);
   var currentSize = getCurrentSize({
     size: size,
     sizeVariant: sizeVariant
@@ -4230,7 +4230,7 @@ function Avatar(_ref2) {
   });
 }
 
-var _excluded$L = ["children", "hasScrollView", "hasBackdrop", "hasHandle", "enableDynamicSizing", "snapPoints"];
+var _excluded$M = ["children", "hasScrollView", "hasBackdrop", "hasHandle", "enableDynamicSizing", "snapPoints"];
 function BottomSheetComp(_ref, ref) {
   var Content = _ref.children,
     _ref$hasScrollView = _ref.hasScrollView,
@@ -4243,7 +4243,7 @@ function BottomSheetComp(_ref, ref) {
     enableDynamicSizing = _ref$enableDynamicSiz === void 0 ? true : _ref$enableDynamicSiz,
     _ref$snapPoints = _ref.snapPoints,
     snapPoints = _ref$snapPoints === void 0 ? ['100%'] : _ref$snapPoints,
-    rest = _objectWithoutProperties(_ref, _excluded$L);
+    rest = _objectWithoutProperties(_ref, _excluded$M);
   var _useSafeAreaInsets = useSafeAreaInsets(),
     top = _useSafeAreaInsets.top;
   var Wrapper = useMemo(function () {
@@ -4407,7 +4407,7 @@ var CardModalRotationContainer = /*#__PURE__*/forwardRef(function (props, ref) {
   }));
 });
 
-function NativeOpacityAnimation$2(_ref) {
+function OpacityAnimation(_ref) {
   var visible = _ref.visible,
     children = _ref.children,
     onExited = _ref.onExited;
@@ -4445,7 +4445,7 @@ function NativeOpacityAnimation$2(_ref) {
   });
 }
 
-function NativeRotationAnimation$1(_ref) {
+function RotationAnimation(_ref) {
   var visible = _ref.visible,
     children = _ref.children,
     onEntered = _ref.onEntered,
@@ -4543,14 +4543,14 @@ function CardModalAnimation(_ref) {
       flexGrow: 1,
       justifyContent: "center",
       alignItems: "center",
-      children: [/*#__PURE__*/jsx(NativeOpacityAnimation$2, {
+      children: [/*#__PURE__*/jsx(OpacityAnimation, {
         visible: isContentVisible,
         onExited: handleAnimationExited,
         children: /*#__PURE__*/jsx(Overlay, {
           onPress: onClose
         })
       }), /*#__PURE__*/jsx(CardModalRotationContainer, {
-        children: /*#__PURE__*/jsx(NativeRotationAnimation$1, {
+        children: /*#__PURE__*/jsx(RotationAnimation, {
           visible: isContentVisible,
           onExited: handleAnimationExited,
           onEntered: onEntered,
@@ -4561,13 +4561,13 @@ function CardModalAnimation(_ref) {
   });
 }
 
-var _excluded$K = ["children", "visible", "onClose", "onExited"];
+var _excluded$L = ["children", "visible", "onClose", "onExited"];
 function CardModalBehaviour(_ref) {
   var children = _ref.children,
     visible = _ref.visible,
     onClose = _ref.onClose,
     onExited = _ref.onExited,
-    props = _objectWithoutProperties(_ref, _excluded$K);
+    props = _objectWithoutProperties(_ref, _excluded$L);
   var _useState = useState(visible),
     _useState2 = _slicedToArray(_useState, 2),
     isModalBehaviourVisible = _useState2[0],
@@ -4592,12 +4592,12 @@ function CardModalBehaviour(_ref) {
   });
 }
 
-var _excluded$J = ["children", "padding"];
+var _excluded$K = ["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$J);
+    props = _objectWithoutProperties(_ref, _excluded$K);
   return /*#__PURE__*/jsx(ScrollView, _objectSpread(_objectSpread({
     showsVerticalScrollIndicator: false,
     _contentContainerStyle: {
@@ -4608,7 +4608,7 @@ function CardModalBody(_ref) {
   }));
 }
 
-var _excluded$I = ["children", "padding", "hasSeparator"];
+var _excluded$J = ["children", "padding", "hasSeparator"];
 function CardModalFooter(_ref) {
   var children = _ref.children,
     _ref$padding = _ref.padding,
@@ -4618,7 +4618,7 @@ function CardModalFooter(_ref) {
     } : _ref$padding,
     _ref$hasSeparator = _ref.hasSeparator,
     hasSeparator = _ref$hasSeparator === void 0 ? true : _ref$hasSeparator,
-    props = _objectWithoutProperties(_ref, _excluded$I);
+    props = _objectWithoutProperties(_ref, _excluded$J);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
     marginTop: "kitt.2",
     padding: padding,
@@ -4662,7 +4662,7 @@ var getButtonTypeAndVariant = function (iconColor) {
   }
 };
 
-var _excluded$H = ["color", "ariaLabel"];
+var _excluded$I = ["color", "ariaLabel"];
 /**
  * @deprecated IconButton should only be used as a navigation button
  * Other use cases should use a <Button> component with an icon
@@ -4671,7 +4671,7 @@ function IconButton(_ref) {
   var _ref$color = _ref.color,
     color = _ref$color === void 0 ? 'black' : _ref$color;
     _ref.ariaLabel;
-    var props = _objectWithoutProperties(_ref, _excluded$H);
+    var props = _objectWithoutProperties(_ref, _excluded$I);
   var _getButtonTypeAndVari = getButtonTypeAndVariant(color),
     legacyColorToType = _getButtonTypeAndVari.type,
     legacyColorToVariant = _getButtonTypeAndVari.variant;
@@ -4778,7 +4778,7 @@ function CardModalHeader(props) {
   return /*#__PURE__*/jsx(TopNavBar, _objectSpread({}, props));
 }
 
-var _excluded$G = ["backgroundColor", "maxWidth", "withoutShadow", "children"];
+var _excluded$H = ["backgroundColor", "maxWidth", "withoutShadow", "children"];
 function CardModal(_ref) {
   var _ref$backgroundColor = _ref.backgroundColor,
     backgroundColor = _ref$backgroundColor === void 0 ? 'kitt.uiBackgroundLight' : _ref$backgroundColor,
@@ -4786,7 +4786,7 @@ function CardModal(_ref) {
     maxWidth = _ref$maxWidth === void 0 ? 'kitt.cardModal.maxWidth' : _ref$maxWidth,
     withoutShadow = _ref.withoutShadow,
     children = _ref.children,
-    props = _objectWithoutProperties(_ref, _excluded$G);
+    props = _objectWithoutProperties(_ref, _excluded$H);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
     overflow: "hidden",
     backgroundColor: backgroundColor,
@@ -5033,11 +5033,11 @@ function ChoiceItemContainer(_ref) {
   }));
 }
 
-var _excluded$F = ["direction", "contentContainerStyle"];
+var _excluded$G = ["direction", "contentContainerStyle"];
 function ChoicesContainer(_ref) {
   var direction = _ref.direction,
     contentContainerStyle = _ref.contentContainerStyle,
-    props = _objectWithoutProperties(_ref, _excluded$F);
+    props = _objectWithoutProperties(_ref, _excluded$G);
   if (direction === 'row') {
     return /*#__PURE__*/jsx(ScrollView$2, _objectSpread({
       horizontal: true,
@@ -5118,10 +5118,12 @@ function NativeOpacityAnimation$1(_ref) {
     onExited = _ref.onExited;
   var theme = useTheme();
   var hasRunAnimationRef = useRef(false);
-  function handleAnimationFinished() {
+  useEffect(function () {
     if (visible) {
       hasRunAnimationRef.current = true;
     }
+  }, [visible]);
+  function handleAnimationFinished() {
     if (!visible && hasRunAnimationRef.current) {
       onExited();
     }
@@ -5143,7 +5145,7 @@ function NativeOpacityAnimation$1(_ref) {
         runOnJS(handleAnimationFinished)();
       })
     };
-  });
+  }, [theme, visible, handleAnimationFinished]);
   return /*#__PURE__*/jsx(Animated.View, {
     style: [StyleSheet.absoluteFillObject, opacityStyle],
     children: children
@@ -5158,10 +5160,14 @@ function NativeRotationAnimation(_ref) {
   var theme = useTheme();
   var hasRunAnimationRef = useRef(false);
   var rotation = useSharedValue(0.8);
+  useEffect(function () {
+    if (visible) {
+      hasRunAnimationRef.current = true;
+    }
+  }, [visible]);
   function handleAnimationFinished() {
     if (visible) {
       if (onEntered) onEntered();
-      hasRunAnimationRef.current = true;
     }
     if (!visible && hasRunAnimationRef.current) onExited();
   }
@@ -5194,7 +5200,7 @@ function NativeRotationAnimation(_ref) {
         rotateZ: "".concat(rotation.value, "deg")
       }]
     };
-  });
+  }, [theme, visible, rotation, handleAnimationFinished]);
   return /*#__PURE__*/jsx(Animated.View, {
     style: [animatedStyle],
     children: children
@@ -5268,13 +5274,13 @@ function DialogModalAnimation(_ref) {
   });
 }
 
-var _excluded$E = ["children", "visible", "onClose", "onExited"];
+var _excluded$F = ["children", "visible", "onClose", "onExited"];
 function DialogModalBehaviour(_ref) {
   var children = _ref.children,
     visible = _ref.visible,
     onClose = _ref.onClose,
     onExited = _ref.onExited,
-    props = _objectWithoutProperties(_ref, _excluded$E);
+    props = _objectWithoutProperties(_ref, _excluded$F);
   var _useState = useState(visible),
     _useState2 = _slicedToArray(_useState, 2),
     isModalBehaviourVisible = _useState2[0],
@@ -5305,7 +5311,7 @@ function DialogModalBehaviour(_ref) {
   });
 }
 
-var _excluded$D = ["stretch"];
+var _excluded$E = ["stretch"];
 function DialogModal(_ref) {
   var illustration = _ref.illustration,
     title = _ref.title,
@@ -5345,7 +5351,7 @@ DialogModal.ModalBehaviour = DialogModalBehaviour;
 function DialogModalButton(_ref2) {
   var _ref2$stretch = _ref2.stretch,
     stretch = _ref2$stretch === void 0 ? true : _ref2$stretch,
-    props = _objectWithoutProperties(_ref2, _excluded$D);
+    props = _objectWithoutProperties(_ref2, _excluded$E);
   return /*#__PURE__*/jsx(Actions.Button, _objectSpread({
     stretch: stretch
   }, props));
@@ -5382,7 +5388,7 @@ function Emoji(_ref) {
   });
 }
 
-var _excluded$C = ["as", "appScheme", "appValue", "onPress", "onOpenAppError"],
+var _excluded$D = ["as", "appScheme", "appValue", "onPress", "onOpenAppError"],
   _excluded2$4 = ["phoneNumber", "children"],
   _excluded3$3 = ["phoneNumber", "children"],
   _excluded4$3 = ["emailAddress", "children"];
@@ -5392,7 +5398,7 @@ function ExternalAppLink(_ref) {
     appValue = _ref.appValue,
     onPress = _ref.onPress,
     onOpenAppError = _ref.onOpenAppError,
-    rest = _objectWithoutProperties(_ref, _excluded$C);
+    rest = _objectWithoutProperties(_ref, _excluded$D);
   var href = "".concat(appScheme, ":").concat(appValue);
   var handleOnPress = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(e) {
@@ -5544,7 +5550,7 @@ function useOpenExternalLink(errorHandler) {
   }();
 }
 
-var _excluded$B = ["as", "href", "openLinkBehavior", "onPress", "onOpenLinkError"];
+var _excluded$C = ["as", "href", "openLinkBehavior", "onPress", "onOpenLinkError"];
 function ExternalLink(_ref) {
   var Component = _ref.as,
     href = _ref.href,
@@ -5553,7 +5559,7 @@ function ExternalLink(_ref) {
     onPress = _ref.onPress,
     _ref$onOpenLinkError = _ref.onOpenLinkError,
     onOpenLinkError = _ref$onOpenLinkError === void 0 ? console.error : _ref$onOpenLinkError,
-    rest = _objectWithoutProperties(_ref, _excluded$B);
+    rest = _objectWithoutProperties(_ref, _excluded$C);
   var openExternalLink = useOpenExternalLink();
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   return /*#__PURE__*/jsx(Component, _objectSpread(_objectSpread({}, rest), {}, {
@@ -5610,7 +5616,7 @@ function InputTextContainer(_ref) {
   });
 }
 
-var _excluded$A = ["id", "right", "state", "variant", "internalForceState", "disabled", "autoCorrect", "textContentType", "autoComplete", "inputMode", "multiline", "height", "onSubmitEditing"];
+var _excluded$B = ["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;
@@ -5631,7 +5637,7 @@ var InputText = /*#__PURE__*/forwardRef(function (_ref, ref) {
     multiline = _ref.multiline,
     height = _ref.height,
     onSubmitEditing = _ref.onSubmitEditing,
-    props = _objectWithoutProperties(_ref, _excluded$A);
+    props = _objectWithoutProperties(_ref, _excluded$B);
   var theme = useTheme();
   var fontSizeForNativeBase = createNativeBaseFontSize({
     base: 'body-m'
@@ -5756,12 +5762,12 @@ function AutocompleteItemsListContainer(_ref) {
   });
 }
 
-var _excluded$z = ["children", "testID"];
+var _excluded$A = ["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$z);
+    props = _objectWithoutProperties(_ref, _excluded$A);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({
     paddingX: {
       base: 'kitt.2',
@@ -5774,7 +5780,7 @@ function AutocompleteOption(_ref) {
   }));
 }
 
-var _excluded$y = ["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$z = ["children", "name", "disabled", "placeholder", "isInitialOpen", "initialValue", "containerProps", "filterItemBasedOnCurrentInputValue", "checkSelectedItem", "itemToString", "right", "onChange", "onFocus", "onBlur", "onInputChange", "onSelectItem", "onOuterPress", "errorElement", "emptyResultsElement", "inputTestID", "listContainerTestID", "zIndex", "maxItemContainerHeight"],
   _excluded2$3 = ["onClick", "onPress"],
   _excluded3$2 = ["onKeyDown", "onFocus", "onBlur", "onChange"],
   _excluded4$2 = ["onClick", "onPress", "role", "aria-selected"];
@@ -5814,7 +5820,7 @@ function Autocomplete(_ref) {
     _ref$zIndex = _ref.zIndex,
     zIndex = _ref$zIndex === void 0 ? 1000 : _ref$zIndex,
     maxItemContainerHeight = _ref.maxItemContainerHeight,
-    props = _objectWithoutProperties(_ref, _excluded$y);
+    props = _objectWithoutProperties(_ref, _excluded$z);
   var childrenArray = Children.toArray(children);
   var items = childrenArray.filter(isReactElement).map(function (child) {
     return {
@@ -6029,7 +6035,7 @@ function getBorderColor$1(_ref) {
   return 'kitt.forms.checkbox.default.borderColor';
 }
 
-var _excluded$x = ["checked", "hitSlop", "children", "disabled", "onChange", "onBlur", "onFocus"];
+var _excluded$y = ["checked", "hitSlop", "children", "disabled", "onChange", "onBlur", "onFocus"];
 var Checkbox = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var checked = _ref.checked,
     _ref$hitSlop = _ref.hitSlop,
@@ -6039,7 +6045,7 @@ var Checkbox = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onChange = _ref.onChange,
     onBlur = _ref.onBlur,
     onFocus = _ref.onFocus,
-    props = _objectWithoutProperties(_ref, _excluded$x);
+    props = _objectWithoutProperties(_ref, _excluded$y);
   var theme = useTheme();
   return /*#__PURE__*/jsx(Pressable, _objectSpread(_objectSpread({
     hitSlop: hitSlop
@@ -6357,7 +6363,7 @@ function PartContainer(_ref) {
   });
 }
 
-var _excluded$w = ["id", "value", "testID", "stretch", "placeholder", "minDate", "maxDate", "disabled", "isFocusedInternal", "isHoveredInternal", "isPressedInternal", "enterKeyHint", "onChange", "onBlur", "onFocus", "onSubmitEditing"];
+var _excluded$x = ["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,
@@ -6375,7 +6381,7 @@ var KeyboardDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onBlur = _ref.onBlur,
     onFocus = _ref.onFocus,
     onSubmitEditing = _ref.onSubmitEditing;
-    _objectWithoutProperties(_ref, _excluded$w);
+    _objectWithoutProperties(_ref, _excluded$x);
   var monthRef = useRef(null);
   var yearRef = useRef(null);
   var defaultValue = value;
@@ -6584,7 +6590,7 @@ var PressableDateInputs = /*#__PURE__*/forwardRef(function (_ref, ref) {
   });
 });
 
-var _excluded$v = ["onBlur", "onFocus", "pickerDefaultDate", "pickerUITestID", "isDefaultVisible", "value", "onChange"];
+var _excluded$w = ["onBlur", "onFocus", "pickerDefaultDate", "pickerUITestID", "isDefaultVisible", "value", "onChange"];
 var DatePickerAndroid = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var onBlur = _ref.onBlur,
     onFocus = _ref.onFocus,
@@ -6593,7 +6599,7 @@ var DatePickerAndroid = /*#__PURE__*/forwardRef(function (_ref, ref) {
     isDefaultVisible = _ref.isDefaultVisible,
     value = _ref.value,
     _onChange = _ref.onChange,
-    props = _objectWithoutProperties(_ref, _excluded$v);
+    props = _objectWithoutProperties(_ref, _excluded$w);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isFocused = _useState2[0],
@@ -6665,7 +6671,7 @@ function PlatformDateTimePicker(_ref) {
   });
 }
 
-var _excluded$u = ["title", "isVisible", "value", "validateButtonLabel", "onClose", "onChange"];
+var _excluded$v = ["title", "isVisible", "value", "validateButtonLabel", "onClose", "onChange"];
 function ModalTitle(_ref) {
   var children = _ref.children;
   return /*#__PURE__*/jsx(CardModal.Header, {
@@ -6679,7 +6685,7 @@ function ModalPlatformDateTimePicker(_ref2) {
     validateButtonLabel = _ref2.validateButtonLabel,
     onClose = _ref2.onClose,
     onChange = _ref2.onChange,
-    props = _objectWithoutProperties(_ref2, _excluded$u);
+    props = _objectWithoutProperties(_ref2, _excluded$v);
   var _useState = useState(value),
     _useState2 = _slicedToArray(_useState, 2),
     currentValue = _useState2[0],
@@ -6725,7 +6731,7 @@ function ModalPlatformDateTimePicker(_ref2) {
   });
 }
 
-var _excluded$t = ["value", "pickerUITestID", "pickerUITitle", "pickerUIValidateButtonLabel", "isDefaultVisible", "pickerDefaultDate", "isFocusedInternal", "isHoveredInternal", "isPressedInternal", "onChange", "onFocus", "onBlur"];
+var _excluded$u = ["value", "pickerUITestID", "pickerUITitle", "pickerUIValidateButtonLabel", "isDefaultVisible", "pickerDefaultDate", "isFocusedInternal", "isHoveredInternal", "isPressedInternal", "onChange", "onFocus", "onBlur"];
 var DefaultNativeUIDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var value = _ref.value,
     pickerUITestID = _ref.pickerUITestID,
@@ -6739,7 +6745,7 @@ var DefaultNativeUIDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onChange = _ref.onChange,
     onFocus = _ref.onFocus,
     onBlur = _ref.onBlur,
-    props = _objectWithoutProperties(_ref, _excluded$t);
+    props = _objectWithoutProperties(_ref, _excluded$u);
   var _useState = useState(isDefaultVisible),
     _useState2 = _slicedToArray(_useState, 2),
     isPickerUIVisible = _useState2[0],
@@ -6786,7 +6792,7 @@ var DefaultNativeUIDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
   });
 });
 
-var _excluded$s = ["value", "pickerUITestID", "isDefaultVisible", "pickerDefaultDate", "onChange", "onBlur"];
+var _excluded$t = ["value", "pickerUITestID", "isDefaultVisible", "pickerDefaultDate", "onChange", "onBlur"];
 var NativeUIDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var value = _ref.value,
     pickerUITestID = _ref.pickerUITestID,
@@ -6794,7 +6800,7 @@ var NativeUIDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
     pickerDefaultDate = _ref.pickerDefaultDate,
     onChange = _ref.onChange,
     onBlur = _ref.onBlur,
-    props = _objectWithoutProperties(_ref, _excluded$s);
+    props = _objectWithoutProperties(_ref, _excluded$t);
   if (Platform.OS === 'android') {
     return /*#__PURE__*/jsx(DatePickerAndroid, _objectSpread({
       ref: ref,
@@ -6816,14 +6822,14 @@ var NativeUIDatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, props));
 });
 
-var _excluded$r = ["fillMode", "enterKeyHint", "value", "onSubmitEditing"];
+var _excluded$s = ["fillMode", "enterKeyHint", "value", "onSubmitEditing"];
 var DatePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _ref$fillMode = _ref.fillMode,
     fillMode = _ref$fillMode === void 0 ? 'native' : _ref$fillMode,
     enterKeyHint = _ref.enterKeyHint,
     value = _ref.value,
     onSubmitEditing = _ref.onSubmitEditing,
-    props = _objectWithoutProperties(_ref, _excluded$r);
+    props = _objectWithoutProperties(_ref, _excluded$s);
   // in apps, final-form can give a string value that will break the component
   var currentValue = value || undefined;
   if (fillMode === 'keyboard') {
@@ -6939,10 +6945,10 @@ function ImagePicker(_ref) {
   });
 }
 
-var _excluded$q = ["children"];
+var _excluded$r = ["children"];
 function ListItemContent(_ref) {
   var children = _ref.children,
-    rest = _objectWithoutProperties(_ref, _excluded$q);
+    rest = _objectWithoutProperties(_ref, _excluded$r);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({
     alignSelf: "center",
     flexBasis: "0%",
@@ -6953,14 +6959,14 @@ function ListItemContent(_ref) {
   }));
 }
 
-var _excluded$p = ["children", "side"],
+var _excluded$q = ["children", "side"],
   _excluded2$2 = ["children", "align"];
 // Handles the vertical alignment of the side elements of the list item
 function ListItemSideContainer(_ref) {
   var children = _ref.children,
     _ref$side = _ref.side,
     side = _ref$side === void 0 ? 'left' : _ref$side,
-    rest = _objectWithoutProperties(_ref, _excluded$p);
+    rest = _objectWithoutProperties(_ref, _excluded$q);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({
     flexDirection: "row",
     marginLeft: side === 'right' ? 'kitt.2' : undefined,
@@ -6981,7 +6987,7 @@ function ListItemSideContent(_ref2) {
   }));
 }
 
-var _excluded$o = ["children", "withPadding", "borders", "left", "right", "onPress"];
+var _excluded$p = ["children", "withPadding", "borders", "left", "right", "onPress"];
 function ListItem(_ref) {
   var children = _ref.children,
     withPadding = _ref.withPadding,
@@ -6989,7 +6995,7 @@ function ListItem(_ref) {
     left = _ref.left,
     right = _ref.right,
     onPress = _ref.onPress,
-    rest = _objectWithoutProperties(_ref, _excluded$o);
+    rest = _objectWithoutProperties(_ref, _excluded$p);
   var Wrapper = onPress ? Pressable$2 : Fragment$1;
   var wrapperProps = onPress ? _objectSpread({
     accessibilityRole: 'button',
@@ -7022,10 +7028,10 @@ ListItem.Content = ListItemContent;
 ListItem.SideContent = ListItemSideContent;
 ListItem.SideContainer = ListItemSideContainer;
 
-var _excluded$n = ["title"];
+var _excluded$o = ["title"];
 function BottomSheetActionsItem(_ref) {
   var title = _ref.title,
-    props = _objectWithoutProperties(_ref, _excluded$n);
+    props = _objectWithoutProperties(_ref, _excluded$o);
   return /*#__PURE__*/jsx(Pressable$2, _objectSpread(_objectSpread({}, props), {}, {
     children: /*#__PURE__*/jsx(ListItem, {
       withPadding: true,
@@ -7108,6 +7114,84 @@ function FilePicker(_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$n = ["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$n);
+  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,
@@ -7561,7 +7645,7 @@ function useGoogleMapsAutocomplete() {
   return context;
 }
 
-function InputAddressOption(_ref) {
+function InputAddressOptionLegacy(_ref) {
   var item = _ref.item;
   var sharedTransform = {
     style: {
@@ -7570,7 +7654,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, {
@@ -7630,7 +7714,7 @@ function formatInitialValueToAutocompletePrediction(address, placeId) {
 }
 
 var _excluded$m = ["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,
@@ -7664,13 +7748,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({
@@ -14667,5 +14751,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, FlatList as 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, FlatList as 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.js.map