UNPKG

react-svg-textures

Version:

Textures.js ported to React. Fully isomorphic.

88 lines (71 loc) 3.45 kB
var _class, _temp2; function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } import { Component } from 'react'; import PropTypes from 'prop-types'; import textures from 'textures'; import isEqual from 'lodash.isequal'; import Selection from './selection'; var Paths = (_temp2 = _class = function (_Component) { _inherits(Paths, _Component); function Paths() { var _temp, _this, _ret; _classCallCheck(this, Paths); for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.state = { pattern: null }, _temp), _possibleConstructorReturn(_this, _ret); } Paths.prototype.componentWillMount = function componentWillMount() { this.generate(); }; Paths.prototype.componentDidUpdate = function componentDidUpdate(oldProps) { if (!isEqual(oldProps, this.props)) this.generate(); }; Paths.prototype.generate = function generate() { var _this2 = this; var t = textures.paths(); ['size', 'strokeWidth', 'shapeRendering', 'stroke', 'background', 'id', 'd'].forEach(function (key) { if (_this2.props[key]) t[key](_this2.props[key]); }); var selection = new Selection(); t(selection); this.setState({ pattern: selection.toReact(this.props.components) }); }; Paths.prototype.render = function render() { return this.state.pattern; }; return Paths; }(Component), _class.displayName = 'Paths', _class.defaultProps = { components: { defs: 'defs', g: 'g', circle: 'circle', rect: 'rect', pattern: 'pattern', path: 'path' } }, _temp2); export { Paths as default }; Paths.propTypes = process.env.NODE_ENV !== "production" ? { size: PropTypes.number, strokeWidth: PropTypes.number, d: PropTypes.oneOfType([PropTypes.oneOf(['squares', 'nylon', 'waves', 'woven', 'caps', 'crosses', 'hexagons']), PropTypes.func]), shapeRendering: PropTypes.string, stroke: PropTypes.string, background: PropTypes.string, id: PropTypes.string, components: PropTypes.shape({ defs: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), g: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), circle: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), rect: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), pattern: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), path: PropTypes.oneOfType([PropTypes.func, PropTypes.string]) }) } : {};