CommandPalette
TsgcHTMLComponent_CommandPalette — VS Code, Slack, Linear에서 익숙한 Ctrl+K / Cmd+K 오버레이 실행기로, 부분 문자열 우선 퍼지 필터링, 카테고리 및 서버 라우팅 액션을 제공합니다. Delphi, C++ Builder 및 .NET에서 사용할 수 있습니다.
TsgcHTMLComponent_CommandPalette — VS Code, Slack, Linear에서 익숙한 Ctrl+K / Cmd+K 오버레이 실행기로, 부분 문자열 우선 퍼지 필터링, 카테고리 및 서버 라우팅 액션을 제공합니다. Delphi, C++ Builder 및 .NET에서 사용할 수 있습니다.
AddItem 또는 Items.Add로 항목을 추가한 다음 HTML 속성을 읽습니다. Ctrl+K(또는 Cmd+K)로 오버레이를 열고, 입력하면 필터링되며, Enter로 선택 항목을 실행합니다.
TsgcHTMLComponent_CommandPalette
숨김 Ctrl+K 오버레이 + 인라인 스크립트
Delphi, C++ Builder, .NET
항목은 클라이언트 측에서 필터링하기 위해 브라우저로 JSON 형태로 전달되는 대신 서버에서 마크업으로 렌더링되므로, 모든 캡션은 정확히 한 번만 HTML로 인코딩됩니다.
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 script
가장 자주 사용하게 되는 멤버.
TsgcHTMLCommandItem 항목의 컬렉션으로, Caption, Description, Icon, Href, DataAction, Shortcut(표시 전용), Category 및 Enabled를 포함합니다.
항목 하나를 추가하고 이를 반환하는 편의 메서드로, 이후에도 Icon/Description을 설정할 수 있습니다.
단일 문자와 보조키의 조합입니다. Ctrl과 Meta 모두 기본값이 True이므로 Ctrl+K와 Cmd+K가 별도 설정 없이 모두 열립니다.
기본값은 10입니다. 0으로 설정하면 일치하는 모든 항목이 한 번에 표시됩니다.
기본값은 True이며, 목록을(알파벳순이 아닌) 처음 등장한 순서대로 제목 아래에 그룹화합니다.
명령을 실행하면 항상 sgc:command DOM 이벤트가 발생하며, 둘 중 하나가 설정된 경우 sgcHTMX WebSocket 브리지로 전송하거나 Action으로 POST합니다.