@ucalgary-design-system/dropdown 1.0.2 → 1.0.3

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @ucalgary-design-system/dropdown
 
+## 1.0.3
+
+### Patch Changes
+
+- c3fdd31: Updated dependencies and modified build
+- Updated dependencies [386b04a]
+- Updated dependencies [c3fdd31]
+  - @ucalgary-design-system/icon@1.0.3
+  - @ucalgary-design-system/core@1.0.3
+
 ## 1.0.2
 
 ### Patch Changes

package/index.js

@@ -1,5 +1,6 @@
-import { unsafeCSS as oe, nothing as L, html as H } from "lit";
-import { BaseElement as N } from "@ucalgary-design-system/core";
+import { unsafeCSS as A, nothing as v, html as y } from "lit";
+import { classMap as M } from "lit/directives/class-map.js";
+import { BaseElement as _ } from "@ucalgary-design-system/core";
 import "@ucalgary-design-system/helper-components";
 import "@ucalgary-design-system/icon";
 /**
@@ -7,28 +8,28 @@ import "@ucalgary-design-system/icon";
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const ne = (r) => (e, t) => {
+const I = (s) => (e, t) => {
   t !== void 0 ? t.addInitializer(() => {
-    customElements.define(r, e);
-  }) : customElements.define(r, e);
+    customElements.define(s, e);
+  }) : customElements.define(s, e);
 };
 /**
  * @license
  * Copyright 2019 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const M = globalThis, K = M.ShadowRoot && (M.ShadyCSS === void 0 || M.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, le = Symbol(), F = /* @__PURE__ */ new WeakMap();
-let pe = class {
-  constructor(e, t, s) {
-    if (this._$cssResult$ = !0, s !== le) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+const w = globalThis, x = w.ShadowRoot && (w.ShadyCSS === void 0 || w.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, L = Symbol(), C = /* @__PURE__ */ new WeakMap();
+let D = class {
+  constructor(e, t, i) {
+    if (this._$cssResult$ = !0, i !== L) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
     this.cssText = e, this.t = t;
   }
   get styleSheet() {
     let e = this.o;
     const t = this.t;
-    if (K && e === void 0) {
-      const s = t !== void 0 && t.length === 1;
-      s && (e = F.get(t)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), s && F.set(t, e));
+    if (x && e === void 0) {
+      const i = t !== void 0 && t.length === 1;
+      i && (e = C.get(t)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), i && C.set(t, e));
     }
     return e;
   }
@@ -36,115 +37,113 @@ let pe = class {
     return this.cssText;
   }
 };
-const fe = (r) => new pe(typeof r == "string" ? r : r + "", void 0, le), me = (r, e) => {
-  if (K) r.adoptedStyleSheets = e.map((t) => t instanceof CSSStyleSheet ? t : t.styleSheet);
+const R = (s) => new D(typeof s == "string" ? s : s + "", void 0, L), z = (s, e) => {
+  if (x) s.adoptedStyleSheets = e.map((t) => t instanceof CSSStyleSheet ? t : t.styleSheet);
   else for (const t of e) {
-    const s = document.createElement("style"), i = M.litNonce;
-    i !== void 0 && s.setAttribute("nonce", i), s.textContent = t.cssText, r.appendChild(s);
+    const i = document.createElement("style"), o = w.litNonce;
+    o !== void 0 && i.setAttribute("nonce", o), i.textContent = t.cssText, s.appendChild(i);
   }
-}, X = K ? (r) => r : (r) => r instanceof CSSStyleSheet ? ((e) => {
+}, O = x ? (s) => s : (s) => s instanceof CSSStyleSheet ? ((e) => {
   let t = "";
-  for (const s of e.cssRules) t += s.cssText;
-  return fe(t);
-})(r) : r;
+  for (const i of e.cssRules) t += i.cssText;
+  return R(t);
+})(s) : s;
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const { is: $e, defineProperty: _e, getOwnPropertyDescriptor: ve, getOwnPropertyNames: ge, getOwnPropertySymbols: be, getPrototypeOf: ye } = Object, g = globalThis, G = g.trustedTypes, we = G ? G.emptyScript : "", B = g.reactiveElementPolyfillSupport, C = (r, e) => r, T = { toAttribute(r, e) {
+const { is: j, defineProperty: q, getOwnPropertyDescriptor: T, getOwnPropertyNames: B, getOwnPropertySymbols: H, getPrototypeOf: V } = Object, u = globalThis, k = u.trustedTypes, K = k ? k.emptyScript : "", $ = u.reactiveElementPolyfillSupport, f = (s, e) => s, g = { toAttribute(s, e) {
   switch (e) {
     case Boolean:
-      r = r ? we : null;
+      s = s ? K : null;
       break;
     case Object:
     case Array:
-      r = r == null ? r : JSON.stringify(r);
+      s = s == null ? s : JSON.stringify(s);
   }
-  return r;
-}, fromAttribute(r, e) {
-  let t = r;
+  return s;
+}, fromAttribute(s, e) {
+  let t = s;
   switch (e) {
     case Boolean:
-      t = r !== null;
+      t = s !== null;
       break;
     case Number:
-      t = r === null ? null : Number(r);
+      t = s === null ? null : Number(s);
       break;
     case Object:
     case Array:
       try {
-        t = JSON.parse(r);
+        t = JSON.parse(s);
       } catch {
         t = null;
       }
   }
   return t;
-} }, W = (r, e) => !$e(r, e), Q = { attribute: !0, type: String, converter: T, reflect: !1, hasChanged: W };
-Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), g.litPropertyMetadata ?? (g.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
-class S extends HTMLElement {
+} }, E = (s, e) => !j(s, e), P = { attribute: !0, type: String, converter: g, reflect: !1, useDefault: !1, hasChanged: E };
+Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), u.litPropertyMetadata ?? (u.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
+class p extends HTMLElement {
   static addInitializer(e) {
     this._$Ei(), (this.l ?? (this.l = [])).push(e);
   }
   static get observedAttributes() {
     return this.finalize(), this._$Eh && [...this._$Eh.keys()];
   }
-  static createProperty(e, t = Q) {
-    if (t.state && (t.attribute = !1), this._$Ei(), this.elementProperties.set(e, t), !t.noAccessor) {
-      const s = Symbol(), i = this.getPropertyDescriptor(e, s, t);
-      i !== void 0 && _e(this.prototype, e, i);
+  static createProperty(e, t = P) {
+    if (t.state && (t.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(e) && ((t = Object.create(t)).wrapped = !0), this.elementProperties.set(e, t), !t.noAccessor) {
+      const i = Symbol(), o = this.getPropertyDescriptor(e, i, t);
+      o !== void 0 && q(this.prototype, e, o);
     }
   }
-  static getPropertyDescriptor(e, t, s) {
-    const { get: i, set: o } = ve(this.prototype, e) ?? { get() {
+  static getPropertyDescriptor(e, t, i) {
+    const { get: o, set: r } = T(this.prototype, e) ?? { get() {
       return this[t];
     }, set(n) {
       this[t] = n;
     } };
-    return { get() {
-      return i == null ? void 0 : i.call(this);
-    }, set(n) {
-      const a = i == null ? void 0 : i.call(this);
-      o.call(this, n), this.requestUpdate(e, a, s);
+    return { get: o, set(n) {
+      const a = o == null ? void 0 : o.call(this);
+      r == null || r.call(this, n), this.requestUpdate(e, a, i);
     }, configurable: !0, enumerable: !0 };
   }
   static getPropertyOptions(e) {
-    return this.elementProperties.get(e) ?? Q;
+    return this.elementProperties.get(e) ?? P;
   }
   static _$Ei() {
-    if (this.hasOwnProperty(C("elementProperties"))) return;
-    const e = ye(this);
+    if (this.hasOwnProperty(f("elementProperties"))) return;
+    const e = V(this);
     e.finalize(), e.l !== void 0 && (this.l = [...e.l]), this.elementProperties = new Map(e.elementProperties);
   }
   static finalize() {
-    if (this.hasOwnProperty(C("finalized"))) return;
-    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(C("properties"))) {
-      const t = this.properties, s = [...ge(t), ...be(t)];
-      for (const i of s) this.createProperty(i, t[i]);
+    if (this.hasOwnProperty(f("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(f("properties"))) {
+      const t = this.properties, i = [...B(t), ...H(t)];
+      for (const o of i) this.createProperty(o, t[o]);
     }
     const e = this[Symbol.metadata];
     if (e !== null) {
       const t = litPropertyMetadata.get(e);
-      if (t !== void 0) for (const [s, i] of t) this.elementProperties.set(s, i);
+      if (t !== void 0) for (const [i, o] of t) this.elementProperties.set(i, o);
     }
     this._$Eh = /* @__PURE__ */ new Map();
-    for (const [t, s] of this.elementProperties) {
-      const i = this._$Eu(t, s);
-      i !== void 0 && this._$Eh.set(i, t);
+    for (const [t, i] of this.elementProperties) {
+      const o = this._$Eu(t, i);
+      o !== void 0 && this._$Eh.set(o, t);
     }
     this.elementStyles = this.finalizeStyles(this.styles);
   }
   static finalizeStyles(e) {
     const t = [];
     if (Array.isArray(e)) {
-      const s = new Set(e.flat(1 / 0).reverse());
-      for (const i of s) t.unshift(X(i));
-    } else e !== void 0 && t.push(X(e));
+      const i = new Set(e.flat(1 / 0).reverse());
+      for (const o of i) t.unshift(O(o));
+    } else e !== void 0 && t.push(O(e));
     return t;
   }
   static _$Eu(e, t) {
-    const s = t.attribute;
-    return s === !1 ? void 0 : typeof s == "string" ? s : typeof e == "string" ? e.toLowerCase() : void 0;
+    const i = t.attribute;
+    return i === !1 ? void 0 : typeof i == "string" ? i : typeof e == "string" ? e.toLowerCase() : void 0;
   }
   constructor() {
     super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
@@ -163,18 +162,18 @@ class S extends HTMLElement {
   }
   _$E_() {
     const e = /* @__PURE__ */ new Map(), t = this.constructor.elementProperties;
-    for (const s of t.keys()) this.hasOwnProperty(s) && (e.set(s, this[s]), delete this[s]);
+    for (const i of t.keys()) this.hasOwnProperty(i) && (e.set(i, this[i]), delete this[i]);
     e.size > 0 && (this._$Ep = e);
   }
   createRenderRoot() {
     const e = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
-    return me(e, this.constructor.elementStyles), e;
+    return z(e, this.constructor.elementStyles), e;
   }
   connectedCallback() {
     var e;
     this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this.enableUpdating(!0), (e = this._$EO) == null || e.forEach((t) => {
-      var s;
-      return (s = t.hostConnected) == null ? void 0 : s.call(t);
+      var i;
+      return (i = t.hostConnected) == null ? void 0 : i.call(t);
     });
   }
   enableUpdating(e) {
@@ -182,40 +181,44 @@ class S extends HTMLElement {
   disconnectedCallback() {
     var e;
     (e = this._$EO) == null || e.forEach((t) => {
-      var s;
-      return (s = t.hostDisconnected) == null ? void 0 : s.call(t);
+      var i;
+      return (i = t.hostDisconnected) == null ? void 0 : i.call(t);
     });
   }
-  attributeChangedCallback(e, t, s) {
-    this._$AK(e, s);
+  attributeChangedCallback(e, t, i) {
+    this._$AK(e, i);
   }
-  _$EC(e, t) {
-    var o;
-    const s = this.constructor.elementProperties.get(e), i = this.constructor._$Eu(e, s);
-    if (i !== void 0 && s.reflect === !0) {
-      const n = (((o = s.converter) == null ? void 0 : o.toAttribute) !== void 0 ? s.converter : T).toAttribute(t, s.type);
-      this._$Em = e, n == null ? this.removeAttribute(i) : this.setAttribute(i, n), this._$Em = null;
+  _$ET(e, t) {
+    var r;
+    const i = this.constructor.elementProperties.get(e), o = this.constructor._$Eu(e, i);
+    if (o !== void 0 && i.reflect === !0) {
+      const n = (((r = i.converter) == null ? void 0 : r.toAttribute) !== void 0 ? i.converter : g).toAttribute(t, i.type);
+      this._$Em = e, n == null ? this.removeAttribute(o) : this.setAttribute(o, n), this._$Em = null;
     }
   }
   _$AK(e, t) {
-    var o;
-    const s = this.constructor, i = s._$Eh.get(e);
-    if (i !== void 0 && this._$Em !== i) {
-      const n = s.getPropertyOptions(i), a = typeof n.converter == "function" ? { fromAttribute: n.converter } : ((o = n.converter) == null ? void 0 : o.fromAttribute) !== void 0 ? n.converter : T;
-      this._$Em = i, this[i] = a.fromAttribute(t, n.type), this._$Em = null;
+    var r, n;
+    const i = this.constructor, o = i._$Eh.get(e);
+    if (o !== void 0 && this._$Em !== o) {
+      const a = i.getPropertyOptions(o), d = typeof a.converter == "function" ? { fromAttribute: a.converter } : ((r = a.converter) == null ? void 0 : r.fromAttribute) !== void 0 ? a.converter : g;
+      this._$Em = o;
+      const b = d.fromAttribute(t, a.type);
+      this[o] = b ?? ((n = this._$Ej) == null ? void 0 : n.get(o)) ?? b, this._$Em = null;
     }
   }
-  requestUpdate(e, t, s) {
+  requestUpdate(e, t, i) {
+    var o;
     if (e !== void 0) {
-      if (s ?? (s = this.constructor.getPropertyOptions(e)), !(s.hasChanged ?? W)(this[e], t)) return;
-      this.P(e, t, s);
+      const r = this.constructor, n = this[e];
+      if (i ?? (i = r.getPropertyOptions(e)), !((i.hasChanged ?? E)(n, t) || i.useDefault && i.reflect && n === ((o = this._$Ej) == null ? void 0 : o.get(e)) && !this.hasAttribute(r._$Eu(e, i)))) return;
+      this.C(e, t, i);
     }
-    this.isUpdatePending === !1 && (this._$ES = this._$ET());
+    this.isUpdatePending === !1 && (this._$ES = this._$EP());
   }
-  P(e, t, s) {
-    this._$AL.has(e) || this._$AL.set(e, t), s.reflect === !0 && this._$Em !== e && (this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Set())).add(e);
+  C(e, t, { useDefault: i, reflect: o, wrapped: r }, n) {
+    i && !(this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Map())).has(e) && (this._$Ej.set(e, n ?? t ?? this[e]), r !== !0 || n !== void 0) || (this._$AL.has(e) || (this.hasUpdated || i || (t = void 0), this._$AL.set(e, t)), o === !0 && this._$Em !== e && (this._$Eq ?? (this._$Eq = /* @__PURE__ */ new Set())).add(e));
   }
-  async _$ET() {
+  async _$EP() {
     this.isUpdatePending = !0;
     try {
       await this._$ES;
@@ -229,25 +232,28 @@ class S extends HTMLElement {
     return this.performUpdate();
   }
   performUpdate() {
-    var s;
+    var i;
     if (!this.isUpdatePending) return;
     if (!this.hasUpdated) {
       if (this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this._$Ep) {
-        for (const [o, n] of this._$Ep) this[o] = n;
+        for (const [r, n] of this._$Ep) this[r] = n;
         this._$Ep = void 0;
       }
-      const i = this.constructor.elementProperties;
-      if (i.size > 0) for (const [o, n] of i) n.wrapped !== !0 || this._$AL.has(o) || this[o] === void 0 || this.P(o, this[o], n);
+      const o = this.constructor.elementProperties;
+      if (o.size > 0) for (const [r, n] of o) {
+        const { wrapped: a } = n, d = this[r];
+        a !== !0 || this._$AL.has(r) || d === void 0 || this.C(r, void 0, n, d);
+      }
     }
     let e = !1;
     const t = this._$AL;
     try {
-      e = this.shouldUpdate(t), e ? (this.willUpdate(t), (s = this._$EO) == null || s.forEach((i) => {
-        var o;
-        return (o = i.hostUpdate) == null ? void 0 : o.call(i);
-      }), this.update(t)) : this._$EU();
-    } catch (i) {
-      throw e = !1, this._$EU(), i;
+      e = this.shouldUpdate(t), e ? (this.willUpdate(t), (i = this._$EO) == null || i.forEach((o) => {
+        var r;
+        return (r = o.hostUpdate) == null ? void 0 : r.call(o);
+      }), this.update(t)) : this._$EM();
+    } catch (o) {
+      throw e = !1, this._$EM(), o;
     }
     e && this._$AE(t);
   }
@@ -255,12 +261,12 @@ class S extends HTMLElement {
   }
   _$AE(e) {
     var t;
-    (t = this._$EO) == null || t.forEach((s) => {
-      var i;
-      return (i = s.hostUpdated) == null ? void 0 : i.call(s);
+    (t = this._$EO) == null || t.forEach((i) => {
+      var o;
+      return (o = i.hostUpdated) == null ? void 0 : o.call(i);
     }), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(e)), this.updated(e);
   }
-  _$EU() {
+  _$EM() {
     this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1;
   }
   get updateComplete() {
@@ -273,359 +279,82 @@ class S extends HTMLElement {
     return !0;
   }
   update(e) {
-    this._$Ej && (this._$Ej = this._$Ej.forEach((t) => this._$EC(t, this[t]))), this._$EU();
+    this._$Eq && (this._$Eq = this._$Eq.forEach((t) => this._$ET(t, this[t]))), this._$EM();
   }
   updated(e) {
   }
   firstUpdated(e) {
   }
 }
-S.elementStyles = [], S.shadowRootOptions = { mode: "open" }, S[C("elementProperties")] = /* @__PURE__ */ new Map(), S[C("finalized")] = /* @__PURE__ */ new Map(), B == null || B({ ReactiveElement: S }), (g.reactiveElementVersions ?? (g.reactiveElementVersions = [])).push("2.0.4");
+p.elementStyles = [], p.shadowRootOptions = { mode: "open" }, p[f("elementProperties")] = /* @__PURE__ */ new Map(), p[f("finalized")] = /* @__PURE__ */ new Map(), $ == null || $({ ReactiveElement: p }), (u.reactiveElementVersions ?? (u.reactiveElementVersions = [])).push("2.1.1");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const Ae = { attribute: !0, type: String, converter: T, reflect: !1, hasChanged: W }, xe = (r = Ae, e, t) => {
-  const { kind: s, metadata: i } = t;
-  let o = globalThis.litPropertyMetadata.get(i);
-  if (o === void 0 && globalThis.litPropertyMetadata.set(i, o = /* @__PURE__ */ new Map()), o.set(t.name, r), s === "accessor") {
+const N = { attribute: !0, type: String, converter: g, reflect: !1, hasChanged: E }, J = (s = N, e, t) => {
+  const { kind: i, metadata: o } = t;
+  let r = globalThis.litPropertyMetadata.get(o);
+  if (r === void 0 && globalThis.litPropertyMetadata.set(o, r = /* @__PURE__ */ new Map()), i === "setter" && ((s = Object.create(s)).wrapped = !0), r.set(t.name, s), i === "accessor") {
     const { name: n } = t;
     return { set(a) {
-      const l = e.get.call(this);
-      e.set.call(this, a), this.requestUpdate(n, l, r);
+      const d = e.get.call(this);
+      e.set.call(this, a), this.requestUpdate(n, d, s);
     }, init(a) {
-      return a !== void 0 && this.P(n, void 0, r), a;
+      return a !== void 0 && this.C(n, void 0, s, a), a;
     } };
   }
-  if (s === "setter") {
+  if (i === "setter") {
     const { name: n } = t;
     return function(a) {
-      const l = this[n];
-      e.call(this, a), this.requestUpdate(n, l, r);
+      const d = this[n];
+      e.call(this, a), this.requestUpdate(n, d, s);
     };
   }
-  throw Error("Unsupported decorator location: " + s);
+  throw Error("Unsupported decorator location: " + i);
 };
-function m(r) {
-  return (e, t) => typeof t == "object" ? xe(r, e, t) : ((s, i, o) => {
-    const n = i.hasOwnProperty(o);
-    return i.constructor.createProperty(o, n ? { ...s, wrapped: !0 } : s), n ? Object.getOwnPropertyDescriptor(i, o) : void 0;
-  })(r, e, t);
+function h(s) {
+  return (e, t) => typeof t == "object" ? J(s, e, t) : ((i, o, r) => {
+    const n = o.hasOwnProperty(r);
+    return o.constructor.createProperty(r, i), n ? Object.getOwnPropertyDescriptor(o, r) : void 0;
+  })(s, e, t);
 }
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-function ae(r) {
-  return m({ ...r, state: !0, attribute: !1 });
+function U(s) {
+  return h({ ...s, state: !0, attribute: !1 });
 }
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const Se = (r, e, t) => (t.configurable = !0, t.enumerable = !0, Reflect.decorate && typeof e != "object" && Object.defineProperty(r, e, t), t);
+const W = (s, e, t) => (t.configurable = !0, t.enumerable = !0, Reflect.decorate && typeof e != "object" && Object.defineProperty(s, e, t), t);
 /**
  * @license
  * Copyright 2021 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-function Ee(r) {
+function X(s) {
   return (e, t) => {
-    const { slot: s, selector: i } = r ?? {}, o = "slot" + (s ? `[name=${s}]` : ":not([name])");
-    return Se(e, t, { get() {
-      var l;
-      const n = (l = this.renderRoot) == null ? void 0 : l.querySelector(o), a = (n == null ? void 0 : n.assignedElements(r)) ?? [];
-      return i === void 0 ? a : a.filter((h) => h.matches(i));
+    const { slot: i, selector: o } = s ?? {}, r = "slot" + (i ? `[name=${i}]` : ":not([name])");
+    return W(e, t, { get() {
+      var d;
+      const n = (d = this.renderRoot) == null ? void 0 : d.querySelector(r), a = (n == null ? void 0 : n.assignedElements(s)) ?? [];
+      return o === void 0 ? a : a.filter((b) => b.matches(o));
     } });
   };
 }
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const O = globalThis, R = O.trustedTypes, Y = R ? R.createPolicy("lit-html", { createHTML: (r) => r }) : void 0, de = "$lit$", v = `lit$${Math.random().toFixed(9).slice(2)}$`, he = "?" + v, Ce = `<${he}>`, w = document, D = () => w.createComment(""), P = (r) => r === null || typeof r != "object" && typeof r != "function", J = Array.isArray, Oe = (r) => J(r) || typeof (r == null ? void 0 : r[Symbol.iterator]) == "function", q = `[ 	
-\f\r]`, E = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, ee = /-->/g, te = />/g, b = RegExp(`>|${q}(?:([^\\s"'>=/]+)(${q}*=${q}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`, "g"), se = /'/g, ie = /"/g, ce = /^(?:script|style|textarea|title)$/i, A = Symbol.for("lit-noChange"), c = Symbol.for("lit-nothing"), re = /* @__PURE__ */ new WeakMap(), y = w.createTreeWalker(w, 129);
-function ue(r, e) {
-  if (!J(r) || !r.hasOwnProperty("raw")) throw Error("invalid template strings array");
-  return Y !== void 0 ? Y.createHTML(e) : e;
-}
-const Pe = (r, e) => {
-  const t = r.length - 1, s = [];
-  let i, o = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", n = E;
-  for (let a = 0; a < t; a++) {
-    const l = r[a];
-    let h, u, d = -1, $ = 0;
-    for (; $ < l.length && (n.lastIndex = $, u = n.exec(l), u !== null); ) $ = n.lastIndex, n === E ? u[1] === "!--" ? n = ee : u[1] !== void 0 ? n = te : u[2] !== void 0 ? (ce.test(u[2]) && (i = RegExp("</" + u[2], "g")), n = b) : u[3] !== void 0 && (n = b) : n === b ? u[0] === ">" ? (n = i ?? E, d = -1) : u[1] === void 0 ? d = -2 : (d = n.lastIndex - u[2].length, h = u[1], n = u[3] === void 0 ? b : u[3] === '"' ? ie : se) : n === ie || n === se ? n = b : n === ee || n === te ? n = E : (n = b, i = void 0);
-    const _ = n === b && r[a + 1].startsWith("/>") ? " " : "";
-    o += n === E ? l + Ce : d >= 0 ? (s.push(h), l.slice(0, d) + de + l.slice(d) + v + _) : l + v + (d === -2 ? a : _);
-  }
-  return [ue(r, o + (r[t] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), s];
-};
-class k {
-  constructor({ strings: e, _$litType$: t }, s) {
-    let i;
-    this.parts = [];
-    let o = 0, n = 0;
-    const a = e.length - 1, l = this.parts, [h, u] = Pe(e, t);
-    if (this.el = k.createElement(h, s), y.currentNode = this.el.content, t === 2 || t === 3) {
-      const d = this.el.content.firstChild;
-      d.replaceWith(...d.childNodes);
-    }
-    for (; (i = y.nextNode()) !== null && l.length < a; ) {
-      if (i.nodeType === 1) {
-        if (i.hasAttributes()) for (const d of i.getAttributeNames()) if (d.endsWith(de)) {
-          const $ = u[n++], _ = i.getAttribute(d).split(v), U = /([.?@])?(.*)/.exec($);
-          l.push({ type: 1, index: o, name: U[2], strings: _, ctor: U[1] === "." ? Ie : U[1] === "?" ? Ue : U[1] === "@" ? Le : z }), i.removeAttribute(d);
-        } else d.startsWith(v) && (l.push({ type: 6, index: o }), i.removeAttribute(d));
-        if (ce.test(i.tagName)) {
-          const d = i.textContent.split(v), $ = d.length - 1;
-          if ($ > 0) {
-            i.textContent = R ? R.emptyScript : "";
-            for (let _ = 0; _ < $; _++) i.append(d[_], D()), y.nextNode(), l.push({ type: 2, index: ++o });
-            i.append(d[$], D());
-          }
-        }
-      } else if (i.nodeType === 8) if (i.data === he) l.push({ type: 2, index: o });
-      else {
-        let d = -1;
-        for (; (d = i.data.indexOf(v, d + 1)) !== -1; ) l.push({ type: 7, index: o }), d += v.length - 1;
-      }
-      o++;
-    }
-  }
-  static createElement(e, t) {
-    const s = w.createElement("template");
-    return s.innerHTML = e, s;
-  }
-}
-function x(r, e, t = r, s) {
-  var n, a;
-  if (e === A) return e;
-  let i = s !== void 0 ? (n = t._$Co) == null ? void 0 : n[s] : t._$Cl;
-  const o = P(e) ? void 0 : e._$litDirective$;
-  return (i == null ? void 0 : i.constructor) !== o && ((a = i == null ? void 0 : i._$AO) == null || a.call(i, !1), o === void 0 ? i = void 0 : (i = new o(r), i._$AT(r, t, s)), s !== void 0 ? (t._$Co ?? (t._$Co = []))[s] = i : t._$Cl = i), i !== void 0 && (e = x(r, i._$AS(r, e.values), i, s)), e;
-}
-class ke {
-  constructor(e, t) {
-    this._$AV = [], this._$AN = void 0, this._$AD = e, this._$AM = t;
-  }
-  get parentNode() {
-    return this._$AM.parentNode;
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  u(e) {
-    const { el: { content: t }, parts: s } = this._$AD, i = ((e == null ? void 0 : e.creationScope) ?? w).importNode(t, !0);
-    y.currentNode = i;
-    let o = y.nextNode(), n = 0, a = 0, l = s[0];
-    for (; l !== void 0; ) {
-      if (n === l.index) {
-        let h;
-        l.type === 2 ? h = new j(o, o.nextSibling, this, e) : l.type === 1 ? h = new l.ctor(o, l.name, l.strings, this, e) : l.type === 6 && (h = new He(o, this, e)), this._$AV.push(h), l = s[++a];
-      }
-      n !== (l == null ? void 0 : l.index) && (o = y.nextNode(), n++);
-    }
-    return y.currentNode = w, i;
-  }
-  p(e) {
-    let t = 0;
-    for (const s of this._$AV) s !== void 0 && (s.strings !== void 0 ? (s._$AI(e, s, t), t += s.strings.length - 2) : s._$AI(e[t])), t++;
-  }
-}
-class j {
-  get _$AU() {
-    var e;
-    return ((e = this._$AM) == null ? void 0 : e._$AU) ?? this._$Cv;
-  }
-  constructor(e, t, s, i) {
-    this.type = 2, this._$AH = c, this._$AN = void 0, this._$AA = e, this._$AB = t, this._$AM = s, this.options = i, this._$Cv = (i == null ? void 0 : i.isConnected) ?? !0;
-  }
-  get parentNode() {
-    let e = this._$AA.parentNode;
-    const t = this._$AM;
-    return t !== void 0 && (e == null ? void 0 : e.nodeType) === 11 && (e = t.parentNode), e;
-  }
-  get startNode() {
-    return this._$AA;
-  }
-  get endNode() {
-    return this._$AB;
-  }
-  _$AI(e, t = this) {
-    e = x(this, e, t), P(e) ? e === c || e == null || e === "" ? (this._$AH !== c && this._$AR(), this._$AH = c) : e !== this._$AH && e !== A && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Oe(e) ? this.k(e) : this._(e);
-  }
-  O(e) {
-    return this._$AA.parentNode.insertBefore(e, this._$AB);
-  }
-  T(e) {
-    this._$AH !== e && (this._$AR(), this._$AH = this.O(e));
-  }
-  _(e) {
-    this._$AH !== c && P(this._$AH) ? this._$AA.nextSibling.data = e : this.T(w.createTextNode(e)), this._$AH = e;
-  }
-  $(e) {
-    var o;
-    const { values: t, _$litType$: s } = e, i = typeof s == "number" ? this._$AC(e) : (s.el === void 0 && (s.el = k.createElement(ue(s.h, s.h[0]), this.options)), s);
-    if (((o = this._$AH) == null ? void 0 : o._$AD) === i) this._$AH.p(t);
-    else {
-      const n = new ke(i, this), a = n.u(this.options);
-      n.p(t), this.T(a), this._$AH = n;
-    }
-  }
-  _$AC(e) {
-    let t = re.get(e.strings);
-    return t === void 0 && re.set(e.strings, t = new k(e)), t;
-  }
-  k(e) {
-    J(this._$AH) || (this._$AH = [], this._$AR());
-    const t = this._$AH;
-    let s, i = 0;
-    for (const o of e) i === t.length ? t.push(s = new j(this.O(D()), this.O(D()), this, this.options)) : s = t[i], s._$AI(o), i++;
-    i < t.length && (this._$AR(s && s._$AB.nextSibling, i), t.length = i);
-  }
-  _$AR(e = this._$AA.nextSibling, t) {
-    var s;
-    for ((s = this._$AP) == null ? void 0 : s.call(this, !1, !0, t); e && e !== this._$AB; ) {
-      const i = e.nextSibling;
-      e.remove(), e = i;
-    }
-  }
-  setConnected(e) {
-    var t;
-    this._$AM === void 0 && (this._$Cv = e, (t = this._$AP) == null || t.call(this, e));
-  }
-}
-class z {
-  get tagName() {
-    return this.element.tagName;
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  constructor(e, t, s, i, o) {
-    this.type = 1, this._$AH = c, this._$AN = void 0, this.element = e, this.name = t, this._$AM = i, this.options = o, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = c;
-  }
-  _$AI(e, t = this, s, i) {
-    const o = this.strings;
-    let n = !1;
-    if (o === void 0) e = x(this, e, t, 0), n = !P(e) || e !== this._$AH && e !== A, n && (this._$AH = e);
-    else {
-      const a = e;
-      let l, h;
-      for (e = o[0], l = 0; l < o.length - 1; l++) h = x(this, a[s + l], t, l), h === A && (h = this._$AH[l]), n || (n = !P(h) || h !== this._$AH[l]), h === c ? e = c : e !== c && (e += (h ?? "") + o[l + 1]), this._$AH[l] = h;
-    }
-    n && !i && this.j(e);
-  }
-  j(e) {
-    e === c ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, e ?? "");
-  }
-}
-class Ie extends z {
-  constructor() {
-    super(...arguments), this.type = 3;
-  }
-  j(e) {
-    this.element[this.name] = e === c ? void 0 : e;
-  }
-}
-class Ue extends z {
-  constructor() {
-    super(...arguments), this.type = 4;
-  }
-  j(e) {
-    this.element.toggleAttribute(this.name, !!e && e !== c);
-  }
-}
-class Le extends z {
-  constructor(e, t, s, i, o) {
-    super(e, t, s, i, o), this.type = 5;
-  }
-  _$AI(e, t = this) {
-    if ((e = x(this, e, t, 0) ?? c) === A) return;
-    const s = this._$AH, i = e === c && s !== c || e.capture !== s.capture || e.once !== s.once || e.passive !== s.passive, o = e !== c && (s === c || i);
-    i && this.element.removeEventListener(this.name, this, s), o && this.element.addEventListener(this.name, this, e), this._$AH = e;
-  }
-  handleEvent(e) {
-    var t;
-    typeof this._$AH == "function" ? this._$AH.call(((t = this.options) == null ? void 0 : t.host) ?? this.element, e) : this._$AH.handleEvent(e);
-  }
-}
-class He {
-  constructor(e, t, s) {
-    this.element = e, this.type = 6, this._$AN = void 0, this._$AM = t, this.options = s;
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  _$AI(e) {
-    x(this, e);
-  }
-}
-const V = O.litHtmlPolyfillSupport;
-V == null || V(k, j), (O.litHtmlVersions ?? (O.litHtmlVersions = [])).push("3.2.1");
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const Me = { ATTRIBUTE: 1 }, Te = (r) => (...e) => ({ _$litDirective$: r, values: e });
-class Re {
-  constructor(e) {
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  _$AT(e, t, s) {
-    this._$Ct = e, this._$AM = t, this._$Ci = s;
-  }
-  _$AS(e, t) {
-    return this.update(e, t);
-  }
-  update(e, t) {
-    return this.render(...t);
-  }
-}
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const De = Te(class extends Re {
-  constructor(r) {
-    var e;
-    if (super(r), r.type !== Me.ATTRIBUTE || r.name !== "class" || ((e = r.strings) == null ? void 0 : e.length) > 2) throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.");
-  }
-  render(r) {
-    return " " + Object.keys(r).filter((e) => r[e]).join(" ") + " ";
-  }
-  update(r, [e]) {
-    var s, i;
-    if (this.st === void 0) {
-      this.st = /* @__PURE__ */ new Set(), r.strings !== void 0 && (this.nt = new Set(r.strings.join(" ").split(/\s/).filter((o) => o !== "")));
-      for (const o in e) e[o] && !((s = this.nt) != null && s.has(o)) && this.st.add(o);
-      return this.render(e);
-    }
-    const t = r.element.classList;
-    for (const o of this.st) o in e || (t.remove(o), this.st.delete(o));
-    for (const o in e) {
-      const n = !!e[o];
-      n === this.st.has(o) || (i = this.nt) != null && i.has(o) || (n ? (t.add(o), this.st.add(o)) : (t.remove(o), this.st.delete(o)));
-    }
-    return A;
-  }
-}), Ne = ':host{position:relative;display:block}.dropdown-wrapper{display:flex;flex-direction:column;gap:8px;align-items:start}.dropdown,.menu,.toggle,.dropdown-wrapper{min-width:115px;max-width:var(--ucds-form-element-maxwidth);width:var(--ucds-form-element-width)}.dropdown{position:relative}.toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;height:48px;padding:0 var(--ucds-form-element-horizontal-padding);font-family:var(--ucds-font-family-sans-serif);font-size:var(--ucds-font-base-size);border:var(--ucds-color-forms-input-border-rest) solid var(--ucds-form-element-border-width);border-radius:var(--ucds-form-element-border-radius);background-color:var(--ucds-color-forms-input-background-rest)}.toggle:focus{outline:var(--ucds-color-action-focus) 2px solid;outline-offset:2px}.toggle .selected-label-wrapper{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toggle ucds-icon{color:var(--ucds-color-action-rest);transition:transform .5s ease}.toggle.error{background-color:var(--ucds-color-feedback-error-background-light);border-color:var(--ucds-color-feedback-error-light)}.toggle:hover{border-color:var(--ucds-color-forms-input-border-hover);cursor:pointer}.toggle.disabled{border-color:var(--ucds-color-forms-input-border-disabled);color:var(--ucds-color-text-disabled);cursor:not-allowed;pointer-events:none}.toggle.disabled ucds-icon{color:var(--ucds-color-forms-input-element-disabled)}.menu{position:absolute;background:var(--ucds-color-forms-input-background-rest);border:var(--ucds-color-forms-input-border-rest) solid var(--ucds-form-element-border-width);border-radius:var(--ucds-form-element-border-radius);display:none;cursor:pointer;list-style:none;margin:0;padding:12px;flex-direction:column;gap:8px;overflow-y:auto;z-index:100;-webkit-overflow-scrolling:touch;scroll-behavior:smooth}:host([open]) .menu{display:flex}:host([open]) ucds-icon{transform:rotateX(180deg)}:host([data-open-direction="up"]) .menu{bottom:calc(100% + 8px)}:host([data-open-direction="down"]) .menu{top:calc(100% + 8px)}';
-var je = Object.defineProperty, ze = Object.getOwnPropertyDescriptor, f = (r, e, t, s) => {
-  for (var i = s > 1 ? void 0 : s ? ze(e, t) : e, o = r.length - 1, n; o >= 0; o--)
-    (n = r[o]) && (i = (s ? n(e, t, i) : n(i)) || i);
-  return s && i && je(e, t, i), i;
+const F = ':host{position:relative;display:block}.dropdown-wrapper{display:flex;flex-direction:column;gap:8px;align-items:start}.dropdown,.menu,.toggle,.dropdown-wrapper{min-width:115px;max-width:var(--ucds-form-element-maxwidth);width:var(--ucds-form-element-width)}.dropdown{position:relative}.toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;height:48px;padding:0 var(--ucds-form-element-horizontal-padding);font-family:var(--ucds-font-family-sans-serif);font-size:var(--ucds-font-base-size);border:var(--ucds-color-forms-input-border-rest) solid var(--ucds-form-element-border-width);border-radius:var(--ucds-form-element-border-radius);background-color:var(--ucds-color-forms-input-background-rest)}.toggle:focus{outline:var(--ucds-color-action-focus) 2px solid;outline-offset:2px}.toggle .selected-label-wrapper{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toggle ucds-icon{color:var(--ucds-color-action-rest);transition:transform .5s ease}.toggle.error{background-color:var(--ucds-color-feedback-error-background-light);border-color:var(--ucds-color-feedback-error-light)}.toggle:hover{border-color:var(--ucds-color-forms-input-border-hover);cursor:pointer}.toggle.disabled{border-color:var(--ucds-color-forms-input-border-disabled);color:var(--ucds-color-text-disabled);cursor:not-allowed;pointer-events:none}.toggle.disabled ucds-icon{color:var(--ucds-color-forms-input-element-disabled)}.menu{position:absolute;background:var(--ucds-color-forms-input-background-rest);border:var(--ucds-color-forms-input-border-rest) solid var(--ucds-form-element-border-width);border-radius:var(--ucds-form-element-border-radius);display:none;cursor:pointer;list-style:none;margin:0;padding:12px;flex-direction:column;gap:8px;overflow-y:auto;z-index:100;-webkit-overflow-scrolling:touch;scroll-behavior:smooth}:host([open]) .menu{display:flex}:host([open]) ucds-icon{transform:rotateX(180deg)}:host([data-open-direction="up"]) .menu{bottom:calc(100% + 8px)}:host([data-open-direction="down"]) .menu{top:calc(100% + 8px)}';
+var G = Object.defineProperty, Q = Object.getOwnPropertyDescriptor, c = (s, e, t, i) => {
+  for (var o = i > 1 ? void 0 : i ? Q(e, t) : e, r = s.length - 1, n; r >= 0; r--)
+    (n = s[r]) && (o = (i ? n(e, t, o) : n(o)) || o);
+  return i && o && G(e, t, o), o;
 };
-let p = class extends N {
+let l = class extends _ {
   // == Constructor ==
   constructor() {
     super(), this.initialValue = "", this.initialLabel = "", this._isOutsideClickListenerAttached = !1, this.scrollHandler = () => this._adjustDropdownDirection(), this.resizeObserver = new ResizeObserver(() => this._adjustDropdownDirection()), this.errorText = "", this.inputId = "", this.label = "", this.name = "", this.selectedLabel = "- Select -", this.disabled = !1, this.error = !1, this.open = !1, this.required = !1, this.activeIndex = -1, this._value = "", this.internals = this.attachInternals();
@@ -636,9 +365,9 @@ let p = class extends N {
     return this._value;
   }
   /** Updates the value, triggers reactivity and form value update. */
-  set value(r) {
+  set value(s) {
     const e = this._value;
-    this._value = r, this.internals.setFormValue(this._value), this.requestUpdate("value", e);
+    this._value = s, this.internals.setFormValue(this._value), this.requestUpdate("value", e);
   }
   // == Lifecycle methods ==
   connectedCallback() {
@@ -648,27 +377,27 @@ let p = class extends N {
     super.disconnectedCallback && super.disconnectedCallback(), this.removeEventListener("keydown", this._handleKeydown), this._removeOutsideClickListener();
   }
   firstUpdated() {
-    const r = this.items.find((e) => e.hasAttribute("selected"));
+    const s = this.items.find((e) => e.hasAttribute("selected"));
     queueMicrotask(() => {
       var e;
-      !this.value && r ? (this.initialValue = r.value, this.initialLabel = (e = r.textContent) == null ? void 0 : e.trim(), this.value = this.initialValue, this.selectedLabel = this.initialLabel, this.activeIndex = this.items.indexOf(r)) : (this.initialValue = "", this.initialLabel = this.selectedLabel), this._syncSelectedItem();
+      !this.value && s ? (this.initialValue = s.value, this.initialLabel = (e = s.textContent) == null ? void 0 : e.trim(), this.value = this.initialValue, this.selectedLabel = this.initialLabel, this.activeIndex = this.items.indexOf(s)) : (this.initialValue = "", this.initialLabel = this.selectedLabel), this._syncSelectedItem();
     });
   }
   // == Event handlers ==
   /** Handles keyboard navigation and interaction. */
-  _handleKeydown(r) {
-    var t, s;
+  _handleKeydown(s) {
+    var t, i;
     const e = (t = this.shadowRoot) == null ? void 0 : t.querySelector(".toggle");
     if (!this.open) {
-      if (["ArrowDown", "ArrowUp", " "].includes(r.key)) {
+      if (["ArrowDown", "ArrowUp", " "].includes(s.key)) {
         this._toggleMenu();
-        const i = this.items.findIndex((o) => o.hasAttribute("selected"));
-        this.activeIndex = i >= 0 ? i : 0, this.updateComplete.then(() => this._focusActiveItem()), r.preventDefault(), r.stopImmediatePropagation();
-      } else if (["ArrowLeft", "ArrowRight"].includes(r.key)) {
-        r.preventDefault(), r.stopImmediatePropagation();
-        const i = this.items.find((a) => a.hasAttribute("selected")), o = i ? this.items.indexOf(i) : -1;
-        let n = o;
-        r.key === "ArrowLeft" ? n = Math.max(o - 1, 0) : r.key === "ArrowRight" && (n = Math.min(o + 1, this.items.length - 1)), n !== this.activeIndex && (this.activeIndex = n, this.value = this.items[this.activeIndex].value, this.selectedLabel = (s = this.items[this.activeIndex].textContent) == null ? void 0 : s.trim(), this._syncSelectedItem(), this.dispatchEvent(new CustomEvent("change", {
+        const o = this.items.findIndex((r) => r.hasAttribute("selected"));
+        this.activeIndex = o >= 0 ? o : 0, this.updateComplete.then(() => this._focusActiveItem()), s.preventDefault(), s.stopImmediatePropagation();
+      } else if (["ArrowLeft", "ArrowRight"].includes(s.key)) {
+        s.preventDefault(), s.stopImmediatePropagation();
+        const o = this.items.find((a) => a.hasAttribute("selected")), r = o ? this.items.indexOf(o) : -1;
+        let n = r;
+        s.key === "ArrowLeft" ? n = Math.max(r - 1, 0) : s.key === "ArrowRight" && (n = Math.min(r + 1, this.items.length - 1)), n !== this.activeIndex && (this.activeIndex = n, this.value = this.items[this.activeIndex].value, this.selectedLabel = (i = this.items[this.activeIndex].textContent) == null ? void 0 : i.trim(), this._syncSelectedItem(), this.dispatchEvent(new CustomEvent("change", {
           detail: { value: this.value, selectedLabel: this.selectedLabel },
           bubbles: !0,
           composed: !0
@@ -676,12 +405,12 @@ let p = class extends N {
       }
       return;
     }
-    switch (r.key) {
+    switch (s.key) {
       case "ArrowDown":
-        r.preventDefault(), this.activeIndex = Math.min(this.activeIndex + 1, this.items.length - 1), this._focusActiveItem();
+        s.preventDefault(), this.activeIndex = Math.min(this.activeIndex + 1, this.items.length - 1), this._focusActiveItem();
         break;
       case "ArrowUp":
-        r.preventDefault(), this.activeIndex = Math.max(this.activeIndex - 1, 0), this._focusActiveItem();
+        s.preventDefault(), this.activeIndex = Math.max(this.activeIndex - 1, 0), this._focusActiveItem();
         break;
       case "Escape":
         this._toggleMenu(), e == null || e.focus();
@@ -689,21 +418,21 @@ let p = class extends N {
     }
   }
   /** Handles selection of an item via custom `dropdown-select` event. */
-  _handleSelection(r) {
-    this.value = r.detail.value, this.selectedLabel = r.detail.selectedLabel, this._syncSelectedItem(), queueMicrotask(() => {
-      var s;
-      const e = this.items.find((i) => i.hasAttribute("selected"));
+  _handleSelection(s) {
+    this.value = s.detail.value, this.selectedLabel = s.detail.selectedLabel, this._syncSelectedItem(), queueMicrotask(() => {
+      var i;
+      const e = this.items.find((o) => o.hasAttribute("selected"));
       this.activeIndex = this.items.indexOf(e), this._toggleMenu();
-      const t = (s = this.shadowRoot) == null ? void 0 : s.querySelector(".toggle");
+      const t = (i = this.shadowRoot) == null ? void 0 : i.querySelector(".toggle");
       t == null || t.focus();
     });
   }
   /** Closes the dropdown when clicking outside. */
-  _handleOutsideClick(r) {
+  _handleOutsideClick(s) {
     var e;
     if (this.open) {
-      const t = r.composedPath(), s = (e = this.shadowRoot) == null ? void 0 : e.querySelector(".menu");
-      (!s || !t.includes(s)) && (this.open = !1, this._removeOutsideClickListener());
+      const t = s.composedPath(), i = (e = this.shadowRoot) == null ? void 0 : e.querySelector(".menu");
+      (!i || !t.includes(i)) && (this.open = !1, this._removeOutsideClickListener());
     }
   }
   // == Form-associated methods ==
@@ -711,14 +440,14 @@ let p = class extends N {
   formResetCallback() {
     var e;
     this.value = this.initialValue;
-    const r = this.items.find((t) => t.value === this.initialValue);
-    r ? (this.selectedLabel = (e = r.textContent) == null ? void 0 : e.trim(), this.activeIndex = this.items.indexOf(r)) : (this.selectedLabel = this.initialLabel, this.activeIndex = -1), this._syncSelectedItem();
+    const s = this.items.find((t) => t.value === this.initialValue);
+    s ? (this.selectedLabel = (e = s.textContent) == null ? void 0 : e.trim(), this.activeIndex = this.items.indexOf(s)) : (this.selectedLabel = this.initialLabel, this.activeIndex = -1), this._syncSelectedItem();
   }
   /** Called when form state is restored. */
-  formStateRestoreCallback(r) {
+  formStateRestoreCallback(s) {
     var t;
-    const e = this.items.find((s) => s.value === r);
-    e ? (this.selectedLabel = (t = e.textContent) == null ? void 0 : t.trim(), this.activeIndex = this.items.indexOf(e), this._syncSelectedItem(), this.value = r) : console.warn("No matching item found during restore");
+    const e = this.items.find((i) => i.value === s);
+    e ? (this.selectedLabel = (t = e.textContent) == null ? void 0 : t.trim(), this.activeIndex = this.items.indexOf(e), this._syncSelectedItem(), this.value = s) : console.warn("No matching item found during restore");
   }
   // == Private methods ==
   /** Opens or closes the dropdown. */
@@ -729,27 +458,27 @@ let p = class extends N {
   }
   /** Marks selected item visually based on value. */
   _syncSelectedItem() {
-    this.items.forEach((r) => {
-      const e = r;
+    this.items.forEach((s) => {
+      const e = s;
       e.selected = e.value === this.value;
     });
   }
   /** Determines if dropdown should open upward or downward based on viewport space. */
   _adjustDropdownDirection() {
     var n, a;
-    const e = ((n = this.shadowRoot) == null ? void 0 : n.querySelector(".dropdown")).getBoundingClientRect(), t = e.top, s = window.innerHeight - e.bottom, i = s >= t ? "down" : "up";
-    this.setAttribute("data-open-direction", i);
-    const o = (a = this.shadowRoot) == null ? void 0 : a.querySelector(".menu");
-    if (o) {
-      const l = i === "down" ? s - 16 : t - 16;
-      o.style.maxHeight = `${l}px`;
+    const e = ((n = this.shadowRoot) == null ? void 0 : n.querySelector(".dropdown")).getBoundingClientRect(), t = e.top, i = window.innerHeight - e.bottom, o = i >= t ? "down" : "up";
+    this.setAttribute("data-open-direction", o);
+    const r = (a = this.shadowRoot) == null ? void 0 : a.querySelector(".menu");
+    if (r) {
+      const d = o === "down" ? i - 16 : t - 16;
+      r.style.maxHeight = `${d}px`;
     }
   }
   /** Focuses the currently active item (for keyboard nav). */
   _focusActiveItem() {
-    var r, e;
+    var s, e;
     if (this.items.length > 0 && this.activeIndex > -1) {
-      const t = (e = (r = this.items[this.activeIndex]) == null ? void 0 : r.shadowRoot) == null ? void 0 : e.querySelector(".dropdown-item");
+      const t = (e = (s = this.items[this.activeIndex]) == null ? void 0 : s.shadowRoot) == null ? void 0 : e.querySelector(".dropdown-item");
       t == null || t.focus();
     }
   }
@@ -759,17 +488,17 @@ let p = class extends N {
   }
   // == Render ==
   render() {
-    const r = {
+    const s = {
       disabled: this.disabled,
       error: this.error
     };
-    return H`
+    return y`
       <div class="dropdown-wrapper">
-        ${this.label ? H`
-          <form-label id="${this.inputId}-label" for="${this.inputId}" text="${this.label}" ?required="${this.required}" ?disabled="${this.disabled}"></form-label>` : L}
+        ${this.label ? y`
+          <form-label id="${this.inputId}-label" for="${this.inputId}" text="${this.label}" ?required="${this.required}" ?disabled="${this.disabled}"></form-label>` : v}
         <div class="dropdown">
-          <div class="toggle ${De(r)}"
-               aria-disabled="${this.disabled ? !0 : L}"
+          <div class="toggle ${M(s)}"
+               aria-disabled="${this.disabled ? !0 : v}"
                role="button"
                tabindex="${this.disabled ? "-1" : "0"}"
                @click="${this._toggleMenu}"
@@ -784,62 +513,62 @@ let p = class extends N {
             <slot></slot>
           </div>
         </div>
-        ${this.error ? H`<form-error-message text="${this.errorText}"></form-error-message>` : L}
+        ${this.error ? y`<form-error-message text="${this.errorText}"></form-error-message>` : v}
       </div>
     `;
   }
 };
-p.styles = [
-  N.styles,
-  oe(Ne)
+l.styles = [
+  _.styles,
+  A(F)
 ];
-p.formAssociated = !0;
-f([
-  m({ type: String, attribute: "error-text" })
-], p.prototype, "errorText", 2);
-f([
-  m({ type: String, attribute: "input-id" })
-], p.prototype, "inputId", 2);
-f([
-  m({ type: String })
-], p.prototype, "label", 2);
-f([
-  m({ type: String, reflect: !0 })
-], p.prototype, "name", 2);
-f([
-  m({ type: String, attribute: "selected-label" })
-], p.prototype, "selectedLabel", 2);
-f([
-  m({ type: Boolean, reflect: !0 })
-], p.prototype, "disabled", 2);
-f([
-  m({ type: Boolean, reflect: !0 })
-], p.prototype, "error", 2);
-f([
-  m({ type: Boolean, reflect: !0 })
-], p.prototype, "open", 2);
-f([
-  m({ type: Boolean, reflect: !0 })
-], p.prototype, "required", 2);
-f([
-  ae()
-], p.prototype, "activeIndex", 2);
-f([
-  ae()
-], p.prototype, "_value", 2);
-f([
-  Ee({ selector: "ucds-dropdown-item" })
-], p.prototype, "items", 2);
-p = f([
-  ne("ucds-dropdown")
-], p);
-const Be = ".dropdown-item{display:flex;gap:4px;align-items:center;padding:10px 6px 10px 26px;border-radius:8px}.dropdown-item ucds-icon{display:none}.dropdown-item .dropdown-item-text{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-item:hover,.dropdown-item:active,.dropdown-item:focus{background-color:var(--ucds-color-palette-berry-900);outline:none}.dropdown-item.selected{padding-left:6px}.dropdown-item.selected ucds-icon{display:inline-flex}";
-var qe = Object.defineProperty, Ve = Object.getOwnPropertyDescriptor, Z = (r, e, t, s) => {
-  for (var i = s > 1 ? void 0 : s ? Ve(e, t) : e, o = r.length - 1, n; o >= 0; o--)
-    (n = r[o]) && (i = (s ? n(e, t, i) : n(i)) || i);
-  return s && i && qe(e, t, i), i;
+l.formAssociated = !0;
+c([
+  h({ type: String, attribute: "error-text" })
+], l.prototype, "errorText", 2);
+c([
+  h({ type: String, attribute: "input-id" })
+], l.prototype, "inputId", 2);
+c([
+  h({ type: String })
+], l.prototype, "label", 2);
+c([
+  h({ type: String, reflect: !0 })
+], l.prototype, "name", 2);
+c([
+  h({ type: String, attribute: "selected-label" })
+], l.prototype, "selectedLabel", 2);
+c([
+  h({ type: Boolean, reflect: !0 })
+], l.prototype, "disabled", 2);
+c([
+  h({ type: Boolean, reflect: !0 })
+], l.prototype, "error", 2);
+c([
+  h({ type: Boolean, reflect: !0 })
+], l.prototype, "open", 2);
+c([
+  h({ type: Boolean, reflect: !0 })
+], l.prototype, "required", 2);
+c([
+  U()
+], l.prototype, "activeIndex", 2);
+c([
+  U()
+], l.prototype, "_value", 2);
+c([
+  X({ selector: "ucds-dropdown-item" })
+], l.prototype, "items", 2);
+l = c([
+  I("ucds-dropdown")
+], l);
+const Y = ".dropdown-item{display:flex;gap:4px;align-items:center;padding:10px 6px 10px 26px;border-radius:8px}.dropdown-item ucds-icon{display:none}.dropdown-item .dropdown-item-text{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-item:hover,.dropdown-item:active,.dropdown-item:focus{background-color:var(--ucds-color-palette-berry-900);outline:none}.dropdown-item.selected{padding-left:6px}.dropdown-item.selected ucds-icon{display:inline-flex}";
+var Z = Object.defineProperty, ee = Object.getOwnPropertyDescriptor, S = (s, e, t, i) => {
+  for (var o = i > 1 ? void 0 : i ? ee(e, t) : e, r = s.length - 1, n; r >= 0; r--)
+    (n = s[r]) && (o = (i ? n(e, t, o) : n(o)) || o);
+  return i && o && Z(e, t, o), o;
 };
-let I = class extends N {
+let m = class extends _ {
   constructor() {
     super(...arguments), this.value = "", this.selected = !1;
   }
@@ -847,22 +576,22 @@ let I = class extends N {
   /** Called when the item is clicked or activated via keyboard. */
   _select() {
     var e;
-    const r = (e = this.textContent) == null ? void 0 : e.trim();
+    const s = (e = this.textContent) == null ? void 0 : e.trim();
     this.selected = !0, this.dispatchEvent(new CustomEvent("dropdown-select", {
-      detail: { value: this.value, selectedLabel: r },
+      detail: { value: this.value, selectedLabel: s },
       bubbles: !0,
       composed: !0
     }));
   }
   /** Handle Enter, Tab, or Esc key to activate the item. */
-  _handleKeydown(r) {
-    (r.key === "Enter" || r.key === "Tab" || r.key === "Esc") && (r.preventDefault(), this._select());
+  _handleKeydown(s) {
+    (s.key === "Enter" || s.key === "Tab" || s.key === "Esc") && (s.preventDefault(), this._select());
   }
   // == Render ==
   render() {
-    return H`
+    return y`
       <div class="dropdown-item ${this.selected ? "selected" : ""}"
-        aria-selected="${this.selected ? !0 : L}"
+        aria-selected="${this.selected ? !0 : v}"
         role="option"
         tabindex="-1"
         @click=${this._select}
@@ -874,20 +603,20 @@ let I = class extends N {
     `;
   }
 };
-I.styles = [
-  N.styles,
-  oe(Be)
+m.styles = [
+  _.styles,
+  A(Y)
 ];
-Z([
-  m({ type: String })
-], I.prototype, "value", 2);
-Z([
-  m({ type: Boolean, reflect: !0 })
-], I.prototype, "selected", 2);
-I = Z([
-  ne("ucds-dropdown-item")
-], I);
+S([
+  h({ type: String })
+], m.prototype, "value", 2);
+S([
+  h({ type: Boolean, reflect: !0 })
+], m.prototype, "selected", 2);
+m = S([
+  I("ucds-dropdown-item")
+], m);
 export {
-  p as Dropdown,
-  I as DropdownItem
+  l as Dropdown,
+  m as DropdownItem
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ucalgary-design-system/dropdown",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "type": "module",
   "main": "index.js",
   "module": "index.js",
@@ -10,10 +10,10 @@
       "require": "./index.js"
     }
   },
-  "dependencies": {
-    "@ucalgary-design-system/core": "^1.0.2",
+  "peerDependencies": {
+    "@ucalgary-design-system/core": "^1.0.3",
     "@ucalgary-design-system/helper-components": "^1.0.2",
-    "@ucalgary-design-system/icon": "^1.0.2",
+    "@ucalgary-design-system/icon": "^1.0.3",
     "@ucalgary-design-system/tokens": "^1.0.3",
     "lit": "^3.2.1"
   },