@synergy-design-system/components 2.7.3 → 2.8.1

package/dist/chunks/chunk.J2OXSQAK.js

@@ -0,0 +1,345 @@
+// src/components/combobox/combobox.styles.ts
+import { css } from "lit";
+var combobox_styles_default = css`
+	/* stylelint-disable */
+  :host {
+    display: block;
+  }
+
+  /** The popup */
+  .combobox {
+    flex: 1 1 auto;
+    display: inline-flex;
+    width: 100%;
+    position: relative;
+    vertical-align: middle;
+  }
+
+  .combobox::part(popup) {
+    z-index: var(--syn-z-index-dropdown);
+  }
+
+  .combobox[data-current-placement^='top']::part(popup) {
+    transform-origin: bottom;
+  }
+
+  .combobox[data-current-placement^='bottom']::part(popup) {
+    transform-origin: top;
+  }
+
+  /* Combobox */
+  .combobox__inputs {
+    flex: 1;
+    display: flex;
+    width: 100%;
+    min-width: 0;
+    position: relative;
+    align-items: center;
+    justify-content: start;
+    font-family: var(--syn-input-font-family);
+    font-weight: var(--syn-input-font-weight);
+    letter-spacing: var(--syn-input-letter-spacing);
+    vertical-align: middle;
+    overflow: hidden;
+    cursor: pointer;
+    transition:
+      var(--syn-transition-fast) color,
+      var(--syn-transition-fast) border,
+      var(--syn-transition-fast) box-shadow,
+      var(--syn-transition-fast) background-color;
+  }
+
+  .combobox__display-input {
+    position: relative;
+    width: 100%;
+    font: inherit;
+    border: none;
+    background: none;
+    color: var(--syn-input-color);
+    cursor: inherit;
+    overflow: hidden;
+    padding: 0;
+    margin: 0;
+    -webkit-appearance: none;
+  }
+
+  .combobox__display-input::placeholder {
+    color: var(--syn-input-placeholder-color);
+  }
+
+  .combobox:not(.combobox--disabled):hover .combobox__display-input {
+    color: var(--syn-input-color-hover);
+  }
+
+  .combobox__display-input:focus {
+    outline: none;
+  }
+
+  .combobox__value-input {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    padding: 0;
+    margin: 0;
+    opacity: 0;
+    z-index: -1;
+  }
+
+  /* Standard combobox */
+  .combobox--standard .combobox__inputs {
+    background-color: var(--syn-input-background-color);
+    border: solid var(--syn-input-border-width) var(--syn-input-border-color);
+  }
+
+  .combobox--standard.combobox--disabled .combobox__inputs {
+    background-color: var(--syn-input-background-color-disabled);
+    border-color: var(--syn-input-border-color-disabled);
+    color: var(--syn-input-color-disabled);
+    opacity: 0.5;
+    cursor: not-allowed;
+    outline: none;
+  }
+
+  .combobox--standard:not(.combobox--disabled).combobox--open .combobox__inputs,
+  .combobox--standard:not(.combobox--disabled).combobox--focused .combobox__inputs {
+    background-color: var(--syn-input-background-color-focus);
+    border-color: var(--syn-input-border-color-focus);
+    box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-color);
+  }
+
+/* Sizes */
+  .combobox--small .combobox__inputs {
+    border-radius: var(--syn-input-border-radius-small);
+    font-size: var(--syn-input-font-size-small);
+    min-height: var(--syn-input-height-small);
+    padding-block: 0;
+    padding-inline: var(--syn-input-spacing-small);
+  }
+
+  .combobox--small .combobox__clear {
+    margin-inline-start: var(--syn-input-spacing-small);
+  }
+
+  .combobox--small .combobox__prefix::slotted(*) {
+    margin-inline-end: var(--syn-input-spacing-small);
+  }
+
+  .combobox--medium .combobox__inputs {
+    border-radius: var(--syn-input-border-radius-medium);
+    font-size: var(--syn-input-font-size-medium);
+    min-height: var(--syn-input-height-medium);
+    padding-block: 0;
+    padding-inline: var(--syn-input-spacing-medium);
+  }
+
+  .combobox--medium .combobox__clear {
+    margin-inline-start: var(--syn-input-spacing-medium);
+  }
+
+  .combobox--medium .combobox__prefix::slotted(*) {
+    margin-inline-end: var(--syn-input-spacing-medium);
+  }
+
+  .combobox--large .combobox__inputs {
+    border-radius: var(--syn-input-border-radius-large);
+    font-size: var(--syn-input-font-size-large);
+    min-height: var(--syn-input-height-large);
+    padding-block: 0;
+    padding-inline: var(--syn-input-spacing-large);
+  }
+
+  .combobox--large .combobox__clear {
+    margin-inline-start: var(--syn-input-spacing-large);
+  }
+
+  .combobox--large .combobox__prefix::slotted(*) {
+    margin-inline-end: var(--syn-input-spacing-large);
+  }
+
+/* Prefix */
+  .combobox__prefix {
+    flex: 0;
+    display: inline-flex;
+    align-items: center;
+    color: var(--syn-input-placeholder-color);
+  }
+
+  /* Suffix */
+  .combobox__suffix {
+    flex: 0;
+    display: inline-flex;
+    align-items: center;
+    color: var(--syn-input-placeholder-color);
+  }
+
+  /* Clear button */
+  .combobox__clear {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    font-size: inherit;
+    color: var(--syn-input-icon-color);
+    border: none;
+    background: none;
+    padding: 0;
+    transition: var(--syn-transition-fast) color;
+    cursor: pointer;
+  }
+
+  .combobox__clear:hover {
+    color: var(--syn-input-icon-color-hover);
+  }
+
+  .combobox__clear:focus {
+    outline: none;
+  }
+
+  /* Expand icon */
+  .combobox__expand-icon {
+    flex: 0 0 auto;
+    display: flex;
+    align-items: center;
+    transition: var(--syn-transition-medium) rotate ease;
+    rotate: 0;
+    margin-inline-start: var(--syn-spacing-small);
+  }
+
+  .combobox--open .combobox__expand-icon {
+    rotate: -180deg;
+  }
+
+  /* Listbox */
+  .combobox__listbox {
+    display: block;
+    position: relative;
+    font-family: var(--syn-font-sans);
+    font-size: var(--syn-font-size-medium);
+    font-weight: var(--syn-font-weight-normal);
+    box-shadow: var(--syn-shadow-large);
+    background: var(--syn-panel-background-color);
+    border: solid var(--syn-panel-border-width) var(--syn-panel-border-color);
+    border-radius: var(--syn-border-radius-medium);
+    padding-block: var(--syn-spacing-x-small);
+    padding-inline: 0;
+    overflow: auto;
+    overscroll-behavior: none;
+
+    /* Make sure it adheres to the popup's auto size */
+    max-width: var(--auto-size-available-width);
+    max-height: var(--auto-size-available-height);
+  }
+
+  .combobox__listbox ::slotted(syn-divider) {
+    --spacing: var(--syn-spacing-x-small);
+  }
+
+  .combobox__listbox ::slotted(small) {
+    display: block;
+    font-size: var(--syn-font-size-small);
+    font-weight: var(--syn-font-weight-semibold);
+    color: var(--syn-color-neutral-500);
+    padding-block: var(--syn-spacing-2x-small);
+    padding-inline: var(--syn-spacing-x-large);
+  }
+
+
+  /**
+   * Invalid user data
+   */
+  :host([data-user-invalid]) .combobox__inputs {
+    border-color: var(--syn-input-border-color-focus-error);
+  }
+
+  :host([data-user-invalid]) .combobox--standard:not(.combobox--disabled).combobox--open .combobox__inputs,
+  :host([data-user-invalid]) .combobox--standard:not(.combobox--disabled).combobox--focused .combobox__inputs {
+    border-color: var(--syn-input-border-color-focus-error);
+    box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-error);
+  }
+
+  /* Clear button */
+  .combobox__clear {
+    color: var(--syn-input-icon-icon-clearable-color);
+    font-size: var(--syn-spacing-large);
+  }
+
+  .combobox--small .combobox__clear {
+    font-size: var(--syn-spacing-medium);
+  }
+
+  .combobox--large .combobox__clear {
+    font-size: var(--syn-spacing-x-large);
+  }
+
+  .combobox--medium .combobox__clear {
+    margin-inline-start: var(--syn-spacing-small);
+  }
+
+  /* Expand icon */
+  .combobox__expand-icon {
+    color: var(--syn-color-neutral-950);
+    font-size: var(--syn-spacing-large);
+    margin-inline-start: var(--syn-spacing-small);
+  }
+
+  /* Change combobox border on hover */
+  .combobox:not(.combobox--disabled):hover .combobox__inputs {
+    border-color: var(--syn-input-color-hover);
+  }
+
+  /* Prefix and Suffix */
+
+  /* Small */
+  .combobox--small .combobox__prefix::slotted(*) {
+    margin-inline-end: var(--syn-spacing-x-small);
+  }
+
+  .combobox--small .combobox__suffix::slotted(*) {
+    margin-inline-start: var(--syn-spacing-x-small);
+  }
+
+  .combobox--medium .combobox__prefix::slotted(*) {
+    margin-inline-end: var(--syn-input-spacing-small);
+  }
+
+  .combobox--medium .combobox__suffix::slotted(*) {
+    margin-inline-start: var(--syn-input-spacing-small);
+  }
+
+  .combobox--large .combobox__prefix::slotted(*) {
+    margin-inline-end: var(--syn-input-spacing-medium);
+  }
+
+  .combobox--large .combobox__suffix::slotted(*) {
+    margin-inline-start: var(--syn-input-spacing-medium);
+  }
+
+  .combobox__prefix,
+  .combobox__suffix {
+    color: var(--syn-input-help-text-color);
+  }
+
+
+
+  /* Listbox */
+  .combobox__listbox {
+    /* @todo: Should be --syn-border-radius-medium, which should be set to 0 */
+    border-radius: var(--syn-border-radius-none);
+    box-shadow: var(--syn-shadow-medium);
+  }
+
+  /**
+   * Make sure to hide the syn-divider for the first syn-optgroup
+   * Note! ::slotted does currently not work with ::part, so we
+   * opted for using a css variable here.
+   */
+  .combobox__listbox ::slotted(syn-optgroup:first-of-type) {
+    --display-divider: none;
+  }
+`;
+
+export {
+  combobox_styles_default
+};
+//# sourceMappingURL=chunk.J2OXSQAK.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/combobox/combobox.styles.ts"],
+  "sourcesContent": ["/**\n * ---------------------------------------------------------------------\n * \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n * Removing this comment will prevent it from being managed by it.\n * ---------------------------------------------------------------------\n */\n\n/* eslint-disable */\nimport { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n  :host {\n    display: block;\n  }\n\n  /** The popup */\n  .combobox {\n    flex: 1 1 auto;\n    display: inline-flex;\n    width: 100%;\n    position: relative;\n    vertical-align: middle;\n  }\n\n  .combobox::part(popup) {\n    z-index: var(--syn-z-index-dropdown);\n  }\n\n  .combobox[data-current-placement^='top']::part(popup) {\n    transform-origin: bottom;\n  }\n\n  .combobox[data-current-placement^='bottom']::part(popup) {\n    transform-origin: top;\n  }\n\n  /* Combobox */\n  .combobox__inputs {\n    flex: 1;\n    display: flex;\n    width: 100%;\n    min-width: 0;\n    position: relative;\n    align-items: center;\n    justify-content: start;\n    font-family: var(--syn-input-font-family);\n    font-weight: var(--syn-input-font-weight);\n    letter-spacing: var(--syn-input-letter-spacing);\n    vertical-align: middle;\n    overflow: hidden;\n    cursor: pointer;\n    transition:\n      var(--syn-transition-fast) color,\n      var(--syn-transition-fast) border,\n      var(--syn-transition-fast) box-shadow,\n      var(--syn-transition-fast) background-color;\n  }\n\n  .combobox__display-input {\n    position: relative;\n    width: 100%;\n    font: inherit;\n    border: none;\n    background: none;\n    color: var(--syn-input-color);\n    cursor: inherit;\n    overflow: hidden;\n    padding: 0;\n    margin: 0;\n    -webkit-appearance: none;\n  }\n\n  .combobox__display-input::placeholder {\n    color: var(--syn-input-placeholder-color);\n  }\n\n  .combobox:not(.combobox--disabled):hover .combobox__display-input {\n    color: var(--syn-input-color-hover);\n  }\n\n  .combobox__display-input:focus {\n    outline: none;\n  }\n\n  .combobox__value-input {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    padding: 0;\n    margin: 0;\n    opacity: 0;\n    z-index: -1;\n  }\n\n  /* Standard combobox */\n  .combobox--standard .combobox__inputs {\n    background-color: var(--syn-input-background-color);\n    border: solid var(--syn-input-border-width) var(--syn-input-border-color);\n  }\n\n  .combobox--standard.combobox--disabled .combobox__inputs {\n    background-color: var(--syn-input-background-color-disabled);\n    border-color: var(--syn-input-border-color-disabled);\n    color: var(--syn-input-color-disabled);\n    opacity: 0.5;\n    cursor: not-allowed;\n    outline: none;\n  }\n\n  .combobox--standard:not(.combobox--disabled).combobox--open .combobox__inputs,\n  .combobox--standard:not(.combobox--disabled).combobox--focused .combobox__inputs {\n    background-color: var(--syn-input-background-color-focus);\n    border-color: var(--syn-input-border-color-focus);\n    box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-color);\n  }\n\n/* Sizes */\n  .combobox--small .combobox__inputs {\n    border-radius: var(--syn-input-border-radius-small);\n    font-size: var(--syn-input-font-size-small);\n    min-height: var(--syn-input-height-small);\n    padding-block: 0;\n    padding-inline: var(--syn-input-spacing-small);\n  }\n\n  .combobox--small .combobox__clear {\n    margin-inline-start: var(--syn-input-spacing-small);\n  }\n\n  .combobox--small .combobox__prefix::slotted(*) {\n    margin-inline-end: var(--syn-input-spacing-small);\n  }\n\n  .combobox--medium .combobox__inputs {\n    border-radius: var(--syn-input-border-radius-medium);\n    font-size: var(--syn-input-font-size-medium);\n    min-height: var(--syn-input-height-medium);\n    padding-block: 0;\n    padding-inline: var(--syn-input-spacing-medium);\n  }\n\n  .combobox--medium .combobox__clear {\n    margin-inline-start: var(--syn-input-spacing-medium);\n  }\n\n  .combobox--medium .combobox__prefix::slotted(*) {\n    margin-inline-end: var(--syn-input-spacing-medium);\n  }\n\n  .combobox--large .combobox__inputs {\n    border-radius: var(--syn-input-border-radius-large);\n    font-size: var(--syn-input-font-size-large);\n    min-height: var(--syn-input-height-large);\n    padding-block: 0;\n    padding-inline: var(--syn-input-spacing-large);\n  }\n\n  .combobox--large .combobox__clear {\n    margin-inline-start: var(--syn-input-spacing-large);\n  }\n\n  .combobox--large .combobox__prefix::slotted(*) {\n    margin-inline-end: var(--syn-input-spacing-large);\n  }\n\n/* Prefix */\n  .combobox__prefix {\n    flex: 0;\n    display: inline-flex;\n    align-items: center;\n    color: var(--syn-input-placeholder-color);\n  }\n\n  /* Suffix */\n  .combobox__suffix {\n    flex: 0;\n    display: inline-flex;\n    align-items: center;\n    color: var(--syn-input-placeholder-color);\n  }\n\n  /* Clear button */\n  .combobox__clear {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    font-size: inherit;\n    color: var(--syn-input-icon-color);\n    border: none;\n    background: none;\n    padding: 0;\n    transition: var(--syn-transition-fast) color;\n    cursor: pointer;\n  }\n\n  .combobox__clear:hover {\n    color: var(--syn-input-icon-color-hover);\n  }\n\n  .combobox__clear:focus {\n    outline: none;\n  }\n\n  /* Expand icon */\n  .combobox__expand-icon {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    transition: var(--syn-transition-medium) rotate ease;\n    rotate: 0;\n    margin-inline-start: var(--syn-spacing-small);\n  }\n\n  .combobox--open .combobox__expand-icon {\n    rotate: -180deg;\n  }\n\n  /* Listbox */\n  .combobox__listbox {\n    display: block;\n    position: relative;\n    font-family: var(--syn-font-sans);\n    font-size: var(--syn-font-size-medium);\n    font-weight: var(--syn-font-weight-normal);\n    box-shadow: var(--syn-shadow-large);\n    background: var(--syn-panel-background-color);\n    border: solid var(--syn-panel-border-width) var(--syn-panel-border-color);\n    border-radius: var(--syn-border-radius-medium);\n    padding-block: var(--syn-spacing-x-small);\n    padding-inline: 0;\n    overflow: auto;\n    overscroll-behavior: none;\n\n    /* Make sure it adheres to the popup's auto size */\n    max-width: var(--auto-size-available-width);\n    max-height: var(--auto-size-available-height);\n  }\n\n  .combobox__listbox ::slotted(syn-divider) {\n    --spacing: var(--syn-spacing-x-small);\n  }\n\n  .combobox__listbox ::slotted(small) {\n    display: block;\n    font-size: var(--syn-font-size-small);\n    font-weight: var(--syn-font-weight-semibold);\n    color: var(--syn-color-neutral-500);\n    padding-block: var(--syn-spacing-2x-small);\n    padding-inline: var(--syn-spacing-x-large);\n  }\n\n\n  /**\n   * Invalid user data\n   */\n  :host([data-user-invalid]) .combobox__inputs {\n    border-color: var(--syn-input-border-color-focus-error);\n  }\n\n  :host([data-user-invalid]) .combobox--standard:not(.combobox--disabled).combobox--open .combobox__inputs,\n  :host([data-user-invalid]) .combobox--standard:not(.combobox--disabled).combobox--focused .combobox__inputs {\n    border-color: var(--syn-input-border-color-focus-error);\n    box-shadow: 0 0 0 var(--syn-focus-ring-width) var(--syn-input-focus-ring-error);\n  }\n\n  /* Clear button */\n  .combobox__clear {\n    color: var(--syn-input-icon-icon-clearable-color);\n    font-size: var(--syn-spacing-large);\n  }\n\n  .combobox--small .combobox__clear {\n    font-size: var(--syn-spacing-medium);\n  }\n\n  .combobox--large .combobox__clear {\n    font-size: var(--syn-spacing-x-large);\n  }\n\n  .combobox--medium .combobox__clear {\n    margin-inline-start: var(--syn-spacing-small);\n  }\n\n  /* Expand icon */\n  .combobox__expand-icon {\n    color: var(--syn-color-neutral-950);\n    font-size: var(--syn-spacing-large);\n    margin-inline-start: var(--syn-spacing-small);\n  }\n\n  /* Change combobox border on hover */\n  .combobox:not(.combobox--disabled):hover .combobox__inputs {\n    border-color: var(--syn-input-color-hover);\n  }\n\n  /* Prefix and Suffix */\n\n  /* Small */\n  .combobox--small .combobox__prefix::slotted(*) {\n    margin-inline-end: var(--syn-spacing-x-small);\n  }\n\n  .combobox--small .combobox__suffix::slotted(*) {\n    margin-inline-start: var(--syn-spacing-x-small);\n  }\n\n  .combobox--medium .combobox__prefix::slotted(*) {\n    margin-inline-end: var(--syn-input-spacing-small);\n  }\n\n  .combobox--medium .combobox__suffix::slotted(*) {\n    margin-inline-start: var(--syn-input-spacing-small);\n  }\n\n  .combobox--large .combobox__prefix::slotted(*) {\n    margin-inline-end: var(--syn-input-spacing-medium);\n  }\n\n  .combobox--large .combobox__suffix::slotted(*) {\n    margin-inline-start: var(--syn-input-spacing-medium);\n  }\n\n  .combobox__prefix,\n  .combobox__suffix {\n    color: var(--syn-input-help-text-color);\n  }\n\n\n\n  /* Listbox */\n  .combobox__listbox {\n    /* @todo: Should be --syn-border-radius-medium, which should be set to 0 */\n    border-radius: var(--syn-border-radius-none);\n    box-shadow: var(--syn-shadow-medium);\n  }\n\n  /**\n   * Make sure to hide the syn-divider for the first syn-optgroup\n   * Note! ::slotted does currently not work with ::part, so we\n   * opted for using a css variable here.\n   */\n  .combobox__listbox ::slotted(syn-optgroup:first-of-type) {\n    --display-divider: none;\n  }\n`;\n"],
+  "mappings": ";AAQA,SAAS,WAAW;AAEpB,IAAO,0BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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.SEJ765XO.js → chunk.J44JFQKE.js}

@@ -1,15 +1,15 @@
 import {
   SynTag
-} from "./chunk.6ZGBHIAN.js";
+} from "./chunk.MSPUCOOE.js";
 import {
   select_custom_styles_default
-} from "./chunk.72HIKLQG.js";
+} from "./chunk.ZO4VONAT.js";
 import {
   select_styles_default
 } from "./chunk.35V3TAOT.js";
 import {
   SynPopup
-} from "./chunk.OTAHBVCK.js";
+} from "./chunk.A2JGI7YK.js";
 import {
   scrollIntoView
 } from "./chunk.5732DMBC.js";
@@ -39,7 +39,7 @@ import {
 } from "./chunk.WVVQK5TE.js";
 import {
   SynIcon
-} from "./chunk.5EJ2YM4D.js";
+} from "./chunk.HM57BJF5.js";
 import {
   LocalizeController
 } from "./chunk.ESQAXAFE.js";
@@ -49,7 +49,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.HQSCOWEI.js";
+} from "./chunk.POA3IDNG.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -766,4 +766,4 @@ setDefaultAnimation("select.hide", {
 export {
   SynSelect
 };
-//# sourceMappingURL=chunk.SEJ765XO.js.map
+//# sourceMappingURL=chunk.J44JFQKE.js.map

package/dist/chunks/{chunk.O5FATZG2.js → chunk.JI7DN44F.js}

@@ -1,6 +1,6 @@
 import {
   SynOptgroup
-} from "./chunk.YSJVZKXR.js";
+} from "./chunk.FIZMTZML.js";
 
 // src/components/optgroup/optgroup.ts
 var optgroup_default = SynOptgroup;
@@ -9,4 +9,4 @@ SynOptgroup.define("syn-optgroup");
 export {
   optgroup_default
 };
-//# sourceMappingURL=chunk.O5FATZG2.js.map
+//# sourceMappingURL=chunk.JI7DN44F.js.map

package/dist/chunks/{chunk.RD3OMAT5.js → chunk.KQTEJUZC.js}

@@ -1,6 +1,6 @@
 import {
   SynRadioButton
-} from "./chunk.2VUT3BL6.js";
+} from "./chunk.RC5BEOPA.js";
 
 // src/components/radio-button/radio-button.ts
 var radio_button_default = SynRadioButton;
@@ -9,4 +9,4 @@ SynRadioButton.define("syn-radio-button");
 export {
   radio_button_default
 };
-//# sourceMappingURL=chunk.RD3OMAT5.js.map
+//# sourceMappingURL=chunk.KQTEJUZC.js.map

package/dist/chunks/{chunk.GIBJ6FPQ.js → chunk.KTALTT2Z.js}

@@ -1,6 +1,6 @@
 import {
   SynTabGroup
-} from "./chunk.HPSPKQLI.js";
+} from "./chunk.3PECQYUM.js";
 
 // src/components/tab-group/tab-group.ts
 var tab_group_default = SynTabGroup;
@@ -9,4 +9,4 @@ SynTabGroup.define("syn-tab-group");
 export {
   tab_group_default
 };
-//# sourceMappingURL=chunk.GIBJ6FPQ.js.map
+//# sourceMappingURL=chunk.KTALTT2Z.js.map

package/dist/chunks/{chunk.6ZGBHIAN.js → chunk.MSPUCOOE.js}

@@ -1,19 +1,19 @@
-import {
-  tag_custom_styles_default
-} from "./chunk.B6R3IVGO.js";
 import {
   tag_styles_default
 } from "./chunk.6EPU7YUS.js";
+import {
+  tag_custom_styles_default
+} from "./chunk.B6R3IVGO.js";
 import {
   SynIconButton
-} from "./chunk.BCAVTKWB.js";
+} from "./chunk.EM53DV44.js";
 import {
   LocalizeController
 } from "./chunk.ESQAXAFE.js";
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.HQSCOWEI.js";
+} from "./chunk.POA3IDNG.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -76,4 +76,4 @@ __decorateClass([
 export {
   SynTag
 };
-//# sourceMappingURL=chunk.6ZGBHIAN.js.map
+//# sourceMappingURL=chunk.MSPUCOOE.js.map

package/dist/chunks/{chunk.JEUDRPFA.js → chunk.NB7DQIH4.js}

@@ -13,7 +13,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.HQSCOWEI.js";
+} from "./chunk.POA3IDNG.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -111,4 +111,4 @@ __decorateClass([
 export {
   SynBreadcrumbItem
 };
-//# sourceMappingURL=chunk.JEUDRPFA.js.map
+//# sourceMappingURL=chunk.NB7DQIH4.js.map

package/dist/chunks/{chunk.ASZAVTMB.js → chunk.NC25624J.js}

@@ -1,6 +1,6 @@
 import {
   SynDetails
-} from "./chunk.5GMJIKGV.js";
+} from "./chunk.EG2IMMFQ.js";
 
 // src/components/details/details.ts
 var details_default = SynDetails;
@@ -9,4 +9,4 @@ SynDetails.define("syn-details");
 export {
   details_default
 };
-//# sourceMappingURL=chunk.ASZAVTMB.js.map
+//# sourceMappingURL=chunk.NC25624J.js.map

package/dist/chunks/{chunk.27IBSVKG.js → chunk.OCZ6SNNW.js}

@@ -1,6 +1,6 @@
 import {
   SynPopup
-} from "./chunk.OTAHBVCK.js";
+} from "./chunk.A2JGI7YK.js";
 
 // src/components/popup/popup.ts
 var popup_default = SynPopup;
@@ -9,4 +9,4 @@ SynPopup.define("syn-popup");
 export {
   popup_default
 };
-//# sourceMappingURL=chunk.27IBSVKG.js.map
+//# sourceMappingURL=chunk.OCZ6SNNW.js.map

package/dist/chunks/{chunk.4TRRPM7T.js → chunk.OMUEASJV.js}

@@ -1,14 +1,14 @@
 import {
   SynTooltip
-} from "./chunk.ORZP7K64.js";
+} from "./chunk.DYYUQIA2.js";
+import {
+  range_styles_default
+} from "./chunk.277APOW3.js";
 import {
   arraysDiffer,
   getNormalizedValueFromClientX,
   numericSort
 } from "./chunk.236RSW67.js";
-import {
-  range_styles_default
-} from "./chunk.277APOW3.js";
 import {
   defaultValue
 } from "./chunk.RBG37CD4.js";
@@ -30,7 +30,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.HQSCOWEI.js";
+} from "./chunk.POA3IDNG.js";
 import {
   __decorateClass,
   __privateAdd,
@@ -633,4 +633,4 @@ __decorateClass([
 export {
   SynRange
 };
-//# sourceMappingURL=chunk.4TRRPM7T.js.map
+//# sourceMappingURL=chunk.OMUEASJV.js.map

package/dist/chunks/{chunk.BZ4XKZIO.js → chunk.OOSXOXEW.js}

@@ -1,29 +1,29 @@
-import {
-  prio_nav_styles_default
-} from "./chunk.74N5WLM5.js";
 import {
   filterOnlyNavItems,
   getAssignedElementsForSlot
 } from "./chunk.XNP4OTUB.js";
+import {
+  prio_nav_styles_default
+} from "./chunk.74N5WLM5.js";
 import {
   SynNavItem
-} from "./chunk.PBKQU2MD.js";
+} from "./chunk.W6DMUOGD.js";
 import {
   SynMenu
-} from "./chunk.PSO4P4GI.js";
+} from "./chunk.QA7ENF6T.js";
 import {
   SynDropdown
-} from "./chunk.K4MYBKIV.js";
+} from "./chunk.UUDEWIY2.js";
 import {
   SynIcon
-} from "./chunk.5EJ2YM4D.js";
+} from "./chunk.HM57BJF5.js";
 import {
   LocalizeController
 } from "./chunk.ESQAXAFE.js";
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.HQSCOWEI.js";
+} from "./chunk.POA3IDNG.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -205,4 +205,4 @@ __decorateClass([
 export {
   SynPrioNav
 };
-//# sourceMappingURL=chunk.BZ4XKZIO.js.map
+//# sourceMappingURL=chunk.OOSXOXEW.js.map

package/dist/chunks/{chunk.346JZFRN.js → chunk.P7BBVH4J.js}

@@ -1,19 +1,19 @@
+import {
+  dialog_styles_default
+} from "./chunk.MU43DZ7W.js";
 import {
   Modal
 } from "./chunk.XDM6VD32.js";
-import {
-  lockBodyScrolling,
-  unlockBodyScrolling
-} from "./chunk.5732DMBC.js";
 import {
   dialog_custom_styles_default
 } from "./chunk.IU3SSJZE.js";
 import {
-  dialog_styles_default
-} from "./chunk.MU43DZ7W.js";
+  lockBodyScrolling,
+  unlockBodyScrolling
+} from "./chunk.5732DMBC.js";
 import {
   SynIconButton
-} from "./chunk.BCAVTKWB.js";
+} from "./chunk.EM53DV44.js";
 import {
   waitForEvent
 } from "./chunk.C2ENQBPM.js";
@@ -37,7 +37,7 @@ import {
 import {
   SynergyElement,
   component_styles_default
-} from "./chunk.HQSCOWEI.js";
+} from "./chunk.POA3IDNG.js";
 import {
   __decorateClass
 } from "./chunk.2GFK6XTO.js";
@@ -287,4 +287,4 @@ setDefaultAnimation("dialog.overlay.hide", {
 export {
   SynDialog
 };
-//# sourceMappingURL=chunk.346JZFRN.js.map
+//# sourceMappingURL=chunk.P7BBVH4J.js.map

package/dist/chunks/{chunk.GTWZJL5P.js → chunk.P7HCXUSU.js}

@@ -1,6 +1,6 @@
 import {
   SynBadge
-} from "./chunk.3JNRTS6S.js";
+} from "./chunk.4OSD25EN.js";
 
 // src/components/badge/badge.ts
 var badge_default = SynBadge;
@@ -9,4 +9,4 @@ SynBadge.define("syn-badge");
 export {
   badge_default
 };
-//# sourceMappingURL=chunk.GTWZJL5P.js.map
+//# sourceMappingURL=chunk.P7HCXUSU.js.map

package/dist/chunks/{chunk.HQSCOWEI.js → chunk.POA3IDNG.js}

@@ -52,7 +52,7 @@ var SynergyElement = class extends LitElement {
 };
 /* eslint-disable */
 // @ts-expect-error This is auto-injected at build time.
-SynergyElement.version = "2.7.3";
+SynergyElement.version = "2.8.1";
 SynergyElement.dependencies = {};
 __decorateClass([
   property()
@@ -84,4 +84,4 @@ export {
   SynergyElement,
   component_styles_default
 };
-//# sourceMappingURL=chunk.HQSCOWEI.js.map
+//# sourceMappingURL=chunk.POA3IDNG.js.map