Docs resource

CHANGELOG

GunjoUI のバージョンごとの変更履歴と公開前マイルストーンの記録です。

GunjoUI の変更履歴。フォーマットは Keep a Changelog に概ね準拠し、バージョニングは docs/versioning.md のポリシーに従う。

採用先影響度の表記：

  • ⁠none⁠ — 既存採用先のコードに変更不要
  • ⁠minor⁠ — git grep で機械的に置換可能
  • ⁠breaking⁠ — 構造変更が必要

[Unreleased]

採用先向けの要約（見た目が変わるもの）

コードを直さなくても、依存を上げると部品の余白とアイコンの大きさが変わる（部品のファイル 120 個）。公開 API（部品・props・export・トークン名）は変わらない。

  1. ⁠余白・並びの間・大きさを 4px の倍数にそろえた⁠：6px の間は 8px に、2px の間は 4px になる。題と説明の間や、ラベルと入力の間で、縦が 2〜4px 伸びる。1行の行とバッジの高さは保った（メニューの項目は 32px、バッジは 20px のまま）。
  2. ⁠14px のアイコンを 16px にした⁠：text-xs のバッジの中だけは 12px にした。
  3. ⁠4つの部品は大きさが変わる⁠：MapControlButton の sm、Tooltip、PlacePanel の閉じる釦、SegmentedControl の sm。
  4. ⁠outline の部品に背景と濃い枠が付く⁠：前の枠は、どの面の上でもほぼ見えなかった。
  5. ⁠入力欄に背景が付き、使えない状態の見せ方が変わる⁠：使える欄は白い面（dark はカードの色）になる。使えない欄は灰の面・薄い枠・薄い字になる。

Added

  • ⁠4px グリッドの検査 npm run design:verify:grid4⁠（影響: ⁠none⁠）：部品のクラスと、アイコンの size={N} を読む。gap・space・padding・margin・位置・大きさが 4 の倍数でなければ落とす。例外は、12px 未満の線・点・目盛りと、4px 未満の位置ずらし（中心合わせ）だけ。design:verify に含まれる。(#1057)

Changed

  • ⁠outline の部品に背景と濃い枠を付けた⁠（影響: ⁠none⁠・見た目が変わる）(#1067)

    • 対象：Button・Toggle・ToggleGroup・Badge・Tag の outline。
    • 背景を透明から bg-card に、枠を --border から --input にした。
    • 枠と面の比は、light 1.03〜1.24:1 から 3.05〜3.99:1 に、dark 1.00〜1.37:1 から 2.81〜4.80:1 になる。dark の --secondary の上だけ 3:1 に届かない。

  • ⁠入力欄に背景を付け、使えない状態の見せ方をそろえた⁠（影響: ⁠none⁠・見た目が変わる）(#1067)

    • 対象：Input・Textarea・Select・SearchInput・PasswordInput・NumberInput・CurrencyInput・PhoneInput・PostalCodeInput・ScanInput・TagInput・Mention・TimePicker・InputOTP・ChatInput・Checkbox・RadioGroup の外枠。
    • 使える状態：背景を透明から bg-card にした。枠 --input は変えていない。
    • 使えない状態：bg-muted、枠は --input の 40%、字は text-muted-foreground。部品ごとに違っていた全体の不透明度（50%・40%・70%）は下げない。

  • ⁠部品を 4px グリッドにそろえた⁠（影響: ⁠none⁠・見た目が変わる）(#1057)

    • ⁠大きさが変わる4部品⁠：
      • MapControlButton の sm：34px から 40px（アイコンは 17px から 16px）
      • Tooltip：上下の余白が 6px から 4px になり、高さが 32px から 28px になる
      • PlacePanel の閉じる釦：44px から 48px（見出しの行の高さは変わらない）
      • SegmentedControl の sm：区分が 28px から 24px（溝は 32px のまま）
    • ⁠地図の部品⁠：
      • MapStatusCorner の外余白：横 14px・上 10px から、どちらも 12px
      • LayerMenu：行の間が 10px から 8px、外枠の余白が 6px から 4px
      • TimeTransport・DayBand の間：6px から 8px
      • TimelineScrubber の針の上端：18px から 20px
    • ⁠メニューの項目⁠：高さ 32px を min-h-8 で決め、上下の余白を 6px から 4px にした。アイコンの箱は 14px から 16px にした。
      • 対象：DropdownMenu・ContextMenu・Menubar・Command・Mention・TreeView
    • ⁠Badge・Kbd・Tag の横の余白⁠：
      • Badge：10px から 8px
      • Kbd：6px から 4px
      • Tag の sm：6px から 8px
      • Tag の lg：10px から 12px
    • ⁠ToolPill⁠：余白を 6／10／14px から 8／8／12px にした。アイコンは 14／18／22px から 16／20／24px。
    • ⁠Code⁠：インラインのコードの余白を、横 6.4px・上下 2.4px から、横 4px・上下なしにした。Markdown の中のコードと同じ形。
    • ⁠NumberInput の増減の釦⁠：前は 18px＋罫 1px＋18px で、入力の 36px から 1px はみ出していた。いまは入力の高さを半分ずつ分ける。
    • ⁠アイコンを1行目の字の中心に置く部品⁠：mt-0.5 で 2px ずらす作りをやめ、1行目の高さの箱に置く作りにした。
      • 対象：SafetyBanner・CheckboxCard・RadioCard・Itinerary・MetadataList・Timeline・PasswordRequirementList など

  • ⁠--space-0-5・--space-1-5・--space-2-5・--space-3-5・--space-px に「細部専用」と注記した⁠（影響: ⁠none⁠）：線・点・中心合わせに使い、余白には使わない。public/tokens.css の行末と /docs/spacing の表に出る。(#1057)

Fixed

  • ⁠改行できない長い語が、狭い画面でページを横に押し広げていた⁠（影響: ⁠none⁠）：MarkdownRenderer は break-words をインラインのコードから外側の要素に移した。地の文の中で / でつないだ英字（List/Item/Trigger/Content など）も折り返す。Code にも同じ break-words を付けた（Markdown の中のコードと同じ形）。どちらも1行に入りきらない語のときだけ効くので、ふだんの見た目は変わらない。/docs/changelog は 375px で 86px はみ出していた。(#1065)

[0.2.0-beta.1] — 2026-10-11

0.1.0-beta.4 以降の変更。⁠破壊的変更が2件⁠（どちらも影響 ⁠minor⁠＝import の書き換えと依存の追加で済む）あるので、真ん中の数字を上げた。見た目の変更は無い。

採用先向けの要約（書き換えが要るもの）

  1. ⁠表・カレンダー・ドロワー・カルーセル・Markdown・FloatingPanel を @gunjo/ui から読んでいる場合⁠は、それぞれの入口（@gunjo/ui/table など）に書き換え、その依存を自分で入れる。下の「Removed」の表のとおり。書き換え忘れは型検査、依存の入れ忘れはバンドラが止める。
  2. ⁠AIChatInput・AIChatMessage を使っている場合⁠は、ChatInput・ChatMessage に名前を書き換える。
  3. どちらも使っていなければ、書き換えは要らない。root の入口だけを使う採用先は、入る依存が減る（空のプロジェクトで 202 → 146 パッケージ）。

Removed

  • ⁠⚠️ 破壊的変更：重いライブラリを使う9部品を root（@gunjo/ui）の入口から外し、その依存8つを optional peer にした⁠（影響: ⁠minor⁠）— Button だけを使う採用先にも @tanstack/react-table などが入っていた（#492）。9部品は 0.1.0-beta.2 から出していた subpath（@gunjo/ui/table など）からだけ import できる。root から import しても重い依存を解決しに行かないので、使わない部品の依存は入れなくてよくなる（空のプロジェクトに root だけ入れた実測で、入るパッケージ 202 → 146・node_modules 188.6MB → 146.7MB。2026-10-11）。

    • 移行手順：⑴ 下の表のとおり import の入口を書き換える。⑵ 使う入口の依存を npm install する（optional peer は自動では入らない）。部品の props・見た目は変わらない。

      部品・型書き換え先入れる依存
      DataTable・ActionDataTable・型 ColumnDef・DataTableProps など@gunjo/ui/table@tanstack/react-table
      Calendar・DatePicker・DateRangePicker@gunjo/ui/calendarreact-day-picker・date-fns
      Drawer・DrawerContent などの Drawer*@gunjo/ui/drawervaul
      Carousel・CarouselContent などの Carousel*@gunjo/ui/carouselembla-carousel-react
      MarkdownRenderer@gunjo/ui/markdownreact-markdown・remark-gfm
      FloatingPanel@gunjo/ui/motionframer-motion
      // 前
import { Button, DataTable, type ColumnDef } from "@gunjo/ui";
// 後
import { Button } from "@gunjo/ui";
import { DataTable, type ColumnDef } from "@gunjo/ui/table";

      書き換え忘れは型検査で Module '"@gunjo/ui"' has no exported member 'DataTable' として出る。依存の入れ忘れはバンドラが Can't resolve '@tanstack/react-table' で止める。

    • 採用先3つ（2026-10-11 に既定の枝を読んで確認）：4px-hq-dashboard は DataTable と型 DataTableProps の2つを書き換え、@tanstack/react-table を入れる。design-qa（TooltipProvider だけ）と uixhero（npm から読んでいない）は書き換え不要。

  • ⁠⚠️ 破壊的変更：AIChatInput・AIChatMessage を export から外した⁠（影響: ⁠minor⁠）— 中身は ChatInput・ChatMessage の別名の再 export だけで、デザインソース・metadata・docs を持たない部品だった。採用先3つ（4px-hq-dashboard・design-qa・uixhero）では使われていない（2026-10-11 に各リポの既定の枝を読んで確認）。

    • 移行手順：名前を書き換えるだけ。props も見た目も同じ。

      外した名前書き換え先
      AIChatInputChatInput
      AIChatInputProps（型）ChatInputProps
      AIChatInputLabels（型）ChatInputLabels
      AIChatMessageChatMessage
      AIChatMessageProps（型）ChatMessageProps
      AIChatMessageRole（型）ChatMessageRole
      AIChatMessageLabels（型）ChatMessageLabels

      git grep -lE 'AIChat(Input|Message)' | xargs sed -i '' -E 's/AIChat(Input|Message)/Chat\1/g'（macOS の sed。GNU sed は -i '' を -i に）で置き換えられる。

Fixed

  • ⁠Server Component からの root の import で next build が落ちるという報告（#684）に、毎回の確かめ方を作った⁠（影響: ⁠none⁠）— 報告は 0.1.0-beta.1・Next.js 16.2.10（Turbopack）で app/layout.tsx から import { TooltipProvider } from "@gunjo/ui" すると TypeError: createContext is not a function になる、というものだった。2026-09-22 と 2026-10-11 に試したが、報告された版でも再現しなかった。CI で変更のたびに、npm pack した tarball を空の Next.js アプリ（重い部品の依存は入れない）に入れ、その形で Turbopack と webpack の両方で next build する検査（npm run lib:check:rsc-consumer）を回す。/docs/installation・/docs/adoption の「未解消」の注意書きを、この検査の説明に書き換えた（回避シムは「それでも出たら」として残した）。(#684)
  • ⁠素の Node（バンドラを通さない読み込み）で import("@gunjo/ui") が ERR_MODULE_NOT_FOUND になっていた⁠（影響: ⁠none⁠）— dist/ の相対 import に拡張子が無かった（./components/inputs/Button など）。ビルドの最後に .js を付けるようにした（.d.ts も同じ）。Vitest・Jest を Node の解決で動かすテスト、自前の SSR、TypeScript の moduleResolution: "nodenext" から読めるようになる。バンドラ（Next.js・Vite・esbuild など）経由の採用先はコードも出力も変わらない（esbuild で束ねた結果は前後でバイト単位で同じ）。CI で dist/ の全 subpath を素の Node で読み込む検査（npm run lib:check:node-esm）を回す。(#717)

[0.1.0-beta.4] — 2026-10-10

0.1.0-beta.3 以降の変更。⁠破壊的変更（breaking）なし⁠。公開 API（部品・props・export・トークン名）の削除・改名もない。全3項目とも影響 ⁠none⁠。

採用先向けの要約（見た目が変わるもの）

コードを直さなくても、依存を上げると次の2点で画面の見た目が変わる。

  1. ⁠dark の地・文字・薄い面・枠・控えめな文字が、わずかに群青寄りになる⁠ — 地が少し青く、文字の白が少し落ち着く。light は変わらない。前の値に戻したい場合は、採用先の CSS で .dark { … } の変数を上書きすれば戻る（下の「Changed」に前後の値）。
  2. ⁠数字を並べる部品（Table・DataTable・Badge とグラフのカード）の数字が等幅になる⁠ — 表の数値・日付・件数の桁が上下でそろう。数字の幅が少し変わるので、狭い列で数字が折り返していないかを一度確かめてほしい。

Changed

  • ⁠npm の説明文の状態の言葉を beta に⁠（影響: ⁠none⁠）— package.json の description の Early alpha: API may change. を Beta: API may change before 1.0. にした。版の名乗り（0.1.0-beta.x）と食い違っていたため。(#1048)

  • ⁠数字を並べて見せる部品の数字を等幅に⁠（影響: ⁠none⁠・見た目が変わる）— Table・DataTable・Badge・AnalyticsCard・HeatmapChart・DonutChart・GaugeChart・RadialBarChart・MiniDistributionBarCard・LabeledDonutCard・ConcentricProgressCard・SegmentedGaugeCard・SegmentTimelineCard の根の要素に tabular-nums を付けた。表の数値・日付・件数・バッジの数の桁が上下でそろう（数字の幅が少し変わる。文字には効かない）。npm run design:verify:tabular-nums が見張る。(#1040)

  • ⁠dark の中立色5つを群青寄りに⁠（影響: ⁠none⁠・見た目が変わる）— --background 222.2 84% 4.9% → 230 88% 6.5%、--foreground（と --card-foreground・--popover-foreground・--secondary-foreground）210 40% 98% → 230 30% 90.5%、--muted と --border 217.2 32.6% 17.5% → 230 20% 18%、--muted-foreground 215 20.2% 65.1% → 230 16% 67%。もとは shadcn/ui v3 slate の既定と同じ値だった。shadcn と Tailwind の既製の色から CIEDE2000 で 3.3 以上離した。面の段差はほぼ同じ。文字は白の近くに既製の色が密集しているので少し暗くなる（地の上で 19.09:1 → 15.45:1）。前の値に戻したい場合は、採用先の CSS で .dark { … } の変数を上書きすれば戻る（トークン名は変えていない）。(#1040)

[0.1.0-beta.3] — 2026-09-25

0.1.0-beta.2 以降の変更。⁠構造変更を要する破壊的変更（breaking）なし⁠。公開 API（部品・props・export・トークン名）の削除・改名もない。新しい部品と props はすべて opt-in（影響: none）。影響 ⁠minor⁠ は左端の色帯をやめた4部品（公開 API は不変）。

採用先向けの要約（見た目が変わるもの）

コードを直さなくても、依存を上げると⁠画面の見た目が変わる⁠。上げたあとに一度目で確かめてほしい点は次の4つ。

  1. ⁠枠線をやめて面で区切った⁠（#1024 / #1027 / #1030 / #1033）— Card・Dialog・Popover・Badge・Sidebar など、塗りのある部品の 1px の枠を透明にし、区切りは親の面との濃淡だけにした（枠の幅は残すのでレイアウトはずれない）。ハイコントラスト（prefers-contrast: more・Windows の forced-colors）では枠が戻る。表の罫線・outline の Badge など、枠そのものが意味の部品は据え置き。
  2. ⁠light の地が白から淡い灰青に⁠（#1024）— --background が 0 0% 100% → 210 40% 96%（#f1f5f9）。--card は白のままなので、カードが地から浮いて見える。あわせて --muted・--secondary・淡色5つ（--*-subtle）を濃くした。dark は --card・--popover・--secondary・--info-subtle・--destructive-subtle を明るくした（#1022 / #1027 / #1034）。
  3. ⁠入力欄の縁 --input を、どの面の上でも 3:1 に⁠（#1034）— light 214 32% 91% → 215 20% 52%・dark 217.2 32.6% 17.5% → 215 20% 51%。入力欄の縁がはっきり濃くなる。border-input / bg-input を入力欄以外（飾りの線・溝など）に流用している採用先の画面は、線が濃く見えるので確かめてほしい（Slider / RangeSlider の溝は --muted に移した）。
  4. ⁠自前の画面で bg-background と枠線だけで区切っていた箇所⁠は、地の色が変わるので段差を確かめてほしい。前の値に戻したい場合は、採用先の CSS で :root { --background: 0 0% 100%; } のように変数を上書きすれば戻る（トークン名は変えていない）。

Added

  • ⁠portalContainer を5部品に追加⁠（影響: ⁠none⁠）— NotificationCenter・ChatInput（選択肢のポップオーバーとモデルのメニュー）・Combobox・DatePicker・DateRangePicker が、ポップアップを出す先の要素を受け取れるようになった（既定は従来どおり document.body）。枠のあるプレビューの中にポップアップを収めたいときに使う。(#1005)

  • ⁠ハイコントラスト時の枠線と、面で区切るクラス .gunjo-surface⁠（影響: ⁠none⁠）— @media (prefers-contrast: more) のとき --border と --input を 3:1 以上へ上げる（light 215 20% 40%・dark 215 20% 55%）。新しいトークン名は足さず、既存の2つを差し替えるだけ。public/tokens.css（@gunjo/ui/tokens.css）にも同じブロックを入れた。.gunjo-surface（bg-card ＋透明な 1px の枠・ハイコントラストで --border・forced-colors で CanvasText に戻る）は @gunjo/ui/styles に入っているが、部品の中では使っていない（部品は要素ごとに border-transparent contrast-more:border-border forced-colors:border-[CanvasText] を書く形）。(#1022 / #1024 / #1034)

  • ⁠RangeBar⁠（影響: ⁠none⁠）— 全体の幅（min〜max）の中で、区間（low〜high）がどこにあるかを1本の帯で見せる Display 部品。週間予報の最低〜最高気温、プランごとの価格帯、拠点ごとの営業時間など、⁠並べる行が同じ min / max を持つ⁠ことで位置で比べられる。数字は帯の外に呼び出し側が置く。variant="gradient" は⁠全体に1本の色の段（primary → info → warning）を敷いて区間の部分だけを見せる⁠＝同じ値はどの行でも同じ色（区間ごとにやり直すと行ごとに色が変わるため）。solid は主色。両端が同じでも帯の高さぶんの点を出し、null のあいだは下地だけ。role="img" で「気温: 20°–28°」と読む。HTML/CSS（SVG なし）。Meter（0から1つの値）・DistributionBar（構成比）・RangeSlider（入力）では描けない形のため新設。(#998)

  • ⁠MapStatusCorner⁠（影響: ⁠none⁠）— 地図の右上に、いま何を見ているか（視点・昼夜・雲の時刻・地形の出どころ・倍率）を短い行で重ねる Display 部品。⁠左上の字（lead）を float で浮かせ、行は1行ずつ折らない塊にする⁠＝細い画面では、入りきらない行が左の字の下へ回り、左の字と並ぶのは頭の1〜2行だけになる（左右2列の flex だと、行ごと押し出されたり語の最後の1字が落ちたりする）。startInset で左に方位磁針などの場所を空ける。字は地図の上の字の段 text-canvas-2xs（特例のページ /docs/exceptions・canvas-text-allowlist.json に追加）に縁取り。ポインタを受けず、下の地図はそのまま動かせる。(#998)

  • ⁠TimelineScrubber⁠（影響: ⁠none⁠）— 過去（実測）から未来（予測）までを1本の目盛りで行き来する Inputs 部品。⁠中央の印は動かず、目盛りのほうが動く⁠（ドラッグは相対・touch-action: pan-y・目盛りを押すとそのコマへ・両端はぼかす）。lastObservedIndex で実況と予報を分け、⁠札の語（Badge）・境目の点線・色の3つで示す⁠（色だけにしない）。再生は stepInterval ごとに1コマ進み、最後で止まる（playing は制御・非制御の両方）。時計は持たず、持つのは再生のタイマーだけ＝「いま」は呼び出し側が決める（TimeTransport と同じ決まり）。role="slider" で矢印・PageUp / PageDown・Home / End、読み上げは「11:05 · 予報」。まだ届いていないコマ（pending）は薄く描く。(#998)

  • ⁠待ちの表示を3つ追加：ProgressDialog・ActionProgress／FormActionProgress・RouteProgress⁠（影響: ⁠none⁠）。3つとも、本当の進み具合が分からないときは％を出さない（Progress の indeterminate を使う）。prefers-reduced-motion: reduce（または祖先の data-motion="reduce"）では流れが止まり、淡い色の帯になる。ダイアログの2つは、portalContainer を渡すとその中に並べて描く。(#996)

    • ProgressDialog（Overlay）：数十秒以上かかる処理の待機画面（Dialog を合成）。16:9 の差し替えできる絵（media）、いまの状態を伝える一文（status）、自由に中身を入れられる補助の枠（aside）、キャンセルのボタン（onCancel）を持つ。variant="overlay" で札（badge）と題を絵の上に重ねる。Esc・外側のクリック・閉じるボタンでは閉じず、閉じるのは呼び出し側のコード。value／max を渡したときだけ割合でバーが伸びる。
    • ActionProgress（Feedback）：保存や送信のような短い処理のあいだ、画面を塞ぐ小さなダイアログ。既定で 350ms 待ってから出し、出たら 500ms は消さない（delayMs／minVisibleMs）。FormActionProgress は、置かれた form の送信中を React 19 の useFormStatus で読む。
    • RouteProgress（Feedback）：ページの移動中に画面の上端へ出す細いバー。フレームワークに依存しない。placement="container" で、位置指定した親要素の上端にも置ける。
    • LocaleProvider の翻訳文字列に cancel／loading を追加した。

  • ⁠Progress に indeterminate を追加⁠（影響: ⁠none⁠）。本当の進み具合が分からないとき、短い帯が流れる表示にする。aria-valuenow／aria-valuemax を出さないので、スクリーンリーダーが架空の割合を読まない。スタイルは @gunjo/ui/styles（globals.css）に入っている。(#996)

  • ⁠地図・canvas の上に重ねる字の段 text-canvas-sm / text-canvas-xs / text-canvas-2xs⁠（11 / 10 / 9.5px・影響: ⁠none⁠）— text-xs（12px）より小さい3段。⁠地図・canvas・画像の上に重ねる字だけ⁠に使う（縮尺バーの「20 km」、地図の上のボタンの印、レイヤーのメニューの組の見出し）。ほかの画面の字の段は変えない（2026-09-19 KeEem 決定）。本文の段を下に伸ばすのではなく、⁠用途を名前に載せた別の段⁠にした＝text-2xs のような名前だと本文の下に使われてしまうため。値は rem（読み手の文字サイズ設定に追従）。宣言元は scripts/design-sync/token-scales.mjs の CANVAS_TEXT_STEPS で、Tailwind へは tailwind-theme-extend.cjs の fontSize（preset 経由で採用先にもユーティリティが出る）、標準版シート tokens.css へは --text-canvas-*。⚠️ src/globals.css には入れていない（#969 と同じ理由）。⁠使ってよいファイルは design/policy/canvas-text-allowlist.json に理由つきで列挙⁠し、それ以外で使うと design:verify:scale-tokens が落ちる。Typography の段には載せず、新設の ⁠特例のページ /docs/exceptions⁠（Tokens の下）の1件目として載せた＝通常の段とは別に、使う面を限って認めたものを並べる置き場。/docs/typography には「12px 未満は特例のページに載せたものだけ」と1行だけ書いた。(#994 / #976)

  • ⁠MapControlButton⁠（影響: ⁠none⁠）— 地図や canvas の上に浮かせる、アイコンだけの丸いボタンの Inputs 部品。寄る・引く・選んだ地点へ・現在地へ。後ろが紙面ではなく写真なので、半透明の地・背景のぼかし・細い縁を自分で持つ（Button の変種にしない理由）。状態は pressed（aria-pressed）・disabled と disabledReason（キーボードでも理由に届く）・status="busy"（アイコンが明滅・aria-busy・動きを減らす設定では止まる）・status="error"（注意の縁と ! の印）。⁠どれも色だけに載せない⁠。失敗の印を消す時計は持たない（呼び出し側が戻す）。大きさは default 44px・sm 34px（⁠下限⁠）・lg 48px。label が読み上げ名とツールチップを兼ねる。(#994)

  • ⁠ScaleBar⁠（影響: ⁠none⁠）— いまの縮尺を「20 km」の字と、その長さの線で見せる Display 部品。⁠倍率（×250）は出さない⁠。距離は 1・2・5 × 10ⁿ に丸め、端数は線の長さが引き受ける。丸めは純粋な関数 niceScale() として公開。metersPerPixel が null のあいだは「—」だけで線は出さない（推測しない）。字は text-canvas-2xs にページの地の色の縁取り。role="img" で「Scale: 20 km」と読まれる。(#994)

  • ⁠LayerMenu⁠（影響: ⁠none⁠）— 地図に重ねるものを組に分けて表示・非表示にする Inputs 部品。⁠タップで開き、長押し（既定 450ms）でまとめて消す／もう一度で元の組み合わせに戻す⁠＝画面が大きく変わる操作をタップに乗せない。同じ働きを先頭の「すべて」の行に置く（長押しを知らない人・キーボードのため）。「すべて」は⁠3態⁠（すべて表示・すべて非表示・一部だけ＝横棒・aria-pressed="mixed"）で、ほかの行と同じ印を持つ。いま切り替えられないもの（disabledReason）は行と状態を残して理由を一言出し、「すべて」も触らない。行を押しても閉じない。inline でボタンなしの一覧だけ（広い画面の横の欄に）。引き金は MapControlButton。(#994)

  • ⁠PlacePanel⁠（影響: ⁠none⁠）— 地図で選んだ1か所の詳細を、画面の下から出す Overlay 部品。⁠行は最初から全部出し、値だけを骨組みにして待つ⁠（値が届くたびに行を足すと欄がガタつき、地図まで動くため）。各値は undefined＝読み込み中・null＝取れなかった（「—」で確定し光らない）・それ以外＝値、の3態を値だけで言い分ける。aria-busy つき。⁠Sheet にしない⁠＝Sheet は後ろを止める面で、地図を動かせなくなる。置き場所は呼び出し側。2列にするかは欄自身の幅で決める（container query）。(#994)

  • ⁠LiveBadge⁠（影響: ⁠none⁠）— 「⁠これはいまの値です⁠」を示す小さな札の Display 部品。枠と言葉（既定 LIVE）と、ゆっくり明滅する点。実時間から外れているときは札を引っ込め、その場所で「⁠いつの値か⁠」（detached）を答える。detached が渡されていなければ⁠何も描かない⁠（いつの値か分からないのに札を残すと、古い値が現在の値に見えるため）。⭐ ⁠時計を持たず、何も比較しない⁠＝「いまの値か」は締切・再接続・バッファなど画面ごとの事情で決まるので、判断は呼び出し側（TimeTransport と同じ決まり）。⚠️ 状態を⁠色と点だけに載せない⁠（札には必ず言葉が乗り、点は飾り）。⚠️ ⁠動きを減らす設定（prefers-reduced-motion: reduce）では明滅しない⁠（点は残し、明滅だけを止める）。既定では⁠読み上げ領域にしない⁠＝role="status" を既定で付けると再接続のたびに読み上げへ割り込むため、必要な画面でだけ呼び出し側が付ける（#858 / #936 と同じ判断）。Badge を組んで作っているので枠・色・大きさの段は共通。⁠TimeTransport の実時間の札をこの部品に差し替えた⁠（同じ形の作り置きを2か所に残さないため。TimeTransport の公開 API は不変で、札に点が付くぶんだけ見た目が変わる）。鮮度の話でない状態は Badge、締切までの残りは ExpiryBadge、値を動かすなら TimeTransport。(#981)

  • ⁠DayBand⁠（影響: ⁠none⁠）— 1日を1本の帯にして「1日の中の位置を、面で見せる」ための Inputs 部品。時間帯（phases[]）を面で敷き、節目（marks[]）を線と文字で置き、「いま」（now）とつまみ（value）を重ねる。⭐ ⁠1日について何も計算しない⁠（日の出・日の入も「いま」も呼び出し側が渡す数）ので、天文にも暦にも縛られず、当番表・稼働時間帯・営業時間に同じ形が使える。時計も持たない（TimeTransport / Stringline と同じ決まり）。TimeTransport の scrubber スロットに入る面はこれ。時間帯の色はトーン名を ⁠面のトークン⁠（--*-subtle）へ解決する＝時間帯は下地で、その上に印とつまみが乗るため。空のような絵としての色は任意の CSS 色で渡せる。掴んで動かす作法は2つ（scrub="absolute" は触った位置がそのまま時刻／"relative" は掴んだ距離ぶんだけ動き、0時をまたいで帯の外の値も返す）。指で触ったときは押した瞬間には確定せず、動かしたときか離したときに確定する（縦スクロールの誤爆を防ぐ・touch-action: pan-y）。role="slider" で矢印・Shift＋矢印・PageUp / PageDown・Home / End が効き、読み上げには時刻と⁠時間帯の名前⁠が乗る（「10:40 · 昼」）ので、色だけに意味が載らない。印のラベルは帯の上、時刻の数字は帯の下の別の行に置き、ぶつかるラベルは後から宣言されたほうが文字を落とす（線は残る）。触れる帯の高さは 44px（size="sm" は 24px の見せるだけ用）。任意の区間なら SegmentTimelineCard、複数の日なら WeekView / ScheduleGrid、ただ値を選ぶだけなら Slider。(#979)

  • ⁠TimeTransport⁠（影響: ⁠none⁠）— 連続した値を「段階つきで動かし、いまへ戻る」ための Inputs 部品。大きい表示・再生と一時停止・名前をつけた速さの段（speeds[]）・符号つきの飛ばし（jumps[]）・実時間かどうかの札・ひと押しの「いまへ戻る」を1枚にまとめる。⭐ ⁠時計を内側に持たない⁠（value を受け取り onValueChange で返すだけ）ので、サーバと最初のクライアント描画が一致し、試験で時間を止められる（Stringline と同じ決まり）。速さは倍率の連続値ではなく呼び出し側が名前をつけた段＝「1× が1秒なのか1日なのか」は部品には決められないため。実時間かどうかは now から導き（live で上書き可）、色だけには載せず必ず文字の札で言う。now も live も無いときは札も「いまへ戻る」も出さない（推測しない）。触れるところは 44px。掴んで動かす面は scrubber スロットで受ける。ログの再生・監視画面の巻き戻し・シミュレーションの時刻送りに使う。値を選ぶだけなら Slider、絶対の時刻なら TimePicker / DatePicker、時間を見せるだけなら Timeline / Stringline / Gantt。(#977)

  • ⁠tokens.css に余白と字の段階⁠（影響: ⁠none⁠）— npm も CDN も使えない環境向けの標準版シート public/tokens.css（@gunjo/ui/tokens.css / https://www.gunjo.jp/tokens.css）に、これまで入っていなかった余白 --space-*・字 --text-* / --leading-* / --font-weight-*・文字種 --font-sans / --font-mono / --font-mincho・密度の決まり --control-h / --text-ui / --text-prose を追加。Tailwind を使わない採用先が docs の数値を手で写す必要がなくなる。⁠段階名は Tailwind と同じ⁠で --space-2 は 8px（gap-2 と同じ 2 段目）＝ 2px ではない。小数の段はハイフン（--space-0-5 = 2px・カスタムプロパティ名に素の . は置けないため）。⁠値は rem⁠ なので読み手のブラウザの文字サイズ設定に追従する（px は行末コメントで併記）。⚠️ これらの名前は Tailwind v4 が所有する名前空間なので ⁠src/globals.css には入れていない⁠（globals.css は base 層＝Tailwind の theme 層に後勝ちするため、書くと全採用先のユーティリティを書き換えてしまう。実測: html{font-size:20px} で .text-sm が 17.5px から 14px 固定に変わる）。既存の採用先の見た目は変わらない。段階は scripts/design-sync/token-scales.mjs が唯一の宣言元で、新しい design:verify:scale-tokens が ⁠Tailwind 本体の theme.css と突き合わせる⁠（上流がスケールを変えたら CI が落ちる）。/docs/spacing と /docs/typography の手写し配列も同じ生成表からの読み出しに変更。(#969)

  • ⁠StatusLevel⁠（影響: ⁠none⁠）— 順序のある段（平常運転＜遅延＜迂回＜運休、空いています＜やや混雑＜混雑、低＜中＜高＜緊急、good＜watch＜bad）を表す Display 部品。段は levels[] に軽い順で1回だけ書き、同じ配列がピルと並べ替え（compareStatusLevel）と全体の導出（highestStatusLevel）を動かすので、順序の書き写しが1か所に減る。段バーは意味トーンではなく前景色と枠線色の濃淡で描くため色を落としても段を数えられ（明色 13 対 230・実測）、読み上げには「4段階中 3段目」が乗る。順序のない状態は従来どおり Badge、工程の位置は Stepper / ApprovalSteps / RouteStops。純関数 statusLevelIndex / statusLevelStep / compareStatusLevel / highestStatusLevel を同梱。Badge の挙動と公開 API は不変。(#376)

  • ⁠StickyNoticeBar⁠（影響: ⁠none⁠）— サイト告知を body portal + fixed で上端または下端へ追従表示する Feedback 部品。edge は必須で既定値なし。同一 document の単一スロットに限定し、複数 mount 時は先着1件だけを表示して開発エラーを記録する。長文折り返し、アクション、44px の閉じるボタン、上下セーフエリア、ライト／ダークに対応。(#810)

Changed

  • ⁠SparklineChart に「いまの位置」と両端の札を追加⁠（影響: ⁠none⁠）— currentIndex で時間の軸の上の1点に点と細い縦線を置く（前後15日の線で今日がどこかを示す。referenceValue は値の高さの横線なので別物）。currentLabel はその点の読み上げ名。startLabel / endLabel で両端の下に小さな札（「15日前」「15日後」）を、線とは別の段に出す（線を縮めない）。点と縦線は HTML で重ねる。AnalyticsCard の中に入れれば、値＋一言＋小さな推移のカードになる。描画の土台を線の箱と札の段に分けたが、札を渡さなければ見た目は従来どおり。(#998)

  • ⁠StickyNoticeBar に字の見送り釦と、語の途中で折らない指定を追加⁠（影響: ⁠none⁠）— dismissText を渡すと × の代わりに字の釦（「見送る」）を出す＝時刻が迫ったときの知らせのように、見送ることも選択肢の1つである場合に使う（字がそのまま読み上げ名）。textWrap="phrase" は語の途中で折らない（word-break: keep-all ＋ overflow-wrap: anywhere）＝日本語は空白・句読点・<wbr> でだけ折れ、「出ま／す」にならない。既定は従来どおり anywhere。(#998)

  • ⁠Skeleton が動きを減らす設定で明滅しなくなった⁠（影響: ⁠none⁠）— prefers-reduced-motion: reduce のとき animate-pulse を止める（motion-reduce:animate-none）。PlacePanel の骨組みで使うため、#975 の1つ目だけを先に直した（値だけを骨組みにする形・読み上げの口は #975 に残る）。(#994 / #975)

  • ⁠ListCard の severity 表現を意味トークンの境界線＋淡い背景に変更⁠（影響: ⁠minor⁠）— 左端の色帯を廃止し、Alert / Banner と同じ意味トークンの境界線と淡い背景で重大度を補助する。状態の意味は従来どおり Badge と文言が担い、severity のプロパティ名・受け付ける値・型の公開方法は不変。

  • ⁠ActionQueue の severity 表現から左端の太い色帯を廃止⁠（影響: ⁠minor⁠）— 既存の全周の意味境界線＋淡い背景は維持し、Alert / Banner / ListCard と同じ面表現に統一する。重大度のアイコン・読み上げラベル・ソート順と公開 API は不変。

  • ⁠StatusBoard の tone 表現を意味トークンの境界線＋淡い背景に変更⁠（影響: ⁠minor⁠）— 左端の色帯を廃止し、tone ありのタイルは全周の意味境界線＋淡い背景、neutral / default は従来どおり素の境界線＋カード背景で表す。選択は ring、状態の意味は従来どおりアイコン＋ラベルが担い、公開 API は不変。

  • ⁠SidebarItem の祖先パス表現を文字の強調へ変更⁠（影響: ⁠minor⁠）— 左端の縦ピルを廃止し、onPath は font-medium と従来の文字色で示す。アクティブ項目自体の表現、階層・開閉・件数・操作と公開 API は不変。

  • ⁠枠をやめて面で区切る⁠（影響: ⁠none⁠・見た目が変わる）— 塗りのある面の 1px の枠を、border-transparent contrast-more:border-border forced-colors:border-[CanvasText] に置き換えた（src/components の 162 か所）。枠の幅は残すので、ハイコントラストで枠が戻ってもレイアウトはずれない。枠そのものが意味の面（表・格子の罫線、outline の Badge、Checkbox の checked、Switch など）は design/policy/surface-border-exclusions.json に理由つきで登録して据え置いた。枠を外すと親と同じ色で消える面は、先に塗りを上げた。(#1024 / #1027 / #1030 / #1033)

    • Dialog・AlertDialog・Drawer・ShareModal の本体、Header・Footer・Menubar・RightRail・PageAside・DocumentPager・InspectorPanel・DeviceFrame・ChatPanel・PageHeader・DesktopPageHeader、各テンプレートの上・横の欄：bg-background → bg-card（dark ではダイアログの本体が自分の幕とほぼ同じ色だった）
    • 半透明の bg-muted/10〜/60・bg-accent/40・bg-destructive-subtle/40（37 か所）：不透明の bg-muted などへ。DatePicker / DateRangePicker の footer も bg-muted
    • Sidebar：border-r ＋ bg-muted/40 → 透明な枠 ＋ bg-muted。Badge の塗りのある6つの variant：border-transparent（outline は据え置き）
    • チャートの内訳の行（ConcentricProgressCard・MiniDistributionBarCard・SegmentTimelineCard・SegmentedGaugeCard・LabeledDonutCard・ChartLegend）：選択を枠（border-foreground）ではなく bg-muted ＋ shadow-sm で示す。カードの中の行・小箱は bg-card → bg-background
    • 二重の印だった枠を外した：CheckboxCard・RadioCard・Carousel・PricingTemplate（ring が残る）、FilterChips・SeatMap（bg-primary が残る）
    • 入れ子で親と同じ色になっていた面（#1033）：ChoroplethMap・QuadrantMatrix の行は bg-muted、Table の器は bg-card の中では塗らない、選択中の TableRow・KanbanBoard の列の件数・FilterButton の件数・ListCard / StatusBoard / LineageGraph の調子の面の中の Badge は bg-background、TabsTrigger の中の bg-secondary は bg-card
    • DocumentPager：上の罫線を外した（前後のカードの面が境目を作る）

  • ⁠トークンの値を変えた（light）⁠（影響: ⁠none⁠・見た目が変わる）— --background 0 0% 100% → 210 40% 96%、--muted 210 40% 96% → 213 32% 89%、--secondary 210 40% 96% → 212 32% 92%、--primary-subtle 220 60% 96% → 220 70% 90%、--info-subtle 214 100% 97% → 214 95% 90%、--success-subtle 138 76% 97% → 141 60% 86%、--warning-subtle 48 96% 89% → 45 95% 80%、--destructive-subtle 0 86% 97% → 0 90% 92%、--input 214 32% 91% → 215 20% 52%。--card・--popover は白のまま。トークン名は不変。public/tokens.css も同じ値。(#1024 / #1034)

  • ⁠トークンの値を変えた（dark）⁠（影響: ⁠none⁠・見た目が変わる）— --card 222.2 84% 4.9% → 217 33% 13%（地と同じ色だった）、--popover 222.2 84% 4.9% → 217 33% 22%（地 < カード < 浮いた面 の順に）、--secondary 217.2 32.6% 17.5% → 217 32.6% 24%（--muted と同じ色だった）、--info-subtle 220 47% 16% → 220 47% 20%、--destructive-subtle 0 50% 16% → 0 50% 20%、--input 217.2 32.6% 17.5% → 215 20% 51%。文字とのコントラストはどれも 4.5:1 以上を保つ。(#1022 / #1027 / #1034)

  • ⁠Slider / RangeSlider の空の溝を --input から --muted へ⁠（影響: ⁠none⁠）— --input を縁の色として 3:1 まで濃くしたため、溝に使い続けると埋まった部分（primary）との差が縮み、値の位置が読めなくなる。trackClassName の受け口は不変。(#1034)

  • ⁠SidebarItem の hover を bg-muted から bg-foreground/5 へ⁠（影響: ⁠none⁠）— Sidebar 本体が bg-muted になったので、hover が本体と同じ色で見えなかった。通常の行と、いまいる項目の親の行の2か所。(#1034)

  • ⁠面で区切るのを守る検査を追加⁠（内部・影響: ⁠none⁠）— design:verify に high-contrast-border（ハイコントラストの --border が全部の面の上で 3:1 以上）・input-border（--input が入れ物の面すべての上で 3:1 以上）・slider-track（溝と埋まった部分が 3:1 以上）・surface-steps（全ページの本番ビルドで、枠を透明にした面が親と 1.05:1 未満になっていない）を足し、docs:audit:surface-borders（塗りのある面に枠が残っていない・ハイコントラストで戻す指定が欠けていない）を数えるだけの報告から落ちる門番にした。例外は design/policy/surface-border-exclusions.json に理由つきで登録する。(#1022 / #1024 / #1027 / #1030 / #1033 / #1034)

Fixed

  • ⁠MarkdownRenderer のほぼ全要素に node="[object Object]" が出ていた⁠（影響: ⁠none⁠）— react-markdown v10 が渡す node を DOM へ展開していた。既定の18部品すべてで取り除いた。(#856)
  • ⁠MarkdownRenderer のインライン code の長い1語で、375px 幅のページが横に溢れた⁠（影響: ⁠none⁠）— backtick の code に break-words を付けた（fenced の code block は従来どおり折らずに横スクロール）。(#895)
  • ⁠Banner の action が日本語のラベルで1文字幅まで縮み、ボタンから字がはみ出た⁠（影響: ⁠none⁠）— action の枠を shrink-0 にし、縮むのは本文（従来どおり1行で省略）だけにした。(#874 / #1018)

[0.1.0-beta.2] — 2026-07-27

0.1.0-beta.1 以降の変更。⁠破壊的変更（構造変更を要する break）なし⁠。新機能はすべて opt-in で既定挙動は据え置き（影響: none）。例外は下記 ⁠Changed⁠ の2件のみ、いずれも影響 ⁠minor⁠・移行パス明記 — RouteStops の既定ラベル変更（1プロップで復元可能）と DashboardTemplate のシェル所有化（ラッパーを外して行だけ渡す機械的変更）。

Changed

  • ⁠DashboardTemplate がダッシュボードのシェルを自前で所有⁠（影響: ⁠minor⁠）— 旧実装の sidebar スロットは固定 hidden border-r w-64 md:block の枠で、<Sidebar> を開いたまま固定して折りたたみ不能にし、md 未満ではナビが丸ごと消えて携帯で画面遷移できなかった。テンプレート自身が SidebarProvider / Sidebar / SidebarBody を組み、小画面では⁠同じナビ行を Sheet で開く⁠ように変更。⁠呼び出し側は sidebar に「行」（通常は SidebarItem 群）だけを渡す⁠。新 props: sidebarHeader / sidebarFooter（ブランド行・アカウント行）・collapsible（既定 true）・defaultCollapsed / collapsed / onCollapsedChange・navLabel・navOpen / onNavOpenChange。外枠は min-h-screen → h-dvh＋overflow-hidden（レールには確定高さの親が要り、ダッシュボードはページではなく main 列がスクロールするため）。⁠移行⁠：sidebar={<Sidebar><SidebarBody>…</SidebarBody></Sidebar>} のように完成品を渡していた場合はラッパーを外して行だけ渡す。SidebarHeader / SidebarFooter に入れていた内容は sidebarHeader / sidebarFooter へ。行だけ渡していた場合は変更不要で、折りたたみと小画面ナビが自動で付く。(#692, #697)
  • ⁠design-verify の arbitrary color / shadow クラスガードを復活⁠（内部・影響: none）— ARBITRARY_COLOR_CLASS_PATTERN / ARBITRARY_SHADOW_CLASS_PATTERN が ] 直後の \b（充足不能な境界）で一度もマッチしていなかったのを修正。例外リストは reason / addedOn / expiresOn を必須化し、期限切れは fail するため、ポリシーが再び静かに死ぬことはない。復活で検出された実バグは下記 ⁠Fixed⁠ の loyalty-summary-card を参照。(#698, #702)
  • ⁠Statistic / StatGroup / StatusBoard / Meter が SemanticTone を直接受理⁠（影響: ⁠none⁠）— Statistic の positive / negative / neutral は success / destructive / muted、StatusBoard の danger は destructive へ内部正規化し、0.1.x の互換 alias として維持。trend / goodWhen の方向・評価ロジックは不変。StatusBoard.problemTones は正規化後に判定し、Meter は default を muted の見た目で描画する。Badge は presentation variant、ExpiryBadge は domain state の公開 API を維持。旧値の撤去は次 major 以降に利用調査＋codemod 付きで再判断。(#673)
  • ⁠RouteStops の既定ステータスラベルを中立語彙に⁠（影響: ⁠minor⁠）— ステータスキー（pending/current/completed/failed/delayed）は汎用なのに、既定ラベルだけが配送依存（未配 / 配送中 / 不在）だったのを、ドメイン中立な 未着手 / 進行中 / 完了 / 失敗 / 遅延 に変更。配送・介護・製造など各ドメインは従来どおり statusLabels で上書きする設計。⁠移行⁠：配送用途は statusLabels={{ pending: "未配", current: "配送中", failed: "不在" }} の1プロップで従来表示を復元（completed/delayed は既に中立で変更なし）。マーカーの色・アイコン、aria-current、予実 Delta は不変。(#282)

Added

  • ⁠useSidebarCollapsed()⁠（影響: none）— useSidebar の非例外版。SidebarProvider の外では throw せず null を返すので、Sidebar 内外どちらに置かれても成立する部品（SidebarItem 自身がこれを使う）が折りたたみ状態に追従できる。(#692, #697)
  • ⁠LocaleProvider の文字列に navigation を追加⁠（影響: none）— DashboardTemplate のナビ領域・開閉ボタン・Sheet のアクセシブル名（en: Navigation / ja: ナビゲーション）。navLabel prop で個別上書き可。(#697)
  • ⁠純 CSS 資産の subpath export⁠（影響: none）— npm 不可環境向けに gunjo.jp の固定 URL で配布している Tailwind 非依存の純 CSS 資産をパッケージにも同梱し、@gunjo/ui/tokens.css（純 CSS トークン）・@gunjo/ui/patterns.css（gj- パターンクラス）として import できるようにした。中身は配信版と同一（同じ SSOT から生成・drift 検証つき）。固定 URL 配布（/docs/no-npm）は従来どおり併存。(#684)
  • ⁠subpath export の追加⁠（影響: none）— 重い runtime を引く部品を、依存クラスタ単位の subpath から narrow に import できるようにした：@gunjo/ui/table（DataTable / ActionDataTable ＋ ColumnDef・@tanstack/react-table）、@gunjo/ui/calendar（DatePicker / DateRangePicker / Calendar・react-day-picker）、@gunjo/ui/drawer（vaul）、@gunjo/ui/carousel（embla-carousel-react）、@gunjo/ui/markdown（react-markdown）、@gunjo/ui/motion（FloatingPanel・framer-motion）。⁠これらは 0.1.x では root barrel（@gunjo/ui）からも従来どおり import できる⁠（Phase 1・純追加）。0.2.0 で root barrel からの重部品 export を撤去し、該当依存を optional peer 化する予定（Phase 2・破壊枠・移行表を別途提示）。(#492)
  • ⁠DesktopPageHeader⁠（影響: none）— デスクトップ業務コンソールの各画面に置く、eyebrow・タイトル・説明・末尾アクションの軽量見出しバー。アプリ全体のクロームである Header、モバイル app-bar の PageHeader と責務を分離する。(#397)
  • ⁠OccupancyMeter⁠（影響: none）— Meter の上にラベルと value / max readout をまとめた、満席率・稼働率・設備利用率向けの薄い合成。既定は direction="neutral" で低い値を失敗色にせず、target・tone・formatValue・size は Meter へ転送する。(#343)
  • ⁠CheckboxCard / CheckboxCardGroup⁠（影響: none）— RadioCard の複数選択版。各カードは独立した role="checkbox" / Tab stop と角丸スクエアのチェックを持ち、配列の制御・非制御選択、フォーム送信用 name、無効化理由ツールチップに対応。矢印キーの roving navigation は行わない。(#378)
  • ⁠Meter の direction="neutral"⁠（影響: none）— 時間で埋まっていくゲージ（満席率・稼働率）向けの中立モード。⁠判定色を付けず（primary 一定）⁠、target は参照マーカーのみ。higher-is-better は目標未達を赤にするためサービス開始直後の低い値が誤警報になる問題（cold-test #95）を、意味論の明確な名前付きモードで回避できる。tone 上書きは従来どおり優先。docs に3+1モードのトーン意味論を明記。(#343)
  • ⁠SignedRecord の複数署名⁠（影響: none）— requiredSigners（当事者一覧）を渡すと複数署名モードに。⁠全員が署名するまで下書きのまま編集でき、最後の署名でロック⁠する（単一署名は従来どおり1回でロック）。value.signatures に署名を蓄積し、当事者ごとの署名状況と進捗（N/M）を表示。同一人物の二重署名と当事者外の署名は理由つきで不可。追記の author は当事者ラベルで表示。requiredSigners 未指定なら従来の挙動のまま。(#259)
  • ⁠Toast の description / action⁠（影響: none）— 2行目の補足と操作ボタン1つを追加し、ToastAction を公開。useToast().showToast はオブジェクト形 { message, description, type, duration, action } のオーバーロードも受け付ける（従来の位置引数呼び出しはそのまま動く）。action 付きで duration 未指定なら、押す前に消えないよう自動クローズを延長。(#301)
  • ⁠DataTable の合計 / フッター行⁠（影響: none）— いずれかの列に TanStack の footer を定義すると <tfoot> を描画。footer(({ table }) => …) で getFilteredRowModel() を使えばフィルタ後の合計になる（表示中ページだけではない）。footer 未定義なら従来どおり何も出ない。card モード（renderCard）には出ない。(#255)
  • ⁠SheetBody / DialogBody⁠（影響: none）— 長いフォーム用のスクロール領域。Content の⁠直下に置いた時だけ⁠高さ制限つき flex 列へ切り替え、ヘッダー / フッターを固定して中央だけスクロールする。Body が無い既存の Sheet / Dialog は出力不変。(#293)
  • ⁠PersonCell の href / onActivate⁠（影響: none）— セル全体を activation target に（ルートが <a> / <button> になり chevron が affordance）。「人物行を毎回 button で包む」定型を解消。未指定なら従来どおり <div>。(#341)
  • ⁠Combobox の creatable⁠（影響: none）— 検索テキストがどの候補にも一致しない時に「作成」項目を表示し、onCreate(text) で自由入力の値を追加できる（options への追加と value のセットは呼び出し側が担当）。createLabel でラベル差し替え。(#200)
  • ⁠BarChart / StackedBarChart の threshold⁠（影響: none）— 上限ラインを引いて超過を示す。BarChart は超えた棒を thresholdTone（既定 destructive）で塗る。StackedBarChart は⁠グループ合計⁠に対する上限で、超過グループをリング＋thresholdTone の合計値で示す（⁠segment の色は一切変えない⁠——各 segment が固有の意味を持つため）。超過は aria-label にも出るので色だけに頼らない。両者とも縦横 variant 対応。StackedBarChart では normalize 併用時に無視（各グループが 100% になり絶対値の位置が無いため・dev 警告あり）。(#285)
  • ⁠Input / Textarea の showCount⁠（影響: none）— 文字数表示。maxLength 併用で count / max 形式になり、aria-describedby で関連付く。制御・非制御どちらでも動作。(#314)
  • ⁠Avatar の colorSeed⁠（影響: none）— AvatarFallback の頭文字背景を名前から決定的に配色（ディレクトリの視認性）。opt-in。(#331)
  • ⁠SwatchLegend⁠（影響: none）— ChartLegend を単体利用できる別名として公開（カレンダー / かんばんの tone → ラベル凡例）。(#327)
  • ⁠Stepper の onStepClick⁠（影響: none）— 完了済みステップへのジャンプ移動。未指定なら従来どおり非インタラクティブ。(#157)
  • ⁠ReferenceValue の affirmative⁠（影響: none）— 正常値のうち「良い」値を肯定的に強調できる（従来は中立か異常のみ）。(#291)
  • ⁠ToggleGroup の項目ごとの tone⁠（影響: none）— 排他ステータスピル（休講 red / 補講 blue など）向けに ToggleGroupItemTone を追加。(#288)
  • ⁠ScheduleGrid のセル単位 selected + cellClassName⁠（影響: none）— アクティブ / オープン中のセルを強調できる。(#299)
  • ⁠Timeline の items data-prop⁠（影響: none）— compound API に加えてデータ駆動の形を追加（compound だけでは発見しづらかったため）。(#349)

Fixed

  • ⁠Sidebar が高さ不定の親で潰れる⁠（影響: none）— h-full の百分率高さは親の確定高さが無い（例: min-h-*）と解決できず、レールが自身のコンテンツ高まで潰れ、flex の stretch まで打ち消していた。self-stretch に変更（実測: min-height:500px の flex 行で旧契約は 0px、新契約は 500px で描画）。(#692, #697)
  • ⁠SidebarItem が折りたたみに追従しない⁠（影響: none）— 60px レールでアイコンを中央寄せし、56px の末尾予約を落とし、ラベルはツールチップへ移動、可視ラベルが消えるぶん aria-label に名前を明示。呼び出し側で行ごとに Tooltip で包む定型が不要になった。(#692, #697)
  • ⁠SidebarHeader / SidebarFooter が 60px レールからはみ出す⁠（影響: none）— 両者も折りたたみに追従するようになり、ブランド行やアカウント行がレール幅を突き破らない。(#692, #697)
  • ⁠AuthTemplate の左ブランド面がダークで白へ反転⁠（影響: none）— bg-foreground / text-background はダークモードで白面＋黒字になり、隣のフォームと真逆だった。デザインソースどおりテーマ不変の --pure-black / --pure-white に変更（CodeBlock と同じ手当て）。(#693, #697)
  • ⁠Icon の IconGlyph 型が実態より狭い⁠（DX・影響: none）— ForwardRefExoticComponent 固定だったため、@tabler/icons-react が公開する Icon 型（FunctionComponent<IconProps>）の⁠型付き変数・レジストリ経由⁠で渡すと Property '$$typeof' is missing で落ち、インラインの icon={IconChevronRight} しか通らなかった。React.ComponentType に拡張して両方受理（IconGlyphProps も公開）。(#694, #697)
  • ⁠Accordion の最終項目の下線がルート枠と二重⁠（影響: none）— 最後の項目に last:border-b-0。(#695, #697)
  • ⁠loyalty-summary-card デモのバーコードがダークでほぼ不可視⁠（docs・影響: none）— デモのバーコード3枚中2枚が #111 直書きで dark: variant を持たず、ダークのカード（rgb(2,8,23)）上で実質見えなかった。hsl(var(--foreground)) に変更し、コピー元コードもテーマ追従に。上記 ⁠Changed⁠ のガード復活（#698）で検出。(#702)
  • ⁠*VariantKey 型が barrel から出ていなかった⁠（DX・影響: none）— BadgeVariantKey などの variant-key union は各部品が内部で import type するだけで re-export しておらず、import type { BadgeVariantKey } from "@gunjo/ui" が tsc で落ちていた。採用先が Record<Status, BadgeVariantKey> を書くのに literal union を手写しする必要があった。barrel 生成器を更新し、全カテゴリの *VariantKey 型を export type * で公開（⁠型のみ⁠・runtime のキー配列は非公開のまま）。純追加なので既存コードに影響なし。(#411)
  • ⁠Table / DataTable の横スクロール漏れ⁠（影響: none）— 狭い画面（375px 等）で、幅広の内側要素が overflow-x-auto スクローラから⁠ページ全体に横スクロールを漏らす⁠ことがあった（html.scrollWidth が膨らむ・祖先の min-w-0 や sticky 除去では直らない）。両コンポーネントの横スクローラに [contain:paint] を付与して封じ込め（ScheduleGrid #287 と同じ手当て）。正しくレイアウトされている場合は no-op。自前の幅広コンテンツ（チャート・カスタムグリッド）向けに Table docs へ手順も記載。(#289)
  • ⁠Alert の見出し順序⁠（a11y・影響: none）— AlertTitle の既定要素が h5 で、h1 → h5 と見出しレベルが飛んでいた。既定を <p> に変更（⁠見た目は不変⁠。見出しにしたい場合は as="h5" を明示）。(#251)

[0.1.0-beta.1] — 2026-07-15

初の ⁠beta⁠。0.0.1-alpha.3 以降の全変更。beta 昇格ゲート（#572・4/4 達成）をクリアし、コア 54 部品を Beta に。⁠破壊的変更なし⁠（採用先影響は原則 ⁠none⁠・追加 API と a11y 修正のみ・既存コード変更不要）。この版から ⁠semver / @deprecated 規律が発効⁠（破壊はマイナーのみ・移行パスを提示）。

Added

  • ⁠SemanticTone 正準スケール＋変換器⁠（影響: ⁠none⁠）。SemanticTone（default|muted|primary|info|success|warning|destructive）と SEMANTIC_TONES/isSemanticTone/toChartTone/toMeterTone/toBadgeVariant/toDangerTone を公開。tone 系コンポーネント間で共有し、語彙が違う所は変換器で橋渡し（画面ごとの変換表を不要に）。変換器は型のみ import で RSC-safe。(#294)
  • ⁠Button loading⁠（影響: none）— Spinner＋disabled＋aria-busy。(#305)
  • ⁠Alert 便利 props⁠ icon/title/description（影響: none）— compound を書かずに1行で。(#303)
  • ⁠Badge size（sm/default/lg）・Tag icon⁠（影響: none・既定は現状維持）。(#300)
  • ⁠Sheet size（sm–xl/full）⁠（影響: none）— サイドドロワーを広く。死んでいた w-[384px] を除去。(#328)
  • ⁠Drawer direction⁠（影響: none）— Root の direction を single source of truth 化（下記 Fixed 参照）。(#335)
  • ⁠DatePicker/DateRangePicker label＋description⁠（影響: none）— useId で a11y 配線。(#315)
  • ⁠DataTable caption/aria-label/aria-labelledby・hidePaginationSummary⁠（影響: none）。(#298, #311)
  • ⁠MetadataList wrap⁠（影響: none）— 長い値を折り返す（既定は truncate）。(#284)
  • ⁠TreeView onNodeActivate⁠（影響: none）— ラベルのドリルインを展開/折りたたみと分離。(#283)
  • ⁠RadioGroup disabled⁠（影響: none）— グループ一括無効＋<fieldset disabled> 継承（下記 Fixed）。(#273)
  • ⁠レイアウトの t-shirt gap エイリアス⁠（VStack/HStack/Cluster の gap="sm|md|lg"…、影響: none）＋ prop 語彙規約の文書化。(#330)
  • ⁠直列化可能な valueFormat/feeFormat/timeFormat⁠（影響: none）— 11 チャート＋クライアント footgun 部品／SignedRecord に、関数 prop を使わず RSC から渡せる代替を追加。(#338 Phase 1–3)

Fixed

  • ⁠RSC function-prop footgun のガード⁠（影響: none／CI）— Server Component から関数 prop を渡すと next build が壊れるが tsc/dev/CI が捕まえない問題に、CI へ本番ビルドゲートを追加＋直列化代替＋render props の RSC 注意書き。beta ゲートの実質単一ブロッカーを解消。(#338)
  • ⁠overlay の Radix「Missing Description」警告⁠（a11y・影響: none）— Dialog/Sheet/Drawer/AlertDialog で description が無いときだけ aria-describedby を opt-out（ある時は配線維持・回帰なし）。(#322)
  • ⁠Drawer side がポインタを飲む⁠（機能バグ・影響: none）— vaul の direction 未設定でサイドドロワーの子がクリック不能だった。Root direction を配線し、ミスマッチ時に dev 警告。(#335)
  • ⁠RadioGroup が <fieldset disabled> を継承しない⁠（a11y・影響: none）— :disabled で検出し aria-disabled 反映＋roving tabindex から除外。(#273)
  • ⁠DataTable 狭幅ヘッダ崩れ⁠（影響: none）— <480px コンテナでサマリが1文字ずつ改行 → flex-wrap＋min-w-0。(#311)
  • ⁠DataTable ソートヘッダの a11y⁠（影響: none）— 冗長な英語ラベルがセル名に漏れる問題を解消、列名がアクセシブル名に。(#307)
  • ⁠ReferenceValue の sr-only 二重読み上げ⁠（a11y・影響: none）。(#306)
  • ⁠MetadataList/TreeView/DatePicker ほか⁠ の細部（上記 Added に対応する挙動修正）。
  • ⁠Popover の重複クラス⁠（影響: none・視覚不変）— w-72 w-[288px]／rounded-md rounded-lg を .pen に合わせ単一化、drift チェックの cornerRadius:8→rounded-md 誤マッピングも訂正。(#140)
  • ⁠不正な ChartColor に dev 警告⁠（DX・影響: none）— tone でも CSS 色でもない値に開発時警告。(#296)

Docs

  • ⁠パッケージ版ゲート⁠（alpha → beta → 1.0）を /docs/stability に追記。(#572)
  • ⁠Semantic Tones ページ⁠（正準スケール＋ライブデモ＋変換器表）。(#294)
  • ⁠Installation⁠: @tabler/icons-react を consumer 直依存として案内（pnpm/strict hoisting 対策）。(#309)
  • ⁠Icon icon={Glyph} 契約⁠の可視化・⁠Banner は1行の帯⁠（Alert との使い分け）・⁠DataTable renderCard⁠ の activatable-card 契約・⁠render props の RSC 安全性⁠注記。(#337, #324, #333, #338)

Changed

  • ⁠安定性の昇格 第一波：54 部品を Experimental → Beta⁠（採用先影響: ⁠none⁠・ラベルのみ）。コールドテスト 170 画面での登場頻度（≥12 ラウンド）を「本番採用」の代理指標とし、docs Props 完全カバー（#559 監査済）と合わせて /docs/stability の Beta 基準を満たすコアを昇格。Beta = 機能完成・API はフィードバックで調整されうる（パッチでは壊れない）。対象: Badge Button Card Separator Select Statistic MetadataList Alert Tabs Meter Sheet EmptyState StatGroup DataTable Container Input PageHeader Textarea Timeline Tag Dialog NumberInput ActionQueue Delta ToggleGroup ListCard AmountBreakdown Checkbox SignedRecord Table PersonCell Icon Label RouteStops CoSign Banner ReferenceValue SearchInput Avatar Switch Stepper Form ScheduleGrid Progress VStack ApprovalSteps Drawer FilterChips LineChart BottomActionBar RadioCard DatePicker EditableDataTable RadioGroup。SSOT は design/stability.json。(#573)
  • ⁠semver 規律の開始⁠（beta ゲート③）— 本リリース以降、破壊的変更はマイナーのみ・@deprecated で移行パスを提示し、その内容をこの CHANGELOG に記録する（docs/versioning の作法をここから有効化）。

[0.0.1-alpha.3] — 2026-07-10

alpha.2（173 部品）以降、コールドテスト 170 画面の検証ループで見つかった欠落を埋め続けた成果をまとめた alpha リリース。⁠部品セットは 216 に到達（+43）⁠。⁠API は今後変更される可能性があります⁠（全部品 Experimental）。

Added

  • ⁠コンポーネント +43 件（173 → 216）⁠（採用先影響: ⁠none⁠・追加のみ）。コールドテスト 170 ラウンドで「文脈ゼロの AI が手組みした＝欠落」と報告された部品を、業種横断で追加（運行図 Stringline、系譜 LineageGraph、月カレンダー EventCalendar、座席 SeatMap、経路 OriginDestination / RouteStops / Itinerary ほか）。docs / SSOT / Figma を 3 軸で監査 (#559)。
  • ⁠i18n LocaleProvider⁠（採用先影響: ⁠none⁠・後方互換）。shadcn 由来の組み込み文字列（No results. / 検索プレースホルダ / ページャ等）を <LocaleProvider locale="ja"> 一箇所で切替。en 既定＝プロバイダ未マウント時は従来どおり。precedence: instance prop > provider bundle > 既定。14 部品配線 (#326 / #560–562)。docs: /docs/i18n（ライブ en/ja トグル）(#567)。
  • ⁠Button の size="touch" / size="icon-touch"⁠（採用先影響: ⁠none⁠・追加のみ）。44px タップ標的（WCAG 2.5.5）を意図で選べるサイズ。モバイル / toC 画面向け (#362 / #568)。
  • ⁠部品固有のローカライズ上書き prop⁠（採用先影響: ⁠none⁠・追加のみ）— ActionQueue.severityLabels / EventCalendar.formatMonthTitle・formatDayLabel / ScanGate.stepsLabel / TicketStub.formatCodeAlt。既定は日本語のまま (#558)。

Changed

  • ⁠配布形態を「生 TS 直配布」から「コンパイル済み dist/（ESM + .d.ts）」へ変更⁠（採用先影響: ⁠none⁠）。exports "." が ./dist/index.js を指すようになり、採用先は transpilePackages: ["@gunjo/ui"] なしで Next.js / Vite からそのまま import できる。各コンポーネントの "use client" 境界は tsc が directive として保持。npm run build:lib（tsc -p tsconfig.build.json）で生成し、prepare で npm install / pack / publish 時に自動ビルド。既存採用先はコード変更不要（transpilePackages は削除してよい）。
  • ScanGate の手順区切りをテキスト矢印（→）からアイコン（IconChevronRight）へ（採用先影響: ⁠none⁠・視覚のみ、aria-hidden の装飾）(#570)。

Fixed

  • prepare が dist を自動ビルドするようになり、npm install file:../gunjo などローカル採用でも dist/ が確実に揃う（採用先影響: ⁠none⁠）。
  • prepare の git hooks インストールを堅牢化：書込不可環境でも失敗しない（npm pack / publish を壊さない）。gunjo リポジトリ本体でのみ動作し、file:/git+ install で採用先の core.hooksPath を書き換えない。
  • リポジトリに commit されていた古いビルド成果物 gunjo-ui-0.0.1-alpha.2.tgz を削除し、*.tgz を gitignore。

[0.0.1-alpha.2] — 2026-06-13

OSS 公開に合わせた alpha リリース。0.0.1-alpha.0 / alpha.1（70 components）以降に追加された全コンポーネント（Tier 1/2/3 + Templates、計 42 件）と、LICENSE / repository フィールド / public 化などの OSS 整備を配布。npm 上の README・メタデータも刷新。⁠API は今後変更される可能性があります。⁠

Added

  • LICENSE ファイル追加（MIT、package.json の license: MIT 宣言と整合）
  • git tag v0.0.1-alpha.0 バックフィル（commit dc7256d、初回 publish 時点を指す）
  • CONTRIBUTING.md / SECURITY.md 追加（OSS 整備）
  • ⁠新コンポーネント：Toggle（atom）⁠ — Radix react-toggle ベース。variant (default / outline) と size (sm / default / lg) をサポート。Tier 1 batch 1 の最初の追加
  • ⁠新コンポーネント：AspectRatio（atom）⁠ — Radix react-aspect-ratio の薄いラッパー。ratio prop で 16/9, 4/3, 1 等の固定比率コンテナ提供
  • ⁠新コンポーネント：Code（atom）⁠ — inline <code> の cva スタイル。variant (default / muted) と size (sm / default / lg) をサポート
  • ⁠新コンポーネント：AlertDialog（molecule）⁠ — Radix react-alert-dialog ベースの compound pattern。Trigger / Content / Header / Title / Description / Footer / Action / Cancel
  • ⁠新コンポーネント：Drawer（molecule）⁠ — vaul ライブラリベースの mobile bottom-sheet。drag-to-dismiss handle 付き
  • ⁠新コンポーネント：Combobox（molecule）⁠ — Popover + Command の compound。options array で searchable select。placeholder / searchPlaceholder / emptyMessage カスタマイズ可
  • ⁠新コンポーネント：DatePicker（molecule）⁠ — Popover + Calendar + date-fns の compound。value (Date) と onValueChange で controlled 利用、dateFormat で表示形式指定
  • ⁠新コンポーネント：Sidebar（molecule）⁠ — Context-based provider + compound (Sidebar / SidebarHeader / SidebarBody / SidebarFooter / SidebarSeparator)。useSidebar hook で descendant から collapsed 制御
  • ⁠新コンポーネント：DataTable（molecule）⁠ — @tanstack/react-table の wrapper。generic で型安全 (<TData, TValue>)。sort + filter（指定カラム）+ pagination（pageSize 設定可）統合
  • ⁠🎉 Tier 1 essentials 全 9 件完了⁠（Toggle / AspectRatio / Code / AlertDialog / Drawer / Combobox / DatePicker / Sidebar / DataTable）
  • ⁠新コンポーネント：Container（atom）⁠ — size prop（sm/md/lg/xl/2xl/full/prose）で max-width + padding wrapper
  • ⁠新コンポーネント：HStack（atom）⁠ — flex 横、gap / align / justify / wrap props
  • ⁠新コンポーネント：VStack（atom）⁠ — flex 縦、gap / align / justify props
  • ⁠新コンポーネント：Cluster（atom）⁠ — flex-wrap、tag list 等の自動折返し用
  • ⁠新コンポーネント：Grid（atom）⁠ — cols 固定 or minItemWidth auto-fit のレスポンシブ grid
  • ⁠新コンポーネント：Spacer（atom）⁠ — size で固定 or flex-grow filler
  • ⁠🎉 Layout primitives 全 6 件完了⁠
  • ⁠新コンポーネント：NumberInput（atom）⁠ — chevron stepper 付き numeric input。value / onValueChange / min / max / step props
  • ⁠新コンポーネント：PasswordInput（atom）⁠ — Eye / EyeOff icon の visibility toggle 付き password input
  • ⁠新コンポーネント：SearchInput（atom）⁠ — leading Search icon と clearable × button 付き search input
  • ⁠新コンポーネント：EmptyState（atom）⁠ — icon / title / description / action slot 付きのプレースホルダ
  • ⁠新コンポーネント：Tag（atom）⁠ — onRemove 付き Badge、4 variants × 3 sizes
  • ⁠新コンポーネント：InputOTP（atom）⁠ — input-otp library wrap、InputOTPGroup / InputOTPSlot / InputOTPSeparator の compound
  • ⁠新コンポーネント：AvatarGroup（molecule）⁠ — 重ね avatars、max prop で +N overflow indicator
  • ⁠新コンポーネント：DateRangePicker（molecule）⁠ — Popover + Calendar (mode="range") + date-fns、numberOfMonths で複月表示
  • ⁠新コンポーネント：TimePicker（molecule）⁠ — hour / minute select、hour12 (AM/PM) と minuteStep (1/5/10/15/30) props
  • ⁠新コンポーネント：TagInput（molecule）⁠ — Tag を内部使用、Enter/コンマでコミット、Backspace で末尾削除、dedupe / maxTags props
  • ⁠新コンポーネント：CodeBlock（molecule）⁠ — code 表示用、filename / language / copyable props
  • ⁠新コンポーネント：Banner（molecule）⁠ — page 全幅 announcement、5 variants + icon / action / onDismiss
  • ⁠新コンポーネント：NavigationMenu（molecule）⁠ — Radix react-navigation-menu の compound（List/Item/Trigger/Content/Link/Indicator/Viewport）
  • ⁠🎉 Tier 2 high-frequency 全 13 件完了⁠
  • ⁠新コンポーネント：ColorSwatch（atom）⁠ — color preview chip、color / label / copyable / size props
  • ⁠新コンポーネント：Timeline（molecule）⁠ — TimelineItem (variant/marker/connector) + Title/Description/Time の compound
  • ⁠新コンポーネント：TreeView（molecule）⁠ — TreeNode[] data driven、controlled / uncontrolled expand、selected state
  • ⁠新コンポーネント：MarkdownRenderer（molecule）⁠ — react-markdown + remark-gfm、prose styling 内蔵、disableGfm で plain markdown
  • ⁠新コンポーネント：Mention（molecule）⁠ — textarea + @ trigger picker、↑↓+Enter で選択、options / trigger / maxSuggestions props
  • ⁠新コンポーネント：Statistic（molecule）⁠ — KPI card、label / value / change / trend (up/down/flat) で色・矢印切替
  • ⁠新コンポーネント：Header（organism）⁠ — Brand / Nav / NavLink / Actions の compound site nav bar
  • ⁠新コンポーネント：Footer（organism）⁠ — Columns / Section / Link / Brand / Copyright compound、responsive grid
  • ⁠新コンポーネント：OnboardingFlow（organism）⁠ — step indicator + content + Back/Continue、controlled/uncontrolled、onComplete callback
  • ⁠🎉 Tier 3 specialty 全 9 件完了⁠
  • ⁠新コンポーネント：NotFoundTemplate（template）⁠ — 404 page、code / title / description / action props
  • ⁠新コンポーネント：ErrorTemplate（template）⁠ — 500 page、details (stack trace) prop 付き
  • ⁠新コンポーネント：PricingTemplate（template）⁠ — 3-tier 価格表、PricingPlan[]、featured で highlight
  • ⁠新コンポーネント：BlogTemplate（template）⁠ — category / title / meta / hero の prose article layout
  • ⁠新コンポーネント：DocsTemplate（template）⁠ — sidebar / main / toc の三分割 layout
  • ⁠新コンポーネント：OnboardingTemplate（template）⁠ — hero panel + content の二分割、OnboardingFlow と組合せ可
  • ⁠🎉🎉🎉 Templates 全 6 件完了 — 計画 42/42 components 完成⁠
  • docs/component-roadmap.md 追加（42 components 追加計画と引き継ぎログの SSOT）

Planned（次回以降）

  • 実採用プロジェクトでのドライラン（npm install @gunjo/ui で transpilePackages 込みの実動作確認）
  • CONTRIBUTING.md / SECURITY.md の整備
  • CI で npm publish --dry-run を流して配布物の差分を見える化
  • GitHub リポジトリの public 化＋ repository フィールド追加（OSS 公開準備が整い次第）

[0.0.1-alpha.1] — 2026-05-04

軽微な housekeeping リリース。⁠コードの API 変更なし⁠、配布物のサイズ・依存・コンポーネント構成は 0.0.1-alpha.0 と完全同一。

Changed

  • package.json の maintainer メアドが register@4px.jp（メール転送設定不備のあった alias）→ dev@4px.jp に切り替わったため、npm registry の maintainer 表記を更新
    • 採用先影響度：⁠none⁠

[0.0.1-alpha.0] — 2026-05-04

⁠初回 npm publish。⁠ @gunjo/ui の名前確保が主目的の alpha 公開で、API は今後の alpha / beta 期間中に変更される可能性があります。中身は L3 整備完了時点のスナップショット（70 components）。

Added

  • npm レジストリへの初回 publish（@gunjo/ui、access: public）
  • @gunjo Org（admin: uixhero）配下の最初のパッケージとして登録

Changed

  • パッケージ名：@gunjo（bare scope、npm 規則違反で publish 不能）→ ⁠@gunjo/ui⁠（npm の @scope/name 規則準拠）
  • export サブパスも追従：
    • @gunjo/styles → @gunjo/ui/styles
    • @gunjo/tailwind-preset → @gunjo/ui/tailwind-preset
    • @gunjo/tailwind-theme-extend → @gunjo/ui/tailwind-theme-extend
  • 採用先側の参照箇所（transpilePackages / tailwind.config の content / next.config / globals.css の @import / @source）も @gunjo/ui へ追従要
  • package.json：private: true → false、publishConfig.access: "restricted" → "public"
  • version：内部マイルストーン 1.0.0 を npm 公開バージョンとしては破棄、初回公開を 0.0.1-alpha.0 から開始（npm 上の 1.0.0 は将来の stable リリースに予約）

Removed

  • React 18 peer サポート（peer は ^19.0.0 のみ。内部実装で React 19 専用 API を採用したため）

Documentation

  • adoption / migration / dependencies / versioning / component-addition / adoption-strategy 整備（PR #2）
  • このファイル（CHANGELOG.md、PR #2 で bootstrap、PR #3 で本エントリ追加）

採用先影響度

  • ⁠breaking⁠：@gunjo を import / tailwind.config の content / next.config の transpilePackages 等で参照していた場合は全て @gunjo/ui に置換必須
    • 移行手順：git grep -l '@gunjo' | xargs sed -i '' 's|@gunjo|@gunjo/ui|g' のような一括置換 + 確認
    • ただし alpha 段階のため、現時点の採用先は本リポジトリ内 docs サイトのみで影響範囲は限定

Pre-publish history（内部 1.0.0 期間、2026-04 以前〜2026-05-03）

npm 未公開期間の内部マイルストーン。CHANGELOG エントリではなく履歴メモ：

  • L3 整備：adoption guide 一式追加（PR #2 / 2026-05-03）
  • React peer 範囲を ^18 || ^19 → ^19 のみに縮小（実装内で React 19 専用 API 使用のため、本来 MAJOR 事案だが未公開期間中の調整として CHANGELOG エントリ化せず）
  • コンポーネント 67 → 70 追加：Skeleton, Stepper, Form（コミット be127e9 / 2026-05）
  • L3 配布準備：package.json の description / keywords / publishConfig / 拡張 files / 追加 exports 整備（PR 1f9b760）
  • SSOT 三軸（pen + source + docs）配備、視覚監査 70/70（コミット 8e3246e 他）