@synergy-design-system/components 3.6.0 → 3.6.1

package/dist/utilities/defaultSettings/functions.js

@@ -7,9 +7,9 @@ import {
   resetGlobalDefaultSettings,
   setDefaultSettingsForElement,
   setGlobalDefaultSettings
-} from "../../chunks/chunk.FQ6KKYNN.js";
-import "../../chunks/chunk.VMLERD3J.js";
+} from "../../chunks/chunk.RY3ZM7MQ.js";
 import "../../chunks/chunk.VL3GX6WV.js";
+import "../../chunks/chunk.VMLERD3J.js";
 import "../../chunks/chunk.QDG5AJZX.js";
 import "../../chunks/chunk.MO2GTRUM.js";
 export {

package/dist/utilities/defaultSettings/index.js

@@ -1,16 +1,16 @@
 import "../../chunks/chunk.RSCUHBW3.js";
 import {
   enableDefaultSettings
-} from "../../chunks/chunk.4BEGBAQD.js";
+} from "../../chunks/chunk.YACUYJZN.js";
 import {
   enableExperimentalSettingEmitEvents,
   enableSettingEmitEvents,
   resetGlobalDefaultSettings,
   setDefaultSettingsForElement,
   setGlobalDefaultSettings
-} from "../../chunks/chunk.FQ6KKYNN.js";
-import "../../chunks/chunk.VMLERD3J.js";
+} from "../../chunks/chunk.RY3ZM7MQ.js";
 import "../../chunks/chunk.VL3GX6WV.js";
+import "../../chunks/chunk.VMLERD3J.js";
 import "../../chunks/chunk.QDG5AJZX.js";
 import "../../chunks/chunk.MO2GTRUM.js";
 export {

package/dist/vscode.html-custom-data.json

@@ -33,6 +33,29 @@
         }
       ]
     },
+    {
+      "name": "syn-badge",
+      "description": "Badges are used to draw attention and display statuses or counts.\n---\n\n\n### **Slots:**\n - _default_ - The badge's content.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [
+        {
+          "name": "variant",
+          "description": "The badge's theme variant.",
+          "values": [
+            { "name": "primary" },
+            { "name": "success" },
+            { "name": "neutral" },
+            { "name": "warning" },
+            { "name": "danger" }
+          ]
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs"
+        }
+      ]
+    },
     {
       "name": "syn-alert",
       "description": "Alerts are used to display important messages inline or as toast notifications.\n---\n\n\n### **Events:**\n - **syn-show** - Emitted when the alert opens.\n- **syn-after-show** - Emitted after the alert opens and all animations are complete.\n- **syn-hide** - Emitted when the alert closes.\n- **syn-after-hide** - Emitted after the alert closes and all animations are complete.\n\n### **Methods:**\n - **show()** - Shows the alert.\n- **hide()** - Hides the alert\n- **toast()** - Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\ndismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\ncalling this method again. The returned promise will resolve after the alert is hidden.\n\n### **Slots:**\n - _default_ - The alert's main content.\n- **icon** - An icon to show in the alert. Works best with `<syn-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon** - The container that wraps the optional icon.\n- **message** - The container that wraps the alert's main content.\n- **close-button** - The close button, an `<syn-icon-button>`.\n- **close-button__base** - The close button's exported `base` part.",
@@ -80,29 +103,6 @@
         }
       ]
     },
-    {
-      "name": "syn-badge",
-      "description": "Badges are used to draw attention and display statuses or counts.\n---\n\n\n### **Slots:**\n - _default_ - The badge's content.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
-      "attributes": [
-        {
-          "name": "variant",
-          "description": "The badge's theme variant.",
-          "values": [
-            { "name": "primary" },
-            { "name": "success" },
-            { "name": "neutral" },
-            { "name": "warning" },
-            { "name": "danger" }
-          ]
-        }
-      ],
-      "references": [
-        {
-          "name": "Documentation",
-          "url": "https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs"
-        }
-      ]
-    },
     {
       "name": "syn-breadcrumb",
       "description": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n---\n\n\n### **Slots:**\n - _default_ - One or more breadcrumb items to display.\n- **separator** - The separator to use between breadcrumb items. Works best with `<syn-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",

package/package.json

@@ -4,7 +4,7 @@
     "url": "https://www.sick.com"
   },
   "name": "@synergy-design-system/components",
-  "version": "3.6.0",
+  "version": "3.6.1",
   "description": "",
   "repository": {
     "type": "git",
@@ -94,8 +94,8 @@
     "stylelint": "^17.3.0",
     "typescript": "~5.9.3",
     "@synergy-design-system/eslint-config-syn": "0.1.0",
-    "@synergy-design-system/tokens": "3.6.0",
-    "@synergy-design-system/stylelint-config-syn": "0.1.0"
+    "@synergy-design-system/stylelint-config-syn": "0.1.0",
+    "@synergy-design-system/tokens": "3.6.1"
   },
   "dependencies": {
     "@floating-ui/dom": "^1.7.5",
@@ -105,7 +105,7 @@
     "lit": "^3.3.2"
   },
   "peerDependencies": {
-    "@synergy-design-system/tokens": "3.6.0"
+    "@synergy-design-system/tokens": "3.6.1"
   },
   "customElements": "dist/custom-elements.json",
   "scripts": {

package/dist/chunks/chunk.2KYFCKCK.js

@@ -1,10 +0,0 @@
-// src/components/dropdown/dropdown.custom.styles.ts
-import { css } from "lit";
-var dropdown_custom_styles_default = css`
-  /* Write custom CSS here */
-`;
-
-export {
-  dropdown_custom_styles_default
-};
-//# sourceMappingURL=chunk.2KYFCKCK.js.map

package/dist/chunks/chunk.2KYFCKCK.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/dropdown/dropdown.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  /* Write custom CSS here */\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,iCAAQ;AAAA;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.3IQ2QEPZ.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/menu/menu.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host {\n    border-radius: var(--syn-input-border-radius-medium);\n  }\n\n  /*\n   * #368: Hide the checkmarks for menu items\n   * when no syn-menu-item[checkbox] or loading is present\n   */\n  .menu--no-checkmarks::slotted(syn-menu-item) {\n    --display-checkmark: none;\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  ::slotted(syn-menu-label:first-of-type) {\n    --display-divider: none;\n  }\n\n  ::slotted(syn-divider) {\n    /* #369: Slotted syn-dividers should use a lighter color so they do not crash with the border visually */\n    --color: var(--syn-panel-border-color);\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,6BAAQ;AAAA;AAAA;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.GZHQAHOL.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/menu-label/menu-label.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host {\n    --display-divider: block;\n  }\n\n  .menu-label__divider {\n    --spacing: 0;\n\n    display: var(--display-divider);\n    margin-bottom: var(--syn-spacing-x-small);\n  }\n\n  .menu-label {\n    color: var(--syn-input-color);\n    font-family: var(--syn-font-sans);\n    font-size: var(--syn-font-size-medium);\n    font-weight: var(--syn-font-weight-semibold);\n    letter-spacing: var(--syn-letter-spacing-normal);\n    line-height: var(--syn-line-height-normal);\n    padding: var(--syn-spacing-small) var(--syn-spacing-medium);\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,mCAAQ;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.JILCM7FD.js

@@ -1,26 +0,0 @@
-// src/components/menu-label/menu-label.styles.ts
-import { css } from "lit";
-var menu_label_styles_default = css`
-	/* stylelint-disable */
-  :host {
-    display: block;
-  }
-
-  .menu-label {
-    display: inline-block;
-    font-family: var(--syn-font-sans);
-    font-size: var(--syn-font-size-small);
-    font-weight: var(--syn-font-weight-semibold);
-    line-height: var(--syn-line-height-normal);
-    letter-spacing: var(--syn-letter-spacing-normal);
-    color: var(--syn-color-neutral-500);
-    padding: var(--syn-spacing-2x-small) var(--syn-spacing-x-large);
-    user-select: none;
-    -webkit-user-select: none;
-  }
-`;
-
-export {
-  menu_label_styles_default
-};
-//# sourceMappingURL=chunk.JILCM7FD.js.map

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/menu-label/menu-label.styles.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport { css } from 'lit';\nexport default css`\n\t/* stylelint-disable */\n  :host {\n    display: block;\n  }\n\n  .menu-label {\n    display: inline-block;\n    font-family: var(--syn-font-sans);\n    font-size: var(--syn-font-size-small);\n    font-weight: var(--syn-font-weight-semibold);\n    line-height: var(--syn-line-height-normal);\n    letter-spacing: var(--syn-letter-spacing-normal);\n    color: var(--syn-color-neutral-500);\n    padding: var(--syn-spacing-2x-small) var(--syn-spacing-x-large);\n    user-select: none;\n    -webkit-user-select: none;\n  }\n`;\n"],
-  "mappings": ";AACA,SAAS,WAAW;AACpB,IAAO,4BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/menu/menu.component.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport { html } from 'lit';\nimport { query } from 'lit/decorators.js';\nimport { state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport type { SynAttributesChangedEvent } from '../../events/syn-attributes-changed.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './menu.styles.js';\nimport customStyles from './menu.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type SynMenuItem from '../menu-item/menu-item.component.js';\n\nexport interface MenuSelectEventDetail {\n  item: SynMenuItem;\n}\n\n/**\n * @summary Menus provide a list of options for the user to choose from.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-menu--docs\n * @status stable\n * @since 2.0\n *\n * @slot - The menu's content, including menu items, menu labels, and dividers.\n *\n * @event {{ item: SynMenuItem }} syn-select - Emitted when a menu item is selected.\n */\nexport default class SynMenu extends SynergyElement {\n  static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n\n  @query('slot') defaultSlot: HTMLSlotElement;\n  @state() hasMenuItemsWithCheckmarks = false;\n\n  private handleUpdateCheckmarks(items: SynMenuItem[]) {\n    // #368: Treat a menu as having checkmarks if it has any checkboxes or items with loading states\n    // The loading indicator has to be checked as well, as it's specially placed over the check mark\n    this.hasMenuItemsWithCheckmarks = items.some(item => item.type === 'checkbox' || item.loading);  \n  }\n\n  private updateCheckMarksByChildPropChange = (e: SynAttributesChangedEvent) => {\n    e.stopImmediatePropagation();\n    this.handleUpdateCheckmarks(this.getAllItems());\n  };\n  \n  disconnectedCallback() {\n    this.removeEventListener('syn-attributes-changed', this.updateCheckMarksByChildPropChange);\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'menu');\n    this.addEventListener('syn-attributes-changed', this.updateCheckMarksByChildPropChange);\n  }\n\n  private handleClick(event: MouseEvent) {\n    const menuItemTypes = ['menuitem', 'menuitemcheckbox'];\n\n    const composedPath = event.composedPath();\n    const target = composedPath.find((el: Element) => menuItemTypes.includes(el?.getAttribute?.('role') || ''));\n\n    if (!target) return;\n\n    const closestMenu = composedPath.find((el: Element) => el?.getAttribute?.('role') === 'menu');\n    const clickHasSubmenu = closestMenu !== this;\n\n    // Make sure we're the menu thats supposed to be handling the click event.\n    if (clickHasSubmenu) return;\n\n    // This isn't true. But we use it for TypeScript checks below.\n    const item = target as SynMenuItem;\n\n    if (item.type === 'checkbox') {\n      item.checked = !item.checked;\n    }\n\n    this.emit('syn-select', { detail: { item } });\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    // Make a selection when pressing enter or space\n    if (event.key === 'Enter' || event.key === ' ') {\n      const item = this.getCurrentItem();\n      event.preventDefault();\n      event.stopPropagation();\n\n      // Simulate a click to support @click handlers on menu items that also work with the keyboard\n      item?.click();\n    }\n\n    // Move the selection when pressing down or up\n    else if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n      const items = this.getAllItems();\n      const activeItem = this.getCurrentItem();\n      let index = activeItem ? items.indexOf(activeItem) : 0;\n\n      if (items.length > 0) {\n        event.preventDefault();\n        event.stopPropagation();\n\n        if (event.key === 'ArrowDown') {\n          index++;\n        } else if (event.key === 'ArrowUp') {\n          index--;\n        } else if (event.key === 'Home') {\n          index = 0;\n        } else if (event.key === 'End') {\n          index = items.length - 1;\n        }\n\n        if (index < 0) {\n          index = items.length - 1;\n        }\n        if (index > items.length - 1) {\n          index = 0;\n        }\n\n        this.setCurrentItem(items[index]);\n        items[index].focus();\n      }\n    }\n  }\n\n  private handleMouseDown(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n\n    if (this.isMenuItem(target)) {\n      this.setCurrentItem(target as SynMenuItem);\n    }\n  }\n\n  private handleSlotChange() {\n    const items = this.getAllItems();\n    this.handleUpdateCheckmarks(items);\n\n    // Reset the roving tab index when the slotted items change\n    if (items.length > 0) {\n      this.setCurrentItem(items[0]);\n    }\n  }\n\n  private isMenuItem(item: HTMLElement) {\n    return (\n      item.tagName.toLowerCase() === 'syn-menu-item' ||\n      ['menuitem', 'menuitemcheckbox', 'menuitemradio'].includes(item.getAttribute('role') ?? '')\n    );\n  }\n\n  /** @internal Gets all slotted menu items, ignoring dividers, headers, and other elements. */\n  getAllItems() {\n    return [...this.defaultSlot.assignedElements({ flatten: true })].filter((el: HTMLElement) => {\n      if (el.inert || !this.isMenuItem(el)) {\n        return false;\n      }\n      return true;\n    }) as SynMenuItem[];\n  }\n\n  /**\n   * @internal Gets the current menu item, which is the menu item that has `tabindex=\"0\"` within the roving tab index.\n   * The menu item may or may not have focus, but for keyboard interaction purposes it's considered the \"active\" item.\n   */\n  getCurrentItem() {\n    return this.getAllItems().find(i => i.getAttribute('tabindex') === '0');\n  }\n\n  /**\n   * @internal Sets the current menu item to the specified element. This sets `tabindex=\"0\"` on the target element and\n   * `tabindex=\"-1\"` to all other items. This method must be called prior to setting focus on a menu item.\n   */\n  setCurrentItem(item: SynMenuItem) {\n    const items = this.getAllItems();\n\n    // Update tab indexes\n    items.forEach(i => {\n      i.setAttribute('tabindex', i === item ? '0' : '-1');\n    });\n  }\n\n  render() {\n    return html`\n      <slot\n        class=${classMap({\n          'menu--no-checkmarks': !this.hasMenuItemsWithCheckmarks,\n        })}\n        @slotchange=${this.handleSlotChange}\n        @click=${this.handleClick}\n        @keydown=${this.handleKeyDown}\n        @mousedown=${this.handleMouseDown}\n      ></slot>\n    `;\n  }\n}\n"],
-  "mappings": "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",
-  "names": []
-}

package/dist/chunks/chunk.N7HN275B.js

@@ -1,161 +0,0 @@
-// src/components/menu-item/menu-item.styles.ts
-import { css } from "lit";
-var menu_item_styles_default = css`
-	/* stylelint-disable */
-  :host {
-    --submenu-offset: -2px;
-
-    display: block;
-  }
-
-  :host([inert]) {
-    display: none;
-  }
-
-  .menu-item {
-    position: relative;
-    display: flex;
-    align-items: stretch;
-    font-family: var(--syn-font-sans);
-    font-size: var(--syn-font-size-medium);
-    font-weight: var(--syn-font-weight-normal);
-    line-height: var(--syn-line-height-normal);
-    letter-spacing: var(--syn-letter-spacing-normal);
-    color: var(--syn-color-neutral-700);
-    padding: var(--syn-spacing-2x-small) var(--syn-spacing-2x-small);
-    transition: var(--syn-transition-fast) fill;
-    user-select: none;
-    -webkit-user-select: none;
-    white-space: nowrap;
-    cursor: pointer;
-  }
-
-  .menu-item.menu-item--disabled {
-    outline: none;
-    opacity: 0.5;
-    cursor: not-allowed;
-  }
-
-  .menu-item.menu-item--loading {
-    outline: none;
-    cursor: wait;
-  }
-
-  .menu-item.menu-item--loading *:not(syn-spinner) {
-    opacity: 0.5;
-  }
-
-  .menu-item--loading syn-spinner {
-    --indicator-color: currentColor;
-    --track-width: 1px;
-    position: absolute;
-    font-size: 0.75em;
-    top: calc(50% - 0.5em);
-    left: 0.65rem;
-    opacity: 1;
-  }
-
-  .menu-item .menu-item__label {
-    flex: 1 1 auto;
-    display: inline-block;
-    text-overflow: ellipsis;
-    overflow: hidden;
-  }
-
-  .menu-item .menu-item__prefix {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-  }
-
-  .menu-item .menu-item__prefix::slotted(*) {
-    margin-inline-end: var(--syn-spacing-x-small);
-  }
-
-  .menu-item .menu-item__suffix {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-  }
-
-  .menu-item .menu-item__suffix::slotted(*) {
-    margin-inline-start: var(--syn-spacing-x-small);
-  }
-
-  /* Safe triangle */
-  .menu-item--submenu-expanded::after {
-    content: '';
-    position: fixed;
-    z-index: calc(var(--syn-z-index-dropdown) - 1);
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    clip-path: polygon(
-      var(--safe-triangle-cursor-x, 0) var(--safe-triangle-cursor-y, 0),
-      var(--safe-triangle-submenu-start-x, 0) var(--safe-triangle-submenu-start-y, 0),
-      var(--safe-triangle-submenu-end-x, 0) var(--safe-triangle-submenu-end-y, 0)
-    );
-  }
-
-  :host(:focus-visible) {
-    outline: none;
-  }
-
-  :host(:hover:not([aria-disabled='true'], :focus-visible)) .menu-item,
-  .menu-item--submenu-expanded {
-    background-color: var(--syn-color-neutral-100);
-    color: var(--syn-color-neutral-1000);
-  }
-
-  :host(:focus-visible) .menu-item {
-    outline: none;
-    background-color: var(--syn-color-primary-600);
-    color: var(--syn-color-neutral-0);
-    opacity: 1;
-  }
-
-  .menu-item .menu-item__check,
-  .menu-item .menu-item__chevron {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 1.5em;
-    visibility: hidden;
-  }
-
-  .menu-item--checked .menu-item__check,
-  .menu-item--has-submenu .menu-item__chevron {
-    visibility: visible;
-  }
-
-  /* Add elevation and z-index to submenus */
-  syn-popup::part(popup) {
-    box-shadow: var(--syn-shadow-large);
-    z-index: var(--syn-z-index-dropdown);
-    margin-left: var(--submenu-offset);
-  }
-
-  .menu-item--rtl syn-popup::part(popup) {
-    margin-left: calc(-1 * var(--submenu-offset));
-  }
-
-  @media (forced-colors: active) {
-    :host(:hover:not([aria-disabled='true'])) .menu-item,
-    :host(:focus-visible) .menu-item {
-      outline: dashed 1px SelectedItem;
-      outline-offset: -1px;
-    }
-  }
-
-  ::slotted(syn-menu) {
-    max-width: var(--auto-size-available-width) !important;
-    max-height: var(--auto-size-available-height) !important;
-  }
-`;
-
-export {
-  menu_item_styles_default
-};
-//# sourceMappingURL=chunk.N7HN275B.js.map

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/menu-item/menu-item.styles.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n  :host {\n    --submenu-offset: -2px;\n\n    display: block;\n  }\n\n  :host([inert]) {\n    display: none;\n  }\n\n  .menu-item {\n    position: relative;\n    display: flex;\n    align-items: stretch;\n    font-family: var(--syn-font-sans);\n    font-size: var(--syn-font-size-medium);\n    font-weight: var(--syn-font-weight-normal);\n    line-height: var(--syn-line-height-normal);\n    letter-spacing: var(--syn-letter-spacing-normal);\n    color: var(--syn-color-neutral-700);\n    padding: var(--syn-spacing-2x-small) var(--syn-spacing-2x-small);\n    transition: var(--syn-transition-fast) fill;\n    user-select: none;\n    -webkit-user-select: none;\n    white-space: nowrap;\n    cursor: pointer;\n  }\n\n  .menu-item.menu-item--disabled {\n    outline: none;\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .menu-item.menu-item--loading {\n    outline: none;\n    cursor: wait;\n  }\n\n  .menu-item.menu-item--loading *:not(syn-spinner) {\n    opacity: 0.5;\n  }\n\n  .menu-item--loading syn-spinner {\n    --indicator-color: currentColor;\n    --track-width: 1px;\n    position: absolute;\n    font-size: 0.75em;\n    top: calc(50% - 0.5em);\n    left: 0.65rem;\n    opacity: 1;\n  }\n\n  .menu-item .menu-item__label {\n    flex: 1 1 auto;\n    display: inline-block;\n    text-overflow: ellipsis;\n    overflow: hidden;\n  }\n\n  .menu-item .menu-item__prefix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__prefix::slotted(*) {\n    margin-inline-end: var(--syn-spacing-x-small);\n  }\n\n  .menu-item .menu-item__suffix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .menu-item .menu-item__suffix::slotted(*) {\n    margin-inline-start: var(--syn-spacing-x-small);\n  }\n\n  /* Safe triangle */\n  .menu-item--submenu-expanded::after {\n    content: '';\n    position: fixed;\n    z-index: calc(var(--syn-z-index-dropdown) - 1);\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    clip-path: polygon(\n      var(--safe-triangle-cursor-x, 0) var(--safe-triangle-cursor-y, 0),\n      var(--safe-triangle-submenu-start-x, 0) var(--safe-triangle-submenu-start-y, 0),\n      var(--safe-triangle-submenu-end-x, 0) var(--safe-triangle-submenu-end-y, 0)\n    );\n  }\n\n  :host(:focus-visible) {\n    outline: none;\n  }\n\n  :host(:hover:not([aria-disabled='true'], :focus-visible)) .menu-item,\n  .menu-item--submenu-expanded {\n    background-color: var(--syn-color-neutral-100);\n    color: var(--syn-color-neutral-1000);\n  }\n\n  :host(:focus-visible) .menu-item {\n    outline: none;\n    background-color: var(--syn-color-primary-600);\n    color: var(--syn-color-neutral-0);\n    opacity: 1;\n  }\n\n  .menu-item .menu-item__check,\n  .menu-item .menu-item__chevron {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1.5em;\n    visibility: hidden;\n  }\n\n  .menu-item--checked .menu-item__check,\n  .menu-item--has-submenu .menu-item__chevron {\n    visibility: visible;\n  }\n\n  /* Add elevation and z-index to submenus */\n  syn-popup::part(popup) {\n    box-shadow: var(--syn-shadow-large);\n    z-index: var(--syn-z-index-dropdown);\n    margin-left: var(--submenu-offset);\n  }\n\n  .menu-item--rtl syn-popup::part(popup) {\n    margin-left: calc(-1 * var(--submenu-offset));\n  }\n\n  @media (forced-colors: active) {\n    :host(:hover:not([aria-disabled='true'])) .menu-item,\n    :host(:focus-visible) .menu-item {\n      outline: dashed 1px SelectedItem;\n      outline-offset: -1px;\n    }\n  }\n\n  ::slotted(syn-menu) {\n    max-width: var(--auto-size-available-width) !important;\n    max-height: var(--auto-size-available-height) !important;\n  }\n`;\n"],
-  "mappings": ";AACA,SAAS,WAAW;AAEpB,IAAO,2BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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.NIQMC4FW.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/menu-label/menu-label.component.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport { html } from 'lit';\nimport SynDivider from '../divider/divider.component.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './menu-label.styles.js';\nimport customStyles from './menu-label.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Menu labels are used to describe a group of menu items.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-menu-label--docs\n * @status stable\n * @since 2.0\n *\n * @slot - The menu label's content.\n *\n * @csspart base - The component's base wrapper.\n * @csspart divider - The divider that is displayed above the content\n * @csspart label - The label that is displayed below the divider\n *\n * @dependency syn-divider\n *\n * @cssproperty --display-divider - Display property of the divider. Defaults to \"block\"\n */\nexport default class SynMenuLabel extends SynergyElement {\n  static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n\n  static dependencies = {\n    'syn-divider': SynDivider,\n  };\n    \n  render() {\n    return html`\n      <div part=\"base\" class=\"menu-label-wrapper\">\n        <syn-divider class=\"menu-label__divider\" part=\"divider\"></syn-divider>\n        <slot part=\"label\" class=\"menu-label\"></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'syn-menu-label': SynMenuLabel;\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;AACA,SAAS,YAAY;AAwBrB,IAAqB,eAArB,cAA0C,eAAe;AAAA,EAOvD,SAAS;AACP,WAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMT;AACF;AAfqB,aACZ,SAAyB,CAAC,0BAAiB,2BAAQ,gCAAY;AADnD,aAGZ,eAAe;AAAA,EACpB,eAAe;AACjB;",
-  "names": []
-}

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/dropdown/dropdown.component.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport { animateTo, stopAnimations } from '../../internal/animate.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js';\nimport { getDeepestActiveElement } from '../../internal/active-elements.js';\nimport { getTabbableBoundary } from '../../internal/tabbable.js';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query } from 'lit/decorators.js';\nimport { waitForEvent } from '../../internal/event.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynPopup from '../popup/popup.component.js';\nimport styles from './dropdown.styles.js';\nimport customStyles from './dropdown.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type { SynSelectEvent } from '../../events/syn-select.js';\nimport type SynButton from '../button/button.js';\nimport type SynIconButton from '../icon-button/icon-button.js';\nimport type SynMenu from '../menu/menu.js';\n\n/**\n * @summary Dropdowns expose additional content that \"drops down\" in a panel.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-dropdown--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-popup\n *\n * @slot - The dropdown's main content.\n * @slot trigger - The dropdown's trigger, usually a `<syn-button>` element.\n *\n * @event syn-show - Emitted when the dropdown opens.\n * @event syn-after-show - Emitted after the dropdown opens and all animations are complete.\n * @event syn-hide - Emitted when the dropdown closes.\n * @event syn-after-hide - Emitted after the dropdown closes and all animations are complete.\n *\n * @csspart base - The component's base wrapper, an `<syn-popup>` element.\n * @csspart base__popup - The popup's exported `popup` part. Use this to target the tooltip's popup container.\n * @csspart trigger - The container that wraps the trigger.\n * @csspart panel - The panel that gets shown when the dropdown is open.\n *\n * @animation dropdown.show - The animation to use when showing the dropdown.\n * @animation dropdown.hide - The animation to use when hiding the dropdown.\n */\nexport default class SynDropdown extends SynergyElement {\n  static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n  static dependencies = { 'syn-popup': SynPopup };\n\n  @query('.dropdown') popup: SynPopup;\n  @query('.dropdown__trigger') trigger: HTMLSlotElement;\n  @query('.dropdown__panel') panel: HTMLSlotElement;\n\n  private readonly localize = new LocalizeController(this);\n  private closeWatcher: CloseWatcher | null;\n\n  /**\n   * Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you\n   * can use the `show()` and `hide()` methods and this attribute will reflect the dropdown's open state.\n   */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /**\n   * The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n   * inside of the viewport.\n   */\n  @property({ reflect: true }) placement:\n    | 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end' = 'bottom-start';\n\n  /** Disables the dropdown so the panel will not open. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /**\n   * By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\n   * dropdowns that allow for multiple interactions.\n   */\n  @property({ attribute: 'stay-open-on-select', type: Boolean, reflect: true }) stayOpenOnSelect = false;\n\n  /**\n   * The dropdown will close when the user interacts outside of this element (e.g. clicking). Useful for composing other\n   * components that use a dropdown internally.\n   */\n  @property({ attribute: false }) containingElement?: HTMLElement;\n\n  /** The distance in pixels from which to offset the panel away from its trigger. */\n  @property({ type: Number }) distance = 0;\n\n  /** The distance in pixels from which to offset the panel along its trigger. */\n  @property({ type: Number }) skidding = 0;\n\n  /**\n   * Syncs the popup width or height to that of the trigger element.\n   */\n  @property({ reflect: true }) sync: 'width' | 'height' | 'both' | undefined = undefined;\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    if (!this.containingElement) {\n      this.containingElement = this;\n    }\n  }\n\n  firstUpdated() {\n    this.panel.hidden = !this.open;\n\n    // If the dropdown is visible on init, update its position\n    if (this.open) {\n      this.addOpenListeners();\n      this.popup.active = true;\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeOpenListeners();\n    this.hide();\n  }\n\n  focusOnTrigger() {\n    const trigger = this.trigger.assignedElements({ flatten: true })[0] as HTMLElement | undefined;\n    if (typeof trigger?.focus === 'function') {\n      trigger.focus();\n    }\n  }\n\n  getMenu() {\n    return this.panel.assignedElements({ flatten: true }).find(el => el.tagName.toLowerCase() === 'syn-menu') as\n      | SynMenu\n      | undefined;\n  }\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    // Close when escape is pressed inside an open dropdown. We need to listen on the panel itself and stop propagation\n    // in case any ancestors are also listening for this key.\n    if (this.open && event.key === 'Escape') {\n      event.stopPropagation();\n      this.hide();\n      this.focusOnTrigger();\n    }\n  };\n\n  private handleDocumentKeyDown = (event: KeyboardEvent) => {\n    // Close when escape or tab is pressed\n    if (event.key === 'Escape' && this.open && !this.closeWatcher) {\n      event.stopPropagation();\n      this.focusOnTrigger();\n      this.hide();\n      return;\n    }\n\n    // Handle tabbing\n    if (event.key === 'Tab') {\n      // Tabbing within an open menu should close the dropdown and refocus the trigger\n      if (this.open && document.activeElement?.tagName.toLowerCase() === 'syn-menu-item') {\n        event.preventDefault();\n        this.hide();\n        this.focusOnTrigger();\n        return;\n      }\n\n      const computeClosestContaining = (element: Element | null | undefined, tagName: string): Element | null => {\n        if (!element) return null;\n\n        const closest = element.closest(tagName);\n        if (closest) return closest;\n\n        const rootNode = element.getRootNode();\n        if (rootNode instanceof ShadowRoot) {\n          return computeClosestContaining(rootNode.host, tagName);\n        }\n\n        return null;\n      };\n\n      // Tabbing outside of the containing element closes the panel\n      //\n      // If the dropdown is used within a shadow DOM, we need to obtain the activeElement within that shadowRoot,\n      // otherwise `document.activeElement` will only return the name of the parent shadow DOM element.\n      setTimeout(() => {\n        const activeElement =\n          this.containingElement?.getRootNode() instanceof ShadowRoot\n            ? getDeepestActiveElement()\n            : document.activeElement;\n\n        if (\n          !this.containingElement ||\n          computeClosestContaining(activeElement, this.containingElement.tagName.toLowerCase()) !==\n            this.containingElement\n        ) {\n          this.hide();\n        }\n      });\n    }\n  };\n\n  private handleDocumentMouseDown = (event: MouseEvent) => {\n    // Close when clicking outside of the containing element\n    const path = event.composedPath();\n    if (this.containingElement && !path.includes(this.containingElement)) {\n      this.hide();\n    }\n  };\n\n  private handlePanelSelect = (event: SynSelectEvent) => {\n    const target = event.target as HTMLElement;\n\n    // Hide the dropdown when a menu item is selected\n    if (!this.stayOpenOnSelect && target.tagName.toLowerCase() === 'syn-menu') {\n      this.hide();\n      this.focusOnTrigger();\n    }\n  };\n\n  handleTriggerClick() {\n    if (this.open) {\n      this.hide();\n    } else {\n      this.show();\n      this.focusOnTrigger();\n    }\n  }\n\n  async handleTriggerKeyDown(event: KeyboardEvent) {\n    // When spacebar/enter is pressed, show the panel but don't focus on the menu. This let's the user press the same\n    // key again to hide the menu in case they don't want to make a selection.\n    if ([' ', 'Enter'].includes(event.key)) {\n      event.preventDefault();\n      this.handleTriggerClick();\n      return;\n    }\n\n    const menu = this.getMenu();\n\n    if (menu) {\n      const menuItems = menu.getAllItems();\n      const firstMenuItem = menuItems[0];\n      const lastMenuItem = menuItems[menuItems.length - 1];\n\n      // When up/down is pressed, we make the assumption that the user is familiar with the menu and plans to make a\n      // selection. Rather than toggle the panel, we focus on the menu (if one exists) and activate the first item for\n      // faster navigation.\n      if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n        event.preventDefault();\n\n        // Show the menu if it's not already open\n        if (!this.open) {\n          this.show();\n\n          // Wait for the dropdown to open before focusing, but not the animation\n          await this.updateComplete;\n        }\n\n        if (menuItems.length > 0) {\n          // Focus on the first/last menu item after showing\n          this.updateComplete.then(() => {\n            if (event.key === 'ArrowDown' || event.key === 'Home') {\n              menu.setCurrentItem(firstMenuItem);\n              firstMenuItem.focus();\n            }\n\n            if (event.key === 'ArrowUp' || event.key === 'End') {\n              menu.setCurrentItem(lastMenuItem);\n              lastMenuItem.focus();\n            }\n          });\n        }\n      }\n    }\n  }\n\n  handleTriggerKeyUp(event: KeyboardEvent) {\n    // Prevent space from triggering a click event in Firefox\n    if (event.key === ' ') {\n      event.preventDefault();\n    }\n  }\n\n  handleTriggerSlotChange() {\n    this.updateAccessibleTrigger();\n  }\n\n  //\n  // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n  // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n  // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n  // a child of the slotted element, or an element in the slotted element's shadow root.\n  //\n  // For example, the accessible trigger of an <syn-button> is a <button> located inside its shadow root.\n  //\n  // To determine this, we assume the first tabbable element in the trigger slot is the \"accessible trigger.\"\n  //\n  updateAccessibleTrigger() {\n    const assignedElements = this.trigger.assignedElements({ flatten: true }) as HTMLElement[];\n    const accessibleTrigger = assignedElements.find(el => getTabbableBoundary(el).start);\n    let target: HTMLElement;\n\n    if (accessibleTrigger) {\n      switch (accessibleTrigger.tagName.toLowerCase()) {\n        // Synergy buttons have to update the internal button so it's announced correctly by screen readers\n        case 'syn-button':\n        case 'syn-icon-button':\n          target = (accessibleTrigger as SynButton | SynIconButton).button;\n          break;\n\n        default:\n          target = accessibleTrigger;\n      }\n\n      target.setAttribute('aria-haspopup', 'true');\n      target.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n    }\n  }\n\n  /** Shows the dropdown panel. */\n  async show() {\n    if (this.open) {\n      return undefined;\n    }\n\n    this.open = true;\n    return waitForEvent(this, 'syn-after-show');\n  }\n\n  /** Hides the dropdown panel */\n  async hide() {\n    if (!this.open) {\n      return undefined;\n    }\n\n    this.open = false;\n    return waitForEvent(this, 'syn-after-hide');\n  }\n\n  /**\n   * Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu\n   * is activated.\n   */\n  reposition() {\n    this.popup.reposition();\n  }\n\n  addOpenListeners() {\n    this.panel.addEventListener('syn-select', this.handlePanelSelect);\n    if ('CloseWatcher' in window) {\n      this.closeWatcher?.destroy();\n      this.closeWatcher = new CloseWatcher();\n      this.closeWatcher.onclose = () => {\n        this.hide();\n        this.focusOnTrigger();\n      };\n    } else {\n      this.panel.addEventListener('keydown', this.handleKeyDown);\n    }\n    document.addEventListener('keydown', this.handleDocumentKeyDown);\n    document.addEventListener('mousedown', this.handleDocumentMouseDown);\n  }\n\n  removeOpenListeners() {\n    if (this.panel) {\n      this.panel.removeEventListener('syn-select', this.handlePanelSelect);\n      this.panel.removeEventListener('keydown', this.handleKeyDown);\n    }\n    document.removeEventListener('keydown', this.handleDocumentKeyDown);\n    document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n    this.closeWatcher?.destroy();\n  }\n\n  @watch('open', { waitUntilFirstUpdate: true })\n  async handleOpenChange() {\n    if (this.disabled) {\n      this.open = false;\n      return;\n    }\n\n    this.updateAccessibleTrigger();\n\n    if (this.open) {\n      // Show\n      this.emit('syn-show');\n      this.addOpenListeners();\n\n      await stopAnimations(this);\n      this.panel.hidden = false;\n      this.popup.active = true;\n      const { keyframes, options } = getAnimation(this, 'dropdown.show', { dir: this.localize.dir() });\n      await animateTo(this.popup.popup, keyframes, options);\n\n      this.emit('syn-after-show');\n    } else {\n      // Hide\n      this.emit('syn-hide');\n      this.removeOpenListeners();\n\n      await stopAnimations(this);\n      const { keyframes, options } = getAnimation(this, 'dropdown.hide', { dir: this.localize.dir() });\n      await animateTo(this.popup.popup, keyframes, options);\n      this.panel.hidden = true;\n      this.popup.active = false;\n\n      this.emit('syn-after-hide');\n    }\n  }\n\n  render() {\n    return html`\n      <syn-popup\n        part=\"base\"\n        exportparts=\"popup:base__popup\"\n        id=\"dropdown\"\n        placement=${this.placement}\n        distance=${this.distance}\n        skidding=${this.skidding}\n        flip\n        shift\n        auto-size=\"vertical\"\n        auto-size-padding=\"10\"\n        sync=${ifDefined(this.sync ? this.sync : undefined)}\n        class=${classMap({\n          dropdown: true,\n          'dropdown--open': this.open\n        })}\n      >\n        <slot\n          name=\"trigger\"\n          slot=\"anchor\"\n          part=\"trigger\"\n          class=\"dropdown__trigger\"\n          @click=${this.handleTriggerClick}\n          @keydown=${this.handleTriggerKeyDown}\n          @keyup=${this.handleTriggerKeyUp}\n          @slotchange=${this.handleTriggerSlotChange}\n        ></slot>\n\n        <div aria-hidden=${this.open ? 'false' : 'true'} aria-labelledby=\"dropdown\">\n          <slot part=\"panel\" class=\"dropdown__panel\"></slot>\n        </div>\n      </syn-popup>\n    `;\n  }\n}\n\nsetDefaultAnimation('dropdown.show', {\n  keyframes: [\n    { opacity: 0, scale: 0.9 },\n    { opacity: 1, scale: 1 }\n  ],\n  options: { duration: 100, easing: 'ease' }\n});\n\nsetDefaultAnimation('dropdown.hide', {\n  keyframes: [\n    { opacity: 1, scale: 1 },\n    { opacity: 0, scale: 0.9 }\n  ],\n  options: { duration: 100, easing: 'ease' }\n});\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,SAAS,gBAAgB;AAIzB,SAAS,YAAY;AACrB,SAAS,iBAAiB;AAE1B,SAAS,UAAU,aAAa;AAsChC,IAAqB,cAArB,cAAyC,eAAe;AAAA,EAAxD;AAAA;AAQE,SAAiB,WAAW,IAAI,mBAAmB,IAAI;AAOX,gBAAO;AAMtB,qBAYZ;AAG2B,oBAAW;AAMuB,4BAAmB;AASrE,oBAAW;AAGX,oBAAW;AAKV,gBAAgD;AAuC7E,SAAQ,gBAAgB,CAAC,UAAyB;AAGhD,UAAI,KAAK,QAAQ,MAAM,QAAQ,UAAU;AACvC,cAAM,gBAAgB;AACtB,aAAK,KAAK;AACV,aAAK,eAAe;AAAA,MACtB;AAAA,IACF;AAEA,SAAQ,wBAAwB,CAAC,UAAyB;AA3J5D;AA6JI,UAAI,MAAM,QAAQ,YAAY,KAAK,QAAQ,CAAC,KAAK,cAAc;AAC7D,cAAM,gBAAgB;AACtB,aAAK,eAAe;AACpB,aAAK,KAAK;AACV;AAAA,MACF;AAGA,UAAI,MAAM,QAAQ,OAAO;AAEvB,YAAI,KAAK,UAAQ,cAAS,kBAAT,mBAAwB,QAAQ,mBAAkB,iBAAiB;AAClF,gBAAM,eAAe;AACrB,eAAK,KAAK;AACV,eAAK,eAAe;AACpB;AAAA,QACF;AAEA,cAAM,2BAA2B,CAAC,SAAqC,YAAoC;AACzG,cAAI,CAAC,QAAS,QAAO;AAErB,gBAAM,UAAU,QAAQ,QAAQ,OAAO;AACvC,cAAI,QAAS,QAAO;AAEpB,gBAAM,WAAW,QAAQ,YAAY;AACrC,cAAI,oBAAoB,YAAY;AAClC,mBAAO,yBAAyB,SAAS,MAAM,OAAO;AAAA,UACxD;AAEA,iBAAO;AAAA,QACT;AAMA,mBAAW,MAAM;AAhMvB,cAAAA;AAiMQ,gBAAM,kBACJA,MAAA,KAAK,sBAAL,gBAAAA,IAAwB,0BAAyB,aAC7C,wBAAwB,IACxB,SAAS;AAEf,cACE,CAAC,KAAK,qBACN,yBAAyB,eAAe,KAAK,kBAAkB,QAAQ,YAAY,CAAC,MAClF,KAAK,mBACP;AACA,iBAAK,KAAK;AAAA,UACZ;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AAEA,SAAQ,0BAA0B,CAAC,UAAsB;AAEvD,YAAM,OAAO,MAAM,aAAa;AAChC,UAAI,KAAK,qBAAqB,CAAC,KAAK,SAAS,KAAK,iBAAiB,GAAG;AACpE,aAAK,KAAK;AAAA,MACZ;AAAA,IACF;AAEA,SAAQ,oBAAoB,CAAC,UAA0B;AACrD,YAAM,SAAS,MAAM;AAGrB,UAAI,CAAC,KAAK,oBAAoB,OAAO,QAAQ,YAAY,MAAM,YAAY;AACzE,aAAK,KAAK;AACV,aAAK,eAAe;AAAA,MACtB;AAAA,IACF;AAAA;AAAA,EArHA,oBAAoB;AAClB,UAAM,kBAAkB;AAExB,QAAI,CAAC,KAAK,mBAAmB;AAC3B,WAAK,oBAAoB;AAAA,IAC3B;AAAA,EACF;AAAA,EAEA,eAAe;AACb,SAAK,MAAM,SAAS,CAAC,KAAK;AAG1B,QAAI,KAAK,MAAM;AACb,WAAK,iBAAiB;AACtB,WAAK,MAAM,SAAS;AAAA,IACtB;AAAA,EACF;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAqB;AAC3B,SAAK,oBAAoB;AACzB,SAAK,KAAK;AAAA,EACZ;AAAA,EAEA,iBAAiB;AACf,UAAM,UAAU,KAAK,QAAQ,iBAAiB,EAAE,SAAS,KAAK,CAAC,EAAE,CAAC;AAClE,QAAI,QAAO,mCAAS,WAAU,YAAY;AACxC,cAAQ,MAAM;AAAA,IAChB;AAAA,EACF;AAAA,EAEA,UAAU;AACR,WAAO,KAAK,MAAM,iBAAiB,EAAE,SAAS,KAAK,CAAC,EAAE,KAAK,QAAM,GAAG,QAAQ,YAAY,MAAM,UAAU;AAAA,EAG1G;AAAA,EAoFA,qBAAqB;AACnB,QAAI,KAAK,MAAM;AACb,WAAK,KAAK;AAAA,IACZ,OAAO;AACL,WAAK,KAAK;AACV,WAAK,eAAe;AAAA,IACtB;AAAA,EACF;AAAA,EAEA,MAAM,qBAAqB,OAAsB;AAG/C,QAAI,CAAC,KAAK,OAAO,EAAE,SAAS,MAAM,GAAG,GAAG;AACtC,YAAM,eAAe;AACrB,WAAK,mBAAmB;AACxB;AAAA,IACF;AAEA,UAAM,OAAO,KAAK,QAAQ;AAE1B,QAAI,MAAM;AACR,YAAM,YAAY,KAAK,YAAY;AACnC,YAAM,gBAAgB,UAAU,CAAC;AACjC,YAAM,eAAe,UAAU,UAAU,SAAS,CAAC;AAKnD,UAAI,CAAC,aAAa,WAAW,QAAQ,KAAK,EAAE,SAAS,MAAM,GAAG,GAAG;AAC/D,cAAM,eAAe;AAGrB,YAAI,CAAC,KAAK,MAAM;AACd,eAAK,KAAK;AAGV,gBAAM,KAAK;AAAA,QACb;AAEA,YAAI,UAAU,SAAS,GAAG;AAExB,eAAK,eAAe,KAAK,MAAM;AAC7B,gBAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,QAAQ;AACrD,mBAAK,eAAe,aAAa;AACjC,4BAAc,MAAM;AAAA,YACtB;AAEA,gBAAI,MAAM,QAAQ,aAAa,MAAM,QAAQ,OAAO;AAClD,mBAAK,eAAe,YAAY;AAChC,2BAAa,MAAM;AAAA,YACrB;AAAA,UACF,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,mBAAmB,OAAsB;AAEvC,QAAI,MAAM,QAAQ,KAAK;AACrB,YAAM,eAAe;AAAA,IACvB;AAAA,EACF;AAAA,EAEA,0BAA0B;AACxB,SAAK,wBAAwB;AAAA,EAC/B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYA,0BAA0B;AACxB,UAAM,mBAAmB,KAAK,QAAQ,iBAAiB,EAAE,SAAS,KAAK,CAAC;AACxE,UAAM,oBAAoB,iBAAiB,KAAK,QAAM,oBAAoB,EAAE,EAAE,KAAK;AACnF,QAAI;AAEJ,QAAI,mBAAmB;AACrB,cAAQ,kBAAkB,QAAQ,YAAY,GAAG;AAAA;AAAA,QAE/C,KAAK;AAAA,QACL,KAAK;AACH,mBAAU,kBAAgD;AAC1D;AAAA,QAEF;AACE,mBAAS;AAAA,MACb;AAEA,aAAO,aAAa,iBAAiB,MAAM;AAC3C,aAAO,aAAa,iBAAiB,KAAK,OAAO,SAAS,OAAO;AAAA,IACnE;AAAA,EACF;AAAA;AAAA,EAGA,MAAM,OAAO;AACX,QAAI,KAAK,MAAM;AACb,aAAO;AAAA,IACT;AAEA,SAAK,OAAO;AACZ,WAAO,aAAa,MAAM,gBAAgB;AAAA,EAC5C;AAAA;AAAA,EAGA,MAAM,OAAO;AACX,QAAI,CAAC,KAAK,MAAM;AACd,aAAO;AAAA,IACT;AAEA,SAAK,OAAO;AACZ,WAAO,aAAa,MAAM,gBAAgB;AAAA,EAC5C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,aAAa;AACX,SAAK,MAAM,WAAW;AAAA,EACxB;AAAA,EAEA,mBAAmB;AAnWrB;AAoWI,SAAK,MAAM,iBAAiB,cAAc,KAAK,iBAAiB;AAChE,QAAI,kBAAkB,QAAQ;AAC5B,iBAAK,iBAAL,mBAAmB;AACnB,WAAK,eAAe,IAAI,aAAa;AACrC,WAAK,aAAa,UAAU,MAAM;AAChC,aAAK,KAAK;AACV,aAAK,eAAe;AAAA,MACtB;AAAA,IACF,OAAO;AACL,WAAK,MAAM,iBAAiB,WAAW,KAAK,aAAa;AAAA,IAC3D;AACA,aAAS,iBAAiB,WAAW,KAAK,qBAAqB;AAC/D,aAAS,iBAAiB,aAAa,KAAK,uBAAuB;AAAA,EACrE;AAAA,EAEA,sBAAsB;AAnXxB;AAoXI,QAAI,KAAK,OAAO;AACd,WAAK,MAAM,oBAAoB,cAAc,KAAK,iBAAiB;AACnE,WAAK,MAAM,oBAAoB,WAAW,KAAK,aAAa;AAAA,IAC9D;AACA,aAAS,oBAAoB,WAAW,KAAK,qBAAqB;AAClE,aAAS,oBAAoB,aAAa,KAAK,uBAAuB;AACtE,eAAK,iBAAL,mBAAmB;AAAA,EACrB;AAAA,EAGA,MAAM,mBAAmB;AACvB,QAAI,KAAK,UAAU;AACjB,WAAK,OAAO;AACZ;AAAA,IACF;AAEA,SAAK,wBAAwB;AAE7B,QAAI,KAAK,MAAM;AAEb,WAAK,KAAK,UAAU;AACpB,WAAK,iBAAiB;AAEtB,YAAM,eAAe,IAAI;AACzB,WAAK,MAAM,SAAS;AACpB,WAAK,MAAM,SAAS;AACpB,YAAM,EAAE,WAAW,QAAQ,IAAI,aAAa,MAAM,iBAAiB,EAAE,KAAK,KAAK,SAAS,IAAI,EAAE,CAAC;AAC/F,YAAM,UAAU,KAAK,MAAM,OAAO,WAAW,OAAO;AAEpD,WAAK,KAAK,gBAAgB;AAAA,IAC5B,OAAO;AAEL,WAAK,KAAK,UAAU;AACpB,WAAK,oBAAoB;AAEzB,YAAM,eAAe,IAAI;AACzB,YAAM,EAAE,WAAW,QAAQ,IAAI,aAAa,MAAM,iBAAiB,EAAE,KAAK,KAAK,SAAS,IAAI,EAAE,CAAC;AAC/F,YAAM,UAAU,KAAK,MAAM,OAAO,WAAW,OAAO;AACpD,WAAK,MAAM,SAAS;AACpB,WAAK,MAAM,SAAS;AAEpB,WAAK,KAAK,gBAAgB;AAAA,IAC5B;AAAA,EACF;AAAA,EAEA,SAAS;AACP,WAAO;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKS,KAAK,SAAS;AAAA,mBACf,KAAK,QAAQ;AAAA,mBACb,KAAK,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,eAKjB,UAAU,KAAK,OAAO,KAAK,OAAO,MAAS,CAAC;AAAA,gBAC3C,SAAS;AAAA,MACf,UAAU;AAAA,MACV,kBAAkB,KAAK;AAAA,IACzB,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAOS,KAAK,kBAAkB;AAAA,qBACrB,KAAK,oBAAoB;AAAA,mBAC3B,KAAK,kBAAkB;AAAA,wBAClB,KAAK,uBAAuB;AAAA;AAAA;AAAA,2BAGzB,KAAK,OAAO,UAAU,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,EAKrD;AACF;AAtZqB,YACZ,SAAyB,CAAC,0BAAiB,yBAAQ,8BAAY;AADnD,YAEZ,eAAe,EAAE,aAAa,SAAS;AAE1B;AAAA,EAAnB,MAAM,WAAW;AAAA,GAJC,YAIC;AACS;AAAA,EAA5B,MAAM,oBAAoB;AAAA,GALR,YAKU;AACF;AAAA,EAA1B,MAAM,kBAAkB;AAAA,GANN,YAMQ;AASiB;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAfvB,YAeyB;AAMf;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GArBR,YAqBU;AAee;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GApCvB,YAoCyB;AAMkC;AAAA,EAA7E,SAAS,EAAE,WAAW,uBAAuB,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GA1CzD,YA0C2D;AAM9C;AAAA,EAA/B,SAAS,EAAE,WAAW,MAAM,CAAC;AAAA,GAhDX,YAgDa;AAGJ;AAAA,EAA3B,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAnDP,YAmDS;AAGA;AAAA,EAA3B,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAtDP,YAsDS;AAKC;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GA3DR,YA2DU;AAoRvB;AAAA,EADL,MAAM,QAAQ,EAAE,sBAAsB,KAAK,CAAC;AAAA,GA9U1B,YA+Ub;AAyER,oBAAoB,iBAAiB;AAAA,EACnC,WAAW;AAAA,IACT,EAAE,SAAS,GAAG,OAAO,IAAI;AAAA,IACzB,EAAE,SAAS,GAAG,OAAO,EAAE;AAAA,EACzB;AAAA,EACA,SAAS,EAAE,UAAU,KAAK,QAAQ,OAAO;AAC3C,CAAC;AAED,oBAAoB,iBAAiB;AAAA,EACnC,WAAW;AAAA,IACT,EAAE,SAAS,GAAG,OAAO,EAAE;AAAA,IACvB,EAAE,SAAS,GAAG,OAAO,IAAI;AAAA,EAC3B;AAAA,EACA,SAAS,EAAE,UAAU,KAAK,QAAQ,OAAO;AAC3C,CAAC;",
-  "names": ["_a"]
-}

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/menu-item/menu-item.component.ts", "../../src/internal/watchEvent.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { getTextContent, HasSlotController } from '../../internal/slot.js';\nimport { html } from 'lit';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query } from 'lit/decorators.js';\nimport { SubmenuController } from './submenu-controller.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport SynPopup from '../popup/popup.component.js';\nimport SynSpinner from '../spinner/spinner.component.js';\nimport styles from './menu-item.styles.js';\nimport customStyles from './menu-item.custom.styles.js';\nimport { emitEventForPropertyUpdates } from '../../internal/watchEvent.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Menu items provide options for the user to pick from in a menu.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-menu-item--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n * @dependency syn-popup\n * @dependency syn-spinner\n *\n * @slot - The menu item's label.\n * @slot prefix - Used to prepend an icon or similar element to the menu item.\n * @slot suffix - Used to append an icon or similar element to the menu item.\n * @slot submenu - Used to denote a nested menu.\n *\n * @csspart base - The component's base wrapper.\n * @csspart checked-icon - The checked icon, which is only visible when the menu item is checked.\n * @csspart prefix - The prefix container.\n * @csspart label - The menu item label.\n * @csspart suffix - The suffix container.\n * @csspart spinner - The spinner that shows when the menu item is in the loading state.\n * @csspart spinner__base - The spinner's base part.\n * @csspart submenu-icon - The submenu icon, visible only when the menu item has a submenu (not yet implemented).\n *\n * @cssproperty [--submenu-offset=-2px] - The distance submenus shift to overlap the parent menu.\n */\n@emitEventForPropertyUpdates(['type', 'loading'], {\n  waitUntilFirstUpdated: true,\n})\nexport default class SynMenuItem extends SynergyElement {\n  static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n  static dependencies = {\n    'syn-icon': SynIcon,\n    'syn-popup': SynPopup,\n    'syn-spinner': SynSpinner\n  };\n\n  private cachedTextLabel: string;\n  private readonly localize = new LocalizeController(this);\n\n  @query('slot:not([name])') defaultSlot: HTMLSlotElement;\n  @query('.menu-item') menuItem: HTMLElement;\n\n  /** The type of menu item to render. To use `checked`, this value must be set to `checkbox`. */\n  @property() type: 'normal' | 'checkbox' = 'normal';\n\n  /** Draws the item in a checked state. */\n  @property({ type: Boolean, reflect: true }) checked = false;\n\n  /** A unique value to store in the menu item. This can be used as a way to identify menu items when selected. */\n  @property() value = '';\n\n  /** Draws the menu item in a loading state. */\n  @property({ type: Boolean, reflect: true }) loading = false;\n\n  /** Draws the menu item in a disabled state, preventing selection. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  private readonly hasSlotController = new HasSlotController(this, 'submenu');\n  private submenuController: SubmenuController = new SubmenuController(this, this.hasSlotController);\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('click', this.handleHostClick);\n    this.addEventListener('mouseover', this.handleMouseOver);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.handleHostClick);\n    this.removeEventListener('mouseover', this.handleMouseOver);\n  }\n\n  private handleDefaultSlotChange() {\n    const textLabel = this.getTextLabel();\n\n    // Ignore the first time the label is set\n    if (typeof this.cachedTextLabel === 'undefined') {\n      this.cachedTextLabel = textLabel;\n      return;\n    }\n\n    // When the label changes, emit a slotchange event so parent controls see it\n    if (textLabel !== this.cachedTextLabel) {\n      this.cachedTextLabel = textLabel;\n      this.emit('slotchange', { bubbles: true, composed: false, cancelable: false });\n    }\n  }\n\n  private handleHostClick = (event: MouseEvent) => {\n    // Prevent the click event from being emitted when the button is disabled or loading\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopImmediatePropagation();\n    }\n  };\n\n  private handleMouseOver = (event: MouseEvent) => {\n    this.focus();\n    event.stopPropagation();\n  };\n\n  @watch('checked')\n  handleCheckedChange() {\n    // For proper accessibility, users have to use type=\"checkbox\" to use the checked attribute\n    if (this.checked && this.type !== 'checkbox') {\n      this.checked = false;\n      console.error('The checked attribute can only be used on menu items with type=\"checkbox\"', this);\n      return;\n    }\n\n    // Only checkbox types can receive the aria-checked attribute\n    if (this.type === 'checkbox') {\n      this.setAttribute('aria-checked', this.checked ? 'true' : 'false');\n    } else {\n      this.removeAttribute('aria-checked');\n    }\n  }\n\n  @watch('disabled')\n  handleDisabledChange() {\n    this.setAttribute('aria-disabled', this.disabled ? 'true' : 'false');\n  }\n\n  @watch('type')\n  handleTypeChange() {\n    if (this.type === 'checkbox') {\n      this.setAttribute('role', 'menuitemcheckbox');\n      this.setAttribute('aria-checked', this.checked ? 'true' : 'false');\n    } else {\n      this.setAttribute('role', 'menuitem');\n      this.removeAttribute('aria-checked');\n    }\n  }\n\n  /** Returns a text label based on the contents of the menu item's default slot. */\n  getTextLabel() {\n    return getTextContent(this.defaultSlot);\n  }\n\n  isSubmenu() {\n    return this.hasSlotController.test('submenu');\n  }\n\n  render() {\n    const isRtl = this.localize.dir() === 'rtl';\n    const isSubmenuExpanded = this.submenuController.isExpanded();\n\n    return html`\n      <div\n        id=\"anchor\"\n        part=\"base\"\n        class=${classMap({\n          'menu-item': true,\n          'menu-item--rtl': isRtl,\n          'menu-item--checked': this.checked,\n          'menu-item--disabled': this.disabled,\n          'menu-item--loading': this.loading,\n          'menu-item--has-submenu': this.isSubmenu(),\n          'menu-item--submenu-expanded': isSubmenuExpanded\n        })}\n        ?aria-haspopup=\"${this.isSubmenu()}\"\n        ?aria-expanded=\"${isSubmenuExpanded ? true : false}\"\n      >\n        <span part=\"checked-icon\" class=\"menu-item__check\">\n          <syn-icon name=\"check\" library=\"system\" aria-hidden=\"true\"></syn-icon>\n        </span>\n\n        <slot name=\"prefix\" part=\"prefix\" class=\"menu-item__prefix\"></slot>\n\n        <slot part=\"label\" class=\"menu-item__label\" @slotchange=${this.handleDefaultSlotChange}></slot>\n\n        <slot name=\"suffix\" part=\"suffix\" class=\"menu-item__suffix\"></slot>\n\n        <span part=\"submenu-icon\" class=\"menu-item__chevron\">\n          <syn-icon name=\"chevron-down\" library=\"system\" aria-hidden=\"true\"></syn-icon>\n        </span>\n\n        ${this.submenuController.renderSubmenu()}\n        ${this.loading ? html` <syn-spinner part=\"spinner\" exportparts=\"base:spinner__base\"></syn-spinner> ` : ''}\n      </div>\n    `;\n  }\n}\n", "/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type { PropertyValues } from 'lit';\nimport type SynergyElement from './synergy-element.js';\n\ntype Constructor<T = object> = new (...args: any[]) => T;\n\ninterface DecoratorOptions {\n  /**\n   * If true, will only start watching after the initial updated call\n   */\n  waitUntilFirstUpdated?: boolean;\n}\n\n/**\n * Class decorator that automatically emits a `syn-attributes-changed` event\n * when at least one of the provided attributes have changed.\n * The event will contain an array of all changed properties, including their\n * - attribute name\n * - old value and\n * - new value.\n *\n * @example\n * ```ts\n * class OriginalClass extends SynergyElement {}\n * export const MyComponent = emitEventForPropertyUpdates(['attribute1', 'attribute2'])(BaseClass);\n *\n * // Create the component, providing initial values for the changed attribute list\n * const myComponent = document.createElement('my-component');\n * myComponent.attribute1 = 'initial value for attribute 1';\n * myComponent.attribute2 = 'initial value for attribute 2';\n *\n * // Create a container and listen for the event\n * const container = document.createElement('div');\n * container.addEventListener('syn-attributes-changed', (event: SynAttributesChangedEvent) => {\n *   // We do not want to propagate the event further\n *   event.stopImmidiatePropagation();\n *\n *   console.log(event.detail);\n * });\n *\n * // Add the component to the container\n * container.appendChild(myComponent);\n *\n * // Change the attributes\n * myComponent.attribute1 = 'value for attribute 1';\n * myComponent.attribute2 = 'value for attribute 2';\n *\n * // Output:\n * // [\n * //   {\n * //     attribute: 'attribute1',\n * //     oldValue: 'initial value for attribute 1',\n * //     newValue: 'value for attribute 1'\n * //   },\n * //   {\n * //     attribute: 'attribute2',\n * //     oldValue: 'initial value for attribute 2',\n * //     newValue: 'value for attribute 2'\n * //   }\n * // ]\n * ```\n */\nexport function emitEventForPropertyUpdates(\n  watchedProperties: string[],\n  options?: DecoratorOptions,\n) {\n  const resolvedOptions: Required<DecoratorOptions> = {\n    waitUntilFirstUpdated: false,\n    ...options,\n  };\n\n  return <T extends Constructor<SynergyElement>>(Proto: T): T => class extends Proto {\n    // True if the event was emitted, false otherwise\n    #synPrivateFirstChangeHasBeenEmitted = !resolvedOptions.waitUntilFirstUpdated;\n\n    updated(changedProps: PropertyValues) {\n      if (!this.#synPrivateFirstChangeHasBeenEmitted) {\n        this.#synPrivateFirstChangeHasBeenEmitted = true;\n        return;\n      }\n\n      // Get the list of all changed properties\n      const monitoredChangedProperties = Array\n        .from(changedProps)\n        .filter(([key]) => watchedProperties.includes(key as string));\n\n      // If there are no changed properties, return before sending anything\n      if (monitoredChangedProperties.length === 0) {\n        super.updated(changedProps);\n        return;\n      }\n\n      // Send out the event with all changed properties\n      const detail = monitoredChangedProperties.map(([key, value]) => ({\n        attribute: key,\n        newValue: this[key as keyof this],\n        oldValue: value,\n      }));\n\n      this.emit('syn-attributes-changed', {\n        detail,\n      });\n      super.updated(changedProps);\n    }\n  };\n}\n"],
-  "mappings": "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",
-  "names": []
-}

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/dropdown/dropdown.styles.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n  :host {\n    display: inline-block;\n  }\n\n  .dropdown::part(popup) {\n    z-index: var(--syn-z-index-dropdown);\n  }\n\n  .dropdown[data-current-placement^='top']::part(popup) {\n    transform-origin: bottom;\n  }\n\n  .dropdown[data-current-placement^='bottom']::part(popup) {\n    transform-origin: top;\n  }\n\n  .dropdown[data-current-placement^='left']::part(popup) {\n    transform-origin: right;\n  }\n\n  .dropdown[data-current-placement^='right']::part(popup) {\n    transform-origin: left;\n  }\n\n  .dropdown__trigger {\n    display: block;\n  }\n\n  .dropdown__panel {\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    border-radius: var(--syn-border-radius-medium);\n    pointer-events: none;\n  }\n\n  .dropdown--open .dropdown__panel {\n    display: block;\n    pointer-events: all;\n  }\n\n  /* When users slot a menu, make sure it conforms to the popup's auto-size */\n  ::slotted(syn-menu) {\n    max-width: var(--auto-size-available-width) !important;\n    max-height: var(--auto-size-available-height) !important;\n  }\n`;\n"],
-  "mappings": ";AACA,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;",
-  "names": []
-}

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

@@ -1,7 +0,0 @@
-{
-  "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.V37RYGE7.js

@@ -1,24 +0,0 @@
-// src/components/menu/menu.styles.ts
-import { css } from "lit";
-var menu_styles_default = css`
-	/* stylelint-disable */
-  :host {
-    display: block;
-    position: relative;
-    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: var(--syn-spacing-x-small) 0;
-    overflow: auto;
-    overscroll-behavior: none;
-  }
-
-  ::slotted(syn-divider) {
-    --spacing: var(--syn-spacing-x-small);
-  }
-`;
-
-export {
-  menu_styles_default
-};
-//# sourceMappingURL=chunk.V37RYGE7.js.map

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/menu/menu.styles.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n  :host {\n    display: block;\n    position: relative;\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: var(--syn-spacing-x-small) 0;\n    overflow: auto;\n    overscroll-behavior: none;\n  }\n\n  ::slotted(syn-divider) {\n    --spacing: var(--syn-spacing-x-small);\n  }\n`;\n"],
-  "mappings": ";AACA,SAAS,WAAW;AAEpB,IAAO,sBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/components/dropdown/dropdown.custom.styles.d.ts

@@ -1,2 +0,0 @@
-declare const _default: import("lit").CSSResult;
-export default _default;

package/dist/components/dropdown/dropdown.custom.styles.js

@@ -1,8 +0,0 @@
-import {
-  dropdown_custom_styles_default
-} from "../../chunks/chunk.2KYFCKCK.js";
-import "../../chunks/chunk.MO2GTRUM.js";
-export {
-  dropdown_custom_styles_default as default
-};
-//# sourceMappingURL=dropdown.custom.styles.js.map

package/dist/components/dropdown/dropdown.custom.styles.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": [],
-  "sourcesContent": [],
-  "mappings": "",
-  "names": []
-}

package/dist/components/menu/menu.custom.styles.d.ts

@@ -1,2 +0,0 @@
-declare const _default: import("lit").CSSResult;
-export default _default;