[improvement] icon: tsx (#2767)

packages/icon/index.tsx

@@ -3,9 +3,12 @@ import { inherit } from '../utils/functional';
 import Info from '../info';
 import isSrc from '../utils/validate/src';
 
+// Types
+import { FunctionalComponent } from '../utils/use/sfc';
+
 const [sfc] = use('icon');
 
-function Icon(h, props, slots, ctx) {
+const Icon: FunctionalComponent<IconProps> = function(h, props, slots, ctx) {
   const urlIcon = isSrc(props.name);
 
   return (
@@ -20,12 +23,20 @@ function Icon(h, props, slots, ctx) {
       }}
       {...inherit(ctx, true)}
     >
-      {ctx.default && ctx.default()}
+      {slots.default && slots.default()}
       {urlIcon && <img src={props.name} />}
       <Info info={props.info} />
     </i>
   );
-}
+};
+
+export type IconProps = {
+  name: string;
+  size?: string;
+  color?: string;
+  info?: string | number;
+  classPrefix?: string;
+};
 
 Icon.props = {
   name: String,
@@ -38,4 +49,4 @@ Icon.props = {
   }
 };
 
-export default sfc(Icon);
+export default sfc<IconProps>(Icon);

packages/utils/use/sfc.ts

@@ -29,7 +29,10 @@ export type FunctionalComponent<
   (
     h: CreateElement,
     props: Props,
-    slots: { [key: string]: ScopedSlot | undefined },
+    slots: {
+      [key: string]: ScopedSlot | undefined
+      default: ScopedSlot | undefined
+    },
     context: RenderContext<Props>
   ): VNode;
   props?: PropDefs;