CommandPalette
TsgcHTMLComponent_CommandPalette — l'overlay Ctrl+K / Cmd+K familier de VS Code, Slack et Linear, avec un filtrage par sous-chaîne puis flou, des catégories et des actions routées côté serveur, en Delphi, C++ Builder et .NET.
TsgcHTMLComponent_CommandPalette — l'overlay Ctrl+K / Cmd+K familier de VS Code, Slack et Linear, avec un filtrage par sous-chaîne puis flou, des catégories et des actions routées côté serveur, en Delphi, C++ Builder et .NET.
Ajoutez des entrées avec AddItem ou Items.Add, puis lisez la propriété HTML ; Ctrl+K (ou Cmd+K) ouvre l'overlay, la saisie le filtre, Entrée active la sélection.
TsgcHTMLComponent_CommandPalette
Overlay Ctrl+K caché + script en ligne
Delphi, C++ Builder, .NET
Les entrées sont rendues en balisage côté serveur, et non envoyées au navigateur sous forme de JSON à filtrer côté client, de sorte que chaque libellé est encodé en HTML une seule fois.
uses
sgcHTML_Component_CommandPalette;
var
oPalette: TsgcHTMLComponent_CommandPalette;
begin
oPalette := TsgcHTMLComponent_CommandPalette.Create(nil);
try
oPalette.PaletteID := 'app_commands';
oPalette.AddItem('New Invoice', '/invoices/new', 'invoice:new', 'Create', 'Ctrl+N');
oPalette.AddItem('Customer Search', '/customers', '', 'Navigate');
with oPalette.Items.Add do
begin
Caption := 'Export Report';
Icon := 'bi bi-download';
DataAction := 'report:export';
Category := 'Actions';
end;
WebModule.Response := oPalette.HTML; // hidden overlay + inline script
finally
oPalette.Free;
end;
end;// includes: sgcHTML_Component_CommandPalette.hpp
TsgcHTMLComponent_CommandPalette *oPalette = new TsgcHTMLComponent_CommandPalette(NULL);
try
{
oPalette->PaletteID = "app_commands";
oPalette->AddItem("New Invoice", "/invoices/new", "invoice:new", "Create", "Ctrl+N");
TsgcHTMLCommandItem *oItem = oPalette->Items->Add();
oItem->Caption = "Export Report";
oItem->Icon = "bi bi-download";
oItem->DataAction = "report:export";
oItem->Category = "Actions";
String html = oPalette->HTML; // hidden overlay + inline script
}
__finally
{
delete oPalette;
}using esegece.sgcWebSockets;
var palette = new TsgcHTMLComponent_CommandPalette();
palette.PaletteID = "app_commands";
palette.AddItem("New Invoice", "/invoices/new", "invoice:new", "Create", "Ctrl+N");
var item = palette.Items.Add();
item.Caption = "Export Report";
item.Icon = "bi bi-download";
item.DataAction = "report:export";
item.Category = "Actions";
string html = palette.HTML; // hidden overlay + inline scriptLes membres que vous utilisez le plus souvent.
Collection d'entrées TsgcHTMLCommandItem : Caption, Description, Icon, Href, DataAction, Shortcut (affichage seul), Category et Enabled.
Méthode pratique qui ajoute une entrée et la renvoie, afin que vous puissiez encore définir Icon/Description ensuite.
Un caractère unique plus des modificateurs ; Ctrl et Meta valent True par défaut, si bien que Ctrl+K et Cmd+K l'ouvrent tous les deux d'emblée.
Par défaut 10 ; 0 affiche toutes les entrées correspondantes à la fois.
Par défaut True, regroupe la liste sous des en-têtes dans l'ordre de première apparition (pas alphabétique).
Activer une commande déclenche toujours un événement DOM sgc:command, et pousse via le pont WebSocket sgcHTMX ou envoie en POST vers Action quand l'un des deux est défini.
| Aide en ligneRéférence API complète et guide d'utilisation pour ce composant. | Ouvrir | |
| Tous les composants sgcHTMLParcourez la matrice complète des fonctionnalités de plus de 80 composants. | Ouvrir | |
| Télécharger la version d'essai gratuiteLa version d'essai de 30 jours fournit les projets de démonstration 60.HTML. | Ouvrir | |
| TarifsLicences Single, Team et Site avec code source complet. | Ouvrir |