ui-rn 1.0.0 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -9,7 +9,7 @@ Example :
9
9
  ```tsx
10
10
  import {StyleSheet, Text, View} from 'react-native';
11
11
  import React from 'react';
12
- import Hexagon from 'ui-rn';
12
+ import {Block} from 'ui-rn';
13
13
  export default function App() {
14
14
  return (
15
15
  <View style={styles.container}>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ui-rn",
3
- "version": "1.0.0",
3
+ "version": "1.0.2",
4
4
  "repository": "https://github.com/phamha98/ui-rn",
5
5
  "description": "ui-rn",
6
6
  "author": "Phamha98",
@@ -55,7 +55,7 @@ export default class IconApp extends React.PureComponent<Props> {
55
55
  //@ts-ignore
56
56
  size={this.props.size}
57
57
  //@ts-ignore
58
- color={Colors[this.props.color] ?? this.props.color}
58
+ color={Colors(this.props.color) ?? this.props.color}
59
59
  name={this.props.name}
60
60
  onPress={this.props.onPress}
61
61
  style={this.props.style as any}
@@ -79,7 +79,7 @@ export default class IconApp extends React.PureComponent<Props> {
79
79
  <IconView //@ts-ignore
80
80
  size={this.props.size}
81
81
  //@ts-ignore
82
- color={Colors[this.props.color] ?? this.props.color}
82
+ color={Colors(this.props.color) ?? this.props.color}
83
83
  name={this.props.name}
84
84
  onPress={this.props.onPress}
85
85
  style={this.props.style as any}
@@ -64,7 +64,7 @@ export const Style: any = (props: Props) => {
64
64
  props.white && { backgroundColor: "white" }, props.black && { backgroundColor: "black" }, props.red && { backgroundColor: "red" },
65
65
  props.blue && { backgroundColor: "blue" }, props.green && { backgroundColor: "green" },
66
66
  props.yellow && { backgroundColor: "yellow" }, props.pink && { backgroundColor: "pink" },
67
- props.gray && { backgroundColor: "gray" }, props.primary && { backgroundColor: Colors['primary'] },
67
+ props.gray && { backgroundColor: "gray" }, props.primary && { backgroundColor: Colors('primary') },
68
68
  //
69
69
  props.positionOption && {
70
70
  position: 'absolute',
package/src/config.ts CHANGED
@@ -1,5 +1,16 @@
1
- export const Colors = {
2
- primary: 'blue'
1
+ export const Colors = (e) => {
2
+ return e
3
+ }
4
+ export const Language = (e) => {
5
+ return e
6
+ }
7
+ export type IColor = keyof typeof COLOR
8
+ export type ILanguage = keyof typeof LANG
9
+ export const COLOR = {
10
+
11
+ }
12
+ export const LANG = {
13
+
3
14
  }
4
15
  export const Icons = {
5
16
  menu: "menu",
@@ -0,0 +1,31 @@
1
+ import React from 'react'
2
+ import { TextProps, TextStyle } from 'react-native'
3
+ import { IColor, ILanguage } from '../config'
4
+ interface PropsParent {
5
+ children?: React.ReactNode
6
+ bold?: boolean | TextStyle['fontWeight']
7
+ center?: boolean
8
+ italic?: boolean
9
+ underline?: boolean
10
+ size?: number | Array<size>
11
+ color?: string | Array<IColor>
12
+ toUpperCase?: boolean
13
+ toLowerCase?: boolean
14
+ flex1?: boolean; flex2?: boolean; flex3?: boolean; flex4?: boolean; flex5?: boolean; flex6?: boolean; flex7?: boolean; flex8?: boolean; flex9?: boolean;
15
+ background?: string | Array<ILanguage>
16
+ }
17
+ export interface Props extends TextProps, PropsParent {
18
+ backgroundColor?: string
19
+ primary?: boolean
20
+ white?: boolean
21
+ red?: boolean
22
+ blue?: boolean
23
+ green?: boolean
24
+ yellow?: boolean
25
+ pink?: boolean
26
+ gray?: boolean
27
+ black?: boolean
28
+ /** Lang in file VI/EN */
29
+ lang?: ILanguage
30
+ }
31
+ type size = 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25
@@ -0,0 +1,40 @@
1
+ import { Colors } from "../config";
2
+ import { StyleProp, ViewStyle, StyleSheet } from "react-native";
3
+ import { isArray, isEmpty, isNumber, isObject, isString } from "underscore";
4
+ import { Props } from './Props'
5
+ export const Style: any = (props: Props, ColorApp = Colors) => {
6
+ const PropsConvert = StyleSheet.flatten([
7
+ props.color && { color: switchArrayValueFromData(props.color, ColorApp) },
8
+ props.background && { backgroundColor: props.background },
9
+ props.size && { fontSize: props.size },
10
+ props.center && { textAlign: 'center' },
11
+ props.italic && { fontStyle: 'italic' },
12
+ props.bold && { fontWeight: typeof props.bold == "boolean" ? '500' : props.bold },
13
+ props.underline && { textDecorationLine: 'underline' },
14
+ props.toUpperCase && { textTransform: 'uppercase' },
15
+ props.toLowerCase && { textTransform: 'lowercase' },
16
+ props.white && { color: "white" }, props.red && { color: "red" },
17
+ props.blue && { color: "blue" }, props.green && { color: "green" },
18
+ props.yellow && { color: "yellow" }, props.pink && { color: "pink" },
19
+ props.gray && { color: "gray" }, props.primary && { color: Colors('primary') },
20
+ props.black && { color: "black" },
21
+ props.flex1 && { flex: 1 }, props.flex2 && { flex: 2 }, props.flex3 && { flex: 3 },
22
+ props.flex4 && { flex: 4 }, props.flex5 && { flex: 5 }, props.flex6 && { flex: 6 },
23
+ props.flex7 && { flex: 7 }, props.flex8 && { flex: 8 }, props.flex9 && { flex: 9 },
24
+
25
+ ])
26
+ const PropsApp = StyleSheet.flatten([
27
+
28
+ ])
29
+ return [
30
+ PropsApp,
31
+ PropsConvert,
32
+ ]
33
+ }
34
+
35
+ const switchArrayValueFromData = (value: any, ColorApp = Colors) => {
36
+ if (isArray(value) && value.length == 1) return ColorApp(value[0])
37
+ if (isString(value) || isNumber(value)) return value
38
+ return undefined
39
+ }
40
+
@@ -0,0 +1,42 @@
1
+ import { Colors, Language } from '../config'
2
+ import React, { isValidElement } from 'react'
3
+ import { StyleSheet, Text, View } from 'react-native'
4
+ import { Style } from './Style'
5
+ import { Props } from './Props'
6
+ import { isArray, isObject } from 'underscore'
7
+ const TextApp: React.FC<Props> = ({ style, children, ...props }) => {
8
+ const Children = () => {
9
+ const content = props?.lang ? Language(props?.lang) : undefined
10
+ if (typeof content !== 'undefined') {
11
+ if (typeof content == 'string' || typeof content == 'number' || isArray(children)) return content
12
+ if (typeof content == 'function') return "Error content == 'function'"
13
+ if (isObject(children)) return JSON.stringify(children)
14
+ if (isValidElement(content)) return content
15
+ return React.createElement(Text, {})
16
+ }
17
+ if (typeof children !== 'undefined') {
18
+ if (typeof children == 'string' || typeof children == 'number' || isArray(children)) return children
19
+ if (isObject(children)) return JSON.stringify(children)
20
+ if (typeof children == "function") return "Error children == 'function'"
21
+ if (isValidElement(children)) return children
22
+ return React.createElement(Text, {}, children)
23
+ }
24
+ }
25
+ return (
26
+ <Text
27
+ // adjustsFontSizeToFit
28
+ // selectable
29
+ style={[styles.default, Style(props), style]}{...props}>
30
+ {Children()}
31
+ </Text>
32
+ )
33
+ }
34
+ export default TextApp
35
+ const styles = StyleSheet.create({
36
+ default: {
37
+ fontWeight: '300',
38
+ color: Colors('black'),
39
+ fontSize: 15,
40
+ paddingTop: 2
41
+ },
42
+ })
@@ -0,0 +1 @@
1
+ export { default as TextApp } from './TextApp'