@nextrap/nte-nav 1.1.35 → 1.1.39
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.
- package/CHANGELOG.md +40 -0
- package/components/nte-nav-brand-relocator/nte-nav-brand-relocator.d.ts +2 -1
- package/index.css +1 -1
- package/index.js +207 -189
- package/lib/nte-nav.d.ts +9 -4
- package/package.json +2 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,43 @@
|
|
|
1
|
+
## 1.1.39 (2026-03-13)
|
|
2
|
+
|
|
3
|
+
### 🩹 Fixes
|
|
4
|
+
|
|
5
|
+
- use aliasesExclude to avoid internal relative paths ([6b8123e](https://github.com/nextrap/nextrap-monorepo/commit/6b8123e))
|
|
6
|
+
|
|
7
|
+
### ❤️ Thank You
|
|
8
|
+
|
|
9
|
+
- Enzo Volkmann @evolkmann
|
|
10
|
+
|
|
11
|
+
## 1.1.38 (2026-03-13)
|
|
12
|
+
|
|
13
|
+
### 🩹 Fixes
|
|
14
|
+
|
|
15
|
+
- use aliasesExclude to avoid internal relative paths ([6b8123e](https://github.com/nextrap/nextrap-monorepo/commit/6b8123e))
|
|
16
|
+
|
|
17
|
+
### ❤️ Thank You
|
|
18
|
+
|
|
19
|
+
- Enzo Volkmann @evolkmann
|
|
20
|
+
|
|
21
|
+
## 1.1.37 (2026-03-13)
|
|
22
|
+
|
|
23
|
+
### 🩹 Fixes
|
|
24
|
+
|
|
25
|
+
- use aliasesExclude to avoid internal relative paths ([6b8123e](https://github.com/nextrap/nextrap-monorepo/commit/6b8123e))
|
|
26
|
+
|
|
27
|
+
### ❤️ Thank You
|
|
28
|
+
|
|
29
|
+
- Enzo Volkmann @evolkmann
|
|
30
|
+
|
|
31
|
+
## 1.1.36 (2026-03-12)
|
|
32
|
+
|
|
33
|
+
### 🩹 Fixes
|
|
34
|
+
|
|
35
|
+
- use aliasesExclude to avoid internal relative paths ([6b8123e](https://github.com/nextrap/nextrap-monorepo/commit/6b8123e))
|
|
36
|
+
|
|
37
|
+
### ❤️ Thank You
|
|
38
|
+
|
|
39
|
+
- Enzo Volkmann @evolkmann
|
|
40
|
+
|
|
1
41
|
## 1.1.35 (2026-03-12)
|
|
2
42
|
|
|
3
43
|
### 🩹 Fixes
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
|
+
declare const NteNavBrandRelocator_base: typeof LitElement & (abstract new (...args: any[]) => import('@trunkjs/browser-utils').LoggerMixinInterface);
|
|
2
3
|
export declare class NteNavBrandRelocator extends NteNavBrandRelocator_base {
|
|
3
4
|
#private;
|
|
4
5
|
static styles: import('lit').CSSResult[];
|
package/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";.nav-vertical{--border-color: none;--text-color: var(--nt-text);--hover-color: var(--nt-primary);--hover-text-color: var(--nt-text-on-primary)}.nav-vertical.style-primary{--border-color: var(--nt-white);--text-color: var(--nt-text-on-primary);--hover-color: var(--nt-primary-emphasis);--hover-text-color: var(--nt-white)}.nav-vertical.style-primary ul>li{border-top:1px solid var(--border-color)}.nav-vertical.style-primary ul>li:last-child{border-bottom:1px solid var(--border-color)}.nav-vertical{width:100%}.nav-vertical ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;width:100%;gap:.15rem;position:relative}.nav-vertical ul>li{position:relative;display:block}.nav-vertical ul>li>a{display:block;padding:.65em 1.1em;color:var(--text-color);text-decoration:none;transition:background var(--transition),color var(--transition);font-weight:500}.nav-vertical ul>li>a.active,.nav-vertical ul>li>a:active{background-color:var(--hover-color);color:var(--hover-text-color)}.nav-vertical ul>li>a:hover{background-color:var(--hover-color);color:var(--hover-text-color)}.nav-vertical ul>li>a:after{content:"";display:inline-block;margin-left:.47em;margin-bottom:.08em;border:solid currentColor;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg) scale(.8);opacity:0;transition:opacity var(--transition),transform var(--transition)}.nav-vertical ul>li:has(ul)>a:after{opacity:.55}.nav-vertical ul>li:active>a:after,.nav-vertical ul>li
|
|
1
|
+
@charset "UTF-8";.nav-vertical{--border-color: none;--text-color: var(--nt-text);--hover-color: var(--nt-primary);--hover-text-color: var(--nt-text-on-primary)}.nav-vertical.style-primary{--border-color: var(--nt-white);--text-color: var(--nt-text-on-primary);--hover-color: var(--nt-primary-emphasis);--hover-text-color: var(--nt-white)}.nav-vertical.style-primary ul>li{border-top:1px solid var(--border-color)}.nav-vertical.style-primary ul>li:last-child{border-bottom:1px solid var(--border-color)}.nav-vertical{width:100%}.nav-vertical ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;width:100%;gap:.15rem;position:relative}.nav-vertical ul>li{position:relative;display:block}.nav-vertical ul>li>a{display:block;padding:.65em 1.1em;color:var(--text-color);text-decoration:none;transition:background var(--transition),color var(--transition);font-weight:500}.nav-vertical ul>li>a.active,.nav-vertical ul>li>a:active{background-color:var(--hover-color);color:var(--hover-text-color)}.nav-vertical ul>li>a:hover{background-color:var(--hover-color);color:var(--hover-text-color)}.nav-vertical ul>li>a:after{content:"";display:inline-block;margin-left:.47em;margin-bottom:.08em;border:solid currentColor;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg) scale(.8);opacity:0;transition:opacity var(--transition),transform var(--transition)}.nav-vertical ul>li:has(ul)>a:after{opacity:.55}.nav-vertical ul>li:active>a:after,.nav-vertical ul>li.is-open>a:after{transform:rotate(135deg) scale(.85)}.nav-vertical ul>li.is-open>ul{display:flex}.nav-vertical ul>li>ul{list-style:none;margin:0;padding:0 0 0 .7em;display:none;flex-direction:column}.nav-vertical ul>li>ul>li>a{padding:.55em 1.1em;font-size:.95em;font-weight:400;color:var(--text-color);transition:background var(--transition),color var(--transition)}.nav-vertical ul>li>ul>li>a:hover{background:var(--hover-color);color:var(--hover-text-color)}.nav-horizontal.pos-start{--justify-content: flex-start}.nav-horizontal.pos-end{--justify-content: flex-end}.nav-horizontal.pos-center{--justify-content: center}.nav-horizontal.pos-stretch>ul{display:flex}.nav-horizontal.pos-stretch>ul>li{flex-grow:1}.nav-horizontal.pos-stretch>ul>li>a{width:100%;justify-content:center}.nav-horizontal{--item-padding: .65em 1.1em;--padding: 0}.nav-horizontal.size-sm{--item-padding: 2px 15px;--item-margin: 2px .2em;--font-size: .6rem}.nav-horizontal.style-pills{--pill-background: rgba(var(--nt-primary-rgb), .8);--pill-radius: .5em;--pill-text-color: var(--nt-text-on-primary);--pill-hover-background: rgba(var(--nt-primary-rgb), 1)}.nav-horizontal.style-pills>ul>li>a{background:var(--pill-background);border-radius:var(--pill-radius);--text-color: var(--pill-text-color);transition:background var(--transition),color var(--transition)}.nav-horizontal.style-pills>ul>li>a:hover,.nav-horizontal.style-pills>ul>li>a:focus{background:var(--pill-hover-background);--font-color: var(--pill-text-color)}.nav-horizontal.style-pills>ul>li>a.active,.nav-horizontal.style-pills>ul>li>a:active{background:var(--pill-hover-background);--font-color: var(--pill-text-color)}.nav-horizontal.style-undecorated{--item-padding: .65em 1.1em;--item-margin: 0;--text-color: var(--nt-text);--hover-color: transparent;--submenu-hover-color: var(--nt-primary);--hover-text-color: var(--nt-text);--submenu-hover-text-color: var(--nt-primary);--submenu-bg: var(--nt-light);--submenu-text-color: var(--nt-text)}.nav-horizontal.style-undecorated a,.nav-horizontal.style-undecorated a>*{color:rgb(from var(--text-color) r g b/var(--default-alpha));transition:color var(--transition)}.nav-horizontal.style-undecorated a:hover,.nav-horizontal.style-undecorated a:hover>*{color:rgb(from var(--text-color) r g b/1)}.nav-horizontal ul{list-style:none;padding:var(--padding);margin:0;display:flex;flex-direction:row;align-items:center;position:relative;height:100%;justify-content:var(--justify-content)}.nav-horizontal ul>li,.nav-horizontal ul li{position:relative;display:flex;align-items:center;height:inherit}.nav-horizontal ul>li.is-open>a:after,.nav-horizontal ul li.is-open>a:after{transform:rotate(-135deg) scale(.85)}.nav-horizontal ul>li>a,.nav-horizontal ul li>a{display:flex;align-items:center;margin:var(--item-margin, 0);height:100%;padding:var(--item-padding);gap:.5em;text-decoration:none;color:var(--text-color);transition:background var(--transition),color var(--transition);font-weight:500}.nav-horizontal ul>li>a.active,.nav-horizontal ul>li>a:active,.nav-horizontal ul li>a.active,.nav-horizontal ul li>a:active{background:var(--hover-color);color:var(--hover-text-color)}.nav-horizontal ul>li>a:hover,li:hover>.nav-horizontal ul>li>a,.nav-horizontal ul li>a:hover,li:hover>.nav-horizontal ul li>a{background:var(--hover-color);color:var(--hover-text-color)}.nav-horizontal ul>li>a:after,.nav-horizontal ul li>a:after{content:"";display:none;margin-left:.47em;margin-bottom:.08em;border:solid currentColor;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg) scale(.8);opacity:0;transition:opacity var(--transition),transform var(--transition)}.nav-horizontal ul>li:has(ul)>a:after,.nav-horizontal ul li:has(ul)>a:after{opacity:.55;display:inline-block}.nav-horizontal ul>li:active>a:after,.nav-horizontal ul>li:has(.is-open)>a:after,.nav-horizontal ul li:active>a:after,.nav-horizontal ul li:has(.is-open)>a:after{transform:rotate(-135deg) scale(.85)}.nav-horizontal ul>li>ul,.nav-horizontal ul li>ul{display:block;visibility:hidden;opacity:0;pointer-events:none;min-width:11rem;background:var(--submenu-bg)!important;position:absolute;top:100%;left:0}.nav-horizontal ul>li>ul:last-child,.nav-horizontal ul li>ul:last-child{right:0;left:auto}.nav-horizontal ul>li>ul,.nav-horizontal ul li>ul{margin-top:.3em;flex-direction:column;z-index:3;transition:opacity var(--transition),transform var(--transition),visibility var(--transition);transform:translateY(-.7em)}.nav-horizontal ul>li>ul:hover,.nav-horizontal ul>li>ul:has(.is-open),.nav-horizontal ul li>ul:hover,.nav-horizontal ul li>ul:has(.is-open){visibility:visible;opacity:1;pointer-events:all;transform:translateY(0)}.nav-horizontal ul>li>ul>li,.nav-horizontal ul li>ul>li{display:flex;height:auto;background:var(--submenu-bg)}.nav-horizontal ul>li>ul>li>a,.nav-horizontal ul li>ul>li>a{display:block;width:100%;color:var(--text-color);padding:.63em 1.3em;font-size:.99em;font-weight:400;height:auto;transition:background var(--transition),color var(--transition)}.nav-horizontal ul>li>ul>li>a:hover,.nav-horizontal ul li>ul>li>a:hover{background:var(--submenu-hover-color);color:var(--submenu-hover-text-color)}.nav-horizontal ul>li.is-open>ul,.nav-horizontal ul li.is-open>ul{visibility:visible;opacity:1;pointer-events:all;transform:translateY(0)}nte-navbar.is-scrolled{--bg: rgb(from var(--nt-white) r g b / 1)}nte-navbar.autoborder{--border-color: var(--nt-light)}nte-navbar.autoborder.is-scrolled::part(navbar){border-bottom:1px solid rgb(from var(--border-color) r g b/.1)}nte-navbar.autoshadow{--shadow-color: var(--nt-dark);--shadow: 0 2px 4px rgb(from var(--shadow-color) r g b / .1)}nte-navbar.autoshadow::part(navbar){transition:box-shadow .5s ease-in-out}nte-navbar.autoshadow.is-scrolled::part(navbar){box-shadow:var(--shadow)}nte-navbar.fixed::part(navbar){position:fixed;top:0;left:0;opacity:1;width:100%}nte-navbar.autohide::part(navbar){transition:transform .3s ease-in-out}nte-navbar.autohide.state-pre-scrolled.state-scrolling-down::part(navbar){transform:translateY(-100%)}nte-navbar.autohide.state-pre-scrolled.state-scrolling-up::part(navbar){transform:translateY(0);position:fixed;top:0;left:0;opacity:1;width:100%}nte-navbar.autohide.state-scrolled::part(navbar){position:fixed;top:0;left:0;opacity:1;width:100%;transform:translateY(-100%)}nte-navbar.autohide.state-scrolled.state-scrolling-up::part(navbar){transform:translateY(0);position:fixed;top:0;left:0;opacity:1;width:100%}nte-navbar-line [slot=brand]{height:100%;display:flex;align-items:center}nte-navbar-line [slot=brand] img{height:var(--brand-height);max-height:100%;max-width:100%;width:auto;object-fit:contain}nte-navbar-line [slot=brand] a,nte-navbar-line [slot=brand] div{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;text-decoration:none;width:100%}nte-navbar-line.zoom-brand{--brand-zoom-level: 1.7;--brand-translate: 20px}nte-navbar-line.zoom-brand [slot=brand] img{transition:transform .2s ease-in-out;transform:scale(var(--brand-zoom-level)) translateY(var(--brand-translate))}nte-navbar-line.zoom-brand.is-scrolled [slot=brand] img{transform:translateY(0) scale(1)}
|
package/index.js
CHANGED
|
@@ -1,42 +1,57 @@
|
|
|
1
|
-
import { isBiggerThanBreakpoint as
|
|
1
|
+
import { isBiggerThanBreakpoint as Et, Debouncer as he, waitForDomContentLoaded as V, SlotTool as Lt } from "@nextrap/nt-framework";
|
|
2
|
+
import { nextrap_element as pe } from "@nextrap/nte-core";
|
|
2
3
|
import "@nextrap/nte-offcanvas";
|
|
3
|
-
import {
|
|
4
|
-
import { html as
|
|
5
|
-
import { customElement as
|
|
6
|
-
import { createRef as
|
|
7
|
-
import { styleMap as
|
|
4
|
+
import { Listen as X, waitForLoad as Wt, sleep as J, EventBindingsMixin as ve, LoggingMixin as ue, create_element as fe } from "@trunkjs/browser-utils";
|
|
5
|
+
import { html as q, unsafeCSS as K, LitElement as nt } from "lit";
|
|
6
|
+
import { customElement as Q, property as O, state as Z } from "lit/decorators.js";
|
|
7
|
+
import { createRef as Ct, ref as Ot } from "lit/directives/ref.js";
|
|
8
|
+
import { styleMap as _e } from "lit/directives/style-map.js";
|
|
8
9
|
import "@nextrap/nte-burger";
|
|
9
|
-
const
|
|
10
|
-
var
|
|
11
|
-
throw TypeError(
|
|
12
|
-
},
|
|
13
|
-
for (var a = 0, n = t
|
|
14
|
-
return
|
|
15
|
-
},
|
|
16
|
-
var h,
|
|
17
|
-
return
|
|
18
|
-
}, set [
|
|
19
|
-
return
|
|
20
|
-
} },
|
|
21
|
-
|
|
22
|
-
for (var
|
|
23
|
-
p =
|
|
24
|
-
return
|
|
25
|
-
},
|
|
26
|
-
|
|
27
|
-
|
|
10
|
+
const ge = ":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);--submenu-hover-text-color: var(--nt-primary);--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)}";
|
|
11
|
+
var be = Object.create, st = Object.defineProperty, me = Object.getOwnPropertyDescriptor, Bt = (e, t) => (t = Symbol[e]) ? t : Symbol.for("Symbol." + e), I = (e) => {
|
|
12
|
+
throw TypeError(e);
|
|
13
|
+
}, we = (e, t, i) => t in e ? st(e, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[t] = i, zt = (e, t) => st(e, "name", { value: t, configurable: !0 }), ye = (e) => [, , , be((e == null ? void 0 : e[Bt("metadata")]) ?? null)], It = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], F = (e) => e !== void 0 && typeof e != "function" ? I("Function expected") : e, Se = (e, t, i, s, a) => ({ kind: It[e], name: t, metadata: s, addInitializer: (n) => i._ ? I("Already initialized") : a.push(F(n || null)) }), $e = (e, t) => we(t, Bt("metadata"), e[3]), b = (e, t, i, s) => {
|
|
14
|
+
for (var a = 0, n = e[t >> 1], h = n && n.length; a < h; a++) t & 1 ? n[a].call(i) : s = n[a].call(i, s);
|
|
15
|
+
return s;
|
|
16
|
+
}, z = (e, t, i, s, a, n) => {
|
|
17
|
+
var h, o, w, p, _, r = t & 7, g = !!(t & 8), d = !!(t & 16), f = r > 3 ? e.length + 1 : r ? g ? 1 : 2 : 0, E = It[r + 5], C = r > 3 && (e[f - 1] = []), D = e[f] || (e[f] = []), c = r && (!d && !g && (a = a.prototype), r < 5 && (r > 3 || !d) && me(r < 4 ? a : { get [i]() {
|
|
18
|
+
return N(this, n);
|
|
19
|
+
}, set [i](l) {
|
|
20
|
+
return U(this, n, l);
|
|
21
|
+
} }, i));
|
|
22
|
+
r ? d && r < 4 && zt(n, (r > 2 ? "set " : r > 1 ? "get " : "") + i) : zt(a, i);
|
|
23
|
+
for (var y = s.length - 1; y >= 0; y--)
|
|
24
|
+
p = Se(r, i, w = {}, e[3], D), r && (p.static = g, p.private = d, _ = p.access = { has: d ? (l) => ke(a, l) : (l) => i in l }, r ^ 3 && (_.get = d ? (l) => (r ^ 1 ? N : xe)(l, a, r ^ 4 ? n : c.get) : (l) => l[i]), r > 2 && (_.set = d ? (l, S) => U(l, a, S, r ^ 4 ? n : c.set) : (l, S) => l[i] = S)), o = (0, s[y])(r ? r < 4 ? d ? n : c[E] : r > 4 ? void 0 : { get: c.get, set: c.set } : a, p), w._ = 1, r ^ 4 || o === void 0 ? F(o) && (r > 4 ? C.unshift(o) : r ? d ? n = o : c[E] = o : a = o) : typeof o != "object" || o === null ? I("Object expected") : (F(h = o.get) && (c.get = h), F(h = o.set) && (c.set = h), F(h = o.init) && C.unshift(h));
|
|
25
|
+
return r || $e(e, a), c && st(a, i, c), d ? r ^ 4 ? n : c : a;
|
|
26
|
+
}, ot = (e, t, i) => t.has(e) || I("Cannot " + i), ke = (e, t) => Object(t) !== t ? I('Cannot use the "in" operator on this value') : e.has(t), N = (e, t, i) => (ot(e, t, "read from private field"), i ? i.call(e) : t.get(e)), M = (e, t, i) => t.has(e) ? I("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, i), U = (e, t, i, s) => (ot(e, t, "write to private field"), s ? s.call(e, i) : t.set(e, i), i), xe = (e, t, i) => (ot(e, t, "access private method"), i), Rt, At, Dt, Ft, Yt, Gt, Ut, tt, qt, v, lt, dt, ct, ht, pt, k;
|
|
27
|
+
const Ee = {
|
|
28
|
+
eventBinding: !0,
|
|
29
|
+
logging: !0
|
|
30
|
+
};
|
|
31
|
+
qt = [Q("nte-nav")];
|
|
32
|
+
class $ extends (tt = pe(Ee), Ut = [O({ type: String, reflect: !0 })], Gt = [O({ type: String, reflect: !0 })], Yt = [O({ type: String, reflect: !0, attribute: "transfer-to" })], Ft = [O({ type: String, reflect: !1, attribute: "data-group-name" })], Dt = [Z()], At = [X("click", { target: "host" })], Rt = [X("click", { target: "window" })], tt) {
|
|
28
33
|
constructor() {
|
|
29
|
-
super(),
|
|
34
|
+
super(), b(v, 5, this), M(this, lt, b(v, 8, this, "slave")), b(v, 11, this), M(this, dt, b(v, 12, this, "99999px")), b(v, 15, this), M(this, ct, b(v, 16, this, "")), b(v, 19, this), M(this, ht, b(v, 20, this, "")), b(v, 23, this), M(this, pt, b(v, 24, this, !1)), b(v, 27, this), M(this, k, null);
|
|
35
|
+
}
|
|
36
|
+
handleClickOnSubmenu(t) {
|
|
37
|
+
var s;
|
|
38
|
+
const i = (s = t.target) == null ? void 0 : s.closest("li:has(ul)");
|
|
39
|
+
N(this, k) && (N(this, k).classList.remove("is-open"), U(this, k, null)), i && (U(this, k, i), i.classList.add("is-open"));
|
|
40
|
+
}
|
|
41
|
+
handleClickOutside(t) {
|
|
42
|
+
if (!N(this, k))
|
|
43
|
+
return;
|
|
44
|
+
N(this, k).contains(t.target) || (N(this, k).classList.remove("is-open"), U(this, k, null));
|
|
30
45
|
}
|
|
31
46
|
getOffcanvas() {
|
|
32
47
|
return this.transferTo ? document.querySelector(this.transferTo) : null;
|
|
33
48
|
}
|
|
34
49
|
getOffcanvasNav() {
|
|
35
|
-
const
|
|
36
|
-
return
|
|
50
|
+
const t = this.getOffcanvas();
|
|
51
|
+
return t ? t.querySelector("nte-nav") : null;
|
|
37
52
|
}
|
|
38
53
|
render() {
|
|
39
|
-
return
|
|
54
|
+
return q` <nav>
|
|
40
55
|
<div id="burger-wrapper" ?hidden=${!this._isTransferred}>
|
|
41
56
|
<slot
|
|
42
57
|
name="burger"
|
|
@@ -45,12 +60,12 @@ class x extends (V = J, At = [z({ type: String, reflect: !0 })], Rt = [z({ type:
|
|
|
45
60
|
id="burger"
|
|
46
61
|
class="burger"
|
|
47
62
|
@click=${() => {
|
|
48
|
-
var
|
|
49
|
-
return (
|
|
63
|
+
var t;
|
|
64
|
+
return (t = this.getOffcanvas()) == null ? void 0 : t.open();
|
|
50
65
|
}}
|
|
51
66
|
>
|
|
52
67
|
<!-- fallback icon -->
|
|
53
|
-
${this._isTransferred ?
|
|
68
|
+
${this._isTransferred ? q`<div id="burger-default" style="display:flex; align-items: center; justify-content: center;">
|
|
54
69
|
<div id="text" part="menutext"><slot name="menu-text"></slot></div>
|
|
55
70
|
<nte-burger
|
|
56
71
|
part="burger"
|
|
@@ -68,72 +83,75 @@ class x extends (V = J, At = [z({ type: String, reflect: !0 })], Rt = [z({ type:
|
|
|
68
83
|
</div>
|
|
69
84
|
</nav>`;
|
|
70
85
|
}
|
|
71
|
-
transferToElement(
|
|
86
|
+
transferToElement(t) {
|
|
72
87
|
var a;
|
|
73
|
-
const
|
|
74
|
-
if (
|
|
88
|
+
const i = (a = this.shadowRoot) == null ? void 0 : a.querySelector("#main-slot");
|
|
89
|
+
if (i === null)
|
|
75
90
|
return;
|
|
76
|
-
Array.from(
|
|
77
|
-
n instanceof HTMLElement &&
|
|
91
|
+
Array.from(i.assignedElements({ flatten: !0 })).forEach((n) => {
|
|
92
|
+
n instanceof HTMLElement && t.appendChild(n);
|
|
78
93
|
});
|
|
79
94
|
}
|
|
80
|
-
updated(
|
|
81
|
-
var
|
|
82
|
-
super.updated(
|
|
95
|
+
updated(t) {
|
|
96
|
+
var i, s;
|
|
97
|
+
super.updated(t), this._isTransferred ? this.transferToElement(
|
|
83
98
|
this.getOffcanvasNav() ?? (() => {
|
|
84
99
|
throw new Error("No offcanvas nav found");
|
|
85
100
|
})()
|
|
86
|
-
) : ((
|
|
101
|
+
) : ((i = this.getOffcanvasNav()) == null || i.transferToElement(this), (s = this.getOffcanvas()) == null || s.close());
|
|
87
102
|
}
|
|
88
|
-
firstUpdated(
|
|
89
|
-
super.firstUpdated(
|
|
90
|
-
const
|
|
91
|
-
!
|
|
103
|
+
firstUpdated(t) {
|
|
104
|
+
super.firstUpdated(t);
|
|
105
|
+
const i = this.classList;
|
|
106
|
+
!i.contains("nav-vertical") && !i.contains("nav-horizontal") && i.add(this.closest("nte-offcanvas") === null ? "nav-horizontal" : "nav-vertical");
|
|
92
107
|
}
|
|
93
108
|
updateTransferState() {
|
|
94
|
-
|
|
109
|
+
Et(this.breakpoint) ? this._isTransferred = !1 : this._isTransferred = !0;
|
|
95
110
|
}
|
|
96
111
|
async connectedCallback() {
|
|
97
|
-
super.connectedCallback(), this.mode !== "slave" && (this.transferTo !== "" && (this._isTransferred = !1, this.breakpoint !== "" && (
|
|
112
|
+
super.connectedCallback(), this.mode !== "slave" && (this.transferTo !== "" && (this._isTransferred = !1, this.breakpoint !== "" && (Et(this.breakpoint) || (this._isTransferred = !0), window.addEventListener("breakpoint-changed", (t) => {
|
|
98
113
|
this.updateTransferState();
|
|
99
|
-
}))), await
|
|
114
|
+
}))), await Wt(), this.updateTransferState(), await J(3e3), this.updateTransferState());
|
|
100
115
|
}
|
|
101
116
|
}
|
|
102
|
-
|
|
103
|
-
at = /* @__PURE__ */ new WeakMap();
|
|
104
|
-
nt = /* @__PURE__ */ new WeakMap();
|
|
105
|
-
ot = /* @__PURE__ */ new WeakMap();
|
|
106
|
-
st = /* @__PURE__ */ new WeakMap();
|
|
117
|
+
v = ye(tt);
|
|
107
118
|
lt = /* @__PURE__ */ new WeakMap();
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
},
|
|
133
|
-
|
|
134
|
-
|
|
119
|
+
dt = /* @__PURE__ */ new WeakMap();
|
|
120
|
+
ct = /* @__PURE__ */ new WeakMap();
|
|
121
|
+
ht = /* @__PURE__ */ new WeakMap();
|
|
122
|
+
pt = /* @__PURE__ */ new WeakMap();
|
|
123
|
+
k = /* @__PURE__ */ new WeakMap();
|
|
124
|
+
z(v, 4, "mode", Ut, $, lt);
|
|
125
|
+
z(v, 4, "breakpoint", Gt, $, dt);
|
|
126
|
+
z(v, 4, "transferTo", Yt, $, ct);
|
|
127
|
+
z(v, 4, "dataGroupName", Ft, $, ht);
|
|
128
|
+
z(v, 4, "_isTransferred", Dt, $, pt);
|
|
129
|
+
z(v, 1, "handleClickOnSubmenu", At, $);
|
|
130
|
+
z(v, 1, "handleClickOutside", Rt, $);
|
|
131
|
+
$ = z(v, 0, "NteNav", qt, $);
|
|
132
|
+
$.styles = [K(ge)];
|
|
133
|
+
b(v, 1, $);
|
|
134
|
+
const Ce = "*,*: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}";
|
|
135
|
+
var Oe = Object.create, vt = Object.defineProperty, ze = Object.getOwnPropertyDescriptor, jt = (e, t) => (t = Symbol[e]) ? t : Symbol.for("Symbol." + e), R = (e) => {
|
|
136
|
+
throw TypeError(e);
|
|
137
|
+
}, Te = (e, t, i) => t in e ? vt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[t] = i, Tt = (e, t) => vt(e, "name", { value: t, configurable: !0 }), Ne = (e) => [, , , Oe((e == null ? void 0 : e[jt("metadata")]) ?? null)], Ht = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], Y = (e) => e !== void 0 && typeof e != "function" ? R("Function expected") : e, Pe = (e, t, i, s, a) => ({ kind: Ht[e], name: t, metadata: s, addInitializer: (n) => i._ ? R("Already initialized") : a.push(Y(n || null)) }), Me = (e, t) => Te(t, jt("metadata"), e[3]), et = (e, t, i, s) => {
|
|
138
|
+
for (var a = 0, n = e[t >> 1], h = n && n.length; a < h; a++) t & 1 ? n[a].call(i) : s = n[a].call(i, s);
|
|
139
|
+
return s;
|
|
140
|
+
}, Jt = (e, t, i, s, a, n) => {
|
|
141
|
+
var h, o, w, p, _, r = t & 7, g = !!(t & 8), d = !!(t & 16), f = r > 3 ? e.length + 1 : r ? g ? 1 : 2 : 0, E = Ht[r + 5], C = r > 3 && (e[f - 1] = []), D = e[f] || (e[f] = []), c = r && (!d && !g && (a = a.prototype), r < 5 && (r > 3 || !d) && ze(r < 4 ? a : { get [i]() {
|
|
142
|
+
return Nt(this, n);
|
|
143
|
+
}, set [i](l) {
|
|
144
|
+
return Pt(this, n, l);
|
|
145
|
+
} }, i));
|
|
146
|
+
r ? d && r < 4 && Tt(n, (r > 2 ? "set " : r > 1 ? "get " : "") + i) : Tt(a, i);
|
|
147
|
+
for (var y = s.length - 1; y >= 0; y--)
|
|
148
|
+
p = Pe(r, i, w = {}, e[3], D), r && (p.static = g, p.private = d, _ = p.access = { has: d ? (l) => Le(a, l) : (l) => i in l }, r ^ 3 && (_.get = d ? (l) => (r ^ 1 ? Nt : Be)(l, a, r ^ 4 ? n : c.get) : (l) => l[i]), r > 2 && (_.set = d ? (l, S) => Pt(l, a, S, r ^ 4 ? n : c.set) : (l, S) => l[i] = S)), o = (0, s[y])(r ? r < 4 ? d ? n : c[E] : r > 4 ? void 0 : { get: c.get, set: c.set } : a, p), w._ = 1, r ^ 4 || o === void 0 ? Y(o) && (r > 4 ? C.unshift(o) : r ? d ? n = o : c[E] = o : a = o) : typeof o != "object" || o === null ? R("Object expected") : (Y(h = o.get) && (c.get = h), Y(h = o.set) && (c.set = h), Y(h = o.init) && C.unshift(h));
|
|
149
|
+
return r || Me(e, a), c && vt(a, i, c), d ? r ^ 4 ? n : c : a;
|
|
150
|
+
}, ut = (e, t, i) => t.has(e) || R("Cannot " + i), Le = (e, t) => Object(t) !== t ? R('Cannot use the "in" operator on this value') : e.has(t), Nt = (e, t, i) => (ut(e, t, "read from private field"), i ? i.call(e) : t.get(e)), We = (e, t, i) => t.has(e) ? R("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, i), Pt = (e, t, i, s) => (ut(e, t, "write to private field"), s ? s.call(e, i) : t.set(e, i), i), Be = (e, t, i) => (ut(e, t, "access private method"), i), Kt, it, Qt, B, ft;
|
|
151
|
+
Qt = [Q("nte-navbar")];
|
|
152
|
+
class j extends (it = nt, Kt = [O({ type: Number, attribute: "scroll-threshold", reflect: !0 })], it) {
|
|
135
153
|
constructor() {
|
|
136
|
-
super(), this.navbarRef =
|
|
154
|
+
super(), this.navbarRef = Ct(), this.spacerRef = Ct(), We(this, ft, et(B, 8, this, 0)), et(B, 11, this), this._lastScrollY = window.scrollY, this._scrollUpPixels = 0, this._debouncer = void 0, this._debouncer = new he(100, 300), document.addEventListener(
|
|
137
155
|
"scroll",
|
|
138
156
|
async () => {
|
|
139
157
|
this.updateScrollState();
|
|
@@ -145,24 +163,24 @@ class G extends (Z = J, Ut = [z({ type: Number, attribute: "scroll-threshold", r
|
|
|
145
163
|
return "nte-navbar";
|
|
146
164
|
}
|
|
147
165
|
updateScrollState() {
|
|
148
|
-
const
|
|
149
|
-
|
|
166
|
+
const t = window.scrollY;
|
|
167
|
+
t > 1 ? this.classList.add("is-scrolled") : this.classList.remove("is-scrolled"), t < this._lastScrollY ? (this._scrollUpPixels += this._lastScrollY - t, this._scrollUpPixels > 10 && t < this.scrollThreshold && this.classList.add("is-scrolling-up")) : (this._scrollUpPixels = 0, this.classList.remove("is-scrolling-up")), t > this.scrollThreshold ? this.classList.add("is-below-threshold") : this.classList.remove("is-below-threshold"), this._lastScrollY = t;
|
|
150
168
|
}
|
|
151
169
|
async connectedCallback() {
|
|
152
|
-
this.updateScrollState(), await
|
|
170
|
+
this.updateScrollState(), await V(), super.connectedCallback();
|
|
153
171
|
}
|
|
154
172
|
// Adjust the spacer height on every render
|
|
155
|
-
async updated(
|
|
156
|
-
await
|
|
173
|
+
async updated(t) {
|
|
174
|
+
await V(), super.updated(t);
|
|
157
175
|
}
|
|
158
|
-
firstUpdated(
|
|
159
|
-
|
|
176
|
+
firstUpdated(t) {
|
|
177
|
+
Lt.observeEmptySlots(this);
|
|
160
178
|
}
|
|
161
179
|
render() {
|
|
162
|
-
return
|
|
180
|
+
return q`
|
|
163
181
|
<div id="wrapper" part="wrapper">
|
|
164
|
-
<div id="spacer" part="spacer" ${
|
|
165
|
-
<div id="navbar" part="navbar" ${
|
|
182
|
+
<div id="spacer" part="spacer" ${Ot(this.spacerRef)}></div>
|
|
183
|
+
<div id="navbar" part="navbar" ${Ot(this.navbarRef)}>
|
|
166
184
|
<div id="brand" part="brand">
|
|
167
185
|
<slot name="brand"></slot>
|
|
168
186
|
</div>
|
|
@@ -174,27 +192,27 @@ class G extends (Z = J, Ut = [z({ type: Number, attribute: "scroll-threshold", r
|
|
|
174
192
|
`;
|
|
175
193
|
}
|
|
176
194
|
}
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
const
|
|
184
|
-
var
|
|
185
|
-
throw TypeError(
|
|
186
|
-
},
|
|
187
|
-
for (var a = 0, n = t
|
|
188
|
-
return
|
|
189
|
-
},
|
|
190
|
-
var h,
|
|
191
|
-
|
|
192
|
-
for (var f =
|
|
193
|
-
|
|
194
|
-
return
|
|
195
|
-
},
|
|
196
|
-
|
|
197
|
-
const
|
|
195
|
+
B = Ne(it);
|
|
196
|
+
ft = /* @__PURE__ */ new WeakMap();
|
|
197
|
+
Jt(B, 4, "scrollThreshold", Kt, j, ft);
|
|
198
|
+
j = Jt(B, 0, "NteNavbar", Qt, j);
|
|
199
|
+
j.styles = [K(Ce)];
|
|
200
|
+
et(B, 1, j);
|
|
201
|
+
const Ie = "*,*: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}:host(.brand-center) #container{justify-content:space-between;position:relative}:host(.brand-center) #container #brand{justify-content:center;width:100%}:host(.brand-center) #container #nav{position:absolute;right:0;top:0;bottom:0}#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}";
|
|
202
|
+
var Re = Object.create, _t = Object.defineProperty, Ae = Object.getOwnPropertyDescriptor, Vt = (e, t) => (t = Symbol[e]) ? t : Symbol.for("Symbol." + e), Xt = (e) => {
|
|
203
|
+
throw TypeError(e);
|
|
204
|
+
}, De = (e, t, i) => t in e ? _t(e, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[t] = i, Fe = (e, t) => _t(e, "name", { value: t, configurable: !0 }), Ye = (e) => [, , , Re((e == null ? void 0 : e[Vt("metadata")]) ?? null)], Ge = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], Zt = (e) => e !== void 0 && typeof e != "function" ? Xt("Function expected") : e, Ue = (e, t, i, s, a) => ({ kind: Ge[e], name: t, metadata: s, addInitializer: (n) => i._ ? Xt("Already initialized") : a.push(Zt(n || null)) }), qe = (e, t) => De(t, Vt("metadata"), e[3]), je = (e, t, i, s) => {
|
|
205
|
+
for (var a = 0, n = e[t >> 1], h = n && n.length; a < h; a++) n[a].call(i);
|
|
206
|
+
return s;
|
|
207
|
+
}, He = (e, t, i, s, a, n) => {
|
|
208
|
+
var h, o, w, p = t & 7, _ = !1, r = 0, g = e[r] || (e[r] = []), d = p && (a = a.prototype, p < 5 && (p > 3 || !_) && Ae(a, i));
|
|
209
|
+
Fe(a, i);
|
|
210
|
+
for (var f = s.length - 1; f >= 0; f--)
|
|
211
|
+
w = Ue(p, i, o = {}, e[3], g), h = (0, s[f])(a, w), o._ = 1, Zt(h) && (a = h);
|
|
212
|
+
return qe(e, a), d && _t(a, i, d), _ ? p ^ 4 ? n : d : a;
|
|
213
|
+
}, te, gt, ee;
|
|
214
|
+
te = [Q("nte-navbar-line")];
|
|
215
|
+
const xt = class xt extends (ee = nt) {
|
|
198
216
|
constructor() {
|
|
199
217
|
super(...arguments), this._isScrolled = !1;
|
|
200
218
|
}
|
|
@@ -202,17 +220,17 @@ const yt = class yt extends (Qt = J) {
|
|
|
202
220
|
return "nte-navbar-line";
|
|
203
221
|
}
|
|
204
222
|
updateScrollState() {
|
|
205
|
-
const
|
|
206
|
-
|
|
223
|
+
const t = window.scrollY;
|
|
224
|
+
t > 1 && !this._isScrolled ? (this.classList.add("is-scrolled"), this._isScrolled = !0) : t <= 1 && this._isScrolled && (this.classList.remove("is-scrolled"), this._isScrolled = !1);
|
|
207
225
|
}
|
|
208
226
|
connectedCallback() {
|
|
209
227
|
super.connectedCallback(), window.addEventListener("scroll", () => this.updateScrollState(), { passive: !0 });
|
|
210
228
|
}
|
|
211
|
-
async firstUpdated(
|
|
212
|
-
|
|
229
|
+
async firstUpdated(t) {
|
|
230
|
+
Lt.observeEmptySlots(this), this.updateScrollState();
|
|
213
231
|
}
|
|
214
232
|
render() {
|
|
215
|
-
return
|
|
233
|
+
return q`
|
|
216
234
|
<div id="main" part="main">
|
|
217
235
|
<div id="container" part="container">
|
|
218
236
|
<div id="brand" part="brand">
|
|
@@ -226,124 +244,124 @@ const yt = class yt extends (Qt = J) {
|
|
|
226
244
|
`;
|
|
227
245
|
}
|
|
228
246
|
};
|
|
229
|
-
|
|
230
|
-
let
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
const
|
|
235
|
-
var
|
|
236
|
-
throw TypeError(
|
|
237
|
-
},
|
|
238
|
-
for (var a = 0, n = t
|
|
239
|
-
return
|
|
240
|
-
},
|
|
241
|
-
var h,
|
|
242
|
-
return
|
|
243
|
-
}, set [
|
|
244
|
-
return
|
|
245
|
-
} },
|
|
246
|
-
|
|
247
|
-
for (var
|
|
248
|
-
p =
|
|
249
|
-
return
|
|
250
|
-
},
|
|
251
|
-
|
|
252
|
-
class
|
|
247
|
+
xt.styles = [K(Ie)];
|
|
248
|
+
let H = xt;
|
|
249
|
+
gt = Ye(ee);
|
|
250
|
+
H = He(gt, 0, "NteNavbarLine", te, H);
|
|
251
|
+
je(gt, 1, H);
|
|
252
|
+
const Je = ":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}";
|
|
253
|
+
var Ke = Object.create, bt = Object.defineProperty, Qe = Object.getOwnPropertyDescriptor, ie = (e, t) => (t = Symbol[e]) ? t : Symbol.for("Symbol." + e), A = (e) => {
|
|
254
|
+
throw TypeError(e);
|
|
255
|
+
}, Ve = (e, t, i) => t in e ? bt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[t] = i, Mt = (e, t) => bt(e, "name", { value: t, configurable: !0 }), Xe = (e) => [, , , Ke((e == null ? void 0 : e[ie("metadata")]) ?? null)], re = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], G = (e) => e !== void 0 && typeof e != "function" ? A("Function expected") : e, Ze = (e, t, i, s, a) => ({ kind: re[e], name: t, metadata: s, addInitializer: (n) => i._ ? A("Already initialized") : a.push(G(n || null)) }), ti = (e, t) => Ve(t, ie("metadata"), e[3]), m = (e, t, i, s) => {
|
|
256
|
+
for (var a = 0, n = e[t >> 1], h = n && n.length; a < h; a++) t & 1 ? n[a].call(i) : s = n[a].call(i, s);
|
|
257
|
+
return s;
|
|
258
|
+
}, P = (e, t, i, s, a, n) => {
|
|
259
|
+
var h, o, w, p, _, r = t & 7, g = !!(t & 8), d = !!(t & 16), f = r > 3 ? e.length + 1 : r ? g ? 1 : 2 : 0, E = re[r + 5], C = r > 3 && (e[f - 1] = []), D = e[f] || (e[f] = []), c = r && (!d && !g && (a = a.prototype), r < 5 && (r > 3 || !d) && Qe(r < 4 ? a : { get [i]() {
|
|
260
|
+
return W(this, n);
|
|
261
|
+
}, set [i](l) {
|
|
262
|
+
return rt(this, n, l);
|
|
263
|
+
} }, i));
|
|
264
|
+
r ? d && r < 4 && Mt(n, (r > 2 ? "set " : r > 1 ? "get " : "") + i) : Mt(a, i);
|
|
265
|
+
for (var y = s.length - 1; y >= 0; y--)
|
|
266
|
+
p = Ze(r, i, w = {}, e[3], D), r && (p.static = g, p.private = d, _ = p.access = { has: d ? (l) => ei(a, l) : (l) => i in l }, r ^ 3 && (_.get = d ? (l) => (r ^ 1 ? W : ii)(l, a, r ^ 4 ? n : c.get) : (l) => l[i]), r > 2 && (_.set = d ? (l, S) => rt(l, a, S, r ^ 4 ? n : c.set) : (l, S) => l[i] = S)), o = (0, s[y])(r ? r < 4 ? d ? n : c[E] : r > 4 ? void 0 : { get: c.get, set: c.set } : a, p), w._ = 1, r ^ 4 || o === void 0 ? G(o) && (r > 4 ? C.unshift(o) : r ? d ? n = o : c[E] = o : a = o) : typeof o != "object" || o === null ? A("Object expected") : (G(h = o.get) && (c.get = h), G(h = o.set) && (c.set = h), G(h = o.init) && C.unshift(h));
|
|
267
|
+
return r || ti(e, a), c && bt(a, i, c), d ? r ^ 4 ? n : c : a;
|
|
268
|
+
}, mt = (e, t, i) => t.has(e) || A("Cannot " + i), ei = (e, t) => Object(t) !== t ? A('Cannot use the "in" operator on this value') : e.has(t), W = (e, t, i) => (mt(e, t, "read from private field"), i ? i.call(e) : t.get(e)), L = (e, t, i) => t.has(e) ? A("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, i), rt = (e, t, i, s) => (mt(e, t, "write to private field"), s ? s.call(e, i) : t.set(e, i), i), ii = (e, t, i) => (mt(e, t, "access private method"), i), ae, ne, se, oe, le, de, at, ce, u, wt, yt, St, $t, kt, T;
|
|
269
|
+
ce = [Q("nte-nav-brand-relocator")];
|
|
270
|
+
class x extends (at = ve(ue(nt)), de = [O({ type: String, reflect: !0 })], le = [O({ type: Boolean, reflect: !0 })], oe = [O({ type: String, reflect: !0 })], se = [Z()], ne = [Z()], ae = [X("scroll", { target: "window", options: { passive: !0 } })], at) {
|
|
253
271
|
constructor() {
|
|
254
|
-
super(...arguments),
|
|
272
|
+
super(...arguments), m(u, 5, this), L(this, wt, m(u, 8, this, ".brand-image")), m(u, 11, this), L(this, yt, m(u, 12, this, null)), m(u, 15, this), L(this, St, m(u, 16, this, "auto")), m(u, 19, this), L(this, $t, m(u, 20, this, !1)), m(u, 23, this), L(this, kt, m(u, 24, this, !1)), m(u, 27, this), L(this, T, null);
|
|
255
273
|
}
|
|
256
274
|
onScroll() {
|
|
257
275
|
if (this.mode !== "auto") {
|
|
258
276
|
this.log("Mode is not auto, skipping scroll handling");
|
|
259
277
|
return;
|
|
260
278
|
}
|
|
261
|
-
const
|
|
262
|
-
|
|
279
|
+
const t = window.scrollY <= 2;
|
|
280
|
+
t !== this.active && (this.active = t);
|
|
263
281
|
}
|
|
264
282
|
onanimationEnd() {
|
|
265
283
|
this.log("Animation ended - finalizing state"), this.active || (this.brandElement.style.visibility = "visible", this.done = !0);
|
|
266
284
|
}
|
|
267
285
|
get brandElement() {
|
|
268
|
-
return
|
|
286
|
+
return W(this, T) || (rt(this, T, document.querySelector(this.brandSelector)), W(this, T) || this.warn(`Brand element not found using selector: ${this.brandSelector}`)), W(this, T);
|
|
269
287
|
}
|
|
270
288
|
render() {
|
|
271
289
|
var a;
|
|
272
|
-
const
|
|
273
|
-
if (!
|
|
290
|
+
const t = (a = this.brandElement) == null ? void 0 : a.getBoundingClientRect();
|
|
291
|
+
if (!t)
|
|
274
292
|
return null;
|
|
275
|
-
const
|
|
276
|
-
"--orig-top":
|
|
277
|
-
"--orig-left":
|
|
278
|
-
"--orig-width":
|
|
279
|
-
"--orig-height":
|
|
280
|
-
"--self-top":
|
|
281
|
-
"--self-left":
|
|
282
|
-
"--self-width":
|
|
283
|
-
"--self-height":
|
|
293
|
+
const i = this.getBoundingClientRect(), s = {
|
|
294
|
+
"--orig-top": t.top + "px",
|
|
295
|
+
"--orig-left": t.left + "px",
|
|
296
|
+
"--orig-width": t.width + "px",
|
|
297
|
+
"--orig-height": t.height + "px",
|
|
298
|
+
"--self-top": i.top + "px",
|
|
299
|
+
"--self-left": i.left + "px",
|
|
300
|
+
"--self-width": i.width + "px",
|
|
301
|
+
"--self-height": i.height + "px"
|
|
284
302
|
};
|
|
285
|
-
return
|
|
303
|
+
return q`<div
|
|
286
304
|
class="wrapper ${this.active ? "" : "inactive"} ${this.done ? "done" : ""} ${this.initialized ? "initialized" : ""}"
|
|
287
|
-
style=${
|
|
305
|
+
style=${_e(s)}
|
|
288
306
|
@transitionend=${() => this.onanimationEnd()}
|
|
289
307
|
>
|
|
290
308
|
<slot></slot>
|
|
291
309
|
</div>`;
|
|
292
310
|
}
|
|
293
|
-
update(
|
|
294
|
-
var
|
|
295
|
-
|
|
311
|
+
update(t) {
|
|
312
|
+
var i;
|
|
313
|
+
t.has("active") && this.active === !0 && ((i = W(this, T)) == null || i.style.setProperty("visibility", "hidden"), this.done = !1), super.update(t);
|
|
296
314
|
}
|
|
297
315
|
get ghostElement() {
|
|
298
316
|
return this.querySelector("img");
|
|
299
317
|
}
|
|
300
318
|
async firstUpdated() {
|
|
301
|
-
var
|
|
319
|
+
var i, s, a;
|
|
302
320
|
if (this.brandElement === null) {
|
|
303
321
|
this.warn(`Brand element not found using selector: ${this.brandSelector}`);
|
|
304
322
|
return;
|
|
305
323
|
}
|
|
306
|
-
for (this.log("Waiting for Ghost element loading...", this.ghostElement), await
|
|
307
|
-
this.log("Waiting for Ghost element to have naturalWidth...", this.ghostElement), await
|
|
324
|
+
for (this.log("Waiting for Ghost element loading...", this.ghostElement), await Wt(this.ghostElement), await J(10); !((i = this.ghostElement) != null && i.naturalWidth); )
|
|
325
|
+
this.log("Waiting for Ghost element to have naturalWidth...", this.ghostElement), await J(100);
|
|
308
326
|
for (; this.brandElement && !this.brandElement.getBoundingClientRect().width; )
|
|
309
|
-
this.log("Waiting for Brand element to have width...", this.brandElement), await
|
|
310
|
-
const
|
|
311
|
-
this.log("Setting Aspect ratio:",
|
|
327
|
+
this.log("Waiting for Brand element to have width...", this.brandElement), await J(100);
|
|
328
|
+
const t = ((s = this.ghostElement) == null ? void 0 : s.naturalWidth) / ((a = this.ghostElement) == null ? void 0 : a.naturalHeight);
|
|
329
|
+
this.log("Setting Aspect ratio:", t), this.style.setProperty("--auto-aspect-ratio", t.toString()), this.log("Brand element is now loaded:", this.brandElement), this.initialized = !0, this.onScroll();
|
|
312
330
|
}
|
|
313
331
|
async connectedCallback() {
|
|
314
|
-
if (await
|
|
315
|
-
const
|
|
316
|
-
if (this.log("first connectedCallback() on Brand element:",
|
|
332
|
+
if (await V(), this.ghostElement === null) {
|
|
333
|
+
const t = this.brandElement;
|
|
334
|
+
if (this.log("first connectedCallback() on Brand element:", t), !t) {
|
|
317
335
|
this.warn(`Brand element not found using selector: ${this.brandSelector}`);
|
|
318
336
|
return;
|
|
319
337
|
}
|
|
320
338
|
if (!this.hasChildNodes()) {
|
|
321
|
-
const
|
|
322
|
-
this.appendChild(
|
|
339
|
+
const i = fe("img", { src: t.getAttribute("src") });
|
|
340
|
+
this.appendChild(i), this.onScroll();
|
|
323
341
|
}
|
|
324
342
|
}
|
|
325
343
|
super.connectedCallback();
|
|
326
344
|
}
|
|
327
345
|
}
|
|
328
|
-
|
|
329
|
-
_t = /* @__PURE__ */ new WeakMap();
|
|
330
|
-
gt = /* @__PURE__ */ new WeakMap();
|
|
331
|
-
bt = /* @__PURE__ */ new WeakMap();
|
|
332
|
-
mt = /* @__PURE__ */ new WeakMap();
|
|
346
|
+
u = Xe(at);
|
|
333
347
|
wt = /* @__PURE__ */ new WeakMap();
|
|
348
|
+
yt = /* @__PURE__ */ new WeakMap();
|
|
349
|
+
St = /* @__PURE__ */ new WeakMap();
|
|
350
|
+
$t = /* @__PURE__ */ new WeakMap();
|
|
351
|
+
kt = /* @__PURE__ */ new WeakMap();
|
|
334
352
|
T = /* @__PURE__ */ new WeakMap();
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
353
|
+
P(u, 4, "brandSelector", de, x, wt);
|
|
354
|
+
P(u, 4, "active", le, x, yt);
|
|
355
|
+
P(u, 4, "mode", oe, x, St);
|
|
356
|
+
P(u, 4, "done", se, x, $t);
|
|
357
|
+
P(u, 4, "initialized", ne, x, kt);
|
|
358
|
+
P(u, 1, "onScroll", ae, x);
|
|
359
|
+
x = P(u, 0, "NteNavBrandRelocator", ce, x);
|
|
360
|
+
x.styles = [K(Je)];
|
|
361
|
+
m(u, 1, x);
|
|
344
362
|
console.log("Loading nte-nav...");
|
|
345
363
|
export {
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
364
|
+
$ as NteNav,
|
|
365
|
+
x as NteNavBrandRelocator,
|
|
366
|
+
j as NteNavbar
|
|
349
367
|
};
|
package/lib/nte-nav.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { PropertyValues } from 'lit';
|
|
2
|
+
declare const NteNav_base: import('@nextrap/nte-core').InternalNextrapElementType;
|
|
2
3
|
/**
|
|
3
4
|
* <nte-nav>
|
|
4
5
|
* <span slot="brand">Brand</span>
|
|
@@ -7,20 +8,24 @@ import { LitElement, PropertyValues } from 'lit';
|
|
|
7
8
|
* [optionally:] <nte-burger slot="burger"></nte-burger>
|
|
8
9
|
* </nte-nav>
|
|
9
10
|
*/
|
|
10
|
-
export declare class NteNav extends
|
|
11
|
+
export declare class NteNav extends NteNav_base {
|
|
12
|
+
#private;
|
|
11
13
|
static styles: import('lit').CSSResult[];
|
|
12
14
|
accessor mode: 'master' | 'slave';
|
|
13
15
|
accessor breakpoint: string | number;
|
|
14
16
|
accessor transferTo: string;
|
|
15
17
|
accessor dataGroupName: string;
|
|
16
18
|
private accessor _isTransferred;
|
|
19
|
+
private handleClickOnSubmenu;
|
|
20
|
+
private handleClickOutside;
|
|
17
21
|
private getOffcanvas;
|
|
18
22
|
private getOffcanvasNav;
|
|
19
23
|
constructor();
|
|
20
24
|
render(): import('lit-html').TemplateResult<1>;
|
|
21
25
|
transferToElement(targetElement: NteNav): void;
|
|
22
|
-
|
|
23
|
-
|
|
26
|
+
updated(_changedProperties: PropertyValues): void;
|
|
27
|
+
firstUpdated(_changedProperties: PropertyValues): void;
|
|
24
28
|
private updateTransferState;
|
|
25
29
|
connectedCallback(): Promise<void>;
|
|
26
30
|
}
|
|
31
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nextrap/nte-nav",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.39",
|
|
4
4
|
"main": "./index.js",
|
|
5
5
|
"dependencies": {
|
|
6
6
|
"@nextrap/nt-framework": "^1.1.1",
|
|
7
7
|
"@nextrap/nte-burger": "^1.1.7",
|
|
8
|
+
"@nextrap/nte-core": "^1.0.2",
|
|
8
9
|
"@nextrap/nte-offcanvas": "^1.0.16",
|
|
9
10
|
"@trunkjs/browser-utils": "^1.0.12"
|
|
10
11
|
},
|