sgcHTML 组件画廊
在一处浏览全部 89 个 sgcHTML UI 组件，按九大家族分组。每个组件都渲染为 Bootstrap 5 标记，在 Delphi、C++ Builder 和 .NET 中的工作方式相同，且在每种语言中使用相同的 Tsgc* 类名。89 个组件中有 27 个是数据感知的，可直接绑定到 TDataSet / DataSource（或等效的 .NET 数据源）；它们带有 数据感知 徽章。点击任意卡片进入其组件页面，或打开文档。
在一处浏览全部 89 个 sgcHTML UI 组件，按九大家族分组。每个组件都渲染为 Bootstrap 5 标记，在 Delphi、C++ Builder 和 .NET 中的工作方式相同，且在每种语言中使用相同的 Tsgc* 类名。89 个组件中有 27 个是数据感知的，可直接绑定到 TDataSet / DataSource（或等效的 .NET 数据源）；它们带有 数据感知 徽章。点击任意卡片进入其组件页面，或打开文档。
直接渲染您数据集的网格、日历和看板。
TsgcHTMLComponent_GridTsgcHTMLComponent_Grid功能丰富的表格：排序、筛选、CSV/PDF 导出、内联编辑、分组、虚拟滚动和 AI 查询。
TsgcHTMLComponent_DataTableTsgcHTMLComponent_DataTable更高级的数据表，封装了 Grid + Pagination，带有工具栏、搜索和行数统计。
TsgcHTMLComponent_CalendarTsgcHTMLComponent_Calendar月历网格，带有事件圆点和上一月/下一月导航。
TsgcHTMLComponent_SchedulerTsgcHTMLComponent_Scheduler日历日程表（月 / 周视图），按日期渲染事件。
TsgcHTMLComponent_TimelineTsgcHTMLComponent_Timeline带日期的事件垂直时间线，可从数据集加载。
TsgcHTMLComponent_KanbanBoardTsgcHTMLComponent_KanbanBoard由列和可拖动卡片组成的看板。
TsgcHTMLComponent_TreeGridTsgcHTMLComponent_TreeGrid基于 Id/ParentId 节点对构建的 Bootstrap 表格，支持可折叠的层次化行。
TsgcHTMLComponent_PivotTableTsgcHTMLComponent_PivotTableBootstrap 数据透视表，对行和列进行分组并汇总度量值，包含行、列和总计。
TsgcHTMLComponent_ActivityFeedTsgcHTMLComponent_ActivityFeed实时的、按最新优先排序的活动信息流，带有相对时间戳和带外 WebSocket 推送。
TsgcHTMLComponent_AuditTrailTsgcHTMLComponent_AuditTrail按时间顺序排列的审计日志信息流，记录用户和系统操作，包含操作者、操作、目标和时间戳。
由您自己的数据构建的数据驱动视觉效果。
TsgcHTMLComponent_ChartTsgcHTMLComponent_ChartChart.js 图表：折线图、柱状图、饼图、环形图、雷达图、极坐标图、气泡图和散点图。
TsgcHTMLComponent_GaugeTsgcHTMLComponent_Gauge半圆形 SVG 仪表盘，带有低 / 中 / 高颜色阈值。
TsgcHTMLComponent_DiagramTsgcHTMLComponent_Diagram渲染为内联 SVG 的节点与箭头流程图。
TsgcHTMLComponent_MapTsgcHTMLComponent_MapLeaflet.js 交互式地图（OpenStreetMap / CartoDB 瓦片），带有标记。
TsgcHTMLComponent_HeatmapTsgcHTMLComponent_Heatmap基于单元格数值或绑定数据集的颜色渐变 SVG 热力图网格，带有图例和行/列标签。
TsgcHTMLComponent_SparklineTsgcHTMLComponent_Sparkline紧凑的内联 SVG 折线、柱状或面积迷你图，数据来自数值序列或绑定数据集。
TsgcHTMLComponent_CandlestickChartTsgcHTMLComponent_CandlestickChart带有影线、涨跌颜色和可选成交量条的 SVG OHLC 蜡烛图。
TsgcHTMLComponent_QRCodeTsgcHTMLComponent_QRCode纯 Pascal 实现的 ISO/IEC 18004 SVG 二维码，可基于任意文本或 URL 生成，并可选择纠错级别。
TsgcHTMLComponent_BarcodeTsgcHTMLComponent_Barcode纯 Pascal 实现的 Code 128 SVG 条形码，可基于任意 ASCII 文本生成，带有可选的人类可读标题。
捕获数据所需的一切，带有验证和数据集绑定。
TsgcHTMLComponent_FormTsgcHTMLComponent_Form数据驱动的表单构建器，带有验证、布局和 AI 表单生成。
TsgcHTMLComponent_CheckBoxTsgcHTMLComponent_CheckBox复选框输入，带有标签和选中状态。
TsgcHTMLComponent_RadioGroupTsgcHTMLComponent_RadioGroup一组相互排斥的单选选项。
TsgcHTMLComponent_InputGroupTsgcHTMLComponent_InputGroup带有前置 / 后置附加文本的输入框。
TsgcHTMLComponent_AutoCompleteTsgcHTMLComponent_AutoComplete由 HTML5 datalist 建议支持的文本输入。
TsgcHTMLComponent_DatePickerTsgcHTMLComponent_DatePicker原生日期 / 时间 / 日期时间输入字段。
TsgcHTMLComponent_FileUploadTsgcHTMLComponent_FileUpload拖放式文件上传区域，带有 multipart 表单提交。
TsgcHTMLComponent_RichEditorTsgcHTMLComponent_RichEditor基于 Quill 的所见即所得富文本编辑器，带有隐藏的表单字段。
TsgcHTMLComponent_MultiSelectTsgcHTMLComponent_MultiSelect可搜索的 Bootstrap 多选下拉框，带有标签芯片、分组选项和数据集绑定。
TsgcHTMLComponent_ColorPickerTsgcHTMLComponent_ColorPicker原生 HTML5 颜色输入框，带有可选的十六进制文本字段和预设色板。
TsgcHTMLComponent_SliderTsgcHTMLComponent_SliderBootstrap 范围滑块，带有实时数值徽章、最小/最大值标签和颜色样式。
TsgcHTMLComponent_TimePickerTsgcHTMLComponent_TimePicker原生 HTML5 时间输入框，带有最小/最大值范围和秒级精度。
TsgcHTMLComponent_SignaturePadTsgcHTMLComponent_SignaturePad基于指针事件的画布签名板，带有清除、撤销和保存操作。
TsgcHTMLComponent_TransferTsgcHTMLComponent_Transfer双列表框控件，用于在“可选”和“已选”面板之间移动项目，带有筛选和数据集绑定。
TsgcHTMLComponent_DateTimePickerTsgcHTMLComponent_DateTimePicker原生 HTML5 日期时间选择器，在单个字段中结合日历和时钟。
TsgcHTMLComponent_DateRangePickerTsgcHTMLComponent_DateRangePicker成对的开始和结束日期输入框，用于选择日期范围，带有最小/最大值边界。
TsgcHTMLComponent_RangeSliderTsgcHTMLComponent_RangeSlider双滑块，用于选择一对低/高值，带有实时数值徽章。
用于布局页面的卡片、媒体和 KPI 磁贴。
TsgcHTMLComponent_PanelTsgcHTMLComponent_PanelBootstrap 卡片面板，带有页眉 / 主体 / 页脚，可折叠、可滚动。
TsgcHTMLComponent_StatCardTsgcHTMLComponent_StatCard仪表板 KPI / 统计卡片，带有图标、趋势箭头和可选渐变。
TsgcHTMLComponent_AccordionTsgcHTMLComponent_Accordion由可堆叠展开面板组成的垂直折叠手风琴。
TsgcHTMLComponent_CarouselTsgcHTMLComponent_Carousel图片幻灯片 / 轮播，带有指示器、控件和自动播放。
TsgcHTMLComponent_ImageTsgcHTMLComponent_Image图片，带有形状、响应式 / 懒加载、灯箱链接和标题。
TsgcHTMLComponent_AvatarTsgcHTMLComponent_Avatar用户头像（图片或首字母），带有尺寸、形状和在线状态圆点。
TsgcHTMLComponent_VideoTsgcHTMLComponent_VideoHTML5 视频 / 音频播放器，外加 YouTube 嵌入辅助功能。
TsgcHTMLComponent_BadgeTsgcHTMLComponent_Badge单个 Bootstrap 徽章，带有颜色、胶囊形状、内联图标和定位式通知圆点模式。
TsgcHTMLComponent_PDFViewerTsgcHTMLComponent_PDFViewer由 pdf.js 驱动的页内 PDF 查看器，带有翻页、缩放、搜索、下载和打印功能。
对话框、状态展示和加载状态。
TsgcHTMLComponent_ModalTsgcHTMLComponent_Modal模态对话框，带有标题 / 主体 / 页脚、多种尺寸、居中和静态背景。
TsgcHTMLComponent_OffcanvasTsgcHTMLComponent_Offcanvas从左、右、上或下滑入的画布外面板。
TsgcHTMLComponent_PopoverTsgcHTMLComponent_Popover触发元素上的弹出气泡（点击 / 悬停 / 聚焦）。
TsgcHTMLComponent_ToastTsgcHTMLComponent_ToastToast 通知，带有页眉、主体、时间戳和自动隐藏。
TsgcHTMLComponent_SnackbarTsgcHTMLComponent_SnackbarMaterial 风格的瞬时 snackbar，带有可选操作。
TsgcHTMLComponent_NotificationTsgcHTMLComponent_Notification铃铛图标下拉通知中心，带有未读徽章。
TsgcHTMLComponent_SpinnerTsgcHTMLComponent_Spinner加载旋转器（边框 / 增长），可设置尺寸和颜色。
TsgcHTMLComponent_PlaceholderTsgcHTMLComponent_Placeholder骨架 / 占位加载卡片，带有动画微光效果。
TsgcHTMLComponent_ContextMenuTsgcHTMLComponent_ContextMenu作用域限定于 CSS 选择器的右键下拉菜单，带有图标、分隔符、标题和服务器路由操作。
TsgcHTMLComponent_JobProgressTsgcHTMLComponent_JobProgress后台任务进度条的实时列表，带有状态徽章、取消按钮和带外片段更新。
TsgcHTMLComponent_LogViewerTsgcHTMLComponent_LogViewer流式日志 / 终端查看器，带有级别筛选、搜索和自动滚动。
TsgcHTMLComponent_ProgressBarTsgcHTMLComponent_ProgressBarBootstrap 进度条，支持条纹和动画效果，可为单段或堆叠式多段。
会话式 UI，从简单的气泡到流式 AI 助手。
TsgcHTMLComponent_ChatBoxTsgcHTMLComponent_ChatBox卡片式聊天气泡框，带有输入栏和正在输入指示器。
TsgcHTMLComponent_ChatTsgcHTMLComponent_ChatWhatsApp 风格的聊天，支持文本 / 图片 / 文件 / 音频 / 视频消息、已读回执和回复。
TsgcHTMLComponent_AIChatTsgcHTMLComponent_AIChatAI 助手聊天，带有提供商 / 模型选择器、令牌流式传输和 RAG 来源引用。
现成的登录流程，从密码到通行密钥。
TsgcHTMLComponent_LoginTsgcHTMLComponent_Login现成的登录表单 / 页面（卡片、居中或全页），带有记住我和提示。
TsgcHTMLComponent_SocialLoginTsgcHTMLComponent_SocialLoginOAuth 社交登录按钮面板（Google、Facebook、Apple、GitHub、Microsoft 等）。
TsgcHTMLComponent_OAuthCallbackTsgcHTMLComponent_OAuthCallbackOAuth 回调 / 落地页，处于成功、错误或加载状态，并自动重定向。
TsgcHTMLComponent_WebAuthnLoginTsgcHTMLComponent_WebAuthnLogin无密码的通行密钥 / WebAuthn 登录和注册控件。
TsgcHTMLComponent_RolesPermissionsTsgcHTMLComponent_RolesPermissions角色 / 权限矩阵，每个单元格带有复选框，并支持实时 WebSocket 授权更新。
TsgcHTMLComponent_UserManagementTsgcHTMLComponent_UserManagement用户管理表格，包含角色、状态、搜索和逐行操作下拉菜单。
TsgcHTMLComponent_ImpersonateBannerTsgcHTMLComponent_ImpersonateBanner管理员模拟横幅，在以其他用户身份操作时显示，带有一键退出。
提供页面服务并保持其实时性的非可视化部件。
TsgcHTMLEngine_ServerTsgcHTMLEngine_Server绑定到 TsgcWebSocketHTTPServer 的 HTML 引擎，提供渲染后的页面和内嵌资源。
TsgcHTMX_Engine_ServerTsgcHTMX_Engine_Server接入同一服务器的 htmx 引擎。它挂接 HTTP 和 WebSocket 处理器，分发传入的请求和消息，并实时向已连接的浏览器推送或广播 HTML 片段（DispatchRequest、DispatchMessage、PushFragment、BroadcastFragment）。
TsgcHTMLPageBuilderTsgcHTMLPageBuilder将已注册的组件组装成完整的响应式页面（带有设计时可视化编辑器）。
TsgcHTMLThemeControllerTsgcHTMLThemeController运行时主题切换器，其 Theme 属性（ptDefault、ptDark、ptDarkPro）将选定的主题和共享样式表应用到页面。
TsgcHTMLThemeBuilderTsgcHTMLThemeBuilderCSS 生成器，其 Mode（tmLight、tmDark、tmSystem）根据属性值写入 Bootstrap CSS 变量，并可为 tmSystem 附带一个可选的操作系统偏好同步脚本。
TsgcHTMX_FragmentTsgcHTMX_Fragment用于从服务器向浏览器推送局部页面更新的带外 htmx 片段。
TsgcHTMX_RouterTsgcHTMX_Router由 Routes 组成的路由表，匹配传入的请求路径，并（通过 HandleRequest）将其分发到该路由的 OnRoute 处理器。