egatari 0.0.0-stage → 0.6.4

package/vendor/components/sha256/26d5493ac7b78c9fbf01fe19359b027240c61b61a7c8c495d1ca57f18ba1c468/CHANGELOG.md

@@ -0,0 +1,31 @@
+# m-keyboard changelog
+
+The part's own versions (Egatari spec §6.1). Releases of the whole library are in the repository's CHANGELOG.md.
+
+## 2.0.1 (components 2.1.0)
+
+- Keys outside `range`: the error lists every such key and names a range that covers all keys in `steps`, with white
+  keys at both ends and 12–36 semitones (e.g. `use C4-D5`). When the keys span more than 3 octaves, it says to split
+  them over two keyboards. Behaviour is otherwise unchanged.
+
+## 2.0.0 (components 2.0.0-rc.1 and 2.0.0)
+
+- Moved to `egatariParts.define({name: "keyboard", version: "2.0.0", requires: {base: "1.0.0"}, element: "m-keyboard"})`,
+  extending `base.MotionElement` with `base.el` / `prog` / `variant` / `previewOpacity`; `static partName = "keyboard"`.
+  The DOM is byte-identical to 1.13.0 on its demo and on `tools/fixtures/c2-identity/keyboard.html` (an English lesson:
+  default `abc` names; `iroha`, `rise`, `cumulative`) at every step (tools/test-c2-identity.mjs).
+- Steps never depend on the context (spec §8.4): the default key names (`solfa` for a Japanese lesson, else `abc`) are
+  chosen in `mount` from `/^ja\b/i.test(ctx.lang)` (1.13.0: in `plan()`, from `DECK.ja`). `plan()` no longer carries
+  `names`; the step count, durations and sound events never depended on them.
+- Variants: `base.variant(this)` instead of the embedded `egatari-variant` block.
+- Reports: a step `tone` that is not a theme colour is `ctx.report("data", "[keyboard] …")`; an element too small for the
+  keys, white keys too narrow for their names, overlapping black-key names and a step label wider than the element are
+  `ctx.report("size", "[keyboard] …")` (1.13.0: `console.warn("m-keyboard: …")`). Range and key errors still throw
+  (base contains them and reports `[keyboard] steps: …` / `mount: …`).
+- The preview view is `ctx.preview` alone (1.13.0 also accepted `ctx.mode === "lecture"`).
+- `static kb` (the keyboard geometry and names, read by tools/test-keyboard.mjs through `partClass`) is unchanged.
+- Ids: none written.
+
+## 1.13.0
+
+As released in the library's 1.13.0.

package/vendor/components/sha256/26d5493ac7b78c9fbf01fe19359b027240c61b61a7c8c495d1ca57f18ba1c468/README.md

@@ -0,0 +1,32 @@
+---
+name: m-keyboard
+version: 2.0.1
+series: music
+tier: specialized
+set: music
+summary: ピアノの鍵盤。音階・和音・半音と全音を光らせて音も鳴らす
+steps: steps の 1 つ = 1 段階（鍵盤は t でずらして順に光る）
+purposes: music
+variants: light, press, rise
+props: （なし。子の JSON）
+---
+
+子の JSON：`{"range": "C4-C6", "steps": [{"keys": ["C4", "E4", "G4"], "label": "主和音"}]}`
+
+- `range`：両端は白鍵、1〜3 オクターブ
+- `names`：`solfa`（ドレミ）・`abc`・`iroha`（ハニホ、嬰ハ・変ニ）・`none`
+- `t`：鍵盤ごとの秒。ずらすと音階、同じなら和音
+- `cumulative: true`：前の段階の鍵盤も薄く残す
+- `tone`：光の色。`dur`：音の秒（既定は次の音まで、最後は 0.8）
+
+<!-- llm: omit -->
+作る人向けの注
+
+- **鍵盤の形**：白鍵の幅を 1 として、ド〜ミの 3 つを 5 等分、ファ〜シの 4 つを 7 等分した 2・4（・6）番目に黒鍵の真ん中を置く（本物の鍵盤と同じ：ド♯・レ♯は外へ、ファ♯・ラ♯も外へ寄り、ソ♯は真ん中）。黒鍵の幅は 0.58、長さは白鍵の 0.62。`customElements.get("m-keyboard").kb` にあり、tools/test-keyboard.mjs が試す
+- **鍵盤の名前**：`C4` `C#4` `Db4`（♯ ♭ も）。E♯・B♯・F♭・C♭ は使えない。範囲の外の鍵盤・読めない名前・`t` の数が鍵盤の数と違うとき・範囲が 1〜3 オクターブでないときは札が出る
+- **光る鍵盤**：今の段階は塗った丸の印、前の段階（`cumulative`）は薄い色と輪の印（色だけに頼らない）。光る黒鍵は内側を光の色にして縁を残す。黒鍵の名前は光っているときだけ鍵盤の上に（重なれば 2 行目）
+- **音**（仕様 §8.4「Component sounds」）：`events(k)` は鍵盤 1 つに 1 つの `note`（`pitch` は鍵盤の名前、`vel` 0.7）。`duration(k)` は最後の音の終わりまで。音は情報の唯一の担い手にしない：光った鍵盤がいつも同じことを示す
+- 授業の表示（`ctx.preview`）では、先の段階の鍵盤をテーマの `--preview-opacity`（なければ 0.45）で薄く、印なしで見せる（操作できるものはない）
+- 見せ方：`light`（0、光がフェード）・`press`（鍵盤が 4 px 沈んで戻る）・`rise`（光が下から満ちる）。どれも 0.3 秒以内で、音の長さを超えない
+- 字はすべて 24 px 以上（段階の名前 30 px、白鍵の名前 26 px、黒鍵の名前 24 px）。要素の高さが足りない・白鍵が 40 px より細いときは `console.warn`
+<!-- llm: end -->

package/vendor/components/sha256/26d5493ac7b78c9fbf01fe19359b027240c61b61a7c8c495d1ca57f18ba1c468/demo.html

@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html lang="ja" data-theme="default">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>m-keyboard の見本</title>
+<!-- 組み方：node kit/build.mjs components/keyboard/demo.html -o components/keyboard/out/demo.html -->
+<style>
+</style>
+</head>
+<body>
+<div id="stage">
+
+<section class="slide">
+  <h2>ハ長調の音階（ドレミファソラシド）</h2>
+  <div class="body">
+    <m-keyboard aria-label="ドから上のドまで、白い鍵盤を 1 つずつ順にひく" style="height:400px">
+      <script type="application/json">{"range": "C4-C5", "names": "solfa", "steps": [
+        {"keys": ["C4", "D4", "E4", "F4", "G4", "A4", "B4", "C5"], "t": [0, 0.6, 1.2, 1.8, 2.4, 3.0, 3.6, 4.2], "label": "ドから上のドまで、1 つずつ"}]}</script>
+    </m-keyboard>
+  </div>
+  <div class="concl"><span>→ 白い鍵盤だけを順にひくと、ハ長調の音階になる</span></div>
+</section>
+
+<section class="slide">
+  <h2>主要三和音（Ⅰ・Ⅳ・Ⅴ）</h2>
+  <div class="body">
+    <m-keyboard variant="press" aria-label="ハ長調の主要三和音：ドミソ、ファラド、ソシレ" style="height:400px">
+      <script type="application/json">{"range": "C4-C6", "steps": [
+        {"keys": ["C4", "E4", "G4"], "label": "Ⅰ　主和音（ドミソ）"},
+        {"keys": ["F4", "A4", "C5"], "label": "Ⅳ　下属和音（ファラド）", "tone": "accent2"},
+        {"keys": ["G4", "B4", "D5"], "label": "Ⅴ　属和音（ソシレ）", "tone": "term"}]}</script>
+    </m-keyboard>
+  </div>
+  <div class="concl"><span>→ どの和音も、鍵盤を 1 つおきに 3 つ重ねる</span></div>
+</section>
+
+<section class="slide">
+  <h2>オクターブと半音・全音</h2>
+  <div class="body">
+    <m-keyboard variant="rise" aria-label="ドと上のドがオクターブ。ミとファ、ドとド♯は半音、ドとレは全音" style="height:400px">
+      <script type="application/json">{"range": "C4-C5", "steps": [
+        {"keys": ["C4", "C5"], "t": [0, 0.8], "label": "オクターブ：ドから上のドまで"},
+        {"keys": ["E4", "F4"], "t": [0, 0.8], "label": "半音：となりの鍵盤（ミとファ）"},
+        {"keys": ["C4", "C#4"], "t": [0, 0.8], "label": "半音：となりの鍵盤（ドとド♯）"},
+        {"keys": ["C4", "D4"], "t": [0, 0.8], "label": "全音：半音 2 つ分（ドとレ）"}]}</script>
+    </m-keyboard>
+  </div>
+  <div class="concl"><span>→ 1 オクターブは半音 12 個。全音は半音 2 つ分</span></div>
+</section>
+
+</div>
+</body>
+</html>

package/vendor/components/sha256/26d5493ac7b78c9fbf01fe19359b027240c61b61a7c8c495d1ca57f18ba1c468/index.js

@@ -0,0 +1,268 @@
+// m-keyboard：音楽の授業のピアノの鍵盤。段階ごとに鍵盤を光らせ（音階・和音・半音と全音）、その音を再生器に鳴らしてもらう
+// <m-keyboard style="height:380px"><script type="application/json">
+//   {"range": "C4-C6", "names": "solfa", "steps": [{"keys": ["C4", "E4", "G4"], "label": "主和音"}]}
+// （JSON の終わり）</m-keyboard>
+// 段階 0 は鍵盤だけ。段階 k は steps[k-1] の keys を --emph（または step の tone）で光らせる。keys ごとの t（秒）でずらせば音階・分散和音、
+// 同じ t なら和音。cumulative: true なら前の段階の鍵盤も薄く光ったまま
+// 音（仕様 §8.4「Component sounds」）：events(k) は鍵盤 1 つに 1 つの note（pitch は鍵盤の名前、vel 0.7、dur は dur の欄か、
+// 次の t まで（なければ 0.8 秒））。duration(k) は最後の音の終わりまで。音だけに頼らない：光った鍵盤と印がいつも同じことを示す
+// 鍵盤の形（customElements.get("m-keyboard").kb、tools/test-keyboard.mjs）：白鍵の幅を 1 として、ド〜ミの 3 つを 5 等分、ファ〜シの 4 つを
+// 7 等分した 2・4（・6）番目に黒鍵を置く（本物の鍵盤と同じく、ド♯とレ♯は外へ、ファ♯とラ♯も外へ寄り、ソ♯は真ん中）
+// 授業の表示（ctx.preview）：先の段階の鍵盤をテーマの --preview-opacity（なければ 0.45）で薄く、印なしで見せる
+// 見せ方（docs/conventions.md §1）：light（既定。光がフェード）・press（鍵盤が少し沈んで戻る）・rise（光が鍵盤の下から上へ満ちる）
+// 2.0（Egatari spec §6.1 の部品）：base の MotionElement・el・prog・variant・previewOpacity を使い、プレイヤーのグローバルは使わない。
+// 段階の数は ctx にも言語にもよらない（spec §8.4）：既定の鍵盤の名前（日本語ならドレミ、ほかは CDE）は plan() ではなく mount で選ぶ。
+// レッスンのデータや要素の大きさの問題は ctx.report で知らせる（1.x の console.warn("m-keyboard: …") の代わり）
+egatariParts.define({name: "keyboard", version: "2.0.1", requires: {base: "1.0.0"}, element: "m-keyboard"}, function(deps){
+"use strict";
+var base = deps.base;
+// ---- 鍵盤の名前と形（DOM を使わない。tools/test-keyboard.mjs が試す） ----
+var KB = (function(){
+  var LETTERS = "CDEFGAB", PC = {C: 0, D: 2, E: 4, F: 5, G: 7, A: 9, B: 11};
+  var SOLFA = {C: "ド", D: "レ", E: "ミ", F: "ファ", G: "ソ", A: "ラ", B: "シ"};
+  var IROHA = {C: "ハ", D: "ニ", E: "ホ", F: "ヘ", G: "ト", A: "イ", B: "ロ"};
+  var BW = 0.58, BH = 0.62;   // 黒鍵の幅（白鍵の幅に対して）と長さ（白鍵の長さに対して）
+  // "C4" "C#4" "Db4"（♯ ♭ も）→ {letter, acc: "" | "#" | "b", oct, midi, white, name}。読めなければ null
+  function parseKey(s){
+    var m = /^([A-G])([#b♯♭]?)(-?\d)$/.exec(String(s).trim());
+    if (!m) return null;
+    var acc = m[2] === "♯" ? "#" : m[2] === "♭" ? "b" : m[2], oct = +m[3];
+    // E♯・B♯・F♭・C♭ は白鍵の別の名前：鍵盤の名前としては使わない
+    if ((acc === "#" && (m[1] === "E" || m[1] === "B")) || (acc === "b" && (m[1] === "F" || m[1] === "C"))) return null;
+    var midi = 12 * (oct + 1) + PC[m[1]] + (acc === "#" ? 1 : acc === "b" ? -1 : 0);
+    return {letter: m[1], acc: acc, oct: oct, midi: midi, white: !acc, name: m[1] + acc + oct};
+  }
+  // "C4-C6" → {lo, hi}（鍵盤 2 つ）。両端は白鍵、1〜3 オクターブ（半音 12〜36 個）。違えば Error（何が・どう書くか）
+  function parseRange(s){
+    var m = /^\s*([A-G][#b♯♭]?-?\d)\s*[-–〜~]\s*([A-G][#b♯♭]?-?\d)\s*$/.exec(String(s || ""));
+    if (!m) throw new Error('m-keyboard: range "' + s + '" is not two key names such as "C4-C6"');
+    var lo = parseKey(m[1]), hi = parseKey(m[2]);
+    if (!lo || !hi) throw new Error('m-keyboard: range "' + s + '": ' + (!lo ? m[1] : m[2]) + " is not a key name (C4, F#3, Bb4, …)");
+    if (!lo.white || !hi.white) throw new Error('m-keyboard: range "' + s + '" must start and end on white keys (C D E F G A B)');
+    var span = hi.midi - lo.midi;
+    if (span < 12 || span > 36) throw new Error('m-keyboard: range "' + s + '" covers ' + span + " semitones; it must cover 1–3 octaves (12–36, such as C4-C5 or C3-C6)");
+    return {lo: lo, hi: hi};
+  }
+  // 鍵 lo〜hi（midi）を覆う範囲の書き方："C4-D5"（両端は白鍵、半音 12〜36 個。12 に足りなければ上に広げる）。36 を超えれば null
+  function cover(lo, hi){
+    var name = function(mi){ return "C D EF G A B".charAt(((mi % 12) + 12) % 12) + (Math.floor(mi / 12) - 1); };
+    var white = function(mi){ return [0, 2, 4, 5, 7, 9, 11].indexOf(((mi % 12) + 12) % 12) >= 0; };
+    if (!white(lo)) lo--;
+    if (!white(hi)) hi++;
+    if (hi - lo < 12){ hi = lo + 12; if (!white(hi)) hi++; }
+    return hi - lo > 36 ? null : name(lo) + "-" + name(hi);
+  }
+  // 範囲の鍵盤：白鍵 {midi, white: true, i, x（左の端）, w: 1}、黒鍵 {midi, white: false, x（左の端）, cx（真ん中）, w: BW}。単位は白鍵の幅
+  function keys(r){
+    var out = [], whites = [], wi = -1;
+    for (var mi = r.lo.midi; mi <= r.hi.midi; mi++){
+      var pc = ((mi % 12) + 12) % 12, white = [0, 2, 4, 5, 7, 9, 11].indexOf(pc) >= 0;
+      if (white){ wi++; var k = {midi: mi, pc: pc, white: true, i: wi, x: wi, w: 1}; whites.push(k); out.push(k); continue; }
+      // 黒鍵：下の白鍵（i = wi）の組（ド〜ミ か ファ〜シ）の始まりから数える
+      var g = pc < 5 ? {start: wi - (pc - 1) / 2, n: 3, slot: (pc === 1 ? 1 : 3)} : {start: wi - (pc - 6) / 2, n: 4, slot: (pc === 6 ? 1 : pc === 8 ? 3 : 5)};
+      var cx = g.start + (g.slot + 0.5) * g.n / (2 * g.n - 1);
+      out.push({midi: mi, pc: pc, white: false, below: wi, cx: cx, x: cx - BW / 2, w: BW});
+    }
+    return {all: out, whites: whites, n: whites.length, BW: BW, BH: BH};
+  }
+  // 鍵盤の名前：names = "solfa"（ドレミ）・"abc"（CDE）・"iroha"（ハニホ）・"none"（null）。黒鍵は ♯・♭ をつける（ド♯ / C♯、レ♭ / D♭）。
+  // iroha は前に 嬰・変 をつける（嬰ハ、変ニ）
+  function label(k, names){
+    if (names === "none") return null;
+    if (names === "iroha") return (k.acc === "#" ? "嬰" : k.acc === "b" ? "変" : "") + IROHA[k.letter];
+    var s = names === "abc" ? k.letter : SOLFA[k.letter];
+    return s + (k.acc === "#" ? "♯" : k.acc === "b" ? "♭" : "");
+  }
+  // 白鍵の名前（範囲の中の midi から。白鍵は ♯ も ♭ もない）
+  function whiteLetter(midi){ return "C D EF G A B".charAt(((midi % 12) + 12) % 12); }
+  // 段階 1 つの音：鍵盤 1 つに 1 つ。t は keys ごと（なければ 0）。dur は step.dur → 全体の dur → 次の（より遅い）t まで → 0.8 秒
+  function notes(step, dur){
+    var ts = (step.keys || []).map(function(_, i){ return step.t && typeof step.t[i] === "number" ? step.t[i] : 0; });
+    var d0 = typeof step.dur === "number" ? step.dur : typeof dur === "number" ? dur : null;
+    return step.keys.map(function(key, i){
+      var k = parseKey(key), t = ts[i], later = ts.filter(function(u){ return u > t + 1e-9; }), next = later.length ? Math.min.apply(null, later) : null;
+      return {t: t, sound: "note", pitch: k ? k.name : String(key), dur: d0 !== null ? d0 : next !== null ? +(next - t).toFixed(6) : 0.8, vel: 0.7};
+    });
+  }
+  // 段階の長さ：最後の音の終わり
+  function length(step, dur){ return notes(step, dur).reduce(function(a, n){ return Math.max(a, n.t + n.dur); }, 0); }
+  // 段階 k・時刻 t の鍵盤ごとの状態（render が描く。DOM を使わない）。steps は plan の段階（keys は parseKey の結果、ev は notes）。
+  // o = {cumulative, preview, variant, prog(t, at, len)}。{midi: {e: 今の段階の光の進み 0〜1, p: 動きの進み, tone, ids: {綴り: e},
+  //   faded: 前の段階で光った（cumulative）, fadeTone, fids, pre: 先の段階で光る（授業の表示で薄く。印なし）, preTone}}
+  function state(steps, k, t, o){
+    var st = {}, cur = steps[k - 1];
+    var get = function(m){ return st[m] || (st[m] = {e: 0, p: 0, faded: false, pre: false, tone: null, fadeTone: null, preTone: null, ids: {}, fids: {}}); };
+    if (o.cumulative) for (var j = 0; j < k - 1 && j < steps.length; j++){
+      var sj = steps[j];
+      sj.keys.forEach(function(kk){ var s = get(kk.midi); s.faded = true; s.fadeTone = sj.tone; s.fids[kk.midi + "|" + kk.acc] = true; });
+    }
+    if (cur) cur.keys.forEach(function(kk, i){
+      var n = cur.ev[i], len = o.variant === "light" ? Math.min(0.2, n.dur) : Math.min(0.3, n.dur);
+      var e = t === Infinity ? 1 : o.prog(t, n.t, len), s = get(kk.midi), id = kk.midi + "|" + kk.acc;
+      if (e >= s.e){ s.e = e; s.p = t === Infinity ? 1 : Math.max(0, Math.min(1, (t - n.t) / len)); }
+      s.tone = cur.tone; if (e > 0) s.ids[id] = Math.max(s.ids[id] || 0, e);
+    });
+    // 授業の表示：先の段階の鍵盤を薄く（いちばん近い段階の色。今・前の段階で光っている鍵盤はそのまま）
+    if (o.preview) for (var q = steps.length - 1; q >= Math.max(0, k); q--){
+      var sq = steps[q];
+      sq.keys.forEach(function(kk){ var s = get(kk.midi); if (s.e > 0 || s.faded) return; s.pre = true; s.preTone = sq.tone; });
+    }
+    return st;
+  }
+  return {state: state, parseKey: parseKey, parseRange: parseRange, cover: cover, keys: keys, label: label, whiteLetter: whiteLetter, notes: notes, length: length, LETTERS: LETTERS, BW: BW, BH: BH};
+})();
+
+var TONES = /^(term|emph|muted|accent2|fg|series-[1-4])$/;
+var est = function(s, size){ return [...String(s)].reduce(function(a, c){ return a + (c === " " ? 0.3 : /[\u0000-ɏ]/.test(c) ? 0.6 : 1); }, 0) * size; };
+return class extends base.MotionElement {
+  static partName = "keyboard";   // the registry name (define meta name), for report prefixes
+  static variants = ["light", "press", "rise"];
+  static kb = KB;
+  static shape = {
+    schema: {type: "object", additionalProperties: false, required: ["range", "steps"], properties: {
+      range: {type: "string"}, names: {type: "string", enum: ["solfa", "abc", "iroha", "none"]}, cumulative: {type: "boolean"}, dur: {type: "number"},
+      steps: {type: "array", minItems: 1, items: {type: "object", additionalProperties: false, required: ["keys"], properties: {
+        keys: {type: "array", minItems: 1, items: {type: "string"}}, label: {type: "string"}, t: {type: "array", items: {type: "number"}},
+        tone: {type: "string"}, dur: {type: "number"}}}}}},
+    example: {range: "C4-C6", names: "solfa", steps: [{keys: ["C4", "E4", "G4"], label: "主和音（ドミソ）"}]},
+    note: {en: "range \"C4-C6\" (white keys at both ends, 1–3 octaves); steps [{keys: [\"C4\", \"E4\"], label, t: [seconds per key], tone, dur}]",
+           ja: "range \"C4-C6\"（両端は白鍵、1〜3 オクターブ）、steps [{keys: [\"C4\", \"E4\"], label, t: [鍵盤ごとの秒], tone, dur}]"},
+  };
+  static props = {};
+  get steps(){
+    if (this.getAttribute("steps") !== null) return +this.getAttribute("steps");
+    return this.plan().steps.length;
+  }
+  // 範囲と段階を読む（mount の前にも steps が要る）。範囲・鍵盤の名前・t の数が違えば Error（札が出る）
+  plan(){
+    if (this._plan) return this._plan;
+    var d = this.data || {}, notes = [];
+    var r = KB.parseRange(d.range), kb = KB.keys(r), outside = [];
+    var steps = d.steps.map(function(s, j){
+      var ks = s.keys.map(function(name){
+        var k = KB.parseKey(name);
+        if (!k) throw new Error("m-keyboard: steps[" + j + "] key \"" + name + "\" is not a key name (C4, F#3, Bb4, …)");
+        if (k.midi < r.lo.midi || k.midi > r.hi.midi) outside.push("steps[" + j + "] key " + name);
+        return k;
+      });
+      if (s.t && s.t.length !== s.keys.length) throw new Error("m-keyboard: steps[" + j + "] has " + s.keys.length + " keys but " + s.t.length + " times in t (one per key)");
+      if (s.t && s.t.some(function(v){ return !(v >= 0); })) throw new Error("m-keyboard: steps[" + j + "] t must be seconds ≥ 0");
+      if (s.tone !== undefined && !TONES.test(s.tone)) notes.push('[keyboard] steps[' + j + '] tone "' + s.tone + '" is not a theme colour (emph is used)');
+      var ev = KB.notes(s, d.dur);
+      return {o: s, keys: ks, ev: ev, len: KB.length(s, d.dur), tone: TONES.test(s.tone || "") ? s.tone : "emph"};
+    });
+    if (outside.length){
+      // 範囲の外の鍵：すべての鍵を覆う範囲を示す（範囲そのものではなく、段階の鍵だけから）
+      var lo = Infinity, hi = -Infinity;
+      steps.forEach(function(s){ s.keys.forEach(function(k){ lo = Math.min(lo, k.midi); hi = Math.max(hi, k.midi); }); });
+      var c = KB.cover(lo, hi);
+      throw new Error("m-keyboard: " + outside.join(", ") + (outside.length > 1 ? " are" : " is") + " outside range " + d.range + "; " +
+        (c ? "use " + c + " (covers every key in steps)" : "the keys in steps span " + (hi - lo) + " semitones, more than 3 octaves: split them over two keyboards"));
+    }
+    return (this._plan = {r: r, kb: kb, steps: steps, cumulative: d.cumulative === true, notes: notes});
+  }
+  duration(k){ var s = k >= 1 && this.plan().steps[k - 1]; return s ? s.len : 0; }
+  events(k){ var s = k >= 1 && this.plan().steps[k - 1]; return s ? s.ev.map(function(e){ return Object.assign({}, e); }) : []; }
+  mount(ctx){
+    var self = this, D = base, pl = this.plan(), kb = pl.kb, d = this.data || {};
+    this.variant = base.variant(this);
+    // 鍵盤の名前：書いていなければ日本語の授業はドレミ、ほかは CDE（段階の数は変わらないので plan() ではなくここで選ぶ）
+    var names = d.names === undefined ? (/^ja\b/i.test(ctx.lang) ? "solfa" : "abc") : d.names;
+    pl.notes.forEach(function(n){ ctx.report("data", n); });
+    this.style.display = "block";
+    var W = this.clientWidth, H = this.clientHeight;
+    var svg = D.el("svg", {viewBox: "0 0 " + W + " " + H, width: W, height: H, style: "display:block;overflow:visible"}, this);
+    var hasLabel = pl.steps.some(function(s){ return s.o.label; });
+    // 光る黒鍵の名前の行：となりの名前に重なるなら 2 行目へ（どの段階でも同じ置き場所）
+    var LFS = 30, NFS = 26, BFS = 24;
+    var unitW = Math.min((W - 6) / kb.n, 96);
+    var x0 = (W - unitW * kb.n) / 2;
+    var bl = {};
+    pl.steps.forEach(function(s){ s.keys.forEach(function(k){ if (!k.white && names !== "none") bl[k.midi + "|" + k.acc] = k; }); });
+    var blist = Object.keys(bl).map(function(id){
+      var k = bl[id], key = kb.all.filter(function(q){ return q.midi === k.midi; })[0], s = KB.label(k, names);
+      return {id: id, k: k, s: s, cx: x0 + key.cx * unitW, w: est(s, BFS)};
+    }).sort(function(a, b){ return a.cx - b.cx || a.id.localeCompare(b.id); });
+    var rowsEnd = [-1e9, -1e9], nRows = 0;
+    blist.forEach(function(b){
+      var row = b.cx - b.w / 2 > rowsEnd[0] + 10 ? 0 : 1;
+      if (row === 1 && b.cx - b.w / 2 <= rowsEnd[1] + 10) ctx.report("size", "[keyboard] the names of black keys near " + b.s + " overlap (use a wider element or a narrower range)");
+      rowsEnd[row] = b.cx + b.w / 2; b.row = row; nRows = Math.max(nRows, row + 1);
+    });
+    var labH = hasLabel ? 46 : 0, bnH = nRows * 32, namesH = names === "none" ? 0 : 40, gapTop = nRows ? 8 : (hasLabel ? 10 : 0);
+    var avail = H - labH - bnH - gapTop - namesH - 8;
+    var keyH = Math.min(avail, unitW * 4.4);
+    if (avail < 110) ctx.report("size", "[keyboard] the element (" + W + "×" + H + " px) leaves only " + Math.round(avail) + " px for the keys; make it taller (about " + Math.ceil(H + 110 - avail) + " px)");
+    if (unitW < 40) ctx.report("size", "[keyboard] white keys are " + unitW.toFixed(0) + " px wide; the names under them may not fit (use a narrower range or a wider element)");
+    var used = labH + bnH + gapTop + keyH + namesH, top0 = Math.max(0, (H - used) / 2);
+    var labY = top0 + 34, bnTop = top0 + labH, keyTop = bnTop + bnH + gapTop, keyBot = keyTop + keyH, bH = keyH * KB.BH;
+    this.geo = {x0: x0, unitW: unitW, keyTop: keyTop, keyH: keyH};
+    // 鍵盤：白鍵 → 白鍵の光 → 黒鍵 → 黒鍵の光（黒鍵は短く、上に）
+    var gW = D.el("g", {}, svg), gB = D.el("g", {}, svg), gT = D.el("g", {}, svg);
+    var K = this.K = {};
+    var rise = this.variant === "rise";
+    kb.all.forEach(function(key){
+      var white = key.white, x = x0 + key.x * unitW, w = key.w * unitW, h = white ? keyH : bH;
+      var par = white ? gW : gB, g = D.el("g", {}, par);
+      D.el("rect", {x: x.toFixed(1), y: keyTop.toFixed(1), width: w.toFixed(1), height: h.toFixed(1), rx: white ? 4 : 3,
+        fill: white ? "var(--bg)" : "var(--fg)", stroke: "var(--fg)", "stroke-width": white ? 2 : 1.5}, g);
+      var ins = white ? 3 : 4;
+      var lit = D.el("rect", {x: (x + ins).toFixed(1), y: (keyTop + (white ? 2 : 0)).toFixed(1), width: (w - 2 * ins).toFixed(1), height: (h - ins - (white ? 2 : 0)).toFixed(1), rx: 2, opacity: 0}, g);
+      var cx = x + w / 2, r = white ? Math.min(9, w * 0.16) : Math.min(7, w * 0.2), cy = keyTop + h - (white ? 14 + r : 10 + r);
+      var dot = D.el("circle", {cx: cx.toFixed(1), cy: cy.toFixed(1), r: r.toFixed(1), opacity: 0}, g);
+      K[key.midi] = {key: key, g: g, lit: lit, dot: dot, y: keyTop + (white ? 2 : 0), h: h - ins - (white ? 2 : 0), white: white, nm: null, bn: {}};
+    });
+    // 白鍵の名前（鍵盤の下）
+    if (names !== "none") kb.whites.forEach(function(key){
+      var s = KB.label({letter: KB.whiteLetter(key.midi), acc: ""}, names);
+      var t = D.el("text", {x: (x0 + (key.x + 0.5) * unitW).toFixed(1), y: (keyBot + 32).toFixed(1), "font-size": NFS, "text-anchor": "middle", fill: "var(--fg)"}, gT);
+      t.textContent = s;
+      K[key.midi].nm = t;
+    });
+    // 光る黒鍵の名前（鍵盤の上。光っているときだけ）
+    blist.forEach(function(b){
+      var t = D.el("text", {x: b.cx.toFixed(1), y: (bnTop + 25 + (nRows - 1 - b.row) * 32).toFixed(1), "font-size": BFS, "font-weight": 700, "text-anchor": "middle", fill: "var(--fg)", opacity: 0}, gT);
+      t.textContent = b.s;
+      K[b.k.midi].bn[b.id] = t;
+    });
+    // 段階の名前（鍵盤の上、24 px 以上）
+    this.lab = D.el("text", {x: (W / 2).toFixed(1), y: labY.toFixed(1), "font-size": LFS, "font-weight": 700, "text-anchor": "middle", fill: "var(--fg)", opacity: 0}, gT);
+    pl.steps.forEach(function(s, j){ if (s.o.label && est(s.o.label, LFS) > W) ctx.report("size", "[keyboard] steps[" + j + "] label is wider than the element; shorten it"); });
+    if (rise) Object.keys(K).forEach(function(m){ K[m].lit.setAttribute("data-y", K[m].y); });
+  }
+  render(k, t, ctx){
+    var pl = this.plan(), K = this.K, v = this.variant, cur = pl.steps[k - 1];
+    // 薄さはテーマの --preview-opacity（仕様 §8.4「Answers under preview」）。書いていないテーマだけ 0.45
+    var preview = !!ctx.preview, FAINT = preview ? base.previewOpacity(this) : 0.45;
+    var st = KB.state(pl.steps, k, t, {cumulative: pl.cumulative, preview: preview, variant: v, prog: base.prog});
+    Object.keys(K).forEach(function(m){
+      var o = K[m], s = st[m] || {e: 0, faded: false, pre: false, ids: {}, fids: {}}, on = s.e > 0;
+      var tone = on ? s.tone : s.faded ? s.fadeTone : s.preTone;
+      o.lit.setAttribute("fill", "var(--" + (tone || "emph") + ")");
+      var op = on ? (s.faded ? Math.max(0.4, v === "light" ? s.e : 1) : v === "light" ? s.e : 1) : s.faded ? 0.4 : s.pre ? FAINT : 0;
+      // rise：光が鍵盤の下から上へ満ちる
+      if (v === "rise"){
+        var f = on ? (s.faded ? 1 : s.e) : 1, h = o.h * f;
+        o.lit.setAttribute("y", (o.y + o.h - h).toFixed(1)); o.lit.setAttribute("height", h.toFixed(1));
+      }
+      o.lit.setAttribute("opacity", op.toFixed(3));
+      // 印：今の段階は塗った丸、前の段階は輪（色だけに頼らない）
+      o.dot.setAttribute("fill", on ? "var(--bg)" : "none");
+      o.dot.setAttribute("stroke", on ? "none" : o.white ? "var(--fg)" : "var(--bg)");
+      o.dot.setAttribute("stroke-width", on ? 0 : 2.5);
+      o.dot.setAttribute("opacity", (on ? (v === "press" ? 1 : s.e) : s.faded ? 0.9 : 0).toFixed(3));
+      // press：少し沈んで戻る（4 px、0.3 秒まで）
+      var dy = v === "press" && on && s.p < 1 ? 4 * Math.sin(Math.PI * s.p) : 0;
+      o.g.setAttribute("transform", dy ? "translate(0," + dy.toFixed(2) + ")" : "");
+      for (var id in o.bn){
+        var a = s.ids[id] ? (v === "light" ? s.ids[id] : 1) : 0;
+        if (!a && s.fids[id]) a = 0.75;
+        o.bn[id].setAttribute("opacity", a.toFixed(3));
+      }
+    });
+    var lab = cur && cur.o.label;
+    this.lab.textContent = lab || "";
+    this.lab.setAttribute("opacity", lab ? (t === Infinity ? 1 : base.prog(t, 0, Math.min(0.3, cur.len || 0.3))).toFixed(3) : 0);
+  }
+};
+});

package/vendor/components/sha256/2764f03a826a75e3690a7eb8f117ed19f7c7451683b22a1793532f6e69d070f9/README.md

@@ -0,0 +1,38 @@
+---
+name: m-kobun
+series: kokugo
+summary: 古文を語に切り（スラッシュ）、品詞で色を分けて 1 文ずつ見せ、最後に現代語訳と並べる。助動詞を押すと活用表と意味
+steps: 文の数（現代語訳があれば ＋1）
+purposes: text-structure
+props: size, tate, yaku, fade, detail
+---
+
+古文の品詞分解を、板書のように 1 文ずつ見せるときに使う。段階 0 は切っていない本文。
+
+## 書き方
+
+1 行が 1 文（1 段階）。語は `/` で切り、語の後ろの `[ ]` に品詞（と、`・` で区切って詳しいこと）を書く。`[ ]` の後ろの字（`、` `。`）は語に付けて出す。
+
+```
+春[名]/は[係助]/あけぼの[名]。
+= 春は明け方（がよい）。
+紫だち[動・タ四・連用]/たる[助動・たり・存続・連体]/雲[名]/の[格助]/…
+```
+
+- 品詞：`名` `代` `動` `補動` `形` `形動` `副` `連体` `接` `感` `助動` `格助` `係助` `副助` `接助` `終助` `間助` `接頭` `接尾`（色：動詞 `--term`、形容詞・形容動詞 `--accent2`、助動詞 `--emph`、助詞 `--muted`、ほか `--fg`）
+- 助動詞：`[助動・基本形・この文での意味・活用形]`。基本形は部品の中の表（文語の助動詞 28 語。`なり`・`たり` は意味で断定と伝聞推定・完了を分ける）から引く。表にないものは知らせる
+- `= …` の行：直前の文の現代語訳（最後の段階で、本文の下、縦書きでは左に出す）
+- `{漢字|かな}`：振り仮名
+
+## 押すと出る札
+
+助動詞は押す（タップする、または Tab で選んで Enter）と、基本形・活用の型・接続・意味と、6 つの活用形の表（この文の活用形に色）を出す。表は部品の中にあり、何も読み込まない（ネットワークを使わない。中身は文字だけ）。
+札は発表の操作で、画面の決まり（`DECK.seek(i, k, t)`）の外にある：段階を動かす・もう一度押す・札を押す・同じ段階に入り直す（ランタイムが `ctx.reset` を渡すとき）と消え、動画（`?mode=video`）では開かず、印刷には出ない。
+
+## 属性
+
+- `tate`：縦書き（品詞は語の左）
+- `detail`：品詞の下に `[ ]` の中をすべて出す（活用の種類・活用形まで。語の間が広がる）
+- `yaku="false"`：現代語訳の段階を作らない
+
+見本は `demo.html`（『枕草子』春はあけぼの、横書きと縦書き）。

package/vendor/components/sha256/2764f03a826a75e3690a7eb8f117ed19f7c7451683b22a1793532f6e69d070f9/demo.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="ja" data-theme="kokugo">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>m-kobun の見本</title>
+<!-- 組み方：node kit/build.mjs components/kobun/demo.html -o components/kobun/out/demo.html -->
+</head>
+<body>
+<div id="stage">
+
+<section class="slide noconcl">
+  <h2>『枕草子』春はあけぼの</h2>
+  <div class="body">
+    <p class="ia-badge" style="margin:0 0 10px;line-height:1.3"><span style="display:inline-block;font-size:27px;font-weight:700;color:var(--fg);border:2px dashed var(--accent2);border-radius:8px;padding:0 12px">操作できる</span></p>
+    <m-kobun style="height:470px">
+      春[名]/は[係助]/あけぼの[名]。
+      = 春は明け方（がよい）。
+      やうやう[副]/白く[形・ク・連用]/なりゆく[動・カ四・連体]/山ぎは[名]、
+      = だんだん白くなっていく山ぎわ（の空）が、
+      少し[副]/明かり[動・ラ四・連用]/て[接助]、
+      = 少し明るくなって、
+      紫だち[動・タ四・連用]/たる[助動・たり・存続・連体]/雲[名]/の[格助]/細く[形・ク・連用]/たなびき[動・カ四・連用]/たる[助動・たり・存続・連体]。
+      = 紫がかった雲が細くたなびいている（のがよい）。
+    </m-kobun>
+  </div>
+</section>
+
+<section class="slide noconcl">
+  <h2>縦書きの品詞分解</h2>
+  <div class="body">
+    <m-kobun tate style="height:520px">
+      春[名]/は[係助]/あけぼの[名]。
+      = 春は明け方（がよい）。
+      少し[副]/明かり[動・ラ四・連用]/て[接助]、
+      = 少し明るくなって、
+    </m-kobun>
+  </div>
+</section>
+
+</div>
+</body>
+</html>