@sugarat/theme 0.1.28 → 0.1.29

package/node.d.ts

@@ -1,5 +1,6 @@
 import { DefaultTheme, UserConfig } from 'vitepress';
 import { ElButton } from 'element-plus';
+export { tabsMarkdownPlugin } from 'vitepress-plugin-tabs';
 
 declare namespace BlogPopover {
     interface Title {
@@ -180,6 +181,11 @@ declare namespace Theme {
         popover?: Popover;
         friend?: FriendLink[];
         authorList?: Omit<FriendLink, 'avatar'>[];
+        /**
+         * 启用 [vitepress-plugin-tabs](https://www.npmjs.com/package/vitepress-plugin-tabs)
+         * @default false
+         */
+        tabs: boolean;
     }
     interface Config extends DefaultTheme.Config {
         blog?: BlogConfig;

package/node.js

@@ -31,7 +31,8 @@ __export(node_exports, {
   getDefaultTitle: () => getDefaultTitle,
   getFileBirthTime: () => getFileBirthTime,
   getGitTimestamp: () => getGitTimestamp,
-  getThemeConfig: () => getThemeConfig
+  getThemeConfig: () => getThemeConfig,
+  tabsMarkdownPlugin: () => tabsPlugin
 });
 module.exports = __toCommonJS(node_exports);
 var import_fast_glob = __toESM(require("fast-glob"));
@@ -40,6 +41,170 @@ var import_fs = __toESM(require("fs"));
 var import_child_process = require("child_process");
 var import_path = __toESM(require("path"));
 
+// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.2.0_vitepress@1.0.0-alpha.75_vue@3.2.45/node_modules/vitepress-plugin-tabs/dist/index.js
+var tabsMarker = "=tabs";
+var tabsMarkerLen = tabsMarker.length;
+var ruleBlockTabs = (state, startLine, endLine, silent) => {
+  if (state.sCount[startLine] - state.blkIndent >= 4) {
+    return false;
+  }
+  let pos = state.bMarks[startLine] + state.tShift[startLine];
+  let max = state.eMarks[startLine];
+  if (pos + 3 > max) {
+    return false;
+  }
+  const marker = state.src.charCodeAt(pos);
+  if (marker !== 58) {
+    return false;
+  }
+  const mem = pos;
+  pos = state.skipChars(pos, marker);
+  let len = pos - mem;
+  if (len < 3) {
+    return false;
+  }
+  if (state.src.slice(pos, pos + tabsMarkerLen) !== tabsMarker) {
+    return false;
+  }
+  pos += tabsMarkerLen;
+  if (silent) {
+    return true;
+  }
+  const markup = state.src.slice(mem, pos);
+  const params = state.src.slice(pos, max);
+  let nextLine = startLine;
+  let haveEndMarker = false;
+  for (; ; ) {
+    nextLine++;
+    if (nextLine >= endLine) {
+      break;
+    }
+    pos = state.bMarks[nextLine] + state.tShift[nextLine];
+    const mem2 = pos;
+    max = state.eMarks[nextLine];
+    if (pos < max && state.sCount[nextLine] < state.blkIndent) {
+      break;
+    }
+    if (state.src.charCodeAt(pos) !== marker) {
+      continue;
+    }
+    if (state.sCount[nextLine] - state.blkIndent >= 4) {
+      continue;
+    }
+    pos = state.skipChars(pos, marker);
+    if (pos - mem2 < len) {
+      continue;
+    }
+    pos = state.skipSpaces(pos);
+    if (pos < max) {
+      continue;
+    }
+    haveEndMarker = true;
+    break;
+  }
+  len = state.sCount[startLine];
+  state.line = nextLine + (haveEndMarker ? 1 : 0);
+  const token = state.push("tabs", "div", 0);
+  token.info = params;
+  token.content = state.getLines(startLine + 1, nextLine, len, true);
+  token.markup = markup;
+  token.map = [startLine, state.line];
+  return true;
+};
+var tabBreakRE = /^\s*::(.+)$/;
+var forbiddenCharsInSlotNames = /[ '"]/;
+var parseTabBreakLine = (line) => {
+  const m = line.match(tabBreakRE);
+  if (!m)
+    return null;
+  const trimmed = m[1].trim();
+  if (forbiddenCharsInSlotNames.test(trimmed)) {
+    throw new Error(
+      `contains forbidden chars in slot names (space and quotes) (${JSON.stringify(
+        line
+      )})`
+    );
+  }
+  return trimmed;
+};
+var lastLineBreakRE = /\n$/;
+var parseTabsContent = (content) => {
+  const lines = content.replace(lastLineBreakRE, "").split("\n");
+  const tabInfos = [];
+  const tabLabels = /* @__PURE__ */ new Set();
+  let currentTab = null;
+  const createTabInfo = (label) => {
+    if (tabLabels.has(label)) {
+      throw new Error(`a tab labelled ${JSON.stringify(label)} already exists`);
+    }
+    const newTab = { label, content: [] };
+    tabInfos.push(newTab);
+    tabLabels.add(label);
+    return newTab;
+  };
+  for (const line of lines) {
+    const tabLabel = parseTabBreakLine(line);
+    if (currentTab === null) {
+      if (tabLabel === null) {
+        throw new Error(
+          `tabs should start with \`::\${tabLabel}\` (e.g. "::foo"). (received: ${JSON.stringify(
+            line
+          )})`
+        );
+      }
+      currentTab = createTabInfo(tabLabel);
+      continue;
+    }
+    if (tabLabel === null) {
+      currentTab.content.push(line);
+    } else {
+      currentTab = createTabInfo(tabLabel);
+    }
+  }
+  if (tabInfos.length < 0) {
+    throw new Error("tabs should include at least one tab");
+  }
+  return tabInfos.map((info) => ({
+    label: info.label,
+    content: info.content.join("\n").replace(lastLineBreakRE, "")
+  }));
+};
+var parseParams = (input) => {
+  if (!input.startsWith("=")) {
+    return {
+      shareStateKey: void 0
+    };
+  }
+  const splitted = input.split("=");
+  return {
+    shareStateKey: splitted[1]
+  };
+};
+var tabsPlugin = (md) => {
+  md.block.ruler.before("fence", "=tabs", ruleBlockTabs, {
+    alt: ["paragraph", "reference", "blockquote", "list"]
+  });
+  md.renderer.rules.tabs = (tokens, index, _options, env) => {
+    const token = tokens[index];
+    const tabs = parseTabsContent(token.content);
+    const renderedTabs = tabs.map((tab) => ({
+      label: tab.label,
+      content: md.render(tab.content, env)
+    }));
+    const params = parseParams(token.info);
+    const tabLabelsProp = `:tabLabels="${md.utils.escapeHtml(
+      JSON.stringify(tabs.map((tab) => tab.label))
+    )}"`;
+    const shareStateKeyProp = params.shareStateKey ? `sharedStateKey="${md.utils.escapeHtml(params.shareStateKey)}"` : "";
+    const slots = renderedTabs.map(
+      (tab) => `<template #${tab.label}>${tab.content}</template>`
+    );
+    return `<PluginTabs ${tabLabelsProp} ${shareStateKeyProp}>${slots.join(
+      ""
+    )}</PluginTabs>`;
+  };
+};
+
 // src/utils/index.ts
 function formatDate(d, fmt = "yyyy-MM-dd hh:mm:ss") {
   if (!(d instanceof Date)) {
@@ -174,6 +339,13 @@ function getThemeConfig(cfg) {
       ]
     };
   }
+  if (cfg?.tabs) {
+    extraConfig.markdown = {
+      config(md) {
+        tabsPlugin(md);
+      }
+    };
+  }
   return {
     themeConfig: {
       blog: {
@@ -195,7 +367,7 @@ function getThemeConfig(cfg) {
 function getDefaultTitle(content) {
   const title = clearMatterContent(content).split("\n")?.find((str) => {
     return str.startsWith("# ");
-  })?.slice(2).replace(/[\s]/g, "") || "";
+  })?.slice(2).replace(/^\s+|\s+$/g, "") || "";
   return title;
 }
 function clearMatterContent(content) {
@@ -266,5 +438,6 @@ function defineConfig(config) {
   getDefaultTitle,
   getFileBirthTime,
   getGitTimestamp,
-  getThemeConfig
+  getThemeConfig,
+  tabsMarkdownPlugin
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sugarat/theme",
-  "version": "0.1.28",
+  "version": "0.1.29",
   "description": "简约风的 Vitepress 博客主题，sugarat vitepress blog theme",
   "main": "src/index.ts",
   "exports": {
@@ -47,7 +47,8 @@
     "tsup": " ^6.5.0",
     "typescript": "^4.8.2",
     "vitepress": "1.0.0-alpha.75",
-    "vue": "^3.2.45"
+    "vue": "^3.2.45",
+    "vitepress-plugin-tabs": "^0.2.0"
   },
   "scripts": {
     "dev": "npm run build:node && npm run dev:docs",

package/src/composables/config/index.ts

@@ -196,6 +196,11 @@ export namespace Theme {
     popover?: Popover
     friend?: FriendLink[]
     authorList?: Omit<FriendLink, 'avatar'>[]
+    /**
+     * 启用 [vitepress-plugin-tabs](https://www.npmjs.com/package/vitepress-plugin-tabs)
+     * @default false
+     */
+    tabs: boolean
   }
 
   export interface Config extends DefaultTheme.Config {

package/src/node.ts

@@ -5,6 +5,7 @@ import fs from 'fs'
 import { execSync, spawn, spawnSync } from 'child_process'
 import path from 'path'
 import type { SiteConfig, UserConfig } from 'vitepress'
+import { tabsMarkdownPlugin } from 'vitepress-plugin-tabs'
 import { formatDate } from './utils/index'
 import type { Theme } from './composables/config/index'
 
@@ -161,6 +162,13 @@ export function getThemeConfig(cfg?: Partial<Theme.BlogConfig>) {
       ]
     }
   }
+  if (cfg?.tabs) {
+    extraConfig.markdown = {
+      config(md: any) {
+        tabsMarkdownPlugin(md)
+      }
+    }
+  }
   return {
     themeConfig: {
       blog: {
@@ -190,7 +198,7 @@ export function getDefaultTitle(content: string) {
         return str.startsWith('# ')
       })
       ?.slice(2)
-      .replace(/[\s]/g, '') || ''
+      .replace(/^\s+|\s+$/g, '') || ''
   return title
 }
 
@@ -295,3 +303,5 @@ export function defineConfig(config: UserConfig<Theme.Config>) {
   }
   return config
 }
+
+export { tabsMarkdownPlugin } from 'vitepress-plugin-tabs'