Lyotic · 컴포넌트
외형이 아니라 업무를 표현합니다.
컴포넌트는 근거·해석·판단·영향·권한·실행·검증을 구분하는 의미적 책임을 가집니다. 함께 조합하더라도 각 책임의 계약은 사라지지 않습니다.
개요
컴포넌트는 근거·해석·판단·영향·권한·실행·검증을 구분하는 의미적 책임을 가집니다. 함께 조합하더라도 각 책임의 계약은 사라지지 않습니다.
| 표현할 수 있는 것 | 표현해서는 안 되는 것 |
|---|---|
| 입력과 plan이 지지하는 상태 | 컴포넌트의 존재만으로 검증이나 권한이 성립한다는 주장 |
구성
- 업무의 대상과 정체성
- 현재 상태와 그 이유
- 판단에 필요한 근거·영향·권한
- 실행 결과와 검증 범위
상태
아래는 공용 상태와 전이 픽스처를 사용한 라이브 예제입니다. 동일한 입력과 plan에서 다른 언어가 권한이나 검증의 뜻을 바꿔서는 안 됩니다.
사용과 회피
위임된 업무를 사람이 이해하고 판단하며 결과를 확인해야 할 때 사용합니다.
많은 카드를 추가하거나 화려한 모핑만으로 계약을 구현했다고 주장하지 않습니다.
사용할 때
위임된 업무를 사람이 이해하고 판단하며 결과를 확인해야 할 때 사용합니다.
사용하지 않을 때
단순한 외형 스타일이나 실행 통제를 대체하는 정책 엔진으로 사용하지 않습니다.
빠진 검사를 숨기지 않습니다
많은 카드를 추가하거나 화려한 모핑만으로 계약을 구현했다고 주장하지 않습니다. 확인한 범위, 보존한 값, 관찰하지 못한 영역
근거의 한계
예제는 고정된 픽스처와 현재 공용 컴포넌트의 동작을 보여줍니다. 외부 서비스 연결, 모든 부수 효과 또는 사람의 이해 개선까지 입증하지 않습니다.
계약
열세 가지 항목은 구현의 책임입니다. 이 표의 존재 자체가 모든 테스트의 통과를 의미하지는 않습니다.
| 항목 | 계약 |
|---|---|
| 의미 입력 | 권위가 확립된 입력과 그 입력에서 만든 Representation Plan |
| 허용 상태 | 정의된 독립 상태 축과 해당 부분에 허용된 조합 |
| 금지 상태 | 더 강한 주장, 만들어낸 권한, 검증 전 완료 |
| 근거 요건 | 주장별 근거, 최신성, 빠진 지지 자료 |
| 행동 범위 | plan에서 허용한 행동만 표시하며 제한 이유를 설명합니다. |
| 권한의 의미 | 권한을 표시·요청·기록하는 책임을 구분합니다. 렌더링은 권한을 부여하지 않습니다. |
| 외부 효과 | 렌더링 자체에는 외부 효과가 없습니다. 실제 효과는 실행기의 기록에 연결합니다. |
| 검증 조건 | 확인한 범위, 보존한 값, 관찰하지 못한 영역 |
| 실패와 복구 | 대상별 결과와 현재 가능한 복구 경로 |
| 전환 | 정체성, 입력, 행동의 의미와 포커스를 유지하며 떠나는 내용은 inert로 만듭니다. |
| 접근성 | 이름, role, 읽기 순서, 키보드, 상태 알림과 재배치 |
| 관찰 가능한 이벤트 | 실제로 발생하는 이벤트와 payload 또는 명시적인 없음 |
| 테스트 조건 | plan/DOM과 시간·입력·근거 한계 검사를 함께 수행합니다. |
접근성
이름, role, 읽기 순서, 키보드, 상태 알림과 재배치
키보드·포인터·스크린 리더·확대·reduced-motion 조건을 실제 전환 경로에서 확인합니다. 자동 DOM 검사만으로 접근성을 전부 검증했다고 주장하지 않습니다.
코드
아래는 현재 영문 페이지와 같은 API 예제입니다. 함수·속성·상태 식별자는 번역하지 않습니다. 애플리케이션이 권위 있는 입력과 실행 경계를 제공해야 합니다.
import { resolve, checkDom } from '../../packages/core/src/index.js';
import { WorkObjectShell } from '../../packages/components/src/index.js';
// state comes from the application; host is a persistent DOM element.
const shell = new WorkObjectShell(host);
const plan = resolve(state);
shell.render(state, plan, { initiator: 'system' });
const report = checkDom(host, plan);
// Record report.violations AND report.limits. Neither validates a remote write.