@vmscloud/moz-ui-grid-react 0.1.19

package/dist/legacy/locale/types.d.ts

@@ -0,0 +1,328 @@
+export interface MozLocaleMessages {
+    Popup: {
+        title: string;
+        save: string;
+        cancel: string;
+        ok: string;
+        close: string;
+    };
+    Select: {
+        searchPlaceholder: string;
+        emptyText: string;
+        requiredMessage: string;
+    };
+    MultiSelect: {
+        search: string;
+        selectAll: string;
+        selectFiltered: string;
+        specificResults: string;
+        specificSelect: string;
+        noData: string;
+        required: string;
+        headerFormat: string;
+    };
+    TreeSelect: {
+        search: string;
+        selectAll: string;
+        selectFiltered: string;
+        specificResults: string;
+        noData: string;
+        showSelectedOnly: string;
+        expandAll: string;
+        collapseAll: string;
+        required: string;
+        headerFormat: string;
+    };
+    TagInput: {
+        add: string;
+    };
+    TimePicker: {
+        hour: string;
+        minute: string;
+        currentTime: string;
+    };
+    EmptyState: {
+        customEmptyHeader: string;
+        customEmptyContent: string;
+        dataEmptyHeader: string;
+        dataEmptyContent: string;
+        resultEmptyHeader: string;
+        resultEmptyContent: string;
+        searchEmptyHeader: string;
+        searchEmptyContent: string;
+    };
+    TableSelect: {
+        searchPlaceholder: string;
+        emptyText: string;
+        requiredMessage: string;
+        footerSelect: string;
+        footerNavigate: string;
+        footerClose: string;
+    };
+    Common: {
+        requiredMessage: string;
+    };
+    Grid: {
+        layoutSetting: string;
+        filter: string;
+        sort: string;
+        customCellStyle: string;
+        reset: string;
+        searchFilter: string;
+        newView: string;
+        selectAll: string;
+        columnPicker: string;
+        viewToolbar: string;
+        viewFooter: string;
+        viewGroupPanel: string;
+        resetFilterAndSort: string;
+        defaultView: string;
+        filterPopup: string;
+        resetFilter: string;
+        addFilter: string;
+        sortingPopup: string;
+        ascending: string;
+        descending: string;
+        resetSort: string;
+        addSort: string;
+        symbolEqual: string;
+        symbolNotEqual: string;
+        symbolContains: string;
+        symbolNotContains: string;
+        symbolLessThan: string;
+        symbolGreaterThan: string;
+        symbolLessOrEqual: string;
+        symbolGreaterOrEqual: string;
+        symbolEmpty: string;
+        symbolNotEmpty: string;
+        customCellRuleNamePlaceholder: string;
+        addFormulaCondition: string;
+        applicationColumn: string;
+        backgroundColor: string;
+        fontColor: string;
+        resetCustomCell: string;
+        addFormulaConditionSet: string;
+        customColor: string;
+        formulaConditionSet: string;
+        contextFilterAndSort: string;
+        contextAddFilter: string;
+        contextSelectFilter: string;
+        contextResetColumnFilter: string;
+        contextResetColumnSort: string;
+        contextResetColumnAll: string;
+        contextDataCopy: string;
+        contextDataExcelCopy: string;
+        contextDataWithHeaderCopy: string;
+        contextPin: string;
+        contextColumnPicker: string;
+        contextMoveColumnFirst: string;
+        contextAutoSizeColumns: string;
+        contextGroupPanel: string;
+        contextGroupToggle: string;
+        contextGroupCollapseAll: string;
+        contextGroupExpandAll: string;
+        groupPanelPlaceholder: string;
+        contextBulkEdit: string;
+        contextImport: string;
+        contextImportExcel: string;
+        contextImportExcelAppend: string;
+        contextExport: string;
+        contextExportXlsx: string;
+        contextExportCsv: string;
+        contextSum: string;
+        check: string;
+        cancel: string;
+        save: string;
+        remove: string;
+        close: string;
+        pause: string;
+        add: string;
+        immediateApply: string;
+        warning: string;
+        mozWarning: string;
+        confirmCancel: string;
+        alreadyExcelProgress: string;
+        downloadFail: string;
+        addDataWithFilterSort: string;
+        resetAndAdd: string;
+        confirmDeleteGeneral: string;
+        toastCopySuccess: string;
+        toastSaveSuccess: string;
+        toastSaveError: string;
+        toastResetSuccess: string;
+        toastRequiredVal: string;
+        excelInvalidExcel: string;
+        excelInvalidUpload: string;
+        downloadFormat: string;
+        click: string;
+        drag: string;
+        overwriteSelected: string;
+        fileOverwrite: string;
+        dropHere: string;
+        dropHerePrefix: string;
+        dropHereMiddle: string;
+        dropHereSuffix: string;
+        withFormatting: string;
+        requestTimedOut: string;
+        serverError: string;
+        total: string;
+        correct: string;
+        error: string;
+        success: string;
+        fail: string;
+        excelExportConfirmLargeData: string;
+        footerTotalRowCount: string;
+        footerFilteredRowCount: string;
+        aggregateAverage: string;
+        aggregateCount: string;
+        aggregateMin: string;
+        aggregateMax: string;
+        aggregateSum: string;
+    };
+    GridPivot: {
+        setting: string;
+        gridSetting: string;
+        fieldSetting: string;
+        showRowTotals: string;
+        showColumnTotals: string;
+        subtotalCriteria: string;
+        subtotalAggregateField: string;
+        totalsBeforeData: string;
+        showZeros: string;
+        showOutlineMode: string;
+        collapsibleSubtotal: string;
+        fieldName: string;
+        fieldAggregate: string;
+        fieldShowAs: string;
+        fieldFormat: string;
+        openChart: string;
+        selectValueField: string;
+        none: string;
+        sum: string;
+        count: string;
+        average: string;
+        max: string;
+        min: string;
+        range: string;
+        std: string;
+        var: string;
+        stdPop: string;
+        varPop: string;
+        cntAll: string;
+        showFirstValue: string;
+        showLastValue: string;
+        noCalculation: string;
+        diffRow: string;
+        diffRowPct: string;
+        diffCol: string;
+        diffColPct: string;
+        grandtotalPct: string;
+        rowTotalPct: string;
+        colTotalPct: string;
+        prevRowPct: string;
+        prevColPct: string;
+        runTot: string;
+        runTotPct: string;
+        generalFormat: string;
+        int: string;
+        float: string;
+        currency: string;
+        percentage: string;
+        percentageDot2: string;
+        thousands: string;
+        millions: string;
+        billions: string;
+        subtotal: string;
+        grandtotal: string;
+        grandtotalValue: string;
+        category: string;
+        chartType: string;
+        chartXAxis: string;
+        chartYAxis: string;
+        categoryName: string;
+        barChart: string;
+        lineChart: string;
+        lineSymbolChart: string;
+        areaChart: string;
+        chartRenderingErrorHeader: string;
+        chartRenderingErrorContent: string;
+        contextPivotExportXlsx: string;
+        contextPivotExportOriginXlsx: string;
+        contextPivotExportOriginCsv: string;
+        row: string;
+        column: string;
+        value: string;
+        filter: string;
+        searchFieldPlaceholder: string;
+        dropZoneRowPlaceholder: string;
+        dropZoneColumnPlaceholder: string;
+        dropZoneValuePlaceholder: string;
+        dropZoneFilterPlaceholder: string;
+        update: string;
+        selectFieldForReport: string;
+        dragFieldsBetweenAreas: string;
+        valueSummaryCriteria: string;
+    };
+    Gantt: {
+        searchPlaceholder: string;
+        columnSize: string;
+        rowSize: string;
+    };
+    Chart: {
+        filterPopup: string;
+        resetFilter: string;
+        addFilter: string;
+        symbolEqual: string;
+        symbolNotEqual: string;
+        symbolContains: string;
+        symbolNotContains: string;
+        symbolLessThan: string;
+        symbolGreaterThan: string;
+        symbolLessOrEqual: string;
+        symbolGreaterOrEqual: string;
+        symbolEmpty: string;
+        symbolNotEmpty: string;
+        chartSetting: string;
+        chartCategory: string;
+        chartType: string;
+        chartUseZoom: string;
+        multiYAxisSetting: string;
+        notUsed: string;
+        chartPopup: string;
+        errorMessage: string;
+        valueFieldSetting: string;
+        valueSummaryCriteria: string;
+        selectFieldForReport: string;
+        column: string;
+        row: string;
+        value: string;
+        sumValue: string;
+        count: string;
+        sum: string;
+        average: string;
+        min: string;
+        max: string;
+        seriesCategory: string;
+        pieCategory: string;
+        scatterCategory: string;
+        treemapCategory: string;
+        boxplotCategory: string;
+        candlestickCategory: string;
+        barChart: string;
+        stackBarChart: string;
+        horizontalStackBarChart: string;
+        lineChart: string;
+        lineSymbolChart: string;
+        areaChart: string;
+        general: string;
+        custom: string;
+        axisCategoryLabel: string;
+        legendSeriesLabel: string;
+        legendSingleLabel: string;
+        legendMultiLabel: string;
+        valueSingleLabel: string;
+        xAxisSingleLabel: string;
+        yAxisMultiLabel: string;
+        notSet: string;
+    };
+}

package/dist/legacy/locale/useMozLocale.d.ts

@@ -0,0 +1,15 @@
+import { MozLocaleMessages } from './types';
+/**
+ * MozLocale React Context
+ *
+ * Vue 측 `provide(MOZ_LOCALE_KEY, ...)`의 React 대응.
+ * Provider 없이도 koKR 기본값으로 동작합니다.
+ */
+export declare const MozLocaleContext: import('react').Context<MozLocaleMessages>;
+/**
+ * 다국어 메시지 훅
+ *
+ * Vue의 `useMozLocale()`이 `Ref<MozLocaleMessages>`를 반환하는 반면,
+ * React 버전은 객체 자체를 반환합니다 (React 리렌더로 자동 갱신).
+ */
+export declare function useMozLocale(): MozLocaleMessages;

package/dist/legacy/locale/zh.d.ts

@@ -0,0 +1,2 @@
+import { MozLocaleMessages } from './types';
+export declare const zhCN: MozLocaleMessages;

package/dist/legacy/stories/MozGridReact.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { MozGridReact } from '..';
+declare const meta: Meta<typeof MozGridReact>;
+export default meta;
+type Story = StoryObj<typeof MozGridReact>;
+/** 기본 Flat 그리드 — 직원 데이터 100건 */
+export declare const Basic: Story;

package/dist/legacy/stories/MozPivotReact.stories.d.ts

@@ -0,0 +1,44 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { MozPivotReact } from '..';
+declare const meta: Meta<typeof MozPivotReact>;
+export default meta;
+type Story = StoryObj<typeof MozPivotReact>;
+/**
+ * 기본 Pivot — 지역×제품 × 연도×분기 매출/이익. 툴바 차트 아이콘 클릭으로 차트 열기.
+ *
+ * 행 필드가 2개 이상이면 차트의 default categoryField(첫 번째 row field)가 non-leaf라
+ * `getSeriesData`가 해당 depth의 subtotal 행을 요구한다 → pivotSettings에 subtotal 활성화.
+ */
+export declare const Basic: Story;
+/** 기본 차트: 지역×분기별 매출 — 툴바 차트 아이콘 클릭으로 토글 */
+export declare const ChartDefault: Story;
+/**
+ * 차트가 처음부터 열려 있는 상태로 시작. `chartActive`/`onClickChart`로 외부 제어.
+ *
+ * Y축(행 필드) 2개 → 차트 툴바에 Y축 카테고리 선택 UI 노출.
+ */
+export declare const RowFieldSelector: Story;
+/**
+ * 다중 열 필드(연도 > 분기) — 차트 툴바에 X축 카테고리 선택 UI 노출.
+ */
+export declare const ColumnFieldSelector: Story;
+/**
+ * 다중 값 필드(매출/비용/수량) — 차트 툴바에서 시리즈 체크박스로 선택/해제.
+ */
+export declare const MultipleValueFields: Story;
+/**
+ * 전체 옵션: 다중 행/열/값 필드 + Grand Total 포함.
+ */
+export declare const FullOptions: Story;
+/**
+ * 차트 토글 제어: 외부 버튼으로 열기/닫기.
+ */
+export declare const ChartToggleControl: Story;
+/**
+ * 일별 날짜 컬럼(90일) — zoom bar / X축 라벨 회전 / hideOverlap / 적응형 초기 윈도우 데모.
+ *
+ * 컬럼 cardinality가 높아 xLabels > 10 → Detail 차트에 dataZoom 슬라이더가 표시됨.
+ * `useMultipleChart={false}`로 처음부터 Detail(단일 차트) 모드로 시작.
+ * 슬라이더 드래그 / shift+wheel 좌우 스크롤 동작 확인 가능.
+ */
+export declare const ChartManyColumns: Story;

package/dist/legacy/stories/_helpers/sampleData.d.ts

@@ -0,0 +1,54 @@
+/**
+ * 스토리북 공통 샘플 데이터. Vue 측 stories/_helpers/sampleData.ts와 동일.
+ */
+export declare function generateEmployeeData(count: number): {
+    id: number;
+    name: string;
+    department: string;
+    team: string;
+    status: string;
+    grade: string;
+    salary: number;
+    joinDate: string;
+    email: string;
+    active: boolean;
+}[];
+export declare function generateSalesData(count?: number): {
+    id: number;
+    region: string;
+    product: string;
+    quarter: string;
+    year: string;
+    sales: number;
+    cost: number;
+    quantity: number;
+    profit: number;
+}[];
+export declare const basicFields: ({
+    id: string;
+    header: string;
+    dataType: "number";
+    width: number;
+    readonly: boolean;
+} | {
+    id: string;
+    header: string;
+    dataType: "string";
+    width: number;
+    readonly?: undefined;
+} | {
+    id: string;
+    header: string;
+    dataType: "number";
+    width: number;
+    readonly?: undefined;
+})[];
+export declare const salesAvailableFields: ({
+    field: string;
+    header: string;
+    dataType: "number";
+} | {
+    field: string;
+    header: string;
+    dataType: "string";
+})[];

package/dist/legacy/types/pivot-props.d.ts

@@ -0,0 +1,62 @@
+import { PivotRowField, PivotColumnField, PivotValueField, PivotFilterField } from '@vmscloud/moz-ui-grid-core';
+/**
+ * Vue 측 src/types/pivot-props.ts의 React 대응.
+ */
+export interface PivotFieldItem {
+    id: string;
+    header: string;
+    area: 'row' | 'column' | 'value' | 'filter' | null;
+    aggregate?: string;
+}
+/** PivotFieldPanel 왼쪽 목록에 표시되는 사용 가능 필드 */
+export interface AvailableField {
+    /** 필드 키 */
+    field: string;
+    /** 표시 헤더 */
+    header: string;
+    /** 데이터 타입 */
+    dataType: 'string' | 'number' | 'date' | 'boolean';
+}
+/**
+ * PivotFieldPanel의 `update:config` event payload.
+ * 사용자가 패널에서 행/열/값/필터 필드를 재배치한 결과.
+ */
+export interface PivotFieldPanelConfig {
+    rowFields: PivotRowField[];
+    columnFields: PivotColumnField[];
+    valueFields: PivotValueField[];
+    filterFields: PivotFilterField[];
+}
+/** PivotFieldPanel UI 옵션 (영역 표시 여부 / 검색 사용 여부) */
+export interface PivotFieldPanelOptions {
+    /** 사용 가능한 영역 (기본: row, column, value) */
+    areas?: Array<'row' | 'column' | 'value' | 'filter'>;
+    /** 필드 검색 활성화 */
+    useSearch?: boolean;
+}
+export interface PivotGridProps {
+    pivotRowFields: PivotRowField[];
+    pivotColumnFields: PivotColumnField[];
+    pivotValueFields: PivotValueField[];
+    fieldPanelOptions?: PivotFieldPanelOptions;
+    availableFields?: AvailableField[];
+}
+export interface PivotGridSettings {
+    /** 행 부분합 표시 */
+    showRowSubTotals?: boolean;
+    /** 행 총합 표시 */
+    showRowGrandTotals?: boolean;
+    /** 열 부분합 표시 */
+    showColumnSubTotals?: boolean;
+    /** 열 총합 표시 */
+    showColumnGrandTotals?: boolean;
+    /** 행 부분합 기준 필드 (undefined면 모든 필드) */
+    rowSubTotalFields?: string[];
+    /** 열 부분합 기준 필드 (undefined면 모든 필드) */
+    columnSubTotalFields?: string[];
+    /** 합계를 데이터 앞에 표시 */
+    totalsBeforeData?: boolean;
+    /** 0 값을 채워 표시 */
+    showZeros?: boolean;
+}
+export type { PivotRowField, PivotColumnField, PivotValueField, PivotFilterField };

package/dist/legacy/types/props.d.ts

@@ -0,0 +1,118 @@
+import { FieldDef, PureSheetEventType, PivotRowField, PivotColumnField, PivotValueField, FormatRowCallback, PartialTranslationMap, GroupConfig, ColumnGroupDef, RowHeaderConfig, FieldRowTemplate, LoaderConfig, RowSelectionConfig, CellSelectionConfig, ScrollEndReachedPayload, ScrollPayload, UndoStack } from '@vmscloud/moz-ui-grid-core';
+import { IContextMenuConfig } from './toolbar';
+/**
+ * MozGridReactCore Props
+ *
+ * Vue 버전(MozGridVueCoreProps)과 동일 시그니처. 이벤트는 별도 onXxx 콜백 prop으로 제공.
+ */
+export interface MozGridReactCoreProps {
+    fields: FieldDef[];
+    data?: Record<string, unknown>[];
+    mode?: 'flat' | 'pivot';
+    pivotRowFields?: PivotRowField[];
+    pivotColumnFields?: PivotColumnField[];
+    pivotValueFields?: PivotValueField[];
+    height?: string | number;
+    keyFields?: string[];
+    theme?: 'light' | 'dark' | 'auto';
+    rowHeight?: number;
+    headerHeight?: number;
+    showHeader?: boolean;
+    resizableColumns?: boolean;
+    reorderableColumns?: boolean;
+    /** @deprecated `rowHeader`를 사용하세요 (core가 warn 후 자동 매핑) */
+    showRowHeader?: boolean | {
+        width?: number;
+    };
+    /** 행 헤더 (구 showRowHeader) — 객체형으로 width/cellRenderer/headerRenderer 지정 */
+    rowHeader?: boolean | RowHeaderConfig;
+    rowSelection?: RowSelectionConfig;
+    cellSelection?: CellSelectionConfig;
+    cellSelectionImpliesRows?: boolean;
+    rowModel?: 'client' | 'server';
+    endReachedThresholdRows?: number;
+    editable?: boolean;
+    tooltipMode?: 'none' | 'overflow' | 'always';
+    alternatingRows?: boolean;
+    autoFitColumns?: boolean;
+    dynamicRowHeights?: boolean;
+    reorderableRows?: boolean;
+    locale?: string;
+    engine?: 'aq' | 'native';
+    useWorker?: boolean;
+    loader?: LoaderConfig;
+    preventKeyEdit?: boolean;
+    showStatusBar?: boolean;
+    showDragHandleColumn?: boolean;
+    undoStack?: InstanceType<typeof UndoStack>;
+    formatRow?: FormatRowCallback;
+    translations?: PartialTranslationMap;
+    rowStyle?: string;
+    headerStyle?: string;
+    rowHeightChangeThreshold?: number;
+    group?: GroupConfig;
+    columnGroups?: ColumnGroupDef[];
+    rowTemplate?: FieldRowTemplate;
+    /** PureSheet 인스턴스가 준비됐을 때 */
+    onReady?: (grid: unknown) => void;
+    onDataLoaded?: () => void;
+    onRowClick?: (payload: unknown) => void;
+    onRowDblclick?: (payload: unknown) => void;
+    onRowPinned?: (payload: unknown) => void;
+    onRowUnpinned?: (payload: unknown) => void;
+    onRowReordered?: (payload: unknown) => void;
+    onCellClick?: (payload: unknown) => void;
+    onCellDblclick?: (payload: unknown) => void;
+    onCellChange?: (payload: unknown) => void;
+    onCellBeforeEdit?: (payload: unknown) => void;
+    onCellEditCommitting?: (payload: unknown) => void;
+    onCellEditCommitted?: (payload: unknown) => void;
+    onCellTooltip?: (payload: unknown) => void;
+    onSelectionChanged?: (payload: unknown) => void;
+    onColumnResize?: (payload: unknown) => void;
+    onColumnReorder?: (payload: unknown) => void;
+    onColumnPin?: (payload: unknown) => void;
+    onColumnVisibility?: (payload: unknown) => void;
+    onSortChanged?: (payload: unknown) => void;
+    onFilterChanged?: (payload: unknown) => void;
+    onScroll?: (payload: ScrollPayload) => void;
+    onEndReached?: (payload: ScrollEndReachedPayload) => void;
+    onUndoStateChange?: (payload: unknown) => void;
+    onClipboardCopy?: (payload: unknown) => void;
+    onClipboardPaste?: (payload: unknown) => void;
+    onValidationChanged?: (payload: unknown) => void;
+    onColumnGroupToggle?: (payload: unknown) => void;
+    onGroupToggle?: (payload: unknown) => void;
+    onGroupBatchToggle?: (payload: unknown) => void;
+    onContextMenu?: (payload: unknown) => void;
+    /** 자식: 템플릿 등록 컴포넌트들 */
+    children?: React.ReactNode;
+}
+/**
+ * MozGridReact Props (toolbar/footer 등 UI 포함).
+ */
+export interface MozGridReactProps extends MozGridReactCoreProps {
+    name?: string;
+    useToolBox?: boolean;
+    useToolBoxSetting?: boolean;
+    useExtendFooter?: boolean;
+    useSummaryFooter?: boolean;
+    useSort?: boolean;
+    useCustomCell?: boolean;
+    contextMenuConfig?: IContextMenuConfig;
+    useContextMenu?: boolean;
+    loading?: boolean;
+    emptyState?: {
+        isCustomState?: boolean;
+        headerMsg?: string;
+        contentMsg?: string;
+        useImg?: boolean;
+        selectImg?: 'Custom' | 'Result' | 'Data' | 'Search';
+    };
+}
+/** Props → PureSheetConfig 변환에 사용하는 키 목록 (Vue와 동일) */
+export declare const CONFIG_PROP_KEYS: readonly ["keyFields", "theme", "rowHeight", "headerHeight", "showHeader", "resizableColumns", "reorderableColumns", "showRowHeader", "rowHeader", "rowSelection", "cellSelection", "cellSelectionImpliesRows", "rowModel", "endReachedThresholdRows", "editable", "tooltipMode", "alternatingRows", "autoFitColumns", "dynamicRowHeights", "reorderableRows", "locale", "engine", "useWorker", "loader", "preventKeyEdit", "showStatusBar", "showDragHandleColumn", "undoStack", "formatRow", "translations", "rowStyle", "headerStyle", "rowHeightChangeThreshold"];
+export declare const FLAT_ONLY_PROP_KEYS: readonly ["group", "columnGroups", "rowTemplate"];
+export declare const BRIDGED_EVENTS: PureSheetEventType[];
+/** PureSheet 이벤트 → onXxx prop 이름 매핑 */
+export declare const EVENT_TO_PROP: Record<PureSheetEventType, keyof MozGridReactCoreProps>;