@diplodoc/transform
Version:
A simple transformer of text in YFM (Yandex Flavored Markdown) to HTML
809 lines (793 loc) • 34.4 kB
JavaScript
;
(() => {
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(b)) {
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
var __commonJS = (cb, mod) => function __require() {
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
};
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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
// node_modules/get-root-node-polyfill/index.js
var require_get_root_node_polyfill = __commonJS({
"node_modules/get-root-node-polyfill/index.js"(exports, module) {
"use strict";
function getRootNode2(opt) {
var composed = typeof opt === "object" && Boolean(opt.composed);
return composed ? getShadowIncludingRoot(this) : getRoot(this);
}
function getShadowIncludingRoot(node) {
var root = getRoot(node);
if (isShadowRoot(root)) {
return getShadowIncludingRoot(root.host);
}
return root;
}
function getRoot(node) {
if (node.parentNode != null) {
return getRoot(node.parentNode);
}
return node;
}
function isShadowRoot(node) {
return node.nodeName === "#document-fragment" && node.constructor.name === "ShadowRoot";
}
if (typeof module === "object" && module.exports) {
module.exports = getRootNode2;
}
}
});
// node_modules/@diplodoc/cut-extension/build/runtime/index.js
(() => {
var i = "yfm_cut", I = { CUT: ".yfm .yfm-cut", TITLE: ".yfm .yfm-cut-title", CONTENT: ".yfm .yfm-cut-content" }, n = { OPEN: "open" };
var o = (g) => {
let t = g.composedPath();
return Array.isArray(t) && t.length > 0 ? t[0] : g.target;
}, l = (g) => {
let t = o(g);
return !t || !t.matches;
};
var c = class {
constructor(t) {
__publicField(this, "__doc");
__publicField(this, "_onDocClick", (t) => {
if (l(t)) return;
let e = this._findTitleInPath(t);
e && this._toggleCut(e);
});
__publicField(this, "_matchTitle", (t) => {
var _a;
return t instanceof HTMLElement ? (_a = t == null ? void 0 : t.matches) == null ? void 0 : _a.call(t, I.TITLE) : false;
});
this.__doc = t, this.__doc.addEventListener("click", this._onDocClick);
}
destroy() {
this.__doc.removeEventListener("click", this._onDocClick);
}
focusActiveCut() {
let t = window.location.hash.slice(1), e = document.getElementById(t);
e instanceof HTMLElement && e.matches(I.CUT) && (e.classList.toggle(n.OPEN), e.setAttribute("open", "true"), setTimeout(() => {
e.classList.add("cut-highlight"), e.scrollIntoView();
}, 70), setTimeout(() => {
e.classList.remove("cut-highlight");
}, 1e3));
}
_findTitleInPath(t) {
var _a, _b;
let e = o(t);
return this._matchTitle(e) ? e : (_b = (_a = t.composedPath) == null ? void 0 : _a.call(t)) == null ? void 0 : _b.find(this._matchTitle);
}
_toggleCut(t) {
var _a;
(_a = t.parentElement) == null ? void 0 : _a.classList.toggle(n.OPEN);
}
};
typeof window < "u" && typeof document < "u" && !window[i] && (window[i] = new c(document));
})();
// node_modules/@diplodoc/tabs-extension/build/runtime/index.js
(() => {
var x = "yfm-tabs", H = "yfm-tab", F = "yfm-tab-panel", D = "yfm-tab-list", l = "active";
var B = "data-diplodoc-group", G = "data-diplodoc-key", y = "data-diplodoc-variant", U = "data-diplodoc-id", L = "defaultTabsGroup-";
var R = "data-diplodoc-forced";
var w = "yfm-tabs-dropdown-select";
var W = "yfm-tabs-vertical";
var O = ((g) => (g.Regular = "regular", g.Radio = "radio", g.Dropdown = "dropdown", g.Accordion = "accordion", g))(O || {}), X = Symbol.for("diplodocTabs");
var f = (C) => {
let t = C.composedPath();
return Array.isArray(t) && t.length > 0 ? t[0] : C.target;
}, Z = (C) => {
let t = f(C);
return !t || !t.matches;
}, v = (C) => Math.abs(C.scrollHeight - C.clientHeight) > 1 ? C : C.parentElement ? v(C.parentElement) : void 0, Q = (C, t) => {
let e = C.getBoundingClientRect(), o = t.getBoundingClientRect();
return { top: e.top - o.top, left: e.left - o.left, scrollTop: t.scrollTop, scrollLeft: t.scrollLeft };
};
var n = { TABS: `.${x}`, TAB_LIST: `.${D}`, TAB: `.${H}`, TAB_PANEL: `.${F}`, VERTICAL_TABS: `.${W}` }, h = class {
constructor(t, e = {}) {
this._onSelectTabHandlers = /* @__PURE__ */ new Set();
this._currentPageTabGroups = [];
this._isRestoringTabs = false;
this._document = t, this._options = Object.assign({ saveTabsToLocalStorage: false, saveTabsToQueryStateMode: "none" }, e), this._document.addEventListener("click", (o) => {
let g = f(o);
if (o.target && this.hideAllDropdown(o.target), Z(o)) return;
if (this.isElementDropdownSelect(g)) {
g.classList.toggle(l);
return;
}
if (!this.isValidTabElement(g)) return;
let I = this.getTabDataFromHTMLElement(g);
I && this._selectTab(I, g);
}), this._document.addEventListener("keydown", (o) => {
let g = null;
switch (o.key) {
case "ArrowLeft": {
g = "left";
break;
}
case "ArrowRight": {
g = "right";
break;
}
case "ArrowUp": {
g = "left";
break;
}
case "ArrowDown": {
g = "right";
break;
}
}
if (!g) return;
let I = f(o);
if (Z(o) || !this.isValidTabElement(I)) return;
let { tabs: a, nodes: r } = this.getTabs(I), i = this.getTabDataFromHTMLElement(I), c = a.findIndex(({ key: A }) => (i == null ? void 0 : i.key) && A === i.key);
if (!i || a.length <= 1 || c === -1) return;
let s = (c + (g === "left" ? -1 : 1) + a.length) % a.length;
this.selectTab(a[s]), r[s].focus();
});
}
configure(t) {
this._options = Object.assign(this._options, t);
}
onSelectTab(t) {
return this._onSelectTabHandlers.add(t), () => {
this._onSelectTabHandlers.delete(t);
};
}
selectTabById(t, e) {
let o = this._document.querySelector(`${n.TAB}[${U}="${t}"]`);
if (!o || !this.isValidTabElement(o)) return;
let g = this.getTabDataFromHTMLElement(o);
g && this._selectTab(g, o), e != null && e.scrollToElement && o.scrollIntoView();
}
selectTab(t) {
this._selectTab(t);
}
restoreTabs(t) {
this._isRestoringTabs = true;
try {
for (let [e, o] of Object.entries(t)) if (e) {
let g = __spreadValues({ group: e }, o);
this.selectTab(g);
}
} finally {
this._isRestoringTabs = false;
}
}
getTabsFromLocalStorage() {
return JSON.parse(localStorage.getItem("tabsHistory") || "{}");
}
getTabsFromSearchQuery() {
let t = {}, e = new URLSearchParams(window.location.search);
return e.has("tabs") && (e.get("tabs") || "").split(",").forEach((I) => {
let a = I.split("_"), [r, i] = a, c = "regular";
if (a.length === 3 && (c = a[2]), r && i && Object.values(O).includes(c)) {
let s = i;
t[r] = { key: s, variant: c };
}
}), t;
}
updateLocalStorageWithTabs(t) {
this._options.saveTabsToLocalStorage && (this._isRestoringTabs || localStorage.setItem("tabsHistory", JSON.stringify(t)));
}
updateQueryParamWithTabs(t) {
if (this._isRestoringTabs) return;
let e = new URLSearchParams(window.location.search), o = Object.entries(t).map(([a, { key: r, variant: i }]) => i === "regular" ? `${a}_${r}` : `${a}_${r}_${i}`);
o.length > 0 ? e.set("tabs", o.join(",")) : e.delete("tabs");
let g = history.state || {}, I = new URL(window.location.href);
I.search = e.toString(), window.history.replaceState(__spreadValues({}, g), document.title, I.href);
}
getCurrentPageTabHistory(t) {
return Object.fromEntries(Object.entries(t).filter(([e]) => this._currentPageTabGroups.includes(e)));
}
onPageChanged() {
this._currentPageTabGroups = this.getCurrentPageTabGroups();
}
getCurrentPageTabGroups() {
let t = this._document.getElementsByClassName(x), e = /* @__PURE__ */ new Set();
return Array.from(t).forEach((o) => {
let g = o.getAttribute(B);
g && e.add(g);
}), Array.from(e);
}
clearTabsPreferred() {
localStorage.removeItem("tabsHistory"), this.updateQueryParamWithTabs({});
}
_selectTab(t, e) {
let { group: o, key: g, variant: I } = t;
if (!o) return;
this.saveTabPreferred({ group: o, key: g, variant: I });
let a = e && v(e), r = a && Q(e, a);
this.updateHTML({ group: o, key: g, variant: I }, e, I) > 0 && (this.fireSelectTabEvent({ group: o, key: g, variant: I }, e == null ? void 0 : e.dataset.diplodocId), r && this.resetScroll(e, a, r));
}
updateHTML(t, e, o) {
switch (o) {
case "radio":
return this.updateHTMLRadio(t, e);
case "accordion":
return this.updateHTMLAccordion(t, e);
case "regular":
return this.updateHTMLRegular(t);
case "dropdown":
return this.updateHTMLDropdown(t);
default:
return 0;
}
}
saveTabPreferred(t) {
let e = {};
switch (this._options.saveTabsToLocalStorage && (e = JSON.parse(localStorage.getItem("tabsHistory") || "{}")), e[t.group] = { key: t.key, variant: t.variant }, this._options.saveTabsToLocalStorage && this.updateLocalStorageWithTabs(e), this._options.saveTabsToQueryStateMode) {
case "all": {
this.updateQueryParamWithTabs(e);
break;
}
case "page": {
this.updateQueryParamWithTabs(this.getCurrentPageTabHistory(e));
break;
}
}
}
updateHTMLRadio(t, e) {
let { group: o, key: g } = t, { isForced: I, root: a } = this.didTabOpenForce(e), r = I ? `.yfm-vertical-tab[${R}="true"]` : "", i = this._document.querySelectorAll(`${n.TABS}[${B}="${o}"] ${n.TAB}[${G}="${g}"]${r}`);
I && (a == null || a.removeAttribute(R));
let c = 0;
return i.forEach((s) => {
let m = s.parentNode.children;
for (let p = 0; p < m.length; p += 2) {
let [d, b] = [m.item(p), m.item(p + 1)], u = d.children.item(0);
if (d === s) {
u.checked ? (d.classList.remove("active"), b == null || b.classList.remove("active"), u.removeAttribute("checked")) : (d.classList.add("active"), b == null || b.classList.add("active"), u.setAttribute("checked", "true"));
continue;
}
u.hasAttribute("checked") && (d.classList.remove("active"), b == null || b.classList.remove("active"), u.removeAttribute("checked")), c++;
}
}), c;
}
updateHTMLRegular(t) {
let { group: e, key: o } = t, g = this._document.querySelectorAll(`${n.TABS}[${B}="${e}"] ${n.TAB}[${G}="${o}"]`), I = 0;
return g.forEach((a) => {
let r = a;
if (!this.isValidTabElement(r) || r.dataset.diplodocIsActive === "true") return;
I++;
let i = a, c = i.parentNode, s = c == null ? void 0 : c.parentNode, A = Array.from((c == null ? void 0 : c.querySelectorAll(n.TAB)) || []), m = Array.from((s == null ? void 0 : s.children) || []).filter((d) => d.classList.contains(F)), p = A.indexOf(i);
A.forEach((d, b) => {
let u = m[b], T = b === p, S = d;
S.dataset.diplodocIsActive = T ? "true" : "false", d.classList.toggle(l, T), d.setAttribute("aria-selected", T.toString()), d.setAttribute("tabindex", T ? "0" : "-1"), u.classList.toggle(l, T);
});
}), I;
}
updateHTMLDropdown(t) {
let { group: e, key: o } = t, g = this._document.querySelectorAll(`${n.TABS}[${B}="${e}"] ${n.TAB}[${G}="${o}"]`), I = 0;
return g.forEach((a) => {
let r = a.closest(`[${y}=dropdown]`);
if (!(r != null && r.children)) return;
let i = r.children.item(0), c = r.children.item(1);
i == null || i.classList.remove(l);
let s = Array.from((c == null ? void 0 : c.children) || []).indexOf(a) + 2;
for (let A = 2; A < r.children.length; A++) {
let m = r.children.item(A), p = c == null ? void 0 : c.children.item(A - 2);
if (I++, s === A) {
m == null || m.classList.add(l), p.classList.add(l), i.innerHTML = a.innerHTML, i.classList.add("filled");
continue;
}
p.classList.remove(l), m.classList.remove(l);
}
}), I;
}
updateHTMLAccordion(t, e) {
let { group: o, key: g } = t, I = this._document.querySelectorAll(`${n.TABS}[${B}="${o}"] ${n.TAB}[${G}="${g}"]`), a = 0;
return I.forEach((r) => {
let i = r.closest(`[${y}=accordion]`);
if (i != null && i.children) for (let c = 0; c < i.children.length; c += 2) {
let s = i.children.item(c), A = i.children.item(c + 1);
if (a++, r === s) {
s == null || s.classList.toggle(l), A == null || A.classList.toggle(l);
continue;
}
s == null || s.classList.remove(l), A == null || A.classList.remove(l);
}
}), e && !this.checkVisible(e) && setTimeout(() => {
e.scrollIntoView({ block: "nearest" });
}), a;
}
checkVisible(t) {
let e = t.getBoundingClientRect(), o = Math.max(document.documentElement.clientHeight, window.innerHeight);
return !(e.bottom < 0 || e.top - o >= 0);
}
hideAllDropdown(t) {
this._document.querySelectorAll(".yfm-tabs-dropdown-select.active").forEach((o) => {
o.contains(t) || o.classList.remove(l);
});
}
resetScroll(t, e, o) {
let g = Q(t, e), I = g.top - o.top, a = g.left - o.left, r = g.scrollTop - o.scrollTop, i = g.scrollLeft - o.scrollLeft;
e.scrollTo(e.scrollLeft + a - i, e.scrollTop + I - r);
}
didTabOpenForce(t) {
if (!t) return {};
if (t.dataset.diplodocForced) return { root: t, isForced: true };
let e = t.dataset.diplodocVerticalTab ? t : t.parentElement, o = typeof (e == null ? void 0 : e.dataset.diplodocForced) != "undefined";
return { root: e, isForced: o };
}
fireSelectTabEvent(t, e) {
let { group: o, key: g, variant: I } = t, a = o.startsWith(L) ? { key: g, variant: I } : t;
this._onSelectTabHandlers.forEach((r) => {
r({ tab: a, currentTabId: e });
});
}
getTabsType(t) {
let e = t.closest(`[${y}]`);
if (e) return e.dataset.diplodocVariant;
}
isValidTabElement(t) {
return !!this.getTabsType(t);
}
isElementDropdownSelect(t) {
return t.classList.contains(w);
}
getTabDataFromHTMLElement(t) {
var I, a, r;
let e = this.getTabsType(t);
if (e === "radio") {
let i = t.dataset.diplodocVerticalTab ? t : t.parentElement, c = i.dataset.diplodocKey, s = (I = i.closest(n.TABS)) == null ? void 0 : I.dataset.diplodocGroup;
return c && s ? { group: s, key: c, variant: "radio" } : null;
}
if (e === "dropdown" || e === "accordion") {
let i = t.dataset.diplodocKey, c = (a = t.closest(n.TABS)) == null ? void 0 : a.dataset.diplodocGroup;
return i && c ? { group: c, key: i, variant: e } : null;
}
let o = t.dataset.diplodocKey, g = (r = t.closest(n.TABS)) == null ? void 0 : r.dataset.diplodocGroup;
return o && g ? { group: g, key: o, variant: "regular" } : null;
}
getTabs(t) {
var I, a;
let e = (I = t.closest(n.TABS)) == null ? void 0 : I.dataset.diplodocGroup, o = (a = t.closest(n.TAB_LIST)) == null ? void 0 : a.querySelectorAll(n.TAB), g = [];
return o.forEach((r) => {
let i = r == null ? void 0 : r.dataset.diplodocKey;
i && g.push({ group: e, key: i, variant: "regular" });
}), { tabs: g, nodes: o };
}
};
typeof window != "undefined" && typeof document != "undefined" && !window[X] && (window[X] = new h(document));
})();
// src/js/polyfill.js
var import_get_root_node_polyfill = __toESM(require_get_root_node_polyfill());
if (typeof document !== "undefined") {
(function(e) {
const matches = e.matches || e.matchesSelector || e.webkitMatchesSelector || e.mozMatchesSelector || e.msMatchesSelector || e.oMatchesSelector;
if (matches) {
e.matches = e.matchesSelector = matches;
} else {
e.matches = e.matchesSelector = function matches2(selector) {
const rootNode = e.getRootNode ? e.getRootNode() : import_get_root_node_polyfill.default.call(e);
const matches3 = rootNode.querySelectorAll(selector);
const th = this;
return Array.prototype.some.call(matches3, (e2) => {
return e2 === th;
});
};
}
})(Element.prototype);
}
// src/js/utils.ts
var getEventTarget = (event) => {
const path = event.composedPath();
return Array.isArray(path) && path.length > 0 ? path[0] : event.target;
};
var isCustom = (event) => {
const target = getEventTarget(event);
return !target || !target.matches;
};
// src/js/code.ts
var BUTTON_SELECTOR = ".yfm-clipboard-button";
function copyToClipboard(text) {
if (!text) {
return Promise.resolve();
}
if (navigator.clipboard && typeof navigator.clipboard.writeText) {
return navigator.clipboard.writeText(text);
}
const textarea = document.createElement("textarea");
textarea.setAttribute("style", "position: absolute; left: 1000%");
textarea.textContent = text;
document.body.append(textarea);
textarea.select();
document.execCommand("copy");
document.body.removeChild(textarea);
return Promise.resolve();
}
function notifySuccess(svgButton) {
if (!svgButton) {
return;
}
const id = svgButton.getAttribute("data-animation");
const icon = svgButton.getRootNode().getElementById(`visibileAnimation-${id}`);
if (!icon) {
return;
}
icon.beginElement();
}
if (typeof document !== "undefined") {
document.addEventListener("click", (event) => {
const target = getEventTarget(event);
if (isCustom(event) || !target.matches(BUTTON_SELECTOR)) {
return;
}
const parent = target.parentNode;
if (!parent) {
return;
}
const code = parent.querySelector("pre code");
if (!code) {
return;
}
copyToClipboard(code.innerText).then(() => {
notifySuccess(parent.querySelector(".yfm-clipboard-icon"));
});
});
}
// src/js/term/utils.ts
var Selector = {
TITLE: ".yfm .yfm-term_title",
CONTENT: ".yfm .yfm-term_dfn"
};
var openClass = "open";
var openDefinitionClass = Selector.CONTENT.replace(/\./g, "") + " " + openClass;
var isListenerNeeded = true;
function setDefinitionId(definitionElement, termElement) {
const termId = termElement.getAttribute("id") || Math.random().toString(36).substr(2, 8);
definitionElement == null ? void 0 : definitionElement.setAttribute("term-id", termId);
}
function setDefinitonAriaAttributes(definitionElement, termElement) {
const ariaLive = termElement.getAttribute("aria-live") || "polite";
definitionElement == null ? void 0 : definitionElement.setAttribute("aria-live", ariaLive);
definitionElement == null ? void 0 : definitionElement.setAttribute("aria-modal", "true");
}
function setDefinitionPosition(definitionElement, termElement) {
const {
x: termX,
y: termY,
right: termRight,
left: termLeft,
width: termWidth,
height: termHeight
} = termElement.getBoundingClientRect();
const termParent = termParentElement(termElement);
if (!termParent) {
return;
}
const { right: termParentRight, left: termParentLeft } = termParent.getBoundingClientRect();
if ((termParentRight < termLeft || termParentLeft > termRight) && !isListenerNeeded) {
closeDefinition(definitionElement);
return;
}
if (isListenerNeeded && termParent) {
termParent.addEventListener("scroll", termOnResize);
isListenerNeeded = false;
}
const relativeX = Number(definitionElement.getAttribute("relativeX"));
const relativeY = Number(definitionElement.getAttribute("relativeY"));
if (relativeX === termX && relativeY === termY) {
return;
}
definitionElement.setAttribute("relativeX", String(termX));
definitionElement.setAttribute("relativeY", String(termY));
const offsetTop = termHeight + 5;
const definitionParent = definitionElement.parentElement;
if (!definitionParent) {
return;
}
const { width: definitionWidth } = definitionElement.getBoundingClientRect();
const { left: definitionParentLeft } = definitionParent.getBoundingClientRect();
const definitionLeftCoordinate = Number(getCoords(termElement).left);
const definitionRightCoordinate = definitionWidth + definitionLeftCoordinate;
const definitionOutOfScreenOnLeft = definitionLeftCoordinate - definitionWidth < 0;
const definitionOutOfScreenOnRight = definitionRightCoordinate > document.body.clientWidth;
const isAlignSwapped = definitionOutOfScreenOnRight || document.dir === "rtl";
const fitDefinitionDocument = isAlignSwapped && !definitionOutOfScreenOnLeft ? definitionWidth - termWidth : 0;
const customHeaderTop = getCoords(definitionParent).top - definitionParent.offsetTop;
const offsetRight = 5;
const shiftLeft = definitionOutOfScreenOnRight ? definitionRightCoordinate - document.body.clientWidth + offsetRight : 0;
const offsetLeft = getCoords(termElement).left - definitionParentLeft + definitionParent.offsetLeft - fitDefinitionDocument;
const isShiftLeftNeeded = offsetLeft + definitionWidth >= document.body.clientWidth;
definitionElement.style.top = Number(getCoords(termElement).top + offsetTop - customHeaderTop) + "px";
definitionElement.style.left = Number(offsetLeft - (isShiftLeftNeeded ? shiftLeft : 0)) + "px";
}
function termOnResize() {
const openedDefinition = document.getElementsByClassName(openDefinitionClass)[0];
if (!openedDefinition) {
return;
}
const termId = openedDefinition.getAttribute("term-id") || "";
const termElement = document.getElementById(termId);
if (!termElement) {
return;
}
setDefinitionPosition(openedDefinition, termElement);
}
function termParentElement(term) {
if (!term) {
return null;
}
const closestScrollableParent = term.closest("table") || term.closest("code");
return closestScrollableParent || term.parentElement;
}
function openDefinition(target) {
const openedDefinition = document.getElementsByClassName(openDefinitionClass)[0];
const termId = target.getAttribute("id");
const termKey = target.getAttribute("term-key");
const definitionElement = document.getElementById(termKey + "_element");
const isSameTerm = openedDefinition && termId === openedDefinition.getAttribute("term-id");
if (isSameTerm) {
closeDefinition(openedDefinition);
return;
}
const isTargetDefinitionContent = target.closest(
[Selector.CONTENT.replace(" ", ""), openClass].join(".")
);
if (openedDefinition && !isTargetDefinitionContent) {
closeDefinition(openedDefinition);
}
if (!target.matches(Selector.TITLE) || !definitionElement) {
return;
}
setDefinitionId(definitionElement, target);
setDefinitonAriaAttributes(definitionElement, target);
setDefinitionPosition(definitionElement, target);
definitionElement.classList.toggle(openClass);
trapFocus(definitionElement);
}
function closeDefinition(definition) {
definition.classList.remove(openClass);
const term = getTermByDefinition(definition);
const termParent = termParentElement(term);
if (!termParent) {
return;
}
termParent.removeEventListener("scroll", termOnResize);
isListenerNeeded = true;
}
function getCoords(elem) {
const box = elem.getBoundingClientRect();
const body = document.body;
const docEl = document.documentElement;
const scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
const scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;
const clientTop = docEl.clientTop || body.clientTop || 0;
const clientLeft = docEl.clientLeft || body.clientLeft || 0;
const top = box.top + scrollTop - clientTop;
const left = box.left + scrollLeft - clientLeft;
return { top: Math.round(top), left: Math.round(left) };
}
function trapFocus(element) {
const focusableElements = element.querySelectorAll(
'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
);
const firstFocusableElement = focusableElements[0];
const lastFocusableElement = focusableElements[focusableElements.length - 1];
if (firstFocusableElement) {
firstFocusableElement.focus();
}
element.addEventListener("keydown", function(e) {
const isTabPressed = e.key === "Tab" || e.keyCode === 9;
if (!isTabPressed) {
return;
}
if (e.shiftKey) {
if (document.activeElement === firstFocusableElement) {
lastFocusableElement.focus();
e.preventDefault();
}
} else if (document.activeElement === lastFocusableElement) {
firstFocusableElement.focus();
e.preventDefault();
}
});
}
function getTermByDefinition(definition) {
const termId = definition.getAttribute("term-id");
return termId ? document.getElementById(termId) : null;
}
// src/js/term/index.ts
if (typeof document !== "undefined") {
document.addEventListener("click", (event) => {
if (getEventTarget(event) || !isCustom(event)) {
openDefinition(getEventTarget(event));
}
});
document.addEventListener("keydown", (event) => {
var _a;
const openedDefinition = document.getElementsByClassName(
openDefinitionClass
)[0];
if (event.key === "Enter" && document.activeElement) {
openDefinition(document.activeElement);
}
if (event.key === "Escape" && openedDefinition) {
closeDefinition(openedDefinition);
(_a = getTermByDefinition(openedDefinition)) == null ? void 0 : _a.focus();
}
});
window.addEventListener("resize", () => {
const openedDefinition = document.getElementsByClassName(
openDefinitionClass
)[0];
if (!openedDefinition) {
return;
}
const termId = openedDefinition.getAttribute("term-id") || "";
const termElement = document.getElementById(termId);
if (!termElement) {
openedDefinition.classList.toggle(openClass);
return;
}
setDefinitionPosition(openedDefinition, termElement);
});
}
// src/js/wide-mode/constants.ts
var WIDE_ELEMENTS_SELECTOR = "[wide-content]";
// src/js/wide-mode/icons/expand.ts
var expand_default = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M7.754 2.004a.75.75 0 0 0 0 1.5h4.75v4.742a.75.75 0 0 0 1.5 0V2.754a.75.75 0 0 0-.75-.75zm.492 11.992a.75.75 0 0 0 0-1.5h-4.75V7.754a.75.75 0 0 0-1.5 0v5.492a.75.75 0 0 0 .75.75z" clip-rule="evenodd"/></svg>`;
// src/js/wide-mode/icons/close.ts
var close_default = `<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg" class="close-action"><path fillRule="evenodd" clipRule="evenodd" d="M9.46967 9.46967C9.76256 9.17678 10.2374 9.17678 10.5303 9.46967L14 12.9393L17.4697 9.46967C17.7626 9.17678 18.2374 9.17678 18.5303 9.46967C18.8232 9.76256 18.8232 10.2374 18.5303 10.5303L15.0607 14L18.5303 17.4697C18.8232 17.7626 18.8232 18.2374 18.5303 18.5303C18.2374 18.8232 17.7626 18.8232 17.4697 18.5303L14 15.0607L10.5303 18.5303C10.2374 18.8232 9.76256 18.8232 9.46967 18.5303C9.17678 18.2374 9.17678 17.7626 9.46967 17.4697L12.9393 14L9.46967 10.5303C9.17678 10.2374 9.17678 9.76256 9.46967 9.46967Z" fill="var(--g-color-text-primary)" fillOpacity="0.85"/></svg>`;
// src/js/wide-mode/modal.ts
var remove = () => {
if (!window.wideTemplate) {
return;
}
window.wideTemplate.style.display = "none";
window.wideTemplate.content(void 0);
};
var tbodyOf = (node) => {
if (node.tagName !== "TABLE") {
return void 0;
}
const elements = Array.from(node.children);
const thead = elements.find((child) => child.tagName === "THEAD");
if (thead) {
return void 0;
}
const tbody = elements.find((child) => child.tagName === "TBODY");
return tbody;
};
var container = () => {
if (window.wideTemplate) {
return window.wideTemplate;
}
const template = document.createElement("div");
template.classList.add("dc-doc-page", "wide-container");
const overlay = document.createElement("div");
overlay.classList.add("wide-content-overlay");
overlay.addEventListener("click", remove);
const wrapper = document.createElement("div");
wrapper.classList.add("yfm", "wide-content-wrapper");
const toolbar = document.createElement("div");
toolbar.classList.add("wide-toolbar");
const close = document.createElement("div");
close.classList.add("wide-actions");
close.addEventListener("click", remove);
close.innerHTML = close_default;
const title = document.createElement("p");
title.classList.add("wide-entity-name");
template.label = (content2) => {
title.innerHTML = content2 || "";
};
const content = document.createElement("div");
content.classList.add("wide-content");
template.content = (target) => {
var _a;
if (typeof target === "undefined") {
content.innerHTML = "";
return;
}
const cloned = target.cloneNode(true);
const tbody = tbodyOf(cloned);
(_a = tbody == null ? void 0 : tbody.classList) == null ? void 0 : _a.add("wide-thead-content");
content.replaceChildren(cloned);
};
toolbar.append(title, close);
wrapper.append(toolbar, content);
template.append(overlay, wrapper);
template.style.display = "none";
document.body.appendChild(template);
window.wideTemplate = template;
return template;
};
var render = (content) => {
const template = container();
template.label(content.title);
template.content(content);
template.style.display = "flex";
};
var modal = {
render,
remove
};
// src/js/wide-mode/apply.ts
var wrap = (target) => {
var _a;
if ((_a = target.parentElement) == null ? void 0 : _a.classList.contains("wide-element-wrapper")) {
return;
}
target.classList.add("wide-inner-element");
const handler = document.createElement("div");
handler.innerHTML = expand_default;
handler.classList.add("wide-content-viewer");
handler.addEventListener("click", () => modal.render(target));
const container2 = document.createElement("div");
container2.classList.add("wide-element-wrapper");
target.before(container2);
container2.appendChild(target);
container2.appendChild(handler);
};
var applyWideMode = () => {
const allWideElements = Array.from(
document.querySelectorAll(WIDE_ELEMENTS_SELECTOR)
);
allWideElements.forEach(wrap);
};
// src/js/wide-mode/index.ts
if (typeof window !== "undefined" && typeof document !== "undefined") {
window.addEventListener("load", applyWideMode);
}
// src/js/patch.ts
var patch = () => {
applyWideMode();
};
if (typeof window !== "undefined") {
window.patchAfterRender = patch;
}
})();
//# sourceMappingURL=yfm.js.map