접두사 참조 표

이 문서는 SLUR UX/UI System에서 사용하는 클래스 접두사를 구조 범위 기준으로 빠르게 확인하기 위한 참조 문서입니다. 접두사는 네이밍 장식이 아니라, UI 구조의 책임을 드러내기 위한 표식입니다.

접두사 사용 기본 원칙

접두사는 구조 범위를 나타냅니다.
같은 구조 범위를 의미하는 접두사는 중첩될 수 없습니다.
내부 요소와 수정자는 단독으로 사용하지 않습니다.
접두사만 보고도 구조 범위를 판단할 수 있어야 합니다.

접두사 참조 표

접두사	의미	구조 범위	단독 사용
(없음)	컴포넌트 블록	컴포넌트	가능
`layout_`	레이아웃 블록	전역 레이아웃	가능
`page_`	페이지 블록	페이지	가능
`i_`	내부 요소	컴포넌트 내부	불가
`p_`	페이지 전용 내부 요소	페이지 내부	불가
`l_`	레이아웃 전용 내부 요소	레이아웃 내부	불가
`m_`	수정자	상태 / 변형	불가
`modal_`	팝업 / 모달 블록	팝업 / 모달	가능
`mo_` / `pc_`	디바이스 표시	모바일 / PC	가능

구조 중첩 관련 주의 사항

layout_ 안에 layout_은 중첩될 수 없습니다.
page_ 안에 page_는 중첩될 수 없습니다.
컴포넌트 내부에 컴포넌트는 중첩될 수 없습니다.
서로 다른 구조 범위 간에는 조합만 허용됩니다.

접두사가 겹치는 구조는 구조 설계 오류로 판단합니다.

참조 문서 활용 방법

이 문서는 규칙 설명이 아닌 판단 기준 확인용 문서입니다.

네이밍이 헷갈릴 때
코드 리뷰 시 구조 범위를 확인할 때
중첩 구조 문제를 점검할 때

다른 문서에서 접두사 기준이 필요할 경우, 이 문서를 최종 기준으로 사용합니다.