refactor: calendar

components/calendar/Header.tsx

@@ -1,9 +1,10 @@
 import Select from '../select';
 import { Group, Button } from '../radio';
-import { CalendarMode } from './generateCalendar';
-import { defineComponent, ref, Ref } from 'vue';
-import { Locale } from '../vc-picker/interface';
-import { GenerateConfig } from '../vc-picker/generate';
+import type { CalendarMode } from './generateCalendar';
+import type { Ref } from 'vue';
+import { defineComponent, ref } from 'vue';
+import type { Locale } from '../vc-picker/interface';
+import type { GenerateConfig } from '../vc-picker/generate';
 
 const YearSelectOffset = 10;
 const YearSelectTotal = 20;
@@ -72,6 +73,7 @@ function YearSelect<DateType>(props: SharedProps<DateType>) {
     />
   );
 }
+YearSelect.inheritAttrs = false;
 
 function MonthSelect<DateType>(props: SharedProps<DateType>) {
   const { prefixCls, fullscreen, validRange, value, generateConfig, locale, onChange, divRef } =
@@ -115,6 +117,8 @@ function MonthSelect<DateType>(props: SharedProps<DateType>) {
   );
 }
 
+MonthSelect.inheritAttrs = false;
+
 interface ModeSwitchProps<DateType> extends Omit<SharedProps<DateType>, 'onChange'> {
   mode: CalendarMode;
   onModeChange: (type: CalendarMode) => void;
@@ -136,6 +140,7 @@ function ModeSwitch<DateType>(props: ModeSwitchProps<DateType>) {
     </Group>
   );
 }
+ModeSwitch.inheritAttrs = false;
 
 export interface CalendarHeaderProps<DateType> {
   prefixCls: string;
@@ -151,6 +156,7 @@ export interface CalendarHeaderProps<DateType> {
 
 export default defineComponent<CalendarHeaderProps<any>>({
   name: 'CalendarHeader',
+  inheritAttrs: false,
   setup(_props, { attrs }) {
     const divRef = ref<HTMLDivElement>(null);
     return () => {

components/calendar/dayjs.tsx

@@ -1,4 +1,4 @@
-import { Dayjs } from 'dayjs';
+import type { Dayjs } from 'dayjs';
 import generateConfig from '../vc-picker/generate/dayjs';
 import { withInstall } from '../_util/type';
 import generateCalendar, { CalendarProps } from './generateCalendar';

components/calendar/generateCalendar.tsx

@@ -1,9 +1,9 @@
 import useMergedState from '../_util/hooks/useMergedState';
 import padStart from 'lodash-es/padStart';
-import { PickerPanel as RCPickerPanel } from '../vc-picker';
-import { Locale } from '../vc-picker/interface';
-import { GenerateConfig } from '../vc-picker/generate';
-import {
+import { PickerPanel } from '../vc-picker';
+import type { Locale } from '../vc-picker/interface';
+import type { GenerateConfig } from '../vc-picker/generate';
+import type {
   PickerPanelBaseProps as RCPickerPanelBaseProps,
   PickerPanelDateProps as RCPickerPanelDateProps,
   PickerPanelTimeProps as RCPickerPanelTimeProps,
@@ -11,8 +11,9 @@ import {
 import { useLocaleReceiver } from '../locale-provider/LocaleReceiver';
 import enUS from './locale/en_US';
 import CalendarHeader from './Header';
-import { VueNode } from '../_util/type';
-import { App, computed, defineComponent, toRef } from 'vue';
+import type { VueNode } from '../_util/type';
+import type { App } from 'vue';
+import { computed, defineComponent, toRef } from 'vue';
 import useConfigInject from '../_util/hooks/useConfigInject';
 import classNames from '../_util/classNames';
 
@@ -255,11 +256,11 @@ function generateCalendar<DateType>(generateConfig: GenerateConfig<DateType>) {
           <div
             {...attrs}
             class={classNames(
-              calendarPrefixCls,
+              calendarPrefixCls.value,
               {
-                [`${calendarPrefixCls}-full`]: fullscreen,
-                [`${calendarPrefixCls}-mini`]: !fullscreen,
-                [`${calendarPrefixCls}-rtl`]: direction.value === 'rtl',
+                [`${calendarPrefixCls.value}-full`]: fullscreen,
+                [`${calendarPrefixCls.value}-mini`]: !fullscreen,
+                [`${calendarPrefixCls.value}-rtl`]: direction.value === 'rtl',
               },
               attrs.class,
             )}
@@ -285,7 +286,7 @@ function generateCalendar<DateType>(generateConfig: GenerateConfig<DateType>) {
               />
             )}
 
-            <RCPickerPanel
+            <PickerPanel
               value={mergedValue.value}
               prefixCls={prefixCls.value}
               locale={mergedLocale.value.lang}

components/calendar/moment.tsx

@@ -1,4 +1,4 @@
-import { Moment } from 'moment';
+import type { Moment } from 'moment';
 import generateConfig from '../vc-picker/generate/moment';
 import { withInstall } from '../_util/type';
 import generateCalendar, { CalendarProps } from './generateCalendar';

components/date-picker/date-fns.tsx

@@ -6,7 +6,7 @@ import type {
   RangePickerProps as BaseRangePickerProps,
 } from './generatePicker';
 import generatePicker from './generatePicker';
-import { ExtraDatePickerProps, ExtraRangePickerProps } from './generatePicker/props';
+import type { ExtraDatePickerProps, ExtraRangePickerProps } from './generatePicker/props';
 
 export type DatePickerProps = PickerProps<Date> & ExtraDatePickerProps<Date>;
 export type MonthPickerProps = Omit<PickerDateProps<Date>, 'picker'> & ExtraDatePickerProps<Date>;

components/date-picker/dayjs.tsx

@@ -7,7 +7,7 @@ import type {
   RangePickerProps as BaseRangePickerProps,
 } from './generatePicker';
 import generatePicker from './generatePicker';
-import { ExtraDatePickerProps, ExtraRangePickerProps } from './generatePicker/props';
+import type { ExtraDatePickerProps, ExtraRangePickerProps } from './generatePicker/props';
 
 export type DatePickerProps = PickerProps<Dayjs> & ExtraDatePickerProps<Dayjs>;
 export type MonthPickerProps = Omit<PickerDateProps<Dayjs>, 'picker'> & ExtraDatePickerProps<Dayjs>;

components/date-picker/generatePicker/generateRangePicker.tsx

@@ -12,9 +12,10 @@ import { getTimeProps, Components } from '.';
 import { computed, defineComponent, ref } from 'vue';
 import useConfigInject from '../../_util/hooks/useConfigInject';
 import classNames from '../../_util/classNames';
-import { commonProps, ExtraRangePickerProps, rangePickerProps } from './props';
-import { PanelMode, RangeValue } from '../../vc-picker/interface';
-import { RangePickerSharedProps } from '../../vc-picker/RangePicker';
+import type { ExtraRangePickerProps } from './props';
+import { commonProps, rangePickerProps } from './props';
+import type { PanelMode, RangeValue } from '../../vc-picker/interface';
+import type { RangePickerSharedProps } from '../../vc-picker/RangePicker';
 import devWarning from '../../vc-util/devWarning';
 
 export default function generateRangePicker<DateType>(

components/date-picker/generatePicker/generateSinglePicker.tsx

@@ -9,10 +9,12 @@ import { getPlaceholder } from '../util';
 import { useLocaleReceiver } from '../../locale-provider/LocaleReceiver';
 import type { PickerProps, PickerDateProps, PickerTimeProps } from '.';
 import { getTimeProps, Components } from '.';
-import { computed, DefineComponent, defineComponent, ref } from 'vue';
+import type { DefineComponent } from 'vue';
+import { computed, defineComponent, ref } from 'vue';
 import useConfigInject from '../../_util/hooks/useConfigInject';
 import classNames from '../../_util/classNames';
-import { commonProps, datePickerProps, ExtraDatePickerProps } from './props';
+import type { ExtraDatePickerProps } from './props';
+import { commonProps, datePickerProps } from './props';
 import devWarning from '../../vc-util/devWarning';
 
 export default function generatePicker<DateType>(

components/date-picker/moment.tsx

@@ -7,7 +7,7 @@ import type {
   RangePickerProps as BaseRangePickerProps,
 } from './generatePicker';
 import generatePicker from './generatePicker';
-import { ExtraDatePickerProps, ExtraRangePickerProps } from './generatePicker/props';
+import type { ExtraDatePickerProps, ExtraRangePickerProps } from './generatePicker/props';
 
 export type DatePickerProps = PickerProps<Moment> & ExtraDatePickerProps<Moment>;
 export type MonthPickerProps = Omit<PickerDateProps<Moment>, 'picker'> &

components/locale-provider/LocaleReceiver.tsx

@@ -1,4 +1,5 @@
 import type { VNodeTypes, PropType, ComputedRef } from 'vue';
+import { toRefs, unref } from 'vue';
 import { inject, defineComponent, computed } from 'vue';
 import PropTypes from '../_util/vue-types';
 import defaultLocaleData from './default';
@@ -66,13 +67,13 @@ type LocaleComponent = keyof Locale;
 
 export function useLocaleReceiver<T extends LocaleComponent>(
   componentName: T,
-  defaultLocale?: Locale[T] | Function,
+  defaultLocale?: Locale[T] | Function | ComputedRef<Locale[T] | Function>,
 ): [ComputedRef<Locale[T]>] {
   const localeData = inject<LocaleReceiverContext>('localeData', {} as LocaleReceiverContext);
   const componentLocale = computed<Locale[T]>(() => {
     const { antLocale } = localeData;
     const locale =
-      defaultLocale || (defaultLocaleData as LocaleInterface)[componentName || 'global'];
+      unref(defaultLocale) || (defaultLocaleData as LocaleInterface)[componentName || 'global'];
     const localeFromContext = componentName && antLocale ? antLocale[componentName] : {};
 
     return {

components/time-picker/date-fns.tsx

@@ -1,7 +1,7 @@
 import createTimePicker from './time-picker';
 import dateFnsGenerateConfig from '../vc-picker/generate/dateFns';
-import { App } from 'vue';
-import { PickerTimeProps, RangePickerTimeProps } from '../date-picker/generatePicker';
+import type { App } from 'vue';
+import type { PickerTimeProps, RangePickerTimeProps } from '../date-picker/generatePicker';
 
 const { TimePicker, TimeRangePicker } = createTimePicker<Date>(dateFnsGenerateConfig);
 

components/time-picker/dayjs.tsx

@@ -1,8 +1,8 @@
-import { Dayjs } from 'dayjs';
+import type { Dayjs } from 'dayjs';
 import createTimePicker from './time-picker';
 import dayjsGenerateConfig from '../vc-picker/generate/dayjs';
-import { App } from 'vue';
-import { PickerTimeProps, RangePickerTimeProps } from '../date-picker/generatePicker';
+import type { App } from 'vue';
+import type { PickerTimeProps, RangePickerTimeProps } from '../date-picker/generatePicker';
 
 const { TimePicker, TimeRangePicker } = createTimePicker<Dayjs>(dayjsGenerateConfig);
 

components/time-picker/locale/ar_EG.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'اختيار الوقت',

components/time-picker/locale/az_AZ.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Vaxtı seç',

components/time-picker/locale/bg_BG.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Избор на час',

components/time-picker/locale/by_BY.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Выберыце час',

components/time-picker/locale/ca_ES.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Seleccionar hora',

components/time-picker/locale/cs_CZ.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Vybrat čas',

components/time-picker/locale/da_DK.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Vælg tid',

components/time-picker/locale/de_DE.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Zeit auswählen',

components/time-picker/locale/el_GR.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Επιλέξτε ώρα',

components/time-picker/locale/en_GB.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Select time',

components/time-picker/locale/en_US.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Select time',

components/time-picker/locale/es_ES.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Seleccionar hora',

components/time-picker/locale/et_EE.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Vali aeg',

components/time-picker/locale/fa_IR.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'انتخاب زمان',

components/time-picker/locale/fi_FI.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Valitse aika',

components/time-picker/locale/fr_BE.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: "Sélectionner l'heure",

components/time-picker/locale/fr_CA.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: "Sélectionner l'heure",

components/time-picker/locale/fr_FR.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: "Sélectionner l'heure",

components/time-picker/locale/ga_IE.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Roghnaigh am',

components/time-picker/locale/gl_ES.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Escolla hora',

components/time-picker/locale/he_IL.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'בחר שעה',

components/time-picker/locale/hi_IN.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'समय का चयन करें',

components/time-picker/locale/hr_HR.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Odaberite vrijeme',

components/time-picker/locale/hu_HU.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Válasszon időt',

components/time-picker/locale/id_ID.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Pilih waktu',

components/time-picker/locale/is_IS.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Velja tíma',

components/time-picker/locale/it_IT.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: "Selezionare l'orario",

components/time-picker/locale/ja_JP.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: '時間を選択',

components/time-picker/locale/kk_KZ.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Уақытты таңдаңыз',

components/time-picker/locale/kmr_IQ.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Demê hilbijêre',

components/time-picker/locale/kn_IN.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'ಸಮಯ ಆಯ್ಕೆಮಾಡಿ',

components/time-picker/locale/ko_KR.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: '시간 선택',

components/time-picker/locale/lt_LT.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Pasirinkite laiką',

components/time-picker/locale/lv_LV.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Izvēlieties laiku',

components/time-picker/locale/mk_MK.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Избери време',

components/time-picker/locale/mn_MN.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Цаг сонгох',

components/time-picker/locale/ms_MY.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Sila pilih masa',

components/time-picker/locale/nb_NO.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Velg tid',

components/time-picker/locale/nl_BE.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Selecteer tijd',

components/time-picker/locale/nl_NL.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Selecteer tijd',

components/time-picker/locale/pl_PL.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Wybierz godzinę',

components/time-picker/locale/pt_BR.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Hora',

components/time-picker/locale/pt_PT.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Hora',

components/time-picker/locale/ro_RO.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Selectează ora',

components/time-picker/locale/ru_RU.tsx

@@ -1,5 +1,5 @@
 /** Created by Andrey Gayvoronsky on 13/04/16. */
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Выберите время',

components/time-picker/locale/sk_SK.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Vybrať čas',

components/time-picker/locale/sl_SI.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Izberite čas',

components/time-picker/locale/sr_RS.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Izaberi vreme',

components/time-picker/locale/sv_SE.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Välj tid',

components/time-picker/locale/ta_IN.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'நேரத்தைத் தேர்ந்தெடுக்கவும்',

components/time-picker/locale/th_TH.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'เลือกเวลา',

components/time-picker/locale/tr_TR.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Zaman seç',

components/time-picker/locale/uk_UA.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Оберіть час',

components/time-picker/locale/vi_VN.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: 'Chọn thời gian',

components/time-picker/locale/zh_CN.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: '请选择时间',

components/time-picker/locale/zh_TW.tsx

@@ -1,4 +1,4 @@
-import { TimePickerLocale } from '../index';
+import type { TimePickerLocale } from '../index';
 
 const locale: TimePickerLocale = {
   placeholder: '請選擇時間',

components/time-picker/moment.tsx

@@ -1,8 +1,8 @@
-import { Moment } from 'moment';
+import type { Moment } from 'moment';
 import createTimePicker from './time-picker';
 import momentGenerateConfig from '../vc-picker/generate/moment';
-import { App } from 'vue';
-import { PickerTimeProps, RangePickerTimeProps } from '../date-picker/generatePicker';
+import type { App } from 'vue';
+import type { PickerTimeProps, RangePickerTimeProps } from '../date-picker/generatePicker';
 
 const { TimePicker, TimeRangePicker } = createTimePicker<Moment>(momentGenerateConfig);
 

components/time-picker/time-picker.tsx

@@ -1,16 +1,14 @@
 import { defineComponent, ref } from 'vue';
-import generatePicker, {
-  PickerTimeProps,
-  RangePickerTimeProps,
-} from '../date-picker/generatePicker';
+import type { PickerTimeProps, RangePickerTimeProps } from '../date-picker/generatePicker';
+import generatePicker from '../date-picker/generatePicker';
 import {
   commonProps,
   datePickerProps,
   rangePickerProps,
 } from '../date-picker/generatePicker/props';
-import { GenerateConfig } from '../vc-picker/generate';
-import { PanelMode, RangeValue } from '../vc-picker/interface';
-import { RangePickerSharedProps } from '../vc-picker/RangePicker';
+import type { GenerateConfig } from '../vc-picker/generate';
+import type { PanelMode, RangeValue } from '../vc-picker/interface';
+import type { RangePickerSharedProps } from '../vc-picker/RangePicker';
 import devWarning from '../vc-util/devWarning';
 
 export interface TimePickerLocale {

components/vc-picker/PanelContext.tsx

@@ -32,7 +32,7 @@ export const useProvidePanel = (props: PanelContextProps) => {
 };
 
 export const useInjectPanel = () => {
-  return inject(PanelContextKey);
+  return inject(PanelContextKey, {});
 };
 
 export default PanelContextKey;

components/vc-picker/Picker.tsx

@@ -36,7 +36,7 @@ import type { AlignType } from '../vc-align/interface';
 import useMergedState from '../_util/hooks/useMergedState';
 import { warning } from '../vc-util/warning';
 import classNames from '../_util/classNames';
-import { SharedTimeProps } from './panels/TimePanel';
+import type { SharedTimeProps } from './panels/TimePanel';
 
 export type PickerRefConfig = {
   focus: () => void;

examples/App.vue

@@ -1,39 +1,21 @@
 <template>
-  <div>
-    <demo />
-  </div>
+  <a-calendar v-model:value="value" @panelChange="onPanelChange" />
 </template>
-<script>
-import { defineComponent } from 'vue';
-import demo from '../v2-doc/src/docs/time-picker/demo/index.vue';
-// import Affix from '../components/affix';
+<script lang="ts">
+import { defineComponent, ref } from 'vue';
+import { Dayjs } from 'dayjs';
+
 export default defineComponent({
-  components: {
-    demo,
-    // Affix,
-  },
-  data() {
-    return {
-      visible: false,
-      pStyle: {
-        fontSize: '16px',
-        color: 'rgba(0,0,0,0.85)',
-        lineHeight: '24px',
-        display: 'block',
-        marginBottom: '16px',
-      },
-      pStyle2: {
-        marginBottom: '24px',
-      },
+  setup() {
+    const value = ref<Dayjs>();
+    const onPanelChange = (value: Dayjs, mode: string) => {
+      console.log(value, mode);
+    };
+
+    return {
+      value,
+      onPanelChange,
     };
-  },
-  methods: {
-    showDrawer() {
-      this.visible = true;
-    },
-    onClose() {
-      this.visible = false;
-    },
   },
 });
 </script>