@sbb-esta/lyne-elements 2.6.0 → 2.7.0

package/core/a11y/input-modality-detector.js

@@ -0,0 +1,59 @@
+import { isServer as r } from "lit";
+import { getEventTarget as a } from "../eventing.js";
+import { isFakeMousedownFromScreenReader as d, isFakeTouchstartFromScreenReader as u } from "./fake-event-detection.js";
+const c = 16, h = 17, m = 18, l = 91, _ = 224, y = {
+  ignoreKeys: [m, h, _, l, c]
+}, M = 650, s = {
+  passive: !0,
+  capture: !0
+};
+class p {
+  /** The most recently detected input modality. */
+  get mostRecentModality() {
+    return this._mostRecentModality;
+  }
+  /**
+   * The most recently detected input modality event target. Is null if no input modality has been
+   * detected or if the associated event target is null for some unknown reason.
+   */
+  get mostRecentTarget() {
+    return this._mostRecentTarget;
+  }
+  constructor() {
+    this._mostRecentModality = "mouse", this._mostRecentTarget = null, this._options = {
+      ...y
+    }, this._lastTouchMs = 0, this._onKeydown = (t) => {
+      var o, n;
+      (n = (o = this._options) == null ? void 0 : o.ignoreKeys) != null && n.some((i) => i === t.keyCode) || this._updateState("keyboard", t);
+    }, this._onMousedown = (t) => {
+      Date.now() - this._lastTouchMs < M || this._updateState(d(t) ? "keyboard" : "mouse", t);
+    }, this._onTouchstart = (t) => {
+      if (u(t)) {
+        this._updateState("keyboard", t);
+        return;
+      }
+      this._lastTouchMs = Date.now(), this._updateState("touch", t);
+    }, r || (document.addEventListener("keydown", this._onKeydown, s), document.addEventListener("mousedown", this._onMousedown, s), document.addEventListener("touchstart", this._onTouchstart, s));
+  }
+  reset() {
+    this._updateState("mouse", null), this._lastTouchMs = 0;
+  }
+  _updateState(t, o) {
+    this._mostRecentModality && document.documentElement.classList.remove(`sbb-focus-modality-${this._mostRecentModality}`), this._mostRecentModality = t, this._mostRecentTarget = o ? a(o) : null, document.documentElement.classList.add(`sbb-focus-modality-${this._mostRecentModality}`);
+  }
+}
+const f = new p();
+function T(e) {
+  if (!e)
+    return;
+  const t = f.mostRecentModality;
+  e && t !== null && e.addEventListener("focus", () => {
+    e.setAttribute("data-focus-origin", t), e.addEventListener("blur", () => e.removeAttribute("data-focus-origin"), {
+      once: !0
+    });
+  }, { once: !0 });
+}
+export {
+  f as sbbInputModalityDetector,
+  T as setModalityOnNextFocus
+};

package/core/a11y/interactivity-checker.d.ts

@@ -1,8 +1,33 @@
-export declare function hasGeometry(element: HTMLElement): boolean;
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+/**
+ * @deprecated Will be removed with next major version.
+ */
 export interface InterfaceInteractivityChecker {
     isVisible(element: HTMLElement): boolean;
 }
-export declare class InteractivityChecker implements InterfaceInteractivityChecker {
+/**
+ * Configuration for the isFocusable method.
+ */
+export declare class IsFocusableConfig {
+    /**
+     * Whether to count an element as focusable even if it is not currently visible.
+     */
+    ignoreVisibility: boolean;
+}
+export declare class InteractivityChecker {
+    /**
+     * Gets whether an element is disabled.
+     *
+     * @param element Element to be checked.
+     * @returns Whether the element is disabled.
+     */
+    isDisabled(element: HTMLElement): boolean;
     /**
      * Gets whether an element is visible for the purposes of interactivity.
      *
@@ -12,6 +37,27 @@ export declare class InteractivityChecker implements InterfaceInteractivityCheck
      * @returns Whether the element is visible.
      */
     isVisible(element: HTMLElement): boolean;
+    /**
+     * Gets whether an element can be reached via Tab key.
+     * Assumes that the element has already been checked with isFocusable.
+     *
+     * @param element Element to be checked.
+     * @returns Whether the element is tabbable.
+     */
+    isTabbable(element: HTMLElement): boolean;
+    /**
+     * Gets whether an element can be focused by the user.
+     *
+     * @param element Element to be checked.
+     * @param config The config object with options to customize this method's behavior
+     * @returns Whether the element is focusable.
+     */
+    isFocusable(element: HTMLElement, config?: IsFocusableConfig): boolean;
 }
-export declare const interactivityChecker: InterfaceInteractivityChecker;
+export declare const interactivityChecker: InteractivityChecker;
+/**
+ * @deprecated Will no longer be available with next major version.
+ * TODO: remove export keyword
+ */
+export declare function hasGeometry(element: HTMLElement): boolean;
 //# sourceMappingURL=interactivity-checker.d.ts.map

package/core/a11y/interactivity-checker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interactivity-checker.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/a11y/interactivity-checker.ts"],"names":[],"mappings":"AAAA,wBAAgB,WAAW,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAQzD;AAED,MAAM,WAAW,6BAA6B;IAC5C,SAAS,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAAC;CAC1C;AAED,qBAAa,oBAAqB,YAAW,6BAA6B;IACxE;;;;;;;OAOG;IACI,SAAS,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO;CAGhD;AAUD,eAAO,MAAM,oBAAoB,EAAE,6BAIH,CAAC"}
+{"version":3,"file":"interactivity-checker.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/a11y/interactivity-checker.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AASH;;GAEG;AACH,MAAM,WAAW,6BAA6B;IAC5C,SAAS,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAAC;CAC1C;AAED;;GAEG;AACH,qBAAa,iBAAiB;IAC5B;;OAEG;IACI,gBAAgB,EAAE,OAAO,CAAS;CAC1C;AAED,qBAAa,oBAAoB;IAC/B;;;;;OAKG;IACI,UAAU,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO;IAIhD;;;;;;;OAOG;IACI,SAAS,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO;IAI/C;;;;;;OAMG;IACI,UAAU,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO;IA0DhD;;;;;;OAMG;IACI,WAAW,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,CAAC,EAAE,iBAAiB,GAAG,OAAO;CAU9E;AAID,eAAO,MAAM,oBAAoB,sBAA6B,CAAC;AAE/D;;;GAGG;AACH,wBAAgB,WAAW,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAQzD"}

package/core/a11y/interactivity-checker.js

@@ -0,0 +1,104 @@
+import { isServer as n } from "lit";
+import { isWebkit as a, isIOS as o, isFirefox as u } from "../dom/platform.js";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+class C {
+  constructor() {
+    this.ignoreVisibility = !1;
+  }
+}
+class b {
+  /**
+   * Gets whether an element is disabled.
+   *
+   * @param element Element to be checked.
+   * @returns Whether the element is disabled.
+   */
+  isDisabled(i) {
+    return i.hasAttribute("disabled") || i.matches(":disabled");
+  }
+  /**
+   * Gets whether an element is visible for the purposes of interactivity.
+   *
+   * This will capture states like `display: none` and `visibility: hidden`, but not things like
+   * being clipped by an `overflow: hidden` parent or being outside the viewport.
+   *
+   * @returns Whether the element is visible.
+   */
+  isVisible(i) {
+    return f(i) && getComputedStyle(i).visibility === "visible";
+  }
+  /**
+   * Gets whether an element can be reached via Tab key.
+   * Assumes that the element has already been checked with isFocusable.
+   *
+   * @param element Element to be checked.
+   * @returns Whether the element is tabbable.
+   */
+  isTabbable(i) {
+    if (n)
+      return !1;
+    const r = i.nodeName.toLowerCase(), e = x(i);
+    return i.hasAttribute("contenteditable") ? e !== -1 : r === "iframe" || r === "object" || a && o && !I(i) ? !1 : r === "audio" ? i.hasAttribute("controls") ? e !== -1 : !1 : r === "video" ? e === -1 ? !1 : e !== null ? !0 : u || i.hasAttribute("controls") : i.tabIndex >= 0;
+  }
+  /**
+   * Gets whether an element can be focused by the user.
+   *
+   * @param element Element to be checked.
+   * @param config The config object with options to customize this method's behavior
+   * @returns Whether the element is focusable.
+   */
+  isFocusable(i, r) {
+    return y(i) && !i.inert && !this.isDisabled(i) && ((r == null ? void 0 : r.ignoreVisibility) || this.isVisible(i));
+  }
+}
+const v = new b();
+function f(t) {
+  return !!(t.offsetWidth || t.offsetHeight || typeof t.getClientRects == "function" && t.getClientRects().length);
+}
+function c(t) {
+  const i = t.nodeName.toLowerCase();
+  return i === "input" || i === "select" || i === "button" || i === "textarea";
+}
+function d(t) {
+  return h(t) && t.type == "hidden";
+}
+function l(t) {
+  return p(t) && t.hasAttribute("href");
+}
+function h(t) {
+  return t.nodeName.toLowerCase() == "input";
+}
+function p(t) {
+  return t.nodeName.toLowerCase() == "a";
+}
+function s(t) {
+  if (!t.hasAttribute("tabindex") || t.tabIndex === void 0)
+    return !1;
+  const i = t.getAttribute("tabindex");
+  return !!(i && !isNaN(parseInt(i, 10)));
+}
+function x(t) {
+  if (!s(t))
+    return null;
+  const i = parseInt(t.getAttribute("tabindex") || "", 10);
+  return isNaN(i) ? -1 : i;
+}
+function I(t) {
+  const i = t.nodeName.toLowerCase(), r = i === "input" && t.type;
+  return r === "text" || r === "password" || i === "select" || i === "textarea";
+}
+function y(t) {
+  return d(t) ? !1 : c(t) || l(t) || t.hasAttribute("contenteditable") || s(t);
+}
+export {
+  b as InteractivityChecker,
+  C as IsFocusableConfig,
+  f as hasGeometry,
+  v as interactivityChecker
+};

package/core/a11y.d.ts

@@ -1,7 +1,11 @@
+/**
+ * @entrypoint
+ */
 export * from './a11y/arrow-navigation.js';
 export * from './a11y/fake-event-detection.js';
 export * from './a11y/focus-visible-within-controller.js';
 export * from './a11y/focus.js';
+export * from './a11y/focus-trap-controller.js';
 export * from './a11y/interactivity-checker.js';
 export * from './a11y/input-modality-detector.js';
 //# sourceMappingURL=a11y.d.ts.map

package/core/a11y.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"a11y.d.ts","sourceRoot":"","sources":["../../../src/elements/core/a11y.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iBAAiB,CAAC;AAChC,cAAc,iCAAiC,CAAC;AAChD,cAAc,mCAAmC,CAAC"}
+{"version":3,"file":"a11y.d.ts","sourceRoot":"","sources":["../../../src/elements/core/a11y.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iBAAiB,CAAC;AAChC,cAAc,iCAAiC,CAAC;AAChD,cAAc,iCAAiC,CAAC;AAChD,cAAc,mCAAmC,CAAC"}

package/core/a11y.js

@@ -1,203 +1,28 @@
-import { isServer as _ } from "lit";
-import { getEventTarget as a } from "./eventing.js";
-function d() {
-  return document.documentElement.matches(":dir(rtl)") ? { prevKey: "ArrowRight", nextKey: "ArrowLeft" } : { prevKey: "ArrowLeft", nextKey: "ArrowRight" };
-}
-function w(t) {
-  return ["ArrowRight", "ArrowLeft", "ArrowUp", "ArrowDown"].includes(t.key);
-}
-function O(t) {
-  return t.key === "ArrowUp" || t.key === d().prevKey;
-}
-function U(t) {
-  return t.key === "ArrowDown" || t.key === d().nextKey;
-}
-function V(t) {
-  return w(t) || ["PageUp", "PageDown", "Home", "End"].includes(t.key);
-}
-function f(t, e, n) {
-  return (t + n + e) % e;
-}
-function R(t) {
-  return t - 1;
-}
-const y = 0;
-function Y(t, e, n) {
-  const { prevKey: s, nextKey: r } = d();
-  return t.key === s || t.key === "ArrowUp" ? e < y ? R(n) : f(e, n, -1) : t.key === r || t.key === "ArrowDown" ? e >= n ? y : f(e, n, 1) : e;
-}
-function A(t) {
-  return t.buttons === 0 || t.detail === 0;
-}
-function E(t) {
-  const e = t.touches && t.touches[0] || t.changedTouches && t.changedTouches[0];
-  return !!e && e.identifier === -1 && (e.radiusX == null || e.radiusX === 1) && (e.radiusY == null || e.radiusY === 1);
-}
-const M = 16, k = 17, v = 18, T = 91, K = 224, L = {
-  ignoreKeys: [v, k, K, T, M]
-}, C = 650, l = {
-  passive: !0,
-  capture: !0
-};
-class x {
-  /** The most recently detected input modality. */
-  get mostRecentModality() {
-    return this._mostRecentModality;
-  }
-  /**
-   * The most recently detected input modality event target. Is null if no input modality has been
-   * detected or if the associated event target is null for some unknown reason.
-   */
-  get mostRecentTarget() {
-    return this._mostRecentTarget;
-  }
-  constructor() {
-    this._mostRecentModality = "mouse", this._mostRecentTarget = null, this._options = {
-      ...L
-    }, this._lastTouchMs = 0, this._onKeydown = (e) => {
-      var n, s;
-      (s = (n = this._options) == null ? void 0 : n.ignoreKeys) != null && s.some((r) => r === e.keyCode) || (this._mostRecentModality = "keyboard", this._mostRecentTarget = a(e));
-    }, this._onMousedown = (e) => {
-      Date.now() - this._lastTouchMs < C || (this._mostRecentModality = A(e) ? "keyboard" : "mouse", this._mostRecentTarget = a(e));
-    }, this._onTouchstart = (e) => {
-      if (E(e)) {
-        this._mostRecentModality = "keyboard", this._mostRecentTarget = a(e);
-        return;
-      }
-      this._lastTouchMs = Date.now(), this._mostRecentModality = "touch", this._mostRecentTarget = a(e);
-    }, _ || (document.addEventListener("keydown", this._onKeydown, l), document.addEventListener("mousedown", this._onMousedown, l), document.addEventListener("touchstart", this._onTouchstart, l));
-  }
-  reset() {
-    this._mostRecentModality = "mouse", this._mostRecentTarget = null, this._lastTouchMs = 0;
-  }
-}
-const m = new x();
-function B(t) {
-  if (!t)
-    return;
-  const e = m.mostRecentModality;
-  t && e !== null && t.addEventListener("focus", () => {
-    t.setAttribute("data-focus-origin", e), t.addEventListener("blur", () => t.removeAttribute("data-focus-origin"), {
-      once: !0
-    });
-  }, { once: !0 });
-}
-class W {
-  constructor(e) {
-    this._host = e, this._focusinHandler = () => {
-      this._host.toggleAttribute("data-has-visible-focus-within", m.mostRecentModality === "keyboard");
-    }, this._focusoutHandler = () => {
-      this._host.removeAttribute("data-has-visible-focus-within");
-    }, this._host.addController(this);
-  }
-  hostConnected() {
-    this._host.addEventListener("focusin", this._focusinHandler), this._host.addEventListener("focusout", this._focusoutHandler);
-  }
-  hostDisconnected() {
-    this._host.removeEventListener("focusin", this._focusinHandler), this._host.removeEventListener("focusout", this._focusoutHandler);
-  }
-}
-function F(t) {
-  return !!(t.offsetWidth || t.offsetHeight || typeof t.getClientRects == "function" && t.getClientRects().length);
-}
-class S {
-  /**
-   * Gets whether an element is visible for the purposes of interactivity.
-   *
-   * This will capture states like `display: none` and `visibility: hidden`, but not things like
-   * being clipped by an `overflow: hidden` parent or being outside the viewport.
-   *
-   * @returns Whether the element is visible.
-   */
-  isVisible(e) {
-    return F(e) && getComputedStyle(e).visibility === "visible";
-  }
-}
-class D {
-  isVisible() {
-    return !0;
-  }
-}
-const I = typeof getComputedStyle > "u" || getComputedStyle(document.documentElement).visibility === "" ? new D() : new S(), H = [
-  "button",
-  "[href]",
-  "input",
-  "select",
-  "textarea",
-  "details",
-  "summary",
-  "[tabindex]"
-].map((t) => `${t}:not([disabled],:disabled,[tabindex="-1"],[inert])`).join(",");
-function g(t, e) {
-  const n = /* @__PURE__ */ new Set();
-  function s(r, c) {
-    var i;
-    for (const o of r)
-      if (!(c && !c(o))) {
-        if (o.nodeName === "SLOT") {
-          s(Array.from(o.assignedElements()), c);
-          continue;
-        }
-        if (o.matches(H) && ((e == null ? void 0 : e.includeInvisibleElements) ?? I.isVisible(o)) && n.add(o), e != null && e.findFirstFocusable && n.size > 0)
-          break;
-        if (o.children.length || (i = o.shadowRoot) != null && i.children.length) {
-          const u = Array.from(o.children).length ? Array.from(o.children) : Array.from(o.shadowRoot.children);
-          s(u, c);
-        }
-      }
-  }
-  return s(t, e == null ? void 0 : e.filter), [...n];
-}
-function X(t, e) {
-  const n = g(t, {
-    filter: e,
-    findFirstFocusable: !0
-  });
-  return n.length ? n[0] : null;
-}
-class j {
-  constructor() {
-    this._controller = new AbortController();
-  }
-  /**
-   * @param element in which the focus should be trapped.
-   * @param options options object.
-   * @param options.filter filter function which is applied during searching for focusable element. If an element is filtered, also child elements are filtered.
-   * @param options.postFilter filter function which is applied after collecting focusable elements.
-   */
-  trap(e, n) {
-    e.addEventListener("keydown", (s) => {
-      if (s.key !== "Tab")
-        return;
-      const r = Array.from(e.shadowRoot.children || []), i = g(r, {
-        filter: n == null ? void 0 : n.filter
-      }).filter((n == null ? void 0 : n.postFilter) ?? (() => !0));
-      if (!i.length)
-        return;
-      const o = i[0], u = i[i.length - 1], [h, b] = s.shiftKey ? [o, u] : [u, o];
-      (o.getRootNode().activeElement === h || u.getRootNode().activeElement === h) && (b.focus(), s.preventDefault());
-    }, { signal: this._controller.signal });
-  }
-  disconnect() {
-    this._controller.abort(), this._controller = new AbortController();
-  }
-}
+import { getNextElementIndex as o, isArrowKeyOrPageKeysPressed as t, isArrowKeyPressed as s, isNextArrowKeyPressed as i, isPreviousArrowKeyPressed as a } from "./a11y/arrow-navigation.js";
+import { isFakeMousedownFromScreenReader as c, isFakeTouchstartFromScreenReader as l } from "./a11y/fake-event-detection.js";
+import { SbbFocusVisibleWithinController as F } from "./a11y/focus-visible-within-controller.js";
+import { IS_FOCUSABLE_QUERY as d, SbbFocusHandler as u, getFirstFocusableElement as x, getFocusableElements as y } from "./a11y/focus.js";
+import { SbbFocusTrapController as f } from "./a11y/focus-trap-controller.js";
+import { InteractivityChecker as C, IsFocusableConfig as P, hasGeometry as g, interactivityChecker as h } from "./a11y/interactivity-checker.js";
+import { sbbInputModalityDetector as A, setModalityOnNextFocus as E } from "./a11y/input-modality-detector.js";
 export {
-  H as IS_FOCUSABLE_QUERY,
-  S as InteractivityChecker,
-  j as SbbFocusHandler,
-  W as SbbFocusVisibleWithinController,
-  X as getFirstFocusableElement,
-  g as getFocusableElements,
-  Y as getNextElementIndex,
-  F as hasGeometry,
-  I as interactivityChecker,
-  V as isArrowKeyOrPageKeysPressed,
-  w as isArrowKeyPressed,
-  A as isFakeMousedownFromScreenReader,
-  E as isFakeTouchstartFromScreenReader,
-  U as isNextArrowKeyPressed,
-  O as isPreviousArrowKeyPressed,
-  m as sbbInputModalityDetector,
-  B as setModalityOnNextFocus
+  d as IS_FOCUSABLE_QUERY,
+  C as InteractivityChecker,
+  P as IsFocusableConfig,
+  u as SbbFocusHandler,
+  f as SbbFocusTrapController,
+  F as SbbFocusVisibleWithinController,
+  x as getFirstFocusableElement,
+  y as getFocusableElements,
+  o as getNextElementIndex,
+  g as hasGeometry,
+  h as interactivityChecker,
+  t as isArrowKeyOrPageKeysPressed,
+  s as isArrowKeyPressed,
+  c as isFakeMousedownFromScreenReader,
+  l as isFakeTouchstartFromScreenReader,
+  i as isNextArrowKeyPressed,
+  a as isPreviousArrowKeyPressed,
+  A as sbbInputModalityDetector,
+  E as setModalityOnNextFocus
 };

package/core/base-elements/action-base-element.js

@@ -0,0 +1,46 @@
+import { __esDecorate as n, __runInitializers as c } from "tslib";
+import { LitElement as o, html as m } from "lit";
+import { hostAttributes as d } from "../decorators.js";
+let h = (() => {
+  var a;
+  let i = [d({
+    "data-action": ""
+  })], r, s = [], t, l = o;
+  return a = class extends l {
+    get maybeDisabled() {
+      const e = this;
+      return e.disabled || e.formDisabled;
+    }
+    get maybeDisabledInteractive() {
+      return this.disabledInteractive;
+    }
+    connectedCallback() {
+      super.connectedCallback();
+    }
+    setupBaseEventHandlers() {
+      this.addEventListener(
+        "click",
+        (e) => {
+          this.maybeDisabled && !this.maybeDisabledInteractive && (e.preventDefault(), e.stopImmediatePropagation());
+        },
+        // capture is necessary here, as this event handler needs to be executed before any other
+        // in order to stop immediate propagation in the disabled case.
+        { capture: !0 }
+      );
+    }
+    /** Override this method to render the component template. */
+    renderTemplate() {
+      throw new Error("Implementation needed!");
+    }
+    /** Default render method for button-like components. */
+    render() {
+      return m`<span class="sbb-action-base ${this.localName}">${this.renderTemplate()}</span>`;
+    }
+  }, t = a, (() => {
+    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(l[Symbol.metadata] ?? null) : void 0;
+    n(null, r = { value: t }, i, { kind: "class", name: t.name, metadata: e }, null, s), t = r.value, e && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e }), c(t, s);
+  })(), t;
+})();
+export {
+  h as SbbActionBaseElement
+};

package/core/base-elements/button-base-element.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button-base-element.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/base-elements/button-base-element.ts"],"names":[],"mappings":"AAKA,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,EAEtB,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAEhE,2DAA2D;AAC3D,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;;AAE1D,yBAAyB;AACzB,8BAKe,oBAAqB,SAAQ,yBAA4C;IACtF,OAAO,CAAC,QAAQ,CAAC,wCAAwC,CAA+B;IAExF;;;OAGG;IACH,IACoB,IAAI,CAAC,IAAI,EAAE,aAAa,EAE3C;IACD,IAAoB,IAAI,IAAI,aAAa,CAExC;IAED,yDAAyD;IACzD,IACoB,IAAI,CAAC,KAAK,EAAE,MAAM,EAGrC;IACD,IAAoB,IAAI,IAAI,eAAe,GAAG,IAAI,CAMjD;IACD,OAAO,CAAC,OAAO,CAAc;;IA4Bb,iBAAiB,IAAI,IAAI;IAMzB,oBAAoB,IAAI,IAAI;IAM5C,OAAO,CAAC,kBAAkB,CAaxB;IAEF,OAAO,CAAC,cAAc;IAgBtB;;;;OAIG;IACH,OAAO,CAAC,4BAA4B,CAKlC;IAEF,OAAO,CAAC,mBAAmB,CAEzB;IAEF;;;;;OAKG;IACH,OAAO,CAAC,+BAA+B,CAKrC;IAEF,OAAO,CAAC,YAAY,CA6BlB;IAEF,OAAO,CAAC,mBAAmB,CAezB;IAEc,wBAAwB,CACtC,IAAI,EAAE,MAAM,EACZ,GAAG,EAAE,MAAM,GAAG,IAAI,EAClB,KAAK,EAAE,MAAM,GAAG,IAAI,GACnB,IAAI;IAMP;;;OAGG;IACa,iBAAiB,IAAI,IAAI;IAEzC;;;OAGG;IACa,wBAAwB,CACtC,MAAM,EAAE,gBAAgB,GAAG,IAAI,EAC/B,OAAO,EAAE,iBAAiB,GACzB,IAAI;IAEP;;;;OAIG;IACH,SAAS,CAAC,eAAe,IAAI,IAAI;CAClC"}
+{"version":3,"file":"button-base-element.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/base-elements/button-base-element.ts"],"names":[],"mappings":"AAKA,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,EAEtB,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAEhE,2DAA2D;AAC3D,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;;AAE1D,yBAAyB;AACzB,8BAKe,oBAAqB,SAAQ,yBAA4C;IACtF,OAAO,CAAC,QAAQ,CAAC,wCAAwC,CAA+B;IAExF;;;OAGG;IACH,IACoB,IAAI,CAAC,IAAI,EAAE,aAAa,EAE3C;IACD,IAAoB,IAAI,IAAI,aAAa,CAExC;IAED,yDAAyD;IACzD,IACoB,IAAI,CAAC,KAAK,EAAE,MAAM,EAGrC;IACD,IAAoB,IAAI,IAAI,eAAe,GAAG,IAAI,CAQjD;IACD,OAAO,CAAC,OAAO,CAAc;;IA4Bb,iBAAiB,IAAI,IAAI;IAMzB,oBAAoB,IAAI,IAAI;IAM5C,OAAO,CAAC,kBAAkB,CAaxB;IAEF,OAAO,CAAC,cAAc;IAgBtB;;;;OAIG;IACH,OAAO,CAAC,4BAA4B,CAKlC;IAEF,OAAO,CAAC,mBAAmB,CAEzB;IAEF;;;;;OAKG;IACH,OAAO,CAAC,+BAA+B,CAKrC;IAEF,OAAO,CAAC,YAAY,CA6BlB;IAEF,OAAO,CAAC,mBAAmB,CAezB;IAEc,wBAAwB,CACtC,IAAI,EAAE,MAAM,EACZ,GAAG,EAAE,MAAM,GAAG,IAAI,EAClB,KAAK,EAAE,MAAM,GAAG,IAAI,GACnB,IAAI;IAMP;;;OAGG;IACa,iBAAiB,IAAI,IAAI;IAEzC;;;OAGG;IACa,wBAAwB,CACtC,MAAM,EAAE,gBAAgB,GAAG,IAAI,EAC/B,OAAO,EAAE,iBAAiB,GACzB,IAAI;IAEP;;;;OAIG;IACH,SAAS,CAAC,eAAe,IAAI,IAAI;CAClC"}

package/core/base-elements/button-base-element.js

@@ -0,0 +1,120 @@
+import { __esDecorate as n, __runInitializers as h } from "tslib";
+import { isServer as y } from "lit";
+import { property as p } from "lit/decorators.js";
+import { hostAttributes as _ } from "../decorators.js";
+import { isEventPrevented as k } from "../eventing.js";
+import { SbbFormAssociatedMixin as v } from "../mixins.js";
+import { SbbActionBaseElement as E } from "./action-base-element.js";
+let I = (() => {
+  var i;
+  let b = [_({
+    tabindex: "0",
+    "data-button": ""
+  })], o, l = [], r, c = v(E), a = [], u, m;
+  return i = class extends c {
+    /**
+     * The type attribute to use for the button.
+     * @default 'button'
+     */
+    set type(t) {
+      this.setAttribute("type", `${t}`);
+    }
+    get type() {
+      return this.getAttribute("type") ?? "button";
+    }
+    /** The `<form>` element to associate the button with. */
+    set form(t) {
+      var e;
+      this._formId = t, (e = this.form) == null || e.addEventListener("keydown", this._formKeyDown, { capture: !0 });
+    }
+    get form() {
+      var t, e, s;
+      return this._formId ? ((s = (e = (t = this.getRootNode) == null ? void 0 : t.call(this)) == null ? void 0 : e.getElementById) == null ? void 0 : s.call(e, this._formId)) ?? null : this.internals.form;
+    }
+    constructor() {
+      if (super(), this._elementsOnWhichEnterPressTriggersSubmit = (h(this, a), ["input", "sbb-date-input"]), this._formId = "", this._handleButtonClick = async (t) => {
+        if (this.type === "button" || await k(t))
+          return;
+        const e = this.form;
+        if (e)
+          this.type === "submit" ? this._requestSubmit(e) : this.type === "reset" && e.reset();
+        else return;
+      }, this._preventScrollOnSpaceKeydown = (t) => {
+        t.key === " " && (t.preventDefault(), t.target.toggleAttribute("data-active", !0));
+      }, this._removeActiveMarker = (t) => {
+        t.target.removeAttribute("data-active");
+      }, this._dispatchClickEventOnSpaceKeyup = (t) => {
+        t.key === " " && (this._removeActiveMarker(t), this._dispatchClickEvent(t));
+      }, this._formKeyDown = (t) => {
+        var s;
+        const e = this.form;
+        this.type === "submit" && e && (t.key === "Enter" || t.key === `
+`) && this._elementsOnWhichEnterPressTriggersSubmit.includes((s = t.target) == null ? void 0 : s.localName) && t.isTrusted && (t.stopImmediatePropagation(), t.preventDefault(), t.composedPath()[0].dispatchEvent(new KeyboardEvent(t.type, t)) && !this.matches(":disabled") && this._requestSubmit(e));
+      }, this._dispatchClickEvent = (t) => {
+        const { altKey: e, ctrlKey: s, metaKey: d, shiftKey: f } = t;
+        t.target.dispatchEvent(new PointerEvent("click", {
+          bubbles: !0,
+          cancelable: !0,
+          composed: !0,
+          pointerId: -1,
+          pointerType: "",
+          altKey: e,
+          ctrlKey: s,
+          metaKey: d,
+          shiftKey: f
+        }));
+      }, this.internals.role = "button", !y) {
+        this.setupBaseEventHandlers();
+        const t = { passive: !0 };
+        this.addEventListener("click", this._handleButtonClick), this.addEventListener("keydown", this._preventScrollOnSpaceKeydown), this.addEventListener("keyup", this._dispatchClickEventOnSpaceKeyup, t), this.addEventListener("blur", this._removeActiveMarker, t), this.addEventListener("keypress", (e) => {
+          (e.key === "Enter" || e.key === `
+`) && this._dispatchClickEvent(e);
+        }, t);
+      }
+    }
+    connectedCallback() {
+      var t;
+      super.connectedCallback(), (t = this.form) == null || t.addEventListener("keydown", this._formKeyDown, { capture: !0 });
+    }
+    disconnectedCallback() {
+      var t;
+      super.disconnectedCallback(), (t = this.form) == null || t.removeEventListener("keydown", this._formKeyDown, { capture: !0 });
+    }
+    _requestSubmit(t) {
+      const e = document.createElement("button");
+      e.inert = !0, e.hidden = !0, e.name = this.name, e.value = this.value ?? "", t.append(e), t.requestSubmit(e), e.remove();
+    }
+    attributeChangedCallback(t, e, s) {
+      (!["name", "value"].includes(t) || e !== s) && super.attributeChangedCallback(t, e, s);
+    }
+    /**
+     * Intentionally empty, as buttons are not targeted by form reset
+     * @internal
+     */
+    formResetCallback() {
+    }
+    /**
+     * Intentionally empty, as buttons are not targeted by form restore
+     * @internal
+     */
+    formStateRestoreCallback(t, e) {
+    }
+    /**
+     * Intentionally empty, as button does not write its data in form.
+     * The data is only applied on submit button click as submitter of requestSubmit();
+     * @internal
+     */
+    updateFormValue() {
+    }
+  }, r = i, (() => {
+    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
+    u = [p()], m = [p()], n(i, null, u, { kind: "setter", name: "type", static: !1, private: !1, access: { has: (e) => "type" in e, set: (e, s) => {
+      e.type = s;
+    } }, metadata: t }, null, a), n(i, null, m, { kind: "setter", name: "form", static: !1, private: !1, access: { has: (e) => "form" in e, set: (e, s) => {
+      e.form = s;
+    } }, metadata: t }, null, a), n(null, o = { value: r }, b, { kind: "class", name: r.name, metadata: t }, null, l), r = o.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t }), h(r, l);
+  })(), r;
+})();
+export {
+  I as SbbButtonBaseElement
+};