ui-rn 1.0.1 → 1.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ui-rn",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "repository": "https://github.com/phamha98/ui-rn",
   "description": "ui-rn",
   "author": "Phamha98",

package/src/Icon/index.tsx

@@ -55,7 +55,7 @@ export default class IconApp extends React.PureComponent<Props> {
                     //@ts-ignore
                     size={this.props.size}
                     //@ts-ignore
-                    color={Colors[this.props.color] ?? this.props.color}
+                    color={Colors(this.props.color) ?? this.props.color}
                     name={this.props.name}
                     onPress={this.props.onPress}
                     style={this.props.style as any}
@@ -79,7 +79,7 @@ export default class IconApp extends React.PureComponent<Props> {
                 <IconView //@ts-ignore
                     size={this.props.size}
                     //@ts-ignore
-                    color={Colors[this.props.color] ?? this.props.color}
+                    color={Colors(this.props.color) ?? this.props.color}
                     name={this.props.name}
                     onPress={this.props.onPress}
                     style={this.props.style as any}

package/src/Touch/Style.ts

@@ -64,7 +64,7 @@ export const Style: any = (props: Props) => {
     props.white && { backgroundColor: "white" }, props.black && { backgroundColor: "black" }, props.red && { backgroundColor: "red" },
     props.blue && { backgroundColor: "blue" }, props.green && { backgroundColor: "green" },
     props.yellow && { backgroundColor: "yellow" }, props.pink && { backgroundColor: "pink" },
-    props.gray && { backgroundColor: "gray" }, props.primary && { backgroundColor: Colors['primary'] },
+    props.gray && { backgroundColor: "gray" }, props.primary && { backgroundColor: Colors('primary') },
     //
     props.positionOption && {
       position: 'absolute',

package/src/config.ts

@@ -1,5 +1,16 @@
-export const Colors = {
-    primary: 'blue'
+export const Colors = (e) => {
+    return e
+}
+export const Language = (e) => {
+    return e
+}
+export type IColor = keyof typeof COLOR
+export type ILanguage = keyof typeof LANG
+export const COLOR = {
+
+}
+export const LANG = {
+
 }
 export const Icons = {
     menu: "menu",

package/src/text/Props.ts

@@ -0,0 +1,31 @@
+import React from 'react'
+import { TextProps, TextStyle } from 'react-native'
+import { IColor, ILanguage } from '../config'
+interface PropsParent {
+    children?: React.ReactNode
+    bold?: boolean | TextStyle['fontWeight']
+    center?: boolean
+    italic?: boolean
+    underline?: boolean
+    size?: number | Array<size>
+    color?: string | Array<IColor>
+    toUpperCase?: boolean
+    toLowerCase?: boolean
+    flex1?: boolean; flex2?: boolean; flex3?: boolean; flex4?: boolean; flex5?: boolean; flex6?: boolean; flex7?: boolean; flex8?: boolean; flex9?: boolean;
+    background?: string | Array<ILanguage>
+}
+export interface Props extends TextProps, PropsParent {
+    backgroundColor?: string
+    primary?: boolean
+    white?: boolean
+    red?: boolean
+    blue?: boolean
+    green?: boolean
+    yellow?: boolean
+    pink?: boolean
+    gray?: boolean
+    black?: boolean
+    /** Lang in file VI/EN */
+    lang?: ILanguage
+}
+type size = 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25

package/src/text/Style.ts

@@ -0,0 +1,40 @@
+import { Colors } from "../config";
+import { StyleProp, ViewStyle, StyleSheet } from "react-native";
+import { isArray, isEmpty, isNumber, isObject, isString } from "underscore";
+import { Props } from './Props'
+export const Style: any = (props: Props, ColorApp = Colors) => {
+    const PropsConvert = StyleSheet.flatten([
+        props.color && { color: switchArrayValueFromData(props.color, ColorApp) },
+        props.background && { backgroundColor: props.background },
+        props.size && { fontSize: props.size },
+        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' },
+        props.white && { color: "white" }, props.red && { color: "red" },
+        props.blue && { color: "blue" }, props.green && { color: "green" },
+        props.yellow && { color: "yellow" }, props.pink && { color: "pink" },
+        props.gray && { color: "gray" }, props.primary && { color: Colors('primary') },
+        props.black && { color: "black" },
+        props.flex1 && { flex: 1 }, props.flex2 && { flex: 2 }, props.flex3 && { flex: 3 },
+        props.flex4 && { flex: 4 }, props.flex5 && { flex: 5 }, props.flex6 && { flex: 6 },
+        props.flex7 && { flex: 7 }, props.flex8 && { flex: 8 }, props.flex9 && { flex: 9 },
+
+    ])
+    const PropsApp = StyleSheet.flatten([
+
+    ])
+    return [
+        PropsApp,
+        PropsConvert,
+    ]
+}
+
+const switchArrayValueFromData = (value: any, ColorApp = Colors) => {
+    if (isArray(value) && value.length == 1) return ColorApp(value[0])
+    if (isString(value) || isNumber(value)) return value
+    return undefined
+}
+

package/src/text/TextApp.tsx

@@ -0,0 +1,42 @@
+import { Colors, Language } from '../config'
+import React, { isValidElement } from 'react'
+import { StyleSheet, Text, View } from 'react-native'
+import { Style } from './Style'
+import { Props } from './Props'
+import { isArray, isObject } from 'underscore'
+const TextApp: React.FC<Props> = ({ style, children, ...props }) => {
+  const Children = () => {
+    const content = props?.lang ? Language(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
+      // adjustsFontSizeToFit
+      // selectable
+      style={[styles.default, Style(props), style]}{...props}>
+      {Children()}
+    </Text>
+  )
+}
+export default TextApp
+const styles = StyleSheet.create({
+  default: {
+    fontWeight: '300',
+    color: Colors('black'),
+    fontSize: 15,
+    paddingTop: 2
+  },
+})

package/src/text/index.tsx

@@ -0,0 +1 @@
+export { default as TextApp } from './TextApp'