From 6777211d7eddb43a38db0e28176ad149610fd825 Mon Sep 17 00:00:00 2001 From: Mikael Sand Date: Tue, 29 Jan 2019 04:51:56 +0200 Subject: [PATCH] Use singleQuote --- .eslintrc | 2 +- .prettierrc | 1 + elements/Circle.js | 12 +++--- elements/ClipPath.js | 12 +++--- elements/Defs.js | 8 ++-- elements/Ellipse.js | 12 +++--- elements/G.js | 16 ++++---- elements/Image.js | 18 ++++----- elements/Line.js | 12 +++--- elements/LinearGradient.js | 20 +++++----- elements/Mask.js | 24 +++++------ elements/Path.js | 12 +++--- elements/Pattern.js | 24 +++++------ elements/Polygon.js | 12 +++--- elements/Polyline.js | 12 +++--- elements/RadialGradient.js | 22 +++++------ elements/Rect.js | 12 +++--- elements/Shape.js | 6 +-- elements/Stop.js | 6 +-- elements/Svg.js | 24 +++++------ elements/Symbol.js | 12 +++--- elements/TSpan.js | 18 ++++----- elements/Text.js | 20 +++++----- elements/TextPath.js | 22 +++++------ elements/Use.js | 17 ++++---- index.js | 44 ++++++++++----------- lib/SvgTouchableMixin.js | 2 +- lib/extract/extractBrush.js | 6 +-- lib/extract/extractClipPath.js | 4 +- lib/extract/extractColor.js | 68 ++++++++++++++++---------------- lib/extract/extractFill.js | 8 ++-- lib/extract/extractGradient.js | 16 ++++---- lib/extract/extractLengthList.js | 6 +-- lib/extract/extractOpacity.js | 2 +- lib/extract/extractPolyPoints.js | 6 +-- lib/extract/extractProps.js | 16 ++++---- lib/extract/extractResponder.js | 18 ++++----- lib/extract/extractStroke.js | 24 +++++------ lib/extract/extractText.js | 22 +++++------ lib/extract/extractTransform.js | 12 +++--- lib/extract/extractViewBox.js | 24 +++++------ 41 files changed, 317 insertions(+), 317 deletions(-) diff --git a/.eslintrc b/.eslintrc index c6d09a34..c739b3fc 100644 --- a/.eslintrc +++ b/.eslintrc @@ -179,7 +179,7 @@ "no-underscore-dangle": 0, // disallow dangling underscores in identifiers //"no-wrap-func": 1, // disallow wrapping of non-IIFE statements in parens "no-mixed-spaces-and-tabs": 1, // disallow mixed spaces and tabs for indentation - "quotes": [1, "double", "avoid-escape"], // specify whether double or single quotes should be used + "quotes": [1, "single", "avoid-escape"], // specify whether double or single quotes should be used "quote-props": 0, // require quotes around object literal property names (off by default) "semi": 1, // require or disallow use of semicolons instead of ASI "sort-vars": 0, // sort variables within the same declaration block (off by default) diff --git a/.prettierrc b/.prettierrc index e391e9ad..31c19fda 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,4 +1,5 @@ { "trailingComma": "all", + "singleQuote": true, "tabWidth": 2 } diff --git a/elements/Circle.js b/elements/Circle.js index 8d6b43cb..ad28aab9 100644 --- a/elements/Circle.js +++ b/elements/Circle.js @@ -1,10 +1,10 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import Shape from './Shape'; export default class Circle extends Shape { - static displayName = "Circle"; + static displayName = 'Circle'; static defaultProps = { cx: 0, @@ -27,4 +27,4 @@ export default class Circle extends Shape { } } -const RNSVGCircle = requireNativeComponent("RNSVGCircle"); +const RNSVGCircle = requireNativeComponent('RNSVGCircle'); diff --git a/elements/ClipPath.js b/elements/ClipPath.js index 8d76d5a7..1c3c91b7 100644 --- a/elements/ClipPath.js +++ b/elements/ClipPath.js @@ -1,10 +1,10 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractClipPath from "../lib/extract/extractClipPath"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractClipPath from '../lib/extract/extractClipPath'; +import Shape from './Shape'; export default class ClipPath extends Shape { - static displayName = "ClipPath"; + static displayName = 'ClipPath'; render() { const { id, children } = this.props; @@ -20,4 +20,4 @@ export default class ClipPath extends Shape { } } -const RNSVGClipPath = requireNativeComponent("RNSVGClipPath"); +const RNSVGClipPath = requireNativeComponent('RNSVGClipPath'); diff --git a/elements/Defs.js b/elements/Defs.js index 40c4db5b..f11254d8 100644 --- a/elements/Defs.js +++ b/elements/Defs.js @@ -1,12 +1,12 @@ -import React, { Component } from "react"; -import { requireNativeComponent } from "react-native"; +import React, { Component } from 'react'; +import { requireNativeComponent } from 'react-native'; export default class Defs extends Component { - static displayName = "Defs"; + static displayName = 'Defs'; render() { return {this.props.children}; } } -const RNSVGDefs = requireNativeComponent("RNSVGDefs"); +const RNSVGDefs = requireNativeComponent('RNSVGDefs'); diff --git a/elements/Ellipse.js b/elements/Ellipse.js index 5c05b0a8..8d28d4c2 100644 --- a/elements/Ellipse.js +++ b/elements/Ellipse.js @@ -1,10 +1,10 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import Shape from './Shape'; export default class Ellipse extends Shape { - static displayName = "Ellipse"; + static displayName = 'Ellipse'; static defaultProps = { cx: 0, @@ -29,4 +29,4 @@ export default class Ellipse extends Shape { } } -const RNSVGEllipse = requireNativeComponent("RNSVGEllipse"); +const RNSVGEllipse = requireNativeComponent('RNSVGEllipse'); diff --git a/elements/G.js b/elements/G.js index 9abaf8e5..619a49bd 100644 --- a/elements/G.js +++ b/elements/G.js @@ -1,12 +1,12 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import { extractFont } from "../lib/extract/extractText"; -import extractTransform from "../lib/extract/extractTransform"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import { extractFont } from '../lib/extract/extractText'; +import extractTransform from '../lib/extract/extractTransform'; +import Shape from './Shape'; export default class G extends Shape { - static displayName = "G"; + static displayName = 'G'; setNativeProps = props => { const matrix = !props.matrix && extractTransform(props); @@ -31,4 +31,4 @@ export default class G extends Shape { } } -const RNSVGGroup = requireNativeComponent("RNSVGGroup"); +const RNSVGGroup = requireNativeComponent('RNSVGGroup'); diff --git a/elements/Image.js b/elements/Image.js index ab1346b0..7b6e13b5 100644 --- a/elements/Image.js +++ b/elements/Image.js @@ -1,20 +1,20 @@ -import React from "react"; -import { Image, requireNativeComponent } from "react-native"; -import { meetOrSliceTypes, alignEnum } from "../lib/extract/extractViewBox"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import Shape from "./Shape"; +import React from 'react'; +import { Image, requireNativeComponent } from 'react-native'; +import { meetOrSliceTypes, alignEnum } from '../lib/extract/extractViewBox'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import Shape from './Shape'; const spacesRegExp = /\s+/; export default class SvgImage extends Shape { - static displayName = "Image"; + static displayName = 'Image'; static defaultProps = { x: 0, y: 0, width: 0, height: 0, - preserveAspectRatio: "xMidYMid meet", + preserveAspectRatio: 'xMidYMid meet', }; render() { @@ -38,11 +38,11 @@ export default class SvgImage extends Shape { width={width} height={height} meetOrSlice={meetOrSliceTypes[modes[1]] || 0} - align={alignEnum[modes[0]] || "xMidYMid"} + align={alignEnum[modes[0]] || 'xMidYMid'} src={Image.resolveAssetSource(href)} /> ); } } -const RNSVGImage = requireNativeComponent("RNSVGImage"); +const RNSVGImage = requireNativeComponent('RNSVGImage'); diff --git a/elements/Line.js b/elements/Line.js index cfdcc448..05441101 100644 --- a/elements/Line.js +++ b/elements/Line.js @@ -1,10 +1,10 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import Shape from './Shape'; export default class Line extends Shape { - static displayName = "Line"; + static displayName = 'Line'; static defaultProps = { x1: 0, @@ -29,4 +29,4 @@ export default class Line extends Shape { } } -const RNSVGLine = requireNativeComponent("RNSVGLine"); +const RNSVGLine = requireNativeComponent('RNSVGLine'); diff --git a/elements/LinearGradient.js b/elements/LinearGradient.js index e4b4972a..d79ac728 100644 --- a/elements/LinearGradient.js +++ b/elements/LinearGradient.js @@ -1,16 +1,16 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractGradient from "../lib/extract/extractGradient"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractGradient from '../lib/extract/extractGradient'; +import Shape from './Shape'; export default class LinearGradient extends Shape { - static displayName = "LinearGradient"; + static displayName = 'LinearGradient'; static defaultProps = { - x1: "0%", - y1: "0%", - x2: "100%", - y2: "0%", + x1: '0%', + y1: '0%', + x2: '100%', + y2: '0%', }; render() { @@ -29,4 +29,4 @@ export default class LinearGradient extends Shape { } } -const RNSVGLinearGradient = requireNativeComponent("RNSVGLinearGradient"); +const RNSVGLinearGradient = requireNativeComponent('RNSVGLinearGradient'); diff --git a/elements/Mask.js b/elements/Mask.js index b2ca2e84..9c5d90fa 100644 --- a/elements/Mask.js +++ b/elements/Mask.js @@ -1,18 +1,18 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractTransform from "../lib/extract/extractTransform"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import units from "../lib/units"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractTransform from '../lib/extract/extractTransform'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import units from '../lib/units'; +import Shape from './Shape'; export default class Mask extends Shape { - static displayName = "Mask"; + static displayName = 'Mask'; static defaultProps = { - x: "0%", - y: "0%", - width: "100%", - height: "100%", + x: '0%', + y: '0%', + width: '100%', + height: '100%', }; render() { @@ -48,4 +48,4 @@ export default class Mask extends Shape { } } -const RNSVGMask = requireNativeComponent("RNSVGMask"); +const RNSVGMask = requireNativeComponent('RNSVGMask'); diff --git a/elements/Path.js b/elements/Path.js index ee37758e..dcae18ca 100644 --- a/elements/Path.js +++ b/elements/Path.js @@ -1,10 +1,10 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import Shape from './Shape'; export default class Path extends Shape { - static displayName = "Path"; + static displayName = 'Path'; render() { const { props } = this; @@ -18,4 +18,4 @@ export default class Path extends Shape { } } -const RNSVGPath = requireNativeComponent("RNSVGPath"); +const RNSVGPath = requireNativeComponent('RNSVGPath'); diff --git a/elements/Pattern.js b/elements/Pattern.js index c43b10ea..a8babc44 100644 --- a/elements/Pattern.js +++ b/elements/Pattern.js @@ -1,18 +1,18 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractTransform from "../lib/extract/extractTransform"; -import extractViewBox from "../lib/extract/extractViewBox"; -import units from "../lib/units"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractTransform from '../lib/extract/extractTransform'; +import extractViewBox from '../lib/extract/extractViewBox'; +import units from '../lib/units'; +import Shape from './Shape'; export default class Pattern extends Shape { - static displayName = "Pattern"; + static displayName = 'Pattern'; static defaultProps = { - x: "0%", - y: "0%", - width: "100%", - height: "100%", + x: '0%', + y: '0%', + width: '100%', + height: '100%', }; render() { @@ -54,4 +54,4 @@ export default class Pattern extends Shape { } } -const RNSVGPattern = requireNativeComponent("RNSVGPattern"); +const RNSVGPattern = requireNativeComponent('RNSVGPattern'); diff --git a/elements/Polygon.js b/elements/Polygon.js index af2a3d61..594db14e 100644 --- a/elements/Polygon.js +++ b/elements/Polygon.js @@ -1,13 +1,13 @@ -import React from "react"; -import Path from "./Path"; -import Shape from "./Shape"; -import extractPolyPoints from "../lib/extract/extractPolyPoints"; +import React from 'react'; +import Path from './Path'; +import Shape from './Shape'; +import extractPolyPoints from '../lib/extract/extractPolyPoints'; export default class Polygon extends Shape { - static displayName = "Polygon"; + static displayName = 'Polygon'; static defaultProps = { - points: "", + points: '', }; setNativeProps = props => { diff --git a/elements/Polyline.js b/elements/Polyline.js index b7dd5e7d..93a7405e 100644 --- a/elements/Polyline.js +++ b/elements/Polyline.js @@ -1,13 +1,13 @@ -import React from "react"; -import Path from "./Path"; -import Shape from "./Shape"; -import extractPolyPoints from "../lib/extract/extractPolyPoints"; +import React from 'react'; +import Path from './Path'; +import Shape from './Shape'; +import extractPolyPoints from '../lib/extract/extractPolyPoints'; export default class Polyline extends Shape { - static displayName = "Polyline"; + static displayName = 'Polyline'; static defaultProps = { - points: "", + points: '', }; setNativeProps = props => { diff --git a/elements/RadialGradient.js b/elements/RadialGradient.js index 367aa220..849ec960 100644 --- a/elements/RadialGradient.js +++ b/elements/RadialGradient.js @@ -1,17 +1,17 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractGradient from "../lib/extract/extractGradient"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractGradient from '../lib/extract/extractGradient'; +import Shape from './Shape'; export default class RadialGradient extends Shape { - static displayName = "RadialGradient"; + static displayName = 'RadialGradient'; static defaultProps = { - fx: "50%", - fy: "50%", - cx: "50%", - cy: "50%", - r: "50%", + fx: '50%', + fy: '50%', + cx: '50%', + cy: '50%', + r: '50%', }; render() { @@ -32,4 +32,4 @@ export default class RadialGradient extends Shape { } } -const RNSVGRadialGradient = requireNativeComponent("RNSVGRadialGradient"); +const RNSVGRadialGradient = requireNativeComponent('RNSVGRadialGradient'); diff --git a/elements/Rect.js b/elements/Rect.js index 7e2ef930..418c9bad 100644 --- a/elements/Rect.js +++ b/elements/Rect.js @@ -1,10 +1,10 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import Shape from './Shape'; export default class Rect extends Shape { - static displayName = "Rect"; + static displayName = 'Rect'; static defaultProps = { x: 0, @@ -40,4 +40,4 @@ export default class Rect extends Shape { } } -const RNSVGRect = requireNativeComponent("RNSVGRect"); +const RNSVGRect = requireNativeComponent('RNSVGRect'); diff --git a/elements/Shape.js b/elements/Shape.js index aef893bf..ec15eb64 100644 --- a/elements/Shape.js +++ b/elements/Shape.js @@ -1,5 +1,5 @@ -import { Component } from "react"; -import SvgTouchableMixin from "../lib/SvgTouchableMixin"; +import { Component } from 'react'; +import SvgTouchableMixin from '../lib/SvgTouchableMixin'; const touchKeys = Object.keys(SvgTouchableMixin); const touchVals = touchKeys.map(key => SvgTouchableMixin[key]); @@ -11,7 +11,7 @@ export default class Shape extends Component { for (let i = 0; i < numTouchKeys; i++) { const key = touchKeys[i]; const val = touchVals[i]; - if (typeof val === "function") { + if (typeof val === 'function') { this[key] = val.bind(this); } else { this[key] = val; diff --git a/elements/Stop.js b/elements/Stop.js index 5280296e..3f0d2f82 100644 --- a/elements/Stop.js +++ b/elements/Stop.js @@ -1,10 +1,10 @@ -import { Component } from "react"; +import { Component } from 'react'; export default class Stop extends Component { - static displayName = "Stop"; + static displayName = 'Stop'; static defaultProps = { - stopColor: "#000", + stopColor: '#000', stopOpacity: 1, }; setNativeProps = () => { diff --git a/elements/Svg.js b/elements/Svg.js index 32b0a189..1bac2f4a 100644 --- a/elements/Svg.js +++ b/elements/Svg.js @@ -1,29 +1,29 @@ -import React from "react"; +import React from 'react'; import { requireNativeComponent, StyleSheet, findNodeHandle, NativeModules, -} from "react-native"; -import extractResponder from "../lib/extract/extractResponder"; -import extractViewBox from "../lib/extract/extractViewBox"; -import Shape from "./Shape"; -import G from "./G"; +} from 'react-native'; +import extractResponder from '../lib/extract/extractResponder'; +import extractViewBox from '../lib/extract/extractViewBox'; +import Shape from './Shape'; +import G from './G'; const RNSVGSvgViewManager = NativeModules.RNSVGSvgViewManager; const styles = StyleSheet.create({ svg: { - backgroundColor: "transparent", + backgroundColor: 'transparent', borderWidth: 0, }, }); export default class Svg extends Shape { - static displayName = "Svg"; + static displayName = 'Svg'; static defaultProps = { - preserveAspectRatio: "xMidYMid meet", + preserveAspectRatio: 'xMidYMid meet', }; measureInWindow = (...args) => { @@ -91,8 +91,8 @@ export default class Svg extends Shape { const w = parseInt(width, 10); const h = parseInt(height, 10); - const doNotParseWidth = isNaN(w) || width[width.length - 1] === "%"; - const doNotParseHeight = isNaN(h) || height[height.length - 1] === "%"; + const doNotParseWidth = isNaN(w) || width[width.length - 1] === '%'; + const doNotParseHeight = isNaN(h) || height[height.length - 1] === '%'; const dimensions = width && height ? { @@ -145,4 +145,4 @@ export default class Svg extends Shape { } } -const NativeSvgView = requireNativeComponent("RNSVGSvgView"); +const NativeSvgView = requireNativeComponent('RNSVGSvgView'); diff --git a/elements/Symbol.js b/elements/Symbol.js index c87c2b0d..c88f3393 100644 --- a/elements/Symbol.js +++ b/elements/Symbol.js @@ -1,10 +1,10 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractViewBox from "../lib/extract/extractViewBox"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractViewBox from '../lib/extract/extractViewBox'; +import Shape from './Shape'; export default class Symbol extends Shape { - static displayName = "Symbol"; + static displayName = 'Symbol'; render() { const { props } = this; @@ -17,4 +17,4 @@ export default class Symbol extends Shape { } } -const RNSVGSymbol = requireNativeComponent("RNSVGSymbol"); +const RNSVGSymbol = requireNativeComponent('RNSVGSymbol'); diff --git a/elements/TSpan.js b/elements/TSpan.js index dde99eb3..2362026d 100644 --- a/elements/TSpan.js +++ b/elements/TSpan.js @@ -1,13 +1,13 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import extractTransform from "../lib/extract/extractTransform"; -import extractText, { setTSpan } from "../lib/extract/extractText"; -import { pickNotNil } from "../lib/util"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import extractTransform from '../lib/extract/extractTransform'; +import extractText, { setTSpan } from '../lib/extract/extractText'; +import { pickNotNil } from '../lib/util'; +import Shape from './Shape'; export default class TSpan extends Shape { - static displayName = "TSpan"; + static displayName = 'TSpan'; setNativeProps = props => { const matrix = !props.matrix && extractTransform(props); @@ -43,4 +43,4 @@ export default class TSpan extends Shape { setTSpan(TSpan); -const RNSVGTSpan = requireNativeComponent("RNSVGTSpan"); +const RNSVGTSpan = requireNativeComponent('RNSVGTSpan'); diff --git a/elements/Text.js b/elements/Text.js index d4414cf6..043472f7 100644 --- a/elements/Text.js +++ b/elements/Text.js @@ -1,14 +1,14 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractText from "../lib/extract/extractText"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import extractTransform from "../lib/extract/extractTransform"; -import { pickNotNil } from "../lib/util"; -import Shape from "./Shape"; -import "./TSpan"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractText from '../lib/extract/extractText'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import extractTransform from '../lib/extract/extractTransform'; +import { pickNotNil } from '../lib/util'; +import Shape from './Shape'; +import './TSpan'; export default class Text extends Shape { - static displayName = "Text"; + static displayName = 'Text'; setNativeProps = props => { const matrix = !props.matrix && extractTransform(props); @@ -42,4 +42,4 @@ export default class Text extends Shape { } } -const RNSVGText = requireNativeComponent("RNSVGText"); +const RNSVGText = requireNativeComponent('RNSVGText'); diff --git a/elements/TextPath.js b/elements/TextPath.js index b083be68..3ba7a754 100644 --- a/elements/TextPath.js +++ b/elements/TextPath.js @@ -1,14 +1,14 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractTransform from "../lib/extract/extractTransform"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import extractText from "../lib/extract/extractText"; -import { idPattern, pickNotNil } from "../lib/util"; -import Shape from "./Shape"; -import TSpan from "./TSpan"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractTransform from '../lib/extract/extractTransform'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import extractText from '../lib/extract/extractText'; +import { idPattern, pickNotNil } from '../lib/util'; +import Shape from './Shape'; +import TSpan from './TSpan'; export default class TextPath extends Shape { - static displayName = "TextPath"; + static displayName = 'TextPath'; setNativeProps = props => { const matrix = !props.matrix && extractTransform(props); @@ -69,7 +69,7 @@ export default class TextPath extends Shape { } console.warn( - 'Invalid `href` prop for `TextPath` element, expected a href like `"#id"`, but got: "' + + 'Invalid `href` prop for `TextPath` element, expected a href like "#id", but got: "' + href + '"', ); @@ -77,4 +77,4 @@ export default class TextPath extends Shape { } } -const RNSVGTextPath = requireNativeComponent("RNSVGTextPath"); +const RNSVGTextPath = requireNativeComponent('RNSVGTextPath'); diff --git a/elements/Use.js b/elements/Use.js index ba352bec..93efa87c 100644 --- a/elements/Use.js +++ b/elements/Use.js @@ -1,11 +1,11 @@ -import React from "react"; -import { requireNativeComponent } from "react-native"; -import extractProps, { propsAndStyles } from "../lib/extract/extractProps"; -import { idPattern } from "../lib/util"; -import Shape from "./Shape"; +import React from 'react'; +import { requireNativeComponent } from 'react-native'; +import extractProps, { propsAndStyles } from '../lib/extract/extractProps'; +import { idPattern } from '../lib/util'; +import Shape from './Shape'; export default class Use extends Shape { - static displayName = "Use"; + static displayName = 'Use'; static defaultProps = { x: 0, @@ -26,13 +26,12 @@ export default class Use extends Shape { href = xlinkHref, } = props; - // match "url(#pattern)" const matched = href.match(idPattern); const match = matched && matched[1]; if (!match) { console.warn( - 'Invalid `href` prop for `Use` element, expected a href like `"#id"`, but got: "' + + 'Invalid `href` prop for `Use` element, expected a href like "#id", but got: "' + href + '"', ); @@ -54,4 +53,4 @@ export default class Use extends Shape { } } -const RNSVGUse = requireNativeComponent("RNSVGUse"); +const RNSVGUse = requireNativeComponent('RNSVGUse'); diff --git a/index.js b/index.js index 6f87d39a..e3597230 100644 --- a/index.js +++ b/index.js @@ -1,25 +1,25 @@ -import Rect from "./elements/Rect"; -import Circle from "./elements/Circle"; -import Ellipse from "./elements/Ellipse"; -import Polygon from "./elements/Polygon"; -import Polyline from "./elements/Polyline"; -import Line from "./elements/Line"; -import Svg from "./elements/Svg"; -import Path from "./elements/Path"; -import G from "./elements/G"; -import Text from "./elements/Text"; -import TSpan from "./elements/TSpan"; -import TextPath from "./elements/TextPath"; -import Use from "./elements/Use"; -import Image from "./elements/Image"; -import Symbol from "./elements/Symbol"; -import Defs from "./elements/Defs"; -import LinearGradient from "./elements/LinearGradient"; -import RadialGradient from "./elements/RadialGradient"; -import Stop from "./elements/Stop"; -import ClipPath from "./elements/ClipPath"; -import Pattern from "./elements/Pattern"; -import Mask from "./elements/Mask"; +import Rect from './elements/Rect'; +import Circle from './elements/Circle'; +import Ellipse from './elements/Ellipse'; +import Polygon from './elements/Polygon'; +import Polyline from './elements/Polyline'; +import Line from './elements/Line'; +import Svg from './elements/Svg'; +import Path from './elements/Path'; +import G from './elements/G'; +import Text from './elements/Text'; +import TSpan from './elements/TSpan'; +import TextPath from './elements/TextPath'; +import Use from './elements/Use'; +import Image from './elements/Image'; +import Symbol from './elements/Symbol'; +import Defs from './elements/Defs'; +import LinearGradient from './elements/LinearGradient'; +import RadialGradient from './elements/RadialGradient'; +import Stop from './elements/Stop'; +import ClipPath from './elements/ClipPath'; +import Pattern from './elements/Pattern'; +import Mask from './elements/Mask'; export { Svg, diff --git a/lib/SvgTouchableMixin.js b/lib/SvgTouchableMixin.js index acc8ccd6..2e00a201 100644 --- a/lib/SvgTouchableMixin.js +++ b/lib/SvgTouchableMixin.js @@ -1,4 +1,4 @@ -import { Touchable } from "react-native"; +import { Touchable } from 'react-native'; const PRESS_RETENTION_OFFSET = { top: 20, left: 20, right: 20, bottom: 30 }; export default { diff --git a/lib/extract/extractBrush.js b/lib/extract/extractBrush.js index 17c92523..72b6fe5e 100644 --- a/lib/extract/extractBrush.js +++ b/lib/extract/extractBrush.js @@ -1,13 +1,13 @@ -import extractColor from "./extractColor"; +import extractColor from './extractColor'; const urlIdPattern = /^url\(#(.+?)\)$/; export default function extractBrush(colorOrBrush) { - if (colorOrBrush === "none" || !colorOrBrush) { + if (colorOrBrush === 'none' || !colorOrBrush) { return null; } - if (colorOrBrush === "currentColor") { + if (colorOrBrush === 'currentColor') { return [2]; } try { diff --git a/lib/extract/extractClipPath.js b/lib/extract/extractClipPath.js index 0861736f..465f78db 100644 --- a/lib/extract/extractClipPath.js +++ b/lib/extract/extractClipPath.js @@ -1,4 +1,4 @@ -import { idPattern } from "../util"; +import { idPattern } from '../util'; const clipRules = { evenodd: 0, @@ -20,7 +20,7 @@ export default function extractClipPath(props) { clipPathProps.clipPath = matched[1]; } else { console.warn( - 'Invalid `clipPath` prop, expected a clipPath like `"#id"`, but got: "' + + 'Invalid `clipPath` prop, expected a clipPath like "#id", but got: "' + clipPath + '"', ); diff --git a/lib/extract/extractColor.js b/lib/extract/extractColor.js index 1b405782..2435b3f8 100644 --- a/lib/extract/extractColor.js +++ b/lib/extract/extractColor.js @@ -1,21 +1,21 @@ const colorString = {}; colorString.get = function(string) { - var prefix = string.substring(0, 3).toLowerCase(); - var val; - var model; + const prefix = string.substring(0, 3).toLowerCase(); + let val; + let model; switch (prefix) { - case "hsl": + case 'hsl': val = colorString.get.hsl(string); - model = "hsl"; + model = 'hsl'; break; - case "hwb": + case 'hwb': val = colorString.get.hwb(string); - model = "hwb"; + model = 'hwb'; break; default: val = colorString.get.rgb(string); - model = "rgb"; + model = 'rgb'; break; } @@ -186,16 +186,16 @@ colorString.get.rgb = function(string) { return null; } - var abbr = /^#([a-f0-9]{3,4})$/i; - var hex = /^#([a-f0-9]{6})([a-f0-9]{2})?$/i; - var rgba = /^rgba?\(\s*([+-]?\d+)\s*,\s*([+-]?\d+)\s*,\s*([+-]?\d+)\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; - var per = /^rgba?\(\s*([+-]?[\d\.]+)\%\s*,\s*([+-]?[\d\.]+)\%\s*,\s*([+-]?[\d\.]+)\%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; - var keyword = /(\D+)/; + const abbr = /^#([a-f0-9]{3,4})$/i; + const hex = /^#([a-f0-9]{6})([a-f0-9]{2})?$/i; + const rgba = /^rgba?\(\s*([+-]?\d+)\s*,\s*([+-]?\d+)\s*,\s*([+-]?\d+)\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; + const per = /^rgba?\(\s*([+-]?[\d\.]+)\%\s*,\s*([+-]?[\d\.]+)\%\s*,\s*([+-]?[\d\.]+)\%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; + const keyword = /(\D+)/; - var rgb = [0, 0, 0, 1]; - var match; - var i; - var hexAlpha; + let rgb = [0, 0, 0, 1]; + let match; + let i; + let hexAlpha; if ((match = string.match(hex))) { hexAlpha = match[2]; @@ -203,7 +203,7 @@ colorString.get.rgb = function(string) { for (i = 0; i < 3; i++) { // https://jsperf.com/slice-vs-substr-vs-substring-methods-long-string/19 - var i2 = i * 2; + const i2 = i * 2; rgb[i] = parseInt(match.slice(i2, i2 + 2), 16); } @@ -239,7 +239,7 @@ colorString.get.rgb = function(string) { rgb[3] = parseFloat(match[4]); } } else if ((match = string.match(keyword))) { - if (match[1] === "transparent") { + if (match[1] === 'transparent') { return [0, 0, 0, 0]; } @@ -269,15 +269,15 @@ colorString.get.hsl = function(string) { return null; } - var hsl = /^hsla?\(\s*([+-]?(?:\d*\.)?\d+)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; - var match = string.match(hsl); + const hsl = /^hsla?\(\s*([+-]?(?:\d*\.)?\d+)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; + const match = string.match(hsl); if (match) { - var alpha = parseFloat(match[4]); - var h = (parseFloat(match[1]) + 360) % 360; - var s = clamp(parseFloat(match[2]), 0, 100); - var l = clamp(parseFloat(match[3]), 0, 100); - var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1); + const alpha = parseFloat(match[4]); + const h = (parseFloat(match[1]) + 360) % 360; + const s = clamp(parseFloat(match[2]), 0, 100); + const l = clamp(parseFloat(match[3]), 0, 100); + const a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1); return [h, s, l, a]; } @@ -290,15 +290,15 @@ colorString.get.hwb = function(string) { return null; } - var hwb = /^hwb\(\s*([+-]?\d*[\.]?\d+)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; - var match = string.match(hwb); + const hwb = /^hwb\(\s*([+-]?\d*[\.]?\d+)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; + const match = string.match(hwb); if (match) { - var alpha = parseFloat(match[4]); - var h = ((parseFloat(match[1]) % 360) + 360) % 360; - var w = clamp(parseFloat(match[2]), 0, 100); - var b = clamp(parseFloat(match[3]), 0, 100); - var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1); + const alpha = parseFloat(match[4]); + const h = ((parseFloat(match[1]) % 360) + 360) % 360; + const w = clamp(parseFloat(match[2]), 0, 100); + const b = clamp(parseFloat(match[3]), 0, 100); + const a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1); return [h, w, b, a]; } @@ -426,5 +426,5 @@ convert.hwb.rgb = function(hwb) { export default function extractColor(color) { const { value, model } = colorString.get(color); - return model === "rgb" ? value : convert[model].rgb(value).concat(value[3]); + return model === 'rgb' ? value : convert[model].rgb(value).concat(value[3]); } diff --git a/lib/extract/extractFill.js b/lib/extract/extractFill.js index 59e4f0c9..0c4781d9 100644 --- a/lib/extract/extractFill.js +++ b/lib/extract/extractFill.js @@ -1,12 +1,12 @@ -import extractBrush from "./extractBrush"; -import extractOpacity from "./extractOpacity"; +import extractBrush from './extractBrush'; +import extractOpacity from './extractOpacity'; const fillRules = { evenodd: 0, nonzero: 1, }; -const fillProps = ["fill", "fillOpacity", "fillRule"]; +const fillProps = ['fill', 'fillOpacity', 'fillRule']; const numFillProps = fillProps.length; export default function extractFill(props, styleProperties) { @@ -19,7 +19,7 @@ export default function extractFill(props, styleProperties) { return { // default fill is black - fill: extractBrush(props.fill || "#000"), + fill: extractBrush(props.fill || '#000'), fillOpacity: extractOpacity(props.fillOpacity), fillRule: fillRules[props.fillRule] === 0 ? 0 : 1, }; diff --git a/lib/extract/extractGradient.js b/lib/extract/extractGradient.js index 51101cfd..3d37782c 100644 --- a/lib/extract/extractGradient.js +++ b/lib/extract/extractGradient.js @@ -1,19 +1,19 @@ -import React, { Children } from "react"; +import React, { Children } from 'react'; -import extractColor from "./extractColor"; -import extractOpacity from "./extractOpacity"; -import extractTransform from "./extractTransform"; -import units from "../units"; +import extractColor from './extractColor'; +import extractOpacity from './extractOpacity'; +import extractTransform from './extractTransform'; +import units from '../units'; const percentReg = /^([+\-]?\d+(?:\.\d+)?(?:[eE][+\-]?\d+)?)(%?)$/; function percentToFloat(percent) { - if (typeof percent === "number") { + if (typeof percent === 'number') { return percent; } if ( - typeof percent === "object" && - typeof percent.__getAnimatedValue === "function" + typeof percent === 'object' && + typeof percent.__getAnimatedValue === 'function' ) { return percent.__getAnimatedValue(); } diff --git a/lib/extract/extractLengthList.js b/lib/extract/extractLengthList.js index 6d2a87a7..8a33a756 100644 --- a/lib/extract/extractLengthList.js +++ b/lib/extract/extractLengthList.js @@ -4,12 +4,12 @@ const commaReg = /,/g; export default function extractLengthList(lengthList) { if (Array.isArray(lengthList)) { return lengthList; - } else if (typeof lengthList === "number") { + } else if (typeof lengthList === 'number') { return [lengthList]; - } else if (typeof lengthList === "string") { + } else if (typeof lengthList === 'string') { return lengthList .trim() - .replace(commaReg, " ") + .replace(commaReg, ' ') .split(spaceReg); } else { return []; diff --git a/lib/extract/extractOpacity.js b/lib/extract/extractOpacity.js index 5e8809ec..dd263520 100644 --- a/lib/extract/extractOpacity.js +++ b/lib/extract/extractOpacity.js @@ -1,4 +1,4 @@ export default function extractOpacity(opacity) { const value = +opacity; - return typeof value !== "number" || isNaN(value) ? 1 : value; + return typeof value !== 'number' || isNaN(value) ? 1 : value; } diff --git a/lib/extract/extractPolyPoints.js b/lib/extract/extractPolyPoints.js index 92f2c922..20899501 100644 --- a/lib/extract/extractPolyPoints.js +++ b/lib/extract/extractPolyPoints.js @@ -1,7 +1,7 @@ export default function extractPolyPoints(points) { - const polyPoints = Array.isArray(points) ? points.join(",") : points; + const polyPoints = Array.isArray(points) ? points.join(',') : points; return polyPoints - .replace(/[^e]-/, " -") + .replace(/[^e]-/, ' -') .split(/(?:\s+|\s*,\s*)/g) - .join(" "); + .join(' '); } diff --git a/lib/extract/extractProps.js b/lib/extract/extractProps.js index 83a4461c..d91e14f3 100644 --- a/lib/extract/extractProps.js +++ b/lib/extract/extractProps.js @@ -1,10 +1,10 @@ -import extractFill from "./extractFill"; -import extractStroke from "./extractStroke"; -import extractTransform, { props2transform } from "./extractTransform"; -import extractClipPath from "./extractClipPath"; -import extractResponder from "./extractResponder"; -import extractOpacity from "./extractOpacity"; -import { idPattern } from "../util"; +import extractFill from './extractFill'; +import extractStroke from './extractStroke'; +import extractTransform, { props2transform } from './extractTransform'; +import extractClipPath from './extractClipPath'; +import extractResponder from './extractResponder'; +import extractOpacity from './extractOpacity'; +import { idPattern } from '../util'; export function propsAndStyles(props) { const style = props.style; @@ -44,7 +44,7 @@ export default function extractProps(props, ref) { extractedProps.mask = matched[1]; } else { console.warn( - 'Invalid `mask` prop, expected a mask like `"#id"`, but got: "' + + 'Invalid `mask` prop, expected a mask like "#id", but got: "' + mask + '"', ); diff --git a/lib/extract/extractResponder.js b/lib/extract/extractResponder.js index 881590b2..810b9413 100644 --- a/lib/extract/extractResponder.js +++ b/lib/extract/extractResponder.js @@ -1,17 +1,17 @@ -import { PanResponder } from "react-native"; +import { PanResponder } from 'react-native'; const responderProps = Object.keys(PanResponder.create({}).panHandlers); const numResponderProps = responderProps.length; const touchableProps = [ - "disabled", - "onPress", - "onPressIn", - "onPressOut", - "onLongPress", - "delayPressIn", - "delayPressOut", - "delayLongPress", + 'disabled', + 'onPress', + 'onPressIn', + 'onPressOut', + 'onLongPress', + 'delayPressIn', + 'delayPressOut', + 'delayLongPress', ]; const numTouchableProps = touchableProps.length; diff --git a/lib/extract/extractStroke.js b/lib/extract/extractStroke.js index 7b6c3be1..ec8fa516 100644 --- a/lib/extract/extractStroke.js +++ b/lib/extract/extractStroke.js @@ -1,6 +1,6 @@ -import extractBrush from "./extractBrush"; -import extractOpacity from "./extractOpacity"; -import extractLengthList from "./extractLengthList"; +import extractBrush from './extractBrush'; +import extractOpacity from './extractOpacity'; +import extractLengthList from './extractLengthList'; const caps = { butt: 0, @@ -15,14 +15,14 @@ const joins = { }; const strokeProps = [ - "stroke", - "strokeWidth", - "strokeOpacity", - "strokeDasharray", - "strokeDashoffset", - "strokeLinecap", - "strokeLinejoin", - "strokeMiterlimit", + 'stroke', + 'strokeWidth', + 'strokeOpacity', + 'strokeDasharray', + 'strokeDashoffset', + 'strokeLinecap', + 'strokeLinejoin', + 'strokeMiterlimit', ]; const numStrokeProps = strokeProps.length; @@ -36,7 +36,7 @@ export default function extractStroke(props, styleProperties) { const { stroke, strokeWidth = 1, strokeDasharray } = props; const strokeDash = - !strokeDasharray || strokeDasharray === "none" + !strokeDasharray || strokeDasharray === 'none' ? null : extractLengthList(strokeDasharray); diff --git a/lib/extract/extractText.js b/lib/extract/extractText.js index 4435a42d..d908079e 100644 --- a/lib/extract/extractText.js +++ b/lib/extract/extractText.js @@ -1,6 +1,6 @@ -import React, { Children } from "react"; -import extractLengthList from "./extractLengthList"; -import { pickNotNil } from "../util"; +import React, { Children } from 'react'; +import extractLengthList from './extractLengthList'; +import { pickNotNil } from '../util'; const fontRegExp = /^\s*((?:(?:normal|bold|italic)\s+)*)(?:(\d+(?:\.\d+)?[ptexm%])*(?:\s*\/.*?)?\s+)?\s*"?([^"]*)/i; const fontFamilyPrefix = /^[\s"']*/; @@ -16,8 +16,8 @@ function extractSingleFontFamily(fontFamilyString) { return fontFamilyString ? fontFamilyString .split(commaReg)[0] - .replace(fontFamilyPrefix, "") - .replace(fontFamilySuffix, "") + .replace(fontFamilyPrefix, '') + .replace(fontFamilySuffix, '') : null; } @@ -33,9 +33,9 @@ function parseFontString(font) { const isBold = /bold/.exec(match[1]); const isItalic = /italic/.exec(match[1]); cachedFontObjectsFromString[font] = { - fontSize: match[2] || "12", - fontWeight: isBold ? "bold" : "normal", - fontStyle: isItalic ? "italic" : "normal", + fontSize: match[2] || '12', + fontWeight: isBold ? 'bold' : 'normal', + fontStyle: isItalic ? 'italic' : 'normal', fontFamily: extractSingleFontFamily(match[3]), }; return cachedFontObjectsFromString[font]; @@ -77,7 +77,7 @@ export function extractFont(props) { fontFeatureSettings, }); - const baseFont = typeof font === "string" ? parseFontString(font) : font; + const baseFont = typeof font === 'string' ? parseFontString(font) : font; return { ...baseFont, ...ownedFont }; } @@ -89,7 +89,7 @@ export function setTSpan(TSpanImplementation) { } function getChild(child) { - if (typeof child === "string" || typeof child === "number") { + if (typeof child === 'string' || typeof child === 'number') { return {String(child)}; } else { return child; @@ -110,7 +110,7 @@ export default function extractText(props, container) { } = props; const textChildren = - typeof children === "string" || typeof children === "number" ? ( + typeof children === 'string' || typeof children === 'number' ? ( container ? ( {String(children)} ) : null diff --git a/lib/extract/extractTransform.js b/lib/extract/extractTransform.js index 8fe2d25d..49af8b9e 100644 --- a/lib/extract/extractTransform.js +++ b/lib/extract/extractTransform.js @@ -1,5 +1,5 @@ -import Matrix2D from "../Matrix2D"; -import transformParser from "./transform"; +import Matrix2D from '../Matrix2D'; +import transformParser from './transform'; const pooledMatrix = new Matrix2D(); @@ -16,7 +16,7 @@ function transformToMatrix(props, transform) { function appendTransform(transform) { if (transform) { - if (typeof transform === "string") { + if (typeof transform === 'string') { try { const t = transformParser.parse(transform); pooledMatrix.append(t[0], t[3], t[1], t[4], t[2], t[5]); @@ -42,7 +42,7 @@ function appendTransform(transform) { function universal2axis(universal, axisX, axisY, defaultValue) { let x; let y; - if (typeof universal === "string") { + if (typeof universal === 'string') { const coords = universal.split(/\s*,\s*/); if (coords.length === 2) { x = +coords[0]; @@ -50,7 +50,7 @@ function universal2axis(universal, axisX, axisY, defaultValue) { } else if (coords.length === 1) { x = y = +coords[0]; } - } else if (typeof universal === "number") { + } else if (typeof universal === 'number') { x = y = universal; } @@ -68,7 +68,7 @@ function universal2axis(universal, axisX, axisY, defaultValue) { } export function props2transform(props) { - if (props && typeof props === "string") { + if (props && typeof props === 'string') { return props; } const origin = universal2axis(props.origin, props.originX, props.originY); diff --git a/lib/extract/extractViewBox.js b/lib/extract/extractViewBox.js index d64ef497..5d9de50f 100644 --- a/lib/extract/extractViewBox.js +++ b/lib/extract/extractViewBox.js @@ -5,16 +5,16 @@ export const meetOrSliceTypes = { }; export const alignEnum = [ - "xMinYMin", - "xMidYMin", - "xMaxYMin", - "xMinYMid", - "xMidYMid", - "xMaxYMid", - "xMinYMax", - "xMidYMax", - "xMaxYMax", - "none", + 'xMinYMin', + 'xMidYMin', + 'xMaxYMin', + 'xMinYMid', + 'xMidYMid', + 'xMaxYMid', + 'xMinYMax', + 'xMidYMax', + 'xMaxYMax', + 'none', ].reduce((prev, name) => { prev[name] = name; return prev; @@ -35,7 +35,7 @@ export default function extractViewBox(props) { .map(Number); if (params.length !== 4 || params.some(isNaN)) { - console.warn("Invalid `viewBox` prop:" + viewBox); + console.warn('Invalid `viewBox` prop:' + viewBox); return null; } @@ -48,7 +48,7 @@ export default function extractViewBox(props) { minY: params[1], vbWidth: params[2], vbHeight: params[3], - align: alignEnum[modes[0]] || "xMidYMid", + align: alignEnum[modes[0]] || 'xMidYMid', meetOrSlice: meetOrSliceTypes[modes[1]] || 0, }; }