#145 fixed PropTypes

.eslintrc.js

@@ -0,0 +1,54 @@
+module.exports = {
+    parserOptions: {
+        sourceType: "module",
+        allowImportExportEverywhere: true,
+        ecmaVersion: 13,
+        ecmaFeatures: {
+            jsx: true
+        }
+    },
+    plugins: ["import", "react"],
+    rules: {
+        "max-len": ["warn", 150],
+        "max-statements-per-line": ["warn", {max: 1}],
+        semi: ["error", "always"],
+        "comma-dangle": ["warn"],
+        "no-multiple-empty-lines": "off",
+        indent: ["warn", 4, {SwitchCase: 1}],
+
+        /* variables */
+        "no-var": "error",
+        "prefer-const": "warn",
+        "no-const-assign": "error",
+        "no-unused-vars": ["warn", {vars: "local", args: "none"}],
+        "react/jsx-uses-vars": "error",
+
+        /* literals */
+        "prefer-regex-literals": "warn",
+        "quotes": ["warn", "double"],
+
+        /* imports */
+        "import/no-relative-parent-imports": "error",
+        "no-duplicate-imports": ["error"],
+        "react/jsx-uses-react": "error",
+
+        /* if else */
+        "no-else-return": ["warn", {allowElseIf: false}],
+        "no-lonely-if": ["warn"],
+
+        /* function */
+        "prefer-arrow-callback": "warn",
+        "arrow-parens": ["off"],
+        "arrow-spacing": ["warn", {before: true, after: true}],
+        "func-call-spacing": ["warn", "never"],
+
+        /* object */
+        "key-spacing": ["warn", {beforeColon: false, afterColon: true}],
+        "object-curly-spacing": ["warn", "never"],
+
+        /* other spacing */
+        "keyword-spacing": ["warn"],
+        "array-bracket-spacing": ["warn", "never"],
+        "comma-spacing": ["warn", {after: true}]
+    }
+};

.gitignore

@@ -5,4 +5,8 @@ dist/
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-example/
+example/
+
+
+# WebStorm
+.idea/

components/ScalableView.jsx

@@ -0,0 +1,25 @@
+import React from "react";
+import {Animated} from "react-native";
+
+
+export const ScalableView = React.forwardRef(({children}, ref) => {
+    const avScale = React.useRef(new Animated.Value(1)).current;
+
+    React.useImperativeHandle(ref, () => ({
+        setScale: (scale) => avScale.setValue(scale)
+    }));
+
+    const animateStyle = {
+        transform: [{scale: avScale}]
+    };
+
+
+    return (
+        <Animated.View
+            style={animateStyle}
+            renderToHardwareTextureAndroid={true}
+        >
+            {children}
+        </Animated.View>
+    );
+});

components/cell.js

@@ -1,50 +1,55 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { View, Text, StyleSheet } from 'react-native';
+import React, {Component} from "react";
+import PropTypes from "prop-types";
+import {View, Text, StyleSheet} from "react-native";
+
 
 export class Cell extends Component {
-  static propTypes = {
-    style: PropTypes.object,
-    textStyle: PropTypes.object,
-    borderStyle: PropTypes.object
-  };
+    static propTypes = {
+        data: PropTypes.any,
+        width: PropTypes.number,
+        height: PropTypes.number,
+        flex: PropTypes.number,
+        style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
+        textStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
+        borderStyle: PropTypes.object
+    };
 
-  render() {
-    const { data, width, height, flex, style, textStyle, borderStyle, ...props } = this.props;
-    const textDom = React.isValidElement(data) ? (
-      data
-    ) : (
-      <Text style={[textStyle, styles.text]} {...props}>
-        {data}
-      </Text>
-    );
-    const borderTopWidth = (borderStyle && borderStyle.borderWidth) || 0;
-    const borderRightWidth = borderTopWidth;
-    const borderColor = (borderStyle && borderStyle.borderColor) || '#000';
+    render() {
+        const {data, width, height, flex, style, textStyle, borderStyle, ...props} = this.props;
+        const textDom = React.isValidElement(data) ? (
+            data
+        ) : (
+            <Text style={[textStyle, styles.text]} {...props}>
+                {data}
+            </Text>
+        );
+        const borderTopWidth = (borderStyle && borderStyle.borderWidth) || 0;
+        const borderRightWidth = borderTopWidth;
+        const borderColor = (borderStyle && borderStyle.borderColor) || "#000";
 
-    return (
-      <View
-        style={[
-          {
-            borderTopWidth,
-            borderRightWidth,
-            borderColor
-          },
-          styles.cell,
-          width && { width },
-          height && { height },
-          flex && { flex },
-          !width && !flex && !height && !style && { flex: 1 },
-          style
-        ]}
-      >
-        {textDom}
-      </View>
-    );
-  }
+        return (
+            <View
+                style={[
+                    {
+                        borderTopWidth,
+                        borderRightWidth,
+                        borderColor
+                    },
+                    styles.cell,
+                    width && {width},
+                    height && {height},
+                    flex && {flex},
+                    !width && !flex && !height && !style && {flex: 1},
+                    style
+                ]}
+            >
+                {textDom}
+            </View>
+        );
+    }
 }
 
 const styles = StyleSheet.create({
-  cell: { justifyContent: 'center' },
-  text: { backgroundColor: 'transparent' }
+    cell: {justifyContent: "center"},
+    text: {backgroundColor: "transparent"}
 });

components/cols.js

@@ -1,63 +1,70 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { View, Text, StyleSheet } from 'react-native';
-import { Cell } from './cell';
-import { sum } from '../utils';
+import React, {Component} from "react";
+import PropTypes from "prop-types";
+import {View, StyleSheet} from "react-native";
+import {Cell} from "./cell";
+import {sum} from "../utils";
 
 export class Col extends Component {
-  static propTypes = {
-    width: PropTypes.number,
-    style: PropTypes.object,
-    textStyle: PropTypes.object
-  };
+    static propTypes = {
+        data: PropTypes.array,
+        style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
+        width: PropTypes.number,
+        heightArr: PropTypes.arrayOf(PropTypes.number),
+        flex: PropTypes.number,
+        textStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.array])
+    };
 
-  render() {
-    const { data, style, width, heightArr, flex, textStyle, ...props } = this.props;
+    render() {
+        const {data, style, width, heightArr, flex, textStyle, ...props} = this.props;
 
-    return data ? (
-      <View style={[width ? { width: width } : { flex: 1 }, flex && { flex: flex }, style]}>
-        {data.map((item, i) => {
-          const height = heightArr && heightArr[i];
-          return <Cell key={i} data={item} width={width} height={height} textStyle={textStyle} {...props} />;
-        })}
-      </View>
-    ) : null;
-  }
+        return data ? (
+            <View style={[width ? {width: width} : {flex: 1}, flex && {flex: flex}, style]}>
+                {data.map((item, i) => {
+                    const height = heightArr && heightArr[i];
+                    return <Cell key={i} data={item} width={width} height={height} textStyle={textStyle} {...props} />;
+                })}
+            </View>
+        ) : null;
+    }
 }
 
 export class Cols extends Component {
-  static propTypes = {
-    style: PropTypes.object,
-    textStyle: PropTypes.object
-  };
+    static propTypes = {
+        data: PropTypes.array,
+        style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
+        widthArr: PropTypes.arrayOf(PropTypes.number),
+        heightArr: PropTypes.arrayOf(PropTypes.number),
+        flexArr: PropTypes.arrayOf(PropTypes.number),
+        textStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.array])
+    };
 
-  render() {
-    const { data, style, widthArr, heightArr, flexArr, textStyle, ...props } = this.props;
-    let width = widthArr ? sum(widthArr) : 0;
+    render() {
+        const {data, style, widthArr, heightArr, flexArr, textStyle, ...props} = this.props;
+        const width = widthArr ? sum(widthArr) : 0;
 
-    return data ? (
-      <View style={[styles.cols, width && { width }]}>
-        {data.map((item, i) => {
-          const flex = flexArr && flexArr[i];
-          const wth = widthArr && widthArr[i];
-          return (
-            <Col
-              key={i}
-              data={item}
-              width={wth}
-              heightArr={heightArr}
-              flex={flex}
-              style={style}
-              textStyle={textStyle}
-              {...props}
-            />
-          );
-        })}
-      </View>
-    ) : null;
-  }
+        return data ? (
+            <View style={[styles.cols, width && {width}]}>
+                {data.map((item, i) => {
+                    const flex = flexArr && flexArr[i];
+                    const wth = widthArr && widthArr[i];
+                    return (
+                        <Col
+                            key={i}
+                            data={item}
+                            width={wth}
+                            heightArr={heightArr}
+                            flex={flex}
+                            style={style}
+                            textStyle={textStyle}
+                            {...props}
+                        />
+                    );
+                })}
+            </View>
+        ) : null;
+    }
 }
 
 const styles = StyleSheet.create({
-  cols: { flexDirection: 'row' }
+    cols: {flexDirection: "row"}
 });