@xihan-ui/vue 4.1.0 → 5.0.0

package/dist/components/date-picker/use-date-picker.js

@@ -3,9 +3,9 @@ import { vueNormalize } from "../../runtime/normalize-props.js";
 import { useXhConfig } from "../../config/config.js";
 import { useMachine } from "../../runtime/use-machine.js";
 import { createVueIdGenerator } from "../../runtime/vue-id.js";
+import { calendarPickerMachine, connectDatePicker, dateFieldMachine, datePickerCalendarProps, datePickerFieldProps, datePickerMachine } from "@xihan-ui/headless";
 import { computed, ref, shallowRef, watch } from "vue";
 import { createRuntimeConfig, createScope, isElement } from "@xihan-ui/core";
-import { calendarPickerMachine, connectDatePicker, dateFieldMachine, datePickerCalendarProps, datePickerFieldProps, datePickerMachine } from "@xihan-ui/headless";
 import { createPositionEngine } from "@xihan-ui/position";
 //#region src/components/date-picker/use-date-picker.ts
 /** 已创建的 RuntimeConfig 永久归属首次根节点的 Document；动态 Scope 后续不能改写这份事实。 */
@@ -28,8 +28,10 @@ function createDatePickerContext(props, handlers, rootRef) {
 	const gridRef = ref(null);
 	const idGen = createVueIdGenerator();
 	const scope = rootRef ? createScope(() => rootRef.value, idGen) : createScope(null, idGen);
+	const labelCount = ref(0);
 	const root = useMachine(datePickerMachine, () => ({
 		...props,
+		labelled: labelCount.value > 0,
 		...handlers
 	}), scope);
 	const calendar = useMachine(calendarPickerMachine, () => datePickerCalendarProps(root), scope);
@@ -100,6 +102,7 @@ function createDatePickerContext(props, handlers, rootRef) {
 		return isElement(host) && host.contains(content) ? content : null;
 	});
 	return {
+		labelCount,
 		visible,
 		api,
 		services,

package/dist/components/date-picker/use-date-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-date-picker.js","names":[],"sources":["../../../src/components/date-picker/use-date-picker.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 use date picker 相关实现。\n\nimport type { Cleanup, Layer, RuntimeConfig } from '@xihan-ui/core'\nimport type { CalendarPickerSchema, DateFieldSchema, DatePickerApi, DatePickerSchema, DatePickerServices } from '@xihan-ui/headless'\nimport type { ComputedRef, Ref } from 'vue'\nimport { createRuntimeConfig, createScope, isElement } from '@xihan-ui/core'\nimport {\n  calendarPickerMachine,\n  connectDatePicker,\n  dateFieldMachine,\n  datePickerCalendarProps,\n  datePickerFieldProps,\n  datePickerMachine,\n} from '@xihan-ui/headless'\nimport { createPositionEngine } from '@xihan-ui/position'\nimport { computed, ref, shallowRef, watch } from 'vue'\nimport { useXhConfig } from '../../config/config'\nimport { vueNormalize } from '../../runtime/normalize-props'\nimport { useMachine } from '../../runtime/use-machine'\nimport { useOverlayExit } from '../../runtime/use-overlay-exit'\nimport { createVueIdGenerator } from '../../runtime/vue-id'\n\nexport interface DatePickerContext {\n  api: ComputedRef<DatePickerApi>\n  /** 四台状态机的句柄，供部件上报 DOM 侧的事实。 */\n  services: DatePickerServices\n  controlRef: Ref<HTMLElement | null>\n  positionerRef: Ref<HTMLElement | null>\n  contentRef: Ref<HTMLElement | null>\n  /** 当前是否应当渲染：退场动画播完之前仍为真。 */\n  visible: Ref<boolean>\n  gridRef: Ref<HTMLElement | null>\n  /** 显式同 Document 目标优先，默认使用真实根所属运行时的 Portal。 */\n  portalTarget: ComputedRef<string | Element>\n}\n\ntype DatePickerHandlers = Pick<\n  DatePickerSchema['props'],\n  'onValueChange' | 'onOpenChange' | 'onFocusedValueChange' | 'onActiveViewChange'\n>\n\n/** 已创建的 RuntimeConfig 永久归属首次根节点的 Document；动态 Scope 后续不能改写这份事实。 */\nexport function assertDatePickerRootDocument(expected: Document, node: Element): void {\n  if (node.ownerDocument !== expected)\n    throw new Error('[xh] DatePicker 根节点不能在运行期切换 Document')\n}\n\n/** 显式 Portal 是同 realm 目标，不是 Scope 来源；字段存在时 null 与伪节点都属于配置错误。 */\nexport function resolveDatePickerPortalTarget(\n  runtime: RuntimeConfig,\n  resolver: (() => unknown) | undefined,\n): Element | undefined {\n  if (!resolver)\n    return undefined\n  const target = resolver()\n  if (!isElement(target))\n    throw new TypeError('[xh] DatePicker 的 portalContainer 必须返回 Element')\n  if (target.ownerDocument !== runtime.layerRegistry.ownerDocument)\n    throw new Error('[xh] DatePicker 的 portalContainer 必须与组件根属于同一 Document')\n  return target\n}\n\nfunction createDatePickerContext(\n  props: DatePickerSchema['props'],\n  handlers: DatePickerHandlers,\n  rootRef?: Readonly<Ref<HTMLElement | null>>,\n): DatePickerContext {\n  const xhConfig = useXhConfig()\n  const controlRef = ref<HTMLElement | null>(null)\n  const positionerRef = ref<HTMLElement | null>(null)\n  const contentRef = ref<HTMLElement | null>(null)\n  const gridRef = ref<HTMLElement | null>(null)\n\n  // 三台机器共用一份 scope，part id 里带组件名区分；段位不产出 id，同 scope 不会撞\n  const idGen = createVueIdGenerator()\n  const scope = rootRef ? createScope(() => rootRef.value, idGen) : createScope(null, idGen)\n\n  // 两台内嵌机器的 props 都从编排机现读，编排机须先建立\n  const root = useMachine(datePickerMachine, () => ({ ...props, ...handlers }), scope)\n  const calendar = useMachine<CalendarPickerSchema>(calendarPickerMachine, () => datePickerCalendarProps(root), scope)\n  const field = useMachine<DateFieldSchema>(dateFieldMachine, () => datePickerFieldProps(root), scope)\n  const services: DatePickerServices = { root, calendar, field }\n\n  // 服务端没有 DOM、也就没有退场：config 传 null 时闸门退化成「跟着展开态」\n  const config = shallowRef<RuntimeConfig | null>(null)\n  let runtimeDocument: Document | null = null\n\n  if (typeof document !== 'undefined') {\n    const installConfig = (node?: HTMLElement): void => {\n      const current = config.value\n      if (current) {\n        // scope 读取的是动态 rootRef；这里必须与创建配置时冻结的 Document 比，不能拿新根和自己比。\n        if (node)\n          assertDatePickerRootDocument(runtimeDocument!, node)\n        return\n      }\n\n      const next = createRuntimeConfig({ scope, idGenerator: idGen })\n      // 只提供注册函数，入栈出栈由机器的 trackLayer 效应按展开态驱动\n      const registerLayer = (): { layer: Layer, dispose: Cleanup } => next.layerRegistry.register({\n        kind: 'popover',\n        node: () => contentRef.value,\n        // 整个输入行记为本层分支，点 trigger 或段位算层内交互；\n        // 浮层壳一并记上：content 之外还浮着自绘滚动条，按住它拖动不该把浮层消解掉\n        branches: () => [controlRef.value, positionerRef.value].filter(Boolean) as Element[],\n        isModal: () => false,\n        surfaces: () => [],\n      })\n\n      root.refs.set('config', next)\n      root.refs.set('registerLayer', registerLayer)\n      runtimeDocument = next.layerRegistry.ownerDocument\n      config.value = next\n    }\n\n    if (rootRef) {\n      // 元素 ref 在 mounted hooks 之前同步提交：先绑定真实 realm、再让三台 service 启动。\n      watch(rootRef, (node) => {\n        if (node)\n          installConfig(node)\n      }, { flush: 'sync', immediate: true })\n    }\n    else {\n      // 直接调用公开 composable 的既有合同仍代表 ambient Document。\n      installConfig()\n    }\n\n    // 定位引擎由适配器注入，机器只经端口驱动；锚点取整个输入行\n    root.refs.set('position', createPositionEngine())\n    root.refs.set('getAnchorEl', () => controlRef.value)\n    root.refs.set('getFloatingEl', () => positionerRef.value)\n  }\n\n  // 跨月后的焦点落点要等重渲，日历机器推迟一拍再从这里取网格现查\n  calendar.refs.set('getGridEl', () => gridRef.value)\n\n  const api = computed(() => connectDatePicker(services, vueNormalize))\n  // 退场闸门：收起从跟着 open 走，改成跟着 presence 走\n  const visible = useOverlayExit({\n    config,\n    isOpen: () => api.value.open,\n    contentRef,\n    onPresence: presence => root.refs.set('presence', presence),\n  })\n  // 显式配置只选择同一 Document 内的落点，不能反过来决定 Scope，也不能跨 realm 搬运。\n  const portalTarget = computed<string | Element>(() => {\n    const runtime = config.value\n    // 首次 render 时 rootRef 还没提交；不读取显式 getter，Portal 在来源位置正常挂载。\n    if (!runtime)\n      return 'body'\n    const explicitTarget = resolveDatePickerPortalTarget(runtime, xhConfig.value.portalContainer)\n    if (explicitTarget)\n      return explicitTarget\n    const defaultTarget = runtime.portalContainer()\n    if (!isElement(defaultTarget))\n      throw new TypeError('[xh] DatePicker 的运行时 portalContainer 必须返回 Element')\n    return defaultTarget\n  })\n\n  if (typeof document !== 'undefined') {\n    root.refs.set('getContentEl', () => {\n      const content = contentRef.value\n      if (!content || !rootRef)\n        return content\n      // 首次 mounted 时正文仍可能原地挂载，随后 Teleport 搬运会丢失刚取得的焦点。\n      // 以真正进入目标容器为就绪事实，焦点域沿既有挂载流程等待，不提前聚焦临时位置。\n      const runtime = config.value\n      if (!runtime)\n        return null\n      // 焦点域在框架错误通道之外（flush / rAF）调这里，所以只回答 DOM 事实、不复核配置：\n      // 配置错误由渲染读 portalTarget 时抛出并交给框架上报。若这里也读那个 computed，\n      // 先到的一路会把异常截走，渲染只剩缓存的旧值，错误就成了未捕获 rejection。\n      // 跨 Document 或非 Element 的落点不包含正文，正文自然还没进落点。\n      const explicit = xhConfig.value.portalContainer\n      const host = explicit ? explicit() : runtime.portalContainer()\n      return isElement(host) && host.contains(content) ? content : null\n    })\n  }\n\n  return { visible, api, services, controlRef, positionerRef, contentRef, gridRef, portalTarget }\n}\n\n/** 公开 composable 保留 ambient Scope 合同。 */\nexport function useDatePicker(\n  props: DatePickerSchema['props'],\n  handlers: DatePickerHandlers = {},\n): DatePickerContext {\n  return createDatePickerContext(props, handlers)\n}\n\n/** 组合组件内部从真实根节点绑定 Scope；不经包入口导出。 */\nexport function useDatePickerWithRoot(\n  props: DatePickerSchema['props'],\n  handlers: DatePickerHandlers,\n  rootRef: Readonly<Ref<HTMLElement | null>>,\n): DatePickerContext {\n  return createDatePickerContext(props, handlers, rootRef)\n}\n"],"mappings":"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"}
+{"version":3,"file":"use-date-picker.js","names":[],"sources":["../../../src/components/date-picker/use-date-picker.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 use date picker 相关实现。\n\nimport type { Cleanup, Layer, RuntimeConfig } from '@xihan-ui/core'\nimport type { CalendarPickerSchema, DateFieldSchema, DatePickerApi, DatePickerSchema, DatePickerServices } from '@xihan-ui/headless'\nimport type { ComputedRef, Ref } from 'vue'\nimport { createRuntimeConfig, createScope, isElement } from '@xihan-ui/core'\nimport {\n  calendarPickerMachine,\n  connectDatePicker,\n  dateFieldMachine,\n  datePickerCalendarProps,\n  datePickerFieldProps,\n  datePickerMachine,\n} from '@xihan-ui/headless'\nimport { createPositionEngine } from '@xihan-ui/position'\nimport { computed, ref, shallowRef, watch } from 'vue'\nimport { useXhConfig } from '../../config/config'\nimport { vueNormalize } from '../../runtime/normalize-props'\nimport { useMachine } from '../../runtime/use-machine'\nimport { useOverlayExit } from '../../runtime/use-overlay-exit'\nimport { createVueIdGenerator } from '../../runtime/vue-id'\n\nexport interface DatePickerContext {\n  /**\n   * 已渲染的 label 部件数量，由 XhDatePickerLabel 在 setup 里同步登记、卸载时撤销。\n   * 可聚焦部件的 aria-labelledby 据此决定指不指过去：label 排在输入之前时，首帧与服务端直出就带上名字。\n   */\n  labelCount: Ref<number>\n  api: ComputedRef<DatePickerApi>\n  /** 四台状态机的句柄，供部件上报 DOM 侧的事实。 */\n  services: DatePickerServices\n  controlRef: Ref<HTMLElement | null>\n  positionerRef: Ref<HTMLElement | null>\n  contentRef: Ref<HTMLElement | null>\n  /** 当前是否应当渲染：退场动画播完之前仍为真。 */\n  visible: Ref<boolean>\n  gridRef: Ref<HTMLElement | null>\n  /** 显式同 Document 目标优先，默认使用真实根所属运行时的 Portal。 */\n  portalTarget: ComputedRef<string | Element>\n}\n\ntype DatePickerHandlers = Pick<\n  DatePickerSchema['props'],\n  'onValueChange' | 'onOpenChange' | 'onFocusedValueChange' | 'onActiveViewChange'\n>\n\n/** 已创建的 RuntimeConfig 永久归属首次根节点的 Document；动态 Scope 后续不能改写这份事实。 */\nexport function assertDatePickerRootDocument(expected: Document, node: Element): void {\n  if (node.ownerDocument !== expected)\n    throw new Error('[xh] DatePicker 根节点不能在运行期切换 Document')\n}\n\n/** 显式 Portal 是同 realm 目标，不是 Scope 来源；字段存在时 null 与伪节点都属于配置错误。 */\nexport function resolveDatePickerPortalTarget(\n  runtime: RuntimeConfig,\n  resolver: (() => unknown) | undefined,\n): Element | undefined {\n  if (!resolver)\n    return undefined\n  const target = resolver()\n  if (!isElement(target))\n    throw new TypeError('[xh] DatePicker 的 portalContainer 必须返回 Element')\n  if (target.ownerDocument !== runtime.layerRegistry.ownerDocument)\n    throw new Error('[xh] DatePicker 的 portalContainer 必须与组件根属于同一 Document')\n  return target\n}\n\nfunction createDatePickerContext(\n  props: DatePickerSchema['props'],\n  handlers: DatePickerHandlers,\n  rootRef?: Readonly<Ref<HTMLElement | null>>,\n): DatePickerContext {\n  const xhConfig = useXhConfig()\n  const controlRef = ref<HTMLElement | null>(null)\n  const positionerRef = ref<HTMLElement | null>(null)\n  const contentRef = ref<HTMLElement | null>(null)\n  const gridRef = ref<HTMLElement | null>(null)\n\n  // 三台机器共用一份 scope，part id 里带组件名区分；段位不产出 id，同 scope 不会撞\n  const idGen = createVueIdGenerator()\n  const scope = rootRef ? createScope(() => rootRef.value, idGen) : createScope(null, idGen)\n\n  // 两台内嵌机器的 props 都从编排机现读，编排机须先建立\n  const labelCount = ref(0)\n  const root = useMachine(datePickerMachine, () => ({ ...props, labelled: labelCount.value > 0, ...handlers }), scope)\n  const calendar = useMachine<CalendarPickerSchema>(calendarPickerMachine, () => datePickerCalendarProps(root), scope)\n  const field = useMachine<DateFieldSchema>(dateFieldMachine, () => datePickerFieldProps(root), scope)\n  const services: DatePickerServices = { root, calendar, field }\n\n  // 服务端没有 DOM、也就没有退场：config 传 null 时闸门退化成「跟着展开态」\n  const config = shallowRef<RuntimeConfig | null>(null)\n  let runtimeDocument: Document | null = null\n\n  if (typeof document !== 'undefined') {\n    const installConfig = (node?: HTMLElement): void => {\n      const current = config.value\n      if (current) {\n        // scope 读取的是动态 rootRef；这里必须与创建配置时冻结的 Document 比，不能拿新根和自己比。\n        if (node)\n          assertDatePickerRootDocument(runtimeDocument!, node)\n        return\n      }\n\n      const next = createRuntimeConfig({ scope, idGenerator: idGen })\n      // 只提供注册函数，入栈出栈由机器的 trackLayer 效应按展开态驱动\n      const registerLayer = (): { layer: Layer, dispose: Cleanup } => next.layerRegistry.register({\n        kind: 'popover',\n        node: () => contentRef.value,\n        // 整个输入行记为本层分支，点 trigger 或段位算层内交互；\n        // 浮层壳一并记上：content 之外还浮着自绘滚动条，按住它拖动不该把浮层消解掉\n        branches: () => [controlRef.value, positionerRef.value].filter(Boolean) as Element[],\n        isModal: () => false,\n        surfaces: () => [],\n      })\n\n      root.refs.set('config', next)\n      root.refs.set('registerLayer', registerLayer)\n      runtimeDocument = next.layerRegistry.ownerDocument\n      config.value = next\n    }\n\n    if (rootRef) {\n      // 元素 ref 在 mounted hooks 之前同步提交：先绑定真实 realm、再让三台 service 启动。\n      watch(rootRef, (node) => {\n        if (node)\n          installConfig(node)\n      }, { flush: 'sync', immediate: true })\n    }\n    else {\n      // 直接调用公开 composable 的既有合同仍代表 ambient Document。\n      installConfig()\n    }\n\n    // 定位引擎由适配器注入，机器只经端口驱动；锚点取整个输入行\n    root.refs.set('position', createPositionEngine())\n    root.refs.set('getAnchorEl', () => controlRef.value)\n    root.refs.set('getFloatingEl', () => positionerRef.value)\n  }\n\n  // 跨月后的焦点落点要等重渲，日历机器推迟一拍再从这里取网格现查\n  calendar.refs.set('getGridEl', () => gridRef.value)\n\n  const api = computed(() => connectDatePicker(services, vueNormalize))\n  // 退场闸门：收起从跟着 open 走，改成跟着 presence 走\n  const visible = useOverlayExit({\n    config,\n    isOpen: () => api.value.open,\n    contentRef,\n    onPresence: presence => root.refs.set('presence', presence),\n  })\n  // 显式配置只选择同一 Document 内的落点，不能反过来决定 Scope，也不能跨 realm 搬运。\n  const portalTarget = computed<string | Element>(() => {\n    const runtime = config.value\n    // 首次 render 时 rootRef 还没提交；不读取显式 getter，Portal 在来源位置正常挂载。\n    if (!runtime)\n      return 'body'\n    const explicitTarget = resolveDatePickerPortalTarget(runtime, xhConfig.value.portalContainer)\n    if (explicitTarget)\n      return explicitTarget\n    const defaultTarget = runtime.portalContainer()\n    if (!isElement(defaultTarget))\n      throw new TypeError('[xh] DatePicker 的运行时 portalContainer 必须返回 Element')\n    return defaultTarget\n  })\n\n  if (typeof document !== 'undefined') {\n    root.refs.set('getContentEl', () => {\n      const content = contentRef.value\n      if (!content || !rootRef)\n        return content\n      // 首次 mounted 时正文仍可能原地挂载，随后 Teleport 搬运会丢失刚取得的焦点。\n      // 以真正进入目标容器为就绪事实，焦点域沿既有挂载流程等待，不提前聚焦临时位置。\n      const runtime = config.value\n      if (!runtime)\n        return null\n      // 焦点域在框架错误通道之外（flush / rAF）调这里，所以只回答 DOM 事实、不复核配置：\n      // 配置错误由渲染读 portalTarget 时抛出并交给框架上报。若这里也读那个 computed，\n      // 先到的一路会把异常截走，渲染只剩缓存的旧值，错误就成了未捕获 rejection。\n      // 跨 Document 或非 Element 的落点不包含正文，正文自然还没进落点。\n      const explicit = xhConfig.value.portalContainer\n      const host = explicit ? explicit() : runtime.portalContainer()\n      return isElement(host) && host.contains(content) ? content : null\n    })\n  }\n\n  return { labelCount, visible, api, services, controlRef, positionerRef, contentRef, gridRef, portalTarget }\n}\n\n/** 公开 composable 保留 ambient Scope 合同。 */\nexport function useDatePicker(\n  props: DatePickerSchema['props'],\n  handlers: DatePickerHandlers = {},\n): DatePickerContext {\n  return createDatePickerContext(props, handlers)\n}\n\n/** 组合组件内部从真实根节点绑定 Scope；不经包入口导出。 */\nexport function useDatePickerWithRoot(\n  props: DatePickerSchema['props'],\n  handlers: DatePickerHandlers,\n  rootRef: Readonly<Ref<HTMLElement | null>>,\n): DatePickerContext {\n  return createDatePickerContext(props, handlers, rootRef)\n}\n"],"mappings":"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"}

package/dist/components/date-range-picker/context.js

@@ -4,6 +4,8 @@ const KEY = Symbol.for("xh-date-range-picker");
 const CELL_KEY = Symbol.for("xh-date-range-picker-cell");
 const SEGMENT_GROUP_KEY = Symbol.for("xh-date-range-picker-segment-group");
 const PANEL_KEY = Symbol.for("xh-date-range-picker-panel");
+const COLUMN_GROUP_KEY = Symbol.for("xh-date-range-picker-column-group");
+const TIME_COLUMN_KEY = Symbol.for("xh-date-range-picker-time-column");
 /** 没有分段容器时的组号，段位与隐藏输入落到起点组。 */
 const START_GROUP = { index: computed(() => 0) };
 /** 日历未声明面板号时的落点，与单面板时一致。 */
@@ -36,7 +38,23 @@ function provideDateRangePickerPanel(ctx) {
 function useDateRangePickerPanelContext() {
 	return inject(PANEL_KEY, FIRST_PANEL);
 }
+function provideDateRangePickerColumnGroup(ctx) {
+	provide(COLUMN_GROUP_KEY, ctx);
+}
+function useDateRangePickerColumnGroupContext() {
+	const ctx = inject(COLUMN_GROUP_KEY, null);
+	if (!ctx) throw new Error("[xh] DateRangePicker 的时间列与小标题要放在 XhDateRangePickerColumnGroup 里");
+	return ctx;
+}
+function provideDateRangePickerTimeColumn(ctx) {
+	provide(TIME_COLUMN_KEY, ctx);
+}
+function useDateRangePickerTimeColumnContext() {
+	const ctx = inject(TIME_COLUMN_KEY, null);
+	if (!ctx) throw new Error("[xh] XhDateRangePickerTimeItem 要放在 XhDateRangePickerTimeColumn 里");
+	return ctx;
+}
 //#endregion
-export { provideDateRangePicker, provideDateRangePickerCell, provideDateRangePickerPanel, provideDateRangePickerSegmentGroup, useDateRangePickerCellContext, useDateRangePickerContext, useDateRangePickerPanelContext, useDateRangePickerSegmentGroupContext };
+export { provideDateRangePicker, provideDateRangePickerCell, provideDateRangePickerColumnGroup, provideDateRangePickerPanel, provideDateRangePickerSegmentGroup, provideDateRangePickerTimeColumn, useDateRangePickerCellContext, useDateRangePickerColumnGroupContext, useDateRangePickerContext, useDateRangePickerPanelContext, useDateRangePickerSegmentGroupContext, useDateRangePickerTimeColumnContext };
 
 //# sourceMappingURL=context.js.map

package/dist/components/date-range-picker/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../../src/components/date-range-picker/context.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 context 相关实现。\n\nimport type { CalendarCellProps } from '@xihan-ui/headless'\nimport type { ComputedRef, InjectionKey } from 'vue'\nimport type { DateRangePickerContext } from './use-date-range-picker'\nimport { computed, inject, provide } from 'vue'\n\n/** 格子声明的那一天，供 cell-trigger 复用同一份声明（作者只写一次 value）。 */\nexport interface DateRangePickerCellContext {\n  cell: ComputedRef<CalendarCellProps>\n}\n\n/** 分段容器声明的组号，供组内的段位与隐藏输入认领起止两组之一。 */\nexport interface DateRangePickerSegmentGroupContext {\n  /** 0 是起点组，1 是终点组。 */\n  index: ComputedRef<0 | 1>\n}\n\n/** 日历声明的面板号，供面板内的标题、网格与格子认领自己属于并排的第几张。 */\nexport interface DateRangePickerPanelContext {\n  index: ComputedRef<number>\n}\n\nconst KEY: InjectionKey<DateRangePickerContext> = Symbol.for('xh-date-range-picker')\nconst CELL_KEY: InjectionKey<DateRangePickerCellContext> = Symbol.for('xh-date-range-picker-cell')\nconst SEGMENT_GROUP_KEY: InjectionKey<DateRangePickerSegmentGroupContext> = Symbol.for('xh-date-range-picker-segment-group')\nconst PANEL_KEY: InjectionKey<DateRangePickerPanelContext> = Symbol.for('xh-date-range-picker-panel')\n\n/** 没有分段容器时的组号，段位与隐藏输入落到起点组。 */\nconst START_GROUP: DateRangePickerSegmentGroupContext = { index: computed<0 | 1>(() => 0) }\n\n/** 日历未声明面板号时的落点，与单面板时一致。 */\nconst FIRST_PANEL: DateRangePickerPanelContext = { index: computed(() => 0) }\n\nexport function provideDateRangePicker(ctx: DateRangePickerContext): void {\n  provide(KEY, ctx)\n}\n\nexport function useDateRangePickerContext(): DateRangePickerContext {\n  const ctx = inject(KEY, null)\n  if (!ctx)\n    throw new Error('[xh] DateRangePicker 部件必须用在 XhDateRangePickerRoot 内')\n  return ctx\n}\n\nexport function provideDateRangePickerCell(ctx: DateRangePickerCellContext): void {\n  provide(CELL_KEY, ctx)\n}\n\nexport function useDateRangePickerCellContext(): DateRangePickerCellContext {\n  const ctx = inject(CELL_KEY, null)\n  if (!ctx)\n    throw new Error('[xh] DateRangePicker 日期触发器必须用在 XhDateRangePickerCell 内')\n  return ctx\n}\n\nexport function provideDateRangePickerSegmentGroup(ctx: DateRangePickerSegmentGroupContext): void {\n  provide(SEGMENT_GROUP_KEY, ctx)\n}\n\nexport function useDateRangePickerSegmentGroupContext(): DateRangePickerSegmentGroupContext {\n  return inject(SEGMENT_GROUP_KEY, START_GROUP)\n}\n\nexport function provideDateRangePickerPanel(ctx: DateRangePickerPanelContext): void {\n  provide(PANEL_KEY, ctx)\n}\n\nexport function useDateRangePickerPanelContext(): DateRangePickerPanelContext {\n  return inject(PANEL_KEY, FIRST_PANEL)\n}\n"],"mappings":";;AA4BA,MAAM,MAA4C,OAAO,IAAI,sBAAsB;AACnF,MAAM,WAAqD,OAAO,IAAI,2BAA2B;AACjG,MAAM,oBAAsE,OAAO,IAAI,oCAAoC;AAC3H,MAAM,YAAuD,OAAO,IAAI,4BAA4B;;AAGpG,MAAM,cAAkD,EAAE,OAAO,eAAsB,CAAC,EAAE;;AAG1F,MAAM,cAA2C,EAAE,OAAO,eAAe,CAAC,EAAE;AAE5E,SAAgB,uBAAuB,KAAmC;CACxE,QAAQ,KAAK,GAAG;AAClB;AAEA,SAAgB,4BAAoD;CAClE,MAAM,MAAM,OAAO,KAAK,IAAI;CAC5B,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,qDAAqD;CACvE,OAAO;AACT;AAEA,SAAgB,2BAA2B,KAAuC;CAChF,QAAQ,UAAU,GAAG;AACvB;AAEA,SAAgB,gCAA4D;CAC1E,MAAM,MAAM,OAAO,UAAU,IAAI;CACjC,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,wDAAwD;CAC1E,OAAO;AACT;AAEA,SAAgB,mCAAmC,KAA+C;CAChG,QAAQ,mBAAmB,GAAG;AAChC;AAEA,SAAgB,wCAA4E;CAC1F,OAAO,OAAO,mBAAmB,WAAW;AAC9C;AAEA,SAAgB,4BAA4B,KAAwC;CAClF,QAAQ,WAAW,GAAG;AACxB;AAEA,SAAgB,iCAA8D;CAC5E,OAAO,OAAO,WAAW,WAAW;AACtC"}
+{"version":3,"file":"context.js","names":[],"sources":["../../../src/components/date-range-picker/context.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 context 相关实现。\n\nimport type { CalendarCellProps, DatePickerTimeUnit, DateRangePickerEndIndex } from '@xihan-ui/headless'\nimport type { ComputedRef, InjectionKey } from 'vue'\nimport type { DateRangePickerContext } from './use-date-range-picker'\nimport { computed, inject, provide } from 'vue'\n\n/** 格子声明的那一天，供 cell-trigger 复用同一份声明（作者只写一次 value）。 */\nexport interface DateRangePickerCellContext {\n  cell: ComputedRef<CalendarCellProps>\n}\n\n/** 分段容器声明的组号，供组内的段位与隐藏输入认领起止两组之一。 */\nexport interface DateRangePickerSegmentGroupContext {\n  /** 0 是起点组，1 是终点组。 */\n  index: ComputedRef<0 | 1>\n}\n\n/** 日历声明的面板号，供面板内的标题、网格与格子认领自己属于并排的第几张。 */\nexport interface DateRangePickerPanelContext {\n  index: ComputedRef<number>\n}\n\n/** 时间组声明的端号，供组内的小标题、时间列与时间项认领起止之一。 */\nexport interface DateRangePickerColumnGroupContext {\n  /** 0 是起点组，1 是终点组。 */\n  index: ComputedRef<DateRangePickerEndIndex>\n}\n\n/** 时间列声明的单位，供列里的时间项认领。 */\nexport interface DateRangePickerTimeColumnContext {\n  unit: ComputedRef<DatePickerTimeUnit>\n}\n\nconst KEY: InjectionKey<DateRangePickerContext> = Symbol.for('xh-date-range-picker')\nconst CELL_KEY: InjectionKey<DateRangePickerCellContext> = Symbol.for('xh-date-range-picker-cell')\nconst SEGMENT_GROUP_KEY: InjectionKey<DateRangePickerSegmentGroupContext> = Symbol.for('xh-date-range-picker-segment-group')\nconst PANEL_KEY: InjectionKey<DateRangePickerPanelContext> = Symbol.for('xh-date-range-picker-panel')\nconst COLUMN_GROUP_KEY: InjectionKey<DateRangePickerColumnGroupContext> = Symbol.for('xh-date-range-picker-column-group')\nconst TIME_COLUMN_KEY: InjectionKey<DateRangePickerTimeColumnContext> = Symbol.for('xh-date-range-picker-time-column')\n\n/** 没有分段容器时的组号，段位与隐藏输入落到起点组。 */\nconst START_GROUP: DateRangePickerSegmentGroupContext = { index: computed<0 | 1>(() => 0) }\n\n/** 日历未声明面板号时的落点，与单面板时一致。 */\nconst FIRST_PANEL: DateRangePickerPanelContext = { index: computed(() => 0) }\n\nexport function provideDateRangePicker(ctx: DateRangePickerContext): void {\n  provide(KEY, ctx)\n}\n\nexport function useDateRangePickerContext(): DateRangePickerContext {\n  const ctx = inject(KEY, null)\n  if (!ctx)\n    throw new Error('[xh] DateRangePicker 部件必须用在 XhDateRangePickerRoot 内')\n  return ctx\n}\n\nexport function provideDateRangePickerCell(ctx: DateRangePickerCellContext): void {\n  provide(CELL_KEY, ctx)\n}\n\nexport function useDateRangePickerCellContext(): DateRangePickerCellContext {\n  const ctx = inject(CELL_KEY, null)\n  if (!ctx)\n    throw new Error('[xh] DateRangePicker 日期触发器必须用在 XhDateRangePickerCell 内')\n  return ctx\n}\n\nexport function provideDateRangePickerSegmentGroup(ctx: DateRangePickerSegmentGroupContext): void {\n  provide(SEGMENT_GROUP_KEY, ctx)\n}\n\nexport function useDateRangePickerSegmentGroupContext(): DateRangePickerSegmentGroupContext {\n  return inject(SEGMENT_GROUP_KEY, START_GROUP)\n}\n\nexport function provideDateRangePickerPanel(ctx: DateRangePickerPanelContext): void {\n  provide(PANEL_KEY, ctx)\n}\n\nexport function useDateRangePickerPanelContext(): DateRangePickerPanelContext {\n  return inject(PANEL_KEY, FIRST_PANEL)\n}\n\nexport function provideDateRangePickerColumnGroup(ctx: DateRangePickerColumnGroupContext): void {\n  provide(COLUMN_GROUP_KEY, ctx)\n}\n\nexport function useDateRangePickerColumnGroupContext(): DateRangePickerColumnGroupContext {\n  const ctx = inject(COLUMN_GROUP_KEY, null)\n  if (!ctx)\n    throw new Error('[xh] DateRangePicker 的时间列与小标题要放在 XhDateRangePickerColumnGroup 里')\n  return ctx\n}\n\nexport function provideDateRangePickerTimeColumn(ctx: DateRangePickerTimeColumnContext): void {\n  provide(TIME_COLUMN_KEY, ctx)\n}\n\nexport function useDateRangePickerTimeColumnContext(): DateRangePickerTimeColumnContext {\n  const ctx = inject(TIME_COLUMN_KEY, null)\n  if (!ctx)\n    throw new Error('[xh] XhDateRangePickerTimeItem 要放在 XhDateRangePickerTimeColumn 里')\n  return ctx\n}\n"],"mappings":";;AAuCA,MAAM,MAA4C,OAAO,IAAI,sBAAsB;AACnF,MAAM,WAAqD,OAAO,IAAI,2BAA2B;AACjG,MAAM,oBAAsE,OAAO,IAAI,oCAAoC;AAC3H,MAAM,YAAuD,OAAO,IAAI,4BAA4B;AACpG,MAAM,mBAAoE,OAAO,IAAI,mCAAmC;AACxH,MAAM,kBAAkE,OAAO,IAAI,kCAAkC;;AAGrH,MAAM,cAAkD,EAAE,OAAO,eAAsB,CAAC,EAAE;;AAG1F,MAAM,cAA2C,EAAE,OAAO,eAAe,CAAC,EAAE;AAE5E,SAAgB,uBAAuB,KAAmC;CACxE,QAAQ,KAAK,GAAG;AAClB;AAEA,SAAgB,4BAAoD;CAClE,MAAM,MAAM,OAAO,KAAK,IAAI;CAC5B,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,qDAAqD;CACvE,OAAO;AACT;AAEA,SAAgB,2BAA2B,KAAuC;CAChF,QAAQ,UAAU,GAAG;AACvB;AAEA,SAAgB,gCAA4D;CAC1E,MAAM,MAAM,OAAO,UAAU,IAAI;CACjC,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,wDAAwD;CAC1E,OAAO;AACT;AAEA,SAAgB,mCAAmC,KAA+C;CAChG,QAAQ,mBAAmB,GAAG;AAChC;AAEA,SAAgB,wCAA4E;CAC1F,OAAO,OAAO,mBAAmB,WAAW;AAC9C;AAEA,SAAgB,4BAA4B,KAAwC;CAClF,QAAQ,WAAW,GAAG;AACxB;AAEA,SAAgB,iCAA8D;CAC5E,OAAO,OAAO,WAAW,WAAW;AACtC;AAEA,SAAgB,kCAAkC,KAA8C;CAC9F,QAAQ,kBAAkB,GAAG;AAC/B;AAEA,SAAgB,uCAA0E;CACxF,MAAM,MAAM,OAAO,kBAAkB,IAAI;CACzC,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,iEAAiE;CACnF,OAAO;AACT;AAEA,SAAgB,iCAAiC,KAA6C;CAC5F,QAAQ,iBAAiB,GAAG;AAC9B;AAEA,SAAgB,sCAAwE;CACtF,MAAM,MAAM,OAAO,iBAAiB,IAAI;CACxC,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,kEAAkE;CACpF,OAAO;AACT"}

package/dist/components/date-range-picker/date-range-picker.d.ts

@@ -1,11 +1,11 @@
 import { PayloadOf } from "../../runtime/payload.js";
+import { CalendarGranularity, CalendarRangePickerApi, CalendarView, DateFieldSegmentState, DatePickerTimeUnit, DateRangePickerApi, DateRangePickerEndIndex, DateRangePickerPreset, DateRangePickerPresetState, DateRangePickerSchema, DateSegmentPlaceholders, DateSegmentSet, DateSegmentType, TimeHourCycle, TimeStep, TimeUnavailablePredicate } from "@xihan-ui/headless";
 import { PropType, SlotsType, VNode } from "vue";
 import { ControlVariant, Direction, Placement, Size, Tone } from "@xihan-ui/core";
-import { CalendarGranularity, CalendarRangePickerApi, CalendarView, DateFieldSegmentState, DateRangePickerApi, DateRangePickerEndIndex, DateRangePickerPreset, DateRangePickerPresetState, DateRangePickerSchema, DateSegmentPlaceholders, DateSegmentSet, DateSegmentType, TimeHourCycle, TimeStep, TimeUnavailablePredicate } from "@xihan-ui/headless";
 //#region src/components/date-range-picker/date-range-picker.d.ts
 type DateRangePickerProps = DateRangePickerSchema['props'];
 /** 默认插槽的载荷：选择器的开合与两端、内嵌范围日历的展示数据、两组段位，以及改写值的句柄。 */
-type DateRangePickerRootSlotProps = Pick<DateRangePickerApi, 'open' | 'value' | 'start' | 'end' | 'periodValue' | 'focusedValue' | 'canClear' | 'setOpen' | 'setValue' | 'clear'> & Pick<CalendarRangePickerApi, 'visibleMonth' | 'panels' | 'periods' | 'weeks' | 'weekDays' | 'headingLabel' | 'canGoPrev' | 'canGoNext'> & {
+type DateRangePickerRootSlotProps = Pick<DateRangePickerApi, 'open' | 'value' | 'start' | 'end' | 'periodValue' | 'focusedValue' | 'canClear' | 'setOpen' | 'setValue' | 'clear'> & Pick<CalendarRangePickerApi, 'visibleMonth' | 'panels' | 'periods' | 'rows' | 'weeks' | 'weekDays' | 'headingLabel' | 'canGoPrev' | 'canGoNext'> & {
   /** 起点组段位。 */
   segments: DateFieldSegmentState[];
   /** 终点组段位。 */
@@ -20,6 +20,14 @@ interface DateRangePickerPresetsSlotProps {
   presets: readonly DateRangePickerPresetState[];
 }
 declare const XhDateRangePickerRoot: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+  /** 不显示出来的名字，写成 aria-label 落在与字段标签同一个部件上；放进字段或渲染了 label 部件时以它们为准。 */
+  ariaLabel: {
+    type: StringConstructor;
+  };
+  /** 标题文字：不写默认插槽时铺带这段文字的 label 部件；需要放置其他内容时改用 label 插槽。 */
+  label: {
+    type: StringConstructor;
+  };
   /** 区间两端 [start, end]；空缺的一端用空串占位。 */
   value: {
     type: PropType<string[]>;
@@ -187,6 +195,14 @@ declare const XhDateRangePickerRoot: import("vue").DefineComponent<import("vue")
   'active-index-change': (_details: PayloadOf<DateRangePickerProps, "onActiveIndexChange">) => true;
   'update:activeIndex': (_index: PayloadOf<DateRangePickerProps, "onActiveIndexChange">["activeIndex"]) => true;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+  /** 不显示出来的名字，写成 aria-label 落在与字段标签同一个部件上；放进字段或渲染了 label 部件时以它们为准。 */
+  ariaLabel: {
+    type: StringConstructor;
+  };
+  /** 标题文字：不写默认插槽时铺带这段文字的 label 部件；需要放置其他内容时改用 label 插槽。 */
+  label: {
+    type: StringConstructor;
+  };
   /** 区间两端 [start, end]；空缺的一端用空串占位。 */
   value: {
     type: PropType<string[]>;
@@ -364,6 +380,8 @@ declare const XhDateRangePickerRoot: import("vue").DefineComponent<import("vue")
   showTime: boolean;
 }, SlotsType<{
   default?: (props: DateRangePickerRootSlotProps) => VNode[];
+  /** 不写默认插槽时标题的内容，盖过 label 文字。 */
+  label?: () => VNode[];
 }>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const XhDateRangePickerLabel: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
   [key: string]: any;
@@ -473,6 +491,78 @@ declare const XhDateRangePickerPreset: import("vue").DefineComponent<import("vue
   /** 条目内容；未写时使用数据中的 label。 */
   default?: () => VNode[];
 }>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/** 一格时间选项：value 写两位补零的值（上下午列写 '00' / '01'）；没写内容时显示按 locale 译好的文字。要放在 XhDateRangePickerTimeColumn 里。 */
+declare const XhDateRangePickerTimeItem: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+  /** 这一格的值，与时间列的可选值逐字对应。 */
+  value: {
+    type: StringConstructor;
+    required: true;
+  };
+}>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+  /** 这一格的值，与时间列的可选值逐字对应。 */
+  value: {
+    type: StringConstructor;
+    required: true;
+  };
+}>> & Readonly<{}>, {}, SlotsType<{
+  /** 格里的内容；未写时显示按 locale 译好的文字。 */
+  default?: () => VNode[];
+}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/**
+ * 一端的一列时间选项连同贴在它盒子上的竖条：每列一台滚动条机器。端号取所在的 XhDateRangePickerColumnGroup；
+ * 不写默认插槽时按这一列的可选值铺 XhDateRangePickerTimeItem；这一单位不在当前精度里（如没开秒）时整列不渲染。
+ */
+declare const XhDateRangePickerTimeColumn: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+  /** 这一列的单位：hour、minute、second 或 dayPeriod。 */
+  unit: {
+    type: PropType<DatePickerTimeUnit>;
+    required: true;
+  };
+}>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>[] | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+  /** 这一列的单位：hour、minute、second 或 dayPeriod。 */
+  unit: {
+    type: PropType<DatePickerTimeUnit>;
+    required: true;
+  };
+}>> & Readonly<{}>, {}, SlotsType<{
+  /** 自行铺 XhDateRangePickerTimeItem；未写时按这一列的可选值自动铺。 */
+  default?: () => VNode[];
+}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/** 时间组顶部的小标题，纯视觉：没写内容时显示 translations.startTime / endTime。要放在 XhDateRangePickerColumnGroup 里。 */
+declare const XhDateRangePickerColumnGroupLabel: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, SlotsType<{
+  /** 小标题的内容；未写时显示这一端的名字。 */
+  default?: () => VNode[];
+}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/**
+ * 一端的时间组外壳（role=group）：index 写 0 起点、1 终点。不写默认插槽时铺小标题与这一端的各列；
+ * 没开 showTime 时连接层写 hidden。
+ */
+declare const XhDateRangePickerColumnGroup: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+  /** 0 起点、1 终点，兼收字符串以支持模板里写 index="1"。 */
+  index: {
+    type: PropType<number | string>;
+    default: number;
+  };
+}>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+  /** 0 起点、1 终点，兼收字符串以支持模板里写 index="1"。 */
+  index: {
+    type: PropType<number | string>;
+    default: number;
+  };
+}>> & Readonly<{}>, {
+  index: string | number;
+}, SlotsType<{
+  /** 自行铺小标题与各列；未写时按这一端的列自动铺。 */
+  default?: () => VNode[];
+}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const XhDateRangePickerTimePanel: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
   [key: string]: any;
 }>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -630,5 +720,5 @@ declare const XhDateRangePickerHiddenInput: import("vue").DefineComponent<import
   };
 }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 //#endregion
-export { DateRangePickerPresetsSlotProps, DateRangePickerRootSlotProps, DateRangePickerSegmentSlotProps, XhDateRangePickerCalendar, XhDateRangePickerCell, XhDateRangePickerCellTrigger, XhDateRangePickerClearTrigger, XhDateRangePickerConfirmTrigger, XhDateRangePickerContent, XhDateRangePickerControl, XhDateRangePickerFooter, XhDateRangePickerGrid, XhDateRangePickerGridBody, XhDateRangePickerGridHead, XhDateRangePickerHeader, XhDateRangePickerHeading, XhDateRangePickerHeadingMonthTrigger, XhDateRangePickerHeadingYearTrigger, XhDateRangePickerHiddenInput, XhDateRangePickerLabel, XhDateRangePickerNextTrigger, XhDateRangePickerNextYearTrigger, XhDateRangePickerPositioner, XhDateRangePickerPreset, XhDateRangePickerPresetGroup, XhDateRangePickerPrevTrigger, XhDateRangePickerPrevYearTrigger, XhDateRangePickerRangeSeparator, XhDateRangePickerRoot, XhDateRangePickerSegment, XhDateRangePickerSegmentGroup, XhDateRangePickerTimePanel, XhDateRangePickerTrigger, XhDateRangePickerWeekDay, XhDateRangePickerWeekNumber, XhDateRangePickerWeekRow };
+export { DateRangePickerPresetsSlotProps, DateRangePickerRootSlotProps, DateRangePickerSegmentSlotProps, XhDateRangePickerCalendar, XhDateRangePickerCell, XhDateRangePickerCellTrigger, XhDateRangePickerClearTrigger, XhDateRangePickerColumnGroup, XhDateRangePickerColumnGroupLabel, XhDateRangePickerConfirmTrigger, XhDateRangePickerContent, XhDateRangePickerControl, XhDateRangePickerFooter, XhDateRangePickerGrid, XhDateRangePickerGridBody, XhDateRangePickerGridHead, XhDateRangePickerHeader, XhDateRangePickerHeading, XhDateRangePickerHeadingMonthTrigger, XhDateRangePickerHeadingYearTrigger, XhDateRangePickerHiddenInput, XhDateRangePickerLabel, XhDateRangePickerNextTrigger, XhDateRangePickerNextYearTrigger, XhDateRangePickerPositioner, XhDateRangePickerPreset, XhDateRangePickerPresetGroup, XhDateRangePickerPrevTrigger, XhDateRangePickerPrevYearTrigger, XhDateRangePickerRangeSeparator, XhDateRangePickerRoot, XhDateRangePickerSegment, XhDateRangePickerSegmentGroup, XhDateRangePickerTimeColumn, XhDateRangePickerTimeItem, XhDateRangePickerTimePanel, XhDateRangePickerTrigger, XhDateRangePickerWeekDay, XhDateRangePickerWeekNumber, XhDateRangePickerWeekRow };
 //# sourceMappingURL=date-range-picker.d.ts.map

package/dist/components/date-range-picker/date-range-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-range-picker.d.ts","names":[],"sources":["../../../src/components/date-range-picker/date-range-picker.ts"],"mappings":"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"}
+{"version":3,"file":"date-range-picker.d.ts","names":[],"sources":["../../../src/components/date-range-picker/date-range-picker.ts"],"mappings":"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"}

package/dist/components/date-range-picker/date-range-picker.js

@@ -1,14 +1,15 @@
+import { renderStructure } from "../../runtime/structure.js";
 import { withXhConfig } from "../../config/config.js";
 import { XhPortal } from "../../runtime/portal.js";
 import { slotPaints } from "../../runtime/slot-content.js";
 import { useScrollbars } from "../../runtime/use-scrollbars.js";
 import { withHandlers } from "../../runtime/with-handlers.js";
 import { useFormControlProps } from "../form/use-form-control.js";
-import { useFieldLabelWiring, useFieldStateWiring } from "../field/use-field-control.js";
-import { provideDateRangePicker, provideDateRangePickerCell, provideDateRangePickerPanel, provideDateRangePickerSegmentGroup, useDateRangePickerCellContext, useDateRangePickerContext, useDateRangePickerPanelContext, useDateRangePickerSegmentGroupContext } from "./context.js";
+import { useFieldGroupWiring, useFieldLabelWiring } from "../field/use-field-control.js";
+import { provideDateRangePicker, provideDateRangePickerCell, provideDateRangePickerColumnGroup, provideDateRangePickerPanel, provideDateRangePickerSegmentGroup, provideDateRangePickerTimeColumn, useDateRangePickerCellContext, useDateRangePickerColumnGroupContext, useDateRangePickerContext, useDateRangePickerPanelContext, useDateRangePickerSegmentGroupContext, useDateRangePickerTimeColumnContext } from "./context.js";
 import { useDateRangePickerWithRoot } from "./use-date-range-picker.js";
-import { computed, defineComponent, h, mergeProps, onUpdated, ref } from "vue";
-import { dateRangePickerFieldAt, resolveDateRangePickerFieldIndex, resolveDateRangePickerPanelIndex } from "@xihan-ui/headless";
+import { dateRangePickerFieldAt, dateRangePickerStructure, resolveDateRangePickerFieldIndex, resolveDateRangePickerPanelIndex } from "@xihan-ui/headless";
+import { computed, defineComponent, h, mergeProps, onUnmounted, onUpdated, ref } from "vue";
 //#region src/components/date-range-picker/date-range-picker.ts
 /**
 * 部件属于并排的第几张面板：自己写了即按自己写的，未写时跟随所在的日历。
@@ -21,6 +22,10 @@ function usePanelIndex(props) {
 const XhDateRangePickerRoot = defineComponent({
 	name: "XhDateRangePickerRoot",
 	props: {
+		/** 不显示出来的名字，写成 aria-label 落在与字段标签同一个部件上；放进字段或渲染了 label 部件时以它们为准。 */
+		ariaLabel: { type: String },
+		/** 标题文字：不写默认插槽时铺带这段文字的 label 部件；需要放置其他内容时改用 label 插槽。 */
+		label: { type: String },
 		/** 区间两端 [start, end]；空缺的一端用空串占位。 */
 		value: { type: Array },
 		defaultValue: { type: Array },
@@ -154,7 +159,7 @@ const XhDateRangePickerRoot = defineComponent({
 		return () => h("div", {
 			...ctx.api.value.getRootProps(),
 			ref: rootRef
-		}, slots.default?.({
+		}, !slots.default ? renderDefaultStructure(ctx.api.value, props.label, slots.label) : slots.default({
 			open: ctx.api.value.open,
 			value: ctx.api.value.value,
 			start: ctx.api.value.start,
@@ -164,6 +169,7 @@ const XhDateRangePickerRoot = defineComponent({
 			visibleMonth: ctx.api.value.calendar.visibleMonth,
 			panels: ctx.api.value.calendar.panels,
 			periods: ctx.api.value.calendar.periods,
+			rows: ctx.api.value.calendar.rows,
 			weeks: ctx.api.value.calendar.weeks,
 			weekDays: ctx.api.value.calendar.weekDays,
 			headingLabel: ctx.api.value.calendar.headingLabel,
@@ -182,6 +188,10 @@ const XhDateRangePickerLabel = defineComponent({
 	name: "XhDateRangePickerLabel",
 	setup(_, { slots }) {
 		const ctx = useDateRangePickerContext();
+		ctx.labelCount.value++;
+		onUnmounted(() => {
+			ctx.labelCount.value--;
+		});
 		return () => h("span", ctx.api.value.getLabelProps(), slots.default?.());
 	}
 });
@@ -246,7 +256,7 @@ const XhDateRangePickerClearTrigger = defineComponent({
 const XhDateRangePickerTrigger = defineComponent({
 	name: "XhDateRangePickerTrigger",
 	setup(_, { slots }) {
-		const fieldWiring = useFieldStateWiring();
+		const fieldWiring = useFieldGroupWiring();
 		const fieldLabel = useFieldLabelWiring();
 		const ctx = useDateRangePickerContext();
 		return () => h("button", fieldLabel.value({
@@ -365,21 +375,52 @@ value: {
 		};
 	}
 });
-/** 一列时间选项连同贴在它盒子上的竖条：每列一台滚动条机器，列数随精度与小时制变时组件实例跟着增减。 */
-const XhDateRangePickerTimeColumnHost = defineComponent({
-	name: "XhDateRangePickerTimeColumnHost",
-	props: {
-		index: {
-			type: Number,
-			required: true
-		},
-		unit: {
-			type: String,
-			required: true
-		}
-	},
-	setup(props) {
+/** 一格时间选项：value 写两位补零的值（上下午列写 '00' / '01'）；没写内容时显示按 locale 译好的文字。要放在 XhDateRangePickerTimeColumn 里。 */
+const XhDateRangePickerTimeItem = defineComponent({
+	name: "XhDateRangePickerTimeItem",
+	props: { 
+	/** 这一格的值，与时间列的可选值逐字对应。 */
+value: {
+		type: String,
+		required: true
+	} },
+	slots: Object,
+	setup(props, { slots }) {
+		const ctx = useDateRangePickerContext();
+		const group = useDateRangePickerColumnGroupContext();
+		const column = useDateRangePickerTimeColumnContext();
+		return () => {
+			const api = ctx.api.value;
+			const item = {
+				index: group.index.value,
+				unit: column.unit.value,
+				value: props.value
+			};
+			const authored = slots.default?.();
+			return h("div", api.getTimeItemProps(item), slotPaints(authored) ? authored : api.getTimeItemText({
+				unit: item.unit,
+				value: item.value
+			}));
+		};
+	}
+});
+/**
+* 一端的一列时间选项连同贴在它盒子上的竖条：每列一台滚动条机器。端号取所在的 XhDateRangePickerColumnGroup；
+* 不写默认插槽时按这一列的可选值铺 XhDateRangePickerTimeItem；这一单位不在当前精度里（如没开秒）时整列不渲染。
+*/
+const XhDateRangePickerTimeColumn = defineComponent({
+	name: "XhDateRangePickerTimeColumn",
+	props: { 
+	/** 这一列的单位：hour、minute、second 或 dayPeriod。 */
+unit: {
+		type: String,
+		required: true
+	} },
+	slots: Object,
+	setup(props, { slots }) {
 		const ctx = useDateRangePickerContext();
+		const group = useDateRangePickerColumnGroupContext();
+		provideDateRangePickerTimeColumn({ unit: computed(() => props.unit) });
 		const timeColumnRef = ref(null);
 		const bars = useScrollbars({
 			scrollable: () => timeColumnRef.value,
@@ -392,27 +433,60 @@ const XhDateRangePickerTimeColumnHost = defineComponent({
 		onUpdated(() => bars.measure());
 		return () => {
 			const api = ctx.api.value;
-			const column = api.timeColumnGroups[props.index].columns.find((item) => item.unit === props.unit);
+			const column = api.timeColumnGroups[group.index.value].columns.find((item) => item.unit === props.unit);
 			if (!column) return null;
 			return [h("div", {
 				...api.getTimeColumnProps({
-					index: props.index,
+					index: group.index.value,
 					unit: column.unit
 				}),
 				ref: (el) => {
 					timeColumnRef.value = el;
 				}
-			}, column.options.map((option) => h("div", {
-				...api.getTimeItemProps({
-					index: props.index,
-					unit: column.unit,
-					value: option
-				}),
-				key: option
-			}, api.getTimeItemText({
-				unit: column.unit,
+			}, slots.default?.() ?? column.options.map((option) => h(XhDateRangePickerTimeItem, {
+				key: option,
 				value: option
-			})))), ...bars.render()];
+			}))), ...bars.render()];
+		};
+	}
+});
+/** 时间组顶部的小标题，纯视觉：没写内容时显示 translations.startTime / endTime。要放在 XhDateRangePickerColumnGroup 里。 */
+const XhDateRangePickerColumnGroupLabel = defineComponent({
+	name: "XhDateRangePickerColumnGroupLabel",
+	slots: Object,
+	setup(_, { slots }) {
+		const ctx = useDateRangePickerContext();
+		const group = useDateRangePickerColumnGroupContext();
+		return () => {
+			const api = ctx.api.value;
+			const authored = slots.default?.();
+			return h("div", api.getColumnGroupLabelProps({ index: group.index.value }), slotPaints(authored) ? authored : api.timeColumnGroups[group.index.value].label);
+		};
+	}
+});
+/**
+* 一端的时间组外壳（role=group）：index 写 0 起点、1 终点。不写默认插槽时铺小标题与这一端的各列；
+* 没开 showTime 时连接层写 hidden。
+*/
+const XhDateRangePickerColumnGroup = defineComponent({
+	name: "XhDateRangePickerColumnGroup",
+	props: { 
+	/** 0 起点、1 终点，兼收字符串以支持模板里写 index="1"。 */
+index: {
+		type: [Number, String],
+		default: 0
+	} },
+	slots: Object,
+	setup(props, { slots }) {
+		const ctx = useDateRangePickerContext();
+		const index = computed(() => resolveDateRangePickerFieldIndex(props.index));
+		provideDateRangePickerColumnGroup({ index });
+		return () => {
+			const api = ctx.api.value;
+			return h("div", api.getColumnGroupProps({ index: index.value }), slots.default?.() ?? [h(XhDateRangePickerColumnGroupLabel), ...api.timeColumnGroups[index.value].columns.map((column) => h(XhDateRangePickerTimeColumn, {
+				unit: column.unit,
+				key: column.unit
+			}))]);
 		};
 	}
 });
@@ -420,14 +494,10 @@ const XhDateRangePickerTimePanel = defineComponent({
 	name: "XhDateRangePickerTimePanel",
 	setup() {
 		const ctx = useDateRangePickerContext();
-		return () => ctx.api.value.timeColumnGroups.map((group) => h("div", {
-			...ctx.api.value.getColumnGroupProps({ index: group.index }),
-			key: group.index
-		}, [h("div", ctx.api.value.getColumnGroupLabelProps({ index: group.index }), group.label), ...group.columns.map((column) => h(XhDateRangePickerTimeColumnHost, {
+		return () => ctx.api.value.timeColumnGroups.map((group) => h(XhDateRangePickerColumnGroup, {
 			index: group.index,
-			unit: column.unit,
-			key: column.unit
-		}))]));
+			key: group.index
+		}));
 	}
 });
 const XhDateRangePickerConfirmTrigger = defineComponent({
@@ -617,7 +687,54 @@ const XhDateRangePickerHiddenInput = defineComponent({
 		};
 	}
 });
+/** 结构里的部件 → 部件组件；委派出去的部件按「组件名/部件名」查。 */
+const DATE_RANGE_PICKER_PARTS = {
+	"label": XhDateRangePickerLabel,
+	"control": XhDateRangePickerControl,
+	"segment-group": XhDateRangePickerSegmentGroup,
+	"range-separator": XhDateRangePickerRangeSeparator,
+	"trigger": XhDateRangePickerTrigger,
+	"clear-trigger": XhDateRangePickerClearTrigger,
+	"positioner": XhDateRangePickerPositioner,
+	"content": XhDateRangePickerContent,
+	"preset-group": XhDateRangePickerPresetGroup,
+	"preset": XhDateRangePickerPreset,
+	"calendar": XhDateRangePickerCalendar,
+	"column-group": XhDateRangePickerColumnGroup,
+	"column-group-label": XhDateRangePickerColumnGroupLabel,
+	"time-column": XhDateRangePickerTimeColumn,
+	"time-item": XhDateRangePickerTimeItem,
+	"footer": XhDateRangePickerFooter,
+	"confirm-trigger": XhDateRangePickerConfirmTrigger,
+	"date-field/segment": XhDateRangePickerSegment,
+	"date-field/hidden-input": XhDateRangePickerHiddenInput,
+	"calendar-range-picker/header": XhDateRangePickerHeader,
+	"calendar-range-picker/prev-year-trigger": XhDateRangePickerPrevYearTrigger,
+	"calendar-range-picker/prev-trigger": XhDateRangePickerPrevTrigger,
+	"calendar-range-picker/heading": XhDateRangePickerHeading,
+	"calendar-range-picker/heading-year-trigger": XhDateRangePickerHeadingYearTrigger,
+	"calendar-range-picker/heading-month-trigger": XhDateRangePickerHeadingMonthTrigger,
+	"calendar-range-picker/next-trigger": XhDateRangePickerNextTrigger,
+	"calendar-range-picker/next-year-trigger": XhDateRangePickerNextYearTrigger,
+	"calendar-range-picker/grid": XhDateRangePickerGrid,
+	"calendar-range-picker/grid-head": XhDateRangePickerGridHead,
+	"calendar-range-picker/week-row": XhDateRangePickerWeekRow,
+	"calendar-range-picker/week-day": XhDateRangePickerWeekDay,
+	"calendar-range-picker/grid-body": XhDateRangePickerGridBody,
+	"calendar-range-picker/cell": XhDateRangePickerCell,
+	"calendar-range-picker/cell-trigger": XhDateRangePickerCellTrigger
+};
+/**
+* 未写默认插槽时照 dateRangePickerStructure 铺开的整套结构，与 Web Components 不写部件时元素生成的节点出自同一份。
+* 标题文字由 label 给出，需要放置其他内容时由 label 插槽接管。
+*/
+function renderDefaultStructure(api, label, labelSlot) {
+	return renderStructure(dateRangePickerStructure(api, {
+		label,
+		slotted: (name) => name === "label" && labelSlot != null
+	}), DATE_RANGE_PICKER_PARTS, (node) => node.slot?.name === "label" ? labelSlot?.() : void 0);
+}
 //#endregion
-export { XhDateRangePickerCalendar, XhDateRangePickerCell, XhDateRangePickerCellTrigger, XhDateRangePickerClearTrigger, XhDateRangePickerConfirmTrigger, XhDateRangePickerContent, XhDateRangePickerControl, XhDateRangePickerFooter, XhDateRangePickerGrid, XhDateRangePickerGridBody, XhDateRangePickerGridHead, XhDateRangePickerHeader, XhDateRangePickerHeading, XhDateRangePickerHeadingMonthTrigger, XhDateRangePickerHeadingYearTrigger, XhDateRangePickerHiddenInput, XhDateRangePickerLabel, XhDateRangePickerNextTrigger, XhDateRangePickerNextYearTrigger, XhDateRangePickerPositioner, XhDateRangePickerPreset, XhDateRangePickerPresetGroup, XhDateRangePickerPrevTrigger, XhDateRangePickerPrevYearTrigger, XhDateRangePickerRangeSeparator, XhDateRangePickerRoot, XhDateRangePickerSegment, XhDateRangePickerSegmentGroup, XhDateRangePickerTimePanel, XhDateRangePickerTrigger, XhDateRangePickerWeekDay, XhDateRangePickerWeekNumber, XhDateRangePickerWeekRow };
+export { XhDateRangePickerCalendar, XhDateRangePickerCell, XhDateRangePickerCellTrigger, XhDateRangePickerClearTrigger, XhDateRangePickerColumnGroup, XhDateRangePickerColumnGroupLabel, XhDateRangePickerConfirmTrigger, XhDateRangePickerContent, XhDateRangePickerControl, XhDateRangePickerFooter, XhDateRangePickerGrid, XhDateRangePickerGridBody, XhDateRangePickerGridHead, XhDateRangePickerHeader, XhDateRangePickerHeading, XhDateRangePickerHeadingMonthTrigger, XhDateRangePickerHeadingYearTrigger, XhDateRangePickerHiddenInput, XhDateRangePickerLabel, XhDateRangePickerNextTrigger, XhDateRangePickerNextYearTrigger, XhDateRangePickerPositioner, XhDateRangePickerPreset, XhDateRangePickerPresetGroup, XhDateRangePickerPrevTrigger, XhDateRangePickerPrevYearTrigger, XhDateRangePickerRangeSeparator, XhDateRangePickerRoot, XhDateRangePickerSegment, XhDateRangePickerSegmentGroup, XhDateRangePickerTimeColumn, XhDateRangePickerTimeItem, XhDateRangePickerTimePanel, XhDateRangePickerTrigger, XhDateRangePickerWeekDay, XhDateRangePickerWeekNumber, XhDateRangePickerWeekRow };
 
 //# sourceMappingURL=date-range-picker.js.map