Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Table of Contents
minLevel1
maxLevel7

CodeEditor는 사용자가 여러 줄의 Code를 직접 입력 할 수 있도록 코드 입력 영역을 제공하는 컴포넌트이다.

( 참고: https://ionsdp.atlassian.net/wiki/spaces/ICE4P/pages/1543733287/Input+Component#Common-options )

Basic

CodeEditor와 JsonEditor의 기본 UI는 다음과 같다.

Image RemovedImage RemovedImage AddedImage Added

Width/Height

CodeEditor 입력창의 가로와 세로 길이를 직접 입력하여 설정 할 수 있다. 예를 들어 Height=200px로 설정하면 다음과 같이 입력 필드의 세로 길이만 증가한다.

Image RemovedImage Added

Light/Dark

CodeEditor를 Light Mode와 Dark Mode로 선택하여 사용 할 수 있다.

Image RemovedImage Added

Language

CodeEditor 컴포넌트 내에서 사용 가능한 Language는 다음과 같다.

css, html, java, javascript, json, less, mysql, scss, typescript, xml

Image RemovedImage Added

JsonEditor

JsonEditor는 자주 사용하는 json 언어의 CodeEditor를 별도의 컴포넌트로 만들어 제공하는 것이다.

Image RemovedImage Added