From 2ebcf2a36a29ae34a2d8c428c7fc4a32d2fa9af4 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@buaa.edu.cn>
Date: Sat, 16 Feb 2019 22:03:28 +0800
Subject: [PATCH] [improvement] Button: tsx (#2766)

---
 packages/button/{index.js => index.tsx} | 39 ++++++++++++++++++++-----
 packages/mixins/router.ts               |  6 ++++
 2 files changed, 38 insertions(+), 7 deletions(-)
 rename packages/button/{index.js => index.tsx} (68%)

diff --git a/packages/button/index.js b/packages/button/index.tsx
similarity index 68%
rename from packages/button/index.js
rename to packages/button/index.tsx
index f5a738759..1b9b19d47 100644
--- a/packages/button/index.js
+++ b/packages/button/index.tsx
@@ -3,12 +3,21 @@ import { emit, inherit } from '../utils/functional';
 import { routeProps, functionalRoute } from '../mixins/router';
 import Loading from '../loading';
 
+// Types
+import { RouteProps } from '../mixins/router';
+import { FunctionalComponent } from '../utils/use/sfc';
+
 const [sfc, bem] = use('button');
 
-function Button(h, props, slots, ctx) {
-  const { type, disabled, loading, loadingText } = props;
+const Button: FunctionalComponent<ButtonProps> = function(
+  h,
+  props,
+  slots,
+  ctx
+) {
+  const { tag, type, disabled, loading, loadingText } = props;
 
-  const onClick = event => {
+  const onClick = (event: Event) => {
     if (!loading && !disabled) {
       emit(ctx, 'click', event);
       functionalRoute(ctx);
@@ -16,7 +25,7 @@ function Button(h, props, slots, ctx) {
   };
 
   return (
-    <props.tag
+    <tag
       type={props.nativeType}
       disabled={disabled}
       class={bem([
@@ -45,9 +54,25 @@ function Button(h, props, slots, ctx) {
           {slots.default ? slots.default() : props.text}
         </span>
       )}
-    </props.tag>
+    </tag>
   );
-}
+};
+
+export type ButtonProps = RouteProps & {
+  tag?: string;
+  type?: string;
+  size?: string;
+  text?: string;
+  block?: boolean;
+  plain?: boolean;
+  round?: boolean;
+  square?: boolean;
+  loading?: boolean;
+  disabled?: boolean;
+  nativeType?: string;
+  loadingText?: string;
+  bottomAction?: boolean;
+};
 
 Button.props = {
   ...routeProps,
@@ -75,4 +100,4 @@ Button.props = {
   }
 };
 
-export default sfc(Button);
+export default sfc<ButtonProps>(Button);
diff --git a/packages/mixins/router.ts b/packages/mixins/router.ts
index e9c3f7960..3c61c0ab0 100644
--- a/packages/mixins/router.ts
+++ b/packages/mixins/router.ts
@@ -24,6 +24,12 @@ export function functionalRoute(context: RenderContext) {
   route(context.parent && context.parent.$router, context.props);
 }
 
+export type RouteProps = {
+  url?: string,
+  replace?: boolean;
+  to?: RawLocation;
+}
+
 export const routeProps = {
   url: String,
   replace: Boolean,