base-paint 0.3.13 → 0.3.15

package/dist/components/small-multiples/style.js

@@ -0,0 +1,260 @@
+/** small-multiples · **样式段**（本件唯一的样式来源）。
+ *
+ *  纪律（与本节其余件同一份）：
+ *   · 只经 `skinVar()` 读皮肤 —— 组件里**不写** `var(--ilife-…)`（兜底链只许住在 `skin/contract.ts`）；
+ *   · 全部规则 scope 在 `.<prefix>page-ui` 之下（不开本配方页零命中）；不写 `:root`／`!important`、不新增 token 名；
+ *   · **宽度只许容器判**：布局靠 `@container` ＋ 内在尺寸 ＋ 纯 CSS 等分；本件不写任何 `@media`
+ *     （视口宽 ≠ 组件宽——这张卡会被嵌进侧栏／面板／卡片）。
+ *
+ *  几何契约（判据钉住）：
+ *   · **柱阵与横轴标签行是同一份列划分**：两个都是 `display:flex` ＋ 同一个 `gap` ＋ 子项 `flex: 1 1 0`，
+ *     列数由标记给（不写死 6）⇒ 标签永远对着它那一根柱，窄档也不会错位；
+ *   · **一根柱都不减**：这一档的「列」就是数据里的期间本身，减列＝删掉一个期间（那是改结构）。
+ *     窄容器里只收紧间距与图高、并让期间名与读数换行；
+ *   · **柱与均值线不靠颜色区分**：线的线型是虚线（`border-top: 2px dashed`）＋ 线上那枚标注写着「均值 …」，
+ *     卡头那句再说一遍「虚线＝N 期均值」——两样非色信息同时在；
+ *   · **均值那枚标注也在柱阵框内**：标注贴线长，长错方向就会顶出框（线在刻度中线之上时顶进卡头）——
+ *     故线在上半区（标记里的 `is-under`）标注画到**线下**，朝柱阵里长；
+ *   · **本期那一列有三样**：贯穿柱阵的竖标（形）＋ 轴上写着「本期」（字）＋ 强调色（色）。
+ */
+import { skinVar } from '../skin/contract.js';
+import { smallMultiplesSlot } from './attrs.js';
+/** 换行（仓库口径：不写字面换行转义）。 */
+const LF = String.fromCharCode(10);
+/** 柱阵区高度（px）：宽容器一档、窄容器一档。**判据拿它对两档几何**（本件自己的宽度，不是视口）。 */
+export const SMALL_MULTIPLES_PLOT_PX = 130;
+const NARROW_PLOT_PX = 118;
+/** 柱与柱之间的间距（px）：宽容器一档、窄容器一档（窄档收紧间距＝把宽度还给柱子）。 */
+const COL_GAP_PX = 6;
+const NARROW_COL_GAP_PX = 4;
+/** 窄容器阈值（px）：**这是本件自己的宽度**（`@container` 判的），不是视口宽。 */
+const NARROW_PX = 460;
+/** 本组件的样式段。恒返回非空 CSS 文本。 */
+export function smallMultiplesCss(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-small-multiples';
+    /* 槽类名（**不带 scope**）：只用在**已经落进本件某条选择器内部**的位置（前缀由外层那条选择器给）。
+       拿带 scope 的选择器去拼后代（`.page-ui .a .page-ui .b`）会拼出一条**永不命中**的死规则
+       （层的横切判据 ⑥ 会判红：一条选择器里作用域只许出现一次）。 */
+    const c = (slot) => '.' + smallMultiplesSlot(slot, p);
+    const s = (slot) => root + ' .' + smallMultiplesSlot(slot, p);
+    return [
+        '/* small-multiples（小倍数面板 · 期间并排迷你柱阵 ＋ 均值线）：同一个读数的几期并排成柱，',
+        '   共用一套归一化刻度横着比高低；虚线是这几期的均值。',
+        '   色一律从强调色系出（柱与本期竖标＝无文字的点／格／条走 accent 实底，「本期」那枚字走 accent-text），',
+        '   任何一处都不拿文字墨色当面；换皮只换取值、不换结构。 */',
+        box + ' {',
+        /* 宽度判据的落点：本件是**自己的容器**——嵌进侧栏／面板／卡片时照样按自己的宽度排。 */
+        '  container-type: inline-size;',
+        /* 宿主页不保证是 `border-box`（真页面默认 content-box）：本件带内距与边框的位子
+           在那种页里会比容器宽出那几像素 ⇒ 在本件**自己的子树里**把 `box-sizing` 钉成 `border-box`。 */
+        '  box-sizing: border-box;',
+        '  display: grid;',
+        '  gap: 10px;',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink') + ';',
+        '  font-family: ' + skinVar('font') + ';',
+        '  font-size: ' + skinVar('fs-body') + ';',
+        '  line-height: 1.5;',
+        '}',
+        box + ' * {',
+        '  box-sizing: border-box;',
+        '}',
+        s('hd') + ' {',
+        '  display: flex;',
+        '  flex-wrap: wrap;',
+        '  align-items: baseline;',
+        '  gap: 3px 10px;',
+        '  min-width: 0;',
+        '}',
+        s('title') + ' {',
+        '  margin: 0;',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink') + ';',
+        '  font-family: ' + skinVar('font-display') + ';',
+        '  font-size: ' + skinVar('fs-h3') + ';',
+        '  font-weight: 700;',
+        '  line-height: 1.35;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        /* 期间范围：照原型那一档的**墙胶囊**（`.chip`：强调色的字 ＋ 发丝描边 ＋ 30px 高、胶囊圆角）——
+           它是卡头里那枚「这组数是哪一段的」的坐标，与标题同排、与尾注分居两端。
+           **都不许 `nowrap`**：长串会把卡撑出容器（零横向溢出是硬判据），窄档没地方就换行
+           （`flex: 0 1 auto` ＋ `min-width: 0` 允许缩到内容宽度以下）。 */
+        s('stamp') + ' {',
+        '  display: inline-flex;',
+        '  align-items: center;',
+        '  flex: 0 1 auto;',
+        '  min-width: 0;',
+        '  min-height: 30px;',
+        '  padding: 0 12px;',
+        '  border: 1px solid ' + skinVar('line') + ';',
+        '  border-radius: ' + skinVar('radius-pill') + ';',
+        '  background: ' + skinVar('surface-2') + ';',
+        '  color: ' + skinVar('accent-text') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  font-weight: 600;',
+        '  font-variant-numeric: tabular-nums;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        /* 尾注（虚线是什么）：**`margin-left: auto` 只给它**——它把尾注顶到卡头右端，期间范围紧跟在标题后面
+           （两枚都写 auto 会把空白对半分，范围被甩到卡头正中——原型那一档不是那个样子）。 */
+        s('tail') + ' {',
+        '  flex: 0 1 auto;',
+        '  margin-left: auto;',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  font-weight: 700;',
+        '  font-variant-numeric: tabular-nums;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        /* 柱阵：一行并排的期间列（列数由标记给，不写死在样式里）。底边那道发丝线就是基线。 */
+        s('cols') + ' {',
+        '  position: relative;',
+        '  display: flex;',
+        '  gap: ' + String(COL_GAP_PX) + 'px;',
+        '  height: ' + String(SMALL_MULTIPLES_PLOT_PX) + 'px;',
+        '  min-width: 0;',
+        '  border-bottom: 1px solid ' + skinVar('line') + ';',
+        '}',
+        /* 一列：宽度由 `flex: 1 1 0` ＋ `min-width: 0` 摊（与横轴标签行同一份口径）⇒ 永远对得上。 */
+        s('col') + ' {',
+        '  position: relative;',
+        '  display: block;',
+        '  flex: 1 1 0;',
+        '  min-width: 0;',
+        '}',
+        /* 本期那一列的**竖标**（形）：贯穿柱阵的一条竖线，柱子画在它上面 ⇒ 柱顶以上那一段露出来。
+           取值走「**无文字的点／格／条**」那一档＝`accent` **实底**（对纸面 ≥3:1 的图形对比：
+           四套皮肤实测 accent vs surface ＝ paper 5.76／broadsheet 18.82／neutral 4.02／ink 5.15）。
+           为什么不用淡洗（返修点）：`accent` 掺 55% 纸面那一档四套只有 2.50／4.16／2.13／2.39——
+           三套低于 3:1 的图形地板，它既不是「实底」也不是 `accent-soft`（自算色对 `accent-soft` 也不等）。 */
+        s('col') + '.is-now::before {',
+        '  content: "";',
+        '  position: absolute;',
+        '  top: 0;',
+        '  bottom: 0;',
+        '  left: 50%;',
+        '  width: 2px;',
+        '  margin-left: -1px;',
+        '  background: ' + skinVar('accent') + ';',
+        '}',
+        /* 一根柱：**无文字的条 ⇒ `accent` 实底**；高度是行内那一个算出来的百分比。 */
+        s('bar') + ' {',
+        '  position: absolute;',
+        '  left: 0;',
+        '  right: 0;',
+        '  bottom: 0;',
+        '  display: block;',
+        '  min-height: 4px;',
+        '  border-radius: ' + skinVar('radius-sm') + ' ' + skinVar('radius-sm') + ' 0 0;',
+        '  background: ' + skinVar('accent') + ';',
+        '}',
+        /* 均值线：位置＝把均值当读数喂进**同一个映射**算出来的百分比。线型是虚线（不是靠颜色认线），
+           `z-index` 让线压在柱子上（读数等于均值的那一期，线正好穿过它的柱顶）。 */
+        s('mean') + ' {',
+        '  position: absolute;',
+        '  left: 0;',
+        '  right: 0;',
+        '  z-index: 2;',
+        '  border-top: 2px dashed ' + skinVar('ink-2') + ';',
+        '}',
+        /* 均值那一枚标注（**有字**）：贴着线长、底下垫纸面 ⇒ 压住柱子也读得清。
+           默认画在**线上**（线在柱阵下半区时，上方还有半个区高的空位）；
+           线在上半区时标记给 `.is-under`，画到**线下**——两档合起来 ⇒ 标注永远朝柱阵里长、四条边不出框。
+           `max-width: 100%` ＋ `overflow-wrap: anywhere`：再长的读数也换行，不截断、不撑出容器。 */
+        s('mean-label') + ' {',
+        '  position: absolute;',
+        '  right: 0;',
+        '  bottom: 4px;',
+        '  max-width: 100%;',
+        '  padding: 1px 6px;',
+        '  border: 1px solid ' + skinVar('line') + ';',
+        '  border-radius: ' + skinVar('radius-sm') + ';',
+        '  background: ' + skinVar('surface') + ';',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  font-weight: 700;',
+        '  font-variant-numeric: tabular-nums;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        /* 线在上半区（标记给 `is-under`）：标注改画在线**下**（`top` 从线的下沿起算，`bottom` 让位）。 */
+        s('mean') + '.is-under ' + c('mean-label') + ' {',
+        '  top: 4px;',
+        '  bottom: auto;',
+        '}',
+        /* 横轴标签行：**与柱阵同一份列划分**（同一个 gap ＋ 子项 `flex: 1 1 0`）。 */
+        s('xax') + ' {',
+        '  list-style: none;',
+        '  display: flex;',
+        '  gap: ' + String(COL_GAP_PX) + 'px;',
+        '  margin: 0;',
+        '  padding: 0;',
+        '  min-width: 0;',
+        '}',
+        s('xlabel') + ' {',
+        '  display: grid;',
+        '  gap: 1px;',
+        '  justify-items: center;',
+        '  flex: 1 1 0;',
+        '  min-width: 0;',
+        '  text-align: center;',
+        '}',
+        /* 轴上两行（原型 `.mx-xax` 那一档）：**绝对读数是最重的一行**（`ink`／700），
+           期间名是这一列的坐标、退一档（`ink-2`／600）——口径句写着「每一期的读数写在它那根柱子下面」，
+           读数就得是那一列最显眼的一行。两行**永不 `…` 截断**（长了换行），数字走等宽数字位。 */
+        s('xperiod') + ' {',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  font-weight: 600;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        s('xvalue') + ' {',
+        '  min-width: 0;',
+        '  color: ' + skinVar('ink') + ';',
+        '  font-family: ' + skinVar('font-num') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  font-style: normal;',
+        '  font-weight: 700;',
+        '  font-variant-numeric: tabular-nums;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        /* 本期那枚字：强调色的**文本档**（对纸面 ≥4.5:1）；它是状态的字，不是装饰。
+           不写 `nowrap`（全件不许 `…` 截断，也不许拿 `nowrap` 把字挤出容器）。 */
+        s('nowmark') + ' {',
+        '  min-width: 0;',
+        '  color: ' + skinVar('accent-text') + ';',
+        '  font-size: ' + skinVar('fs-xs') + ';',
+        '  font-style: normal;',
+        '  font-weight: 700;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        s('note') + ' {',
+        '  margin: 0;',
+        '  color: ' + skinVar('ink-2') + ';',
+        '  font-size: ' + skinVar('fs-sm') + ';',
+        '  line-height: 1.6;',
+        '  overflow-wrap: anywhere;',
+        '}',
+        '/* 本件自身不带可点元素（纯静态图）。这一条是**地板**：调用方把某一列包成入口时，焦点必须看得见。 */',
+        box + ' :focus-visible {',
+        '  outline: 2px solid ' + skinVar('accent') + ';',
+        '  outline-offset: 2px;',
+        '}',
+        /* 窄容器（<460px）：**一根柱都不减**（列就是数据本身），只把间距收紧、图区矮一档，
+           宽度还给柱子；期间名与读数换行，不压字、不藏横滑。 */
+        '@container (max-width: ' + String(NARROW_PX) + 'px) {',
+        '  ' + s('cols') + ' {',
+        '    gap: ' + String(NARROW_COL_GAP_PX) + 'px;',
+        '    height: ' + String(NARROW_PLOT_PX) + 'px;',
+        '  }',
+        '  ' + s('xax') + ' {',
+        '    gap: ' + String(NARROW_COL_GAP_PX) + 'px;',
+        '  }',
+        '}',
+    ].join(LF);
+}

package/dist/components/small-multiples/style.js.map

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

package/dist/components/sort-toggle/attrs.d.ts

@@ -0,0 +1,116 @@
+/** sortToggle · **标记契约**（渲染与运行时共用的唯一事实）。
+ *
+ *  形态：**C**（并进「视图」条：筛选＋排序一套 ＋ 口径句）——`#950` 打分台账里三形态 A/B/C ＝ 3/3/3、
+ *  2/3/3、4/4/4 ⇒ C 胜出。C 的骨架＝「一排视图按钮（每个带自己的条数）＋ 一句把当前视图的口径说清的话
+ *  ＋ 一颗反向键 ＋ 当前视图里几条」。
+ *
+ *  为什么把排序并进「视图」条：用户说得出的是「按常做排」这种**视图**，而不是
+ *  「字段字段＋方向」两个旋钮。字段与方向是视图的**内部**（`field`／`dir`），
+ *  页面上要写的是口径句——「「常做」＝用过几次从多到少，只看做过 ≥2 次的」。
+ */
+/** 本件的类名根。 */
+export declare const SORT_ROOT_CLASS = "ilife-block-sort-toggle";
+/** 形态闭集。 */
+export declare const SORT_FORMS: readonly ["C"];
+export type SortToggleForm = (typeof SORT_FORMS)[number];
+/** 方向闭集：`desc`（从多到少／从大到小）｜`asc`。 */
+export declare const SORT_DIRECTIONS: readonly ["desc", "asc"];
+export type SortDirection = (typeof SORT_DIRECTIONS)[number];
+/** 根：值＝机器键。运行时的发现锚。 */
+export declare const SORT_NAME_ATTR = "data-ilife-sort";
+export declare const SORT_FORM_ATTR = "data-ilife-sort-form";
+/** 条目区键（对应条目区的 `data-ilife-sort-region`）；不给＝整页找条目。 */
+export declare const SORT_TARGET_ATTR = "data-ilife-sort-target";
+export declare const SORT_BOUND_ATTR = "data-ilife-sort-bound";
+export declare const SORT_RUNTIME_ATTR = "data-ilife-sort-runtime";
+export declare const SORT_LOADING_ATTR = "data-ilife-sort-loading";
+export declare const SORT_DISABLED_ATTR = "data-ilife-sort-disabled";
+export declare const SORT_INVALID_ATTR = "data-ilife-sort-invalid";
+/** 一颗视图键：值＝该视图的 `value`；`aria-pressed` 表达当前视图。 */
+export declare const SORT_VIEW_ATTR = "data-ilife-sort-view";
+/** 视图键里的字面（运行时按它重写口径句里的视图名，不去切 `textContent`）。 */
+export declare const SORT_VIEW_LABEL_ATTR = "data-ilife-sort-view-label";
+/** 视图键里的条数位（运行时按真实条目数写它）。 */
+export declare const SORT_N_ATTR = "data-ilife-sort-n";
+/** 当前视图的排序字段（运行时按它排；渲染期就写上，判据读得到）。 */
+export declare const SORT_FIELD_ATTR = "data-ilife-sort-field";
+/** 当前方向（`desc`／`asc`；反向键改的就是它）。 */
+export declare const SORT_DIR_ATTR = "data-ilife-sort-dir";
+/** 这一档的口径句（写在**视图键**上：换档时运行时把它搬到口径行）。 */
+export declare const SORT_CALIBER_ATTR = "data-ilife-sort-caliber";
+/** 口径行（整句的容器）。 */
+export declare const SORT_CALIBER_LINE_ATTR = "data-ilife-sort-caliber-line";
+/** 口径行里的视图名那一处（加粗）。 */
+export declare const SORT_INK_ATTR = "data-ilife-sort-ink";
+/** 口径行里的口径那一处。 */
+export declare const SORT_CALIBER_TEXT_ATTR = "data-ilife-sort-caliber-text";
+/** 反向键。 */
+export declare const SORT_FLIP_ATTR = "data-ilife-sort-flip";
+/** 反向键的字面根（「反过来」；运行时换方向时按它重写键面：根 ＋（会变成什么））。 */
+export declare const SORT_FLIP_LABEL_ATTR = "data-ilife-sort-flip-label";
+/** 当前视图里几条（数位）。 */
+export declare const SORT_SHOWN_ATTR = "data-ilife-sort-shown";
+/** 状态行（`role="status"`；载入态原地换字）。 */
+export declare const SORT_STATUS_ATTR = "data-ilife-sort-status";
+export declare const SORT_EMPTY_ATTR = "data-ilife-sort-empty";
+export declare const SORT_ERROR_ATTR = "data-ilife-sort-error";
+export declare const SORT_REGION_ATTR = "data-ilife-sort-region";
+/** 一条条目：`data-ilife-sort-tags` 决定它属于哪些视图，`data-ilife-sort-<字段>` 是排序键。 */
+export declare const SORT_ITEM_ATTR = "data-ilife-sort-item";
+/** 条目所属的视图（空格分隔）。 */
+export declare const SORT_ITEM_TAGS_ATTR = "data-ilife-sort-tags";
+/** 视图或方向变化：`detail = { name, view, field, dir, flipped, shown }`。 */
+export declare const SORT_EVENT_CHANGE = "ilife:sort-change";
+/** 载入态开关（页面派发）：`detail = { name, on }`。 */
+export declare const SORT_EVENT_LOADING = "ilife:sort-loading";
+export declare const SORT_DEFAULTS: Readonly<{
+    readonly label: "视图";
+    /** 反向键的默认字：键面写的是「反过来会变成什么」。 */
+    readonly flipLabel: "反过来";
+    readonly toDesc: "从多到少";
+    readonly toAsc: "从少到多";
+    readonly loadingText: "正在排…";
+    readonly emptyText: "这个视图里没有记录";
+    /** 排序键在条目上一条都读不到时那句（错态）。 */
+    readonly noKeyText: "这个视图按「{field}」排，但条目上没有这个键（data-ilife-sort-{field}）";
+    /** 条目区没接上时那句（错态）。 */
+    readonly unwiredText: "这个排序没接上条目区：页面上找不到可排的条目";
+    /** 口径行的两块模板（`{label}`／`{caliber}` 由运行时替换；标点也住这里，运行时不许自造字面量）。 */
+    readonly inkText: "「{label}」";
+    readonly caliberText: "＝{caliber}";
+    readonly noCaliberText: "（这一档没写口径句）";
+    readonly unset: "—";
+}>;
+export interface SortViewInput {
+    /** 机器值（`aria-pressed` 的载荷与条目的 `data-ilife-sort-tags` 按它对号）。 */
+    readonly value: string;
+    /** 上屏字（如「常做」）。 */
+    readonly label: string;
+    /** 条数初值（渲染期给；运行时按真实条目重算并覆盖）。 */
+    readonly count?: number | string;
+    /** 这一档的口径句（换到这一档时上屏；如「用过几次从多到少，只看做过 ≥2 次的」）。 */
+    readonly caliber?: string;
+    /** 排序字段：条目上的 `data-ilife-sort-<field>`（不给＝这一档不重排，只筛）。 */
+    readonly field?: string;
+    /** 方向（缺省 `desc`）。 */
+    readonly dir?: SortDirection;
+}
+export interface SortToggleInput {
+    readonly form?: SortToggleForm;
+    readonly name: string;
+    readonly label?: string;
+    /** 视图（至少一档）。 */
+    readonly views: readonly SortViewInput[];
+    /** 初始选中（必须是 `views` 里的机器值；缺省第一档）。 */
+    readonly view?: string;
+    readonly target?: string;
+    /** 条数的单位（「46 道」「60 笔」）。 */
+    readonly unit?: string;
+    readonly flipLabel?: string;
+    readonly loadingText?: string;
+    readonly error?: string;
+    readonly loading?: boolean;
+    readonly disabled?: boolean;
+    readonly extraClass?: string;
+}
+//# sourceMappingURL=attrs.d.ts.map

package/dist/components/sort-toggle/attrs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"attrs.d.ts","sourceRoot":"","sources":["../../../src/components/sort-toggle/attrs.ts"],"names":[],"mappings":"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"}

package/dist/components/sort-toggle/attrs.js

@@ -0,0 +1,85 @@
+/** sortToggle · **标记契约**（渲染与运行时共用的唯一事实）。
+ *
+ *  形态：**C**（并进「视图」条：筛选＋排序一套 ＋ 口径句）——`#950` 打分台账里三形态 A/B/C ＝ 3/3/3、
+ *  2/3/3、4/4/4 ⇒ C 胜出。C 的骨架＝「一排视图按钮（每个带自己的条数）＋ 一句把当前视图的口径说清的话
+ *  ＋ 一颗反向键 ＋ 当前视图里几条」。
+ *
+ *  为什么把排序并进「视图」条：用户说得出的是「按常做排」这种**视图**，而不是
+ *  「字段字段＋方向」两个旋钮。字段与方向是视图的**内部**（`field`／`dir`），
+ *  页面上要写的是口径句——「「常做」＝用过几次从多到少，只看做过 ≥2 次的」。
+ */
+/** 本件的类名根。 */
+export const SORT_ROOT_CLASS = 'ilife-block-sort-toggle';
+/** 形态闭集。 */
+export const SORT_FORMS = ['C'];
+/** 方向闭集：`desc`（从多到少／从大到小）｜`asc`。 */
+export const SORT_DIRECTIONS = ['desc', 'asc'];
+/* ── 根 ────────────────────────────────────────────────────────────── */
+/** 根：值＝机器键。运行时的发现锚。 */
+export const SORT_NAME_ATTR = 'data-ilife-sort';
+export const SORT_FORM_ATTR = 'data-ilife-sort-form';
+/** 条目区键（对应条目区的 `data-ilife-sort-region`）；不给＝整页找条目。 */
+export const SORT_TARGET_ATTR = 'data-ilife-sort-target';
+export const SORT_BOUND_ATTR = 'data-ilife-sort-bound';
+export const SORT_RUNTIME_ATTR = 'data-ilife-sort-runtime';
+export const SORT_LOADING_ATTR = 'data-ilife-sort-loading';
+export const SORT_DISABLED_ATTR = 'data-ilife-sort-disabled';
+export const SORT_INVALID_ATTR = 'data-ilife-sort-invalid';
+/* ── 视图条 ────────────────────────────────────────────────────────── */
+/** 一颗视图键：值＝该视图的 `value`；`aria-pressed` 表达当前视图。 */
+export const SORT_VIEW_ATTR = 'data-ilife-sort-view';
+/** 视图键里的字面（运行时按它重写口径句里的视图名，不去切 `textContent`）。 */
+export const SORT_VIEW_LABEL_ATTR = 'data-ilife-sort-view-label';
+/** 视图键里的条数位（运行时按真实条目数写它）。 */
+export const SORT_N_ATTR = 'data-ilife-sort-n';
+/** 当前视图的排序字段（运行时按它排；渲染期就写上，判据读得到）。 */
+export const SORT_FIELD_ATTR = 'data-ilife-sort-field';
+/** 当前方向（`desc`／`asc`；反向键改的就是它）。 */
+export const SORT_DIR_ATTR = 'data-ilife-sort-dir';
+/** 这一档的口径句（写在**视图键**上：换档时运行时把它搬到口径行）。 */
+export const SORT_CALIBER_ATTR = 'data-ilife-sort-caliber';
+/** 口径行（整句的容器）。 */
+export const SORT_CALIBER_LINE_ATTR = 'data-ilife-sort-caliber-line';
+/** 口径行里的视图名那一处（加粗）。 */
+export const SORT_INK_ATTR = 'data-ilife-sort-ink';
+/** 口径行里的口径那一处。 */
+export const SORT_CALIBER_TEXT_ATTR = 'data-ilife-sort-caliber-text';
+/** 反向键。 */
+export const SORT_FLIP_ATTR = 'data-ilife-sort-flip';
+/** 反向键的字面根（「反过来」；运行时换方向时按它重写键面：根 ＋（会变成什么））。 */
+export const SORT_FLIP_LABEL_ATTR = 'data-ilife-sort-flip-label';
+/** 当前视图里几条（数位）。 */
+export const SORT_SHOWN_ATTR = 'data-ilife-sort-shown';
+/** 状态行（`role="status"`；载入态原地换字）。 */
+export const SORT_STATUS_ATTR = 'data-ilife-sort-status';
+export const SORT_EMPTY_ATTR = 'data-ilife-sort-empty';
+export const SORT_ERROR_ATTR = 'data-ilife-sort-error';
+/* ── 条目区（计数与排序的**唯一**事实来源）────────────────────────── */
+export const SORT_REGION_ATTR = 'data-ilife-sort-region';
+/** 一条条目：`data-ilife-sort-tags` 决定它属于哪些视图，`data-ilife-sort-<字段>` 是排序键。 */
+export const SORT_ITEM_ATTR = 'data-ilife-sort-item';
+/** 条目所属的视图（空格分隔）。 */
+export const SORT_ITEM_TAGS_ATTR = 'data-ilife-sort-tags';
+/* ── 事件 ──────────────────────────────────────────────────────────── */
+/** 视图或方向变化：`detail = { name, view, field, dir, flipped, shown }`。 */
+export const SORT_EVENT_CHANGE = 'ilife:sort-change';
+/** 载入态开关（页面派发）：`detail = { name, on }`。 */
+export const SORT_EVENT_LOADING = 'ilife:sort-loading';
+export const SORT_DEFAULTS = Object.freeze({
+    label: '视图',
+    /** 反向键的默认字：键面写的是「反过来会变成什么」。 */
+    flipLabel: '反过来',
+    toDesc: '从多到少',
+    toAsc: '从少到多',
+    loadingText: '正在排…',
+    emptyText: '这个视图里没有记录',
+    /** 排序键在条目上一条都读不到时那句（错态）。 */
+    noKeyText: '这个视图按「{field}」排，但条目上没有这个键（data-ilife-sort-{field}）',
+    /** 条目区没接上时那句（错态）。 */
+    unwiredText: '这个排序没接上条目区：页面上找不到可排的条目',
+    /** 口径行的两块模板（`{label}`／`{caliber}` 由运行时替换；标点也住这里，运行时不许自造字面量）。 */
+    inkText: '「{label}」',
+    caliberText: '＝{caliber}',
+    noCaliberText: '（这一档没写口径句）',
+    unset: '—',
+});

package/dist/components/sort-toggle/attrs.js.map

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

package/dist/components/sort-toggle/index.d.ts

@@ -0,0 +1,38 @@
+/** sortToggle · **组件出口**（该组件对外的唯一名字面）。
+ *
+ *  —— 排序切换（形态 C：并进「视图」条）——
+ *
+ *  一句话：**把「排序」写成几个用户认得的视图**（全部／常做／高分／最近），
+ *  每个视图带自己的条数，底下一句口径句说清这一档在按什么排——字段与方向是视图的内部。
+ *
+ *  什么时候用它（对照既有件想清楚再选）：
+ *   · 用户说的是「按常做排」「从大到小」这种**视图**，不是「字段＋方向」两个旋钮 → 用它；
+ *   · 要「按属性取子集」（多选）→ 用 `filter-chips`（本件是单选档）；
+ *   · 要「按词找条目」→ 用 `search-field`；
+ *   · 只是「一行读数」→ 用 `stat-inline` 一类排版件。
+ *
+ *  与条目区的接线（三段，全走 `data-*`）：
+ *   1. 条目区挂 `data-ilife-sort-region="<键>"`；本件给 `target: '<键>'`（不给＝整页找条目）；
+ *   2. 每条条目挂 `data-ilife-sort-item`，`data-ilife-sort-tags="all 常做"`（属于哪些视图；
+ *      **没有这个属性**的条目视为属于每一档），排序键落 `data-ilife-sort-<字段>`（如 `data-ilife-sort-used="6"`）；
+ *   3. 运行时按真实条目算每档条数，并按当前视图的字段**真的重排**这些条目。
+ *
+ *  三件出口：
+ *   · `renderSortToggle(input)` —— 产标记（纯函数，零 DOM）；
+ *   · `sortToggleCss()` —— 该组件的样式段（住 `.<prefix>page-ui` 之下）；
+ *   · `buildSortToggleJs()` —— 运行时（产出 JS 文本；DOM 只出现在文本里）。
+ *
+ *  页面怎么接自己的重算：
+ *  ```js
+ *  document.addEventListener('ilife:sort-change', (e) => {
+ *    const { name, view, field, dir, shown } = e.detail;   // 顺序已就地重排完毕
+ *  });
+ *  ```
+ *  完整用法与参数表见同目录 `README.md`。
+ */
+export { SORT_BOUND_ATTR, SORT_CALIBER_ATTR, SORT_CALIBER_LINE_ATTR, SORT_CALIBER_TEXT_ATTR, SORT_DEFAULTS, SORT_DIRECTIONS, SORT_DIR_ATTR, SORT_DISABLED_ATTR, SORT_EMPTY_ATTR, SORT_ERROR_ATTR, SORT_EVENT_CHANGE, SORT_EVENT_LOADING, SORT_FIELD_ATTR, SORT_FLIP_ATTR, SORT_FLIP_LABEL_ATTR, SORT_FORM_ATTR, SORT_FORMS, SORT_INK_ATTR, SORT_INVALID_ATTR, SORT_ITEM_ATTR, SORT_ITEM_TAGS_ATTR, SORT_LOADING_ATTR, SORT_NAME_ATTR, SORT_N_ATTR, SORT_REGION_ATTR, SORT_ROOT_CLASS, SORT_RUNTIME_ATTR, SORT_SHOWN_ATTR, SORT_STATUS_ATTR, SORT_TARGET_ATTR, SORT_VIEW_ATTR, SORT_VIEW_LABEL_ATTR, } from './attrs.js';
+export type { SortDirection, SortToggleForm, SortToggleInput, SortViewInput } from './attrs.js';
+export { sortErrorId, renderSortToggle } from './render.js';
+export { sortToggleCss, SORT_MAX_WIDTH_PX, SORT_STATUS_MIN_CH, SORT_TOUCH_MIN_PX } from './style.js';
+export { buildSortToggleJs } from './runtime.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/sort-toggle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/sort-toggle/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,OAAO,EACL,eAAe,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,sBAAsB,EAClF,aAAa,EAAE,eAAe,EAAE,aAAa,EAAE,kBAAkB,EAAE,eAAe,EAClF,eAAe,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,eAAe,EAAE,cAAc,EACvF,oBAAoB,EAAE,cAAc,EAAE,UAAU,EAAE,aAAa,EAAE,iBAAiB,EAClF,cAAc,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,cAAc,EAAE,WAAW,EACnF,gBAAgB,EAAE,eAAe,EAAE,iBAAiB,EAAE,eAAe,EAAE,gBAAgB,EACvF,gBAAgB,EAAE,cAAc,EAAE,oBAAoB,GACvD,MAAM,YAAY,CAAC;AACpB,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAChG,OAAO,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AACrG,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC"}

package/dist/components/sort-toggle/index.js

@@ -0,0 +1,36 @@
+/** sortToggle · **组件出口**（该组件对外的唯一名字面）。
+ *
+ *  —— 排序切换（形态 C：并进「视图」条）——
+ *
+ *  一句话：**把「排序」写成几个用户认得的视图**（全部／常做／高分／最近），
+ *  每个视图带自己的条数，底下一句口径句说清这一档在按什么排——字段与方向是视图的内部。
+ *
+ *  什么时候用它（对照既有件想清楚再选）：
+ *   · 用户说的是「按常做排」「从大到小」这种**视图**，不是「字段＋方向」两个旋钮 → 用它；
+ *   · 要「按属性取子集」（多选）→ 用 `filter-chips`（本件是单选档）；
+ *   · 要「按词找条目」→ 用 `search-field`；
+ *   · 只是「一行读数」→ 用 `stat-inline` 一类排版件。
+ *
+ *  与条目区的接线（三段，全走 `data-*`）：
+ *   1. 条目区挂 `data-ilife-sort-region="<键>"`；本件给 `target: '<键>'`（不给＝整页找条目）；
+ *   2. 每条条目挂 `data-ilife-sort-item`，`data-ilife-sort-tags="all 常做"`（属于哪些视图；
+ *      **没有这个属性**的条目视为属于每一档），排序键落 `data-ilife-sort-<字段>`（如 `data-ilife-sort-used="6"`）；
+ *   3. 运行时按真实条目算每档条数，并按当前视图的字段**真的重排**这些条目。
+ *
+ *  三件出口：
+ *   · `renderSortToggle(input)` —— 产标记（纯函数，零 DOM）；
+ *   · `sortToggleCss()` —— 该组件的样式段（住 `.<prefix>page-ui` 之下）；
+ *   · `buildSortToggleJs()` —— 运行时（产出 JS 文本；DOM 只出现在文本里）。
+ *
+ *  页面怎么接自己的重算：
+ *  ```js
+ *  document.addEventListener('ilife:sort-change', (e) => {
+ *    const { name, view, field, dir, shown } = e.detail;   // 顺序已就地重排完毕
+ *  });
+ *  ```
+ *  完整用法与参数表见同目录 `README.md`。
+ */
+export { SORT_BOUND_ATTR, SORT_CALIBER_ATTR, SORT_CALIBER_LINE_ATTR, SORT_CALIBER_TEXT_ATTR, SORT_DEFAULTS, SORT_DIRECTIONS, SORT_DIR_ATTR, SORT_DISABLED_ATTR, SORT_EMPTY_ATTR, SORT_ERROR_ATTR, SORT_EVENT_CHANGE, SORT_EVENT_LOADING, SORT_FIELD_ATTR, SORT_FLIP_ATTR, SORT_FLIP_LABEL_ATTR, SORT_FORM_ATTR, SORT_FORMS, SORT_INK_ATTR, SORT_INVALID_ATTR, SORT_ITEM_ATTR, SORT_ITEM_TAGS_ATTR, SORT_LOADING_ATTR, SORT_NAME_ATTR, SORT_N_ATTR, SORT_REGION_ATTR, SORT_ROOT_CLASS, SORT_RUNTIME_ATTR, SORT_SHOWN_ATTR, SORT_STATUS_ATTR, SORT_TARGET_ATTR, SORT_VIEW_ATTR, SORT_VIEW_LABEL_ATTR, } from './attrs.js';
+export { sortErrorId, renderSortToggle } from './render.js';
+export { sortToggleCss, SORT_MAX_WIDTH_PX, SORT_STATUS_MIN_CH, SORT_TOUCH_MIN_PX } from './style.js';
+export { buildSortToggleJs } from './runtime.js';

package/dist/components/sort-toggle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/sort-toggle/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,OAAO,EACL,eAAe,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,sBAAsB,EAClF,aAAa,EAAE,eAAe,EAAE,aAAa,EAAE,kBAAkB,EAAE,eAAe,EAClF,eAAe,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,eAAe,EAAE,cAAc,EACvF,oBAAoB,EAAE,cAAc,EAAE,UAAU,EAAE,aAAa,EAAE,iBAAiB,EAClF,cAAc,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,cAAc,EAAE,WAAW,EACnF,gBAAgB,EAAE,eAAe,EAAE,iBAAiB,EAAE,eAAe,EAAE,gBAAgB,EACvF,gBAAgB,EAAE,cAAc,EAAE,oBAAoB,GACvD,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AACrG,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC"}

package/dist/components/sort-toggle/model.d.ts

@@ -0,0 +1,27 @@
+import type { SortDirection, SortToggleForm } from './attrs.js';
+export interface SortView {
+    readonly value: string;
+    readonly label: string;
+    readonly count?: string;
+    readonly caliber: string;
+    readonly field: string | undefined;
+    readonly dir: SortDirection;
+}
+export interface SortToggleModel {
+    readonly form: SortToggleForm;
+    readonly name: string;
+    readonly label: string;
+    readonly views: readonly SortView[];
+    readonly view: string;
+    readonly target: string | undefined;
+    readonly unit: string;
+    readonly flipLabel: string;
+    readonly loadingText: string;
+    readonly error: string | undefined;
+    readonly loading: boolean;
+    readonly disabled: boolean;
+    readonly extraClass: string | undefined;
+}
+/** 归一 ＋ 校验。 */
+export declare function normalizeSortToggle(raw: unknown): SortToggleModel;
+//# sourceMappingURL=model.d.ts.map

package/dist/components/sort-toggle/model.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"model.d.ts","sourceRoot":"","sources":["../../../src/components/sort-toggle/model.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAiB,MAAM,YAAY,CAAC;AAE/E,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IACnC,QAAQ,CAAC,GAAG,EAAE,aAAa,CAAC;CAC7B;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,IAAI,EAAE,cAAc,CAAC;IAC9B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,SAAS,QAAQ,EAAE,CAAC;IACpC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAC;IAC7B,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IACnC,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;CACzC;AAoCD,eAAe;AACf,wBAAgB,mBAAmB,CAAC,GAAG,EAAE,OAAO,GAAG,eAAe,CA0CjE"}