props.d.ts 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316
  1. import type { FocusEventHandler, MouseEventHandler } from '../../_util/EventInterface';
  2. import type { CSSProperties, PropType } from 'vue';
  3. import type { PickerLocale } from '.';
  4. import type { SizeType } from '../../config-provider';
  5. import type { AlignType } from '../../vc-align/interface';
  6. import type { CustomFormat, DisabledTime, DisabledTimes, EventValue, PanelMode, PickerMode, RangeValue } from '../../vc-picker/interface';
  7. import type { DateRender } from '../../vc-picker/panels/DatePanel/DateBody';
  8. import type { MonthCellRender } from '../../vc-picker/panels/MonthPanel/MonthBody';
  9. import type { SharedTimeProps } from '../../vc-picker/panels/TimePanel';
  10. import type { RangeDateRender, RangeInfo, RangeType } from '../../vc-picker/RangePicker';
  11. import type { VueNode } from '../../_util/type';
  12. declare function commonProps<DateType = any>(): {
  13. id: StringConstructor;
  14. dropdownClassName: StringConstructor;
  15. dropdownAlign: {
  16. type: PropType<AlignType>;
  17. };
  18. popupStyle: {
  19. type: PropType<CSSProperties>;
  20. };
  21. transitionName: StringConstructor;
  22. placeholder: StringConstructor;
  23. allowClear: {
  24. type: BooleanConstructor;
  25. default: any;
  26. };
  27. autofocus: {
  28. type: BooleanConstructor;
  29. default: any;
  30. };
  31. disabled: {
  32. type: BooleanConstructor;
  33. default: any;
  34. };
  35. tabindex: NumberConstructor;
  36. open: {
  37. type: BooleanConstructor;
  38. default: any;
  39. };
  40. defaultOpen: {
  41. type: BooleanConstructor;
  42. default: any;
  43. };
  44. /** Make input readOnly to avoid popup keyboard in mobile */
  45. inputReadOnly: {
  46. type: BooleanConstructor;
  47. default: any;
  48. };
  49. format: {
  50. type: PropType<string | CustomFormat<DateType> | (string | CustomFormat<DateType>)[]>;
  51. };
  52. getPopupContainer: {
  53. type: PropType<(node: HTMLElement) => HTMLElement>;
  54. };
  55. panelRender: {
  56. type: PropType<(originPanel: VueNode) => VueNode>;
  57. };
  58. onChange: {
  59. type: PropType<(value: DateType | string | null, dateString: string) => void>;
  60. };
  61. 'onUpdate:value': {
  62. type: PropType<(value: DateType | string | null) => void>;
  63. };
  64. onOk: {
  65. type: PropType<(value: DateType | string | null) => void>;
  66. };
  67. onOpenChange: {
  68. type: PropType<(open: boolean) => void>;
  69. };
  70. 'onUpdate:open': {
  71. type: PropType<(open: boolean) => void>;
  72. };
  73. onFocus: {
  74. type: PropType<FocusEventHandler>;
  75. };
  76. onBlur: {
  77. type: PropType<FocusEventHandler>;
  78. };
  79. onMousedown: {
  80. type: PropType<MouseEventHandler>;
  81. };
  82. onMouseup: {
  83. type: PropType<MouseEventHandler>;
  84. };
  85. onMouseenter: {
  86. type: PropType<MouseEventHandler>;
  87. };
  88. onMouseleave: {
  89. type: PropType<MouseEventHandler>;
  90. };
  91. onClick: {
  92. type: PropType<MouseEventHandler>;
  93. };
  94. onContextmenu: {
  95. type: PropType<MouseEventHandler>;
  96. };
  97. onKeydown: {
  98. type: PropType<(event: KeyboardEvent, preventDefault: () => void) => void>;
  99. };
  100. role: StringConstructor;
  101. name: StringConstructor;
  102. autocomplete: StringConstructor;
  103. direction: {
  104. type: PropType<"ltr" | "rtl">;
  105. };
  106. showToday: {
  107. type: BooleanConstructor;
  108. default: any;
  109. };
  110. showTime: {
  111. type: PropType<boolean | SharedTimeProps<DateType>>;
  112. default: any;
  113. };
  114. locale: {
  115. type: PropType<PickerLocale>;
  116. };
  117. size: {
  118. type: PropType<SizeType>;
  119. };
  120. bordered: {
  121. type: BooleanConstructor;
  122. default: any;
  123. };
  124. dateRender: {
  125. type: PropType<DateRender<DateType>>;
  126. };
  127. disabledDate: {
  128. type: PropType<(date: DateType) => boolean>;
  129. };
  130. mode: {
  131. type: PropType<PanelMode>;
  132. };
  133. picker: {
  134. type: PropType<PickerMode>;
  135. };
  136. valueFormat: StringConstructor;
  137. /** @deprecated Please use `disabledTime` instead. */
  138. disabledHours: PropType<() => number[]>;
  139. /** @deprecated Please use `disabledTime` instead. */
  140. disabledMinutes: PropType<(hour: number) => number[]>;
  141. /** @deprecated Please use `disabledTime` instead. */
  142. disabledSeconds: PropType<(hour: number, minute: number) => number[]>;
  143. };
  144. export interface CommonProps<DateType> {
  145. id?: string;
  146. prefixCls?: string;
  147. dropdownClassName?: string;
  148. dropdownAlign?: AlignType;
  149. popupStyle?: CSSProperties;
  150. transitionName?: string;
  151. placeholder?: string;
  152. allowClear?: boolean;
  153. autofocus?: boolean;
  154. disabled?: boolean;
  155. tabindex?: number;
  156. open?: boolean;
  157. defaultOpen?: boolean;
  158. inputReadOnly?: boolean;
  159. format?: string | CustomFormat<DateType> | (string | CustomFormat<DateType>)[];
  160. suffixIcon?: VueNode;
  161. clearIcon?: VueNode;
  162. prevIcon?: VueNode;
  163. nextIcon?: VueNode;
  164. superPrevIcon?: VueNode;
  165. superNextIcon?: VueNode;
  166. getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
  167. panelRender?: (originPanel: VueNode) => VueNode;
  168. onChange?: (value: DateType | string | null, dateString: string) => void;
  169. 'onUpdate:value'?: (value: DateType | string | null) => void;
  170. onOk?: (value: DateType | string | null) => void;
  171. onOpenChange?: (open: boolean) => void;
  172. 'onUpdate:open'?: (open: boolean) => void;
  173. onFocus?: FocusEventHandler;
  174. onBlur?: FocusEventHandler;
  175. onMousedown?: MouseEventHandler;
  176. onMouseup?: MouseEventHandler;
  177. onMouseenter?: MouseEventHandler;
  178. onMouseleave?: MouseEventHandler;
  179. onClick?: MouseEventHandler;
  180. onContextmenu?: MouseEventHandler;
  181. onKeydown?: (event: KeyboardEvent, preventDefault: () => void) => void;
  182. role?: string;
  183. name?: string;
  184. autocomplete?: string;
  185. direction?: 'ltr' | 'rtl';
  186. showToday?: boolean;
  187. showTime?: boolean | SharedTimeProps<DateType>;
  188. locale?: PickerLocale;
  189. size?: SizeType;
  190. bordered?: boolean;
  191. dateRender?: DateRender<DateType>;
  192. disabledDate?: (date: DateType) => boolean;
  193. mode?: PanelMode;
  194. picker?: PickerMode;
  195. valueFormat?: string;
  196. }
  197. declare function datePickerProps<DateType = any>(): {
  198. defaultPickerValue: {
  199. type: PropType<string | DateType>;
  200. };
  201. defaultValue: {
  202. type: PropType<string | DateType>;
  203. };
  204. value: {
  205. type: PropType<string | DateType>;
  206. };
  207. disabledTime: {
  208. type: PropType<DisabledTime<DateType>>;
  209. };
  210. renderExtraFooter: {
  211. type: PropType<(mode: PanelMode) => VueNode>;
  212. };
  213. showNow: {
  214. type: BooleanConstructor;
  215. default: any;
  216. };
  217. monthCellRender: {
  218. type: PropType<MonthCellRender<DateType>>;
  219. };
  220. monthCellContentRender: {
  221. type: PropType<MonthCellRender<DateType>>;
  222. };
  223. };
  224. export interface DatePickerProps<DateType> {
  225. defaultPickerValue?: DateType | string;
  226. defaultValue?: DateType | string;
  227. value?: DateType | string;
  228. disabledTime?: DisabledTime<DateType>;
  229. renderExtraFooter?: (mode: PanelMode) => VueNode;
  230. showNow?: boolean;
  231. monthCellRender?: MonthCellRender<DateType>;
  232. monthCellContentRender?: MonthCellRender<DateType>;
  233. }
  234. declare function rangePickerProps<DateType>(): {
  235. allowEmpty: {
  236. type: PropType<[boolean, boolean]>;
  237. };
  238. dateRender: {
  239. type: PropType<RangeDateRender<DateType>>;
  240. };
  241. defaultPickerValue: {
  242. type: PropType<[DateType, DateType] | [string, string]>;
  243. };
  244. defaultValue: {
  245. type: PropType<[DateType, DateType] | [string, string]>;
  246. };
  247. value: {
  248. type: PropType<[DateType, DateType] | [string, string]>;
  249. };
  250. disabledTime: {
  251. type: PropType<(date: EventValue<DateType>, type: RangeType) => DisabledTimes>;
  252. };
  253. disabled: {
  254. type: PropType<boolean | [boolean, boolean]>;
  255. };
  256. renderExtraFooter: {
  257. type: PropType<() => VueNode>;
  258. };
  259. separator: {
  260. type: StringConstructor;
  261. };
  262. ranges: {
  263. type: PropType<Record<string, [DateType, DateType] | (() => Exclude<RangeValue<DateType>, null>)>>;
  264. };
  265. placeholder: ArrayConstructor;
  266. mode: {
  267. type: PropType<[PanelMode, PanelMode]>;
  268. };
  269. onChange: {
  270. type: PropType<(value: RangeValue<DateType> | RangeValue<string> | null, dateString: [string, string]) => void>;
  271. };
  272. 'onUpdate:value': {
  273. type: PropType<(value: RangeValue<DateType> | RangeValue<string> | null) => void>;
  274. };
  275. onCalendarChange: {
  276. type: PropType<(values: RangeValue<DateType> | RangeValue<string>, formatString: [string, string], info: RangeInfo) => void>;
  277. };
  278. onPanelChange: {
  279. type: PropType<(values: RangeValue<DateType> | RangeValue<string>, modes: [PanelMode, PanelMode]) => void>;
  280. };
  281. onOk: {
  282. type: PropType<(dates: RangeValue<DateType> | RangeValue<string>) => void>;
  283. };
  284. };
  285. export interface RangePickerProps<DateType> {
  286. allowEmpty?: [boolean, boolean];
  287. dateRender?: RangeDateRender<DateType>;
  288. defaultPickerValue?: RangeValue<DateType> | RangeValue<string>;
  289. defaultValue?: RangeValue<DateType> | RangeValue<string>;
  290. value?: RangeValue<DateType> | RangeValue<string>;
  291. disabledTime?: (date: EventValue<DateType>, type: RangeType) => DisabledTimes;
  292. disabled?: [boolean, boolean];
  293. renderExtraFooter?: () => VueNode;
  294. separator?: string;
  295. ranges?: Record<string, Exclude<RangeValue<DateType>, null> | (() => Exclude<RangeValue<DateType>, null>)>;
  296. placeholder?: [string, string];
  297. mode?: [PanelMode, PanelMode];
  298. onChange?: (value: RangeValue<DateType> | RangeValue<string> | null, dateString: [string, string]) => void;
  299. 'onUpdate:value'?: (value: RangeValue<DateType> | RangeValue<string> | null) => void;
  300. onCalendarChange?: (values: RangeValue<DateType> | RangeValue<string>, formatString: [string, string], info: RangeInfo) => void;
  301. onPanelChange?: (values: RangeValue<DateType> | RangeValue<string>, modes: [PanelMode, PanelMode]) => void;
  302. onOk?: (dates: RangeValue<DateType> | RangeValue<string>) => void;
  303. }
  304. export declare type ExtraDatePickerProps<DateType> = {
  305. valueFormat?: string;
  306. defaultPickerValue?: DateType | string;
  307. defaultValue?: DateType | string;
  308. value?: DateType | string;
  309. };
  310. export declare type ExtraRangePickerProps<DateType> = {
  311. valueFormat?: string;
  312. defaultPickerValue?: RangeValue<DateType> | RangeValue<string>;
  313. defaultValue?: RangeValue<DateType> | RangeValue<string>;
  314. value?: RangeValue<DateType> | RangeValue<string>;
  315. };
  316. export { commonProps, datePickerProps, rangePickerProps };