@nexara/nativeflow 0.1.8 → 0.1.10

package/src/helpers/ResponsiveCalculations.ts

@@ -1,104 +1,107 @@
-import { Dimensions, PixelRatio } from 'react-native';
-import { getGlobalContext } from '../components/Provider/ContextManager';
-import type { scalingModeTypes } from '../types';
-
-
-const {
-    width: SCREEN_WIDTH,
-    height: SCREEN_HEIGHT,
-} = Dimensions.get('window');
-
-// const isResponsive = true;
-const guidelineBaseWidth = 350;
-const guidelineBaseHeight = 680;
-const [shortDimension, longDimension] = SCREEN_WIDTH < SCREEN_HEIGHT ? [SCREEN_WIDTH, SCREEN_HEIGHT] : [SCREEN_HEIGHT, SCREEN_WIDTH];
-
-type scalingCacheKey = 'hScale' | 'vScale' | 'fs';
-
-const scalingCache = new Map<scalingCacheKey, object>();
-
-const checkIsPhone = (size: number): number => {
-    if (SCREEN_WIDTH <= 430 && SCREEN_WIDTH >= 375) {
-        return size;
-    }
-    return 0;
-}
-
-const scale = (size: number, cacheKey: scalingCacheKey, mode: scalingModeTypes) => {
-    if (checkIsPhone(size)) {
-        return size;
-    }
-    const cacheScaleValue: any = scalingCache.get(cacheKey) || {};
-    let finalSize;
-    if (cacheScaleValue?.[size]) {
-        return cacheScaleValue?.[size];
-    }
-    if (mode === 'partial') {
-        // const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.40;
-        const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.20;
-        let scale = ((cacheKey === 'hScale' ? shortDimension : longDimension) / guidelineBaseHeight);
-        scale = 1 + (scale - 1) * slowDownRate;
-        let adjustedSize = size * Math.max(scale, 0.80);
-        finalSize = Math.floor(PixelRatio.roundToNearestPixel(adjustedSize));
-    } else {
-        const baseScaleFactor = (cacheKey === 'hScale' ? (shortDimension / guidelineBaseWidth) : (longDimension / guidelineBaseHeight));
-        const clampedScaleFactor = Math.max(0.9, Math.min(baseScaleFactor, 1.2));
-        finalSize = Math.round(PixelRatio.roundToNearestPixel(size * clampedScaleFactor))
-    }
-    cacheScaleValue[size] = finalSize;
-    cacheScaleValue[size] = finalSize;
-    scalingCache.set(cacheKey, cacheScaleValue);
-    return finalSize;
-}
-
-export const horizontalScale = (size: number): number => {
-    const scalingMode = getGlobalContext().scaling.mode;
-    return scale(size, 'hScale', scalingMode ?? 0);
-}
-
-export const verticalScale = (size: number): number => {
-    const scalingMode = getGlobalContext().scaling.mode;
-    return scale(size, 'vScale', scalingMode ?? 0);
-}
-
-
-// export const moderateScale = (size: number, factor = 0.5): number => {
-//     if (isResponsive) {
-//         return size + ((shortDimension / guidelineBaseWidth * size) - size) * factor;
-//     } else {
-//         return size + factor + 1;
-//     }
-// }
-// export const moderateVerticalScale = (size: number, factor = 0.5): number => {
-//     if (isResponsive) {
-//         return size + (longDimension / guidelineBaseHeight * size) * factor;
-//     } else {
-//         return size + factor + 5;
-//     }
-// }
-
-export const responsiveFontSize = (fontSize: number): number => {
-    if (checkIsPhone(fontSize)) {
-        return fontSize;
-    }
-    const fsCache: any = scalingCache.get('fs') || {};
-    if (fsCache?.[fontSize]) {
-        return fsCache?.[fontSize];
-    }
-    // const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.20
-    const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.15
-    const screenDiagonal = Math.sqrt(SCREEN_WIDTH ** 2 + SCREEN_HEIGHT ** 2);
-    const baseScreenDiagonal = Math.sqrt(360 ** 2 + 640 ** 2);
-    let scale = screenDiagonal / baseScreenDiagonal;
-    scale = 1 + (scale - 1) * slowDownRate;
-    let adjustedFontSize = fontSize * Math.max(scale, 0.85);
-    const finalSize = Math.floor(PixelRatio.roundToNearestPixel(adjustedFontSize));
-    fsCache[fontSize] = finalSize;
-    scalingCache.set('fs', fsCache)
-    return finalSize;
-};
-
-
-
-
-
+import { Dimensions, PixelRatio } from 'react-native';
+import { getGlobalContext } from '../components/Provider/ContextManager';
+import type { scalingModeTypes } from '../types';
+
+
+const {
+    width: SCREEN_WIDTH,
+    height: SCREEN_HEIGHT,
+} = Dimensions.get('window');
+
+// const isResponsive = true;
+const guidelineBaseWidth = 350;
+const guidelineBaseHeight = 680;
+const [shortDimension, longDimension] = SCREEN_WIDTH < SCREEN_HEIGHT ? [SCREEN_WIDTH, SCREEN_HEIGHT] : [SCREEN_HEIGHT, SCREEN_WIDTH];
+
+type scalingCacheKey = 'hScale' | 'vScale' | 'fs';
+
+const scalingCache = new Map<scalingCacheKey, object>();
+
+const checkIsPhone = (size: number): number => {
+    // if (SCREEN_WIDTH <= 430 && SCREEN_WIDTH >= 375) {
+    //     return size;
+    // }
+     if (SCREEN_WIDTH <= 430) {
+        return size;
+    }
+    return 0;
+}
+
+const scale = (size: number, cacheKey: scalingCacheKey, mode: scalingModeTypes) => {
+    if (checkIsPhone(size)) {
+        return size;
+    }
+    const cacheScaleValue: any = scalingCache.get(cacheKey) || {};
+    let finalSize;
+    if (cacheScaleValue?.[size]) {
+        return cacheScaleValue?.[size];
+    }
+    if (mode === 'partial') {
+        // const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.40;
+        const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.20;
+        let scale = ((cacheKey === 'hScale' ? shortDimension : longDimension) / guidelineBaseHeight);
+        scale = 1 + (scale - 1) * slowDownRate;
+        let adjustedSize = size * Math.max(scale, 0.80);
+        finalSize = Math.floor(PixelRatio.roundToNearestPixel(adjustedSize));
+    } else {
+        const baseScaleFactor = (cacheKey === 'hScale' ? (shortDimension / guidelineBaseWidth) : (longDimension / guidelineBaseHeight));
+        const clampedScaleFactor = Math.max(0.9, Math.min(baseScaleFactor, 1.2));
+        finalSize = Math.round(PixelRatio.roundToNearestPixel(size * clampedScaleFactor))
+    }
+    cacheScaleValue[size] = finalSize;
+    cacheScaleValue[size] = finalSize;
+    scalingCache.set(cacheKey, cacheScaleValue);
+    return finalSize;
+}
+
+export const horizontalScale = (size: number): number => {
+    const scalingMode = getGlobalContext().scaling.mode;
+    return scale(size, 'hScale', scalingMode ?? 0);
+}
+
+export const verticalScale = (size: number): number => {
+    const scalingMode = getGlobalContext().scaling.mode;
+    return scale(size, 'vScale', scalingMode ?? 0);
+}
+
+
+// export const moderateScale = (size: number, factor = 0.5): number => {
+//     if (isResponsive) {
+//         return size + ((shortDimension / guidelineBaseWidth * size) - size) * factor;
+//     } else {
+//         return size + factor + 1;
+//     }
+// }
+// export const moderateVerticalScale = (size: number, factor = 0.5): number => {
+//     if (isResponsive) {
+//         return size + (longDimension / guidelineBaseHeight * size) * factor;
+//     } else {
+//         return size + factor + 5;
+//     }
+// }
+
+export const responsiveFontSize = (fontSize: number): number => {
+    if (checkIsPhone(fontSize)) {
+        return fontSize;
+    }
+    const fsCache: any = scalingCache.get('fs') || {};
+    if (fsCache?.[fontSize]) {
+        return fsCache?.[fontSize];
+    }
+    // const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.20
+    const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.15
+    const screenDiagonal = Math.sqrt(SCREEN_WIDTH ** 2 + SCREEN_HEIGHT ** 2);
+    const baseScreenDiagonal = Math.sqrt(360 ** 2 + 640 ** 2);
+    let scale = screenDiagonal / baseScreenDiagonal;
+    scale = 1 + (scale - 1) * slowDownRate;
+    let adjustedFontSize = fontSize * Math.max(scale, 0.85);
+    const finalSize = Math.floor(PixelRatio.roundToNearestPixel(adjustedFontSize));
+    fsCache[fontSize] = finalSize;
+    scalingCache.set('fs', fsCache)
+    return finalSize;
+};
+
+
+
+
+

package/src/helpers/index.ts

@@ -1,3 +1,3 @@
-export { default as getGridValue } from './CalculateGridSize';
-export { default as deviceScreenSizeCategory } from './DeviceSizeCategory';
+export { default as getGridValue } from './CalculateGridSize';
+export { default as deviceScreenSizeCategory } from './DeviceSizeCategory';
 export * from "./ResponsiveCalculations";

package/src/hooks/index.ts

@@ -1,4 +1,4 @@
-export { default as useTheme } from './useTheme';
-export { default as useScalingMode } from './useScalingMode';
-export { default as useColorScheme } from './useColorScheme';
+export { default as useTheme } from './useTheme';
+export { default as useScalingMode } from './useScalingMode';
+export { default as useColorScheme } from './useColorScheme';
 export { default as useConditionalWindowDimension } from './useConditionalWindowDimension';

package/src/hooks/useColorScheme.tsx

@@ -1,12 +1,12 @@
-import { useContext } from 'react';
-import { Context } from '../components/Provider/NativeProvider';
-
-const useColorScheme = () => {
-    const context = useContext(Context)?.mode;
-    if (!context) {
-        throw new Error('useColorScheme must be used within a NativeProvider');
-    }
-    return context;
-};
-
+import { useContext } from 'react';
+import { Context } from '../components/Provider/NativeProvider';
+
+const useColorScheme = () => {
+    const context = useContext(Context)?.mode;
+    if (!context) {
+        throw new Error('useColorScheme must be used within a NativeProvider');
+    }
+    return context;
+};
+
 export default useColorScheme;

package/src/hooks/useConditionalWindowDimension.tsx

@@ -1,7 +1,7 @@
-import { useWindowDimensions } from "react-native";
-
-const useConditionalWindowDimension = (isTrackDimension: boolean): { width: number | undefined; height: number | undefined } => {
-    return isTrackDimension ? useWindowDimensions() : { width: undefined, height: undefined }
-}
-
-export default useConditionalWindowDimension;
+import { useWindowDimensions } from "react-native";
+
+const useConditionalWindowDimension = (isTrackDimension: boolean): { width: number | undefined; height: number | undefined } => {
+    return isTrackDimension ? useWindowDimensions() : { width: undefined, height: undefined }
+}
+
+export default useConditionalWindowDimension;

package/src/hooks/useScalingMode.tsx

@@ -1,6 +1,6 @@
-import { useContext } from 'react';
-import { Context } from '../components/Provider/NativeProvider';
-
-const useScalingMode = () => useContext(Context)?.scaling;
-
-export default useScalingMode;
+import { useContext } from 'react';
+import { Context } from '../components/Provider/NativeProvider';
+
+const useScalingMode = () => useContext(Context)?.scaling;
+
+export default useScalingMode;

package/src/hooks/useTheme.tsx

@@ -1,13 +1,13 @@
-import { useContext } from 'react';
-import { Context } from '../components/Provider/NativeProvider';
-
-
-const useTheme = (isTrackTheme: boolean = true) => {
-    const context = isTrackTheme ? useContext(Context)?.theme : undefined;
-    if (isTrackTheme && !context) {
-        throw new Error('Ensure that your code is wrapped with NativeProvider in App.js, and make sure you are not using the useTheme hook outside of the NativeProvider.');
-    }
-    return context;
-};
-
+import { useContext } from 'react';
+import { Context } from '../components/Provider/NativeProvider';
+
+
+const useTheme = (isTrackTheme: boolean = true) => {
+    const context = isTrackTheme ? useContext(Context)?.theme : undefined;
+    if (isTrackTheme && !context) {
+        throw new Error('Ensure that your code is wrapped with NativeProvider in App.js, and make sure you are not using the useTheme hook outside of the NativeProvider.');
+    }
+    return context;
+};
+
 export default useTheme;

package/src/index.d.ts

@@ -1,3 +1,3 @@
-declare module '@nexara/nativeflow' {
-    export { Button } from 'components/Button/Button';
+declare module '@nexara/nativeflow' {
+    export { Button } from 'components/Button/Button';
 }

package/src/index.ts

@@ -1,52 +1,52 @@
-export { default as NativeProvider } from './components/Provider/NativeProvider';
-export { horizontalScale, verticalScale, responsiveFontSize } from './helpers/ResponsiveCalculations';
-export { default as Chip } from './components/Chip/Chip';
-export { default as Radio } from './components/Radio';
-export { default as Button } from './components/Button/Button';
-
-export { default as Stack } from './components/Stack';
-export { StyledText, StyledView } from './components/StyledComponents';
-export { default as UserInput } from './components/UserInput/UserInput';
-export { default as Grid } from './components/Grid/Grid';
-export { default as Progress } from './components/Progress/Progress';
-// export { default as Slider } from './components/Slider/Slider';
-export { default as Surface } from './components/Surface/Surface';
-export { default as Switch } from './components/Switch/Switch';
-// export { default as TouchableRipple } from './components/TouchableRipple/TouchableRipple';
-export { Dialog, DialogHead, DialogBody, DialogFoot, DialogDescription } from './components/Dialog';
-export { default as CheckBox } from './components/CheckBox/CheckBox';
-export { default as Avatar } from './components/Avatar';
-export { default as Divider } from './components/Divider/Divider';
-export { Menu, MenuItem, MenuItemLabel } from './components/Menu';
-export { default as IconButton } from './components/IconButton/IconButton';
-export { default as Icon } from './components/Icon/Icon';
-export { default as PortalProvider } from './components/Portal/PortalProvider';
-export { default as Link } from './components/Link/Link';
-export { default as LightTheme } from './themes/LightTheme';
-export { default as DarkTheme } from './themes/DarkTheme';
-export { useColorScheme, useTheme } from './hooks';
-
-
-export type { ChipProps } from './components/Chip/Chip';
-export type { ButtonProps } from './components/Button/Button';
-export type { HStackProps } from './components/Stack';
-export type { VStackProps } from './components/Stack';
-export type { StyledTextProps, StyledViewProps } from './components/StyledComponents';
-export type { UserInputProps } from './components/UserInput/UserInput';
-export type { ProviderProps } from './components/Provider/NativeProvider';
-export type { GridProps } from './components/Grid/Grid';
-export type { ProgressProps } from './components/Progress/Progress';
-export type { SliderProps } from './components/Slider/Slider';
-export type { SurfaceProps } from './components/Surface/Surface';
-export type { SwitchProps } from './components/Switch/Switch';
-// export type { TouchableRippleProps } from './components/TouchableRipple/TouchableRipple';
-export type { DialogProps, DialogHeadProps, DialogBodyProps, DialogFootProps, DialogDescriptionProps } from './components/Dialog';
-export type { CheckBoxProps } from './components/CheckBox/CheckBox';
-export type { AvatarTextProps, AvatarImageProps } from './components/Avatar';
-export type { DividerProps } from './components/Divider/Divider';
-export type { MenuProps, MenuItemProps, MenuItemLabelProps } from './components/Menu';
-export type { IconButtonProps } from './components/IconButton/IconButton';
-export type { IconProps } from './components/Icon/Icon';
-export type { LinkProps } from './types/link.type';
-export type { RadioGroupProps, RadioItemProps } from './types/radio.type';
-// export type { PortalProviderProps } from './components/Portal/PortalProvider';
+export { default as NativeProvider } from './components/Provider/NativeProvider';
+export { horizontalScale, verticalScale, responsiveFontSize } from './helpers/ResponsiveCalculations';
+export { default as Chip } from './components/Chip/Chip';
+export { default as Radio } from './components/Radio';
+export { default as Button } from './components/Button/Button';
+
+export { default as Stack } from './components/Stack';
+export { StyledText, StyledView } from './components/StyledComponents';
+export { default as UserInput } from './components/UserInput/UserInput';
+export { default as Grid } from './components/Grid/Grid';
+export { default as Progress } from './components/Progress/Progress';
+// export { default as Slider } from './components/Slider/Slider';
+export { default as Surface } from './components/Surface/Surface';
+export { default as Switch } from './components/Switch/Switch';
+// export { default as TouchableRipple } from './components/TouchableRipple/TouchableRipple';
+export { Dialog, DialogHead, DialogBody, DialogFoot, DialogDescription } from './components/Dialog';
+export { default as CheckBox } from './components/CheckBox/CheckBox';
+export { default as Avatar } from './components/Avatar';
+export { default as Divider } from './components/Divider/Divider';
+export { Menu, MenuItem, MenuItemLabel } from './components/Menu';
+export { default as IconButton } from './components/IconButton/IconButton';
+export { default as Icon } from './components/Icon/Icon';
+export { default as PortalProvider } from './components/Portal/PortalProvider';
+export { default as Link } from './components/Link/Link';
+export { default as LightTheme } from './themes/LightTheme';
+export { default as DarkTheme } from './themes/DarkTheme';
+export { useColorScheme, useTheme } from './hooks';
+
+
+export type { ChipProps } from './components/Chip/Chip';
+export type { ButtonProps } from './components/Button/Button';
+export type { HStackProps } from './components/Stack';
+export type { VStackProps } from './components/Stack';
+export type { StyledTextProps, StyledViewProps } from './components/StyledComponents';
+export type { UserInputProps } from './components/UserInput/UserInput';
+export type { ProviderProps } from './components/Provider/NativeProvider';
+export type { GridProps } from './components/Grid/Grid';
+export type { ProgressProps } from './components/Progress/Progress';
+export type { SliderProps } from './components/Slider/Slider';
+export type { SurfaceProps } from './components/Surface/Surface';
+export type { SwitchProps } from './components/Switch/Switch';
+// export type { TouchableRippleProps } from './components/TouchableRipple/TouchableRipple';
+export type { DialogProps, DialogHeadProps, DialogBodyProps, DialogFootProps, DialogDescriptionProps } from './components/Dialog';
+export type { CheckBoxProps } from './components/CheckBox/CheckBox';
+export type { AvatarTextProps, AvatarImageProps } from './components/Avatar';
+export type { DividerProps } from './components/Divider/Divider';
+export type { MenuProps, MenuItemProps, MenuItemLabelProps } from './components/Menu';
+export type { IconButtonProps } from './components/IconButton/IconButton';
+export type { IconProps } from './components/Icon/Icon';
+export type { LinkProps } from './types/link.type';
+export type { RadioGroupProps, RadioItemProps } from './types/radio.type';
+// export type { PortalProviderProps } from './components/Portal/PortalProvider';