@synergy-design-system/react 2.31.0-numeric.1 → 2.31.0-numeric.3

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/alert.ts"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/alert/alert.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynShowEvent } from '@synergy-design-system/components';\nimport type { SynAfterShowEvent } from '@synergy-design-system/components';\nimport type { SynHideEvent } from '@synergy-design-system/components';\nimport type { SynAfterHideEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-alert';\nComponent.define('syn-alert');\n\n/**\n * @summary Alerts are used to display important messages inline or as toast notifications.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-alert--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon-button\n *\n * @slot - The alert's main content.\n * @slot icon - An icon to show in the alert. Works best with `<syn-icon>`.\n *\n * @event syn-show - Emitted when the alert opens.\n * @event syn-after-show - Emitted after the alert opens and all animations are complete.\n * @event syn-hide - Emitted when the alert closes.\n * @event syn-after-hide - Emitted after the alert closes and all animations are complete.\n *\n * @csspart base - The component's base wrapper.\n * @csspart icon - The container that wraps the optional icon.\n * @csspart message - The container that wraps the alert's main content.\n * @csspart close-button - The close button, an `<syn-icon-button>`.\n * @csspart close-button__base - The close button's exported `base` part.\n *\n * @animation alert.show - The animation to use when showing the alert.\n * @animation alert.hide - The animation to use when hiding the alert.\n */\nexport const SynAlert = createComponent({\n  displayName: 'SynAlert',\n  elementClass: Component,\n  events: {\n    onSynShow: 'syn-show' as EventName<SynShowEvent>,\n    onSynAfterShow: 'syn-after-show' as EventName<SynAfterShowEvent>,\n    onSynHide: 'syn-hide' as EventName<SynHideEvent>,\n    onSynAfterHide: 'syn-after-hide' as EventName<SynAfterHideEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynShowEvent } from '@synergy-design-system/components';\nexport type { SynAfterShowEvent } from '@synergy-design-system/components';\nexport type { SynHideEvent } from '@synergy-design-system/components';\nexport type { SynAfterHideEvent } from '@synergy-design-system/components';\n"],
+  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAQtB,IAAM,UAAU;AAChB,UAAU,OAAO,WAAW;AA2BrB,IAAM,WAAW,gBAAgB;AAAA,EACtC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,gBAAgB;AAAA,EAClB;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
+  "names": []
+}

package/dist/chunks/{chunk.DDVND3A3.js → chunk.KIEXMLKV.js}

@@ -26,4 +26,4 @@ var SynSelect = createComponent({
 export {
   SynSelect
 };
-//# sourceMappingURL=chunk.DDVND3A3.js.map
+//# sourceMappingURL=chunk.KIEXMLKV.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/select.ts"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/select/select.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynChangeEvent } from '@synergy-design-system/components';\nimport type { SynClearEvent } from '@synergy-design-system/components';\nimport type { SynInputEvent } from '@synergy-design-system/components';\nimport type { SynFocusEvent } from '@synergy-design-system/components';\nimport type { SynBlurEvent } from '@synergy-design-system/components';\nimport type { SynShowEvent } from '@synergy-design-system/components';\nimport type { SynAfterShowEvent } from '@synergy-design-system/components';\nimport type { SynHideEvent } from '@synergy-design-system/components';\nimport type { SynAfterHideEvent } from '@synergy-design-system/components';\nimport type { SynInvalidEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-select';\nComponent.define('syn-select');\n\n/**\n * @summary Selects allow you to choose items from a menu of predefined options.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-select--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n * @dependency syn-popup\n * @dependency syn-tag\n *\n * @slot - The listbox options. Must be `<syn-option>` elements. You can use `<syn-divider>` to group items visually.\n * @slot label - The input's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the combobox.\n * @slot suffix - Used to append a presentational icon or similar element to the combobox.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot expand-icon - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-change - Emitted when the control's value changes.\n * @event syn-clear - Emitted when the control's value is cleared.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-show - Emitted when the select's menu opens.\n * @event syn-after-show - Emitted after the select's menu opens and all animations are complete.\n * @event syn-hide - Emitted when the select's menu closes.\n * @event syn-after-hide - Emitted after the select's menu closes and all animations are complete.\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 select's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart combobox - The container the wraps the prefix, suffix, combobox, clear icon, and expand button.\n * @csspart prefix - The container that wraps the prefix slot.\n * @csspart suffix - The container that wraps the suffix slot.\n * @csspart display-input - The element that displays the selected option's label, an `<input>` element.\n * @csspart listbox - The listbox container where options are slotted.\n * @csspart tags - The container that houses option tags when `multiselect` is used.\n * @csspart tag - The individual tags that represent each multiselect option.\n * @csspart tag__base - The tag's base part.\n * @csspart tag__content - The tag's content part.\n * @csspart tag__remove-button - The tag's remove button.\n * @csspart tag__remove-button__base - The tag's remove button base part.\n * @csspart clear-button - The clear button.\n * @csspart expand-icon - The container that wraps the expand icon.\n * @csspart popup - The popup's exported `popup` part. Use this to target the tooltip's popup container.\n */\nexport const SynSelect = createComponent({\n  displayName: 'SynSelect',\n  elementClass: Component,\n  events: {\n    onSynChange: 'syn-change' as EventName<SynChangeEvent>,\n    onSynClear: 'syn-clear' as EventName<SynClearEvent>,\n    onSynInput: 'syn-input' as EventName<SynInputEvent>,\n    onSynFocus: 'syn-focus' as EventName<SynFocusEvent>,\n    onSynBlur: 'syn-blur' as EventName<SynBlurEvent>,\n    onSynShow: 'syn-show' as EventName<SynShowEvent>,\n    onSynAfterShow: 'syn-after-show' as EventName<SynAfterShowEvent>,\n    onSynHide: 'syn-hide' as EventName<SynHideEvent>,\n    onSynAfterHide: 'syn-after-hide' as EventName<SynAfterHideEvent>,\n    onSynInvalid: 'syn-invalid' as EventName<SynInvalidEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynChangeEvent } from '@synergy-design-system/components';\nexport type { SynClearEvent } from '@synergy-design-system/components';\nexport type { SynInputEvent } from '@synergy-design-system/components';\nexport type { SynFocusEvent } from '@synergy-design-system/components';\nexport type { SynBlurEvent } from '@synergy-design-system/components';\nexport type { SynShowEvent } from '@synergy-design-system/components';\nexport type { SynAfterShowEvent } from '@synergy-design-system/components';\nexport type { SynHideEvent } from '@synergy-design-system/components';\nexport type { SynAfterHideEvent } from '@synergy-design-system/components';\nexport type { SynInvalidEvent } from '@synergy-design-system/components';\n"],
+  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AActB,IAAM,UAAU;AAChB,UAAU,OAAO,YAAY;AAkDtB,IAAM,YAAY,gBAAgB;AAAA,EACvC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,cAAc;AAAA,EAChB;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
+  "names": []
+}

package/dist/chunks/{chunk.UXXOSB4A.js → chunk.LGYMTFIO.js}

@@ -15,4 +15,4 @@ var SynBreadcrumb = createComponent({
 export {
   SynBreadcrumb
 };
-//# sourceMappingURL=chunk.UXXOSB4A.js.map
+//# sourceMappingURL=chunk.LGYMTFIO.js.map

package/dist/chunks/{chunk.UXXOSB4A.js.map → chunk.LGYMTFIO.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/breadcrumb.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/breadcrumb/breadcrumb.component.js';\n\nconst tagName = 'syn-breadcrumb';\nComponent.define('syn-breadcrumb');\n\n/**\n * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n * @documentation https://synergy.style/components/breadcrumb\n * @status stable\n * @since 2.0\n *\n * @slot - One or more breadcrumb items to display.\n * @slot separator - The separator to use between breadcrumb items. Works best with `<syn-icon>`.\n *\n * @dependency syn-icon\n *\n * @csspart base - The component's base wrapper.\n */\nexport const SynBreadcrumb = createComponent({\n  displayName: 'SynBreadcrumb',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/breadcrumb/breadcrumb.component.js';\n\nconst tagName = 'syn-breadcrumb';\nComponent.define('syn-breadcrumb');\n\n/**\n * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-breadcrumb--docs\n * @status stable\n * @since 2.0\n *\n * @slot - One or more breadcrumb items to display.\n * @slot separator - The separator to use between breadcrumb items. Works best with `<syn-icon>`.\n *\n * @dependency syn-icon\n *\n * @csspart base - The component's base wrapper.\n */\nexport const SynBreadcrumb = createComponent({\n  displayName: 'SynBreadcrumb',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
   "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAEtB,IAAM,UAAU;AAChB,UAAU,OAAO,gBAAgB;AAe1B,IAAM,gBAAgB,gBAAgB;AAAA,EAC3C,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ,CAAC;AAAA,EACT,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/chunks/{chunk.TH46P32E.js → chunk.NHMTOMGM.js}

@@ -15,4 +15,4 @@ var SynRangeTick = createComponent({
 export {
   SynRangeTick
 };
-//# sourceMappingURL=chunk.TH46P32E.js.map
+//# sourceMappingURL=chunk.NHMTOMGM.js.map

package/dist/chunks/{chunk.TH46P32E.js.map → chunk.NHMTOMGM.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/range-tick.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/range-tick/range-tick.component.js';\n\nconst tagName = 'syn-range-tick';\nComponent.define('syn-range-tick');\n\n/**\n * @summary Ticks visually improve positioning on range sliders.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-range--docs\n * @status stable\n *\n * @slot - The tick's label\n *\n * @csspart base - The component's base wrapper.\n * @csspart label - The component's label.\n * @csspart line - The component's tick line.\n *\n * @cssproperty --tick-height - The height of the tick marker.\n * @cssproperty --tick-label-top - The top offset of the tick label.\n */\nexport const SynRangeTick = createComponent({\n  displayName: 'SynRangeTick',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/range-tick/range-tick.component.js';\n\nconst tagName = 'syn-range-tick';\nComponent.define('syn-range-tick');\n\n/**\n * @summary Ticks visually improve positioning on range sliders.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-range-tick--docs\n * @status stable\n *\n * @slot - The tick's label\n *\n * @csspart base - The component's base wrapper.\n * @csspart label - The component's label.\n * @csspart line - The component's tick line.\n *\n * @cssproperty --tick-height - The height of the tick marker.\n * @cssproperty --tick-label-top - The top offset of the tick label.\n */\nexport const SynRangeTick = createComponent({\n  displayName: 'SynRangeTick',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
   "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAEtB,IAAM,UAAU;AAChB,UAAU,OAAO,gBAAgB;AAgB1B,IAAM,eAAe,gBAAgB;AAAA,EAC1C,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ,CAAC;AAAA,EACT,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/chunks/{chunk.7T7PO2AE.js → chunk.NI6PGSHP.js}

@@ -17,4 +17,4 @@ var SynTag = createComponent({
 export {
   SynTag
 };
-//# sourceMappingURL=chunk.7T7PO2AE.js.map
+//# sourceMappingURL=chunk.NI6PGSHP.js.map

package/dist/chunks/{chunk.7T7PO2AE.js.map → chunk.NI6PGSHP.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/tag.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/tag/tag.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynRemoveEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-tag';\nComponent.define('syn-tag');\n\n/**\n * @summary Tags are used as labels to organize things or to indicate a selection.\n * @documentation https://synergy.style/components/tag\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon-button\n *\n * @slot - The tag's content.\n *\n * @event syn-remove - Emitted when the remove button is activated.\n *\n * @csspart base - The component's base wrapper.\n * @csspart content - The tag's content.\n * @csspart remove-button - The tag's remove button, an `<syn-icon-button>`.\n * @csspart remove-button__base - The remove button's exported `base` part.\n */\nexport const SynTag = createComponent({\n  displayName: 'SynTag',\n  elementClass: Component,\n  events: {\n    onSynRemove: 'syn-remove' as EventName<SynRemoveEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynRemoveEvent } from '@synergy-design-system/components';\n"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/tag/tag.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynRemoveEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-tag';\nComponent.define('syn-tag');\n\n/**\n * @summary Tags are used as labels to organize things or to indicate a selection.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-tag--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon-button\n *\n * @slot - The tag's content.\n *\n * @event syn-remove - Emitted when the remove button is activated.\n *\n * @csspart base - The component's base wrapper.\n * @csspart content - The tag's content.\n * @csspart remove-button - The tag's remove button, an `<syn-icon-button>`.\n * @csspart remove-button__base - The remove button's exported `base` part.\n */\nexport const SynTag = createComponent({\n  displayName: 'SynTag',\n  elementClass: Component,\n  events: {\n    onSynRemove: 'syn-remove' as EventName<SynRemoveEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynRemoveEvent } from '@synergy-design-system/components';\n"],
   "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAKtB,IAAM,UAAU;AAChB,UAAU,OAAO,SAAS;AAmBnB,IAAM,SAAS,gBAAgB;AAAA,EACpC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,aAAa;AAAA,EACf;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/chunks/{chunk.MVPHDQZO.js → chunk.NR7V6QX5.js}

@@ -15,4 +15,4 @@ var SynMenuLabel = createComponent({
 export {
   SynMenuLabel
 };
-//# sourceMappingURL=chunk.MVPHDQZO.js.map
+//# sourceMappingURL=chunk.NR7V6QX5.js.map

package/dist/chunks/{chunk.MVPHDQZO.js.map → chunk.NR7V6QX5.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/menu-label.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/menu-label/menu-label.component.js';\n\nconst tagName = 'syn-menu-label';\nComponent.define('syn-menu-label');\n\n/**\n * @summary Menu labels are used to describe a group of menu items.\n * @documentation https://synergy.style/components/menu-label\n * @status stable\n * @since 2.0\n *\n * @dependency syn-divider\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 * @cssproperty --display-divider - Display property of the divider. Defaults to \"block\"\n */\nexport const SynMenuLabel = createComponent({\n  displayName: 'SynMenuLabel',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/menu-label/menu-label.component.js';\n\nconst tagName = 'syn-menu-label';\nComponent.define('syn-menu-label');\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 * @dependency syn-divider\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 * @cssproperty --display-divider - Display property of the divider. Defaults to \"block\"\n */\nexport const SynMenuLabel = createComponent({\n  displayName: 'SynMenuLabel',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
   "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAEtB,IAAM,UAAU;AAChB,UAAU,OAAO,gBAAgB;AAkB1B,IAAM,eAAe,gBAAgB;AAAA,EAC1C,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ,CAAC;AAAA,EACT,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/chunks/{chunk.6B45LKRT.js → chunk.OJAJTT5S.js}

@@ -15,4 +15,4 @@ var SynCard = createComponent({
 export {
   SynCard
 };
-//# sourceMappingURL=chunk.6B45LKRT.js.map
+//# sourceMappingURL=chunk.OJAJTT5S.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/card.ts"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/card/card.component.js';\n\nconst tagName = 'syn-card';\nComponent.define('syn-card');\n\n/**\n * @summary Cards can be used to group related subjects in a container.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-card--docs\n * @status stable\n * @since 2.0\n *\n * @slot - The card's main content.\n * @slot header - An optional header for the card.\n * @slot footer - An optional footer for the card.\n * @slot image - An optional image to render at the start of the card.\n *\n * @csspart base - The component's base wrapper.\n * @csspart image - The container that wraps the card's image.\n * @csspart header - The container that wraps the card's header.\n * @csspart body - The container that wraps the card's main content.\n * @csspart footer - The container that wraps the card's footer.\n *\n * @cssproperty --border-color - The card's border color, including borders that occur inside the card.\n * @cssproperty --border-radius - The border radius for the card's edges.\n * @cssproperty --border-width - The width of the card's borders.\n * @cssproperty --padding - The padding to use for the card's sections.\n */\nexport const SynCard = createComponent({\n  displayName: 'SynCard',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
+  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAEtB,IAAM,UAAU;AAChB,UAAU,OAAO,UAAU;AAwBpB,IAAM,UAAU,gBAAgB;AAAA,EACrC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ,CAAC;AAAA,EACT,OAAO;AAAA,EACP;AACF,CAAC;",
+  "names": []
+}

package/dist/chunks/{chunk.GKNFFLCU.js → chunk.PNGPHPUN.js}

@@ -21,4 +21,4 @@ var SynTextarea = createComponent({
 export {
   SynTextarea
 };
-//# sourceMappingURL=chunk.GKNFFLCU.js.map
+//# sourceMappingURL=chunk.PNGPHPUN.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/textarea.ts"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/textarea/textarea.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynBlurEvent } from '@synergy-design-system/components';\nimport type { SynChangeEvent } from '@synergy-design-system/components';\nimport type { SynFocusEvent } from '@synergy-design-system/components';\nimport type { SynInputEvent } from '@synergy-design-system/components';\nimport type { SynInvalidEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-textarea';\nComponent.define('syn-textarea');\n\n/**\n * @summary Textareas collect data from the user and allow multiple lines of text.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-textarea--docs\n * @status stable\n * @since 2.0\n *\n * @slot label - The textarea's label. Alternatively, you can use the `label` attribute.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-change - Emitted when an alteration to the control's value is committed by the user.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-input - Emitted when the control receives 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 base - The component's base wrapper.\n * @csspart textarea - The internal `<textarea>` control.\n */\nexport const SynTextarea = createComponent({\n  displayName: 'SynTextarea',\n  elementClass: Component,\n  events: {\n    onSynBlur: 'syn-blur' as EventName<SynBlurEvent>,\n    onSynChange: 'syn-change' as EventName<SynChangeEvent>,\n    onSynFocus: 'syn-focus' as EventName<SynFocusEvent>,\n    onSynInput: 'syn-input' as EventName<SynInputEvent>,\n    onSynInvalid: 'syn-invalid' as EventName<SynInvalidEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynBlurEvent } from '@synergy-design-system/components';\nexport type { SynChangeEvent } from '@synergy-design-system/components';\nexport type { SynFocusEvent } from '@synergy-design-system/components';\nexport type { SynInputEvent } from '@synergy-design-system/components';\nexport type { SynInvalidEvent } from '@synergy-design-system/components';\n"],
+  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAStB,IAAM,UAAU;AAChB,UAAU,OAAO,cAAc;AAwBxB,IAAM,cAAc,gBAAgB;AAAA,EACzC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
+  "names": []
+}

package/dist/chunks/{chunk.F5L52MC2.js → chunk.QPSDGNGC.js}

@@ -15,4 +15,4 @@ var SynPrioNav = createComponent({
 export {
   SynPrioNav
 };
-//# sourceMappingURL=chunk.F5L52MC2.js.map
+//# sourceMappingURL=chunk.QPSDGNGC.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/prio-nav.ts"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/prio-nav/prio-nav.component.js';\n\nconst tagName = 'syn-prio-nav';\nComponent.define('syn-prio-nav');\n\n/**\n * @summary The `<syn-prio-nav />` element provides a generic navigation bar\n * that can be used to group multiple navigation items  (usually horizontal `<syn-nav-item />`s)\n * together. It will automatically group all items not visible in the viewport into a custom\n * priority menu.\n *\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-prio-nav--docs\n * @example\n * <syn-prio-nav>\n *  <syn-nav-item current horizontal>Item 1</syn-nav-item>\n *  <button role=\"menuitem\">Item 2 (custom)</button>\n *  <syn-nav-item horizontal>Item 3</syn-nav-item>\n * </syn-prio-nav>\n *\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-prio-nav--docs\n * @status stable\n * @since 1.14.0\n *\n * @dependency syn-dropdown\n * @dependency syn-icon\n * @dependency syn-menu\n * @dependency syn-nav-item\n *\n * @slot - The given navigation items. Must be horizontal `<syn-nav-item>`s\n *    or have a role of \"menuitem\"\n *\n * @csspart base - The component's base wrapper.\n * @csspart priority-menu - The wrapper around the priority menu\n * @csspart priority-menu-nav-item - The navigation item for the priority menu\n * @csspart priority-menu-label - The label for the priority menu\n * @csspart priority-menu-icon - The icon for the priority menu\n * @csspart priority-menu-container - The container for the shifted navigation items,\n *    if there is not enough space.\n *\n */\nexport const SynPrioNav = createComponent({\n  displayName: 'SynPrioNav',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
+  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAEtB,IAAM,UAAU;AAChB,UAAU,OAAO,cAAc;AAqCxB,IAAM,aAAa,gBAAgB;AAAA,EACxC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ,CAAC;AAAA,EACT,OAAO;AAAA,EACP;AACF,CAAC;",
+  "names": []
+}

package/dist/chunks/{chunk.XKBU2COX.js → chunk.R2EAWP27.js}

@@ -15,4 +15,4 @@ var SynBreadcrumbItem = createComponent({
 export {
   SynBreadcrumbItem
 };
-//# sourceMappingURL=chunk.XKBU2COX.js.map
+//# sourceMappingURL=chunk.R2EAWP27.js.map

package/dist/chunks/{chunk.XKBU2COX.js.map → chunk.R2EAWP27.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/breadcrumb-item.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/breadcrumb-item/breadcrumb-item.component.js';\n\nconst tagName = 'syn-breadcrumb-item';\nComponent.define('syn-breadcrumb-item');\n\n/**\n * @summary Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.\n * @documentation https://synergy.style/components/breadcrumb-item\n * @status stable\n * @since 2.0\n *\n * @slot - The breadcrumb item's label.\n * @slot prefix - An optional prefix, usually an icon or icon button.\n * @slot suffix - An optional suffix, usually an icon or icon button.\n * @slot separator - The separator to use for the breadcrumb item. This will only change the separator for this item. If\n * you want to change it for all items in the group, set the separator on `<syn-breadcrumb>` instead.\n *\n * @csspart base - The component's base wrapper.\n * @csspart label - The breadcrumb item's label.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart separator - The container that wraps the separator.\n */\nexport const SynBreadcrumbItem = createComponent({\n  displayName: 'SynBreadcrumbItem',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/breadcrumb-item/breadcrumb-item.component.js';\n\nconst tagName = 'syn-breadcrumb-item';\nComponent.define('syn-breadcrumb-item');\n\n/**\n * @summary Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-breadcrumb-item--docs\n * @status stable\n * @since 2.0\n *\n * @slot - The breadcrumb item's label.\n * @slot prefix - An optional prefix, usually an icon or icon button.\n * @slot suffix - An optional suffix, usually an icon or icon button.\n * @slot separator - The separator to use for the breadcrumb item. This will only change the separator for this item. If\n * you want to change it for all items in the group, set the separator on `<syn-breadcrumb>` instead.\n *\n * @csspart base - The component's base wrapper.\n * @csspart label - The breadcrumb item's label.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart separator - The container that wraps the separator.\n */\nexport const SynBreadcrumbItem = createComponent({\n  displayName: 'SynBreadcrumbItem',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
   "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAEtB,IAAM,UAAU;AAChB,UAAU,OAAO,qBAAqB;AAoB/B,IAAM,oBAAoB,gBAAgB;AAAA,EAC/C,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ,CAAC;AAAA,EACT,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/chunks/{chunk.RH46CVQE.js → chunk.RWOJEMSX.js}

@@ -22,4 +22,4 @@ var SynDrawer = createComponent({
 export {
   SynDrawer
 };
-//# sourceMappingURL=chunk.RH46CVQE.js.map
+//# sourceMappingURL=chunk.RWOJEMSX.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/drawer.ts"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/drawer/drawer.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynShowEvent } from '@synergy-design-system/components';\nimport type { SynAfterShowEvent } from '@synergy-design-system/components';\nimport type { SynHideEvent } from '@synergy-design-system/components';\nimport type { SynAfterHideEvent } from '@synergy-design-system/components';\nimport type { SynInitialFocusEvent } from '@synergy-design-system/components';\nimport type { SynRequestCloseEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-drawer';\nComponent.define('syn-drawer');\n\n/**\n * @summary Drawers slide in from a container to expose additional options and information.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-drawer--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon-button\n *\n * @slot - The drawer's main content.\n * @slot label - The drawer's label. Alternatively, you can use the `label` attribute.\n * @slot header-actions - Optional actions to add to the header. Works best with `<syn-icon-button>`.\n * @slot footer - The drawer's footer, usually one or more buttons representing various options.\n *\n * @event syn-show - Emitted when the drawer opens.\n * @event syn-after-show - Emitted after the drawer opens and all animations are complete.\n * @event syn-hide - Emitted when the drawer closes.\n * @event syn-after-hide - Emitted after the drawer closes and all animations are complete.\n * @event syn-initial-focus - Emitted when the drawer opens and is ready to receive focus. Calling\n *   `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n * @event {{ source: 'close-button' | 'keyboard' | 'overlay' }} syn-request-close - Emitted when the user attempts to\n *   close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling\n *   `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in\n *   destructive behavior such as data loss.\n *\n * @csspart base - The component's base wrapper.\n * @csspart overlay - The overlay that covers the screen behind the drawer.\n * @csspart panel - The drawer's panel (where the drawer and its content are rendered).\n * @csspart header - The drawer's header. This element wraps the title and header actions.\n * @csspart header-actions - Optional actions to add to the header. Works best with `<syn-icon-button>`.\n * @csspart title - The drawer's title.\n * @csspart close-button - The close button, an `<syn-icon-button>`.\n * @csspart close-button__base - The close button's exported `base` part.\n * @csspart body - The drawer's body.\n * @csspart footer - The drawer's footer.\n *\n * @cssproperty --size - The preferred size of the drawer. This will be applied to the drawer's width or height\n *   depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens.\n * @cssproperty --header-spacing - The amount of padding to use for the header.\n * @cssproperty --body-spacing - The amount of padding to use for the body.\n * @cssproperty --footer-spacing - The amount of padding to use for the footer.\n *\n * @animation drawer.showTop - The animation to use when showing a drawer with `top` placement.\n * @animation drawer.showEnd - The animation to use when showing a drawer with `end` placement.\n * @animation drawer.showBottom - The animation to use when showing a drawer with `bottom` placement.\n * @animation drawer.showStart - The animation to use when showing a drawer with `start` placement.\n * @animation drawer.hideTop - The animation to use when hiding a drawer with `top` placement.\n * @animation drawer.hideEnd - The animation to use when hiding a drawer with `end` placement.\n * @animation drawer.hideBottom - The animation to use when hiding a drawer with `bottom` placement.\n * @animation drawer.hideStart - The animation to use when hiding a drawer with `start` placement.\n * @animation drawer.denyClose - The animation to use when a request to close the drawer is denied.\n * @animation drawer.overlay.show - The animation to use when showing the drawer's overlay.\n * @animation drawer.overlay.hide - The animation to use when hiding the drawer's overlay.\n *\n * @property modal - Exposes the internal modal utility that controls focus trapping. To temporarily disable focus\n *   trapping and allow third-party modals spawned from an active Synergy modal, call `modal.activateExternal()` when\n *   the third-party modal opens. Upon closing, call `modal.deactivateExternal()` to restore Synergy's focus trapping.\n */\nexport const SynDrawer = createComponent({\n  displayName: 'SynDrawer',\n  elementClass: Component,\n  events: {\n    onSynShow: 'syn-show' as EventName<SynShowEvent>,\n    onSynAfterShow: 'syn-after-show' as EventName<SynAfterShowEvent>,\n    onSynHide: 'syn-hide' as EventName<SynHideEvent>,\n    onSynAfterHide: 'syn-after-hide' as EventName<SynAfterHideEvent>,\n    onSynInitialFocus: 'syn-initial-focus' as EventName<SynInitialFocusEvent>,\n    onSynRequestClose: 'syn-request-close' as EventName<SynRequestCloseEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynShowEvent } from '@synergy-design-system/components';\nexport type { SynAfterShowEvent } from '@synergy-design-system/components';\nexport type { SynHideEvent } from '@synergy-design-system/components';\nexport type { SynAfterHideEvent } from '@synergy-design-system/components';\nexport type { SynInitialFocusEvent } from '@synergy-design-system/components';\nexport type { SynRequestCloseEvent } from '@synergy-design-system/components';\n"],
+  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAUtB,IAAM,UAAU;AAChB,UAAU,OAAO,YAAY;AA2DtB,IAAM,YAAY,gBAAgB;AAAA,EACvC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,mBAAmB;AAAA,EACrB;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
+  "names": []
+}

package/dist/chunks/{chunk.YLB4QDAX.js → chunk.SOARUKQP.js}

@@ -15,4 +15,4 @@ var SynSpinner = createComponent({
 export {
   SynSpinner
 };
-//# sourceMappingURL=chunk.YLB4QDAX.js.map
+//# sourceMappingURL=chunk.SOARUKQP.js.map

package/dist/chunks/{chunk.YLB4QDAX.js.map → chunk.SOARUKQP.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/spinner.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/spinner/spinner.component.js';\n\nconst tagName = 'syn-spinner';\nComponent.define('syn-spinner');\n\n/**\n * @summary Spinners are used to show the progress of an indeterminate operation.\n * @documentation https://synergy.style/components/spinner\n * @status stable\n * @since 2.0\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --track-width - The width of the track.\n * @cssproperty --indicator-color - The color of the spinner's indicator.\n * @cssproperty --speed - The time it takes for the spinner to complete one animation cycle.\n */\nexport const SynSpinner = createComponent({\n  displayName: 'SynSpinner',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/spinner/spinner.component.js';\n\nconst tagName = 'syn-spinner';\nComponent.define('syn-spinner');\n\n/**\n * @summary Spinners are used to show the progress of an indeterminate operation.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-spinner--docs\n * @status stable\n * @since 2.0\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --track-width - The width of the track.\n * @cssproperty --indicator-color - The color of the spinner's indicator.\n * @cssproperty --speed - The time it takes for the spinner to complete one animation cycle.\n */\nexport const SynSpinner = createComponent({\n  displayName: 'SynSpinner',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
   "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAEtB,IAAM,UAAU;AAChB,UAAU,OAAO,aAAa;AAcvB,IAAM,aAAa,gBAAgB;AAAA,EACxC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ,CAAC;AAAA,EACT,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/chunks/{chunk.3VMWNL2U.js → chunk.TGSZHDUW.js}

@@ -19,4 +19,4 @@ var SynButton = createComponent({
 export {
   SynButton
 };
-//# sourceMappingURL=chunk.3VMWNL2U.js.map
+//# sourceMappingURL=chunk.TGSZHDUW.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/button.ts"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/button/button.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynBlurEvent } from '@synergy-design-system/components';\nimport type { SynFocusEvent } from '@synergy-design-system/components';\nimport type { SynInvalidEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-button';\nComponent.define('syn-button');\n\n/**\n * @summary Buttons represent actions that are available to the user.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-button--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n * @dependency syn-spinner\n *\n * @event syn-blur - Emitted when the button loses focus.\n * @event syn-focus - Emitted when the button gains focus.\n * @event syn-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @slot - The button's label.\n * @slot prefix - A presentational prefix icon or similar element.\n * @slot suffix - A presentational suffix icon or similar element.\n *\n * @csspart base - The component's base wrapper.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart label - The button's label.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart caret - The button's caret icon, an `<syn-icon>` element.\n * @csspart spinner - The spinner that shows when the button is in the loading state.\n */\nexport const SynButton = createComponent({\n  displayName: 'SynButton',\n  elementClass: Component,\n  events: {\n    onSynBlur: 'syn-blur' as EventName<SynBlurEvent>,\n    onSynFocus: 'syn-focus' as EventName<SynFocusEvent>,\n    onSynInvalid: 'syn-invalid' as EventName<SynInvalidEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynBlurEvent } from '@synergy-design-system/components';\nexport type { SynFocusEvent } from '@synergy-design-system/components';\nexport type { SynInvalidEvent } from '@synergy-design-system/components';\n"],
+  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAOtB,IAAM,UAAU;AAChB,UAAU,OAAO,YAAY;AA0BtB,IAAM,YAAY,gBAAgB;AAAA,EACvC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,EAChB;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
+  "names": []
+}

package/dist/chunks/{chunk.C75OGWMX.js → chunk.TWK2UCJF.js}

@@ -15,4 +15,4 @@ var SynMenuItem = createComponent({
 export {
   SynMenuItem
 };
-//# sourceMappingURL=chunk.C75OGWMX.js.map
+//# sourceMappingURL=chunk.TWK2UCJF.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/menu-item.ts"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/menu-item/menu-item.component.js';\n\nconst tagName = 'syn-menu-item';\nComponent.define('syn-menu-item');\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 */\nexport const SynMenuItem = createComponent({\n  displayName: 'SynMenuItem',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
+  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAEtB,IAAM,UAAU;AAChB,UAAU,OAAO,eAAe;AA4BzB,IAAM,cAAc,gBAAgB;AAAA,EACzC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ,CAAC;AAAA,EACT,OAAO;AAAA,EACP;AACF,CAAC;",
+  "names": []
+}

package/dist/chunks/{chunk.FPGH7VQK.js → chunk.UDE6JBDC.js}

@@ -18,4 +18,4 @@ var SynIcon = createComponent({
 export {
   SynIcon
 };
-//# sourceMappingURL=chunk.FPGH7VQK.js.map
+//# sourceMappingURL=chunk.UDE6JBDC.js.map

package/dist/chunks/{chunk.FPGH7VQK.js.map → chunk.UDE6JBDC.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/icon.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/icon/icon.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynLoadEvent } from '@synergy-design-system/components';\nimport type { SynErrorEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-icon';\nComponent.define('syn-icon');\n\n/**\n * @summary Icons are symbols that can be used to represent various options within an application.\n * @documentation https://synergy.style/components/icon\n * @status stable\n * @since 2.0\n *\n * @event syn-load - Emitted when the icon has loaded. When using `spriteSheet: true` this will not emit.\n * @event syn-error - Emitted when the icon fails to load due to an error. When using `spriteSheet: true` this will not emit.\n *\n * @csspart svg - The internal SVG element.\n * @csspart use - The <use> element generated when using `spriteSheet: true`\n */\nexport const SynIcon = createComponent({\n  displayName: 'SynIcon',\n  elementClass: Component,\n  events: {\n    onSynLoad: 'syn-load' as EventName<SynLoadEvent>,\n    onSynError: 'syn-error' as EventName<SynErrorEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynLoadEvent } from '@synergy-design-system/components';\nexport type { SynErrorEvent } from '@synergy-design-system/components';\n"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/icon/icon.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynLoadEvent } from '@synergy-design-system/components';\nimport type { SynErrorEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-icon';\nComponent.define('syn-icon');\n\n/**\n * @summary Icons are symbols that can be used to represent various options within an application.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-icon--docs\n * @status stable\n * @since 2.0\n *\n * @event syn-load - Emitted when the icon has loaded. When using `spriteSheet: true` this will not emit.\n * @event syn-error - Emitted when the icon fails to load due to an error. When using `spriteSheet: true` this will not emit.\n *\n * @csspart svg - The internal SVG element.\n * @csspart use - The <use> element generated when using `spriteSheet: true`\n */\nexport const SynIcon = createComponent({\n  displayName: 'SynIcon',\n  elementClass: Component,\n  events: {\n    onSynLoad: 'syn-load' as EventName<SynLoadEvent>,\n    onSynError: 'syn-error' as EventName<SynErrorEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynLoadEvent } from '@synergy-design-system/components';\nexport type { SynErrorEvent } from '@synergy-design-system/components';\n"],
   "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAMtB,IAAM,UAAU;AAChB,UAAU,OAAO,UAAU;AAcpB,IAAM,UAAU,gBAAgB;AAAA,EACrC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/chunks/{chunk.JGODJO5S.js → chunk.UHHEAA6M.js}

@@ -15,4 +15,4 @@ var SynBadge = createComponent({
 export {
   SynBadge
 };
-//# sourceMappingURL=chunk.JGODJO5S.js.map
+//# sourceMappingURL=chunk.UHHEAA6M.js.map

package/dist/chunks/{chunk.JGODJO5S.js.map → chunk.UHHEAA6M.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/badge.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/badge/badge.component.js';\n\nconst tagName = 'syn-badge';\nComponent.define('syn-badge');\n\n/**\n * @summary Badges are used to draw attention and display statuses or counts.\n * @documentation https://synergy.style/components/badge\n * @status stable\n * @since 2.0\n *\n * @slot - The badge's content.\n *\n * @csspart base - The component's base wrapper.\n */\nexport const SynBadge = createComponent({\n  displayName: 'SynBadge',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/badge/badge.component.js';\n\nconst tagName = 'syn-badge';\nComponent.define('syn-badge');\n\n/**\n * @summary Badges are used to draw attention and display statuses or counts.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs\n * @status stable\n * @since 2.0\n *\n * @slot - The badge's content.\n *\n * @csspart base - The component's base wrapper.\n */\nexport const SynBadge = createComponent({\n  displayName: 'SynBadge',\n  elementClass: Component,\n  events: {},\n  react: React,\n  tagName,\n});\n"],
   "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAEtB,IAAM,UAAU;AAChB,UAAU,OAAO,WAAW;AAYrB,IAAM,WAAW,gBAAgB;AAAA,EACtC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ,CAAC;AAAA,EACT,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/chunks/{chunk.RJ3QZDD7.js → chunk.Y77LZN5N.js}

@@ -18,4 +18,4 @@ var SynIconButton = createComponent({
 export {
   SynIconButton
 };
-//# sourceMappingURL=chunk.RJ3QZDD7.js.map
+//# sourceMappingURL=chunk.Y77LZN5N.js.map

package/dist/chunks/{chunk.RJ3QZDD7.js.map → chunk.Y77LZN5N.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/icon-button.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/icon-button/icon-button.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynBlurEvent } from '@synergy-design-system/components';\nimport type { SynFocusEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-icon-button';\nComponent.define('syn-icon-button');\n\n/**\n * @summary Icons buttons are simple, icon-only buttons that can be used for actions and in toolbars.\n * @documentation https://synergy.style/components/icon-button\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n *\n * @event syn-blur - Emitted when the icon button loses focus.\n * @event syn-focus - Emitted when the icon button gains focus.\n *\n * @csspart base - The component's base wrapper.\n */\nexport const SynIconButton = createComponent({\n  displayName: 'SynIconButton',\n  elementClass: Component,\n  events: {\n    onSynBlur: 'syn-blur' as EventName<SynBlurEvent>,\n    onSynFocus: 'syn-focus' as EventName<SynFocusEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynBlurEvent } from '@synergy-design-system/components';\nexport type { SynFocusEvent } from '@synergy-design-system/components';\n"],
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/icon-button/icon-button.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynBlurEvent } from '@synergy-design-system/components';\nimport type { SynFocusEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-icon-button';\nComponent.define('syn-icon-button');\n\n/**\n * @summary Icons buttons are simple, icon-only buttons that can be used for actions and in toolbars.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-icon-button--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n *\n * @event syn-blur - Emitted when the icon button loses focus.\n * @event syn-focus - Emitted when the icon button gains focus.\n *\n * @csspart base - The component's base wrapper.\n */\nexport const SynIconButton = createComponent({\n  displayName: 'SynIconButton',\n  elementClass: Component,\n  events: {\n    onSynBlur: 'syn-blur' as EventName<SynBlurEvent>,\n    onSynFocus: 'syn-focus' as EventName<SynFocusEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynBlurEvent } from '@synergy-design-system/components';\nexport type { SynFocusEvent } from '@synergy-design-system/components';\n"],
   "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAMtB,IAAM,UAAU;AAChB,UAAU,OAAO,iBAAiB;AAe3B,IAAM,gBAAgB,gBAAgB;AAAA,EAC3C,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/chunks/{chunk.XU36FQGG.js → chunk.ZQEUVNBF.js}

@@ -27,4 +27,4 @@ var SynCombobox = createComponent({
 export {
   SynCombobox
 };
-//# sourceMappingURL=chunk.XU36FQGG.js.map
+//# sourceMappingURL=chunk.ZQEUVNBF.js.map

package/dist/chunks/{chunk.XU36FQGG.js.map → chunk.ZQEUVNBF.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/combobox.ts"],
-  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/combobox/combobox.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynChangeEvent } from '@synergy-design-system/components';\nimport type { SynClearEvent } from '@synergy-design-system/components';\nimport type { SynInputEvent } from '@synergy-design-system/components';\nimport type { SynFocusEvent } from '@synergy-design-system/components';\nimport type { SynBlurEvent } from '@synergy-design-system/components';\nimport type { SynShowEvent } from '@synergy-design-system/components';\nimport type { SynAfterShowEvent } from '@synergy-design-system/components';\nimport type { SynHideEvent } from '@synergy-design-system/components';\nimport type { SynAfterHideEvent } from '@synergy-design-system/components';\nimport type { SynInvalidEvent } from '@synergy-design-system/components';\nimport type { SynErrorEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-combobox';\nComponent.define('syn-combobox');\n\n/**\n * @summary Comboboxes allow you to choose items from a menu of predefined options.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-combobox--docs\n * @status stable\n *\n * @dependency syn-icon\n * @dependency syn-popup\n *\n * @slot - The listbox options. Must be `<syn-option>` elements.\n *    You can use `<syn-optgroup>`'s to group items visually.\n * @slot label - The combobox's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the combobox.\n * @slot suffix - Used to append a presentational icon or similar element to the combobox.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot expand-icon - The icon to show when the control is expanded and collapsed.\n *    Rotates on open and close.\n * @slot help-text - Text that describes how to use the combobox.\n *    Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-change - Emitted when the control's value changes.\n * @event syn-clear - Emitted when the control's value is cleared.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-show - Emitted when the combobox's menu opens.\n * @event syn-after-show - Emitted after the combobox's menu opens and all animations are complete.\n * @event syn-hide - Emitted when the combobox's menu closes.\n * @event syn-after-hide - Emitted after the combobox's menu closes and all animations are complete.\n * @event syn-invalid - Emitted when the form control has been checked for validity\n *    and its constraints aren't satisfied.\n * @event syn-error - Emitted when the combobox menu fails to open.\n *\n * @csspart form-control - The form control that wraps the label, combobox, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The combobox's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart combobox - The container the wraps the prefix, combobox, clear icon, and expand button.\n * @csspart prefix - The container that wraps the prefix slot.\n * @csspart suffix - The container that wraps the suffix slot.\n * @csspart display-input - The element that displays the selected option's label,\n *     an `<input>` element.\n * @csspart listbox - The listbox container where the options are slotted\n *   and the filtered options list exists.\n * @csspart filtered-listbox - The container that wraps the filtered options.\n * @csspart clear-button - The clear button.\n * @csspart expand-icon - The container that wraps the expand icon.\n *\n * @animation combobox.show - The animation to use when showing the combobox.\n * @animation combobox.hide - The animation to use when hiding the combobox.\n */\nexport const SynCombobox = createComponent({\n  displayName: 'SynCombobox',\n  elementClass: Component,\n  events: {\n    onSynChange: 'syn-change' as EventName<SynChangeEvent>,\n    onSynClear: 'syn-clear' as EventName<SynClearEvent>,\n    onSynInput: 'syn-input' as EventName<SynInputEvent>,\n    onSynFocus: 'syn-focus' as EventName<SynFocusEvent>,\n    onSynBlur: 'syn-blur' as EventName<SynBlurEvent>,\n    onSynShow: 'syn-show' as EventName<SynShowEvent>,\n    onSynAfterShow: 'syn-after-show' as EventName<SynAfterShowEvent>,\n    onSynHide: 'syn-hide' as EventName<SynHideEvent>,\n    onSynAfterHide: 'syn-after-hide' as EventName<SynAfterHideEvent>,\n    onSynInvalid: 'syn-invalid' as EventName<SynInvalidEvent>,\n    onSynError: 'syn-error' as EventName<SynErrorEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynChangeEvent } from '@synergy-design-system/components';\nexport type { SynClearEvent } from '@synergy-design-system/components';\nexport type { SynInputEvent } from '@synergy-design-system/components';\nexport type { SynFocusEvent } from '@synergy-design-system/components';\nexport type { SynBlurEvent } from '@synergy-design-system/components';\nexport type { SynShowEvent } from '@synergy-design-system/components';\nexport type { SynAfterShowEvent } from '@synergy-design-system/components';\nexport type { SynHideEvent } from '@synergy-design-system/components';\nexport type { SynAfterHideEvent } from '@synergy-design-system/components';\nexport type { SynInvalidEvent } from '@synergy-design-system/components';\nexport type { SynErrorEvent } from '@synergy-design-system/components';\n"],
-  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAetB,IAAM,UAAU;AAChB,UAAU,OAAO,cAAc;AAoDxB,IAAM,cAAc,gBAAgB;AAAA,EACzC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
+  "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/combobox/combobox.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynChangeEvent } from '@synergy-design-system/components';\nimport type { SynClearEvent } from '@synergy-design-system/components';\nimport type { SynInputEvent } from '@synergy-design-system/components';\nimport type { SynFocusEvent } from '@synergy-design-system/components';\nimport type { SynBlurEvent } from '@synergy-design-system/components';\nimport type { SynShowEvent } from '@synergy-design-system/components';\nimport type { SynAfterShowEvent } from '@synergy-design-system/components';\nimport type { SynHideEvent } from '@synergy-design-system/components';\nimport type { SynAfterHideEvent } from '@synergy-design-system/components';\nimport type { SynInvalidEvent } from '@synergy-design-system/components';\nimport type { SynErrorEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-combobox';\nComponent.define('syn-combobox');\n\n/**\n * @summary Comboboxes allow you to choose items from a menu of predefined options.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-combobox--docs\n * @status stable\n *\n * @dependency syn-icon\n * @dependency syn-popup\n *\n * @slot - The listbox options. Must be `<syn-option>` elements.\n *    You can use `<syn-optgroup>`'s to group items visually.\n * @slot label - The combobox's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the combobox.\n * @slot suffix - Used to append a presentational icon or similar element to the combobox.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot expand-icon - The icon to show when the control is expanded and collapsed.\n *    Rotates on open and close.\n * @slot help-text - Text that describes how to use the combobox.\n *    Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-change - Emitted when the control's value changes.\n * @event syn-clear - Emitted when the control's value is cleared.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-show - Emitted when the combobox's menu opens.\n * @event syn-after-show - Emitted after the combobox's menu opens and all animations are complete.\n * @event syn-hide - Emitted when the combobox's menu closes.\n * @event syn-after-hide - Emitted after the combobox's menu closes and all animations are complete.\n * @event syn-invalid - Emitted when the form control has been checked for validity\n *    and its constraints aren't satisfied.\n * @event syn-error - Emitted when the combobox menu fails to open.\n *\n * @csspart form-control - The form control that wraps the label, combobox, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The combobox's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart combobox - The container the wraps the prefix, combobox, clear icon, and expand button.\n * @csspart prefix - The container that wraps the prefix slot.\n * @csspart suffix - The container that wraps the suffix slot.\n * @csspart display-input - The element that displays the selected option's label,\n *     an `<input>` element.\n * @csspart listbox - The listbox container where the options are slotted\n *   and the filtered options list exists.\n * @csspart filtered-listbox - The container that wraps the filtered options.\n * @csspart clear-button - The clear button.\n * @csspart expand-icon - The container that wraps the expand icon.\n * @csspart popup - The popup's exported `popup` part.\n * Use this to target the tooltip's popup container.\n *\n * @animation combobox.show - The animation to use when showing the combobox.\n * @animation combobox.hide - The animation to use when hiding the combobox.\n */\nexport const SynCombobox = createComponent({\n  displayName: 'SynCombobox',\n  elementClass: Component,\n  events: {\n    onSynChange: 'syn-change' as EventName<SynChangeEvent>,\n    onSynClear: 'syn-clear' as EventName<SynClearEvent>,\n    onSynInput: 'syn-input' as EventName<SynInputEvent>,\n    onSynFocus: 'syn-focus' as EventName<SynFocusEvent>,\n    onSynBlur: 'syn-blur' as EventName<SynBlurEvent>,\n    onSynShow: 'syn-show' as EventName<SynShowEvent>,\n    onSynAfterShow: 'syn-after-show' as EventName<SynAfterShowEvent>,\n    onSynHide: 'syn-hide' as EventName<SynHideEvent>,\n    onSynAfterHide: 'syn-after-hide' as EventName<SynAfterHideEvent>,\n    onSynInvalid: 'syn-invalid' as EventName<SynInvalidEvent>,\n    onSynError: 'syn-error' as EventName<SynErrorEvent>,\n  },\n  react: React,\n  tagName,\n});\n\nexport type { SynChangeEvent } from '@synergy-design-system/components';\nexport type { SynClearEvent } from '@synergy-design-system/components';\nexport type { SynInputEvent } from '@synergy-design-system/components';\nexport type { SynFocusEvent } from '@synergy-design-system/components';\nexport type { SynBlurEvent } from '@synergy-design-system/components';\nexport type { SynShowEvent } from '@synergy-design-system/components';\nexport type { SynAfterShowEvent } from '@synergy-design-system/components';\nexport type { SynHideEvent } from '@synergy-design-system/components';\nexport type { SynAfterHideEvent } from '@synergy-design-system/components';\nexport type { SynInvalidEvent } from '@synergy-design-system/components';\nexport type { SynErrorEvent } from '@synergy-design-system/components';\n"],
+  "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAetB,IAAM,UAAU;AAChB,UAAU,OAAO,cAAc;AAsDxB,IAAM,cAAc,gBAAgB;AAAA,EACzC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
   "names": []
 }

package/dist/components/alert.d.ts

@@ -6,7 +6,7 @@ import type { SynHideEvent } from '@synergy-design-system/components';
 import type { SynAfterHideEvent } from '@synergy-design-system/components';
 /**
  * @summary Alerts are used to display important messages inline or as toast notifications.
- * @documentation https://synergy.style/components/alert
+ * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-alert--docs
  * @status stable
  * @since 2.0
  *

package/dist/components/alert.js

@@ -1,6 +1,6 @@
 import {
   SynAlert
-} from "../chunks/chunk.KQLWAJMN.js";
+} from "../chunks/chunk.JMDQOGNN.js";
 export {
   SynAlert
 };

package/dist/components/badge.d.ts

@@ -1,7 +1,7 @@
 import Component from '@synergy-design-system/components/components/badge/badge.component.js';
 /**
  * @summary Badges are used to draw attention and display statuses or counts.
- * @documentation https://synergy.style/components/badge
+ * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs
  * @status stable
  * @since 2.0
  *

package/dist/components/badge.js

@@ -1,6 +1,6 @@
 import {
   SynBadge
-} from "../chunks/chunk.JGODJO5S.js";
+} from "../chunks/chunk.UHHEAA6M.js";
 export {
   SynBadge
 };

package/dist/components/breadcrumb-item.d.ts

@@ -1,7 +1,7 @@
 import Component from '@synergy-design-system/components/components/breadcrumb-item/breadcrumb-item.component.js';
 /**
  * @summary Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.
- * @documentation https://synergy.style/components/breadcrumb-item
+ * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-breadcrumb-item--docs
  * @status stable
  * @since 2.0
  *

package/dist/components/breadcrumb-item.js

@@ -1,6 +1,6 @@
 import {
   SynBreadcrumbItem
-} from "../chunks/chunk.XKBU2COX.js";
+} from "../chunks/chunk.R2EAWP27.js";
 export {
   SynBreadcrumbItem
 };

package/dist/components/breadcrumb.d.ts

@@ -1,7 +1,7 @@
 import Component from '@synergy-design-system/components/components/breadcrumb/breadcrumb.component.js';
 /**
  * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.
- * @documentation https://synergy.style/components/breadcrumb
+ * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-breadcrumb--docs
  * @status stable
  * @since 2.0
  *

package/dist/components/breadcrumb.js

@@ -1,6 +1,6 @@
 import {
   SynBreadcrumb
-} from "../chunks/chunk.UXXOSB4A.js";
+} from "../chunks/chunk.LGYMTFIO.js";
 export {
   SynBreadcrumb
 };

package/dist/components/button-group.d.ts

@@ -1,7 +1,7 @@
 import Component from '@synergy-design-system/components/components/button-group/button-group.component.js';
 /**
  * @summary Button groups can be used to group related buttons into sections.
- * @documentation https://synergy.style/components/button-group
+ * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-button-group--docs
  * @status stable
  * @since 2.0
  *

package/dist/components/button-group.js

@@ -1,6 +1,6 @@
 import {
   SynButtonGroup
-} from "../chunks/chunk.HCVYE5QK.js";
+} from "../chunks/chunk.HHPIABBV.js";
 export {
   SynButtonGroup
 };

package/dist/components/button.d.ts

@@ -5,7 +5,7 @@ import type { SynFocusEvent } from '@synergy-design-system/components';
 import type { SynInvalidEvent } from '@synergy-design-system/components';
 /**
  * @summary Buttons represent actions that are available to the user.
- * @documentation https://synergy.style/components/button
+ * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-button--docs
  * @status stable
  * @since 2.0
  *

package/dist/components/button.js

@@ -1,6 +1,6 @@
 import {
   SynButton
-} from "../chunks/chunk.3VMWNL2U.js";
+} from "../chunks/chunk.TGSZHDUW.js";
 export {
   SynButton
 };

package/dist/components/card.d.ts

@@ -1,7 +1,7 @@
 import Component from '@synergy-design-system/components/components/card/card.component.js';
 /**
  * @summary Cards can be used to group related subjects in a container.
- * @documentation https://synergy.style/components/card
+ * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-card--docs
  * @status stable
  * @since 2.0
  *

package/dist/components/card.js

@@ -1,6 +1,6 @@
 import {
   SynCard
-} from "../chunks/chunk.6B45LKRT.js";
+} from "../chunks/chunk.OJAJTT5S.js";
 export {
   SynCard
 };