@xihan-ui/vue 3.1.0 → 3.2.0

package/dist/services/dialog-service.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-service.js","names":[],"sources":["../../src/services/dialog-service.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// 全局命令式确认框服务：confirm/info/success/warning/error 一次调用弹出，\n// 自带标题徽记、正文与按钮行。同一时刻只挂一个对话框，后来的排队顺次弹出，\n// 避开多层模态叠加。onOk 返回 Promise 时确认钮自动进入 pending 并拦住关闭，\n// 失败保持打开以便重试或取消。\nimport type { Tone } from '@xihan-ui/core'\nimport type { DialogServiceBadge, DialogServiceControllerSpec, DialogServiceControllerState } from '@xihan-ui/headless'\nimport type { App, MaybeRefOrGetter, VNodeChild } from 'vue'\nimport type { XhConfig } from '../config/config'\nimport { ensurePortalRoot } from '@xihan-ui/core'\nimport { createDialogServiceController, dialogServiceBadgeTone } from '@xihan-ui/headless'\nimport { createApp, defineComponent, h, reactive, shallowRef, toRaw, toValue } from 'vue'\nimport { XhButton, XhButtonIndicator, XhButtonLabel } from '../components/button'\nimport { XhDialogBody, XhDialogContent, XhDialogDescription, XhDialogFooter, XhDialogHeader, XhDialogIndicator, XhDialogRoot, XhDialogTitle } from '../components/dialog/dialog'\nimport { spinArc } from './glyph'\nimport { createServiceConfig } from './service-config'\n\n/**\n * 对话框正文。传字符串时经 description 部件（读屏的 aria-describedby 由它承接）；\n * 传渲染函数时整块展开在正文位，自行决定渲染内容。\n *\n * 不接收裸 VNode：服务的宿主是常驻的，忙态切换即整棵重渲，\n * 同一个 VNode 实例被复用时的行为未定义。\n */\nexport type DialogBody = string | (() => VNodeChild)\n\n/** 动作异常保留原始原因；可见文案由 actionErrorText 提供。 */\nexport interface DialogActionError {\n  cause: unknown\n}\n\nexport interface ConfirmOptions {\n  title: string\n  content?: DialogBody\n  /** 确认按钮语气，默认 brand；危险操作传 danger。 */\n  tone?: Tone\n  /** 标题旁的类型徽记。未提供时不显示徽记。 */\n  badge?: DialogServiceBadge\n  okText?: MaybeRefOrGetter<string>\n  cancelText?: MaybeRefOrGetter<string>\n  /** false 阻止关闭；抛错或 Promise 拒绝进入 actionError，保持打开。 */\n  onOk?: () => boolean | void | Promise<unknown>\n  /** 动作失败通知；通知自身失败时拒绝所属请求。 */\n  onActionError?: (error: DialogActionError) => void | Promise<void>\n}\n\n/** 单按钮告知框的入参：没有取消按钮，徽记由预设档决定，其余同 confirm。 */\nexport type AlertOptions = Omit<ConfirmOptions, 'tone' | 'badge'>\n\n/** 取值型弹窗的入参。正文自行拼装表单，确认时把该份值带回。 */\nexport interface PromptOptions<T extends object> extends Omit<ConfirmOptions, 'onOk' | 'content'> {\n  /** 每次打开建立一份初值；服务用 reactive 包装后交给 body 与 onOk，两边是同一份。 */\n  initialValue: T\n  /** 用该份可写代理渲染表单主体。 */\n  body: (value: T) => VNodeChild\n  /** 落焦到哪个节点，CSS 选择器。 */\n  initialFocus?: string\n  /** false 只阻止关闭；抛错或拒绝进入独立动作异常，弹窗保持打开。 */\n  onOk?: (value: T) => boolean | void | Promise<boolean | void>\n}\n\nexport interface DialogServiceOptions {\n  /** 确认按钮文案，默认 OK。 */\n  okText?: MaybeRefOrGetter<string>\n  /** 取消按钮文案，默认 Cancel。 */\n  cancelText?: MaybeRefOrGetter<string>\n  /** 动作失败时的安全提示，支持与按钮文案相同的响应式来源。 */\n  actionErrorText?: MaybeRefOrGetter<string>\n  /**\n   * 提供给对话框子树的全局配置（locale / translations / size / portalContainer）。\n   * 本服务自带宿主应用，无法接收组件树中的 provideXhConfig，需要与应用同语言时从这里提供；\n   * 传 ref/getter 即可在运行期跟随切换语言，也可以之后用 setConfig 推送。\n   */\n  config?: MaybeRefOrGetter<XhConfig>\n  /** 宿主容器；未提供时在 body 下新建一个。 */\n  target?: HTMLElement\n}\n\nexport interface DialogService {\n  /** 当前请求的动作异常，重试、关闭和切换请求时清空。 */\n  readonly actionError: DialogActionError | null\n  /** 确认经 onOk 后 resolve true；取消/Esc resolve false。 */\n  confirm: (options: ConfirmOptions) => Promise<boolean>\n  info: (options: AlertOptions) => Promise<void>\n  success: (options: AlertOptions) => Promise<void>\n  warning: (options: AlertOptions) => Promise<void>\n  error: (options: AlertOptions) => Promise<void>\n  /** 确认后 resolve 一份值的普通对象快照；取消 / Esc / 卸载 resolve null。 */\n  prompt: <T extends object>(options: PromptOptions<T>) => Promise<T | null>\n  /** 更换全局配置源。 */\n  setConfig: (next: MaybeRefOrGetter<XhConfig> | undefined) => void\n  /** 卸载宿主应用并移除容器。 */\n  dispose: () => void\n}\n\ninterface Spec extends DialogServiceControllerSpec {\n  title: string\n  content?: DialogBody\n  tone: Tone\n  okText: MaybeRefOrGetter<string>\n  cancelText: MaybeRefOrGetter<string>\n  showCancel: boolean\n  /** 标题旁的类型徽记（预设档使用），confirm 不带。 */\n  badge?: DialogServiceBadge\n  /** 返回 false 阻止本次确认；异常由独立错误状态报告。 */\n  onOk?: () => unknown\n  onActionError?: (error: DialogActionError) => void | Promise<void>\n  /** 取值型弹窗的正文与可写的值，两边是同一个对象。 */\n  body?: (value: object) => VNodeChild\n  value?: object\n  initialFocus?: string\n}\n\nexport function createDialogService(options: DialogServiceOptions = {}): DialogService {\n  if (typeof document === 'undefined')\n    throw new Error('createDialogService 需要 document；SSR 里请等到客户端再创建')\n\n  // 文案不在创建时求值：队列里的对话框会跨过一次切语言\n  const defaults = { okText: options.okText ?? 'OK', cancelText: options.cancelText ?? 'Cancel' }\n  const configSource = createServiceConfig(options.config)\n  const holder = options.target ?? document.createElement('div')\n  let hostFailure: { cause: unknown } | null = null\n  try {\n    if (!options.target)\n      ensurePortalRoot(document).appendChild(holder)\n    if (holder.nodeType !== 1 || holder.ownerDocument !== document || !holder.isConnected)\n      throw new Error('DialogService target 必须是当前文档中已连接的元素')\n  }\n  catch (cause) {\n    hostFailure = { cause }\n  }\n\n  // 整份核心快照放 shallowRef：Spec 里的 MaybeRefOrGetter 不能被 reactive 深层解包。\n  let publishState: (next: DialogServiceControllerState<Spec>) => void = () => {}\n  const controller = createDialogServiceController<Spec>({\n    onStateChange: next => publishState(next),\n  })\n  const state = shallowRef(controller.state)\n  publishState = next => void (state.value = next)\n  if (hostFailure)\n    controller.fail(hostFailure.cause)\n\n  // 机器侧的关闭（Esc 等）从这里回来：未定的一律按取消结\n  function onOpenChange(open: boolean): void {\n    if (open)\n      return\n    controller.close(false)\n  }\n\n  const Host = defineComponent({\n    name: 'XhDialogServiceHost',\n    setup() {\n      configSource.provide()\n      return () => {\n        const serviceState = state.value\n        if (serviceState.failure)\n          return null\n        const request = serviceState.current\n        const spec = request?.spec\n        return h(XhDialogRoot, {\n          'open': serviceState.open,\n          'onUpdate:open': onOpenChange,\n          'modal': true,\n          'role': 'alertdialog',\n          'closeOnEscape': !serviceState.busy,\n          'closeOnInteractOutside': false,\n          'initialFocus': spec?.initialFocus,\n          'onExitComplete': () => controller.finishExit(request),\n        }, () => spec\n          ? h(XhDialogContent, null, () => [\n              h(XhDialogHeader, null, () => [\n                spec.badge ? h(XhDialogIndicator, { 'data-tone': dialogServiceBadgeTone(spec.badge) }) : null,\n                h(XhDialogTitle, () => spec.title),\n              ]),\n              h(XhDialogBody, null, () => [\n                // 串走 description，函数正文与 prompt 表单也在唯一滚动区内。\n                typeof spec.content === 'string'\n                  ? h(XhDialogDescription, () => spec.content as string)\n                  : typeof spec.content === 'function' ? spec.content() : null,\n                spec.body && spec.value ? spec.body(spec.value) : null,\n                serviceState.actionError ? h('p', { role: 'alert', style: { color: 'var(--xh-fg-danger)' } }, toValue(options.actionErrorText) ?? 'Action failed. Please try again.') : null,\n              ]),\n              h(XhDialogFooter, null, () => [\n                spec.showCancel\n                  ? h(XhButton, { variant: 'ghost', disabled: serviceState.busy, onClick: () => controller.close(false) }, () => toValue(spec.cancelText))\n                  : null,\n                h(XhButton, { variant: 'solid', tone: spec.tone, loading: serviceState.busy, onClick: controller.confirmCurrent }, () => [\n                  serviceState.busy ? h(XhButtonIndicator, () => spinArc()) : null,\n                  h(XhButtonLabel, () => (serviceState.busy ? `${toValue(spec.okText)}…` : toValue(spec.okText))),\n                ]),\n              ]),\n            ])\n          : null)\n      }\n    },\n  })\n\n  const app: App = createApp(Host)\n  let mounted = false\n  function failHost(cause: unknown): void {\n    controller.fail(cause)\n  }\n  app.config.errorHandler = failHost\n  if (!hostFailure) {\n    try {\n      app.mount(holder)\n      mounted = true\n    }\n    catch (cause) {\n      failHost(cause)\n    }\n  }\n\n  const alert = (badge: DialogServiceBadge, tone: Tone) => async (opts: AlertOptions): Promise<void> => {\n    await controller.request({\n      title: opts.title,\n      content: opts.content,\n      tone,\n      okText: opts.okText ?? defaults.okText,\n      cancelText: defaults.cancelText,\n      showCancel: false,\n      badge,\n      onOk: opts.onOk,\n      onActionError: opts.onActionError,\n    })\n  }\n\n  return {\n    get actionError() { return controller.state.actionError },\n    confirm: opts => controller.request({\n      title: opts.title,\n      content: opts.content,\n      tone: opts.tone ?? 'brand',\n      okText: opts.okText ?? defaults.okText,\n      cancelText: opts.cancelText ?? defaults.cancelText,\n      showCancel: true,\n      badge: opts.badge,\n      onOk: opts.onOk,\n      onActionError: opts.onActionError,\n    }),\n    prompt: <T extends object>(opts: PromptOptions<T>): Promise<T | null> => {\n      // body 与 onOk 拿的是同一份可写代理：正文里改了什么，确认时就读到什么\n      const value = reactive({ ...opts.initialValue }) as T\n      return controller.request({\n        title: opts.title,\n        tone: opts.tone ?? 'brand',\n        okText: opts.okText ?? defaults.okText,\n        cancelText: opts.cancelText ?? defaults.cancelText,\n        showCancel: true,\n        badge: opts.badge,\n        initialFocus: opts.initialFocus,\n        body: v => opts.body(v as T),\n        value,\n        onOk: opts.onOk ? () => opts.onOk!(value) : undefined,\n        onActionError: opts.onActionError,\n      }).then(ok => (ok ? { ...toRaw(value) } as T : null))\n    },\n    info: alert('info', 'info'),\n    success: alert('success', 'success'),\n    warning: alert('warning', 'warning'),\n    error: alert('error', 'danger'),\n    setConfig: next => configSource.set(next),\n    dispose: () => {\n      controller.dispose()\n      if (mounted)\n        app.unmount()\n      if (!options.target)\n        holder.remove()\n    },\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"dialog-service.js","names":[],"sources":["../../src/services/dialog-service.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// 全局命令式确认框服务：confirm/info/success/warning/error 一次调用弹出，\n// 自带标题徽记、正文与按钮行。同一时刻只挂一个对话框，后来的排队顺次弹出，\n// 避开多层模态叠加。onOk 返回 Promise 时确认钮自动进入 pending 并拦住关闭，\n// 失败保持打开以便重试或取消。\nimport type { Tone } from '@xihan-ui/core'\nimport type { DialogServiceBadge, DialogServiceControllerSpec, DialogServiceControllerState } from '@xihan-ui/headless'\nimport type { App, MaybeRefOrGetter, VNodeChild } from 'vue'\nimport type { XhConfig } from '../config/config'\nimport { ensurePortalRoot } from '@xihan-ui/core'\nimport { createDialogServiceController, dialogServiceBadgeTone, dialogServiceTranslations } from '@xihan-ui/headless'\nimport { createApp, defineComponent, h, reactive, shallowRef, toRaw, toValue } from 'vue'\nimport { XhButton, XhButtonIndicator, XhButtonLabel } from '../components/button'\nimport { XhDialogBody, XhDialogContent, XhDialogDescription, XhDialogFooter, XhDialogHeader, XhDialogIndicator, XhDialogRoot, XhDialogTitle } from '../components/dialog/dialog'\nimport { spinArc } from './glyph'\nimport { createServiceConfig } from './service-config'\n\n/**\n * 对话框正文。传字符串时经 description 部件（读屏的 aria-describedby 由它承接）；\n * 传渲染函数时整块展开在正文位，自行决定渲染内容。\n *\n * 不接收裸 VNode：服务的宿主是常驻的，忙态切换即整棵重渲，\n * 同一个 VNode 实例被复用时的行为未定义。\n */\nexport type DialogBody = string | (() => VNodeChild)\n\n/** 动作异常保留原始原因；可见文案由 actionErrorText 提供。 */\nexport interface DialogActionError {\n  cause: unknown\n}\n\nexport interface ConfirmOptions {\n  title: string\n  content?: DialogBody\n  /** 确认按钮语气，默认 brand；危险操作传 danger。 */\n  tone?: Tone\n  /** 标题旁的类型徽记。未提供时不显示徽记。 */\n  badge?: DialogServiceBadge\n  okText?: MaybeRefOrGetter<string>\n  cancelText?: MaybeRefOrGetter<string>\n  /** false 阻止关闭；抛错或 Promise 拒绝进入 actionError，保持打开。 */\n  onOk?: () => boolean | void | Promise<unknown>\n  /** 动作失败通知；通知自身失败时拒绝所属请求。 */\n  onActionError?: (error: DialogActionError) => void | Promise<void>\n}\n\n/** 单按钮告知框的入参：没有取消按钮，徽记由预设档决定，其余同 confirm。 */\nexport type AlertOptions = Omit<ConfirmOptions, 'tone' | 'badge'>\n\n/** 取值型弹窗的入参。正文自行拼装表单，确认时把该份值带回。 */\nexport interface PromptOptions<T extends object> extends Omit<ConfirmOptions, 'onOk' | 'content'> {\n  /** 每次打开建立一份初值；服务用 reactive 包装后交给 body 与 onOk，两边是同一份。 */\n  initialValue: T\n  /** 用该份可写代理渲染表单主体。 */\n  body: (value: T) => VNodeChild\n  /** 落焦到哪个节点，CSS 选择器。 */\n  initialFocus?: string\n  /** false 只阻止关闭；抛错或拒绝进入独立动作异常，弹窗保持打开。 */\n  onOk?: (value: T) => boolean | void | Promise<boolean | void>\n}\n\nexport interface DialogServiceOptions {\n  /** 确认按钮文案；未提供时取 config 里 translations.dialog.ok，再退英文语言包（OK）。 */\n  okText?: MaybeRefOrGetter<string>\n  /** 取消按钮文案；未提供时取 translations.dialog.cancel，再退英文语言包（Cancel）。 */\n  cancelText?: MaybeRefOrGetter<string>\n  /** 动作失败时的安全提示，支持与按钮文案相同的响应式来源；未提供时取 translations.dialog.actionError。 */\n  actionErrorText?: MaybeRefOrGetter<string>\n  /**\n   * 提供给对话框子树的全局配置（locale / translations / size / portalContainer）。\n   * 本服务自带宿主应用，无法接收组件树中的 provideXhConfig，需要与应用同语言时从这里提供；\n   * 传 ref/getter 即可在运行期跟随切换语言，也可以之后用 setConfig 推送。\n   */\n  config?: MaybeRefOrGetter<XhConfig>\n  /** 宿主容器；未提供时在 body 下新建一个。 */\n  target?: HTMLElement\n}\n\nexport interface DialogService {\n  /** 当前请求的动作异常，重试、关闭和切换请求时清空。 */\n  readonly actionError: DialogActionError | null\n  /** 确认经 onOk 后 resolve true；取消/Esc resolve false。 */\n  confirm: (options: ConfirmOptions) => Promise<boolean>\n  info: (options: AlertOptions) => Promise<void>\n  success: (options: AlertOptions) => Promise<void>\n  warning: (options: AlertOptions) => Promise<void>\n  error: (options: AlertOptions) => Promise<void>\n  /** 确认后 resolve 一份值的普通对象快照；取消 / Esc / 卸载 resolve null。 */\n  prompt: <T extends object>(options: PromptOptions<T>) => Promise<T | null>\n  /** 更换全局配置源。 */\n  setConfig: (next: MaybeRefOrGetter<XhConfig> | undefined) => void\n  /** 卸载宿主应用并移除容器。 */\n  dispose: () => void\n}\n\ninterface Spec extends DialogServiceControllerSpec {\n  title: string\n  content?: DialogBody\n  tone: Tone\n  /** 未给时取服务配置里 dialog 那一桶的 ok，再退英文语言包。 */\n  okText?: MaybeRefOrGetter<string>\n  cancelText?: MaybeRefOrGetter<string>\n  showCancel: boolean\n  /** 标题旁的类型徽记（预设档使用），confirm 不带。 */\n  badge?: DialogServiceBadge\n  /** 返回 false 阻止本次确认；异常由独立错误状态报告。 */\n  onOk?: () => unknown\n  onActionError?: (error: DialogActionError) => void | Promise<void>\n  /** 取值型弹窗的正文与可写的值，两边是同一个对象。 */\n  body?: (value: object) => VNodeChild\n  value?: object\n  initialFocus?: string\n}\n\nexport function createDialogService(options: DialogServiceOptions = {}): DialogService {\n  if (typeof document === 'undefined')\n    throw new Error('createDialogService 需要 document；SSR 里请等到客户端再创建')\n\n  // 文案不在创建时求值：队列里的对话框会跨过一次切语言。没给的那几句在渲染时取服务配置的语言包\n  const defaults = { okText: options.okText, cancelText: options.cancelText }\n  const configSource = createServiceConfig(options.config)\n  const holder = options.target ?? document.createElement('div')\n  let hostFailure: { cause: unknown } | null = null\n  try {\n    if (!options.target)\n      ensurePortalRoot(document).appendChild(holder)\n    if (holder.nodeType !== 1 || holder.ownerDocument !== document || !holder.isConnected)\n      throw new Error('DialogService target 必须是当前文档中已连接的元素')\n  }\n  catch (cause) {\n    hostFailure = { cause }\n  }\n\n  // 整份核心快照放 shallowRef：Spec 里的 MaybeRefOrGetter 不能被 reactive 深层解包。\n  let publishState: (next: DialogServiceControllerState<Spec>) => void = () => {}\n  const controller = createDialogServiceController<Spec>({\n    onStateChange: next => publishState(next),\n  })\n  const state = shallowRef(controller.state)\n  publishState = next => void (state.value = next)\n  if (hostFailure)\n    controller.fail(hostFailure.cause)\n\n  // 机器侧的关闭（Esc 等）从这里回来：未定的一律按取消结\n  function onOpenChange(open: boolean): void {\n    if (open)\n      return\n    controller.close(false)\n  }\n\n  const Host = defineComponent({\n    name: 'XhDialogServiceHost',\n    setup() {\n      configSource.provide()\n      return () => {\n        const serviceState = state.value\n        if (serviceState.failure)\n          return null\n        const request = serviceState.current\n        const spec = request?.spec\n        const text = dialogServiceTranslations(configSource.read()?.translations?.dialog)\n        const okText = toValue(spec?.okText) ?? text.ok\n        return h(XhDialogRoot, {\n          'open': serviceState.open,\n          'onUpdate:open': onOpenChange,\n          'modal': true,\n          'role': 'alertdialog',\n          'closeOnEscape': !serviceState.busy,\n          'closeOnInteractOutside': false,\n          'initialFocus': spec?.initialFocus,\n          'onExitComplete': () => controller.finishExit(request),\n        }, () => spec\n          ? h(XhDialogContent, null, () => [\n              h(XhDialogHeader, null, () => [\n                spec.badge ? h(XhDialogIndicator, { 'data-tone': dialogServiceBadgeTone(spec.badge) }) : null,\n                h(XhDialogTitle, () => spec.title),\n              ]),\n              h(XhDialogBody, null, () => [\n                // 串走 description，函数正文与 prompt 表单也在唯一滚动区内。\n                typeof spec.content === 'string'\n                  ? h(XhDialogDescription, () => spec.content as string)\n                  : typeof spec.content === 'function' ? spec.content() : null,\n                spec.body && spec.value ? spec.body(spec.value) : null,\n                serviceState.actionError ? h('p', { role: 'alert', style: { color: 'var(--xh-fg-danger)' } }, toValue(options.actionErrorText) ?? text.actionError) : null,\n              ]),\n              h(XhDialogFooter, null, () => [\n                spec.showCancel\n                  ? h(XhButton, { variant: 'ghost', disabled: serviceState.busy, onClick: () => controller.close(false) }, () => toValue(spec.cancelText) ?? text.cancel)\n                  : null,\n                h(XhButton, { variant: 'solid', tone: spec.tone, loading: serviceState.busy, onClick: controller.confirmCurrent }, () => [\n                  serviceState.busy ? h(XhButtonIndicator, () => spinArc()) : null,\n                  h(XhButtonLabel, () => (serviceState.busy ? `${okText}…` : okText)),\n                ]),\n              ]),\n            ])\n          : null)\n      }\n    },\n  })\n\n  const app: App = createApp(Host)\n  let mounted = false\n  function failHost(cause: unknown): void {\n    controller.fail(cause)\n  }\n  app.config.errorHandler = failHost\n  if (!hostFailure) {\n    try {\n      app.mount(holder)\n      mounted = true\n    }\n    catch (cause) {\n      failHost(cause)\n    }\n  }\n\n  const alert = (badge: DialogServiceBadge, tone: Tone) => async (opts: AlertOptions): Promise<void> => {\n    await controller.request({\n      title: opts.title,\n      content: opts.content,\n      tone,\n      okText: opts.okText ?? defaults.okText,\n      cancelText: defaults.cancelText,\n      showCancel: false,\n      badge,\n      onOk: opts.onOk,\n      onActionError: opts.onActionError,\n    })\n  }\n\n  return {\n    get actionError() { return controller.state.actionError },\n    confirm: opts => controller.request({\n      title: opts.title,\n      content: opts.content,\n      tone: opts.tone ?? 'brand',\n      okText: opts.okText ?? defaults.okText,\n      cancelText: opts.cancelText ?? defaults.cancelText,\n      showCancel: true,\n      badge: opts.badge,\n      onOk: opts.onOk,\n      onActionError: opts.onActionError,\n    }),\n    prompt: <T extends object>(opts: PromptOptions<T>): Promise<T | null> => {\n      // body 与 onOk 拿的是同一份可写代理：正文里改了什么，确认时就读到什么\n      const value = reactive({ ...opts.initialValue }) as T\n      return controller.request({\n        title: opts.title,\n        tone: opts.tone ?? 'brand',\n        okText: opts.okText ?? defaults.okText,\n        cancelText: opts.cancelText ?? defaults.cancelText,\n        showCancel: true,\n        badge: opts.badge,\n        initialFocus: opts.initialFocus,\n        body: v => opts.body(v as T),\n        value,\n        onOk: opts.onOk ? () => opts.onOk!(value) : undefined,\n        onActionError: opts.onActionError,\n      }).then(ok => (ok ? { ...toRaw(value) } as T : null))\n    },\n    info: alert('info', 'info'),\n    success: alert('success', 'success'),\n    warning: alert('warning', 'warning'),\n    error: alert('error', 'danger'),\n    setConfig: next => configSource.set(next),\n    dispose: () => {\n      controller.dispose()\n      if (mounted)\n        app.unmount()\n      if (!options.target)\n        holder.remove()\n    },\n  }\n}\n"],"mappings":"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"}

package/dist/services/service-config.js

@@ -7,7 +7,8 @@ function createServiceConfig(initial) {
 		provide: () => provideXhConfig(() => toValue(box.value.src) ?? {}),
 		set: (next) => {
 			box.value = { src: next };
-		}
+		},
+		read: () => toValue(box.value.src)
 	};
 }
 //#endregion

package/dist/services/service-config.js.map

@@ -1 +1 @@
-{"version":3,"file":"service-config.js","names":[],"sources":["../../src/services/service-config.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// 命令式服务共用的配置源。三个服务各自 createApp 到自建容器，接不到组件树里的\n// provideXhConfig，只能自己往宿主里 provide 一份；这里把那段收在一处。\n// 源收成 shallowRef 是为了运行期能换：传 ref/getter 的跟着应用切语言，\n// 没有响应式源的用句柄上的 setConfig 命令式推。\nimport type { MaybeRefOrGetter } from 'vue'\nimport type { XhConfig } from '../config/config'\nimport { shallowRef, toValue } from 'vue'\nimport { provideXhConfig } from '../config/config'\n\nexport interface ServiceConfigSource {\n  /** 在宿主组件的 setup 中调用一次。 */\n  provide: () => void\n  /** 更换配置源；下一帧起服务子树读取新值。 */\n  set: (next: MaybeRefOrGetter<XhConfig> | undefined) => void\n}\n\nexport function createServiceConfig(initial?: MaybeRefOrGetter<XhConfig>): ServiceConfigSource {\n  // 源本身可能就是个 ref，直接放进 shallowRef 会被解包成只读，故套一层盒子\n  const box = shallowRef<{ src: MaybeRefOrGetter<XhConfig> | undefined }>({ src: initial })\n  return {\n    provide: () => provideXhConfig(() => toValue(box.value.src) ?? {}),\n    set: (next) => {\n      box.value = { src: next }\n    },\n  }\n}\n"],"mappings":";;;AAqBA,SAAgB,oBAAoB,SAA2D;CAE7F,MAAM,MAAM,WAA4D,EAAE,KAAK,QAAQ,CAAC;CACxF,OAAO;EACL,eAAe,sBAAsB,QAAQ,IAAI,MAAM,GAAG,KAAK,CAAC,CAAC;EACjE,MAAM,SAAS;GACb,IAAI,QAAQ,EAAE,KAAK,KAAK;EAC1B;CACF;AACF"}
+{"version":3,"file":"service-config.js","names":[],"sources":["../../src/services/service-config.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// 命令式服务共用的配置源。三个服务各自 createApp 到自建容器，接不到组件树里的\n// provideXhConfig，只能自己往宿主里 provide 一份；这里把那段收在一处。\n// 源收成 shallowRef 是为了运行期能换：传 ref/getter 的跟着应用切语言，\n// 没有响应式源的用句柄上的 setConfig 命令式推。\nimport type { MaybeRefOrGetter } from 'vue'\nimport type { XhConfig } from '../config/config'\nimport { shallowRef, toValue } from 'vue'\nimport { provideXhConfig } from '../config/config'\n\nexport interface ServiceConfigSource {\n  /** 在宿主组件的 setup 中调用一次。 */\n  provide: () => void\n  /** 更换配置源；下一帧起服务子树读取新值。 */\n  set: (next: MaybeRefOrGetter<XhConfig> | undefined) => void\n  /** 现读当前配置：宿主组件自己 provide 的那份它自己 inject 不到，要在渲染里直接读。 */\n  read: () => XhConfig | undefined\n}\n\nexport function createServiceConfig(initial?: MaybeRefOrGetter<XhConfig>): ServiceConfigSource {\n  // 源本身可能就是个 ref，直接放进 shallowRef 会被解包成只读，故套一层盒子\n  const box = shallowRef<{ src: MaybeRefOrGetter<XhConfig> | undefined }>({ src: initial })\n  return {\n    provide: () => provideXhConfig(() => toValue(box.value.src) ?? {}),\n    set: (next) => {\n      box.value = { src: next }\n    },\n    read: () => toValue(box.value.src),\n  }\n}\n"],"mappings":";;;AAuBA,SAAgB,oBAAoB,SAA2D;CAE7F,MAAM,MAAM,WAA4D,EAAE,KAAK,QAAQ,CAAC;CACxF,OAAO;EACL,eAAe,sBAAsB,QAAQ,IAAI,MAAM,GAAG,KAAK,CAAC,CAAC;EACjE,MAAM,SAAS;GACb,IAAI,QAAQ,EAAE,KAAK,KAAK;EAC1B;EACA,YAAY,QAAQ,IAAI,MAAM,GAAG;CACnC;AACF"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@xihan-ui/vue",
   "type": "module",
-  "version": "3.1.0",
+  "version": "3.2.0",
   "description": "XiHan.UI Vue adapter — components, composables, machine runtime.",
   "author": {
     "name": "XiHanFun",
@@ -38,6 +38,10 @@
       "types": "./dist/behavior.d.ts",
       "import": "./dist/behavior.js"
     },
+    "./locale": {
+      "types": "./dist/locale.d.ts",
+      "import": "./dist/locale.js"
+    },
     "./sound": {
       "types": "./dist/sound.d.ts",
       "import": "./dist/sound.js"
@@ -59,9 +63,9 @@
   },
   "peerDependencies": {
     "vue": "^3.5.0",
-    "@xihan-ui/backgrounds": "^3.1.0",
-    "@xihan-ui/code-highlight": "^3.1.0",
-    "@xihan-ui/sound": "^3.1.0"
+    "@xihan-ui/backgrounds": "^3.2.0",
+    "@xihan-ui/code-highlight": "^3.2.0",
+    "@xihan-ui/sound": "^3.2.0"
   },
   "peerDependenciesMeta": {
     "@xihan-ui/backgrounds": {
@@ -75,12 +79,12 @@
     }
   },
   "dependencies": {
-    "@xihan-ui/core": "^3.1.0",
-    "@xihan-ui/headless": "^3.1.0",
-    "@xihan-ui/motion": "^3.1.0",
-    "@xihan-ui/pointer": "^3.1.0",
-    "@xihan-ui/position": "^3.1.0",
-    "@xihan-ui/viz": "^3.1.0"
+    "@xihan-ui/core": "^3.2.0",
+    "@xihan-ui/headless": "^3.2.0",
+    "@xihan-ui/motion": "^3.2.0",
+    "@xihan-ui/pointer": "^3.2.0",
+    "@xihan-ui/position": "^3.2.0",
+    "@xihan-ui/viz": "^3.2.0"
   },
   "devDependencies": {
     "@vitest/browser": "^4.1.11",
@@ -90,13 +94,13 @@
     "playwright": "^1.62.0",
     "vitest": "^4.1.11",
     "vue": "^3.5.40",
-    "@xihan-ui/backgrounds": "3.1.0",
+    "@xihan-ui/backgrounds": "3.2.0",
     "@xihan-ui/build": "0.0.0",
-    "@xihan-ui/code-highlight": "3.1.0",
-    "@xihan-ui/sound": "3.1.0",
-    "@xihan-ui/styles": "3.1.0",
+    "@xihan-ui/code-highlight": "3.2.0",
+    "@xihan-ui/sound": "3.2.0",
+    "@xihan-ui/styles": "3.2.0",
     "@xihan-ui/testing": "0.0.0",
-    "@xihan-ui/tokens": "3.1.0",
+    "@xihan-ui/tokens": "3.2.0",
     "@xihan-ui/tsconfig": "0.0.0"
   },
   "scripts": {