@crispy-seed/data-table 0.1.3 → 0.2.1

package/dist/index.d.ts

@@ -27,19 +27,33 @@ interface DataTableSortState {
     dir: DataTableSortDirection;
 }
 
-type DataTableFilterMode = "is" | "isnot";
-interface DataTableColumnFilter {
-    mode: DataTableFilterMode;
-    /**
-     * Checked values. One checked value reads as "is X"/"is not X"; several read as
-     * Attio's "is any of X, Y"/"is not any of X, Y" -- the exact same predicate, just
-     * more values in the set (crisp's own `applyFilters`, `tabletoolbar.tsx`, treats
-     * `isanyof` as membership-in-`values` too). An empty array means the picker is open
-     * with nothing checked yet, not "match nothing" -- see `isFilterActive` below.
-     */
-    values: string[];
+type ToolbarSortDirection = "asc" | "desc";
+/** One toolbar Sort condition -- crisp's `TableToolbar` model (`tabletoolbar.tsx`'s
+ *  `ToolbarSort`), reproduced verbatim: a column key + direction, nothing else. */
+interface ToolbarSort {
+    key: string;
+    dir: ToolbarSortDirection;
+}
+
+/** crisp's own `ToolbarFilterOp` (`tabletoolbar.tsx`), reproduced verbatim so the
+ *  operator vocabulary and its per-kind gating (styled layer's `opsForKind`) match the
+ *  Attio-measured reference exactly rather than drifting to a locally-invented set. */
+type ToolbarFilterOp = "contains" | "doesnotcontain" | "startswith" | "endswith" | "is" | "isnot" | "isanyof" | "empty" | "notempty"
+/** Number columns only. */
+ | "lessthan" | "greaterthan"
+/** Date columns only. */
+ | "before" | "after";
+/** One toolbar Filter condition chip -- crisp's `ToolbarFilter`. `op` is unset right
+ *  after the field is (re)chosen: Attio's own chip shows "Select condition" until an
+ *  operator is actually picked, rather than defaulting silently to one. */
+interface ToolbarFilter {
+    id: string;
+    key: string;
+    op?: ToolbarFilterOp;
+    value: string;
+    /** Checked values for `"isanyof"` -- ignored by every other op. */
+    values?: string[];
 }
-type DataTableFilterState = Record<string, DataTableColumnFilter>;
 
 /**
  * The six aggregations DATATABLE-ATTIO-SPEC.md's ColumnCalc footer offers (crisp's own
@@ -64,6 +78,11 @@ interface DataTableEditOption {
     avatar?: string;
 }
 
+/** Gates which operators (and which value editor) a column's filter condition offers --
+ *  DATATABLE-ATTIO-SPEC.md's `kind`. Defaults to `"text"` when a column doesn't set one
+ *  (`DataTableColumn.kind`). */
+type DataTableColumnKind = "text" | "number" | "date" | "select";
+
 interface DataTableColumn<TRow> {
     /**
      * `data`의 각 행에서 이 열의 값을 찾는 key입니다. `render`가 없으면 `type`에 맞는
@@ -98,10 +117,30 @@ interface DataTableColumn<TRow> {
      *  (GRC의 `Column<T>` 계약과 동일) -- 명시적으로 표시한 열만 검색됩니다. */
     searchable?: boolean;
     /**
-     * 이 열의 값 목록입니다. 지정하면 헤더에 "is / is not / is any of" 체크박스
-     * 필터 피커가 붙습니다 -- 자유 텍스트 열은 생략합니다(필터 UI 없음).
+     * 이 열의 값 목록입니다 (Attio/crisp 툴바 모델, DATATABLE-ATTIO-SPEC.md). 지정하면
+     * 툴바 Filter의 이 열 조건에 "is any of" 연산자(체크박스 피커)가 추가됩니다 -- 자유
+     * 텍스트 열은 생략합니다.
      */
     filterValues?: string[];
+    /**
+     * 툴바 Filter 조건이 이 열에 제공할 연산자 집합(과 값 편집기)을 결정합니다
+     * (DATATABLE-ATTIO-SPEC.md의 `kind`). 생략하면 `"text"`입니다: contains/does not
+     * contain/starts with/ends with/is/is not/empty/not empty. `"number"`는 is/is not/
+     * less than/greater than/empty/not empty(스피너 입력)로, `"date"`는 is/is not/
+     * before/after/empty/not empty(달력 입력)로 바뀝니다. `"select"`는 닫힌 어휘 열의
+     * 텍스트 검색 연산자가 무의미하므로 is/is not/empty/not empty만 남습니다 --
+     * `filterValues`와 짝지으면 "is any of"도 함께 제공됩니다(다른 kind와 동일).
+     */
+    kind?: DataTableColumnKind;
+    /**
+     * 이 열이 행 액션(⋯ 메뉴 등) 열임을 표시합니다. Attio는 행 액션 열을 가로 스크롤 중에도
+     * 절대 스크롤되어 사라지지 않도록 오른쪽 끝에 고정합니다 -- 이 플래그가 있는 열은 테이블
+     * 전체의 `stickyLast`를 켜지 않아도 자동으로 그 고정 + 왼쪽 스크롤 그림자
+     * (`stickyProps`/`stickyLast`가 이미 구현한 것과 동일한 메커니즘, `data-sticky-edge-end`
+     * / `data-scrolled-end`)를 받습니다. 열 목록의 마지막 열이어야 합니다 -- `stickyLast`
+     * 자체가 이미 "마지막으로 보이는 열"만 고정하는 규칙이기 때문입니다.
+     */
+    actions?: boolean;
     /**
      * 이 열의 초기 너비(px)입니다. 생략하면 다른 미지정 열들과 폭을 균등하게 나눠
      * 갖는(flex: 1) 기존 동작을 유지합니다 -- 드래그로 리사이즈하거나 `columnWidths`로
@@ -201,12 +240,26 @@ interface DataTableProps<TRow extends {
     searchPlaceholder?: string;
     /** 검색창의 접근성 이름입니다. */
     searchLabel?: string;
-    /** 제어할 열별 필터 상태입니다. */
-    filters?: DataTableFilterState;
-    /** 비제어 방식으로 사용할 때의 초기 필터 상태입니다. */
-    defaultFilters?: DataTableFilterState;
-    /** 필터 상태가 바뀔 때 호출됩니다. */
-    onFiltersChange?: (filters: DataTableFilterState) => void;
+    /**
+     * 제어할 툴바 Sort 조건 목록입니다 (DATATABLE-ATTIO-SPEC.md의 Attio/crisp
+     * `TableToolbar` 모델 -- 순서가 우선순위입니다, sorts[0]이 이기고 이후 조건은
+     * 동점만 깹니다). 하나라도 있으면 헤더 클릭 정렬(`sort`/`onSortChange`, 위)보다
+     * 우선합니다 -- 헤더 클릭은 툴바에 정렬 조건이 없을 때만 쓰는 보조 수단입니다.
+     */
+    toolbarSorts?: ToolbarSort[];
+    /** 비제어 방식으로 사용할 때의 초기 툴바 정렬 조건 목록입니다. */
+    defaultToolbarSorts?: ToolbarSort[];
+    /** 툴바 정렬 조건 목록이 바뀔 때 호출됩니다. */
+    onToolbarSortsChange?: (sorts: ToolbarSort[]) => void;
+    /**
+     * 제어할 툴바 Filter 조건(칩) 목록입니다 (DATATABLE-ATTIO-SPEC.md의 Attio/crisp
+     * `TableToolbar` 모델) -- 이전의 열별 헤더 "is/is not" 피커를 대체합니다.
+     */
+    toolbarFilters?: ToolbarFilter[];
+    /** 비제어 방식으로 사용할 때의 초기 툴바 필터 조건 목록입니다. */
+    defaultToolbarFilters?: ToolbarFilter[];
+    /** 툴바 필터 조건 목록이 바뀔 때 호출됩니다. */
+    onToolbarFiltersChange?: (filters: ToolbarFilter[]) => void;
     /** 툴바에 행 개수를 표시할지 여부입니다. @default true */
     showCount?: boolean;
     /**
@@ -327,4 +380,4 @@ declare const DataTable: <TRow extends {
 }) => react.ReactElement;
 
 export { DataTable };
-export type { DataTableColumn, DataTableProps };
+export type { DataTableColumn, DataTableColumnKind, DataTableProps, ToolbarFilter, ToolbarFilterOp, ToolbarSort, ToolbarSortDirection };