@svadmin/ui 0.28.0 → 0.29.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@svadmin/ui",
-  "version": "0.28.0",
+  "version": "0.29.0",
   "description": "Pre-built admin UI components — AdminApp, AutoTable, AutoForm, Sidebar, Layout",
   "type": "module",
   "sideEffects": [
@@ -20,7 +20,7 @@
     "./components/*": "./src/components/*"
   },
   "peerDependencies": {
-    "@svadmin/core": "^0.19.5",
+    "@svadmin/core": "^0.20.0",
     "@tanstack/svelte-query": "^6.0.0",
     "highlight.js": "^11.11.1",
     "isomorphic-dompurify": "^3.7.1",

package/src/components/AdminApp.svelte

@@ -45,6 +45,8 @@
     components?: Partial<ComponentRegistry>;
     /** Custom multi-level menu configuration */
     menu?: MenuItem[];
+    /** External URL to the main application or workspace (renders a shortcut in the header) */
+    siteUrl?: string;
   }
 
   let {
@@ -60,6 +62,7 @@
     loginPage,
     components: userComponents,
     menu,
+    siteUrl,
   }: Props = $props();
 
   // Default component registry
@@ -148,7 +151,7 @@
   {:else if route === '/login' || route === '/register' || route === '/forgot-password' || route === '/update-password'}
     <ConfigErrorScreen title="{title} — {t('common.configRequired')}" />
   {:else if isAuthenticated || !authProvider}
-    <Layout {title} {menu}>
+    <Layout {title} {menu} {siteUrl}>
       {#key route + (params.resource ?? '') + (params.id ?? '')}
       <div class="svadmin-page-enter">
       {#if currentPath().startsWith('/settings')}

package/src/components/Header.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { Moon, Sun, Search } from '@lucide/svelte';
+  import { Moon, Sun, Search, MonitorUp } from '@lucide/svelte';
   import { Button } from './ui/button';
   import TooltipButton from './TooltipButton.svelte';
   import { getResolvedTheme, toggleTheme } from '@svadmin/core';
@@ -15,6 +15,7 @@
     children,
     /** Slot for additional actions on the right side of the header */
     rightActions,
+    siteUrl,
   } = $props<{
     showThemeToggle?: boolean;
     showBreadcrumbs?: boolean;
@@ -22,6 +23,7 @@
     onSearchClick?: () => void;
     children?: import('svelte').Snippet;
     rightActions?: import('svelte').Snippet;
+    siteUrl?: string;
   }>();
 
   // Retrieve optional component overrides from registry
@@ -50,6 +52,12 @@
       {@render rightActions()}
     {/if}
 
+    {#if siteUrl}
+      <TooltipButton tooltip={t('common.goToSite') || 'Site'} href={siteUrl} target="_blank" rel="noopener noreferrer" class="rounded-full flex items-center justify-center">
+        <MonitorUp class="h-4 w-4 text-muted-foreground transition-colors hover:text-foreground" />
+      </TooltipButton>
+    {/if}
+
     {#if CustomNotificationPanel}
       <CustomNotificationPanel />
     {/if}

package/src/components/Layout.svelte

@@ -22,7 +22,7 @@
   let shortcutsOpen = $state(false);
   let mobileMenuOpen = $state(false);
 
-  let { children, title = 'Admin', menu }: { children: Snippet; title?: string; menu?: MenuItem[] } = $props();
+  let { children, title = 'Admin', menu, siteUrl }: { children: Snippet; title?: string; menu?: MenuItem[]; siteUrl?: string } = $props();
 
   let hasAuth = true;
   let auth: ReturnType<typeof getAuthProvider> | null = null;
@@ -138,6 +138,7 @@
     >
       <!-- Header with mobile hamburger -->
       <Header
+        {siteUrl}
         showSearch={true}
         onSearchClick={() => { commandOpen = true; }}
       >