@svadmin/ui 0.84.1 → 0.85.0

package/dist/app.css

@@ -6471,6 +6471,20 @@
   }
 }
 @layer components {
+  /*
+   * The skip link uses a generated translate-y utility, whose composite
+   * translate declaration is invalid when no x-axis value is present.
+   * Keep this accessibility control hidden until focus without relying on
+   * the host application's utility CSS implementation.
+   */
+  [data-svadmin-skip-link] {
+    transform: translateY(calc(-100% - 1rem));
+  }
+  [data-svadmin-skip-link]:focus,
+  [data-svadmin-skip-link]:focus-visible {
+    transform: translateY(0);
+  }
+
   .svadmin-page-header {
     --svadmin-page-header-gap: 0.5rem;
     min-width: 0;

package/dist/app.theme.css

@@ -6471,6 +6471,20 @@
   }
 }
 @layer components {
+  /*
+   * The skip link uses a generated translate-y utility, whose composite
+   * translate declaration is invalid when no x-axis value is present.
+   * Keep this accessibility control hidden until focus without relying on
+   * the host application's utility CSS implementation.
+   */
+  [data-svadmin-skip-link] {
+    transform: translateY(calc(-100% - 1rem));
+  }
+  [data-svadmin-skip-link]:focus,
+  [data-svadmin-skip-link]:focus-visible {
+    transform: translateY(0);
+  }
+
   .svadmin-page-header {
     --svadmin-page-header-gap: 0.5rem;
     min-width: 0;

package/dist/components/AuthPageShell.svelte

@@ -8,25 +8,32 @@
     description?: string;
     children: Snippet;
     footer?: Snippet;
+    brandMark?: Snippet;
   }
 
-  let { brand, title, description, children, footer }: Props = $props();
+  let { brand, title, description, children, footer, brandMark }: Props = $props();
 </script>
 
 <div class="svadmin-u-f3c543ad5fe9 svadmin-u-793346c7362c svadmin-u-967d113a1451 svadmin-u-5d17652eacdf" data-svadmin-auth-page>
-  <aside class="svadmin-u-99d72c7fc3e2 svadmin-u-5ceb636bd9f3 svadmin-u-18049387f0af svadmin-u-cd0ad9a56558 svadmin-u-a4d0f420b78d svadmin-u-3eb153dc198f svadmin-u-a94f89d92058 svadmin-u-62c392c49841 svadmin-u-a06ab179a5d5">
-    <div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-1004c0c3954c"><SvadminLogo size={40} /><span class="svadmin-u-42536e69e639 svadmin-u-e83a7042bc91 svadmin-u-d4108abe6359">{brand}</span></div>
+  <aside class="svadmin-u-99d72c7fc3e2 svadmin-u-5ceb636bd9f3 svadmin-u-18049387f0af svadmin-u-cd0ad9a56558 svadmin-u-a4d0f420b78d svadmin-u-3eb153dc198f svadmin-u-a94f89d92058 svadmin-u-62c392c49841 svadmin-u-a06ab179a5d5" data-svadmin-auth-aside>
+    <div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-1004c0c3954c" data-svadmin-auth-brand>
+      {#if brandMark}{@render brandMark()}{:else}<span data-svadmin-auth-default-mark><SvadminLogo size={40} /></span>{/if}
+      <span class="svadmin-u-42536e69e639 svadmin-u-e83a7042bc91 svadmin-u-d4108abe6359">{brand}</span>
+    </div>
     <div class="svadmin-u-2472e9b81a97 svadmin-u-6ed543e2fbbb"><h2 class="svadmin-u-3febee094e85 svadmin-u-e83a7042bc91 svadmin-u-e9fadafbd4a2 svadmin-u-d4108abe6359">{title}</h2>{#if description}<p class="svadmin-u-fc7473ca09eb svadmin-u-18550d5945ae svadmin-u-bfa603190748">{description}</p>{/if}</div>
     <p class="svadmin-u-359090c2d529 svadmin-u-bfa603190748">{brand}</p>
   </aside>
-  <main class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-86843cf1e227 svadmin-u-c07e54fd1439 svadmin-u-e91f4cd3974c svadmin-u-de2d5f919ba9">
+  <main class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-86843cf1e227 svadmin-u-c07e54fd1439 svadmin-u-e91f4cd3974c svadmin-u-de2d5f919ba9" data-svadmin-auth-main>
     <div class="svadmin-u-6da6a3c3f741 svadmin-u-9794ab45094d svadmin-u-b43b4c086d9a">
-      <div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-1004c0c3954c svadmin-u-a327049cac5b"><SvadminLogo size={36} /><span class="svadmin-u-4ee734926ff6 svadmin-u-e83a7042bc91 svadmin-u-d4108abe6359">{brand}</span></div>
-      <section class="svadmin-u-5f22e64f2282 svadmin-u-ca6bcd4b6f3f svadmin-u-18049387f0af svadmin-u-cd0ad9a56558 svadmin-u-c07e54fd1439 svadmin-u-438b2237b8d6 svadmin-u-e299d4635ea7">
+      <div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-1004c0c3954c svadmin-u-a327049cac5b" data-svadmin-auth-brand>
+        {#if brandMark}{@render brandMark()}{:else}<span data-svadmin-auth-default-mark><SvadminLogo size={36} /></span>{/if}
+        <span class="svadmin-u-4ee734926ff6 svadmin-u-e83a7042bc91 svadmin-u-d4108abe6359">{brand}</span>
+      </div>
+      <section class="svadmin-u-5f22e64f2282 svadmin-u-ca6bcd4b6f3f svadmin-u-18049387f0af svadmin-u-cd0ad9a56558 svadmin-u-c07e54fd1439 svadmin-u-438b2237b8d6 svadmin-u-e299d4635ea7" data-svadmin-auth-card>
         <header class="svadmin-u-b6777c6db914 svadmin-u-6f7e013d6499"><h1 class="svadmin-u-d5c9b0001e7e svadmin-u-e83a7042bc91 svadmin-u-e9fadafbd4a2 svadmin-u-d4108abe6359">{title}</h1>{#if description}<p class="svadmin-u-fc7473ca09eb svadmin-u-18550d5945ae svadmin-u-bfa603190748">{description}</p>{/if}</header>
         {@render children()}
       </section>
-      {#if footer}<div class="svadmin-u-ca6bf63030aa">{@render footer()}</div>{/if}
+      {#if footer}<div class="svadmin-u-ca6bf63030aa" data-svadmin-auth-footer>{@render footer()}</div>{/if}
     </div>
   </main>
 </div>

package/dist/components/AuthPageShell.svelte.d.ts

@@ -5,6 +5,7 @@ interface Props {
     description?: string;
     children: Snippet;
     footer?: Snippet;
+    brandMark?: Snippet;
 }
 declare const AuthPageShell: import("svelte").Component<Props, {}, "">;
 type AuthPageShell = ReturnType<typeof AuthPageShell>;

package/dist/page-chrome.css

@@ -1,4 +1,18 @@
 @layer components {
+  /*
+   * The skip link uses a generated translate-y utility, whose composite
+   * translate declaration is invalid when no x-axis value is present.
+   * Keep this accessibility control hidden until focus without relying on
+   * the host application's utility CSS implementation.
+   */
+  [data-svadmin-skip-link] {
+    transform: translateY(calc(-100% - 1rem));
+  }
+  [data-svadmin-skip-link]:focus,
+  [data-svadmin-skip-link]:focus-visible {
+    transform: translateY(0);
+  }
+
   .svadmin-page-header {
     --svadmin-page-header-gap: 0.5rem;
     min-width: 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@svadmin/ui",
-  "version": "0.84.1",
+  "version": "0.85.0",
   "description": "Pre-built admin UI components — AdminApp, AutoTable, AutoForm, Sidebar, Layout",
   "type": "module",
   "sideEffects": [