PHP Script Editor

CI npm Packagist License

A Monaco-based <php-script-editor> web component for PHP Script v2, with thin wrappers for React, Vue and Svelte and integration packages for Laravel and Filament.

<php-script-editor config-url="/php-script/config" save-url="/scripts" lint-url="/scripts/lint">
  <script type="text/php-script">
    if (user.age > 17) {
      echo strtoupper(user.name);
    }
  </script>
</php-script-editor>

Features

  • Server-driven language. Highlighting and completions come from the JSON that PHP Script’s MonarchLanguageDefinitionService produces, so the editor knows exactly the functions and variables your engine allows. See Server and language config.
  • Saving built in. Set save-url. The first save is a POST, later saves are PUT.
  • Lint markers. An optional lint-url shows the linter’s diagnostics as editor markers.
  • Themes. Light, dark and auto, plus your own colors through CSS custom properties or a theme object. See Themes.
  • Works in forms. The element is a form-associated custom element.
  • Small and lazy. The element is small; Monaco is loaded when the first editor connects.

Packages

Package Install For
@php-script/editor npm i @php-script/editor monaco-editor The web component (vanilla, Angular, Solid)
@php-script/editor-react npm i @php-script/editor-react monaco-editor React 18 and 19, Next.js
@php-script/editor-vue npm i @php-script/editor-vue monaco-editor Vue 3 and Nuxt
@php-script/editor-svelte npm i @php-script/editor-svelte monaco-editor Svelte 5 and SvelteKit
php-script/editor-laravel composer require php-script/editor-laravel Laravel: Blade component, assets, lint, rule
php-script/editor-filament composer require php-script/editor-filament Filament 5 form field

The npm packages are at 0.1.x and target PHP Script ^2.0.

Where to start?