WickedHost Design System / 컴포넌트

서버 콘솔·명령 입력

서버 출력과 명령 입력을 분리하고 출력 중단 상태를 명시합니다.

WickedHost 공통 확정 기준: vPanel/Pterodactyl 디자인을 Blesta까지 동일 적용. 문서·예제 기준이며 운영 서비스 배포와는 별도입니다. 공통 동작 규칙을 재사용하며, 다른 체계의 사례는 비교 근거일 뿐 스타일 상속이 아닙니다.

실행형 예제
서버 콘솔

실제 셸·Wings·WebSocket에 연결하지 않습니다. 로그는 최대 22줄로 제한합니다.

WickedHost 공통 토큰으로 구성한 동작 예제예시 데이터 · API 미연결

목적과 사용

서버 출력과 명령 입력을 분리하고 출력 중단 상태를 명시합니다. WickedHost 제품군의 업무 패턴입니다. TeamWicked 자체 체계에는 노출하지 않습니다.

구성과 변형

  • 연결 출력
  • 출력 일시 정지
  • 명령
  • 긴 로그

보여 주는 형태는 해당 제품 토큰으로 구성한 문서용 예제입니다. 별도 원본 연결 표시가 없으면 운영 컴포넌트를 그대로 복제했다는 의미가 아닙니다.

동작 규칙

  • CNS-01 MUST: 로그를 매 줄 자동 낭독해 다른 작업을 방해하지 않습니다.
  • CNS-02 MUST: 문서 예제의 문자열을 실제 셸이나 원격 API에서 실행하지 않습니다.
  • CNS-03 MUST: 출력 기록의 메모리 상한과 복사·스크롤 경로를 정합니다.
  • CNS-04 MUST: 명령 전송 중·연결 끊김·읽기 전용 권한을 구분합니다.

콘텐츠 예시

예제 이름·주소·금액은 실제 고객 데이터가 아닙니다. example.test, 개발 서버, 예제 계정처럼 목적이 분명한 가상 자료를 사용합니다. 실제 권한·저장·전송이 완료되었다고 오해할 문구는 사용하지 않습니다.

우리 구현과 연결

web/expanded-specimens.tsx의 실행 코드와 이 페이지의 구현 코드 탭이 같은 함수를 사용합니다. 공통 요소는 web/primitives.tsx, 스타일은 web/expanded-specimens.css에서 관리합니다. WickedHost의 제품 구현 지도를 연결하되 실제 패널·청구·서버 API는 호출하지 않습니다.

상태와 검증

임의 명령이 예제 문자열로만 남는지, 출력 중단 중 입력 제한과 줄 수 상한을 확인합니다.

라이트·다크 / desktop·mobile / 키보드 / 빈 값·긴 값 / 권한·실패 / 데이터 변경 요청 없음에 대한 증거를 기록합니다. 제품의 실제 업무 성공이나 전체 WCAG 준수 여부는 별도 검증입니다.

출처와 적용 범위

원본 확인 범위와 운영 적용 여부를 구분합니다. 실행형 예제의 동작 확인은 모든 운영 화면의 접근성 검증을 의미하지 않습니다.

Markdown 원본 다운로드