@synergy-design-system/components 3.1.0 → 3.2.1

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/utilities/defaultSettings/base.ts"],
+  "sourcesContent": ["/* eslint-disable @stylistic/quotes */\n// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED file for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\n\n// Global imports\nimport { modernNumericStrategy } from \"../../components/input/strategies.js\";\n\n// Type imports\nimport type SynAccordion from \"../../components/accordion/accordion.js\";\nimport type SynAlert from \"../../components/alert/alert.js\";\nimport type SynBadge from \"../../components/badge/badge.js\";\nimport type SynButtonGroup from \"../../components/button-group/button-group.js\";\nimport type SynButton from \"../../components/button/button.js\";\nimport type SynCheckbox from \"../../components/checkbox/checkbox.js\";\nimport type SynCombobox from \"../../components/combobox/combobox.js\";\nimport type SynDetails from \"../../components/details/details.js\";\nimport type SynFile from \"../../components/file/file.js\";\nimport type SynIconButton from \"../../components/icon-button/icon-button.js\";\nimport type SynInput from \"../../components/input/input.js\";\nimport type SynOption from \"../../components/option/option.js\";\nimport type SynRadioButton from \"../../components/radio-button/radio-button.js\";\nimport type SynRadioGroup from \"../../components/radio-group/radio-group.js\";\nimport type SynRadio from \"../../components/radio/radio.js\";\nimport type SynRange from \"../../components/range/range.js\";\nimport type SynSelect from \"../../components/select/select.js\";\nimport type SynSideNav from \"../../components/side-nav/side-nav.js\";\nimport type SynSwitch from \"../../components/switch/switch.js\";\nimport type SynTag from \"../../components/tag/tag.js\";\nimport type SynTextarea from \"../../components/textarea/textarea.js\";\nimport type SynValidate from \"../../components/validate/validate.js\";\nimport type SynergyElement from \"../../internal/synergy-element.js\";\nimport type { SynDefaultChangedAttribute } from \"../../events/events.js\";\n\n// Core types\n\n/**\n * Custom helper type that adds decorated properties from\n * the globalSettings helper.\n */\nexport type GlobalSettingsEnabledElement = SynergyElement & {\n  __originalDecoratedClassName: string;\n  overrideGlobalSettings: (\n    changedProperties: SynDefaultChangedAttribute[],\n  ) => void;\n};\n\n/**\n * Allows for partial recursive types\n */\nexport type RecursivePartial<T> = {\n  [P in keyof T]?: T[P] extends object ? RecursivePartial<T[P]> : T[P];\n};\n\n/**\n * Allowed value for a default setting\n * Gets the value of a given attribute for a given component\n */\nexport type AllowedValueForDefaultSetting<\n  Elm extends SynergyElement,\n  Attr extends keyof Elm,\n> = Elm[Attr];\n\n/**\n * List of all components that have default values\n */\nexport type ComponentNamesWithDefaultValues =\n  | \"SynAccordion\"\n  | \"SynAlert\"\n  | \"SynBadge\"\n  | \"SynButton\"\n  | \"SynButtonGroup\"\n  | \"SynCheckbox\"\n  | \"SynCombobox\"\n  | \"SynDetails\"\n  | \"SynFile\"\n  | \"SynIconButton\"\n  | \"SynInput\"\n  | \"SynOption\"\n  | \"SynRadio\"\n  | \"SynRadioButton\"\n  | \"SynRadioGroup\"\n  | \"SynRange\"\n  | \"SynSelect\"\n  | \"SynSideNav\"\n  | \"SynSwitch\"\n  | \"SynTag\"\n  | \"SynTextarea\"\n  | \"SynValidate\";\n\n/**\n * Extracts all available default settings for a given component\n */\nexport type ExtractSettingsForElement<C extends SynergyElement> = {\n  [key in keyof SynDefaultSettings]?: key extends keyof C\n    ? AllowedValueForDefaultSetting<C, key>\n    : never;\n};\n\n/**\n * Default settings map for all component values that have defaults set\n */\nexport type SynDefaultSettings = {\n  delimiter: {\n    SynCombobox?: AllowedValueForDefaultSetting<SynCombobox, \"delimiter\">;\n    SynOption?: AllowedValueForDefaultSetting<SynOption, \"delimiter\">;\n    SynSelect?: AllowedValueForDefaultSetting<SynSelect, \"delimiter\">;\n  };\n  numericStrategy: {\n    SynInput?: AllowedValueForDefaultSetting<SynInput, \"numericStrategy\">;\n  };\n  size: {\n    SynAccordion?: AllowedValueForDefaultSetting<SynAccordion, \"size\">;\n    SynAlert?: AllowedValueForDefaultSetting<SynAlert, \"size\">;\n    SynButton?: AllowedValueForDefaultSetting<SynButton, \"size\">;\n    SynButtonGroup?: AllowedValueForDefaultSetting<SynButtonGroup, \"size\">;\n    SynCheckbox?: AllowedValueForDefaultSetting<SynCheckbox, \"size\">;\n    SynCombobox?: AllowedValueForDefaultSetting<SynCombobox, \"size\">;\n    SynDetails?: AllowedValueForDefaultSetting<SynDetails, \"size\">;\n    SynFile?: AllowedValueForDefaultSetting<SynFile, \"size\">;\n    SynIconButton?: AllowedValueForDefaultSetting<SynIconButton, \"size\">;\n    SynInput?: AllowedValueForDefaultSetting<SynInput, \"size\">;\n    SynRadio?: AllowedValueForDefaultSetting<SynRadio, \"size\">;\n    SynRadioButton?: AllowedValueForDefaultSetting<SynRadioButton, \"size\">;\n    SynRadioGroup?: AllowedValueForDefaultSetting<SynRadioGroup, \"size\">;\n    SynRange?: AllowedValueForDefaultSetting<SynRange, \"size\">;\n    SynSelect?: AllowedValueForDefaultSetting<SynSelect, \"size\">;\n    SynSwitch?: AllowedValueForDefaultSetting<SynSwitch, \"size\">;\n    SynTag?: AllowedValueForDefaultSetting<SynTag, \"size\">;\n    SynTextarea?: AllowedValueForDefaultSetting<SynTextarea, \"size\">;\n  };\n  variant: {\n    SynAlert?: AllowedValueForDefaultSetting<SynAlert, \"variant\">;\n    SynBadge?: AllowedValueForDefaultSetting<SynBadge, \"variant\">;\n    SynButton?: AllowedValueForDefaultSetting<SynButton, \"variant\">;\n    SynButtonGroup?: AllowedValueForDefaultSetting<SynButtonGroup, \"variant\">;\n    SynSideNav?: AllowedValueForDefaultSetting<SynSideNav, \"variant\">;\n    SynValidate?: AllowedValueForDefaultSetting<SynValidate, \"variant\">;\n  };\n};\n\n// Exports\n\n/**\n * Default settings for all components\n */\nexport const defaultSettings: SynDefaultSettings = {\n  delimiter: {\n    SynCombobox: \" \",\n    SynOption: \" \",\n    SynSelect: \" \",\n  },\n  numericStrategy: {\n    SynInput: modernNumericStrategy,\n  },\n  size: {\n    SynAccordion: \"medium\",\n    SynAlert: \"medium\",\n    SynButton: \"medium\",\n    SynButtonGroup: \"medium\",\n    SynCheckbox: \"medium\",\n    SynCombobox: \"medium\",\n    SynDetails: \"medium\",\n    SynFile: \"medium\",\n    SynIconButton: \"inherit\",\n    SynInput: \"medium\",\n    SynRadio: \"medium\",\n    SynRadioButton: \"medium\",\n    SynRadioGroup: \"medium\",\n    SynRange: \"medium\",\n    SynSelect: \"medium\",\n    SynSwitch: \"medium\",\n    SynTag: \"medium\",\n    SynTextarea: \"medium\",\n  },\n  variant: {\n    SynAlert: \"primary\",\n    SynBadge: \"primary\",\n    SynButton: \"outline\",\n    SynButtonGroup: \"outline\",\n    SynSideNav: \"default\",\n    SynValidate: \"native\",\n  },\n};\n\n/**\n * Initial default settings for all components\n */\nexport const INITIAL_DEFAULT_SETTINGS: SynDefaultSettings = {\n  delimiter: {\n    SynCombobox: \" \",\n    SynOption: \" \",\n    SynSelect: \" \",\n  },\n  numericStrategy: {\n    SynInput: modernNumericStrategy,\n  },\n  size: {\n    SynAccordion: \"medium\",\n    SynAlert: \"medium\",\n    SynButton: \"medium\",\n    SynButtonGroup: \"medium\",\n    SynCheckbox: \"medium\",\n    SynCombobox: \"medium\",\n    SynDetails: \"medium\",\n    SynFile: \"medium\",\n    SynIconButton: \"inherit\",\n    SynInput: \"medium\",\n    SynRadio: \"medium\",\n    SynRadioButton: \"medium\",\n    SynRadioGroup: \"medium\",\n    SynRange: \"medium\",\n    SynSelect: \"medium\",\n    SynSwitch: \"medium\",\n    SynTag: \"medium\",\n    SynTextarea: \"medium\",\n  },\n  variant: {\n    SynAlert: \"primary\",\n    SynBadge: \"primary\",\n    SynButton: \"outline\",\n    SynButtonGroup: \"outline\",\n    SynSideNav: \"default\",\n    SynValidate: \"native\",\n  },\n};\n"],
+  "mappings": ";;;;;AAoJO,IAAM,kBAAsC;AAAA,EACjD,WAAW;AAAA,IACT,aAAa;AAAA,IACb,WAAW;AAAA,IACX,WAAW;AAAA,EACb;AAAA,EACA,iBAAiB;AAAA,IACf,UAAU;AAAA,EACZ;AAAA,EACA,MAAM;AAAA,IACJ,cAAc;AAAA,IACd,UAAU;AAAA,IACV,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,aAAa;AAAA,IACb,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,eAAe;AAAA,IACf,UAAU;AAAA,IACV,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,UAAU;AAAA,IACV,WAAW;AAAA,IACX,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,aAAa;AAAA,EACf;AAAA,EACA,SAAS;AAAA,IACP,UAAU;AAAA,IACV,UAAU;AAAA,IACV,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,aAAa;AAAA,EACf;AACF;AAKO,IAAM,2BAA+C;AAAA,EAC1D,WAAW;AAAA,IACT,aAAa;AAAA,IACb,WAAW;AAAA,IACX,WAAW;AAAA,EACb;AAAA,EACA,iBAAiB;AAAA,IACf,UAAU;AAAA,EACZ;AAAA,EACA,MAAM;AAAA,IACJ,cAAc;AAAA,IACd,UAAU;AAAA,IACV,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,aAAa;AAAA,IACb,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,eAAe;AAAA,IACf,UAAU;AAAA,IACV,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,UAAU;AAAA,IACV,WAAW;AAAA,IACX,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,aAAa;AAAA,EACf;AAAA,EACA,SAAS;AAAA,IACP,UAAU;AAAA,IACV,UAAU;AAAA,IACV,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,aAAa;AAAA,EACf;AACF;",
+  "names": []
+}

package/dist/chunks/{chunk.QUM76UHV.js → chunk.VPL7U5EC.js}

@@ -88,4 +88,4 @@ var progress_bar_styles_default = css`
 export {
   progress_bar_styles_default
 };
-//# sourceMappingURL=chunk.QUM76UHV.js.map
+//# sourceMappingURL=chunk.VPL7U5EC.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/progress-bar/progress-bar.styles.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n  :host {\n    --height: 1rem;\n    --track-color: var(--syn-color-neutral-200);\n    --indicator-color: var(--syn-color-primary-600);\n    --label-color: var(--syn-color-neutral-0);\n\n    display: block;\n  }\n\n  .progress-bar {\n    position: relative;\n    background-color: var(--track-color);\n    height: var(--height);\n    border-radius: var(--syn-border-radius-pill);\n    box-shadow: inset var(--syn-shadow-small);\n    overflow: hidden;\n  }\n\n  .progress-bar__indicator {\n    height: 100%;\n    font-family: var(--syn-font-sans);\n    font-size: 12px;\n    font-weight: var(--syn-font-weight-normal);\n    background-color: var(--indicator-color);\n    color: var(--label-color);\n    text-align: center;\n    line-height: var(--height);\n    white-space: nowrap;\n    overflow: hidden;\n    transition:\n      400ms width,\n      400ms background-color;\n    user-select: none;\n    -webkit-user-select: none;\n  }\n\n  /* Indeterminate */\n  .progress-bar--indeterminate .progress-bar__indicator {\n    position: absolute;\n    animation: indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1);\n  }\n\n  .progress-bar--indeterminate.progress-bar--rtl .progress-bar__indicator {\n    animation-name: indeterminate-rtl;\n  }\n\n  @media (forced-colors: active) {\n    .progress-bar {\n      outline: solid 1px SelectedItem;\n      background-color: var(--syn-color-neutral-0);\n    }\n\n    .progress-bar__indicator {\n      outline: solid 1px SelectedItem;\n      background-color: SelectedItem;\n    }\n  }\n\n  @keyframes indeterminate {\n    0% {\n      left: -50%;\n      width: 50%;\n    }\n    75%,\n    100% {\n      left: 100%;\n      width: 50%;\n    }\n  }\n\n  @keyframes indeterminate-rtl {\n    0% {\n      right: -50%;\n      width: 50%;\n    }\n    75%,\n    100% {\n      right: 100%;\n      width: 50%;\n    }\n  }\n`;\n"],
+  "mappings": ";AACA,SAAS,WAAW;AAEpB,IAAO,8BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
+  "names": []
+}

package/dist/chunks/{chunk.FM6IAWK2.js → chunk.VWDX7DJ6.js}

@@ -1,6 +1,6 @@
 import {
   SynTag
-} from "./chunk.QWHBUNGK.js";
+} from "./chunk.SRY32QYH.js";
 
 // src/components/tag/tag.ts
 var tag_default = SynTag;
@@ -9,4 +9,4 @@ SynTag.define("syn-tag");
 export {
   tag_default
 };
-//# sourceMappingURL=chunk.FM6IAWK2.js.map
+//# sourceMappingURL=chunk.VWDX7DJ6.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/tag/tag.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport SynTag from './tag.component.js';\n\nexport * from './tag.component.js';\nexport default SynTag;\n\nSynTag.define('syn-tag');\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'syn-tag': SynTag;\n  }\n}\n"],
+  "mappings": ";;;;;AAIA,IAAO,cAAQ;AAEf,OAAO,OAAO,SAAS;",
+  "names": []
+}

package/dist/chunks/{chunk.FBQ7NUNW.js → chunk.VWFRCPN5.js}

@@ -81,7 +81,7 @@ var SynergyElement = class extends LitElement {
 _hasRecordedInitialProperties = new WeakMap();
 /* eslint-disable */
 // @ts-expect-error This is auto-injected at build time.
-SynergyElement.version = "3.1.0";
+SynergyElement.version = "3.2.1";
 SynergyElement.dependencies = {};
 __decorateClass([
   property()
@@ -93,4 +93,4 @@ __decorateClass([
 export {
   SynergyElement
 };
-//# sourceMappingURL=chunk.FBQ7NUNW.js.map
+//# sourceMappingURL=chunk.VWFRCPN5.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/internal/synergy-element.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\n\n// Match event type name strings that are registered on GlobalEventHandlersEventMap...\ntype EventTypeRequiresDetail<T> = T extends keyof GlobalEventHandlersEventMap\n  ? // ...where the event detail is an object...\n    GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, unknown>>\n    ? // ...that is non-empty...\n      GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, never>>\n      ? never\n      : // ...and has at least one non-optional property\n        Partial<GlobalEventHandlersEventMap[T]['detail']> extends GlobalEventHandlersEventMap[T]['detail']\n        ? never\n        : T\n    : never\n  : never;\n\n// The inverse of the above (match any type that doesn't match EventTypeRequiresDetail)\ntype EventTypeDoesNotRequireDetail<T> = T extends keyof GlobalEventHandlersEventMap\n  ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, unknown>>\n    ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, never>>\n      ? T\n      : Partial<GlobalEventHandlersEventMap[T]['detail']> extends GlobalEventHandlersEventMap[T]['detail']\n        ? T\n        : never\n    : T\n  : T;\n\n// `keyof EventTypesWithRequiredDetail` lists all registered event types that require detail\ntype EventTypesWithRequiredDetail = {\n  [EventType in keyof GlobalEventHandlersEventMap as EventTypeRequiresDetail<EventType>]: true;\n};\n\n// `keyof EventTypesWithoutRequiredDetail` lists all registered event types that do NOT require detail\ntype EventTypesWithoutRequiredDetail = {\n  [EventType in keyof GlobalEventHandlersEventMap as EventTypeDoesNotRequireDetail<EventType>]: true;\n};\n\n// Helper to make a specific property of an object non-optional\ntype WithRequired<T, K extends keyof T> = T & { [P in K]-?: T[P] };\n\n// Given an event name string, get a valid type for the options to initialize the event that is more restrictive than\n// just CustomEventInit when appropriate (validate the type of the event detail, and require it to be provided if the\n// event requires it)\ntype SynEventInit<T> = T extends keyof GlobalEventHandlersEventMap\n  ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, unknown>>\n    ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, never>>\n      ? CustomEventInit<GlobalEventHandlersEventMap[T]['detail']>\n      : Partial<GlobalEventHandlersEventMap[T]['detail']> extends GlobalEventHandlersEventMap[T]['detail']\n        ? CustomEventInit<GlobalEventHandlersEventMap[T]['detail']>\n        : WithRequired<CustomEventInit<GlobalEventHandlersEventMap[T]['detail']>, 'detail'>\n    : CustomEventInit\n  : CustomEventInit;\n\n// Given an event name string, get the type of the event\ntype GetCustomEventType<T> = T extends keyof GlobalEventHandlersEventMap\n  ? GlobalEventHandlersEventMap[T] extends CustomEvent<unknown>\n    ? GlobalEventHandlersEventMap[T]\n    : CustomEvent<unknown>\n  : CustomEvent<unknown>;\n\n// `keyof ValidEventTypeMap` is equivalent to `keyof GlobalEventHandlersEventMap` but gives a nicer error message\ntype ValidEventTypeMap = EventTypesWithRequiredDetail | EventTypesWithoutRequiredDetail;\n\nexport default class SynergyElement extends LitElement {\n  // Make localization attributes reactive\n  @property() dir: string;\n  @property() lang: string;\n\n  /** Emits a custom event with more convenient defaults. */\n  emit<T extends string & keyof EventTypesWithoutRequiredDetail>(\n    name: EventTypeDoesNotRequireDetail<T>,\n    options?: SynEventInit<T> | undefined\n  ): GetCustomEventType<T>;\n  emit<T extends string & keyof EventTypesWithRequiredDetail>(\n    name: EventTypeRequiresDetail<T>,\n    options: SynEventInit<T>\n  ): GetCustomEventType<T>;\n  emit<T extends string & keyof ValidEventTypeMap>(\n    name: T,\n    options?: SynEventInit<T> | undefined\n  ): GetCustomEventType<T> {\n    const event = new CustomEvent(name, {\n      bubbles: true,\n      cancelable: false,\n      composed: true,\n      detail: {},\n      ...options\n    });\n\n    this.dispatchEvent(event);\n\n    return event as GetCustomEventType<T>;\n  }\n\n  /* eslint-disable */\n  // @ts-expect-error This is auto-injected at build time.\n  static version = \"3.2.1\";\n  \n\n  static define(name: string, elementConstructor = this, options: ElementDefinitionOptions = {}) {\n    const currentlyRegisteredConstructor = customElements.get(name) as\n      | CustomElementConstructor\n      | typeof SynergyElement;\n\n    if (!currentlyRegisteredConstructor) {\n      // We try to register as the actual class first. If for some reason that fails, we fall back to anonymous classes.\n      // customElements can only have 1 class of the same \"object id\" per registry, so that is why the try {} catch {} exists.\n      // Some tools like Jest Snapshots and if you import the constructor and call `new SynButton()` they will fail with\n      //   the anonymous class version.\n      try {\n        customElements.define(name, elementConstructor, options);\n      } catch (_err) {\n        customElements.define(name, class extends elementConstructor {}, options);\n      }\n      return;\n    }\n\n    let newVersion = ' (unknown version)';\n    let existingVersion = newVersion;\n\n    if ('version' in elementConstructor && elementConstructor.version) {\n      newVersion = ' v' + elementConstructor.version;\n    }\n\n    if ('version' in currentlyRegisteredConstructor && currentlyRegisteredConstructor.version) {\n      existingVersion = ' v' + currentlyRegisteredConstructor.version;\n    }\n\n    // Need to make sure we're not working with null or empty strings before doing version comparisons.\n    if (newVersion && existingVersion && newVersion === existingVersion) {\n      // If versions match, we don't need to warn anyone. Carry on.\n      return;\n    }\n\n    console.warn(\n      `Attempted to register <${name}>${newVersion}, but <${name}>${existingVersion} has already been registered.`\n    );\n  }\n\n  static dependencies: Record<string, typeof SynergyElement> = {};\n\n  constructor() {\n    super();\n    Object.entries((this.constructor as typeof SynergyElement).dependencies).forEach(([name, component]) => {\n      (this.constructor as typeof SynergyElement).define(name, component);\n    });\n  }\n\n  #hasRecordedInitialProperties = false;\n\n  // Store the constructor value of all `static properties = {}`\n  initialReflectedProperties: Map<string, unknown> = new Map();\n\n  attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null) {\n    if (!this.#hasRecordedInitialProperties) {\n      (this.constructor as typeof SynergyElement).elementProperties.forEach(\n        (obj, prop: keyof typeof this & string) => {\n          // eslint-disable-next-line\n          if (obj.reflect && this[prop] != null) {\n            this.initialReflectedProperties.set(prop, this[prop]);\n          }\n        }\n      );\n\n      this.#hasRecordedInitialProperties = true;\n    }\n\n    super.attributeChangedCallback(name, oldValue, newValue);\n  }\n\n  protected willUpdate(changedProperties: Parameters<LitElement['willUpdate']>[0]): void {\n    super.willUpdate(changedProperties);\n\n    // Run the morph fixing *after* willUpdate.\n    this.initialReflectedProperties.forEach((value, prop: string & keyof typeof this) => {\n      // If a prop changes to `null`, we assume this happens via an attribute changing to `null`.\n      // eslint-disable-next-line\n      if (changedProperties.has(prop) && this[prop] == null) {\n        // Silly type gymnastics to appease the compiler.\n        (this as Record<string, unknown>)[prop] = value;\n      }\n    });\n  }\n}\n\nexport interface SynergyFormControl extends SynergyElement {\n  // Form attributes\n  name: string;\n  value: unknown;\n  disabled?: boolean;\n  defaultValue?: unknown;\n  defaultChecked?: boolean;\n  form?: string;\n\n  // Constraint validation attributes\n  pattern?: string;\n  min?: number | string | Date;\n  max?: number | string | Date;\n  step?: number | 'any';\n  required?: boolean;\n  minlength?: number;\n  maxlength?: number;\n\n  // Form validation properties\n  readonly validity: ValidityState;\n  readonly validationMessage: string;\n\n  // Form validation methods\n  checkValidity: () => boolean;\n  getForm: () => HTMLFormElement | null;\n  reportValidity: () => boolean;\n  setCustomValidity: (message: string) => void;\n}\n"],
+  "mappings": ";;;;;;;;;AACA,SAAS,kBAAkB;AAC3B,SAAS,gBAAgB;AAFzB;AAiEA,IAAqB,iBAArB,cAA4C,WAAW;AAAA,EA8ErD,cAAc;AACZ,UAAM;AAMR,sDAAgC;AAGhC;AAAA,sCAAmD,oBAAI,IAAI;AARzD,WAAO,QAAS,KAAK,YAAsC,YAAY,EAAE,QAAQ,CAAC,CAAC,MAAM,SAAS,MAAM;AACtG,MAAC,KAAK,YAAsC,OAAO,MAAM,SAAS;AAAA,IACpE,CAAC;AAAA,EACH;AAAA,EArEA,KACE,MACA,SACuB;AACvB,UAAM,QAAQ,IAAI,YAAY,MAAM;AAAA,MAClC,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,QAAQ,CAAC;AAAA,OACN,QACJ;AAED,SAAK,cAAc,KAAK;AAExB,WAAO;AAAA,EACT;AAAA,EAOA,OAAO,OAAO,MAAc,qBAAqB,MAAM,UAAoC,CAAC,GAAG;AAC7F,UAAM,iCAAiC,eAAe,IAAI,IAAI;AAI9D,QAAI,CAAC,gCAAgC;AAKnC,UAAI;AACF,uBAAe,OAAO,MAAM,oBAAoB,OAAO;AAAA,MACzD,SAAS,MAAM;AACb,uBAAe,OAAO,MAAM,cAAc,mBAAmB;AAAA,QAAC,GAAG,OAAO;AAAA,MAC1E;AACA;AAAA,IACF;AAEA,QAAI,aAAa;AACjB,QAAI,kBAAkB;AAEtB,QAAI,aAAa,sBAAsB,mBAAmB,SAAS;AACjE,mBAAa,OAAO,mBAAmB;AAAA,IACzC;AAEA,QAAI,aAAa,kCAAkC,+BAA+B,SAAS;AACzF,wBAAkB,OAAO,+BAA+B;AAAA,IAC1D;AAGA,QAAI,cAAc,mBAAmB,eAAe,iBAAiB;AAEnE;AAAA,IACF;AAEA,YAAQ;AAAA,MACN,0BAA0B,IAAI,IAAI,UAAU,UAAU,IAAI,IAAI,eAAe;AAAA,IAC/E;AAAA,EACF;AAAA,EAgBA,yBAAyB,MAAc,UAAyB,UAAyB;AACvF,QAAI,CAAC,mBAAK,gCAA+B;AACvC,MAAC,KAAK,YAAsC,kBAAkB;AAAA,QAC5D,CAAC,KAAK,SAAqC;AAEzC,cAAI,IAAI,WAAW,KAAK,IAAI,KAAK,MAAM;AACrC,iBAAK,2BAA2B,IAAI,MAAM,KAAK,IAAI,CAAC;AAAA,UACtD;AAAA,QACF;AAAA,MACF;AAEA,yBAAK,+BAAgC;AAAA,IACvC;AAEA,UAAM,yBAAyB,MAAM,UAAU,QAAQ;AAAA,EACzD;AAAA,EAEU,WAAW,mBAAkE;AACrF,UAAM,WAAW,iBAAiB;AAGlC,SAAK,2BAA2B,QAAQ,CAAC,OAAO,SAAqC;AAGnF,UAAI,kBAAkB,IAAI,IAAI,KAAK,KAAK,IAAI,KAAK,MAAM;AAErD,QAAC,KAAiC,IAAI,IAAI;AAAA,MAC5C;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAnCE;AAAA;AAAA;AArFmB,eAiCZ,UAAU;AAjCE,eA4EZ,eAAsD,CAAC;AA1ElD;AAAA,EAAX,SAAS;AAAA,GAFS,eAEP;AACA;AAAA,EAAX,SAAS;AAAA,GAHS,eAGP;",
+  "names": []
+}

package/dist/chunks/{chunk.KLUICBMV.js → chunk.WBOHZGDF.js}

@@ -1,15 +1,15 @@
 import {
   registerIconLibrary
-} from "./chunk.34V3QOIQ.js";
+} from "./chunk.NMWM3BP7.js";
 import {
   library_default_default
-} from "./chunk.YTEJW7IF.js";
+} from "./chunk.RODNHT5C.js";
 import {
   setSystemIconLibrary
 } from "./chunk.3RR4RIR7.js";
 import {
   getBasePath
-} from "./chunk.234ERFCE.js";
+} from "./chunk.PLV4PZYX.js";
 
 // src/components/icon/library.migration.ts
 var migrateIconName = (iconName, enableLogging = false) => {
@@ -695,4 +695,4 @@ export {
   migrationLibrary,
   setupIcons
 };
-//# sourceMappingURL=chunk.KLUICBMV.js.map
+//# sourceMappingURL=chunk.WBOHZGDF.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/icon/library.migration.ts"],
+  "sourcesContent": ["/* eslint-disable complexity */\n/**\n * Icon library for migrating old icon names to new icon names.\n * This file is automatically generated via\n * `@synergy-design-system/assets/scripts/createSynMigrationIconLibrary.js`.\n */\nimport { getBasePath } from '../../utilities/base-path.js';\nimport { type IconLibrary, registerIconLibrary } from './library.js';\nimport defaultLibrary from './library.default.js';\nimport { type AvailableSystemIcons, setSystemIconLibrary } from './library.system.js';\n\n/**\n * The icon migration state:\n * - DISABLED: No migration is performed.\n * - ENABLED: Migration is performed and logs a warning when an icon is migrated.\n * - ENABLED_WITHOUT_LOGGING: Migration is performed without logging warnings.\n */\ntype IconMigrationState = 'DISABLED' | 'ENABLED' | 'ENABLED_WITHOUT_LOGGING';\n\n/**\n * Get the migrated icon name for a given old icon name.\n * @param {string} iconName The old icon name\n * @param {boolean} enableLogging? Whether to enable logging for unmapped icons\n * @returns {string} The new icon name\n * @deprecated Consider moving to synergy 2025 icons directly. See https://synergy-design-system.github.io/?path=/docs/migration--docs for further details.\n */\nexport const migrateIconName = (\n  iconName: string,\n  enableLogging: boolean = false,\n) => {\n  let icon: string;\n\n  switch (iconName) {\n    case 'access_alarm': icon = 'alarm'; break;\n    case 'access_alarms': icon = 'alarm'; break;\n    case 'access_time': icon = 'schedule'; break;\n    case 'access_time_filled': icon = 'schedule'; break;\n    case 'account_tree_outline': icon = 'account_tree'; break;\n    case 'add_alarm': icon = 'alarm_add'; break;\n    case 'add_circle_outline': icon = 'add_circle'; break;\n    case 'add_ic_call': icon = 'add_call'; break;\n    case 'addchart': icon = 'add_chart'; break;\n    case 'announcement': icon = 'feedback'; break;\n    case 'app_settings_alt': icon = 'phonelink_setup'; break;\n    case 'arrow_range_outline': icon = 'arrow_range'; break;\n    case 'assessment': icon = 'insert_chart'; break;\n    case 'assistant_photo': icon = 'flag'; break;\n    case 'audiotrack': icon = 'music_note'; break;\n    case 'battery_std': icon = 'battery_full'; break;\n    case 'bluetooth_audio': icon = 'bluetooth_searching'; break;\n    case 'bookmark_border': icon = 'bookmark'; break;\n    case 'box_outline': icon = 'box'; break;\n    case 'browser_not_supported': icon = 'web_asset_off'; break;\n    case 'build_circle_outline': icon = 'build_circle'; break;\n    case 'business': icon = 'domain'; break;\n    case 'camera_alt': icon = 'photo_camera'; break;\n    case 'cancel_outline': icon = 'cancel'; break;\n    case 'card_giftcard': icon = 'redeem'; break;\n    case 'catching_pokemon': icon = 'sports_baseball'; break;\n    case 'center_focus_strong_outline': icon = 'center_focus_strong'; break;\n    case 'chat_bubble_outline': icon = 'chat_bubble'; break;\n    case 'check_circle_outline': icon = 'check_circle'; break;\n    case 'circle_outline': icon = 'circle'; break;\n    case 'class': icon = 'book'; break;\n    case 'clear': icon = 'close'; break;\n    case 'closed_caption_off': icon = 'closed_caption'; break;\n    case 'collections': icon = 'filter'; break;\n    case 'color_lens': icon = 'palette'; break;\n    case 'control_point': icon = 'add_circle'; break;\n    case 'conveyor_belt_outline': icon = 'conveyor_belt'; break;\n    case 'create': icon = 'edit'; break;\n    case 'crop_din': icon = 'crop_square'; break;\n    case 'crop_original': icon = 'image'; break;\n    case 'data_saver_off': icon = 'data_usage'; break;\n    case 'delete_outline': icon = 'delete'; break;\n    case 'delivery_dining': icon = 'moped'; break;\n    case 'directions_boat_filled': icon = 'directions_boat'; break;\n    case 'directions_bus_filled': icon = 'directions_bus'; break;\n    case 'directions_car_filled': icon = 'directions_car'; break;\n    case 'directions_railway_filled': icon = 'directions_railway'; break;\n    case 'directions_subway_filled': icon = 'directions_subway'; break;\n    case 'directions_transit': icon = 'directions_subway'; break;\n    case 'directions_transit_filled': icon = 'directions_subway'; break;\n    case 'discount': icon = 'sell'; break;\n    case 'do_disturb': icon = 'block'; break;\n    case 'do_disturb_alt': icon = 'block'; break;\n    case 'do_disturb_off': icon = 'block'; break;\n    case 'do_disturb_on': icon = 'do_not_disturb_on'; break;\n    case 'do_not_disturb': icon = 'do_not_disturb_off'; break;\n    case 'do_not_disturb_alt': icon = 'block'; break;\n    case 'drive_eta': icon = 'directions_car'; break;\n    case 'email': icon = 'mail'; break;\n    case 'emoji_emotions': icon = 'mood'; break;\n    case 'error_outline': icon = 'error'; break;\n    case 'favorite_border': icon = 'favorite'; break;\n    case 'feedback_outline': icon = 'feedback'; break;\n    case 'filter_alt_outline': icon = 'filter_alt'; break;\n    case 'fire_hydrant_alt': icon = 'fire_hydrant'; break;\n    case 'fitbit': icon = 'blur_on'; break;\n    case 'fmd_good': icon = 'location_on'; break;\n    case 'free_breakfast': icon = 'local_cafe'; break;\n    case 'games': icon = 'gamepad'; break;\n    case 'get_app': icon = 'file_download'; break;\n    case 'gpp_good': icon = 'verified_user'; break;\n    case 'gps_fixed': icon = 'my_location'; break;\n    case 'gps_not_fixed': icon = 'location_searching'; break;\n    case 'gps_off': icon = 'location_disabled'; break;\n    case 'headset': icon = 'headphones'; break;\n    case 'help_outline': icon = 'help'; break;\n    case 'highlight_alt': icon = 'ink_selection'; break;\n    case 'highlight_off': icon = 'cancel'; break;\n    case 'https': icon = 'lock'; break;\n    case 'import_export': icon = 'swap_vert'; break;\n    case 'info_outline': icon = 'info'; break;\n    case 'insert_chart_outlined': icon = 'insert_chart'; break;\n    case 'insert_comment': icon = 'comment'; break;\n    case 'insert_drive_file': icon = 'note'; break;\n    case 'insert_emoticon': icon = 'mood'; break;\n    case 'insert_invitation': icon = 'event'; break;\n    case 'insert_link': icon = 'link'; break;\n    case 'insert_photo': icon = 'image'; break;\n    case 'iso': icon = 'exposure'; break;\n    case 'laptop': icon = 'laptop_mac'; break;\n    case 'launch': icon = 'open_in_new'; break;\n    case 'local_airport': icon = 'flight'; break;\n    case 'local_grocery_store': icon = 'shopping_cart'; break;\n    case 'local_hotel': icon = 'hotel'; break;\n    case 'local_movies': icon = 'theaters'; break;\n    case 'local_offer': icon = 'sell'; break;\n    case 'local_phone': icon = 'call'; break;\n    case 'local_play': icon = 'local_activity'; break;\n    case 'local_printshop': icon = 'print'; break;\n    case 'loop': icon = 'sync'; break;\n    case 'mail_outline': icon = 'mail'; break;\n    case 'maps_home_work': icon = 'home_work'; break;\n    case 'markunread': icon = 'mail'; break;\n    case 'message': icon = 'chat'; break;\n    case 'mic_none': icon = 'mic'; break;\n    case 'miscellaneous_services': icon = 'manufacturing'; break;\n    case 'mode': icon = 'edit'; break;\n    case 'mode_edit': icon = 'edit'; break;\n    case 'mode_edit_outline': icon = 'edit'; break;\n    case 'money_off_csred': icon = 'money_off'; break;\n    case 'motion_photos_pause': icon = 'motion_photos_paused'; break;\n    case 'move_group_outline': icon = 'move_group'; break;\n    case 'movie_creation': icon = 'movie'; break;\n    case 'nightlight_round': icon = 'nightlight'; break;\n    case 'no_cell': icon = 'mobile_off'; break;\n    case 'no_encryption_gmailerrorred': icon = 'no_encryption'; break;\n    case 'not_interested': icon = 'block'; break;\n    case 'notifications_none': icon = 'notifications'; break;\n    case 'ondemand_video': icon = 'live_tv'; break;\n    case 'outlined_flag': icon = 'flag'; break;\n    case 'package_2_outline': icon = 'package_2'; break;\n    case 'package_outline': icon = 'package'; break;\n    case 'pallet_outline': icon = 'pallet'; break;\n    case 'pan_tool_outline': icon = 'pan_tool'; break;\n    case 'panorama_horizontal_select': icon = 'panorama_horizontal'; break;\n    case 'panorama_photosphere_select': icon = 'panorama_photosphere'; break;\n    case 'panorama_vertical_select': icon = 'panorama_vertical'; break;\n    case 'panorama_wide_angle_select': icon = 'panorama_wide_angle'; break;\n    case 'pause_circle_filled': icon = 'pause_circle'; break;\n    case 'pause_circle_outline': icon = 'pause_circle'; break;\n    case 'payment': icon = 'credit_card'; break;\n    case 'pending_outline': icon = 'pending'; break;\n    case 'people': icon = 'group'; break;\n    case 'people_alt': icon = 'group'; break;\n    case 'people_outline': icon = 'group'; break;\n    case 'perm_identity': icon = 'person'; break;\n    case 'person_add_alt': icon = 'person_add'; break;\n    case 'person_add_alt_1': icon = 'person_add'; break;\n    case 'person_outline': icon = 'person'; break;\n    case 'person_remove_alt_1': icon = 'person_remove'; break;\n    case 'personal_video': icon = 'monitor'; break;\n    case 'phone': icon = 'call'; break;\n    case 'phonelink': icon = 'devices'; break;\n    case 'photo_size_select_actual': icon = 'panorama'; break;\n    case 'pie_chart_outline': icon = 'pie_chart'; break;\n    case 'pix': icon = 'wallpaper'; break;\n    case 'place': icon = 'location_on'; break;\n    case 'play_circle_filled': icon = 'play_circle'; break;\n    case 'play_circle_outline': icon = 'play_circle'; break;\n    case 'plus_one': icon = 'exposure_plus_1'; break;\n    case 'poll': icon = 'insert_chart'; break;\n    case 'portrait': icon = 'account_box'; break;\n    case 'progress_activity_outline': icon = 'progress_activity'; break;\n    case 'query_builder': icon = 'schedule'; break;\n    case 'question_answer': icon = 'forum'; break;\n    case 'queue': icon = 'library_add'; break;\n    case 'remove_circle': icon = 'do_not_disturb_on'; break;\n    case 'remove_circle_outline': icon = 'do_not_disturb_on'; break;\n    case 'remove_red_eye': icon = 'visibility'; break;\n    case 'replay_circle_filled': icon = 'replay'; break;\n    case 'report_gmailerrorred': icon = 'report'; break;\n    case 'report_problem': icon = 'warning'; break;\n    case 'restore': icon = 'history'; break;\n    case 'room': icon = 'location_on'; break;\n    case 'rotate_90_degrees_cw_outline': icon = 'rotate_90_degrees_cw'; break;\n    case 'save_alt': icon = 'file_download'; break;\n    case 'sd_storage': icon = 'sd_card'; break;\n    case 'security_update': icon = 'system_update'; break;\n    case 'sentiment_satisfied_alt': icon = 'sentiment_satisfied'; break;\n    case 'settings_input_composite': icon = 'settings_input_component'; break;\n    case 'settings_outline': icon = 'settings'; break;\n    case 'shelves_outline': icon = 'shelves'; break;\n    case 'shop_2': icon = 'shop_two'; break;\n    case 'shortcut': icon = 'turn_right'; break;\n    case 'signal_cellular_no_sim': icon = 'no_sim'; break;\n    case 'signal_wifi_4_bar_lock': icon = 'wifi_lock'; break;\n    case 'signal_wifi_connected_no_internet_4': icon = 'signal_wifi_bad'; break;\n    case 'signal_wifi_statusbar_4_bar': icon = 'signal_wifi_4_bar'; break;\n    case 'signal_wifi_statusbar_connected_no_internet_4': icon = 'signal_wifi_statusbar_not_connected'; break;\n    case 'sim_card_alert': icon = 'sd_card_alert'; break;\n    case 'sms_outline': icon = 'sms'; break;\n    case 'source': icon = 'topic'; break;\n    case 'square_outline': icon = 'square'; break;\n    case 'star_border': icon = 'grade'; break;\n    case 'star_border_purple500': icon = 'star_rate'; break;\n    case 'star_outline': icon = 'star'; break;\n    case 'star_purple500': icon = 'star_rate'; break;\n    case 'stop_circle_outline': icon = 'stop_circle'; break;\n    case 'store_mall_directory': icon = 'store'; break;\n    case 'system_security_update': icon = 'system_update'; break;\n    case 'system_security_update_good': icon = 'security_update_good'; break;\n    case 'system_security_update_warning': icon = 'security_update_warning'; break;\n    case 'table_chart_outline': icon = 'table_chart'; break;\n    case 'tag_faces': icon = 'mood'; break;\n    case 'terrain': icon = 'landscape'; break;\n    case 'textsms': icon = 'sms'; break;\n    case 'thumb_down_alt': icon = 'thumb_down'; break;\n    case 'thumb_down_off_alt': icon = 'thumb_down_off'; break;\n    case 'thumb_up_alt': icon = 'thumb_up'; break;\n    case 'thumb_up_off_alt': icon = 'thumb_up_off'; break;\n    case 'time_to_leave': icon = 'directions_car'; break;\n    case 'timer_outline': icon = 'timer'; break;\n    case 'try': icon = 'reviews'; break;\n    case 'tungsten': icon = 'wb_incandescent'; break;\n    case 'turned_in': icon = 'bookmark'; break;\n    case 'turned_in_not': icon = 'bookmark'; break;\n    case 'visibility_off_outline': icon = 'visibility_off'; break;\n    case 'visibility_outline': icon = 'visibility'; break;\n    case 'warning_amber': icon = 'warning'; break;\n    case 'watch_later': icon = 'schedule'; break;\n    case 'wb_cloudy': icon = 'cloud_queue'; break;\n    case 'wb_incandescent_outline': icon = 'wb_incandescent'; break;\n    case 'window_outline': icon = 'window'; break;\n    case 'work_off': icon = 'enterprise_off'; break;\n    case 'work_outline': icon = 'work'; break;\n\n    // Default case: We have a direct mapping\n    default: icon = iconName;\n  }\n\n  if (enableLogging && icon !== iconName) {\n    // eslint-disable-next-line no-console\n    console.warn(`[Icon Migration] Mapped icon name \"${iconName}\" to \"${icon}\"`);\n  }\n\n  return icon;\n};\n\n/**\n * Get the migrated icon name for a given old icon name in its filled state.\n * @param {string} iconName The old icon name\n * @param {boolean} enableLogging? Whether to enable logging for unmapped icons\n * @returns {string} The new icon name\n * @deprecated Consider moving to synergy 2025 icons directly. See https://synergy-design-system.github.io/?path=/docs/migration--docs for further details.\n */\nexport const migrateIconNameFilled = (\n  iconName: string,\n  enableLogging: boolean = false,\n) => {\n  const baseIconName = migrateIconName(iconName, enableLogging);\n  return `${baseIconName}_fill`;\n};\n\n/**\n * Create an icon library for migrating old icon names to new icon names.\n * @param {IconMigrationState} withState The icon migration state\n * @returns {IconLibrary} The migration icon library\n * @deprecated Consider moving to synergy 2025 icons directly. See https://synergy-design-system.github.io/?path=/docs/migration--docs for further details.\n */\nexport const createMigrationLibrary = (withState: IconMigrationState = 'DISABLED'): IconLibrary => ({\n  name: 'default',\n  resolver: name => {\n    const mappedName = migrateIconName(name, withState === 'ENABLED');\n    return getBasePath(`assets/icons/${mappedName}.svg`);\n  },\n});\n\n/**\n * Default icon library for migrating old icon names to new icon names.\n * @deprecated Consider moving to synergy 2025 icons directly. See https://synergy-design-system.github.io/?path=/docs/migration--docs for further details.\n */\nexport const migrationLibrary = createMigrationLibrary('DISABLED');\n\n/**\n * Setup the system icon library.\n * @param iconset The system icon set to use\n * @param enableLogging Enable logging of migrated icons?\n * @returns The icon library used\n * @deprecated Consider moving to synergy 2025 icons directly. See https://synergy-design-system.github.io/?path=/docs/migration--docs for further details.\n */\nexport const setupIcons = (\n  iconset: AvailableSystemIcons = 'sick2025',\n  enableLogging: boolean = true,\n): IconLibrary => {\n  const iconlibraryToUse = iconset === 'sick2018'\n    ? defaultLibrary\n    : createMigrationLibrary(enableLogging ? 'ENABLED' : 'ENABLED_WITHOUT_LOGGING');\n\n  registerIconLibrary('default', iconlibraryToUse);\n  setSystemIconLibrary(iconset);\n\n  return iconlibraryToUse;\n};\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/chunks/{chunk.S22BO5SF.js → chunk.WRPQ3635.js}

@@ -12,4 +12,4 @@ var breadcrumb_styles_default = css`
 export {
   breadcrumb_styles_default
 };
-//# sourceMappingURL=chunk.S22BO5SF.js.map
+//# sourceMappingURL=chunk.WRPQ3635.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/breadcrumb/breadcrumb.styles.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n  .breadcrumb {\n    display: flex;\n    align-items: center;\n    flex-wrap: wrap;\n  }\n`;\n"],
+  "mappings": ";AACA,SAAS,WAAW;AAEpB,IAAO,4BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
+  "names": []
+}

package/dist/chunks/{chunk.4K75N3WR.js → chunk.WSPPSCSY.js}

@@ -1,6 +1,6 @@
 import {
   SynDialog
-} from "./chunk.DGU5AZZG.js";
+} from "./chunk.PPOTUWL3.js";
 
 // src/components/dialog/dialog.ts
 var dialog_default = SynDialog;
@@ -9,4 +9,4 @@ SynDialog.define("syn-dialog");
 export {
   dialog_default
 };
-//# sourceMappingURL=chunk.4K75N3WR.js.map
+//# sourceMappingURL=chunk.WSPPSCSY.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/dialog/dialog.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport SynDialog from './dialog.component.js';\n\nexport * from './dialog.component.js';\nexport default SynDialog;\n\nSynDialog.define('syn-dialog');\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'syn-dialog': SynDialog;\n  }\n}\n"],
+  "mappings": ";;;;;AAIA,IAAO,iBAAQ;AAEf,UAAU,OAAO,YAAY;",
+  "names": []
+}

package/dist/chunks/{chunk.SIX2VPOZ.js → chunk.WT3TWFBE.js}

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

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/breadcrumb/breadcrumb.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport SynBreadcrumb from './breadcrumb.component.js';\n\nexport * from './breadcrumb.component.js';\nexport default SynBreadcrumb;\n\nSynBreadcrumb.define('syn-breadcrumb');\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'syn-breadcrumb': SynBreadcrumb;\n  }\n}\n"],
+  "mappings": ";;;;;AAIA,IAAO,qBAAQ;AAEf,cAAc,OAAO,gBAAgB;",
+  "names": []
+}

package/dist/chunks/{chunk.4TB35TYG.js → chunk.X323W6VB.js}

@@ -171,4 +171,4 @@ var switch_styles_default = css`
 export {
   switch_styles_default
 };
-//# sourceMappingURL=chunk.4TB35TYG.js.map
+//# sourceMappingURL=chunk.X323W6VB.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/switch/switch.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  :host([size='small']) {\n    --height: var(--syn-toggle-size-small);\n    --thumb-size: calc(var(--syn-toggle-size-small) + 4px);\n    --width: calc(var(--height) * 2);\n\n    font-size: var(--syn-input-font-size-small);\n  }\n\n  :host([size='medium']) {\n    --height: var(--syn-toggle-size-medium);\n    --thumb-size: calc(var(--syn-toggle-size-medium) + 4px);\n    --width: calc(var(--height) * 2);\n\n    font-size: var(--syn-input-font-size-medium);\n  }\n\n  :host([size='large']) {\n    --height: var(--syn-toggle-size-large);\n    --thumb-size: calc(var(--syn-toggle-size-large) + 4px);\n    --width: calc(var(--height) * 2);\n\n    font-size: var(--syn-input-font-size-large);\n  }\n\n  .switch {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    font-family: var(--syn-input-font-family);\n    font-size: inherit;\n    font-weight: var(--syn-input-font-weight);\n    color: var(--syn-input-label-color);\n    vertical-align: middle;\n    cursor: pointer;\n  }\n\n  .switch__control {\n    flex: 0 0 auto;\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: var(--width);\n    height: var(--height);\n    background-color: var(--syn-color-neutral-400);\n    border: solid var(--syn-input-border-width) var(--syn-color-neutral-400);\n    border-radius: var(--height);\n    transition:\n      var(--syn-transition-fast) border-color,\n      var(--syn-transition-fast) background-color;\n  }\n\n  .switch__control .switch__thumb {\n    width: var(--thumb-size);\n    height: var(--thumb-size);\n    background-color: var(--syn-color-neutral-0);\n    border-radius: 50%;\n    border: solid var(--syn-input-border-width) var(--syn-color-neutral-400);\n    translate: calc((var(--width) - var(--height)) / -2);\n    transition:\n      var(--syn-transition-fast) translate ease,\n      var(--syn-transition-fast) background-color,\n      var(--syn-transition-fast) border-color,\n      var(--syn-transition-fast) box-shadow;\n  }\n\n  .switch__input {\n    position: absolute;\n    opacity: 0;\n    padding: 0;\n    margin: 0;\n    pointer-events: none;\n  }\n\n  /* Hover */\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n    background-color: var(--syn-color-neutral-400);\n    border-color: var(--syn-color-neutral-400);\n  }\n\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n    border-color: var(--syn-color-neutral-400);\n  }\n\n  /* Focus */\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n    background-color: var(--syn-color-neutral-400);\n    border-color: var(--syn-color-neutral-400);\n  }\n\n  .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n    border-color: var(--syn-color-primary-600);\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  /* Checked */\n  .switch--checked .switch__control {\n    background-color: var(--syn-color-primary-600);\n    border-color: var(--syn-color-primary-600);\n  }\n\n  .switch--checked .switch__control .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n    border-color: var(--syn-color-primary-600);\n    translate: calc((var(--width) - var(--height)) / 2);\n  }\n\n  /* Checked + hover */\n  .switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n    background-color: var(--syn-color-primary-600);\n    border-color: var(--syn-color-primary-600);\n  }\n\n  .switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n    border-color: var(--syn-color-primary-600);\n  }\n\n  /* Checked + focus */\n  .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n    background-color: var(--syn-color-primary-600);\n    border-color: var(--syn-color-primary-600);\n  }\n\n  .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n    background-color: var(--syn-color-neutral-0);\n    border-color: var(--syn-color-primary-600);\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  /* Disabled */\n  .switch--disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .switch__label {\n    display: inline-block;\n    line-height: var(--height);\n    margin-inline-start: 0.5em;\n    user-select: none;\n    -webkit-user-select: none;\n  }\n\n  :host([required]) .switch__label::after {\n    content: var(--syn-input-required-content);\n    color: var(--syn-input-required-content-color);\n    margin-inline-start: var(--syn-input-required-content-offset);\n  }\n\n  @media (forced-colors: active) {\n    .switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb,\n    .switch--checked .switch__control .switch__thumb {\n      background-color: ButtonText;\n    }\n  }\n`;\n"],
+  "mappings": ";AACA,SAAS,WAAW;AAEpB,IAAO,wBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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.6EPU7YUS.js → chunk.X5NFOV5A.js}

@@ -59,4 +59,4 @@ var tag_styles_default = css`
 export {
   tag_styles_default
 };
-//# sourceMappingURL=chunk.6EPU7YUS.js.map
+//# sourceMappingURL=chunk.X5NFOV5A.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/tag/tag.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  .tag {\n    display: flex;\n    align-items: center;\n    border: solid 1px;\n    line-height: 1;\n    white-space: nowrap;\n    user-select: none;\n    -webkit-user-select: none;\n  }\n\n  .tag__remove::part(base) {\n    color: inherit;\n    padding: 0;\n  }\n\n  /*\n   * Size modifiers\n   */\n\n  .tag--small {\n    font-size: var(--syn-button-font-size-small);\n    height: calc(var(--syn-input-height-small) * 0.8);\n    line-height: calc(var(--syn-input-height-small) - var(--syn-input-border-width) * 2);\n    border-radius: var(--syn-input-border-radius-small);\n    padding: 0 var(--syn-spacing-x-small);\n  }\n\n  .tag--medium {\n    font-size: var(--syn-button-font-size-medium);\n    height: calc(var(--syn-input-height-medium) * 0.8);\n    line-height: calc(var(--syn-input-height-medium) - var(--syn-input-border-width) * 2);\n    border-radius: var(--syn-input-border-radius-medium);\n    padding: 0 var(--syn-spacing-small);\n  }\n\n  .tag--large {\n    font-size: var(--syn-button-font-size-large);\n    height: calc(var(--syn-input-height-large) * 0.8);\n    line-height: calc(var(--syn-input-height-large) - var(--syn-input-border-width) * 2);\n    border-radius: var(--syn-input-border-radius-large);\n    padding: 0 var(--syn-spacing-medium);\n  }\n\n  .tag__remove {\n    margin-inline-start: var(--syn-spacing-x-small);\n  }\n\n  \n`;\n"],
+  "mappings": ";AACA,SAAS,WAAW;AAEpB,IAAO,qBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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.M7VZBJK4.js → chunk.XMOH46TX.js}

@@ -3,16 +3,16 @@ import {
 } from "./chunk.57RV2JXO.js";
 import {
   divider_styles_default
-} from "./chunk.FSZIE7IO.js";
+} from "./chunk.34A453XJ.js";
 import {
   watch
-} from "./chunk.JE5Y2YD7.js";
+} from "./chunk.SMIMHADA.js";
 import {
   component_styles_default
-} from "./chunk.NLYVOJGK.js";
+} from "./chunk.FXJLG622.js";
 import {
   SynergyElement
-} from "./chunk.FBQ7NUNW.js";
+} from "./chunk.VWFRCPN5.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -43,4 +43,4 @@ __decorateClass([
 export {
   SynDivider
 };
-//# sourceMappingURL=chunk.M7VZBJK4.js.map
+//# sourceMappingURL=chunk.XMOH46TX.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/divider/divider.component.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport { property } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './divider.styles.js';\nimport customStyles from './divider.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Dividers are used to visually separate or group elements.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-divider--docs\n * @status stable\n * @since 2.0\n *\n * @cssproperty --color - The color of the divider.\n * @cssproperty --width - The width of the divider.\n * @cssproperty --spacing - The spacing of the divider.\n */\nexport default class SynDivider extends SynergyElement {\n  static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n\n  /** Draws the divider in a vertical orientation. */\n  @property({ type: Boolean, reflect: true }) vertical = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'separator');\n  }\n\n  @watch('vertical')\n  handleVerticalChange() {\n    this.setAttribute('aria-orientation', this.vertical ? 'vertical' : 'horizontal');\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AACA,SAAS,gBAAgB;AAkBzB,IAAqB,aAArB,cAAwC,eAAe;AAAA,EAAvD;AAAA;AAI8C,oBAAW;AAAA;AAAA,EAEvD,oBAAoB;AAClB,UAAM,kBAAkB;AACxB,SAAK,aAAa,QAAQ,WAAW;AAAA,EACvC;AAAA,EAGA,uBAAuB;AACrB,SAAK,aAAa,oBAAoB,KAAK,WAAW,aAAa,YAAY;AAAA,EACjF;AACF;AAfqB,WACZ,SAAyB,CAAC,0BAAiB,wBAAQ,6BAAY;AAG1B;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAJvB,WAIyB;AAQ5C;AAAA,EADC,MAAM,UAAU;AAAA,GAXE,WAYnB;",
+  "names": []
+}

package/dist/chunks/{chunk.DQKV5FSY.js → chunk.XRSLCQH3.js}

@@ -154,4 +154,4 @@ export {
   getTabbableBoundary,
   getTabbableElements
 };
-//# sourceMappingURL=chunk.DQKV5FSY.js.map
+//# sourceMappingURL=chunk.XRSLCQH3.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/internal/active-elements.ts", "../../src/internal/tabbable.ts"],
+  "sourcesContent": ["/* eslint-disable */\n/**\n * Use a generator so we can iterate and possibly break early.\n * @example\n *   // to operate like a regular array. This kinda nullifies generator benefits, but worth knowing if you need the whole array.\n *   const allActiveElements = [...activeElements()]\n *\n *   // Early return\n *   for (const activeElement of activeElements()) {\n *     if (<cond>) {\n *       break; // Break the loop, dont need to iterate over the whole array or store an array in memory!\n *     }\n *   }\n */\nexport function* activeElements(activeElement: Element | null = document.activeElement): Generator<Element> {\n  if (activeElement === null || activeElement === undefined) return;\n\n  yield activeElement;\n\n  if ('shadowRoot' in activeElement && activeElement.shadowRoot && activeElement.shadowRoot.mode !== 'closed') {\n    yield* activeElements(activeElement.shadowRoot.activeElement);\n  }\n}\n\nexport function getDeepestActiveElement() {\n  return [...activeElements()].pop();\n}\n", "/* eslint-disable */\n// Cached compute style calls. This is specifically for browsers that dont support `checkVisibility()`.\n// computedStyle calls are \"live\" so they only need to be retrieved once for an element.\nconst computedStyleMap = new WeakMap<Element, CSSStyleDeclaration>();\n\nfunction getCachedComputedStyle(el: HTMLElement): CSSStyleDeclaration {\n  let computedStyle: undefined | CSSStyleDeclaration = computedStyleMap.get(el);\n\n  if (!computedStyle) {\n    computedStyle = window.getComputedStyle(el, null);\n    computedStyleMap.set(el, computedStyle);\n  }\n\n  return computedStyle;\n}\n\nfunction isVisible(el: HTMLElement): boolean {\n  // This is the fastest check, but isn't supported in Safari.\n  if (typeof el.checkVisibility === 'function') {\n    // Opacity is focusable, visibility is not.\n    return el.checkVisibility({ checkOpacity: false, checkVisibilityCSS: true });\n  }\n\n  // Fallback \"polyfill\" for \"checkVisibility\"\n  const computedStyle = getCachedComputedStyle(el);\n\n  return computedStyle.visibility !== 'hidden' && computedStyle.display !== 'none';\n}\n\n// While this behavior isn't standard in Safari / Chrome yet, I think it's the most reasonable\n// way of handling tabbable overflow areas. Browser sniffing seems gross, and it's the most\n// accessible way of handling overflow areas. [Konnor]\nfunction isOverflowingAndTabbable(el: HTMLElement): boolean {\n  const computedStyle = getCachedComputedStyle(el);\n\n  const { overflowY, overflowX } = computedStyle;\n\n  if (overflowY === 'scroll' || overflowX === 'scroll') {\n    return true;\n  }\n\n  if (overflowY !== 'auto' || overflowX !== 'auto') {\n    return false;\n  }\n\n  // Always overflow === \"auto\" by this point\n  const isOverflowingY = el.scrollHeight > el.clientHeight;\n\n  if (isOverflowingY && overflowY === 'auto') {\n    return true;\n  }\n\n  const isOverflowingX = el.scrollWidth > el.clientWidth;\n\n  if (isOverflowingX && overflowX === 'auto') {\n    return true;\n  }\n\n  return false;\n}\n\n/** Determines if the specified element is tabbable using heuristics inspired by https://github.com/focus-trap/tabbable */\nfunction isTabbable(el: HTMLElement) {\n  const tag = el.tagName.toLowerCase();\n\n  const tabindex = Number(el.getAttribute('tabindex'));\n  const hasTabindex = el.hasAttribute('tabindex');\n\n  // elements with a tabindex attribute that is either NaN or <= -1 are not tabbable\n  if (hasTabindex && (isNaN(tabindex) || tabindex <= -1)) {\n    return false;\n  }\n\n  // Elements with a disabled attribute are not tabbable\n  if (el.hasAttribute('disabled')) {\n    return false;\n  }\n\n  // If any parents have \"inert\", we aren't \"tabbable\"\n  if (el.closest('[inert]')) {\n    return false;\n  }\n\n  if (tag === 'input' && el.getAttribute('type') === 'radio') {\n    const rootNode = el.getRootNode() as HTMLElement;\n\n    const findRadios = `input[type='radio'][name=\"${el.getAttribute('name')}\"]`;\n    const firstChecked = rootNode.querySelector(`${findRadios}:checked`);\n\n    if (firstChecked) {\n      return firstChecked === el;\n    }\n\n    const firstRadio = rootNode.querySelector(findRadios);\n\n    return firstRadio === el;\n  }\n\n  if (!isVisible(el)) {\n    return false;\n  }\n\n  // Audio and video elements with the controls attribute are tabbable\n  if ((tag === 'audio' || tag === 'video') && el.hasAttribute('controls')) {\n    return true;\n  }\n\n  // Elements with a tabindex other than -1 are tabbable\n  if (el.hasAttribute('tabindex')) {\n    return true;\n  }\n\n  // Elements with a contenteditable attribute are tabbable\n  if (el.hasAttribute('contenteditable') && el.getAttribute('contenteditable') !== 'false') {\n    return true;\n  }\n\n  // At this point, the following elements are considered tabbable\n  const isNativelyTabbable = [\n    'button',\n    'input',\n    'select',\n    'textarea',\n    'a',\n    'audio',\n    'video',\n    'summary',\n    'iframe'\n  ].includes(tag);\n\n  if (isNativelyTabbable) {\n    return true;\n  }\n\n  // We save the overflow checks for last, because they're the most expensive\n  return isOverflowingAndTabbable(el);\n}\n\n/**\n * Returns the first and last bounding elements that are tabbable. This is more performant than checking every single\n * element because it short-circuits after finding the first and last ones.\n */\nexport function getTabbableBoundary(root: HTMLElement | ShadowRoot) {\n  const tabbableElements = getTabbableElements(root);\n\n  // Find the first and last tabbable elements\n  const start = tabbableElements[0] ?? null;\n  const end = tabbableElements[tabbableElements.length - 1] ?? null;\n\n  return { start, end };\n}\n\n/**\n * This looks funky. Basically a slot's children will always be picked up *if* they're within the `root` element.\n * However, there is an edge case when, if the `root` is wrapped by another shadow DOM, it won't grab the children.\n * This fixes that fun edge case.\n */\nfunction getSlottedChildrenOutsideRootElement(slotElement: HTMLSlotElement, root: HTMLElement | ShadowRoot) {\n  return (slotElement.getRootNode({ composed: true }) as ShadowRoot | null)?.host !== root;\n}\n\nexport function getTabbableElements(root: HTMLElement | ShadowRoot) {\n  const walkedEls = new WeakMap();\n  const tabbableElements: HTMLElement[] = [];\n\n  function walk(el: HTMLElement | ShadowRoot) {\n    if (el instanceof Element) {\n      // if the element has \"inert\" we can just no-op it.\n      if (el.hasAttribute('inert') || el.closest('[inert]')) {\n        return;\n      }\n\n      if (walkedEls.has(el)) {\n        return;\n      }\n      walkedEls.set(el, true);\n\n      if (!tabbableElements.includes(el) && isTabbable(el)) {\n        tabbableElements.push(el);\n      }\n\n      if (el instanceof HTMLSlotElement && getSlottedChildrenOutsideRootElement(el, root)) {\n        el.assignedElements({ flatten: true }).forEach((assignedEl: HTMLElement) => {\n          walk(assignedEl);\n        });\n      }\n\n      if (el.shadowRoot !== null && el.shadowRoot.mode === 'open') {\n        walk(el.shadowRoot);\n      }\n    }\n\n    for (const e of el.children) {\n      walk(e as HTMLElement);\n    }\n  }\n\n  // Collect all elements including the root\n  walk(root);\n\n  // Is this worth having? Most sorts will always add increased overhead. And positive tabindexes shouldn't really be used.\n  // So is it worth being right? Or fast?\n  return tabbableElements.sort((a, b) => {\n    // Make sure we sort by tabindex.\n    const aTabindex = Number(a.getAttribute('tabindex')) || 0;\n    const bTabindex = Number(b.getAttribute('tabindex')) || 0;\n    return bTabindex - aTabindex;\n  });\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/chunks/{chunk.ERWB2FQ7.js → chunk.XWRABNCX.js}

@@ -3,35 +3,35 @@ import {
 } from "./chunk.6USNG4EL.js";
 import {
   radio_group_styles_default
-} from "./chunk.K62NPKGN.js";
+} from "./chunk.YPYFEST2.js";
 import {
   form_control_custom_styles_default,
   form_control_styles_default
-} from "./chunk.G4URZQCL.js";
+} from "./chunk.PTRCO527.js";
 import {
   SynButtonGroup
-} from "./chunk.KTBISG3Q.js";
+} from "./chunk.EQ34CAWI.js";
 import {
   FormControlController,
   customErrorValidityState,
   validValidityState,
   valueMissingValidityState
-} from "./chunk.U5757NSE.js";
+} from "./chunk.J3GDDM6Q.js";
 import {
   HasSlotController
-} from "./chunk.WVVQK5TE.js";
+} from "./chunk.CHFWLQN5.js";
 import {
   enableDefaultSettings
-} from "./chunk.MLILJGXQ.js";
+} from "./chunk.YACUYJZN.js";
 import {
   watch
-} from "./chunk.JE5Y2YD7.js";
+} from "./chunk.SMIMHADA.js";
 import {
   component_styles_default
-} from "./chunk.NLYVOJGK.js";
+} from "./chunk.FXJLG622.js";
 import {
   SynergyElement
-} from "./chunk.FBQ7NUNW.js";
+} from "./chunk.VWFRCPN5.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -369,4 +369,4 @@ SynRadioGroup = __decorateClass([
 export {
   SynRadioGroup
 };
-//# sourceMappingURL=chunk.ERWB2FQ7.js.map
+//# sourceMappingURL=chunk.XWRABNCX.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/radio-group/radio-group.component.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport {\n  customErrorValidityState,\n  FormControlController,\n  validValidityState,\n  valueMissingValidityState\n} from '../../internal/form.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport { html } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\nimport formControlCustomStyles from '../../styles/form-control.custom.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynButtonGroup from '../button-group/button-group.component.js';\nimport styles from './radio-group.styles.js';\nimport customStyles from './radio-group.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\nimport type SynRadio from '../radio/radio.js';\nimport type SynRadioButton from '../radio-button/radio-button.js';\nimport { enableDefaultSettings } from '../../utilities/defaultSettings/decorator.js';\n\n/**\n * @summary Radio groups are used to group multiple [radios](/components/radio) or [radio buttons](/components/radio-button) so they function as a single form control.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-radio-group--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-button-group\n *\n * @slot - The default slot where `<syn-radio>` or `<syn-radio-button>` elements are placed.\n * @slot label - The radio group's label. Required for proper accessibility. Alternatively, you can use the `label`\n *  attribute.\n * @slot help-text - Text that describes how to use the radio group. Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-change - Emitted when the radio group's selected value changes.\n * @event syn-input - Emitted when the radio group receives user input.\n * @event syn-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The input's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart button-group - The button group that wraps radio buttons.\n * @csspart button-group__base - The button group's `base` part.\n */\n@enableDefaultSettings('SynRadioGroup')\nexport default class SynRadioGroup extends SynergyElement implements SynergyFormControl {\n  static styles: CSSResultGroup = [componentStyles, formControlStyles, styles, formControlCustomStyles, customStyles];\n  static dependencies = { 'syn-button-group': SynButtonGroup };\n\n  protected readonly formControlController = new FormControlController(this);\n  private readonly hasSlotController = new HasSlotController(this, 'help-text', 'label');\n  private customValidityMessage = '';\n  private validationTimeout: number;\n\n  @query('slot:not([name])') defaultSlot: HTMLSlotElement;\n  @query('.radio-group__validation-input') validationInput: HTMLInputElement;\n\n  @state() private hasButtonGroup = false;\n  @state() private errorMessage = '';\n  @state() defaultValue: string | number = '';\n\n  /**\n   * The radio group's label. Required for proper accessibility. If you need to display HTML, use the `label` slot\n   * instead.\n   */\n  @property() label = '';\n\n  /** The radio groups's help text. If you need to display HTML, use the `help-text` slot instead. */\n  @property({ attribute: 'help-text' }) helpText = '';\n\n  /** The name of the radio group, submitted as a name/value pair with form data. */\n  @property() name = 'option';\n\n  /** The current value of the radio group, submitted as a name/value pair with form data. */\n  @property({ reflect: true }) value: string | number = '';\n\n  /** The radio group's size. This size will be applied to all child radios and radio buttons. */\n  @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\n   * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in\n   * the same document or shadow root for this to work.\n   */\n  @property({ reflect: true }) form = '';\n\n  /** Ensures a child radio is checked before allowing the containing form to submit. */\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  /** Gets the validity state object */\n  get validity() {\n    const isRequiredAndEmpty = this.required && !this.value;\n    const hasCustomValidityMessage = this.customValidityMessage !== '';\n\n    if (hasCustomValidityMessage) {\n      return customErrorValidityState;\n    } else if (isRequiredAndEmpty) {\n      return valueMissingValidityState;\n    }\n\n    return validValidityState;\n  }\n\n  /** Gets the validation message */\n  get validationMessage() {\n    const isRequiredAndEmpty = this.required && !this.value;\n    const hasCustomValidityMessage = this.customValidityMessage !== '';\n\n    if (hasCustomValidityMessage) {\n      return this.customValidityMessage;\n    } else if (isRequiredAndEmpty) {\n      return this.validationInput.validationMessage;\n    }\n\n    return '';\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.defaultValue = this.value;\n  }\n\n  firstUpdated() {\n    this.formControlController.updateValidity();\n  }\n\n  private getAllRadios() {\n    return [...this.querySelectorAll<SynRadio | SynRadioButton>('syn-radio, syn-radio-button')];\n  }\n\n  private handleRadioClick(event: MouseEvent) {\n    const target = (event.target as HTMLElement).closest<SynRadio | SynRadioButton>('syn-radio, syn-radio-button')!;\n    const radios = this.getAllRadios();\n    const oldValue = this.value;\n\n    if (!target || target.disabled) {\n      return;\n    }\n\n    this.value = target.value;\n    radios.forEach(radio => (radio.checked = radio === target));\n\n    if (this.value !== oldValue) {\n      this.emit('syn-change');\n      this.emit('syn-input');\n    }\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    if (!['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', ' '].includes(event.key)) {\n      return;\n    }\n\n    const radios = this.getAllRadios().filter(radio => !radio.disabled);\n    const checkedRadio = radios.find(radio => radio.checked) ?? radios[0];\n    const incr = event.key === ' ' ? 0 : ['ArrowUp', 'ArrowLeft'].includes(event.key) ? -1 : 1;\n    const oldValue = this.value;\n    let index = radios.indexOf(checkedRadio) + incr;\n\n    if (index < 0) {\n      index = radios.length - 1;\n    }\n\n    if (index > radios.length - 1) {\n      index = 0;\n    }\n\n    this.getAllRadios().forEach(radio => {\n      radio.checked = false;\n\n      if (!this.hasButtonGroup) {\n        radio.setAttribute('tabindex', '-1');\n      }\n    });\n\n    this.value = radios[index].value;\n    radios[index].checked = true;\n\n    if (!this.hasButtonGroup) {\n      radios[index].setAttribute('tabindex', '0');\n      radios[index].focus();\n    } else {\n      radios[index].shadowRoot!.querySelector('button')!.focus();\n    }\n\n    if (this.value !== oldValue) {\n      this.emit('syn-change');\n      this.emit('syn-input');\n    }\n\n    event.preventDefault();\n  }\n\n  private handleLabelClick() {\n    this.focus();\n  }\n\n  private handleInvalid(event: Event) {\n    this.formControlController.setValidity(false);\n    this.formControlController.emitInvalidEvent(event);\n  }\n\n  private async syncRadioElements() {\n    const radios = this.getAllRadios();\n\n    await Promise.all(\n      // Sync the checked state and size\n      radios.map(async radio => {\n        await radio.updateComplete;\n        radio.checked = radio.value === this.value;\n        radio.size = this.size;\n      })\n    );\n\n    this.hasButtonGroup = radios.some(radio => radio.tagName.toLowerCase() === 'syn-radio-button');\n\n    if (radios.length > 0 && !radios.some(radio => radio.checked)) {\n      if (this.hasButtonGroup) {\n        const buttonRadio = radios[0].shadowRoot?.querySelector('button');\n\n        if (buttonRadio) {\n          buttonRadio.setAttribute('tabindex', '0');\n        }\n      } else {\n        radios[0].setAttribute('tabindex', '0');\n      }\n    }\n\n    if (this.hasButtonGroup) {\n      const buttonGroup = this.shadowRoot?.querySelector('syn-button-group');\n\n      if (buttonGroup) {\n        buttonGroup.disableRole = true;\n      }\n    }\n  }\n\n  private syncRadios() {\n    if (customElements.get('syn-radio') && customElements.get('syn-radio-button')) {\n      this.syncRadioElements();\n      return;\n    }\n\n    if (customElements.get('syn-radio')) {\n      this.syncRadioElements();\n    } else {\n      customElements.whenDefined('syn-radio').then(() => this.syncRadios());\n    }\n\n    if (customElements.get('syn-radio-button')) {\n      this.syncRadioElements();\n    } else {\n      // Rerun this handler when <syn-radio> or <syn-radio-button> is registered\n      customElements.whenDefined('syn-radio-button').then(() => this.syncRadios());\n    }\n  }\n\n  private updateCheckedRadio() {\n    const radios = this.getAllRadios();\n    radios.forEach(radio => (radio.checked = radio.value === this.value));\n    this.formControlController.setValidity(this.validity.valid);\n  }\n\n  @watch('size', { waitUntilFirstUpdate: true })\n  handleSizeChange() {\n    this.syncRadios();\n  }\n\n  @watch('value')\n  handleValueChange() {\n    if (this.hasUpdated) {\n      this.updateCheckedRadio();\n    }\n  }\n\n  /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */\n  checkValidity() {\n    const isRequiredAndEmpty = this.required && !this.value;\n    const hasCustomValidityMessage = this.customValidityMessage !== '';\n\n    if (isRequiredAndEmpty || hasCustomValidityMessage) {\n      this.formControlController.emitInvalidEvent();\n      return false;\n    }\n\n    return true;\n  }\n\n  /** Gets the associated form, if one exists. */\n  getForm(): HTMLFormElement | null {\n    return this.formControlController.getForm();\n  }\n\n  /** Checks for validity and shows the browser's validation message if the control is invalid. */\n  reportValidity(): boolean {\n    const isValid = this.validity.valid;\n\n    this.errorMessage = this.customValidityMessage || isValid ? '' : this.validationInput.validationMessage;\n    this.formControlController.setValidity(isValid);\n    this.validationInput.hidden = true;\n    clearTimeout(this.validationTimeout);\n\n    if (!isValid) {\n      // Show the browser's constraint validation message\n      this.validationInput.hidden = false;\n      this.validationInput.reportValidity();\n      this.validationTimeout = setTimeout(() => (this.validationInput.hidden = true), 10000) as unknown as number;\n    }\n\n    return isValid;\n  }\n\n  /** Sets a custom validation message. Pass an empty string to restore validity. */\n  setCustomValidity(message = '') {\n    this.customValidityMessage = message;\n    this.errorMessage = message;\n    this.validationInput.setCustomValidity(message);\n    this.formControlController.updateValidity();\n  }\n\n  /** Sets focus on the radio-group. */\n  public focus(options?: FocusOptions) {\n    const radios = this.getAllRadios();\n    const checked = radios.find(radio => radio.checked);\n    const firstEnabledRadio = radios.find(radio => !radio.disabled);\n    const radioToFocus = checked || firstEnabledRadio;\n\n    // Call focus for the checked radio\n    // If no radio is checked, focus the first one that is not disabled\n    if (radioToFocus) {\n      radioToFocus.focus(options);\n    }\n  }\n\n  render() {\n    const hasLabelSlot = this.hasSlotController.test('label');\n    const hasHelpTextSlot = this.hasSlotController.test('help-text');\n    const hasLabel = this.label ? true : !!hasLabelSlot;\n    const hasHelpText = this.helpText ? true : !!hasHelpTextSlot;\n    const defaultSlot = html`\n      <slot @slotchange=${this.syncRadios} @click=${this.handleRadioClick} @keydown=${this.handleKeyDown}></slot>\n    `;\n\n    return html`\n      <fieldset\n        part=\"form-control\"\n        class=${classMap({\n          'form-control': true,\n          'form-control--small': this.size === 'small',\n          'form-control--medium': this.size === 'medium',\n          'form-control--large': this.size === 'large',\n          'form-control--radio-group': true,\n          'form-control--has-label': hasLabel,\n          'form-control--has-help-text': hasHelpText\n        })}\n        role=\"radiogroup\"\n        aria-labelledby=\"label\"\n        aria-describedby=\"help-text\"\n        aria-errormessage=\"error-message\"\n      >\n        <label\n          part=\"form-control-label\"\n          id=\"label\"\n          class=\"form-control__label\"\n          aria-hidden=${hasLabel ? 'false' : 'true'}\n          @click=${this.handleLabelClick}\n        >\n          <slot name=\"label\">${this.label}</slot>\n        </label>\n\n        <div part=\"form-control-input\" class=\"form-control-input\">\n          <div class=\"visually-hidden\">\n            <div id=\"error-message\" aria-live=\"assertive\">${this.errorMessage}</div>\n            <label class=\"radio-group__validation\">\n              <input\n                type=\"text\"\n                class=\"radio-group__validation-input\"\n                ?required=${this.required}\n                tabindex=\"-1\"\n                hidden\n                @invalid=${this.handleInvalid}\n              />\n            </label>\n          </div>\n\n          ${this.hasButtonGroup\n            ? html`\n                <syn-button-group part=\"button-group\" exportparts=\"base:button-group__base\" role=\"presentation\">\n                  ${defaultSlot}\n                </syn-button-group>\n              `\n            : defaultSlot}\n        </div>\n\n        <div\n          part=\"form-control-help-text\"\n          id=\"help-text\"\n          class=\"form-control__help-text\"\n          aria-hidden=${hasHelpText ? 'false' : 'true'}\n        >\n          <slot name=\"help-text\">${this.helpText}</slot>\n        </div>\n      </fieldset>\n    `;\n  }\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/chunks/{chunk.YYZLHE7T.js → chunk.Y6ARGQPK.js}

@@ -1,18 +1,18 @@
 import {
   tab_panel_styles_default
-} from "./chunk.HVXG4JG6.js";
+} from "./chunk.6KIX3PER.js";
 import {
   tab_panel_custom_styles_default
 } from "./chunk.XHWYGYMQ.js";
 import {
   watch
-} from "./chunk.JE5Y2YD7.js";
+} from "./chunk.SMIMHADA.js";
 import {
   component_styles_default
-} from "./chunk.NLYVOJGK.js";
+} from "./chunk.FXJLG622.js";
 import {
   SynergyElement
-} from "./chunk.FBQ7NUNW.js";
+} from "./chunk.VWFRCPN5.js";
 import {
   __decorateClass
 } from "./chunk.MO2GTRUM.js";
@@ -64,4 +64,4 @@ __decorateClass([
 export {
   SynTabPanel
 };
-//# sourceMappingURL=chunk.YYZLHE7T.js.map
+//# sourceMappingURL=chunk.Y6ARGQPK.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/tab-panel/tab-panel.component.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport styles from './tab-panel.styles.js';\nimport customStyles from './tab-panel.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\n\nlet id = 0;\n\n/**\n * @summary Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-tab-panel--docs\n * @status stable\n * @since 2.0\n *\n * @slot - The tab panel's content.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --padding - The tab panel's padding.\n */\nexport default class SynTabPanel extends SynergyElement {\n  static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n\n  private readonly attrId = ++id;\n  private readonly componentId = `syn-tab-panel-${this.attrId}`;\n\n  /** The tab panel's name. */\n  @property({ reflect: true }) name = '';\n\n  /** When true, the tab panel will be shown. */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.id = this.id.length > 0 ? this.id : this.componentId;\n    this.setAttribute('role', 'tabpanel');\n  }\n\n  @watch('active')\n  handleActiveChange() {\n    this.setAttribute('aria-hidden', this.active ? 'false' : 'true');\n  }\n\n  render() {\n    return html`\n      <slot\n        part=\"base\"\n        class=${classMap({\n          'tab-panel': true,\n          'tab-panel--active': this.active\n        })}\n      ></slot>\n    `;\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AACA,SAAS,gBAAgB;AACzB,SAAS,YAAY;AACrB,SAAS,gBAAgB;AAQzB,IAAI,KAAK;AAcT,IAAqB,cAArB,cAAyC,eAAe;AAAA,EAAxD;AAAA;AAGE,SAAiB,SAAS,EAAE;AAC5B,SAAiB,cAAc,iBAAiB,KAAK,MAAM;AAG9B,gBAAO;AAGQ,kBAAS;AAAA;AAAA,EAErD,oBAAoB;AAClB,UAAM,kBAAkB;AACxB,SAAK,KAAK,KAAK,GAAG,SAAS,IAAI,KAAK,KAAK,KAAK;AAC9C,SAAK,aAAa,QAAQ,UAAU;AAAA,EACtC;AAAA,EAGA,qBAAqB;AACnB,SAAK,aAAa,eAAe,KAAK,SAAS,UAAU,MAAM;AAAA,EACjE;AAAA,EAEA,SAAS;AACP,WAAO;AAAA;AAAA;AAAA,gBAGK,SAAS;AAAA,MACf,aAAa;AAAA,MACb,qBAAqB,KAAK;AAAA,IAC5B,CAAC,CAAC;AAAA;AAAA;AAAA,EAGR;AACF;AAlCqB,YACZ,SAAyB,CAAC,0BAAiB,0BAAQ,+BAAY;AAMzC;AAAA,EAA5B,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GAPR,YAOU;AAGe;AAAA,EAA3C,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAVvB,YAUyB;AAS5C;AAAA,EADC,MAAM,QAAQ;AAAA,GAlBI,YAmBnB;",
+  "names": []
+}

package/dist/chunks/{chunk.MLILJGXQ.js → chunk.YACUYJZN.js}

@@ -2,7 +2,7 @@ import {
   addGlobalEventNotification,
   extractDefaultSettingsForElement,
   removeGlobalEventNotification
-} from "./chunk.2WOSSTKK.js";
+} from "./chunk.RY3ZM7MQ.js";
 import {
   __privateAdd,
   __privateGet,
@@ -83,4 +83,4 @@ function enableDefaultSettings(name) {
 export {
   enableDefaultSettings
 };
-//# sourceMappingURL=chunk.MLILJGXQ.js.map
+//# sourceMappingURL=chunk.YACUYJZN.js.map

package/dist/chunks/{chunk.EHSNF4SS.js → chunk.YITQ6NLI.js}

@@ -118,4 +118,4 @@ var radio_styles_default = css`
 export {
   radio_styles_default
 };
-//# sourceMappingURL=chunk.EHSNF4SS.js.map
+//# sourceMappingURL=chunk.YITQ6NLI.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/radio/radio.styles.ts"],
+  "sourcesContent": ["/* eslint-disable */\nimport { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n  :host {\n    display: block;\n  }\n\n  :host(:focus-visible) {\n    outline: 0px;\n  }\n\n  .radio {\n    display: inline-flex;\n    align-items: top;\n    font-family: var(--syn-input-font-family);\n    font-size: var(--syn-input-font-size-medium);\n    font-weight: var(--syn-input-font-weight);\n    color: var(--syn-input-label-color);\n    vertical-align: middle;\n    cursor: pointer;\n  }\n\n  .radio--small {\n    --toggle-size: var(--syn-toggle-size-small);\n    font-size: var(--syn-input-font-size-small);\n  }\n\n  .radio--medium {\n    --toggle-size: var(--syn-toggle-size-medium);\n    font-size: var(--syn-input-font-size-medium);\n  }\n\n  .radio--large {\n    --toggle-size: var(--syn-toggle-size-large);\n    font-size: var(--syn-input-font-size-large);\n  }\n\n  .radio__checked-icon {\n    display: inline-flex;\n    width: var(--toggle-size);\n    height: var(--toggle-size);\n  }\n\n  .radio__control {\n    flex: 0 0 auto;\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: var(--toggle-size);\n    height: var(--toggle-size);\n    border: solid var(--syn-input-border-width) var(--syn-input-border-color);\n    border-radius: 50%;\n    background-color: var(--syn-input-background-color);\n    color: transparent;\n    transition:\n      var(--syn-transition-fast) border-color,\n      var(--syn-transition-fast) background-color,\n      var(--syn-transition-fast) color,\n      var(--syn-transition-fast) box-shadow;\n  }\n\n  .radio__input {\n    position: absolute;\n    opacity: 0;\n    padding: 0;\n    margin: 0;\n    pointer-events: none;\n  }\n\n  /* Hover */\n  .radio:not(.radio--checked):not(.radio--disabled) .radio__control:hover {\n    border-color: var(--syn-input-border-color-hover);\n    background-color: var(--syn-input-background-color-hover);\n  }\n\n  /* Checked */\n  .radio--checked .radio__control {\n    color: var(--syn-color-neutral-0);\n    border-color: var(--syn-color-primary-600);\n    background-color: var(--syn-color-primary-600);\n  }\n\n  /* Checked + hover */\n  .radio.radio--checked:not(.radio--disabled) .radio__control:hover {\n    border-color: var(--syn-color-primary-500);\n    background-color: var(--syn-color-primary-500);\n  }\n\n  /* Checked + focus */\n  :host(:focus-visible) .radio__control {\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  /* Disabled */\n  .radio--disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  /* When the control isn't checked, hide the circle for Windows High Contrast mode a11y */\n  .radio:not(.radio--checked) svg circle {\n    opacity: 0;\n  }\n\n  .radio__label {\n    display: inline-block;\n    color: var(--syn-input-label-color);\n    line-height: var(--toggle-size);\n    margin-inline-start: 0.5em;\n    user-select: none;\n    -webkit-user-select: none;\n  }\n`;\n"],
+  "mappings": ";AACA,SAAS,WAAW;AAEpB,IAAO,uBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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": []
+}