@synergy-design-system/components 3.15.5 → 3.15.6

package/dist/chunks/{chunk.HEVQE7BN.js → chunk.EFGAZQFG.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.CHFWLQN5.js";
 import {
   enableDefaultSettings
-} from "./chunk.4MG3QDNW.js";
+} from "./chunk.4I2RJVH5.js";
 import {
   watch
 } from "./chunk.SMIMHADA.js";
@@ -15,7 +15,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -138,4 +138,4 @@ SynRadioButton = __decorateClass([
 export {
   SynRadioButton
 };
-//# sourceMappingURL=chunk.HEVQE7BN.js.map
+//# sourceMappingURL=chunk.EFGAZQFG.js.map

package/dist/chunks/{chunk.4IZMTEOR.js → chunk.EGTAKQAU.js}

@@ -1,9 +1,9 @@
 import {
   SynAlert
-} from "./chunk.75ULNINA.js";
+} from "./chunk.NL2IOCPJ.js";
 import {
   enableDefaultSettings
-} from "./chunk.4MG3QDNW.js";
+} from "./chunk.4I2RJVH5.js";
 import {
   alertSizeForInput,
   getActualInputElement,
@@ -12,13 +12,13 @@ import {
   isInvalidEvent,
   isSynergyElement,
   normalizeEventAttribute
-} from "./chunk.VZLSMLAF.js";
+} from "./chunk.2QN5VSUR.js";
 import {
   validate_styles_default
 } from "./chunk.MVM3NN6Y.js";
 import {
   SynTooltip
-} from "./chunk.BAFEN62W.js";
+} from "./chunk.45YNTYOZ.js";
 import {
   watch
 } from "./chunk.SMIMHADA.js";
@@ -27,7 +27,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -439,4 +439,4 @@ SynValidate = __decorateClass([
 export {
   SynValidate
 };
-//# sourceMappingURL=chunk.4IZMTEOR.js.map
+//# sourceMappingURL=chunk.EGTAKQAU.js.map

package/dist/chunks/{chunk.W24MH7WH.js → chunk.EKFYOO45.js}

@@ -1,6 +1,6 @@
 import {
   SynButton
-} from "./chunk.PDM47D3E.js";
+} from "./chunk.5RQIZU45.js";
 import {
   file_styles_default
 } from "./chunk.2ECWEEUO.js";
@@ -18,10 +18,10 @@ import {
 } from "./chunk.CHFWLQN5.js";
 import {
   SynIcon
-} from "./chunk.OPNOT3FJ.js";
+} from "./chunk.SFBN63ZC.js";
 import {
   enableDefaultSettings
-} from "./chunk.4MG3QDNW.js";
+} from "./chunk.4I2RJVH5.js";
 import {
   animateTo
 } from "./chunk.Q6HZ4JXR.js";
@@ -40,7 +40,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -544,4 +544,4 @@ setDefaultAnimation("file.text.appear", {
 export {
   SynFile
 };
-//# sourceMappingURL=chunk.W24MH7WH.js.map
+//# sourceMappingURL=chunk.EKFYOO45.js.map

package/dist/chunks/{chunk.33P4HCJ6.js → chunk.FAK2KFOB.js}

@@ -1,9 +1,9 @@
 import {
   SynDropdown
-} from "./chunk.63QRQEXP.js";
+} from "./chunk.KVYYFM4V.js";
 import {
   SynMenu
-} from "./chunk.S5ORKZMN.js";
+} from "./chunk.USRVA3FU.js";
 import {
   prio_nav_styles_default
 } from "./chunk.74N5WLM5.js";
@@ -15,10 +15,10 @@ import {
 } from "./chunk.OJ3N7TWP.js";
 import {
   SynNavItem
-} from "./chunk.5L3ERJZQ.js";
+} from "./chunk.VBPZVGXH.js";
 import {
   SynIcon
-} from "./chunk.OPNOT3FJ.js";
+} from "./chunk.SFBN63ZC.js";
 import {
   LocalizeController
 } from "./chunk.VCRQ2GII.js";
@@ -27,7 +27,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -209,4 +209,4 @@ __decorateClass([
 export {
   SynPrioNav
 };
-//# sourceMappingURL=chunk.33P4HCJ6.js.map
+//# sourceMappingURL=chunk.FAK2KFOB.js.map

package/dist/chunks/{chunk.2DQY5FDS.js → chunk.FMRXZ25K.js}

@@ -1,6 +1,6 @@
 import {
   SynRadio
-} from "./chunk.M6IU3AX7.js";
+} from "./chunk.O5HRNZ2W.js";
 
 // src/components/radio/radio.ts
 var radio_default = SynRadio;
@@ -9,4 +9,4 @@ SynRadio.define("syn-radio");
 export {
   radio_default
 };
-//# sourceMappingURL=chunk.2DQY5FDS.js.map
+//# sourceMappingURL=chunk.FMRXZ25K.js.map

package/dist/chunks/{chunk.SVOFHKDN.js → chunk.GFYYLBC7.js}

@@ -1,6 +1,6 @@
 import {
   SynSwitch
-} from "./chunk.JBNLMSEF.js";
+} from "./chunk.RMW7EMAA.js";
 
 // src/components/switch/switch.ts
 var switch_default = SynSwitch;
@@ -9,4 +9,4 @@ SynSwitch.define("syn-switch");
 export {
   switch_default
 };
-//# sourceMappingURL=chunk.SVOFHKDN.js.map
+//# sourceMappingURL=chunk.GFYYLBC7.js.map

package/dist/chunks/{chunk.QQDQSNP2.js → chunk.GUW23JPZ.js}

@@ -6,10 +6,10 @@ import {
 } from "./chunk.X5NFOV5A.js";
 import {
   SynIconButton
-} from "./chunk.UHKHACWY.js";
+} from "./chunk.OBX7SKFS.js";
 import {
   enableDefaultSettings
-} from "./chunk.4MG3QDNW.js";
+} from "./chunk.4I2RJVH5.js";
 import {
   LocalizeController
 } from "./chunk.VCRQ2GII.js";
@@ -18,7 +18,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -84,4 +84,4 @@ SynTag = __decorateClass([
 export {
   SynTag
 };
-//# sourceMappingURL=chunk.QQDQSNP2.js.map
+//# sourceMappingURL=chunk.GUW23JPZ.js.map

package/dist/chunks/{chunk.HYZOLI5D.js → chunk.GYOIJQKN.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.CMOZ4SCN.js";
 import {
   enableDefaultSettings
-} from "./chunk.4MG3QDNW.js";
+} from "./chunk.4I2RJVH5.js";
 import {
   LocalizeController
 } from "./chunk.VCRQ2GII.js";
@@ -15,7 +15,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -66,4 +66,4 @@ SynBadge = __decorateClass([
 export {
   SynBadge
 };
-//# sourceMappingURL=chunk.HYZOLI5D.js.map
+//# sourceMappingURL=chunk.GYOIJQKN.js.map

package/dist/chunks/{chunk.AL3VTX67.js → chunk.H6Y2KI6V.js}

@@ -1,9 +1,6 @@
-import {
-  card_custom_styles_default
-} from "./chunk.O655X4YP.js";
 import {
   card_styles_default
-} from "./chunk.R3SMKUIL.js";
+} from "./chunk.QCHIEOZ2.js";
 import {
   HasSlotController
 } from "./chunk.CHFWLQN5.js";
@@ -12,15 +9,17 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
 
 // src/components/card/card.component.ts
+import {
+  html
+} from "lit";
 import { classMap } from "lit/directives/class-map.js";
 import { property } from "lit/decorators.js";
-import { html } from "lit";
 var SynCard = class extends SynergyElement {
   constructor() {
     super(...arguments);
@@ -34,11 +33,11 @@ var SynCard = class extends SynergyElement {
         part="base"
         class=${classMap({
       card: true,
-      "card--shadow": this.shadow,
-      "card--sharp": this.sharp,
       "card--has-footer": this.hasSlotController.test("footer"),
+      "card--has-header": this.hasSlotController.test("header"),
       "card--has-image": this.hasSlotController.test("image"),
-      "card--has-header": this.hasSlotController.test("header")
+      "card--shadow": this.shadow,
+      "card--sharp": this.sharp
     })}
       >
         <slot name="image" part="image" class="card__image"></slot>
@@ -49,15 +48,15 @@ var SynCard = class extends SynergyElement {
     `;
   }
 };
-SynCard.styles = [component_styles_default, card_styles_default, card_custom_styles_default];
+SynCard.styles = [component_styles_default, card_styles_default];
 __decorateClass([
-  property({ type: Boolean, reflect: true })
+  property({ reflect: true, type: Boolean })
 ], SynCard.prototype, "shadow", 2);
 __decorateClass([
-  property({ type: Boolean, reflect: true })
+  property({ reflect: true, type: Boolean })
 ], SynCard.prototype, "sharp", 2);
 
 export {
   SynCard
 };
-//# sourceMappingURL=chunk.AL3VTX67.js.map
+//# sourceMappingURL=chunk.H6Y2KI6V.js.map

package/dist/chunks/chunk.H6Y2KI6V.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/card/card.component.ts"],
+  "sourcesContent": ["import {\n  type CSSResultGroup,\n  html,\n} from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { property } from 'lit/decorators.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './card.styles.js';\n\n/**\n * @summary Cards can be used to group related subjects in a container.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-card--docs\n * @status stable\n * @since 1.25.0\n *\n * @slot - The card's main content.\n * @slot header - An optional header for the card.\n * @slot footer - An optional footer for the card.\n * @slot image - An optional image to render at the start of the card.\n *\n * @csspart base - The component's base wrapper.\n * @csspart image - The container that wraps the card's image.\n * @csspart header - The container that wraps the card's header.\n * @csspart body - The container that wraps the card's main content.\n * @csspart footer - The container that wraps the card's footer.\n *\n * @cssproperty --border-color - The card's border color, including borders that occur inside the card.\n * @cssproperty --border-radius - The border radius for the card's edges.\n * @cssproperty --border-width - The width of the card's borders.\n * @cssproperty --padding - The padding to use for the card's sections.\n */\nexport default class SynCard extends SynergyElement {\n  static styles: CSSResultGroup = [componentStyles, styles];\n\n  private readonly hasSlotController = new HasSlotController(this, 'footer', 'header', 'image');\n\n  /** Draws the card with a shadow. Can be used when the card has to stand out visually, for example in dashboards. */\n  @property({ reflect: true, type: Boolean }) shadow = false;\n\n  /** Draws the card with sharp edges. Can be used e.g. when nesting multiple syn-cards to create hierarchy. */\n  @property({ reflect: true, type: Boolean }) sharp = false;\n\n  render() {\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          card: true,\n          'card--has-footer': this.hasSlotController.test('footer'),\n          'card--has-header': this.hasSlotController.test('header'),\n          'card--has-image': this.hasSlotController.test('image'),\n          'card--shadow': this.shadow,\n          'card--sharp': this.sharp,\n        })}\n      >\n        <slot name=\"image\" part=\"image\" class=\"card__image\"></slot>\n        <slot name=\"header\" part=\"header\" class=\"card__header\"></slot>\n        <slot part=\"body\" class=\"card__body\"></slot>\n        <slot name=\"footer\" part=\"footer\" class=\"card__footer\"></slot>\n      </div>\n    `;\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA,EAEE;AAAA,OACK;AACP,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AA4BzB,IAAqB,UAArB,cAAqC,eAAe;AAAA,EAApD;AAAA;AAGE,SAAiB,oBAAoB,IAAI,kBAAkB,MAAM,UAAU,UAAU,OAAO;AAGhD,kBAAS;AAGT,iBAAQ;AAAA;AAAA,EAEpD,SAAS;AACP,WAAO;AAAA;AAAA;AAAA,gBAGK,SAAS;AAAA,MACf,MAAM;AAAA,MACN,oBAAoB,KAAK,kBAAkB,KAAK,QAAQ;AAAA,MACxD,oBAAoB,KAAK,kBAAkB,KAAK,QAAQ;AAAA,MACxD,mBAAmB,KAAK,kBAAkB,KAAK,OAAO;AAAA,MACtD,gBAAgB,KAAK;AAAA,MACrB,eAAe,KAAK;AAAA,IACtB,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQR;AACF;AA/BqB,QACZ,SAAyB,CAAC,0BAAiB,mBAAM;AAKZ;AAAA,EAA3C,SAAS,EAAE,SAAS,MAAM,MAAM,QAAQ,CAAC;AAAA,GANvB,QAMyB;AAGA;AAAA,EAA3C,SAAS,EAAE,SAAS,MAAM,MAAM,QAAQ,CAAC;AAAA,GATvB,QASyB;",
+  "names": []
+}

package/dist/chunks/{chunk.WUQ5X3LN.js → chunk.HOKJ5BFL.js}

@@ -1,6 +1,6 @@
 import {
   SynPrioNav
-} from "./chunk.33P4HCJ6.js";
+} from "./chunk.FAK2KFOB.js";
 
 // src/components/prio-nav/prio-nav.ts
 var prio_nav_default = SynPrioNav;
@@ -9,4 +9,4 @@ SynPrioNav.define("syn-prio-nav");
 export {
   prio_nav_default
 };
-//# sourceMappingURL=chunk.WUQ5X3LN.js.map
+//# sourceMappingURL=chunk.HOKJ5BFL.js.map

package/dist/chunks/{chunk.S34SJRAJ.js → chunk.HQQIVH2S.js}

@@ -1,6 +1,6 @@
 import {
   SynPagination
-} from "./chunk.GQFIUMR6.js";
+} from "./chunk.ZT5YMF6W.js";
 
 // src/components/pagination/pagination.ts
 var pagination_default = SynPagination;
@@ -9,4 +9,4 @@ SynPagination.define("syn-pagination");
 export {
   pagination_default
 };
-//# sourceMappingURL=chunk.S34SJRAJ.js.map
+//# sourceMappingURL=chunk.HQQIVH2S.js.map

package/dist/chunks/{chunk.CAAWLFOI.js → chunk.HRXQKMTA.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.WRPQ3635.js";
 import {
   SynIcon
-} from "./chunk.OPNOT3FJ.js";
+} from "./chunk.SFBN63ZC.js";
 import {
   LocalizeController
 } from "./chunk.VCRQ2GII.js";
@@ -15,7 +15,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -91,4 +91,4 @@ __decorateClass([
 export {
   SynBreadcrumb
 };
-//# sourceMappingURL=chunk.CAAWLFOI.js.map
+//# sourceMappingURL=chunk.HRXQKMTA.js.map

package/dist/chunks/{chunk.MPJ2QALZ.js → chunk.HUJAKIZN.js}

@@ -65,7 +65,7 @@ var header_styles_default = css`
    */
   .header__label {
     color: var(--syn-typography-color-text);
-    font: var(--syn-body-large-bold);
+    font: var(--syn-heading-large);
     padding: 0 var(--syn-spacing-2x-large);
     white-space: nowrap;
   }
@@ -145,4 +145,4 @@ var header_styles_default = css`
 export {
   header_styles_default
 };
-//# sourceMappingURL=chunk.MPJ2QALZ.js.map
+//# sourceMappingURL=chunk.HUJAKIZN.js.map

package/dist/chunks/{chunk.MPJ2QALZ.js.map → chunk.HUJAKIZN.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/header/header.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host {\n    --sticky-position: 0;\n    --metanavigation-item-size: var(--syn-font-size-x-large);\n\n    display: block;\n  }\n\n  .header {\n    background: var(--syn-panel-background-color);\n    box-shadow: inset 0 -1px 0 0 var(--syn-header-border-color);\n  }\n\n  /**\n   * The primary content area displays one to many slotted items\n   * and contains the following items:\n   * - side nav state icon (OPTIONAL)\n   * - company or application logo\n   * - application name\n   * - meta-navigation\n   */\n  .header__content {\n    align-items: center;\n    box-sizing: content-box;\n    display: flex;\n    min-height: 40px;\n    padding: var(--syn-spacing-small) var(--syn-spacing-large);\n  }\n\n  /**\n   * The logo slot includes the application or company logo\n   */\n  .header__logo ::slotted(*),\n  .header__logo syn-icon {\n    display: block;\n  }\n\n  /**\n   * Make sure to use the correct color and outline for links\n   */\n  .header__logo ::slotted(a),\n  .header__logo ::slotted(a:hover) {\n    color: var(--syn-logo-color);\n  }\n\n  .header__logo ::slotted(a:is(:focus-visible)) {\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  /**\n   * Styles for the default logo. This makes sure the default SICK logo has the correct size and color\n   */\n  .header__logo syn-icon,\n  .header__logo syn-icon::part(svg) {\n    color: var(--syn-logo-color);\n    height: 32px;\n    width: auto;\n  }\n\n  /**\n   * The label section hosts the application name\n   */\n  .header__label {\n    color: var(--syn-typography-color-text);\n    font: var(--syn-body-large-bold);\n    padding: 0 var(--syn-spacing-2x-large);\n    white-space: nowrap;\n  }\n\n  /**\n   * The options menu holds an arbitrary list of <syn-icon-button />\n   */\n  .header__meta-navigation {\n    display: flex;\n    flex: 1;\n    gap: var(--syn-spacing-x-small);\n    justify-content: end;\n  }\n\n  .header__meta-navigation ::slotted(*) {\n    color: var(--syn-interactive-quiet-color);\n    display: contents;\n    font-size: var(--metanavigation-item-size);\n  }\n\n  /**\n   * The horizontal top navigation section\n   */\n  .header__navigation {\n    padding: 0 var(--syn-spacing-large);\n  }\n\n  /**\n   * The burger menu icon styles\n   */\n  .header__burger-menu-toggle {\n    align-items: center;\n    background: none;\n    border: none;\n    color: var(--syn-interactive-quiet-color);\n    cursor: pointer;\n    display: flex;\n    font-size: var(--syn-font-size-x-large);\n    margin-right: calc(var(--syn-spacing-medium) + var(--syn-spacing-2x-small));\n    padding: var(--syn-spacing-x-small);\n    transition: var(--syn-transition-x-fast) color;\n  }\n\n  .header__burger-menu-toggle:hover {\n    color: var(--syn-interactive-quiet-color-hover);\n  }\n\n  .header__burger-menu-toggle:active {\n    color: var(--syn-interactive-quiet-color-active);\n  }\n\n  .header__burger-menu-toggle:focus-visible {\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  /**\n   * If the burger menu is provided, use a smaller spacing on the left side\n   */\n  .header--has-burger-menu .header__content {\n    padding-left: var(--syn-spacing-medium);\n  }\n\n  /**\n   * #529: Sticky header styles\n   */\n  :host([sticky]) {\n    box-shadow: var(--syn-shadow-sticky-down);\n    position: sticky;\n    top: var(--sticky-position);\n\n    /* Make sure the header is above all other content, but below any potential modals or overlays */\n    z-index: calc(infinity - 1);\n  }\n`;\n"],
+  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host {\n    --sticky-position: 0;\n    --metanavigation-item-size: var(--syn-font-size-x-large);\n\n    display: block;\n  }\n\n  .header {\n    background: var(--syn-panel-background-color);\n    box-shadow: inset 0 -1px 0 0 var(--syn-header-border-color);\n  }\n\n  /**\n   * The primary content area displays one to many slotted items\n   * and contains the following items:\n   * - side nav state icon (OPTIONAL)\n   * - company or application logo\n   * - application name\n   * - meta-navigation\n   */\n  .header__content {\n    align-items: center;\n    box-sizing: content-box;\n    display: flex;\n    min-height: 40px;\n    padding: var(--syn-spacing-small) var(--syn-spacing-large);\n  }\n\n  /**\n   * The logo slot includes the application or company logo\n   */\n  .header__logo ::slotted(*),\n  .header__logo syn-icon {\n    display: block;\n  }\n\n  /**\n   * Make sure to use the correct color and outline for links\n   */\n  .header__logo ::slotted(a),\n  .header__logo ::slotted(a:hover) {\n    color: var(--syn-logo-color);\n  }\n\n  .header__logo ::slotted(a:is(:focus-visible)) {\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  /**\n   * Styles for the default logo. This makes sure the default SICK logo has the correct size and color\n   */\n  .header__logo syn-icon,\n  .header__logo syn-icon::part(svg) {\n    color: var(--syn-logo-color);\n    height: 32px;\n    width: auto;\n  }\n\n  /**\n   * The label section hosts the application name\n   */\n  .header__label {\n    color: var(--syn-typography-color-text);\n    font: var(--syn-heading-large);\n    padding: 0 var(--syn-spacing-2x-large);\n    white-space: nowrap;\n  }\n\n  /**\n   * The options menu holds an arbitrary list of <syn-icon-button />\n   */\n  .header__meta-navigation {\n    display: flex;\n    flex: 1;\n    gap: var(--syn-spacing-x-small);\n    justify-content: end;\n  }\n\n  .header__meta-navigation ::slotted(*) {\n    color: var(--syn-interactive-quiet-color);\n    display: contents;\n    font-size: var(--metanavigation-item-size);\n  }\n\n  /**\n   * The horizontal top navigation section\n   */\n  .header__navigation {\n    padding: 0 var(--syn-spacing-large);\n  }\n\n  /**\n   * The burger menu icon styles\n   */\n  .header__burger-menu-toggle {\n    align-items: center;\n    background: none;\n    border: none;\n    color: var(--syn-interactive-quiet-color);\n    cursor: pointer;\n    display: flex;\n    font-size: var(--syn-font-size-x-large);\n    margin-right: calc(var(--syn-spacing-medium) + var(--syn-spacing-2x-small));\n    padding: var(--syn-spacing-x-small);\n    transition: var(--syn-transition-x-fast) color;\n  }\n\n  .header__burger-menu-toggle:hover {\n    color: var(--syn-interactive-quiet-color-hover);\n  }\n\n  .header__burger-menu-toggle:active {\n    color: var(--syn-interactive-quiet-color-active);\n  }\n\n  .header__burger-menu-toggle:focus-visible {\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  /**\n   * If the burger menu is provided, use a smaller spacing on the left side\n   */\n  .header--has-burger-menu .header__content {\n    padding-left: var(--syn-spacing-medium);\n  }\n\n  /**\n   * #529: Sticky header styles\n   */\n  :host([sticky]) {\n    box-shadow: var(--syn-shadow-sticky-down);\n    position: sticky;\n    top: var(--sticky-position);\n\n    /* Make sure the header is above all other content, but below any potential modals or overlays */\n    z-index: calc(infinity - 1);\n  }\n`;\n"],
   "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,wBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
   "names": []
 }

package/dist/chunks/{chunk.BZEPYV6W.js → chunk.I6PP4QSQ.js}

@@ -1,6 +1,6 @@
 import {
   SynProgressRing
-} from "./chunk.6K23LZG3.js";
+} from "./chunk.TMXDTUP5.js";
 
 // src/components/progress-ring/progress-ring.ts
 var progress_ring_default = SynProgressRing;
@@ -9,4 +9,4 @@ SynProgressRing.define("syn-progress-ring");
 export {
   progress_ring_default
 };
-//# sourceMappingURL=chunk.BZEPYV6W.js.map
+//# sourceMappingURL=chunk.I6PP4QSQ.js.map

package/dist/chunks/{chunk.VXO4ZKJU.js → chunk.IHAFPHVS.js}

@@ -1,6 +1,6 @@
 import {
   SynRadioGroup
-} from "./chunk.P3U4Z2CB.js";
+} from "./chunk.6HU2H2VB.js";
 
 // src/components/radio-group/radio-group.ts
 var radio_group_default = SynRadioGroup;
@@ -9,4 +9,4 @@ SynRadioGroup.define("syn-radio-group");
 export {
   radio_group_default
 };
-//# sourceMappingURL=chunk.VXO4ZKJU.js.map
+//# sourceMappingURL=chunk.IHAFPHVS.js.map

package/dist/chunks/{chunk.3HVRPXZW.js → chunk.IIRPZ642.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk.KVS7GBFQ.js";
 import {
   SynDivider
-} from "./chunk.2MBHEIB7.js";
+} from "./chunk.QYOAPG3L.js";
 import {
   defaultValue
 } from "./chunk.3JDUKQRN.js";
@@ -24,10 +24,10 @@ import {
 } from "./chunk.CHFWLQN5.js";
 import {
   SynIcon
-} from "./chunk.OPNOT3FJ.js";
+} from "./chunk.SFBN63ZC.js";
 import {
   enableDefaultSettings
-} from "./chunk.4MG3QDNW.js";
+} from "./chunk.4I2RJVH5.js";
 import {
   createNumericStrategy,
   modernNumericStrategy,
@@ -44,7 +44,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass,
   __privateAdd,
@@ -865,4 +865,4 @@ SynInput = __decorateClass([
 export {
   SynInput
 };
-//# sourceMappingURL=chunk.3HVRPXZW.js.map
+//# sourceMappingURL=chunk.IIRPZ642.js.map

package/dist/chunks/{chunk.A4LA76RD.js → chunk.IRQYNSLA.js}

@@ -1,6 +1,6 @@
 import {
   SynTagGroup
-} from "./chunk.EYNAVYVE.js";
+} from "./chunk.37IHP7BG.js";
 
 // src/components/tag-group/tag-group.ts
 var tag_group_default = SynTagGroup;
@@ -9,4 +9,4 @@ SynTagGroup.define("syn-tag-group");
 export {
   tag_group_default
 };
-//# sourceMappingURL=chunk.A4LA76RD.js.map
+//# sourceMappingURL=chunk.IRQYNSLA.js.map

package/dist/chunks/{chunk.NRBGQ64L.js → chunk.IWWZ7NR4.js}

@@ -1,6 +1,6 @@
 import {
   SynSelect
-} from "./chunk.RODPN45B.js";
+} from "./chunk.WVGOSRRS.js";
 
 // src/components/select/select.ts
 var select_default = SynSelect;
@@ -9,4 +9,4 @@ SynSelect.define("syn-select");
 export {
   select_default
 };
-//# sourceMappingURL=chunk.NRBGQ64L.js.map
+//# sourceMappingURL=chunk.IWWZ7NR4.js.map

package/dist/chunks/{chunk.PHWZAU3F.js → chunk.JDCUCXJ5.js}

@@ -1,6 +1,6 @@
 import {
   SynBreadcrumb
-} from "./chunk.CAAWLFOI.js";
+} from "./chunk.HRXQKMTA.js";
 
 // src/components/breadcrumb/breadcrumb.ts
 var breadcrumb_default = SynBreadcrumb;
@@ -9,4 +9,4 @@ SynBreadcrumb.define("syn-breadcrumb");
 export {
   breadcrumb_default
 };
-//# sourceMappingURL=chunk.PHWZAU3F.js.map
+//# sourceMappingURL=chunk.JDCUCXJ5.js.map

package/dist/chunks/{chunk.GT2QBDJH.js → chunk.JIKFLM23.js}

@@ -1,6 +1,6 @@
 import {
   SynCombobox
-} from "./chunk.BCUI54KW.js";
+} from "./chunk.WYNCUNIG.js";
 
 // src/components/combobox/combobox.ts
 var combobox_default = SynCombobox;
@@ -9,4 +9,4 @@ SynCombobox.define("syn-combobox");
 export {
   combobox_default
 };
-//# sourceMappingURL=chunk.GT2QBDJH.js.map
+//# sourceMappingURL=chunk.JIKFLM23.js.map

package/dist/chunks/{chunk.RPE74IPI.js → chunk.JNI24XE2.js}

@@ -1,6 +1,6 @@
 import {
   SynCheckbox
-} from "./chunk.NGKOOT4J.js";
+} from "./chunk.QEY3KSN5.js";
 
 // src/components/checkbox/checkbox.ts
 var checkbox_default = SynCheckbox;
@@ -9,4 +9,4 @@ SynCheckbox.define("syn-checkbox");
 export {
   checkbox_default
 };
-//# sourceMappingURL=chunk.RPE74IPI.js.map
+//# sourceMappingURL=chunk.JNI24XE2.js.map

package/dist/chunks/{chunk.AQGZYNRW.js → chunk.JVCAQIXF.js}

@@ -1,6 +1,6 @@
 import {
   SynIconButton
-} from "./chunk.UHKHACWY.js";
+} from "./chunk.OBX7SKFS.js";
 
 // src/components/icon-button/icon-button.ts
 var icon_button_default = SynIconButton;
@@ -9,4 +9,4 @@ SynIconButton.define("syn-icon-button");
 export {
   icon_button_default
 };
-//# sourceMappingURL=chunk.AQGZYNRW.js.map
+//# sourceMappingURL=chunk.JVCAQIXF.js.map

package/dist/chunks/{chunk.63QRQEXP.js → chunk.KVYYFM4V.js}

@@ -7,7 +7,7 @@ import {
 } from "./chunk.XRSLCQH3.js";
 import {
   SynPopup
-} from "./chunk.6UTZ5TWH.js";
+} from "./chunk.MWEJ7CGR.js";
 import {
   waitForEvent
 } from "./chunk.LQDIH4Z5.js";
@@ -30,7 +30,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -382,4 +382,4 @@ setDefaultAnimation("dropdown.hide", {
 export {
   SynDropdown
 };
-//# sourceMappingURL=chunk.63QRQEXP.js.map
+//# sourceMappingURL=chunk.KVYYFM4V.js.map

package/dist/chunks/{chunk.X6TZ7RBB.js → chunk.L7EEUWC6.js}

@@ -6,10 +6,10 @@ import {
 } from "./chunk.ARR23WUY.js";
 import {
   SynIcon
-} from "./chunk.OPNOT3FJ.js";
+} from "./chunk.SFBN63ZC.js";
 import {
   enableDefaultSettings
-} from "./chunk.4MG3QDNW.js";
+} from "./chunk.4I2RJVH5.js";
 import {
   LocalizeController
 } from "./chunk.VCRQ2GII.js";
@@ -21,7 +21,7 @@ import {
 } from "./chunk.2NT3B5WJ.js";
 import {
   SynergyElement
-} from "./chunk.QLMD2SFN.js";
+} from "./chunk.7YCUXELV.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -189,4 +189,4 @@ SynOption = __decorateClass([
 export {
   SynOption
 };
-//# sourceMappingURL=chunk.X6TZ7RBB.js.map
+//# sourceMappingURL=chunk.L7EEUWC6.js.map

package/dist/chunks/{chunk.VDBD6G4Q.js → chunk.MQFQLLZE.js}

@@ -54,12 +54,10 @@ var dialog_styles_default = css`
   }
 
   .dialog__title {
+    align-items: center;
+    display: flex;
     flex: 1 1 auto;
-    font: inherit;
-    font-family: var(--syn-font-sans);
-    font-size: var(--syn-font-size-x-large);
-    font-weight: var(--syn-font-weight-bold);
-    line-height: var(--syn-line-height-normal);
+    font: var(--syn-heading-x-large);
     margin: 0;
     padding: var(--header-spacing);
   }
@@ -74,15 +72,6 @@ var dialog_styles_default = css`
     padding: var(--syn-spacing-large) var(--syn-spacing-small) var(--syn-spacing-large) 0;
   }
 
-  /**
-   * We need this to make sure we are big enough as defined in the layout
-   * When omitting this statement, we will get rounding problems via line-height
-   */
-  .dialog__title,
-  .dialog__header-actions {
-    min-height: 88px;
-  }
-
   .dialog__header-actions syn-icon-button,
   .dialog__header-actions ::slotted(syn-icon-button) {
     align-items: center;
@@ -132,4 +121,4 @@ var dialog_styles_default = css`
 export {
   dialog_styles_default
 };
-//# sourceMappingURL=chunk.VDBD6G4Q.js.map
+//# sourceMappingURL=chunk.MQFQLLZE.js.map