[improvement] Info: tsx (#2768)

packages/info/index.js

@@ -1,20 +0,0 @@
-import { use, isDef } from '../utils';
-import { inherit } from '../utils/functional';
-
-const [sfc, bem] = use('info');
-
-function Info(h, props, slots, ctx) {
-  return (
-    isDef(props.info) && (
-      <div class={bem()} {...inherit(ctx, true)}>
-        {props.info}
-      </div>
-    )
-  );
-}
-
-Info.props = {
-  info: [String, Number]
-};
-
-export default sfc(Info);

packages/info/index.tsx

@@ -0,0 +1,29 @@
+import { use, isDef } from '../utils';
+import { inherit } from '../utils/functional';
+
+// Types
+import { FunctionalComponent } from '../utils/use/sfc';
+
+const [sfc, bem] = use('info');
+
+const Info: FunctionalComponent<InfoProps> = function(h, props, slots, ctx) {
+  if (!isDef(props.info)) {
+    return;
+  }
+
+  return (
+    <div class={bem()} {...inherit(ctx, true)}>
+      {props.info}
+    </div>
+  );
+};
+
+export type InfoProps = {
+  info?: string | number;
+};
+
+Info.props = {
+  info: [String, Number]
+};
+
+export default sfc(Info);

packages/utils/use/bem.ts

@@ -13,7 +13,7 @@ type Mods = Mod | Mod[];
 const ELEMENT = '__';
 const MODS = '--';
 
-function join(name: string, el: string, symbol: string): string {
+function join(name: string, el?: string, symbol?: string): string {
   return el ? name + symbol + el : name;
 }
 
@@ -36,7 +36,7 @@ function prefix(name: string, mods: Mods): Mods {
   return ret;
 }
 
-export default (name: string) => (el: Mods, mods?: Mods): Mods => {
+export default (name: string) => (el?: Mods, mods?: Mods): Mods => {
   if (el && typeof el !== 'string') {
     mods = el;
     el = '';

packages/utils/use/sfc.ts

@@ -15,7 +15,17 @@ import { InjectOptions, PropsDefinition } from 'vue/types/options';
 
 export type ScopedSlot = (props?: any) => VNode[] | undefined;
 
-export type VantComponentOptions = ComponentOptions<Vue> & {
+export type ScopedSlots = {
+  [key: string]: ScopedSlot | undefined;
+  default?: ScopedSlot;
+};
+
+export type ModelOptions = {
+  prop?: string;
+  event?: string;
+};
+
+export interface VantComponentOptions extends ComponentOptions<Vue> {
   functional?: boolean;
   install?: (Vue: VueConstructor) => void;
 };
@@ -29,17 +39,11 @@ export type FunctionalComponent<
   (
     h: CreateElement,
     props: Props,
-    slots: {
+    slots: ScopedSlots,
-      [key: string]: ScopedSlot | undefined
-      default: ScopedSlot | undefined
-    },
     context: RenderContext<Props>
-  ): VNode;
+  ): VNode | undefined;
   props?: PropDefs;
-  model?: {
+  model?: ModelOptions;
-    prop?: string;
-    event?: string;
-  };
   inject?: InjectOptions;
 };
 
@@ -94,7 +98,7 @@ function transformFunctionalComponent(
     functional: true,
     props: pure.props,
     model: pure.model,
-    render: (h, context) => pure(h, context.props, unifySlots(context), context)
+    render: (h, context): any => pure(h, context.props, unifySlots(context), context)
   };
 }