# @k8o/arte-odyssey ## 12.0.1 ### Patch Changes - RSC の server 環境で `Breadcrumb.List` などが undefined になり、server コンポーネントから使うと「Element type is invalid」で落ちるのを修正しました。v12 で nav ラベルを辞書化するために `useMessages()` を使い、`breadcrumb.tsx` が client モジュールになった結果、その中で合成していた `Breadcrumb` オブジェクトが参照プロキシになりプロパティを引けなくなっていました。`CheckboxGroup` と同じく、パーツを個別に export して client でない `index.ts` 側で合成します。公開 API は変わりません。 あわせて、`'use client'` モジュール内で合成された複合コンポーネントが増えないことを検証するテストを追加しました。v12 以前から同じ形の 11 件（`Dialog` / `Tabs` / `Tooltip` など）は、個別に検証しながら順次移すため既知として許容リストに載せています。 ## 12.0.0 ### Patch Changes - `props.json` に `@k8o/arte-odyssey/ai`（Conversation / Message / PromptInput / Reasoning / Suggestion / ToolInvocation）と `@k8o/arte-odyssey/ai/response`（Response）の props を追加しました。extract-props がルートエントリしか見ておらず、AI コンポーネントだけ型からの props 生成の対象外になっていました。ドキュメントサイトの AI チャットページにも生成された props テーブルを掲載しています。 - Autocomplete のタグ解除ボタンの文言を実際の動作に合わせました。タグの × ボタンは「閉じる」→「タグを削除」（en: Remove → Remove tag）、一括解除ボタンは「すべて閉じる」→「すべて削除」になります。どちらもタグを削除する操作であり、「閉じる」では何が起きるか読み上げから判断できませんでした。 - RSC の server 環境で `CheckboxGroup.Root` が undefined になり、server コンポーネントから使うと「Element type is invalid」で落ちるのを修正しました。合成モジュールが client モジュールの export（参照プロキシ）をスプレッドしており、`Root` がコピーされずに消えていたためで、`Accordion` などと同じ直接参照での合成に揃えています。公開 API は変わりません。 ## 12.0.0 ### Major Changes - グループ入力とフィールドラッパーのアクセシブルネームを整理しました。 **CheckboxCard（破壊的変更）** `aria-labelledby` を必須にし、`role="group"` を明示しました。これまでは任意の ARIA 属性として渡せるだけで、省略するとグループに名前が付きませんでした。`RadioCard` と同じく、グループ名を指す要素の id を渡してください。生成 UI の `CheckboxCard` にもグループ名用の `label` を追加しています（キーは末尾に追加）。 **CheckboxGroup（破壊的変更）** - `aria-labelledby` を必須にしました。`RadioCard` / `CheckboxCard` / `Radio` と同じく、グループ名を指す要素の id を渡してください。 - `required` prop を削除しました。`role="group"`（`fieldset` の暗黙ロール）は `aria-required` を許可しておらず、axe の `aria-allowed-attr` に引っかかります。必須であることは、`aria-labelledby` の参照先ラベル（`FormControl` の必須表示など）に含めて伝えてください。 ```tsx

興味のある分野

``` 生成 UI（json-render / OpenUI）の `CheckboxGroup` にはグループ名用の `label` を追加しました（キーは末尾に追加）。 **FormControl（破壊的変更）** `labelAs="label"`（既定）のラッパーを `
` から `
` に変更しました。従来は 1 フィールド包むだけで名前の無い `role="group"` が生まれ、全フォーム部品にそれが付いていました。`labelAs="legend"` は従来どおり `
` + `` です。DOM 構造に依存したスタイル・テストがある場合は追随してください。 - peer 依存の下限を「実際に検証しているバージョン」に統一し、古いバージョンのための互換を廃止しました。 - **`ai` は v7 のみサポートします**（`>=7.0.51`）。AI SDK v7 のツール状態機械に追随し、`ToolState` に `approval-requested` / `approval-responded` / `output-denied` を追加、`ToolInvocation` は拒否状態を警告トーンで表示します（`deniedReason` prop、既定文言は辞書の `toolDenied`）。`mapMessageParts` は v7 で削除された `isToolOrDynamicToolUIPart` と deprecated の `getToolOrDynamicToolName` をやめ、`isToolUIPart` / `getToolName` を使います。`MappedPart` の tool には `deniedReason` が追加されています。 - **`typescript` の下限を `>=7.0.2` にしました。** 配布物の型定義は TS 7 の tsc での型チェックで検証しています（リポジトリ内のビルドは vite-plus の dts 生成が TS 7 の JS API 未提供に未対応のため、当面 TS 6 を使います）。 - そのほかの peer も devDependencies で検証している版を下限にしました: `react` / `react-dom` `>=19.2.6`、`@types/react` `>=19.2.18`、`@types/react-dom` `>=19.2.4`、`tailwindcss` `>=4.3.3`、`zod` `>=4.4.3`、`@openuidev/lang-core` `>=0.2.10`、`@openuidev/react-lang` `>=0.2.9`。 `Messages` 型に `toolDenied` キーが増えています。辞書を型注釈付きで全置換している場合はキーを追加してください。 - `styles.css` をビルド済み CSS にして、Tailwind を持たないプロジェクト（CSS Modules・素の CSS）でも import 1行で使えるようにしました。ライブラリのルールはすべて `@layer` 内にあるため利用側の CSS が優先され（例外は preflight の `[hidden] { display: none !important }` のみ）、デザイントークンは `:root` / `.dark` の CSS カスタムプロパティとして参照できます（`var(--fg-mute)` など）。どちらのエントリも Tailwind の preflight とライブラリの base スタイルを文書全体に適用します（既存アプリへの後付け時は注意）。`Response`（streamdown）だけは利用側の Tailwind ビルドが必要なため、ビルド済み CSS では対象外です。 **破壊的変更**: Tailwind CSS 4 のプロジェクトは import を `@k8o/arte-odyssey/tailwind.css`（従来の `styles.css` と同内容の Tailwind ソース版）に変更してください。デザイントークンを自分のマークアップの Tailwind クラスとして使うにはこちらが必要です。 あわせて、コンポーネントが参照しながら生成されていなかったユーティリティを修正しました: `rounded-xs`（`--radius-xs: 0.125rem` をトークンに追加。AI コンポーネントの停止ボタン・ストリーミングカーソルに 2px の角丸が付くようになります）と、`Modal` center の `max-h-lg` / `vertical:max-h-2xl`（実在する `max-h-128` / `max-h-168` に置換。中央モーダルに意図されていた最大高さが初めて効きます）。 - `Response` が streamdown の設定を透過し、コントロールの文言も辞書化しました。 - **`children` / `isStreaming` 以外の props が streamdown にそのまま渡ります。** 型は `Omit` で、`translations` / `controls` / `linkSafety` / `urlTransform` / `components` / `plugins` / `dir` / `icons` などが指定できます。`className` と `mode` はこのライブラリが握ります（`mode` は `isStreaming` から決まります）。 - **`linkSafety` の既定を `{ enabled: false }` にしました（streamdown の既定は `{ enabled: true }`）。** streamdown は有効時にリンクを `` ではなく ` ``` - **`IconLink` を削除**: `IconButton` の `renderItem` で `` を返す形に置き換える。Tooltip 連携用の props は `triggerProps` で渡される。 ```tsx // Before // After ( {children} )} > ``` ### Additions - `Button` に `active?: boolean` prop を追加（旧 `LinkButton` のアクティブ状態スタイル） - `Button` に `renderItem?: (props: { className, children }) => ReactNode` prop を追加 - `IconButton` に `renderItem?: (props: { className, children, 'aria-label', triggerProps }) => ReactNode` prop を追加 - `IconButtonTriggerProps` 型を export ### Cleanups - `Tooltip` の `onFocus` を `:focus-visible` チェック付きに変更。マウスクリック直後など focus-visible にならないケースで tooltip が auto-open しなくなった - `Button` の `active` prop を `isActive` に rename（CLAUDE.md の命名規約に合わせる） ### Notes - `renderItem` を指定した場合、`disabled` / `onAction` / Spinner などのボタン専用機能は適用されない（リンクには無関係なため） - `renderItem` 内で適切な `href` / `target` / `rel` 等のリンク属性を指定する責任は利用者側にある - [#451](https://github.com/k35o/ArteOdyssey/pull/451) [`27da7f0`](https://github.com/k35o/ArteOdyssey/commit/27da7f03032a2f988ae10a8cfa98437d915004d5) Thanks [@k35o](https://github.com/k35o)! - Styled element 系コンポーネントが `HTMLAttributes` を受けるようになった。`id` / `data-*` / `aria-*` / `style` / event handlers / `className` 等が普通に渡せるようになり、テストや analytics の attrs を component 編集なしで追加できる。 ### 対象 | Component | 受ける attrs | | -------------------------- | ------------------------------------------------------------------------ | | `Avatar` | `HTMLAttributes` | | `Badge` | `HTMLAttributes` (interactive モードでは `