Cloudwiki

Cloudwiki/에디터/표

정보:
표를 빠르게 작성·편집하는 방법을 안내합니다. 표 자체의 마크다운 문법(파이프 표, 정렬, 셀 병합 토큰) 은 [[Cloudwiki/위키 문법 가이드]] 의 *표* 절을 참고하세요.


# 개요

Cloudwiki 의 에디터는 표 작성·편집을 두 단계로 지원합니다.

1. **표 삽입 팝오버** : 툴바의  표 버튼으로 빈 표/CSV 표를 생성합니다.
2. **표 인라인 툴바** : 표 안 셀에 커서를 두면 셀 바로 위에 작은 부동(floating) 툴바가 떠 정렬·행/열 추가삭제·셀 병합·색상 삽입·간격 정렬을 한 번에 처리합니다.


---

# 표 삽입

툴바의 표 버튼을 누르면 작은 팝오버가 열립니다.

| 항목 | 동작 |
| --- | --- |
| **그리드 (8 × 10)** | 마우스를 움직여 행/열 수를 선택하고 클릭하면 빈 마크다운 표가 삽입됩니다. |
| **CSV로 삽입** | CSV 텍스트를 붙여넣어 표로 변환합니다 (쉼표 / 세미콜론 / 탭 구분 자동 감지). |



# 표 인라인 툴바

표 안 셀(헤더 · 본문 · 구분선 어디든) 에 텍스트 커서를 두면 셀 바로 위에 작은 툴바가 자동으로 떠오릅니다. 커서가 표 밖으로 나가거나 에디터가 포커스를 잃으면 즉시 사라집니다.


**버튼 구성**

   |    |    |     |  


## 정렬
  

현재 커서가 속한 **열** 의 정렬 방향을 바꿉니다. 구분선 라인의 해당 셀만 `:---` / `:---:` / `---:` 로 갱신하며, 다른 셀의 정렬은 보존됩니다. 현재 적용된 정렬은 버튼이 활성화된 상태로 표시됩니다.

## 행 추가 / 삭제
  

| 버튼 | 동작 | 가드 |
| --- | --- | --- |
|  위에 행 삽입 | 현재 행 위에 빈 행을 끼웁니다. | 헤더/구분선 위에는 끼울 수 없어 비활성화 (GFM 표 구조 보존). |
|  아래에 행 삽입 | 현재 행 아래에 빈 행을 끼웁니다. 헤더·구분선에서 누르면 본문 첫 줄로 자동 보정. |  |
|  현재 행 삭제 | 현재 본문 행을 삭제합니다. | 헤더·구분선 행이나 마지막 본문 행은 삭제할 수 없도록 비활성화 (표 모양 보존). |

## 열 추가 / 삭제
  

| 버튼 | 동작 | 가드 |
| --- | --- | --- |
|  왼쪽에 열 추가 | 현재 열 왼쪽에 빈 열을 끼웁니다. 모든 행에 빈 셀이 추가되고, 구분선에는 `---` 토큰이 추가됩니다. | — |
|  오른쪽에 열 추가 | 현재 열 오른쪽에 빈 열을 추가합니다. | — |
|  현재 열 삭제 | 현재 열을 모든 행에서 일괄 제거합니다. | 마지막 한 열만 남았을 때 비활성화. |

## 셀 병합 
   

병합 버튼 4종은 **현재 셀이 비어 있을 때** 만 나타납니다. 클릭하면 셀 내부에 다음 토큰이 삽입되어 인접 셀과 합쳐집니다.

| 버튼 | 토큰 | 효과 |
| --- | --- | --- |
|  | `{<}` | 좌측 셀과 가로 병합 (colspan 확장) |
|  | `{>}` | 우측 셀과 가로 병합 |
|  | `{^}` | 상단 셀과 세로 병합 (rowspan 확장) |
|  | `{><}` | 좌우 양쪽으로 모음 (좌+우 동시 병합) |

>  셀에 이미 텍스트가 들어 있으면 버튼이 숨겨집니다.

## 색상 삽입


표 인라인 툴바의  버튼은 [[Cloudwiki/에디터/툴바]] 의 *색상 삽입* 과 동일한 모달을 엽니다. 팔레트 탭에서 등록된 팔레트를 고르거나, 커스텀 색상 탭에서 배경/글자색을 HSV/HEX 로 직접 지정해 표 셀 안에 `{palette:이름}` 또는 `{bg:#RRGGBB}{color:#RRGGBB}` 토큰을 삽입합니다.

표 셀에 색상을 적용하면 다음과 같이 동작합니다 — 자세한 동작 규칙은 [[Cloudwiki/위키 문법 가이드]] 참고.

| 입력 | 적용 위치 |
| --- | --- |
| 셀 시작 직후 `{bg:...}` | 그 셀의 배경색 |
| 셀 시작 직후 `{palette:...}` | 그 셀의 배경/글자색 (팔레트 변형 적용) |
| 셀 본문 중간 `{color:...}` | 인라인 글자색 (이후 텍스트만) |


# 셀 안 줄바꿈

표 셀 안에 텍스트 커서를 두고 Shift+Enter 를 누르면 현재 커서 위치에 `{br}` 토큰이 자동으로 삽입됩니다. 표준 마크다운은 표 셀이 단일 라인이어야 하므로 직접 줄바꿈을 입력할 수 없지만, `{br}` 인라인 토큰을 통해 셀 안에서 여러 줄을 표현할 수 있습니다.

| 조건 | 동작 |
| --- | --- |
| 표 본문 셀에 커서가 있을 때 | 커서 위치에 `{br}` 4글자를 삽입하고 커서를 토큰 뒤로 이동. |
| 구분선 행에 커서가 있을 때 | 단축키가 무시되고 에디터 기본 동작(개행) 으로 폴백. |
| 셀 경계 밖(leading `\|` 앞 / trailing `\|` 뒤) 에 커서가 있을 때 | 단축키가 무시되고 기본 개행 동작 유지. |
| 표 밖에 커서가 있을 때 | 단축키가 무시되고 기본 개행 동작 유지. |
| 자동완성 비활성화 시 | 단축키 동작이 비활성화됩니다. |

저장 후 본문이 렌더링될 때 `{br}` 은 셀 안에서 실제 줄바꿈으로 표시됩니다. 코드 블록과 인라인 코드 안에서는 그대로 보존되므로 문법 예시에 안전하게 사용할 수 있습니다.

>  `{br}` 토큰은 표 셀뿐 아니라 트랜스클루전 인자 · `:::` 블록 디렉티브 · `{badge:...}` 등 인라인 컴포넌트 내부에서도 동일하게 줄바꿈을 만들어냅니다. 자세한 문법은 [[Cloudwiki/위키 문법 가이드/컴포넌트]] 의 *줄바꿈* 절을 참고하세요.