@breadstone/mosaik-elements-svelte 0.0.245 → 0.0.247

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+## 0.0.247 (2026-05-01)
+
+This was a version bump only for mosaik-elements-svelte to align it with other projects, there were no code changes.
+
+## 0.0.246 (2026-04-30)
+
+This was a version bump only for mosaik-elements-svelte to align it with other projects, there were no code changes.
+
 ## 0.0.245 (2026-04-30)
 
 ### 🚀 Features

package/index.mjs

@@ -20861,7 +20861,7 @@ var Iw;
 //#endregion
 //#region ../mosaik-elements-foundation/dist/Controls/Components/Primitives/Portal/Portal.js
 var Lw = /* @__PURE__ */ new Map(), sde = class e {
-	static _z = 999;
+	static _z = 1099;
 	static next() {
 		return ++e._z;
 	}
@@ -21134,6 +21134,7 @@ function dde() {
 :host {
   pointer-events: none;
   z-index: var(--portal-z-index, 100);
+  position: fixed;
   inset: 0;
 }
 
@@ -21201,6 +21202,7 @@ function fde() {
 :host {
   pointer-events: none;
   z-index: var(--portal-z-index, 100);
+  position: fixed;
   inset: 0;
 }
 
@@ -21268,6 +21270,7 @@ function pde() {
 :host {
   pointer-events: none;
   z-index: var(--portal-z-index, 100);
+  position: fixed;
   inset: 0;
 }
 
@@ -61366,8 +61369,8 @@ function lN() {
 :host {
   --breadcrumb-font-family: unset;
   --breadcrumb-font-letter-spacing: unset;
-  --breadcrumb-font-line-height: unset;
-  --breadcrumb-font-size: unset;
+  --breadcrumb-font-line-height: var(--cosmopolitan-typography-body2-line-height);
+  --breadcrumb-font-size: var(--cosmopolitan-typography-body2-font-size);
   --breadcrumb-font-text-decoration: unset;
   --breadcrumb-font-text-transform: unset;
   --breadcrumb-font-weight: unset;
@@ -61415,6 +61418,8 @@ function lN() {
 }
 
 :host {
+  font-size: var(--breadcrumb-font-size);
+  line-height: var(--breadcrumb-font-line-height);
   flex-direction: row;
   align-items: center;
   gap: 12px;
@@ -61438,8 +61443,8 @@ function uN() {
 :host {
   --breadcrumb-font-family: unset;
   --breadcrumb-font-letter-spacing: unset;
-  --breadcrumb-font-line-height: unset;
-  --breadcrumb-font-size: unset;
+  --breadcrumb-font-line-height: var(--joy-typography-body2-line-height);
+  --breadcrumb-font-size: var(--joy-typography-body2-font-size);
   --breadcrumb-font-text-decoration: unset;
   --breadcrumb-font-text-transform: unset;
   --breadcrumb-font-weight: unset;
@@ -61487,6 +61492,8 @@ function uN() {
 }
 
 :host {
+  font-size: var(--breadcrumb-font-size);
+  line-height: var(--breadcrumb-font-line-height);
   flex-direction: row;
   align-items: center;
   gap: 12px;
@@ -61510,8 +61517,8 @@ function dN() {
 :host {
   --breadcrumb-font-family: unset;
   --breadcrumb-font-letter-spacing: unset;
-  --breadcrumb-font-line-height: unset;
-  --breadcrumb-font-size: unset;
+  --breadcrumb-font-line-height: var(--memphis-typography-body2-line-height);
+  --breadcrumb-font-size: var(--memphis-typography-body2-font-size);
   --breadcrumb-font-text-decoration: unset;
   --breadcrumb-font-text-transform: unset;
   --breadcrumb-font-weight: unset;
@@ -61559,6 +61566,8 @@ function dN() {
 }
 
 :host {
+  font-size: var(--breadcrumb-font-size);
+  line-height: var(--breadcrumb-font-line-height);
   flex-direction: row;
   align-items: center;
   gap: 12px;
@@ -123623,7 +123632,7 @@ function $q() {
   --menu-item-background-color: var(--joy-scheme-highlight);
 }
 
-:host([is-active]:hover) [part="root"] {
+:host([is-active]:not([is-active="false" i])):hover [part="root"] {
   --menu-item-background-color: var(--joy-color-primary-300);
 }
 
@@ -134554,21 +134563,25 @@ function TZ(e) {
                 <slot name="prefix"></slot>
             </div>
             <div part="heading">
-                <slot name="header">
-                    <mosaik-text .text="${e.text}"
-                                 .wrap="${!0}"></mosaik-text>
-                </slot>
-                <slot name="subHeader">
-                    <mosaik-text .text="${e.subText}"
-                                 .wrap="${!0}"
-                                 .maxLines="${1}"></mosaik-text>
-                </slot>
-                <slot name="additionalHeader">
-                     <mosaik-text .text="${e.additionalText}"
-                                  .wrap="${!0}"
-                                  .maxLines="${3}"></mosaik-text>
-                </slot>
-                <slot></slot>
+                <div part="heading">
+                    <slot name="header">
+                        <mosaik-text .text="${e.text}"
+                                    .wrap="${!0}"></mosaik-text>
+                    </slot>
+                    <slot name="subHeader">
+                        <mosaik-text .text="${e.subText}"
+                                    .wrap="${!0}"
+                                    .maxLines="${1}"></mosaik-text>
+                    </slot>
+                    <slot name="additionalHeader">
+                        <mosaik-text .text="${e.additionalText}"
+                                    .wrap="${!0}"
+                                    .maxLines="${3}"></mosaik-text>
+                    </slot>
+                </div>
+                <div part="content">
+                    <slot></slot>
+                </div>
             </div>
             <div part="suffix"
                  ?hidden="${!wM(e, "has-suffix", e.hasSlotContent("suffix"))}">
@@ -134611,6 +134624,7 @@ function EZ() {
   --page-header-padding-left: unset;
   --page-header-padding-right: unset;
   --page-header-padding-top: unset;
+  --page-header-prefix-gap: unset;
   --page-header-shadow: unset unset unset unset unset;
   --page-header-shadow-blur: unset;
   --page-header-shadow-color: unset;
@@ -134624,6 +134638,7 @@ function EZ() {
   --page-header-sub-header-font-text-decoration: var(--cosmopolitan-typography-subtitle1-text-decoration);
   --page-header-sub-header-font-text-transform: var(--cosmopolitan-typography-subtitle1-text-transform);
   --page-header-sub-header-font-weight: var(--cosmopolitan-typography-subtitle1-font-weight);
+  --page-header-suffix-gap: unset;
   --page-header-transition-duration: unset;
   --page-header-transition-mode: unset;
   --page-header-transition-property: unset;
@@ -134667,7 +134682,7 @@ function EZ() {
   text-transform: var(--page-header-font-text-transform);
   background-color: var(--page-header-background-color);
   color: var(--page-header-foreground-color);
-  flex-direction: column;
+  flex-direction: row;
   flex: 1;
   display: flex;
   position: relative;
@@ -134685,7 +134700,9 @@ function EZ() {
 }
 
 :host [part="root"] [part="prefix"] {
+  gap: var(--page-header-prefix-gap);
   flex-shrink: 1;
+  align-self: flex-start;
   align-items: center;
   display: flex;
 }
@@ -134704,7 +134721,17 @@ function EZ() {
   display: none;
 }
 
+:host [part="root"] [part="heading"] [part="content"] {
+  flex-direction: column;
+  display: flex;
+}
+
+:host [part="root"] [part="heading"] [part="content"][hidden] {
+  display: none;
+}
+
 :host [part="root"] [part="suffix"] {
+  gap: var(--page-header-suffix-gap);
   flex-shrink: 1;
   align-items: center;
   display: flex;
@@ -134807,7 +134834,7 @@ function DZ() {
   --page-header-font-text-transform: var(--joy-typography-headline4-text-transform);
   --page-header-font-weight: var(--joy-typography-headline4-font-weight);
   --page-header-foreground-color: var(--joy-scheme-foreground);
-  --page-header-gap: unset;
+  --page-header-gap: calc(var(--joy-layout-space) * 2);
   --page-header-header-font-family: var(--joy-font-family);
   --page-header-header-font-letter-spacing: var(--joy-typography-headline4-letter-spacing);
   --page-header-header-font-line-height: var(--joy-typography-headline4-line-height);
@@ -134820,6 +134847,7 @@ function DZ() {
   --page-header-padding-left: unset;
   --page-header-padding-right: unset;
   --page-header-padding-top: unset;
+  --page-header-prefix-gap: var(--joy-layout-space);
   --page-header-shadow: unset unset unset unset unset;
   --page-header-shadow-blur: unset;
   --page-header-shadow-color: unset;
@@ -134833,6 +134861,7 @@ function DZ() {
   --page-header-sub-header-font-text-decoration: var(--joy-typography-subtitle1-text-decoration);
   --page-header-sub-header-font-text-transform: var(--joy-typography-subtitle1-text-transform);
   --page-header-sub-header-font-weight: var(--joy-typography-subtitle1-font-weight);
+  --page-header-suffix-gap: var(--joy-layout-space);
   --page-header-transition-duration: unset;
   --page-header-transition-mode: unset;
   --page-header-transition-property: unset;
@@ -134876,7 +134905,7 @@ function DZ() {
   text-transform: var(--page-header-font-text-transform);
   background-color: var(--page-header-background-color);
   color: var(--page-header-foreground-color);
-  flex-direction: column;
+  flex-direction: row;
   flex: 1;
   display: flex;
   position: relative;
@@ -134894,7 +134923,9 @@ function DZ() {
 }
 
 :host [part="root"] [part="prefix"] {
+  gap: var(--page-header-prefix-gap);
   flex-shrink: 1;
+  align-self: flex-start;
   align-items: center;
   display: flex;
 }
@@ -134913,7 +134944,17 @@ function DZ() {
   display: none;
 }
 
+:host [part="root"] [part="heading"] [part="content"] {
+  flex-direction: column;
+  display: flex;
+}
+
+:host [part="root"] [part="heading"] [part="content"][hidden] {
+  display: none;
+}
+
 :host [part="root"] [part="suffix"] {
+  gap: var(--page-header-suffix-gap);
   flex-shrink: 1;
   align-items: center;
   display: flex;
@@ -134993,6 +135034,10 @@ function DZ() {
   padding: 0;
 }
 
+:host slot[name="additionalHeader"], :host slot[name="additionalHeader"] mosaik-text {
+  color: var(--joy-scheme-middlelight);
+}
+
     `;
 }
 //#endregion
@@ -135029,6 +135074,7 @@ function OZ() {
   --page-header-padding-left: unset;
   --page-header-padding-right: unset;
   --page-header-padding-top: unset;
+  --page-header-prefix-gap: unset;
   --page-header-shadow: unset unset unset unset unset;
   --page-header-shadow-blur: unset;
   --page-header-shadow-color: unset;
@@ -135042,6 +135088,7 @@ function OZ() {
   --page-header-sub-header-font-text-decoration: var(--memphis-typography-subtitle1-text-decoration);
   --page-header-sub-header-font-text-transform: var(--memphis-typography-subtitle1-text-transform);
   --page-header-sub-header-font-weight: var(--memphis-typography-subtitle1-font-weight);
+  --page-header-suffix-gap: unset;
   --page-header-transition-duration: unset;
   --page-header-transition-mode: unset;
   --page-header-transition-property: unset;
@@ -135085,7 +135132,7 @@ function OZ() {
   text-transform: var(--page-header-font-text-transform);
   background-color: var(--page-header-background-color);
   color: var(--page-header-foreground-color);
-  flex-direction: column;
+  flex-direction: row;
   flex: 1;
   display: flex;
   position: relative;
@@ -135103,7 +135150,9 @@ function OZ() {
 }
 
 :host [part="root"] [part="prefix"] {
+  gap: var(--page-header-prefix-gap);
   flex-shrink: 1;
+  align-self: flex-start;
   align-items: center;
   display: flex;
 }
@@ -135122,7 +135171,17 @@ function OZ() {
   display: none;
 }
 
+:host [part="root"] [part="heading"] [part="content"] {
+  flex-direction: column;
+  display: flex;
+}
+
+:host [part="root"] [part="heading"] [part="content"][hidden] {
+  display: none;
+}
+
 :host [part="root"] [part="suffix"] {
+  gap: var(--page-header-suffix-gap);
   flex-shrink: 1;
   align-items: center;
   display: flex;
@@ -190575,6 +190634,7 @@ function Kbe() {
 :host {
   pointer-events: none;
   z-index: var(--portal-z-index, 100);
+  position: fixed;
   inset: 0;
 }
 
@@ -190642,6 +190702,7 @@ function qbe() {
 :host {
   pointer-events: none;
   z-index: var(--portal-z-index, 100);
+  position: fixed;
   inset: 0;
 }
 
@@ -190709,6 +190770,7 @@ function Jbe() {
 :host {
   pointer-events: none;
   z-index: var(--portal-z-index, 100);
+  position: fixed;
   inset: 0;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@breadstone/mosaik-elements-svelte",
-    "version": "0.0.245",
+    "version": "0.0.247",
     "description": "Mosaik elements for Svelte.",
     "license": "MIT",
     "author": "andre.wehlert <awehlert@breadstone.de> (https://www.breadstone.de)",
@@ -15,8 +15,8 @@
         "vite": "*"
     },
     "dependencies": {
-        "@breadstone/mosaik-elements": "^0.0.245",
-        "@breadstone/mosaik-elements-foundation": "^0.0.245"
+        "@breadstone/mosaik-elements": "^0.0.247",
+        "@breadstone/mosaik-elements-foundation": "^0.0.247"
     },
     "exports": {
         ".": {