UNPKG

@flexilla/alpine-navbar

Version:
98 lines (91 loc) 3.33 kB
var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // builds/module.js var module_exports = {}; __export(module_exports, { default: () => module_default }); module.exports = __toCommonJS(module_exports); // ../../node_modules/@flexilla/utilities/dist/selector.js var e = (t, o = document.body) => o.querySelector(t); var y = (t) => typeof t == "string" ? e(t) : t; // ../../node_modules/@flexilla/utilities/dist/dom-utilities.js var l = (t, e2) => { for (const [n2, o] of Object.entries(e2)) t.setAttribute(n2, o); }; // ../../node_modules/@flexilla/utilities/dist/toggler.js var f = (r) => { const { trigger: l2, targets: n2, onToggle: o } = r, e2 = l2 ? y(l2) : null; let t = true; const a = (i2) => { for (const c of n2) { const v2 = y(c.element); l(v2, c.attributes[i2]); } t = i2 === "initial", e2 && (e2.ariaExpanded = t ? "false" : "true"), o == null || o({ isExpanded: !t }); }; a("initial"); const s2 = () => a(t ? "to" : "initial"); return e2 == null || e2.addEventListener("click", s2), { toInitial: () => a("initial"), toAction: () => a("to"), toggle: () => a(t ? "to" : "initial"), get state() { return t ? "initial" : "to"; }, destroy: () => { e2 == null || e2.removeEventListener("click", s2); } }; }; var m = ({ navbarElement: r, onToggle: l2 }) => { const n2 = typeof r == "string" ? e(r) : r; if (!(n2 instanceof HTMLElement)) return; const o = n2.getAttribute("id"), e2 = e(`[data-nav-trigger][data-toggle-nav=${o}]`), t = e(`[data-nav-overlay][data-navbar-id=${o}]`); let a = [{ element: n2, attributes: { initial: { "data-state": "close" }, to: { "data-state": "open" } } }]; t && (a = [...a, { element: t, attributes: { initial: { "data-state": "close" }, to: { "data-state": "open" } } }]); const s2 = f({ trigger: e2, targets: a, onToggle: l2 }), i2 = () => { s2.toInitial(); }; return n2.addEventListener("click", i2), t instanceof HTMLElement && !t.hasAttribute("data-static-overlay") && t.addEventListener("click", i2), { cleanup: () => { n2.removeEventListener("click", i2), s2.destroy(), t instanceof HTMLElement && !t.hasAttribute("data-static-overlay") && t.removeEventListener("click", i2); }, close: i2, toggle: s2.toggle }; }; // src/index.js function Navbar(Alpine) { Alpine.directive("navbar", (el, {}, { cleanup }) => { const nav = m({ navbarElement: el }); cleanup(() => { nav.cleanup(); }); }); } var src_default = Navbar; // builds/module.js var module_default = src_default;