컬럼 편집
표에 보일 컬럼을 고르고 순서를 바꿔요. PC는 팝오버, 폰은 아래 시트예요.
모바일PCColumnManager
고르기#
- 화면 블록(스크리너)이에요. 공용 부품이 아니라 공용 부품을 조립한 화면 조각이에요. 다른 화면에 같은 일이 필요하면 이 블록을 다시 만들지 말고 정본 부품으로 조립해요.
인터페이스#
타입에서 자동으로 뽑은 표예요.
ColumnManager#
| 속성 | 기본값 | 타입 | 설명 |
|---|---|---|---|
| open* | - | boolean | 열렸는지예요. |
| onClose* | - | () => void | 닫아야 할 때 불러요. |
| anchorRef* | - | RefObject<HTMLElement | null> | 창을 붙일 기준 요소예요. |
| order* | - | string[] | |
| hidden* | - | string[] | |
| setOrder* | - | (o: string[]) => void | |
| setHidden* | - | (h: string[]) => void | |
| onReset* | - | () => void |
* 필수예요. 표는 타입에서 자동으로 뽑았어요.
접근성#
- 체크·순서 버튼에 이름이 있어요.
- 폰 시트는 Sheet의 접근성(초점 가두기 · Esc)을 그대로 써요.
플랫폼별 차이#
| 플랫폼 | 차이 |
|---|---|
| 모바일 | PC와 같은 모양이에요. 글자 역할만 폰 크기로 바뀌어요. |
| PC | 마우스가 있는 기기에서만 hover가 켜지고, 키보드 초점 링이 보여요. |