@ornikar/kitt-universal 22.1.1 → 22.2.0

package/dist/index.es.web.js

@@ -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]
     })
@@ -7538,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,
@@ -7649,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
@@ -8480,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],
@@ -8518,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
+    }))
   });
 }