kokotable 0.95.0

package/dist/mui/src/pagination/PaginationArea.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MenuItem, Pagination, Stack, TextField, Typography } from "@mui/material";
+import { toPaginationSource } from "../../../core/src/index";
+import { useKokoTableConfig } from "../provider/KokoTableProvider";
+/**
+ * 페이지네이션 구역.
+ *
+ * `PaginationSource` 만 요구하므로 테이블 인스턴스가 없어도 붙는다 —
+ * 카드 화면에서는 `paginationSource(search, data)` 를 넘긴다.
+ */
+export function PaginationArea({ source, pageSizeOptions: pageSizeOptionsProp, showTotal = true, }) {
+    const { defaults } = useKokoTableConfig();
+    const pageSizeOptions = pageSizeOptionsProp ?? defaults.pageSizeOptions;
+    const pagination = toPaginationSource(source);
+    const { pageIndex, pageSize, total, pageCount } = pagination.getPagination();
+    // 선택지에 없는 크기(프리셋 복원 등)도 드롭다운에 보여야 사용자가 현재 값을 안다
+    const sizes = pageSizeOptions.includes(pageSize)
+        ? pageSizeOptions
+        : [...pageSizeOptions, pageSize].sort((a, b) => a - b);
+    const from = total === 0 ? 0 : pageIndex * pageSize + 1;
+    const to = Math.min((pageIndex + 1) * pageSize, total);
+    return (_jsxs(Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", spacing: 2, sx: { py: 1, flexWrap: "wrap", gap: 1 }, children: [showTotal && (_jsx(Typography, { variant: "body2", color: "text.secondary", children: total === 0 ? "0건" : `${from.toLocaleString("ko-KR")}–${to.toLocaleString("ko-KR")} / ${total.toLocaleString("ko-KR")}건` })), _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 2, children: [_jsx(TextField, { select: true, size: "small", variant: "standard", value: pageSize, onChange: (event) => pagination.setPageSize(Number(event.target.value)), sx: { width: 90 }, slotProps: { htmlInput: { "aria-label": "페이지당 행 수" } }, children: sizes.map((size) => (_jsxs(MenuItem, { value: size, children: [size, "\uD589"] }, size))) }), _jsx(Pagination, { size: "small", shape: "rounded", count: Math.max(pageCount, 1), page: pageIndex + 1, onChange: (_event, page) => pagination.setPageIndex(page - 1), disabled: pageCount <= 1 })] })] }));
+}

package/dist/mui/src/pivot/PivotTable.d.ts

@@ -0,0 +1,18 @@
+import type { PivotResult } from "../../../core/src/index";
+export interface PivotTableProps {
+    result: PivotResult;
+    /** 보여줄 값 키. 미지정이면 첫 번째 하나만 (여러 개면 셀이 빽빽해진다) */
+    valueKey?: string;
+    formatValue?: (value: unknown) => string;
+    /** 총계 열 표시 */
+    showTotal?: boolean;
+    maxHeight?: number | string;
+}
+/**
+ * 피벗 결과 표.
+ *
+ * 행 축은 트리라 접고 펼 수 있고, 열 축은 중첩 헤더로 그린다.
+ * 두 축이 동등하므로 전환은 `transposePivot(spec)` 으로 데이터 쪽에서 처리한다 —
+ * 이 컴포넌트는 축의 의미를 모른다.
+ */
+export declare function PivotTable({ result, valueKey, formatValue, showTotal, maxHeight, }: PivotTableProps): import("react").JSX.Element;

package/dist/mui/src/pivot/PivotTable.js

@@ -0,0 +1,100 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment, useMemo, useState } from "react";
+import { Alert, Box, IconButton, Stack, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Typography, } from "@mui/material";
+import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
+import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
+const defaultFormat = (value) => {
+    if (value === null || value === undefined)
+        return "";
+    if (typeof value === "number") {
+        return Number.isInteger(value) ? value.toLocaleString("ko-KR") : value.toFixed(2);
+    }
+    return String(value);
+};
+/** 헤더 레벨별로 노드를 모은다 — 중첩 헤더를 행으로 펼치기 위해 */
+function headerLevels(nodes) {
+    const levels = [];
+    const walk = (list, depth) => {
+        if (list.length === 0)
+            return;
+        if (!levels[depth])
+            levels[depth] = [];
+        levels[depth].push(...list);
+        for (const node of list)
+            if (node.children)
+                walk(node.children, depth + 1);
+    };
+    walk(nodes, 0);
+    return levels;
+}
+/** 이 노드가 차지하는 leaf 열 수 */
+function leafSpan(node) {
+    if (!node.children || node.children.length === 0)
+        return 1;
+    return node.children.reduce((sum, child) => sum + leafSpan(child), 0);
+}
+function collectRowKeys(rows) {
+    const keys = [];
+    const walk = (list) => {
+        for (const row of list) {
+            keys.push(row.key);
+            if (row.children)
+                walk(row.children);
+        }
+    };
+    walk(rows);
+    return keys;
+}
+/**
+ * 피벗 결과 표.
+ *
+ * 행 축은 트리라 접고 펼 수 있고, 열 축은 중첩 헤더로 그린다.
+ * 두 축이 동등하므로 전환은 `transposePivot(spec)` 으로 데이터 쪽에서 처리한다 —
+ * 이 컴포넌트는 축의 의미를 모른다.
+ */
+export function PivotTable({ result, valueKey, formatValue = defaultFormat, showTotal = true, maxHeight, }) {
+    const key = valueKey ?? result.valueKeys[0];
+    const levels = useMemo(() => headerLevels(result.columns), [result.columns]);
+    const [collapsed, setCollapsed] = useState(new Set());
+    const allKeys = useMemo(() => collectRowKeys(result.rows), [result.rows]);
+    void allKeys;
+    /**
+     * 열 합계. 코어가 `PivotResult.colTotals`(leaf 키 → 값 키 → 집계값) 를 주면 그것을 쓴다 —
+     * AVG/COUNT_DISTINCT 는 행 합계를 더해서 만들 수 없다. 아직 없으면 SUM 에서만 맞는
+     * 예전 방식(행 값 합산)으로 되돌아간다.
+     */
+    const colTotals = result.colTotals;
+    if (!key)
+        return _jsx(Alert, { severity: "warning", children: "\uD45C\uC2DC\uD560 \uC9D1\uACC4 \uAC12\uC774 \uC5C6\uC2B5\uB2C8\uB2E4" });
+    const toggle = (rowKey) => setCollapsed((prev) => {
+        const next = new Set(prev);
+        if (next.has(rowKey))
+            next.delete(rowKey);
+        else
+            next.add(rowKey);
+        return next;
+    });
+    const renderRows = (rows) => rows.map((row) => {
+        const isCollapsed = collapsed.has(row.key);
+        const hasChildren = !!row.children && row.children.length > 0;
+        return (_jsxs(Fragment, { children: [_jsxs(TableRow, { hover: true, children: [_jsx(TableCell, { sx: {
+                                pl: 1 + row.depth * 2,
+                                whiteSpace: "nowrap",
+                                position: "sticky", left: 0, zIndex: 1,
+                                backgroundColor: "background.paper",
+                                fontWeight: hasChildren ? 600 : 400,
+                            }, children: _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 0.5, children: [hasChildren ? (_jsx(IconButton, { size: "small", "aria-label": isCollapsed ? "펼치기" : "접기", onClick: () => toggle(row.key), children: isCollapsed ? _jsx(KeyboardArrowRightIcon, { fontSize: "small" }) : _jsx(KeyboardArrowDownIcon, { fontSize: "small" }) })) : (_jsx(Box, { sx: { width: 30 } })), _jsx("span", { children: row.label })] }) }), result.leafKeys.map((leafKey) => (_jsx(TableCell, { align: "right", sx: { whiteSpace: "nowrap" }, children: formatValue(row.cells[leafKey]?.[key]) }, leafKey))), showTotal && (_jsx(TableCell, { align: "right", sx: { fontWeight: 600, whiteSpace: "nowrap" }, children: formatValue(row.total[key]) }))] }), hasChildren && !isCollapsed && renderRows(row.children)] }, row.key));
+    });
+    return (_jsxs(Stack, { spacing: 1, children: [result.droppedColumns > 0 && (_jsxs(Alert, { severity: "info", sx: { py: 0 }, children: ["\uC5F4\uC774 \uB9CE\uC544 ", result.droppedColumns, "\uAC1C\uB97C \uC81C\uC678\uD588\uC2B5\uB2C8\uB2E4 \u2014 \uC0C1\uD55C\uC744 \uC62C\uB9AC\uAC70\uB098 \uC870\uAC74\uC744 \uC881\uD600 \uC8FC\uC138\uC694"] })), _jsx(TableContainer, { sx: { maxHeight, border: "1px solid", borderColor: "divider", borderRadius: 1 }, children: _jsxs(Table, { stickyHeader: true, size: "small", children: [_jsx(TableHead, { children: levels.map((level, depth) => (_jsxs(TableRow, { children: [depth === 0 && (_jsx(TableCell, { rowSpan: levels.length, sx: {
+                                            position: "sticky", left: 0, zIndex: 3,
+                                            backgroundColor: "background.paper", fontWeight: 600,
+                                        } })), level.map((node) => (_jsx(TableCell, { align: "center", colSpan: leafSpan(node), sx: { fontWeight: 600, whiteSpace: "nowrap", backgroundColor: "background.paper" }, children: node.label }, node.key))), depth === 0 && showTotal && (_jsx(TableCell, { rowSpan: levels.length, align: "right", sx: { fontWeight: 700, backgroundColor: "background.paper", whiteSpace: "nowrap" }, children: "\uD569\uACC4" }))] }, depth))) }), _jsx(TableBody, { children: result.rows.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: result.leafKeys.length + (showTotal ? 2 : 1), sx: { py: 6, textAlign: "center" }, children: _jsx(Typography, { variant: "body2", color: "text.secondary", children: "\uD45C\uC2DC\uD560 \uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4" }) }) })) : (_jsxs(_Fragment, { children: [renderRows(result.rows), showTotal && (_jsxs(TableRow, { sx: { backgroundColor: "action.hover" }, children: [_jsx(TableCell, { sx: { fontWeight: 700, position: "sticky", left: 0, zIndex: 1, backgroundColor: "inherit" }, children: "\uD569\uACC4" }), result.leafKeys.map((leafKey) => {
+                                                const columnTotal = colTotals
+                                                    ? colTotals[leafKey]?.[key]
+                                                    : result.rows.reduce((sum, row) => {
+                                                        const value = row.cells[leafKey]?.[key];
+                                                        return typeof value === "number" ? sum + value : sum;
+                                                    }, 0);
+                                                return (_jsx(TableCell, { align: "right", sx: { fontWeight: 700 }, children: formatValue(columnTotal) }, leafKey));
+                                            }), _jsx(TableCell, { align: "right", sx: { fontWeight: 700 }, children: formatValue(result.grandTotal[key]) })] }))] })) })] }) })] }));
+}

package/dist/mui/src/provider/KokoTableProvider.d.ts

@@ -0,0 +1,184 @@
+import { type ComponentType, type ReactNode } from "react";
+import type { Cell, Column, Row, RowData, Table } from "@tanstack/react-table";
+import type { AggregateResult, CellRenderProps as CoreCellRenderProps, ColumnDataType, ColumnMeta, FilterRender, FilterVariant, GroupTreeNode } from "../../../core/src/index";
+import type { HeaderCellProps } from "../content/HeaderCell";
+import type { ColumnMenuProps } from "../content/ColumnMenu";
+import type { TableErrorFallbackProps } from "../content/TableErrorFallback";
+import type { EditCellProps } from "../content/EditCell";
+import type { AggregateChipProps } from "../grouping/AggregateChip";
+import type { Density } from "../content/density";
+import type { GroupRowLayout, GroupedColumnMode } from "../content/TableContent";
+import { type KokoTableLabels, type KokoTableLabelsInput } from "./labels";
+import { applyPatch, toRegistry, type AggregationDef, type CellRendererDef, type ExportFormatterDef, type Registry } from "../registry";
+import type { HeaderDef } from "../headers/types";
+import { type ColumnMenuItemDef, type ColumnMenuPatch } from "../menus/columnMenu";
+import { type RowMenuItemDef, type RowMenuPatch } from "../menus/rowMenu";
+export interface EmptyStateProps {
+    message: ReactNode;
+    table: Table<any>;
+    columnCount: number;
+}
+export interface LoadingSkeletonProps {
+    rows: number;
+    columns: Array<Column<any, unknown>>;
+    columnCount: number;
+    size: "small" | "medium";
+}
+/** 그룹 행 전체를 교체할 때 받는 것. `<TableRow>` 하나를 돌려줘야 한다 */
+export interface GroupRowRenderContext<T extends RowData = any> {
+    node: GroupTreeNode<T>;
+    depth: number;
+    /** 지금 그려지는 순서의 리프 컬럼 (열 가상화·그룹 컬럼 재배치 반영) */
+    columns: Array<Column<T, unknown>>;
+    aggregates: AggregateResult;
+    toggle: () => void;
+    expanded: boolean;
+    table: Table<T>;
+    columnCount: number;
+    /** 이 depth 의 그룹 기준 컬럼 (없으면 숨김·제거된 것) */
+    groupColumn?: Column<T, unknown>;
+    /** 기본 규칙으로 해석한 그룹값 라벨 */
+    groupValue: ReactNode;
+    /** 기본 행 props — `data-index`·ref·onClick·sx. 그대로 펼치면 가상화·키보드가 유지된다 */
+    rowProps: Record<string, unknown>;
+}
+export interface DetailPanelRowContext<T extends RowData = any> {
+    row: Row<T>;
+    table: Table<T>;
+    columnCount: number;
+    /** `renderDetailPanel(row, table)` 결과 */
+    content: ReactNode;
+}
+export interface KokoTableComponents {
+    HeaderCell: ComponentType<HeaderCellProps<any>>;
+    ColumnMenu: ComponentType<ColumnMenuProps<any>>;
+    EmptyState: ComponentType<EmptyStateProps>;
+    ErrorFallback: ComponentType<TableErrorFallbackProps>;
+    /** `<tr>` 들을 돌려준다 — `<tbody>` 안에 놓인다 */
+    LoadingSkeleton: ComponentType<LoadingSkeletonProps>;
+    AggregateChip: ComponentType<AggregateChipProps>;
+    /** 그룹 행 전체 교체 */
+    GroupRow: (ctx: GroupRowRenderContext<any>) => ReactNode;
+    /** 펼친 행 아래 상세 패널 행 전체 교체 */
+    DetailPanelRow: (ctx: DetailPanelRowContext<any>) => ReactNode;
+    EditCell: ComponentType<EditCellProps<any>>;
+}
+/** Provider 셀 렌더러가 받는 것 — 코어 `CellRenderProps` 에 인스턴스를 더한 것 */
+export interface CellRendererProps<T extends RowData = any> extends CoreCellRenderProps<T> {
+    cell: Cell<T, unknown>;
+    column: Column<T, unknown>;
+    table: Table<T>;
+    meta?: ColumnMeta;
+    /** `link` 렌더러에만 — `meta.link.to()` 결과 */
+    href?: string;
+}
+export type CellRendererKey = ColumnDataType | "link" | "chip" | "placeholder";
+export type CellRenderer<T extends RowData = any> = (props: CellRendererProps<T>) => ReactNode;
+export type KokoCellRenderers = Partial<Record<CellRendererKey, CellRenderer>>;
+export type KokoFilterInputs = Partial<Record<FilterVariant, FilterRender<any>>>;
+export interface KokoTableDefaults {
+    density?: Density;
+    pageSizeOptions: number[];
+    skeletonRows: number;
+    groupRowLayout: GroupRowLayout;
+    groupedColumnMode: GroupedColumnMode;
+    enableColumnMenu: boolean;
+    stickyHeader: boolean;
+    maxHeight?: number | string;
+    /** 검색 입력 debounce(ms) — 값만 내려준다. 실제 적용은 검색 훅·입력 컴포넌트 몫 */
+    debounceMs: number;
+}
+export declare const DEFAULT_TABLE_DEFAULTS: KokoTableDefaults;
+/** 필터 kind 의 표시 부분 — 의미(predicate·serialize)는 core 의 kind 가, 편집기·칩은 여기가 맡는다 */
+export interface FilterKindUi {
+    editor?: FilterRender<any>;
+    chip?: (value: unknown, operator: string) => ReactNode;
+}
+export type KokoFilterKinds = Record<string, FilterKindUi>;
+/** 해석된 메뉴 레지스트리 — `ColumnMenu`/`TableContent` 가 항목을 여기서 꺼낸다 */
+export interface KokoTableMenus {
+    column: Registry<ColumnMenuItemDef<any>>;
+    row: Registry<RowMenuItemDef<any>>;
+}
+export interface KokoTableMenusInput {
+    column?: ColumnMenuPatch<any>;
+    row?: RowMenuPatch<any>;
+}
+/** 셀 렌더러 · 집계 · export 포맷터 레지스트리 — 항목 타입은 각 담당 파일이 채운다 */
+export interface KokoTableRegistries {
+    cells: Registry<CellRendererDef>;
+    aggregations: Registry<AggregationDef>;
+    exportFormatters: Registry<ExportFormatterDef>;
+}
+/** 컬럼 메뉴 "필터 열기" — 있을 때만 항목이 보인다 */
+export type OpenFilterHandler = (column: Column<any, unknown>, table: Table<any>) => void;
+/** 해석된 설정 — 라벨·기본값·레지스트리는 항상 채워져 있고, 컴포넌트·렌더러는 덮어쓴 것만 있다 */
+export interface KokoTableConfig {
+    components: Partial<KokoTableComponents>;
+    /** dataType 별 셀 렌더러 맵 (기존 통로). 배열/레지스트리로 준 정의는 `registries.cells` 에 있다 */
+    cellRenderers: KokoCellRenderers;
+    filterInputs: KokoFilterInputs;
+    labels: KokoTableLabels;
+    defaults: KokoTableDefaults;
+    menus: KokoTableMenus;
+    /** Provider 헤더 정의 — 안쪽 Provider 것이 앞에 온다 (`when` 이 참인 첫 정의가 이긴다) */
+    headers: Array<HeaderDef<any>>;
+    filterKinds: KokoFilterKinds;
+    registries: KokoTableRegistries;
+    onOpenFilter?: OpenFilterHandler;
+}
+export interface KokoTableConfigInput {
+    components?: Partial<KokoTableComponents>;
+    /** dataType 맵(기존) 또는 `CellRendererDef[]`/레지스트리(설계 4절) — 둘 다 받는다 */
+    cellRenderers?: KokoCellRenderers | CellRendererDef[] | Registry<CellRendererDef>;
+    filterInputs?: KokoFilterInputs;
+    labels?: KokoTableLabelsInput;
+    defaults?: Partial<KokoTableDefaults>;
+    /** 컬럼·행 컨텍스트 메뉴 add · remove · replace · order */
+    menus?: KokoTableMenusInput;
+    headers?: Array<HeaderDef<any>>;
+    filterKinds?: KokoFilterKinds;
+    aggregations?: AggregationDef[] | Registry<AggregationDef>;
+    exportFormatters?: ExportFormatterDef[] | Registry<ExportFormatterDef>;
+    onOpenFilter?: OpenFilterHandler;
+}
+export declare const DEFAULT_KOKO_TABLE_CONFIG: KokoTableConfig;
+/**
+ * 부모 설정 위에 입력을 병합한다 — 항목별 얕은 병합(지정한 키만 바뀐다).
+ * 메뉴 패치는 부모 레지스트리에서 `with()` 로 파생(안쪽이 바깥 위에 쌓인다), 헤더는 안쪽 정의가 앞에 온다.
+ */
+export declare function mergeKokoTableConfig(base: KokoTableConfig, input?: KokoTableConfigInput): KokoTableConfig;
+export interface KokoTableProviderProps extends KokoTableConfigInput {
+    children?: ReactNode;
+}
+/**
+ * 덮어쓰기 계층의 입구 — 단일 진입점 (설계 5절).
+ *
+ * 우선순위는 **컬럼 단위 선언 → Provider → 기본값** 이다:
+ * - 필터 입력: `filter.render` → `filterInputs[variant]` / `filterKinds[kind].editor` → variant 기본 컴포넌트
+ * - 셀: 컬럼 `cell`(코어 포맷터 포함) 결과를 `cellRenderers[dataType]` 이 받아 감싼다 → `chip`/`link`/`placeholder`
+ * - 헤더: `meta.header`(id 또는 `defineHeader`) → `headers[]` 중 `when` 이 참인 첫 정의 → 기본 헤더
+ * - 메뉴: `menus.column` / `menus.row` 패치가 내장 세트 위에 쌓인다 → `TableContent columnMenuItems`/`rowMenuItems` 가 마지막
+ * - 문구: `labels` (연산자·UI·집계) — 다국어 통로
+ * - 기본값: `TableContent`/`PaginationArea` 의 미지정 prop 이 `defaults` 를 본다
+ *
+ * 중첩하면 안쪽 Provider 가 바깥 설정 위에 병합된다 — 화면 하나만 영어로 바꾸는 식이 된다.
+ */
+export declare function KokoTableProvider({ children, ...input }: KokoTableProviderProps): import("react").JSX.Element;
+/** 가장 가까운 Provider 의 해석된 설정. Provider 가 없으면 기본값 */
+export declare function useKokoTableConfig(): KokoTableConfig;
+/** 정의 배열·레지스트리·undefined 를 레지스트리로 — 소비자가 자기 확장점에 같은 규칙을 쓸 때 */
+export { toRegistry, applyPatch };
+/**
+ * `props ?? defaults` — `TableContent`/`PaginationArea` 가 미지정 prop 을 Provider 기본값으로 채울 때 쓴다.
+ * 명시한 prop(undefined 가 아닌 것)은 그대로다.
+ */
+export declare function resolveTableProps<P extends {
+    density?: Density;
+    skeletonRows?: number;
+    groupRowLayout?: GroupRowLayout;
+    groupedColumnMode?: GroupedColumnMode;
+    enableColumnMenu?: boolean;
+    stickyHeader?: boolean;
+    maxHeight?: number | string;
+}>(props: P, defaults: KokoTableDefaults): P;

package/dist/mui/src/provider/KokoTableProvider.js

@@ -0,0 +1,118 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo } from "react";
+import { DEFAULT_LABELS, mergeLabels } from "./labels";
+import { applyPatch, createRegistry, isRegistry, toRegistry, } from "../registry";
+import { columnMenuRegistry } from "../menus/columnMenu";
+import { rowMenuRegistry } from "../menus/rowMenu";
+export const DEFAULT_TABLE_DEFAULTS = {
+    pageSizeOptions: [15, 30, 50, 100],
+    skeletonRows: 5,
+    groupRowLayout: "columns",
+    groupedColumnMode: "reorder",
+    enableColumnMenu: true,
+    stickyHeader: true,
+    debounceMs: 300,
+};
+export const DEFAULT_KOKO_TABLE_CONFIG = {
+    components: {},
+    cellRenderers: {},
+    filterInputs: {},
+    labels: DEFAULT_LABELS,
+    defaults: DEFAULT_TABLE_DEFAULTS,
+    menus: { column: columnMenuRegistry, row: rowMenuRegistry },
+    headers: [],
+    filterKinds: {},
+    registries: {
+        cells: createRegistry(),
+        aggregations: createRegistry(),
+        exportFormatters: createRegistry(),
+    },
+};
+function isCellRendererMap(value) {
+    return !!value && !Array.isArray(value) && !isRegistry(value);
+}
+/** 배열이면 부모 레지스트리에 add, 레지스트리면 그것으로 교체 */
+function mergeRegistry(base, input) {
+    if (!input)
+        return base;
+    if (isRegistry(input))
+        return input;
+    return base.with({ add: input });
+}
+/**
+ * 부모 설정 위에 입력을 병합한다 — 항목별 얕은 병합(지정한 키만 바뀐다).
+ * 메뉴 패치는 부모 레지스트리에서 `with()` 로 파생(안쪽이 바깥 위에 쌓인다), 헤더는 안쪽 정의가 앞에 온다.
+ */
+export function mergeKokoTableConfig(base, input) {
+    if (!input)
+        return base;
+    const cellMap = isCellRendererMap(input.cellRenderers) ? input.cellRenderers : undefined;
+    const cellDefs = isCellRendererMap(input.cellRenderers) ? undefined : input.cellRenderers;
+    return {
+        components: { ...base.components, ...input.components },
+        cellRenderers: { ...base.cellRenderers, ...cellMap },
+        filterInputs: { ...base.filterInputs, ...input.filterInputs },
+        labels: mergeLabels(base.labels, input.labels),
+        defaults: { ...base.defaults, ...input.defaults },
+        menus: {
+            column: input.menus?.column ? base.menus.column.with(input.menus.column) : base.menus.column,
+            row: input.menus?.row ? base.menus.row.with(input.menus.row) : base.menus.row,
+        },
+        headers: input.headers ? [...input.headers, ...base.headers] : base.headers,
+        filterKinds: { ...base.filterKinds, ...input.filterKinds },
+        registries: {
+            cells: mergeRegistry(base.registries.cells, cellDefs),
+            aggregations: mergeRegistry(base.registries.aggregations, input.aggregations),
+            exportFormatters: mergeRegistry(base.registries.exportFormatters, input.exportFormatters),
+        },
+        onOpenFilter: input.onOpenFilter ?? base.onOpenFilter,
+    };
+}
+const KokoTableContext = createContext(DEFAULT_KOKO_TABLE_CONFIG);
+/**
+ * 덮어쓰기 계층의 입구 — 단일 진입점 (설계 5절).
+ *
+ * 우선순위는 **컬럼 단위 선언 → Provider → 기본값** 이다:
+ * - 필터 입력: `filter.render` → `filterInputs[variant]` / `filterKinds[kind].editor` → variant 기본 컴포넌트
+ * - 셀: 컬럼 `cell`(코어 포맷터 포함) 결과를 `cellRenderers[dataType]` 이 받아 감싼다 → `chip`/`link`/`placeholder`
+ * - 헤더: `meta.header`(id 또는 `defineHeader`) → `headers[]` 중 `when` 이 참인 첫 정의 → 기본 헤더
+ * - 메뉴: `menus.column` / `menus.row` 패치가 내장 세트 위에 쌓인다 → `TableContent columnMenuItems`/`rowMenuItems` 가 마지막
+ * - 문구: `labels` (연산자·UI·집계) — 다국어 통로
+ * - 기본값: `TableContent`/`PaginationArea` 의 미지정 prop 이 `defaults` 를 본다
+ *
+ * 중첩하면 안쪽 Provider 가 바깥 설정 위에 병합된다 — 화면 하나만 영어로 바꾸는 식이 된다.
+ */
+export function KokoTableProvider({ children, ...input }) {
+    const parent = useContext(KokoTableContext);
+    const { components, cellRenderers, filterInputs, labels, defaults, menus, headers, filterKinds, aggregations, exportFormatters, onOpenFilter, } = input;
+    const value = useMemo(() => mergeKokoTableConfig(parent, {
+        components, cellRenderers, filterInputs, labels, defaults, menus, headers, filterKinds, aggregations,
+        exportFormatters, onOpenFilter,
+    }), [
+        parent, components, cellRenderers, filterInputs, labels, defaults, menus, headers, filterKinds, aggregations,
+        exportFormatters, onOpenFilter,
+    ]);
+    return _jsx(KokoTableContext.Provider, { value: value, children: children });
+}
+/** 가장 가까운 Provider 의 해석된 설정. Provider 가 없으면 기본값 */
+export function useKokoTableConfig() {
+    return useContext(KokoTableContext);
+}
+/** 정의 배열·레지스트리·undefined 를 레지스트리로 — 소비자가 자기 확장점에 같은 규칙을 쓸 때 */
+export { toRegistry, applyPatch };
+/**
+ * `props ?? defaults` — `TableContent`/`PaginationArea` 가 미지정 prop 을 Provider 기본값으로 채울 때 쓴다.
+ * 명시한 prop(undefined 가 아닌 것)은 그대로다.
+ */
+export function resolveTableProps(props, defaults) {
+    return {
+        ...props,
+        density: props.density ?? defaults.density,
+        skeletonRows: props.skeletonRows ?? defaults.skeletonRows,
+        groupRowLayout: props.groupRowLayout ?? defaults.groupRowLayout,
+        groupedColumnMode: props.groupedColumnMode ?? defaults.groupedColumnMode,
+        enableColumnMenu: props.enableColumnMenu ?? defaults.enableColumnMenu,
+        stickyHeader: props.stickyHeader ?? defaults.stickyHeader,
+        maxHeight: props.maxHeight ?? defaults.maxHeight,
+    };
+}

package/dist/mui/src/provider/labels.d.ts

@@ -0,0 +1,85 @@
+import type { AggFnKey, FilterOperator } from "../../../core/src/index";
+/**
+ * 연산자 한국어 라벨 — 없는 것은 키를 그대로 보여준다.
+ * `KokoTableProvider({ labels: { operators } })` 로 덮어쓴다 (다국어 통로).
+ */
+export declare const OPERATOR_LABELS: Partial<Record<FilterOperator, string>>;
+/**
+ * UI 문구. 문자열이거나, 값이 끼는 문구는 함수다.
+ * 렌더러 패키지 안의 모든 고정 문구는 여기서 나온다 — 소비자는 Provider 로 일부만 바꾼다.
+ */
+export interface KokoUiLabels {
+    search: string;
+    reset: string;
+    filterTitle: string;
+    detailConditions: string;
+    /** 연산자 버튼 툴팁 — `filterMode("포함")` */
+    filterMode: (operatorLabel: string) => string;
+    changeFilterMode: string;
+    empty: string;
+    loading: string;
+    retry: string;
+    loadFailed: string;
+    badRequest: string;
+    resetFilters: string;
+    /** 서버 그룹핑 "더 보기" */
+    loadMore: (loaded: number, total?: number) => string;
+    /** 그룹 트리에는 있는데 행 모델에 없을 때 */
+    missingRows: string;
+    expand: string;
+    collapse: string;
+    expandAll: string;
+    collapseAll: string;
+    selectAll: string;
+    selectRow: string;
+    expandGroup: string;
+    collapseGroup: string;
+    /** "2단계까지 펼치기 (지역)" */
+    expandToDepth: (depth: number, columnName: string) => string;
+    expandChildren: string;
+    /** 헤더 정렬 툴팁 */
+    sortHint: string;
+    /** 컬럼 메뉴 버튼 aria — 컬럼 id 뒤에 붙는다 */
+    columnMenu: string;
+    resizeHandle: (columnId: string) => string;
+    sortAsc: string;
+    sortDesc: string;
+    clearSort: string;
+    pinLeft: string;
+    pinRight: string;
+    unpin: string;
+    moveLeft: string;
+    moveRight: string;
+    hide: string;
+    groupBy: string;
+    ungroup: string;
+    resetColumnSize: string;
+    /** 컬럼 메뉴 "필터 열기" (`onOpenFilter` 가 있을 때) */
+    openFilter: string;
+    /** 컬럼 메뉴 "헤더 복사" */
+    copyHeader: string;
+    /** 헤더 메뉴 "집계" 항목·상세 설정 버튼 */
+    aggregation: string;
+    aggregationSettings: string;
+    /** 행 메뉴 "행 복사" */
+    copyRow: string;
+}
+export declare const DEFAULT_UI_LABELS: KokoUiLabels;
+/** 해석된 라벨 — Provider 가 기본값과 병합해 내려준다 */
+export interface KokoTableLabels {
+    operators: Partial<Record<FilterOperator, string>>;
+    aggregations: Record<AggFnKey, string>;
+    aggregationsShort: Record<AggFnKey, string>;
+    ui: KokoUiLabels;
+}
+/** Provider 에 넘기는 부분 덮어쓰기 */
+export interface KokoTableLabelsInput {
+    operators?: Partial<Record<FilterOperator, string>>;
+    aggregations?: Partial<Record<AggFnKey, string>>;
+    aggregationsShort?: Partial<Record<AggFnKey, string>>;
+    ui?: Partial<KokoUiLabels>;
+}
+export declare const DEFAULT_LABELS: KokoTableLabels;
+export declare function mergeLabels(base: KokoTableLabels, input?: KokoTableLabelsInput): KokoTableLabels;
+/** 연산자 라벨 — `labels` 를 주면 그것을, 없으면 기본 한국어 표를 본다 */
+export declare function operatorLabel(operator: FilterOperator, labels?: Partial<Record<FilterOperator, string>>): string;

package/dist/mui/src/provider/labels.js

@@ -0,0 +1,104 @@
+import { AGG_LABELS, AGG_SHORT_LABELS } from "../../../core/src/index";
+/**
+ * 연산자 한국어 라벨 — 없는 것은 키를 그대로 보여준다.
+ * `KokoTableProvider({ labels: { operators } })` 로 덮어쓴다 (다국어 통로).
+ */
+export const OPERATOR_LABELS = {
+    fuzzy: "포함(공백무시)",
+    contains: "포함",
+    notContains: "미포함",
+    equals: "같음",
+    notEquals: "다름",
+    startsWith: "시작",
+    endsWith: "끝",
+    empty: "비어 있음",
+    notEmpty: "비어 있지 않음",
+    isEmpty: "비어 있음",
+    between: "범위(초과·미만)",
+    betweenInclusive: "범위",
+    outsideRange: "범위 밖",
+    lessThan: "미만",
+    lessThanOrEqualTo: "이하",
+    greaterThan: "초과",
+    greaterThanOrEqualTo: "이상",
+    inPeriod: "기간",
+    inArray: "포함",
+    notInArray: "제외",
+    in: "포함",
+    notIn: "제외",
+    hasAny: "하나라도",
+    hasAll: "모두",
+    hasChild: "자식 있음",
+    hasNotChild: "자식 없음",
+    linearContains: "수량 포함",
+    linearExists: "존재",
+    linearExact: "정확히",
+    scheduleContains: "그 날 포함",
+    scheduleOverlaps: "기간 겹침",
+};
+export const DEFAULT_UI_LABELS = {
+    search: "검색",
+    reset: "초기화",
+    filterTitle: "검색 조건",
+    detailConditions: "상세 조건",
+    filterMode: (label) => `필터 방식: ${label}`,
+    changeFilterMode: "필터 방식 변경",
+    empty: "표시할 데이터가 없습니다",
+    loading: "불러오는 중…",
+    retry: "다시 시도",
+    loadFailed: "조회에 실패했습니다",
+    badRequest: "필터를 해석할 수 없습니다",
+    resetFilters: "필터 초기화",
+    loadMore: (loaded, total) => (total != null ? `더 보기 (${loaded} / ${total})` : `더 보기 (${loaded})`),
+    missingRows: "행을 테이블에 전달하지 못했습니다 — useDataTable 에 그룹핑의 rows 를 넘겨 주세요",
+    expand: "펼치기",
+    collapse: "접기",
+    expandAll: "모두 펼치기",
+    collapseAll: "모두 접기",
+    selectAll: "전체 선택",
+    selectRow: "행 선택",
+    expandGroup: "이 그룹 펼치기",
+    collapseGroup: "이 그룹 접기",
+    expandToDepth: (depth, columnName) => `${depth}단계까지 펼치기 (${columnName})`,
+    expandChildren: "하위 펼치기",
+    sortHint: "클릭: 정렬 · Shift+클릭: 정렬 추가",
+    columnMenu: "컬럼 메뉴",
+    resizeHandle: (columnId) => `${columnId} 너비 조절`,
+    sortAsc: "오름차순 정렬",
+    sortDesc: "내림차순 정렬",
+    clearSort: "정렬 해제",
+    pinLeft: "왼쪽 고정",
+    pinRight: "오른쪽 고정",
+    unpin: "고정 해제",
+    moveLeft: "왼쪽으로 이동",
+    moveRight: "오른쪽으로 이동",
+    hide: "숨기기",
+    groupBy: "그룹 기준에 추가",
+    ungroup: "그룹 기준에서 제거",
+    resetColumnSize: "컬럼 너비 초기화",
+    openFilter: "필터 열기",
+    copyHeader: "헤더 복사",
+    aggregation: "집계",
+    aggregationSettings: "집계 설정",
+    copyRow: "행 복사",
+};
+export const DEFAULT_LABELS = {
+    operators: OPERATOR_LABELS,
+    aggregations: AGG_LABELS,
+    aggregationsShort: AGG_SHORT_LABELS,
+    ui: DEFAULT_UI_LABELS,
+};
+export function mergeLabels(base, input) {
+    if (!input)
+        return base;
+    return {
+        operators: { ...base.operators, ...input.operators },
+        aggregations: { ...base.aggregations, ...input.aggregations },
+        aggregationsShort: { ...base.aggregationsShort, ...input.aggregationsShort },
+        ui: { ...base.ui, ...input.ui },
+    };
+}
+/** 연산자 라벨 — `labels` 를 주면 그것을, 없으면 기본 한국어 표를 본다 */
+export function operatorLabel(operator, labels) {
+    return (labels ?? OPERATOR_LABELS)[operator] ?? operator;
+}