@diplodoc/transform 4.63.8 → 4.64.1

package/dist/js/yfm.js

@@ -137,30 +137,30 @@
 
   // node_modules/@diplodoc/tabs-extension/build/runtime/index.js
   (() => {
-    var h = "yfm-tabs", H = "yfm-tab", F = "yfm-tab-panel", L = "yfm-tab-list", l = "active";
-    var B = "data-diplodoc-group", G = "data-diplodoc-key", y = "data-diplodoc-variant", N = "data-diplodoc-id", W = "defaultTabsGroup-";
-    var O = "data-diplodoc-forced";
-    var S = "yfm-tabs-dropdown-select";
+    var x = "yfm-tabs", L = "yfm-tab", O = "yfm-tab-panel", H = "yfm-tab-list", l = "active";
+    var T = "data-diplodoc-group", G = "data-diplodoc-key", y = "data-diplodoc-variant", S = "data-diplodoc-id", U = "defaultTabsGroup-";
+    var F = "data-diplodoc-forced";
+    var W = "yfm-tabs-dropdown-select";
     var w = "yfm-tabs-vertical";
-    var Z = ((g) => (g.Regular = "regular", g.Radio = "radio", g.Dropdown = "dropdown", g.Accordion = "accordion", g))(Z || {}), X = Symbol.for("diplodocTabs");
-    var f = (C) => {
+    var v = ((g) => (g.Regular = "regular", g.Radio = "radio", g.Dropdown = "dropdown", g.Accordion = "accordion", g))(v || {}), X = Symbol.for("diplodocTabs");
+    var h = (C) => {
       let t = C.composedPath();
       return Array.isArray(t) && t.length > 0 ? t[0] : C.target;
-    }, v = (C) => {
-      let t = f(C);
+    }, R = (C) => {
+      let t = h(C);
       return !t || !t.matches;
-    }, R = (C) => Math.abs(C.scrollHeight - C.clientHeight) > 1 ? C : C.parentElement ? R(C.parentElement) : void 0, Q = (C, t) => {
+    }, Z = (C) => Math.abs(C.scrollHeight - C.clientHeight) > 1 ? C : C.parentElement ? Z(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: `.${h}`, TAB_LIST: `.${L}`, TAB: `.${H}`, TAB_PANEL: `.${F}`, VERTICAL_TABS: `.${w}` }, x = class {
+    var n = { TABS: `.${x}`, TAB_LIST: `.${H}`, TAB: `.${L}`, TAB_PANEL: `.${O}`, VERTICAL_TABS: `.${w}` }, f = 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), v(o)) return;
+          let g = h(o);
+          if (o.target && this.hideAllDropdown(o.target), R(o)) return;
           if (this.isElementDropdownSelect(g)) {
             g.classList.toggle(l);
             return;
@@ -189,12 +189,12 @@
             }
           }
           if (!g) return;
-          let I = f(o);
-          if (v(o) || !this.isValidTabElement(I)) return;
-          let { tabs: a, nodes: r } = this.getTabs(I), i = this.getTabDataFromHTMLElement(I), s = a.findIndex(({ key: A }) => (i == null ? void 0 : i.key) && A === i.key);
-          if (!i || a.length <= 1 || s === -1) return;
-          let c = (s + (g === "left" ? -1 : 1) + a.length) % a.length;
-          this.selectTab(a[c]), r[c].focus();
+          let I = h(o);
+          if (R(o) || !this.isValidTabElement(I)) return;
+          let { tabs: a, nodes: c } = this.getTabs(I), i = this.getTabDataFromHTMLElement(I), r = a.findIndex(({ key: A }) => (i == null ? void 0 : i.key) && A === i.key);
+          if (!i || a.length <= 1 || r === -1) return;
+          let s = (r + (g === "left" ? -1 : 1) + a.length) % a.length;
+          this.selectTab(a[s]), c[s].focus();
         });
       }
       configure(t) {
@@ -206,7 +206,7 @@
         };
       }
       selectTabById(t, e) {
-        let o = this._document.querySelector(`${n.TAB}[${N}="${t}"]`);
+        let o = this._document.querySelector(`${n.TAB}[${S}="${t}"]`);
         if (!o || !this.isValidTabElement(o)) return;
         let g = this.getTabDataFromHTMLElement(o);
         g && this._selectTab(g, o), e != null && e.scrollToElement && o.scrollIntoView();
@@ -231,10 +231,10 @@
       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, s = "regular";
-          if (a.length === 3 && (s = a[2]), r && i && Object.values(Z).includes(s)) {
-            let c = i;
-            t[r] = { key: c, variant: s };
+          let a = I.split("_"), [c, i] = a, r = "regular";
+          if (a.length === 3 && (r = a[2]), c && i && Object.values(v).includes(r)) {
+            let s = i;
+            t[c] = { key: s, variant: r };
           }
         }), t;
       }
@@ -243,7 +243,7 @@
       }
       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}`);
+        let e = new URLSearchParams(window.location.search), o = Object.entries(t).map(([a, { key: c, variant: i }]) => i === "regular" ? `${a}_${c}` : `${a}_${c}_${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);
@@ -255,9 +255,9 @@
         this._currentPageTabGroups = this.getCurrentPageTabGroups();
       }
       getCurrentPageTabGroups() {
-        let t = this._document.getElementsByClassName(h), e = /* @__PURE__ */ new Set();
+        let t = this._document.getElementsByClassName(x), e = /* @__PURE__ */ new Set();
         return Array.from(t).forEach((o) => {
-          let g = o.getAttribute(B);
+          let g = o.getAttribute(T);
           g && e.add(g);
         }), Array.from(e);
       }
@@ -268,8 +268,8 @@
         let { group: o, key: g, variant: I } = t;
         if (!o) return;
         this.saveTabPreferred({ group: o, key: g, variant: I });
-        let a = e && R(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));
+        let a = e && Z(e), c = 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), c && this.resetScroll(e, a, c));
       }
       updateHTML(t, e, o) {
         switch (o) {
@@ -299,45 +299,45 @@
         }
       }
       updateHTMLRadio(t, e) {
-        let { group: o, key: g } = t, { isForced: I, root: a } = this.didTabOpenForce(e), r = I ? `.yfm-vertical-tab[${O}="true"]` : "", i = this._document.querySelectorAll(`${n.TABS}[${B}="${o}"] ${n.TAB}[${G}="${g}"]${r}`);
-        I && (a == null || a.removeAttribute(O));
-        let s = 0;
-        return i.forEach((c) => {
-          let m = c.parentNode.children;
+        let { group: o, key: g } = t, { isForced: I, root: a } = this.didTabOpenForce(e), c = I ? `.yfm-vertical-tab[${F}="true"]` : "", i = this._document.querySelectorAll(`${n.TABS}[${T}="${o}"] ${n.TAB}[${G}="${g}"]${c}`);
+        I && (a == null || a.removeAttribute(F));
+        let r = 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 === c) {
+            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")), s++;
+            u.hasAttribute("checked") && (d.classList.remove("active"), b == null || b.classList.remove("active"), u.removeAttribute("checked")), r++;
           }
-        }), s;
+        }), r;
       }
       updateHTMLRegular(t) {
-        let { group: e, key: o } = t, g = this._document.querySelectorAll(`${n.TABS}[${B}="${e}"] ${n.TAB}[${G}="${o}"]`), I = 0;
+        let { group: e, key: o } = t, g = this._document.querySelectorAll(`${n.TABS}[${T}="${e}"] ${n.TAB}[${G}="${o}"]`), I = 0;
         return g.forEach((a) => {
-          let r = a;
-          if (!this.isValidTabElement(r) || r.dataset.diplodocIsActive === "true") return;
+          let c = a;
+          if (!this.isValidTabElement(c) || c.dataset.diplodocIsActive === "true") return;
           I++;
-          let i = a, s = i.parentNode, c = s == null ? void 0 : s.parentNode, A = Array.from((s == null ? void 0 : s.querySelectorAll(n.TAB)) || []), m = Array.from((c == null ? void 0 : c.children) || []).filter((d) => d.classList.contains(F)), p = A.indexOf(i);
+          let i = a, r = i.parentNode, s = r == null ? void 0 : r.parentNode, A = Array.from((r == null ? void 0 : r.querySelectorAll(n.TAB)) || []), m = Array.from((s == null ? void 0 : s.children) || []).filter((d) => d.classList.contains(O)), p = A.indexOf(i);
           A.forEach((d, b) => {
-            let u = m[b], T = b === p, U = d;
-            U.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);
+            let u = m[b], B = b === p, N = d;
+            N.dataset.diplodocIsActive = B ? "true" : "false", d.classList.toggle(l, B), d.setAttribute("aria-selected", B.toString()), d.setAttribute("tabindex", B ? "0" : "-1"), u.classList.toggle(l, B);
           });
         }), I;
       }
       updateHTMLDropdown(t) {
-        let { group: e, key: o } = t, g = this._document.querySelectorAll(`${n.TABS}[${B}="${e}"] ${n.TAB}[${G}="${o}"]`), I = 0;
+        let { group: e, key: o } = t, g = this._document.querySelectorAll(`${n.TABS}[${T}="${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), s = r.children.item(1);
+          let c = a.closest(`[${y}=dropdown]`);
+          if (!(c != null && c.children)) return;
+          let i = c.children.item(0), r = c.children.item(1);
           i == null || i.classList.remove(l);
-          let c = Array.from((s == null ? void 0 : s.children) || []).indexOf(a) + 2;
-          for (let A = 2; A < r.children.length; A++) {
-            let m = r.children.item(A), p = s == null ? void 0 : s.children.item(A - 2);
-            if (I++, c === A) {
+          let s = Array.from((r == null ? void 0 : r.children) || []).indexOf(a) + 2;
+          for (let A = 2; A < c.children.length; A++) {
+            let m = c.children.item(A), p = r == null ? void 0 : r.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;
             }
@@ -346,16 +346,16 @@
         }), 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 s = 0; s < i.children.length; s += 2) {
-            let c = i.children.item(s), A = i.children.item(s + 1);
-            if (a++, r === c) {
-              c == null || c.classList.toggle(l), A == null || A.classList.toggle(l);
+        let { group: o, key: g } = t, I = this._document.querySelectorAll(`${n.TABS}[${T}="${o}"] ${n.TAB}[${G}="${g}"]`), a = 0;
+        return I.forEach((c) => {
+          let i = c.closest(`[${y}=accordion]`);
+          if (i != null && i.children) for (let r = 0; r < i.children.length; r += 2) {
+            let s = i.children.item(r), A = i.children.item(r + 1);
+            if (a++, c === s) {
+              s == null || s.classList.toggle(l), A == null || A.classList.toggle(l);
               continue;
             }
-            c == null || c.classList.remove(l), A == null || A.classList.remove(l);
+            s == null || s.classList.remove(l), A == null || A.classList.remove(l);
           }
         }), e && !this.checkVisible(e) && setTimeout(() => {
           e.scrollIntoView({ block: "nearest" });
@@ -371,8 +371,8 @@
         });
       }
       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);
+        let g = Q(t, e), I = g.top - o.top, a = g.left - o.left, c = g.scrollTop - o.scrollTop, i = g.scrollLeft - o.scrollLeft;
+        e.scrollTo(e.scrollLeft + a - i, e.scrollTop + I - c);
       }
       didTabOpenForce(t) {
         if (!t) return {};
@@ -381,9 +381,9 @@
         return { root: e, isForced: o };
       }
       fireSelectTabEvent(t, e) {
-        let { group: o, key: g, variant: I } = t, a = o.startsWith(W) ? { key: g, variant: I } : t;
-        this._onSelectTabHandlers.forEach((r) => {
-          r({ tab: a, currentTabId: e });
+        let { group: o, key: g, variant: I } = t, a = o.startsWith(U) ? { key: g, variant: I } : t;
+        this._onSelectTabHandlers.forEach((c) => {
+          c({ tab: a, currentTabId: e });
         });
       }
       getTabsType(t) {
@@ -394,32 +394,32 @@
         return !!this.getTabsType(t);
       }
       isElementDropdownSelect(t) {
-        return t.classList.contains(S);
+        return t.classList.contains(W);
       }
       getTabDataFromHTMLElement(t) {
-        var I, a, r;
+        var I, a, c;
         let e = this.getTabsType(t);
         if (e === "radio") {
-          let i = t.dataset.diplodocVerticalTab ? t : t.parentElement, s = i.dataset.diplodocKey, c = (I = i.closest(n.TABS)) == null ? void 0 : I.dataset.diplodocGroup;
-          return s && c ? { group: c, key: s, variant: "radio" } : null;
+          let i = t.dataset.diplodocVerticalTab ? t : t.parentElement, r = i.dataset.diplodocKey, s = (I = i.closest(n.TABS)) == null ? void 0 : I.dataset.diplodocGroup;
+          return r && s ? { group: s, key: r, variant: "radio" } : null;
         }
         if (e === "dropdown" || e === "accordion") {
-          let i = t.dataset.diplodocKey, s = (a = t.closest(n.TABS)) == null ? void 0 : a.dataset.diplodocGroup;
-          return i && s ? { group: s, key: i, variant: e } : null;
+          let i = t.dataset.diplodocKey, r = (a = t.closest(n.TABS)) == null ? void 0 : a.dataset.diplodocGroup;
+          return i && r ? { group: r, key: i, variant: e } : null;
         }
-        let o = t.dataset.diplodocKey, g = (r = t.closest(n.TABS)) == null ? void 0 : r.dataset.diplodocGroup;
+        let o = t.dataset.diplodocKey, g = (c = t.closest(n.TABS)) == null ? void 0 : c.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;
+        return o.forEach((c) => {
+          let i = c == null ? void 0 : c.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 x(document));
+    typeof window != "undefined" && typeof document != "undefined" && !window[X] && (window[X] = new f(document));
   })();
 
   // src/js/polyfill.js

package/dist/scss/_anchor.scss

@@ -0,0 +1,76 @@
+.yfm {
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        .yfm-clipboard-anchor {
+            //reset default button style
+            background: none;
+            color: var(--yfm-color-link, var(--yfm-color-link-private));
+            border: none;
+            padding: 0;
+            font: inherit;
+            cursor: pointer;
+
+            &:hover {
+                color: var(--yfm-color-link-hover, var(--yfm-color-link-hover-private));
+            }
+        }
+
+        .yfm-anchor,
+        .yfm-clipboard-anchor {
+            display: inline-block;
+            width: 24px;
+            padding-right: 4px;
+            margin-left: -24px;
+            float: left;
+
+            text-align: center;
+            font-size: 18px;
+
+            &:focus {
+                &::before {
+                    opacity: 1;
+                }
+            }
+
+            &::before {
+                content: '#';
+                opacity: 0;
+            }
+        }
+
+        &:hover {
+            .yfm-anchor::before,
+            .yfm-clipboard-anchor::before {
+                opacity: 1;
+            }
+        }
+    }
+
+    table {
+        h1,
+        h2,
+        h3,
+        h4,
+        h5,
+        h6 {
+            .yfm-anchor,
+            .yfm-clipboard-anchor {
+                width: 1em;
+                margin-left: -1em;
+                padding-right: 0;
+            }
+        }
+    }
+
+    .yfm-tabs {
+        .yfm-anchor::before,
+        .yfm-clipboard-anchor::before {
+            position: absolute;
+            padding-right: 2px;
+        }
+    }
+}

package/dist/scss/_code.scss

@@ -0,0 +1,57 @@
+.yfm {
+    &-clipboard {
+        position: relative;
+
+        .yfm-clipboard-button {
+            min-width: 20px;
+            min-height: 20px;
+        }
+
+        &:hover {
+            .yfm-clipboard-button {
+                opacity: 1;
+            }
+        }
+
+        & > pre {
+            border-radius: 10px;
+            overflow: hidden;
+        }
+
+        &-button {
+            position: absolute;
+            top: 16px;
+            right: 16px;
+            z-index: 1;
+            opacity: 0;
+
+            //reset default button style
+            background: none;
+            color: inherit;
+            border: none;
+            padding: 0;
+            font: inherit;
+            cursor: pointer;
+
+            &:focus {
+                opacity: 1;
+            }
+        }
+
+        &-icon {
+            pointer-events: none;
+        }
+
+        &-inline-code {
+            transition: 0.3s;
+
+            &:hover {
+                cursor: pointer;
+                background-color: var(
+                    --yfm-color-code-hovered-background,
+                    var(--yfm-color-code-background-hovered-private)
+                );
+            }
+        }
+    }
+}