@ornikar/kitt-universal 9.26.0 → 9.28.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/babel-plugin-csf-to-jest.js +121 -0
  2. package/dist/definitions/Avatar/Avatar.d.ts +1 -7
  3. package/dist/definitions/Avatar/Avatar.d.ts.map +1 -1
  4. package/dist/definitions/Avatar/utils/getCurrentRadius.d.ts +9 -0
  5. package/dist/definitions/Avatar/utils/getCurrentRadius.d.ts.map +1 -0
  6. package/dist/definitions/Avatar/utils/getCurrentSize.d.ts +8 -0
  7. package/dist/definitions/Avatar/utils/getCurrentSize.d.ts.map +1 -0
  8. package/dist/definitions/Avatar/utils/getIconSize.d.ts +3 -0
  9. package/dist/definitions/Avatar/utils/getIconSize.d.ts.map +1 -0
  10. package/dist/definitions/Avatar/utils/getInitials.d.ts +2 -0
  11. package/dist/definitions/Avatar/utils/getInitials.d.ts.map +1 -0
  12. package/dist/definitions/KittMapConfigProvider/KittMapConfigProvider.d.ts +13 -0
  13. package/dist/definitions/KittMapConfigProvider/KittMapConfigProvider.d.ts.map +1 -0
  14. package/dist/definitions/KittMapConfigProvider/hooks/useKittMapConfig.d.ts +3 -0
  15. package/dist/definitions/KittMapConfigProvider/hooks/useKittMapConfig.d.ts.map +1 -0
  16. package/dist/definitions/MapMarker/MapMarker.d.ts +15 -0
  17. package/dist/definitions/MapMarker/MapMarker.d.ts.map +1 -0
  18. package/dist/definitions/ModalBehaviour/ModalBehaviourPortal.web.d.ts.map +1 -1
  19. package/dist/definitions/Skeleton/Skeleton.d.ts +15 -6
  20. package/dist/definitions/Skeleton/Skeleton.d.ts.map +1 -1
  21. package/dist/definitions/StaticMap/StaticMap.d.ts +34 -0
  22. package/dist/definitions/StaticMap/StaticMap.d.ts.map +1 -0
  23. package/dist/definitions/StaticMap/StaticMapError.d.ts +7 -0
  24. package/dist/definitions/StaticMap/StaticMapError.d.ts.map +1 -0
  25. package/dist/definitions/StaticMap/StaticMapImage.d.ts +12 -0
  26. package/dist/definitions/StaticMap/StaticMapImage.d.ts.map +1 -0
  27. package/dist/definitions/StaticMap/StaticMapLoader.d.ts +3 -0
  28. package/dist/definitions/StaticMap/StaticMapLoader.d.ts.map +1 -0
  29. package/dist/definitions/StaticMap/StaticMapMarker.d.ts +8 -0
  30. package/dist/definitions/StaticMap/StaticMapMarker.d.ts.map +1 -0
  31. package/dist/definitions/StaticMap/hooks/useGetStaticMapImageUrl.d.ts +8 -0
  32. package/dist/definitions/StaticMap/hooks/useGetStaticMapImageUrl.d.ts.map +1 -0
  33. package/dist/definitions/StaticMap/utils/getRangedWidthValue.d.ts +2 -0
  34. package/dist/definitions/StaticMap/utils/getRangedWidthValue.d.ts.map +1 -0
  35. package/dist/definitions/StaticMap/utils/getShouldDisplay2x.d.ts +2 -0
  36. package/dist/definitions/StaticMap/utils/getShouldDisplay2x.d.ts.map +1 -0
  37. package/dist/definitions/StaticMap/utils/getShouldDisplay2x.web.d.ts +2 -0
  38. package/dist/definitions/StaticMap/utils/getShouldDisplay2x.web.d.ts.map +1 -0
  39. package/dist/definitions/StaticMap/utils/getStaticMapImageUrl.d.ts +15 -0
  40. package/dist/definitions/StaticMap/utils/getStaticMapImageUrl.d.ts.map +1 -0
  41. package/dist/definitions/index.d.ts +9 -0
  42. package/dist/definitions/index.d.ts.map +1 -1
  43. package/dist/definitions/native-base/KittNativeBaseProvider.d.ts +121 -0
  44. package/dist/definitions/native-base/KittNativeBaseProvider.d.ts.map +1 -1
  45. package/dist/definitions/native-base/primitives.d.ts +17 -1
  46. package/dist/definitions/native-base/primitives.d.ts.map +1 -1
  47. package/dist/definitions/themes/late-ocean/avatar.d.ts +8 -0
  48. package/dist/definitions/themes/late-ocean/avatar.d.ts.map +1 -1
  49. package/dist/definitions/themes/late-ocean/skeleton.d.ts +6 -0
  50. package/dist/definitions/themes/late-ocean/skeleton.d.ts.map +1 -1
  51. package/dist/index-browser-all.es.android.js +796 -235
  52. package/dist/index-browser-all.es.android.js.map +1 -1
  53. package/dist/index-browser-all.es.ios.js +796 -235
  54. package/dist/index-browser-all.es.ios.js.map +1 -1
  55. package/dist/index-browser-all.es.js +852 -232
  56. package/dist/index-browser-all.es.js.map +1 -1
  57. package/dist/index-browser-all.es.web.js +865 -245
  58. package/dist/index-browser-all.es.web.js.map +1 -1
  59. package/dist/index-node-14.17.cjs.js +739 -134
  60. package/dist/index-node-14.17.cjs.js.map +1 -1
  61. package/dist/index-node-14.17.cjs.web.js +746 -136
  62. package/dist/index-node-14.17.cjs.web.js.map +1 -1
  63. package/dist/linaria-themes-browser-all.es.android.js +24 -2
  64. package/dist/linaria-themes-browser-all.es.android.js.map +1 -1
  65. package/dist/linaria-themes-browser-all.es.ios.js +24 -2
  66. package/dist/linaria-themes-browser-all.es.ios.js.map +1 -1
  67. package/dist/linaria-themes-browser-all.es.js +24 -2
  68. package/dist/linaria-themes-browser-all.es.js.map +1 -1
  69. package/dist/linaria-themes-browser-all.es.web.js +24 -2
  70. package/dist/linaria-themes-browser-all.es.web.js.map +1 -1
  71. package/dist/linaria-themes-node-14.17.cjs.js +24 -2
  72. package/dist/linaria-themes-node-14.17.cjs.js.map +1 -1
  73. package/dist/linaria-themes-node-14.17.cjs.web.js +24 -2
  74. package/dist/linaria-themes-node-14.17.cjs.web.js.map +1 -1
  75. package/dist/tsbuildinfo +1 -1
  76. package/package.json +2 -2
@@ -1,6 +1,6 @@
1
1
  import _objectSpread from '@babel/runtime/helpers/objectSpread2';
2
2
  import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
3
- import { Stack as Stack$1, VStack as VStack$1, HStack as HStack$1, Center as Center$1, View as View$1, ScrollView as ScrollView$1, Pressable as Pressable$1, Image as Image$1, Text as Text$1, Input, NativeBaseProvider, extendTheme, useBreakpointValue } from 'native-base';
3
+ import { Stack as Stack$1, VStack as VStack$1, HStack as HStack$1, Center as Center$1, View as View$1, ScrollView as ScrollView$1, Pressable as Pressable$1, Image as Image$1, FlatList as FlatList$1, SectionList as SectionList$1, Text as Text$1, Input, NativeBaseProvider, extendTheme, useBreakpointValue } from 'native-base';
4
4
  export { useBreakpointValue, useClipboard, useToken } from 'native-base';
5
5
  import _extends from '@babel/runtime/helpers/extends';
6
6
  import React, { useContext, createContext, cloneElement, forwardRef, useRef, useEffect, useState, useMemo, Children, Fragment as Fragment$1, useCallback } from 'react';
@@ -8,11 +8,11 @@ import Animated, { withSpring, useSharedValue, useAnimatedStyle, interpolateColo
8
8
  import styled, { useTheme, css, withTheme as withTheme$1, ThemeProvider } from 'styled-components/native';
9
9
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
10
10
  import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
11
- import { Platform, Animated as Animated$1, Easing, useWindowDimensions, Image as Image$2, View as View$2, Pressable as Pressable$2, StyleSheet, Modal as Modal$1, ScrollView as ScrollView$2, Linking, Text as Text$2 } from 'react-native';
11
+ import { Platform, Animated as Animated$1, Easing, useWindowDimensions, View as View$2, Pressable as Pressable$2, StyleSheet, Modal as Modal$1, ScrollView as ScrollView$2, Linking, Text as Text$2, PixelRatio } from 'react-native';
12
12
  export { useWindowDimensions as useWindowSize } from 'react-native';
13
13
  import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
14
14
  import _regeneratorRuntime from '@babel/runtime/regenerator';
15
- import { ArcIcon, UserIcon, CheckboxMark, XIcon, EyeOffIcon, EyeIcon, InfoIcon, AlertTriangleIcon, CheckIcon, AlertCircleIcon, TooltipArrowIcon } from '@ornikar/kitt-icons';
15
+ import { ArcIcon, UserIcon, CheckboxMark, XIcon, EyeOffIcon, EyeIcon, InfoIcon, AlertTriangleIcon, CheckIcon, AlertCircleIcon, RotateCCWIcon, TooltipArrowIcon } from '@ornikar/kitt-icons';
16
16
  export * from '@ornikar/kitt-icons';
17
17
  import { BottomSheetScrollView, BottomSheetView, useBottomSheetDynamicSnapPoints, BottomSheetModal, BottomSheetHandle, BottomSheetBackdrop } from '@gorhom/bottom-sheet';
18
18
  import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context';
@@ -36,6 +36,10 @@ var View = View$1;
36
36
  var ScrollView = ScrollView$1;
37
37
  var Pressable = Pressable$1;
38
38
  var Image = Image$1;
39
+ // See: https://fettblog.eu/typescript-react-generic-forward-refs/
40
+ var FlatList = FlatList$1;
41
+ // See: https://fettblog.eu/typescript-react-generic-forward-refs/
42
+ var SectionList = SectionList$1;
39
43
 
40
44
  function createResponsiveStyleFromProp(responsiveBooleanValue, valueIfTrue, valueIfFalse) {
41
45
  // Handles simple boolean values
@@ -142,7 +146,7 @@ var KittBreakpointNameEnum;
142
146
  KittBreakpointNameEnum["WIDE"] = "wide";
143
147
  })(KittBreakpointNameEnum || (KittBreakpointNameEnum = {}));
144
148
 
145
- var _excluded$w = ["accessibilityRole", "base", "small", "medium", "large", "wide", "type", "variant", "color"];
149
+ var _excluded$y = ["accessibilityRole", "base", "small", "medium", "large", "wide", "type", "variant", "color"];
146
150
  var IsHeaderTypographyContext = /*#__PURE__*/createContext(undefined);
147
151
  var TypographyColorContext = /*#__PURE__*/createContext('black');
148
152
  function useTypographyColor() {
@@ -214,7 +218,7 @@ function Typography(_ref) {
214
218
  } : _ref$type,
215
219
  variant = _ref.variant,
216
220
  color = _ref.color,
217
- otherProps = _objectWithoutProperties(_ref, _excluded$w);
221
+ otherProps = _objectWithoutProperties(_ref, _excluded$y);
218
222
 
219
223
  var isHeaderTypographyInContext = useContext(IsHeaderTypographyContext);
220
224
  var defaultColor = useTypographyDefaultColor();
@@ -347,12 +351,12 @@ function Icon(_ref5) {
347
351
  });
348
352
  }
349
353
 
350
- var _excluded$v = ["color"],
351
- _excluded2$4 = ["color"];
354
+ var _excluded$x = ["color"],
355
+ _excluded2$5 = ["color"];
352
356
 
353
357
  function TypographyIconSpecifiedColor(_ref) {
354
358
  var color = _ref.color,
355
- props = _objectWithoutProperties(_ref, _excluded$v);
359
+ props = _objectWithoutProperties(_ref, _excluded$x);
356
360
 
357
361
  var theme = /*#__PURE__*/useTheme();
358
362
  return /*#__PURE__*/jsx(Icon, _objectSpread(_objectSpread({}, props), {}, {
@@ -369,7 +373,7 @@ function TypographyIconInheritColor(props) {
369
373
 
370
374
  function TypographyIcon(_ref2) {
371
375
  var color = _ref2.color,
372
- props = _objectWithoutProperties(_ref2, _excluded2$4);
376
+ props = _objectWithoutProperties(_ref2, _excluded2$5);
373
377
 
374
378
  if (color) {
375
379
  return /*#__PURE__*/jsx(TypographyIconSpecifiedColor, _objectSpread({
@@ -404,7 +408,7 @@ var getTextColorByType = function (type, variant, isHovered, isPressed) {
404
408
  }
405
409
  };
406
410
 
407
- var _excluded$u = ["type", "variant", "isDisabled", "icon", "children", "isHovered", "isPressed", "isFocused"];
411
+ var _excluded$w = ["type", "variant", "isDisabled", "icon", "children", "isHovered", "isPressed", "isFocused"];
408
412
 
409
413
  function ButtonIcon(_ref) {
410
414
  var icon = _ref.icon,
@@ -482,7 +486,7 @@ function ButtonContent(_ref3) {
482
486
  isHovered = _ref3.isHovered,
483
487
  isPressed = _ref3.isPressed;
484
488
  _ref3.isFocused;
485
- var props = _objectWithoutProperties(_ref3, _excluded$u);
489
+ var props = _objectWithoutProperties(_ref3, _excluded$w);
486
490
 
487
491
  var color = isDisabled ? 'black-light' : getTextColorByType(type, variant, isHovered, isPressed);
488
492
  return /*#__PURE__*/jsx(View, {
@@ -833,7 +837,7 @@ function useMatchWindowSize(options) {
833
837
  }, options);
834
838
  }
835
839
 
836
- var _excluded$t = ["as", "onPress", "disabled", "icon", "stretch"];
840
+ var _excluded$v = ["as", "onPress", "disabled", "icon", "stretch"];
837
841
 
838
842
  function getCurrentStretchValue(isStretch, isMedium) {
839
843
  // Stretch will follow the value passed from the component occurence if defined
@@ -847,7 +851,7 @@ function ActionsItem(_ref) {
847
851
  disabled = _ref.disabled,
848
852
  icon = _ref.icon,
849
853
  stretch = _ref.stretch,
850
- props = _objectWithoutProperties(_ref, _excluded$t);
854
+ props = _objectWithoutProperties(_ref, _excluded$v);
851
855
 
852
856
  var isMedium = useMatchWindowSize({
853
857
  minWidth: KittBreakpoints.MEDIUM
@@ -937,7 +941,7 @@ function ActionsButton(_ref) {
937
941
  }, props));
938
942
  }
939
943
 
940
- var _excluded$s = ["children", "layout"];
944
+ var _excluded$u = ["children", "layout"];
941
945
 
942
946
  function getCurrentLayout(layout) {
943
947
  if (!layout) return {
@@ -960,7 +964,7 @@ function getCurrentDirection(layout) {
960
964
  function Actions(_ref) {
961
965
  var children = _ref.children,
962
966
  layout = _ref.layout,
963
- props = _objectWithoutProperties(_ref, _excluded$s);
967
+ props = _objectWithoutProperties(_ref, _excluded$u);
964
968
 
965
969
  var currentAlignItems = getCurrentLayout(layout);
966
970
  var currentDirection = getCurrentDirection(layout);
@@ -976,51 +980,131 @@ function Actions(_ref) {
976
980
  Actions.Button = ActionsButton;
977
981
  Actions.Item = ActionsItem;
978
982
 
979
- var _excluded$r = ["size", "round", "light", "sizeVariant"];
983
+ var lateOceanColorPalette = {
984
+ lateOcean: '#4C34E0',
985
+ lateOceanLight1: '#705DE6',
986
+ lateOceanLight2: '#9485EC',
987
+ lateOceanLight3: '#D6BAF9',
988
+ warmEmbrace: '#F4D3CE',
989
+ warmEmbraceLight1: '#FFEDE6',
990
+ black1000: '#000000',
991
+ black800: '#333333',
992
+ black555: '#737373',
993
+ black400: '#999999',
994
+ black200: '#CCCCCC',
995
+ black100: '#E5E5E5',
996
+ black50: '#F2F2F2',
997
+ black25: '#F9F9F9',
998
+ white: '#FFFFFF',
999
+ viride: '#38836D',
1000
+ englishVermillon: '#D44148',
1001
+ goldCrayola: '#F8C583',
1002
+ aero: '#89BDDD',
1003
+ transparent: 'transparent',
1004
+ moonPurple: '#DBD6F9',
1005
+ moonPurpleLight1: '#EDEBFC'
1006
+ };
980
1007
 
981
- var getInitials = function (firstname, lastname) {
982
- return "".concat(firstname[0]).concat(lastname[0]).toUpperCase();
1008
+ var colors = {
1009
+ primary: lateOceanColorPalette.lateOcean,
1010
+ primaryLight: lateOceanColorPalette.lateOceanLight1,
1011
+ accent: lateOceanColorPalette.warmEmbrace,
1012
+ accentLight: lateOceanColorPalette.warmEmbraceLight1,
1013
+ success: lateOceanColorPalette.viride,
1014
+ correct: lateOceanColorPalette.viride,
1015
+ danger: lateOceanColorPalette.englishVermillon,
1016
+ info: lateOceanColorPalette.aero,
1017
+ warning: lateOceanColorPalette.goldCrayola,
1018
+ separator: lateOceanColorPalette.black100,
1019
+ hover: lateOceanColorPalette.black100,
1020
+ white: lateOceanColorPalette.white,
1021
+ black: lateOceanColorPalette.black1000,
1022
+ blackDisabled: lateOceanColorPalette.black400,
1023
+ blackLight: lateOceanColorPalette.black555,
1024
+ blackAnthracite: lateOceanColorPalette.black800,
1025
+ uiBackground: lateOceanColorPalette.black25,
1026
+ uiBackgroundLight: lateOceanColorPalette.white,
1027
+ transparent: lateOceanColorPalette.transparent,
1028
+ disabled: lateOceanColorPalette.black50,
1029
+ overlay: {
1030
+ dark: 'rgba(41, 48, 51, 0.25)',
1031
+ light: 'rgba(255, 255, 255, 0.90)'
1032
+ }
983
1033
  };
984
1034
 
985
- var StyledAvatarView = /*#__PURE__*/styled.View.withConfig({
986
- displayName: "Avatar__StyledAvatarView"
987
- })(["border-radius:", ";background-color:", ";height:", "px;width:", "px;overflow:hidden;align-items:center;justify-content:center;"], function (_ref) {
988
- var theme = _ref.theme,
989
- $isRound = _ref.$isRound,
990
- $size = _ref.$size,
991
- $sizeVariant = _ref.$sizeVariant;
992
- if ($isRound) return "".concat($size / 2, "px");
993
- return "".concat($sizeVariant === 'large' ? theme.kitt.avatar.large.borderRadius : theme.kitt.avatar.borderRadius, "px");
994
- }, function (_ref2) {
995
- var theme = _ref2.theme,
996
- $isLight = _ref2.$isLight;
997
- return $isLight ? theme.kitt.avatar.light.backgroundColor : theme.kitt.avatar["default"].backgroundColor;
998
- }, function (_ref3) {
999
- var $size = _ref3.$size;
1000
- return $size;
1001
- }, function (_ref4) {
1002
- var $size = _ref4.$size;
1003
- return $size;
1004
- });
1035
+ var defaultAvatarSize = 40;
1036
+ var defaultAvatarIconSize = 20;
1037
+ var largeAvatarSize = 120;
1038
+ var largeAvatarIconSize = 30;
1039
+ var avatar = {
1040
+ borderRadius: 10,
1041
+ size: defaultAvatarSize,
1042
+ iconSize: defaultAvatarIconSize,
1043
+ "default": {
1044
+ backgroundColor: colors.primary
1045
+ },
1046
+ light: {
1047
+ backgroundColor: lateOceanColorPalette.black100
1048
+ },
1049
+ large: {
1050
+ borderRadius: 30,
1051
+ size: largeAvatarSize,
1052
+ iconSize: largeAvatarIconSize
1053
+ }
1054
+ };
1005
1055
 
1006
- function AvatarContent(_ref5) {
1007
- var size = _ref5.size,
1008
- src = _ref5.src,
1009
- firstname = _ref5.firstname,
1010
- lastname = _ref5.lastname,
1011
- alt = _ref5.alt,
1012
- isLight = _ref5.isLight,
1013
- sizeVariant = _ref5.sizeVariant;
1056
+ function getCurrentRadius(_ref) {
1057
+ var size = _ref.size,
1058
+ sizeVariant = _ref.sizeVariant,
1059
+ round = _ref.round;
1060
+
1061
+ if (round) {
1062
+ if (size) return size * 0.5;
1063
+ if (sizeVariant === 'large') return largeAvatarSize * 0.5;
1064
+ return defaultAvatarSize * 0.5;
1065
+ }
1066
+
1067
+ if (sizeVariant === 'large') return 'kitt.avatar.large.borderRadius';
1068
+ return 'kitt.avatar.borderRadius';
1069
+ }
1070
+
1071
+ function getCurrentSize(_ref) {
1072
+ var size = _ref.size,
1073
+ sizeVariant = _ref.sizeVariant;
1074
+ if (size) return size;
1075
+ if (sizeVariant === 'large') return 'kitt.avatar.large.size';
1076
+ return 'kitt.avatar.size';
1077
+ }
1078
+
1079
+ function getIconSize(size, sizeVariant) {
1080
+ if (typeof size === 'number') return size * 0.5;
1081
+ if (sizeVariant === 'large') return largeAvatarIconSize;
1082
+ return defaultAvatarIconSize;
1083
+ }
1084
+
1085
+ function getInitials(firstname, lastname) {
1086
+ return "".concat(firstname[0]).concat(lastname[0]).toUpperCase();
1087
+ }
1088
+
1089
+ var _excluded$t = ["size", "round", "light", "sizeVariant"];
1090
+
1091
+ function AvatarContent(_ref) {
1092
+ var size = _ref.size,
1093
+ src = _ref.src,
1094
+ firstname = _ref.firstname,
1095
+ lastname = _ref.lastname,
1096
+ alt = _ref.alt,
1097
+ isLight = _ref.isLight,
1098
+ sizeVariant = _ref.sizeVariant;
1014
1099
 
1015
1100
  if (src) {
1016
- return /*#__PURE__*/jsx(Image$2, {
1101
+ return /*#__PURE__*/jsx(Image, {
1017
1102
  source: {
1018
1103
  uri: src
1019
1104
  },
1020
- style: {
1021
- width: size,
1022
- height: size
1023
- },
1105
+ width: size,
1106
+ height: size,
1107
+ alt: alt,
1024
1108
  accessibilityLabel: alt
1025
1109
  });
1026
1110
  }
@@ -1037,25 +1121,36 @@ function AvatarContent(_ref5) {
1037
1121
  return /*#__PURE__*/jsx(Icon, {
1038
1122
  icon: /*#__PURE__*/jsx(UserIcon, {}),
1039
1123
  color: isLight ? 'black' : 'white',
1040
- size: size / 2
1124
+ size: getIconSize(size, sizeVariant)
1041
1125
  });
1042
1126
  }
1043
1127
 
1044
- function Avatar(_ref6) {
1045
- var _ref6$size = _ref6.size,
1046
- size = _ref6$size === void 0 ? 40 : _ref6$size,
1047
- round = _ref6.round,
1048
- light = _ref6.light,
1049
- sizeVariant = _ref6.sizeVariant,
1050
- props = _objectWithoutProperties(_ref6, _excluded$r);
1128
+ function Avatar(_ref2) {
1129
+ var size = _ref2.size,
1130
+ round = _ref2.round,
1131
+ light = _ref2.light,
1132
+ sizeVariant = _ref2.sizeVariant,
1133
+ props = _objectWithoutProperties(_ref2, _excluded$t);
1051
1134
 
1052
- return /*#__PURE__*/jsx(StyledAvatarView, {
1053
- $size: size,
1054
- $isRound: round,
1055
- $isLight: light,
1056
- $sizeVariant: sizeVariant,
1135
+ var currentSize = getCurrentSize({
1136
+ size: size,
1137
+ sizeVariant: sizeVariant
1138
+ });
1139
+ var currentBorderRadius = getCurrentRadius({
1140
+ size: size,
1141
+ sizeVariant: sizeVariant,
1142
+ round: round
1143
+ });
1144
+ return /*#__PURE__*/jsx(View, {
1145
+ overflow: "hidden",
1146
+ alignItems: "center",
1147
+ justifyContent: "center",
1148
+ width: currentSize,
1149
+ height: currentSize,
1150
+ borderRadius: currentBorderRadius,
1151
+ backgroundColor: "kitt.avatar.".concat(light ? 'light' : 'default', ".backgroundColor"),
1057
1152
  children: /*#__PURE__*/jsx(AvatarContent, _objectSpread({
1058
- size: size,
1153
+ size: currentSize,
1059
1154
  isLight: light,
1060
1155
  sizeVariant: sizeVariant
1061
1156
  }, props))
@@ -1469,12 +1564,12 @@ function CardModalAnimation(_ref) {
1469
1564
  });
1470
1565
  }
1471
1566
 
1472
- var _excluded$q = ["children"],
1473
- _excluded2$3 = ["children", "visible", "onClose", "onExited"];
1567
+ var _excluded$s = ["children"],
1568
+ _excluded2$4 = ["children", "visible", "onClose", "onExited"];
1474
1569
 
1475
1570
  function ScrollContainer(_ref) {
1476
1571
  var children = _ref.children,
1477
- props = _objectWithoutProperties(_ref, _excluded$q);
1572
+ props = _objectWithoutProperties(_ref, _excluded$s);
1478
1573
 
1479
1574
  if (Platform.OS !== 'web') {
1480
1575
  return /*#__PURE__*/jsx(View, {
@@ -1492,7 +1587,7 @@ function CardModalBehaviour(_ref2) {
1492
1587
  visible = _ref2.visible,
1493
1588
  onClose = _ref2.onClose,
1494
1589
  onExited = _ref2.onExited,
1495
- props = _objectWithoutProperties(_ref2, _excluded2$3);
1590
+ props = _objectWithoutProperties(_ref2, _excluded2$4);
1496
1591
 
1497
1592
  var _useState = useState(visible),
1498
1593
  _useState2 = _slicedToArray(_useState, 2),
@@ -1525,7 +1620,7 @@ function CardModalBehaviour(_ref2) {
1525
1620
  });
1526
1621
  }
1527
1622
 
1528
- var _excluded$p = ["children", "paddingX", "paddingY"];
1623
+ var _excluded$r = ["children", "paddingX", "paddingY"];
1529
1624
  function CardModalBody(_ref) {
1530
1625
  var children = _ref.children,
1531
1626
  _ref$paddingX = _ref.paddingX,
@@ -1535,7 +1630,7 @@ function CardModalBody(_ref) {
1535
1630
  } : _ref$paddingX,
1536
1631
  _ref$paddingY = _ref.paddingY,
1537
1632
  paddingY = _ref$paddingY === void 0 ? 'kitt.4' : _ref$paddingY,
1538
- props = _objectWithoutProperties(_ref, _excluded$p);
1633
+ props = _objectWithoutProperties(_ref, _excluded$r);
1539
1634
 
1540
1635
  return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({
1541
1636
  paddingX: paddingX,
@@ -1545,7 +1640,7 @@ function CardModalBody(_ref) {
1545
1640
  }));
1546
1641
  }
1547
1642
 
1548
- var _excluded$o = ["children", "padding", "hasSeparator"];
1643
+ var _excluded$q = ["children", "padding", "hasSeparator"];
1549
1644
  function CardModalFooter(_ref) {
1550
1645
  var children = _ref.children,
1551
1646
  _ref$padding = _ref.padding,
@@ -1555,7 +1650,7 @@ function CardModalFooter(_ref) {
1555
1650
  } : _ref$padding,
1556
1651
  _ref$hasSeparator = _ref.hasSeparator,
1557
1652
  hasSeparator = _ref$hasSeparator === void 0 ? true : _ref$hasSeparator,
1558
- props = _objectWithoutProperties(_ref, _excluded$o);
1653
+ props = _objectWithoutProperties(_ref, _excluded$q);
1559
1654
 
1560
1655
  return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
1561
1656
  marginTop: "kitt.2",
@@ -1570,7 +1665,7 @@ function CardModalFooter(_ref) {
1570
1665
  }));
1571
1666
  }
1572
1667
 
1573
- var _excluded$n = ["children", "title", "paddingBottom", "hasSeparator", "right", "left"];
1668
+ var _excluded$p = ["children", "title", "paddingBottom", "hasSeparator", "right", "left"];
1574
1669
  function CardModalHeader(_ref) {
1575
1670
  var children = _ref.children,
1576
1671
  title = _ref.title,
@@ -1583,7 +1678,7 @@ function CardModalHeader(_ref) {
1583
1678
  hasSeparator = _ref$hasSeparator === void 0 ? true : _ref$hasSeparator,
1584
1679
  right = _ref.right,
1585
1680
  left = _ref.left,
1586
- props = _objectWithoutProperties(_ref, _excluded$n);
1681
+ props = _objectWithoutProperties(_ref, _excluded$p);
1587
1682
 
1588
1683
  var defaultContainerPadding = {
1589
1684
  base: 'kitt.4',
@@ -1622,7 +1717,7 @@ function CardModalHeader(_ref) {
1622
1717
  }));
1623
1718
  }
1624
1719
 
1625
- var _excluded$m = ["children", "backgroundColor", "maxWidth", "withoutShadow"];
1720
+ var _excluded$o = ["children", "backgroundColor", "maxWidth", "withoutShadow"];
1626
1721
  function CardModal(_ref) {
1627
1722
  var children = _ref.children,
1628
1723
  _ref$backgroundColor = _ref.backgroundColor,
@@ -1630,7 +1725,7 @@ function CardModal(_ref) {
1630
1725
  _ref$maxWidth = _ref.maxWidth,
1631
1726
  maxWidth = _ref$maxWidth === void 0 ? 'kitt.cardModal.maxWidth' : _ref$maxWidth,
1632
1727
  withoutShadow = _ref.withoutShadow,
1633
- props = _objectWithoutProperties(_ref, _excluded$m);
1728
+ props = _objectWithoutProperties(_ref, _excluded$o);
1634
1729
 
1635
1730
  return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
1636
1731
  overflow: "hidden",
@@ -1904,11 +1999,11 @@ var ChoiceItemContainer = /*#__PURE__*/styled(View$2).withConfig({
1904
1999
  return css(["margin-bottom:", "px;"], $isLast ? 0 : column);
1905
2000
  });
1906
2001
 
1907
- var _excluded$l = ["direction"];
2002
+ var _excluded$n = ["direction"];
1908
2003
 
1909
2004
  function ChoicesContainer(_ref) {
1910
2005
  var direction = _ref.direction,
1911
- props = _objectWithoutProperties(_ref, _excluded$l);
2006
+ props = _objectWithoutProperties(_ref, _excluded$n);
1912
2007
 
1913
2008
  if (direction === 'row') {
1914
2009
  return /*#__PURE__*/jsx(ScrollView$2, _objectSpread({
@@ -2220,13 +2315,13 @@ function DialogModalAnimation(_ref) {
2220
2315
  });
2221
2316
  }
2222
2317
 
2223
- var _excluded$k = ["children", "visible", "onClose", "onExited"];
2318
+ var _excluded$m = ["children", "visible", "onClose", "onExited"];
2224
2319
  function DialogModalBehaviour(_ref) {
2225
2320
  var children = _ref.children,
2226
2321
  visible = _ref.visible,
2227
2322
  onClose = _ref.onClose,
2228
2323
  onExited = _ref.onExited,
2229
- props = _objectWithoutProperties(_ref, _excluded$k);
2324
+ props = _objectWithoutProperties(_ref, _excluded$m);
2230
2325
 
2231
2326
  var _useState = useState(visible),
2232
2327
  _useState2 = _slicedToArray(_useState, 2),
@@ -2259,7 +2354,7 @@ function DialogModalBehaviour(_ref) {
2259
2354
  });
2260
2355
  }
2261
2356
 
2262
- var _excluded$j = ["stretch"];
2357
+ var _excluded$l = ["stretch"];
2263
2358
  function DialogModal(_ref) {
2264
2359
  var illustration = _ref.illustration,
2265
2360
  title = _ref.title,
@@ -2301,7 +2396,7 @@ DialogModal.ModalBehaviour = DialogModalBehaviour;
2301
2396
  function DialogModalButton(_ref2) {
2302
2397
  var _ref2$stretch = _ref2.stretch,
2303
2398
  stretch = _ref2$stretch === void 0 ? true : _ref2$stretch,
2304
- props = _objectWithoutProperties(_ref2, _excluded$j);
2399
+ props = _objectWithoutProperties(_ref2, _excluded$l);
2305
2400
 
2306
2401
  return /*#__PURE__*/jsx(Actions.Button, _objectSpread({
2307
2402
  stretch: stretch
@@ -2340,17 +2435,17 @@ function Emoji(_ref) {
2340
2435
  });
2341
2436
  }
2342
2437
 
2343
- var _excluded$i = ["as", "appScheme", "appValue", "onPress", "onOpenAppError"],
2344
- _excluded2$2 = ["phoneNumber", "children"],
2345
- _excluded3$1 = ["phoneNumber", "children"],
2346
- _excluded4 = ["emailAddress", "children"];
2438
+ var _excluded$k = ["as", "appScheme", "appValue", "onPress", "onOpenAppError"],
2439
+ _excluded2$3 = ["phoneNumber", "children"],
2440
+ _excluded3$2 = ["phoneNumber", "children"],
2441
+ _excluded4$1 = ["emailAddress", "children"];
2347
2442
  function ExternalAppLink(_ref) {
2348
2443
  var Component = _ref.as,
2349
2444
  appScheme = _ref.appScheme,
2350
2445
  appValue = _ref.appValue,
2351
2446
  onPress = _ref.onPress,
2352
2447
  onOpenAppError = _ref.onOpenAppError,
2353
- rest = _objectWithoutProperties(_ref, _excluded$i);
2448
+ rest = _objectWithoutProperties(_ref, _excluded$k);
2354
2449
 
2355
2450
  var href = "".concat(appScheme, ":").concat(appValue);
2356
2451
 
@@ -2430,7 +2525,7 @@ function ExternalAppLink(_ref) {
2430
2525
  ExternalAppLink.Sms = function (_ref3) {
2431
2526
  var phoneNumber = _ref3.phoneNumber,
2432
2527
  children = _ref3.children,
2433
- rest = _objectWithoutProperties(_ref3, _excluded2$2);
2528
+ rest = _objectWithoutProperties(_ref3, _excluded2$3);
2434
2529
 
2435
2530
  return /*#__PURE__*/jsx(ExternalAppLink, _objectSpread(_objectSpread({}, rest), {}, {
2436
2531
  appScheme: "sms",
@@ -2442,7 +2537,7 @@ ExternalAppLink.Sms = function (_ref3) {
2442
2537
  ExternalAppLink.Tel = function (_ref4) {
2443
2538
  var phoneNumber = _ref4.phoneNumber,
2444
2539
  children = _ref4.children,
2445
- rest = _objectWithoutProperties(_ref4, _excluded3$1);
2540
+ rest = _objectWithoutProperties(_ref4, _excluded3$2);
2446
2541
 
2447
2542
  return /*#__PURE__*/jsx(ExternalAppLink, _objectSpread(_objectSpread({}, rest), {}, {
2448
2543
  appScheme: "tel",
@@ -2454,7 +2549,7 @@ ExternalAppLink.Tel = function (_ref4) {
2454
2549
  ExternalAppLink.Mail = function (_ref5) {
2455
2550
  var emailAddress = _ref5.emailAddress,
2456
2551
  children = _ref5.children,
2457
- rest = _objectWithoutProperties(_ref5, _excluded4);
2552
+ rest = _objectWithoutProperties(_ref5, _excluded4$1);
2458
2553
 
2459
2554
  return /*#__PURE__*/jsx(ExternalAppLink, _objectSpread(_objectSpread({}, rest), {}, {
2460
2555
  appScheme: "mailto",
@@ -2468,14 +2563,14 @@ var defaultOpenLinkBehavior = {
2468
2563
  web: 'targetBlank'
2469
2564
  };
2470
2565
 
2471
- var _excluded$h = ["as", "href", "openLinkBehavior", "onPress"];
2566
+ var _excluded$j = ["as", "href", "openLinkBehavior", "onPress"];
2472
2567
  function ExternalLink(_ref) {
2473
2568
  var Component = _ref.as,
2474
2569
  href = _ref.href,
2475
2570
  _ref$openLinkBehavior = _ref.openLinkBehavior,
2476
2571
  openLinkBehavior = _ref$openLinkBehavior === void 0 ? defaultOpenLinkBehavior : _ref$openLinkBehavior,
2477
2572
  onPress = _ref.onPress,
2478
- rest = _objectWithoutProperties(_ref, _excluded$h);
2573
+ rest = _objectWithoutProperties(_ref, _excluded$j);
2479
2574
 
2480
2575
  return /*#__PURE__*/jsx(Component, _objectSpread(_objectSpread({}, rest), {}, {
2481
2576
  onPress: function handleOnPress(e) {
@@ -2510,71 +2605,6 @@ function ExternalLink(_ref) {
2510
2605
  }));
2511
2606
  }
2512
2607
 
2513
- var lateOceanColorPalette = {
2514
- lateOcean: '#4C34E0',
2515
- lateOceanLight1: '#705DE6',
2516
- lateOceanLight2: '#9485EC',
2517
- lateOceanLight3: '#D6BAF9',
2518
- warmEmbrace: '#F4D3CE',
2519
- warmEmbraceLight1: '#FFEDE6',
2520
- black1000: '#000000',
2521
- black800: '#333333',
2522
- black555: '#737373',
2523
- black400: '#999999',
2524
- black200: '#CCCCCC',
2525
- black100: '#E5E5E5',
2526
- black50: '#F2F2F2',
2527
- black25: '#F9F9F9',
2528
- white: '#FFFFFF',
2529
- viride: '#38836D',
2530
- englishVermillon: '#D44148',
2531
- goldCrayola: '#F8C583',
2532
- aero: '#89BDDD',
2533
- transparent: 'transparent',
2534
- moonPurple: '#DBD6F9',
2535
- moonPurpleLight1: '#EDEBFC'
2536
- };
2537
-
2538
- var colors = {
2539
- primary: lateOceanColorPalette.lateOcean,
2540
- primaryLight: lateOceanColorPalette.lateOceanLight1,
2541
- accent: lateOceanColorPalette.warmEmbrace,
2542
- accentLight: lateOceanColorPalette.warmEmbraceLight1,
2543
- success: lateOceanColorPalette.viride,
2544
- correct: lateOceanColorPalette.viride,
2545
- danger: lateOceanColorPalette.englishVermillon,
2546
- info: lateOceanColorPalette.aero,
2547
- warning: lateOceanColorPalette.goldCrayola,
2548
- separator: lateOceanColorPalette.black100,
2549
- hover: lateOceanColorPalette.black100,
2550
- white: lateOceanColorPalette.white,
2551
- black: lateOceanColorPalette.black1000,
2552
- blackDisabled: lateOceanColorPalette.black400,
2553
- blackLight: lateOceanColorPalette.black555,
2554
- blackAnthracite: lateOceanColorPalette.black800,
2555
- uiBackground: lateOceanColorPalette.black25,
2556
- uiBackgroundLight: lateOceanColorPalette.white,
2557
- transparent: lateOceanColorPalette.transparent,
2558
- disabled: lateOceanColorPalette.black50,
2559
- overlay: {
2560
- dark: 'rgba(41, 48, 51, 0.25)',
2561
- light: 'rgba(255, 255, 255, 0.90)'
2562
- }
2563
- };
2564
-
2565
- var avatar = {
2566
- borderRadius: 10,
2567
- "default": {
2568
- backgroundColor: colors.primary
2569
- },
2570
- light: {
2571
- backgroundColor: lateOceanColorPalette.black100
2572
- },
2573
- large: {
2574
- borderRadius: 30
2575
- }
2576
- };
2577
-
2578
2608
  var spacing = 4;
2579
2609
 
2580
2610
  var bottomSheet = {
@@ -3236,7 +3266,21 @@ var shadows = {
3236
3266
  var skeleton = {
3237
3267
  backgroundColor: lateOceanColorPalette.black100,
3238
3268
  flareColor: lateOceanColorPalette.black200,
3239
- animationDuration: 1000
3269
+ animationDuration: 1000,
3270
+ shape: {
3271
+ bar: {
3272
+ size: 8,
3273
+ borderRadius: 4
3274
+ },
3275
+ circle: {
3276
+ size: 48,
3277
+ borderRadius: 24
3278
+ },
3279
+ square: {
3280
+ size: 48,
3281
+ borderRadius: 6
3282
+ }
3283
+ }
3240
3284
  };
3241
3285
 
3242
3286
  var tag = {
@@ -3653,7 +3697,7 @@ function DatePickerInputs(_ref4) {
3653
3697
  });
3654
3698
  }
3655
3699
 
3656
- var _excluded$g = ["onBlur", "onFocus", "pickerDefaultDate", "pickerUITestID", "isDefaultVisible", "setIsFocused", "currentValue", "setCurrentValue", "onChange", "isFocused"];
3700
+ var _excluded$i = ["onBlur", "onFocus", "pickerDefaultDate", "pickerUITestID", "isDefaultVisible", "setIsFocused", "currentValue", "setCurrentValue", "onChange", "isFocused"];
3657
3701
  function DatePickerAndroid(_ref) {
3658
3702
  var onBlur = _ref.onBlur,
3659
3703
  onFocus = _ref.onFocus,
@@ -3665,7 +3709,7 @@ function DatePickerAndroid(_ref) {
3665
3709
  setCurrentValue = _ref.setCurrentValue,
3666
3710
  _onChange = _ref.onChange,
3667
3711
  isFocused = _ref.isFocused,
3668
- props = _objectWithoutProperties(_ref, _excluded$g);
3712
+ props = _objectWithoutProperties(_ref, _excluded$i);
3669
3713
 
3670
3714
  var handleClose = function () {
3671
3715
  if (onBlur) onBlur();
@@ -3738,11 +3782,11 @@ function ModalFooter(_ref3) {
3738
3782
  });
3739
3783
  }
3740
3784
 
3741
- var _excluded$f = ["as", "children"];
3785
+ var _excluded$h = ["as", "children"];
3742
3786
  function StyleWebWrapper(_ref) {
3743
3787
  var as = _ref.as,
3744
3788
  children = _ref.children,
3745
- props = _objectWithoutProperties(_ref, _excluded$f);
3789
+ props = _objectWithoutProperties(_ref, _excluded$h);
3746
3790
 
3747
3791
  if (Platform.OS !== 'web') return children;
3748
3792
  // as or default to div. If as is undefined, T is div but typescript is not sure
@@ -3755,7 +3799,7 @@ function PressableIconButtonWebWrapperWithTheme() {
3755
3799
  throw new Error('This component is not supposed to be called in native');
3756
3800
  }
3757
3801
 
3758
- var _excluded$e = ["color", "disabled"];
3802
+ var _excluded$g = ["color", "disabled"];
3759
3803
  var PressableIconButtonWebWrapper = /*#__PURE__*/withTheme$1(PressableIconButtonWebWrapperWithTheme);
3760
3804
  var StyledPressableIconButton = /*#__PURE__*/styled.Pressable.withConfig({
3761
3805
  displayName: "PressableIconButton__StyledPressableIconButton"
@@ -3788,7 +3832,7 @@ var StyledPressableIconButton = /*#__PURE__*/styled.Pressable.withConfig({
3788
3832
  function PressableIconButton(_ref5) {
3789
3833
  var color = _ref5.color,
3790
3834
  disabled = _ref5.disabled,
3791
- props = _objectWithoutProperties(_ref5, _excluded$e);
3835
+ props = _objectWithoutProperties(_ref5, _excluded$g);
3792
3836
 
3793
3837
  return /*#__PURE__*/jsx(StyleWebWrapper, {
3794
3838
  as: PressableIconButtonWebWrapper,
@@ -4103,7 +4147,7 @@ function PlatformDateTimePicker(_ref) {
4103
4147
  }));
4104
4148
  }
4105
4149
 
4106
- var _excluded$d = ["title", "isVisible", "value", "validateButtonLabel", "onClose", "onChange"];
4150
+ var _excluded$f = ["title", "isVisible", "value", "validateButtonLabel", "onClose", "onChange"];
4107
4151
 
4108
4152
  function ModalTitle(_ref) {
4109
4153
  var children = _ref.children;
@@ -4123,7 +4167,7 @@ function ModalPlatformDateTimePicker(_ref2) {
4123
4167
  validateButtonLabel = _ref2.validateButtonLabel,
4124
4168
  onClose = _ref2.onClose,
4125
4169
  onChange = _ref2.onChange,
4126
- props = _objectWithoutProperties(_ref2, _excluded$d);
4170
+ props = _objectWithoutProperties(_ref2, _excluded$f);
4127
4171
 
4128
4172
  var _useState = useState(value),
4129
4173
  _useState2 = _slicedToArray(_useState, 2),
@@ -4167,7 +4211,7 @@ function ModalPlatformDateTimePicker(_ref2) {
4167
4211
  });
4168
4212
  }
4169
4213
 
4170
- var _excluded$c = ["value", "pickerUITestID", "pickerUITitle", "pickerUIValidateButtonLabel", "isDefaultVisible", "onChange", "onFocus", "onBlur", "pickerDefaultDate"];
4214
+ var _excluded$e = ["value", "pickerUITestID", "pickerUITitle", "pickerUIValidateButtonLabel", "isDefaultVisible", "onChange", "onFocus", "onBlur", "pickerDefaultDate"];
4171
4215
  function DatePicker(_ref) {
4172
4216
  var value = _ref.value,
4173
4217
  pickerUITestID = _ref.pickerUITestID,
@@ -4178,7 +4222,7 @@ function DatePicker(_ref) {
4178
4222
  onFocus = _ref.onFocus,
4179
4223
  onBlur = _ref.onBlur,
4180
4224
  pickerDefaultDate = _ref.pickerDefaultDate,
4181
- props = _objectWithoutProperties(_ref, _excluded$c);
4225
+ props = _objectWithoutProperties(_ref, _excluded$e);
4182
4226
 
4183
4227
  var _useState = useState(isDefaultVisible),
4184
4228
  _useState2 = _slicedToArray(_useState, 2),
@@ -4245,7 +4289,7 @@ var InputTextContainer = /*#__PURE__*/styled.View.withConfig({
4245
4289
  displayName: "InputTextContainer"
4246
4290
  })(["position:relative;"]);
4247
4291
 
4248
- var _excluded$b = ["id", "right", "state", "variant", "internalForceState", "disabled", "autoCorrect", "textContentType", "autoComplete", "keyboardType", "multiline", "onSubmitEditing"];
4292
+ var _excluded$d = ["id", "right", "state", "variant", "internalForceState", "disabled", "autoCorrect", "textContentType", "autoComplete", "keyboardType", "multiline", "onSubmitEditing"];
4249
4293
  var InputText = /*#__PURE__*/forwardRef(function (_ref, ref) {
4250
4294
  var id = _ref.id,
4251
4295
  right = _ref.right;
@@ -4265,7 +4309,7 @@ var InputText = /*#__PURE__*/forwardRef(function (_ref, ref) {
4265
4309
  keyboardType = _ref$keyboardType === void 0 ? 'default' : _ref$keyboardType,
4266
4310
  multiline = _ref.multiline,
4267
4311
  onSubmitEditing = _ref.onSubmitEditing,
4268
- props = _objectWithoutProperties(_ref, _excluded$b);
4312
+ props = _objectWithoutProperties(_ref, _excluded$d);
4269
4313
 
4270
4314
  var theme = /*#__PURE__*/useTheme();
4271
4315
  var fontSizeForNativeBase = createNativeBaseFontSize({
@@ -4399,11 +4443,11 @@ function InputPressable(_ref) {
4399
4443
  return /*#__PURE__*/jsx(Pressable$2, _objectSpread({}, props));
4400
4444
  }
4401
4445
 
4402
- var _excluded$a = ["isPasswordDefaultVisible", "right"];
4446
+ var _excluded$c = ["isPasswordDefaultVisible", "right"];
4403
4447
  function InputPassword(_ref) {
4404
4448
  var isPasswordDefaultVisible = _ref.isPasswordDefaultVisible,
4405
4449
  right = _ref.right,
4406
- props = _objectWithoutProperties(_ref, _excluded$a);
4450
+ props = _objectWithoutProperties(_ref, _excluded$c);
4407
4451
 
4408
4452
  var _useState = useState(Boolean(isPasswordDefaultVisible)),
4409
4453
  _useState2 = _slicedToArray(_useState, 2),
@@ -4847,7 +4891,7 @@ function RadioButton(_ref) {
4847
4891
  });
4848
4892
  }
4849
4893
 
4850
- var _excluded$9 = ["children", "stretch", "value", "disabled", "onFocus", "onBlur", "onChange"];
4894
+ var _excluded$b = ["children", "stretch", "value", "disabled", "onFocus", "onBlur", "onChange"];
4851
4895
 
4852
4896
  function RadioButtonGroupItem(_ref) {
4853
4897
  var props = _extends({}, _ref);
@@ -4863,7 +4907,7 @@ function RadioButtonGroup(_ref2) {
4863
4907
  onFocus = _ref2.onFocus,
4864
4908
  onBlur = _ref2.onBlur,
4865
4909
  onChange = _ref2.onChange,
4866
- props = _objectWithoutProperties(_ref2, _excluded$9);
4910
+ props = _objectWithoutProperties(_ref2, _excluded$b);
4867
4911
 
4868
4912
  var _useState = useState(value),
4869
4913
  _useState2 = _slicedToArray(_useState, 2),
@@ -4925,21 +4969,48 @@ function Highlight(_ref) {
4925
4969
  });
4926
4970
  }
4927
4971
 
4928
- var _excluded$8 = ["children"];
4972
+ var KittMapConfigProviderContext = /*#__PURE__*/createContext(undefined);
4973
+ function KittMapConfigProvider(_ref) {
4974
+ var children = _ref.children,
4975
+ mapId = _ref.mapId,
4976
+ apiToken = _ref.apiToken;
4977
+ var providerValue = useMemo(function () {
4978
+ return {
4979
+ mapId: mapId,
4980
+ apiToken: apiToken
4981
+ };
4982
+ }, [mapId, apiToken]);
4983
+ return /*#__PURE__*/jsx(KittMapConfigProviderContext.Provider, {
4984
+ value: providerValue,
4985
+ children: children
4986
+ });
4987
+ }
4988
+
4989
+ function useKittMapConfig() {
4990
+ var context = useContext(KittMapConfigProviderContext);
4991
+
4992
+ if (!context) {
4993
+ throw new Error('<KittMapConfigProvider> missing in the react tree');
4994
+ }
4995
+
4996
+ return context;
4997
+ }
4998
+
4999
+ var _excluded$a = ["children"];
4929
5000
  var ContentView = /*#__PURE__*/styled.View.withConfig({
4930
5001
  displayName: "ListItemContent__ContentView"
4931
5002
  })(["flex:1 0 0%;align-self:center;"]);
4932
5003
  function ListItemContent(_ref) {
4933
5004
  var children = _ref.children,
4934
- rest = _objectWithoutProperties(_ref, _excluded$8);
5005
+ rest = _objectWithoutProperties(_ref, _excluded$a);
4935
5006
 
4936
5007
  return /*#__PURE__*/jsx(ContentView, _objectSpread(_objectSpread({}, rest), {}, {
4937
5008
  children: children
4938
5009
  }));
4939
5010
  }
4940
5011
 
4941
- var _excluded$7 = ["children", "side"],
4942
- _excluded2$1 = ["children", "align"];
5012
+ var _excluded$9 = ["children", "side"],
5013
+ _excluded2$2 = ["children", "align"];
4943
5014
  var SideContainerView = /*#__PURE__*/styled.View.withConfig({
4944
5015
  displayName: "ListItemSideContent__SideContainerView"
4945
5016
  })(["flex-direction:row;margin-left:", ";margin-right:", ";"], function (_ref) {
@@ -4956,7 +5027,7 @@ function ListItemSideContainer(_ref3) {
4956
5027
  var children = _ref3.children,
4957
5028
  _ref3$side = _ref3.side,
4958
5029
  side = _ref3$side === void 0 ? 'left' : _ref3$side,
4959
- rest = _objectWithoutProperties(_ref3, _excluded$7);
5030
+ rest = _objectWithoutProperties(_ref3, _excluded$9);
4960
5031
 
4961
5032
  return /*#__PURE__*/jsx(SideContainerView, _objectSpread(_objectSpread({
4962
5033
  side: side
@@ -4974,7 +5045,7 @@ function ListItemSideContent(_ref5) {
4974
5045
  var children = _ref5.children,
4975
5046
  _ref5$align = _ref5.align,
4976
5047
  align = _ref5$align === void 0 ? 'auto' : _ref5$align,
4977
- rest = _objectWithoutProperties(_ref5, _excluded2$1);
5048
+ rest = _objectWithoutProperties(_ref5, _excluded2$2);
4978
5049
 
4979
5050
  return /*#__PURE__*/jsx(SideContentView, _objectSpread(_objectSpread({
4980
5051
  align: align
@@ -4983,7 +5054,7 @@ function ListItemSideContent(_ref5) {
4983
5054
  }));
4984
5055
  }
4985
5056
 
4986
- var _excluded$6 = ["children", "withPadding", "borders", "left", "right", "onPress"];
5057
+ var _excluded$8 = ["children", "withPadding", "borders", "left", "right", "onPress"];
4987
5058
  var ContainerView = /*#__PURE__*/styled.View.withConfig({
4988
5059
  displayName: "ListItem__ContainerView"
4989
5060
  })(["flex-direction:row;padding:", ";", ";border-color:", ";background-color:", ";"], function (_ref) {
@@ -5022,7 +5093,7 @@ function ListItem(_ref5) {
5022
5093
  left = _ref5.left,
5023
5094
  right = _ref5.right,
5024
5095
  onPress = _ref5.onPress,
5025
- rest = _objectWithoutProperties(_ref5, _excluded$6);
5096
+ rest = _objectWithoutProperties(_ref5, _excluded$8);
5026
5097
 
5027
5098
  var Wrapper = onPress ? Pressable$2 : Fragment$1;
5028
5099
  var wrapperProps = onPress ? _objectSpread({
@@ -5051,6 +5122,231 @@ ListItem.Content = ListItemContent;
5051
5122
  ListItem.SideContent = ListItemSideContent;
5052
5123
  ListItem.SideContainer = ListItemSideContainer;
5053
5124
 
5125
+ var SvgMarkerLargeinline = function SvgMarkerLargeinline(props) {
5126
+ return /*#__PURE__*/jsxs("svg", _objectSpread(_objectSpread({
5127
+ fill: "none",
5128
+ viewBox: "0 0 54 56",
5129
+ width: 54,
5130
+ xmlns: "http://www.w3.org/2000/svg"
5131
+ }, props), {}, {
5132
+ children: [/*#__PURE__*/jsxs("linearGradient", {
5133
+ id: "marker-large_inline_svg__b",
5134
+ gradientUnits: "userSpaceOnUse",
5135
+ x1: 26.828,
5136
+ x2: 7.181,
5137
+ y1: 5.072,
5138
+ y2: 39.102,
5139
+ children: [/*#__PURE__*/jsx("stop", {
5140
+ offset: 0,
5141
+ stopOpacity: 0.01
5142
+ }), /*#__PURE__*/jsx("stop", {
5143
+ offset: 1
5144
+ })]
5145
+ }), /*#__PURE__*/jsxs("filter", {
5146
+ id: "marker-large_inline_svg__a",
5147
+ colorInterpolationFilters: "sRGB",
5148
+ filterUnits: "userSpaceOnUse",
5149
+ height: 48.706,
5150
+ width: 42.761,
5151
+ x: 10.437,
5152
+ y: 5.167,
5153
+ children: [/*#__PURE__*/jsx("feFlood", {
5154
+ floodOpacity: 0,
5155
+ result: "BackgroundImageFix"
5156
+ }), /*#__PURE__*/jsx("feBlend", {
5157
+ "in": "SourceGraphic",
5158
+ in2: "BackgroundImageFix",
5159
+ result: "shape"
5160
+ }), /*#__PURE__*/jsx("feGaussianBlur", {
5161
+ result: "effect1_foregroundBlur_257_3018",
5162
+ stdDeviation: 2.718
5163
+ })]
5164
+ }), /*#__PURE__*/jsx("mask", {
5165
+ id: "marker-large_inline_svg__c",
5166
+ height: 43,
5167
+ maskUnits: "userSpaceOnUse",
5168
+ width: 31,
5169
+ x: 3,
5170
+ y: 3,
5171
+ children: /*#__PURE__*/jsx("path", {
5172
+ d: "M16.303 44.99a3.002 3.002 0 004.394 0C29.631 35.38 34 26.678 34 18.938 34 10.12 27.04 3 18.5 3S3 10.12 3 18.938c0 7.74 4.369 16.442 13.303 26.052z",
5173
+ fill: "#fff"
5174
+ })
5175
+ }), /*#__PURE__*/jsx("g", {
5176
+ filter: "url(#marker-large_inline_svg__a)",
5177
+ opacity: 0.25,
5178
+ children: /*#__PURE__*/jsx("path", {
5179
+ d: "M24.022 48.149c-3.018 1.02-6.128-.775-6.753-3.899-1.372-6.862-2.799-18.548 1.348-25.73C22.966 10.985 32.545 8.374 40 12.678c7.454 4.303 9.982 13.903 5.63 21.44-4.146 7.182-14.98 11.79-21.608 14.032z",
5180
+ fill: "url(#marker-large_inline_svg__b)"
5181
+ })
5182
+ }), /*#__PURE__*/jsx("g", {
5183
+ mask: "url(#marker-large_inline_svg__c)",
5184
+ children: /*#__PURE__*/jsx("path", {
5185
+ d: "M3 3h31v43H3z",
5186
+ fill: "#4c34e0"
5187
+ })
5188
+ }), /*#__PURE__*/jsx("path", {
5189
+ d: "M15.677 46.315c-2.682-3.029-6.253-7.443-9.145-12.356C3.622 29.015 1.5 23.735 1.5 18.938 1.5 9.27 9.152 1.5 18.5 1.5c9.349 0 17 7.771 17 17.438 0 4.797-2.122 10.077-5.032 15.02-2.892 4.914-6.463 9.328-9.145 12.357-1.536 1.735-4.11 1.735-5.646 0z",
5190
+ stroke: "#fff",
5191
+ strokeWidth: 3
5192
+ })]
5193
+ }));
5194
+ };
5195
+
5196
+ var SvgMarkerinline = function SvgMarkerinline(props) {
5197
+ return /*#__PURE__*/jsxs("svg", _objectSpread(_objectSpread({
5198
+ viewBox: "0 0 40 39",
5199
+ fill: "none",
5200
+ xmlns: "http://www.w3.org/2000/svg"
5201
+ }, props), {}, {
5202
+ children: [/*#__PURE__*/jsx("path", {
5203
+ d: "M16.417 33.38c-2.3.776-4.668-.592-5.146-2.971-1.059-5.274-2.171-14.297 1.027-19.837 3.348-5.798 10.717-7.806 16.452-4.495 5.735 3.31 7.68 10.697 4.333 16.495-3.198 5.54-11.57 9.088-16.666 10.808z",
5204
+ fill: "url(#marker_inline_svg__a)",
5205
+ opacity: 0.25,
5206
+ filter: "url(#marker_inline_svg__b)"
5207
+ }), /*#__PURE__*/jsx("path", {
5208
+ d: "M10.89 29.536a2.81 2.81 0 004.22 0C20.428 23.492 23 18.054 23 13.256 23 7.58 18.507 3 13 3S3 7.58 3 13.256c0 4.798 2.572 10.236 7.89 16.28z",
5209
+ fill: "#4C34E0"
5210
+ }), /*#__PURE__*/jsx("mask", {
5211
+ id: "marker_inline_svg__c",
5212
+ style: {
5213
+ maskType: "alpha"
5214
+ },
5215
+ maskUnits: "userSpaceOnUse",
5216
+ x: 3,
5217
+ y: 3,
5218
+ width: 20,
5219
+ height: 28,
5220
+ children: /*#__PURE__*/jsx("path", {
5221
+ d: "M10.89 29.536a2.81 2.81 0 004.22 0C20.428 23.492 23 18.054 23 13.256 23 7.58 18.507 3 13 3S3 7.58 3 13.256c0 4.798 2.572 10.236 7.89 16.28z",
5222
+ fill: "#fff"
5223
+ })
5224
+ }), /*#__PURE__*/jsx("g", {
5225
+ mask: "url(#marker_inline_svg__c)",
5226
+ children: /*#__PURE__*/jsx("path", {
5227
+ fill: "#4C34E0",
5228
+ d: "M3 3h20v27H3z"
5229
+ })
5230
+ }), /*#__PURE__*/jsx("path", {
5231
+ d: "M10.374 31c-1.884-2.216-4.125-5.144-5.888-8.307C2.71 19.505 1.5 16.22 1.5 13.256 1.5 6.734 6.681 1.5 13 1.5s11.5 5.234 11.5 11.756c0 2.964-1.21 6.249-2.986 9.437-1.763 3.163-4.004 6.091-5.888 8.307-1.414 1.662-3.838 1.662-5.252 0z",
5232
+ stroke: "#fff",
5233
+ strokeWidth: 3
5234
+ }), /*#__PURE__*/jsxs("defs", {
5235
+ children: [/*#__PURE__*/jsxs("linearGradient", {
5236
+ id: "marker_inline_svg__a",
5237
+ x1: 18.616,
5238
+ y1: 0.226,
5239
+ x2: 3.501,
5240
+ y2: 26.405,
5241
+ gradientUnits: "userSpaceOnUse",
5242
+ children: [/*#__PURE__*/jsx("stop", {
5243
+ stopOpacity: 0.01
5244
+ }), /*#__PURE__*/jsx("stop", {
5245
+ offset: 1
5246
+ })]
5247
+ }), /*#__PURE__*/jsxs("filter", {
5248
+ id: "marker_inline_svg__b",
5249
+ x: 6.046,
5250
+ y: 0.339,
5251
+ width: 32.817,
5252
+ height: 37.4,
5253
+ filterUnits: "userSpaceOnUse",
5254
+ colorInterpolationFilters: "sRGB",
5255
+ children: [/*#__PURE__*/jsx("feFlood", {
5256
+ floodOpacity: 0,
5257
+ result: "BackgroundImageFix"
5258
+ }), /*#__PURE__*/jsx("feBlend", {
5259
+ "in": "SourceGraphic",
5260
+ in2: "BackgroundImageFix",
5261
+ result: "shape"
5262
+ }), /*#__PURE__*/jsx("feGaussianBlur", {
5263
+ stdDeviation: 2.071,
5264
+ result: "effect1_foregroundBlur_257_3020"
5265
+ })]
5266
+ })]
5267
+ })]
5268
+ }));
5269
+ };
5270
+
5271
+ var SvgPositionMarkerinline = function SvgPositionMarkerinline(props) {
5272
+ return /*#__PURE__*/jsxs("svg", _objectSpread(_objectSpread({
5273
+ viewBox: "0 0 47 47",
5274
+ fill: "none",
5275
+ xmlns: "http://www.w3.org/2000/svg"
5276
+ }, props), {}, {
5277
+ children: [/*#__PURE__*/jsx("path", {
5278
+ fillRule: "evenodd",
5279
+ clipRule: "evenodd",
5280
+ d: "M23.5 36C30.404 36 36 30.404 36 23.5S30.404 11 23.5 11 11 16.596 11 23.5 16.596 36 23.5 36z",
5281
+ fill: "#38836D",
5282
+ opacity: 0.8,
5283
+ filter: "url(#position-marker_inline_svg__a)"
5284
+ }), /*#__PURE__*/jsx("path", {
5285
+ d: "M31 18.5a7.5 7.5 0 11-15 0 7.5 7.5 0 0115 0z",
5286
+ fill: "#fff",
5287
+ stroke: "#38836D",
5288
+ strokeWidth: 10
5289
+ }), /*#__PURE__*/jsx("circle", {
5290
+ cx: 23.5,
5291
+ cy: 18.5,
5292
+ r: 2.5,
5293
+ fill: "#fff"
5294
+ }), /*#__PURE__*/jsx("defs", {
5295
+ children: /*#__PURE__*/jsxs("filter", {
5296
+ id: "position-marker_inline_svg__a",
5297
+ x: 0.127,
5298
+ y: 0.127,
5299
+ width: 46.746,
5300
+ height: 46.746,
5301
+ filterUnits: "userSpaceOnUse",
5302
+ colorInterpolationFilters: "sRGB",
5303
+ children: [/*#__PURE__*/jsx("feFlood", {
5304
+ floodOpacity: 0,
5305
+ result: "BackgroundImageFix"
5306
+ }), /*#__PURE__*/jsx("feBlend", {
5307
+ "in": "SourceGraphic",
5308
+ in2: "BackgroundImageFix",
5309
+ result: "shape"
5310
+ }), /*#__PURE__*/jsx("feGaussianBlur", {
5311
+ stdDeviation: 5.437,
5312
+ result: "effect1_foregroundBlur_257_3019"
5313
+ })]
5314
+ })
5315
+ })]
5316
+ }));
5317
+ };
5318
+
5319
+ function MapMarkerSimple(_ref) {
5320
+ var _ref$width = _ref.width,
5321
+ width = _ref$width === void 0 ? 40 : _ref$width,
5322
+ _ref$height = _ref.height,
5323
+ height = _ref$height === void 0 ? 39 : _ref$height;
5324
+ return /*#__PURE__*/jsx(SvgMarkerinline, {
5325
+ width: width,
5326
+ height: height
5327
+ });
5328
+ }
5329
+ function MapMarkerLarge(_ref2) {
5330
+ var _ref2$width = _ref2.width,
5331
+ width = _ref2$width === void 0 ? 54 : _ref2$width,
5332
+ _ref2$height = _ref2.height,
5333
+ height = _ref2$height === void 0 ? 56 : _ref2$height;
5334
+ return /*#__PURE__*/jsx(SvgMarkerLargeinline, {
5335
+ width: width,
5336
+ height: height
5337
+ });
5338
+ }
5339
+ function MapMarkerPosition(_ref3) {
5340
+ var _ref3$width = _ref3.width,
5341
+ width = _ref3$width === void 0 ? 47 : _ref3$width,
5342
+ _ref3$height = _ref3.height,
5343
+ height = _ref3$height === void 0 ? 47 : _ref3$height;
5344
+ return /*#__PURE__*/jsx(SvgPositionMarkerinline, {
5345
+ width: width,
5346
+ height: height
5347
+ });
5348
+ }
5349
+
5054
5350
  function IconContent(_ref) {
5055
5351
  var type = _ref.type,
5056
5352
  color = _ref.color;
@@ -5223,6 +5519,14 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
5223
5519
  var extendedTheme = extendTheme({
5224
5520
  colors: {
5225
5521
  kitt: _objectSpread(_objectSpread({}, theme.colors), {}, {
5522
+ avatar: {
5523
+ "default": {
5524
+ backgroundColor: theme.colors.primary
5525
+ },
5526
+ light: {
5527
+ backgroundColor: theme.palettes.lateOcean.black100
5528
+ }
5529
+ },
5226
5530
  button: {
5227
5531
  "default": theme.button["default"],
5228
5532
  primary: theme.button.primary,
@@ -5242,13 +5546,30 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
5242
5546
  borderColor: theme.forms.radioButtonGroup.item.borderColor,
5243
5547
  backgroundColor: theme.forms.radioButtonGroup.item.backgroundColor
5244
5548
  }
5549
+ },
5550
+ skeleton: {
5551
+ backgroundColor: theme.skeleton.backgroundColor,
5552
+ flareColor: theme.skeleton.flareColor
5245
5553
  }
5246
5554
  }
5247
5555
  }),
5248
5556
  app: appTheme === null || appTheme === void 0 ? void 0 : appTheme.colors
5249
5557
  },
5250
- radii: {
5558
+ radii: _objectSpread(_objectSpread({
5559
+ // Make original native base values unsusable
5560
+ lg: Number.MAX_SAFE_INTEGER,
5561
+ md: Number.MAX_SAFE_INTEGER,
5562
+ sm: Number.MAX_SAFE_INTEGER,
5563
+ xl: Number.MAX_SAFE_INTEGER,
5564
+ xs: Number.MAX_SAFE_INTEGER
5565
+ }, spaces), {}, {
5251
5566
  kitt: {
5567
+ avatar: {
5568
+ borderRadius: theme.avatar.borderRadius,
5569
+ large: {
5570
+ borderRadius: theme.avatar.large.borderRadius
5571
+ }
5572
+ },
5252
5573
  borderRadius: theme.card.borderRadius,
5253
5574
  button: {
5254
5575
  borderRadius: theme.button.borderRadius
@@ -5271,10 +5592,23 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
5271
5592
  },
5272
5593
  tooltip: {
5273
5594
  borderRadius: theme.tooltip.borderRadius
5595
+ },
5596
+ skeleton: {
5597
+ shape: {
5598
+ bar: {
5599
+ borderRadius: theme.skeleton.shape.bar.borderRadius
5600
+ },
5601
+ circle: {
5602
+ borderRadius: theme.skeleton.shape.circle.borderRadius
5603
+ },
5604
+ square: {
5605
+ borderRadius: theme.skeleton.shape.square.borderRadius
5606
+ }
5607
+ }
5274
5608
  }
5275
5609
  },
5276
5610
  app: appTheme === null || appTheme === void 0 ? void 0 : appTheme.radii
5277
- },
5611
+ }),
5278
5612
  borderWidths: {
5279
5613
  kitt: {
5280
5614
  button: {
@@ -5300,6 +5634,14 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
5300
5634
  },
5301
5635
  sizes: _objectSpread(_objectSpread(_objectSpread({}, spaces), overridenNativeBaseSizeandSpaceScale), {}, {
5302
5636
  kitt: {
5637
+ avatar: {
5638
+ size: theme.avatar.size,
5639
+ iconSize: theme.avatar.iconSize,
5640
+ large: {
5641
+ size: theme.avatar.large.size,
5642
+ iconSize: theme.avatar.large.iconSize
5643
+ }
5644
+ },
5303
5645
  button: {
5304
5646
  minWidth: theme.button.minWidth,
5305
5647
  maxWidth: theme.button.maxWidth,
@@ -5331,6 +5673,19 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
5331
5673
  width: theme.tooltip.arrow.width,
5332
5674
  height: theme.tooltip.arrow.height
5333
5675
  }
5676
+ },
5677
+ skeleton: {
5678
+ shape: {
5679
+ bar: {
5680
+ size: theme.skeleton.shape.bar.size
5681
+ },
5682
+ circle: {
5683
+ size: theme.skeleton.shape.circle.size
5684
+ },
5685
+ square: {
5686
+ size: theme.skeleton.shape.square.size
5687
+ }
5688
+ }
5334
5689
  }
5335
5690
  },
5336
5691
  app: appTheme === null || appTheme === void 0 ? void 0 : appTheme.sizes
@@ -5603,7 +5958,7 @@ function KittNativeBaseProvider(_ref) {
5603
5958
  });
5604
5959
  }
5605
5960
 
5606
- var _excluded$5 = ["children"];
5961
+ var _excluded$7 = ["children"];
5607
5962
  var ViewWithPadding = /*#__PURE__*/styled(View$2).withConfig({
5608
5963
  displayName: "ContentPadding__ViewWithPadding"
5609
5964
  })(["padding:", ";"], function (_ref) {
@@ -5612,14 +5967,14 @@ var ViewWithPadding = /*#__PURE__*/styled(View$2).withConfig({
5612
5967
  });
5613
5968
  function ContentPadding(_ref2) {
5614
5969
  var children = _ref2.children,
5615
- props = _objectWithoutProperties(_ref2, _excluded$5);
5970
+ props = _objectWithoutProperties(_ref2, _excluded$7);
5616
5971
 
5617
5972
  return /*#__PURE__*/jsx(ViewWithPadding, _objectSpread(_objectSpread({}, props), {}, {
5618
5973
  children: children
5619
5974
  }));
5620
5975
  }
5621
5976
 
5622
- var _excluded$4 = ["children", "shouldHandleBottomNotch", "style"];
5977
+ var _excluded$6 = ["children", "shouldHandleBottomNotch", "style"];
5623
5978
  var StyledViewWithPadding = /*#__PURE__*/styled(ContentPadding).withConfig({
5624
5979
  displayName: "Body__StyledViewWithPadding"
5625
5980
  })(["padding-top:", "px;padding-bottom:", "px;"], function (_ref) {
@@ -5634,7 +5989,7 @@ function Body(_ref3) {
5634
5989
  var children = _ref3.children,
5635
5990
  shouldHandleBottomNotch = _ref3.shouldHandleBottomNotch,
5636
5991
  style = _ref3.style,
5637
- props = _objectWithoutProperties(_ref3, _excluded$4);
5992
+ props = _objectWithoutProperties(_ref3, _excluded$6);
5638
5993
 
5639
5994
  var _useSafeAreaInsets = useSafeAreaInsets(),
5640
5995
  bottom = _useSafeAreaInsets.bottom;
@@ -5995,13 +6350,13 @@ function NavigationModalAnimation(_ref) {
5995
6350
  });
5996
6351
  }
5997
6352
 
5998
- var _excluded$3 = ["children", "visible", "onClose", "onExited"];
6353
+ var _excluded$5 = ["children", "visible", "onClose", "onExited"];
5999
6354
  function NavigationModalBehaviour(_ref) {
6000
6355
  var children = _ref.children,
6001
6356
  visible = _ref.visible,
6002
6357
  onClose = _ref.onClose,
6003
6358
  onExited = _ref.onExited,
6004
- props = _objectWithoutProperties(_ref, _excluded$3);
6359
+ props = _objectWithoutProperties(_ref, _excluded$5);
6005
6360
 
6006
6361
  var _useState = useState(visible),
6007
6362
  _useState2 = _slicedToArray(_useState, 2),
@@ -6420,19 +6775,23 @@ function SkeletonContent(_ref3) {
6420
6775
  });
6421
6776
  }
6422
6777
 
6423
- var SkeletonContainer = /*#__PURE__*/styled(View$2).withConfig({
6424
- displayName: "Skeleton__SkeletonContainer"
6425
- })(["overflow:hidden;"]);
6778
+ var _excluded$4 = ["isLoading", "style"],
6779
+ _excluded2$1 = ["size"],
6780
+ _excluded3$1 = ["size"],
6781
+ _excluded4 = ["size"];
6426
6782
  function Skeleton(_ref) {
6427
- var isLoading = _ref.isLoading,
6428
- style = _ref.style;
6783
+ var _ref$isLoading = _ref.isLoading,
6784
+ isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
6785
+ style = _ref.style,
6786
+ props = _objectWithoutProperties(_ref, _excluded$4);
6429
6787
 
6430
6788
  var _useState = useState(0),
6431
6789
  _useState2 = _slicedToArray(_useState, 2),
6432
6790
  width = _useState2[0],
6433
6791
  setWidth = _useState2[1];
6434
6792
 
6435
- return /*#__PURE__*/jsx(SkeletonContainer, {
6793
+ return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
6794
+ overflow: "hidden",
6436
6795
  style: style,
6437
6796
  onLayout: function onLayout(_ref2) {
6438
6797
  var nativeEvent = _ref2.nativeEvent;
@@ -6442,45 +6801,306 @@ function Skeleton(_ref) {
6442
6801
  isLoading: isLoading,
6443
6802
  width: width
6444
6803
  })
6445
- });
6804
+ }));
6446
6805
  }
6447
- var Bar = /*#__PURE__*/styled(Skeleton).withConfig({
6448
- displayName: "Skeleton__Bar"
6449
- })(["width:100%;height:", "px;border-radius:", "px;"], function (_ref3) {
6450
- var theme = _ref3.theme;
6451
- return theme.kitt.spacing * 2;
6452
- }, function (_ref4) {
6453
- var theme = _ref4.theme;
6454
- return theme.kitt.spacing * 2;
6455
- });
6456
- var Circle = /*#__PURE__*/styled(Skeleton).withConfig({
6457
- displayName: "Skeleton__Circle"
6458
- })(["width:", "px;height:", "px;border-radius:", "px;"], function (_ref5) {
6459
- var theme = _ref5.theme;
6460
- return theme.kitt.spacing * 12;
6461
- }, function (_ref6) {
6462
- var theme = _ref6.theme;
6463
- return theme.kitt.spacing * 12;
6464
- }, function (_ref7) {
6465
- var theme = _ref7.theme;
6466
- return theme.kitt.spacing * 6;
6467
- });
6468
- var Square = /*#__PURE__*/styled(Skeleton).withConfig({
6469
- displayName: "Skeleton__Square"
6470
- })(["width:", "px;height:", "px;border-radius:", "px;"], function (_ref8) {
6471
- var theme = _ref8.theme;
6472
- return theme.kitt.spacing * 12;
6473
- }, function (_ref9) {
6474
- var theme = _ref9.theme;
6475
- return theme.kitt.spacing * 12;
6476
- }, function (_ref10) {
6477
- var theme = _ref10.theme;
6478
- return theme.kitt.spacing * 1.5;
6479
- });
6806
+
6807
+ function Bar(_ref3) {
6808
+ var size = _ref3.size,
6809
+ props = _objectWithoutProperties(_ref3, _excluded2$1);
6810
+
6811
+ var currentBorderRadius = size ? size * 0.5 : 'kitt.skeleton.shape.bar.borderRadius';
6812
+ return /*#__PURE__*/jsx(Skeleton, _objectSpread(_objectSpread({}, props), {}, {
6813
+ width: "100%",
6814
+ height: size || 'kitt.skeleton.shape.bar.size',
6815
+ borderRadius: currentBorderRadius
6816
+ }));
6817
+ }
6818
+
6819
+ function Circle(_ref4) {
6820
+ var size = _ref4.size,
6821
+ props = _objectWithoutProperties(_ref4, _excluded3$1);
6822
+
6823
+ var currentSize = size || 'kitt.skeleton.shape.circle.size';
6824
+ var currentBorderRadius = size ? size * 0.5 : 'kitt.skeleton.shape.circle.borderRadius';
6825
+ return /*#__PURE__*/jsx(Skeleton, _objectSpread(_objectSpread({}, props), {}, {
6826
+ width: currentSize,
6827
+ height: currentSize,
6828
+ borderRadius: currentBorderRadius
6829
+ }));
6830
+ }
6831
+
6832
+ function Square(_ref5) {
6833
+ var size = _ref5.size,
6834
+ props = _objectWithoutProperties(_ref5, _excluded4);
6835
+
6836
+ var currentSize = size || 'kitt.skeleton.shape.square.size';
6837
+ var currentBorderRadius = size ? size * 0.5 : 'kitt.skeleton.shape.square.borderRadius';
6838
+ return /*#__PURE__*/jsx(Skeleton, _objectSpread(_objectSpread({}, props), {}, {
6839
+ width: currentSize,
6840
+ height: currentSize,
6841
+ borderRadius: currentBorderRadius
6842
+ }));
6843
+ }
6844
+
6480
6845
  Skeleton.Bar = Bar;
6481
6846
  Skeleton.Circle = Circle;
6482
6847
  Skeleton.Square = Square;
6483
6848
 
6849
+ function getStaticMapImageUrl(_ref) {
6850
+ var mapId = _ref.mapId,
6851
+ apiToken = _ref.apiToken,
6852
+ mapWidth = _ref.mapWidth,
6853
+ mapHeight = _ref.mapHeight,
6854
+ center = _ref.center,
6855
+ is2x = _ref.is2x;
6856
+ var width = Math.round(mapWidth);
6857
+ var height = Math.round(mapHeight);
6858
+ var centerPart = "".concat(center["long"], ",").concat(center.lat, ",").concat(center.zoom, "/");
6859
+ var sizePart = "".concat(width, "x").concat(height);
6860
+ var urlParts = ["https://api.mapbox.com/styles/v1/ornikar/".concat(mapId, "/static/"), centerPart, sizePart, is2x ? '@2x' : ''];
6861
+ var mapImageUrl = new URL(urlParts.join(''));
6862
+ mapImageUrl.searchParams.append('access_token', apiToken);
6863
+ return mapImageUrl.toString();
6864
+ }
6865
+
6866
+ function useGetStaticMapImageUrl(_ref) {
6867
+ var forceMapId = _ref.forceMapId,
6868
+ forceApiToken = _ref.forceApiToken,
6869
+ mapWidth = _ref.mapWidth,
6870
+ mapHeight = _ref.mapHeight,
6871
+ center = _ref.center,
6872
+ is2x = _ref.is2x;
6873
+
6874
+ var _useKittMapConfig = useKittMapConfig(),
6875
+ mapId = _useKittMapConfig.mapId,
6876
+ apiToken = _useKittMapConfig.apiToken;
6877
+
6878
+ var _useState = useState(''),
6879
+ _useState2 = _slicedToArray(_useState, 2),
6880
+ currentUrl = _useState2[0],
6881
+ setCurrentUrl = _useState2[1];
6882
+
6883
+ var currentMapIdRef = useRef(forceMapId || mapId);
6884
+ var currentApiTokenRef = useRef(forceApiToken || apiToken);
6885
+ useEffect(function () {
6886
+ var newUrl = getStaticMapImageUrl({
6887
+ center: center,
6888
+ is2x: is2x,
6889
+ mapHeight: mapHeight,
6890
+ mapWidth: mapWidth,
6891
+ mapId: currentMapIdRef.current,
6892
+ apiToken: currentApiTokenRef.current
6893
+ });
6894
+ setCurrentUrl(newUrl);
6895
+ }, [mapHeight, mapWidth, center, is2x]);
6896
+ return currentUrl;
6897
+ }
6898
+
6899
+ function StaticMapError(_ref) {
6900
+ var onReload = _ref.onReload;
6901
+ return /*#__PURE__*/jsx(View, {
6902
+ alignItems: "center",
6903
+ justifyContent: "center",
6904
+ height: "100%",
6905
+ backgroundColor: "kitt.separator",
6906
+ children: /*#__PURE__*/jsx(IconButton, {
6907
+ icon: /*#__PURE__*/jsx(RotateCCWIcon, {}),
6908
+ onPress: onReload
6909
+ })
6910
+ });
6911
+ }
6912
+
6913
+ function StaticMapImage(_ref) {
6914
+ var url = _ref.url,
6915
+ alt = _ref.alt,
6916
+ width = _ref.width,
6917
+ height = _ref.height,
6918
+ onLoadEnd = _ref.onLoadEnd,
6919
+ onError = _ref.onError;
6920
+ return /*#__PURE__*/jsx(Image, {
6921
+ source: {
6922
+ uri: url
6923
+ },
6924
+ width: width,
6925
+ height: height,
6926
+ alt: alt,
6927
+ onError: onError,
6928
+ onLoadEnd: onLoadEnd
6929
+ });
6930
+ }
6931
+
6932
+ function StaticMapLoader() {
6933
+ return /*#__PURE__*/jsx(View, {
6934
+ alignItems: "center",
6935
+ justifyContent: "center",
6936
+ height: "100%",
6937
+ children: /*#__PURE__*/jsx(Skeleton, {
6938
+ isLoading: true,
6939
+ width: "100%",
6940
+ height: "100%"
6941
+ })
6942
+ });
6943
+ }
6944
+
6945
+ function getMarkerPosition(variant) {
6946
+ if (variant === 'position') return [{
6947
+ translateX: -2
6948
+ }, {
6949
+ translateY: 8
6950
+ }];
6951
+ if (variant === 'large') return [{
6952
+ translateX: 8
6953
+ }, {
6954
+ translateY: -20
6955
+ }];
6956
+ return [{
6957
+ translateX: 6
6958
+ }, {
6959
+ translateY: -15
6960
+ }];
6961
+ }
6962
+
6963
+ function StaticMapMarker(_ref) {
6964
+ var _ref$variant = _ref.variant,
6965
+ variant = _ref$variant === void 0 ? 'simple' : _ref$variant;
6966
+ return /*#__PURE__*/jsx(View, {
6967
+ position: "absolute",
6968
+ top: "0",
6969
+ left: "0",
6970
+ width: "100%",
6971
+ height: "100%",
6972
+ children: /*#__PURE__*/jsxs(View, {
6973
+ justifyContent: "center",
6974
+ alignItems: "center",
6975
+ height: "100%",
6976
+ style: {
6977
+ transform: getMarkerPosition(variant)
6978
+ },
6979
+ children: [variant === 'position' ? /*#__PURE__*/jsx(MapMarkerPosition, {}) : null, variant === 'large' ? /*#__PURE__*/jsx(MapMarkerLarge, {}) : null, variant === 'simple' ? /*#__PURE__*/jsx(MapMarkerSimple, {}) : null]
6980
+ })
6981
+ });
6982
+ }
6983
+
6984
+ function getRangedWidthValue(nextWidth, maxValue) {
6985
+ var rangedMapWidth = Math.max(1, Math.min(nextWidth, maxValue));
6986
+ return rangedMapWidth;
6987
+ }
6988
+
6989
+ function getShouldDisplay2x() {
6990
+ var currentDevicePixelRatio = PixelRatio.get();
6991
+ return currentDevicePixelRatio > 1;
6992
+ }
6993
+
6994
+ var _excluded$3 = ["width", "height", "alt", "apiToken", "mapId", "marker", "center", "onLoaded", "onError"];
6995
+ var mapBoxMaxPictureWidth = 1280; // Mapbox requestable width for image is between 1 - 1280px
6996
+
6997
+ function getPictureWidth(nextWidth) {
6998
+ return getRangedWidthValue(nextWidth, mapBoxMaxPictureWidth);
6999
+ }
7000
+
7001
+ function StaticMap(_ref) {
7002
+ var _ref$width = _ref.width,
7003
+ width = _ref$width === void 0 ? 0 : _ref$width,
7004
+ height = _ref.height,
7005
+ alt = _ref.alt,
7006
+ apiToken = _ref.apiToken,
7007
+ mapId = _ref.mapId,
7008
+ marker = _ref.marker,
7009
+ center = _ref.center,
7010
+ onLoaded = _ref.onLoaded,
7011
+ onError = _ref.onError,
7012
+ props = _objectWithoutProperties(_ref, _excluded$3);
7013
+
7014
+ var _useState = useState(getPictureWidth(width)),
7015
+ _useState2 = _slicedToArray(_useState, 2),
7016
+ currentWidth = _useState2[0],
7017
+ setCurrentWidth = _useState2[1];
7018
+
7019
+ var _useState3 = useState(true),
7020
+ _useState4 = _slicedToArray(_useState3, 2),
7021
+ isLoading = _useState4[0],
7022
+ setIsLoading = _useState4[1];
7023
+
7024
+ var _useState5 = useState(false),
7025
+ _useState6 = _slicedToArray(_useState5, 2),
7026
+ hasError = _useState6[0],
7027
+ setHasError = _useState6[1];
7028
+
7029
+ var _useState7 = useState(0),
7030
+ _useState8 = _slicedToArray(_useState7, 2),
7031
+ currentMapKey = _useState8[0],
7032
+ setCurrentMapKey = _useState8[1];
7033
+
7034
+ var shouldDisplay2xImage = getShouldDisplay2x();
7035
+ var mapUrl = useGetStaticMapImageUrl({
7036
+ forceApiToken: apiToken,
7037
+ forceMapId: mapId,
7038
+ mapWidth: currentWidth,
7039
+ mapHeight: height,
7040
+ center: center,
7041
+ is2x: shouldDisplay2xImage
7042
+ });
7043
+ return /*#__PURE__*/jsxs(View, _objectSpread(_objectSpread({
7044
+ position: "relative",
7045
+ maxWidth: mapBoxMaxPictureWidth,
7046
+ height: height,
7047
+ onLayout: function handleParentLayout(event) {
7048
+ var nativeEvent = event.nativeEvent;
7049
+ var rangedMapWidth = getPictureWidth(nativeEvent.layout.width);
7050
+ setCurrentWidth(rangedMapWidth);
7051
+ }
7052
+ }, props), {}, {
7053
+ "data-chromatic": process.env.KITT_MAP_CHROMATIC_IGNORE === 'true' ? 'ignore' : undefined,
7054
+ children: [currentWidth > 1 && mapUrl ? /*#__PURE__*/jsx(StaticMapImage, {
7055
+ url: mapUrl,
7056
+ width: currentWidth,
7057
+ height: height,
7058
+ alt: alt,
7059
+ onLoadEnd: function handleImageLoadEnd() {
7060
+ setIsLoading(false);
7061
+ if (onLoaded) onLoaded();
7062
+ },
7063
+ onError: function handleError() {
7064
+ setHasError(true);
7065
+ if (onError) onError();
7066
+ }
7067
+ }, "map-key-".concat(currentMapKey)) : null, marker && !isLoading && !hasError ? /*#__PURE__*/jsx(View, {
7068
+ position: "absolute",
7069
+ top: "0",
7070
+ left: "0",
7071
+ width: "100%",
7072
+ height: "100%",
7073
+ children: marker
7074
+ }) : null, isLoading ? /*#__PURE__*/jsx(View, {
7075
+ position: "absolute",
7076
+ top: "0",
7077
+ left: "0",
7078
+ width: "100%",
7079
+ height: "100%",
7080
+ children: /*#__PURE__*/jsx(StaticMapLoader, {})
7081
+ }) : null, hasError ? /*#__PURE__*/jsx(View, {
7082
+ position: "absolute",
7083
+ top: "0",
7084
+ left: "0",
7085
+ width: "100%",
7086
+ height: "100%",
7087
+ children: /*#__PURE__*/jsx(StaticMapError, {
7088
+ onReload: function handleReload() {
7089
+ setHasError(false);
7090
+ setIsLoading(true);
7091
+ setCurrentMapKey(function (prev) {
7092
+ return prev + 1;
7093
+ });
7094
+ }
7095
+ })
7096
+ }) : null]
7097
+ }));
7098
+ }
7099
+ StaticMap.Image = StaticMapImage;
7100
+ StaticMap.Loader = StaticMapLoader;
7101
+ StaticMap.Error = StaticMapError;
7102
+ StaticMap.Marker = StaticMapMarker;
7103
+
6484
7104
  var Flex = /*#__PURE__*/styled.View.withConfig({
6485
7105
  shouldForwardProp: function shouldForwardProp(prop, defaultValidatorFn) {
6486
7106
  return !['direction', 'padding'].includes(prop) && defaultValidatorFn(prop);
@@ -7537,5 +8157,5 @@ function useCurrentBreakpointName() {
7537
8157
  });
7538
8158
  }
7539
8159
 
7540
- export { Actions, Avatar, BottomSheet, Button, CardModal, Center, Checkbox, ChoicesElements, DatePicker, DialogModal, Emoji, ExternalAppLink, ExternalLink, Flex, HStack, Highlight, Icon, IconButton, Image, InputEmail, InputFeedback, InputField, InputIcon, InputPassword, InputPhone, InputPressable, InputTag, InputText, KittBreakpointNameEnum, KittBreakpoints, KittBreakpointsMax, KittNativeBaseProvider, KittThemeDecorator, KittThemeProvider, Label, ListItem, LoaderIcon, MatchWindowSize, Message, Modal, ModalBehaviour, NavigationModal, Notification, Overlay, PageLoader, Picker, Pressable, Radio, RadioButtonGroup, ScrollView, DeprecatedSection as Section, Skeleton, SpinningIcon, Stack, Story, StoryBlock, StoryContainer, StoryDecorator, StoryGrid, StorySection, StoryTitle, StyleWebWrapper, Tag, TextArea, TimePicker, Tooltip, Typography, TypographyEmoji, TypographyIcon, TypographyLink, VStack, View, createChoicesComponent, createResponsiveStyleFromProp, createWindowSizeHelper, hex2rgba, matchWindowSize, theme, useBottomSheet, useCurrentBreakpointName, useKittTheme, useMatchWindowSize, useStaticBottomSheet, useStoryBlockColor, withTheme };
8160
+ export { Actions, Avatar, BottomSheet, Button, CardModal, Center, Checkbox, ChoicesElements, DatePicker, DialogModal, Emoji, ExternalAppLink, ExternalLink, FlatList, Flex, HStack, Highlight, Icon, IconButton, Image, InputEmail, InputFeedback, InputField, InputIcon, InputPassword, InputPhone, InputPressable, InputTag, InputText, KittBreakpointNameEnum, KittBreakpoints, KittBreakpointsMax, KittMapConfigProvider, KittNativeBaseProvider, KittThemeDecorator, KittThemeProvider, Label, ListItem, LoaderIcon, MapMarkerLarge, MapMarkerPosition, MapMarkerSimple, MatchWindowSize, Message, Modal, ModalBehaviour, NavigationModal, Notification, Overlay, PageLoader, Picker, Pressable, Radio, RadioButtonGroup, ScrollView, DeprecatedSection as Section, SectionList, Skeleton, SpinningIcon, Stack, StaticMap, Story, StoryBlock, StoryContainer, StoryDecorator, StoryGrid, StorySection, StoryTitle, StyleWebWrapper, Tag, TextArea, TimePicker, Tooltip, Typography, TypographyEmoji, TypographyIcon, TypographyLink, VStack, View, createChoicesComponent, createResponsiveStyleFromProp, createWindowSizeHelper, getStaticMapImageUrl, hex2rgba, matchWindowSize, theme, useBottomSheet, useCurrentBreakpointName, useGetStaticMapImageUrl, useKittMapConfig, useKittTheme, useMatchWindowSize, useStaticBottomSheet, useStoryBlockColor, withTheme };
7541
8161
  //# sourceMappingURL=index-browser-all.es.js.map