From 1e25870f5d04b91112e7167240dd1a7d4958815f Mon Sep 17 00:00:00 2001 From: Mikael Sand Date: Fri, 12 Oct 2018 18:52:23 +0300 Subject: [PATCH] Simplify and optimize property handling logic Remove redundant toString calls / type transforms. The view managers handle the different types natively. --- elements/Circle.js | 15 +++---- elements/ClipPath.js | 11 ++--- elements/Defs.js | 2 +- elements/Ellipse.js | 17 ++++---- elements/G.js | 8 ++-- elements/Image.js | 27 +++++-------- elements/Line.js | 17 ++++---- elements/LinearGradient.js | 21 +++++----- elements/Mask.js | 16 +++----- elements/Path.js | 6 +-- elements/Pattern.js | 16 +++----- elements/Polygon.js | 19 ++++----- elements/Polyline.js | 17 ++++---- elements/RadialGradient.js | 25 ++++++------ elements/Rect.js | 34 +++++++--------- elements/Stop.js | 4 +- elements/Svg.js | 37 +++++++++-------- elements/Symbol.js | 11 ++--- elements/TSpan.js | 15 ++++--- elements/Text.js | 13 +++--- elements/TextPath.js | 72 ++++++++++++++++----------------- elements/Use.js | 37 +++++++---------- lib/extract/extractClipPath.js | 4 +- lib/extract/extractFill.js | 4 +- lib/extract/extractGradient.js | 6 +-- lib/extract/extractProps.js | 2 +- lib/extract/extractResponder.js | 2 +- lib/extract/extractStroke.js | 6 +-- lib/extract/extractText.js | 10 ++--- lib/extract/extractTransform.js | 12 +++--- lib/extract/extractViewBox.js | 6 +-- 31 files changed, 231 insertions(+), 261 deletions(-) diff --git a/elements/Circle.js b/elements/Circle.js index 0a662faa..fc22285a 100644 --- a/elements/Circle.js +++ b/elements/Circle.js @@ -12,13 +12,13 @@ export default class extends Shape { ...pathProps, cx: numberProp.isRequired, cy: numberProp.isRequired, - r: numberProp.isRequired + r: numberProp.isRequired, }; static defaultProps = { cx: 0, cy: 0, - r: 0 + r: 0, }; setNativeProps = (...args) => { @@ -26,21 +26,22 @@ export default class extends Shape { }; render() { - let props = this.props; + const { props } = this; + const { cx, cy, r } = props; return ( { this.root = ele; }} {...extractProps(props, this)} - cx={props.cx.toString()} - cy={props.cy.toString()} - r={props.r.toString()} + cx={cx} + cy={cy} + r={r} /> ); } } const RNSVGCircle = requireNativeComponent("RNSVGCircle", null, { - nativeOnly: CircleAttributes + nativeOnly: CircleAttributes, }); diff --git a/elements/ClipPath.js b/elements/ClipPath.js index 1a7b3947..a59c37fa 100644 --- a/elements/ClipPath.js +++ b/elements/ClipPath.js @@ -6,18 +6,15 @@ import { ClipPathAttributes } from "../lib/attributes"; export default class extends Component { static displayName = "ClipPath"; static propTypes = { - id: PropTypes.string.isRequired + id: PropTypes.string.isRequired, }; render() { - return ( - - {this.props.children} - - ); + const { id, children } = this.props; + return {children}; } } const RNSVGClipPath = requireNativeComponent("RNSVGClipPath", null, { - nativeOnly: ClipPathAttributes + nativeOnly: ClipPathAttributes, }); diff --git a/elements/Defs.js b/elements/Defs.js index 581c9616..dc3f09aa 100644 --- a/elements/Defs.js +++ b/elements/Defs.js @@ -10,5 +10,5 @@ export default class extends Component { } const RNSVGDefs = requireNativeComponent("RNSVGDefs", null, { - nativeOnly: {} + nativeOnly: {}, }); diff --git a/elements/Ellipse.js b/elements/Ellipse.js index c045168e..e3ec0f66 100644 --- a/elements/Ellipse.js +++ b/elements/Ellipse.js @@ -13,14 +13,14 @@ export default class extends Shape { cx: numberProp.isRequired, cy: numberProp.isRequired, rx: numberProp.isRequired, - ry: numberProp.isRequired + ry: numberProp.isRequired, }; static defaultProps = { cx: 0, cy: 0, rx: 0, - ry: 0 + ry: 0, }; setNativeProps = (...args) => { @@ -28,7 +28,8 @@ export default class extends Shape { }; render() { - let props = this.props; + const { props } = this; + const { cx, cy, rx, ry } = props; return ( ); } } const RNSVGEllipse = requireNativeComponent("RNSVGEllipse", null, { - nativeOnly: EllipseAttributes + nativeOnly: EllipseAttributes, }); diff --git a/elements/G.js b/elements/G.js index b39a744f..659870ee 100644 --- a/elements/G.js +++ b/elements/G.js @@ -12,10 +12,10 @@ export default class extends Shape { static propTypes = { ...pathProps, - ...fontProps + ...fontProps, }; - setNativeProps = (props) => { + setNativeProps = props => { const matrix = !props.matrix && extractTransform(props); if (matrix) { props.matrix = matrix; @@ -24,7 +24,7 @@ export default class extends Shape { }; render() { - let { props } = this; + const { props } = this; return ( { - if (props.width) { - props.imagewidth = `${props.width}`; - } - if (props.height) { - props.imageheight = `${props.height}`; - } + setNativeProps = props => { this.root.setNativeProps(props); }; render() { - let { props } = this; - let modes = props.preserveAspectRatio.trim().split(spacesRegExp); - let meetOrSlice = meetOrSliceTypes[modes[1]] || 0; - let align = alignEnum[modes[0]] || "xMidYMid"; + const { props } = this; + const { preserveAspectRatio, x, y, width, height, href } = props; + const modes = preserveAspectRatio.trim().split(spacesRegExp); + const meetOrSlice = meetOrSliceTypes[modes[1]] || 0; + const align = alignEnum[modes[0]] || "xMidYMid"; return ( ); } diff --git a/elements/Line.js b/elements/Line.js index e32550e6..1c829f2f 100644 --- a/elements/Line.js +++ b/elements/Line.js @@ -13,14 +13,14 @@ export default class extends Shape { x1: numberProp.isRequired, x2: numberProp.isRequired, y1: numberProp.isRequired, - y2: numberProp.isRequired + y2: numberProp.isRequired, }; static defaultProps = { x1: 0, y1: 0, x2: 0, - y2: 0 + y2: 0, }; setNativeProps = (...args) => { @@ -28,22 +28,23 @@ export default class extends Shape { }; render() { - let props = this.props; + const { props } = this; + const { x1, y1, x2, y2 } = props; return ( { this.root = ele; }} {...extractProps(props, this)} - x1={props.x1.toString()} - y1={props.y1.toString()} - x2={props.x2.toString()} - y2={props.y2.toString()} + x1={x1} + y1={y1} + x2={x2} + y2={y2} /> ); } } const RNSVGLine = requireNativeComponent("RNSVGLine", null, { - nativeOnly: LineAttributes + nativeOnly: LineAttributes, }); diff --git a/elements/LinearGradient.js b/elements/LinearGradient.js index ebb2120e..2da27519 100644 --- a/elements/LinearGradient.js +++ b/elements/LinearGradient.js @@ -13,25 +13,26 @@ export default class extends Component { y1: numberProp.isRequired, y2: numberProp.isRequired, gradientUnits: PropTypes.oneOf(["objectBoundingBox", "userSpaceOnUse"]), - id: PropTypes.string.isRequired + id: PropTypes.string.isRequired, }; static defaultProps = { x1: "0%", y1: "0%", x2: "100%", - y2: "0%" + y2: "0%", }; render() { - let { props } = this; + const { props } = this; + const { x1, y1, x2, y2 } = props; return ( ); } @@ -41,6 +42,6 @@ const RNSVGLinearGradient = requireNativeComponent( "RNSVGLinearGradient", null, { - nativeOnly: LinearGradientAttributes - } + nativeOnly: LinearGradientAttributes, + }, ); diff --git a/elements/Mask.js b/elements/Mask.js index 6ac63a4b..e147c579 100644 --- a/elements/Mask.js +++ b/elements/Mask.js @@ -22,13 +22,7 @@ export default class extends Component { ]), }; - setNativeProps = (props) => { - if (props.width) { - props.maskwidth = `${props.width}`; - } - if (props.height) { - props.maskheight = `${props.height}`; - } + setNativeProps = props => { this.root.setNativeProps(props); }; @@ -62,10 +56,10 @@ export default class extends Component { this.root = ele; }} name={id} - x={`${x}`} - y={`${y}`} - maskwidth={`${width}`} - maskheight={`${height}`} + x={x} + y={y} + width={width} + height={height} matrix={extractedTransform} maskTransform={extractedTransform} maskUnits={ diff --git a/elements/Path.js b/elements/Path.js index f9b8c24c..0768e3f2 100644 --- a/elements/Path.js +++ b/elements/Path.js @@ -11,7 +11,7 @@ export default class extends Shape { static propTypes = { ...pathProps, - d: PropTypes.string.isRequired + d: PropTypes.string.isRequired, }; setNativeProps = (...args) => { @@ -19,7 +19,7 @@ export default class extends Shape { }; render() { - let props = this.props; + const { props } = this; return ( { - if (props.width) { - props.patternwidth = `${props.width}`; - } - if (props.height) { - props.patternheight = `${props.height}`; - } + setNativeProps = props => { this.root.setNativeProps(props); }; @@ -67,10 +61,10 @@ export default class extends Component { this.root = ele; }} name={id} - x={`${x}`} - y={`${y}`} - patternwidth={`${width}`} - patternheight={`${height}`} + x={x} + y={y} + width={width} + height={height} matrix={extractedTransform} patternTransform={extractedTransform} patternUnits={PATTERN_UNITS[patternUnits] || 0} diff --git a/elements/Polygon.js b/elements/Polygon.js index 4f7c5c02..1883cd56 100644 --- a/elements/Polygon.js +++ b/elements/Polygon.js @@ -10,27 +10,28 @@ export default class extends Shape { static propTypes = { ...pathProps, points: PropTypes.oneOfType([PropTypes.string, PropTypes.array]) - .isRequired + .isRequired, }; static defaultProps = { - points: "" + points: "", }; - setNativeProps = (...args) => { - //noinspection JSUnresolvedFunction - let points = [...args][0].points; + setNativeProps = props => { + let { points } = props; if (points) { if (Array.isArray(points)) { points = points.join(","); } - [...args][0].d = `M${extractPolyPoints(points)}`; + props.d = `M${extractPolyPoints(points)}`; } - this.root.setNativeProps(...args); + this.root.setNativeProps(props); }; render() { - let points = this.props.points; + const { props } = this; + let { points } = props; + if (Array.isArray(points)) { points = points.join(","); } @@ -40,7 +41,7 @@ export default class extends Shape { ref={ele => { this.root = ele; }} - {...this.props} + {...props} d={`M${extractPolyPoints(points)}z`} /> ); diff --git a/elements/Polyline.js b/elements/Polyline.js index 055cec5b..31d44333 100644 --- a/elements/Polyline.js +++ b/elements/Polyline.js @@ -10,27 +10,28 @@ export default class extends Shape { static propTypes = { ...pathProps, points: PropTypes.oneOfType([PropTypes.string, PropTypes.array]) - .isRequired + .isRequired, }; static defaultProps = { - points: "" + points: "", }; - setNativeProps = (...args) => { - //noinspection JSUnresolvedFunction - let points = [...args][0].points; + setNativeProps = props => { + let { points } = props; if (points) { if (Array.isArray(points)) { points = points.join(","); } - [...args][0].d = `M${extractPolyPoints(points)}`; + props.d = `M${extractPolyPoints(points)}`; } - this.root.setNativeProps(...args); + this.root.setNativeProps(props); }; render() { - let points = this.props.points; + const { props } = this; + let { points } = props; + if (Array.isArray(points)) { points = points.join(","); } diff --git a/elements/RadialGradient.js b/elements/RadialGradient.js index 3b05c48f..737f69e1 100644 --- a/elements/RadialGradient.js +++ b/elements/RadialGradient.js @@ -16,7 +16,7 @@ export default class extends Component { cy: numberProp.isRequired, r: numberProp, gradientUnits: PropTypes.oneOf(["objectBoundingBox", "userSpaceOnUse"]), - id: PropTypes.string.isRequired + id: PropTypes.string.isRequired, }; static defaultProps = { @@ -24,20 +24,21 @@ export default class extends Component { fy: "50%", cx: "50%", cy: "50%", - r: "50%" + r: "50%", }; render() { - let { props } = this; + const { props } = this; + const { fx, fy, rx, ry, r, cx, cy } = props; return ( ); } @@ -47,6 +48,6 @@ const RNSVGRadialGradient = requireNativeComponent( "RNSVGRadialGradient", null, { - nativeOnly: RadialGradientAttributes - } + nativeOnly: RadialGradientAttributes, + }, ); diff --git a/elements/Rect.js b/elements/Rect.js index 770ae8d4..55cb3bd8 100644 --- a/elements/Rect.js +++ b/elements/Rect.js @@ -16,7 +16,7 @@ export default class extends Shape { width: numberProp.isRequired, height: numberProp.isRequired, rx: numberProp, - ry: numberProp + ry: numberProp, }; static defaultProps = { @@ -25,22 +25,16 @@ export default class extends Shape { width: 0, height: 0, rx: 0, - ry: 0 + ry: 0, }; - setNativeProps = (props) => { - if (props.width) { - props.rectwidth = `${props.width}`; - } - if (props.height) { - props.rectheight = `${props.height}`; - } + setNativeProps = props => { this.root.setNativeProps(props); }; render() { - let props = this.props; - + const { props } = this; + const { x, y, width, height, rx, ry } = props; return ( { @@ -50,21 +44,21 @@ export default class extends Shape { { ...props, x: null, - y: null + y: null, }, - this + this, )} - x={props.x.toString()} - y={props.y.toString()} - rectwidth={props.width.toString()} - rectheight={props.height.toString()} - rx={props.rx.toString()} - ry={props.ry.toString()} + x={x} + y={y} + width={width} + height={height} + rx={rx} + ry={ry} /> ); } } const RNSVGRect = requireNativeComponent("RNSVGRect", null, { - nativeOnly: RectAttributes + nativeOnly: RectAttributes, }); diff --git a/elements/Stop.js b/elements/Stop.js index 6a6e8bd1..6406853f 100644 --- a/elements/Stop.js +++ b/elements/Stop.js @@ -6,12 +6,12 @@ export default class extends Component { static displayName = "Stop"; static propTypes = { stopColor: PropTypes.string, - stopOpacity: numberProp + stopOpacity: numberProp, }; static defaultProps = { stopColor: "#000", - stopOpacity: 1 + stopOpacity: 1, }; render() { diff --git a/elements/Svg.js b/elements/Svg.js index a75f0e56..78ce945d 100644 --- a/elements/Svg.js +++ b/elements/Svg.js @@ -6,7 +6,7 @@ import { requireNativeComponent, StyleSheet, findNodeHandle, - NativeModules + NativeModules, } from "react-native"; import extractResponder from "../lib/extract/extractResponder"; import extractViewBox from "../lib/extract/extractViewBox"; @@ -24,8 +24,8 @@ let id = 0; const styles = StyleSheet.create({ svg: { backgroundColor: "transparent", - borderWidth: 0 - } + borderWidth: 0, + }, }); class Svg extends Shape { @@ -39,11 +39,14 @@ class Svg extends Shape { // more detail https://svgwg.org/svg2-draft/coords.html#ViewBoxAttribute viewBox: PropTypes.string, preserveAspectRatio: PropTypes.string, - style: PropTypes.shape({ ...ViewPropTypes.style, color: PropTypes.string }) + style: PropTypes.shape({ + ...ViewPropTypes.style, + color: PropTypes.string, + }), }; static defaultProps = { - preserveAspectRatio: "xMidYMid meet" + preserveAspectRatio: "xMidYMid meet", }; constructor() { @@ -62,7 +65,7 @@ class Svg extends Shape { this.root.measureLayout(...args); }; - setNativeProps = (props) => { + setNativeProps = props => { if (props.width) { props.bbWidth = `${props.width}`; } @@ -87,18 +90,14 @@ class Svg extends Shape { ...props } = this.props; const stylesAndProps = { ...style, ...props }; - const { - color, - width, - height, - } = stylesAndProps; + const { color, width, height } = stylesAndProps; let dimensions; if (width && height) { dimensions = { width: width[width.length - 1] === "%" ? width : +width, height: height[height.length - 1] === "%" ? height : +height, - flex: 0 + flex: 0, }; } @@ -120,12 +119,14 @@ class Svg extends Shape { styles.svg, style, !isNaN(+opacity) && { - opacity: +opacity + opacity: +opacity, }, - dimensions + dimensions, ]} > - {children} + + {children} + ); } @@ -136,8 +137,10 @@ const NativeSvgView = requireNativeComponent("RNSVGSvgView", null, { ...ViewBoxAttributes, width: true, height: true, - tintColor: true - } + bbwidth: true, + bbheight: true, + tintColor: true, + }, }); export default Svg; diff --git a/elements/Symbol.js b/elements/Symbol.js index dc8b07a6..bb669eb2 100644 --- a/elements/Symbol.js +++ b/elements/Symbol.js @@ -9,19 +9,20 @@ export default class extends Component { static propTypes = { id: PropTypes.string.isRequired, viewBox: PropTypes.string, - preserveAspectRatio: PropTypes.string + preserveAspectRatio: PropTypes.string, }; render() { - let { props } = this; + const { props } = this; + const { id, children } = props; return ( - - {props.children} + + {children} ); } } const RNSVGSymbol = requireNativeComponent("RNSVGSymbol", null, { - nativeOnly: SymbolAttributes + nativeOnly: SymbolAttributes, }); diff --git a/elements/TSpan.js b/elements/TSpan.js index 840622eb..dd28fc6c 100644 --- a/elements/TSpan.js +++ b/elements/TSpan.js @@ -1,6 +1,5 @@ import React from "react"; import _ from "lodash"; -import PropTypes from "prop-types"; import { requireNativeComponent } from "react-native"; import extractText from "../lib/extract/extractText"; import { textProps } from "../lib/props"; @@ -15,20 +14,20 @@ export default class extends Shape { static propTypes = textProps; - setNativeProps = (props) => { + setNativeProps = props => { const matrix = !props.matrix && extractTransform(props); if (matrix) { props.matrix = matrix; } - const textProps = _.pickBy(extractText(props, true), p => !_.isNil(p)); + const text = _.pickBy(extractText(props, true), p => !_.isNil(p)); this.root.setNativeProps({ ...props, - ...textProps + ...text, }); }; render() { - let props = this.props; + const props = this.props; return ( { @@ -38,9 +37,9 @@ export default class extends Shape { { ...props, x: null, - y: null + y: null, }, - this + this, )} {...extractText(props)} /> @@ -49,5 +48,5 @@ export default class extends Shape { } const RNSVGTSpan = requireNativeComponent("RNSVGTSpan", null, { - nativeOnly: TSpanAttibutes + nativeOnly: TSpanAttibutes, }); diff --git a/elements/Text.js b/elements/Text.js index a5682a81..e6340d0d 100644 --- a/elements/Text.js +++ b/elements/Text.js @@ -1,6 +1,5 @@ import React from "react"; import _ from "lodash"; -import PropTypes from "prop-types"; import { requireNativeComponent } from "react-native"; import extractText from "../lib/extract/extractText"; import { textProps } from "../lib/props"; @@ -14,15 +13,15 @@ export default class extends Shape { static propTypes = textProps; - setNativeProps = (props) => { + setNativeProps = props => { const matrix = !props.matrix && extractTransform(props); if (matrix) { props.matrix = matrix; } - const textProps = _.pickBy(extractText(props, true), p => !_.isNil(p)); + const text = _.pickBy(extractText(props, true), p => !_.isNil(p)); this.root.setNativeProps({ ...props, - ...textProps + ...text, }); }; @@ -38,9 +37,9 @@ export default class extends Shape { { ...props, x: null, - y: null + y: null, }, - this + this, )} {...extractText(props, true)} /> @@ -49,5 +48,5 @@ export default class extends Shape { } const RNSVGText = requireNativeComponent("RNSVGText", null, { - nativeOnly: TextAttributes + nativeOnly: TextAttributes, }); diff --git a/elements/TextPath.js b/elements/TextPath.js index ca9adad6..8cf03d92 100644 --- a/elements/TextPath.js +++ b/elements/TextPath.js @@ -16,7 +16,7 @@ export default class extends Shape { static propTypes = textPathProps; render() { - let { + const { children, href, startOffset, @@ -27,51 +27,47 @@ export default class extends Shape { midLine, ...props } = this.props; - if (href) { - let matched = href.match(idExpReg); - - if (matched) { - href = matched[1]; - startOffset = `${startOffset || 0}`; - return ( - - ); - } + const matched = href && href.match(idExpReg); + const match = matched && matched[1]; + if (href && match) { + return ( + + ); } console.warn( 'Invalid `href` prop for `TextPath` element, expected a href like `"#id"`, but got: "' + - props.href + - '"' + href + + '"', ); return {children}; } } const RNSVGTextPath = requireNativeComponent("RNSVGTextPath", null, { - nativeOnly: TextPathAttributes + nativeOnly: TextPathAttributes, }); diff --git a/elements/Use.js b/elements/Use.js index 0b1a8fc0..c6dc2d67 100644 --- a/elements/Use.js +++ b/elements/Use.js @@ -14,40 +14,31 @@ export default class extends Shape { href: PropTypes.string.isRequired, width: numberProp, // Just for reusing `Symbol` height: numberProp, // Just for reusing `Symbol` - ...pathProps + ...pathProps, }; static defaultProps = { width: 0, - height: 0 + height: 0, }; - setNativeProps = (props) => { - if (props.width) { - props.usewidth = `${props.width}`; - } - if (props.height) { - props.useheight = `${props.height}`; - } + setNativeProps = props => { this.root.setNativeProps(props); }; render() { const { props } = this; - const { children, width, height } = props; + const { children, width, height, href } = props; + // match "url(#pattern)" - const matched = props.href.match(idExpReg); - let href; + const matched = href.match(idExpReg); + const match = matched && matched[1]; - if (matched) { - href = matched[1]; - } - - if (!href) { + if (!match) { console.warn( 'Invalid `href` prop for `Use` element, expected a href like `"#id"`, but got: "' + - props.href + - '"' + href + + '"', ); } @@ -57,9 +48,9 @@ export default class extends Shape { this.root = ele; }} {...extractProps(props, this)} - href={href} - usewidth={width !== undefined ? width.toString() : ""} - useheight={height !== undefined ? height.toString() : ""} + href={match} + width={width} + height={height} > {children} @@ -68,5 +59,5 @@ export default class extends Shape { } const RNSVGUse = requireNativeComponent("RNSVGUse", null, { - nativeOnly: UseAttributes + nativeOnly: UseAttributes, }); diff --git a/lib/extract/extractClipPath.js b/lib/extract/extractClipPath.js index 949d75d9..c59ae52e 100644 --- a/lib/extract/extractClipPath.js +++ b/lib/extract/extractClipPath.js @@ -2,7 +2,7 @@ import clipReg from "./patternReg"; const clipRules = { evenodd: 0, - nonzero: 1 + nonzero: 1, }; export default function(props) { @@ -20,7 +20,7 @@ export default function(props) { console.warn( 'Invalid `clipPath` prop, expected a clipPath like `"#id"`, but got: "' + clipPath + - '"' + '"', ); } } diff --git a/lib/extract/extractFill.js b/lib/extract/extractFill.js index 61c7187b..79051873 100644 --- a/lib/extract/extractFill.js +++ b/lib/extract/extractFill.js @@ -4,7 +4,7 @@ import { fillProps } from "../props"; const fillRules = { evenodd: 0, - nonzero: 1 + nonzero: 1, }; const fillKeys = Object.keys(fillProps); @@ -20,6 +20,6 @@ export default function(props, styleProperties) { // default fill is black fill: extractBrush(props.fill || "#000"), fillOpacity: extractOpacity(props.fillOpacity), - fillRule: fillRules[props.fillRule] === 0 ? 0 : 1 + fillRule: fillRules[props.fillRule] === 0 ? 0 : 1, }; } diff --git a/lib/extract/extractGradient.js b/lib/extract/extractGradient.js index a4e4ae07..87e10395 100644 --- a/lib/extract/extractGradient.js +++ b/lib/extract/extractGradient.js @@ -21,7 +21,7 @@ export default function(props) { // add stop //noinspection JSUnresolvedFunction stops[offset] = Color(child.props.stopColor).alpha( - extractOpacity(child.props.stopOpacity) + extractOpacity(child.props.stopOpacity), ); } }); @@ -30,7 +30,7 @@ export default function(props) { _.map(stops, (stop, offset) => { return { stop, offset }; }), - "offset" + "offset", ); const gradient = []; @@ -58,6 +58,6 @@ export default function(props) { gradient, name: props.id, gradientTransform, - gradientUnits: PATTERN_UNITS[props.gradientUnits] || 0 + gradientUnits: PATTERN_UNITS[props.gradientUnits] || 0, }; } diff --git a/lib/extract/extractProps.js b/lib/extract/extractProps.js index 1c327a83..a2e4d6ab 100644 --- a/lib/extract/extractProps.js +++ b/lib/extract/extractProps.js @@ -34,7 +34,7 @@ export default function(prop, ref) { console.warn( 'Invalid `mask` prop, expected a mask like `"#id"`, but got: "' + mask + - '"' + '"', ); } } diff --git a/lib/extract/extractResponder.js b/lib/extract/extractResponder.js index a80822cb..1c0a2bee 100644 --- a/lib/extract/extractResponder.js +++ b/lib/extract/extractResponder.js @@ -29,7 +29,7 @@ export default function(props, ref) { onResponderGrant: ref.touchableHandleResponderGrant, onResponderMove: ref.touchableHandleResponderMove, onResponderRelease: ref.touchableHandleResponderRelease, - onResponderTerminate: ref.touchableHandleResponderTerminate + onResponderTerminate: ref.touchableHandleResponderTerminate, }); return false; diff --git a/lib/extract/extractStroke.js b/lib/extract/extractStroke.js index 40f6d542..f8c871a1 100644 --- a/lib/extract/extractStroke.js +++ b/lib/extract/extractStroke.js @@ -6,13 +6,13 @@ import extractLengthList from "./extractLengthList"; const caps = { butt: 0, square: 2, - round: 1 + round: 1, }; const joins = { miter: 0, bevel: 2, - round: 1 + round: 1, }; const strokeKeys = Object.keys(strokeProps); @@ -52,6 +52,6 @@ export default function(props, styleProperties) { strokeDasharray: strokeDasharray, strokeWidth: strokeWidth, strokeDashoffset: strokeDasharray ? +props.strokeDashoffset || 0 : null, - strokeMiterlimit: parseFloat(props.strokeMiterlimit) || 4 + strokeMiterlimit: parseFloat(props.strokeMiterlimit) || 4, }; } diff --git a/lib/extract/extractText.js b/lib/extract/extractText.js index 62a0bfc0..5b79a99b 100644 --- a/lib/extract/extractText.js +++ b/lib/extract/extractText.js @@ -41,7 +41,7 @@ function parseFontString(font) { fontSize, fontFamily, fontWeight, - fontStyle + fontStyle, }; return cachedFontObjectsFromString[font]; } @@ -60,7 +60,7 @@ export function extractFont(prop) { wordSpacing, kerning, fontVariantLigatures, - fontFeatureSettings + fontFeatureSettings, } = props; let { fontSize, fontFamily, font } = props; @@ -82,9 +82,9 @@ export function extractFont(prop) { wordSpacing, kerning, fontVariantLigatures, - fontFeatureSettings + fontFeatureSettings, }, - p => !_.isNil(p) + p => !_.isNil(p), ); if (typeof font === "string") { @@ -137,6 +137,6 @@ export default function(props, container) { y: extractLengthList(y), dx: extractLengthList(dx), dy: extractLengthList(dy), - rotate: extractLengthList(rotate) + rotate: extractLengthList(rotate), }; } diff --git a/lib/extract/extractTransform.js b/lib/extract/extractTransform.js index 0d68265f..3143b9a4 100644 --- a/lib/extract/extractTransform.js +++ b/lib/extract/extractTransform.js @@ -189,7 +189,7 @@ function appendTransform(transform) { transform.skewX, transform.skewY, transform.originX, - transform.originY + transform.originY, ); } } @@ -231,19 +231,19 @@ export function props2transform(props) { let [originX, originY] = universal2axis( props.origin, props.originX, - props.originY + props.originY, ); let [scaleX, scaleY] = universal2axis( props.scale, props.scaleX, props.scaleY, - 1 + 1, ); let [skewX, skewY] = universal2axis(props.skew, props.skewX, props.skewY); let [translateX, translateY] = universal2axis( props.translate, _.isNil(props.translateX) ? props.x || 0 : props.translateX, - _.isNil(props.translateY) ? props.y || 0 : props.translateY + _.isNil(props.translateY) ? props.y || 0 : props.translateY, ); return { @@ -255,13 +255,13 @@ export function props2transform(props) { skewX: skewX, skewY: skewY, x: translateX, - y: translateY + y: translateY, }; } export default function(props) { return transformToMatrix( props2transform(props), - props.transform ? props2transform(props.transform) : null + props.transform ? props2transform(props.transform) : null, ); } diff --git a/lib/extract/extractViewBox.js b/lib/extract/extractViewBox.js index d5e5e300..8a366a23 100644 --- a/lib/extract/extractViewBox.js +++ b/lib/extract/extractViewBox.js @@ -1,7 +1,7 @@ const meetOrSliceTypes = { meet: 0, slice: 1, - none: 2 + none: 2, }; const alignEnum = [ @@ -14,7 +14,7 @@ const alignEnum = [ "xMinYMax", "xMidYMax", "xMaxYMax", - "none" + "none", ].reduce((prev, name) => { prev[name] = name; return prev; @@ -49,7 +49,7 @@ export default function(props) { vbWidth: +params[2], vbHeight: +params[3], align, - meetOrSlice + meetOrSlice, }; }