UI 統合

プラグインの UI は React で書き、useNiyase() ブリッジ経由でデータ・通知・ナビにアクセスします。 1 プラグイン = サイドバー（cloud / desktop）またはシェルフ（mobile）に 1 メニュー項目（役割別に表示が変わる）。

useNiyase() の全面

名前空間	用途
niyase.data	自プラグインの plg_* テーブル CRUD（データモデル）
niyase.core	コアデータ読み取り（社員・部署・スペース、コア API）
niyase.connections	PROVIDER-CLIENT 型のみ。接続の一覧/招待/申請/承認/停止/終了と、data(connectionId) による接続スコープの共有テーブル CRUD
niyase.context	{ spaceId, workspaceType, role, audience, locale, theme, plugin }（反応的。値が変わると購読者に届く）
niyase.i18n	t(key, vars?) / locale。プラグインが自前で持つ ja/en メッセージを context.locale で解決する
niyase.navigate	自プラグインのタブ / ルート内ナビ
niyase.toast	success / error / info 通知
niyase.palette	統合パレットの intent 登録 / 発火（paletteMetadata と連動）

const niyase = useNiyase();

// 反応的コンテキスト購読（テーマ・言語の切替に追従）
useEffect(() => niyase.context.subscribe((ctx) => setTheme(ctx.theme)), []);

// プラグイン自前の ja/en メッセージを解決
const title = niyase.i18n.t("task.title", { count: 3 });

niyase.toast.success("保存しました");
niyase.navigate.toTab("settings");

niyase.connections はクラウドスペース限定です。ローカルスペース（純ローカルの desktop PGlite / mobile SQLite）で呼び出すと CLOUD_REQUIRED エラーコードが返ります。PROVIDER-CLIENT 型プラグインは manifest の requiresCloud: true と組み合わせて設計してください（マニフェスト 参照）。

audience（表示ロール）と resolveAudience()

manifest.audiences[] で役割別の表示を宣言します。配列に含まれていないロールには、サイドメニューにもタブにも一切表示されません。

audience	想定ユーザー	表示
executive	経営者・管理者	管理系 + 実行系のすべてのタブ
employee	社員	実行系タブのみ
customer	取引先（PROVIDER-CLIENT 型の CLIENT 側）	顧客向けタブのみ

niyase.context.audience に入る値は、manifest の defaultRole そのものではなく、有効化時に決まる plugin_activation.role（PROVIDER / CLIENT / LOCAL）と、現在のユーザーが管理者かどうかから resolveAudience(role, isAdmin) が導出します。

role === "CLIENT"  → audience = "customer"
isAdmin === true   → audience = "executive"
それ以外            → audience = "employee"

つまり defaultRole は「有効化したときに何のロールから始まるか」を決めるだけで、実際に画面へ出る audience は毎回ユーザーごとに動的に決まります。経営者は既定で「管理系 + 実行系の全部入り」タブを見ますが、実行系タブだけに絞りたい場合は本体側の TabSettings（表示設定）で非表示にできます——これはプラグイン側で作り込む必要はありません。

UI コンポーネント

niyase の UI コンポーネントは @niyase/plugin-sdk/ui から import します（ホストが本物を供給）。

import {
  Button,
  Input,
  Tabs,
  TabsList,
  TabsTrigger,
  TabsContent,
} from "@niyase/plugin-sdk/ui";

素の HTML + Tailwind ライクなクラスでも書けます。niyase.context.theme（light/dark）に追従するよう、 色は意味トークンで扱うのが安全です。

3 アプリで同一バンドル

ビルドした 1 つのバンドルが、cloud（Web）・desktop（Electron）・mobile（Expo）で動きます。3 アプリとも、プラグインは本体の描画コンテキストとは別の隔離された実行文脈（cloud = sandbox iframe、desktop = <webview>、mobile = React Native WebView）で動き、useNiyase() の呼び出しは postMessage 経由でホストへ届きます。この隔離はセキュリティ境界であり、通信方式の違いは SDK が吸収するため、プラグイン側のコードは 3 アプリ共通です。

プラグインのナビ項目（audiences[].nav）は、宣言した category に応じて cloud / desktop のセクションナビ列、または mobile のシェルフ（左オーバーレイの 2 段組みドロワー）内のメニュー一覧に現れます。専用の AppBar・ハンバーガーメニューは存在しません（3 アプリともアプリバーを廃止済み）。ページ本体は本体側の標準タブレイアウトの中に描画されます。

ローカルで見た目を確認

niyase-plugin dev

本物そっくりの汎用シェルの中で実際に描画し、DevBar でロール・スペース種別・テーマ・言語を切り替えながら確認できます （セットアップ 参照）。