@ornikar/kitt-universal 22.1.0 → 22.2.0

package/dist/index.es.web.js

@@ -17,7 +17,7 @@ import { CSSTransition } from 'react-transition-group';
 import { ScrollView as ScrollView$2, View as View$2, Linking, Pressable as Pressable$2, useWindowDimensions } from 'react-native';
 export { useWindowDimensions as useWindowSize } from 'react-native';
 import { parse } from 'twemoji-parser';
-import { CaretUpFillIcon, CaretDownFillIcon, EyeSlashFillIcon, EyeFillIcon, XRegularIcon } from '@ornikar/kitt-icons/phosphor';
+import { CaretUpFillIcon, CaretDownFillIcon, EyeClosedRegularIcon, EyeRegularIcon, XRegularIcon } from '@ornikar/kitt-icons/phosphor';
 import Downshift, { useSelect } from 'downshift';
 import { useDebouncedCallback } from 'use-debounce';
 import { Loader } from '@googlemaps/js-api-loader';
@@ -782,6 +782,7 @@ var cardModal = {
   borderRadius: 20,
   maxWidth: maxWidth,
   maxWidthWithPadding: maxWidth + overlayHorizontalPadding * 2,
+  minHeight: 280,
   shadow: {
     color: colors.black,
     offsetX: 0,
@@ -800,7 +801,7 @@ var cardModal = {
   },
   overlayPadding: {
     horizontal: 24,
-    vertical: 32
+    vertical: 80
   },
   animation: {
     overlay: {
@@ -2317,7 +2318,7 @@ function Icon(_ref) {
 }
 
 var _excluded$L = ["color", "size"],
-  _excluded2$7 = ["color"];
+  _excluded2$6 = ["color"];
 function getIconSizeConfigKeyFromTypeName(breakpointName) {
   return breakpointName === KittBreakpointNameEnum.BASE || breakpointName === KittBreakpointNameEnum.SMALL ? 'baseAndSmall' : 'mediumAndWide';
 }
@@ -2359,7 +2360,7 @@ function TypographyIconInheritColor(props) {
 }
 function TypographyIcon(_ref2) {
   var color = _ref2.color,
-    props = _objectWithoutProperties(_ref2, _excluded2$7);
+    props = _objectWithoutProperties(_ref2, _excluded2$6);
   if (color) {
     return /*#__PURE__*/jsx(TypographyIconSpecifiedColor, _objectSpread({
       color: color
@@ -3038,7 +3039,11 @@ function CardModalRotationContainer(props) {
     paddingX: "kitt.cardModal.overlayPadding.horizontal",
     paddingY: "kitt.cardModal.overlayPadding.vertical",
     maxWidth: "kitt.cardModal.maxWidthWithPadding",
-    width: "100%"
+    width: "100%",
+    maxHeight: "100%",
+    _web: {
+      maxHeight: '100svh'
+    }
   }, props));
 }
 
@@ -3114,21 +3119,13 @@ function CardModalAnimation(_ref) {
   }));
 }
 
-var _excluded$F = ["children"],
-  _excluded2$6 = ["children", "visible", "onClose", "onExited"];
-function CardModalScrollContainer(_ref) {
+var _excluded$F = ["children", "visible", "onClose", "onExited"];
+function CardModalBehaviour(_ref) {
   var children = _ref.children,
+    visible = _ref.visible,
+    onClose = _ref.onClose,
+    onExited = _ref.onExited,
     props = _objectWithoutProperties(_ref, _excluded$F);
-  return /*#__PURE__*/jsx(ScrollView, _objectSpread(_objectSpread({}, props), {}, {
-    children: children
-  }));
-}
-function CardModalBehaviour(_ref2) {
-  var children = _ref2.children,
-    visible = _ref2.visible,
-    onClose = _ref2.onClose,
-    onExited = _ref2.onExited,
-    props = _objectWithoutProperties(_ref2, _excluded2$6);
   var _useState = useState(visible),
     _useState2 = _slicedToArray(_useState, 2),
     isModalBehaviourVisible = _useState2[0],
@@ -3141,21 +3138,15 @@ function CardModalBehaviour(_ref2) {
   return /*#__PURE__*/jsx(ModalBehaviour, {
     visible: isModalBehaviourVisible,
     onClose: onClose,
-    children: /*#__PURE__*/jsx(CardModalScrollContainer, {
-      bounces: false,
-      contentContainerStyle: {
-        flexGrow: 1
+    children: /*#__PURE__*/jsx(CardModalAnimation, _objectSpread(_objectSpread({}, props), {}, {
+      visible: visible,
+      onExited: function handleExitAnimationDone() {
+        if (onExited) onExited();
+        setIsModalBehaviourVisible(false);
       },
-      children: /*#__PURE__*/jsx(CardModalAnimation, _objectSpread(_objectSpread({}, props), {}, {
-        visible: visible,
-        onExited: function handleExitAnimationDone() {
-          if (onExited) onExited();
-          setIsModalBehaviourVisible(false);
-        },
-        onClose: onClose,
-        children: children
-      }))
-    })
+      onClose: onClose,
+      children: children
+    }))
   });
 }
 
@@ -3170,7 +3161,8 @@ function CardModalBody(_ref) {
     _ref$paddingY = _ref.paddingY,
     paddingY = _ref$paddingY === void 0 ? 'kitt.4' : _ref$paddingY,
     props = _objectWithoutProperties(_ref, _excluded$E);
-  return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({
+  return /*#__PURE__*/jsx(ScrollView, _objectSpread(_objectSpread({
+    showsVerticalScrollIndicator: false,
     paddingX: paddingX,
     paddingY: paddingY
   }, props), {}, {
@@ -3273,6 +3265,7 @@ function CardModal(_ref) {
     width: "100%",
     maxHeight: "100%",
     maxWidth: maxWidth,
+    minHeight: "kitt.cardModal.minHeight",
     children: children || /*#__PURE__*/jsxs(Fragment, {
       children: [header || null, body || null, footer || null]
     })
@@ -3916,7 +3909,7 @@ var InputText = /*#__PURE__*/forwardRef(function (_ref, ref) {
     _ref$autoComplete = _ref.autoComplete,
     autoComplete = _ref$autoComplete === void 0 ? 'off' : _ref$autoComplete,
     _ref$inputMode = _ref.inputMode,
-    inputMode = _ref$inputMode === void 0 ? 'none' : _ref$inputMode,
+    inputMode = _ref$inputMode === void 0 ? 'text' : _ref$inputMode,
     multiline = _ref.multiline,
     onSubmitEditing = _ref.onSubmitEditing,
     props = _objectWithoutProperties(_ref, _excluded$u);
@@ -5318,16 +5311,14 @@ function InputField(_ref) {
   });
 }
 
-var _excluded$o = ["onChange", "keyboardType"];
+var _excluded$o = ["onChange"];
 var InputNumber = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var onChange = _ref.onChange,
-    _ref$keyboardType = _ref.keyboardType,
-    keyboardType = _ref$keyboardType === void 0 ? 'numeric' : _ref$keyboardType,
     props = _objectWithoutProperties(_ref, _excluded$o);
   return /*#__PURE__*/jsx(InputText, _objectSpread(_objectSpread({
     ref: ref
   }, props), {}, {
-    keyboardType: keyboardType,
+    inputMode: "numeric",
     onChange: function handleChange(event) {
       if (!onChange) return;
       var value = parseFloat(event.nativeEvent.text);
@@ -5366,7 +5357,7 @@ var InputPassword = /*#__PURE__*/forwardRef(function (_ref, ref) {
         });
       },
       children: /*#__PURE__*/jsx(InputIcon, {
-        icon: isVisible ? /*#__PURE__*/jsx(EyeSlashFillIcon, {}) : /*#__PURE__*/jsx(EyeFillIcon, {})
+        icon: isVisible ? /*#__PURE__*/jsx(EyeClosedRegularIcon, {}) : /*#__PURE__*/jsx(EyeRegularIcon, {})
       })
     })
   }));
@@ -7540,7 +7531,8 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
             height: theme.cardModal.header.height
           },
           maxWidth: theme.cardModal.maxWidth,
-          maxWidthWithPadding: theme.cardModal.maxWidthWithPadding
+          maxWidthWithPadding: theme.cardModal.maxWidthWithPadding,
+          minHeight: theme.cardModal.minHeight
         },
         dialogModal: {
           maxWidth: theme.dialogModal.maxWidth,
@@ -7651,7 +7643,7 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
           padding: theme.button.padding
         },
         cardModal: {
-          overlayPadding: theme.dialogModal.overlayPadding
+          overlayPadding: theme.cardModal.overlayPadding
         },
         dialogModal: {
           overlayPadding: theme.dialogModal.overlayPadding
@@ -8482,28 +8474,20 @@ function NativeOnlyFlatList(_ref) {
 }
 
 var _excluded$a = ["children", "visible", "appear", "onExited", "onEnter", "onExit", "onClose"];
-function SimpleContainer(_ref) {
-  var children = _ref.children;
-  return children;
-}
-function NavigationModalBehaviour(_ref2) {
-  var children = _ref2.children,
-    visible = _ref2.visible,
-    _ref2$appear = _ref2.appear,
-    appear = _ref2$appear === void 0 ? true : _ref2$appear,
-    onExited = _ref2.onExited,
-    onEnter = _ref2.onEnter,
-    onExit = _ref2.onExit,
-    onClose = _ref2.onClose,
-    props = _objectWithoutProperties(_ref2, _excluded$a);
+function NavigationModalBehaviour(_ref) {
+  var children = _ref.children,
+    visible = _ref.visible,
+    _ref$appear = _ref.appear,
+    appear = _ref$appear === void 0 ? true : _ref$appear,
+    onExited = _ref.onExited,
+    onEnter = _ref.onEnter,
+    onExit = _ref.onExit,
+    onClose = _ref.onClose,
+    props = _objectWithoutProperties(_ref, _excluded$a);
   var AnimationComponent = useBreakpointValue({
     base: FullscreenModalAnimation,
     small: CardModalAnimation
   });
-  var CurrentContainerComponent = useBreakpointValue({
-    base: SimpleContainer,
-    small: CardModalScrollContainer
-  });
   var _useState = useState(visible),
     _useState2 = _slicedToArray(_useState, 2),
     isModalBehaviourVisible = _useState2[0],
@@ -8520,34 +8504,28 @@ function NavigationModalBehaviour(_ref2) {
   return /*#__PURE__*/jsx(ModalBehaviour, {
     visible: isModalBehaviourVisible,
     onClose: onClose,
-    children: /*#__PURE__*/jsx(CurrentContainerComponent, {
-      bounces: false,
-      contentContainerStyle: {
-        flexGrow: 1
-      },
-      children: /*#__PURE__*/jsx(AnimationComponent, _objectSpread(_objectSpread({}, props), {}, {
-        appear: shouldAppear,
-        visible: visible,
-        onEnter: function handleEnter() {
-          if (onEnter) onEnter();
+    children: /*#__PURE__*/jsx(AnimationComponent, _objectSpread(_objectSpread({}, props), {}, {
+      appear: shouldAppear,
+      visible: visible,
+      onEnter: function handleEnter() {
+        if (onEnter) onEnter();
 
-          // Once a children as been displayed, we force appear to false in order to avoid replaying animation on breakpoint change
-          setShouldAppear(false);
-        },
-        onExit: function handleExit() {
-          if (onExit) onExit();
+        // Once a children as been displayed, we force appear to false in order to avoid replaying animation on breakpoint change
+        setShouldAppear(false);
+      },
+      onExit: function handleExit() {
+        if (onExit) onExit();
 
-          // Reset appear value to its original value for future modal display
-          setShouldAppear(appear);
-        },
-        onExited: function handleExitAnimationDone() {
-          if (onExited) onExited();
-          setIsModalBehaviourVisible(false);
-        },
-        onClose: onClose,
-        children: children
-      }))
-    })
+        // Reset appear value to its original value for future modal display
+        setShouldAppear(appear);
+      },
+      onExited: function handleExitAnimationDone() {
+        if (onExited) onExited();
+        setIsModalBehaviourVisible(false);
+      },
+      onClose: onClose,
+      children: children
+    }))
   });
 }