Skip to main content

​
Introduction

The code editor component allows you to write code in a textarea with line numbers. By default, no syntax highlighting is applied. 
use Filament\Forms\Components\CodeEditor;

CodeEditor::make('code')

​
Using language syntax highlighting

You may change the language syntax highlighting of the code editor using the language() method. The editor supports the following languages:
  • C++
  • CSS
  • Go
  • HTML
  • Java
  • JavaScript
  • JSON
  • Markdown
  • PHP
  • Python
  • SQL
  • XML
  • YAML
You can open the Filament\Forms\Components\CodeEditor\Enums\Language enum class to see this list. To switch to using JavaScript syntax highlighting, you can use the Language::JavaScript enum value: 
use Filament\Forms\Components\CodeEditor;
use Filament\Forms\Components\CodeEditor\Enums\Language;

CodeEditor::make('code')
    ->language(Language::JavaScript)
As well as allowing a static value, the language() method also accepts a function to dynamically calculate it. You can inject various utilities into the function as parameters.
Learn more about utility injection.
Field
$component
Filament\Forms\Components\Field
The current field component instance.
Get function
$get
Filament\Schemas\Components\Utilities\Get
A function for retrieving values from the current form data. Validation is not run.
Livewire
$livewire
Livewire\Component
The Livewire component instance.
Eloquent model FQN
$model
?string<Illuminate\Database\Eloquent\Model>
The Eloquent model FQN for the current schema.
Operation
$operation
string
The current operation being performed by the schema. Usually create, edit, or view.
Raw state
$rawState
mixed
The current value of the field, before state casts were applied. Validation is not run.
Eloquent record
$record
?Illuminate\Database\Eloquent\Model
The Eloquent record for the current schema.
State
$state
mixed
The current value of the field. Validation is not run.

​
Allowing lines to wrap

By default, long lines in the code editor will create a horizontal scrollbar. If you would like to allow long lines to wrap instead, you may use the wrap() method: 
use Filament\Forms\Components\CodeEditor;

CodeEditor::make('code')
    ->wrap()
Edit this page on GitHub

Sponsored by

KirschbaumBaiz.aiAgiledropCMS MaxMailtrapSerpApi