243 lines
7.6 KiB
JavaScript
243 lines
7.6 KiB
JavaScript
import { css as u, LitElement as g, html as d } from "lit";
|
|
import { property as o, customElement as m } from "lit/decorators.js";
|
|
import { createRef as p, ref as f } from "lit/directives/ref.js";
|
|
var S = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, i = (e, t, s, n) => {
|
|
for (var a = n > 1 ? void 0 : n ? _(t, s) : t, c = e.length - 1, h; c >= 0; c--)
|
|
(h = e[c]) && (a = (n ? h(t, s, a) : h(a)) || a);
|
|
return n && a && S(t, s, a), a;
|
|
};
|
|
function E(e) {
|
|
return customElements.get(e) ? (t) => t : m(e);
|
|
}
|
|
let r = class extends g {
|
|
constructor() {
|
|
super(), this.GISCUS_SESSION_KEY = "giscus-session", this.GISCUS_DEFAULT_HOST = "https://giscus.app", this.ERROR_SUGGESTION = "Please consider reporting this error at https://github.com/giscus/giscus/issues/new.", this.__session = "", this._iframeRef = p(), this.messageEventHandler = this.handleMessageEvent.bind(this), this.hasLoaded = !1, this.host = this.GISCUS_DEFAULT_HOST, this.strict = "0", this.reactionsEnabled = "1", this.emitMetadata = "0", this.inputPosition = "bottom", this.theme = "light", this.lang = "en", this.loading = "eager", this.setupSession(), window.addEventListener("message", this.messageEventHandler);
|
|
}
|
|
get iframeRef() {
|
|
var e;
|
|
return (e = this._iframeRef) == null ? void 0 : e.value;
|
|
}
|
|
get _host() {
|
|
try {
|
|
return new URL(this.host), this.host;
|
|
} catch {
|
|
return this.GISCUS_DEFAULT_HOST;
|
|
}
|
|
}
|
|
disconnectedCallback() {
|
|
super.disconnectedCallback(), window.removeEventListener("message", this.messageEventHandler);
|
|
}
|
|
_formatError(e) {
|
|
return `[giscus] An error occurred. Error message: "${e}".`;
|
|
}
|
|
setupSession() {
|
|
const e = location.href, t = new URL(e), s = localStorage.getItem(this.GISCUS_SESSION_KEY), n = t.searchParams.get("giscus") ?? "";
|
|
if (this.__session = "", n) {
|
|
localStorage.setItem(this.GISCUS_SESSION_KEY, JSON.stringify(n)), this.__session = n, t.searchParams.delete("giscus"), t.hash = "", history.replaceState(void 0, document.title, t.toString());
|
|
return;
|
|
}
|
|
if (s)
|
|
try {
|
|
this.__session = JSON.parse(s);
|
|
} catch (a) {
|
|
localStorage.removeItem(this.GISCUS_SESSION_KEY), console.warn(
|
|
`${this._formatError(
|
|
a == null ? void 0 : a.message
|
|
)} Session has been cleared.`
|
|
);
|
|
}
|
|
}
|
|
signOut() {
|
|
localStorage.removeItem(this.GISCUS_SESSION_KEY), this.__session = "", this.update(/* @__PURE__ */ new Map());
|
|
}
|
|
handleMessageEvent(e) {
|
|
if (e.origin !== this._host) return;
|
|
const { data: t } = e;
|
|
if (!(typeof t == "object" && t.giscus)) return;
|
|
if (this.iframeRef && t.giscus.resizeHeight && (this.iframeRef.style.height = `${t.giscus.resizeHeight}px`), t.giscus.signOut) {
|
|
console.info("[giscus] User has logged out. Session has been cleared."), this.signOut();
|
|
return;
|
|
}
|
|
if (!t.giscus.error) return;
|
|
const s = t.giscus.error;
|
|
if (s.includes("Bad credentials") || s.includes("Invalid state value") || s.includes("State has expired")) {
|
|
if (localStorage.getItem(this.GISCUS_SESSION_KEY) !== null) {
|
|
console.warn(`${this._formatError(s)} Session has been cleared.`), this.signOut();
|
|
return;
|
|
}
|
|
console.error(
|
|
`${this._formatError(s)} No session is stored initially. ${this.ERROR_SUGGESTION}`
|
|
);
|
|
}
|
|
if (s.includes("Discussion not found")) {
|
|
console.warn(
|
|
`[giscus] ${s}. A new discussion will be created if a comment/reaction is submitted.`
|
|
);
|
|
return;
|
|
}
|
|
console.error(`${this._formatError(s)} ${this.ERROR_SUGGESTION}`);
|
|
}
|
|
sendMessage(e) {
|
|
var t;
|
|
!((t = this.iframeRef) != null && t.contentWindow) || !this.hasLoaded || this.iframeRef.contentWindow.postMessage({ giscus: e }, this._host);
|
|
}
|
|
updateConfig() {
|
|
const e = {
|
|
setConfig: {
|
|
repo: this.repo,
|
|
repoId: this.repoId,
|
|
category: this.category,
|
|
categoryId: this.categoryId,
|
|
term: this.getTerm(),
|
|
number: +this.getNumber(),
|
|
strict: this.strict === "1",
|
|
reactionsEnabled: this.reactionsEnabled === "1",
|
|
emitMetadata: this.emitMetadata === "1",
|
|
inputPosition: this.inputPosition,
|
|
theme: this.theme,
|
|
lang: this.lang
|
|
}
|
|
};
|
|
this.sendMessage(e);
|
|
}
|
|
firstUpdated() {
|
|
var e;
|
|
(e = this.iframeRef) == null || e.addEventListener("load", () => {
|
|
var t;
|
|
(t = this.iframeRef) == null || t.classList.remove("loading"), this.hasLoaded = !0, this.updateConfig();
|
|
});
|
|
}
|
|
requestUpdate(e, t, s) {
|
|
if (!this.hasUpdated || e === "host") {
|
|
super.requestUpdate(e, t, s);
|
|
return;
|
|
}
|
|
this.updateConfig();
|
|
}
|
|
getMetaContent(e, t = !1) {
|
|
const s = t ? `meta[property='og:${e}'],` : "", n = document.querySelector(
|
|
s + `meta[name='${e}']`
|
|
);
|
|
return n ? n.content : "";
|
|
}
|
|
_getCleanedUrl() {
|
|
const e = new URL(location.href);
|
|
return e.searchParams.delete("giscus"), e.hash = "", e;
|
|
}
|
|
getTerm() {
|
|
switch (this.mapping) {
|
|
case "url":
|
|
return this._getCleanedUrl().toString();
|
|
case "title":
|
|
return document.title;
|
|
case "og:title":
|
|
return this.getMetaContent("title", !0);
|
|
case "specific":
|
|
return this.term ?? "";
|
|
case "number":
|
|
return "";
|
|
case "pathname":
|
|
default:
|
|
return location.pathname.length < 2 ? "index" : location.pathname.substring(1).replace(/\.\w+$/, "");
|
|
}
|
|
}
|
|
getNumber() {
|
|
return this.mapping === "number" ? this.term ?? "" : "";
|
|
}
|
|
getIframeSrc() {
|
|
const e = this._getCleanedUrl().toString(), t = `${e}${this.id ? "#" + this.id : ""}`, s = this.getMetaContent("description", !0), n = this.getMetaContent("giscus:backlink") || e, a = {
|
|
origin: t,
|
|
session: this.__session,
|
|
repo: this.repo,
|
|
repoId: this.repoId ?? "",
|
|
category: this.category ?? "",
|
|
categoryId: this.categoryId ?? "",
|
|
term: this.getTerm(),
|
|
number: this.getNumber(),
|
|
strict: this.strict,
|
|
reactionsEnabled: this.reactionsEnabled,
|
|
emitMetadata: this.emitMetadata,
|
|
inputPosition: this.inputPosition,
|
|
theme: this.theme,
|
|
description: s,
|
|
backLink: n
|
|
}, c = this._host, h = this.lang ? `/${this.lang}` : "", l = new URLSearchParams(a);
|
|
return `${c}${h}/widget?${l.toString()}`;
|
|
}
|
|
render() {
|
|
return d`
|
|
<iframe
|
|
title="Comments"
|
|
scrolling="no"
|
|
class="loading"
|
|
${f(this._iframeRef)}
|
|
src=${this.getIframeSrc()}
|
|
loading=${this.loading}
|
|
allow="clipboard-write"
|
|
part="iframe"
|
|
></iframe>
|
|
`;
|
|
}
|
|
};
|
|
r.styles = u`
|
|
:host,
|
|
iframe {
|
|
width: 100%;
|
|
border: none;
|
|
min-height: 150px;
|
|
color-scheme: light dark;
|
|
}
|
|
|
|
iframe.loading {
|
|
opacity: 0;
|
|
}
|
|
`;
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "host", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "repo", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "repoId", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "category", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "categoryId", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "mapping", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "term", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "strict", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "reactionsEnabled", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "emitMetadata", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "inputPosition", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "theme", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "lang", 2);
|
|
i([
|
|
o({ reflect: !0 })
|
|
], r.prototype, "loading", 2);
|
|
r = i([
|
|
E("giscus-widget")
|
|
], r);
|
|
export {
|
|
r as GiscusWidget
|
|
};
|