release: Quire 디자인 시스템 Phase A~G · 모바일 코드블럭 넘침 수정 · 환영 화면 제거

.github/ISSUE_TEMPLATE/system-change.yml

@@ -0,0 +1,37 @@
+name: 시스템 변경 제안
+description: 새 토큰·컴포넌트·패턴이 필요하거나 기존 규칙을 바꾸자고 제안합니다. (docs/process/change-flow.md)
+title: '[System]: '
+labels: ['system-change']
+body:
+  - type: dropdown
+    id: kind
+    attributes:
+      label: 무엇을 바꾸나요
+      options:
+        - 토큰 (색·글자·모서리·모션)
+        - 컴포넌트 (새 ui 컴포넌트 · variant/size 추가)
+        - 패턴 (결정 트리)
+        - 문구 규칙 (톤·용어집)
+    validations:
+      required: true
+  - type: textarea
+    id: need
+    attributes:
+      label: 왜 필요한가요
+      description: 어떤 화면에서 무엇을 하려는데 막혔는지. 스크린샷이 있으면 좋아요.
+    validations:
+      required: true
+  - type: textarea
+    id: existing
+    attributes:
+      label: 기존 것으로는 왜 안 되나요
+      description: docs/registry.md · docs/patterns · docs/foundations.md 에서 검토한 것
+    validations:
+      required: true
+  - type: textarea
+    id: proposal
+    attributes:
+      label: 제안
+      description: 이름·값·쓸 때/피할 때. 다른 대안이 있었다면 함께.
+    validations:
+      required: true

.github/pull_request_template.md

@@ -0,0 +1,20 @@
+## 요약
+
+<!-- 무엇을 왜 바꿨는지 -->
+
+## 화면이 바뀌는 곳
+
+<!-- 없으면 "없음". 있으면 전/후 스크린샷 -->
+
+## UI 를 바꿨다면 (`docs/ai-review-checklist.md`)
+
+- [ ] `docs/registry.md` 의 기존 컴포넌트를 썼다 (새로 만들었다면 JSDoc + `*.meta.ts` + 스토리)
+- [ ] 상황이 패턴에 해당하면 `docs/patterns/README.md` 의 결정 트리를 따랐다
+- [ ] 문구는 `docs/copy.md` — 해요체, `…`, 용어집
+- [ ] 로딩·오류·빈 상태·성공을 확인했다
+- [ ] 스토리가 있다면 Storybook Accessibility 패널 위반 0
+- [ ] 새 토큰·컴포넌트·패턴이면 문서를 먼저 고쳤다 (change-flow(`docs/process/change-flow.md`))
+
+## 검증
+
+- [ ] CI 통과 (lint · typecheck · test · tokens:check · build)

.github/workflows/ci.yml

@@ -0,0 +1,59 @@
+name: CI
+
+# develop·main 으로 가는 PR 마다 검수 5종을 돌린다 (AGENTS.md "명령어", docs/process/change-flow.md).
+# 로컬 git hook 은 lint·typecheck·build 만 돌고, 건너뛸 수도 있어서 여기서 다시 막는다.
+on:
+  pull_request:
+    branches:
+      - develop
+      - main
+  workflow_dispatch:
+
+concurrency:
+  group: ci-${{ github.event.pull_request.number || github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  verify:
+    runs-on: ubuntu-latest
+    timeout-minutes: 20
+    env:
+      # 검사용 빌드라 실제 API 주소가 필요 없다. index.html 의 %VITE_API_HOST% 치환만 채운다.
+      VITE_API_BASE_URL: http://localhost:3000
+      VITE_API_HOST: localhost:3000
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+
+      - name: Setup Yarn via Corepack
+        run: |
+          corepack enable
+          corepack prepare yarn@3.6.3 --activate
+
+      - name: Install dependencies
+        run: corepack yarn install --immutable
+
+      - name: Lint
+        run: corepack yarn lint
+
+      - name: Typecheck
+        run: corepack yarn typecheck
+
+      - name: Test
+        run: corepack yarn test
+
+      - name: Tokens check
+        run: corepack yarn tokens:check
+
+      # tokens:check 가 다시 만든 docs/registry.md·contrast-matrix.md 가 커밋본과 다르면
+      # meta·토큰을 고치고 생성 파일을 커밋하지 않은 것이다.
+      - name: Generated docs are committed
+        run: git diff --exit-code -- docs/registry.md docs/tokens/contrast-matrix.md
+
+      - name: Build
+        run: corepack yarn build

.gitignore

@@ -64,3 +64,4 @@ web-dist.tar.gz
 #ai
 /.omx
 /.omc
+storybook-static

.prettierignore

@@ -4,3 +4,6 @@ pnpm-lock.yaml
 LICENSE.md
 tsconfig.json
 tsconfig.*.json
+# yarn tokens:check 가 생성 — 스크립트 출력 그대로 둔다
+docs/tokens/contrast-matrix.md
+docs/registry.md

.storybook/main.ts

@@ -6,7 +6,7 @@ import svgr from 'vite-plugin-svgr';
 
 const config: StorybookConfig = {
   stories: ['../src/renderer/src/components/**/*.stories.@(ts|tsx)'],
-  addons: ['@storybook/addon-essentials', '@storybook/addon-interactions'],
+  addons: ['@storybook/addon-essentials', '@storybook/addon-interactions', '@storybook/addon-a11y'],
   framework: {
     name: '@storybook/react-vite',
     options: {}

AGENTS.md

@@ -9,13 +9,15 @@ yarn dev                  # Electron 개발 모드 (main + preload + renderer HM
 yarn web:dev              # 렌더러만 브라우저에서 (src/renderer/vite.config.ts)
 yarn lint                 # ESLint
 yarn typecheck            # tsc: node(main/preload) + web(renderer) 두 프로젝트 모두
+yarn test                 # vitest
 yarn build                # typecheck + electron-vite build
 yarn web:build            # 웹 정적 빌드 → src/renderer/dist
 yarn storybook            # 컴포넌트 샌드박스 (포트 6006)
+yarn tokens:check         # 토큰·대비·패턴 규칙 검사 + docs/registry.md 생성
 yarn swagger:local        # OpenAPI → src/renderer/src/api/generated 재생성
 ```
 
-테스트 러너는 없다. 검증 수단은 `lint` + `typecheck` + Storybook.
+테스트는 `yarn test`(vitest, `*.test.ts(x)`). 검증 수단은 `lint` + `typecheck` + `test` + `build` + `tokens:check` + Storybook.
 
 `yarn swagger:local`은 package.json에서 EC2 주소를 가리킨다. 로컬 백엔드(`../Qode-Server`)
 스펙으로 생성하려면 스크립트의 `-p` URL을 `http://localhost:3000/docs/json`으로 바꿔서 실행한다.
@@ -82,6 +84,16 @@ vanilla-extract 플러그인이 세 곳(electron.vite, renderer vite, storybook)
 아이콘은 SVGR(`?react`)로 불러 `components/icons/iconRegistry.ts`에 등록하고 `<Icon name="..." />`로 쓴다.
 새 아이콘은 `icons/raw/`에 넣고 레지스트리에 추가해야 타입에 잡힌다.
 
+### 디자인 시스템 (Quire) — UI 작업 전에 읽을 것
+
+1. [`docs/registry.md`](docs/registry.md) — 컴포넌트별 쓸 때·피할 때·옵션. 새로 만들기 전에 여기서 찾는다.
+2. [`docs/patterns/`](docs/patterns/README.md) — 확인·에러·피드백·빈 상태·로딩의 결정 트리.
+3. [`docs/foundations.md`](docs/foundations.md) — 토큰(색·글자·모서리·모션)의 의미. 정체성·원칙은 [`SYSTEM.md`](SYSTEM.md).
+   화면 문구는 [`docs/copy.md`](docs/copy.md) — 해요체, `…`, 용어집.
+4. 끝나면 [`docs/ai-review-checklist.md`](docs/ai-review-checklist.md) 로 검수하고 `yarn tokens:check` 를 돌린다.
+
+새 ui 컴포넌트는 JSDoc(✅ Use / ❌ Don't) + `Name.meta.ts` + 스토리를 함께 만든다. `docs/registry.md` 는 생성 파일이라 직접 고치지 않는다.
+
 ### 컴포넌트 배치
 
 `ui/`(범용, Storybook 스토리 동반) → `layout/`(AppShell·AuthFrame·ProjectTabs) → `feature/`(도메인 모달·테이블) → `pages/`.
@@ -93,6 +105,12 @@ vanilla-extract 플러그인이 세 곳(electron.vite, renderer vite, storybook)
 - pre-push: `build` (즉 typecheck가 두 번 돌아 푸시가 느리다)
 - commit-msg: 브랜치 이름의 숫자를 이슈 번호로 뽑아 커밋 제목 끝에 ` (#123)` 자동 추가
 
+## CI
+
+`.github/workflows/ci.yml` — develop·main 으로 가는 PR 마다 lint · typecheck · test · tokens:check · build.
+`tokens:check` 가 다시 만든 `docs/registry.md`·`docs/tokens/contrast-matrix.md` 가 커밋본과 다르면 실패하니 함께 커밋한다.
+토큰·컴포넌트·패턴을 새로 만들거나 바꿀 때는 [`docs/process/change-flow.md`](docs/process/change-flow.md), 문서끼리 어긋나면 [`docs/process/sot-priority.md`](docs/process/sot-priority.md).
+
 ## 배포
 
 `v*` 태그 푸시 → Electron 3플랫폼 패키징(`release.yml`). `main` 브랜치 푸시 → 웹 정적 빌드 EC2 배포(`web-deploy-ec2.yml`).