본문으로 건너뛰기

아키텍처

topgrid는 13개 패키지로 구성된 monorepo 구조입니다. 공개(MIT) 패키지와 Pro(상용 라이선스) 패키지로 분류됩니다.

패키지 목록​

패키지분류설명
@topgrid/gridOpen (MIT)메타 패키지 — 전체 공개 패키지 re-export
@topgrid/grid-coreOpen (MIT)TanStack Table 추상화 wrapper + useGridState 핵심 hook
@topgrid/grid-featuresOpen (MIT)정렬·필터·페이지네이션 등 공통 기능 빌더 옵션
@topgrid/grid-exportOpen (MIT)Excel/CSV/PDF 내보내기 (xlsx, jspdf peer)
@topgrid/grid-renderersOpen (MIT)셀 렌더러 컴포넌트 모음 (날짜·숫자·배지 등)
@topgrid/grid-licenseOpen (MIT)런타임 Pro 라이선스 검증 모듈
@topgrid/grid-pro-aggPro집계(Aggregation) — 그룹별 합계·평균·카운트
@topgrid/grid-pro-datamapPro데이터 매핑 — 코드→라벨 변환, 계층형 셀렉트
@topgrid/grid-pro-headerPro고급 헤더 — 다중 헤더 병합, 고정 헤더
@topgrid/grid-pro-masterPro마스터-디테일 — 행 확장 + 중첩 그리드
@topgrid/grid-pro-mergingPro셀 병합 — 동일 값 자동 rowSpan/colSpan
@topgrid/grid-pro-rangePro범위 선택 — 드래그 셀 선택·복사·붙여넣기
@topgrid/grid-pro-trackingPro변경 추적 — 편집 행·셀 dirty 상태 관리

의존성 다이어그램​

graph TD
  subgraph Open["Open (MIT)"]
    grid["@topgrid/grid<br/>(메타)"]
    grid-core["@topgrid/grid-core"]
    grid-features["@topgrid/grid-features"]
    grid-export["@topgrid/grid-export"]
    grid-renderers["@topgrid/grid-renderers"]
    grid-license["@topgrid/grid-license"]
  end

  subgraph Pro["Pro (상용 라이선스)"]
    pro-agg["@topgrid/grid-pro-agg"]
    pro-datamap["@topgrid/grid-pro-datamap"]
    pro-header["@topgrid/grid-pro-header"]
    pro-master["@topgrid/grid-pro-master"]
    pro-merging["@topgrid/grid-pro-merging"]
    pro-range["@topgrid/grid-pro-range"]
    pro-tracking["@topgrid/grid-pro-tracking"]
  end

  subgraph Peers["peer dependencies"]
    react["react ^18"]
    tanstack["@tanstack/react-table ^8"]
    virtual["@tanstack/react-virtual ^3"]
  end

  grid --> grid-core
  grid --> grid-features
  grid --> grid-renderers
  grid-core --> grid-features
  pro-agg --> grid-core
  pro-datamap --> grid-core
  pro-header --> grid-core
  pro-master --> grid-core
  pro-merging --> grid-core
  pro-range --> grid-core
  pro-tracking --> grid-core
  pro-agg --> grid-license
  pro-datamap --> grid-license
  pro-header --> grid-license
  pro-master --> grid-license
  pro-merging --> grid-license
  pro-range --> grid-license
  pro-tracking --> grid-license
  grid-core --> react
  grid-core --> tanstack
  grid-core --> virtual

디렉토리 구조​

topgrid/
├── packages/           # 공개 배포 패키지 (pnpm publish)
│   ├── grid/           # MIT — 메타 패키지
│   ├── grid-core/      # MIT — 핵심 hook
│   ├── grid-features/  # MIT — 기능 빌더
│   ├── grid-export/    # MIT — 내보내기
│   ├── grid-renderers/ # MIT — 렌더러
│   ├── grid-license/   # MIT — 라이선스 검증
│   ├── grid-pro-agg/   # Pro — 집계
│   ├── grid-pro-datamap/  # Pro — 데이터 매핑
│   ├── grid-pro-header/   # Pro — 고급 헤더
│   ├── grid-pro-master/   # Pro — 마스터-디테일
│   ├── grid-pro-merging/  # Pro — 셀 병합
│   ├── grid-pro-range/    # Pro — 범위 선택
│   └── grid-pro-tracking/ # Pro — 변경 추적
└── apps/
    └── docs/           # private — Docusaurus + TypeDoc API 문서 사이트

Pro 패키지 라이선스 활성화​

Pro 패키지 사용 시 @topgrid/grid-license를 통해 런타임 라이선스 검증이 실행됩니다. 앱 진입점에서 라이선스 키를 한 번 초기화하세요.

import { initLicense } from '@topgrid/grid-license';

initLicense('YOUR-LICENSE-KEY');