UNPKG

@puzzleitc/puzzle-shell

Version:

The standard design for Puzzle tools

1,338 lines (1,309 loc) 69.4 kB
/** * @license * Copyright 2019 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ const q = globalThis, ce = q.ShadowRoot && (q.ShadyCSS === void 0 || q.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, de = Symbol(), be = /* @__PURE__ */ new WeakMap(); let Me = class { constructor(e, t, o) { if (this._$cssResult$ = !0, o !== de) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead."); this.cssText = e, this.t = t; } get styleSheet() { let e = this.o; const t = this.t; if (ce && e === void 0) { const o = t !== void 0 && t.length === 1; o && (e = be.get(t)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), o && be.set(t, e)); } return e; } toString() { return this.cssText; } }; const Ve = (r) => new Me(typeof r == "string" ? r : r + "", void 0, de), u = (r, ...e) => { const t = r.length === 1 ? r[0] : e.reduce((o, s, n) => o + ((a) => { if (a._$cssResult$ === !0) return a.cssText; if (typeof a == "number") return a; throw Error("Value passed to 'css' function must be a 'css' function result: " + a + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security."); })(s) + r[n + 1], r[0]); return new Me(t, r, de); }, We = (r, e) => { if (ce) r.adoptedStyleSheets = e.map((t) => t instanceof CSSStyleSheet ? t : t.styleSheet); else for (const t of e) { const o = document.createElement("style"), s = q.litNonce; s !== void 0 && o.setAttribute("nonce", s), o.textContent = t.cssText, r.appendChild(o); } }, ze = ce ? (r) => r : (r) => r instanceof CSSStyleSheet ? ((e) => { let t = ""; for (const o of e.cssRules) t += o.cssText; return Ve(t); })(r) : r; /** * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ const { is: Ke, defineProperty: Fe, getOwnPropertyDescriptor: Je, getOwnPropertyNames: Ze, getOwnPropertySymbols: Ye, getPrototypeOf: Ge } = Object, w = globalThis, ye = w.trustedTypes, Qe = ye ? ye.emptyScript : "", ee = w.reactiveElementPolyfillSupport, N = (r, e) => r, V = { toAttribute(r, e) { switch (e) { case Boolean: r = r ? Qe : null; break; case Object: case Array: r = r == null ? r : JSON.stringify(r); } return r; }, fromAttribute(r, e) { let t = r; switch (e) { case Boolean: t = r !== null; break; case Number: t = r === null ? null : Number(r); break; case Object: case Array: try { t = JSON.parse(r); } catch { t = null; } } return t; } }, ue = (r, e) => !Ke(r, e), $e = { attribute: !0, type: String, converter: V, reflect: !1, useDefault: !1, hasChanged: ue }; Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), w.litPropertyMetadata ?? (w.litPropertyMetadata = /* @__PURE__ */ new WeakMap()); let S = class extends HTMLElement { static addInitializer(e) { this._$Ei(), (this.l ?? (this.l = [])).push(e); } static get observedAttributes() { return this.finalize(), this._$Eh && [...this._$Eh.keys()]; } static createProperty(e, t = $e) { if (t.state && (t.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(e) && ((t = Object.create(t)).wrapped = !0), this.elementProperties.set(e, t), !t.noAccessor) { const o = Symbol(), s = this.getPropertyDescriptor(e, o, t); s !== void 0 && Fe(this.prototype, e, s); } } static getPropertyDescriptor(e, t, o) { const { get: s, set: n } = Je(this.prototype, e) ?? { get() { return this[t]; }, set(a) { this[t] = a; } }; return { get: s, set(a) { const l = s == null ? void 0 : s.call(this); n == null || n.call(this, a), this.requestUpdate(e, l, o); }, configurable: !0, enumerable: !0 }; } static getPropertyOptions(e) { return this.elementProperties.get(e) ?? $e; } static _$Ei() { if (this.hasOwnProperty(N("elementProperties"))) return; const e = Ge(this); e.finalize(), e.l !== void 0 && (this.l = [...e.l]), this.elementProperties = new Map(e.elementProperties); } static finalize() { if (this.hasOwnProperty(N("finalized"))) return; if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(N("properties"))) { const t = this.properties, o = [...Ze(t), ...Ye(t)]; for (const s of o) this.createProperty(s, t[s]); } const e = this[Symbol.metadata]; if (e !== null) { const t = litPropertyMetadata.get(e); if (t !== void 0) for (const [o, s] of t) this.elementProperties.set(o, s); } this._$Eh = /* @__PURE__ */ new Map(); for (const [t, o] of this.elementProperties) { const s = this._$Eu(t, o); s !== void 0 && this._$Eh.set(s, t); } this.elementStyles = this.finalizeStyles(this.styles); } static finalizeStyles(e) { const t = []; if (Array.isArray(e)) { const o = new Set(e.flat(1 / 0).reverse()); for (const s of o) t.unshift(ze(s)); } else e !== void 0 && t.push(ze(e)); return t; } static _$Eu(e, t) { const o = t.attribute; return o === !1 ? void 0 : typeof o == "string" ? o : typeof e == "string" ? e.toLowerCase() : void 0; } constructor() { super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev(); } _$Ev() { var e; this._$ES = new Promise((t) => this.enableUpdating = t), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), (e = this.constructor.l) == null || e.forEach((t) => t(this)); } addController(e) { var t; (this._$EO ?? (this._$EO = /* @__PURE__ */ new Set())).add(e), this.renderRoot !== void 0 && this.isConnected && ((t = e.hostConnected) == null || t.call(e)); } removeController(e) { var t; (t = this._$EO) == null || t.delete(e); } _$E_() { const e = /* @__PURE__ */ new Map(), t = this.constructor.elementProperties; for (const o of t.keys()) this.hasOwnProperty(o) && (e.set(o, this[o]), delete this[o]); e.size > 0 && (this._$Ep = e); } createRenderRoot() { const e = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions); return We(e, this.constructor.elementStyles), e; } connectedCallback() { var e; this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this.enableUpdating(!0), (e = this._$EO) == null || e.forEach((t) => { var o; return (o = t.hostConnected) == null ? void 0 : o.call(t); }); } enableUpdating(e) { } disconnectedCallback() { var e; (e = this._$EO) == null || e.forEach((t) => { var o; return (o = t.hostDisconnected) == null ? void 0 : o.call(t); }); } attributeChangedCallback(e, t, o) { this._$AK(e, o); } _$ET(e, t) { var n; const o = this.constructor.elementProperties.get(e), s = this.constructor._$Eu(e, o); if (s !== void 0 && o.reflect === !0) { const a = (((n = o.converter) == null ? void 0 : n.toAttribute) !== void 0 ? o.converter : V).toAttribute(t, o.type); this._$Em = e, a == null ? this.removeAttribute(s) : this.setAttribute(s, a), this._$Em = null; } } _$AK(e, t) { var n, a; const o = this.constructor, s = o._$Eh.get(e); if (s !== void 0 && this._$Em !== s) { const l = o.getPropertyOptions(s), i = typeof l.converter == "function" ? { fromAttribute: l.converter } : ((n = l.converter) == null ? void 0 : n.fromAttribute) !== void 0 ? l.converter : V; this._$Em = s, this[s] = i.fromAttribute(t, l.type) ?? ((a = this._$Ej) == null ? void 0 : a.get(s)) ?? null, this._$Em = null; } } requestUpdate(e, t, o) { var s; if (e !== void 0) { const n = this.constructor, a = this[e]; if (o ?? (o = n.getPropertyOptions(e)), !((o.hasChanged ?? ue)(a, t) || o.useDefault && o.reflect && a === ((s = this._$Ej) == null ? void 0 : s.get(e)) && !this.hasAttribute(n._$Eu(e, o)))) return; this.C(e, t, o); } this.isUpdatePending === !1 && (this._$ES = this._$EP()); } C(e, t, { useDefault: o, reflect: s, wrapped: n }, a) { o && !(this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Map())).has(e) && (this._$Ej.set(e, a ?? t ?? this[e]), n !== !0 || a !== void 0) || (this._$AL.has(e) || (this.hasUpdated || o || (t = void 0), this._$AL.set(e, t)), s === !0 && this._$Em !== e && (this._$Eq ?? (this._$Eq = /* @__PURE__ */ new Set())).add(e)); } async _$EP() { this.isUpdatePending = !0; try { await this._$ES; } catch (t) { Promise.reject(t); } const e = this.scheduleUpdate(); return e != null && await e, !this.isUpdatePending; } scheduleUpdate() { return this.performUpdate(); } performUpdate() { var o; if (!this.isUpdatePending) return; if (!this.hasUpdated) { if (this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this._$Ep) { for (const [n, a] of this._$Ep) this[n] = a; this._$Ep = void 0; } const s = this.constructor.elementProperties; if (s.size > 0) for (const [n, a] of s) { const { wrapped: l } = a, i = this[n]; l !== !0 || this._$AL.has(n) || i === void 0 || this.C(n, void 0, a, i); } } let e = !1; const t = this._$AL; try { e = this.shouldUpdate(t), e ? (this.willUpdate(t), (o = this._$EO) == null || o.forEach((s) => { var n; return (n = s.hostUpdate) == null ? void 0 : n.call(s); }), this.update(t)) : this._$EM(); } catch (s) { throw e = !1, this._$EM(), s; } e && this._$AE(t); } willUpdate(e) { } _$AE(e) { var t; (t = this._$EO) == null || t.forEach((o) => { var s; return (s = o.hostUpdated) == null ? void 0 : s.call(o); }), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(e)), this.updated(e); } _$EM() { this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1; } get updateComplete() { return this.getUpdateComplete(); } getUpdateComplete() { return this._$ES; } shouldUpdate(e) { return !0; } update(e) { this._$Eq && (this._$Eq = this._$Eq.forEach((t) => this._$ET(t, this[t]))), this._$EM(); } updated(e) { } firstUpdated(e) { } }; S.elementStyles = [], S.shadowRootOptions = { mode: "open" }, S[N("elementProperties")] = /* @__PURE__ */ new Map(), S[N("finalized")] = /* @__PURE__ */ new Map(), ee == null || ee({ ReactiveElement: S }), (w.reactiveElementVersions ?? (w.reactiveElementVersions = [])).push("2.1.0"); /** * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ const D = globalThis, W = D.trustedTypes, we = W ? W.createPolicy("lit-html", { createHTML: (r) => r }) : void 0, Oe = "$lit$", $ = `lit$${Math.random().toFixed(9).slice(2)}$`, Pe = "?" + $, Xe = `<${Pe}>`, C = document, L = () => C.createComment(""), U = (r) => r === null || typeof r != "object" && typeof r != "function", ve = Array.isArray, et = (r) => ve(r) || typeof (r == null ? void 0 : r[Symbol.iterator]) == "function", te = `[ \f\r]`, k = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, _e = /-->/g, xe = />/g, _ = RegExp(`>|${te}(?:([^\\s"'>=/]+)(${te}*=${te}*(?:[^ \f\r"'\`<>=]|("|')|))|$)`, "g"), Ae = /'/g, Ce = /"/g, ke = /^(?:script|style|textarea|title)$/i, tt = (r) => (e, ...t) => ({ _$litType$: r, strings: e, values: t }), h = tt(1), E = Symbol.for("lit-noChange"), g = Symbol.for("lit-nothing"), Ee = /* @__PURE__ */ new WeakMap(), x = C.createTreeWalker(C, 129); function Ne(r, e) { if (!ve(r) || !r.hasOwnProperty("raw")) throw Error("invalid template strings array"); return we !== void 0 ? we.createHTML(e) : e; } const st = (r, e) => { const t = r.length - 1, o = []; let s, n = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", a = k; for (let l = 0; l < t; l++) { const i = r[l]; let v, m, c = -1, b = 0; for (; b < i.length && (a.lastIndex = b, m = a.exec(i), m !== null); ) b = a.lastIndex, a === k ? m[1] === "!--" ? a = _e : m[1] !== void 0 ? a = xe : m[2] !== void 0 ? (ke.test(m[2]) && (s = RegExp("</" + m[2], "g")), a = _) : m[3] !== void 0 && (a = _) : a === _ ? m[0] === ">" ? (a = s ?? k, c = -1) : m[1] === void 0 ? c = -2 : (c = a.lastIndex - m[2].length, v = m[1], a = m[3] === void 0 ? _ : m[3] === '"' ? Ce : Ae) : a === Ce || a === Ae ? a = _ : a === _e || a === xe ? a = k : (a = _, s = void 0); const y = a === _ && r[l + 1].startsWith("/>") ? " " : ""; n += a === k ? i + Xe : c >= 0 ? (o.push(v), i.slice(0, c) + Oe + i.slice(c) + $ + y) : i + $ + (c === -2 ? l : y); } return [Ne(r, n + (r[t] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), o]; }; class j { constructor({ strings: e, _$litType$: t }, o) { let s; this.parts = []; let n = 0, a = 0; const l = e.length - 1, i = this.parts, [v, m] = st(e, t); if (this.el = j.createElement(v, o), x.currentNode = this.el.content, t === 2 || t === 3) { const c = this.el.content.firstChild; c.replaceWith(...c.childNodes); } for (; (s = x.nextNode()) !== null && i.length < l; ) { if (s.nodeType === 1) { if (s.hasAttributes()) for (const c of s.getAttributeNames()) if (c.endsWith(Oe)) { const b = m[a++], y = s.getAttribute(c).split($), I = /([.?@])?(.*)/.exec(b); i.push({ type: 1, index: n, name: I[2], strings: y, ctor: I[1] === "." ? ot : I[1] === "?" ? nt : I[1] === "@" ? at : G }), s.removeAttribute(c); } else c.startsWith($) && (i.push({ type: 6, index: n }), s.removeAttribute(c)); if (ke.test(s.tagName)) { const c = s.textContent.split($), b = c.length - 1; if (b > 0) { s.textContent = W ? W.emptyScript : ""; for (let y = 0; y < b; y++) s.append(c[y], L()), x.nextNode(), i.push({ type: 2, index: ++n }); s.append(c[b], L()); } } } else if (s.nodeType === 8) if (s.data === Pe) i.push({ type: 2, index: n }); else { let c = -1; for (; (c = s.data.indexOf($, c + 1)) !== -1; ) i.push({ type: 7, index: n }), c += $.length - 1; } n++; } } static createElement(e, t) { const o = C.createElement("template"); return o.innerHTML = e, o; } } function M(r, e, t = r, o) { var a, l; if (e === E) return e; let s = o !== void 0 ? (a = t._$Co) == null ? void 0 : a[o] : t._$Cl; const n = U(e) ? void 0 : e._$litDirective$; return (s == null ? void 0 : s.constructor) !== n && ((l = s == null ? void 0 : s._$AO) == null || l.call(s, !1), n === void 0 ? s = void 0 : (s = new n(r), s._$AT(r, t, o)), o !== void 0 ? (t._$Co ?? (t._$Co = []))[o] = s : t._$Cl = s), s !== void 0 && (e = M(r, s._$AS(r, e.values), s, o)), e; } class rt { constructor(e, t) { this._$AV = [], this._$AN = void 0, this._$AD = e, this._$AM = t; } get parentNode() { return this._$AM.parentNode; } get _$AU() { return this._$AM._$AU; } u(e) { const { el: { content: t }, parts: o } = this._$AD, s = ((e == null ? void 0 : e.creationScope) ?? C).importNode(t, !0); x.currentNode = s; let n = x.nextNode(), a = 0, l = 0, i = o[0]; for (; i !== void 0; ) { if (a === i.index) { let v; i.type === 2 ? v = new B(n, n.nextSibling, this, e) : i.type === 1 ? v = new i.ctor(n, i.name, i.strings, this, e) : i.type === 6 && (v = new it(n, this, e)), this._$AV.push(v), i = o[++l]; } a !== (i == null ? void 0 : i.index) && (n = x.nextNode(), a++); } return x.currentNode = C, s; } p(e) { let t = 0; for (const o of this._$AV) o !== void 0 && (o.strings !== void 0 ? (o._$AI(e, o, t), t += o.strings.length - 2) : o._$AI(e[t])), t++; } } class B { get _$AU() { var e; return ((e = this._$AM) == null ? void 0 : e._$AU) ?? this._$Cv; } constructor(e, t, o, s) { this.type = 2, this._$AH = g, this._$AN = void 0, this._$AA = e, this._$AB = t, this._$AM = o, this.options = s, this._$Cv = (s == null ? void 0 : s.isConnected) ?? !0; } get parentNode() { let e = this._$AA.parentNode; const t = this._$AM; return t !== void 0 && (e == null ? void 0 : e.nodeType) === 11 && (e = t.parentNode), e; } get startNode() { return this._$AA; } get endNode() { return this._$AB; } _$AI(e, t = this) { e = M(this, e, t), U(e) ? e === g || e == null || e === "" ? (this._$AH !== g && this._$AR(), this._$AH = g) : e !== this._$AH && e !== E && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : et(e) ? this.k(e) : this._(e); } O(e) { return this._$AA.parentNode.insertBefore(e, this._$AB); } T(e) { this._$AH !== e && (this._$AR(), this._$AH = this.O(e)); } _(e) { this._$AH !== g && U(this._$AH) ? this._$AA.nextSibling.data = e : this.T(C.createTextNode(e)), this._$AH = e; } $(e) { var n; const { values: t, _$litType$: o } = e, s = typeof o == "number" ? this._$AC(e) : (o.el === void 0 && (o.el = j.createElement(Ne(o.h, o.h[0]), this.options)), o); if (((n = this._$AH) == null ? void 0 : n._$AD) === s) this._$AH.p(t); else { const a = new rt(s, this), l = a.u(this.options); a.p(t), this.T(l), this._$AH = a; } } _$AC(e) { let t = Ee.get(e.strings); return t === void 0 && Ee.set(e.strings, t = new j(e)), t; } k(e) { ve(this._$AH) || (this._$AH = [], this._$AR()); const t = this._$AH; let o, s = 0; for (const n of e) s === t.length ? t.push(o = new B(this.O(L()), this.O(L()), this, this.options)) : o = t[s], o._$AI(n), s++; s < t.length && (this._$AR(o && o._$AB.nextSibling, s), t.length = s); } _$AR(e = this._$AA.nextSibling, t) { var o; for ((o = this._$AP) == null ? void 0 : o.call(this, !1, !0, t); e && e !== this._$AB; ) { const s = e.nextSibling; e.remove(), e = s; } } setConnected(e) { var t; this._$AM === void 0 && (this._$Cv = e, (t = this._$AP) == null || t.call(this, e)); } } class G { get tagName() { return this.element.tagName; } get _$AU() { return this._$AM._$AU; } constructor(e, t, o, s, n) { this.type = 1, this._$AH = g, this._$AN = void 0, this.element = e, this.name = t, this._$AM = s, this.options = n, o.length > 2 || o[0] !== "" || o[1] !== "" ? (this._$AH = Array(o.length - 1).fill(new String()), this.strings = o) : this._$AH = g; } _$AI(e, t = this, o, s) { const n = this.strings; let a = !1; if (n === void 0) e = M(this, e, t, 0), a = !U(e) || e !== this._$AH && e !== E, a && (this._$AH = e); else { const l = e; let i, v; for (e = n[0], i = 0; i < n.length - 1; i++) v = M(this, l[o + i], t, i), v === E && (v = this._$AH[i]), a || (a = !U(v) || v !== this._$AH[i]), v === g ? e = g : e !== g && (e += (v ?? "") + n[i + 1]), this._$AH[i] = v; } a && !s && this.j(e); } j(e) { e === g ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, e ?? ""); } } class ot extends G { constructor() { super(...arguments), this.type = 3; } j(e) { this.element[this.name] = e === g ? void 0 : e; } } class nt extends G { constructor() { super(...arguments), this.type = 4; } j(e) { this.element.toggleAttribute(this.name, !!e && e !== g); } } class at extends G { constructor(e, t, o, s, n) { super(e, t, o, s, n), this.type = 5; } _$AI(e, t = this) { if ((e = M(this, e, t, 0) ?? g) === E) return; const o = this._$AH, s = e === g && o !== g || e.capture !== o.capture || e.once !== o.once || e.passive !== o.passive, n = e !== g && (o === g || s); s && this.element.removeEventListener(this.name, this, o), n && this.element.addEventListener(this.name, this, e), this._$AH = e; } handleEvent(e) { var t; typeof this._$AH == "function" ? this._$AH.call(((t = this.options) == null ? void 0 : t.host) ?? this.element, e) : this._$AH.handleEvent(e); } } class it { constructor(e, t, o) { this.element = e, this.type = 6, this._$AN = void 0, this._$AM = t, this.options = o; } get _$AU() { return this._$AM._$AU; } _$AI(e) { M(this, e); } } const se = D.litHtmlPolyfillSupport; se == null || se(j, B), (D.litHtmlVersions ?? (D.litHtmlVersions = [])).push("3.3.0"); const lt = (r, e, t) => { const o = (t == null ? void 0 : t.renderBefore) ?? e; let s = o._$litPart$; if (s === void 0) { const n = (t == null ? void 0 : t.renderBefore) ?? null; o._$litPart$ = s = new B(e.insertBefore(L(), n), n, void 0, t ?? {}); } return s._$AI(r), s; }; /** * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ const A = globalThis; let d = class extends S { constructor() { super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0; } createRenderRoot() { var t; const e = super.createRenderRoot(); return (t = this.renderOptions).renderBefore ?? (t.renderBefore = e.firstChild), e; } update(e) { const t = this.render(); this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(e), this._$Do = lt(t, this.renderRoot, this.renderOptions); } connectedCallback() { var e; super.connectedCallback(), (e = this._$Do) == null || e.setConnected(!0); } disconnectedCallback() { var e; super.disconnectedCallback(), (e = this._$Do) == null || e.setConnected(!1); } render() { return E; } }; var Se; d._$litElement$ = !0, d.finalized = !0, (Se = A.litElementHydrateSupport) == null || Se.call(A, { LitElement: d }); const re = A.litElementPolyfillSupport; re == null || re({ LitElement: d }); (A.litElementVersions ?? (A.litElementVersions = [])).push("4.2.0"); function De() { return typeof window < "u"; } const ht = 800; function Le() { return De() && "pzshBreakpoint" in window && typeof window.pzshBreakpoint == "number" && window.pzshBreakpoint || ht; } const Ue = u` /* Base colors */ --pzsh-color-white: #ffffff; --pzsh-color-gray-1: #fafafa; --pzsh-color-gray-2: #f2f2f2; --pzsh-color-gray-3: #d8d8d8; --pzsh-color-gray-4: #62676b; --pzsh-color-black: #000000; /* Puzzle brand colors */ --pzsh-color-brand-1: #1e5a96; --pzsh-color-brand-2: #3b7bbe; --pzsh-color-brand-3: #238bca; --pzsh-color-brand-4: #3fa8e0; --pzsh-color-brand-5: #46bcc0; --pzsh-color-brand-6: #2c97a6; --pzsh-color-brand-7: #69b978; --pzsh-color-brand-8: #61b44b; --pzsh-color-brand-alt-1: #dcedf9; --pzsh-color-brand-alt-2: #1b2d53; --pzsh-color-brand-alt-3: #3fa8e0; /* Logo color */ --pzsh-color-brand-alt-4: #69b978; /* Logo color */ --pzsh-green: var(--pzsh-color-brand-7); --pzsh-blue: var(--pzsh-color-brand-alt-3); /* Component colors */ --pzsh-topbar-bg: var(--pzsh-color-brand-alt-2); --pzsh-topbar-bg-alt: var(--pzsh-color-brand-2); --pzsh-topbar-fg: var(--pzsh-color-white); --pzsh-menu-bg: var(--pzsh-color-white); --pzsh-menu-bg-alt: var(--pzsh-color-gray-2); --pzsh-menu-fg: var(--pzsh-color-gray-4); --pzsh-menu-active: var(--pzsh-color-brand-8); --pzsh-menu-divider: var(--pzsh-color-gray-4); --pzsh-menu-dropdown-item-bg: var(--pzsh-color-white); --pzsh-menu-dropdown-item-bg-alt: var(--pzsh-color-gray-2); --pzsh-menu-dropdown-item-fg: var(--pzsh-color-gray-4); --pzsh-banner-bg: var(--pzsh-color-brand-alt-1); --pzsh-nav-fg: var(--pzsh-color-brand-1); --pzsh-nav-active: var(--pzsh-color-brand-8); --pzsh-subnav-bg: var(--pzsh-color-white); --pzsh-subnav-border: var(--pzsh-color-gray-3); --pzsh-subnav-fg: var(--pzsh-color-gray-4); --pzsh-subnav-active: var(--pzsh-color-gray-3); --pzsh-hero-bg-start: var(--pzsh-banner-bg); --pzsh-hero-bg-end: var(--pzsh-color-white); --pzsh-footer-bg: var(--pzsh-color-gray-2); --pzsh-footer-border: var(--pzsh-color-gray-3); /* Fonts */ --pzsh-font-size-base: 16px; --pzsh-font-family: "Roboto", sans-serif; --pzsh-monospace-font-family: "Roboto Mono", monospace; /* Spacings */ --pzsh-spacer: 8px; --pzsh-page-padding-horizontal-mobile: calc(2 * var(--pzsh-spacer)); --pzsh-page-padding-horizontal-desktop: calc(6 * var(--pzsh-spacer)); --pzsh-menu-item-gap: var(--pzsh-spacer); --pzsh-menu-item-padding-horizontal: calc(3 * var(--pzsh-spacer)); --pzsh-menu-item-padding-vertical: calc(2 * var(--pzsh-spacer)); --pzsh-nav-item-padding-horizontal-desktop: calc(2 * var(--pzsh-spacer)); /* Sizes */ --pzsh-breakpoint: ${Le()}px; --pzsh-logo-height: 32px; --pzsh-icon-size: 24px; --pzsh-topbar-height: calc(2 * var(--pzsh-spacer) + var(--pzsh-logo-height)); --pzsh-nav-line-height: 18px; --pzsh-nav-height: calc( 2 * var(--pzsh-nav-item-padding-horizontal-desktop) + var(--pzsh-nav-line-height) ); --pzsh-banner-content-height: calc(15 * var(--pzsh-spacer)); --pzsh-hero-height: calc(20 * var(--pzsh-spacer)); /* Layering */ --pzsh-menu-z-index: 1000; --pzsh-menu-backdrop-z-index: 999; --pzsh-menu-dropdown-z-index: 1000; `, p = Object.assign( u` :host { ${Ue} } /* Reset */ :host, :host * { box-sizing: border-box; font-family: var(--pzsh-font-family); font-size: var(--pzsh-font-size-base); } img, svg { display: block; } `, { get breakpoint() { return Le(); } } ); function pt(r) { var t; if (!De()) return; const e = document.createElement("style"); e.innerText = r.toString(), (t = document.querySelector("body")) == null || t.appendChild(e); } pt(u` :root { ${Ue} } `); /** * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ const f = (r) => (e, t) => { t !== void 0 ? t.addInitializer(() => { customElements.define(r, e); }) : customElements.define(r, e); }; var ct = Object.getOwnPropertyDescriptor, dt = (r, e, t, o) => { for (var s = o > 1 ? void 0 : o ? ct(e, t) : e, n = r.length - 1, a; n >= 0; n--) (a = r[n]) && (s = a(s) || s); return s; }; let oe = class extends d { render() { return h``; } }; oe.styles = [ p, u` :host { position: absolute; top: var(--pzsh-topbar-height); bottom: 0; left: 0; right: 0; background-color: rgba(135, 139, 142, 0.4); backdrop-filter: blur(4px); z-index: var(--pzsh-menu-backdrop-z-index); } ` ]; oe = dt([ f("pzsh-backdrop") ], oe); /** * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ const ut = { attribute: !0, type: String, converter: V, reflect: !1, hasChanged: ue }, vt = (r = ut, e, t) => { const { kind: o, metadata: s } = t; let n = globalThis.litPropertyMetadata.get(s); if (n === void 0 && globalThis.litPropertyMetadata.set(s, n = /* @__PURE__ */ new Map()), o === "setter" && ((r = Object.create(r)).wrapped = !0), n.set(t.name, r), o === "accessor") { const { name: a } = t; return { set(l) { const i = e.get.call(this); e.set.call(this, l), this.requestUpdate(a, i, r); }, init(l) { return l !== void 0 && this.C(a, void 0, r, l), l; } }; } if (o === "setter") { const { name: a } = t; return function(l) { const i = this[a]; e.call(this, l), this.requestUpdate(a, i, r); }; } throw Error("Unsupported decorator location: " + o); }; function z(r) { return (e, t) => typeof t == "object" ? vt(r, e, t) : ((o, s, n) => { const a = s.hasOwnProperty(n); return s.constructor.createProperty(n, o), a ? Object.getOwnPropertyDescriptor(s, n) : void 0; })(r, e, t); } /** * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ function P(r) { return z({ ...r, state: !0, attribute: !1 }); } /** * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ const gt = { ATTRIBUTE: 1 }, mt = (r) => (...e) => ({ _$litDirective$: r, values: e }); class ft { constructor(e) { } get _$AU() { return this._$AM._$AU; } _$AT(e, t, o) { this._$Ct = e, this._$AM = t, this._$Ci = o; } _$AS(e, t) { return this.update(e, t); } update(e, t) { return this.render(...t); } } /** * @license * Copyright 2018 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ const Q = mt(class extends ft { constructor(r) { var e; if (super(r), r.type !== gt.ATTRIBUTE || r.name !== "class" || ((e = r.strings) == null ? void 0 : e.length) > 2) throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute."); } render(r) { return " " + Object.keys(r).filter((e) => r[e]).join(" ") + " "; } update(r, [e]) { var o, s; if (this.st === void 0) { this.st = /* @__PURE__ */ new Set(), r.strings !== void 0 && (this.nt = new Set(r.strings.join(" ").split(/\s/).filter((n) => n !== ""))); for (const n in e) e[n] && !((o = this.nt) != null && o.has(n)) && this.st.add(n); return this.render(e); } const t = r.element.classList; for (const n of this.st) n in e || (t.remove(n), this.st.delete(n)); for (const n in e) { const a = !!e[n]; a === this.st.has(n) || (s = this.nt) != null && s.has(n) || (a ? (t.add(n), this.st.add(n)) : (t.remove(n), this.st.delete(n))); } return E; } }); var bt = Object.defineProperty, zt = Object.getOwnPropertyDescriptor, ge = (r, e, t, o) => { for (var s = o > 1 ? void 0 : o ? zt(e, t) : e, n = r.length - 1, a; n >= 0; n--) (a = r[n]) && (s = (o ? a(e, t, s) : a(s)) || s); return o && s && bt(e, t, s), s; }; let H = class extends d { constructor() { super(), this.hasNav = !1, this.hasSubnav = !1, this.handleMenuNavChange = this.handleMenuNavChange.bind(this); } connectedCallback() { super.connectedCallback(), document.addEventListener( "pzsh-menu-nav-change", this.handleMenuNavChange, !0 ); } disconnectedCallback() { super.disconnectedCallback(), document.removeEventListener( "pzsh-menu-nav-change", this.handleMenuNavChange, !0 ); } handleMenuNavChange(r) { if (r.stopPropagation(), r instanceof CustomEvent) { const { hasNav: e, hasSubnav: t } = r.detail; this.hasNav = e, this.hasSubnav = t; } } render() { return h` <slot name="tangram"></slot> <div class=${Q({ content: !0, "has-nav": this.hasNav, "has-subnav": this.hasSubnav })} > <slot name="content"></slot> </div> `; } }; H.styles = [ p, u` :host { display: flex; flex-direction: column; background-color: var(--pzsh-banner-bg); } ::slotted([slot="tangram"]) { display: none; } .content { flex: auto; display: flex; align-items: center; justify-content: center; position: relative; /* Move in front of tangram */ } ::slotted([slot="content"]) { flex: auto; margin: var(--pzsh-spacer) calc(2 * var(--pzsh-spacer)); } @media (min-width: ${p.breakpoint}px) { :host { position: relative; } ::slotted([slot="tangram"]) { display: block; position: absolute; top: 0; right: 0; } ::slotted([slot="content"]) { margin: calc(6 * var(--pzsh-spacer)) var(--pzsh-spacer); } .content.has-nav { margin-top: var(--pzsh-nav-height); } .content.has-subnav { margin-top: calc(2 * var(--pzsh-nav-height)); } } ` ]; ge([ P() ], H.prototype, "hasNav", 2); ge([ P() ], H.prototype, "hasSubnav", 2); H = ge([ f("pzsh-banner") ], H); var yt = Object.getOwnPropertyDescriptor, $t = (r, e, t, o) => { for (var s = o > 1 ? void 0 : o ? yt(e, t) : e, n = r.length - 1, a; n >= 0; n--) (a = r[n]) && (s = a(s) || s); return s; }; let ne = class extends d { render() { return h` <slot></slot> `; } }; ne.styles = [ p, u` :host { display: flex; flex-direction: column; min-height: 100vh; } ::slotted(*) { /* Let the content eat the rest */ flex: auto; } ::slotted(pzsh-topbar), ::slotted(pzsh-banner), ::slotted(pzsh-hero), ::slotted(pzsh-menu), ::slotted(pzsh-footer) { flex: none; } ` ]; ne = $t([ f("pzsh-container") ], ne); var wt = Object.getOwnPropertyDescriptor, _t = (r, e, t, o) => { for (var s = o > 1 ? void 0 : o ? wt(e, t) : e, n = r.length - 1, a; n >= 0; n--) (a = r[n]) && (s = a(s) || s); return s; }; let ae = class extends d { render() { return h` <div class="named-slots"> <slot name="start"></slot> <slot name="center"></slot> <slot name="end"></slot> </div> <slot></slot> `; } }; ae.styles = [ p, u` :host { padding: calc(var(--pzsh-spacer)) calc(6 * var(--pzsh-spacer)); background-color: var(--pzsh-footer-bg); display: flex; flex-direction: column; align-items: start; border-top: 2px solid var(--pzsh-footer-border); } .named-slots { width: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: start; } ::slotted(*) { color: var(--pzsh-color-gray-4); font-family: Roboto, sans-serif; gap: calc(2 * var(--pzsh-spacer)); padding-top: var(--pzsh-spacer); padding-bottom: var(--pzsh-spacer); display: flex; flex-direction: column; flex: 1; } ::slotted([slot="start"]) { align-items: start; justify-content: flex-start; } ::slotted([slot="center"]) { align-items: center; justify-content: center; } ::slotted([slot="end"]) { align-items: end; justify-content: flex-end; } @media (max-width: ${p.breakpoint}px) { :host { padding: calc(var(--pzsh-spacer)) calc(3 * var(--pzsh-spacer)); } .named-slots { flex-direction: column; row-gap: calc(3 * var(--pzsh-spacer)); } ::slotted([slot="start"]), ::slotted([slot="center"]), ::slotted([slot="end"]) { align-items: start; } } ` ]; ae = _t([ f("pzsh-footer") ], ae); var xt = Object.defineProperty, At = Object.getOwnPropertyDescriptor, je = (r, e, t, o) => { for (var s = o > 1 ? void 0 : o ? At(e, t) : e, n = r.length - 1, a; n >= 0; n--) (a = r[n]) && (s = (o ? a(e, t, s) : a(s)) || s); return o && s && xt(e, t, s), s; }; let K = class extends d { constructor() { super(...arguments), this.href = "#"; } render() { return h`<a href="${this.href}"> <slot></slot> </a>`; } }; K.styles = [ p, u` a { display: flex; align-items: center; font-family: var(--pzsh-font-family); color: var(--pzsh-color-brand-1); text-decoration: none; } a:hover, a:active { text-decoration: underline; } ::slotted(pzsh-icon), ::slotted(svg) { margin-right: calc(var(--pzsh-spacer) / 2); } @media (max-width: ${p.breakpoint}px) { a { margin-left: 0; color: var(--pzsh-color-brand-1); } a:hover, a:active { background-color: var(--pzsh-topbar-menu-bg-alt); text-decoration: none; } } ` ]; je([ z({ type: String }) ], K.prototype, "href", 2); K = je([ f("pzsh-footer-link") ], K); var Ct = Object.getOwnPropertyDescriptor, Et = (r, e, t, o) => { for (var s = o > 1 ? void 0 : o ? Ct(e, t) : e, n = r.length - 1, a; n >= 0; n--) (a = r[n]) && (s = a(s) || s); return s; }; let ie = class extends d { render() { return h` <div class="text"> <slot name="title"></slot> <slot name="slogan"></slot> </div> <div class="logo"> <slot name="logo"></slot> </div> `; } }; ie.styles = [ p, u` :host { height: var(--pzsh-hero-height); padding: 0 var(--pzsh-page-padding-horizontal-mobile); display: flex; align-items: center; justify-content: center; gap: var(--pzsh-spacer); background: var(--pzsh-hero-bg-start); background: linear-gradient( 180deg, var(--pzsh-hero-bg-start) 0%, var(--pzsh-hero-bg-end) 100% ); } .text { max-width: 350px; /* Move a bit above mathematical center */ margin-bottom: calc(2 * var(--pzsh-spacer)); } .logo { max-height: var(--pzsh-hero-height); } /** * When styling the slotted elements in the light DOM, make sure to * enforce these styles with !important to override any potential * light DOM styles. */ ::slotted([slot="title"]), ::slotted([slot="slogan"]) { font-family: var(--pzsh-font-family) !important; font-weight: normal !important; line-height: 1 !important; } ::slotted([slot="title"]) { margin: 0 !important; font-size: 32px !important; color: var(--pzsh-color-brand-alt-2) !important; } ::slotted([slot="slogan"]) { margin-top: var(--pzsh-spacer) !important; margin-bottom: 0 !important; font-size: 18px !important; color: var(--pzsh-color-brand-alt-3) !important; } @media (min-width: 390px) { :host { gap: calc(3 * var(--pzsh-spacer)); } .text { /* Move a bit above mathematical center */ margin-bottom: calc(6 * var(--pzsh-spacer)); } } @media (min-width: ${p.breakpoint}px) { :host { gap: calc(5 * var(--pzsh-spacer)); } } ` ]; ie = Et([ f("pzsh-hero") ], ie); var St = Object.defineProperty, Mt = Object.getOwnPropertyDescriptor, He = (r, e, t, o) => { for (var s = o > 1 ? void 0 : o ? Mt(e, t) : e, n = r.length - 1, a; n >= 0; n--) (a = r[n]) && (s = (o ? a(e, t, s) : a(s)) || s); return o && s && St(e, t, s), s; }; const Ot = { // prettier-ignore "angle-down": h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M17 9.17a1 1 0 00-1.41 0L12 12.71 8.46 9.17a1 1 0 00-1.41 0 1 1 0 000 1.42l4.24 4.24a1 1 0 001.42 0L17 10.59a1 1 0 000-1.42z"/></svg> `, // prettier-ignore "angle-up": h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M17 13.41l-4.29-4.24a1 1 0 00-1.42 0l-4.24 4.24a1 1 0 000 1.42 1 1 0 001.41 0L12 11.29l3.54 3.54a1 1 0 00.7.29 1 1 0 00.71-.29 1 1 0 00.05-1.42z"/></svg>`, // prettier-ignore bars: h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M3 8h18a1 1 0 000-2H3a1 1 0 000 2zm18 8H3a1 1 0 000 2h18a1 1 0 000-2zm0-5H3a1 1 0 000 2h18a1 1 0 000-2z"/></svg>`, // prettier-ignore github: h`<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2.247a10 10 0 00-3.162 19.487c.5.088.687-.212.687-.475 0-.237-.012-1.025-.012-1.862-2.513.462-3.163-.613-3.363-1.175a3.636 3.636 0 00-1.025-1.413c-.35-.187-.85-.65-.013-.662a2.001 2.001 0 011.538 1.025 2.137 2.137 0 002.912.825 2.104 2.104 0 01.638-1.338c-2.225-.25-4.55-1.112-4.55-4.937a3.892 3.892 0 011.025-2.688 3.594 3.594 0 01.1-2.65s.837-.262 2.75 1.025a9.427 9.427 0 015 0c1.912-1.3 2.75-1.025 2.75-1.025a3.593 3.593 0 01.1 2.65 3.869 3.869 0 011.025 2.688c0 3.837-2.338 4.687-4.563 4.937a2.368 2.368 0 01.675 1.85c0 1.338-.012 2.413-.012 2.75 0 .263.187.575.687.475A10.005 10.005 0 0012 2.247z"/></svg>`, // prettier-ignore gitlab: h`<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path fill="currentColor" d="M21.94 12.865l-1.066-3.28.001.005v-.005l-2.115-6.51a.833.833 0 00-.799-.57.822.822 0 00-.788.576l-2.007 6.178H8.834L6.824 3.08a.822.822 0 00-.788-.575H6.03a.839.839 0 00-.796.575L3.127 9.584l-.002.006.001-.005-1.069 3.28a1.195 1.195 0 00.435 1.34l9.229 6.705.004.003.012.008-.011-.008.002.001.001.001a.466.466 0 00.045.028l.006.004.004.002.003.001h.002l.005.003.025.01.023.01h.001l.004.002.005.002h.002l.006.002h.003c.011.004.022.006.034.009l.013.003h.002l.005.002.007.001h.007a.467.467 0 00.066.006h.001a.469.469 0 00.067-.005h.007l.007-.002.004-.001h.002l.014-.004.034-.008h.002l.006-.003h.002l.005-.002.004-.001h.001l.025-.011.023-.01.005-.002h.002l.003-.002.004-.002.007-.004a.468.468 0 00.044-.027l.004-.003.005-.003 9.23-6.706a1.195 1.195 0 00.434-1.339zm-3.973-9.18l1.81 5.574h-3.62zm-11.937 0L7.843 9.26h-3.62zm-2.984 9.757a.255.255 0 01-.092-.285l.794-2.438 5.822 7.464zm1.494-3.24h3.61l2.573 7.927zm7.165 10.696l-.006-.005-.011-.01-.02-.018.002.001.002.002a.473.473 0 00.043.037l.002.002zm.293-1.894l-1.514-4.665-1.344-4.138h5.72zm.31 1.88l-.01.008-.002.001-.005.005-.012.009.002-.002a.455.455 0 00.043-.036l.001-.002.002-.002zM15.851 10.2h3.61l-.74.947-5.447 6.98zm5.1 3.241l-6.523 4.74 5.824-7.463.791 2.437a.255.255 0 01-.092.286z"/></svg>`, // prettier-ignore multiply: h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M13.41 12l6.3-6.29a1 1 0 10-1.42-1.42L12 10.59l-6.29-6.3a1 1 0 00-1.42 1.42l6.3 6.29-6.3 6.29a1 1 0 000 1.42 1 1 0 001.42 0l6.29-6.3 6.29 6.3a1 1 0 001.42 0 1 1 0 000-1.42z"/></svg>`, // prettier-ignore "plus-circle": h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 18a8 8 0 118-8 8 8 0 01-8 8zm4-9h-3V8a1 1 0 00-2 0v3H8a1 1 0 000 2h3v3a1 1 0 002 0v-3h3a1 1 0 000-2z"/></svg>`, // prettier-ignore "question-circle": h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M11.29 15.29a1.58 1.58 0 00-.12.15.76.76 0 00-.09.18.64.64 0 00-.06.18 1.36 1.36 0 000 .2.84.84 0 00.08.38.9.9 0 00.54.54.94.94 0 00.76 0 .9.9 0 00.54-.54A1 1 0 0013 16a1 1 0 00-.29-.71 1 1 0 00-1.42 0zM12 2a10 10 0 1010 10A10 10 0 0012 2zm0 18a8 8 0 118-8 8 8 0 01-8 8zm0-13a3 3 0 00-2.6 1.5 1 1 0 101.73 1A1 1 0 0112 9a1 1 0 010 2 1 1 0 00-1 1v1a1 1 0 002 0v-.18A3 3 0 0012 7z"/></svg>`, // prettier-ignore search: h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M21.71 20.29L18 16.61A9 9 0 1016.61 18l3.68 3.68a1 1 0 001.42 0 1 1 0 000-1.39zM11 18a7 7 0 117-7 7 7 0 01-7 7z"/></svg>`, // prettier-ignore setting: h`<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path fill="currentColor" d="M19.9 12.66a1 1 0 010-1.32l1.28-1.44a1 1 0 00.12-1.17l-2-3.46a1 1 0 00-1.07-.48l-1.88.38a1 1 0 01-1.15-.66l-.61-1.83a1 1 0 00-.95-.68h-4a1 1 0 00-1 .68l-.56 1.83a1 1 0 01-1.15.66L5 4.79a1 1 0 00-1 .48L2 8.73a1 1 0 00.1 1.17l1.27 1.44a1 1 0 010 1.32L2.1 14.1a1 1 0 00-.1 1.17l2 3.46a1 1 0 001.07.48l1.88-.38a1 1 0 011.15.66l.61 1.83a1 1 0 001 .68h4a1 1 0 00.95-.68l.61-1.83a1 1 0 011.15-.66l1.88.38a1 1 0 001.07-.48l2-3.46a1 1 0 00-.12-1.17zM18.41 14l.8.9-1.28 2.22-1.18-.24a3 3 0 00-3.45 2L12.92 20h-2.56L10 18.86a3 3 0 00-3.45-2l-1.18.24-1.3-2.21.8-.9a3 3 0 000-4l-.8-.9 1.28-2.2 1.18.24a3 3 0 003.45-2L10.36 4h2.56l.38 1.14a3 3 0 003.45 2l1.18-.24 1.28 2.22-.8.9a3 3 0 000 3.98zm-6.77-6a4 4 0 104 4 4 4 0 00-4-4zm0 6a2 2 0 112-2 2 2 0 01-2 2z"/></svg>`, // prettier-ignore "sign-out-alt": h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M12.59 13l-2.3 2.29a1 1 0 000 1.42 1 1 0 001.42 0l4-4a1 1 0 00.21-.33 1 1 0 000-.76 1 1 0 00-.21-.33l-4-4a1 1 0 10-1.42 1.42l2.3 2.29H3a1 1 0 000 2zM12 2a10 10 0 00-9 5.55 1 1 0 001.8.9A8 8 0 1112 20a7.93 7.93 0 01-7.16-4.45 1 1 0 00-1.8.9A10 10 0 1012 2z"/></svg>`, // prettier-ignore "sliders-v-alt": h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M20 8.18V3a1 1 0 00-2 0v5.18a3 3 0 000 5.64V21a1 1 0 002 0v-7.18a3 3 0 000-5.64zM19 12a1 1 0 111-1 1 1 0 01-1 1zm-6 2.18V3a1 1 0 00-2 0v11.18a3 3 0 000 5.64V21a1 1 0 002 0v-1.18a3 3 0 000-5.64zM12 18a1 1 0 111-1 1 1 0 01-1 1zM6 6.18V3a1 1 0 00-2 0v3.18a3 3 0 000 5.64V21a1 1 0 002 0v-9.18a3 3 0 000-5.64zM5 10a1 1 0 111-1 1 1 0 01-1 1z"/></svg>`, // prettier-ignore user: h`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M15.71 12.71a6 6 0 10-7.42 0 10 10 0 00-6.22 8.18 1 1 0 002 .22 8 8 0 0115.9 0 1 1 0 001 .89h.11a1 1 0 00.88-1.1 10 10 0 00-6.25-8.19zM12 12a4 4 0 114-4 4 4 0 01-4 4z"/></svg>` }; let F = class extends d { constructor() { super(...arguments), this.name = ""; } render() { return h`${Ot[this.name]}`; } }; F.styles = [ p, u` :host { display: inline-block; } svg { width: 24px; height: 24px; } ` ]; He([ z({ type: String }) ], F.prototype, "name", 2); F = He([ f("pzsh-icon") ], F); function Te(r, e) { return r && r instanceof HTMLElement && (r.nodeName.toLowerCase() === e || r.closest(e) != null); } function Pt(r) { r.getBoundingClientRect().bottom > window.innerHeight && r.scrollIntoView(!1), r.getBoundingClientRect().top < 0 && r.scrollIntoView(); } function Re(r, e) { if (e instanceof KeyboardEvent && e.type === "keydown" && (e.key === "ArrowUp" || e.key === "ArrowDown")) { const t = r(); let o = t.findIndex((n) => n === document.activeElement); e.key === "ArrowUp" ? o -= 1 : e.key === "ArrowDown" && (o += 1); const s = t[o]; s && (s.focus(), Pt(s), e.preventDefault()); } } var kt = Object.defineProperty, Nt = Object.getOwnPropertyDescriptor, me = (r, e, t, o) => { for (var s = o > 1 ? void 0 : o ? Nt(e, t) : e, n = r.length - 1, a; n >= 0; n--) (a = r[n]) && (s = (o ? a(e, t, s) : a(s)) || s); return o && s && kt(e, t, s), s; }; let T = class extends d { constructor() { super(), this.open = !1, this.scrollContainerSelector = "body", this.available = !1, this.hasNav = !1, this.hasSubnav = !1, this.toggleMenu = this.toggleMenu.bind(this), this.handleEvent = this.handleEvent.bind(this), this.actionsObserver = new MutationObserver( (r) => r.forEach(this.handleActionsChange.bind(this)) ); } connectedCallback() { super.connectedCallback(), document.addEventListener("pzsh-menu-toggle", this.toggleMenu, !0), document.addEventListener("click", this.handleEvent), document.addEventListener("keydown", this.handleEvent); } disconnectedCallback() { super.disconnectedCallback(), document.removeEventListener("pzsh-menu-toggle", this.toggleMenu, !0), document.removeEventListener("click", this.handleEvent), document.removeEventListener("keydown", this.handleEvent); } toggleMenu(r) { r == null || r.stopPropagation(), this.open = !this.open, this.toggleBackdrop(), this.triggerMenuChange(this.available, this.open); } toggleBackdrop() { var t; const r = document.querySelector("pzsh-backdrop"); r && r.remove(), this.open && ((t = document.querySelector("body")) == null || t.appendChild(document.createElement("pzsh-backdrop"))); const e = document.querySelector( this.scrollContainerSelector ); e && (e.style.overflowY = this.open ? "hidden" : "auto"); } handleEvent(r) { this.handleMenuClose(r), this.handleMenuNavigation(r); } handleMenuClose(r) { this.open && (r.type === "click" && !Te(r.target, "pzsh-topbar") || r.type === "keydown" && r instanceof KeyboardEvent && (r.key === "Escape" || r.key === "Tab")) && this.toggleMenu(r); } handleMenuNavigation(r) { this.open && Re(this.getMenuItems.bind(this), r); } /** * Flatten all menu actions & dropdown items to an array */ getMenuItems() { var t; const r = Array.from( this.querySelectorAll("[slot='nav'] pzsh-nav-item") ), e = Array.from( ((t = this.querySelector("[slot='actions']")) == null ? void 0 : t.children) || [] ); return [...r, ...e].reduce((o, s) => { var n; return s.nodeName.toLowerCase() === "pzsh-menu-dropdown" ? [ ...o, ...Array.from( ((n = s.querySelector('[slot="items"]')) == null ? void 0 : n.children) || [] ) ].filter((a) => a.nodeName.toLowerCase() !== "pzsh-menu-divider") : (o.push(s), o); }, []); } handleSlotChange(r) { const e = r.target; this.updateMenuAvailablity(), e.getAttribute("name") === "nav" && this.updateNavAvailability(), e.getAttribute("name") === "actions" && e.assignedNodes().forEach( (t) => this.actionsObserver.observe(t, { childList: !0 }) ); } handleActionsChange() { this.updateMenuAvailablity(); } updateMenuAvailablity() { const r = this.hasMenuItems(); r !== this.available && this.triggerMenuChange(r, this.open), this.available = r; } hasMenuItems() { var o, s, n, a, l; const r = (o = this.shadowRoot) == null ? void 0 : o.querySelector( 'slot[name="nav"]' ), e = (s = this.shadowRoot) == null ? void 0 : s.querySelector( 'slot[name="actions"]' ), t = (n = this.shadowRoot) == null ? void 0 : n.querySelector( 'slot[name="items"]' ); return r.assignedNodes().length > 0 || ((l = (a = e.assignedNodes()[0] || void 0) == null ? void 0 : a.children) == null ? void 0 : l.length) > 0 || t.assignedNodes().length > 0; } /** * Emit an event for the pzsh-topbar component to show/hide the * hamburger menu button or update its open/closed state. */ triggerMenuChange(r, e) { this.dispatchEvent( new CustomEvent("pzsh-menu-change", { detail: { available: r, open: e } }) ); } updateNavAvailability() { var o, s; const r = (o = this.shadowRoot) == null ? void 0 : o.querySelector( 'slot[name="nav"]' ), e = r.assignedNodes().length > 0, t = ((s = r.assignedNodes()[0]) == n