@tuofeng/react-native-d3multiline-chart/utils/AnimatedSVGPropString/index.js

Android and iOS multipleline/line/scatter chart based on d3.js, change and use for tuofeng

import React, { Component } from 'react';

/**
 * Problem: Props cannot be animated, too many times you have to do val.toString() in setNativeProps
 * Solution: Use a higher order component to do that for you
 */

const KEYS = [
  'strokeWidth', 'strokeOpacity', 'fillOpacity'
];

export default function SvgPropStringFix(WrappedComponent, propKeys = []) {
  propKeys = [...KEYS, ...propKeys];
  return class extends Component {
    setNativeProps = (props) => {
      propKeys.reduce((acc, key) => {
        const val = props[key];
        if (val != null) {
          acc[key] = val.toString();
        }
        return acc;
      }, props);
      this._component && this._component.setNativeProps(props);
    }
    render() {
      return (
        <WrappedComponent
          ref={component => (this._component = component)}
          {...this.props}
        />
      );
    }
  };
}