[improvement] ContactCard: tsx (youzan#2783)

Author: chenjiahan

packages/button/index.tsx

@@ -23,6 +23,10 @@ export type ButtonProps = RouteProps & {
   bottomAction?: boolean;
 };
 
+export type ButtonEvents = {
+  onClick?(event: Event): void;
+};
+
 const [sfc, bem] = use('button');
 
 function Button(
@@ -100,4 +104,4 @@ Button.props = {
   }
 };
 
-export default sfc<ButtonProps>(Button);
+export default sfc<ButtonProps, ButtonEvents>(Button);

packages/card/index.tsx

@@ -32,6 +32,10 @@ export type CardSlots = DefaultSlots & {
   'origin-price'?: ScopedSlot;
 };
 
+export type CardEvents = {
+  onClick?(event: Event): void;
+};
+
 const [sfc, bem] = use('card');
 
 function Card(
@@ -140,4 +144,4 @@ Card.props = {
   }
 };
 
-export default sfc<CardProps>(Card);
+export default sfc<CardProps, CardEvents>(Card);

packages/contact-card/en-US.md

@@ -140,6 +140,12 @@ export default {
 | tel | Phone | `String` | - |
 | add-text | Add card text | `String` | `Add contact info` |
 
+### ContactCard Event
+
+| Event | Description | Arguments |
+|------|------|------|
+| click | Triggered when clicked | - |
+
 ### ContactList API
 
 | Attribute | Description | Type | Default |

packages/contact-card/zh-CN.md

@@ -140,6 +140,12 @@ export default {
 | tel | 联系人手机号 | `String` | - | - |
 | add-text | 添加时的文案提示 | `String` | `添加订单联系人信息` | - |
 
+### ContactCard Event
+
+| 事件名 | 说明 | 参数 |
+|------|------|------|
+| click | 点击时触发 | - |
+
 ### ContactList API
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |

packages/field/en-US.md

@@ -138,6 +138,7 @@ Field support all native events of input tag，such as `focus`、`blur`、`keypr
 
 | Event | Description | Parameters |
 |------|------|------|
+| input | Triggered when value changed | - |
 | clear | Triggered when click clear icon | - |
 | click-left-icon | Triggered when click the left icon of Field | - |
 | click-right-icon | Triggered when click the right icon of Field | - |

packages/field/zh-CN.md

@@ -140,6 +140,7 @@ Field 默认支持 Input 标签所有的原生事件，如 `focus`、`blur`、`k
 
 | 事件 | 说明 | 回调参数 |
 |------|------|------|
+| input | 输入框内容变化时触发 | - |
 | clear | 点击清除按钮后触发 | - |
 | click-left-icon | 点击头部图标时触发 | - |
 | click-right-icon | 点击尾部图标时触发 | - |

packages/nav-bar/index.js renamed to packages/nav-bar/index.tsx

@@ -2,9 +2,39 @@ import { use, noop } from '../utils';
 import { inherit } from '../utils/functional';
 import Icon from '../icon';
 
+// Types
+import { CreateElement, RenderContext } from 'vue/types';
+import { ScopedSlot, DefaultSlots } from '../utils/use/sfc';
+
+export type NavBarProps = {
+  title?: string;
+  fixed?: boolean;
+  zIndex?: number;
+  border?: boolean;
+  leftText?: string;
+  rightText?: string;
+  leftArrow?: boolean;
+};
+
+export type NavBarSlots = DefaultSlots & {
+  left?: ScopedSlot;
+  title?: ScopedSlot;
+  right?: ScopedSlot;
+};
+
+export type NavBarEvents = {
+  'click-left'?(event: Event): void;
+  'click-right'?(event: Event): void;
+};
+
 const [sfc, bem] = use('nav-bar');
 
-function NavBar(h, props, slots, ctx) {
+function NavBar(
+  h: CreateElement,
+  props: NavBarProps,
+  slots: NavBarSlots,
+  ctx: RenderContext<NavBarProps>
+) {
   return (
     <div
       class={[
@@ -56,4 +86,4 @@ NavBar.props = {
   }
 };
 
-export default sfc(NavBar);
+export default sfc<NavBarProps, NavBarEvents>(NavBar);