@superad/ui 0.1.1

package/es/Table/core/tagTone.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tagTone.mjs","names":[],"sources":["../../../src/Table/core/tagTone.ts"],"sourcesContent":["/**\n * SuperAd Table light-theme status and tag text/background pairs.\n *\n * Names are kept for API compatibility, but the rendered palette follows the\n * Tailwind / SuperAd status colors used by the Figma table design.\n */\nexport const TABLE_TAG_TONES = {\n  amber: { bg: '#FFF7ED', color: '#EA580C' },\n  blue: { bg: '#EFF6FF', color: '#1F5EFF' },\n  bronze: { bg: '#F5F5F4', color: '#78716C' },\n  brown: { bg: '#F5F5F4', color: '#78716C' },\n  crimson: { bg: '#FFF1F2', color: '#E11D48' },\n  cyan: { bg: '#ECFEFF', color: '#0891B2' },\n  gold: { bg: '#FEFCE8', color: '#CA8A04' },\n  grass: { bg: '#F7FEE7', color: '#65A30D' },\n  gray: { bg: '#FFFFFF', border: '#E4E4E7', color: '#52525B' },\n  green: { bg: '#F0FDF4', color: '#16A34A' },\n  iris: { bg: '#EEF2FF', color: '#4F46E5' },\n  jade: { bg: '#ECFDF5', color: '#059669' },\n  lime: { bg: '#F7FEE7', color: '#65A30D' },\n  mint: { bg: '#F0FDFA', color: '#0D9488' },\n  orange: { bg: '#FFF7ED', color: '#EA580C' },\n  pink: { bg: '#FDF2F8', color: '#DB2777' },\n  plum: { bg: '#FAF5FF', color: '#9333EA' },\n  purple: { bg: '#FAF5FF', color: '#9333EA' },\n  red: { bg: '#FEF2F2', color: '#DC2626' },\n  ruby: { bg: '#FFF1F2', color: '#E11D48' },\n  sky: { bg: '#F0F9FF', color: '#0284C7' },\n  tomato: { bg: '#FEF2F2', color: '#DC2626' },\n  turquoise: { bg: '#F0FDFA', color: '#0D9488' },\n  violet: { bg: '#F5F3FF', color: '#7C3AED' },\n  yellow: { bg: '#FEFCE8', color: '#CA8A04' },\n} as const;\n\nexport type TableTagColor = keyof typeof TABLE_TAG_TONES;\n\nexport interface CellTone {\n  bg: string;\n  border?: string;\n  color: string;\n}\n\nexport interface Rgb {\n  b: number;\n  g: number;\n  r: number;\n}\n\nconst TAG_TONE_LIST = Object.values(TABLE_TAG_TONES);\n\nexport const parseHex = (value: string): Rgb | undefined => {\n  const hex = value.trim().replace(/^#/, '');\n  const full =\n    hex.length === 3\n      ? hex\n          .split('')\n          .map((part) => part + part)\n          .join('')\n      : hex;\n  if (!/^[\\da-fA-F]{6}$/.test(full)) return undefined;\n  return {\n    b: Number.parseInt(full.slice(4, 6), 16),\n    g: Number.parseInt(full.slice(2, 4), 16),\n    r: Number.parseInt(full.slice(0, 2), 16),\n  };\n};\n\nconst withAlpha = (color: string, alpha: number): string => {\n  const rgb = parseHex(color);\n  return rgb ? `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha})` : color;\n};\n\n/** WCAG 2.x 相对亮度。 */\nexport const relativeLuminance = ({ b, g, r }: Rgb): number => {\n  const channel = (value: number): number => {\n    const ratio = value / 255;\n    return ratio <= 0.03928 ? ratio / 12.92 : ((ratio + 0.055) / 1.055) ** 2.4;\n  };\n  return 0.2126 * channel(r) + 0.7152 * channel(g) + 0.0722 * channel(b);\n};\n\n/** WCAG 2.x 对比度，1:1 – 21:1。 */\nexport const contrastRatio = (a: Rgb, b: Rgb): number => {\n  const first = relativeLuminance(a);\n  const second = relativeLuminance(b);\n  const lighter = Math.max(first, second);\n  const darker = Math.min(first, second);\n  return (lighter + 0.05) / (darker + 0.05);\n};\n\n/** 把半透明色叠在底色上，得到实际看到的颜色。 */\nexport const compositeOver = (color: Rgb, alpha: number, base: Rgb): Rgb => ({\n  b: alpha * color.b + (1 - alpha) * base.b,\n  g: alpha * color.g + (1 - alpha) * base.g,\n  r: alpha * color.r + (1 - alpha) * base.r,\n});\n\nconst mixWithBlack = ({ b, g, r }: Rgb, ratio: number): Rgb => ({\n  b: b * (1 - ratio),\n  g: g * (1 - ratio),\n  r: r * (1 - ratio),\n});\n\n/**\n * 把前景色往**背景的反方向**调，直到对比度达到 AA 正文门槛：暗底提亮、亮底压暗。\n *\n * 逐档试探而不是一步到位：各 tone 的起点亮度差很多，固定比例会让本来就亮的过曝、暗的仍不达标。\n * 这替代了原先「直接用调色板里的 600 级色值」的做法 —— 那套色值两边都不达标（暗底上 2.6–3.8:1，\n * 浅底上 gold 2.84、lime 2.98…），13px 的标签文字读不清。色调不变，只动明度。\n */\nconst readableOn = (backdrop: Rgb, color: Rgb): Rgb => {\n  const lighten = relativeLuminance(backdrop) < 0.5;\n  const mix = (ratio: number) =>\n    lighten ? mixWithWhite(color, ratio) : mixWithBlack(color, ratio);\n\n  for (let ratio = 0; ratio <= 1; ratio += 0.05) {\n    const candidate = mix(ratio);\n    if (contrastRatio(candidate, backdrop) >= DARK_TEXT_CONTRAST) return candidate;\n  }\n  return mix(1);\n};\n\nconst mixWithWhite = ({ b, g, r }: Rgb, ratio: number): Rgb => ({\n  b: b + (255 - b) * ratio,\n  g: g + (255 - g) * ratio,\n  r: r + (255 - r) * ratio,\n});\n\nconst toHex = ({ b, g, r }: Rgb): string =>\n  `#${[r, g, b].map((value) => Math.round(value).toString(16).padStart(2, '0')).join('')}`.toUpperCase();\n\n/** 暗色下 chip 底色/描边的透明度。 */\nexport const DARK_TONE_BG_ALPHA = 0.16;\nconst DARK_TONE_BORDER_ALPHA = 0.3;\n/** 正文文字（13px，非大字号）的 WCAG AA 门槛。 */\nexport const DARK_TEXT_CONTRAST = 4.5;\n\nconst nearestTagTone = (hex: string): CellTone | undefined => {\n  const rgb = parseHex(hex);\n  if (!rgb) return undefined;\n  let best: CellTone = TABLE_TAG_TONES.gray;\n  let bestDist = Number.POSITIVE_INFINITY;\n  for (const tone of TAG_TONE_LIST) {\n    const target = parseHex(tone.color);\n    if (!target) continue;\n    const dist = (rgb.r - target.r) ** 2 + (rgb.g - target.g) ** 2 + (rgb.b - target.b) ** 2;\n    if (dist < bestDist) {\n      best = tone;\n      bestDist = dist;\n    }\n  }\n  return best;\n};\n\n/**\n * 暗色模式下合成 chip 底色用的兜底单元格背景。调用方应传 `palette.checkboxBg`\n * （即 antd 的 `colorBgContainer`）；这里只在拿不到时用 antd 暗色的默认值。\n */\nconst DARK_BASE_BG = '#141414';\n\nexport const toneFor = (key: string, color?: string, isDark = false, baseBg?: string): CellTone => {\n  let tone: CellTone;\n\n  if (color) {\n    const named = TABLE_TAG_TONES[color.trim().toLowerCase() as TableTagColor];\n    if (named) tone = named;\n    else if (color.trim().toLowerCase() === 'transparent') {\n      tone = { bg: 'transparent', color: TABLE_TAG_TONES.gray.color };\n    } else {\n      tone = nearestTagTone(color) ?? TABLE_TAG_TONES.gray;\n    }\n  } else {\n    tone = TAG_TONE_LIST[Math.abs(hashTone(key)) % TAG_TONE_LIST.length] ?? TABLE_TAG_TONES.gray;\n  }\n\n  // `transparent` 没有底色可依据，保持原样。\n  if (tone.bg === 'transparent') return tone;\n\n  if (isDark === false) {\n    // 浅色下 chip 底色是不透明的 `tone.bg`，文字就是 `tone.color`。只压暗文字，底色不动 ——\n    // 改底色等于换一套品牌色。\n    const background = parseHex(tone.bg);\n    const foreground = parseHex(tone.color);\n    if (!background || !foreground) return tone;\n    // 本来就达标就原样返回：保住对象身份，也保住调色板里写的那个色值拼写。\n    if (contrastRatio(foreground, background) >= DARK_TEXT_CONTRAST) return tone;\n\n    return { ...tone, color: toHex(readableOn(background, foreground)) };\n  }\n\n  const rgb = parseHex(tone.color);\n  const base = parseHex(baseBg ?? DARK_BASE_BG);\n  if (!rgb || !base) return tone;\n\n  // chip 底色是 tone 色的半透明叠在单元格背景上 —— 文字要按**合成后**的底色来定，\n  // 不能按容器色或 tone 色本身算。\n  const backdrop = compositeOver(rgb, DARK_TONE_BG_ALPHA, base);\n\n  return {\n    bg: withAlpha(tone.color, DARK_TONE_BG_ALPHA),\n    border: withAlpha(tone.color, DARK_TONE_BORDER_ALPHA),\n    color: toHex(readableOn(backdrop, rgb)),\n  };\n};\n\nconst hashTone = (value: string): number => {\n  let hash = 0;\n  for (let index = 0; index < value.length; index += 1) {\n    hash = (hash * 31 + value.charCodeAt(index)) | 0;\n  }\n  return hash;\n};\n"],"mappings":"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"}

package/es/Table/core/zIndex.mjs

@@ -0,0 +1,7 @@
+//#region src/Table/core/zIndex.ts
+const Z_EDITOR = 9998;
+const Z_POPPER = 9999;
+//#endregion
+export { Z_EDITOR, Z_POPPER };
+
+//# sourceMappingURL=zIndex.mjs.map

package/es/Table/core/zIndex.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"zIndex.mjs","names":[],"sources":["../../../src/Table/core/zIndex.ts"],"sourcesContent":["/**\n * Table DOM overlay z-index scale.\n *\n * canvas draws all persistent content; DOM is only used for transient overlays\n * (editor, picker, menu, tooltip, drag indicator). Every overlay must use these\n * constants instead of ad-hoc numbers, and persistent content must never live in\n * a DOM layer above the canvas.\n */\nexport const Z_HOVER = 12;\nexport const Z_DRAG = 25;\nexport const Z_SELECTION_BAR = 30;\nexport const Z_COLUMN_SETTINGS = 35;\nexport const Z_MENU = 50;\nexport const Z_EDITOR = 9998;\nexport const Z_POPPER = 9999;\n"],"mappings":";AAaA,MAAa,WAAW;AACxB,MAAa,WAAW"}

package/es/Table/index.d.mts

@@ -0,0 +1,6 @@
+import { ColumnDefine, ColumnsDefine, DEFAULT_TABLE_COLUMN_MIN_WIDTH, ListTableConstructorOptions, TABLE_CELL_MIN_WIDTH, TABLE_HEADER_HEIGHT, TABLE_ROW_HEIGHT, TableAddress, TableCellType, TableColumn, TableColumnInput, TableHover, TableProps, TableRecord, TableSelectOption, TableSize, TableTheme, TableUser } from "./type.mjs";
+import { createTableTheme } from "./canvas/theme.mjs";
+import Table from "./react/Table.mjs";
+import { compileColumns } from "./vtable/columns.mjs";
+import { createTableOption } from "./vtable/option.mjs";
+export { type ColumnDefine, type ColumnsDefine, DEFAULT_TABLE_COLUMN_MIN_WIDTH, type ListTableConstructorOptions, TABLE_CELL_MIN_WIDTH, TABLE_HEADER_HEIGHT, TABLE_ROW_HEIGHT, type TableAddress, type TableCellType, type TableColumn, type TableColumnInput, type TableHover, type TableProps, type TableRecord, type TableSelectOption, type TableSize, type TableTheme, type TableUser, compileColumns, createTableOption, createTableTheme, Table as default };

package/es/Table/index.d.ts

@@ -0,0 +1 @@
+export * from './index.d.mts';

package/es/Table/index.js

@@ -0,0 +1 @@
+export * from './index.mjs';

package/es/Table/index.mjs

@@ -0,0 +1,6 @@
+import { createTableTheme } from "./canvas/theme.mjs";
+import { DEFAULT_TABLE_COLUMN_MIN_WIDTH, TABLE_CELL_MIN_WIDTH, TABLE_HEADER_HEIGHT, TABLE_ROW_HEIGHT } from "./type.mjs";
+import { compileColumns } from "./vtable/columns.mjs";
+import { createTableOption } from "./vtable/option.mjs";
+import Table from "./react/Table.mjs";
+export { DEFAULT_TABLE_COLUMN_MIN_WIDTH, TABLE_CELL_MIN_WIDTH, TABLE_HEADER_HEIGHT, TABLE_ROW_HEIGHT, compileColumns, createTableOption, createTableTheme, Table as default };

package/es/Table/react/Table.d.mts

@@ -0,0 +1,9 @@
+import { TableProps } from "../type.mjs";
+//#region src/Table/react/Table.d.ts
+declare const Table: {
+  ({ autoFillWidth, autoHeight, className, columns, editable, emptyText, frozenColCount, groupBy, groupTitleColors, groupTitleStyle, headerRowHeight, height, hover, onColumnOrderChange, onColumnVisibilityChange, onReady, option, records, ref, rowDrag, rowHeight, selectionActions, showColumnSettings, showHeader, showRowIndex, showRowSelection, showVerticalBorder, size, style, theme, tree, treeExpandLevel, treeIndent, width }: TableProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { Table as default };
+//# sourceMappingURL=Table.d.mts.map

package/es/Table/react/Table.mjs

@@ -0,0 +1,407 @@
+"use client";
+import common_default from "../../i18n/resources/zhCn/common.mjs";
+import { useIsClient } from "../../hooks/useIsClient.mjs";
+import { useTranslation } from "../../i18n/useTranslation.mjs";
+import { getCanvasPalette } from "../canvas/canvasPalette.mjs";
+import { formatTableMessage } from "../core/tableI18n.mjs";
+import { layoutArrayChips, layoutLinkChips, layoutTagChips, layoutUserChips, resolveUserEntries, tagDurationSuffix } from "../canvas/chipPainters.mjs";
+import { isTableReleased } from "../vtable/vtableAdapter.mjs";
+import { applyFrozenShadow, hasFrozenColumns, shouldShowFrozenShadow } from "../vtable/frozenShadow.mjs";
+import { styles } from "./style.mjs";
+import { clearCascadeSelection, isCascadeSelectionTable } from "../vtable/seriesSelection.mjs";
+import { removeChipAt } from "../vtable/interaction.mjs";
+import { TableA11yLayer } from "./a11y.mjs";
+import { TableColumnSettings } from "./TableColumnSettings.mjs";
+import { useTableCellEvents } from "./useTableCellEvents.mjs";
+import { useTableColumnSettings } from "./useTableColumnSettings.mjs";
+import { useTableEditorSync } from "./useTableEditorSync.mjs";
+import { useTableHoverHint } from "./useTableHoverHint.mjs";
+import { useTableKeyboard } from "./useTableKeyboard.mjs";
+import { useTableRenderState } from "./useTableRenderState.mjs";
+import { useTableScroll } from "./useTableScroll.mjs";
+import { useTableSelectionInfo } from "./useTableSelectionInfo.mjs";
+import { useTableVTableEvents } from "./useTableVTableEvents.mjs";
+import { cx } from "antd-style";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { ListTable } from "@visactor/react-vtable";
+import * as ReactDOM from "react-dom/client";
+//#region src/Table/react/Table.tsx
+const PencilIcon = () => /* @__PURE__ */ jsxs("svg", {
+	fill: "none",
+	height: "14",
+	viewBox: "0 0 16 16",
+	width: "14",
+	children: [/* @__PURE__ */ jsx("path", {
+		d: "M11.4 2.6a1.2 1.2 0 0 1 1.7 0l.3.3a1.2 1.2 0 0 1 0 1.7L5.8 12.2 3 13l.8-2.8L11.4 2.6Z",
+		stroke: "currentColor",
+		strokeLinejoin: "round",
+		strokeWidth: "1.4"
+	}), /* @__PURE__ */ jsx("path", {
+		d: "m10.2 3.8 2 2",
+		stroke: "currentColor",
+		strokeLinecap: "round",
+		strokeWidth: "1.4"
+	})]
+});
+/**
+* chip 上那颗移除 ×。用内联 SVG 而不是 `×` 字符：字符在 10px 下笔画细到发虚，与 antd
+* `Tag closable` 的关闭图标对不上。`@ant-design/icons` 不在依赖里（见 `editors/base.tsx` 里
+* 同款说明），一律内联。
+*/
+const CloseIcon = () => /* @__PURE__ */ jsx("svg", {
+	fill: "none",
+	height: "10",
+	viewBox: "0 0 10 10",
+	width: "10",
+	children: /* @__PURE__ */ jsx("path", {
+		d: "M1.6 1.6 8.4 8.4M8.4 1.6 1.6 8.4",
+		stroke: "currentColor",
+		strokeLinecap: "round",
+		strokeWidth: "1.2"
+	})
+});
+/**
+* 这一格该按哪套 chip 排布。**必须与 painter 的分派逐条对应**（`vtable/columns.ts` 里 tag 与
+* select 共用 `createTagLayout`，这里也得让它们共用一套），否则浮层的 × 会落在错误的位置上。
+* 没有 chip 的格返回空数组。
+*/
+const layoutCellChips = (define, value, record, geometry) => {
+	const { paddingX, width } = geometry;
+	const packWidth = Math.max(width - 28, 1);
+	switch (define.superadKind) {
+		case "array": return layoutArrayChips({
+			paddingX,
+			value,
+			width: packWidth
+		}).boxes;
+		case "link": return layoutLinkChips({
+			kind: define.superadLinkKind ?? "link",
+			paddingX,
+			value,
+			width: packWidth
+		}).boxes;
+		case "select":
+		case "tag": {
+			const { width: suffixWidth } = tagDurationSuffix(record, define.superadDuration);
+			return layoutTagChips({
+				options: define.superadOptions,
+				paddingX,
+				reserve: suffixWidth,
+				value,
+				width: packWidth
+			}).boxes;
+		}
+		case "user": return layoutUserChips({
+			paddingX,
+			users: resolveUserEntries(value),
+			width: packWidth
+		}).boxes;
+		default: return [];
+	}
+};
+const Table = ({ autoFillWidth = true, autoHeight = true, className, columns, editable, emptyText, frozenColCount, groupBy, groupTitleColors, groupTitleStyle, headerRowHeight, height, hover, onColumnOrderChange, onColumnVisibilityChange, onReady, option, records, ref, rowDrag, rowHeight, selectionActions, showColumnSettings = true, showHeader, showRowIndex = false, showRowSelection = true, showVerticalBorder = false, size = "middle", style, theme, tree, treeExpandLevel, treeIndent, width = "100%" }) => {
+	const isClient = useIsClient();
+	const { t } = useTranslation(common_default);
+	const rootRef = useRef(null);
+	const tableRef = useRef(null);
+	const tableCleanupRef = useRef(void 0);
+	const [box, setBox] = useState({
+		height: 0,
+		width: 0
+	});
+	const [a11yVersion, setA11yVersion] = useState(0);
+	/**
+	* 用户折叠 / 展开之后，引擎实测的内容高度。null = 还没折叠过，容器高度按数据算。
+	* 写入点在 `useTableVTableEvents` 的 `onHierarchyChange`，消费点在 `useTableRenderState`。
+	*/
+	const [measuredContentHeight, setMeasuredContentHeight] = useState(null);
+	const [resizeGuide, setResizeGuide] = useState(null);
+	const [selectionVersion, setSelectionVersion] = useState(0);
+	const { applyHint, hint, hintAtCell, setHint } = useTableHoverHint({
+		box,
+		isClient,
+		rootRef,
+		tableRef
+	});
+	const { scheduleEditorSync, syncEditorPosition } = useTableEditorSync({ tableRef });
+	/**
+	* 悬停在哪一枚 chip 上。存的是**这一格 hint 的对象身份**，不是 `col:row`：
+	* `applyHint` 用 `sameEditHint` 保证「同一格内指针不动」时引用不变，而离开这一格再回来会拿到
+	* 新对象。拿字符串比的话，回来时新格子同号的那枚会直接亮着 × —— 可指针其实没进过它。
+	*/
+	const [hoveredChip, setHoveredChip] = useState(null);
+	/**
+	* 删 chip 只写记录 + 重绘画布，React 这边什么都不知道 —— 而 chip 位置是渲染时现算的，
+	* 不推一帧就还是删之前那几枚（按钮盖在谁身上、`aria-label` 念的是谁，两边对不上）。
+	* 这个计数**只用来推帧**，不参与任何计算。
+	*/
+	const [, refreshChipBoxes] = useState(0);
+	/**
+	* 可移除的 chip 格（人员、标签 / 单选、数组、链接）悬停时，要在**画布已经画出来的** chip 上
+	* 盖一个 ×（悬停哪枚哪枚才显示），所以位置必须和 painter 用同一个 layout 函数算 —— 两边各算
+	* 一遍就会错位（画布的文本宽度是自算的，量不到同一份）。
+	*
+	* 这里**故意不 memo**：位置依赖记录里的值，而「在同一格里删掉一枚 chip」不会让 `hint` 变，
+	* 缓存下来的就是删之前那几枚 chip —— 按钮盖在谁身上、`aria-label` 念的是谁，两边对不上。
+	* 代价是每次重渲染重算一遍纯算术（只有悬停在可编辑格上时才跑）。
+	*/
+	const chipCell = (() => {
+		const table = tableRef.current;
+		if (hint == null || table == null || isTableReleased(table)) return null;
+		const define = table.getBodyColumnDefine(hint.col, hint.row);
+		if (typeof define?.field !== "string") return null;
+		const record = table.getCellOriginRecord(hint.col, hint.row);
+		if (record == null) return null;
+		const boxes = layoutCellChips(define, record[define.field], record, {
+			paddingX: getCanvasPalette(table).paddingX,
+			width: hint.width
+		});
+		return boxes.length > 0 ? {
+			boxes,
+			kind: define.superadKind
+		} : null;
+	})();
+	const chipBoxes = chipCell?.boxes ?? null;
+	const chipCompact = chipCell != null && chipCell.kind !== "user";
+	const hoveredChipIndex = hoveredChip != null && hoveredChip.hint === hint ? hoveredChip.index : null;
+	const { columnEntries, columnSettingsOpen, columnSettingsRef, hiddenFields, moveColumn, orderedEntries, setColumnSettingsOpen, toggleColumnVisibility, visibleColumns } = useTableColumnSettings({
+		columns,
+		onColumnOrderChange,
+		onColumnVisibilityChange
+	});
+	const { mergedOption, rootStyle, stickyGroupBackground, token } = useTableRenderState({
+		autoFillWidth,
+		autoHeight,
+		columns: visibleColumns,
+		editable,
+		emptyText,
+		frozenColCount,
+		groupBy,
+		groupTitleColors,
+		groupTitleStyle,
+		headerRowHeight,
+		height,
+		hover,
+		measuredContentHeight,
+		option,
+		records,
+		rowDrag,
+		rowHeight,
+		showHeader,
+		showRowIndex,
+		showRowSelection,
+		showVerticalBorder,
+		size,
+		style,
+		tableRef,
+		theme,
+		tree,
+		treeExpandLevel,
+		treeIndent,
+		width
+	});
+	useEffect(() => {
+		applyHint(null);
+		setMeasuredContentHeight(null);
+	}, [applyHint, mergedOption]);
+	useEffect(() => () => {
+		const instance = tableRef.current;
+		if (instance != null && isTableReleased(instance) === false) instance.cancelEditCell?.();
+		tableCleanupRef.current?.();
+		tableCleanupRef.current = void 0;
+	}, []);
+	useEffect(() => {
+		const node = rootRef.current;
+		if (!node) return;
+		const update = () => setBox({
+			height: node.clientHeight,
+			width: node.clientWidth
+		});
+		update();
+		const observer = new ResizeObserver(update);
+		observer.observe(node);
+		return () => observer.disconnect();
+	}, []);
+	const selectedRowsInfo = useTableSelectionInfo({
+		selectionActions,
+		selectionVersion,
+		tableRef
+	});
+	const clearSelection = () => {
+		const table = tableRef.current;
+		if (table == null || isTableReleased(table)) return;
+		table.clearSelected?.();
+		if (isCascadeSelectionTable(table)) clearCascadeSelection(table);
+		setSelectionVersion((version) => version + 1);
+	};
+	const syncFrozenColumnShadow = () => {
+		const table = tableRef.current;
+		if (table == null || hasFrozenColumns(table) === false) return;
+		applyFrozenShadow(table, shouldShowFrozenShadow(table));
+	};
+	const handleScroll = useTableScroll({
+		rootRef,
+		setA11yVersion,
+		setHint,
+		syncEditorPosition,
+		syncFrozenColumnShadow,
+		tableRef
+	});
+	const lastRowSeriesHoverRef = useRef(null);
+	const { onClickCell, onMouseEnterCell, onMouseMoveCell } = useTableCellEvents({
+		applyHint,
+		hintAtCell,
+		lastRowSeriesHoverRef,
+		tableRef
+	});
+	const { onReady: handleReady } = useTableVTableEvents({
+		lastRowSeriesHoverRef,
+		onReady,
+		rootRef,
+		scheduleEditorSync,
+		setA11yVersion,
+		setMeasuredContentHeight,
+		setResizeGuide,
+		setSelectionVersion,
+		stickyGroupBackground,
+		syncFrozenColumnShadow,
+		tableCleanupRef,
+		tableRef,
+		token
+	});
+	const handleKeyDown = useTableKeyboard({
+		columnSettingsRef,
+		tableRef
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx(styles.root, className),
+		"data-superad-table": "",
+		ref: rootRef,
+		style: rootStyle,
+		onKeyDownCapture: handleKeyDown,
+		children: [
+			isClient && box.width > 0 && box.height > 0 ? /* @__PURE__ */ jsx(ListTable, {
+				ReactDOM,
+				height: box.height,
+				option: mergedOption,
+				ref,
+				width: box.width,
+				onClickCell,
+				onMouseEnterCell,
+				onMouseMoveCell,
+				onReady: handleReady,
+				onScroll: handleScroll
+			}) : null,
+			isClient && tableRef.current ? /* @__PURE__ */ jsx(TableA11yLayer, {
+				table: tableRef.current,
+				version: a11yVersion
+			}) : null,
+			showColumnSettings && showHeader !== false && columnEntries.length > 0 ? /* @__PURE__ */ jsx(TableColumnSettings, {
+				columnEntries,
+				columnSettingsOpen,
+				columnSettingsRef,
+				hiddenFields,
+				moveColumn,
+				orderedEntries,
+				setColumnSettingsOpen,
+				t,
+				onToggleVisibility: toggleColumnVisibility
+			}) : null,
+			selectedRowsInfo.count > 0 ? /* @__PURE__ */ jsxs("div", {
+				className: styles.selectionBar,
+				"data-superad-selection-bar": "",
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: styles.selectionBarLabel,
+						children: formatTableMessage(t("table.selectedRows"), { count: selectedRowsInfo.count.toLocaleString() })
+					}),
+					selectionActions?.(selectedRowsInfo.rows, clearSelection),
+					/* @__PURE__ */ jsx("button", {
+						className: styles.selectionBarButton,
+						type: "button",
+						onClick: clearSelection,
+						children: t("table.clearSelection")
+					})
+				]
+			}) : null,
+			resizeGuide != null ? /* @__PURE__ */ jsx("div", {
+				className: styles.resizeGuide,
+				style: { left: resizeGuide }
+			}) : null,
+			hint ? /* @__PURE__ */ jsxs("div", {
+				className: styles.hoverFrame,
+				"data-superad-edit-hint": "",
+				style: {
+					height: hint.height,
+					left: hint.left,
+					top: hint.top,
+					width: hint.width
+				},
+				children: [/* @__PURE__ */ jsx("button", {
+					"aria-label": t("common.edit"),
+					className: styles.editButton,
+					type: "button",
+					onClick: (event) => {
+						event.preventDefault();
+						event.stopPropagation();
+						const table = tableRef.current;
+						if (!table) return;
+						table.startEditCell(hint.col, hint.row);
+						scheduleEditorSync();
+						applyHint(null);
+					},
+					onMouseDown: (event) => {
+						event.preventDefault();
+						event.stopPropagation();
+					},
+					children: /* @__PURE__ */ jsx(PencilIcon, {})
+				}), chipBoxes?.map((chip) => {
+					const hovered = hoveredChipIndex === chip.index;
+					return /* @__PURE__ */ jsx("span", {
+						className: styles.chipHover,
+						style: {
+							left: chip.x,
+							width: chip.width
+						},
+						onMouseEnter: () => setHoveredChip({
+							hint,
+							index: chip.index
+						}),
+						onClick: (event) => {
+							if (hovered) return;
+							event.preventDefault();
+							event.stopPropagation();
+							const table = tableRef.current;
+							if (table == null || isTableReleased(table)) return;
+							table.startEditCell(hint.col, hint.row);
+							scheduleEditorSync();
+							applyHint(null);
+						},
+						onMouseLeave: () => setHoveredChip((prev) => prev?.index === chip.index ? null : prev),
+						children: hovered ? /* @__PURE__ */ jsx("button", {
+							"aria-label": formatTableMessage(t("table.remove"), { label: chip.label }),
+							className: cx(styles.chipRemove, chipCompact && styles.chipRemoveCompact),
+							type: "button",
+							onMouseDown: (event) => event.stopPropagation(),
+							onClick: (event) => {
+								event.preventDefault();
+								event.stopPropagation();
+								const table = tableRef.current;
+								if (table == null || isTableReleased(table)) return;
+								removeChipAt(table, hint.col, hint.row, chip.index);
+								refreshChipBoxes((version) => version + 1);
+							},
+							children: /* @__PURE__ */ jsx(CloseIcon, {})
+						}) : null
+					}, chip.index);
+				})]
+			}) : null
+		]
+	});
+};
+Table.displayName = "SuperadTable";
+//#endregion
+export { Table as default };
+
+//# sourceMappingURL=Table.mjs.map

package/es/Table/react/Table.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.mjs","names":["zhCommon"],"sources":["../../../src/Table/react/Table.tsx"],"sourcesContent":["'use client';\n\nimport { ListTable } from '@visactor/react-vtable';\nimport type { ColumnDefine, ListTable as ListTableInstance } from '@visactor/vtable';\nimport { cx } from 'antd-style';\nimport { useEffect, useRef, useState } from 'react';\nimport * as ReactDOM from 'react-dom/client';\n\nimport { useIsClient } from '@/hooks/useIsClient';\nimport zhCommon from '@/i18n/resources/zhCn/common';\nimport { useTranslation } from '@/i18n/useTranslation';\n\nimport { getCanvasPalette } from '../canvas/canvasPalette';\nimport {\n  type ChipBox,\n  layoutArrayChips,\n  layoutLinkChips,\n  layoutTagChips,\n  layoutUserChips,\n  resolveUserEntries,\n  tagDurationSuffix,\n} from '../canvas/chipPainters';\nimport { EDIT_HINT_GUTTER } from '../canvas/paintUtils';\nimport { formatTableMessage } from '../core/tableI18n';\nimport type { TableProps } from '../type';\nimport type { SuperAdCellMarkers } from '../vtable/columns';\nimport {\n  applyFrozenShadow,\n  type FrozenShadowTable,\n  hasFrozenColumns,\n  shouldShowFrozenShadow,\n} from '../vtable/frozenShadow';\nimport { type CellEditHint, removeChipAt } from '../vtable/interaction';\nimport { clearCascadeSelection, isCascadeSelectionTable } from '../vtable/seriesSelection';\nimport { isTableReleased } from '../vtable/vtableAdapter';\nimport { TableA11yLayer } from './a11y';\nimport { styles } from './style';\nimport { TableColumnSettings } from './TableColumnSettings';\nimport { useTableCellEvents } from './useTableCellEvents';\nimport { useTableColumnSettings } from './useTableColumnSettings';\nimport { useTableEditorSync } from './useTableEditorSync';\nimport { useTableHoverHint } from './useTableHoverHint';\nimport { useTableKeyboard } from './useTableKeyboard';\nimport { useTableRenderState } from './useTableRenderState';\nimport { useTableScroll } from './useTableScroll';\nimport { useTableSelectionInfo } from './useTableSelectionInfo';\nimport { useTableVTableEvents } from './useTableVTableEvents';\n\nconst PencilIcon = () => (\n  <svg fill=\"none\" height=\"14\" viewBox=\"0 0 16 16\" width=\"14\">\n    <path\n      d=\"M11.4 2.6a1.2 1.2 0 0 1 1.7 0l.3.3a1.2 1.2 0 0 1 0 1.7L5.8 12.2 3 13l.8-2.8L11.4 2.6Z\"\n      stroke=\"currentColor\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"1.4\"\n    />\n    <path d=\"m10.2 3.8 2 2\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeWidth=\"1.4\" />\n  </svg>\n);\n\n/**\n * chip 上那颗移除 ×。用内联 SVG 而不是 `×` 字符：字符在 10px 下笔画细到发虚，与 antd\n * `Tag closable` 的关闭图标对不上。`@ant-design/icons` 不在依赖里（见 `editors/base.tsx` 里\n * 同款说明），一律内联。\n */\nconst CloseIcon = () => (\n  <svg fill=\"none\" height=\"10\" viewBox=\"0 0 10 10\" width=\"10\">\n    <path\n      d=\"M1.6 1.6 8.4 8.4M8.4 1.6 1.6 8.4\"\n      stroke=\"currentColor\"\n      strokeLinecap=\"round\"\n      strokeWidth=\"1.2\"\n    />\n  </svg>\n);\n\n/**\n * 这一格该按哪套 chip 排布。**必须与 painter 的分派逐条对应**（`vtable/columns.ts` 里 tag 与\n * select 共用 `createTagLayout`，这里也得让它们共用一套），否则浮层的 × 会落在错误的位置上。\n * 没有 chip 的格返回空数组。\n */\nconst layoutCellChips = (\n  define: ColumnDefine & SuperAdCellMarkers,\n  value: unknown,\n  record: unknown,\n  geometry: { paddingX: number; width: number },\n): ChipBox[] => {\n  const { paddingX, width } = geometry;\n  // 悬停铅笔占右侧一条槽；与画布 `editHintGutterFor` 同源，否则 × / chip 会钻进铅笔底下。\n  const packWidth = Math.max(width - EDIT_HINT_GUTTER, 1);\n\n  switch (define.superadKind) {\n    case 'array': {\n      return layoutArrayChips({ paddingX, value, width: packWidth }).boxes;\n    }\n    case 'link': {\n      return layoutLinkChips({\n        kind: define.superadLinkKind ?? 'link',\n        paddingX,\n        value,\n        width: packWidth,\n      }).boxes;\n    }\n    case 'select':\n    case 'tag': {\n      // 时长标注会挤占打包预算 —— 与画布用同一份计算，否则 × 落在错误的 chip 上。\n      const { width: suffixWidth } = tagDurationSuffix(record, define.superadDuration);\n      return layoutTagChips({\n        options: define.superadOptions,\n        paddingX,\n        reserve: suffixWidth,\n        value,\n        width: packWidth,\n      }).boxes;\n    }\n    case 'user': {\n      return layoutUserChips({ paddingX, users: resolveUserEntries(value), width: packWidth })\n        .boxes;\n    }\n    default: {\n      return [];\n    }\n  }\n};\n\nconst Table = ({\n  autoFillWidth = true,\n  autoHeight = true,\n  className,\n  columns,\n  editable,\n  emptyText,\n  frozenColCount,\n  groupBy,\n  groupTitleColors,\n  groupTitleStyle,\n  headerRowHeight,\n  height,\n  hover,\n  onColumnOrderChange,\n  onColumnVisibilityChange,\n  onReady,\n  option,\n  records,\n  ref,\n  rowDrag,\n  rowHeight,\n  selectionActions,\n  showColumnSettings = true,\n  showHeader,\n  showRowIndex = false,\n  showRowSelection = true,\n  showVerticalBorder = false,\n  size = 'middle',\n  style,\n  theme,\n  tree,\n  treeExpandLevel,\n  treeIndent,\n  width = '100%',\n}: TableProps) => {\n  const isClient = useIsClient();\n  const { t } = useTranslation(zhCommon);\n  const rootRef = useRef<HTMLDivElement>(null);\n  const tableRef = useRef<ListTableInstance | null>(null);\n  const tableCleanupRef = useRef<(() => void) | undefined>(undefined);\n  const [box, setBox] = useState({ height: 0, width: 0 });\n  const [a11yVersion, setA11yVersion] = useState(0);\n  /**\n   * 用户折叠 / 展开之后，引擎实测的内容高度。null = 还没折叠过，容器高度按数据算。\n   * 写入点在 `useTableVTableEvents` 的 `onHierarchyChange`，消费点在 `useTableRenderState`。\n   */\n  const [measuredContentHeight, setMeasuredContentHeight] = useState<number | null>(null);\n  const [resizeGuide, setResizeGuide] = useState<number | null>(null);\n  const [selectionVersion, setSelectionVersion] = useState(0);\n  const { applyHint, hint, hintAtCell, setHint } = useTableHoverHint({\n    box,\n    isClient,\n    rootRef,\n    tableRef,\n  });\n  const { scheduleEditorSync, syncEditorPosition } = useTableEditorSync({ tableRef });\n  /**\n   * 悬停在哪一枚 chip 上。存的是**这一格 hint 的对象身份**，不是 `col:row`：\n   * `applyHint` 用 `sameEditHint` 保证「同一格内指针不动」时引用不变，而离开这一格再回来会拿到\n   * 新对象。拿字符串比的话，回来时新格子同号的那枚会直接亮着 × —— 可指针其实没进过它。\n   */\n  const [hoveredChip, setHoveredChip] = useState<{ hint: CellEditHint; index: number } | null>(\n    null,\n  );\n  /**\n   * 删 chip 只写记录 + 重绘画布，React 这边什么都不知道 —— 而 chip 位置是渲染时现算的，\n   * 不推一帧就还是删之前那几枚（按钮盖在谁身上、`aria-label` 念的是谁，两边对不上）。\n   * 这个计数**只用来推帧**，不参与任何计算。\n   */\n  const [, refreshChipBoxes] = useState(0);\n\n  /**\n   * 可移除的 chip 格（人员、标签 / 单选、数组、链接）悬停时，要在**画布已经画出来的** chip 上\n   * 盖一个 ×（悬停哪枚哪枚才显示），所以位置必须和 painter 用同一个 layout 函数算 —— 两边各算\n   * 一遍就会错位（画布的文本宽度是自算的，量不到同一份）。\n   *\n   * 这里**故意不 memo**：位置依赖记录里的值，而「在同一格里删掉一枚 chip」不会让 `hint` 变，\n   * 缓存下来的就是删之前那几枚 chip —— 按钮盖在谁身上、`aria-label` 念的是谁，两边对不上。\n   * 代价是每次重渲染重算一遍纯算术（只有悬停在可编辑格上时才跑）。\n   */\n  const chipCell = (() => {\n    const table = tableRef.current;\n    if (hint == null || table == null || isTableReleased(table)) return null;\n\n    const define = table.getBodyColumnDefine(hint.col, hint.row) as\n      (ColumnDefine & SuperAdCellMarkers) | undefined;\n    if (typeof define?.field !== 'string') return null;\n\n    const record = table.getCellOriginRecord(hint.col, hint.row);\n    if (record == null) return null;\n\n    const boxes = layoutCellChips(define, record[define.field], record, {\n      paddingX: getCanvasPalette(table).paddingX,\n      width: hint.width,\n    });\n\n    return boxes.length > 0 ? { boxes, kind: define.superadKind } : null;\n  })();\n\n  const chipBoxes = chipCell?.boxes ?? null;\n  // 人员 chip 的留白（USER_CHIP_TRAILING 22）放得下 14px 的 ×；其余几种的右内边距是\n  // CHIP_PAD（14），只容得下 12px 那版（见 `CHIP_REMOVE_ROOM`）。\n  const chipCompact = chipCell != null && chipCell.kind !== 'user';\n\n  const hoveredChipIndex =\n    hoveredChip != null && hoveredChip.hint === hint ? hoveredChip.index : null;\n\n  const {\n    columnEntries,\n    columnSettingsOpen,\n    columnSettingsRef,\n    hiddenFields,\n    moveColumn,\n    orderedEntries,\n    setColumnSettingsOpen,\n    toggleColumnVisibility,\n    visibleColumns,\n  } = useTableColumnSettings({ columns, onColumnOrderChange, onColumnVisibilityChange });\n  const { mergedOption, rootStyle, stickyGroupBackground, token } = useTableRenderState({\n    autoFillWidth,\n    autoHeight,\n    columns: visibleColumns,\n    editable,\n    emptyText,\n    frozenColCount,\n    groupBy,\n    groupTitleColors,\n    groupTitleStyle,\n    headerRowHeight,\n    height,\n    hover,\n    measuredContentHeight,\n    option,\n    records,\n    rowDrag,\n    rowHeight,\n    showHeader,\n    showRowIndex,\n    showRowSelection,\n    showVerticalBorder,\n    size,\n    style,\n    tableRef,\n    theme,\n    tree,\n    treeExpandLevel,\n    treeIndent,\n    width,\n  });\n\n  // 记录或列一变，悬浮框连同它带的 col/row 就过期了 —— 它只在 pointermove / scroll 时重算，\n  // 否则会停在旧的像素位置，点铅笔打开的编辑目标与用户看到的行不是同一条记录。\n  //\n  // 引擎实测的高度同样过期：`updateOption` 会让 VTable 按新 records 重排，折叠状态跟着回到数据\n  // 自带的那一份（实测：折到 12 行后 updateOption，引擎自己回到 20 行）—— 留着旧值就把上一份\n  // 布局的高度带到新数据上。清掉即退回按数据算，与引擎此刻的状态一致。\n  useEffect(() => {\n    applyHint(null);\n    /* eslint-disable-next-line @eslint-react/hooks-extra/no-direct-set-state-in-use-effect */\n    setMeasuredContentHeight(null);\n  }, [applyHint, mergedOption]);\n\n  useEffect(\n    () => () => {\n      // 表被拆掉时 VTable 的 release() 不会结束正在进行的编辑（只摘自己的监听），编辑器的\n      // document 捕获监听与 React root 就永久留着；之后任意一次外部 pointerdown 会走\n      // completeEdit() 打到已释放的表上。父组件的 cleanup 先于 <ListTable> 跑，所以这里\n      // 实例还活着，cancelEditCell 能正常收尾（走 cancelEdit → onEnd，不写值）。\n      const instance = tableRef.current as\n        (ListTableInstance & { cancelEditCell?: () => void }) | null;\n      if (instance != null && isTableReleased(instance) === false) instance.cancelEditCell?.();\n      tableCleanupRef.current?.();\n      tableCleanupRef.current = undefined;\n    },\n    [],\n  );\n\n  useEffect(() => {\n    const node = rootRef.current;\n    if (!node) return;\n    // 挂载后必须同步测一次：ResizeObserver 的首次回调要等下一帧，只靠它会让首帧按默认尺寸渲染。\n    // 这是「订阅外部系统」型的 effect，setState 是它的正常用法。\n    /* eslint-disable-next-line @eslint-react/hooks-extra/no-direct-set-state-in-use-effect */\n    const update = () => setBox({ height: node.clientHeight, width: node.clientWidth });\n    update();\n    const observer = new ResizeObserver(update);\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, []);\n\n  const selectedRowsInfo = useTableSelectionInfo({\n    selectionActions,\n    selectionVersion,\n    tableRef,\n  });\n\n  const clearSelection = () => {\n    const table = tableRef.current;\n    // `release()` 之后 `internalProps` 是 null，而 `clearSelected` 第一行就读 `table.colCount`\n    // —— 容器塌成 0×0 让表卸载之后，这条路上的按钮仍然点得到。与 useTableSelectionInfo /\n    // a11y 那几处同一句守卫。\n    if (table == null || isTableReleased(table)) return;\n\n    table.clearSelected?.();\n    if (isCascadeSelectionTable(table)) clearCascadeSelection(table);\n    setSelectionVersion((version) => version + 1);\n  };\n\n  const syncFrozenColumnShadow = () => {\n    const table = tableRef.current as FrozenShadowTable | null;\n    if (table == null || hasFrozenColumns(table) === false) return;\n\n    applyFrozenShadow(table, shouldShowFrozenShadow(table));\n  };\n\n  const handleScroll = useTableScroll({\n    rootRef,\n    setA11yVersion,\n    setHint,\n    syncEditorPosition,\n    syncFrozenColumnShadow,\n    tableRef,\n  });\n\n  const lastRowSeriesHoverRef = useRef<number | null>(null);\n  const { onClickCell, onMouseEnterCell, onMouseMoveCell } = useTableCellEvents({\n    applyHint,\n    hintAtCell,\n    lastRowSeriesHoverRef,\n    tableRef,\n  });\n  const { onReady: handleReady } = useTableVTableEvents({\n    lastRowSeriesHoverRef,\n    onReady,\n    rootRef,\n    scheduleEditorSync,\n    setA11yVersion,\n    setMeasuredContentHeight,\n    setResizeGuide,\n    setSelectionVersion,\n    stickyGroupBackground,\n    syncFrozenColumnShadow,\n    tableCleanupRef,\n    tableRef,\n    token,\n  });\n\n  const handleKeyDown = useTableKeyboard({ columnSettingsRef, tableRef });\n\n  return (\n    <div\n      className={cx(styles.root, className)}\n      data-superad-table=\"\"\n      ref={rootRef}\n      style={rootStyle}\n      onKeyDownCapture={handleKeyDown}\n    >\n      {isClient && box.width > 0 && box.height > 0 ? (\n        <ListTable\n          ReactDOM={ReactDOM}\n          height={box.height}\n          option={mergedOption}\n          ref={ref}\n          width={box.width}\n          onClickCell={onClickCell}\n          onMouseEnterCell={onMouseEnterCell}\n          onMouseMoveCell={onMouseMoveCell}\n          onReady={handleReady}\n          onScroll={handleScroll}\n        />\n      ) : null}\n      {isClient && tableRef.current ? (\n        <TableA11yLayer table={tableRef.current} version={a11yVersion} />\n      ) : null}\n      {showColumnSettings && showHeader !== false && columnEntries.length > 0 ? (\n        <TableColumnSettings\n          columnEntries={columnEntries}\n          columnSettingsOpen={columnSettingsOpen}\n          columnSettingsRef={columnSettingsRef}\n          hiddenFields={hiddenFields}\n          moveColumn={moveColumn}\n          orderedEntries={orderedEntries}\n          setColumnSettingsOpen={setColumnSettingsOpen}\n          t={t}\n          onToggleVisibility={toggleColumnVisibility}\n        />\n      ) : null}\n      {selectedRowsInfo.count > 0 ? (\n        <div className={styles.selectionBar} data-superad-selection-bar=\"\">\n          <span className={styles.selectionBarLabel}>\n            {formatTableMessage(t('table.selectedRows'), {\n              count: selectedRowsInfo.count.toLocaleString(),\n            })}\n          </span>\n          {selectionActions?.(selectedRowsInfo.rows, clearSelection)}\n          <button className={styles.selectionBarButton} type=\"button\" onClick={clearSelection}>\n            {t('table.clearSelection')}\n          </button>\n        </div>\n      ) : null}\n      {resizeGuide != null ? (\n        <div className={styles.resizeGuide} style={{ left: resizeGuide }} />\n      ) : null}\n      {hint ? (\n        <div\n          className={styles.hoverFrame}\n          data-superad-edit-hint=\"\"\n          style={{ height: hint.height, left: hint.left, top: hint.top, width: hint.width }}\n        >\n          <button\n            aria-label={t('common.edit')}\n            className={styles.editButton}\n            type=\"button\"\n            onClick={(event) => {\n              event.preventDefault();\n              event.stopPropagation();\n              const table = tableRef.current;\n              if (!table) return;\n              table.startEditCell(hint.col, hint.row);\n              scheduleEditorSync();\n              applyHint(null);\n            }}\n            onMouseDown={(event) => {\n              event.preventDefault();\n              event.stopPropagation();\n            }}\n          >\n            <PencilIcon />\n          </button>\n          {chipBoxes?.map((chip) => {\n            const hovered = hoveredChipIndex === chip.index;\n\n            return (\n              <span\n                className={styles.chipHover}\n                key={chip.index}\n                style={{ left: chip.x, width: chip.width }}\n                onMouseEnter={() => setHoveredChip({ hint, index: chip.index })}\n                onClick={(event) => {\n                  // 点 chip 本身 = 点单元格，照常进编辑 —— 这层浮层盖在画布上，不转发的话\n                  // 「点人名改这一格」会忽然失灵。点在 × 上时不进编辑（按钮自己会拦）。\n                  if (hovered) return;\n                  event.preventDefault();\n                  event.stopPropagation();\n                  const table = tableRef.current;\n                  if (table == null || isTableReleased(table)) return;\n                  table.startEditCell(hint.col, hint.row);\n                  scheduleEditorSync();\n                  applyHint(null);\n                }}\n                onMouseLeave={() =>\n                  setHoveredChip((prev) => (prev?.index === chip.index ? null : prev))\n                }\n              >\n                {hovered ? (\n                  <button\n                    aria-label={formatTableMessage(t('table.remove'), { label: chip.label })}\n                    className={cx(styles.chipRemove, chipCompact && styles.chipRemoveCompact)}\n                    type=\"button\"\n                    onMouseDown={(event) => event.stopPropagation()}\n                    onClick={(event) => {\n                      event.preventDefault();\n                      event.stopPropagation();\n                      const table = tableRef.current;\n                      if (table == null || isTableReleased(table)) return;\n                      // **不清 hoveredChip**：删掉之后后面的 chip 会顶到这一格，指针底下正好换成\n                      // 下一枚的 × —— 与浏览器里删 tag 的观感一致（连着点就是连着删）。\n                      removeChipAt(table, hint.col, hint.row, chip.index);\n                      refreshChipBoxes((version) => version + 1);\n                    }}\n                  >\n                    <CloseIcon />\n                  </button>\n                ) : null}\n              </span>\n            );\n          })}\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nTable.displayName = 'SuperadTable';\n\nexport default Table;\n"],"mappings":"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"}

package/es/Table/react/TableColumnSettings.mjs

@@ -0,0 +1,65 @@
+"use client";
+import { formatTableMessage } from "../core/tableI18n.mjs";
+import { styles } from "./style.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/Table/react/TableColumnSettings.tsx
+const TableColumnSettings = ({ columnEntries, columnSettingsOpen, columnSettingsRef, hiddenFields, moveColumn, onToggleVisibility, orderedEntries, setColumnSettingsOpen, t }) => {
+	const visibleCount = columnEntries.length - hiddenFields.length;
+	return /* @__PURE__ */ jsxs("div", {
+		className: styles.columnSettings,
+		ref: columnSettingsRef,
+		children: [/* @__PURE__ */ jsx("button", {
+			"aria-expanded": columnSettingsOpen,
+			"aria-label": t("table.fieldSettings"),
+			className: styles.columnSettingsTrigger,
+			type: "button",
+			onClick: () => setColumnSettingsOpen((open) => open === false),
+			children: "⋯"
+		}), columnSettingsOpen ? /* @__PURE__ */ jsx("div", {
+			className: styles.columnSettingsMenu,
+			"data-superad-column-settings": "",
+			children: orderedEntries.map((entry, index) => {
+				const hidden = hiddenFields.includes(entry.field);
+				return /* @__PURE__ */ jsxs("div", {
+					className: styles.columnSettingsItem,
+					children: [
+						/* @__PURE__ */ jsx("button", {
+							"aria-pressed": hidden === false,
+							className: styles.columnSettingsCheck,
+							"data-checked": hidden ? "false" : "true",
+							disabled: hidden === false && visibleCount <= 1,
+							type: "button",
+							"aria-label": formatTableMessage(t(hidden ? "table.showColumn" : "table.hideColumn"), { title: entry.title }),
+							onClick: () => onToggleVisibility(entry.field),
+							children: hidden ? "" : "✓"
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: styles.columnSettingsLabel,
+							children: entry.title
+						}),
+						/* @__PURE__ */ jsx("button", {
+							"aria-label": t("table.moveLeft"),
+							className: styles.columnSettingsMove,
+							disabled: index === 0,
+							type: "button",
+							onClick: () => moveColumn(entry.field, -1),
+							children: "‹"
+						}),
+						/* @__PURE__ */ jsx("button", {
+							"aria-label": t("table.moveRight"),
+							className: styles.columnSettingsMove,
+							disabled: index === orderedEntries.length - 1,
+							type: "button",
+							onClick: () => moveColumn(entry.field, 1),
+							children: "›"
+						})
+					]
+				}, entry.field);
+			})
+		}) : null]
+	});
+};
+//#endregion
+export { TableColumnSettings };
+
+//# sourceMappingURL=TableColumnSettings.mjs.map

package/es/Table/react/TableColumnSettings.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableColumnSettings.mjs","names":[],"sources":["../../../src/Table/react/TableColumnSettings.tsx"],"sourcesContent":["'use client';\n\nimport type { RefObject } from 'react';\n\nimport type { TranslationKey } from '@/i18n/types';\n\nimport { formatTableMessage } from '../core/tableI18n';\nimport { styles } from './style';\n\nexport interface TableColumnSettingEntry {\n  field: string;\n  title: string;\n}\n\nexport const TableColumnSettings = ({\n  columnEntries,\n  columnSettingsOpen,\n  columnSettingsRef,\n  hiddenFields,\n  moveColumn,\n  onToggleVisibility,\n  orderedEntries,\n  setColumnSettingsOpen,\n  t,\n}: {\n  columnEntries: TableColumnSettingEntry[];\n  columnSettingsOpen: boolean;\n  columnSettingsRef: RefObject<HTMLDivElement | null>;\n  hiddenFields: string[];\n  moveColumn: (field: string, direction: -1 | 1) => void;\n  onToggleVisibility: (field: string) => void;\n  orderedEntries: TableColumnSettingEntry[];\n  setColumnSettingsOpen: (updater: (open: boolean) => boolean) => void;\n  t: (key: TranslationKey) => string;\n}) => {\n  const visibleCount = columnEntries.length - hiddenFields.length;\n\n  return (\n    <div className={styles.columnSettings} ref={columnSettingsRef}>\n      <button\n        aria-expanded={columnSettingsOpen}\n        aria-label={t('table.fieldSettings')}\n        className={styles.columnSettingsTrigger}\n        type=\"button\"\n        onClick={() => setColumnSettingsOpen((open) => open === false)}\n      >\n        ⋯\n      </button>\n      {columnSettingsOpen ? (\n        <div className={styles.columnSettingsMenu} data-superad-column-settings=\"\">\n          {orderedEntries.map((entry, index) => {\n            const hidden = hiddenFields.includes(entry.field);\n\n            return (\n              <div className={styles.columnSettingsItem} key={entry.field}>\n                <button\n                  aria-pressed={hidden === false}\n                  className={styles.columnSettingsCheck}\n                  data-checked={hidden ? 'false' : 'true'}\n                  disabled={hidden === false && visibleCount <= 1}\n                  type=\"button\"\n                  aria-label={formatTableMessage(\n                    t(hidden ? 'table.showColumn' : 'table.hideColumn'),\n                    { title: entry.title },\n                  )}\n                  onClick={() => onToggleVisibility(entry.field)}\n                >\n                  {hidden ? '' : '✓'}\n                </button>\n                <span className={styles.columnSettingsLabel}>{entry.title}</span>\n                <button\n                  aria-label={t('table.moveLeft')}\n                  className={styles.columnSettingsMove}\n                  disabled={index === 0}\n                  type=\"button\"\n                  onClick={() => moveColumn(entry.field, -1)}\n                >\n                  ‹\n                </button>\n                <button\n                  aria-label={t('table.moveRight')}\n                  className={styles.columnSettingsMove}\n                  disabled={index === orderedEntries.length - 1}\n                  type=\"button\"\n                  onClick={() => moveColumn(entry.field, 1)}\n                >\n                  ›\n                </button>\n              </div>\n            );\n          })}\n        </div>\n      ) : null}\n    </div>\n  );\n};\n"],"mappings":";;;;;AAcA,MAAa,uBAAuB,EAClC,eACA,oBACA,mBACA,cACA,YACA,oBACA,gBACA,uBACA,QAWI;CACJ,MAAM,eAAe,cAAc,SAAS,aAAa;CAEzD,OACE,qBAAC,OAAD;EAAK,WAAW,OAAO;EAAgB,KAAK;EAA5C,UAAA,CACE,oBAAC,UAAD;GACE,iBAAe;GACf,cAAY,EAAE,qBAAqB;GACnC,WAAW,OAAO;GAClB,MAAK;GACL,eAAe,uBAAuB,SAAS,SAAS,KAAK;GAC9D,UAAA;EAEO,CAAA,GACP,qBACC,oBAAC,OAAD;GAAK,WAAW,OAAO;GAAoB,gCAA6B;GACrE,UAAA,eAAe,KAAK,OAAO,UAAU;IACpC,MAAM,SAAS,aAAa,SAAS,MAAM,KAAK;IAEhD,OACE,qBAAC,OAAD;KAAK,WAAW,OAAO;KAAvB,UAAA;MACE,oBAAC,UAAD;OACE,gBAAc,WAAW;OACzB,WAAW,OAAO;OAClB,gBAAc,SAAS,UAAU;OACjC,UAAU,WAAW,SAAS,gBAAgB;OAC9C,MAAK;OACL,cAAY,mBACV,EAAE,SAAS,qBAAqB,kBAAkB,GAClD,EAAE,OAAO,MAAM,MAAM,CACvB;OACA,eAAe,mBAAmB,MAAM,KAAK;OAE5C,UAAA,SAAS,KAAK;MACT,CAAA;MACR,oBAAC,QAAD;OAAM,WAAW,OAAO;OAAsB,UAAA,MAAM;MAAY,CAAA;MAChE,oBAAC,UAAD;OACE,cAAY,EAAE,gBAAgB;OAC9B,WAAW,OAAO;OAClB,UAAU,UAAU;OACpB,MAAK;OACL,eAAe,WAAW,MAAM,OAAO,EAAE;OAC1C,UAAA;MAEO,CAAA;MACR,oBAAC,UAAD;OACE,cAAY,EAAE,iBAAiB;OAC/B,WAAW,OAAO;OAClB,UAAU,UAAU,eAAe,SAAS;OAC5C,MAAK;OACL,eAAe,WAAW,MAAM,OAAO,CAAC;OACzC,UAAA;MAEO,CAAA;KACL;IAlC2C,GAAA,MAAM,KAkCjD;GAET,CAAC;EACE,CAAA,IACH,IACD;;AAET"}