on af19266 help sign in
bridge/src/components/ReactSVGComponents.js
87 lines 2.1 kB history raw
1import React from 'react';
2import { get, map } from 'lodash';
4const ReactSVGComponents = {
5 svg: (p, key) => {
6 const { width, height, ...attrs } = p.attr;
7 return (
8 <svg
9 {...attrs}
10 style={{ width: '100%', height: '100%' }}
11 version={'1.1'}
12 xmlns={'http://www.w3.org/2000/svg'}
13 key={key}
14 viewBox={`0 0 ${width} ${height}`}
15 preserveAspectRatio="xMidYMid meet">
16 {map(get(p, 'children', []), (child, idx) =>
17 ReactSVGComponents[child.tag](child, idx)
18 )}
19 </svg>
20 );
21 },
22 circle: (p, key) => {
23 return (
24 <circle {...p.attr} key={key}>
25 {map(get(p, 'children', []), (child, idx) =>
26 ReactSVGComponents[child.tag](child, idx)
27 )}
28 </circle>
29 );
30 },
31 rect: (p, key) => {
32 return (
33 <rect {...p.attr} key={key}>
34 {map(get(p, 'children', []), (child, idx) =>
35 ReactSVGComponents[child.tag](child, idx)
36 )}
37 </rect>
38 );
39 },
40 path: (p, key) => {
41 return (
42 <path {...p.attr} key={key}>
43 {map(get(p, 'children', []), (child, idx) =>
44 ReactSVGComponents[child.tag](child, idx)
45 )}
46 </path>
47 );
48 },
49 g: (p, key) => {
50 return (
51 <g {...p.attr} key={key}>
52 {map(get(p, 'children', []), (child, idx) =>
53 ReactSVGComponents[child.tag](child, idx)
54 )}
55 </g>
56 );
57 },
58 polygon: (p, key) => {
59 return (
60 <polygon {...p.attr} key={key}>
61 {map(get(p, 'children', []), (child, idx) =>
62 ReactSVGComponents[child.tag](child, idx)
63 )}
64 </polygon>
65 );
66 },
67 line: (p, key) => {
68 return (
69 <line {...p.attr} key={key}>
70 {map(get(p, 'children', []), (child, idx) =>
71 ReactSVGComponents[child.tag](child, idx)
72 )}
73 </line>
74 );
75 },
76 polyline: (p, key) => {
77 return (
78 <polyline {...p.attr} key={key}>
79 {map(get(p, 'children', []), (child, idx) =>
80 ReactSVGComponents[child.tag](child, idx)
81 )}
82 </polyline>
83 );
84 },
85};
87export default ReactSVGComponents;