diff --git a/docs/guide/intro.md b/docs/guide/intro.md index 1383df4e..19efa571 100644 --- 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 new file mode 100644 index 00000000..accbd9ad --- /dev/null +++ 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 ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +}; + +export default Demo; diff --git a/src/FieldIcon/icons/TypeAny.d.ts b/src/FieldIcon/icons/TypeAny.d.ts new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeAny.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeAny.js b/src/FieldIcon/icons/TypeAny.js new file mode 100644 index 00000000..c8d85095 --- /dev/null +++ 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 new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeAnyArr.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeAnyArr.js b/src/FieldIcon/icons/TypeAnyArr.js new file mode 100644 index 00000000..fe8e7522 --- /dev/null +++ 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 new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeArray.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeArray.js b/src/FieldIcon/icons/TypeArray.js new file mode 100644 index 00000000..400bcbaa --- /dev/null +++ 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 new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeBool.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeBool.js b/src/FieldIcon/icons/TypeBool.js new file mode 100644 index 00000000..04ef029c --- /dev/null +++ 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 new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeBoolArr.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeBoolArr.js b/src/FieldIcon/icons/TypeBoolArr.js new file mode 100644 index 00000000..83873e37 --- /dev/null +++ b/src/FieldIcon/icons/TypeBoolArr.js @@ -0,0 +1,49 @@ +import * as React from 'react'; +function TypeBoolArr(props) { + return /*#__PURE__*/ React.createElement( + 'svg', + Object.assign( + { + width: '1em', + height: '1em', + viewBox: '0 0 897 516', + 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: 'TypeBoolArr-\u9875\u9762-1', + stroke: 'none', + strokeWidth: 1, + fill: 'none', + fillRule: 'evenodd', + }, + /*#__PURE__*/ React.createElement( + 'g', + { + id: 'TypeBoolArr-icon-bool', + transform: 'translate(0.900000, 0.000000)', + fill: 'currentColor', + fillRule: 'nonzero', + }, + /*#__PURE__*/ React.createElement('path', { + d: 'M138.6,72 L80.4,72 L80.4,444 L138.6,444 L138.6,516 L0,516 L0,0 L138.6,0 L138.6,72 Z M757,72 L815.2,72 L815.2,444 L757,444 L757,516 L895.6,516 L895.6,0 L757,0 L757,72 Z M169,430.075 L169,83 L218.721,83 L218.721,205.354 L219.696,205.354 C225.221,197.229 231.802,190.974 239.439,186.586 C247.076,182.199 255.769,180.006 265.519,180.006 C277.542,180.006 286.885,182.118 293.547,186.343 C300.209,190.567 305.653,195.929 309.877,202.429 C313.127,207.629 315.24,214.453 316.214,222.903 C317.189,231.352 317.677,244.513 317.677,262.387 L317.677,356.468 C317.677,370.118 317.027,381.004 315.727,389.128 C314.427,397.253 312.315,404.077 309.39,409.602 C300.94,425.2 286.48,433 266.006,433 C253.656,433 244.232,430.563 237.733,425.688 C231.233,420.813 224.896,414.801 218.721,407.652 L218.721,430.075 L169,430.075 Z M267.955,258.975 C267.955,251.175 266.249,244.351 262.837,238.501 C259.425,232.651 253.007,229.727 243.582,229.727 C236.432,229.727 230.502,232.246 225.79,237.283 C221.078,242.32 218.721,248.738 218.721,256.538 L218.721,352.568 C218.721,361.668 220.996,369.061 225.546,374.748 C230.096,380.435 236.108,383.278 243.582,383.278 C252.032,383.278 258.206,380.191 262.106,374.017 C266.006,367.842 267.956,359.717 267.956,349.643 L267.956,258.975 L267.955,258.975 Z M333.345,265.799 C333.345,255.725 333.995,246.463 335.295,238.014 C336.595,229.564 339.032,222.09 342.607,215.591 C348.457,204.866 356.825,196.254 367.712,189.755 C378.598,183.255 391.842,180.005 407.44,180.005 C423.04,180.005 436.282,183.255 447.169,189.755 C458.055,196.255 466.423,204.866 472.273,215.591 C475.848,222.091 478.285,229.564 479.585,238.014 C480.885,246.464 481.535,255.725 481.535,265.799 L481.535,347.206 C481.535,357.28 480.885,366.542 479.585,374.992 C478.285,383.442 475.848,390.915 472.273,397.415 C466.423,408.139 458.055,416.751 447.169,423.251 C436.282,429.751 423.039,433 407.44,433 C391.841,433 378.598,429.75 367.712,423.25 C356.825,416.751 348.457,408.14 342.607,397.415 C339.032,390.915 336.595,383.441 335.295,374.992 C333.995,366.542 333.345,357.28 333.345,347.206 L333.345,265.8 L333.345,265.799 Z M383.067,355.006 C383.067,364.43 385.26,371.498 389.647,376.21 C394.035,380.922 399.966,383.279 407.44,383.279 C414.915,383.279 420.845,380.922 425.233,376.21 C429.62,371.498 431.813,364.43 431.813,355.006 L431.813,258 C431.813,248.576 429.62,241.507 425.233,236.795 C420.845,232.083 414.915,229.727 407.44,229.727 C399.966,229.727 394.035,232.083 389.648,236.795 C385.26,241.507 383.067,248.575 383.067,258 L383.067,355.006 L383.067,355.006 Z M492.816,265.799 C492.816,255.725 493.467,246.463 494.766,238.014 C496.066,229.564 498.503,222.09 502.078,215.591 C507.928,204.866 516.296,196.254 527.182,189.755 C538.069,183.255 551.312,180.005 566.911,180.005 C582.51,180.005 595.752,183.255 606.639,189.755 C617.526,196.255 625.894,204.866 631.744,215.591 C635.318,222.091 637.756,229.564 639.056,238.014 C640.356,246.464 641.006,255.725 641.006,265.799 L641.006,347.206 C641.006,357.28 640.356,366.542 639.056,374.992 C637.756,383.442 635.318,390.915 631.744,397.415 C625.894,408.139 617.526,416.751 606.639,423.251 C595.752,429.751 582.51,433 566.911,433 C551.311,433 538.069,429.75 527.182,423.25 C516.296,416.751 507.928,408.14 502.078,397.415 C498.503,390.915 496.066,383.441 494.766,374.992 C493.466,366.542 492.816,357.28 492.816,347.206 L492.816,265.8 L492.816,265.799 Z M542.537,355.006 C542.537,364.43 544.731,371.498 549.118,376.21 C553.506,380.922 559.436,383.279 566.911,383.279 C574.385,383.279 580.316,380.922 584.703,376.21 C589.091,371.498 591.284,364.43 591.284,355.006 L591.284,258 C591.284,248.576 589.091,241.507 584.704,236.795 C580.316,232.083 574.385,229.727 566.911,229.727 C559.436,229.727 553.506,232.083 549.118,236.795 C544.731,241.507 542.538,248.575 542.538,258 L542.538,355.006 L542.537,355.006 Z M653.75,83 L703.472,83 L703.472,360.368 C703.472,369.792 705.178,376.21 708.59,379.623 C712.002,383.035 718.42,385.228 727.845,386.203 L727.845,433 C716.471,433 706.235,432.106 697.135,430.319 C688.035,428.532 680.235,425.039 673.736,419.839 C667.236,414.964 662.281,408.059 658.869,399.121 C655.456,390.184 653.75,378.404 653.75,363.78 L653.75,83 Z', + id: 'TypeBoolArr-\u5F62\u72B6', + }), + ), + ), + ); +} +export default TypeBoolArr; diff --git a/src/FieldIcon/icons/TypeEnum.d.ts b/src/FieldIcon/icons/TypeEnum.d.ts new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeEnum.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeEnum.js b/src/FieldIcon/icons/TypeEnum.js new file mode 100644 index 00000000..998c50e2 --- /dev/null +++ b/src/FieldIcon/icons/TypeEnum.js @@ -0,0 +1,53 @@ +import * as React from 'react'; +function TypeEnum(props) { + return /*#__PURE__*/ React.createElement( + 'svg', + Object.assign( + { + width: '1em', + height: '1em', + viewBox: '0 0 897 516', + 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: 'TypeEnum-\u9875\u9762-1', + stroke: 'none', + strokeWidth: 1, + fill: 'none', + fillRule: 'evenodd', + }, + /*#__PURE__*/ React.createElement( + 'g', + { + id: 'TypeEnum-icon-enum', + transform: 'translate(0.828000, 0.000000)', + fill: 'currentColor', + fillRule: 'nonzero', + }, + /*#__PURE__*/ React.createElement('path', { + d: 'M138.6,72 L80.4,72 L80.4,444 L138.6,444 L138.6,516 L0,516 L0,0 L138.6,0 L138.6,72 Z M757,72 L815.2,72 L815.2,444 L757,444 L757,516 L895.6,516 L895.6,0 L757,0 L757,72 Z', + id: 'TypeEnum-\u5F62\u72B6', + }), + /*#__PURE__*/ React.createElement('path', { + d: 'M244.963,280.254 L156.613,280.254 L156.613,320.139 C156.613,329.387 158.581,336.516 162.517,341.526 C166.454,346.536 171.775,349.04 178.481,349.04 C186.937,349.04 192.551,345.765 195.321,339.214 C198.091,332.663 199.767,326.112 200.351,319.561 L244.963,319.561 C244.963,345.38 238.985,366.189 227.03,381.988 C221.199,390.081 214.2,396.439 206.036,401.064 C197.872,405.688 188.687,408 178.481,408 C164.485,408 152.603,404.146 142.835,396.44 C133.067,388.732 125.559,378.52 120.31,365.803 C117.103,358.096 114.916,349.233 113.75,339.213 C112.583,329.195 112,318.212 112,306.266 L112,209.734 C112,197.788 112.583,186.805 113.75,176.786 C114.916,166.766 117.103,157.904 120.31,150.196 C125.559,137.48 133.067,127.268 142.835,119.561 C152.603,111.854 164.485,108 178.481,108 C188.687,108 197.945,110.312 206.255,114.936 C214.565,119.561 221.636,125.919 227.468,134.012 C239.131,151.352 244.963,173.125 244.963,199.329 L244.963,280.254 L244.963,280.254 Z M156.613,234.012 L200.35,234.012 L200.35,200.486 C200.35,189.31 198.382,180.929 194.446,175.341 C190.509,169.753 185.188,166.96 178.481,166.96 C171.775,166.96 166.454,169.753 162.517,175.341 C158.581,180.929 156.613,189.311 156.613,200.486 L156.613,234.012 Z M259.021,404.532 L259.021,111.468 L303.634,111.468 L303.634,139.792 L304.509,139.792 C309.174,130.543 314.787,122.932 321.348,116.96 C327.908,110.986 336.292,108 346.498,108 C352.038,108 357.578,109.252 363.118,111.757 C368.658,114.262 373.614,118.405 377.988,124.185 C382.362,129.965 385.861,137.383 388.485,146.439 C391.11,155.495 392.422,166.574 392.422,179.676 L392.422,404.532 L347.809,404.532 L347.809,201.642 C347.809,190.852 345.914,182.374 342.123,176.208 C338.333,170.042 332.938,166.96 325.94,166.96 C317.484,166.96 311.653,170.428 308.445,177.364 C305.238,184.301 303.634,194.32 303.634,207.422 L303.634,404.532 L259.021,404.532 L259.021,404.532 Z M543.817,111.468 L543.817,404.532 L499.204,404.532 L499.204,376.208 L498.33,376.208 C493.664,385.457 488.051,393.068 481.49,399.04 C474.93,405.014 466.547,408 456.341,408 C450.801,408 445.261,406.748 439.721,404.243 C434.181,401.738 429.224,397.595 424.851,391.815 C420.476,386.035 416.977,378.617 414.353,369.561 C411.729,360.505 410.417,349.426 410.417,336.324 L410.417,111.468 L455.029,111.468 L455.029,314.358 C455.029,325.148 456.925,333.626 460.715,339.792 C464.505,345.958 469.9,349.04 476.898,349.04 C485.354,349.04 491.186,345.572 494.393,338.636 C497.601,331.699 499.204,321.68 499.204,308.578 L499.204,111.468 L543.817,111.468 Z M561.812,404.532 L561.812,111.468 L606.425,111.468 L606.425,139.792 L607.299,139.792 C611.965,130.543 617.578,122.932 624.139,116.96 C630.699,110.986 639.082,108 649.288,108 C658.91,108 666.928,111.083 673.343,117.249 C679.758,123.414 685.007,130.158 689.089,137.479 C694.629,129.387 700.752,122.451 707.459,116.671 C714.165,110.891 723.496,108 735.451,108 C740.991,108 746.677,109.252 752.509,111.757 C758.341,114.262 763.589,118.405 768.254,124.185 C772.92,129.965 776.71,137.383 779.626,146.439 C782.542,155.495 784,166.574 784,179.676 L784,404.532 L739.387,404.532 L739.387,201.642 C739.387,190.852 737.492,182.374 733.702,176.208 C729.911,170.042 724.517,166.96 717.519,166.96 C709.063,166.96 703.231,170.428 700.023,177.364 C696.816,184.301 695.213,194.32 695.213,207.422 L695.213,404.532 L650.6,404.532 L650.6,201.642 C650.6,190.852 648.704,182.374 644.914,176.208 C641.124,170.042 635.729,166.96 628.731,166.96 C620.275,166.96 614.443,170.428 611.236,177.364 C608.028,184.301 606.425,194.32 606.425,207.422 L606.425,404.532 L561.812,404.532 L561.812,404.532 Z', + id: 'TypeEnum-\u5F62\u72B6', + }), + ), + ), + ); +} +export default TypeEnum; diff --git a/src/FieldIcon/icons/TypeNum.d.ts b/src/FieldIcon/icons/TypeNum.d.ts new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeNum.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeNum.js b/src/FieldIcon/icons/TypeNum.js new file mode 100644 index 00000000..ca59b599 --- /dev/null +++ b/src/FieldIcon/icons/TypeNum.js @@ -0,0 +1,49 @@ +import * as React from 'react'; +function TypeNum(props) { + return /*#__PURE__*/ React.createElement( + 'svg', + Object.assign( + { + width: '1em', + height: '1em', + viewBox: '0 0 897 496', + 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: 'TypeNum-\u9875\u9762-1', + stroke: 'none', + strokeWidth: 1, + fill: 'none', + fillRule: 'evenodd', + }, + /*#__PURE__*/ React.createElement( + 'g', + { + id: 'TypeNum-icon-icon-test3', + transform: 'translate(0.500000, -0.000000)', + fill: 'currentColor', + fillRule: 'nonzero', + }, + /*#__PURE__*/ React.createElement('path', { + d: 'M99.31,99.994 L0,186.29 L0,90.406 L99.31,4.109 L188.345,4.109 L188.345,491.751 L99.309,491.751 L99.309,99.994 L99.31,99.994 Z M263.194,411.619 L445.374,199.989 C454.507,189.486 461.127,179.898 465.236,171.223 C469.346,162.547 471.4,152.503 471.4,141.087 C471.4,122.824 466.378,108.099 456.333,96.912 C446.288,85.725 431.677,80.132 412.5,80.132 C404.738,80.132 397.318,81.16 390.24,83.214 C383.164,85.269 376.771,88.694 371.064,93.488 C365.357,98.282 360.791,104.674 357.366,112.665 C353.942,120.655 352.229,130.585 352.229,142.457 L263.194,142.457 C263.194,120.084 267.074,100.108 274.837,82.529 C282.599,64.95 293.215,49.997 306.684,37.669 C320.154,25.341 335.906,15.981 353.942,9.589 C371.977,3.195 391.496,5.68434189e-14 412.5,5.68434189e-14 C433.96,5.68434189e-14 453.821,3.31 472.085,9.93 C490.349,16.552 505.987,25.912 519,38.011 C532.013,50.111 542.172,64.951 549.478,82.529 C556.783,100.109 560.436,119.856 560.436,141.772 C560.436,153.644 559.295,164.26 557.012,173.62 C554.748868,182.927687 551.295766,191.904944 546.738,200.33 C542.172,208.778 536.579,217.339 529.958,226.014 C523.338,234.689 515.918,243.821 507.7,253.41 L371.406,411.62 L560.436,411.62 L560.436,491.751 L263.194,491.751 L263.194,411.62 L263.194,411.619 Z M741.214,495.861 C721.124,495.861 701.834,493.121 683.341,487.642 C664.849,482.163 648.412,473.602 634.029,461.959 C619.647,450.316 608.118,435.476 599.442,417.441 C590.767,399.405 586.202,377.603 585.745,352.034 L674.78,352.034 C675.237,362.992 677.292,372.466 680.944,380.457 C684.597,388.447 689.391,395.067 695.327,400.319 C701.263,405.569 708.226,409.45 716.217,411.962 C724.207,414.473 732.539,415.729 741.215,415.729 C760.392,415.729 776.145,410.021 788.472,398.606 C800.8,387.191 806.964,370.298 806.964,347.924 C806.964,327.378 801.029,311.054 789.157,298.954 C777.286,286.855 760.392,280.805 738.475,280.805 L725.462,280.805 L725.462,203.413 L738.475,203.413 C760.392,203.413 776.145,197.591 785.733,185.948 C795.321,174.305 800.115,159.808 800.115,142.458 C800.115,121.91 794.18,106.386 782.308,95.885 C770.437,85.383 756.511,80.132 740.53,80.132 C723.636,80.132 709.596,85.269 698.41,95.542 C687.222,105.816 681.173,120.312 680.26,139.032 L591.224,139.032 C591.68,117.116 595.904,97.597 603.894,80.475 C611.884,63.352 622.614,48.741 636.084,36.642 C649.554,24.542 665.192,15.41 682.999,9.246 C700.806,3.082 719.983,0 740.529,0 C761.989,0 781.851,3.424 800.115,10.273 C818.379,17.123 834.131,26.711 847.373,39.039 C860.614,51.367 870.887,66.092 878.193,83.214 C885.498,100.337 889.151,119.171 889.151,139.718 C889.151,166.2 883.786,187.318 873.056,203.07 C862.326,218.823 848.971,231.036 832.99,239.712 C850.797,248.844 865.75,262.199 877.85,279.778 C889.95,297.357 896,320.985 896,350.664 C896,374.864 891.89,396.095 883.672,414.359 C875.453,432.623 864.267,447.804 850.112,459.904 C835.958,472.004 819.521,481.021 800.8,486.957 C782.08,492.893 762.218,495.861 741.215,495.861 L741.214,495.861 Z', + id: 'TypeNum-\u5F62\u72B6', + }), + ), + ), + ); +} +export default TypeNum; diff --git a/src/FieldIcon/icons/TypeNumArr.d.ts b/src/FieldIcon/icons/TypeNumArr.d.ts new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeNumArr.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeNumArr.js b/src/FieldIcon/icons/TypeNumArr.js new file mode 100644 index 00000000..2d344527 --- /dev/null +++ b/src/FieldIcon/icons/TypeNumArr.js @@ -0,0 +1,49 @@ +import * as React from 'react'; +function TypeNumArr(props) { + return /*#__PURE__*/ React.createElement( + 'svg', + Object.assign( + { + width: '1em', + height: '1em', + viewBox: '0 0 897 516', + 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: 'TypeNumArr-\u9875\u9762-1', + stroke: 'none', + strokeWidth: 1, + fill: 'none', + fillRule: 'evenodd', + }, + /*#__PURE__*/ React.createElement( + 'g', + { + id: 'TypeNumArr-icon-icon-test1', + transform: 'translate(0.500000, 0.000000)', + fill: 'currentColor', + fillRule: 'nonzero', + }, + /*#__PURE__*/ React.createElement('path', { + d: 'M138.6,72 L80.4,72 L80.4,444 L138.6,444 L138.6,516 L0,516 L0,0 L138.6,0 L138.6,72 Z M757,72 L815.2,72 L815.2,444 L757,444 L757,516 L895.6,516 L895.6,0 L757,0 L757,72 Z M223.088,162.53 L159,218.221 L159,156.343 L223.088,100.652 L280.547,100.652 L280.547,415.348 L223.088,415.348 L223.088,162.53 L223.088,162.53 Z M328.85,363.635 L446.42,227.061 C452.312,220.284 456.585,214.096 459.237,208.497 C461.889,202.899 463.215,196.417 463.215,189.05 C463.215,177.263 459.973,167.76 453.491,160.541 C447.008,153.322 437.579,149.713 425.204,149.713 C420.194,149.713 415.406,150.376 410.839,151.702 C406.272,153.028 402.147,155.238 398.463,158.332 C394.78,161.425 391.833,165.551 389.623,170.707 C387.413,175.864 386.309,182.273 386.309,189.934 L328.85,189.934 C328.85,175.495 331.355,162.604 336.364,151.26 C341.374,139.915 348.224,130.265 356.916,122.31 C365.609,114.354 375.774,108.313 387.414,104.188 C399.053,100.063 411.649,98 425.204,98 C439.053,98 451.87,100.136 463.657,104.409 C475.443,108.681 485.535,114.722 493.933,122.53 C502.331,130.339 508.887,139.915 513.601,151.26 C518.316,162.604 520.674,175.348 520.674,189.492 C520.674,197.152 519.937,204.004 518.463,210.044 C517.002664,216.050947 514.774313,221.84466 511.833,227.282 C508.887,232.733 505.277,238.258 501.005,243.856 C496.732,249.455 491.944,255.348 486.64,261.536 L398.684,363.636 L520.674,363.636 L520.674,415.348 L328.85,415.348 L328.85,363.635 Z M637.337,418 C624.372,418 611.923,416.232 599.989,412.696 C588.055,409.16 577.448,403.636 568.166,396.122 C558.884,388.608 551.444,379.032 545.846,367.392 C540.247,355.753 537.3,341.683 537.006,325.182 L594.464,325.182 C594.759,332.254 596.085,338.368 598.442,343.525 C600.8,348.681 603.893,352.954 607.724,356.343 C611.554,359.731 616.048,362.236 621.204,363.856 C626.361,365.477 631.739,366.287 637.337,366.287 C649.713,366.287 659.879,362.604 667.835,355.237 C675.79,347.871 679.768,336.969 679.768,322.53 C679.768,309.27 675.938,298.737 668.277,290.928 C660.615,283.12 649.713,279.215 635.569,279.215 L627.172,279.215 L627.172,229.271 L635.569,229.271 C649.713,229.271 659.879,225.514 666.067,218 C672.254,210.486 675.348,201.13 675.348,189.934 C675.348,176.674 671.518,166.656 663.857,159.878 C656.195,153.101 647.208,149.713 636.895,149.713 C625.993,149.713 616.932,153.028 609.713,159.657 C602.493,166.287 598.59,175.643 598,187.724 L540.542,187.724 C540.836,173.58 543.562,160.984 548.718,149.934 C553.875,138.884 560.799,129.454 569.492,121.646 C578.184,113.838 588.276,107.945 599.768,103.966 C611.26,99.99 623.636,98 636.895,98 C650.745,98 663.562,100.21 675.348,104.63 C687.135,109.05 697.3,115.238 705.846,123.193 C714.391,131.149 721.02,140.652 725.736,151.702 C730.45,162.752 732.806,174.906 732.806,188.166 C732.806,205.256 729.345,218.884 722.42,229.05 C715.496,239.216 706.877,247.098 696.564,252.696 C708.056,258.589 717.706,267.208 725.514,278.552 C733.323,289.897 737.227,305.145 737.227,324.298 C737.227,339.915 734.575,353.617 729.271,365.403 C723.967,377.19 716.748,386.987 707.614,394.796 C698.479,402.604 687.871,408.424 675.79,412.254 C663.71,416.084 650.892,418 637.337,418 L637.337,418 Z', + id: 'TypeNumArr-\u5F62\u72B6', + }), + ), + ), + ); +} +export default TypeNumArr; diff --git a/src/FieldIcon/icons/TypeObj.d.ts b/src/FieldIcon/icons/TypeObj.d.ts new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeObj.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeObj.js b/src/FieldIcon/icons/TypeObj.js new file mode 100644 index 00000000..fc133e92 --- /dev/null +++ b/src/FieldIcon/icons/TypeObj.js @@ -0,0 +1,49 @@ +import * as React from 'react'; +function TypeObj(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: 'TypeObj-type-obj', + stroke: 'none', + strokeWidth: 1, + fill: 'none', + fillRule: 'evenodd', + }, + /*#__PURE__*/ React.createElement( + 'g', + { + id: 'TypeObj-\u7F16\u7EC4', + transform: 'translate(271.000000, 254.000000)', + fill: 'currentColor', + fillRule: 'nonzero', + }, + /*#__PURE__*/ React.createElement('path', { + d: 'M305,444 L334.355,444 C340.495,444 345.387,441.8 349.032,437.4 C352.677,433 354.5,428 354.5,422.4 L354.5,318 C354.5,306.8 355.939,297.6 358.817,290.4 C361.695,283.2 365.244,277.4 369.465,273 C373.686,268.6 377.907,265.4 382.128,263.4 C386.348,261.4 391.145,259.6 396.518,258 C391.145,256.4 386.253,254.5 381.84,252.3 C377.427,250.1 373.302,247 369.465,243 C365.628,239 362.175,233.3 359.105,225.9 C356.035,218.5 354.5,209.2 354.5,198 L354.5,93.6 C354.5,88 352.677,83 349.032,78.6 C345.387,74.2 340.494,72 334.355,72 L305,72 L305,0 L351.622,0 C362.366,0 372.727,1.8 382.703,5.4 C392.68,9 401.506,14.8 409.18,22.8 C415.704,29.6 421.076,38.3 425.297,48.9 C429.517,59.5 431.627,72.2 431.627,87 L431.627,200.4 C431.627,206 433.451,211 437.096,215.4 C440.741,219.8 445.634,222 451.773,222 L481.128,222 L481.128,294 L451.773,294 C445.633,294 440.741,296.2 437.096,300.6 C433.451,305 431.628,310 431.628,315.6 L431.628,429 C431.628,443.8 429.518,456.5 425.297,467.1 C421.076,477.7 415.704,486.4 409.18,493.2 C401.506,501.2 392.68,507 382.703,510.6 C372.727,514.2 362.366,516 351.623,516 L305,516 L305,444 Z M176.128,444 L146.773,444 C140.633,444 135.741,441.8 132.096,437.4 C128.451,433 126.628,428 126.628,422.4 L126.628,318 C126.628,306.8 125.189,297.6 122.311,290.4 C119.433,283.2 115.884,277.4 111.663,273 C107.442,268.6 103.221,265.4 99,263.4 C94.779,261.4 89.983,259.6 84.61,258 C89.983,256.4 94.875,254.5 99.288,252.3 C103.701,250.1 107.826,247 111.663,243 C115.5,239 118.953,233.3 122.023,225.9 C125.093,218.5 126.628,209.2 126.628,198 L126.628,93.6 C126.628,88 128.451,83 132.096,78.6 C135.741,74.2 140.634,72 146.773,72 L176.128,72 L176.128,0 L129.506,0 C118.762,0 108.401,1.8 98.424,5.4 C88.448,9 79.622,14.8 71.948,22.8 C65.424,29.6 60.052,38.3 55.831,48.9 C51.611,59.5 49.5,72.2 49.5,87 L49.5,200.4 C49.5,206 47.677,211 44.032,215.4 C40.387,219.8 35.494,222 29.355,222 L0,222 L0,294 L29.355,294 C35.495,294 40.387,296.2 44.032,300.6 C47.677,305 49.5,310 49.5,315.6 L49.5,429 C49.5,443.8 51.61,456.5 55.831,467.1 C60.052,477.7 65.424,486.4 71.948,493.2 C79.622,501.2 88.448,507 98.424,510.6 C108.401,514.2 118.762,516 129.506,516 L176.128,516 L176.128,444 L176.128,444 Z', + id: 'TypeObj-\u5F62\u72B6', + }), + ), + ), + ); +} +export default TypeObj; diff --git a/src/FieldIcon/icons/TypeObjArr.d.ts b/src/FieldIcon/icons/TypeObjArr.d.ts new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeObjArr.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeObjArr.js b/src/FieldIcon/icons/TypeObjArr.js new file mode 100644 index 00000000..7a25ff38 --- /dev/null +++ b/src/FieldIcon/icons/TypeObjArr.js @@ -0,0 +1,49 @@ +import * as React from 'react'; +function TypeObjArr(props) { + return /*#__PURE__*/ React.createElement( + 'svg', + Object.assign( + { + width: '1em', + height: '1em', + viewBox: '0 0 656 381', + 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: 'TypeObjArr-\u9875\u9762-1', + stroke: 'none', + strokeWidth: 1, + fill: 'none', + fillRule: 'evenodd', + }, + /*#__PURE__*/ React.createElement( + 'g', + { + id: 'TypeObjArr-icon-icon-test4', + transform: 'translate(0.228000, 0.125000)', + fill: 'currentColor', + fillRule: 'nonzero', + }, + /*#__PURE__*/ React.createElement('path', { + d: 'M103.855,53.023 L60.245,53.023 L60.245,326.977 L103.855,326.977 L103.855,380 L0,380 L0,0 L103.855,0 L103.855,53.023 Z M551.145,53.023 L551.145,0 L655,0 L655,380 L551.145,380 L551.145,326.977 L594.755,326.977 L594.755,53.023 L551.145,53.023 Z M389,326.977 L410.991,326.977 C415.591,326.977 419.256,325.357 421.987,322.117 C424.717,318.876 426.083,315.194 426.083,311.07 L426.083,234.186 C426.083,225.938 427.161,219.163 429.317,213.86 C431.473,208.558 434.132,204.287 437.294,201.047 C440.456,197.807 443.618,195.45 446.78,193.977 C449.942,192.504 453.535,191.178 457.56,190 C453.535,188.822 449.87,187.422 446.565,185.802 C443.259,184.182 440.168,181.899 437.294,178.953 C434.419,176.008 431.833,171.81 429.533,166.36 C427.233,160.91 426.083,154.062 426.083,145.814 L426.083,68.93 C426.083,64.806 424.717,61.124 421.987,57.884 C419.256,54.644 415.59,53.024 410.991,53.024 L389,53.024 L389,0 L423.927,0 C431.976,0 439.737,1.326 447.211,3.977 C454.685,6.627 461.297,10.899 467.046,16.791 C471.934,21.798 475.958,28.205 479.12,36.011 C482.282,43.818 483.862,53.171 483.862,64.07 L483.862,147.581 C483.862,151.705 485.229,155.388 487.96,158.628 C490.69,161.868 494.356,163.488 498.955,163.488 L520.946,163.488 L520.946,216.512 L498.955,216.512 C494.355,216.512 490.69,218.132 487.96,221.372 C485.229,224.612 483.863,228.295 483.863,232.419 L483.863,315.93 C483.863,326.83 482.283,336.182 479.12,343.988 C475.958,351.795 471.934,358.202 467.046,363.209 C461.297,369.101 454.686,373.372 447.211,376.023 C439.738,378.674 431.976,380 423.928,380 L389,380 L389,326.977 Z M265.947,326.977 L265.947,380 L231.019,380 C222.97,380 215.209,378.674 207.734,376.023 C200.261,373.373 193.649,369.101 187.9,363.209 C183.012,358.202 178.988,351.795 175.826,343.989 C172.664,336.182 171.083,326.829 171.083,315.93 L171.083,232.42 C171.083,228.296 169.717,224.613 166.987,221.373 C164.256,218.133 160.591,216.513 155.991,216.513 L134,216.513 L134,163.489 L155.991,163.489 C160.591,163.489 164.256,161.869 166.987,158.629 C169.717,155.389 171.083,151.706 171.083,147.582 L171.083,64.07 C171.083,53.17 172.664,43.818 175.826,36.012 C178.988,28.205 183.012,21.798 187.9,16.791 C193.649,10.899 200.26,6.628 207.734,3.977 C215.208,1.326 222.97,0 231.02,0 L265.947,0 L265.947,53.023 L243.956,53.023 C239.356,53.023 235.691,54.643 232.961,57.883 C230.23,61.124 228.864,64.806 228.864,68.93 L228.864,145.814 C228.864,154.062 227.714,160.911 225.414,166.36 C223.114,171.81 220.528,176.008 217.654,178.953 C214.779,181.899 211.688,184.183 208.382,185.803 C205.076,187.423 201.412,188.822 197.386,190 C201.412,191.178 205.005,192.504 208.166,193.977 C211.329,195.45 214.491,197.807 217.653,201.047 C220.815,204.287 223.474,208.558 225.63,213.86 C227.786,219.163 228.864,225.938 228.864,234.186 L228.864,311.07 C228.864,315.194 230.23,318.876 232.961,322.116 C235.691,325.356 239.356,326.976 243.956,326.976 L265.947,326.976 L265.947,326.977 Z', + id: 'TypeObjArr-\u5F62\u72B6', + }), + ), + ), + ); +} +export default TypeObjArr; diff --git a/src/FieldIcon/icons/TypeSting.d.ts b/src/FieldIcon/icons/TypeSting.d.ts new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeSting.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeSting.js b/src/FieldIcon/icons/TypeSting.js new file mode 100644 index 00000000..dba60d1c --- /dev/null +++ b/src/FieldIcon/icons/TypeSting.js @@ -0,0 +1,49 @@ +import * as React from 'react'; +function TypeSting(props) { + return /*#__PURE__*/ React.createElement( + 'svg', + Object.assign( + { + width: '1em', + height: '1em', + viewBox: '0 0 897 496', + 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: 'TypeSting-\u9875\u9762-1', + stroke: 'none', + strokeWidth: 1, + fill: 'none', + fillRule: 'evenodd', + }, + /*#__PURE__*/ React.createElement( + 'g', + { + id: 'TypeSting-icon-Abc1', + transform: 'translate(0.228000, 0.000000)', + fill: 'currentColor', + fillRule: 'nonzero', + }, + /*#__PURE__*/ React.createElement('path', { + d: 'M376.221,490.077 L288.895,490.077 L263.773,403.35 L113.046,403.35 L87.326,490.077 L5.68434189e-14,490.077 L155.513,0 L220.708,0 L376.221,490.077 Z M136.958,323.418 L240.913,323.418 L189.233,145.208 L136.958,323.418 Z M457.57,163.4 C467.977,150.071 479.184,140.763 491.191,135.478 C503.199,130.192 517.408,127.548 533.818,127.548 C549.428,127.548 563.637,130.307 576.445,135.822 C589.253,141.338 600.26,149.382 609.465,159.953 C616.67,168.686 622.474,178.683 626.876,189.944 C631.279,201.206 634.581,213.271 636.783,226.141 C638.984,239.011 640.385,252.57 640.985,266.819 C641.585,281.067 641.885,295.775 641.885,310.944 C641.885,326.112 641.585,340.934 640.985,355.414 C640.385,369.892 638.984,383.566 636.783,396.436 C634.581,409.306 631.279,421.371 626.876,432.632 C622.474,443.893 616.67,453.89 609.466,462.623 C600.26,473.195 589.153,481.239 576.145,486.754 C563.136,492.27 548.828,495.028 533.218,495.028 C516.407,495.028 501.998,492.155 489.991,486.409 C477.983,480.664 466.376,470.897 455.169,457.108 L455.169,490.891 L379.52,490.891 L379.52,0 L457.57,0 L457.57,163.4 L457.57,163.4 Z M509.58,207.912 C498.045,207.912 488.797,210.556 481.836,215.845 C474.876,221.134 469.605,228.377 466.026,237.575 C462.446,246.773 460.059,257.695 458.866,270.342 C457.672,282.989 457.076,296.441 457.076,310.697 C457.076,325.414 457.672,339.096 458.866,351.743 C460.059,364.39 462.446,375.313 466.026,384.51 C469.605,393.708 474.876,400.951 481.836,406.24 C488.797,411.529 498.045,414.173 509.58,414.173 C521.513,414.173 530.96,411.529 537.92,406.24 C544.882,400.951 550.152,393.708 553.732,384.51 C557.312,375.312 559.698,364.39 560.892,351.743 C562.085,339.096 562.682,325.414 562.682,310.697 C562.682,296.441 562.085,282.989 560.892,270.342 C559.698,257.695 557.312,246.772 553.732,237.575 C550.152,228.377 544.882,221.134 537.921,215.845 C530.96,210.556 521.513,207.912 509.581,207.912 L509.58,207.912 Z M792.985,127.057 C814.547,127.057 833.612,130.969 850.182,138.793 C866.752,146.618 882.025,158.814 896,175.383 L842.696,236.137 C834.71,226.011 827.024,218.762 819.637,214.39 C812.251,210.017 803.367,207.831 792.985,207.831 C783.403,207.831 775.018,209.787 767.831,213.699 C760.644,217.611 754.255,223.479 748.665,231.304 C742.675,240.049 738.284,250.634 735.489,263.061 C732.694,275.488 731.296,291.367 731.296,310.697 C731.296,330.027 732.694,346.021 735.489,358.678 C738.284,371.335 742.676,382.036 748.665,390.781 C754.255,398.605 760.644,404.473 767.831,408.385 C775.018,412.298 783.403,414.254 792.985,414.254 C803.367,414.254 812.251,411.952 819.637,407.35 C827.024,402.747 834.71,395.613 842.696,385.948 L896,446.011 C882.025,462.58 866.753,474.891 850.182,482.946 C833.612,491 814.547,495.028 792.985,495.028 C777.413,495.028 761.342,492.266 744.772,486.743 C728.202,481.22 713.129,471.44 699.553,457.403 C685.978,443.364 674.898,424.494 666.313,400.791 C657.729,377.088 653.436,347.057 653.436,310.697 C653.436,274.337 657.729,244.307 666.313,220.603 C674.898,196.9 685.978,178.145 699.553,164.337 C713.129,150.53 728.202,140.865 744.773,135.342 C761.343,129.819 777.413,127.057 792.985,127.057 L792.985,127.057 Z', + id: 'TypeSting-\u5F62\u72B6', + }), + ), + ), + ); +} +export default TypeSting; diff --git a/src/FieldIcon/icons/TypeStingArr.d.ts b/src/FieldIcon/icons/TypeStingArr.d.ts new file mode 100644 index 00000000..a693093d --- /dev/null +++ b/src/FieldIcon/icons/TypeStingArr.d.ts @@ -0,0 +1,4 @@ +import React from 'react'; + +declare const res: React.FC>; +export default res; diff --git a/src/FieldIcon/icons/TypeStingArr.js b/src/FieldIcon/icons/TypeStingArr.js new file mode 100644 index 00000000..d9d07d3c --- /dev/null +++ b/src/FieldIcon/icons/TypeStingArr.js @@ -0,0 +1,49 @@ +import * as React from 'react'; +function TypeStingArr(props) { + return /*#__PURE__*/ React.createElement( + 'svg', + Object.assign( + { + width: '1em', + height: '1em', + viewBox: '0 0 896 516', + 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: 'TypeStingArr-\u9875\u9762-1', + stroke: 'none', + strokeWidth: 1, + fill: 'none', + fillRule: 'evenodd', + }, + /*#__PURE__*/ React.createElement( + 'g', + { + id: 'TypeStingArr-icon-Abc2', + transform: 'translate(0.228000, 0.000000)', + fill: 'currentColor', + fillRule: 'nonzero', + }, + /*#__PURE__*/ React.createElement('path', { + d: 'M401.2,414.8 L344.75,414.8 L328.51,358.737 L231.076,358.737 L214.45,414.8 L158,414.8 L258.528,98 L300.672,98 L401.2,414.8 Z M246.533,307.067 L313.733,307.067 L280.325,191.867 L246.533,307.067 Z M453.786,203.627 C460.514,195.01 467.758,188.994 475.52,185.577 C483.282,182.16 492.467,180.451 503.075,180.451 C513.165,180.451 522.351,182.234 530.63,185.799 C538.91,189.365 546.025,194.564 551.976,201.399 C556.633,207.044 560.385,213.506 563.231,220.786 C566.077,228.065 568.211,235.864 569.634,244.184 C571.058,252.504 571.964,261.268 572.351,270.479 C572.739,279.689 572.933,289.198 572.933,299.003 C572.933,308.808 572.739,318.39 572.351,327.749 C571.963,337.109 571.058,345.948 569.634,354.267 C568.211,362.587 566.077,370.387 563.231,377.666 C560.385,384.946 556.633,391.408 551.976,397.053 C546.025,403.887 538.846,409.086 530.436,412.652 C522.027,416.217 512.778,418 502.687,418 C491.82,418 482.506,416.143 474.744,412.429 C466.982,408.715 459.479,402.401 452.234,393.487 L452.234,415.326 L403.334,415.326 L403.334,98 L453.786,98 L453.786,203.627 Z M487.407,232.4 C479.95,232.4 473.972,234.11 469.473,237.528 C464.973,240.947 461.566,245.629 459.252,251.575 C456.938,257.521 455.395,264.581 454.624,272.757 C453.852,280.932 453.467,289.627 453.467,298.844 C453.467,308.357 453.852,317.201 454.624,325.377 C455.395,333.552 456.938,340.613 459.252,346.558 C461.566,352.504 464.973,357.186 469.472,360.605 C473.972,364.024 479.95,365.733 487.407,365.733 C495.121,365.733 501.227,364.023 505.727,360.605 C510.227,357.186 513.634,352.505 515.948,346.558 C518.262,340.613 519.805,333.552 520.576,325.377 C521.348,317.201 521.733,308.357 521.733,298.844 C521.733,289.628 521.348,280.932 520.576,272.757 C519.805,264.581 518.262,257.521 515.948,251.575 C513.634,245.629 510.227,240.947 505.728,237.528 C501.228,234.109 495.121,232.4 487.408,232.4 L487.407,232.4 Z M670.608,180.133 C684.546,180.133 696.871,182.663 707.582,187.72 C718.294,192.778 728.166,200.662 737.2,211.373 L702.743,250.645 C697.581,244.1 692.612,239.415 687.837,236.588 C683.062,233.761 677.319,232.348 670.608,232.348 C664.414,232.348 658.994,233.612 654.348,236.141 C649.702,238.671 645.572,242.464 641.958,247.521 C638.087,253.174 635.248,260.017 633.441,268.051 C631.634,276.083 630.731,286.348 630.731,298.844 C630.731,311.339 631.634,321.678 633.441,329.86 C635.248,338.042 638.087,344.959 641.959,350.612 C645.572,355.67 649.702,359.463 654.348,361.992 C658.994,364.521 664.414,365.785 670.608,365.785 C677.319,365.785 683.062,364.298 687.837,361.323 C692.612,358.347 697.581,353.736 702.743,347.488 L737.2,386.314 C728.166,397.024 718.294,404.984 707.582,410.19 C696.871,415.397 684.546,418 670.608,418 C660.542,418 650.153,416.215 639.442,412.645 C628.73,409.075 618.987,402.752 610.212,393.678 C601.436,384.603 594.273,372.405 588.724,357.083 C583.174,341.761 580.4,322.348 580.4,298.843 C580.4,275.339 583.175,255.926 588.724,240.604 C594.274,225.282 601.436,213.158 610.211,204.232 C618.987,195.307 628.731,189.059 639.442,185.489 C650.153,181.919 660.542,180.133 670.608,180.133 L670.608,180.133 Z M138.6,72 L80.4,72 L80.4,444 L138.6,444 L138.6,516 L0,516 L0,0 L138.6,0 L138.6,72 Z M757,72 L815.2,72 L815.2,444 L757,444 L757,516 L895.6,516 L895.6,0 L757,0 L757,72 Z', + id: 'TypeStingArr-\u5F62\u72B6', + }), + ), + ), + ); +} +export default TypeStingArr; diff --git a/src/FieldIcon/icons/index.ts b/src/FieldIcon/icons/index.ts new file mode 100644 index 00000000..7b11f728 --- /dev/null +++ b/src/FieldIcon/icons/index.ts @@ -0,0 +1,12 @@ +export { default as TypeAny } from './TypeAny.js'; +export { default as TypeAnyArr } from './TypeAnyArr.js'; +export { default as TypeArray } from './TypeArray.js'; +export { default as TypeBool } from './TypeBool.js'; +export { default as TypeBoolArr } from './TypeBoolArr.js'; +export { default as TypeEnum } from './TypeEnum.js'; +export { default as TypeNum } from './TypeNum.js'; +export { default as TypeNumArr } from './TypeNumArr.js'; +export { default as TypeObj } from './TypeObj.js'; +export { default as TypeObjArr } from './TypeObjArr.js'; +export { default as TypeSting } from './TypeSting.js'; +export { default as TypeStingArr } from './TypeStingArr.js'; diff --git a/src/FieldIcon/index.md b/src/FieldIcon/index.md new file mode 100644 index 00000000..14200a3b --- /dev/null +++ b/src/FieldIcon/index.md @@ -0,0 +1,50 @@ +--- +title: FieldIcon 字段图标 +group: 基础组件 +--- + +# FieldIcon 字段图标 + +为不同的字段类型配置字段图标。 + +## 何时使用 + +字段选择的图标获取。 + +## 代码演示 + +### 字段图标列表 + + + +## API + +| 参数 | 说明 | 类型 | 默认值 | +| :--- | :------- | :--------------- | :----- | +| type | 字段类型 | 参考字段类型枚举 | - | + +### APIFieldType 字段类型枚举 + +`@alipay/studio-oneapi-sdk` 中导出了 API 字段类型的枚举，你可以这样使用： + +```tsx | pure +import { APIFieldType } from '@alipay/studio-oneapi-sdk'; + +; +``` + +| 类型 | 字段说明 | +| :------------- | :----------- | +| `integer` | 整数 | +| `number` | 数字 | +| `bool` | 布尔值 | +| `string` | 字符串 | +| `integerArray` | 整数数组 | +| `numberArray` | 数字数组 | +| `stringArray` | 字符串数组 | +| `boolArray` | 布尔值数组 | +| `any` | 任意类型 | +| `anyArray` | 任意类型数组 | +| `object` | 对象 | +| `objectArray` | 对象数组 | +| `array` | 数组 | diff --git a/src/FieldIcon/index.tsx b/src/FieldIcon/index.tsx new file mode 100644 index 00000000..9481cbe7 --- /dev/null +++ b/src/FieldIcon/index.tsx @@ -0,0 +1,106 @@ +import Icon from '@ant-design/icons'; +import { APIFieldType, getPrefixCls, themeToken } from '@ant-design/pro-editor'; +import classNames from 'classnames'; +import type { CSSProperties } from 'react'; +import React from 'react'; +import { + TypeAny, + TypeAnyArr, + TypeArray, + TypeBool, + TypeBoolArr, + TypeNum, + TypeNumArr, + TypeObj, + TypeObjArr, + TypeSting, + TypeStingArr, +} from './icons'; + +import { useStyle } from './style'; + +interface FieldIconProps { + /** + * @description 自定义前缀 + * @ignore + */ + prefixCls?: string; + /** + * 类名 + */ + className?: string; + /** + * 样式 + */ + style?: React.CSSProperties; + /** + * API 字段类型 + */ + type?: APIFieldType | string; +} + +const FieldIcon: React.FC = (props) => { + const { type, prefixCls: customizePrefixCls, className, style: customStyle } = props; + + const prefixCls = getPrefixCls('field-icon', customizePrefixCls); + + const { styles } = useStyle(prefixCls); + + const style: CSSProperties = {}; + let IconComponent = TypeAny; + switch (type) { + case APIFieldType.bool: + IconComponent = TypeBool; + style.color = themeToken.colorTypeBoolean; + break; + case APIFieldType.number: + case APIFieldType.integer: + IconComponent = TypeNum; + style.color = themeToken.colorTypeNumber; + break; + case APIFieldType.string: + IconComponent = TypeSting; + style.color = themeToken.colorTypeString; + break; + case APIFieldType.boolArray: + IconComponent = TypeBoolArr; + style.color = themeToken.colorTypeBoolArray; + break; + case APIFieldType.integerArray: + case APIFieldType.numberArray: + IconComponent = TypeNumArr; + style.color = themeToken.colorTypeNumberArray; + break; + case APIFieldType.stringArray: + IconComponent = TypeStingArr; + style.color = themeToken.colorTypeStringArray; + break; + case APIFieldType.array: + IconComponent = TypeArray; + break; + case APIFieldType.object: + IconComponent = TypeObj; + break; + case APIFieldType.objectArray: + IconComponent = TypeObjArr; + break; + case APIFieldType.any: + IconComponent = TypeAny; + break; + case APIFieldType.anyArray: + IconComponent = TypeAnyArr; + break; + default: + break; + } + + return ( + + ); +}; + +export default FieldIcon; diff --git a/src/FieldIcon/style.ts b/src/FieldIcon/style.ts new file mode 100644 index 00000000..17b84bba --- /dev/null +++ b/src/FieldIcon/style.ts @@ -0,0 +1,12 @@ +import { createStyles } from '../theme'; + +export const useStyle = createStyles(({ css, cx, token }, prefixCls: string) => { + return { + icon: cx( + `${prefixCls}`, + css({ + fontSize: token.fontSizeLG, + }), + ), + }; +}); diff --git a/src/FieldSelect/demos/basic.tsx b/src/FieldSelect/demos/basic.tsx new file mode 100644 index 00000000..18620378 --- /dev/null +++ b/src/FieldSelect/demos/basic.tsx @@ -0,0 +1,49 @@ +import type { FieldSelectOptionType } from '@ant-design/pro-editor'; +import { APIFieldType, FieldSelect } from '@ant-design/pro-editor'; + +const Demo = () => { + const options: FieldSelectOptionType[] = [ + { + label: 'orderId', + value: 'orderId', + type: APIFieldType.integer, + }, + { + label: 'orderNumber', + value: 'orderNumber', + type: APIFieldType.string, + }, + { + label: 'orderMoney', + value: 'orderMoney', + type: APIFieldType.integer, + }, + { + label: 'productName', + value: 'productName', + type: APIFieldType.string, + }, + { + label: 'productComment', + value: 'productComment', + type: APIFieldType.string, + }, + { + label: 'orderStatus', + value: 'orderStatus', + type: APIFieldType.string, + }, + ]; + + return ( + <> + console.log(values)} + options={options} + defaultValue={'orderId'} + /> + + ); +}; + +export default Demo; diff --git a/src/FieldSelect/index.md b/src/FieldSelect/index.md new file mode 100644 index 00000000..6e76ed17 --- /dev/null +++ b/src/FieldSelect/index.md @@ -0,0 +1,35 @@ +--- +title: FieldSelect 字段选择器 +group: 基础组件 +--- + +# FieldSelect 字段选择器 + +## 何时使用 + +扩展普通选择器，当要选择的是字段时，加上字段类型。 + +## 代码演示 + +### 普通使用 + + + +## API + +> 其他属性参考 antd `Select` 组件。 + +| 参数 | 说明 | 类型 | 默认值 | +| :------- | :----- | :-------------------------- | :----- | +| options | 选项值 | 参考`FieldSelectOptionType` | - | +| onChange | 回调 | (value: string) => void | - | +| value | 值 | string | - | + +### FieldSelectOptionType 选项类型 + +| 参数 | 说明 | 类型 | 默认值 | +| :---------- | :------- | :---------------- | :----- | +| type | 字段类型 | 参考字段类型枚举 | - | +| label | 字段名 | `React.ReactNode` | - | +| description | 字段描述 | `React.ReactNode` | - | +| value | 字段标识 | string | - | diff --git a/src/FieldSelect/index.tsx b/src/FieldSelect/index.tsx new file mode 100644 index 00000000..0d9d47f8 --- /dev/null +++ b/src/FieldSelect/index.tsx @@ -0,0 +1,154 @@ +/** + * OneAPI 接口地址: https://oneapi.alipay.com/app/oneapitwa/tag/doc/master + */ +import { + APIFieldType, + ActionIcon, + FieldTitle, + Input, + Select, + getPrefixCls, +} from '@ant-design/pro-editor'; +import type { DefaultOptionType, SelectProps } from 'antd/es/select'; +import classNames from 'classnames'; +import { useState } from 'react'; +import useMergedState from 'use-merge-value'; + +import { PlusOutlined } from '@ant-design/icons'; + +import { useStyle } from './style'; + +export interface FieldSelectOptionType extends DefaultOptionType { + /** + * API 字段类型 + */ + type?: APIFieldType | string; + /** + * 字段描述 + */ + description?: React.ReactNode; +} + +export interface FieldSelectProps extends SelectProps { + /** + * @description 自定义前缀 + * @ignore + */ + prefixCls?: string; + /** + * 配置项 + */ + options?: FieldSelectOptionType[]; + /** + * 类名 + */ + className?: string; + /** + * 样式 + */ + style?: React.CSSProperties; + /** + * 变更后的回调 + */ + onChange?: (string) => void; + /** + * 初始值 + */ + value?: string; + /** + * 是否显示自定义字段 + * @default true + */ + showCustomField?: boolean; +} + +const FieldSelect: React.FC = (props) => { + const { + style, + className, + value: propsValue, + prefixCls: customizePrefixCls, + options, + onChange, + showCustomField = true, + ...restProps + } = props; + + const [name, setName] = useState(''); + const [controlValue, setControlValue] = useMergedState(undefined, { + value: propsValue, + onChange, + }); + const [open, setOpen] = useState(false); + + const prefixCls = getPrefixCls('field-select', customizePrefixCls); + + const { styles } = useStyle(prefixCls); + + const onNameChange = (value) => { + setName(value); + }; + + const onSelectChange = (selectedValue: string) => { + setControlValue(selectedValue); + }; + + const addItem = (e: any) => { + e.preventDefault(); + if (name) { + setControlValue(name); + setName(''); + setOpen(false); + } + }; + + return ( + { + e.stopPropagation(); + addItem(e); + }} + /> + } + onClick={addItem} + /> + + )} + + )} + {...restProps} + /> + ); +}; + +export default FieldSelect; diff --git a/src/FieldSelect/style.ts b/src/FieldSelect/style.ts new file mode 100644 index 00000000..e4e6427f --- /dev/null +++ b/src/FieldSelect/style.ts @@ -0,0 +1,34 @@ +import { createStyles } from '../theme'; + +export const useStyle = createStyles(({ token, css, cx }, prefixCls: string) => { + return { + select: cx( + `${prefixCls}`, + css({ + width: '100%', + }), + ), + extra: cx( + `${prefixCls}-extra`, + css({ + display: 'flex', + alignItems: 'center', + padding: `${token.paddingXXS}px ${token.paddingXS}px`, + }), + ), + + extraInput: cx( + `${prefixCls}-extra-input`, + css({ + marginRight: token.marginXXS, + }), + ), + + extraAction: cx( + `${prefixCls}-extra-action`, + css({ + flexShrink: 0, + }), + ), + }; +}); diff --git a/src/FieldTitle/demos/basic.tsx b/src/FieldTitle/demos/basic.tsx new file mode 100644 index 00000000..0e6eb0e5 --- /dev/null +++ b/src/FieldTitle/demos/basic.tsx @@ -0,0 +1,53 @@ +import { ProCard } from '@ant-design/pro-components'; +import { APIFieldType, FieldTitle } from '@ant-design/pro-editor'; + +const Demo = () => { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +}; + +export default Demo; diff --git a/src/FieldTitle/demos/description.tsx b/src/FieldTitle/demos/description.tsx new file mode 100644 index 00000000..aa42387b --- /dev/null +++ b/src/FieldTitle/demos/description.tsx @@ -0,0 +1,26 @@ +import { ProCard } from '@ant-design/pro-components'; +import { APIFieldType, FieldTitle } from '@ant-design/pro-editor'; + +const Demo = () => { + return ( + + + + + + + + + + + + ); +}; + +export default Demo; diff --git a/src/FieldTitle/index.md b/src/FieldTitle/index.md new file mode 100644 index 00000000..aab13d38 --- /dev/null +++ b/src/FieldTitle/index.md @@ -0,0 +1,31 @@ +--- +title: FieldTitle 字段标题 +group: 基础组件 +--- + +# FieldTitle 字段标题 + +## 何时使用 + +为不同的字段类型配置字段图标以及字段标题。 + +## 代码演示 + +### 字段标题列表 + + + +### 配置展示 + + + +## API + +| 参数 | 说明 | 类型 | 默认值 | +| :------------ | :----------------------------- | :-------------------------------- | :----- | +| type | 字段类型 | 参考 `FieldIcon` 字段类型类型枚举 | - | +| isParentArray | 父级是否是数组 | boolean | - | +| title | 字段标题 | `React.ReactNode` | - | +| description | 标题右侧描述 | `React.ReactNode` | - | +| extra | 额外内容 | `React.ReactNode` | - | +| checkable | 是否可选，可选会添加 `padding` | `boolean` | true | diff --git a/src/FieldTitle/index.tsx b/src/FieldTitle/index.tsx new file mode 100644 index 00000000..402bcaa6 --- /dev/null +++ b/src/FieldTitle/index.tsx @@ -0,0 +1,81 @@ +import { APIFieldType, FieldIcon, getPrefixCls } from '@ant-design/pro-editor'; +import classNames from 'classnames'; + +import { useStyle } from './style'; + +export interface FieldTitleProps { + /** + * @description 自定义前缀 + * @ignore + */ + prefixCls?: string; + /** + * 类名 + */ + className?: string; + /** + * 样式 + */ + style?: React.CSSProperties; + /** + * 字段类型 + */ + type?: APIFieldType | string; + /** + * 父级是否是数组 + */ + isParentArray?: boolean; + /** + * 字段标题 + */ + title: React.ReactNode; + /** + * 标题右侧描述 + */ + description?: React.ReactNode; + /** + * 额外内容 + */ + extra?: React.ReactNode; + /** + * 是否可选 + */ + checkable?: boolean; +} + +const FieldTitle: React.FC = (props) => { + const { + style, + className, + prefixCls: customizePrefixCls, + type, + isParentArray, + title, + description = null, + extra = null, + checkable = true, + } = props; + + const prefixCls = getPrefixCls('field-title', customizePrefixCls); + const { styles } = useStyle({ prefixCls, checkable }); + + let finalType = type; + if (finalType === 'boolean') { + finalType = 'bool'; + } + if (isParentArray) { + finalType += 'Array'; + } + return ( +
+
+ {finalType ? : null} + {title ? {title} : null} + {description ? {description} : null} +
+ {extra ?
{extra}
: null} +
+ ); +}; + +export default FieldTitle; diff --git a/src/FieldTitle/style.ts b/src/FieldTitle/style.ts new file mode 100644 index 00000000..f3d5d005 --- /dev/null +++ b/src/FieldTitle/style.ts @@ -0,0 +1,32 @@ +import { createStyles } from '../theme'; + +export const useStyle = createStyles(({ token, css, cx }, { prefixCls, checkable }) => { + return { + content: cx( + `${prefixCls}-content`, + css({ + display: 'flex', + alignItems: 'center', + fontSize: token.fontSize, + }), + ), + title: cx( + `${prefixCls}-title`, + css({ + marginLeft: token.marginXXS, + }), + ), + description: cx( + `${prefixCls}-description`, + css({ + marginLeft: token.marginXXS, + }), + ), + extra: cx( + `${prefixCls}-extra`, + css({ + paddingLeft: checkable ? token.paddingLG : undefined, + }), + ), + }; +}); diff --git a/src/Highlight/demos/config.js b/src/Highlight/demos/config.js index 188ee02f..093a9cfd 100644 --- a/src/Highlight/demos/config.js +++ b/src/Highlight/demos/config.js @@ -28,7 +28,7 @@ const configs = [ { language: 'jsx', text: 'Jsx', - code: 'import React from \'react\';\nimport { Button, Tag, Space } from \'antd\';\nimport { ProList } from \'@alipay/tech-ui\';\n\nconst dataSource = [\n {\n name: \'语雀的天空\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'Ant Design\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'蚂蚁金服体验科技\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'TechUI\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n];\n\nexport default () => (\n {\n return [\n ,\n ];\n }}\n onRow={(record) => {\n return {\n onMouseEnter: () => {\n console.log(record);\n },\n onClick: () => {\n console.log(record);\n },\n };\n }}\n rowKey="name"\n headerTitle="基础列表"\n tooltip="基础列表的配置"\n dataSource={dataSource}\n showActions="hover"\n showExtra="hover"\n metas={{\n title: {\n dataIndex: \'name\',\n },\n avatar: {\n dataIndex: \'image\',\n },\n description: {\n dataIndex: \'desc\',\n },\n subTitle: {\n render: () => {\n return (\n \n Ant Design\n TechUI\n \n );\n },\n },\n actions: {\n render: (text, row) => [\n \n 链路\n ,\n \n 报警\n ,\n \n 查看\n ,\n ],\n },\n }}\n />\n);', + code: 'import React from \'react\';\nimport { Button, Tag, Space } from \'antd\';\nimport { ProList } from \'@alipay/tech-ui\';\n\nconst dataSource = [\n {\n name: \'语雀的天空\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'Ant Design\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'蚂蚁金服体验科技\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'ProEditor\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n];\n\nexport default () => (\n {\n return [\n ,\n ];\n }}\n onRow={(record) => {\n return {\n onMouseEnter: () => {\n console.log(record);\n },\n onClick: () => {\n console.log(record);\n },\n };\n }}\n rowKey="name"\n headerTitle="基础列表"\n tooltip="基础列表的配置"\n dataSource={dataSource}\n showActions="hover"\n showExtra="hover"\n metas={{\n title: {\n dataIndex: \'name\',\n },\n avatar: {\n dataIndex: \'image\',\n },\n description: {\n dataIndex: \'desc\',\n },\n subTitle: {\n render: () => {\n return (\n \n Ant Design\n ProEditor\n \n );\n },\n },\n actions: {\n render: (text, row) => [\n \n 链路\n ,\n \n 报警\n ,\n \n 查看\n ,\n ],\n },\n }}\n />\n);', }, { language: 'markdown', @@ -48,7 +48,7 @@ const configs = [ { language: 'tsx', text: 'Tsx', - code: 'import React from \'react\';\nimport { Button, Tag, Space } from \'antd\';\nimport { ProList } from \'@alipay/tech-ui\';\n\nconst dataSource = [\n {\n name: \'语雀的天空\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'Ant Design\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'蚂蚁金服体验科技\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'TechUI\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n];\n\nexport default () => (\n \n toolBarRender={() => {\n return [\n ,\n ];\n }}\n onRow={(record: any) => {\n return {\n onMouseEnter: () => {\n console.log(record);\n },\n onClick: () => {\n console.log(record);\n },\n };\n }}\n rowKey="name"\n headerTitle="基础列表"\n tooltip="基础列表的配置"\n dataSource={dataSource}\n showActions="hover"\n showExtra="hover"\n metas={{\n title: {\n dataIndex: \'name\',\n },\n avatar: {\n dataIndex: \'image\',\n },\n description: {\n dataIndex: \'desc\',\n },\n subTitle: {\n render: () => {\n return (\n \n Ant Design\n TechUI\n \n );\n },\n },\n actions: {\n render: (text, row) => [\n \n 链路\n ,\n \n 报警\n ,\n \n 查看\n ,\n ],\n },\n }}\n />\n);', + code: 'import React from \'react\';\nimport { Button, Tag, Space } from \'antd\';\nimport { ProList } from \'@alipay/tech-ui\';\n\nconst dataSource = [\n {\n name: \'语雀的天空\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'Ant Design\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'蚂蚁金服体验科技\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n {\n name: \'ProEditor\',\n image:\n \'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg\',\n desc: \'我是一条测试的描述\',\n },\n];\n\nexport default () => (\n \n toolBarRender={() => {\n return [\n ,\n ];\n }}\n onRow={(record: any) => {\n return {\n onMouseEnter: () => {\n console.log(record);\n },\n onClick: () => {\n console.log(record);\n },\n };\n }}\n rowKey="name"\n headerTitle="基础列表"\n tooltip="基础列表的配置"\n dataSource={dataSource}\n showActions="hover"\n showExtra="hover"\n metas={{\n title: {\n dataIndex: \'name\',\n },\n avatar: {\n dataIndex: \'image\',\n },\n description: {\n dataIndex: \'desc\',\n },\n subTitle: {\n render: () => {\n return (\n \n Ant Design\n ProEditor\n \n );\n },\n },\n actions: {\n render: (text, row) => [\n \n 链路\n ,\n \n 报警\n ,\n \n 查看\n ,\n ],\n },\n }}\n />\n);', }, { language: 'typescript', diff --git a/src/IconPicker/components/IconList/IconThumbnail.tsx b/src/IconPicker/components/IconList/IconThumbnail.tsx index b0dc71f4..4b43c48d 100644 --- a/src/IconPicker/components/IconList/IconThumbnail.tsx +++ b/src/IconPicker/components/IconList/IconThumbnail.tsx @@ -1,7 +1,7 @@ -import { createStyles } from 'antd-style'; import type { FC } from 'react'; import { memo } from 'react'; import { Flexbox } from 'react-layout-kit'; +import { createStyles } from '../../../theme'; import type { IconUnit } from '../../types'; import IconItem from '../../features/IconRender'; diff --git a/src/IconPicker/components/IconList/index.tsx b/src/IconPicker/components/IconList/index.tsx index aff7d049..bc607152 100644 --- a/src/IconPicker/components/IconList/index.tsx +++ b/src/IconPicker/components/IconList/index.tsx @@ -1,6 +1,6 @@ -import { createStyles } from 'antd-style'; import type { FC } from 'react'; import { memo } from 'react'; +import { createStyles } from '../../../theme'; import { useStore } from '../../store'; import IconThumbnail from './IconThumbnail'; diff --git a/src/LevaPanel/index.tsx b/src/LevaPanel/index.tsx index 96d62a23..35fd907e 100644 --- a/src/LevaPanel/index.tsx +++ b/src/LevaPanel/index.tsx @@ -1,6 +1,6 @@ -import { createStyles } from 'antd-style'; import { LevaPanel, LevaStoreProvider, useCreateStore } from 'leva'; import { CSSProperties, ReactNode, memo } from 'react'; +import { createStyles } from '../theme'; import Schema, { SchemaProps } from './Schema'; const useStyles = createStyles( diff --git a/src/ProEditor/components/NavBar/index.tsx b/src/ProEditor/components/NavBar/index.tsx index f3a465f0..69328ab4 100644 --- a/src/ProEditor/components/NavBar/index.tsx +++ b/src/ProEditor/components/NavBar/index.tsx @@ -16,17 +16,16 @@ export interface NavBarProps { const NavBar: FC = memo(({ logo }) => { const prefixCls = useStore((s) => s.prefixCls, shallow); - const { styles } = useStyle(`${prefixCls}-navbar`); const defaultLogo = ( TechUI Studio -
TechUI Studio
+
ProEditor
 ); diff --git a/src/SortableTree/components/TreeItem/index.tsx b/src/SortableTree/components/TreeItem/index.tsx index 3fb8ef87..cba891a8 100644 --- a/src/SortableTree/components/TreeItem/index.tsx +++ b/src/SortableTree/components/TreeItem/index.tsx @@ -2,10 +2,10 @@ import type { UniqueIdentifier } from '@dnd-kit/core'; import { AnimateLayoutChanges, useSortable } from '@dnd-kit/sortable'; import { CSS } from '@dnd-kit/utilities'; import { useClickAway } from 'ahooks'; -import { createStyles } from 'antd-style'; import type { CSSProperties, FC, HTMLAttributes } from 'react'; import { memo, useRef } from 'react'; import { shallow } from 'zustand/shallow'; +import { createStyles } from '../../../theme'; import { CollapseAction, DeleteAction, HandleAction } from '@/ActionIcon'; diff --git a/src/index.ts b/src/index.ts index 54d6f754..6d061936 100644 --- a/src/index.ts +++ b/src/index.ts @@ -14,6 +14,10 @@ export * from './DraggablePanel'; export { default as ErrorBoundary } from './ErrorBoundary'; export { ExcelTable } from './ExcelTable'; export type { ExcelTableProps, ExcelTableStore, TableData } from './ExcelTable'; +export { default as FieldIcon } from './FieldIcon'; +export * from './FieldSelect'; +export { default as FieldSelect } from './FieldSelect'; +export { default as FieldTitle } from './FieldTitle'; export { default as FreeCanvas } from './FreeCanvas'; export type { FreeCanvasProps } from './FreeCanvas'; export * from './Highlight'; diff --git a/src/types/field.ts b/src/types/field.ts new file mode 100644 index 00000000..3329e887 --- /dev/null +++ b/src/types/field.ts @@ -0,0 +1,20 @@ +/** + * 字段类型 + */ +export enum APIFieldType { + integer = 'integer', + number = 'number', + bool = 'bool', + string = 'string', + integerArray = 'integerArray', + numberArray = 'numberArray', + stringArray = 'stringArray', + boolArray = 'boolArray', + // 系统赋值字段中的类型 + any = 'any', + anyArray = 'anyArray', + object = 'object', + objectArray = 'objectArray', + // 仅在树中出现 + array = 'array', +} diff --git a/src/types/index.ts b/src/types/index.ts index c21d393b..99fd570e 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -1,2 +1,3 @@ export * from './catogory'; +export * from './field'; export * from './schema'; diff --git a/tests/__snapshots__/demo.test.tsx.snap b/tests/__snapshots__/demo.test.tsx.snap index 3632c0eb..47bd0703 100644 --- a/tests/__snapshots__/demo.test.tsx.snap +++ b/tests/__snapshots__/demo.test.tsx.snap @@ -16046,6 +16046,2176 @@ exports[` > renders top.tsx correctly 1`] = ` `; +exports[` > renders basic.tsx correctly 1`] = ` +.emotion-0 { + font-size: 14px; +} + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+ + + +
+
+
+
+
+
+`; + +exports[` > renders basic.tsx correctly 1`] = ` +.emotion-0 { + width: 100%; +} + +.emotion-0.studio-select-multiple:not(.emotion-0.studio-select-customize-input) .emotion-0.studio-select.studio-select-selector:hover { + color: rgba(0, 0, 0, 0.88); + background-color: rgba(0, 0, 0, 0.04); + border-color: transparent; +} + +.emotion-0.studio-select-multiple:not(.emotion-0.studio-select-customize-input) .emotion-0.studio-select.studio-select-selector:focus { + color: rgba(0, 0, 0, 0.88)!important; + background-color: rgba(0, 0, 0, 0.02)!important; + border-color: #1677ff!important; + box-shadow: none; +} + +.emotion-0.studio-select:not(.studio-select-disabled):not(.studio-select-customize-input):hover .studio-select-selector { + border-color: transparent; +} + +.emotion-0.studio-select:not(.studio-select-disabled):not(.studio-select-customize-input):hover .studio-select-selector:hover { + color: rgba(0, 0, 0, 0.88); + background-color: rgba(0, 0, 0, 0.04); + border-color: transparent; +} + +.emotion-0.studio-select:not(.studio-select-disabled):not(.studio-select-customize-input):hover .studio-select-selector:focus { + color: rgba(0, 0, 0, 0.88)!important; + background-color: rgba(0, 0, 0, 0.02)!important; + border-color: #1677ff!important; + box-shadow: none; +} + +.emotion-0.studio-select-focused:not(.studio-select-disabled):not(.studio-select-customize-input):hover .studio-select-selector { + color: rgba(0, 0, 0, 0.88)!important; + background-color: rgba(0, 0, 0, 0.02)!important; + border-color: #1677ff!important; + box-shadow: none; +} + +.emotion-0.studio-select-focused:not(.studio-select-disabled):not(.studio-select-customize-input) .studio-select-selector { + color: rgba(0, 0, 0, 0.88)!important; + background-color: rgba(0, 0, 0, 0.02)!important; + border-color: #1677ff!important; + box-shadow: none; +} + +.emotion-0 .studio-select-arrow { + top: 13px; + right: 8px; + width: 10px; + height: 10px; + font-size: 10px; +} + +.emotion-1 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + font-size: 12px; +} + +.emotion-2 { + font-size: 14px; +} + +.emotion-3 { + margin-left: 4px; +} + +
+
+
+ + + + +
+
+ + + + + orderId + +
+
+ +
+ +
+
+`; + +exports[` > renders basic.tsx correctly 1`] = ` +.emotion-0 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + font-size: 12px; +} + +.emotion-1 { + font-size: 14px; +} + +.emotion-2 { + margin-left: 4px; +} + +
+
+
+
+
+
+
+
+ + + + + any + +
+
+
+
+
+
+
+
+
+
+ + + + + anyArray + +
+
+
+
+
+
+
+
+
+
+ + + + + bool + +
+
+
+
+
+
+
+
+
+
+ + + + + boolArray + +
+
+
+
+
+
+
+
+
+
+ + + + + integer + +
+
+
+
+
+
+
+
+
+
+ + + + + integerArray + +
+
+
+
+
+
+
+
+
+
+ + + + + number + +
+
+
+
+
+
+
+
+
+
+ + + + + numberArray + +
+
+
+
+
+
+
+
+
+
+ + + + + object + +
+
+
+
+
+
+
+
+
+
+ + + + + objectArray + +
+
+
+
+
+
+
+
+
+
+ + + + + string + +
+
+
+
+
+
+
+
+
+
+ + + + + stringArray + +
+
+
+
+
+
+
+
+
+
+ + + + + boolean + +
+
+
+
+
+
+
+
+
+
+ + empty + +
+
+
+
+
+
+
+
+`; + +exports[` > renders description.tsx correctly 1`] = ` +.emotion-0 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + font-size: 12px; +} + +.emotion-1 { + font-size: 14px; +} + +.emotion-2 { + margin-left: 4px; +} + +.emotion-7 { + padding-left: 16px; +} + +
+
+
+
+
+
+
+
+
+ 描述 +
+
+ 描述在标题右边 +
+
+
+
+
+
+
+ + + + + success + + + 成功标识 + +
+
+
+
+
+
+
+
+
+
+
+ 额外 +
+
+ 额外内容在字段下面 +
+
+
+
+
+
+
+ + + + + success + +
+
+ 额外内容 +
+
+
+
+
+
+
+
+
+
+
+ 可选 +
+
+ 可选为false 则额外内容左侧有 padding +
+
+
+
+
+
+
+ + + + + success + +
+
+ 额外内容 +
+
+
+
+
+
+
+
+`; + exports[` > renders basic.tsx correctly 1`] = ` .emotion-0 .react-flow__attribution { display: none;