@sbb-esta/lyne-elements-dev 4.7.0-dev.1773149675 → 4.7.0-dev.1773157346

package/file-selector/common/file-selector-common.js

@@ -1,71 +1,72 @@
-var q = (s) => {
+var j = (s) => {
   throw TypeError(s);
 };
-var j = (s, l, r) => l.has(s) || q("Cannot " + r);
-var b = (s, l, r) => (j(s, l, "read from private field"), r ? r.call(s) : l.get(s)), g = (s, l, r) => l.has(s) ? q("Cannot add the same private member more than once") : l instanceof WeakSet ? l.add(s) : l.set(s, r), n = (s, l, r, u) => (j(s, l, "write to private field"), u ? u.call(s, r) : l.set(s, r), r);
-import { __runInitializers as c, __esDecorate as o } from "tslib";
-import { nothing as L } from "lit";
-import { property as h } from "lit/decorators.js";
-import { ref as G } from "lit/directives/ref.js";
+var V = (s, a, r) => a.has(s) || j("Cannot " + r);
+var m = (s, a, r) => (V(s, a, "read from private field"), r ? r.call(s) : a.get(s)), g = (s, a, r) => a.has(s) ? j("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(s) : a.set(s, r), o = (s, a, r, h) => (V(s, a, "write to private field"), h ? h.call(s, r) : a.set(s, r), r);
+import { __runInitializers as c, __esDecorate as n } from "tslib";
+import { css as O, nothing as z } from "lit";
+import { property as b } from "lit/decorators.js";
+import { ref as q } from "lit/directives/ref.js";
 import { unsafeStatic as v, html as y } from "lit/static-html.js";
-import { sbbInputModalityDetector as O } from "../../core/a11y.js";
-import { SbbLanguageController as H } from "../../core/controllers.js";
-import { forceType as $ } from "../../core/decorators.js";
-import { isLean as J } from "../../core/dom.js";
-import { forwardEvent as K } from "../../core/eventing.js";
-import { i18nFileSelectorButtonLabelMultiple as Q, i18nFileSelectorButtonLabel as U, i18nFileSelectorCurrentlySelected as X, i18nFileSelectorDeleteFile as Y } from "../../core/i18n.js";
-import { SbbDisabledMixin as Z, SbbFormAssociatedMixin as ee, SbbElementInternalsMixin as te, ɵstateController as M } from "../../core/mixins.js";
+import { sbbInputModalityDetector as H } from "../../core/a11y.js";
+import "../../core/base-elements.js";
+import { SbbLanguageController as J } from "../../core/controllers.js";
+import { forceType as E } from "../../core/decorators.js";
+import { isLean as K } from "../../core/dom.js";
+import { forwardEvent as Q } from "../../core/eventing.js";
+import { i18nFileSelectorButtonLabelMultiple as U, i18nFileSelectorButtonLabel as X, i18nFileSelectorCurrentlySelected as Y, i18nFileSelectorDeleteFile as Z } from "../../core/i18n.js";
+import { SbbDisabledMixin as ee, SbbFormAssociatedMixin as te, ɵstateController as k } from "../../core/mixins.js";
 import "../../button/secondary-button.js";
-const be = (s) => (() => {
-  var d, f, p, _, m, a;
-  let r = Z(ee(te(s))), u = [], z, F = [], k = [], D, x = [], I = [], R, B = [], A = [], S, T = [], P = [], w, C = [], N = [], W, V;
-  return a = class extends r {
+const ge = O`:host{--sbb-file-selector-color: var(--sbb-color-2);--sbb-file-selector-subtitle-color: var(--sbb-color-granite);--sbb-file-selector-subtitle-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-file-selector-background-color: var(--sbb-background-color-1);--sbb-file-selector-border-color: var(--sbb-border-color-4-inverted);--sbb-file-selector-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-file-selector-transition-easing-function: var(--sbb-animation-easing);display:block;width:20rem}@media(forced-colors:active){:host(:disabled){--sbb-file-selector-color: GrayText;--sbb-file-selector-subtitle-color: GrayText;--sbb-file-selector-border-color: GrayText}}:host(:is(:state(active),[state--active])){--sbb-file-selector-background-color: var(--sbb-background-color-3);--sbb-file-selector-border-color: var(--sbb-color-storm);--sbb-file-selector-border-color: light-dark(var(--sbb-color-storm), var(--sbb-color-anthracite))}@media(forced-colors:active){:host(:is(:state(active),[state--active])){--sbb-file-selector-border-color: Highlight}}.sbb-file-selector__input-container{-webkit-tap-highlight-color:transparent;display:flex;flex-direction:column}.sbb-file-selector__visually-hidden{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.sbb-file-selector__file-list{display:flex;flex-direction:column;row-gap:var(--sbb-spacing-fixed-3x);margin-block:0;padding-inline:0;padding-block:var(--sbb-spacing-fixed-6x) var(--sbb-spacing-fixed-1x)}.sbb-file-selector__file{--sbb-text-font-size: var(--sbb-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);display:flex;gap:var(--sbb-spacing-fixed-4x);align-items:center;justify-content:space-between}.sbb-file-selector__file-details{display:flex;flex:1;justify-content:space-between;gap:var(--sbb-spacing-fixed-4x);overflow:auto}.sbb-file-selector__file-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sbb-file-selector__file-size{white-space:nowrap;color:var(--sbb-color-metal);color:light-dark(var(--sbb-color-metal),var(--sbb-color-smoke))}:host(:not(:is(:state(slotted-error),[state--slotted-error]))) .sbb-file-selector__error{display:none}`, ve = (s) => (() => {
+  var d, f, u, p, _, l;
+  let r = ee(te(s)), h = [], L, $ = [], M = [], F, w = [], D = [], R, T = [], B = [], I, S = [], A = [], P, C = [], G = [], N, W;
+  return l = class extends r {
     constructor() {
       super(...arguments);
       g(this, d);
       g(this, f);
+      g(this, u);
       g(this, p);
       g(this, _);
-      g(this, m);
-      n(this, d, (c(this, u), c(this, F, J() ? "s" : "m"))), n(this, f, (c(this, k), c(this, x, !1))), n(this, p, (c(this, I), c(this, B, "default"))), n(this, _, (c(this, A), c(this, T, ""))), n(this, m, (c(this, P), c(this, C, ""))), this._files = (c(this, N), []), this._suffixes = ["B", "kB", "MB", "GB", "TB"], this.language = new H(this), this._counter = 0;
+      o(this, d, (c(this, h), c(this, $, K() ? "s" : "m"))), o(this, f, (c(this, M), c(this, w, !1))), o(this, u, (c(this, D), c(this, T, "default"))), o(this, p, (c(this, B), c(this, S, ""))), o(this, _, (c(this, A), c(this, C, ""))), this._files = (c(this, G), []), this._suffixes = ["B", "kB", "MB", "GB", "TB"], this.language = new J(this), this._counter = 0;
     }
     /**
      * Size variant, either s or m.
      * @default 'm' / 's' (lean)
      */
     get size() {
-      return b(this, d);
+      return m(this, d);
     }
     set size(t) {
-      n(this, d, t);
+      o(this, d, t);
     }
     /** Whether more than one file can be selected. */
     get multiple() {
-      return b(this, f);
+      return m(this, f);
     }
     set multiple(t) {
-      n(this, f, t);
+      o(this, f, t);
     }
     /** Whether the newly added files should override the previously added ones. */
     get multipleMode() {
-      return b(this, p);
+      return m(this, u);
     }
     set multipleMode(t) {
-      n(this, p, t);
+      o(this, u, t);
     }
     /** A comma-separated list of allowed unique file type specifiers. */
     get accept() {
-      return b(this, _);
+      return m(this, p);
     }
     set accept(t) {
-      n(this, _, t);
+      o(this, p, t);
     }
     /** This will be forwarded as aria-label to the native input element. */
     get accessibilityLabel() {
-      return b(this, m);
+      return m(this, _);
     }
     set accessibilityLabel(t) {
-      n(this, m, t);
+      o(this, _, t);
     }
     /** The path of the first selected file. Empty string ('') if no file is selected */
     set value(t) {
@@ -104,24 +105,24 @@ const be = (s) => (() => {
       return t.name === e.name && t.size === e.size && t.lastModified === e.lastModified;
     }
     _onFocus() {
-      O.mostRecentModality === "keyboard" && M(this.loadButton).add("focus-visible");
+      H.mostRecentModality === "keyboard" && k(this.loadButton).add("focus-visible");
     }
     _onBlur() {
-      M(this.loadButton).delete("focus-visible");
+      k(this.loadButton).delete("focus-visible");
     }
     _readFiles(t) {
       const e = t.target;
-      e.files && this.createFileList(e.files), K(t, this);
+      e.files && this.createFileList(e.files), Q(t, this);
     }
     createFileList(t) {
       const e = Array.from(t);
-      !this.multiple && t.length > 1 || this.accept && e.some((i) => !this.accept.split(",").some((E) => i.name.endsWith(E.trim()))) || (!this.multiple || this.multipleMode !== "persistent" || this.files.length === 0 ? this.files = e : this.files = e.filter(
+      !this.multiple && t.length > 1 || this.accept && e.some((i) => !this.accept.split(",").some((x) => i.name.endsWith(x.trim()))) || (!this.multiple || this.multipleMode !== "persistent" || this.files.length === 0 ? this.files = e : this.files = e.filter(
         // Remove duplicates
-        (i) => this.files.findIndex((E) => this._checkFileEquality(i, E)) === -1
+        (i) => this.files.findIndex((x) => this._checkFileEquality(i, x)) === -1
       ).concat(this.files), this._updateA11yLiveRegion(), this._dispatchFileChangedEvent());
     }
     getButtonLabel() {
-      return this.multiple ? Q[this.language.current] : U[this.language.current];
+      return this.multiple ? U[this.language.current] : X[this.language.current];
     }
     _removeFile(t) {
       this.files = this.files.filter((e) => !this._checkFileEquality(t, e)), this._updateA11yLiveRegion(), this.dispatchEvent(new InputEvent("input", {
@@ -142,7 +143,7 @@ const be = (s) => (() => {
       return `${(t / Math.pow(1024, e)).toFixed(0)} ${this._suffixes[e]}`;
     }
     _updateA11yLiveRegion() {
-      this._liveRegion.innerText = X(this.files.map((t) => t.name))[this.language.current];
+      this._liveRegion.innerText = Y(this.files.map((t) => t.name))[this.language.current];
     }
     _renderFileList() {
       const t = this.files.length > 1 ? { WRAPPER: "ul", ELEMENT: "li" } : { WRAPPER: "div", ELEMENT: "span" };
@@ -158,7 +159,7 @@ const be = (s) => (() => {
                 size='${this.size}'
                 icon-name='trash-small'
                 @click='${() => this._removeFile(e)}'
-                aria-label='${`${Y[this.language.current]} - ${e.name}`}'
+                aria-label='${`${Z[this.language.current]} - ${e.name}`}'
               ></sbb-secondary-button>
             </${v(t.ELEMENT)}>`)}
       </${v(t.WRAPPER)}>
@@ -177,7 +178,7 @@ const be = (s) => (() => {
       t.stopPropagation(), t.preventDefault();
     }
     _setDragState(t = void 0, e = !1) {
-      this._dragTarget = t, this.toggleState("active", e), M(this.loadButton).toggle("active", e);
+      this._dragTarget = t, this.toggleState("active", e), k(this.loadButton).toggle("active", e);
     }
     render() {
       const t = this.accessibilityLabel ? `${this.getButtonLabel()} - ${this.accessibilityLabel}` : void 0;
@@ -195,12 +196,12 @@ const be = (s) => (() => {
                 type="file"
                 ?disabled="${this.disabled || this.formDisabled}"
                 ?multiple="${this.multiple}"
-                accept="${this.accept || L}"
-                aria-label="${t || L}"
+                accept="${this.accept || z}"
+                aria-label="${t || z}"
                 @change="${this._readFiles}"
                 @focus="${this._onFocus}"
                 @blur="${this._onBlur}"
-                ${G((e) => {
+                ${q((e) => {
         this._hiddenInput = e;
       })}
               />`)}
@@ -208,36 +209,37 @@ const be = (s) => (() => {
           <p
             role="status"
             class="sbb-file-selector__visually-hidden"
-            ${G((e) => this._liveRegion = e)}
+            ${q((e) => this._liveRegion = e)}
           ></p>
-          ${this.files.length > 0 ? this._renderFileList() : L}
+          ${this.files.length > 0 ? this._renderFileList() : z}
           <div class="sbb-file-selector__error">
             <slot name="error"></slot>
           </div>
         </div>
       `;
     }
-  }, d = new WeakMap(), f = new WeakMap(), p = new WeakMap(), _ = new WeakMap(), m = new WeakMap(), (() => {
+  }, d = new WeakMap(), f = new WeakMap(), u = new WeakMap(), p = new WeakMap(), _ = new WeakMap(), (() => {
     const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(r[Symbol.metadata] ?? null) : void 0;
-    z = [h({ reflect: !0 })], D = [$(), h({ type: Boolean })], R = [h({ attribute: "multiple-mode" })], S = [$(), h()], w = [$(), h({ attribute: "accessibility-label" })], W = [h({ attribute: !1 })], V = [h({ attribute: !1 })], o(a, null, z, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (e) => "size" in e, get: (e) => e.size, set: (e, i) => {
+    L = [b({ reflect: !0 })], F = [E(), b({ type: Boolean })], R = [b({ attribute: "multiple-mode" })], I = [E(), b()], P = [E(), b({ attribute: "accessibility-label" })], N = [b({ attribute: !1 })], W = [b({ attribute: !1 })], n(l, null, L, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (e) => "size" in e, get: (e) => e.size, set: (e, i) => {
       e.size = i;
-    } }, metadata: t }, F, k), o(a, null, D, { kind: "accessor", name: "multiple", static: !1, private: !1, access: { has: (e) => "multiple" in e, get: (e) => e.multiple, set: (e, i) => {
+    } }, metadata: t }, $, M), n(l, null, F, { kind: "accessor", name: "multiple", static: !1, private: !1, access: { has: (e) => "multiple" in e, get: (e) => e.multiple, set: (e, i) => {
       e.multiple = i;
-    } }, metadata: t }, x, I), o(a, null, R, { kind: "accessor", name: "multipleMode", static: !1, private: !1, access: { has: (e) => "multipleMode" in e, get: (e) => e.multipleMode, set: (e, i) => {
+    } }, metadata: t }, w, D), n(l, null, R, { kind: "accessor", name: "multipleMode", static: !1, private: !1, access: { has: (e) => "multipleMode" in e, get: (e) => e.multipleMode, set: (e, i) => {
       e.multipleMode = i;
-    } }, metadata: t }, B, A), o(a, null, S, { kind: "accessor", name: "accept", static: !1, private: !1, access: { has: (e) => "accept" in e, get: (e) => e.accept, set: (e, i) => {
+    } }, metadata: t }, T, B), n(l, null, I, { kind: "accessor", name: "accept", static: !1, private: !1, access: { has: (e) => "accept" in e, get: (e) => e.accept, set: (e, i) => {
       e.accept = i;
-    } }, metadata: t }, T, P), o(a, null, w, { kind: "accessor", name: "accessibilityLabel", static: !1, private: !1, access: { has: (e) => "accessibilityLabel" in e, get: (e) => e.accessibilityLabel, set: (e, i) => {
+    } }, metadata: t }, S, A), n(l, null, P, { kind: "accessor", name: "accessibilityLabel", static: !1, private: !1, access: { has: (e) => "accessibilityLabel" in e, get: (e) => e.accessibilityLabel, set: (e, i) => {
       e.accessibilityLabel = i;
-    } }, metadata: t }, C, N), o(a, null, W, { kind: "setter", name: "value", static: !1, private: !1, access: { has: (e) => "value" in e, set: (e, i) => {
+    } }, metadata: t }, C, G), n(l, null, N, { kind: "setter", name: "value", static: !1, private: !1, access: { has: (e) => "value" in e, set: (e, i) => {
       e.value = i;
-    } }, metadata: t }, null, u), o(a, null, V, { kind: "setter", name: "files", static: !1, private: !1, access: { has: (e) => "files" in e, set: (e, i) => {
+    } }, metadata: t }, null, h), n(l, null, W, { kind: "setter", name: "files", static: !1, private: !1, access: { has: (e) => "files" in e, set: (e, i) => {
       e.files = i;
-    } }, metadata: t }, null, u), t && Object.defineProperty(a, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), a.events = {
+    } }, metadata: t }, null, h), t && Object.defineProperty(l, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+  })(), l.events = {
     filechanged: "filechanged"
-  }, a;
+  }, l;
 })();
 export {
-  be as SbbFileSelectorCommonElementMixin
+  ve as SbbFileSelectorCommonElementMixin,
+  ge as fileSelectorCommonStyle
 };

package/file-selector/common.js

@@ -1,6 +1,7 @@
-import { SbbFileSelectorCommonElementMixin as m } from "./common/file-selector-common.js";
-import { f as r } from "../file-selector-common-DbYkpr-x.js";
+import { SbbFileSelectorCommonElementMixin as t, fileSelectorCommonStyle as o } from "./common/file-selector-common.js";
+console.warn(`The entrypoint '@sbb-esta/elements/file-selector/common.js' has been deprecated.
+Use either '@sbb-esta/elements/file-selector.js' or '@sbb-esta/elements/file-selector.pure.js' instead.`);
 export {
-  m as SbbFileSelectorCommonElementMixin,
-  r as fileSelectorCommonStyle
+  t as SbbFileSelectorCommonElementMixin,
+  o as fileSelectorCommonStyle
 };

package/file-selector/file-selector/file-selector.component.js

@@ -1,39 +1,33 @@
-import { __esDecorate as m, __runInitializers as n } from "tslib";
-import { LitElement as c } from "lit";
-import { customElement as b } from "lit/decorators.js";
-import { ref as d } from "lit/directives/ref.js";
-import { html as u } from "lit/static-html.js";
-import { boxSizingStyles as f } from "../../core/styles.js";
-import { SbbFileSelectorCommonElementMixin as p, fileSelectorCommonStyle as S } from "../common.js";
+import "lit";
+import { ref as o } from "lit/directives/ref.js";
+import { html as a } from "lit/static-html.js";
+import { SbbElement as m } from "../../core/base-elements.js";
+import { boxSizingStyles as r } from "../../core/styles.js";
+import { SbbFileSelectorCommonElementMixin as n, fileSelectorCommonStyle as l } from "../common/file-selector-common.js";
 import "../../button/secondary-button-static.js";
-let $ = (() => {
-  var e;
-  let o = [b("sbb-file-selector")], a, i = [], t, s = p(c);
-  return e = class extends s {
-    renderTemplate(l) {
-      return u`
+const t = class t extends n(m) {
+  renderTemplate(i) {
+    return a`
       <label>
         <sbb-secondary-button-static
           size=${this.size}
           icon-name="folder-open-small"
           ?disabled=${this.disabled || this.formDisabled}
-          ${d((r) => {
-        this.loadButton = r;
-      })}
+          ${o((e) => {
+      this.loadButton = e;
+    })}
         >
           ${this.getButtonLabel()}
         </sbb-secondary-button-static>
-        ${l}
+        ${i}
       </label>
     `;
-    }
-  }, t = e, (() => {
-    const l = typeof Symbol == "function" && Symbol.metadata ? Object.create(s[Symbol.metadata] ?? null) : void 0;
-    m(null, a = { value: t }, o, { kind: "class", name: t.name, metadata: l }, null, i), t = a.value, l && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: l });
-  })(), e.styles = [f, S], e.events = {
-    filechanged: "filechanged"
-  }, n(t, i), t;
-})();
+  }
+};
+t.elementName = "sbb-file-selector", t.styles = [r, l], t.events = {
+  filechanged: "filechanged"
+};
+let s = t;
 export {
-  $ as SbbFileSelectorElement
+  s as SbbFileSelectorElement
 };

package/file-selector/file-selector-dropzone/file-selector-dropzone.component.js

@@ -1,38 +1,39 @@
-var m = (e) => {
-  throw TypeError(e);
+var l = (t) => {
+  throw TypeError(t);
 };
-var d = (e, t, i) => t.has(e) || m("Cannot " + i);
-var u = (e, t, i) => (d(e, t, "read from private field"), i ? i.call(e) : t.get(e)), h = (e, t, i) => t.has(e) ? m("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, i), g = (e, t, i, s) => (d(e, t, "write to private field"), s ? s.call(e, i) : t.set(e, i), i);
-import { __esDecorate as _, __runInitializers as n } from "tslib";
-import { css as z, LitElement as y } from "lit";
-import { customElement as x, property as S } from "lit/decorators.js";
-import { ref as C } from "lit/directives/ref.js";
-import { html as k } from "lit/static-html.js";
-import { forceType as $ } from "../../core/decorators.js";
-import { i18nFileSelectorSubtitleLabelMultiple as D, i18nFileSelectorSubtitleLabel as E } from "../../core/i18n.js";
-import { boxSizingStyles as w } from "../../core/styles.js";
-import { SbbFileSelectorCommonElementMixin as F, fileSelectorCommonStyle as L } from "../common.js";
+var b = (t, e, i) => e.has(t) || l("Cannot " + i);
+var c = (t, e, i) => (b(t, e, "read from private field"), i ? i.call(t) : e.get(t)), f = (t, e, i) => e.has(t) ? l("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, i), p = (t, e, i, a) => (b(t, e, "write to private field"), a ? a.call(t, i) : e.set(t, i), i);
+import { __esDecorate as h, __runInitializers as d } from "tslib";
+import { css as g } from "lit";
+import { property as u } from "lit/decorators.js";
+import { ref as v } from "lit/directives/ref.js";
+import { html as y } from "lit/static-html.js";
+import { SbbElement as _ } from "../../core/base-elements.js";
+import { forceType as z } from "../../core/decorators.js";
+import { i18nFileSelectorSubtitleLabelMultiple as x, i18nFileSelectorSubtitleLabel as C } from "../../core/i18n.js";
+import { boxSizingStyles as S } from "../../core/styles.js";
+import { SbbFileSelectorCommonElementMixin as $, fileSelectorCommonStyle as k } from "../common/file-selector-common.js";
 import "../../button/secondary-button-static.js";
 import "../../icon.js";
-const I = z`.sbb-file-selector__dropzone-area{display:flex;flex-direction:column;align-items:center;padding:var(--sbb-spacing-responsive-s);background-color:var(--sbb-file-selector-background-color);border:var(--sbb-border-width-1x) dashed var(--sbb-file-selector-border-color);border-radius:var(--sbb-border-radius-4x);transition-duration:var(--sbb-file-selector-transition-duration);transition-timing-function:var(--sbb-file-selector-transition-easing-function);transition-property:background-color,border-color}.sbb-file-selector__dropzone-area--icon{color:var(--sbb-file-selector-color);line-height:0}.sbb-file-selector__dropzone-area--title{--sbb-title-font-size: var(--sbb-title-font-size-level-6-lean, var(--sbb-heading-font-size-6));--sbb-title-line-height: var(--sbb-typo-line-height-text);margin-block:var(--sbb-title-margin-block, 0);margin-inline:0;font-family:var(--sbb-typo-font-family);font-weight:700;line-height:var(--sbb-title-line-height, var(--sbb-typo-line-height-heading));letter-spacing:var(--sbb-typo-letter-spacing-heading);font-size:var(--sbb-title-font-size);text-align:center;color:var(--sbb-file-selector-color)}.sbb-file-selector__dropzone-area--subtitle{--sbb-text-font-size: var(--sbb-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);text-align:center;color:var(--sbb-file-selector-subtitle-color);margin-block-end:var(--sbb-spacing-fixed-4x)}`;
-let Q = (() => {
-  var a, o;
-  let e = [x("sbb-file-selector-dropzone")], t, i = [], s, b = F(y), c, f = [], p = [];
-  return o = class extends b {
+const w = g`.sbb-file-selector__dropzone-area{display:flex;flex-direction:column;align-items:center;padding:var(--sbb-spacing-responsive-s);background-color:var(--sbb-file-selector-background-color);border:var(--sbb-border-width-1x) dashed var(--sbb-file-selector-border-color);border-radius:var(--sbb-border-radius-4x);transition-duration:var(--sbb-file-selector-transition-duration);transition-timing-function:var(--sbb-file-selector-transition-easing-function);transition-property:background-color,border-color}.sbb-file-selector__dropzone-area--icon{color:var(--sbb-file-selector-color);line-height:0}.sbb-file-selector__dropzone-area--title{--sbb-title-font-size: var(--sbb-title-font-size-level-6-lean, var(--sbb-heading-font-size-6));--sbb-title-line-height: var(--sbb-typo-line-height-text);margin-block:var(--sbb-title-margin-block, 0);margin-inline:0;font-family:var(--sbb-typo-font-family);font-weight:700;line-height:var(--sbb-title-line-height, var(--sbb-typo-line-height-heading));letter-spacing:var(--sbb-typo-letter-spacing-heading);font-size:var(--sbb-title-font-size);text-align:center;color:var(--sbb-file-selector-color)}.sbb-file-selector__dropzone-area--subtitle{--sbb-text-font-size: var(--sbb-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);text-align:center;color:var(--sbb-file-selector-subtitle-color);margin-block-end:var(--sbb-spacing-fixed-4x)}`;
+let J = (() => {
+  var n, s;
+  let t = $(_), e, i = [], a = [];
+  return s = class extends t {
     constructor() {
       super(...arguments);
-      h(this, a, n(this, f, ""));
-      n(this, p);
+      f(this, n, d(this, i, ""));
+      d(this, a);
     }
     /** The title displayed in `dropzone` variant. */
     get titleContent() {
-      return u(this, a);
+      return c(this, n);
     }
     set titleContent(r) {
-      g(this, a, r);
+      p(this, n, r);
     }
     renderTemplate(r) {
-      return k`
+      return y`
       <label>
         <span class="sbb-file-selector__dropzone-area">
           <span class="sbb-file-selector__dropzone-area--icon">
@@ -42,14 +43,14 @@ let Q = (() => {
           </span>
           <span class="sbb-file-selector__dropzone-area--title">${this.titleContent}</span>
           <span class="sbb-file-selector__dropzone-area--subtitle">
-            ${this.multiple ? D[this.language.current] : E[this.language.current]}
+            ${this.multiple ? x[this.language.current] : C[this.language.current]}
           </span>
           <span class="sbb-file-selector__dropzone-area--button">
             <sbb-secondary-button-static
               size=${this.size}
               ?disabled=${this.disabled || this.formDisabled}
-              ${C((l) => {
-        this.loadButton = l;
+              ${v((o) => {
+        this.loadButton = o;
       })}
             >
               ${this.getButtonLabel()}
@@ -60,15 +61,15 @@ let Q = (() => {
       </label>
     `;
     }
-  }, a = new WeakMap(), s = o, (() => {
-    const r = typeof Symbol == "function" && Symbol.metadata ? Object.create(b[Symbol.metadata] ?? null) : void 0;
-    c = [$(), S({ attribute: "title-content" })], _(o, null, c, { kind: "accessor", name: "titleContent", static: !1, private: !1, access: { has: (l) => "titleContent" in l, get: (l) => l.titleContent, set: (l, v) => {
-      l.titleContent = v;
-    } }, metadata: r }, f, p), _(null, t = { value: s }, e, { kind: "class", name: s.name, metadata: r }, null, i), s = t.value, r && Object.defineProperty(s, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: r });
-  })(), o.styles = [w, L, I], o.events = {
+  }, n = new WeakMap(), (() => {
+    const r = typeof Symbol == "function" && Symbol.metadata ? Object.create(t[Symbol.metadata] ?? null) : void 0;
+    e = [z(), u({ attribute: "title-content" })], h(s, null, e, { kind: "accessor", name: "titleContent", static: !1, private: !1, access: { has: (o) => "titleContent" in o, get: (o) => o.titleContent, set: (o, m) => {
+      o.titleContent = m;
+    } }, metadata: r }, i, a), r && Object.defineProperty(s, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: r });
+  })(), s.elementName = "sbb-file-selector-dropzone", s.styles = [S, k, w], s.events = {
     filechanged: "filechanged"
-  }, n(s, i), s;
+  }, s;
 })();
 export {
-  Q as SbbFileSelectorDropzoneElement
+  J as SbbFileSelectorDropzoneElement
 };

package/file-selector/file-selector-dropzone.js

@@ -1,4 +1,7 @@
-import { SbbFileSelectorDropzoneElement as r } from "./file-selector-dropzone/file-selector-dropzone.component.js";
+import { SbbFileSelectorDropzoneElement as e } from "./file-selector-dropzone/file-selector-dropzone.component.js";
+e.define();
+console.warn(`The entrypoint '@sbb-esta/elements/file-selector/file-selector-dropzone.js' has been deprecated.
+Use either '@sbb-esta/elements/file-selector.js' or '@sbb-esta/elements/file-selector.pure.js' instead.`);
 export {
-  r as SbbFileSelectorDropzoneElement
+  e as SbbFileSelectorDropzoneElement
 };

package/file-selector/file-selector.js

@@ -1,4 +1,7 @@
-import { SbbFileSelectorElement as o } from "./file-selector/file-selector.component.js";
+import { SbbFileSelectorElement as e } from "./file-selector/file-selector.component.js";
+e.define();
+console.warn(`The entrypoint '@sbb-esta/elements/file-selector/file-selector.js' has been deprecated.
+Use either '@sbb-esta/elements/file-selector.js' or '@sbb-esta/elements/file-selector.pure.js' instead.`);
 export {
-  o as SbbFileSelectorElement
+  e as SbbFileSelectorElement
 };

package/file-selector.js

@@ -1,10 +1,11 @@
-import { SbbFileSelectorCommonElementMixin as r } from "./file-selector/common/file-selector-common.js";
-import { f as t } from "./file-selector-common-DbYkpr-x.js";
-import { SbbFileSelectorDropzoneElement as S } from "./file-selector/file-selector-dropzone/file-selector-dropzone.component.js";
-import { SbbFileSelectorElement as b } from "./file-selector/file-selector/file-selector.component.js";
+import { SbbFileSelectorCommonElementMixin as i, fileSelectorCommonStyle as n } from "./file-selector/common/file-selector-common.js";
+import { SbbFileSelectorDropzoneElement as e } from "./file-selector/file-selector-dropzone/file-selector-dropzone.component.js";
+import { SbbFileSelectorElement as o } from "./file-selector/file-selector/file-selector.component.js";
+o.define();
+e.define();
 export {
-  r as SbbFileSelectorCommonElementMixin,
-  S as SbbFileSelectorDropzoneElement,
-  b as SbbFileSelectorElement,
-  t as fileSelectorCommonStyle
+  i as SbbFileSelectorCommonElementMixin,
+  e as SbbFileSelectorDropzoneElement,
+  o as SbbFileSelectorElement,
+  n as fileSelectorCommonStyle
 };

package/file-selector.pure.js

@@ -0,0 +1,9 @@
+import { SbbFileSelectorCommonElementMixin as l, fileSelectorCommonStyle as r } from "./file-selector/common/file-selector-common.js";
+import { SbbFileSelectorDropzoneElement as m } from "./file-selector/file-selector-dropzone/file-selector-dropzone.component.js";
+import { SbbFileSelectorElement as n } from "./file-selector/file-selector/file-selector.component.js";
+export {
+  l as SbbFileSelectorCommonElementMixin,
+  m as SbbFileSelectorDropzoneElement,
+  n as SbbFileSelectorElement,
+  r as fileSelectorCommonStyle
+};