mirror of
https://github.com/status-im/consul.git
synced 2025-01-12 06:44:41 +00:00
a6c990c6fe
* Upgrade @hashicorp/design-system-tokens to 1.9.0 * Upgrade @hashicorp/design-system-components to 1.8.1 * Upgrade @hashicorp/design-system-components and ember-in-viewport * Explicitly install ember-modifier@4.1.0 * rename copy-button * Fix how cleanup is done in with-copyable * Update aria-menu modifier for new structure * Update css-prop modifier to new structure * Convert did-upsert to regular class modifier * Update notification modifier for new structure * Update on-oustside modifier for new structure * Move destroy handler registration in with-copyable * Update style modifier for new structure * Update validate modifier for new structure * Guard against setting on destroyed object * Upgrade @hashicorp/design-system-components to 2.14.1 * Remove debugger * Guard against null in aria-menu * Fix undefined hash in validate addon * Upgrade ember-on-resize-modifier * Fix copy button import, missing import and array destructuring --------- Co-authored-by: wenincode <tyler.wendlandt@hashicorp.com>
51 lines
1.8 KiB
Plaintext
51 lines
1.8 KiB
Plaintext
---
|
|
class: ember
|
|
state: needs-love
|
|
---
|
|
|
|
# CodeEditor
|
|
|
|
```hbs preview-template
|
|
<CodeEditor
|
|
@readonly={{true}}
|
|
@name={{concat name "[Rules]"}}
|
|
@syntax="hcl"
|
|
@oninput={{noop}}
|
|
>
|
|
<:label>
|
|
Rules <a href="{{env 'CONSUL_DOCS_URL'}}/guides/acl.html#rule-specification" rel="help noopener noreferrer" target="_blank">(HCL Format)</a>
|
|
</:label>
|
|
<:content>
|
|
{"content": "Initial Content"}
|
|
</:content>
|
|
</CodeEditor>
|
|
```
|
|
|
|
A code-editor with syntax highlighting supporting multiple languages (JSON, HCL, YAML), validation and simple tools such as "Copy to clipboard"
|
|
|
|
|
|
### Arguments
|
|
|
|
| Argument | Type | Default | Description |
|
|
| --- | --- | --- | --- |
|
|
| `readonly` | `Boolean` | false | If true, the content (value) of the CodeEditor cannot be changed by the user |
|
|
| `name` | `String` | | The name attribute of the form element |
|
|
| `syntax` | `String` | | Identifies the language used to validate/syntax highlight the code (possible values: hcl, json, yaml) |
|
|
| `oninput` | `Action` | noop | Action/callback that is triggered when the user inputs data |
|
|
|
|
### Named Blocks
|
|
|
|
| Name | Description | Behaviour if empty |
|
|
| --- | --- | --- |
|
|
| `:label` | Used to define the title that's displayed on the left inside the toolbar above the CodeEditor | Nothing is displayed |
|
|
| `:tools` | Used to define tools, buttons, widgets that will be displayed on the right inside the toolbar above the CodeEditor | By default it renders a `language selector` dropdown (if `readonly`== false and `syntax` is falsy) and a `ConsulCopyButton`
|
|
| `:content` | Used to display specific content such as code templates inside the CodeEditor | if the block is defined, @value will be displayed instead |
|
|
|
|
|
|
### See
|
|
|
|
- [Component Source Code](./index.js)
|
|
- [Template Source Code](./index.hbs)
|
|
|
|
---
|