https://github.com/dotswan/filament-code-editor
Supercharge Filament with CodeMirror! Effortlessly edit CSS, HTML, JS, JSON, PHP in Filament forms.
https://github.com/dotswan/filament-code-editor
codemirror codemirror-editor filament filament-code-editor filament-code-editor-v3 filamentphp laravel php
Last synced: about 1 year ago
JSON representation
Supercharge Filament with CodeMirror! Effortlessly edit CSS, HTML, JS, JSON, PHP in Filament forms.
- Host: GitHub
- URL: https://github.com/dotswan/filament-code-editor
- Owner: dotswan
- License: mit
- Created: 2023-12-07T08:50:35.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-05-22T08:30:27.000Z (about 2 years ago)
- Last Synced: 2024-10-20T11:51:44.472Z (over 1 year ago)
- Topics: codemirror, codemirror-editor, filament, filament-code-editor, filament-code-editor-v3, filamentphp, laravel, php
- Language: PHP
- Homepage:
- Size: 545 KB
- Stars: 7
- Watchers: 1
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Filament Code Editor
[![Latest Version on Packagist][ico-version]][link-packagist]
[![Total Downloads][ico-downloads]][link-downloads]
[![Software License][ico-license]][link-license]


## 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:
```bash
composer require dotswan/filament-code-editor
```
## Basic Usage
To implement the code editor field within Filament forms, use the `CodeEditor` field type:
```php
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](link-to-your-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][link-github-issue]. For direct communication, reach out to [tech@dotswan.com](mailto: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:
1. Fork the Project
2. Create a Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request
Thank you for considering contributing to the Filament Code Editor!
[ico-version]: https://img.shields.io/packagist/v/dotswan/filament-code-editor.svg?style=flat-square
[ico-license]: https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square
[ico-downloads]: https://img.shields.io/packagist/dt/dotswan/filament-code-editor.svg?style=flat-square
[link-packagist]: https://packagist.org/packages/dotswan/filament-code-editor
[link-license]: https://github.com/dotswan/filament-code-editor/blob/master/LICENSE.md
[link-downloads]: https://packagist.org/packages/dotswan/filament-code-editor
[link-github-issue]: https://github.com/dotswan/filament-code-editor/issues