import type { CSSProperties } from 'react'; import type { Dayjs } from 'dayjs'; import type { TimeFormatConfig, DateFormatConfig, WeekdayFormatConfig, ContainerStyleConfig, TextStyleConfig, TextAlign } from '../pisellDateTimeDisplay/types'; export type { TimeFormatConfig, DateFormatConfig, WeekdayFormatConfig, ContainerStyleConfig, TextStyleConfig, TextAlign, }; /** * 字段类型(时间区间、日期、星期、持续时长) * - time: 时间区间块(HH:mm-HH:mm 或跨天起止) * - date: 日期块 * - weekday: 星期块 * - duration: 持续时长块 */ export declare type TimeRangeFieldType = 'time' | 'date' | 'weekday' | 'duration'; /** * 持续时长格式配置 */ export interface DurationFormatConfig { /** * 是否显示秒 * @default false * @example true -> "2h30m23s" | false -> "2h30m" */ showSeconds?: boolean; } /** * 字段配置 */ export interface TimeRangeFieldConfig { /** * 是否显示时间区间块 * @default true */ showTimeRange?: boolean; /** * 是否显示日期块 * @default true */ showDate?: boolean; /** * 是否显示星期块 * @default true */ showWeekday?: boolean; /** * 是否显示持续时长块 * @default true */ showDuration?: boolean; /** * 字段顺序(四类块可任意排序;默认 时间 日期 星期 持续时长,可实现「持续时间在前」等) * @default ['weekday', 'date', 'time', 'duration'] 换行顺序:先持续时间 → 结束时间(跨天)→ 开始/结束时间与日期 → 星期 */ fieldOrder?: TimeRangeFieldType[]; } /** * startAt / endAt 的 dayjs 兼容值 */ export declare type DayjsLike = Dayjs | string | number; /** * PisellTimeRangeDisplay 组件 Props */ export interface PisellTimeRangeDisplayProps { /** * 开始时间(dayjs 兼容值) */ startAt: DayjsLike; /** * 结束时间(dayjs 兼容值) */ endAt: DayjsLike; /** * 文本对齐方式(单行/多行均生效) * @default 'center' */ textAlign?: TextAlign; /** * 字段显示与排序配置 */ fields?: TimeRangeFieldConfig; /** * 同一天时是否显示具体日期 * @default true */ showDateForSameDay?: boolean; /** * 时间格式配置(复用 PisellDateTimeDisplay) */ timeFormat?: TimeFormatConfig; /** * 日期格式配置(复用 PisellDateTimeDisplay) */ dateFormat?: DateFormatConfig; /** * 星期格式配置(复用 PisellDateTimeDisplay) */ weekdayFormat?: WeekdayFormatConfig; /** * 持续时长格式配置 */ durationFormat?: DurationFormatConfig; /** * 容器样式 */ containerStyle?: ContainerStyleConfig; /** * 时间区间文本样式 */ timeStyle?: TextStyleConfig; /** * 日期文本样式 */ dateStyle?: TextStyleConfig; /** * 星期文本样式 */ weekdayStyle?: TextStyleConfig; /** * 持续时长文本样式 */ durationStyle?: TextStyleConfig; /** * dayjs locale(语言代码) * @default 优先使用全局配置,其次浏览器语言 */ locale?: string; /** * 自定义类名 */ className?: string; /** * 自定义样式 */ style?: CSSProperties; /** * 点击回调 */ onClick?: () => void; }