sgcHTML 機能マトリックス
ライブラリ内のすべてのコンポーネントを、8 つのファミリーに整理しています。それぞれが Bootstrap 5 マークアップにレンダリングされ、Delphi、C++ Builder、.NET で同じように動作します。コンポーネントをクリックすると、使い方と例を載せた専用ページが開きます。
ライブラリ内のすべてのコンポーネントを、8 つのファミリーに整理しています。それぞれが Bootstrap 5 マークアップにレンダリングされ、Delphi、C++ Builder、.NET で同じように動作します。コンポーネントをクリックすると、使い方と例を載せた専用ページが開きます。
12 コンポーネント
7 コンポーネント
4 コンポーネント
12 コンポーネント
7 コンポーネント
8 コンポーネント
3 コンポーネント
4 コンポーネント
データセットを直接レンダリングするグリッド、カレンダー、ボード。
| コンポーネント | クラス | 説明 |
|---|---|---|
| Grid | TsgcHTMLComponent_Grid | 多機能なテーブル。並べ替え、フィルター、CSV/PDF エクスポート、インライン編集、グループ化、仮想スクロール、AI クエリに対応。 |
| DataTable | TsgcHTMLComponent_DataTable | Grid + Pagination をラップした高レベルのデータテーブル。ツールバー、検索、行数表示を備えます。 |
| Calendar | TsgcHTMLComponent_Calendar | イベントドットと前後ナビゲーションを備えた月グリッドカレンダー。 |
| Scheduler | TsgcHTMLComponent_Scheduler | 日付ごとにイベントを表示するカレンダースケジューラー（月 / 週ビュー）。 |
| Timeline | TsgcHTMLComponent_Timeline | 日付付きイベントの縦型タイムライン。データセットから読み込めます。 |
| KanbanBoard | TsgcHTMLComponent_KanbanBoard | 列とドラッグ可能なカードからなるカンバンボード。 |
| Gantt | TsgcHTMLComponent_Gantt | タスクの進捗バーを備えたガントチャート形式のプロジェクトタイムライン。 |
あなた自身の数値から構築するデータ駆動のビジュアル。
| コンポーネント | クラス | 説明 |
|---|---|---|
| Chart | TsgcHTMLComponent_Chart | Chart.js チャート。折れ線、棒、円、ドーナツ、レーダー、極座標、バブル、散布図に対応。 |
| Gauge | TsgcHTMLComponent_Gauge | 低 / 中 / 高のカラーしきい値を備えた半円形 SVG ゲージ。 |
| Diagram | TsgcHTMLComponent_Diagram | インライン SVG としてレンダリングされる、ノードと矢印のフロー図。 |
| Map | TsgcHTMLComponent_Map | マーカー付きの Leaflet.js インタラクティブマップ（OpenStreetMap / CartoDB タイル）。 |
データ入力に必要なすべて。バリデーションとデータセットバインドを備えています。
| コンポーネント | クラス | 説明 |
|---|---|---|
| Form | TsgcHTMLComponent_Form | バリデーション、レイアウト、AI フォーム生成に対応した、データ駆動のフォームビルダー。 |
| Edit | TsgcHTMLComponent_Edit | ラベル、ヘルプテキスト、データセットバインドを備えた単一行テキスト入力。 |
| Memo | TsgcHTMLComponent_Memo | ラベルとヘルプテキストを備えた複数行のテキストエリア入力。 |
| CheckBox | TsgcHTMLComponent_CheckBox | ラベルとチェック状態を備えたチェックボックス入力。 |
| RadioGroup | TsgcHTMLComponent_RadioGroup | 相互排他的なラジオオプションのグループ。 |
| Select | TsgcHTMLComponent_Select | オプショングループ、複数選択、データセットバインドを備えたセレクトドロップダウン。 |
| InputGroup | TsgcHTMLComponent_InputGroup | 前後にアドオンテキストを付けられる入力。 |
| AutoComplete | TsgcHTMLComponent_AutoComplete | HTML5 の datalist による候補を備えたテキスト入力。 |
| DatePicker | TsgcHTMLComponent_DatePicker | ネイティブな日付 / 時刻 / 日時の入力フィールド。 |
| FileUpload | TsgcHTMLComponent_FileUpload | マルチパートフォーム送信に対応した、ドラッグ＆ドロップのファイルアップロードゾーン。 |
| RichEditor | TsgcHTMLComponent_RichEditor | 隠しフォームフィールドを備えた、Quill ベースの WYSIWYG リッチテキストエディター。 |
| Rating | TsgcHTMLComponent_Rating | 星（記号）による評価の表示または入力。 |
ページをレイアウトするためのカード、メディア、KPI タイル。
| コンポーネント | クラス | 説明 |
|---|---|---|
| Panel | TsgcHTMLComponent_Panel | ヘッダー / ボディ / フッターを備え、折りたたみとスクロールが可能な Bootstrap カードパネル。 |
| StatCard | TsgcHTMLComponent_StatCard | アイコン、トレンド矢印、任意のグラデーションを備えたダッシュボードの KPI / 統計カード。 |
| Accordion | TsgcHTMLComponent_Accordion | 展開可能なパネルを縦に積み重ねた、垂直に折りたためるアコーディオン。 |
| Carousel | TsgcHTMLComponent_Carousel | インジケーター、コントロール、自動再生を備えた画像スライドショー / カルーセル。 |
| Image | TsgcHTMLComponent_Image | 形状、レスポンシブ / 遅延読み込み、ライトボックスリンク、キャプションを備えた画像。 |
| Avatar | TsgcHTMLComponent_Avatar | サイズ、形状、プレゼンスステータスのドットを備えたユーザーアバター（画像またはイニシャル）。 |
| Video | TsgcHTMLComponent_Video | HTML5 の動画 / 音声プレーヤーと、YouTube 埋め込みヘルパー。 |
ダイアログ、ステータス表示、読み込み状態。
| コンポーネント | クラス | 説明 |
|---|---|---|
| Modal | TsgcHTMLComponent_Modal | タイトル / ボディ / フッター、サイズ、中央寄せ、静的バックドロップを備えたモーダルダイアログ。 |
| Offcanvas | TsgcHTMLComponent_Offcanvas | 左、右、上、下からスライドインするオフキャンバスパネル。 |
| Popover | TsgcHTMLComponent_Popover | トリガー要素上に表示されるポップオーバーの吹き出し（クリック / ホバー / フォーカス）。 |
| Toast | TsgcHTMLComponent_Toast | ヘッダー、ボディ、タイムスタンプ、自動非表示を備えたトースト通知。 |
| Snackbar | TsgcHTMLComponent_Snackbar | 任意のアクションを備えた、マテリアルスタイルの一時的なスナックバー。 |
| Notification | TsgcHTMLComponent_Notification | 未読バッジを備えた、ベルアイコンのドロップダウン通知センター。 |
| Spinner | TsgcHTMLComponent_Spinner | サイズと色を指定できる読み込みスピナー（ボーダー / グロー）。 |
| Placeholder | TsgcHTMLComponent_Placeholder | アニメーションするシマー付きのスケルトン / プレースホルダー読み込みカード。 |
シンプルな吹き出しから、ストリーミング対応の AI アシスタントまでの会話 UI。
パスワードからパスキーまで、既製のサインインフロー。
| コンポーネント | クラス | 説明 |
|---|---|---|
| Login | TsgcHTMLComponent_Login | 記憶機能とアラートを備えた既製のログインフォーム / ページ（カード、中央寄せ、または全画面）。 |
| SocialLogin | TsgcHTMLComponent_SocialLogin | OAuth ソーシャルログインボタンのパネル（Google、Facebook、Apple、GitHub、Microsoft など）。 |
| OAuthCallback | TsgcHTMLComponent_OAuthCallback | 自動リダイレクト付きの、成功 / エラー / 読み込み状態を表す OAuth コールバック / ランディングページ。 |
| WebAuthnLogin | TsgcHTMLComponent_WebAuthnLogin | パスワード不要のパスキー / WebAuthn ログイン・登録ウィジェット。 |
ページを配信し、ライブな状態を保つ非ビジュアルな要素。
| クラス | 役割 |
|---|---|
TsgcHTMLEngine_Server | レンダリングされたページと組み込みアセットを配信する、TsgcWebSocketHTTPServer にバインドされた HTML エンジン。 |
TsgcHTMX_Engine_Server | 同じサーバーに接続された htmx エンジン。HTTP 経由の部分ページ差し替えと、WebSocket 経由のライブサーバープッシュを実現します。 |
TsgcHTMLPageBuilder | 登録済みコンポーネントを完全なレスポンシブページに組み立てます（デザイン時のビジュアルエディター付き）。 |
TsgcHTMLTemplate_Bootstrap | ボディコンテンツを、テーマ・言語・方向を備えた完全な Bootstrap 5 HTML ドキュメントでラップします。 |
TsgcHTMLThemeController / TsgcHTMLThemeBuilder | ライト / ダークのテーマと、Bootstrap CSS 変数を出力するランタイム CSS ジェネレーター。 |
TsgcHTMX_Fragment / TsgcHTMX_Router | ライブ更新向けのアウトオブバンド htmx フラグメントと、リクエストルーティングのヘルパー。 |