feat(flow): add flowgen to generate flow types from typescript, #1125

upgrade dev deps

.flowconfig

@@ -0,0 +1,12 @@
+[ignore]
+
+[include]
+
+[libs]
+flow-typed
+
+[lints]
+
+[options]
+
+[strict]

.gitignore

@@ -45,7 +45,9 @@ cn-doc.md
 # experimental code
 #
 experimental/
+
 /lib/
+/flow-typed/
 
 # VS Code
 .vscode/

.npmignore

@@ -5,6 +5,7 @@ experimental/
 android/build/
 screenshots/
 idl/
+flow-typed/
 
 # OSX
 #

package.json

@@ -33,11 +33,14 @@
   ],
   "scripts": {
     "lint": "eslint --ext .ts,.tsx src",
+    "flow": "flow src",
+    "flowgen": "flowgen src/index.d.ts -o src/index.js.flow",
+    "flowtyped": "flow-typed install",
     "format": "prettier README.md './src/**/*.{ts,tsx}' src/index.d.ts --write",
     "peg": "pegjs -o src/lib/extract/transform.js ./src/lib/extract/transform.peg",
     "tsc": "tsc --noEmit",
-    "test": "yarn lint && yarn tsc",
+    "test": "npm run lint && npm run tsc && npm run flow",
-    "prepare": "bob build",
+    "prepare": "npm run flowgen && npm run bob build",
     "semantic-release": "semantic-release"
   },
   "peerDependencies": {
@@ -50,15 +53,20 @@
     "@react-native-community/eslint-config": "^0.0.5",
     "@semantic-release/changelog": "^3.0.4",
     "@semantic-release/git": "^7.0.16",
-    "@types/react": "^16.9.3",
+    "@types/react": "^16.9.5",
-    "@types/react-native": "^0.60.17",
+    "@types/react-native": "^0.60.19",
     "babel-eslint": "^10.0.3",
-    "eslint": "^6.4.0",
+    "eslint": "^6.5.1",
+    "eslint-plugin-flowtype": "^4.3.0",
     "eslint-plugin-prettier": "^3.1.1",
-    "eslint-plugin-react": "^7.14.3",
+    "eslint-plugin-react": "^7.16.0",
+    "flow-bin": "^0.109.0",
+    "flow-typed": "^2.6.1",
+    "flowgen": "^1.10.0",
     "pegjs": "^0.10.0",
     "prettier": "^1.18.2",
-    "react": "^16.10.0",
+    "react": "^16.10.2",
+    "react-native": "^0.61.2",
     "semantic-release": "^15.13.24",
     "semantic-release-cli": "^5.2.1",
     "typescript": "^3.6.3"

src/index.js.flow

@@ -0,0 +1,441 @@
+/**
+ * Flowtype definitions for index
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.10.0
+ */
+
+import * as React from "react";
+import * as ReactNative from "react-native";
+import { GestureResponderEvent } from "react-native";
+export type NumberProp = string | number;
+export type NumberArray = NumberProp[] | NumberProp;
+export type FillRule = "evenodd" | "nonzero";
+export type Units = "userSpaceOnUse" | "objectBoundingBox";
+export type TextAnchor = "start" | "middle" | "end";
+export type FontStyle = "normal" | "italic" | "oblique";
+export type FontVariant = "normal" | "small-caps";
+export type FontWeight =
+  | NumberProp
+  | "normal"
+  | "bold"
+  | "bolder"
+  | "lighter"
+  | "100"
+  | "200"
+  | "300"
+  | "400"
+  | "500"
+  | "600"
+  | "700"
+  | "800"
+  | "900";
+export type FontStretch =
+  | "normal"
+  | "wider"
+  | "narrower"
+  | "ultra-condensed"
+  | "extra-condensed"
+  | "condensed"
+  | "semi-condensed"
+  | "semi-expanded"
+  | "expanded"
+  | "extra-expanded"
+  | "ultra-expanded";
+export type TextDecoration =
+  | "none"
+  | "underline"
+  | "overline"
+  | "line-through"
+  | "blink";
+export type FontVariantLigatures = "normal" | "none";
+export type AlignmentBaseline =
+  | "baseline"
+  | "text-bottom"
+  | "alphabetic"
+  | "ideographic"
+  | "middle"
+  | "central"
+  | "mathematical"
+  | "text-top"
+  | "bottom"
+  | "center"
+  | "top"
+  | "text-before-edge"
+  | "text-after-edge"
+  | "before-edge"
+  | "after-edge"
+  | "hanging";
+export type BaselineShift =
+  | "sub"
+  | "super"
+  | "baseline"
+  | $ReadOnlyArray<NumberProp>
+  | NumberProp;
+export type LengthAdjust = "spacing" | "spacingAndGlyphs";
+export type TextPathMethod = "align" | "stretch";
+export type TextPathSpacing = "auto" | "exact";
+export type TextPathMidLine = "sharp" | "smooth";
+export type Linecap = "butt" | "square" | "round";
+export type Linejoin = "miter" | "bevel" | "round";
+export interface TouchableProps {
+  disabled?: boolean;
+  onPress?: (event: GestureResponderEvent) => void;
+  onPressIn?: (event: GestureResponderEvent) => void;
+  onPressOut?: (event: GestureResponderEvent) => void;
+  onLongPress?: (event: GestureResponderEvent) => void;
+  delayPressIn?: number;
+  delayPressOut?: number;
+  delayLongPress?: number;
+}
+export type ResponderProps = {
+  pointerEvents?: "box-none" | "none" | "box-only" | "auto",
+  ...
+} & ReactNative.GestureResponderHandlers;
+export type rgbaArray = $ReadOnlyArray<number>;
+export type int32ARGBColor = number;
+export type Color = int32ARGBColor | rgbaArray | string;
+export interface FillProps {
+  fill?: Color;
+  fillOpacity?: NumberProp;
+  fillRule?: FillRule;
+}
+export interface ClipProps {
+  clipRule?: FillRule;
+  clipPath?: string;
+}
+export interface VectorEffectProps {
+  vectorEffect?:
+    | "none"
+    | "non-scaling-stroke"
+    | "nonScalingStroke"
+    | "default"
+    | "inherit"
+    | "uri";
+}
+export interface DefinitionProps {
+  id?: string;
+}
+export interface StrokeProps {
+  stroke?: Color;
+  strokeWidth?: NumberProp;
+  strokeOpacity?: NumberProp;
+  strokeDasharray?: $ReadOnlyArray<NumberProp> | NumberProp;
+  strokeDashoffset?: NumberProp;
+  strokeLinecap?: Linecap;
+  strokeLinejoin?: Linejoin;
+  strokeMiterlimit?: NumberProp;
+}
+export interface FontObject {
+  fontStyle?: FontStyle;
+  fontVariant?: FontVariant;
+  fontWeight?: FontWeight;
+  fontStretch?: FontStretch;
+  fontSize?: NumberProp;
+  fontFamily?: string;
+  textAnchor?: TextAnchor;
+  textDecoration?: TextDecoration;
+  letterSpacing?: NumberProp;
+  wordSpacing?: NumberProp;
+  kerning?: NumberProp;
+  fontFeatureSettings?: string;
+  fontVariantLigatures?: FontVariantLigatures;
+  fontVariationSettings?: string;
+}
+export type FontProps = {
+  font?: FontObject,
+  ...
+} & FontObject;
+export interface TransformObject {
+  translate?: NumberArray;
+  translateX?: NumberProp;
+  translateY?: NumberProp;
+  origin?: NumberArray;
+  originX?: NumberProp;
+  originY?: NumberProp;
+  scale?: NumberArray;
+  scaleX?: NumberProp;
+  scaleY?: NumberProp;
+  skew?: NumberArray;
+  skewX?: NumberProp;
+  skewY?: NumberProp;
+  rotation?: NumberProp;
+  x?: NumberArray;
+  y?: NumberArray;
+}
+export type ColumnMajorTransformMatrix = [
+  number,
+  number,
+  number,
+  number,
+  number,
+  number
+];
+export type TransformProps = {
+  transform?: ColumnMajorTransformMatrix | string | TransformObject,
+  ...
+} & TransformObject;
+export interface CommonMaskProps {
+  mask?: string;
+}
+export type CommonPathProps = { ... } & FillProps &
+  StrokeProps &
+  ClipProps &
+  TransformProps &
+  VectorEffectProps &
+  ResponderProps &
+  TouchableProps &
+  DefinitionProps &
+  CommonMaskProps;
+export type CircleProps = {
+  cx?: NumberProp,
+  cy?: NumberProp,
+  opacity?: NumberProp,
+  r?: NumberProp,
+  ...
+} & CommonPathProps;
+declare export var Circle: React.ComponentClass<CircleProps>;
+export interface ClipPathProps {
+  id?: string;
+}
+declare export var ClipPath: React.ComponentClass<ClipPathProps>;
+declare export var Defs: React.ComponentClass<{ ... }>;
+export type EllipseProps = {
+  cx?: NumberProp,
+  cy?: NumberProp,
+  opacity?: NumberProp,
+  rx?: NumberProp,
+  ry?: NumberProp,
+  ...
+} & CommonPathProps;
+declare export var Ellipse: React.ComponentClass<EllipseProps>;
+export type GProps = {
+  opacity?: NumberProp,
+  ...
+} & CommonPathProps;
+declare export var G: React.ComponentClass<GProps>;
+export type ImageProps = {
+  x?: NumberProp,
+  y?: NumberProp,
+  width?: NumberProp,
+  height?: NumberProp,
+  xlinkHref?: $PropertyType<ReactNative.ImageProps, "source">,
+  href?: $PropertyType<ReactNative.ImageProps, "source">,
+  preserveAspectRatio?: string,
+  opacity?: NumberProp,
+  clipPath?: string,
+  ...
+} & ResponderProps &
+  CommonMaskProps &
+  ClipProps &
+  TouchableProps;
+declare export var Image: React.ComponentClass<ImageProps>;
+export type LineProps = {
+  opacity?: NumberProp,
+  x1?: NumberProp,
+  x2?: NumberProp,
+  y1?: NumberProp,
+  y2?: NumberProp,
+  ...
+} & CommonPathProps;
+declare export var Line: React.ComponentClass<LineProps>;
+export interface LinearGradientProps {
+  x1?: NumberProp;
+  x2?: NumberProp;
+  y1?: NumberProp;
+  y2?: NumberProp;
+  gradientUnits?: Units;
+  gradientTransform?: ColumnMajorTransformMatrix | string;
+  id?: string;
+}
+declare export var LinearGradient: React.ComponentClass<LinearGradientProps>;
+export type PathProps = {
+  d?: string,
+  opacity?: NumberProp,
+  ...
+} & CommonPathProps;
+declare export var Path: React.ComponentClass<PathProps>;
+export interface PatternProps {
+  id?: string;
+  x?: NumberProp;
+  y?: NumberProp;
+  width?: NumberProp;
+  height?: NumberProp;
+  patternTransform?: ColumnMajorTransformMatrix | string;
+  patternUnits?: Units;
+  patternContentUnits?: Units;
+  viewBox?: string;
+  preserveAspectRatio?: string;
+}
+declare export var Pattern: React.ComponentClass<PatternProps>;
+export type PolygonProps = {
+  opacity?: NumberProp,
+  points?: string | $ReadOnlyArray<NumberProp>,
+  ...
+} & CommonPathProps;
+declare export var Polygon: React.ComponentClass<PolygonProps>;
+export type PolylineProps = {
+  opacity?: NumberProp,
+  points?: string | $ReadOnlyArray<NumberProp>,
+  ...
+} & CommonPathProps;
+declare export var Polyline: React.ComponentClass<PolylineProps>;
+export interface RadialGradientProps {
+  fx?: NumberProp;
+  fy?: NumberProp;
+  rx?: NumberProp;
+  ry?: NumberProp;
+  cx?: NumberProp;
+  cy?: NumberProp;
+  r?: NumberProp;
+  gradientUnits?: Units;
+  gradientTransform?: ColumnMajorTransformMatrix | string;
+  id?: string;
+}
+declare export var RadialGradient: React.ComponentClass<RadialGradientProps>;
+export type RectProps = {
+  x?: NumberProp,
+  y?: NumberProp,
+  width?: NumberProp,
+  height?: NumberProp,
+  rx?: NumberProp,
+  ry?: NumberProp,
+  opacity?: NumberProp,
+  ...
+} & CommonPathProps;
+declare export var Rect: React.ComponentClass<RectProps>;
+export interface StopProps {
+  stopColor?: Color;
+  stopOpacity?: NumberProp;
+  offset?: NumberProp;
+}
+declare export var Stop: React.ComponentClass<StopProps>;
+export type SvgProps = {
+  width?: NumberProp,
+  height?: NumberProp,
+  viewBox?: string,
+  preserveAspectRatio?: string,
+  color?: Color,
+  title?: string,
+  ...
+} & GProps &
+  ReactNative.ViewProperties;
+declare export var Svg: React.ComponentClass<SvgProps>;
+declare export default typeof Svg;
+export interface SymbolProps {
+  id?: string;
+  viewBox?: string;
+  preserveAspectRatio?: string;
+  opacity?: NumberProp;
+}
+declare export var Symbol: React.ComponentClass<SymbolProps>;
+export type TSpanProps = {
+  x?: NumberArray,
+  y?: NumberArray,
+  dx?: NumberArray,
+  dy?: NumberArray,
+  rotate?: NumberArray,
+  inlineSize?: NumberProp,
+  ...
+} & CommonPathProps &
+  FontProps;
+declare export var TSpan: React.ComponentClass<TSpanProps>;
+export type TextSpecificProps = {
+  alignmentBaseline?: AlignmentBaseline,
+  baselineShift?: BaselineShift,
+  verticalAlign?: NumberProp,
+  lengthAdjust?: LengthAdjust,
+  textLength?: NumberProp,
+  fontData?: null | {
+    [name: string]: mixed,
+    ...
+  },
+  fontFeatureSettings?: string,
+  ...
+} & CommonPathProps &
+  FontProps;
+export type TextProps = {
+  x?: NumberArray,
+  y?: NumberArray,
+  dx?: NumberArray,
+  dy?: NumberArray,
+  rotate?: NumberArray,
+  opacity?: NumberProp,
+  inlineSize?: NumberProp,
+  ...
+} & TextSpecificProps;
+declare export var Text: React.ComponentClass<TextProps>;
+export type TextPathProps = {
+  xlinkHref?: string,
+  href?: string,
+  startOffset?: NumberProp,
+  method?: TextPathMethod,
+  spacing?: TextPathSpacing,
+  midLine?: TextPathMidLine,
+  ...
+} & TextSpecificProps;
+declare export var TextPath: React.ComponentClass<TextPathProps>;
+export type UseProps = {
+  xlinkHref?: string,
+  href?: string,
+  width?: NumberProp,
+  height?: NumberProp,
+  x?: NumberProp,
+  y?: NumberProp,
+  opacity?: NumberProp,
+  ...
+} & CommonPathProps;
+declare export var Use: React.ComponentClass<UseProps>;
+declare export var EMaskUnits: {|
+  +USER_SPACE_ON_USE: "userSpaceOnUse", // "userSpaceOnUse"
+  +OBJECT_BOUNDING_BOX: "objectBoundingBox" // "objectBoundingBox"
+|};
+export type TMaskUnits =
+  | typeof EMaskUnits.USER_SPACE_ON_USE
+  | typeof EMaskUnits.OBJECT_BOUNDING_BOX;
+export type MaskProps = {
+  id?: string,
+  x?: NumberProp,
+  y?: NumberProp,
+  width?: NumberProp,
+  height?: NumberProp,
+  maskTransform?: ColumnMajorTransformMatrix | string,
+  maskUnits?: TMaskUnits,
+  maskContentUnits?: TMaskUnits,
+  ...
+} & CommonPathProps;
+declare export var Mask: React.ComponentClass<MaskProps>;
+export interface AST {
+  tag: string;
+  children: (AST | string)[] | (React$Node | string)[];
+  props: { ... };
+  Tag: React.ComponentType<>;
+}
+export type UriProps = {
+  uri: string | null,
+  override?: SvgProps,
+  ...
+} & SvgProps;
+export type UriState = {
+  xml: string | null,
+  ...
+};
+export type XmlProps = {
+  xml: string | null,
+  override?: SvgProps,
+  ...
+} & SvgProps;
+export type XmlState = {
+  ast: AST | null,
+  ...
+};
+export type AstProps = {
+  ast: AST | null,
+  override?: SvgProps,
+  ...
+} & SvgProps;
+declare export function parse(xml: string): AST | null;
+declare export var SvgAst: React.FunctionComponent<AstProps>;
+declare export var SvgXml: React.FunctionComponent<XmlProps>;
+declare export var SvgFromXml: React.ComponentClass<XmlProps, XmlState>;
+declare export var SvgUri: React.FunctionComponent<UriProps>;
+declare export var SvgFromUri: React.ComponentClass<UriProps, UriState>;