syncfusion-blazor-smart-paste

Syncfusion Blazor Smart Paste Button

Syncfusion Blazor Smart Paste Button は、AI を使用してクリップボードのテキストをインテリジェントに読み取り、フォームフィールドに自動入力することで、手動でのデータ入力を不要にします。

使用する場面

次のような場合に、このスキルを使用します。

• AI によるクリップボードからフォームフィールドへの自動入力のために、Blazor フォームに Smart Paste Button を追加する
• AI バックエンド（OpenAI、Azure OpenAI、Ollama、またはカスタム）を設定する
• [SmartPasteField] アノテーションを追加して、フィールドのマッピングを調整する
• ボタンの外観、コンテンツ、動作をカスタマイズする
• カスタムの IChatInferenceService 実装を統合する
• Smart Paste の統合や AI 接続の問題をトラブルシューティングする

前提条件

• .NET SDK 8.0 以降
• Visual Studio 2022（17.0 以降）または Visual Studio Code
• 有効な OpenAI、Azure OpenAI、または Ollama のアカウント（またはカスタム AI バックエンド）
• Blazor Web App（Server レンダーモード）の基本的な知識

クイックセットアップ

次の手順を順番に実行します。

1. 初期セットアップと NuGet のインストール

まず、getting-started.md に従って、次の作業を行います。

• 新しい Blazor Web App Server を作成する
• Syncfusion NuGet パッケージをインストールする
• Syncfusion Blazor サービスを登録する
• 必要な名前空間を追加する

2. AI サービスを設定する

カスタム AI 統合の手順 に進み、次の作業を行います。

• AI プロバイダー（OpenAI、Azure OpenAI、または Ollama）を選択する
• AI サービス固有の NuGet パッケージをインストールする
• Program.cs で AI バックエンドを設定する
• テーマのスタイルシートとスクリプトリソースを追加する

3. 実装とカスタマイズ

implementation-and-customization.md に従って、次の作業を行います。

• Smart Paste Button コンポーネントをフォームに追加する
• アプリケーションを実行してテストする
• カスタムフィールドアノテーションを追加する
• ボタンの外観をカスタマイズする
• カスタム AI サービスを統合する
• よくある問題をトラブルシューティングする

主な機能

機能	詳細
AI によるフォーム入力	クリップボードのテキストを読み取り、データをフォームフィールドに自動でマッピングします
複数の AI バックエンド	OpenAI、Azure OpenAI、Ollama、およびカスタム IChatInferenceService
フィールドアノテーション	正確なフィールドの説明に使う [SmartPasteField] 属性
簡単な統合	NuGet パッケージ 1 つと AddSyncfusionSmartPaste() サービス呼び出し
カスタマイズ可能な UI	すべての SfButton プロパティ（アイコン、コンテンツ、CSS クラス）を継承します

NuGet パッケージ

• Syncfusion.Blazor.SmartComponents（v28.1.33 以降）
• Syncfusion.Blazor.Themes
• AI プロバイダーパッケージ — ai-service-configuration.md を参照

リファレンスドキュメント

ドキュメント	目的
getting-started.md	プロジェクトの作成、NuGet のインストール、サービスの登録
ai-service-configuration.md	AI プロバイダーのセットアップ（OpenAI、Azure OpenAI、Ollama）
implementation-and-customization.md	コンポーネントの使用方法、フィールドアノテーション、カスタマイズ、トラブルシューティング