优化图标选择器

packages/amis-ui/scss/components/form/_icon-select.scss

@@ -4,6 +4,9 @@
   &-clear {
     position: absolute;
     right: var(--Form-input-paddingX);
+    svg {
+      top: 0;
+    }
   }
 
   &-Modal {

packages/amis-ui/src/components/icons.tsx

@@ -378,11 +378,12 @@ export function Icon({
   // 直接传入svg字符串
   if (typeof icon === 'string' && icon.startsWith('<svg')) {
     const svgStr = /<svg .*?>(.*?)<\/svg>/.exec(icon);
+    const viewBox = /viewBox="(.*?)"/.exec(icon);
     const svgHTML = createElement('svg', {
       className: cx('icon', className, classNameProp),
       style,
       dangerouslySetInnerHTML: {__html: svgStr ? svgStr[1] : ''},
-      viewBox: '0 0 16 16',
+      viewBox: viewBox?.[1] || '0 0 16 16',
       ...eventProps
     });
     return svgHTML;

packages/amis/src/renderers/Form/IconSelect.tsx

@@ -119,48 +119,23 @@ export default class IconSelectControl extends React.PureComponent<
     const {
       classPrefix: ns,
       disabled,
-      value: valueTemp,
+      value,
       placeholder,
       clearable
     } = this.props;
-    const value =
-      typeof valueTemp === 'string' ? this.getValueBySvg(valueTemp) : valueTemp;
-    const SvgStr =
-      typeof valueTemp === 'string' && valueTemp.match(/(<svg.{1,}\/svg>)/);
 
-    const pureValue =
-      (value?.id && String(value.id).replace(/^svg-/, '')) || '';
-    const iconName = value?.name || pureValue;
+    const iconName = value?.name || value;
 
     return (
       <div className={cx(`${ns}IconSelectControl-input-area`)}>
-        {pureValue ? (
-          <div className={cx(`${ns}IconSelectControl-input-icon-show`)}>
-            <svg>
-              <use xlinkHref={`#${pureValue}`}></use>
-            </svg>
-          </div>
-        ) : valueTemp ? (
-          SvgStr ? (
-            <div
-              className={cx(`${ns}IconSelectControl-input-area-str-svg`)}
-              dangerouslySetInnerHTML={{__html: SvgStr[0].replace(/\\"/g, '"')}}
-            ></div>
-          ) : (
-            <Icon
-              icon={valueTemp}
-              className={cx(
-                `${ns}IconSelectControl-input-area-iconfont`,
-                'icon'
-              )}
-            />
-          )
-        ) : null}
+        <div className={cx(`${ns}IconSelectControl-input-icon-show`)}>
+          <Icon icon={value} className="icon" />
+        </div>
         <span className={cx(`${ns}IconSelectControl-input-icon-id`)}>
           {iconName}
         </span>
 
-        {clearable && !disabled && (pureValue || valueTemp) ? (
+        {clearable && !disabled && value ? (
           <a
             onClick={this.handleClear}
             className={cx(`${ns}IconSelectControl-clear`)}