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

package/dist/date/calendar-state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-state.js","names":[],"sources":["../../src/date/calendar-state.ts"],"sourcesContent":["/**\n * 日历的状态（WAI-ARIA 日期网格的数据层）：焦点日期、显示哪一页、单选 / 区间 / 多选、区间悬停预览、键盘操作。\n * 不碰 DOM：Calendar 渲染网格，焦点日期那一格 tabindex=0，键盘移动后把焦点移过去。\n * 参考 React Aria 的 useCalendarState / useRangeCalendarState。\n *\n * 三种视图：day（月份网格）、month（一年的各月）、year（一个十年）。unit 是选择的粒度：\n * Calendar 是 day，MonthPicker 是 month；在比 unit 粗的视图里点一格是“进到这一格”（年 → 月 → 日），不是选中。\n *\n *   const calendar = useCalendarState({ mode: () => 'single', selected: () => (date ? [date] : []), onChange, … });\n *   if (handleCalendarKeydown(calendar, event, isRtl(grid))) event.preventDefault();\n */\nimport {\n  endOfWeek,\n  startOfWeek,\n  type CalendarDate,\n  type DateDuration,\n} from '@internationalized/date';\nimport { computed, ref, shallowRef, watch } from 'vue';\nimport {\n  clampDate,\n  compareDates,\n  isDateDisabled,\n  isInRange,\n  isOutOfRange,\n  isOutsideDecade,\n  isSameDate,\n  orderedRange,\n  rangeHasUnavailable,\n  toDayOfWeek,\n  type DateLimits,\n  type DateRange,\n  type DateUnit,\n  type WeekOptions,\n} from '../utils/data/date';\n\n/** 日期的选择方式 */\nexport interface CalendarSelectionModes {\n  /** 单选一天 */\n  single: unknown;\n  /** 选一个区间：先点开始、再点结束，中间悬停时预览 */\n  range: unknown;\n  /** 多选：每天独立切换 */\n  multiple: unknown;\n}\n\n/** 日期的选择方式 */\nexport type CalendarSelectionMode = keyof CalendarSelectionModes;\n\n/** useCalendarState 的选项：都是读取函数，props 变化时跟着变 */\nexport interface CalendarStateOptions {\n  /** 选择方式 */\n  mode: () => CalendarSelectionMode;\n  /** 已选的日期：单选一个、区间是 [开始, 结束]、多选若干；没有时空数组 */\n  selected: () => readonly CalendarDate[];\n  /** 选了日期：单选 [日期]（再点已选的那天也会调用），区间 [开始, 结束]（已排好序），多选是新的列表 */\n  onChange: (dates: readonly CalendarDate[]) => void;\n  /** 今天（按语言的时区与日历）：没有已选日期时焦点从这里开始 */\n  today: () => CalendarDate;\n  /** 可选范围与不可选的日期 */\n  limits: () => DateLimits;\n  /** 一周的排法：Home / End、月份网格都按它 */\n  week: () => WeekOptions;\n  /** 选择的粒度，默认 day；MonthPicker 是 month，YearPicker 是 year */\n  unit?: () => DateUnit;\n  /** 并排显示几个月（只在 day 视图），默认 1 */\n  visibleMonths?: () => number;\n  /** 区间里允许夹着不可选的日期，默认 false：选了开始之后，越过不可选日期的那一侧都不能再选 */\n  allowsUnavailableInRange?: () => boolean;\n  /** 只读：能翻页、移动焦点，不能改选择 */\n  readonly?: () => boolean;\n  /** 没有已选日期时一开始显示哪天所在的页（如酒店预订默认显示下个月）；不写时是今天 */\n  defaultFocused?: () => CalendarDate | null | undefined;\n}\n\n/** 一格的状态：渲染与 data 属性用 */\nexport interface CalendarCellState {\n  /** 已选（区间里是两端与中间的每一天） */\n  selected: boolean;\n  /** 不能选：范围外、不可选、或区间选到一半时越过了不可选的日期 */\n  disabled: boolean;\n  /** 是不可选的日期（isUnavailable）：画删除线 */\n  unavailable: boolean;\n  /** 今天（这个月、今年） */\n  today: boolean;\n  /** 焦点所在的格：tabindex=0 */\n  focused: boolean;\n  /** 不在这一页：月份网格里补齐的上下月、年份视图里补上的两年 */\n  outside: boolean;\n  /** 区间的开始 */\n  rangeStart: boolean;\n  /** 区间的结束 */\n  rangeEnd: boolean;\n  /** 在区间里（含两端；选到一半时是预览的区间） */\n  inRange: boolean;\n}\n\n/** 日历的状态与操作 */\nexport interface CalendarState {\n  /** 选择方式 */\n  readonly mode: CalendarSelectionMode;\n  /** 当前视图 */\n  readonly view: DateUnit;\n  /** 选择的粒度 */\n  readonly unit: DateUnit;\n  /** 焦点日期：总是精确到天，切到 month、year 视图再回来时回到原来那天 */\n  readonly focused: CalendarDate;\n  /** 当前页的第一格：day 视图是第一个月的 1 日，month 视图是这年 1 月 1 日，year 视图是十年的第一年 */\n  readonly page: CalendarDate;\n  /** day 视图里并排的各月（每月 1 日）；其他视图只有 page */\n  readonly months: readonly CalendarDate[];\n  /** 区间：已选的，或选到一半时从开始到悬停 / 焦点日期的预览 */\n  readonly range: DateRange | null;\n  /** 区间选到一半：已经点了的开始 */\n  readonly anchor: CalendarDate | null;\n  /** 已选的日期有不能选的（范围外、不可选，或区间里夹着不可选的日期） */\n  readonly invalid: boolean;\n  /** 一周的排法 */\n  readonly week: WeekOptions;\n  /** 切换视图（不能比选择的粒度更细） */\n  setView(view: DateUnit): void;\n  /** 移动焦点日期（夹到可选范围内），移出当前页时翻页 */\n  focus(date: CalendarDate): void;\n  /** 翻页：day 视图一次翻并排的月数，month 视图一年，year 视图十年；焦点跟着走 */\n  turnPage(direction: 1 | -1): void;\n  /** 这个方向还能不能翻页（整页都在可选范围之外时不能） */\n  canTurnPage(direction: 1 | -1): boolean;\n  /** 点了一格：当前视图是选择的粒度时选中，否则进到这一格（年 → 月 → 日） */\n  activate(date: CalendarDate): void;\n  /** 指针悬停的日期：区间选到一半时预览；离开网格时传 null */\n  hover(date: CalendarDate | null): void;\n  /** 一格的状态；month 是这格所在的月份网格（判断是不是补齐的上下月） */\n  cell(date: CalendarDate, month?: CalendarDate): CalendarCellState;\n  /** 取消选到一半的区间（Esc） */\n  cancelRange(): void;\n}\n\n/** 视图从粗到细 */\nconst VIEWS: readonly DateUnit[] = ['year', 'month', 'day'];\n\n/** 日历状态（组件 setup 里调用） */\nexport function useCalendarState(config: CalendarStateOptions): CalendarState {\n  const unit = () => config.unit?.() ?? 'day';\n  const visibleMonths = () => Math.max(1, config.visibleMonths?.() ?? 1);\n\n  const view = ref<DateUnit>(unit());\n  const anchor = shallowRef<CalendarDate | null>(null);\n  const hovered = shallowRef<CalendarDate | null>(null);\n  const initial = config.selected()[0] ?? config.defaultFocused?.() ?? config.today();\n  const focused = shallowRef(clampDate(initial, config.limits()));\n  const page = shallowRef(pageOf(focused.value, view.value));\n\n  /** 日期所在页的第一格 */\n  function pageOf(date: CalendarDate, current: DateUnit): CalendarDate {\n    if (current === 'year')\n      return date.set({ year: Math.floor(date.year / 10) * 10, month: 1, day: 1 });\n    if (current === 'month') return date.set({ month: 1, day: 1 });\n    return date.set({ day: 1 });\n  }\n\n  /** 一页的跨度 */\n  function pageSize(current: DateUnit): DateDuration {\n    if (current === 'year') return { years: 10 };\n    if (current === 'month') return { years: 1 };\n    return { months: visibleMonths() };\n  }\n\n  const pageEnd = () => page.value.add(pageSize(view.value)).subtract({ days: 1 });\n\n  /** 焦点移出当前页时翻页：往前移出时焦点所在的月排在最后，往后移出时排在最前（同 React Aria） */\n  function followFocus() {\n    const date = focused.value;\n    if (date.compare(page.value) >= 0 && date.compare(pageEnd()) <= 0) return;\n    const backward = date.compare(page.value) < 0;\n    page.value =\n      backward && view.value === 'day'\n        ? date.set({ day: 1 }).subtract({ months: visibleMonths() - 1 })\n        : pageOf(date, view.value);\n  }\n\n  // 区间选到一半、不允许夹着不可选的日期时：开始两侧最近的不可选日期之内才能选\n  const limits = computed((): DateLimits => {\n    const base = config.limits();\n    const start = anchor.value;\n    if (!start || !base.isUnavailable || config.allowsUnavailableInRange?.()) return base;\n    const bound = (step: 1 | -1, edge: CalendarDate | null | undefined) => {\n      // 最多找一年：再远的不会出现在同一次选择里\n      let date = start;\n      for (let offset = 0; offset < 366; offset++) {\n        const next = date.add({ days: step });\n        if (edge && compareDates(next, edge) * step > 0) return edge;\n        if (base.isUnavailable!(next)) return date;\n        date = next;\n      }\n      return edge;\n    };\n    return { ...base, min: bound(-1, base.min), max: bound(1, base.max) };\n  });\n\n  const selectedRange = computed((): DateRange | null => {\n    const [start, end] = config.selected();\n    return config.mode() === 'range' && start && end ? orderedRange(start, end) : null;\n  });\n\n  const range = computed((): DateRange | null => {\n    if (config.mode() !== 'range') return null;\n    if (!anchor.value) return selectedRange.value;\n    return orderedRange(anchor.value, clampDate(hovered.value ?? focused.value, limits.value));\n  });\n\n  const invalid = computed(() => {\n    const base = config.limits();\n    if (config.selected().some((date) => isDateDisabled(date, base, unit()))) return true;\n    const picked = selectedRange.value;\n    return (\n      picked != null &&\n      !config.allowsUnavailableInRange?.() &&\n      rangeHasUnavailable(picked, base.isUnavailable)\n    );\n  });\n\n  function select(date: CalendarDate) {\n    if (config.readonly?.() || isDateDisabled(date, limits.value, unit())) return;\n    const current = config.selected();\n    const same = (item: CalendarDate) => isSameDate(item, date, unit());\n    switch (config.mode()) {\n      case 'single':\n        // 再点已选的那天也通知：日期选择器据此关闭弹层\n        config.onChange([date]);\n        return;\n      case 'multiple':\n        config.onChange(\n          current.some(same) ? current.filter((item) => !same(item)) : [...current, date],\n        );\n        return;\n      case 'range': {\n        if (!anchor.value) {\n          anchor.value = date;\n          return;\n        }\n        const picked = orderedRange(anchor.value, date);\n        anchor.value = null;\n        hovered.value = null;\n        config.onChange([picked.start, picked.end]);\n      }\n    }\n  }\n\n  const state: CalendarState = {\n    get mode() {\n      return config.mode();\n    },\n    get view() {\n      return view.value;\n    },\n    get unit() {\n      return unit();\n    },\n    get focused() {\n      return focused.value;\n    },\n    get page() {\n      return page.value;\n    },\n    get months() {\n      if (view.value !== 'day') return [page.value];\n      return Array.from({ length: visibleMonths() }, (_, index) =>\n        page.value.add({ months: index }),\n      );\n    },\n    get range() {\n      return range.value;\n    },\n    get anchor() {\n      return anchor.value;\n    },\n    get invalid() {\n      return invalid.value;\n    },\n    get week() {\n      return config.week();\n    },\n    setView(next) {\n      if (VIEWS.indexOf(next) > VIEWS.indexOf(unit())) return;\n      view.value = next;\n      page.value = pageOf(focused.value, next);\n    },\n    focus(date) {\n      focused.value = isOutOfRange(date, limits.value, view.value)\n        ? clampDate(date, limits.value)\n        : date;\n      followFocus();\n    },\n    turnPage(direction) {\n      if (!state.canTurnPage(direction)) return;\n      const size = pageSize(view.value);\n      const move = (date: CalendarDate) => (direction > 0 ? date.add(size) : date.subtract(size));\n      page.value = move(page.value);\n      focused.value = clampDate(move(focused.value), limits.value);\n      // 夹回范围后可能不在翻到的这页了：焦点落到这页里可选的第一天\n      if (focused.value.compare(page.value) < 0 || focused.value.compare(pageEnd()) > 0) {\n        focused.value = clampDate(page.value, limits.value);\n      }\n    },\n    canTurnPage(direction) {\n      const { min, max } = config.limits();\n      if (direction < 0) return min == null || page.value.subtract({ days: 1 }).compare(min) >= 0;\n      return max == null || page.value.add(pageSize(view.value)).compare(max) <= 0;\n    },\n    activate(date) {\n      if (view.value === unit()) {\n        state.focus(date);\n        select(date);\n        return;\n      }\n      // 进到下一级视图：焦点保留原来的月、日（这个月没有那天时取最后一天）\n      const finer = VIEWS[VIEWS.indexOf(view.value) + 1]!;\n      const next =\n        view.value === 'year'\n          ? focused.value.set({ year: date.year })\n          : focused.value.set({ year: date.year, month: date.month });\n      view.value = finer;\n      focused.value = clampDate(next, limits.value);\n      page.value = pageOf(focused.value, finer);\n    },\n    hover(date) {\n      hovered.value = date;\n    },\n    cancelRange() {\n      anchor.value = null;\n      hovered.value = null;\n    },\n    cell(date, month) {\n      const current = view.value;\n      const preview = range.value;\n      const inRange = isInRange(date, preview, current);\n      return {\n        selected:\n          config.mode() === 'range'\n            ? inRange\n            : config.selected().some((item) => isSameDate(item, date, current)),\n        disabled: isDateDisabled(date, limits.value, current),\n        unavailable: current === 'day' && (config.limits().isUnavailable?.(date) ?? false),\n        today: isSameDate(date, config.today(), current),\n        focused: isSameDate(date, focused.value, current),\n        outside:\n          current === 'day'\n            ? month != null && !isSameDate(date, month, 'month')\n            : current === 'year' && isOutsideDecade(date, page.value),\n        rangeStart: preview != null && isSameDate(date, preview.start, current),\n        rangeEnd: preview != null && isSameDate(date, preview.end, current),\n        inRange,\n      };\n    },\n  };\n  // 父级从外面改了值（快捷按钮、重置）且不在这一页：翻到它那里\n  watch(\n    () => config.selected()[0],\n    (date) => {\n      if (date && (date.compare(page.value) < 0 || date.compare(pageEnd()) > 0)) state.focus(date);\n    },\n  );\n  return state;\n}\n\n/**\n * 日期网格的键盘操作（WAI-ARIA Date Picker Dialog 的网格部分）：\n * day 视图里 ←→ 一天（从右到左排版时反过来）、↑↓ 一周，Page Up / Down 一个月、加 Shift 一年，Home / End 到这周的第一天 / 最后一天；\n * month、year 视图里 ←→ 一格、↑↓ 一行（3 格），Page Up / Down 翻一页，Home / End 到这页的两端；\n * Enter / 空格选中（或进到下一级视图）；Esc 取消选到一半的区间（没有时不处理，交给弹层关闭）。\n * 返回是否处理了这个按键（处理了就该 preventDefault）\n */\nexport function handleCalendarKeydown(\n  state: CalendarState,\n  event: KeyboardEvent,\n  rtl = false,\n): boolean {\n  if (event.altKey || event.ctrlKey || event.metaKey) return false;\n  const date = state.focused;\n  const forward = rtl ? -1 : 1;\n  const { locale, firstDayOfWeek } = state.week;\n  const first = toDayOfWeek(firstDayOfWeek);\n  const actions: Record<string, (() => void) | undefined> =\n    state.view === 'day'\n      ? {\n          ArrowRight: () => state.focus(date.add({ days: forward })),\n          ArrowLeft: () => state.focus(date.subtract({ days: forward })),\n          ArrowDown: () => state.focus(date.add({ weeks: 1 })),\n          ArrowUp: () => state.focus(date.subtract({ weeks: 1 })),\n          PageDown: () => state.focus(date.add(event.shiftKey ? { years: 1 } : { months: 1 })),\n          PageUp: () => state.focus(date.subtract(event.shiftKey ? { years: 1 } : { months: 1 })),\n          Home: () => state.focus(startOfWeek(date, locale, first)),\n          End: () => state.focus(endOfWeek(date, locale, first)),\n        }\n      : gridActions(state, forward);\n  actions.Enter = () => state.activate(date);\n  actions[' '] = actions.Enter;\n  if (state.anchor) actions.Escape = () => state.cancelRange();\n  const action = actions[event.key];\n  if (!action) return false;\n  action();\n  return true;\n}\n\n/** month、year 视图：3 列的网格，一格是一个月或一年 */\nfunction gridActions(state: CalendarState, forward: number): Record<string, () => void> {\n  const date = state.focused;\n  const cell: keyof DateDuration = state.view === 'month' ? 'months' : 'years';\n  const pageSize: DateDuration = state.view === 'month' ? { years: 1 } : { years: 10 };\n  const by = (amount: number) => () => state.focus(date.add({ [cell]: amount }));\n  // year 视图的一页是十年（前后补上的两年属于别的页）；month 视图是这一年\n  const last =\n    state.view === 'month'\n      ? state.page.set({ month: state.page.calendar.getMonthsInYear(state.page) })\n      : state.page.add({ years: 9 });\n  return {\n    ArrowRight: by(forward),\n    ArrowLeft: by(-forward),\n    ArrowDown: by(3),\n    ArrowUp: by(-3),\n    PageDown: () => state.focus(date.add(pageSize)),\n    PageUp: () => state.focus(date.subtract(pageSize)),\n    Home: () =>\n      state.focus(\n        state.view === 'month' ? date.set({ month: 1 }) : date.set({ year: state.page.year }),\n      ),\n    End: () =>\n      state.focus(\n        state.view === 'month' ? date.set({ month: last.month }) : date.set({ year: last.year }),\n      ),\n  };\n}\n"],"mappings":"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"}

package/dist/date/clock.d.ts

@@ -0,0 +1,11 @@
+/**
+ * 随时间更新的“现在”（RelativeTime、Countdown 共用）：每隔 interval 毫秒更新一次，对齐到整秒、整分，
+ * 同一页上的几个计时器一起跳；页面隐藏时停下，回来时立刻更新（后台标签页里的定时器本来就不准，还白白耗电）。
+ *
+ *   const now = useNow((current) => (current >= end ? null : 1000));   // 渲染里读 now.value；null 时不再更新
+ *
+ * interval 拿到当前的 now，每次更新后重新计算：相对时间从“秒”变成“分钟”时，更新的频率跟着降下来。
+ */
+import { type Ref } from 'vue';
+/** 现在的时间戳（毫秒），按 interval 更新；interval 为 null 时停在最后一次的值（在 setup 里调用） */
+export declare function useNow(interval: (now: number) => number | null): Readonly<Ref<number>>;

package/dist/date/clock.js

@@ -0,0 +1,37 @@
+import { usePageVisible } from "../utils/dom/page-visibility.js";
+import { onScopeDispose, shallowRef, watch } from "vue";
+//#region src/date/clock.ts
+/**
+* 随时间更新的“现在”（RelativeTime、Countdown 共用）：每隔 interval 毫秒更新一次，对齐到整秒、整分，
+* 同一页上的几个计时器一起跳；页面隐藏时停下，回来时立刻更新（后台标签页里的定时器本来就不准，还白白耗电）。
+*
+*   const now = useNow((current) => (current >= end ? null : 1000));   // 渲染里读 now.value；null 时不再更新
+*
+* interval 拿到当前的 now，每次更新后重新计算：相对时间从“秒”变成“分钟”时，更新的频率跟着降下来。
+*/
+/** 现在的时间戳（毫秒），按 interval 更新；interval 为 null 时停在最后一次的值（在 setup 里调用） */
+function useNow(interval) {
+	const now = shallowRef(Date.now());
+	const visible = usePageVisible();
+	let timer;
+	function schedule() {
+		clearTimeout(timer);
+		const every = interval(now.value);
+		if (every == null || !visible.value) return;
+		timer = setTimeout(() => {
+			now.value = Date.now();
+			schedule();
+		}, every - Date.now() % every);
+	}
+	watch(() => interval(now.value), schedule, { immediate: true });
+	watch(visible, (shown) => {
+		if (shown) now.value = Date.now();
+		schedule();
+	});
+	onScopeDispose(() => clearTimeout(timer));
+	return now;
+}
+//#endregion
+export { useNow };
+
+//# sourceMappingURL=clock.js.map

package/dist/date/clock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clock.js","names":[],"sources":["../../src/date/clock.ts"],"sourcesContent":["/**\n * 随时间更新的“现在”（RelativeTime、Countdown 共用）：每隔 interval 毫秒更新一次，对齐到整秒、整分，\n * 同一页上的几个计时器一起跳；页面隐藏时停下，回来时立刻更新（后台标签页里的定时器本来就不准，还白白耗电）。\n *\n *   const now = useNow((current) => (current >= end ? null : 1000));   // 渲染里读 now.value；null 时不再更新\n *\n * interval 拿到当前的 now，每次更新后重新计算：相对时间从“秒”变成“分钟”时，更新的频率跟着降下来。\n */\nimport { onScopeDispose, shallowRef, watch, type Ref } from 'vue';\nimport { usePageVisible } from '../utils/dom/page-visibility';\n\n/** 现在的时间戳（毫秒），按 interval 更新；interval 为 null 时停在最后一次的值（在 setup 里调用） */\nexport function useNow(interval: (now: number) => number | null): Readonly<Ref<number>> {\n  const now = shallowRef(Date.now());\n  const visible = usePageVisible();\n  let timer: ReturnType<typeof setTimeout> | undefined;\n\n  function schedule() {\n    clearTimeout(timer);\n    const every = interval(now.value);\n    if (every == null || !visible.value) return;\n    // 对齐到 interval 的整数倍：多个计时器同一刻跳，倒计时的秒数不会一会儿快一会儿慢\n    timer = setTimeout(\n      () => {\n        now.value = Date.now();\n        schedule();\n      },\n      every - (Date.now() % every),\n    );\n  }\n\n  watch(() => interval(now.value), schedule, { immediate: true });\n  watch(visible, (shown) => {\n    if (shown) now.value = Date.now();\n    schedule();\n  });\n  onScopeDispose(() => clearTimeout(timer));\n  return now;\n}\n"],"mappings":";;;;;;;;;;;;AAYA,SAAgB,OAAO,UAAiE;CACtF,MAAM,MAAM,WAAW,KAAK,IAAI,CAAC;CACjC,MAAM,UAAU,eAAe;CAC/B,IAAI;CAEJ,SAAS,WAAW;EAClB,aAAa,KAAK;EAClB,MAAM,QAAQ,SAAS,IAAI,KAAK;EAChC,IAAI,SAAS,QAAQ,CAAC,QAAQ,OAAO;EAErC,QAAQ,iBACA;GACJ,IAAI,QAAQ,KAAK,IAAI;GACrB,SAAS;EACX,GACA,QAAS,KAAK,IAAI,IAAI,KACxB;CACF;CAEA,YAAY,SAAS,IAAI,KAAK,GAAG,UAAU,EAAE,WAAW,KAAK,CAAC;CAC9D,MAAM,UAAU,UAAU;EACxB,IAAI,OAAO,IAAI,QAAQ,KAAK,IAAI;EAChC,SAAS;CACX,CAAC;CACD,qBAAqB,aAAa,KAAK,CAAC;CACxC,OAAO;AACT"}

package/dist/date/date-locale.d.ts

@@ -0,0 +1,67 @@
+/**
+ * 日期组件读当前语言的地区设置：语言标签、日历系统、时区、一周的排法、今天，以及 ISO 字符串与显示用日期的互转。
+ * Calendar、DateField、各种日期选择器共用，组件里不再各自拼这些。在 setup 里调用，返回的对象在渲染时读取即可随语言切换。
+ *
+ *   const locale = useDateLocale(() => ({ firstDayOfWeek }));
+ *   locale.fromValue(value) // '2026-10-20' 或 CalendarDate → 当前日历系统里的 CalendarDate
+ *   locale.dayNumber(date)  // '20'（zh-CN 的 Intl 会写成“20日”，这里只取数字）
+ */
+import { CalendarDate, type Calendar, type DateValue } from '@internationalized/date';
+import { type DateLimits, type WeekOptions } from '../utils/data/date';
+/**
+ * 日期组件接受的值：ISO 字符串（'2026-10-20'），或 @internationalized/date 的 DateValue
+ * （CalendarDate、CalendarDateTime、ZonedDateTime）。写回时保持传入的类型（见 writeDateLike）
+ */
+export type DateInput = string | DateValue;
+/** 值为空、推不出类型时写回哪一种 */
+export interface DateValueTypes {
+    /** ISO 字符串（默认）：与原生 input、URL 参数、zod 的 z.iso.date() 一致 */
+    iso: unknown;
+    /** @internationalized/date 的对象：日期是 CalendarDate，带时间时是 CalendarDateTime */
+    dateValue: unknown;
+}
+/** 组件上可以覆盖语言配置的地区选项 */
+export interface DateLocaleOverrides {
+    /** 一周的第一天，0 表示周日；不写时取语言配置，再按地区惯例 */
+    firstDayOfWeek?: number;
+}
+/** useDateLocale 的返回值 */
+export interface DateLocale {
+    /** BCP 47 语言标签 */
+    readonly locale: string;
+    /** 运算用的日历系统（语言配置的 calendar，不支持的退回公历） */
+    readonly calendar: Calendar;
+    /** 时区：语言配置的，没有时取浏览器的 */
+    readonly timeZone: string;
+    /** 一周的排法 */
+    readonly week: WeekOptions;
+    /** 今天，按时区与日历系统 */
+    today(): CalendarDate;
+    /** 值（ISO 字符串或 DateValue）→ 显示用的日期（当前日历系统）；空值、格式不对时 null */
+    fromValue(value: DateInput | null | undefined): CalendarDate | null;
+    /** 显示用的日期 → ISO 日期（公历） */
+    toIso(date: CalendarDate): string;
+    /** 日期格里的数字（按日历系统与语言的数字写法） */
+    dayNumber(date: CalendarDate): string;
+}
+/** 当前语言的日期地区设置（组件 setup 里调用） */
+export declare function useDateLocale(read?: () => DateLocaleOverrides): DateLocale;
+/** 组件上写的可选范围与不可选的日期 */
+export interface DateLimitProps {
+    /** 最早可选的日期（ISO 字符串如 '2026-01-01'，或 DateValue） */
+    min?: DateInput;
+    /** 最晚可选的日期（ISO 字符串或 DateValue） */
+    max?: DateInput;
+    /**
+     * 不可选的日期（已订满、节假日）：仍能用方向键经过，读屏念“不可用”，不能选。
+     * 第二个参数是同一天的 CalendarDate，判断星期几等不用自己解析：`(_, day) => isWeekend(day, 'zh-CN')`
+     */
+    isDateUnavailable?: (date: string, day: CalendarDate) => boolean;
+}
+/** 组件的 min、max、isDateUnavailable → 日历状态用的 DateLimits（日期换成当前日历系统） */
+export declare function toDateLimits(locale: DateLocale, { min, max, isDateUnavailable }: DateLimitProps): DateLimits;
+/**
+ * 选到的日期写回成和 like 同一种类型：like 是字符串时写 ISO 日期；是 DateValue 时保留它的类型、日历系统、时间与时区，
+ * 只换年月日（CalendarDateTime 选了另一天，时间不变）。like 为空时按 valueType（默认 ISO 字符串）
+ */
+export declare function writeDateLike(date: CalendarDate, like: DateInput | null | undefined, valueType?: keyof DateValueTypes): DateInput;

package/dist/date/date-locale.js

@@ -0,0 +1,89 @@
+import { useLang } from "../config/context.js";
+import { calendarOf, parseIsoDate, toIsoDate } from "../utils/data/date.js";
+import { DateFormatter, GregorianCalendar, getLocalTimeZone, toCalendar, toCalendarDate, today } from "@internationalized/date";
+//#region src/date/date-locale.ts
+/**
+* 日期组件读当前语言的地区设置：语言标签、日历系统、时区、一周的排法、今天，以及 ISO 字符串与显示用日期的互转。
+* Calendar、DateField、各种日期选择器共用，组件里不再各自拼这些。在 setup 里调用，返回的对象在渲染时读取即可随语言切换。
+*
+*   const locale = useDateLocale(() => ({ firstDayOfWeek }));
+*   locale.fromValue(value) // '2026-10-20' 或 CalendarDate → 当前日历系统里的 CalendarDate
+*   locale.dayNumber(date)  // '20'（zh-CN 的 Intl 会写成“20日”，这里只取数字）
+*/
+/** 当前语言的日期地区设置（组件 setup 里调用） */
+function useDateLocale(read = () => ({})) {
+	const lang = useLang();
+	const calendar = () => calendarOf(lang.calendar);
+	return {
+		get locale() {
+			return lang.code;
+		},
+		get calendar() {
+			return calendar();
+		},
+		get timeZone() {
+			return lang.timeZone ?? getLocalTimeZone();
+		},
+		get week() {
+			return {
+				locale: lang.code,
+				firstDayOfWeek: read().firstDayOfWeek ?? lang.firstDayOfWeek
+			};
+		},
+		today() {
+			return toCalendar(today(lang.timeZone ?? getLocalTimeZone()), calendar());
+		},
+		fromValue(value) {
+			if (value == null) return null;
+			const date = typeof value === "string" ? parseIsoDate(value.slice(0, 10)) : toCalendarDate(value);
+			return date && toCalendar(date, calendar());
+		},
+		toIso: toIsoDate,
+		dayNumber(date) {
+			return dayFormatter(lang.code, date.calendar.identifier).formatToParts(date.toDate("UTC")).find((part) => part.type === "day")?.value ?? String(date.day);
+		}
+	};
+}
+var dayFormatters = /* @__PURE__ */ new Map();
+function dayFormatter(locale, calendar) {
+	const key = `${locale}|${calendar}`;
+	let formatter = dayFormatters.get(key);
+	if (!formatter) {
+		formatter = new DateFormatter(locale, {
+			day: "numeric",
+			calendar,
+			timeZone: "UTC"
+		});
+		dayFormatters.set(key, formatter);
+	}
+	return formatter;
+}
+/** 组件的 min、max、isDateUnavailable → 日历状态用的 DateLimits（日期换成当前日历系统） */
+function toDateLimits(locale, { min, max, isDateUnavailable }) {
+	return {
+		min: locale.fromValue(min),
+		max: locale.fromValue(max),
+		isUnavailable: isDateUnavailable && ((day) => isDateUnavailable(toIsoDate(day), day))
+	};
+}
+var GREGORIAN = new GregorianCalendar();
+/**
+* 选到的日期写回成和 like 同一种类型：like 是字符串时写 ISO 日期；是 DateValue 时保留它的类型、日历系统、时间与时区，
+* 只换年月日（CalendarDateTime 选了另一天，时间不变）。like 为空时按 valueType（默认 ISO 字符串）
+*/
+function writeDateLike(date, like, valueType = "iso") {
+	if (typeof like === "string" || like == null && valueType === "iso") return toIsoDate(date);
+	if (like == null) return toCalendar(date, GREGORIAN);
+	const converted = toCalendar(date, like.calendar);
+	if (!("hour" in like)) return converted;
+	return like.set({
+		era: converted.era,
+		year: converted.year,
+		month: converted.month,
+		day: converted.day
+	});
+}
+//#endregion
+export { toDateLimits, useDateLocale, writeDateLike };
+
+//# sourceMappingURL=date-locale.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"date-locale.js","names":[],"sources":["../../src/date/date-locale.ts"],"sourcesContent":["/**\n * 日期组件读当前语言的地区设置：语言标签、日历系统、时区、一周的排法、今天，以及 ISO 字符串与显示用日期的互转。\n * Calendar、DateField、各种日期选择器共用，组件里不再各自拼这些。在 setup 里调用，返回的对象在渲染时读取即可随语言切换。\n *\n *   const locale = useDateLocale(() => ({ firstDayOfWeek }));\n *   locale.fromValue(value) // '2026-10-20' 或 CalendarDate → 当前日历系统里的 CalendarDate\n *   locale.dayNumber(date)  // '20'（zh-CN 的 Intl 会写成“20日”，这里只取数字）\n */\nimport {\n  CalendarDate,\n  DateFormatter,\n  getLocalTimeZone,\n  GregorianCalendar,\n  toCalendar,\n  toCalendarDate,\n  today,\n  type Calendar,\n  type DateValue,\n} from '@internationalized/date';\nimport { useLang } from '../config/context';\nimport {\n  calendarOf,\n  parseIsoDate,\n  toIsoDate,\n  type DateLimits,\n  type WeekOptions,\n} from '../utils/data/date';\n\n/**\n * 日期组件接受的值：ISO 字符串（'2026-10-20'），或 @internationalized/date 的 DateValue\n * （CalendarDate、CalendarDateTime、ZonedDateTime）。写回时保持传入的类型（见 writeDateLike）\n */\nexport type DateInput = string | DateValue;\n\n/** 值为空、推不出类型时写回哪一种 */\nexport interface DateValueTypes {\n  /** ISO 字符串（默认）：与原生 input、URL 参数、zod 的 z.iso.date() 一致 */\n  iso: unknown;\n  /** @internationalized/date 的对象：日期是 CalendarDate，带时间时是 CalendarDateTime */\n  dateValue: unknown;\n}\n\n/** 组件上可以覆盖语言配置的地区选项 */\nexport interface DateLocaleOverrides {\n  /** 一周的第一天，0 表示周日；不写时取语言配置，再按地区惯例 */\n  firstDayOfWeek?: number;\n}\n\n/** useDateLocale 的返回值 */\nexport interface DateLocale {\n  /** BCP 47 语言标签 */\n  readonly locale: string;\n  /** 运算用的日历系统（语言配置的 calendar，不支持的退回公历） */\n  readonly calendar: Calendar;\n  /** 时区：语言配置的，没有时取浏览器的 */\n  readonly timeZone: string;\n  /** 一周的排法 */\n  readonly week: WeekOptions;\n  /** 今天，按时区与日历系统 */\n  today(): CalendarDate;\n  /** 值（ISO 字符串或 DateValue）→ 显示用的日期（当前日历系统）；空值、格式不对时 null */\n  fromValue(value: DateInput | null | undefined): CalendarDate | null;\n  /** 显示用的日期 → ISO 日期（公历） */\n  toIso(date: CalendarDate): string;\n  /** 日期格里的数字（按日历系统与语言的数字写法） */\n  dayNumber(date: CalendarDate): string;\n}\n\n/** 当前语言的日期地区设置（组件 setup 里调用） */\nexport function useDateLocale(read: () => DateLocaleOverrides = () => ({})): DateLocale {\n  const lang = useLang();\n  const calendar = () => calendarOf(lang.calendar);\n  return {\n    get locale() {\n      return lang.code;\n    },\n    get calendar() {\n      return calendar();\n    },\n    get timeZone() {\n      return lang.timeZone ?? getLocalTimeZone();\n    },\n    get week() {\n      return { locale: lang.code, firstDayOfWeek: read().firstDayOfWeek ?? lang.firstDayOfWeek };\n    },\n    today() {\n      return toCalendar(today(lang.timeZone ?? getLocalTimeZone()), calendar());\n    },\n    fromValue(value) {\n      if (value == null) return null;\n      // 字符串取日期部分：min / max 常写成日期时间（'2026-10-20T14:00'），日历按天比较\n      const date =\n        typeof value === 'string' ? parseIsoDate(value.slice(0, 10)) : toCalendarDate(value);\n      return date && toCalendar(date, calendar());\n    },\n    toIso: toIsoDate,\n    dayNumber(date) {\n      const parts = dayFormatter(lang.code, date.calendar.identifier).formatToParts(\n        date.toDate('UTC'),\n      );\n      return parts.find((part) => part.type === 'day')?.value ?? String(date.day);\n    },\n  };\n}\n\nconst dayFormatters = new Map<string, DateFormatter>();\n\nfunction dayFormatter(locale: string, calendar: string): DateFormatter {\n  const key = `${locale}|${calendar}`;\n  let formatter = dayFormatters.get(key);\n  if (!formatter) {\n    formatter = new DateFormatter(locale, { day: 'numeric', calendar, timeZone: 'UTC' });\n    dayFormatters.set(key, formatter);\n  }\n  return formatter;\n}\n\n/** 组件上写的可选范围与不可选的日期 */\nexport interface DateLimitProps {\n  /** 最早可选的日期（ISO 字符串如 '2026-01-01'，或 DateValue） */\n  min?: DateInput;\n  /** 最晚可选的日期（ISO 字符串或 DateValue） */\n  max?: DateInput;\n  /**\n   * 不可选的日期（已订满、节假日）：仍能用方向键经过，读屏念“不可用”，不能选。\n   * 第二个参数是同一天的 CalendarDate，判断星期几等不用自己解析：`(_, day) => isWeekend(day, 'zh-CN')`\n   */\n  isDateUnavailable?: (date: string, day: CalendarDate) => boolean;\n}\n\n/** 组件的 min、max、isDateUnavailable → 日历状态用的 DateLimits（日期换成当前日历系统） */\nexport function toDateLimits(\n  locale: DateLocale,\n  { min, max, isDateUnavailable }: DateLimitProps,\n): DateLimits {\n  return {\n    min: locale.fromValue(min),\n    max: locale.fromValue(max),\n    isUnavailable: isDateUnavailable && ((day) => isDateUnavailable(toIsoDate(day), day)),\n  };\n}\n\nconst GREGORIAN = new GregorianCalendar();\n\n/**\n * 选到的日期写回成和 like 同一种类型：like 是字符串时写 ISO 日期；是 DateValue 时保留它的类型、日历系统、时间与时区，\n * 只换年月日（CalendarDateTime 选了另一天，时间不变）。like 为空时按 valueType（默认 ISO 字符串）\n */\nexport function writeDateLike(\n  date: CalendarDate,\n  like: DateInput | null | undefined,\n  valueType: keyof DateValueTypes = 'iso',\n): DateInput {\n  if (typeof like === 'string' || (like == null && valueType === 'iso')) return toIsoDate(date);\n  if (like == null) return toCalendar(date, GREGORIAN);\n  const converted = toCalendar(date, like.calendar);\n  if (!('hour' in like)) return converted;\n  return like.set({\n    era: converted.era,\n    year: converted.year,\n    month: converted.month,\n    day: converted.day,\n  });\n}\n"],"mappings":";;;;;;;;;;;;;AAqEA,SAAgB,cAAc,cAAyC,CAAC,IAAgB;CACtF,MAAM,OAAO,QAAQ;CACrB,MAAM,iBAAiB,WAAW,KAAK,QAAQ;CAC/C,OAAO;EACL,IAAI,SAAS;GACX,OAAO,KAAK;EACd;EACA,IAAI,WAAW;GACb,OAAO,SAAS;EAClB;EACA,IAAI,WAAW;GACb,OAAO,KAAK,YAAY,iBAAiB;EAC3C;EACA,IAAI,OAAO;GACT,OAAO;IAAE,QAAQ,KAAK;IAAM,gBAAgB,KAAK,CAAC,CAAC,kBAAkB,KAAK;GAAe;EAC3F;EACA,QAAQ;GACN,OAAO,WAAW,MAAM,KAAK,YAAY,iBAAiB,CAAC,GAAG,SAAS,CAAC;EAC1E;EACA,UAAU,OAAO;GACf,IAAI,SAAS,MAAM,OAAO;GAE1B,MAAM,OACJ,OAAO,UAAU,WAAW,aAAa,MAAM,MAAM,GAAG,EAAE,CAAC,IAAI,eAAe,KAAK;GACrF,OAAO,QAAQ,WAAW,MAAM,SAAS,CAAC;EAC5C;EACA,OAAO;EACP,UAAU,MAAM;GAId,OAHc,aAAa,KAAK,MAAM,KAAK,SAAS,UAAU,CAAC,CAAC,cAC9D,KAAK,OAAO,KAAK,CAEZ,CAAA,CAAM,MAAM,SAAS,KAAK,SAAS,KAAK,CAAC,EAAE,SAAS,OAAO,KAAK,GAAG;EAC5E;CACF;AACF;AAEA,IAAM,gCAAgB,IAAI,IAA2B;AAErD,SAAS,aAAa,QAAgB,UAAiC;CACrE,MAAM,MAAM,GAAG,OAAO,GAAG;CACzB,IAAI,YAAY,cAAc,IAAI,GAAG;CACrC,IAAI,CAAC,WAAW;EACd,YAAY,IAAI,cAAc,QAAQ;GAAE,KAAK;GAAW;GAAU,UAAU;EAAM,CAAC;EACnF,cAAc,IAAI,KAAK,SAAS;CAClC;CACA,OAAO;AACT;;AAgBA,SAAgB,aACd,QACA,EAAE,KAAK,KAAK,qBACA;CACZ,OAAO;EACL,KAAK,OAAO,UAAU,GAAG;EACzB,KAAK,OAAO,UAAU,GAAG;EACzB,eAAe,uBAAuB,QAAQ,kBAAkB,UAAU,GAAG,GAAG,GAAG;CACrF;AACF;AAEA,IAAM,YAAY,IAAI,kBAAkB;;;;;AAMxC,SAAgB,cACd,MACA,MACA,YAAkC,OACvB;CACX,IAAI,OAAO,SAAS,YAAa,QAAQ,QAAQ,cAAc,OAAQ,OAAO,UAAU,IAAI;CAC5F,IAAI,QAAQ,MAAM,OAAO,WAAW,MAAM,SAAS;CACnD,MAAM,YAAY,WAAW,MAAM,KAAK,QAAQ;CAChD,IAAI,EAAE,UAAU,OAAO,OAAO;CAC9B,OAAO,KAAK,IAAI;EACd,KAAK,UAAU;EACf,MAAM,UAAU;EAChB,OAAO,UAAU;EACjB,KAAK,UAAU;CACjB,CAAC;AACH"}

package/dist/date/date-segments.d.ts

@@ -0,0 +1,132 @@
+import type { HourCycles } from '../config/lang/lang';
+/** 可以输入的段 */
+export interface DateSegmentTypes {
+    /** 年 */
+    year: unknown;
+    /** 月 */
+    month: unknown;
+    /** 日 */
+    day: unknown;
+    /** 季度（1–4） */
+    quarter: unknown;
+    /** 一年里的第几周（ISO 8601：周一开始，含 1 月 4 日的那周是第 1 周） */
+    week: unknown;
+    /** 时（内部总是 0–23，12 小时制时显示 1–12） */
+    hour: unknown;
+    /** 分 */
+    minute: unknown;
+    /** 秒 */
+    second: unknown;
+    /** 上午 / 下午（12 小时制时自动加上） */
+    dayPeriod: unknown;
+}
+/** 一段的类型 */
+export type DateSegmentType = keyof DateSegmentTypes;
+/** 值的各个字段：时是 0–23 */
+export type DateFieldValues = Partial<Record<Exclude<DateSegmentType, 'dayPeriod'>, number>>;
+/** 渲染用的一段 */
+export interface DateSegment {
+    /** 段的类型；literal 是分隔符（/、:、年） */
+    type: DateSegmentType | 'literal';
+    /** 显示的文字：值、正在输入的数字，或占位文字 */
+    text: string;
+    /** 还没填：显示的是占位文字 */
+    placeholder: boolean;
+    /** 当前值（dayPeriod 是 0 上午 / 1 下午）；没填时 null */
+    value: number | null;
+    /** 最小值（aria-valuemin） */
+    min: number;
+    /** 最大值（aria-valuemax） */
+    max: number;
+    /** 段的名称（取自 Intl.DisplayNames：年、月、日 / year、month、day），给 aria-label */
+    label: string;
+}
+/** useDateSegments 的选项 */
+export interface DateSegmentsOptions {
+    /** 有哪些段（不含 dayPeriod，12 小时制时自动加） */
+    fields: () => readonly Exclude<DateSegmentType, 'dayPeriod'>[];
+    /** 语言：段的顺序、分隔符、数字的写法 */
+    locale: () => string;
+    /** 12 / 24 小时制；不写时按语言 */
+    hourCycle?: () => keyof HourCycles | undefined;
+    /** 完整的值（外部传入）；没有时 null */
+    value: () => DateFieldValues | null;
+    /** 所有段都填了时写回完整的值，填好的值删掉一段时写回 null */
+    onChange: (value: DateFieldValues | null) => void;
+    /** ↑↓ 从空段开始加减时的起点（一般是现在） */
+    placeholderValue: () => DateFieldValues;
+    /** 各段的占位文字（年、月、日 / yyyy、mm、dd） */
+    placeholders: () => Partial<Record<DateSegmentType, string>>;
+    /** 季度、周这两种段的排法（Intl 不排它们），如 `'{year}年第{quarter}季度'`；不写时是 `'{year}-{quarter}'` */
+    periodPatterns?: () => Partial<Record<'quarter' | 'week', string>>;
+    /** 只读或不可用：不响应输入 */
+    readonly?: () => boolean;
+    /** 焦点要越过这组的两端时（最后一段输入满了；第一段删空后再删）：DateRangePicker 把焦点交给另一组 */
+    onExit?: (direction: 1 | -1) => void;
+}
+/** 分段输入的状态与操作 */
+export interface DateSegmentsState {
+    /** 各段，含分隔符，按语言的顺序 */
+    readonly segments: readonly DateSegment[];
+    /** 可以输入的段（不含分隔符），Tab 与 ←→ 的顺序 */
+    readonly editable: readonly DateSegment[];
+    /** 焦点应该在的段：输入满了跳到下一段、Backspace 删空回到上一段时变化 */
+    readonly focusedSegment: DateSegmentType | null;
+    /** 有段填了、但还没填全 */
+    readonly partial: boolean;
+    /** 焦点进了某一段（组件的 focusin） */
+    setFocused(type: DateSegmentType | null): void;
+    /** 在焦点段输入文字（数字、a / p）：逐个字符处理 */
+    type(text: string): void;
+    /** 焦点段加减 */
+    increment(amount: number): void;
+    /** 焦点段设成最小 / 最大值 */
+    toEdge(edge: 'min' | 'max'): void;
+    /** 删掉焦点段的最后一位；已经空了时焦点回到上一段 */
+    backspace(): void;
+    /** 清空所有段 */
+    clear(): void;
+    /** 丢掉还没写回的输入（打了一半的段），回到当前的值：表单重置时 */
+    reset(): void;
+    /** 写回还没写回的年份（没打满四位时先不写回）：离开这一段、按 Enter 提交时 */
+    commit(): void;
+    /** 焦点移到相邻的段 */
+    moveFocus(direction: 1 | -1): void;
+}
+/** 分段输入的状态（组件 setup 里调用） */
+export declare function useDateSegments(config: DateSegmentsOptions): DateSegmentsState;
+/**
+ * 分段输入的键盘操作：↑↓ 加减、Page Up / Down 大步、Home / End 最小 / 最大、Backspace / Delete 删除、
+ * ←→ 换段（从右到左排版时反过来）。数字与字母走 beforeinput（软键盘、输入法也能输入），这里不处理。
+ * 返回是否处理了这个按键（处理了就该 preventDefault）
+ */
+export declare function handleSegmentKeydown(state: DateSegmentsState, event: KeyboardEvent, rtl?: boolean): boolean;
+/** 日期类分段的粒度：DateField 精确到哪一段（到时、分、秒时是日期加时间） */
+export interface DateFieldGranularities {
+    /** 只有年：'2026' */
+    year: unknown;
+    /** 年月：'2026-10'（同原生 input type="month"） */
+    month: unknown;
+    /** 年月日（默认）：'2026-10-20' */
+    day: unknown;
+    /** 年与季度：'2026-Q4' */
+    quarter: unknown;
+    /** 年与周（ISO 8601，周一开始）：'2026-W43'（同原生 input type="week"） */
+    week: unknown;
+    /** 日期加时：'2026-10-20T14:00' */
+    hour: unknown;
+    /** 日期加时分：'2026-10-20T14:30'（同原生 input type="datetime-local"） */
+    minute: unknown;
+    /** 日期加时分秒：'2026-10-20T14:30:15' */
+    second: unknown;
+}
+/** 分段输入精确到哪一段 */
+export type DateFieldGranularity = keyof DateFieldGranularities;
+type ValueField = Exclude<DateSegmentType, 'dayPeriod'>;
+/** 日期分段：从年到 granularity；time 时只取时间的部分（TimeField） */
+export declare function segmentFields(granularity: DateFieldGranularity, time?: boolean): ValueField[];
+/** 各段的值 → ISO 字符串（按有哪些段：'2026'、'2026-10'、'2026-10-20'、'2026-10-20T14:30'、'14:30'） */
+export declare function fieldsToIso(values: DateFieldValues, fields: readonly ValueField[]): string;
+/** ISO 字符串 → 各段的值；格式不对时 null。只取 fields 里有的段（'2026-10-20T14:30' 给 DateField 时只要日期） */
+export declare function isoToFields(value: string | null | undefined, fields: readonly ValueField[]): DateFieldValues | null;
+export {};