diff --git a/.changeset/mean-maps-provide.md b/.changeset/mean-maps-provide.md
deleted file mode 100644
index e291e958d..000000000
--- a/.changeset/mean-maps-provide.md
+++ /dev/null
@@ -1,6 +0,0 @@
----
-'create-svelte-ux': patch
-'svelte-ux': patch
----
-
-Update dependencies
diff --git a/packages/create-svelte-ux/CHANGELOG.md b/packages/create-svelte-ux/CHANGELOG.md
index 18abbad11..36f97adb5 100644
--- a/packages/create-svelte-ux/CHANGELOG.md
+++ b/packages/create-svelte-ux/CHANGELOG.md
@@ -1,5 +1,11 @@
 # create-svelte-ux
 
+## 0.6.3
+
+### Patch Changes
+
+- Update dependencies ([`9be6afada9e247c0ad5f758a7907798bceeb29a1`](https://github.com/techniq/svelte-ux/commit/9be6afada9e247c0ad5f758a7907798bceeb29a1))
+
 ## 0.6.2
 
 ### Patch Changes
diff --git a/packages/create-svelte-ux/package.json b/packages/create-svelte-ux/package.json
index ff9af3f2a..8aad3a40c 100644
--- a/packages/create-svelte-ux/package.json
+++ b/packages/create-svelte-ux/package.json
@@ -1,6 +1,6 @@
 {
   "name": "create-svelte-ux",
-  "version": "0.6.2",
+  "version": "0.6.3",
   "description": "A CLI for creating new Svelte UX projects",
   "repository": {
     "type": "git",
diff --git a/packages/svelte-ux/CHANGELOG.md b/packages/svelte-ux/CHANGELOG.md
index 8cfac5c81..e6e647228 100644
--- a/packages/svelte-ux/CHANGELOG.md
+++ b/packages/svelte-ux/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte-ux
 
+## 0.73.0
+
+### Minor Changes
+
+- Improve Svelte 5 compatibility, especially with docs (enabling `svelte-check` to pass) ([#399](https://github.com/techniq/svelte-ux/pull/399))
+
+### Patch Changes
+
+- Update dependencies ([`9be6afada9e247c0ad5f758a7907798bceeb29a1`](https://github.com/techniq/svelte-ux/commit/9be6afada9e247c0ad5f758a7907798bceeb29a1))
+
 ## 0.72.4
 
 ### Patch Changes
diff --git a/packages/svelte-ux/package.json b/packages/svelte-ux/package.json
index 8fa8ad649..b3d1e1bb1 100644
--- a/packages/svelte-ux/package.json
+++ b/packages/svelte-ux/package.json
@@ -4,7 +4,7 @@
   "author": "Sean Lynch <techniq35@gmail.com>",
   "license": "MIT",
   "repository": "techniq/svelte-ux",
-  "version": "0.72.4",
+  "version": "0.73.0",
   "scripts": {
     "dev": "vite dev",
     "build": "vite build",
diff --git a/packages/svelte-ux/src/docs/ViewSourceButton.svelte b/packages/svelte-ux/src/docs/ViewSourceButton.svelte
index 0a740c946..ae158e9f9 100644
--- a/packages/svelte-ux/src/docs/ViewSourceButton.svelte
+++ b/packages/svelte-ux/src/docs/ViewSourceButton.svelte
@@ -15,11 +15,11 @@
 </script>
 
 {#if source}
-  <Toggle let:on={open} let:toggle>
+  <Toggle let:on={open} let:toggle let:toggleOff>
     <Button {icon} on:click={toggle} variant="fill-light" color="primary" size="sm">{label}</Button>
     <Dialog
       {open}
-      on:close={toggle}
+      on:close={toggleOff}
       class="max-h-[98dvh] md:max-h-[90dvh] max-w-[98vw] md:max-w-[90vw] grid grid-rows-[auto,1fr,auto]"
     >
       <div class="grid grid-cols-[1fr,auto] gap-3 items-center p-4">
diff --git a/packages/svelte-ux/src/lib/components/Badge.svelte b/packages/svelte-ux/src/lib/components/Badge.svelte
index c946477e4..6a33b9bfe 100644
--- a/packages/svelte-ux/src/lib/components/Badge.svelte
+++ b/packages/svelte-ux/src/lib/components/Badge.svelte
@@ -2,7 +2,7 @@
   import { cls } from '../utils/styles.js';
   import { getComponentClasses } from './theme.js';
 
-  export let value: number = $$slots.value ? 1 : 0;
+  export let value = $$slots.value ? 1 : 0;
   export let small = false;
   export let circle = false;
   export let dot = false;
diff --git a/packages/svelte-ux/src/lib/components/BarStack.svelte b/packages/svelte-ux/src/lib/components/BarStack.svelte
index 21b6c3a5e..7c06fc688 100644
--- a/packages/svelte-ux/src/lib/components/BarStack.svelte
+++ b/packages/svelte-ux/src/lib/components/BarStack.svelte
@@ -5,10 +5,6 @@
   import { cls } from '../utils/styles.js';
   import { getComponentClasses } from './index.js';
 
-  const dispatch = createEventDispatcher<{
-    itemClick: (typeof data)[number];
-  }>();
-
   export let data: {
     label: string;
     value: number;
@@ -26,6 +22,10 @@
     item?: string;
   } = {};
   const settingsClasses = getComponentClasses('BarStack');
+
+  const dispatch = createEventDispatcher<{
+    itemClick: (typeof data)[number];
+  }>();
 </script>
 
 <div class={cls('BarStack', 'flex gap-px', settingsClasses.root, classes.root, $$props.class)}>
diff --git a/packages/svelte-ux/src/lib/components/SelectField.svelte b/packages/svelte-ux/src/lib/components/SelectField.svelte
index 084f67ac5..145637473 100644
--- a/packages/svelte-ux/src/lib/components/SelectField.svelte
+++ b/packages/svelte-ux/src/lib/components/SelectField.svelte
@@ -561,17 +561,19 @@
             </slot>
           </svelte:fragment>
 
-          <slot name="empty" slot="empty" let:loading>
-            <div
-              class={cls(
-                'p-3 text-surface-content/5/50 italic text-sm',
-                settingsClasses.empty,
-                classes.empty
-              )}
-            >
-              {loading ? 'Loading...' : 'No options found'}
-            </div>
-          </slot>
+          <svelte:fragment slot="empty" let:loading>
+            <slot name="empty" {loading}>
+              <div
+                class={cls(
+                  'p-3 text-surface-content/5/50 italic text-sm',
+                  settingsClasses.empty,
+                  classes.empty
+                )}
+              >
+                {loading ? 'Loading...' : 'No options found'}
+              </div>
+            </slot>
+          </svelte:fragment>
         </SelectListOptions>
 
         <slot name="actions" {hide} />
@@ -618,17 +620,19 @@
           </slot>
         </svelte:fragment>
 
-        <slot name="empty" slot="empty" let:loading>
-          <div
-            class={cls(
-              'p-3 text-surface-content/5/50 italic text-sm',
-              settingsClasses.empty,
-              classes.empty
-            )}
-          >
-            {loading ? 'Loading...' : 'No options found'}
-          </div>
-        </slot>
+        <svelte:fragment slot="empty" let:loading>
+          <slot name="empty" {loading}>
+            <div
+              class={cls(
+                'p-3 text-surface-content/5/50 italic text-sm',
+                settingsClasses.empty,
+                classes.empty
+              )}
+            >
+              {loading ? 'Loading...' : 'No options found'}
+            </div>
+          </slot>
+        </svelte:fragment>
       </SelectListOptions>
     {/if}
   {/if}
diff --git a/packages/svelte-ux/src/lib/stores/debounceStore.ts b/packages/svelte-ux/src/lib/stores/debounceStore.ts
index eb3e17d9e..50bef1ee9 100644
--- a/packages/svelte-ux/src/lib/stores/debounceStore.ts
+++ b/packages/svelte-ux/src/lib/stores/debounceStore.ts
@@ -1,6 +1,6 @@
-import { derived, get, type Stores } from 'svelte/store';
+import { derived, get, type Readable } from 'svelte/store';
 
-function debounceStore<T extends Stores>(original: T, timeout = 300) {
+function debounceStore<T extends Readable<any>>(original: T, timeout = 300) {
   return derived(
     original,
     ($original, set) => {
@@ -10,7 +10,6 @@ function debounceStore<T extends Stores>(original: T, timeout = 300) {
         clearTimeout(timer);
       };
     },
-    // @ts-expect-error
     get(original)
   );
 }
diff --git a/packages/svelte-ux/src/routes/+layout.svelte b/packages/svelte-ux/src/routes/+layout.svelte
index 0da50b628..893e67459 100644
--- a/packages/svelte-ux/src/routes/+layout.svelte
+++ b/packages/svelte-ux/src/routes/+layout.svelte
@@ -217,7 +217,7 @@
   <svelte:fragment slot="nav">
     <NavMenu />
     <!-- Spacer -->
-    <div class="h-4" />
+    <div class="h-4"></div>
   </svelte:fragment>
 
   <AppBar {title}>
@@ -302,7 +302,7 @@
             window.open(e.detail.value, '_blank');
           }}
         >
-          <span slot="selection" class="hidden" />
+          <span slot="selection" class="hidden"></span>
         </MenuButton>
       {/if}
     </div>
@@ -312,56 +312,3 @@
     <slot />
   </main>
 </AppLayout>
-
-<style lang="postcss">
-  :global(html) {
-    @apply bg-surface-200 accent-primary;
-    /* background-image:
-      radial-gradient(at 0% 0%, hsl(var(--color-secondary) / 0.33) 0px, transparent 50%),
-      radial-gradient(at 98% 1%, hsl(var(--color-primary) / 0.33) 0px, transparent 50%); */
-  }
-
-  :global(nav h1) {
-    @apply py-2 pl-4 mt-4 text-sm text-surface-content font-bold bg-surface-200 border-t border-b;
-  }
-
-  :global(nav h2) {
-    @apply pt-4 pb-2 pl-4 text-xs text-surface-content font-bold;
-  }
-
-  :global(main :is(h1, h2, h3):not(.prose *, .related *, .ApiDocs *)) {
-    scroll-margin-top: calc(var(--headerHeight) + 148px); /* app header + docs header */
-  }
-
-  :global(main h1:not(.prose *, .related *, .ApiDocs *)) {
-    @apply text-xl font-semibold mt-4 mb-2 border-b pb-1;
-  }
-
-  :global(main h2:not(.prose *, .related *, .ApiDocs *)) {
-    @apply text-lg font-semibold mt-4 mb-1;
-  }
-
-  :global(main h3:not(.prose *, .related *, .ApiDocs *)) {
-    @apply text-xs text-surface-content/50 mb-1;
-  }
-  :global(main :not(.prose) h2 + h3) {
-    @apply -mt-1;
-  }
-
-  :global(main small) {
-    @apply text-xs text-surface-content/50 inline-block;
-  }
-
-  :global(.TableOfContents small) {
-    @apply hidden;
-  }
-
-  /* Code/Preview backgrounds */
-  :global(pre[class*='language-']) {
-    @apply bg-surface-content;
-  }
-
-  :global(.dark pre[class*='language-']) {
-    @apply bg-surface-300;
-  }
-</style>
diff --git a/packages/svelte-ux/src/routes/app.css b/packages/svelte-ux/src/routes/app.css
index b5c61c956..b3025af6a 100644
--- a/packages/svelte-ux/src/routes/app.css
+++ b/packages/svelte-ux/src/routes/app.css
@@ -1,3 +1,54 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+html {
+  @apply bg-surface-200 accent-primary scroll-smooth;
+  /* background-image:
+      radial-gradient(at 0% 0%, hsl(var(--color-secondary) / 0.33) 0px, transparent 50%),
+      radial-gradient(at 98% 1%, hsl(var(--color-primary) / 0.33) 0px, transparent 50%); */
+}
+
+nav h1 {
+  @apply py-2 pl-4 mt-4 text-sm text-surface-content font-bold bg-surface-200 border-t border-b;
+}
+
+nav h2 {
+  @apply pt-4 pb-2 pl-4 text-xs text-surface-content font-bold;
+}
+
+main :is(h1, h2, h3):not(.prose *, .related *, .ApiDocs *) {
+  scroll-margin-top: calc(var(--headerHeight) + 148px); /* app header + docs header */
+}
+
+main h1:not(.prose *, .related *, .ApiDocs *) {
+  @apply text-xl font-semibold mt-4 mb-2 border-b pb-1;
+}
+
+main h2:not(.prose *, .related *, .ApiDocs *) {
+  @apply text-lg font-semibold mt-4 mb-1;
+}
+
+main h3:not(.prose *, .related *, .ApiDocs *) {
+  @apply text-xs text-surface-content/50 mb-1;
+}
+main :not(.prose) h2 + h3 {
+  @apply -mt-1;
+}
+
+main small {
+  @apply text-xs text-surface-content/50 inline-block;
+}
+
+.TableOfContents small {
+  @apply hidden;
+}
+
+/* Code/Preview backgrounds */
+pre[class*='language-'] {
+  @apply bg-surface-content;
+}
+
+.dark pre[class*='language-'] {
+  @apply bg-surface-300;
+}
diff --git a/packages/svelte-ux/src/routes/docs/actions/dataBackground/+page.svelte b/packages/svelte-ux/src/routes/docs/actions/dataBackground/+page.svelte
index f0009e4d7..16314e2a0 100644
--- a/packages/svelte-ux/src/routes/docs/actions/dataBackground/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/actions/dataBackground/+page.svelte
@@ -100,26 +100,28 @@
 
 <Preview>
   <table class="w-full border">
-    {#each sorted ? sort(values) : values as value}
-      <!-- re-mount if duration changes so action is updated -->
-      {#key duration}
-        <tr>
-          <td
-            class="text-right border tabular-nums"
-            use:dataBackground={{
-              value,
-              color: value > 0 ? 'hsl(140 80% 80%)' : 'hsl(0 80% 80%)',
-              domain,
-              inset,
-              baseline,
-              tweened: { duration },
-            }}
-          >
-            <TweenedValue {value} format="integer" options={{ duration }} />
-          </td>
-        </tr>
-      {/key}
-    {/each}
+    <tbody>
+      {#each sorted ? sort(values) : values as value}
+        <!-- re-mount if duration changes so action is updated -->
+        {#key duration}
+          <tr>
+            <td
+              class="text-right border tabular-nums"
+              use:dataBackground={{
+                value,
+                color: value > 0 ? 'hsl(140 80% 80%)' : 'hsl(0 80% 80%)',
+                domain,
+                inset,
+                baseline,
+                tweened: { duration },
+              }}
+            >
+              <TweenedValue {value} format="integer" options={{ duration }} />
+            </td>
+          </tr>
+        {/key}
+      {/each}
+    </tbody>
   </table>
 </Preview>
 
@@ -127,27 +129,29 @@
 
 <Preview>
   <table class="w-full border">
-    {#each sorted ? sort(values) : values as value}
-      <!-- re-mount if duration changes so action is updated -->
-      {#key duration}
-        <tr>
-          <td
-            class={cls(
-              'text-right border tabular-nums',
-              value > 0 ? 'from-success-300 to-success-500' : 'from-danger to-danger-300'
-            )}
-            use:dataBackground={{
-              value,
-              domain,
-              inset,
-              baseline,
-              tweened: { duration },
-            }}
-          >
-            <TweenedValue {value} format="integer" options={{ duration }} />
-          </td>
-        </tr>
-      {/key}
-    {/each}
+    <tbody>
+      {#each sorted ? sort(values) : values as value}
+        <!-- re-mount if duration changes so action is updated -->
+        {#key duration}
+          <tr>
+            <td
+              class={cls(
+                'text-right border tabular-nums',
+                value > 0 ? 'from-success-300 to-success-500' : 'from-danger to-danger-300'
+              )}
+              use:dataBackground={{
+                value,
+                domain,
+                inset,
+                baseline,
+                tweened: { duration },
+              }}
+            >
+              <TweenedValue {value} format="integer" options={{ duration }} />
+            </td>
+          </tr>
+        {/key}
+      {/each}
+    </tbody>
   </table>
 </Preview>
diff --git a/packages/svelte-ux/src/routes/docs/actions/input/+page.svelte b/packages/svelte-ux/src/routes/docs/actions/input/+page.svelte
index b0b24221f..e86852d69 100644
--- a/packages/svelte-ux/src/routes/docs/actions/input/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/actions/input/+page.svelte
@@ -33,7 +33,7 @@
 <h2>autoHeight <small>Automatically resize textarea based on content</small></h2>
 
 <Preview>
-  <textarea value="Example text" use:autoHeight class="border" />
+  <textarea value="Example text" use:autoHeight class="border"></textarea>
 </Preview>
 
 <h2>debounceEvent <small>Debounce any event (input, change, etc)</small></h2>
diff --git a/packages/svelte-ux/src/routes/docs/actions/mouse/+page.svelte b/packages/svelte-ux/src/routes/docs/actions/mouse/+page.svelte
index b77880663..3fe4ce8d2 100644
--- a/packages/svelte-ux/src/routes/docs/actions/mouse/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/actions/mouse/+page.svelte
@@ -60,7 +60,7 @@
       style="transform:
         translate({$coords.x}px,{$coords.y}px)
         rotate({$coords.x * 0.2}deg)"
-    />
+    ></div>
   </div>
 </Preview>
 
@@ -87,7 +87,7 @@
       style="transform:
         translate({$coords.x}px,{$coords.y}px)
         rotate({$coords.x * 0.2}deg)"
-    />
+    ></div>
   </div>
 </Preview>
 
@@ -114,7 +114,7 @@
       style="transform:
         translate({$coords.x}px,{$coords.y}px)
         rotate({$coords.x * 0.2}deg)"
-    />
+    ></div>
   </div>
 </Preview>
 
@@ -142,6 +142,6 @@
         translate({$coords.x}px,{$coords.y}px)
         rotate({$coords.x * 0.2}deg)
       "
-    />
+    ></div>
   </div>
 </Preview>
diff --git a/packages/svelte-ux/src/routes/docs/actions/observer/+page.svelte b/packages/svelte-ux/src/routes/docs/actions/observer/+page.svelte
index 3ca2cc6ff..b63e931f4 100644
--- a/packages/svelte-ux/src/routes/docs/actions/observer/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/actions/observer/+page.svelte
@@ -24,7 +24,7 @@
       e.target.innerText = JSON.stringify(e.detail.contentRect, null, 2);
     }}
     class="resize overflow-auto whitespace-pre outline rounded"
-  />
+  ></div>
 </Preview>
 
 <h3>Full coordinates (using `getBoundingClientRect()`)</h3>
@@ -37,7 +37,7 @@
       e.target.innerText = JSON.stringify(e.target.getBoundingClientRect(), null, 2);
     }}
     class="resize overflow-auto whitespace-pre outline rounded"
-  />
+  ></div>
 </Preview>
 
 <h3>Setting CSS variable</h3>
diff --git a/packages/svelte-ux/src/routes/docs/actions/styleProps/+page.svelte b/packages/svelte-ux/src/routes/docs/actions/styleProps/+page.svelte
index 33f754c82..a9c653c15 100644
--- a/packages/svelte-ux/src/routes/docs/actions/styleProps/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/actions/styleProps/+page.svelte
@@ -19,7 +19,7 @@
       class="w-10 h-10 rounded"
       style:background-color="var(--background)"
       style:border="var(--border)"
-    />
+    ></div>
     <div class="grid grid-flow-col gap-2">
       <TextField label="Background" bind:value={background} />
       <TextField label="Border" bind:value={border} />
diff --git a/packages/svelte-ux/src/routes/docs/components/BarStack/+page.svelte b/packages/svelte-ux/src/routes/docs/components/BarStack/+page.svelte
index 18218fc01..f10284292 100644
--- a/packages/svelte-ux/src/routes/docs/components/BarStack/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/components/BarStack/+page.svelte
@@ -78,7 +78,7 @@
 
 <Preview>
   <BarStack {data} let:item let:total>
-    <div class={cls('h-1 group-first:rounded-l group-last:rounded-r', item.classes?.bar)} />
+    <div class={cls('h-1 group-first:rounded-l group-last:rounded-r', item.classes?.bar)}></div>
     <div class="truncate text-xs font-semibold text-surface-content">
       {item.label}
     </div>
@@ -97,7 +97,7 @@
       placement="bottom-start"
       offset={2}
     >
-      <div class={cls('h-1 group-first:rounded-l group-last:rounded-r', item.classes?.bar)} />
+      <div class={cls('h-1 group-first:rounded-l group-last:rounded-r', item.classes?.bar)}></div>
       <div class="truncate text-xs font-semibold text-surface-content">
         {item.label}
       </div>
diff --git a/packages/svelte-ux/src/routes/docs/components/Drawer/+page.svelte b/packages/svelte-ux/src/routes/docs/components/Drawer/+page.svelte
index 95c88c2f1..5bc841dee 100644
--- a/packages/svelte-ux/src/routes/docs/components/Drawer/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/components/Drawer/+page.svelte
@@ -190,7 +190,7 @@
 <h2>Custom portal target</h2>
 
 <Preview>
-  <div id="portal" />
+  <div id="portal"></div>
 
   <Toggle let:on={open} let:toggle let:toggleOff>
     <Drawer
diff --git a/packages/svelte-ux/src/routes/docs/components/Gooey/+page.svelte b/packages/svelte-ux/src/routes/docs/components/Gooey/+page.svelte
index c3b7a7e3c..c842bd2d5 100644
--- a/packages/svelte-ux/src/routes/docs/components/Gooey/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/components/Gooey/+page.svelte
@@ -103,15 +103,15 @@
           <div
             class="w-[30px] h-[30px] bg-sky-500 rounded-full"
             style:transform="rotate({(360 / 8) * i}deg) translateX(var(--orbit-radius))"
-          />
+          ></div>
         {/each}
 
         <!-- Moving dot -->
-        <div class="orbit w-[26px] h-[26px] bg-cyan-300 rounded-full" />
+        <div class="orbit w-[26px] h-[26px] bg-cyan-300 rounded-full"></div>
       </div>
     </Gooey>
     <!-- glow -->
-    <div class="orbit w-[26px] h-[26px] bg-cyan-300 rounded-full blur-lg" />
+    <div class="orbit w-[26px] h-[26px] bg-cyan-300 rounded-full blur-lg"></div>
   </div>
 </Preview>
 
@@ -134,18 +134,18 @@
       <div class="flex gap-8">
         <!-- Fixed dots -->
         {#each { length: 4 } as _, i}
-          <div class="w-[30px] h-[30px] bg-sky-500 rounded-full" />
+          <div class="w-[30px] h-[30px] bg-sky-500 rounded-full"></div>
         {/each}
 
         <!-- Moving dot -->
         <div class="scanning absolute top-[2px] left-0 w-full">
-          <div class=" w-[26px] h-[26px] bg-cyan-300 rounded-full" />
+          <div class=" w-[26px] h-[26px] bg-cyan-300 rounded-full"></div>
         </div>
       </div>
     </Gooey>
     <!-- glow -->
     <div class="scanning absolute top-[2px] left-0 w-full">
-      <div class="w-[26px] h-[26px] bg-cyan-300 rounded-full blur-lg" />
+      <div class="w-[26px] h-[26px] bg-cyan-300 rounded-full blur-lg"></div>
     </div>
   </div>
 </Preview>
@@ -172,7 +172,7 @@
           style:--orbit-radius="60px"
           style:--orbit-start="{35 * i}deg"
           style:background-color="hsl({180 + i * 5}, 80%, 50%)"
-        />
+        ></div>
       {/each}
     </div>
   </Gooey>
@@ -188,10 +188,10 @@
     <Gooey blur={gooeyBlur} alphaPixel={18} alphaShift={-7} class="h-full w-full">
       <div
         class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-20 h-20 rounded-full bg-blue-500 blur-md"
-      />
+      ></div>
       <div
         class="absolute left-[--x] top-[--y] -translate-x-1/2 -translate-y-1/2 w-12 h-12 rounded-full bg-cyan-300 blur-md"
-      />
+      ></div>
     </Gooey>
   </div>
 </Preview>
diff --git a/packages/svelte-ux/src/routes/docs/components/Stack/+page.svelte b/packages/svelte-ux/src/routes/docs/components/Stack/+page.svelte
index 933f08246..32d3d94e1 100644
--- a/packages/svelte-ux/src/routes/docs/components/Stack/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/components/Stack/+page.svelte
@@ -199,9 +199,9 @@
     <Button variant="outline" icon={mdiFilterVariant} class="p-3" />
     <div
       class="bg-danger rounded-full h-4 w-4 -mt-1 text-xs flex items-center justify-center self-start justify-self-end border border-surface-100"
-    />
+    ></div>
     <div
       class="bg-success rounded-full h-4 w-4 text-xs flex items-center justify-center self-end justify-self-end border border-surface-100"
-    />
+    ></div>
   </Stack>
 </Preview>
diff --git a/packages/svelte-ux/src/routes/docs/components/StackTailwind/+page.svelte b/packages/svelte-ux/src/routes/docs/components/StackTailwind/+page.svelte
index 8117db0b0..1d1357418 100644
--- a/packages/svelte-ux/src/routes/docs/components/StackTailwind/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/components/StackTailwind/+page.svelte
@@ -199,9 +199,9 @@
     <Button icon={mdiFilterVariant} class="col-span-full row-span-full border p-3" />
     <div
       class="col-span-full row-span-full self-start justify-self-end bg-danger rounded-full h-4 w-4 -mt-1 text-xs flex items-center justify-center border border-surface-100"
-    />
+    ></div>
     <div
       class="col-span-full row-span-full self-end justify-self-end bg-success rounded-full h-4 w-4 text-xs flex items-center justify-center border border-surface-100"
-    />
+    ></div>
   </div>
 </Preview>
diff --git a/packages/svelte-ux/src/routes/docs/components/Tabs/+page.svelte b/packages/svelte-ux/src/routes/docs/components/Tabs/+page.svelte
index c18f2c20c..4afac01d6 100644
--- a/packages/svelte-ux/src/routes/docs/components/Tabs/+page.svelte
+++ b/packages/svelte-ux/src/routes/docs/components/Tabs/+page.svelte
@@ -32,7 +32,7 @@
 <Preview>
   <Tabs>
     {#each { length: 5 } as _, i}
-      {@const v = ++i}
+      {@const v = i + 1}
       <Tab on:click={() => (value = v)} selected={value === v}>Tab {v}</Tab>
     {/each}
 
diff --git a/packages/svelte-ux/src/routes/theme/ColorField.svelte b/packages/svelte-ux/src/routes/theme/ColorField.svelte
index b3885232f..13346bcc1 100644
--- a/packages/svelte-ux/src/routes/theme/ColorField.svelte
+++ b/packages/svelte-ux/src/routes/theme/ColorField.svelte
@@ -26,7 +26,7 @@
   {...$$restProps}
 >
   <div slot="prepend" class="grid grid-stack mr-3">
-    <div class="w-6 h-6 border rounded" style:background={value} />
+    <div class="w-6 h-6 border rounded" style:background={value}></div>
     <input
       type="color"
       value={formatHex(value)}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 024dec5b1..fec93de78 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -80,7 +80,7 @@ importers:
         version: 1.29.0
       sveld:
         specifier: ^0.20.0
-        version: 0.20.0(postcss-load-config@6.0.1(postcss@8.4.38))(postcss@8.4.38)
+        version: 0.20.0(postcss-load-config@4.0.2(postcss@8.4.38))(postcss@8.4.38)
       tailwind-merge:
         specifier: ^2.4.0
         version: 2.4.0
@@ -159,7 +159,7 @@ importers:
         version: 4.2.18
       svelte-check:
         specifier: ^3.8.4
-        version: 3.8.4(postcss-load-config@6.0.1(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18)
+        version: 3.8.4(postcss-load-config@4.0.2(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18)
       svelte2tsx:
         specifier: ^0.7.13
         version: 0.7.13(svelte@4.2.18)(typescript@5.5.3)
@@ -956,15 +956,6 @@ packages:
   date-fns@3.6.0:
     resolution: {integrity: sha512-fRHTG8g/Gif+kSh50gaGEdToemgfj74aRX3swtiouboip5JDLAyDE9F11nHMIcvOaXeOC6D7SpNhi7uFyB7Uww==}
 
-  debug@4.3.4:
-    resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
-    engines: {node: '>=6.0'}
-    peerDependencies:
-      supports-color: '*'
-    peerDependenciesMeta:
-      supports-color:
-        optional: true
-
   debug@4.3.5:
     resolution: {integrity: sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==}
     engines: {node: '>=6.0'}
@@ -1640,24 +1631,6 @@ packages:
       ts-node:
         optional: true
 
-  postcss-load-config@6.0.1:
-    resolution: {integrity: sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==}
-    engines: {node: '>= 18'}
-    peerDependencies:
-      jiti: '>=1.21.0'
-      postcss: '>=8.0.9'
-      tsx: ^4.8.1
-      yaml: ^2.4.2
-    peerDependenciesMeta:
-      jiti:
-        optional: true
-      postcss:
-        optional: true
-      tsx:
-        optional: true
-      yaml:
-        optional: true
-
   postcss-nested@6.0.1:
     resolution: {integrity: sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==}
     engines: {node: '>=12.0'}
@@ -2664,7 +2637,7 @@ snapshots:
   '@sveltejs/vite-plugin-svelte-inspector@2.1.0(@sveltejs/vite-plugin-svelte@3.1.1(svelte@4.2.18)(vite@5.3.3(@types/node@20.14.10)))(svelte@4.2.18)(vite@5.3.3(@types/node@20.14.10))':
     dependencies:
       '@sveltejs/vite-plugin-svelte': 3.1.1(svelte@4.2.18)(vite@5.3.3(@types/node@20.14.10))
-      debug: 4.3.4
+      debug: 4.3.5
       svelte: 4.2.18
       vite: 5.3.3(@types/node@20.14.10)
     transitivePeerDependencies:
@@ -2673,7 +2646,7 @@ snapshots:
   '@sveltejs/vite-plugin-svelte@3.1.1(svelte@4.2.18)(vite@5.3.3(@types/node@20.14.10))':
     dependencies:
       '@sveltejs/vite-plugin-svelte-inspector': 2.1.0(@sveltejs/vite-plugin-svelte@3.1.1(svelte@4.2.18)(vite@5.3.3(@types/node@20.14.10)))(svelte@4.2.18)(vite@5.3.3(@types/node@20.14.10))
-      debug: 4.3.4
+      debug: 4.3.5
       deepmerge: 4.3.1
       kleur: 4.1.5
       magic-string: 0.30.10
@@ -3025,10 +2998,6 @@ snapshots:
 
   date-fns@3.6.0: {}
 
-  debug@4.3.4:
-    dependencies:
-      ms: 2.1.2
-
   debug@4.3.5:
     dependencies:
       ms: 2.1.2
@@ -3654,13 +3623,6 @@ snapshots:
     optionalDependencies:
       postcss: 8.4.38
 
-  postcss-load-config@6.0.1(postcss@8.4.38):
-    dependencies:
-      lilconfig: 3.1.2
-    optionalDependencies:
-      postcss: 8.4.38
-    optional: true
-
   postcss-nested@6.0.1(postcss@8.4.38):
     dependencies:
       postcss: 8.4.38
@@ -3925,7 +3887,7 @@ snapshots:
 
   supports-preserve-symlinks-flag@1.0.0: {}
 
-  sveld@0.20.0(postcss-load-config@6.0.1(postcss@8.4.38))(postcss@8.4.38):
+  sveld@0.20.0(postcss-load-config@4.0.2(postcss@8.4.38))(postcss@8.4.38):
     dependencies:
       '@rollup/plugin-node-resolve': 13.3.0(rollup@2.79.1)
       acorn: 8.11.3
@@ -3935,7 +3897,7 @@ snapshots:
       rollup: 2.79.1
       rollup-plugin-svelte: 7.2.0(rollup@2.79.1)(svelte@4.2.18)
       svelte: 4.2.18
-      svelte-preprocess: 5.1.4(postcss-load-config@6.0.1(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18)(typescript@5.5.3)
+      svelte-preprocess: 5.1.4(postcss-load-config@4.0.2(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18)(typescript@5.5.3)
       typescript: 5.5.3
     transitivePeerDependencies:
       - '@babel/core'
@@ -3948,14 +3910,14 @@ snapshots:
       - stylus
       - sugarss
 
-  svelte-check@3.8.4(postcss-load-config@6.0.1(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18):
+  svelte-check@3.8.4(postcss-load-config@4.0.2(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18):
     dependencies:
       '@jridgewell/trace-mapping': 0.3.25
       chokidar: 3.6.0
       picocolors: 1.0.1
       sade: 1.8.1
       svelte: 4.2.18
-      svelte-preprocess: 5.1.4(postcss-load-config@6.0.1(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18)(typescript@5.5.3)
+      svelte-preprocess: 5.1.4(postcss-load-config@4.0.2(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18)(typescript@5.5.3)
       typescript: 5.5.3
     transitivePeerDependencies:
       - '@babel/core'
@@ -3972,7 +3934,7 @@ snapshots:
     dependencies:
       svelte: 4.2.18
 
-  svelte-preprocess@5.1.4(postcss-load-config@6.0.1(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18)(typescript@5.5.3):
+  svelte-preprocess@5.1.4(postcss-load-config@4.0.2(postcss@8.4.38))(postcss@8.4.38)(svelte@4.2.18)(typescript@5.5.3):
     dependencies:
       '@types/pug': 2.0.10
       detect-indent: 6.1.0
@@ -3982,7 +3944,7 @@ snapshots:
       svelte: 4.2.18
     optionalDependencies:
       postcss: 8.4.38
-      postcss-load-config: 6.0.1(postcss@8.4.38)
+      postcss-load-config: 4.0.2(postcss@8.4.38)
       typescript: 5.5.3
 
   svelte2tsx@0.7.13(svelte@4.2.18)(typescript@5.5.3):