npm - @duyluonganduin/acl-web-components - Versions diffs - 0.0.30 → 0.0.32 - Mend

@duyluonganduin/acl-web-components 0.0.30 → 0.0.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (11) hide show

package/dist/acl-web-components.cjs +1 -1
package/dist/acl-web-components.d.ts +76 -0
package/dist/acl-web-components.iife.js +213 -175
package/dist/acl-web-components.js +73 -69
package/dist/{anduin-navigation-D6_SYAAm.cjs → anduin-resizable-fZo_ZhUk.cjs} +209 -171
package/dist/{anduin-navigation-DXG5MFAE.js → anduin-resizable-j3OV5vg7.js} +1215 -967
package/dist/jsx.d.ts +22 -0
package/dist/react.cjs +1 -1
package/dist/react.d.ts +84 -0
package/dist/react.js +108 -99
package/package.json +1 -1

package/dist/{anduin-navigation-DXG5MFAE.js → anduin-resizable-j3OV5vg7.js} RENAMED Viewed

@@ -3,18 +3,18 @@
  * Copyright 2019 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const q1 = globalThis, R2 = q1.ShadowRoot && (q1.ShadyCSS === void 0 || q1.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, k2 = Symbol(), $5 = /* @__PURE__ */ new WeakMap();
-let t4 = class {
+const Y1 = globalThis, A2 = Y1.ShadowRoot && (Y1.ShadyCSS === void 0 || Y1.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, B2 = Symbol(), O5 = /* @__PURE__ */ new WeakMap();
+let d4 = class {
   constructor(e, t, i) {
-    if (this._$cssResult$ = !0, i !== k2) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    if (this._$cssResult$ = !0, i !== B2) 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 (R2 && e === void 0) {
+    if (A2 && e === void 0) {
       const i = t !== void 0 && t.length === 1;
-      i && (e = $5.get(t)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), i && $5.set(t, e));
+      i && (e = O5.get(t)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), i && O5.set(t, e));
     }
     return e;
   }
@@ -22,95 +22,95 @@ let t4 = class {
     return this.cssText;
   }
 };
-const Z4 = (l) => new t4(typeof l == "string" ? l : l + "", void 0, k2), g = (l, ...e) => {
-  const t = l.length === 1 ? l[0] : e.reduce((i, o, r) => i + ((n) => {
+const B4 = (r) => new d4(typeof r == "string" ? r : r + "", void 0, B2), g = (r, ...e) => {
+  const t = r.length === 1 ? r[0] : e.reduce((i, o, l) => i + ((n) => {
     if (n._$cssResult$ === !0) return n.cssText;
     if (typeof n == "number") return n;
     throw Error("Value passed to 'css' function must be a 'css' function result: " + n + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
-  })(o) + l[r + 1], l[0]);
-  return new t4(t, l, k2);
-}, _4 = (l, e) => {
-  if (R2) l.adoptedStyleSheets = e.map((t) => t instanceof CSSStyleSheet ? t : t.styleSheet);
+  })(o) + r[l + 1], r[0]);
+  return new d4(t, r, B2);
+}, P4 = (r, e) => {
+  if (A2) r.adoptedStyleSheets = e.map((t) => t instanceof CSSStyleSheet ? t : t.styleSheet);
   else for (const t of e) {
-    const i = document.createElement("style"), o = q1.litNonce;
-    o !== void 0 && i.setAttribute("nonce", o), i.textContent = t.cssText, l.appendChild(i);
+    const i = document.createElement("style"), o = Y1.litNonce;
+    o !== void 0 && i.setAttribute("nonce", o), i.textContent = t.cssText, r.appendChild(i);
   }
-}, E5 = R2 ? (l) => l : (l) => l instanceof CSSStyleSheet ? ((e) => {
+}, D5 = A2 ? (r) => r : (r) => r instanceof CSSStyleSheet ? ((e) => {
   let t = "";
   for (const i of e.cssRules) t += i.cssText;
-  return Z4(t);
-})(l) : l;
+  return B4(t);
+})(r) : r;
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const { is: x4, defineProperty: w4, getOwnPropertyDescriptor: R4, getOwnPropertyNames: k4, getOwnPropertySymbols: $4, getPrototypeOf: E4 } = Object, W = globalThis, A5 = W.trustedTypes, A4 = A5 ? A5.emptyScript : "", l2 = W.reactiveElementPolyfillSupport, M1 = (l, e) => l, G1 = { toAttribute(l, e) {
+const { is: S4, defineProperty: F4, getOwnPropertyDescriptor: O4, getOwnPropertyNames: D4, getOwnPropertySymbols: I4, getPrototypeOf: T4 } = Object, W = globalThis, I5 = W.trustedTypes, N4 = I5 ? I5.emptyScript : "", s2 = W.reactiveElementPolyfillSupport, x1 = (r, e) => r, X1 = { toAttribute(r, e) {
   switch (e) {
     case Boolean:
-      l = l ? A4 : null;
+      r = r ? N4 : null;
       break;
     case Object:
     case Array:
-      l = l == null ? l : JSON.stringify(l);
+      r = r == null ? r : JSON.stringify(r);
   }
-  return l;
-}, fromAttribute(l, e) {
-  let t = l;
+  return r;
+}, fromAttribute(r, e) {
+  let t = r;
   switch (e) {
     case Boolean:
-      t = l !== null;
+      t = r !== null;
       break;
     case Number:
-      t = l === null ? null : Number(l);
+      t = r === null ? null : Number(r);
       break;
     case Object:
     case Array:
       try {
-        t = JSON.parse(l);
+        t = JSON.parse(r);
       } catch {
         t = null;
       }
   }
   return t;
-} }, $2 = (l, e) => !x4(l, e), z5 = { attribute: !0, type: String, converter: G1, reflect: !1, useDefault: !1, hasChanged: $2 };
+} }, P2 = (r, e) => !S4(r, e), T5 = { attribute: !0, type: String, converter: X1, reflect: !1, useDefault: !1, hasChanged: P2 };
 Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), W.litPropertyMetadata ?? (W.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
-let h1 = class extends HTMLElement {
+let g1 = class 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 = z5) {
+  static createProperty(e, t = T5) {
     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 && w4(this.prototype, e, o);
+      o !== void 0 && F4(this.prototype, e, o);
     }
   }
   static getPropertyDescriptor(e, t, i) {
-    const { get: o, set: r } = R4(this.prototype, e) ?? { get() {
+    const { get: o, set: l } = O4(this.prototype, e) ?? { get() {
       return this[t];
     }, set(n) {
       this[t] = n;
     } };
     return { get: o, set(n) {
       const s = o == null ? void 0 : o.call(this);
-      r == null || r.call(this, n), this.requestUpdate(e, s, i);
+      l == null || l.call(this, n), this.requestUpdate(e, s, i);
     }, configurable: !0, enumerable: !0 };
   }
   static getPropertyOptions(e) {
-    return this.elementProperties.get(e) ?? z5;
+    return this.elementProperties.get(e) ?? T5;
   }
   static _$Ei() {
-    if (this.hasOwnProperty(M1("elementProperties"))) return;
-    const e = E4(this);
+    if (this.hasOwnProperty(x1("elementProperties"))) return;
+    const e = T4(this);
     e.finalize(), e.l !== void 0 && (this.l = [...e.l]), this.elementProperties = new Map(e.elementProperties);
   }
   static finalize() {
-    if (this.hasOwnProperty(M1("finalized"))) return;
-    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(M1("properties"))) {
-      const t = this.properties, i = [...k4(t), ...$4(t)];
+    if (this.hasOwnProperty(x1("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(x1("properties"))) {
+      const t = this.properties, i = [...D4(t), ...I4(t)];
       for (const o of i) this.createProperty(o, t[o]);
     }
     const e = this[Symbol.metadata];
@@ -129,8 +129,8 @@ let h1 = class extends HTMLElement {
     const t = [];
     if (Array.isArray(e)) {
       const i = new Set(e.flat(1 / 0).reverse());
-      for (const o of i) t.unshift(E5(o));
-    } else e !== void 0 && t.push(E5(e));
+      for (const o of i) t.unshift(D5(o));
+    } else e !== void 0 && t.push(D5(e));
     return t;
   }
   static _$Eu(e, t) {
@@ -159,7 +159,7 @@ let h1 = class extends HTMLElement {
   }
   createRenderRoot() {
     const e = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
-    return _4(e, this.constructor.elementStyles), e;
+    return P4(e, this.constructor.elementStyles), e;
   }
   connectedCallback() {
     var e;
@@ -181,34 +181,34 @@ let h1 = class extends HTMLElement {
     this._$AK(e, i);
   }
   _$ET(e, t) {
-    var r;
+    var l;
     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 : G1).toAttribute(t, i.type);
+      const n = (((l = i.converter) == null ? void 0 : l.toAttribute) !== void 0 ? i.converter : X1).toAttribute(t, i.type);
       this._$Em = e, n == null ? this.removeAttribute(o) : this.setAttribute(o, n), this._$Em = null;
     }
   }
   _$AK(e, t) {
-    var r, n;
+    var l, n;
     const i = this.constructor, o = i._$Eh.get(e);
     if (o !== void 0 && this._$Em !== o) {
-      const s = i.getPropertyOptions(o), d = typeof s.converter == "function" ? { fromAttribute: s.converter } : ((r = s.converter) == null ? void 0 : r.fromAttribute) !== void 0 ? s.converter : G1;
+      const s = i.getPropertyOptions(o), d = typeof s.converter == "function" ? { fromAttribute: s.converter } : ((l = s.converter) == null ? void 0 : l.fromAttribute) !== void 0 ? s.converter : X1;
       this._$Em = o;
       const p = d.fromAttribute(t, s.type);
       this[o] = p ?? ((n = this._$Ej) == null ? void 0 : n.get(o)) ?? p, this._$Em = null;
     }
   }
-  requestUpdate(e, t, i, o = !1, r) {
+  requestUpdate(e, t, i, o = !1, l) {
     var n;
     if (e !== void 0) {
       const s = this.constructor;
-      if (o === !1 && (r = this[e]), i ?? (i = s.getPropertyOptions(e)), !((i.hasChanged ?? $2)(r, t) || i.useDefault && i.reflect && r === ((n = this._$Ej) == null ? void 0 : n.get(e)) && !this.hasAttribute(s._$Eu(e, i)))) return;
+      if (o === !1 && (l = this[e]), i ?? (i = s.getPropertyOptions(e)), !((i.hasChanged ?? P2)(l, t) || i.useDefault && i.reflect && l === ((n = this._$Ej) == null ? void 0 : n.get(e)) && !this.hasAttribute(s._$Eu(e, i)))) return;
       this.C(e, t, i);
     }
     this.isUpdatePending === !1 && (this._$ES = this._$EP());
   }
-  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));
+  C(e, t, { useDefault: i, reflect: o, wrapped: l }, n) {
+    i && !(this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Map())).has(e) && (this._$Ej.set(e, n ?? t ?? this[e]), l !== !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 _$EP() {
     this.isUpdatePending = !0;
@@ -228,21 +228,21 @@ let h1 = class extends HTMLElement {
     if (!this.isUpdatePending) return;
     if (!this.hasUpdated) {
       if (this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this._$Ep) {
-        for (const [r, n] of this._$Ep) this[r] = n;
+        for (const [l, n] of this._$Ep) this[l] = n;
         this._$Ep = void 0;
       }
       const o = this.constructor.elementProperties;
-      if (o.size > 0) for (const [r, n] of o) {
-        const { wrapped: s } = n, d = this[r];
-        s !== !0 || this._$AL.has(r) || d === void 0 || this.C(r, void 0, n, d);
+      if (o.size > 0) for (const [l, n] of o) {
+        const { wrapped: s } = n, d = this[l];
+        s !== !0 || this._$AL.has(l) || d === void 0 || this.C(l, void 0, n, d);
       }
     }
     let e = !1;
     const t = this._$AL;
     try {
       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);
+        var l;
+        return (l = o.hostUpdate) == null ? void 0 : l.call(o);
       }), this.update(t)) : this._$EM();
     } catch (o) {
       throw e = !1, this._$EM(), o;
@@ -278,61 +278,61 @@ let h1 = class extends HTMLElement {
   firstUpdated(e) {
   }
 };
-h1.elementStyles = [], h1.shadowRootOptions = { mode: "open" }, h1[M1("elementProperties")] = /* @__PURE__ */ new Map(), h1[M1("finalized")] = /* @__PURE__ */ new Map(), l2 == null || l2({ ReactiveElement: h1 }), (W.reactiveElementVersions ?? (W.reactiveElementVersions = [])).push("2.1.2");
+g1.elementStyles = [], g1.shadowRootOptions = { mode: "open" }, g1[x1("elementProperties")] = /* @__PURE__ */ new Map(), g1[x1("finalized")] = /* @__PURE__ */ new Map(), s2 == null || s2({ ReactiveElement: g1 }), (W.reactiveElementVersions ?? (W.reactiveElementVersions = [])).push("2.1.2");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const Z1 = globalThis, B5 = (l) => l, W1 = Z1.trustedTypes, S5 = W1 ? W1.createPolicy("lit-html", { createHTML: (l) => l }) : void 0, o4 = "$lit$", G = `lit$${Math.random().toFixed(9).slice(2)}$`, i4 = "?" + G, z4 = `<${i4}>`, n1 = document, _1 = () => n1.createComment(""), x1 = (l) => l === null || typeof l != "object" && typeof l != "function", E2 = Array.isArray, B4 = (l) => E2(l) || typeof (l == null ? void 0 : l[Symbol.iterator]) == "function", r2 = `[
-\f\r]`, b1 = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, P5 = /-->/g, F5 = />/g, i1 = RegExp(`>|${r2}(?:([^\\s"'>=/]+)(${r2}*=${r2}*(?:[^
-\f\r"'\`<>=]|("|')|))|$)`, "g"), O5 = /'/g, D5 = /"/g, l4 = /^(?:script|style|textarea|title)$/i, r4 = (l) => (e, ...t) => ({ _$litType$: l, strings: e, values: t }), C = r4(1), Y1 = r4(2), a1 = Symbol.for("lit-noChange"), c = Symbol.for("lit-nothing"), I5 = /* @__PURE__ */ new WeakMap(), l1 = n1.createTreeWalker(n1, 129);
-function n4(l, e) {
-  if (!E2(l) || !l.hasOwnProperty("raw")) throw Error("invalid template strings array");
-  return S5 !== void 0 ? S5.createHTML(e) : e;
+const w1 = globalThis, N5 = (r) => r, K1 = w1.trustedTypes, j5 = K1 ? K1.createPolicy("lit-html", { createHTML: (r) => r }) : void 0, c4 = "$lit$", q = `lit$${Math.random().toFixed(9).slice(2)}$`, p4 = "?" + q, j4 = `<${p4}>`, n1 = document, R1 = () => n1.createComment(""), k1 = (r) => r === null || typeof r != "object" && typeof r != "function", S2 = Array.isArray, U4 = (r) => S2(r) || typeof (r == null ? void 0 : r[Symbol.iterator]) == "function", C2 = `[
+\f\r]`, Z1 = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, U5 = /-->/g, G5 = />/g, i1 = RegExp(`>|${C2}(?:([^\\s"'>=/]+)(${C2}*=${C2}*(?:[^
+\f\r"'\`<>=]|("|')|))|$)`, "g"), q5 = /'/g, W5 = /"/g, u4 = /^(?:script|style|textarea|title)$/i, h4 = (r) => (e, ...t) => ({ _$litType$: r, strings: e, values: t }), C = h4(1), J1 = h4(2), a1 = Symbol.for("lit-noChange"), c = Symbol.for("lit-nothing"), Y5 = /* @__PURE__ */ new WeakMap(), l1 = n1.createTreeWalker(n1, 129);
+function g4(r, e) {
+  if (!S2(r) || !r.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return j5 !== void 0 ? j5.createHTML(e) : e;
 }
-const S4 = (l, e) => {
-  const t = l.length - 1, i = [];
-  let o, r = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", n = b1;
+const G4 = (r, e) => {
+  const t = r.length - 1, i = [];
+  let o, l = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", n = Z1;
   for (let s = 0; s < t; s++) {
-    const d = l[s];
+    const d = r[s];
     let p, h, v = -1, H = 0;
-    for (; H < d.length && (n.lastIndex = H, h = n.exec(d), h !== null); ) H = n.lastIndex, n === b1 ? h[1] === "!--" ? n = P5 : h[1] !== void 0 ? n = F5 : h[2] !== void 0 ? (l4.test(h[2]) && (o = RegExp("</" + h[2], "g")), n = i1) : h[3] !== void 0 && (n = i1) : n === i1 ? h[0] === ">" ? (n = o ?? b1, v = -1) : h[1] === void 0 ? v = -2 : (v = n.lastIndex - h[2].length, p = h[1], n = h[3] === void 0 ? i1 : h[3] === '"' ? D5 : O5) : n === D5 || n === O5 ? n = i1 : n === P5 || n === F5 ? n = b1 : (n = i1, o = void 0);
-    const f = n === i1 && l[s + 1].startsWith("/>") ? " " : "";
-    r += n === b1 ? d + z4 : v >= 0 ? (i.push(p), d.slice(0, v) + o4 + d.slice(v) + G + f) : d + G + (v === -2 ? s : f);
+    for (; H < d.length && (n.lastIndex = H, h = n.exec(d), h !== null); ) H = n.lastIndex, n === Z1 ? h[1] === "!--" ? n = U5 : h[1] !== void 0 ? n = G5 : h[2] !== void 0 ? (u4.test(h[2]) && (o = RegExp("</" + h[2], "g")), n = i1) : h[3] !== void 0 && (n = i1) : n === i1 ? h[0] === ">" ? (n = o ?? Z1, v = -1) : h[1] === void 0 ? v = -2 : (v = n.lastIndex - h[2].length, p = h[1], n = h[3] === void 0 ? i1 : h[3] === '"' ? W5 : q5) : n === W5 || n === q5 ? n = i1 : n === U5 || n === G5 ? n = Z1 : (n = i1, o = void 0);
+    const f = n === i1 && r[s + 1].startsWith("/>") ? " " : "";
+    l += n === Z1 ? d + j4 : v >= 0 ? (i.push(p), d.slice(0, v) + c4 + d.slice(v) + q + f) : d + q + (v === -2 ? s : f);
   }
-  return [n4(l, r + (l[t] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), i];
+  return [g4(r, l + (r[t] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), i];
 };
-class w1 {
+class $1 {
   constructor({ strings: e, _$litType$: t }, i) {
     let o;
     this.parts = [];
-    let r = 0, n = 0;
-    const s = e.length - 1, d = this.parts, [p, h] = S4(e, t);
-    if (this.el = w1.createElement(p, i), l1.currentNode = this.el.content, t === 2 || t === 3) {
+    let l = 0, n = 0;
+    const s = e.length - 1, d = this.parts, [p, h] = G4(e, t);
+    if (this.el = $1.createElement(p, i), l1.currentNode = this.el.content, t === 2 || t === 3) {
       const v = this.el.content.firstChild;
       v.replaceWith(...v.childNodes);
     }
     for (; (o = l1.nextNode()) !== null && d.length < s; ) {
       if (o.nodeType === 1) {
-        if (o.hasAttributes()) for (const v of o.getAttributeNames()) if (v.endsWith(o4)) {
-          const H = h[n++], f = o.getAttribute(v).split(G), Z = /([.?@])?(.*)/.exec(H);
-          d.push({ type: 1, index: r, name: Z[2], strings: f, ctor: Z[1] === "." ? F4 : Z[1] === "?" ? O4 : Z[1] === "@" ? D4 : o2 }), o.removeAttribute(v);
-        } else v.startsWith(G) && (d.push({ type: 6, index: r }), o.removeAttribute(v));
-        if (l4.test(o.tagName)) {
-          const v = o.textContent.split(G), H = v.length - 1;
+        if (o.hasAttributes()) for (const v of o.getAttributeNames()) if (v.endsWith(c4)) {
+          const H = h[n++], f = o.getAttribute(v).split(q), Z = /([.?@])?(.*)/.exec(H);
+          d.push({ type: 1, index: l, name: Z[2], strings: f, ctor: Z[1] === "." ? W4 : Z[1] === "?" ? Y4 : Z[1] === "@" ? X4 : n2 }), o.removeAttribute(v);
+        } else v.startsWith(q) && (d.push({ type: 6, index: l }), o.removeAttribute(v));
+        if (u4.test(o.tagName)) {
+          const v = o.textContent.split(q), H = v.length - 1;
           if (H > 0) {
-            o.textContent = W1 ? W1.emptyScript : "";
-            for (let f = 0; f < H; f++) o.append(v[f], _1()), l1.nextNode(), d.push({ type: 2, index: ++r });
-            o.append(v[H], _1());
+            o.textContent = K1 ? K1.emptyScript : "";
+            for (let f = 0; f < H; f++) o.append(v[f], R1()), l1.nextNode(), d.push({ type: 2, index: ++l });
+            o.append(v[H], R1());
           }
         }
-      } else if (o.nodeType === 8) if (o.data === i4) d.push({ type: 2, index: r });
+      } else if (o.nodeType === 8) if (o.data === p4) d.push({ type: 2, index: l });
       else {
         let v = -1;
-        for (; (v = o.data.indexOf(G, v + 1)) !== -1; ) d.push({ type: 7, index: r }), v += G.length - 1;
+        for (; (v = o.data.indexOf(q, v + 1)) !== -1; ) d.push({ type: 7, index: l }), v += q.length - 1;
       }
-      r++;
+      l++;
     }
   }
   static createElement(e, t) {
@@ -340,14 +340,14 @@ class w1 {
     return i.innerHTML = e, i;
   }
 }
-function g1(l, e, t = l, i) {
+function v1(r, e, t = r, i) {
   var n, s;
   if (e === a1) return e;
   let o = i !== void 0 ? (n = t._$Co) == null ? void 0 : n[i] : t._$Cl;
-  const r = x1(e) ? void 0 : e._$litDirective$;
-  return (o == null ? void 0 : o.constructor) !== r && ((s = o == null ? void 0 : o._$AO) == null || s.call(o, !1), r === void 0 ? o = void 0 : (o = new r(l), o._$AT(l, t, i)), i !== void 0 ? (t._$Co ?? (t._$Co = []))[i] = o : t._$Cl = o), o !== void 0 && (e = g1(l, o._$AS(l, e.values), o, i)), e;
+  const l = k1(e) ? void 0 : e._$litDirective$;
+  return (o == null ? void 0 : o.constructor) !== l && ((s = o == null ? void 0 : o._$AO) == null || s.call(o, !1), l === void 0 ? o = void 0 : (o = new l(r), o._$AT(r, t, i)), i !== void 0 ? (t._$Co ?? (t._$Co = []))[i] = o : t._$Cl = o), o !== void 0 && (e = v1(r, o._$AS(r, e.values), o, i)), e;
 }
-class P4 {
+class q4 {
   constructor(e, t) {
     this._$AV = [], this._$AN = void 0, this._$AD = e, this._$AM = t;
   }
@@ -360,13 +360,13 @@ class P4 {
   u(e) {
     const { el: { content: t }, parts: i } = this._$AD, o = ((e == null ? void 0 : e.creationScope) ?? n1).importNode(t, !0);
     l1.currentNode = o;
-    let r = l1.nextNode(), n = 0, s = 0, d = i[0];
+    let l = l1.nextNode(), n = 0, s = 0, d = i[0];
     for (; d !== void 0; ) {
       if (n === d.index) {
         let p;
-        d.type === 2 ? p = new T1(r, r.nextSibling, this, e) : d.type === 1 ? p = new d.ctor(r, d.name, d.strings, this, e) : d.type === 6 && (p = new I4(r, this, e)), this._$AV.push(p), d = i[++s];
+        d.type === 2 ? p = new U1(l, l.nextSibling, this, e) : d.type === 1 ? p = new d.ctor(l, d.name, d.strings, this, e) : d.type === 6 && (p = new K4(l, this, e)), this._$AV.push(p), d = i[++s];
       }
-      n !== (d == null ? void 0 : d.index) && (r = l1.nextNode(), n++);
+      n !== (d == null ? void 0 : d.index) && (l = l1.nextNode(), n++);
     }
     return l1.currentNode = n1, o;
   }
@@ -375,7 +375,7 @@ class P4 {
     for (const i of this._$AV) i !== void 0 && (i.strings !== void 0 ? (i._$AI(e, i, t), t += i.strings.length - 2) : i._$AI(e[t])), t++;
   }
 }
-class T1 {
+class U1 {
   get _$AU() {
     var e;
     return ((e = this._$AM) == null ? void 0 : e._$AU) ?? this._$Cv;
@@ -395,7 +395,7 @@ class T1 {
     return this._$AB;
   }
   _$AI(e, t = this) {
-    e = g1(this, e, t), x1(e) ? e === c || e == null || e === "" ? (this._$AH !== c && this._$AR(), this._$AH = c) : e !== this._$AH && e !== a1 && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : B4(e) ? this.k(e) : this._(e);
+    e = v1(this, e, t), k1(e) ? e === c || e == null || e === "" ? (this._$AH !== c && this._$AR(), this._$AH = c) : e !== this._$AH && e !== a1 && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : U4(e) ? this.k(e) : this._(e);
   }
   O(e) {
     return this._$AA.parentNode.insertBefore(e, this._$AB);
@@ -404,33 +404,33 @@ class T1 {
     this._$AH !== e && (this._$AR(), this._$AH = this.O(e));
   }
   _(e) {
-    this._$AH !== c && x1(this._$AH) ? this._$AA.nextSibling.data = e : this.T(n1.createTextNode(e)), this._$AH = e;
+    this._$AH !== c && k1(this._$AH) ? this._$AA.nextSibling.data = e : this.T(n1.createTextNode(e)), this._$AH = e;
   }
   $(e) {
-    var r;
-    const { values: t, _$litType$: i } = e, o = typeof i == "number" ? this._$AC(e) : (i.el === void 0 && (i.el = w1.createElement(n4(i.h, i.h[0]), this.options)), i);
-    if (((r = this._$AH) == null ? void 0 : r._$AD) === o) this._$AH.p(t);
+    var l;
+    const { values: t, _$litType$: i } = e, o = typeof i == "number" ? this._$AC(e) : (i.el === void 0 && (i.el = $1.createElement(g4(i.h, i.h[0]), this.options)), i);
+    if (((l = this._$AH) == null ? void 0 : l._$AD) === o) this._$AH.p(t);
     else {
-      const n = new P4(o, this), s = n.u(this.options);
+      const n = new q4(o, this), s = n.u(this.options);
       n.p(t), this.T(s), this._$AH = n;
     }
   }
   _$AC(e) {
-    let t = I5.get(e.strings);
-    return t === void 0 && I5.set(e.strings, t = new w1(e)), t;
+    let t = Y5.get(e.strings);
+    return t === void 0 && Y5.set(e.strings, t = new $1(e)), t;
   }
   k(e) {
-    E2(this._$AH) || (this._$AH = [], this._$AR());
+    S2(this._$AH) || (this._$AH = [], this._$AR());
     const t = this._$AH;
     let i, o = 0;
-    for (const r of e) o === t.length ? t.push(i = new T1(this.O(_1()), this.O(_1()), this, this.options)) : i = t[o], i._$AI(r), o++;
+    for (const l of e) o === t.length ? t.push(i = new U1(this.O(R1()), this.O(R1()), this, this.options)) : i = t[o], i._$AI(l), o++;
     o < t.length && (this._$AR(i && i._$AB.nextSibling, o), t.length = o);
   }
   _$AR(e = this._$AA.nextSibling, t) {
     var i;
     for ((i = this._$AP) == null ? void 0 : i.call(this, !1, !0, t); e !== this._$AB; ) {
-      const o = B5(e).nextSibling;
-      B5(e).remove(), e = o;
+      const o = N5(e).nextSibling;
+      N5(e).remove(), e = o;
     }
   }
   setConnected(e) {
@@ -438,24 +438,24 @@ class T1 {
     this._$AM === void 0 && (this._$Cv = e, (t = this._$AP) == null || t.call(this, e));
   }
 }
-class o2 {
+class n2 {
   get tagName() {
     return this.element.tagName;
   }
   get _$AU() {
     return this._$AM._$AU;
   }
-  constructor(e, t, i, o, r) {
-    this.type = 1, this._$AH = c, this._$AN = void 0, this.element = e, this.name = t, this._$AM = o, this.options = r, i.length > 2 || i[0] !== "" || i[1] !== "" ? (this._$AH = Array(i.length - 1).fill(new String()), this.strings = i) : this._$AH = c;
+  constructor(e, t, i, o, l) {
+    this.type = 1, this._$AH = c, this._$AN = void 0, this.element = e, this.name = t, this._$AM = o, this.options = l, i.length > 2 || i[0] !== "" || i[1] !== "" ? (this._$AH = Array(i.length - 1).fill(new String()), this.strings = i) : this._$AH = c;
   }
   _$AI(e, t = this, i, o) {
-    const r = this.strings;
+    const l = this.strings;
     let n = !1;
-    if (r === void 0) e = g1(this, e, t, 0), n = !x1(e) || e !== this._$AH && e !== a1, n && (this._$AH = e);
+    if (l === void 0) e = v1(this, e, t, 0), n = !k1(e) || e !== this._$AH && e !== a1, n && (this._$AH = e);
     else {
       const s = e;
       let d, p;
-      for (e = r[0], d = 0; d < r.length - 1; d++) p = g1(this, s[i + d], t, d), p === a1 && (p = this._$AH[d]), n || (n = !x1(p) || p !== this._$AH[d]), p === c ? e = c : e !== c && (e += (p ?? "") + r[d + 1]), this._$AH[d] = p;
+      for (e = l[0], d = 0; d < l.length - 1; d++) p = v1(this, s[i + d], t, d), p === a1 && (p = this._$AH[d]), n || (n = !k1(p) || p !== this._$AH[d]), p === c ? e = c : e !== c && (e += (p ?? "") + l[d + 1]), this._$AH[d] = p;
     }
     n && !o && this.j(e);
   }
@@ -463,7 +463,7 @@ class o2 {
     e === c ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, e ?? "");
   }
 }
-class F4 extends o2 {
+class W4 extends n2 {
   constructor() {
     super(...arguments), this.type = 3;
   }
@@ -471,7 +471,7 @@ class F4 extends o2 {
     this.element[this.name] = e === c ? void 0 : e;
   }
 }
-class O4 extends o2 {
+class Y4 extends n2 {
   constructor() {
     super(...arguments), this.type = 4;
   }
@@ -479,21 +479,21 @@ class O4 extends o2 {
     this.element.toggleAttribute(this.name, !!e && e !== c);
   }
 }
-class D4 extends o2 {
-  constructor(e, t, i, o, r) {
-    super(e, t, i, o, r), this.type = 5;
+class X4 extends n2 {
+  constructor(e, t, i, o, l) {
+    super(e, t, i, o, l), this.type = 5;
   }
   _$AI(e, t = this) {
-    if ((e = g1(this, e, t, 0) ?? c) === a1) return;
-    const i = this._$AH, o = e === c && i !== c || e.capture !== i.capture || e.once !== i.once || e.passive !== i.passive, r = e !== c && (i === c || o);
-    o && this.element.removeEventListener(this.name, this, i), r && this.element.addEventListener(this.name, this, e), this._$AH = e;
+    if ((e = v1(this, e, t, 0) ?? c) === a1) return;
+    const i = this._$AH, o = e === c && i !== c || e.capture !== i.capture || e.once !== i.once || e.passive !== i.passive, l = e !== c && (i === c || o);
+    o && this.element.removeEventListener(this.name, this, i), l && 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 I4 {
+class K4 {
   constructor(e, t, i) {
     this.element = e, this.type = 6, this._$AN = void 0, this._$AM = t, this.options = i;
   }
@@ -501,19 +501,19 @@ class I4 {
     return this._$AM._$AU;
   }
   _$AI(e) {
-    g1(this, e);
+    v1(this, e);
   }
 }
-const n2 = Z1.litHtmlPolyfillSupport;
-n2 == null || n2(w1, T1), (Z1.litHtmlVersions ?? (Z1.litHtmlVersions = [])).push("3.3.2");
-const T4 = (l, e, t) => {
+const d2 = w1.litHtmlPolyfillSupport;
+d2 == null || d2($1, U1), (w1.litHtmlVersions ?? (w1.litHtmlVersions = [])).push("3.3.2");
+const J4 = (r, e, t) => {
   const i = (t == null ? void 0 : t.renderBefore) ?? e;
   let o = i._$litPart$;
   if (o === void 0) {
-    const r = (t == null ? void 0 : t.renderBefore) ?? null;
-    i._$litPart$ = o = new T1(e.insertBefore(_1(), r), r, void 0, t ?? {});
+    const l = (t == null ? void 0 : t.renderBefore) ?? null;
+    i._$litPart$ = o = new U1(e.insertBefore(R1(), l), l, void 0, t ?? {});
   }
-  return o._$AI(l), o;
+  return o._$AI(r), o;
 };
 /**
  * @license
@@ -521,7 +521,7 @@ const T4 = (l, e, t) => {
  * SPDX-License-Identifier: BSD-3-Clause
  */
 const r1 = globalThis;
-let u = class extends h1 {
+let u = class extends g1 {
   constructor() {
     super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
   }
@@ -532,7 +532,7 @@ let u = class extends h1 {
   }
   update(e) {
     const t = this.render();
-    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(e), this._$Do = T4(t, this.renderRoot, this.renderOptions);
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(e), this._$Do = J4(t, this.renderRoot, this.renderOptions);
   }
   connectedCallback() {
     var e;
@@ -546,79 +546,79 @@ let u = class extends h1 {
     return a1;
   }
 };
-var e4;
-u._$litElement$ = !0, u.finalized = !0, (e4 = r1.litElementHydrateSupport) == null || e4.call(r1, { LitElement: u });
-const a2 = r1.litElementPolyfillSupport;
-a2 == null || a2({ LitElement: u });
+var C4;
+u._$litElement$ = !0, u.finalized = !0, (C4 = r1.litElementHydrateSupport) == null || C4.call(r1, { LitElement: u });
+const c2 = r1.litElementPolyfillSupport;
+c2 == null || c2({ LitElement: u });
 (r1.litElementVersions ?? (r1.litElementVersions = [])).push("4.2.2");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const N4 = { attribute: !0, type: String, converter: G1, reflect: !1, hasChanged: $2 }, j4 = (l = N4, e, t) => {
+const Q4 = { attribute: !0, type: String, converter: X1, reflect: !1, hasChanged: P2 }, e3 = (r = Q4, 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" && ((l = Object.create(l)).wrapped = !0), r.set(t.name, l), i === "accessor") {
+  let l = globalThis.litPropertyMetadata.get(o);
+  if (l === void 0 && globalThis.litPropertyMetadata.set(o, l = /* @__PURE__ */ new Map()), i === "setter" && ((r = Object.create(r)).wrapped = !0), l.set(t.name, r), i === "accessor") {
     const { name: n } = t;
     return { set(s) {
       const d = e.get.call(this);
-      e.set.call(this, s), this.requestUpdate(n, d, l, !0, s);
+      e.set.call(this, s), this.requestUpdate(n, d, r, !0, s);
     }, init(s) {
-      return s !== void 0 && this.C(n, void 0, l, s), s;
+      return s !== void 0 && this.C(n, void 0, r, s), s;
     } };
   }
   if (i === "setter") {
     const { name: n } = t;
     return function(s) {
       const d = this[n];
-      e.call(this, s), this.requestUpdate(n, d, l, !0, s);
+      e.call(this, s), this.requestUpdate(n, d, r, !0, s);
     };
   }
   throw Error("Unsupported decorator location: " + i);
 };
-function a(l) {
-  return (e, t) => typeof t == "object" ? j4(l, e, t) : ((i, o, r) => {
-    const n = o.hasOwnProperty(r);
-    return o.constructor.createProperty(r, i), n ? Object.getOwnPropertyDescriptor(o, r) : void 0;
-  })(l, e, t);
+function a(r) {
+  return (e, t) => typeof t == "object" ? e3(r, e, t) : ((i, o, l) => {
+    const n = o.hasOwnProperty(l);
+    return o.constructor.createProperty(l, i), n ? Object.getOwnPropertyDescriptor(o, l) : void 0;
+  })(r, e, t);
 }
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-function b(l) {
-  return a({ ...l, state: !0, attribute: !1 });
+function m(r) {
+  return a({ ...r, state: !0, attribute: !1 });
 }
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const U4 = (l, e, t) => (t.configurable = !0, t.enumerable = !0, Reflect.decorate && typeof e != "object" && Object.defineProperty(l, e, t), t);
+const t3 = (r, e, t) => (t.configurable = !0, t.enumerable = !0, Reflect.decorate && typeof e != "object" && Object.defineProperty(r, e, t), t);
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-function k(l, e) {
+function k(r, e) {
   return (t, i, o) => {
-    const r = (n) => {
+    const l = (n) => {
       var s;
-      return ((s = n.renderRoot) == null ? void 0 : s.querySelector(l)) ?? null;
+      return ((s = n.renderRoot) == null ? void 0 : s.querySelector(r)) ?? null;
     };
-    return U4(t, i, { get() {
-      return r(this);
+    return t3(t, i, { get() {
+      return l(this);
     } });
   };
 }
-var q4 = Object.defineProperty, a4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && q4(e, t, o), o;
+var o3 = Object.defineProperty, v4 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && o3(e, t, o), o;
 };
-const S2 = class S2 extends u {
+const I2 = class I2 extends u {
   constructor() {
     super(...arguments), this.size = "medium", this.percent = "";
   }
@@ -640,14 +640,14 @@ const S2 = class S2 extends u {
     const [e, t] = this.getSizeParams(this.size), i = this.percent === "" || this.percent === null;
     let o;
     i ? o = 0.75 * Math.PI * e : o = (1 - Math.max(0, Math.min(1, parseFloat(this.percent) || 0))) * Math.PI * e;
-    const r = t / 2, n = t + e, s = e / 2, d = Math.PI * e;
-    return Y1`
+    const l = t / 2, n = t + e, s = e / 2, d = Math.PI * e;
+    return J1`
       <svg
         class=${i ? "spinner" : ""}
         width="${e}px"
         height="${e}px"
         transform="rotate(-90)"
-        viewBox="-${r} -${r} ${n} ${n}"
+        viewBox="-${l} -${l} ${n} ${n}"
         xmlns="http://www.w3.org/2000/svg"
       >
         <circle
@@ -675,31 +675,31 @@ const S2 = class S2 extends u {
     `;
   }
 };
-S2.styles = g`
+I2.styles = g`
     :host { display: inline-block; line-height: 0; font-family: var(--font-sans); }
     .spinner { animation: circle 0.6s linear infinite; }
     @keyframes circle { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
   `;
-let R1 = S2;
-a4([
+let E1 = I2;
+v4([
   a()
-], R1.prototype, "size");
-a4([
+], E1.prototype, "size");
+v4([
   a()
-], R1.prototype, "percent");
-customElements.get("anduin-spinner") || customElements.define("anduin-spinner", R1);
-var G4 = Object.defineProperty, s4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && G4(e, t, o), o;
+], E1.prototype, "percent");
+customElements.get("anduin-spinner") || customElements.define("anduin-spinner", E1);
+var i3 = Object.defineProperty, f4 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && i3(e, t, o), o;
 };
-const T5 = "M7.23359 3.5336C7.49685 2.82213 8.50314 2.82213 8.76641 3.5336L9.63534 5.88184C9.71811 6.10553 9.89447 6.28189 10.1182 6.36466L12.4664 7.23359C13.1779 7.49685 13.1779 8.50314 12.4664 8.76641L10.1182 9.63534C9.89447 9.71811 9.71811 9.89447 9.63534 10.1182L8.76641 12.4664C8.50314 13.1779 7.49685 13.1779 7.23359 12.4664L6.36466 10.1182C6.28189 9.89447 6.10553 9.71811 5.88185 9.63534L3.5336 8.76641C2.82213 8.50314 2.82213 7.49685 3.5336 7.23359L5.88184 6.36466C6.10553 6.28189 6.28189 6.10553 6.36466 5.88185L7.23359 3.5336Z", W4 = { small: 16, medium: 24, large: 32 }, P2 = class P2 extends u {
+const X5 = "M7.23359 3.5336C7.49685 2.82213 8.50314 2.82213 8.76641 3.5336L9.63534 5.88184C9.71811 6.10553 9.89447 6.28189 10.1182 6.36466L12.4664 7.23359C13.1779 7.49685 13.1779 8.50314 12.4664 8.76641L10.1182 9.63534C9.89447 9.71811 9.71811 9.89447 9.63534 10.1182L8.76641 12.4664C8.50314 13.1779 7.49685 13.1779 7.23359 12.4664L6.36466 10.1182C6.28189 9.89447 6.10553 9.71811 5.88185 9.63534L3.5336 8.76641C2.82213 8.50314 2.82213 7.49685 3.5336 7.23359L5.88184 6.36466C6.10553 6.28189 6.28189 6.10553 6.36466 5.88185L7.23359 3.5336Z", l3 = { small: 16, medium: 24, large: 32 }, T2 = class T2 extends u {
   constructor() {
     super(...arguments), this.size = "small", this.color = "default";
   }
   render() {
-    const e = W4[this.size] ?? 16;
-    return Y1`
+    const e = l3[this.size] ?? 16;
+    return J1`
       <svg
         xmlns="http://www.w3.org/2000/svg"
         width="${e}"
@@ -708,13 +708,13 @@ const T5 = "M7.23359 3.5336C7.49685 2.82213 8.50314 2.82213 8.76641 3.5336L9.635
         fill="currentColor"
         overflow="visible"
       >
-        <path class="star"        d="${T5}"/>
-        <path class="star star-2" d="${T5}"/>
+        <path class="star"        d="${X5}"/>
+        <path class="star star-2" d="${X5}"/>
       </svg>
     `;
   }
 };
-P2.styles = g`
+T2.styles = g`
     :host { display: inline-block; line-height: 0; }
     /* ── Colors ─────────────────────────────────────────────────── */
@@ -753,15 +753,15 @@ P2.styles = g`
       100% { transform: translate(12px, 12px)   scale(0.5); opacity: 0; }
     }
   `;
-let k1 = P2;
-s4([
+let z1 = T2;
+f4([
   a({ reflect: !0 })
-], k1.prototype, "size");
-s4([
+], z1.prototype, "size");
+f4([
   a({ reflect: !0 })
-], k1.prototype, "color");
-customElements.get("anduin-sparkle-spinner") || customElements.define("anduin-sparkle-spinner", k1);
-const N5 = {
+], z1.prototype, "color");
+customElements.get("anduin-sparkle-spinner") || customElements.define("anduin-sparkle-spinner", z1);
+const K5 = {
   access: [{ d: "M13 2.5H3C2.72386 2.5 2.5 2.72386 2.5 3V5.75H1V3C1 1.89543 1.89543 1 3 1H13C14.1046 1 15 1.89543 15 3V13C15 14.1046 14.1046 15 13 15H3C1.89543 15 1 14.1046 1 13V10.25H2.5V13C2.5 13.2761 2.72386 13.5 3 13.5H13C13.2761 13.5 13.5 13.2761 13.5 13V3C13.5 2.72386 13.2761 2.5 13 2.5ZM7.53033 4.21979C7.23744 3.9269 6.76256 3.9269 6.46967 4.21979C6.17678 4.51269 6.17678 4.98756 6.46967 5.28045L8.43922 7.25L0.75 7.25C0.335786 7.25 0 7.58579 0 8C0 8.41421 0.335786 8.75 0.75 8.75L8.43946 8.75L6.46967 10.7198C6.17678 11.0127 6.17678 11.4876 6.46967 11.7805C6.76256 12.0733 7.23744 12.0733 7.53033 11.7805L10.7803 8.53044C11.0732 8.23755 11.0732 7.76268 10.7803 7.46978L7.53033 4.21979Z", fillRule: "evenodd", clipRule: "evenodd" }],
   alignCenter: [{ d: "M2 1C1.44772 1 1 1.44772 1 2C1 2.55228 1.44772 3 2 3H14C14.5523 3 15 2.55228 15 2C15 1.44772 14.5523 1 14 1H2ZM2 9C1.44772 9 1 9.44771 1 10C1 10.5523 1.44772 11 2 11H14C14.5523 11 15 10.5523 15 10C15 9.44771 14.5523 9 14 9H2ZM4 6C4 5.44772 4.44772 5 5 5H11C11.5523 5 12 5.44772 12 6C12 6.55228 11.5523 7 11 7H5C4.44772 7 4 6.55228 4 6ZM5 13C4.44772 13 4 13.4477 4 14C4 14.5523 4.44772 15 5 15H11C11.5523 15 12 14.5523 12 14C12 13.4477 11.5523 13 11 13H5Z", fillRule: "evenodd", clipRule: "evenodd" }],
   alignJustify: [{ d: "M2 1C1.44772 1 1 1.44772 1 2C1 2.55228 1.44772 3 2 3H14C14.5523 3 15 2.55228 15 2C15 1.44772 14.5523 1 14 1H2ZM2 9C1.44772 9 1 9.44771 1 10C1 10.5523 1.44772 11 2 11H14C14.5523 11 15 10.5523 15 10C15 9.44771 14.5523 9 14 9H2ZM1 6C1 5.44772 1.44772 5 2 5H14C14.5523 5 15 5.44772 15 6C15 6.55228 14.5523 7 14 7H2C1.44772 7 1 6.55228 1 6ZM2 13C1.44772 13 1 13.4477 1 14C1 14.5523 1.44772 15 2 15H14C14.5523 15 15 14.5523 15 14C15 13.4477 14.5523 13 14 13H2Z", fillRule: "evenodd", clipRule: "evenodd" }],
@@ -1110,18 +1110,18 @@ const N5 = {
   zoomOut: [{ d: "M4.5 6.25C4.08579 6.25 3.75 6.58579 3.75 7C3.75 7.41421 4.08579 7.75 4.5 7.75H9.5C9.91421 7.75 10.25 7.41421 10.25 7C10.25 6.58579 9.91421 6.25 9.5 6.25H4.5ZM7 14C8.57591 14 10.0302 13.4792 11.2001 12.6004C11.2281 12.6376 11.259 12.6733 11.2929 12.7071L14.2929 15.7071C14.6834 16.0976 15.3166 16.0976 15.7071 15.7071C16.0976 15.3166 16.0976 14.6834 15.7071 14.2929L12.7071 11.2929C12.6733 11.259 12.6376 11.2281 12.6004 11.2001C13.4792 10.0302 14 8.57591 14 7C14 3.13401 10.866 0 7 0C3.13401 0 0 3.13401 0 7C0 10.866 3.13401 14 7 14ZM7 12.5C10.0376 12.5 12.5 10.0376 12.5 7C12.5 3.96243 10.0376 1.5 7 1.5C3.96243 1.5 1.5 3.96243 1.5 7C1.5 10.0376 3.96243 12.5 7 12.5Z", fillRule: "evenodd", clipRule: "evenodd" }],
   zz: [{ d: "M9.75 1.02686C9.33579 1.02686 9 1.36264 9 1.77686C9 2.19107 9.33579 2.52686 9.75 2.52686H12.8186L9.13336 7.84995C8.97457 8.07931 8.9562 8.37784 9.08567 8.62494C9.21513 8.87203 9.47104 9.02686 9.75 9.02686H14.25C14.6642 9.02686 15 8.69107 15 8.27686C15 7.86264 14.6642 7.52686 14.25 7.52686H11.1814L14.8666 2.20376C15.0254 1.97441 15.0438 1.67587 14.9143 1.42878C14.7849 1.18168 14.529 1.02686 14.25 1.02686H9.75ZM1.75 7.02686C1.33579 7.02686 1 7.36264 1 7.77686C1 8.19107 1.33579 8.52686 1.75 8.52686H4.81858L1.13336 13.8499C0.974572 14.0793 0.956201 14.3778 1.08567 14.6249C1.21513 14.872 1.47104 15.0269 1.75 15.0269H6.25C6.66422 15.0269 7 14.6911 7 14.2769C7 13.8626 6.66422 13.5269 6.25 13.5269H3.18143L6.86665 8.20376C7.02543 7.97441 7.0438 7.67587 6.91434 7.42878C6.78487 7.18168 6.52896 7.02686 6.25 7.02686H1.75Z", fillRule: "evenodd", clipRule: "evenodd" }]
 };
-var Y4 = Object.defineProperty, C4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && Y4(e, t, o), o;
+var r3 = Object.defineProperty, H4 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && r3(e, t, o), o;
 };
-const F2 = class F2 extends u {
+const N2 = class N2 extends u {
   constructor() {
     super(...arguments), this.name = "", this.size = 16;
   }
   render() {
-    const e = this.name && N5[this.name] ? N5[this.name] : [], t = !this.name;
-    return Y1`
+    const e = this.name && K5[this.name] ? K5[this.name] : [], t = !this.name;
+    return J1`
       <svg
         class=${t ? "icon--hidden" : ""}
         xmlns="http://www.w3.org/2000/svg"
@@ -1131,7 +1131,7 @@ const F2 = class F2 extends u {
         viewBox="0 0 16 16"
       >
         ${e.map(
-      (i) => Y1`
+      (i) => J1`
           <path
             fill="currentColor"
             d="${i.d}"
@@ -1143,24 +1143,24 @@ const F2 = class F2 extends u {
     `;
   }
 };
-F2.styles = g`
+N2.styles = g`
     :host { display: block; line-height: 0; font-family: var(--font-sans); }
     .icon--hidden { display: none; }
   `;
-let $1 = F2;
-C4([
+let A1 = N2;
+H4([
   a()
-], $1.prototype, "name");
-C4([
+], A1.prototype, "name");
+H4([
   a({ type: Number })
-], $1.prototype, "size");
-customElements.get("anduin-icon") || customElements.define("anduin-icon", $1);
-var X4 = Object.defineProperty, K4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && X4(e, t, o), o;
+], A1.prototype, "size");
+customElements.get("anduin-icon") || customElements.define("anduin-icon", A1);
+var n3 = Object.defineProperty, a3 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && n3(e, t, o), o;
 };
-const d4 = g`
+const V4 = g`
   :host { display: inline-block; font-family: var(--font-sans); }
   .badge {
     border-radius: 9999px;
@@ -1187,7 +1187,7 @@ const d4 = g`
   .badge--bold-warning { background-color: var(--color-semantic-warning-3); color: var(--color-semantic-gray-8); }
   .badge--hidden { display: none; }
 `;
-function c4(l) {
+function m4(r) {
   return {
     gray: "badge--light-gray",
     primary: "badge--light-primary",
@@ -1199,29 +1199,29 @@ function c4(l) {
     boldSuccess: "badge--bold-success",
     boldWarning: "badge--bold-warning",
     boldDanger: "badge--bold-danger"
-  }[l || "gray"] || "badge--light-gray";
+  }[r || "gray"] || "badge--light-gray";
 }
-const O2 = class O2 extends u {
+const j2 = class j2 extends u {
   constructor() {
     super(...arguments), this.variant = "gray";
   }
   render() {
-    const e = c4(this.variant);
+    const e = m4(this.variant);
     return C`<div class="badge ${e}" part="badge"><slot></slot></div>`;
   }
 };
-O2.styles = [d4];
-let X1 = O2;
-K4([
+j2.styles = [V4];
+let Q1 = j2;
+a3([
   a()
-], X1.prototype, "variant");
-customElements.get("anduin-badge") || customElements.define("anduin-badge", X1);
-var J4 = Object.defineProperty, p4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && J4(e, t, o), o;
+], Q1.prototype, "variant");
+customElements.get("anduin-badge") || customElements.define("anduin-badge", Q1);
+var s3 = Object.defineProperty, b4 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && s3(e, t, o), o;
 };
-const D2 = class D2 extends u {
+const U2 = class U2 extends u {
   constructor() {
     super(...arguments), this.variant = "gray", this.count = 0;
   }
@@ -1229,7 +1229,7 @@ const D2 = class D2 extends u {
     return e > 99 ? "99+" : e.toString();
   }
   render() {
-    const e = c4(this.variant), t = this.count === 0, i = this.count > 0 && this.count < 10, o = [
+    const e = m4(this.variant), t = this.count === 0, i = this.count > 0 && this.count < 10, o = [
       "badge",
       e,
       t ? "badge--hidden" : "",
@@ -1238,24 +1238,24 @@ const D2 = class D2 extends u {
     return C`<div class="${o}" part="badge">${this.formatCount(this.count)}</div>`;
   }
 };
-D2.styles = [d4];
-let E1 = D2;
-p4([
+U2.styles = [V4];
+let B1 = U2;
+b4([
   a()
-], E1.prototype, "variant");
-p4([
+], B1.prototype, "variant");
+b4([
   a({ type: Number })
-], E1.prototype, "count");
-customElements.get("anduin-badge-count") || customElements.define("anduin-badge-count", E1);
-var Q4 = Object.defineProperty, _ = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && Q4(e, t, o), o;
+], B1.prototype, "count");
+customElements.get("anduin-badge-count") || customElements.define("anduin-badge-count", B1);
+var C3 = Object.defineProperty, _ = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && C3(e, t, o), o;
 };
-function e3(l) {
-  return l.replace(/([A-Z])/g, (e) => `-${e.toLowerCase()}`);
+function d3(r) {
+  return r.replace(/([A-Z])/g, (e) => `-${e.toLowerCase()}`);
 }
-const I2 = class I2 extends u {
+const G2 = class G2 extends u {
   constructor() {
     super(...arguments), this.iconOnly = !1, this.appearance = "filled", this.variant = "", this.size = "medium", this.disabled = !1, this.loading = !1, this.fullWidth = !1, this.pill = !1, this.selected = !1, this.href = "", this.openNewTab = !1, this.download = "", this.startIcon = "", this.endIcon = "", this.label = "";
   }
@@ -1272,7 +1272,7 @@ const I2 = class I2 extends u {
     return this.variant ? this.variant : this.appearance === "filled" ? "gray0" : this.appearance === "text" ? "primary" : "gray9";
   }
   getSizeKebab() {
-    return e3(this.size);
+    return d3(this.size);
   }
   iconSize() {
     return this.size === "tiny" || this.size === "extraSmall" || this.size === "small" ? "12" : "16";
@@ -1316,7 +1316,7 @@ const I2 = class I2 extends u {
     `;
   }
 };
-I2.styles = g`
+G2.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     :host([full-width]) { display: block; width: 100%; }
     .button {
@@ -1429,59 +1429,59 @@ I2.styles = g`
     .button--icon-only.button--medium { width: 32px; min-width: 32px; padding-left: 0; padding-right: 0; }
     .button--icon-only.button--large { width: 40px; min-width: 40px; padding-left: 0; padding-right: 0; }
   `;
-let m = I2;
+let L = G2;
 _([
-  b()
-], m.prototype, "iconOnly");
+  m()
+], L.prototype, "iconOnly");
 _([
-  a({ converter: (l) => l || "filled" })
-], m.prototype, "appearance");
+  a({ converter: (r) => r || "filled" })
+], L.prototype, "appearance");
 _([
   a()
-], m.prototype, "variant");
+], L.prototype, "variant");
 _([
   a()
-], m.prototype, "size");
+], L.prototype, "size");
 _([
   a({ type: Boolean })
-], m.prototype, "disabled");
+], L.prototype, "disabled");
 _([
   a({ type: Boolean })
-], m.prototype, "loading");
+], L.prototype, "loading");
 _([
   a({ type: Boolean, attribute: "full-width", reflect: !0 })
-], m.prototype, "fullWidth");
+], L.prototype, "fullWidth");
 _([
   a({ type: Boolean })
-], m.prototype, "pill");
+], L.prototype, "pill");
 _([
   a({ type: Boolean })
-], m.prototype, "selected");
+], L.prototype, "selected");
 _([
   a()
-], m.prototype, "href");
+], L.prototype, "href");
 _([
   a({ type: Boolean, attribute: "open-new-tab" })
-], m.prototype, "openNewTab");
+], L.prototype, "openNewTab");
 _([
   a()
-], m.prototype, "download");
+], L.prototype, "download");
 _([
   a({ attribute: "start-icon" })
-], m.prototype, "startIcon");
+], L.prototype, "startIcon");
 _([
   a({ attribute: "end-icon" })
-], m.prototype, "endIcon");
+], L.prototype, "endIcon");
 _([
   a()
-], m.prototype, "label");
-customElements.get("anduin-button") || customElements.define("anduin-button", m);
-var t3 = Object.defineProperty, o3 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && t3(e, t, o), o;
+], L.prototype, "label");
+customElements.get("anduin-button") || customElements.define("anduin-button", L);
+var c3 = Object.defineProperty, p3 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && c3(e, t, o), o;
 };
-const T2 = class T2 extends u {
+const q2 = class q2 extends u {
   constructor() {
     super(...arguments), this.variant = "gray";
   }
@@ -1494,7 +1494,7 @@ const T2 = class T2 extends u {
     `;
   }
 };
-T2.styles = g`
+q2.styles = g`
     :host { display: block; font-family: var(--font-sans); }
     .callout {
       display: flex; align-items: center; justify-content: center;
@@ -1506,17 +1506,17 @@ T2.styles = g`
     .callout--danger { background-color: var(--color-semantic-danger-4); color: var(--color-semantic-gray-0); }
     .callout--warning { background-color: var(--color-semantic-warning-3); color: var(--color-semantic-gray-8); }
   `;
-let K1 = T2;
-o3([
+let e2 = q2;
+p3([
   a()
-], K1.prototype, "variant");
-customElements.get("anduin-callout") || customElements.define("anduin-callout", K1);
-var i3 = Object.defineProperty, u4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && i3(e, t, o), o;
+], e2.prototype, "variant");
+customElements.get("anduin-callout") || customElements.define("anduin-callout", e2);
+var u3 = Object.defineProperty, L4 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && u3(e, t, o), o;
 };
-const N2 = class N2 extends u {
+const W2 = class W2 extends u {
   constructor() {
     super(...arguments), this.direction = "horizontal", this.hasContent = !1;
   }
@@ -1529,8 +1529,8 @@ const N2 = class N2 extends u {
   onSlotChange(e) {
     const i = e.target.assignedNodes({ flatten: !0 });
     this.hasContent = i.some((o) => {
-      var r;
-      return ((r = o.textContent) == null ? void 0 : r.trim()) !== "";
+      var l;
+      return ((l = o.textContent) == null ? void 0 : l.trim()) !== "";
     });
   }
   render() {
@@ -1547,7 +1547,7 @@ const N2 = class N2 extends u {
             </div>` : C`<div class="divider--horizontal divider--horizontal-empty"><slot @slotchange=${this.onSlotChange}></slot></div>`;
   }
 };
-N2.styles = g`
+W2.styles = g`
     :host { display: block; width: 100%; font-family: var(--font-sans); }
     :host([direction="vertical"]) { width: auto; height: 100%; }
     .divider--horizontal { margin-top: 8px; margin-bottom: 8px; width: 100%; display: grid; grid-template-columns: 1fr auto 1fr; column-gap: 8px; text-align: center; }
@@ -1557,20 +1557,20 @@ N2.styles = g`
     .divider--vertical-empty { background-color: var(--color-gray-3); width: 1px; }
     .divider__line--vertical { border-left: 1px solid var(--color-gray-3); justify-self: center; }
   `;
-let A1 = N2;
-u4([
+let P1 = W2;
+L4([
   a({ reflect: !0 })
-], A1.prototype, "direction");
-u4([
-  b()
-], A1.prototype, "hasContent");
-customElements.get("anduin-divider") || customElements.define("anduin-divider", A1);
-var l3 = Object.defineProperty, r3 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && l3(e, t, o), o;
+], P1.prototype, "direction");
+L4([
+  m()
+], P1.prototype, "hasContent");
+customElements.get("anduin-divider") || customElements.define("anduin-divider", P1);
+var h3 = Object.defineProperty, g3 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && h3(e, t, o), o;
 };
-const j2 = class j2 extends u {
+const Y2 = class Y2 extends u {
   constructor() {
     super(...arguments), this.variant = "gray";
   }
@@ -1578,7 +1578,7 @@ const j2 = class j2 extends u {
     return C`<div class="dot dot--${this.variant}" part="dot"></div>`;
   }
 };
-j2.styles = g`
+Y2.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     .dot { width: 10px; height: 10px; border-radius: 9999px; }
     .dot--gray { background-color: var(--color-semantic-gray-6); color: var(--color-semantic-gray-0); }
@@ -1587,17 +1587,17 @@ j2.styles = g`
     .dot--danger { background-color: var(--color-semantic-danger-4); color: var(--color-semantic-gray-0); }
     .dot--warning { background-color: var(--color-semantic-warning-3); color: var(--color-semantic-gray-8); }
   `;
-let J1 = j2;
-r3([
+let t2 = Y2;
+g3([
   a()
-], J1.prototype, "variant");
-customElements.get("anduin-dot") || customElements.define("anduin-dot", J1);
-var n3 = Object.defineProperty, h4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && n3(e, t, o), o;
+], t2.prototype, "variant");
+customElements.get("anduin-dot") || customElements.define("anduin-dot", t2);
+var v3 = Object.defineProperty, y4 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && v3(e, t, o), o;
 };
-const U2 = class U2 extends u {
+const X2 = class X2 extends u {
   constructor() {
     super(...arguments), this.percent = "", this.height = "medium";
   }
@@ -1613,7 +1613,7 @@ const U2 = class U2 extends u {
     `;
   }
 };
-U2.styles = g`
+X2.styles = g`
     :host { display: block; font-family: var(--font-sans); }
     .progress { overflow-x: hidden; position: relative; border-radius: 9999px; }
     .progress__fill {
@@ -1629,20 +1629,20 @@ U2.styles = g`
       to { transform: translateX(330%); }
     }
   `;
-let z1 = U2;
-h4([
+let S1 = X2;
+y4([
   a()
-], z1.prototype, "percent");
-h4([
+], S1.prototype, "percent");
+y4([
   a()
-], z1.prototype, "height");
-customElements.get("anduin-progress") || customElements.define("anduin-progress", z1);
-var a3 = Object.defineProperty, L1 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && a3(e, t, o), o;
+], S1.prototype, "height");
+customElements.get("anduin-progress") || customElements.define("anduin-progress", S1);
+var f3 = Object.defineProperty, y1 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && f3(e, t, o), o;
 };
-const q2 = class q2 extends u {
+const K2 = class K2 extends u {
   constructor() {
     super(...arguments), this.effect = "pulse", this.shape = "rectangle", this.height = "", this.width = "100%", this.duration = 1500, this.fontSize = "";
   }
@@ -1661,7 +1661,7 @@ const q2 = class q2 extends u {
     `;
   }
 };
-q2.styles = g`
+K2.styles = g`
     :host { display: block; height: 100%; font-family: var(--font-sans); }
     .skeleton { background-color: var(--color-gray-3); position: relative; overflow: hidden; }
     .skeleton--circle { border-radius: 9999px; }
@@ -1680,32 +1680,32 @@ q2.styles = g`
       0% { transform: translateX(-100%); } 100% { transform: translateX(100%); }
     }
   `;
-let I = q2;
-L1([
+let I = K2;
+y1([
   a()
 ], I.prototype, "effect");
-L1([
+y1([
   a()
 ], I.prototype, "shape");
-L1([
+y1([
   a()
 ], I.prototype, "height");
-L1([
+y1([
   a()
 ], I.prototype, "width");
-L1([
+y1([
   a({ type: Number })
 ], I.prototype, "duration");
-L1([
+y1([
   a({ attribute: "font-size" })
 ], I.prototype, "fontSize");
 customElements.get("anduin-skeleton") || customElements.define("anduin-skeleton", I);
-var s3 = Object.defineProperty, C3 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && s3(e, t, o), o;
+var H3 = Object.defineProperty, V3 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && H3(e, t, o), o;
 };
-const G2 = class G2 extends u {
+const J2 = class J2 extends u {
   constructor() {
     super(...arguments), this.height = "256px";
   }
@@ -1720,30 +1720,30 @@ const G2 = class G2 extends u {
     `;
   }
 };
-G2.styles = g`
+J2.styles = g`
     :host { display: block; height: 100%; font-family: var(--font-sans); }
     .loading-state { display: flex; flex-direction: column; justify-content: center; align-items: center; }
     .loading-state__indicator { color: var(--color-primary-4); }
     .loading-state__content { margin-top: 12px; font-size: 15px; color: var(--color-gray-6); }
   `;
-let Q1 = G2;
-C3([
+let o2 = J2;
+V3([
   a()
-], Q1.prototype, "height");
-customElements.get("anduin-loading-state") || customElements.define("anduin-loading-state", Q1);
-var d3 = Object.defineProperty, A2 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && d3(e, t, o), o;
+], o2.prototype, "height");
+customElements.get("anduin-loading-state") || customElements.define("anduin-loading-state", o2);
+var m3 = Object.defineProperty, F2 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && m3(e, t, o), o;
 };
-const g4 = "anduin-field:label-click", m1 = "anduin-field:label-click-coordinated", W2 = class W2 extends u {
+const M4 = "anduin-field:label-click", M1 = "anduin-field:label-click-coordinated", Q2 = class Q2 extends u {
   constructor() {
     super(...arguments), this.orientation = "vertical";
   }
   connectedCallback() {
-    super.connectedCallback(), this.addEventListener(g4, (e) => {
+    super.connectedCallback(), this.addEventListener(M4, (e) => {
       const t = e;
-      this.dispatchEvent(new CustomEvent(m1, {
+      this.dispatchEvent(new CustomEvent(M1, {
         detail: t.detail,
         bubbles: !1,
         composed: !1
@@ -1759,17 +1759,17 @@ const g4 = "anduin-field:label-click", m1 = "anduin-field:label-click-coordinate
     `;
   }
 };
-W2.styles = g`
+Q2.styles = g`
     :host { display: block; font-family: var(--font-sans); }
     .field { display: flex; flex-wrap: wrap; }
     .field--vertical { flex-direction: column; row-gap: 4px; }
     .field--horizontal { column-gap: 4px; }
   `;
-let e2 = W2;
-A2([
+let i2 = Q2;
+F2([
   a()
-], e2.prototype, "orientation");
-const Y2 = class Y2 extends u {
+], i2.prototype, "orientation");
+const e5 = class e5 extends u {
   constructor() {
     super(...arguments), this.htmlfor = "", this.required = !1;
   }
@@ -1777,7 +1777,7 @@ const Y2 = class Y2 extends u {
     super.connectedCallback();
   }
   onLabelClick(e) {
-    this.htmlfor && (e.preventDefault(), this.dispatchEvent(new CustomEvent(g4, {
+    this.htmlfor && (e.preventDefault(), this.dispatchEvent(new CustomEvent(M4, {
       detail: this.htmlfor,
       bubbles: !0,
       composed: !0
@@ -1796,72 +1796,72 @@ const Y2 = class Y2 extends u {
     `;
   }
 };
-Y2.styles = g`
+e5.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     .field-label { font-size: 13px; line-height: 20px; font-weight: 600; cursor: default; color: var(--color-gray-8, #101828); }
     .field-label__required { color: var(--color-danger-5); }
   `;
-let B1 = Y2;
-A2([
+let F1 = e5;
+F2([
   a()
-], B1.prototype, "htmlfor");
-A2([
+], F1.prototype, "htmlfor");
+F2([
   a({ type: Boolean })
-], B1.prototype, "required");
-const X2 = class X2 extends u {
+], F1.prototype, "required");
+const t5 = class t5 extends u {
   render() {
     return C`<div class="field-description" part="description"><slot></slot></div>`;
   }
 };
-X2.styles = g`
+t5.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     .field-description { display: block; line-height: 16px; font-size: 11px; color: var(--color-gray-7); }
   `;
-let p2 = X2;
-const K2 = class K2 extends u {
+let f2 = t5;
+const o5 = class o5 extends u {
   render() {
     return C`<div class="field-error" part="error"><slot></slot></div>`;
   }
 };
-K2.styles = g`
+o5.styles = g`
     :host { display: block; font-family: var(--font-sans); }
     .field-error { color: var(--color-danger-4); }
   `;
-let u2 = K2;
-const J2 = class J2 extends u {
+let H2 = o5;
+const i5 = class i5 extends u {
   render() {
     return C`<div class="field-group" part="group"><slot></slot></div>`;
   }
 };
-J2.styles = g`
+i5.styles = g`
     :host { display: block; font-family: var(--font-sans); }
     .field-group { display: flex; flex-direction: column; row-gap: 24px; }
   `;
-let h2 = J2;
-customElements.get("anduin-field") || customElements.define("anduin-field", e2);
-customElements.get("anduin-field-label") || customElements.define("anduin-field-label", B1);
-customElements.get("anduin-field-description") || customElements.define("anduin-field-description", p2);
-customElements.get("anduin-field-error") || customElements.define("anduin-field-error", u2);
-customElements.get("anduin-field-group") || customElements.define("anduin-field-group", h2);
-var c3 = Object.defineProperty, N1 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && c3(e, t, o), o;
+let V2 = i5;
+customElements.get("anduin-field") || customElements.define("anduin-field", i2);
+customElements.get("anduin-field-label") || customElements.define("anduin-field-label", F1);
+customElements.get("anduin-field-description") || customElements.define("anduin-field-description", f2);
+customElements.get("anduin-field-error") || customElements.define("anduin-field-error", H2);
+customElements.get("anduin-field-group") || customElements.define("anduin-field-group", V2);
+var b3 = Object.defineProperty, G1 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && b3(e, t, o), o;
 };
-const p3 = "anduin-checkbox:change", Q2 = class Q2 extends u {
+const L3 = "anduin-checkbox:change", l5 = class l5 extends u {
   constructor() {
     super(...arguments), this.checked = !1, this.disabled = !1, this.indeterminate = !1, this.readonly = !1, this.inputid = "";
   }
   connectedCallback() {
     super.connectedCallback();
     const e = this.closest("anduin-field");
-    e && e.addEventListener(m1, (t) => {
+    e && e.addEventListener(M1, (t) => {
       const i = t;
       this.inputid && this.inputid === i.detail && !this.disabled && !this.readonly && this.toggle();
     });
   }
   toggle() {
-    this.checked = !this.checked, this.dispatchEvent(new CustomEvent(p3, {
+    this.checked = !this.checked, this.dispatchEvent(new CustomEvent(L3, {
       detail: this.checked,
       bubbles: !0,
       composed: !0
@@ -1902,7 +1902,7 @@ const p3 = "anduin-checkbox:change", Q2 = class Q2 extends u {
     `;
   }
 };
-Q2.styles = g`
+l5.styles = g`
     :host { display: inline-flex; font-family: var(--font-sans); }
     label {
@@ -1940,36 +1940,36 @@ Q2.styles = g`
     .checkbox__icon { position: absolute; inset: 0; pointer-events: none; color: var(--color-gray-4); display: flex; align-items: center; justify-content: center; }
     .checkbox__icon--visible { color: var(--color-gray-0); }
   `;
-let X = Q2;
-N1([
+let X = l5;
+G1([
   a({ type: Boolean })
 ], X.prototype, "checked");
-N1([
+G1([
   a({ type: Boolean })
 ], X.prototype, "disabled");
-N1([
+G1([
   a({ type: Boolean })
 ], X.prototype, "indeterminate");
-N1([
+G1([
   a({ type: Boolean })
 ], X.prototype, "readonly");
-N1([
+G1([
   a()
 ], X.prototype, "inputid");
 customElements.get("anduin-checkbox") || customElements.define("anduin-checkbox", X);
-var u3 = Object.defineProperty, z = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && u3(e, t, o), o;
+var y3 = Object.defineProperty, A = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && y3(e, t, o), o;
 };
-const j5 = "anduin-input:change", h3 = "anduin-input:clear", e5 = class e5 extends u {
+const J5 = "anduin-input:change", M3 = "anduin-input:clear", r5 = class r5 extends u {
   constructor() {
     super(...arguments), this.value = "", this.size = "default", this.disabled = !1, this.readonly = !1, this.placeholder = "", this.inputid = "", this.status = "", this.startIcon = "", this.endIcon = "", this.clearable = !1;
   }
   connectedCallback() {
     super.connectedCallback();
     const e = this.closest("anduin-field");
-    e && e.addEventListener(m1, (t) => {
+    e && e.addEventListener(M1, (t) => {
       var o;
       const i = t;
       this.inputid && this.inputid === i.detail && ((o = this.inputEl) == null || o.focus());
@@ -1979,7 +1979,7 @@ const j5 = "anduin-input:change", h3 = "anduin-input:clear", e5 = class e5 exten
     this.inputEl && this.inputEl.value !== this.value && (this.inputEl.value = this.value);
   }
   onInput() {
-    this.value = this.inputEl.value, this.dispatchEvent(new CustomEvent(j5, {
+    this.value = this.inputEl.value, this.dispatchEvent(new CustomEvent(J5, {
       detail: this.value,
       bubbles: !0,
       composed: !0
@@ -1987,10 +1987,10 @@ const j5 = "anduin-input:change", h3 = "anduin-input:clear", e5 = class e5 exten
   }
   onClear() {
     var e;
-    this.value = "", this.inputEl && (this.inputEl.value = ""), this.dispatchEvent(new CustomEvent(j5, { detail: "", bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent(h3, { bubbles: !0, composed: !0 })), (e = this.inputEl) == null || e.focus();
+    this.value = "", this.inputEl && (this.inputEl.value = ""), this.dispatchEvent(new CustomEvent(J5, { detail: "", bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent(M3, { bubbles: !0, composed: !0 })), (e = this.inputEl) == null || e.focus();
   }
   render() {
-    const e = this.size === "small" ? "input--small" : this.size === "large" ? "input--large" : "input--default", t = this.status ? `input--${this.status}` : "", i = !!this.startIcon, o = !!this.endIcon || this.clearable && !!this.value, r = this.clearable && !!this.value && !this.disabled && !this.readonly, n = this.size === "small" ? "12" : this.size === "large" ? "20" : "16", s = this.size === "small" ? "10" : this.size === "large" ? "16" : "14";
+    const e = this.size === "small" ? "input--small" : this.size === "large" ? "input--large" : "input--default", t = this.status ? `input--${this.status}` : "", i = !!this.startIcon, o = !!this.endIcon || this.clearable && !!this.value, l = this.clearable && !!this.value && !this.disabled && !this.readonly, n = this.size === "small" ? "12" : this.size === "large" ? "20" : "16", s = this.size === "small" ? "10" : this.size === "large" ? "16" : "14";
     return C`
       <div class="input-wrapper">
         ${i ? C`
@@ -2017,7 +2017,7 @@ const j5 = "anduin-input:change", h3 = "anduin-input:clear", e5 = class e5 exten
         ${o ? C`
           <span class="input__end">
-            ${r ? C`
+            ${l ? C`
               <button class="input__clear" type="button" @click=${this.onClear} aria-label="Clear">
                 <anduin-icon name="cross" size=${s}></anduin-icon>
               </button>
@@ -2031,7 +2031,7 @@ const j5 = "anduin-input:change", h3 = "anduin-input:clear", e5 = class e5 exten
     `;
   }
 };
-e5.styles = g`
+r5.styles = g`
     :host { display: block; font-family: var(--font-sans); }
     .input-wrapper { position: relative; display: flex; align-items: center; }
@@ -2085,54 +2085,54 @@ e5.styles = g`
     }
     .input__clear:hover { color: var(--color-gray-7); }
   `;
-let w = e5;
-z([
+let w = r5;
+A([
   a()
 ], w.prototype, "value");
-z([
+A([
   a()
 ], w.prototype, "size");
-z([
+A([
   a({ type: Boolean })
 ], w.prototype, "disabled");
-z([
+A([
   a({ type: Boolean })
 ], w.prototype, "readonly");
-z([
+A([
   a()
 ], w.prototype, "placeholder");
-z([
+A([
   a()
 ], w.prototype, "inputid");
-z([
+A([
   a()
 ], w.prototype, "status");
-z([
+A([
   a({ attribute: "start-icon" })
 ], w.prototype, "startIcon");
-z([
+A([
   a({ attribute: "end-icon" })
 ], w.prototype, "endIcon");
-z([
+A([
   a({ type: Boolean })
 ], w.prototype, "clearable");
-z([
+A([
   k("input")
 ], w.prototype, "inputEl");
 customElements.get("anduin-input") || customElements.define("anduin-input", w);
-var g3 = Object.defineProperty, Q = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && g3(e, t, o), o;
+var Z3 = Object.defineProperty, Q = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && Z3(e, t, o), o;
 };
-const v3 = "anduin-textarea:change", t5 = class t5 extends u {
+const _3 = "anduin-textarea:change", n5 = class n5 extends u {
   constructor() {
     super(...arguments), this.value = "", this.disabled = !1, this.readonly = !1, this.placeholder = "", this.inputid = "", this.rows = 3, this.status = "";
   }
   connectedCallback() {
     super.connectedCallback();
     const e = this.closest("anduin-field");
-    e && e.addEventListener(m1, (t) => {
+    e && e.addEventListener(M1, (t) => {
       var o;
       const i = t;
       this.inputid && this.inputid === i.detail && ((o = this.textareaEl) == null || o.focus());
@@ -2142,7 +2142,7 @@ const v3 = "anduin-textarea:change", t5 = class t5 extends u {
     this.textareaEl && this.textareaEl.value !== this.value && (this.textareaEl.value = this.value);
   }
   onInput() {
-    this.value = this.textareaEl.value, this.dispatchEvent(new CustomEvent(v3, {
+    this.value = this.textareaEl.value, this.dispatchEvent(new CustomEvent(_3, {
       detail: this.value,
       bubbles: !0,
       composed: !0
@@ -2167,7 +2167,7 @@ const v3 = "anduin-textarea:change", t5 = class t5 extends u {
     `;
   }
 };
-t5.styles = g`
+n5.styles = g`
     :host { display: block; font-family: var(--font-sans); }
     .textarea {
@@ -2184,7 +2184,7 @@ t5.styles = g`
     .textarea--warning  { border-color: var(--color-warning-4); }
     .textarea--loading  { border-color: var(--color-gray-4); }
   `;
-let E = t5;
+let E = n5;
 Q([
   a()
 ], E.prototype, "value");
@@ -2210,20 +2210,20 @@ Q([
   k("textarea")
 ], E.prototype, "textareaEl");
 customElements.get("anduin-textarea") || customElements.define("anduin-textarea", E);
-var f3 = Object.defineProperty, $ = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && f3(e, t, o), o;
+var x3 = Object.defineProperty, $ = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && x3(e, t, o), o;
 };
-const v4 = "anduin-tab:trigger-click", i2 = "anduin-tab:value-changed", H3 = "anduin-tab:change", o5 = class o5 extends u {
+const Z4 = "anduin-tab:trigger-click", a2 = "anduin-tab:value-changed", w3 = "anduin-tab:change", a5 = class a5 extends u {
   constructor() {
     super(...arguments), this.defaultValue = "", this.value = "", this.fill = !1;
   }
   connectedCallback() {
-    super.connectedCallback(), this.addEventListener(v4, (e) => {
+    super.connectedCallback(), this.addEventListener(Z4, (e) => {
       e.stopPropagation();
       const t = e;
-      this.value = t.detail, this.broadcastValueChanged(t.detail), this.dispatchEvent(new CustomEvent(H3, { detail: t.detail, bubbles: !0, composed: !0 }));
+      this.value = t.detail, this.broadcastValueChanged(t.detail), this.dispatchEvent(new CustomEvent(w3, { detail: t.detail, bubbles: !0, composed: !0 }));
     }), requestAnimationFrame(() => {
       const e = this.value || this.defaultValue;
       e && (this.value || (this.value = e), this.broadcastValueChanged(e));
@@ -2236,36 +2236,36 @@ const v4 = "anduin-tab:trigger-click", i2 = "anduin-tab:value-changed", H3 = "an
     }
   }
   broadcastValueChanged(e) {
-    this.dispatchEvent(new CustomEvent(i2, { detail: e, bubbles: !1, composed: !1 }));
+    this.dispatchEvent(new CustomEvent(a2, { detail: e, bubbles: !1, composed: !1 }));
   }
   render() {
     return C`<div class="tabs" part="tabs"><slot></slot></div>`;
   }
 };
-o5.styles = g`
+a5.styles = g`
     :host { display: flex; flex-direction: column; font-family: var(--font-sans); }
     :host([fill]) { flex: 1; min-height: 0; --_tab-fill-flex: 1; --_tab-fill-height: 100%; }
     .tabs { display: flex; flex-direction: column; width: 100%; }
     :host([fill]) .tabs { flex: 1; min-height: 0; }
   `;
-let v1 = o5;
+let f1 = a5;
 $([
   a({ attribute: "default-value" })
-], v1.prototype, "defaultValue");
+], f1.prototype, "defaultValue");
 $([
   a()
-], v1.prototype, "value");
+], f1.prototype, "value");
 $([
   a({ type: Boolean, reflect: !0 })
-], v1.prototype, "fill");
-const i5 = class i5 extends u {
+], f1.prototype, "fill");
+const s5 = class s5 extends u {
   constructor() {
     super(...arguments), this.alignment = "left", this.lastActiveValue = "", this.resizeObserver = null;
   }
   connectedCallback() {
     super.connectedCallback();
     const e = this.closest("anduin-tabs");
-    e && e.addEventListener(i2, (t) => {
+    e && e.addEventListener(a2, (t) => {
       const i = t;
       this.lastActiveValue = i.detail, requestAnimationFrame(() => {
         this.animateIndicator(i.detail);
@@ -2286,9 +2286,9 @@ const i5 = class i5 extends u {
     const t = this.querySelectorAll(":scope > anduin-tab-trigger");
     for (let i = 0; i < t.length; i++) {
       const o = t[i];
-      if (o.getAttribute("value") === e) {
-        const r = o.getBoundingClientRect(), n = this.getBoundingClientRect(), s = r.left - n.left + this.scrollLeft;
-        this.indicator && (this.indicator.style.width = `${r.width}px`, this.indicator.style.transform = `translateX(${s}px)`);
+      if ((o.value || o.getAttribute("value")) === e) {
+        const n = o.getBoundingClientRect(), s = this.getBoundingClientRect(), d = n.left - s.left + this.scrollLeft;
+        this.indicator && (this.indicator.style.width = `${n.width}px`, this.indicator.style.transform = `translateX(${d}px)`);
         break;
       }
     }
@@ -2302,7 +2302,7 @@ const i5 = class i5 extends u {
     `;
   }
 };
-i5.styles = g`
+s5.styles = g`
     :host { display: block; font-family: var(--font-sans); }
     .tabs-list {
       display: flex; background-color: var(--color-gray-0);
@@ -2317,27 +2317,27 @@ i5.styles = g`
       left: 0; height: 2px; transition-duration: 200ms; transition-property: transform, width;
     }
   `;
-let S1 = i5;
+let O1 = s5;
 $([
   a()
-], S1.prototype, "alignment");
+], O1.prototype, "alignment");
 $([
   k(".tabs-list__indicator")
-], S1.prototype, "indicator");
-const l5 = class l5 extends u {
+], O1.prototype, "indicator");
+const C5 = class C5 extends u {
   constructor() {
     super(...arguments), this.value = "", this.startIcon = "", this.disabled = !1, this.showBadge = !1, this.badgeCount = "", this.isActive = !1;
   }
   connectedCallback() {
     super.connectedCallback();
     const e = this.closest("anduin-tabs");
-    e && e.addEventListener(i2, (t) => {
+    e && e.addEventListener(a2, (t) => {
       const i = t;
       this.isActive = i.detail === this.value;
     });
   }
   onClick() {
-    this.dispatchEvent(new CustomEvent(v4, { detail: this.value, bubbles: !0, composed: !0 }));
+    this.dispatchEvent(new CustomEvent(Z4, { detail: this.value, bubbles: !0, composed: !0 }));
   }
   render() {
     return C`
@@ -2358,7 +2358,7 @@ const l5 = class l5 extends u {
     `;
   }
 };
-l5.styles = g`
+C5.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     .tab-trigger {
       cursor: pointer; background: none; border: none; display: block;
@@ -2381,9 +2381,9 @@ l5.styles = g`
       color: var(--color-gray-7); white-space: nowrap;
     }
   `;
-let T = l5;
+let T = C5;
 $([
-  a()
+  a({ reflect: !0 })
 ], T.prototype, "value");
 $([
   a({ attribute: "start-icon" })
@@ -2398,16 +2398,16 @@ $([
   a({ attribute: "badge-count" })
 ], T.prototype, "badgeCount");
 $([
-  b()
+  m()
 ], T.prototype, "isActive");
-const r5 = class r5 extends u {
+const d5 = class d5 extends u {
   constructor() {
     super(...arguments), this.value = "", this.isActive = !1;
   }
   connectedCallback() {
     super.connectedCallback();
     const e = this.closest("anduin-tabs");
-    e && e.addEventListener(i2, (t) => {
+    e && e.addEventListener(a2, (t) => {
       const i = t;
       this.isActive = i.detail === this.value;
     });
@@ -2423,28 +2423,28 @@ const r5 = class r5 extends u {
     `;
   }
 };
-r5.styles = g`
+d5.styles = g`
     :host { display: block; font-family: var(--font-sans); flex: var(--_tab-fill-flex, 0 0 auto); min-height: 0; }
     :host(:not([active])) { display: none; }
     .tab-content { width: 100%; height: var(--_tab-fill-height, auto); overflow-x: hidden; overflow-y: auto; }
   `;
-let P1 = r5;
+let D1 = d5;
 $([
   a()
-], P1.prototype, "value");
+], D1.prototype, "value");
 $([
-  b()
-], P1.prototype, "isActive");
-customElements.get("anduin-tabs") || customElements.define("anduin-tabs", v1);
-customElements.get("anduin-tabs-list") || customElements.define("anduin-tabs-list", S1);
+  m()
+], D1.prototype, "isActive");
+customElements.get("anduin-tabs") || customElements.define("anduin-tabs", f1);
+customElements.get("anduin-tabs-list") || customElements.define("anduin-tabs-list", O1);
 customElements.get("anduin-tab-trigger") || customElements.define("anduin-tab-trigger", T);
-customElements.get("anduin-tab-content") || customElements.define("anduin-tab-content", P1);
-var V3 = Object.defineProperty, z2 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && V3(e, t, o), o;
+customElements.get("anduin-tab-content") || customElements.define("anduin-tab-content", D1);
+var R3 = Object.defineProperty, O2 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && R3(e, t, o), o;
 };
-const L3 = "anduin-tag-close:click", m3 = {
+const k3 = "anduin-tag-close:click", $3 = {
   gray: "tag--light-gray",
   primary: "tag--light-primary",
   success: "tag--light-success",
@@ -2469,7 +2469,7 @@ const L3 = "anduin-tag-close:click", m3 = {
   customYellow: "tag--custom-yellow",
   customYellowGreen: "tag--custom-yellow-green",
   customYellowOrange: "tag--custom-yellow-orange"
-}, b3 = {
+}, E3 = {
   gray: "tag__icon--light-gray",
   primary: "tag__icon--light-primary",
   success: "tag__icon--light-success",
@@ -2494,12 +2494,12 @@ const L3 = "anduin-tag-close:click", m3 = {
   customMagenta: "tag__icon--custom-magenta",
   customBlueGreen: "tag__icon--custom-blue-green",
   customPink: "tag__icon--custom-pink"
-}, n5 = class n5 extends u {
+}, c5 = class c5 extends u {
   constructor() {
     super(...arguments), this.variant = "gray", this.icon = "", this.disabled = !1;
   }
   render() {
-    const e = m3[this.variant] || "tag--light-gray", t = b3[this.variant] || "tag__icon--light-gray";
+    const e = $3[this.variant] || "tag--light-gray", t = E3[this.variant] || "tag__icon--light-gray";
     return C`
       <div class="tag ${e} ${this.disabled ? "tag--disabled" : ""}" part="tag">
         ${this.icon ? C`<anduin-icon name="${this.icon}" size="12" class="tag__icon ${t}"></anduin-icon>` : c}
@@ -2509,7 +2509,7 @@ const L3 = "anduin-tag-close:click", m3 = {
     `;
   }
 };
-n5.styles = g`
+c5.styles = g`
     :host { display: inline-flex; max-width: 100%; font-family: var(--font-sans); }
     .tag {
       font-weight: 500; font-size: 11px; height: 20px; padding-left: 6px; padding-right: 6px;
@@ -2557,19 +2557,19 @@ n5.styles = g`
     .tag--custom-yellow-green { color: var(--color-gray-9); background-color: rgb(174,207,85); }
     .tag--custom-yellow-orange { color: var(--color-gray-9); background-color: rgb(255,193,107); }
   `;
-let f1 = n5;
-z2([
+let H1 = c5;
+O2([
   a()
-], f1.prototype, "variant");
-z2([
+], H1.prototype, "variant");
+O2([
   a()
-], f1.prototype, "icon");
-z2([
+], H1.prototype, "icon");
+O2([
   a({ type: Boolean })
-], f1.prototype, "disabled");
-const a5 = class a5 extends u {
+], H1.prototype, "disabled");
+const p5 = class p5 extends u {
   onClick() {
-    this.dispatchEvent(new CustomEvent(L3, { bubbles: !0, composed: !0 }));
+    this.dispatchEvent(new CustomEvent(k3, { bubbles: !0, composed: !0 }));
   }
   render() {
     return C`
@@ -2579,7 +2579,7 @@ const a5 = class a5 extends u {
     `;
   }
 };
-a5.styles = g`
+p5.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     .tag-close__button {
       flex: none; width: 16px; height: 16px; display: flex; align-items: center;
@@ -2589,44 +2589,47 @@ a5.styles = g`
     .tag-close__button:hover { opacity: 0.7; }
     .tag-close__button:active { opacity: 0.5; }
   `;
-let g2 = a5;
-customElements.get("anduin-tag") || customElements.define("anduin-tag", f1);
-customElements.get("anduin-tag-close") || customElements.define("anduin-tag-close", g2);
-var y3 = Object.defineProperty, R = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && y3(e, t, o), o;
+let m2 = p5;
+customElements.get("anduin-tag") || customElements.define("anduin-tag", H1);
+customElements.get("anduin-tag-close") || customElements.define("anduin-tag-close", m2);
+var z3 = Object.defineProperty, R = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && z3(e, t, o), o;
 };
-const M3 = "anduin-toggle-group:change", Z3 = "anduin-toggle-group-item:change", _3 = "anduin-toggle-group-item:select", x3 = "anduin-toggle-group-item:deselect", v2 = "anduin-toggle-group-item:item-click", s5 = class s5 extends u {
+const A3 = "anduin-toggle-group:change", B3 = "anduin-toggle-group-item:change", P3 = "anduin-toggle-group-item:select", S3 = "anduin-toggle-group-item:deselect", b2 = "anduin-toggle-group-item:item-click", u5 = class u5 extends u {
   constructor() {
-    super(...arguments), this.mode = "single", this.defaultValue = "", this.value = null, this.size = "medium", this.variant = "gray", this.gap = !1, this.internalValue = [], this.onItemClick = (e) => {
+    super(...arguments), this.mode = "single", this.defaultValue = "", this.value = null, this.size = "medium", this.variant = "gray", this.gap = !1, this.internalValue = [], this.userInteracted = !1, this.onItemClick = (e) => {
       var d;
       e.stopPropagation();
-      const i = e.detail, o = this.selection, r = o.includes(i);
+      const i = e.detail, o = this.selection, l = o.includes(i);
       let n;
-      this.mode === "multiple" ? n = r ? o.filter((p) => p !== i) : [...o, i] : n = r ? [] : [i];
+      this.mode === "multiple" ? n = l ? o.filter((p) => p !== i) : [...o, i] : n = l ? [] : [i];
       const s = this.items.find((p) => p.value === i);
-      if (s == null || s.emitSelectionChange(!r), this.mode === "single" && !r)
+      if (s == null || s.emitSelectionChange(!l), this.mode === "single" && !l)
         for (const p of o)
           (d = this.items.find((h) => h.value === p)) == null || d.emitSelectionChange(!1);
-      this.dispatchEvent(new CustomEvent(M3, {
+      this.dispatchEvent(new CustomEvent(A3, {
         detail: n.join(" "),
         bubbles: !0,
         composed: !0
-      })), this.isControlled || (this.internalValue = n);
+      })), this.isControlled || (this.userInteracted = !0, this.internalValue = n);
     };
   }
   get isControlled() {
     return this.value != null;
   }
   get selection() {
-    return this.isControlled ? U5(this.value) : this.internalValue;
+    return this.isControlled ? p2(this.value) : this.internalValue;
   }
   connectedCallback() {
-    super.connectedCallback(), this.hasUpdated || (this.internalValue = U5(this.defaultValue)), this.addEventListener(v2, this.onItemClick);
+    super.connectedCallback(), this.hasUpdated || (this.internalValue = p2(this.defaultValue)), this.addEventListener(b2, this.onItemClick);
+  }
+  willUpdate(e) {
+    e.has("defaultValue") && !this.isControlled && !this.userInteracted && (this.internalValue = p2(this.defaultValue));
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener(v2, this.onItemClick);
+    super.disconnectedCallback(), this.removeEventListener(b2, this.onItemClick);
   }
   updated() {
     this.syncItems();
@@ -2647,7 +2650,7 @@ const M3 = "anduin-toggle-group:change", Z3 = "anduin-toggle-group-item:change",
     `;
   }
 };
-s5.styles = g`
+u5.styles = g`
     :host { display: inline-flex; font-family: var(--font-sans); }
     .toggle-group { display: inline-flex; align-items: center; }
     .toggle-group--small {
@@ -2677,39 +2680,39 @@ s5.styles = g`
     .toggle-group--gap { flex-wrap: wrap; gap: 8px; }
     .toggle-group--gap ::slotted(anduin-toggle-group-item) { --toggle-group-item-radius: 4px; margin-left: 0; }
   `;
-let S = s5;
+let P = u5;
 R([
   a()
-], S.prototype, "mode");
+], P.prototype, "mode");
 R([
   a({ attribute: "default-value" })
-], S.prototype, "defaultValue");
+], P.prototype, "defaultValue");
 R([
   a()
-], S.prototype, "value");
+], P.prototype, "value");
 R([
   a()
-], S.prototype, "size");
+], P.prototype, "size");
 R([
   a()
-], S.prototype, "variant");
+], P.prototype, "variant");
 R([
   a({ type: Boolean })
-], S.prototype, "gap");
+], P.prototype, "gap");
 R([
-  b()
-], S.prototype, "internalValue");
-const C5 = class C5 extends u {
+  m()
+], P.prototype, "internalValue");
+const h5 = class h5 extends u {
   constructor() {
     super(...arguments), this.value = "", this.startIcon = "", this.disabled = !1, this.selected = !1, this.groupSize = "medium", this.groupVariant = "gray", this.groupMode = "single";
   }
   /** Called by the parent group when the user's action changes this item's selection. */
   emitSelectionChange(e) {
-    this.dispatchEvent(new CustomEvent(Z3, {
+    this.dispatchEvent(new CustomEvent(B3, {
       detail: e,
       bubbles: !0,
       composed: !0
-    })), this.dispatchEvent(new CustomEvent(e ? _3 : x3, {
+    })), this.dispatchEvent(new CustomEvent(e ? P3 : S3, {
       detail: this.value,
       bubbles: !0,
       composed: !0
@@ -2719,7 +2722,7 @@ const C5 = class C5 extends u {
     (e.has("selected") || e.has("groupMode")) && (this.groupMode === "single" ? (this.setAttribute("role", "radio"), this.setAttribute("aria-checked", String(this.selected))) : (this.removeAttribute("role"), this.removeAttribute("aria-checked")));
   }
   onClick() {
-    this.dispatchEvent(new CustomEvent(v2, {
+    this.dispatchEvent(new CustomEvent(b2, {
       detail: this.value,
       bubbles: !0,
       composed: !0
@@ -2749,7 +2752,7 @@ const C5 = class C5 extends u {
     `;
   }
 };
-C5.styles = g`
+h5.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     .toggle-item {
       position: relative; z-index: 0; box-sizing: border-box;
@@ -2783,39 +2786,39 @@ C5.styles = g`
     .toggle-item--selected .toggle-item__icon { color: var(--color-gray-7); }
     .toggle-item--variant-primary.toggle-item--selected .toggle-item__icon { color: var(--color-primary-4); }
   `;
-let P = C5;
+let S = h5;
 R([
-  a()
-], P.prototype, "value");
+  a({ reflect: !0 })
+], S.prototype, "value");
 R([
   a({ attribute: "start-icon" })
-], P.prototype, "startIcon");
+], S.prototype, "startIcon");
 R([
   a({ type: Boolean })
-], P.prototype, "disabled");
+], S.prototype, "disabled");
 R([
   a({ attribute: !1 })
-], P.prototype, "selected");
+], S.prototype, "selected");
 R([
   a({ attribute: !1 })
-], P.prototype, "groupSize");
+], S.prototype, "groupSize");
 R([
   a({ attribute: !1 })
-], P.prototype, "groupVariant");
+], S.prototype, "groupVariant");
 R([
   a({ attribute: !1 })
-], P.prototype, "groupMode");
-function U5(l) {
-  return l.split(" ").map((e) => e.trim()).filter(Boolean);
+], S.prototype, "groupMode");
+function p2(r) {
+  return r.split(" ").map((e) => e.trim()).filter(Boolean);
 }
-customElements.get("anduin-toggle-group") || customElements.define("anduin-toggle-group", S);
-customElements.get("anduin-toggle-group-item") || customElements.define("anduin-toggle-group-item", P);
-var w3 = Object.defineProperty, f4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && w3(e, t, o), o;
+customElements.get("anduin-toggle-group") || customElements.define("anduin-toggle-group", P);
+customElements.get("anduin-toggle-group-item") || customElements.define("anduin-toggle-group-item", S);
+var F3 = Object.defineProperty, _4 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && F3(e, t, o), o;
 };
-const H4 = "anduin-tooltip:show", B2 = "anduin-tooltip:hide", V4 = "anduin-tooltip:trigger-mounted", L4 = "anduin-tooltip:content-popup-mounted", m4 = "anduin-tooltip:content-popup-unmounted", b4 = "anduin-tooltip:visibility-changed", R3 = [
+const x4 = "anduin-tooltip:show", D2 = "anduin-tooltip:hide", w4 = "anduin-tooltip:trigger-mounted", R4 = "anduin-tooltip:content-popup-mounted", k4 = "anduin-tooltip:content-popup-unmounted", $4 = "anduin-tooltip:visibility-changed", O3 = [
   "top-start",
   "top-center",
   "top-end",
@@ -2829,94 +2832,94 @@ const H4 = "anduin-tooltip:show", B2 = "anduin-tooltip:hide", V4 = "anduin-toolt
   "left-center",
   "left-end"
 ];
-function q5(l, e, t, i, o) {
+function Q5(r, e, t, i, o) {
   switch (i) {
     case "top-start":
-      return { left: l.left, top: l.top - t - o };
+      return { left: r.left, top: r.top - t - o };
     case "top-center":
-      return { left: l.left + l.width / 2 - e / 2, top: l.top - t - o };
+      return { left: r.left + r.width / 2 - e / 2, top: r.top - t - o };
     case "top-end":
-      return { left: l.left + l.width - e, top: l.top - t - o };
+      return { left: r.left + r.width - e, top: r.top - t - o };
     case "right-start":
-      return { left: l.right + o, top: l.top };
+      return { left: r.right + o, top: r.top };
     case "right-center":
-      return { left: l.right + o, top: l.top + l.height / 2 - t / 2 };
+      return { left: r.right + o, top: r.top + r.height / 2 - t / 2 };
     case "right-end":
-      return { left: l.right + o, top: l.top + l.height - t };
+      return { left: r.right + o, top: r.top + r.height - t };
     case "bottom-start":
-      return { left: l.left, top: l.bottom + o };
+      return { left: r.left, top: r.bottom + o };
     case "bottom-center":
-      return { left: l.left + l.width / 2 - e / 2, top: l.bottom + o };
+      return { left: r.left + r.width / 2 - e / 2, top: r.bottom + o };
     case "bottom-end":
-      return { left: l.left + l.width - e, top: l.bottom + o };
+      return { left: r.left + r.width - e, top: r.bottom + o };
     case "left-start":
-      return { left: l.left - e - o, top: l.top };
+      return { left: r.left - e - o, top: r.top };
     case "left-center":
-      return { left: l.left - e - o, top: l.top + l.height / 2 - t / 2 };
+      return { left: r.left - e - o, top: r.top + r.height / 2 - t / 2 };
     case "left-end":
-      return { left: l.left - e - o, top: l.top + l.height - t };
+      return { left: r.left - e - o, top: r.top + r.height - t };
     default:
       return { left: 0, top: 0 };
   }
 }
-function G5(l, e) {
-  return e.right >= l.left && e.left <= l.right && e.top <= l.bottom && e.bottom >= l.top;
+function e4(r, e) {
+  return e.right >= r.left && e.left <= r.right && e.top <= r.bottom && e.bottom >= r.top;
 }
-function W5(l, e) {
-  const t = Math.max(l.left, e.left), i = Math.max(l.top, e.top), o = Math.min(l.right, e.right), r = Math.min(l.bottom, e.bottom);
-  return o < t || r < i ? 0 : (o - t) * (r - i);
+function t4(r, e) {
+  const t = Math.max(r.left, e.left), i = Math.max(r.top, e.top), o = Math.min(r.right, e.right), l = Math.min(r.bottom, e.bottom);
+  return o < t || l < i ? 0 : (o - t) * (l - i);
 }
-function k3(l, e, t, i = 8) {
-  const o = window.innerWidth, r = window.innerHeight, n = { left: 0, top: 0, right: o, bottom: r }, s = e.width, d = e.height;
-  if (!G5(
-    { left: l.left, top: l.top, right: l.right, bottom: l.bottom },
+function D3(r, e, t, i = 8) {
+  const o = window.innerWidth, l = window.innerHeight, n = { left: 0, top: 0, right: o, bottom: l }, s = e.width, d = e.height;
+  if (!e4(
+    { left: r.left, top: r.top, right: r.right, bottom: r.bottom },
     n
   )) return null;
-  const p = q5(l, s, d, t, i), h = R3.map((f) => ({ p: f, off: q5(l, s, d, f, i) })).filter(({ off: f }) => G5({ left: f.left, top: f.top, right: f.left + s, bottom: f.top + d }, n));
+  const p = Q5(r, s, d, t, i), h = O3.map((f) => ({ p: f, off: Q5(r, s, d, f, i) })).filter(({ off: f }) => e4({ left: f.left, top: f.top, right: f.left + s, bottom: f.top + d }, n));
   if (h.length === 0)
     return {
       placement: t,
       left: Math.round(Math.min(Math.max(p.left, 0), o - s)),
-      top: Math.round(Math.min(Math.max(p.top, 0), r - d))
+      top: Math.round(Math.min(Math.max(p.top, 0), l - d))
     };
   h.sort((f, Z) => {
-    const q = { left: f.off.left, top: f.off.top, right: f.off.left + s, bottom: f.off.top + d }, x = { left: Z.off.left, top: Z.off.top, right: Z.off.left + s, bottom: Z.off.top + d }, D = W5(q, n), o1 = W5(x, n);
+    const G = { left: f.off.left, top: f.off.top, right: f.off.left + s, bottom: f.off.top + d }, x = { left: Z.off.left, top: Z.off.top, right: Z.off.left + s, bottom: Z.off.top + d }, D = t4(G, n), o1 = t4(x, n);
     if (o1 !== D) return o1 - D;
-    const j1 = Math.abs(f.off.left - p.left) + Math.abs(f.off.top - p.top), U1 = Math.abs(Z.off.left - p.left) + Math.abs(Z.off.top - p.top);
-    return j1 - U1;
+    const q1 = Math.abs(f.off.left - p.left) + Math.abs(f.off.top - p.top), W1 = Math.abs(Z.off.left - p.left) + Math.abs(Z.off.top - p.top);
+    return q1 - W1;
   });
   const { p: v, off: H } = h[0];
   return {
     placement: v,
     left: Math.round(Math.min(Math.max(H.left, 0), o - s)),
-    top: Math.round(Math.min(Math.max(H.top, 0), r - d))
+    top: Math.round(Math.min(Math.max(H.top, 0), l - d))
   };
 }
-function f2(l) {
-  return l.split("-")[0] || "top";
+function L2(r) {
+  return r.split("-")[0] || "top";
 }
-function $3(l, e, t) {
+function I3(r, e, t) {
   let i = !1, o = t.length - 1;
-  for (let r = 0; r < t.length; r++) {
-    const n = t[r][0], s = t[r][1], d = t[o][0], p = t[o][1];
-    s > e != p > e && l < (d - n) * (e - s) / (p - s) + n && (i = !i), o = r;
+  for (let l = 0; l < t.length; l++) {
+    const n = t[l][0], s = t[l][1], d = t[o][0], p = t[o][1];
+    s > e != p > e && r < (d - n) * (e - s) / (p - s) + n && (i = !i), o = l;
   }
   return i;
 }
-const d5 = class d5 extends u {
+const g5 = class g5 extends u {
   constructor() {
     super(...arguments), this.disabled = !1, this.placement = "top-center", this.triggerElement = null, this.contentPopupElement = null, this.containingBlockLeft = 0, this.containingBlockTop = 0, this.rafId = 0, this.prevTriggerTop = NaN, this.prevTriggerLeft = NaN, this.isVisible = !1;
   }
   connectedCallback() {
-    super.connectedCallback(), this.addEventListener(V4, (e) => {
+    super.connectedCallback(), this.addEventListener(w4, (e) => {
       e.stopPropagation(), this.triggerElement = e.detail, this.maybeStartPositionLoop();
-    }), this.addEventListener(L4, (e) => {
+    }), this.addEventListener(R4, (e) => {
       e.stopPropagation(), this.contentPopupElement = e.detail, this.computeContainingBlockOffset(this.contentPopupElement), this.maybeStartPositionLoop();
-    }), this.addEventListener(m4, (e) => {
+    }), this.addEventListener(k4, (e) => {
       e.stopPropagation(), this.stopPositionLoop(), this.contentPopupElement = null;
-    }), this.addEventListener(H4, (e) => {
+    }), this.addEventListener(x4, (e) => {
       e.stopPropagation(), !this.disabled && (this.isVisible = !0, this.broadcastVisibilityChanged(`show:${this.placement}`));
-    }), this.addEventListener(B2, (e) => {
+    }), this.addEventListener(D2, (e) => {
       e.stopPropagation(), this.isVisible = !1, this.stopPositionLoop(), this.broadcastVisibilityChanged("hide");
     });
   }
@@ -2932,8 +2935,8 @@ const d5 = class d5 extends u {
   startPositionLoop() {
     this.stopPositionLoop(), this.prevTriggerTop = NaN, this.prevTriggerLeft = NaN;
     const e = this.triggerElement, t = this.contentPopupElement, i = this.placement, o = () => {
-      const r = e.getBoundingClientRect();
-      (r.top !== this.prevTriggerTop || r.left !== this.prevTriggerLeft) && (this.prevTriggerTop = r.top, this.prevTriggerLeft = r.left, this.positionPopup(t, e, i)), this.rafId = requestAnimationFrame(o);
+      const l = e.getBoundingClientRect();
+      (l.top !== this.prevTriggerTop || l.left !== this.prevTriggerLeft) && (this.prevTriggerTop = l.top, this.prevTriggerLeft = l.left, this.positionPopup(t, e, i)), this.rafId = requestAnimationFrame(o);
     };
     this.rafId = requestAnimationFrame(o);
   }
@@ -2947,11 +2950,11 @@ const d5 = class d5 extends u {
     this.containingBlockLeft = o.left, this.containingBlockTop = o.top, t.style.transform = i;
   }
   positionPopup(e, t, i) {
-    const o = t.getBoundingClientRect(), r = e.getBoundingClientRect(), n = k3(o, r, i, 8);
+    const o = t.getBoundingClientRect(), l = e.getBoundingClientRect(), n = D3(o, l, i, 8);
     if (n) {
       const s = e;
       s.style.transform = `translate(${n.left - this.containingBlockLeft}px, ${n.top - this.containingBlockTop}px)`;
-      const d = f2(n.placement), p = f2(i);
+      const d = L2(n.placement), p = L2(i);
       if (d !== p) {
         const h = e.querySelector(".tooltip-arrow");
         h && (h.classList.remove(`tooltip-arrow--${p}`), h.classList.add(`tooltip-arrow--${d}`));
@@ -2959,49 +2962,49 @@ const d5 = class d5 extends u {
     }
   }
   broadcastVisibilityChanged(e) {
-    this.dispatchEvent(new CustomEvent(b4, { detail: e, bubbles: !1, composed: !1 }));
+    this.dispatchEvent(new CustomEvent($4, { detail: e, bubbles: !1, composed: !1 }));
   }
   render() {
     return C`<div class="tooltip-root" part="tooltip"><slot></slot></div>`;
   }
 };
-d5.styles = g`
+g5.styles = g`
     :host { display: inline-block; position: relative; max-width: 100%; font-family: var(--font-sans); }
     .tooltip-root { display: inline-block; position: relative; max-width: 100%; }
   `;
-let F1 = d5;
-f4([
+let I1 = g5;
+_4([
   a({ type: Boolean })
-], F1.prototype, "disabled");
-f4([
+], I1.prototype, "disabled");
+_4([
   a()
-], F1.prototype, "placement");
-const c5 = class c5 extends u {
+], I1.prototype, "placement");
+const v5 = class v5 extends u {
   firstUpdated() {
     requestAnimationFrame(() => {
-      this.dispatchEvent(new CustomEvent(V4, { detail: this, bubbles: !0, composed: !0 }));
+      this.dispatchEvent(new CustomEvent(w4, { detail: this, bubbles: !0, composed: !0 }));
     }), this.addEventListener("pointerenter", () => {
-      this.dispatchEvent(new CustomEvent(H4, { bubbles: !0, composed: !0 }));
+      this.dispatchEvent(new CustomEvent(x4, { bubbles: !0, composed: !0 }));
     }), this.addEventListener("click", () => {
-      this.dispatchEvent(new CustomEvent(B2, { bubbles: !0, composed: !0 }));
+      this.dispatchEvent(new CustomEvent(D2, { bubbles: !0, composed: !0 }));
     });
   }
   render() {
     return C`<span class="tooltip-trigger" part="tooltip-trigger"><slot></slot></span>`;
   }
 };
-c5.styles = g`
+v5.styles = g`
     :host { display: inline-block; max-width: 100%; font-family: var(--font-sans); }
     .tooltip-trigger { display: flex; align-items: center; max-width: 100%; }
   `;
-let H2 = c5;
-const p5 = class p5 extends u {
+let y2 = v5;
+const f5 = class f5 extends u {
   constructor() {
     super(...arguments), this.graceArea = null, this.triggerEl = null, this.popupEl = null, this.handlePointerMove = (e) => {
-      var r, n;
+      var l, n;
       if (!this.graceArea) return;
-      const t = e.target, i = ((r = this.triggerEl) == null ? void 0 : r.contains(t)) ?? !1, o = ((n = this.popupEl) == null ? void 0 : n.contains(t)) ?? !1;
-      i || o ? this.graceArea = null : $3(e.clientX, e.clientY, this.graceArea) || (this.graceArea = null, this.dispatchEvent(new CustomEvent(B2, { bubbles: !0, composed: !0 })));
+      const t = e.target, i = ((l = this.triggerEl) == null ? void 0 : l.contains(t)) ?? !1, o = ((n = this.popupEl) == null ? void 0 : n.contains(t)) ?? !1;
+      i || o ? this.graceArea = null : I3(e.clientX, e.clientY, this.graceArea) || (this.graceArea = null, this.dispatchEvent(new CustomEvent(D2, { bubbles: !0, composed: !0 })));
     }, this.handleTriggerLeave = (e) => {
       this.triggerEl && this.popupEl && this.createGraceArea(this.triggerEl, this.popupEl, e);
     }, this.handleContentLeave = (e) => {
@@ -3011,7 +3014,7 @@ const p5 = class p5 extends u {
   connectedCallback() {
     super.connectedCallback();
     const e = this.closest("anduin-tooltip");
-    e && e.addEventListener(b4, (t) => {
+    e && e.addEventListener($4, (t) => {
       const i = t.detail;
       i.startsWith("show:") ? this.showPopup(i.slice(5)) : this.hidePopup();
     });
@@ -3020,9 +3023,9 @@ const p5 = class p5 extends u {
     super.disconnectedCallback(), this.hidePopup();
   }
   createGraceArea(e, t, i) {
-    const o = t.getBoundingClientRect(), r = i.clientX, n = i.clientY;
+    const o = t.getBoundingClientRect(), l = i.clientX, n = i.clientY;
     this.graceArea = [
-      [r, n],
+      [l, n],
       [o.left, o.top],
       [o.right, o.top],
       [o.right, o.bottom],
@@ -3037,12 +3040,12 @@ const p5 = class p5 extends u {
   }
   showPopup(e) {
     this.hidePopup();
-    const t = f2(e), i = document.createElement("div");
+    const t = L2(e), i = document.createElement("div");
     i.className = "tooltip-popup", i.setAttribute("role", "tooltip");
     const o = document.createElement("div");
     o.className = `tooltip-arrow tooltip-arrow--${t}`;
-    const r = document.createElement("div");
-    r.className = "tooltip-body", r.appendChild(document.createElement("slot")), i.appendChild(o), i.appendChild(r);
+    const l = document.createElement("div");
+    l.className = "tooltip-body", l.appendChild(document.createElement("slot")), i.appendChild(o), i.appendChild(l);
     const n = this.shadowRoot.querySelector(".tooltip-content-wrapper");
     n && n.appendChild(i), this.popupEl = i;
     const s = this.closest("anduin-tooltip");
@@ -3050,16 +3053,16 @@ const p5 = class p5 extends u {
       const d = s.querySelector("anduin-tooltip-trigger");
       d && this.setupGraceAreaListeners(d, i);
     }
-    this.dispatchEvent(new CustomEvent(L4, { detail: i, bubbles: !0, composed: !0 }));
+    this.dispatchEvent(new CustomEvent(R4, { detail: i, bubbles: !0, composed: !0 }));
   }
   hidePopup() {
-    this.popupEl && (this.popupEl.remove(), this.popupEl = null, this.dispatchEvent(new CustomEvent(m4, { bubbles: !0, composed: !0 }))), this.cleanupGraceAreaListeners();
+    this.popupEl && (this.popupEl.remove(), this.popupEl = null, this.dispatchEvent(new CustomEvent(k4, { bubbles: !0, composed: !0 }))), this.cleanupGraceAreaListeners();
   }
   render() {
     return C`<div class="tooltip-content-wrapper"></div>`;
   }
 };
-p5.styles = g`
+f5.styles = g`
     :host {
       display: contents;
       --tooltip-bg: var(--anduin-tooltip-content-background, var(--color-gray-9));
@@ -3083,16 +3086,16 @@ p5.styles = g`
     .tooltip-arrow--left { right: -4px; top: 50%; transform: translateY(-50%); border-left-color: var(--tooltip-bg); border-right: none; }
     .tooltip-arrow--right { left: -4px; top: 50%; transform: translateY(-50%); border-right-color: var(--tooltip-bg); border-left: none; }
   `;
-let V2 = p5;
-customElements.get("anduin-tooltip") || customElements.define("anduin-tooltip", F1);
-customElements.get("anduin-tooltip-trigger") || customElements.define("anduin-tooltip-trigger", H2);
-customElements.get("anduin-tooltip-content") || customElements.define("anduin-tooltip-content", V2);
-var E3 = Object.defineProperty, A3 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && E3(e, t, o), o;
+let M2 = f5;
+customElements.get("anduin-tooltip") || customElements.define("anduin-tooltip", I1);
+customElements.get("anduin-tooltip-trigger") || customElements.define("anduin-tooltip-trigger", y2);
+customElements.get("anduin-tooltip-content") || customElements.define("anduin-tooltip-content", M2);
+var T3 = Object.defineProperty, N3 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && T3(e, t, o), o;
 };
-const z3 = "anduin-well-close:click", u5 = class u5 extends u {
+const j3 = "anduin-well-close:click", H5 = class H5 extends u {
   constructor() {
     super(...arguments), this.variant = "gray";
   }
@@ -3111,7 +3114,7 @@ const z3 = "anduin-well-close:click", u5 = class u5 extends u {
     `;
   }
 };
-u5.styles = g`
+H5.styles = g`
     :host {
       display: block;
       font-family: var(--font-sans);
@@ -3176,14 +3179,14 @@ u5.styles = g`
       color: var(--color-warning-4);
     }
   `;
-let t2 = u5;
-A3([
+let l2 = H5;
+N3([
   a()
-], t2.prototype, "variant");
-const h5 = class h5 extends u {
+], l2.prototype, "variant");
+const V5 = class V5 extends u {
   onClick() {
     this.dispatchEvent(
-      new CustomEvent(z3, { bubbles: !0, composed: !0 })
+      new CustomEvent(j3, { bubbles: !0, composed: !0 })
     );
   }
   render() {
@@ -3198,7 +3201,7 @@ const h5 = class h5 extends u {
     `;
   }
 };
-h5.styles = g`
+V5.styles = g`
     :host {
       display: inline-block;
       font-family: var(--font-sans);
@@ -3223,15 +3226,15 @@ h5.styles = g`
       background-color: var(--color-gray-3);
     }
   `;
-let L2 = h5;
-customElements.get("anduin-well") || customElements.define("anduin-well", t2);
-customElements.get("anduin-well-close") || customElements.define("anduin-well-close", L2);
-var B3 = Object.defineProperty, C1 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && B3(e, t, o), o;
+let Z2 = V5;
+customElements.get("anduin-well") || customElements.define("anduin-well", l2);
+customElements.get("anduin-well-close") || customElements.define("anduin-well-close", Z2);
+var U3 = Object.defineProperty, C1 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && U3(e, t, o), o;
 };
-const m2 = "anduin-popover:close", g5 = class g5 extends u {
+const _2 = "anduin-popover:close", m5 = class m5 extends u {
   constructor() {
     super(...arguments), this.open = !1, this.placement = "bottom-start", this.fullWidth = !1, this._visible = !1, this._closing = !1, this._closeTransitionEndHandler = null, this._onOutsideClick = (e) => {
       var t;
@@ -3246,10 +3249,10 @@ const m2 = "anduin-popover:close", g5 = class g5 extends u {
     this.open = !this.open;
   }
   connectedCallback() {
-    super.connectedCallback(), document.addEventListener("click", this._onOutsideClick), window.addEventListener("scroll", this._onScrollOrResize, { passive: !0, capture: !0 }), window.addEventListener("resize", this._onScrollOrResize), this.addEventListener(m2, this._onPopoverClose);
+    super.connectedCallback(), document.addEventListener("click", this._onOutsideClick), window.addEventListener("scroll", this._onScrollOrResize, { passive: !0, capture: !0 }), window.addEventListener("resize", this._onScrollOrResize), this.addEventListener(_2, this._onPopoverClose);
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), document.removeEventListener("click", this._onOutsideClick), window.removeEventListener("scroll", this._onScrollOrResize, { capture: !0 }), window.removeEventListener("resize", this._onScrollOrResize), this.removeEventListener(m2, this._onPopoverClose);
+    super.disconnectedCallback(), document.removeEventListener("click", this._onOutsideClick), window.removeEventListener("scroll", this._onScrollOrResize, { capture: !0 }), window.removeEventListener("resize", this._onScrollOrResize), this.removeEventListener(_2, this._onPopoverClose);
   }
   updated(e) {
     e.has("open") && (this.open ? (this._cancelCloseAnimation(), this._closing = !1, this._visible = !0, requestAnimationFrame(() => this._updatePosition())) : this._startCloseAnimation());
@@ -3274,14 +3277,14 @@ const m2 = "anduin-popover:close", g5 = class g5 extends u {
     if (!e || !t) return;
     const i = e.getBoundingClientRect(), o = t.style.transform;
     t.style.transform = "none";
-    const r = t.getBoundingClientRect();
+    const l = t.getBoundingClientRect();
     t.style.transform = o;
     const n = t.getBoundingClientRect(), s = 4, d = window.innerWidth, p = window.innerHeight, h = 8;
     let v = 0, H = 0, f = "bottom";
-    const Z = !this.placement.startsWith("top"), q = p - i.bottom - s, x = i.top - s, D = q >= n.height, o1 = x >= n.height, j1 = Z ? D || q >= x : !o1 && D;
-    f = j1 ? "bottom" : "top", H = j1 ? i.bottom + s : i.top - n.height - s;
-    const U1 = this.placement.endsWith("end") ? "end" : this.placement.endsWith("start") ? "start" : "center";
-    U1 === "start" ? v = i.left : U1 === "end" ? v = i.right - n.width : v = i.left + i.width / 2 - n.width / 2, v = Math.max(h, Math.min(v, d - n.width - h)), H = Math.max(h, Math.min(H, p - n.height - h)), t.style.transform = `translate(${Math.round(v - r.left)}px, ${Math.round(H - r.top)}px)`, t.dataset.side = f;
+    const Z = !this.placement.startsWith("top"), G = p - i.bottom - s, x = i.top - s, D = G >= n.height, o1 = x >= n.height, q1 = Z ? D || G >= x : !o1 && D;
+    f = q1 ? "bottom" : "top", H = q1 ? i.bottom + s : i.top - n.height - s;
+    const W1 = this.placement.endsWith("end") ? "end" : this.placement.endsWith("start") ? "start" : "center";
+    W1 === "start" ? v = i.left : W1 === "end" ? v = i.right - n.width : v = i.left + i.width / 2 - n.width / 2, v = Math.max(h, Math.min(v, d - n.width - h)), H = Math.max(h, Math.min(H, p - n.height - h)), t.style.transform = `translate(${Math.round(v - l.left)}px, ${Math.round(H - l.top)}px)`, t.dataset.side = f;
   }
   render() {
     return C`
@@ -3296,7 +3299,7 @@ const m2 = "anduin-popover:close", g5 = class g5 extends u {
     `;
   }
 };
-g5.styles = g`
+m5.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     :host([full-width]) { display: block; width: 100%; }
@@ -3349,7 +3352,7 @@ g5.styles = g`
       transform: none;
     }
   `;
-let F = g5;
+let F = m5;
 C1([
   a({ type: Boolean, reflect: !0 })
 ], F.prototype, "open");
@@ -3360,10 +3363,10 @@ C1([
   a({ type: Boolean, attribute: "full-width", reflect: !0 })
 ], F.prototype, "fullWidth");
 C1([
-  b()
+  m()
 ], F.prototype, "_visible");
 C1([
-  b()
+  m()
 ], F.prototype, "_closing");
 C1([
   k(".popover__trigger")
@@ -3372,23 +3375,23 @@ C1([
   k(".popover__panel")
 ], F.prototype, "_panelEl");
 customElements.get("anduin-popover") || customElements.define("anduin-popover", F);
-const v5 = class v5 extends u {
+const b5 = class b5 extends u {
   _onClick() {
-    this.dispatchEvent(new CustomEvent(m2, { bubbles: !0, composed: !0 }));
+    this.dispatchEvent(new CustomEvent(_2, { bubbles: !0, composed: !0 }));
   }
   render() {
     return C`<span @click=${this._onClick}><slot></slot></span>`;
   }
 };
-v5.styles = g`:host { display: contents; }`;
-let b2 = v5;
-customElements.get("anduin-popover-close") || customElements.define("anduin-popover-close", b2);
-var S3 = Object.defineProperty, d1 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && S3(e, t, o), o;
+b5.styles = g`:host { display: contents; }`;
+let x2 = b5;
+customElements.get("anduin-popover-close") || customElements.define("anduin-popover-close", x2);
+var G3 = Object.defineProperty, d1 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && G3(e, t, o), o;
 };
-const y2 = "anduin-menu-item:click", f5 = class f5 extends u {
+const w2 = "anduin-menu-item:click", L5 = class L5 extends u {
   constructor() {
     super(...arguments), this.open = !1, this.placement = "bottom-start", this._onOutsideClick = (e) => {
       var t;
@@ -3403,10 +3406,10 @@ const y2 = "anduin-menu-item:click", f5 = class f5 extends u {
     this.open = !this.open;
   }
   connectedCallback() {
-    super.connectedCallback(), document.addEventListener("click", this._onOutsideClick), this.addEventListener(y2, this._onItemClick), window.addEventListener("scroll", this._onScrollOrResize, { passive: !0, capture: !0 }), window.addEventListener("resize", this._onScrollOrResize);
+    super.connectedCallback(), document.addEventListener("click", this._onOutsideClick), this.addEventListener(w2, this._onItemClick), window.addEventListener("scroll", this._onScrollOrResize, { passive: !0, capture: !0 }), window.addEventListener("resize", this._onScrollOrResize);
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), document.removeEventListener("click", this._onOutsideClick), this.removeEventListener(y2, this._onItemClick), window.removeEventListener("scroll", this._onScrollOrResize, { capture: !0 }), window.removeEventListener("resize", this._onScrollOrResize);
+    super.disconnectedCallback(), document.removeEventListener("click", this._onOutsideClick), this.removeEventListener(w2, this._onItemClick), window.removeEventListener("scroll", this._onScrollOrResize, { capture: !0 }), window.removeEventListener("resize", this._onScrollOrResize);
   }
   updated(e) {
     e.has("open") && this.open && requestAnimationFrame(() => this._updatePosition());
@@ -3416,7 +3419,7 @@ const y2 = "anduin-menu-item:click", f5 = class f5 extends u {
     if (!e || !t) return;
     const i = e.getBoundingClientRect(), o = t.style.transform;
     t.style.transform = "none";
-    const r = t.getBoundingClientRect();
+    const l = t.getBoundingClientRect();
     t.style.transform = o;
     const n = t.getBoundingClientRect(), s = 4;
     let d = 0, p = 0, h = "bottom";
@@ -3440,7 +3443,7 @@ const y2 = "anduin-menu-item:click", f5 = class f5 extends u {
         d = i.left + i.width / 2 - n.width / 2, p = i.top - n.height - s, h = "top";
         break;
     }
-    t.style.transform = `translate(${Math.round(d - r.left)}px, ${Math.round(p - r.top)}px)`, t.dataset.side = h;
+    t.style.transform = `translate(${Math.round(d - l.left)}px, ${Math.round(p - l.top)}px)`, t.dataset.side = h;
   }
   render() {
     return C`
@@ -3455,7 +3458,7 @@ const y2 = "anduin-menu-item:click", f5 = class f5 extends u {
     `;
   }
 };
-f5.styles = g`
+L5.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     .menu__trigger { display: inline-block; }
@@ -3498,7 +3501,7 @@ f5.styles = g`
       transform: scale(1) translateY(0);
     }
   `;
-let s1 = f5;
+let s1 = L5;
 d1([
   a({ type: Boolean, reflect: !0 })
 ], s1.prototype, "open");
@@ -3511,12 +3514,12 @@ d1([
 d1([
   k(".menu__panel")
 ], s1.prototype, "_panelEl");
-const H5 = class H5 extends u {
+const y5 = class y5 extends u {
   constructor() {
     super(...arguments), this.icon = "", this.variant = "default", this.disabled = !1;
   }
   _onClick() {
-    this.dispatchEvent(new CustomEvent(y2, { bubbles: !0, composed: !0 }));
+    this.dispatchEvent(new CustomEvent(w2, { bubbles: !0, composed: !0 }));
   }
   render() {
     return C`
@@ -3533,7 +3536,7 @@ const H5 = class H5 extends u {
     `;
   }
 };
-H5.styles = g`
+y5.styles = g`
     :host { display: block; width: 100%; font-family: var(--font-sans); }
     .menu-item {
       display: flex;
@@ -3563,24 +3566,24 @@ H5.styles = g`
     anduin-icon { color: var(--color-gray-7); }
     .menu-item--danger anduin-icon { color: var(--color-danger-4); }
   `;
-let H1 = H5;
+let V1 = y5;
 d1([
   a()
-], H1.prototype, "icon");
+], V1.prototype, "icon");
 d1([
   a()
-], H1.prototype, "variant");
+], V1.prototype, "variant");
 d1([
   a({ type: Boolean })
-], H1.prototype, "disabled");
+], V1.prototype, "disabled");
 customElements.get("anduin-menu") || customElements.define("anduin-menu", s1);
-customElements.get("anduin-menu-item") || customElements.define("anduin-menu-item", H1);
-var P3 = Object.defineProperty, c1 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && P3(e, t, o), o;
+customElements.get("anduin-menu-item") || customElements.define("anduin-menu-item", V1);
+var q3 = Object.defineProperty, c1 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && q3(e, t, o), o;
 };
-const y1 = "anduin-close", F3 = "anduin-after-close", s2 = 300, C2 = 200, Y5 = 250;
+const _1 = "anduin-close", W3 = "anduin-after-close", u2 = 300, h2 = 200, o4 = 250;
 var Y;
 const e1 = (Y = class extends u {
   constructor() {
@@ -3596,13 +3599,13 @@ const e1 = (Y = class extends u {
     e.has("open") && (this.open ? (this._leaving = !1, this.classList.add("is-shown")) : this.classList.contains("is-shown") && (this._leaving = !0, setTimeout(
       () => {
         this._leaving = !1, this.classList.remove("is-shown"), this.dispatchEvent(
-          new CustomEvent(F3, {
+          new CustomEvent(W3, {
             bubbles: !0,
             composed: !0
           })
         );
       },
-      Math.max(C2, Y5)
+      Math.max(h2, o4)
     )));
   }
   dispatch(e) {
@@ -3611,16 +3614,16 @@ const e1 = (Y = class extends u {
     );
   }
   onOverlayClick() {
-    this.dispatch(y1);
+    this.dispatch(_1);
   }
   onClose() {
-    this.dispatch(y1);
+    this.dispatch(_1);
   }
   connectedCallback() {
-    super.connectedCallback(), this.addEventListener(y1, this.onAnduinClose);
+    super.connectedCallback(), this.addEventListener(_1, this.onAnduinClose);
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener(y1, this.onAnduinClose);
+    super.disconnectedCallback(), this.removeEventListener(_1, this.onAnduinClose);
   }
   render() {
     const e = this._leaving, t = this.fullscreen;
@@ -3734,11 +3737,11 @@ const e1 = (Y = class extends u {
       inset: 0;
       background: rgba(50, 60, 77, 0.6);
       cursor: default;
-      animation: overlayIn ${s2}ms cubic-bezier(0.2, 0, 0, 1)
+      animation: overlayIn ${u2}ms cubic-bezier(0.2, 0, 0, 1)
         forwards;
     }
     .overlay.is-leaving {
-      animation: overlayOut ${Y5}ms
+      animation: overlayOut ${o4}ms
         cubic-bezier(0.3, 0, 0.8, 0.15) forwards;
     }
     .modal-wrapper {
@@ -3764,11 +3767,11 @@ const e1 = (Y = class extends u {
         0 8px 24px 0 rgba(29, 41, 57, 0.12),
         0 2px 8px 0 rgba(29, 41, 57, 0.08);
       flex-shrink: 0;
-      animation: modalIn ${s2}ms cubic-bezier(0.05, 0.7, 0.1, 1)
+      animation: modalIn ${u2}ms cubic-bezier(0.05, 0.7, 0.1, 1)
         forwards;
     }
     .modal.is-leaving {
-      animation: modalOut ${C2}ms
+      animation: modalOut ${h2}ms
         cubic-bezier(0.3, 0, 0.8, 0.15) forwards;
     }
     .modal-wrapper--fullscreen {
@@ -3798,11 +3801,11 @@ const e1 = (Y = class extends u {
       max-height: 100%;
       height: 100%;
       box-shadow: none;
-      animation: modalFullscreenIn ${s2}ms
+      animation: modalFullscreenIn ${u2}ms
         cubic-bezier(0.05, 0.7, 0.1, 1) forwards;
     }
     .modal--fullscreen.is-leaving {
-      animation: modalFullscreenOut ${C2}ms
+      animation: modalFullscreenOut ${h2}ms
         cubic-bezier(0.3, 0, 0.8, 0.15) forwards;
     }
     .header {
@@ -3874,15 +3877,15 @@ c1([
   a({ type: Boolean })
 ], e1.prototype, "fullscreen");
 c1([
-  b()
+  m()
 ], e1.prototype, "_leaving");
-let O3 = e1;
-customElements.get("anduin-modal") || customElements.define("anduin-modal", O3);
-class D3 extends HTMLElement {
+let Y3 = e1;
+customElements.get("anduin-modal") || customElements.define("anduin-modal", Y3);
+class X3 extends HTMLElement {
   constructor() {
     super(...arguments), this._onClick = () => {
       this.dispatchEvent(
-        new CustomEvent(y1, { bubbles: !0, composed: !0 })
+        new CustomEvent(_1, { bubbles: !0, composed: !0 })
       );
     };
   }
@@ -3893,26 +3896,26 @@ class D3 extends HTMLElement {
     this.removeEventListener("click", this._onClick);
   }
 }
-customElements.get("anduin-modal-close") || customElements.define("anduin-modal-close", D3);
-var I3 = Object.defineProperty, U = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && I3(e, t, o), o;
+customElements.get("anduin-modal-close") || customElements.define("anduin-modal-close", X3);
+var K3 = Object.defineProperty, U = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && K3(e, t, o), o;
 };
-const M2 = "anduin-radio:change", T3 = "anduin-radio-group:change", V5 = class V5 extends u {
+const R2 = "anduin-radio:change", J3 = "anduin-radio-group:change", M5 = class M5 extends u {
   constructor() {
     super(...arguments), this.checked = !1, this.disabled = !1, this.readonly = !1, this.value = "", this.name = "", this.inputid = "";
   }
   connectedCallback() {
     super.connectedCallback();
     const e = this.closest("anduin-field");
-    e && e.addEventListener(m1, (t) => {
+    e && e.addEventListener(M1, (t) => {
       const i = t;
       this.inputid && this.inputid === i.detail && !this.disabled && !this.readonly && this._select();
     });
   }
   _select() {
-    this.checked || (this.checked = !0, this.dispatchEvent(new CustomEvent(M2, {
+    this.checked || (this.checked = !0, this.dispatchEvent(new CustomEvent(R2, {
       detail: this.value,
       bubbles: !0,
       composed: !0
@@ -3953,7 +3956,7 @@ const M2 = "anduin-radio:change", T3 = "anduin-radio-group:change", V5 = class V
     `;
   }
 };
-V5.styles = g`
+M5.styles = g`
     :host { display: inline-flex; font-family: var(--font-sans); }
     label {
@@ -4024,7 +4027,7 @@ V5.styles = g`
       transform: scale(1);
     }
   `;
-let N = V5;
+let N = M5;
 U([
   a({ type: Boolean })
 ], N.prototype, "checked");
@@ -4044,14 +4047,14 @@ U([
   a()
 ], N.prototype, "inputid");
 customElements.get("anduin-radio") || customElements.define("anduin-radio", N);
-const L5 = class L5 extends u {
+const Z5 = class Z5 extends u {
   constructor() {
     super(...arguments), this.value = "", this.name = "", this.orientation = "vertical", this._onRadioChange = (e) => {
       const i = e.detail;
       i !== this.value && (this.value = i, this.querySelectorAll("anduin-radio").forEach((o) => {
-        const r = o;
-        r.checked = r.value === i;
-      }), this.dispatchEvent(new CustomEvent(T3, {
+        const l = o;
+        l.checked = l.value === i;
+      }), this.dispatchEvent(new CustomEvent(J3, {
         detail: i,
         bubbles: !0,
         composed: !0
@@ -4059,10 +4062,10 @@ const L5 = class L5 extends u {
     };
   }
   connectedCallback() {
-    super.connectedCallback(), this.addEventListener(M2, this._onRadioChange);
+    super.connectedCallback(), this.addEventListener(R2, this._onRadioChange);
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener(M2, this._onRadioChange);
+    super.disconnectedCallback(), this.removeEventListener(R2, this._onRadioChange);
   }
   render() {
     return C`
@@ -4072,7 +4075,7 @@ const L5 = class L5 extends u {
     `;
   }
 };
-L5.styles = g`
+Z5.styles = g`
     :host { display: block; font-family: var(--font-sans); }
     .group {
@@ -4082,23 +4085,23 @@ L5.styles = g`
     .group--vertical   { flex-direction: column; }
     .group--horizontal { flex-direction: row; flex-wrap: wrap; align-items: center; }
   `;
-let V1 = L5;
+let m1 = Z5;
 U([
   a()
-], V1.prototype, "value");
+], m1.prototype, "value");
 U([
   a()
-], V1.prototype, "name");
+], m1.prototype, "name");
 U([
   a()
-], V1.prototype, "orientation");
-customElements.get("anduin-radio-group") || customElements.define("anduin-radio-group", V1);
-var N3 = Object.defineProperty, p1 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && N3(e, t, o), o;
+], m1.prototype, "orientation");
+customElements.get("anduin-radio-group") || customElements.define("anduin-radio-group", m1);
+var Q3 = Object.defineProperty, p1 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && Q3(e, t, o), o;
 };
-const X5 = [
+const i4 = [
   { bg: "#6172F3", text: "#ffffff" },
   { bg: "#B692F6", text: "#ffffff" },
   { bg: "#F670C7", text: "#ffffff" },
@@ -4108,17 +4111,17 @@ const X5 = [
   { bg: "#F97066", text: "#ffffff" },
   { bg: "#7A5AF8", text: "#ffffff" }
 ];
-function j3(l) {
+function e7(r) {
   let e = 0;
-  for (let t = 0; t < l.length; t++) e = e * 31 + l.charCodeAt(t) >>> 0;
-  return X5[e % X5.length];
+  for (let t = 0; t < r.length; t++) e = e * 31 + r.charCodeAt(t) >>> 0;
+  return i4[e % i4.length];
 }
-function U3(l) {
+function t7(r) {
   var t;
-  const e = l.trim().split(/\s+/);
+  const e = r.trim().split(/\s+/);
   return e.length === 1 ? ((t = e[0][0]) == null ? void 0 : t.toUpperCase()) ?? "" : ((e[0][0] ?? "") + (e[e.length - 1][0] ?? "")).toUpperCase();
 }
-const m5 = class m5 extends u {
+const _5 = class _5 extends u {
   constructor() {
     super(...arguments), this.src = "", this.name = "", this.alt = "", this.icon = "", this.size = 32, this.shape = "circle", this._imgError = !1;
   }
@@ -4129,7 +4132,7 @@ const m5 = class m5 extends u {
     return this.size <= 16 ? 10 : this.size <= 20 ? 12 : this.size <= 24 ? 14 : 18;
   }
   render() {
-    const e = !!this.src && !this._imgError, t = this.name || this.icon ? j3(this.name || this.icon) : { bg: "#F2F4F7", text: "#667085" }, i = this.name ? U3(this.name) : "";
+    const e = !!this.src && !this._imgError, t = this.name || this.icon ? e7(this.name || this.icon) : { bg: "#F2F4F7", text: "#667085" }, i = this.name ? t7(this.name) : "";
     return C`
       <div
         class="avatar avatar--${this.shape} avatar--${this.size}"
@@ -4147,7 +4150,7 @@ const m5 = class m5 extends u {
     `;
   }
 };
-m5.styles = g`
+_5.styles = g`
     :host { display: inline-flex; }
     .avatar {
@@ -4176,12 +4179,12 @@ m5.styles = g`
       display: block;
     }
   `;
-let O = m5;
+let O = _5;
 p1([
   a()
 ], O.prototype, "src");
 p1([
-  a()
+  a({ reflect: !0 })
 ], O.prototype, "name");
 p1([
   a()
@@ -4196,7 +4199,7 @@ p1([
   a()
 ], O.prototype, "shape");
 p1([
-  b()
+  m()
 ], O.prototype, "_imgError");
 customElements.get("anduin-avatar") || customElements.define("anduin-avatar", O);
 /**
@@ -4204,8 +4207,8 @@ customElements.get("anduin-avatar") || customElements.define("anduin-avatar", O)
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const q3 = { CHILD: 2 }, G3 = (l) => (...e) => ({ _$litDirective$: l, values: e });
-class W3 {
+const o7 = { CHILD: 2 }, i7 = (r) => (...e) => ({ _$litDirective$: r, values: e });
+class l7 {
   constructor(e) {
   }
   get _$AU() {
@@ -4226,9 +4229,9 @@ class W3 {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-class Z2 extends W3 {
+class k2 extends l7 {
   constructor(e) {
-    if (super(e), this.it = c, e.type !== q3.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
+    if (super(e), this.it = c, e.type !== o7.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
   }
   render(e) {
     if (e === c || e == null) return this._t = void 0, this.it = e;
@@ -4240,16 +4243,16 @@ class Z2 extends W3 {
     return t.raw = t, this._t = { _$litType$: this.constructor.resultType, strings: t, values: [] };
   }
 }
-Z2.directiveName = "unsafeHTML", Z2.resultType = 1;
+k2.directiveName = "unsafeHTML", k2.resultType = 1;
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-class _2 extends Z2 {
+class $2 extends k2 {
 }
-_2.directiveName = "unsafeSVG", _2.resultType = 2;
-const Y3 = G3(_2), X3 = {
+$2.directiveName = "unsafeSVG", $2.resultType = 2;
+const r7 = i7($2), n7 = {
   archive: {
     16: { viewBox: "0 0 16 16", paths: `<path d="M2 1.5C2 0.671573 2.67157 0 3.5 0H9.17157C9.70201 0 10.2107 0.210714 10.5858 0.585786L13.4142 3.41421C13.7893 3.78929 14 4.29799 14 4.82843V14.5C14 15.3284 13.3284 16 12.5 16H3.5C2.67157 16 2 15.3284 2 14.5V1.5Z" fill="white"/>
 <path fill-rule="evenodd" clip-rule="evenodd" d="M13 5.5C13 5.22386 12.7761 5 12.5 5H9.5C9.22386 5 9 4.77614 9 4.5V1.5C9 1.22386 8.77614 1 8.5 1H6H3.5C3.22386 1 3 1.22386 3 1.5V14.5C3 14.7761 3.22386 15 3.5 15H12.5C12.7761 15 13 14.7761 13 14.5V8V5.5ZM14 8V14.5C14 15.3284 13.3284 16 12.5 16H3.5C2.67157 16 2 15.3284 2 14.5V1.5C2 0.671573 2.67157 0 3.5 0H6H9.17157C9.70201 0 10.2107 0.210714 10.5858 0.585786L13.4142 3.41421C13.7893 3.78929 14 4.29799 14 4.82843V8Z" fill="#CCD2DB"/>
@@ -4493,26 +4496,26 @@ const Y3 = G3(_2), X3 = {
 <path fill-rule="evenodd" clip-rule="evenodd" d="M6 2H18.5H18.5147C18.8078 2 19.0982 2.02573 19.3829 2.07593C19.7452 2.22622 20 2.58335 20 3V8C20 8.55228 20.4477 9 21 9H26C26.4166 9 26.7738 9.25482 26.9241 9.6171C26.9743 9.90183 27 10.1922 27 10.4853V29C27 29.5523 26.5523 30 26 30H6C5.44772 30 5 29.5523 5 29V3C5 2.44772 5.44772 2 6 2ZM27.9804 10C27.9934 10.1608 28 10.3227 28 10.4853V29C28 30.1046 27.1046 31 26 31H6C4.89543 31 4 30.1046 4 29V3C4 1.89543 4.89543 1 6 1H18.5H18.5147C20.0951 1 21.6113 1.62353 22.7342 2.73435C22.742 2.742 22.7497 2.74967 22.7574 2.75736L26.2426 6.24264L26.5858 6.58579C27.4913 7.49129 28 8.71942 28 10H27.9804Z" fill="#AADAF9"/>
 <path d="M18.875 21.5385L20.3324 13.4117C20.3751 13.1734 20.5825 13 20.8246 13H22.1261C22.4436 13 22.6808 13.2921 22.6154 13.6029L20.3023 24.6029C20.2536 24.8343 20.0494 25 19.813 25H18.2572C18.0243 25 17.8223 24.8393 17.77 24.6124L16.0078 16.9725L14.2457 24.6124C14.1933 24.8393 13.9913 25 13.7584 25H12.2027C11.9662 25 11.762 24.8343 11.7134 24.6029L9.40022 13.6029C9.33487 13.2921 9.57198 13 9.88952 13H11.1916C11.4335 13 11.6406 13.1731 11.6836 13.4111L13.1484 21.522L14.9371 13.3926C14.9875 13.1633 15.1906 13 15.4254 13H16.6053C16.8403 13 17.0436 13.1636 17.0938 13.3932L18.875 21.5385Z" fill="#1075DC"/>` }
   }
-}, K3 = [32, 24, 16];
-function J3(l, e) {
-  const t = X3[l];
+}, a7 = [32, 24, 16];
+function s7(r, e) {
+  const t = n7[r];
   if (!t) return null;
   if (t[e]) return t[e];
-  for (const i of K3)
+  for (const i of a7)
     if (t[i]) return t[i];
   return null;
 }
-var Q3 = Object.defineProperty, y4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && Q3(e, t, o), o;
+var C7 = Object.defineProperty, E4 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && C7(e, t, o), o;
 };
-const b5 = class b5 extends u {
+const x5 = class x5 extends u {
   constructor() {
     super(...arguments), this.type = "pdf", this.size = 32;
   }
   render() {
-    const e = J3(this.type, this.size);
+    const e = s7(this.type, this.size);
     return e ? C`
       <svg
         width=${this.size}
@@ -4523,35 +4526,35 @@ const b5 = class b5 extends u {
         aria-label="${this.type} file"
         role="img"
       >
-        ${Y3(e.paths)}
+        ${r7(e.paths)}
       </svg>
     ` : c;
   }
 };
-b5.styles = g`
+x5.styles = g`
     :host { display: inline-flex; align-items: center; justify-content: center; }
     svg { display: block; }
   `;
-let O1 = b5;
-y4([
+let T1 = x5;
+E4([
   a()
-], O1.prototype, "type");
-y4([
+], T1.prototype, "type");
+E4([
   a({ type: Number })
-], O1.prototype, "size");
-customElements.get("anduin-file-icon") || customElements.define("anduin-file-icon", O1);
-var e7 = Object.defineProperty, u1 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && e7(e, t, o), o;
+], T1.prototype, "size");
+customElements.get("anduin-file-icon") || customElements.define("anduin-file-icon", T1);
+var d7 = Object.defineProperty, u1 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && d7(e, t, o), o;
 };
-const K5 = {
+const l4 = {
   gray: "info",
   primary: "infoCircleLine",
   success: "checkCircle",
   warning: "warning",
   danger: "error"
-}, t7 = "anduin-toast:dismiss", y5 = class y5 extends u {
+}, c7 = "anduin-toast:dismiss", w5 = class w5 extends u {
   constructor() {
     super(...arguments), this.variant = "gray", this.heading = "", this.description = "", this._dismissing = !1;
   }
@@ -4562,7 +4565,7 @@ const K5 = {
     const e = (i) => {
       var o;
       i.propertyName === "opacity" && ((o = this._toastEl) == null || o.removeEventListener("transitionend", e), this.dispatchEvent(
-        new CustomEvent(t7, { bubbles: !0, composed: !0 })
+        new CustomEvent(c7, { bubbles: !0, composed: !0 })
       ));
     };
     (t = this._toastEl) == null || t.addEventListener("transitionend", e);
@@ -4571,7 +4574,7 @@ const K5 = {
     this.dismiss();
   }
   render() {
-    const e = K5[this.variant] ?? K5.gray;
+    const e = l4[this.variant] ?? l4.gray;
     return C`
       <div
         class="toast toast--${this.variant} ${this._dismissing ? "toast--dismissing" : ""}"
@@ -4597,7 +4600,7 @@ const K5 = {
     `;
   }
 };
-y5.styles = g`
+w5.styles = g`
     :host {
       display: block;
       font-family: var(--font-sans);
@@ -4725,7 +4728,7 @@ y5.styles = g`
       background: var(--color-gray-3, #d0d5dd);
     }
   `;
-let K = y5;
+let K = w5;
 u1([
   a()
 ], K.prototype, "variant");
@@ -4736,13 +4739,13 @@ u1([
   a()
 ], K.prototype, "description");
 u1([
-  b()
+  m()
 ], K.prototype, "_dismissing");
 u1([
   k(".toast")
 ], K.prototype, "_toastEl");
 customElements.get("anduin-toast") || customElements.define("anduin-toast", K);
-const M5 = class M5 extends u {
+const R5 = class R5 extends u {
   constructor() {
     super(...arguments), this.position = "bottom-left", this._toasts = [], this._nextId = 0;
   }
@@ -4786,7 +4789,7 @@ const M5 = class M5 extends u {
     `;
   }
 };
-M5.styles = g`
+R5.styles = g`
     :host {
       display: contents;
       pointer-events: none;
@@ -4833,50 +4836,50 @@ M5.styles = g`
       align-items: flex-end;
     }
   `;
-let D1 = M5;
+let N1 = R5;
 u1([
   a()
-], D1.prototype, "position");
+], N1.prototype, "position");
 u1([
-  b()
-], D1.prototype, "_toasts");
-customElements.get("anduin-toaster") || customElements.define("anduin-toaster", D1);
-const V7 = {
-  show(l) {
-    return o7(l.position).show(l);
+  m()
+], N1.prototype, "_toasts");
+customElements.get("anduin-toaster") || customElements.define("anduin-toaster", N1);
+const $7 = {
+  show(r) {
+    return p7(r.position).show(r);
   },
-  success(l, e, t) {
-    return this.show({ ...t, variant: "success", heading: l, description: e });
+  success(r, e, t) {
+    return this.show({ ...t, variant: "success", heading: r, description: e });
   },
-  danger(l, e, t) {
-    return this.show({ ...t, variant: "danger", heading: l, description: e });
+  danger(r, e, t) {
+    return this.show({ ...t, variant: "danger", heading: r, description: e });
   },
-  warning(l, e, t) {
-    return this.show({ ...t, variant: "warning", heading: l, description: e });
+  warning(r, e, t) {
+    return this.show({ ...t, variant: "warning", heading: r, description: e });
   },
-  primary(l, e, t) {
-    return this.show({ ...t, variant: "primary", heading: l, description: e });
+  primary(r, e, t) {
+    return this.show({ ...t, variant: "primary", heading: r, description: e });
   },
-  gray(l, e, t) {
-    return this.show({ ...t, variant: "gray", heading: l, description: e });
+  gray(r, e, t) {
+    return this.show({ ...t, variant: "gray", heading: r, description: e });
   }
-}, d2 = /* @__PURE__ */ new Map();
-function o7(l = "bottom-left") {
-  if (d2.has(l)) return d2.get(l);
+}, g2 = /* @__PURE__ */ new Map();
+function p7(r = "bottom-left") {
+  if (g2.has(r)) return g2.get(r);
   const e = document.createElement("anduin-toaster");
-  return e.position = l, document.body.appendChild(e), d2.set(l, e), e;
+  return e.position = r, document.body.appendChild(e), g2.set(r, e), e;
 }
-var i7 = Object.defineProperty, M4 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && i7(e, t, o), o;
+var u7 = Object.defineProperty, z4 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && u7(e, t, o), o;
 };
-const l7 = "anduin-switcher:change", Z5 = class Z5 extends u {
+const h7 = "anduin-switcher:change", k5 = class k5 extends u {
   constructor() {
     super(...arguments), this.checked = !1, this.disabled = !1;
   }
   onChange() {
-    this.checked = !this.checked, this.dispatchEvent(new CustomEvent(l7, {
+    this.checked = !this.checked, this.dispatchEvent(new CustomEvent(h7, {
       detail: this.checked,
       bubbles: !0,
       composed: !0
@@ -4900,7 +4903,7 @@ const l7 = "anduin-switcher:change", Z5 = class Z5 extends u {
     `;
   }
 };
-Z5.styles = g`
+k5.styles = g`
     :host { display: inline-flex; font-family: var(--font-sans); }
     label {
@@ -4964,20 +4967,20 @@ Z5.styles = g`
       line-height: 20px;
     }
   `;
-let I1 = Z5;
-M4([
+let j1 = k5;
+z4([
   a({ type: Boolean })
-], I1.prototype, "checked");
-M4([
+], j1.prototype, "checked");
+z4([
   a({ type: Boolean })
-], I1.prototype, "disabled");
-customElements.get("anduin-switcher") || customElements.define("anduin-switcher", I1);
-var r7 = Object.defineProperty, M = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && r7(e, t, o), o;
+], j1.prototype, "disabled");
+customElements.get("anduin-switcher") || customElements.define("anduin-switcher", j1);
+var g7 = Object.defineProperty, M = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && g7(e, t, o), o;
 };
-const J5 = "anduin-dropdown:change", _5 = class _5 extends u {
+const r4 = "anduin-dropdown:change", $5 = class $5 extends u {
   constructor() {
     super(...arguments), this.value = "", this.placeholder = "Select...", this.options = [], this.icon = "", this.searchable = !0, this.disabled = !1, this.placement = "bottom-start", this.appearance = "filled", this.variant = "gray0", this.size = "default", this.fullWidth = !1, this._open = !1, this._query = "", this._onOutsideClick = (e) => {
       var t;
@@ -5009,14 +5012,14 @@ const J5 = "anduin-dropdown:change", _5 = class _5 extends u {
     e.key === "Escape" && (this._open = !1, this._query = "", (t = this._triggerEl) == null || t.focus());
   }
   _onClear(e) {
-    e.stopPropagation(), this.value = "", this.dispatchEvent(new CustomEvent(J5, {
+    e.stopPropagation(), this.value = "", this.dispatchEvent(new CustomEvent(r4, {
       detail: "",
       bubbles: !0,
       composed: !0
     }));
   }
   _selectOption(e) {
-    this.value = e.value, this._open = !1, this._query = "", this.dispatchEvent(new CustomEvent(J5, {
+    this.value = e.value, this._open = !1, this._query = "", this.dispatchEvent(new CustomEvent(r4, {
       detail: e.value,
       bubbles: !0,
       composed: !0
@@ -5027,15 +5030,15 @@ const J5 = "anduin-dropdown:change", _5 = class _5 extends u {
     if (!e || !t) return;
     const i = e.getBoundingClientRect(), o = t.style.transform;
     t.style.transform = "none";
-    const r = t.getBoundingClientRect();
+    const l = t.getBoundingClientRect();
     t.style.transform = o;
     const n = t.querySelector(".panel__inner");
     n && (n.style.minWidth = `${i.width}px`);
-    const s = t.getBoundingClientRect(), d = 4, p = window.innerWidth, h = window.innerHeight, v = 8, H = h - i.bottom - d, f = i.top - d, q = s.height <= H || H >= f ? i.bottom + d : i.top - s.height - d;
+    const s = t.getBoundingClientRect(), d = 4, p = window.innerWidth, h = window.innerHeight, v = 8, H = h - i.bottom - d, f = i.top - d, G = s.height <= H || H >= f ? i.bottom + d : i.top - s.height - d;
     let x = i.left;
     this.placement === "bottom-end" ? x = i.right - s.width : this.placement === "bottom" && (x = i.left + i.width / 2 - s.width / 2), x = Math.max(v, Math.min(x, p - s.width - v));
-    const D = Math.max(v, Math.min(q, h - s.height - v));
-    t.style.transform = `translate(${Math.round(x - r.left)}px, ${Math.round(D - r.top)}px)`;
+    const D = Math.max(v, Math.min(G, h - s.height - v));
+    t.style.transform = `translate(${Math.round(x - l.left)}px, ${Math.round(D - l.top)}px)`;
   }
   get _filteredOptions() {
     if (!this._query) return this.options;
@@ -5043,7 +5046,7 @@ const J5 = "anduin-dropdown:change", _5 = class _5 extends u {
     return this.options.filter((t) => t.label.toLowerCase().includes(e));
   }
   render() {
-    const e = this.options.find((r) => r.value === this.value), t = (e == null ? void 0 : e.label) ?? "", i = e ? e.icon ?? "" : this.icon, o = this._filteredOptions;
+    const e = this.options.find((l) => l.value === this.value), t = (e == null ? void 0 : e.label) ?? "", i = e ? e.icon ?? "" : this.icon, o = this._filteredOptions;
     return C`
       <button
         class="trigger trigger--${this.appearance} trigger--${this.variant}${this.size === "small" ? " trigger--small" : ""}${this.value ? " has-value" : ""}"
@@ -5075,25 +5078,25 @@ const J5 = "anduin-dropdown:change", _5 = class _5 extends u {
               <anduin-input
                 placeholder="Search ..."
                 .value=${this._query}
-                @anduin-input:change=${(r) => {
-      this._query = r.detail;
+                @anduin-input:change=${(l) => {
+      this._query = l.detail;
     }}
               ></anduin-input>
             </div>
           ` : c}
           <div class="options">
-            ${o.length ? o.map((r) => C`
+            ${o.length ? o.map((l) => C`
                   <div
                     class="option"
                     role="option"
-                    aria-selected=${r.value === this.value}
-                    @click=${() => this._selectOption(r)}
+                    aria-selected=${l.value === this.value}
+                    @click=${() => this._selectOption(l)}
                   >
                     <span class="option__check">
-                      ${r.value === this.value ? C`<anduin-icon name="checkSmall" size="16"></anduin-icon>` : c}
+                      ${l.value === this.value ? C`<anduin-icon name="checkSmall" size="16"></anduin-icon>` : c}
                     </span>
-                    ${r.icon ? C`<anduin-icon name="${r.icon}" size="16"></anduin-icon>` : c}
-                    <span class="option__label">${r.label}</span>
+                    ${l.icon ? C`<anduin-icon name="${l.icon}" size="16"></anduin-icon>` : c}
+                    <span class="option__label">${l.label}</span>
                   </div>
                 `) : C`<div class="empty">No results</div>`}
           </div>
@@ -5102,7 +5105,7 @@ const J5 = "anduin-dropdown:change", _5 = class _5 extends u {
     `;
   }
 };
-_5.styles = g`
+$5.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     :host([full-width]) { display: block; width: 100%; }
     :host([full-width]) .trigger { width: 100%; }
@@ -5282,96 +5285,96 @@ _5.styles = g`
       text-align: center;
     }
   `;
-let L = _5;
+let b = $5;
 M([
   a()
-], L.prototype, "value");
+], b.prototype, "value");
 M([
   a()
-], L.prototype, "placeholder");
+], b.prototype, "placeholder");
 M([
   a({ attribute: !1 })
-], L.prototype, "options");
+], b.prototype, "options");
 M([
   a()
-], L.prototype, "icon");
+], b.prototype, "icon");
 M([
   a({ type: Boolean })
-], L.prototype, "searchable");
+], b.prototype, "searchable");
 M([
   a({ type: Boolean })
-], L.prototype, "disabled");
+], b.prototype, "disabled");
 M([
   a()
-], L.prototype, "placement");
+], b.prototype, "placement");
 M([
   a()
-], L.prototype, "appearance");
+], b.prototype, "appearance");
 M([
   a()
-], L.prototype, "variant");
+], b.prototype, "variant");
 M([
   a()
-], L.prototype, "size");
+], b.prototype, "size");
 M([
   a({ type: Boolean, attribute: "full-width", reflect: !0 })
-], L.prototype, "fullWidth");
+], b.prototype, "fullWidth");
 M([
-  b()
-], L.prototype, "_open");
+  m()
+], b.prototype, "_open");
 M([
-  b()
-], L.prototype, "_query");
+  m()
+], b.prototype, "_query");
 M([
   k(".trigger")
-], L.prototype, "_triggerEl");
+], b.prototype, "_triggerEl");
 M([
   k(".panel")
-], L.prototype, "_panelEl");
+], b.prototype, "_panelEl");
 M([
   k("anduin-input")
-], L.prototype, "_searchEl");
-customElements.get("anduin-dropdown") || customElements.define("anduin-dropdown", L);
-var n7 = Object.defineProperty, t1 = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && n7(e, t, o), o;
+], b.prototype, "_searchEl");
+customElements.get("anduin-dropdown") || customElements.define("anduin-dropdown", b);
+var v7 = Object.defineProperty, t1 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && v7(e, t, o), o;
 };
-const x2 = "anduin-close", a7 = "anduin-after-close", s7 = 300, Q5 = 250, C7 = /* @__PURE__ */ new Map([
+const E2 = "anduin-close", f7 = "anduin-after-close", H7 = 300, n4 = 250, V7 = /* @__PURE__ */ new Map([
   ["320", 320],
   ["360", 360],
   ["400", 400],
   ["640", 640]
-]), x5 = class x5 extends u {
+]), E5 = class E5 extends u {
   constructor() {
     super(...arguments), this.open = !1, this.heading = "", this.hideHeader = !1, this.hideFooter = !1, this.defaultWidth = "320", this.allowInteractOutside = !1, this._leaving = !1, this._width = 320, this._resizing = !1, this._startX = 0, this._startWidth = 0, this._onResizeStart = (e) => {
       this._resizing = !0, this._startX = e.clientX, this._startWidth = this._width, e.currentTarget.setPointerCapture(e.pointerId), e.preventDefault();
     }, this._onResizeMove = (e) => {
-      var r;
+      var l;
       if (!this._resizing) return;
       const t = this._startX - e.clientX, i = Math.max(
         200,
         Math.min(window.innerWidth * 0.9, this._startWidth + t)
       );
       this._width = Math.round(i);
-      const o = (r = this.shadowRoot) == null ? void 0 : r.querySelector(".drawer");
+      const o = (l = this.shadowRoot) == null ? void 0 : l.querySelector(".drawer");
       o && (o.style.width = `${this._width}px`);
     }, this._onResizeEnd = () => {
       this._resizing = !1;
     };
   }
   willUpdate(e) {
-    e.has("defaultWidth") && (this._width = C7.get(this.defaultWidth) ?? (parseInt(this.defaultWidth) || 320));
+    e.has("defaultWidth") && (this._width = V7.get(this.defaultWidth) ?? (parseInt(this.defaultWidth) || 320));
   }
   updated(e) {
     e.has("open") && (this.open ? (this._leaving = !1, this.classList.add("is-shown")) : this.classList.contains("is-shown") && (this._leaving = !0, setTimeout(() => {
       this._leaving = !1, this.classList.remove("is-shown"), this.dispatchEvent(
-        new CustomEvent(a7, {
+        new CustomEvent(f7, {
           bubbles: !0,
           composed: !0
         })
       );
-    }, Q5)));
+    }, n4)));
   }
   _dispatch(e) {
     this.dispatchEvent(
@@ -5379,10 +5382,10 @@ const x2 = "anduin-close", a7 = "anduin-after-close", s7 = 300, Q5 = 250, C7 = /
     );
   }
   _onClose() {
-    this._dispatch(x2);
+    this._dispatch(E2);
   }
   _onBackdropClick() {
-    this._dispatch(x2);
+    this._dispatch(E2);
   }
   render() {
     const e = this._leaving;
@@ -5425,7 +5428,7 @@ const x2 = "anduin-close", a7 = "anduin-after-close", s7 = 300, Q5 = 250, C7 = /
     `;
   }
 };
-x5.styles = g`
+E5.styles = g`
     :host {
       display: none;
       font-family: var(--font-sans);
@@ -5472,14 +5475,14 @@ x5.styles = g`
       box-shadow:
         -8px 0 24px 0 rgba(29, 41, 57, 0.12),
         -2px 0 8px 0 rgba(29, 41, 57, 0.08);
-      animation: drawerIn ${s7}ms cubic-bezier(0.05, 0.7, 0.1, 1)
+      animation: drawerIn ${H7}ms cubic-bezier(0.05, 0.7, 0.1, 1)
         forwards;
       min-width: 200px;
       max-width: 90vw;
       pointer-events: auto;
     }
     .drawer.is-leaving {
-      animation: drawerOut ${Q5}ms
+      animation: drawerOut ${n4}ms
         cubic-bezier(0.3, 0, 0.8, 0.15) forwards;
     }
     @media (max-width: 640px) {
@@ -5543,37 +5546,37 @@ x5.styles = g`
       border-top: 1px solid var(--color-gray-3, #e4e7ec);
     }
   `;
-let A = x5;
+let z = E5;
 t1([
   a({ type: Boolean, reflect: !0 })
-], A.prototype, "open");
+], z.prototype, "open");
 t1([
   a()
-], A.prototype, "heading");
+], z.prototype, "heading");
 t1([
   a({ type: Boolean, attribute: "hide-header" })
-], A.prototype, "hideHeader");
+], z.prototype, "hideHeader");
 t1([
   a({ type: Boolean, attribute: "hide-footer" })
-], A.prototype, "hideFooter");
+], z.prototype, "hideFooter");
 t1([
   a({ attribute: "default-width" })
-], A.prototype, "defaultWidth");
+], z.prototype, "defaultWidth");
 t1([
   a({ type: Boolean, attribute: "allow-interact-outside" })
-], A.prototype, "allowInteractOutside");
+], z.prototype, "allowInteractOutside");
 t1([
-  b()
-], A.prototype, "_leaving");
+  m()
+], z.prototype, "_leaving");
 t1([
-  b()
-], A.prototype, "_width");
-customElements.get("anduin-drawer") || customElements.define("anduin-drawer", A);
-class d7 extends HTMLElement {
+  m()
+], z.prototype, "_width");
+customElements.get("anduin-drawer") || customElements.define("anduin-drawer", z);
+class m7 extends HTMLElement {
   constructor() {
     super(...arguments), this._onClick = () => {
       this.dispatchEvent(
-        new CustomEvent(x2, { bubbles: !0, composed: !0 })
+        new CustomEvent(E2, { bubbles: !0, composed: !0 })
       );
     };
   }
@@ -5584,13 +5587,13 @@ class d7 extends HTMLElement {
     this.removeEventListener("click", this._onClick);
   }
 }
-customElements.get("anduin-drawer-close") || customElements.define("anduin-drawer-close", d7);
-var c7 = Object.defineProperty, y = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && c7(e, t, o), o;
+customElements.get("anduin-drawer-close") || customElements.define("anduin-drawer-close", m7);
+var b7 = Object.defineProperty, y = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && b7(e, t, o), o;
 };
-const c2 = "anduin-suggestion:change", p7 = "anduin-suggestion:select", u7 = "anduin-suggestion:clear", w5 = class w5 extends u {
+const v2 = "anduin-suggestion:change", L7 = "anduin-suggestion:select", y7 = "anduin-suggestion:clear", z5 = class z5 extends u {
   constructor() {
     super(...arguments), this.value = "", this.size = "default", this.disabled = !1, this.readonly = !1, this.placeholder = "", this.inputid = "", this.status = "", this.startIcon = "", this.endIcon = "", this.clearable = !1, this.suggestions = [], this.filter = !1, this.hideWhenEmpty = !1, this.emptyText = "No suggestions", this._open = !1, this._activeIndex = -1, this._onDocumentMouseDown = (e) => {
       var t;
@@ -5602,7 +5605,7 @@ const c2 = "anduin-suggestion:change", p7 = "anduin-suggestion:select", u7 = "an
   connectedCallback() {
     super.connectedCallback(), document.addEventListener("mousedown", this._onDocumentMouseDown), window.addEventListener("scroll", this._onScrollOrResize, { passive: !0, capture: !0 }), window.addEventListener("resize", this._onScrollOrResize);
     const e = this.closest("anduin-field");
-    e && e.addEventListener(m1, (t) => {
+    e && e.addEventListener(M1, (t) => {
       var o;
       const i = t;
       this.inputid && this.inputid === i.detail && ((o = this._inputEl) == null || o.focus());
@@ -5630,7 +5633,7 @@ const c2 = "anduin-suggestion:change", p7 = "anduin-suggestion:select", u7 = "an
     this._openPanel();
   }
   _onInput() {
-    this.value = this._inputEl.value, this._open || this._openPanel(), this._activeIndex = -1, this.dispatchEvent(new CustomEvent(c2, {
+    this.value = this._inputEl.value, this._open || this._openPanel(), this._activeIndex = -1, this.dispatchEvent(new CustomEvent(v2, {
       detail: this.value,
       bubbles: !0,
       composed: !0
@@ -5663,11 +5666,11 @@ const c2 = "anduin-suggestion:change", p7 = "anduin-suggestion:select", u7 = "an
   }
   _selectSuggestion(e) {
     var t;
-    this.value = e.value, this._inputEl && (this._inputEl.value = e.value), this._open = !1, this.dispatchEvent(new CustomEvent(c2, {
+    this.value = e.value, this._inputEl && (this._inputEl.value = e.value), this._open = !1, this.dispatchEvent(new CustomEvent(v2, {
       detail: this.value,
       bubbles: !0,
       composed: !0
-    })), this.dispatchEvent(new CustomEvent(p7, {
+    })), this.dispatchEvent(new CustomEvent(L7, {
       detail: e,
       bubbles: !0,
       composed: !0
@@ -5675,7 +5678,7 @@ const c2 = "anduin-suggestion:change", p7 = "anduin-suggestion:select", u7 = "an
   }
   _onClear() {
     var e;
-    this.value = "", this._inputEl && (this._inputEl.value = ""), this._activeIndex = -1, this.dispatchEvent(new CustomEvent(c2, { detail: "", bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent(u7, { bubbles: !0, composed: !0 })), (e = this._inputEl) == null || e.focus();
+    this.value = "", this._inputEl && (this._inputEl.value = ""), this._activeIndex = -1, this.dispatchEvent(new CustomEvent(v2, { detail: "", bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent(y7, { bubbles: !0, composed: !0 })), (e = this._inputEl) == null || e.focus();
   }
   _updatePosition() {
     var o1;
@@ -5683,18 +5686,18 @@ const c2 = "anduin-suggestion:change", p7 = "anduin-suggestion:select", u7 = "an
     if (!e || !t) return;
     const i = e.getBoundingClientRect(), o = t.style.transform;
     t.style.transform = "none";
-    const r = t.getBoundingClientRect();
+    const l = t.getBoundingClientRect();
     t.style.transform = o;
     const n = t.querySelector(".panel__inner");
     n && (n.style.minWidth = `${i.width}px`);
-    const s = t.getBoundingClientRect(), d = 4, p = window.innerWidth, h = window.innerHeight, v = 8, H = h - i.bottom - d, f = i.top - d, q = s.height <= H || H >= f ? i.bottom + d : i.top - s.height - d;
+    const s = t.getBoundingClientRect(), d = 4, p = window.innerWidth, h = window.innerHeight, v = 8, H = h - i.bottom - d, f = i.top - d, G = s.height <= H || H >= f ? i.bottom + d : i.top - s.height - d;
     let x = i.left;
     x = Math.max(v, Math.min(x, p - s.width - v));
-    const D = Math.max(v, Math.min(q, h - s.height - v));
-    t.style.transform = `translate(${Math.round(x - r.left)}px, ${Math.round(D - r.top)}px)`;
+    const D = Math.max(v, Math.min(G, h - s.height - v));
+    t.style.transform = `translate(${Math.round(x - l.left)}px, ${Math.round(D - l.top)}px)`;
   }
   render() {
-    const e = this.size === "small" ? "input--small" : this.size === "large" ? "input--large" : "input--default", t = this.status ? `input--${this.status}` : "", i = !!this.startIcon, o = !!this.endIcon || this.clearable && !!this.value, r = this.clearable && !!this.value && !this.disabled && !this.readonly, n = this.size === "small" ? "12" : this.size === "large" ? "20" : "16", s = this.size === "small" ? "10" : this.size === "large" ? "16" : "14", d = this._filteredSuggestions, p = this._open && (!this.hideWhenEmpty || d.length > 0);
+    const e = this.size === "small" ? "input--small" : this.size === "large" ? "input--large" : "input--default", t = this.status ? `input--${this.status}` : "", i = !!this.startIcon, o = !!this.endIcon || this.clearable && !!this.value, l = this.clearable && !!this.value && !this.disabled && !this.readonly, n = this.size === "small" ? "12" : this.size === "large" ? "20" : "16", s = this.size === "small" ? "10" : this.size === "large" ? "16" : "14", d = this._filteredSuggestions, p = this._open && (!this.hideWhenEmpty || d.length > 0);
     return C`
       <div class="input-wrapper">
         ${i ? C`
@@ -5726,7 +5729,7 @@ const c2 = "anduin-suggestion:change", p7 = "anduin-suggestion:select", u7 = "an
         ${o ? C`
           <span class="input__end">
-            ${r ? C`
+            ${l ? C`
               <button class="input__clear" type="button" @click=${this._onClear} aria-label="Clear">
                 <anduin-icon name="cross" size=${s}></anduin-icon>
               </button>
@@ -5763,7 +5766,7 @@ const c2 = "anduin-suggestion:change", p7 = "anduin-suggestion:select", u7 = "an
     `;
   }
 };
-w5.styles = g`
+z5.styles = g`
     :host { display: block; font-family: var(--font-sans); position: relative; }
     .input-wrapper { position: relative; display: flex; align-items: center; }
@@ -5876,7 +5879,7 @@ w5.styles = g`
       text-align: center;
     }
   `;
-let V = w5;
+let V = z5;
 y([
   a()
 ], V.prototype, "value");
@@ -5920,10 +5923,10 @@ y([
   a({ attribute: "empty-text" })
 ], V.prototype, "emptyText");
 y([
-  b()
+  m()
 ], V.prototype, "_open");
 y([
-  b()
+  m()
 ], V.prototype, "_activeIndex");
 y([
   k("input")
@@ -5932,17 +5935,17 @@ y([
   k(".panel")
 ], V.prototype, "_panelEl");
 customElements.get("anduin-suggestion") || customElements.define("anduin-suggestion", V);
-var h7 = Object.defineProperty, B = (l, e, t, i) => {
-  for (var o = void 0, r = l.length - 1, n; r >= 0; r--)
-    (n = l[r]) && (o = n(e, t, o) || o);
-  return o && h7(e, t, o), o;
+var M7 = Object.defineProperty, B = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && M7(e, t, o), o;
 };
-const g7 = "anduin-navigation:change", w2 = "anduin-navigation-item:item-click", R5 = class R5 extends u {
+const Z7 = "anduin-navigation:change", z2 = "anduin-navigation-item:item-click", A5 = class A5 extends u {
   constructor() {
     super(...arguments), this.defaultValue = "", this.value = null, this.theme = "light", this.alignment = "left", this.internalValue = "", this.onItemClick = (e) => {
       e.stopPropagation();
       const i = e.detail;
-      i !== this.selection && (this.dispatchEvent(new CustomEvent(g7, {
+      i !== this.selection && (this.dispatchEvent(new CustomEvent(Z7, {
         detail: i,
         bubbles: !0,
         composed: !0
@@ -5956,10 +5959,10 @@ const g7 = "anduin-navigation:change", w2 = "anduin-navigation-item:item-click",
     return this.isControlled ? this.value : this.internalValue;
   }
   connectedCallback() {
-    super.connectedCallback(), this.hasUpdated || (this.internalValue = this.defaultValue), this.addEventListener(w2, this.onItemClick);
+    super.connectedCallback(), this.hasUpdated || (this.internalValue = this.defaultValue), this.addEventListener(z2, this.onItemClick);
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener(w2, this.onItemClick);
+    super.disconnectedCallback(), this.removeEventListener(z2, this.onItemClick);
   }
   updated() {
     this.syncItems();
@@ -5980,7 +5983,7 @@ const g7 = "anduin-navigation:change", w2 = "anduin-navigation-item:item-click",
     `;
   }
 };
-R5.styles = g`
+A5.styles = g`
     :host {
       display: block;
       font-family: var(--font-sans);
@@ -6023,7 +6026,7 @@ R5.styles = g`
     .navigation--center { justify-content: center; }
     .navigation--right { justify-content: flex-end; }
   `;
-let J = R5;
+let J = A5;
 B([
   a({ attribute: "default-value" })
 ], J.prototype, "defaultValue");
@@ -6037,9 +6040,9 @@ B([
   a()
 ], J.prototype, "alignment");
 B([
-  b()
+  m()
 ], J.prototype, "internalValue");
-const k5 = class k5 extends u {
+const B5 = class B5 extends u {
   constructor() {
     super(...arguments), this.value = "", this.startIcon = "", this.href = "", this.disabled = !1, this.selected = !1, this.theme = "light";
   }
@@ -6048,7 +6051,7 @@ const k5 = class k5 extends u {
       e.preventDefault();
       return;
     }
-    this.dispatchEvent(new CustomEvent(w2, {
+    this.dispatchEvent(new CustomEvent(z2, {
       detail: this.value,
       bubbles: !0,
       composed: !0
@@ -6086,7 +6089,7 @@ const k5 = class k5 extends u {
         `;
   }
 };
-k5.styles = g`
+B5.styles = g`
     :host { display: inline-block; font-family: var(--font-sans); }
     .nav-item {
       box-sizing: border-box;
@@ -6131,7 +6134,7 @@ k5.styles = g`
     }
     .nav-item__icon { display: flex; }
   `;
-let j = k5;
+let j = B5;
 B([
   a()
 ], j.prototype, "value");
@@ -6152,98 +6155,343 @@ B([
 ], j.prototype, "theme");
 customElements.get("anduin-navigation") || customElements.define("anduin-navigation", J);
 customElements.get("anduin-navigation-item") || customElements.define("anduin-navigation-item", j);
+var _7 = Object.defineProperty, h1 = (r, e, t, i) => {
+  for (var o = void 0, l = r.length - 1, n; l >= 0; l--)
+    (n = r[l]) && (o = n(e, t, o) || o);
+  return o && _7(e, t, o), o;
+};
+const x7 = "anduin-resizable:resize", A4 = "anduin-resizable-panel", a4 = (r) => !!r && r.tagName.toLowerCase() === A4;
+function s4(r, e, t) {
+  const i = (r || "").trim();
+  if (!i) return t;
+  const o = parseFloat(i);
+  return Number.isNaN(o) ? t : i.endsWith("%") ? o / 100 * e : o;
+}
+const P5 = class P5 extends u {
+  constructor() {
+    super(...arguments), this.orientation = "horizontal";
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.setAttribute("role", "group");
+  }
+  get isVertical() {
+    return this.orientation === "vertical";
+  }
+  /** Size of the group along its main axis, in px. */
+  get axisSize() {
+    const e = this.getBoundingClientRect();
+    return this.isVertical ? e.height : e.width;
+  }
+  get panels() {
+    return Array.from(this.querySelectorAll(`:scope > ${A4}`));
+  }
+  updated() {
+    for (const e of this.querySelectorAll(":scope > anduin-resizable-handle"))
+      e.setOrientation(this.isVertical);
+  }
+  /**
+   * Convert every panel to the proportional (flex-grow) model based on its
+   * current rendered size, so fixed-pixel panels "fold into" the weighted
+   * model when a resize begins.
+   */
+  normalizeToGrow() {
+    const e = this.axisSize;
+    if (!(e <= 0))
+      for (const t of this.panels)
+        t.setGrow(t.axisSize(this.isVertical) / e * 100);
+  }
+  render() {
+    return C`
+      <div class="panel-group ${this.isVertical ? "panel-group--vertical" : ""}" part="panel-group">
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+P5.styles = g`
+    :host { display: block; width: 100%; height: 100%; font-family: var(--font-sans); }
+    .panel-group {
+      display: flex; flex-direction: row;
+      width: 100%; height: 100%; min-width: 0; min-height: 0;
+    }
+    .panel-group--vertical { flex-direction: column; }
+  `;
+let r2 = P5;
+h1([
+  a({ reflect: !0 })
+], r2.prototype, "orientation");
+const S5 = class S5 extends u {
+  constructor() {
+    super(...arguments), this.defaultSize = "", this.minSize = "", this.maxSize = "", this.applied = !1;
+  }
+  updated(e) {
+    e.has("defaultSize") && !this.applied && this.applyDefaultSize();
+  }
+  applyDefaultSize() {
+    const e = (this.defaultSize || "").trim();
+    if (!e) return;
+    this.applied = !0;
+    const t = parseFloat(e);
+    Number.isNaN(t) || (e.endsWith("%") ? this.setGrow(t) : this.style.flex = `0 0 ${t}px`);
+  }
+  /** Switch to the proportional model with the given flex-grow weight. */
+  setGrow(e) {
+    this.style.flex = "", this.style.flexGrow = String(e), this.style.flexShrink = "1", this.style.flexBasis = "0";
+  }
+  axisSize(e) {
+    const t = this.getBoundingClientRect();
+    return e ? t.height : t.width;
+  }
+  minPx(e) {
+    return s4(this.minSize, e, 0);
+  }
+  maxPx(e) {
+    return s4(this.maxSize, e, e);
+  }
+  render() {
+    return C`<div class="panel" part="panel"><slot></slot></div>`;
+  }
+};
+S5.styles = g`
+    :host { display: block; flex: 1 1 0; min-width: 0; min-height: 0; overflow: hidden; font-family: var(--font-sans); }
+    .panel { width: 100%; height: 100%; overflow: hidden; }
+  `;
+let b1 = S5;
+h1([
+  a({ attribute: "default-size" })
+], b1.prototype, "defaultSize");
+h1([
+  a({ attribute: "min-size" })
+], b1.prototype, "minSize");
+h1([
+  a({ attribute: "max-size" })
+], b1.prototype, "maxSize");
+const F5 = class F5 extends u {
+  constructor() {
+    super(...arguments), this.withHandle = !1, this.groupVertical = !1, this.dragging = !1, this.group = null, this.startPos = 0, this.startPrevPx = 0, this.combinedPx = 0, this.combinedGrow = 0, this.activePointerId = null, this.onPointerDown = (e) => {
+      const t = this.closest("anduin-resizable-panel-group"), i = this.prevPanel, o = this.nextPanel;
+      if (!t || !i || !o) return;
+      e.preventDefault(), this.group = t, this.dragging = !0, this.activePointerId = e.pointerId, this.setPointerCapture(e.pointerId), t.normalizeToGrow();
+      const l = t.isVertical;
+      this.startPos = l ? e.clientY : e.clientX, this.startPrevPx = i.axisSize(l), this.combinedPx = this.startPrevPx + o.axisSize(l), this.combinedGrow = (parseFloat(i.style.flexGrow) || 0) + (parseFloat(o.style.flexGrow) || 0), document.body.style.userSelect = "none", document.body.style.cursor = l ? "row-resize" : "col-resize", window.addEventListener("pointermove", this.onPointerMove), window.addEventListener("pointerup", this.onPointerUp);
+    }, this.onPointerMove = (e) => {
+      if (!this.dragging || !this.group) return;
+      const i = (this.group.isVertical ? e.clientY : e.clientX) - this.startPos;
+      this.resizeTo(this.startPrevPx + i);
+    }, this.onPointerUp = () => {
+      this.dragging && (this.endDrag(), this.emitResize());
+    }, this.onKeyDown = (e) => {
+      const t = this.closest("anduin-resizable-panel-group");
+      if (!t) return;
+      const i = t.isVertical;
+      let o = 0;
+      if (!i && e.key === "ArrowRight") o = 1;
+      else if (!i && e.key === "ArrowLeft") o = -1;
+      else if (i && e.key === "ArrowDown") o = 1;
+      else if (i && e.key === "ArrowUp") o = -1;
+      else return;
+      const l = this.prevPanel, n = this.nextPanel;
+      if (!l || !n) return;
+      e.preventDefault(), this.group = t, t.normalizeToGrow();
+      const s = l.axisSize(i);
+      this.combinedPx = s + n.axisSize(i), this.combinedGrow = (parseFloat(l.style.flexGrow) || 0) + (parseFloat(n.style.flexGrow) || 0);
+      const d = Math.max(t.axisSize * 0.02, 8);
+      this.resizeTo(s + o * d), this.emitResize();
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.setAttribute("role", "separator"), this.hasAttribute("tabindex") || this.setAttribute("tabindex", "0"), this.addEventListener("pointerdown", this.onPointerDown), this.addEventListener("keydown", this.onKeyDown);
+    const e = this.closest("anduin-resizable-panel-group");
+    e && this.setOrientation(e.isVertical);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.removeEventListener("pointerdown", this.onPointerDown), this.removeEventListener("keydown", this.onKeyDown), this.endDrag();
+  }
+  /** Called by the parent group so the divider matches the group's axis. */
+  setOrientation(e) {
+    this.groupVertical = e, this.setAttribute("aria-orientation", e ? "horizontal" : "vertical");
+  }
+  get prevPanel() {
+    return a4(this.previousElementSibling) ? this.previousElementSibling : null;
+  }
+  get nextPanel() {
+    return a4(this.nextElementSibling) ? this.nextElementSibling : null;
+  }
+  endDrag() {
+    if (!(!this.dragging && this.activePointerId === null)) {
+      if (this.dragging = !1, this.activePointerId !== null) {
+        try {
+          this.releasePointerCapture(this.activePointerId);
+        } catch {
+        }
+        this.activePointerId = null;
+      }
+      document.body.style.userSelect = "", document.body.style.cursor = "", window.removeEventListener("pointermove", this.onPointerMove), window.removeEventListener("pointerup", this.onPointerUp);
+    }
+  }
+  /** Set the previous panel to `newPrevPx` (clamped), redistributing the
+   *  combined weight between the two adjacent panels. */
+  resizeTo(e) {
+    const t = this.group, i = this.prevPanel, o = this.nextPanel;
+    if (!t || !i || !o || this.combinedPx <= 0) return;
+    const l = t.axisSize, n = Math.max(i.minPx(l), this.combinedPx - o.maxPx(l), 0), s = Math.min(i.maxPx(l), this.combinedPx - o.minPx(l), this.combinedPx), d = Math.max(n, Math.min(s, e)), p = this.combinedGrow * (d / this.combinedPx);
+    i.setGrow(p), o.setGrow(this.combinedGrow - p);
+  }
+  emitResize() {
+    const e = this.group, t = this.prevPanel, i = this.nextPanel;
+    if (!e || !t || !i) return;
+    const o = e.axisSize;
+    if (o <= 0) return;
+    const l = e.isVertical;
+    this.dispatchEvent(new CustomEvent(x7, {
+      detail: { sizes: [t.axisSize(l) / o * 100, i.axisSize(l) / o * 100] },
+      bubbles: !0,
+      composed: !0
+    }));
+  }
+  render() {
+    const e = [
+      "handle",
+      this.groupVertical ? "handle--vertical" : "",
+      this.dragging ? "handle--dragging" : ""
+    ].filter(Boolean).join(" ");
+    return C`
+      <div class="${e}" part="handle">
+        ${this.withHandle ? C`<div class="handle__grip" part="grip"><anduin-icon name="drag" size="12" aria-label="Drag"></anduin-icon></div>` : c}
+      </div>
+    `;
+  }
+};
+F5.styles = g`
+    :host { display: block; flex: 0 0 auto; position: relative; z-index: 1; outline: none; font-family: var(--font-sans); }
+    .handle {
+      position: relative; display: flex; align-items: center; justify-content: center;
+      width: 2px; height: 100%; background-color: var(--color-gray-3); cursor: col-resize;
+    }
+    .handle--vertical { width: 100%; height: 2px; cursor: row-resize; }
+    /* Widen the hit area beyond the 2px visual line. */
+    .handle::after { content: ''; position: absolute; inset: 0 -3px; }
+    .handle--vertical::after { inset: -3px 0; }
+    .handle:hover, .handle--dragging { background-color: var(--color-primary-4); }
+    :host(:focus-visible) .handle { background-color: var(--color-primary-4); }
+    .handle__grip {
+      position: relative; z-index: 1; display: flex; align-items: center; justify-content: center;
+      width: 12px; height: 18px; border-radius: 2px;
+      border: 1px solid var(--color-gray-4); background-color: var(--color-gray-1);
+      color: var(--color-gray-6); opacity: 0; transition: opacity 150ms;
+    }
+    .handle:hover .handle__grip, .handle--dragging .handle__grip, :host(:focus-visible) .handle__grip { opacity: 1; }
+    .handle--vertical .handle__grip { transform: rotate(90deg); }
+  `;
+let L1 = F5;
+h1([
+  a({ type: Boolean, attribute: "with-handle" })
+], L1.prototype, "withHandle");
+h1([
+  m()
+], L1.prototype, "groupVertical");
+h1([
+  m()
+], L1.prototype, "dragging");
+customElements.get("anduin-resizable-panel-group") || customElements.define("anduin-resizable-panel-group", r2);
+customElements.get("anduin-resizable-panel") || customElements.define("anduin-resizable-panel", b1);
+customElements.get("anduin-resizable-handle") || customElements.define("anduin-resizable-handle", L1);
 export {
-  p3 as $,
+  l2 as $,
   O as A,
-  b2 as B,
-  z1 as C,
+  x2 as B,
+  S1 as C,
   N as D,
-  V1 as E,
-  I as F,
-  k1 as G,
-  R1 as H,
-  V as I,
-  I1 as J,
-  P1 as K,
-  T as L,
-  v1 as M,
-  S1 as N,
-  f1 as O,
-  g2 as P,
-  E as Q,
-  K as R,
-  D1 as S,
-  S as T,
-  P as U,
-  F1 as V,
-  V2 as W,
-  H2 as X,
-  t2 as Y,
-  L2 as Z,
-  d4 as _,
-  X1 as a,
-  a7 as a0,
-  x2 as a1,
-  J5 as a2,
-  g4 as a3,
-  m1 as a4,
-  X3 as a5,
-  j5 as a6,
-  h3 as a7,
-  y2 as a8,
-  F3 as a9,
-  z3 as aA,
-  c4 as aB,
-  J3 as aC,
-  V7 as aD,
-  y1 as aa,
-  g7 as ab,
-  w2 as ac,
-  m2 as ad,
-  M2 as ae,
-  T3 as af,
-  c2 as ag,
-  u7 as ah,
-  p7 as ai,
-  l7 as aj,
-  H3 as ak,
-  v4 as al,
-  i2 as am,
-  L3 as an,
-  v3 as ao,
-  M3 as ap,
-  Z3 as aq,
-  v2 as ar,
-  x3 as as,
-  _3 as at,
-  L4 as au,
-  m4 as av,
-  B2 as aw,
-  H4 as ax,
-  V4 as ay,
-  b4 as az,
-  E1 as b,
-  m as c,
-  K1 as d,
+  m1 as E,
+  L1 as F,
+  b1 as G,
+  r2 as H,
+  I,
+  z1 as J,
+  E1 as K,
+  V as L,
+  j1 as M,
+  D1 as N,
+  T as O,
+  f1 as P,
+  O1 as Q,
+  H1 as R,
+  m2 as S,
+  E as T,
+  K as U,
+  N1 as V,
+  P as W,
+  S as X,
+  I1 as Y,
+  M2 as Z,
+  y2 as _,
+  Q1 as a,
+  Z2 as a0,
+  V4 as a1,
+  L3 as a2,
+  f7 as a3,
+  E2 as a4,
+  r4 as a5,
+  M4 as a6,
+  M1 as a7,
+  n7 as a8,
+  J5 as a9,
+  D2 as aA,
+  x4 as aB,
+  w4 as aC,
+  $4 as aD,
+  j3 as aE,
+  m4 as aF,
+  s7 as aG,
+  $7 as aH,
+  M3 as aa,
+  w2 as ab,
+  W3 as ac,
+  _1 as ad,
+  Z7 as ae,
+  z2 as af,
+  _2 as ag,
+  R2 as ah,
+  J3 as ai,
+  x7 as aj,
+  v2 as ak,
+  y7 as al,
+  L7 as am,
+  h7 as an,
+  w3 as ao,
+  Z4 as ap,
+  a2 as aq,
+  k3 as ar,
+  _3 as as,
+  A3 as at,
+  B3 as au,
+  b2 as av,
+  S3 as aw,
+  P3 as ax,
+  R4 as ay,
+  k4 as az,
+  B1 as b,
+  L as c,
+  e2 as d,
   X as e,
-  A1 as f,
-  J1 as g,
-  A as h,
-  d7 as i,
-  L as j,
-  e2 as k,
-  p2 as l,
-  u2 as m,
-  h2 as n,
-  B1 as o,
-  O1 as p,
-  $1 as q,
+  P1 as f,
+  t2 as g,
+  z as h,
+  m7 as i,
+  b as j,
+  i2 as k,
+  f2 as l,
+  H2 as m,
+  V2 as n,
+  F1 as o,
+  T1 as p,
+  A1 as q,
   w as r,
-  Q1 as s,
+  o2 as s,
   s1 as t,
-  H1 as u,
-  O3 as v,
-  D3 as w,
+  V1 as u,
+  Y3 as v,
+  X3 as w,
   J as x,
   j as y,
   F as z