Chaque composant de la bibliothèque, regroupé en huit familles. Chacun produit du balisage Bootstrap 5 et fonctionne de la même façon en Delphi, C++ Builder et .NET. Cliquez sur un composant pour accéder à sa propre page avec utilisation et exemples.
12 composants
7 composants
4 composants
12 composants
7 composants
8 composants
3 composants
4 composants
Grilles, calendriers et tableaux qui rendent vos jeux de données directement.
| Composant | Classe | Description |
|---|---|---|
| Grid | TsgcHTMLComponent_Grid | Tableau riche en fonctionnalités : tri, filtre, export CSV/PDF, édition en ligne, regroupement, défilement virtuel et requête IA. |
| 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. |
| Calendar | TsgcHTMLComponent_Calendar | Calendrier en grille mensuelle avec points d'événements et navigation précédent/suivant. |
| Scheduler | TsgcHTMLComponent_Scheduler | Planificateur de calendrier (vues mois / semaine) rendant les événements par date. |
| Timeline | TsgcHTMLComponent_Timeline | Chronologie verticale d'événements datés, chargeable depuis un jeu de données. |
| KanbanBoard | TsgcHTMLComponent_KanbanBoard | Tableau Kanban de colonnes et de cartes déplaçables. |
| Gantt | TsgcHTMLComponent_Gantt | Diagramme de Gantt de planning de projet avec barres de progression des tâches. |
Des visuels pilotés par les données, construits à partir de vos propres chiffres.
| Composant | Classe | Description |
|---|---|---|
| Chart | TsgcHTMLComponent_Chart | Graphique Chart.js : ligne, barre, secteurs, anneau, radar, polaire, bulles et nuage de points. |
| Gauge | TsgcHTMLComponent_Gauge | Jauge SVG semi-circulaire avec seuils de couleur bas / moyen / haut. |
| Diagram | TsgcHTMLComponent_Diagram | Diagramme de flux à nœuds et flèches rendu en SVG en ligne. |
| Map | TsgcHTMLComponent_Map | Carte interactive Leaflet.js (tuiles OpenStreetMap / CartoDB) avec marqueurs. |
Tout ce dont vous avez besoin pour capturer des données, avec validation et liaison aux jeux de données.
| Composant | Classe | Description |
|---|---|---|
| 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. |
| Edit | TsgcHTMLComponent_Edit | Champ de saisie de texte sur une ligne avec libellé, texte d'aide et liaison aux jeux de données. |
| Memo | TsgcHTMLComponent_Memo | Zone de saisie de texte multiligne avec libellé et texte d'aide. |
| CheckBox | TsgcHTMLComponent_CheckBox | Case à cocher avec libellé et état coché. |
| RadioGroup | TsgcHTMLComponent_RadioGroup | Groupe d'options radio mutuellement exclusives. |
| Select | TsgcHTMLComponent_Select | Liste déroulante de sélection avec groupes d'options, sélection multiple et liaison aux jeux de données. |
| InputGroup | TsgcHTMLComponent_InputGroup | Saisie avec texte d'addon en préfixe / suffixe. |
| AutoComplete | TsgcHTMLComponent_AutoComplete | Champ de saisie adossé à une datalist HTML5 de suggestions. |
| DatePicker | TsgcHTMLComponent_DatePicker | Champ de saisie natif date / heure / date-heure. |
| FileUpload | TsgcHTMLComponent_FileUpload | Zone d'envoi de fichiers par glisser-déposer avec soumission de formulaire multipart. |
| RichEditor | TsgcHTMLComponent_RichEditor | Éditeur de texte enrichi WYSIWYG basé sur Quill avec champ de formulaire masqué. |
| Rating | TsgcHTMLComponent_Rating | Affichage ou saisie de notation par étoiles (symboles). |
Cartes, médias et tuiles d'indicateurs pour agencer une page.
| Composant | Classe | Description |
|---|---|---|
| Panel | TsgcHTMLComponent_Panel | Panneau-carte Bootstrap avec en-tête / corps / pied de page, repliable et défilable. |
| StatCard | TsgcHTMLComponent_StatCard | Carte d'indicateur / de statistique de tableau de bord avec icône, flèche de tendance et dégradé optionnel. |
| Accordion | TsgcHTMLComponent_Accordion | Accordéon à repliement vertical de panneaux empilés et déployables. |
| Carousel | TsgcHTMLComponent_Carousel | Diaporama / carrousel d'images avec indicateurs, contrôles et lecture automatique. |
| Image | TsgcHTMLComponent_Image | Image avec forme, responsive / chargement différé, lien lightbox et légende. |
| Avatar | TsgcHTMLComponent_Avatar | Avatar utilisateur (image ou initiales) avec taille, forme et point d'état de présence. |
| Video | TsgcHTMLComponent_Video | Lecteur vidéo / audio HTML5 ainsi qu'un assistant d'intégration YouTube. |
Boîtes de dialogue, surfaces d'état et états de chargement.
| Composant | Classe | Description |
|---|---|---|
| Modal | TsgcHTMLComponent_Modal | Boîte de dialogue modale avec titre / corps / pied de page, tailles, centrée et arrière-plan statique. |
| Offcanvas | TsgcHTMLComponent_Offcanvas | Panneau coulissant hors-canevas depuis la gauche, la droite, le haut ou le bas. |
| Popover | TsgcHTMLComponent_Popover | Bulle popover sur un élément déclencheur (clic / survol / focus). |
| Toast | TsgcHTMLComponent_Toast | Notification toast avec en-tête, corps, horodatage et masquage automatique. |
| Snackbar | TsgcHTMLComponent_Snackbar | Snackbar transitoire de style Material avec une action optionnelle. |
| Notification | TsgcHTMLComponent_Notification | Centre de notifications déroulant à icône cloche avec un badge de non-lus. |
| Spinner | TsgcHTMLComponent_Spinner | Indicateur de chargement (bordure / croissance), dimensionné et coloré. |
| Placeholder | TsgcHTMLComponent_Placeholder | Carte de chargement en squelette / espace réservé avec un effet de scintillement animé. |
Interface conversationnelle, des simples bulles à un assistant IA en streaming.
| Composant | Classe | Description |
|---|---|---|
| ChatBox | TsgcHTMLComponent_ChatBox | Boîte à bulles de chat de style carte avec une barre de saisie et un indicateur de frappe. |
| Chat | TsgcHTMLComponent_Chat | Chat de style WhatsApp avec messages texte / image / fichier / audio / vidéo, accusés de lecture et réponses. |
| AIChat | TsgcHTMLComponent_AIChat | Chat d'assistant IA avec sélecteur de fournisseur / modèle, streaming de jetons et citations de sources RAG. |
Des flux de connexion prêts à l'emploi, des mots de passe aux passkeys.
| Composant | Classe | Description |
|---|---|---|
| Login | TsgcHTMLComponent_Login | Formulaire / page de connexion prêt à l'emploi (carte, centré ou pleine page) avec « se souvenir de moi » et alertes. |
| SocialLogin | TsgcHTMLComponent_SocialLogin | Panneau de boutons de connexion sociale OAuth (Google, Facebook, Apple, GitHub, Microsoft et plus). |
| OAuthCallback | TsgcHTMLComponent_OAuthCallback | Page de rappel / d'atterrissage OAuth en état succès, erreur ou chargement avec redirection automatique. |
| WebAuthnLogin | TsgcHTMLComponent_WebAuthnLogin | Widget de connexion et d'enregistrement par passkey / WebAuthn sans mot de passe. |
Les pièces non visuelles qui servent les pages et les maintiennent vivantes.
| Classe | Rôle |
|---|---|
TsgcHTMLEngine_Server | Moteur HTML lié à un TsgcWebSocketHTTPServer qui sert les pages rendues et les ressources intégrées. |
TsgcHTMX_Engine_Server | Moteur htmx câblé au même serveur : échanges de pages partielles via HTTP et envoi serveur en direct via WebSockets. |
TsgcHTMLPageBuilder | Assemble les composants enregistrés en une page responsive complète (avec un éditeur visuel à la conception). |
TsgcHTMLTemplate_Bootstrap | Enveloppe le contenu du corps dans un document HTML Bootstrap 5 complet avec thème, langue et direction. |
TsgcHTMLThemeController / TsgcHTMLThemeBuilder | Thématisation claire / sombre et un générateur CSS à l'exécution écrivant les variables CSS de Bootstrap. |
TsgcHTMX_Fragment / TsgcHTMX_Router | Fragments htmx hors-bande pour les mises à jour en direct et assistants de routage des requêtes. |