egatari 0.0.0-stage → 0.6.4

package/vendor/components/sha256/9fe6ac64226e96a8cda10a3d3205ca9f09782a5a88e2d02e57e73d8bafac8e2d/index.js

@@ -0,0 +1,102 @@
+// m-curves：同じ座標軸に線を 1 本ずつ引く。線の名前は凡例でなく線の端に直接書く
+// <m-curves xr="[-3,3]" yr="[0,0.5]" xt="[-2,0,2]" yt="[0,0.2,0.4]" xl="*y*" yl="密度" style="height:380px">
+//   <script type="application/json">[{"label":"予測分布","f":"N(x,0,1)"},{"label":"中央値","pts":[[0,0],[0,0.4]],"dash":true}]
+//   （JSON の終わり）</m-curves>
+// 段階 j（1〜系列の数）で j 本目の線を引く。f は x の式（Math の関数と N(x,平均,標準偏差) が使える）、pts は点列
+DECK.define("m-curves", class extends DECK.MotionElement {
+  // データの形（kit/shape.js）：線の配列。軸（xr yr xt yt xl yl）は属性に書く（JSON の中ではない）
+  static shape = {
+    schema: {type: "array", items: {type: "object", additionalProperties: false, anyOf: [{required: ["f"]}, {required: ["pts"]}],
+      properties: {label: {type: "string"}, f: {type: "string"}, pts: {type: "array", items: {type: "array", items: {type: "number"}, minItems: 2, maxItems: 2}},
+        color: {type: "string"}, dash: {type: "boolean"}, xr: {type: "array", items: {type: "number"}, minItems: 2, maxItems: 2},
+        at: {type: "number"}, anchor: {enum: ["start", "middle", "end"]}, dx: {type: "number"}, dy: {type: "number"}, ly: {type: "number"}}}},
+    example: [{label: "需要 D", f: "10 - x"}, {label: "供給 S", f: "2 + x"}, {label: "均衡", pts: [[4, 0], [4, 6]], dash: true}],
+    // よくある書き違い（指示の部品の一覧に書く）
+    note: {en: "the data is the array itself, not {\"series\": […]}; axes go in attributes (xr=\"[0,10]\" xl=\"…\"); the expression field is f in x (not fn, not u)",
+           ja: "データは配列そのもの（{\"series\": […]} ではない）。軸は属性に書く（xr=\"[0,10]\" xl=\"…\"）。式の欄は f で、変数は x（fn・u ではない）"},
+  };
+  static props = {
+    xr: {type: "json", default: [0, 1], doc: "横軸の範囲"}, yr: {type: "json", default: [0, 1], doc: "縦軸の範囲"},
+    xt: {type: "json", default: []}, yt: {type: "json", default: []},
+    xf: {type: "number", default: undefined, doc: "横軸の目盛りの小数桁"}, yf: {type: "number", default: undefined, doc: "縦軸の目盛りの小数桁"},
+    xl: {type: "string", default: ""}, yl: {type: "string", default: ""},
+    n:   {type: "number", default: 300, doc: "f を描く分割数"},
+    dur: {type: "number", default: 1.0, doc: "1 本を引く秒数"},
+    lw:  {type: "number", default: 3.5, doc: "線の太さ"},
+  };
+  get steps(){ return this.getAttribute("steps") !== null ? +this.getAttribute("steps") : (this.data || []).length; }
+  mount(){
+    var P = this.props, D = DECK, self = this, S = this.data || [];
+    this.classList.add("plot"); this.style.display = "block";
+    var p = this.p = D.Plot(this, {xr: P.xr, yr: P.yr, xt: P.xt, yt: P.yt, xf: P.xf, yf: P.yf, xl: P.xl, yl: P.yl, m: {l: 86, r: 24, t: 24, b: 64}});
+    var uid = "mc" + (++D.Plot.n), defs = D.el("defs", {}, p.svg);
+    var N = function(x, m, s){ return Math.exp(-0.5 * Math.pow((x - m) / s, 2)) / (s * Math.sqrt(2 * Math.PI)); };
+    var x0 = p.m.l, x1 = p.W - p.m.r, y0 = p.m.t, y1 = p.H - p.m.b;
+    // 系列ごとに：点列、線、（破線なら）描く範囲の mask、端の名前
+    this.items = S.map(function(s, i){
+      var pts;
+      if (s.pts) pts = s.pts.map(function(q){ return [p.x(q[0]), p.y(q[1])]; });
+      else {
+        var g = new Function("x", "N", "with(Math){return " + s.f + ";}"), a = s.xr ? s.xr[0] : P.xr[0], b = s.xr ? s.xr[1] : P.xr[1];
+        pts = [];
+        for (var j = 0; j <= P.n; j++){ var v = a + (b - a) * j / P.n; pts.push([p.x(v), p.y(g(v, N))]); }
+      }
+      var d = pts.map(function(q, j){ return (j ? "L" : "M") + q[0].toFixed(1) + "," + q[1].toFixed(1); }).join("");
+      var col = colorOf(s.color, i);
+      var it = {};
+      if (s.dash){
+        // 破線は dasharray を描画に使えないので、同じ線を mask にして引く
+        var mk = D.el("mask", {id: uid + "m" + i, maskUnits: "userSpaceOnUse", x: 0, y: 0, width: p.W, height: p.H}, defs);
+        it.mpath = D.el("path", {d: d, fill: "none", stroke: "#fff", "stroke-width": P.lw + 6, pathLength: 1, "stroke-dasharray": "1 2"}, mk);
+        var gg = D.el("g", {mask: "url(#" + uid + "m" + i + ")", "clip-path": p.clip}, p.svg);
+        it.path = D.el("path", {d: d, fill: "none", stroke: col, "stroke-width": P.lw, "stroke-dasharray": "10 8", "stroke-linecap": "butt"}, gg);
+        it.draw = it.mpath;
+      } else {
+        it.path = D.el("path", {d: d, fill: "none", stroke: col, "stroke-width": P.lw, "clip-path": p.clip, pathLength: 1, "stroke-dasharray": "1 2", "stroke-linejoin": "round"}, p.svg);
+        it.draw = it.path;
+      }
+      // 名前の位置：at（横軸の値）の点、なければ描画範囲の中の最後の点
+      var inside = pts.filter(function(q){ return q[0] >= x0 - .5 && q[0] <= x1 + .5 && q[1] >= y0 - .5 && q[1] <= y1 + .5; });
+      var end = inside.length ? inside[inside.length - 1] : pts[pts.length - 1];
+      if (s.at !== undefined){
+        var ax = p.x(s.at), best = pts[0];
+        pts.forEach(function(q){ if (Math.abs(q[0] - ax) < Math.abs(best[0] - ax)) best = q; });
+        end = best;
+      }
+      var anchor = s.anchor || (end[0] > x1 - 160 ? "end" : "start");
+      it.lx = end[0] + (anchor === "end" ? -8 : anchor === "start" ? 10 : 0) + (s.dx || 0);
+      it.ly = (s.ly !== undefined ? p.y(s.ly) : end[1] - 12) + (s.dy || 0);
+      // 字の幅の見積もり（記法の * _ ^ を除く。全角 26px、半角 15px）
+      var w = 0; String(s.label || "").replace(/[*_^]/g, "").split("").forEach(function(ch){ w += ch.charCodeAt(0) > 255 ? 26 : 15; });
+      it.x0 = anchor === "end" ? it.lx - w : anchor === "middle" ? it.lx - w / 2 : it.lx; it.x1 = it.x0 + w;
+      it.anchor = anchor; it.col = col; it.label = s.label || "";
+      return it;
+    });
+    // 名前どうしが重ならないように、横に重なる名前を下へずらす
+    var min = 32, g = self.items.filter(function(it){ return it.label; }).sort(function(u, v){ return u.ly - v.ly; });
+    g.forEach(function(it, j){
+      for (var q = 0; q < j; q++){
+        var o = g[q];
+        if (it.x0 < o.x1 && o.x0 < it.x1 && it.ly - o.ly < min) it.ly = o.ly + min;
+      }
+    });
+    this.items.forEach(function(it){
+      it.lab = D.mtext(p.svg, it.lx, Math.max(26, it.ly), it.label, {"text-anchor": it.anchor, fill: it.col, "font-size": 26, "font-weight": 700, opacity: 0});
+    });
+    function colorOf(c, i){
+      if (!c) return "var(--series-" + (i % 4 + 1) + ")";
+      return c.indexOf("var(") === 0 ? c : "var(--" + c.replace(/^--/, "") + ")";
+    }
+  }
+  duration(k){ return k >= 1 ? this.props.dur * 0.7 + 0.6 : 0; }
+  render(k, t){
+    var dur = this.props.dur;
+    this.items.forEach(function(it, i){
+      var pd = i < k - 1 ? 1 : i === k - 1 ? DECK.prog(t, 0, dur) : 0;
+      var pl = i < k - 1 ? 1 : i === k - 1 ? DECK.prog(t, dur * 0.7, 0.6) : 0;
+      it.draw.setAttribute("stroke-dashoffset", (1 - pd).toFixed(4));
+      it.path.setAttribute("opacity", pd > 0 ? 1 : 0);
+      it.lab.setAttribute("opacity", pl.toFixed(3));
+    });
+  }
+});

package/vendor/components/sha256/a0353fe9c7aa0a739d0138babc9c75ff393ad1968e3b7ed3674ac9bb05f9ea23/README.md

@@ -0,0 +1,40 @@
+---
+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 語。`なり`・`たり` は意味で断定と伝聞推定・完了を分ける）から引く。表にないものは知らせる
+- `= …` の行：直前の文の現代語訳（最後の段階で、本文の下、縦書きでは左に出す）
+- `{漢字|かな}`：振り仮名
+
+<!-- llm: omit -->
+## 押すと出る札
+
+助動詞は押す（タップする、または Tab で選んで Enter）と、基本形・活用の型・接続・意味と、6 つの活用形の表（この文の活用形に色）を出す。表は部品の中にあり、何も読み込まない（ネットワークを使わない。中身は文字だけ）。
+札は発表の操作で、画面の決まり（`DECK.seek(i, k, t)`）の外にある：段階を動かす・もう一度押す・札を押す・同じ段階に入り直す（ランタイムが `ctx.reset` を渡すとき）と消え、動画（`?mode=video`）では開かず、印刷には出ない。
+<!-- llm: end -->
+
+## 属性
+
+- `tate`：縦書き（品詞は語の左）
+- `detail`：品詞の下に `[ ]` の中をすべて出す（活用の種類・活用形まで。語の間が広がる）
+- `yaku="false"`：現代語訳の段階を作らない
+
+見本は `demo.html`（『枕草子』春はあけぼの、横書きと縦書き）。

package/vendor/components/sha256/a0353fe9c7aa0a739d0138babc9c75ff393ad1968e3b7ed3674ac9bb05f9ea23/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>

package/vendor/components/sha256/a0353fe9c7aa0a739d0138babc9c75ff393ad1968e3b7ed3674ac9bb05f9ea23/index.js

@@ -0,0 +1,255 @@
+// m-kobun：古文の品詞分解（語をスラッシュで切り、品詞で色を分ける）を 1 文ずつ見せ、最後に現代語訳と並べる
+// <m-kobun style="height:430px">
+//   春[名]/は[係助]/あけぼの[名]。
+//   = 春は明け方（がよい）。
+//   紫だち[動・タ四・連用]/たる[助動・たり・存続・連体]/雲[名]/の[格助]/…
+// </m-kobun>
+// 1 行が 1 文（1 段階）。語は / で切り、語の後ろの [ ] に品詞と詳しいこと（・で区切る）を書く。[ ] の後ろの字（、。）は語に付けて出す。
+// 「= …」の行は直前の文の現代語訳（最後の段階で、本文の下（縦書きでは左）に並べる）。{漢字|かな} は振り仮名。
+// 助動詞は [助動・基本形・意味・活用形]：押す（タップする）と、その助動詞の活用表と意味を出す（部品の中の表から。読み込みはしない）。
+// 押して出した札は発表の操作で、画面の決まり（DECK.seek(i, k, t)）の外：段階を動かす・もう一度押す・札を押す・同じ段階に入り直す（ctx.reset）と消え、動画と印刷には出ない
+(function(){
+"use strict";
+var D = window.DECK;
+
+// ---------------------------------------------------------------- 品詞
+// 品詞の頭の字 → [種類, 名前]。色は種類ごと（テーマの変数だけ）
+var POS = [
+  ["助動", "aux", "助動詞"], ["格助", "pt", "格助詞"], ["係助", "pt", "係助詞"], ["副助", "pt", "副助詞"], ["接助", "pt", "接続助詞"],
+  ["終助", "pt", "終助詞"], ["間助", "pt", "間投助詞"], ["助", "pt", "助詞"], ["形動", "adj", "形容動詞"], ["形", "adj", "形容詞"],
+  ["動", "verb", "動詞"], ["補動", "verb", "補助動詞"], ["名", "noun", "名詞"], ["代", "noun", "代名詞"], ["副", "etc", "副詞"],
+  ["連体", "etc", "連体詞"], ["接", "etc", "接続詞"], ["感", "etc", "感動詞"], ["接頭", "etc", "接頭語"], ["接尾", "etc", "接尾語"]];
+var COLOR = {noun: "var(--fg)", verb: "var(--term)", adj: "var(--accent2)", aux: "var(--emph)", pt: "var(--muted)", etc: "var(--fg)"};
+function posOf(tag){ for (var i = 0; i < POS.length; i++) if (tag.indexOf(POS[i][0]) === 0) return {kind: POS[i][1], name: POS[i][2], short: POS[i][0]}; return {kind: "etc", name: tag, short: tag}; }
+
+// ---------------------------------------------------------------- 文語の助動詞（活用・接続・意味）
+// 活用は 未然・連用・終止・連体・已然・命令（○ は形がない、（ ）はまれな形）
+var AUX = {
+  "る":   {f: "れ れ る るる るれ れよ", type: "下二段型", conn: "未然形（四段・ナ変・ラ変）", mean: "受身・尊敬・自発・可能"},
+  "らる": {f: "られ られ らる らるる らるれ られよ", type: "下二段型", conn: "未然形（四段・ナ変・ラ変以外）", mean: "受身・尊敬・自発・可能"},
+  "す":   {f: "せ せ す する すれ せよ", type: "下二段型", conn: "未然形（四段・ナ変・ラ変）", mean: "使役・尊敬"},
+  "さす": {f: "させ させ さす さする さすれ させよ", type: "下二段型", conn: "未然形（四段・ナ変・ラ変以外）", mean: "使役・尊敬"},
+  "しむ": {f: "しめ しめ しむ しむる しむれ しめよ", type: "下二段型", conn: "未然形", mean: "使役・尊敬"},
+  "ず":   {f: "ず・ざら ず・ざり ず ぬ・ざる ね・ざれ ざれ", type: "特殊型", conn: "未然形", mean: "打消"},
+  "じ":   {f: "○ ○ じ じ じ ○", type: "無変化型", conn: "未然形", mean: "打消推量・打消意志"},
+  "む":   {f: "（ま） ○ む（ん） む（ん） め ○", type: "四段型", conn: "未然形", mean: "推量・意志・適当・勧誘・仮定・婉曲"},
+  "むず": {f: "○ ○ むず むずる むずれ ○", type: "サ変型", conn: "未然形", mean: "推量・意志・適当・勧誘・仮定・婉曲"},
+  "まし": {f: "ましか・（ませ） ○ まし まし ましか ○", type: "特殊型", conn: "未然形", mean: "反実仮想・ためらいの意志・推量"},
+  "べし": {f: "べから べく・べかり べし べき・べかる べけれ ○", type: "形容詞型（ク活用）", conn: "終止形（ラ変型には連体形）", mean: "推量・意志・可能・当然・命令・適当"},
+  "まじ": {f: "まじから まじく・まじかり まじ まじき・まじかる まじけれ ○", type: "形容詞型（シク活用）", conn: "終止形（ラ変型には連体形）", mean: "打消推量・打消意志・不可能・打消当然・禁止・不適当"},
+  "らむ": {f: "○ ○ らむ（らん） らむ（らん） らめ ○", type: "四段型", conn: "終止形（ラ変型には連体形）", mean: "現在推量・現在の原因推量・伝聞・婉曲"},
+  "けむ": {f: "○ ○ けむ（けん） けむ（けん） けめ ○", type: "四段型", conn: "連用形", mean: "過去推量・過去の原因推量・過去の伝聞・婉曲"},
+  "き":   {f: "（せ） ○ き し しか ○", type: "特殊型", conn: "連用形（カ変・サ変には未然形にも）", mean: "過去（自分が経験したこと）"},
+  "けり": {f: "（けら） ○ けり ける けれ ○", type: "ラ変型", conn: "連用形", mean: "過去（伝え聞いたこと）・詠嘆"},
+  "つ":   {f: "て て つ つる つれ てよ", type: "下二段型", conn: "連用形", mean: "完了・強意・並列"},
+  "ぬ":   {f: "な に ぬ ぬる ぬれ ね", type: "ナ変型", conn: "連用形", mean: "完了・強意・並列"},
+  "たり(完了)": {f: "たら たり たり たる たれ たれ", type: "ラ変型", conn: "連用形", mean: "完了・存続"},
+  "り":   {f: "ら り り る れ れ", type: "ラ変型", conn: "サ変の未然形・四段の已然形", mean: "完了・存続"},
+  "なり(断定)": {f: "なら なり・に なり なる なれ なれ", type: "形容動詞型（ナリ活用）", conn: "体言・連体形", mean: "断定・存在"},
+  "なり(伝聞推定)": {f: "○ （なり） なり なる なれ ○", type: "ラ変型", conn: "終止形（ラ変型には連体形）", mean: "伝聞・推定"},
+  "めり": {f: "○ （めり） めり める めれ ○", type: "ラ変型", conn: "終止形（ラ変型には連体形）", mean: "推定・婉曲"},
+  "らし": {f: "○ ○ らし らし らし ○", type: "無変化型", conn: "終止形（ラ変型には連体形）", mean: "推定"},
+  "たり(断定)": {f: "たら たり・と たり たる たれ たれ", type: "形容動詞型（タリ活用）", conn: "体言", mean: "断定"},
+  "ごとし": {f: "○ ごとく ごとし ごとき ○ ○", type: "形容詞型（ク活用）", conn: "連体形・助詞「の」「が」", mean: "比況・例示"},
+  "まほし": {f: "まほしから まほしく・まほしかり まほし まほしき・まほしかる まほしけれ ○", type: "形容詞型（シク活用）", conn: "未然形", mean: "希望"},
+  "たし": {f: "たから たく・たかり たし たき・たかる たけれ ○", type: "形容詞型（ク活用）", conn: "連用形", mean: "希望"},
+};
+var FORMS = ["未然", "連用", "終止", "連体", "已然", "命令"];
+// 基本形と意味から表の項目を選ぶ（なり・たりは意味で分ける）
+function auxOf(base, mean){
+  var b = String(base || "").replace(/[（(].*$/, "");
+  if (AUX[base]) return {key: base, a: AUX[base]};
+  if (b === "なり") return /伝聞|推定/.test(mean || "") ? {key: "なり(伝聞推定)", a: AUX["なり(伝聞推定)"]} : {key: "なり(断定)", a: AUX["なり(断定)"]};
+  if (b === "たり") return /断定/.test(mean || "") ? {key: "たり(断定)", a: AUX["たり(断定)"]} : {key: "たり(完了)", a: AUX["たり(完了)"]};
+  if (b === "ん") return {key: "む", a: AUX["む"]};
+  if (b === "んず") return {key: "むず", a: AUX["むず"]};
+  return AUX[b] ? {key: b, a: AUX[b]} : null;
+}
+
+// ---------------------------------------------------------------- 読み取り
+// parse(文字列) → {lines: [{words: [{text: [{t, rb}], tail, tag, pos, info, aux}], yaku}], warnings}
+function rubyText(s){
+  var out = [], re = /\{([^|{}]*)\|([^{}]*)\}/g, last = 0, m;
+  while ((m = re.exec(s))){ if (m.index > last) out.push({t: s.slice(last, m.index)}); out.push({t: m[1], rb: m[2]}); last = re.lastIndex; }
+  if (last < s.length) out.push({t: s.slice(last)});
+  return out;
+}
+function parse(src){
+  var lines = [], warnings = [];
+  String(src || "").split(/\r?\n/).map(function(l){ return l.trim(); }).filter(Boolean).forEach(function(l){
+    if (/^[=＝]/.test(l)){
+      if (!lines.length) warnings.push("現代語訳の前に本文がない：" + l);
+      else lines[lines.length - 1].yaku = l.replace(/^[=＝]\s*/, "");
+      return;
+    }
+    var words = l.split(/[/／]/).filter(function(w){ return w.trim() !== ""; }).map(function(w){
+      var m = /^(.*?)(?:[[［]([^\]］]*)[\]］])?([^[\]［］]*)$/.exec(w.trim());
+      var tag = m[2] ? m[2].trim() : "", parts = tag ? tag.split(/[・･]/) : [], pos = tag ? posOf(parts[0]) : null;
+      var word = {text: rubyText(m[1]), tail: m[3] || "", tag: tag, pos: pos, info: parts.slice(1), aux: null};
+      if (pos && pos.kind === "aux"){
+        // [助動・基本形・意味・活用形]
+        var x = auxOf(parts[1], parts[2]);
+        if (!x) warnings.push("表にない助動詞「" + (parts[1] || "") + "」（" + w + "）");
+        word.aux = {base: parts[1] || "", mean: parts[2] || "", form: parts[3] || "", entry: x};
+      }
+      return word;
+    });
+    lines.push({words: words, yaku: ""});
+  });
+  return {lines: lines, warnings: warnings};
+}
+D.kobun = {parse: parse, AUX: AUX, FORMS: FORMS, auxOf: auxOf, posOf: posOf};
+if (!D.MotionElement) return;   // 試験（Node）では読み取りだけ
+
+// ---------------------------------------------------------------- 部品
+var CSS = [
+  "m-kobun{display:block;position:relative;font-family:var(--font-mincho);color:var(--fg)}",
+  "m-kobun .kb-text{position:absolute;inset:0;line-height:1.5}",
+  "m-kobun.tate .kb-text{writing-mode:vertical-rl}",
+  "m-kobun .kb-line{display:flex;flex-direction:column;margin:0 0 6px}",
+  "m-kobun.tate .kb-line{margin:0 0 0 14px}",
+  "m-kobun .kb-src{display:block}",
+  "m-kobun .kb-w{display:inline-flex;flex-direction:column;align-items:center;vertical-align:top}",
+  "m-kobun .kb-tag{font-size:24px;line-height:1.1;white-space:nowrap;font-family:var(--font-cap,var(--font-sans))}",
+  // スラッシュ：横書きでは斜めの線、縦書きでは横の線（背景で描く）
+  "m-kobun .kb-sep{display:inline-block;height:1.3em;vertical-align:top;background:linear-gradient(to bottom right,transparent calc(50% - 1.3px),var(--muted) calc(50% - 1.3px),var(--muted) calc(50% + 1.3px),transparent calc(50% + 1.3px))}",
+  "m-kobun.tate .kb-sep{height:auto;width:1.1em;background:linear-gradient(var(--muted),var(--muted)) center/70% 2.5px no-repeat}",
+  "m-kobun .kb-aux{cursor:pointer;border-radius:4px}",
+  "m-kobun .kb-aux:focus-visible{outline:2px solid var(--emph);outline-offset:2px}",
+  "m-kobun .kb-yaku{display:block;font-size:27px;line-height:1.5;color:var(--term);font-family:var(--font-cap,var(--font-sans))}",
+  "m-kobun .kb-pop{position:absolute;z-index:5;writing-mode:horizontal-tb;background:var(--bg);border:2px solid var(--emph);border-radius:10px;" +
+    "padding:10px 16px;box-shadow:0 4px 18px color-mix(in srgb,var(--fg) 22%,transparent);font-family:var(--font-cap,var(--font-sans));font-size:24px;line-height:1.35;color:var(--fg);display:none}",
+  "m-kobun .kb-pop b{color:var(--emph)}",
+  "m-kobun .kb-pop table{border-collapse:collapse;margin-top:6px;font-size:24px;width:auto}",
+  "m-kobun .kb-pop th,m-kobun .kb-pop td{border:1px solid var(--line);padding:2px 8px;text-align:center;font-weight:400;color:var(--fg)}",
+  "m-kobun .kb-pop td.on{background:var(--emph-tint);color:var(--emph);font-weight:700}",
+  "@media print{m-kobun .kb-pop{display:none!important}}",
+].join("\n");
+D.define("m-kobun", class extends D.MotionElement {
+  static interactive = true;   // 操作できるパーツ（助動詞を押すと札。docs/conventions.md §6）
+  // データの形（kit/shape.js）：JSON ではなく、要素の中に 1 行 1 文の字（語を / で切り [品詞]）
+  static shape = {text: true, example: "春[名]/は[係助]/あけぼの[名]。\n= 春は明け方（がよい）。"};
+  static props = {
+    size: {type: "number", default: 34, doc: "本文の字の大きさ（px）"},
+    tate: {type: "bool", default: false, doc: "縦書きにする（品詞は語の左、現代語訳は文の左に）"},
+    yaku: {type: "bool", default: true, doc: "現代語訳（= の行）があれば、最後の段階で並べる"},
+    fade: {type: "number", default: 0.6, doc: "1 文の品詞分解を出す秒数"},
+    detail: {type: "bool", default: false, doc: "品詞の下に [ ] の中をすべて（活用の種類・活用形など）出す"},
+  };
+  get model(){ if (!this._m) this._m = parse(this._src !== undefined ? this._src : this.textContent); return this._m; }
+  get hasYaku(){ return this.props.yaku && this.model.lines.some(function(l){ return l.yaku; }); }
+  get steps(){ return this.getAttribute("steps") !== null ? +this.getAttribute("steps") : this.model.lines.length + (this.hasYaku ? 1 : 0); }
+  mount(){
+    var self = this, P = this.props;
+    this._src = this.textContent;
+    var m = this.model;
+    m.warnings.forEach(function(w){ console.warn("m-kobun: " + w); });
+    this.textContent = "";
+    this.classList.add("plot");
+    if (P.tate) this.classList.add("tate");
+    if (!document.getElementById("m-kobun-css")){ var st = document.createElement("style"); st.id = "m-kobun-css"; st.textContent = CSS; document.head.appendChild(st); }
+    var mk = function(tag, cls, parent, text){ var e = document.createElement(tag); if (cls) e.className = cls; if (text !== undefined) e.textContent = text; parent.appendChild(e); return e; };
+    var box = mk("div", "kb-text", this);
+    box.style.fontSize = P.size + "px";
+    this.lines = m.lines.map(function(line, li){
+      var L = {el: mk("div", "kb-line", box), words: [], seps: []};
+      var src = mk("span", "kb-src", L.el);
+      line.words.forEach(function(w, wi){
+        if (wi > 0){
+          // スラッシュ（背景で描く）。幅（縦書きでは高さ）は段階で 0 から広げる
+          var sp = mk("span", "kb-sep", src);
+          L.seps.push(sp);
+        }
+        var we = mk("span", "kb-w", src);
+        var tx = mk("span", "kb-wt", we);
+        w.text.forEach(function(s){
+          if (s.rb){ var r = mk("ruby", "", tx, s.t); mk("rt", "", r, s.rb); }
+          else tx.appendChild(document.createTextNode(s.t));
+        });
+        if (w.tail) tx.appendChild(document.createTextNode(w.tail));
+        var tg = mk("span", "kb-tag", we, w.pos ? (P.detail ? w.tag : w.pos.short) :" ");
+        var W = {el: we, tx: tx, tag: tg, w: w};
+        if (w.aux && w.aux.entry){
+          we.classList.add("kb-aux"); we.tabIndex = 0; we.setAttribute("role", "button");
+          we.setAttribute("aria-label", plainText(w) + "：助動詞「" + w.aux.base + "」" + w.aux.mean + "・" + w.aux.form + "形（押すと活用表）");
+          var open = function(e){ e.preventDefault(); e.stopPropagation(); self.toggle(li, wi); };
+          we.addEventListener("click", open);
+          we.addEventListener("keydown", function(e){ if (e.key === "Enter" || e.key === " "){ open(e); } });
+        }
+        L.words.push(W);
+      });
+      if (line.yaku) L.yaku = mk("span", "kb-yaku", L.el, line.yaku);
+      return L;
+    });
+    this.pop = mk("div", "kb-pop", this);
+    this.pop.addEventListener("click", function(e){ e.stopPropagation(); self._open = null; self.redraw(); });
+    this.setAttribute("aria-label", m.lines.map(function(l){ return l.words.map(plainText).join(""); }).join(""));
+  }
+  // 押した助動詞の札：開いている札と同じなら閉じる。今の段階で開いた札だけを出す
+  toggle(li, wi){
+    if (DECK.mode === "video") return;
+    var o = this._open;
+    this._open = o && o.li === li && o.wi === wi ? null : {li: li, wi: wi, k: this._k};
+    this.redraw();
+  }
+  redraw(){ if (this._k !== undefined) this.render(this._k, this._t); }
+  duration(k){
+    var n = this.model.lines.length;
+    if (k >= 1 && k <= n) return this.props.fade + 0.2;
+    if (k === n + 1) return 0.6;
+    return 0;
+  }
+  render(k, t, ctx){
+    var self = this, P = this.props, n = this.model.lines.length, tate = P.tate;
+    var lag = n > 1 ? Math.min(0.12, 0.15 / (n - 1)) : 0;
+    // 段階が動いたら札を閉じる。同じ段階にもう一度入るとき（ctx.reset：触れた部品を、宣言した姿に戻す）も閉じる
+    if (this._open && (this._open.k !== k || (ctx && ctx.reset))) this._open = null;
+    this._k = k; this._t = t;
+    this.lines.forEach(function(L, li){
+      // 文 li の品詞分解は段階 li + 1 に出る
+      var s = li + 1, e = k > s ? 1 : k < s ? 0 : D.prog(t, 0, P.fade);
+      L.seps.forEach(function(sp){
+        sp.style[tate ? "height" : "width"] = (e * 0.55).toFixed(3) + "em";
+        sp.style.opacity = e.toFixed(3);
+      });
+      L.words.forEach(function(W){
+        var col = W.w.pos ? COLOR[W.w.pos.kind] : "var(--fg)";
+        W.tx.style.color = e > 0.5 ? col : "var(--fg)";
+        W.tx.style.fontWeight = e > 0.5 && W.w.pos && W.w.pos.kind === "aux" ? 700 : 400;
+        W.tag.style.color = col;
+        W.tag.style.opacity = W.w.pos ? e.toFixed(3) : 0;
+        W.el.style.background = W.w.aux && e > 0.5 ? "var(--emph-tint)" : "transparent";
+      });
+      // 現代語訳は文ごとに少しずつ遅らせて出し、段階の長さ（0.6 秒）の中で出し終える（2 文までは 0.12 秒ずつ、それより多ければ詰める）
+      if (L.yaku){ var y = self.hasYaku ? (k > n + 1 ? 1 : k < n + 1 ? 0 : D.prog(t, li * lag, 0.45)) : 0; L.yaku.style.opacity = y.toFixed(3); }
+    });
+    // 札
+    var o = this._open;
+    if (!o){ this.pop.style.display = "none"; return; }
+    var W = this.lines[o.li].words[o.wi], a = W.w.aux, ent = a.entry;
+    this.pop.textContent = "";
+    var head = document.createElement("div");
+    var b = document.createElement("b"); b.textContent = a.base; head.appendChild(b);
+    head.appendChild(document.createTextNode("（助動詞・" + ent.a.type + "）　この文では " + a.mean + "・" + a.form + "形"));
+    this.pop.appendChild(head);
+    var row = function(label, text){ var d = document.createElement("div"); d.textContent = label + "：" + text; self.pop.appendChild(d); };
+    row("接続", ent.a.conn); row("意味", ent.a.mean);
+    var tb = document.createElement("table"), tr1 = document.createElement("tr"), tr2 = document.createElement("tr"), forms = ent.a.f.split(" ");
+    FORMS.forEach(function(f, j){
+      var th = document.createElement("th"); th.textContent = f; tr1.appendChild(th);
+      var td = document.createElement("td"); td.textContent = forms[j] || "○"; if (a.form && a.form.indexOf(f) === 0) td.className = "on"; tr2.appendChild(td);
+    });
+    tb.appendChild(tr1); tb.appendChild(tr2); this.pop.appendChild(tb);
+    this.pop.style.display = "block";
+    // 語の近く（下か左）に置き、部品の外にはみ出さない
+    var r = W.el.getBoundingClientRect(), R = this.getBoundingClientRect(), sc = R.width / (this.offsetWidth || 1) || 1;
+    var x = (r.left - R.left) / sc, y = (r.bottom - R.top) / sc + 8, pw = this.pop.offsetWidth, ph = this.pop.offsetHeight;
+    if (tate){ x = (r.left - R.left) / sc - pw - 10; y = (r.top - R.top) / sc; }
+    // 横書きで下に入らなければ語の上へ
+    if (!tate && y + ph > this.offsetHeight) y = (r.top - R.top) / sc - ph - 8;
+    x = Math.max(0, Math.min(this.offsetWidth - pw, x)); y = Math.max(0, Math.min(Math.max(0, this.offsetHeight - ph), y));
+    this.pop.style.left = x.toFixed(1) + "px"; this.pop.style.top = y.toFixed(1) + "px";
+  }
+});
+function plainText(w){ return w.text.map(function(s){ return s.t; }).join("") + w.tail; }
+})();

package/vendor/components/sha256/a11f1ceefd99057623a4a692e89c2d96490fb67d1567598ed5f26c7d392d4d4c/README.md

@@ -0,0 +1,43 @@
+---
+name: m-map-japan
+series: social
+summary: 日本の 47 都道府県の地図。地域の強調、統計の塗り分け、点、矢印、経度・緯度の重ね描きを段階ごとに出す
+steps: 項目の step の最大（既定 1）。地図そのものは段階 0 から出ている
+purposes: spatial
+variants: fade, sweep, draw
+props: layout, labels, show, unit, digits, legend, dur
+data-credit: 地図データ：Natural Earth（パブリックドメイン）を加工
+---
+
+地理・歴史の授業で場所を示すときに使う。子の JSON（どれも `step` `at` `tone` を持てる）：
+
+- `regions`：`id`（`"01"`〜`"47"`）か `group`（`hokkaido` `tohoku` `kanto` `chubu` `kinki` `chugoku` `shikoku` `kyushu`）。`label`
+- `values`：`{"13": 1406, …}` と `classes`（階級の下限、既定は 4 階級、5 つまで）で塗り分け。凡例に階級を書く
+- `points`：`lon` `lat`（または `code` で県庁の位置）、`label`、`anchor`
+- `flows`：`from` `to`（番号か `[経度, 緯度]`）の矢印。`via`（通る点 `[[経度, 緯度], …]`。海の道は沖に）、`label` `labelAt` `value`
+- `shapes`：`polygon` か `line`（`[[経度, 緯度], …]`）。`label` `dash`
+
+`labels`：`focus`（既定）・`all`・`none`。`show="value"` で入る地域に値を書く（既定は書かない）。`layout="true"` で本当の位置。
+
+地図データ：Natural Earth（パブリックドメイン）を加工。
+
+<!-- llm: omit -->
+注意
+
+- 領土は日本政府の立場のとおり：北方領土（国後・択捉・色丹・歯舞）は北海道、竹島は島根県、尖閣諸島は沖縄県（docs/map-design.md §4.5）。データに固定した性質で、授業ごとに切り替えることはできない
+- 地図データは `tools/map/build-japan.mjs` が Natural Earth 5.1.1 の 1:10m（`ne_10m_admin_1_states_provinces` と、竹島のために `ne_10m_admin_0_countries_jpn`）から作り、`index.js` の BEGIN/END map-japan-data の間に書く。手で直さない。作り直し方は `tools/map/README.md`
+- Natural Earth の admin-1 は奄美群島を沖縄県に入れているので、鹿児島県に直している。北方領土は admin-1 ではサハリン州なので北海道に移している
+- 図法は正角円錐図法（標準緯線 30°・42°、中央経線 136°E）。`layout="inset"`（既定）では、本図を要素の高さいっぱいに描き、九州の左下に南西諸島（沖縄県とトカラ列島・奄美群島）の枠（島の範囲にぴったり、高さは本図の 0.42 倍で島が枠を満たす縮尺）、右下に小笠原諸島（鳥島・沖ノ鳥島・南鳥島を含む、本図の 0.5 倍）の枠を置き、枠の上に「（縮尺は本図と異なる）」と書く。要素が小さくてそれでは本図が小さくなるときは、本図の空いた隅（左上・右下の海）に小さい縮尺で枠を置き、名前は入るときだけ書く（小さい要素で書けなかった名前は `console.warn` で知らせる）。凡例が要素の右からはみ出しそうなら広めの見積もりで並べ直し、凡例が要素より高いか本図の幅が 120 px 未満になるときは凡例を描かずに知らせる（値は読み上げ用の層に残る）
+- 形が消える小さな島（竹島・魚釣島・沖ノ鳥島・南鳥島・父島・硫黄島）は点で描き、その都道府県の色で塗る。竹島・尖閣諸島（魚釣島の点）・沖ノ鳥島・南鳥島はいつも名前を書く（地図と一緒に段階 0 から）。高さ 360 px・幅 340 px 未満の小さい要素では、点のまわりに入らなければ少し離れた海（枠の外でもよい）に引き出し線を付けて書き、それでも入らなければ書かずに `console.warn` で知らせる
+- 段階：地図そのもの（陸地・枠・枠の名前、`labels="all"` の名前）は段階 0 から出ている。強調・塗り分け・点・矢印・重ね描きは `step`（既定 1）から
+- 塗り分けの色は `color-mix(in oklab, var(--term) p%, var(--bg))`（濃い階級は `var(--fg)` との混ぜ）。OKLab の明るさを、いちばん薄い階級から濃い階級まで等しい間隔にする（テーマの色から割合を計算する）。都道府県の境界はいつも `--muted` の細い線で描き、いちばん薄い階級もそれで縁取る。`tools/test-classes.mjs` が、既定・国語・ビジネスのテーマで 4 階級と 5 階級について、隣り合う階級の明るさの差 0.08 以上・等間隔・薄い階級の縁取り・境界を測る
+- `classes` を書かなければ、値の 4 分位から有効数字 2 桁に切り下げた 4 つの下限を使う。6 階級以上は `console.warn` で知らせる（見分けにくい）
+- 値・名前の字は `--bg` の札の上に `--fg` で書く（塗りの濃さによらず 4.5:1 以上）。値は `show="value"` のときだけ、地域の中に入るときだけ書く（既定は書かず、凡例と読める層で読む）。凡例は「500 以上」「200〜500 未満」の形。名前は札がすべて地域の中に入るときだけ中に、入らなければまわりの海に置いて引き出し線を引く（ほかの強調した地域を横切らない所を選ぶ）。点の名前は矢印の線に掛けない
+- 読める層：最後の状態の字の等価物（強調した地域とその都道府県、塗り分けの階級とすべての値、点・矢印・重ね描きの名前）を、画面に出ない一覧（`ul.sr-only`）にして部品の中に置く
+- 矢印の `via` は、通る点をなめらかな曲線（求心的な Catmull-Rom。行き過ぎて輪にならない）で結ぶ。書かなければ `bend`（既定 0.18）だけ横にふくらむ曲線。線は始めの点の 11 px 外から引き、矢じりは 1 つで、先は終わりの点の数 px 手前。`labelAt`（`[経度, 緯度]`）で名前の場所を決められる（重ね描きも同じ）
+- 塗り分けた地域を `regions` でも挙げると、塗りつぶさずに太い縁で強調する
+- 各都道府県の陸の `path` に `data-mark="JP-13"` のような印がある（Studio のカメラ `{zoom:JP-13}` で寄れる）
+- 見せ方：`fade`（フェード）・`sweep`（同じ段階の中で西から東へ順に。全体で `fade` の長さの中）・`draw`（地域と重ね描きは輪郭を引いてから塗り、輪郭は塗り終わると消える）。どれも位置は動かない。矢印はどの見せ方でも線を引いていく
+- 授業の表示（`?mode=lecture`）では、先の段階の項目を薄く（0.45）見せる
+- 見本の人口は総務省統計局「令和2年国勢調査 人口速報集計結果」（2020 年 10 月 1 日現在）を万人に丸めたもの。北前船の寄港地と通る点は公知の事実からのおおよその位置
+<!-- llm: end -->

package/vendor/components/sha256/a11f1ceefd99057623a4a692e89c2d96490fb67d1567598ed5f26c7d392d4d4c/demo.html

@@ -0,0 +1,101 @@
+<!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-map-japan の見本</title>
+<!-- 組み方：node kit/build.mjs components/map-japan/demo.html -o components/map-japan/out/demo.html
+     地図データ：Natural Earth（パブリックドメイン）を加工。
+     人口：総務省統計局「令和2年国勢調査 人口速報集計結果」表Ⅱ－1（2020年10月1日現在。万人未満を四捨五入）。
+     北前船の寄港地は江戸時代の西廻り航路のおもな港（公知の事実） -->
+<style>
+</style>
+</head>
+<body>
+<div id="stage">
+
+<section class="slide">
+  <h2>日本の八地方区分</h2>
+  <div class="body">
+    <m-map-japan aria-label="八地方区分の地図" style="height:440px">
+      <script type="application/json">{
+        "regions": [
+          {"group": "hokkaido", "tone": "series-1", "step": 1},
+          {"group": "tohoku", "tone": "series-2", "step": 2},
+          {"group": "kanto", "tone": "series-3", "step": 3},
+          {"group": "chubu", "tone": "series-1", "step": 4},
+          {"group": "kinki", "tone": "series-4", "step": 5},
+          {"group": "chugoku", "tone": "series-2", "step": 6},
+          {"group": "shikoku", "tone": "series-3", "step": 7},
+          {"group": "kyushu", "tone": "series-1", "step": 8}
+        ]
+      }</script>
+    </m-map-japan>
+  </div>
+  <div class="concl"><span>→ 北から順に 8 つの地方に分ける</span></div>
+</section>
+
+<section class="slide">
+  <h2>都道府県の人口（2020 年、国勢調査速報）</h2>
+  <div class="body">
+    <m-map-japan aria-label="都道府県別の人口の塗り分け" legend="人口" unit="万人" style="height:440px">
+      <script type="application/json">{
+        "classes": [0, 100, 200, 500],
+        "values": {"01": 523, "02": 124, "03": 121, "04": 230, "05": 96, "06": 107, "07": 183, "08": 287, "09": 193, "10": 194,
+          "11": 735, "12": 629, "13": 1406, "14": 924, "15": 220, "16": 104, "17": 113, "18": 77, "19": 81, "20": 205,
+          "21": 198, "22": 364, "23": 755, "24": 177, "25": 141, "26": 258, "27": 884, "28": 547, "29": 133, "30": 92,
+          "31": 55, "32": 67, "33": 189, "34": 280, "35": 134, "36": 72, "37": 95, "38": 134, "39": 69, "40": 514,
+          "41": 81, "42": 131, "43": 174, "44": 112, "45": 107, "46": 159, "47": 147}
+      }</script>
+    </m-map-japan>
+  </div>
+  <div class="concl"><span>→ 500 万人以上の 9 都道府県は大都市のまわり</span></div>
+</section>
+
+<section class="slide">
+  <h2>北前船の西廻り航路（江戸時代）</h2>
+  <div class="body">
+    <m-map-japan aria-label="北前船の航路" labels="none" style="height:440px">
+      <script type="application/json">{
+        "points": [
+          {"lon": 135.43, "lat": 34.65, "label": "大坂", "anchor": "below", "step": 1},
+          {"lon": 130.94, "lat": 33.96, "label": "下関", "anchor": "left", "step": 2},
+          {"lon": 139.84, "lat": 38.91, "label": "酒田", "anchor": "right", "step": 3},
+          {"lon": 140.10, "lat": 41.43, "label": "松前", "anchor": "left", "step": 4}
+        ],
+        "flows": [
+          {"from": [135.43, 34.65], "to": [130.94, 33.96], "step": 2,
+           "via": [[135.15, 34.5], [134.9, 34.6], [134.5, 34.42], [134.0, 34.41], [133.4, 34.18], [133.08, 34.08], [132.9, 34.15], [132.72, 34.08], [132.52, 33.8], [132.1, 33.62], [131.7, 33.84], [131.3, 33.85]]},
+          {"from": [130.94, 33.96], "to": [139.84, 38.91], "label": "日本海", "labelAt": [134.6, 38.4], "step": 3,
+           "via": [[130.5, 34.35], [130.85, 35.0], [131.5, 35.45], [132.4, 35.9], [133.2, 36.6], [134.3, 36.25], [135.3, 36.35], [136.2, 37.0], [136.45, 37.75], [137.4, 38.0], [138.0, 38.55], [138.8, 38.8], [139.4, 39.0]]},
+          {"from": [139.84, 38.91], "to": [140.10, 41.43], "step": 4,
+           "via": [[139.75, 39.4], [139.5, 40.0], [139.75, 40.6], [139.95, 41.2]]}
+        ]
+      }</script>
+    </m-map-japan>
+  </div>
+  <div class="concl"><span>→ 大坂から瀬戸内海・日本海を通って北へ</span></div>
+</section>
+
+<section class="slide">
+  <h2>見せ方の種類（variant）</h2>
+  <div class="body">
+    <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 28px;text-align:center;font-size:27px">
+      <div>フェード（fade、既定）</div><div>西から順に（sweep）</div><div>輪郭から（draw）</div>
+      <m-map-japan variant="fade" labels="none" style="height:380px">
+        <script type="application/json">{"regions": [{"group": "kinki", "tone": "term"}, {"group": "kyushu", "tone": "emph"}, {"id": "01", "tone": "accent2"}]}</script>
+      </m-map-japan>
+      <m-map-japan variant="sweep" labels="none" style="height:380px">
+        <script type="application/json">{"regions": [{"group": "kinki", "tone": "term"}, {"group": "kyushu", "tone": "emph"}, {"id": "01", "tone": "accent2"}]}</script>
+      </m-map-japan>
+      <m-map-japan variant="draw" labels="none" style="height:380px">
+        <script type="application/json">{"regions": [{"group": "kinki", "tone": "term"}, {"group": "kyushu", "tone": "emph"}, {"id": "01", "tone": "accent2"}]}</script>
+      </m-map-japan>
+    </div>
+  </div>
+  <div class="concl"><span>→ 資料のシード値（data-egatari-seed）で 1 つが選ばれる</span></div>
+</section>
+
+</div>
+</body>
+</html>