WIP

Author: robsontenorio

src/View/Components/Modal.php

@@ -9,7 +9,7 @@
 class Modal extends Component
 {
     public function __construct(
-        public string $id,
+        public ?string $id = '',
         public ?string $title = null,
         public ?string $subtitle = null,
         public ?bool $separator = false,
@@ -23,7 +23,18 @@ public function __construct(
     public function render(): View|Closure|string
     {
         return <<<'HTML'
-                <dialog id="{{ $id }}" {{ $attributes->class(["modal"]) }}>
+                <dialog 
+                    {{ $attributes->class(["modal"]) }}
+
+                    @if($id)
+                        id="{{ $id }}"
+                    @else
+                        x-data="{open: @entangle($attributes->wire('model')).live }"                         
+                        :class="{'modal-open': open}"
+                        :open="open"
+                        @keydown.escape.window = "$wire.{{ $attributes->wire('model')->value() }} = false"
+                    @endif
+                >
                     <div class="modal-box">
                         @if($title)
                             <x-header :title="$title" :subtitle="$subtitle" size="text-2xl" :separator="$separator" />

src/View/Components/Table.php

@@ -79,6 +79,11 @@ public function render(): View|Closure|string
                             @endforeach
                         </tbody>
                     </table>
+                    @php
+                        # TODO: workaround for bug when using slot with @scope on tables.
+                        # It seems it loses start/end context with @scope/@endscope. So I am just placing any hidden component here. 
+                    @endphp
+                    <x-alert style="display:none" />
                 </div>
             HTML;
     }