@pnx-mixtape/mxds 0.1.0-rc.4 → 0.1.0-rc.5

package/dist/build/chunks/Gallery-Rkfv7Mbb.js

@@ -0,0 +1,165 @@
+import { n as e } from "./cookie-compliance-CG6x-TcV.js";
+import { t } from "./utilities-Dd-08SW6.js";
+import { t as n } from "./Dialog-DWoXW-7Z.js";
+//#region src/Component/Carousel/Elements/Carousel.ts
+var r = class extends HTMLElement {
+	internals_;
+	controller;
+	debounced;
+	loop;
+	paginationType;
+	activePage;
+	itemMap;
+	iO;
+	rO;
+	mO;
+	ioTimeout;
+	constructor() {
+		super(), this.internals_ = this.attachInternals(), this.controller = new AbortController();
+	}
+	connectedCallback() {
+		if (!this.track) return;
+		this.buttons && (this.buttons.hidden = !1), this.activePage = 0, this.track.scrollLeft = 0, this.debounced = null, this.loop = this.hasAttribute("loop");
+		let { signal: e } = this.controller;
+		this.prev && (this.prev.disabled = !0, this.prev.addEventListener("click", () => this.handleNavigation(this.activePage - 1), { signal: e })), this.next && this.next.addEventListener("click", () => this.handleNavigation(this.activePage + 1), { signal: e }), this.track.addEventListener("scroll", this.handleScroll, { signal: e }), this.pagination && (this.paginationType = this.pagination.getAttribute("data-pagination"), this.pagination.addEventListener("click", this.handlePagination, { signal: e })), Array.from(this.track.children).forEach((e, t) => {
+			e.setAttribute("data-index", String(t));
+		});
+		let t = this.track.querySelectorAll("[data-index]");
+		this.itemMap = /* @__PURE__ */ new Map(), this.iO = new IntersectionObserver((e) => {
+			e.forEach(({ target: e, intersectionRatio: t }) => {
+				let n = e;
+				t > .5 ? (n.removeAttribute("inert"), n.setAttribute("aria-hidden", "false"), this.itemMap.set(n, !0)) : (n.setAttribute("inert", ""), n.setAttribute("aria-hidden", "true"), this.itemMap.set(n, !1));
+			});
+		}, {
+			root: this.track,
+			threshold: .5
+		}), t.forEach((e) => this.iO.observe(e)), this.rO = new ResizeObserver((e) => {
+			e.forEach(() => this.handleOverflow());
+		}), this.rO.observe(this.track), this.mO = new MutationObserver((e) => {
+			e.forEach(() => this.handleOverflow());
+		}), this.mO.observe(this.track, { childList: !0 });
+	}
+	disconnectedCallback() {
+		this.controller.abort(), this.mO.disconnect(), this.iO.disconnect(), this.rO.disconnect(), clearTimeout(this.debounced), clearTimeout(this.ioTimeout);
+	}
+	handleNavigation = (e, t = "arrow") => {
+		let n = e > this.activePage, r = this.loop && this.next.hasAttribute("data-restart");
+		if (e === 0 || r && n && t === "arrow") {
+			this.activePage = 0, this.items[0].scrollIntoView({
+				inline: "start",
+				block: "nearest"
+			}), this.next.removeAttribute("data-restart");
+			return;
+		}
+		this.activePage = e, this.items[this.visibleCount * e].scrollIntoView({
+			inline: "start",
+			block: "nearest"
+		}), r && !n && this.next.removeAttribute("data-restart");
+		let i = new CustomEvent("carousel-slide", {
+			bubbles: !0,
+			cancelable: !0,
+			detail: {
+				page: this.activePage,
+				type: t
+			}
+		});
+		this.dispatchEvent(i);
+	};
+	handleDisabled = () => {
+		let e = !1;
+		if (this.prev && (this.prev.disabled = this.track.scrollLeft < 200), (this.next || this.pagination) && (e = Math.round(this.track.scrollLeft) >= Math.round(this.track.scrollWidth - this.track.offsetWidth)), this.next && (this.loop ? e && this.next.setAttribute("data-restart", "") : this.next.disabled = e), this.pagination) {
+			let t = Math.round(this.track.offsetLeft + this.track.scrollLeft);
+			if (e) this.activePage = this.pageStartItems.length - 1;
+			else {
+				let e = 0, n = Infinity;
+				this.pageStartItems.forEach((r, i) => {
+					let a = Math.abs(Math.round(r.offsetLeft) - t);
+					a < n && (n = a, e = i);
+				}), this.activePage = e;
+			}
+			this.pagination.querySelectorAll("button").forEach((e) => {
+				let t = e.getAttribute("data-index");
+				if (!t) return;
+				let n = parseInt(t, 10) === this.activePage;
+				e.disabled = n, n ? e.setAttribute("aria-current", "page") : e.removeAttribute("aria-current");
+			});
+		}
+	};
+	handleScroll = () => {
+		clearTimeout(this.debounced), this.debounced = setTimeout(this.handleDisabled, this.pagination ? 100 : 200);
+	};
+	handleOverflow = () => {
+		let { scrollWidth: e, clientWidth: t } = this.track, n = e > t;
+		this.track.classList.toggle("overflowing", n), n ? (this.pagination && (this.ioTimeout = setTimeout(this.buildPagination, 200)), this.track.setAttribute("tabindex", "0")) : this.track.removeAttribute("tabindex");
+	};
+	buildPagination = () => {
+		if (!this.pagination.hidden) {
+			let e = this.pagination.querySelectorAll("button");
+			if (e.length === this.pageStartItems.length) return;
+			e.forEach((e) => e.remove());
+		}
+		let e = Array.from({ length: this.pageStartItems.length }).fill(null);
+		if (e.length <= 0) return;
+		e.forEach((n, r) => {
+			let i = r + 1, a = t(`<button type="button" data-index="${r}" aria-label="Page ${i}">${i}</button>`);
+			this.pagination.append(a), e[r] = a;
+		});
+		let n = e[0];
+		n.disabled = !0, n.setAttribute("aria-current", "page"), this.pagination.hidden = !1;
+	};
+	handlePagination = (t) => {
+		let n = t.target.getAttribute("data-index");
+		if (!n || !e.integer(n, 0)) return;
+		let r = parseInt(n, 10);
+		this.handleNavigation(r, "pagination");
+	};
+	get track() {
+		let e = this.querySelector("[data-track]");
+		if (!e) throw Error(`${this.localName} must contain an element with [data-track].`);
+		return e;
+	}
+	get buttons() {
+		return this.querySelector("[data-buttons]");
+	}
+	get prev() {
+		return this.buttons?.querySelector(".mx-carousel__prev");
+	}
+	get next() {
+		return this.buttons?.querySelector(".mx-carousel__next");
+	}
+	get pagination() {
+		return this.querySelector("[data-pagination]");
+	}
+	get items() {
+		return [...this.itemMap.keys()];
+	}
+	get visibleCount() {
+		return [...this.itemMap.values()].filter((e) => e).length;
+	}
+	get pageStartItems() {
+		return [...this.items].filter((e, t) => t % this.visibleCount === 0);
+	}
+};
+customElements.get("mx-carousel") || customElements.define("mx-carousel", r);
+//#endregion
+//#region src/Component/Gallery/Elements/Gallery.ts
+var i = class extends n {
+	connectedCallback() {
+		if (super.connectedCallback(), !this.dialog) return;
+		let { signal: e } = this.controller;
+		this.openBtns?.forEach((t) => t.addEventListener("click", () => this.scrollToTrigger(t), { signal: e }));
+	}
+	scrollToTrigger = (e) => {
+		let t = e.dataset.galleryIndex ?? "0", n = this.carousel?.track?.querySelector(`[data-index="${t}"]`);
+		n && (n.removeAttribute("inert"), n.scrollIntoView({
+			inline: "start",
+			block: "nearest"
+		}));
+	};
+	get carousel() {
+		return this.querySelector("mx-carousel");
+	}
+};
+customElements.get("mx-gallery") || customElements.define("mx-gallery", i);
+//#endregion
+export { r as n, i as t };

package/dist/build/chunks/GlobalToggle-CzlkpLpc.js

@@ -0,0 +1,82 @@
+import { u as e } from "./utilities-Dd-08SW6.js";
+import { createFocusTrap as t } from "focus-trap";
+//#region src/Layout/Header/Elements/GlobalToggle.ts
+var n = class extends HTMLElement {
+	internals_;
+	controller;
+	widget;
+	focusTrap;
+	controls;
+	mq;
+	triggerText;
+	isOpen = !1;
+	closeIconClass = "mx-icon--close";
+	menuIconClass = "mx-icon--menu";
+	searchIconClass = "mx-icon--search";
+	backgroundClass = "mx-background--primary";
+	scrollLockClass = "body--scroll-lock";
+	isSearch;
+	hideOther = !0;
+	otherTrigger;
+	rafId;
+	focusTrapTimeout;
+	constructor() {
+		super(), this.internals_ = this.attachInternals(), this.controller = new AbortController(), this.mq = this.getAttribute("mq") || "(max-width: 720px)";
+	}
+	connectedCallback() {
+		if (!this.trigger || !this.target) return;
+		this.trigger.getAttribute("hideOther") === "false" && (this.hideOther = !1), this.isSearch = this.controls.includes("search"), this.otherTrigger = document.querySelector(this.isSearch ? `.${this.menuIconClass}` : `.${this.searchIconClass}`), this.widget = new e(this.trigger, this.target), this.widget.init(), this.focusTrap = t(this.target, {
+			escapeDeactivates: !1,
+			setReturnFocus: this.trigger,
+			allowOutsideClick: !0,
+			onActivate: () => document.body.classList.add(this.scrollLockClass),
+			onDeactivate: () => document.body.classList.remove(this.scrollLockClass),
+			checkCanFocusTrap: ([e]) => new Promise((t) => {
+				this.focusTrapTimeout = setTimeout(() => {
+					this.rafId &&= (cancelAnimationFrame(this.rafId), null), t();
+				}, 2e3);
+				let n = () => {
+					getComputedStyle(e).visibility === "hidden" ? this.rafId = requestAnimationFrame(n) : (this.focusTrapTimeout &&= (clearTimeout(this.focusTrapTimeout), null), this.rafId = null, t());
+				};
+				this.rafId = requestAnimationFrame(n);
+			})
+		});
+		let { signal: n } = this.controller;
+		this.handleBreakpoint(this.breakpoint), this.breakpoint.addEventListener("change", this.handleBreakpoint, { signal: n }), document.addEventListener("keydown", this.handleKeyDown, { signal: n });
+	}
+	disconnectedCallback() {
+		this.widget.detach(), this.controller.abort(), this.rafId &&= (cancelAnimationFrame(this.rafId), null), this.focusTrapTimeout &&= (clearTimeout(this.focusTrapTimeout), null), this.focusTrap.deactivate(), document.body.classList.remove(this.scrollLockClass);
+	}
+	handleBreakpoint = ({ matches: e }) => {
+		if (!this.trigger) return;
+		let { signal: t } = this.controller;
+		e ? (this.widget.attach(), this.target.setAttribute("inert", ""), this.trigger.addEventListener("disclosure-toggle", this.handleDisclosure, { signal: t })) : (this.widget.detach(), this.target.removeAttribute("inert"), document.body.classList.remove(this.scrollLockClass), this.trigger.removeEventListener("disclosure-toggle", this.handleDisclosure), this.focusTrap.deactivate());
+	};
+	handleDisclosure = async ({ detail: e }) => {
+		let { isOpen: t } = e, n = t ? "Open" : "Close", r = t ? "Close" : "Open";
+		if (this.trigger.textContent = this.triggerText.replace(n, r), t) try {
+			await this.focusTrap.activate();
+		} catch {}
+		else this.focusTrap.deactivate();
+		t && this.hideOther && this.otherTrigger && this.otherTrigger.getAttribute("aria-expanded") === "true" && this.otherTrigger.click(), this.trigger.classList.toggle(this.isSearch ? this.searchIconClass : this.menuIconClass), this.trigger.classList.toggle(this.closeIconClass), this.target.classList.toggle(this.backgroundClass), this.trigger.removeAttribute("no-focus"), this.isOpen = t;
+	};
+	handleKeyDown = (e) => {
+		this.isOpen && e.key === "Escape" && this.widget.handleToggle();
+	};
+	get trigger() {
+		let e = this.querySelector(":scope > button"), t = e.getAttribute("aria-controls");
+		if (!e || !t) throw Error(`${this.localName} must contain a <button aria-controls="element-to-trigger"> element.`);
+		return e.removeAttribute("disabled"), this.controls = t, this.triggerText = e.textContent, e;
+	}
+	get target() {
+		let e = document.querySelector(`div[id="${this.controls}"]`);
+		if (!e) throw Error(`${this.localName} must contain a target <div id="${this.controls}">.`);
+		return e.classList.remove("global-nav-up-only"), e;
+	}
+	get breakpoint() {
+		return window.matchMedia(this.mq);
+	}
+};
+customElements.get("mx-global-toggle") || customElements.define("mx-global-toggle", n);
+//#endregion
+export { n as t };

package/dist/build/chunks/InPageNavigation-D1Kk-rCm.js

@@ -0,0 +1,86 @@
+import { s as e, t } from "./utilities-Dd-08SW6.js";
+//#region src/Component/InPageNavigation/Elements/InPageNavigation.ts
+var n = class extends HTMLElement {
+	internals_;
+	controller;
+	headingLevels;
+	title;
+	titleClass = "is-excluded mx-heading--m";
+	items;
+	active;
+	constructor() {
+		super(), this.internals_ = this.attachInternals(), this.controller = new AbortController(), this.headingLevels = this.dataset?.levels || "h2", this.title = this.dataset?.title || "On this page", this.items = [];
+	}
+	connectedCallback() {
+		if (!this.menu || !this.headings) return;
+		if (this.links.length) this.links.forEach((e) => {
+			let t = this.container.querySelector(e.hash);
+			t && this.items.push({
+				link: e,
+				heading: t
+			});
+		});
+		else {
+			let e = t(`<h2 class="${this.titleClass}">${this.title}</h2>`);
+			this.nav.insertBefore(e, this.menu);
+			let n = {};
+			this.headings.forEach((e) => {
+				let t = this.generateListItem(e), r = this.generateAnchor(e, n);
+				this.items.push({
+					link: r,
+					heading: e
+				}), t.appendChild(r), this.menu?.appendChild(t);
+			});
+		}
+		let { signal: e } = this.controller;
+		this.menu.addEventListener("click", (e) => {
+			let { target: t } = e;
+			t instanceof HTMLAnchorElement && this.handleClick(t);
+		}, { signal: e });
+	}
+	disconnectedCallback() {
+		this.menu && this.headings && (this.menu.textContent = "", this.items = [], this.controller.abort());
+	}
+	handleClick = (e) => {
+		this.active = this.items.find((t) => t.link === e), this.links && this.active && (this.links.forEach((e) => e.classList.remove("is-active")), this.active.link.classList.add("is-active"));
+	};
+	get menu() {
+		let e = this.querySelector("ul, ol");
+		if (e) return e;
+		if (!this.nav) throw Error(`${this.localName} must contain a <nav> element.`);
+		if (this.items?.length === 0 && this.headings?.length === 0) return null;
+		let t = document.createElement("ul");
+		return this.nav.appendChild(t), t;
+	}
+	get nav() {
+		return this.querySelector("nav");
+	}
+	get container() {
+		let e = this.getAttribute("data-content");
+		if (!e) throw Error(`${this.localName} must have a [data-content] attribute that contains the content selector.`);
+		return this.closest(e) || this.parentElement.querySelector(e) || document.querySelector(e);
+	}
+	get headings() {
+		return this.container?.querySelectorAll(`:is(${this.headingLevels}):not(.is-excluded)`);
+	}
+	get links() {
+		return this.menu?.querySelectorAll("a");
+	}
+	generatedId(t, n) {
+		let r = t?.textContent?.trim();
+		if (!r) return "";
+		let i = e(r), a = n[i] ?? 0;
+		return n[i] = a + 1, a > 0 ? `${i}-${a}` : i;
+	}
+	generateAnchor(e, n) {
+		let { textContent: r, id: i } = e, a = e.getAttribute("data-in-page-navigation-title") || r, o = i || this.generatedId(e, n);
+		return i || (e.id = o), t(`<a href="#${o}"><span class="mx-icon mx-icon--chevron-right"></span><span>${a}</span></a>`);
+	}
+	generateListItem(e) {
+		let { tagName: n } = e;
+		return t(`<li class="mx-in-page-navigation__level--${n.toLowerCase()}"></li>`);
+	}
+};
+customElements.get("mx-in-page-navigation") || customElements.define("mx-in-page-navigation", n);
+//#endregion
+export { n as t };

package/dist/build/chunks/Navigation-CDQnN61h.js

@@ -0,0 +1,147 @@
+import { s as e, u as t } from "./utilities-Dd-08SW6.js";
+//#region src/Utility/Elements/keyboard.ts
+var n = class {
+	constructor() {
+		window.Mixtape = window.Mixtape || {}, window.Mixtape.Popups = window.Mixtape.Popups || [], window.Mixtape.Menu = window.Mixtape.Menu || {};
+	}
+	attachPopup = (e, t) => {
+		window.Mixtape.Popups.push({
+			id: e,
+			closefn: t
+		});
+	};
+	detachPopup = (e) => {
+		window.Mixtape.Popups = window.Mixtape.Popups.filter((t) => t.id !== e);
+	};
+	attachMenu = (e, t) => {
+		window.Mixtape.Menu = {
+			context: e,
+			items: t
+		};
+	};
+	detachMenu = () => {
+		window.Mixtape.Menu = null;
+	};
+	getNextFocusableMenuItem = (e, t = !1) => t ? e === 0 ? window.Mixtape.Menu.items.length - 1 : e - 1 : window.Mixtape.Menu.items.length > e + 1 ? e + 1 : 0;
+	moveFocus = (e, t = !1) => {
+		if (!window.Mixtape.Menu.items) return;
+		let n = 0;
+		window.Mixtape.Menu.items.forEach((t, r) => {
+			t === e && (n = r);
+		});
+		let r = this.getNextFocusableMenuItem(n, t), i = window.Mixtape.Menu.items[r].getAttribute("tabindex");
+		if (i !== "-1") window.Mixtape.Menu.items[r].focus();
+		else {
+			for (; i === "-1";) r = this.getNextFocusableMenuItem(r, t), i = window.Mixtape.Menu.items[r].getAttribute("tabindex");
+			window.Mixtape.Menu.items[r].focus();
+		}
+		window.Mixtape.Menu.active = r;
+	};
+	handleGlobalClick = ({ target: e }) => {
+		let t = window.Mixtape.Popups ? window.Mixtape.Popups[window.Mixtape.Popups.length - 1] : null;
+		if (t && t.id) {
+			let n = document.querySelector(`#${t.id}`).parentElement;
+			if (n && (e === n || n?.contains(e))) return;
+			t.closefn();
+		}
+	};
+	handleGlobalKeydown = (e) => {
+		let t = window.Mixtape.Popups ? window.Mixtape.Popups[window.Mixtape.Popups.length - 1] : null, n = e.target;
+		switch (e.key) {
+			case "Escape":
+				t && t.closefn();
+				break;
+			case "ArrowDown":
+			case "ArrowRight":
+				window.Mixtape.Menu?.items && (e.preventDefault(), this.moveFocus(n));
+				break;
+			case "ArrowUp":
+			case "ArrowLeft": window.Mixtape.Menu?.items && (e.preventDefault(), this.moveFocus(n, !0));
+		}
+	};
+	attachEventListeners = (e) => {
+		window.addEventListener("click", this.handleGlobalClick, { signal: e }), window.addEventListener("keydown", this.handleGlobalKeydown, { signal: e });
+	};
+}, r = class extends HTMLElement {
+	internals_;
+	controller;
+	keyboard;
+	subNavs;
+	flyout;
+	edgeCheck;
+	mq;
+	iO;
+	constructor() {
+		super(), this.internals_ = this.attachInternals(), this.controller = new AbortController(), this.flyout = this.hasAttribute("flyout");
+	}
+	connectedCallback() {
+		let { signal: r } = this.controller;
+		this.keyboard = new n(), this.keyboard.attachEventListeners(r), this.addEventListener("focusin", () => {
+			this.keyboard.attachMenu(this, this.links);
+		}), this.addEventListener("focusout", () => {
+			this.keyboard.detachMenu();
+		}), this.lists.length && (this.subNavs = /* @__PURE__ */ new Map(), this.lists.forEach((n, r) => {
+			let i = n.closest("li"), a = i.querySelector(":scope > a"), o = e(`subnav-${r}-${a.textContent}`, 30), s = i.querySelector(":scope > button.mx-nav__toggle");
+			if (i && a && s) {
+				let e = `list-label-${o}`;
+				a.setAttribute("id", e), n.setAttribute("id", o), n.setAttribute("aria-labelledby", e);
+				let r = new t(s, n);
+				r.init(), this.subNavs.set(o, {
+					item: i,
+					trigger: s,
+					list: n,
+					link: a,
+					widget: r
+				});
+			}
+		}), this.addEventListener("disclosure-toggle", this.handleDisclosure), this.flyout && (this.edgeCheck = this.hasAttribute("edgeCheck"), this.mq = this.getAttribute("mq") || "(min-width: 720px)", this.handleBreakpoint(this.breakpoint), this.breakpoint.addEventListener("change", this.handleBreakpoint, { signal: r })));
+	}
+	disconnectedCallback() {
+		this.controller.abort(), this.subNavs?.forEach((e) => e.widget.detach()), this.iO?.disconnect();
+	}
+	handleDisclosure = ({ detail: e }) => {
+		let { isOpen: t, id: n } = e, { item: r } = this.subNavs.get(n);
+		r.classList.toggle("mx-nav--open"), t ? this.keyboard.attachPopup(n, this.handleCloseAny) : this.keyboard.detachPopup(n);
+	};
+	handleCloseAny = () => {
+		this.subNavs?.forEach(({ widget: e }) => {
+			e && e.isOpen && e.handleToggle();
+		});
+	};
+	handleFlyout = (e) => {
+		let t = e.target.closest("li");
+		if (!t) return;
+		let n = t.querySelector(":scope > ul");
+		n && this.subNavs?.forEach(({ widget: e, list: t }) => {
+			e && (e.isOpen && e.handleToggle(), t.id === n.id && e.handleToggle());
+		});
+	};
+	handleBreakpoint = ({ matches: e }) => {
+		let { signal: t } = this.controller;
+		e ? (this.addEventListener("mouseover", this.handleFlyout, { signal: t }), this.addEventListener("mouseleave", this.handleCloseAny, { signal: t }), this.edgeCheck && this.handleEdgeCheck()) : (this.removeEventListener("mouseover", this.handleFlyout), this.removeEventListener("mouseleave", this.handleCloseAny));
+	};
+	handleEdgeCheck() {
+		let e = window.innerWidth;
+		this.iO = new IntersectionObserver((t, n) => {
+			t.forEach(({ boundingClientRect: t, target: r }) => {
+				e < t.right && r.classList.add("mx-nav--reverse"), n.unobserve(r);
+			});
+		}), this.subNavs?.forEach(({ list: e }) => {
+			this.iO.observe(e), e.querySelectorAll("ul")?.forEach((e) => this.iO.observe(e));
+		});
+	}
+	get links() {
+		let e = this.querySelectorAll("a");
+		if (!e.length) throw Error(`${this.localName} must links`);
+		return e;
+	}
+	get lists() {
+		return this.querySelectorAll("li > ul");
+	}
+	get breakpoint() {
+		return window.matchMedia(this.mq);
+	}
+};
+customElements.get("mx-nav") || customElements.define("mx-nav", r);
+//#endregion
+export { n, r as t };

package/dist/build/chunks/Popover-CiTAftNU.js

@@ -0,0 +1,30 @@
+//#region src/Component/Popover/Elements/Popover.ts
+var e = class extends HTMLElement {
+	internals_;
+	polyfills;
+	constructor() {
+		super(), this.internals_ = this.attachInternals();
+	}
+	async connectedCallback() {
+		if (this.container && this.trigger && (!("anchorName" in document.documentElement.style) || !("popover" in HTMLElement.prototype))) {
+			let { default: e } = await import("./polyfills-D-qh1a_2.js");
+			this.polyfills = new e(this.container);
+		}
+	}
+	disconnectedCallback() {
+		this.polyfills?.destroy();
+	}
+	get container() {
+		let e = this.querySelector("[popover]");
+		if (!e) throw Error(`${this.localName} must contain a <div popover> element.`);
+		return e;
+	}
+	get trigger() {
+		let e = this.querySelector(`[popovertarget=${this.container?.id}]`);
+		if (!e) throw Error(`${this.localName} must contain a <button popovertarget="${this.container.id}">`);
+		return e;
+	}
+};
+customElements.get("mx-popover") || customElements.define("mx-popover", e);
+//#endregion
+export { e as t };

package/dist/build/chunks/Sticky-DoVndENm.js

@@ -0,0 +1,51 @@
+import { t as e } from "./utilities-Dd-08SW6.js";
+//#region src/Component/Sticky/Elements/Sticky.ts
+var t = class extends HTMLElement {
+	internals_;
+	iO;
+	rO;
+	offsetPropName;
+	root = null;
+	rootMargin = "0px 0px 0px 0px";
+	thresholds = [0];
+	constructor() {
+		super(), this.internals_ = this.attachInternals();
+	}
+	connectedCallback() {
+		this.offsetPropName = this.getAttribute("offsetpropname") || "--sticky-offset";
+		let e = {
+			root: this.root,
+			rootMargin: this.rootMargin,
+			thresholds: this.thresholds
+		};
+		this.iO = new IntersectionObserver(([{ boundingClientRect: t }]) => {
+			let n = t.y < 0;
+			this.classList.toggle("is-stuck", n);
+			let r = new CustomEvent("sticky-toggle", {
+				bubbles: !0,
+				cancelable: !0,
+				detail: {
+					isSticky: n,
+					options: e,
+					target: this
+				}
+			});
+			this.dispatchEvent(r);
+		}, e), this.iO.observe(this.trigger), this.offsetPropName && (this.rO = new ResizeObserver((e) => {
+			e.forEach(({ borderBoxSize: e }) => {
+				let [{ blockSize: t }] = e;
+				document.body.style.setProperty(this.offsetPropName, `${t.toFixed(1)}px`);
+			});
+		}), this.rO.observe(this));
+	}
+	disconnectedCallback() {
+		this.iO.disconnect(), this.rO?.disconnect();
+	}
+	get trigger() {
+		let t = this.querySelector(".mx-sticky__trigger");
+		return t || (t = e("<div class=\"mx-sticky__trigger\"></div>"), this.insertAdjacentElement("beforebegin", t)), t;
+	}
+};
+customElements.get("mx-sticky") || customElements.define("mx-sticky", t);
+//#endregion
+export { t };