resizable-pro-table 1.1.3 → 1.1.5
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/index.js +12 -7
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +12 -7
- package/dist/index.mjs.map +1 -1
- package/dist/style.css +3 -6
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -50,7 +50,7 @@ function styleInject(css, { insertAt } = {}) {
|
|
|
50
50
|
}
|
|
51
51
|
|
|
52
52
|
// src/style.css
|
|
53
|
-
styleInject('.ant-table-thead > tr > th {\n position: relative;\n overflow: visible !important;\n}\n.ant-table-wrapper .ant-table-thead,\n.ant-table .ant-table-thead {\n overflow: visible !important;\n}\n.resizable-handle {\n position: absolute;\n right: -6px;\n top: 0;\n bottom: 0;\n width: 12px;\n cursor: col-resize;\n z-index:
|
|
53
|
+
styleInject('.ant-table-thead > tr > th:not(.ant-table-cell-fix) {\n position: relative;\n}\n.ant-table-thead > tr > th {\n overflow: visible !important;\n}\n.ant-table-wrapper .ant-table-thead,\n.ant-table .ant-table-thead {\n overflow: visible !important;\n}\n.resizable-handle {\n position: absolute;\n right: -6px;\n top: 0;\n bottom: 0;\n width: 12px;\n cursor: col-resize;\n z-index: 1;\n pointer-events: auto;\n}\n.resizable-handle::after {\n content: "";\n position: absolute;\n left: 5px;\n top: 15%;\n height: 70%;\n width: 2px;\n background: rgba(0, 0, 0, 0.08);\n transition: background 0.2s;\n}\n.resizable-handle:hover::after {\n background: #1677ff;\n}\n.resizable-handle--active::after {\n background: #1677ff;\n}\n');
|
|
54
54
|
|
|
55
55
|
// src/ResizableProTable.tsx
|
|
56
56
|
var import_pro_components = require("@ant-design/pro-components");
|
|
@@ -139,12 +139,15 @@ var ResizableTitle = ({
|
|
|
139
139
|
if (!width || !onResizeEnd) {
|
|
140
140
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { ...restProps, children });
|
|
141
141
|
}
|
|
142
|
+
const isFixedCell = String(restProps.className ?? "").includes("ant-table-cell-fix");
|
|
143
|
+
const relativeStyle = { position: "relative", ...restProps.style };
|
|
144
|
+
const mergedStyle = isFixedCell ? restProps.style : relativeStyle;
|
|
142
145
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
143
146
|
"th",
|
|
144
147
|
{
|
|
145
148
|
ref: thRef,
|
|
146
149
|
...restProps,
|
|
147
|
-
style:
|
|
150
|
+
style: mergedStyle,
|
|
148
151
|
children: [
|
|
149
152
|
children,
|
|
150
153
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -159,7 +162,7 @@ var ResizableTitle = ({
|
|
|
159
162
|
bottom: 0,
|
|
160
163
|
width: 12,
|
|
161
164
|
cursor: "col-resize",
|
|
162
|
-
zIndex:
|
|
165
|
+
zIndex: 1
|
|
163
166
|
},
|
|
164
167
|
onMouseDown: handleMouseDown,
|
|
165
168
|
onClick: (e) => e.stopPropagation()
|
|
@@ -247,7 +250,7 @@ var useResizableColumns_default = useResizableColumns;
|
|
|
247
250
|
// src/ResizableProTable.tsx
|
|
248
251
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
249
252
|
function ResizableProTable(props) {
|
|
250
|
-
const { columns = [], resizableConfig, ...rest } = props;
|
|
253
|
+
const { columns = [], resizableConfig, tableLayout, ...rest } = props;
|
|
251
254
|
const { mergedColumns, components } = useResizableColumns_default(
|
|
252
255
|
columns,
|
|
253
256
|
resizableConfig
|
|
@@ -257,7 +260,8 @@ function ResizableProTable(props) {
|
|
|
257
260
|
{
|
|
258
261
|
...rest,
|
|
259
262
|
columns: mergedColumns,
|
|
260
|
-
components
|
|
263
|
+
components,
|
|
264
|
+
tableLayout: tableLayout ?? "fixed"
|
|
261
265
|
}
|
|
262
266
|
);
|
|
263
267
|
}
|
|
@@ -267,7 +271,7 @@ var ResizableProTable_default = ResizableProTable;
|
|
|
267
271
|
var import_antd = require("antd");
|
|
268
272
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
269
273
|
function ResizableTable(props) {
|
|
270
|
-
const { columns = [], resizableConfig, ...rest } = props;
|
|
274
|
+
const { columns = [], resizableConfig, tableLayout, ...rest } = props;
|
|
271
275
|
const { mergedColumns, components } = useResizableColumns_default(
|
|
272
276
|
columns,
|
|
273
277
|
resizableConfig
|
|
@@ -277,7 +281,8 @@ function ResizableTable(props) {
|
|
|
277
281
|
{
|
|
278
282
|
...rest,
|
|
279
283
|
columns: mergedColumns,
|
|
280
|
-
components
|
|
284
|
+
components,
|
|
285
|
+
tableLayout: tableLayout ?? "fixed"
|
|
281
286
|
}
|
|
282
287
|
);
|
|
283
288
|
}
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","#style-inject:#style-inject","../src/style.css","../src/ResizableProTable.tsx","../src/useResizableColumns.ts","../src/ResizableTitle.tsx","../src/ResizableTable.tsx"],"sourcesContent":["import './style.css';\n\nexport { default } from './ResizableProTable';\nexport { default as ResizableProTable } from './ResizableProTable';\nexport type { ResizableProTableProps } from './ResizableProTable';\n\nexport { default as ResizableTable } from './ResizableTable';\nexport type { ResizableTableProps } from './ResizableTable';\n\nexport { default as useResizableColumns } from './useResizableColumns';\nexport type { ResizableConfig, ColumnWidthMap, ResizableTitleProps } from './types';\n","\n export default function styleInject(css, { insertAt } = {}) {\n if (!css || typeof document === 'undefined') return\n \n const head = document.head || document.getElementsByTagName('head')[0]\n const style = document.createElement('style')\n style.type = 'text/css'\n \n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild)\n } else {\n head.appendChild(style)\n }\n } else {\n head.appendChild(style)\n }\n \n if (style.styleSheet) {\n style.styleSheet.cssText = css\n } else {\n style.appendChild(document.createTextNode(css))\n }\n }\n ","import styleInject from '#style-inject';styleInject(\".ant-table-thead > tr > th {\\n position: relative;\\n overflow: visible !important;\\n}\\n.ant-table-wrapper .ant-table-thead,\\n.ant-table .ant-table-thead {\\n overflow: visible !important;\\n}\\n.resizable-handle {\\n position: absolute;\\n right: -6px;\\n top: 0;\\n bottom: 0;\\n width: 12px;\\n cursor: col-resize;\\n z-index: 10;\\n pointer-events: auto;\\n}\\n.resizable-handle::after {\\n content: \\\"\\\";\\n position: absolute;\\n left: 5px;\\n top: 15%;\\n height: 70%;\\n width: 2px;\\n background: rgba(0, 0, 0, 0.08);\\n transition: background 0.2s;\\n}\\n.resizable-handle:hover::after {\\n background: #1677ff;\\n}\\n.resizable-handle--active::after {\\n background: #1677ff;\\n}\\n\")","import { ProTable } from '@ant-design/pro-components';\nimport type { ProTableProps, ProColumns } from '@ant-design/pro-components';\nimport useResizableColumns from './useResizableColumns';\nimport type { ResizableConfig } from './types';\n\nexport interface ResizableProTableProps<T extends Record<string, any>>\n extends Omit<ProTableProps<T, any>, 'components'> {\n resizableConfig?: ResizableConfig;\n}\n\nfunction ResizableProTable<T extends Record<string, any>>(\n props: ResizableProTableProps<T>,\n) {\n const { columns = [], resizableConfig, ...rest } = props;\n\n const { mergedColumns, components } = useResizableColumns<T>(\n columns as ProColumns<T>[],\n resizableConfig,\n );\n\n return (\n <ProTable<T>\n {...rest}\n columns={mergedColumns}\n components={components}\n />\n );\n}\n\nexport default ResizableProTable;\n","import { useMemo, useState } from 'react';\nimport type { ColumnType } from 'antd/es/table';\nimport type { ProColumns } from '@ant-design/pro-components';\nimport ResizableTitle from './ResizableTitle';\nimport type { ColumnWidthMap, ResizableConfig } from './types';\n\ntype Components = { header: { cell: typeof ResizableTitle } };\n\nfunction getColumnKey<T>(col: ColumnType<T>): string | undefined {\n if (col.dataIndex !== undefined) {\n return ([] as string[]).concat(col.dataIndex as string | string[]).join('.');\n }\n if (col.key !== undefined) {\n return String(col.key);\n }\n if (typeof col.title === 'string') {\n return col.title;\n }\n return undefined;\n}\n\nfunction safeReadStorage(key: string): ColumnWidthMap {\n try {\n const raw = localStorage.getItem(key);\n return raw ? (JSON.parse(raw) as ColumnWidthMap) : {};\n } catch {\n return {};\n }\n}\n\nfunction safeWriteStorage(key: string, value: ColumnWidthMap): void {\n try {\n localStorage.setItem(key, JSON.stringify(value));\n } catch {\n // quota exceeded or private mode\n }\n}\n\nfunction useResizableColumns<T>(\n columns: ProColumns<T>[],\n resizableConfig?: ResizableConfig,\n): { mergedColumns: ProColumns<T>[]; components: Components };\nfunction useResizableColumns<T>(\n columns: ColumnType<T>[],\n resizableConfig?: ResizableConfig,\n): { mergedColumns: ColumnType<T>[]; components: Components };\nfunction useResizableColumns<T>(\n columns: any[],\n resizableConfig?: ResizableConfig,\n) {\n const { persistenceKey, minWidth, maxWidth, defaultWidth = 120 } = resizableConfig ?? {};\n\n const [columnWidths, setColumnWidths] = useState<ColumnWidthMap>(() =>\n persistenceKey ? safeReadStorage(persistenceKey) : {},\n );\n\n const mergedColumns = useMemo(\n () =>\n columns.map((col) => {\n const colKey = getColumnKey(col);\n const effectiveWidth =\n colKey !== undefined\n ? (columnWidths[colKey] ?? (col.width as number | undefined) ?? defaultWidth)\n : (col.width as number | undefined);\n\n if (colKey === undefined) {\n return col;\n }\n\n return {\n ...col,\n width: effectiveWidth,\n onHeaderCell: () => ({\n width: effectiveWidth,\n minWidth,\n maxWidth,\n style: { width: effectiveWidth, minWidth: minWidth ?? 60 },\n onResizeEnd: (finalWidth: number) => {\n setColumnWidths((prev) => {\n const next = { ...prev, [colKey]: finalWidth };\n if (persistenceKey) {\n safeWriteStorage(persistenceKey, next);\n }\n return next;\n });\n },\n }),\n };\n }),\n [columns, columnWidths, minWidth, maxWidth, persistenceKey, defaultWidth],\n );\n\n const components = useMemo(\n () => ({\n header: {\n cell: ResizableTitle,\n },\n }),\n [],\n );\n\n return { mergedColumns, components };\n}\n\nexport default useResizableColumns;\n","import React, { useCallback, useRef } from 'react';\nimport type { ResizableTitleProps } from './types';\n\n/**\n * Find all <col> elements corresponding to the given <th> by matching cellIndex\n * across all <colgroup>s within the same .ant-table-wrapper.\n * Ant Design may split header and body into separate <table> elements when\n * scroll is enabled, each with its own <colgroup>.\n */\nfunction findCorrespondingCols(th: HTMLTableCellElement): HTMLElement[] {\n const cellIndex = th.cellIndex;\n const wrapper = th.closest('.ant-table-wrapper');\n if (!wrapper) {\n const table = th.closest('table');\n if (!table) return [];\n const col = table.querySelectorAll('colgroup > col')[cellIndex];\n return col ? [col as HTMLElement] : [];\n }\n const cols: HTMLElement[] = [];\n wrapper.querySelectorAll('colgroup').forEach((cg) => {\n const col = cg.children[cellIndex] as HTMLElement | undefined;\n if (col) cols.push(col);\n });\n return cols;\n}\n\nconst ResizableTitle: React.FC<ResizableTitleProps> = ({\n onResizeEnd,\n width,\n minWidth = 60,\n maxWidth,\n children,\n ...restProps\n}) => {\n const thRef = useRef<HTMLTableCellElement>(null);\n const handleRef = useRef<HTMLSpanElement>(null);\n const widthRef = useRef<number>(0);\n\n const handleMouseDown = useCallback(\n (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n\n const th = thRef.current;\n if (!th) return;\n\n const handle = handleRef.current;\n const startX = e.clientX;\n const startWidth = th.getBoundingClientRect().width;\n const cols = findCorrespondingCols(th);\n\n widthRef.current = startWidth;\n\n const onMouseMove = (ev: MouseEvent) => {\n const rawWidth = startWidth + (ev.clientX - startX);\n const newWidth = Math.max(\n minWidth,\n maxWidth !== undefined ? Math.min(maxWidth, rawWidth) : rawWidth,\n );\n th.style.width = `${newWidth}px`;\n cols.forEach((col) => {\n col.style.width = `${newWidth}px`;\n col.style.minWidth = `${newWidth}px`;\n });\n widthRef.current = newWidth;\n };\n\n const onMouseUp = () => {\n document.removeEventListener('mousemove', onMouseMove);\n document.removeEventListener('mouseup', onMouseUp);\n document.body.style.userSelect = '';\n document.body.style.cursor = '';\n handle?.classList.remove('resizable-handle--active');\n onResizeEnd?.(widthRef.current);\n\n const suppressClick = (ev: MouseEvent) => {\n ev.stopPropagation();\n ev.preventDefault();\n };\n document.addEventListener('click', suppressClick, true);\n requestAnimationFrame(() => {\n document.removeEventListener('click', suppressClick, true);\n });\n };\n\n document.body.style.userSelect = 'none';\n document.body.style.cursor = 'col-resize';\n handle?.classList.add('resizable-handle--active');\n document.addEventListener('mousemove', onMouseMove);\n document.addEventListener('mouseup', onMouseUp);\n },\n [minWidth, maxWidth, onResizeEnd],\n );\n\n if (!width || !onResizeEnd) {\n return <th {...restProps}>{children}</th>;\n }\n\n return (\n <th\n ref={thRef}\n {...restProps}\n style={{ position: 'relative', ...restProps.style }}\n >\n {children}\n <span\n ref={handleRef}\n className=\"resizable-handle\"\n style={{\n position: 'absolute',\n right: -6,\n top: 0,\n bottom: 0,\n width: 12,\n cursor: 'col-resize',\n zIndex: 10,\n }}\n onMouseDown={handleMouseDown}\n onClick={(e) => e.stopPropagation()}\n />\n </th>\n );\n};\n\nexport default ResizableTitle;\n","import { Table } from 'antd';\nimport type { TableProps, ColumnType } from 'antd/es/table';\nimport useResizableColumns from './useResizableColumns';\nimport type { ResizableConfig } from './types';\n\nexport interface ResizableTableProps<T extends object>\n extends Omit<TableProps<T>, 'components'> {\n resizableConfig?: ResizableConfig;\n}\n\nfunction ResizableTable<T extends object>(props: ResizableTableProps<T>) {\n const { columns = [], resizableConfig, ...rest } = props;\n\n const { mergedColumns, components } = useResizableColumns<T>(\n columns as ColumnType<T>[],\n resizableConfig,\n );\n\n return (\n <Table<T>\n {...rest}\n columns={mergedColumns}\n components={components}\n />\n );\n}\n\nexport default ResizableTable;\n"],"mappings":"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","names":["import_react","import_jsx_runtime","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","#style-inject:#style-inject","../src/style.css","../src/ResizableProTable.tsx","../src/useResizableColumns.ts","../src/ResizableTitle.tsx","../src/ResizableTable.tsx"],"sourcesContent":["import './style.css';\n\nexport { default } from './ResizableProTable';\nexport { default as ResizableProTable } from './ResizableProTable';\nexport type { ResizableProTableProps } from './ResizableProTable';\n\nexport { default as ResizableTable } from './ResizableTable';\nexport type { ResizableTableProps } from './ResizableTable';\n\nexport { default as useResizableColumns } from './useResizableColumns';\nexport type { ResizableConfig, ColumnWidthMap, ResizableTitleProps } from './types';\n","\n export default function styleInject(css, { insertAt } = {}) {\n if (!css || typeof document === 'undefined') return\n \n const head = document.head || document.getElementsByTagName('head')[0]\n const style = document.createElement('style')\n style.type = 'text/css'\n \n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild)\n } else {\n head.appendChild(style)\n }\n } else {\n head.appendChild(style)\n }\n \n if (style.styleSheet) {\n style.styleSheet.cssText = css\n } else {\n style.appendChild(document.createTextNode(css))\n }\n }\n ","import styleInject from '#style-inject';styleInject(\".ant-table-thead > tr > th:not(.ant-table-cell-fix) {\\n position: relative;\\n}\\n.ant-table-thead > tr > th {\\n overflow: visible !important;\\n}\\n.ant-table-wrapper .ant-table-thead,\\n.ant-table .ant-table-thead {\\n overflow: visible !important;\\n}\\n.resizable-handle {\\n position: absolute;\\n right: -6px;\\n top: 0;\\n bottom: 0;\\n width: 12px;\\n cursor: col-resize;\\n z-index: 1;\\n pointer-events: auto;\\n}\\n.resizable-handle::after {\\n content: \\\"\\\";\\n position: absolute;\\n left: 5px;\\n top: 15%;\\n height: 70%;\\n width: 2px;\\n background: rgba(0, 0, 0, 0.08);\\n transition: background 0.2s;\\n}\\n.resizable-handle:hover::after {\\n background: #1677ff;\\n}\\n.resizable-handle--active::after {\\n background: #1677ff;\\n}\\n\")","import { ProTable } from '@ant-design/pro-components';\nimport type { ProTableProps, ProColumns } from '@ant-design/pro-components';\nimport useResizableColumns from './useResizableColumns';\nimport type { ResizableConfig } from './types';\n\nexport interface ResizableProTableProps<T extends Record<string, any>>\n extends Omit<ProTableProps<T, any>, 'components'> {\n resizableConfig?: ResizableConfig;\n}\n\nfunction ResizableProTable<T extends Record<string, any>>(\n props: ResizableProTableProps<T>,\n) {\n const { columns = [], resizableConfig, tableLayout, ...rest } = props;\n\n const { mergedColumns, components } = useResizableColumns<T>(\n columns as ProColumns<T>[],\n resizableConfig,\n );\n\n return (\n <ProTable<T>\n {...rest}\n columns={mergedColumns}\n components={components}\n tableLayout={tableLayout ?? 'fixed'}\n />\n );\n}\n\nexport default ResizableProTable;\n","import { useMemo, useState } from 'react';\nimport type { ColumnType } from 'antd/es/table';\nimport type { ProColumns } from '@ant-design/pro-components';\nimport ResizableTitle from './ResizableTitle';\nimport type { ColumnWidthMap, ResizableConfig } from './types';\n\ntype Components = { header: { cell: typeof ResizableTitle } };\n\nfunction getColumnKey<T>(col: ColumnType<T>): string | undefined {\n if (col.dataIndex !== undefined) {\n return ([] as string[]).concat(col.dataIndex as string | string[]).join('.');\n }\n if (col.key !== undefined) {\n return String(col.key);\n }\n if (typeof col.title === 'string') {\n return col.title;\n }\n return undefined;\n}\n\nfunction safeReadStorage(key: string): ColumnWidthMap {\n try {\n const raw = localStorage.getItem(key);\n return raw ? (JSON.parse(raw) as ColumnWidthMap) : {};\n } catch {\n return {};\n }\n}\n\nfunction safeWriteStorage(key: string, value: ColumnWidthMap): void {\n try {\n localStorage.setItem(key, JSON.stringify(value));\n } catch {\n // quota exceeded or private mode\n }\n}\n\nfunction useResizableColumns<T>(\n columns: ProColumns<T>[],\n resizableConfig?: ResizableConfig,\n): { mergedColumns: ProColumns<T>[]; components: Components };\nfunction useResizableColumns<T>(\n columns: ColumnType<T>[],\n resizableConfig?: ResizableConfig,\n): { mergedColumns: ColumnType<T>[]; components: Components };\nfunction useResizableColumns<T>(\n columns: any[],\n resizableConfig?: ResizableConfig,\n) {\n const { persistenceKey, minWidth, maxWidth, defaultWidth = 120 } = resizableConfig ?? {};\n\n const [columnWidths, setColumnWidths] = useState<ColumnWidthMap>(() =>\n persistenceKey ? safeReadStorage(persistenceKey) : {},\n );\n\n const mergedColumns = useMemo(\n () =>\n columns.map((col) => {\n const colKey = getColumnKey(col);\n const effectiveWidth =\n colKey !== undefined\n ? (columnWidths[colKey] ?? (col.width as number | undefined) ?? defaultWidth)\n : (col.width as number | undefined);\n\n if (colKey === undefined) {\n return col;\n }\n\n return {\n ...col,\n width: effectiveWidth,\n onHeaderCell: () => ({\n width: effectiveWidth,\n minWidth,\n maxWidth,\n style: { width: effectiveWidth, minWidth: minWidth ?? 60 },\n onResizeEnd: (finalWidth: number) => {\n setColumnWidths((prev) => {\n const next = { ...prev, [colKey]: finalWidth };\n if (persistenceKey) {\n safeWriteStorage(persistenceKey, next);\n }\n return next;\n });\n },\n }),\n };\n }),\n [columns, columnWidths, minWidth, maxWidth, persistenceKey, defaultWidth],\n );\n\n const components = useMemo(\n () => ({\n header: {\n cell: ResizableTitle,\n },\n }),\n [],\n );\n\n return { mergedColumns, components };\n}\n\nexport default useResizableColumns;\n","import React, { useCallback, useRef } from 'react';\nimport type { ResizableTitleProps } from './types';\n\n/**\n * Find all <col> elements corresponding to the given <th> by matching cellIndex\n * across all <colgroup>s within the same .ant-table-wrapper.\n * Ant Design may split header and body into separate <table> elements when\n * scroll is enabled, each with its own <colgroup>.\n */\nfunction findCorrespondingCols(th: HTMLTableCellElement): HTMLElement[] {\n const cellIndex = th.cellIndex;\n const wrapper = th.closest('.ant-table-wrapper');\n if (!wrapper) {\n const table = th.closest('table');\n if (!table) return [];\n const col = table.querySelectorAll('colgroup > col')[cellIndex];\n return col ? [col as HTMLElement] : [];\n }\n const cols: HTMLElement[] = [];\n wrapper.querySelectorAll('colgroup').forEach((cg) => {\n const col = cg.children[cellIndex] as HTMLElement | undefined;\n if (col) cols.push(col);\n });\n return cols;\n}\n\nconst ResizableTitle: React.FC<ResizableTitleProps> = ({\n onResizeEnd,\n width,\n minWidth = 60,\n maxWidth,\n children,\n ...restProps\n}) => {\n const thRef = useRef<HTMLTableCellElement>(null);\n const handleRef = useRef<HTMLSpanElement>(null);\n const widthRef = useRef<number>(0);\n\n const handleMouseDown = useCallback(\n (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n\n const th = thRef.current;\n if (!th) return;\n\n const handle = handleRef.current;\n const startX = e.clientX;\n const startWidth = th.getBoundingClientRect().width;\n const cols = findCorrespondingCols(th);\n\n widthRef.current = startWidth;\n\n const onMouseMove = (ev: MouseEvent) => {\n const rawWidth = startWidth + (ev.clientX - startX);\n const newWidth = Math.max(\n minWidth,\n maxWidth !== undefined ? Math.min(maxWidth, rawWidth) : rawWidth,\n );\n th.style.width = `${newWidth}px`;\n cols.forEach((col) => {\n col.style.width = `${newWidth}px`;\n col.style.minWidth = `${newWidth}px`;\n });\n widthRef.current = newWidth;\n };\n\n const onMouseUp = () => {\n document.removeEventListener('mousemove', onMouseMove);\n document.removeEventListener('mouseup', onMouseUp);\n document.body.style.userSelect = '';\n document.body.style.cursor = '';\n handle?.classList.remove('resizable-handle--active');\n onResizeEnd?.(widthRef.current);\n\n const suppressClick = (ev: MouseEvent) => {\n ev.stopPropagation();\n ev.preventDefault();\n };\n document.addEventListener('click', suppressClick, true);\n requestAnimationFrame(() => {\n document.removeEventListener('click', suppressClick, true);\n });\n };\n\n document.body.style.userSelect = 'none';\n document.body.style.cursor = 'col-resize';\n handle?.classList.add('resizable-handle--active');\n document.addEventListener('mousemove', onMouseMove);\n document.addEventListener('mouseup', onMouseUp);\n },\n [minWidth, maxWidth, onResizeEnd],\n );\n\n if (!width || !onResizeEnd) {\n return <th {...restProps}>{children}</th>;\n }\n\n const isFixedCell = String(restProps.className ?? '').includes('ant-table-cell-fix');\n const relativeStyle: React.CSSProperties = { position: 'relative', ...restProps.style };\n const mergedStyle = isFixedCell ? restProps.style : relativeStyle;\n\n return (\n <th\n ref={thRef}\n {...restProps}\n style={mergedStyle}\n >\n {children}\n <span\n ref={handleRef}\n className=\"resizable-handle\"\n style={{\n position: 'absolute',\n right: -6,\n top: 0,\n bottom: 0,\n width: 12,\n cursor: 'col-resize',\n zIndex: 1,\n }}\n onMouseDown={handleMouseDown}\n onClick={(e) => e.stopPropagation()}\n />\n </th>\n );\n};\n\nexport default ResizableTitle;\n","import { Table } from 'antd';\nimport type { TableProps, ColumnType } from 'antd/es/table';\nimport useResizableColumns from './useResizableColumns';\nimport type { ResizableConfig } from './types';\n\nexport interface ResizableTableProps<T extends object>\n extends Omit<TableProps<T>, 'components'> {\n resizableConfig?: ResizableConfig;\n}\n\nfunction ResizableTable<T extends object>(props: ResizableTableProps<T>) {\n const { columns = [], resizableConfig, tableLayout, ...rest } = props;\n\n const { mergedColumns, components } = useResizableColumns<T>(\n columns as ColumnType<T>[],\n resizableConfig,\n );\n\n return (\n <Table<T>\n {...rest}\n columns={mergedColumns}\n components={components}\n tableLayout={tableLayout ?? 'fixed'}\n />\n );\n}\n\nexport default ResizableTable;\n"],"mappings":"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","names":["import_react","import_jsx_runtime","import_jsx_runtime"]}
|
package/dist/index.mjs
CHANGED
|
@@ -21,7 +21,7 @@ function styleInject(css, { insertAt } = {}) {
|
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
// src/style.css
|
|
24
|
-
styleInject('.ant-table-thead > tr > th {\n position: relative;\n overflow: visible !important;\n}\n.ant-table-wrapper .ant-table-thead,\n.ant-table .ant-table-thead {\n overflow: visible !important;\n}\n.resizable-handle {\n position: absolute;\n right: -6px;\n top: 0;\n bottom: 0;\n width: 12px;\n cursor: col-resize;\n z-index:
|
|
24
|
+
styleInject('.ant-table-thead > tr > th:not(.ant-table-cell-fix) {\n position: relative;\n}\n.ant-table-thead > tr > th {\n overflow: visible !important;\n}\n.ant-table-wrapper .ant-table-thead,\n.ant-table .ant-table-thead {\n overflow: visible !important;\n}\n.resizable-handle {\n position: absolute;\n right: -6px;\n top: 0;\n bottom: 0;\n width: 12px;\n cursor: col-resize;\n z-index: 1;\n pointer-events: auto;\n}\n.resizable-handle::after {\n content: "";\n position: absolute;\n left: 5px;\n top: 15%;\n height: 70%;\n width: 2px;\n background: rgba(0, 0, 0, 0.08);\n transition: background 0.2s;\n}\n.resizable-handle:hover::after {\n background: #1677ff;\n}\n.resizable-handle--active::after {\n background: #1677ff;\n}\n');
|
|
25
25
|
|
|
26
26
|
// src/ResizableProTable.tsx
|
|
27
27
|
import { ProTable } from "@ant-design/pro-components";
|
|
@@ -110,12 +110,15 @@ var ResizableTitle = ({
|
|
|
110
110
|
if (!width || !onResizeEnd) {
|
|
111
111
|
return /* @__PURE__ */ jsx("th", { ...restProps, children });
|
|
112
112
|
}
|
|
113
|
+
const isFixedCell = String(restProps.className ?? "").includes("ant-table-cell-fix");
|
|
114
|
+
const relativeStyle = { position: "relative", ...restProps.style };
|
|
115
|
+
const mergedStyle = isFixedCell ? restProps.style : relativeStyle;
|
|
113
116
|
return /* @__PURE__ */ jsxs(
|
|
114
117
|
"th",
|
|
115
118
|
{
|
|
116
119
|
ref: thRef,
|
|
117
120
|
...restProps,
|
|
118
|
-
style:
|
|
121
|
+
style: mergedStyle,
|
|
119
122
|
children: [
|
|
120
123
|
children,
|
|
121
124
|
/* @__PURE__ */ jsx(
|
|
@@ -130,7 +133,7 @@ var ResizableTitle = ({
|
|
|
130
133
|
bottom: 0,
|
|
131
134
|
width: 12,
|
|
132
135
|
cursor: "col-resize",
|
|
133
|
-
zIndex:
|
|
136
|
+
zIndex: 1
|
|
134
137
|
},
|
|
135
138
|
onMouseDown: handleMouseDown,
|
|
136
139
|
onClick: (e) => e.stopPropagation()
|
|
@@ -218,7 +221,7 @@ var useResizableColumns_default = useResizableColumns;
|
|
|
218
221
|
// src/ResizableProTable.tsx
|
|
219
222
|
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
220
223
|
function ResizableProTable(props) {
|
|
221
|
-
const { columns = [], resizableConfig, ...rest } = props;
|
|
224
|
+
const { columns = [], resizableConfig, tableLayout, ...rest } = props;
|
|
222
225
|
const { mergedColumns, components } = useResizableColumns_default(
|
|
223
226
|
columns,
|
|
224
227
|
resizableConfig
|
|
@@ -228,7 +231,8 @@ function ResizableProTable(props) {
|
|
|
228
231
|
{
|
|
229
232
|
...rest,
|
|
230
233
|
columns: mergedColumns,
|
|
231
|
-
components
|
|
234
|
+
components,
|
|
235
|
+
tableLayout: tableLayout ?? "fixed"
|
|
232
236
|
}
|
|
233
237
|
);
|
|
234
238
|
}
|
|
@@ -238,7 +242,7 @@ var ResizableProTable_default = ResizableProTable;
|
|
|
238
242
|
import { Table } from "antd";
|
|
239
243
|
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
240
244
|
function ResizableTable(props) {
|
|
241
|
-
const { columns = [], resizableConfig, ...rest } = props;
|
|
245
|
+
const { columns = [], resizableConfig, tableLayout, ...rest } = props;
|
|
242
246
|
const { mergedColumns, components } = useResizableColumns_default(
|
|
243
247
|
columns,
|
|
244
248
|
resizableConfig
|
|
@@ -248,7 +252,8 @@ function ResizableTable(props) {
|
|
|
248
252
|
{
|
|
249
253
|
...rest,
|
|
250
254
|
columns: mergedColumns,
|
|
251
|
-
components
|
|
255
|
+
components,
|
|
256
|
+
tableLayout: tableLayout ?? "fixed"
|
|
252
257
|
}
|
|
253
258
|
);
|
|
254
259
|
}
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["#style-inject:#style-inject","../src/style.css","../src/ResizableProTable.tsx","../src/useResizableColumns.ts","../src/ResizableTitle.tsx","../src/ResizableTable.tsx"],"sourcesContent":["\n export default function styleInject(css, { insertAt } = {}) {\n if (!css || typeof document === 'undefined') return\n \n const head = document.head || document.getElementsByTagName('head')[0]\n const style = document.createElement('style')\n style.type = 'text/css'\n \n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild)\n } else {\n head.appendChild(style)\n }\n } else {\n head.appendChild(style)\n }\n \n if (style.styleSheet) {\n style.styleSheet.cssText = css\n } else {\n style.appendChild(document.createTextNode(css))\n }\n }\n ","import styleInject from '#style-inject';styleInject(\".ant-table-thead > tr > th {\\n position: relative;\\n overflow: visible !important;\\n}\\n.ant-table-wrapper .ant-table-thead,\\n.ant-table .ant-table-thead {\\n overflow: visible !important;\\n}\\n.resizable-handle {\\n position: absolute;\\n right: -6px;\\n top: 0;\\n bottom: 0;\\n width: 12px;\\n cursor: col-resize;\\n z-index: 10;\\n pointer-events: auto;\\n}\\n.resizable-handle::after {\\n content: \\\"\\\";\\n position: absolute;\\n left: 5px;\\n top: 15%;\\n height: 70%;\\n width: 2px;\\n background: rgba(0, 0, 0, 0.08);\\n transition: background 0.2s;\\n}\\n.resizable-handle:hover::after {\\n background: #1677ff;\\n}\\n.resizable-handle--active::after {\\n background: #1677ff;\\n}\\n\")","import { ProTable } from '@ant-design/pro-components';\nimport type { ProTableProps, ProColumns } from '@ant-design/pro-components';\nimport useResizableColumns from './useResizableColumns';\nimport type { ResizableConfig } from './types';\n\nexport interface ResizableProTableProps<T extends Record<string, any>>\n extends Omit<ProTableProps<T, any>, 'components'> {\n resizableConfig?: ResizableConfig;\n}\n\nfunction ResizableProTable<T extends Record<string, any>>(\n props: ResizableProTableProps<T>,\n) {\n const { columns = [], resizableConfig, ...rest } = props;\n\n const { mergedColumns, components } = useResizableColumns<T>(\n columns as ProColumns<T>[],\n resizableConfig,\n );\n\n return (\n <ProTable<T>\n {...rest}\n columns={mergedColumns}\n components={components}\n />\n );\n}\n\nexport default ResizableProTable;\n","import { useMemo, useState } from 'react';\nimport type { ColumnType } from 'antd/es/table';\nimport type { ProColumns } from '@ant-design/pro-components';\nimport ResizableTitle from './ResizableTitle';\nimport type { ColumnWidthMap, ResizableConfig } from './types';\n\ntype Components = { header: { cell: typeof ResizableTitle } };\n\nfunction getColumnKey<T>(col: ColumnType<T>): string | undefined {\n if (col.dataIndex !== undefined) {\n return ([] as string[]).concat(col.dataIndex as string | string[]).join('.');\n }\n if (col.key !== undefined) {\n return String(col.key);\n }\n if (typeof col.title === 'string') {\n return col.title;\n }\n return undefined;\n}\n\nfunction safeReadStorage(key: string): ColumnWidthMap {\n try {\n const raw = localStorage.getItem(key);\n return raw ? (JSON.parse(raw) as ColumnWidthMap) : {};\n } catch {\n return {};\n }\n}\n\nfunction safeWriteStorage(key: string, value: ColumnWidthMap): void {\n try {\n localStorage.setItem(key, JSON.stringify(value));\n } catch {\n // quota exceeded or private mode\n }\n}\n\nfunction useResizableColumns<T>(\n columns: ProColumns<T>[],\n resizableConfig?: ResizableConfig,\n): { mergedColumns: ProColumns<T>[]; components: Components };\nfunction useResizableColumns<T>(\n columns: ColumnType<T>[],\n resizableConfig?: ResizableConfig,\n): { mergedColumns: ColumnType<T>[]; components: Components };\nfunction useResizableColumns<T>(\n columns: any[],\n resizableConfig?: ResizableConfig,\n) {\n const { persistenceKey, minWidth, maxWidth, defaultWidth = 120 } = resizableConfig ?? {};\n\n const [columnWidths, setColumnWidths] = useState<ColumnWidthMap>(() =>\n persistenceKey ? safeReadStorage(persistenceKey) : {},\n );\n\n const mergedColumns = useMemo(\n () =>\n columns.map((col) => {\n const colKey = getColumnKey(col);\n const effectiveWidth =\n colKey !== undefined\n ? (columnWidths[colKey] ?? (col.width as number | undefined) ?? defaultWidth)\n : (col.width as number | undefined);\n\n if (colKey === undefined) {\n return col;\n }\n\n return {\n ...col,\n width: effectiveWidth,\n onHeaderCell: () => ({\n width: effectiveWidth,\n minWidth,\n maxWidth,\n style: { width: effectiveWidth, minWidth: minWidth ?? 60 },\n onResizeEnd: (finalWidth: number) => {\n setColumnWidths((prev) => {\n const next = { ...prev, [colKey]: finalWidth };\n if (persistenceKey) {\n safeWriteStorage(persistenceKey, next);\n }\n return next;\n });\n },\n }),\n };\n }),\n [columns, columnWidths, minWidth, maxWidth, persistenceKey, defaultWidth],\n );\n\n const components = useMemo(\n () => ({\n header: {\n cell: ResizableTitle,\n },\n }),\n [],\n );\n\n return { mergedColumns, components };\n}\n\nexport default useResizableColumns;\n","import React, { useCallback, useRef } from 'react';\nimport type { ResizableTitleProps } from './types';\n\n/**\n * Find all <col> elements corresponding to the given <th> by matching cellIndex\n * across all <colgroup>s within the same .ant-table-wrapper.\n * Ant Design may split header and body into separate <table> elements when\n * scroll is enabled, each with its own <colgroup>.\n */\nfunction findCorrespondingCols(th: HTMLTableCellElement): HTMLElement[] {\n const cellIndex = th.cellIndex;\n const wrapper = th.closest('.ant-table-wrapper');\n if (!wrapper) {\n const table = th.closest('table');\n if (!table) return [];\n const col = table.querySelectorAll('colgroup > col')[cellIndex];\n return col ? [col as HTMLElement] : [];\n }\n const cols: HTMLElement[] = [];\n wrapper.querySelectorAll('colgroup').forEach((cg) => {\n const col = cg.children[cellIndex] as HTMLElement | undefined;\n if (col) cols.push(col);\n });\n return cols;\n}\n\nconst ResizableTitle: React.FC<ResizableTitleProps> = ({\n onResizeEnd,\n width,\n minWidth = 60,\n maxWidth,\n children,\n ...restProps\n}) => {\n const thRef = useRef<HTMLTableCellElement>(null);\n const handleRef = useRef<HTMLSpanElement>(null);\n const widthRef = useRef<number>(0);\n\n const handleMouseDown = useCallback(\n (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n\n const th = thRef.current;\n if (!th) return;\n\n const handle = handleRef.current;\n const startX = e.clientX;\n const startWidth = th.getBoundingClientRect().width;\n const cols = findCorrespondingCols(th);\n\n widthRef.current = startWidth;\n\n const onMouseMove = (ev: MouseEvent) => {\n const rawWidth = startWidth + (ev.clientX - startX);\n const newWidth = Math.max(\n minWidth,\n maxWidth !== undefined ? Math.min(maxWidth, rawWidth) : rawWidth,\n );\n th.style.width = `${newWidth}px`;\n cols.forEach((col) => {\n col.style.width = `${newWidth}px`;\n col.style.minWidth = `${newWidth}px`;\n });\n widthRef.current = newWidth;\n };\n\n const onMouseUp = () => {\n document.removeEventListener('mousemove', onMouseMove);\n document.removeEventListener('mouseup', onMouseUp);\n document.body.style.userSelect = '';\n document.body.style.cursor = '';\n handle?.classList.remove('resizable-handle--active');\n onResizeEnd?.(widthRef.current);\n\n const suppressClick = (ev: MouseEvent) => {\n ev.stopPropagation();\n ev.preventDefault();\n };\n document.addEventListener('click', suppressClick, true);\n requestAnimationFrame(() => {\n document.removeEventListener('click', suppressClick, true);\n });\n };\n\n document.body.style.userSelect = 'none';\n document.body.style.cursor = 'col-resize';\n handle?.classList.add('resizable-handle--active');\n document.addEventListener('mousemove', onMouseMove);\n document.addEventListener('mouseup', onMouseUp);\n },\n [minWidth, maxWidth, onResizeEnd],\n );\n\n if (!width || !onResizeEnd) {\n return <th {...restProps}>{children}</th>;\n }\n\n return (\n <th\n ref={thRef}\n {...restProps}\n style={{ position: 'relative', ...restProps.style }}\n >\n {children}\n <span\n ref={handleRef}\n className=\"resizable-handle\"\n style={{\n position: 'absolute',\n right: -6,\n top: 0,\n bottom: 0,\n width: 12,\n cursor: 'col-resize',\n zIndex: 10,\n }}\n onMouseDown={handleMouseDown}\n onClick={(e) => e.stopPropagation()}\n />\n </th>\n );\n};\n\nexport default ResizableTitle;\n","import { Table } from 'antd';\nimport type { TableProps, ColumnType } from 'antd/es/table';\nimport useResizableColumns from './useResizableColumns';\nimport type { ResizableConfig } from './types';\n\nexport interface ResizableTableProps<T extends object>\n extends Omit<TableProps<T>, 'components'> {\n resizableConfig?: ResizableConfig;\n}\n\nfunction ResizableTable<T extends object>(props: ResizableTableProps<T>) {\n const { columns = [], resizableConfig, ...rest } = props;\n\n const { mergedColumns, components } = useResizableColumns<T>(\n columns as ColumnType<T>[],\n resizableConfig,\n );\n\n return (\n <Table<T>\n {...rest}\n columns={mergedColumns}\n components={components}\n />\n );\n}\n\nexport default ResizableTable;\n"],"mappings":"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","names":["jsx","jsx"]}
|
|
1
|
+
{"version":3,"sources":["#style-inject:#style-inject","../src/style.css","../src/ResizableProTable.tsx","../src/useResizableColumns.ts","../src/ResizableTitle.tsx","../src/ResizableTable.tsx"],"sourcesContent":["\n export default function styleInject(css, { insertAt } = {}) {\n if (!css || typeof document === 'undefined') return\n \n const head = document.head || document.getElementsByTagName('head')[0]\n const style = document.createElement('style')\n style.type = 'text/css'\n \n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild)\n } else {\n head.appendChild(style)\n }\n } else {\n head.appendChild(style)\n }\n \n if (style.styleSheet) {\n style.styleSheet.cssText = css\n } else {\n style.appendChild(document.createTextNode(css))\n }\n }\n ","import styleInject from '#style-inject';styleInject(\".ant-table-thead > tr > th:not(.ant-table-cell-fix) {\\n position: relative;\\n}\\n.ant-table-thead > tr > th {\\n overflow: visible !important;\\n}\\n.ant-table-wrapper .ant-table-thead,\\n.ant-table .ant-table-thead {\\n overflow: visible !important;\\n}\\n.resizable-handle {\\n position: absolute;\\n right: -6px;\\n top: 0;\\n bottom: 0;\\n width: 12px;\\n cursor: col-resize;\\n z-index: 1;\\n pointer-events: auto;\\n}\\n.resizable-handle::after {\\n content: \\\"\\\";\\n position: absolute;\\n left: 5px;\\n top: 15%;\\n height: 70%;\\n width: 2px;\\n background: rgba(0, 0, 0, 0.08);\\n transition: background 0.2s;\\n}\\n.resizable-handle:hover::after {\\n background: #1677ff;\\n}\\n.resizable-handle--active::after {\\n background: #1677ff;\\n}\\n\")","import { ProTable } from '@ant-design/pro-components';\nimport type { ProTableProps, ProColumns } from '@ant-design/pro-components';\nimport useResizableColumns from './useResizableColumns';\nimport type { ResizableConfig } from './types';\n\nexport interface ResizableProTableProps<T extends Record<string, any>>\n extends Omit<ProTableProps<T, any>, 'components'> {\n resizableConfig?: ResizableConfig;\n}\n\nfunction ResizableProTable<T extends Record<string, any>>(\n props: ResizableProTableProps<T>,\n) {\n const { columns = [], resizableConfig, tableLayout, ...rest } = props;\n\n const { mergedColumns, components } = useResizableColumns<T>(\n columns as ProColumns<T>[],\n resizableConfig,\n );\n\n return (\n <ProTable<T>\n {...rest}\n columns={mergedColumns}\n components={components}\n tableLayout={tableLayout ?? 'fixed'}\n />\n );\n}\n\nexport default ResizableProTable;\n","import { useMemo, useState } from 'react';\nimport type { ColumnType } from 'antd/es/table';\nimport type { ProColumns } from '@ant-design/pro-components';\nimport ResizableTitle from './ResizableTitle';\nimport type { ColumnWidthMap, ResizableConfig } from './types';\n\ntype Components = { header: { cell: typeof ResizableTitle } };\n\nfunction getColumnKey<T>(col: ColumnType<T>): string | undefined {\n if (col.dataIndex !== undefined) {\n return ([] as string[]).concat(col.dataIndex as string | string[]).join('.');\n }\n if (col.key !== undefined) {\n return String(col.key);\n }\n if (typeof col.title === 'string') {\n return col.title;\n }\n return undefined;\n}\n\nfunction safeReadStorage(key: string): ColumnWidthMap {\n try {\n const raw = localStorage.getItem(key);\n return raw ? (JSON.parse(raw) as ColumnWidthMap) : {};\n } catch {\n return {};\n }\n}\n\nfunction safeWriteStorage(key: string, value: ColumnWidthMap): void {\n try {\n localStorage.setItem(key, JSON.stringify(value));\n } catch {\n // quota exceeded or private mode\n }\n}\n\nfunction useResizableColumns<T>(\n columns: ProColumns<T>[],\n resizableConfig?: ResizableConfig,\n): { mergedColumns: ProColumns<T>[]; components: Components };\nfunction useResizableColumns<T>(\n columns: ColumnType<T>[],\n resizableConfig?: ResizableConfig,\n): { mergedColumns: ColumnType<T>[]; components: Components };\nfunction useResizableColumns<T>(\n columns: any[],\n resizableConfig?: ResizableConfig,\n) {\n const { persistenceKey, minWidth, maxWidth, defaultWidth = 120 } = resizableConfig ?? {};\n\n const [columnWidths, setColumnWidths] = useState<ColumnWidthMap>(() =>\n persistenceKey ? safeReadStorage(persistenceKey) : {},\n );\n\n const mergedColumns = useMemo(\n () =>\n columns.map((col) => {\n const colKey = getColumnKey(col);\n const effectiveWidth =\n colKey !== undefined\n ? (columnWidths[colKey] ?? (col.width as number | undefined) ?? defaultWidth)\n : (col.width as number | undefined);\n\n if (colKey === undefined) {\n return col;\n }\n\n return {\n ...col,\n width: effectiveWidth,\n onHeaderCell: () => ({\n width: effectiveWidth,\n minWidth,\n maxWidth,\n style: { width: effectiveWidth, minWidth: minWidth ?? 60 },\n onResizeEnd: (finalWidth: number) => {\n setColumnWidths((prev) => {\n const next = { ...prev, [colKey]: finalWidth };\n if (persistenceKey) {\n safeWriteStorage(persistenceKey, next);\n }\n return next;\n });\n },\n }),\n };\n }),\n [columns, columnWidths, minWidth, maxWidth, persistenceKey, defaultWidth],\n );\n\n const components = useMemo(\n () => ({\n header: {\n cell: ResizableTitle,\n },\n }),\n [],\n );\n\n return { mergedColumns, components };\n}\n\nexport default useResizableColumns;\n","import React, { useCallback, useRef } from 'react';\nimport type { ResizableTitleProps } from './types';\n\n/**\n * Find all <col> elements corresponding to the given <th> by matching cellIndex\n * across all <colgroup>s within the same .ant-table-wrapper.\n * Ant Design may split header and body into separate <table> elements when\n * scroll is enabled, each with its own <colgroup>.\n */\nfunction findCorrespondingCols(th: HTMLTableCellElement): HTMLElement[] {\n const cellIndex = th.cellIndex;\n const wrapper = th.closest('.ant-table-wrapper');\n if (!wrapper) {\n const table = th.closest('table');\n if (!table) return [];\n const col = table.querySelectorAll('colgroup > col')[cellIndex];\n return col ? [col as HTMLElement] : [];\n }\n const cols: HTMLElement[] = [];\n wrapper.querySelectorAll('colgroup').forEach((cg) => {\n const col = cg.children[cellIndex] as HTMLElement | undefined;\n if (col) cols.push(col);\n });\n return cols;\n}\n\nconst ResizableTitle: React.FC<ResizableTitleProps> = ({\n onResizeEnd,\n width,\n minWidth = 60,\n maxWidth,\n children,\n ...restProps\n}) => {\n const thRef = useRef<HTMLTableCellElement>(null);\n const handleRef = useRef<HTMLSpanElement>(null);\n const widthRef = useRef<number>(0);\n\n const handleMouseDown = useCallback(\n (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n\n const th = thRef.current;\n if (!th) return;\n\n const handle = handleRef.current;\n const startX = e.clientX;\n const startWidth = th.getBoundingClientRect().width;\n const cols = findCorrespondingCols(th);\n\n widthRef.current = startWidth;\n\n const onMouseMove = (ev: MouseEvent) => {\n const rawWidth = startWidth + (ev.clientX - startX);\n const newWidth = Math.max(\n minWidth,\n maxWidth !== undefined ? Math.min(maxWidth, rawWidth) : rawWidth,\n );\n th.style.width = `${newWidth}px`;\n cols.forEach((col) => {\n col.style.width = `${newWidth}px`;\n col.style.minWidth = `${newWidth}px`;\n });\n widthRef.current = newWidth;\n };\n\n const onMouseUp = () => {\n document.removeEventListener('mousemove', onMouseMove);\n document.removeEventListener('mouseup', onMouseUp);\n document.body.style.userSelect = '';\n document.body.style.cursor = '';\n handle?.classList.remove('resizable-handle--active');\n onResizeEnd?.(widthRef.current);\n\n const suppressClick = (ev: MouseEvent) => {\n ev.stopPropagation();\n ev.preventDefault();\n };\n document.addEventListener('click', suppressClick, true);\n requestAnimationFrame(() => {\n document.removeEventListener('click', suppressClick, true);\n });\n };\n\n document.body.style.userSelect = 'none';\n document.body.style.cursor = 'col-resize';\n handle?.classList.add('resizable-handle--active');\n document.addEventListener('mousemove', onMouseMove);\n document.addEventListener('mouseup', onMouseUp);\n },\n [minWidth, maxWidth, onResizeEnd],\n );\n\n if (!width || !onResizeEnd) {\n return <th {...restProps}>{children}</th>;\n }\n\n const isFixedCell = String(restProps.className ?? '').includes('ant-table-cell-fix');\n const relativeStyle: React.CSSProperties = { position: 'relative', ...restProps.style };\n const mergedStyle = isFixedCell ? restProps.style : relativeStyle;\n\n return (\n <th\n ref={thRef}\n {...restProps}\n style={mergedStyle}\n >\n {children}\n <span\n ref={handleRef}\n className=\"resizable-handle\"\n style={{\n position: 'absolute',\n right: -6,\n top: 0,\n bottom: 0,\n width: 12,\n cursor: 'col-resize',\n zIndex: 1,\n }}\n onMouseDown={handleMouseDown}\n onClick={(e) => e.stopPropagation()}\n />\n </th>\n );\n};\n\nexport default ResizableTitle;\n","import { Table } from 'antd';\nimport type { TableProps, ColumnType } from 'antd/es/table';\nimport useResizableColumns from './useResizableColumns';\nimport type { ResizableConfig } from './types';\n\nexport interface ResizableTableProps<T extends object>\n extends Omit<TableProps<T>, 'components'> {\n resizableConfig?: ResizableConfig;\n}\n\nfunction ResizableTable<T extends object>(props: ResizableTableProps<T>) {\n const { columns = [], resizableConfig, tableLayout, ...rest } = props;\n\n const { mergedColumns, components } = useResizableColumns<T>(\n columns as ColumnType<T>[],\n resizableConfig,\n );\n\n return (\n <Table<T>\n {...rest}\n columns={mergedColumns}\n components={components}\n tableLayout={tableLayout ?? 'fixed'}\n />\n );\n}\n\nexport default ResizableTable;\n"],"mappings":"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","names":["jsx","jsx"]}
|
package/dist/style.css
CHANGED
|
@@ -1,17 +1,14 @@
|
|
|
1
1
|
/* Make header cells the positioning parent for the handle */
|
|
2
|
-
.ant-table-thead > tr > th {
|
|
2
|
+
.ant-table-thead > tr > th:not(.ant-table-cell-fix) {
|
|
3
3
|
position: relative;
|
|
4
|
+
}
|
|
5
|
+
.ant-table-thead > tr > th {
|
|
4
6
|
overflow: visible !important;
|
|
5
7
|
}
|
|
6
8
|
.ant-table-wrapper .ant-table-thead,
|
|
7
9
|
.ant-table .ant-table-thead {
|
|
8
10
|
overflow: visible !important;
|
|
9
11
|
}
|
|
10
|
-
/* Fixed columns must stay above non-fixed column drag handles (z-index: 10) */
|
|
11
|
-
.ant-table-thead > tr > th.ant-table-cell-fix-left,
|
|
12
|
-
.ant-table-thead > tr > th.ant-table-cell-fix-right {
|
|
13
|
-
z-index: 11 !important;
|
|
14
|
-
}
|
|
15
12
|
/* Custom drag handle */
|
|
16
13
|
.resizable-handle {
|
|
17
14
|
position: absolute;
|