Guide
Add your own block
The block used for code on these pages is a good example: a file name, a language, the code and a copy button. Here is how it was made.
The class
Its fields are a language picker, a file name and Filament's code editor. The code field isn't text to translate, so translators never see it; the caption is.
nordlys/src/CodeSampleBlock.php
PHP
class CodeSampleBlock extends Block
{
public static function type(): string
{
return 'code-sample';
}
public static function schema(): array
{
return [
Select::make('language')->options(['php' => 'PHP', 'blade' => 'Blade', 'bash' => 'Terminal']),
TextInput::make('filename'),
CodeEditor::make('code'),
TextInput::make('caption'),
];
}
}The view
It always draws on a dark panel, whatever the band behind it, and copies the code exactly as written.
nordlys/resources/views/components/blocks/code-sample.blade.php
Blade
<figure class="rounded-2xl bg-zinc-950 text-zinc-100">
<figcaption>{{ $data['filename'] ?? '' }}</figcaption>
<pre><code>{{ $data['code'] ?? '' }}</code></pre>
</figure>Where it lives
It comes with Aurora's block library (aurora/nordlys), which registers it: it is in the palette, the AI catalogue and the component library as soon as the package is installed.
