base-paint 0.3.13 → 0.3.15

package/dist/components/compare-columns/model.js

@@ -0,0 +1,112 @@
+/** compare-columns · **入参归一化与校验**（把 `any` 与说不出的 `unknown` 挡在门外，产出内部类型）。
+ *
+ *  三条口径：
+ *   1. **非法入参一律 `badInput()`**（抛 `BlocksError`）——不静默降级：猜出来的骨架会在页面上长成
+ *      另一种东西，而调用方以为拿到了本件。
+ *   2. **两窗的数值是「数」，不是「串」**：条长按它们算，数字也由它们出——两处同源，才不会有
+ *      「条长按 A、数字写 B」这种对不上的对照表。显示串由 `showNumber()` 统一出（千分位、最多两位小数）。
+ *   3. **只列两窗都有的项**：交集归调用方算。本件没有「这一侧缺值」这一档——缺一边的项不是对照项，
+ *      硬塞进来会让差额的含义变味（差额 ＝ 各共同项之差的和）。
+ */
+import { assertPlainObject, badInput, optExtraClass, optText, reqText } from '../shared/validate.js';
+import { COMPARE_COLUMNS_CALIBER_LABEL, COMPARE_COLUMNS_DIFF_LABEL, COMPARE_COLUMNS_DOWN, COMPARE_COLUMNS_FLAT, COMPARE_COLUMNS_FORMS, COMPARE_COLUMNS_MINUS, COMPARE_COLUMNS_PLUS, COMPARE_COLUMNS_SENSES, COMPARE_COLUMNS_UP, } from './attrs.js';
+/** 方向 → 字形。 */
+const GLYPHS = {
+    up: COMPARE_COLUMNS_UP,
+    down: COMPARE_COLUMNS_DOWN,
+    flat: COMPARE_COLUMNS_FLAT,
+};
+/** 语气档 → 这一档下「涨／跌」各自是 good 还是 bad（`flat` 永不着色：持平没有方向可言）。 */
+const SENSE_TONE = {
+    neutral: { up: 'good', down: 'good' },
+    'up-good': { up: 'good', down: 'bad' },
+    'down-good': { up: 'bad', down: 'good' },
+};
+/** 显示串：千分位 ＋ 最多两位小数（尾零去掉）＋ 负号。本件所有数字只经它上屏（一处口径，两列与差额同款）。 */
+export function showNumber(value) {
+    const rounded = Math.round(value * 100) / 100;
+    const text = String(Math.abs(rounded));
+    const dot = text.indexOf('.');
+    const int = dot < 0 ? text : text.slice(0, dot);
+    const frac = dot < 0 ? '' : text.slice(dot + 1);
+    const grouped = int.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+    return (rounded < 0 ? COMPARE_COLUMNS_MINUS : '') + grouped + (frac === '' ? '' : '.' + frac);
+}
+/** 条长：这一侧的值 ÷ 两窗共同的最大值（0–100 的一位小数；两窗共用一条刻度才可直比）。 */
+function widthOf(value, max) {
+    if (max <= 0)
+        return '0';
+    return String(Math.round((value / max) * 1000) / 10);
+}
+/** 必须是**有限数且 ≥ 0**（两窗的金额／次数／热量都不该是负的；负值的条长无从谈起）。 */
+function reqAmount(value, field) {
+    if (typeof value !== 'number' || !Number.isFinite(value))
+        badInput(field + ' 必须是有限数（两窗的数值给数、不给串）');
+    if (value < 0)
+        badInput(field + ' 必须 ≥ 0（条长按「值 ÷ 两窗最大值」算，负值无长度可言）');
+    return value;
+}
+/** 一行：项名必填非空；两侧各是一个 ≥ 0 的有限数。 */
+function rowModel(raw, index) {
+    const field = 'compare-columns: input.rows[' + index + ']';
+    assertPlainObject(raw, field);
+    const row = raw;
+    return {
+        label: reqText(row.label, field + '.label'),
+        left: reqAmount(row.left, field + '.left'),
+        right: reqAmount(row.right, field + '.right'),
+    };
+}
+/** 入参归一化。**唯一入口**：`render.ts` 只吃它产出的 `CompareColumnsModel`。 */
+export function normalizeCompareColumns(input) {
+    assertPlainObject(input, 'renderCompareColumns: input');
+    const raw = input;
+    const form = raw.form === undefined ? COMPARE_COLUMNS_FORMS[0] : raw.form;
+    if (!COMPARE_COLUMNS_FORMS.includes(form)) {
+        badInput('compare-columns: input.form 必须是 ' + COMPARE_COLUMNS_FORMS.join('／') + ' 之一（本件只落地形态 A）');
+    }
+    const sense = raw.sense === undefined ? COMPARE_COLUMNS_SENSES[0] : raw.sense;
+    if (!COMPARE_COLUMNS_SENSES.includes(sense)) {
+        badInput('compare-columns: input.sense 必须是 ' + COMPARE_COLUMNS_SENSES.join('／') + ' 之一');
+    }
+    const unit = optText(raw.unit, 'compare-columns: input.unit');
+    const caliber = optText(raw.caliber, 'compare-columns: input.caliber');
+    const extra = optExtraClass(raw.extraClass, 'compare-columns: input.extraClass');
+    const leftLabel = reqText(raw.leftLabel, 'compare-columns: input.leftLabel');
+    const rightLabel = reqText(raw.rightLabel, 'compare-columns: input.rightLabel');
+    const list = raw.rows;
+    if (!Array.isArray(list))
+        badInput('compare-columns: input.rows 必须是数组（只列两窗都有的项）');
+    const items = list.map((row, i) => rowModel(row, i));
+    const max = items.reduce((acc, r) => Math.max(acc, r.left, r.right), 0);
+    const rows = items.map((r) => ({
+        label: r.label,
+        leftText: showNumber(r.left),
+        rightText: showNumber(r.right),
+        leftWidth: widthOf(r.left, max),
+        rightWidth: widthOf(r.right, max),
+    }));
+    let sum = 0;
+    for (const r of items)
+        sum += r.right - r.left;
+    const diff = Math.round(sum * 100) / 100;
+    const diffDirection = diff > 0 ? 'up' : (diff < 0 ? 'down' : 'flat');
+    const senseTone = SENSE_TONE[sense];
+    const diffTone = diffDirection === 'flat' || sense === 'neutral' ? undefined : senseTone[diffDirection];
+    return {
+        form: form,
+        leftLabel,
+        rightLabel,
+        rows,
+        diff,
+        diffDirection,
+        diffGlyph: GLYPHS[diffDirection],
+        diffText: (diff > 0 ? COMPARE_COLUMNS_PLUS : (diff < 0 ? COMPARE_COLUMNS_MINUS : '')) + showNumber(Math.abs(diff)),
+        ...(diffTone === undefined ? {} : { diffTone }),
+        diffLabel: COMPARE_COLUMNS_DIFF_LABEL,
+        caliberLabel: COMPARE_COLUMNS_CALIBER_LABEL,
+        ...(unit === undefined ? {} : { unit }),
+        ...(caliber === undefined ? {} : { caliber }),
+        ...(extra === undefined ? {} : { extraClass: extra }),
+    };
+}

package/dist/components/compare-columns/model.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"model.js","sourceRoot":"","sources":["../../../src/components/compare-columns/model.ts"],"names":[],"mappings":"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"}

package/dist/components/compare-columns/render.d.ts

@@ -0,0 +1,4 @@
+/** 渲染双列对照（纯函数：同样的入参恒产同样的字节；转义只经 `shared/escape.ts`）。
+ *  `rows: []` ⇒ **空串**（两窗没有共同项时不留一个空壳；「两边都没有」这句话归调用方自己说）。 */
+export declare function renderCompareColumns(input: unknown): string;
+//# sourceMappingURL=render.d.ts.map

package/dist/components/compare-columns/render.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../../src/components/compare-columns/render.ts"],"names":[],"mappings":"AAkGA;6DAC6D;AAC7D,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,CAK3D"}

package/dist/components/compare-columns/render.js

@@ -0,0 +1,92 @@
+/** compare-columns · **渲染**（纯函数产 HTML；本件只有形态 A「背靠背条形」一种骨架）。
+ *
+ *  —— 形态 A：背靠背条形 ——
+ *
+ *  一行三格：**左窗格 ｜ 项名 ｜ 右窗格**。左窗格是「值 ＋ 一条伸向中线的条」，右窗格是
+ *  「一条从中线伸出的条 ＋ 值」——两侧共用一条刻度（都按两窗最大值折算），所以**条长可直接比**；
+ *  数字读准值，条读差距。最后一格是**差额单独一行**（本形态的结论位），再下面是口径行。
+ *
+ *  它替掉的两种错法：
+ *   · 两窗各写一张表 ⇒ 读者要自己找同一项在两处的两行；
+ *   · 只报差额不报两侧 ⇒ 读者不知道差额从哪来、哪一项在拉。
+ *
+ *  三条硬口径（判据断的就是它们）：
+ *   · 条长与数字**同源**（都来自入参的数）：条长按「值 ÷ 两窗最大值」，不是拍出来的百分比；
+ *   · 方向**不只靠色**：涨／跌／持平一律「字形 ＋ 正负号」，色阶是可选的第三样（`sense`）；
+ *   · 标记里**不写分隔符与占位符**：两侧窗口名在宽档由表头行给、窄档由每侧的窗口名给，两处不重复念；
+ *     长串一律 `overflow-wrap: anywhere`，项名与窗口名不许 `…` 截断。
+ */
+import { esc } from '../shared/escape.js';
+import { COMPARE_COLUMNS_CLASS, compareColumnsDirectionClass, compareColumnsSideClass, compareColumnsSlot, compareColumnsToneClass, } from './attrs.js';
+import { normalizeCompareColumns } from './model.js';
+/** 值那一格（含单位）：单位小一号、跟在数字后（与账目行／明细行同一条写法）。 */
+function valueHtml(m, text) {
+    return '<b class="' + compareColumnsSlot('value') + '">' + esc(text)
+        + (m.unit === undefined ? '' : '<small class="' + compareColumnsSlot('unit') + '">' + esc(m.unit) + '</small>')
+        + '</b>';
+}
+/** 条的外框（填充宽度＝这一侧的值 ÷ 两窗最大值）。条是**装饰**：值已经以文本上屏，故 `aria-hidden`。 */
+function barHtml(width) {
+    return '<span class="' + compareColumnsSlot('bar') + '" aria-hidden="true">'
+        + '<i class="' + compareColumnsSlot('fill') + '" style="width: ' + width + '%"></i></span>';
+}
+/** 一侧：窗口名（窄档才现）／值／条。左窗把条排在值后（伸向中线），右窗把条排在值前（从中线伸出）。 */
+function sideHtml(m, side, row) {
+    const name = side === 'left' ? m.leftLabel : m.rightLabel;
+    const text = side === 'left' ? row.leftText : row.rightText;
+    const width = side === 'left' ? row.leftWidth : row.rightWidth;
+    const nameSlot = '<span class="' + compareColumnsSlot('side-name') + '">' + esc(name) + '</span>';
+    return '<span class="' + compareColumnsSlot('side') + ' ' + compareColumnsSideClass(side) + '">'
+        + (side === 'left' ? nameSlot + valueHtml(m, text) + barHtml(width) : nameSlot + barHtml(width) + valueHtml(m, text))
+        + '</span>';
+}
+/** 表头行：左右两个窗口名，中缝那一列留空（对齐逐项行中缝的项名列）。 */
+function headHtml(m) {
+    return '<div class="' + compareColumnsSlot('head') + '">'
+        + '<span class="' + compareColumnsSlot('head-left') + '">' + esc(m.leftLabel) + '</span>'
+        + '<span class="' + compareColumnsSlot('head-right') + '">' + esc(m.rightLabel) + '</span>'
+        + '</div>';
+}
+/** 差额那一行：标签 ＋ 方向字形 ＋ 带号的差额 ＋ 单位（语气色阶只在 `sense` 点名时上）。 */
+function diffHtml(m) {
+    const tone = m.diffTone === undefined ? '' : ' ' + compareColumnsToneClass(m.diffTone);
+    return '<div class="' + compareColumnsSlot('diff') + '">'
+        + '<span class="' + compareColumnsSlot('diff-label') + '">' + esc(m.diffLabel) + '</span>'
+        + '<b class="' + compareColumnsSlot('diff-value') + ' ' + compareColumnsDirectionClass(m.diffDirection) + tone + '">'
+        + '<i aria-hidden="true">' + m.diffGlyph + '</i>' + esc(m.diffText)
+        + (m.unit === undefined ? '' : '<small class="' + compareColumnsSlot('unit') + '">' + esc(m.unit) + '</small>')
+        + '</b>'
+        + '</div>';
+}
+/** 口径行：左端一枚标签（「口径」）＋ 一句话（这几个窗口到底是什么、差额怎么算的）。 */
+function caliberHtml(m) {
+    if (m.caliber === undefined)
+        return '';
+    return '<p class="' + compareColumnsSlot('caliber') + '"><b>' + esc(m.caliberLabel) + '</b>'
+        + '<span>' + esc(m.caliber) + '</span></p>';
+}
+/** 形态 A 的骨架。 */
+function renderBackToBack(m) {
+    const rows = m.rows.map((row) => '<div class="' + compareColumnsSlot('row') + '">'
+        + sideHtml(m, 'left', row)
+        + '<span class="' + compareColumnsSlot('label') + '">' + esc(row.label) + '</span>'
+        + sideHtml(m, 'right', row)
+        + '</div>').join('');
+    return headHtml(m)
+        + '<div class="' + compareColumnsSlot('list') + '">' + rows + '</div>'
+        + diffHtml(m)
+        + caliberHtml(m);
+}
+/** 形态 → 骨架（本件只有一格；分派写在这里，加第二形态就是加一支）。 */
+const SKELETONS = {
+    'back-to-back': renderBackToBack,
+};
+/** 渲染双列对照（纯函数：同样的入参恒产同样的字节；转义只经 `shared/escape.ts`）。
+ *  `rows: []` ⇒ **空串**（两窗没有共同项时不留一个空壳；「两边都没有」这句话归调用方自己说）。 */
+export function renderCompareColumns(input) {
+    const m = normalizeCompareColumns(input);
+    if (m.rows.length === 0)
+        return '';
+    const extra = m.extraClass === undefined ? '' : ' ' + m.extraClass;
+    return '<div class="' + COMPARE_COLUMNS_CLASS + ' is-' + m.form + extra + '">' + SKELETONS[m.form](m) + '</div>';
+}

package/dist/components/compare-columns/render.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.js","sourceRoot":"","sources":["../../../src/components/compare-columns/render.ts"],"names":[],"mappings":"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"}

package/dist/components/compare-columns/style.d.ts

@@ -0,0 +1,13 @@
+/** 窄容器阈值（px）：两列并排改走「每项三行」。判的是**本件自己的宽度**（`@container`），不是视口宽度。 */
+export declare const COMPARE_COLUMNS_NARROW_PX = 560;
+/** 中缝项名列的定宽带（em）：两窗的条长因它可比，项名长了在这条带里换行。 */
+export declare const COMPARE_COLUMNS_LABEL_BAND_EM = 6;
+/** 条的最小宽度（px）：容器的宽度全被两侧的读数吃掉时，条仍留得下一条可见的长度。 */
+export declare const COMPARE_COLUMNS_BAR_MIN_PX = 8;
+/** 条的厚度（px）。 */
+export declare const COMPARE_COLUMNS_BAR_THICKNESS_PX = 8;
+/** 本组件的样式段。恒返回非空 CSS 文本。 */
+export declare function compareColumnsCss(input?: {
+    readonly prefix?: string;
+}): string;
+//# sourceMappingURL=style.d.ts.map

package/dist/components/compare-columns/style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../../src/components/compare-columns/style.ts"],"names":[],"mappings":"AA0BA,kEAAkE;AAClE,eAAO,MAAM,yBAAyB,MAAM,CAAC;AAE7C,2CAA2C;AAC3C,eAAO,MAAM,6BAA6B,IAAI,CAAC;AAE/C,+CAA+C;AAC/C,eAAO,MAAM,0BAA0B,IAAI,CAAC;AAE5C,gBAAgB;AAChB,eAAO,MAAM,gCAAgC,IAAI,CAAC;AAElD,4BAA4B;AAC5B,wBAAgB,iBAAiB,CAAC,KAAK,CAAC,EAAE;IAAE,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,MAAM,CAmQ9E"}

package/dist/components/compare-columns/style.js

@@ -0,0 +1,287 @@
+/** compare-columns · **样式段**（本件唯一的样式来源）。
+ *
+ *  纪律（与本节其余件同一份）：
+ *   · 只经 `skinVar()` 读皮肤 —— 组件里**不写** `var(--ilife-…)`（兜底链只许住在 `skin/contract.ts`）；
+ *   · 全部规则 scope 在 `.<prefix>page-ui` 之下，且只读本件自己的类名；不写 `:root`／`!important`、不新增 token 名；
+ *   · **宽度只许容器判**：本件设 `container-type: inline-size`，窄档调整走 `@container`；本件**一条 `@media` 都没有**
+ *     （媒体查询只许判设备能力，不许判宽度——这些页面会被嵌进侧栏／面板／卡片）。
+ *
+ *  几何契约（判据钉住）：
+ *   · 宽档（≥ `COMPARE_COLUMNS_NARROW_PX`）＝三列「左窗 ｜ 项名 ｜ 右窗」，两侧的条**共用一条刻度**（按最大值折算）；
+ *   · 窄档（< 阈值）＝**每项三行**（项名一行、左窗一行、右窗一行），两侧改由每行自己的窗口名领读——
+ *     两列的读数在窄档绝不许被挤成「三条竖线」（项名一列、两侧各一列，字数一长就竖排）。
+ *   · 项名那一列是**定宽带**（`COMPARE_COLUMNS_LABEL_BAND_EM` em）：两窗的条长因此可比，
+ *     项名长了在这条带里换行，不许 `…` 截断。
+ */
+import { skinVar } from '../skin/contract.js';
+import { compareColumnsSideClass, compareColumnsSlot, compareColumnsToneClass, } from './attrs.js';
+/** 换行（仓库口径：不写字面换行转义）。 */
+const LF = String.fromCharCode(10);
+/** 窄容器阈值（px）：两列并排改走「每项三行」。判的是**本件自己的宽度**（`@container`），不是视口宽度。 */
+export const COMPARE_COLUMNS_NARROW_PX = 560;
+/** 中缝项名列的定宽带（em）：两窗的条长因它可比，项名长了在这条带里换行。 */
+export const COMPARE_COLUMNS_LABEL_BAND_EM = 6;
+/** 条的最小宽度（px）：容器的宽度全被两侧的读数吃掉时，条仍留得下一条可见的长度。 */
+export const COMPARE_COLUMNS_BAR_MIN_PX = 8;
+/** 条的厚度（px）。 */
+export const COMPARE_COLUMNS_BAR_THICKNESS_PX = 8;
+/** 本组件的样式段。恒返回非空 CSS 文本。 */
+export function compareColumnsCss(input) {
+    const p = input !== undefined && input !== null
+        && typeof input.prefix === 'string' && input.prefix !== '' ? input.prefix : 'ilife-';
+    const root = '.' + p + 'page-ui';
+    const box = root + ' .' + p + 'block-compare-columns';
+    const s = (slot) => root + ' .' + compareColumnsSlot(slot, p);
+    /** **组合符右侧一律用它**：带 scope 前缀的选择器只能出现在**最左**——`.scope .a > .scope .b` 里
+     *  第二个 `.scope` 改成要求「`.a` 的直接子元素里那个 `.scope`」，于是整条规则**永不命中**（实测踩过：
+     *  条的左右锚点、第一名的字号都因此没生效）。右侧只写本件自己的类名，作用域由最左那一段承担。 */
+    const inner = (slot) => '.' + compareColumnsSlot(slot, p);
+    const side = box + '-side';
+    const label = box + '-label';
+    const bar = box + '-bar';
+    const barBare = inner('bar');
+    const fillBare = inner('fill');
+    const rowBare = inner('row');
+    const value = box + '-value';
+    const band = 'minmax(0, ' + String(COMPARE_COLUMNS_LABEL_BAND_EM) + 'em)';
+    const track = 'minmax(' + String(COMPARE_COLUMNS_BAR_MIN_PX) + 'px, 1fr)';
+    return [
+        '/* compare-columns（双列对照 · 形态 A「背靠背条形」）：左窗 ｜ 项名 ｜ 右窗 ＋ 差额单独一行。',
+        '   层次不靠阴影与大圆角：靠中缝那一列、发丝线、条长差 ⇒ 换皮只换取值。 */',
+        box + ' {',
+        /* 宽度判据的落点：本件是**自己的容器**——嵌进侧栏／面板／卡片时照样按自己的宽度改档。 */
+        '  container-type: inline-size;',
+        '  display: grid;',
+        '  gap: 2px;',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink') + ';',
+        '  font-family: ' + skinVar('font') + ';',
+        '  font-size: ' + skinVar('fs-body') + ';',
+        '  line-height: 1.5;',
+        '}',
+        '/* 表头行：左右两个窗口名贴着中缝；中缝那一列与逐项行同一宽度（列头与项名对得上）。 */',
+        s('head') + ' {',
+        '  display: grid;',
+        '  grid-template-columns: minmax(0, 1fr) ' + band + ' minmax(0, 1fr);',
+        '  gap: 0 8px;',
+        '  padding-bottom: 6px;',
+        '  border-bottom: 1px solid ' + skinVar('line') + ';',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  font-weight: 700;',
+        '  letter-spacing: .02em;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        s('head-left') + ' {',
+        '  grid-column: 1;',
+        '  text-align: right;',
+        '}',
+        s('head-right') + ' {',
+        '  grid-column: 3;',
+        '  text-align: left;',
+        '}',
+        s('list') + ' {',
+        '  display: grid;',
+        '  min-width: 0;',
+        '}',
+        '/* 一项一行：三列与表头行同一模板 ⇒ 上下对得齐。 */',
+        s('row') + ' {',
+        '  display: grid;',
+        '  grid-template-columns: minmax(0, 1fr) ' + band + ' minmax(0, 1fr);',
+        '  gap: 0 8px;',
+        '  align-items: center;',
+        '  min-width: 0;',
+        '  padding: 8px 0;',
+        '}',
+        s('row') + ' + ' + rowBare + ' {',
+        '  border-top: 1px solid ' + skinVar('line') + ';',
+        '}',
+        '/* 两侧：左窗是「值 → 条」（条从外侧伸向中线），右窗是「条 → 值」（条从中线伸出）——',
+        '   两侧的条都从**外缘**起步、向中缝生长，于是两条的末端在同一根轴上可直接比。 */',
+        s('side') + ' {',
+        '  display: grid;',
+        '  align-items: center;',
+        '  gap: 8px;',
+        '  min-width: 0;',
+        '}',
+        side + '.' + compareColumnsSideClass('left') + ' {',
+        '  grid-template-columns: auto ' + track + ';',
+        '}',
+        side + '.' + compareColumnsSideClass('right') + ' {',
+        '  grid-template-columns: ' + track + ' auto;',
+        '}',
+        '/* 窗口名：宽档由表头行给（这里收起），窄档才在每一侧的领读位现身——同一句话不念两遍。',
+        '   **不写 `nowrap`**：窗口名一长（「最近三十天窗口」）就要能折行，不许把行顶宽。 */',
+        s('side-name') + ' {',
+        '  display: none;',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  font-weight: 700;',
+        '  letter-spacing: .02em;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        '/* 读数：数字走 `font-num` ＋ 等宽数字（换页／换值不跳位）。**不写 `nowrap`**：',
+        '   长读数宁可换行，也不许顶破容器（零横向溢出是硬判据）。 */',
+        s('value') + ' {',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink') + ';',
+        '  font-family: ' + skinVar('font-num') + ';',
+        '  font-size: ' + skinVar('fs-sm') + ';',
+        '  font-weight: 700;',
+        '  line-height: 1.35;',
+        '  font-variant-numeric: tabular-nums;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        s('unit') + ' {',
+        '  margin-left: 3px;',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  font-weight: 600;',
+        '}',
+        '/* 条：外框只负责长度，厚度与圆角取皮肤（报刊档圆角为 0，条成直角——这不算塌）。 */',
+        s('bar') + ' {',
+        '  display: block;',
+        '  min-width: 0;',
+        '  height: ' + String(COMPARE_COLUMNS_BAR_THICKNESS_PX) + 'px;',
+        '  background: ' + skinVar('surface-2') + ';',
+        '  border-radius: ' + skinVar('radius-pill') + ';',
+        '  overflow: hidden;',
+        '}',
+        s('fill') + ' {',
+        '  display: block;',
+        '  height: 100%;',
+        '  background: ' + skinVar('accent') + ';',
+        '  border-radius: ' + skinVar('radius-pill') + ';',
+        '}',
+        '/* 左窗的条贴着自己的读数起步（向外侧对齐），右窗的条贴着外缘（向中缝生长）。',
+        '   注意层级：填充住在外框**里面**（`.side > .bar > .fill`）——写成 `.side > .fill` 一条都不命中。 */',
+        side + '.' + compareColumnsSideClass('left') + ' > ' + barBare + ' > ' + fillBare + ' {',
+        '  margin-right: auto;',
+        '}',
+        side + '.' + compareColumnsSideClass('right') + ' > ' + barBare + ' > ' + fillBare + ' {',
+        '  margin-left: auto;',
+        '}',
+        '/* 中缝那一列：两窗都有的项名。定宽带里换行，长名不许 `…`。 */',
+        label + ' {',
+        '  grid-column: 2;',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-sm') + ';',
+        '  font-weight: 600;',
+        '  line-height: 1.45;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        '/* 差额单独一行：**本形态的结论位**，不是脚注——所以给它发丝线上沿与更大的字号。 */',
+        s('diff') + ' {',
+        '  display: flex;',
+        '  flex-wrap: wrap;',
+        '  align-items: baseline;',
+        '  gap: 4px 10px;',
+        '  min-width: 0;',
+        '  margin-top: 2px;',
+        '  padding: 10px 0 2px;',
+        '  border-top: 1px solid ' + skinVar('line') + ';',
+        '}',
+        s('diff-label') + ' {',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-sm') + ';',
+        '  font-weight: 700;',
+        '}',
+        s('diff-value') + ' {',
+        '  display: inline-flex;',
+        '  align-items: baseline;',
+        '  gap: 2px;',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink') + ';',
+        '  font-family: ' + skinVar('font-num') + ';',
+        '  font-size: ' + skinVar('fs-h3') + ';',
+        '  font-weight: 700;',
+        '  font-variant-numeric: tabular-nums;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        '/* 方向字形：非文本的强调位，取 `accent-text`（强调色的文本档，小字号也过对比地板）。 */',
+        s('diff-value') + ' > i {',
+        '  font-style: normal;',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  color: ' + skinVar('accent-text') + ';',
+        '}',
+        '/* 语气色阶只在 `sense` 点名时上——涨是好是坏由调用方定，本件不猜（缺省只有字形与正负号）。 */',
+        s('diff-value') + '.' + compareColumnsToneClass('good') + ' {',
+        '  color: ' + skinVar('ok') + ';',
+        '}',
+        s('diff-value') + '.' + compareColumnsToneClass('bad') + ' {',
+        '  color: ' + skinVar('danger') + ';',
+        '}',
+        '/* 口径行：这两个窗口到底是什么、差额怎么算的（要读的正文，走 `ink-2` 不走更浅的一档）。 */',
+        s('caliber') + ' {',
+        '  display: flex;',
+        '  flex-wrap: wrap;',
+        '  align-items: baseline;',
+        '  gap: 4px 8px;',
+        '  margin: 0;',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  line-height: 1.7;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        s('caliber') + ' > b {',
+        '  flex: none;',
+        '  color: ' + skinVar('ink') + ';',
+        '  font-weight: 700;',
+        '  letter-spacing: .06em;',
+        '}',
+        s('caliber') + ' > span {',
+        '  min-width: 0;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        '/* 本件自身不带可点元素。这一条是**地板**：调用方若把项名或读数包成链接，焦点必须看得见。 */',
+        box + ' :focus-visible {',
+        '  outline: 2px solid ' + skinVar('accent') + ';',
+        '  outline-offset: 2px;',
+        '}',
+        '/* 窄容器（<' + String(COMPARE_COLUMNS_NARROW_PX) + 'px）：三列并排会把项名与两侧读数挤成三条竖线',
+        '   ⇒ 每项改排**三行**：项名一行、左窗一行、右窗一行；两窗由每行自己的窗口名领读，表头行收起。 */',
+        '@container (max-width: ' + String(COMPARE_COLUMNS_NARROW_PX) + 'px) {',
+        '  ' + s('head') + ' {',
+        '    display: none;',
+        '  }',
+        '  ' + s('row') + ' {',
+        '    grid-template-columns: minmax(0, 1fr);',
+        '    gap: 2px;',
+        '    padding: 10px 0;',
+        '  }',
+        '  ' + label + ' {',
+        '    grid-column: 1;',
+        '    grid-row: 1;',
+        '  }',
+        /* 两处都写全（左右两个侧状态各一次）：窄档要覆盖宽档的单侧模板，选择器强度必须对得上。 */
+        '  ' + side + '.' + compareColumnsSideClass('left') + ',',
+        '  ' + side + '.' + compareColumnsSideClass('right') + ' {',
+        '    grid-template-columns: auto ' + track + ' auto;',
+        '  }',
+        '  ' + side + '.' + compareColumnsSideClass('left') + ' {',
+        '    grid-row: 2;',
+        '  }',
+        '  ' + side + '.' + compareColumnsSideClass('right') + ' {',
+        '    grid-row: 3;',
+        '  }',
+        '  ' + s('side-name') + ' {',
+        '    display: block;',
+        '    grid-column: 1;',
+        '  }',
+        '  ' + bar + ' {',
+        '    grid-column: 2;',
+        '  }',
+        '  ' + value + ' {',
+        '    grid-column: 3;',
+        '    text-align: right;',
+        '  }',
+        '  ' + side + '.' + compareColumnsSideClass('left') + ' > ' + barBare + ' > ' + fillBare + ',',
+        '  ' + side + '.' + compareColumnsSideClass('right') + ' > ' + barBare + ' > ' + fillBare + ' {',
+        '    margin-left: 0;',
+        '    margin-right: auto;',
+        '  }',
+        '}',
+    ].join(LF);
+}

package/dist/components/compare-columns/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../src/components/compare-columns/style.ts"],"names":[],"mappings":"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"}