Wizard Steps and Javascript

Radio::make('move_or_merge')
    ->inline()
    ->options([
        'merge' => 'Merge',
    ])
    ->extraAttributes([
        'x-data' => '{}',
        'x-init' => 'function () {
            const applyStyle = () => {
                $el.closest("tr").style.backgroundColor = "#f0fdf4";
            };

            applyStyle(); // Apply style on init

            // Listen for Livewire update and re-apply the style
            this.$watch("move_or_merge", (value) => {
                if(value === "merge") {
                    applyStyle();
                }
            });

            // This is a Livewire hook that listens for when Livewire finishes a component update
            Livewire.hook("element.updated", (el, component) => {
                if(component.id === @this.id && el.hasAttribute("x-on:click")) {
                    applyStyle();
                }
            });
        }',
        'x-on:click' => 'applyStyle',
    ])
    ->required()
    ->hiddenLabel(),