---
category: packages
---

## ui-code-editor

[![npm][npm]][npm-url] 
[![build-status][build-status]][build-status-url] 
[![MIT License][license-badge]][LICENSE] 
[![Code of Conduct][coc-badge]][coc]

A code editor component.

### Components
The `ui-code-editor` package contains the following:
- [CodeEditor](#CodeEditor)


### Installation

```sh
yarn add @temporg/ui-code-editor
```

### Usage

```js
import React from 'react'
import { CodeEditor } from '@temporg/ui-code-editor'

const MyCodeEditor = () => {
  return (
    <CodeEditor
      label='code editor'
      defaultValue='{"foo": "bar"}'
      language='javascript'
      readOnly
    />
  )
}
```

[npm]: https://img.shields.io/npm/v/@temporg/ui-code-editor.svg
[npm-url]: https://npmjs.com/package/@temporg/ui-code-editor

[build-status]: https://travis-ci.org/rockcontent/rock-design-system.svg?branch=master
[build-status-url]: https://travis-ci.org/rockcontent/rock-design-system "Travis CI"

[license-badge]: https://img.shields.io/npm/l/rock-design-system.svg?style=flat-square
[license]: https://github.com/rockcontent/rock-design-system/blob/master/LICENSE

[coc-badge]: https://img.shields.io/badge/code%20of-conduct-ff69b4.svg?style=flat-square
[coc]: https://github.com/rockcontent/rock-design-system/blob/master/CODE_OF_CONDUCT.md