@graupl/graupl 1.0.0-beta.45 → 1.0.0-beta.47

package/dist/js/component/breadcrumb.es.js

@@ -635,12 +635,12 @@ var O = class {
 	_mediaQueryListEventCallback = (t) => {
 		t.matches ? (this.unlockInsideBreakpoint && this.unlock(), this.isOpen && this.closeInsideBreakpoint ? (this.isLocked && this.unlock(), this.close({ preserveState: !0 })) : !this.isOpen && this.openInsideBreakpoint && (this.isLocked && this.unlock(), this.open()), this.lockInsideBreakpoint && this.lock()) : (this.unlockOutsideBreakpoint && this.unlock(), this.isOpen && this.closeOutsideBreakpoint ? (this.isLocked && this.unlock(), this.close({ preserveState: !0 })) : !this.isOpen && this.openOutsideBreakpoint && (this.isLocked && this.unlock(), this.open()), this.lockOutsideBreakpoint && this.lock());
 	};
-	constructor({ breadcrumbElement: t, breadcrumbItemsSelector: e = ".breadcrumb-item", breadcrumbLinksSelector: i = ".breadcrumb-link", breadcrumbToggleSelector: s = ".breadcrumb-toggle", lockedClass: r = "locked", unlockedClass: o = "unlocked", openClass: a = "show", closeClass: f = "hide", transitionClass: v = "transition", transitionDuration: I = 250, openDuration: T = -1, closeDuration: $ = -1, openOnFocus: M = !1, closeOnBlur: D = !1, minWidth: g = "", breakpoint: m = "856px", autoOpen: p = !1, openInsideBreakpoint: S = !1, openOutsideBreakpoint: k = !0, closeInsideBreakpoint: y = !0, closeOutsideBreakpoint: L = !1, lockInsideBreakpoint: z = !1, lockOutsideBreakpoint: A = !0, unlockInsideBreakpoint: j = !0, unlockOutsideBreakpoint: F = !1, locked: x = !1, mediaQuery: Q = "", prefix: q = "graupl-", key: V = null, initializeClass: P = "initializing", initialize: K = !1 }) {
+	constructor({ breadcrumbElement: t, breadcrumbItemsSelector: e = ".breadcrumb-item", breadcrumbLinksSelector: i = ".breadcrumb-link", breadcrumbToggleSelector: s = ".breadcrumb-toggle", lockedClass: r = "locked", unlockedClass: o = "unlocked", openClass: a = "show", closeClass: f = "hide", transitionClass: v = "transition", transitionDuration: T = 250, openDuration: I = -1, closeDuration: $ = -1, openOnFocus: M = !1, closeOnBlur: D = !1, minWidth: g = "", breakpoint: m = "856px", autoOpen: p = !1, openInsideBreakpoint: S = !1, openOutsideBreakpoint: k = !0, closeInsideBreakpoint: y = !0, closeOutsideBreakpoint: L = !1, lockInsideBreakpoint: z = !1, lockOutsideBreakpoint: A = !0, unlockInsideBreakpoint: j = !0, unlockOutsideBreakpoint: F = !1, locked: x = !1, mediaQuery: Q = "", prefix: q = "graupl-", key: V = null, initializeClass: P = "initializing", initialize: K = !1 }) {
 		super({
 			prefix: q,
 			key: V,
 			initializeClass: P
-		}), this._dom.breadcrumb = t, this._dom.breadcrumbItems = [], this._dom.breadcrumbLinks = [], this._dom.breadcrumbToggle = null, this._selectors.breadcrumbItems = e, this._selectors.breadcrumbLinks = i, this._selectors.breadcrumbToggle = s, this._elements.breadcrumbItems = [], this._classes.locked = r || "", this._classes.unlocked = o || "", this._classes.open = a || "", this._classes.close = f || "", this._classes.transition = v || "", this._durations.transition = I, this._durations.open = T, this._durations.close = $, this._openOnFocus = M, this._closeOnBlur = D, g !== "" && (console.warn("`minWidth` is deprecated and will be removed in a future release. Please set `breakpoint` instead."), m === "" && (m = g)), p && m !== "" && (console.warn("`autoOpen` is deprecated and will be removed in a future release. Please set `openOutsideBreakpoint` and `closeInsideBreakpoint` to `true` instead."), k = p, y = p), this._breakpoint = m || "", this._openInsideBreakpoint = S, this._openOutsideBreakpoint = k, this._closeInsideBreakpoint = y, this._closeOutsideBreakpoint = L, this._lockInsideBreakpoint = z, this._lockOutsideBreakpoint = A, this._unlockInsideBreakpoint = j, this._unlockOutsideBreakpoint = F, this._mediaQueryString = Q || "", this._locked.value = x, this._locked.commit(), this._registerEvent("expand", { detail: { breadcrumb: this } }), this._registerEvent("collapse", { detail: { breadcrumb: this } }), this._registerEvent("lock", { detail: { breadcrumb: this } }), this._registerEvent("unlock", { detail: { breadcrumb: this } }), this._addEventListener("grauplComponentInitialize", this.rootDOMElement, () => {
+		}), this._dom.breadcrumb = t, this._dom.breadcrumbItems = [], this._dom.breadcrumbLinks = [], this._dom.breadcrumbToggle = null, this._selectors.breadcrumbItems = e, this._selectors.breadcrumbLinks = i, this._selectors.breadcrumbToggle = s, this._elements.breadcrumbItems = [], this._classes.locked = r || "", this._classes.unlocked = o || "", this._classes.open = a || "", this._classes.close = f || "", this._classes.transition = v || "", this._durations.transition = T, this._durations.open = I, this._durations.close = $, this._openOnFocus = M, this._closeOnBlur = D, g !== "" && (console.warn("`minWidth` is deprecated and will be removed in a future release. Please set `breakpoint` instead."), m === "" && (m = g)), p && m !== "" && (console.warn("`autoOpen` is deprecated and will be removed in a future release. Please set `openOutsideBreakpoint` and `closeInsideBreakpoint` to `true` instead."), k = p, y = p), this._breakpoint = m || "", this._openInsideBreakpoint = S, this._openOutsideBreakpoint = k, this._closeInsideBreakpoint = y, this._closeOutsideBreakpoint = L, this._lockInsideBreakpoint = z, this._lockOutsideBreakpoint = A, this._unlockInsideBreakpoint = j, this._unlockOutsideBreakpoint = F, this._mediaQueryString = Q || "", this._locked.value = x, this._locked.commit(), this._registerEvent("expand", { detail: { breadcrumb: this } }), this._registerEvent("collapse", { detail: { breadcrumb: this } }), this._registerEvent("lock", { detail: { breadcrumb: this } }), this._registerEvent("unlock", { detail: { breadcrumb: this } }), this._addEventListener("grauplComponentInitialize", this.rootDOMElement, () => {
 			requestAnimationFrame(() => {
 				this.dom.breadcrumbToggle && (this.dom.breadcrumbToggle.getAttribute("aria-expanded") === "true" || this.openOutsideBreakpoint && !window.matchMedia(this.mediaQuery).matches || this.openInsideBreakpoint && window.matchMedia(this.mediaQuery).matches ? this.open({ force: !0 }) : this.close({ force: !0 })), this.isLocked || this.lockInsideBreakpoint && window.matchMedia(this.mediaQuery).matches || this.lockOutsideBreakpoint && !window.matchMedia(this.mediaQuery).matches ? this.lock({ force: !0 }) : this.unlock({ force: !0 });
 			});
@@ -802,7 +802,7 @@ var O = class {
 		});
 	}
 	_reveal({ emit: t = this.isInitialized, transition: e = this.isInitialized } = {}) {
-		this.dom.breadcrumbToggle.setAttribute("aria-expanded", "true"), e && this.transitionlass !== "" ? (h(this.transitionClass, this.dom.breadcrumb), requestAnimationFrame(() => {
+		this.dom.breadcrumbToggle && this.dom.breadcrumbToggle.setAttribute("aria-expanded", "true"), e && this.transitionlass !== "" ? (h(this.transitionClass, this.dom.breadcrumb), requestAnimationFrame(() => {
 			l(this.closeClass, this.dom.breadcrumb), requestAnimationFrame(() => {
 				h(this.openClass, this.dom.breadcrumb), requestAnimationFrame(() => {
 					setTimeout(() => {
@@ -810,10 +810,10 @@ var O = class {
 					}, this.openDuration);
 				});
 			});
-		})) : (h(this.openClass, this.dom.breadcrumb), l(this.closeClass, this.dom.breadcrumb)), t && this._dispatchEvent("expand", this.dom.breadcrumbToggle);
+		})) : (h(this.openClass, this.dom.breadcrumb), l(this.closeClass, this.dom.breadcrumb)), t && (this.dom.breadcrumbToggle ? this._dispatchEvent("expand", this.dom.breadcrumbToggle) : this._dispatchEvent("expand", this.dom.breadcrumb));
 	}
 	_conceal({ emit: t = this.isInitialized, transition: e = this.isInitialized } = {}) {
-		this.dom.breadcrumbToggle.setAttribute("aria-expanded", "false"), e && this.transitionClass !== "" ? (h(this.transitionClass, this.dom.breadcrumb), requestAnimationFrame(() => {
+		this.dom.breadcrumbToggle && this.dom.breadcrumbToggle.setAttribute("aria-expanded", "false"), e && this.transitionClass !== "" ? (h(this.transitionClass, this.dom.breadcrumb), requestAnimationFrame(() => {
 			l(this.openClass, this.dom.breadcrumb), requestAnimationFrame(() => {
 				h(this.closeClass, this.dom.breadcrumb), requestAnimationFrame(() => {
 					setTimeout(() => {
@@ -821,13 +821,13 @@ var O = class {
 					}, this.closeDuration);
 				});
 			});
-		})) : (h(this.closeClass, this.dom.breadcrumb), l(this.openClass, this.dom.breadcrumb)), t && this._dispatchEvent("collapse", this.dom.breadcrumbToggle);
+		})) : (h(this.closeClass, this.dom.breadcrumb), l(this.openClass, this.dom.breadcrumb)), t && (this.dom.breadcrumbToggle ? this._dispatchEvent("collapse", this.dom.breadcrumbToggle) : this._dispatchEvent("collapse", this.dom.breadcrumb));
 	}
 	_lock({ emit: t = this.isInitialized } = {}) {
-		h(this.lockedClass, this.dom.breadcrumb), l(this.unlockedClass, this.dom.breadcrumb), this.dom.breadcrumbToggle.setAttribute("disabled", "true"), t && this._dispatchEvent("lock", this.dom.breadcrumbToggle);
+		h(this.lockedClass, this.dom.breadcrumb), l(this.unlockedClass, this.dom.breadcrumb), this.dom.breadcrumbToggle && this.dom.breadcrumbToggle.setAttribute("disabled", "true"), t && (this.dom.breadcrumbToggle ? this._dispatchEvent("lock", this.dom.breadcrumbToggle) : this._dispatchEvent("lock", this.dom.breadcrumb));
 	}
 	_unlock({ emit: t = this.isInitialized } = {}) {
-		h(this.unlockedClass, this.dom.breadcrumb), l(this.lockedClass, this.dom.breadcrumb), this.dom.breadcrumbToggle.removeAttribute("disabled"), t && this._dispatchEvent("unlock", this.dom.breadcrumbToggle);
+		h(this.unlockedClass, this.dom.breadcrumb), l(this.lockedClass, this.dom.breadcrumb), this.dom.breadcrumbToggle && this.dom.breadcrumbToggle.removeAttribute("disabled"), t && (this.dom.breadcrumbToggle ? this._dispatchEvent("unlock", this.dom.breadcrumbToggle) : this._dispatchEvent("unlock", this.dom.breadcrumb));
 	}
 	_handleFocus() {
 		this.elements.breadcrumbItems.forEach((t, e) => {
@@ -839,26 +839,30 @@ var O = class {
 		});
 	}
 	_handleClick() {
-		this.dom.breadcrumbToggle && (this._addEventListener("click", this.dom.breadcrumbToggle, (t) => {
-			this.currentEvent = "mouse", t.button === 0 && (d(t), this.toggle());
-		}), this._addEventListener("click", document, (t) => {
+		this._addEventListener("click", document, (t) => {
 			this.focusState !== "self" || !this.closeOnBlur || (this.currentEvent = "mouse", !this.dom.breadcrumb.contains(t.target) && this.dom.breadcrumbToggle !== t.target && this.close());
-		}));
+		}), this.dom.breadcrumbToggle && this._addEventListener("click", this.dom.breadcrumbToggle, (t) => {
+			this.currentEvent = "mouse", t.button === 0 && (d(t), this.toggle());
+		});
 	}
 	_handleKeydown() {
-		this.dom.breadcrumbToggle && (this._addEventListener("keydown", this.dom.breadcrumbToggle, (t) => {
+		this._addEventListener("keydown", this.dom.breadcrumb, (t) => {
+			this.currentEvent = "keyboard", _(t) === "Escape" && d(t);
+		}), this.dom.breadcrumbToggle && this._addEventListener("keydown", this.dom.breadcrumbToggle, (t) => {
 			switch (this.currentEvent = "keyboard", _(t)) {
 				case "Space":
 				case "Enter":
 					d(t);
 					break;
 			}
-		}), this._addEventListener("keydown", this.dom.breadcrumb, (t) => {
-			this.currentEvent = "keyboard", _(t) === "Escape" && d(t);
-		}));
+		});
 	}
 	_handleKeyup() {
-		this.dom.breadcrumbToggle && (this._addEventListener("keyup", this.dom.breadcrumbToggle, (t) => {
+		this._addEventListener("keyup", this.dom.breadcrumb, (t) => {
+			this.currentEvent = "keyboard", _(t) === "Escape" && (d(t), this.close(), this.currentChild > this.elements.breadcrumbItems.indexOf(this.elements.breadcrumbToggle) && requestAnimationFrame(() => {
+				this.focusToggle();
+			}));
+		}), this.dom.breadcrumbToggle && this._addEventListener("keyup", this.dom.breadcrumbToggle, (t) => {
 			switch (this.currentEvent = "keyboard", _(t)) {
 				case "Space":
 				case "Enter":
@@ -872,11 +876,7 @@ var O = class {
 					}));
 					break;
 			}
-		}), this._addEventListener("keyup", this.dom.breadcrumb, (t) => {
-			this.currentEvent = "keyboard", _(t) === "Escape" && (d(t), this.close(), this.currentChild > this.elements.breadcrumbItems.indexOf(this.elements.breadcrumbToggle) && requestAnimationFrame(() => {
-				this.focusToggle();
-			}));
-		}));
+		});
 	}
 	open({ force: t = !1, emit: e = this.isInitialized, transition: i = this.isInitialized, preserveState: s = !1 } = {}) {
 		this.isOpen && !t || this.isLocked && !t || (this.focusState = "self", this._reveal({