dishui 0.0.64 → 0.0.65
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Badge/index.js +12 -9
- package/dist/components/Badge/index.js.map +1 -1
- package/dist/components/Button/index.js +43 -40
- package/dist/components/Button/index.js.map +1 -1
- package/dist/components/Card/index.d.ts +11 -0
- package/dist/components/Card/index.js +62 -37
- package/dist/components/Card/index.js.map +1 -1
- package/dist/components/Chart/Chart.js.map +1 -1
- package/dist/components/Checkbox/index.js +32 -30
- package/dist/components/Checkbox/index.js.map +1 -1
- package/dist/components/Demo/index.js.map +1 -1
- package/dist/components/EmptyState/index.d.ts +4 -1
- package/dist/components/EmptyState/index.js +3 -3
- package/dist/components/EmptyState/index.js.map +1 -1
- package/dist/components/FileUploader/DropZone.js.map +1 -1
- package/dist/components/FileUploader/FileItem.js.map +1 -1
- package/dist/components/FileUploader/FileUploader.js.map +1 -1
- package/dist/components/FileUploader/UploadQueue.js.map +1 -1
- package/dist/components/Input/index.js +30 -30
- package/dist/components/Input/index.js.map +1 -1
- package/dist/components/Label/index.js +41 -40
- package/dist/components/Label/index.js.map +1 -1
- package/dist/components/List/index.js +47 -32
- package/dist/components/List/index.js.map +1 -1
- package/dist/components/Markdown/Markdown.js +61 -57
- package/dist/components/Markdown/Markdown.js.map +1 -1
- package/dist/components/Markdown/markdownComponents.js +49 -49
- package/dist/components/Markdown/markdownComponents.js.map +1 -1
- package/dist/components/Modal/index.d.ts +7 -3
- package/dist/components/Modal/index.js +77 -65
- package/dist/components/Modal/index.js.map +1 -1
- package/dist/components/Page/index.d.ts +58 -0
- package/dist/components/Page/index.js +74 -0
- package/dist/components/Page/index.js.map +1 -0
- package/dist/components/PageHeader/index.js.map +1 -1
- package/dist/components/Select/index.js +0 -3
- package/dist/components/Select/index.js.map +1 -1
- package/dist/components/SidebarToggleButton/index.js.map +1 -1
- package/dist/components/StatCard/index.d.ts +3 -1
- package/dist/components/StatCard/index.js +39 -11
- package/dist/components/StatCard/index.js.map +1 -1
- package/dist/components/Table/index.js +103 -85
- package/dist/components/Table/index.js.map +1 -1
- package/dist/components/Tabs/index.d.ts +19 -5
- package/dist/components/Tabs/index.js +32 -13
- package/dist/components/Tabs/index.js.map +1 -1
- package/dist/components/Tree/Tree.js.map +1 -1
- package/dist/components/pro/ArticleContextMenu/index.js.map +1 -1
- package/dist/components/pro/ArticleControl/ArticleControl2.js.map +1 -1
- package/dist/components/pro/CodeEditor/editors/CodeEditor.js +141 -134
- package/dist/components/pro/CodeEditor/editors/CodeEditor.js.map +1 -1
- package/dist/components/pro/CodeEditor/editors/MarkdownEditor.js +81 -78
- package/dist/components/pro/CodeEditor/editors/MarkdownEditor.js.map +1 -1
- package/dist/components/pro/CodeEditor/panels/FootnotePanel.js.map +1 -1
- package/dist/components/pro/CodeEditor/panels/HistoryPanel.js.map +1 -1
- package/dist/components/pro/CodeEditor/panels/OutlinePanel.js.map +1 -1
- package/dist/components/pro/CodeEditor/panels/TableOfContentsPanel.js.map +1 -1
- package/dist/components/pro/CodeEditor/panels/VariablePanel.js.map +1 -1
- package/dist/components/pro/CodeEditor/themes.js +59 -59
- package/dist/components/pro/CodeEditor/themes.js.map +1 -1
- package/dist/components/pro/DataTable/DataTable.js +49 -48
- package/dist/components/pro/DataTable/DataTable.js.map +1 -1
- package/dist/components/pro/DataTable/Filters.js +42 -42
- package/dist/components/pro/DataTable/Filters.js.map +1 -1
- package/dist/components/pro/DataTable/PivotPanel.js.map +1 -1
- package/dist/components/pro/DataTable/PivotView.js +35 -32
- package/dist/components/pro/DataTable/PivotView.js.map +1 -1
- package/dist/components/pro/DataTable/components/BulkActions.js.map +1 -1
- package/dist/components/pro/DataTable/components/ColumnSelector.js.map +1 -1
- package/dist/components/pro/DataTable/components/FilterBar.js.map +1 -1
- package/dist/components/pro/DataTable/components/TableBody.js.map +1 -1
- package/dist/components/pro/DataTable/components/TableHeader.js.map +1 -1
- package/dist/components/pro/DataTable/components/TablePagination.js.map +1 -1
- package/dist/components/pro/DataTable/components/TableToolbar.js.map +1 -1
- package/dist/components/pro/DataTable/pivotExtension.js.map +1 -1
- package/dist/components/pro/DataTable/rowDetailExtension.js.map +1 -1
- package/dist/components/pro/DataTable/tanstack-table.js +37 -37
- package/dist/components/pro/DataTable/tanstack-table.js.map +1 -1
- package/dist/components/pro/FileExplorer/Breadcrumb.js +53 -53
- package/dist/components/pro/FileExplorer/Breadcrumb.js.map +1 -1
- package/dist/components/pro/FileExplorer/CreateDialog.js.map +1 -1
- package/dist/components/pro/FileExplorer/FileExplorer.js.map +1 -1
- package/dist/components/pro/FileExplorer/FileIcon.js +22 -22
- package/dist/components/pro/FileExplorer/FileIcon.js.map +1 -1
- package/dist/components/pro/FileExplorer/GridView.js.map +1 -1
- package/dist/components/pro/FileExplorer/ListView.js.map +1 -1
- package/dist/components/pro/FileExplorer/Toolbar.js.map +1 -1
- package/dist/components/pro/Flow/Flow.js +496 -494
- package/dist/components/pro/Flow/Flow.js.map +1 -1
- package/dist/components/pro/Flow/FlowCanvas.js +916 -917
- package/dist/components/pro/Flow/FlowCanvas.js.map +1 -1
- package/dist/components/pro/Flow/context/FlowUIContext.js.map +1 -1
- package/dist/components/pro/Flow/edges/EdgeRenderer.js +59 -59
- package/dist/components/pro/Flow/edges/EdgeRenderer.js.map +1 -1
- package/dist/components/pro/Flow/hooks/useClipboard.js.map +1 -1
- package/dist/components/pro/Flow/hooks/useDeleteSelection.js.map +1 -1
- package/dist/components/pro/Flow/hooks/useEdgeMutations.js.map +1 -1
- package/dist/components/pro/Flow/hooks/useLayoutActions.js +9 -11
- package/dist/components/pro/Flow/hooks/useLayoutActions.js.map +1 -1
- package/dist/components/pro/Flow/hooks/useLineMutations.js.map +1 -1
- package/dist/components/pro/Flow/hooks/useMindMap.js.map +1 -1
- package/dist/components/pro/Flow/hooks/useNodeMutations.js.map +1 -1
- package/dist/components/pro/Flow/lines/FreehandTool.js +9 -9
- package/dist/components/pro/Flow/lines/FreehandTool.js.map +1 -1
- package/dist/components/pro/Flow/lines/LineRenderer.js +5 -5
- package/dist/components/pro/Flow/lines/LineRenderer.js.map +1 -1
- package/dist/components/pro/Flow/nodes/DataNodeView.js +113 -93
- package/dist/components/pro/Flow/nodes/DataNodeView.js.map +1 -1
- package/dist/components/pro/Flow/nodes/MediaContent.js.map +1 -1
- package/dist/components/pro/Flow/nodes/MediaOverlay.js.map +1 -1
- package/dist/components/pro/Flow/nodes/Model3DView.js +1 -1
- package/dist/components/pro/Flow/nodes/Model3DView.js.map +1 -1
- package/dist/components/pro/Flow/nodes/NodeRenderer.js +118 -118
- package/dist/components/pro/Flow/nodes/NodeRenderer.js.map +1 -1
- package/dist/components/pro/Flow/nodes/dataUtils.js.map +1 -1
- package/dist/components/pro/Flow/nodes/shapes.js +1 -3
- package/dist/components/pro/Flow/nodes/shapes.js.map +1 -1
- package/dist/components/pro/Flow/panels/AIPanel.js.map +1 -1
- package/dist/components/pro/Flow/panels/Breadcrumb.js.map +1 -1
- package/dist/components/pro/Flow/panels/ContextMenu.js.map +1 -1
- package/dist/components/pro/Flow/panels/DataInspectorSection.js.map +1 -1
- package/dist/components/pro/Flow/panels/ExpandableTextarea.js.map +1 -1
- package/dist/components/pro/Flow/panels/FlowPanelGroup.js.map +1 -1
- package/dist/components/pro/Flow/panels/FlowToolbar.js +97 -97
- package/dist/components/pro/Flow/panels/FlowToolbar.js.map +1 -1
- package/dist/components/pro/Flow/panels/InspectorPanel.js +57 -57
- package/dist/components/pro/Flow/panels/InspectorPanel.js.map +1 -1
- package/dist/components/pro/Flow/panels/OutlinePanel.js +26 -22
- package/dist/components/pro/Flow/panels/OutlinePanel.js.map +1 -1
- package/dist/components/pro/Flow/panels/PresentationMode.js +18 -16
- package/dist/components/pro/Flow/panels/PresentationMode.js.map +1 -1
- package/dist/components/pro/Flow/panels/ProjectTitle.js.map +1 -1
- package/dist/components/pro/Flow/panels/ShapePalette.js +109 -104
- package/dist/components/pro/Flow/panels/ShapePalette.js.map +1 -1
- package/dist/components/pro/Flow/panels/toolbarIcons.js.map +1 -1
- package/dist/components/pro/RichTextEditor/AIRewrite.js.map +1 -1
- package/dist/components/pro/RichTextEditor/BlockHandle.js.map +1 -1
- package/dist/components/pro/RichTextEditor/BubbleToolbar.js.map +1 -1
- package/dist/components/pro/RichTextEditor/CommentDialog.js.map +1 -1
- package/dist/components/pro/RichTextEditor/CommentPanel.js.map +1 -1
- package/dist/components/pro/RichTextEditor/CommentPopover.js.map +1 -1
- package/dist/components/pro/RichTextEditor/ContextMenu.js.map +1 -1
- package/dist/components/pro/RichTextEditor/RichTextEditor.js.map +1 -1
- package/dist/components/pro/RichTextEditor/SlashMenu.js.map +1 -1
- package/dist/components/pro/RichTextEditor/Toolbar/ColorPicker.js.map +1 -1
- package/dist/components/pro/RichTextEditor/Toolbar/FloatingDialogMenu.js.map +1 -1
- package/dist/components/pro/RichTextEditor/Toolbar/MarkdownTemplates.js.map +1 -1
- package/dist/components/pro/RichTextEditor/Toolbar/SelectDropdown.js.map +1 -1
- package/dist/components/pro/RichTextEditor/Toolbar/TableOpsMenu.js.map +1 -1
- package/dist/components/pro/RichTextEditor/Toolbar/Toolbar.js.map +1 -1
- package/dist/components/pro/RichTextEditor/extensions/CodeBlockView.js.map +1 -1
- package/dist/components/pro/RichTextEditor/extensions/FloatingDialog.js.map +1 -1
- package/dist/components/pro/RichTextEditor/extensions/MarkdownBlock.js.map +1 -1
- package/dist/contexts/AppContext.js.map +1 -1
- package/dist/dishui.css +1 -1
- package/dist/hooks/useTableColumns.js +7 -8
- package/dist/hooks/useTableColumns.js.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.js +227 -221
- package/dist/layouts/MainLayout.js +22 -22
- package/dist/layouts/MainLayout.js.map +1 -1
- package/dist/layouts/Navbar.js.map +1 -1
- package/dist/layouts/Sidebar.js +94 -73
- package/dist/layouts/Sidebar.js.map +1 -1
- package/dist/layouts/headbar/Headbar.js.map +1 -1
- package/dist/layouts/headbar/HeadbarLangSwitcher.js.map +1 -1
- package/dist/layouts/headbar/HeadbarSearch.js.map +1 -1
- package/dist/layouts/headbar/HeadbarThemeSwitcher.js +11 -11
- package/dist/layouts/headbar/HeadbarThemeSwitcher.js.map +1 -1
- package/dist/layouts/headbar/HeadbarTitle.js.map +1 -1
- package/dist/utils/i18n.js +10 -10
- package/dist/utils/i18n.js.map +1 -1
- package/dist/utils/menu.js.map +1 -1
- package/dist/utils/routerBuilder.js +17 -15
- package/dist/utils/routerBuilder.js.map +1 -1
- package/dist/utils/themes.js.map +1 -1
- package/package.json +7 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableBody.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TableBody.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable, flexRender } from '../tanstack-table';\nimport Table from '../../../Table';\nimport { RowEventHandler, CellEventHandler } from '../types';\nimport type {\n DataTableApi,\n DataTableCellContext,\n DataTableExtension,\n DataTableRowContext,\n} from '../extension';\n\ninterface TableBodyProps<T extends object> {\n table: TanStackTable<T>;\n expandedRowsState: Record<string, boolean>;\n onRowClick?: RowEventHandler;\n onRowDoubleClick?: RowEventHandler;\n onRowMouseEnter?: RowEventHandler;\n onRowMouseLeave?: RowEventHandler;\n onCellClick?: CellEventHandler;\n onCellDoubleClick?: CellEventHandler;\n onCellMouseEnter?: CellEventHandler;\n onCellMouseLeave?: CellEventHandler;\n enableExpanding: boolean;\n indentSize: number;\n handleRowExpand: (rowId: string, row: T) => void;\n // 扩展系统\n extensions?: DataTableExtension<T>[];\n extensionApi?: DataTableApi<T>;\n getRowId?: (row: T, index: number) => string;\n onCellContextMenu?: (\n e: React.MouseEvent,\n row: T,\n column: any,\n rowIndex: number,\n ) => void;\n}\n\nexport function TableBody<T extends object>({\n table,\n expandedRowsState,\n onRowClick,\n onRowDoubleClick,\n onRowMouseEnter,\n onRowMouseLeave,\n onCellClick,\n onCellDoubleClick,\n onCellMouseEnter,\n onCellMouseLeave,\n enableExpanding,\n indentSize,\n handleRowExpand,\n extensions = [],\n extensionApi,\n getRowId,\n onCellContextMenu,\n}: TableBodyProps<T>) {\n const hasExtensions = extensions.length > 0 && !!extensionApi;\n\n return (\n <Table.Body>\n {table.getRowModel().rows.length === 0 ? (\n <Table.Row>\n <Table.Cell colSpan={table.getAllColumns().length} className=\"text-center py-4\">\n 没有数据\n </Table.Cell>\n </Table.Row>\n ) : (\n table.getRowModel().rows.map((row, rowIndex) => {\n const rowData = row.original as any;\n const depth = rowData.__depth || 0;\n const hasChildren = rowData.__hasChildren || false;\n const rowId = rowData.__id;\n const isExpanded = hasChildren && expandedRowsState[rowId] || false;\n const isChildRow = depth > 0;\n const parentId = rowData.__parentId;\n const parentExpanded = parentId ? expandedRowsState[parentId] || false : true;\n\n // 根据层级和展开状态应用不同的CSS类\n const rowClassName = `\n ${row.getIsSelected() ? 'bg-primary/10' : ''}\n ${hasChildren ? (isExpanded ? 'tree-row-expanded' : '') : ''}\n `;\n\n // 如果是子行且父行未展开,则不显示\n if (isChildRow && !parentExpanded) {\n return null;\n }\n\n // 扩展的行级上下文与注入属性\n const resolvedRowId = getRowId\n ? getRowId(row.original, rowIndex)\n : String(rowId ?? rowIndex);\n const rowCtx: DataTableRowContext<T> = {\n row: row.original,\n rowId: resolvedRowId,\n rowIndex,\n selected: row.getIsSelected(),\n };\n const extraRowProps = hasExtensions\n ? extensions.reduce<React.HTMLAttributes<HTMLTableRowElement>>(\n (acc, ext) =>\n Object.assign(acc, ext.rowProps?.(rowCtx, extensionApi!) ?? {}),\n {},\n )\n : {};\n\n const rowElement = (\n <Table.Row\n key={row.id}\n className={rowClassName}\n onClick={onRowClick ? e => onRowClick(row.original, e) : undefined}\n onDoubleClick={onRowDoubleClick ? e => onRowDoubleClick(row.original, e) : undefined}\n onMouseEnter={onRowMouseEnter ? e => onRowMouseEnter(row.original, e) : undefined}\n onMouseLeave={onRowMouseLeave ? e => onRowMouseLeave(row.original, e) : undefined}\n {...(extraRowProps as any)}\n >\n {row.getVisibleCells().map((cell, cellIndex) => {\n // 为第一列添加缩进和展开/折叠控件\n const isFirstColumn = cellIndex === 0;\n\n // 扩展可覆写单元格渲染。\n let cellContent: React.ReactNode | undefined;\n if (hasExtensions) {\n const cellCtx: DataTableCellContext<T> = {\n value: cell.getValue(),\n row: row.original,\n rowId: resolvedRowId,\n rowIndex,\n columnId: cell.column.id,\n };\n for (const ext of extensions) {\n const out = ext.cell?.(cellCtx, extensionApi!);\n if (out !== undefined) {\n cellContent = out;\n break;\n }\n }\n }\n if (cellContent === undefined) {\n cellContent = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n );\n }\n\n return (\n <Table.Cell\n key={cell.id}\n onClick={onCellClick ? e => {\n e.stopPropagation(); // 防止触发行点击事件\n onCellClick(row.original, cell.column, e);\n } : undefined}\n onDoubleClick={onCellDoubleClick ? e => {\n e.stopPropagation(); // 防止触发行双击事件\n onCellDoubleClick(row.original, cell.column, e);\n } : undefined}\n onMouseEnter={onCellMouseEnter ? e => onCellMouseEnter(row.original, cell.column, e) : undefined}\n onMouseLeave={onCellMouseLeave ? e => onCellMouseLeave(row.original, cell.column, e) : undefined}\n >\n <div\n className=\"flex items-center\"\n onContextMenu={\n onCellContextMenu\n ? e =>\n onCellContextMenu(\n e,\n row.original,\n cell.column,\n rowIndex,\n )\n : undefined\n }\n >\n {isFirstColumn && enableExpanding && (\n <>\n <div style={{ width: `${depth * indentSize}px` }} />\n {hasChildren ? (\n <button\n onClick={(e) => {\n e.stopPropagation();\n handleRowExpand(rowId, row.original);\n }}\n className=\"mr-2 focus:outline-none\"\n >\n {/* 完全重写箭头图标部分,使用内联样式控制方向 */}\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n style={{\n transition: 'transform 0.3s ease',\n transform: isExpanded ? 'rotate(90deg)' : 'rotate(0deg)'\n }}\n >\n {/* 使用右箭头,通过旋转变为下箭头 */}\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M9 5l7 7-7 7\"\n />\n </svg>\n </button>\n ) : (\n <div className=\"w-6\"></div>\n )}\n </>\n )}\n {cellContent}\n </div>\n </Table.Cell>\n );\n })}\n </Table.Row>\n );\n\n // 让扩展包裹整行(如在行下方追加 detail 面板)。\n if (hasExtensions) {\n const wrapped = extensions.reduce<React.ReactNode>(\n (node, ext) => ext.wrapRow?.(node, rowCtx, extensionApi!) ?? node,\n rowElement,\n );\n if (wrapped !== rowElement) {\n return <React.Fragment key={row.id}>{wrapped}</React.Fragment>;\n }\n }\n\n return rowElement;\n })\n )}\n </Table.Body>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TableBody.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TableBody.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable, flexRender } from '../tanstack-table';\nimport Table from '../../../Table';\nimport { RowEventHandler, CellEventHandler } from '../types';\nimport type {\n DataTableApi,\n DataTableCellContext,\n DataTableExtension,\n DataTableRowContext,\n} from '../extension';\n\ninterface TableBodyProps<T extends object> {\n table: TanStackTable<T>;\n expandedRowsState: Record<string, boolean>;\n onRowClick?: RowEventHandler;\n onRowDoubleClick?: RowEventHandler;\n onRowMouseEnter?: RowEventHandler;\n onRowMouseLeave?: RowEventHandler;\n onCellClick?: CellEventHandler;\n onCellDoubleClick?: CellEventHandler;\n onCellMouseEnter?: CellEventHandler;\n onCellMouseLeave?: CellEventHandler;\n enableExpanding: boolean;\n indentSize: number;\n handleRowExpand: (rowId: string, row: T) => void;\n // 扩展系统\n extensions?: DataTableExtension<T>[];\n extensionApi?: DataTableApi<T>;\n getRowId?: (row: T, index: number) => string;\n onCellContextMenu?: (\n e: React.MouseEvent,\n row: T,\n column: any,\n rowIndex: number,\n ) => void;\n}\n\nexport function TableBody<T extends object>({\n table,\n expandedRowsState,\n onRowClick,\n onRowDoubleClick,\n onRowMouseEnter,\n onRowMouseLeave,\n onCellClick,\n onCellDoubleClick,\n onCellMouseEnter,\n onCellMouseLeave,\n enableExpanding,\n indentSize,\n handleRowExpand,\n extensions = [],\n extensionApi,\n getRowId,\n onCellContextMenu,\n}: TableBodyProps<T>) {\n const hasExtensions = extensions.length > 0 && !!extensionApi;\n\n return (\n <Table.Body>\n {table.getRowModel().rows.length === 0 ? (\n <Table.Row>\n <Table.Cell colSpan={table.getAllColumns().length} className=\"text-center py-4\">\n 没有数据\n </Table.Cell>\n </Table.Row>\n ) : (\n table.getRowModel().rows.map((row, rowIndex) => {\n const rowData = row.original as any;\n const depth = rowData.__depth || 0;\n const hasChildren = rowData.__hasChildren || false;\n const rowId = rowData.__id;\n const isExpanded = hasChildren && expandedRowsState[rowId] || false;\n const isChildRow = depth > 0;\n const parentId = rowData.__parentId;\n const parentExpanded = parentId ? expandedRowsState[parentId] || false : true;\n\n // 根据层级和展开状态应用不同的CSS类\n const rowClassName = `\n ${row.getIsSelected() ? 'bg-primary/10' : ''}\n ${hasChildren ? (isExpanded ? 'tree-row-expanded' : '') : ''}\n `;\n\n // 如果是子行且父行未展开,则不显示\n if (isChildRow && !parentExpanded) {\n return null;\n }\n\n // 扩展的行级上下文与注入属性\n const resolvedRowId = getRowId\n ? getRowId(row.original, rowIndex)\n : String(rowId ?? rowIndex);\n const rowCtx: DataTableRowContext<T> = {\n row: row.original,\n rowId: resolvedRowId,\n rowIndex,\n selected: row.getIsSelected(),\n };\n const extraRowProps = hasExtensions\n ? extensions.reduce<React.HTMLAttributes<HTMLTableRowElement>>(\n (acc, ext) =>\n Object.assign(acc, ext.rowProps?.(rowCtx, extensionApi!) ?? {}),\n {},\n )\n : {};\n\n const rowElement = (\n <Table.Row\n key={row.id}\n className={rowClassName}\n onClick={onRowClick ? e => onRowClick(row.original, e) : undefined}\n onDoubleClick={onRowDoubleClick ? e => onRowDoubleClick(row.original, e) : undefined}\n onMouseEnter={onRowMouseEnter ? e => onRowMouseEnter(row.original, e) : undefined}\n onMouseLeave={onRowMouseLeave ? e => onRowMouseLeave(row.original, e) : undefined}\n {...(extraRowProps as any)}\n >\n {row.getVisibleCells().map((cell, cellIndex) => {\n // 为第一列添加缩进和展开/折叠控件\n const isFirstColumn = cellIndex === 0;\n\n // 扩展可覆写单元格渲染。\n let cellContent: React.ReactNode | undefined;\n if (hasExtensions) {\n const cellCtx: DataTableCellContext<T> = {\n value: cell.getValue(),\n row: row.original,\n rowId: resolvedRowId,\n rowIndex,\n columnId: cell.column.id,\n };\n for (const ext of extensions) {\n const out = ext.cell?.(cellCtx, extensionApi!);\n if (out !== undefined) {\n cellContent = out;\n break;\n }\n }\n }\n if (cellContent === undefined) {\n cellContent = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n );\n }\n\n return (\n <Table.Cell\n key={cell.id}\n onClick={onCellClick ? e => {\n e.stopPropagation(); // 防止触发行点击事件\n onCellClick(row.original, cell.column, e);\n } : undefined}\n onDoubleClick={onCellDoubleClick ? e => {\n e.stopPropagation(); // 防止触发行双击事件\n onCellDoubleClick(row.original, cell.column, e);\n } : undefined}\n onMouseEnter={onCellMouseEnter ? e => onCellMouseEnter(row.original, cell.column, e) : undefined}\n onMouseLeave={onCellMouseLeave ? e => onCellMouseLeave(row.original, cell.column, e) : undefined}\n >\n <div\n className=\"flex items-center\"\n onContextMenu={\n onCellContextMenu\n ? e =>\n onCellContextMenu(\n e,\n row.original,\n cell.column,\n rowIndex,\n )\n : undefined\n }\n >\n {isFirstColumn && enableExpanding && (\n <>\n <div style={{ width: `${depth * indentSize}px` }} />\n {hasChildren ? (\n <button\n onClick={(e) => {\n e.stopPropagation();\n handleRowExpand(rowId, row.original);\n }}\n className=\"mr-2 focus:outline-none\"\n >\n {/* 完全重写箭头图标部分,使用内联样式控制方向 */}\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n style={{\n transition: 'transform 0.3s ease',\n transform: isExpanded ? 'rotate(90deg)' : 'rotate(0deg)'\n }}\n >\n {/* 使用右箭头,通过旋转变为下箭头 */}\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M9 5l7 7-7 7\"\n />\n </svg>\n </button>\n ) : (\n <div className=\"w-6\"></div>\n )}\n </>\n )}\n {cellContent}\n </div>\n </Table.Cell>\n );\n })}\n </Table.Row>\n );\n\n // 让扩展包裹整行(如在行下方追加 detail 面板)。\n if (hasExtensions) {\n const wrapped = extensions.reduce<React.ReactNode>(\n (node, ext) => ext.wrapRow?.(node, rowCtx, extensionApi!) ?? node,\n rowElement,\n );\n if (wrapped !== rowElement) {\n return <React.Fragment key={row.id}>{wrapped}</React.Fragment>;\n }\n }\n\n return rowElement;\n })\n )}\n </Table.Body>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableHeader.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TableHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable, VisibilityState, flexRender } from '../tanstack-table';\nimport Table from '../../../Table';\nimport { ColumnEventHandler } from '../types';\n\ninterface TableHeaderProps<T extends object> {\n table: TanStackTable<T>;\n visibilityState: VisibilityState;\n enableSorting: boolean;\n enableColumnReordering: boolean;\n draggedColumnId: string | null;\n onColumnMouseEnter?: ColumnEventHandler;\n onColumnMouseLeave?: ColumnEventHandler;\n handleDragStart: (e: React.DragEvent, columnId: string) => void;\n handleDragOver: (e: React.DragEvent | Event) => void;\n handleDrop: (e: React.DragEvent, targetColumnId: string) => void;\n}\n\nexport function TableHeader<T extends object>({\n table,\n visibilityState,\n enableSorting,\n enableColumnReordering,\n draggedColumnId,\n onColumnMouseEnter,\n onColumnMouseLeave,\n handleDragStart,\n handleDragOver,\n handleDrop,\n}: TableHeaderProps<T>) {\n return (\n <Table.Head>\n {table.getHeaderGroups().map(headerGroup => (\n <Table.Row key={headerGroup.id}>\n {headerGroup.headers.map(header => {\n // 确保列是可见的\n const columnId = header.column.id;\n if (visibilityState[columnId] === false) return null;\n\n // 获取列的自定义元数据\n const meta = header.column.columnDef.meta || {};\n const isSortable = enableSorting && header.column.getCanSort();\n\n return (\n <Table.HeaderCell\n key={header.id}\n className={`\n ${isSortable ? 'cursor-pointer' : ''}\n ${enableColumnReordering ? 'cursor-move' : ''}\n ${draggedColumnId === header.id ? 'bg-primary/30 shadow-lg border-2 border-primary' : ''}\n `}\n onClick={isSortable ? header.column.getToggleSortingHandler() : undefined}\n onMouseEnter={onColumnMouseEnter ? e => onColumnMouseEnter(header.column, e) : undefined}\n onMouseLeave={onColumnMouseLeave ? e => onColumnMouseLeave(header.column, e) : undefined}\n draggable={enableColumnReordering}\n onDragStart={enableColumnReordering ? e => handleDragStart(e, header.id) : undefined}\n onDragOver={enableColumnReordering ? handleDragOver : undefined}\n onDrop={enableColumnReordering ? e => {\n handleDrop(e, header.id);\n // 清理所有拖拽相关的样式\n document.querySelectorAll('.bg-primary\\\\/20, .bg-primary\\\\/30, .dragging-source, .menu-item-highlight').forEach(el => {\n el.classList.remove('bg-primary/20');\n el.classList.remove('bg-primary/30');\n el.classList.remove('shadow-lg');\n el.classList.remove('border-b-2');\n el.classList.remove('border-2');\n el.classList.remove('border-l-4');\n el.classList.remove('border-primary');\n el.classList.remove('dragging-source');\n el.classList.remove('menu-item-highlight');\n });\n } : undefined}\n >\n <div className=\"flex items-center justify-between w-full\">\n {header.isPlaceholder ? null : (\n <div className=\"flex items-center\">\n {flexRender(\n header.column.columnDef.header,\n header.getContext()\n )}\n </div>\n )}\n\n {isSortable && (\n <div className=\"flex items-center ml-2\">\n <span className=\"w-4 flex justify-center\">\n {header.column.getIsSorted() ? (\n header.column.getIsSorted() === 'desc' ? (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4 text-success\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M5 15l7-7 7 7\" />\n </svg>\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4 text-error\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n )\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4 text-base-content/30\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4\" />\n </svg>\n )}\n </span>\n </div>\n )}\n </div>\n </Table.HeaderCell>\n );\n })}\n </Table.Row>\n ))}\n </Table.Head>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TableHeader.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TableHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable, VisibilityState, flexRender } from '../tanstack-table';\nimport Table from '../../../Table';\nimport { ColumnEventHandler } from '../types';\n\ninterface TableHeaderProps<T extends object> {\n table: TanStackTable<T>;\n visibilityState: VisibilityState;\n enableSorting: boolean;\n enableColumnReordering: boolean;\n draggedColumnId: string | null;\n onColumnMouseEnter?: ColumnEventHandler;\n onColumnMouseLeave?: ColumnEventHandler;\n handleDragStart: (e: React.DragEvent, columnId: string) => void;\n handleDragOver: (e: React.DragEvent | Event) => void;\n handleDrop: (e: React.DragEvent, targetColumnId: string) => void;\n}\n\nexport function TableHeader<T extends object>({\n table,\n visibilityState,\n enableSorting,\n enableColumnReordering,\n draggedColumnId,\n onColumnMouseEnter,\n onColumnMouseLeave,\n handleDragStart,\n handleDragOver,\n handleDrop,\n}: TableHeaderProps<T>) {\n return (\n <Table.Head>\n {table.getHeaderGroups().map(headerGroup => (\n <Table.Row key={headerGroup.id}>\n {headerGroup.headers.map(header => {\n // 确保列是可见的\n const columnId = header.column.id;\n if (visibilityState[columnId] === false) return null;\n\n // 获取列的自定义元数据\n const meta = header.column.columnDef.meta || {};\n const isSortable = enableSorting && header.column.getCanSort();\n\n return (\n <Table.HeaderCell\n key={header.id}\n className={`\n ${isSortable ? 'cursor-pointer' : ''}\n ${enableColumnReordering ? 'cursor-move' : ''}\n ${draggedColumnId === header.id ? 'bg-primary/30 shadow-lg border-2 border-primary' : ''}\n `}\n onClick={isSortable ? header.column.getToggleSortingHandler() : undefined}\n onMouseEnter={onColumnMouseEnter ? e => onColumnMouseEnter(header.column, e) : undefined}\n onMouseLeave={onColumnMouseLeave ? e => onColumnMouseLeave(header.column, e) : undefined}\n draggable={enableColumnReordering}\n onDragStart={enableColumnReordering ? e => handleDragStart(e, header.id) : undefined}\n onDragOver={enableColumnReordering ? handleDragOver : undefined}\n onDrop={enableColumnReordering ? e => {\n handleDrop(e, header.id);\n // 清理所有拖拽相关的样式\n document.querySelectorAll('.bg-primary\\\\/20, .bg-primary\\\\/30, .dragging-source, .menu-item-highlight').forEach(el => {\n el.classList.remove('bg-primary/20');\n el.classList.remove('bg-primary/30');\n el.classList.remove('shadow-lg');\n el.classList.remove('border-b-2');\n el.classList.remove('border-2');\n el.classList.remove('border-l-4');\n el.classList.remove('border-primary');\n el.classList.remove('dragging-source');\n el.classList.remove('menu-item-highlight');\n });\n } : undefined}\n >\n <div className=\"flex items-center justify-between w-full\">\n {header.isPlaceholder ? null : (\n <div className=\"flex items-center\">\n {flexRender(\n header.column.columnDef.header,\n header.getContext()\n )}\n </div>\n )}\n\n {isSortable && (\n <div className=\"flex items-center ml-2\">\n <span className=\"w-4 flex justify-center\">\n {header.column.getIsSorted() ? (\n header.column.getIsSorted() === 'desc' ? (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4 text-success\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M5 15l7-7 7 7\" />\n </svg>\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4 text-error\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n )\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"h-4 w-4 text-base-content/30\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4\" />\n </svg>\n )}\n </span>\n </div>\n )}\n </div>\n </Table.HeaderCell>\n );\n })}\n </Table.Row>\n ))}\n </Table.Head>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TablePagination.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TablePagination.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable } from '../tanstack-table';\n\ninterface TablePaginationProps<T extends object> {\n enablePagination: boolean;\n table: TanStackTable<T>;\n internalPageIndex: number;\n internalPageSize: number;\n handlePageChange: (newPage: number) => void;\n setInternalPageSize: (newSize: number) => void;\n setInternalPageIndex: (page: number) => void;\n onPageSizeChange?: (pageSize: number) => void;\n onPageChange?: (page: number) => void;\n}\n\nexport function TablePagination<T extends object>({\n enablePagination,\n table,\n internalPageIndex,\n internalPageSize,\n handlePageChange,\n setInternalPageSize,\n setInternalPageIndex,\n onPageSizeChange,\n onPageChange,\n}: TablePaginationProps<T>) {\n if (!enablePagination) return null;\n\n const { pageIndex } = table.state.pagination;\n const pageCount = table.getPageCount();\n\n return (\n <div className=\"mt-4 flex justify-between items-center\">\n <div>\n <span className=\"text-sm\">\n 第 {pageIndex + 1} 页,共 {pageCount} 页\n </span>\n </div>\n <div className=\"join\">\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(0)}\n disabled={!table.getCanPreviousPage()}\n >\n {'<<'}\n </button>\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(pageIndex - 1)}\n disabled={!table.getCanPreviousPage()}\n >\n {'<'}\n </button>\n {Array.from({ length: Math.min(5, pageCount) }).map((_, i) => {\n // 显示当前页前后两页\n let pageNum = pageIndex - 2 + i;\n\n // 确保页码在合法范围内\n if (pageNum < 0) pageNum = i;\n if (pageNum >= pageCount) pageNum = pageCount - 5 + i;\n\n // 如果总页数小于5,直接显示全部页码\n if (pageCount <= 5) {\n pageNum = i;\n }\n\n // 如果页码超出范围,不显示\n if (pageNum < 0 || pageNum >= pageCount) return null;\n\n return (\n <button\n key={pageNum}\n className={`join-item btn btn-sm ${pageNum === pageIndex ? 'btn-active' : ''}`}\n onClick={() => handlePageChange(pageNum)}\n >\n {pageNum + 1}\n </button>\n );\n })}\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(pageIndex + 1)}\n disabled={!table.getCanNextPage()}\n >\n {'>'}\n </button>\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(pageCount - 1)}\n disabled={!table.getCanNextPage()}\n >\n {'>>'}\n </button>\n </div>\n <div>\n <select\n className=\"select select-sm select-bordered\"\n value={internalPageSize}\n onChange={(e) => {\n const newSize = Number(e.target.value);\n\n // 更新内部页面大小\n setInternalPageSize(newSize);\n\n // 通知外部页面大小变更\n if (onPageSizeChange) {\n onPageSizeChange(newSize);\n }\n\n // 重置到第一页\n setInternalPageIndex(0);\n\n // 通知外部页码重置为0\n if (onPageChange) {\n onPageChange(0);\n }\n }}\n >\n {[5, 10, 15, 20, 25].map((pageSize) => (\n <option key={pageSize} value={pageSize}>\n {pageSize} 条/页\n </option>\n ))}\n </select>\n </div>\n </div>\n );\n}\n"],"mappings":";;AAeA,SAAgB,EAAkC,EAC9C,kBAAA,GACA,OAAA,GACA,mBAAA,GACA,kBAAA,GACA,kBAAA,GACA,qBAAA,GACA,sBAAA,GACA,kBAAA,GACA,cAAA,EAAA,GACwB;AACxB,MAAI,CAAC,EAAkB,QAAO;AAE9B,QAAM,EAAE,WAAA,EAAA,IAAc,EAAM,MAAM,YAC5B,IAAY,EAAM,aAAa;AAErC,SACI,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,
|
|
1
|
+
{"version":3,"file":"TablePagination.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TablePagination.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as TanStackTable } from '../tanstack-table';\n\ninterface TablePaginationProps<T extends object> {\n enablePagination: boolean;\n table: TanStackTable<T>;\n internalPageIndex: number;\n internalPageSize: number;\n handlePageChange: (newPage: number) => void;\n setInternalPageSize: (newSize: number) => void;\n setInternalPageIndex: (page: number) => void;\n onPageSizeChange?: (pageSize: number) => void;\n onPageChange?: (page: number) => void;\n}\n\nexport function TablePagination<T extends object>({\n enablePagination,\n table,\n internalPageIndex,\n internalPageSize,\n handlePageChange,\n setInternalPageSize,\n setInternalPageIndex,\n onPageSizeChange,\n onPageChange,\n}: TablePaginationProps<T>) {\n if (!enablePagination) return null;\n\n const { pageIndex } = table.state.pagination;\n const pageCount = table.getPageCount();\n\n return (\n <div className=\"mt-4 flex justify-between items-center\">\n <div>\n <span className=\"text-sm\">\n 第 {pageIndex + 1} 页,共 {pageCount} 页\n </span>\n </div>\n <div className=\"join\">\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(0)}\n disabled={!table.getCanPreviousPage()}\n >\n {'<<'}\n </button>\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(pageIndex - 1)}\n disabled={!table.getCanPreviousPage()}\n >\n {'<'}\n </button>\n {Array.from({ length: Math.min(5, pageCount) }).map((_, i) => {\n // 显示当前页前后两页\n let pageNum = pageIndex - 2 + i;\n\n // 确保页码在合法范围内\n if (pageNum < 0) pageNum = i;\n if (pageNum >= pageCount) pageNum = pageCount - 5 + i;\n\n // 如果总页数小于5,直接显示全部页码\n if (pageCount <= 5) {\n pageNum = i;\n }\n\n // 如果页码超出范围,不显示\n if (pageNum < 0 || pageNum >= pageCount) return null;\n\n return (\n <button\n key={pageNum}\n className={`join-item btn btn-sm ${pageNum === pageIndex ? 'btn-active' : ''}`}\n onClick={() => handlePageChange(pageNum)}\n >\n {pageNum + 1}\n </button>\n );\n })}\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(pageIndex + 1)}\n disabled={!table.getCanNextPage()}\n >\n {'>'}\n </button>\n <button\n className=\"join-item btn btn-sm\"\n onClick={() => handlePageChange(pageCount - 1)}\n disabled={!table.getCanNextPage()}\n >\n {'>>'}\n </button>\n </div>\n <div>\n <select\n className=\"select select-sm select-bordered\"\n value={internalPageSize}\n onChange={(e) => {\n const newSize = Number(e.target.value);\n\n // 更新内部页面大小\n setInternalPageSize(newSize);\n\n // 通知外部页面大小变更\n if (onPageSizeChange) {\n onPageSizeChange(newSize);\n }\n\n // 重置到第一页\n setInternalPageIndex(0);\n\n // 通知外部页码重置为0\n if (onPageChange) {\n onPageChange(0);\n }\n }}\n >\n {[5, 10, 15, 20, 25].map((pageSize) => (\n <option key={pageSize} value={pageSize}>\n {pageSize} 条/页\n </option>\n ))}\n </select>\n </div>\n </div>\n );\n}\n"],"mappings":";;AAeA,SAAgB,EAAkC,EAC9C,kBAAA,GACA,OAAA,GACA,mBAAA,GACA,kBAAA,GACA,kBAAA,GACA,qBAAA,GACA,sBAAA,GACA,kBAAA,GACA,cAAA,EAAA,GACwB;AACxB,MAAI,CAAC,EAAkB,QAAO;AAE9B,QAAM,EAAE,WAAA,EAAA,IAAc,EAAM,MAAM,YAC5B,IAAY,EAAM,aAAa;AAErC,SACI,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,IAAf,UAAA;AAAA,MACI,gBAAA,EAAC,OAAD,EAAA,UACI,gBAAA,EAAC,QAAD;AAAA,QAAM,WAAU;AAAA,QAAhB,UAAA;AAAA,UAA0B;AAAA,UACnB,IAAY;AAAA,UAAE;AAAA,UAAM;AAAA,UAAU;AAAA,QAC/B;AAAA,MACL,CAAA,EAAA,CAAA;AAAA,MACL,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,QAAf,UAAA;AAAA,UACI,gBAAA,EAAC,UAAD;AAAA,YACI,WAAU;AAAA,YACV,SAAA,MAAe,EAAiB,CAAC;AAAA,YACjC,UAAU,CAAC,EAAM,mBAAmB;AAAA,YAEnC,UAAA;AAAA,UACG,CAAA;AAAA,UACR,gBAAA,EAAC,UAAD;AAAA,YACI,WAAU;AAAA,YACV,SAAA,MAAe,EAAiB,IAAY,CAAC;AAAA,YAC7C,UAAU,CAAC,EAAM,mBAAmB;AAAA,YAEnC,UAAA;AAAA,UACG,CAAA;AAAA,UACP,MAAM,KAAK,EAAE,QAAQ,KAAK,IAAI,GAAG,CAAS,EAAE,CAAC,EAAE,IAAA,CAAK,GAAG,MAAM;AAE1D,gBAAI,IAAU,IAAY,IAAI;AAY9B,mBATI,IAAU,MAAG,IAAU,IACvB,KAAW,MAAW,IAAU,IAAY,IAAI,IAGhD,KAAa,MACb,IAAU,IAIV,IAAU,KAAK,KAAW,IAAkB,OAG5C,gBAAA,EAAC,UAAD;AAAA,cAEI,WAAW,wBAAwB,MAAY,IAAY,eAAe,EAAA;AAAA,cAC1E,SAAA,MAAe,EAAiB,CAAO;AAAA,cAEtC,UAAA,IAAU;AAAA,YACP,GALC,CAKD;AAAA,UAEhB,CAAC;AAAA,UACD,gBAAA,EAAC,UAAD;AAAA,YACI,WAAU;AAAA,YACV,SAAA,MAAe,EAAiB,IAAY,CAAC;AAAA,YAC7C,UAAU,CAAC,EAAM,eAAe;AAAA,YAE/B,UAAA;AAAA,UACG,CAAA;AAAA,UACR,gBAAA,EAAC,UAAD;AAAA,YACI,WAAU;AAAA,YACV,SAAA,MAAe,EAAiB,IAAY,CAAC;AAAA,YAC7C,UAAU,CAAC,EAAM,eAAe;AAAA,YAE/B,UAAA;AAAA,UACG,CAAA;AAAA,QACP;AAAA;MACL,gBAAA,EAAC,OAAD,EAAA,UACI,gBAAA,EAAC,UAAD;AAAA,QACI,WAAU;AAAA,QACV,OAAO;AAAA,QACP,UAAA,CAAW,MAAM;AACb,gBAAM,IAAU,OAAO,EAAE,OAAO,KAAK;AAGrC,UAAA,EAAoB,CAAO,GAGvB,KACA,EAAiB,CAAO,GAI5B,EAAqB,CAAC,GAGlB,KACA,EAAa,CAAC;AAAA,QAEtB;AAAA,QAEC,UAAA;AAAA,UAAC;AAAA,UAAG;AAAA,UAAI;AAAA,UAAI;AAAA,UAAI;AAAA,QAAE,EAAE,IAAA,CAAK,MACtB,gBAAA,EAAC,UAAD;AAAA,UAAuB,OAAO;AAAA,UAA9B,UAAA,CACK,GAAS,MACN;AAAA,QAFK,GAAA,CAEL,CACX;AAAA,MACG,CAAA,EACP,CAAA;AAAA,IACJ;AAAA;AAEb"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableToolbar.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TableToolbar.tsx"],"sourcesContent":["import React from 'react';\nimport { Table, VisibilityState, RowSelectionState } from '../tanstack-table';\nimport { ToolbarOptions, CustomFilterPanelProps, DataTableProps } from '../types';\nimport { ColumnSelector } from './ColumnSelector';\nimport { FilterBar } from './FilterBar';\nimport { BulkActions } from './BulkActions';\n\ninterface TableToolbarProps<T extends object> {\n toolbar: ToolbarOptions;\n table: Table<T>;\n columns: DataTableProps<T>['columns'];\n columnOrderState: string[];\n visibilityState: VisibilityState;\n activeFilter: string | null;\n setActiveFilter: (filter: string | null) => void;\n customFilterPanel?: React.ComponentType<CustomFilterPanelProps>;\n draggedColumnId: string | null;\n handleDragStart: (e: React.DragEvent, columnId: string) => void;\n toggleColumnVisibility: (columnId: string) => void;\n rowSelection: RowSelectionState;\n data: T[];\n enableColumnReordering: boolean;\n handleDrop: (e: React.DragEvent, targetColumnId: string) => void;\n}\n\nexport function TableToolbar<T extends object>({\n toolbar,\n table,\n columns,\n columnOrderState,\n visibilityState,\n activeFilter,\n setActiveFilter,\n customFilterPanel,\n draggedColumnId,\n handleDragStart,\n toggleColumnVisibility,\n rowSelection,\n data,\n enableColumnReordering,\n handleDrop,\n}: TableToolbarProps<T>) {\n if (!toolbar.enabled) return null;\n\n return (\n <div className=\"flex flex-wrap justify-between gap-4 mb-4\">\n <div className=\"flex flex-wrap gap-2 items-center\">\n {toolbar.enableColumnSelector && (\n <ColumnSelector\n table={table}\n columns={columns}\n columnOrderState={columnOrderState}\n visibilityState={visibilityState}\n toggleColumnVisibility={toggleColumnVisibility}\n enableColumnReordering={enableColumnReordering}\n handleDragStart={handleDragStart}\n handleDrop={handleDrop}\n draggedColumnId={draggedColumnId}\n />\n )}\n\n {toolbar.enableFiltering && (\n <FilterBar\n table={table}\n columns={columns}\n activeFilter={activeFilter}\n setActiveFilter={setActiveFilter}\n customFilterPanel={customFilterPanel}\n filterConfig={toolbar.filterConfig}\n />\n )}\n\n {toolbar.customComponents}\n </div>\n\n {toolbar.enableBulkActions && toolbar.bulkActions && (\n <BulkActions\n bulkActions={toolbar.bulkActions}\n rowSelection={rowSelection}\n data={data}\n />\n )}\n </div>\n );\n}\n\n"],"mappings":";;;;;AAyBA,SAAgB,EAA+B,EAC3C,SAAA,GACA,OAAA,GACA,SAAA,GACA,kBAAA,GACA,iBAAA,GACA,cAAA,GACA,iBAAA,GACA,mBAAA,GACA,iBAAA,GACA,iBAAA,GACA,wBAAA,GACA,cAAA,GACA,MAAA,GACA,wBAAA,GACA,YAAA,EAAA,GACqB;AACrB,SAAK,EAAQ,UAGT,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,
|
|
1
|
+
{"version":3,"file":"TableToolbar.js","names":[],"sources":["../../../../../src/components/pro/DataTable/components/TableToolbar.tsx"],"sourcesContent":["import React from 'react';\nimport { Table, VisibilityState, RowSelectionState } from '../tanstack-table';\nimport { ToolbarOptions, CustomFilterPanelProps, DataTableProps } from '../types';\nimport { ColumnSelector } from './ColumnSelector';\nimport { FilterBar } from './FilterBar';\nimport { BulkActions } from './BulkActions';\n\ninterface TableToolbarProps<T extends object> {\n toolbar: ToolbarOptions;\n table: Table<T>;\n columns: DataTableProps<T>['columns'];\n columnOrderState: string[];\n visibilityState: VisibilityState;\n activeFilter: string | null;\n setActiveFilter: (filter: string | null) => void;\n customFilterPanel?: React.ComponentType<CustomFilterPanelProps>;\n draggedColumnId: string | null;\n handleDragStart: (e: React.DragEvent, columnId: string) => void;\n toggleColumnVisibility: (columnId: string) => void;\n rowSelection: RowSelectionState;\n data: T[];\n enableColumnReordering: boolean;\n handleDrop: (e: React.DragEvent, targetColumnId: string) => void;\n}\n\nexport function TableToolbar<T extends object>({\n toolbar,\n table,\n columns,\n columnOrderState,\n visibilityState,\n activeFilter,\n setActiveFilter,\n customFilterPanel,\n draggedColumnId,\n handleDragStart,\n toggleColumnVisibility,\n rowSelection,\n data,\n enableColumnReordering,\n handleDrop,\n}: TableToolbarProps<T>) {\n if (!toolbar.enabled) return null;\n\n return (\n <div className=\"flex flex-wrap justify-between gap-4 mb-4\">\n <div className=\"flex flex-wrap gap-2 items-center\">\n {toolbar.enableColumnSelector && (\n <ColumnSelector\n table={table}\n columns={columns}\n columnOrderState={columnOrderState}\n visibilityState={visibilityState}\n toggleColumnVisibility={toggleColumnVisibility}\n enableColumnReordering={enableColumnReordering}\n handleDragStart={handleDragStart}\n handleDrop={handleDrop}\n draggedColumnId={draggedColumnId}\n />\n )}\n\n {toolbar.enableFiltering && (\n <FilterBar\n table={table}\n columns={columns}\n activeFilter={activeFilter}\n setActiveFilter={setActiveFilter}\n customFilterPanel={customFilterPanel}\n filterConfig={toolbar.filterConfig}\n />\n )}\n\n {toolbar.customComponents}\n </div>\n\n {toolbar.enableBulkActions && toolbar.bulkActions && (\n <BulkActions\n bulkActions={toolbar.bulkActions}\n rowSelection={rowSelection}\n data={data}\n />\n )}\n </div>\n );\n}\n\n"],"mappings":";;;;;AAyBA,SAAgB,EAA+B,EAC3C,SAAA,GACA,OAAA,GACA,SAAA,GACA,kBAAA,GACA,iBAAA,GACA,cAAA,GACA,iBAAA,GACA,mBAAA,GACA,iBAAA,GACA,iBAAA,GACA,wBAAA,GACA,cAAA,GACA,MAAA,GACA,wBAAA,GACA,YAAA,EAAA,GACqB;AACrB,SAAK,EAAQ,UAGT,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,IAAf,UAAA,CACI,gBAAA,EAAC,OAAD;AAAA,MAAK,WAAU;AAAA,MAAf,UAAA;AAAA,QACK,EAAQ,wBACL,gBAAA,EAAC,GAAD;AAAA,UACW,OAAA;AAAA,UACE,SAAA;AAAA,UACS,kBAAA;AAAA,UACD,iBAAA;AAAA,UACO,wBAAA;AAAA,UACA,wBAAA;AAAA,UACP,iBAAA;AAAA,UACL,YAAA;AAAA,UACK,iBAAA;AAAA,QACpB,CAAA;AAAA,QAGJ,EAAQ,mBACL,gBAAA,EAAC,GAAD;AAAA,UACW,OAAA;AAAA,UACE,SAAA;AAAA,UACK,cAAA;AAAA,UACG,iBAAA;AAAA,UACE,mBAAA;AAAA,UACnB,cAAc,EAAQ;AAAA,QACzB,CAAA;AAAA,QAGJ,EAAQ;AAAA,MACR;AAAA,IAEJ,CAAA,GAAA,EAAQ,qBAAqB,EAAQ,eAClC,gBAAA,EAAC,GAAD;AAAA,MACI,aAAa,EAAQ;AAAA,MACP,cAAA;AAAA,MACR,MAAA;AAAA,IACT,CAAA,CAEJ;AAAA,OAxCoB;AA0CjC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pivotExtension.js","names":[],"sources":["../../../../src/components/pro/DataTable/pivotExtension.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport {\n PivotView,\n type PivotValue,\n type PivotFieldLabels,\n} from './PivotView';\nimport { PivotPanel } from './PivotPanel';\nimport type { DataTableExtension } from './extension';\n\n/** 可参与透视的字段描述。 */\nexport interface PivotField {\n /** 字段 key(对应数据对象的属性名)。 */\n field: string;\n /** 展示标签。 */\n label?: string;\n /** 是否为可聚合的数值字段。默认 false(维度字段)。 */\n numeric?: boolean;\n}\n\n/** 配置面板的排布位置。 */\nexport type PivotPanelPlacement = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface PivotExtensionOptions {\n /** 可用于透视的字段列表。 */\n fields: PivotField[];\n /** 初始行分组字段。 */\n initialRowFields?: string[];\n /** 初始列分组字段。 */\n initialColFields?: string[];\n /** 初始数值度量。 */\n initialValues?: PivotValue[];\n /** 初始是否启用透视模式。默认 false。 */\n initialActive?: boolean;\n /** 是否以树形(可展开分组)展示多级行分组。默认 true。 */\n treeView?: boolean;\n /** 语言。默认 'zh'。 */\n lang?: 'zh' | 'en';\n /**\n * 配置面板的排布位置:\n * - `'top'`(默认)水平排布在工具栏下方;\n * - `'bottom'` 水平排布在透视表格下方;\n * - `'left'` / `'right'` 纵向排布在透视表格的左/右侧。\n */\n panelPlacement?: PivotPanelPlacement;\n /**\n * 垂直(`'left'`/`'right'`)面板的宽度。数字视为 px,字符串直接\n * 作为 CSS 宽度(如 `'20%'` / `'16rem'`)。仅对左/右侧纵向面板生效,\n * 默认 224px。\n */\n panelWidth?: number | string;\n /**\n * 隐藏工具栏中的「透视模式」开关。默认 false。\n * 适用于由外部(如宿主 Inspector)控制透视开关的场景:此时模式仅能通过\n * `initialActive` 设定,工具栏不再渲染开关;未激活时不占用任何工具栏空间。\n */\n hideModeToggle?: boolean;\n}\n\nconst TEXT = {\n zh: { pivotMode: '透视模式' },\n en: { pivotMode: 'Pivot Mode' },\n} as const;\n\n/**\n * 透视(Pivot)扩展。\n *\n * 使用方式(在组件内调用该 hook,因为它持有 React 状态):\n * ```tsx\n * const pivot = usePivotExtension<Row>({\n * fields: [\n * { field: 'region', label: '地区' },\n * { field: 'category', label: '品类' },\n * { field: 'amount', label: '金额', numeric: true },\n * ],\n * initialRowFields: ['region'],\n * initialValues: [{ field: 'amount', aggFn: 'sum' }],\n * panelPlacement: 'left', // 面板纵向排布在左侧\n * });\n * <DataTable data={data} columns={columns} extensions={[pivot]} />\n * ```\n *\n * 扩展会:\n * - 在工具栏放一个「透视模式」开关;\n * - 开启后通过 `renderContent` 接管表格主体,渲染 ag-grid 风格的交叉表 +\n * 可拖拽配置面板(支持顶部水平 / 左右纵向排布,拖拽时带跟随光标的拖拽引用)。\n */\nexport function usePivotExtension<T extends object>(\n options: PivotExtensionOptions,\n): DataTableExtension<T> {\n const {\n fields,\n initialRowFields = [],\n initialColFields = [],\n initialValues = [],\n initialActive = false,\n treeView = true,\n lang = 'zh',\n panelPlacement = 'top',\n panelWidth = 224,\n hideModeToggle = false,\n } = options;\n\n const [active, setActive] = useState(initialActive);\n const [rowFields, setRowFields] = useState<string[]>(initialRowFields);\n const [colFields, setColFields] = useState<string[]>(initialColFields);\n const [values, setValues] = useState<PivotValue[]>(initialValues);\n\n const t = TEXT[lang];\n\n const fieldLabels: PivotFieldLabels = useMemo(() => {\n const map: PivotFieldLabels = {};\n for (const f of fields) map[f.field] = f.label ?? f.field;\n return map;\n }, [fields]);\n\n const dimensionFields = useMemo(\n () => fields.filter((f) => !f.numeric),\n [fields],\n );\n const numericFields = useMemo(\n () => fields.filter((f) => f.numeric),\n [fields],\n );\n\n return useMemo<DataTableExtension<T>>(() => {\n const panel = (orientation: 'horizontal' | 'vertical') => (\n <PivotPanel\n orientation={orientation}\n lang={lang}\n fieldLabels={fieldLabels}\n dimensionFields={dimensionFields}\n numericFields={numericFields}\n rowFields={rowFields}\n colFields={colFields}\n values={values}\n setRowFields={setRowFields}\n setColFields={setColFields}\n setValues={setValues}\n panelWidth={panelWidth}\n />\n );\n\n return {\n name: 'pivot',\n toolbar: () => {\n // 隐藏开关时:未激活不渲染任何内容(不占空间);激活且面板在顶部\n // 时仅渲染面板本身。\n if (hideModeToggle) {\n if (!active || panelPlacement !== 'top') return null;\n return panel('horizontal');\n }\n return (\n <div className=\"w-full flex flex-col gap-2\">\n <label className=\"flex items-center gap-2 cursor-pointer w-fit\">\n <input\n type=\"checkbox\"\n className=\"toggle toggle-sm toggle-primary\"\n checked={active}\n onChange={(e) => setActive(e.target.checked)}\n />\n <span className=\"text-sm font-medium\">{t.pivotMode}</span>\n </label>\n {/* 顶部(水平)面板放在工具栏内。 */}\n {active && panelPlacement === 'top' && panel('horizontal')}\n </div>\n );\n },\n renderContent: (api) => {\n if (!active) return undefined;\n const content = (\n <PivotView<T>\n data={api.data}\n rowFields={rowFields}\n colFields={colFields}\n values={values}\n fieldLabels={fieldLabels}\n lang={lang}\n treeView={treeView}\n />\n );\n // 顶部面板已在工具栏内渲染,这里只渲染表格主体。\n if (panelPlacement === 'top') return content;\n // 底部面板:水平排布在透视表格下方。\n if (panelPlacement === 'bottom') {\n return (\n <div className=\"flex flex-col gap-3\">\n <div className=\"flex-1 min-w-0\">{content}</div>\n {panel('horizontal')}\n </div>\n );\n }\n // 左/右侧纵向面板:与透视表格并排,默认与表格同高。\n return (\n <div className=\"flex gap-3 items-stretch\">\n {panelPlacement === 'left' && panel('vertical')}\n <div className=\"flex-1 min-w-0\">{content}</div>\n {panelPlacement === 'right' && panel('vertical')}\n </div>\n );\n },\n };\n }, [\n active,\n rowFields,\n colFields,\n values,\n fieldLabels,\n dimensionFields,\n numericFields,\n treeView,\n lang,\n panelPlacement,\n panelWidth,\n hideModeToggle,\n t,\n ]);\n}\n"],"mappings":";;;;AA0DA,IAAM,IAAO;AAAA,EACT,IAAI,EAAE,WAAW,OAAO;AAAA,EACxB,IAAI,EAAE,WAAW,aAAa;AAClC;AAyBA,SAAgB,EACZ,GACqB;AACrB,QAAM,EACF,QAAA,GACA,kBAAA,IAAmB,CAAC,GACpB,kBAAA,IAAmB,CAAC,GACpB,eAAA,IAAgB,CAAC,GACjB,eAAA,IAAgB,IAChB,UAAA,IAAW,IACX,MAAA,IAAO,MACP,gBAAA,IAAiB,OACjB,YAAA,IAAa,KACb,gBAAA,IAAiB,GAAA,IACjB,GAEE,CAAC,GAAQ,CAAA,IAAa,EAAS,CAAa,GAC5C,CAAC,GAAW,CAAA,IAAgB,EAAmB,CAAgB,GAC/D,CAAC,GAAW,CAAA,IAAgB,EAAmB,CAAgB,GAC/D,CAAC,GAAQ,CAAA,IAAa,EAAuB,CAAa,GAE1D,IAAI,EAAK,CAAA,GAET,IAAgC,EAAA,MAAc;AAChD,UAAM,IAAwB,CAAC;AAC/B,eAAW,KAAK,EAAQ,CAAA,EAAI,EAAE,KAAA,IAAS,EAAE,SAAS,EAAE;AACpD,WAAO;AAAA,EACX,GAAG,CAAC,CAAM,CAAC,GAEL,IAAkB,EAAA,MACd,EAAO,OAAA,CAAQ,MAAM,CAAC,EAAE,OAAO,GACrC,CAAC,CAAM,CACX,GACM,IAAgB,EAAA,MACZ,EAAO,OAAA,CAAQ,MAAM,EAAE,OAAO,GACpC,CAAC,CAAM,CACX;AAEA,SAAO,EAAA,MAAqC;AACxC,UAAM,IAAA,CAAS,MACX,gBAAA,EAAC,GAAD;AAAA,MACiB,aAAA;AAAA,MACP,MAAA;AAAA,MACO,aAAA;AAAA,MACI,iBAAA;AAAA,MACF,eAAA;AAAA,MACJ,WAAA;AAAA,MACA,WAAA;AAAA,MACH,QAAA;AAAA,MACM,cAAA;AAAA,MACA,cAAA;AAAA,MACH,WAAA;AAAA,MACC,YAAA;AAAA,IACf,CAAA;AAGL,WAAO;AAAA,MACH,MAAM;AAAA,MACN,SAAA,MAGQ,IACI,CAAC,KAAU,MAAmB,QAAc,OACzC,EAAM,YAAY,IAGzB,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,
|
|
1
|
+
{"version":3,"file":"pivotExtension.js","names":[],"sources":["../../../../src/components/pro/DataTable/pivotExtension.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport {\n PivotView,\n type PivotValue,\n type PivotFieldLabels,\n} from './PivotView';\nimport { PivotPanel } from './PivotPanel';\nimport type { DataTableExtension } from './extension';\n\n/** 可参与透视的字段描述。 */\nexport interface PivotField {\n /** 字段 key(对应数据对象的属性名)。 */\n field: string;\n /** 展示标签。 */\n label?: string;\n /** 是否为可聚合的数值字段。默认 false(维度字段)。 */\n numeric?: boolean;\n}\n\n/** 配置面板的排布位置。 */\nexport type PivotPanelPlacement = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface PivotExtensionOptions {\n /** 可用于透视的字段列表。 */\n fields: PivotField[];\n /** 初始行分组字段。 */\n initialRowFields?: string[];\n /** 初始列分组字段。 */\n initialColFields?: string[];\n /** 初始数值度量。 */\n initialValues?: PivotValue[];\n /** 初始是否启用透视模式。默认 false。 */\n initialActive?: boolean;\n /** 是否以树形(可展开分组)展示多级行分组。默认 true。 */\n treeView?: boolean;\n /** 语言。默认 'zh'。 */\n lang?: 'zh' | 'en';\n /**\n * 配置面板的排布位置:\n * - `'top'`(默认)水平排布在工具栏下方;\n * - `'bottom'` 水平排布在透视表格下方;\n * - `'left'` / `'right'` 纵向排布在透视表格的左/右侧。\n */\n panelPlacement?: PivotPanelPlacement;\n /**\n * 垂直(`'left'`/`'right'`)面板的宽度。数字视为 px,字符串直接\n * 作为 CSS 宽度(如 `'20%'` / `'16rem'`)。仅对左/右侧纵向面板生效,\n * 默认 224px。\n */\n panelWidth?: number | string;\n /**\n * 隐藏工具栏中的「透视模式」开关。默认 false。\n * 适用于由外部(如宿主 Inspector)控制透视开关的场景:此时模式仅能通过\n * `initialActive` 设定,工具栏不再渲染开关;未激活时不占用任何工具栏空间。\n */\n hideModeToggle?: boolean;\n}\n\nconst TEXT = {\n zh: { pivotMode: '透视模式' },\n en: { pivotMode: 'Pivot Mode' },\n} as const;\n\n/**\n * 透视(Pivot)扩展。\n *\n * 使用方式(在组件内调用该 hook,因为它持有 React 状态):\n * ```tsx\n * const pivot = usePivotExtension<Row>({\n * fields: [\n * { field: 'region', label: '地区' },\n * { field: 'category', label: '品类' },\n * { field: 'amount', label: '金额', numeric: true },\n * ],\n * initialRowFields: ['region'],\n * initialValues: [{ field: 'amount', aggFn: 'sum' }],\n * panelPlacement: 'left', // 面板纵向排布在左侧\n * });\n * <DataTable data={data} columns={columns} extensions={[pivot]} />\n * ```\n *\n * 扩展会:\n * - 在工具栏放一个「透视模式」开关;\n * - 开启后通过 `renderContent` 接管表格主体,渲染 ag-grid 风格的交叉表 +\n * 可拖拽配置面板(支持顶部水平 / 左右纵向排布,拖拽时带跟随光标的拖拽引用)。\n */\nexport function usePivotExtension<T extends object>(\n options: PivotExtensionOptions,\n): DataTableExtension<T> {\n const {\n fields,\n initialRowFields = [],\n initialColFields = [],\n initialValues = [],\n initialActive = false,\n treeView = true,\n lang = 'zh',\n panelPlacement = 'top',\n panelWidth = 224,\n hideModeToggle = false,\n } = options;\n\n const [active, setActive] = useState(initialActive);\n const [rowFields, setRowFields] = useState<string[]>(initialRowFields);\n const [colFields, setColFields] = useState<string[]>(initialColFields);\n const [values, setValues] = useState<PivotValue[]>(initialValues);\n\n const t = TEXT[lang];\n\n const fieldLabels: PivotFieldLabels = useMemo(() => {\n const map: PivotFieldLabels = {};\n for (const f of fields) map[f.field] = f.label ?? f.field;\n return map;\n }, [fields]);\n\n const dimensionFields = useMemo(\n () => fields.filter((f) => !f.numeric),\n [fields],\n );\n const numericFields = useMemo(\n () => fields.filter((f) => f.numeric),\n [fields],\n );\n\n return useMemo<DataTableExtension<T>>(() => {\n const panel = (orientation: 'horizontal' | 'vertical') => (\n <PivotPanel\n orientation={orientation}\n lang={lang}\n fieldLabels={fieldLabels}\n dimensionFields={dimensionFields}\n numericFields={numericFields}\n rowFields={rowFields}\n colFields={colFields}\n values={values}\n setRowFields={setRowFields}\n setColFields={setColFields}\n setValues={setValues}\n panelWidth={panelWidth}\n />\n );\n\n return {\n name: 'pivot',\n toolbar: () => {\n // 隐藏开关时:未激活不渲染任何内容(不占空间);激活且面板在顶部\n // 时仅渲染面板本身。\n if (hideModeToggle) {\n if (!active || panelPlacement !== 'top') return null;\n return panel('horizontal');\n }\n return (\n <div className=\"w-full flex flex-col gap-2\">\n <label className=\"flex items-center gap-2 cursor-pointer w-fit\">\n <input\n type=\"checkbox\"\n className=\"toggle toggle-sm toggle-primary\"\n checked={active}\n onChange={(e) => setActive(e.target.checked)}\n />\n <span className=\"text-sm font-medium\">{t.pivotMode}</span>\n </label>\n {/* 顶部(水平)面板放在工具栏内。 */}\n {active && panelPlacement === 'top' && panel('horizontal')}\n </div>\n );\n },\n renderContent: (api) => {\n if (!active) return undefined;\n const content = (\n <PivotView<T>\n data={api.data}\n rowFields={rowFields}\n colFields={colFields}\n values={values}\n fieldLabels={fieldLabels}\n lang={lang}\n treeView={treeView}\n />\n );\n // 顶部面板已在工具栏内渲染,这里只渲染表格主体。\n if (panelPlacement === 'top') return content;\n // 底部面板:水平排布在透视表格下方。\n if (panelPlacement === 'bottom') {\n return (\n <div className=\"flex flex-col gap-3\">\n <div className=\"flex-1 min-w-0\">{content}</div>\n {panel('horizontal')}\n </div>\n );\n }\n // 左/右侧纵向面板:与透视表格并排,默认与表格同高。\n return (\n <div className=\"flex gap-3 items-stretch\">\n {panelPlacement === 'left' && panel('vertical')}\n <div className=\"flex-1 min-w-0\">{content}</div>\n {panelPlacement === 'right' && panel('vertical')}\n </div>\n );\n },\n };\n }, [\n active,\n rowFields,\n colFields,\n values,\n fieldLabels,\n dimensionFields,\n numericFields,\n treeView,\n lang,\n panelPlacement,\n panelWidth,\n hideModeToggle,\n t,\n ]);\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rowDetailExtension.js","names":[],"sources":["../../../../src/components/pro/DataTable/rowDetailExtension.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport type { DataTableExtension, DataTableRowContext } from './extension';\n\nexport interface RowDetailOptions<T extends object> {\n /** 渲染展开后的行详情面板。 */\n render: (ctx: DataTableRowContext<T>) => React.ReactNode;\n}\n\n/**\n * 行详情(master/detail)扩展。\n *\n * 由于扩展是普通对象无法持有 React 状态,这里以 hook 工厂的形式返回一个绑定了\n * 展开状态的扩展。为每一行的第一列注入一个展开按钮(通过 `cell` 覆写),点击后\n * 在该行下方渲染一个详情面板(通过 `wrapRow`)。\n *\n * 使用方式:\n * ```tsx\n * const detail = useRowDetailExtension<Row>({\n * render: ({ row }) => <pre>{JSON.stringify(row, null, 2)}</pre>,\n * });\n * <DataTable data={data} columns={columns} extensions={[detail]} />\n * ```\n */\nexport function useRowDetailExtension<T extends object>({\n render,\n}: RowDetailOptions<T>): DataTableExtension<T> {\n const [open, setOpen] = useState<Record<string, boolean>>({});\n\n return useMemo<DataTableExtension<T>>(\n () => ({\n name: 'row-detail',\n wrapRow: (children, ctx) => {\n if (!open[ctx.rowId]) return children;\n return (\n <>\n {children}\n <tr className=\"table-row\">\n <td className=\"table-cell p-0\" colSpan={9999}>\n <div className=\"bg-base-200/60 p-4 border-l-4 border-primary\">\n {render(ctx)}\n </div>\n </td>\n </tr>\n </>\n );\n },\n rowProps: (ctx) =>\n ({\n 'data-detail-open': open[ctx.rowId] ? 'true' : undefined,\n }) as React.HTMLAttributes<HTMLTableRowElement>,\n // 通过右键菜单切换详情面板,避免占用列布局。\n contextMenu: (ctx) => [\n {\n key: 'toggle-detail',\n label: open[ctx.rowId] ? '收起详情' : '展开详情',\n onSelect: () =>\n setOpen((s) => ({ ...s, [ctx.rowId]: !s[ctx.rowId] })),\n },\n ],\n }),\n [open, render],\n );\n}\n"],"mappings":";;AAuBA,SAAgB,EAAwC,EACpD,QAAA,EAAA,GAC2C;AAC3C,QAAM,CAAC,GAAM,CAAA,IAAW,EAAkC,CAAC,CAAC;AAE5D,SAAO,EAAA,OACI;AAAA,IACH,MAAM;AAAA,IACN,SAAA,CAAU,GAAU,MACX,EAAK,EAAI,KAAA,IAEV,gBAAA,EAAA,GAAA,EAAA,UAAA,CACK,GACD,gBAAA,EAAC,MAAD;AAAA,MAAI,WAAU;AAAA,
|
|
1
|
+
{"version":3,"file":"rowDetailExtension.js","names":[],"sources":["../../../../src/components/pro/DataTable/rowDetailExtension.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport type { DataTableExtension, DataTableRowContext } from './extension';\n\nexport interface RowDetailOptions<T extends object> {\n /** 渲染展开后的行详情面板。 */\n render: (ctx: DataTableRowContext<T>) => React.ReactNode;\n}\n\n/**\n * 行详情(master/detail)扩展。\n *\n * 由于扩展是普通对象无法持有 React 状态,这里以 hook 工厂的形式返回一个绑定了\n * 展开状态的扩展。为每一行的第一列注入一个展开按钮(通过 `cell` 覆写),点击后\n * 在该行下方渲染一个详情面板(通过 `wrapRow`)。\n *\n * 使用方式:\n * ```tsx\n * const detail = useRowDetailExtension<Row>({\n * render: ({ row }) => <pre>{JSON.stringify(row, null, 2)}</pre>,\n * });\n * <DataTable data={data} columns={columns} extensions={[detail]} />\n * ```\n */\nexport function useRowDetailExtension<T extends object>({\n render,\n}: RowDetailOptions<T>): DataTableExtension<T> {\n const [open, setOpen] = useState<Record<string, boolean>>({});\n\n return useMemo<DataTableExtension<T>>(\n () => ({\n name: 'row-detail',\n wrapRow: (children, ctx) => {\n if (!open[ctx.rowId]) return children;\n return (\n <>\n {children}\n <tr className=\"table-row\">\n <td className=\"table-cell p-0\" colSpan={9999}>\n <div className=\"bg-base-200/60 p-4 border-l-4 border-primary\">\n {render(ctx)}\n </div>\n </td>\n </tr>\n </>\n );\n },\n rowProps: (ctx) =>\n ({\n 'data-detail-open': open[ctx.rowId] ? 'true' : undefined,\n }) as React.HTMLAttributes<HTMLTableRowElement>,\n // 通过右键菜单切换详情面板,避免占用列布局。\n contextMenu: (ctx) => [\n {\n key: 'toggle-detail',\n label: open[ctx.rowId] ? '收起详情' : '展开详情',\n onSelect: () =>\n setOpen((s) => ({ ...s, [ctx.rowId]: !s[ctx.rowId] })),\n },\n ],\n }),\n [open, render],\n );\n}\n"],"mappings":";;AAuBA,SAAgB,EAAwC,EACpD,QAAA,EAAA,GAC2C;AAC3C,QAAM,CAAC,GAAM,CAAA,IAAW,EAAkC,CAAC,CAAC;AAE5D,SAAO,EAAA,OACI;AAAA,IACH,MAAM;AAAA,IACN,SAAA,CAAU,GAAU,MACX,EAAK,EAAI,KAAA,IAEV,gBAAA,EAAA,GAAA,EAAA,UAAA,CACK,GACD,gBAAA,EAAC,MAAD;AAAA,MAAI,WAAU;AAAA,MACV,UAAA,gBAAA,EAAC,MAAD;AAAA,QAAI,WAAU;AAAA,QAAiB,SAAS;AAAA,QACpC,UAAA,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,UACV,UAAA,EAAO,CAAG;AAAA,QACV,CAAA;AAAA,MACL,CAAA;AAAA,IACJ,CAAA,CACN,EAAA,CAAA,IAXuB;AAAA,IAcjC,UAAA,CAAW,OACN,EACG,oBAAoB,EAAK,EAAI,KAAA,IAAS,SAAS,OACnD;AAAA,IAEJ,aAAA,CAAc,MAAQ,CAClB;AAAA,MACI,KAAK;AAAA,MACL,OAAO,EAAK,EAAI,KAAA,IAAS,SAAS;AAAA,MAClC,UAAA,MACI,EAAA,CAAS,OAAO;AAAA,QAAE,GAAG;AAAA,QAAI,CAAA,EAAI,KAAA,GAAQ,CAAC,EAAE,EAAI,KAAA;AAAA,MAAO,EAAE;AAAA,IAC7D,CACJ;AAAA,EACJ,IACA,CAAC,GAAM,CAAM,CACjB;AACJ"}
|
|
@@ -1,44 +1,44 @@
|
|
|
1
|
-
import { useMemo as
|
|
2
|
-
import { columnFilteringFeature as t, columnOrderingFeature as a, columnVisibilityFeature as d, coreFeatures as l, createCoreRowModel as
|
|
3
|
-
var
|
|
1
|
+
import { useMemo as x } from "react";
|
|
2
|
+
import { columnFilteringFeature as t, columnOrderingFeature as a, columnVisibilityFeature as d, coreFeatures as l, createCoreRowModel as n, createExpandedRowModel as i, createFilteredRowModel as u, createPaginatedRowModel as s, createSortedRowModel as w, flexRender as h, globalFilteringFeature as F, rowExpandingFeature as c, rowPaginationFeature as R, rowSelectionFeature as M, rowSortingFeature as f, tableFeatures as g, useTable as S } from "@tanstack/react-table";
|
|
3
|
+
var T = g({
|
|
4
4
|
...l,
|
|
5
5
|
columnFilteringFeature: t,
|
|
6
6
|
columnOrderingFeature: a,
|
|
7
7
|
columnVisibilityFeature: d,
|
|
8
8
|
globalFilteringFeature: F,
|
|
9
9
|
rowSortingFeature: f,
|
|
10
|
-
rowPaginationFeature:
|
|
10
|
+
rowPaginationFeature: R,
|
|
11
11
|
rowSelectionFeature: M,
|
|
12
|
-
rowExpandingFeature:
|
|
13
|
-
coreRowModel:
|
|
12
|
+
rowExpandingFeature: c,
|
|
13
|
+
coreRowModel: n(),
|
|
14
14
|
filteredRowModel: u(),
|
|
15
15
|
sortedRowModel: w(),
|
|
16
16
|
paginatedRowModel: s(),
|
|
17
|
-
expandedRowModel:
|
|
17
|
+
expandedRowModel: i()
|
|
18
18
|
});
|
|
19
|
-
function
|
|
20
|
-
const { sortFns: e, filterFns: o, ...p } = m
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
19
|
+
function v(m) {
|
|
20
|
+
const { sortFns: e, filterFns: o, ...p } = m, b = x(() => {
|
|
21
|
+
if (!e && !o) return T;
|
|
22
|
+
const r = {
|
|
23
|
+
...l,
|
|
24
|
+
columnFilteringFeature: t,
|
|
25
|
+
columnOrderingFeature: a,
|
|
26
|
+
columnVisibilityFeature: d,
|
|
27
|
+
globalFilteringFeature: F,
|
|
28
|
+
rowSortingFeature: f,
|
|
29
|
+
rowPaginationFeature: R,
|
|
30
|
+
rowSelectionFeature: M,
|
|
31
|
+
rowExpandingFeature: c,
|
|
32
|
+
coreRowModel: n(),
|
|
33
|
+
filteredRowModel: u(),
|
|
34
|
+
sortedRowModel: w(),
|
|
35
|
+
paginatedRowModel: s(),
|
|
36
|
+
expandedRowModel: i()
|
|
37
|
+
};
|
|
38
|
+
return e && (r.sortFns = e), o && (r.filterFns = o), g(r);
|
|
39
|
+
}, [e, o]);
|
|
40
|
+
return S({
|
|
41
|
+
features: b,
|
|
42
42
|
...p
|
|
43
43
|
});
|
|
44
44
|
}
|
|
@@ -47,20 +47,20 @@ export {
|
|
|
47
47
|
a as columnOrderingFeature,
|
|
48
48
|
d as columnVisibilityFeature,
|
|
49
49
|
l as coreFeatures,
|
|
50
|
-
|
|
51
|
-
|
|
50
|
+
n as createCoreRowModel,
|
|
51
|
+
i as createExpandedRowModel,
|
|
52
52
|
u as createFilteredRowModel,
|
|
53
53
|
s as createPaginatedRowModel,
|
|
54
54
|
w as createSortedRowModel,
|
|
55
|
-
|
|
55
|
+
h as flexRender,
|
|
56
56
|
F as globalFilteringFeature,
|
|
57
|
-
|
|
58
|
-
|
|
57
|
+
c as rowExpandingFeature,
|
|
58
|
+
R as rowPaginationFeature,
|
|
59
59
|
M as rowSelectionFeature,
|
|
60
60
|
f as rowSortingFeature,
|
|
61
61
|
g as tableFeatures,
|
|
62
|
-
|
|
63
|
-
|
|
62
|
+
v as useReactTable,
|
|
63
|
+
S as useTable
|
|
64
64
|
};
|
|
65
65
|
|
|
66
66
|
//# sourceMappingURL=tanstack-table.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tanstack-table.js","names":[],"sources":["../../../../src/components/pro/DataTable/tanstack-table.ts"],"sourcesContent":["/**\n * TanStack Table v9 适配层(全面使用 v9 原生 API)。\n *\n * DishUI 的 DataTable 现已全面迁移到 TanStack Table v9 的原生 API:\n * - `useTable` + `tableFeatures({...})` 显式注册特性与 row model 工厂;\n * - row model 通过 `createCoreRowModel()` / `createSortedRowModel()` 等工厂注册;\n * - 使用 `table.state`(而非 v8 的 `table.getState()`)读取状态;\n * - 列定义的自定义排序使用 `sortFn`(v8 为 `sortingFn`)。\n *\n * 本模块把 v9 的多泛型类型(`<TFeatures, TData, TValue>`)用 `StockFeatures`\n * 预绑定成单泛型别名(`ColumnDef<T>`、`Row<T>`、`Table<T>` 等),让上层代码\n * 保持简洁;同时保留一个 v8 命名习惯的 `useReactTable` 包装器,内部把\n * 「row model 工厂」组装进 v9 的 `features`,从而对调用方屏蔽 v9 的 `features`\n * 组装细节。请始终从本模块导入表格相关类型与工具,而不要直接依赖\n * `@tanstack/react-table`。\n */\nimport {\n useTable,\n flexRender,\n tableFeatures,\n type ReactTable,\n // 核心特性\n coreFeatures,\n // 各功能特性\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n // row model 工厂\n createCoreRowModel,\n createFilteredRowModel,\n createSortedRowModel,\n createPaginatedRowModel,\n createExpandedRowModel,\n} from '@tanstack/react-table';\nimport type {\n RowData,\n OnChangeFn,\n Updater,\n CellContext as CoreCellContext,\n HeaderContext as CoreHeaderContext,\n // 状态类型\n SortingState,\n ColumnFiltersState,\n RowSelectionState,\n PaginationState,\n ColumnOrderState,\n ExpandedState,\n ColumnVisibilityState,\n // 多泛型类型(用 StockFeatures 预绑定为单泛型别名)\n StockFeatures,\n Column as CoreColumn,\n ColumnDef as CoreColumnDef,\n Row as CoreRow,\n Cell as CoreCell,\n Header as CoreHeader,\n HeaderGroup as CoreHeaderGroup,\n SortFnOption,\n SortFn as CoreSortFn,\n FilterFn as CoreFilterFn,\n ColumnMeta as CoreColumnMeta,\n TableOptions,\n} from '@tanstack/react-table';\nimport { useMemo } from 'react';\n\nexport { flexRender, useTable, tableFeatures };\n\n/**\n * 一个包含全部常用特性 + row model 工厂的默认 features 预设。\n * `useReactTable` 会用它作为默认 `features`,因此调用方无需手动组装。\n * (内部常量:其推断类型引用了 table-core 的内部路径,不对外导出以避免\n * 声明文件的可移植性问题;对外通过 `DishUITableFeatures` 类型别名暴露。)\n */\nconst dishuiTableFeatures = tableFeatures({\n ...coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n coreRowModel: createCoreRowModel(),\n filteredRowModel: createFilteredRowModel(),\n sortedRowModel: createSortedRowModel(),\n paginatedRowModel: createPaginatedRowModel(),\n expandedRowModel: createExpandedRowModel(),\n});\n\nexport type DishUITableFeatures = StockFeatures;\n\n// v9 原生 row model 工厂再导出(供需要精细控制 features 的调用方使用)。\nexport {\n coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n createCoreRowModel,\n createFilteredRowModel,\n createSortedRowModel,\n createPaginatedRowModel,\n createExpandedRowModel,\n};\n\n// 单泛型(StockFeatures 预绑定)类型别名,保持上层简洁。\n// `Table` 映射到 `useTable` 返回的 ReactTable(具备 `.state` / `.FlexRender`)。\nexport type Table<TData extends RowData> = ReactTable<DishUITableFeatures, TData>;\nexport type Column<TData extends RowData, TValue = unknown> = CoreColumn<DishUITableFeatures, TData, TValue>;\nexport type ColumnDef<TData extends RowData, TValue = unknown> = CoreColumnDef<DishUITableFeatures, TData, TValue>;\nexport type Row<TData extends RowData> = CoreRow<DishUITableFeatures, TData>;\nexport type Cell<TData extends RowData, TValue = unknown> = CoreCell<DishUITableFeatures, TData, TValue>;\nexport type Header<TData extends RowData, TValue = unknown> = CoreHeader<DishUITableFeatures, TData, TValue>;\nexport type HeaderGroup<TData extends RowData> = CoreHeaderGroup<DishUITableFeatures, TData>;\nexport type CellContext<TData extends RowData, TValue = unknown> = CoreCellContext<DishUITableFeatures, TData, TValue>;\nexport type HeaderContext<TData extends RowData, TValue = unknown> = CoreHeaderContext<DishUITableFeatures, TData, TValue>;\n\n// 状态类型(沿用 v8 惯用命名)。\nexport type {\n SortingState,\n ColumnFiltersState,\n RowSelectionState,\n PaginationState,\n ColumnOrderState,\n ExpandedState,\n OnChangeFn,\n Updater,\n RowData,\n};\n\n/** v8 `VisibilityState` -> v9 `ColumnVisibilityState`。 */\nexport type VisibilityState = ColumnVisibilityState;\n\n/** 列的自定义排序函数(v9:`sortFn`)。 */\nexport type SortingFnOption<TData extends RowData> = SortFnOption<DishUITableFeatures, TData>;\nexport type SortingFn<TData extends RowData> = CoreSortFn<DishUITableFeatures, TData>;\nexport type FilterFn<TData extends RowData> = CoreFilterFn<DishUITableFeatures, TData>;\nexport type ColumnMeta<TData extends RowData, TValue = unknown> = CoreColumnMeta<DishUITableFeatures, TData, TValue>;\n\n/**\n * v8 命名习惯的表格 hook 包装器。\n *\n * 接收「已经组装好的」表格选项(不含 `features`),自动注入 DishUI 的默认\n * `features` 预设(含 core + 全部常用特性 + row model 工厂),返回 v9 原生\n * 的 `useTable` 实例。若需自定义排序/筛选函数注册表,可通过 `sortFns` /\n * `filterFns` 传入(会并入 features)。\n */\nexport function useReactTable<TData extends RowData>(\n options: Omit<TableOptions<DishUITableFeatures, TData>, 'features'> & {\n /** 自定义排序函数注册表(v9:合入 features 的 sortFns)。 */\n sortFns?: Record<string, SortingFn<TData>>;\n /** 自定义筛选函数注册表(v9:合入 features 的 filterFns)。 */\n filterFns?: Record<string, FilterFn<TData>>;\n },\n): Table<TData> {\n const { sortFns, filterFns, ...rest } = options;\n\n const features = useMemo(() => {\n if (!sortFns && !filterFns) return dishuiTableFeatures;\n const merged: Record<string, unknown> = {\n ...coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n coreRowModel: createCoreRowModel(),\n filteredRowModel: createFilteredRowModel(),\n sortedRowModel: createSortedRowModel(),\n paginatedRowModel: createPaginatedRowModel(),\n expandedRowModel: createExpandedRowModel(),\n };\n if (sortFns) merged.sortFns = sortFns;\n if (filterFns) merged.filterFns = filterFns;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return tableFeatures(merged as any);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [sortFns, filterFns]);\n\n return useTable<DishUITableFeatures, TData>({\n features,\n ...rest,\n } as TableOptions<DishUITableFeatures, TData>) as unknown as Table<TData>;\n}\n"],"mappings":";;AA6EA,IAAM,IAAsB,EAAc;AAAA,EACxC,GAAG;AAAA,EACH,wBAAA;AAAA,EACA,uBAAA;AAAA,EACA,yBAAA;AAAA,EACA,wBAAA;AAAA,EACA,mBAAA;AAAA,EACA,sBAAA;AAAA,EACA,qBAAA;AAAA,EACA,qBAAA;AAAA,EACA,cAAc,EAAmB;AAAA,EACjC,kBAAkB,EAAuB;AAAA,EACzC,gBAAgB,EAAqB;AAAA,EACrC,mBAAmB,EAAwB;AAAA,EAC3C,kBAAkB,EAAuB;AAC3C,CAAC;AAgED,SAAgB,EACd,GAMc;AACd,QAAM,EAAE,SAAA,GAAS,WAAA,GAAW,GAAG,EAAA,IAAS
|
|
1
|
+
{"version":3,"file":"tanstack-table.js","names":[],"sources":["../../../../src/components/pro/DataTable/tanstack-table.ts"],"sourcesContent":["/**\n * TanStack Table v9 适配层(全面使用 v9 原生 API)。\n *\n * DishUI 的 DataTable 现已全面迁移到 TanStack Table v9 的原生 API:\n * - `useTable` + `tableFeatures({...})` 显式注册特性与 row model 工厂;\n * - row model 通过 `createCoreRowModel()` / `createSortedRowModel()` 等工厂注册;\n * - 使用 `table.state`(而非 v8 的 `table.getState()`)读取状态;\n * - 列定义的自定义排序使用 `sortFn`(v8 为 `sortingFn`)。\n *\n * 本模块把 v9 的多泛型类型(`<TFeatures, TData, TValue>`)用 `StockFeatures`\n * 预绑定成单泛型别名(`ColumnDef<T>`、`Row<T>`、`Table<T>` 等),让上层代码\n * 保持简洁;同时保留一个 v8 命名习惯的 `useReactTable` 包装器,内部把\n * 「row model 工厂」组装进 v9 的 `features`,从而对调用方屏蔽 v9 的 `features`\n * 组装细节。请始终从本模块导入表格相关类型与工具,而不要直接依赖\n * `@tanstack/react-table`。\n */\nimport {\n useTable,\n flexRender,\n tableFeatures,\n type ReactTable,\n // 核心特性\n coreFeatures,\n // 各功能特性\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n // row model 工厂\n createCoreRowModel,\n createFilteredRowModel,\n createSortedRowModel,\n createPaginatedRowModel,\n createExpandedRowModel,\n} from '@tanstack/react-table';\nimport type {\n RowData,\n OnChangeFn,\n Updater,\n CellContext as CoreCellContext,\n HeaderContext as CoreHeaderContext,\n // 状态类型\n SortingState,\n ColumnFiltersState,\n RowSelectionState,\n PaginationState,\n ColumnOrderState,\n ExpandedState,\n ColumnVisibilityState,\n // 多泛型类型(用 StockFeatures 预绑定为单泛型别名)\n StockFeatures,\n Column as CoreColumn,\n ColumnDef as CoreColumnDef,\n Row as CoreRow,\n Cell as CoreCell,\n Header as CoreHeader,\n HeaderGroup as CoreHeaderGroup,\n SortFnOption,\n SortFn as CoreSortFn,\n FilterFn as CoreFilterFn,\n ColumnMeta as CoreColumnMeta,\n TableOptions,\n} from '@tanstack/react-table';\nimport { useMemo } from 'react';\n\nexport { flexRender, useTable, tableFeatures };\n\n/**\n * 一个包含全部常用特性 + row model 工厂的默认 features 预设。\n * `useReactTable` 会用它作为默认 `features`,因此调用方无需手动组装。\n * (内部常量:其推断类型引用了 table-core 的内部路径,不对外导出以避免\n * 声明文件的可移植性问题;对外通过 `DishUITableFeatures` 类型别名暴露。)\n */\nconst dishuiTableFeatures = tableFeatures({\n ...coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n coreRowModel: createCoreRowModel(),\n filteredRowModel: createFilteredRowModel(),\n sortedRowModel: createSortedRowModel(),\n paginatedRowModel: createPaginatedRowModel(),\n expandedRowModel: createExpandedRowModel(),\n});\n\nexport type DishUITableFeatures = StockFeatures;\n\n// v9 原生 row model 工厂再导出(供需要精细控制 features 的调用方使用)。\nexport {\n coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n createCoreRowModel,\n createFilteredRowModel,\n createSortedRowModel,\n createPaginatedRowModel,\n createExpandedRowModel,\n};\n\n// 单泛型(StockFeatures 预绑定)类型别名,保持上层简洁。\n// `Table` 映射到 `useTable` 返回的 ReactTable(具备 `.state` / `.FlexRender`)。\nexport type Table<TData extends RowData> = ReactTable<DishUITableFeatures, TData>;\nexport type Column<TData extends RowData, TValue = unknown> = CoreColumn<DishUITableFeatures, TData, TValue>;\nexport type ColumnDef<TData extends RowData, TValue = unknown> = CoreColumnDef<DishUITableFeatures, TData, TValue>;\nexport type Row<TData extends RowData> = CoreRow<DishUITableFeatures, TData>;\nexport type Cell<TData extends RowData, TValue = unknown> = CoreCell<DishUITableFeatures, TData, TValue>;\nexport type Header<TData extends RowData, TValue = unknown> = CoreHeader<DishUITableFeatures, TData, TValue>;\nexport type HeaderGroup<TData extends RowData> = CoreHeaderGroup<DishUITableFeatures, TData>;\nexport type CellContext<TData extends RowData, TValue = unknown> = CoreCellContext<DishUITableFeatures, TData, TValue>;\nexport type HeaderContext<TData extends RowData, TValue = unknown> = CoreHeaderContext<DishUITableFeatures, TData, TValue>;\n\n// 状态类型(沿用 v8 惯用命名)。\nexport type {\n SortingState,\n ColumnFiltersState,\n RowSelectionState,\n PaginationState,\n ColumnOrderState,\n ExpandedState,\n OnChangeFn,\n Updater,\n RowData,\n};\n\n/** v8 `VisibilityState` -> v9 `ColumnVisibilityState`。 */\nexport type VisibilityState = ColumnVisibilityState;\n\n/** 列的自定义排序函数(v9:`sortFn`)。 */\nexport type SortingFnOption<TData extends RowData> = SortFnOption<DishUITableFeatures, TData>;\nexport type SortingFn<TData extends RowData> = CoreSortFn<DishUITableFeatures, TData>;\nexport type FilterFn<TData extends RowData> = CoreFilterFn<DishUITableFeatures, TData>;\nexport type ColumnMeta<TData extends RowData, TValue = unknown> = CoreColumnMeta<DishUITableFeatures, TData, TValue>;\n\n/**\n * v8 命名习惯的表格 hook 包装器。\n *\n * 接收「已经组装好的」表格选项(不含 `features`),自动注入 DishUI 的默认\n * `features` 预设(含 core + 全部常用特性 + row model 工厂),返回 v9 原生\n * 的 `useTable` 实例。若需自定义排序/筛选函数注册表,可通过 `sortFns` /\n * `filterFns` 传入(会并入 features)。\n */\nexport function useReactTable<TData extends RowData>(\n options: Omit<TableOptions<DishUITableFeatures, TData>, 'features'> & {\n /** 自定义排序函数注册表(v9:合入 features 的 sortFns)。 */\n sortFns?: Record<string, SortingFn<TData>>;\n /** 自定义筛选函数注册表(v9:合入 features 的 filterFns)。 */\n filterFns?: Record<string, FilterFn<TData>>;\n },\n): Table<TData> {\n const { sortFns, filterFns, ...rest } = options;\n\n const features = useMemo(() => {\n if (!sortFns && !filterFns) return dishuiTableFeatures;\n const merged: Record<string, unknown> = {\n ...coreFeatures,\n columnFilteringFeature,\n columnOrderingFeature,\n columnVisibilityFeature,\n globalFilteringFeature,\n rowSortingFeature,\n rowPaginationFeature,\n rowSelectionFeature,\n rowExpandingFeature,\n coreRowModel: createCoreRowModel(),\n filteredRowModel: createFilteredRowModel(),\n sortedRowModel: createSortedRowModel(),\n paginatedRowModel: createPaginatedRowModel(),\n expandedRowModel: createExpandedRowModel(),\n };\n if (sortFns) merged.sortFns = sortFns;\n if (filterFns) merged.filterFns = filterFns;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return tableFeatures(merged as any);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [sortFns, filterFns]);\n\n return useTable<DishUITableFeatures, TData>({\n features,\n ...rest,\n } as TableOptions<DishUITableFeatures, TData>) as unknown as Table<TData>;\n}\n"],"mappings":";;AA6EA,IAAM,IAAsB,EAAc;AAAA,EACxC,GAAG;AAAA,EACH,wBAAA;AAAA,EACA,uBAAA;AAAA,EACA,yBAAA;AAAA,EACA,wBAAA;AAAA,EACA,mBAAA;AAAA,EACA,sBAAA;AAAA,EACA,qBAAA;AAAA,EACA,qBAAA;AAAA,EACA,cAAc,EAAmB;AAAA,EACjC,kBAAkB,EAAuB;AAAA,EACzC,gBAAgB,EAAqB;AAAA,EACrC,mBAAmB,EAAwB;AAAA,EAC3C,kBAAkB,EAAuB;AAC3C,CAAC;AAgED,SAAgB,EACd,GAMc;AACd,QAAM,EAAE,SAAA,GAAS,WAAA,GAAW,GAAG,EAAA,IAAS,GAElC,IAAW,EAAA,MAAc;AAC7B,QAAI,CAAC,KAAW,CAAC,EAAW,QAAO;AACnC,UAAM,IAAkC;AAAA,MACtC,GAAG;AAAA,MACH,wBAAA;AAAA,MACA,uBAAA;AAAA,MACA,yBAAA;AAAA,MACA,wBAAA;AAAA,MACA,mBAAA;AAAA,MACA,sBAAA;AAAA,MACA,qBAAA;AAAA,MACA,qBAAA;AAAA,MACA,cAAc,EAAmB;AAAA,MACjC,kBAAkB,EAAuB;AAAA,MACzC,gBAAgB,EAAqB;AAAA,MACrC,mBAAmB,EAAwB;AAAA,MAC3C,kBAAkB,EAAuB;AAAA,IAC3C;AACA,WAAI,MAAS,EAAO,UAAU,IAC1B,MAAW,EAAO,YAAY,IAE3B,EAAc,CAAa;AAAA,EAEpC,GAAG,CAAC,GAAS,CAAS,CAAC;AAEvB,SAAO,EAAqC;AAAA,IAC1C,UAAA;AAAA,IACA,GAAG;AAAA,EACL,CAA6C;AAC/C"}
|