123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133 |
- "use strict";
- exports.__esModule = true;
- exports.default = void 0;
- const elementToComponent = {
- svg: 'Svg',
- circle: 'Circle',
- clipPath: 'ClipPath',
- ellipse: 'Ellipse',
- g: 'G',
- linearGradient: 'LinearGradient',
- radialGradient: 'RadialGradient',
- line: 'Line',
- path: 'Path',
- pattern: 'Pattern',
- polygon: 'Polygon',
- polyline: 'Polyline',
- rect: 'Rect',
- symbol: 'Symbol',
- text: 'Text',
- textPath: 'TextPath',
- tspan: 'TSpan',
- use: 'Use',
- defs: 'Defs',
- stop: 'Stop',
- mask: 'Mask',
- image: 'Image',
- foreignObject: 'ForeignObject'
- };
- const expoPrefix = (component, expo) => {
- // Prefix with 'Svg.' in the case we're transforming for Expo
- if (!expo) {
- return component;
- }
- return (component !== 'Svg' ? 'Svg.' : '') + component;
- };
- const plugin = ({
- types: t
- }, {
- expo
- }) => {
- function replaceElement(path, state) {
- const {
- name
- } = path.node.openingElement.name; // Replace element by react-native-svg components
- const component = elementToComponent[name];
- if (component) {
- const prefixedComponent = expoPrefix(component, expo);
- const openingElementName = path.get('openingElement.name');
- openingElementName.replaceWith(t.jsxIdentifier(prefixedComponent));
- if (path.has('closingElement')) {
- const closingElementName = path.get('closingElement.name');
- closingElementName.replaceWith(t.jsxIdentifier(prefixedComponent));
- }
- state.replacedComponents.add(prefixedComponent);
- return;
- } // Remove element if not supported
- state.unsupportedComponents.add(name);
- path.remove();
- }
- const svgElementVisitor = {
- JSXElement(path, state) {
- if (!path.get('openingElement.name').isJSXIdentifier({
- name: 'svg'
- })) {
- return;
- }
- replaceElement(path, state);
- path.traverse(jsxElementVisitor, state);
- }
- };
- const jsxElementVisitor = {
- JSXElement(path, state) {
- replaceElement(path, state);
- }
- };
- const importDeclarationVisitor = {
- ImportDeclaration(path, state) {
- if (path.get('source').isStringLiteral({
- value: 'react-native-svg'
- })) {
- state.replacedComponents.forEach(component => {
- if (path.get('specifiers').some(specifier => specifier.get('local').isIdentifier({
- name: component
- }))) {
- return;
- }
- path.pushContainer('specifiers', t.importSpecifier(t.identifier(component), t.identifier(component)));
- });
- } else if (path.get('source').isStringLiteral({
- value: 'expo'
- })) {
- path.pushContainer('specifiers', t.importSpecifier(t.identifier('Svg'), t.identifier('Svg')));
- } else {
- return;
- }
- if (state.unsupportedComponents.size && !path.has('trailingComments')) {
- const componentList = [...state.unsupportedComponents].join(', ');
- path.addComment('trailing', ` SVGR has dropped some elements not supported by react-native-svg: ${componentList} `);
- }
- }
- };
- return {
- visitor: {
- Program(path, state) {
- state.replacedComponents = new Set();
- state.unsupportedComponents = new Set();
- path.traverse(svgElementVisitor, state);
- path.traverse(importDeclarationVisitor, state);
- }
- }
- };
- };
- var _default = plugin;
- exports.default = _default;
|