A markdown editor field for Laravel Nova based on Toast UI Editor with automatic theme switch.
You can install the package via composer:
composer require datomatic/nova-markdown-tui
The package will automatically register itself.
You can publish the config file with:
php artisan vendor:publish --provider="Datomatic\NovaMarkdownTui\FieldServiceProvider" --tag="config"
You can use the Datomatic\NovaMarkdownTui\ToastUiEditor
field in your Nova resource:
<?php
namespace App\Nova;
use Datomatic\NovaMarkdownTui\MarkdownTui;
use Illuminate\Http\Request;
class BlogPost extends Resource
{
// ...
public function fields(Request $request)
{
return [
// ...
MarkdownTui::make('Content'),
// ...
];
}
}
You may configure the underlying Toast UI Editor instance with the following field's methods. Checkout Toast UI - Vue Editor documentation.
You may also configure defaults in the config file.
initialEditType(\Datomatic\NovaMarkdownTui\Enums\EditorType::MARKDOWN)
minHeight(string $minHeight)
language(string $language)
useCommandShortcut(bool $useCommandShortcut = true)
hideModeSwitch(bool $hideModeSwitch = true)
toolbarItems(array $toolbarItems)
plugins(array $plugins)
Allowed values are:
chart
uml
colorSyntax
codeSyntaxHighlight
tableMergedCell
height(string $height)
previewStyleVertical()
previewStyleTab()
allowIframe(bool $allowIframe = true)
You can choose to enable upload of media directly from the editor. The blob of the file will be sent to and endpoint of your choice (eventually with some additional headers that you can choose, to increase security).
To achieve that, you have to set the configs in config/nova-markdown-tui.php
accordingly:
'mediaUploadUrl' => '/api/nova-markdown-tui/upload', // put your endpoint, or null to disable upload
'mediaUploadHeaders' => [
'X-Secret-Key' => 'super-secret-token', // if you prefer to protect the endpoint
],
In this way, you can store your file as you want: local storage, remote services, ....
The file will be sent as a POST request with Content-Type multipart/form-data
, with the file in file
field of the body.
The endpoint should respond with status 200 and a JSON body with the following structure:
{
"url": "https://datomatic.io/files/image.jpg",
"alt": "Optional, alt text"
}
If alt
is provided, it will overwrite the "Description" field typed by the user in the editor. Keep it empty if you want to use what the user prompted.
Please see CHANGELOG for more information on recent changes.
If you discover any security related issues, please email [email protected] instead of using the issue tracker.
Please see CONTRIBUTING for details.
- Roberto Negro
- Alberto Peripolli
- Mikaël Popowicz (for the, now discontinued, BBS-Lab/nova-markdown-tui-field package)
- All Contributors
The MIT License (MIT). Please see License File for more information.