@remloyal/docsify-plugins 1.0.0

package/src/flexsearch/markdown-to-txt.js

@@ -0,0 +1,206 @@
+/**
+ * This is a function to convert markdown to txt based on markedjs v13+.
+ * Copies the escape/unescape functions from [lodash](https://www.npmjs.com/package/lodash) instead import to reduce the size.
+ */
+import { marked } from 'marked';
+
+const reEscapedHtml = /&(?:amp|lt|gt|quot|#(0+)?39);/g;
+const reHasEscapedHtml = RegExp(reEscapedHtml.source);
+const htmlUnescapes = {
+  '&': '&',
+  '&lt;': '<',
+  '&gt;': '>',
+  '&quot;': '"',
+  '&#39;': "'",
+};
+
+function unescape(string) {
+  return string && reHasEscapedHtml.test(string)
+    ? string.replace(reEscapedHtml, entity => htmlUnescapes[entity] || "'")
+    : string || '';
+}
+
+const reUnescapedHtml = /[&<>"']/g;
+const reHasUnescapedHtml = RegExp(reUnescapedHtml.source);
+const htmlEscapes = {
+  '&': '&amp;',
+  '<': '&lt;',
+  '>': '&gt;',
+  '"': '&quot;',
+  "'": '&#39;',
+};
+
+function escape(string) {
+  return string && reHasUnescapedHtml.test(string)
+    ? string.replace(reUnescapedHtml, chr => htmlEscapes[chr])
+    : string || '';
+}
+
+function helpersCleanup(string) {
+  return string && string.replace('!>', '').replace('?>', '');
+}
+
+const markdownToTxtRenderer = {
+  space() {
+    return '';
+  },
+
+  code({ text }) {
+    const code = text.replace(/\n$/, '');
+    return escape(code);
+  },
+
+  blockquote({ tokens }) {
+    return this.parser?.parse(tokens) || '';
+  },
+
+  html() {
+    return '';
+  },
+
+  heading({ tokens }) {
+    return this.parser?.parseInline(tokens) || '';
+  },
+
+  hr() {
+    return '';
+  },
+
+  list(token) {
+    let body = '';
+    for (let j = 0; j < token.items.length; j++) {
+      const item = token.items[j];
+      body += this.listitem?.(item);
+    }
+
+    return body;
+  },
+
+  listitem(item) {
+    let itemBody = '';
+    if (item.task) {
+      const checkbox = this.checkbox?.({
+        checked: !!item.checked,
+      });
+      if (item.loose) {
+        if (item.tokens.length > 0 && item.tokens[0].type === 'paragraph') {
+          item.tokens[0].text = checkbox + ' ' + item.tokens[0].text;
+          if (
+            item.tokens[0].tokens &&
+            item.tokens[0].tokens.length > 0 &&
+            item.tokens[0].tokens[0].type === 'text'
+          ) {
+            item.tokens[0].tokens[0].text =
+              checkbox + ' ' + item.tokens[0].tokens[0].text;
+          }
+        } else {
+          item.tokens.unshift({
+            type: 'text',
+            raw: checkbox + ' ',
+            text: checkbox + ' ',
+          });
+        }
+      } else {
+        itemBody += checkbox + ' ';
+      }
+    }
+
+    itemBody += this.parser?.parse(item.tokens, !!item.loose);
+
+    return `${itemBody || ''}`;
+  },
+
+  /**
+   * @param {{checked: boolean}} options
+   * @return {string}
+   */
+  checkbox(options) {
+    return '';
+  },
+
+  paragraph({ tokens }) {
+    return this.parser?.parseInline(tokens) || '';
+  },
+
+  table(token) {
+    let header = '';
+
+    let cell = '';
+    for (let j = 0; j < token.header.length; j++) {
+      cell += this.tablecell?.(token.header[j]);
+    }
+    header += this.tablerow?.({ text: cell });
+
+    let body = '';
+    for (let j = 0; j < token.rows.length; j++) {
+      const row = token.rows[j];
+
+      cell = '';
+      for (let k = 0; k < row.length; k++) {
+        cell += this.tablecell?.(row[k]);
+      }
+
+      body += this.tablerow?.({ text: cell });
+    }
+
+    return header + ' ' + body;
+  },
+
+  tablerow({ text }) {
+    return text;
+  },
+
+  tablecell(token) {
+    return this.parser?.parseInline(token.tokens) || '';
+  },
+
+  strong({ text }) {
+    return text;
+  },
+
+  em({ tokens }) {
+    return this.parser?.parseInline(tokens) || '';
+  },
+
+  codespan({ text }) {
+    return text;
+  },
+
+  br() {
+    return ' ';
+  },
+
+  del({ tokens }) {
+    return this.parser?.parseInline(tokens);
+  },
+
+  link({ tokens, href, title }) {
+    // Remain the href and title attributes for searching, so is the image
+    // e.g. [filename](_media/example.js ':include :type=code :fragment=demo')
+    // Result: filename _media/example.js :include :type=code :fragment=demo
+    return `${this.parser?.parseInline(tokens) || ''} ${href || ''} ${title || ''}`;
+  },
+
+  image({ title, text, href }) {
+    return `${text || ''} ${href || ''} ${title || ''}`;
+  },
+
+  text(token) {
+    return token.tokens
+      ? this.parser?.parseInline(token.tokens) || ''
+      : token.text || '';
+  },
+};
+const _marked = marked.setOptions({
+  // @ts-expect-error missing properties
+  renderer: markdownToTxtRenderer,
+});
+
+export function markdownToTxt(markdown) {
+  const unmarked = _marked.parse(markdown);
+  const unescaped = unescape(unmarked);
+  const helpersCleaned = helpersCleanup(unescaped);
+  return helpersCleaned.trim();
+}
+
+export default markdownToTxt;

package/src/flexsearch/style.css

@@ -0,0 +1,247 @@
+/* prettier-ignore */
+:root {
+	--plugin-flexsearch-input-bg           : var(--form-element-bg);
+	--plugin-flexsearch-input-border-color : var(--sidebar-border-color);
+	--plugin-flexsearch-input-border-radius: var(--form-element-border-radius);
+	--plugin-flexsearch-input-color        : var(--form-element-color);
+	--plugin-flexsearch-kbd-bg             : var(--color-bg);
+	--plugin-flexsearch-kbd-border         : 1px solid var(--color-mono-3);
+	--plugin-flexsearch-kbd-border-radius  : 4px;
+	--plugin-flexsearch-kbd-color          : var(--color-mono-5);
+	--plugin-flexsearch-margin             : 10px;
+	--plugin-flexsearch-reset-bg           : var(--theme-color);
+	--plugin-flexsearch-reset-border       : transparent;
+	--plugin-flexsearch-reset-border-radius: var(--border-radius);
+	--plugin-flexsearch-reset-color        : #fff;
+}
+
+.flexsearch-search {
+  margin: var(--plugin-flexsearch-margin);
+}
+
+.flexsearch-search .input-wrap {
+  position: relative;
+}
+
+.flexsearch-search input {
+  width: 100%;
+  padding-inline-end: 36px;
+  border: 1px solid var(--plugin-flexsearch-input-border-color);
+  border-radius: var(--plugin-flexsearch-input-border-radius);
+  background: var(--plugin-flexsearch-input-bg);
+  color: var(--plugin-flexsearch-input-color);
+}
+
+.flexsearch-search input::-webkit-search-decoration,
+.flexsearch-search input::-webkit-search-cancel-button {
+  appearance: none;
+}
+
+.flexsearch-search .clear-button,
+.flexsearch-search .kbd-group {
+  visibility: hidden;
+  display: flex;
+  gap: 0.15em;
+  position: absolute;
+  right: 7px;
+  top: 50%;
+  opacity: 0;
+  translate: 0 -50%;
+  transition-property: opacity, visibility;
+  transition-duration: var(--duration-medium);
+}
+
+.flexsearch-search input:valid ~ .clear-button,
+.flexsearch-search input:invalid:where(:focus, :hover) ~ .kbd-group,
+.flexsearch-search .kbd-group:hover {
+  visibility: visible;
+  opacity: 1;
+}
+
+.flexsearch-search .clear-button {
+  --_button-size: 20px;
+  --_content-size: 12px;
+
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: var(--_button-size);
+  width: var(--_button-size);
+  border: var(--plugin-flexsearch-reset-border);
+  border-radius: var(--plugin-flexsearch-reset-border-radius);
+  background: var(--plugin-flexsearch-reset-bg);
+  cursor: pointer;
+}
+
+.flexsearch-search .clear-button::before,
+.flexsearch-search .clear-button::after {
+  content: "";
+  position: absolute;
+  height: 2px;
+  width: var(--_content-size);
+  color: var(--plugin-flexsearch-reset-color);
+  background: var(--plugin-flexsearch-reset-color);
+}
+
+.flexsearch-search .clear-button::before {
+  rotate: 45deg;
+}
+
+.flexsearch-search .clear-button::after {
+  rotate: -45deg;
+}
+
+.flexsearch-search kbd {
+  border: var(--plugin-flexsearch-kbd-border);
+  border-radius: var(--plugin-flexsearch-kbd-border-radius);
+  background: var(--plugin-flexsearch-kbd-bg);
+  color: var(--plugin-flexsearch-kbd-color);
+  font-size: var(--font-size-s);
+}
+
+.flexsearch-search a:hover {
+  color: var(--theme-color);
+}
+
+.flexsearch-search .results-panel:empty {
+  display: none;
+}
+
+.flexsearch-search:has(.results-panel:not(:empty)) ~ * {
+  display: none;
+}
+
+.flexsearch-search:where(:has(input:valid:focus), :has(.results-panel::empty))
+  ~ * {
+  opacity: 0.2;
+}
+
+.flexsearch-search .matching-post {
+  overflow: hidden;
+  padding: 1em 0 1.2em 0;
+  border-bottom: 1px solid var(--color-mono-2);
+}
+
+.flexsearch-search .matching-post:hover a {
+  text-decoration-color: transparent;
+}
+
+.flexsearch-search .matching-post:hover .title {
+  text-decoration: inherit;
+  text-decoration-color: var(--link-underline-color-hover);
+}
+
+.flexsearch-search .matching-post .title {
+  margin: 0 0 0.5em 0;
+  line-height: 1.4;
+}
+
+.flexsearch-search .matching-post .content {
+  margin: 0;
+  color: var(--color-mono-6);
+  font-size: var(--font-size-s);
+}
+
+.flexsearch-search .results-status {
+  margin-bottom: 0;
+  color: var(--color-mono-6);
+  font-size: var(--font-size-s);
+}
+
+.flexsearch-search .results-status:empty {
+  display: none;
+}
+
+/* Modal */
+/* ================================== */
+.flexsearch-modal {
+  position: fixed;
+  inset: 0;
+  display: none;
+  z-index: 9999;
+}
+
+.flexsearch-modal.is-open {
+  display: block;
+}
+
+.flexsearch-modal__backdrop {
+  position: absolute;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.35);
+}
+
+.flexsearch-modal__dialog {
+  position: relative;
+  margin: 8vh auto 0 auto;
+  max-width: min(720px, calc(100vw - 24px));
+  max-height: 80vh;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  background: var(--sidebar-background, var(--color-bg));
+  border: 1px solid var(--sidebar-border-color, var(--color-mono-2));
+  border-radius: 10px;
+  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.25);
+}
+
+.flexsearch-modal__dialog .flexsearch-search {
+  margin: 12px;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  flex: 1 1 auto;
+}
+
+.flexsearch-modal__dialog .flexsearch-search .results-panel {
+  overflow: auto;
+  min-height: 0;
+  flex: 1 1 auto;
+}
+
+/* Modal trigger (sidebar) */
+/* ================================== */
+.flexsearch-trigger {
+  margin: var(--plugin-flexsearch-margin);
+}
+
+.flexsearch-trigger .input-wrap {
+  position: relative;
+}
+
+.flexsearch-trigger input {
+  width: 100%;
+  padding-inline-end: 36px;
+  border: 1px solid var(--plugin-flexsearch-input-border-color);
+  border-radius: var(--plugin-flexsearch-input-border-radius);
+  background: var(--plugin-flexsearch-input-bg);
+  color: var(--plugin-flexsearch-input-color);
+  cursor: pointer;
+}
+
+.flexsearch-trigger .kbd-group {
+  visibility: hidden;
+  display: flex;
+  gap: 0.15em;
+  position: absolute;
+  right: 7px;
+  top: 50%;
+  opacity: 0;
+  translate: 0 -50%;
+  transition-property: opacity, visibility;
+  transition-duration: var(--duration-medium);
+}
+
+.flexsearch-trigger input:where(:focus, :hover) ~ .kbd-group,
+.flexsearch-trigger .kbd-group:hover {
+  visibility: visible;
+  opacity: 1;
+}
+
+.flexsearch-trigger kbd {
+  border: var(--plugin-flexsearch-kbd-border);
+  border-radius: var(--plugin-flexsearch-kbd-border-radius);
+  background: var(--plugin-flexsearch-kbd-bg);
+  color: var(--plugin-flexsearch-kbd-color);
+  font-size: var(--font-size-s);
+}

package/src/sidebar-collapse/index.js

@@ -0,0 +1,11 @@
+import sidebarCollapsePlugin from './sidebar-collapse-plugin'
+
+function install(...plugins) {
+  if (!window.$docsify) {
+    console.error('这是一个docsify插件，请先引用docsify库！')
+  } else {
+    $docsify.plugins = plugins.concat($docsify.plugins || [])
+  }
+}
+
+install(sidebarCollapsePlugin)

package/src/sidebar-collapse/sidebar-collapse-plugin.js

@@ -0,0 +1,251 @@
+import "./style.css";
+
+// 首次加载标记 - 控制层级仅首次展开
+let isFirstLoad = true;
+// 全局侧边栏折叠状态对象，持久化每个节点状态（键：href，值：open/collapse）
+const sidebarCollapseState = {};
+
+function sidebarCollapsePlugin(hook, vm) {
+  hook.doneEach(function (html, next) {
+    const activeNode = getActiveNode();
+    // 自动展开当前激活项的根层级（核心体验保留）
+    openActiveToRoot(activeNode);
+
+    addFolderFileClass();
+    // 仅首次加载执行层级类添加+初始展开
+    isFirstLoad && addLevelClass();
+    syncScrollTop(activeNode);
+
+    // doneEach最后恢复折叠状态，避免自动逻辑覆盖
+    restoreCollapseState(activeNode);
+
+    next(html);
+  });
+  hook.ready(function () {
+    // 1. 关键：hook.ready中先收集全量初始状态（DOM已完整，仅执行一次）
+    collectInitialCollapseState();
+    // 2. 再绑定点击事件，确保初始状态收集完成后再处理用户操作
+    document
+      .querySelector(".sidebar-nav")
+      .addEventListener("click", handleMenuClick);
+    setTimeout(() => {
+      const activeNode = getActiveNode();
+      restoreCollapseState(activeNode);
+    });
+  });
+}
+
+function init() {
+  document.addEventListener("scroll", scrollSyncMenuStatus);
+}
+
+let lastTop; // 侧边栏滚动状态
+function syncScrollTop(activeNode) {
+  if (activeNode && lastTop != undefined) {
+    const curTop = activeNode.getBoundingClientRect().top;
+    document.querySelector(".sidebar").scrollBy(0, curTop - lastTop);
+  }
+}
+
+function scrollSyncMenuStatus() {
+  requestAnimationFrame(() => {
+    let el = document.querySelector(".app-sub-sidebar > .active");
+    if (el) {
+      el.parentNode.parentNode
+        .querySelectorAll(".app-sub-sidebar")
+        .forEach((dom) => dom.classList.remove("open"));
+      while (el.parentNode.classList.contains("app-sub-sidebar")) {
+        if (el.parentNode.classList.contains("open")) {
+          break;
+        } else {
+          el.parentNode.classList.add("open");
+          el = el.parentNode;
+        }
+      }
+    }
+  });
+}
+
+function handleMenuClick(e) {
+  lastTop = e.target.getBoundingClientRect().top;
+  // 兼容点击<a>标签或父级LI的情况，找到实际的LI节点
+  const targetNode = e.target.tagName === "A" ? e.target.parentNode : e.target;
+  const newActiveNode = findTagParent(targetNode, "LI", 2);
+  if (!newActiveNode) return;
+  // 找到节点内的<a>标签，获取唯一标识href
+  const nodeHref = newActiveNode.querySelector("a")?.getAttribute("href");
+  if (!nodeHref) return;
+
+  if (newActiveNode.classList.contains("open")) {
+    // 手动折叠：移除open，添加collapse
+    newActiveNode.classList.remove("open");
+    setTimeout(() => {
+      newActiveNode.classList.add("collapse");
+    }, 0);
+    // 收集状态：折叠状态存入对象
+    sidebarCollapseState[nodeHref] = "collapse";
+  } else {
+    // 手动展开：先关闭其他激活项，再展开当前
+    removeOpenToRoot(getActiveNode());
+    openActiveToRoot(newActiveNode);
+    setTimeout(() => {
+      newActiveNode.classList.remove("collapse");
+    }, 0);
+    // 收集状态：展开状态存入对象
+    sidebarCollapseState[nodeHref] = "open";
+  }
+  syncScrollTop(newActiveNode);
+}
+
+function getActiveNode() {
+  let node = document.querySelector(".sidebar-nav .active");
+
+  if (!node) {
+    const curHref = decodeURIComponent(location.hash).replace(/ /gi, "%20");
+    const curLink = document.querySelector(`.sidebar-nav a[href="${curHref}"]`);
+    node = findTagParent(curLink, "LI", 2);
+    if (node) {
+      node.classList.add("active");
+      // 初始化激活项状态：默认展开
+      const nodeHref = node.querySelector("a")?.getAttribute("href");
+      nodeHref && (sidebarCollapseState[nodeHref] = "open");
+    }
+  }
+  return node;
+}
+
+function openActiveToRoot(node) {
+  if (node) {
+    node.classList.add("open", "active");
+    while (node && node.className !== "sidebar-nav" && node.parentNode) {
+      if (
+        node.parentNode.tagName === "LI" ||
+        node.parentNode.className === "app-sub-sidebar"
+      ) {
+        node.parentNode.classList.add("open");
+      }
+      node = node.parentNode;
+    }
+  }
+}
+
+function removeOpenToRoot(node) {
+  if (node) {
+    node.classList.remove("open", "active");
+    while (node && node.className !== "sidebar-nav" && node.parentNode) {
+      if (
+        node.parentNode.tagName === "LI" ||
+        node.parentNode.className === "app-sub-sidebar"
+      ) {
+        node.parentNode.classList.remove("open");
+      }
+      node = node.parentNode;
+    }
+  }
+}
+
+function findTagParent(curNode, tagName, level) {
+  if (curNode && curNode.tagName === tagName) return curNode;
+  let l = 0;
+  while (curNode) {
+    l++;
+    if (l > level) return;
+    if (curNode.parentNode.tagName === tagName) {
+      return curNode.parentNode;
+    }
+    curNode = curNode.parentNode;
+  }
+}
+
+function addFolderFileClass() {
+  document.querySelectorAll(".sidebar-nav li").forEach((li) => {
+    if (li.querySelector("ul:not(.app-sub-sidebar)")) {
+      li.classList.add("folder");
+    } else {
+      li.classList.add("file");
+    }
+  });
+}
+
+function addLevelClass() {
+  function find(root, level) {
+    root &&
+      root.childNodes &&
+      root.childNodes.forEach((child) => {
+        if (child.classList && child.classList.contains("folder")) {
+          child.classList.add(`level-${level}`);
+          // 优先读取专属配置，兼容原配置
+          const firstOpenLevel =
+            window.$docsify?.sidebarFirstOpenLevel ||
+            window.$docsify?.sidebarDisplayLevel;
+          if (
+            firstOpenLevel &&
+            typeof firstOpenLevel === "number" &&
+            level <= firstOpenLevel
+          ) {
+            child.classList.add("open");
+            // 初始化首次展开的节点状态：存入open
+            const nodeHref = child.querySelector("a")?.getAttribute("href");
+            nodeHref && (sidebarCollapseState[nodeHref] = "open");
+          }
+          if (child && child.childNodes.length > 1) {
+            find(child.childNodes[1], level + 1);
+          }
+        }
+      });
+  }
+  find(document.querySelector(".sidebar-nav > ul"), 1);
+  // 首次执行后关闭标记
+  isFirstLoad = false;
+}
+
+function restoreCollapseState(activeNode) {
+  // 获取激活节点的href（用于排除，不覆盖其状态）
+  const activeHref = activeNode?.querySelector("a")?.getAttribute("href");
+  // 遍历所有菜单节点，根据状态对象恢复
+  document
+    .querySelectorAll(".sidebar-nav li.folder, .sidebar-nav li.file")
+    .forEach((li) => {
+      const nodeHref = li.querySelector("a")?.getAttribute("href");
+      // 容错：无href的节点不处理，排除激活项
+      if (!nodeHref || nodeHref === activeHref) return;
+      // 从状态对象获取保存的状态
+      const saveState = sidebarCollapseState[nodeHref];
+      if (saveState) {
+        // 恢复状态：移除相反类名，添加保存的类名
+        li.classList.remove(saveState === "open" ? "collapse" : "open");
+        li.classList.add(saveState);
+      }
+    });
+}
+
+// 2. 新增：hook.ready专用 - 收集侧边栏全量初始状态函数（仅执行一次）
+function collectInitialCollapseState() {
+  // 遍历所有侧边栏可交互节点（folder/file，此时addFolderFileClass已执行，类名存在）
+  const allSidebarNodes = document.querySelectorAll(
+    ".sidebar-nav li.folder, .sidebar-nav li.file",
+  );
+  allSidebarNodes.forEach((li) => {
+    // 获取节点唯一标识：a标签的href（容错，无a/href则跳过）
+    const aTag = li.querySelector("a");
+    const nodeHref = aTag?.getAttribute("href");
+    if (!nodeHref) return;
+
+    // 核心：根据DOM真实类名判断初始状态，与实际展示严格一致
+    let initialState = "collapse"; // 默认折叠（Docsify原生默认行为）
+    if (li.classList.contains("open")) {
+      initialState = "open"; // 有open类=展开状态
+    } else if (li.classList.contains("collapse")) {
+      initialState = "collapse"; // 有collapse类=折叠状态
+    }
+
+    // 将真实初始状态存入全局状态对象，完成初始化
+    sidebarCollapseState[nodeHref] = initialState;
+  });
+  // 可选：调试用，查看收集的初始状态（开发完成后可删除）
+  console.log("侧边栏初始状态收集完成：", sidebarCollapseState);
+}
+
+init();
+
+export default sidebarCollapsePlugin;