@zerodep-dev/vue-tsx-pro-ui 0.3.1 → 0.3.2

package/dist/charts/XYChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"XYChart.js","names":["_createVNode","_mergeProps","_vtp_readonlyProp","_vtp_bindable","_vtp_restProps","_vue_computed","_vue_shallowRef"],"sources":["../../src/charts/XYChart.tsx"],"sourcesContent":["/**\n * 直角坐标图表（柱状图、折线图、面积图）的公共部分：坐标轴、十字线与提示框、数值范围；外层结构（图例、单位、\n * 空与加载状态、给读屏的数据表）交给 ChartFrame。\n * 绘图交给 Unovis 的 XYContainer：组件实例只建一次，数据与配置变化时 update，卸载时 destroy；\n * 绘图区换了元素（加载、空状态之后重新出现）时容器连同全部实例一起重建。\n * 各种图只决定画什么（kind.components），坐标轴、十字线、提示框、配色都在这里统一。\n * 目标线（targets）用 Unovis 的 Plotline。点了下钻（onItemClick）：有图形可点的图（柱子）按图形的点击事件\n * （kind.itemSelector），折线、面积图按十字线所在的那一行，散点图按悬停的点。\n *\n * 标注（annotations）：类目上的事件画成竖线（Plotline），圈出某个系列的值画成空心圈带文字（Scatter）；\n * 区间（bands）画成浅色的带（Plotband）。百分比堆叠（kind.percent）按每个类目里各系列的占比画。\n * 第二数值轴（kind.secondary，组合图）：刻度与主轴对齐（alignedTicks），第二轴的系列换算到主轴的坐标里画，\n * 右侧的刻度文字是不裁剪的 Plotline 标签。\n */\nimport {\n  Axis,\n  AxisType,\n  Crosshair,\n  Plotband,\n  PlotbandLabelPosition,\n  Plotline,\n  PlotlineLabelPosition,\n  PlotlineLineStylePresets,\n  Position,\n  Scatter,\n  Tooltip,\n  XYContainer,\n  type XYComponentCore,\n} from '@unovis/ts';\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { useId, type VNodeChild } from 'vue';\nimport { useDetachedRender } from '../overlay/detached';\nimport { useLang } from '../config/context';\nimport { useFormat, type NumericFormat } from '../config/lang/format';\nimport { colors } from '../config/theme/tokens';\nimport { Skeleton } from '../feedback/Skeleton';\nimport { Button } from '../base/Button';\nimport { Slider } from '../input/Slider';\nimport { alignedTicks, type AlignedAxes } from './axis-ticks';\nimport { toNumber, type NumericValue } from '../utils/data/numeric';\nimport type { PartProps } from '../utils/props';\nimport {\n  ChartFrame,\n  chartDuration,\n  chartTooltip,\n  createChartInstances,\n  uniqueHighlightFilter,\n  useChartValueText,\n  usePlotSeen,\n  type ChartFrameParts,\n  type ChartTable,\n  type ChartTooltipItem,\n} from './frame';\nimport {\n  resolveColor,\n  resolveSeries,\n  seriesNumber,\n  seriesValue,\n  type ChartColor,\n  type ChartSeries,\n  type ResolvedSeries,\n} from './series';\n\n/** 目标线（参考线）：数值轴上的一条虚线 */\nexport interface ChartTarget {\n  /** 位置：数值轴上的值 */\n  value: NumericValue;\n  /** 标签：写在线的一端，后面带上格式化的数值（“年度指标 1,200”） */\n  label?: string;\n  /** 颜色；默认是 danger（要够到的线） */\n  color?: ChartColor;\n}\n\n/** 标注：类目上发生的事（竖线），或圈出某个系列在这个类目上的值 */\nexport interface ChartAnnotation {\n  /** 标在哪个类目上：index 字段的值（散点图是横轴上的数值） */\n  at: unknown;\n  /** 文字 */\n  label: string;\n  /** 圈出这个系列在这里的值（系列的 key）；不写时是一条竖线（换供应商、调价生效这类事件） */\n  series?: string;\n  /** 颜色；竖线默认是次要色，圈默认是系列色 */\n  color?: ChartColor;\n}\n\n/** 区间：类目轴上的一段（试运行期、促销期），或数值轴上的一段（目标区间） */\nexport interface ChartBand {\n  /** 在哪条轴上，默认 index（类目轴） */\n  axis?: 'index' | 'value';\n  /** 起点：类目轴是 index 字段的值（含这一项），数值轴是数值 */\n  from: unknown;\n  /** 终点：同 from（含这一项） */\n  to: unknown;\n  /** 文字：类目轴上的写在带的左下角，数值轴上的写在左上角 */\n  label?: string;\n  /** 颜色，默认 neutral；画成很浅的底色 */\n  color?: ChartColor;\n}\n\n/** 第二数值轴（右侧）：哪些系列画在它上面，它的格式与单位 */\nexport interface ChartSecondaryAxis {\n  /** 画在第二数值轴上的系列 */\n  keys: readonly string[];\n  /** 数值的格式 */\n  format?: NumericFormat;\n  /** 单位：显示在右上方，提示框与数据表的数值后面带上 */\n  unit?: string;\n}\n\n/** 加载中的骨架 */\nexport interface ChartSkeletons {\n  /** 一排高低不一的柱（柱状图） */\n  bars: unknown;\n  /** 一整块（默认） */\n  block: unknown;\n}\n\n/** 直角坐标图表共有的属性；未声明的属性落到外层 div（role=\"figure\"）上，aria-label 是图表的名称 */\nexport interface XYChartProps<T extends object>\n  extends PartProps<'div', 'role' | 'aria-busy'>, ChartFrameParts {\n  /** 数据：每一行是类目轴上的一项（一个月、一个项目） */\n  data: readonly T[];\n  /** 类目字段：类目轴的刻度、提示框的标题、数据表的第一列 */\n  index: keyof T & string;\n  /** 系列：每个系列画成一组柱子、一条线或一片面积 */\n  series: readonly ChartSeries<T>[];\n  /** 类目的显示文字；不写时把字段的值转成字符串 */\n  indexFormat?: (value: T[keyof T & string], row: T) => string;\n  /**\n   * 数值的格式：数值轴、提示框、数据表共用，按当前语言格式化。以万元为单位画金额时写\n   * `{ scale: 10_000, maximumFractionDigits: 1 }` 并配 `unit=\"万元\"`\n   */\n  valueFormat?: NumericFormat;\n  /** 单位：显示在数值轴上方，提示框与数据表的数值后面带上 */\n  unit?: string;\n  /**\n   * 绘图区的高度；数字按 px\n   * @default 240\n   */\n  height?: number | string;\n  /** 图例：默认多于一个系列时显示；点图例可以隐藏、恢复系列 */\n  legend?: boolean;\n  /**\n   * 数值轴的网格线\n   * @default true\n   */\n  grid?: boolean;\n  /** 数值轴的范围 [最小, 最大]；不写的一端按数据自动取，最小值默认从 0 起（数据有负数时取负数） */\n  valueDomain?: readonly [number | undefined, number | undefined];\n  /**\n   * 悬停时的提示框\n   * @default true\n   */\n  tooltip?: boolean;\n  /**\n   * 加载中：绘图区显示扫光的骨架（柱状图是一排高低不一的柱），带 aria-busy\n   * @default false\n   */\n  loading?: boolean;\n  /** 隐藏的系列（存系列的 key）：点图例时写回，父级可以写 _hiddenSeries={keys} */\n  _hiddenSeries?: string[];\n  /** 没有数据时显示的内容，默认是“暂无数据” */\n  empty?: VNodeChild;\n  /** 目标线、参考线：数值轴上的虚线（横向图是竖线），如年度销售指标；数值轴的范围会包含它 */\n  targets?: readonly ChartTarget[];\n  /** 标注：类目上的事件（竖线），或圈出某个系列的值（横向图只画竖线） */\n  annotations?: readonly ChartAnnotation[];\n  /** 区间：类目轴或数值轴上的一段，画成浅色的带（数值轴的范围会包含它） */\n  bands?: readonly ChartBand[];\n  /**\n   * 点了一个类目（下钻，如跳到筛好条件的台账）：参数是这一行与它的位置；写了它时绘图区的指针是手形。\n   * 点图是鼠标的捷径：同样的去处在页面上还要有链接或按钮，键盘与读屏才到得了（WCAG 2.1.1）\n   */\n  onItemClick?: (row: T, index: number) => void;\n  /** 缩放：绘图区下面一条区间滑块，选一段类目放大看（几年的月度数据）；读屏的数据表仍是全部 */\n  zoom?: boolean;\n  /** 缩放的区间 [起, 止]：类目的位置，含两端；父级可以写 _zoomRange={range}，null 是全部 */\n  _zoomRange?: [number, number] | null;\n}\n\n/** 交给各种图的绘制上下文 */\nexport interface XYChartContext<T extends object> {\n  /** 显示中的系列（去掉了图例里隐藏的），颜色已定 */\n  series: ResolvedSeries<T>[];\n  /** 类目的位置：第几行 */\n  x: (row: T, index: number) => number;\n  /** 系列的取值函数，空值返回 undefined（Unovis 跳过） */\n  y: (series: ResolvedSeries<T>) => (row: T) => number | undefined;\n  /** 取一个跨渲染保留的组件实例：第一次调用时创建；Unovis 组件保留实例，更新时才有过渡动画 */\n  instance: <C>(key: string, create: () => C) => C;\n  /** 点图形下钻的事件（写了 itemSelector 时）：并进组件的 events；没有 onItemClick 时是空的。参数同 Unovis：图形的数据、事件、位置 */\n  events: Record<string, Record<string, (row: T, event: Event, index: number) => void>>;\n}\n\n/** 一种图：画哪些组件，以及与坐标轴、十字线有关的差别 */\nexport interface XYChartKind<T extends object> {\n  /** 配置并返回要画的 Unovis 组件（每次数据或属性变化都会调用） */\n  components: (context: XYChartContext<T>) => XYComponentCore<T>[];\n  /** 横向：类目在纵轴、数值在横轴 */\n  horizontal?: boolean;\n  /** 十字线上给每个系列画圆点（折线图、面积图）；柱状图不画 */\n  crosshairDots?: boolean;\n  /** 加载中的骨架，默认 block */\n  skeleton?: keyof ChartSkeletons;\n  /** 绘图区四周的留白（px）：折线两端不贴着边缘 */\n  padding?: { left?: number; right?: number; top?: number; bottom?: number };\n  /** 数值范围按堆叠后的总和算（堆叠的柱子、面积） */\n  stacked?: boolean;\n  /** 百分比堆叠：各系列按它在这个类目里的占比画（加起来 100%），数值轴是百分比，提示框带上占比 */\n  percent?: boolean;\n  /** 第二数值轴（组合图）：这些系列画在右侧的轴上，刻度与主轴对齐 */\n  secondary?: ChartSecondaryAxis;\n  /** 十字线只在这些系列上画圆点（组合图里只给线画）；不写时按 crosshairDots */\n  crosshairSeries?: (series: ResolvedSeries<T>) => boolean;\n  /** 横轴是连续的数值（散点图）：取值、刻度与提示框里的写法、数据表的列名、轴下方的标题；不写时横轴是类目（第几行） */\n  continuousX?: {\n    value: (row: T) => number | undefined;\n    format: (value: number) => string;\n    label: string;\n    title?: string;\n  };\n  /** 数值轴默认从 0 起（数据有负数时取负数）；false 时按数据自动取（散点图） */\n  zeroBaseline?: boolean;\n  /** 提示框跟着数据点（散点图），没有十字线：按选择器触发，悬停的数据是这一行 */\n  pointTooltip?: string;\n  /** 提示框里列的项；不写时每个显示中的系列一行（瀑布图列变动与累计） */\n  tooltipItems?: (row: T) => ChartTooltipItem[];\n  /** 数值轴（主轴）的范围要包含的值；shown 是显示中的系列（第二数值轴的已去掉）。不写时按系列的值（stacked 时按正负各自的总和） */\n  domainValues?: (rows: readonly T[], shown: readonly ResolvedSeries<T>[]) => number[];\n  /** 给读屏的数据表；不写时类目一列加每个系列一列 */\n  table?: (rows: readonly T[]) => ChartTable;\n  /** 点哪种图形算点了这一行（柱子的选择器，图形绑定的数据是这一行）；不写时按十字线所在的那一行 */\n  itemSelector?: string;\n}\n\n/** 第二数值轴的刻度文字占的宽度（px） */\nconst SECONDARY_AXIS_WIDTH = 48;\n\n/** 骨架柱的高度（百分比）：高低错落，看起来像一组数据 */\nconst SKELETON_BARS = [55, 80, 40, 70, 90, 50, 65];\n\n/** XYChart 的样式：hideCrosshairLine 与加载中的骨架（外层结构的样式见 chartStyles） */\nexport const xyChartStyles = css.create({\n  // 柱状图的十字线只用来定位提示框，不画竖线\n  hideCrosshairLine: { '--vis-crosshair-line-stroke-opacity': '0' },\n  skeleton: { display: 'block', width: '100%', height: '100%' },\n  // 缩放：滑块占满，“显示全部”在结束边\n  zoom: { display: 'flex', alignItems: 'center', gap: '_md', paddingInline: '_sm' },\n  zoomSlider: { flexGrow: 1, minWidth: 0 },\n  skeletonBars: {\n    display: 'flex',\n    alignItems: 'flex-end',\n    justifyContent: 'space-around',\n    gap: '_md',\n    height: '100%',\n  },\n  skeletonBarsHorizontal: { flexDirection: 'column', alignItems: 'flex-start' },\n  skeletonBar: { display: 'block', flexGrow: 1, flexBasis: 0, borderRadius: '_sm' },\n  skeletonBarSize: (percent: string) => ({ height: percent }),\n  skeletonBarSizeHorizontal: (percent: string) => ({ width: percent }),\n});\n\n/** 加载中绘图区的骨架：柱状图是一排高低不一的柱（横向时是条），其余是一整块 */\nfunction chartSkeleton({\n  skeleton = 'block',\n  horizontal = false,\n}: Pick<XYChartKind<object>, 'skeleton' | 'horizontal'>) {\n  if (skeleton === 'block') return <Skeleton sx={xyChartStyles.skeleton} />;\n  return (\n    <div\n      aria-hidden=\"true\"\n      {...css.attrs(xyChartStyles.skeletonBars, horizontal && xyChartStyles.skeletonBarsHorizontal)}\n    >\n      {SKELETON_BARS.map((percent, position) => (\n        <Skeleton\n          key={position}\n          sx={[\n            xyChartStyles.skeletonBar,\n            horizontal\n              ? xyChartStyles.skeletonBarSizeHorizontal(`${percent}%`)\n              : xyChartStyles.skeletonBarSize(`${percent}%`),\n          ]}\n        />\n      ))}\n    </div>\n  );\n}\n\n/** 直角坐标图表的公共实现（组件库内部用，见 BarChart、LineChart、AreaChart） */\nexport const XYChart = _component(\n  <T extends object>({\n    data,\n    index,\n    series,\n    indexFormat,\n    valueFormat,\n    unit,\n    height = 240,\n    legend,\n    grid = true,\n    valueDomain,\n    tooltip = true,\n    loading = false,\n    _hiddenSeries: hiddenSeries = _bindable<string[]>([]),\n    empty,\n    targets,\n    annotations,\n    bands,\n    onItemClick,\n    zoom = false,\n    _zoomRange: zoomRange = _bindable<[number, number] | null>(null),\n    kind,\n    sx,\n    ...rest\n  }: XYChartProps<T> & { kind: XYChartKind<T> }) => {\n    const lang = useLang();\n    const format = useFormat();\n    const id = useId();\n    const resolved = _derived(resolveSeries(series));\n    const visible = _derived(resolved.filter((item) => !hiddenSeries.includes(item.key)));\n\n    const categoryText = (row: T | undefined) =>\n      row === undefined\n        ? ''\n        : indexFormat\n          ? indexFormat(row[index], row)\n          : String(row[index] ?? '');\n    const valueText = useChartValueText(() => ({ valueFormat, unit }));\n    const secondaryText = useChartValueText(() => ({\n      valueFormat: kind.secondary?.format,\n      unit: kind.secondary?.unit,\n    }));\n    const onSecondary = (key: string) => kind.secondary?.keys.includes(key) ?? false;\n    /** 一个系列的值的文字：第二数值轴上的按它的格式与单位 */\n    const seriesText = (key: string, value: NumericValue | undefined) =>\n      onSecondary(key) ? secondaryText(value) : valueText(value);\n    /** 一行里显示中的系列的总和（百分比堆叠的分母；负数不计） */\n    const rowTotal = (row: T) =>\n      visible.reduce((sum, item) => sum + Math.max(seriesNumber(row, item.key) ?? 0, 0), 0);\n    const percentText = (value: number) =>\n      format.number(value, { style: 'percent', maximumFractionDigits: 1 });\n\n    const xText = (row: T) => {\n      const x = kind.continuousX?.value(row);\n      return x === undefined ? lang.emptyValue : kind.continuousX!.format(x);\n    };\n\n    function toggle(key: string) {\n      hiddenSeries = hiddenSeries.includes(key)\n        ? hiddenSeries.filter((item) => item !== key)\n        : [...hiddenSeries, key];\n    }\n\n    /** 缩放的滑块：两端是类目；缩小过时旁边有“显示全部” */\n    const zoomBar = () => {\n      const last = data.length - 1;\n      return (\n        <div {...css.attrs(xyChartStyles.zoom)}>\n          <Slider\n            _value={zoomRange ?? [0, last]}\n            onUpdate:_value={(next: [number, number]) =>\n              (zoomRange = next[0] === 0 && next[1] === last ? null : next)\n            }\n            min={0}\n            max={last}\n            step={1}\n            size=\"sm\"\n            valueText={(position) => categoryText(data[position])}\n            aria-label={lang.chartZoom}\n            propsRoot={{ sx: xyChartStyles.zoomSlider }}\n          />\n          {zoomRange && (\n            <Button variant=\"link\" size=\"sm\" onClick={() => (zoomRange = null)}>\n              {lang.chartZoomReset}\n            </Button>\n          )}\n        </div>\n      );\n    };\n\n    const instances = createChartInstances();\n    let tooltipElement: HTMLElement | undefined;\n    // 提示框的内容渲染进 Unovis 管的元素：带上调用处的主题与语言，组件卸载时一起卸载\n    const renderDetached = useDetachedRender();\n\n    // 指针所在的那一行：十字线移动时记下，点绘图区时下钻到它；离开绘图区时清掉\n    let hovered: { row: T; index: number } | null = null;\n    const hover = (row: T | undefined) => {\n      hovered = row === undefined ? null : { row, index: data.indexOf(row) };\n    };\n\n    /** 十字线的提示框：内容用 Vue 渲染进同一个元素，交给 Unovis 定位 */\n    function renderTooltip(row: T) {\n      tooltipElement ??= document.createElement('div');\n      // 跟着数据点的提示框（散点图）没有十字线：悬停哪个点就是哪一行\n      if (kind.pointTooltip) hover(row);\n      renderDetached(\n        chartTooltip(\n          categoryText(row),\n          kind.tooltipItems?.(row) ?? [\n            ...(kind.continuousX\n              ? [{ label: kind.continuousX.label, color: 'transparent', value: xText(row) }]\n              : []),\n            // 跟着数据点的提示框只列这一行有值的系列（散点图里一行通常只落在一个系列上）\n            ...visible\n              .filter((item) => !kind.pointTooltip || seriesValue(row, item.key) !== undefined)\n              .map((item) => {\n                const value = seriesValue(row, item.key);\n                const total = kind.percent ? rowTotal(row) : 0;\n                return {\n                  label: item.label,\n                  color: item.color,\n                  value:\n                    kind.percent && value !== undefined && total > 0\n                      ? `${seriesText(item.key, value)}（${percentText(toNumber(value) / total)}）`\n                      : seriesText(item.key, value),\n                };\n              }),\n          ],\n        ),\n        tooltipElement,\n      );\n      return tooltipElement;\n    }\n\n    let plot = _state.raw<HTMLElement | null>(null);\n    const seen = usePlotSeen(() => plot);\n    let container: XYContainer<T> | undefined;\n    let containerElement: HTMLElement | undefined;\n    _effect(() => () => {\n      container?.destroy();\n    });\n    _effect(() => {\n      // 缩放：只画选中的一段（散点图的横轴是连续的数值，不按类目缩放）\n      const range = zoom && !kind.continuousX ? zoomRange : null;\n      const rows = range ? data.slice(range[0], range[1] + 1) : [...data];\n      const shown = visible;\n      const element = plot;\n      if (!element || loading || rows.length === 0 || !seen()) return;\n      // 绘图区换了元素：旧容器连同它的组件、坐标轴一起销毁，实例表清空后重新创建\n      if (container && containerElement !== element) {\n        container.destroy();\n        container = undefined;\n        instances.reset();\n      }\n\n      const primarySeries = shown.filter((item) => !onSecondary(item.key));\n      const secondarySeries = shown.filter((item) => onSecondary(item.key));\n      const totals = rows.map((row) =>\n        primarySeries.map((item) => seriesNumber(row, item.key) ?? 0),\n      );\n      const seriesValues = kind.domainValues\n        ? kind.domainValues(rows, primarySeries)\n        : kind.stacked\n          ? totals.flatMap((row) => [\n              row.reduce((sum, value) => sum + Math.max(value, 0), 0),\n              row.reduce((sum, value) => sum + Math.min(value, 0), 0),\n            ])\n          : totals.flat();\n      // 目标线、数值轴上的区间要落在数值轴的范围里\n      const values = [\n        ...seriesValues,\n        ...(targets ?? []).map((target) => toNumber(target.value)),\n        ...(bands ?? [])\n          .filter((band) => band.axis === 'value')\n          .flatMap((band) => [Number(band.from), Number(band.to)]),\n      ];\n      // 第二数值轴：两条轴的刻度对齐，第二轴的值换算到主轴的坐标\n      const aligned: AlignedAxes | undefined =\n        secondarySeries.length > 0\n          ? alignedTicks(\n              [\n                ...values,\n                ...[valueDomain?.[0], valueDomain?.[1]].filter(\n                  (end): end is number => end !== undefined,\n                ),\n              ],\n              rows.flatMap((row) =>\n                secondarySeries.map((item) => seriesNumber(row, item.key) ?? 0),\n              ),\n            )\n          : undefined;\n      const domain: [number | undefined, number | undefined] = kind.percent\n        ? [0, 1]\n        : aligned\n          ? aligned.primary.domain\n          : [\n              valueDomain?.[0] ??\n                (kind.zeroBaseline === false ? undefined : Math.min(0, ...values)),\n              valueDomain?.[1],\n            ];\n      const x = kind.continuousX\n        ? (row: T) => kind.continuousX!.value(row) ?? Number.NaN\n        : (_row: T, position: number) => position;\n      const y = (item: (typeof shown)[number]) => {\n        if (kind.percent)\n          return (row: T) => {\n            const value = seriesNumber(row, item.key);\n            const total = rowTotal(row);\n            return value === undefined || total === 0 ? undefined : value / total;\n          };\n        if (aligned && onSecondary(item.key))\n          return (row: T) => {\n            const value = seriesNumber(row, item.key);\n            return value === undefined ? undefined : aligned.toPrimary(value);\n          };\n        return (row: T) => seriesNumber(row, item.key);\n      };\n      /** 类目在类目轴上的位置：散点图是横轴的数值，其余是第几行；找不到时 undefined */\n      const positionOf = (at: unknown) => {\n        if (kind.continuousX) return Number(at);\n        const found = rows.findIndex((row) => row[index] === at);\n        return found < 0 ? undefined : found;\n      };\n      const categoryAxisName = kind.horizontal ? AxisType.Y : AxisType.X;\n      const valueAxisName = kind.horizontal ? AxisType.X : AxisType.Y;\n      const lines = (targets ?? []).map((target, position) => {\n        const line = instances.get(`target-${position}`, () => new Plotline<T>({}));\n        const value = toNumber(target.value);\n        const label = valueText(target.value);\n        line.setConfig({\n          axis: kind.horizontal ? 'x' : 'y',\n          value,\n          color: resolveColor(target.color ?? 'danger', 0),\n          lineWidth: 1.5,\n          lineStyle: PlotlineLineStylePresets.Dash,\n          labelText: target.label ? `${target.label} ${label}` : label,\n          labelPosition: kind.horizontal\n            ? PlotlineLabelPosition.TopRight\n            : PlotlineLabelPosition.TopLeft,\n          labelOffsetX: 4,\n          labelOffsetY: 10,\n        });\n        return line;\n      });\n\n      // 区间：浅色的带，文字在左上角\n      const bandComponents = (bands ?? []).flatMap((band, position) => {\n        const onIndex = band.axis !== 'value';\n        const from = onIndex ? positionOf(band.from) : Number(band.from);\n        const to = onIndex ? positionOf(band.to) : Number(band.to);\n        if (from === undefined || to === undefined) return [];\n        // 类目轴上的区间盖住两端的类目：往外各扩半格\n        const half = onIndex && !kind.continuousX ? 0.5 : 0;\n        const plotband = instances.get(`band-${position}`, () => new Plotband<T>({}));\n        plotband.setConfig({\n          axis: onIndex ? categoryAxisName : valueAxisName,\n          from: Math.min(from, to) - half,\n          to: Math.max(from, to) + half,\n          color: `color-mix(in srgb, ${resolveColor(band.color ?? 'neutral', 0)} 12%, transparent)`,\n          labelText: band.label,\n          // 类目轴上的区间文字在左下角：顶上留给事件竖线的文字\n          labelPosition: onIndex\n            ? PlotbandLabelPosition.BottomLeftInside\n            : PlotbandLabelPosition.TopLeftInside,\n          labelColor: colors.textMuted,\n          labelOffsetX: 6,\n          labelOffsetY: 6,\n        });\n        return [plotband];\n      });\n\n      // 标注：事件是类目上的竖线；圈出的值是一个空心圈，文字在上方\n      const events = (annotations ?? []).filter((item) => item.series === undefined);\n      const eventLines = events.flatMap((item, position) => {\n        const at = positionOf(item.at);\n        if (at === undefined) return [];\n        const line = instances.get(`event-${position}`, () => new Plotline<T>({}));\n        line.setConfig({\n          axis: categoryAxisName,\n          value: at,\n          color: resolveColor(item.color ?? 'neutral', 0),\n          lineWidth: 1,\n          lineStyle: PlotlineLineStylePresets.ShortDash,\n          labelText: item.label,\n          labelPosition: kind.horizontal\n            ? PlotlineLabelPosition.BottomRight\n            : PlotlineLabelPosition.TopRight,\n          labelOffsetX: 4,\n          labelOffsetY: 4,\n        });\n        return [line];\n      });\n      const marked = (annotations ?? []).filter(\n        (item) => item.series !== undefined && !kind.horizontal,\n      );\n      const markOf = (row: T) => {\n        const at = kind.continuousX ? kind.continuousX.value(row) : rows.indexOf(row);\n        return marked.find(\n          (item) =>\n            positionOf(item.at) === at && shown.some((series) => series.key === item.series),\n        );\n      };\n      /** 圈的位置：系列的值；堆叠时是它在这一摞里的顶端 */\n      const markY = (row: T) => {\n        const mark = markOf(row);\n        if (!mark) return undefined;\n        const series = shown.find((item) => item.key === mark.series)!;\n        if (!kind.stacked || kind.percent) return y(series)(row);\n        const upTo = shown.slice(0, shown.indexOf(series) + 1);\n        return upTo.reduce((sum, item) => sum + Math.max(y(item)(row) ?? 0, 0), 0);\n      };\n      const markColor = (row: T) => {\n        const mark = markOf(row);\n        const series = shown.find((item) => item.key === mark?.series);\n        return mark?.color ? resolveColor(mark.color, 0) : (series?.color ?? colors.textMuted);\n      };\n      const marks = instances.get('marks', () => new Scatter<T>({ x, y: () => undefined }));\n      marks.setConfig({\n        x,\n        y: markY,\n        size: 16,\n        color: 'transparent',\n        strokeColor: markColor,\n        strokeWidth: 2,\n        label: (row: T) => markOf(row)?.label ?? '',\n        labelPosition: Position.Top,\n        labelColor: colors.text,\n      });\n\n      // 第二数值轴的刻度：与主轴的刻度同高，文字在绘图区右侧（不裁剪的 Plotline 标签，线本身透明）\n      const secondaryLabels = aligned\n        ? aligned.secondary.ticks.map((tick, position) => {\n            const label = instances.get(`secondary-${position}`, () => {\n              const line = new Plotline<T>({});\n              line.clippable = false;\n              return line;\n            });\n            label.setConfig({\n              axis: 'y',\n              value: aligned.primary.ticks[position]!,\n              color: 'transparent',\n              lineWidth: 0,\n              labelText: format.number(tick, kind.secondary?.format),\n              labelPosition: PlotlineLabelPosition.Right,\n              labelOffsetX: -(SECONDARY_AXIS_WIDTH - 4),\n              labelColor: colors.textMuted,\n            });\n            return label;\n          })\n        : [];\n      const components = [\n        ...bandComponents,\n        ...kind.components({\n          series: shown,\n          x,\n          y,\n          instance: instances.get,\n          events:\n            kind.itemSelector && onItemClick\n              ? {\n                  [kind.itemSelector]: {\n                    // 分组柱给的是原来的行；堆叠柱给的是拼出来的副本，第三个参数才是行的位置\n                    click: (row: T, _event: Event, index: number) => {\n                      const position = data.indexOf(row);\n                      const at = position >= 0 ? position : index;\n                      onItemClick(data[at] ?? row, at);\n                    },\n                  },\n                }\n              : {},\n        }),\n        ...lines,\n        ...eventLines,\n        ...(marked.length > 0 ? [marks] : []),\n        ...secondaryLabels,\n      ];\n      const xAxis = instances.get('xAxis', () => new Axis<T>({ type: 'x' }));\n      const yAxis = instances.get('yAxis', () => new Axis<T>({ type: 'y' }));\n      const crosshair = instances.get('crosshair', () => new Crosshair<T>());\n      const tooltipBox = instances.get('tooltip', () => new Tooltip());\n      const [categoryAxis, valueAxis] = kind.horizontal ? [yAxis, xAxis] : [xAxis, yAxis];\n      const continuous = kind.continuousX;\n      categoryAxis.setConfig({\n        type: kind.horizontal ? 'y' : 'x',\n        // 连续的横轴：Unovis 自己取刻度，网格线与数值轴一样；类目轴：每行一个刻度\n        tickValues: continuous ? undefined : rows.map((_row, position) => position),\n        numTicks: continuous ? 6 : undefined,\n        tickFormat: continuous\n          ? (tick) => continuous.format(Number(tick))\n          : (tick) => categoryText(rows[Number(tick)]),\n        gridLine: continuous ? grid : false,\n        tickLine: false,\n        domainLine: false,\n        tickTextHideOverlapping: true,\n        tickPadding: 8,\n        label: continuous?.title,\n        labelMargin: 8,\n      });\n      valueAxis.setConfig({\n        type: kind.horizontal ? 'x' : 'y',\n        numTicks: 5,\n        // 有第二数值轴时用对齐的刻度，两边的刻度落在同一组网格线上\n        tickValues: aligned?.primary.ticks,\n        tickFormat: (tick) =>\n          kind.percent\n            ? format.number(Number(tick), { style: 'percent', maximumFractionDigits: 0 })\n            : format.number(Number(tick), valueFormat),\n        gridLine: grid,\n        tickLine: false,\n        domainLine: false,\n        tickPadding: 8,\n      });\n      const dotted = kind.crosshairSeries ? shown.filter(kind.crosshairSeries) : shown;\n      crosshair.setConfig({\n        // 访问器直接给：容器还没按尺寸渲染过时不会把组件的访问器转交十字线，Unovis 会报 “Y accessors have not been configured”\n        x,\n        ...(kind.stacked ? { yStacked: dotted.map(y) } : { y: dotted.map(y) }),\n        template: (row: T) => renderTooltip(row),\n        color: (_row: T, position: number) => dotted[position]?.color ?? 'transparent',\n        getCircles: kind.crosshairDots ? undefined : () => [],\n        hideWhenFarFromPointer: false,\n        onCrosshairMove: (_x, row) => hover(row),\n      });\n\n      tooltipBox.setConfig({\n        triggers: kind.pointTooltip ? { [kind.pointTooltip]: (row: T) => renderTooltip(row) } : {},\n      });\n      const config = {\n        components,\n        xAxis,\n        yAxis,\n        // 能下钻时没有提示框也要十字线：靠它知道指针在哪一行\n        crosshair:\n          (tooltip || (onItemClick && !kind.itemSelector)) && !kind.pointTooltip\n            ? crosshair\n            : undefined,\n        tooltip: tooltip ? tooltipBox : undefined,\n        [kind.horizontal ? 'xDomain' : 'yDomain']: domain,\n        // 第二数值轴的刻度文字画在右侧留出的空白里\n        padding: aligned\n          ? { ...kind.padding, right: Math.max(kind.padding?.right ?? 0, SECONDARY_AXIS_WIDTH) }\n          : (kind.padding ?? {}),\n        ariaLabel: null,\n        duration: chartDuration(element),\n        onRenderComplete: haloPlotlineLabels,\n      };\n      if (container) container.update(config, undefined, rows);\n      else {\n        container = new XYContainer<T>(element, config, rows);\n        containerElement = element;\n        uniqueHighlightFilter(element, `${id}-highlight`);\n      }\n    });\n\n    return () => (\n      <ChartFrame\n        {...rest}\n        sx={[!kind.crosshairDots && xyChartStyles.hideCrosshairLine, sx]}\n        // 百分比堆叠时数值轴是占比：轴上方不写单位（提示框、数据表里仍带）\n        unit={kind.percent ? undefined : unit}\n        unitEnd={kind.secondary?.unit}\n        height={height}\n        legend={(legend ?? resolved.length > 1) ? resolved : []}\n        hiddenKeys={hiddenSeries}\n        onLegendToggle={toggle}\n        loading={loading}\n        skeleton={chartSkeleton(kind)}\n        isEmpty={data.length === 0}\n        empty={empty}\n        clickable={onItemClick != null}\n        onPlotClick={\n          onItemClick && !kind.itemSelector\n            ? () => {\n                if (hovered) onItemClick(hovered.row, hovered.index);\n              }\n            : undefined\n        }\n        table={\n          kind.table?.(data) ?? {\n            columns: [\n              lang.chartCategory,\n              ...(kind.continuousX ? [kind.continuousX.label] : []),\n              ...resolved.map((item) => {\n                const itemUnit = onSecondary(item.key) ? kind.secondary?.unit : unit;\n                return itemUnit ? `${item.label}（${itemUnit}）` : item.label;\n              }),\n            ],\n            rows: data.map((row) => ({\n              header: categoryText(row),\n              cells: [\n                ...(kind.continuousX ? [xText(row)] : []),\n                ...resolved.map((item) => {\n                  const value = seriesValue(row, item.key);\n                  return value === undefined\n                    ? lang.emptyValue\n                    : format.number(\n                        value,\n                        onSecondary(item.key) ? kind.secondary?.format : valueFormat,\n                      );\n                }),\n              ],\n            })),\n          }\n        }\n        plotRef={(element) => (plot = element)}\n        footer={zoom && !kind.continuousX && data.length > 2 ? zoomBar() : undefined}\n      />\n    );\n  },\n);\n\n/**\n * 目标线、事件竖线的文字描一圈表面色的边（同地图上地点的名字）：压在柱子、折线上也看得清。\n * Unovis 的 Plotline 文字没有描边的配置项，渲染完成后补在元素上；导出图片时按计算样式一并带走\n */\nfunction haloPlotlineLabels(svg: SVGSVGElement) {\n  for (const label of svg.querySelectorAll<SVGTextElement>('text[class*=\"plotline-label\"]')) {\n    label.style.setProperty('paint-order', 'stroke');\n    label.style.setProperty('stroke', colors.surface);\n    label.style.setProperty('stroke-width', '3px');\n    label.style.setProperty('stroke-linejoin', 'round');\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"XYChart.js","names":["_createVNode","_mergeProps","_vtp_readonlyProp","_vtp_bindable","_vtp_restProps","_vue_computed","_vue_shallowRef"],"sources":["../../src/charts/XYChart.tsx"],"sourcesContent":["/**\n * 直角坐标图表（柱状图、折线图、面积图）的公共部分：坐标轴、十字线与提示框、数值范围；外层结构（图例、单位、\n * 空与加载状态、给读屏的数据表）交给 ChartFrame。\n * 绘图交给 Unovis 的 XYContainer：组件实例只建一次，数据与配置变化时 update，卸载时 destroy；\n * 绘图区换了元素（加载、空状态之后重新出现）时容器连同全部实例一起重建。\n * 各种图只决定画什么（kind.components），坐标轴、十字线、提示框、配色都在这里统一。\n * 目标线（targets）用 Unovis 的 Plotline。点了下钻（onItemClick）：有图形可点的图（柱子）按图形的点击事件\n * （kind.itemSelector），折线、面积图按十字线所在的那一行，散点图按悬停的点。\n *\n * 标注（annotations）：类目上的事件画成竖线（Plotline），圈出某个系列的值画成空心圈带文字（Scatter）；\n * 区间（bands）画成浅色的带（Plotband）。百分比堆叠（kind.percent）按每个类目里各系列的占比画。\n * 第二数值轴（kind.secondary，组合图）：刻度与主轴对齐（alignedTicks），第二轴的系列换算到主轴的坐标里画，\n * 右侧的刻度文字是不裁剪的 Plotline 标签。\n */\nimport {\n  Axis,\n  AxisType,\n  Crosshair,\n  Plotband,\n  PlotbandLabelPosition,\n  Plotline,\n  PlotlineLabelPosition,\n  PlotlineLineStylePresets,\n  Position,\n  Scatter,\n  Tooltip,\n  XYContainer,\n  type XYComponentCore,\n} from '@unovis/ts';\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { useId, type VNodeChild } from 'vue';\nimport { useDetachedRender } from '../overlay/detached';\nimport { useLang } from '../config/context';\nimport { useFormat, type NumericFormat } from '../config/lang/format';\nimport { colors } from '../config/theme/tokens';\nimport { Skeleton } from '../feedback/Skeleton';\nimport { Button } from '../base/Button';\nimport { Slider } from '../input/Slider';\nimport { alignedTicks, type AlignedAxes } from './axis-ticks';\nimport { toNumber, type NumericValue } from '../utils/data/numeric';\nimport type { PartProps } from '../utils/props';\nimport {\n  ChartFrame,\n  chartDuration,\n  chartTooltip,\n  createChartInstances,\n  uniqueHighlightFilter,\n  useChartValueText,\n  usePlotSeen,\n  type ChartFrameParts,\n  type ChartTable,\n  type ChartTooltipItem,\n} from './frame';\nimport {\n  resolveColor,\n  resolveSeries,\n  seriesNumber,\n  seriesValue,\n  type ChartColor,\n  type ChartSeries,\n  type ResolvedSeries,\n} from './series';\n\n/** 目标线（参考线）：数值轴上的一条虚线 */\nexport interface ChartTarget {\n  /** 位置：数值轴上的值 */\n  value: NumericValue;\n  /** 标签：写在线的一端，后面带上格式化的数值（“年度指标 1,200”） */\n  label?: string;\n  /** 颜色；默认是 danger（要够到的线） */\n  color?: ChartColor;\n}\n\n/** 标注：类目上发生的事（竖线），或圈出某个系列在这个类目上的值 */\nexport interface ChartAnnotation {\n  /** 标在哪个类目上：index 字段的值（散点图是横轴上的数值） */\n  at: unknown;\n  /** 文字 */\n  label: string;\n  /** 圈出这个系列在这里的值（系列的 key）；不写时是一条竖线（换供应商、调价生效这类事件） */\n  series?: string;\n  /** 颜色；竖线默认是次要色，圈默认是系列色 */\n  color?: ChartColor;\n}\n\n/** 区间：类目轴上的一段（试运行期、促销期），或数值轴上的一段（目标区间） */\nexport interface ChartBand {\n  /** 在哪条轴上，默认 index（类目轴） */\n  axis?: 'index' | 'value';\n  /** 起点：类目轴是 index 字段的值（含这一项），数值轴是数值 */\n  from: unknown;\n  /** 终点：同 from（含这一项） */\n  to: unknown;\n  /** 文字：类目轴上的写在带的左下角，数值轴上的写在左上角 */\n  label?: string;\n  /** 颜色，默认 neutral；画成很浅的底色 */\n  color?: ChartColor;\n}\n\n/** 第二数值轴（右侧）：哪些系列画在它上面，它的格式与单位 */\nexport interface ChartSecondaryAxis {\n  /** 画在第二数值轴上的系列 */\n  keys: readonly string[];\n  /** 数值的格式 */\n  format?: NumericFormat;\n  /** 单位：显示在右上方，提示框与数据表的数值后面带上 */\n  unit?: string;\n}\n\n/** 加载中的骨架 */\nexport interface ChartSkeletons {\n  /** 一排高低不一的柱（柱状图） */\n  bars: unknown;\n  /** 一整块（默认） */\n  block: unknown;\n}\n\n/** 直角坐标图表共有的属性；未声明的属性落到外层 div（role=\"figure\"）上，aria-label 是图表的名称 */\nexport interface XYChartProps<T extends object>\n  extends PartProps<'div', 'role' | 'aria-busy'>, ChartFrameParts {\n  /** 数据：每一行是类目轴上的一项（一个月、一个项目） */\n  data: readonly T[];\n  /** 类目字段：类目轴的刻度、提示框的标题、数据表的第一列 */\n  index: keyof T & string;\n  /** 系列：每个系列画成一组柱子、一条线或一片面积 */\n  series: readonly ChartSeries<T>[];\n  /** 类目的显示文字；不写时把字段的值转成字符串 */\n  indexFormat?: (value: T[keyof T & string], row: T) => string;\n  /**\n   * 数值的格式：数值轴、提示框、数据表共用，按当前语言格式化。以万元为单位画金额时写\n   * `{ scale: 10_000, maximumFractionDigits: 1 }` 并配 `unit=\"万元\"`\n   */\n  valueFormat?: NumericFormat;\n  /** 单位：显示在数值轴上方，提示框与数据表的数值后面带上 */\n  unit?: string;\n  /**\n   * 绘图区的高度；数字按 px\n   * @default 240\n   */\n  height?: number | string;\n  /** 图例：默认多于一个系列时显示；点图例可以隐藏、恢复系列 */\n  legend?: boolean;\n  /**\n   * 数值轴的网格线\n   * @default true\n   */\n  grid?: boolean;\n  /** 数值轴的范围 [最小, 最大]；不写的一端按数据自动取，最小值默认从 0 起（数据有负数时取负数） */\n  valueDomain?: readonly [number | undefined, number | undefined];\n  /**\n   * 悬停时的提示框\n   * @default true\n   */\n  tooltip?: boolean;\n  /**\n   * 加载中：绘图区显示扫光的骨架（柱状图是一排高低不一的柱），带 aria-busy\n   * @default false\n   */\n  loading?: boolean;\n  /** 隐藏的系列（存系列的 key）：点图例时写回，父级可以写 _hiddenSeries={keys} */\n  _hiddenSeries?: string[];\n  /** 没有数据时显示的内容，默认是“暂无数据” */\n  empty?: VNodeChild;\n  /** 目标线、参考线：数值轴上的虚线（横向图是竖线），如年度销售指标；数值轴的范围会包含它 */\n  targets?: readonly ChartTarget[];\n  /** 标注：类目上的事件（竖线），或圈出某个系列的值（横向图只画竖线） */\n  annotations?: readonly ChartAnnotation[];\n  /** 区间：类目轴或数值轴上的一段，画成浅色的带（数值轴的范围会包含它） */\n  bands?: readonly ChartBand[];\n  /**\n   * 点了一个类目（下钻，如跳到筛好条件的台账）：参数是这一行与它的位置；写了它时绘图区的指针是手形。\n   * 点图是鼠标的捷径：同样的去处在页面上还要有链接或按钮，键盘与读屏才到得了（WCAG 2.1.1）\n   */\n  onItemClick?: (row: T, index: number) => void;\n  /** 缩放：绘图区下面一条区间滑块，选一段类目放大看（几年的月度数据）；读屏的数据表仍是全部 */\n  zoom?: boolean;\n  /** 缩放的区间 [起, 止]：类目的位置，含两端；父级可以写 _zoomRange={range}，null 是全部 */\n  _zoomRange?: [number, number] | null;\n}\n\n/** 交给各种图的绘制上下文 */\nexport interface XYChartContext<T extends object> {\n  /** 显示中的系列（去掉了图例里隐藏的），颜色已定 */\n  series: ResolvedSeries<T>[];\n  /** 类目的位置：第几行 */\n  x: (row: T, index: number) => number;\n  /** 系列的取值函数，空值返回 undefined（Unovis 跳过） */\n  y: (series: ResolvedSeries<T>) => (row: T) => number | undefined;\n  /** 取一个跨渲染保留的组件实例：第一次调用时创建；Unovis 组件保留实例，更新时才有过渡动画 */\n  instance: <C>(key: string, create: () => C) => C;\n  /** 点图形下钻的事件（写了 itemSelector 时）：并进组件的 events；没有 onItemClick 时是空的。参数同 Unovis：图形的数据、事件、位置 */\n  events: Record<string, Record<string, (row: T, event: Event, index: number) => void>>;\n}\n\n/** 一种图：画哪些组件，以及与坐标轴、十字线有关的差别 */\nexport interface XYChartKind<T extends object> {\n  /** 配置并返回要画的 Unovis 组件（每次数据或属性变化都会调用） */\n  components: (context: XYChartContext<T>) => XYComponentCore<T>[];\n  /** 横向：类目在纵轴、数值在横轴 */\n  horizontal?: boolean;\n  /** 十字线上给每个系列画圆点（折线图、面积图）；柱状图不画 */\n  crosshairDots?: boolean;\n  /** 加载中的骨架，默认 block */\n  skeleton?: keyof ChartSkeletons;\n  /** 绘图区四周的留白（px）：折线两端不贴着边缘 */\n  padding?: { left?: number; right?: number; top?: number; bottom?: number };\n  /** 数值范围按堆叠后的总和算（堆叠的柱子、面积） */\n  stacked?: boolean;\n  /** 百分比堆叠：各系列按它在这个类目里的占比画（加起来 100%），数值轴是百分比，提示框带上占比 */\n  percent?: boolean;\n  /** 第二数值轴（组合图）：这些系列画在右侧的轴上，刻度与主轴对齐 */\n  secondary?: ChartSecondaryAxis;\n  /** 十字线只在这些系列上画圆点（组合图里只给线画）；不写时按 crosshairDots */\n  crosshairSeries?: (series: ResolvedSeries<T>) => boolean;\n  /** 横轴是连续的数值（散点图）：取值、刻度与提示框里的写法、数据表的列名、轴下方的标题；不写时横轴是类目（第几行） */\n  continuousX?: {\n    value: (row: T) => number | undefined;\n    format: (value: number) => string;\n    label: string;\n    title?: string;\n  };\n  /** 数值轴默认从 0 起（数据有负数时取负数）；false 时按数据自动取（散点图） */\n  zeroBaseline?: boolean;\n  /** 提示框跟着数据点（散点图），没有十字线：按选择器触发，悬停的数据是这一行 */\n  pointTooltip?: string;\n  /** 提示框里列的项；不写时每个显示中的系列一行（瀑布图列变动与累计） */\n  tooltipItems?: (row: T) => ChartTooltipItem[];\n  /** 数值轴（主轴）的范围要包含的值；shown 是显示中的系列（第二数值轴的已去掉）。不写时按系列的值（stacked 时按正负各自的总和） */\n  domainValues?: (rows: readonly T[], shown: readonly ResolvedSeries<T>[]) => number[];\n  /** 给读屏的数据表；不写时类目一列加每个系列一列 */\n  table?: (rows: readonly T[]) => ChartTable;\n  /** 点哪种图形算点了这一行（柱子的选择器，图形绑定的数据是这一行）；不写时按十字线所在的那一行 */\n  itemSelector?: string;\n}\n\n/** 第二数值轴的刻度文字占的宽度（px） */\nconst SECONDARY_AXIS_WIDTH = 48;\n\n/** 骨架柱的高度（百分比）：高低错落，看起来像一组数据 */\nconst SKELETON_BARS = [55, 80, 40, 70, 90, 50, 65];\n\n/** XYChart 的样式：hideCrosshairLine 与加载中的骨架（外层结构的样式见 chartStyles） */\nexport const xyChartStyles = css.create({\n  // 柱状图的十字线只用来定位提示框，不画竖线\n  hideCrosshairLine: { '--vis-crosshair-line-stroke-opacity': '0' },\n  skeleton: { display: 'block', width: '100%', height: '100%' },\n  // 缩放：滑块占满，“显示全部”在结束边\n  zoom: { display: 'flex', alignItems: 'center', gap: '_md', paddingInline: '_sm' },\n  zoomSlider: { flexGrow: 1, minWidth: 0 },\n  skeletonBars: {\n    display: 'flex',\n    alignItems: 'flex-end',\n    justifyContent: 'space-around',\n    gap: '_md',\n    height: '100%',\n  },\n  skeletonBarsHorizontal: { flexDirection: 'column', alignItems: 'flex-start' },\n  skeletonBar: { display: 'block', flexGrow: 1, flexBasis: 0, borderRadius: '_sm' },\n  skeletonBarSize: (percent: string) => ({ height: percent }),\n  skeletonBarSizeHorizontal: (percent: string) => ({ width: percent }),\n});\n\n/** 加载中绘图区的骨架：柱状图是一排高低不一的柱（横向时是条），其余是一整块 */\nfunction chartSkeleton({\n  skeleton = 'block',\n  horizontal = false,\n}: Pick<XYChartKind<object>, 'skeleton' | 'horizontal'>) {\n  if (skeleton === 'block') return <Skeleton sx={xyChartStyles.skeleton} />;\n  return (\n    <div\n      aria-hidden=\"true\"\n      {...css.attrs(xyChartStyles.skeletonBars, horizontal && xyChartStyles.skeletonBarsHorizontal)}\n    >\n      {SKELETON_BARS.map((percent, position) => (\n        <Skeleton\n          key={position}\n          sx={[\n            xyChartStyles.skeletonBar,\n            horizontal\n              ? xyChartStyles.skeletonBarSizeHorizontal(`${percent}%`)\n              : xyChartStyles.skeletonBarSize(`${percent}%`),\n          ]}\n        />\n      ))}\n    </div>\n  );\n}\n\n/** 直角坐标图表的公共实现（组件库内部用，见 BarChart、LineChart、AreaChart） */\nexport const XYChart = _component(\n  <T extends object>({\n    data,\n    index,\n    series,\n    indexFormat,\n    valueFormat,\n    unit,\n    height = 240,\n    legend,\n    grid = true,\n    valueDomain,\n    tooltip = true,\n    loading = false,\n    _hiddenSeries: hiddenSeries = _bindable<string[]>([]),\n    empty,\n    targets,\n    annotations,\n    bands,\n    onItemClick,\n    zoom = false,\n    _zoomRange: zoomRange = _bindable<[number, number] | null>(null),\n    kind,\n    sx,\n    ...rest\n  }: XYChartProps<T> & { kind: XYChartKind<T> }) => {\n    const lang = useLang();\n    const format = useFormat();\n    const id = useId();\n    const resolved = _derived(resolveSeries(series));\n    const visible = _derived(resolved.filter((item) => !hiddenSeries.includes(item.key)));\n\n    const categoryText = (row: T | undefined) =>\n      row === undefined\n        ? ''\n        : indexFormat\n          ? indexFormat(row[index], row)\n          : String(row[index] ?? '');\n    const valueText = useChartValueText(() => ({ valueFormat, unit }));\n    const secondaryText = useChartValueText(() => ({\n      valueFormat: kind.secondary?.format,\n      unit: kind.secondary?.unit,\n    }));\n    const onSecondary = (key: string) => kind.secondary?.keys.includes(key) ?? false;\n    /** 一个系列的值的文字：第二数值轴上的按它的格式与单位 */\n    const seriesText = (key: string, value: NumericValue | undefined) =>\n      onSecondary(key) ? secondaryText(value) : valueText(value);\n    /** 一行里显示中的系列的总和（百分比堆叠的分母；负数不计） */\n    const rowTotal = (row: T) =>\n      visible.reduce((sum, item) => sum + Math.max(seriesNumber(row, item.key) ?? 0, 0), 0);\n    const percentText = (value: number) =>\n      format.number(value, { style: 'percent', maximumFractionDigits: 1 });\n\n    const xText = (row: T) => {\n      const x = kind.continuousX?.value(row);\n      return x === undefined ? lang.emptyValue : kind.continuousX!.format(x);\n    };\n\n    function toggle(key: string) {\n      hiddenSeries = hiddenSeries.includes(key)\n        ? hiddenSeries.filter((item) => item !== key)\n        : [...hiddenSeries, key];\n    }\n\n    /** 缩放的滑块：两端是类目；缩小过时旁边有“显示全部” */\n    const zoomBar = () => {\n      const last = data.length - 1;\n      return (\n        <div {...css.attrs(xyChartStyles.zoom)}>\n          <Slider\n            _value={zoomRange ?? [0, last]}\n            onUpdate:_value={(next: [number, number]) =>\n              (zoomRange = next[0] === 0 && next[1] === last ? null : next)\n            }\n            min={0}\n            max={last}\n            step={1}\n            size=\"sm\"\n            valueText={(position) => categoryText(data[position])}\n            aria-label={lang.chartZoom}\n            propsRoot={{ sx: xyChartStyles.zoomSlider }}\n          />\n          {zoomRange && (\n            <Button variant=\"link\" size=\"sm\" onClick={() => (zoomRange = null)}>\n              {lang.chartZoomReset}\n            </Button>\n          )}\n        </div>\n      );\n    };\n\n    const instances = createChartInstances();\n    let tooltipElement: HTMLElement | undefined;\n    // 提示框的内容渲染进 Unovis 管的元素：带上调用处的主题与语言，组件卸载时一起卸载\n    const renderDetached = useDetachedRender();\n\n    // 指针所在的那一行：十字线移动时记下，点绘图区时下钻到它；离开绘图区时清掉\n    let hovered: { row: T; index: number } | null = null;\n    const hover = (row: T | undefined) => {\n      hovered = row === undefined ? null : { row, index: data.indexOf(row) };\n    };\n\n    /** 十字线的提示框：内容用 Vue 渲染进同一个元素，交给 Unovis 定位 */\n    function renderTooltip(row: T) {\n      tooltipElement ??= document.createElement('div');\n      // 跟着数据点的提示框（散点图）没有十字线：悬停哪个点就是哪一行\n      if (kind.pointTooltip) hover(row);\n      renderDetached(\n        chartTooltip(\n          categoryText(row),\n          kind.tooltipItems?.(row) ?? [\n            ...(kind.continuousX\n              ? [{ label: kind.continuousX.label, color: 'transparent', value: xText(row) }]\n              : []),\n            // 跟着数据点的提示框只列这一行有值的系列（散点图里一行通常只落在一个系列上）\n            ...visible\n              .filter((item) => !kind.pointTooltip || seriesValue(row, item.key) !== undefined)\n              .map((item) => {\n                const value = seriesValue(row, item.key);\n                const total = kind.percent ? rowTotal(row) : 0;\n                return {\n                  label: item.label,\n                  color: item.color,\n                  value:\n                    kind.percent && value !== undefined && total > 0\n                      ? `${seriesText(item.key, value)}（${percentText(toNumber(value) / total)}）`\n                      : seriesText(item.key, value),\n                };\n              }),\n          ],\n        ),\n        tooltipElement,\n      );\n      return tooltipElement;\n    }\n\n    let plot = _state.raw<HTMLElement | null>(null);\n    const seen = usePlotSeen(() => plot);\n    let container: XYContainer<T> | undefined;\n    let containerElement: HTMLElement | undefined;\n    _effect(() => () => {\n      container?.destroy();\n    });\n    _effect(() => {\n      // 缩放：只画选中的一段（散点图的横轴是连续的数值，不按类目缩放）\n      const range = zoom && !kind.continuousX ? zoomRange : null;\n      const rows = range ? data.slice(range[0], range[1] + 1) : [...data];\n      const shown = visible;\n      const element = plot;\n      if (!element || loading || rows.length === 0 || !seen()) return;\n      // 绘图区换了元素：旧容器连同它的组件、坐标轴一起销毁，实例表清空后重新创建\n      if (container && containerElement !== element) {\n        container.destroy();\n        container = undefined;\n        instances.reset();\n      }\n\n      const primarySeries = shown.filter((item) => !onSecondary(item.key));\n      const secondarySeries = shown.filter((item) => onSecondary(item.key));\n      const totals = rows.map((row) =>\n        primarySeries.map((item) => seriesNumber(row, item.key) ?? 0),\n      );\n      const seriesValues = kind.domainValues\n        ? kind.domainValues(rows, primarySeries)\n        : kind.stacked\n          ? totals.flatMap((row) => [\n              row.reduce((sum, value) => sum + Math.max(value, 0), 0),\n              row.reduce((sum, value) => sum + Math.min(value, 0), 0),\n            ])\n          : totals.flat();\n      // 目标线、数值轴上的区间要落在数值轴的范围里\n      const values = [\n        ...seriesValues,\n        ...(targets ?? []).map((target) => toNumber(target.value)),\n        ...(bands ?? [])\n          .filter((band) => band.axis === 'value')\n          .flatMap((band) => [Number(band.from), Number(band.to)]),\n      ];\n      // 第二数值轴：两条轴的刻度对齐，第二轴的值换算到主轴的坐标\n      const aligned: AlignedAxes | undefined =\n        secondarySeries.length > 0\n          ? alignedTicks(\n              [\n                ...values,\n                ...[valueDomain?.[0], valueDomain?.[1]].filter(\n                  (end): end is number => end !== undefined,\n                ),\n              ],\n              rows.flatMap((row) =>\n                secondarySeries.map((item) => seriesNumber(row, item.key) ?? 0),\n              ),\n            )\n          : undefined;\n      const domain: [number | undefined, number | undefined] = kind.percent\n        ? [0, 1]\n        : aligned\n          ? aligned.primary.domain\n          : [\n              valueDomain?.[0] ??\n                (kind.zeroBaseline === false ? undefined : Math.min(0, ...values)),\n              valueDomain?.[1],\n            ];\n      const x = kind.continuousX\n        ? (row: T) => kind.continuousX!.value(row) ?? Number.NaN\n        : (_row: T, position: number) => position;\n      const y = (item: (typeof shown)[number]) => {\n        if (kind.percent)\n          return (row: T) => {\n            const value = seriesNumber(row, item.key);\n            const total = rowTotal(row);\n            return value === undefined || total === 0 ? undefined : value / total;\n          };\n        if (aligned && onSecondary(item.key))\n          return (row: T) => {\n            const value = seriesNumber(row, item.key);\n            return value === undefined ? undefined : aligned.toPrimary(value);\n          };\n        return (row: T) => seriesNumber(row, item.key);\n      };\n      /** 类目在类目轴上的位置：散点图是横轴的数值，其余是第几行；找不到时 undefined */\n      const positionOf = (at: unknown) => {\n        if (kind.continuousX) return Number(at);\n        const found = rows.findIndex((row) => row[index] === at);\n        return found < 0 ? undefined : found;\n      };\n      const categoryAxisName = kind.horizontal ? AxisType.Y : AxisType.X;\n      const valueAxisName = kind.horizontal ? AxisType.X : AxisType.Y;\n      const lines = (targets ?? []).map((target, position) => {\n        const line = instances.get(`target-${position}`, () => new Plotline<T>({}));\n        const value = toNumber(target.value);\n        const label = valueText(target.value);\n        line.setConfig({\n          axis: kind.horizontal ? 'x' : 'y',\n          value,\n          color: resolveColor(target.color ?? 'danger', 0),\n          lineWidth: 1.5,\n          lineStyle: PlotlineLineStylePresets.Dash,\n          labelText: target.label ? `${target.label} ${label}` : label,\n          labelPosition: kind.horizontal\n            ? PlotlineLabelPosition.TopRight\n            : PlotlineLabelPosition.TopLeft,\n          labelOffsetX: 4,\n          labelOffsetY: 10,\n        });\n        return line;\n      });\n\n      // 区间：浅色的带，文字在左上角\n      const bandComponents = (bands ?? []).flatMap((band, position) => {\n        const onIndex = band.axis !== 'value';\n        const from = onIndex ? positionOf(band.from) : Number(band.from);\n        const to = onIndex ? positionOf(band.to) : Number(band.to);\n        if (from === undefined || to === undefined) return [];\n        // 类目轴上的区间盖住两端的类目：往外各扩半格\n        const half = onIndex && !kind.continuousX ? 0.5 : 0;\n        const plotband = instances.get(`band-${position}`, () => new Plotband<T>({}));\n        plotband.setConfig({\n          axis: onIndex ? categoryAxisName : valueAxisName,\n          from: Math.min(from, to) - half,\n          to: Math.max(from, to) + half,\n          color: `color-mix(in srgb, ${resolveColor(band.color ?? 'neutral', 0)} 12%, transparent)`,\n          labelText: band.label,\n          // 类目轴上的区间文字在左下角：顶上留给事件竖线的文字\n          labelPosition: onIndex\n            ? PlotbandLabelPosition.BottomLeftInside\n            : PlotbandLabelPosition.TopLeftInside,\n          labelColor: colors.textMuted,\n          labelOffsetX: 6,\n          labelOffsetY: 6,\n        });\n        return [plotband];\n      });\n\n      // 标注：事件是类目上的竖线；圈出的值是一个空心圈，文字在上方\n      const events = (annotations ?? []).filter((item) => item.series === undefined);\n      const eventLines = events.flatMap((item, position) => {\n        const at = positionOf(item.at);\n        if (at === undefined) return [];\n        const line = instances.get(`event-${position}`, () => new Plotline<T>({}));\n        line.setConfig({\n          axis: categoryAxisName,\n          value: at,\n          color: resolveColor(item.color ?? 'neutral', 0),\n          lineWidth: 1,\n          lineStyle: PlotlineLineStylePresets.ShortDash,\n          labelText: item.label,\n          labelPosition: kind.horizontal\n            ? PlotlineLabelPosition.BottomRight\n            : PlotlineLabelPosition.TopRight,\n          labelOffsetX: 4,\n          labelOffsetY: 4,\n        });\n        return [line];\n      });\n      const marked = (annotations ?? []).filter(\n        (item) => item.series !== undefined && !kind.horizontal,\n      );\n      const markOf = (row: T) => {\n        const at = kind.continuousX ? kind.continuousX.value(row) : rows.indexOf(row);\n        return marked.find(\n          (item) =>\n            positionOf(item.at) === at && shown.some((series) => series.key === item.series),\n        );\n      };\n      /** 圈的位置：系列的值；堆叠时是它在这一摞里的顶端 */\n      const markY = (row: T) => {\n        const mark = markOf(row);\n        if (!mark) return undefined;\n        const series = shown.find((item) => item.key === mark.series)!;\n        if (!kind.stacked || kind.percent) return y(series)(row);\n        const upTo = shown.slice(0, shown.indexOf(series) + 1);\n        return upTo.reduce((sum, item) => sum + Math.max(y(item)(row) ?? 0, 0), 0);\n      };\n      const markColor = (row: T) => {\n        const mark = markOf(row);\n        const series = shown.find((item) => item.key === mark?.series);\n        return mark?.color ? resolveColor(mark.color, 0) : (series?.color ?? colors.textMuted);\n      };\n      const marks = instances.get('marks', () => new Scatter<T>({ x, y: () => undefined }));\n      marks.setConfig({\n        x,\n        y: markY,\n        size: 16,\n        color: 'transparent',\n        strokeColor: markColor,\n        strokeWidth: 2,\n        label: (row: T) => markOf(row)?.label ?? '',\n        labelPosition: Position.Top,\n        labelColor: colors.text,\n      });\n\n      // 第二数值轴的刻度：与主轴的刻度同高，文字在绘图区右侧（不裁剪的 Plotline 标签，线本身透明）\n      const secondaryLabels = aligned\n        ? aligned.secondary.ticks.map((tick, position) => {\n            const label = instances.get(`secondary-${position}`, () => {\n              const line = new Plotline<T>({});\n              line.clippable = false;\n              return line;\n            });\n            label.setConfig({\n              axis: 'y',\n              value: aligned.primary.ticks[position]!,\n              color: 'transparent',\n              lineWidth: 0,\n              labelText: format.number(tick, kind.secondary?.format),\n              labelPosition: PlotlineLabelPosition.Right,\n              labelOffsetX: -(SECONDARY_AXIS_WIDTH - 4),\n              labelColor: colors.textMuted,\n            });\n            return label;\n          })\n        : [];\n      const components = [\n        ...bandComponents,\n        ...kind.components({\n          series: shown,\n          x,\n          y,\n          instance: instances.get,\n          events:\n            kind.itemSelector && onItemClick\n              ? {\n                  [kind.itemSelector]: {\n                    // 分组柱给的是原来的行；堆叠柱给的是拼出来的副本，第三个参数才是行的位置\n                    click: (row: T, _event: Event, index: number) => {\n                      const position = data.indexOf(row);\n                      const at = position >= 0 ? position : index;\n                      onItemClick(data[at] ?? row, at);\n                    },\n                  },\n                }\n              : {},\n        }),\n        ...lines,\n        ...eventLines,\n        ...(marked.length > 0 ? [marks] : []),\n        ...secondaryLabels,\n      ];\n      const xAxis = instances.get('xAxis', () => new Axis<T>({ type: 'x' }));\n      const yAxis = instances.get('yAxis', () => new Axis<T>({ type: 'y' }));\n      const crosshair = instances.get('crosshair', () => new Crosshair<T>());\n      const tooltipBox = instances.get('tooltip', () => new Tooltip());\n      const [categoryAxis, valueAxis] = kind.horizontal ? [yAxis, xAxis] : [xAxis, yAxis];\n      const continuous = kind.continuousX;\n      categoryAxis.setConfig({\n        type: kind.horizontal ? 'y' : 'x',\n        // 连续的横轴：Unovis 自己取刻度，网格线与数值轴一样；类目轴：每行一个刻度\n        tickValues: continuous ? undefined : rows.map((_row, position) => position),\n        numTicks: continuous ? 6 : undefined,\n        tickFormat: continuous\n          ? (tick) => continuous.format(Number(tick))\n          : (tick) => categoryText(rows[Number(tick)]),\n        gridLine: continuous ? grid : false,\n        tickLine: false,\n        domainLine: false,\n        tickTextHideOverlapping: true,\n        tickPadding: 8,\n        label: continuous?.title,\n        labelMargin: 8,\n      });\n      valueAxis.setConfig({\n        type: kind.horizontal ? 'x' : 'y',\n        numTicks: 5,\n        // 有第二数值轴时用对齐的刻度，两边的刻度落在同一组网格线上\n        tickValues: aligned?.primary.ticks,\n        tickFormat: (tick) =>\n          kind.percent\n            ? format.number(Number(tick), { style: 'percent', maximumFractionDigits: 0 })\n            : format.number(Number(tick), valueFormat),\n        gridLine: grid,\n        tickLine: false,\n        domainLine: false,\n        tickPadding: 8,\n      });\n      const dotted = kind.crosshairSeries ? shown.filter(kind.crosshairSeries) : shown;\n      crosshair.setConfig({\n        // 访问器直接给：容器还没按尺寸渲染过时不会把组件的访问器转交十字线，Unovis 会报 “Y accessors have not been configured”\n        x,\n        ...(kind.stacked ? { yStacked: dotted.map(y) } : { y: dotted.map(y) }),\n        template: (row: T) => renderTooltip(row),\n        color: (_row: T, position: number) => dotted[position]?.color ?? 'transparent',\n        getCircles: kind.crosshairDots ? undefined : () => [],\n        hideWhenFarFromPointer: false,\n        onCrosshairMove: (_x, row) => hover(row),\n      });\n\n      tooltipBox.setConfig({\n        triggers: kind.pointTooltip ? { [kind.pointTooltip]: (row: T) => renderTooltip(row) } : {},\n      });\n      const config = {\n        components,\n        xAxis,\n        yAxis,\n        // 能下钻时没有提示框也要十字线：靠它知道指针在哪一行\n        crosshair:\n          (tooltip || (onItemClick && !kind.itemSelector)) && !kind.pointTooltip\n            ? crosshair\n            : undefined,\n        tooltip: tooltip ? tooltipBox : undefined,\n        [kind.horizontal ? 'xDomain' : 'yDomain']: domain,\n        // 第二数值轴的刻度文字画在右侧留出的空白里\n        padding: aligned\n          ? { ...kind.padding, right: Math.max(kind.padding?.right ?? 0, SECONDARY_AXIS_WIDTH) }\n          : (kind.padding ?? {}),\n        ariaLabel: null,\n        duration: chartDuration(element),\n        onRenderComplete: haloPlotlineLabels,\n      };\n      if (container) container.update(config, undefined, rows);\n      else {\n        container = new XYContainer<T>(element, config, rows);\n        containerElement = element;\n        uniqueHighlightFilter(element, `${id}-highlight`);\n      }\n    });\n\n    return () => (\n      <ChartFrame\n        {...rest}\n        sx={[!kind.crosshairDots && xyChartStyles.hideCrosshairLine, sx]}\n        // 百分比堆叠时数值轴是占比：轴上方不写单位（提示框、数据表里仍带）\n        unit={kind.percent ? undefined : unit}\n        unitEnd={kind.secondary?.unit}\n        height={height}\n        legend={(legend ?? resolved.length > 1) ? resolved : []}\n        hiddenKeys={hiddenSeries}\n        onLegendToggle={toggle}\n        loading={loading}\n        skeleton={chartSkeleton(kind)}\n        isEmpty={data.length === 0}\n        empty={empty}\n        clickable={onItemClick != null}\n        onPlotClick={\n          onItemClick && !kind.itemSelector\n            ? () => {\n                if (hovered) onItemClick(hovered.row, hovered.index);\n              }\n            : undefined\n        }\n        table={\n          kind.table?.(data) ?? {\n            columns: [\n              lang.chartCategory,\n              ...(kind.continuousX ? [kind.continuousX.label] : []),\n              ...resolved.map((item) => {\n                const itemUnit = onSecondary(item.key) ? kind.secondary?.unit : unit;\n                return itemUnit ? `${item.label}（${itemUnit}）` : item.label;\n              }),\n            ],\n            rows: data.map((row) => ({\n              header: categoryText(row),\n              cells: [\n                ...(kind.continuousX ? [xText(row)] : []),\n                ...resolved.map((item) => {\n                  const value = seriesValue(row, item.key);\n                  return value === undefined\n                    ? lang.emptyValue\n                    : format.number(\n                        value,\n                        onSecondary(item.key) ? kind.secondary?.format : valueFormat,\n                      );\n                }),\n              ],\n            })),\n          }\n        }\n        plotRef={(element) => (plot = element)}\n        footer={zoom && !kind.continuousX && data.length > 2 ? zoomBar() : undefined}\n      />\n    );\n  },\n);\n\n/**\n * 目标线、事件竖线的文字描一圈表面色的边（同地图上地点的名字）：压在柱子、折线上也看得清。\n * Unovis 的 Plotline 文字没有描边的配置项，渲染完成后补在元素上；导出图片时按计算样式一并带走\n */\nfunction haloPlotlineLabels(svg: SVGSVGElement) {\n  for (const label of svg.querySelectorAll<SVGTextElement>('text[class*=\"plotline-label\"]')) {\n    label.style.setProperty('paint-order', 'stroke');\n    label.style.setProperty('stroke', colors.surface);\n    label.style.setProperty('stroke-width', '3px');\n    label.style.setProperty('stroke-linejoin', 'round');\n  }\n}\n"],"mappings":"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"}

package/dist/charts/frame.d.ts

@@ -1,4 +1,4 @@
-import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
 import { type VNodeChild } from 'vue';
 import { type ButtonBaseProps } from '../base/ButtonBase';
 import { type NumericFormat } from '../config/lang/format';

package/dist/charts/frame.js

@@ -13,7 +13,7 @@ import { Menu as Menu$1, MenuItem } from "../overlay/Menu.js";
 import { exportChartData, exportChartImage } from "./export.js";
 import { createVNode, shallowRef, watch } from "vue";
 import { _component, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
-import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 import { Download, FileSpreadsheet, ImageDown } from "@lucide/icons";
 //#region src/charts/frame.tsx
 /** 图例里的一项 */

package/dist/charts/frame.js.map

@@ -1 +1 @@
-{"version":3,"file":"frame.js","names":["_createVNode","_mergeProps","_vtp_readonlyProp","_vtp_restProps","Menu"],"sources":["../../src/charts/frame.tsx"],"sourcesContent":["/**\n * 各种图表共用的外层结构（XYChart、DonutChart、SankeyChart、ChordChart、FunnelChart、GraphChart）：外层 figure、单位与图例、绘图区（加载中的骨架、空状态、Unovis 画布）、\n * 给读屏的数据表；还有提示框的内容、Unovis 实例表与主题变量。\n *\n *   <ChartFrame unit=\"万元\" legend={items} hiddenKeys={hidden} onLegendToggle={toggle} loading={loading}\n *     isEmpty={rows.length === 0} skeleton={…} table={{ columns, rows }} plotRef={(el) => (plot = el)} />\n *\n * 外观全走主题：Unovis 的样式由 --vis-* 变量控制，这里把它们指到 tokens 上；系列颜色是 CSS 变量，\n * 切换主题、改品牌色都不用重画。绘图区对读屏隐藏，数据由同样内容的表格读出。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { shallowRef, watch, type VNodeChild } from 'vue';\nimport { Download, FileSpreadsheet, ImageDown } from '@lucide/icons';\nimport { ButtonBase, type ButtonBaseProps } from '../base/ButtonBase';\nimport { IconButton } from '../base/IconButton';\nimport { Menu, MenuItem } from '../overlay/Menu';\nimport { exportChartData, exportChartImage } from './export';\nimport { visuallyHiddenStyles } from '../base/VisuallyHidden';\nimport { useLang } from '../config/context';\nimport { useFormat, type NumericFormat } from '../config/lang/format';\nimport {\n  borderWidths,\n  colors,\n  durations,\n  fonts,\n  fontSizes,\n  fontWeights,\n  radii,\n  shadows,\n  space,\n  t,\n} from '../config/theme/tokens';\nimport { Empty } from '../feedback/Empty';\nimport type { NumericValue } from '../utils/data/numeric';\nimport { themeTransition } from '../utils/motion/animation';\nimport { useEventListener } from '../utils/dom/event-listener';\nimport { useIntersectionObserver } from '../utils/dom/intersection';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\n\n/** 图例里的一项 */\nexport interface ChartLegendItem {\n  /** 系列（或扇区）的 key */\n  key: string;\n  /** 显示的名字 */\n  label: string;\n  /** CSS 颜色 */\n  color: string;\n}\n\n/** 给读屏的数据表：列名与每一行（行标题加各列的文字） */\nexport interface ChartTable {\n  /** 列名：第一列是行标题的列 */\n  columns: readonly string[];\n  /** 每一行：行标题加其余各列的文字 */\n  rows: readonly { header: string; cells: readonly string[] }[];\n}\n\n/** 各种图表共有的选项与部件属性 */\nexport interface ChartFrameParts {\n  /** 右上角的导出菜单：绘图区存成 PNG 图片、数据表存成 CSV */\n  exportable?: boolean;\n  /** 导出的文件名（不含扩展名）；不写时用图表的名称（aria-label） */\n  exportName?: string;\n  /** 图表上方一行（单位与图例）的部件属性 */\n  propsHeader?: PartProps<'div'>;\n  /** 单位的部件属性 */\n  propsUnit?: PartProps<'span'>;\n  /** 图例的部件属性 */\n  propsLegend?: PartProps<'div', 'role'>;\n  /** 图例每一项（按钮）的部件属性 */\n  propsLegendItem?: Omit<Partial<ButtonBaseProps>, 'aria-pressed' | 'onClick'>;\n  /** 绘图区（Unovis 画在这里）的部件属性 */\n  propsPlot?: PartProps<'div', 'aria-hidden'>;\n  /** 给读屏的数据表的部件属性 */\n  propsTable?: PartProps<'table'>;\n}\n\n/** 图表共用的样式：root（--vis-* 主题变量）、header、unit、legend、swatch、plot、tooltip… */\nexport const chartStyles = css.create({\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '_sm',\n    // 在居中、弹性布局的容器里也占满一行：绘图区按容器宽度自适应\n    width: '100%',\n    minWidth: 0,\n    fontSize: '_sm',\n    // Unovis 的外观变量：坐标轴、网格、十字线、提示框、标签都指到主题 tokens\n    '--vis-font-family': fonts.sans,\n    '--vis-axis-tick-label-font-size': fontSizes.xs,\n    '--vis-axis-tick-label-color': colors.textMuted,\n    '--vis-axis-label-color': colors.textMuted,\n    '--vis-axis-label-font-size': fontSizes.xs,\n    '--vis-axis-label-weight': fontWeights.normal,\n    '--vis-axis-grid-color': colors.borderMuted,\n    '--vis-axis-domain-color': colors.border,\n    '--vis-axis-tick-color': colors.border,\n    '--vis-crosshair-line-stroke-color': colors.borderStrong,\n    '--vis-crosshair-circle-stroke-color': colors.surface,\n    '--vis-tooltip-background-color': colors.surfaceRaised,\n    '--vis-tooltip-border-color': colors.borderMuted,\n    '--vis-tooltip-text-color': colors.text,\n    '--vis-tooltip-border-radius': radii.md,\n    '--vis-tooltip-box-shadow': shadows.md,\n    '--vis-tooltip-padding': `${space.sm} ${space.md}`,\n    '--vis-tooltip-backdrop-filter': 'none',\n    '--vis-tooltip-transition-duration': durations.sm,\n    '--vis-grouped-bar-hover-stroke-width': '0',\n    // 环形图：底色、扇区之间的缝、中间的标签\n    '--vis-donut-background-color': colors.fill,\n    '--vis-donut-segment-stroke-width': borderWidths.md,\n    '--vis-donut-central-label-text-color': colors.text,\n    '--vis-donut-central-label-font-size': fontSizes.xl,\n    '--vis-donut-central-sub-label-text-color': colors.textMuted,\n    '--vis-donut-central-sub-label-font-size': fontSizes.xs,\n    // 目标线：虚线，标签是小号的次要文字（颜色由各条线自己给）\n    '--vis-plotline-label-font-size': fontSizes.xs,\n    '--vis-plotline-label-color': colors.textMuted,\n  },\n  header: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    gap: '_md',\n    minHeight: '1.5em',\n  },\n  unit: { color: '_textMuted', fontSize: '_xs' },\n  legend: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    justifyContent: 'flex-end',\n    gap: `${t.space.xs} ${t.space.md}`,\n    marginInlineStart: 'auto',\n  },\n  // 图例项：ButtonBase 给出焦点环与按下的反馈，这里只定文字\n  legendItem: {\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: '_xs',\n    color: { default: '_textMuted', ':hover': '_text' },\n    fontSize: '_xs',\n    borderRadius: '_sm',\n  },\n  // 隐藏的系列：划线、色块变空心；不降低不透明度，文字仍要满足对比度\n  legendItemHidden: { textDecorationLine: 'line-through' },\n  swatch: {\n    width: '0.625em',\n    height: '0.625em',\n    borderRadius: '_sm',\n    flexShrink: 0,\n  },\n  swatchColor: (color: string) => ({ backgroundColor: color }),\n  swatchHidden: (color: string) => ({\n    backgroundColor: 'transparent',\n    boxShadow: `inset 0 0 0 ${borderWidths.md} ${color}`,\n  }),\n  // contain: inline-size：画好的 SVG 写死了宽度，不能让它反过来撑住按内容定宽的外层（表格式的滚动区、\n  // 起始对齐的弹性布局）；不然容器变窄时图表还是原来那么宽，Unovis 量不到变化也就不重画\n  plot: { position: 'relative', minWidth: 0, contain: 'inline-size' },\n  // 点了能下钻：手形指针\n  plotClickable: { cursor: 'pointer' },\n  plotHeight: (height: string) => ({ height }),\n  center: { display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%' },\n  tooltip: { display: 'flex', flexDirection: 'column', gap: '_xs', fontSize: '_xs' },\n  tooltipTitle: { fontWeight: '_semibold' },\n  tooltipRow: { display: 'flex', alignItems: 'center', gap: '_sm' },\n  tooltipLabel: { color: '_textMuted', flexGrow: 1 },\n  tooltipValue: {\n    fontVariantNumeric: 'tabular-nums',\n    fontWeight: '_medium',\n    marginInlineStart: '_lg',\n  },\n});\n\n/** 提示框的一行 */\nexport interface ChartTooltipItem {\n  /** 系列或数值的名字 */\n  label: string;\n  /** 色块的 CSS 颜色；transparent 时不画色块 */\n  color: string;\n  /** 格式化好的数值 */\n  value: string;\n}\n\n/** 提示框的内容：标题（类目、扇区名）+ 每个系列一行；Unovis 定位，Vue 渲染 */\nexport function chartTooltip(title: string, items: readonly ChartTooltipItem[]) {\n  return (\n    <div {...css.attrs(chartStyles.tooltip)}>\n      {title && <div {...css.attrs(chartStyles.tooltipTitle)}>{title}</div>}\n      {items.map((item) => (\n        <div key={item.label} {...css.attrs(chartStyles.tooltipRow)}>\n          <span {...css.attrs(chartStyles.swatch, chartStyles.swatchColor(item.color))} />\n          <span {...css.attrs(chartStyles.tooltipLabel)}>{item.label}</span>\n          <span {...css.attrs(chartStyles.tooltipValue)}>{item.value}</span>\n        </div>\n      ))}\n    </div>\n  );\n}\n\n/**\n * 图表里数值的文字（提示框、读屏数据表、扇区标签）：按 valueFormat 格式化、带上单位；\n * 没有值时是语言包的 emptyValue。setup 里调用，返回的函数在渲染里用\n */\nexport function useChartValueText(read: () => { valueFormat?: NumericFormat; unit?: string }) {\n  const lang = useLang();\n  const format = useFormat();\n  return (value: NumericValue | undefined) => {\n    if (value === undefined) return lang.emptyValue;\n    const { valueFormat, unit } = read();\n    return format.number(value, unit ? { ...valueFormat, suffix: unit } : valueFormat);\n  };\n}\n\n/** 绘图区离视口多近就算看见了（px）：滚到之前先画好，进来时已经是画好的 */\nconst SEEN_MARGIN = 200;\n\n/**\n * 绘图区进入过视口：之前不画，进来之后一直算看见（滚出去不拆掉）。一页很多图表时先画看得见的，\n * 其余的滚到附近再画（地图、网络图绘制很重）。在 setup 里调用，绘制的 effect 里读返回的函数。\n * 挂上时就在视口附近的立即算看见（不等观察器的第一次回调；没有布局的测试环境里框都在原点，也算看见）；\n * 打印前全部画上；没有 IntersectionObserver 的环境当作看见了。\n */\nexport function usePlotSeen(plot: () => HTMLElement | null | undefined): () => boolean {\n  const seen = shallowRef(typeof IntersectionObserver === 'undefined');\n  const near = (element: Element) => {\n    const box = element.getBoundingClientRect();\n    return (\n      box.top < window.innerHeight + SEEN_MARGIN &&\n      box.bottom > -SEEN_MARGIN &&\n      box.left < window.innerWidth + SEEN_MARGIN &&\n      box.right > -SEEN_MARGIN\n    );\n  };\n  watch(\n    plot,\n    (element) => {\n      if (element && !seen.value && near(element)) seen.value = true;\n    },\n    { immediate: true, flush: 'post' },\n  );\n  useIntersectionObserver(\n    () => (seen.value ? null : plot()),\n    (entries) => {\n      if (entries.some((entry) => entry.isIntersecting)) seen.value = true;\n    },\n    () => ({ rootMargin: `${SEEN_MARGIN}px` }),\n  );\n  useEventListener(\n    () => window,\n    'beforeprint',\n    () => (seen.value = true),\n  );\n  return () => seen.value;\n}\n\n/** 主题的 lg 时长（毫秒），减少动态效果时为 0；读不到（元素不在主题范围内）时不要动画 */\nexport function chartDuration(element: Element): number {\n  try {\n    return themeTransition(element, { duration: 'lg' }).duration ?? 0;\n  } catch {\n    return 0;\n  }\n}\n\n/**\n * Unovis 每个容器都插一个 id 固定为 saturate 的滤镜（悬停高亮用），一页多张图时 id 重复；\n * 改成每张图自己的 id，并让引用它的 CSS 变量指过去\n */\nexport function uniqueHighlightFilter(element: HTMLElement, id: string): void {\n  const filter = element.querySelector<SVGFilterElement>('filter#saturate');\n  if (!filter) return;\n  filter.id = id;\n  element.querySelector('svg')?.style.setProperty('--highlight-filter-id', `url(#${id})`);\n}\n\n/**\n * Unovis 实例表：组件、坐标轴、十字线只建一次，之后 setConfig + update（保留实例才有过渡动画）。\n * 容器 destroy 时会连带销毁这些实例：重建容器前 reset，下次取用时重新创建\n */\nexport function createChartInstances() {\n  let instances = new Map<string, unknown>();\n  return {\n    /** 取一个实例：第一次调用时创建 */\n    get: <C,>(key: string, create: () => C): C => {\n      if (!instances.has(key)) instances.set(key, create());\n      return instances.get(key) as C;\n    },\n    /** 容器销毁了：清空，之后重新创建 */\n    reset() {\n      instances = new Map();\n    },\n  };\n}\n\n/** ChartFrame 的属性：未声明的属性落到外层 div（role=\"figure\"）上 */\nexport interface ChartFrameProps extends PartProps<'div', 'role' | 'aria-busy'>, ChartFrameParts {\n  /** 单位：显示在左上方 */\n  unit?: string;\n  /** 第二数值轴的单位：显示在右上方（组合图） */\n  unitEnd?: string;\n  /** 绘图区的高度 */\n  height: number | string;\n  /** 图例的各项；空数组时不显示图例 */\n  legend: readonly ChartLegendItem[];\n  /** 图例里隐藏着的项 */\n  hiddenKeys: readonly string[];\n  /** 点了图例的一项 */\n  onLegendToggle: (key: string) => void;\n  /** 加载中：绘图区显示 skeleton，外层带 aria-busy */\n  loading: boolean;\n  /** 加载中显示的骨架 */\n  skeleton: VNodeChild;\n  /** 没有数据：绘图区显示空状态，没有数据表 */\n  isEmpty: boolean;\n  /** 空状态的内容，默认是“暂无数据” */\n  empty?: VNodeChild;\n  /** 给读屏的数据表 */\n  table: ChartTable;\n  /** 取得绘图区元素（Unovis 画在这里）；加载、空状态之后重新出现时是新的元素 */\n  plotRef?: (element: HTMLElement | null) => void;\n  /** 绘图区里直接渲染的内容（不用 Unovis 的图，如漏斗图）；同样对读屏隐藏 */\n  plot?: VNodeChild;\n  /** 绘图区下面的内容（缩放的滑块、地图的色带） */\n  footer?: VNodeChild;\n  /** 上方一行右端的操作（地图的缩放按钮），在导出菜单前面 */\n  actions?: VNodeChild;\n  /** 点了绘图区（下钻）：写了它时指针是手形 */\n  onPlotClick?: () => void;\n  /** 图里的项能点（手形指针），点击由图自己处理（环形图的扇区、网络图的节点） */\n  clickable?: boolean;\n}\n\n/** 图表的外层结构 */\nexport const ChartFrame = _component(\n  ({\n    unit,\n    unitEnd,\n    height,\n    legend,\n    hiddenKeys,\n    onLegendToggle,\n    loading,\n    skeleton,\n    isEmpty,\n    empty,\n    table,\n    plotRef,\n    footer,\n    actions,\n    plot,\n    onPlotClick,\n    clickable = false,\n    propsHeader,\n    propsUnit,\n    propsLegend,\n    propsLegendItem,\n    propsPlot,\n    propsTable,\n    exportable = false,\n    exportName,\n    ...rest\n  }: ChartFrameProps) => {\n    const lang = useLang();\n    const format = useFormat();\n    let plotElement: HTMLElement | null = null;\n    const fileName = () => exportName ?? rest['aria-label'] ?? lang.chartExportName;\n    /** 导出菜单：图片要绘图区里有 SVG（漏斗图这类直接用 HTML 画的没有） */\n    const exportMenu = () => (\n      <Menu\n        trigger={(props) => (\n          <IconButton\n            {...props}\n            icon={Download}\n            variant=\"ghost\"\n            tone=\"neutral\"\n            size=\"sm\"\n            aria-label={lang.chartExport}\n          />\n        )}\n      >\n        <MenuItem\n          icon={ImageDown}\n          onAction={() => {\n            const svg = plotElement?.querySelector('svg');\n            if (svg) void exportChartImage(svg, fileName());\n          }}\n        >\n          {lang.chartExportImage}\n        </MenuItem>\n        <MenuItem\n          icon={FileSpreadsheet}\n          onAction={() => exportChartData(table, format, fileName())}\n        >\n          {lang.chartExportData}\n        </MenuItem>\n      </Menu>\n    );\n    return () => {\n      const plotHeight = typeof height === 'number' ? `${height}px` : height;\n      const body = loading ? (\n        skeleton\n      ) : isEmpty ? (\n        <div {...css.attrs(chartStyles.center)}>\n          {empty ?? <Empty size=\"sm\" title={lang.chartEmpty} />}\n        </div>\n      ) : null;\n      return (\n        <div\n          {...mergeAttrs<'div'>({ sx: chartStyles.root }, rest, {\n            role: 'figure',\n            'aria-busy': loading || undefined,\n          })}\n        >\n          {(unit || unitEnd || legend.length > 0 || exportable || actions) && (\n            <div {...mergeAttrs<'div'>({ sx: chartStyles.header }, propsHeader)}>\n              {unit && (\n                <span {...mergeAttrs<'span'>({ sx: chartStyles.unit }, propsUnit)}>{unit}</span>\n              )}\n              {legend.length > 0 && (\n                <div\n                  {...mergeAttrs<'div'>({ sx: chartStyles.legend }, propsLegend, { role: 'group' })}\n                >\n                  {legend.map((item) => {\n                    const off = hiddenKeys.includes(item.key);\n                    return (\n                      <ButtonBase\n                        key={item.key}\n                        {...mergePartProps<ButtonBaseProps>(\n                          {\n                            sx: [chartStyles.legendItem, off && chartStyles.legendItemHidden],\n                            ripple: false,\n                          },\n                          propsLegendItem,\n                          { 'aria-pressed': !off, onClick: () => onLegendToggle(item.key) },\n                        )}\n                      >\n                        <span\n                          {...css.attrs(\n                            chartStyles.swatch,\n                            off\n                              ? chartStyles.swatchHidden(item.color)\n                              : chartStyles.swatchColor(item.color),\n                          )}\n                        />\n                        {item.label}\n                      </ButtonBase>\n                    );\n                  })}\n                </div>\n              )}\n              {unitEnd && (\n                <span {...mergeAttrs<'span'>({ sx: chartStyles.unit }, propsUnit)}>{unitEnd}</span>\n              )}\n              {!isEmpty && !loading && actions}\n              {exportable && !isEmpty && !loading && exportMenu()}\n            </div>\n          )}\n          {/* key 不同：两种状态不复用同一个 div，否则 Unovis 画进去的 svg 会留在骨架、空状态里 */}\n          {body ? (\n            <div key=\"state\" {...css.attrs(chartStyles.plot, chartStyles.plotHeight(plotHeight))}>\n              {body}\n            </div>\n          ) : (\n            <div\n              key=\"plot\"\n              {...mergeAttrs<'div'>(\n                {\n                  sx: [\n                    chartStyles.plot,\n                    chartStyles.plotHeight(plotHeight),\n                    (clickable || onPlotClick) && chartStyles.plotClickable,\n                  ],\n                },\n                propsPlot,\n                {\n                  'aria-hidden': true,\n                  ref: (element: unknown) => {\n                    plotElement = element instanceof HTMLElement ? element : null;\n                    plotRef?.(plotElement);\n                  },\n                  onClick: onPlotClick,\n                },\n              )}\n            >\n              {plot}\n            </div>\n          )}\n          {!body && footer}\n          {!isEmpty && (\n            <table {...mergeAttrs<'table'>({ sx: visuallyHiddenStyles.hidden }, propsTable)}>\n              <thead>\n                <tr>\n                  {table.columns.map((column) => (\n                    <th key={column} scope=\"col\">\n                      {column}\n                    </th>\n                  ))}\n                </tr>\n              </thead>\n              <tbody>\n                {table.rows.map((row, position) => (\n                  <tr key={position}>\n                    <th scope=\"row\">{row.header}</th>\n                    {row.cells.map((cell, column) => (\n                      <td key={column}>{cell}</td>\n                    ))}\n                  </tr>\n                ))}\n              </tbody>\n            </table>\n          )}\n        </div>\n      );\n    };\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"frame.js","names":["_createVNode","_mergeProps","_vtp_readonlyProp","_vtp_restProps","Menu"],"sources":["../../src/charts/frame.tsx"],"sourcesContent":["/**\n * 各种图表共用的外层结构（XYChart、DonutChart、SankeyChart、ChordChart、FunnelChart、GraphChart）：外层 figure、单位与图例、绘图区（加载中的骨架、空状态、Unovis 画布）、\n * 给读屏的数据表；还有提示框的内容、Unovis 实例表与主题变量。\n *\n *   <ChartFrame unit=\"万元\" legend={items} hiddenKeys={hidden} onLegendToggle={toggle} loading={loading}\n *     isEmpty={rows.length === 0} skeleton={…} table={{ columns, rows }} plotRef={(el) => (plot = el)} />\n *\n * 外观全走主题：Unovis 的样式由 --vis-* 变量控制，这里把它们指到 tokens 上；系列颜色是 CSS 变量，\n * 切换主题、改品牌色都不用重画。绘图区对读屏隐藏，数据由同样内容的表格读出。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { shallowRef, watch, type VNodeChild } from 'vue';\nimport { Download, FileSpreadsheet, ImageDown } from '@lucide/icons';\nimport { ButtonBase, type ButtonBaseProps } from '../base/ButtonBase';\nimport { IconButton } from '../base/IconButton';\nimport { Menu, MenuItem } from '../overlay/Menu';\nimport { exportChartData, exportChartImage } from './export';\nimport { visuallyHiddenStyles } from '../base/VisuallyHidden';\nimport { useLang } from '../config/context';\nimport { useFormat, type NumericFormat } from '../config/lang/format';\nimport {\n  borderWidths,\n  colors,\n  durations,\n  fonts,\n  fontSizes,\n  fontWeights,\n  radii,\n  shadows,\n  space,\n  t,\n} from '../config/theme/tokens';\nimport { Empty } from '../feedback/Empty';\nimport type { NumericValue } from '../utils/data/numeric';\nimport { themeTransition } from '../utils/motion/animation';\nimport { useEventListener } from '../utils/dom/event-listener';\nimport { useIntersectionObserver } from '../utils/dom/intersection';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\n\n/** 图例里的一项 */\nexport interface ChartLegendItem {\n  /** 系列（或扇区）的 key */\n  key: string;\n  /** 显示的名字 */\n  label: string;\n  /** CSS 颜色 */\n  color: string;\n}\n\n/** 给读屏的数据表：列名与每一行（行标题加各列的文字） */\nexport interface ChartTable {\n  /** 列名：第一列是行标题的列 */\n  columns: readonly string[];\n  /** 每一行：行标题加其余各列的文字 */\n  rows: readonly { header: string; cells: readonly string[] }[];\n}\n\n/** 各种图表共有的选项与部件属性 */\nexport interface ChartFrameParts {\n  /** 右上角的导出菜单：绘图区存成 PNG 图片、数据表存成 CSV */\n  exportable?: boolean;\n  /** 导出的文件名（不含扩展名）；不写时用图表的名称（aria-label） */\n  exportName?: string;\n  /** 图表上方一行（单位与图例）的部件属性 */\n  propsHeader?: PartProps<'div'>;\n  /** 单位的部件属性 */\n  propsUnit?: PartProps<'span'>;\n  /** 图例的部件属性 */\n  propsLegend?: PartProps<'div', 'role'>;\n  /** 图例每一项（按钮）的部件属性 */\n  propsLegendItem?: Omit<Partial<ButtonBaseProps>, 'aria-pressed' | 'onClick'>;\n  /** 绘图区（Unovis 画在这里）的部件属性 */\n  propsPlot?: PartProps<'div', 'aria-hidden'>;\n  /** 给读屏的数据表的部件属性 */\n  propsTable?: PartProps<'table'>;\n}\n\n/** 图表共用的样式：root（--vis-* 主题变量）、header、unit、legend、swatch、plot、tooltip… */\nexport const chartStyles = css.create({\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '_sm',\n    // 在居中、弹性布局的容器里也占满一行：绘图区按容器宽度自适应\n    width: '100%',\n    minWidth: 0,\n    fontSize: '_sm',\n    // Unovis 的外观变量：坐标轴、网格、十字线、提示框、标签都指到主题 tokens\n    '--vis-font-family': fonts.sans,\n    '--vis-axis-tick-label-font-size': fontSizes.xs,\n    '--vis-axis-tick-label-color': colors.textMuted,\n    '--vis-axis-label-color': colors.textMuted,\n    '--vis-axis-label-font-size': fontSizes.xs,\n    '--vis-axis-label-weight': fontWeights.normal,\n    '--vis-axis-grid-color': colors.borderMuted,\n    '--vis-axis-domain-color': colors.border,\n    '--vis-axis-tick-color': colors.border,\n    '--vis-crosshair-line-stroke-color': colors.borderStrong,\n    '--vis-crosshair-circle-stroke-color': colors.surface,\n    '--vis-tooltip-background-color': colors.surfaceRaised,\n    '--vis-tooltip-border-color': colors.borderMuted,\n    '--vis-tooltip-text-color': colors.text,\n    '--vis-tooltip-border-radius': radii.md,\n    '--vis-tooltip-box-shadow': shadows.md,\n    '--vis-tooltip-padding': `${space.sm} ${space.md}`,\n    '--vis-tooltip-backdrop-filter': 'none',\n    '--vis-tooltip-transition-duration': durations.sm,\n    '--vis-grouped-bar-hover-stroke-width': '0',\n    // 环形图：底色、扇区之间的缝、中间的标签\n    '--vis-donut-background-color': colors.fill,\n    '--vis-donut-segment-stroke-width': borderWidths.md,\n    '--vis-donut-central-label-text-color': colors.text,\n    '--vis-donut-central-label-font-size': fontSizes.xl,\n    '--vis-donut-central-sub-label-text-color': colors.textMuted,\n    '--vis-donut-central-sub-label-font-size': fontSizes.xs,\n    // 目标线：虚线，标签是小号的次要文字（颜色由各条线自己给）\n    '--vis-plotline-label-font-size': fontSizes.xs,\n    '--vis-plotline-label-color': colors.textMuted,\n  },\n  header: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    gap: '_md',\n    minHeight: '1.5em',\n  },\n  unit: { color: '_textMuted', fontSize: '_xs' },\n  legend: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    justifyContent: 'flex-end',\n    gap: `${t.space.xs} ${t.space.md}`,\n    marginInlineStart: 'auto',\n  },\n  // 图例项：ButtonBase 给出焦点环与按下的反馈，这里只定文字\n  legendItem: {\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: '_xs',\n    color: { default: '_textMuted', ':hover': '_text' },\n    fontSize: '_xs',\n    borderRadius: '_sm',\n  },\n  // 隐藏的系列：划线、色块变空心；不降低不透明度，文字仍要满足对比度\n  legendItemHidden: { textDecorationLine: 'line-through' },\n  swatch: {\n    width: '0.625em',\n    height: '0.625em',\n    borderRadius: '_sm',\n    flexShrink: 0,\n  },\n  swatchColor: (color: string) => ({ backgroundColor: color }),\n  swatchHidden: (color: string) => ({\n    backgroundColor: 'transparent',\n    boxShadow: `inset 0 0 0 ${borderWidths.md} ${color}`,\n  }),\n  // contain: inline-size：画好的 SVG 写死了宽度，不能让它反过来撑住按内容定宽的外层（表格式的滚动区、\n  // 起始对齐的弹性布局）；不然容器变窄时图表还是原来那么宽，Unovis 量不到变化也就不重画\n  plot: { position: 'relative', minWidth: 0, contain: 'inline-size' },\n  // 点了能下钻：手形指针\n  plotClickable: { cursor: 'pointer' },\n  plotHeight: (height: string) => ({ height }),\n  center: { display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%' },\n  tooltip: { display: 'flex', flexDirection: 'column', gap: '_xs', fontSize: '_xs' },\n  tooltipTitle: { fontWeight: '_semibold' },\n  tooltipRow: { display: 'flex', alignItems: 'center', gap: '_sm' },\n  tooltipLabel: { color: '_textMuted', flexGrow: 1 },\n  tooltipValue: {\n    fontVariantNumeric: 'tabular-nums',\n    fontWeight: '_medium',\n    marginInlineStart: '_lg',\n  },\n});\n\n/** 提示框的一行 */\nexport interface ChartTooltipItem {\n  /** 系列或数值的名字 */\n  label: string;\n  /** 色块的 CSS 颜色；transparent 时不画色块 */\n  color: string;\n  /** 格式化好的数值 */\n  value: string;\n}\n\n/** 提示框的内容：标题（类目、扇区名）+ 每个系列一行；Unovis 定位，Vue 渲染 */\nexport function chartTooltip(title: string, items: readonly ChartTooltipItem[]) {\n  return (\n    <div {...css.attrs(chartStyles.tooltip)}>\n      {title && <div {...css.attrs(chartStyles.tooltipTitle)}>{title}</div>}\n      {items.map((item) => (\n        <div key={item.label} {...css.attrs(chartStyles.tooltipRow)}>\n          <span {...css.attrs(chartStyles.swatch, chartStyles.swatchColor(item.color))} />\n          <span {...css.attrs(chartStyles.tooltipLabel)}>{item.label}</span>\n          <span {...css.attrs(chartStyles.tooltipValue)}>{item.value}</span>\n        </div>\n      ))}\n    </div>\n  );\n}\n\n/**\n * 图表里数值的文字（提示框、读屏数据表、扇区标签）：按 valueFormat 格式化、带上单位；\n * 没有值时是语言包的 emptyValue。setup 里调用，返回的函数在渲染里用\n */\nexport function useChartValueText(read: () => { valueFormat?: NumericFormat; unit?: string }) {\n  const lang = useLang();\n  const format = useFormat();\n  return (value: NumericValue | undefined) => {\n    if (value === undefined) return lang.emptyValue;\n    const { valueFormat, unit } = read();\n    return format.number(value, unit ? { ...valueFormat, suffix: unit } : valueFormat);\n  };\n}\n\n/** 绘图区离视口多近就算看见了（px）：滚到之前先画好，进来时已经是画好的 */\nconst SEEN_MARGIN = 200;\n\n/**\n * 绘图区进入过视口：之前不画，进来之后一直算看见（滚出去不拆掉）。一页很多图表时先画看得见的，\n * 其余的滚到附近再画（地图、网络图绘制很重）。在 setup 里调用，绘制的 effect 里读返回的函数。\n * 挂上时就在视口附近的立即算看见（不等观察器的第一次回调；没有布局的测试环境里框都在原点，也算看见）；\n * 打印前全部画上；没有 IntersectionObserver 的环境当作看见了。\n */\nexport function usePlotSeen(plot: () => HTMLElement | null | undefined): () => boolean {\n  const seen = shallowRef(typeof IntersectionObserver === 'undefined');\n  const near = (element: Element) => {\n    const box = element.getBoundingClientRect();\n    return (\n      box.top < window.innerHeight + SEEN_MARGIN &&\n      box.bottom > -SEEN_MARGIN &&\n      box.left < window.innerWidth + SEEN_MARGIN &&\n      box.right > -SEEN_MARGIN\n    );\n  };\n  watch(\n    plot,\n    (element) => {\n      if (element && !seen.value && near(element)) seen.value = true;\n    },\n    { immediate: true, flush: 'post' },\n  );\n  useIntersectionObserver(\n    () => (seen.value ? null : plot()),\n    (entries) => {\n      if (entries.some((entry) => entry.isIntersecting)) seen.value = true;\n    },\n    () => ({ rootMargin: `${SEEN_MARGIN}px` }),\n  );\n  useEventListener(\n    () => window,\n    'beforeprint',\n    () => (seen.value = true),\n  );\n  return () => seen.value;\n}\n\n/** 主题的 lg 时长（毫秒），减少动态效果时为 0；读不到（元素不在主题范围内）时不要动画 */\nexport function chartDuration(element: Element): number {\n  try {\n    return themeTransition(element, { duration: 'lg' }).duration ?? 0;\n  } catch {\n    return 0;\n  }\n}\n\n/**\n * Unovis 每个容器都插一个 id 固定为 saturate 的滤镜（悬停高亮用），一页多张图时 id 重复；\n * 改成每张图自己的 id，并让引用它的 CSS 变量指过去\n */\nexport function uniqueHighlightFilter(element: HTMLElement, id: string): void {\n  const filter = element.querySelector<SVGFilterElement>('filter#saturate');\n  if (!filter) return;\n  filter.id = id;\n  element.querySelector('svg')?.style.setProperty('--highlight-filter-id', `url(#${id})`);\n}\n\n/**\n * Unovis 实例表：组件、坐标轴、十字线只建一次，之后 setConfig + update（保留实例才有过渡动画）。\n * 容器 destroy 时会连带销毁这些实例：重建容器前 reset，下次取用时重新创建\n */\nexport function createChartInstances() {\n  let instances = new Map<string, unknown>();\n  return {\n    /** 取一个实例：第一次调用时创建 */\n    get: <C,>(key: string, create: () => C): C => {\n      if (!instances.has(key)) instances.set(key, create());\n      return instances.get(key) as C;\n    },\n    /** 容器销毁了：清空，之后重新创建 */\n    reset() {\n      instances = new Map();\n    },\n  };\n}\n\n/** ChartFrame 的属性：未声明的属性落到外层 div（role=\"figure\"）上 */\nexport interface ChartFrameProps extends PartProps<'div', 'role' | 'aria-busy'>, ChartFrameParts {\n  /** 单位：显示在左上方 */\n  unit?: string;\n  /** 第二数值轴的单位：显示在右上方（组合图） */\n  unitEnd?: string;\n  /** 绘图区的高度 */\n  height: number | string;\n  /** 图例的各项；空数组时不显示图例 */\n  legend: readonly ChartLegendItem[];\n  /** 图例里隐藏着的项 */\n  hiddenKeys: readonly string[];\n  /** 点了图例的一项 */\n  onLegendToggle: (key: string) => void;\n  /** 加载中：绘图区显示 skeleton，外层带 aria-busy */\n  loading: boolean;\n  /** 加载中显示的骨架 */\n  skeleton: VNodeChild;\n  /** 没有数据：绘图区显示空状态，没有数据表 */\n  isEmpty: boolean;\n  /** 空状态的内容，默认是“暂无数据” */\n  empty?: VNodeChild;\n  /** 给读屏的数据表 */\n  table: ChartTable;\n  /** 取得绘图区元素（Unovis 画在这里）；加载、空状态之后重新出现时是新的元素 */\n  plotRef?: (element: HTMLElement | null) => void;\n  /** 绘图区里直接渲染的内容（不用 Unovis 的图，如漏斗图）；同样对读屏隐藏 */\n  plot?: VNodeChild;\n  /** 绘图区下面的内容（缩放的滑块、地图的色带） */\n  footer?: VNodeChild;\n  /** 上方一行右端的操作（地图的缩放按钮），在导出菜单前面 */\n  actions?: VNodeChild;\n  /** 点了绘图区（下钻）：写了它时指针是手形 */\n  onPlotClick?: () => void;\n  /** 图里的项能点（手形指针），点击由图自己处理（环形图的扇区、网络图的节点） */\n  clickable?: boolean;\n}\n\n/** 图表的外层结构 */\nexport const ChartFrame = _component(\n  ({\n    unit,\n    unitEnd,\n    height,\n    legend,\n    hiddenKeys,\n    onLegendToggle,\n    loading,\n    skeleton,\n    isEmpty,\n    empty,\n    table,\n    plotRef,\n    footer,\n    actions,\n    plot,\n    onPlotClick,\n    clickable = false,\n    propsHeader,\n    propsUnit,\n    propsLegend,\n    propsLegendItem,\n    propsPlot,\n    propsTable,\n    exportable = false,\n    exportName,\n    ...rest\n  }: ChartFrameProps) => {\n    const lang = useLang();\n    const format = useFormat();\n    let plotElement: HTMLElement | null = null;\n    const fileName = () => exportName ?? rest['aria-label'] ?? lang.chartExportName;\n    /** 导出菜单：图片要绘图区里有 SVG（漏斗图这类直接用 HTML 画的没有） */\n    const exportMenu = () => (\n      <Menu\n        trigger={(props) => (\n          <IconButton\n            {...props}\n            icon={Download}\n            variant=\"ghost\"\n            tone=\"neutral\"\n            size=\"sm\"\n            aria-label={lang.chartExport}\n          />\n        )}\n      >\n        <MenuItem\n          icon={ImageDown}\n          onAction={() => {\n            const svg = plotElement?.querySelector('svg');\n            if (svg) void exportChartImage(svg, fileName());\n          }}\n        >\n          {lang.chartExportImage}\n        </MenuItem>\n        <MenuItem\n          icon={FileSpreadsheet}\n          onAction={() => exportChartData(table, format, fileName())}\n        >\n          {lang.chartExportData}\n        </MenuItem>\n      </Menu>\n    );\n    return () => {\n      const plotHeight = typeof height === 'number' ? `${height}px` : height;\n      const body = loading ? (\n        skeleton\n      ) : isEmpty ? (\n        <div {...css.attrs(chartStyles.center)}>\n          {empty ?? <Empty size=\"sm\" title={lang.chartEmpty} />}\n        </div>\n      ) : null;\n      return (\n        <div\n          {...mergeAttrs<'div'>({ sx: chartStyles.root }, rest, {\n            role: 'figure',\n            'aria-busy': loading || undefined,\n          })}\n        >\n          {(unit || unitEnd || legend.length > 0 || exportable || actions) && (\n            <div {...mergeAttrs<'div'>({ sx: chartStyles.header }, propsHeader)}>\n              {unit && (\n                <span {...mergeAttrs<'span'>({ sx: chartStyles.unit }, propsUnit)}>{unit}</span>\n              )}\n              {legend.length > 0 && (\n                <div\n                  {...mergeAttrs<'div'>({ sx: chartStyles.legend }, propsLegend, { role: 'group' })}\n                >\n                  {legend.map((item) => {\n                    const off = hiddenKeys.includes(item.key);\n                    return (\n                      <ButtonBase\n                        key={item.key}\n                        {...mergePartProps<ButtonBaseProps>(\n                          {\n                            sx: [chartStyles.legendItem, off && chartStyles.legendItemHidden],\n                            ripple: false,\n                          },\n                          propsLegendItem,\n                          { 'aria-pressed': !off, onClick: () => onLegendToggle(item.key) },\n                        )}\n                      >\n                        <span\n                          {...css.attrs(\n                            chartStyles.swatch,\n                            off\n                              ? chartStyles.swatchHidden(item.color)\n                              : chartStyles.swatchColor(item.color),\n                          )}\n                        />\n                        {item.label}\n                      </ButtonBase>\n                    );\n                  })}\n                </div>\n              )}\n              {unitEnd && (\n                <span {...mergeAttrs<'span'>({ sx: chartStyles.unit }, propsUnit)}>{unitEnd}</span>\n              )}\n              {!isEmpty && !loading && actions}\n              {exportable && !isEmpty && !loading && exportMenu()}\n            </div>\n          )}\n          {/* key 不同：两种状态不复用同一个 div，否则 Unovis 画进去的 svg 会留在骨架、空状态里 */}\n          {body ? (\n            <div key=\"state\" {...css.attrs(chartStyles.plot, chartStyles.plotHeight(plotHeight))}>\n              {body}\n            </div>\n          ) : (\n            <div\n              key=\"plot\"\n              {...mergeAttrs<'div'>(\n                {\n                  sx: [\n                    chartStyles.plot,\n                    chartStyles.plotHeight(plotHeight),\n                    (clickable || onPlotClick) && chartStyles.plotClickable,\n                  ],\n                },\n                propsPlot,\n                {\n                  'aria-hidden': true,\n                  ref: (element: unknown) => {\n                    plotElement = element instanceof HTMLElement ? element : null;\n                    plotRef?.(plotElement);\n                  },\n                  onClick: onPlotClick,\n                },\n              )}\n            >\n              {plot}\n            </div>\n          )}\n          {!body && footer}\n          {!isEmpty && (\n            <table {...mergeAttrs<'table'>({ sx: visuallyHiddenStyles.hidden }, propsTable)}>\n              <thead>\n                <tr>\n                  {table.columns.map((column) => (\n                    <th key={column} scope=\"col\">\n                      {column}\n                    </th>\n                  ))}\n                </tr>\n              </thead>\n              <tbody>\n                {table.rows.map((row, position) => (\n                  <tr key={position}>\n                    <th scope=\"row\">{row.header}</th>\n                    {row.cells.map((cell, column) => (\n                      <td key={column}>{cell}</td>\n                    ))}\n                  </tr>\n                ))}\n              </tbody>\n            </table>\n          )}\n        </div>\n      );\n    };\n  },\n);\n"],"mappings":"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"}

package/dist/code-editor/CodeEditor.js

@@ -4,7 +4,7 @@ import { inputRecipe } from "../input/control.js";
 import { createEditor } from "./editor.js";
 import { createVNode, onBeforeUnmount, onMounted, shallowRef, watch } from "vue";
 import { _component, bindable, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
-import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 //#region src/code-editor/CodeEditor.tsx
 var styles = css.create({ root: {
 	display: "block",

package/dist/code-editor/CodeEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor.js","names":["_vtp_bindable","_vtp_readonlyProp","_vtp_restProps","_vue_shallowRef","_createVNode"],"sources":["../../src/code-editor/CodeEditor.tsx"],"sourcesContent":["/**\n * 代码编辑器组件：外壳与输入框相同（边框、悬停、焦点环），里面是 CodeMirror（editor.ts）。\n * CodeMirror 只在这个子路径里：页面用到编辑器时才随子路径加载，组件库主入口不带它。\n *\n *   <CodeEditor _value={code} aria-label=\"代码\" sx={styles.editor} />\n *   <CodeEditor _value={manifest} language={json()} aria-label=\"字段清单\" onReady={(editor) => …} />\n *\n * 高度由使用方给（sx），默认 20rem；未声明的属性落到外壳上。颜色、字体取主题 token，跟着主题变。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { Extension } from '@codemirror/state';\nimport { useConfig } from '../config/context';\nimport { inputRecipe } from '../input/control';\nimport { mergeAttrs, type PartProps } from '../utils/props';\nimport { onBeforeUnmount, onMounted, watch } from 'vue';\nimport { createEditor, type CodeEditorHandle } from './editor';\n\nconst styles = css.create({\n  // 输入框外壳是一行的 inline-flex：改成整块，内边距交给 CodeMirror\n  root: {\n    display: 'block',\n    height: '20rem',\n    paddingInline: 0,\n    overflow: 'hidden',\n  },\n});\n\n/** CodeEditor 的属性 */\nexport interface CodeEditorProps extends PartProps<'div'> {\n  /** 代码：父级写 _value={x} 双向绑定 */\n  _value?: string;\n  /** 编辑区的无障碍名称 */\n  'aria-label': string;\n  /** 语言扩展（CodeMirror 的 json()、java()……）；不给时是 TSX。只在挂载时读 */\n  language?: Extension;\n  /** 只读：能选中、复制、搜索，不能改 */\n  readonly?: boolean;\n  /** 编辑器建好了：拿到 CodeMirror 的视图，做撤销、读选区这类更细的操作 */\n  onReady?: (editor: CodeEditorHandle) => void;\n}\n\n/** 代码编辑器：语法高亮、括号匹配、缩进、搜索，颜色跟随主题 */\nexport const CodeEditor = _component(\n  ({\n    _value: value = _bindable(''),\n    'aria-label': label,\n    language,\n    readonly,\n    onReady,\n    ...rest\n  }: CodeEditorProps) => {\n    const config = useConfig();\n    let host = _state.raw<HTMLElement | null>(null);\n    let editor: CodeEditorHandle | undefined;\n    const isDark = () => config.theme.colorScheme === 'dark';\n\n    onMounted(() => {\n      editor = createEditor(host!, {\n        code: value,\n        dark: isDark(),\n        label,\n        language,\n        readonly,\n        onChange: (code) => (value = code),\n      });\n      onReady?.(editor);\n    });\n    onBeforeUnmount(() => editor?.destroy());\n    watch(\n      () => value,\n      (code) => editor?.setCode(code),\n    );\n    watch(isDark, (dark) => editor?.setDark(dark));\n\n    return () => (\n      <div\n        {...mergeAttrs<'div'>({ sx: [inputRecipe().root, styles.root] }, rest, {\n          ref: _toRef(host),\n        })}\n      />\n    );\n  },\n);\n"],"mappings":";;;;;;;;AAkBA,IAAM,SAAS,IAAI,OAAO,EAExB,MAAM;CACJ,SAAS;CACT,QAAQ;CACR,eAAe;CACf,UAAU;AACZ,EACF,CAAC;;;AAiBD,IAAa,aAAa,0BACxB,QAAA,SAOuB;CAAA,MAAA,QAAAA,SAAA,QAAA,gBANK,IAAE,KAAA,IAAA;CAAA,MAAA,QAAAC,aAAA,QAAA,WAAA;CAAA,MAAA,WAAAA,aAAA,QAAA,UAAA;CAAA,MAAA,WAAAA,aAAA,QAAA,UAAA;CAAA,MAAA,UAAAA,aAAA,QAAA,SAAA;CAAA,MAKzB,OAAIC,UAAA,QAAA,MAAA,IAAA;CAEP,MAAM,SAAS,UAAU;CACzB,IAAI,OAAIC,WAAkC,IAAI;CAC9C,IAAI;CACJ,MAAM,eAAe,OAAO,MAAM,gBAAgB;CAElD,gBAAgB;EACd,SAAS,aAAY,KAAA,OAAQ;GAC3B,MAAI,MAAA;GACJ,MAAM,OAAO;GACb,OAAK,MAAA;GACL,UAAQ,SAAA;GACR,UAAQ,SAAA;GACR,WAAW,SAAU,MAAA,QAAQ;EAC/B,CAAC;EACD,QAAA,QAAU,MAAM;CAClB,CAAC;CACD,sBAAsB,QAAQ,QAAQ,CAAC;CACvC,YACE,MAAA,QACC,SAAS,QAAQ,QAAQ,IAAI,CAChC;CACA,MAAM,SAAS,SAAS,QAAQ,QAAQ,IAAI,CAAC;CAE7C,aAAOC,YAAA,OAEC,WAAkB,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,MAAM,OAAO,IAAI,EAAE,GAAG,MAAM,EACrE,KAAG,KACL,CAAC,GAAC,IAAA;AAGR,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}
+{"version":3,"file":"CodeEditor.js","names":["_vtp_bindable","_vtp_readonlyProp","_vtp_restProps","_vue_shallowRef","_createVNode"],"sources":["../../src/code-editor/CodeEditor.tsx"],"sourcesContent":["/**\n * 代码编辑器组件：外壳与输入框相同（边框、悬停、焦点环），里面是 CodeMirror（editor.ts）。\n * CodeMirror 只在这个子路径里：页面用到编辑器时才随子路径加载，组件库主入口不带它。\n *\n *   <CodeEditor _value={code} aria-label=\"代码\" sx={styles.editor} />\n *   <CodeEditor _value={manifest} language={json()} aria-label=\"字段清单\" onReady={(editor) => …} />\n *\n * 高度由使用方给（sx），默认 20rem；未声明的属性落到外壳上。颜色、字体取主题 token，跟着主题变。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { Extension } from '@codemirror/state';\nimport { useConfig } from '../config/context';\nimport { inputRecipe } from '../input/control';\nimport { mergeAttrs, type PartProps } from '../utils/props';\nimport { onBeforeUnmount, onMounted, watch } from 'vue';\nimport { createEditor, type CodeEditorHandle } from './editor';\n\nconst styles = css.create({\n  // 输入框外壳是一行的 inline-flex：改成整块，内边距交给 CodeMirror\n  root: {\n    display: 'block',\n    height: '20rem',\n    paddingInline: 0,\n    overflow: 'hidden',\n  },\n});\n\n/** CodeEditor 的属性 */\nexport interface CodeEditorProps extends PartProps<'div'> {\n  /** 代码：父级写 _value={x} 双向绑定 */\n  _value?: string;\n  /** 编辑区的无障碍名称 */\n  'aria-label': string;\n  /** 语言扩展（CodeMirror 的 json()、java()……）；不给时是 TSX。只在挂载时读 */\n  language?: Extension;\n  /** 只读：能选中、复制、搜索，不能改 */\n  readonly?: boolean;\n  /** 编辑器建好了：拿到 CodeMirror 的视图，做撤销、读选区这类更细的操作 */\n  onReady?: (editor: CodeEditorHandle) => void;\n}\n\n/** 代码编辑器：语法高亮、括号匹配、缩进、搜索，颜色跟随主题 */\nexport const CodeEditor = _component(\n  ({\n    _value: value = _bindable(''),\n    'aria-label': label,\n    language,\n    readonly,\n    onReady,\n    ...rest\n  }: CodeEditorProps) => {\n    const config = useConfig();\n    let host = _state.raw<HTMLElement | null>(null);\n    let editor: CodeEditorHandle | undefined;\n    const isDark = () => config.theme.colorScheme === 'dark';\n\n    onMounted(() => {\n      editor = createEditor(host!, {\n        code: value,\n        dark: isDark(),\n        label,\n        language,\n        readonly,\n        onChange: (code) => (value = code),\n      });\n      onReady?.(editor);\n    });\n    onBeforeUnmount(() => editor?.destroy());\n    watch(\n      () => value,\n      (code) => editor?.setCode(code),\n    );\n    watch(isDark, (dark) => editor?.setDark(dark));\n\n    return () => (\n      <div\n        {...mergeAttrs<'div'>({ sx: [inputRecipe().root, styles.root] }, rest, {\n          ref: _toRef(host),\n        })}\n      />\n    );\n  },\n);\n"],"mappings":";;;;;;;;AAkBA,IAAM,SAAS,IAAI,OAAO,EAExB,MAAM;CACJ,SAAS;CACT,QAAQ;CACR,eAAe;CACf,UAAU;AACZ,EACF,CAAC;;;AAiBD,IAAa,aAAa,0BACxB,QAAA,SAOuB;CAAA,MAAA,QAAAA,SAAA,QAAA,gBANK,IAAE,KAAA,IAAA;CAAA,MAAA,QAAAC,aAAA,QAAA,WAAA;CAAA,MAAA,WAAAA,aAAA,QAAA,UAAA;CAAA,MAAA,WAAAA,aAAA,QAAA,UAAA;CAAA,MAAA,UAAAA,aAAA,QAAA,SAAA;CAAA,MAKzB,OAAIC,UAAA,QAAA,MAAA,IAAA;CAEP,MAAM,SAAS,UAAU;CACzB,IAAI,OAAIC,WAAkC,IAAI;CAC9C,IAAI;CACJ,MAAM,eAAe,OAAO,MAAM,gBAAgB;CAElD,gBAAgB;EACd,SAAS,aAAY,KAAA,OAAQ;GAC3B,MAAI,MAAA;GACJ,MAAM,OAAO;GACb,OAAK,MAAA;GACL,UAAQ,SAAA;GACR,UAAQ,SAAA;GACR,WAAW,SAAU,MAAA,QAAQ;EAC/B,CAAC;EACD,QAAA,QAAU,MAAM;CAClB,CAAC;CACD,sBAAsB,QAAQ,QAAQ,CAAC;CACvC,YACE,MAAA,QACC,SAAS,QAAQ,QAAQ,IAAI,CAChC;CACA,MAAM,SAAS,SAAS,QAAQ,QAAQ,IAAI,CAAC;CAE7C,aAAOC,YAAA,OAEC,WAAkB,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,MAAM,OAAO,IAAI,EAAE,GAAG,MAAM,EACrE,KAAG,KACL,CAAC,GAAC,IAAA;AAGR,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}

package/dist/config/Provider.d.ts

@@ -1,4 +1,4 @@
-import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
 import type { VNodeChild } from 'vue';
 import { type Highlighter, type TextMatcher, type UiPermissions, type UiRouter } from './context';
 import { type ComponentDefaults } from './defaults';

package/dist/config/Provider.js

@@ -6,7 +6,7 @@ import { usePrefersDark } from "../utils/dom/media-query.js";
 import { defineLang } from "./lang/lang.js";
 import { computed, createVNode } from "vue";
 import { _component, childrenProp, mergeJsxProps, readonlyProp } from "@zerodep-dev/vue-tsx-pro-tsx";
-import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 //#region src/config/Provider.tsx
 /** 局部配置；都不写时只是透明的容器，沿用上层配置 */
 /** Provider 的样式：root、themed */

package/dist/config/Provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Provider.js","names":["_vtp_readonlyProp","_vtp_childrenProp","_vue_computed","_createVNode","_mergeProps"],"sources":["../../src/config/Provider.tsx"],"sourcesContent":["import { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { VNodeChild } from 'vue';\nimport {\n  ConfigContext,\n  useConfig,\n  type Highlighter,\n  type TextMatcher,\n  type UiPermissions,\n  type UiRouter,\n} from './context';\nimport { mergeDefaults, type ComponentDefaults } from './defaults';\nimport { mergeStyles, type ComponentStyles } from './styles';\nimport { defineLang, type Lang } from './lang/lang';\nimport { usePrefersDark } from '../utils/dom/media-query';\nimport type { WorkCalendar } from '../utils/data/workdays';\nimport type { HttpClient } from '../utils/request/http';\nimport { resolveTheme, themeAttrs, type ThemeInput } from './theme/theme';\n\n/** 局部配置；都不写时只是透明的容器，沿用上层配置 */\nexport interface ProviderProps {\n  /** 主题；不写时沿用上层配置 */\n  theme?: ThemeInput;\n  /** 语言；只写要改的字段，其余沿用上层配置 */\n  lang?: Partial<Lang>;\n  /** 代码高亮器（CodeBlock 用）；不写时沿用上层配置 */\n  highlighter?: Highlighter;\n  /** 额外的文字匹配（拼音）；不写时沿用上层配置 */\n  textMatcher?: TextMatcher;\n  /** 组件默认值：按组件逐个与上层合并，只写要改的 */\n  defaults?: ComponentDefaults;\n  /** 组件的主题定制：追加在上层的定制之后（见 styles.ts） */\n  styles?: ComponentStyles;\n  /** 路由适配；不写时沿用上层配置 */\n  router?: UiRouter;\n  /** 权限判断；不写时沿用上层配置 */\n  permissions?: UiPermissions;\n  /** 请求客户端；不写时沿用上层配置 */\n  http?: HttpClient;\n  /** 工作日历；不写时沿用上层配置 */\n  workCalendar?: WorkCalendar;\n  /** 波纹效果的开关；不写时沿用上层配置 */\n  ripple?: boolean;\n  children?: VNodeChild;\n}\n\n/** Provider 的样式：root、themed */\nexport const providerStyles = css.create({\n  // 不产生盒子，不影响布局；主题变量与文字样式照常由子元素继承\n  root: { display: 'contents' },\n  themed: {\n    color: '_text',\n    fontFamily: '_sans',\n    fontSize: '_md',\n    lineHeight: '_normal',\n  },\n});\n\n/**\n * 局部配置主题与语言，可以嵌套：内层只写要改的部分，其余继承外层。\n * 应用级配置见 createUi。\n */\nexport const Provider = _component(\n  ({\n    theme,\n    lang,\n    highlighter,\n    textMatcher,\n    defaults,\n    styles,\n    router,\n    permissions,\n    http,\n    workCalendar,\n    ripple,\n    children,\n  }: ProviderProps) => {\n    const parent = useConfig();\n    const prefersDark = usePrefersDark();\n    const currentTheme = _derived(theme ? resolveTheme(theme, prefersDark.value) : parent.theme);\n    const currentLang = _derived(lang ? defineLang(parent.lang, lang) : parent.lang);\n    const currentDefaults = _derived(mergeDefaults(parent.defaults, defaults));\n    const currentStyles = _derived(mergeStyles(parent.styles, styles));\n    ConfigContext.provide({\n      get theme() {\n        return currentTheme;\n      },\n      get lang() {\n        return currentLang;\n      },\n      get highlighter() {\n        return highlighter ?? parent.highlighter;\n      },\n      get textMatcher() {\n        return textMatcher ?? parent.textMatcher;\n      },\n      get defaults() {\n        return currentDefaults;\n      },\n      get styles() {\n        return currentStyles;\n      },\n      get router() {\n        return router ?? parent.router;\n      },\n      get permissions() {\n        return permissions ?? parent.permissions;\n      },\n      get http() {\n        return http ?? parent.http;\n      },\n      get workCalendar() {\n        return workCalendar ?? parent.workCalendar;\n      },\n      get ripple() {\n        return ripple ?? parent.ripple;\n      },\n    });\n\n    return () => (\n      <div\n        {...(theme ? themeAttrs(currentTheme) : {})}\n        {...css.attrs(providerStyles.root, theme != null && providerStyles.themed)}\n        lang={currentLang.code}\n        dir={currentLang.direction}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\n/** ConfigScope 的 props */\nexport interface ConfigScopeProps {\n  children?: VNodeChild;\n}\n\n/**\n * 给移出 Provider 的内容（Teleport 到 body 的 Toaster 等）重新带上当前的主题、语言与文字方向：\n * 主题变量、lang、dir 都挂在 Provider 的元素上，传送出去的元素不再是它的后代。\n */\nexport const ConfigScope = _component(({ children }: ConfigScopeProps) => {\n  const config = useConfig();\n  return () => (\n    <div\n      {...themeAttrs(config.theme)}\n      {...css.attrs(providerStyles.root, providerStyles.themed)}\n      lang={config.lang.code}\n      dir={config.lang.direction}\n    >\n      {children}\n    </div>\n  );\n});\n"],"mappings":";;;;;;;;;;;;AA+CA,IAAa,iBAAiB,IAAI,OAAO;CAEvC,MAAM,EAAE,SAAS,WAAW;CAC5B,QAAQ;EACN,OAAO;EACP,YAAY;EACZ,UAAU;EACV,YAAY;CACd;AACF,CAAC;;;;;AAMD,IAAa,WAAW,0BACtB,QAAA,SAaqB;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,cAAAA,aAAA,QAAA,aAAA;CAAA,MAAA,cAAAA,aAAA,QAAA,aAAA;CAAA,MAAA,WAAAA,aAAA,QAAA,UAAA;CAAA,MAAA,SAAAA,aAAA,QAAA,QAAA;CAAA,MAAA,SAAAA,aAAA,QAAA,QAAA;CAAA,MAAA,cAAAA,aAAA,QAAA,aAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,eAAAA,aAAA,QAAA,cAAA;CAAA,MAAA,SAAAA,aAAA,QAAA,QAAA;CAAA,MAAA,WAAAC,aAAA,MAAA;CACnB,MAAM,SAAS,UAAU;CACzB,MAAM,cAAc,eAAe;CACnC,MAAM,eAAYC,eAAY,MAAA,QAAQ,aAAY,MAAA,OAAQ,YAAY,KAAK,IAAI,OAAO,KAAK;CAC3F,MAAM,cAAWA,eAAY,KAAA,QAAO,WAAW,OAAO,MAAI,KAAA,KAAM,IAAI,OAAO,IAAI;CAC/E,MAAM,kBAAeA,eAAY,cAAc,OAAO,UAAQ,SAAA,KAAU,CAAC;CACzE,MAAM,gBAAaA,eAAY,YAAY,OAAO,QAAM,OAAA,KAAQ,CAAC;CACjE,cAAc,QAAQ;EACpB,IAAI,QAAQ;GACV,OAAA,aAAA;EACF;EACA,IAAI,OAAO;GACT,OAAA,YAAA;EACF;EACA,IAAI,cAAc;GAChB,OAAO,YAAA,SAAe,OAAO;EAC/B;EACA,IAAI,cAAc;GAChB,OAAO,YAAA,SAAe,OAAO;EAC/B;EACA,IAAI,WAAW;GACb,OAAA,gBAAA;EACF;EACA,IAAI,SAAS;GACX,OAAA,cAAA;EACF;EACA,IAAI,SAAS;GACX,OAAO,OAAA,SAAU,OAAO;EAC1B;EACA,IAAI,cAAc;GAChB,OAAO,YAAA,SAAe,OAAO;EAC/B;EACA,IAAI,OAAO;GACT,OAAO,KAAA,SAAQ,OAAO;EACxB;EACA,IAAI,eAAe;GACjB,OAAO,aAAA,SAAgB,OAAO;EAChC;EACA,IAAI,SAAS;GACX,OAAO,OAAA,SAAU,OAAO;EAC1B;CACF,CAAC;CAED,aAAOC,YAAA,OAAAC,cAEE,MAAA,QAAQ,WAAU,aAAA,KAAa,IAAI,CAAC,GACrC,IAAI,MAAM,eAAe,MAAM,MAAA,SAAS,QAAQ,eAAe,MAAM,GAAC;EAAA,QACpE,YAAA,MAAY;EAAI,OACjB,YAAA,MAAY;CAAS,CAAA,GAAA,CAAA,SAAA,KAAA,CAAA;AAKhC,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH;;;;;;AAWA,IAAa,cAAc,0BAAW,SAAA,UAAoC;CAAA,MAAA,WAAAH,aAAA,OAAA;CACxE,MAAM,SAAS,UAAU;CACzB,aAAOE,YAAA,OAAAC,cAEC,WAAW,OAAO,KAAK,GACvB,IAAI,MAAM,eAAe,MAAM,eAAe,MAAM,GAAC;EAAA,QACnD,OAAO,KAAK;EAAI,OACjB,OAAO,KAAK;CAAS,CAAA,GAAA,CAAA,SAAA,KAAA,CAAA;AAKhC,GAAC,EAAA,MAAA,cAAA,CAAA"}
+{"version":3,"file":"Provider.js","names":["_vtp_readonlyProp","_vtp_childrenProp","_vue_computed","_createVNode","_mergeProps"],"sources":["../../src/config/Provider.tsx"],"sourcesContent":["import { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { VNodeChild } from 'vue';\nimport {\n  ConfigContext,\n  useConfig,\n  type Highlighter,\n  type TextMatcher,\n  type UiPermissions,\n  type UiRouter,\n} from './context';\nimport { mergeDefaults, type ComponentDefaults } from './defaults';\nimport { mergeStyles, type ComponentStyles } from './styles';\nimport { defineLang, type Lang } from './lang/lang';\nimport { usePrefersDark } from '../utils/dom/media-query';\nimport type { WorkCalendar } from '../utils/data/workdays';\nimport type { HttpClient } from '../utils/request/http';\nimport { resolveTheme, themeAttrs, type ThemeInput } from './theme/theme';\n\n/** 局部配置；都不写时只是透明的容器，沿用上层配置 */\nexport interface ProviderProps {\n  /** 主题；不写时沿用上层配置 */\n  theme?: ThemeInput;\n  /** 语言；只写要改的字段，其余沿用上层配置 */\n  lang?: Partial<Lang>;\n  /** 代码高亮器（CodeBlock 用）；不写时沿用上层配置 */\n  highlighter?: Highlighter;\n  /** 额外的文字匹配（拼音）；不写时沿用上层配置 */\n  textMatcher?: TextMatcher;\n  /** 组件默认值：按组件逐个与上层合并，只写要改的 */\n  defaults?: ComponentDefaults;\n  /** 组件的主题定制：追加在上层的定制之后（见 styles.ts） */\n  styles?: ComponentStyles;\n  /** 路由适配；不写时沿用上层配置 */\n  router?: UiRouter;\n  /** 权限判断；不写时沿用上层配置 */\n  permissions?: UiPermissions;\n  /** 请求客户端；不写时沿用上层配置 */\n  http?: HttpClient;\n  /** 工作日历；不写时沿用上层配置 */\n  workCalendar?: WorkCalendar;\n  /** 波纹效果的开关；不写时沿用上层配置 */\n  ripple?: boolean;\n  children?: VNodeChild;\n}\n\n/** Provider 的样式：root、themed */\nexport const providerStyles = css.create({\n  // 不产生盒子，不影响布局；主题变量与文字样式照常由子元素继承\n  root: { display: 'contents' },\n  themed: {\n    color: '_text',\n    fontFamily: '_sans',\n    fontSize: '_md',\n    lineHeight: '_normal',\n  },\n});\n\n/**\n * 局部配置主题与语言，可以嵌套：内层只写要改的部分，其余继承外层。\n * 应用级配置见 createUi。\n */\nexport const Provider = _component(\n  ({\n    theme,\n    lang,\n    highlighter,\n    textMatcher,\n    defaults,\n    styles,\n    router,\n    permissions,\n    http,\n    workCalendar,\n    ripple,\n    children,\n  }: ProviderProps) => {\n    const parent = useConfig();\n    const prefersDark = usePrefersDark();\n    const currentTheme = _derived(theme ? resolveTheme(theme, prefersDark.value) : parent.theme);\n    const currentLang = _derived(lang ? defineLang(parent.lang, lang) : parent.lang);\n    const currentDefaults = _derived(mergeDefaults(parent.defaults, defaults));\n    const currentStyles = _derived(mergeStyles(parent.styles, styles));\n    ConfigContext.provide({\n      get theme() {\n        return currentTheme;\n      },\n      get lang() {\n        return currentLang;\n      },\n      get highlighter() {\n        return highlighter ?? parent.highlighter;\n      },\n      get textMatcher() {\n        return textMatcher ?? parent.textMatcher;\n      },\n      get defaults() {\n        return currentDefaults;\n      },\n      get styles() {\n        return currentStyles;\n      },\n      get router() {\n        return router ?? parent.router;\n      },\n      get permissions() {\n        return permissions ?? parent.permissions;\n      },\n      get http() {\n        return http ?? parent.http;\n      },\n      get workCalendar() {\n        return workCalendar ?? parent.workCalendar;\n      },\n      get ripple() {\n        return ripple ?? parent.ripple;\n      },\n    });\n\n    return () => (\n      <div\n        {...(theme ? themeAttrs(currentTheme) : {})}\n        {...css.attrs(providerStyles.root, theme != null && providerStyles.themed)}\n        lang={currentLang.code}\n        dir={currentLang.direction}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\n/** ConfigScope 的 props */\nexport interface ConfigScopeProps {\n  children?: VNodeChild;\n}\n\n/**\n * 给移出 Provider 的内容（Teleport 到 body 的 Toaster 等）重新带上当前的主题、语言与文字方向：\n * 主题变量、lang、dir 都挂在 Provider 的元素上，传送出去的元素不再是它的后代。\n */\nexport const ConfigScope = _component(({ children }: ConfigScopeProps) => {\n  const config = useConfig();\n  return () => (\n    <div\n      {...themeAttrs(config.theme)}\n      {...css.attrs(providerStyles.root, providerStyles.themed)}\n      lang={config.lang.code}\n      dir={config.lang.direction}\n    >\n      {children}\n    </div>\n  );\n});\n"],"mappings":";;;;;;;;;;;;AA+CA,IAAa,iBAAiB,IAAI,OAAO;CAEvC,MAAM,EAAE,SAAS,WAAW;CAC5B,QAAQ;EACN,OAAO;EACP,YAAY;EACZ,UAAU;EACV,YAAY;CACd;AACF,CAAC;;;;;AAMD,IAAa,WAAW,0BACtB,QAAA,SAaqB;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,cAAAA,aAAA,QAAA,aAAA;CAAA,MAAA,cAAAA,aAAA,QAAA,aAAA;CAAA,MAAA,WAAAA,aAAA,QAAA,UAAA;CAAA,MAAA,SAAAA,aAAA,QAAA,QAAA;CAAA,MAAA,SAAAA,aAAA,QAAA,QAAA;CAAA,MAAA,cAAAA,aAAA,QAAA,aAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,eAAAA,aAAA,QAAA,cAAA;CAAA,MAAA,SAAAA,aAAA,QAAA,QAAA;CAAA,MAAA,WAAAC,aAAA,MAAA;CACnB,MAAM,SAAS,UAAU;CACzB,MAAM,cAAc,eAAe;CACnC,MAAM,eAAYC,eAAY,MAAA,QAAQ,aAAY,MAAA,OAAQ,YAAY,KAAK,IAAI,OAAO,KAAK;CAC3F,MAAM,cAAWA,eAAY,KAAA,QAAO,WAAW,OAAO,MAAI,KAAA,KAAM,IAAI,OAAO,IAAI;CAC/E,MAAM,kBAAeA,eAAY,cAAc,OAAO,UAAQ,SAAA,KAAU,CAAC;CACzE,MAAM,gBAAaA,eAAY,YAAY,OAAO,QAAM,OAAA,KAAQ,CAAC;CACjE,cAAc,QAAQ;EACpB,IAAI,QAAQ;GACV,OAAA,aAAA;EACF;EACA,IAAI,OAAO;GACT,OAAA,YAAA;EACF;EACA,IAAI,cAAc;GAChB,OAAO,YAAA,SAAe,OAAO;EAC/B;EACA,IAAI,cAAc;GAChB,OAAO,YAAA,SAAe,OAAO;EAC/B;EACA,IAAI,WAAW;GACb,OAAA,gBAAA;EACF;EACA,IAAI,SAAS;GACX,OAAA,cAAA;EACF;EACA,IAAI,SAAS;GACX,OAAO,OAAA,SAAU,OAAO;EAC1B;EACA,IAAI,cAAc;GAChB,OAAO,YAAA,SAAe,OAAO;EAC/B;EACA,IAAI,OAAO;GACT,OAAO,KAAA,SAAQ,OAAO;EACxB;EACA,IAAI,eAAe;GACjB,OAAO,aAAA,SAAgB,OAAO;EAChC;EACA,IAAI,SAAS;GACX,OAAO,OAAA,SAAU,OAAO;EAC1B;CACF,CAAC;CAED,aAAOC,YAAA,OAAAC,cAEE,MAAA,QAAQ,WAAU,aAAA,KAAa,IAAI,CAAC,GACrC,IAAI,MAAM,eAAe,MAAM,MAAA,SAAS,QAAQ,eAAe,MAAM,GAAC;EAAA,QACpE,YAAA,MAAY;EAAI,OACjB,YAAA,MAAY;CAAS,CAAA,GAAA,CAAA,SAAA,KAAA,CAAA;AAKhC,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH;;;;;;AAWA,IAAa,cAAc,0BAAW,SAAA,UAAoC;CAAA,MAAA,WAAAH,aAAA,OAAA;CACxE,MAAM,SAAS,UAAU;CACzB,aAAOE,YAAA,OAAAC,cAEC,WAAW,OAAO,KAAK,GACvB,IAAI,MAAM,eAAe,MAAM,eAAe,MAAM,GAAC;EAAA,QACnD,OAAO,KAAK;EAAI,OACjB,OAAO,KAAK;CAAS,CAAA,GAAA,CAAA,SAAA,KAAA,CAAA;AAKhC,GAAC,EAAA,MAAA,cAAA,CAAA"}

package/dist/config/createUi.d.ts

@@ -3,7 +3,7 @@
  * 传入 ref 或 getter 即可在运行时切换主题与语言。
  */
 import { type MaybeRefOrGetter, type ObjectPlugin } from 'vue';
-import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
 import { type Highlighter, type TextMatcher, type UiPermissions, type UiRouter } from './context';
 import type { ComponentDefaults } from './defaults';
 import { type ComponentStyles } from './styles';

package/dist/config/createUi.js

@@ -4,7 +4,7 @@ import { resolveTheme, themeVariables } from "./theme/theme.js";
 import { usePrefersDark } from "../utils/dom/media-query.js";
 import { defineLang } from "./lang/lang.js";
 import { computed, effectScope, toValue, watchEffect } from "vue";
-import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 //#region src/config/createUi.ts
 /**
 * 应用级配置：在宿主入口里 `app.use(createUi({ theme, lang }))`，所有 TSX 页面共享，不必逐页包裹 Provider。

package/dist/config/createUi.js.map

@@ -1 +1 @@
-{"version":3,"file":"createUi.js","names":[],"sources":["../../src/config/createUi.ts"],"sourcesContent":["/**\n * 应用级配置：在宿主入口里 `app.use(createUi({ theme, lang }))`，所有 TSX 页面共享，不必逐页包裹 Provider。\n * 传入 ref 或 getter 即可在运行时切换主题与语言。\n */\nimport {\n  computed,\n  effectScope,\n  toValue,\n  watchEffect,\n  type MaybeRefOrGetter,\n  type ObjectPlugin,\n} from 'vue';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport {\n  ConfigContext,\n  defaultConfig,\n  type Highlighter,\n  type TextMatcher,\n  type UiPermissions,\n  type UiRouter,\n} from './context';\nimport type { ComponentDefaults } from './defaults';\nimport { mergeStyles, type ComponentStyles } from './styles';\nimport { defineLang, type Lang } from './lang/lang';\nimport { usePrefersDark } from '../utils/dom/media-query';\nimport type { WorkCalendar } from '../utils/data/workdays';\nimport type { HttpClient } from '../utils/request/http';\nimport { resolveTheme, themeVariables, type Theme, type ThemeInput } from './theme/theme';\n\n/** 应用级配置；theme 与 lang 可以传 ref 或 getter，运行时切换，其余在安装时确定 */\nexport interface UiOptions {\n  /** 主题；不写时用亮色主题，也不改动页面根元素 */\n  theme?: MaybeRefOrGetter<ThemeInput>;\n  /** 只写要改的字段，其余用简体中文的默认值 */\n  lang?: MaybeRefOrGetter<Partial<Lang>>;\n  /** 代码高亮器（CodeBlock 用），如 `@zerodep-dev/vue-tsx-pro-ui/shiki` 的 createShikiHighlighter()；不写时显示纯文本 */\n  highlighter?: Highlighter;\n  /** 额外的文字匹配，如 `@zerodep-dev/vue-tsx-pro-ui/pinyin` 的 createPinyinMatcher()：选项过滤、命令面板认拼音；不写时只按字面匹配 */\n  textMatcher?: TextMatcher;\n  /** 组件默认值，如 `{ Button: { variant: 'outline' } }`（见 defaults.ts） */\n  defaults?: ComponentDefaults;\n  /** 组件的主题定制：追加样式、新增档位，如 `{ Button: { base: { root: { letterSpacing: '0.02em' } } } }`（见 styles.ts） */\n  styles?: ComponentStyles;\n  /** 路由适配：站内链接不刷新页面地跳转、导航组件判断当前页（见 UiRouter） */\n  router?: UiRouter;\n  /** 权限判断：`(权限点) => 用户有没有`，Can、useCan 据此控制按钮等界面；不写时一律放行（见 UiPermissions） */\n  permissions?: UiPermissions;\n  /** 请求客户端：createHttpClient({ baseURL, onRequest, onResponse })，或包一层 axios、ky（见 HttpClient） */\n  http?: HttpClient;\n  /** 工作日历：createWorkCalendar({ holidays, workdays }) 带上法定节假日与调休；不写时只按周末算 */\n  workCalendar?: WorkCalendar;\n  /** 按下时的波纹效果，默认 true；关掉后组件的 ripple prop 仍可单独打开 */\n  ripple?: boolean;\n  /**\n   * 页面根元素也用主题的背景色、文字色与字体，并去掉 body 的默认外边距，默认 false。\n   * 整页都由组件库主题管理的站点（如文档站）打开：页面边缘、回弹滚动露出的地方不再是浏览器的默认色，\n   * AppShell 贴满窗口、四周不留 8px 的白边；配合 themeBootScript 时接手它写的行内颜色\n   */\n  paintDocument?: boolean;\n}\n\n/** paintDocument 时页面根元素的样式 */\nexport const documentStyles = css.create({\n  // 字号不设：根元素的字号是 rem 的基准，留给浏览器（用户的字号设置）\n  page: {\n    backgroundColor: '_background',\n    color: '_text',\n    fontFamily: '_sans',\n    lineHeight: '_normal',\n    // macOS 上用灰度抗锯齿，深色底上的浅色文字不发虚；其他系统忽略\n    WebkitFontSmoothing: 'antialiased',\n    MozOsxFontSmoothing: 'grayscale',\n  },\n  // 浏览器给 body 的 8px 外边距：整页的外壳（AppShell）要贴满窗口\n  body: { margin: 0 },\n});\n\n/** 服务端渲染时 `<html>` 与 `<body>` 要带的属性（createUi 在浏览器里写到页面根元素上的那些） */\nexport interface DocumentAttrs {\n  /** `<html>` 的属性：主题的类、变量（style）、data-theme，传了 lang 时还有 lang、dir */\n  html: Record<string, string>;\n  /** `<body>` 的属性：paintDocument 时去掉外边距的类 */\n  body: Record<string, string>;\n}\n\n/** createUi 的结果：Vue 插件，另外能给出服务端渲染时页面根元素的属性 */\nexport interface UiPlugin extends ObjectPlugin {\n  /**\n   * 服务端渲染：`<html>`、`<body>` 要带的属性，首屏就是这套主题与语言，不等客户端接管后再变。\n   * 服务端不知道系统的明暗，跟随系统的主题按亮色给；`themeBootScript` 在页面加载前按用户的选择改过来\n   */\n  documentAttrs(): DocumentAttrs;\n}\n\n/**\n * 应用级配置的 Vue 插件：`app.use(createUi({ theme: { light: lightTheme, dark: darkTheme } }))`。\n * 主题的 CSS 变量写在页面根元素上，所有 TSX 页面共享；应用卸载时撤销。\n */\nexport function createUi(options: UiOptions = {}): UiPlugin {\n  return {\n    documentAttrs() {\n      const html: Record<string, string> = {};\n      const body: Record<string, string> = {};\n      if (options.lang) {\n        const lang = defineLang(defaultConfig.lang, toValue(options.lang));\n        html.lang = lang.code;\n        html.dir = lang.direction;\n      }\n      if (options.theme || options.paintDocument) {\n        const theme = resolveTheme(toValue(options.theme) ?? defaultConfig.theme, false);\n        const { classes, variables } = rootThemeAttrs(theme, options.paintDocument ?? false);\n        if (classes.length) html.class = classes.join(' ');\n        const style = Object.entries(variables)\n          .map(([name, value]) => `${name}:${value}`)\n          .join(';');\n        if (style) html.style = style;\n        html['data-theme'] = theme.name;\n        if (options.paintDocument) body.class = css.attrs(documentStyles.body).class ?? '';\n      }\n      return { html, body };\n    },\n    install(app) {\n      const scope = effectScope();\n      app.onUnmount(() => scope.stop());\n      scope.run(() => {\n        const prefersDark = usePrefersDark();\n        const theme = computed(() =>\n          resolveTheme(toValue(options.theme) ?? defaultConfig.theme, prefersDark.value),\n        );\n        const lang = computed(() => defineLang(defaultConfig.lang, toValue(options.lang) ?? {}));\n        app.provide(ConfigContext.key, {\n          get theme() {\n            return theme.value;\n          },\n          get lang() {\n            return lang.value;\n          },\n          highlighter: options.highlighter,\n          textMatcher: options.textMatcher,\n          defaults: options.defaults ?? {},\n          styles: mergeStyles({}, options.styles),\n          router: options.router,\n          permissions: options.permissions,\n          http: options.http,\n          workCalendar: options.workCalendar,\n          ripple: options.ripple ?? true,\n        });\n        // 应用级的语言也写在页面根元素上（Provider 写在自己的元素上）：读屏按 lang 选发音，\n        // 从右到左的语言靠 dir 镜像排版与滚动条；没传 lang 时不动，宿主自己管\n        if (options.lang && typeof document !== 'undefined') {\n          const root = document.documentElement;\n          const previous = { lang: root.lang, dir: root.dir };\n          watchEffect(() => {\n            root.lang = lang.value.code;\n            root.dir = lang.value.direction;\n          });\n          app.onUnmount(() => Object.assign(root, previous));\n        }\n        // 应用级没有容器元素，主题变量挂在页面根元素上；变量名带 vtp- 前缀，不会与宿主冲突。\n        // 只开 paintDocument、不传主题时用默认主题（整页也要有底色、字体，body 去掉外边距）\n        if ((options.theme || options.paintDocument) && typeof document !== 'undefined') {\n          const root = document.documentElement;\n          // themeBootScript 在应用加载前写的行内颜色：交给主题的 class\n          if (options.paintDocument) root.style.removeProperty('background-color');\n          if (options.paintDocument) root.style.removeProperty('color');\n          watchEffect((onCleanup) =>\n            onCleanup(applyTheme(root, theme.value, options.paintDocument ?? false)),\n          );\n          if (options.paintDocument && document.body) {\n            const body = document.body;\n            const classes = css.attrs(documentStyles.body).class?.split(' ') ?? [];\n            body.classList.add(...classes);\n            app.onUnmount(() => body.classList.remove(...classes));\n          }\n        }\n      });\n    },\n  };\n}\n\n/** 主题挂到页面根元素上的类与 CSS 变量；paint 时加上整页的底色与字体（浏览器里写到元素上，服务端写进 HTML） */\nfunction rootThemeAttrs(theme: Theme, paint: boolean) {\n  const classes =\n    css\n      .attrs(...theme.styles, paint && documentStyles.page)\n      .class?.split(' ')\n      .filter(Boolean) ?? [];\n  return { classes, variables: themeVariables(theme) };\n}\n\n/** 把主题的 class、CSS 变量与 data-theme 写到元素上，返回撤销函数 */\nfunction applyTheme(element: HTMLElement, theme: Theme, paint: boolean) {\n  const { classes, variables } = rootThemeAttrs(theme, paint);\n  element.classList.add(...classes);\n  for (const [name, value] of Object.entries(variables)) element.style.setProperty(name, value);\n  element.dataset.theme = theme.name;\n  return () => {\n    element.classList.remove(...classes);\n    for (const name of Object.keys(variables)) element.style.removeProperty(name);\n    delete element.dataset.theme;\n  };\n}\n"],"mappings":";;;;;;;;;;;;;AA8DA,IAAa,iBAAiB,IAAI,OAAO;CAEvC,MAAM;EACJ,iBAAiB;EACjB,OAAO;EACP,YAAY;EACZ,YAAY;EAEZ,qBAAqB;EACrB,qBAAqB;CACvB;CAEA,MAAM,EAAE,QAAQ,EAAE;AACpB,CAAC;;;;;AAuBD,SAAgB,SAAS,UAAqB,CAAC,GAAa;CAC1D,OAAO;EACL,gBAAgB;GACd,MAAM,OAA+B,CAAC;GACtC,MAAM,OAA+B,CAAC;GACtC,IAAI,QAAQ,MAAM;IAChB,MAAM,OAAO,WAAW,cAAc,MAAM,QAAQ,QAAQ,IAAI,CAAC;IACjE,KAAK,OAAO,KAAK;IACjB,KAAK,MAAM,KAAK;GAClB;GACA,IAAI,QAAQ,SAAS,QAAQ,eAAe;IAC1C,MAAM,QAAQ,aAAa,QAAQ,QAAQ,KAAK,KAAK,cAAc,OAAO,KAAK;IAC/E,MAAM,EAAE,SAAS,cAAc,eAAe,OAAO,QAAQ,iBAAiB,KAAK;IACnF,IAAI,QAAQ,QAAQ,KAAK,QAAQ,QAAQ,KAAK,GAAG;IACjD,MAAM,QAAQ,OAAO,QAAQ,SAAS,CAAC,CACpC,KAAK,CAAC,MAAM,WAAW,GAAG,KAAI,GAAI,OAAO,CAAC,CAC1C,KAAK,GAAG;IACX,IAAI,OAAO,KAAK,QAAQ;IACxB,KAAK,gBAAgB,MAAM;IAC3B,IAAI,QAAQ,eAAe,KAAK,QAAQ,IAAI,MAAM,eAAe,IAAI,CAAC,CAAC,SAAS;GAClF;GACA,OAAO;IAAE;IAAM;GAAK;EACtB;EACA,QAAQ,KAAK;GACX,MAAM,QAAQ,YAAY;GAC1B,IAAI,gBAAgB,MAAM,KAAK,CAAC;GAChC,MAAM,UAAU;IACd,MAAM,cAAc,eAAe;IACnC,MAAM,QAAQ,eACZ,aAAa,QAAQ,QAAQ,KAAK,KAAK,cAAc,OAAO,YAAY,KAAK,CAC/E;IACA,MAAM,OAAO,eAAe,WAAW,cAAc,MAAM,QAAQ,QAAQ,IAAI,KAAK,CAAC,CAAC,CAAC;IACvF,IAAI,QAAQ,cAAc,KAAK;KAC7B,IAAI,QAAQ;MACV,OAAO,MAAM;KACf;KACA,IAAI,OAAO;MACT,OAAO,KAAK;KACd;KACA,aAAa,QAAQ;KACrB,aAAa,QAAQ;KACrB,UAAU,QAAQ,YAAY,CAAC;KAC/B,QAAQ,YAAY,CAAC,GAAG,QAAQ,MAAM;KACtC,QAAQ,QAAQ;KAChB,aAAa,QAAQ;KACrB,MAAM,QAAQ;KACd,cAAc,QAAQ;KACtB,QAAQ,QAAQ,UAAU;IAC5B,CAAC;IAGD,IAAI,QAAQ,QAAQ,OAAO,aAAa,aAAa;KACnD,MAAM,OAAO,SAAS;KACtB,MAAM,WAAW;MAAE,MAAM,KAAK;MAAM,KAAK,KAAK;KAAI;KAClD,kBAAkB;MAChB,KAAK,OAAO,KAAK,MAAM;MACvB,KAAK,MAAM,KAAK,MAAM;KACxB,CAAC;KACD,IAAI,gBAAgB,OAAO,OAAO,MAAM,QAAQ,CAAC;IACnD;IAGA,KAAK,QAAQ,SAAS,QAAQ,kBAAkB,OAAO,aAAa,aAAa;KAC/E,MAAM,OAAO,SAAS;KAEtB,IAAI,QAAQ,eAAe,KAAK,MAAM,eAAe,kBAAkB;KACvE,IAAI,QAAQ,eAAe,KAAK,MAAM,eAAe,OAAO;KAC5D,aAAa,cACX,UAAU,WAAW,MAAM,MAAM,OAAO,QAAQ,iBAAiB,KAAK,CAAC,CACzE;KACA,IAAI,QAAQ,iBAAiB,SAAS,MAAM;MAC1C,MAAM,OAAO,SAAS;MACtB,MAAM,UAAU,IAAI,MAAM,eAAe,IAAI,CAAC,CAAC,OAAO,MAAM,GAAG,KAAK,CAAA;MACpE,KAAK,UAAU,IAAI,GAAG,OAAO;MAC7B,IAAI,gBAAgB,KAAK,UAAU,OAAO,GAAG,OAAO,CAAC;KACvD;IACF;GACF,CAAC;EACH;CACF;AACF;;AAGA,SAAS,eAAe,OAAc,OAAgB;CAMpD,OAAO;EAAE,SAJP,IACG,MAAM,GAAG,MAAM,QAAQ,SAAS,eAAe,IAAI,CAAC,CACpD,OAAO,MAAM,GAAG,CAAC,CACjB,OAAO,OAAO,KAAK,CAAA;EACN,WAAW,eAAe,KAAK;CAAE;AACrD;;AAGA,SAAS,WAAW,SAAsB,OAAc,OAAgB;CACtE,MAAM,EAAE,SAAS,cAAc,eAAe,OAAO,KAAK;CAC1D,QAAQ,UAAU,IAAI,GAAG,OAAO;CAChC,KAAK,MAAM,CAAC,MAAM,UAAU,OAAO,QAAQ,SAAS,GAAG,QAAQ,MAAM,YAAY,MAAM,KAAK;CAC5F,QAAQ,QAAQ,QAAQ,MAAM;CAC9B,aAAa;EACX,QAAQ,UAAU,OAAO,GAAG,OAAO;EACnC,KAAK,MAAM,QAAQ,OAAO,KAAK,SAAS,GAAG,QAAQ,MAAM,eAAe,IAAI;EAC5E,OAAO,QAAQ,QAAQ;CACzB;AACF"}
+{"version":3,"file":"createUi.js","names":[],"sources":["../../src/config/createUi.ts"],"sourcesContent":["/**\n * 应用级配置：在宿主入口里 `app.use(createUi({ theme, lang }))`，所有 TSX 页面共享，不必逐页包裹 Provider。\n * 传入 ref 或 getter 即可在运行时切换主题与语言。\n */\nimport {\n  computed,\n  effectScope,\n  toValue,\n  watchEffect,\n  type MaybeRefOrGetter,\n  type ObjectPlugin,\n} from 'vue';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport {\n  ConfigContext,\n  defaultConfig,\n  type Highlighter,\n  type TextMatcher,\n  type UiPermissions,\n  type UiRouter,\n} from './context';\nimport type { ComponentDefaults } from './defaults';\nimport { mergeStyles, type ComponentStyles } from './styles';\nimport { defineLang, type Lang } from './lang/lang';\nimport { usePrefersDark } from '../utils/dom/media-query';\nimport type { WorkCalendar } from '../utils/data/workdays';\nimport type { HttpClient } from '../utils/request/http';\nimport { resolveTheme, themeVariables, type Theme, type ThemeInput } from './theme/theme';\n\n/** 应用级配置；theme 与 lang 可以传 ref 或 getter，运行时切换，其余在安装时确定 */\nexport interface UiOptions {\n  /** 主题；不写时用亮色主题，也不改动页面根元素 */\n  theme?: MaybeRefOrGetter<ThemeInput>;\n  /** 只写要改的字段，其余用简体中文的默认值 */\n  lang?: MaybeRefOrGetter<Partial<Lang>>;\n  /** 代码高亮器（CodeBlock 用），如 `@zerodep-dev/vue-tsx-pro-ui/shiki` 的 createShikiHighlighter()；不写时显示纯文本 */\n  highlighter?: Highlighter;\n  /** 额外的文字匹配，如 `@zerodep-dev/vue-tsx-pro-ui/pinyin` 的 createPinyinMatcher()：选项过滤、命令面板认拼音；不写时只按字面匹配 */\n  textMatcher?: TextMatcher;\n  /** 组件默认值，如 `{ Button: { variant: 'outline' } }`（见 defaults.ts） */\n  defaults?: ComponentDefaults;\n  /** 组件的主题定制：追加样式、新增档位，如 `{ Button: { base: { root: { letterSpacing: '0.02em' } } } }`（见 styles.ts） */\n  styles?: ComponentStyles;\n  /** 路由适配：站内链接不刷新页面地跳转、导航组件判断当前页（见 UiRouter） */\n  router?: UiRouter;\n  /** 权限判断：`(权限点) => 用户有没有`，Can、useCan 据此控制按钮等界面；不写时一律放行（见 UiPermissions） */\n  permissions?: UiPermissions;\n  /** 请求客户端：createHttpClient({ baseURL, onRequest, onResponse })，或包一层 axios、ky（见 HttpClient） */\n  http?: HttpClient;\n  /** 工作日历：createWorkCalendar({ holidays, workdays }) 带上法定节假日与调休；不写时只按周末算 */\n  workCalendar?: WorkCalendar;\n  /** 按下时的波纹效果，默认 true；关掉后组件的 ripple prop 仍可单独打开 */\n  ripple?: boolean;\n  /**\n   * 页面根元素也用主题的背景色、文字色与字体，并去掉 body 的默认外边距，默认 false。\n   * 整页都由组件库主题管理的站点（如文档站）打开：页面边缘、回弹滚动露出的地方不再是浏览器的默认色，\n   * AppShell 贴满窗口、四周不留 8px 的白边；配合 themeBootScript 时接手它写的行内颜色\n   */\n  paintDocument?: boolean;\n}\n\n/** paintDocument 时页面根元素的样式 */\nexport const documentStyles = css.create({\n  // 字号不设：根元素的字号是 rem 的基准，留给浏览器（用户的字号设置）\n  page: {\n    backgroundColor: '_background',\n    color: '_text',\n    fontFamily: '_sans',\n    lineHeight: '_normal',\n    // macOS 上用灰度抗锯齿，深色底上的浅色文字不发虚；其他系统忽略\n    WebkitFontSmoothing: 'antialiased',\n    MozOsxFontSmoothing: 'grayscale',\n  },\n  // 浏览器给 body 的 8px 外边距：整页的外壳（AppShell）要贴满窗口\n  body: { margin: 0 },\n});\n\n/** 服务端渲染时 `<html>` 与 `<body>` 要带的属性（createUi 在浏览器里写到页面根元素上的那些） */\nexport interface DocumentAttrs {\n  /** `<html>` 的属性：主题的类、变量（style）、data-theme，传了 lang 时还有 lang、dir */\n  html: Record<string, string>;\n  /** `<body>` 的属性：paintDocument 时去掉外边距的类 */\n  body: Record<string, string>;\n}\n\n/** createUi 的结果：Vue 插件，另外能给出服务端渲染时页面根元素的属性 */\nexport interface UiPlugin extends ObjectPlugin {\n  /**\n   * 服务端渲染：`<html>`、`<body>` 要带的属性，首屏就是这套主题与语言，不等客户端接管后再变。\n   * 服务端不知道系统的明暗，跟随系统的主题按亮色给；`themeBootScript` 在页面加载前按用户的选择改过来\n   */\n  documentAttrs(): DocumentAttrs;\n}\n\n/**\n * 应用级配置的 Vue 插件：`app.use(createUi({ theme: { light: lightTheme, dark: darkTheme } }))`。\n * 主题的 CSS 变量写在页面根元素上，所有 TSX 页面共享；应用卸载时撤销。\n */\nexport function createUi(options: UiOptions = {}): UiPlugin {\n  return {\n    documentAttrs() {\n      const html: Record<string, string> = {};\n      const body: Record<string, string> = {};\n      if (options.lang) {\n        const lang = defineLang(defaultConfig.lang, toValue(options.lang));\n        html.lang = lang.code;\n        html.dir = lang.direction;\n      }\n      if (options.theme || options.paintDocument) {\n        const theme = resolveTheme(toValue(options.theme) ?? defaultConfig.theme, false);\n        const { classes, variables } = rootThemeAttrs(theme, options.paintDocument ?? false);\n        if (classes.length) html.class = classes.join(' ');\n        const style = Object.entries(variables)\n          .map(([name, value]) => `${name}:${value}`)\n          .join(';');\n        if (style) html.style = style;\n        html['data-theme'] = theme.name;\n        if (options.paintDocument) body.class = css.attrs(documentStyles.body).class ?? '';\n      }\n      return { html, body };\n    },\n    install(app) {\n      const scope = effectScope();\n      app.onUnmount(() => scope.stop());\n      scope.run(() => {\n        const prefersDark = usePrefersDark();\n        const theme = computed(() =>\n          resolveTheme(toValue(options.theme) ?? defaultConfig.theme, prefersDark.value),\n        );\n        const lang = computed(() => defineLang(defaultConfig.lang, toValue(options.lang) ?? {}));\n        app.provide(ConfigContext.key, {\n          get theme() {\n            return theme.value;\n          },\n          get lang() {\n            return lang.value;\n          },\n          highlighter: options.highlighter,\n          textMatcher: options.textMatcher,\n          defaults: options.defaults ?? {},\n          styles: mergeStyles({}, options.styles),\n          router: options.router,\n          permissions: options.permissions,\n          http: options.http,\n          workCalendar: options.workCalendar,\n          ripple: options.ripple ?? true,\n        });\n        // 应用级的语言也写在页面根元素上（Provider 写在自己的元素上）：读屏按 lang 选发音，\n        // 从右到左的语言靠 dir 镜像排版与滚动条；没传 lang 时不动，宿主自己管\n        if (options.lang && typeof document !== 'undefined') {\n          const root = document.documentElement;\n          const previous = { lang: root.lang, dir: root.dir };\n          watchEffect(() => {\n            root.lang = lang.value.code;\n            root.dir = lang.value.direction;\n          });\n          app.onUnmount(() => Object.assign(root, previous));\n        }\n        // 应用级没有容器元素，主题变量挂在页面根元素上；变量名带 vtp- 前缀，不会与宿主冲突。\n        // 只开 paintDocument、不传主题时用默认主题（整页也要有底色、字体，body 去掉外边距）\n        if ((options.theme || options.paintDocument) && typeof document !== 'undefined') {\n          const root = document.documentElement;\n          // themeBootScript 在应用加载前写的行内颜色：交给主题的 class\n          if (options.paintDocument) root.style.removeProperty('background-color');\n          if (options.paintDocument) root.style.removeProperty('color');\n          watchEffect((onCleanup) =>\n            onCleanup(applyTheme(root, theme.value, options.paintDocument ?? false)),\n          );\n          if (options.paintDocument && document.body) {\n            const body = document.body;\n            const classes = css.attrs(documentStyles.body).class?.split(' ') ?? [];\n            body.classList.add(...classes);\n            app.onUnmount(() => body.classList.remove(...classes));\n          }\n        }\n      });\n    },\n  };\n}\n\n/** 主题挂到页面根元素上的类与 CSS 变量；paint 时加上整页的底色与字体（浏览器里写到元素上，服务端写进 HTML） */\nfunction rootThemeAttrs(theme: Theme, paint: boolean) {\n  const classes =\n    css\n      .attrs(...theme.styles, paint && documentStyles.page)\n      .class?.split(' ')\n      .filter(Boolean) ?? [];\n  return { classes, variables: themeVariables(theme) };\n}\n\n/** 把主题的 class、CSS 变量与 data-theme 写到元素上，返回撤销函数 */\nfunction applyTheme(element: HTMLElement, theme: Theme, paint: boolean) {\n  const { classes, variables } = rootThemeAttrs(theme, paint);\n  element.classList.add(...classes);\n  for (const [name, value] of Object.entries(variables)) element.style.setProperty(name, value);\n  element.dataset.theme = theme.name;\n  return () => {\n    element.classList.remove(...classes);\n    for (const name of Object.keys(variables)) element.style.removeProperty(name);\n    delete element.dataset.theme;\n  };\n}\n"],"mappings":"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"}

package/dist/config/theme/coffee.d.ts

@@ -1,4 +1,4 @@
-import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
 import type { Theme } from './theme';
 /**
  * 咖啡主题的颜色：浓缩咖啡色的页面、焦糖色的品牌色 `#c8915a`（配深色字）、奶泡色的文字。中性色按 slate 暗色各级亮度换成暖棕色相（oklch 55°），品牌色取 Radix brown 色阶。