Editor cannot be used outside of a Livewire component

[andyunleashed]

Using the boilerplate component, customized with a model or not - e.g <flux:editor wire:model="content" label="…" description="…" /> throws this error: Using $this when not in object context

I tried publishing the component and then looking at the code inside and if I comment out the assets method - e.g:

{{-- @assets --}}
<flux:editor.scripts />
<flux:editor.styles />
{{-- @endassets --}}

It does load without an issue:

[mauritskorse]

Looks like the error when using livewire blade directives outside of a livewire component.
I can reproduce this after running flux:publish editor.

For me replacing the @assets for @push('scripts') works. I guess this would require some documentation or improvement of the flux:publish script.

[joshhanley]

@mauritskorse at this stage, using Flux components outside of a Livewire component isn't officially supported (although most components will work). @assets is a Livewire directive, hence why you would be getting that error.

@calebporzio I wonder whether we could have something users can add to a service provider (or a config option - although I prefer adding to a service provider) to disable including the assets in editor/index.blade.php and they can manually add them to their layout file (or just the pages they want to include the editor on)?

Something like

class AppServiceProvider
{
    public function boot()
    {
        FluxPro::injectEditorAssets(false);
    }
}

[mauritskorse]

@mauritskorse at this stage, using Flux components outside of a Livewire component isn't officially supported (although most components will work). @assets is a Livewire directive, hence why you would be getting that error.

Ah, yes, that sounds fair :)
And indeed, when I use a published flux:editor from within a livewire component the issue doesn't occur.

[joshhanley]

@andyunleashed and @mauritskorse I've submitted a Livewire PR livewire/livewire#9135 which allows @assets to be used outside of a Livewire component. So that should fix the error that is being thrown by the Editor component.

That will mean that the editor component can render properly outside of a Livewire component successfully. So if that PR gets merged, then this issue will be closed.

BUT it won't necessarily allow the editor component to work properly outside of Livewire yet. We have another open issue #341 though to keep track of allowing Flux's custom input elements (including the editor) to work outside of Livewire, which you can follow there.

[joshhanley]

The Livewire PR has been merged, but it won't be available until a Livewire release has been tagged.

[SimonHFrost]

This release will be super helpful for me since we're just at the wireframing stage in a current project.

Thanks @joshhanley for the feature!

[joshhanley]

@SimonHFrost this was released last week in Livewire v3.5.19 🙂