From 39a100f3a02eb9b9e292ea5a6dc0ee8cb2ce8420 Mon Sep 17 00:00:00 2001 From: neverland Date: Mon, 12 Sep 2022 10:37:24 +0800 Subject: [PATCH] feat: add themeVars type of all components (#11034) * types: add types of all theme vars * types: export all theme vars * types: add ConfigProviderThemeVars * fix: repeat key * docs: add doc --- packages/vant/src/action-bar-button/index.ts | 1 + packages/vant/src/action-bar-button/types.ts | 5 ++ packages/vant/src/action-bar-icon/index.ts | 1 + packages/vant/src/action-bar-icon/types.ts | 10 +++ packages/vant/src/action-bar/index.ts | 1 + packages/vant/src/action-bar/types.ts | 4 ++ packages/vant/src/action-sheet/index.ts | 1 + packages/vant/src/action-sheet/types.ts | 23 ++++++ packages/vant/src/address-edit/index.ts | 1 + packages/vant/src/address-edit/types.ts | 7 ++ packages/vant/src/address-list/index.ts | 1 + packages/vant/src/address-list/types.ts | 15 ++++ packages/vant/src/badge/index.ts | 1 + packages/vant/src/badge/types.ts | 12 ++++ packages/vant/src/button/index.ts | 1 + packages/vant/src/button/types.ts | 37 ++++++++++ packages/vant/src/calendar/index.ts | 1 + packages/vant/src/calendar/types.ts | 29 ++++++++ packages/vant/src/card/index.ts | 1 + packages/vant/src/card/types.ts | 18 +++++ packages/vant/src/cascader/index.ts | 6 +- packages/vant/src/cascader/types.ts | 16 +++++ packages/vant/src/cell-group/index.ts | 1 + packages/vant/src/cell-group/types.ts | 10 +++ packages/vant/src/cell/index.ts | 1 + packages/vant/src/cell/types.ts | 21 ++++++ packages/vant/src/checkbox/index.ts | 1 + packages/vant/src/checkbox/types.ts | 12 ++++ packages/vant/src/circle/index.ts | 1 + packages/vant/src/circle/types.ts | 9 +++ packages/vant/src/collapse-item/index.ts | 2 +- packages/vant/src/collapse-item/types.ts | 10 +++ packages/vant/src/config-provider/README.md | 18 ++++- .../vant/src/config-provider/README.zh-CN.md | 18 ++++- packages/vant/src/config-provider/index.ts | 1 + packages/vant/src/config-provider/types.ts | 72 +++++++++++++++++++ packages/vant/src/contact-card/index.ts | 1 + packages/vant/src/contact-card/types.ts | 6 ++ packages/vant/src/contact-edit/index.ts | 1 + packages/vant/src/contact-edit/types.ts | 8 +++ packages/vant/src/contact-list/index.ts | 1 + packages/vant/src/contact-list/types.ts | 6 ++ packages/vant/src/count-down/index.ts | 6 +- packages/vant/src/count-down/types.ts | 6 ++ packages/vant/src/coupon-cell/index.ts | 1 + packages/vant/src/coupon-cell/types.ts | 3 + packages/vant/src/coupon-list/index.ts | 1 + packages/vant/src/coupon-list/types.ts | 9 +++ packages/vant/src/coupon/index.ts | 1 + packages/vant/src/coupon/types.ts | 19 +++++ packages/vant/src/dialog/index.ts | 1 + packages/vant/src/dialog/types.ts | 22 ++++++ packages/vant/src/divider/index.ts | 1 + packages/vant/src/divider/types.ts | 10 +++ packages/vant/src/dropdown-item/index.ts | 6 +- packages/vant/src/dropdown-item/types.ts | 4 ++ packages/vant/src/dropdown-menu/index.ts | 2 +- packages/vant/src/dropdown-menu/types.ts | 14 ++++ packages/vant/src/empty/index.ts | 1 + packages/vant/src/empty/types.ts | 10 +++ packages/vant/src/field/index.ts | 1 + packages/vant/src/field/types.ts | 22 ++++++ packages/vant/src/grid-item/index.ts | 1 + packages/vant/src/grid-item/types.ts | 8 +++ packages/vant/src/image-preview/index.ts | 1 + packages/vant/src/image-preview/types.ts | 12 ++++ packages/vant/src/image/index.ts | 1 + packages/vant/src/image/types.ts | 9 +++ packages/vant/src/index-anchor/index.ts | 1 + packages/vant/src/index-anchor/types.ts | 11 +++ packages/vant/src/index-bar/index.ts | 2 +- packages/vant/src/index-bar/types.ts | 7 ++ packages/vant/src/list/index.ts | 2 +- packages/vant/src/list/types.ts | 7 ++ packages/vant/src/loading/index.ts | 1 + packages/vant/src/loading/types.ts | 7 ++ packages/vant/src/nav-bar/index.ts | 1 + packages/vant/src/nav-bar/types.ts | 10 +++ packages/vant/src/notice-bar/index.ts | 6 +- packages/vant/src/notice-bar/types.ts | 12 ++++ packages/vant/src/notify/index.ts | 2 +- packages/vant/src/notify/types.ts | 11 +++ packages/vant/src/number-keyboard/index.ts | 1 + packages/vant/src/number-keyboard/types.ts | 17 +++++ packages/vant/src/overlay/index.ts | 1 + packages/vant/src/overlay/types.ts | 4 ++ packages/vant/src/pagination/index.ts | 1 + packages/vant/src/pagination/types.ts | 11 +++ packages/vant/src/password-input/index.ts | 1 + packages/vant/src/password-input/types.ts | 17 +++++ packages/vant/src/picker-group/index.ts | 1 + packages/vant/src/picker-group/types.ts | 3 + packages/vant/src/picker/index.ts | 1 + packages/vant/src/picker/types.ts | 18 +++++ packages/vant/src/popover/index.ts | 1 + packages/vant/src/popover/types.ts | 16 +++++ packages/vant/src/popup/index.ts | 1 + packages/vant/src/popup/types.ts | 10 +++ packages/vant/src/progress/index.ts | 2 +- packages/vant/src/progress/types.ts | 12 ++++ packages/vant/src/pull-refresh/index.ts | 1 + packages/vant/src/pull-refresh/types.ts | 6 ++ packages/vant/src/radio/index.ts | 1 + packages/vant/src/radio/types.ts | 11 +++ packages/vant/src/rate/index.ts | 1 + packages/vant/src/rate/types.ts | 7 ++ packages/vant/src/search/index.ts | 2 +- packages/vant/src/search/types.ts | 14 ++++ packages/vant/src/share-sheet/index.ts | 1 + packages/vant/src/share-sheet/types.ts | 17 +++++ packages/vant/src/sidebar-item/index.ts | 1 + packages/vant/src/sidebar-item/types.ts | 15 ++++ packages/vant/src/sidebar/index.ts | 1 + packages/vant/src/sidebar/types.ts | 3 + packages/vant/src/skeleton/index.ts | 1 + packages/vant/src/skeleton/types.ts | 9 +++ packages/vant/src/slider/index.ts | 1 + packages/vant/src/slider/types.ts | 11 +++ packages/vant/src/step/index.ts | 1 + packages/vant/src/step/types.ts | 13 ++++ packages/vant/src/stepper/index.ts | 1 + packages/vant/src/stepper/types.ts | 15 ++++ packages/vant/src/steps/index.ts | 1 + packages/vant/src/steps/types.ts | 3 + packages/vant/src/sticky/index.ts | 1 + packages/vant/src/sticky/types.ts | 3 + packages/vant/src/submit-bar/index.ts | 1 + packages/vant/src/submit-bar/types.ts | 21 ++++++ packages/vant/src/swipe/index.ts | 2 +- packages/vant/src/swipe/types.ts | 9 +++ packages/vant/src/switch/index.ts | 1 + packages/vant/src/switch/types.ts | 12 ++++ packages/vant/src/tabbar-item/index.ts | 1 + packages/vant/src/tabbar-item/types.ts | 9 +++ packages/vant/src/tabbar/index.ts | 1 + packages/vant/src/tabbar/types.ts | 5 ++ packages/vant/src/tabs/index.ts | 2 +- packages/vant/src/tabs/types.ts | 15 ++++ packages/vant/src/tag/Tag.tsx | 4 +- packages/vant/src/tag/index.ts | 3 +- packages/vant/src/tag/types.ts | 22 ++++++ packages/vant/src/toast/index.ts | 7 +- packages/vant/src/toast/types.ts | 18 +++++ packages/vant/src/tree-select/index.ts | 1 + packages/vant/src/tree-select/types.ts | 10 +++ packages/vant/src/uploader/index.ts | 1 + packages/vant/src/uploader/types.ts | 28 ++++++++ 147 files changed, 1056 insertions(+), 20 deletions(-) create mode 100644 packages/vant/src/action-bar-button/types.ts create mode 100644 packages/vant/src/action-bar-icon/types.ts create mode 100644 packages/vant/src/action-bar/types.ts create mode 100644 packages/vant/src/action-sheet/types.ts create mode 100644 packages/vant/src/address-list/types.ts create mode 100644 packages/vant/src/badge/types.ts create mode 100644 packages/vant/src/card/types.ts create mode 100644 packages/vant/src/cell-group/types.ts create mode 100644 packages/vant/src/cell/types.ts create mode 100644 packages/vant/src/circle/types.ts create mode 100644 packages/vant/src/config-provider/types.ts create mode 100644 packages/vant/src/contact-card/types.ts create mode 100644 packages/vant/src/contact-edit/types.ts create mode 100644 packages/vant/src/contact-list/types.ts create mode 100644 packages/vant/src/coupon-cell/types.ts create mode 100644 packages/vant/src/coupon-list/types.ts create mode 100644 packages/vant/src/coupon/types.ts create mode 100644 packages/vant/src/divider/types.ts create mode 100644 packages/vant/src/empty/types.ts create mode 100644 packages/vant/src/grid-item/types.ts create mode 100644 packages/vant/src/image/types.ts create mode 100644 packages/vant/src/index-anchor/types.ts create mode 100644 packages/vant/src/loading/types.ts create mode 100644 packages/vant/src/nav-bar/types.ts create mode 100644 packages/vant/src/number-keyboard/types.ts create mode 100644 packages/vant/src/overlay/types.ts create mode 100644 packages/vant/src/pagination/types.ts create mode 100644 packages/vant/src/password-input/types.ts create mode 100644 packages/vant/src/picker-group/types.ts create mode 100644 packages/vant/src/pull-refresh/types.ts create mode 100644 packages/vant/src/radio/types.ts create mode 100644 packages/vant/src/rate/types.ts create mode 100644 packages/vant/src/share-sheet/types.ts create mode 100644 packages/vant/src/sidebar-item/types.ts create mode 100644 packages/vant/src/sidebar/types.ts create mode 100644 packages/vant/src/skeleton/types.ts create mode 100644 packages/vant/src/slider/types.ts create mode 100644 packages/vant/src/step/types.ts create mode 100644 packages/vant/src/stepper/types.ts create mode 100644 packages/vant/src/steps/types.ts create mode 100644 packages/vant/src/sticky/types.ts create mode 100644 packages/vant/src/submit-bar/types.ts create mode 100644 packages/vant/src/switch/types.ts create mode 100644 packages/vant/src/tabbar-item/types.ts create mode 100644 packages/vant/src/tabbar/types.ts create mode 100644 packages/vant/src/tag/types.ts create mode 100644 packages/vant/src/tree-select/types.ts diff --git a/packages/vant/src/action-bar-button/index.ts b/packages/vant/src/action-bar-button/index.ts index bff966695..4a29100c9 100644 --- a/packages/vant/src/action-bar-button/index.ts +++ b/packages/vant/src/action-bar-button/index.ts @@ -5,6 +5,7 @@ export const ActionBarButton = withInstall(_ActionBarButton); export default ActionBarButton; export { actionBarButtonProps } from './ActionBarButton'; export type { ActionBarButtonProps } from './ActionBarButton'; +export type { ActionBarButtonThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/action-bar-button/types.ts b/packages/vant/src/action-bar-button/types.ts new file mode 100644 index 000000000..90ce83c44 --- /dev/null +++ b/packages/vant/src/action-bar-button/types.ts @@ -0,0 +1,5 @@ +export type ActionBarButtonThemeVars = { + actionBarButtonHeight?: string; + actionBarButtonWarningColor?: string; + actionBarButtonDangerColor?: string; +}; diff --git a/packages/vant/src/action-bar-icon/index.ts b/packages/vant/src/action-bar-icon/index.ts index f553acd5c..bafee2085 100644 --- a/packages/vant/src/action-bar-icon/index.ts +++ b/packages/vant/src/action-bar-icon/index.ts @@ -5,6 +5,7 @@ export const ActionBarIcon = withInstall(_ActionBarIcon); export default ActionBarIcon; export { actionBarIconProps } from './ActionBarIcon'; export type { ActionBarIconProps } from './ActionBarIcon'; +export type { ActionBarIconThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/action-bar-icon/types.ts b/packages/vant/src/action-bar-icon/types.ts new file mode 100644 index 000000000..ab35841f2 --- /dev/null +++ b/packages/vant/src/action-bar-icon/types.ts @@ -0,0 +1,10 @@ +export type ActionBarIconThemeVars = { + actionBarIconWidth?: string; + actionBarIconHeight?: string; + actionBarIconColor?: string; + actionBarIconSize?: string; + actionBarIconFontSize?: string; + actionBarIconActiveColor?: string; + actionBarIconTextColor?: string; + actionBarIconBackground?: string; +}; diff --git a/packages/vant/src/action-bar/index.ts b/packages/vant/src/action-bar/index.ts index c885cd658..4891380a5 100644 --- a/packages/vant/src/action-bar/index.ts +++ b/packages/vant/src/action-bar/index.ts @@ -5,6 +5,7 @@ export const ActionBar = withInstall(_ActionBar); export default ActionBar; export { actionBarProps } from './ActionBar'; export type { ActionBarProps } from './ActionBar'; +export type { ActionBarThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/action-bar/types.ts b/packages/vant/src/action-bar/types.ts new file mode 100644 index 000000000..4ab1d8723 --- /dev/null +++ b/packages/vant/src/action-bar/types.ts @@ -0,0 +1,4 @@ +export type ActionBarThemeVars = { + actionBarBackground?: string; + actionBarHeight?: string; +}; diff --git a/packages/vant/src/action-sheet/index.ts b/packages/vant/src/action-sheet/index.ts index bc5d89930..0b9ad5bd0 100644 --- a/packages/vant/src/action-sheet/index.ts +++ b/packages/vant/src/action-sheet/index.ts @@ -5,6 +5,7 @@ export const ActionSheet = withInstall(_ActionSheet); export default ActionSheet; export { actionSheetProps } from './ActionSheet'; export type { ActionSheetProps, ActionSheetAction } from './ActionSheet'; +export type { ActionSheetThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/action-sheet/types.ts b/packages/vant/src/action-sheet/types.ts new file mode 100644 index 000000000..e9250816b --- /dev/null +++ b/packages/vant/src/action-sheet/types.ts @@ -0,0 +1,23 @@ +export type ActionSheetThemeVars = { + actionSheetMaxHeight?: string; + actionSheetHeaderHeight?: string; + actionSheetHeaderFontSize?: string; + actionSheetDescriptionColor?: string; + actionSheetDescriptionFontSize?: string; + actionSheetDescriptionLineHeight?: string; + actionSheetItemBackground?: string; + actionSheetItemFontSize?: string; + actionSheetItemLineHeight?: string; + actionSheetItemTextColor?: string; + actionSheetItemDisabledTextColor?: string; + actionSheetSubnameColor?: string; + actionSheetSubnameFontSize?: string; + actionSheetSubnameLineHeight?: string; + actionSheetCloseIconSize?: string; + actionSheetCloseIconColor?: string; + actionSheetCloseIconPadding?: string; + actionSheetCancelTextColor?: string; + actionSheetCancelPaddingTop?: string; + actionSheetCancelPaddingColor?: string; + actionSheetLoadingIconSize?: string; +}; diff --git a/packages/vant/src/address-edit/index.ts b/packages/vant/src/address-edit/index.ts index 3052da7e0..cfb221263 100644 --- a/packages/vant/src/address-edit/index.ts +++ b/packages/vant/src/address-edit/index.ts @@ -8,6 +8,7 @@ export type { AddressEditProps }; export type { AddressEditInfo, AddressEditInstance, + AddressEditThemeVars, AddressEditSearchItem, } from './types'; diff --git a/packages/vant/src/address-edit/types.ts b/packages/vant/src/address-edit/types.ts index 0916ec32c..6bad44031 100644 --- a/packages/vant/src/address-edit/types.ts +++ b/packages/vant/src/address-edit/types.ts @@ -27,3 +27,10 @@ export type AddressEditInstance = ComponentPublicInstance< AddressEditProps, AddressEditExpose >; + +export type AddressEditThemeVars = { + addressEditPadding?: string; + addressEditButtonsPadding?: string; + addressEditButtonMarginBottom?: string; + addressEditButtonFontSize?: string; +}; diff --git a/packages/vant/src/address-list/index.ts b/packages/vant/src/address-list/index.ts index f3def1d00..0c785c99a 100644 --- a/packages/vant/src/address-list/index.ts +++ b/packages/vant/src/address-list/index.ts @@ -6,6 +6,7 @@ export default AddressList; export { addressListProps } from './AddressList'; export type { AddressListProps } from './AddressList'; export type { AddressListAddress } from './AddressListItem'; +export type { AddressListThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/address-list/types.ts b/packages/vant/src/address-list/types.ts new file mode 100644 index 000000000..6f12ab89a --- /dev/null +++ b/packages/vant/src/address-list/types.ts @@ -0,0 +1,15 @@ +export type AddressListThemeVars = { + addressListPadding?: string; + addressListDisabledTextColor?: string; + addressListDisabledTextPadding?: string; + addressListDisabledTextFontSize?: string; + addressListDisabledTextLineHeight?: string; + addressListAddButtonZIndex?: string; + addressListItemPadding?: string; + addressListItemTextColor?: string; + addressListItemDisabledTextColor?: string; + addressListItemFontSize?: string; + addressListItemLineHeight?: string; + addressListRadioColor?: string; + addressListEditIconSize?: string; +}; diff --git a/packages/vant/src/badge/index.ts b/packages/vant/src/badge/index.ts index 249abab1b..a3700d26b 100644 --- a/packages/vant/src/badge/index.ts +++ b/packages/vant/src/badge/index.ts @@ -5,6 +5,7 @@ export const Badge = withInstall(_Badge); export default Badge; export { badgeProps } from './Badge'; export type { BadgeProps, BadgePosition } from './Badge'; +export type { BadgeThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/badge/types.ts b/packages/vant/src/badge/types.ts new file mode 100644 index 000000000..0bfac6895 --- /dev/null +++ b/packages/vant/src/badge/types.ts @@ -0,0 +1,12 @@ +export type BadgeThemeVars = { + badgeSize?: string; + badgeColor?: string; + badgePadding?: string; + badgeFontSize?: string; + badgeFontWeight?: string; + badgeBorderWidth?: string; + badgeBackground?: string; + badgeDotColor?: string; + badgeDotSize?: string; + badgeFont?: string; +}; diff --git a/packages/vant/src/button/index.ts b/packages/vant/src/button/index.ts index d2cc3d2fc..0635a7e17 100644 --- a/packages/vant/src/button/index.ts +++ b/packages/vant/src/button/index.ts @@ -8,6 +8,7 @@ export type { ButtonProps } from './Button'; export type { ButtonType, ButtonSize, + ButtonThemeVars, ButtonNativeType, ButtonIconPosition, } from './types'; diff --git a/packages/vant/src/button/types.ts b/packages/vant/src/button/types.ts index 8dffe2b91..4273fbb5f 100644 --- a/packages/vant/src/button/types.ts +++ b/packages/vant/src/button/types.ts @@ -12,3 +12,40 @@ export type ButtonSize = 'large' | 'normal' | 'small' | 'mini'; export type ButtonNativeType = NonNullable; export type ButtonIconPosition = 'left' | 'right'; + +export type ButtonThemeVars = { + buttonMiniHeight?: string; + buttonMiniPadding?: string; + buttonMiniFontSize?: string; + buttonSmallHeight?: string; + buttonSmallPadding?: string; + buttonSmallFontSize?: string; + buttonNormalPadding?: string; + buttonNormalFontSize?: string; + buttonLargeHeight?: string; + buttonDefaultHeight?: string; + buttonDefaultLineHeight?: string; + buttonDefaultFontSize?: string; + buttonDefaultColor?: string; + buttonDefaultBackground?: string; + buttonDefaultBorderColor?: string; + buttonPrimaryColor?: string; + buttonPrimaryBackground?: string; + buttonPrimaryBorderColor?: string; + buttonSuccessColor?: string; + buttonSuccessBackground?: string; + buttonSuccessBorderColor?: string; + buttonDangerColor?: string; + buttonDangerBackground?: string; + buttonDangerBorderColor?: string; + buttonWarningColor?: string; + buttonWarningBackground?: string; + buttonWarningBorderColor?: string; + buttonBorderWidth?: string; + buttonRadius?: string; + buttonRoundRadius?: string; + buttonPlainBackground?: string; + buttonDisabledOpacity?: string; + buttonIconSize?: string; + buttonLoadingIconSize?: string; +}; diff --git a/packages/vant/src/calendar/index.ts b/packages/vant/src/calendar/index.ts index 619856be4..c9133b982 100644 --- a/packages/vant/src/calendar/index.ts +++ b/packages/vant/src/calendar/index.ts @@ -10,6 +10,7 @@ export type { CalendarDayItem, CalendarDayType, CalendarInstance, + CalendarThemeVars, } from './types'; declare module 'vue' { diff --git a/packages/vant/src/calendar/types.ts b/packages/vant/src/calendar/types.ts index 43f5e7e6e..befdae252 100644 --- a/packages/vant/src/calendar/types.ts +++ b/packages/vant/src/calendar/types.ts @@ -48,3 +48,32 @@ export type CalendarMonthInstance = ComponentPublicInstance< disabledDays: Ref>; } >; + +export type CalendarThemeVars = { + calendarBackground?: string; + calendarPopupHeight?: string; + calendarHeaderShadow?: string; + calendarHeaderTitleHeight?: string; + calendarHeaderTitleFontSize?: string; + calendarHeaderSubtitleFontSize?: string; + calendarWeekdaysHeight?: string; + calendarWeekdaysFontSize?: string; + calendarMonthTitleFontSize?: string; + calendarMonthMarkColor?: string; + calendarMonthMarkFontSize?: string; + calendarDayHeight?: string; + calendarDayFontSize?: string; + calendarDayMarginBottom?: string; + calendarRangeEdgeColor?: string; + calendarRangeEdgeBackground?: string; + calendarRangeMiddleColor?: string; + calendarRangeMiddleBackgroundOpacity?: string; + calendarSelectedDaySize?: string; + calendarSelectedDayColor?: string; + calendarInfoFontSize?: string; + calendarInfoLineHeight?: string; + calendarSelectedDayBackground?: string; + calendarDayDisabledColor?: string; + calendarConfirmButtonHeight?: string; + calendarConfirmButtonMargin?: string; +}; diff --git a/packages/vant/src/card/index.ts b/packages/vant/src/card/index.ts index 65019df3b..8afe48e63 100644 --- a/packages/vant/src/card/index.ts +++ b/packages/vant/src/card/index.ts @@ -5,6 +5,7 @@ export const Card = withInstall(_Card); export default Card; export { cardProps } from './Card'; export type { CardProps } from './Card'; +export type { CardThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/card/types.ts b/packages/vant/src/card/types.ts new file mode 100644 index 000000000..e57ecc861 --- /dev/null +++ b/packages/vant/src/card/types.ts @@ -0,0 +1,18 @@ +export type CardThemeVars = { + cardPadding?: string; + cardFontSize?: string; + cardTextColor?: string; + cardBackground?: string; + cardThumbSize?: string; + cardThumbRadius?: string; + cardTitleLineHeight?: string; + cardDescColor?: string; + cardDescLineHeight?: string; + cardPriceColor?: string; + cardOriginPriceColor?: string; + cardNumColor?: string; + cardOriginPriceFontSize?: string; + cardPriceFontSize?: string; + cardPriceIntegerFontSize?: string; + cardPriceFont?: string; +}; diff --git a/packages/vant/src/cascader/index.ts b/packages/vant/src/cascader/index.ts index 02e08f229..865031dd8 100644 --- a/packages/vant/src/cascader/index.ts +++ b/packages/vant/src/cascader/index.ts @@ -5,7 +5,11 @@ export const Cascader = withInstall(_Cascader); export default Cascader; export { cascaderProps } from './Cascader'; export type { CascaderProps } from './Cascader'; -export type { CascaderOption, CascaderFieldNames } from './types'; +export type { + CascaderOption, + CascaderThemeVars, + CascaderFieldNames, +} from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/cascader/types.ts b/packages/vant/src/cascader/types.ts index 2532add76..704e0a5c2 100644 --- a/packages/vant/src/cascader/types.ts +++ b/packages/vant/src/cascader/types.ts @@ -21,3 +21,19 @@ export type CascaderFieldNames = { value?: string; children?: string; }; + +export type CascaderThemeVars = { + cascaderHeaderHeight?: string; + cascaderHeaderPadding?: string; + cascaderTitleFontSize?: string; + cascaderTitleLineHeight?: string; + cascaderCloseIconSize?: string; + cascaderCloseIconColor?: string; + cascaderSelectedIconSize?: string; + cascaderTabsHeight?: string; + cascaderActiveColor?: string; + cascaderOptionsHeight?: string; + cascaderOptionDisabledColor?: string; + cascaderTabColor?: string; + cascaderUnselectedTabColor?: string; +}; diff --git a/packages/vant/src/cell-group/index.ts b/packages/vant/src/cell-group/index.ts index 8fd6bc2f7..dc8672b8e 100644 --- a/packages/vant/src/cell-group/index.ts +++ b/packages/vant/src/cell-group/index.ts @@ -5,6 +5,7 @@ export const CellGroup = withInstall(_CellGroup); export default CellGroup; export { cellGroupProps } from './CellGroup'; export type { CellGroupProps } from './CellGroup'; +export type { CellGroupThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/cell-group/types.ts b/packages/vant/src/cell-group/types.ts new file mode 100644 index 000000000..49baf42b6 --- /dev/null +++ b/packages/vant/src/cell-group/types.ts @@ -0,0 +1,10 @@ +export type CellGroupThemeVars = { + cellGroupBackground?: string; + cellGroupTitleColor?: string; + cellGroupTitlePadding?: string; + cellGroupTitleFontSize?: string; + cellGroupTitleLineHeight?: string; + cellGroupInsetPadding?: string; + cellGroupInsetRadius?: string; + cellGroupInsetTitlePadding?: string; +}; diff --git a/packages/vant/src/cell/index.ts b/packages/vant/src/cell/index.ts index d0e80018b..ce5715f4d 100644 --- a/packages/vant/src/cell/index.ts +++ b/packages/vant/src/cell/index.ts @@ -5,6 +5,7 @@ export const Cell = withInstall(_Cell); export default Cell; export { cellProps } from './Cell'; export type { CellSize, CellProps, CellArrowDirection } from './Cell'; +export type { CellThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/cell/types.ts b/packages/vant/src/cell/types.ts new file mode 100644 index 000000000..175badd5b --- /dev/null +++ b/packages/vant/src/cell/types.ts @@ -0,0 +1,21 @@ +export type CellThemeVars = { + cellFontSize?: string; + cellLineHeight?: string; + cellVerticalPadding?: string; + cellHorizontalPadding?: string; + cellTextColor?: string; + cellBackground?: string; + cellBorderColor?: string; + cellActiveColor?: string; + cellRequiredColor?: string; + cellLabelColor?: string; + cellLabelFontSize?: string; + cellLabelLineHeight?: string; + cellLabelMarginTop?: string; + cellValueColor?: string; + cellIconSize?: string; + cellRightIconColor?: string; + cellLargeVerticalPadding?: string; + cellLargeTitleFontSize?: string; + cellLargeLabelFontSize?: string; +}; diff --git a/packages/vant/src/checkbox/index.ts b/packages/vant/src/checkbox/index.ts index 2458a9d61..9b2b3f38c 100644 --- a/packages/vant/src/checkbox/index.ts +++ b/packages/vant/src/checkbox/index.ts @@ -8,6 +8,7 @@ export type { CheckboxProps } from './Checkbox'; export type { CheckboxShape, CheckboxInstance, + CheckboxThemeVars, CheckboxLabelPosition, } from './types'; diff --git a/packages/vant/src/checkbox/types.ts b/packages/vant/src/checkbox/types.ts index d12ed20a8..ded544642 100644 --- a/packages/vant/src/checkbox/types.ts +++ b/packages/vant/src/checkbox/types.ts @@ -17,3 +17,15 @@ export type CheckboxInstance = ComponentPublicInstance< CheckboxProps, CheckboxExpose >; + +export type CheckboxThemeVars = { + checkboxSize?: string; + checkboxBorderColor?: string; + checkboxDuration?: string; + checkboxLabelMargin?: string; + checkboxLabelColor?: string; + checkboxCheckedIconColor?: string; + checkboxDisabledIconColor?: string; + checkboxDisabledLabelColor?: string; + checkboxDisabledBackground?: string; +}; diff --git a/packages/vant/src/circle/index.ts b/packages/vant/src/circle/index.ts index d41972dc9..8d2559dbf 100644 --- a/packages/vant/src/circle/index.ts +++ b/packages/vant/src/circle/index.ts @@ -5,6 +5,7 @@ export const Circle = withInstall(_Circle); export default Circle; export { circleProps } from './Circle'; export type { CircleProps, CircleStartPosition } from './Circle'; +export type { CircleThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/circle/types.ts b/packages/vant/src/circle/types.ts new file mode 100644 index 000000000..8cfeaa20f --- /dev/null +++ b/packages/vant/src/circle/types.ts @@ -0,0 +1,9 @@ +export type CircleThemeVars = { + circleSize?: string; + circleColor?: string; + circleLayerColor?: string; + circleTextColor?: string; + circleTextFontWeight?: string; + circleTextFontSize?: string; + circleTextLineHeight?: string; +}; diff --git a/packages/vant/src/collapse-item/index.ts b/packages/vant/src/collapse-item/index.ts index a2d8a3bc2..6c8bf46fe 100644 --- a/packages/vant/src/collapse-item/index.ts +++ b/packages/vant/src/collapse-item/index.ts @@ -5,7 +5,7 @@ export const CollapseItem = withInstall(_CollapseItem); export default CollapseItem; export { collapseItemProps } from './CollapseItem'; export type { CollapseItemProps } from './CollapseItem'; -export type { CollapseItemInstance } from './types'; +export type { CollapseItemInstance, CollapseItemThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/collapse-item/types.ts b/packages/vant/src/collapse-item/types.ts index 67ca6e723..c63278d51 100644 --- a/packages/vant/src/collapse-item/types.ts +++ b/packages/vant/src/collapse-item/types.ts @@ -9,3 +9,13 @@ export type CollapseItemInstance = ComponentPublicInstance< CollapseItemProps, CollapseItemExpose >; + +export type CollapseItemThemeVars = { + collapseItemDuration?: string; + collapseItemContentPadding?: string; + collapseItemContentFontSize?: string; + collapseItemContentLineHeight?: string; + collapseItemContentTextColor?: string; + collapseItemContentBackground?: string; + collapseItemTitleDisabledColor?: string; +}; diff --git a/packages/vant/src/config-provider/README.md b/packages/vant/src/config-provider/README.md index ee83d6beb..965b52899 100644 --- a/packages/vant/src/config-provider/README.md +++ b/packages/vant/src/config-provider/README.md @@ -150,6 +150,18 @@ export default { > Tips: ConfigProvider only affects its child components. +#### Use In TypeScript + +Using `ConfigProviderThemeVars` type to get code intellisense. + +```ts +import type { ConfigProviderThemeVars } from 'vant'; + +const themeVars: ConfigProviderThemeVars = { + sliderBarHeight: '4px', +}; +``` + ### Combining dark mode with CSS variables If you need to define CSS variables for dark mode or light mode separately, you can use the `theme-vars-dark` and `theme-vars-light` props. @@ -299,5 +311,9 @@ There are all **Basic Variables** below, for component CSS Variables, please ref The component exports the following type definitions: ```ts -import type { ConfigProviderProps, ConfigProviderTheme } from 'vant'; +import type { + ConfigProviderProps, + ConfigProviderTheme, + ConfigProviderThemeVars, +} 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 66ff11a37..550b252e6 100644 --- a/packages/vant/src/config-provider/README.zh-CN.md +++ b/packages/vant/src/config-provider/README.zh-CN.md @@ -150,6 +150,18 @@ export default { > 注意:ConfigProvider 仅影响它的子组件的样式,不影响全局 root 节点。 +#### 在 TypeScript 中使用 + +在 TypeScript 中定义 themeVars 时,建议使用 Vant 提供的 `ConfigProviderThemeVars` 类型,可以提供完善的类型提示: + +```ts +import type { ConfigProviderThemeVars } from 'vant'; + +const themeVars: ConfigProviderThemeVars = { + sliderBarHeight: '4px', +}; +``` + ### 结合深色模式与 CSS 变量 如果需要单独定义深色模式或浅色模式下的 CSS 变量,可以使用 `theme-vars-dark` 和 `theme-vars-light` 属性。 @@ -303,5 +315,9 @@ Vant 中的 CSS 变量分为 **基础变量** 和 **组件变量**。组件变 组件导出以下类型定义: ```ts -import type { ConfigProviderProps, ConfigProviderTheme } from 'vant'; +import type { + ConfigProviderProps, + ConfigProviderTheme, + ConfigProviderThemeVars, +} from 'vant'; ``` diff --git a/packages/vant/src/config-provider/index.ts b/packages/vant/src/config-provider/index.ts index cc49d936f..2d6258793 100644 --- a/packages/vant/src/config-provider/index.ts +++ b/packages/vant/src/config-provider/index.ts @@ -8,6 +8,7 @@ export type { ConfigProviderProps, ConfigProviderTheme, } from './ConfigProvider'; +export type { ConfigProviderThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/config-provider/types.ts b/packages/vant/src/config-provider/types.ts new file mode 100644 index 000000000..6ebc720de --- /dev/null +++ b/packages/vant/src/config-provider/types.ts @@ -0,0 +1,72 @@ +export type ConfigProviderThemeVars = + import('../action-bar').ActionBarThemeVars & + import('../action-bar-button').ActionBarButtonThemeVars & + import('../action-bar-icon').ActionBarIconThemeVars & + import('../action-sheet').ActionSheetThemeVars & + import('../address-edit').AddressEditThemeVars & + import('../address-list').AddressListThemeVars & + import('../badge').BadgeThemeVars & + import('../button').ButtonThemeVars & + import('../calendar').CalendarThemeVars & + import('../card').CardThemeVars & + import('../cascader').CascaderThemeVars & + import('../cell').CellThemeVars & + import('../cell-group').CellGroupThemeVars & + import('../checkbox').CheckboxThemeVars & + import('../circle').CircleThemeVars & + import('../collapse-item').CollapseItemThemeVars & + import('../contact-card').ContactCardThemeVars & + import('../contact-edit').ContactEditThemeVars & + import('../contact-list').ContactListThemeVars & + import('../count-down').CountDownThemeVars & + import('../coupon').CouponThemeVars & + import('../coupon-cell').CouponCellThemeVars & + import('../coupon-list').CouponListThemeVars & + import('../dialog').DialogThemeVars & + import('../divider').DividerThemeVars & + import('../dropdown-item').DropdownItemThemeVars & + import('../dropdown-menu').DropdownMenuThemeVars & + import('../empty').EmptyThemeVars & + import('../field').FieldThemeVars & + import('../grid-item').GridItemThemeVars & + import('../image').ImageThemeVars & + import('../image-preview').ImagePreviewThemeVars & + import('../index-anchor').IndexAnchorThemeVars & + import('../index-bar').IndexBarThemeVars & + import('../list').ListThemeVars & + import('../loading').LoadingThemeVars & + import('../nav-bar').NavBarThemeVars & + import('../notice-bar').NoticeBarThemeVars & + import('../notify').NotifyThemeVars & + import('../number-keyboard').NumberKeyboardThemeVars & + import('../overlay').OverlayThemeVars & + import('../pagination').PaginationThemeVars & + import('../password-input').PasswordInputThemeVars & + import('../picker').PickerThemeVars & + import('../picker-group').PickerGroupThemeVars & + import('../popover').PopoverThemeVars & + import('../popup').PopupThemeVars & + import('../progress').ProgressThemeVars & + import('../pull-refresh').PullRefreshThemeVars & + import('../radio').RadioThemeVars & + import('../rate').RateThemeVars & + import('../search').SearchThemeVars & + import('../share-sheet').ShareSheetThemeVars & + import('../sidebar').SidebarThemeVars & + import('../sidebar-item').SidebarItemThemeVars & + import('../skeleton').SkeletonThemeVars & + import('../slider').SliderThemeVars & + import('../step').StepThemeVars & + import('../stepper').StepperThemeVars & + import('../steps').StepsThemeVars & + import('../sticky').StickyThemeVars & + import('../submit-bar').SubmitBarThemeVars & + import('../swipe').SwipeThemeVars & + import('../switch').SwitchThemeVars & + import('../tabbar').TabbarThemeVars & + import('../tabbar-item').TabbarItemThemeVars & + import('../tabs').TabsThemeVars & + import('../tag').TagThemeVars & + import('../toast').ToastThemeVars & + import('../tree-select').TreeSelectThemeVars & + import('../uploader').UploaderThemeVars; diff --git a/packages/vant/src/contact-card/index.ts b/packages/vant/src/contact-card/index.ts index fd63df657..fbbe9a1e0 100644 --- a/packages/vant/src/contact-card/index.ts +++ b/packages/vant/src/contact-card/index.ts @@ -5,6 +5,7 @@ export const ContactCard = withInstall(_ContactCard); export default ContactCard; export { contactCardProps } from './ContactCard'; export type { ContactCardType, ContactCardProps } from './ContactCard'; +export type { ContactCardThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/contact-card/types.ts b/packages/vant/src/contact-card/types.ts new file mode 100644 index 000000000..73446265a --- /dev/null +++ b/packages/vant/src/contact-card/types.ts @@ -0,0 +1,6 @@ +export type ContactCardThemeVars = { + contactCardPadding?: string; + contactCardAddIconSize?: string; + contactCardAddIconColor?: string; + contactCardTitleLineHeight?: string; +}; diff --git a/packages/vant/src/contact-edit/index.ts b/packages/vant/src/contact-edit/index.ts index b8a3df6ae..a043beed9 100644 --- a/packages/vant/src/contact-edit/index.ts +++ b/packages/vant/src/contact-edit/index.ts @@ -5,6 +5,7 @@ export const ContactEdit = withInstall(_ContactEdit); export default ContactEdit; export { contactEditProps } from './ContactEdit'; export type { ContactEditInfo, ContactEditProps } from './ContactEdit'; +export type { ContactEditThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/contact-edit/types.ts b/packages/vant/src/contact-edit/types.ts new file mode 100644 index 000000000..d96bffd9a --- /dev/null +++ b/packages/vant/src/contact-edit/types.ts @@ -0,0 +1,8 @@ +export type ContactEditThemeVars = { + contactEditPadding?: string; + contactEditFieldsRadius?: string; + contactEditButtonsPadding?: string; + contactEditButtonMarginBottom?: string; + contactEditButtonFontSize?: string; + contactEditFieldLabelWidth?: string; +}; diff --git a/packages/vant/src/contact-list/index.ts b/packages/vant/src/contact-list/index.ts index d06bb87c9..80d0a2594 100644 --- a/packages/vant/src/contact-list/index.ts +++ b/packages/vant/src/contact-list/index.ts @@ -5,6 +5,7 @@ export const ContactList = withInstall(_ContactList); export default ContactList; export { contactListProps } from './ContactList'; export type { ContactListItem, ContactListProps } from './ContactList'; +export type { ContactListThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/contact-list/types.ts b/packages/vant/src/contact-list/types.ts new file mode 100644 index 000000000..50ef39a52 --- /dev/null +++ b/packages/vant/src/contact-list/types.ts @@ -0,0 +1,6 @@ +export type ContactListThemeVars = { + contactListEditIconSize?: string; + contactListAddButtonZIndex?: string; + contactListRadioColor?: string; + contactListItemPadding?: string; +}; diff --git a/packages/vant/src/count-down/index.ts b/packages/vant/src/count-down/index.ts index 182906619..361ca2d63 100644 --- a/packages/vant/src/count-down/index.ts +++ b/packages/vant/src/count-down/index.ts @@ -5,7 +5,11 @@ export const CountDown = withInstall(_CountDown); export default CountDown; export { countDownProps } from './CountDown'; export type { CountDownProps } from './CountDown'; -export type { CountDownInstance, CountDownCurrentTime } from './types'; +export type { + CountDownInstance, + CountDownThemeVars, + CountDownCurrentTime, +} from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/count-down/types.ts b/packages/vant/src/count-down/types.ts index 779b80bd3..a2bc71f77 100644 --- a/packages/vant/src/count-down/types.ts +++ b/packages/vant/src/count-down/types.ts @@ -14,3 +14,9 @@ export type CountDownInstance = ComponentPublicInstance< >; export type CountDownCurrentTime = CurrentTime; + +export type CountDownThemeVars = { + countDownTextColor?: string; + countDownFontSize?: string; + countDownLineHeight?: string; +}; diff --git a/packages/vant/src/coupon-cell/index.ts b/packages/vant/src/coupon-cell/index.ts index 74300ef9e..22d85768d 100644 --- a/packages/vant/src/coupon-cell/index.ts +++ b/packages/vant/src/coupon-cell/index.ts @@ -5,6 +5,7 @@ export const CouponCell = withInstall(_CouponCell); export default CouponCell; export { couponCellProps } from './CouponCell'; export type { CouponCellProps } from './CouponCell'; +export type { CouponCellThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/coupon-cell/types.ts b/packages/vant/src/coupon-cell/types.ts new file mode 100644 index 000000000..cc7396a4c --- /dev/null +++ b/packages/vant/src/coupon-cell/types.ts @@ -0,0 +1,3 @@ +export type CouponCellThemeVars = { + couponCellSelectedTextColor?: string; +}; diff --git a/packages/vant/src/coupon-list/index.ts b/packages/vant/src/coupon-list/index.ts index 47faec5cf..db716679a 100644 --- a/packages/vant/src/coupon-list/index.ts +++ b/packages/vant/src/coupon-list/index.ts @@ -5,6 +5,7 @@ export const CouponList = withInstall(_CouponList); export default CouponList; export { couponListProps } from './CouponList'; export type { CouponListProps } from './CouponList'; +export type { CouponListThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/coupon-list/types.ts b/packages/vant/src/coupon-list/types.ts new file mode 100644 index 000000000..9b75f0ff3 --- /dev/null +++ b/packages/vant/src/coupon-list/types.ts @@ -0,0 +1,9 @@ +export type CouponListThemeVars = { + couponListBackground?: string; + couponListFieldPadding?: string; + couponListExchangeButtonHeight?: string; + couponListCloseButtonHeight?: string; + couponListEmptyTipColor?: string; + couponListEmptyTipFontSize?: string; + couponListEmptyTipLineHeight?: string; +}; diff --git a/packages/vant/src/coupon/index.ts b/packages/vant/src/coupon/index.ts index c0419401e..051be7712 100644 --- a/packages/vant/src/coupon/index.ts +++ b/packages/vant/src/coupon/index.ts @@ -4,6 +4,7 @@ import _Coupon from './Coupon'; export const Coupon = withInstall(_Coupon); export default Coupon; export type { CouponInfo } from './Coupon'; +export type { CouponThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/coupon/types.ts b/packages/vant/src/coupon/types.ts new file mode 100644 index 000000000..3167e5ec5 --- /dev/null +++ b/packages/vant/src/coupon/types.ts @@ -0,0 +1,19 @@ +export type CouponThemeVars = { + couponMargin?: string; + couponContentHeight?: string; + couponContentPadding?: string; + couponContentTextColor?: string; + couponBackground?: string; + couponActiveBackground?: string; + couponRadius?: string; + couponShadow?: string; + couponHeadWidth?: string; + couponAmountColor?: string; + couponAmountFontSize?: string; + couponCurrencyFontSize?: string; + couponNameFontSize?: string; + couponDisabledTextColor?: string; + couponDescriptionPadding?: string; + couponDescriptionBorderColor?: string; + couponCheckboxColor?: string; +}; diff --git a/packages/vant/src/dialog/index.ts b/packages/vant/src/dialog/index.ts index 36d12e717..ef81e90a9 100644 --- a/packages/vant/src/dialog/index.ts +++ b/packages/vant/src/dialog/index.ts @@ -17,6 +17,7 @@ export type { DialogTheme, DialogMessage, DialogOptions, + DialogThemeVars, DialogMessageAlign, } from './types'; diff --git a/packages/vant/src/dialog/types.ts b/packages/vant/src/dialog/types.ts index 547540129..90310e4d1 100644 --- a/packages/vant/src/dialog/types.ts +++ b/packages/vant/src/dialog/types.ts @@ -32,3 +32,25 @@ export type DialogOptions = { confirmButtonDisabled?: boolean; closeOnClickOverlay?: boolean; }; + +export type DialogThemeVars = { + dialogWidth?: string; + dialogSmallScreenWidth?: string; + dialogFontSize?: string; + dialogTransition?: string; + dialogRadius?: string; + dialogBackground?: string; + dialogHeaderFontWeight?: string; + dialogHeaderLineHeight?: string; + dialogHeaderPaddingTop?: string; + dialogHeaderIsolatedPadding?: string; + dialogMessagePadding?: string; + dialogMessageFontSize?: string; + dialogMessageLineHeight?: string; + dialogMessageMaxHeight?: string; + dialogHasTitleMessageTextColor?: string; + dialogHasTitleMessagePaddingTop?: string; + dialogButtonHeight?: string; + dialogRoundButtonHeight?: string; + dialogConfirmButtonTextColor?: string; +}; diff --git a/packages/vant/src/divider/index.ts b/packages/vant/src/divider/index.ts index 4f0ba85c9..cfbf88c1a 100644 --- a/packages/vant/src/divider/index.ts +++ b/packages/vant/src/divider/index.ts @@ -5,6 +5,7 @@ export const Divider = withInstall(_Divider); export default Divider; export { dividerProps } from './Divider'; export type { DividerProps, DividerContentPosition } from './Divider'; +export type { DividerThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/divider/types.ts b/packages/vant/src/divider/types.ts new file mode 100644 index 000000000..175d68297 --- /dev/null +++ b/packages/vant/src/divider/types.ts @@ -0,0 +1,10 @@ +export type DividerThemeVars = { + dividerMargin?: string; + dividerTextColor?: string; + dividerFontSize?: string; + dividerLineHeight?: string; + dividerBorderColor?: string; + dividerContentPadding?: string; + dividerContentLeftWidth?: string; + dividerContentRightWidth?: string; +}; diff --git a/packages/vant/src/dropdown-item/index.ts b/packages/vant/src/dropdown-item/index.ts index 0a7cffcf5..29177fa93 100644 --- a/packages/vant/src/dropdown-item/index.ts +++ b/packages/vant/src/dropdown-item/index.ts @@ -5,7 +5,11 @@ export const DropdownItem = withInstall(_DropdownItem); export default DropdownItem; export { dropdownItemProps } from './DropdownItem'; export type { DropdownItemProps }; -export type { DropdownItemInstance, DropdownItemOption } from './types'; +export type { + DropdownItemOption, + DropdownItemInstance, + DropdownItemThemeVars, +} from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/dropdown-item/types.ts b/packages/vant/src/dropdown-item/types.ts index 12eb528ef..458544127 100644 --- a/packages/vant/src/dropdown-item/types.ts +++ b/packages/vant/src/dropdown-item/types.ts @@ -29,3 +29,7 @@ export type DropdownItemInstance = ComponentPublicInstance< DropdownItemProps, DropdownItemExpose >; + +export type DropdownItemThemeVars = { + dropdownItemZIndex?: string; +}; diff --git a/packages/vant/src/dropdown-menu/index.ts b/packages/vant/src/dropdown-menu/index.ts index 7345e8cf1..26529af4c 100644 --- a/packages/vant/src/dropdown-menu/index.ts +++ b/packages/vant/src/dropdown-menu/index.ts @@ -5,7 +5,7 @@ export const DropdownMenu = withInstall(_DropdownMenu); export default DropdownMenu; export { dropdownMenuProps } from './DropdownMenu'; export type { DropdownMenuProps }; -export type { DropdownMenuDirection } from './types'; +export type { DropdownMenuDirection, DropdownMenuThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/dropdown-menu/types.ts b/packages/vant/src/dropdown-menu/types.ts index e8c4f927b..024322804 100644 --- a/packages/vant/src/dropdown-menu/types.ts +++ b/packages/vant/src/dropdown-menu/types.ts @@ -8,3 +8,17 @@ export type DropdownMenuProvide = { props: DropdownMenuProps; offset: Ref; }; + +export type DropdownMenuThemeVars = { + dropdownMenuHeight?: string; + dropdownMenuBackground?: string; + dropdownMenuShadow?: string; + dropdownMenuTitleFontSize?: string; + dropdownMenuTitleTextColor?: string; + dropdownMenuTitleActiveTextColor?: string; + dropdownMenuTitleDisabledTextColor?: string; + dropdownMenuTitlePadding?: string; + dropdownMenuTitleLineHeight?: string; + dropdownMenuOptionActiveColor?: string; + dropdownMenuContentMaxHeight?: string; +}; diff --git a/packages/vant/src/empty/index.ts b/packages/vant/src/empty/index.ts index 19c9731df..856c9cc7e 100644 --- a/packages/vant/src/empty/index.ts +++ b/packages/vant/src/empty/index.ts @@ -5,6 +5,7 @@ export const Empty = withInstall(_Empty); export default Empty; export { emptyProps } from './Empty'; export type { EmptyProps } from './Empty'; +export type { EmptyThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/empty/types.ts b/packages/vant/src/empty/types.ts new file mode 100644 index 000000000..57fd06aac --- /dev/null +++ b/packages/vant/src/empty/types.ts @@ -0,0 +1,10 @@ +export type EmptyThemeVars = { + emptyPadding?: string; + emptyImageSize?: string; + emptyDescriptionMarginTop?: string; + emptyDescriptionPadding?: string; + emptyDescriptionColor?: string; + emptyDescriptionFontSize?: string; + emptyDescriptionLineHeight?: string; + emptyBottomMarginTop?: string; +}; diff --git a/packages/vant/src/field/index.ts b/packages/vant/src/field/index.ts index e92ab1935..487c2b818 100644 --- a/packages/vant/src/field/index.ts +++ b/packages/vant/src/field/index.ts @@ -10,6 +10,7 @@ export type { FieldRule, FieldInstance, FieldTextAlign, + FieldThemeVars, FieldRuleMessage, FieldClearTrigger, FieldFormatTrigger, diff --git a/packages/vant/src/field/types.ts b/packages/vant/src/field/types.ts index 26283f1aa..a0d776bb0 100644 --- a/packages/vant/src/field/types.ts +++ b/packages/vant/src/field/types.ts @@ -98,3 +98,25 @@ declare global { composing?: boolean; } } + +export type FieldThemeVars = { + fieldLabelWidth?: string; + fieldLabelColor?: string; + fieldLabelMarginRight?: string; + fieldInputTextColor?: string; + fieldInputErrorTextColor?: string; + fieldInputDisabledTextColor?: string; + fieldPlaceholderTextColor?: string; + fieldIconSize?: string; + fieldClearIconSize?: string; + fieldClearIconColor?: string; + fieldRightIconColor?: string; + fieldErrorMessageColor?: string; + fieldErrorMessageFontSize?: string; + fieldTextAreaMinHeight?: string; + fieldWordLimitColor?: string; + fieldWordLimitFontSize?: string; + fieldWordLimitLineHeight?: string; + fieldDisabledTextColor?: string; + fieldRequiredMarkColor?: string; +}; diff --git a/packages/vant/src/grid-item/index.ts b/packages/vant/src/grid-item/index.ts index dc6587c11..905c805b6 100644 --- a/packages/vant/src/grid-item/index.ts +++ b/packages/vant/src/grid-item/index.ts @@ -5,6 +5,7 @@ export const GridItem = withInstall(_GridItem); export default GridItem; export { gridItemProps } from './GridItem'; export type { GridItemProps } from './GridItem'; +export type { GridItemThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/grid-item/types.ts b/packages/vant/src/grid-item/types.ts new file mode 100644 index 000000000..e8847d778 --- /dev/null +++ b/packages/vant/src/grid-item/types.ts @@ -0,0 +1,8 @@ +export type GridItemThemeVars = { + gridItemContentPadding?: string; + gridItemContentBackground?: string; + gridItemContentActiveColor?: string; + gridItemIconSize?: string; + gridItemTextColor?: string; + gridItemTextFontSize?: string; +}; diff --git a/packages/vant/src/image-preview/index.ts b/packages/vant/src/image-preview/index.ts index 596135648..0a69066f8 100644 --- a/packages/vant/src/image-preview/index.ts +++ b/packages/vant/src/image-preview/index.ts @@ -11,6 +11,7 @@ export type { ImagePreviewProps }; export type { ImagePreviewOptions, ImagePreviewInstance, + ImagePreviewThemeVars, ImagePreviewScaleEventParams, } from './types'; diff --git a/packages/vant/src/image-preview/types.ts b/packages/vant/src/image-preview/types.ts index 5f196bdc8..4bd44fef5 100644 --- a/packages/vant/src/image-preview/types.ts +++ b/packages/vant/src/image-preview/types.ts @@ -45,3 +45,15 @@ export type ImagePreviewInstance = ComponentPublicInstance< ImagePreviewProps, ImagePreviewExpose >; + +export type ImagePreviewThemeVars = { + imagePreviewIndexTextColor?: string; + imagePreviewIndexFontSize?: string; + imagePreviewIndexLineHeight?: string; + imagePreviewIndexTextShadow?: string; + imagePreviewOverlayBackground?: string; + imagePreviewCloseIconSize?: string; + imagePreviewCloseIconColor?: string; + imagePreviewCloseIconMargin?: string; + imagePreviewCloseIconZIndex?: string; +}; diff --git a/packages/vant/src/image/index.ts b/packages/vant/src/image/index.ts index 91f869fd0..40f56ddb3 100644 --- a/packages/vant/src/image/index.ts +++ b/packages/vant/src/image/index.ts @@ -5,6 +5,7 @@ export const Image = withInstall(_Image); export default Image; export { imageProps } from './Image'; export type { ImageFit, ImageProps } from './Image'; +export type { ImageThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/image/types.ts b/packages/vant/src/image/types.ts new file mode 100644 index 000000000..659294c45 --- /dev/null +++ b/packages/vant/src/image/types.ts @@ -0,0 +1,9 @@ +export type ImageThemeVars = { + imagePlaceholderTextColor?: string; + imagePlaceholderFontSize?: string; + imagePlaceholderBackground?: string; + imageLoadingIconSize?: string; + imageLoadingIconColor?: string; + imageErrorIconSize?: string; + imageErrorIconColor?: string; +}; diff --git a/packages/vant/src/index-anchor/index.ts b/packages/vant/src/index-anchor/index.ts index ff12a1fc6..e31520737 100644 --- a/packages/vant/src/index-anchor/index.ts +++ b/packages/vant/src/index-anchor/index.ts @@ -5,6 +5,7 @@ export const IndexAnchor = withInstall(_IndexAnchor); export default IndexAnchor; export { indexAnchorProps } from './IndexAnchor'; export type { IndexAnchorProps } from './IndexAnchor'; +export type { IndexAnchorThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/index-anchor/types.ts b/packages/vant/src/index-anchor/types.ts new file mode 100644 index 000000000..b10852a9a --- /dev/null +++ b/packages/vant/src/index-anchor/types.ts @@ -0,0 +1,11 @@ +export type IndexAnchorThemeVars = { + indexAnchorZIndex?: string; + indexAnchorPadding?: string; + indexAnchorTextColor?: string; + indexAnchorFontWeight?: string; + indexAnchorFontSize?: string; + indexAnchorLineHeight?: string; + indexAnchorBackground?: string; + indexAnchorStickyTextColor?: string; + indexAnchorStickyBackground?: string; +}; diff --git a/packages/vant/src/index-bar/index.ts b/packages/vant/src/index-bar/index.ts index c554946f6..47b82da95 100644 --- a/packages/vant/src/index-bar/index.ts +++ b/packages/vant/src/index-bar/index.ts @@ -5,7 +5,7 @@ export const IndexBar = withInstall(_IndexBar); export default IndexBar; export { indexBarProps } from './IndexBar'; export type { IndexBarProps }; -export type { IndexBarInstance } from './types'; +export type { IndexBarInstance, IndexBarThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/index-bar/types.ts b/packages/vant/src/index-bar/types.ts index 34ffacdf3..db716bfd5 100644 --- a/packages/vant/src/index-bar/types.ts +++ b/packages/vant/src/index-bar/types.ts @@ -14,3 +14,10 @@ export type IndexBarInstance = ComponentPublicInstance< IndexBarProps, IndexBarExpose >; + +export type IndexBarThemeVars = { + indexBarSidebarZIndex?: string; + indexBarIndexFontSize?: string; + indexBarIndexLineHeight?: string; + indexBarIndexActiveColor?: string; +}; diff --git a/packages/vant/src/list/index.ts b/packages/vant/src/list/index.ts index 559da9055..82d868023 100644 --- a/packages/vant/src/list/index.ts +++ b/packages/vant/src/list/index.ts @@ -5,7 +5,7 @@ export const List = withInstall(_List); export default List; export { listProps } from './List'; export type { ListProps }; -export type { ListInstance, ListDirection } from './types'; +export type { ListInstance, ListDirection, ListThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/list/types.ts b/packages/vant/src/list/types.ts index 9f751131f..fe44a99d2 100644 --- a/packages/vant/src/list/types.ts +++ b/packages/vant/src/list/types.ts @@ -8,3 +8,10 @@ export type ListExpose = { }; export type ListInstance = ComponentPublicInstance; + +export type ListThemeVars = { + listTextColor?: string; + listTextFontSize?: string; + listTextLineHeight?: string; + listLoadingIconSize?: string; +}; diff --git a/packages/vant/src/loading/index.ts b/packages/vant/src/loading/index.ts index be1a6415f..e4993459c 100644 --- a/packages/vant/src/loading/index.ts +++ b/packages/vant/src/loading/index.ts @@ -5,6 +5,7 @@ export const Loading = withInstall(_Loading); export default Loading; export { loadingProps } from './Loading'; export type { LoadingType, LoadingProps } from './Loading'; +export type { LoadingThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/loading/types.ts b/packages/vant/src/loading/types.ts new file mode 100644 index 000000000..7d2c6748e --- /dev/null +++ b/packages/vant/src/loading/types.ts @@ -0,0 +1,7 @@ +export type LoadingThemeVars = { + loadingTextColor?: string; + loadingTextFontSize?: string; + loadingSpinnerColor?: string; + loadingSpinnerSize?: string; + loadingSpinnerDuration?: string; +}; diff --git a/packages/vant/src/nav-bar/index.ts b/packages/vant/src/nav-bar/index.ts index ba86672b9..5347eb90a 100644 --- a/packages/vant/src/nav-bar/index.ts +++ b/packages/vant/src/nav-bar/index.ts @@ -5,6 +5,7 @@ export const NavBar = withInstall(_NavBar); export default NavBar; export { navBarProps } from './NavBar'; export type { NavBarProps } from './NavBar'; +export type { NavBarThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/nav-bar/types.ts b/packages/vant/src/nav-bar/types.ts new file mode 100644 index 000000000..f90a6b015 --- /dev/null +++ b/packages/vant/src/nav-bar/types.ts @@ -0,0 +1,10 @@ +export type NavBarThemeVars = { + navBarHeight?: string; + navBarBackground?: string; + navBarArrowSize?: string; + navBarIconColor?: string; + navBarTextColor?: string; + navBarTitleFontSize?: string; + navBarTitleTextColor?: string; + navBarZIndex?: string; +}; diff --git a/packages/vant/src/notice-bar/index.ts b/packages/vant/src/notice-bar/index.ts index d6fd7d262..702b3604a 100644 --- a/packages/vant/src/notice-bar/index.ts +++ b/packages/vant/src/notice-bar/index.ts @@ -5,7 +5,11 @@ export const NoticeBar = withInstall(_NoticeBar); export default NoticeBar; export { noticeBarProps } from './NoticeBar'; export type { NoticeBarProps }; -export type { NoticeBarMode, NoticeBarInstance } from './types'; +export type { + NoticeBarMode, + NoticeBarInstance, + NoticeBarThemeVars, +} from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/notice-bar/types.ts b/packages/vant/src/notice-bar/types.ts index 69dc2bfa2..9f0ec5565 100644 --- a/packages/vant/src/notice-bar/types.ts +++ b/packages/vant/src/notice-bar/types.ts @@ -11,3 +11,15 @@ export type NoticeBarInstance = ComponentPublicInstance< NoticeBarProps, NoticeBarExpose >; + +export type NoticeBarThemeVars = { + noticeBarHeight?: string; + noticeBarPadding?: string; + noticeBarWrapablePadding?: string; + noticeBarTextColor?: string; + noticeBarFontSize?: string; + noticeBarLineHeight?: string; + noticeBarBackground?: string; + noticeBarIconSize?: string; + noticeBarIconMinWidth?: string; +}; diff --git a/packages/vant/src/notify/index.ts b/packages/vant/src/notify/index.ts index 27d49df7c..584477a3f 100644 --- a/packages/vant/src/notify/index.ts +++ b/packages/vant/src/notify/index.ts @@ -12,7 +12,7 @@ export { } from './function-call'; export type { NotifyProps } from './Notify'; -export type { NotifyType, NotifyOptions } from './types'; +export type { NotifyType, NotifyOptions, NotifyThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/notify/types.ts b/packages/vant/src/notify/types.ts index cb4e6373a..8e38f125e 100644 --- a/packages/vant/src/notify/types.ts +++ b/packages/vant/src/notify/types.ts @@ -19,3 +19,14 @@ export type NotifyOptions = { onClose?: () => void; onOpened?: () => void; }; + +export type NotifyThemeVars = { + notifyTextColor?: string; + notifyPadding?: string; + notifyFontSize?: string; + notifyLineHeight?: string; + notifyPrimaryBackground?: string; + notifySuccessBackground?: string; + notifyDangerBackground?: string; + notifyWarningBackground?: string; +}; diff --git a/packages/vant/src/number-keyboard/index.ts b/packages/vant/src/number-keyboard/index.ts index 9cd690306..b3933062d 100644 --- a/packages/vant/src/number-keyboard/index.ts +++ b/packages/vant/src/number-keyboard/index.ts @@ -8,6 +8,7 @@ export type { NumberKeyboardProps, NumberKeyboardTheme, } from './NumberKeyboard'; +export type { NumberKeyboardThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/number-keyboard/types.ts b/packages/vant/src/number-keyboard/types.ts new file mode 100644 index 000000000..36dca7aac --- /dev/null +++ b/packages/vant/src/number-keyboard/types.ts @@ -0,0 +1,17 @@ +export type NumberKeyboardThemeVars = { + numberKeyboardBackground?: string; + numberKeyboardKeyHeight?: string; + numberKeyboardKeyFontSize?: string; + numberKeyboardKeyActiveColor?: string; + numberKeyboardKeyBackground?: string; + numberKeyboardDeleteFontSize?: string; + numberKeyboardTitleColor?: string; + numberKeyboardTitleHeight?: string; + numberKeyboardTitleFontSize?: string; + numberKeyboardClosePadding?: string; + numberKeyboardCloseColor?: string; + numberKeyboardCloseFontSize?: string; + numberKeyboardButtonTextColor?: string; + numberKeyboardButtonBackground?: string; + numberKeyboardZIndex?: string; +}; diff --git a/packages/vant/src/overlay/index.ts b/packages/vant/src/overlay/index.ts index 53bd7160e..f6b968a56 100644 --- a/packages/vant/src/overlay/index.ts +++ b/packages/vant/src/overlay/index.ts @@ -5,6 +5,7 @@ export const Overlay = withInstall(_Overlay); export default Overlay; export { overlayProps } from './Overlay'; export type { OverlayProps } from './Overlay'; +export type { OverlayThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/overlay/types.ts b/packages/vant/src/overlay/types.ts new file mode 100644 index 000000000..743a77773 --- /dev/null +++ b/packages/vant/src/overlay/types.ts @@ -0,0 +1,4 @@ +export type OverlayThemeVars = { + overlayZIndex?: string; + overlayBackground?: string; +}; diff --git a/packages/vant/src/pagination/index.ts b/packages/vant/src/pagination/index.ts index b26a54aa9..5e7ca82b7 100644 --- a/packages/vant/src/pagination/index.ts +++ b/packages/vant/src/pagination/index.ts @@ -5,6 +5,7 @@ export const Pagination = withInstall(_Pagination); export default Pagination; export { paginationProps } from './Pagination'; export type { PaginationMode, PaginationProps } from './Pagination'; +export type { PaginationThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/pagination/types.ts b/packages/vant/src/pagination/types.ts new file mode 100644 index 000000000..3cd092dba --- /dev/null +++ b/packages/vant/src/pagination/types.ts @@ -0,0 +1,11 @@ +export type PaginationThemeVars = { + paginationHeight?: string; + paginationFontSize?: string; + paginationItemWidth?: string; + paginationItemDefaultColor?: string; + paginationItemDisabledColor?: string; + paginationItemDisabledBackground?: string; + paginationBackground?: string; + paginationDescColor?: string; + paginationDisabledOpacity?: string; +}; diff --git a/packages/vant/src/password-input/index.ts b/packages/vant/src/password-input/index.ts index 74920c4e1..71214ac41 100644 --- a/packages/vant/src/password-input/index.ts +++ b/packages/vant/src/password-input/index.ts @@ -5,6 +5,7 @@ export const PasswordInput = withInstall(_PasswordInput); export default PasswordInput; export { passwordInputProps } from './PasswordInput'; export type { PasswordInputProps } from './PasswordInput'; +export type { PasswordInputThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/password-input/types.ts b/packages/vant/src/password-input/types.ts new file mode 100644 index 000000000..0ff028d32 --- /dev/null +++ b/packages/vant/src/password-input/types.ts @@ -0,0 +1,17 @@ +export type PasswordInputThemeVars = { + passwordInputHeight?: string; + passwordInputMargin?: string; + passwordInputFontSize?: string; + passwordInputRadius?: string; + passwordInputBackground?: string; + passwordInputInfoColor?: string; + passwordInputInfoFontSize?: string; + passwordInputErrorInfoColor?: string; + passwordInputDotSize?: string; + passwordInputDotColor?: string; + passwordInputTextColor?: string; + passwordInputCursorColor?: string; + passwordInputCursorWidth?: string; + passwordInputCursorHeight?: string; + passwordInputCursorDuration?: string; +}; diff --git a/packages/vant/src/picker-group/index.ts b/packages/vant/src/picker-group/index.ts index b36114913..6cb51df5d 100644 --- a/packages/vant/src/picker-group/index.ts +++ b/packages/vant/src/picker-group/index.ts @@ -5,6 +5,7 @@ export const PickerGroup = withInstall(_PickerGroup); export default PickerGroup; export { pickerGroupProps } from './PickerGroup'; export type { PickerGroupProps }; +export type { PickerGroupThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/picker-group/types.ts b/packages/vant/src/picker-group/types.ts new file mode 100644 index 000000000..bfb286d21 --- /dev/null +++ b/packages/vant/src/picker-group/types.ts @@ -0,0 +1,3 @@ +export type PickerGroupThemeVars = { + pickerGroupBackground?: string; +}; diff --git a/packages/vant/src/picker/index.ts b/packages/vant/src/picker/index.ts index e30a6aafe..7f2cfc2b0 100644 --- a/packages/vant/src/picker/index.ts +++ b/packages/vant/src/picker/index.ts @@ -9,6 +9,7 @@ export type { PickerColumn, PickerOption, PickerInstance, + PickerThemeVars, PickerFieldNames, PickerToolbarPosition, PickerCancelEventParams, diff --git a/packages/vant/src/picker/types.ts b/packages/vant/src/picker/types.ts index e3e57318c..07064424f 100644 --- a/packages/vant/src/picker/types.ts +++ b/packages/vant/src/picker/types.ts @@ -54,3 +54,21 @@ export type PickerCancelEventParams = PickerConfirmEventParams; export type PickerChangeEventParams = PickerConfirmEventParams & { columnIndex: number; }; + +export type PickerThemeVars = { + pickerBackground?: string; + pickerToolbarHeight?: string; + pickerTitleFontSize?: string; + pickerTitleLineHeight?: string; + pickerActionPadding?: string; + pickerActionFontSize?: string; + pickerConfirmActionColor?: string; + pickerCancelActionColor?: string; + pickerOptionFontSize?: string; + pickerOptionPadding?: string; + pickerOptionTextColor?: string; + pickerOptionDisabledOpacity?: string; + pickerLoadingIconColor?: string; + pickerLoadingMaskColor?: string; + pickerMaskColor?: string; +}; diff --git a/packages/vant/src/popover/index.ts b/packages/vant/src/popover/index.ts index 9bc95ff47..7a59c9e44 100644 --- a/packages/vant/src/popover/index.ts +++ b/packages/vant/src/popover/index.ts @@ -9,6 +9,7 @@ export type { PopoverTheme, PopoverAction, PopoverTrigger, + PopoverThemeVars, PopoverPlacement, } from './types'; diff --git a/packages/vant/src/popover/types.ts b/packages/vant/src/popover/types.ts index 622d902d8..a4c3f1b00 100644 --- a/packages/vant/src/popover/types.ts +++ b/packages/vant/src/popover/types.ts @@ -22,3 +22,19 @@ export type PopoverAction = { className?: string; [key: PropertyKey]: any; }; + +export type PopoverThemeVars = { + popoverArrowSize?: string; + popoverRadius?: string; + popoverActionWidth?: string; + popoverActionHeight?: string; + popoverActionFontSize?: string; + popoverActionLineHeight?: string; + popoverActionIconSize?: string; + popoverLightTextColor?: string; + popoverLightBackground?: string; + popoverLightActionDisabledTextColor?: string; + popoverDarkTextColor?: string; + popoverDarkBackground?: string; + popoverDarkActionDisabledTextColor?: string; +}; diff --git a/packages/vant/src/popup/index.ts b/packages/vant/src/popup/index.ts index d0bde6f9c..52a2ad6c4 100644 --- a/packages/vant/src/popup/index.ts +++ b/packages/vant/src/popup/index.ts @@ -8,6 +8,7 @@ export type { PopupProps } from './Popup'; export type { PopupPosition, PopupInstance, + PopupThemeVars, PopupCloseIconPosition, } from './types'; diff --git a/packages/vant/src/popup/types.ts b/packages/vant/src/popup/types.ts index c97a95e0c..f29f6c29f 100644 --- a/packages/vant/src/popup/types.ts +++ b/packages/vant/src/popup/types.ts @@ -14,3 +14,13 @@ export type PopupExpose = { }; export type PopupInstance = ComponentPublicInstance; + +export type PopupThemeVars = { + popupBackground?: string; + popupTransition?: string; + popupRoundRadius?: string; + popupCloseIconSize?: string; + popupCloseIconColor?: string; + popupCloseIconMargin?: string; + popupCloseIconZIndex?: string; +}; diff --git a/packages/vant/src/progress/index.ts b/packages/vant/src/progress/index.ts index 3755bda1f..bbef7cd61 100644 --- a/packages/vant/src/progress/index.ts +++ b/packages/vant/src/progress/index.ts @@ -5,7 +5,7 @@ export const Progress = withInstall(_Progress); export default Progress; export { progressProps } from './Progress'; export type { ProgressProps }; -export type { ProgressInstance } from './types'; +export type { ProgressInstance, ProgressThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/progress/types.ts b/packages/vant/src/progress/types.ts index d626cde5e..a91792759 100644 --- a/packages/vant/src/progress/types.ts +++ b/packages/vant/src/progress/types.ts @@ -9,3 +9,15 @@ export type ProgressInstance = ComponentPublicInstance< ProgressProps, ProgressExpose >; + +export type ProgressThemeVars = { + progressHeight?: string; + progressColor?: string; + progressInactiveColor?: string; + progressBackground?: string; + progressPivotPadding?: string; + progressPivotTextColor?: string; + progressPivotFontSize?: string; + progressPivotLineHeight?: string; + progressPivotBackground?: string; +}; diff --git a/packages/vant/src/pull-refresh/index.ts b/packages/vant/src/pull-refresh/index.ts index ae37d2bcf..3ca09ed0d 100644 --- a/packages/vant/src/pull-refresh/index.ts +++ b/packages/vant/src/pull-refresh/index.ts @@ -5,6 +5,7 @@ export const PullRefresh = withInstall(_PullRefresh); export default PullRefresh; export { pullRefreshProps } from './PullRefresh'; export type { PullRefreshProps } from './PullRefresh'; +export type { PullRefreshThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/pull-refresh/types.ts b/packages/vant/src/pull-refresh/types.ts new file mode 100644 index 000000000..769bd9c89 --- /dev/null +++ b/packages/vant/src/pull-refresh/types.ts @@ -0,0 +1,6 @@ +export type PullRefreshThemeVars = { + pullRefreshHeadHeight?: string; + pullRefreshHeadFontSize?: string; + pullRefreshHeadTextColor?: string; + pullRefreshLoadingIconSize?: string; +}; diff --git a/packages/vant/src/radio/index.ts b/packages/vant/src/radio/index.ts index e1c583ade..ed8002649 100644 --- a/packages/vant/src/radio/index.ts +++ b/packages/vant/src/radio/index.ts @@ -5,6 +5,7 @@ export const Radio = withInstall(_Radio); export default Radio; export { radioProps } from './Radio'; export type { RadioProps, RadioShape, RadioLabelPosition } from './Radio'; +export type { RadioThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/radio/types.ts b/packages/vant/src/radio/types.ts new file mode 100644 index 000000000..bdb5a80d7 --- /dev/null +++ b/packages/vant/src/radio/types.ts @@ -0,0 +1,11 @@ +export type RadioThemeVars = { + radioSize?: string; + radioBorderColor?: string; + radioDuration?: string; + radioLabelMargin?: string; + radioLabelColor?: string; + radioCheckedIconColor?: string; + radioDisabledIconColor?: string; + radioDisabledLabelColor?: string; + radioDisabledBackground?: string; +}; diff --git a/packages/vant/src/rate/index.ts b/packages/vant/src/rate/index.ts index 415fee0aa..75ca0564e 100644 --- a/packages/vant/src/rate/index.ts +++ b/packages/vant/src/rate/index.ts @@ -5,6 +5,7 @@ export const Rate = withInstall(_Rate); export default Rate; export { rateProps } from './Rate'; export type { RateProps } from './Rate'; +export type { RateThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/rate/types.ts b/packages/vant/src/rate/types.ts new file mode 100644 index 000000000..33c8edf63 --- /dev/null +++ b/packages/vant/src/rate/types.ts @@ -0,0 +1,7 @@ +export type RateThemeVars = { + rateIconSize?: string; + rateIconGutter?: string; + rateIconVoidColor?: string; + rateIconFullColor?: string; + rateIconDisabledColor?: string; +}; diff --git a/packages/vant/src/search/index.ts b/packages/vant/src/search/index.ts index 217569b6f..6917ac75d 100644 --- a/packages/vant/src/search/index.ts +++ b/packages/vant/src/search/index.ts @@ -5,7 +5,7 @@ export const Search = withInstall(_Search); export default Search; export { searchProps } from './Search'; export type { SearchProps }; -export type { SearchShape, SearchInstance } from './types'; +export type { SearchShape, SearchInstance, SearchThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/search/types.ts b/packages/vant/src/search/types.ts index 2dca64b7e..d9d766135 100644 --- a/packages/vant/src/search/types.ts +++ b/packages/vant/src/search/types.ts @@ -9,3 +9,17 @@ export type SearchExpose = { }; export type SearchInstance = ComponentPublicInstance; + +export type SearchThemeVars = { + searchPadding?: string; + searchBackground?: string; + searchContentBackground?: string; + searchInputHeight?: string; + searchLabelPadding?: string; + searchLabelColor?: string; + searchLabelFontSize?: string; + searchLeftIconColor?: string; + searchActionPadding?: string; + searchActionTextColor?: string; + searchActionFontSize?: string; +}; diff --git a/packages/vant/src/share-sheet/index.ts b/packages/vant/src/share-sheet/index.ts index fa9e961e0..e9395b33d 100644 --- a/packages/vant/src/share-sheet/index.ts +++ b/packages/vant/src/share-sheet/index.ts @@ -9,6 +9,7 @@ export type { ShareSheetOption, ShareSheetOptions, } from './ShareSheet'; +export type { ShareSheetThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/share-sheet/types.ts b/packages/vant/src/share-sheet/types.ts new file mode 100644 index 000000000..8d145caa6 --- /dev/null +++ b/packages/vant/src/share-sheet/types.ts @@ -0,0 +1,17 @@ +export type ShareSheetThemeVars = { + shareSheetHeaderPadding?: string; + shareSheetTitleColor?: string; + shareSheetTitleFontSize?: string; + shareSheetTitleLineHeight?: string; + shareSheetDescriptionColor?: string; + shareSheetDescriptionFontSize?: string; + shareSheetDescriptionLineHeight?: string; + shareSheetIconSize?: string; + shareSheetOptionNameColor?: string; + shareSheetOptionNameFontSize?: string; + shareSheetOptionDescriptionColor?: string; + shareSheetOptionDescriptionFontSize?: string; + shareSheetCancelButtonFontSize?: string; + shareSheetCancelButtonHeight?: string; + shareSheetCancelButtonBackground?: string; +}; diff --git a/packages/vant/src/sidebar-item/index.ts b/packages/vant/src/sidebar-item/index.ts index 8c225b408..4bb676e0b 100644 --- a/packages/vant/src/sidebar-item/index.ts +++ b/packages/vant/src/sidebar-item/index.ts @@ -5,6 +5,7 @@ export const SidebarItem = withInstall(_SidebarItem); export default SidebarItem; export { sidebarItemProps } from './SidebarItem'; export type { SidebarItemProps } from './SidebarItem'; +export type { SidebarItemThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/sidebar-item/types.ts b/packages/vant/src/sidebar-item/types.ts new file mode 100644 index 000000000..6f3e6cbf3 --- /dev/null +++ b/packages/vant/src/sidebar-item/types.ts @@ -0,0 +1,15 @@ +export type SidebarItemThemeVars = { + sidebarFontSize?: string; + sidebarLineHeight?: string; + sidebarTextColor?: string; + sidebarDisabledTextColor?: string; + sidebarPadding?: string; + sidebarActiveColor?: string; + sidebarBackground?: string; + sidebarSelectedFontWeight?: string; + sidebarSelectedTextColor?: string; + sidebarSelectedBorderWidth?: string; + sidebarSelectedBorderHeight?: string; + sidebarSelectedBorderColor?: string; + sidebarSelectedBackground?: string; +}; diff --git a/packages/vant/src/sidebar/index.ts b/packages/vant/src/sidebar/index.ts index dbcf058ab..5a7c70854 100644 --- a/packages/vant/src/sidebar/index.ts +++ b/packages/vant/src/sidebar/index.ts @@ -5,6 +5,7 @@ export const Sidebar = withInstall(_Sidebar); export default Sidebar; export { sidebarProps } from './Sidebar'; export type { SidebarProps } from './Sidebar'; +export type { SidebarThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/sidebar/types.ts b/packages/vant/src/sidebar/types.ts new file mode 100644 index 000000000..44e6cf5a4 --- /dev/null +++ b/packages/vant/src/sidebar/types.ts @@ -0,0 +1,3 @@ +export type SidebarThemeVars = { + sidebarWidth?: string; +}; diff --git a/packages/vant/src/skeleton/index.ts b/packages/vant/src/skeleton/index.ts index c41680334..8c1c07eb1 100644 --- a/packages/vant/src/skeleton/index.ts +++ b/packages/vant/src/skeleton/index.ts @@ -5,6 +5,7 @@ export const Skeleton = withInstall(_Skeleton); export default Skeleton; export { skeletonProps } from './Skeleton'; export type { SkeletonProps, SkeletonAvatarShape } from './Skeleton'; +export type { SkeletonThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/skeleton/types.ts b/packages/vant/src/skeleton/types.ts new file mode 100644 index 000000000..c43b361a1 --- /dev/null +++ b/packages/vant/src/skeleton/types.ts @@ -0,0 +1,9 @@ +export type SkeletonThemeVars = { + skeletonRowHeight?: string; + skeletonRowBackground?: string; + skeletonRowMarginTop?: string; + skeletonTitleWidth?: string; + skeletonAvatarSize?: string; + skeletonAvatarBackground?: string; + skeletonDuration?: string; +}; diff --git a/packages/vant/src/slider/index.ts b/packages/vant/src/slider/index.ts index e3801883a..3c9ec21c3 100644 --- a/packages/vant/src/slider/index.ts +++ b/packages/vant/src/slider/index.ts @@ -5,6 +5,7 @@ export const Slider = withInstall(_Slider); export default Slider; export { sliderProps } from './Slider'; export type { SliderProps } from './Slider'; +export type { SliderThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/slider/types.ts b/packages/vant/src/slider/types.ts new file mode 100644 index 000000000..59346755e --- /dev/null +++ b/packages/vant/src/slider/types.ts @@ -0,0 +1,11 @@ +export type SliderThemeVars = { + sliderActiveBackground?: string; + sliderInactiveBackground?: string; + sliderDisabledOpacity?: string; + sliderBarHeight?: string; + sliderButtonWidth?: string; + sliderButtonHeight?: string; + sliderButtonRadius?: string; + sliderButtonBackground?: string; + sliderButtonShadow?: string; +}; diff --git a/packages/vant/src/step/index.ts b/packages/vant/src/step/index.ts index 926bb2b23..644b40ac3 100644 --- a/packages/vant/src/step/index.ts +++ b/packages/vant/src/step/index.ts @@ -3,6 +3,7 @@ import _Step from './Step'; export const Step = withInstall(_Step); export default Step; +export type { StepThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/step/types.ts b/packages/vant/src/step/types.ts new file mode 100644 index 000000000..3f229809b --- /dev/null +++ b/packages/vant/src/step/types.ts @@ -0,0 +1,13 @@ +export type StepThemeVars = { + stepTextColor?: string; + stepActiveColor?: string; + stepProcessTextColor?: string; + stepFontSize?: string; + stepLineColor?: string; + stepFinishLineColor?: string; + stepFinishTextColor?: string; + stepIconSize?: string; + stepCircleSize?: string; + stepCircleColor?: string; + stepHorizontalTitleFontSize?: string; +}; diff --git a/packages/vant/src/stepper/index.ts b/packages/vant/src/stepper/index.ts index ee4b9fa15..98c80c07c 100644 --- a/packages/vant/src/stepper/index.ts +++ b/packages/vant/src/stepper/index.ts @@ -5,6 +5,7 @@ export const Stepper = withInstall(_Stepper); export default Stepper; export { stepperProps } from './Stepper'; export type { StepperTheme, StepperProps } from './Stepper'; +export type { StepperThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/stepper/types.ts b/packages/vant/src/stepper/types.ts new file mode 100644 index 000000000..a9301e6f6 --- /dev/null +++ b/packages/vant/src/stepper/types.ts @@ -0,0 +1,15 @@ +export type StepperThemeVars = { + stepperBackground?: string; + stepperButtonIconColor?: string; + stepperButtonDisabledColor?: string; + stepperButtonDisabledIconColor?: string; + stepperButtonRoundThemeColor?: string; + stepperInputWidth?: string; + stepperInputHeight?: string; + stepperInputFontSize?: string; + stepperInputLineHeight?: string; + stepperInputTextColor?: string; + stepperInputDisabledTextColor?: string; + stepperInputDisabledBackground?: string; + stepperRadius?: string; +}; diff --git a/packages/vant/src/steps/index.ts b/packages/vant/src/steps/index.ts index 00b4afe28..c04457dd0 100644 --- a/packages/vant/src/steps/index.ts +++ b/packages/vant/src/steps/index.ts @@ -5,6 +5,7 @@ export const Steps = withInstall(_Steps); export default Steps; export { stepsProps } from './Steps'; export type { StepsProps, StepsDirection } from './Steps'; +export type { StepsThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/steps/types.ts b/packages/vant/src/steps/types.ts new file mode 100644 index 000000000..4a64e3b5f --- /dev/null +++ b/packages/vant/src/steps/types.ts @@ -0,0 +1,3 @@ +export type StepsThemeVars = { + stepsBackground?: string; +}; diff --git a/packages/vant/src/sticky/index.ts b/packages/vant/src/sticky/index.ts index b28dbed18..182bd7e2e 100644 --- a/packages/vant/src/sticky/index.ts +++ b/packages/vant/src/sticky/index.ts @@ -5,6 +5,7 @@ export const Sticky = withInstall(_Sticky); export default Sticky; export { stickyProps } from './Sticky'; export type { StickyProps, StickyPosition } from './Sticky'; +export type { StickyThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/sticky/types.ts b/packages/vant/src/sticky/types.ts new file mode 100644 index 000000000..b7f088734 --- /dev/null +++ b/packages/vant/src/sticky/types.ts @@ -0,0 +1,3 @@ +export type StickyThemeVars = { + stickyZIndex?: string; +}; diff --git a/packages/vant/src/submit-bar/index.ts b/packages/vant/src/submit-bar/index.ts index d555e9bab..600f53f87 100644 --- a/packages/vant/src/submit-bar/index.ts +++ b/packages/vant/src/submit-bar/index.ts @@ -5,6 +5,7 @@ export const SubmitBar = withInstall(_SubmitBar); export default SubmitBar; export { submitBarProps } from './SubmitBar'; export type { SubmitBarProps, SubmitBarTextAlign } from './SubmitBar'; +export type { SubmitBarThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/submit-bar/types.ts b/packages/vant/src/submit-bar/types.ts new file mode 100644 index 000000000..eed0ee56e --- /dev/null +++ b/packages/vant/src/submit-bar/types.ts @@ -0,0 +1,21 @@ +export type SubmitBarThemeVars = { + submitBarHeight?: string; + submitBarZIndex?: string; + submitBarBackground?: string; + submitBarButtonWidth?: string; + submitBarPriceColor?: string; + submitBarPriceFontSize?: string; + submitBarPriceIntegerFontSize?: string; + submitBarPriceFont?: string; + submitBarCurrencyFontSize?: string; + submitBarTextColor?: string; + submitBarTextFontSize?: string; + submitBarTipPadding?: string; + submitBarTipFontSize?: string; + submitBarTipLineHeight?: string; + submitBarTipColor?: string; + submitBarTipBackground?: string; + submitBarTipIconSize?: string; + submitBarButtonHeight?: string; + submitBarPadding?: string; +}; diff --git a/packages/vant/src/swipe/index.ts b/packages/vant/src/swipe/index.ts index dae6766be..5ddb9a6cb 100644 --- a/packages/vant/src/swipe/index.ts +++ b/packages/vant/src/swipe/index.ts @@ -5,7 +5,7 @@ export const Swipe = withInstall(_Swipe); export default Swipe; export { swipeProps } from './Swipe'; export type { SwipeProps }; -export type { SwipeInstance, SwipeToOptions } from './types'; +export type { SwipeInstance, SwipeToOptions, SwipeThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/swipe/types.ts b/packages/vant/src/swipe/types.ts index 261b3d1d0..9e0f14e5a 100644 --- a/packages/vant/src/swipe/types.ts +++ b/packages/vant/src/swipe/types.ts @@ -31,3 +31,12 @@ export type SwipeProvide = { }; export type SwipeInstance = ComponentPublicInstance; + +export type SwipeThemeVars = { + swipeIndicatorSize?: string; + swipeIndicatorMargin?: string; + swipeIndicatorActiveOpacity?: string; + swipeIndicatorInactiveOpacity?: string; + swipeIndicatorActiveBackground?: string; + swipeIndicatorInactiveBackground?: string; +}; diff --git a/packages/vant/src/switch/index.ts b/packages/vant/src/switch/index.ts index 56af23e70..d75272162 100644 --- a/packages/vant/src/switch/index.ts +++ b/packages/vant/src/switch/index.ts @@ -5,6 +5,7 @@ export const Switch = withInstall(_Switch); export default Switch; export { switchProps } from './Switch'; export type { SwitchProps } from './Switch'; +export type { SwitchThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/switch/types.ts b/packages/vant/src/switch/types.ts new file mode 100644 index 000000000..1717f3b59 --- /dev/null +++ b/packages/vant/src/switch/types.ts @@ -0,0 +1,12 @@ +export type SwitchThemeVars = { + switchSize?: string; + switchWidth?: string; + switchHeight?: string; + switchNodeSize?: string; + switchNodeBackground?: string; + switchNodeShadow?: string; + switchBackground?: string; + switchOnBackground?: string; + switchDuration?: string; + switchDisabledOpacity?: string; +}; diff --git a/packages/vant/src/tabbar-item/index.ts b/packages/vant/src/tabbar-item/index.ts index 1af2149b2..1a8fc5f7c 100644 --- a/packages/vant/src/tabbar-item/index.ts +++ b/packages/vant/src/tabbar-item/index.ts @@ -5,6 +5,7 @@ export const TabbarItem = withInstall(_TabbarItem); export default TabbarItem; export { tabbarItemProps } from './TabbarItem'; export type { TabbarItemProps } from './TabbarItem'; +export type { TabbarItemThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/tabbar-item/types.ts b/packages/vant/src/tabbar-item/types.ts new file mode 100644 index 000000000..742001c5e --- /dev/null +++ b/packages/vant/src/tabbar-item/types.ts @@ -0,0 +1,9 @@ +export type TabbarItemThemeVars = { + tabbarItemFontSize?: string; + tabbarItemTextColor?: string; + tabbarItemActiveColor?: string; + tabbarItemActiveBackground?: string; + tabbarItemLineHeight?: string; + tabbarItemIconSize?: string; + tabbarItemIconMarginBottom?: string; +}; diff --git a/packages/vant/src/tabbar/index.ts b/packages/vant/src/tabbar/index.ts index 0cc40e651..b329d2e44 100644 --- a/packages/vant/src/tabbar/index.ts +++ b/packages/vant/src/tabbar/index.ts @@ -5,6 +5,7 @@ export const Tabbar = withInstall(_Tabbar); export default Tabbar; export { tabbarProps } from './Tabbar'; export type { TabbarProps } from './Tabbar'; +export type { TabbarThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/tabbar/types.ts b/packages/vant/src/tabbar/types.ts new file mode 100644 index 000000000..3d8df9ce5 --- /dev/null +++ b/packages/vant/src/tabbar/types.ts @@ -0,0 +1,5 @@ +export type TabbarThemeVars = { + tabbarHeight?: string; + tabbarZIndex?: string; + tabbarBackground?: string; +}; diff --git a/packages/vant/src/tabs/index.ts b/packages/vant/src/tabs/index.ts index 5a2939acc..bea26d441 100644 --- a/packages/vant/src/tabs/index.ts +++ b/packages/vant/src/tabs/index.ts @@ -5,7 +5,7 @@ export const Tabs = withInstall(_Tabs); export default Tabs; export { tabsProps } from './Tabs'; export type { TabsProps }; -export type { TabsType, TabsInstance } from './types'; +export type { TabsType, TabsInstance, TabsThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/tabs/types.ts b/packages/vant/src/tabs/types.ts index db524ab91..0332db16c 100644 --- a/packages/vant/src/tabs/types.ts +++ b/packages/vant/src/tabs/types.ts @@ -26,3 +26,18 @@ export type TabsExpose = { }; export type TabsInstance = ComponentPublicInstance; + +export type TabsThemeVars = { + tabTextColor?: string; + tabActiveTextColor?: string; + tabDisabledTextColor?: string; + tabFontSize?: string; + tabLineHeight?: string; + tabsDefaultColor?: string; + tabsLineHeight?: string; + tabsCardHeight?: string; + tabsNavBackground?: string; + tabsBottomBarWidth?: string; + tabsBottomBarHeight?: string; + tabsBottomBarColor?: string; +}; diff --git a/packages/vant/src/tag/Tag.tsx b/packages/vant/src/tag/Tag.tsx index d9cb16fdd..b0e3c70b6 100644 --- a/packages/vant/src/tag/Tag.tsx +++ b/packages/vant/src/tag/Tag.tsx @@ -12,12 +12,10 @@ import { HAPTICS_FEEDBACK, } from '../utils'; import { Icon } from '../icon'; +import type { TagType, TagSize } from './types'; const [name, bem] = createNamespace('tag'); -export type TagSize = 'large' | 'medium'; -export type TagType = 'default' | 'primary' | 'success' | 'warning' | 'danger'; - export const tagProps = { size: String as PropType, mark: Boolean, diff --git a/packages/vant/src/tag/index.ts b/packages/vant/src/tag/index.ts index 9ee77b49e..239c50f42 100644 --- a/packages/vant/src/tag/index.ts +++ b/packages/vant/src/tag/index.ts @@ -4,7 +4,8 @@ import _Tag from './Tag'; export const Tag = withInstall(_Tag); export default Tag; export { tagProps } from './Tag'; -export type { TagSize, TagType, TagProps } from './Tag'; +export type { TagProps } from './Tag'; +export type { TagSize, TagType, TagThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/tag/types.ts b/packages/vant/src/tag/types.ts new file mode 100644 index 000000000..73a51a37a --- /dev/null +++ b/packages/vant/src/tag/types.ts @@ -0,0 +1,22 @@ +export type TagSize = 'large' | 'medium'; + +export type TagType = 'default' | 'primary' | 'success' | 'warning' | 'danger'; + +export type TagThemeVars = { + tagPadding?: string; + tagTextColor?: string; + tagFontSize?: string; + tagRadius?: string; + tagLineHeight?: string; + tagMediumPadding?: string; + tagLargePadding?: string; + tagLargeRadius?: string; + tagLargeFontSize?: string; + tagRoundRadius?: string; + tagDangerColor?: string; + tagPrimaryColor?: string; + tagSuccessColor?: string; + tagWarningColor?: string; + tagDefaultColor?: string; + tagPlainBackground?: string; +}; diff --git a/packages/vant/src/toast/index.ts b/packages/vant/src/toast/index.ts index 3e799dd8d..e66f83ca5 100644 --- a/packages/vant/src/toast/index.ts +++ b/packages/vant/src/toast/index.ts @@ -16,7 +16,12 @@ export { } from './function-call'; export type { ToastProps } from './Toast'; -export type { ToastType, ToastOptions, ToastPosition } from './types'; +export type { + ToastType, + ToastOptions, + ToastPosition, + ToastThemeVars, +} from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/toast/types.ts b/packages/vant/src/toast/types.ts index 26388db18..97e9e19d6 100644 --- a/packages/vant/src/toast/types.ts +++ b/packages/vant/src/toast/types.ts @@ -38,3 +38,21 @@ export type ToastWrapperInstance = ComponentPublicInstance< open: (props: Record) => void; } >; + +export type ToastThemeVars = { + toastMaxWidth?: string; + toastFontSize?: string; + toastTextColor?: string; + toastLoadingIconColor?: string; + toastLineHeight?: string; + toastRadius?: string; + toastBackground?: string; + toastIconSize?: string; + toastTextMinWidth?: string; + toastTextPadding?: string; + toastDefaultPadding?: string; + toastDefaultWidth?: string; + toastDefaultMinHeight?: string; + toastPositionTopDistance?: string; + toastPositionBottomDistance?: string; +}; diff --git a/packages/vant/src/tree-select/index.ts b/packages/vant/src/tree-select/index.ts index c33ef7d8b..da373e15e 100644 --- a/packages/vant/src/tree-select/index.ts +++ b/packages/vant/src/tree-select/index.ts @@ -9,6 +9,7 @@ export type { TreeSelectChild, TreeSelectProps, } from './TreeSelect'; +export type { TreeSelectThemeVars } from './types'; declare module 'vue' { export interface GlobalComponents { diff --git a/packages/vant/src/tree-select/types.ts b/packages/vant/src/tree-select/types.ts new file mode 100644 index 000000000..3d5343c0d --- /dev/null +++ b/packages/vant/src/tree-select/types.ts @@ -0,0 +1,10 @@ +export type TreeSelectThemeVars = { + treeSelectFontSize?: string; + treeSelectNavBackground?: string; + treeSelectContentBackground?: string; + treeSelectNavItemPadding?: string; + treeSelectItemHeight?: string; + treeSelectItemActiveColor?: string; + treeSelectItemDisabledColor?: string; + treeSelectItemSelectedSize?: string; +}; diff --git a/packages/vant/src/uploader/index.ts b/packages/vant/src/uploader/index.ts index 06fd89f79..e86c1f288 100644 --- a/packages/vant/src/uploader/index.ts +++ b/packages/vant/src/uploader/index.ts @@ -7,6 +7,7 @@ export { uploaderProps } from './Uploader'; export type { UploaderProps }; export type { UploaderInstance, + UploaderThemeVars, UploaderResultType, UploaderFileListItem, } from './types'; diff --git a/packages/vant/src/uploader/types.ts b/packages/vant/src/uploader/types.ts index 2109fc6de..01e9aea16 100644 --- a/packages/vant/src/uploader/types.ts +++ b/packages/vant/src/uploader/types.ts @@ -45,3 +45,31 @@ export type UploaderInstance = ComponentPublicInstance< UploaderProps, UploaderExpose >; + +export type UploaderThemeVars = { + uploaderSize?: string; + uploaderIconSize?: string; + uploaderIconColor?: string; + uploaderTextColor?: string; + uploaderTextFontSize?: string; + uploaderUploadBackground?: string; + uploaderUploadActiveColor?: string; + uploaderDeleteColor?: string; + uploaderDeleteIconSize?: string; + uploaderDeleteBackground?: string; + uploaderFileBackground?: string; + uploaderFileIconSize?: string; + uploaderFileIconColor?: string; + uploaderFileNamePadding?: string; + uploaderFileNameMarginTop?: string; + uploaderFileNameFontSize?: string; + uploaderFileNameTextColor?: string; + uploaderMaskTextColor?: string; + uploaderMaskBackground?: string; + uploaderMaskIconSize?: string; + uploaderMaskMessageFontSize?: string; + uploaderMaskMessageLineHeight?: string; + uploaderLoadingIconSize?: string; + uploaderLoadingIconColor?: string; + uploaderDisabledOpacity?: string; +};