From 1d84d3326411cf58e1980fce77f664544ba63015 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@buaa.edu.cn>
Date: Sun, 17 Feb 2019 18:09:26 +0800
Subject: [PATCH] [improvement] Info: tsx (#2768)

---
 packages/info/index.js    | 20 --------------------
 packages/info/index.tsx   | 29 +++++++++++++++++++++++++++++
 packages/utils/use/bem.ts |  4 ++--
 packages/utils/use/sfc.ts | 26 +++++++++++++++-----------
 4 files changed, 46 insertions(+), 33 deletions(-)
 delete mode 100644 packages/info/index.js
 create mode 100644 packages/info/index.tsx

diff --git a/packages/info/index.js b/packages/info/index.js
deleted file mode 100644
index 08aa77a1f..000000000
--- a/packages/info/index.js
+++ /dev/null
@@ -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);
diff --git a/packages/info/index.tsx b/packages/info/index.tsx
new file mode 100644
index 000000000..db22bf748
--- /dev/null
+++ b/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);
diff --git a/packages/utils/use/bem.ts b/packages/utils/use/bem.ts
index a257d4ffa..34ec1cd68 100644
--- a/packages/utils/use/bem.ts
+++ b/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 = '';
diff --git a/packages/utils/use/sfc.ts b/packages/utils/use/sfc.ts
index ada6db151..1f30c8afe 100644
--- a/packages/utils/use/sfc.ts
+++ b/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: {
-      [key: string]: ScopedSlot | undefined
-      default: ScopedSlot | undefined
-    },
+    slots: ScopedSlots,
     context: RenderContext<Props>
-  ): VNode;
+  ): VNode | undefined;
   props?: PropDefs;
-  model?: {
-    prop?: string;
-    event?: string;
-  };
+  model?: ModelOptions;
   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)
   };
 }