CodeMirror Editor by DotSwan
CommunitySupercharge Filament with CodeMirror! Effortlessly edit CSS, HTML, JS, JSON, PHP in Filament forms.
Author:
DotSwan
Package health
Automated checks of this plugin's Composer package
15 checks
- Skipped: GitHub Actions pinned to SHA
- Skipped: GitLab CI includes pinned to SHA
- Passed: Open security advisories
- Passed: Dependabot PR responsiveness — No open Dependabot PRs.
- Skipped: Renovate MR responsiveness
- Failed: Dependabot or Renovate configured — No dependency updater configuration found. View details on Plumb
- Skipped: Dependency update cooldown configured
- Failed: Provides a security policy — View details on Plumb
- Passed: Abandoned or archived — No consulted source marks the package abandoned (packagist, github).
- Failed: Commit and release recency — Inactive: last commit 366 days ago; last release 366 days ago. View details on Plumb
-
Failed:
composer.lock not committed by library
—
composer.lockis present in the released dist archive. View details on Plumb - Warning: Dist archive is lean
-
Passed:
Current Laravel version supported
—
Package dependencies resolve together with current Laravel
13.0. -
Passed:
Current PHP version supported
—
Constraint
^8.1supports current PHP8.5. - Skipped: Current Symfony version supported
filament/
namespace. Review the source and install at your own risk. Found
malware or an unresolved security issue the author won't
address?
Report it
.
Documentation
#Introduction
The Filament Code Editor package enhances Filament with a specialized field type, allowing seamless code editing powered by the CodeMirror JavaScript library within Filament components. This integration provides users with a dedicated environment for editing various code languages such as CSS, HTML, JavaScript, JSON, and PHP directly within Filament forms.
- Key Features:
- Integration of the CodeMirror JavaScript library into Filament components.
- Support for multiple code languages including CSS, HTML, JavaScript, JSON, and PHP.
- Effortless editing of code within the familiar Filament interface.
#Installation
To integrate the Filament Code Editor package into your project, use Composer:
composer require dotswan/filament-code-editor
For Filament v3:
composer require dotswan/filament-code-editor:"^1.1.4"
#Basic Usage
To implement the code editor field within Filament forms, use the CodeEditor field type:
use Dotswan\FilamentCodeEditor\Fields\CodeEditor;
CodeEditor::make('codes')
// Additional configuration goes here, if needed
->id('unique_field_id')
->minHeight(768)
->isReadOnly(true)
->showCopyButton(true)
->darkModeTheme('gruvbox-dark')
->lightModeTheme('basic-light')
->columnSpanFull(),
Theme values:
- basic-light
- basic-dark
- solarized-dark
- solarized-light
- material-dark
- nord
- gruvbox-light
- gruvbox-dark
#Supported Languages
The Filament Code Editor supports the following languages:
- CSS
- HTML
- JavaScript
- JSON
- PHP
Customize and manage code for these languages effortlessly within your Filament forms.
#License
This package is distributed under the MIT License.
#Security
Security is a priority for us. If you encounter any security-related issues or vulnerabilities, please report them via our GitHub issue tracker. For direct communication, reach out to tech@dotswan.com.
#Contribution
Contributions are welcome and valued. Enhancements, suggestions, and bug reports help improve this package for everyone. Here's how you can contribute:
- Fork the Project
- Create a Feature Branch (
git checkout -b feature/AmazingFeature) - Commit your Changes (
git commit -m 'Add some AmazingFeature') - Push to the Branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Thank you for considering contributing to the Filament Code Editor!
The author
At Dotswan, we excel in transforming visionary ideas into reality, offering comprehensive services from IT solutions to DevOps, and specializing in creating highly responsive websites and scalable mobile apps. Our team of experts ensures top-tier user experience, security, and innovative designs.
From the same author
Map Picker
A field designed to simplify the process of choosing a location on a map and obtaining its geo-coordinates.
Author:
DotSwan
Grapes JS
Grapesjs field type for visual HTML editing. Drag-and-drop functionality to seamlessly design.
Author:
DotSwan
Laravel Pulse
Enhance your Filament dashboard with comprehensive monitoring widgets.
Author:
DotSwan
Featured Plugins
A selection of plugins curated by the Filament team
Blueprint
Filament Blueprint is a premium Laravel Boost extension that helps AI agents produce accurate, detailed implementation plans and security reports for Filament apps.
Filament
Noir Theme
A theme that gives panels a focused, refined look with near-black surfaces, crisp actions, and restrained color.
Filament
Spotlight Pro
Browse your Filament Panel with ease. Filament Spotlight Pro adds a Spotlight like Command Palette to your Filament Panel.
Dennis Koch