@nextrap/nte-nav 1.1.18 → 1.1.20

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+## 1.1.20 (2025-09-11)
+
+This was a version bump only for nte-nav to align it with other projects, there were no code changes.
+
+## 1.1.19 (2025-09-11)
+
+This was a version bump only for nte-nav to align it with other projects, there were no code changes.
+
 ## 1.1.18 (2025-09-11)
 
 This was a version bump only for nte-nav to align it with other projects, there were no code changes.

package/index.js

@@ -1,32 +1,32 @@
-import { waitForDomContentLoaded as q, isBiggerThanBreakpoint as yt, Debouncer as ne, SlotTool as Ct, waitForLoad as oe } from "@nextrap/nt-framework";
+import { waitForDomContentLoaded as H, isBiggerThanBreakpoint as St, Debouncer as oe, SlotTool as Pt, waitForLoad as se } from "@nextrap/nt-framework";
 import "@nextrap/nte-offcanvas";
-import { html as P, unsafeCSS as H, LitElement as j } from "lit";
-import { customElement as J, property as z, state as K } from "lit/decorators.js";
-import { createRef as St, ref as $t } from "lit/directives/ref.js";
-import { EventBindingsMixin as se, LoggingMixin as le, Listen as de } from "@trunkjs/browser-utils";
-import { styleMap as ce } from "lit/directives/style-map.js";
+import { html as P, unsafeCSS as J, LitElement as K } from "lit";
+import { customElement as Q, property as z, state as V } from "lit/decorators.js";
+import { createRef as $t, ref as xt } from "lit/directives/ref.js";
+import { EventBindingsMixin as le, LoggingMixin as de, Listen as ce } from "@trunkjs/browser-utils";
+import { styleMap as he } from "lit/directives/style-map.js";
 import "@nextrap/nte-burger";
-const he = ":host{--container-width: var(--nt-container-width);--text-color: var(--nt-text);--hover-color: var(--nt-primary);--hover-text-color: var(--nt-text-on-primary);--transition: .2s ease-in-out;--submenu-bg: var(--nt-light);--submenu-text-color: var(--nt-text);--justify-content: center;--sidemenu-bg: var(--nt-primary-subtle);--justify-sidebar-burger: flex-end;--height: auto;--default-alpha: .7;height:var(--height);display:block}nav{height:100%}#main{height:100%}#burger-wrapper{padding:15px}#text{padding-right:10px}#burger-default{cursor:pointer}#burger-default slot::slotted(span){color:rgb(from var(--text-color) r g b/var(--default-alpha));transition:color var(--transition)}#burger-default nte-burger{--color: rgb(from var(--text-color) r g b / var(--default-alpha))}#burger-default:hover slot::slotted(span){color:rgb(from var(--text-color) r g b/1)}#burger-default:hover nte-burger{--color: rgb(from var(--text-color) r g b / 1)}";
-var pe = Object.create, et = Object.defineProperty, ve = Object.getOwnPropertyDescriptor, Pt = (t, e) => (e = Symbol[t]) ? e : Symbol.for("Symbol." + t), L = (t) => {
+const pe = ":host{--container-width: var(--nt-container-width);--text-color: var(--nt-text);--hover-color: var(--nt-primary);--hover-text-color: var(--nt-text-on-primary);--transition: .2s ease-in-out;--submenu-bg: var(--nt-light);--submenu-text-color: var(--nt-text);--justify-content: center;--sidemenu-bg: var(--nt-primary-subtle);--justify-sidebar-burger: flex-end;--height: auto;--default-alpha: .7;height:var(--height);display:block}nav{height:100%}#main{height:100%}#burger-wrapper{padding:15px}#text{padding-right:10px}#burger-default{cursor:pointer}#burger-default slot::slotted(span){color:rgb(from var(--text-color) r g b/var(--default-alpha));transition:color var(--transition)}#burger-default nte-burger{--color: rgb(from var(--text-color) r g b / var(--default-alpha))}#burger-default:hover slot::slotted(span){color:rgb(from var(--text-color) r g b/1)}#burger-default:hover nte-burger{--color: rgb(from var(--text-color) r g b / 1)}";
+var ve = Object.create, rt = Object.defineProperty, ue = Object.getOwnPropertyDescriptor, Mt = (t, e) => (e = Symbol[t]) ? e : Symbol.for("Symbol." + t), L = (t) => {
   throw TypeError(t);
-}, ue = (t, e, r) => e in t ? et(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, xt = (t, e) => et(t, "name", { value: e, configurable: !0 }), _e = (t) => [, , , pe((t == null ? void 0 : t[Pt("metadata")]) ?? null)], Mt = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], F = (t) => t !== void 0 && typeof t != "function" ? L("Function expected") : t, fe = (t, e, r, o, a) => ({ kind: Mt[t], name: e, metadata: o, addInitializer: (n) => r._ ? L("Already initialized") : a.push(F(n || null)) }), ge = (t, e) => ue(e, Pt("metadata"), t[3]), S = (t, e, r, o) => {
+}, fe = (t, e, r) => e in t ? rt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, kt = (t, e) => rt(t, "name", { value: e, configurable: !0 }), _e = (t) => [, , , ve((t == null ? void 0 : t[Mt("metadata")]) ?? null)], Lt = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], D = (t) => t !== void 0 && typeof t != "function" ? L("Function expected") : t, ge = (t, e, r, o, a) => ({ kind: Lt[t], name: e, metadata: o, addInitializer: (n) => r._ ? L("Already initialized") : a.push(D(n || null)) }), be = (t, e) => fe(e, Mt("metadata"), t[3]), S = (t, e, r, o) => {
   for (var a = 0, n = t[e >> 1], h = n && n.length; a < h; a++) e & 1 ? n[a].call(r) : o = n[a].call(r, o);
   return o;
 }, W = (t, e, r, o, a, n) => {
-  var h, s, m, p, f, i = e & 7, g = !!(e & 8), d = !!(e & 16), _ = i > 3 ? t.length + 1 : i ? g ? 1 : 2 : 0, k = Mt[i + 5], E = i > 3 && (t[_ - 1] = []), R = t[_] || (t[_] = []), c = i && (!d && !g && (a = a.prototype), i < 5 && (i > 3 || !d) && ve(i < 4 ? a : { get [r]() {
-    return kt(this, n);
+  var h, s, m, p, _, i = e & 7, g = !!(e & 8), d = !!(e & 16), f = i > 3 ? t.length + 1 : i ? g ? 1 : 2 : 0, k = Lt[i + 5], E = i > 3 && (t[f - 1] = []), R = t[f] || (t[f] = []), c = i && (!d && !g && (a = a.prototype), i < 5 && (i > 3 || !d) && ue(i < 4 ? a : { get [r]() {
+    return Et(this, n);
   }, set [r](l) {
-    return Et(this, n, l);
+    return zt(this, n, l);
   } }, r));
-  i ? d && i < 4 && xt(n, (i > 2 ? "set " : i > 1 ? "get " : "") + r) : xt(a, r);
+  i ? d && i < 4 && kt(n, (i > 2 ? "set " : i > 1 ? "get " : "") + r) : kt(a, r);
   for (var w = o.length - 1; w >= 0; w--)
-    p = fe(i, r, m = {}, t[3], R), i && (p.static = g, p.private = d, f = p.access = { has: d ? (l) => be(a, l) : (l) => r in l }, i ^ 3 && (f.get = d ? (l) => (i ^ 1 ? kt : me)(l, a, i ^ 4 ? n : c.get) : (l) => l[r]), i > 2 && (f.set = d ? (l, y) => Et(l, a, y, i ^ 4 ? n : c.set) : (l, y) => l[r] = y)), s = (0, o[w])(i ? i < 4 ? d ? n : c[k] : i > 4 ? void 0 : { get: c.get, set: c.set } : a, p), m._ = 1, i ^ 4 || s === void 0 ? F(s) && (i > 4 ? E.unshift(s) : i ? d ? n = s : c[k] = s : a = s) : typeof s != "object" || s === null ? L("Object expected") : (F(h = s.get) && (c.get = h), F(h = s.set) && (c.set = h), F(h = s.init) && E.unshift(h));
-  return i || ge(t, a), c && et(a, r, c), d ? i ^ 4 ? n : c : a;
-}, rt = (t, e, r) => e.has(t) || L("Cannot " + r), be = (t, e) => Object(e) !== e ? L('Cannot use the "in" operator on this value') : t.has(e), kt = (t, e, r) => (rt(t, e, "read from private field"), r ? r.call(t) : e.get(t)), D = (t, e, r) => e.has(t) ? L("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, r), Et = (t, e, r, o) => (rt(t, e, "write to private field"), o ? o.call(t, r) : e.set(t, r), r), me = (t, e, r) => (rt(t, e, "access private method"), r), Lt, Wt, It, Bt, Rt, Q, Dt, u, it, at, nt, ot, st;
-Dt = [J("nte-nav")];
-class x extends (Q = j, Rt = [z({ type: String, reflect: !0 })], Bt = [z({ type: String, reflect: !0 })], It = [z({ type: String, reflect: !0, attribute: "transfer-to" })], Wt = [z({ type: String, reflect: !1, attribute: "data-group-name" })], Lt = [K()], Q) {
+    p = ge(i, r, m = {}, t[3], R), i && (p.static = g, p.private = d, _ = p.access = { has: d ? (l) => me(a, l) : (l) => r in l }, i ^ 3 && (_.get = d ? (l) => (i ^ 1 ? Et : we)(l, a, i ^ 4 ? n : c.get) : (l) => l[r]), i > 2 && (_.set = d ? (l, y) => zt(l, a, y, i ^ 4 ? n : c.set) : (l, y) => l[r] = y)), s = (0, o[w])(i ? i < 4 ? d ? n : c[k] : i > 4 ? void 0 : { get: c.get, set: c.set } : a, p), m._ = 1, i ^ 4 || s === void 0 ? D(s) && (i > 4 ? E.unshift(s) : i ? d ? n = s : c[k] = s : a = s) : typeof s != "object" || s === null ? L("Object expected") : (D(h = s.get) && (c.get = h), D(h = s.set) && (c.set = h), D(h = s.init) && E.unshift(h));
+  return i || be(t, a), c && rt(a, r, c), d ? i ^ 4 ? n : c : a;
+}, it = (t, e, r) => e.has(t) || L("Cannot " + r), me = (t, e) => Object(e) !== e ? L('Cannot use the "in" operator on this value') : t.has(e), Et = (t, e, r) => (it(t, e, "read from private field"), r ? r.call(t) : e.get(t)), A = (t, e, r) => e.has(t) ? L("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, r), zt = (t, e, r, o) => (it(t, e, "write to private field"), o ? o.call(t, r) : e.set(t, r), r), we = (t, e, r) => (it(t, e, "access private method"), r), Wt, It, Bt, Rt, At, X, Dt, u, at, nt, ot, st, lt;
+Dt = [Q("nte-nav")];
+class x extends (X = K, At = [z({ type: String, reflect: !0 })], Rt = [z({ type: String, reflect: !0 })], Bt = [z({ type: String, reflect: !0, attribute: "transfer-to" })], It = [z({ type: String, reflect: !1, attribute: "data-group-name" })], Wt = [V()], X) {
   constructor() {
-    super(), D(this, it, S(u, 8, this, "slave")), S(u, 11, this), D(this, at, S(u, 12, this, "99999px")), S(u, 15, this), D(this, nt, S(u, 16, this, "")), S(u, 19, this), D(this, ot, S(u, 20, this, "")), S(u, 23, this), D(this, st, S(u, 24, this, !1)), S(u, 27, this);
+    super(), A(this, at, S(u, 8, this, "slave")), S(u, 11, this), A(this, nt, S(u, 12, this, "99999px")), S(u, 15, this), A(this, ot, S(u, 16, this, "")), S(u, 19, this), A(this, st, S(u, 20, this, "")), S(u, 23, this), A(this, lt, S(u, 24, this, !1)), S(u, 27, this);
   }
   getOffcanvas() {
     return this.transferTo ? document.querySelector(this.transferTo) : null;
@@ -89,46 +89,46 @@ class x extends (Q = j, Rt = [z({ type: String, reflect: !0 })], Bt = [z({ type:
     !r.contains("nav-vertical") && !r.contains("nav-horizontal") && r.add(this.closest("nte-offcanvas") === null ? "nav-horizontal" : "nav-vertical");
   }
   async connectedCallback() {
-    await q(), super.connectedCallback(), this.mode !== "slave" && this.transferTo !== "" && (this._isTransferred = !1, this.breakpoint !== "" && (yt(this.breakpoint) || (this._isTransferred = !0), window.addEventListener("breakpoint-changed", (e) => {
-      yt(this.breakpoint) ? this._isTransferred = !1 : this._isTransferred = !0;
+    await H(), super.connectedCallback(), this.mode !== "slave" && this.transferTo !== "" && (this._isTransferred = !1, this.breakpoint !== "" && (St(this.breakpoint) || (this._isTransferred = !0), window.addEventListener("breakpoint-changed", (e) => {
+      St(this.breakpoint) ? this._isTransferred = !1 : this._isTransferred = !0;
     })));
   }
 }
-u = _e(Q);
-it = /* @__PURE__ */ new WeakMap();
+u = _e(X);
 at = /* @__PURE__ */ new WeakMap();
 nt = /* @__PURE__ */ new WeakMap();
 ot = /* @__PURE__ */ new WeakMap();
 st = /* @__PURE__ */ new WeakMap();
-W(u, 4, "mode", Rt, x, it);
-W(u, 4, "breakpoint", Bt, x, at);
-W(u, 4, "transferTo", It, x, nt);
-W(u, 4, "dataGroupName", Wt, x, ot);
-W(u, 4, "_isTransferred", Lt, x, st);
+lt = /* @__PURE__ */ new WeakMap();
+W(u, 4, "mode", At, x, at);
+W(u, 4, "breakpoint", Rt, x, nt);
+W(u, 4, "transferTo", Bt, x, ot);
+W(u, 4, "dataGroupName", It, x, st);
+W(u, 4, "_isTransferred", Wt, x, lt);
 x = W(u, 0, "NteNav", Dt, x);
-x.styles = [H(he)];
+x.styles = [J(pe)];
 S(u, 1, x);
-const we = "*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;width:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit;color:inherit;background:none;border:none;outline:none}a,i{color:inherit;text-decoration:none}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}slot{display:contents}:host{--bg: transparent;--spacer-bg: transparent;--container-width: var(--nt-container-width, 100%);--brand-height: 80px;--spacer-height: 80px;width:100vw;margin:0}:host(a){height:85px;width:auto}#wrapper{position:relative;left:0;top:0;right:0;width:100%}#spacer{position:relative;top:0;left:0;width:100%;transition:height .3s ease-in-out;height:var(--spacer-height);background-color:var(--spacer-bg)}#navbar{position:absolute;top:0;width:100vw;height:auto;background-color:var(--bg);z-index:1000}#main{width:100vw;display:block}";
-var ye = Object.create, lt = Object.defineProperty, Se = Object.getOwnPropertyDescriptor, Ft = (t, e) => (e = Symbol[t]) ? e : Symbol.for("Symbol." + t), I = (t) => {
+const ye = "*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;width:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit;color:inherit;background:none;border:none;outline:none}a,i{color:inherit;text-decoration:none}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}slot{display:contents}:host{--bg: transparent;--spacer-bg: transparent;--container-width: var(--nt-container-width, 100%);--brand-height: 80px;--spacer-height: 80px;width:100vw;margin:0}:host(a){height:85px;width:auto}#wrapper{position:relative;left:0;top:0;right:0;width:100%}#spacer{position:relative;top:0;left:0;width:100%;transition:height .3s ease-in-out;height:var(--spacer-height);background-color:var(--spacer-bg)}#navbar{position:absolute;top:0;width:100vw;height:auto;background-color:var(--bg);z-index:1000}#main{width:100vw;display:block}";
+var Se = Object.create, dt = Object.defineProperty, $e = Object.getOwnPropertyDescriptor, Ft = (t, e) => (e = Symbol[t]) ? e : Symbol.for("Symbol." + t), I = (t) => {
   throw TypeError(t);
-}, $e = (t, e, r) => e in t ? lt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, zt = (t, e) => lt(t, "name", { value: e, configurable: !0 }), xe = (t) => [, , , ye((t == null ? void 0 : t[Ft("metadata")]) ?? null)], Yt = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], Y = (t) => t !== void 0 && typeof t != "function" ? I("Function expected") : t, ke = (t, e, r, o, a) => ({ kind: Yt[t], name: e, metadata: o, addInitializer: (n) => r._ ? I("Already initialized") : a.push(Y(n || null)) }), Ee = (t, e) => $e(e, Ft("metadata"), t[3]), V = (t, e, r, o) => {
+}, xe = (t, e, r) => e in t ? dt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, Nt = (t, e) => dt(t, "name", { value: e, configurable: !0 }), ke = (t) => [, , , Se((t == null ? void 0 : t[Ft("metadata")]) ?? null)], Yt = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], F = (t) => t !== void 0 && typeof t != "function" ? I("Function expected") : t, Ee = (t, e, r, o, a) => ({ kind: Yt[t], name: e, metadata: o, addInitializer: (n) => r._ ? I("Already initialized") : a.push(F(n || null)) }), ze = (t, e) => xe(e, Ft("metadata"), t[3]), Z = (t, e, r, o) => {
   for (var a = 0, n = t[e >> 1], h = n && n.length; a < h; a++) e & 1 ? n[a].call(r) : o = n[a].call(r, o);
   return o;
-}, At = (t, e, r, o, a, n) => {
-  var h, s, m, p, f, i = e & 7, g = !!(e & 8), d = !!(e & 16), _ = i > 3 ? t.length + 1 : i ? g ? 1 : 2 : 0, k = Yt[i + 5], E = i > 3 && (t[_ - 1] = []), R = t[_] || (t[_] = []), c = i && (!d && !g && (a = a.prototype), i < 5 && (i > 3 || !d) && Se(i < 4 ? a : { get [r]() {
-    return Nt(this, n);
+}, Ut = (t, e, r, o, a, n) => {
+  var h, s, m, p, _, i = e & 7, g = !!(e & 8), d = !!(e & 16), f = i > 3 ? t.length + 1 : i ? g ? 1 : 2 : 0, k = Yt[i + 5], E = i > 3 && (t[f - 1] = []), R = t[f] || (t[f] = []), c = i && (!d && !g && (a = a.prototype), i < 5 && (i > 3 || !d) && $e(i < 4 ? a : { get [r]() {
+    return Ot(this, n);
   }, set [r](l) {
-    return Ot(this, n, l);
+    return Ct(this, n, l);
   } }, r));
-  i ? d && i < 4 && zt(n, (i > 2 ? "set " : i > 1 ? "get " : "") + r) : zt(a, r);
+  i ? d && i < 4 && Nt(n, (i > 2 ? "set " : i > 1 ? "get " : "") + r) : Nt(a, r);
   for (var w = o.length - 1; w >= 0; w--)
-    p = ke(i, r, m = {}, t[3], R), i && (p.static = g, p.private = d, f = p.access = { has: d ? (l) => ze(a, l) : (l) => r in l }, i ^ 3 && (f.get = d ? (l) => (i ^ 1 ? Nt : Oe)(l, a, i ^ 4 ? n : c.get) : (l) => l[r]), i > 2 && (f.set = d ? (l, y) => Ot(l, a, y, i ^ 4 ? n : c.set) : (l, y) => l[r] = y)), s = (0, o[w])(i ? i < 4 ? d ? n : c[k] : i > 4 ? void 0 : { get: c.get, set: c.set } : a, p), m._ = 1, i ^ 4 || s === void 0 ? Y(s) && (i > 4 ? E.unshift(s) : i ? d ? n = s : c[k] = s : a = s) : typeof s != "object" || s === null ? I("Object expected") : (Y(h = s.get) && (c.get = h), Y(h = s.set) && (c.set = h), Y(h = s.init) && E.unshift(h));
-  return i || Ee(t, a), c && lt(a, r, c), d ? i ^ 4 ? n : c : a;
-}, dt = (t, e, r) => e.has(t) || I("Cannot " + r), ze = (t, e) => Object(e) !== e ? I('Cannot use the "in" operator on this value') : t.has(e), Nt = (t, e, r) => (dt(t, e, "read from private field"), r ? r.call(t) : e.get(t)), Ne = (t, e, r) => e.has(t) ? I("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, r), Ot = (t, e, r, o) => (dt(t, e, "write to private field"), o ? o.call(t, r) : e.set(t, r), r), Oe = (t, e, r) => (dt(t, e, "access private method"), r), Ut, X, Gt, M, ct;
-Gt = [J("nte-navbar")];
-class U extends (X = j, Ut = [z({ type: Number, attribute: "scroll-threshold", reflect: !0 })], X) {
+    p = Ee(i, r, m = {}, t[3], R), i && (p.static = g, p.private = d, _ = p.access = { has: d ? (l) => Ne(a, l) : (l) => r in l }, i ^ 3 && (_.get = d ? (l) => (i ^ 1 ? Ot : Ce)(l, a, i ^ 4 ? n : c.get) : (l) => l[r]), i > 2 && (_.set = d ? (l, y) => Ct(l, a, y, i ^ 4 ? n : c.set) : (l, y) => l[r] = y)), s = (0, o[w])(i ? i < 4 ? d ? n : c[k] : i > 4 ? void 0 : { get: c.get, set: c.set } : a, p), m._ = 1, i ^ 4 || s === void 0 ? F(s) && (i > 4 ? E.unshift(s) : i ? d ? n = s : c[k] = s : a = s) : typeof s != "object" || s === null ? I("Object expected") : (F(h = s.get) && (c.get = h), F(h = s.set) && (c.set = h), F(h = s.init) && E.unshift(h));
+  return i || ze(t, a), c && dt(a, r, c), d ? i ^ 4 ? n : c : a;
+}, ct = (t, e, r) => e.has(t) || I("Cannot " + r), Ne = (t, e) => Object(e) !== e ? I('Cannot use the "in" operator on this value') : t.has(e), Ot = (t, e, r) => (ct(t, e, "read from private field"), r ? r.call(t) : e.get(t)), Oe = (t, e, r) => e.has(t) ? I("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, r), Ct = (t, e, r, o) => (ct(t, e, "write to private field"), o ? o.call(t, r) : e.set(t, r), r), Ce = (t, e, r) => (ct(t, e, "access private method"), r), Gt, tt, qt, M, ht;
+qt = [Q("nte-navbar")];
+class U extends (tt = K, Gt = [z({ type: Number, attribute: "scroll-threshold", reflect: !0 })], tt) {
   constructor() {
-    super(), this.navbarRef = St(), this.spacerRef = St(), Ne(this, ct, V(M, 8, this, 0)), V(M, 11, this), this._lastScrollY = window.scrollY, this._scrollUpPixels = 0, this._debouncer = void 0, this._debouncer = new ne(100, 300), document.addEventListener(
+    super(), this.navbarRef = $t(), this.spacerRef = $t(), Oe(this, ht, Z(M, 8, this, 0)), Z(M, 11, this), this._lastScrollY = window.scrollY, this._scrollUpPixels = 0, this._debouncer = void 0, this._debouncer = new oe(100, 300), document.addEventListener(
       "scroll",
       async () => {
         this.updateScrollState();
@@ -144,20 +144,20 @@ class U extends (X = j, Ut = [z({ type: Number, attribute: "scroll-threshold", r
     e > 1 ? this.classList.add("is-scrolled") : this.classList.remove("is-scrolled"), e < this._lastScrollY ? (this._scrollUpPixels += this._lastScrollY - e, this._scrollUpPixels > 10 && e < this.scrollThreshold && this.classList.add("is-scrolling-up")) : (this._scrollUpPixels = 0, this.classList.remove("is-scrolling-up")), e > this.scrollThreshold ? this.classList.add("is-below-threshold") : this.classList.remove("is-below-threshold"), this._lastScrollY = e;
   }
   async connectedCallback() {
-    this.updateScrollState(), await q(), super.connectedCallback();
+    this.updateScrollState(), await H(), super.connectedCallback();
   }
   // Adjust the spacer height on every render
   async updated(e) {
-    await q(), super.updated(e);
+    await H(), super.updated(e);
   }
   firstUpdated(e) {
-    Ct.observeEmptySlots(this);
+    Pt.observeEmptySlots(this);
   }
   render() {
     return P`
       <div id="wrapper" part="wrapper">
-        <div id="spacer" part="spacer" ${$t(this.spacerRef)}></div>
-        <div id="navbar" part="navbar" ${$t(this.navbarRef)}>
+        <div id="spacer" part="spacer" ${xt(this.spacerRef)}></div>
+        <div id="navbar" part="navbar" ${xt(this.navbarRef)}>
           <div id="brand" part="brand">
             <slot name="brand"></slot>
           </div>
@@ -169,27 +169,27 @@ class U extends (X = j, Ut = [z({ type: Number, attribute: "scroll-threshold", r
     `;
   }
 }
-M = xe(X);
-ct = /* @__PURE__ */ new WeakMap();
-At(M, 4, "scrollThreshold", Ut, U, ct);
-U = At(M, 0, "NteNavbar", Gt, U);
-U.styles = [H(we)];
-V(M, 1, U);
+M = ke(tt);
+ht = /* @__PURE__ */ new WeakMap();
+Ut(M, 4, "scrollThreshold", Gt, U, ht);
+U = Ut(M, 0, "NteNavbar", qt, U);
+U.styles = [J(ye)];
+Z(M, 1, U);
 const Te = "*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;width:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit;color:inherit;background:none;border:none;outline:none}a,i{color:inherit;text-decoration:none}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}slot{display:contents}:host{--container-width: var(--nt-container-width, 100%);--background: transparent;--text-color: var(--nt-text);--height: auto;--brand-height: 80px;display:block;height:100%;width:100vw}:host(.hide-on-scroll){transition:max-height .3s ease-in-out;max-height:100px}:host(.hide-on-scroll.is-scrolled){max-height:0;overflow:hidden}#main{height:var(--height);transition:height .2s ease-in-out;overflow:visible;width:100%;display:flex;background:var(--background)}#container{width:var(--container-width);margin:0 auto;display:flex}#container #brand:has(slot[empty]){display:none}#container #brand{min-width:0;flex-shrink:1;width:auto;align-items:start;display:flex;height:100%;justify-items:center}#container #nav{display:flex;flex-grow:1;justify-content:end;align-items:center;gap:1rem}";
-var Ce = Object.create, ht = Object.defineProperty, Pe = Object.getOwnPropertyDescriptor, qt = (t, e) => (e = Symbol[t]) ? e : Symbol.for("Symbol." + t), Ht = (t) => {
+var Pe = Object.create, pt = Object.defineProperty, Me = Object.getOwnPropertyDescriptor, Ht = (t, e) => (e = Symbol[t]) ? e : Symbol.for("Symbol." + t), jt = (t) => {
   throw TypeError(t);
-}, Me = (t, e, r) => e in t ? ht(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, Le = (t, e) => ht(t, "name", { value: e, configurable: !0 }), We = (t) => [, , , Ce((t == null ? void 0 : t[qt("metadata")]) ?? null)], Ie = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], jt = (t) => t !== void 0 && typeof t != "function" ? Ht("Function expected") : t, Be = (t, e, r, o, a) => ({ kind: Ie[t], name: e, metadata: o, addInitializer: (n) => r._ ? Ht("Already initialized") : a.push(jt(n || null)) }), Re = (t, e) => Me(e, qt("metadata"), t[3]), De = (t, e, r, o) => {
+}, Le = (t, e, r) => e in t ? pt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, We = (t, e) => pt(t, "name", { value: e, configurable: !0 }), Ie = (t) => [, , , Pe((t == null ? void 0 : t[Ht("metadata")]) ?? null)], Be = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], Jt = (t) => t !== void 0 && typeof t != "function" ? jt("Function expected") : t, Re = (t, e, r, o, a) => ({ kind: Be[t], name: e, metadata: o, addInitializer: (n) => r._ ? jt("Already initialized") : a.push(Jt(n || null)) }), Ae = (t, e) => Le(e, Ht("metadata"), t[3]), De = (t, e, r, o) => {
   for (var a = 0, n = t[e >> 1], h = n && n.length; a < h; a++) n[a].call(r);
   return o;
 }, Fe = (t, e, r, o, a, n) => {
-  var h, s, m, p = e & 7, f = !1, i = 0, g = t[i] || (t[i] = []), d = p && (a = a.prototype, p < 5 && (p > 3 || !f) && Pe(a, r));
-  Le(a, r);
-  for (var _ = o.length - 1; _ >= 0; _--)
-    m = Be(p, r, s = {}, t[3], g), h = (0, o[_])(a, m), s._ = 1, jt(h) && (a = h);
-  return Re(t, a), d && ht(a, r, d), f ? p ^ 4 ? n : d : a;
-}, Jt, pt, Kt;
-Jt = [J("nte-navbar-line")];
-const wt = class wt extends (Kt = j) {
+  var h, s, m, p = e & 7, _ = !1, i = 0, g = t[i] || (t[i] = []), d = p && (a = a.prototype, p < 5 && (p > 3 || !_) && Me(a, r));
+  We(a, r);
+  for (var f = o.length - 1; f >= 0; f--)
+    m = Re(p, r, s = {}, t[3], g), h = (0, o[f])(a, m), s._ = 1, Jt(h) && (a = h);
+  return Ae(t, a), d && pt(a, r, d), _ ? p ^ 4 ? n : d : a;
+}, Kt, vt, Qt;
+Kt = [Q("nte-navbar-line")];
+const yt = class yt extends (Qt = K) {
   constructor() {
     super(...arguments), this._isScrolled = !1;
   }
@@ -204,7 +204,7 @@ const wt = class wt extends (Kt = j) {
     super.connectedCallback(), window.addEventListener("scroll", () => this.updateScrollState(), { passive: !0 });
   }
   async firstUpdated(e) {
-    Ct.observeEmptySlots(this), this.updateScrollState();
+    Pt.observeEmptySlots(this), this.updateScrollState();
   }
   render() {
     return P`
@@ -221,32 +221,32 @@ const wt = class wt extends (Kt = j) {
     `;
   }
 };
-wt.styles = [H(Te)];
-let G = wt;
-pt = We(Kt);
-G = Fe(pt, 0, "NteNavbarLine", Jt, G);
-De(pt, 1, G);
+yt.styles = [J(Te)];
+let G = yt;
+vt = Ie(Qt);
+G = Fe(vt, 0, "NteNavbarLine", Kt, G);
+De(vt, 1, G);
 const Ye = ":host{display:block;--animation-duration: .3s;--auto-aspect-ratio: unset;aspect-ratio:var(--auto-aspect-ratio);height:auto;width:auto}.wrapper{--orig-top: 0;--orig-left: 0;--orig-width: 0;--orig-height: 0;--self-top: 0;--self-left: 0;--self-width: 100%;--self-height: 100%;display:inline-block;width:var(--self-width);height:var(--self-height);object-fit:contain;overflow:visible;position:fixed;opacity:0}.wrapper.initialized{opacity:1}.wrapper{top:var(--self-top);left:var(--self-left);transition:all var(--animation-duration) ease-in-out}.wrapper.inactive{z-index:99999;top:calc(var(--orig-top));left:calc(var(--orig-left));width:var(--orig-width);height:var(--orig-height)}.wrapper.inactive.done{z-index:inherit;visibility:hidden}.wrapper>slot{display:contents}.wrapper ::slotted(*){width:100%;height:100%;object-fit:contain;transition:all .3s ease-in-out}";
-var Ae = Object.create, vt = Object.defineProperty, Ue = Object.getOwnPropertyDescriptor, Qt = (t, e) => (e = Symbol[t]) ? e : Symbol.for("Symbol." + t), B = (t) => {
+var Ue = Object.create, ut = Object.defineProperty, Ge = Object.getOwnPropertyDescriptor, Vt = (t, e) => (e = Symbol[t]) ? e : Symbol.for("Symbol." + t), B = (t) => {
   throw TypeError(t);
-}, Ge = (t, e, r) => e in t ? vt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, Tt = (t, e) => vt(t, "name", { value: e, configurable: !0 }), qe = (t) => [, , , Ae((t == null ? void 0 : t[Qt("metadata")]) ?? null)], Vt = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], A = (t) => t !== void 0 && typeof t != "function" ? B("Function expected") : t, He = (t, e, r, o, a) => ({ kind: Vt[t], name: e, metadata: o, addInitializer: (n) => r._ ? B("Already initialized") : a.push(A(n || null)) }), je = (t, e) => Ge(e, Qt("metadata"), t[3]), b = (t, e, r, o) => {
+}, qe = (t, e, r) => e in t ? ut(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, Tt = (t, e) => ut(t, "name", { value: e, configurable: !0 }), He = (t) => [, , , Ue((t == null ? void 0 : t[Vt("metadata")]) ?? null)], Xt = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], Y = (t) => t !== void 0 && typeof t != "function" ? B("Function expected") : t, je = (t, e, r, o, a) => ({ kind: Xt[t], name: e, metadata: o, addInitializer: (n) => r._ ? B("Already initialized") : a.push(Y(n || null)) }), Je = (t, e) => qe(e, Vt("metadata"), t[3]), b = (t, e, r, o) => {
   for (var a = 0, n = t[e >> 1], h = n && n.length; a < h; a++) e & 1 ? n[a].call(r) : o = n[a].call(r, o);
   return o;
-}, O = (t, e, r, o, a, n) => {
-  var h, s, m, p, f, i = e & 7, g = !!(e & 8), d = !!(e & 16), _ = i > 3 ? t.length + 1 : i ? g ? 1 : 2 : 0, k = Vt[i + 5], E = i > 3 && (t[_ - 1] = []), R = t[_] || (t[_] = []), c = i && (!d && !g && (a = a.prototype), i < 5 && (i > 3 || !d) && Ue(i < 4 ? a : { get [r]() {
+}, T = (t, e, r, o, a, n) => {
+  var h, s, m, p, _, i = e & 7, g = !!(e & 8), d = !!(e & 16), f = i > 3 ? t.length + 1 : i ? g ? 1 : 2 : 0, k = Xt[i + 5], E = i > 3 && (t[f - 1] = []), R = t[f] || (t[f] = []), c = i && (!d && !g && (a = a.prototype), i < 5 && (i > 3 || !d) && Ge(i < 4 ? a : { get [r]() {
     return C(this, n);
   }, set [r](l) {
-    return Z(this, n, l);
+    return j(this, n, l);
   } }, r));
   i ? d && i < 4 && Tt(n, (i > 2 ? "set " : i > 1 ? "get " : "") + r) : Tt(a, r);
   for (var w = o.length - 1; w >= 0; w--)
-    p = He(i, r, m = {}, t[3], R), i && (p.static = g, p.private = d, f = p.access = { has: d ? (l) => Je(a, l) : (l) => r in l }, i ^ 3 && (f.get = d ? (l) => (i ^ 1 ? C : Ke)(l, a, i ^ 4 ? n : c.get) : (l) => l[r]), i > 2 && (f.set = d ? (l, y) => Z(l, a, y, i ^ 4 ? n : c.set) : (l, y) => l[r] = y)), s = (0, o[w])(i ? i < 4 ? d ? n : c[k] : i > 4 ? void 0 : { get: c.get, set: c.set } : a, p), m._ = 1, i ^ 4 || s === void 0 ? A(s) && (i > 4 ? E.unshift(s) : i ? d ? n = s : c[k] = s : a = s) : typeof s != "object" || s === null ? B("Object expected") : (A(h = s.get) && (c.get = h), A(h = s.set) && (c.set = h), A(h = s.init) && E.unshift(h));
-  return i || je(t, a), c && vt(a, r, c), d ? i ^ 4 ? n : c : a;
-}, ut = (t, e, r) => e.has(t) || B("Cannot " + r), Je = (t, e) => Object(e) !== e ? B('Cannot use the "in" operator on this value') : t.has(e), C = (t, e, r) => (ut(t, e, "read from private field"), r ? r.call(t) : e.get(t)), T = (t, e, r) => e.has(t) ? B("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, r), Z = (t, e, r, o) => (ut(t, e, "write to private field"), o ? o.call(t, r) : e.set(t, r), r), Ke = (t, e, r) => (ut(t, e, "access private method"), r), Xt, Zt, te, ee, re, ie, tt, ae, v, _t, ft, gt, bt, mt, N;
-ae = [J("nte-nav-brand-relocator")];
-class $ extends (tt = se(le(j)), ie = [z({ type: String, reflect: !0 })], re = [z({ type: Boolean, reflect: !0 })], ee = [z({ type: String, reflect: !0 })], te = [K()], Zt = [K()], Xt = [de("scroll", { target: "window", options: { passive: !0 } })], tt) {
+    p = je(i, r, m = {}, t[3], R), i && (p.static = g, p.private = d, _ = p.access = { has: d ? (l) => Ke(a, l) : (l) => r in l }, i ^ 3 && (_.get = d ? (l) => (i ^ 1 ? C : Qe)(l, a, i ^ 4 ? n : c.get) : (l) => l[r]), i > 2 && (_.set = d ? (l, y) => j(l, a, y, i ^ 4 ? n : c.set) : (l, y) => l[r] = y)), s = (0, o[w])(i ? i < 4 ? d ? n : c[k] : i > 4 ? void 0 : { get: c.get, set: c.set } : a, p), m._ = 1, i ^ 4 || s === void 0 ? Y(s) && (i > 4 ? E.unshift(s) : i ? d ? n = s : c[k] = s : a = s) : typeof s != "object" || s === null ? B("Object expected") : (Y(h = s.get) && (c.get = h), Y(h = s.set) && (c.set = h), Y(h = s.init) && E.unshift(h));
+  return i || Je(t, a), c && ut(a, r, c), d ? i ^ 4 ? n : c : a;
+}, ft = (t, e, r) => e.has(t) || B("Cannot " + r), Ke = (t, e) => Object(e) !== e ? B('Cannot use the "in" operator on this value') : t.has(e), C = (t, e, r) => (ft(t, e, "read from private field"), r ? r.call(t) : e.get(t)), N = (t, e, r) => e.has(t) ? B("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, r), j = (t, e, r, o) => (ft(t, e, "write to private field"), o ? o.call(t, r) : e.set(t, r), r), Qe = (t, e, r) => (ft(t, e, "access private method"), r), Zt, te, ee, re, ie, ae, et, ne, v, _t, gt, bt, mt, wt, q, O;
+ne = [Q("nte-nav-brand-relocator")];
+class $ extends (et = le(de(K)), ae = [z({ type: String, reflect: !0 })], ie = [z({ type: Boolean, reflect: !0 })], re = [z({ type: String, reflect: !0 })], ee = [V()], te = [V()], Zt = [ce("scroll", { target: "window", options: { passive: !0 } })], et) {
   constructor() {
-    super(...arguments), b(v, 5, this), T(this, _t, b(v, 8, this, ".brand-image")), b(v, 11, this), T(this, ft, b(v, 12, this, null)), b(v, 15, this), T(this, gt, b(v, 16, this, "auto")), b(v, 19, this), T(this, bt, b(v, 20, this, !1)), b(v, 23, this), T(this, mt, b(v, 24, this, !1)), b(v, 27, this), T(this, N, null);
+    super(...arguments), b(v, 5, this), N(this, _t, b(v, 8, this, ".brand-image")), b(v, 11, this), N(this, gt, b(v, 12, this, null)), b(v, 15, this), N(this, bt, b(v, 16, this, "auto")), b(v, 19, this), N(this, mt, b(v, 20, this, !1)), b(v, 23, this), N(this, wt, b(v, 24, this, !1)), b(v, 27, this), N(this, q, !0), N(this, O, null);
   }
   onScroll() {
     if (this.mode !== "auto") {
@@ -260,11 +260,11 @@ class $ extends (tt = se(le(j)), ie = [z({ type: String, reflect: !0 })], re = [
     this.log("Animation ended - finalizing state"), this.active || (this.brandElement.style.visibility = "visible", this.done = !0);
   }
   get brandElement() {
-    return C(this, N) || (Z(this, N, document.querySelector(this.brandSelector)), C(this, N) || this.warn(`Brand element not found using selector: ${this.brandSelector}`)), C(this, N);
+    return C(this, O) || (j(this, O, document.querySelector(this.brandSelector)), C(this, O) || this.warn(`Brand element not found using selector: ${this.brandSelector}`)), C(this, O);
   }
   render() {
     const e = this.brandElement.getBoundingClientRect(), r = e.width / e.height;
-    this.style.setProperty("--auto-aspect-ratio", r.toString());
+    this.log("Setting Aspect ratio:", r), this.style.setProperty("--auto-aspect-ratio", r.toString());
     const o = this.getBoundingClientRect();
     if (!e)
       return P`<div>No brand element found</div>`;
@@ -280,7 +280,7 @@ class $ extends (tt = se(le(j)), ie = [z({ type: String, reflect: !0 })], re = [
     };
     return P`<div
       class="wrapper ${this.active ? "" : "inactive"} ${this.done ? "done" : ""} ${this.initialized ? "initialized" : ""}"
-      style=${ce(a)}
+      style=${he(a)}
       @transitionend=${() => this.onanimationEnd()}
     >
       <slot></slot>
@@ -288,37 +288,40 @@ class $ extends (tt = se(le(j)), ie = [z({ type: String, reflect: !0 })], re = [
   }
   update(e) {
     var r;
-    e.has("active") && this.active === !0 && ((r = C(this, N)) == null || r.style.setProperty("visibility", "hidden"), this.done = !1), super.update(e);
+    e.has("active") && this.active === !0 && ((r = C(this, O)) == null || r.style.setProperty("visibility", "hidden"), this.done = !1), super.update(e);
   }
   async firstUpdated() {
-    this.log("Waiting for Brand element loading...", this.brandElement), await oe(this.brandElement), this.log("Brand element loaded:", this.brandElement), this.initialized = !0;
+    this.log("Waiting for Brand element loading...", this.brandElement), await se(this.brandElement), this.log("Brand element loaded:", this.brandElement), this.initialized = !0;
   }
   async connectedCallback() {
-    await q();
-    const e = this.brandElement;
-    if (this.log("Brand element:", e), !e) {
-      this.warn(`Brand element not found using selector: ${this.brandSelector}`);
-      return;
+    if (await H(), super.connectedCallback(), C(this, q)) {
+      j(this, q, !1);
+      const e = this.brandElement;
+      if (this.log("first connectedCallback() on Brand element:", e), !e) {
+        this.warn(`Brand element not found using selector: ${this.brandSelector}`);
+        return;
+      }
+      const r = e.cloneNode(!0);
+      this.appendChild(r), this.onScroll();
     }
-    const r = e.cloneNode(!0);
-    this.appendChild(r), super.connectedCallback(), this.onScroll();
   }
 }
-v = qe(tt);
+v = He(et);
 _t = /* @__PURE__ */ new WeakMap();
-ft = /* @__PURE__ */ new WeakMap();
 gt = /* @__PURE__ */ new WeakMap();
 bt = /* @__PURE__ */ new WeakMap();
 mt = /* @__PURE__ */ new WeakMap();
-N = /* @__PURE__ */ new WeakMap();
-O(v, 4, "brandSelector", ie, $, _t);
-O(v, 4, "active", re, $, ft);
-O(v, 4, "mode", ee, $, gt);
-O(v, 4, "done", te, $, bt);
-O(v, 4, "initialized", Zt, $, mt);
-O(v, 1, "onScroll", Xt, $);
-$ = O(v, 0, "NteNavBrandRelocator", ae, $);
-$.styles = [H(Ye)];
+wt = /* @__PURE__ */ new WeakMap();
+q = /* @__PURE__ */ new WeakMap();
+O = /* @__PURE__ */ new WeakMap();
+T(v, 4, "brandSelector", ae, $, _t);
+T(v, 4, "active", ie, $, gt);
+T(v, 4, "mode", re, $, bt);
+T(v, 4, "done", ee, $, mt);
+T(v, 4, "initialized", te, $, wt);
+T(v, 1, "onScroll", Zt, $);
+$ = T(v, 0, "NteNavBrandRelocator", ne, $);
+$.styles = [J(Ye)];
 b(v, 1, $);
 console.log("Loading nte-nav...");
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@nextrap/nte-nav",
-    "version": "1.1.18",
+    "version": "1.1.20",
     "main": "./index.js",
     "dependencies": {
         "@nextrap/nt-framework": "^1.1.1",