@sbb-esta/lyne-elements 0.52.2 → 1.0.0

package/core/mixins.js

@@ -1,16 +1,16 @@
-import { property as l, state as _ } from "lit/decorators.js";
-import { defaultConverter as u, isServer as h, html as o, nothing as c } from "lit";
-import { hostAttributes as g } from "./decorators.js";
-import { preventScrollOnSpacebarPress as p, forwardEventToHost as C } from "./eventing.js";
-import { getLocalName as b } from "./dom.js";
+import { property as o, state as g } from "lit/decorators.js";
+import { defaultConverter as h, isServer as b, html as l, nothing as u, css as C } from "lit";
+import { hostAttributes as x } from "./decorators.js";
+import { preventScrollOnSpacebarPress as p, forwardEventToHost as S, EventEmitter as k } from "./eventing.js";
+import { getLocalName as v } from "./dom.js";
 import "../screen-reader-only.js";
-var S = Object.defineProperty, k = Object.getOwnPropertyDescriptor, E = (a, r, s, t) => {
-  for (var e = k(r, s), i = a.length - 1, n; i >= 0; i--)
-    (n = a[i]) && (e = n(r, s, e) || e);
-  return e && S(r, s, e), e;
+var w = Object.defineProperty, E = Object.getOwnPropertyDescriptor, P = (n, r, s, t) => {
+  for (var e = E(r, s), i = n.length - 1, a; i >= 0; i--)
+    (a = n[i]) && (e = a(r, s, e) || e);
+  return e && w(r, s, e), e;
 };
-const y = (a) => {
-  class r extends a {
+const y = (n) => {
+  class r extends n {
     constructor() {
       super(...arguments), this._disabled = !1;
     }
@@ -28,24 +28,24 @@ const y = (a) => {
       return !1;
     }
   }
-  return E([
-    l({ reflect: !0, type: Boolean })
+  return P([
+    o({ reflect: !0, type: Boolean })
   ], r.prototype, "disabled"), r;
-}, X = (a) => {
-  class r extends y(a) {
+}, W = (n) => {
+  class r extends y(n) {
     willUpdate(t) {
       super.willUpdate(t), t.has("disabled") && (this.disabled ? (this.setAttribute("aria-disabled", "true"), this.removeAttribute("tabindex")) : (this.removeAttribute("aria-disabled"), this.setAttribute("tabindex", "0")));
     }
   }
   return r;
 };
-var x = Object.defineProperty, w = Object.getOwnPropertyDescriptor, d = (a, r, s, t) => {
-  for (var e = t > 1 ? void 0 : t ? w(r, s) : r, i = a.length - 1, n; i >= 0; i--)
-    (n = a[i]) && (e = (t ? n(r, s, e) : n(e)) || e);
-  return t && e && x(r, s, e), e;
+var $ = Object.defineProperty, R = Object.getOwnPropertyDescriptor, d = (n, r, s, t) => {
+  for (var e = t > 1 ? void 0 : t ? R(r, s) : r, i = n.length - 1, a; i >= 0; i--)
+    (a = n[i]) && (e = (t ? a(r, s, e) : a(e)) || e);
+  return t && e && $(r, s, e), e;
 };
-const $ = (a) => {
-  const s = class s extends a {
+const A = (n) => {
+  const s = class s extends n {
     constructor() {
       super(...arguments), this._value = null, this.internals = this.attachInternals(), this.formDisabled = !1;
     }
@@ -97,8 +97,8 @@ const $ = (a) => {
     get willValidate() {
       return this.internals.willValidate;
     }
-    attributeChangedCallback(e, i, n) {
-      (e !== "name" || i !== n) && super.attributeChangedCallback(e, i, n);
+    attributeChangedCallback(e, i, a) {
+      (e !== "name" || i !== a) && super.attributeChangedCallback(e, i, a);
     }
     /**
      * Returns true if internals target element has no validity problems; false otherwise.
@@ -136,20 +136,20 @@ const $ = (a) => {
   s.formAssociated = !0;
   let r = s;
   return d([
-    l()
+    o()
   ], r.prototype, "name", 1), d([
-    l()
+    o()
   ], r.prototype, "value", 1), d([
-    _()
+    g()
   ], r.prototype, "formDisabled", 2), r;
 };
-var R = Object.defineProperty, A = Object.getOwnPropertyDescriptor, P = (a, r, s, t) => {
-  for (var e = A(r, s), i = a.length - 1, n; i >= 0; i--)
-    (n = a[i]) && (e = n(r, s, e) || e);
-  return e && R(r, s, e), e;
+var O = Object.defineProperty, q = Object.getOwnPropertyDescriptor, L = (n, r, s, t) => {
+  for (var e = q(r, s), i = n.length - 1, a; i >= 0; i--)
+    (a = n[i]) && (e = a(r, s, e) || e);
+  return e && O(r, s, e), e;
 };
-const O = (a) => {
-  class r extends a {
+const U = (n) => {
+  class r extends n {
     constructor() {
       super(...arguments), this._required = !1;
     }
@@ -170,17 +170,17 @@ const O = (a) => {
       return !1;
     }
   }
-  return P([
-    l({ reflect: !0, type: Boolean })
+  return L([
+    o({ reflect: !0, type: Boolean })
   ], r.prototype, "required"), r;
 };
-var q = Object.defineProperty, L = Object.getOwnPropertyDescriptor, f = (a, r, s, t) => {
-  for (var e = t > 1 ? void 0 : t ? L(r, s) : r, i = a.length - 1, n; i >= 0; i--)
-    (n = a[i]) && (e = (t ? n(r, s, e) : n(e)) || e);
-  return t && e && q(r, s, e), e;
+var D = Object.defineProperty, M = Object.getOwnPropertyDescriptor, f = (n, r, s, t) => {
+  for (var e = t > 1 ? void 0 : t ? M(r, s) : r, i = n.length - 1, a; i >= 0; i--)
+    (a = n[i]) && (e = (t ? a(r, s, e) : a(e)) || e);
+  return t && e && D(r, s, e), e;
 };
-const z = (a) => {
-  let r = class extends y(O($(a))) {
+const Y = (n) => {
+  let r = class extends y(U(A(n))) {
     constructor() {
       super(), this._attributeMutationBlocked = !1, this._checked = !1, this._handleKeyboardInteraction = (s) => {
         s.key === " " && this._handleUserInteraction();
@@ -230,24 +230,24 @@ const z = (a) => {
     }
   };
   return f([
-    l({
+    o({
       type: Boolean,
       converter: {
-        ...u,
+        ...h,
         // We need to pass information to the setter so that we know it was called by attribute change.
         fromAttribute: (s, t) => {
-          var i, n;
-          return { value: (n = (i = u).fromAttribute) == null ? void 0 : n.call(i, s, t), attribute: !0 };
+          var i, a;
+          return { value: (a = (i = h).fromAttribute) == null ? void 0 : a.call(i, s, t), attribute: !0 };
         }
       }
     })
   ], r.prototype, "checked", 1), r = f([
-    g({
+    x({
       tabindex: "0"
     })
   ], r), r;
-}, U = "litElementHydrateSupport", D = h || globalThis.testGroup === "ssr-non-hydrated", M = (a) => {
-  class r extends a {
+}, B = "litElementHydrateSupport", H = b || globalThis.testGroup === "ssr-non-hydrated", I = (n) => {
+  class r extends n {
     constructor() {
       super(...arguments), this._hydrationRequired = !1, this._hydrationComplete = new Promise(
         (t) => this._resolveHydration = t
@@ -256,7 +256,7 @@ const z = (a) => {
           return;
         t.stopImmediatePropagation();
         const e = t.target;
-        this.hydrationComplete.then(() => C(t, e));
+        this.hydrationComplete.then(() => S(t, e));
       };
     }
     /**
@@ -272,17 +272,17 @@ const z = (a) => {
     }
     createRenderRoot() {
       var t, e;
-      if (this._hydrationRequired = !!this.shadowRoot && U in globalThis && (h || !D), !this._hydrationRequired)
+      if (this._hydrationRequired = !!this.shadowRoot && B in globalThis && (b || !H), !this._hydrationRequired)
         this._resolveHydration(!1);
       else {
         const i = (t = this.shadowRoot) == null ? void 0 : t.querySelectorAll("slot");
         i != null && i.length && (i.forEach(
-          (n) => n.addEventListener("slotchange", this._handleBeforeHydrationSlotchange, {
+          (a) => a.addEventListener("slotchange", this._handleBeforeHydrationSlotchange, {
             capture: !0
           })
         ), this.hydrationComplete.then(
           () => i.forEach(
-            (n) => n.removeEventListener("slotchange", this._handleBeforeHydrationSlotchange)
+            (a) => a.removeEventListener("slotchange", this._handleBeforeHydrationSlotchange)
           )
         )), (e = this.recoverSsrState) == null || e.call(this);
       }
@@ -290,7 +290,7 @@ const z = (a) => {
     }
     willUpdate(t) {
       var e;
-      super.willUpdate(t), h && ((e = this.recoverSsrState) == null || e.call(this));
+      super.willUpdate(t), b && ((e = this.recoverSsrState) == null || e.call(this));
     }
     update(t) {
       super.update(t), this._hydrationRequired && (this._hydrationRequired = !1, this._resolveHydration(!0));
@@ -303,20 +303,20 @@ const z = (a) => {
   }
   return r;
 };
-var B = Object.defineProperty, H = (a, r, s, t) => {
-  for (var e = void 0, i = a.length - 1, n; i >= 0; i--)
-    (n = a[i]) && (e = n(r, s, e) || e);
-  return e && B(r, s, e), e;
+var N = Object.defineProperty, V = (n, r, s, t) => {
+  for (var e = void 0, i = n.length - 1, a; i >= 0; i--)
+    (a = n[i]) && (e = a(r, s, e) || e);
+  return e && N(r, s, e), e;
 };
-const m = "data-ssr-child-count", v = "li", J = (a) => {
-  class r extends M(a) {
+const m = "data-ssr-child-count", _ = "li", Z = (n) => {
+  class r extends I(n) {
     constructor() {
       super(...arguments), this.listChildren = [], this._handleSlotchange = () => {
         const t = Array.from(this.children ?? []).filter(
           (e) => this.listChildLocalNames.includes(e.localName)
         );
         t.length === this.listChildren.length && this.listChildren.every((e, i) => t[i] === e) || (this.listChildren.filter((e) => !t.includes(e)).forEach((e) => e.removeAttribute("slot")), this.listChildren = t, this.listChildren.forEach(
-          (e, i) => e.setAttribute("slot", `${v}-${i}`)
+          (e, i) => e.setAttribute("slot", `${_}-${i}`)
         ), this.removeAttribute(m));
       };
     }
@@ -339,17 +339,17 @@ const m = "data-ssr-child-count", v = "li", J = (a) => {
      */
     renderList(t = {}) {
       const e = this.listSlotNames();
-      return e.length >= 2 ? o`
+      return e.length >= 2 ? l`
           <ul
-            class=${t.class || (this.localName ?? b(this))}
-            aria-label=${t.ariaLabel || c}
-            aria-labelledby=${t.ariaLabelledby || c}
+            class=${t.class || (this.localName ?? v(this))}
+            aria-label=${t.ariaLabel || u}
+            aria-labelledby=${t.ariaLabelledby || u}
           >
-            ${e.map((i) => o`<li><slot name=${i}></slot></li>`)}
+            ${e.map((i) => l`<li><slot name=${i}></slot></li>`)}
           </ul>
           ${this.renderHiddenSlot()}
-        ` : e.length === 1 ? o`<sbb-screen-reader-only>${t.ariaLabel}</sbb-screen-reader-only>
-          <span class=${t.class || (this.localName ?? b(this))}>
+        ` : e.length === 1 ? l`<sbb-screen-reader-only>${t.ariaLabel}</sbb-screen-reader-only>
+          <span class=${t.class || (this.localName ?? v(this))}>
             <span><slot name=${e[0]}></slot></span>
           </span>
           ${this.renderHiddenSlot()} ` : this.renderHiddenSlot();
@@ -364,7 +364,7 @@ const m = "data-ssr-child-count", v = "li", J = (a) => {
      * children to be passed via the `data-ssr-child-count` attribute value.
      */
     listSlotNames() {
-      return (this.listChildren.length ? this.listChildren : Array.from({ length: +(this.getAttribute(m) ?? 0) })).map((e, i) => `${v}-${i}`);
+      return (this.listChildren.length ? this.listChildren : Array.from({ length: +(this.getAttribute(m) ?? 0) })).map((e, i) => `${_}-${i}`);
     }
     /**
      * Returns a hidden slot, which is intended as the children change detection.
@@ -372,29 +372,58 @@ const m = "data-ssr-child-count", v = "li", J = (a) => {
      * the slotchange event, which can be used to assign it to the appropriate named slot.
      */
     renderHiddenSlot() {
-      return o`<span hidden><slot></slot></span>`;
+      return l`<span hidden><slot></slot></span>`;
     }
   }
-  return H([
-    _()
+  return V([
+    g()
   ], r.prototype, "listChildren"), r;
 };
-var I = Object.defineProperty, N = (a, r, s, t) => {
-  for (var e = void 0, i = a.length - 1, n; i >= 0; i--)
-    (n = a[i]) && (e = n(r, s, e) || e);
-  return e && I(r, s, e), e;
+var j = Object.defineProperty, T = (n, r, s, t) => {
+  for (var e = void 0, i = n.length - 1, a; i >= 0; i--)
+    (a = n[i]) && (e = a(r, s, e) || e);
+  return e && j(r, s, e), e;
 };
-const Q = (a) => {
-  class r extends a {
+const ee = (n) => {
+  class r extends n {
     constructor() {
       super(...arguments), this.negative = !1;
     }
   }
-  return N([
-    l({ reflect: !0, type: Boolean })
+  return T([
+    o({ reflect: !0, type: Boolean })
   ], r.prototype, "negative"), r;
-}, W = (a) => {
-  class r extends a {
+};
+var F = Object.defineProperty, c = (n, r, s, t) => {
+  for (var e = void 0, i = n.length - 1, a; i >= 0; i--)
+    (a = n[i]) && (e = a(r, s, e) || e);
+  return e && F(r, s, e), e;
+};
+const te = (n) => {
+  var t;
+  const r = (t = class extends n {
+    constructor() {
+      super(...arguments), this.color = "white", this.borderless = !1, this._panelConnected = new k(
+        this,
+        t.events.panelConnected,
+        { bubbles: !0 }
+      );
+    }
+    connectedCallback() {
+      super.connectedCallback(), this._panelConnected.emit();
+    }
+  }, t.events = {
+    panelConnected: "panelConnected"
+  }, t);
+  return c([
+    o()
+  ], r.prototype, "color"), c([
+    o({ reflect: !0, type: Boolean })
+  ], r.prototype, "borderless"), c([
+    o()
+  ], r.prototype, "expansionState"), r;
+}, re = (n) => {
+  class r extends n {
     constructor() {
       super(...arguments), this._updatePromise = Promise.resolve(), this._updateResolve = () => {
       };
@@ -411,15 +440,17 @@ const Q = (a) => {
     }
   }
   return r;
-};
+}, se = C`:host{--sbb-selection-panel-background: var( --sbb-selection-expansion-panel-inner-background, var(--sbb-color-white) );--sbb-selection-panel-border-color: var(--sbb-color-cloud);--sbb-selection-panel-border-radius: var( --sbb-selection-expansion-panel-border-radius, var(--sbb-border-radius-4x) );--sbb-selection-panel-border-width: var( --sbb-selection-expansion-panel-inner-border-width, var(--sbb-border-width-1x) );--sbb-selection-panel-input-padding: var(--sbb-spacing-responsive-xs) var(--sbb-spacing-responsive-xxs);--sbb-selection-panel-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x) );--sbb-selection-panel-cursor: pointer;--sbb-selection-panel-suffix-color: var(--sbb-color-charcoal);--sbb-selection-panel-subtext-color: var(--sbb-color-granite);display:block;outline:none!important}:host([color=milk]){--sbb-selection-panel-background: var( --sbb-selection-expansion-panel-inner-background, var(--sbb-color-milk) )}:host([borderless]:not([data-checked])){--sbb-selection-panel-border-color: transparent}:host(:is([data-checked]):not(:disabled,[disabled])){--sbb-selection-panel-border-color: var(--sbb-color-charcoal);--sbb-selection-panel-border-width: var( --sbb-selection-expansion-panel-inner-border-width, var(--sbb-border-width-2x) )}:host(:is(:disabled,[disabled])){--sbb-selection-panel-cursor: default}.sbb-selection-panel{display:block;cursor:var(--sbb-selection-panel-cursor);position:relative;border-radius:var(--sbb-selection-panel-border-radius);box-shadow:inset 0 0 0 var(--sbb-selection-panel-border-width) var(--sbb-selection-panel-border-color);padding:var(--sbb-selection-panel-input-padding);background-color:var(--sbb-selection-panel-background);transition-duration:var(--sbb-selection-panel-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:box-shadow}@media (forced-colors: active){.sbb-selection-panel:after{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;border:var(--sbb-selection-panel-border-width) solid var(--sbb-selection-panel-border-color);border-radius:var(--sbb-selection-panel-border-radius)}}:host(:focus-visible) .sbb-selection-panel{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}.sbb-selection-panel__badge{-webkit-user-select:none;user-select:none;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--sbb-selection-panel-border-radius);overflow:hidden}slot[name=suffix]{color:var(--sbb-selection-panel-suffix-color)}slot[name=subtext]{display:block;color:var(--sbb-selection-panel-subtext-color);padding-inline-start:var(--sbb-spacing-fixed-8x)}:host(:not([data-slot-names~=subtext])) slot[name=subtext]{display:none}`;
 export {
   y as SbbDisabledMixin,
-  X as SbbDisabledTabIndexActionMixin,
-  z as SbbFormAssociatedCheckboxMixin,
-  $ as SbbFormAssociatedMixin,
-  M as SbbHydrationMixin,
-  J as SbbNamedSlotListMixin,
-  Q as SbbNegativeMixin,
-  O as SbbRequiredMixin,
-  W as SbbUpdateSchedulerMixin
+  W as SbbDisabledTabIndexActionMixin,
+  Y as SbbFormAssociatedCheckboxMixin,
+  A as SbbFormAssociatedMixin,
+  I as SbbHydrationMixin,
+  Z as SbbNamedSlotListMixin,
+  ee as SbbNegativeMixin,
+  te as SbbPanelMixin,
+  U as SbbRequiredMixin,
+  re as SbbUpdateSchedulerMixin,
+  se as panelCommonStyle
 };

package/core/styles/node_modules_@sbb-esta_lyne-design-tokens_dist_scss_sbb-variables_css--mixin.scss

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 28 May 2024 11:11:03 GMT
+ * Generated on Fri, 14 Jun 2024 15:20:35 GMT
  */
 
 @mixin lyne-design-tokens-css-variables {

package/core.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 28 May 2024 11:11:03 GMT
+ * Generated on Fri, 14 Jun 2024 15:20:35 GMT
  */
 /**
  * Better font rendering (on OS X)