diff --git a/resources/views/syntax-entry.blade.php b/resources/views/syntax-entry.blade.php
index 2a219a8..5f608d8 100644
--- a/resources/views/syntax-entry.blade.php
+++ b/resources/views/syntax-entry.blade.php
@@ -19,6 +19,7 @@ class="filament-syntax-entry"
     >
         <div
             x-data="{
+                theme: localStorage.getItem('theme') ?? @js(filament()->getDefaultThemeMode()->value),
                 init() {
                     this.updateTheme();
                     const observer = new MutationObserver(() => this.updateTheme());
diff --git a/src/FilamentSyntaxEntryServiceProvider.php b/src/FilamentSyntaxEntryServiceProvider.php
index 33cebb0..a7c1aa1 100644
--- a/src/FilamentSyntaxEntryServiceProvider.php
+++ b/src/FilamentSyntaxEntryServiceProvider.php
@@ -53,8 +53,8 @@ protected function getAssetPackageName(): ?string
     protected function getAssets(): array
     {
         return [
-            Css::make('filament-syntax-entry-styles', __DIR__ . '/../resources/dist/filament-syntax-entry.css'),
-            Js::make('filament-syntax-entry-scripts', __DIR__ . '/../resources/dist/filament-syntax-entry.js'),
+            Css::make('filament-syntax-entry-styles', __DIR__ . '/../resources/dist/filament-syntax-entry.css')->loadedOnRequest(),
+            Js::make('filament-syntax-entry-scripts', __DIR__ . '/../resources/dist/filament-syntax-entry.js')->loadedOnRequest(),
         ];
     }