kokotable 0.95.0

package/dist/mui/src/content/cellRenderers.d.ts

@@ -0,0 +1,71 @@
+import type { MouseEvent, ReactNode } from "react";
+import type { Cell, Column, RowData, Table } from "@tanstack/react-table";
+import { type CellRenderProps, type ColumnDataType, type ColumnMeta, type Registry } from "../../../core/src/index";
+import type { AggregationDef, ExportFormatterDef } from "../../../core/src/index";
+/**
+ * 셀 렌더러 레지스트리 — 설계 문서 4절.
+ *
+ * 해석 순서(`renderCellValue`):
+ * 1. 컬럼 `cell`(코어 포맷터·`setCell`) 결과가 `ctx.renderedValue` 로 들어온다 — 항상 먼저.
+ * 2. 값이 비었고 `meta.placeholder` 가 있으면 `placeholder` 정의 → 끝.
+ * 3. `when(ctx)` 가 참인 정의 중 `order` 오름차순(같으면 등록 순) 첫 것 → 없으면 `id === meta.dataType` 이고 `when` 이 없는 정의
+ *    → 없으면 `renderedValue` 그대로.
+ * 4. `meta.chip` 이면 `chip` 정의가, `meta.link` 면 `link` 정의가 3 의 결과를 `renderedValue` 로 받아 감싼다.
+ *
+ * `link`·`chip`·`placeholder` 는 **장식 슬롯**이다 — 컬럼 meta 플래그가 있을 때 id 로 찾으므로 `when` 없이 등록한다.
+ * 내장 세트도 같은 API 로 정의돼 있다(dogfooding). Provider 의 예전 `cellRenderers` 맵도 `toCellRendererDefs` 로 같은 모양이 된다.
+ */
+export type CellRendererId = ColumnDataType | "link" | "chip" | "placeholder" | (string & {});
+/** 렌더러가 받는 것 — 코어 `CellRenderProps` 에 인스턴스·메타를 더한 것 */
+export interface CellContext<T extends RowData = any> extends CellRenderProps<T> {
+    cell: Cell<T, unknown>;
+    column: Column<T, unknown>;
+    table: Table<T>;
+    meta?: ColumnMeta;
+    /** `link` 슬롯에만 — `meta.link.to()` 결과 */
+    href?: string;
+    /** `link` 슬롯에만 — `TableContent onNavigate` (SPA 라우터 연결). 없으면 일반 `<a href>` */
+    onNavigate?: (href: string, row: T, event: MouseEvent<HTMLAnchorElement>) => void;
+}
+export interface CellRendererDef<T extends RowData = any> {
+    id: CellRendererId;
+    /** 이 정의를 어느 셀에 쓸지 — 있으면 dataType 일치보다 먼저 본다 */
+    when?: (ctx: CellContext<T>) => boolean;
+    render: (ctx: CellContext<T>) => ReactNode;
+    /** `when` 정의끼리의 우선순위 — 작을수록 먼저 (미지정 = 등록 순서) */
+    order?: number;
+}
+/** 정의 헬퍼 — `T` 를 고정해 `ctx.row` 가 좁혀진다 */
+export declare function defineCellRenderer<T extends RowData = any>(def: CellRendererDef<T>): CellRendererDef<T>;
+export declare function isEmptyCellValue(value: unknown): boolean;
+export declare const BUILTIN_CELL_RENDERERS: readonly CellRendererDef[];
+/** 전역 기본 레지스트리 — `cellRenderers.register(def)` 로 앱 전체에 추가한다 */
+export declare const cellRenderers: Registry<CellRendererDef>;
+/** Provider 의 예전 맵(`{ number: fn, link: fn }`) → 정의 배열 */
+export declare function toCellRendererDefs(map: Partial<Record<string, (ctx: CellContext) => ReactNode>> | undefined): CellRendererDef[];
+/**
+ * 값 렌더러 해석 — `when` 이 참인 것 중 order 순 첫 것 → `id === dataType`(when 없음) → undefined.
+ * 장식 슬롯(`link`·`chip`·`placeholder`)은 `when` 이 없으므로 여기서 걸리지 않는다.
+ */
+export declare function resolveCellRenderer<T extends RowData>(ctx: CellContext<T>, registry?: Registry<CellRendererDef>): CellRendererDef | undefined;
+/** Provider 가 내려주는 레지스트리 묶음 (헤더 에이전트의 `KokoTableConfig.registries` 와 같은 모양) */
+export interface KokoRegistries {
+    cells?: Registry<CellRendererDef>;
+    aggregations?: Registry<AggregationDef>;
+    exportFormatters?: Registry<ExportFormatterDef>;
+}
+/** `useKokoTableConfig().registries` — Provider 가 아직 자리를 안 만들었으면 빈 객체 */
+export declare function registriesOf(config: unknown): KokoRegistries;
+/**
+ * Provider 레지스트리(덮어쓴 항목만 들어 있다)를 내장 기본 세트 위에 얹는다 — 같은 id 는 Provider 가 이긴다.
+ * Provider 가 비어 있으면 기본 세트 그대로. 같은 (기본, Provider) 조합은 같은 객체를 돌려줘 `useMemo` 의존성으로 쓸 수 있다.
+ * 내장 항목을 **빼려면** 전역 레지스트리에서 `with({ remove })` 한 것을 컴포넌트 `registry` prop / `useGrouping({ aggregations })` 에 직접 넘긴다.
+ */
+export declare function layerRegistry<Def extends {
+    id: string;
+}>(defaults: Registry<Def>, overlay: Registry<Def> | undefined): Registry<Def>;
+/**
+ * 현재 Provider 의 셀 렌더러 레지스트리 — 내장 기본 세트 위에 `registries.cells`(Provider `cellRenderers` 배열/레지스트리) 를 얹고,
+ * 그 위에 예전 `cellRenderers` 맵을 얹은 것(컬럼 `cell` → Provider → 기본).
+ */
+export declare function useCellRenderers(): Registry<CellRendererDef>;

package/dist/mui/src/content/cellRenderers.js

@@ -0,0 +1,127 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Chip, Link } from "@mui/material";
+import { createRegistry, toRegistry, } from "../../../core/src/index";
+import { useKokoTableConfig } from "../provider/KokoTableProvider";
+/** 정의 헬퍼 — `T` 를 고정해 `ctx.row` 가 좁혀진다 */
+export function defineCellRenderer(def) {
+    return def;
+}
+export function isEmptyCellValue(value) {
+    return value === null || value === undefined || value === "";
+}
+// ─────────────────────────────────────────────────────────────
+// 내장 세트 — 같은 API 로 등록한다
+// ─────────────────────────────────────────────────────────────
+/** dataType 렌더러의 기본은 통과 — 값 포맷은 코어 `formatByDataType` 이 이미 `renderedValue` 에 넣었다 */
+const passthrough = (ctx) => ctx.renderedValue;
+export const BUILTIN_CELL_RENDERERS = [
+    defineCellRenderer({ id: "number", render: passthrough }),
+    defineCellRenderer({ id: "date", render: passthrough }),
+    defineCellRenderer({ id: "datetime", render: passthrough }),
+    defineCellRenderer({ id: "boolean", render: passthrough }),
+    defineCellRenderer({ id: "enum", render: passthrough }),
+    defineCellRenderer({ id: "select", render: passthrough }),
+    defineCellRenderer({ id: "text", render: passthrough }),
+    defineCellRenderer({
+        id: "placeholder",
+        render: (ctx) => _jsx(Box, { component: "span", sx: { color: "text.disabled" }, children: ctx.renderedValue }),
+    }),
+    defineCellRenderer({
+        id: "chip",
+        render: (ctx) => _jsx(Chip, { size: "small", variant: "outlined", label: ctx.renderedValue, sx: { maxWidth: "100%" } }),
+    }),
+    defineCellRenderer({
+        id: "link",
+        render: (ctx) => {
+            const { href, onNavigate, row } = ctx;
+            return (_jsx(Link, { href: href, underline: "hover", onClick: (event) => {
+                    // 행 클릭(선택·상세) 으로 번지지 않게 한다
+                    event.stopPropagation();
+                    if (onNavigate && href !== undefined) {
+                        event.preventDefault();
+                        onNavigate(href, row, event);
+                    }
+                }, children: ctx.renderedValue }));
+        },
+    }),
+];
+/** 전역 기본 레지스트리 — `cellRenderers.register(def)` 로 앱 전체에 추가한다 */
+export const cellRenderers = createRegistry([...BUILTIN_CELL_RENDERERS]);
+/** Provider 의 예전 맵(`{ number: fn, link: fn }`) → 정의 배열 */
+export function toCellRendererDefs(map) {
+    if (!map)
+        return [];
+    const defs = [];
+    for (const [id, render] of Object.entries(map))
+        if (render)
+            defs.push({ id, render });
+    return defs;
+}
+/**
+ * 값 렌더러 해석 — `when` 이 참인 것 중 order 순 첫 것 → `id === dataType`(when 없음) → undefined.
+ * 장식 슬롯(`link`·`chip`·`placeholder`)은 `when` 이 없으므로 여기서 걸리지 않는다.
+ */
+export function resolveCellRenderer(ctx, registry = cellRenderers) {
+    const defs = registry.list();
+    let best;
+    defs.forEach((def, index) => {
+        if (!def.when || !def.when(ctx))
+            return;
+        const order = def.order ?? Number.MAX_SAFE_INTEGER;
+        if (!best || order < best.order || (order === best.order && index < best.index))
+            best = { def, order, index };
+    });
+    if (best)
+        return best.def;
+    const dataType = ctx.meta?.dataType;
+    if (dataType) {
+        const byType = defs.find((def) => def.id === dataType && !def.when);
+        if (byType)
+            return byType;
+    }
+    return undefined;
+}
+/** `useKokoTableConfig().registries` — Provider 가 아직 자리를 안 만들었으면 빈 객체 */
+export function registriesOf(config) {
+    const registries = config?.registries;
+    return registries ?? {};
+}
+const layered = new WeakMap();
+/**
+ * Provider 레지스트리(덮어쓴 항목만 들어 있다)를 내장 기본 세트 위에 얹는다 — 같은 id 는 Provider 가 이긴다.
+ * Provider 가 비어 있으면 기본 세트 그대로. 같은 (기본, Provider) 조합은 같은 객체를 돌려줘 `useMemo` 의존성으로 쓸 수 있다.
+ * 내장 항목을 **빼려면** 전역 레지스트리에서 `with({ remove })` 한 것을 컴포넌트 `registry` prop / `useGrouping({ aggregations })` 에 직접 넘긴다.
+ */
+export function layerRegistry(defaults, overlay) {
+    if (!overlay)
+        return defaults;
+    const entries = overlay.list();
+    if (entries.length === 0)
+        return defaults;
+    let byDefaults = layered.get(overlay);
+    if (!byDefaults)
+        layered.set(overlay, (byDefaults = new WeakMap()));
+    let result = byDefaults.get(defaults);
+    if (!result) {
+        result = defaults.with({ add: entries });
+        byDefaults.set(defaults, result);
+    }
+    return result;
+}
+/**
+ * 현재 Provider 의 셀 렌더러 레지스트리 — 내장 기본 세트 위에 `registries.cells`(Provider `cellRenderers` 배열/레지스트리) 를 얹고,
+ * 그 위에 예전 `cellRenderers` 맵을 얹은 것(컬럼 `cell` → Provider → 기본).
+ */
+export function useCellRenderers() {
+    const config = useKokoTableConfig();
+    const base = layerRegistry(cellRenderers, registriesOf(config).cells);
+    const map = config.cellRenderers;
+    if (!map || Object.keys(map).length === 0)
+        return base;
+    let legacy = legacyRegistries.get(map);
+    if (!legacy)
+        legacyRegistries.set(map, (legacy = toRegistry(toCellRendererDefs(map))));
+    return layerRegistry(base, legacy);
+}
+/** 예전 맵 객체 → 레지스트리 (같은 맵이면 같은 객체) */
+const legacyRegistries = new WeakMap();

package/dist/mui/src/content/cellValue.d.ts

@@ -0,0 +1,27 @@
+import type { MouseEvent, ReactNode } from "react";
+import { type Cell, type RowData } from "@tanstack/react-table";
+import { type Registry } from "../../../core/src/index";
+import type { KokoCellRenderers } from "../provider/KokoTableProvider";
+import { type CellRendererDef } from "./cellRenderers";
+export interface CellValueOptions<T extends RowData> {
+    /**
+     * 링크 셀 클릭. 주면 `<a href>` 기본 이동을 막고 이 콜백을 부른다(SPA 라우터 연결 자리).
+     * 없으면 일반 `<a href>` 로 동작한다 — 렌더러는 라우터를 모른다.
+     */
+    onNavigate?: (href: string, row: T, event: MouseEvent<HTMLAnchorElement>) => void;
+    /**
+     * Provider 의 `cellRenderers` — 예전 맵(dataType 별 / `link` / `chip` / `placeholder`)이든
+     * 정의 배열·레지스트리든 받는다. 맵·배열은 `registry` 위에 같은 id 로 얹힌다.
+     */
+    renderers?: KokoCellRenderers | CellRendererDef[] | Registry<CellRendererDef>;
+    /** 셀 렌더러 레지스트리 — 미지정 시 전역 기본. `useCellRenderers()` 결과를 넣는다 */
+    registry?: Registry<CellRendererDef>;
+}
+/**
+ * 셀 값 렌더 — 셀 렌더러 레지스트리(`content/cellRenderers.tsx`)로 해석한다.
+ *
+ * 우선순위: 컬럼 `cell`(코어 포맷터·`setCell`) 결과가 `renderedValue` → 빈 값 + `meta.placeholder` 는 `placeholder` 슬롯
+ * → `when` 이 참인 정의(order 순) → `id === dataType` 정의 → 그대로 → `meta.chip` 이면 `chip` 슬롯, `meta.link` 면 `link` 슬롯이 감싼다.
+ * 컬럼이 자기 `cell` 을 선언했으면 그 결과가 항상 `renderedValue` 로 들어온다 — 렌더러가 무시하지 않는 한 살아 있다.
+ */
+export declare function renderCellValue<T extends RowData>(cell: Cell<T, unknown>, options?: CellValueOptions<T>): ReactNode;

package/dist/mui/src/content/cellValue.js

@@ -0,0 +1,82 @@
+import { flexRender } from "@tanstack/react-table";
+import { columnMetaOf, isRegistry, toRegistry } from "../../../core/src/index";
+import { cellRenderers as defaultCellRenderers, isEmptyCellValue, resolveCellRenderer, toCellRendererDefs, } from "./cellRenderers";
+/** `renderers` 맵 + 레지스트리 조합을 셀마다 다시 만들지 않게 잡아 둔다 */
+const combined = new WeakMap();
+function effectiveRegistry(options) {
+    const base = options.registry ?? defaultCellRenderers;
+    const given = options.renderers;
+    if (!given)
+        return base;
+    if (isRegistry(given))
+        return given;
+    if (Array.isArray(given) ? given.length === 0 : Object.keys(given).length === 0)
+        return base;
+    let byBase = combined.get(given);
+    if (!byBase)
+        combined.set(given, (byBase = new WeakMap()));
+    let result = byBase.get(base);
+    if (!result) {
+        const defs = Array.isArray(given)
+            ? given
+            : toCellRendererDefs(given);
+        result = toRegistry(defs, base.list());
+        byBase.set(base, result);
+    }
+    return result;
+}
+/**
+ * 셀 값 렌더 — 셀 렌더러 레지스트리(`content/cellRenderers.tsx`)로 해석한다.
+ *
+ * 우선순위: 컬럼 `cell`(코어 포맷터·`setCell`) 결과가 `renderedValue` → 빈 값 + `meta.placeholder` 는 `placeholder` 슬롯
+ * → `when` 이 참인 정의(order 순) → `id === dataType` 정의 → 그대로 → `meta.chip` 이면 `chip` 슬롯, `meta.link` 면 `link` 슬롯이 감싼다.
+ * 컬럼이 자기 `cell` 을 선언했으면 그 결과가 항상 `renderedValue` 로 들어온다 — 렌더러가 무시하지 않는 한 살아 있다.
+ */
+export function renderCellValue(cell, options = {}) {
+    const meta = columnMetaOf(cell.column.columnDef);
+    const value = cell.getValue();
+    const registry = effectiveRegistry(options);
+    let content = flexRender(cell.column.columnDef.cell, cell.getContext());
+    const ctxOf = (renderedValue, href) => ({
+        value,
+        row: cell.row.original,
+        rowIndex: cell.row.index,
+        columnId: cell.column.id,
+        renderedValue,
+        cell,
+        column: cell.column,
+        table: cell.getContext().table,
+        meta,
+        href,
+        onNavigate: options.onNavigate,
+    });
+    if (isEmptyCellValue(value)) {
+        if (meta?.placeholder !== undefined) {
+            const placeholder = registry.get("placeholder");
+            return placeholder ? placeholder.render(ctxOf(meta.placeholder)) : meta.placeholder;
+        }
+        return content;
+    }
+    const renderer = resolveCellRenderer(ctxOf(content), registry);
+    if (renderer)
+        content = renderer.render(ctxOf(content));
+    if (meta?.chip) {
+        const chip = registry.get("chip");
+        if (chip)
+            content = chip.render(ctxOf(content));
+    }
+    if (meta?.link) {
+        const row = cell.row;
+        const href = meta.link.to({
+            value,
+            row: row.original,
+            rowIndex: row.index,
+            columnId: cell.column.id,
+            renderedValue: content,
+        });
+        const link = registry.get("link");
+        if (link)
+            content = link.render(ctxOf(content, href));
+    }
+    return content;
+}

package/dist/mui/src/content/columnOrder.d.ts

@@ -0,0 +1,7 @@
+import type { RowData, Table } from "@tanstack/react-table";
+/**
+ * 인접한 **보이는** 컬럼과 자리를 바꾼다. 숨겨진 컬럼을 건너뛰지 않으면
+ * "이동했는데 화면이 그대로" 가 된다.
+ */
+export declare function moveColumn<T extends RowData>(table: Table<T>, columnId: string, direction: "left" | "right"): void;
+export declare function canMoveColumn<T extends RowData>(table: Table<T>, columnId: string, direction: "left" | "right"): boolean;

package/dist/mui/src/content/columnOrder.js

@@ -0,0 +1,48 @@
+import { isDisplayColumnId } from "../columns/displayColumns";
+/** 현재 유효한 컬럼 순서 — `columnOrder` 상태가 비어 있으면 정의 순서다 */
+function effectiveOrder(table) {
+    const state = table.getState().columnOrder;
+    const all = table.getAllLeafColumns().map((column) => column.id);
+    if (!state || state.length === 0)
+        return all;
+    // 상태에 없는(나중에 추가된) 컬럼은 뒤에 붙인다 — TanStack 의 orderColumns 와 같은 규칙
+    const rest = all.filter((id) => !state.includes(id));
+    return [...state.filter((id) => all.includes(id)), ...rest];
+}
+/**
+ * 인접한 **보이는** 컬럼과 자리를 바꾼다. 숨겨진 컬럼을 건너뛰지 않으면
+ * "이동했는데 화면이 그대로" 가 된다.
+ */
+export function moveColumn(table, columnId, direction) {
+    const order = effectiveOrder(table);
+    const from = order.indexOf(columnId);
+    if (from < 0)
+        return;
+    const step = direction === "left" ? -1 : 1;
+    let to = from + step;
+    while (to >= 0 && to < order.length) {
+        const candidate = table.getColumn(order[to]);
+        if (candidate?.getIsVisible() && !isDisplayColumnId(candidate.id))
+            break;
+        to += step;
+    }
+    if (to < 0 || to >= order.length)
+        return;
+    const next = [...order];
+    next.splice(from, 1);
+    next.splice(to, 0, columnId);
+    table.setColumnOrder(next);
+}
+export function canMoveColumn(table, columnId, direction) {
+    const order = effectiveOrder(table);
+    const from = order.indexOf(columnId);
+    if (from < 0)
+        return false;
+    const step = direction === "left" ? -1 : 1;
+    for (let i = from + step; i >= 0 && i < order.length; i += step) {
+        const candidate = table.getColumn(order[i]);
+        if (candidate?.getIsVisible() && !isDisplayColumnId(candidate.id))
+            return true;
+    }
+    return false;
+}

package/dist/mui/src/content/density.d.ts

@@ -0,0 +1,13 @@
+/** 행 밀도 — 프리셋의 `density` 값이 그대로 들어온다 */
+export type Density = "compact" | "comfortable" | "spacious";
+export interface DensitySpec {
+    size: "small" | "medium";
+    /** 본문 셀 세로 여백(theme spacing 단위). undefined 면 MUI 기본 */
+    cellPy?: number;
+    cellPx?: number;
+}
+/**
+ * `density` 가 있으면 그것을, 없으면 `dense` 를 본다.
+ * compact = small + 여백 축소, comfortable = small, spacious = medium.
+ */
+export declare function resolveDensity(density: Density | undefined, dense: boolean): DensitySpec;

package/dist/mui/src/content/density.js

@@ -0,0 +1,12 @@
+/**
+ * `density` 가 있으면 그것을, 없으면 `dense` 를 본다.
+ * compact = small + 여백 축소, comfortable = small, spacious = medium.
+ */
+export function resolveDensity(density, dense) {
+    switch (density) {
+        case "compact": return { size: "small", cellPy: 0.25, cellPx: 1 };
+        case "comfortable": return { size: "small" };
+        case "spacious": return { size: "medium" };
+        default: return { size: dense ? "small" : "medium" };
+    }
+}

package/dist/mui/src/content/menuItems.d.ts

@@ -0,0 +1,118 @@
+import type { AggregationSpec } from "../../../core/src/index";
+import type { ReactNode } from "react";
+import { type PopoverPosition } from "@mui/material";
+import type { Column, Header, Row, RowData, Table } from "@tanstack/react-table";
+import type { SortSource } from "../../../core/src/index";
+import type { KokoTableLabels } from "../provider/labels";
+import type { Registry } from "../registry";
+import type { HeaderContext, HeaderDef } from "../headers/types";
+import { type ColumnMenuCtx, type ColumnMenuItemDef } from "../menus/columnMenu";
+import { type GroupRowCtx, type RowMenuCtx, type RowMenuItemDef } from "../menus/rowMenu";
+/**
+ * 메뉴 항목 하나 — 데이터다. 컬럼 메뉴·행 컨텍스트 메뉴가 같은 모양을 쓴다.
+ * `divider: true` 면 항목이 아니라 구분선이다 (연속·앞뒤 구분선은 그릴 때 합쳐진다).
+ *
+ * 레지스트리(`MenuItemDef`)가 해석된 결과가 이 모양이다 — `columnMenuItems`/`rowMenuItems` prop 은
+ * 이 배열(`defaultItems`)을 받아 마지막으로 손본다.
+ */
+export interface MenuItemSpec<Ctx> {
+    key: string;
+    label?: ReactNode | ((ctx: Ctx) => ReactNode);
+    icon?: ReactNode;
+    onClick?: (ctx: Ctx) => void;
+    disabled?: boolean | ((ctx: Ctx) => boolean);
+    hidden?: boolean | ((ctx: Ctx) => boolean);
+    divider?: boolean;
+}
+/**
+ * `ColumnMenu` 가 받는 최소 컨텍스트 (기존 prop 계약). 레지스트리 항목은 이것을 `ColumnMenuCtx` 로 넓힌 것을 받는다.
+ * `header`·`labels` 는 없으면 테이블에서 찾는다/기본값을 쓴다.
+ */
+export interface ColumnMenuContext<T extends RowData = any> {
+    column: Column<T, unknown>;
+    table: Table<T>;
+    sort?: SortSource;
+    /** 현재 그룹 기준 — `TableContent grouping` prop 또는 `table.getState().grouping` */
+    grouping: string[];
+    /** 있을 때만 "그룹 기준 추가/제거" 항목이 생긴다 */
+    onGroupingChange?: (grouping: string[]) => void;
+    /** 있을 때만 "필터 열기" 항목이 생긴다 */
+    openFilter?: () => void;
+    /** 그룹핑 중 집계 함수 토글 — 둘 다 있을 때만 "집계" 항목이 생긴다 */
+    aggregation?: AggregationSpec;
+    onAggregationChange?: (next: AggregationSpec) => void;
+    header?: Header<T, unknown>;
+    copy?: (text: string) => void;
+}
+export type ColumnMenuItem<T extends RowData = any> = MenuItemSpec<ColumnMenuContext<T>>;
+/** `columnMenuItems` prop 의 인자 — 기본 항목을 받아 추가·제거·재배열한 배열을 돌려준다 */
+export interface ColumnMenuItemsContext<T extends RowData = any> extends ColumnMenuContext<T> {
+    defaultItems: Array<ColumnMenuItem<T>>;
+}
+export type ColumnMenuItemsFn<T extends RowData = any> = (ctx: ColumnMenuItemsContext<T>) => Array<ColumnMenuItem<T>>;
+/** `HeaderContext` — 헤더 셀과 메뉴가 같은 모양으로 만든다 */
+export declare function createHeaderContext<T extends RowData>(input: {
+    header: Header<T, unknown>;
+    column: Column<T, unknown>;
+    table: Table<T>;
+    sort?: SortSource;
+    labels: KokoTableLabels;
+}): HeaderContext<T>;
+/**
+ * 기존 컨텍스트 → 레지스트리 항목이 받는 `ColumnMenuCtx`.
+ * 헤더 정의의 `rules` 를 여기서도 해석한다 — 헤더 셀 없이 `ColumnMenu` 만 써도 규칙이 같게.
+ */
+export declare function createColumnMenuCtx<T extends RowData>(ctx: ColumnMenuContext<T>, labels: KokoTableLabels, headers?: ReadonlyArray<HeaderDef<T>>): ColumnMenuCtx<T>;
+/**
+ * 기본 컬럼 메뉴 항목 — 레지스트리(`registry` 미지정 시 내장 세트)를 해석한 결과.
+ * 정렬 / 고정 / 이동 / 숨기기 / 그룹 기준(콜백 있을 때) / 필터 열기(콜백 있을 때) / 너비 초기화(리사이즈 켜져 있을 때) / 헤더 복사.
+ * 조건에 맞지 않는 항목은 아예 넣지 않는다 (`hidden` 이 아니라).
+ */
+export declare function defaultColumnMenuItems<T extends RowData>(ctx: ColumnMenuContext<T>, labels: KokoTableLabels, registry?: Registry<ColumnMenuItemDef<any>>, headers?: ReadonlyArray<HeaderDef<T>>): Array<ColumnMenuItem<T>>;
+/** `rowMenuItems` prop 이 받는 것 — 레지스트리 ctx 에 기본 항목을 더한 것 */
+export interface RowMenuContext<T extends RowData = any> extends RowMenuCtx<T> {
+    /** 레지스트리를 해석한 기본 항목 (말단: 행 복사 / 그룹: 펼치기·접기·N단계까지 펼치기) */
+    defaultItems: Array<RowMenuItem<T>>;
+}
+export type RowMenuItem<T extends RowData = any> = MenuItemSpec<RowMenuContext<T>>;
+export type RowMenuItemsFn<T extends RowData = any> = (ctx: RowMenuContext<T>) => Array<RowMenuItem<T>>;
+export type { GroupRowCtx };
+/** 기존 컨텍스트(`copy`·`labels` 없을 수 있음) → 레지스트리 항목이 받는 `RowMenuCtx` */
+export declare function createRowMenuCtx<T extends RowData>(ctx: {
+    row?: Row<T>;
+    table: Table<T>;
+    group?: GroupRowCtx<T>;
+    copy?: (text: string) => void;
+}, labels: KokoTableLabels): RowMenuCtx<T>;
+/** 기본 행 메뉴 항목 — 레지스트리(`registry` 미지정 시 내장 세트)를 해석한 결과 */
+export declare function defaultRowMenuItems<T extends RowData>(ctx: {
+    row?: Row<T>;
+    table: Table<T>;
+    group?: GroupRowCtx<T>;
+    copy?: (text: string) => void;
+}, labels: KokoTableLabels, registry?: Registry<RowMenuItemDef<any>>): Array<RowMenuItem<T>>;
+/** ERP `GroupRowContextMenu` 대응 — 그룹 행의 기본 항목만 (말단 행이면 빈 배열). `defaultRowMenuItems` 의 하위 호환 */
+export declare function defaultGroupRowMenuItems<T extends RowData>(ctx: {
+    row?: Row<T>;
+    table: Table<T>;
+    group?: GroupRowCtx<T>;
+}, labels: KokoTableLabels, registry?: Registry<RowMenuItemDef<any>>): Array<RowMenuItem<T>>;
+/** 보이는 항목만 남기고, 앞·뒤·연속 구분선을 합친다 */
+export declare function visibleMenuItems<Ctx>(items: Array<MenuItemSpec<Ctx>>, ctx: Ctx): Array<MenuItemSpec<Ctx>>;
+export interface MenuItemListProps<Ctx> {
+    items: Array<MenuItemSpec<Ctx>>;
+    ctx: Ctx;
+    /** 항목을 누른 뒤 (메뉴 닫기) */
+    onPick?: () => void;
+}
+/** 항목 배열 → `MenuItem`/`Divider`. `Menu` 안에 놓는다 */
+export declare function MenuItemList<Ctx>({ items, ctx, onPick }: MenuItemListProps<Ctx>): import("react").JSX.Element;
+export interface ContextMenuProps<Ctx> {
+    /** 커서 위치. null 이면 닫힘 */
+    position: PopoverPosition | null;
+    items: Array<MenuItemSpec<Ctx>>;
+    ctx: Ctx;
+    onClose: () => void;
+}
+/** 커서 위치에 뜨는 메뉴 — 헤더·행 우클릭이 쓴다 */
+export declare function ContextMenu<Ctx>({ position, items, ctx, onClose }: ContextMenuProps<Ctx>): import("react").JSX.Element;

package/dist/mui/src/content/menuItems.js

@@ -0,0 +1,128 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Divider, ListItemIcon, ListItemText, Menu, MenuItem } from "@mui/material";
+import { applyHeaderRules, resolveHeaderDef } from "../headers/defineHeader";
+import { defaultHeader, headerRegistry } from "../headers/defaultHeader";
+import { columnMenuRegistry } from "../menus/columnMenu";
+import { rowMenuRegistry } from "../menus/rowMenu";
+import { menuSpecsFrom } from "../menus/resolve";
+import { copyToClipboard } from "../menus/copy";
+/**
+ * 레지스트리 ctx 로 해석된 항목을 다른 ctx 의 `MenuItemSpec` 으로 — 라벨·disabled 는 값으로 굳히고,
+ * 콜백은 레지스트리 ctx 를 닫아 둔다 (`MenuItemList` 가 넘기는 ctx 와 무관하게 동작한다).
+ */
+function narrowSpecs(specs, ctx) {
+    return specs.map((spec) => ({
+        key: spec.key,
+        divider: spec.divider,
+        icon: spec.icon,
+        label: typeof spec.label === "function" ? spec.label(ctx) : spec.label,
+        disabled: typeof spec.disabled === "function" ? spec.disabled(ctx) : spec.disabled,
+        hidden: typeof spec.hidden === "function" ? spec.hidden(ctx) : spec.hidden,
+        onClick: spec.onClick ? () => spec.onClick(ctx) : undefined,
+    }));
+}
+function leafHeaderOf(table, column) {
+    const found = table.getLeafHeaders().find((header) => header.column.id === column.id)
+        ?? table.getFlatHeaders().find((header) => header.column.id === column.id);
+    if (found)
+        return found;
+    // 헤더 그룹이 아직 없을 때(테스트·단독 사용) — 컬럼만으로 최소 헤더를 흉내낸다
+    return {
+        id: column.id, column, colSpan: 1, rowSpan: 1, depth: 0, index: 0, isPlaceholder: false,
+        placeholderId: undefined, subHeaders: [], headerGroup: undefined,
+        getContext: () => ({ table, header: undefined, column }),
+        getLeafHeaders: () => [], getSize: () => column.getSize(), getStart: () => 0, getResizeHandler: () => () => { },
+    };
+}
+/** `HeaderContext` — 헤더 셀과 메뉴가 같은 모양으로 만든다 */
+export function createHeaderContext(input) {
+    const { header, column, table, sort, labels } = input;
+    const sortState = sort?.getColumnSort(column.id) ?? null;
+    const multiSortIndex = sortState && sort && sort.getSort().length > 1 ? sortState.index + 1 : null;
+    return { header, column, table, sort, labels, sortState, multiSortIndex };
+}
+/**
+ * 기존 컨텍스트 → 레지스트리 항목이 받는 `ColumnMenuCtx`.
+ * 헤더 정의의 `rules` 를 여기서도 해석한다 — 헤더 셀 없이 `ColumnMenu` 만 써도 규칙이 같게.
+ */
+export function createColumnMenuCtx(ctx, labels, headers = []) {
+    const header = ctx.header ?? leafHeaderOf(ctx.table, ctx.column);
+    const base = createHeaderContext({ header, column: ctx.column, table: ctx.table, sort: ctx.sort, labels });
+    const def = resolveHeaderDef(base, headers, headerRegistry, defaultHeader);
+    const can = applyHeaderRules(base, def);
+    return {
+        ...base,
+        kind: "column",
+        can,
+        grouping: ctx.grouping,
+        setGrouping: ctx.onGroupingChange,
+        openFilter: ctx.openFilter,
+        aggregation: ctx.aggregation,
+        setAggregation: ctx.onAggregationChange,
+        copy: ctx.copy ?? copyToClipboard,
+    };
+}
+/**
+ * 기본 컬럼 메뉴 항목 — 레지스트리(`registry` 미지정 시 내장 세트)를 해석한 결과.
+ * 정렬 / 고정 / 이동 / 숨기기 / 그룹 기준(콜백 있을 때) / 필터 열기(콜백 있을 때) / 너비 초기화(리사이즈 켜져 있을 때) / 헤더 복사.
+ * 조건에 맞지 않는 항목은 아예 넣지 않는다 (`hidden` 이 아니라).
+ */
+export function defaultColumnMenuItems(ctx, labels, registry = columnMenuRegistry, headers = []) {
+    const menuCtx = createColumnMenuCtx(ctx, labels, headers);
+    return narrowSpecs(menuSpecsFrom(registry.list(), menuCtx), menuCtx);
+}
+/** 기존 컨텍스트(`copy`·`labels` 없을 수 있음) → 레지스트리 항목이 받는 `RowMenuCtx` */
+export function createRowMenuCtx(ctx, labels) {
+    return { kind: "row", row: ctx.row, table: ctx.table, group: ctx.group, labels, copy: ctx.copy ?? copyToClipboard };
+}
+/** 기본 행 메뉴 항목 — 레지스트리(`registry` 미지정 시 내장 세트)를 해석한 결과 */
+export function defaultRowMenuItems(ctx, labels, registry = rowMenuRegistry) {
+    const menuCtx = createRowMenuCtx(ctx, labels);
+    return menuSpecsFrom(registry.list(), menuCtx).map((spec) => ({
+        ...spec,
+        onClick: spec.onClick ? () => spec.onClick(menuCtx) : undefined,
+    }));
+}
+/** ERP `GroupRowContextMenu` 대응 — 그룹 행의 기본 항목만 (말단 행이면 빈 배열). `defaultRowMenuItems` 의 하위 호환 */
+export function defaultGroupRowMenuItems(ctx, labels, registry = rowMenuRegistry) {
+    if (!ctx.group)
+        return [];
+    return defaultRowMenuItems({ table: ctx.table, group: ctx.group }, labels, registry);
+}
+// ── 그리기 ──
+function resolve(value, ctx) {
+    return typeof value === "function" ? value(ctx) : value;
+}
+/** 보이는 항목만 남기고, 앞·뒤·연속 구분선을 합친다 */
+export function visibleMenuItems(items, ctx) {
+    const out = [];
+    for (const item of items) {
+        if (resolve(item.hidden, ctx))
+            continue;
+        if (item.divider) {
+            if (out.length === 0 || out[out.length - 1].divider)
+                continue;
+            out.push(item);
+        }
+        else {
+            out.push(item);
+        }
+    }
+    while (out.length > 0 && out[out.length - 1].divider)
+        out.pop();
+    return out;
+}
+/** 항목 배열 → `MenuItem`/`Divider`. `Menu` 안에 놓는다 */
+export function MenuItemList({ items, ctx, onPick }) {
+    return (_jsx(_Fragment, { children: visibleMenuItems(items, ctx).map((item) => item.divider
+            ? _jsx(Divider, {}, item.key)
+            : (_jsxs(MenuItem, { dense: true, "data-menu-key": item.key, disabled: !!resolve(item.disabled, ctx), onClick: (event) => {
+                    event.stopPropagation();
+                    item.onClick?.(ctx);
+                    onPick?.();
+                }, children: [item.icon && _jsx(ListItemIcon, { children: item.icon }), _jsx(ListItemText, { primary: resolve(item.label, ctx) })] }, item.key))) }));
+}
+/** 커서 위치에 뜨는 메뉴 — 헤더·행 우클릭이 쓴다 */
+export function ContextMenu({ position, items, ctx, onClose }) {
+    return (_jsx(Menu, { open: !!position, onClose: onClose, anchorReference: "anchorPosition", anchorPosition: position ?? undefined, onClick: (event) => event.stopPropagation(), onContextMenu: (event) => { event.preventDefault(); event.stopPropagation(); }, slotProps: { paper: { sx: { minWidth: 180 } } }, children: _jsx(MenuItemList, { items: items, ctx: ctx, onPick: onClose }) }));
+}