diff --git a/packages/address-list/Item.js b/packages/address-list/Item.tsx similarity index 64% rename from packages/address-list/Item.js rename to packages/address-list/Item.tsx index 55410fa3a..20d6c3e45 100644 --- a/packages/address-list/Item.js +++ b/packages/address-list/Item.tsx @@ -4,16 +4,43 @@ import Icon from '../icon'; import Cell from '../cell'; import Radio from '../radio'; +// Types +import { CreateElement, RenderContext } from 'vue/types'; +import { DefaultSlots } from '../utils/use/sfc'; + +export type AddressItemData = { + id: string | number; + tel: string | number; + name: string; + address: string; +}; + +export type AddressItemProps = { + data: AddressItemData; + disabled?: boolean; + switchable?: boolean; +}; + +export type AddressItemEvents = { + onEdit(): void; + onSelect(): void; +}; + const [sfc, bem] = use('address-item'); -function AddressItem(h, props, slots, ctx) { +function AddressItem( + h: CreateElement, + props: AddressItemProps, + slots: DefaultSlots, + ctx: RenderContext +) { const { disabled, switchable } = props; const renderRightIcon = () => ( { + onClick={(event: Event) => { event.stopPropagation(); emit(ctx, 'edit'); }} @@ -57,4 +84,4 @@ AddressItem.props = { switchable: Boolean }; -export default sfc(AddressItem); +export default sfc(AddressItem); diff --git a/packages/address-list/en-US.md b/packages/address-list/en-US.md index b617c81c5..17f248428 100644 --- a/packages/address-list/en-US.md +++ b/packages/address-list/en-US.md @@ -90,7 +90,7 @@ export default { |------|------|------| | id | Id | `String | Number` | | name | Name | `String` | -| tel | Phone | `String` | +| tel | Phone | `String | Number` | | address | Address | `String` | ### Slot diff --git a/packages/address-list/index.js b/packages/address-list/index.tsx similarity index 67% rename from packages/address-list/index.js rename to packages/address-list/index.tsx index 38103511a..7b2876916 100644 --- a/packages/address-list/index.js +++ b/packages/address-list/index.tsx @@ -2,12 +2,34 @@ import { use } from '../utils'; import { emit, inherit } from '../utils/functional'; import Button from '../button'; import RadioGroup from '../radio-group'; -import AddressItem from './Item'; +import AddressItem, { AddressItemData } from './Item'; + +// Types +import { CreateElement, RenderContext } from 'vue/types'; +import { ScopedSlot, DefaultSlots } from '../utils/use/sfc'; + +export type AddressListProps = { + value?: string | number; + switchable: boolean; + disabledText?: string; + addButtonText?: string; + list: AddressItemData[]; + disabledList: AddressItemData[]; +}; + +export type AddressListSlots = DefaultSlots & { + top?: ScopedSlot; +}; const [sfc, bem, t] = use('address-list'); -function AddressList(h, props, slots, ctx) { - const getList = (list, disabled) => +function AddressList( + h: CreateElement, + props: AddressListProps, + slots: AddressListSlots, + ctx: RenderContext +) { + const getList = (list: AddressItemData[], disabled?: boolean) => list.map((item, index) => ( { + onInput={(event: Event) => { emit(ctx, 'input', event); }} > @@ -68,4 +90,4 @@ AddressList.props = { } }; -export default sfc(AddressList); +export default sfc(AddressList); diff --git a/packages/address-list/zh-CN.md b/packages/address-list/zh-CN.md index 9f7a9894d..1e0129fb6 100644 --- a/packages/address-list/zh-CN.md +++ b/packages/address-list/zh-CN.md @@ -94,7 +94,7 @@ export default { |------|------|------| | id | 每条地址的唯一标识 | `String | Number` | | name | 收货人姓名 | `String` | -| tel | 收货人手机号 | `String` | +| tel | 收货人手机号 | `String | Number` | | address | 收货地址 | `String` | ### Slot diff --git a/packages/utils/use/sfc.ts b/packages/utils/use/sfc.ts index 51954feb8..c258544d3 100644 --- a/packages/utils/use/sfc.ts +++ b/packages/utils/use/sfc.ts @@ -53,11 +53,15 @@ export type FunctionalComponent< }; export type TsxBaseProps = { - class: any; - style: any; + key: string | number; // hack for jsx prop spread props: any; + class: any; + style: { + [key: string]: string | number; + }; }; + export type TsxComponent = ( props: Partial ) => VNode;