✨ feat: add field component (#49)

* ✨ feat: add FieldIcon * ✨ feat: add FieldTitle comp * ✨ feat: add field select * 📝 chore: 调整展示区域 * 📝 chore: remove techui doc * ♻️ fix: field icon style * 🐛 fix: input onchange * 📸 chore: update snapshot --------- Co-authored-by: rdmclin2 <rdmclin2@gmail.com>
ant-design · Jul 24, 2023 · dfdfd16 · dfdfd16
1 parent 62826c9
commit dfdfd16
Show file tree

Hide file tree

Showing 49 changed files with 3,608 additions and 11 deletions.
diff --git a/docs/guide/intro.md b/docs/guide/intro.md
@@ -9,7 +9,7 @@ nav:
 
 # 快速开始
 
-ProEditor 是 TechUI Studio 系列装配器的底座框架，期望为「编辑」场景提供丰富、易用的基础组件与原子能力。
+ProEditor 定位轻量级编辑器 UI 框架，期望为「编辑」场景提供丰富、易用的基础组件与原子能力。
 
 ## 安装
 

diff --git a/src/FieldIcon/demos/basic.tsx b/src/FieldIcon/demos/basic.tsx
@@ -0,0 +1,53 @@
+import { ProCard } from '@ant-design/pro-components';
+import { APIFieldType, FieldIcon } from '@ant-design/pro-editor';
+
+const Demo = () => {
+  return (
+    <ProCard ghost gutter={[8, 8]} wrap>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.any} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.anyArray} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.bool} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.boolArray} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.integer} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.integerArray} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.number} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.numberArray} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.object} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.objectArray} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.string} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.stringArray} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon type={APIFieldType.array} />
+      </ProCard>
+      <ProCard layout="center" bordered colSpan={4}>
+        <FieldIcon />
+      </ProCard>
+    </ProCard>
+  );
+};
+
+export default Demo;
diff --git a/src/FieldIcon/icons/TypeAny.d.ts b/src/FieldIcon/icons/TypeAny.d.ts
@@ -0,0 +1,4 @@
+import React from 'react';
+
+declare const res: React.FC<React.SVGProps<SVGSVGElement>>;
+export default res;
diff --git a/src/FieldIcon/icons/TypeAny.js b/src/FieldIcon/icons/TypeAny.js
@@ -0,0 +1,47 @@
+import * as React from 'react';
+function TypeAny(props) {
+  return /*#__PURE__*/ React.createElement(
+    'svg',
+    Object.assign(
+      {
+        width: '1em',
+        height: '1em',
+        viewBox: '0 0 17 17',
+        xmlns: 'http://www.w3.org/2000/svg',
+        xmlnsXlink: 'http://www.w3.org/1999/xlink',
+      },
+      props,
+      {
+        style: Object.assign(
+          {
+            verticalAlign: '-0.125em',
+          },
+          props.style,
+        ),
+        className: ['pro-editor-icon', props.className].filter(Boolean).join(' '),
+      },
+    ),
+    /*#__PURE__*/ React.createElement(
+      'g',
+      {
+        id: 'TypeAny-\u9875\u9762-1',
+        stroke: 'none',
+        strokeWidth: 1,
+        fill: 'currentColor',
+        fillRule: 'evenodd',
+      },
+      /*#__PURE__*/ React.createElement(
+        'g',
+        {
+          id: 'TypeAny-\u7F16\u7EC4-2',
+          transform: 'translate(0.210938, 0.644531)',
+        },
+        /*#__PURE__*/ React.createElement('path', {
+          d: 'M12.1525262,6.06243032 L13.4664705,9.94584615 L13.4878216,9.94584615 L14.7964147,6.06243032 L15.9821628,6.06243032 L13.5946488,12.7555674 C13.441534,13.1722274 13.2296812,13.4606734 12.9590546,13.6209231 C12.6848606,13.7740557 12.3750814,13.8506132 12.0296812,13.8506132 L11.661146,13.8506132 L11.661146,12.7983055 L11.986961,12.7983055 C12.1329409,12.7983055 12.2682542,12.7591349 12.3928829,12.6807759 C12.5175117,12.5988852 12.6047536,12.4777882 12.6546087,12.3175563 L12.9590546,11.3880936 L10.9721293,6.06243032 L12.1525262,6.06243032 Z M2.15714604,6.00053512 C2.85481382,5.9934359 3.41188852,6.12487848 3.82837012,6.39489855 C4.24486957,6.67201784 4.45665106,7.14809365 4.46376812,7.82314381 L4.46376812,11.6016054 L3.34781717,11.6016054 L3.34781717,11.1113133 L3.326466,11.1113133 C3.22324192,11.2996031 3.06306355,11.4381628 2.84593088,11.5269922 C2.63234783,11.6193712 2.33689186,11.6655518 1.95958082,11.6655518 C1.34020067,11.6584526 0.863215162,11.4950279 0.528606466,11.1752598 C0.17619621,10.8626087 0,10.4629119 0,9.97616945 C0,9.51074247 0.153061315,9.12526198 0.459183946,8.81972798 C0.765324415,8.50705909 1.21382386,8.34718395 1.80473579,8.34008473 L3.34783501,8.34008473 L3.34783501,7.75919732 C3.35495206,7.27245485 2.9758573,7.03618283 2.21053289,7.05039911 C1.93287848,7.05039911 1.71394426,7.07881382 1.55376589,7.13566109 C1.38647046,7.20317503 1.25476031,7.31686957 1.15867113,7.4767447 L0.282987737,6.81057748 C0.706586399,6.25633891 1.33128205,5.98631884 2.15714604,6.00053512 Z M8.4790903,6 C8.93836343,6 9.358466,6.16171237 9.73943367,6.48513712 C10.1168161,6.81212932 10.3144169,7.29191527 10.3322185,7.92456633 L10.3322185,11.6031215 L9.21607135,11.6031215 L9.21607135,8.3084058 C9.21607135,7.92101672 9.11282943,7.62602453 8.90632776,7.42342921 C8.70339353,7.21730212 8.44170346,7.11422074 8.12127536,7.11422074 C7.80084727,7.11422074 7.5373913,7.21730212 7.33090747,7.42342921 C7.12083835,7.62602453 7.01581271,7.92101672 7.01581271,8.30842363 L7.01581271,11.6031215 L5.89966555,11.6031215 L5.89966555,6.06929766 L7.01581271,6.06929766 L7.01581271,6.65573244 L7.03718172,6.65573244 C7.4038796,6.21857748 7.88452174,6 8.4790903,6 Z M3.3400223,9.26198439 L2.00618952,9.26198439 C1.35882274,9.27628986 1.03869788,9.4997369 1.04583278,9.93230769 C1.04583278,10.1218105 1.12941806,10.2826845 1.29658863,10.4149833 C1.45664214,10.5615518 1.72163211,10.634845 2.09155853,10.634845 C2.55750279,10.6419799 2.88651059,10.5865775 3.07858194,10.468602 C3.2528874,10.3506087 3.3400223,10.0824794 3.3400223,9.66419621 L3.3400223,9.26198439 Z',
+          id: 'TypeAny-\u5F62\u72B6\u7ED3\u5408',
+        }),
+      ),
+    ),
+  );
+}
+export default TypeAny;
diff --git a/src/FieldIcon/icons/TypeAnyArr.d.ts b/src/FieldIcon/icons/TypeAnyArr.d.ts
@@ -0,0 +1,4 @@
+import React from 'react';
+
+declare const res: React.FC<React.SVGProps<SVGSVGElement>>;
+export default res;
diff --git a/src/FieldIcon/icons/TypeAnyArr.js b/src/FieldIcon/icons/TypeAnyArr.js
@@ -0,0 +1,93 @@
+import * as React from 'react';
+function TypeAnyArr(props) {
+  return /*#__PURE__*/ React.createElement(
+    'svg',
+    Object.assign(
+      {
+        width: '1em',
+        height: '1em',
+        viewBox: '0 0 17 16',
+        xmlns: 'http://www.w3.org/2000/svg',
+        xmlnsXlink: 'http://www.w3.org/1999/xlink',
+      },
+      props,
+      {
+        style: Object.assign(
+          {
+            verticalAlign: '-0.125em',
+          },
+          props.style,
+        ),
+        className: ['pro-editor-icon', props.className].filter(Boolean).join(' '),
+      },
+    ),
+    /*#__PURE__*/ React.createElement(
+      'defs',
+      null,
+      /*#__PURE__*/ React.createElement('rect', {
+        id: 'TypeAnyArr-path-1',
+        x: 0,
+        y: 0,
+        width: 16,
+        height: 16,
+      }),
+    ),
+    /*#__PURE__*/ React.createElement(
+      'g',
+      {
+        id: 'TypeAnyArr-\u9875\u9762-1',
+        stroke: 'none',
+        strokeWidth: 1,
+        fill: 'none',
+        fillRule: 'evenodd',
+      },
+      /*#__PURE__*/ React.createElement(
+        'g',
+        {
+          id: 'TypeAnyArr-\u7F16\u7EC4',
+          transform: 'translate(-156.183593, -18.424879)',
+        },
+        /*#__PURE__*/ React.createElement(
+          'g',
+          {
+            transform: 'translate(130.328125, 0.000000)',
+            id: 'TypeAnyArr-svg',
+          },
+          /*#__PURE__*/ React.createElement(
+            'g',
+            {
+              transform: 'translate(26.492188, 17.000000)',
+            },
+            /*#__PURE__*/ React.createElement(
+              'g',
+              {
+                transform: 'translate(0.000000, 1.421875)',
+              },
+              /*#__PURE__*/ React.createElement(
+                'mask',
+                {
+                  id: 'TypeAnyArr-mask-2',
+                  fill: 'white',
+                },
+                /*#__PURE__*/ React.createElement('use', {
+                  xlinkHref: '#TypeAnyArr-path-1',
+                }),
+              ),
+              /*#__PURE__*/ React.createElement('g', {
+                id: 'TypeAnyArr-\u5BB9\u5668',
+              }),
+              /*#__PURE__*/ React.createElement('path', {
+                d: 'M2.4793757,4.27432776 L1.43825195,4.27432776 L1.43825195,10.8583367 L2.4793757,10.8583367 L2.4793757,12.1326644 L0,12.1326644 L0,3 L2.4793757,3 L2.4793757,4.27432776 Z M13.5027871,4.27432776 L13.5027871,3 L15.9821628,3 L15.9821628,12.1326644 L13.5027871,12.1326644 L13.5027871,10.8583367 L14.5439108,10.8583367 L14.5439108,4.27432776 L13.5027871,4.27432776 Z M4.76700111,9.02664883 L4.75241026,9.02664883 C4.68186399,9.15472018 4.57241472,9.24893645 4.42402676,9.30933333 C4.27810033,9.37215608 4.07620067,9.40356745 3.81838127,9.40356745 C3.39515719,9.39875139 3.06921739,9.28758974 2.84057971,9.07013601 C2.59977703,8.85751616 2.4793757,8.58571237 2.4793757,8.2547068 C2.4793757,7.9382029 2.58397324,7.67606689 2.79313266,7.4682631 C3.00232776,7.25564326 3.30880713,7.14692531 3.71257079,7.14209142 L4.76700111,7.14209142 L4.76700111,6.747068 C4.77187068,6.41604459 4.51282051,6.25538462 3.98986845,6.2650524 C3.80013378,6.2650524 3.65055072,6.28437012 3.54108361,6.32302341 C3.42678261,6.36893645 3.33677592,6.44626087 3.27109922,6.55497882 L2.67274916,6.10196656 C2.96219398,5.72504794 3.38907469,5.54143144 3.95337347,5.55108138 C4.43012709,5.54626533 4.81077369,5.63564771 5.09536678,5.81928205 C5.37995987,6.00773244 5.52467336,6.33147826 5.52954292,6.79055518 L5.52954292,9.36008027 L4.76700111,9.36008027 L4.76700111,9.02664883 Z M4.76254181,7.76254181 L3.84998885,7.76254181 C3.4070903,7.77219175 3.18808473,7.92309476 3.19293645,8.21525084 C3.19293645,8.34319732 3.25012263,8.45184392 3.36451282,8.5411728 C3.47401561,8.64016945 3.65531327,8.68966778 3.90838796,8.68966778 C4.22717503,8.69448384 4.4522631,8.65707915 4.58368785,8.57740022 C4.70292977,8.49772129 4.76254181,8.31663768 4.76254181,8.03416722 L4.76254181,7.76254181 Z M6.52842809,5.5979398 L7.29198662,5.5979398 L7.29198662,5.99745819 L7.30661315,5.99745819 C7.55745819,5.69962988 7.88626979,5.55072464 8.29301226,5.55072464 C8.60721516,5.55072464 8.89462653,5.6608874 9.15522854,5.88123077 C9.41340468,6.104 9.54857525,6.43086734 9.56075808,6.86185061 L9.56075808,9.36789298 L8.79719955,9.36789298 L8.79719955,7.12336232 C8.79719955,6.85942475 8.7265641,6.65847046 8.5852932,6.52046377 C8.446466,6.38001338 8.26745151,6.30980602 8.04824972,6.30980602 C7.8290301,6.30980602 7.64880268,6.38001338 7.50754961,6.52046377 C7.36383501,6.65847046 7.29198662,6.85942475 7.29198662,7.12336232 L7.29198662,9.36789298 L6.52842809,9.36789298 L6.52842809,5.5979398 Z M10.006689,5.58639911 L10.813592,5.58639911 L11.7117681,8.22796878 L11.726359,8.22796878 L12.6209142,5.58639911 L13.4314381,5.58639911 L11.7993846,10.139175 C11.6947157,10.4226087 11.5498952,10.6188183 11.3649052,10.7278038 C11.1774716,10.8319732 10.9657079,10.884058 10.7296143,10.884058 L10.4776812,10.884058 L10.4776812,10.1682497 L10.7003969,10.1682497 C10.8001962,10.1682497 10.8926823,10.1416187 10.9778907,10.0883211 C11.0630814,10.0325975 11.1227291,9.95026087 11.1567982,9.84123969 L11.3649052,9.20901672 L10.006689,5.58639911 Z',
+                id: 'TypeAnyArr-shapeGroup',
+                fillOpacity: 0.88,
+                fill: '#000000',
+                mask: 'url(#TypeAnyArr-mask-2)',
+              }),
+            ),
+          ),
+        ),
+      ),
+    ),
+  );
+}
+export default TypeAnyArr;
diff --git a/src/FieldIcon/icons/TypeArray.d.ts b/src/FieldIcon/icons/TypeArray.d.ts
@@ -0,0 +1,4 @@
+import React from 'react';
+
+declare const res: React.FC<React.SVGProps<SVGSVGElement>>;
+export default res;
diff --git a/src/FieldIcon/icons/TypeArray.js b/src/FieldIcon/icons/TypeArray.js
@@ -0,0 +1,42 @@
+import * as React from 'react';
+function TypeArray(props) {
+  return /*#__PURE__*/ React.createElement(
+    'svg',
+    Object.assign(
+      {
+        width: '1em',
+        height: '1em',
+        viewBox: '0 0 1024 1024',
+        xmlns: 'http://www.w3.org/2000/svg',
+        xmlnsXlink: 'http://www.w3.org/1999/xlink',
+      },
+      props,
+      {
+        style: Object.assign(
+          {
+            verticalAlign: '-0.125em',
+          },
+          props.style,
+        ),
+        className: ['pro-editor-icon', props.className].filter(Boolean).join(' '),
+      },
+    ),
+    /*#__PURE__*/ React.createElement(
+      'g',
+      {
+        id: 'TypeArray-array',
+        stroke: 'none',
+        strokeWidth: 1,
+        fill: 'none',
+        fillRule: 'evenodd',
+      },
+      /*#__PURE__*/ React.createElement('path', {
+        d: 'M447.6,326 L389.4,326 L389.4,698 L447.6,698 L447.6,770 L309,770 L309,254 L447.6,254 L447.6,326 Z M576,326 L634.2,326 L634.2,698 L576,698 L576,770 L714.6,770 L714.6,254 L576,254 L576,326 Z',
+        id: 'TypeArray-\u5F62\u72B6',
+        fill: 'currentColor',
+        fillRule: 'nonzero',
+      }),
+    ),
+  );
+}
+export default TypeArray;
diff --git a/src/FieldIcon/icons/TypeBool.d.ts b/src/FieldIcon/icons/TypeBool.d.ts
@@ -0,0 +1,4 @@
+import React from 'react';
+
+declare const res: React.FC<React.SVGProps<SVGSVGElement>>;
+export default res;
diff --git a/src/FieldIcon/icons/TypeBool.js b/src/FieldIcon/icons/TypeBool.js
@@ -0,0 +1,49 @@
+import * as React from 'react';
+function TypeBool(props) {
+  return /*#__PURE__*/ React.createElement(
+    'svg',
+    Object.assign(
+      {
+        width: '1em',
+        height: '1em',
+        viewBox: '0 0 791 495',
+        xmlns: 'http://www.w3.org/2000/svg',
+        xmlnsXlink: 'http://www.w3.org/1999/xlink',
+      },
+      props,
+      {
+        style: Object.assign(
+          {
+            verticalAlign: '-0.125em',
+          },
+          props.style,
+        ),
+        className: ['pro-editor-icon', props.className].filter(Boolean).join(' '),
+      },
+    ),
+    /*#__PURE__*/ React.createElement(
+      'g',
+      {
+        id: 'TypeBool-\u9875\u9762-1',
+        stroke: 'none',
+        strokeWidth: 1,
+        fill: 'none',
+        fillRule: 'evenodd',
+      },
+      /*#__PURE__*/ React.createElement(
+        'g',
+        {
+          id: 'TypeBool-icon-bool1',
+          transform: 'translate(0.535000, 0.000000)',
+          fill: 'currentColor',
+          fillRule: 'nonzero',
+        },
+        /*#__PURE__*/ React.createElement('path', {
+          d: 'M5.68434189e-14,490.864 L5.68434189e-14,0 L70.32,0 L70.32,173.043 L71.7,173.043 C79.513,161.553 88.82,152.705 99.62,146.501 C110.421,140.296 122.716,137.194 136.504,137.194 C153.51,137.194 166.724,140.181 176.146,146.156 C185.568,152.131 193.266,159.714 199.241,168.906 C203.837,176.26 206.825,185.912 208.203,197.862 C209.583,209.812 210.272,228.426 210.272,253.705 L210.272,386.762 C210.272,406.066 209.352,421.462 207.514,432.952 C205.675,444.443 202.688,454.095 198.552,461.908 C186.602,483.97 166.149,495 137.194,495 C119.728,495 106.4,491.553 97.208,484.659 C88.015,477.765 79.053,469.262 70.32,459.15 L70.32,490.864 L5.68434189e-14,490.864 Z M139.951,248.879 C139.951,237.849 137.538,228.196 132.712,219.923 C127.886,211.65 118.809,207.513 105.481,207.513 C95.369,207.513 86.981,211.076 80.317,218.2 C73.652,225.324 70.32,234.401 70.32,245.432 L70.32,381.247 C70.32,394.116 73.538,404.572 79.972,412.615 C86.407,420.658 94.909,424.68 105.481,424.68 C117.431,424.68 126.163,420.313 131.678,411.58 C137.194,402.848 139.951,391.358 139.951,377.11 L139.951,248.879 Z M232.431,258.531 C232.431,244.283 233.351,231.184 235.189,219.234 C237.027,207.284 240.475,196.714 245.53,187.521 C253.803,172.354 265.638,160.174 281.035,150.981 C296.432,141.79 315.161,137.194 337.222,137.194 C359.284,137.194 378.012,141.79 393.41,150.982 C408.807,160.174 420.642,172.354 428.915,187.521 C433.97,196.713 437.417,207.284 439.255,219.234 C441.095,231.184 442.014,244.283 442.014,258.531 L442.014,373.663 C442.014,387.911 441.094,401.01 439.256,412.96 C437.417,424.91 433.97,435.48 428.915,444.673 C420.642,459.84 408.807,472.019 393.41,481.212 C378.013,490.404 359.284,495 337.222,495 C315.162,495 296.432,490.404 281.035,481.212 C265.638,472.019 253.803,459.84 245.53,444.672 C240.475,435.48 237.027,424.91 235.189,412.96 C233.351,401.01 232.431,387.91 232.431,373.663 L232.431,258.531 L232.431,258.531 Z M302.751,384.694 C302.751,398.022 305.854,408.019 312.059,414.684 C318.264,421.348 326.651,424.68 337.222,424.68 C347.794,424.68 356.182,421.348 362.386,414.683 C368.591,408.019 371.693,398.023 371.693,384.693 L371.693,247.5 C371.693,234.171 368.591,224.175 362.386,217.51 C356.181,210.846 347.794,207.514 337.222,207.514 C326.652,207.514 318.264,210.846 312.059,217.51 C305.854,224.175 302.752,234.171 302.752,247.5 L302.752,384.694 L302.751,384.694 Z M457.969,258.53 C457.969,244.282 458.889,231.183 460.727,219.233 C462.566,207.283 466.013,196.713 471.068,187.52 C479.341,172.353 491.176,160.173 506.573,150.98 C521.97,141.789 540.699,137.193 562.761,137.193 C584.822,137.193 603.551,141.789 618.948,150.981 C634.345,160.173 646.18,172.353 654.453,187.52 C659.509,196.712 662.956,207.283 664.794,219.233 C666.633,231.183 667.552,244.282 667.552,258.53 L667.552,373.662 C667.552,387.91 666.632,401.009 664.794,412.959 C662.956,424.909 659.509,435.479 654.453,444.672 C646.18,459.839 634.345,472.018 618.948,481.211 C603.55,490.404 584.821,495 562.76,495 C540.698,495 521.97,490.404 506.572,481.212 C491.175,472.019 479.34,459.84 471.067,444.672 C466.012,435.48 462.565,424.91 460.727,412.96 C458.887,401.01 457.969,387.91 457.969,373.663 L457.969,258.531 L457.969,258.53 Z M528.29,384.693 C528.29,398.021 531.392,408.018 537.597,414.683 C543.802,421.347 552.19,424.679 562.761,424.679 C573.331,424.679 581.72,421.347 587.924,414.682 C594.129,408.018 597.231,398.022 597.231,384.692 L597.231,247.5 C597.231,234.171 594.129,224.175 587.924,217.51 C581.72,210.846 573.332,207.514 562.761,207.514 C552.19,207.514 543.801,210.846 537.597,217.51 C531.392,224.175 528.29,234.171 528.29,247.5 L528.29,384.694 L528.29,384.693 Z M685.574,0 L755.894,0 L755.894,392.277 C755.894,405.606 758.307,414.683 763.134,419.509 C767.959,424.335 777.036,427.437 790.365,428.816 L790.365,495 C774.279,495 759.801,493.736 746.932,491.208 C734.062,488.68 723.032,483.74 713.84,476.386 C704.648,469.492 697.639,459.725 692.813,447.086 C687.987,434.446 685.574,417.786 685.574,397.103 L685.574,0 Z',
+          id: 'TypeBool-\u5F62\u72B6',
+        }),
+      ),
+    ),
+  );
+}
+export default TypeBool;
diff --git a/src/FieldIcon/icons/TypeBoolArr.d.ts b/src/FieldIcon/icons/TypeBoolArr.d.ts
@@ -0,0 +1,4 @@
+import React from 'react';
+
+declare const res: React.FC<React.SVGProps<SVGSVGElement>>;
+export default res;