내부 요소 (i_)
SLUR UI System에서 내부 요소(i_)는
블록(Block)에 종속된 구성 요소를 의미합니다.
내부 요소는 블록의 구조를 세분화하기 위한 용도로만 사용됩니다.
내부 요소의 정의
Section titled “내부 요소의 정의”내부 요소는 다음 조건을 만족합니다.
- 항상 특정 블록에 종속됩니다.
- 단독으로 의미를 가지지 않습니다.
- 블록의 내부 구조를 구성하는 역할을 합니다.
내부 요소는 블록 없이는 존재할 수 없습니다.
i_ 접두사의 의미
Section titled “i_ 접두사의 의미”i_ 접두사는
해당 요소가 재사용 가능한 컴포넌트 블록 내부 요소임을 의미합니다.
- 컴포넌트(Block) 내부에서만 사용합니다.
- 페이지나 레이아웃 전용 요소에는 사용하지 않습니다.
- 구조적 관계를 명확히 드러내는 용도입니다.
내부 요소 사용 원칙
Section titled “내부 요소 사용 원칙”내부 요소는 다음 원칙을 따릅니다.
- 항상 블록 클래스와 함께 사용합니다.
- 단독 선택자 사용을 허용하지 않습니다.
- 블록의 책임을 대신하지 않습니다.
- 구조 표현을 목적으로 사용합니다.
내부 요소는 스타일 재사용보다
구조 명확성을 우선합니다.
내부 요소와 다른 접두사의 구분
Section titled “내부 요소와 다른 접두사의 구분”SLUR UI System에서는 내부 요소라도
소속 범위에 따라 접두사를 구분합니다.
i_: 컴포넌트(Block) 내부 요소p_: 페이지(Page) 전용 내부 요소l_: 레이아웃(Layout) 전용 내부 요소
접두사는 요소의 성격이 아니라
소속된 구조 범위를 기준으로 선택합니다.
내부 요소 설계 기준
Section titled “내부 요소 설계 기준”내부 요소를 설계할 때는 다음을 고려합니다.
- 이 요소가 블록 내부에 종속되는가
- 다른 블록에서 재사용될 필요가 있는가
- 블록의 책임을 침범하지 않는가
- 수정자(
m_)로 표현하는 것이 더 적절하지 않은가
내부 요소가 많아질수록
블록 설계 자체를 다시 검토해야 합니다.
내부 요소 규칙의 목적
Section titled “내부 요소 규칙의 목적”내부 요소 규칙은
블록의 구조를 명확히 유지하고,
UI 전체의 가독성과 유지보수성을 높이기 위한 기준입니다.
내부 요소가 명확할수록
블록의 역할과 구조가 코드 수준에서 분명해집니다.