Matriz de Recursos do sgcHTML — Todos os Componentes | eSeGeCe

sgcHTML Matriz de Recursos

Cada componente da biblioteca, agrupado em nove famílias. Cada um renderiza para markup Bootstrap 5 e funciona da mesma forma em Delphi, C++ Builder e .NET. A maioria é data-aware, vinculando-se diretamente a um TDataSet via LoadFromDataSet / DataSource (ou uma fonte .NET equivalente). Clique em um componente para acessar sua própria página com uso e exemplos. Todos os componentes aplicam codificação automática de saída de HTML, atributos, JavaScript e URL, além de sanitização de URL, de modo que o conteúdo dinâmico é escapado por padrão para proteger contra XSS e injeção.

14 componentes

Dados & Tabelas

11 componentes

Gráficos & Visualização

10 componentes

Formulários & Entradas

21 componentes

Conteúdo & Layout

10 componentes

Overlays & Feedback

12 componentes

Chat & IA

4 componentes

Autenticação

7 componentes

Infraestrutura

8 classes

Dados & Tabelas

Dados & Tabelas

Grids, calendários e quadros que renderizam seus datasets diretamente.

ComponenteClasseDescriçãoAjuda
GridTsgcHTMLComponent_GridTabela rica em recursos: ordenação, filtro, exportação CSV/PDF, edição inline, agrupamento, scroll virtual e consulta por IA.Docs
DataTableTsgcHTMLComponent_DataTableTabela de dados de nível superior que envolve Grid + Pagination com uma barra de ferramentas, busca e contagem de linhas.Docs
CalendarTsgcHTMLComponent_CalendarCalendário em grade mensal com pontos de eventos e navegação anterior/próximo.Docs
SchedulerTsgcHTMLComponent_SchedulerAgendador de calendário (visualizações por mês / semana) renderizando eventos por data.Docs
TimelineTsgcHTMLComponent_TimelineLinha do tempo vertical de eventos datados, carregável a partir de um dataset.Docs
KanbanBoardTsgcHTMLComponent_KanbanBoardQuadro Kanban de colunas e cards arrastáveis.Docs
GanttTsgcHTMLComponent_GanttGráfico de cronograma de projeto Gantt com barras de progresso de tarefas.Docs
TreeGridTsgcHTMLComponent_TreeGridTabela Bootstrap com linhas hierárquicas recolhíveis, construída a partir de pares de nós Id/ParentId.Docs
PivotTableTsgcHTMLComponent_PivotTableTabela dinâmica (pivot) Bootstrap que agrupa linhas e colunas e agrega medidas com totais de linha, coluna e geral.Docs
ActivityFeedTsgcHTMLComponent_ActivityFeedFeed de atividades ao vivo, mais recentes primeiro, com carimbos de tempo relativos e envio via WebSocket out-of-band.Docs
AuditTrailTsgcHTMLComponent_AuditTrailFeed cronológico de log de auditoria de ações de usuários e do sistema, com autor, ação, alvo e data/hora.Docs
Gráficos & Visualização

Gráficos & Visualização

Visuais orientados a dados construídos a partir dos seus próprios números.

ComponenteClasseDescriçãoAjuda
ChartTsgcHTMLComponent_ChartGráfico Chart.js: linha, barra, pizza, rosca, radar, polar, bolha e dispersão.Docs
GaugeTsgcHTMLComponent_GaugeMedidor SVG semicircular com limiares de cor baixo / médio / alto.Docs
DiagramTsgcHTMLComponent_DiagramDiagrama de fluxo de nós e setas renderizado como SVG inline.Docs
MapTsgcHTMLComponent_MapMapa interativo Leaflet.js (tiles OpenStreetMap / CartoDB) com marcadores.Docs
HeatmapTsgcHTMLComponent_HeatmapGrade de mapa de calor SVG com escala de cores a partir de valores de célula ou de um dataset vinculado, com legenda e rótulos de linha/coluna.Docs
SparklineTsgcHTMLComponent_SparklineSparkline SVG inline compacto de linha, barra ou área a partir de uma série de valores ou de um dataset vinculado.Docs
CandlestickChartTsgcHTMLComponent_CandlestickChartGráfico de candlestick OHLC em SVG com pavios, cores de alta/baixa e uma faixa de volume opcional.Docs
QRCodeTsgcHTMLComponent_QRCodeCódigo QR SVG ISO/IEC 18004 em Pascal puro a partir de qualquer texto ou URL, com nível de correção de erro selecionável.Docs
BarcodeTsgcHTMLComponent_BarcodeCódigo de barras Code 128 SVG em Pascal puro a partir de qualquer texto ASCII, com legenda legível opcional.Docs
TreeMapTsgcHTMLComponent_TreeMapTreemap "squarified" renderizado como um SVG inline autocontido gerado no servidor, sem necessidade de biblioteca de gráficos.Docs
Formulários & Entradas

Formulários & Entradas

Tudo o que você precisa para capturar dados, com validação e vinculação a dataset.

ComponenteClasseDescriçãoAjuda
FormTsgcHTMLComponent_FormConstrutor de formulários orientado a dados com validação, layouts e geração de formulários por IA.Docs
EditTsgcHTMLComponent_EditEntrada de texto de linha única com label, texto de ajuda e vinculação a dataset.Docs
MemoTsgcHTMLComponent_MemoEntrada de área de texto multilinha com label e texto de ajuda.Docs
CheckBoxTsgcHTMLComponent_CheckBoxEntrada de checkbox com label e estado marcado.Docs
RadioGroupTsgcHTMLComponent_RadioGroupGrupo de opções de rádio mutuamente exclusivas.Docs
SelectTsgcHTMLComponent_SelectDropdown de seleção com grupos de opções, seleção múltipla e vinculação a dataset.Docs
InputGroupTsgcHTMLComponent_InputGroupEntrada com texto de addon antes / depois.Docs
AutoCompleteTsgcHTMLComponent_AutoCompleteEntrada de texto apoiada por uma datalist HTML5 de sugestões.Docs
DatePickerTsgcHTMLComponent_DatePickerCampo de entrada nativo de data / hora / datetime.Docs
FileUploadTsgcHTMLComponent_FileUploadZona de upload de arquivos por arrastar e soltar com envio de formulário multipart.Docs
RichEditorTsgcHTMLComponent_RichEditorEditor de rich-text WYSIWYG baseado em Quill com campo de formulário oculto.Docs
RatingTsgcHTMLComponent_RatingExibição ou entrada de avaliação por estrelas (símbolo).Docs
MultiSelectTsgcHTMLComponent_MultiSelectUm dropdown de seleção múltipla Bootstrap pesquisável com chips, opções agrupadas e vinculação a dataset.Docs
ColorPickerTsgcHTMLComponent_ColorPickerUma entrada de cor HTML5 nativa com campo de texto hexadecimal opcional e amostras predefinidas.Docs
SliderTsgcHTMLComponent_SliderUm slider de intervalo Bootstrap com badge de valor ao vivo, rótulos de mín/máx e estilo de cor.Docs
TimePickerTsgcHTMLComponent_TimePickerUma entrada de hora HTML5 nativa com limites de mín/máx e granularidade de segundos.Docs
SignaturePadTsgcHTMLComponent_SignaturePadUm bloco de assinatura em canvas baseado em pointer-events com ações de Limpar, Desfazer e Salvar.Docs
TransferTsgcHTMLComponent_TransferWidget de lista dupla para mover itens entre um painel de disponíveis e um de atribuídos, com filtragem e vinculação a dataset.Docs
DateTimePickerTsgcHTMLComponent_DateTimePickerSeletor nativo de data e hora do HTML5, combinando calendário e relógio em um único campo.Docs
DateRangePickerTsgcHTMLComponent_DateRangePickerCampos pareados de data inicial e final para escolher um intervalo de datas, com limites mín/máx.Docs
RangeSliderTsgcHTMLComponent_RangeSliderSlider de dois controles que seleciona um par de valores mínimo/máximo, com badges de valor ao vivo.Docs
Conteúdo & Layout

Conteúdo & Layout

Cards, mídia e blocos de KPI para dispor uma página.

ComponenteClasseDescriçãoAjuda
PanelTsgcHTMLComponent_PanelPainel de card Bootstrap com cabeçalho / corpo / rodapé, recolhível e rolável.Docs
StatCardTsgcHTMLComponent_StatCardCard de KPI / estatística de dashboard com ícone, seta de tendência e gradiente opcional.Docs
AccordionTsgcHTMLComponent_AccordionAcordeão de colapso vertical com painéis expansíveis empilhados.Docs
CarouselTsgcHTMLComponent_CarouselSlideshow de imagens / carrossel com indicadores, controles e reprodução automática.Docs
ImageTsgcHTMLComponent_ImageImagem com forma, responsiva / lazy-load, link de lightbox e legenda.Docs
AvatarTsgcHTMLComponent_AvatarAvatar de usuário (imagem ou iniciais) com tamanho, forma e ponto de status de presença.Docs
VideoTsgcHTMLComponent_VideoPlayer de vídeo / áudio HTML5 mais um helper de incorporação do YouTube.Docs
BadgeTsgcHTMLComponent_BadgeBadge Bootstrap único com cor, formato pílula, um ícone inline e um modo de ponto de notificação posicionado.Docs
PDFViewerTsgcHTMLComponent_PDFViewerVisualizador de PDF embutido na página, baseado em pdf.js, com navegação de páginas, zoom, busca, download e impressão.Docs
ChipTsgcHTMLComponent_ChipChip / tag compacto com ícone opcional, cor e um botão de fechar removível.Docs
Overlays & Feedback

Overlays & Feedback

Diálogos, superfícies de status e estados de carregamento.

ComponenteClasseDescriçãoAjuda
ModalTsgcHTMLComponent_ModalDiálogo modal com título / corpo / rodapé, tamanhos, centralizado e backdrop estático.Docs
OffcanvasTsgcHTMLComponent_OffcanvasPainel deslizante off-canvas pela esquerda, direita, topo ou base.Docs
PopoverTsgcHTMLComponent_PopoverBalão popover sobre um elemento de gatilho (clique / hover / foco).Docs
ToastTsgcHTMLComponent_ToastNotificação toast com cabeçalho, corpo, carimbo de tempo e ocultação automática.Docs
SnackbarTsgcHTMLComponent_SnackbarSnackbar transitório estilo Material com uma ação opcional.Docs
NotificationTsgcHTMLComponent_NotificationCentro de notificações em dropdown com ícone de sino e um badge de não lidas.Docs
SpinnerTsgcHTMLComponent_SpinnerSpinner de carregamento (borda / crescimento), dimensionado e colorido.Docs
PlaceholderTsgcHTMLComponent_PlaceholderCard de carregamento esqueleto / placeholder com um brilho animado.Docs
ContextMenuTsgcHTMLComponent_ContextMenuMenu dropdown de clique direito com escopo definido por um seletor CSS, com ícones, divisores, cabeçalhos e ações roteadas pelo servidor.Docs
JobProgressTsgcHTMLComponent_JobProgressLista ao vivo de barras de progresso de jobs em segundo plano com badges de status, botões de cancelar e atualizações de fragmento out-of-band.Docs
LogViewerTsgcHTMLComponent_LogViewerVisualizador de log / terminal em streaming com filtro de nível, busca e rolagem automática.Docs
ProgressBarTsgcHTMLComponent_ProgressBarBarra de progresso Bootstrap, listrada e animada, de segmento único ou multissegmento empilhado.Docs
Chat & IA

Chat & IA

UI conversacional, de bolhas simples a um assistente de IA com streaming.

ComponenteClasseDescriçãoAjuda
ChatBoxTsgcHTMLComponent_ChatBoxCaixa de bolhas de chat estilo card com uma barra de entrada e indicador de digitação.Docs
ChatTsgcHTMLComponent_ChatChat estilo WhatsApp com mensagens de texto / imagem / arquivo / áudio / vídeo, confirmações de leitura e respostas.Docs
AIChatTsgcHTMLComponent_AIChatChat de assistente de IA com seletor de provedor / modelo, streaming de tokens e citações de fontes RAG.Docs
PresenceTsgcHTMLComponent_PresenceLista de "quem está online" como pilha de avatares ou lista, com atualizações de status ao vivo.Docs
Autenticação

Autenticação

Fluxos de login prontos, de senhas a passkeys.

ComponenteClasseDescriçãoAjuda
LoginTsgcHTMLComponent_LoginFormulário / página de login pronto (card, centralizado ou página inteira) com lembrar-me e alertas.Docs
SocialLoginTsgcHTMLComponent_SocialLoginPainel de botões de login social OAuth (Google, Facebook, Apple, GitHub, Microsoft e mais).Docs
OAuthCallbackTsgcHTMLComponent_OAuthCallbackPágina de callback / destino OAuth em estado de sucesso, erro ou carregamento com redirecionamento automático.Docs
WebAuthnLoginTsgcHTMLComponent_WebAuthnLoginWidget de login e registro passkey / WebAuthn sem senha.Docs
RolesPermissionsTsgcHTMLComponent_RolesPermissionsMatriz de papéis / permissões com uma checkbox por célula e atualizações de concessão ao vivo via WebSocket.Docs
UserManagementTsgcHTMLComponent_UserManagementTabela de administração de usuários com papéis, status, busca e um dropdown de ações por linha.Docs
ImpersonateBannerTsgcHTMLComponent_ImpersonateBannerBanner de personificação de administrador exibido ao agir como outro usuário, com saída em um clique.Docs
Infraestrutura

Motor, Servidor & Temas

As peças não visuais que servem as páginas e as mantêm ao vivo.

ComponenteClasseDescriçãoAjuda
EngineServerTsgcHTMLEngine_ServerMotor HTML vinculado a um TsgcWebSocketHTTPServer que serve páginas renderizadas e assets embutidos.Docs
HTMXEngineTsgcHTMX_Engine_ServerMotor htmx conectado ao mesmo servidor. Ele engancha os handlers HTTP e WebSocket, despacha requisições e mensagens de entrada e envia ou faz broadcast de fragmentos HTML para os navegadores conectados em tempo real (DispatchRequest, DispatchMessage, PushFragment, BroadcastFragment).Docs
PageBuilderTsgcHTMLPageBuilderMonta componentes registrados em uma página responsiva completa, com um editor visual em tempo de design.Docs
TemplateBootstrapTsgcHTMLTemplate_BootstrapEnvolve o conteúdo do corpo em um documento HTML Bootstrap 5 completo com tema, idioma e direção.Docs
ThemeControllerTsgcHTMLThemeControllerAlternador de tema em tempo de execução cuja propriedade Theme (ptDefault, ptDark, ptDarkPro) aplica o tema selecionado e a folha de estilos compartilhada à página.Docs
ThemeBuilderTsgcHTMLThemeBuilderGerador de CSS cujo Mode (tmLight, tmDark, tmSystem) escreve variáveis CSS do Bootstrap a partir de valores de propriedades, com um script opcional de sincronização com a preferência do SO para tmSystem.Docs
HTMXFragmentTsgcHTMX_FragmentFragmento htmx out-of-band para enviar uma atualização parcial de página do servidor ao navegador.Docs
HTMXRouterTsgcHTMX_RouterTabela de roteamento de Routes que corresponde ao caminho de uma requisição de entrada e a despacha (via HandleRequest) ao handler OnRoute dessa rota.Docs
Melhor custo-benefício: All-AccessTodos os produtos da eSeGeCe, com Suporte Premium incluído, a partir de €1,059/ano.
Ver preços do All-Access

Construa com sgcHTML

Baixe a versão de avaliação gratuita e comece a compor UIs web em Delphi, C++ Builder ou .NET.

Baixar Versão de Avaliação Gratuita Ver Preços