ksk-design-system 2.12.0 → 2.14.0

package/MIGRATION.md

@@ -3,6 +3,23 @@
 メジャーバージョン間の移行ガイド。
 patch / minor は原則破壊変更なし、自動アップグレード可（例外: **v1.34.0 で npm パッケージ名を変更**。import の置換が必要。下記参照）。
 
+## v2.13.0 の導入注意
+
+以下はv2.13.0の導入注意です。consumerへの展開・アプリ配布は別工程で、次回のまとめ展開で反映します。
+
+- **下部ナビ・FABの入力中表示（#700）**: `MobileTabBar` / `MobileFloatingActionButton` は既定の `keyboardBehavior="hide"` での非表示条件が増えます。`BottomTabBar` の既定stayは維持し、hideを明示した場合だけ同じ検知を使います。viewportの縮小に加え、タッチ主体の端末でテキスト入力にフォーカスした時点でも非表示になります。pointer/hover能力では物理キーボード接続を判別できないため、この先行非表示が不要なら `hideOnInputFocus={false}` でviewport検知だけにできます。従来どおり表示位置を変えたくない画面は `keyboardBehavior="stay"` を明示してください。
+- **下側Sheetの入力時高さ（#706）**: `safeArea={true}`（既定）の通常bottom Sheetは、キーボード表示時に上端のsafe-areaも差し引き、ステータスバー・ノッチへの侵入を避けます。独自の全画面配置でこの補正が不要なら `safeArea={false}` を指定してください。snap Sheetは今回の高さ変更の対象外です。
+- **画面・分類・配置編集（#701–#703）**: Screenへ上端safe-area、svh/fill、768px以上の中央カード、landmark省略を追加します。fillの中央カードは親の高さを尊重します。KanbanColumnの分類色指定と、選択・ドラッグ・矢印移動用SelectableTileも追加します。これらの追加APIは任意指定です。
+- **予定のモバイル表示（#704）**: MonthCalendarへ週表示、予定一覧AgendaListを追加します。週表示は選択日を優先し、月外の初期選択日や内部の月またぎ移動でも表示週・月見出しを揃えます。既定の月表示は維持します。
+- **管理画面のモバイルナビ（#705）**: AdminShellへ任意のモバイルドロワーを追加します。リンク選択時の自動closeは `closeMobileDrawerOnNavigate={true}` の明示指定で有効にし、既定falseでは既存の挙動を維持します。
+
+## v2.14.0 の導入注意
+
+以下はv2.14.0の導入注意です。consumerへの展開・アプリ配布は別工程で、次回のまとめ展開で反映します。
+
+- **余白・項目行・ダイアログ・アプリ枠・予定の色（#711–#716）**: Container / ChipFilterBar の `gutter="fluid"`（`--Container-Gutter-Fluid`）、FormField の `orientation="horizontal"`・Input / Textarea の `targetSize="comfortable"`、Dialog の `centerFrom`・`height="fill"`・`size="2xl"`・`DialogHeader variant="bar"`、FieldSet の `gap`・FieldLegend の `size="sm"`、MobileAppShell の `viewport="fixed"`・`safeAreaTop`・`safeAreaBottom`・`bottomPadding="native-tab-bar"`（`--Native-Tab-Bar-Height`。ネイティブ側が書く任意フック <!-- docs-drift-ignore: --Native-Tab-Bar-Height -->）、MonthCalendar / AgendaList の予定の `accentColor` を追加します。すべて任意指定で、既定の見た目は変わりません。
+- **CollapsibleChipField の見出し（#717）**: `label` の既定の見た目が `typo-label-sm` + `Text-Medium-Emphasis`（12px）から、フォームの項目名と同じ `typo-label-md` + `Text-High-Emphasis`（14px 太字）に変わります（同じ詳細シートの `<Label>` / `FormField` と大きさをそろえるため）。従来の見た目が要る画面は `labelSize="sm"` を指定してください。展開中の選択肢のまとまりは見える見出しと `aria-labelledby` で結ばれます（`ariaLabel` を指定した場合は従来どおり `aria-label`）。`label` も `icon` も渡さない行は、先頭の 24px の空きが無くなります。native の CollapsibleChipField は変わりません。
+
 <!-- deprecations:start（自動生成・手で編集しない） -->
 
 ## 非推奨 API 一覧

package/NATIVE_RECIPES.md

@@ -17,6 +17,21 @@ RN 側の公開 export 一覧は `src/native/COMPONENT_LOOKUP.md` で確認で
 import { Button, Screen, PhotoHero } from "ksk-design-system/native/ui"
 ```
 
+## OS のモーション設定
+
+```tsx
+import { useReduceMotion } from "ksk-design-system/native/ui"
+
+const { reduceMotion, resolved } = useReduceMotion()
+const suppressMotion = !resolved || reduceMotion
+```
+
+`resolved` は OS 設定の初回取得または設定変更イベントで `true` になります。
+取得前・取得失敗時は `false` のため、`suppressMotion` の間は演出を開始せず、
+実行中の演出は停止して元の表示へ戻してください。設定変更は即時反映され、
+遅れて届いた初回取得結果では上書きしません。アンマウント時には購読を解除します。
+この hook は `native/ui` の公開 API です。トークン専用の `native` エントリには含みません。
+
 ## Expo Router / React Navigation bottom tabs
 
 Expo Router の `<Tabs>` では `createExpoRouterTabBar` を渡します。アイコンは各 screen の `tabBarIcon` をそのまま使えるため、consumer 側で floating tab bar を組み直す必要はありません。

package/README.md

@@ -540,6 +540,21 @@ import { BottomTabBar } from "ksk-design-system"
 
 React Native は **0.78 以上**（React 19 を同梱する最初の RN）が必要です。
 
+### OS のモーション設定
+
+```tsx
+import { useReduceMotion } from "ksk-design-system/native/ui"
+
+const { reduceMotion, resolved } = useReduceMotion()
+const suppressMotion = !resolved || reduceMotion
+```
+
+`resolved` は OS 設定の初回取得または設定変更イベントで `true` になります。
+取得前・取得失敗時は `false` のため、`suppressMotion` の間は演出を開始せず、
+実行中の演出は停止して元の表示へ戻してください。設定変更は即時反映され、
+遅れて届いた初回取得結果では上書きしません。アンマウント時には購読を解除します。
+この hook は `native/ui` の公開 API です。トークン専用の `native` エントリには含みません。
+
 `ksk-design-system/native/ui` から直接 RN 用コンポーネント export（134 個）を import できます。iOS 26 の **Liquid Glass** にも対応:
 
 ```tsx

package/RELEASE.md

@@ -2,6 +2,38 @@
 
 `ksk-design-system` のリリーススケジュール・運用ルール。
 
+## v2.14.0（2026-10-17）
+
+2.13.0以降に、consumer側の上書きをなくすためのAPIを7件追加したminorリリース。追加のみのAPIが中心です。
+
+- Container / ChipFilterBarに `gutter="fluid"`（`--Container-Gutter-Fluid`）を追加しました（#711）。
+- FormFieldに `orientation="horizontal"` / `labelWidth` / `labelAlign`、Input / Textareaに `targetSize="comfortable"`（44px）を追加しました（#712）。
+- Dialogに `centerFrom` / `height="fill"` / `size="2xl"` と `DialogHeader variant="bar"` を追加しました（#713）。
+- FieldLegendに `size="sm"`、FieldSetに `gap` を追加しました（#714）。
+- MobileAppShellに `viewport="fixed"` / `safeAreaTop` / `safeAreaBottom` / `bottomPadding="native-tab-bar"` を追加しました（#715）。
+- MonthCalendarの予定に `accentColor` を追加しました（#716）。
+- CollapsibleChipFieldの見出しを、フォームの項目名と同じ14px太字・Highにそろえました。従来の見た目は `labelSize="sm"` で指定できます。label も icon も無い行は先頭の空きが無くなります（#717）。
+
+導入時は [2.14.0の注意](./MIGRATION.md#v2140-の導入注意) を確認してください。npm公開・タグ・GitHub Releaseはversion変更のmainマージ後に `publish.yml` が実行します。consumerへの取り込みとアプリ配布は別工程で、今回のDS公開準備には含めません。
+
+## v2.13.0（2026-10-17）
+
+2.12.0以降に、consumer側の上書きをなくすためのAPI・部品を追加し、追加APIの不具合を直したminorリリース。次の2点は既定の挙動が変わります。
+
+- 下部ナビ・FABの `keyboardBehavior="hide"` が、タッチ専用端末で入力欄にフォーカスした時点でも隠れるようになりました。従来どおりにするには `keyboardBehavior="stay"` を指定します（#700）。
+- キーボード表示中の下側Sheetの高さ上限から、上端のsafe-areaを引くようにしました。従来どおりにするには `safeArea={false}` を指定します（#706）。
+
+主な追加は次のとおりです。
+- 下部ナビのタブ高さとラベル位置を、consumer側のCSS変数で調整できるようにしました（#699）。
+- Screenに `safeAreaTop` / `height` / `desktopLayout="card"` / `landmark="none"`（#701）。
+- KanbanColumnに `accentColor`、新部品 `SelectableTile`（#702・#703）。
+- MonthCalendarに `view="week"`、新部品 `AgendaList`（#704）。
+- AdminShellに `mobileDrawer`（#705）。
+- Nativeに、OSの視差効果を減らす設定と取得状態を返す `useReduceMotion`（#698・#708）。
+- 追加APIの高さ・日付・入力フォーカス処理の修正と、`hideOnInputFocus` の追加（#709）。
+
+導入時は [2.13.0の注意](./MIGRATION.md#v2130-の導入注意) を確認してください。npm公開・タグ・GitHub Releaseはversion変更のmainマージ後に `publish.yml` が実行します。consumerへの取り込みとアプリ配布は別工程で、今回のDS公開準備には含めません。
+
 ## v2.12.0（2026-10-17）
 
 2.11.0以降に、consumer側の見た目の上書きをなくすためのAPI・部品を22件追加したminorリリース。追加のみで、propsを渡さなければ従来と同じ表示です。

package/contracts/components.json

@@ -1,15 +1,15 @@
 {
   "meta": {
     "name": "KSK Design System — Component Contracts",
-    "version": "2.12.0",
+    "version": "2.14.0",
     "description": "全コンポーネントの構造化定義。バリアント・アクセシビリティ要件・使用ルールを機械可読形式で管理。",
     "counts": {
       "ui": 72,
-      "patterns": 67,
+      "patterns": 69,
       "commerce": 12,
       "admin": 8,
       "shells": 3,
-      "total": 162
+      "total": 164
     },
     "exportNaming": {
       "_doc": "contracts の name が `import { name } from \"ksk-design-system\"` で解決できるかを示す。__tests__/contracts-export-integrity.test.ts が src/index.ts の実 export と突き合わせて固定する。",
@@ -109,7 +109,8 @@
         "startAdornment": "ReactNode — 左側の装飾（単位記号・アイコン等）",
         "endAdornment": "ReactNode — 右側の装飾（クリアボタン等・pointer-events 有効）",
         "showCount": "boolean — maxLength とセットで文字数カウンタ（IME 追従）",
-        "unstyled": "boolean — 寸法・枠・背景・タイポを出さず挙動と a11y だけ提供（段階移行用 / issue #420）"
+        "unstyled": "boolean — 寸法・枠・背景・タイポを出さず挙動と a11y だけ提供（段階移行用 / issue #420）",
+        "targetSize": "\"compact\" | \"comfortable\" — inline 系 variant の当たり判定。comfortable は min-h-11 + py-2 で 44px（issue #712）。default（枠付き）と unstyled では効かない"
       },
       "accessibility": [
         "Must pair with <Label>",
@@ -245,7 +246,8 @@
       "props": {
         "autoGrow": "boolean — 入力内容に合わせて高さを自動伸縮",
         "showCount": "boolean — maxLength とセットで文字数カウンタ（IME 追従）",
-        "unstyled": "boolean — 寸法・枠・背景・タイポを出さず挙動と a11y だけ提供（段階移行用 / issue #420）"
+        "unstyled": "boolean — 寸法・枠・背景・タイポを出さず挙動と a11y だけ提供（段階移行用 / issue #420）",
+        "targetSize": "\"compact\" | \"comfortable\" — inline 系 variant の当たり判定。comfortable は min-h-11 + py-2 で 44px（issue #712）。default（枠付き）と unstyled では効かない"
       },
       "accessibility": [
         "Must pair with <Label>",
@@ -420,7 +422,12 @@
         "native (src/native/components/Dialog.tsx): position=\"center\"(既定) / \"top\" / \"fullscreen\" を持ち、fullscreen は四辺・top は上端の safe-area を避ける。実測 inset は SafeAreaInsetsProvider から供給し、未供給なら回避量 0（従来どおり）",
         "modal な Dialog の content は aria-modal=\"true\" を出力する（modal={false} では出さない）。開いているモーダルの横断判定は useHasOpenModal() / useOpenModalCount() を使い、consumer 側で data-state 等の内部属性を直接読まない（#505）",
         "size は sm(400px) / md(480px・既定) / lg(640px) / xl(800px) の幅の段（opt-in）。未指定は従来の 480px のまま。position=\"fullscreen\" では無視。size の段は sm: 付きなので、上書きは className に sm:max-w-* を渡す（接頭辞なしの max-w-* は size に勝たない）。Sheet の size と段の名前を揃えている。ResponsiveDialogContent の size は PC 側の Dialog にだけ渡る",
-        "position=\"top\" / \"fullscreen\" の上端 safe area は --Safe-Area-Inset-Top で読む（issue #682。Sheet と同じ）"
+        "position=\"top\" / \"fullscreen\" の上端 safe area は --Safe-Area-Inset-Top で読む（issue #682。Sheet と同じ）",
+        "スマホは全画面・PC は中央のモーダルにする作業面は position=\"fullscreen\" + centerFrom（\"sm\" | \"md\" | \"lg\"）。境界以上で center と同じ位置・角丸・影・size の幅になる。className に md:!max-w-* / md:!h-* を書いて全画面を打ち消さない（issue #713）",
+        "height=\"fill\" は中央表示（center / centerFrom の境界以上）の高さを画面 - 4rem に固定する。見取り図・表など中身の量で枠が伸び縮みすると困る面向け（issue #713）",
+        "size は sm(400) / md(480・既定) / lg(640) / xl(800) / 2xl(1024px・issue #713)",
+        "全画面ダイアログ（padding={false}）の上端の帯は DialogHeader variant=\"bar\"（下線・左右 24px・上下 12px）+ trailing（閉じるボタン等）。DialogHeader に border-b / flex-row / px を自作しない（issue #713）",
+        "height=\"fill\" は position=\"top\" と centerFrom の無い fullscreen では効かない（開発ビルドで警告）。DialogHeader variant=\"bar\" の trailing（閉じるボタン）は必須（省略すると開発ビルドで警告）。centerFrom の中央表示は center と同じ ksk-squircle の角（issue #713）"
       ],
       "variants": {
         "position": [
@@ -1341,7 +1348,7 @@
       "description": "ページ内容の最大幅・中央寄せ・左右 gutter を一元管理するレイアウトプリミティブ。",
       "variants": [
         "size: narrow / page / wide / fluid",
-        "gutter: none / tight / default / spacious"
+        "gutter: none / tight / default / spacious / fluid（画面幅で 16〜28px・--Container-Gutter-Fluid で上書き可。issue #711）"
       ],
       "sizes": [],
       "rules": [
@@ -1646,7 +1653,10 @@
         "Label + Input + error message as unit",
         "required asterisk は Brand 色。Caution 色は入力エラーとの混同を避ける",
         "1 フィールド分の label / control / description / error に使う。フォーム全体のセクションには FieldSet を使う",
-        "長いフォームでは FieldGroup の中に FormField を並べる"
+        "長いフォームでは FieldGroup の中に FormField を並べる",
+        "ラベル左置きの項目行は orientation=\"horizontal\"（左のラベル列の幅は labelWidth・既定 5rem、複数行の中身は labelAlign=\"start\"）。説明文・エラーは右の列の下段に出る。Label に w-20 等を付けて行を自作しない（issue #712）",
+        "horizontal で枠の無い入力欄（variant=\"inline\"）を置くときは targetSize=\"comfortable\" で 44px の当たり判定を持たせる。外側に py-2 を足して稼がない（issue #712）",
+        "orientation=\"horizontal\" は置き場所の幅（@container）が 15rem 未満なら縦積みに戻る。endLabel は入力欄の右に出る（issue #712）"
       ]
     },
     {
@@ -1670,7 +1680,8 @@
         "個々の入力は既存 FormField を FieldGroup 内に並べる",
         "FieldDescription はセクション・グループの補足、FieldError はグループ単位のエラーに使う",
         "グループ横断の区切りは FieldSeparator を使い、中央ラベルは children で渡す",
-        "FormSection は title/description 一体の簡易 API、FieldSet は legend や複数 FieldGroup を明示構成する長いフォーム向け"
+        "FormSection は title/description 一体の簡易 API、FieldSet は legend や複数 FieldGroup を明示構成する長いフォーム向け",
+        "詰めた並び（絞り込みシートの選択肢グループ等）は FieldSet gap（sm=8 / md=16 / lg=24px）+ FieldLegend size=\"sm\"（typo-label-md + Text-Medium-Emphasis）。className に space-y-* や typo-* を足して上書きしない。gap 指定時は legend の下にも同じ間隔が付く（未指定の既定は legend の直下 0px のまま）（issue #714）"
       ]
     },
     {
@@ -1889,8 +1900,12 @@
         "keyboard 表示中に入力を邪魔する場合は keyboardBehavior=hide を使う",
         "variant=glass に shadow-* を重ねない（glass-accent が inset 3層 + drop shadow を内包するため二重になる）",
         "下部固定の全幅 CTA は fullWidth を使い、fixed inset-x + Button を手組みしない。fullWidth 時は placement が無視されラベルが常に表示される",
-        "広告バナー等で動的に持ち上げる必要があるときは、内部変数 --ksk-fab-bottom-offset を直接上書きせず bottomOffsetExtra を使う（issue #453）"
-      ]
+        "広告バナー等で動的に持ち上げる必要があるときは、内部変数 --ksk-fab-bottom-offset を直接上書きせず bottomOffsetExtra を使う（issue #453）",
+        "既定挙動の変更（issue #700・次のリリースで告知）: keyboardBehavior=\"hide\"（既定）は、キーボード検知に加え、タッチ主体の端末（(pointer: coarse) and (hover: none)）でテキスト入力欄にフォーカスがある間も隠れる。隠れている間は invisible でフォーカスも受けない。従来どおり常に出したいときは keyboardBehavior=\"stay\" でオプトアウトする。物理キーボード接続はpointer/hover能力から判別できないため、フォーカスによる先行非表示だけを止めるときは hideOnInputFocus=false（viewport検知は維持）。consumer の html:has(input:focus) で隠す CSS は不要"
+      ],
+      "props": {
+        "hideOnInputFocus": "boolean（既定 true）— keyboardBehavior=\"hide\" のとき、タッチ主体端末の入力フォーカスでも隠す。false なら viewport のキーボード検知だけを使う。pointer/hover能力から物理キーボード接続は判別できない"
+      }
     },
     {
       "name": "MobileAppHeader",
@@ -1956,7 +1971,8 @@
         "label 指定時は幅 w-20 固定でフィールドリストの他行とラベル幅を揃える。",
         "折りたたみ中の1チップは開閉トリガで aria-expanded を持ち、展開中は行が role=\"radiogroup\"・各チップが role=\"radio\" + aria-checked になる。矢印キー移動と roving tabindex 付き(issue #419)。",
         "展開で選択中チップへフォーカスが移り、Escape で畳んで元のチップへ戻る(issue #419)。",
-        "label を持たない icon 先頭の行では radiogroup に名前が付かないので ariaLabel を必ず渡す(issue #419)。"
+        "label を持たない icon 先頭の行では radiogroup に名前が付かないので ariaLabel を必ず渡す(issue #419)。",
+        "見出し（label）の既定は textHierarchy のフォームラベル（typo-label-md + Text-High-Emphasis）で、同じシートの Label / FormField の項目名とそろう。従来の小さい見た目は labelSize=\"sm\"。展開中の radiogroup は見える label と aria-labelledby で結ばれる（ariaLabel 明示時は aria-label 優先）。label も icon も無い行は先頭の枠を描かない（issue #717。native は label.sm のまま）"
       ]
     },
     {
@@ -1974,7 +1990,8 @@
         "sticky 時の top オフセットは stickyOffset prop で指定する（固定ヘッダー高さの相殺用）。",
         "resultCountLabel 未指定時は \"{n}件\" を表示。i18n が必要な場合は関数 props で差し替える。",
         "bare=true 時は overflow/padding ラッパーを付けない。外側スクロールコンテナと共有する場合に使う。",
-        "チップ列と件数の左右余白は gutter（none | tight=16px | default=24px・Container と同じ語彙）か contentClassName で付ける(issue #667)。sticky の背景は全幅のまま。外側 className に px-* を付けたり [&>div]: 等の子孫セレクタで DS 内部の DOM に依存したりしない。native も gutter を持つ"
+        "チップ列と件数の左右余白は gutter（none | tight=16px | default=24px・Container と同じ語彙）か contentClassName で付ける(issue #667)。sticky の背景は全幅のまま。外側 className に px-* を付けたり [&>div]: 等の子孫セレクタで DS 内部の DOM に依存したりしない。native も gutter を持つ",
+        "gutter=\"fluid\" は Container gutter=\"fluid\" と同じ --Container-Gutter-Fluid（既定 clamp(1rem, 4vw, 1.75rem)）を読み、本文と左端がそろう。プロダクト独自のページ余白は contentClassName に渡さずこの変数へ寄せる（issue #711。native は fluid を持たない）"
       ]
     },
     {
@@ -2202,6 +2219,10 @@
         "写真ヒーローなど 1 画面固定では scroll=false と padding=none を組み合わせる",
         "mainId で本文 landmark の id を調整でき、skipLink=false で内蔵 SkipLink を無効化できる",
         "footer には主要 CTA を置き、safe-area 余白を消費側で再実装しない",
+        "上端のステータスバー / ダイナミックアイランドは safeAreaTop で避ける（header の上、header が無ければ画面上端に --Safe-Area-Inset-Top の余白。issue #701）。header 側で pt-[max(1rem,var(--Safe-Area-Inset-Top))] を自作しない",
+        "アドレスバーの出入りで高さを揺らしたくない画面は height=\"svh\"、高さの決まった親の中では height=\"fill\"（既定 dvh）",
+        "オンボーディング・ログイン等の 1 画面フローを PC で中央カードにするときは desktopLayout=\"card\"（md = 768px 以上で Surface-Secondary の背景の中央に枠・角丸のカード。cardMaxWidth 既定 30rem / cardMaxHeight 既定 47.5rem）。md:w-[480px] md:rounded-2xl 等を className で自作しない",
+        "他の <main> の中に置くときは landmark=\"none\"（本文を div にし、id とスキップリンクを既定で出さない）",
         "React Native consumer は ksk-design-system/native/ui の Screen を使い、header/body/footer shell をローカル再実装しない"
       ]
     },
@@ -2623,7 +2644,10 @@
       "rules": [
         "BottomTabBar + MobileFloatingActionButton の geometry を consumer CSS で手組みしない",
         "既に fixed な nav を渡す場合は bottomNavMode=external を使う",
-        "bottomPaddingExtra（CSS の長さ）は bottomPadding の既定余白（bottom-nav=5rem / bottom-nav-fab=7rem / none=0）に加算する。広告バナー等の常設要素の高さを渡し、main の下余白を mainClassName で自前計算しない（issue #681）"
+        "bottomPaddingExtra（CSS の長さ）は bottomPadding の既定余白（bottom-nav=5rem / bottom-nav-fab=7rem / none=0）に加算する。広告バナー等の常設要素の高さを渡し、main の下余白を mainClassName で自前計算しない（issue #681）",
+        "アプリ型の高さ固定の画面（本文だけスクロール・header 常時表示）は viewport=\"fixed\"（ルート 100svh・main が overflow-y-auto）。page 側で h-[100svh] overflow-hidden や main の overflow を手組みしない（issue #715）",
+        "上端の safe-area は safeAreaTop（header があれば header、無ければ枠）、fixed のタブバーの下の safe-area は safeAreaBottom。ネイティブの殻がタブバーを描く構成は bottomPadding=\"native-tab-bar\"（1rem + var(--Native-Tab-Bar-Height, 6rem)。safe-area 込みの値なので safeAreaBottom は足さない）。広告等は bottomPaddingExtra に変数を渡すだけにし、calc を page に書かない（issue #715）",
+        "全幅は centeredPreview={false}。viewport=\"fixed\" の main は Tab で止まるスクロール領域（tabIndex=0）で、ソフトキーボード表示中は見えている高さへ縮む（visualViewport。検知できない環境は html[data-kb-open] + --kb-h）。safeAreaBottom と native-tab-bar の同時指定は開発ビルドで警告（issue #715）"
       ]
     },
     {
@@ -2799,8 +2823,27 @@
         "日のセル・予定チップを Button unstyled で自作しない",
         "あふれは maxEventsPerDay（既定 2）超を「+n件」にまとめ、onShowMore（既定 onSelectDay）でその日の詳細へ",
         "md（768px）未満はチップの代わりに色ドット（最大 3）を出す。操作は日の選択に一本化する",
+        "スマホの週の帯は view=\"week\"（フォーカス中の日を含む 1 週だけ。矢印キーで週が移る。issue #704）、日ごとの予定の中身は AgendaList を下に置く。週ストリップ・アジェンダを Button unstyled で自作しない",
         "土日の色は weekendTone（既定 true。日曜 Text-Caution / 土曜 Text-Accent-Primary・Calendar と同じ語彙）",
-        "native は未提供（INTENTIONAL_NATIVE_GAPS）"
+        "native は未提供（INTENTIONAL_NATIVE_GAPS）",
+        "分類の識別色（カテゴリ別の予定）は MonthCalendarEvent.accentColor に var(--Categorical-N) を渡す。md 以上はチップの先頭の点、md 未満は日付の下の点（tone より優先）。チップの面と文字は tone のまま。renderEvent の中で色の点を自作しない（issue #716）"
+      ]
+    },
+    {
+      "name": "AgendaList",
+      "path": "src/components/patterns/agenda-list.tsx",
+      "description": "予定がある日を時系列に並べる一覧（issue #704）。スマホのカレンダーで MonthCalendar（view=\"week\" の週の帯や月グリッド）の下に置き、日付列（日・曜日）+ その日の予定の行で中身を見せる。予定は MonthCalendarEvent と同じ形。",
+      "accessibility": [
+        "日ごとの li に読み上げ用の見出し（既定 h3。置き場所に合わせて headingLevel で変える・「10月3日（土）、今日」）。今日の行は aria-current=\"date\"。日付列の見た目は aria-hidden",
+        "onSelectEvent を渡すと予定の行が button（44px 以上・focus-visible リング）。渡さなければ読むだけの行"
+      ],
+      "rules": [
+        "予定の行の面は tone（MonthCalendar のチップと同じ色）。今日・選択日・土日（weekendTone）の見た目は DS が持つ",
+        "既定は予定がある日だけを昇順に並べる。予定の無い日も出すときは dates（emptyDayLabel 既定「予定なし」）",
+        "スクロール連動・「今日へ」のジャンプ先は dayId で id を付ける（行には常に data-date）",
+        "並べる日が無いときは empty（EmptyState 等）",
+        "native は未提供（INTENTIONAL_NATIVE_GAPS）",
+        "予定の accentColor（issue #716）は行の先頭の点になる（行の面は tone のまま）。renderEvent で点を自作しない"
       ]
     },
     {
@@ -2812,10 +2855,34 @@
       ],
       "rules": [
         "列の上辺に太い色帯を付けない。状態は tone の色ドットと見出しの言葉で示す",
+        "分類の識別色（カテゴリ別ボード等）は accentColor に var(--Categorical-N) を渡す（tone より優先。issue #702）。title の中に色の点を自作しない",
         "中のカードは Card elevation=\"none\"（面の中の面は影なし）",
         "ドラッグ＆ドロップは持たない。consumer のライブラリで包む",
         "native は未提供（INTENTIONAL_NATIVE_GAPS）"
       ]
+    },
+    {
+      "name": "SelectableTile",
+      "path": "src/components/patterns/selectable-tile.tsx",
+      "description": "押すと選べて、編集中はドラッグ・矢印キーで動かせるタイル（issue #703）。配席表の卓・座席、レイアウト編集のブロック等。押せる面そのものが 1 つの button で、consumer の pointer / key ハンドラと aria-* が同じ要素に付く。",
+      "variants": {
+        "shape": [
+          "rounded",
+          "circle"
+        ]
+      },
+      "accessibility": [
+        "1 つの <button>。名前は中身か aria-label。selected 指定時は aria-pressed（未指定なら付けない）",
+        "movable の間は矢印キー（↑ ↓ ← →）で onMove を呼び preventDefault。consumer の onKeyDown が preventDefault したら呼ばない",
+        "moveInstructions は button の中に hidden で描画して aria-describedby で結ぶ（名前には入らない。consumer の aria-describedby と連結）。非推奨の aria-grabbed / aria-dropeffect は使わない",
+        "タップ領域は 44px 以上（min-h-11 / min-w-11）。focus-visible は 3px のリング"
+      ],
+      "rules": [
+        "選択・移動するタイルを Button unstyled / Card selected + className で自作しない（Card の押せる面は内側の button でハンドラ・aria-describedby が乗らない）",
+        "ドラッグ＆ドロップ自体（pointer capture・落とし先の判定）は consumer が onPointerDown 等で実装し、dragging で見た目だけ渡す",
+        "大きさは className で渡す（円形は size-12 等）。selected の面・枠は Card / ActionTile と同じトークンで、枠の太さは内側の outline（focus-visible の外側 ring と両立）",
+        "native は未提供（INTENTIONAL_NATIVE_GAPS）"
+      ]
     }
   ],
   "commerce": [
@@ -2955,10 +3022,12 @@
         "--Nav-Item-Min-Height / --Nav-Center-Action-Size は max(44px, var(...)) で参照するため、44px（HIG のタップ領域下限）より縮まない。",
         "--Nav-Center-Action-Surface / -Border / -Shadow と --Nav-Selected-Surface / -Shadow は宣言したときだけ DS 既定（.glass-accent / ガラスの選択プラッター）を置き換える。未宣言なら tone / dark の出し分けは DS 側が持つ。",
         "--Nav-Pill-* の寸法が効くのは prominent レイアウト（showLabels か centerAction がある pill）。アイコンのみの compact pill は契約外で固定。",
-        "bottomOffsetExtra（CSS の長さ）は safe-area・pill の 12px・lift の持ち上げ量に加算される。className の bottom-* で位置を上書きしない（issue #681）"
+        "bottomOffsetExtra（CSS の長さ）は safe-area・pill の 12px・lift の持ち上げ量に加算される。className の bottom-* で位置を上書きしない（issue #681）",
+        "既定挙動の変更（issue #700・次のリリースで告知）: keyboardBehavior=\"hide\" を明示したとき（既定はstay）は、キーボード検知に加え、タッチ主体の端末（(pointer: coarse) and (hover: none)）でテキスト入力欄にフォーカスがある間も隠れる。隠れている間は invisible でフォーカスも受けない。従来どおり常に出したいときは keyboardBehavior=\"stay\" でオプトアウトする。物理キーボード接続はpointer/hover能力から判別できないため、フォーカスによる先行非表示だけを止めるときは hideOnInputFocus=false（viewport検知は維持）。consumer の html:has(input:focus) で隠す CSS は不要"
       ],
       "props": {
-        "navLabel": "string (既定 \"メインナビゲーション\") — nav 要素の aria-label（issue #428）"
+        "navLabel": "string (既定 \"メインナビゲーション\") — nav 要素の aria-label（issue #428）",
+        "hideOnInputFocus": "boolean（既定 true）— keyboardBehavior=\"hide\" のとき、タッチ主体端末の入力フォーカスでも隠す。false なら viewport のキーボード検知だけを使う。pointer/hover能力から物理キーボード接続は判別できない"
       },
       "slots": [
         "bottom-nav-pill",
@@ -2995,14 +3064,18 @@
         "寸法・面の上書きは BottomTabBar と同じ --Nav-* を使う（MobileTabBar は薄いラッパーなので変数はそのまま効く。issue #471）",
         "[data-global-nav-add-icon] は belle-todo 互換の後方互換フックで公開契約ではない。中央アクションのアイコンは data-slot=\"bottom-nav-center-action-icon\" で狙う（issue #471）",
         "keyboardBehavior（hide 既定 / lift / stay）を BottomTabBar へ素通しする。キーボード表示中にタブバーを隠す CSS を consumer に書かない（issue #681）",
-        "bottomOffsetExtra（CSS の長さ）で画面下の広告バナー等の高さぶん持ち上げる。MobileAppShell の bottomPaddingExtra・MobileFloatingActionButton の bottomOffsetExtra に同じ値を渡す（issue #681）"
+        "bottomOffsetExtra（CSS の長さ）で画面下の広告バナー等の高さぶん持ち上げる。MobileAppShell の bottomPaddingExtra・MobileFloatingActionButton の bottomOffsetExtra に同じ値を渡す（issue #681）",
+        "既定挙動の変更（issue #700・次のリリースで告知）: keyboardBehavior=\"hide\"（既定）は、キーボード検知に加え、タッチ主体の端末（(pointer: coarse) and (hover: none)）でテキスト入力欄にフォーカスがある間も隠れる。隠れている間は invisible でフォーカスも受けない。従来どおり常に出したいときは keyboardBehavior=\"stay\" でオプトアウトする。物理キーボード接続はpointer/hover能力から判別できないため、フォーカスによる先行非表示だけを止めるときは hideOnInputFocus=false（viewport検知は維持）。consumer の html:has(input:focus) で隠す CSS は不要"
       ],
       "productTheme": [
         "--Nav-Pill-*",
         "--Nav-Item-*",
         "--Nav-Center-Action-*",
         "--Nav-Selected-*"
-      ]
+      ],
+      "props": {
+        "hideOnInputFocus": "boolean（既定 true）— keyboardBehavior=\"hide\" のとき、タッチ主体端末の入力フォーカスでも隠す。false なら viewport のキーボード検知だけを使う。pointer/hover能力から物理キーボード接続は判別できない"
+      }
     },
     {
       "name": "FilterBar",
@@ -3193,7 +3266,9 @@
         "For admin/dashboard pages",
         "mainId は同一ページ内で一意にする。skipLink=false で内蔵 SkipLink を無効化できる",
         "header と main の既定 gutter は内蔵 Container が担うためページ側で外周 padding を重ねない",
-        "暗色サイドバーは sidebarTone=\"inverse\"（aside を Surface-Inverse にする）。中のナビは SidebarNav tone=\"inverse\"、ロゴ・フッターの文字も Text-on-Inverse 系にする（issue #680）"
+        "暗色サイドバーは sidebarTone=\"inverse\"（aside を Surface-Inverse にする）。中のナビは SidebarNav tone=\"inverse\"、ロゴ・フッターの文字も Text-on-Inverse 系にする（issue #680）",
+        "lg 未満でナビへ辿れるようにするときは mobileDrawer（issue #705）。ヘッダー左端のメニューボタン（44px・aria-expanded・aria-label 既定「メニューを開く」）から左の Sheet に同じ sidebar を開く。ハンバーガーと Sheet side=\"left\" を consumer で自作しない",
+        "ドロワー内のリンク（a[href]）と SidebarNav の項目を押すと閉じる（closeMobileDrawerOnNavigate 既定 false、明示 true で有効）。開閉の制御は mobileDrawerOpen / onMobileDrawerOpenChange"
       ]
     },
     {

package/contracts/product-theme-overrides.json

@@ -145,6 +145,7 @@
       "--Product-Card-Padding",
       "--Product-Card-Gap",
       "--Product-Page-Padding-Y",
+      "--Container-Gutter-Fluid",
       "--Space-Section-xs",
       "--Space-Section-sm",
       "--Space-Section-md",
@@ -177,6 +178,8 @@
       "--Nav-Pill-Specular",
       "--Nav-Item-Min-Height",
       "--Nav-Item-Gap",
+      "--Nav-Item-Height",
+      "--Nav-Item-Label-Offset-Y",
       "--Nav-Center-Action-Size",
       "--Nav-Center-Action-Radius",
       "--Nav-Center-Action-Surface",
@@ -233,7 +236,8 @@
     "--card-surface",
     "--Nav-",
     "--Toast-",
-    "--Safe-Area-"
+    "--Safe-Area-",
+    "--Container-"
   ],
   "namespaceNote": "P049 が「DS の変数を上書きしている」と判定する接頭辞。ここに該当し、かつ DS 自身の CSS（src/preset.css / src/styles/*.css / src/themes/*.css）に実在し、allowedVariables に無い変数を消費側 CSS が宣言していたら契約違反。接頭辞は一致するが DS に実在しない名前（消費側が DS の命名に寄せて作った独自変数。例: --Surface-Inverse-Hover）は上書きではないので対象外（issue #377）。DS の CSS が読めない環境では接頭辞一致だけで判定する。shadcn 互換の小文字ブリッジ（--primary / --border 等）は消費側アプリが同名変数を持つことがあるため対象外。",
   "wiredComponents": {
@@ -278,6 +282,12 @@
     "AdminShell": [
       "--Product-Page-Padding-Y"
     ],
+    "Container": [
+      "--Container-Gutter-Fluid"
+    ],
+    "ChipFilterBar": [
+      "--Container-Gutter-Fluid"
+    ],
     "BottomTabBar": [
       "--Nav-Pill-*",
       "--Nav-Item-*",

package/contracts/token-hex-cache.json

@@ -1,7 +1,7 @@
 {
   "meta": {
     "name": "KSK Design System — Semantic Token Hex Cache",
-    "version": "2.12.0",
+    "version": "2.14.0",
     "description": "semantic / semanticDark トークン（var(--Primitive-*) 参照）を実 hex に解決したサイドカー生成物。hex はデフォルト（Blue）テーマでの解決値であり、Brand 系（meta.themeDependentKeys に列挙）はテーマ差し替え（orange/green/violet 等）で実色が変わる。テーマ別の完全解決値は `ksk-design-system/native` エクスポート（バンドル済み native トークンモジュール）の themes を参照。tokens.json 本体のスキーマは変更せず、AI がこのファイルだけで実色を把握できるようにし、primitive 値の変更による semantic 実色のドリフトを --check で機械検出する。",
     "generatedBy": "scripts/generate-token-hex-cache.mjs",
     "theme": "default",

package/dist/class-names.js

@@ -1,2 +1,2 @@
-import { i as e } from "./server-variants-B2IA1PnQ.js";
+import { a as e } from "./server-variants-BcYqqYwM.js";
 export { e as buttonVariants };