优化

client/packages/design/components/Icon/index.tsx

@@ -0,0 +1,31 @@
+import React, { useState } from 'react';
+import {
+  Icon as Iconify,
+  IconProps,
+  addIcon,
+  addCollection,
+} from '@iconify/react';
+
+const placeHolderStyle = { width: '1em', height: '1em' };
+
+const InternalIcon: React.FC<Omit<IconProps, 'ref'>> = React.memo((props) => {
+  const [loaded, setLoaded] = useState(false);
+
+  return (
+    <>
+      <Iconify {...props} onLoad={() => setLoaded(true)} />
+      {!loaded && <span style={placeHolderStyle} />}
+    </>
+  );
+});
+InternalIcon.displayName = 'Icon';
+
+type CompoundedComponent = React.FC<Omit<IconProps, 'ref'>> & {
+  addIcon: typeof addIcon;
+  addCollection: typeof addCollection;
+};
+
+export const Icon = InternalIcon as CompoundedComponent;
+
+Icon.addIcon = addIcon;
+Icon.addCollection = addCollection;