@ornikar/kitt-universal 13.2.0 → 13.3.0

package/dist/index-node-14.17.cjs.web.js

@@ -6,9 +6,9 @@ const react = require('react');
 const nativeBase = require('native-base');
 const jsxRuntime = require('react/jsx-runtime');
 const kittIcons = require('@ornikar/kitt-icons');
-const reactNative = require('react-native');
 const reactPortal = require('react-portal');
 const reactTransitionGroup = require('react-transition-group');
+const reactNative = require('react-native');
 const twemojiParser = require('twemoji-parser');
 const libphonenumberJs = require('libphonenumber-js');
 const reactNativeSafeAreaContext = require('react-native-safe-area-context');
@@ -2299,56 +2299,17 @@ function LoaderIcon({
   });
 }
 
-function matchWindowSize({
-  width,
-  height
-}, {
-  minWidth,
-  maxWidth,
-  minHeight,
-  maxHeight
-}) {
-  const hasWidthMatched = width ? (!minWidth || width >= minWidth) && (!maxWidth || width <= maxWidth) : true;
-  const hasHeightMatched = height ? (!minHeight || height >= minHeight) && (!maxHeight || height <= maxHeight) : true;
-  return hasWidthMatched && hasHeightMatched;
-}
-
-/**
- * Returns if a size matches based on dimensions passed as options.
- *
- * WARNING: Not SSR friendly.
- */
-function useMatchWindowSize(options) {
-  const {
-    width,
-    height
-  } = reactNative.useWindowDimensions();
-  return matchWindowSize({
-    width,
-    height
-  }, options);
-}
-
-function getCurrentStretchValue(isStretch, isMedium) {
-  // Stretch will follow the value passed from the component occurence if defined
-  if (isStretch) return isStretch;
-  return !isMedium ? true : undefined;
-}
-
-// eslint-disable-next-line @typescript-eslint/ban-types
-
 function ActionsItem({
   as,
   onPress,
   disabled,
   icon,
-  stretch,
+  stretch = {
+    base: true,
+    medium: false
+  },
   ...props
 }) {
-  const isMedium = useMatchWindowSize({
-    minWidth: KittBreakpoints.MEDIUM
-  });
-  const isCurrentStretch = getCurrentStretchValue(stretch, isMedium);
   const [isLoading, setIsLoading] = react.useState(false);
   const mountedRef = react.useRef(false);
 
@@ -2362,7 +2323,7 @@ function ActionsItem({
   return /*#__PURE__*/jsxRuntime.jsx(View, {
     children: /*#__PURE__*/jsxRuntime.jsx(as, {
       ...props,
-      stretch: isCurrentStretch,
+      stretch: stretch,
       disabled: isLoading ? true : disabled,
       icon: isLoading ? /*#__PURE__*/jsxRuntime.jsx(LoaderIcon, {}) : icon,
       onPress: e => {
@@ -2411,6 +2372,14 @@ function getCurrentDirection(layout) {
   if (layout === 'column') return 'column';
   return 'row';
 }
+function getCurrentAlignSelf(layout) {
+  if (!layout) return {
+    base: 'stretch',
+    medium: undefined
+  };
+  if (layout === 'column') return 'stretch';
+  return undefined;
+}
 function Actions({
   children,
   layout,
@@ -2418,8 +2387,10 @@ function Actions({
 }) {
   const currentAlignItems = getCurrentLayout(layout);
   const currentDirection = getCurrentDirection(layout);
+  const currentAlignSelf = getCurrentAlignSelf(layout);
   return /*#__PURE__*/jsxRuntime.jsx(Stack, {
     alignItems: currentAlignItems,
+    alignSelf: currentAlignSelf,
     direction: currentDirection,
     flexGrow: 1,
     ...props,
@@ -8373,6 +8344,36 @@ function StyleWebWrapper({
   });
 }
 
+function matchWindowSize({
+  width,
+  height
+}, {
+  minWidth,
+  maxWidth,
+  minHeight,
+  maxHeight
+}) {
+  const hasWidthMatched = width ? (!minWidth || width >= minWidth) && (!maxWidth || width <= maxWidth) : true;
+  const hasHeightMatched = height ? (!minHeight || height >= minHeight) && (!maxHeight || height <= maxHeight) : true;
+  return hasWidthMatched && hasHeightMatched;
+}
+
+/**
+ * Returns if a size matches based on dimensions passed as options.
+ *
+ * WARNING: Not SSR friendly.
+ */
+function useMatchWindowSize(options) {
+  const {
+    width,
+    height
+  } = reactNative.useWindowDimensions();
+  return matchWindowSize({
+    width,
+    height
+  }, options);
+}
+
 /**
  * Display children if match window size options
  *