New feature request

[jouniikaheimo]

Is it possible and how easy to make a change that could change the view

sometime is nice open Slide-overs type modal and sometimes traditional??

   public function render(): View
    {
        return view('livewire-ui::modal');
    }

[PhiloNL]

Thanks for the suggestion. I will take a look and see if this is possible 😄

[divdax]

+1

[davideperfetto]

Hi everyone. @jouniikaheimo don't know if it is the optimal way to do it, but a quick thing that I thought of was to duplicate the code structure @PhiloNL made and create a fork to implement the slideover.

https://github.com/davideperfetto/slideover

Similar to @PhiloNL project all the functions works using the word "slideover" instead of modal (ex. openSlideover, etc...)
Please give me some feedback.

[jouniikaheimo]

@davideperfetto i make temporary solutions this way

class Modal extends Component
{
    public ?string $activeComponent;

    public array $components = [];
    public string $view = 'VIEWNAMESPACE::modal';

    public function resetState(): void
    {
        $this->components = [];
        $this->activeComponent = null;
    }

    public function openModal($component, $componentAttributes = [], $modalAttributes = [], $view = 'VIEWNAMESPACE::modal'): void
    {
        $requiredInterface = \LivewireUI\Modal\Contracts\ModalComponent::class;
        $componentClass = app('livewire')->getClass($component);
        $reflect = new ReflectionClass($componentClass);
        $this->view = $view;

        if ($reflect->implementsInterface($requiredInterface) === false) {
            throw new Exception("[{$componentClass}] does not implement [{$requiredInterface}] interface.");
        }

        $id = md5($component . serialize($componentAttributes));
        $this->components[$id] = [
            'name'            => $component,
            'attributes'      => $componentAttributes,
            'modalAttributes' => array_merge([
                'closeOnClickAway' => $componentClass::closeModalOnClickAway(),
                'closeOnEscape' => $componentClass::closeModalOnEscape(),
                'maxWidth' => $componentClass::modalMaxWidth(),
            ], $modalAttributes),
        ];

        $this->activeComponent = $id;

        $this->emit('activeModalComponentChanged', $id);
    }

    public function getListeners(): array
    {
        return [
            'openModal',
        ];
    }

    public function render(): View
    {
        return view($this->view);
    }
}

and working fine... that about first release of this package where i make local modifications Modal.php

[jouniikaheimo]

I think now is better solution add config different models type view path and use openmodal function

openModal('paaaa.plaaa', json_decode(['plaaa']), 'modal' )
openModal('paaaa.plaaa', json_decode(['plaaa']), 'slide' )
openModal('paaaa.plaaa', json_decode(['plaaa']), 'bottomModal' )
openModal('paaaa.plaaa', json_decode(['plaaa']), 'topModal' )

etc