52 lines
1.5 KiB
JavaScript
52 lines
1.5 KiB
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import createReactNativeComponentClass from '../lib/createReactNativeComponentClass';
|
|
import extractProps from '../lib/extract/extractProps';
|
|
import {pathProps, numberProp} from '../lib/props';
|
|
import {UseAttributes} from '../lib/attributes';
|
|
import Shape from './Shape';
|
|
|
|
const idExpReg = /^#(.+)$/;
|
|
export default class extends Shape {
|
|
static displayName = 'Use';
|
|
|
|
static propTypes = {
|
|
href: PropTypes.string.isRequired,
|
|
width: numberProp, // Just for reusing `Symbol`
|
|
height: numberProp, // Just for reusing `Symbol`
|
|
...pathProps
|
|
};
|
|
|
|
setNativeProps = (...args) => {
|
|
this.root.setNativeProps(...args);
|
|
};
|
|
|
|
render() {
|
|
const {props} = this;
|
|
// match "url(#pattern)"
|
|
const matched = props.href.match(idExpReg);
|
|
let href;
|
|
|
|
if (matched) {
|
|
href = matched[1];
|
|
}
|
|
|
|
if (!href) {
|
|
console.warn('Invalid `href` prop for `Use` element, expected a href like `"#id"`, but got: "' + props.href + '"');
|
|
}
|
|
|
|
return <RNSVGUse
|
|
ref={ele => {this.root = ele;}}
|
|
{...extractProps(props, this)}
|
|
href={href}
|
|
width={props.width}
|
|
height={props.height}
|
|
>{props.children}</RNSVGUse>;
|
|
}
|
|
}
|
|
|
|
const RNSVGUse = createReactNativeComponentClass('RNSVGUse', () => ({
|
|
validAttributes: UseAttributes,
|
|
uiViewClassName: 'RNSVGUse'
|
|
}));
|