@sentropic/design-system-svelte 0.34.27 → 0.34.28

package/dist/AppChrome.svelte

@@ -75,6 +75,10 @@
     /** Zone identité à droite (IdentityMenu, bouton connexion, …). */
     identity?: Snippet;
 
+    // ── Contrôles additionnels ─────────────────────────────────────────────────
+    /** Contrôles additionnels dans la zone utilitaire. */
+    extraSelectors?: Snippet;
+
     // ── Mobile ─────────────────────────────────────────────────────────────────
     /** État ouvert du tiroir mobile (contrôlé). */
     mobileMenuOpen?: boolean;
@@ -95,10 +99,10 @@
 <script lang="ts">
   import { untrack } from "svelte";
   import {
-    Boxes,
     ChevronDown,
     Github,
     Globe,
+    Menu,
     Moon,
     Palette,
     Sun,
@@ -127,6 +131,7 @@
     githubHref,
     githubLabel = "GitHub",
     identity,
+    extraSelectors,
     mobileMenuOpen = false,
     onMobileMenuToggle,
     menuLabel = "Menu",
@@ -320,6 +325,7 @@
     {#if showLocaleSelector}{@render localeSelector()}{/if}
     {#if showGithub}{@render githubLink()}{/if}
     {#if identity}<div class="st-appChrome__identity">{@render identity()}</div>{/if}
+    {#if extraSelectors}<div class="st-appChrome__extraSelectors">{@render extraSelectors()}</div>{/if}
   </div>
 {/snippet}
 
@@ -334,7 +340,7 @@
     aria-controls={drawerId}
     aria-label={menuLabel}
   >
-    <Boxes size={20} aria-hidden="true" />
+    <Menu size={20} aria-hidden="true" />
   </button>
 {/snippet}
 
@@ -434,11 +440,18 @@
      react/vue : la source de vérité du CSS est le bloc publié (styles.css).
      Ce <style> scoped ne fait que rendre la démo Svelte autonome. */
   .st-appChrome {
+    position: sticky;
+    top: 0;
     width: 100%;
+    z-index: 30;
   }
 
   :global(.st-appChrome__header .st-appHeader__bar) {
+    background: color-mix(in srgb, var(--st-semantic-surface-default) 96%, transparent);
+    backdrop-filter: blur(8px);
+    height: 5rem;
     max-width: none;
+    padding: 0 var(--st-spacing-6, 1.5rem);
   }
 
   .st-appChrome__brand {
@@ -482,7 +495,7 @@
   .st-appChrome__utilityNav {
     align-items: center;
     display: flex;
-    gap: var(--st-spacing-2, 0.5rem);
+    gap: var(--st-spacing-1, 0.25rem);
   }
 
   .st-appChrome__menuWrap {
@@ -579,6 +592,12 @@
     color: var(--st-semantic-text-primary);
   }
 
+  .st-appChrome__extraSelectors {
+    align-items: center;
+    display: flex;
+    gap: var(--st-spacing-1, 0.25rem);
+  }
+
   .st-appChrome__drawer {
     background: var(--st-semantic-surface-default);
     border-bottom: 1px solid var(--st-semantic-border-subtle);

package/dist/AppChrome.svelte.d.ts

@@ -60,6 +60,8 @@ export interface AppChromeProps {
     githubLabel?: string;
     /** Zone identité à droite (IdentityMenu, bouton connexion, …). */
     identity?: Snippet;
+    /** Contrôles additionnels dans la zone utilitaire. */
+    extraSelectors?: Snippet;
     /** État ouvert du tiroir mobile (contrôlé). */
     mobileMenuOpen?: boolean;
     /** Callback de bascule du tiroir mobile. */

package/dist/AppChrome.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppChrome.svelte.d.ts","sourceRoot":"","sources":["../src/lib/AppChrome.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEtC,iDAAiD;AACjD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,kDAAkD;IAClD,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,wCAAwC;AACxC,MAAM,WAAW,oBAAoB;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;AAC3D,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,CAAC;AAE1C,MAAM,WAAW,cAAc;IAE7B,4CAA4C;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2DAA2D;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,uDAAuD;IACvD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,+DAA+D;IAC/D,GAAG,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACzB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAGlB,yDAAyD;IACzD,MAAM,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAChC,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uCAAuC;IACvC,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,wCAAwC;IACxC,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,4DAA4D;IAC5D,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IACvD,0DAA0D;IAC1D,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IAGhE,2DAA2D;IAC3D,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,wCAAwC;IACxC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;IACnD,yCAAyC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IAGrB,qDAAqD;IACrD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iCAAiC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IAGrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IAGnB,+CAA+C;IAC/C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,4CAA4C;IAC5C,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAqRH,QAAA,MAAM,SAAS,oDAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}
+{"version":3,"file":"AppChrome.svelte.d.ts","sourceRoot":"","sources":["../src/lib/AppChrome.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEtC,iDAAiD;AACjD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,kDAAkD;IAClD,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,wCAAwC;AACxC,MAAM,WAAW,oBAAoB;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;AAC3D,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,CAAC;AAE1C,MAAM,WAAW,cAAc;IAE7B,4CAA4C;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2DAA2D;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,uDAAuD;IACvD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,+DAA+D;IAC/D,GAAG,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACzB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAGlB,yDAAyD;IACzD,MAAM,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAChC,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uCAAuC;IACvC,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,wCAAwC;IACxC,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,4DAA4D;IAC5D,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IACvD,0DAA0D;IAC1D,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IAGhE,2DAA2D;IAC3D,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,wCAAwC;IACxC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;IACnD,yCAAyC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IAGrB,qDAAqD;IACrD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iCAAiC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IAGrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IAGnB,sDAAsD;IACtD,cAAc,CAAC,EAAE,OAAO,CAAC;IAGzB,+CAA+C;IAC/C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,4CAA4C;IAC5C,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAuRH,QAAA,MAAM,SAAS,oDAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}

package/dist/AppChrome.test.js

@@ -120,3 +120,13 @@ describe("AppChrome — mobile burger + tiroir", () => {
         expect(onMobileMenuToggle).toHaveBeenCalledTimes(1);
     });
 });
+describe("AppChrome — extraSelectors", () => {
+    it("renders extraSelectors snippet content in the utility nav", () => {
+        const { container } = render(AppChrome, { props: { extraSelectors: snippet("extra-ctrl") } });
+        expect(container.querySelector(".st-appChrome__extraSelectors")?.textContent).toContain("extra-ctrl");
+    });
+    it("does not render extraSelectors div when not provided", () => {
+        const { container } = render(AppChrome);
+        expect(container.querySelector(".st-appChrome__extraSelectors")).toBeNull();
+    });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sentropic/design-system-svelte",
-  "version": "0.34.27",
+  "version": "0.34.28",
   "type": "module",
   "publishConfig": {
     "access": "public"