From ca1aa1a7b1534d784a558d87e36cac2154476f1e Mon Sep 17 00:00:00 2001 From: neverland Date: Mon, 25 Oct 2021 20:36:23 +0800 Subject: [PATCH] types: export all props type (#9717) --- .../src/action-bar-button/ActionBarButton.tsx | 24 ++++-- packages/vant/src/action-bar-button/index.ts | 1 + .../src/action-bar-icon/ActionBarIcon.tsx | 24 +++--- packages/vant/src/action-bar-icon/index.ts | 1 + packages/vant/src/action-bar/ActionBar.tsx | 12 ++- packages/vant/src/action-bar/README.md | 12 +++ packages/vant/src/action-bar/README.zh-CN.md | 12 +++ packages/vant/src/action-bar/index.ts | 1 + .../vant/src/action-sheet/ActionSheet.tsx | 34 ++++---- packages/vant/src/action-sheet/README.md | 2 +- .../vant/src/action-sheet/README.zh-CN.md | 2 +- packages/vant/src/action-sheet/index.ts | 2 +- .../vant/src/address-edit/AddressEdit.tsx | 6 +- .../vant/src/address-list/AddressList.tsx | 24 +++--- packages/vant/src/address-list/README.md | 2 +- .../vant/src/address-list/README.zh-CN.md | 2 +- packages/vant/src/address-list/index.ts | 1 + packages/vant/src/area/Area.tsx | 8 +- packages/vant/src/area/index.ts | 4 +- packages/vant/src/badge/Badge.tsx | 30 ++++--- packages/vant/src/badge/README.md | 8 ++ packages/vant/src/badge/README.zh-CN.md | 8 ++ packages/vant/src/badge/index.ts | 1 + packages/vant/src/button/Button.tsx | 65 ++++++++------- packages/vant/src/button/README.md | 1 + packages/vant/src/button/README.zh-CN.md | 1 + packages/vant/src/button/index.ts | 3 +- packages/vant/src/button/types.ts | 14 ++++ packages/vant/src/calendar/Calendar.tsx | 6 +- packages/vant/src/calendar/CalendarMonth.tsx | 6 +- packages/vant/src/calendar/index.ts | 4 +- packages/vant/src/card/Card.tsx | 32 ++++---- packages/vant/src/card/README.md | 8 ++ packages/vant/src/card/README.zh-CN.md | 8 ++ packages/vant/src/card/index.ts | 1 + packages/vant/src/cascader/Cascader.tsx | 6 +- packages/vant/src/cascader/index.ts | 4 +- packages/vant/src/cell-group/CellGroup.tsx | 16 ++-- packages/vant/src/cell-group/index.ts | 1 + packages/vant/src/cell/Cell.tsx | 15 +++- packages/vant/src/cell/README.md | 2 +- packages/vant/src/cell/README.zh-CN.md | 2 +- packages/vant/src/cell/index.ts | 2 +- .../vant/src/checkbox-group/CheckboxGroup.tsx | 6 +- packages/vant/src/checkbox-group/index.ts | 4 +- packages/vant/src/checkbox/Checkbox.tsx | 6 +- packages/vant/src/checkbox/index.ts | 4 +- packages/vant/src/circle/Circle.tsx | 41 ++++++---- packages/vant/src/circle/README.md | 2 +- packages/vant/src/circle/README.zh-CN.md | 2 +- packages/vant/src/circle/index.ts | 2 +- packages/vant/src/col/Col.tsx | 16 ++-- packages/vant/src/col/README.md | 2 +- packages/vant/src/col/README.zh-CN.md | 2 +- packages/vant/src/col/index.ts | 1 + .../vant/src/collapse-item/CollapseItem.tsx | 10 +-- packages/vant/src/collapse-item/index.ts | 4 +- packages/vant/src/collapse/Collapse.tsx | 26 +++--- packages/vant/src/collapse/README.md | 6 +- packages/vant/src/collapse/README.zh-CN.md | 6 +- packages/vant/src/collapse/index.ts | 1 + .../src/config-provider/ConfigProvider.tsx | 15 ++-- packages/vant/src/config-provider/README.md | 8 ++ .../vant/src/config-provider/README.zh-CN.md | 8 ++ packages/vant/src/config-provider/index.ts | 1 + .../vant/src/contact-card/ContactCard.tsx | 20 +++-- packages/vant/src/contact-card/README.md | 2 +- .../vant/src/contact-card/README.zh-CN.md | 2 +- packages/vant/src/contact-card/index.ts | 2 +- .../vant/src/contact-edit/ContactEdit.tsx | 42 ++++++---- packages/vant/src/contact-edit/README.md | 2 +- .../vant/src/contact-edit/README.zh-CN.md | 2 +- packages/vant/src/contact-edit/index.ts | 2 +- .../vant/src/contact-list/ContactList.tsx | 18 ++-- packages/vant/src/contact-list/README.md | 2 +- .../vant/src/contact-list/README.zh-CN.md | 2 +- packages/vant/src/contact-list/index.ts | 2 +- packages/vant/src/count-down/CountDown.tsx | 6 +- packages/vant/src/count-down/index.ts | 4 +- packages/vant/src/coupon-cell/CouponCell.tsx | 36 ++++---- packages/vant/src/coupon-cell/index.ts | 1 + packages/vant/src/coupon-list/CouponList.tsx | 44 +++++----- packages/vant/src/coupon-list/README.md | 8 ++ packages/vant/src/coupon-list/README.zh-CN.md | 8 ++ packages/vant/src/coupon-list/index.ts | 1 + packages/vant/src/coupon/Coupon.tsx | 21 +---- packages/vant/src/coupon/utils.ts | 14 ++++ .../vant/src/datetime-picker/DatePicker.tsx | 4 +- .../src/datetime-picker/DatetimePicker.tsx | 12 +-- .../vant/src/datetime-picker/TimePicker.tsx | 4 +- packages/vant/src/datetime-picker/utils.ts | 8 +- packages/vant/src/dialog/Dialog.tsx | 48 ++++++----- packages/vant/src/dialog/README.md | 1 + packages/vant/src/dialog/README.zh-CN.md | 1 + packages/vant/src/dialog/index.ts | 1 + packages/vant/src/divider/Divider.tsx | 16 ++-- packages/vant/src/divider/README.md | 2 +- packages/vant/src/divider/README.zh-CN.md | 2 +- packages/vant/src/divider/index.ts | 2 +- .../vant/src/dropdown-item/DropdownItem.tsx | 6 +- .../vant/src/dropdown-menu/DropdownMenu.tsx | 6 +- packages/vant/src/empty/Empty.tsx | 16 ++-- packages/vant/src/empty/README.md | 8 ++ packages/vant/src/empty/README.zh-CN.md | 8 ++ packages/vant/src/empty/index.ts | 1 + packages/vant/src/field/Field.tsx | 8 +- packages/vant/src/form/Form.tsx | 6 +- packages/vant/src/grid-item/GridItem.tsx | 27 ++++-- packages/vant/src/grid-item/index.ts | 1 + packages/vant/src/grid/Grid.tsx | 8 +- packages/vant/src/grid/README.md | 2 +- packages/vant/src/grid/README.zh-CN.md | 2 +- packages/vant/src/grid/index.ts | 2 +- packages/vant/src/icon/Icon.tsx | 24 +++--- packages/vant/src/icon/README.md | 8 ++ packages/vant/src/icon/README.zh-CN.md | 8 ++ packages/vant/src/icon/index.ts | 1 + .../vant/src/image-preview/ImagePreview.tsx | 6 +- packages/vant/src/image/Image.tsx | 37 +++++---- packages/vant/src/image/README.md | 2 +- packages/vant/src/image/README.zh-CN.md | 2 +- packages/vant/src/image/index.ts | 2 +- .../vant/src/index-anchor/IndexAnchor.tsx | 19 ++++- packages/vant/src/index-anchor/index.ts | 1 + packages/vant/src/index-bar/IndexBar.tsx | 6 +- packages/vant/src/index-bar/README.md | 2 +- packages/vant/src/index-bar/README.zh-CN.md | 2 +- packages/vant/src/list/List.tsx | 6 +- packages/vant/src/loading/Loading.tsx | 22 +++-- packages/vant/src/loading/README.md | 2 +- packages/vant/src/loading/README.zh-CN.md | 2 +- packages/vant/src/loading/index.ts | 2 +- packages/vant/src/nav-bar/NavBar.tsx | 28 ++++--- packages/vant/src/nav-bar/README.md | 8 ++ packages/vant/src/nav-bar/README.zh-CN.md | 8 ++ packages/vant/src/nav-bar/index.ts | 1 + packages/vant/src/notice-bar/NoticeBar.tsx | 6 +- packages/vant/src/notify/Notify.tsx | 22 +++-- packages/vant/src/notify/README.md | 2 +- packages/vant/src/notify/README.zh-CN.md | 2 +- packages/vant/src/notify/index.ts | 1 + .../src/number-keyboard/NumberKeyboard.tsx | 49 ++++++----- packages/vant/src/number-keyboard/README.md | 2 +- .../vant/src/number-keyboard/README.zh-CN.md | 2 +- packages/vant/src/number-keyboard/index.ts | 5 +- packages/vant/src/overlay/Overlay.tsx | 28 +++++-- packages/vant/src/overlay/README.md | 8 ++ packages/vant/src/overlay/README.zh-CN.md | 8 ++ packages/vant/src/pagination/Pagination.tsx | 28 ++++--- packages/vant/src/pagination/README.md | 2 +- packages/vant/src/pagination/README.zh-CN.md | 2 +- packages/vant/src/pagination/index.ts | 2 +- packages/vant/src/picker/Picker.tsx | 22 ++--- packages/vant/src/popover/Popover.tsx | 82 ++++++++----------- packages/vant/src/popover/README.md | 1 + packages/vant/src/popover/README.zh-CN.md | 1 + packages/vant/src/popover/index.ts | 3 +- packages/vant/src/popover/types.ts | 24 ++++++ packages/vant/src/popup/Popup.tsx | 27 +++--- packages/vant/src/popup/README.md | 2 +- packages/vant/src/popup/README.zh-CN.md | 2 +- packages/vant/src/popup/index.ts | 6 +- packages/vant/src/progress/Progress.tsx | 6 +- .../vant/src/pull-refresh/PullRefresh.tsx | 37 ++++++--- packages/vant/src/pull-refresh/README.md | 24 ++++-- .../vant/src/pull-refresh/README.zh-CN.md | 24 ++++-- packages/vant/src/pull-refresh/index.ts | 1 + packages/vant/src/radio-group/RadioGroup.tsx | 8 +- packages/vant/src/radio-group/index.ts | 4 +- packages/vant/src/radio/README.md | 8 +- packages/vant/src/radio/README.zh-CN.md | 8 +- packages/vant/src/radio/Radio.tsx | 3 +- packages/vant/src/radio/index.ts | 4 +- packages/vant/src/rate/README.md | 14 +++- packages/vant/src/rate/README.zh-CN.md | 14 +++- packages/vant/src/rate/Rate.tsx | 38 +++++---- packages/vant/src/rate/index.ts | 1 + packages/vant/src/row/Row.tsx | 19 +++-- packages/vant/src/row/index.ts | 2 +- packages/vant/src/search/Search.tsx | 6 +- packages/vant/src/share-sheet/README.md | 6 +- packages/vant/src/share-sheet/README.zh-CN.md | 6 +- packages/vant/src/share-sheet/ShareSheet.tsx | 28 ++++--- packages/vant/src/share-sheet/index.ts | 6 +- .../vant/src/sidebar-item/SidebarItem.tsx | 18 ++-- packages/vant/src/sidebar-item/index.ts | 1 + packages/vant/src/sidebar/README.md | 8 ++ packages/vant/src/sidebar/README.zh-CN.md | 8 ++ packages/vant/src/sidebar/Sidebar.tsx | 12 ++- packages/vant/src/sidebar/index.ts | 1 + packages/vant/src/skeleton/README.md | 2 +- packages/vant/src/skeleton/README.zh-CN.md | 2 +- packages/vant/src/skeleton/Skeleton.tsx | 40 +++++---- packages/vant/src/skeleton/index.ts | 4 +- packages/vant/src/slider/README.md | 8 ++ packages/vant/src/slider/README.zh-CN.md | 10 ++- packages/vant/src/slider/Slider.tsx | 49 ++++++----- packages/vant/src/slider/index.ts | 1 + packages/vant/src/stepper/README.md | 2 +- packages/vant/src/stepper/README.zh-CN.md | 2 +- packages/vant/src/stepper/Stepper.tsx | 62 ++++++++------ packages/vant/src/stepper/index.ts | 4 +- packages/vant/src/steps/README.md | 2 +- packages/vant/src/steps/README.zh-CN.md | 2 +- packages/vant/src/steps/Steps.tsx | 8 +- packages/vant/src/steps/index.ts | 4 +- packages/vant/src/sticky/README.md | 2 +- packages/vant/src/sticky/README.zh-CN.md | 2 +- packages/vant/src/sticky/Sticky.tsx | 19 +++-- packages/vant/src/sticky/index.ts | 2 +- packages/vant/src/submit-bar/README.md | 8 ++ packages/vant/src/submit-bar/README.zh-CN.md | 8 ++ packages/vant/src/submit-bar/SubmitBar.tsx | 43 ++++++---- packages/vant/src/swipe-cell/SwipeCell.tsx | 6 +- packages/vant/src/swipe/Swipe.tsx | 6 +- packages/vant/src/switch/README.md | 8 ++ packages/vant/src/switch/README.zh-CN.md | 8 ++ packages/vant/src/switch/Switch.tsx | 38 +++++---- packages/vant/src/switch/index.ts | 1 + packages/vant/src/tab/README.md | 2 +- packages/vant/src/tab/README.zh-CN.md | 2 +- packages/vant/src/tab/Tab.tsx | 25 +++--- packages/vant/src/tab/index.ts | 1 + packages/vant/src/tabbar-item/TabbarItem.tsx | 25 ++++-- packages/vant/src/tabbar-item/index.ts | 1 + packages/vant/src/tabbar/README.md | 8 ++ packages/vant/src/tabbar/README.zh-CN.md | 8 ++ packages/vant/src/tabbar/Tabbar.tsx | 8 +- packages/vant/src/tabbar/index.ts | 1 + packages/vant/src/tabs/Tabs.tsx | 6 +- packages/vant/src/tag/README.md | 8 ++ packages/vant/src/tag/README.zh-CN.md | 8 ++ packages/vant/src/tag/Tag.tsx | 35 +++++--- packages/vant/src/tag/index.ts | 1 + packages/vant/src/toast/README.md | 2 +- packages/vant/src/toast/README.zh-CN.md | 2 +- packages/vant/src/toast/Toast.tsx | 47 ++++++----- packages/vant/src/toast/index.ts | 1 + packages/vant/src/tree-select/README.md | 2 +- packages/vant/src/tree-select/README.zh-CN.md | 2 +- packages/vant/src/tree-select/TreeSelect.tsx | 32 ++++---- packages/vant/src/tree-select/index.ts | 6 +- packages/vant/src/uploader/Uploader.tsx | 6 +- 243 files changed, 1575 insertions(+), 904 deletions(-) create mode 100644 packages/vant/src/button/types.ts create mode 100644 packages/vant/src/coupon/utils.ts create mode 100644 packages/vant/src/popover/types.ts diff --git a/packages/vant/src/action-bar-button/ActionBarButton.tsx b/packages/vant/src/action-bar-button/ActionBarButton.tsx index f5bcdf920..fdcff9c48 100644 --- a/packages/vant/src/action-bar-button/ActionBarButton.tsx +++ b/packages/vant/src/action-bar-button/ActionBarButton.tsx @@ -1,4 +1,4 @@ -import { computed, PropType, defineComponent } from 'vue'; +import { computed, PropType, defineComponent, ExtractPropTypes } from 'vue'; import { extend, createNamespace } from '../utils'; import { ACTION_BAR_KEY } from '../action-bar/ActionBar'; @@ -12,17 +12,23 @@ import { Button, ButtonType } from '../button'; const [name, bem] = createNamespace('action-bar-button'); +const actionBarButtonProps = extend({}, routeProps, { + type: String as PropType, + text: String, + icon: String, + color: String, + loading: Boolean, + disabled: Boolean, +}); + +export type ActionBarButtonProps = ExtractPropTypes< + typeof actionBarButtonProps +>; + export default defineComponent({ name, - props: extend({}, routeProps, { - type: String as PropType, - text: String, - icon: String, - color: String, - loading: Boolean, - disabled: Boolean, - }), + props: actionBarButtonProps, setup(props, { slots }) { const route = useRoute(); diff --git a/packages/vant/src/action-bar-button/index.ts b/packages/vant/src/action-bar-button/index.ts index 9637fbc9b..28f2e20d0 100644 --- a/packages/vant/src/action-bar-button/index.ts +++ b/packages/vant/src/action-bar-button/index.ts @@ -3,3 +3,4 @@ import _ActionBarButton from './ActionBarButton'; export const ActionBarButton = withInstall(_ActionBarButton); export default ActionBarButton; +export type { ActionBarButtonProps } from './ActionBarButton'; diff --git a/packages/vant/src/action-bar-icon/ActionBarIcon.tsx b/packages/vant/src/action-bar-icon/ActionBarIcon.tsx index 198b4c818..ebe77b3b0 100644 --- a/packages/vant/src/action-bar-icon/ActionBarIcon.tsx +++ b/packages/vant/src/action-bar-icon/ActionBarIcon.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; import { extend, createNamespace, unknownProp, numericProp } from '../utils'; import { ACTION_BAR_KEY } from '../action-bar/ActionBar'; @@ -12,18 +12,22 @@ import { Badge } from '../badge'; const [name, bem] = createNamespace('action-bar-icon'); +const actionBarIconProps = extend({}, routeProps, { + dot: Boolean, + text: String, + icon: String, + color: String, + badge: numericProp, + iconClass: unknownProp, + iconPrefix: String, +}); + +export type ActionBarIconProps = ExtractPropTypes; + export default defineComponent({ name, - props: extend({}, routeProps, { - dot: Boolean, - text: String, - icon: String, - color: String, - badge: numericProp, - iconClass: unknownProp, - iconPrefix: String, - }), + props: actionBarIconProps, setup(props, { slots }) { const route = useRoute(); diff --git a/packages/vant/src/action-bar-icon/index.ts b/packages/vant/src/action-bar-icon/index.ts index 4fcade600..72ffb791d 100644 --- a/packages/vant/src/action-bar-icon/index.ts +++ b/packages/vant/src/action-bar-icon/index.ts @@ -3,3 +3,4 @@ import _ActionBarIcon from './ActionBarIcon'; export const ActionBarIcon = withInstall(_ActionBarIcon); export default ActionBarIcon; +export type { ActionBarIconProps } from './ActionBarIcon'; diff --git a/packages/vant/src/action-bar/ActionBar.tsx b/packages/vant/src/action-bar/ActionBar.tsx index 2e2c4fda3..427ce168b 100644 --- a/packages/vant/src/action-bar/ActionBar.tsx +++ b/packages/vant/src/action-bar/ActionBar.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; import { truthProp, createNamespace } from '../utils'; import { useChildren } from '@vant/use'; @@ -6,12 +6,16 @@ const [name, bem] = createNamespace('action-bar'); export const ACTION_BAR_KEY = Symbol(name); +const actionBarProps = { + safeAreaInsetBottom: truthProp, +}; + +export type ActionBarProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - safeAreaInsetBottom: truthProp, - }, + props: actionBarProps, setup(props, { slots }) { const { linkChildren } = useChildren(ACTION_BAR_KEY); diff --git a/packages/vant/src/action-bar/README.md b/packages/vant/src/action-bar/README.md index 1cf8a4e43..a90b0bad7 100644 --- a/packages/vant/src/action-bar/README.md +++ b/packages/vant/src/action-bar/README.md @@ -133,6 +133,18 @@ Use `badge` prop to show badge in icon. | ------- | -------------- | | default | Button content | +### Types + +The component exports the following type definitions: + +```ts +import type { + ActionBarProps, + ActionBarIconProps, + ActionBarButtonProps, +} from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/action-bar/README.zh-CN.md b/packages/vant/src/action-bar/README.zh-CN.md index 136cf27e7..b7c564c9d 100644 --- a/packages/vant/src/action-bar/README.zh-CN.md +++ b/packages/vant/src/action-bar/README.zh-CN.md @@ -137,6 +137,18 @@ export default { | ------- | ------------ | | default | 按钮显示内容 | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { + ActionBarProps, + ActionBarIconProps, + ActionBarButtonProps, +} from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/action-bar/index.ts b/packages/vant/src/action-bar/index.ts index e358d2730..dd652d2f2 100644 --- a/packages/vant/src/action-bar/index.ts +++ b/packages/vant/src/action-bar/index.ts @@ -3,3 +3,4 @@ import _ActionBar from './ActionBar'; export const ActionBar = withInstall(_ActionBar); export default ActionBar; +export type { ActionBarProps } from './ActionBar'; diff --git a/packages/vant/src/action-sheet/ActionSheet.tsx b/packages/vant/src/action-sheet/ActionSheet.tsx index 04a0b4c16..b2d7ae8dd 100644 --- a/packages/vant/src/action-sheet/ActionSheet.tsx +++ b/packages/vant/src/action-sheet/ActionSheet.tsx @@ -1,4 +1,4 @@ -import { nextTick, defineComponent } from 'vue'; +import { nextTick, defineComponent, ExtractPropTypes } from 'vue'; // Utils import { @@ -28,7 +28,22 @@ export type ActionSheetAction = { className?: unknown; }; -const popupKeys = [ +const actionSheetProps = extend({}, popupSharedProps, { + title: String, + round: truthProp, + actions: makeArrayProp(), + closeIcon: makeStringProp('cross'), + closeable: truthProp, + cancelText: String, + description: String, + closeOnPopstate: truthProp, + closeOnClickAction: Boolean, + safeAreaInsetBottom: truthProp, +}); + +export type ActionSheetProps = ExtractPropTypes; + +const popupInheritKeys = [ ...popupSharedPropKeys, 'round', 'closeOnPopstate', @@ -38,18 +53,7 @@ const popupKeys = [ export default defineComponent({ name, - props: extend({}, popupSharedProps, { - title: String, - round: truthProp, - actions: makeArrayProp(), - closeIcon: makeStringProp('cross'), - closeable: truthProp, - cancelText: String, - description: String, - closeOnPopstate: truthProp, - closeOnClickAction: Boolean, - safeAreaInsetBottom: truthProp, - }), + props: actionSheetProps, emits: ['select', 'cancel', 'update:show'], @@ -144,7 +148,7 @@ export default defineComponent({ class={bem()} position="bottom" onUpdate:show={updateShow} - {...pick(props, popupKeys)} + {...pick(props, popupInheritKeys)} > {renderHeader()} {renderDescription()} diff --git a/packages/vant/src/action-sheet/README.md b/packages/vant/src/action-sheet/README.md index eff93959f..6616ef43f 100644 --- a/packages/vant/src/action-sheet/README.md +++ b/packages/vant/src/action-sheet/README.md @@ -229,7 +229,7 @@ export default { The component exports the following type definitions: ```ts -import type { ActionSheetAction } from 'vant'; +import type { ActionSheetProps, ActionSheetAction } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/action-sheet/README.zh-CN.md b/packages/vant/src/action-sheet/README.zh-CN.md index 2442f28ee..9d06fa17d 100644 --- a/packages/vant/src/action-sheet/README.zh-CN.md +++ b/packages/vant/src/action-sheet/README.zh-CN.md @@ -241,7 +241,7 @@ export default { 组件导出以下类型定义： ```ts -import type { ActionSheetAction } from 'vant'; +import type { ActionSheetProps, ActionSheetAction } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/action-sheet/index.ts b/packages/vant/src/action-sheet/index.ts index 70db81753..b0c23fc69 100644 --- a/packages/vant/src/action-sheet/index.ts +++ b/packages/vant/src/action-sheet/index.ts @@ -3,4 +3,4 @@ import _ActionSheet from './ActionSheet'; export const ActionSheet = withInstall(_ActionSheet); export default ActionSheet; -export type { ActionSheetAction } from './ActionSheet'; +export type { ActionSheetProps, ActionSheetAction } from './ActionSheet'; diff --git a/packages/vant/src/address-edit/AddressEdit.tsx b/packages/vant/src/address-edit/AddressEdit.tsx index 4dc28bf1e..d6dcc3cac 100644 --- a/packages/vant/src/address-edit/AddressEdit.tsx +++ b/packages/vant/src/address-edit/AddressEdit.tsx @@ -54,7 +54,7 @@ const DEFAULT_DATA: AddressEditInfo = { const isPostal = (value: string) => /^\d{6}$/.test(value); -const props = { +const addressEditProps = { areaList: Object as PropType, isSaving: Boolean, isDeleting: Boolean, @@ -90,12 +90,12 @@ const props = { }, }; -export type AddressEditProps = ExtractPropTypes; +export type AddressEditProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: addressEditProps, emits: [ 'save', diff --git a/packages/vant/src/address-list/AddressList.tsx b/packages/vant/src/address-list/AddressList.tsx index 17eb0e121..f061fdf2d 100644 --- a/packages/vant/src/address-list/AddressList.tsx +++ b/packages/vant/src/address-list/AddressList.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; // Utils import { @@ -15,18 +15,22 @@ import AddressListItem, { AddressListAddress } from './AddressListItem'; const [name, bem, t] = createNamespace('address-list'); +const addressListProps = { + list: makeArrayProp(), + modelValue: numericProp, + switchable: truthProp, + disabledText: String, + disabledList: makeArrayProp(), + addButtonText: String, + defaultTagText: String, +}; + +export type AddressListProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - list: makeArrayProp(), - modelValue: numericProp, - switchable: truthProp, - disabledText: String, - disabledList: makeArrayProp(), - addButtonText: String, - defaultTagText: String, - }, + props: addressListProps, emits: [ 'add', diff --git a/packages/vant/src/address-list/README.md b/packages/vant/src/address-list/README.md index c0d11e3a6..2869abd90 100644 --- a/packages/vant/src/address-list/README.md +++ b/packages/vant/src/address-list/README.md @@ -126,7 +126,7 @@ export default { The component exports the following type definitions: ```ts -import type { AddressListAddress } from 'vant'; +import type { AddressListProps, AddressListAddress } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/address-list/README.zh-CN.md b/packages/vant/src/address-list/README.zh-CN.md index ddda935be..d1231309d 100644 --- a/packages/vant/src/address-list/README.zh-CN.md +++ b/packages/vant/src/address-list/README.zh-CN.md @@ -126,7 +126,7 @@ export default { 组件导出以下类型定义： ```ts -import type { AddressListAddress } from 'vant'; +import type { AddressListProps, AddressListAddress } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/address-list/index.ts b/packages/vant/src/address-list/index.ts index 59e33076f..a8b16aed4 100644 --- a/packages/vant/src/address-list/index.ts +++ b/packages/vant/src/address-list/index.ts @@ -3,4 +3,5 @@ import _AddressList from './AddressList'; export const AddressList = withInstall(_AddressList); export default AddressList; +export type { AddressListProps } from './AddressList'; export type { AddressListAddress } from './AddressListItem'; diff --git a/packages/vant/src/area/Area.tsx b/packages/vant/src/area/Area.tsx index 306ad76bd..c603676f3 100644 --- a/packages/vant/src/area/Area.tsx +++ b/packages/vant/src/area/Area.tsx @@ -19,7 +19,7 @@ import { makeNumericProp, createNamespace, } from '../utils'; -import { pickerProps } from '../picker/Picker'; +import { pickerSharedProps } from '../picker/Picker'; // Composables import { useExpose } from '../composables/use-expose'; @@ -54,7 +54,7 @@ const INHERIT_PROPS = [ const isOverseaCode = (code: string) => code[0] === '9'; -const props = extend({}, pickerProps, { +const areaProps = extend({}, pickerSharedProps, { value: String, columnsNum: makeNumericProp(3), columnsPlaceholder: makeArrayProp(), @@ -68,12 +68,12 @@ const props = extend({}, pickerProps, { }, }); -export type AreaProps = ExtractPropTypes; +export type AreaProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: areaProps, emits: ['change', 'confirm', 'cancel'], diff --git a/packages/vant/src/area/index.ts b/packages/vant/src/area/index.ts index 69ea4d360..a1d3f4cdb 100644 --- a/packages/vant/src/area/index.ts +++ b/packages/vant/src/area/index.ts @@ -1,7 +1,7 @@ import { withInstall } from '../utils'; -import _Area, { AreaProps } from './Area'; +import _Area from './Area'; export const Area = withInstall(_Area); export default Area; -export type { AreaProps }; +export type { AreaProps } from './Area'; export type { AreaList, AreaInstance, AreaColumnOption } from './types'; diff --git a/packages/vant/src/badge/Badge.tsx b/packages/vant/src/badge/Badge.tsx index f289569d7..95d087869 100644 --- a/packages/vant/src/badge/Badge.tsx +++ b/packages/vant/src/badge/Badge.tsx @@ -1,4 +1,10 @@ -import { PropType, CSSProperties, defineComponent, computed } from 'vue'; +import { + computed, + PropType, + CSSProperties, + defineComponent, + ExtractPropTypes, +} from 'vue'; import { isDef, addUnit, @@ -11,18 +17,22 @@ import { const [name, bem] = createNamespace('badge'); +const badgeProps = { + dot: Boolean, + max: numericProp, + tag: makeStringProp('div'), + color: String, + offset: Array as unknown as PropType<[string | number, string | number]>, + content: numericProp, + showZero: truthProp, +}; + +export type BadgeProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - dot: Boolean, - max: numericProp, - tag: makeStringProp('div'), - color: String, - offset: Array as unknown as PropType<[string | number, string | number]>, - content: numericProp, - showZero: truthProp, - }, + props: badgeProps, setup(props, { slots }) { const hasContent = () => { diff --git a/packages/vant/src/badge/README.md b/packages/vant/src/badge/README.md index 7d1feba38..f6a5c19c0 100644 --- a/packages/vant/src/badge/README.md +++ b/packages/vant/src/badge/README.md @@ -133,6 +133,14 @@ Use `content` slot to custom :content of badge. | default | Default slot | | content | Custom badge content | +### Types + +The component exports the following type definitions: + +```ts +import type { BadgeProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/badge/README.zh-CN.md b/packages/vant/src/badge/README.zh-CN.md index b2ab29a95..9b21a0069 100644 --- a/packages/vant/src/badge/README.zh-CN.md +++ b/packages/vant/src/badge/README.zh-CN.md @@ -141,6 +141,14 @@ app.use(Badge); | default | 徽标包裹的子元素 | | content | 自定义徽标内容 | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { BadgeProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/badge/index.ts b/packages/vant/src/badge/index.ts index bb87fb058..b8590dca0 100644 --- a/packages/vant/src/badge/index.ts +++ b/packages/vant/src/badge/index.ts @@ -3,3 +3,4 @@ import _Badge from './Badge'; export const Badge = withInstall(_Badge); export default Badge; +export type { BadgeProps } from './Badge'; diff --git a/packages/vant/src/button/Button.tsx b/packages/vant/src/button/Button.tsx index 8dac97ba2..1a86daf8f 100644 --- a/packages/vant/src/button/Button.tsx +++ b/packages/vant/src/button/Button.tsx @@ -2,7 +2,7 @@ import { PropType, CSSProperties, defineComponent, - ButtonHTMLAttributes, + ExtractPropTypes, } from 'vue'; // Utils @@ -19,45 +19,44 @@ import { useRoute, routeProps } from '../composables/use-route'; import { Icon } from '../icon'; import { Loading, LoadingType } from '../loading'; +// Types +import { + ButtonSize, + ButtonType, + ButtonNativeType, + ButtonIconPosition, +} from './types'; + const [name, bem] = createNamespace('button'); -export type ButtonType = - | 'default' - | 'primary' - | 'success' - | 'warning' - | 'danger'; +const buttonProps = extend({}, routeProps, { + tag: makeStringProp('button'), + text: String, + icon: String, + type: makeStringProp('default'), + size: makeStringProp('normal'), + color: String, + block: Boolean, + plain: Boolean, + round: Boolean, + square: Boolean, + loading: Boolean, + hairline: Boolean, + disabled: Boolean, + iconPrefix: String, + nativeType: makeStringProp('button'), + loadingSize: numericProp, + loadingText: String, + loadingType: String as PropType, + iconPosition: makeStringProp('left'), +}); -export type ButtonSize = 'large' | 'normal' | 'small' | 'mini'; - -export type ButtonNativeType = NonNullable; - -export type ButtonIconPosition = 'left' | 'right'; +export type ButtonProps = ExtractPropTypes; export default defineComponent({ name, - props: extend({}, routeProps, { - tag: makeStringProp('button'), - text: String, - icon: String, - type: makeStringProp('default'), - size: makeStringProp('normal'), - color: String, - block: Boolean, - plain: Boolean, - round: Boolean, - square: Boolean, - loading: Boolean, - hairline: Boolean, - disabled: Boolean, - iconPrefix: String, - nativeType: makeStringProp('button'), - loadingSize: numericProp, - loadingText: String, - loadingType: String as PropType, - iconPosition: makeStringProp('left'), - }), + props: buttonProps, emits: ['click'], diff --git a/packages/vant/src/button/README.md b/packages/vant/src/button/README.md index 1c81fe62f..abaa07a50 100644 --- a/packages/vant/src/button/README.md +++ b/packages/vant/src/button/README.md @@ -157,6 +157,7 @@ The component exports the following type definitions: import type { ButtonType, ButtonSize, + ButtonProps, ButtonNativeType, ButtonIconPosition, } from 'vant'; diff --git a/packages/vant/src/button/README.zh-CN.md b/packages/vant/src/button/README.zh-CN.md index c8349b463..eea6b3faa 100644 --- a/packages/vant/src/button/README.zh-CN.md +++ b/packages/vant/src/button/README.zh-CN.md @@ -180,6 +180,7 @@ app.use(Button); import type { ButtonType, ButtonSize, + ButtonProps, ButtonNativeType, ButtonIconPosition, } from 'vant'; diff --git a/packages/vant/src/button/index.ts b/packages/vant/src/button/index.ts index 02ebe4982..9f9dbd5e0 100644 --- a/packages/vant/src/button/index.ts +++ b/packages/vant/src/button/index.ts @@ -3,9 +3,10 @@ import _Button from './Button'; export const Button = withInstall(_Button); export default Button; +export type { ButtonProps } from './Button'; export type { ButtonType, ButtonSize, ButtonNativeType, ButtonIconPosition, -} from './Button'; +} from './types'; diff --git a/packages/vant/src/button/types.ts b/packages/vant/src/button/types.ts new file mode 100644 index 000000000..8dffe2b91 --- /dev/null +++ b/packages/vant/src/button/types.ts @@ -0,0 +1,14 @@ +import type { ButtonHTMLAttributes } from 'vue'; + +export type ButtonType = + | 'default' + | 'primary' + | 'success' + | 'warning' + | 'danger'; + +export type ButtonSize = 'large' | 'normal' | 'small' | 'mini'; + +export type ButtonNativeType = NonNullable; + +export type ButtonIconPosition = 'left' | 'right'; diff --git a/packages/vant/src/calendar/Calendar.tsx b/packages/vant/src/calendar/Calendar.tsx index 6f6dd0913..0e260ac3b 100644 --- a/packages/vant/src/calendar/Calendar.tsx +++ b/packages/vant/src/calendar/Calendar.tsx @@ -53,7 +53,7 @@ import type { CalendarMonthInstance, } from './types'; -const props = { +const calendarProps = { show: Boolean, type: makeStringProp('single'), title: String, @@ -100,12 +100,12 @@ const props = { }, }; -export type CalendarProps = ExtractPropTypes; +export type CalendarProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: calendarProps, emits: [ 'select', diff --git a/packages/vant/src/calendar/CalendarMonth.tsx b/packages/vant/src/calendar/CalendarMonth.tsx index f8dc243f9..923031af1 100644 --- a/packages/vant/src/calendar/CalendarMonth.tsx +++ b/packages/vant/src/calendar/CalendarMonth.tsx @@ -38,7 +38,7 @@ import type { CalendarType, CalendarDayItem, CalendarDayType } from './types'; const [name] = createNamespace('calendar-month'); -const props = { +const calendarMonthProps = { date: makeRequiredProp(Date), type: String as PropType, color: String, @@ -55,12 +55,12 @@ const props = { firstDayOfWeek: Number, }; -export type CalendarMonthProps = ExtractPropTypes; +export type CalendarMonthProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: calendarMonthProps, emits: ['click', 'update-height'], diff --git a/packages/vant/src/calendar/index.ts b/packages/vant/src/calendar/index.ts index b098ffac3..aa8d21784 100644 --- a/packages/vant/src/calendar/index.ts +++ b/packages/vant/src/calendar/index.ts @@ -1,9 +1,9 @@ import { withInstall } from '../utils'; -import _Calendar, { CalendarProps } from './Calendar'; +import _Calendar from './Calendar'; export const Calendar = withInstall(_Calendar); export default Calendar; -export type { CalendarProps }; +export type { CalendarProps } from './Calendar'; export type { CalendarType, CalendarDayItem, diff --git a/packages/vant/src/card/Card.tsx b/packages/vant/src/card/Card.tsx index cf97059fc..3a62ec720 100644 --- a/packages/vant/src/card/Card.tsx +++ b/packages/vant/src/card/Card.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; // Utils import { isDef, numericProp, makeStringProp, createNamespace } from '../utils'; @@ -9,22 +9,26 @@ import { Image } from '../image'; const [name, bem] = createNamespace('card'); +const cardProps = { + tag: String, + num: numericProp, + desc: String, + thumb: String, + title: String, + price: numericProp, + centered: Boolean, + lazyLoad: Boolean, + currency: makeStringProp('¥'), + thumbLink: String, + originPrice: numericProp, +}; + +export type CardProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - tag: String, - num: numericProp, - desc: String, - thumb: String, - title: String, - price: numericProp, - centered: Boolean, - lazyLoad: Boolean, - currency: makeStringProp('¥'), - thumbLink: String, - originPrice: numericProp, - }, + props: cardProps, emits: ['click-thumb'], diff --git a/packages/vant/src/card/README.md b/packages/vant/src/card/README.md index 8e1c8b27c..f7eed7dcf 100644 --- a/packages/vant/src/card/README.md +++ b/packages/vant/src/card/README.md @@ -108,6 +108,14 @@ Use slot to custom content. | tags | Custom tags | | footer | Custom footer | +### Types + +The component exports the following type definitions: + +```ts +import type { CardProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/card/README.zh-CN.md b/packages/vant/src/card/README.zh-CN.md index 2fada4c1d..9ba8c9ab9 100644 --- a/packages/vant/src/card/README.zh-CN.md +++ b/packages/vant/src/card/README.zh-CN.md @@ -110,6 +110,14 @@ app.use(Card); | tags | 自定义描述下方标签区域 | | footer | 自定义右下角内容 | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { CardProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/card/index.ts b/packages/vant/src/card/index.ts index 083e93dd2..2fa3b1435 100644 --- a/packages/vant/src/card/index.ts +++ b/packages/vant/src/card/index.ts @@ -3,3 +3,4 @@ import _Card from './Card'; export const Card = withInstall(_Card); export default Card; +export type { CardProps } from './Card'; diff --git a/packages/vant/src/cascader/Cascader.tsx b/packages/vant/src/cascader/Cascader.tsx index 25833afcd..fe62dfe5b 100644 --- a/packages/vant/src/cascader/Cascader.tsx +++ b/packages/vant/src/cascader/Cascader.tsx @@ -26,7 +26,7 @@ import type { CascaderTab, CascaderOption, CascaderFieldNames } from './types'; const [name, bem, t] = createNamespace('cascader'); -const props = { +const cascaderProps = { title: String, options: makeArrayProp(), closeable: truthProp, @@ -38,12 +38,12 @@ const props = { activeColor: String, }; -export type CascaderProps = ExtractPropTypes; +export type CascaderProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: cascaderProps, emits: ['close', 'change', 'finish', 'click-tab', 'update:modelValue'], diff --git a/packages/vant/src/cascader/index.ts b/packages/vant/src/cascader/index.ts index 2e45e910c..96de75aeb 100644 --- a/packages/vant/src/cascader/index.ts +++ b/packages/vant/src/cascader/index.ts @@ -1,7 +1,7 @@ import { withInstall } from '../utils'; -import _Cascader, { CascaderProps } from './Cascader'; +import _Cascader from './Cascader'; export const Cascader = withInstall(_Cascader); export default Cascader; -export type { CascaderProps }; +export type { CascaderProps } from './Cascader'; export type { CascaderOption, CascaderFieldNames } from './types'; diff --git a/packages/vant/src/cell-group/CellGroup.tsx b/packages/vant/src/cell-group/CellGroup.tsx index 0d3ad1a8a..5d1ca757e 100644 --- a/packages/vant/src/cell-group/CellGroup.tsx +++ b/packages/vant/src/cell-group/CellGroup.tsx @@ -1,18 +1,22 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; import { truthProp, createNamespace, BORDER_TOP_BOTTOM } from '../utils'; const [name, bem] = createNamespace('cell-group'); +const cellGroupProps = { + title: String, + inset: Boolean, + border: truthProp, +}; + +export type CellGroupProps = ExtractPropTypes; + export default defineComponent({ name, inheritAttrs: false, - props: { - title: String, - inset: Boolean, - border: truthProp, - }, + props: cellGroupProps, setup(props, { slots, attrs }) { const renderGroup = () => ( diff --git a/packages/vant/src/cell-group/index.ts b/packages/vant/src/cell-group/index.ts index 11f41cdd4..61b4751ca 100644 --- a/packages/vant/src/cell-group/index.ts +++ b/packages/vant/src/cell-group/index.ts @@ -3,3 +3,4 @@ import _CellGroup from './CellGroup'; export const CellGroup = withInstall(_CellGroup); export default CellGroup; +export type { CellGroupProps } from './CellGroup'; diff --git a/packages/vant/src/cell/Cell.tsx b/packages/vant/src/cell/Cell.tsx index 26451bf2f..5667c2732 100644 --- a/packages/vant/src/cell/Cell.tsx +++ b/packages/vant/src/cell/Cell.tsx @@ -1,4 +1,9 @@ -import { PropType, CSSProperties, defineComponent } from 'vue'; +import { + PropType, + CSSProperties, + defineComponent, + ExtractPropTypes, +} from 'vue'; // Utils import { @@ -20,7 +25,7 @@ const [name, bem] = createNamespace('cell'); export type CellArrowDirection = 'up' | 'down' | 'left' | 'right'; -export const cellProps = { +export const cellSharedProps = { icon: String, size: String as PropType<'large'>, title: numericProp, @@ -42,10 +47,14 @@ export const cellProps = { }, }; +const cellProps = extend({}, cellSharedProps, routeProps); + +export type CellProps = ExtractPropTypes; + export default defineComponent({ name, - props: extend({}, cellProps, routeProps), + props: cellProps, setup(props, { slots }) { if (process.env.NODE_ENV !== 'production') { diff --git a/packages/vant/src/cell/README.md b/packages/vant/src/cell/README.md index dc5efcd0c..802cbc52e 100644 --- a/packages/vant/src/cell/README.md +++ b/packages/vant/src/cell/README.md @@ -197,7 +197,7 @@ app.use(CellGroup); The component exports the following type definitions: ```ts -import type { CellArrowDirection } from 'vant'; +import type { CellProps, CellGroupProps, CellArrowDirection } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/cell/README.zh-CN.md b/packages/vant/src/cell/README.zh-CN.md index dadd7509c..37746a8d6 100644 --- a/packages/vant/src/cell/README.zh-CN.md +++ b/packages/vant/src/cell/README.zh-CN.md @@ -202,7 +202,7 @@ app.use(CellGroup); 组件导出以下类型定义： ```ts -import type { CellArrowDirection } from 'vant'; +import type { CellProps, CellGroupProps, CellArrowDirection } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/cell/index.ts b/packages/vant/src/cell/index.ts index 06aaca0f8..83a830f34 100644 --- a/packages/vant/src/cell/index.ts +++ b/packages/vant/src/cell/index.ts @@ -3,4 +3,4 @@ import _Cell from './Cell'; export const Cell = withInstall(_Cell); export default Cell; -export type { CellArrowDirection } from './Cell'; +export type { CellProps, CellArrowDirection } from './Cell'; diff --git a/packages/vant/src/checkbox-group/CheckboxGroup.tsx b/packages/vant/src/checkbox-group/CheckboxGroup.tsx index b2f4795a9..14f6a56c0 100644 --- a/packages/vant/src/checkbox-group/CheckboxGroup.tsx +++ b/packages/vant/src/checkbox-group/CheckboxGroup.tsx @@ -23,7 +23,7 @@ import type { const [name, bem] = createNamespace('checkbox-group'); -const props = { +const checkboxGroupProps = { max: numericProp, disabled: Boolean, iconSize: numericProp, @@ -32,7 +32,7 @@ const props = { checkedColor: String, }; -export type CheckboxGroupProps = ExtractPropTypes; +export type CheckboxGroupProps = ExtractPropTypes; export const CHECKBOX_GROUP_KEY: InjectionKey = Symbol(name); @@ -40,7 +40,7 @@ export const CHECKBOX_GROUP_KEY: InjectionKey = export default defineComponent({ name, - props, + props: checkboxGroupProps, emits: ['change', 'update:modelValue'], diff --git a/packages/vant/src/checkbox-group/index.ts b/packages/vant/src/checkbox-group/index.ts index 02c1881f4..41d083cf9 100644 --- a/packages/vant/src/checkbox-group/index.ts +++ b/packages/vant/src/checkbox-group/index.ts @@ -1,9 +1,9 @@ import { withInstall } from '../utils'; -import _CheckboxGroup, { CheckboxGroupProps } from './CheckboxGroup'; +import _CheckboxGroup from './CheckboxGroup'; export const CheckboxGroup = withInstall(_CheckboxGroup); export default CheckboxGroup; -export type { CheckboxGroupProps }; +export type { CheckboxGroupProps } from './CheckboxGroup'; export type { CheckboxGroupInstance, CheckboxGroupDirection, diff --git a/packages/vant/src/checkbox/Checkbox.tsx b/packages/vant/src/checkbox/Checkbox.tsx index 8812347da..e65943709 100644 --- a/packages/vant/src/checkbox/Checkbox.tsx +++ b/packages/vant/src/checkbox/Checkbox.tsx @@ -16,16 +16,16 @@ import type { CheckboxExpose } from './types'; const [name, bem] = createNamespace('checkbox'); -const props = extend({}, checkerProps, { +const checkboxProps = extend({}, checkerProps, { bindGroup: truthProp, }); -export type CheckboxProps = ExtractPropTypes; +export type CheckboxProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: checkboxProps, emits: ['change', 'update:modelValue'], diff --git a/packages/vant/src/checkbox/index.ts b/packages/vant/src/checkbox/index.ts index 63d13838e..960782234 100644 --- a/packages/vant/src/checkbox/index.ts +++ b/packages/vant/src/checkbox/index.ts @@ -1,9 +1,9 @@ import { withInstall } from '../utils'; -import _Checkbox, { CheckboxProps } from './Checkbox'; +import _Checkbox from './Checkbox'; export const Checkbox = withInstall(_Checkbox); export default Checkbox; -export type { CheckboxProps }; +export type { CheckboxProps } from './Checkbox'; export type { CheckboxShape, CheckboxInstance, diff --git a/packages/vant/src/circle/Circle.tsx b/packages/vant/src/circle/Circle.tsx index abe46473b..dfcb6e1bb 100644 --- a/packages/vant/src/circle/Circle.tsx +++ b/packages/vant/src/circle/Circle.tsx @@ -1,4 +1,11 @@ -import { watch, computed, PropType, CSSProperties, defineComponent } from 'vue'; +import { + watch, + computed, + PropType, + CSSProperties, + defineComponent, + ExtractPropTypes, +} from 'vue'; import { raf, cancelRaf } from '@vant/use'; import { isObject, @@ -26,23 +33,27 @@ function getPath(clockwise: boolean, viewBoxSize: number) { export type CircleStartPosition = 'top' | 'right' | 'bottom' | 'left'; +const circleProps = { + text: String, + size: numericProp, + fill: makeStringProp('none'), + rate: makeNumericProp(100), + speed: makeNumericProp(0), + color: [String, Object] as PropType>, + clockwise: truthProp, + layerColor: String, + currentRate: makeNumberProp(0), + strokeWidth: makeNumericProp(40), + strokeLinecap: String as PropType, + startPosition: makeStringProp('top'), +}; + +export type CircleProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - text: String, - size: numericProp, - fill: makeStringProp('none'), - rate: makeNumericProp(100), - speed: makeNumericProp(0), - color: [String, Object] as PropType>, - clockwise: truthProp, - layerColor: String, - currentRate: makeNumberProp(0), - strokeWidth: makeNumericProp(40), - strokeLinecap: String as PropType, - startPosition: makeStringProp('top'), - }, + props: circleProps, emits: ['update:currentRate'], diff --git a/packages/vant/src/circle/README.md b/packages/vant/src/circle/README.md index 30d56f089..85bb3bc79 100644 --- a/packages/vant/src/circle/README.md +++ b/packages/vant/src/circle/README.md @@ -172,7 +172,7 @@ export default { The component exports the following type definitions: ```ts -import type { CircleStartPosition } from 'vant'; +import type { CircleProps, CircleStartPosition } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/circle/README.zh-CN.md b/packages/vant/src/circle/README.zh-CN.md index c20d794e6..a47a344a2 100644 --- a/packages/vant/src/circle/README.zh-CN.md +++ b/packages/vant/src/circle/README.zh-CN.md @@ -186,7 +186,7 @@ export default { 组件导出以下类型定义： ```ts -import type { CircleStartPosition } from 'vant'; +import type { CircleProps, CircleStartPosition } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/circle/index.ts b/packages/vant/src/circle/index.ts index ccd48099b..cd20f4561 100644 --- a/packages/vant/src/circle/index.ts +++ b/packages/vant/src/circle/index.ts @@ -3,4 +3,4 @@ import _Circle from './Circle'; export const Circle = withInstall(_Circle); export default Circle; -export type { CircleStartPosition } from './Circle'; +export type { CircleProps, CircleStartPosition } from './Circle'; diff --git a/packages/vant/src/col/Col.tsx b/packages/vant/src/col/Col.tsx index 08846d64b..e4c300eba 100644 --- a/packages/vant/src/col/Col.tsx +++ b/packages/vant/src/col/Col.tsx @@ -1,4 +1,4 @@ -import { computed, defineComponent } from 'vue'; +import { computed, defineComponent, ExtractPropTypes } from 'vue'; import { numericProp, createNamespace, @@ -10,14 +10,18 @@ import { ROW_KEY } from '../row/Row'; const [name, bem] = createNamespace('col'); +const colProps = { + tag: makeStringProp('div'), + span: makeNumericProp(0), + offset: numericProp, +}; + +export type ColProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - tag: makeStringProp('div'), - span: makeNumericProp(0), - offset: numericProp, - }, + props: colProps, setup(props, { slots }) { const { parent, index } = useParent(ROW_KEY); diff --git a/packages/vant/src/col/README.md b/packages/vant/src/col/README.md index 8f0e68e0f..1dbe129bf 100644 --- a/packages/vant/src/col/README.md +++ b/packages/vant/src/col/README.md @@ -118,5 +118,5 @@ Set grid spacing using `gutter` attribute. The default value is 0. The component exports the following type definitions: ```ts -import type { RowAlign, RowJustify } from 'vant'; +import type { ColProps, RowProps, RowAlign, RowJustify } from 'vant'; ``` diff --git a/packages/vant/src/col/README.zh-CN.md b/packages/vant/src/col/README.zh-CN.md index e102e5985..5153ed2bc 100644 --- a/packages/vant/src/col/README.zh-CN.md +++ b/packages/vant/src/col/README.zh-CN.md @@ -123,5 +123,5 @@ Layout 组件提供了 `24列栅格`，通过在 `Col` 上添加 `span` 属性 组件导出以下类型定义： ```ts -import type { RowAlign, RowJustify } from 'vant'; +import type { ColProps, RowProps, RowAlign, RowJustify } from 'vant'; ``` diff --git a/packages/vant/src/col/index.ts b/packages/vant/src/col/index.ts index d2e575434..b5013cc59 100644 --- a/packages/vant/src/col/index.ts +++ b/packages/vant/src/col/index.ts @@ -3,3 +3,4 @@ import _Col from './Col'; export const Col = withInstall(_Col); export default Col; +export type { ColProps } from './Col'; diff --git a/packages/vant/src/collapse-item/CollapseItem.tsx b/packages/vant/src/collapse-item/CollapseItem.tsx index e89954463..eb74ebaec 100644 --- a/packages/vant/src/collapse-item/CollapseItem.tsx +++ b/packages/vant/src/collapse-item/CollapseItem.tsx @@ -8,7 +8,7 @@ import { } from 'vue'; // Utils -import { cellProps } from '../cell/Cell'; +import { cellSharedProps } from '../cell/Cell'; import { pick, extend, @@ -30,19 +30,19 @@ const [name, bem] = createNamespace('collapse-item'); const CELL_SLOTS = ['icon', 'title', 'value', 'label', 'right-icon'] as const; -const props = extend({}, cellProps, { +const collapseItemProps = extend({}, cellSharedProps, { name: numericProp, isLink: truthProp, disabled: Boolean, readonly: Boolean, }); -export type CollapseItemProps = ExtractPropTypes; +export type CollapseItemProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: collapseItemProps, setup(props, { slots }) { const wrapperRef = ref(); @@ -121,7 +121,7 @@ export default defineComponent({ const { border, disabled, readonly } = props; const attrs = pick( props, - Object.keys(cellProps) as Array + Object.keys(cellSharedProps) as Array ); if (readonly) { diff --git a/packages/vant/src/collapse-item/index.ts b/packages/vant/src/collapse-item/index.ts index 660eac0a7..c1dcc6c83 100644 --- a/packages/vant/src/collapse-item/index.ts +++ b/packages/vant/src/collapse-item/index.ts @@ -1,7 +1,7 @@ import { withInstall } from '../utils'; -import _CollapseItem, { CollapseItemProps } from './CollapseItem'; +import _CollapseItem from './CollapseItem'; export const CollapseItem = withInstall(_CollapseItem); export default CollapseItem; -export type { CollapseItemProps }; +export type { CollapseItemProps } from './CollapseItem'; export type { CollapseItemInstance } from './types'; diff --git a/packages/vant/src/collapse/Collapse.tsx b/packages/vant/src/collapse/Collapse.tsx index cb1fa7459..e01d0cf35 100644 --- a/packages/vant/src/collapse/Collapse.tsx +++ b/packages/vant/src/collapse/Collapse.tsx @@ -1,4 +1,4 @@ -import { PropType, defineComponent, InjectionKey } from 'vue'; +import { PropType, defineComponent, InjectionKey, ExtractPropTypes } from 'vue'; import { truthProp, createNamespace, BORDER_TOP_BOTTOM } from '../utils'; import { useChildren } from '@vant/use'; @@ -11,6 +11,19 @@ export type CollapseProvide = { export const COLLAPSE_KEY: InjectionKey = Symbol(name); +const collapseProps = { + border: truthProp, + accordion: Boolean, + modelValue: { + type: [String, Number, Array] as PropType< + string | number | Array + >, + default: '', + }, +}; + +export type CollapseProps = ExtractPropTypes; + function validateModelValue( modelValue: string | number | Array, accordion: boolean @@ -33,16 +46,7 @@ function validateModelValue( export default defineComponent({ name, - props: { - border: truthProp, - accordion: Boolean, - modelValue: { - type: [String, Number, Array] as PropType< - string | number | Array - >, - default: '', - }, - }, + props: collapseProps, emits: ['change', 'update:modelValue'], diff --git a/packages/vant/src/collapse/README.md b/packages/vant/src/collapse/README.md index 295ce412b..1bc57e88d 100644 --- a/packages/vant/src/collapse/README.md +++ b/packages/vant/src/collapse/README.md @@ -155,7 +155,11 @@ Use [ref](https://v3.vuejs.org/guide/component-template-refs.html) to get Collap The component exports the following type definitions: ```ts -import type { CollapseItemProps, CollapseItemInstance } from 'vant'; +import type { + CollapseProps, + CollapseItemProps, + CollapseItemInstance, +} from 'vant'; ``` `CollapseItemInstance` is the type of component instance: diff --git a/packages/vant/src/collapse/README.zh-CN.md b/packages/vant/src/collapse/README.zh-CN.md index 538b01356..83caac695 100644 --- a/packages/vant/src/collapse/README.zh-CN.md +++ b/packages/vant/src/collapse/README.zh-CN.md @@ -153,7 +153,11 @@ export default { 组件导出以下类型定义： ```ts -import type { CollapseItemProps, CollapseItemInstance } from 'vant'; +import type { + CollapseProps, + CollapseItemProps, + CollapseItemInstance, +} from 'vant'; ``` `CollapseItemInstance` 是组件实例的类型，用法如下： diff --git a/packages/vant/src/collapse/index.ts b/packages/vant/src/collapse/index.ts index 61e73c551..860da4b0d 100644 --- a/packages/vant/src/collapse/index.ts +++ b/packages/vant/src/collapse/index.ts @@ -3,3 +3,4 @@ import _Collapse from './Collapse'; export const Collapse = withInstall(_Collapse); export default Collapse; +export type { CollapseProps } from './Collapse'; diff --git a/packages/vant/src/config-provider/ConfigProvider.tsx b/packages/vant/src/config-provider/ConfigProvider.tsx index 1d381effd..d8e31b590 100644 --- a/packages/vant/src/config-provider/ConfigProvider.tsx +++ b/packages/vant/src/config-provider/ConfigProvider.tsx @@ -5,6 +5,7 @@ import { InjectionKey, CSSProperties, defineComponent, + ExtractPropTypes, } from 'vue'; import { kebabCase, makeStringProp, createNamespace } from '../utils'; @@ -17,6 +18,14 @@ export type ConfigProviderProvide = { export const CONFIG_PROVIDER_KEY: InjectionKey = Symbol(name); +const configProviderProps = { + tag: makeStringProp('div'), + themeVars: Object as PropType>, + iconPrefix: String, +}; + +export type ConfigProviderProps = ExtractPropTypes; + function mapThemeVarsToCSSVars(themeVars: Record) { const cssVars: Record = {}; Object.keys(themeVars).forEach((key) => { @@ -28,11 +37,7 @@ function mapThemeVarsToCSSVars(themeVars: Record) { export default defineComponent({ name, - props: { - tag: makeStringProp('div'), - themeVars: Object as PropType>, - iconPrefix: String, - }, + props: configProviderProps, setup(props, { slots }) { const style = computed(() => { diff --git a/packages/vant/src/config-provider/README.md b/packages/vant/src/config-provider/README.md index 3560871c8..5c613591e 100644 --- a/packages/vant/src/config-provider/README.md +++ b/packages/vant/src/config-provider/README.md @@ -211,3 +211,11 @@ There are all **Basic Variables** below, for component CSS Variables, please ref | theme-vars | Theme variables | _object_ | - | | tag `v3.1.2` | HTML Tag of root element | _string_ | `div` | | icon-prefix `v3.1.3` | Icon className prefix | _string_ | `van-icon` | + +### Types + +The component exports the following type definitions: + +```ts +import type { ConfigProviderProps } from 'vant'; +``` diff --git a/packages/vant/src/config-provider/README.zh-CN.md b/packages/vant/src/config-provider/README.zh-CN.md index 5763f88f7..daefe66cf 100644 --- a/packages/vant/src/config-provider/README.zh-CN.md +++ b/packages/vant/src/config-provider/README.zh-CN.md @@ -215,3 +215,11 @@ Vant 中的 CSS 变量分为 **基础变量** 和 **组件变量**。组件变 | theme-vars | 自定义主题变量 | _object_ | - | | tag `v3.1.2` | 根节点对应的 HTML 标签名 | _string_ | `div` | | icon-prefix `v3.1.3` | 所有图标的类名前缀，等同于 Icon 组件的 [class-prefix 属性](#/zh-CN/icon#props) | _string_ | `van-icon` | + +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { ConfigProviderProps } from 'vant'; +``` diff --git a/packages/vant/src/config-provider/index.ts b/packages/vant/src/config-provider/index.ts index 25e772174..1c1748748 100644 --- a/packages/vant/src/config-provider/index.ts +++ b/packages/vant/src/config-provider/index.ts @@ -3,3 +3,4 @@ import _ConfigProvider from './ConfigProvider'; export const ConfigProvider = withInstall(_ConfigProvider); export default ConfigProvider; +export type { ConfigProviderProps } from './ConfigProvider'; diff --git a/packages/vant/src/contact-card/ContactCard.tsx b/packages/vant/src/contact-card/ContactCard.tsx index 52e59c2f0..aab2e4028 100644 --- a/packages/vant/src/contact-card/ContactCard.tsx +++ b/packages/vant/src/contact-card/ContactCard.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; import { truthProp, makeStringProp, createNamespace } from '../utils'; import { Cell } from '../cell'; @@ -6,16 +6,20 @@ const [name, bem, t] = createNamespace('contact-card'); export type ContactCardType = 'add' | 'edit'; +const contactCardProps = { + tel: String, + name: String, + type: makeStringProp('add'), + addText: String, + editable: truthProp, +}; + +export type ContactCardProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - tel: String, - name: String, - type: makeStringProp('add'), - addText: String, - editable: truthProp, - }, + props: contactCardProps, emits: ['click'], diff --git a/packages/vant/src/contact-card/README.md b/packages/vant/src/contact-card/README.md index 0138194fd..3912c0c32 100644 --- a/packages/vant/src/contact-card/README.md +++ b/packages/vant/src/contact-card/README.md @@ -95,7 +95,7 @@ export default { The component exports the following type definitions: ```ts -import type { ContactCardType } from 'vant'; +import type { ContactCardType, ContactCardProps } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/contact-card/README.zh-CN.md b/packages/vant/src/contact-card/README.zh-CN.md index 1163cbc40..91cade7ca 100644 --- a/packages/vant/src/contact-card/README.zh-CN.md +++ b/packages/vant/src/contact-card/README.zh-CN.md @@ -89,7 +89,7 @@ export default { 组件导出以下类型定义： ```ts -import type { ContactCardType } from 'vant'; +import type { ContactCardType, ContactCardProps } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/contact-card/index.ts b/packages/vant/src/contact-card/index.ts index 357b53ffe..3487b04e2 100644 --- a/packages/vant/src/contact-card/index.ts +++ b/packages/vant/src/contact-card/index.ts @@ -3,4 +3,4 @@ import _ContactCard from './ContactCard'; export const ContactCard = withInstall(_ContactCard); export default ContactCard; -export type { ContactCardType } from './ContactCard'; +export type { ContactCardType, ContactCardProps } from './ContactCard'; diff --git a/packages/vant/src/contact-edit/ContactEdit.tsx b/packages/vant/src/contact-edit/ContactEdit.tsx index 6639c7aeb..8baa9fb72 100644 --- a/packages/vant/src/contact-edit/ContactEdit.tsx +++ b/packages/vant/src/contact-edit/ContactEdit.tsx @@ -1,4 +1,10 @@ -import { watch, reactive, PropType, defineComponent } from 'vue'; +import { + watch, + reactive, + PropType, + defineComponent, + ExtractPropTypes, +} from 'vue'; // Utils import { isMobile, createNamespace, extend } from '../utils'; @@ -23,24 +29,28 @@ const DEFAULT_CONTACT: ContactEditInfo = { name: '', }; +const contactEditProps = { + isEdit: Boolean, + isSaving: Boolean, + isDeleting: Boolean, + showSetDefault: Boolean, + setDefaultLabel: String, + contactInfo: { + type: Object as PropType, + default: () => extend({}, DEFAULT_CONTACT), + }, + telValidator: { + type: Function as PropType<(val: string) => boolean>, + default: isMobile, + }, +}; + +export type ContactEditProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - isEdit: Boolean, - isSaving: Boolean, - isDeleting: Boolean, - showSetDefault: Boolean, - setDefaultLabel: String, - contactInfo: { - type: Object as PropType, - default: () => extend({}, DEFAULT_CONTACT), - }, - telValidator: { - type: Function as PropType<(val: string) => boolean>, - default: isMobile, - }, - }, + props: contactEditProps, emits: ['save', 'delete', 'change-default'], diff --git a/packages/vant/src/contact-edit/README.md b/packages/vant/src/contact-edit/README.md index f620aafb5..f0571c6d7 100644 --- a/packages/vant/src/contact-edit/README.md +++ b/packages/vant/src/contact-edit/README.md @@ -82,7 +82,7 @@ export default { The component exports the following type definitions: ```ts -import type { ContactEditInfo } from 'vant'; +import type { ContactEditInfo, ContactEditProps } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/contact-edit/README.zh-CN.md b/packages/vant/src/contact-edit/README.zh-CN.md index 9a5a1f23c..6b19dcf7b 100644 --- a/packages/vant/src/contact-edit/README.zh-CN.md +++ b/packages/vant/src/contact-edit/README.zh-CN.md @@ -82,7 +82,7 @@ export default { 组件导出以下类型定义： ```ts -import type { ContactEditInfo } from 'vant'; +import type { ContactEditInfo, ContactEditProps } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/contact-edit/index.ts b/packages/vant/src/contact-edit/index.ts index 147bbfe23..9a08a3cc9 100644 --- a/packages/vant/src/contact-edit/index.ts +++ b/packages/vant/src/contact-edit/index.ts @@ -3,4 +3,4 @@ import _ContactEdit from './ContactEdit'; export const ContactEdit = withInstall(_ContactEdit); export default ContactEdit; -export type { ContactEditInfo } from './ContactEdit'; +export type { ContactEditInfo, ContactEditProps } from './ContactEdit'; diff --git a/packages/vant/src/contact-list/ContactList.tsx b/packages/vant/src/contact-list/ContactList.tsx index 0ed6e771f..fa31fc289 100644 --- a/packages/vant/src/contact-list/ContactList.tsx +++ b/packages/vant/src/contact-list/ContactList.tsx @@ -1,4 +1,4 @@ -import { PropType, defineComponent } from 'vue'; +import { PropType, defineComponent, ExtractPropTypes } from 'vue'; // Utils import { createNamespace, unknownProp } from '../utils'; @@ -20,15 +20,19 @@ export type ContactListItem = { isDefault?: boolean; }; +const contactListProps = { + list: Array as PropType, + addText: String, + modelValue: unknownProp, + defaultTagText: String, +}; + +export type ContactListProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - list: Array as PropType, - addText: String, - modelValue: unknownProp, - defaultTagText: String, - }, + props: contactListProps, emits: ['add', 'edit', 'select', 'update:modelValue'], diff --git a/packages/vant/src/contact-list/README.md b/packages/vant/src/contact-list/README.md index d1f04e03f..cfe579cf9 100644 --- a/packages/vant/src/contact-list/README.md +++ b/packages/vant/src/contact-list/README.md @@ -100,7 +100,7 @@ export default { The component exports the following type definitions: ```ts -import type { ContactListItem } from 'vant'; +import type { ContactListItem, ContactListProps } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/contact-list/README.zh-CN.md b/packages/vant/src/contact-list/README.zh-CN.md index d2baa18e8..a0c8d124c 100644 --- a/packages/vant/src/contact-list/README.zh-CN.md +++ b/packages/vant/src/contact-list/README.zh-CN.md @@ -100,7 +100,7 @@ export default { 组件导出以下类型定义： ```ts -import type { ContactListItem } from 'vant'; +import type { ContactListItem, ContactListProps } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/contact-list/index.ts b/packages/vant/src/contact-list/index.ts index 3aefb31c2..520179e6d 100644 --- a/packages/vant/src/contact-list/index.ts +++ b/packages/vant/src/contact-list/index.ts @@ -3,4 +3,4 @@ import _ContactList from './ContactList'; export const ContactList = withInstall(_ContactList); export default ContactList; -export type { ContactListItem } from './ContactList'; +export type { ContactListItem, ContactListProps } from './ContactList'; diff --git a/packages/vant/src/count-down/CountDown.tsx b/packages/vant/src/count-down/CountDown.tsx index 00fff1394..4e746a73f 100644 --- a/packages/vant/src/count-down/CountDown.tsx +++ b/packages/vant/src/count-down/CountDown.tsx @@ -15,19 +15,19 @@ import { useExpose } from '../composables/use-expose'; const [name, bem] = createNamespace('count-down'); -const props = { +const countDownProps = { time: makeNumericProp(0), format: makeStringProp('HH:mm:ss'), autoStart: truthProp, millisecond: Boolean, }; -export type CountDownProps = ExtractPropTypes; +export type CountDownProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: countDownProps, emits: ['change', 'finish'], diff --git a/packages/vant/src/count-down/index.ts b/packages/vant/src/count-down/index.ts index e557a8f0e..073b2de50 100644 --- a/packages/vant/src/count-down/index.ts +++ b/packages/vant/src/count-down/index.ts @@ -1,7 +1,7 @@ import { withInstall } from '../utils'; -import _CountDown, { CountDownProps } from './CountDown'; +import _CountDown from './CountDown'; export const CountDown = withInstall(_CountDown); export default CountDown; -export type { CountDownProps }; +export type { CountDownProps } from './CountDown'; export type { CountDownInstance, CountDownCurrentTime } from './types'; diff --git a/packages/vant/src/coupon-cell/CouponCell.tsx b/packages/vant/src/coupon-cell/CouponCell.tsx index 0de3c71e7..38f5bcbf2 100644 --- a/packages/vant/src/coupon-cell/CouponCell.tsx +++ b/packages/vant/src/coupon-cell/CouponCell.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; // Utils import { @@ -18,11 +18,18 @@ import type { CouponInfo } from '../coupon'; const [name, bem, t] = createNamespace('coupon-cell'); -function formatValue( - coupons: CouponInfo[], - chosenCoupon: number | string, - currency: string -) { +const couponCellProps = { + title: String, + border: truthProp, + editable: truthProp, + coupons: makeArrayProp(), + currency: makeStringProp('¥'), + chosenCoupon: makeNumericProp(-1), +}; + +export type CouponCellProps = ExtractPropTypes; + +function formatValue({ coupons, chosenCoupon, currency }: CouponCellProps) { const coupon = coupons[+chosenCoupon]; if (coupon) { @@ -43,28 +50,15 @@ function formatValue( export default defineComponent({ name, - props: { - title: String, - border: truthProp, - editable: truthProp, - coupons: makeArrayProp(), - currency: makeStringProp('¥'), - chosenCoupon: makeNumericProp(-1), - }, + props: couponCellProps, setup(props) { return () => { const selected = props.coupons[+props.chosenCoupon]; - const value = formatValue( - props.coupons, - props.chosenCoupon, - props.currency - ); - return ( (), + currency: makeStringProp('¥'), + showCount: truthProp, + emptyImage: makeStringProp(EMPTY_IMAGE), + chosenCoupon: makeNumberProp(-1), + enabledTitle: String, + disabledTitle: String, + disabledCoupons: makeArrayProp(), + showExchangeBar: truthProp, + showCloseButton: truthProp, + closeButtonText: String, + inputPlaceholder: String, + exchangeMinLength: makeNumberProp(1), + exchangeButtonText: String, + displayedCouponIndex: makeNumberProp(-1), + exchangeButtonLoading: Boolean, + exchangeButtonDisabled: Boolean, +}; + +export type CouponListProps = ExtractPropTypes; export default defineComponent({ name, - props: { - code: makeStringProp(''), - coupons: makeArrayProp(), - currency: makeStringProp('¥'), - showCount: truthProp, - emptyImage: makeStringProp(EMPTY_IMAGE), - chosenCoupon: makeNumberProp(-1), - enabledTitle: String, - disabledTitle: String, - disabledCoupons: makeArrayProp(), - showExchangeBar: truthProp, - showCloseButton: truthProp, - closeButtonText: String, - inputPlaceholder: String, - exchangeMinLength: makeNumberProp(1), - exchangeButtonText: String, - displayedCouponIndex: makeNumberProp(-1), - exchangeButtonLoading: Boolean, - exchangeButtonDisabled: Boolean, - }, + props: couponListProps, emits: ['change', 'exchange', 'update:code'], diff --git a/packages/vant/src/coupon-list/README.md b/packages/vant/src/coupon-list/README.md index d65322fc8..d81849000 100644 --- a/packages/vant/src/coupon-list/README.md +++ b/packages/vant/src/coupon-list/README.md @@ -149,6 +149,14 @@ export default { | valueDesc | Value Text | _string_ | | unitDesc | Unit Text | _string_ | +### Types + +The component exports the following type definitions: + +```ts +import type { CouponCellProps, CouponListProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/coupon-list/README.zh-CN.md b/packages/vant/src/coupon-list/README.zh-CN.md index 03864ec8b..cca28088e 100644 --- a/packages/vant/src/coupon-list/README.zh-CN.md +++ b/packages/vant/src/coupon-list/README.zh-CN.md @@ -151,6 +151,14 @@ export default { | valueDesc | 折扣券优惠金额文案 | _string_ | | unitDesc | 单位文案 | _string_ | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { CouponCellProps, CouponListProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/coupon-list/index.ts b/packages/vant/src/coupon-list/index.ts index 1123067d7..8c823d230 100644 --- a/packages/vant/src/coupon-list/index.ts +++ b/packages/vant/src/coupon-list/index.ts @@ -3,3 +3,4 @@ import _CouponList from './CouponList'; export const CouponList = withInstall(_CouponList); export default CouponList; +export type { CouponListProps } from './CouponList'; diff --git a/packages/vant/src/coupon/Coupon.tsx b/packages/vant/src/coupon/Coupon.tsx index fd40faee0..ba2299a50 100644 --- a/packages/vant/src/coupon/Coupon.tsx +++ b/packages/vant/src/coupon/Coupon.tsx @@ -1,10 +1,6 @@ import { computed, PropType, defineComponent } from 'vue'; -import { - padZero, - makeStringProp, - createNamespace, - makeRequiredProp, -} from '../utils'; +import { makeStringProp, createNamespace, makeRequiredProp } from '../utils'; +import { getDate, formatAmount, formatDiscount } from './utils'; import { Checkbox } from '../checkbox'; export type CouponInfo = { @@ -25,19 +21,6 @@ export type CouponInfo = { const [name, bem, t] = createNamespace('coupon'); -function getDate(timeStamp: number) { - const date = new Date(timeStamp * 1000); - return `${date.getFullYear()}.${padZero(date.getMonth() + 1)}.${padZero( - date.getDate() - )}`; -} - -const formatDiscount = (discount: number) => - (discount / 10).toFixed(discount % 10 === 0 ? 0 : 1); - -const formatAmount = (amount: number) => - (amount / 100).toFixed(amount % 100 === 0 ? 0 : amount % 10 === 0 ? 1 : 2); - export default defineComponent({ name, diff --git a/packages/vant/src/coupon/utils.ts b/packages/vant/src/coupon/utils.ts new file mode 100644 index 000000000..719e9b075 --- /dev/null +++ b/packages/vant/src/coupon/utils.ts @@ -0,0 +1,14 @@ +import { padZero } from '../utils'; + +export function getDate(timeStamp: number) { + const date = new Date(timeStamp * 1000); + return `${date.getFullYear()}.${padZero(date.getMonth() + 1)}.${padZero( + date.getDate() + )}`; +} + +export const formatDiscount = (discount: number) => + (discount / 10).toFixed(discount % 10 === 0 ? 0 : 1); + +export const formatAmount = (amount: number) => + (amount / 100).toFixed(amount % 100 === 0 ? 0 : amount % 10 === 0 ? 1 : 2); diff --git a/packages/vant/src/datetime-picker/DatePicker.tsx b/packages/vant/src/datetime-picker/DatePicker.tsx index 381dbad6a..621cec848 100644 --- a/packages/vant/src/datetime-picker/DatePicker.tsx +++ b/packages/vant/src/datetime-picker/DatePicker.tsx @@ -19,10 +19,10 @@ import { } from '../utils'; import { times, - pickerKeys, sharedProps, getTrueValue, getMonthEndDay, + pickerInheritKeys, } from './utils'; // Composables @@ -327,7 +327,7 @@ export default defineComponent({ onChange={onChange} onCancel={onCancel} onConfirm={onConfirm} - {...pick(props, pickerKeys)} + {...pick(props, pickerInheritKeys)} /> ); }, diff --git a/packages/vant/src/datetime-picker/DatetimePicker.tsx b/packages/vant/src/datetime-picker/DatetimePicker.tsx index c049110f2..1e950a351 100644 --- a/packages/vant/src/datetime-picker/DatetimePicker.tsx +++ b/packages/vant/src/datetime-picker/DatetimePicker.tsx @@ -7,18 +7,18 @@ import { DatetimePickerInstance } from './types'; const [name, bem] = createNamespace('datetime-picker'); -const timePickerProps = Object.keys(TimePicker.props); -const datePickerProps = Object.keys(DatePicker.props); -const props = extend({}, TimePicker.props, DatePicker.props, { +const timePickerPropKeys = Object.keys(TimePicker.props); +const datePickerPropKeys = Object.keys(DatePicker.props); +const datetimePickerProps = extend({}, TimePicker.props, DatePicker.props, { modelValue: [String, Date], }); -export type DatetimePickerProps = ExtractPropTypes; +export type DatetimePickerProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: datetimePickerProps, setup(props, { attrs, slots }) { const root = ref(); @@ -32,7 +32,7 @@ export default defineComponent({ const Component = isTimePicker ? TimePicker : DatePicker; const inheritProps = pick( props, - isTimePicker ? timePickerProps : datePickerProps + isTimePicker ? timePickerPropKeys : datePickerPropKeys ); return ( diff --git a/packages/vant/src/datetime-picker/TimePicker.tsx b/packages/vant/src/datetime-picker/TimePicker.tsx index 7f60a0b47..d3ecf692c 100644 --- a/packages/vant/src/datetime-picker/TimePicker.tsx +++ b/packages/vant/src/datetime-picker/TimePicker.tsx @@ -16,7 +16,7 @@ import { createNamespace, makeNumericProp, } from '../utils'; -import { times, sharedProps, pickerKeys } from './utils'; +import { times, sharedProps, pickerInheritKeys } from './utils'; // Composables import { useExpose } from '../composables/use-expose'; @@ -171,7 +171,7 @@ export default defineComponent({ onChange={onChange} onCancel={onCancel} onConfirm={onConfirm} - {...pick(props, pickerKeys)} + {...pick(props, pickerInheritKeys)} /> ); }, diff --git a/packages/vant/src/datetime-picker/utils.ts b/packages/vant/src/datetime-picker/utils.ts index e667adf8c..ee09f1387 100644 --- a/packages/vant/src/datetime-picker/utils.ts +++ b/packages/vant/src/datetime-picker/utils.ts @@ -1,9 +1,9 @@ import { PropType } from 'vue'; import { extend } from '../utils'; -import { pickerProps } from '../picker/Picker'; +import { pickerSharedProps } from '../picker/Picker'; import type { DatetimePickerColumnType } from './types'; -export const sharedProps = extend({}, pickerProps, { +export const sharedProps = extend({}, pickerSharedProps, { filter: Function as PropType<(type: string, values: string[]) => string[]>, columnsOrder: Array as PropType, formatter: { @@ -12,8 +12,8 @@ export const sharedProps = extend({}, pickerProps, { }, }); -export const pickerKeys = Object.keys(pickerProps) as Array< - keyof typeof pickerProps +export const pickerInheritKeys = Object.keys(pickerSharedProps) as Array< + keyof typeof pickerSharedProps >; export function times(n: number, iteratee: (index: number) => T) { diff --git a/packages/vant/src/dialog/Dialog.tsx b/packages/vant/src/dialog/Dialog.tsx index 7ded0c8d0..5a5ff2277 100644 --- a/packages/vant/src/dialog/Dialog.tsx +++ b/packages/vant/src/dialog/Dialog.tsx @@ -1,4 +1,4 @@ -import { PropType, reactive, defineComponent } from 'vue'; +import { PropType, reactive, defineComponent, ExtractPropTypes } from 'vue'; // Utils import { @@ -33,7 +33,29 @@ import type { const [name, bem, t] = createNamespace('dialog'); -const popupKeys = [ +const dialogProps = extend({}, popupSharedProps, { + title: String, + theme: String as PropType, + width: numericProp, + message: [String, Function] as PropType, + callback: Function as PropType<(action?: DialogAction) => void>, + allowHtml: Boolean, + className: unknownProp, + transition: makeStringProp('van-dialog-bounce'), + messageAlign: String as PropType, + closeOnPopstate: truthProp, + showCancelButton: Boolean, + cancelButtonText: String, + cancelButtonColor: String, + confirmButtonText: String, + confirmButtonColor: String, + showConfirmButton: truthProp, + closeOnClickOverlay: Boolean, +}); + +export type DialogProps = ExtractPropTypes; + +const popupInheritKeys = [ ...popupSharedPropKeys, 'transition', 'closeOnPopstate', @@ -42,25 +64,7 @@ const popupKeys = [ export default defineComponent({ name, - props: extend({}, popupSharedProps, { - title: String, - theme: String as PropType, - width: numericProp, - message: [String, Function] as PropType, - callback: Function as PropType<(action?: DialogAction) => void>, - allowHtml: Boolean, - className: unknownProp, - transition: makeStringProp('van-dialog-bounce'), - messageAlign: String as PropType, - closeOnPopstate: truthProp, - showCancelButton: Boolean, - cancelButtonText: String, - cancelButtonColor: String, - confirmButtonText: String, - confirmButtonColor: String, - showConfirmButton: truthProp, - closeOnClickOverlay: Boolean, - }), + props: dialogProps, emits: ['confirm', 'cancel', 'update:show'], @@ -225,7 +229,7 @@ export default defineComponent({ style={{ width: addUnit(width) }} aria-labelledby={title || message} onUpdate:show={updateShow} - {...pick(props, popupKeys)} + {...pick(props, popupInheritKeys)} > {renderTitle()} {renderContent()} diff --git a/packages/vant/src/dialog/README.md b/packages/vant/src/dialog/README.md index ca2932df3..e49609a04 100644 --- a/packages/vant/src/dialog/README.md +++ b/packages/vant/src/dialog/README.md @@ -220,6 +220,7 @@ The component exports the following type definitions: ```ts import type { + DialogProps, DialogTheme, DialogMessage, DialogOptions, diff --git a/packages/vant/src/dialog/README.zh-CN.md b/packages/vant/src/dialog/README.zh-CN.md index fbea3628e..3c0ead1f8 100644 --- a/packages/vant/src/dialog/README.zh-CN.md +++ b/packages/vant/src/dialog/README.zh-CN.md @@ -270,6 +270,7 @@ export default { ```ts import type { + DialogProps, DialogTheme, DialogMessage, DialogOptions, diff --git a/packages/vant/src/dialog/index.ts b/packages/vant/src/dialog/index.ts index 903485b50..669422675 100644 --- a/packages/vant/src/dialog/index.ts +++ b/packages/vant/src/dialog/index.ts @@ -2,6 +2,7 @@ import { Dialog } from './function-call'; export default Dialog; export { Dialog }; +export type { DialogProps } from './Dialog'; export type { DialogTheme, DialogMessage, diff --git a/packages/vant/src/divider/Divider.tsx b/packages/vant/src/divider/Divider.tsx index c5c103ddb..cd9e96b92 100644 --- a/packages/vant/src/divider/Divider.tsx +++ b/packages/vant/src/divider/Divider.tsx @@ -1,18 +1,22 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; import { truthProp, makeStringProp, createNamespace } from '../utils'; const [name, bem] = createNamespace('divider'); export type DividerContentPosition = 'left' | 'center' | 'right'; +const dividerProps = { + dashed: Boolean, + hairline: truthProp, + contentPosition: makeStringProp('center'), +}; + +export type DividerProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - dashed: Boolean, - hairline: truthProp, - contentPosition: makeStringProp('center'), - }, + props: dividerProps, setup(props, { slots }) { return () => ( diff --git a/packages/vant/src/divider/README.md b/packages/vant/src/divider/README.md index 41f5e99d8..7f987603a 100644 --- a/packages/vant/src/divider/README.md +++ b/packages/vant/src/divider/README.md @@ -74,7 +74,7 @@ app.use(Divider); The component exports the following type definitions: ```ts -import type { DividerContentPosition } from 'vant'; +import type { DividerProps, DividerContentPosition } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/divider/README.zh-CN.md b/packages/vant/src/divider/README.zh-CN.md index 62ebc1288..6b32f2b2f 100644 --- a/packages/vant/src/divider/README.zh-CN.md +++ b/packages/vant/src/divider/README.zh-CN.md @@ -84,7 +84,7 @@ app.use(Divider); 组件导出以下类型定义： ```ts -import type { DividerContentPosition } from 'vant'; +import type { DividerProps, DividerContentPosition } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/divider/index.ts b/packages/vant/src/divider/index.ts index c8afa11b7..5cf581005 100644 --- a/packages/vant/src/divider/index.ts +++ b/packages/vant/src/divider/index.ts @@ -3,4 +3,4 @@ import _Divider from './Divider'; export const Divider = withInstall(_Divider); export default Divider; -export type { DividerContentPosition } from './Divider'; +export type { DividerProps, DividerContentPosition } from './Divider'; diff --git a/packages/vant/src/dropdown-item/DropdownItem.tsx b/packages/vant/src/dropdown-item/DropdownItem.tsx index 0ecb67b51..58efef1d2 100644 --- a/packages/vant/src/dropdown-item/DropdownItem.tsx +++ b/packages/vant/src/dropdown-item/DropdownItem.tsx @@ -32,7 +32,7 @@ import type { DropdownItemOption } from './types'; const [name, bem] = createNamespace('dropdown-item'); -const props = { +const dropdownItemProps = { title: String, options: makeArrayProp(), disabled: Boolean, @@ -42,12 +42,12 @@ const props = { titleClass: unknownProp, }; -export type DropdownItemProps = ExtractPropTypes; +export type DropdownItemProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: dropdownItemProps, emits: ['open', 'opened', 'close', 'closed', 'change', 'update:modelValue'], diff --git a/packages/vant/src/dropdown-menu/DropdownMenu.tsx b/packages/vant/src/dropdown-menu/DropdownMenu.tsx index db844a2ef..f0e74dc80 100644 --- a/packages/vant/src/dropdown-menu/DropdownMenu.tsx +++ b/packages/vant/src/dropdown-menu/DropdownMenu.tsx @@ -32,7 +32,7 @@ import type { DropdownMenuProvide, DropdownMenuDirection } from './types'; const [name, bem] = createNamespace('dropdown-menu'); -const props = { +const dropdownMenuProps = { overlay: truthProp, zIndex: numericProp, duration: makeNumericProp(0.2), @@ -42,14 +42,14 @@ const props = { closeOnClickOverlay: truthProp, }; -export type DropdownMenuProps = ExtractPropTypes; +export type DropdownMenuProps = ExtractPropTypes; export const DROPDOWN_KEY: InjectionKey = Symbol(name); export default defineComponent({ name, - props, + props: dropdownMenuProps, setup(props, { slots }) { const root = ref(); diff --git a/packages/vant/src/empty/Empty.tsx b/packages/vant/src/empty/Empty.tsx index 3ece8b73c..31c600c7a 100644 --- a/packages/vant/src/empty/Empty.tsx +++ b/packages/vant/src/empty/Empty.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; import { numericProp, getSizeStyle, @@ -11,14 +11,18 @@ const [name, bem] = createNamespace('empty'); const PRESET_IMAGES = ['error', 'search', 'default']; +const emptyProps = { + image: makeStringProp('default'), + imageSize: numericProp, + description: String, +}; + +export type EmptyProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - image: makeStringProp('default'), - imageSize: numericProp, - description: String, - }, + props: emptyProps, setup(props, { slots }) { const renderImage = () => { diff --git a/packages/vant/src/empty/README.md b/packages/vant/src/empty/README.md index 62370364b..06f5db837 100644 --- a/packages/vant/src/empty/README.md +++ b/packages/vant/src/empty/README.md @@ -86,6 +86,14 @@ Use the image prop to display different placeholder images. | image | Custom image | | description | Custom description | +### Types + +The component exports the following type definitions: + +```ts +import type { EmptyProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/empty/README.zh-CN.md b/packages/vant/src/empty/README.zh-CN.md index fc3a96aff..c68aca59f 100644 --- a/packages/vant/src/empty/README.zh-CN.md +++ b/packages/vant/src/empty/README.zh-CN.md @@ -91,6 +91,14 @@ Empty 组件内置了多种占位图片类型，可以在不同业务场景下 | image | 自定义图标 | | description | 自定义描述文字 | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { EmptyProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/empty/index.ts b/packages/vant/src/empty/index.ts index 39dd44370..bd5d4df92 100644 --- a/packages/vant/src/empty/index.ts +++ b/packages/vant/src/empty/index.ts @@ -3,3 +3,4 @@ import _Empty from './Empty'; export const Empty = withInstall(_Empty); export default Empty; +export type { EmptyProps } from './Empty'; diff --git a/packages/vant/src/field/Field.tsx b/packages/vant/src/field/Field.tsx index 40ff16606..59882e305 100644 --- a/packages/vant/src/field/Field.tsx +++ b/packages/vant/src/field/Field.tsx @@ -35,7 +35,7 @@ import { resizeTextarea, runRuleValidator, } from './utils'; -import { cellProps } from '../cell/Cell'; +import { cellSharedProps } from '../cell/Cell'; // Composables import { CUSTOM_FIELD_INJECTION_KEY, useParent } from '@vant/use'; @@ -93,7 +93,7 @@ export const fieldSharedProps = { }, }; -const props = extend({}, cellProps, fieldSharedProps, { +const fieldProps = extend({}, cellSharedProps, fieldSharedProps, { rows: numericProp, type: makeStringProp('text'), rules: Array as PropType, @@ -109,12 +109,12 @@ const props = extend({}, cellProps, fieldSharedProps, { }, }); -export type FieldProps = ExtractPropTypes; +export type FieldProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: fieldProps, emits: [ 'blur', diff --git a/packages/vant/src/form/Form.tsx b/packages/vant/src/form/Form.tsx index f9f54f8c0..fd1aeae24 100644 --- a/packages/vant/src/form/Form.tsx +++ b/packages/vant/src/form/Form.tsx @@ -23,7 +23,7 @@ import type { FormExpose } from './types'; const [name, bem] = createNamespace('form'); -const props = { +const formProps = { colon: Boolean, disabled: Boolean, readonly: Boolean, @@ -39,12 +39,12 @@ const props = { errorMessageAlign: String as PropType, }; -export type FormProps = ExtractPropTypes; +export type FormProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: formProps, emits: ['submit', 'failed'], diff --git a/packages/vant/src/grid-item/GridItem.tsx b/packages/vant/src/grid-item/GridItem.tsx index 9e9af682b..2ccfdd8a1 100644 --- a/packages/vant/src/grid-item/GridItem.tsx +++ b/packages/vant/src/grid-item/GridItem.tsx @@ -1,4 +1,9 @@ -import { computed, CSSProperties, defineComponent } from 'vue'; +import { + computed, + CSSProperties, + defineComponent, + ExtractPropTypes, +} from 'vue'; // Utils import { @@ -20,17 +25,21 @@ import { Badge } from '../badge'; const [name, bem] = createNamespace('grid-item'); +const gridItemProps = extend({}, routeProps, { + dot: Boolean, + text: String, + icon: String, + badge: numericProp, + iconColor: String, + iconPrefix: String, +}); + +export type GridItemProps = ExtractPropTypes; + export default defineComponent({ name, - props: extend({}, routeProps, { - dot: Boolean, - text: String, - icon: String, - badge: numericProp, - iconColor: String, - iconPrefix: String, - }), + props: gridItemProps, setup(props, { slots }) { const { parent, index } = useParent(GRID_KEY); diff --git a/packages/vant/src/grid-item/index.ts b/packages/vant/src/grid-item/index.ts index 3df247a9f..31c96fc64 100644 --- a/packages/vant/src/grid-item/index.ts +++ b/packages/vant/src/grid-item/index.ts @@ -3,3 +3,4 @@ import _GridItem from './GridItem'; export const GridItem = withInstall(_GridItem); export default GridItem; +export type { GridItemProps } from './GridItem'; diff --git a/packages/vant/src/grid/Grid.tsx b/packages/vant/src/grid/Grid.tsx index b1afcd254..34ed2300c 100644 --- a/packages/vant/src/grid/Grid.tsx +++ b/packages/vant/src/grid/Grid.tsx @@ -13,7 +13,7 @@ const [name, bem] = createNamespace('grid'); export type GridDirection = 'horizontal' | 'vertical'; -const props = { +const gridProps = { square: Boolean, center: truthProp, border: truthProp, @@ -25,8 +25,10 @@ const props = { columnNum: makeNumericProp(4), }; +export type GridProps = ExtractPropTypes; + export type GridProvide = { - props: ExtractPropTypes; + props: GridProps; }; export const GRID_KEY: InjectionKey = Symbol(name); @@ -34,7 +36,7 @@ export const GRID_KEY: InjectionKey = Symbol(name); export default defineComponent({ name, - props, + props: gridProps, setup(props, { slots }) { const { linkChildren } = useChildren(GRID_KEY); diff --git a/packages/vant/src/grid/README.md b/packages/vant/src/grid/README.md index 488c882d4..e8cd3bc12 100644 --- a/packages/vant/src/grid/README.md +++ b/packages/vant/src/grid/README.md @@ -147,7 +147,7 @@ app.use(GridItem); The component exports the following type definitions: ```ts -import type { GridDirection } from 'vant'; +import type { GridProps, GridDirection, GridItemProps } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/grid/README.zh-CN.md b/packages/vant/src/grid/README.zh-CN.md index d872d20f5..f031f0812 100644 --- a/packages/vant/src/grid/README.zh-CN.md +++ b/packages/vant/src/grid/README.zh-CN.md @@ -163,7 +163,7 @@ app.use(GridItem); 组件导出以下类型定义： ```ts -import type { GridDirection } from 'vant'; +import type { GridProps, GridDirection, GridItemProps } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/grid/index.ts b/packages/vant/src/grid/index.ts index d8d4e076d..768abcbe1 100644 --- a/packages/vant/src/grid/index.ts +++ b/packages/vant/src/grid/index.ts @@ -3,4 +3,4 @@ import _Grid from './Grid'; export const Grid = withInstall(_Grid); export default Grid; -export type { GridDirection } from './Grid'; +export type { GridProps, GridDirection } from './Grid'; diff --git a/packages/vant/src/icon/Icon.tsx b/packages/vant/src/icon/Icon.tsx index 75496d49e..7eeb39b4e 100644 --- a/packages/vant/src/icon/Icon.tsx +++ b/packages/vant/src/icon/Icon.tsx @@ -1,4 +1,4 @@ -import { defineComponent, inject, computed } from 'vue'; +import { defineComponent, inject, computed, ExtractPropTypes } from 'vue'; import { addUnit, numericProp, @@ -12,18 +12,22 @@ const [name, bem] = createNamespace('icon'); const isImage = (name?: string) => name?.includes('/'); +const iconProps = { + dot: Boolean, + tag: makeStringProp('i'), + name: String, + size: numericProp, + badge: numericProp, + color: String, + classPrefix: String, +}; + +export type IconProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - dot: Boolean, - tag: makeStringProp('i'), - name: String, - size: numericProp, - badge: numericProp, - color: String, - classPrefix: String, - }, + props: iconProps, setup(props, { slots }) { const config = inject(CONFIG_PROVIDER_KEY, null); diff --git a/packages/vant/src/icon/README.md b/packages/vant/src/icon/README.md index 8525b224c..250d71ef8 100644 --- a/packages/vant/src/icon/README.md +++ b/packages/vant/src/icon/README.md @@ -106,3 +106,11 @@ Use `size` prop to set icon size. | Event | Description | Arguments | | ----- | ---------------------------- | ------------------- | | click | Emitted when icon is clicked | _event: MouseEvent_ | + +### Types + +The component exports the following type definitions: + +```ts +import type { IconProps } from 'vant'; +``` diff --git a/packages/vant/src/icon/README.zh-CN.md b/packages/vant/src/icon/README.zh-CN.md index c7ba5f406..2dbe87980 100644 --- a/packages/vant/src/icon/README.zh-CN.md +++ b/packages/vant/src/icon/README.zh-CN.md @@ -108,3 +108,11 @@ app.use(Icon); | 事件名 | 说明 | 回调参数 | | ------ | -------------- | ------------------- | | click | 点击图标时触发 | _event: MouseEvent_ | + +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { IconProps } from 'vant'; +``` diff --git a/packages/vant/src/icon/index.ts b/packages/vant/src/icon/index.ts index 55405ef9d..fd39a0726 100644 --- a/packages/vant/src/icon/index.ts +++ b/packages/vant/src/icon/index.ts @@ -3,3 +3,4 @@ import _Icon from './Icon'; export const Icon = withInstall(_Icon); export default Icon; +export type { IconProps } from './Icon'; diff --git a/packages/vant/src/image-preview/ImagePreview.tsx b/packages/vant/src/image-preview/ImagePreview.tsx index 8ff8e7eae..8e076dcb9 100644 --- a/packages/vant/src/image-preview/ImagePreview.tsx +++ b/packages/vant/src/image-preview/ImagePreview.tsx @@ -45,7 +45,7 @@ const popupProps = [ 'closeOnPopstate', ] as const; -const props = { +const imagePreviewProps = { show: Boolean, loop: truthProp, images: makeArrayProp(), @@ -66,12 +66,12 @@ const props = { closeIconPosition: makeStringProp('top-right'), }; -export type ImagePreviewProps = ExtractPropTypes; +export type ImagePreviewProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: imagePreviewProps, emits: ['scale', 'close', 'closed', 'change', 'update:show'], diff --git a/packages/vant/src/image/Image.tsx b/packages/vant/src/image/Image.tsx index cd444da70..8c77b4ee8 100644 --- a/packages/vant/src/image/Image.tsx +++ b/packages/vant/src/image/Image.tsx @@ -7,6 +7,7 @@ import { CSSProperties, onBeforeUnmount, defineComponent, + ExtractPropTypes, getCurrentInstance, } from 'vue'; @@ -28,25 +29,29 @@ const [name, bem] = createNamespace('image'); export type ImageFit = 'contain' | 'cover' | 'fill' | 'none' | 'scale-down'; +const imageProps = { + src: String, + alt: String, + fit: String as PropType, + round: Boolean, + width: numericProp, + height: numericProp, + radius: numericProp, + lazyLoad: Boolean, + iconSize: numericProp, + showError: truthProp, + errorIcon: makeStringProp('photo-fail'), + iconPrefix: String, + showLoading: truthProp, + loadingIcon: makeStringProp('photo'), +}; + +export type ImageProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - src: String, - alt: String, - fit: String as PropType, - round: Boolean, - width: numericProp, - height: numericProp, - radius: numericProp, - lazyLoad: Boolean, - iconSize: numericProp, - showError: truthProp, - errorIcon: makeStringProp('photo-fail'), - iconPrefix: String, - showLoading: truthProp, - loadingIcon: makeStringProp('photo'), - }, + props: imageProps, emits: ['load', 'error'], diff --git a/packages/vant/src/image/README.md b/packages/vant/src/image/README.md index acd2afb9e..d870bf00d 100644 --- a/packages/vant/src/image/README.md +++ b/packages/vant/src/image/README.md @@ -119,7 +119,7 @@ app.use(Lazyload); The component exports the following type definitions: ```ts -import type { ImageFit } from 'vant'; +import type { ImageFit, ImageProps } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/image/README.zh-CN.md b/packages/vant/src/image/README.zh-CN.md index aca5dac8e..670f76d67 100644 --- a/packages/vant/src/image/README.zh-CN.md +++ b/packages/vant/src/image/README.zh-CN.md @@ -147,7 +147,7 @@ app.use(Lazyload); 组件导出以下类型定义： ```ts -import type { ImageFit } from 'vant'; +import type { ImageFit, ImageProps } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/image/index.ts b/packages/vant/src/image/index.ts index 3a8917f8d..05fa158ad 100644 --- a/packages/vant/src/image/index.ts +++ b/packages/vant/src/image/index.ts @@ -3,4 +3,4 @@ import _Image from './Image'; export const Image = withInstall(_Image); export default Image; -export type { ImageFit } from './Image'; +export type { ImageFit, ImageProps } from './Image'; diff --git a/packages/vant/src/index-anchor/IndexAnchor.tsx b/packages/vant/src/index-anchor/IndexAnchor.tsx index 5104a4057..073706fe7 100644 --- a/packages/vant/src/index-anchor/IndexAnchor.tsx +++ b/packages/vant/src/index-anchor/IndexAnchor.tsx @@ -1,4 +1,11 @@ -import { ref, reactive, computed, CSSProperties, defineComponent } from 'vue'; +import { + ref, + reactive, + computed, + CSSProperties, + defineComponent, + ExtractPropTypes, +} from 'vue'; // Utils import { @@ -17,12 +24,16 @@ import { useExpose } from '../composables/use-expose'; const [name, bem] = createNamespace('index-anchor'); +const indexAnchorProps = { + index: numericProp, +}; + +export type IndexAnchorProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - index: numericProp, - }, + props: indexAnchorProps, setup(props, { slots }) { const state = reactive({ diff --git a/packages/vant/src/index-anchor/index.ts b/packages/vant/src/index-anchor/index.ts index 864974bb3..045ab9123 100644 --- a/packages/vant/src/index-anchor/index.ts +++ b/packages/vant/src/index-anchor/index.ts @@ -3,3 +3,4 @@ import _IndexAnchor from './IndexAnchor'; export const IndexAnchor = withInstall(_IndexAnchor); export default IndexAnchor; +export type { IndexAnchorProps } from './IndexAnchor'; diff --git a/packages/vant/src/index-bar/IndexBar.tsx b/packages/vant/src/index-bar/IndexBar.tsx index af20b05d5..3a2544d5f 100644 --- a/packages/vant/src/index-bar/IndexBar.tsx +++ b/packages/vant/src/index-bar/IndexBar.tsx @@ -51,7 +51,7 @@ function genAlphabet() { const [name, bem] = createNamespace('index-bar'); -const props = { +const indexBarProps = { sticky: truthProp, zIndex: numericProp, teleport: [String, Object] as PropType, @@ -63,14 +63,14 @@ const props = { }, }; -export type IndexBarProps = ExtractPropTypes; +export type IndexBarProps = ExtractPropTypes; export const INDEX_BAR_KEY: InjectionKey = Symbol(name); export default defineComponent({ name, - props, + props: indexBarProps, emits: ['select', 'change'], diff --git a/packages/vant/src/index-bar/README.md b/packages/vant/src/index-bar/README.md index 801e71de0..cf0b99022 100644 --- a/packages/vant/src/index-bar/README.md +++ b/packages/vant/src/index-bar/README.md @@ -104,7 +104,7 @@ Use [ref](https://v3.vuejs.org/guide/component-template-refs.html) to get IndexB The component exports the following type definitions: ```ts -import type { IndexBarProps, IndexBarInstance } from 'vant'; +import type { IndexBarProps, IndexAnchorProps, IndexBarInstance } from 'vant'; ``` `IndexBarInstance` is the type of component instance: diff --git a/packages/vant/src/index-bar/README.zh-CN.md b/packages/vant/src/index-bar/README.zh-CN.md index 8dac6e61c..8737fd7d9 100644 --- a/packages/vant/src/index-bar/README.zh-CN.md +++ b/packages/vant/src/index-bar/README.zh-CN.md @@ -108,7 +108,7 @@ export default { 组件导出以下类型定义： ```ts -import type { IndexBarProps, IndexBarInstance } from 'vant'; +import type { IndexBarProps, IndexAnchorProps, IndexBarInstance } from 'vant'; ``` `IndexBarInstance` 是组件实例的类型，用法如下： diff --git a/packages/vant/src/list/List.tsx b/packages/vant/src/list/List.tsx index 8c4e13749..ae3cb9ce7 100644 --- a/packages/vant/src/list/List.tsx +++ b/packages/vant/src/list/List.tsx @@ -30,7 +30,7 @@ import type { ListExpose, ListDirection } from './types'; const [name, bem, t] = createNamespace('list'); -const props = { +const listProps = { error: Boolean, offset: makeNumericProp(300), loading: Boolean, @@ -42,12 +42,12 @@ const props = { immediateCheck: truthProp, }; -export type ListProps = ExtractPropTypes; +export type ListProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: listProps, emits: ['load', 'update:error', 'update:loading'], diff --git a/packages/vant/src/loading/Loading.tsx b/packages/vant/src/loading/Loading.tsx index 8f914117d..c95057ef6 100644 --- a/packages/vant/src/loading/Loading.tsx +++ b/packages/vant/src/loading/Loading.tsx @@ -1,4 +1,4 @@ -import { computed, defineComponent } from 'vue'; +import { computed, defineComponent, ExtractPropTypes } from 'vue'; import { extend, addUnit, @@ -22,17 +22,21 @@ const CircularIcon = ( export type LoadingType = 'circular' | 'spinner'; +const loadingProps = { + size: numericProp, + type: makeStringProp('circular'), + color: String, + vertical: Boolean, + textSize: numericProp, + textColor: String, +}; + +export type LoadingProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - size: numericProp, - type: makeStringProp('circular'), - color: String, - vertical: Boolean, - textSize: numericProp, - textColor: String, - }, + props: loadingProps, setup(props, { slots }) { const spinnerStyle = computed(() => diff --git a/packages/vant/src/loading/README.md b/packages/vant/src/loading/README.md index 083f78ab3..08d590ca1 100644 --- a/packages/vant/src/loading/README.md +++ b/packages/vant/src/loading/README.md @@ -90,7 +90,7 @@ use `color` or `text-color` to change text color. The component exports the following type definitions: ```ts -import type { LoadingType } from 'vant'; +import type { LoadingType, LoadingProps } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/loading/README.zh-CN.md b/packages/vant/src/loading/README.zh-CN.md index 7d8fb4296..9fae21614 100644 --- a/packages/vant/src/loading/README.zh-CN.md +++ b/packages/vant/src/loading/README.zh-CN.md @@ -100,7 +100,7 @@ app.use(Loading); 组件导出以下类型定义： ```ts -import type { LoadingType } from 'vant'; +import type { LoadingType, LoadingProps } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/loading/index.ts b/packages/vant/src/loading/index.ts index 46b6a8f73..684f65d7e 100644 --- a/packages/vant/src/loading/index.ts +++ b/packages/vant/src/loading/index.ts @@ -3,4 +3,4 @@ import _Loading from './Loading'; export const Loading = withInstall(_Loading); export default Loading; -export type { LoadingType } from './Loading'; +export type { LoadingType, LoadingProps } from './Loading'; diff --git a/packages/vant/src/nav-bar/NavBar.tsx b/packages/vant/src/nav-bar/NavBar.tsx index f05d9e5eb..d66ea0d1c 100644 --- a/packages/vant/src/nav-bar/NavBar.tsx +++ b/packages/vant/src/nav-bar/NavBar.tsx @@ -1,4 +1,4 @@ -import { ref, CSSProperties, defineComponent } from 'vue'; +import { ref, CSSProperties, defineComponent, ExtractPropTypes } from 'vue'; // Utils import { @@ -17,20 +17,24 @@ import { Icon } from '../icon'; const [name, bem] = createNamespace('nav-bar'); +const navBarProps = { + title: String, + fixed: Boolean, + zIndex: numericProp, + border: truthProp, + leftText: String, + rightText: String, + leftArrow: Boolean, + placeholder: Boolean, + safeAreaInsetTop: Boolean, +}; + +export type NavbarProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - title: String, - fixed: Boolean, - zIndex: numericProp, - border: truthProp, - leftText: String, - rightText: String, - leftArrow: Boolean, - placeholder: Boolean, - safeAreaInsetTop: Boolean, - }, + props: navBarProps, emits: ['click-left', 'click-right'], diff --git a/packages/vant/src/nav-bar/README.md b/packages/vant/src/nav-bar/README.md index 096dfe6d8..df5721237 100644 --- a/packages/vant/src/nav-bar/README.md +++ b/packages/vant/src/nav-bar/README.md @@ -115,6 +115,14 @@ export default { | click-left | Emitted when the left button is clicked | _event: MouseEvent_ | | click-right | Emitted when the right button is clicked | _event: MouseEvent_ | +### Types + +The component exports the following type definitions: + +```ts +import type { NavbarProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/nav-bar/README.zh-CN.md b/packages/vant/src/nav-bar/README.zh-CN.md index d8cdc6331..6b7fe4b83 100644 --- a/packages/vant/src/nav-bar/README.zh-CN.md +++ b/packages/vant/src/nav-bar/README.zh-CN.md @@ -123,6 +123,14 @@ export default { | click-left | 点击左侧按钮时触发 | _event: MouseEvent_ | | click-right | 点击右侧按钮时触发 | _event: MouseEvent_ | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { NavbarProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/nav-bar/index.ts b/packages/vant/src/nav-bar/index.ts index 08eed915a..876bca5d1 100644 --- a/packages/vant/src/nav-bar/index.ts +++ b/packages/vant/src/nav-bar/index.ts @@ -3,3 +3,4 @@ import _NavBar from './NavBar'; export const NavBar = withInstall(_NavBar); export default NavBar; +export type { NavbarProps } from './NavBar'; diff --git a/packages/vant/src/notice-bar/NoticeBar.tsx b/packages/vant/src/notice-bar/NoticeBar.tsx index b14f47cb9..68084373d 100644 --- a/packages/vant/src/notice-bar/NoticeBar.tsx +++ b/packages/vant/src/notice-bar/NoticeBar.tsx @@ -29,7 +29,7 @@ import { NoticeBarMode } from './types'; const [name, bem] = createNamespace('notice-bar'); -const props = { +const noticeBarProps = { text: String, mode: String as PropType, color: String, @@ -44,12 +44,12 @@ const props = { }, }; -export type NoticeBarProps = ExtractPropTypes; +export type NoticeBarProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: noticeBarProps, emits: ['close', 'replay'], diff --git a/packages/vant/src/notify/Notify.tsx b/packages/vant/src/notify/Notify.tsx index a8a0aa0e1..90900d385 100644 --- a/packages/vant/src/notify/Notify.tsx +++ b/packages/vant/src/notify/Notify.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; import { extend, numericProp, @@ -12,17 +12,21 @@ import type { NotifyType } from './types'; const [name, bem] = createNamespace('notify'); +const notifyProps = extend({}, popupSharedProps, { + type: makeStringProp('danger'), + color: String, + message: numericProp, + className: unknownProp, + background: String, + lockScroll: Boolean, +}); + +export type NotifyProps = ExtractPropTypes; + export default defineComponent({ name, - props: extend({}, popupSharedProps, { - type: makeStringProp('danger'), - color: String, - message: numericProp, - className: unknownProp, - background: String, - lockScroll: Boolean, - }), + props: notifyProps, emits: ['update:show'], diff --git a/packages/vant/src/notify/README.md b/packages/vant/src/notify/README.md index 14780a76b..37984e3f2 100644 --- a/packages/vant/src/notify/README.md +++ b/packages/vant/src/notify/README.md @@ -123,7 +123,7 @@ export default { The component exports the following type definitions: ```ts -import type { NotifyType, NotifyOptions } from 'vant'; +import type { NotifyType, NotifyProps, NotifyOptions } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/notify/README.zh-CN.md b/packages/vant/src/notify/README.zh-CN.md index a992f3de2..465348abe 100644 --- a/packages/vant/src/notify/README.zh-CN.md +++ b/packages/vant/src/notify/README.zh-CN.md @@ -171,7 +171,7 @@ export default { 组件导出以下类型定义： ```ts -import type { NotifyType, NotifyOptions } from 'vant'; +import type { NotifyType, NotifyProps, NotifyOptions } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/notify/index.ts b/packages/vant/src/notify/index.ts index 7b4d62d88..5215b36fc 100644 --- a/packages/vant/src/notify/index.ts +++ b/packages/vant/src/notify/index.ts @@ -2,4 +2,5 @@ import { Notify } from './function-call'; export default Notify; export { Notify }; +export type { NotifyProps } from './Notify'; export type { NotifyType, NotifyOptions } from './types'; diff --git a/packages/vant/src/number-keyboard/NumberKeyboard.tsx b/packages/vant/src/number-keyboard/NumberKeyboard.tsx index ad22ae519..825c0ffef 100644 --- a/packages/vant/src/number-keyboard/NumberKeyboard.tsx +++ b/packages/vant/src/number-keyboard/NumberKeyboard.tsx @@ -8,6 +8,7 @@ import { Transition, TeleportProps, defineComponent, + ExtractPropTypes, } from 'vue'; // Utils @@ -38,31 +39,35 @@ type KeyConfig = { wider?: boolean; }; +const numberKeyboardProps = { + show: Boolean, + title: String, + theme: makeStringProp('default'), + zIndex: numericProp, + teleport: [String, Object] as PropType, + maxlength: makeNumericProp(Infinity), + modelValue: makeStringProp(''), + transition: truthProp, + blurOnClose: truthProp, + showDeleteKey: truthProp, + randomKeyOrder: Boolean, + closeButtonText: String, + deleteButtonText: String, + closeButtonLoading: Boolean, + hideOnClickOutside: truthProp, + safeAreaInsetBottom: truthProp, + extraKey: { + type: [String, Array] as PropType, + default: '', + }, +}; + +export type NumberKeyboardProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - show: Boolean, - title: String, - theme: makeStringProp('default'), - zIndex: numericProp, - teleport: [String, Object] as PropType, - maxlength: makeNumericProp(Infinity), - modelValue: makeStringProp(''), - transition: truthProp, - blurOnClose: truthProp, - showDeleteKey: truthProp, - randomKeyOrder: Boolean, - closeButtonText: String, - deleteButtonText: String, - closeButtonLoading: Boolean, - hideOnClickOutside: truthProp, - safeAreaInsetBottom: truthProp, - extraKey: { - type: [String, Array] as PropType, - default: '', - }, - }, + props: numberKeyboardProps, emits: [ 'show', diff --git a/packages/vant/src/number-keyboard/README.md b/packages/vant/src/number-keyboard/README.md index da76c179a..387833d54 100644 --- a/packages/vant/src/number-keyboard/README.md +++ b/packages/vant/src/number-keyboard/README.md @@ -210,7 +210,7 @@ export default { The component exports the following type definitions: ```ts -import type { NumberKeyboardTheme } from 'vant'; +import type { NumberKeyboardProps, NumberKeyboardTheme } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/number-keyboard/README.zh-CN.md b/packages/vant/src/number-keyboard/README.zh-CN.md index 0fef0a21a..c38c899ea 100644 --- a/packages/vant/src/number-keyboard/README.zh-CN.md +++ b/packages/vant/src/number-keyboard/README.zh-CN.md @@ -217,7 +217,7 @@ export default { 组件导出以下类型定义： ```ts -import type { NumberKeyboardTheme } from 'vant'; +import type { NumberKeyboardProps, NumberKeyboardTheme } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/number-keyboard/index.ts b/packages/vant/src/number-keyboard/index.ts index 9f85c28a1..902544e05 100644 --- a/packages/vant/src/number-keyboard/index.ts +++ b/packages/vant/src/number-keyboard/index.ts @@ -3,4 +3,7 @@ import _NumberKeyboard from './NumberKeyboard'; export const NumberKeyboard = withInstall(_NumberKeyboard); export default NumberKeyboard; -export type { NumberKeyboardTheme } from './NumberKeyboard'; +export type { + NumberKeyboardProps, + NumberKeyboardTheme, +} from './NumberKeyboard'; diff --git a/packages/vant/src/overlay/Overlay.tsx b/packages/vant/src/overlay/Overlay.tsx index 90a0c38b4..d343cd0a9 100644 --- a/packages/vant/src/overlay/Overlay.tsx +++ b/packages/vant/src/overlay/Overlay.tsx @@ -1,4 +1,10 @@ -import { PropType, Transition, CSSProperties, defineComponent } from 'vue'; +import { + PropType, + Transition, + CSSProperties, + defineComponent, + ExtractPropTypes, +} from 'vue'; import { noop, isDef, @@ -14,17 +20,21 @@ import { useLazyRender } from '../composables/use-lazy-render'; const [name, bem] = createNamespace('overlay'); +const overlayProps = { + show: Boolean, + zIndex: numericProp, + duration: numericProp, + className: unknownProp, + lockScroll: truthProp, + customStyle: Object as PropType, +}; + +export type OverlayProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - show: Boolean, - zIndex: numericProp, - duration: numericProp, - className: unknownProp, - lockScroll: truthProp, - customStyle: Object as PropType, - }, + props: overlayProps, setup(props, { slots }) { const lazyRender = useLazyRender(() => props.show); diff --git a/packages/vant/src/overlay/README.md b/packages/vant/src/overlay/README.md index 7f4953672..a66dff557 100644 --- a/packages/vant/src/overlay/README.md +++ b/packages/vant/src/overlay/README.md @@ -86,6 +86,14 @@ export default { | ------- | ------------ | | default | Default slot | +### Types + +The component exports the following type definitions: + +```ts +import type { OverlayProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/overlay/README.zh-CN.md b/packages/vant/src/overlay/README.zh-CN.md index 219c0813c..73bdd2c84 100644 --- a/packages/vant/src/overlay/README.zh-CN.md +++ b/packages/vant/src/overlay/README.zh-CN.md @@ -88,6 +88,14 @@ export default { | ------- | ---------------------------------- | | default | 默认插槽，用于在遮罩层上方嵌入内容 | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { OverlayProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/pagination/Pagination.tsx b/packages/vant/src/pagination/Pagination.tsx index 0eceb279c..1ecc4a0cc 100644 --- a/packages/vant/src/pagination/Pagination.tsx +++ b/packages/vant/src/pagination/Pagination.tsx @@ -1,4 +1,4 @@ -import { computed, watch, defineComponent } from 'vue'; +import { computed, watch, defineComponent, ExtractPropTypes } from 'vue'; import { BORDER, makeStringProp, @@ -23,20 +23,24 @@ const makePage = ( export type PaginationMode = 'simple' | 'multi'; +const paginationProps = { + mode: makeStringProp('multi'), + prevText: String, + nextText: String, + pageCount: makeNumericProp(0), + modelValue: makeNumberProp(0), + totalItems: makeNumericProp(0), + showPageSize: makeNumericProp(5), + itemsPerPage: makeNumericProp(10), + forceEllipses: Boolean, +}; + +export type PaginationProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - mode: makeStringProp('multi'), - prevText: String, - nextText: String, - pageCount: makeNumericProp(0), - modelValue: makeNumberProp(0), - totalItems: makeNumericProp(0), - showPageSize: makeNumericProp(5), - itemsPerPage: makeNumericProp(10), - forceEllipses: Boolean, - }, + props: paginationProps, emits: ['change', 'update:modelValue'], diff --git a/packages/vant/src/pagination/README.md b/packages/vant/src/pagination/README.md index 82c0bc66d..bfdd60f04 100644 --- a/packages/vant/src/pagination/README.md +++ b/packages/vant/src/pagination/README.md @@ -101,7 +101,7 @@ export default { The component exports the following type definitions: ```ts -import type { PaginationMode } from 'vant'; +import type { PaginationMode, PaginationProps } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/pagination/README.zh-CN.md b/packages/vant/src/pagination/README.zh-CN.md index e3b100538..6e9cab201 100644 --- a/packages/vant/src/pagination/README.zh-CN.md +++ b/packages/vant/src/pagination/README.zh-CN.md @@ -109,7 +109,7 @@ export default { 组件导出以下类型定义： ```ts -import type { PaginationMode } from 'vant'; +import type { PaginationMode, PaginationProps } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/pagination/index.ts b/packages/vant/src/pagination/index.ts index 7404377e1..8f1e1f7c2 100644 --- a/packages/vant/src/pagination/index.ts +++ b/packages/vant/src/pagination/index.ts @@ -3,4 +3,4 @@ import _Pagination from './Pagination'; export const Pagination = withInstall(_Pagination); export default Pagination; -export type { PaginationMode } from './Pagination'; +export type { PaginationMode, PaginationProps } from './Pagination'; diff --git a/packages/vant/src/picker/Picker.tsx b/packages/vant/src/picker/Picker.tsx index efb56b0f2..8b4fa1dc4 100644 --- a/packages/vant/src/picker/Picker.tsx +++ b/packages/vant/src/picker/Picker.tsx @@ -40,7 +40,7 @@ import type { const [name, bem, t] = createNamespace('picker'); -export const pickerProps = { +export const pickerSharedProps = { title: String, loading: Boolean, readonly: Boolean, @@ -53,20 +53,22 @@ export const pickerProps = { confirmButtonText: String, }; +const pickerProps = extend({}, pickerSharedProps, { + columns: makeArrayProp(), + // @deprecated + // should be removed in next major version + valueKey: String, + defaultIndex: makeNumericProp(0), + toolbarPosition: makeStringProp('top'), + columnsFieldNames: Object as PropType, +}); + export type PickerProps = ExtractPropTypes; export default defineComponent({ name, - props: extend({}, pickerProps, { - columns: makeArrayProp(), - // @deprecated - // should be removed in next major version - valueKey: String, - defaultIndex: makeNumericProp(0), - toolbarPosition: makeStringProp('top'), - columnsFieldNames: Object as PropType, - }), + props: pickerProps, emits: ['confirm', 'cancel', 'change'], diff --git a/packages/vant/src/popover/Popover.tsx b/packages/vant/src/popover/Popover.tsx index 276acb3ec..194ba5d03 100644 --- a/packages/vant/src/popover/Popover.tsx +++ b/packages/vant/src/popover/Popover.tsx @@ -8,6 +8,7 @@ import { TeleportProps, onBeforeUnmount, defineComponent, + ExtractPropTypes, } from 'vue'; import { Instance, createPopper, offsetModifier } from '@vant/popperjs'; @@ -32,6 +33,14 @@ import { useClickAway } from '@vant/use'; import { Icon } from '../icon'; import { Popup } from '../popup'; +// Types +import { + PopoverTheme, + PopoverAction, + PopoverTrigger, + PopoverPlacement, +} from './types'; + const [name, bem] = createNamespace('popover'); const popupProps = [ @@ -44,58 +53,37 @@ const popupProps = [ 'closeOnClickOverlay', ] as const; -export type PopoverTheme = 'light' | 'dark'; -export type PopoverTrigger = 'manual' | 'click'; -export type PopoverPlacement = - | 'top' - | 'top-start' - | 'top-end' - | 'left' - | 'left-start' - | 'left-end' - | 'right' - | 'right-start' - | 'right-end' - | 'bottom' - | 'bottom-start' - | 'bottom-end'; - -export type PopoverAction = { - text: string; - icon?: string; - color?: string; - disabled?: boolean; - className?: string; - [key: PropertyKey]: any; +const popoverProps = { + show: Boolean, + theme: makeStringProp('light'), + overlay: Boolean, + actions: makeArrayProp(), + trigger: makeStringProp('click'), + duration: numericProp, + showArrow: truthProp, + placement: makeStringProp('bottom'), + iconPrefix: String, + overlayClass: unknownProp, + overlayStyle: Object as PropType, + closeOnClickAction: truthProp, + closeOnClickOverlay: truthProp, + closeOnClickOutside: truthProp, + offset: { + type: Array as unknown as PropType<[number, number]>, + default: () => [0, 8], + }, + teleport: { + type: [String, Object] as PropType, + default: 'body', + }, }; +export type PopoverProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - show: Boolean, - theme: makeStringProp('light'), - overlay: Boolean, - actions: makeArrayProp(), - trigger: makeStringProp('click'), - duration: numericProp, - showArrow: truthProp, - placement: makeStringProp('bottom'), - iconPrefix: String, - overlayClass: unknownProp, - overlayStyle: Object as PropType, - closeOnClickAction: truthProp, - closeOnClickOverlay: truthProp, - closeOnClickOutside: truthProp, - offset: { - type: Array as unknown as PropType<[number, number]>, - default: () => [0, 8], - }, - teleport: { - type: [String, Object] as PropType, - default: 'body', - }, - }, + props: popoverProps, emits: ['select', 'touchstart', 'update:show'], diff --git a/packages/vant/src/popover/README.md b/packages/vant/src/popover/README.md index a9a8d4ea9..62c00054c 100644 --- a/packages/vant/src/popover/README.md +++ b/packages/vant/src/popover/README.md @@ -261,6 +261,7 @@ The component exports the following type definitions: ```ts import type { + PopoverProps, PopoverTheme, PopoverAction, PopoverTrigger, diff --git a/packages/vant/src/popover/README.zh-CN.md b/packages/vant/src/popover/README.zh-CN.md index dfd8332a8..1fce17a51 100644 --- a/packages/vant/src/popover/README.zh-CN.md +++ b/packages/vant/src/popover/README.zh-CN.md @@ -273,6 +273,7 @@ export default { ```ts import type { + PopoverProps, PopoverTheme, PopoverAction, PopoverTrigger, diff --git a/packages/vant/src/popover/index.ts b/packages/vant/src/popover/index.ts index b185fa896..38dd2ce61 100644 --- a/packages/vant/src/popover/index.ts +++ b/packages/vant/src/popover/index.ts @@ -3,9 +3,10 @@ import _Popover from './Popover'; export const Popover = withInstall(_Popover); export default Popover; +export type { PopoverProps } from './Popover'; export type { PopoverTheme, PopoverAction, PopoverTrigger, PopoverPlacement, -} from './Popover'; +} from './types'; diff --git a/packages/vant/src/popover/types.ts b/packages/vant/src/popover/types.ts new file mode 100644 index 000000000..622d902d8 --- /dev/null +++ b/packages/vant/src/popover/types.ts @@ -0,0 +1,24 @@ +export type PopoverTheme = 'light' | 'dark'; +export type PopoverTrigger = 'manual' | 'click'; +export type PopoverPlacement = + | 'top' + | 'top-start' + | 'top-end' + | 'left' + | 'left-start' + | 'left-end' + | 'right' + | 'right-start' + | 'right-end' + | 'bottom' + | 'bottom-start' + | 'bottom-end'; + +export type PopoverAction = { + text: string; + icon?: string; + color?: string; + disabled?: boolean; + className?: string; + [key: PropertyKey]: any; +}; diff --git a/packages/vant/src/popup/Popup.tsx b/packages/vant/src/popup/Popup.tsx index 51010ea33..d81daf252 100644 --- a/packages/vant/src/popup/Popup.tsx +++ b/packages/vant/src/popup/Popup.tsx @@ -10,6 +10,7 @@ import { CSSProperties, onDeactivated, defineComponent, + ExtractPropTypes, } from 'vue'; // Utils @@ -41,6 +42,20 @@ export type PopupCloseIconPosition = | 'bottom-left' | 'bottom-right'; +const popupProps = extend({}, popupSharedProps, { + round: Boolean, + position: makeStringProp('center'), + closeIcon: makeStringProp('cross'), + closeable: Boolean, + transition: String, + iconPrefix: String, + closeOnPopstate: Boolean, + closeIconPosition: makeStringProp('top-right'), + safeAreaInsetBottom: Boolean, +}); + +export type PopupProps = ExtractPropTypes; + const [name, bem] = createNamespace('popup'); let globalZIndex = 2000; @@ -50,17 +65,7 @@ export default defineComponent({ inheritAttrs: false, - props: extend({}, popupSharedProps, { - round: Boolean, - position: makeStringProp('center'), - closeIcon: makeStringProp('cross'), - closeable: Boolean, - transition: String, - iconPrefix: String, - closeOnPopstate: Boolean, - closeIconPosition: makeStringProp('top-right'), - safeAreaInsetBottom: Boolean, - }), + props: popupProps, emits: [ 'open', diff --git a/packages/vant/src/popup/README.md b/packages/vant/src/popup/README.md index 137f81d38..81280dea2 100644 --- a/packages/vant/src/popup/README.md +++ b/packages/vant/src/popup/README.md @@ -151,7 +151,7 @@ Use `teleport` prop to specify mount location. The component exports the following type definitions: ```ts -import type { PopupPosition, PopupCloseIconPosition } from 'vant'; +import type { PopupProps, PopupPosition, PopupCloseIconPosition } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/popup/README.zh-CN.md b/packages/vant/src/popup/README.zh-CN.md index af4f8c83c..6942f1b6a 100644 --- a/packages/vant/src/popup/README.zh-CN.md +++ b/packages/vant/src/popup/README.zh-CN.md @@ -157,7 +157,7 @@ export default { 组件导出以下类型定义： ```ts -import type { PopupPosition, PopupCloseIconPosition } from 'vant'; +import type { PopupProps, PopupPosition, PopupCloseIconPosition } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/popup/index.ts b/packages/vant/src/popup/index.ts index 7228ba773..2c8fe56f9 100644 --- a/packages/vant/src/popup/index.ts +++ b/packages/vant/src/popup/index.ts @@ -3,4 +3,8 @@ import _Popup from './Popup'; export const Popup = withInstall(_Popup); export default Popup; -export type { PopupPosition, PopupCloseIconPosition } from './Popup'; +export type { + PopupProps, + PopupPosition, + PopupCloseIconPosition, +} from './Popup'; diff --git a/packages/vant/src/progress/Progress.tsx b/packages/vant/src/progress/Progress.tsx index 20ab46e42..f9a2a9dda 100644 --- a/packages/vant/src/progress/Progress.tsx +++ b/packages/vant/src/progress/Progress.tsx @@ -3,7 +3,7 @@ import { addUnit, truthProp, numericProp, createNamespace } from '../utils'; const [name, bem] = createNamespace('progress'); -const props = { +const progressProps = { color: String, inactive: Boolean, pivotText: String, @@ -19,12 +19,12 @@ const props = { }, }; -export type ProgressProps = ExtractPropTypes; +export type ProgressProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: progressProps, setup(props) { const background = computed(() => diff --git a/packages/vant/src/pull-refresh/PullRefresh.tsx b/packages/vant/src/pull-refresh/PullRefresh.tsx index a463146d3..e586b5b40 100644 --- a/packages/vant/src/pull-refresh/PullRefresh.tsx +++ b/packages/vant/src/pull-refresh/PullRefresh.tsx @@ -1,4 +1,11 @@ -import { ref, watch, reactive, nextTick, defineComponent } from 'vue'; +import { + ref, + watch, + reactive, + nextTick, + defineComponent, + ExtractPropTypes, +} from 'vue'; // Utils import { @@ -28,21 +35,25 @@ type PullRefreshStatus = | 'pulling' | 'success'; +const pullRefreshProps = { + disabled: Boolean, + modelValue: Boolean, + headHeight: makeNumericProp(DEFAULT_HEAD_HEIGHT), + successText: String, + pullingText: String, + loosingText: String, + loadingText: String, + pullDistance: numericProp, + successDuration: makeNumericProp(500), + animationDuration: makeNumericProp(300), +}; + +export type PullRefreshProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - disabled: Boolean, - modelValue: Boolean, - headHeight: makeNumericProp(DEFAULT_HEAD_HEIGHT), - successText: String, - pullingText: String, - loosingText: String, - loadingText: String, - pullDistance: numericProp, - successDuration: makeNumericProp(500), - animationDuration: makeNumericProp(300), - }, + props: pullRefreshProps, emits: ['refresh', 'update:modelValue'], diff --git a/packages/vant/src/pull-refresh/README.md b/packages/vant/src/pull-refresh/README.md index a0260c516..148c47dc1 100644 --- a/packages/vant/src/pull-refresh/README.md +++ b/packages/vant/src/pull-refresh/README.md @@ -126,14 +126,22 @@ Use slots to custom tips. ### Slots -| Name | Description | SlotProps | -| ------- | ------------------------------------- | ------------ | -| default | Default slot | - | -| normal | Content of head when at normal status | - | -| pulling | Content of head when at pulling | { distance } | -| loosing | Content of head when at loosing | { distance } | -| loading | Content of head when at loading | { distance } | -| success | Content of head when succeed | - | +| Name | Description | SlotProps | +| ------- | ------------------------------------- | ---------------------- | +| default | Default slot | - | +| normal | Content of head when at normal status | - | +| pulling | Content of head when at pulling | _{ distance: number }_ | +| loosing | Content of head when at loosing | _{ distance: number }_ | +| loading | Content of head when at loading | _{ distance: number }_ | +| success | Content of head when succeed | - | + +### Types + +The component exports the following type definitions: + +```ts +import type { PullRefreshProps } from 'vant'; +``` ## Theming diff --git a/packages/vant/src/pull-refresh/README.zh-CN.md b/packages/vant/src/pull-refresh/README.zh-CN.md index 0705372ef..5bf8982c2 100644 --- a/packages/vant/src/pull-refresh/README.zh-CN.md +++ b/packages/vant/src/pull-refresh/README.zh-CN.md @@ -129,14 +129,22 @@ export default { ### Slots -| 名称 | 说明 | 参数 | -| ------- | -------------------- | -------------------------- | -| default | 自定义内容 | - | -| normal | 非下拉状态时顶部内容 | - | -| pulling | 下拉过程中顶部内容 | { distance: 当前下拉距离 } | -| loosing | 释放过程中顶部内容 | { distance: 当前下拉距离 } | -| loading | 加载过程中顶部内容 | { distance: 当前下拉距离 } | -| success | 刷新成功提示内容 | - | +| 名称 | 说明 | 参数 | +| ------- | -------------------- | ---------------------- | +| default | 自定义内容 | - | +| normal | 非下拉状态时顶部内容 | - | +| pulling | 下拉过程中顶部内容 | _{ distance: number }_ | +| loosing | 释放过程中顶部内容 | _{ distance: number }_ | +| loading | 加载过程中顶部内容 | _{ distance: number }_ | +| success | 刷新成功提示内容 | - | + +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { PullRefreshProps } from 'vant'; +``` ## 主题定制 diff --git a/packages/vant/src/pull-refresh/index.ts b/packages/vant/src/pull-refresh/index.ts index ad9f4cfec..5d15eec0b 100644 --- a/packages/vant/src/pull-refresh/index.ts +++ b/packages/vant/src/pull-refresh/index.ts @@ -3,3 +3,4 @@ import _PullRefresh from './PullRefresh'; export const PullRefresh = withInstall(_PullRefresh); export default PullRefresh; +export type { PullRefreshProps } from './PullRefresh'; diff --git a/packages/vant/src/radio-group/RadioGroup.tsx b/packages/vant/src/radio-group/RadioGroup.tsx index 6eff65b06..0cb833199 100644 --- a/packages/vant/src/radio-group/RadioGroup.tsx +++ b/packages/vant/src/radio-group/RadioGroup.tsx @@ -13,7 +13,7 @@ const [name, bem] = createNamespace('radio-group'); export type RadioGroupDirection = CheckerDirection; -const props = { +const radioGroupProps = { disabled: Boolean, iconSize: numericProp, direction: String as PropType, @@ -21,8 +21,10 @@ const props = { checkedColor: String, }; +export type RadioGroupProps = ExtractPropTypes; + export type RadioGroupProvide = { - props: ExtractPropTypes; + props: RadioGroupProps; updateValue: (value: unknown) => void; }; @@ -31,7 +33,7 @@ export const RADIO_KEY: InjectionKey = Symbol(name); export default defineComponent({ name, - props, + props: radioGroupProps, emits: ['change', 'update:modelValue'], diff --git a/packages/vant/src/radio-group/index.ts b/packages/vant/src/radio-group/index.ts index d2c910819..d9a784c40 100644 --- a/packages/vant/src/radio-group/index.ts +++ b/packages/vant/src/radio-group/index.ts @@ -1,6 +1,6 @@ import { withInstall } from '../utils'; -import _RadioGroup, { RadioGroupDirection } from './RadioGroup'; +import _RadioGroup from './RadioGroup'; export const RadioGroup = withInstall(_RadioGroup); export default RadioGroup; -export type { RadioGroupDirection }; +export type { RadioGroupProps, RadioGroupDirection } from './RadioGroup'; diff --git a/packages/vant/src/radio/README.md b/packages/vant/src/radio/README.md index 422e2c190..2ce13cff4 100644 --- a/packages/vant/src/radio/README.md +++ b/packages/vant/src/radio/README.md @@ -161,7 +161,13 @@ export default { The component exports the following type definitions: ```ts -import type { RadioShape, RadioLabelPosition, RadioGroupDirection } from 'vant'; +import type { + RadioProps, + RadioShape, + RadioGroupProps, + RadioLabelPosition, + RadioGroupDirection, +} from 'vant'; ``` ## API diff --git a/packages/vant/src/radio/README.zh-CN.md b/packages/vant/src/radio/README.zh-CN.md index c527d45b6..c78bc908b 100644 --- a/packages/vant/src/radio/README.zh-CN.md +++ b/packages/vant/src/radio/README.zh-CN.md @@ -218,7 +218,13 @@ export default { 组件导出以下类型定义： ```ts -import type { RadioShape, RadioLabelPosition, RadioGroupDirection } from 'vant'; +import type { + RadioProps, + RadioShape, + RadioGroupProps, + RadioLabelPosition, + RadioGroupDirection, +} from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/radio/Radio.tsx b/packages/vant/src/radio/Radio.tsx index 86e55cef4..2fbf993a9 100644 --- a/packages/vant/src/radio/Radio.tsx +++ b/packages/vant/src/radio/Radio.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; // Utils import { pick, createNamespace } from '../utils'; @@ -16,6 +16,7 @@ import Checker, { export type RadioShape = CheckerShape; export type RadioLabelPosition = CheckerLabelPosition; +export type RadioProps = ExtractPropTypes; const [name, bem] = createNamespace('radio'); diff --git a/packages/vant/src/radio/index.ts b/packages/vant/src/radio/index.ts index 517711c5d..f8c466708 100644 --- a/packages/vant/src/radio/index.ts +++ b/packages/vant/src/radio/index.ts @@ -1,6 +1,6 @@ import { withInstall } from '../utils'; -import _Radio, { RadioShape, RadioLabelPosition } from './Radio'; +import _Radio from './Radio'; export const Radio = withInstall(_Radio); export default Radio; -export type { RadioShape, RadioLabelPosition }; +export type { RadioProps, RadioShape, RadioLabelPosition } from './Radio'; diff --git a/packages/vant/src/rate/README.md b/packages/vant/src/rate/README.md index cd55e0464..8a1dafb60 100644 --- a/packages/vant/src/rate/README.md +++ b/packages/vant/src/rate/README.md @@ -150,9 +150,17 @@ export default { ### Events -| Event | Description | Parameters | -| ------ | ------------------------- | ------------ | -| change | Emitted when rate changed | current rate | +| Event | Description | Parameters | +| ------ | ------------------------- | ---------------------- | +| change | Emitted when rate changed | _currentValue: number_ | + +### Types + +The component exports the following type definitions: + +```ts +import type { RateProps } from 'vant'; +``` ## Theming diff --git a/packages/vant/src/rate/README.zh-CN.md b/packages/vant/src/rate/README.zh-CN.md index 0ea3669e8..5bdce8058 100644 --- a/packages/vant/src/rate/README.zh-CN.md +++ b/packages/vant/src/rate/README.zh-CN.md @@ -168,9 +168,17 @@ export default { ### Events -| 事件名 | 说明 | 回调参数 | -| ------ | ------------------------ | -------- | -| change | 当前分值变化时触发的事件 | 当前分值 | +| 事件名 | 说明 | 回调参数 | +| ------ | ------------------------ | ---------------------- | +| change | 当前分值变化时触发的事件 | _currentValue: number_ | + +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { RateProps } from 'vant'; +``` ## 主题定制 diff --git a/packages/vant/src/rate/Rate.tsx b/packages/vant/src/rate/Rate.tsx index adad928ce..ed8ce3ec0 100644 --- a/packages/vant/src/rate/Rate.tsx +++ b/packages/vant/src/rate/Rate.tsx @@ -1,4 +1,4 @@ -import { computed, defineComponent } from 'vue'; +import { computed, defineComponent, ExtractPropTypes } from 'vue'; // Utils import { @@ -54,25 +54,29 @@ function getRateStatus( return { status: 'void', value: 0 }; } +const rateProps = { + size: numericProp, + icon: makeStringProp('star'), + color: String, + count: makeNumericProp(5), + gutter: numericProp, + readonly: Boolean, + disabled: Boolean, + voidIcon: makeStringProp('star-o'), + allowHalf: Boolean, + voidColor: String, + touchable: truthProp, + iconPrefix: String, + modelValue: makeNumberProp(0), + disabledColor: String, +}; + +export type RateProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - size: numericProp, - icon: makeStringProp('star'), - color: String, - count: makeNumericProp(5), - gutter: numericProp, - readonly: Boolean, - disabled: Boolean, - voidIcon: makeStringProp('star-o'), - allowHalf: Boolean, - voidColor: String, - touchable: truthProp, - iconPrefix: String, - modelValue: makeNumberProp(0), - disabledColor: String, - }, + props: rateProps, emits: ['change', 'update:modelValue'], diff --git a/packages/vant/src/rate/index.ts b/packages/vant/src/rate/index.ts index 5d3541a7a..2f4b82b3e 100644 --- a/packages/vant/src/rate/index.ts +++ b/packages/vant/src/rate/index.ts @@ -3,3 +3,4 @@ import _Rate from './Rate'; export const Rate = withInstall(_Rate); export default Rate; +export type { RateProps } from './Rate'; diff --git a/packages/vant/src/row/Row.tsx b/packages/vant/src/row/Row.tsx index 98fc42130..d2e9b75a0 100644 --- a/packages/vant/src/row/Row.tsx +++ b/packages/vant/src/row/Row.tsx @@ -4,6 +4,7 @@ import { ComputedRef, InjectionKey, defineComponent, + ExtractPropTypes, } from 'vue'; import { truthProp, @@ -32,16 +33,20 @@ export type RowJustify = | 'space-around' | 'space-between'; +const rowProps = { + tag: makeStringProp('div'), + wrap: truthProp, + align: String as PropType, + gutter: makeNumericProp(0), + justify: String as PropType, +}; + +export type RowProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - tag: makeStringProp('div'), - wrap: truthProp, - align: String as PropType, - gutter: makeNumericProp(0), - justify: String as PropType, - }, + props: rowProps, setup(props, { slots }) { const { children, linkChildren } = useChildren(ROW_KEY); diff --git a/packages/vant/src/row/index.ts b/packages/vant/src/row/index.ts index 17f8e71e5..93208ec39 100644 --- a/packages/vant/src/row/index.ts +++ b/packages/vant/src/row/index.ts @@ -3,4 +3,4 @@ import _Row from './Row'; export const Row = withInstall(_Row); export default Row; -export type { RowAlign, RowJustify } from './Row'; +export type { RowProps, RowAlign, RowJustify } from './Row'; diff --git a/packages/vant/src/search/Search.tsx b/packages/vant/src/search/Search.tsx index 79b393283..8161cb337 100644 --- a/packages/vant/src/search/Search.tsx +++ b/packages/vant/src/search/Search.tsx @@ -22,7 +22,7 @@ import type { SearchShape } from './types'; const [name, bem, t] = createNamespace('search'); -const props = extend({}, fieldSharedProps, { +const searchProps = extend({}, fieldSharedProps, { label: String, shape: makeStringProp('square'), leftIcon: makeStringProp('search'), @@ -32,12 +32,12 @@ const props = extend({}, fieldSharedProps, { showAction: Boolean, }); -export type SearchProps = ExtractPropTypes; +export type SearchProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: searchProps, emits: ['search', 'cancel', 'update:modelValue'], diff --git a/packages/vant/src/share-sheet/README.md b/packages/vant/src/share-sheet/README.md index c5eeb09ef..1300b6e5b 100644 --- a/packages/vant/src/share-sheet/README.md +++ b/packages/vant/src/share-sheet/README.md @@ -220,7 +220,11 @@ export default { The component exports the following type definitions: ```ts -import type { ShareSheetOption, ShareSheetOptions } from 'vant'; +import type { + ShareSheetProps, + ShareSheetOption, + ShareSheetOptions, +} from 'vant'; ``` ## Theming diff --git a/packages/vant/src/share-sheet/README.zh-CN.md b/packages/vant/src/share-sheet/README.zh-CN.md index 9bc052e68..34739c254 100644 --- a/packages/vant/src/share-sheet/README.zh-CN.md +++ b/packages/vant/src/share-sheet/README.zh-CN.md @@ -234,7 +234,11 @@ export default { 组件导出以下类型定义： ```ts -import type { ShareSheetOption, ShareSheetOptions } from 'vant'; +import type { + ShareSheetProps, + ShareSheetOption, + ShareSheetOptions, +} from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/share-sheet/ShareSheet.tsx b/packages/vant/src/share-sheet/ShareSheet.tsx index 984b0565b..4a4c0103c 100644 --- a/packages/vant/src/share-sheet/ShareSheet.tsx +++ b/packages/vant/src/share-sheet/ShareSheet.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; // Utils import { @@ -33,7 +33,7 @@ const PRESET_ICONS = [ 'wechat-moments', ]; -const popupKeys = [ +const popupInheritKeys = [ ...popupSharedPropKeys, 'round', 'closeOnPopstate', @@ -49,18 +49,22 @@ function getIconURL(icon: string) { const [name, bem, t] = createNamespace('share-sheet'); +const shareSheetProps = extend({}, popupSharedProps, { + title: String, + round: truthProp, + options: makeArrayProp(), + cancelText: String, + description: String, + closeOnPopstate: truthProp, + safeAreaInsetBottom: truthProp, +}); + +export type ShareSheetProps = ExtractPropTypes; + export default defineComponent({ name, - props: extend({}, popupSharedProps, { - title: String, - round: truthProp, - options: makeArrayProp(), - cancelText: String, - description: String, - closeOnPopstate: truthProp, - safeAreaInsetBottom: truthProp, - }), + props: shareSheetProps, emits: ['cancel', 'select', 'update:show'], @@ -141,7 +145,7 @@ export default defineComponent({ class={bem()} position="bottom" onUpdate:show={updateShow} - {...pick(props, popupKeys)} + {...pick(props, popupInheritKeys)} > {renderHeader()} {renderRows()} diff --git a/packages/vant/src/share-sheet/index.ts b/packages/vant/src/share-sheet/index.ts index 6eda49844..4bc47ab45 100644 --- a/packages/vant/src/share-sheet/index.ts +++ b/packages/vant/src/share-sheet/index.ts @@ -3,4 +3,8 @@ import _ShareSheet from './ShareSheet'; export const ShareSheet = withInstall(_ShareSheet); export default ShareSheet; -export type { ShareSheetOption, ShareSheetOptions } from './ShareSheet'; +export type { + ShareSheetProps, + ShareSheetOption, + ShareSheetOptions, +} from './ShareSheet'; diff --git a/packages/vant/src/sidebar-item/SidebarItem.tsx b/packages/vant/src/sidebar-item/SidebarItem.tsx index 36ec9cbc4..477389527 100644 --- a/packages/vant/src/sidebar-item/SidebarItem.tsx +++ b/packages/vant/src/sidebar-item/SidebarItem.tsx @@ -1,4 +1,4 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; // Utils import { extend, numericProp, createNamespace } from '../utils'; @@ -13,15 +13,19 @@ import { Badge } from '../badge'; const [name, bem] = createNamespace('sidebar-item'); +const sidebarItemProps = extend({}, routeProps, { + dot: Boolean, + title: String, + badge: numericProp, + disabled: Boolean, +}); + +export type SidebarItemProps = ExtractPropTypes; + export default defineComponent({ name, - props: extend({}, routeProps, { - dot: Boolean, - title: String, - badge: numericProp, - disabled: Boolean, - }), + props: sidebarItemProps, emits: ['click'], diff --git a/packages/vant/src/sidebar-item/index.ts b/packages/vant/src/sidebar-item/index.ts index f7d1738fc..cf9f40f5e 100644 --- a/packages/vant/src/sidebar-item/index.ts +++ b/packages/vant/src/sidebar-item/index.ts @@ -3,3 +3,4 @@ import _SidebarItem from './SidebarItem'; export const SidebarItem = withInstall(_SidebarItem); export default SidebarItem; +export type { SidebarItemProps } from './SidebarItem'; diff --git a/packages/vant/src/sidebar/README.md b/packages/vant/src/sidebar/README.md index fde37d936..12d396c58 100644 --- a/packages/vant/src/sidebar/README.md +++ b/packages/vant/src/sidebar/README.md @@ -124,6 +124,14 @@ export default { | ----- | ----------------- | | title | Custom item title | +### Types + +The component exports the following type definitions: + +```ts +import type { SidebarProps, SidebarItemProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/sidebar/README.zh-CN.md b/packages/vant/src/sidebar/README.zh-CN.md index e7a5a656b..c8e03f77b 100644 --- a/packages/vant/src/sidebar/README.zh-CN.md +++ b/packages/vant/src/sidebar/README.zh-CN.md @@ -132,6 +132,14 @@ export default { | ----- | ----------- | | title | 自定义标题 | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { SidebarProps, SidebarItemProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/sidebar/Sidebar.tsx b/packages/vant/src/sidebar/Sidebar.tsx index cff81cd39..833b7c649 100644 --- a/packages/vant/src/sidebar/Sidebar.tsx +++ b/packages/vant/src/sidebar/Sidebar.tsx @@ -1,4 +1,4 @@ -import { defineComponent, InjectionKey } from 'vue'; +import { defineComponent, InjectionKey, ExtractPropTypes } from 'vue'; import { makeNumericProp, createNamespace } from '../utils'; import { useChildren } from '@vant/use'; @@ -11,12 +11,16 @@ export type SidebarProvide = { export const SIDEBAR_KEY: InjectionKey = Symbol(name); +const sidebarProps = { + modelValue: makeNumericProp(0), +}; + +export type SidebarProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - modelValue: makeNumericProp(0), - }, + props: sidebarProps, emits: ['change', 'update:modelValue'], diff --git a/packages/vant/src/sidebar/index.ts b/packages/vant/src/sidebar/index.ts index c80462b09..21e161f17 100644 --- a/packages/vant/src/sidebar/index.ts +++ b/packages/vant/src/sidebar/index.ts @@ -3,3 +3,4 @@ import _Sidebar from './Sidebar'; export const Sidebar = withInstall(_Sidebar); export default Sidebar; +export type { SidebarProps } from './Sidebar'; diff --git a/packages/vant/src/skeleton/README.md b/packages/vant/src/skeleton/README.md index 59e94677e..05c006f90 100644 --- a/packages/vant/src/skeleton/README.md +++ b/packages/vant/src/skeleton/README.md @@ -78,7 +78,7 @@ export default { The component exports the following type definitions: ```ts -import type { SkeletonAvatarShape } from 'vant'; +import type { SkeletonProps, SkeletonAvatarShape } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/skeleton/README.zh-CN.md b/packages/vant/src/skeleton/README.zh-CN.md index 532cb1779..32267cdd1 100644 --- a/packages/vant/src/skeleton/README.zh-CN.md +++ b/packages/vant/src/skeleton/README.zh-CN.md @@ -84,7 +84,7 @@ export default { 组件导出以下类型定义： ```ts -import type { SkeletonAvatarShape } from 'vant'; +import type { SkeletonProps, SkeletonAvatarShape } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/skeleton/Skeleton.tsx b/packages/vant/src/skeleton/Skeleton.tsx index 10cc41c66..98ec88811 100644 --- a/packages/vant/src/skeleton/Skeleton.tsx +++ b/packages/vant/src/skeleton/Skeleton.tsx @@ -1,4 +1,4 @@ -import { PropType, defineComponent } from 'vue'; +import { PropType, defineComponent, ExtractPropTypes } from 'vue'; import { addUnit, truthProp, @@ -15,26 +15,30 @@ const DEFAULT_LAST_ROW_WIDTH = '60%'; export type SkeletonAvatarShape = 'square' | 'round'; +const skeletonProps = { + row: makeNumericProp(0), + title: Boolean, + round: Boolean, + avatar: Boolean, + loading: truthProp, + animate: truthProp, + avatarSize: numericProp, + titleWidth: numericProp, + avatarShape: makeStringProp('round'), + rowWidth: { + type: [Number, String, Array] as PropType< + number | string | (number | string)[] + >, + default: DEFAULT_ROW_WIDTH, + }, +}; + +export type SkeletonProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - row: makeNumericProp(0), - title: Boolean, - round: Boolean, - avatar: Boolean, - loading: truthProp, - animate: truthProp, - avatarSize: numericProp, - titleWidth: numericProp, - avatarShape: makeStringProp('round'), - rowWidth: { - type: [Number, String, Array] as PropType< - number | string | (number | string)[] - >, - default: DEFAULT_ROW_WIDTH, - }, - }, + props: skeletonProps, setup(props, { slots }) { const renderAvatar = () => { diff --git a/packages/vant/src/skeleton/index.ts b/packages/vant/src/skeleton/index.ts index d4f86f5a6..c3669e045 100644 --- a/packages/vant/src/skeleton/index.ts +++ b/packages/vant/src/skeleton/index.ts @@ -1,6 +1,6 @@ import { withInstall } from '../utils'; -import _Skeleton, { SkeletonAvatarShape } from './Skeleton'; +import _Skeleton from './Skeleton'; export const Skeleton = withInstall(_Skeleton); export default Skeleton; -export type { SkeletonAvatarShape }; +export type { SkeletonProps, SkeletonAvatarShape } from './Skeleton'; diff --git a/packages/vant/src/slider/README.md b/packages/vant/src/slider/README.md index 7049b0289..6a8936ba8 100644 --- a/packages/vant/src/slider/README.md +++ b/packages/vant/src/slider/README.md @@ -181,6 +181,14 @@ export default { | left-button `v3.1.3` | Custom left button in range mode | _{ value: number }_ | | right-button `v3.1.3` | Custom right button in range mode | _{ value: number }_ | +### Types + +The component exports the following type definitions: + +```ts +import type { SliderProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/slider/README.zh-CN.md b/packages/vant/src/slider/README.zh-CN.md index 2a8cb981d..560c91c45 100644 --- a/packages/vant/src/slider/README.zh-CN.md +++ b/packages/vant/src/slider/README.zh-CN.md @@ -181,7 +181,15 @@ export default { | --- | --- | --- | | button | 自定义滑块按钮 | _{ value: number }_ | | left-button `v3.1.3` | 自定义左侧滑块按钮（双滑块模式下） | _{ value: number }_ | -| right-button `v3.1.3` | 自定义右侧滑块按钮 （双滑块模式下） | _{ value: number }_ | +| right-button `v3.1.3` | 自定义右侧滑块按钮（双滑块模式下） | _{ value: number }_ | + +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { SliderProps } from 'vant'; +``` ## 主题定制 diff --git a/packages/vant/src/slider/Slider.tsx b/packages/vant/src/slider/Slider.tsx index 15d1c68ff..28cefee9a 100644 --- a/packages/vant/src/slider/Slider.tsx +++ b/packages/vant/src/slider/Slider.tsx @@ -1,4 +1,11 @@ -import { ref, computed, PropType, CSSProperties, defineComponent } from 'vue'; +import { + ref, + computed, + PropType, + CSSProperties, + defineComponent, + ExtractPropTypes, +} from 'vue'; // Utils import { @@ -23,27 +30,31 @@ type NumberRange = [number, number]; type SliderValue = number | NumberRange; +const sliderProps = { + min: makeNumericProp(0), + max: makeNumericProp(100), + step: makeNumericProp(1), + range: Boolean, + reverse: Boolean, + disabled: Boolean, + readonly: Boolean, + vertical: Boolean, + barHeight: numericProp, + buttonSize: numericProp, + activeColor: String, + inactiveColor: String, + modelValue: { + type: [Number, Array] as PropType, + default: 0, + }, +}; + +export type SliderProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - min: makeNumericProp(0), - max: makeNumericProp(100), - step: makeNumericProp(1), - range: Boolean, - reverse: Boolean, - disabled: Boolean, - readonly: Boolean, - vertical: Boolean, - barHeight: numericProp, - buttonSize: numericProp, - activeColor: String, - inactiveColor: String, - modelValue: { - type: [Number, Array] as PropType, - default: 0, - }, - }, + props: sliderProps, emits: ['change', 'drag-end', 'drag-start', 'update:modelValue'], diff --git a/packages/vant/src/slider/index.ts b/packages/vant/src/slider/index.ts index f5766bf45..cf1e6d39d 100644 --- a/packages/vant/src/slider/index.ts +++ b/packages/vant/src/slider/index.ts @@ -3,3 +3,4 @@ import _Slider from './Slider'; export const Slider = withInstall(_Slider); export default Slider; +export type { SliderProps } from './Slider'; diff --git a/packages/vant/src/stepper/README.md b/packages/vant/src/stepper/README.md index b4fd8b8ae..fa24ce7a7 100644 --- a/packages/vant/src/stepper/README.md +++ b/packages/vant/src/stepper/README.md @@ -162,7 +162,7 @@ export default { The component exports the following type definitions: ```ts -import type { StepperTheme } from 'vant'; +import type { StepperTheme, StepperProps } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/stepper/README.zh-CN.md b/packages/vant/src/stepper/README.zh-CN.md index cd252ebb4..6e9d5bde4 100644 --- a/packages/vant/src/stepper/README.zh-CN.md +++ b/packages/vant/src/stepper/README.zh-CN.md @@ -182,7 +182,7 @@ export default { 组件导出以下类型定义： ```ts -import type { StepperTheme } from 'vant'; +import type { StepperTheme, StepperProps } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/stepper/Stepper.tsx b/packages/vant/src/stepper/Stepper.tsx index 3b0e1409d..ebcb7bfa5 100644 --- a/packages/vant/src/stepper/Stepper.tsx +++ b/packages/vant/src/stepper/Stepper.tsx @@ -1,4 +1,12 @@ -import { ref, watch, computed, PropType, defineComponent, nextTick } from 'vue'; +import { + ref, + watch, + computed, + PropType, + nextTick, + defineComponent, + ExtractPropTypes, +} from 'vue'; // Utils import { @@ -30,33 +38,37 @@ const isEqual = (value1?: string | number, value2?: string | number) => export type StepperTheme = 'default' | 'round'; +const stepperProps = { + min: makeNumericProp(1), + max: makeNumericProp(Infinity), + name: makeNumericProp(''), + step: makeNumericProp(1), + theme: String as PropType, + integer: Boolean, + disabled: Boolean, + showPlus: truthProp, + showMinus: truthProp, + showInput: truthProp, + longPress: truthProp, + allowEmpty: Boolean, + modelValue: numericProp, + inputWidth: numericProp, + buttonSize: numericProp, + placeholder: String, + disablePlus: Boolean, + disableMinus: Boolean, + disableInput: Boolean, + beforeChange: Function as PropType, + defaultValue: makeNumericProp(1), + decimalLength: numericProp, +}; + +export type StepperProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - min: makeNumericProp(1), - max: makeNumericProp(Infinity), - name: makeNumericProp(''), - step: makeNumericProp(1), - theme: String as PropType, - integer: Boolean, - disabled: Boolean, - showPlus: truthProp, - showMinus: truthProp, - showInput: truthProp, - longPress: truthProp, - allowEmpty: Boolean, - modelValue: numericProp, - inputWidth: numericProp, - buttonSize: numericProp, - placeholder: String, - disablePlus: Boolean, - disableMinus: Boolean, - disableInput: Boolean, - beforeChange: Function as PropType, - defaultValue: makeNumericProp(1), - decimalLength: numericProp, - }, + props: stepperProps, emits: [ 'plus', diff --git a/packages/vant/src/stepper/index.ts b/packages/vant/src/stepper/index.ts index b11af383f..69013f485 100644 --- a/packages/vant/src/stepper/index.ts +++ b/packages/vant/src/stepper/index.ts @@ -1,6 +1,6 @@ import { withInstall } from '../utils'; -import _Stepper, { StepperTheme } from './Stepper'; +import _Stepper from './Stepper'; export const Stepper = withInstall(_Stepper); export default Stepper; -export type { StepperTheme }; +export type { StepperTheme, StepperProps } from './Stepper'; diff --git a/packages/vant/src/steps/README.md b/packages/vant/src/steps/README.md index 13b43fbef..8ffbd164f 100644 --- a/packages/vant/src/steps/README.md +++ b/packages/vant/src/steps/README.md @@ -106,7 +106,7 @@ export default { The component exports the following type definitions: ```ts -import type { StepsDirection } from 'vant'; +import type { StepsProps, StepsDirection } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/steps/README.zh-CN.md b/packages/vant/src/steps/README.zh-CN.md index 3acdfacc8..e95aca2a4 100644 --- a/packages/vant/src/steps/README.zh-CN.md +++ b/packages/vant/src/steps/README.zh-CN.md @@ -112,7 +112,7 @@ export default { 组件导出以下类型定义： ```ts -import type { StepsDirection } from 'vant'; +import type { StepsProps, StepsDirection } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/steps/Steps.tsx b/packages/vant/src/steps/Steps.tsx index 6d05b4762..c31ba93a1 100644 --- a/packages/vant/src/steps/Steps.tsx +++ b/packages/vant/src/steps/Steps.tsx @@ -6,7 +6,7 @@ const [name, bem] = createNamespace('steps'); export type StepsDirection = 'horizontal' | 'vertical'; -const props = { +const stepsProps = { active: makeNumericProp(0), direction: makeStringProp('horizontal'), activeIcon: makeStringProp('checked'), @@ -17,8 +17,10 @@ const props = { inactiveColor: String, }; +export type StepsProps = ExtractPropTypes; + export type StepsProvide = { - props: ExtractPropTypes; + props: StepsProps; onClickStep: (index: number) => void; }; @@ -27,7 +29,7 @@ export const STEPS_KEY: InjectionKey = Symbol(name); export default defineComponent({ name, - props, + props: stepsProps, emits: ['click-step'], diff --git a/packages/vant/src/steps/index.ts b/packages/vant/src/steps/index.ts index 182234158..1ad29e80c 100644 --- a/packages/vant/src/steps/index.ts +++ b/packages/vant/src/steps/index.ts @@ -1,6 +1,6 @@ import { withInstall } from '../utils'; -import _Steps, { StepsDirection } from './Steps'; +import _Steps from './Steps'; export const Steps = withInstall(_Steps); export default Steps; -export type { StepsDirection }; +export type { StepsProps, StepsDirection } from './Steps'; diff --git a/packages/vant/src/sticky/README.md b/packages/vant/src/sticky/README.md index 39cbe4fa4..2618a8405 100644 --- a/packages/vant/src/sticky/README.md +++ b/packages/vant/src/sticky/README.md @@ -85,7 +85,7 @@ export default { The component exports the following type definitions: ```ts -import type { StickyPosition } from 'vant'; +import type { StickyProps, StickyPosition } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/sticky/README.zh-CN.md b/packages/vant/src/sticky/README.zh-CN.md index f3fcf73f9..ab999e24f 100644 --- a/packages/vant/src/sticky/README.zh-CN.md +++ b/packages/vant/src/sticky/README.zh-CN.md @@ -93,7 +93,7 @@ export default { 组件导出以下类型定义： ```ts -import type { StickyPosition } from 'vant'; +import type { StickyProps, StickyPosition } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/sticky/Sticky.tsx b/packages/vant/src/sticky/Sticky.tsx index b0730042a..118262d3a 100644 --- a/packages/vant/src/sticky/Sticky.tsx +++ b/packages/vant/src/sticky/Sticky.tsx @@ -6,6 +6,7 @@ import { reactive, CSSProperties, defineComponent, + ExtractPropTypes, } from 'vue'; // Utils @@ -29,16 +30,20 @@ const [name, bem] = createNamespace('sticky'); export type StickyPosition = 'top' | 'bottom'; +const stickyProps = { + zIndex: numericProp, + position: makeStringProp('top'), + container: Object as PropType, + offsetTop: makeNumericProp(0), + offsetBottom: makeNumericProp(0), +}; + +export type StickyProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - zIndex: numericProp, - position: makeStringProp('top'), - container: Object as PropType, - offsetTop: makeNumericProp(0), - offsetBottom: makeNumericProp(0), - }, + props: stickyProps, emits: ['scroll', 'change'], diff --git a/packages/vant/src/sticky/index.ts b/packages/vant/src/sticky/index.ts index dbfc5dd7f..8f18dd46e 100644 --- a/packages/vant/src/sticky/index.ts +++ b/packages/vant/src/sticky/index.ts @@ -3,4 +3,4 @@ import _Sticky from './Sticky'; export const Sticky = withInstall(_Sticky); export default Sticky; -export type { StickyPosition } from './Sticky'; +export type { StickyProps, StickyPosition } from './Sticky'; diff --git a/packages/vant/src/submit-bar/README.md b/packages/vant/src/submit-bar/README.md index d3c0b44c8..27d5394f5 100644 --- a/packages/vant/src/submit-bar/README.md +++ b/packages/vant/src/submit-bar/README.md @@ -122,6 +122,14 @@ export default { | top | Custom top content | | tip | Custom tips | +### Types + +The component exports the following type definitions: + +```ts +import type { SubmitBarProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/submit-bar/README.zh-CN.md b/packages/vant/src/submit-bar/README.zh-CN.md index 5c9723d60..48ba89889 100644 --- a/packages/vant/src/submit-bar/README.zh-CN.md +++ b/packages/vant/src/submit-bar/README.zh-CN.md @@ -129,6 +129,14 @@ export default { | top | 自定义订单栏上方内容 | | tip | 提示文案中的额外内容 | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { SubmitBarProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/submit-bar/SubmitBar.tsx b/packages/vant/src/submit-bar/SubmitBar.tsx index 21bf2d93e..50f8c7792 100644 --- a/packages/vant/src/submit-bar/SubmitBar.tsx +++ b/packages/vant/src/submit-bar/SubmitBar.tsx @@ -1,4 +1,9 @@ -import { PropType, CSSProperties, defineComponent } from 'vue'; +import { + PropType, + CSSProperties, + defineComponent, + ExtractPropTypes, +} from 'vue'; import { truthProp, makeStringProp, @@ -12,25 +17,29 @@ import { Button, ButtonType } from '../button'; const [name, bem, t] = createNamespace('submit-bar'); +const submitBarProps = { + tip: String, + label: String, + price: Number, + tipIcon: String, + loading: Boolean, + currency: makeStringProp('¥'), + disabled: Boolean, + textAlign: String as PropType, + buttonText: String, + buttonType: makeStringProp('danger'), + buttonColor: String, + suffixLabel: String, + decimalLength: makeNumericProp(2), + safeAreaInsetBottom: truthProp, +}; + +export type SubmitBarProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - tip: String, - label: String, - price: Number, - tipIcon: String, - loading: Boolean, - currency: makeStringProp('¥'), - disabled: Boolean, - textAlign: String as PropType, - buttonText: String, - buttonType: makeStringProp('danger'), - buttonColor: String, - suffixLabel: String, - decimalLength: makeNumericProp(2), - safeAreaInsetBottom: truthProp, - }, + props: submitBarProps, emits: ['submit'], diff --git a/packages/vant/src/swipe-cell/SwipeCell.tsx b/packages/vant/src/swipe-cell/SwipeCell.tsx index 0808341a6..84d3b5ce9 100644 --- a/packages/vant/src/swipe-cell/SwipeCell.tsx +++ b/packages/vant/src/swipe-cell/SwipeCell.tsx @@ -34,7 +34,7 @@ import type { const [name, bem] = createNamespace('swipe-cell'); -const props = { +const swipeCellProps = { name: makeNumericProp(''), disabled: Boolean, leftWidth: numericProp, @@ -43,12 +43,12 @@ const props = { stopPropagation: Boolean, }; -export type SwipeCellProps = ExtractPropTypes; +export type SwipeCellProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: swipeCellProps, emits: ['open', 'close', 'click'], diff --git a/packages/vant/src/swipe/Swipe.tsx b/packages/vant/src/swipe/Swipe.tsx index d36d6d9cd..b142dd175 100644 --- a/packages/vant/src/swipe/Swipe.tsx +++ b/packages/vant/src/swipe/Swipe.tsx @@ -40,7 +40,7 @@ import { SwipeState, SwipeExpose, SwipeProvide, SwipeToOptions } from './types'; const [name, bem] = createNamespace('swipe'); -const props = { +const swipeProps = { loop: truthProp, width: numericProp, height: numericProp, @@ -55,14 +55,14 @@ const props = { stopPropagation: truthProp, }; -export type SwipeProps = ExtractPropTypes; +export type SwipeProps = ExtractPropTypes; export const SWIPE_KEY: InjectionKey = Symbol(name); export default defineComponent({ name, - props, + props: swipeProps, emits: ['change'], diff --git a/packages/vant/src/switch/README.md b/packages/vant/src/switch/README.md index 725f0dea7..a360194a9 100644 --- a/packages/vant/src/switch/README.md +++ b/packages/vant/src/switch/README.md @@ -121,6 +121,14 @@ export default { | change | Emitted when check status changed | _value: any_ | | click | Emitted when component is clicked | _event: MouseEvent_ | +### Types + +The component exports the following type definitions: + +```ts +import type { SwitchProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/switch/README.zh-CN.md b/packages/vant/src/switch/README.zh-CN.md index d42d1ff9d..46b3c34b3 100644 --- a/packages/vant/src/switch/README.zh-CN.md +++ b/packages/vant/src/switch/README.zh-CN.md @@ -133,6 +133,14 @@ export default { | change | 开关状态切换时触发 | _value: any_ | | click | 点击时触发 | _event: MouseEvent_ | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { SwitchProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/switch/Switch.tsx b/packages/vant/src/switch/Switch.tsx index 6e617a50c..fcd1968af 100644 --- a/packages/vant/src/switch/Switch.tsx +++ b/packages/vant/src/switch/Switch.tsx @@ -1,29 +1,33 @@ -import { defineComponent } from 'vue'; +import { defineComponent, ExtractPropTypes } from 'vue'; import { addUnit, numericProp, unknownProp, createNamespace } from '../utils'; import { useCustomFieldValue } from '@vant/use'; import { Loading } from '../loading'; const [name, bem] = createNamespace('switch'); +const switchProps = { + size: numericProp, + loading: Boolean, + disabled: Boolean, + modelValue: unknownProp, + activeColor: String, + inactiveColor: String, + activeValue: { + type: unknownProp, + default: true as unknown, + }, + inactiveValue: { + type: unknownProp, + default: false as unknown, + }, +}; + +export type SwitchProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - size: numericProp, - loading: Boolean, - disabled: Boolean, - modelValue: unknownProp, - activeColor: String, - inactiveColor: String, - activeValue: { - type: unknownProp, - default: true as unknown, - }, - inactiveValue: { - type: unknownProp, - default: false as unknown, - }, - }, + props: switchProps, emits: ['change', 'update:modelValue'], diff --git a/packages/vant/src/switch/index.ts b/packages/vant/src/switch/index.ts index 0cec22f23..79ee15552 100644 --- a/packages/vant/src/switch/index.ts +++ b/packages/vant/src/switch/index.ts @@ -3,3 +3,4 @@ import _Switch from './Switch'; export const Switch = withInstall(_Switch); export default Switch; +export type { SwitchProps } from './Switch'; diff --git a/packages/vant/src/tab/README.md b/packages/vant/src/tab/README.md index 080fc6d8d..989e19165 100644 --- a/packages/vant/src/tab/README.md +++ b/packages/vant/src/tab/README.md @@ -286,7 +286,7 @@ Use [ref](https://v3.vuejs.org/guide/component-template-refs.html) to get Tabs i The component exports the following type definitions: ```ts -import type { TabsType, TabsProps, TabsInstance } from 'vant'; +import type { TabProps, TabsType, TabsProps, TabsInstance } from 'vant'; ``` `TabsInstance` is the type of component instance: diff --git a/packages/vant/src/tab/README.zh-CN.md b/packages/vant/src/tab/README.zh-CN.md index 948f7a3b0..ce901ae90 100644 --- a/packages/vant/src/tab/README.zh-CN.md +++ b/packages/vant/src/tab/README.zh-CN.md @@ -299,7 +299,7 @@ export default { 组件导出以下类型定义： ```ts -import type { TabsType, TabsProps, TabsInstance } from 'vant'; +import type { TabProps, TabsType, TabsProps, TabsInstance } from 'vant'; ``` `TabsInstance` 是组件实例的类型，用法如下： diff --git a/packages/vant/src/tab/Tab.tsx b/packages/vant/src/tab/Tab.tsx index b1e57f4d3..2d8272dcc 100644 --- a/packages/vant/src/tab/Tab.tsx +++ b/packages/vant/src/tab/Tab.tsx @@ -7,6 +7,7 @@ import { PropType, CSSProperties, defineComponent, + ExtractPropTypes, } from 'vue'; // Utils @@ -29,19 +30,23 @@ import { SwipeItem } from '../swipe-item'; const [name, bem] = createNamespace('tab'); +const tabProps = extend({}, routeProps, { + dot: Boolean, + name: numericProp, + badge: numericProp, + title: String, + disabled: Boolean, + titleClass: unknownProp, + titleStyle: [String, Object] as PropType, + showZeroBadge: truthProp, +}); + +export type TabProps = ExtractPropTypes; + export default defineComponent({ name, - props: extend({}, routeProps, { - dot: Boolean, - name: numericProp, - badge: numericProp, - title: String, - disabled: Boolean, - titleClass: unknownProp, - titleStyle: [String, Object] as PropType, - showZeroBadge: truthProp, - }), + props: tabProps, setup(props, { slots }) { const inited = ref(false); diff --git a/packages/vant/src/tab/index.ts b/packages/vant/src/tab/index.ts index 700864d57..1f122dfd3 100644 --- a/packages/vant/src/tab/index.ts +++ b/packages/vant/src/tab/index.ts @@ -3,3 +3,4 @@ import _Tab from './Tab'; export const Tab = withInstall(_Tab); export default Tab; +export type { TabProps } from './Tab'; diff --git a/packages/vant/src/tabbar-item/TabbarItem.tsx b/packages/vant/src/tabbar-item/TabbarItem.tsx index 5802741cd..d91f529e2 100644 --- a/packages/vant/src/tabbar-item/TabbarItem.tsx +++ b/packages/vant/src/tabbar-item/TabbarItem.tsx @@ -1,4 +1,9 @@ -import { computed, getCurrentInstance, defineComponent } from 'vue'; +import { + computed, + defineComponent, + ExtractPropTypes, + getCurrentInstance, +} from 'vue'; // Utils import { createNamespace, extend, isObject, numericProp } from '../utils'; @@ -14,16 +19,20 @@ import { Badge } from '../badge'; const [name, bem] = createNamespace('tabbar-item'); +const tabbarItemProps = extend({}, routeProps, { + dot: Boolean, + icon: String, + name: numericProp, + badge: numericProp, + iconPrefix: String, +}); + +export type TabbarItemProps = ExtractPropTypes; + export default defineComponent({ name, - props: extend({}, routeProps, { - dot: Boolean, - icon: String, - name: numericProp, - badge: numericProp, - iconPrefix: String, - }), + props: tabbarItemProps, emits: ['click'], diff --git a/packages/vant/src/tabbar-item/index.ts b/packages/vant/src/tabbar-item/index.ts index 99e55c902..5c3316093 100644 --- a/packages/vant/src/tabbar-item/index.ts +++ b/packages/vant/src/tabbar-item/index.ts @@ -3,3 +3,4 @@ import _TabbarItem from './TabbarItem'; export const TabbarItem = withInstall(_TabbarItem); export default TabbarItem; +export type { TabbarItemProps } from './TabbarItem'; diff --git a/packages/vant/src/tabbar/README.md b/packages/vant/src/tabbar/README.md index 2ebf7403e..14fec3ae7 100644 --- a/packages/vant/src/tabbar/README.md +++ b/packages/vant/src/tabbar/README.md @@ -200,6 +200,14 @@ export default { | ---- | ----------- | ----------------- | | icon | Custom icon | _active: boolean_ | +### Types + +The component exports the following type definitions: + +```ts +import type { TabbarProps, TabbarItemProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/tabbar/README.zh-CN.md b/packages/vant/src/tabbar/README.zh-CN.md index cd4ec3d6d..b505dde92 100644 --- a/packages/vant/src/tabbar/README.zh-CN.md +++ b/packages/vant/src/tabbar/README.zh-CN.md @@ -212,6 +212,14 @@ export default { | ---- | ---------- | ----------------- | | icon | 自定义图标 | _active: boolean_ | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { TabbarProps, TabbarItemProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/tabbar/Tabbar.tsx b/packages/vant/src/tabbar/Tabbar.tsx index a223a588a..22d6c5dab 100644 --- a/packages/vant/src/tabbar/Tabbar.tsx +++ b/packages/vant/src/tabbar/Tabbar.tsx @@ -24,7 +24,7 @@ import { usePlaceholder } from '../composables/use-placeholder'; const [name, bem] = createNamespace('tabbar'); -const props = { +const tabbarProps = { route: Boolean, fixed: truthProp, border: truthProp, @@ -40,8 +40,10 @@ const props = { }, }; +export type TabbarProps = ExtractPropTypes; + export type TabbarProvide = { - props: ExtractPropTypes; + props: TabbarProps; setActive: (active: number | string) => void; }; @@ -50,7 +52,7 @@ export const TABBAR_KEY: InjectionKey = Symbol(name); export default defineComponent({ name, - props, + props: tabbarProps, emits: ['change', 'update:modelValue'], diff --git a/packages/vant/src/tabbar/index.ts b/packages/vant/src/tabbar/index.ts index 1f27c0ed0..a1236a205 100644 --- a/packages/vant/src/tabbar/index.ts +++ b/packages/vant/src/tabbar/index.ts @@ -3,3 +3,4 @@ import _Tabbar from './Tabbar'; export const Tabbar = withInstall(_Tabbar); export default Tabbar; +export type { TabbarProps } from './Tabbar'; diff --git a/packages/vant/src/tabs/Tabs.tsx b/packages/vant/src/tabs/Tabs.tsx index 6586f4375..7e059a984 100644 --- a/packages/vant/src/tabs/Tabs.tsx +++ b/packages/vant/src/tabs/Tabs.tsx @@ -59,7 +59,7 @@ import type { TabsProvide, TabsType } from './types'; const [name, bem] = createNamespace('tabs'); -const props = { +const tabsProps = { type: makeStringProp('line'), color: String, border: Boolean, @@ -81,14 +81,14 @@ const props = { titleInactiveColor: String, }; -export type TabsProps = ExtractPropTypes; +export type TabsProps = ExtractPropTypes; export const TABS_KEY: InjectionKey = Symbol(name); export default defineComponent({ name, - props, + props: tabsProps, emits: [ 'click', diff --git a/packages/vant/src/tag/README.md b/packages/vant/src/tag/README.md index 8e5456088..897280c89 100644 --- a/packages/vant/src/tag/README.md +++ b/packages/vant/src/tag/README.md @@ -116,6 +116,14 @@ export default { | click | Emitted when component is clicked | _event: MouseEvent_ | | close | Emitted when close icon is clicked | _event: MouseEvent_ | +### Types + +The component exports the following type definitions: + +```ts +import type { TagSize, TagType, TagProps } from 'vant'; +``` + ## Theming ### CSS Variables diff --git a/packages/vant/src/tag/README.zh-CN.md b/packages/vant/src/tag/README.zh-CN.md index 9ffcf6322..f03aea842 100644 --- a/packages/vant/src/tag/README.zh-CN.md +++ b/packages/vant/src/tag/README.zh-CN.md @@ -130,6 +130,14 @@ export default { | click | 点击时触发 | _event: MouseEvent_ | | close | 关闭标签时触发 | _event: MouseEvent_ | +### 类型定义 + +组件导出以下类型定义： + +```ts +import type { TagSize, TagType, TagProps } from 'vant'; +``` + ## 主题定制 ### 样式变量 diff --git a/packages/vant/src/tag/Tag.tsx b/packages/vant/src/tag/Tag.tsx index a1b3cc214..5fcd94344 100644 --- a/packages/vant/src/tag/Tag.tsx +++ b/packages/vant/src/tag/Tag.tsx @@ -1,25 +1,36 @@ -import { CSSProperties, Transition, defineComponent } from 'vue'; +import { + PropType, + Transition, + CSSProperties, + defineComponent, + ExtractPropTypes, +} from 'vue'; import { truthProp, makeStringProp, createNamespace } from '../utils'; import { Icon } from '../icon'; const [name, bem] = createNamespace('tag'); +export type TagSize = 'large' | 'medium'; export type TagType = 'default' | 'primary' | 'success' | 'warning' | 'danger'; +const tagProps = { + size: String as PropType, + mark: Boolean, + show: truthProp, + type: makeStringProp('default'), + color: String, + plain: Boolean, + round: Boolean, + textColor: String, + closeable: Boolean, +}; + +export type TagProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - size: String, - mark: Boolean, - show: truthProp, - type: makeStringProp('default'), - color: String, - plain: Boolean, - round: Boolean, - textColor: String, - closeable: Boolean, - }, + props: tagProps, emits: ['close'], diff --git a/packages/vant/src/tag/index.ts b/packages/vant/src/tag/index.ts index 917c1287e..ba7e615be 100644 --- a/packages/vant/src/tag/index.ts +++ b/packages/vant/src/tag/index.ts @@ -3,3 +3,4 @@ import _Tag from './Tag'; export const Tag = withInstall(_Tag); export default Tag; +export type { TagSize, TagType, TagProps } from './Tag'; diff --git a/packages/vant/src/toast/README.md b/packages/vant/src/toast/README.md index e256aec61..c82952acc 100644 --- a/packages/vant/src/toast/README.md +++ b/packages/vant/src/toast/README.md @@ -180,7 +180,7 @@ Toast.resetDefaultOptions('loading'); The component exports the following type definitions: ```ts -import type { ToastType, ToastOptions, ToastPosition } from 'vant'; +import type { ToastType, ToastProps, ToastOptions, ToastPosition } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/toast/README.zh-CN.md b/packages/vant/src/toast/README.zh-CN.md index 2e237c4f9..ad15df2bf 100644 --- a/packages/vant/src/toast/README.zh-CN.md +++ b/packages/vant/src/toast/README.zh-CN.md @@ -191,7 +191,7 @@ Toast.resetDefaultOptions('loading'); 组件导出以下类型定义： ```ts -import type { ToastType, ToastOptions, ToastPosition } from 'vant'; +import type { ToastType, ToastProps, ToastOptions, ToastPosition } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/toast/Toast.tsx b/packages/vant/src/toast/Toast.tsx index c7a4c3e50..154ddd98b 100644 --- a/packages/vant/src/toast/Toast.tsx +++ b/packages/vant/src/toast/Toast.tsx @@ -5,6 +5,7 @@ import { onUnmounted, CSSProperties, defineComponent, + ExtractPropTypes, } from 'vue'; // Utils @@ -29,7 +30,7 @@ import type { ToastType, ToastPosition } from './types'; const [name, bem] = createNamespace('toast'); -const popupProps = [ +const popupInheritProps = [ 'show', 'overlay', 'transition', @@ -38,28 +39,32 @@ const popupProps = [ 'closeOnClickOverlay', ] as const; +const toastProps = { + icon: String, + show: Boolean, + type: makeStringProp('text'), + overlay: Boolean, + message: numericProp, + iconSize: numericProp, + duration: makeNumberProp(2000), + position: makeStringProp('middle'), + className: unknownProp, + iconPrefix: String, + transition: makeStringProp('van-fade'), + loadingType: String as PropType, + forbidClick: Boolean, + overlayClass: unknownProp, + overlayStyle: Object as PropType, + closeOnClick: Boolean, + closeOnClickOverlay: Boolean, +}; + +export type ToastProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - icon: String, - show: Boolean, - type: makeStringProp('text'), - overlay: Boolean, - message: numericProp, - iconSize: numericProp, - duration: makeNumberProp(2000), - position: makeStringProp('middle'), - className: unknownProp, - iconPrefix: String, - transition: makeStringProp('van-fade'), - loadingType: String as PropType, - forbidClick: Boolean, - overlayClass: unknownProp, - overlayStyle: Object as PropType, - closeOnClick: Boolean, - closeOnClickOverlay: Boolean, - }, + props: toastProps, emits: ['update:show'], @@ -146,7 +151,7 @@ export default defineComponent({ onClick={onClick} onClosed={clearTimer} onUpdate:show={updateShow} - {...pick(props, popupProps)} + {...pick(props, popupInheritProps)} > {renderIcon()} {renderMessage()} diff --git a/packages/vant/src/toast/index.ts b/packages/vant/src/toast/index.ts index abd4f5ef3..aeceb3d59 100644 --- a/packages/vant/src/toast/index.ts +++ b/packages/vant/src/toast/index.ts @@ -2,4 +2,5 @@ import { Toast } from './function-call'; export default Toast; export { Toast }; +export type { ToastProps } from './Toast'; export type { ToastType, ToastOptions, ToastPosition } from './types'; diff --git a/packages/vant/src/tree-select/README.md b/packages/vant/src/tree-select/README.md index cf1bfdee7..6c30d9bfd 100644 --- a/packages/vant/src/tree-select/README.md +++ b/packages/vant/src/tree-select/README.md @@ -233,7 +233,7 @@ In every tree object, `text` property defines `id` stands for the unique key whi The component exports the following type definitions: ```ts -import type { TreeSelectItem, TreeSelectChild } from 'vant'; +import type { TreeSelectItem, TreeSelectChild, TreeSelectProps } from 'vant'; ``` ## Theming diff --git a/packages/vant/src/tree-select/README.zh-CN.md b/packages/vant/src/tree-select/README.zh-CN.md index ee1e79319..75d11a824 100644 --- a/packages/vant/src/tree-select/README.zh-CN.md +++ b/packages/vant/src/tree-select/README.zh-CN.md @@ -239,7 +239,7 @@ export default { 组件导出以下类型定义： ```ts -import type { TreeSelectItem, TreeSelectChild } from 'vant'; +import type { TreeSelectItem, TreeSelectChild, TreeSelectProps } from 'vant'; ``` ## 主题定制 diff --git a/packages/vant/src/tree-select/TreeSelect.tsx b/packages/vant/src/tree-select/TreeSelect.tsx index c61c029c6..cf9e9f250 100644 --- a/packages/vant/src/tree-select/TreeSelect.tsx +++ b/packages/vant/src/tree-select/TreeSelect.tsx @@ -1,4 +1,4 @@ -import { PropType, defineComponent } from 'vue'; +import { PropType, defineComponent, ExtractPropTypes } from 'vue'; // Utils import { @@ -31,22 +31,26 @@ export type TreeSelectItem = { className?: unknown; }; +const treeSelectProps = { + max: makeNumericProp(Infinity), + items: makeArrayProp(), + height: makeNumericProp(300), + selectedIcon: makeStringProp('success'), + mainActiveIndex: makeNumericProp(0), + activeId: { + type: [Number, String, Array] as PropType< + number | string | Array + >, + default: 0, + }, +}; + +export type TreeSelectProps = ExtractPropTypes; + export default defineComponent({ name, - props: { - max: makeNumericProp(Infinity), - items: makeArrayProp(), - height: makeNumericProp(300), - selectedIcon: makeStringProp('success'), - mainActiveIndex: makeNumericProp(0), - activeId: { - type: [Number, String, Array] as PropType< - number | string | Array - >, - default: 0, - }, - }, + props: treeSelectProps, emits: [ 'click-nav', diff --git a/packages/vant/src/tree-select/index.ts b/packages/vant/src/tree-select/index.ts index aa692f146..6c8f9b859 100644 --- a/packages/vant/src/tree-select/index.ts +++ b/packages/vant/src/tree-select/index.ts @@ -3,4 +3,8 @@ import _TreeSelect from './TreeSelect'; export const TreeSelect = withInstall(_TreeSelect); export default TreeSelect; -export type { TreeSelectItem, TreeSelectChild } from './TreeSelect'; +export type { + TreeSelectItem, + TreeSelectChild, + TreeSelectProps, +} from './TreeSelect'; diff --git a/packages/vant/src/uploader/Uploader.tsx b/packages/vant/src/uploader/Uploader.tsx index 70a7874fc..d0f6caa02 100644 --- a/packages/vant/src/uploader/Uploader.tsx +++ b/packages/vant/src/uploader/Uploader.tsx @@ -50,7 +50,7 @@ import type { UploaderFileListItem, } from './types'; -const props = { +const uploaderProps = { name: makeNumericProp(''), accept: makeStringProp('image/*'), capture: String, @@ -79,12 +79,12 @@ const props = { }, }; -export type UploaderProps = ExtractPropTypes; +export type UploaderProps = ExtractPropTypes; export default defineComponent({ name, - props, + props: uploaderProps, emits: [ 'delete',