Composition Patterns

Zustand / Validation / Styling / TypeScript

• zustand-childrenmap-staleness - childrenMap stale → elementsMap 최신 조회
• validation-input-boundary / validation-error-boundary
• style-no-inline-tailwind / style-tv-variants / style-react-aria-prefix / style-overlay-s2-pattern
• style-action-icon-button — ActionIconButton 사용 (.button-base 우회, tooltip 내장)
• type-no-any / type-explicit-return

PIXI / Security / Spec

• pixi-direct-container / pixi-hybrid-layout-engine / pixi-container-hit-rect
• postmessage-origin-verify - origin 검증 필수
• spec-build-sync / spec-value-sync

layoutVersion, order_num, WASM 초기화, display 전환, Field Component, Spec↔CSS 경계 등의 상세 CRITICAL 규칙은 .Codex/rules/ (canvas-rendering.md, layout-engine.md, state-management.md)에 자동 로드됩니다.

HIGH (강력 권장)

• arch-reference-impl / spec-single-source-truth / spec-shape-rendering / spec-token-usage
• spec-text-style — extractSpecTextStyle() 사용, fontSize/fontWeight 하드코딩 금지
• spec-container-dimension-injection — _containerWidth/_containerHeight props 주입
• style-css-reuse / react-aria-hooks-required / react-aria-no-manual-aria / react-aria-stately-hooks
• supabase-no-direct-calls / supabase-service-modules / supabase-rls-required
• zustand-factory-pattern / zustand-modular-files
• postmessage-buffer-ready / inspector-inline-styles / inspector-history-sync
• pixi-border-box-model / pixi-text-isleaf / pixi-hitarea-absolute / pixi-viewport-culling

MEDIUM

• pixi-no-flex-height / perf-checklist / perf-map-set-lookups / test-stories-required

상세 레퍼런스

서브에이전트 위임 가이드라인

수정 금지 패턴 (Protected Patterns)

1. _hasChildren 패턴 (삭제/이동/조건 변경 금지)
2. CHILD_COMPOSITION_EXCLUDE_TAGS 관련 로직
3. ElementSprite.tsx의 _hasChildren 주입 로직
4. rearrangeShapesForColumn / SPEC_RENDERS_ALL_TAGS_SET 가드
5. TAG_SPEC_MAP 등록 로직

위임 템플릿

## 작업 범위

[구체적 수정 내용만 기술]

## 수정 대상 파일

[파일 목록]

## 수정 패턴

[Before → After 예시 코드]

## 수정 금지

- \_hasChildren, COMPLEX_COMPONENT_TAGS, shapes early return, 요청 범위 외 리팩토링

공통 세션 프로토콜

세션 시작

1. Read .Codex/progress.md — 현재 상태/알려진 이슈
2. Read .Codex/agent-memory/{자신}/MEMORY.md — 이전 세션 맥락
3. 중복 작업 방지, 막힌 지점 이어가기

세션 종료

1. progress.md 갱신 (완료/진행 중/이슈)
2. agent-memory 갱신 (발견사항 기록)
3. 빌드 통과, 커밋 가능한 상태 보장

에러 복구

• 같은 에러 3회 반복 금지 → 2회 실패 후 전략 전환
• any/@ts-ignore 우회 금지
• 불확실 시 질문, 해결 불가 시 에스컬레이션

출력 크기 제한

• 반환은 1,000~2,000 토큰 이내 구조화된 요약
• 상세 → 파일 저장 후 경로만 반환

ADR

• ADR-001 Zustand | ADR-002 ITCSS+tv() | ADR-003 Canvas
• ADR-004 iframe | ADR-005 Text Wrap | ADR-008 Taffy
• Component Spec 단일 소스 아키텍처

규칙 효과 측정

규칙의 실제 효과를 추적하여 컨텍스트 예산을 최적화합니다.

측정 템플릿

리뷰어 에이전트가 .Codex/agent-memory/reviewer/MEMORY.md에 기록:

정리 기준

• 위반 0 + 3개월 이상: Codex가 내재화했을 가능성 → 제거 후보 (컨텍스트 절약)
• False Positive > 50%: 규칙 조건이 너무 넓음 → 조건 좁히기
• 위반 빈번 + 실효성 LOW: 규칙이 모호함 → Why 보강 또는 코드 레벨 방지로 전환

Evals

Positive (발동해야 하는 경우)

• "캔버스에서 텍스트가 잘려요" → ✅ 캔버스 렌더링 규칙 참조 필요
• "Zustand store에 슬라이스 추가하려면?" → ✅ 상태 관리 규칙 참조
• "이 코드가 composition 컨벤션에 맞나?" → ✅ 규칙 인덱스 조회
• "Spec 파일 새로 만들 때 주의사항?" → ✅ Spec 빌드/등록 규칙

Negative (발동하면 안 되는 경우)

• "README 업데이트해줘" → ❌ 문서 작업, 코드 패턴 무관
• "git commit 해줘" → ❌ Git 작업
• "이 React 훅 설명해줘" (일반 React) → ❌ composition 특화 아님
• "TypeScript 타입 추론 원리가 뭐야?" → ❌ 일반 TS 지식