@sbb-esta/lyne-elements 5.0.1 → 5.1.0

package/development/breadcrumb/breadcrumb/breadcrumb.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup, TemplateResult } from 'lit';
+import { type CSSResultGroup, type TemplateResult } from 'lit';
 import { SbbLinkBaseElement } from '../../core.ts';
-declare const SbbBreadcrumbElement_base: import('../../core.ts').AbstractConstructor<import('../../icon.pure.ts').SbbIconNameMixinType> & typeof SbbLinkBaseElement;
+declare const SbbBreadcrumbElement_base: import("../../core.ts").AbstractConstructor<import("../../icon.pure.ts").SbbIconNameMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a link to a page; used within a `sbb-breadcrumb-group` it can display the path to the current page.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=breadcrumb.component.d.ts.map

package/development/breadcrumb/breadcrumb-group/breadcrumb-group.component.d.ts

@@ -1,7 +1,7 @@
-import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
-import { SbbElement, SbbElementType, WithListChildren } from '../../core.ts';
-import { SbbBreadcrumbElement } from '../breadcrumb/breadcrumb.component.ts';
-declare const SbbBreadcrumbGroupElement_base: import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbNamedSlotListMixinType<SbbBreadcrumbElement>> & typeof SbbElement;
+import { type CSSResultGroup, type PropertyValues, type TemplateResult } from 'lit';
+import { SbbElement, type SbbElementType, type WithListChildren } from '../../core.ts';
+import type { SbbBreadcrumbElement } from '../breadcrumb/breadcrumb.component.ts';
+declare const SbbBreadcrumbGroupElement_base: import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbNamedSlotListMixinType<SbbBreadcrumbElement>> & typeof SbbElement;
 /**
  * It can be used as a container for one or more `sbb-breadcrumb` component.
  *
@@ -49,4 +49,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=breadcrumb-group.component.d.ts.map

package/development/breadcrumb.d.ts

@@ -1,2 +1 @@
 export * from './breadcrumb.pure.ts';
-//# sourceMappingURL=breadcrumb.d.ts.map

package/development/breadcrumb.js

@@ -1,11 +1,10 @@
-import { t as SbbBreadcrumbGroupElement } from "./breadcrumb-group.component-mofwnLS1.js";
-import { t as SbbBreadcrumbElement } from "./breadcrumb.component-B3XsV_Aq.js";
-import "./breadcrumb.pure.js";
+import { SbbBreadcrumbElement, SbbBreadcrumbGroupElement } from "./breadcrumb.pure.js";
+
+export * from "./breadcrumb.pure.js"
+
 //#region src/elements/breadcrumb.ts
 /** @entrypoint */
 SbbBreadcrumbElement.define();
 SbbBreadcrumbGroupElement.define();
-//#endregion
-export { SbbBreadcrumbElement, SbbBreadcrumbGroupElement };
 
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnJlYWRjcnVtYi5qcyIsIm5hbWVzIjpbXSwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvZWxlbWVudHMvYnJlYWRjcnVtYi50cyJdLCJzb3VyY2VzQ29udGVudCI6WyIvKiogQGVudHJ5cG9pbnQgKi9cbmltcG9ydCB7IFNiYkJyZWFkY3J1bWJFbGVtZW50LCBTYmJCcmVhZGNydW1iR3JvdXBFbGVtZW50IH0gZnJvbSAnLi9icmVhZGNydW1iLnB1cmUudHMnO1xuXG5leHBvcnQgKiBmcm9tICcuL2JyZWFkY3J1bWIucHVyZS50cyc7XG5cblNiYkJyZWFkY3J1bWJFbGVtZW50LmRlZmluZSgpO1xuU2JiQnJlYWRjcnVtYkdyb3VwRWxlbWVudC5kZWZpbmUoKTtcbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFLQSxxQkFBcUIsT0FBTTtBQUMzQiwwQkFBMEIsT0FBTSJ9
+//#endregion

package/development/breadcrumb.pure.d.ts

@@ -1,4 +1,3 @@
 /** @entrypoint */
 export * from './breadcrumb/breadcrumb-group/breadcrumb-group.component.ts';
 export * from './breadcrumb/breadcrumb/breadcrumb.component.ts';
-//# sourceMappingURL=breadcrumb.pure.d.ts.map

package/development/breadcrumb.pure.js

@@ -1,3 +1,228 @@
-import { t as SbbBreadcrumbGroupElement } from "./breadcrumb-group.component-mofwnLS1.js";
-import { t as SbbBreadcrumbElement } from "./breadcrumb.component-B3XsV_Aq.js";
-export { SbbBreadcrumbElement, SbbBreadcrumbGroupElement };
+import { __esDecorate, __runInitializers } from "tslib";
+import { ResizeController } from "@lit-labs/observers/resize-controller.js";
+import { html, nothing, unsafeCSS } from "lit";
+import { state } from "lit/decorators.js";
+import { SbbElement, SbbLanguageController, SbbLinkBaseElement, SbbNamedSlotListMixin, buttonResetStyles, getNextElementIndex, i18nBreadcrumbEllipsisButtonLabel, isArrowKeyPressed, listResetStyles, sbbInputModalityDetector } from "./core.js";
+import { SbbIconElement, SbbIconNameMixin } from "./icon.pure.js";
+import { html as html$1 } from "lit/static-html.js";
+
+//#region src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.scss?inline
+var breadcrumb_group_default = ":host {\n  display: block;\n  min-width: 0;\n  line-height: var(--sbb-typo-line-height-text);\n}\n\n:host(:is(:state(loaded),[state--loaded])) {\n  --sbb-breadcrumb-group-visibility: visible;\n}\n\n:host(:is(:is(:state(state-collapsed),[state--state-collapsed]), :is(:state(state-manually-expanded),[state--state-manually-expanded]))) {\n  --sbb-breadcrumb-group-wrap: wrap;\n}\n\n.sbb-breadcrumb-group {\n  display: flex;\n  flex-wrap: var(--sbb-breadcrumb-group-wrap);\n  column-gap: var(--sbb-spacing-fixed-1x);\n  visibility: var(--sbb-breadcrumb-group-visibility);\n}\n\n.sbb-breadcrumb-group__item {\n  flex: 0 0 auto;\n  display: flex;\n  column-gap: var(--sbb-spacing-fixed-1x);\n}\n\n.sbb-breadcrumb-group__divider-icon {\n  color: var(--sbb-breadcrumb-group-ellipsis-color);\n}\n\n#sbb-breadcrumb-ellipsis {\n  font-family: var(--sbb-typo-font-family);\n  font-weight: normal;\n  font-size: var(--sbb-text-font-size-xxs);\n  line-height: 0;\n  letter-spacing: 0.01em;\n  width: var(--sbb-size-icon-ui-small);\n  height: var(--sbb-size-icon-ui-small);\n  border: var(--sbb-breadcrumb-group-ellipsis-border-width) solid var(--sbb-breadcrumb-group-ellipsis-border-color);\n  border-radius: 50%;\n  padding-block-end: 0.5em;\n  cursor: var(--sbb-cursor-pointer);\n  color: var(--sbb-breadcrumb-group-ellipsis-color);\n  background-color: var(--sbb-breadcrumb-group-ellipsis-background-color);\n  overflow: hidden;\n}\n@media (forced-colors: active) {\n  #sbb-breadcrumb-ellipsis {\n    --sbb-breadcrumb-group-ellipsis-border-width: var(--sbb-border-width-2x);\n    --sbb-breadcrumb-group-ellipsis-border-color: CanvasText;\n  }\n}\n@media (any-hover: hover) {\n  #sbb-breadcrumb-ellipsis:hover {\n    --sbb-breadcrumb-group-ellipsis-color: var(--sbb-color-2);\n    --sbb-breadcrumb-group-ellipsis-background-color: var(--sbb-background-color-3);\n  }\n}\n@media (any-hover: hover) and (forced-colors: active) {\n  #sbb-breadcrumb-ellipsis:hover {\n    --sbb-breadcrumb-group-ellipsis-border-color: Highlight;\n  }\n}\n#sbb-breadcrumb-ellipsis:focus-visible {\n  outline-offset: var(--sbb-focus-outline-offset);\n  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);\n}\n";
+
+//#endregion
+//#region src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.component.ts
+const MIN_BREADCRUMBS_TO_COLLAPSE = 3;
+/**
+* It can be used as a container for one or more `sbb-breadcrumb` component.
+*
+* @slot - Use the unnamed slot to add `sbb-breadcrumb` elements.
+*/
+let SbbBreadcrumbGroupElement = (() => {
+	let _classSuper = SbbNamedSlotListMixin(SbbElement);
+	let _instanceExtraInitializers = [];
+	let _set__state_decorators;
+	return class SbbBreadcrumbGroupElement extends _classSuper {
+		static {
+			const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+			_set__state_decorators = [state()];
+			__esDecorate(this, null, _set__state_decorators, {
+				kind: "setter",
+				name: "_state",
+				static: false,
+				private: false,
+				access: {
+					has: (obj) => "_state" in obj,
+					set: (obj, value) => {
+						obj._state = value;
+					}
+				},
+				metadata: _metadata
+			}, null, _instanceExtraInitializers);
+			if (_metadata) Object.defineProperty(this, Symbol.metadata, {
+				enumerable: true,
+				configurable: true,
+				writable: true,
+				value: _metadata
+			});
+		}
+		static {
+			this.elementName = "sbb-breadcrumb-group";
+		}
+		static {
+			this.elementDependencies = [SbbIconElement];
+		}
+		static {
+			this.role = "navigation";
+		}
+		static {
+			this.styles = [
+				listResetStyles,
+				buttonResetStyles,
+				unsafeCSS(breadcrumb_group_default)
+			];
+		}
+		/** The state of the breadcrumb group. */
+		set _state(state) {
+			if (this._stateInternal) this.internals.states.delete(`state-${this._stateInternal}`);
+			this._stateInternal = state;
+			if (this._stateInternal) this.internals.states.add(`state-${this._stateInternal}`);
+		}
+		get _state() {
+			return this._stateInternal;
+		}
+		constructor() {
+			super();
+			this.listChildLocalNames = (__runInitializers(this, _instanceExtraInitializers), ["sbb-breadcrumb"]);
+			this._stateInternal = null;
+			this._resizeObserver = new ResizeController(this, {
+				target: null,
+				skipInitial: true,
+				callback: () => this._evaluateCollapsedState()
+			});
+			this._language = new SbbLanguageController(this);
+			this._markForFocus = false;
+			this.addEventListener?.("keydown", (e) => this._handleKeyDown(e));
+		}
+		_handleKeyDown(evt) {
+			if (!this.listChildren.length || evt.target !== this && evt.target.parentElement !== this) return;
+			if (isArrowKeyPressed(evt)) {
+				if (this._state === "collapsed") return this._focusNextCollapsed(evt);
+				this._focusNext(evt);
+			}
+		}
+		firstUpdated(changedProperties) {
+			super.firstUpdated(changedProperties);
+			this._resizeObserver.observe(this);
+			this.internals.states.add("loaded");
+		}
+		willUpdate(changedProperties) {
+			super.willUpdate(changedProperties);
+			if (changedProperties.has("listChildren")) this._syncBreadcrumbs();
+		}
+		updated(changedProperties) {
+			super.updated(changedProperties);
+			if (changedProperties.has("listChildren")) Promise.resolve().then(() => this._evaluateCollapsedState());
+			if (this._markForFocus && sbbInputModalityDetector.mostRecentModality === "keyboard") {
+				this.listChildren[1]?.focus();
+				this._markForFocus = false;
+			}
+		}
+		/** Apply the aria-current attribute to the last sbb-breadcrumb element. */
+		_syncBreadcrumbs() {
+			this.listChildren.slice(0, -1).filter((c) => c.hasAttribute("accessibility-current")).forEach((c) => c.removeAttribute("accessibility-current"));
+			this.listChildren[this.listChildren.length - 1]?.setAttribute("accessibility-current", "page");
+			if (this.listChildren.length < MIN_BREADCRUMBS_TO_COLLAPSE) this._state = null;
+		}
+		/**
+		* Sets the focus on the correct element when the ellipsis breadcrumb is displayed and the user is navigating with keyboard's arrows.
+		*/
+		_focusNextCollapsed(evt) {
+			const arrayCollapsed = [
+				this.listChildren[0],
+				this.shadowRoot.querySelector("#sbb-breadcrumb-ellipsis"),
+				this.listChildren[this.listChildren.length - 1]
+			];
+			this._focusNext(evt, arrayCollapsed);
+		}
+		_focusNext(evt, breadcrumbs = this.listChildren) {
+			breadcrumbs[getNextElementIndex(evt, breadcrumbs.findIndex((e) => e === document.activeElement || e === this.shadowRoot.activeElement), breadcrumbs.length)]?.focus();
+			evt.preventDefault();
+		}
+		/**
+		* Note: due to @State annotation on _state, this method triggers a new render; as a consequence, the focus is moved
+		* to the `body`, so if the ellipsis element has focus, it's asynchronously forced to the first element.
+		*/
+		_expandBreadcrumbs() {
+			this._state = "manually-expanded";
+			this._markForFocus = true;
+		}
+		/** Evaluate if the expanded breadcrumb element fits in page width, otherwise it needs ellipsis */
+		_evaluateCollapsedState() {
+			if (!this._state && this.scrollWidth > this.offsetWidth && this.listChildren.length >= MIN_BREADCRUMBS_TO_COLLAPSE) {
+				this._state = "collapsed";
+				this._resizeObserver.hostDisconnected();
+				this.removeController(this._resizeObserver);
+			}
+		}
+		_renderCollapsed() {
+			return html`
+      <li class="sbb-breadcrumb-group__item">
+        <slot name="li-0"></slot>
+      </li>
+      <li class="sbb-breadcrumb-group__item" id="sbb-breadcrumb-group-ellipsis">
+        <sbb-icon
+          name="chevron-small-right-small"
+          class="sbb-breadcrumb-group__divider-icon"
+        ></sbb-icon>
+        <button
+          type="button"
+          id="sbb-breadcrumb-ellipsis"
+          aria-label=${i18nBreadcrumbEllipsisButtonLabel[this._language.current]}
+          aria-expanded="false"
+          @click=${() => this._expandBreadcrumbs()}
+        >
+          ...
+        </button>
+      </li>
+      <li class="sbb-breadcrumb-group__item">
+        <sbb-icon
+          name="chevron-small-right-small"
+          class="sbb-breadcrumb-group__divider-icon"
+        ></sbb-icon>
+        <slot name=${`li-${this.listChildren.length - 1}`}></slot>
+      </li>
+    `;
+		}
+		_renderExpanded() {
+			return this.listSlotEntries().map((slot, index, array) => html`
+        <li class="sbb-breadcrumb-group__item">
+          <slot name=${slot.name}></slot>
+          ${index !== array.length - 1 ? html`<sbb-icon
+                name="chevron-small-right-small"
+                class="sbb-breadcrumb-group__divider-icon"
+              ></sbb-icon>` : nothing}
+        </li>
+      `);
+		}
+		render() {
+			return html`
+      <ol class="sbb-breadcrumb-group">
+        ${this._state === "collapsed" ? this._renderCollapsed() : this._renderExpanded()}
+      </ol>
+      ${this.renderHiddenSlot()}
+    `;
+		}
+	};
+})();
+
+//#endregion
+//#region src/elements/breadcrumb/breadcrumb/breadcrumb.scss?inline
+var breadcrumb_default = ":host {\n  display: flex;\n}\n\n@media (any-hover: hover) {\n  :host(:hover) {\n    --sbb-breadcrumb-color: var(--sbb-breadcrumb-color-hover);\n  }\n}\n:host(:is(:active, :is(:state(active),[state--active]))) {\n  --sbb-breadcrumb-color: var(--sbb-breadcrumb-color-active);\n}\n\n.sbb-breadcrumb {\n  --sbb-link-text-decoration-line: none;\n  color: var(--sbb-link-color-normal);\n  text-decoration-line: var(--sbb-link-text-decoration-line, underline);\n  text-decoration-thickness: 0.0625rem;\n  text-underline-offset: 0.3125em;\n}\n@media (forced-colors: active) {\n  .sbb-breadcrumb {\n    text-decoration: underline;\n  }\n}\n.sbb-breadcrumb {\n  display: flex;\n  cursor: var(--sbb-cursor-pointer);\n  gap: var(--sbb-breadcrumb-gap);\n  color: var(--sbb-breadcrumb-color);\n  align-items: center;\n  overflow: hidden;\n  outline: none;\n  font-size: var(--sbb-breadcrumb-font-size);\n  letter-spacing: var(--sbb-typo-letter-spacing-text);\n}\n.sbb-breadcrumb:focus-visible {\n  outline-offset: var(--sbb-focus-outline-offset);\n  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);\n  border-radius: var(--sbb-border-radius-2x);\n}\n\n.sbb-breadcrumb__label {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-breadcrumb__label {\n  display: none;\n}\n\nslot[name=icon] .sbb-breadcrumb__icon,\nslot[name=icon] ::slotted(*) {\n  flex-shrink: 0;\n}\n";
+
+//#endregion
+//#region src/elements/breadcrumb/breadcrumb/breadcrumb.component.ts
+/**
+* It displays a link to a page; used within a `sbb-breadcrumb-group` it can display the path to the current page.
+*
+* @slot - Use the unnamed slot to add content to the breadcrumb.
+* @slot icon - Use this to display an icon as breadcrumb.
+*/
+var SbbBreadcrumbElement = class extends SbbIconNameMixin(SbbLinkBaseElement) {
+	static {
+		this.elementName = "sbb-breadcrumb";
+	}
+	static {
+		this.styles = [unsafeCSS(breadcrumb_default)];
+	}
+	renderTemplate() {
+		return html$1`
+      ${this.renderIconSlot("sbb-breadcrumb__icon")}
+      <span class="sbb-breadcrumb__label">
+        <slot></slot>
+      </span>
+    `;
+	}
+};
+
+//#endregion
+export { SbbBreadcrumbElement, SbbBreadcrumbGroupElement };

package/development/button/accent-button/accent-button.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbButtonBaseElement } from '../../core.ts';
-declare const SbbAccentButtonElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType & import('../../core.ts').SbbDisabledInteractiveMixinType> & typeof SbbButtonBaseElement;
+declare const SbbAccentButtonElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType & import("../../core.ts").SbbDisabledInteractiveMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'accent' variant.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=accent-button.component.d.ts.map

package/development/button/accent-button-link/accent-button-link.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbLinkBaseElement } from '../../core.ts';
-declare const SbbAccentButtonLinkElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledInteractiveMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
+declare const SbbAccentButtonLinkElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledInteractiveMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'accent' variant, which will behave as a link.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=accent-button-link.component.d.ts.map

package/development/button/accent-button-static/accent-button-static.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbActionBaseElement } from '../../core.ts';
-declare const SbbAccentButtonStaticElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType> & typeof SbbActionBaseElement;
+declare const SbbAccentButtonStaticElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static button enhanced with the SBB Design in the 'accent' variant.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=accent-button-static.component.d.ts.map

package/development/button/button/button.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbButtonBaseElement } from '../../core.ts';
-declare const SbbButtonElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType & import('../../core.ts').SbbDisabledInteractiveMixinType> & typeof SbbButtonBaseElement;
+declare const SbbButtonElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType & import("../../core.ts").SbbDisabledInteractiveMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'primary' variant.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=button.component.d.ts.map

package/development/button/button-link/button-link.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbLinkBaseElement } from '../../core.ts';
-declare const SbbButtonLinkElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledInteractiveMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
+declare const SbbButtonLinkElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledInteractiveMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'primary' variant, which will behave as a link.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=button-link.component.d.ts.map

package/development/button/button-static/button-static.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbActionBaseElement } from '../../core.ts';
-declare const SbbButtonStaticElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType> & typeof SbbActionBaseElement;
+declare const SbbButtonStaticElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static button enhanced with the SBB Design in the 'primary' variant.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=button-static.component.d.ts.map

package/development/button/common/button-common.d.ts

@@ -1,15 +1,14 @@
-import { AbstractConstructor, SbbActionBaseElement } from '../../core.ts';
-export declare const buttonPrimaryStyle: import('lit').CSSResult;
-export declare const buttonSecondaryStyle: import('lit').CSSResult;
-export declare const buttonAccentStyle: import('lit').CSSResult;
-export declare const buttonTransparentStyle: import('lit').CSSResult;
-export declare const miniButtonStyle: import('lit').CSSResult;
-export declare const miniButtonLabelStyle: import('lit').CSSResult;
-declare const SbbButtonCommonElementMixinType_base: AbstractConstructor<import('../../core.ts').SbbNegativeMixinType> & AbstractConstructor<import('../../icon.pure.ts').SbbIconNameMixinType> & typeof SbbActionBaseElement;
+import { type AbstractConstructor, type SbbActionBaseElement } from '../../core.ts';
+export declare const buttonPrimaryStyle: import("lit").CSSResult;
+export declare const buttonSecondaryStyle: import("lit").CSSResult;
+export declare const buttonAccentStyle: import("lit").CSSResult;
+export declare const buttonTransparentStyle: import("lit").CSSResult;
+export declare const miniButtonStyle: import("lit").CSSResult;
+export declare const miniButtonLabelStyle: import("lit").CSSResult;
+declare const SbbButtonCommonElementMixinType_base: AbstractConstructor<import("../../core.ts").SbbNegativeMixinType> & AbstractConstructor<import("../../icon.pure.ts").SbbIconNameMixinType> & typeof SbbActionBaseElement;
 export declare class SbbButtonCommonElementMixinType extends SbbButtonCommonElementMixinType_base {
     accessor size: 's' | 'm' | 'l' | null;
     accessor loading: boolean;
 }
 export declare const SbbButtonCommonElementMixin: <T extends AbstractConstructor<SbbActionBaseElement>>(superClass: T) => AbstractConstructor<SbbButtonCommonElementMixinType> & T;
 export {};
-//# sourceMappingURL=button-common.d.ts.map

package/development/button/mini-button/mini-button.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup, TemplateResult } from 'lit';
+import type { CSSResultGroup, TemplateResult } from 'lit';
 import { SbbButtonBaseElement } from '../../core.ts';
-declare const SbbMiniButtonElement_base: import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType & import('../../core.ts').SbbDisabledInteractiveMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbNegativeMixinType> & import('../../core.ts').AbstractConstructor<import('../../icon.pure.ts').SbbIconNameMixinType> & typeof SbbButtonBaseElement;
+declare const SbbMiniButtonElement_base: import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType & import("../../core.ts").SbbDisabledInteractiveMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbNegativeMixinType> & import("../../core.ts").AbstractConstructor<import("../../icon.pure.ts").SbbIconNameMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays an icon-only button enhanced with the SBB Design;
  * it's meant to be used mainly within the sbb-form-field in prefix/suffix slot
@@ -19,4 +19,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=mini-button.component.d.ts.map

package/development/button/mini-button-group/mini-button-group.component.d.ts

@@ -1,7 +1,7 @@
-import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
+import { type CSSResultGroup, type PropertyValues, type TemplateResult } from 'lit';
 import { SbbElement } from '../../core.ts';
-import { SbbMiniButtonElement } from '../mini-button/mini-button.component.ts';
-declare const SbbMiniButtonGroupElement_base: import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbNegativeMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbNamedSlotListMixinType<SbbMiniButtonElement>> & typeof SbbElement;
+import type { SbbMiniButtonElement } from '../mini-button/mini-button.component.ts';
+declare const SbbMiniButtonGroupElement_base: import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbNegativeMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbNamedSlotListMixinType<SbbMiniButtonElement>> & typeof SbbElement;
 /**
  * Display a list of `sbb-mini-button` elements in a horizontal container,
  * possibly separated by a `sbb-divider` component.
@@ -28,4 +28,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=mini-button-group.component.d.ts.map

package/development/button/mini-button-link/mini-button-link.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup, TemplateResult } from 'lit';
+import { type CSSResultGroup, type TemplateResult } from 'lit';
 import { SbbLinkBaseElement } from '../../core.ts';
-declare const SbbMiniButtonLinkElement_base: import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbNegativeMixinType> & import('../../core.ts').AbstractConstructor<import('../../icon.pure.ts').SbbIconNameMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledInteractiveMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
+declare const SbbMiniButtonLinkElement_base: import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbNegativeMixinType> & import("../../core.ts").AbstractConstructor<import("../../icon.pure.ts").SbbIconNameMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledInteractiveMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays an icon-only button enhanced with the SBB Design as link variant;
  * it's meant to be used within the `sbb-mini-button-group`.
@@ -19,4 +19,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=mini-button-link.component.d.ts.map

package/development/button/secondary-button/secondary-button.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbButtonBaseElement } from '../../core.ts';
-declare const SbbSecondaryButtonElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType & import('../../core.ts').SbbDisabledInteractiveMixinType> & typeof SbbButtonBaseElement;
+declare const SbbSecondaryButtonElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType & import("../../core.ts").SbbDisabledInteractiveMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'secondary' variant.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=secondary-button.component.d.ts.map

package/development/button/secondary-button-link/secondary-button-link.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbLinkBaseElement } from '../../core.ts';
-declare const SbbSecondaryButtonLinkElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledInteractiveMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
+declare const SbbSecondaryButtonLinkElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledInteractiveMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'secondary' variant, which will behave as a link.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=secondary-button-link.component.d.ts.map

package/development/button/secondary-button-static/secondary-button-static.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbActionBaseElement } from '../../core.ts';
-declare const SbbSecondaryButtonStaticElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType> & typeof SbbActionBaseElement;
+declare const SbbSecondaryButtonStaticElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static button enhanced with the SBB Design in the 'secondary' variant.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=secondary-button-static.component.d.ts.map

package/development/button/transparent-button/transparent-button.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbButtonBaseElement } from '../../core.ts';
-declare const SbbTransparentButtonElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType & import('../../core.ts').SbbDisabledInteractiveMixinType> & typeof SbbButtonBaseElement;
+declare const SbbTransparentButtonElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType & import("../../core.ts").SbbDisabledInteractiveMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'transparent' variant.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=transparent-button.component.d.ts.map

package/development/button/transparent-button-link/transparent-button-link.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbLinkBaseElement } from '../../core.ts';
-declare const SbbTransparentButtonLinkElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledInteractiveMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
+declare const SbbTransparentButtonLinkElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledInteractiveMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'transparent' variant, which will behave as a link.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=transparent-button-link.component.d.ts.map

package/development/button/transparent-button-static/transparent-button-static.component.d.ts

@@ -1,6 +1,6 @@
-import { CSSResultGroup } from 'lit';
+import type { CSSResultGroup } from 'lit';
 import { SbbActionBaseElement } from '../../core.ts';
-declare const SbbTransparentButtonStaticElement_base: import('../../core.ts').AbstractConstructor<import('../common/button-common.ts').SbbButtonCommonElementMixinType> & import('../../core.ts').AbstractConstructor<import('../../core.ts').SbbDisabledMixinType> & typeof SbbActionBaseElement;
+declare const SbbTransparentButtonStaticElement_base: import("../../core.ts").AbstractConstructor<import("../common/button-common.ts").SbbButtonCommonElementMixinType> & import("../../core.ts").AbstractConstructor<import("../../core.ts").SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static button enhanced with the SBB Design in the 'transparent' variant.
  *
@@ -18,4 +18,3 @@ declare global {
     }
 }
 export {};
-//# sourceMappingURL=transparent-button-static.component.d.ts.map

package/development/button.d.ts

@@ -1,2 +1 @@
 export * from './button.pure.ts';
-//# sourceMappingURL=button.d.ts.map

package/development/button.js

@@ -1,20 +1,7 @@
-import { SbbButtonElement } from "./button/button/button.component.js";
-import { SbbSecondaryButtonElement } from "./button/secondary-button/secondary-button.component.js";
-import { SbbAccentButtonElement } from "./button/accent-button/accent-button.component.js";
-import { SbbTransparentButtonElement } from "./button/transparent-button/transparent-button.component.js";
-import { SbbMiniButtonElement } from "./button/mini-button/mini-button.component.js";
-import { t as SbbMiniButtonLinkElement } from "./mini-button-link.component-BHaNYXk0.js";
-import { t as SbbMiniButtonGroupElement } from "./mini-button-group.component-C2KcpK5c.js";
-import { SbbButtonLinkElement } from "./button/button-link/button-link.component.js";
-import { SbbSecondaryButtonLinkElement } from "./button/secondary-button-link/secondary-button-link.component.js";
-import { SbbAccentButtonLinkElement } from "./button/accent-button-link/accent-button-link.component.js";
-import { SbbTransparentButtonLinkElement } from "./button/transparent-button-link/transparent-button-link.component.js";
-import { SbbButtonStaticElement } from "./button/button-static/button-static.component.js";
-import { SbbSecondaryButtonStaticElement } from "./button/secondary-button-static/secondary-button-static.component.js";
-import { SbbAccentButtonStaticElement } from "./button/accent-button-static/accent-button-static.component.js";
-import { SbbTransparentButtonStaticElement } from "./button/transparent-button-static/transparent-button-static.component.js";
-import { a as buttonTransparentStyle, i as buttonSecondaryStyle, n as buttonAccentStyle, o as miniButtonLabelStyle, r as buttonPrimaryStyle, s as miniButtonStyle, t as SbbButtonCommonElementMixin } from "./button-common-DvuYiiku.js";
-import "./button.pure.js";
+import { SbbAccentButtonElement, SbbAccentButtonLinkElement, SbbAccentButtonStaticElement, SbbButtonElement, SbbButtonLinkElement, SbbButtonStaticElement, SbbMiniButtonElement, SbbMiniButtonGroupElement, SbbMiniButtonLinkElement, SbbSecondaryButtonElement, SbbSecondaryButtonLinkElement, SbbSecondaryButtonStaticElement, SbbTransparentButtonElement, SbbTransparentButtonLinkElement, SbbTransparentButtonStaticElement } from "./button.pure.js";
+
+export * from "./button.pure.js"
+
 //#region src/elements/button.ts
 /** @entrypoint */
 SbbAccentButtonElement.define();
@@ -32,7 +19,5 @@ SbbSecondaryButtonStaticElement.define();
 SbbTransparentButtonElement.define();
 SbbTransparentButtonLinkElement.define();
 SbbTransparentButtonStaticElement.define();
-//#endregion
-export { SbbAccentButtonElement, SbbAccentButtonLinkElement, SbbAccentButtonStaticElement, SbbButtonCommonElementMixin, SbbButtonElement, SbbButtonLinkElement, SbbButtonStaticElement, SbbMiniButtonElement, SbbMiniButtonGroupElement, SbbMiniButtonLinkElement, SbbSecondaryButtonElement, SbbSecondaryButtonLinkElement, SbbSecondaryButtonStaticElement, SbbTransparentButtonElement, SbbTransparentButtonLinkElement, SbbTransparentButtonStaticElement, buttonAccentStyle, buttonPrimaryStyle, buttonSecondaryStyle, buttonTransparentStyle, miniButtonLabelStyle, miniButtonStyle };
 
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmpzIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9idXR0b24udHMiXSwic291cmNlc0NvbnRlbnQiOlsiLyoqIEBlbnRyeXBvaW50ICovXG5pbXBvcnQge1xuICBTYmJBY2NlbnRCdXR0b25FbGVtZW50LFxuICBTYmJBY2NlbnRCdXR0b25MaW5rRWxlbWVudCxcbiAgU2JiQWNjZW50QnV0dG9uU3RhdGljRWxlbWVudCxcbiAgU2JiQnV0dG9uRWxlbWVudCxcbiAgU2JiQnV0dG9uTGlua0VsZW1lbnQsXG4gIFNiYkJ1dHRvblN0YXRpY0VsZW1lbnQsXG4gIFNiYk1pbmlCdXR0b25FbGVtZW50LFxuICBTYmJNaW5pQnV0dG9uR3JvdXBFbGVtZW50LFxuICBTYmJNaW5pQnV0dG9uTGlua0VsZW1lbnQsXG4gIFNiYlNlY29uZGFyeUJ1dHRvbkVsZW1lbnQsXG4gIFNiYlNlY29uZGFyeUJ1dHRvbkxpbmtFbGVtZW50LFxuICBTYmJTZWNvbmRhcnlCdXR0b25TdGF0aWNFbGVtZW50LFxuICBTYmJUcmFuc3BhcmVudEJ1dHRvbkVsZW1lbnQsXG4gIFNiYlRyYW5zcGFyZW50QnV0dG9uTGlua0VsZW1lbnQsXG4gIFNiYlRyYW5zcGFyZW50QnV0dG9uU3RhdGljRWxlbWVudCxcbn0gZnJvbSAnLi9idXR0b24ucHVyZS50cyc7XG5cbmV4cG9ydCAqIGZyb20gJy4vYnV0dG9uLnB1cmUudHMnO1xuXG5TYmJBY2NlbnRCdXR0b25FbGVtZW50LmRlZmluZSgpO1xuU2JiQWNjZW50QnV0dG9uTGlua0VsZW1lbnQuZGVmaW5lKCk7XG5TYmJBY2NlbnRCdXR0b25TdGF0aWNFbGVtZW50LmRlZmluZSgpO1xuU2JiQnV0dG9uRWxlbWVudC5kZWZpbmUoKTtcblNiYkJ1dHRvbkxpbmtFbGVtZW50LmRlZmluZSgpO1xuU2JiQnV0dG9uU3RhdGljRWxlbWVudC5kZWZpbmUoKTtcblNiYk1pbmlCdXR0b25FbGVtZW50LmRlZmluZSgpO1xuU2JiTWluaUJ1dHRvbkdyb3VwRWxlbWVudC5kZWZpbmUoKTtcblNiYk1pbmlCdXR0b25MaW5rRWxlbWVudC5kZWZpbmUoKTtcblNiYlNlY29uZGFyeUJ1dHRvbkVsZW1lbnQuZGVmaW5lKCk7XG5TYmJTZWNvbmRhcnlCdXR0b25MaW5rRWxlbWVudC5kZWZpbmUoKTtcblNiYlNlY29uZGFyeUJ1dHRvblN0YXRpY0VsZW1lbnQuZGVmaW5lKCk7XG5TYmJUcmFuc3BhcmVudEJ1dHRvbkVsZW1lbnQuZGVmaW5lKCk7XG5TYmJUcmFuc3BhcmVudEJ1dHRvbkxpbmtFbGVtZW50LmRlZmluZSgpO1xuU2JiVHJhbnNwYXJlbnRCdXR0b25TdGF0aWNFbGVtZW50LmRlZmluZSgpO1xuIl0sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBcUJBLHVCQUF1QixPQUFNO0FBQzdCLDJCQUEyQixPQUFNO0FBQ2pDLDZCQUE2QixPQUFNO0FBQ25DLGlCQUFpQixPQUFNO0FBQ3ZCLHFCQUFxQixPQUFNO0FBQzNCLHVCQUF1QixPQUFNO0FBQzdCLHFCQUFxQixPQUFNO0FBQzNCLDBCQUEwQixPQUFNO0FBQ2hDLHlCQUF5QixPQUFNO0FBQy9CLDBCQUEwQixPQUFNO0FBQ2hDLDhCQUE4QixPQUFNO0FBQ3BDLGdDQUFnQyxPQUFNO0FBQ3RDLDRCQUE0QixPQUFNO0FBQ2xDLGdDQUFnQyxPQUFNO0FBQ3RDLGtDQUFrQyxPQUFNIn0=
+//#endregion

package/development/button.pure.d.ts

@@ -15,4 +15,3 @@ export * from './button/secondary-button-static/secondary-button-static.componen
 export * from './button/accent-button-static/accent-button-static.component.ts';
 export * from './button/transparent-button-static/transparent-button-static.component.ts';
 export * from './button/common/button-common.ts';
-//# sourceMappingURL=button.pure.d.ts.map