Core 행·셀·범위 선택

comins-table@0.2.2React

0.2.0: 이 페이지의 타입과 helper는 루트 comins-table의 React 상태 계약입니다. 중립 /core는 별도 타입 계약을 사용합니다. 마이그레이션 가이드에서 import 경로와 셀 정책 차이를 확인합니다.

Core 선택은 안정적인 행 ID와 컬럼 ID로 관리합니다. React ref의 행 선택 메서드가 받는 인덱스와 구분하십시오. 낮은 수준의 setter는 ID 존재 여부를 검증하지 않으므로 유효한 ID를 전달합니다.

긴 구조적 반환 선언은 동일한 CominsTableState<TData>로 표기합니다. 배포 선언과의 양방향 타입 호환성을 검사합니다.

selectRow

export declare function selectRow<TData>(state: CominsTableState<TData>, rowId: CominsRowId, options?: CominsRowSelectionOptions): CominsTableState<TData>;

기본 단일 행 선택. multi: true는 기존 선택에 추가하고 toggle: true는 이미 선택된 행을 해제합니다. 다른 셀/범위 상태는 유지합니다.

selectRows

export declare function selectRows<TData>(state: CominsTableState<TData>, rowIds: readonly CominsRowId[]): CominsTableState<TData>;

행 선택 ID 목록을 전달한 배열의 복사로 교체합니다. 자동 중복 제거는 하지 않습니다.

selectCell

export declare function selectCell<TData>(state: CominsTableState<TData>, cell: CominsCellAddress, options?: CominsCellSelectionOptions): {
    columnOrder: string[];
    columnGroups: import("./core-compat").CominsTableRuntimeColumnGroup[];
    columnGroupState: Record<string, import("./core-compat").CominsColumnGroupRuntimeState>;
    columns: CominsTableRuntimeColumn<TData, unknown>[];
    columnState: Record<string, import("./core-compat").CominsColumnRuntimeState>;
    getRowId: (row: TData, index: number) => CominsRowId;
    pagination: CominsPaginationState;
    rowIds: CominsRowId[];
    rows: TData[];
    showHeader: boolean;
    sort: CominsSortState | null;
    sortModel: CominsSortModel;
    theme: CominsTableTheme;
    selection: {
        rowIds: CominsRowId[];
        cell: CominsCellAddress | null;
        cells: CominsCellAddress[];
        range: null;
    };
};

multi/toggle 규칙으로 셀 목록을 갱신하고 활성 cell을 지정합니다. 기존 range는 지웁니다.

selectCellRange

export declare function selectCellRange<TData>(state: CominsTableState<TData>, range: CominsCellRange): {
    columnOrder: string[];
    columnGroups: import("./core-compat").CominsTableRuntimeColumnGroup[];
    columnGroupState: Record<string, import("./core-compat").CominsColumnGroupRuntimeState>;
    columns: CominsTableRuntimeColumn<TData, unknown>[];
    columnState: Record<string, import("./core-compat").CominsColumnRuntimeState>;
    getRowId: (row: TData, index: number) => CominsRowId;
    pagination: CominsPaginationState;
    rowIds: CominsRowId[];
    rows: TData[];
    showHeader: boolean;
    sort: CominsSortState | null;
    sortModel: CominsSortModel;
    theme: CominsTableTheme;
    selection: {
        rowIds: CominsRowId[];
        cell: CominsCellAddress;
        cells: never[];
        range: CominsCellRange;
    };
};

anchor와 focus로 범위를 설정하며 cell은 focus, cells는 빈 배열이 됩니다.

clearCominsCellRange

export declare function clearCominsCellRange<TData>(state: CominsTableState<TData>): {
    columnOrder: string[];
    columnGroups: import("./core-compat").CominsTableRuntimeColumnGroup[];
    columnGroupState: Record<string, import("./core-compat").CominsColumnGroupRuntimeState>;
    columns: CominsTableRuntimeColumn<TData, unknown>[];
    columnState: Record<string, import("./core-compat").CominsColumnRuntimeState>;
    getRowId: (row: TData, index: number) => CominsRowId;
    pagination: CominsPaginationState;
    rowIds: CominsRowId[];
    rows: TData[];
    showHeader: boolean;
    sort: CominsSortState | null;
    sortModel: CominsSortModel;
    theme: CominsTableTheme;
    selection: {
        cell: CominsCellAddress | null;
        cells?: CominsCellAddress[];
        rowIds: CominsRowId[];
        range: null;
    };
};

range만 null로 만듭니다. 활성 cell·선택 셀 목록·행 선택은 유지합니다.

clearCominsSelection

export declare function clearCominsSelection<TData>(state: CominsTableState<TData>): CominsTableState<TData>;

행·셀·범위 선택을 모두 빈 상태로 초기화합니다.

isCominsRowSelected

export declare function isCominsRowSelected<TData>(state: CominsTableState<TData>, rowId: CominsRowId): boolean;

selection.rowIds에 ID가 포함되어 있는지 반환합니다.

isCominsCellSelected

export declare function isCominsCellSelected<TData>(state: CominsTableState<TData>, cell: CominsCellAddress): boolean;

개별 cells 목록, 또는 목록이 비어 있으면 활성 cell과 비교합니다. 사각 범위 포함 여부는 별도 함수로 판단합니다.

getCominsSelectedCellRange

export declare function getCominsSelectedCellRange<TData>(state: CominsTableState<TData>, range?: CominsCellRange | null, rowIds?: readonly CominsRowId[]): CominsCellAddress[];

기본 state.selection.range와 state.rowIds를 사용하여 사각 영역의 셀 주소를 행 우선으로 반환합니다. 숨긴 컬럼은 제외하며 범위가 없거나 끝점을 찾지 못하면 빈 배열입니다. 정렬·필터된 화면은 그 표시 순서의 rowIds를 전달합니다.

isCominsCellInSelectedRange

export declare function isCominsCellInSelectedRange<TData>(state: CominsTableState<TData>, cell: CominsCellAddress, rowIds?: readonly CominsRowId[]): boolean;

현재 range에 셀이 포함되는지 반환합니다. rowIds를 생략하면 원본 순서입니다.

CominsSelectionState

export type CominsSelectionState = {
    cell: CominsCellAddress | null;
    cells?: CominsCellAddress[];
    range: CominsCellRange | null;
    rowIds: CominsRowId[];
};

속성	동작·기본값
`cell`	활성 셀 또는 null.
`cells`	선택 개별 셀 목록.
`range`	anchor/focus 사각 범위 또는 null.
`rowIds`	선택한 행 ID 목록.

CominsCellAddress

export type CominsCellAddress = {
    columnId: string;
    rowId: CominsRowId;
};

속성	동작·기본값
`columnId`	컬럼 ID.
`rowId`	행 ID.

CominsCellRange

export type CominsCellRange = {
    anchor: CominsCellAddress;
    focus: CominsCellAddress;
};

속성	동작·기본값
`anchor`	범위 시작점.
`focus`	범위의 현재 끝점. 역방향도 가능합니다.

CominsRowSelectionOptions

export type CominsRowSelectionOptions = {
    multi?: boolean;
    toggle?: boolean;
};

속성	동작·기본값
`multi`	기본 false. true이면 기존 선택에 추가합니다.
`toggle`	기본 false. true이면 이미 선택된 항목을 해제합니다.

CominsCellSelectionOptions

export type CominsCellSelectionOptions = {
    multi?: boolean;
    toggle?: boolean;
};

속성	동작·기본값
`multi`	기본 false. true이면 기존 선택에 추가합니다.
`toggle`	기본 false. true이면 이미 선택된 항목을 해제합니다.