@duyluonganduin/acl-web-components 0.0.4 → 0.0.6

package/dist/acl-web-components.d.ts

@@ -199,6 +199,7 @@ export declare class AnduinTabContent extends LitElement {
     value: string;
     private isActive;
     connectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
     render(): TemplateResult<1>;
 }
 
@@ -206,6 +207,7 @@ export declare class AnduinTabs extends LitElement {
     static styles: CSSResult;
     defaultValue: string;
     value: string;
+    fill: boolean;
     connectedCallback(): void;
     updated(changed: Map<string, unknown>): void;
     private broadcastValueChanged;

package/dist/acl-web-components.js

@@ -46,7 +46,7 @@ const h2 = (C) => new T5(typeof C == "string" ? C : C + "", void 0, O1), h = (C,
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const { is: L2, defineProperty: g2, getOwnPropertyDescriptor: f2, getOwnPropertyNames: H2, getOwnPropertySymbols: b2, getPrototypeOf: m2 } = Object, x = globalThis, _5 = x.trustedTypes, V2 = _5 ? _5.emptyScript : "", V1 = x.reactiveElementPolyfillSupport, j = (C, e) => C, d1 = { toAttribute(C, e) {
+const { is: L2, defineProperty: g2, getOwnPropertyDescriptor: f2, getOwnPropertyNames: H2, getOwnPropertySymbols: b2, getPrototypeOf: m2 } = Object, x = globalThis, _5 = x.trustedTypes, V2 = _5 ? _5.emptyScript : "", V1 = x.reactiveElementPolyfillSupport, D = (C, e) => C, d1 = { toAttribute(C, e) {
   switch (e) {
     case Boolean:
       C = C ? V2 : null;
@@ -104,13 +104,13 @@ let S = class extends HTMLElement {
     return this.elementProperties.get(e) ?? x5;
   }
   static _$Ei() {
-    if (this.hasOwnProperty(j("elementProperties"))) return;
+    if (this.hasOwnProperty(D("elementProperties"))) return;
     const e = m2(this);
     e.finalize(), e.l !== void 0 && (this.l = [...e.l]), this.elementProperties = new Map(e.elementProperties);
   }
   static finalize() {
-    if (this.hasOwnProperty(j("finalized"))) return;
-    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(j("properties"))) {
+    if (this.hasOwnProperty(D("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(D("properties"))) {
       const t = this.properties, l = [...H2(t), ...b2(t)];
       for (const o of l) this.createProperty(o, t[o]);
     }
@@ -279,14 +279,14 @@ let S = class extends HTMLElement {
   firstUpdated(e) {
   }
 };
-S.elementStyles = [], S.shadowRootOptions = { mode: "open" }, S[j("elementProperties")] = /* @__PURE__ */ new Map(), S[j("finalized")] = /* @__PURE__ */ new Map(), V1 == null || V1({ ReactiveElement: S }), (x.reactiveElementVersions ?? (x.reactiveElementVersions = [])).push("2.1.2");
+S.elementStyles = [], S.shadowRootOptions = { mode: "open" }, S[D("elementProperties")] = /* @__PURE__ */ new Map(), S[D("finalized")] = /* @__PURE__ */ new Map(), V1 == null || V1({ ReactiveElement: S }), (x.reactiveElementVersions ?? (x.reactiveElementVersions = [])).push("2.1.2");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const D = globalThis, k5 = (C) => C, c1 = D.trustedTypes, w5 = c1 ? c1.createPolicy("lit-html", { createHTML: (C) => C }) : void 0, U5 = "$lit$", _ = `lit$${Math.random().toFixed(9).slice(2)}$`, j5 = "?" + _, M2 = `<${j5}>`, z = document, q = () => z.createComment(""), G = (C) => C === null || typeof C != "object" && typeof C != "function", I1 = Array.isArray, Z2 = (C) => I1(C) || typeof (C == null ? void 0 : C[Symbol.iterator]) == "function", M1 = `[ 	
-\f\r]`, U = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, $5 = /-->/g, E5 = />/g, E = RegExp(`>|${M1}(?:([^\\s"'>=/]+)(${M1}*=${M1}*(?:[^ 	
+const q = globalThis, k5 = (C) => C, c1 = q.trustedTypes, w5 = c1 ? c1.createPolicy("lit-html", { createHTML: (C) => C }) : void 0, U5 = "$lit$", _ = `lit$${Math.random().toFixed(9).slice(2)}$`, j5 = "?" + _, M2 = `<${j5}>`, z = document, G = () => z.createComment(""), Y = (C) => C === null || typeof C != "object" && typeof C != "function", I1 = Array.isArray, Z2 = (C) => I1(C) || typeof (C == null ? void 0 : C[Symbol.iterator]) == "function", M1 = `[ 	
+\f\r]`, j = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, $5 = /-->/g, E5 = />/g, E = RegExp(`>|${M1}(?:([^\\s"'>=/]+)(${M1}*=${M1}*(?:[^ 	
 \f\r"'\`<>=]|("|')|))|$)`, "g"), P5 = /'/g, A5 = /"/g, D5 = /^(?:script|style|textarea|title)$/i, q5 = (C) => (e, ...t) => ({ _$litType$: C, strings: e, values: t }), d = q5(1), R1 = q5(2), O = Symbol.for("lit-noChange"), p = Symbol.for("lit-nothing"), z5 = /* @__PURE__ */ new WeakMap(), P = z.createTreeWalker(z, 129);
 function G5(C, e) {
   if (!I1(C) || !C.hasOwnProperty("raw")) throw Error("invalid template strings array");
@@ -294,38 +294,38 @@ function G5(C, e) {
 }
 const y2 = (C, e) => {
   const t = C.length - 1, l = [];
-  let o, i = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", n = U;
+  let o, i = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", n = j;
   for (let a = 0; a < t; a++) {
     const s = C[a];
-    let u, L, v = -1, b = 0;
-    for (; b < s.length && (n.lastIndex = b, L = n.exec(s), L !== null); ) b = n.lastIndex, n === U ? L[1] === "!--" ? n = $5 : L[1] !== void 0 ? n = E5 : L[2] !== void 0 ? (D5.test(L[2]) && (o = RegExp("</" + L[2], "g")), n = E) : L[3] !== void 0 && (n = E) : n === E ? L[0] === ">" ? (n = o ?? U, v = -1) : L[1] === void 0 ? v = -2 : (v = n.lastIndex - L[2].length, u = L[1], n = L[3] === void 0 ? E : L[3] === '"' ? A5 : P5) : n === A5 || n === P5 ? n = E : n === $5 || n === E5 ? n = U : (n = E, o = void 0);
+    let u, L, v = -1, m = 0;
+    for (; m < s.length && (n.lastIndex = m, L = n.exec(s), L !== null); ) m = n.lastIndex, n === j ? L[1] === "!--" ? n = $5 : L[1] !== void 0 ? n = E5 : L[2] !== void 0 ? (D5.test(L[2]) && (o = RegExp("</" + L[2], "g")), n = E) : L[3] !== void 0 && (n = E) : n === E ? L[0] === ">" ? (n = o ?? j, v = -1) : L[1] === void 0 ? v = -2 : (v = n.lastIndex - L[2].length, u = L[1], n = L[3] === void 0 ? E : L[3] === '"' ? A5 : P5) : n === A5 || n === P5 ? n = E : n === $5 || n === E5 ? n = j : (n = E, o = void 0);
     const g = n === E && C[a + 1].startsWith("/>") ? " " : "";
-    i += n === U ? s + M2 : v >= 0 ? (l.push(u), s.slice(0, v) + U5 + s.slice(v) + _ + g) : s + _ + (v === -2 ? a : g);
+    i += n === j ? s + M2 : v >= 0 ? (l.push(u), s.slice(0, v) + U5 + s.slice(v) + _ + g) : s + _ + (v === -2 ? a : g);
   }
   return [G5(C, i + (C[t] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), l];
 };
-class Y {
+class W {
   constructor({ strings: e, _$litType$: t }, l) {
     let o;
     this.parts = [];
     let i = 0, n = 0;
     const a = e.length - 1, s = this.parts, [u, L] = y2(e, t);
-    if (this.el = Y.createElement(u, l), P.currentNode = this.el.content, t === 2 || t === 3) {
+    if (this.el = W.createElement(u, l), P.currentNode = this.el.content, t === 2 || t === 3) {
       const v = this.el.content.firstChild;
       v.replaceWith(...v.childNodes);
     }
     for (; (o = P.nextNode()) !== null && s.length < a; ) {
       if (o.nodeType === 1) {
         if (o.hasAttributes()) for (const v of o.getAttributeNames()) if (v.endsWith(U5)) {
-          const b = L[n++], g = o.getAttribute(v).split(_), V = /([.?@])?(.*)/.exec(b);
+          const m = L[n++], g = o.getAttribute(v).split(_), V = /([.?@])?(.*)/.exec(m);
           s.push({ type: 1, index: i, name: V[2], strings: g, ctor: V[1] === "." ? _2 : V[1] === "?" ? x2 : V[1] === "@" ? k2 : f1 }), o.removeAttribute(v);
         } else v.startsWith(_) && (s.push({ type: 6, index: i }), o.removeAttribute(v));
         if (D5.test(o.tagName)) {
-          const v = o.textContent.split(_), b = v.length - 1;
-          if (b > 0) {
+          const v = o.textContent.split(_), m = v.length - 1;
+          if (m > 0) {
             o.textContent = c1 ? c1.emptyScript : "";
-            for (let g = 0; g < b; g++) o.append(v[g], q()), P.nextNode(), s.push({ type: 2, index: ++i });
-            o.append(v[b], q());
+            for (let g = 0; g < m; g++) o.append(v[g], G()), P.nextNode(), s.push({ type: 2, index: ++i });
+            o.append(v[m], G());
           }
         }
       } else if (o.nodeType === 8) if (o.data === j5) s.push({ type: 2, index: i });
@@ -345,7 +345,7 @@ function B(C, e, t = C, l) {
   var n, a;
   if (e === O) return e;
   let o = l !== void 0 ? (n = t._$Co) == null ? void 0 : n[l] : t._$Cl;
-  const i = G(e) ? void 0 : e._$litDirective$;
+  const i = Y(e) ? void 0 : e._$litDirective$;
   return (o == null ? void 0 : o.constructor) !== i && ((a = o == null ? void 0 : o._$AO) == null || a.call(o, !1), i === void 0 ? o = void 0 : (o = new i(C), o._$AT(C, t, l)), l !== void 0 ? (t._$Co ?? (t._$Co = []))[l] = o : t._$Cl = o), o !== void 0 && (e = B(C, o._$AS(C, e.values), o, l)), e;
 }
 class R2 {
@@ -396,7 +396,7 @@ class n1 {
     return this._$AB;
   }
   _$AI(e, t = this) {
-    e = B(this, e, t), G(e) ? e === p || e == null || e === "" ? (this._$AH !== p && this._$AR(), this._$AH = p) : e !== this._$AH && e !== O && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Z2(e) ? this.k(e) : this._(e);
+    e = B(this, e, t), Y(e) ? e === p || e == null || e === "" ? (this._$AH !== p && this._$AR(), this._$AH = p) : e !== this._$AH && e !== O && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Z2(e) ? this.k(e) : this._(e);
   }
   O(e) {
     return this._$AA.parentNode.insertBefore(e, this._$AB);
@@ -405,11 +405,11 @@ class n1 {
     this._$AH !== e && (this._$AR(), this._$AH = this.O(e));
   }
   _(e) {
-    this._$AH !== p && G(this._$AH) ? this._$AA.nextSibling.data = e : this.T(z.createTextNode(e)), this._$AH = e;
+    this._$AH !== p && Y(this._$AH) ? this._$AA.nextSibling.data = e : this.T(z.createTextNode(e)), this._$AH = e;
   }
   $(e) {
     var i;
-    const { values: t, _$litType$: l } = e, o = typeof l == "number" ? this._$AC(e) : (l.el === void 0 && (l.el = Y.createElement(G5(l.h, l.h[0]), this.options)), l);
+    const { values: t, _$litType$: l } = e, o = typeof l == "number" ? this._$AC(e) : (l.el === void 0 && (l.el = W.createElement(G5(l.h, l.h[0]), this.options)), l);
     if (((i = this._$AH) == null ? void 0 : i._$AD) === o) this._$AH.p(t);
     else {
       const n = new R2(o, this), a = n.u(this.options);
@@ -418,13 +418,13 @@ class n1 {
   }
   _$AC(e) {
     let t = z5.get(e.strings);
-    return t === void 0 && z5.set(e.strings, t = new Y(e)), t;
+    return t === void 0 && z5.set(e.strings, t = new W(e)), t;
   }
   k(e) {
     I1(this._$AH) || (this._$AH = [], this._$AR());
     const t = this._$AH;
     let l, o = 0;
-    for (const i of e) o === t.length ? t.push(l = new n1(this.O(q()), this.O(q()), this, this.options)) : l = t[o], l._$AI(i), o++;
+    for (const i of e) o === t.length ? t.push(l = new n1(this.O(G()), this.O(G()), this, this.options)) : l = t[o], l._$AI(i), o++;
     o < t.length && (this._$AR(l && l._$AB.nextSibling, o), t.length = o);
   }
   _$AR(e = this._$AA.nextSibling, t) {
@@ -452,11 +452,11 @@ class f1 {
   _$AI(e, t = this, l, o) {
     const i = this.strings;
     let n = !1;
-    if (i === void 0) e = B(this, e, t, 0), n = !G(e) || e !== this._$AH && e !== O, n && (this._$AH = e);
+    if (i === void 0) e = B(this, e, t, 0), n = !Y(e) || e !== this._$AH && e !== O, n && (this._$AH = e);
     else {
       const a = e;
       let s, u;
-      for (e = i[0], s = 0; s < i.length - 1; s++) u = B(this, a[l + s], t, s), u === O && (u = this._$AH[s]), n || (n = !G(u) || u !== this._$AH[s]), u === p ? e = p : e !== p && (e += (u ?? "") + i[s + 1]), this._$AH[s] = u;
+      for (e = i[0], s = 0; s < i.length - 1; s++) u = B(this, a[l + s], t, s), u === O && (u = this._$AH[s]), n || (n = !Y(u) || u !== this._$AH[s]), u === p ? e = p : e !== p && (e += (u ?? "") + i[s + 1]), this._$AH[s] = u;
     }
     n && !o && this.j(e);
   }
@@ -505,14 +505,14 @@ class w2 {
     B(this, e);
   }
 }
-const Z1 = D.litHtmlPolyfillSupport;
-Z1 == null || Z1(Y, n1), (D.litHtmlVersions ?? (D.litHtmlVersions = [])).push("3.3.2");
+const Z1 = q.litHtmlPolyfillSupport;
+Z1 == null || Z1(W, n1), (q.litHtmlVersions ?? (q.litHtmlVersions = [])).push("3.3.2");
 const $2 = (C, e, t) => {
   const l = (t == null ? void 0 : t.renderBefore) ?? e;
   let o = l._$litPart$;
   if (o === void 0) {
     const i = (t == null ? void 0 : t.renderBefore) ?? null;
-    l._$litPart$ = o = new n1(e.insertBefore(q(), i), i, void 0, t ?? {});
+    l._$litPart$ = o = new n1(e.insertBefore(G(), i), i, void 0, t ?? {});
   }
   return o._$AI(C), o;
 };
@@ -681,14 +681,14 @@ D1.styles = h`
     .spinner { animation: circle 0.6s linear infinite; }
     @keyframes circle { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
   `;
-let W = D1;
+let X = D1;
 Y5([
   r()
-], W.prototype, "size");
+], X.prototype, "size");
 Y5([
   r()
-], W.prototype, "percent");
-customElements.get("anduin-spinner") || customElements.define("anduin-spinner", W);
+], X.prototype, "percent");
+customElements.get("anduin-spinner") || customElements.define("anduin-spinner", X);
 const S5 = {
   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" }],
@@ -1063,14 +1063,14 @@ q1.styles = h`
     :host { display: block; line-height: 0; font-family: var(--font-sans); }
     .icon--hidden { display: none; }
   `;
-let X = q1;
+let K = q1;
 W5([
   r()
-], X.prototype, "name");
+], K.prototype, "name");
 W5([
   r({ type: Number })
-], X.prototype, "size");
-customElements.get("anduin-icon") || customElements.define("anduin-icon", X);
+], K.prototype, "size");
+customElements.get("anduin-icon") || customElements.define("anduin-icon", K);
 var O2 = Object.defineProperty, B2 = (C, e, t, l) => {
   for (var o = void 0, i = C.length - 1, n; i >= 0; i--)
     (n = C[i]) && (o = n(e, t, o) || o);
@@ -1155,14 +1155,14 @@ const Y1 = class Y1 extends c {
   }
 };
 Y1.styles = [X5];
-let K = Y1;
+let F = Y1;
 F5([
   r()
-], K.prototype, "variant");
+], F.prototype, "variant");
 F5([
   r({ type: Number })
-], K.prototype, "count");
-customElements.get("anduin-badge-count") || customElements.define("anduin-badge-count", K);
+], F.prototype, "count");
+customElements.get("anduin-badge-count") || customElements.define("anduin-badge-count", F);
 var N2 = Object.defineProperty, H = (C, e, t, l) => {
   for (var o = void 0, i = C.length - 1, n; i >= 0; i--)
     (n = C[i]) && (o = n(e, t, o) || o);
@@ -1462,14 +1462,14 @@ K1.styles = h`
     .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 F = K1;
+let J = K1;
 J5([
   r()
-], F.prototype, "direction");
+], J.prototype, "direction");
 J5([
   H1()
-], F.prototype, "hasContent");
-customElements.get("anduin-divider") || customElements.define("anduin-divider", F);
+], J.prototype, "hasContent");
+customElements.get("anduin-divider") || customElements.define("anduin-divider", J);
 var q2 = Object.defineProperty, G2 = (C, e, t, l) => {
   for (var o = void 0, i = C.length - 1, n; i >= 0; i--)
     (n = C[i]) && (o = n(e, t, o) || o);
@@ -1534,15 +1534,15 @@ J1.styles = h`
       to { transform: translateX(330%); }
     }
   `;
-let J = J1;
+let Q = J1;
 Q5([
   r()
-], J.prototype, "percent");
+], Q.prototype, "percent");
 Q5([
   r()
-], J.prototype, "height");
-customElements.get("anduin-progress") || customElements.define("anduin-progress", J);
-var W2 = Object.defineProperty, T = (C, e, t, l) => {
+], Q.prototype, "height");
+customElements.get("anduin-progress") || customElements.define("anduin-progress", Q);
+var W2 = Object.defineProperty, U = (C, e, t, l) => {
   for (var o = void 0, i = C.length - 1, n; i >= 0; i--)
     (n = C[i]) && (o = n(e, t, o) || o);
   return o && W2(e, t, o), o;
@@ -1586,22 +1586,22 @@ Q1.styles = h`
     }
   `;
 let y = Q1;
-T([
+U([
   r()
 ], y.prototype, "effect");
-T([
+U([
   r()
 ], y.prototype, "shape");
-T([
+U([
   r()
 ], y.prototype, "height");
-T([
+U([
   r()
 ], y.prototype, "width");
-T([
+U([
   r({ type: Number })
 ], y.prototype, "duration");
-T([
+U([
   r({ attribute: "font-size" })
 ], y.prototype, "fontSize");
 customElements.get("anduin-skeleton") || customElements.define("anduin-skeleton", y);
@@ -1706,13 +1706,13 @@ o5.styles = h`
     .field-label { font-size: 13px; line-height: 20px; font-weight: 600; cursor: default; }
     .field-label__required { color: var(--color-danger-5); }
   `;
-let Q = o5;
+let e1 = o5;
 T1([
   r()
-], Q.prototype, "htmlfor");
+], e1.prototype, "htmlfor");
 T1([
   r({ type: Boolean })
-], Q.prototype, "required");
+], e1.prototype, "required");
 const l5 = class l5 extends c {
   render() {
     return d`<div class="field-description" part="description"><slot></slot></div>`;
@@ -1744,7 +1744,7 @@ i5.styles = h`
   `;
 let k1 = i5;
 customElements.get("anduin-field") || customElements.define("anduin-field", L1);
-customElements.get("anduin-field-label") || customElements.define("anduin-field-label", Q);
+customElements.get("anduin-field-label") || customElements.define("anduin-field-label", e1);
 customElements.get("anduin-field-description") || customElements.define("anduin-field-description", _1);
 customElements.get("anduin-field-error") || customElements.define("anduin-field-error", x1);
 customElements.get("anduin-field-group") || customElements.define("anduin-field-group", k1);
@@ -2030,14 +2030,14 @@ $([
   N1("textarea")
 ], Z.prototype, "textareaEl");
 customElements.get("anduin-textarea") || customElements.define("anduin-textarea", Z);
-var C4 = Object.defineProperty, m = (C, e, t, l) => {
+var C4 = Object.defineProperty, b = (C, e, t, l) => {
   for (var o = void 0, i = C.length - 1, n; i >= 0; i--)
     (n = C[i]) && (o = n(e, t, o) || o);
   return o && C4(e, t, o), o;
 };
 const t2 = "anduin-tab:trigger-click", m1 = "anduin-tab:value-changed", i4 = "anduin-tab:change", s5 = class s5 extends c {
   constructor() {
-    super(...arguments), this.defaultValue = "", this.value = "";
+    super(...arguments), this.defaultValue = "", this.value = "", this.fill = !1;
   }
   connectedCallback() {
     super.connectedCallback(), this.addEventListener(t2, (e) => {
@@ -2061,15 +2061,20 @@ const t2 = "anduin-tab:trigger-click", m1 = "anduin-tab:value-changed", i4 = "an
 };
 s5.styles = h`
     :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 e1 = s5;
-m([
+let I = s5;
+b([
   r({ attribute: "default-value" })
-], e1.prototype, "defaultValue");
-m([
+], I.prototype, "defaultValue");
+b([
   r()
-], e1.prototype, "value");
+], I.prototype, "value");
+b([
+  r({ type: Boolean, reflect: !0 })
+], I.prototype, "fill");
 const d5 = class d5 extends c {
   constructor() {
     super(...arguments), this.alignment = "left", this.lastActiveValue = "", this.resizeObserver = null;
@@ -2116,7 +2121,7 @@ const d5 = class d5 extends c {
 d5.styles = h`
     :host { display: block; font-family: var(--font-sans); }
     .tabs-list {
-      display: flex; font-weight: 500; background-color: var(--color-gray-0);
+      display: flex; background-color: var(--color-gray-0);
       border-bottom: 1px solid var(--color-gray-3); white-space: nowrap; overflow: hidden;
       padding: 0 4px; position: relative; gap: 8px;
     }
@@ -2129,10 +2134,10 @@ d5.styles = h`
     }
   `;
 let t1 = d5;
-m([
+b([
   r()
 ], t1.prototype, "alignment");
-m([
+b([
   N1(".tabs-list__indicator")
 ], t1.prototype, "indicator");
 const c5 = class c5 extends c {
@@ -2173,7 +2178,7 @@ c5.styles = h`
     :host { display: inline-block; font-family: var(--font-sans); }
     .tab-trigger {
       cursor: pointer; background: none; border: none; display: block;
-      font-family: var(--font-sans); font-size: 13px; line-height: 20px;
+      font-family: var(--font-sans); font-size: 13px; font-weight: 500; line-height: 20px;
       padding: 4px 0 6px;
     }
     .tab-trigger__content { padding: 8px 12px; border-radius: 4px; display: flex; align-items: center; gap: 8px; }
@@ -2193,22 +2198,22 @@ c5.styles = h`
     }
   `;
 let R = c5;
-m([
+b([
   r()
 ], R.prototype, "value");
-m([
+b([
   r({ attribute: "start-icon" })
 ], R.prototype, "startIcon");
-m([
+b([
   r({ type: Boolean })
 ], R.prototype, "disabled");
-m([
+b([
   r({ type: Boolean, attribute: "show-badge" })
 ], R.prototype, "showBadge");
-m([
+b([
   r({ attribute: "badge-count" })
 ], R.prototype, "badgeCount");
-m([
+b([
   H1()
 ], R.prototype, "isActive");
 const u5 = class u5 extends c {
@@ -2223,26 +2228,30 @@ const u5 = class u5 extends c {
       this.isActive = l.detail === this.value;
     });
   }
+  updated(e) {
+    e.has("isActive") && this.toggleAttribute("active", this.isActive);
+  }
   render() {
     return d`
       <div class="tab-content" role="tabpanel" tabindex="0" part="tab-content">
-        ${this.isActive ? d`<slot></slot>` : p}
+        <slot></slot>
       </div>
     `;
   }
 };
 u5.styles = h`
-    :host { display: block; font-family: var(--font-sans); }
-    .tab-content { width: 100%; }
+    :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 o1 = u5;
-m([
+b([
   r()
 ], o1.prototype, "value");
-m([
+b([
   H1()
 ], o1.prototype, "isActive");
-customElements.get("anduin-tabs") || customElements.define("anduin-tabs", e1);
+customElements.get("anduin-tabs") || customElements.define("anduin-tabs", I);
 customElements.get("anduin-tabs-list") || customElements.define("anduin-tabs-list", t1);
 customElements.get("anduin-tab-trigger") || customElements.define("anduin-tab-trigger", R);
 customElements.get("anduin-tab-content") || customElements.define("anduin-tab-content", o1);
@@ -2364,16 +2373,16 @@ p5.styles = h`
     .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 I = p5;
+let N = p5;
 U1([
   r()
-], I.prototype, "variant");
+], N.prototype, "variant");
 U1([
   r()
-], I.prototype, "icon");
+], N.prototype, "icon");
 U1([
   r({ type: Boolean })
-], I.prototype, "disabled");
+], N.prototype, "disabled");
 const h5 = class h5 extends c {
   onClick() {
     this.dispatchEvent(new CustomEvent(r4, { bubbles: !0, composed: !0 }));
@@ -2397,7 +2406,7 @@ h5.styles = h`
     .tag-close__button:active { opacity: 0.5; }
   `;
 let w1 = h5;
-customElements.get("anduin-tag") || customElements.define("anduin-tag", I);
+customElements.get("anduin-tag") || customElements.define("anduin-tag", N);
 customElements.get("anduin-tag-close") || customElements.define("anduin-tag-close", w1);
 var d4 = Object.defineProperty, o2 = (C, e, t, l) => {
   for (var o = void 0, i = C.length - 1, n; i >= 0; i--)
@@ -2474,11 +2483,11 @@ function u4(C, e, t, l = 8) {
     const c2 = Math.abs(g.off.left - u.left) + Math.abs(g.off.top - u.top), u2 = Math.abs(V.off.left - u.left) + Math.abs(V.off.top - u.top);
     return c2 - u2;
   });
-  const { p: v, off: b } = L[0];
+  const { p: v, off: m } = L[0];
   return {
     placement: v,
-    left: Math.round(Math.min(Math.max(b.left, 0), o - a)),
-    top: Math.round(Math.min(Math.max(b.top, 0), i - s))
+    left: Math.round(Math.min(Math.max(m.left, 0), o - a)),
+    top: Math.round(Math.min(Math.max(m.top, 0), i - s))
   };
 }
 function $1(C) {
@@ -3058,49 +3067,49 @@ V5.styles = h`
     anduin-icon { color: var(--color-gray-7); }
     .menu-item--danger anduin-icon { color: var(--color-danger-4); }
   `;
-let N = V5;
+let T = V5;
 a1([
   r()
-], N.prototype, "icon");
+], T.prototype, "icon");
 a1([
   r()
-], N.prototype, "variant");
+], T.prototype, "variant");
 a1([
   r({ type: Boolean })
-], N.prototype, "disabled");
+], T.prototype, "disabled");
 customElements.get("anduin-menu") || customElements.define("anduin-menu", i1);
-customElements.get("anduin-menu-item") || customElements.define("anduin-menu-item", N);
+customElements.get("anduin-menu-item") || customElements.define("anduin-menu-item", T);
 if (typeof document < "u" && !document.getElementById("acl-tokens")) {
   const C = document.createElement("style");
   C.id = "acl-tokens", C.textContent = p2, document.head.appendChild(C);
 }
 export {
   u1 as AnduinBadge,
-  K as AnduinBadgeCount,
+  F as AnduinBadgeCount,
   f as AnduinButton,
   p1 as AnduinCallout,
   k as AnduinCheckbox,
-  F as AnduinDivider,
+  J as AnduinDivider,
   h1 as AnduinDot,
   L1 as AnduinField,
   _1 as AnduinFieldDescription,
   x1 as AnduinFieldError,
   k1 as AnduinFieldGroup,
-  Q as AnduinFieldLabel,
-  X as AnduinIcon,
+  e1 as AnduinFieldLabel,
+  K as AnduinIcon,
   M as AnduinInput,
   v1 as AnduinLoadingState,
   i1 as AnduinMenu,
-  N as AnduinMenuItem,
+  T as AnduinMenuItem,
   C1 as AnduinPopover,
-  J as AnduinProgress,
+  Q as AnduinProgress,
   y as AnduinSkeleton,
-  W as AnduinSpinner,
+  X as AnduinSpinner,
   o1 as AnduinTabContent,
   R as AnduinTabTrigger,
-  e1 as AnduinTabs,
+  I as AnduinTabs,
   t1 as AnduinTabsList,
-  I as AnduinTag,
+  N as AnduinTag,
   w1 as AnduinTagClose,
   Z as AnduinTextarea,
   l1 as AnduinTooltip,

package/dist/react.d.ts

@@ -179,12 +179,39 @@ declare module 'react' {
         status?: string
       }
 
+      // ── anduin-popover ────────────────────────────────────────────────────
+      'anduin-popover': Base & {
+        /** Whether the panel is open (default: false) */
+        open?: boolean | string
+        /** 'bottom-start' | 'bottom' | 'bottom-end' | 'top-start' | 'top' | 'top-end'  (default: 'bottom-start') */
+        placement?: string
+      }
+
+      // ── anduin-menu ───────────────────────────────────────────────────────
+      'anduin-menu': Base & {
+        /** Whether the menu is open (default: false) */
+        open?: boolean | string
+        /** 'bottom-start' | 'bottom' | 'bottom-end' | 'top-start' | 'top' | 'top-end'  (default: 'bottom-start') */
+        placement?: string
+      }
+
+      // ── anduin-menu-item ──────────────────────────────────────────────────
+      'anduin-menu-item': Base & {
+        /** anduin-icon name shown before the label */
+        icon?: string
+        /** 'default' | 'danger'  (default: 'default') */
+        variant?: 'default' | 'danger'
+        disabled?: boolean | string
+      }
+
       // ── anduin-tabs ───────────────────────────────────────────────────────
       'anduin-tabs': Base & {
         /** Initially active tab value */
         'default-value'?: string
         /** Controlled active tab value */
         value?: string
+        /** Stretch tabs + active panel to fill parent height */
+        fill?: boolean | string
       }
 
       // ── anduin-tabs-list ──────────────────────────────────────────────────
@@ -200,6 +227,10 @@ declare module 'react' {
         /** anduin-icon name */
         'start-icon'?: string
         disabled?: boolean | string
+        /** Show a count badge on the trigger */
+        'show-badge'?: boolean | string
+        /** Text shown inside the badge */
+        'badge-count'?: string
       }
 
       // ── anduin-tab-content ────────────────────────────────────────────────

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@duyluonganduin/acl-web-components",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "type": "module",
   "main": "./dist/acl-web-components.cjs",
   "module": "./dist/acl-web-components.js",