@synergy-design-system/components 2.77.1 → 3.1.0

package/dist/chunks/{chunk.2ZMXABWX.js → chunk.SA423NRC.js}

@@ -13,28 +13,28 @@ var badge_custom_styles_default = css`
 
   /* Variant modifiers */
   .badge--primary {
-    background-color: var(--syn-badge-informative-color-background, var(--syn-color-primary-600));
-    color: var(--syn-badge-informative-color-text, var(--syn-typography-color-text-inverted));
+    background-color: var(--syn-badge-informative-color-background);
+    color: var(--syn-badge-informative-color-text);
   }
 
   .badge--success {
-    background-color: var(--syn-badge-success-color-background, var(--syn-color-success-500));
-    color: var(--syn-badge-success-color-text, var(--syn-typography-color-text));
+    background-color: var(--syn-badge-success-color-background);
+    color: var(--syn-badge-success-color-text);
   }
 
   .badge--neutral {
-    background-color: var(--syn-badge-neutral-color-background, var(--syn-color-neutral-800));
-    color: var(--syn-badge-neutral-color-text, var(--syn-typography-color-text-inverted));
+    background-color: var(--syn-badge-neutral-color-background);
+    color: var(--syn-badge-neutral-color-text);
   }
 
   .badge--warning {
-    background-color: var(--syn-badge-warning-color-background, var(--syn-color-warning-400));
-    color: var(--syn-badge-warning-color-text, var(--syn-typography-color-text));
+    background-color: var(--syn-badge-warning-color-background);
+    color: var(--syn-badge-warning-color-text);
   }
 
   .badge--danger {
-    background-color: var(--syn-badge-error-color-background, var(--syn-color-error-600));
-    color: var(--syn-badge-error-color-text, var(--syn-typography-color-text-inverted));
+    background-color: var(--syn-badge-error-color-background);
+    color: var(--syn-badge-error-color-text);
   }
 
   /**
@@ -64,4 +64,4 @@ var badge_custom_styles_default = css`
 export {
   badge_custom_styles_default
 };
-//# sourceMappingURL=chunk.2ZMXABWX.js.map
+//# sourceMappingURL=chunk.SA423NRC.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/badge/badge.custom.styles.ts"],
+  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  .badge {\n    border: none;\n    border-radius: var(--syn-border-radius-pill);\n    font: var(--syn-body-small-bold);\n    height: var(--syn-spacing-large);\n    line-height: var(--syn-spacing-large);\n    min-width: var(--syn-spacing-large);\n    padding: 0 var(--syn-spacing-x-small);\n  }\n\n  /* Variant modifiers */\n  .badge--primary {\n    background-color: var(--syn-badge-informative-color-background);\n    color: var(--syn-badge-informative-color-text);\n  }\n\n  .badge--success {\n    background-color: var(--syn-badge-success-color-background);\n    color: var(--syn-badge-success-color-text);\n  }\n\n  .badge--neutral {\n    background-color: var(--syn-badge-neutral-color-background);\n    color: var(--syn-badge-neutral-color-text);\n  }\n\n  .badge--warning {\n    background-color: var(--syn-badge-warning-color-background);\n    color: var(--syn-badge-warning-color-text);\n  }\n\n  .badge--danger {\n    background-color: var(--syn-badge-error-color-background);\n    color: var(--syn-badge-error-color-text);\n  }\n\n  /**\n   * Special treatment: If the badge is empty, show it as a dot only\n   */\n  :host(:empty) .badge {\n    height: var(--syn-spacing-x-small);\n    min-width: initial;\n    padding: 0;\n    width: var(--syn-spacing-x-small);\n  }\n\n  .visually-hidden {\n    border: 0;\n    /* stylelint-disable-next-line property-no-deprecated */\n    clip: rect(0, 0, 0, 0);\n    height: 1px;\n    margin: -1px;\n    overflow: hidden;\n    padding: 0;\n    position: absolute;\n    white-space: nowrap;\n    width: 1px;\n  }\n`;\n"],
+  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,8BAAQ;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.43XCD64Q.js → chunk.SIX2VPOZ.js}

@@ -1,6 +1,6 @@
 import {
   SynBreadcrumb
-} from "./chunk.34QTCBH5.js";
+} from "./chunk.I4TQPMB7.js";
 
 // src/components/breadcrumb/breadcrumb.ts
 var breadcrumb_default = SynBreadcrumb;
@@ -9,4 +9,4 @@ SynBreadcrumb.define("syn-breadcrumb");
 export {
   breadcrumb_default
 };
-//# sourceMappingURL=chunk.43XCD64Q.js.map
+//# sourceMappingURL=chunk.SIX2VPOZ.js.map

package/dist/chunks/{chunk.T7PPSROA.js → chunk.SLDFB2O3.js}

@@ -2,25 +2,25 @@
 import { css } from "lit";
 var switch_custom_styles_default = css`
   :host([size='small']) {
-   --height: var(--syn-switch-height-small, calc(var(--syn-toggle-size-medium) + 2px));
+   --height: var(--syn-switch-height-small);
    --thumb-size: var(--syn-toggle-size-small);
-   --width: var(--syn-switch-width-small, calc((var(--height) * 2) - 6px));
+   --width: var(--syn-switch-width-small);
 
     font-size: var(--syn-input-font-size-small);
   }
 
   :host([size='medium']) {
-    --height: var(--syn-switch-height-medium, calc(var(--syn-toggle-size-medium) + 4px));
+    --height: var(--syn-switch-height-medium);
     --thumb-size: var(--syn-toggle-size-medium);
-    --width: var(--syn-switch-width-medium, calc((var(--height) * 2) - 6px));
+    --width: var(--syn-switch-width-medium);
 
     font-size: var(--syn-input-font-size-medium);
   }
 
   :host([size='large']) {
-    --height: var(--syn-switch-height-large, calc(var(--syn-toggle-size-large) + 4px));
+    --height: var(--syn-switch-height-large);
     --thumb-size: var(--syn-toggle-size-large);
-    --width: var(--syn-switch-width-large, calc((var(--height) * 2) - 6px));
+    --width: var(--syn-switch-width-large);
 
     font-size: var(--syn-input-font-size-large);
   }
@@ -58,8 +58,8 @@ var switch_custom_styles_default = css`
 
   /* Checked */
   .switch--checked .switch__control {
-    background-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));
-    border-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));
+    background-color: var(--syn-interactive-emphasis-color);
+    border-color: var(--syn-interactive-emphasis-color);
   }
   
   /* Hover */
@@ -74,8 +74,8 @@ var switch_custom_styles_default = css`
 
   /* Checked + hover */
   .switch.switch--checked:not(.switch--disabled):hover .switch__control {
-    background-color: var(--syn-interactive-emphasis-color-hover, var(--syn-color-primary-900));
-    border-color: var(--syn-interactive-emphasis-color-hover, var(--syn-color-primary-900));
+    background-color: var(--syn-interactive-emphasis-color-hover);
+    border-color: var(--syn-interactive-emphasis-color-hover);
   }
 
   .switch.switch--checked:not(.switch--disabled):hover .switch__control:hover .switch__thumb {
@@ -114,8 +114,8 @@ var switch_custom_styles_default = css`
 
   /* Checked + focus */
   .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {
-    background-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));
-    border-color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-600));
+    background-color: var(--syn-interactive-emphasis-color);
+    border-color: var(--syn-interactive-emphasis-color);
     outline: var(--syn-focus-ring);
     outline-offset: var(--syn-focus-ring-offset);
   }
@@ -130,17 +130,17 @@ var switch_custom_styles_default = css`
   }
   
   :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control {
-    background-color: var(--syn-input-border-color-focus-error, var(--syn-color-error-700));
-    border-color: var(--syn-input-border-color-focus-error, var(--syn-color-error-700));
+    background-color: var(--syn-input-border-color-focus-error);
+    border-color: var(--syn-input-border-color-focus-error);
   }
 
   :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled):hover .switch__control {
-    background-color: var(--syn-input-border-color-hover, var(--syn-color-error-900));
-    border-color: var(--syn-input-border-color-hover, var(--syn-color-error-900));
+    background-color: var(--syn-input-border-color-hover);
+    border-color: var(--syn-input-border-color-hover);
   }
   `;
 
 export {
   switch_custom_styles_default
 };
-//# sourceMappingURL=chunk.T7PPSROA.js.map
+//# sourceMappingURL=chunk.SLDFB2O3.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/switch/switch.custom.styles.ts"],
+  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host([size='small']) {\n   --height: var(--syn-switch-height-small);\n   --thumb-size: var(--syn-toggle-size-small);\n   --width: var(--syn-switch-width-small);\n\n    font-size: var(--syn-input-font-size-small);\n  }\n\n  :host([size='medium']) {\n    --height: var(--syn-switch-height-medium);\n    --thumb-size: var(--syn-toggle-size-medium);\n    --width: var(--syn-switch-width-medium);\n\n    font-size: var(--syn-input-font-size-medium);\n  }\n\n  :host([size='large']) {\n    --height: var(--syn-switch-height-large);\n    --thumb-size: var(--syn-toggle-size-large);\n    --width: var(--syn-switch-width-large);\n\n    font-size: var(--syn-input-font-size-large);\n  }\n\n  /** #429: Use token for opacity */\n  .switch--disabled { \n    opacity: var(--syn-input-disabled-opacity);\n  }\n\n  .switch.switch--small {\n    padding: var(--syn-spacing-2x-small) 0;\n  }\n\n  .switch.switch--medium {\n    padding: var(--syn-spacing-2x-small) 0;\n  }\n\n  .switch.switch--large {\n    padding: var(--syn-spacing-3x-small) 0;\n  }\n\n  /* Hint: can be removed, if the padding stylings for sizes from above are removed */\n  .form-control--has-help-text .switch {\n    padding-bottom: 0;\n  }\n\n  .switch__control {\n    background-color: var(--syn-input-icon-icon-clearable-color);\n    border: solid var(--syn-border-width-medium) var(--syn-input-icon-icon-clearable-color);\n  }\n\n  .switch__control .switch__thumb {\n    border: none;\n  }\n\n  /* Checked */\n  .switch--checked .switch__control {\n    background-color: var(--syn-interactive-emphasis-color);\n    border-color: var(--syn-interactive-emphasis-color);\n  }\n  \n  /* Hover */\n  .switch:not(.switch--checked):not(.switch--disabled):hover .switch__control {\n    background-color: var(--syn-input-icon-icon-clearable-color-hover);\n    border-color: var(--syn-input-icon-icon-clearable-color-hover);\n  }\n\n  .switch:not(.switch--checked):not(.switch--disabled):hover .switch__control:hover .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n  }\n\n  /* Checked + hover */\n  .switch.switch--checked:not(.switch--disabled):hover .switch__control {\n    background-color: var(--syn-interactive-emphasis-color-hover);\n    border-color: var(--syn-interactive-emphasis-color-hover);\n  }\n\n  .switch.switch--checked:not(.switch--disabled):hover .switch__control:hover .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n  }\n\n  /*\n   * #443: Add active styles\n   * The checked and unchecked states have different active colors\n   * Note the fallback is defined to match the hover color.\n   * This is done to make sure no active state is shown at all if no active color is defined.\n   * Still better than showing one for the unchecked state but not for the checked state.\n   */\n  .switch:not(.switch--checked):not(.switch--disabled):active .switch__control {\n    background: var(--syn-input-icon-icon-clearable-color-active);\n    border-color: var(--syn-input-icon-icon-clearable-color-active);\n  }\n\n  .switch.switch--checked:not(.switch--disabled):active .switch__control {\n    background: var(--syn-interactive-emphasis-color-active);\n    border-color: var(--syn-interactive-emphasis-color-active);\n  }\n\n  /* Focus */\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n    background-color: var(--syn-input-icon-icon-clearable-color);\n    border-color: var(--syn-input-icon-icon-clearable-color);\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n    outline: none;\n  }\n\n  /* Checked + focus */\n  .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n    background-color: var(--syn-interactive-emphasis-color);\n    border-color: var(--syn-interactive-emphasis-color);\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n    outline: none;\n  }\n\n  .switch__label {\n    margin-inline-start: var(--syn-spacing-x-small);\n  }\n  \n  :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control {\n    background-color: var(--syn-input-border-color-focus-error);\n    border-color: var(--syn-input-border-color-focus-error);\n  }\n\n  :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled):hover .switch__control {\n    background-color: var(--syn-input-border-color-hover);\n    border-color: var(--syn-input-border-color-hover);\n  }\n  `;\n"],
+  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,+BAAQ;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.TBO7YQ7H.js → chunk.SM4ANWX6.js}

@@ -1,6 +1,6 @@
 import {
   SynCheckbox
-} from "./chunk.74EPLGQK.js";
+} from "./chunk.VGI7V7OS.js";
 
 // src/components/checkbox/checkbox.ts
 var checkbox_default = SynCheckbox;
@@ -9,4 +9,4 @@ SynCheckbox.define("syn-checkbox");
 export {
   checkbox_default
 };
-//# sourceMappingURL=chunk.TBO7YQ7H.js.map
+//# sourceMappingURL=chunk.SM4ANWX6.js.map

package/dist/chunks/{chunk.7YONTVZW.js → chunk.TFBMLDBM.js}

@@ -1,6 +1,6 @@
 import {
   SynAccordion
-} from "./chunk.DAELIXNV.js";
+} from "./chunk.3PWAIWL5.js";
 
 // src/components/accordion/accordion.ts
 var accordion_default = SynAccordion;
@@ -9,4 +9,4 @@ SynAccordion.define("syn-accordion");
 export {
   accordion_default
 };
-//# sourceMappingURL=chunk.7YONTVZW.js.map
+//# sourceMappingURL=chunk.TFBMLDBM.js.map

package/dist/chunks/{chunk.ZCUURSJU.js → chunk.TSWB7UFK.js}

@@ -3,10 +3,10 @@ import { css } from "lit";
 var alert_custom_styles_default = css`
   .alert {
     /* Defines the used border and icon color for variants */
-    --variant-color-border: var(--syn-alert-informative-color-border, var(--syn-panel-border-color));
-    --variant-color-background: var(--syn-alert-informative-color-background, var(--syn-panel-background-color));
-    --variant-color-icon: var(--syn-alert-informative-color-icon, var(--syn-color-primary-600));
-    --variant-color-indicator: var(--syn-alert-informative-color-indicator, var(--syn-color-primary-600));
+    --variant-color-border: var(--syn-alert-informative-color-border);
+    --variant-color-background: var(--syn-alert-informative-color-background);
+    --variant-color-icon: var(--syn-alert-informative-color-icon);
+    --variant-color-indicator: var(--syn-alert-informative-color-indicator);
 
     /* Defines special settings for sizes */
     --size-font-size: var(--syn-font-size-medium);
@@ -83,31 +83,31 @@ var alert_custom_styles_default = css`
    * Variant colors
    */
   .alert--success {
-    --variant-color-border: var(--syn-alert-success-color-border, var(--syn-panel-border-color));
-    --variant-color-background: var(--syn-alert-success-color-background, var(--syn-panel-background-color));
-    --variant-color-icon: var(--syn-alert-success-color-icon, var(--syn-color-success-500));
-    --variant-color-indicator: var(--syn-alert-success-color-indicator, var(--syn-color-success-500));
+    --variant-color-border: var(--syn-alert-success-color-border);
+    --variant-color-background: var(--syn-alert-success-color-background);
+    --variant-color-icon: var(--syn-alert-success-color-icon);
+    --variant-color-indicator: var(--syn-alert-success-color-indicator);
   }
 
   .alert--neutral {
-    --variant-color-border: var(--syn-alert-neutral-color-border, var(--syn-panel-border-color));
-    --variant-color-background: var(--syn-alert-neutral-color-background, var(--syn-panel-background-color));
-    --variant-color-icon: var(--syn-alert-neutral-color-icon, var(--syn-color-neutral-800));
-    --variant-color-indicator: var(--syn-alert-neutral-color-indicator, var(--syn-color-neutral-800));
+    --variant-color-border: var(--syn-alert-neutral-color-border);
+    --variant-color-background: var(--syn-alert-neutral-color-background);
+    --variant-color-icon: var(--syn-alert-neutral-color-icon);
+    --variant-color-indicator: var(--syn-alert-neutral-color-indicator);
   }
 
   .alert--warning {
-    --variant-color-border: var(--syn-alert-warning-color-border, var(--syn-panel-border-color));
-    --variant-color-background: var(--syn-alert-warning-color-background, var(--syn-panel-background-color));
-    --variant-color-icon: var(--syn-alert-warning-color-icon, var(--syn-color-warning-400));
-    --variant-color-indicator: var(--syn-alert-warning-color-indicator, var(--syn-color-warning-400));
+    --variant-color-border: var(--syn-alert-warning-color-border);
+    --variant-color-background: var(--syn-alert-warning-color-background);
+    --variant-color-icon: var(--syn-alert-warning-color-icon);
+    --variant-color-indicator: var(--syn-alert-warning-color-indicator);
   }
 
   .alert--danger {
-    --variant-color-border: var(--syn-alert-error-color-border, var(--syn-panel-border-color));
-    --variant-color-background: var(--syn-alert-error-color-background, var(--syn-panel-background-color));
-    --variant-color-icon: var(--syn-alert-error-color-icon, var(--syn-color-error-600));
-    --variant-color-indicator: var(--syn-alert-error-color-indicator, var(--syn-color-error-600));
+    --variant-color-border: var(--syn-alert-error-color-border);
+    --variant-color-background: var(--syn-alert-error-color-background);
+    --variant-color-icon: var(--syn-alert-error-color-icon);
+    --variant-color-indicator: var(--syn-alert-error-color-indicator);
   }
 
   /* #1119: Alert Sizes */
@@ -138,4 +138,4 @@ var alert_custom_styles_default = css`
 export {
   alert_custom_styles_default
 };
-//# sourceMappingURL=chunk.ZCUURSJU.js.map
+//# sourceMappingURL=chunk.TSWB7UFK.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/alert/alert.custom.styles.ts"],
+  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  .alert {\n    /* Defines the used border and icon color for variants */\n    --variant-color-border: var(--syn-alert-informative-color-border);\n    --variant-color-background: var(--syn-alert-informative-color-background);\n    --variant-color-icon: var(--syn-alert-informative-color-icon);\n    --variant-color-indicator: var(--syn-alert-informative-color-indicator);\n\n    /* Defines special settings for sizes */\n    --size-font-size: var(--syn-font-size-medium);\n    --size-icon-size: var(--syn-font-size-x-large);\n    --size-min-height: 54px;\n    --size-message-padding: var(--syn-spacing-medium) var(--syn-spacing-large) var(--syn-spacing-medium) var(--syn-spacing-medium);\n    --size-icon-padding-block: var(--syn-spacing-medium);\n    --size-icon-padding-inline: var(--syn-spacing-medium);\n\n    background-color: var(--variant-color-background);\n    border: var(--syn-panel-border-width) solid var(--variant-color-border);\n    border-left: 0;\n    border-radius: var(--syn-border-radius-none);\n    box-sizing: content-box;\n    color: var(--syn-typography-color-text);\n    font-size: var(--size-font-size);\n    line-height: var(--syn-line-height-normal);\n    min-height: var(--size-min-height);\n  }\n\n  /**\n   * Add back the items left borders\n   * This is done to prevent border clipping with the large border-left needed on .alert\n   * Note we also need to adjust our paddings to add the border width here\n   */\n  .alert::before {\n    background: var(--variant-color-indicator);\n    bottom: -1px;\n    content: \"\";\n    left: 0;\n    position: absolute;\n    top: -1px;\n    width: var(--syn-spacing-2x-small);\n  }\n\n  .alert :first-child {\n    margin-inline-start: var(--syn-spacing-2x-small);\n  }\n\n  /**\n   * Make sure everything is aligned to top\n   */\n  .alert__icon,\n  .alert__close-button {\n    align-items: flex-start;\n    font-size: var(--size-icon-size);\n  }\n\n  .alert__message {\n    align-self: center;\n    padding: var(--size-message-padding);\n  }\n\n  /**\n   * Alert Icon\n   */\n  .alert__icon {\n    color: var(--variant-color-icon);\n    padding-block-start: var(--size-icon-padding-block);\n    padding-inline-start: var(--size-icon-padding-inline);\n  }\n\n  /**\n   * Close Icon\n   */\n  .alert__close-button {\n    align-self: start; /* #1135: Fix alignment for the close icon */\n    color: var(--syn-typography-color-text);\n    margin-block: calc(var(--syn-spacing-x-small) - var(--syn-panel-border-width));\n    margin-inline-end: var(--syn-spacing-x-small);\n  }\n\n  /**\n   * Variant colors\n   */\n  .alert--success {\n    --variant-color-border: var(--syn-alert-success-color-border);\n    --variant-color-background: var(--syn-alert-success-color-background);\n    --variant-color-icon: var(--syn-alert-success-color-icon);\n    --variant-color-indicator: var(--syn-alert-success-color-indicator);\n  }\n\n  .alert--neutral {\n    --variant-color-border: var(--syn-alert-neutral-color-border);\n    --variant-color-background: var(--syn-alert-neutral-color-background);\n    --variant-color-icon: var(--syn-alert-neutral-color-icon);\n    --variant-color-indicator: var(--syn-alert-neutral-color-indicator);\n  }\n\n  .alert--warning {\n    --variant-color-border: var(--syn-alert-warning-color-border);\n    --variant-color-background: var(--syn-alert-warning-color-background);\n    --variant-color-icon: var(--syn-alert-warning-color-icon);\n    --variant-color-indicator: var(--syn-alert-warning-color-indicator);\n  }\n\n  .alert--danger {\n    --variant-color-border: var(--syn-alert-error-color-border);\n    --variant-color-background: var(--syn-alert-error-color-background);\n    --variant-color-icon: var(--syn-alert-error-color-icon);\n    --variant-color-indicator: var(--syn-alert-error-color-indicator);\n  }\n\n  /* #1119: Alert Sizes */\n  .alert--small {\n    --size-font-size: var(--syn-font-size-small);\n    --size-icon-size: var(--syn-font-size-large);\n    --size-min-height: 44px;\n    --size-message-padding: var(--syn-spacing-small) var(--syn-spacing-large) var(--syn-spacing-small) var(--syn-spacing-small);\n    --size-icon-padding-block: var(--syn-spacing-small);\n    --size-icon-padding-inline: var(--syn-spacing-small);\n  }\n\n  /* Adjust close button size for small alerts */\n  .alert--small .alert__close-button {\n    font-size: var(--syn-font-size-medium);\n  }\n\n  .alert--large {\n    --size-font-size: var(--syn-font-size-large);\n    --size-icon-size: var(--syn-font-size-2x-large);\n    --size-min-height: 68px;\n    --size-message-padding: var(--syn-spacing-medium-large) var(--syn-spacing-large) var(--syn-spacing-medium-large) var(--syn-spacing-medium-large);\n    --size-icon-padding-block: var(--syn-spacing-medium-large);\n    --size-icon-padding-inline: var(--syn-spacing-medium-large);\n  }\n`;\n"],
+  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,8BAAQ;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.XASOHJYY.js → chunk.U7O7432Y.js}

@@ -1,6 +1,6 @@
 import {
   SynDivider
-} from "./chunk.I42ZMXUL.js";
+} from "./chunk.M7VZBJK4.js";
 
 // src/components/divider/divider.ts
 var divider_default = SynDivider;
@@ -9,4 +9,4 @@ SynDivider.define("syn-divider");
 export {
   divider_default
 };
-//# sourceMappingURL=chunk.XASOHJYY.js.map
+//# sourceMappingURL=chunk.U7O7432Y.js.map

package/dist/chunks/{chunk.3DUI4MAT.js → chunk.UIRABJTT.js}

@@ -1,6 +1,6 @@
 import {
   SynBadge
-} from "./chunk.4NWG6GIY.js";
+} from "./chunk.5ORVYCVV.js";
 
 // src/components/badge/badge.ts
 var badge_default = SynBadge;
@@ -9,4 +9,4 @@ SynBadge.define("syn-badge");
 export {
   badge_default
 };
-//# sourceMappingURL=chunk.3DUI4MAT.js.map
+//# sourceMappingURL=chunk.UIRABJTT.js.map

package/dist/chunks/{chunk.OAAB4YO4.js → chunk.UNYO3GI7.js}

@@ -31,7 +31,7 @@ var menu_item_custom_styles_default = css`
     /* Border Radius needs to be increased to cover the outline */
     border-radius: calc(var(--syn-focus-ring-border-radius) + var(--menuitem-inset-border-vertical));
     border-width: var(--menuitem-inset-border-horizontal) var(--menuitem-inset-border-vertical);
-    color: var(--syn-option-color, var(--syn-typography-color-text));
+    color: var(--syn-option-color);
     font-size: var(--menuitem-font-size);
 
     /* Height is dependent on line-height of .option__label, which does not fit completely to layout */
@@ -40,7 +40,7 @@ var menu_item_custom_styles_default = css`
   }
 
   :host(:focus-visible) .menu-item {
-    background-color: var(--syn-option-background-color-active, var(--syn-color-neutral-1000));
+    background-color: var(--syn-option-background-color-active);
   }
 
   /** #429: Use token for opacity */
@@ -64,26 +64,26 @@ var menu_item_custom_styles_default = css`
    */
   .menu-item .menu-item__prefix::slotted(syn-icon),
   .menu-item .menu-item__suffix::slotted(syn-icon) {
-    color: var(--syn-option-icon-color, var(--syn-typography-color-text));
+    color: var(--syn-option-icon-color);
     font-size: var(--syn-font-size-x-large);
   }
 
   :host(:hover) .menu-item .menu-item__prefix::slotted(syn-icon),
   :host(:hover) .menu-item__suffix::slotted(syn-icon) {
-    color: var(--syn-option-icon-color-hover, var(--syn-typography-color-text-inverted));
+    color: var(--syn-option-icon-color-hover);
   }
 
   :host(:focus-visible) .menu-item .menu-item__prefix::slotted(syn-icon),
   :host(:focus-visible) .menu-item .menu-item__suffix::slotted(syn-icon) {
-    color: var(--syn-option-icon-color-active, var(--syn-typography-color-text-inverted));
+    color: var(--syn-option-icon-color-active);
   }
 
   /* Adjust background and text color for focused elements */
   /* stylelint-disable selector-not-notation, plugin/no-unsupported-browser-features */
   :host(:hover:not([aria-disabled='true'], :focus-visible)) .menu-item,
   .menu-item--submenu-expanded {
-    background-color: var(--syn-option-background-color-hover, var(--syn-color-neutral-1000));
-    color: var(--syn-option-color-hover, var(--syn-typography-color-text-inverted));
+    background-color: var(--syn-option-background-color-hover);
+    color: var(--syn-option-color-hover);
   }
   /* stylelint-enable selector-not-notation, plugin/no-unsupported-browser-features */
 
@@ -106,7 +106,7 @@ var menu_item_custom_styles_default = css`
   }
 
   .menu-item .menu-item__check {
-    color: var(--syn-option-check-color, var(--syn-color-primary-600));
+    color: var(--syn-option-check-color);
     margin-inline-end: var(--syn-spacing-small);
   }
 
@@ -121,11 +121,11 @@ var menu_item_custom_styles_default = css`
    * Make sure the checkbox is also visible when the item is active
    */
   :host(:focus-visible) .menu-item--checked .menu-item__check {
-    color: var(--syn-option-check-color-active, var(--syn-color-neutral-0));
+    color: var(--syn-option-check-color-active);
   }
 
   :host(:hover) .menu-item--checked .menu-item__check {
-    color: var(--syn-option-check-color-hover, var(--syn-color-neutral-0));
+    color: var(--syn-option-check-color-hover);
   }
 
   /**
@@ -159,7 +159,7 @@ var menu_item_custom_styles_default = css`
   .menu-item--loading syn-spinner {
     --track-width: 2px;
 
-    color: var(--syn-interactive-emphasis-color, var(--syn-color-primary-700));
+    color: var(--syn-interactive-emphasis-color);
     font-size: var(--syn-font-size-medium);
     left: calc(var(--menuitem-padding) - var(--menuitem-inset-border-vertical));
   }
@@ -194,4 +194,4 @@ var menu_item_custom_styles_default = css`
 export {
   menu_item_custom_styles_default
 };
-//# sourceMappingURL=chunk.OAAB4YO4.js.map
+//# sourceMappingURL=chunk.UNYO3GI7.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/menu-item/menu-item.custom.styles.ts"],
+  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host {\n    /* Custom override for hiding the checkmark in menus it is not needed */\n    --display-checkmark: flex;\n\n    /**\n     * Default size settings for menu-item\n     * This prepares the custom sizes that we will add later on\n     * @see https://github.com/synergy-design-system/design/issues/277\n     */\n    --menuitem-inset-border-horizontal: var(--syn-spacing-2x-small);\n    --menuitem-inset-border-vertical: calc(var(--syn-spacing-x-small) - 1px);\n    --menuitem-min-height: var(--syn-input-height-medium);\n    --menuitem-padding: var(--syn-input-spacing-medium);\n    --menuitem-font-size: var(--syn-input-font-size-medium);\n    --menuitem-icon-size: var(--syn-spacing-large);\n  }\n\n  .menu-item {\n    align-items: center;\n\n    /*\n     * #1127: Brand2025 defines a small gap between options\n     * and rounded corners. We achieve that using an border\n     * that simulates the gap using the menu background color.\n     */\n    border: solid var(--syn-panel-background-color);\n\n    /* Border Radius needs to be increased to cover the outline */\n    border-radius: calc(var(--syn-focus-ring-border-radius) + var(--menuitem-inset-border-vertical));\n    border-width: var(--menuitem-inset-border-horizontal) var(--menuitem-inset-border-vertical);\n    color: var(--syn-option-color);\n    font-size: var(--menuitem-font-size);\n\n    /* Height is dependent on line-height of .option__label, which does not fit completely to layout */\n    min-height: var(--menuitem-min-height, var(--syn-input-height-medium));\n    padding: 0 calc(var(--menuitem-padding) - var(--menuitem-inset-border-vertical));\n  }\n\n  :host(:focus-visible) .menu-item {\n    background-color: var(--syn-option-background-color-active);\n  }\n\n  /** #429: Use token for opacity */\n  .menu-item.menu-item--disabled {\n    opacity: var(--syn-opacity-50);\n  }\n\n  /**\n   * Handling for slotted prefix and suffix\n   */\n  .menu-item .menu-item__prefix::slotted(*) {\n    margin-inline-end: var(--syn-spacing-small);\n  }\n\n  .menu-item .menu-item__suffix::slotted(*) {\n    margin-inline-start: var(--syn-spacing-small);\n  }\n\n  /**\n   * Set the default font size to make icons appear correct\n   */\n  .menu-item .menu-item__prefix::slotted(syn-icon),\n  .menu-item .menu-item__suffix::slotted(syn-icon) {\n    color: var(--syn-option-icon-color);\n    font-size: var(--syn-font-size-x-large);\n  }\n\n  :host(:hover) .menu-item .menu-item__prefix::slotted(syn-icon),\n  :host(:hover) .menu-item__suffix::slotted(syn-icon) {\n    color: var(--syn-option-icon-color-hover);\n  }\n\n  :host(:focus-visible) .menu-item .menu-item__prefix::slotted(syn-icon),\n  :host(:focus-visible) .menu-item .menu-item__suffix::slotted(syn-icon) {\n    color: var(--syn-option-icon-color-active);\n  }\n\n  /* Adjust background and text color for focused elements */\n  /* stylelint-disable selector-not-notation, plugin/no-unsupported-browser-features */\n  :host(:hover:not([aria-disabled='true'], :focus-visible)) .menu-item,\n  .menu-item--submenu-expanded {\n    background-color: var(--syn-option-background-color-hover);\n    color: var(--syn-option-color-hover);\n  }\n  /* stylelint-enable selector-not-notation, plugin/no-unsupported-browser-features */\n\n  /**\n   * Adjust the size of icons\n   */\n  .menu-item .menu-item__chevron,\n  .menu-item .menu-item__check {\n    display: var(--display-checkmark);\n    font-size: var(--syn-font-size-x-large);\n    width: var(--syn-font-size-x-large);\n  }\n\n  /**\n   * This makes sure the chevron does not take any space if we do not have children\n   */\n  .menu-item .menu-item__chevron {\n    display: none;\n    margin-inline-start: var(--syn-spacing-small);\n  }\n\n  .menu-item .menu-item__check {\n    color: var(--syn-option-check-color);\n    margin-inline-end: var(--syn-spacing-small);\n  }\n\n  /**\n   * When in loading state, do not show the checkmark as it would bleed through\n   */\n  .menu-item--loading .menu-item__check {\n    visibility: hidden;\n  }\n\n  /**\n   * Make sure the checkbox is also visible when the item is active\n   */\n  :host(:focus-visible) .menu-item--checked .menu-item__check {\n    color: var(--syn-option-check-color-active);\n  }\n\n  :host(:hover) .menu-item--checked .menu-item__check {\n    color: var(--syn-option-check-color-hover);\n  }\n\n  /**\n   * Special handling for the submenu chevron:\n   * We are using the \"chevron-down\" icon per default as\n   * we do not want all chevrons to be part of the bundle\n   * Therefore, we have to transform it into the right direction\n   */\n  .menu-item .menu-item__chevron syn-icon {\n    transform: rotate(-90deg);\n  }\n\n  .menu-item--rtl .menu-item__chevron syn-icon {\n    transform: rotate(90deg);\n  }\n\n  .menu-item.menu-item--loading *:not(syn-spinner) {\n    opacity: var(--syn-opacity-50);\n  }\n\n  /**\n   * Make sure to show the chevron if there are children\n   */\n  .menu-item--has-submenu .menu-item__chevron {\n    display: flex;\n  }\n\n  /**\n   * Adjustments for the spinner in loading state\n   */\n  .menu-item--loading syn-spinner {\n    --track-width: 2px;\n\n    color: var(--syn-interactive-emphasis-color);\n    font-size: var(--syn-font-size-medium);\n    left: calc(var(--menuitem-padding) - var(--menuitem-inset-border-vertical));\n  }\n\n  /**\n   * Highlight checked items\n   */\n  .menu-item--checked .menu-item__label {\n    font-weight: var(--syn-font-weight-semibold);\n  }\n\n  /* Needed if we do not show the checkmark */\n  :host(:not([type=\"checkmark\"]):not([loading])) .menu-item__label {\n    min-height: var(--syn-font-size-x-large);\n  }\n\n  /* #1131: Make sure that slotted menus do show the correct border radius */\n  syn-popup::part(popup) {\n    border-radius: var(--syn-input-border-radius-medium);\n  }\n\n  /**\n   * #1009: Adjust the position for submenus when they are opened to the left, too.\n   * This works because the data-current-placement attribute is set on the popup accordingly.\n   * We do not use the actual placement attribute, because it does not update when the placement changes\n   */\n  syn-popup[data-current-placement^=\"left\"]::part(popup) {\n    margin-left: calc(-1 * var(--submenu-offset));\n  }\n`;\n"],
+  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,kCAAQ;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;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.DZTLGJLC.js → chunk.UOQ4AOFC.js}

@@ -1,6 +1,6 @@
 import {
   SynValidate
-} from "./chunk.BEAGYN6W.js";
+} from "./chunk.6BGHUVA7.js";
 
 // src/components/validate/validate.ts
 var validate_default = SynValidate;
@@ -9,4 +9,4 @@ SynValidate.define("syn-validate");
 export {
   validate_default
 };
-//# sourceMappingURL=chunk.DZTLGJLC.js.map
+//# sourceMappingURL=chunk.UOQ4AOFC.js.map

package/dist/chunks/{chunk.BI7YROH2.js → chunk.V53NJJ67.js}

@@ -1,6 +1,6 @@
 import {
   SynRadio
-} from "./chunk.ADIU6GO2.js";
+} from "./chunk.PSO3VL25.js";
 
 // src/components/radio/radio.ts
 var radio_default = SynRadio;
@@ -9,4 +9,4 @@ SynRadio.define("syn-radio");
 export {
   radio_default
 };
-//# sourceMappingURL=chunk.BI7YROH2.js.map
+//# sourceMappingURL=chunk.V53NJJ67.js.map

package/dist/chunks/{chunk.4A6JD5B2.js → chunk.VBS3JEIP.js}

@@ -31,4 +31,4 @@ var icons = {
 export {
   icons
 };
-//# sourceMappingURL=chunk.4A6JD5B2.js.map
+//# sourceMappingURL=chunk.VBS3JEIP.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/icon/sick2025-system-icons.ts"],
+  "sourcesContent": ["/* eslint-disable */\n\nexport const icons = {\n  \"add\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M11.25 12.75H5.5v-1.5h5.75V5.5h1.5v5.75h5.75v1.5h-5.75v5.75h-1.5z\\\"/></svg>\",\n  \"check\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"m9.55 17.654-5.334-5.335 1.069-1.069 4.265 4.265 9.166-9.165 1.069 1.07z\\\"/></svg>\",\n  \"chevron-down\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M12 15.039 6.346 9.384 7.4 8.331l4.6 4.6 4.6-4.6 1.054 1.053z\\\"/></svg>\",\n  \"chevron-right\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"m12.946 12-4.6-4.6L9.4 6.346 15.054 12 9.4 17.654 8.346 16.6z\\\"/></svg>\",\n  \"details-close\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M5.5 12.75v-1.5h13v1.5z\\\"/></svg>\",\n  \"details-open\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M11.25 12.75H5.5v-1.5h5.75V5.5h1.5v5.75h5.75v1.5h-5.75v5.75h-1.5z\\\"/></svg>\",\n  \"eye\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M12.002 15.577q1.7 0 2.888-1.19t1.187-2.89-1.19-2.886-2.89-1.188-2.886 1.19-1.188 2.89 1.19 2.887 2.89 1.187M12 14.2q-1.125 0-1.912-.787A2.6 2.6 0 0 1 9.3 11.5q0-1.125.788-1.912A2.6 2.6 0 0 1 12 8.8q1.125 0 1.913.787.787.788.787 1.913t-.787 1.912A2.6 2.6 0 0 1 12 14.2m.001 4.3q-3.45 0-6.285-1.903-2.837-1.904-4.177-5.097 1.34-3.194 4.175-5.097T12 4.5t6.286 1.903q2.836 1.904 4.177 5.097-1.341 3.195-4.176 5.097T12.001 18.5\\\"/></svg>\",\n  \"eye-slash\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"m19.762 21.87-4.046-4.016q-.77.285-1.705.465-.936.18-2.01.181-3.525 0-6.341-1.939-2.815-1.938-4.121-5.061.554-1.325 1.43-2.472A11.4 11.4 0 0 1 4.9 7.038l-2.77-2.8 1.055-1.053 17.63 17.63zM12 15.576q.314 0 .642-.054.33-.053.585-.158l-5.092-5.092q-.104.275-.158.599a4 4 0 0 0-.054.628q0 1.702 1.188 2.89 1.186 1.187 2.89 1.187m6.954.507-3.137-3.111q.118-.32.189-.684.07-.366.071-.789 0-1.702-1.187-2.89Q13.702 7.424 12 7.424q-.422 0-.779.076-.355.076-.684.228L8.035 5.235a10 10 0 0 1 1.936-.556q.99-.18 2.03-.179 3.514 0 6.34 1.939 2.824 1.938 4.12 5.061-.555 1.34-1.435 2.502a11 11 0 0 1-2.072 2.082m-4.27-4.234-3.009-3q.661-.124 1.25.098.586.223 1.012.663.435.44.636 1.033.202.593.112 1.206\\\"/></svg>\",\n  \"indeterminate\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M5.5 12.75v-1.5h13v1.5z\\\"/></svg>\",\n  \"logo-color\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"295\\\" height=\\\"94\\\" viewBox=\\\"0 0 295 94\\\" fill='currentColor'><g clip-path=\\\"url(#a)\\\"><path d=\\\"M166.39 0c17.638 0 32.976 9.895 40.876 24.493L188.19 34.788c-4.268-7.865-12.516-13.108-21.8-13.108-13.545 0-24.876 11.14-24.876 25.32s11.331 25.32 24.876 25.32c9.476 0 17.925-5.452 22.106-13.596l19.058 10.347C199.723 83.905 184.202 94 166.39 94c-25.713 0-46.556-21.044-46.556-47S140.677 0 166.39 0M56.85 1.673c12.543 0 21.498 9.389 21.498 21.296H26.436c-6.977.993-7.421 11.697 0 12.908H54.08c15.164.41 27.263 12.481 27.263 27.768 0 14.084-11.95 28.238-27.194 28.238H25.643c-12.134 0-25.495-6.55-25.495-21.758.151 0 46.601 0 54.011.009 7.9-1.577 7.02-11.541 0-12.917H26.436C11.68 57.217 0 44.622 0 29.614 0 15.182 10.792 1.673 26.436 1.673zm53.803 90.21H89.349V1.664h21.304zm126.48-90.219v36.182h8.292l22.402-36.182h26.497L263.795 47.35l30.085 44.534h-26.505L244.702 56.93h-7.569v34.953h-21.549V1.664z\\\"/></g><defs><clipPath id=\\\"a\\\"><path d=\\\"M0 0h295v94H0z\\\"/></clipPath></defs></svg>\",\n  \"menu\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M3.5 17.635v-1.5h17v1.5zm0-4.885v-1.5h17v1.5zm0-4.885v-1.5h17v1.5z\\\"/></svg>\",\n  \"more\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M6.23 13.5q-.618 0-1.059-.44a1.44 1.44 0 0 1-.44-1.06q0-.619.44-1.06.44-.44 1.06-.44.618 0 1.06.44.44.442.44 1.06t-.44 1.06q-.442.44-1.06.44m5.77 0q-.619 0-1.06-.44A1.44 1.44 0 0 1 10.5 12q0-.619.44-1.06.441-.44 1.06-.44.618 0 1.06.44.44.442.44 1.06t-.44 1.06q-.442.44-1.06.44m5.77 0q-.62 0-1.06-.44a1.44 1.44 0 0 1-.44-1.06q0-.619.44-1.06.44-.44 1.06-.44.618 0 1.058.44.441.442.441 1.06t-.44 1.06q-.44.44-1.06.44\\\"/></svg>\",\n  \"more-vert\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M12 19.27q-.619 0-1.06-.442a1.44 1.44 0 0 1-.44-1.059q0-.618.44-1.06.442-.44 1.06-.44t1.06.44q.44.442.44 1.06 0 .62-.44 1.06-.442.44-1.06.44m0-5.77q-.619 0-1.06-.44A1.44 1.44 0 0 1 10.5 12q0-.619.44-1.06.442-.44 1.06-.44t1.06.44q.44.441.44 1.06t-.44 1.06-1.06.44m0-5.77q-.619 0-1.06-.44a1.44 1.44 0 0 1-.44-1.06q0-.618.44-1.059.442-.44 1.06-.44t1.06.44q.44.44.44 1.06 0 .618-.44 1.06-.442.44-1.06.44\\\"/></svg>\",\n  \"placeholder\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M3.5 20.5V13H5v6h6v1.5zm9.5 0V19h6v-6h1.5v7.5zm-6.25-3.75 2.48-3.289 2 2.558 2.809-3.653 3.288 4.384zM3.5 11V3.5H11V5H5v6zM19 11V5h-6V3.5h7.5V11zm-3.594-1.096q-.566 0-.938-.37a1.26 1.26 0 0 1-.372-.936q0-.566.37-.938t.936-.372.938.37q.371.37.372.936 0 .566-.37.938a1.26 1.26 0 0 1-.936.372\\\"/></svg>\",\n  \"radio\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"12\\\" height=\\\"12\\\" viewBox=\\\"0 0 12 12\\\" fill='currentColor'><path d=\\\"M6 10.75a4.6 4.6 0 0 1-1.852-.374A4.8 4.8 0 0 1 2.64 9.361a4.8 4.8 0 0 1-1.016-1.508 4.6 4.6 0 0 1-.374-1.852q0-.986.374-1.853.375-.866 1.015-1.508.641-.641 1.508-1.016a4.6 4.6 0 0 1 1.852-.374q.986 0 1.853.374.867.375 1.508 1.015.642.641 1.016 1.508t.374 1.852-.374 1.853A4.8 4.8 0 0 1 9.361 9.36q-.642.642-1.508 1.016a4.6 4.6 0 0 1-1.852.374\\\"/></svg>\",\n  \"status-error\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M12 16.712q.343 0 .575-.233a.78.78 0 0 0 .233-.575.78.78 0 0 0-.232-.576.78.78 0 0 0-.576-.232.78.78 0 0 0-.575.232.78.78 0 0 0-.233.576q0 .343.232.575a.78.78 0 0 0 .576.233m-.75-3.481h1.5V7.192h-1.5zM8.461 20.5 3.5 15.543V8.462L8.457 3.5h7.082L20.5 8.457v7.082L15.543 20.5zM9.1 19h5.8l4.1-4.1V9.1L14.9 5H9.1L5 9.1v5.8z\\\"/></svg>\",\n  \"status-informative\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M11.25 16.75h1.5V11h-1.5zM12 9.289q.343 0 .575-.233a.78.78 0 0 0 .233-.575.78.78 0 0 0-.232-.576.78.78 0 0 0-.576-.232.78.78 0 0 0-.575.232.78.78 0 0 0-.233.576q0 .343.232.575A.78.78 0 0 0 12 9.29m.002 12.211a9.3 9.3 0 0 1-3.706-.748 9.6 9.6 0 0 1-3.016-2.03 9.6 9.6 0 0 1-2.032-3.016 9.25 9.25 0 0 1-.748-3.704q0-1.972.748-3.706a9.6 9.6 0 0 1 2.03-3.016 9.6 9.6 0 0 1 3.016-2.032 9.25 9.25 0 0 1 3.704-.748q1.972 0 3.706.748a9.6 9.6 0 0 1 3.017 2.03 9.6 9.6 0 0 1 2.03 3.016 9.25 9.25 0 0 1 .749 3.704q0 1.972-.748 3.706a9.6 9.6 0 0 1-2.03 3.017 9.6 9.6 0 0 1-3.016 2.03 9.25 9.25 0 0 1-3.704.749M12 20q3.35 0 5.675-2.325T20 12t-2.325-5.675T12 4 6.325 6.325 4 12t2.325 5.675T12 20\\\"/></svg>\",\n  \"status-neutral\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"m9.692 21.5-.38-3.046a5.3 5.3 0 0 1-1.579-.896L4.912 18.75l-2.308-4 2.44-1.844a5 5 0 0 1-.049-.448 7 7 0 0 1 0-.882q.014-.22.05-.482L2.603 9.25l2.308-3.98 2.811 1.182a6.4 6.4 0 0 1 .772-.524 5 5 0 0 1 .807-.382l.39-3.046h4.616l.38 3.056q.45.163.815.381t.735.515l2.85-1.183 2.308 3.981-2.479 1.873q.054.243.059.453t.005.424q0 .204-.01.415-.01.21-.069.481l2.46 1.854-2.308 4-2.815-1.202q-.372.296-.758.524a4.6 4.6 0 0 1-.793.372l-.38 3.056zM11 20h1.966l.359-2.679q.765-.2 1.399-.568.634-.369 1.222-.947l2.485 1.044.985-1.7-2.17-1.635q.125-.387.17-.761a6.3 6.3 0 0 0 0-1.508 4 4 0 0 0-.17-.742l2.189-1.654-.985-1.7-2.513 1.06a5.3 5.3 0 0 0-1.203-.949 5.2 5.2 0 0 0-1.418-.582L13 4h-1.985l-.33 2.67a5.2 5.2 0 0 0-1.414.553q-.648.374-1.237.962L5.55 7.15l-.984 1.7 2.159 1.61a3.7 3.7 0 0 0-.175.74 6.3 6.3 0 0 0 0 1.575q.05.375.165.74l-2.15 1.635.985 1.7 2.475-1.05q.57.585 1.217.958t1.433.573zm1.011-5q1.249 0 2.125-.876A2.9 2.9 0 0 0 15.012 12q0-1.248-.876-2.124A2.9 2.9 0 0 0 12.012 9q-1.264 0-2.132.876A2.9 2.9 0 0 0 9.01 12q0 1.248.869 2.124T12.01 15\\\"/></svg>\",\n  \"status-success\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"m10.58 16.254 6.724-6.723-1.054-1.054-5.67 5.67-2.85-2.85-1.053 1.053zm1.422 5.246a9.3 9.3 0 0 1-3.706-.748 9.6 9.6 0 0 1-3.016-2.03 9.6 9.6 0 0 1-2.032-3.016 9.25 9.25 0 0 1-.748-3.704q0-1.972.748-3.706a9.6 9.6 0 0 1 2.03-3.016 9.6 9.6 0 0 1 3.016-2.032 9.25 9.25 0 0 1 3.704-.748q1.972 0 3.706.748a9.6 9.6 0 0 1 3.017 2.03 9.6 9.6 0 0 1 2.03 3.016 9.25 9.25 0 0 1 .749 3.704q0 1.972-.748 3.706a9.6 9.6 0 0 1-2.03 3.017 9.6 9.6 0 0 1-3.016 2.03 9.25 9.25 0 0 1-3.704.749M12 20q3.35 0 5.675-2.325T20 12t-2.325-5.675T12 4 6.325 6.325 4 12t2.325 5.675T12 20\\\"/></svg>\",\n  \"status-warning\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M1.865 20.5 12 3l10.135 17.5zM4.45 19h15.1L12 6zM12 17.808q.343 0 .575-.232a.78.78 0 0 0 .233-.576.78.78 0 0 0-.232-.576.78.78 0 0 0-.576-.232.78.78 0 0 0-.575.232.78.78 0 0 0-.233.576q0 .343.232.576a.78.78 0 0 0 .576.232m-.75-2.616h1.5v-5h-1.5z\\\"/></svg>\",\n  \"sticky_sidebar\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M9.5 19H19V5H9.5zm-6 1.5v-17h17v17z\\\"/></svg>\",\n  \"tabs-left\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"m7.373 12.75 5.696 5.696L12 19.5 4.5 12 12 4.5l1.07 1.054-5.697 5.696H19.5v1.5z\\\"/></svg>\",\n  \"tabs-right\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M16.627 12.75H4.5v-1.5h12.127l-5.696-5.696L12 4.5l7.5 7.5-7.5 7.5-1.07-1.054z\\\"/></svg>\",\n  \"upload-file\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M11.25 18.385h1.5V13.95l1.85 1.85 1.054-1.07L12 11.078l-3.654 3.654 1.07 1.053 1.834-1.834zM4.5 21.5v-19h9.75l5.25 5.25V21.5zm9-13V4H6v16h12V8.5z\\\"/></svg>\",\n  \"x-circle-fill\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"m8.4 16.654 3.6-3.6 3.6 3.6 1.054-1.054-3.6-3.6 3.6-3.6L15.6 7.346l-3.6 3.6-3.6-3.6L7.346 8.4l3.6 3.6-3.6 3.6zm3.602 4.846a9.3 9.3 0 0 1-3.706-.748 9.6 9.6 0 0 1-3.016-2.03 9.6 9.6 0 0 1-2.032-3.016 9.25 9.25 0 0 1-.748-3.704q0-1.972.748-3.706a9.6 9.6 0 0 1 2.03-3.016 9.6 9.6 0 0 1 3.016-2.032 9.25 9.25 0 0 1 3.704-.748q1.972 0 3.706.748a9.6 9.6 0 0 1 3.017 2.03 9.6 9.6 0 0 1 2.03 3.016 9.25 9.25 0 0 1 .749 3.704q0 1.972-.748 3.706a9.6 9.6 0 0 1-2.03 3.017 9.6 9.6 0 0 1-3.016 2.03 9.25 9.25 0 0 1-3.704.749\\\"/></svg>\",\n  \"x-lg\": \"<svg xmlns=\\\"http://www.w3.org/2000/svg\\\" width=\\\"24\\\" height=\\\"24\\\" viewBox=\\\"0 0 24 24\\\" fill='currentColor'><path d=\\\"M6.4 18.654 5.346 17.6l5.6-5.6-5.6-5.6L6.4 5.346l5.6 5.6 5.6-5.6L18.654 6.4l-5.6 5.6 5.6 5.6-1.054 1.054-5.6-5.6z\\\"/></svg>\"\n};\n"],
+  "mappings": ";AAEO,IAAM,QAAQ;AAAA,EACnB,OAAO;AAAA,EACP,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,EAChB,OAAO;AAAA,EACP,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,eAAe;AAAA,EACf,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,sBAAsB;AAAA,EACtB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,aAAa;AAAA,EACb,cAAc;AAAA,EACd,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,QAAQ;AACV;",
+  "names": []
+}

package/dist/chunks/{chunk.74EPLGQK.js → chunk.VGI7V7OS.js}

@@ -1,6 +1,6 @@
 import {
   checkbox_custom_styles_default
-} from "./chunk.XWNOP753.js";
+} from "./chunk.IZRTF5EM.js";
 import {
   checkbox_styles_default
 } from "./chunk.6OX2AX3Z.js";
@@ -19,10 +19,10 @@ import {
 } from "./chunk.WVVQK5TE.js";
 import {
   SynIcon
-} from "./chunk.SP7ULWRO.js";
+} from "./chunk.Q6XDV7O7.js";
 import {
   enableDefaultSettings
-} from "./chunk.ZNNZXEP4.js";
+} from "./chunk.MLILJGXQ.js";
 import {
   watch
 } from "./chunk.JE5Y2YD7.js";
@@ -31,7 +31,7 @@ import {
 } from "./chunk.NLYVOJGK.js";
 import {
   SynergyElement
-} from "./chunk.QF6ODD6S.js";
+} from "./chunk.FBQ7NUNW.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -267,4 +267,4 @@ SynCheckbox = __decorateClass([
 export {
   SynCheckbox
 };
-//# sourceMappingURL=chunk.74EPLGQK.js.map
+//# sourceMappingURL=chunk.VGI7V7OS.js.map

package/dist/chunks/chunk.VMLERD3J.js

@@ -0,0 +1,52 @@
+// src/utilities/defaultSettings/sort.ts
+var COMPONENT_UPDATE_ORDER = {
+  // Container components that depend on base components update last
+  SynButtonGroup: {
+    dependsOn: ["SynButton"],
+    priority: 10
+  },
+  SynRadioGroup: {
+    dependsOn: ["SynRadio"],
+    priority: 10
+  }
+};
+var getComponentPriority = (component) => {
+  var _a, _b;
+  return (_b = (_a = COMPONENT_UPDATE_ORDER[component]) == null ? void 0 : _a.priority) != null ? _b : 5;
+};
+var sortComponentsForUpdate = (components) => {
+  const visited = /* @__PURE__ */ new Set();
+  const visiting = /* @__PURE__ */ new Set();
+  const result = [];
+  const visit = (component) => {
+    if (visiting.has(component)) {
+      return;
+    }
+    if (visited.has(component)) {
+      return;
+    }
+    visiting.add(component);
+    const config = COMPONENT_UPDATE_ORDER[component];
+    if (config == null ? void 0 : config.dependsOn) {
+      config.dependsOn.forEach((dep) => {
+        if (components.includes(dep)) {
+          visit(dep);
+        }
+      });
+    }
+    visiting.delete(component);
+    visited.add(component);
+    result.push(component);
+  };
+  const sortedByPriority = [...components].sort(
+    (a, b) => getComponentPriority(a) - getComponentPriority(b)
+  );
+  sortedByPriority.forEach((component) => visit(component));
+  return result;
+};
+
+export {
+  getComponentPriority,
+  sortComponentsForUpdate
+};
+//# sourceMappingURL=chunk.VMLERD3J.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/utilities/defaultSettings/sort.ts"],
+  "sourcesContent": ["import type { ComponentNamesWithDefaultValues } from './base.js';\n\n/**\n * Component update priority and dependencies\n * Lower priority numbers update first, higher numbers update last\n */\nconst COMPONENT_UPDATE_ORDER: Partial<Record<ComponentNamesWithDefaultValues, {\n  priority: number;\n  dependsOn?: ComponentNamesWithDefaultValues[];\n}>> = {\n  // Container components that depend on base components update last\n  SynButtonGroup: {\n    dependsOn: ['SynButton'],\n    priority: 10,\n  },\n  SynRadioGroup: {\n    dependsOn: ['SynRadio'],\n    priority: 10,\n  },\n} as const;\n\n/**\n * Get priority for a component (defaults to 5 if not specified)\n */\nexport const getComponentPriority = (\n  component: ComponentNamesWithDefaultValues,\n) => COMPONENT_UPDATE_ORDER[component]?.priority ?? 5;\n\n/**\n * Sort components by dependencies and priority\n */\nexport const sortComponentsForUpdate = (\n  components: ComponentNamesWithDefaultValues[],\n): ComponentNamesWithDefaultValues[] => {\n  const visited = new Set<ComponentNamesWithDefaultValues>();\n  const visiting = new Set<ComponentNamesWithDefaultValues>();\n  const result: ComponentNamesWithDefaultValues[] = [];\n\n  const visit = (component: ComponentNamesWithDefaultValues) => {\n    if (visiting.has(component)) {\n      // Skip circular dependencies\n      return;\n    }\n    if (visited.has(component)) {\n      return;\n    }\n\n    visiting.add(component);\n\n    // Visit dependencies first\n    const config = COMPONENT_UPDATE_ORDER[component];\n    if (config?.dependsOn) {\n      config.dependsOn.forEach(dep => {\n        if (components.includes(dep)) {\n          visit(dep);\n        }\n      });\n    }\n\n    visiting.delete(component);\n    visited.add(component);\n    result.push(component);\n  };\n\n  // Start with components sorted by priority, then apply dependency sorting\n  const sortedByPriority = [...components].sort(\n    (a, b) => getComponentPriority(a) - getComponentPriority(b),\n  );\n\n  sortedByPriority.forEach(component => visit(component));\n\n  return result;\n};\n"],
+  "mappings": ";AAMA,IAAM,yBAGA;AAAA;AAAA,EAEJ,gBAAgB;AAAA,IACd,WAAW,CAAC,WAAW;AAAA,IACvB,UAAU;AAAA,EACZ;AAAA,EACA,eAAe;AAAA,IACb,WAAW,CAAC,UAAU;AAAA,IACtB,UAAU;AAAA,EACZ;AACF;AAKO,IAAM,uBAAuB,CAClC,cACA;AA1BF;AA0BK,4CAAuB,SAAS,MAAhC,mBAAmC,aAAnC,YAA+C;AAAA;AAK7C,IAAM,0BAA0B,CACrC,eACsC;AACtC,QAAM,UAAU,oBAAI,IAAqC;AACzD,QAAM,WAAW,oBAAI,IAAqC;AAC1D,QAAM,SAA4C,CAAC;AAEnD,QAAM,QAAQ,CAAC,cAA+C;AAC5D,QAAI,SAAS,IAAI,SAAS,GAAG;AAE3B;AAAA,IACF;AACA,QAAI,QAAQ,IAAI,SAAS,GAAG;AAC1B;AAAA,IACF;AAEA,aAAS,IAAI,SAAS;AAGtB,UAAM,SAAS,uBAAuB,SAAS;AAC/C,QAAI,iCAAQ,WAAW;AACrB,aAAO,UAAU,QAAQ,SAAO;AAC9B,YAAI,WAAW,SAAS,GAAG,GAAG;AAC5B,gBAAM,GAAG;AAAA,QACX;AAAA,MACF,CAAC;AAAA,IACH;AAEA,aAAS,OAAO,SAAS;AACzB,YAAQ,IAAI,SAAS;AACrB,WAAO,KAAK,SAAS;AAAA,EACvB;AAGA,QAAM,mBAAmB,CAAC,GAAG,UAAU,EAAE;AAAA,IACvC,CAAC,GAAG,MAAM,qBAAqB,CAAC,IAAI,qBAAqB,CAAC;AAAA,EAC5D;AAEA,mBAAiB,QAAQ,eAAa,MAAM,SAAS,CAAC;AAEtD,SAAO;AACT;",
+  "names": []
+}