sgcHTML Matrice des fonctionnalités

Composant	Classe	Description	Aide
NavBar	`TsgcHTMLComponent_NavBar`	Barre de navigation supérieure responsive avec marque et menus repliables.	Docs
Sidebar	`TsgcHTMLComponent_Sidebar`	Navigation latérale verticale avec icônes, en-têtes, séparateurs et un pied de page.	Docs
Breadcrumb	`TsgcHTMLComponent_Breadcrumb`	Fil d'Ariane affichant l'emplacement actuel dans une hiérarchie.	Docs
Tabs	`TsgcHTMLComponent_Tabs`	Jeu d'onglets en style onglet, pilule ou soulignement avec des volets de contenu commutables.	Docs
Pagination	`TsgcHTMLComponent_Pagination`	Contrôle de navigation par pages dérivé du nombre d'éléments ou de pages.	Docs
Toolbar	`TsgcHTMLComponent_Toolbar`	Barre d'outils regroupant des boutons avec séparateurs et infobulles.	Docs
TreeView	`TsgcHTMLComponent_TreeView`	Arbre hiérarchique repliable, chargeable depuis un jeu de données.	Docs
Stepper	`TsgcHTMLComponent_Stepper`	Indicateur d'assistant / de progression par étapes, horizontal ou vertical.	Docs
Dropdown	`TsgcHTMLComponent_Dropdown`	Bouton déroulant avec un menu de liens, en-têtes et séparateurs.	Docs
ButtonGroup	`TsgcHTMLComponent_ButtonGroup`	Ensemble segmenté de boutons, horizontal ou vertical.	Docs
ListGroup	`TsgcHTMLComponent_ListGroup`	Groupe de listes de liens ou d'éléments avec badges et contenu supplémentaire.	Docs
DashboardLayout	`TsgcHTMLDashboardLayout`	Coque complète de tableau de bord avec une barre latérale fixe et des sections de contenu.	Docs
Site	`TsgcHTMLComponent_Site`	Coque de page complète — en-tête, menu de navigation, contenu et pied de page — avec un modèle de mise en page interchangeable.	Docs
Splitter	`TsgcHTMLComponent_Splitter`	Deux volets redimensionnables avec une gouttière déplaçable, horizontale ou verticale, avec une position persistée optionnelle.	Docs

Données & Tableaux

Grilles, calendriers et tableaux qui rendent vos jeux de données directement.

Composant	Classe	Description	Aide
Grid	`TsgcHTMLComponent_Grid`	Tableau riche en fonctionnalités : tri, filtre, export CSV/PDF, édition en ligne, regroupement, défilement virtuel et requête IA.	Docs
DataTable	`TsgcHTMLComponent_DataTable`	Tableau de données de plus haut niveau enveloppant Grid + Pagination avec une barre d'outils, une recherche et un décompte de lignes.	Docs
Calendar	`TsgcHTMLComponent_Calendar`	Calendrier en grille mensuelle avec points d'événements et navigation précédent/suivant.	Docs
Scheduler	`TsgcHTMLComponent_Scheduler`	Planificateur de calendrier (vues mois / semaine) rendant les événements par date.	Docs
Timeline	`TsgcHTMLComponent_Timeline`	Chronologie verticale d'événements datés, chargeable depuis un jeu de données.	Docs
KanbanBoard	`TsgcHTMLComponent_KanbanBoard`	Tableau Kanban de colonnes et de cartes déplaçables.	Docs
Gantt	`TsgcHTMLComponent_Gantt`	Diagramme de Gantt de planning de projet avec barres de progression des tâches.	Docs
TreeGrid	`TsgcHTMLComponent_TreeGrid`	Tableau Bootstrap avec des lignes hiérarchiques repliables construites à partir de paires de nœuds Id/ParentId.	Docs
PivotTable	`TsgcHTMLComponent_PivotTable`	Tableau croisé dynamique Bootstrap qui regroupe les lignes et les colonnes et agrège les mesures avec des totaux de ligne, de colonne et généraux.	Docs
ActivityFeed	`TsgcHTMLComponent_ActivityFeed`	Flux d'activité en direct, du plus récent au plus ancien, avec horodatages relatifs et envoi WebSocket hors-bande.	Docs
AuditTrail	`TsgcHTMLComponent_AuditTrail`	Flux de journal d'audit chronologique des actions des utilisateurs et du système avec acteur, action, cible et horodatage.	Docs

Graphiques & Visualisation

Des visuels pilotés par les données, construits à partir de vos propres chiffres.

Composant	Classe	Description	Aide
Chart	`TsgcHTMLComponent_Chart`	Graphique Chart.js : ligne, barre, secteurs, anneau, radar, polaire, bulles et nuage de points.	Docs
Gauge	`TsgcHTMLComponent_Gauge`	Jauge SVG semi-circulaire avec seuils de couleur bas / moyen / haut.	Docs
Diagram	`TsgcHTMLComponent_Diagram`	Diagramme de flux à nœuds et flèches rendu en SVG en ligne.	Docs
Map	`TsgcHTMLComponent_Map`	Carte interactive Leaflet.js (tuiles OpenStreetMap / CartoDB) avec marqueurs.	Docs
Heatmap	`TsgcHTMLComponent_Heatmap`	Grille de carte de chaleur SVG à échelle de couleur à partir de valeurs de cellules ou d'un jeu de données lié, avec légende et libellés de ligne/colonne.	Docs
Sparkline	`TsgcHTMLComponent_Sparkline`	Sparkline SVG compacte, en ligne, barre ou aire, intégrée dans le texte, à partir d'une série de valeurs ou d'un jeu de données lié.	Docs
CandlestickChart	`TsgcHTMLComponent_CandlestickChart`	Graphique en chandeliers OHLC en SVG avec mèches, couleurs hausse/baisse et bande de volume optionnelle.	Docs
QRCode	`TsgcHTMLComponent_QRCode`	Code QR SVG ISO/IEC 18004 en Pascal pur à partir de tout texte ou URL, avec niveau de correction d'erreur sélectionnable.	Docs
Barcode	`TsgcHTMLComponent_Barcode`	Code-barres Code 128 SVG en Pascal pur à partir de tout texte ASCII, avec légende lisible optionnelle.	Docs
TreeMap	`TsgcHTMLComponent_TreeMap`	Treemap « squarifié » rendu en SVG en ligne, autonome et généré côté serveur, sans bibliothèque de graphiques requise.	Docs

Formulaires & Saisies

Tout ce dont vous avez besoin pour capturer des données, avec validation et liaison aux jeux de données.

Composant	Classe	Description	Aide
Form	`TsgcHTMLComponent_Form`	Générateur de formulaires piloté par les données avec validation, mises en page et génération de formulaires par IA.	Docs
Edit	`TsgcHTMLComponent_Edit`	Champ de saisie de texte sur une ligne avec libellé, texte d'aide et liaison aux jeux de données.	Docs
Memo	`TsgcHTMLComponent_Memo`	Zone de saisie de texte multiligne avec libellé et texte d'aide.	Docs
CheckBox	`TsgcHTMLComponent_CheckBox`	Case à cocher avec libellé et état coché.	Docs
RadioGroup	`TsgcHTMLComponent_RadioGroup`	Groupe d'options radio mutuellement exclusives.	Docs
Select	`TsgcHTMLComponent_Select`	Liste déroulante de sélection avec groupes d'options, sélection multiple et liaison aux jeux de données.	Docs
InputGroup	`TsgcHTMLComponent_InputGroup`	Saisie avec texte d'addon en préfixe / suffixe.	Docs
AutoComplete	`TsgcHTMLComponent_AutoComplete`	Champ de saisie adossé à une datalist HTML5 de suggestions.	Docs
DatePicker	`TsgcHTMLComponent_DatePicker`	Champ de saisie natif date / heure / date-heure.	Docs
FileUpload	`TsgcHTMLComponent_FileUpload`	Zone d'envoi de fichiers par glisser-déposer avec soumission de formulaire multipart.	Docs
RichEditor	`TsgcHTMLComponent_RichEditor`	Éditeur de texte enrichi WYSIWYG basé sur Quill avec champ de formulaire masqué.	Docs
Rating	`TsgcHTMLComponent_Rating`	Affichage ou saisie de notation par étoiles (symboles).	Docs
MultiSelect	`TsgcHTMLComponent_MultiSelect`	Une liste déroulante Bootstrap à sélection multiple et recherche, avec puces, options groupées et liaison aux jeux de données.	Docs
ColorPicker	`TsgcHTMLComponent_ColorPicker`	Une saisie de couleur HTML5 native avec un champ de texte hexadécimal optionnel et des nuanciers prédéfinis.	Docs
Slider	`TsgcHTMLComponent_Slider`	Un curseur de plage Bootstrap avec un badge de valeur en direct, des libellés min/max et une coloration.	Docs
TimePicker	`TsgcHTMLComponent_TimePicker`	Une saisie d'heure HTML5 native avec bornes min/max et une granularité à la seconde.	Docs
SignaturePad	`TsgcHTMLComponent_SignaturePad`	Un pavé de signature sur canevas basé sur les événements pointeur, avec les actions Effacer, Annuler et Enregistrer.	Docs
Transfer	`TsgcHTMLComponent_Transfer`	Widget à double liste pour déplacer des éléments entre un panneau disponible et un panneau assigné, avec filtrage et liaison aux jeux de données.	Docs
DateTimePicker	`TsgcHTMLComponent_DateTimePicker`	Sélecteur de date et d'heure HTML5 natif combinant calendrier et horloge dans un seul champ.	Docs
DateRangePicker	`TsgcHTMLComponent_DateRangePicker`	Champs de date de début et de fin appariés pour choisir une plage de dates, avec bornes min/max.	Docs
RangeSlider	`TsgcHTMLComponent_RangeSlider`	Curseur à deux poignées sélectionnant une paire de valeurs basse/haute, avec badges de valeur en direct.	Docs

Contenu & Mise en page

Cartes, médias et tuiles d'indicateurs pour agencer une page.

Composant	Classe	Description	Aide
Panel	`TsgcHTMLComponent_Panel`	Panneau-carte Bootstrap avec en-tête / corps / pied de page, repliable et défilable.	Docs
StatCard	`TsgcHTMLComponent_StatCard`	Carte d'indicateur / de statistique de tableau de bord avec icône, flèche de tendance et dégradé optionnel.	Docs
Accordion	`TsgcHTMLComponent_Accordion`	Accordéon à repliement vertical de panneaux empilés et déployables.	Docs
Carousel	`TsgcHTMLComponent_Carousel`	Diaporama / carrousel d'images avec indicateurs, contrôles et lecture automatique.	Docs
Image	`TsgcHTMLComponent_Image`	Image avec forme, responsive / chargement différé, lien lightbox et légende.	Docs
Avatar	`TsgcHTMLComponent_Avatar`	Avatar utilisateur (image ou initiales) avec taille, forme et point d'état de présence.	Docs
Video	`TsgcHTMLComponent_Video`	Lecteur vidéo / audio HTML5 ainsi qu'un assistant d'intégration YouTube.	Docs
Badge	`TsgcHTMLComponent_Badge`	Badge Bootstrap unique avec couleur, forme pilule, une icône en ligne et un mode point de notification positionné.	Docs
PDFViewer	`TsgcHTMLComponent_PDFViewer`	Visionneuse PDF intégrée à la page, basée sur pdf.js, avec navigation entre pages, zoom, recherche, téléchargement et impression.	Docs
Chip	`TsgcHTMLComponent_Chip`	Puce / étiquette compacte avec une icône optionnelle, une couleur et un bouton de fermeture amovible.	Docs

Surcouches & Retours

Boîtes de dialogue, surfaces d'état et états de chargement.

Composant	Classe	Description	Aide
Modal	`TsgcHTMLComponent_Modal`	Boîte de dialogue modale avec titre / corps / pied de page, tailles, centrée et arrière-plan statique.	Docs
Offcanvas	`TsgcHTMLComponent_Offcanvas`	Panneau coulissant hors-canevas depuis la gauche, la droite, le haut ou le bas.	Docs
Popover	`TsgcHTMLComponent_Popover`	Bulle popover sur un élément déclencheur (clic / survol / focus).	Docs
Toast	`TsgcHTMLComponent_Toast`	Notification toast avec en-tête, corps, horodatage et masquage automatique.	Docs
Snackbar	`TsgcHTMLComponent_Snackbar`	Snackbar transitoire de style Material avec une action optionnelle.	Docs
Notification	`TsgcHTMLComponent_Notification`	Centre de notifications déroulant à icône cloche avec un badge de non-lus.	Docs
Spinner	`TsgcHTMLComponent_Spinner`	Indicateur de chargement (bordure / croissance), dimensionné et coloré.	Docs
Placeholder	`TsgcHTMLComponent_Placeholder`	Carte de chargement en squelette / espace réservé avec un effet de scintillement animé.	Docs
ContextMenu	`TsgcHTMLComponent_ContextMenu`	Menu contextuel (clic droit) limité à un sélecteur CSS, avec icônes, séparateurs, en-têtes et actions routées côté serveur.	Docs
JobProgress	`TsgcHTMLComponent_JobProgress`	Liste en direct de barres de progression de tâches en arrière-plan avec badges d'état, boutons d'annulation et mises à jour de fragments hors-bande.	Docs
LogViewer	`TsgcHTMLComponent_LogViewer`	Visionneuse de journaux / terminal en streaming avec filtre de niveau, recherche et défilement automatique.	Docs
ProgressBar	`TsgcHTMLComponent_ProgressBar`	Barre de progression Bootstrap, rayée et animée, à segment unique ou empilée multi-segments.	Docs

Chat & IA

Interface conversationnelle, des simples bulles à un assistant IA en streaming.

Composant	Classe	Description	Aide
ChatBox	`TsgcHTMLComponent_ChatBox`	Boîte à bulles de chat de style carte avec une barre de saisie et un indicateur de frappe.	Docs
Chat	`TsgcHTMLComponent_Chat`	Chat de style WhatsApp avec messages texte / image / fichier / audio / vidéo, accusés de lecture et réponses.	Docs
AIChat	`TsgcHTMLComponent_AIChat`	Chat d'assistant IA avec sélecteur de fournisseur / modèle, streaming de jetons et citations de sources RAG.	Docs
Presence	`TsgcHTMLComponent_Presence`	Liste « Qui est en ligne » sous forme de pile d'avatars ou de liste, avec mises à jour d'état en direct.	Docs

Authentification

Des flux de connexion prêts à l'emploi, des mots de passe aux passkeys.

Composant	Classe	Description	Aide
Login	`TsgcHTMLComponent_Login`	Formulaire / page de connexion prêt à l'emploi (carte, centré ou pleine page) avec « se souvenir de moi » et alertes.	Docs
SocialLogin	`TsgcHTMLComponent_SocialLogin`	Panneau de boutons de connexion sociale OAuth (Google, Facebook, Apple, GitHub, Microsoft et plus).	Docs
OAuthCallback	`TsgcHTMLComponent_OAuthCallback`	Page de rappel / d'atterrissage OAuth en état succès, erreur ou chargement avec redirection automatique.	Docs
WebAuthnLogin	`TsgcHTMLComponent_WebAuthnLogin`	Widget de connexion et d'enregistrement par passkey / WebAuthn sans mot de passe.	Docs
RolesPermissions	`TsgcHTMLComponent_RolesPermissions`	Matrice de rôles / permissions avec une case à cocher par cellule et des mises à jour d'octroi en direct via WebSocket.	Docs
UserManagement	`TsgcHTMLComponent_UserManagement`	Tableau d'administration des utilisateurs avec rôles, statut, recherche et un menu déroulant d'actions par ligne.	Docs
ImpersonateBanner	`TsgcHTMLComponent_ImpersonateBanner`	Bannière d'usurpation d'identité admin affichée lorsqu'on agit en tant qu'un autre utilisateur, avec une sortie en un clic.	Docs

Infrastructure

Moteur, Serveur & Thèmes

Les pièces non visuelles qui servent les pages et les maintiennent vivantes.

Composant	Classe	Description	Aide
EngineServer	`TsgcHTMLEngine_Server`	Moteur HTML lié à un `TsgcWebSocketHTTPServer` qui sert les pages rendues et les ressources intégrées.	Docs
HTMXEngine	`TsgcHTMX_Engine_Server`	Moteur htmx câblé au même serveur. Il s'accroche aux gestionnaires HTTP et WebSocket, distribue les requêtes et messages entrants, et pousse ou diffuse des fragments HTML vers les navigateurs connectés en temps réel (`DispatchRequest`, `DispatchMessage`, `PushFragment`, `BroadcastFragment`).	Docs
PageBuilder	`TsgcHTMLPageBuilder`	Assemble les composants enregistrés en une page responsive complète (avec un éditeur visuel à la conception).	Docs
TemplateBootstrap	`TsgcHTMLTemplate_Bootstrap`	Enveloppe le contenu du corps dans un document HTML Bootstrap 5 complet avec thème, langue et direction.	Docs
ThemeController	`TsgcHTMLThemeController`	Sélecteur de thème à l'exécution dont la propriété `Theme` (`ptDefault`, `ptDark`, `ptDarkPro`) applique le thème sélectionné et la feuille de style partagée à la page.	Docs
ThemeBuilder	`TsgcHTMLThemeBuilder`	Générateur CSS dont le `Mode` (`tmLight`, `tmDark`, `tmSystem`) écrit les variables CSS de Bootstrap à partir des valeurs de propriétés, avec un script optionnel de synchronisation sur la préférence du système d'exploitation pour `tmSystem`.	Docs
HTMXFragment	`TsgcHTMX_Fragment`	Fragment htmx hors-bande pour envoyer une mise à jour de page partielle du serveur vers le navigateur.	Docs
HTMXRouter	`TsgcHTMX_Router`	Table de routage de `Routes` qui fait correspondre un chemin de requête entrant et le distribue (via `HandleRequest`) au gestionnaire `OnRoute` de cette route.	Docs

Navigation & Structure