chore: bump ui-svelte to 1.18

packages/frontend/package.json

@@ -24,7 +24,7 @@
     "@fortawesome/free-brands-svg-icons": "^6.6.0",
     "@fortawesome/free-regular-svg-icons": "^6.6.0",
     "@fortawesome/free-solid-svg-icons": "^6.6.0",
-    "@podman-desktop/ui-svelte": "1.17.2",
+    "@podman-desktop/ui-svelte": "1.18.0",
     "@sveltejs/vite-plugin-svelte": "5.0.3",
     "@tailwindcss/typography": "^0.5.14",
     "@testing-library/dom": "^10.4.0",

packages/frontend/src/lib/create/CreateService.svelte

@@ -125,10 +125,10 @@ function addScript(type: 'sql' | 'sh') {
     breadcrumbTitle="Go back to Services"
     onclose={goToUpPage}
     onbreadcrumbClick={goToUpPage}>
-    <svelte:fragment slot="icon">
+    {#snippet icon()}
       <i class="fas fa-cube fa-2x" aria-hidden="true"></i>
-    </svelte:fragment>
-    <svelte:fragment slot="content">
+    {/snippet}
+    {#snippet content()}
       <div class="p-5 min-w-full h-full flex flex-col">
         {#if error}
           <div class="m-4 text-red-600">{error}</div>
@@ -306,6 +306,6 @@ function addScript(type: 'sql' | 'sh') {
           </div>
         </div>
       </div>
-    </svelte:fragment>
+    {/snippet}
   </FormPage>
 </Route>

packages/frontend/src/lib/details/ServiceDetails.svelte

@@ -34,16 +34,18 @@ onMount(async () => {
     breadcrumbTitle="Go back to Services"
     onclose={goToUpPage}
     onbreadcrumbClick={goToUpPage}>
-    <svelte:fragment slot="subtitle">
+    {#snippet subtitleSnippet()}
       <div class="flex gap-x-2 items-center text-[var(--pd-content-sub-header)]">
         <span class="text-xs">{service?.name}</span>
       </div>
-    </svelte:fragment>
-    <svelte:fragment slot="tabs">
+    {/snippet}
+    {#snippet tabsSnippet()}
       <Tab title="Summary" selected={isTabSelected($router.path, 'summary')} url={`${containerId}/summary`} />
-    </svelte:fragment>
-    <svelte:fragment slot="content">
-      <Route path="/summary" breadcrumb="Summary"><Summary service={service} /></Route>
-    </svelte:fragment>
+    {/snippet}
+    {#snippet contentSnippet()}
+      {#if service}
+        <Route path="/summary" breadcrumb="Summary"><Summary service={service} /></Route>
+      {/if}
+    {/snippet}
   </DetailsPage>
 {/if}