sapo-components-ui-rn 1.1.60 → 1.1.62

package/dist/components/View/index.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import { StyleProp, ViewStyle } from "react-native";
-interface ViewProps {
+import { View, StyleProp, ViewStyle, ViewProps as RNViewProps, AccessibilityProps, LayoutChangeEvent } from "react-native";
+interface ViewProps extends RNViewProps, AccessibilityProps {
     row?: boolean;
     full?: boolean;
     justifyCenter?: boolean;
@@ -45,6 +45,63 @@ interface ViewProps {
     borderColor?: string;
     pointerEvents?: "box-none" | "box-only" | "none" | "auto";
     gap?: number;
+    flex?: number;
+    flexGrow?: number;
+    flexShrink?: number;
+    flexBasis?: number | string;
+    flexDirection?: "row" | "column" | "row-reverse" | "column-reverse";
+    justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly";
+    alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
+    alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
+    flexWrap?: "wrap" | "nowrap" | "wrap-reverse";
+    position?: "absolute" | "relative";
+    top?: number;
+    left?: number;
+    right?: number;
+    bottom?: number;
+    zIndex?: number;
+    elevation?: number;
+    shadowColor?: string;
+    shadowOffset?: {
+        width: number;
+        height: number;
+    };
+    shadowOpacity?: number;
+    shadowRadius?: number;
+    transform?: Array<{
+        perspective?: number;
+        rotate?: string;
+        rotateX?: string;
+        rotateY?: string;
+        rotateZ?: string;
+        scale?: number;
+        scaleX?: number;
+        scaleY?: number;
+        scaleZ?: number;
+        translateX?: number;
+        translateY?: number;
+        translateZ?: number;
+        skewX?: string;
+        skewY?: string;
+    }>;
+    onLayout?: (event: LayoutChangeEvent) => void;
+    onMagicTap?: () => void;
+    onMoveShouldSetResponder?: () => boolean;
+    onMoveShouldSetResponderCapture?: () => boolean;
+    onResponderGrant?: () => void;
+    onResponderMove?: () => void;
+    onResponderReject?: () => void;
+    onResponderRelease?: () => void;
+    onResponderTerminate?: () => void;
+    onResponderTerminationRequest?: () => boolean;
+    onStartShouldSetResponder?: () => boolean;
+    onStartShouldSetResponderCapture?: () => boolean;
+    testID?: string;
+    nativeID?: string;
+    collapsable?: boolean;
+    needsOffscreenAlphaCompositing?: boolean;
+    renderToHardwareTextureAndroid?: boolean;
+    shouldRasterizeIOS?: boolean;
 }
-declare const _default: React.MemoExoticComponent<({ row, full, justifyCenter, justifyBetween, alignCenter, center, color, backgroundColor, width, height, padding, paddingHorizontal, paddingVertical, marginHorizontal, marginVertical, paddingLeft, paddingRight, paddingTop, alignEnd, wrap, borderBottomWidth, borderBottomColor, borderRadius, borderWidth, borderColor, style, onPress, activeOpacity, children, disabled, paddingBottom, marginTop, marginBottom, marginLeft, marginRight, margin, borderTopWidth, borderTopColor, borderLeftWidth, borderLeftColor, borderRightWidth, borderRightColor, pointerEvents, gap, }: ViewProps) => React.JSX.Element>;
+declare const _default: React.NamedExoticComponent<ViewProps & React.RefAttributes<View>>;
 export default _default;

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 import { Dimensions, Platform, StyleSheet, useColorScheme, TouchableOpacity, View as View$1, Text as Text$2, Animated as Animated$1, Pressable, I18nManager, useWindowDimensions, TextInput as TextInput$1, Modal, Keyboard, ActivityIndicator, ImageBackground, Image as Image$2 } from 'react-native';
 import * as React$3 from 'react';
-import React__default, { memo, useCallback, forwardRef as forwardRef$1, useState, useEffect, useMemo, useRef, useImperativeHandle } from 'react';
+import React__default, { forwardRef as forwardRef$1, memo, useCallback, useState, useEffect, useMemo, useRef, useImperativeHandle } from 'react';
 import require$$1 from 'deepmerge';
 import Animated, { useSharedValue, withSequence, withTiming, withSpring, useAnimatedStyle, interpolateColor, useAnimatedReaction } from 'react-native-reanimated';
 import color from 'color';
@@ -1385,16 +1385,38 @@ function adaptNavigationTheme(themes) {
     };
 }
 
-var ViewCustom = function (_a) {
-    var row = _a.row, full = _a.full, justifyCenter = _a.justifyCenter, justifyBetween = _a.justifyBetween, alignCenter = _a.alignCenter, center = _a.center, color = _a.color, backgroundColor = _a.backgroundColor, width = _a.width, height = _a.height, padding = _a.padding, paddingHorizontal = _a.paddingHorizontal, paddingVertical = _a.paddingVertical, marginHorizontal = _a.marginHorizontal, marginVertical = _a.marginVertical, paddingLeft = _a.paddingLeft, paddingRight = _a.paddingRight, paddingTop = _a.paddingTop, alignEnd = _a.alignEnd, wrap = _a.wrap, borderBottomWidth = _a.borderBottomWidth, borderBottomColor = _a.borderBottomColor, borderRadius = _a.borderRadius, borderWidth = _a.borderWidth, borderColor = _a.borderColor, style = _a.style, onPress = _a.onPress, _b = _a.activeOpacity, activeOpacity = _b === void 0 ? 0.8 : _b, children = _a.children, disabled = _a.disabled, paddingBottom = _a.paddingBottom, marginTop = _a.marginTop, marginBottom = _a.marginBottom, marginLeft = _a.marginLeft, marginRight = _a.marginRight, margin = _a.margin, borderTopWidth = _a.borderTopWidth, borderTopColor = _a.borderTopColor, borderLeftWidth = _a.borderLeftWidth, borderLeftColor = _a.borderLeftColor, borderRightWidth = _a.borderRightWidth, borderRightColor = _a.borderRightColor, pointerEvents = _a.pointerEvents, gap = _a.gap;
+var ViewCustom = forwardRef$1(function (_a, ref) {
+    var row = _a.row, full = _a.full, justifyCenter = _a.justifyCenter, justifyBetween = _a.justifyBetween, alignCenter = _a.alignCenter, center = _a.center, color = _a.color, backgroundColor = _a.backgroundColor, width = _a.width, height = _a.height, padding = _a.padding, paddingHorizontal = _a.paddingHorizontal, paddingVertical = _a.paddingVertical, marginHorizontal = _a.marginHorizontal, marginVertical = _a.marginVertical, paddingLeft = _a.paddingLeft, paddingRight = _a.paddingRight, paddingTop = _a.paddingTop, alignEnd = _a.alignEnd, wrap = _a.wrap, borderBottomWidth = _a.borderBottomWidth, borderBottomColor = _a.borderBottomColor, borderRadius = _a.borderRadius, borderWidth = _a.borderWidth, borderColor = _a.borderColor, style = _a.style, onPress = _a.onPress, _b = _a.activeOpacity, activeOpacity = _b === void 0 ? 0.8 : _b, children = _a.children, disabled = _a.disabled, paddingBottom = _a.paddingBottom, marginTop = _a.marginTop, marginBottom = _a.marginBottom, marginLeft = _a.marginLeft, marginRight = _a.marginRight, margin = _a.margin, borderTopWidth = _a.borderTopWidth, borderTopColor = _a.borderTopColor, borderLeftWidth = _a.borderLeftWidth, borderLeftColor = _a.borderLeftColor, borderRightWidth = _a.borderRightWidth, borderRightColor = _a.borderRightColor, pointerEvents = _a.pointerEvents, gap = _a.gap, 
+    // Additional layout props
+    flex = _a.flex, flexGrow = _a.flexGrow, flexShrink = _a.flexShrink, flexBasis = _a.flexBasis, flexDirection = _a.flexDirection, justifyContent = _a.justifyContent, alignItems = _a.alignItems, alignSelf = _a.alignSelf, flexWrap = _a.flexWrap, position = _a.position, top = _a.top, left = _a.left, right = _a.right, bottom = _a.bottom, zIndex = _a.zIndex, elevation = _a.elevation, 
+    // Shadow props
+    shadowColor = _a.shadowColor, shadowOffset = _a.shadowOffset, shadowOpacity = _a.shadowOpacity, shadowRadius = _a.shadowRadius, 
+    // Transform props
+    transform = _a.transform, 
+    // Event handlers
+    onLayout = _a.onLayout, onMagicTap = _a.onMagicTap, onMoveShouldSetResponder = _a.onMoveShouldSetResponder, onMoveShouldSetResponderCapture = _a.onMoveShouldSetResponderCapture, onResponderGrant = _a.onResponderGrant, onResponderMove = _a.onResponderMove, onResponderReject = _a.onResponderReject, onResponderRelease = _a.onResponderRelease, onResponderTerminate = _a.onResponderTerminate, onResponderTerminationRequest = _a.onResponderTerminationRequest, onStartShouldSetResponder = _a.onStartShouldSetResponder, onStartShouldSetResponderCapture = _a.onStartShouldSetResponderCapture, 
+    // Test props
+    testID = _a.testID, nativeID = _a.nativeID, 
+    // Platform specific
+    collapsable = _a.collapsable, needsOffscreenAlphaCompositing = _a.needsOffscreenAlphaCompositing, renderToHardwareTextureAndroid = _a.renderToHardwareTextureAndroid, shouldRasterizeIOS = _a.shouldRasterizeIOS, 
+    // Spread remaining RN View props
+    restProps = __rest(_a, ["row", "full", "justifyCenter", "justifyBetween", "alignCenter", "center", "color", "backgroundColor", "width", "height", "padding", "paddingHorizontal", "paddingVertical", "marginHorizontal", "marginVertical", "paddingLeft", "paddingRight", "paddingTop", "alignEnd", "wrap", "borderBottomWidth", "borderBottomColor", "borderRadius", "borderWidth", "borderColor", "style", "onPress", "activeOpacity", "children", "disabled", "paddingBottom", "marginTop", "marginBottom", "marginLeft", "marginRight", "margin", "borderTopWidth", "borderTopColor", "borderLeftWidth", "borderLeftColor", "borderRightWidth", "borderRightColor", "pointerEvents", "gap", "flex", "flexGrow", "flexShrink", "flexBasis", "flexDirection", "justifyContent", "alignItems", "alignSelf", "flexWrap", "position", "top", "left", "right", "bottom", "zIndex", "elevation", "shadowColor", "shadowOffset", "shadowOpacity", "shadowRadius", "transform", "onLayout", "onMagicTap", "onMoveShouldSetResponder", "onMoveShouldSetResponderCapture", "onResponderGrant", "onResponderMove", "onResponderReject", "onResponderRelease", "onResponderTerminate", "onResponderTerminationRequest", "onStartShouldSetResponder", "onStartShouldSetResponderCapture", "testID", "nativeID", "collapsable", "needsOffscreenAlphaCompositing", "renderToHardwareTextureAndroid", "shouldRasterizeIOS"]);
     var getStyle = function () {
         var styleCustom = {};
         if (row) {
             styleCustom.flexDirection = "row";
         }
+        // Override with explicit prop if provided
+        if (flexDirection !== undefined) {
+            styleCustom.flexDirection = flexDirection;
+        }
         if (full) {
             styleCustom.flex = 1;
         }
+        // Override with explicit prop if provided
+        if (flex !== undefined) {
+            styleCustom.flex = flex;
+        }
         if (justifyCenter) {
             styleCustom.justifyContent = "center";
         }
@@ -1408,6 +1430,13 @@ var ViewCustom = function (_a) {
             styleCustom.justifyContent = "center";
             styleCustom.alignItems = "center";
         }
+        // Override with explicit props if provided
+        if (justifyContent !== undefined) {
+            styleCustom.justifyContent = justifyContent;
+        }
+        if (alignItems !== undefined) {
+            styleCustom.alignItems = alignItems;
+        }
         if (color) {
             styleCustom.color = color;
         }
@@ -1468,6 +1497,10 @@ var ViewCustom = function (_a) {
         if (wrap) {
             styleCustom.flexWrap = "wrap";
         }
+        // Override with explicit prop if provided
+        if (flexWrap !== undefined) {
+            styleCustom.flexWrap = flexWrap;
+        }
         if (borderBottomWidth) {
             styleCustom.borderBottomWidth = borderBottomWidth;
         }
@@ -1507,12 +1540,57 @@ var ViewCustom = function (_a) {
         if (gap) {
             styleCustom.gap = gap;
         }
+        // Additional layout props
+        if (flex !== undefined)
+            styleCustom.flex = flex;
+        if (flexGrow !== undefined)
+            styleCustom.flexGrow = flexGrow;
+        if (flexShrink !== undefined)
+            styleCustom.flexShrink = flexShrink;
+        if (flexBasis !== undefined)
+            styleCustom.flexBasis = flexBasis;
+        if (flexDirection !== undefined)
+            styleCustom.flexDirection = flexDirection;
+        if (justifyContent !== undefined)
+            styleCustom.justifyContent = justifyContent;
+        if (alignItems !== undefined)
+            styleCustom.alignItems = alignItems;
+        if (alignSelf !== undefined)
+            styleCustom.alignSelf = alignSelf;
+        if (flexWrap !== undefined)
+            styleCustom.flexWrap = flexWrap;
+        if (position !== undefined)
+            styleCustom.position = position;
+        if (top !== undefined)
+            styleCustom.top = top;
+        if (left !== undefined)
+            styleCustom.left = left;
+        if (right !== undefined)
+            styleCustom.right = right;
+        if (bottom !== undefined)
+            styleCustom.bottom = bottom;
+        if (zIndex !== undefined)
+            styleCustom.zIndex = zIndex;
+        if (elevation !== undefined)
+            styleCustom.elevation = elevation;
+        // Shadow props
+        if (shadowColor !== undefined)
+            styleCustom.shadowColor = shadowColor;
+        if (shadowOffset !== undefined)
+            styleCustom.shadowOffset = shadowOffset;
+        if (shadowOpacity !== undefined)
+            styleCustom.shadowOpacity = shadowOpacity;
+        if (shadowRadius !== undefined)
+            styleCustom.shadowRadius = shadowRadius;
+        // Transform props
+        if (transform !== undefined)
+            styleCustom.transform = transform;
         return StyleSheet.create({ styleCustom: styleCustom }).styleCustom;
     };
     var defaultStyle = getStyle();
     var Component = onPress ? TouchableOpacity : View$1;
-    return (React__default.createElement(Component, { activeOpacity: activeOpacity, onPress: onPress, disabled: disabled, style: [defaultStyle, style] }, children));
-};
+    return (React__default.createElement(Component, __assign({ ref: ref, activeOpacity: activeOpacity, onPress: onPress, disabled: disabled, style: [defaultStyle, style], onLayout: onLayout, onMagicTap: onMagicTap, onMoveShouldSetResponder: onMoveShouldSetResponder, onMoveShouldSetResponderCapture: onMoveShouldSetResponderCapture, onResponderGrant: onResponderGrant, onResponderMove: onResponderMove, onResponderReject: onResponderReject, onResponderRelease: onResponderRelease, onResponderTerminate: onResponderTerminate, onResponderTerminationRequest: onResponderTerminationRequest, onStartShouldSetResponder: onStartShouldSetResponder, onStartShouldSetResponderCapture: onStartShouldSetResponderCapture, testID: testID, nativeID: nativeID, collapsable: collapsable, needsOffscreenAlphaCompositing: needsOffscreenAlphaCompositing, renderToHardwareTextureAndroid: renderToHardwareTextureAndroid, shouldRasterizeIOS: shouldRasterizeIOS }, restProps), children));
+});
 var View = React__default.memo(ViewCustom);
 
 var Switch = memo(function (_a) {