56 lines
1.6 KiB
JavaScript
56 lines
1.6 KiB
JavaScript
|
import React from 'react';
|
||
|
import PropTypes from 'prop-types';
|
||
|
import createReactNativeComponentClass from '../lib/createReactNativeComponentClass';
|
||
|
import {TextPathAttributes} from '../lib/attributes';
|
||
|
import extractText from '../lib/extract/extractText';
|
||
|
import Shape from './Shape';
|
||
|
import {pathProps, fontProps, numberProp} from '../lib/props';
|
||
|
import extractProps from '../lib/extract/extractProps';
|
||
|
import TSpan from './TSpan';
|
||
|
|
||
|
const idExpReg = /^#(.+)$/;
|
||
|
|
||
|
export default class extends Shape {
|
||
|
static displayName = 'Span';
|
||
|
|
||
|
static propTypes = {
|
||
|
...pathProps,
|
||
|
...fontProps,
|
||
|
href: PropTypes.string.isRequired,
|
||
|
startOffset: numberProp
|
||
|
};
|
||
|
|
||
|
render() {
|
||
|
let {children, href, startOffset, ...props} = this.props;
|
||
|
if (href) {
|
||
|
let matched = href.match(idExpReg);
|
||
|
|
||
|
if (matched) {
|
||
|
href = matched[1];
|
||
|
|
||
|
return <RNSVGTextPath
|
||
|
href={href}
|
||
|
{...extractProps({
|
||
|
...props,
|
||
|
x: null,
|
||
|
y: null
|
||
|
}, this)}
|
||
|
{...extractText({
|
||
|
children,
|
||
|
startOffset
|
||
|
}, true)}
|
||
|
/>;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
console.warn('Invalid `href` prop for `TextPath` element, expected a href like `"#id"`, but got: "' + props.href + '"');
|
||
|
return <TSpan>{children}</TSpan>
|
||
|
}
|
||
|
|
||
|
}
|
||
|
|
||
|
const RNSVGTextPath = createReactNativeComponentClass('RNSVGTextPath', () => ({
|
||
|
validAttributes: TextPathAttributes,
|
||
|
uiViewClassName: 'RNSVGTextPath'
|
||
|
}));
|