ui-rn 2.0.7 → 2.0.9

package/Example.tsx

@@ -1,6 +1,6 @@
 import { StyleSheet, View } from 'react-native'
 import React from 'react'
-import { Text, Block, Icon } from './dist'
+import { Text, Block, Icon } from './src'
 
 export default function Example() {
   return (
@@ -11,5 +11,3 @@ export default function Example() {
     </View>
   )
 }
-
-const styles = StyleSheet.create({})

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ui-rn",
-  "version": "2.0.7",
+  "version": "2.0.9",
   "repository": "https://github.com/package-dev/ui-rn",
   "description": "ui-rn",
   "author": "Phamha98",

package/src/Icon/index.tsx

@@ -1,3 +1,4 @@
+//@ts-nocheck
 import React from "react";
 import { StyleSheet, TouchableOpacity } from "react-native";
 import Ionicons from "react-native-vector-icons/Ionicons";

package/src/Layout.tsx

@@ -1,24 +1,25 @@
-import React from "react";
-import SafeAreaView, { ForceInsetProp } from "react-native-safe-area-view";
-import { StyleProp, ViewStyle } from "react-native";
-export interface LayoutAppProps {
+import React from 'react';
+import SafeAreaView, { ForceInsetProp } from 'react-native-safe-area-view';
+import { StyleProp, ViewStyle } from 'react-native';
+export interface ILayout {
   children?: any;
   forceInset?: ForceInsetProp;
   forceInsetBot?: ForceInsetProp;
-  styleBot?: StyleProp<ViewStyle> | undefined;
+  styleBottom?: StyleProp<ViewStyle> | undefined;
   style?: StyleProp<ViewStyle> | undefined;
-  isBack?: boolean;
-  disable?: boolean;
+  primary?: string;
+  bottomInset?: boolean;
+
 }
 export default function Layout({
   children,
-  forceInset = { top: "always", horizontal: "never", bottom: "never" },
-  forceInsetBot = { vertical: "never" },
-  styleBot,
+  forceInset = { top: 'always', horizontal: 'never', bottom: 'never' },
+  forceInsetBot = { vertical: 'never' },
+  styleBottom,
   style,
-  disable,
-}: LayoutAppProps) {
-  if (disable) return <>{children}</>;
+  primary,
+  bottomInset
+}: ILayout) {
   return (
     <SafeAreaView
       style={[
@@ -26,6 +27,9 @@ export default function Layout({
           flex: 1,
         },
         style,
+        primary && {
+          backgroundColor: primary
+        }
       ]}
       forceInset={forceInset}
     >
@@ -33,13 +37,14 @@ export default function Layout({
         style={[
           {
             flex: 1,
+            backgroundColor: 'white'
           },
-          styleBot,
+          styleBottom,
         ]}
-        forceInset={forceInsetBot}
+        forceInset={{ ...(bottomInset || styleBottom) && { vertical: 'never', bottom: 'always' }, ...forceInsetBot }}
       >
         {children}
       </SafeAreaView>
-    </SafeAreaView>
+    </SafeAreaView >
   );
 }

package/src/index.tsx

@@ -1,4 +1,5 @@
 export { default as Touch } from './Touch/Touch'
+export { default as TouchScale } from './Touch/TouchScale'
 export { default as Block } from './Touch/Block'
 export { default as Text } from './Text'
 export { default as Icon } from './Icon'

package/dist/Example.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export default function Example(): React.JSX.Element;

package/dist/Example.js

@@ -1,11 +0,0 @@
-import { StyleSheet, View } from 'react-native';
-import React from 'react';
-import { Text, Block, Icon } from './src/index';
-export default function Example() {
-    return (<View>
-      <Block pad-40/>
-      <Text pink color='red'/>
-      <Icon name='red'/>
-    </View>);
-}
-const styles = StyleSheet.create({});

package/dist/Icon/PropsStyle.d.ts

@@ -1,15 +0,0 @@
-import { RNVectorIcon } from "./index";
-import { FlexStyle, StyleProp, TextStyle, ViewStyle } from 'react-native';
-import { MakeProp } from "./makeProps";
-export interface Props extends MakeProp {
-    name: string;
-    size?: number;
-    type?: keyof typeof RNVectorIcon;
-    onPress?: () => void;
-    styleContainer?: StyleProp<ViewStyle>;
-    style?: StyleProp<TextStyle>;
-    alignSelf?: FlexStyle['alignSelf'];
-    disabled?: boolean;
-    activeOpacity?: number;
-    color?: string;
-}

package/dist/Icon/PropsStyle.js

@@ -1 +0,0 @@
-export {};

package/dist/Icon/index.d.ts

@@ -1,33 +0,0 @@
-import React from "react";
-import Ionicons from "react-native-vector-icons/Ionicons";
-import FontAwesome5 from "react-native-vector-icons/FontAwesome5";
-/**
- * Collection of React Native Vector Icons
- * Provides access to various icon sets from react-native-vector-icons
- */
-export declare const RNVectorIcon: {
-    Ionicons: typeof Ionicons;
-    AntDesign: typeof Ionicons;
-    Entypo: typeof Ionicons;
-    EvilIcons: typeof Ionicons;
-    MaterialIcons: typeof Ionicons;
-    MaterialCommunityIcons: typeof Ionicons;
-    FontAwesome: typeof Ionicons;
-    FontAwesome5: typeof FontAwesome5;
-    SimpleLineIcons: typeof Ionicons;
-    Feather: typeof Ionicons;
-    Octicons: typeof Ionicons;
-    Fontisto: typeof Ionicons;
-};
-export type IconType = keyof typeof RNVectorIcon;
-import { Props } from "./PropsStyle";
-export default class IconApp extends React.PureComponent<Props> {
-    static defaultProps: Props;
-    res: {
-        color: string;
-        style: any;
-        size: number;
-    };
-    constructor(props: Props);
-    render(): React.JSX.Element | null;
-}

package/dist/Icon/index.js

@@ -1,72 +0,0 @@
-import React from "react";
-import { StyleSheet, TouchableOpacity } from "react-native";
-import Ionicons from "react-native-vector-icons/Ionicons";
-import EvilIcons from "react-native-vector-icons/EvilIcons";
-import FontAwesome from "react-native-vector-icons/FontAwesome";
-import FontAwesome5 from "react-native-vector-icons/FontAwesome5";
-import MaterialCommunityIcons from "react-native-vector-icons/MaterialCommunityIcons";
-import MaterialIcons from "react-native-vector-icons/MaterialIcons";
-import Entypo from "react-native-vector-icons/Entypo";
-import AntDesign from "react-native-vector-icons/AntDesign";
-import SimpleLineIcons from "react-native-vector-icons/SimpleLineIcons";
-import Feather from "react-native-vector-icons/Feather";
-import Octicons from "react-native-vector-icons/Octicons";
-import Fontisto from "react-native-vector-icons/Fontisto";
-/**
- * Collection of React Native Vector Icons
- * Provides access to various icon sets from react-native-vector-icons
- */
-export const RNVectorIcon = {
-    Ionicons,
-    AntDesign,
-    Entypo,
-    EvilIcons,
-    MaterialIcons,
-    MaterialCommunityIcons,
-    FontAwesome,
-    FontAwesome5,
-    SimpleLineIcons,
-    Feather,
-    Octicons,
-    Fontisto,
-};
-import { makeProps } from "./makeProps";
-export default class IconApp extends React.PureComponent {
-    static defaultProps = {
-        size: 23,
-        color: "gray",
-        name: "home",
-    };
-    res;
-    constructor(props) {
-        super(props);
-        this.res = makeProps(props);
-    }
-    render() {
-        const { size, color, style } = this.res;
-        if (this.props.name === "none")
-            return null;
-        const IconView = RNVectorIcon[this.props.type || "Ionicons"];
-        if (typeof this.props.onPress != "function") {
-            return (<IconView size={size} color={color} style={style} name={this.props.name} onPress={this.props.onPress}/>);
-        }
-        return (<TouchableOpacity activeOpacity={this.props.activeOpacity || 0.5} disabled={typeof this.props.onPress == "function" ? this.props.disabled : true} style={[
-                styles.container,
-                { ...(this.props.alignSelf && { alignSelf: this.props.alignSelf }) },
-                this.props.style,
-                this.props.styleContainer,
-            ]}>
-        <IconView size={size} color={color} style={style} name={this.props.name} onPress={this.props.onPress}/>
-      </TouchableOpacity>);
-    }
-}
-/**
- * Default styles for the IconApp component
- */
-const styles = StyleSheet.create({
-    container: {
-        alignItems: "center",
-        justifyContent: "center",
-        alignSelf: "flex-start",
-    },
-});

package/dist/Icon/makeProps.d.ts

@@ -1,37 +0,0 @@
-import { ViewStyle } from "react-native";
-declare enum COLORS {
-    white = 1,
-    red = 2,
-    blue = 3,
-    black = 4,
-    green = 5,
-    yellow = 6,
-    pink = 7,
-    gray = 8,
-    primary = 9
-}
-type ColorKey = keyof typeof COLORS;
-type ColorModifiers = Partial<Record<ColorKey, boolean>>;
-declare const PROPS: {
-    readonly mar: "margin";
-    readonly marH: "marginHorizontal";
-    readonly marV: "marginVertical";
-    readonly marL: "marginLeft";
-    readonly marT: "marginTop";
-    readonly marR: "marginRight";
-    readonly marB: "marginBottom";
-    readonly zIndex: "zIndex";
-    readonly opacity: "opacity";
-    readonly size: "size";
-};
-export type ShortKey = keyof typeof PROPS;
-export type Convert<T extends string> = Partial<Record<T, boolean | number | string>>;
-export type MakeProp = Convert<ShortKey> & ColorModifiers;
-type Result = {
-    size: number;
-    color: string;
-    name: string;
-    style: ViewStyle;
-};
-export declare const makeProps: (props: Record<string, any>) => Result;
-export {};

package/dist/Icon/makeProps.js

@@ -1,64 +0,0 @@
-import { StyleSheet } from "react-native";
-var COLORS;
-(function (COLORS) {
-    COLORS[COLORS["white"] = 1] = "white";
-    COLORS[COLORS["red"] = 2] = "red";
-    COLORS[COLORS["blue"] = 3] = "blue";
-    COLORS[COLORS["black"] = 4] = "black";
-    COLORS[COLORS["green"] = 5] = "green";
-    COLORS[COLORS["yellow"] = 6] = "yellow";
-    COLORS[COLORS["pink"] = 7] = "pink";
-    COLORS[COLORS["gray"] = 8] = "gray";
-    COLORS[COLORS["primary"] = 9] = "primary";
-})(COLORS || (COLORS = {}));
-const PROPS = {
-    mar: "margin",
-    marH: "marginHorizontal",
-    marV: "marginVertical",
-    marL: "marginLeft",
-    marT: "marginTop",
-    marR: "marginRight",
-    marB: "marginBottom",
-    zIndex: "zIndex",
-    opacity: "opacity",
-    size: "size",
-};
-/** type guards */
-const isColorKey = (key) => key in COLORS;
-const isShortKey = (key) => key in PROPS;
-export const makeProps = (props) => {
-    const style = {};
-    const res = {
-        size: props.size ?? 23,
-        color: props.color ?? "gray",
-        name: props.name ?? "home",
-    };
-    Object.keys(props).forEach((key) => {
-        const match = key.match(/^(\w+)-(\w+)$/);
-        // color modifier
-        if (isColorKey(key)) {
-            res.color = key;
-            return;
-        }
-        if (match) {
-            const rawKey = match[1];
-            const rawValue = match[2];
-            const value = isNaN(Number(rawValue))
-                ? rawValue
-                : Number(rawValue);
-            if (rawKey === "size") {
-                res.size = Number(rawValue);
-            }
-            else if (rawKey === "color") {
-                res.color = rawValue;
-            }
-            else if (isShortKey(rawKey)) {
-                style[PROPS[rawKey]] = value;
-            }
-        }
-    });
-    return {
-        ...res,
-        style: StyleSheet.create({ style }).style,
-    };
-};

package/dist/Layout.d.ts

@@ -1,13 +0,0 @@
-import React from "react";
-import { ForceInsetProp } from "react-native-safe-area-view";
-import { StyleProp, ViewStyle } from "react-native";
-export interface LayoutAppProps {
-    children?: any;
-    forceInset?: ForceInsetProp;
-    forceInsetBot?: ForceInsetProp;
-    styleBot?: StyleProp<ViewStyle> | undefined;
-    style?: StyleProp<ViewStyle> | undefined;
-    isBack?: boolean;
-    disable?: boolean;
-}
-export default function Layout({ children, forceInset, forceInsetBot, styleBot, style, disable, }: LayoutAppProps): React.JSX.Element;

package/dist/Layout.js

@@ -1,21 +0,0 @@
-import React from "react";
-import SafeAreaView from "react-native-safe-area-view";
-export default function Layout({ children, forceInset = { top: "always", horizontal: "never", bottom: "never" }, forceInsetBot = { vertical: "never" }, styleBot, style, disable, }) {
-    if (disable)
-        return <>{children}</>;
-    return (<SafeAreaView style={[
-            {
-                flex: 1,
-            },
-            style,
-        ]} forceInset={forceInset}>
-      <SafeAreaView style={[
-            {
-                flex: 1,
-            },
-            styleBot,
-        ]} forceInset={forceInsetBot}>
-        {children}
-      </SafeAreaView>
-    </SafeAreaView>);
-}

package/dist/Text/Props.d.ts

@@ -1,29 +0,0 @@
-import React from 'react';
-import { TextProps, TextStyle } from 'react-native';
-import { MakeProp } from './makeStyle';
-interface PropsParent {
-    children?: React.ReactNode;
-    bold?: boolean | TextStyle['fontWeight'];
-    center?: boolean;
-    italic?: boolean;
-    underline?: boolean;
-    color?: string;
-    toUpperCase?: boolean;
-    toLowerCase?: boolean;
-    background?: string;
-}
-export interface Props extends TextProps, PropsParent, MakeProp {
-    backgroundColor?: string;
-    primary?: boolean;
-    white?: boolean;
-    red?: boolean;
-    blue?: boolean;
-    green?: boolean;
-    yellow?: boolean;
-    pink?: boolean;
-    gray?: boolean;
-    black?: boolean;
-    lang?: string;
-    content?: string;
-}
-export {};

package/dist/Text/Props.js

@@ -1 +0,0 @@
-export {};

package/dist/Text/Style.d.ts

@@ -1 +0,0 @@
-export declare const Style: any;

package/dist/Text/Style.js

@@ -1,17 +0,0 @@
-import { StyleSheet } from "react-native";
-import { makeStyle } from "./makeStyle";
-export const Style = (props) => {
-    const PropsConvert = StyleSheet.flatten([
-        props.color && { color: props.color },
-        props.center && { textAlign: 'center' },
-        props.italic && { fontStyle: 'italic' },
-        props.bold && { fontWeight: typeof props.bold == "boolean" ? '500' : props.bold },
-        props.underline && { textDecorationLine: 'underline' },
-        props.toUpperCase && { textTransform: 'uppercase' },
-        props.toLowerCase && { textTransform: 'lowercase' },
-    ]);
-    return [
-        makeStyle(props),
-        PropsConvert,
-    ];
-};

package/dist/Text/index.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import { Props } from "./Props";
-declare const TextApp: React.FC<Props>;
-export default TextApp;

package/dist/Text/index.js

@@ -1,44 +0,0 @@
-import React, { isValidElement } from "react";
-import { StyleSheet, Text } from "react-native";
-import { Style } from "./Style";
-import { isArray, isObject } from "underscore";
-const TextApp = ({ style, children, ...props }) => {
-    const Children = () => {
-        const content = props?.lang ?? undefined;
-        if (typeof content !== "undefined") {
-            if (typeof content == "string" ||
-                typeof content == "number" ||
-                isArray(children))
-                return content;
-            if (typeof content == "function")
-                return "Error content == 'function'";
-            if (isObject(children))
-                return JSON.stringify(children);
-            if (isValidElement(content))
-                return content;
-            return React.createElement(Text, {});
-        }
-        if (typeof children !== "undefined") {
-            if (typeof children == "string" ||
-                typeof children == "number" ||
-                isArray(children))
-                return children;
-            if (isObject(children))
-                return JSON.stringify(children);
-            if (typeof children == "function")
-                return "Error children == 'function'";
-            if (isValidElement(children))
-                return children;
-            return React.createElement(Text, {}, children);
-        }
-    };
-    return (<Text style={[styles.default, Style(props), style]} {...props}>
-      {Children()}
-    </Text>);
-};
-export default TextApp;
-const styles = StyleSheet.create({
-    default: {
-        fontSize: 14,
-    },
-});

package/dist/Text/makeStyle.d.ts

@@ -1,63 +0,0 @@
-import { TextStyle } from "react-native";
-declare enum COLORS {
-    "white" = 1,
-    "red" = 2,
-    "blue" = 3,
-    "black" = 4,
-    "green" = 5,
-    "yellow" = 6,
-    "pink" = 7,
-    "gray" = 8,
-    "primary" = 9
-}
-declare const PROPS: {
-    readonly bg: "backgroundColor";
-    readonly background: "backgroundColor";
-    readonly color: "color";
-    readonly w: "width";
-    readonly width: "width";
-    readonly minW: "minWidth";
-    readonly maxW: "maxWidth";
-    readonly h: "height";
-    readonly height: "height";
-    readonly minH: "minHeight";
-    readonly maxH: "maxHeight";
-    readonly pad: "padding";
-    readonly padH: "paddingHorizontal";
-    readonly padV: "paddingVertical";
-    readonly padL: "paddingLeft";
-    readonly padT: "paddingTop";
-    readonly padR: "paddingRight";
-    readonly padB: "paddingBottom";
-    readonly mar: "margin";
-    readonly marH: "marginHorizontal";
-    readonly marV: "marginVertical";
-    readonly marL: "marginLeft";
-    readonly marT: "marginTop";
-    readonly marR: "marginRight";
-    readonly marB: "marginBottom";
-    readonly border: "borderWidth";
-    readonly borderW: "borderWidth";
-    readonly borderR: "borderRadius";
-    readonly borderC: "borderColor";
-    readonly borderLW: "borderLeftWidth";
-    readonly borderTW: "borderTopWidth";
-    readonly borderRW: "borderRightWidth";
-    readonly borderBW: "borderBottomWidth";
-    readonly flex: "flex";
-    readonly zIndex: "zIndex";
-    readonly left: "left";
-    readonly top: "top";
-    readonly bottom: "bottom";
-    readonly right: "right";
-    readonly opacity: "opacity";
-    readonly size: "fontSize";
-};
-export type ColorKey = keyof typeof COLORS;
-export type ShortKey = keyof typeof PROPS;
-export type Convert<T extends string> = Partial<Record<T, boolean | number | string>>;
-export type MakeProp = Partial<Record<ShortKey, number | string>> & Partial<Record<ColorKey, boolean>> & Record<string, any>;
-export declare const makeStyle: (props: {
-    [key: string]: any;
-}) => TextStyle;
-export {};

package/dist/Text/makeStyle.js

@@ -1,91 +0,0 @@
-import { StyleSheet } from "react-native";
-import { isNaN } from "underscore";
-var COLORS;
-(function (COLORS) {
-    COLORS[COLORS["white"] = 1] = "white";
-    COLORS[COLORS["red"] = 2] = "red";
-    COLORS[COLORS["blue"] = 3] = "blue";
-    COLORS[COLORS["black"] = 4] = "black";
-    COLORS[COLORS["green"] = 5] = "green";
-    COLORS[COLORS["yellow"] = 6] = "yellow";
-    COLORS[COLORS["pink"] = 7] = "pink";
-    COLORS[COLORS["gray"] = 8] = "gray";
-    COLORS[COLORS["primary"] = 9] = "primary";
-})(COLORS || (COLORS = {}));
-const PROPS = {
-    bg: "backgroundColor",
-    background: "backgroundColor",
-    color: "color",
-    w: "width",
-    width: "width",
-    minW: "minWidth",
-    maxW: "maxWidth",
-    h: "height",
-    height: "height",
-    minH: "minHeight",
-    maxH: "maxHeight",
-    pad: "padding",
-    padH: "paddingHorizontal",
-    padV: "paddingVertical",
-    padL: "paddingLeft",
-    padT: "paddingTop",
-    padR: "paddingRight",
-    padB: "paddingBottom",
-    mar: "margin",
-    marH: "marginHorizontal",
-    marV: "marginVertical",
-    marL: "marginLeft",
-    marT: "marginTop",
-    marR: "marginRight",
-    marB: "marginBottom",
-    border: 'borderWidth',
-    borderW: 'borderWidth',
-    borderR: "borderRadius",
-    borderC: "borderColor",
-    borderLW: "borderLeftWidth",
-    borderTW: "borderTopWidth",
-    borderRW: "borderRightWidth",
-    borderBW: "borderBottomWidth",
-    flex: 'flex',
-    zIndex: 'zIndex',
-    left: 'left',
-    top: 'top',
-    bottom: 'bottom',
-    right: 'right',
-    opacity: 'opacity',
-    size: 'fontSize'
-};
-const isColorKey = (key) => {
-    return key in COLORS;
-};
-const isShortKey = (key) => {
-    return key in PROPS;
-};
-export const makeStyle = (props) => {
-    const style = {};
-    Object.keys(props).forEach((key) => {
-        const match = key.match(/^(\w+)-(\w+)$/);
-        if (isColorKey(key)) {
-            style.color = key;
-            return;
-        }
-        if (match) {
-            const [, rawKey, rawValue] = match;
-            const value = isNaN(Number(rawValue))
-                ? rawValue
-                : Number(rawValue);
-            if (isShortKey(rawKey)) {
-                style[PROPS[rawKey]] = value;
-            }
-            else {
-                style[rawKey] = value;
-            }
-            return;
-        }
-        // 🔹 Normal props
-        if (isShortKey(key)) {
-            style[PROPS[key]] = props[key];
-        }
-    });
-    return StyleSheet.create({ style }).style;
-};

package/dist/Touch/Block.d.ts

@@ -1,5 +0,0 @@
-import React from "react";
-import { View } from "react-native";
-import { Props } from "./Props";
-declare const Block: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<View>>;
-export default Block;

package/dist/Touch/Block.js

@@ -1,11 +0,0 @@
-import React from "react";
-import { View } from "react-native";
-import { Style } from "./Style";
-const Block = React.forwardRef(({ style, ...props }, ref) => {
-    if (props?.hidden)
-        return <></>;
-    return (<View ref={ref} style={[Style(props), style]} {...props}>
-        {props.children}
-      </View>);
-});
-export default Block;