@zerodep-dev/vue-tsx-pro-ui 0.0.0-stage → 0.1.0

package/dist/date/date-segments.js

@@ -0,0 +1,410 @@
+import { isoWeeksInYear } from "../utils/data/date.js";
+import { computed, ref, shallowRef, watch } from "vue";
+//#region src/date/date-segments.ts
+/**
+* 分段输入的状态（年、月、日、时、分、秒、上午 / 下午）：DateField、TimeField 共用。参考 React Aria 的 useDateFieldState。
+* 不碰 DOM：组件把每段渲染成 role="spinbutton" 的可聚焦元素，按键、输入交给这里，焦点该去哪一段由 focusedSegment 告诉组件。
+*
+* - 段的顺序、分隔符取自 Intl（zh-CN 年/月/日，en-US 月/日/年，de-DE 日.月.年），12 / 24 小时制按语言或配置；
+* - 逐段输入：打一个数字后，再打一个就超出范围时直接跳到下一段（月份打 3 → 03 跳走，打 1 → 等第二位）；
+* - ↑↓ 加减（到头时回绕），Page Up / Down 大步，Home / End 到最小 / 最大，Backspace 删一位、删空后回到上一段；
+* - 所有段都填了才写回值；填好的值删掉一段时写回 null。认全角数字与阿拉伯-印度数字。
+*
+*   const segments = useDateSegments({ fields: () => ['year', 'month', 'day'], value: () => fields, onChange, … });
+*/
+/** Page Up / Down 的步长（同 React Aria） */
+var BIG_STEPS = {
+	year: 5,
+	month: 2,
+	day: 7,
+	quarter: 2,
+	week: 4,
+	hour: 2,
+	minute: 15,
+	second: 15,
+	dayPeriod: 1
+};
+/** 全角数字、阿拉伯-印度数字 → 半角 */
+function normalizeDigits(text) {
+	return text.replace(/[０-９]/g, (char) => String.fromCharCode(char.charCodeAt(0) - 65248)).replace(/[\u0660-\u0669]/g, (char) => String(char.charCodeAt(0) - 1632)).replace(/[\u06f0-\u06f9]/g, (char) => String(char.charCodeAt(0) - 1776));
+}
+var daysInMonth = (year, month) => month == null ? 31 : new Date(Date.UTC(year ?? 2e3, month, 0)).getUTCDate();
+/** 分段输入的状态（组件 setup 里调用） */
+function useDateSegments(config) {
+	const draft = ref({ ...config.value() });
+	const buffer = ref("");
+	let pendingYear = false;
+	const focusedSegment = shallowRef(null);
+	watch(() => config.value(), (value) => {
+		if (sameFields(value, complete.value ? draft.value : null)) return;
+		draft.value = { ...value };
+		buffer.value = "";
+	});
+	const hour12 = computed(() => {
+		return (config.hourCycle?.() ?? resolvedHourCycle(config.locale())) === "h12";
+	});
+	const fields = computed(() => {
+		const list = [...config.fields()];
+		if (hour12.value && list.includes("hour")) list.push("dayPeriod");
+		return list;
+	});
+	const complete = computed(() => config.fields().every((field) => draft.value[field] != null));
+	/** 按语言的顺序排好的段（含分隔符）：只取格式化结果的结构，值另外填 */
+	const layout = computed(() => {
+		const period = config.fields().find((field) => field === "quarter" || field === "week");
+		if (period) return (config.periodPatterns?.()[period] ?? `{year}-{${period}}`).split(/(\{(?:year|quarter|week)\})/).filter(Boolean).map((part) => {
+			const field = /^\{(year|quarter|week)\}$/.exec(part)?.[1];
+			return field ? {
+				type: field,
+				literal: ""
+			} : {
+				type: "literal",
+				literal: part
+			};
+		});
+		const options = {
+			hourCycle: hour12.value ? "h12" : "h23",
+			timeZone: "UTC"
+		};
+		for (const field of config.fields()) options[field] = field === "year" ? "numeric" : "2-digit";
+		const parts = new Intl.DateTimeFormat(config.locale(), options).formatToParts(SAMPLE);
+		const wanted = new Set(fields.value);
+		return parts.filter((part) => part.type === "literal" || wanted.has(part.type)).map((part) => ({
+			type: part.type,
+			literal: part.value
+		})).filter((part, index, all) => part.type !== "literal" || part.literal.trim() !== "" || index > 0 && index < all.length - 1);
+	});
+	const labels = computed(() => {
+		const names = new Intl.DisplayNames(config.locale(), { type: "dateTimeField" });
+		return Object.fromEntries(fields.value.map((field) => [field, names.of(field === "week" ? "weekOfYear" : field) ?? field]));
+	});
+	const digits = computed(() => {
+		const locale = config.locale();
+		const format = (width) => new Intl.NumberFormat(locale, {
+			useGrouping: false,
+			minimumIntegerDigits: width
+		});
+		return {
+			1: format(1),
+			2: format(2),
+			4: format(4)
+		};
+	});
+	const periods = computed(() => {
+		const formatter = new Intl.DateTimeFormat(config.locale(), {
+			hour: "numeric",
+			hourCycle: "h12",
+			timeZone: "UTC"
+		});
+		const period = (hour) => formatter.formatToParts(Date.UTC(2e3, 0, 1, hour)).find((part) => part.type === "dayPeriod")?.value ?? (hour < 12 ? "AM" : "PM");
+		return [period(0), period(12)];
+	});
+	function range(type) {
+		switch (type) {
+			case "year": return [1, 9999];
+			case "month": return [1, 12];
+			case "day": return [1, daysInMonth(draft.value.year, draft.value.month)];
+			case "quarter": return [1, 4];
+			case "week": return [1, draft.value.year == null ? 53 : isoWeeksInYear(draft.value.year)];
+			case "hour": return hour12.value ? [1, 12] : [0, 23];
+			case "minute":
+			case "second": return [0, 59];
+			case "dayPeriod": return [0, 1];
+		}
+	}
+	/** 段上显示的值：12 小时制的时显示 1–12，上午 / 下午是 0 / 1 */
+	function shown(type) {
+		const hour = draft.value.hour;
+		if (type === "dayPeriod") return hour == null ? null : hour >= 12 ? 1 : 0;
+		if (type === "hour" && hour12.value && hour != null) return hour % 12 || 12;
+		return draft.value[type] ?? null;
+	}
+	function text(type, value) {
+		if (type === "dayPeriod") return value == null ? "" : periods.value[value];
+		if (buffer.value && focusedSegment.value === type) return digits.value[1].format(Number(buffer.value));
+		if (value == null) return "";
+		const width = type === "year" ? 4 : type === "quarter" || type === "hour" && hour12.value ? 1 : 2;
+		return digits.value[width].format(value);
+	}
+	/**
+	* 空段的占位：语言包里的单位字（年、月、日）；后面紧跟的文字已经是这个单位时（中文的“2026年”）改用横线，
+	* 显示成“––年”，否则会是“年年”
+	*/
+	function placeholderOf(type, next) {
+		const unit = config.placeholders()[type];
+		return !unit || next?.trimStart().startsWith(unit) ? "––" : unit;
+	}
+	const segments = computed(() => layout.value.map(({ type, literal }, index) => {
+		if (type === "literal") return {
+			type,
+			text: literal,
+			placeholder: false,
+			value: null,
+			min: 0,
+			max: 0,
+			label: ""
+		};
+		const value = shown(type);
+		const [min, max] = range(type);
+		const filled = text(type, value);
+		const following = layout.value[index + 1];
+		return {
+			type,
+			text: filled || placeholderOf(type, following?.literal),
+			placeholder: !filled,
+			value,
+			min,
+			max,
+			label: labels.value[type]
+		};
+	}));
+	const editable = computed(() => segments.value.filter((segment) => segment.type !== "literal"));
+	/** 写一段的值（显示值：12 小时制的时是 1–12）；写完检查是否填全，emit 为 false 时只改草稿 */
+	function write(type, value, emit = true) {
+		const next = { ...draft.value };
+		if (type === "dayPeriod") {
+			if (next.hour == null || value == null) return;
+			next.hour = next.hour % 12 + value * 12;
+		} else if (type === "hour" && hour12.value && value != null) {
+			const afternoon = (draft.value.hour ?? config.placeholderValue().hour ?? 0) >= 12;
+			next.hour = value % 12 + (afternoon ? 12 : 0);
+		} else if (value == null) delete next[type];
+		else next[type] = value;
+		const wasComplete = complete.value;
+		draft.value = next;
+		pendingYear = !emit;
+		if (!emit) return;
+		if (complete.value) config.onChange(constrained(next));
+		else if (wasComplete) config.onChange(null);
+	}
+	function commit() {
+		if (!pendingYear) return;
+		pendingYear = false;
+		if (complete.value) config.onChange(constrained(draft.value));
+	}
+	function constrained(values) {
+		if (values.week != null && values.year != null) return {
+			...values,
+			week: Math.min(values.week, isoWeeksInYear(values.year))
+		};
+		if (values.day == null) return values;
+		return {
+			...values,
+			day: Math.min(values.day, daysInMonth(values.year, values.month))
+		};
+	}
+	const current = () => focusedSegment.value;
+	const state = {
+		get segments() {
+			return segments.value;
+		},
+		get editable() {
+			return editable.value;
+		},
+		get focusedSegment() {
+			return focusedSegment.value;
+		},
+		get partial() {
+			return !complete.value && config.fields().some((field) => draft.value[field] != null);
+		},
+		setFocused(type) {
+			if (type !== focusedSegment.value) {
+				commit();
+				buffer.value = "";
+			}
+			focusedSegment.value = type;
+		},
+		type(input) {
+			if (!current() || config.readonly?.()) return;
+			for (const char of normalizeDigits(input)) {
+				const segment = current();
+				if (!segment) return;
+				if (segment === "dayPeriod") {
+					const lower = char.toLocaleLowerCase();
+					const [am, pm] = periods.value.map((label) => label.toLocaleLowerCase());
+					if (lower === "a" || am.startsWith(lower)) write("dayPeriod", 0);
+					else if (lower === "p" || pm.startsWith(lower)) write("dayPeriod", 1);
+					else continue;
+					state.moveFocus(1);
+					continue;
+				}
+				if (!/\d/.test(char)) continue;
+				const [min, max] = range(segment);
+				let next = buffer.value + char;
+				if (Number(next) > max) next = char;
+				buffer.value = next;
+				const number = Number(next);
+				if (number >= min) write(segment, number, segment !== "year" || next.length >= 4);
+				const maxDigits = String(max).length;
+				if (next.length >= maxDigits || number * 10 > max) {
+					buffer.value = "";
+					if (number < min) write(segment, min);
+					state.moveFocus(1);
+				}
+			}
+		},
+		increment(amount) {
+			const type = current();
+			if (!type || config.readonly?.()) return;
+			buffer.value = "";
+			const [min, max] = range(type);
+			const value = shown(type);
+			if (value == null) {
+				const start = config.placeholderValue();
+				if (type === "dayPeriod") {
+					if (draft.value.hour == null) write("hour", hour12.value ? (start.hour ?? 0) % 12 || 12 : start.hour ?? 0);
+					write("dayPeriod", (start.hour ?? 0) >= 12 ? 1 : 0);
+					return;
+				}
+				write(type, type === "hour" && hour12.value ? (start.hour ?? 0) % 12 || 12 : start[type] ?? min);
+				return;
+			}
+			const size = max - min + 1;
+			write(type, ((value - min + amount) % size + size) % size + min);
+		},
+		toEdge(edge) {
+			const type = current();
+			if (!type || config.readonly?.()) return;
+			buffer.value = "";
+			const [min, max] = range(type);
+			write(type, edge === "min" ? min : max);
+		},
+		backspace() {
+			const type = current();
+			if (!type || config.readonly?.()) return;
+			const value = shown(type);
+			if (value == null && !buffer.value) {
+				state.moveFocus(-1);
+				return;
+			}
+			const digitsLeft = type === "dayPeriod" ? "" : (buffer.value || String(value)).slice(0, -1);
+			buffer.value = digitsLeft;
+			const [min] = range(type);
+			if (type === "dayPeriod" || !digitsLeft) {
+				if (type === "dayPeriod" || type === "hour") {
+					const next = { ...draft.value };
+					delete next.hour;
+					const wasComplete = complete.value;
+					draft.value = next;
+					if (wasComplete) config.onChange(null);
+					return;
+				}
+				write(type, null);
+				return;
+			}
+			if (Number(digitsLeft) >= min) write(type, Number(digitsLeft));
+		},
+		clear() {
+			buffer.value = "";
+			pendingYear = false;
+			const wasComplete = complete.value;
+			draft.value = {};
+			if (wasComplete) config.onChange(null);
+		},
+		reset() {
+			buffer.value = "";
+			pendingYear = false;
+			draft.value = { ...config.value() };
+		},
+		commit,
+		moveFocus(direction) {
+			const list = editable.value;
+			const next = list[list.findIndex((segment) => segment.type === current()) + direction];
+			if (next) state.setFocused(next.type);
+			else config.onExit?.(direction);
+		}
+	};
+	return state;
+}
+/**
+* 分段输入的键盘操作：↑↓ 加减、Page Up / Down 大步、Home / End 最小 / 最大、Backspace / Delete 删除、
+* ←→ 换段（从右到左排版时反过来）。数字与字母走 beforeinput（软键盘、输入法也能输入），这里不处理。
+* 返回是否处理了这个按键（处理了就该 preventDefault）
+*/
+function handleSegmentKeydown(state, event, rtl = false) {
+	if (event.altKey || event.ctrlKey || event.metaKey) return false;
+	const type = state.focusedSegment;
+	if (!type) return false;
+	const forward = rtl ? -1 : 1;
+	const action = {
+		ArrowUp: () => state.increment(1),
+		ArrowDown: () => state.increment(-1),
+		PageUp: () => state.increment(BIG_STEPS[type]),
+		PageDown: () => state.increment(-BIG_STEPS[type]),
+		Home: () => state.toEdge("min"),
+		End: () => state.toEdge("max"),
+		Backspace: () => state.backspace(),
+		Delete: () => state.backspace(),
+		ArrowRight: () => state.moveFocus(forward),
+		ArrowLeft: () => state.moveFocus(-forward)
+	}[event.key];
+	if (!action) return false;
+	action();
+	return true;
+}
+/** 取段的顺序用的任意时刻（各段都是两位数，排版不受值影响） */
+var SAMPLE = Date.UTC(2e3, 10, 22, 13, 44, 55);
+/** 语言默认的小时制 */
+function resolvedHourCycle(locale) {
+	const cycle = new Intl.DateTimeFormat(locale, { hour: "numeric" }).resolvedOptions().hourCycle;
+	return cycle === "h11" || cycle === "h12" ? "h12" : "h23";
+}
+function sameFields(a, b) {
+	if (a == null || b == null) return a === b;
+	return [.../* @__PURE__ */ new Set([...Object.keys(a), ...Object.keys(b)])].every((key) => a[key] === b[key]);
+}
+var ALL_FIELDS = [
+	"year",
+	"month",
+	"day",
+	"hour",
+	"minute",
+	"second"
+];
+/** 日期分段：从年到 granularity；time 时只取时间的部分（TimeField） */
+function segmentFields(granularity, time = false) {
+	if (granularity === "quarter" || granularity === "week") return time ? [] : ["year", granularity];
+	const fields = ALL_FIELDS.slice(0, ALL_FIELDS.indexOf(granularity) + 1);
+	return time ? fields.filter((field) => field === "hour" || field === "minute" || field === "second") : fields;
+}
+var pad = (value, width = 2) => String(value).padStart(width, "0");
+/** 各段的值 → ISO 字符串（按有哪些段：'2026'、'2026-10'、'2026-10-20'、'2026-10-20T14:30'、'14:30'） */
+function fieldsToIso(values, fields) {
+	if (fields.includes("quarter")) return `${pad(values.year ?? 0, 4)}-Q${values.quarter ?? 1}`;
+	if (fields.includes("week")) return `${pad(values.year ?? 0, 4)}-W${pad(values.week ?? 1)}`;
+	const date = [
+		values.year != null && pad(values.year, 4),
+		fields.includes("month") && pad(values.month ?? 1),
+		fields.includes("day") && pad(values.day ?? 1)
+	].filter((part) => part !== false).join("-");
+	if (!fields.includes("hour")) return date;
+	const time = [
+		pad(values.hour ?? 0),
+		pad(values.minute ?? 0),
+		fields.includes("second") && pad(values.second ?? 0)
+	].filter((part) => part !== false).join(":");
+	return fields.includes("year") ? `${date}T${time}` : time;
+}
+/** ISO 字符串 → 各段的值；格式不对时 null。只取 fields 里有的段（'2026-10-20T14:30' 给 DateField 时只要日期） */
+function isoToFields(value, fields) {
+	if (!value) return null;
+	const period = /^(\d{4})-(?:Q([1-4])|W(\d{2}))$/.exec(value);
+	if (period) {
+		const parsed = { year: Number(period[1]) };
+		if (period[2] != null) parsed.quarter = Number(period[2]);
+		if (period[3] != null) parsed.week = Number(period[3]);
+		return fields.every((field) => parsed[field] != null) ? parsed : null;
+	}
+	const match = /^(?:(\d{4})(?:-(\d{2})(?:-(\d{2}))?)?)?(?:T?(\d{2}):(\d{2})(?::(\d{2}))?)?$/.exec(value);
+	if (!match) return null;
+	const parsed = {};
+	ALL_FIELDS.forEach((field, index) => {
+		const text = match[index + 1];
+		if (fields.includes(field) && text != null) parsed[field] = Number(text);
+	});
+	return fields.every((field) => parsed[field] != null) ? parsed : null;
+}
+//#endregion
+export { fieldsToIso, handleSegmentKeydown, isoToFields, segmentFields, useDateSegments };
+
+//# sourceMappingURL=date-segments.js.map

package/dist/date/date-segments.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-segments.js","names":[],"sources":["../../src/date/date-segments.ts"],"sourcesContent":["/**\n * 分段输入的状态（年、月、日、时、分、秒、上午 / 下午）：DateField、TimeField 共用。参考 React Aria 的 useDateFieldState。\n * 不碰 DOM：组件把每段渲染成 role=\"spinbutton\" 的可聚焦元素，按键、输入交给这里，焦点该去哪一段由 focusedSegment 告诉组件。\n *\n * - 段的顺序、分隔符取自 Intl（zh-CN 年/月/日，en-US 月/日/年，de-DE 日.月.年），12 / 24 小时制按语言或配置；\n * - 逐段输入：打一个数字后，再打一个就超出范围时直接跳到下一段（月份打 3 → 03 跳走，打 1 → 等第二位）；\n * - ↑↓ 加减（到头时回绕），Page Up / Down 大步，Home / End 到最小 / 最大，Backspace 删一位、删空后回到上一段；\n * - 所有段都填了才写回值；填好的值删掉一段时写回 null。认全角数字与阿拉伯-印度数字。\n *\n *   const segments = useDateSegments({ fields: () => ['year', 'month', 'day'], value: () => fields, onChange, … });\n */\nimport { computed, ref, shallowRef, watch } from 'vue';\nimport type { HourCycles } from '../config/lang/lang';\nimport { isoWeeksInYear } from '../utils/data/date';\n\n/** 可以输入的段 */\nexport interface DateSegmentTypes {\n  /** 年 */\n  year: unknown;\n  /** 月 */\n  month: unknown;\n  /** 日 */\n  day: unknown;\n  /** 季度（1–4） */\n  quarter: unknown;\n  /** 一年里的第几周（ISO 8601：周一开始，含 1 月 4 日的那周是第 1 周） */\n  week: unknown;\n  /** 时（内部总是 0–23，12 小时制时显示 1–12） */\n  hour: unknown;\n  /** 分 */\n  minute: unknown;\n  /** 秒 */\n  second: unknown;\n  /** 上午 / 下午（12 小时制时自动加上） */\n  dayPeriod: unknown;\n}\n\n/** 一段的类型 */\nexport type DateSegmentType = keyof DateSegmentTypes;\n\n/** 值的各个字段：时是 0–23 */\nexport type DateFieldValues = Partial<Record<Exclude<DateSegmentType, 'dayPeriod'>, number>>;\n\n/** 渲染用的一段 */\nexport interface DateSegment {\n  /** 段的类型；literal 是分隔符（/、:、年） */\n  type: DateSegmentType | 'literal';\n  /** 显示的文字：值、正在输入的数字，或占位文字 */\n  text: string;\n  /** 还没填：显示的是占位文字 */\n  placeholder: boolean;\n  /** 当前值（dayPeriod 是 0 上午 / 1 下午）；没填时 null */\n  value: number | null;\n  /** 最小值（aria-valuemin） */\n  min: number;\n  /** 最大值（aria-valuemax） */\n  max: number;\n  /** 段的名称（取自 Intl.DisplayNames：年、月、日 / year、month、day），给 aria-label */\n  label: string;\n}\n\n/** useDateSegments 的选项 */\nexport interface DateSegmentsOptions {\n  /** 有哪些段（不含 dayPeriod，12 小时制时自动加） */\n  fields: () => readonly Exclude<DateSegmentType, 'dayPeriod'>[];\n  /** 语言：段的顺序、分隔符、数字的写法 */\n  locale: () => string;\n  /** 12 / 24 小时制；不写时按语言 */\n  hourCycle?: () => keyof HourCycles | undefined;\n  /** 完整的值（外部传入）；没有时 null */\n  value: () => DateFieldValues | null;\n  /** 所有段都填了时写回完整的值，填好的值删掉一段时写回 null */\n  onChange: (value: DateFieldValues | null) => void;\n  /** ↑↓ 从空段开始加减时的起点（一般是现在） */\n  placeholderValue: () => DateFieldValues;\n  /** 各段的占位文字（年、月、日 / yyyy、mm、dd） */\n  placeholders: () => Partial<Record<DateSegmentType, string>>;\n  /** 季度、周这两种段的排法（Intl 不排它们），如 `'{year}年第{quarter}季度'`；不写时是 `'{year}-{quarter}'` */\n  periodPatterns?: () => Partial<Record<'quarter' | 'week', string>>;\n  /** 只读或不可用：不响应输入 */\n  readonly?: () => boolean;\n  /** 焦点要越过这组的两端时（最后一段输入满了；第一段删空后再删）：DateRangePicker 把焦点交给另一组 */\n  onExit?: (direction: 1 | -1) => void;\n}\n\n/** 分段输入的状态与操作 */\nexport interface DateSegmentsState {\n  /** 各段，含分隔符，按语言的顺序 */\n  readonly segments: readonly DateSegment[];\n  /** 可以输入的段（不含分隔符），Tab 与 ←→ 的顺序 */\n  readonly editable: readonly DateSegment[];\n  /** 焦点应该在的段：输入满了跳到下一段、Backspace 删空回到上一段时变化 */\n  readonly focusedSegment: DateSegmentType | null;\n  /** 有段填了、但还没填全 */\n  readonly partial: boolean;\n  /** 焦点进了某一段（组件的 focusin） */\n  setFocused(type: DateSegmentType | null): void;\n  /** 在焦点段输入文字（数字、a / p）：逐个字符处理 */\n  type(text: string): void;\n  /** 焦点段加减 */\n  increment(amount: number): void;\n  /** 焦点段设成最小 / 最大值 */\n  toEdge(edge: 'min' | 'max'): void;\n  /** 删掉焦点段的最后一位；已经空了时焦点回到上一段 */\n  backspace(): void;\n  /** 清空所有段 */\n  clear(): void;\n  /** 丢掉还没写回的输入（打了一半的段），回到当前的值：表单重置时 */\n  reset(): void;\n  /** 写回还没写回的年份（没打满四位时先不写回）：离开这一段、按 Enter 提交时 */\n  commit(): void;\n  /** 焦点移到相邻的段 */\n  moveFocus(direction: 1 | -1): void;\n}\n\n/** Page Up / Down 的步长（同 React Aria） */\nconst BIG_STEPS: Record<DateSegmentType, number> = {\n  year: 5,\n  month: 2,\n  day: 7,\n  quarter: 2,\n  week: 4,\n  hour: 2,\n  minute: 15,\n  second: 15,\n  dayPeriod: 1,\n};\n\n/** 全角数字、阿拉伯-印度数字 → 半角 */\nfunction normalizeDigits(text: string): string {\n  return text\n    .replace(/[０-９]/g, (char) => String.fromCharCode(char.charCodeAt(0) - 0xfee0))\n    .replace(/[\\u0660-\\u0669]/g, (char) => String(char.charCodeAt(0) - 0x0660))\n    .replace(/[\\u06f0-\\u06f9]/g, (char) => String(char.charCodeAt(0) - 0x06f0));\n}\n\nconst daysInMonth = (year: number | undefined, month: number | undefined) =>\n  month == null ? 31 : new Date(Date.UTC(year ?? 2000, month, 0)).getUTCDate();\n\n/** 分段输入的状态（组件 setup 里调用） */\nexport function useDateSegments(config: DateSegmentsOptions): DateSegmentsState {\n  // 正在编辑的各字段：可以只填了一部分\n  const draft = ref<DateFieldValues>({ ...config.value() });\n  // 当前段已经打了的数字（还可能接着打第二位）\n  const buffer = ref('');\n  // 年份没打满四位：草稿里有了，先不写回（逐位打 2、0、2、6 时不写出 0002、0020、0202）\n  let pendingYear = false;\n  const focusedSegment = shallowRef<DateSegmentType | null>(null);\n\n  // 外部的值变了（父级改了、清空了）时以它为准；自己写回的值也会回到这里，结果相同\n  watch(\n    () => config.value(),\n    (value) => {\n      if (sameFields(value, complete.value ? draft.value : null)) return;\n      draft.value = { ...value };\n      buffer.value = '';\n    },\n  );\n\n  const hour12 = computed(() => {\n    const cycle = config.hourCycle?.() ?? resolvedHourCycle(config.locale());\n    return cycle === 'h12';\n  });\n\n  const fields = computed(() => {\n    const list: DateSegmentType[] = [...config.fields()];\n    if (hour12.value && list.includes('hour')) list.push('dayPeriod');\n    return list;\n  });\n\n  const complete = computed(() => config.fields().every((field) => draft.value[field] != null));\n\n  /** 按语言的顺序排好的段（含分隔符）：只取格式化结果的结构，值另外填 */\n  const layout = computed(() => {\n    // 季度、周：Intl 不排这两种段，按语言包的排法\n    const period = config.fields().find((field) => field === 'quarter' || field === 'week');\n    if (period) {\n      const pattern = config.periodPatterns?.()[period] ?? `{year}-{${period}}`;\n      return pattern\n        .split(/(\\{(?:year|quarter|week)\\})/)\n        .filter(Boolean)\n        .map((part) => {\n          const field = /^\\{(year|quarter|week)\\}$/.exec(part)?.[1];\n          return field\n            ? { type: field as DateSegment['type'], literal: '' }\n            : { type: 'literal' as const, literal: part };\n        });\n    }\n    const options: Intl.DateTimeFormatOptions = {\n      hourCycle: hour12.value ? 'h12' : 'h23',\n      timeZone: 'UTC',\n    };\n    // 到这里的只有 Intl 认识的段（季度、周在上面已经返回了）\n    for (const field of config.fields() as readonly Exclude<ValueField, 'quarter' | 'week'>[]) {\n      options[field] = field === 'year' ? 'numeric' : '2-digit';\n    }\n    const parts = new Intl.DateTimeFormat(config.locale(), options).formatToParts(SAMPLE);\n    const wanted = new Set(fields.value);\n    return (\n      parts\n        .filter((part) => part.type === 'literal' || wanted.has(part.type as DateSegmentType))\n        .map((part) => ({ type: part.type as DateSegment['type'], literal: part.value }))\n        // 首尾只有空白的分隔符没有意义；“2026年10月”结尾的“月”要留着\n        .filter(\n          (part, index, all) =>\n            part.type !== 'literal' ||\n            part.literal.trim() !== '' ||\n            (index > 0 && index < all.length - 1),\n        )\n    );\n  });\n\n  const labels = computed(() => {\n    const names = new Intl.DisplayNames(config.locale(), { type: 'dateTimeField' });\n    return Object.fromEntries(\n      // Intl 的字段名里周叫 weekOfYear\n      fields.value.map((field) => [\n        field,\n        names.of(field === 'week' ? 'weekOfYear' : field) ?? field,\n      ]),\n    ) as Record<DateSegmentType, string>;\n  });\n\n  const digits = computed(() => {\n    const locale = config.locale();\n    const format = (width: number) =>\n      new Intl.NumberFormat(locale, { useGrouping: false, minimumIntegerDigits: width });\n    return { 1: format(1), 2: format(2), 4: format(4) } as Record<1 | 2 | 4, Intl.NumberFormat>;\n  });\n\n  const periods = computed(() => {\n    const formatter = new Intl.DateTimeFormat(config.locale(), {\n      hour: 'numeric',\n      hourCycle: 'h12',\n      timeZone: 'UTC',\n    });\n    const period = (hour: number) =>\n      formatter.formatToParts(Date.UTC(2000, 0, 1, hour)).find((part) => part.type === 'dayPeriod')\n        ?.value ?? (hour < 12 ? 'AM' : 'PM');\n    return [period(0), period(12)] as const;\n  });\n\n  function range(type: DateSegmentType): [number, number] {\n    switch (type) {\n      case 'year':\n        return [1, 9999];\n      case 'month':\n        return [1, 12];\n      case 'day':\n        return [1, daysInMonth(draft.value.year, draft.value.month)];\n      case 'quarter':\n        return [1, 4];\n      case 'week':\n        return [1, draft.value.year == null ? 53 : isoWeeksInYear(draft.value.year)];\n      case 'hour':\n        return hour12.value ? [1, 12] : [0, 23];\n      case 'minute':\n      case 'second':\n        return [0, 59];\n      case 'dayPeriod':\n        return [0, 1];\n    }\n  }\n\n  /** 段上显示的值：12 小时制的时显示 1–12，上午 / 下午是 0 / 1 */\n  function shown(type: DateSegmentType): number | null {\n    const hour = draft.value.hour;\n    if (type === 'dayPeriod') return hour == null ? null : hour >= 12 ? 1 : 0;\n    if (type === 'hour' && hour12.value && hour != null) return hour % 12 || 12;\n    return draft.value[type] ?? null;\n  }\n\n  function text(type: DateSegmentType, value: number | null): string {\n    if (type === 'dayPeriod') return value == null ? '' : periods.value[value as 0 | 1];\n    if (buffer.value && focusedSegment.value === type)\n      return digits.value[1].format(Number(buffer.value));\n    if (value == null) return '';\n    const width =\n      type === 'year' ? 4 : type === 'quarter' || (type === 'hour' && hour12.value) ? 1 : 2;\n    return digits.value[width].format(value);\n  }\n\n  /**\n   * 空段的占位：语言包里的单位字（年、月、日）；后面紧跟的文字已经是这个单位时（中文的“2026年”）改用横线，\n   * 显示成“––年”，否则会是“年年”\n   */\n  function placeholderOf(type: DateSegmentType, next: string | undefined): string {\n    const unit = config.placeholders()[type];\n    return !unit || next?.trimStart().startsWith(unit) ? '––' : unit;\n  }\n\n  const segments = computed((): DateSegment[] =>\n    layout.value.map(({ type, literal }, index) => {\n      if (type === 'literal')\n        return { type, text: literal, placeholder: false, value: null, min: 0, max: 0, label: '' };\n      const value = shown(type);\n      const [min, max] = range(type);\n      const filled = text(type, value);\n      const following = layout.value[index + 1];\n      return {\n        type,\n        text: filled || placeholderOf(type, following?.literal),\n        placeholder: !filled,\n        value,\n        min,\n        max,\n        label: labels.value[type],\n      };\n    }),\n  );\n  const editable = computed(() => segments.value.filter((segment) => segment.type !== 'literal'));\n\n  /** 写一段的值（显示值：12 小时制的时是 1–12）；写完检查是否填全，emit 为 false 时只改草稿 */\n  function write(type: DateSegmentType, value: number | null, emit = true) {\n    const next = { ...draft.value };\n    if (type === 'dayPeriod') {\n      if (next.hour == null || value == null) return;\n      next.hour = (next.hour % 12) + value * 12;\n    } else if (type === 'hour' && hour12.value && value != null) {\n      const afternoon = (draft.value.hour ?? config.placeholderValue().hour ?? 0) >= 12;\n      next.hour = (value % 12) + (afternoon ? 12 : 0);\n    } else if (value == null) delete next[type];\n    else next[type] = value;\n    const wasComplete = complete.value;\n    draft.value = next;\n    pendingYear = !emit;\n    if (!emit) return;\n    if (complete.value) config.onChange(constrained(next));\n    else if (wasComplete) config.onChange(null);\n  }\n\n  function commit() {\n    if (!pendingYear) return;\n    pendingYear = false;\n    if (complete.value) config.onChange(constrained(draft.value));\n  }\n\n  // 日超过了这个月的天数（先填了 31 再把月改成 2 月）：写回时取这个月的最后一天；周同理（这一年只有 52 周时）\n  function constrained(values: DateFieldValues): DateFieldValues {\n    if (values.week != null && values.year != null)\n      return { ...values, week: Math.min(values.week, isoWeeksInYear(values.year)) };\n    if (values.day == null) return values;\n    return { ...values, day: Math.min(values.day, daysInMonth(values.year, values.month)) };\n  }\n\n  const current = () => focusedSegment.value;\n\n  const state: DateSegmentsState = {\n    get segments() {\n      return segments.value;\n    },\n    get editable() {\n      return editable.value;\n    },\n    get focusedSegment() {\n      return focusedSegment.value;\n    },\n    get partial() {\n      return !complete.value && config.fields().some((field) => draft.value[field] != null);\n    },\n    setFocused(type) {\n      if (type !== focusedSegment.value) {\n        commit();\n        buffer.value = '';\n      }\n      focusedSegment.value = type;\n    },\n    type(input) {\n      if (!current() || config.readonly?.()) return;\n      for (const char of normalizeDigits(input)) {\n        const segment = current();\n        if (!segment) return;\n        if (segment === 'dayPeriod') {\n          const lower = char.toLocaleLowerCase();\n          const [am, pm] = periods.value.map((label) => label.toLocaleLowerCase());\n          if (lower === 'a' || am!.startsWith(lower)) write('dayPeriod', 0);\n          else if (lower === 'p' || pm!.startsWith(lower)) write('dayPeriod', 1);\n          else continue;\n          state.moveFocus(1);\n          continue;\n        }\n        if (!/\\d/.test(char)) continue;\n        const [min, max] = range(segment);\n        let next = buffer.value + char;\n        // 打了这一位就超出范围：从这一位重新开始\n        if (Number(next) > max) next = char;\n        buffer.value = next;\n        const number = Number(next);\n        // 0 还不是合法值（月、日、12 小时制的时）：先记着，等下一位；年份打满四位才写回\n        if (number >= min) write(segment, number, segment !== 'year' || next.length >= 4);\n        const maxDigits = String(max).length;\n        if (next.length >= maxDigits || number * 10 > max) {\n          buffer.value = '';\n          if (number < min) write(segment, min);\n          state.moveFocus(1);\n        }\n      }\n    },\n    increment(amount) {\n      const type = current();\n      if (!type || config.readonly?.()) return;\n      buffer.value = '';\n      const [min, max] = range(type);\n      const value = shown(type);\n      if (value == null) {\n        const start = config.placeholderValue();\n        if (type === 'dayPeriod') {\n          if (draft.value.hour == null)\n            write('hour', hour12.value ? (start.hour ?? 0) % 12 || 12 : (start.hour ?? 0));\n          write('dayPeriod', (start.hour ?? 0) >= 12 ? 1 : 0);\n          return;\n        }\n        const initial =\n          type === 'hour' && hour12.value ? (start.hour ?? 0) % 12 || 12 : (start[type] ?? min);\n        write(type, initial);\n        return;\n      }\n      const size = max - min + 1;\n      write(type, ((((value - min + amount) % size) + size) % size) + min);\n    },\n    toEdge(edge) {\n      const type = current();\n      if (!type || config.readonly?.()) return;\n      buffer.value = '';\n      const [min, max] = range(type);\n      write(type, edge === 'min' ? min : max);\n    },\n    backspace() {\n      const type = current();\n      if (!type || config.readonly?.()) return;\n      const value = shown(type);\n      if (value == null && !buffer.value) {\n        state.moveFocus(-1);\n        return;\n      }\n      const digitsLeft = type === 'dayPeriod' ? '' : (buffer.value || String(value)).slice(0, -1);\n      buffer.value = digitsLeft;\n      const [min] = range(type);\n      if (type === 'dayPeriod' || !digitsLeft) {\n        if (type === 'dayPeriod' || type === 'hour') {\n          // 删掉上午 / 下午或时：时没有了，两段一起清空\n          const next = { ...draft.value };\n          delete next.hour;\n          const wasComplete = complete.value;\n          draft.value = next;\n          if (wasComplete) config.onChange(null);\n          return;\n        }\n        write(type, null);\n        return;\n      }\n      if (Number(digitsLeft) >= min) write(type, Number(digitsLeft));\n    },\n    clear() {\n      buffer.value = '';\n      pendingYear = false;\n      const wasComplete = complete.value;\n      draft.value = {};\n      if (wasComplete) config.onChange(null);\n    },\n    reset() {\n      buffer.value = '';\n      pendingYear = false;\n      draft.value = { ...config.value() };\n    },\n    commit,\n    moveFocus(direction) {\n      const list = editable.value;\n      const index = list.findIndex((segment) => segment.type === current());\n      const next = list[index + direction];\n      if (next) state.setFocused(next.type as DateSegmentType);\n      else config.onExit?.(direction);\n    },\n  };\n  return state;\n}\n\n/**\n * 分段输入的键盘操作：↑↓ 加减、Page Up / Down 大步、Home / End 最小 / 最大、Backspace / Delete 删除、\n * ←→ 换段（从右到左排版时反过来）。数字与字母走 beforeinput（软键盘、输入法也能输入），这里不处理。\n * 返回是否处理了这个按键（处理了就该 preventDefault）\n */\nexport function handleSegmentKeydown(\n  state: DateSegmentsState,\n  event: KeyboardEvent,\n  rtl = false,\n): boolean {\n  if (event.altKey || event.ctrlKey || event.metaKey) return false;\n  const type = state.focusedSegment;\n  if (!type) return false;\n  const forward = rtl ? -1 : 1;\n  const actions: Record<string, () => void> = {\n    ArrowUp: () => state.increment(1),\n    ArrowDown: () => state.increment(-1),\n    PageUp: () => state.increment(BIG_STEPS[type]),\n    PageDown: () => state.increment(-BIG_STEPS[type]),\n    Home: () => state.toEdge('min'),\n    End: () => state.toEdge('max'),\n    Backspace: () => state.backspace(),\n    Delete: () => state.backspace(),\n    ArrowRight: () => state.moveFocus(forward as 1 | -1),\n    ArrowLeft: () => state.moveFocus(-forward as 1 | -1),\n  };\n  const action = actions[event.key];\n  if (!action) return false;\n  action();\n  return true;\n}\n\n// ───────── 内部实现 ─────────\n\n/** 取段的顺序用的任意时刻（各段都是两位数，排版不受值影响） */\nconst SAMPLE = Date.UTC(2000, 10, 22, 13, 44, 55);\n\n/** 语言默认的小时制 */\nfunction resolvedHourCycle(locale: string): keyof HourCycles {\n  const cycle = new Intl.DateTimeFormat(locale, { hour: 'numeric' }).resolvedOptions().hourCycle;\n  return cycle === 'h11' || cycle === 'h12' ? 'h12' : 'h23';\n}\n\nfunction sameFields(a: DateFieldValues | null, b: DateFieldValues | null): boolean {\n  if (a == null || b == null) return a === b;\n  const keys = new Set([...Object.keys(a), ...Object.keys(b)]) as Set<keyof DateFieldValues>;\n  return [...keys].every((key) => a[key] === b[key]);\n}\n\n// ───────── 值与 ISO 字符串 ─────────\n\n/** 日期类分段的粒度：DateField 精确到哪一段（到时、分、秒时是日期加时间） */\nexport interface DateFieldGranularities {\n  /** 只有年：'2026' */\n  year: unknown;\n  /** 年月：'2026-10'（同原生 input type=\"month\"） */\n  month: unknown;\n  /** 年月日（默认）：'2026-10-20' */\n  day: unknown;\n  /** 年与季度：'2026-Q4' */\n  quarter: unknown;\n  /** 年与周（ISO 8601，周一开始）：'2026-W43'（同原生 input type=\"week\"） */\n  week: unknown;\n  /** 日期加时：'2026-10-20T14:00' */\n  hour: unknown;\n  /** 日期加时分：'2026-10-20T14:30'（同原生 input type=\"datetime-local\"） */\n  minute: unknown;\n  /** 日期加时分秒：'2026-10-20T14:30:15' */\n  second: unknown;\n}\n\n/** 分段输入精确到哪一段 */\nexport type DateFieldGranularity = keyof DateFieldGranularities;\n\ntype ValueField = Exclude<DateSegmentType, 'dayPeriod'>;\n\nconst ALL_FIELDS: readonly ValueField[] = ['year', 'month', 'day', 'hour', 'minute', 'second'];\n\n/** 日期分段：从年到 granularity；time 时只取时间的部分（TimeField） */\nexport function segmentFields(granularity: DateFieldGranularity, time = false): ValueField[] {\n  if (granularity === 'quarter' || granularity === 'week') return time ? [] : ['year', granularity];\n  const fields = ALL_FIELDS.slice(0, ALL_FIELDS.indexOf(granularity) + 1);\n  return time\n    ? fields.filter((field) => field === 'hour' || field === 'minute' || field === 'second')\n    : fields;\n}\n\nconst pad = (value: number, width = 2) => String(value).padStart(width, '0');\n\n/** 各段的值 → ISO 字符串（按有哪些段：'2026'、'2026-10'、'2026-10-20'、'2026-10-20T14:30'、'14:30'） */\nexport function fieldsToIso(values: DateFieldValues, fields: readonly ValueField[]): string {\n  if (fields.includes('quarter')) return `${pad(values.year ?? 0, 4)}-Q${values.quarter ?? 1}`;\n  if (fields.includes('week')) return `${pad(values.year ?? 0, 4)}-W${pad(values.week ?? 1)}`;\n  const date = [\n    values.year != null && pad(values.year, 4),\n    fields.includes('month') && pad(values.month ?? 1),\n    fields.includes('day') && pad(values.day ?? 1),\n  ]\n    .filter((part) => part !== false)\n    .join('-');\n  if (!fields.includes('hour')) return date;\n  const time = [\n    pad(values.hour ?? 0),\n    pad(values.minute ?? 0),\n    fields.includes('second') && pad(values.second ?? 0),\n  ]\n    .filter((part) => part !== false)\n    .join(':');\n  return fields.includes('year') ? `${date}T${time}` : time;\n}\n\n/** ISO 字符串 → 各段的值；格式不对时 null。只取 fields 里有的段（'2026-10-20T14:30' 给 DateField 时只要日期） */\nexport function isoToFields(\n  value: string | null | undefined,\n  fields: readonly ValueField[],\n): DateFieldValues | null {\n  if (!value) return null;\n  const period = /^(\\d{4})-(?:Q([1-4])|W(\\d{2}))$/.exec(value);\n  if (period) {\n    const parsed: DateFieldValues = { year: Number(period[1]) };\n    if (period[2] != null) parsed.quarter = Number(period[2]);\n    if (period[3] != null) parsed.week = Number(period[3]);\n    return fields.every((field) => parsed[field] != null) ? parsed : null;\n  }\n  const match = /^(?:(\\d{4})(?:-(\\d{2})(?:-(\\d{2}))?)?)?(?:T?(\\d{2}):(\\d{2})(?::(\\d{2}))?)?$/.exec(\n    value,\n  );\n  if (!match) return null;\n  const parsed: DateFieldValues = {};\n  ALL_FIELDS.forEach((field, index) => {\n    const text = match[index + 1];\n    if (fields.includes(field) && text != null) parsed[field] = Number(text);\n  });\n  return fields.every((field) => parsed[field] != null) ? parsed : null;\n}\n"],"mappings":"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"}

package/dist/date/picker-popover.d.ts

@@ -0,0 +1,88 @@
+/**
+ * 日期、时间选择器共用的打开按钮与弹层（DatePicker、DateRangePicker、TimePicker），以及日历旁边的快捷选项：
+ * 输入框外壳是定位的锚点，后缀里的按钮打开，弹层是 role="dialog" 的原生 popover（Esc、点外部关闭）；
+ * 关闭时焦点还给按钮（外壳不可聚焦）；分段里按 Alt + ↓ 打开（同原生 select）。在组件 setup 里调用。
+ *
+ *   const picker = usePickerPopover(() => ({ open, editable, label: lang.datePickerOpen }), {
+ *     toggle: setOpen,
+ *     shown: (panel) => panel.querySelector('…')?.focus(),
+ *   });
+ *   <DateField propsRoot={{ ref: picker.anchorRef }} onKeydown={picker.onKeydown} suffix={picker.button(CalendarDays, propsButton)} />
+ *   {picker.panel(sx, propsPopover, open && <Calendar … />)}
+ */
+import { type VNodeChild } from 'vue';
+import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import type { IconData } from '../base/Icon';
+import { type IconButtonProps } from '../base/IconButton';
+import { type FloatingPlacement } from '../utils/dom/floating';
+import type { SetOpen } from '../utils/dom/open-change';
+import { type PartProps } from '../utils/props';
+import type { TextSize } from '../utils/style/typography';
+/** 选择器上的打开按钮与弹层的部件属性 */
+export interface PickerPopoverParts {
+    /** 弹出位置，默认 bottom-start；空间不够时自动翻转 */
+    placement?: FloatingPlacement;
+    /** 打开按钮的部件属性 */
+    propsButton?: Omit<Partial<IconButtonProps>, 'onClick' | 'aria-expanded' | 'aria-controls'>;
+    /** 弹层的部件属性 */
+    propsPopover?: PartProps<'div', 'id' | 'popover' | 'role'>;
+}
+/** usePickerPopover 每次渲染读取的状态 */
+export interface PickerPopoverState {
+    /** 是否打开 */
+    open: boolean;
+    /** 能不能打开：不可用、只读时按钮也不可用 */
+    editable: boolean;
+    /** 按钮与弹层的名称（“选择日期”） */
+    label: string;
+    /** 弹出位置 */
+    placement?: FloatingPlacement;
+    /** 弹层与输入框同宽（时间列表） */
+    matchWidth?: boolean;
+    /** 控件的字号档位：弹层渲染在顶层、不继承输入框的字号，按它设置 */
+    size?: TextSize;
+}
+/** usePickerPopover 的回调 */
+export interface PickerPopoverEvents {
+    /** 打开或关闭（按钮、Alt + ↓、Esc、点外部）：写回组件的 open 并通知 onOpenChange，一般是组件的 openSetter */
+    toggle: SetOpen;
+    /** 打开后、第一次定位完成时：把焦点交给弹层里合适的元素 */
+    shown: (panel: HTMLElement) => void;
+}
+/** 选择器的打开按钮与弹层 */
+export declare function usePickerPopover(read: () => PickerPopoverState, events: PickerPopoverEvents): {
+    /** 弹层的 id（按钮的 aria-controls）；弹层里的元素可以据此派生自己的 id */
+    id: string;
+    /** 输入框外壳（锚点）：放进 propsRoot 的 ref */
+    anchorRef: (element: unknown) => HTMLElement | null;
+    /** 输入框外壳：选完日期后把焦点交给其中的某一段 */
+    readonly anchor: HTMLElement | null;
+    /** 分段上的 keydown：Alt + ↓ 打开 */
+    onKeydown: (event: KeyboardEvent) => void;
+    /** 输入框后缀里的打开按钮 */
+    button(icon: IconData, user?: PickerPopoverParts['propsButton']): import("@zerodep-dev/vue-tsx-pro-tsx/jsx-runtime").JSX.Element;
+    /** 弹层：内容只在打开时渲染（由调用方按 open 给） */
+    panel(sx: css.SxStyles, user: PickerPopoverParts['propsPopover'], children: VNodeChild): import("@zerodep-dev/vue-tsx-pro-tsx/jsx-runtime").JSX.Element;
+};
+/** 弹层里是日历时：焦点进日历当前的那一格（已选或今天），不是“上个月”按钮 */
+export declare function focusCalendar(panel: HTMLElement): void;
+/** 弹层里的一个快捷选项（“今天”“最近 7 天”） */
+export interface PickerPreset {
+    /** 列表里的 key */
+    key: string;
+    /** 按钮上的文字 */
+    label: string;
+    /** 当前值就是它：按钮按下（aria-pressed） */
+    active: boolean;
+    /** 超出可选范围：不可用 */
+    disabled?: boolean;
+    /** 点了 */
+    onPick: () => void;
+}
+/** 快捷选项的样式：presets（一列，靠日历那边有分隔线）、preset（按钮文字靠左） */
+export declare const pickerPresetStyles: Readonly<{
+    preset: css.CompiledStyles;
+    presets: css.CompiledStyles;
+}>;
+/** 日历旁边的一列快捷选项（DatePicker、DateRangePicker 共用）：一组按钮，当前值对应的那一项按下 */
+export declare function renderPickerPresets(presets: readonly PickerPreset[], label: string, user?: PartProps<'div', 'role'>): VNodeChild;