valaxy 0.0.2 → 0.0.7

package/src/node/markdown/markdown-it-katex.ts

@@ -0,0 +1,200 @@
+// copy from https://github.com/slidevjs/slidev/blob/main/packages/slidev/node/plugins/markdown-it-katex.ts
+// Ported from https://github.com/waylonflinn/markdown-it-katex
+
+/* Process inline math */
+/*
+Like markdown-it-simplemath, this is a stripped down, simplified version of:
+https://github.com/runarberg/markdown-it-math
+
+It differs in that it takes (a subset of) LaTeX as input and relies on KaTeX
+for rendering output.
+*/
+
+import type { KatexOptions } from 'katex'
+import katex from 'katex'
+
+// Test if potential opening or closing delimieter
+// Assumes that there is a "$" at state.src[pos]
+function isValidDelim(state: any, pos: number) {
+  const max = state.posMax
+  let can_open = true
+  let can_close = true
+
+  const prevChar = pos > 0 ? state.src.charCodeAt(pos - 1) : -1
+  const nextChar = pos + 1 <= max ? state.src.charCodeAt(pos + 1) : -1
+
+  // Check non-whitespace conditions for opening and closing, and
+  // check that closing delimeter isn't followed by a number
+  if (prevChar === 0x20/* " " */ || prevChar === 0x09
+            ||/* \t */ (nextChar >= 0x30/* "0" */ && nextChar <= 0x39/* "9" */))
+    can_close = false
+
+  if (nextChar === 0x20/* " " */ || nextChar === 0x09/* \t */)
+    can_open = false
+
+  return {
+    can_open,
+    can_close,
+  }
+}
+
+function math_inline(state: any, silent: boolean) {
+  let match, token, res, pos
+
+  if (state.src[state.pos] !== '$') return false
+
+  res = isValidDelim(state, state.pos)
+  if (!res.can_open) {
+    if (!silent) state.pending += '$'
+    state.pos += 1
+    return true
+  }
+
+  // First check for and bypass all properly escaped delimieters
+  // This loop will assume that the first leading backtick can not
+  // be the first character in state.src, which is known since
+  // we have found an opening delimieter already.
+  const start = state.pos + 1
+  match = start
+  // eslint-disable-next-line no-cond-assign
+  while ((match = state.src.indexOf('$', match)) !== -1) {
+    // Found potential $, look for escapes, pos will point to
+    // first non escape when complete
+    pos = match - 1
+    while (state.src[pos] === '\\') pos -= 1
+
+    // Even number of escapes, potential closing delimiter found
+    if (((match - pos) % 2) === 1) break
+    match += 1
+  }
+
+  // No closing delimter found.  Consume $ and continue.
+  if (match === -1) {
+    if (!silent) state.pending += '$'
+    state.pos = start
+    return true
+  }
+
+  // Check if we have empty content, ie: $$.  Do not parse.
+  if (match - start === 0) {
+    if (!silent) state.pending += '$$'
+    state.pos = start + 1
+    return true
+  }
+
+  // Check for valid closing delimiter
+  res = isValidDelim(state, match)
+  if (!res.can_close) {
+    if (!silent) state.pending += '$'
+    state.pos = start
+    return true
+  }
+
+  if (!silent) {
+    token = state.push('math_inline', 'math', 0)
+    token.markup = '$'
+    token.content = state.src.slice(start, match)
+  }
+
+  state.pos = match + 1
+  return true
+}
+
+function math_block(state: any, start: number, end: number, silent: boolean) {
+  let firstLine; let lastLine; let next; let lastPos
+  let found = false
+  let pos = state.bMarks[start] + state.tShift[start]
+  let max = state.eMarks[start]
+
+  if (pos + 2 > max) return false
+  if (state.src.slice(pos, pos + 2) !== '$$') return false
+
+  pos += 2
+  firstLine = state.src.slice(pos, max)
+
+  if (silent) return true
+  if (firstLine.trim().slice(-2) === '$$') {
+    // Single line expression
+    firstLine = firstLine.trim().slice(0, -2)
+    found = true
+  }
+
+  for (next = start; !found;) {
+    next++
+
+    if (next >= end) break
+
+    pos = state.bMarks[next] + state.tShift[next]
+    max = state.eMarks[next]
+
+    if (pos < max && state.tShift[next] < state.blkIndent) {
+      // non-empty line with negative indent should stop the list:
+      break
+    }
+
+    if (state.src.slice(pos, max).trim().slice(-2) === '$$') {
+      lastPos = state.src.slice(0, max).lastIndexOf('$$')
+      lastLine = state.src.slice(pos, lastPos)
+      found = true
+    }
+  }
+
+  state.line = next + 1
+
+  const token = state.push('math_block', 'math', 0)
+  token.block = true
+  token.content = (firstLine && firstLine.trim() ? `${firstLine}\n` : '')
+    + state.getLines(start + 1, next, state.tShift[start], true)
+    + (lastLine && lastLine.trim() ? lastLine : '')
+  token.map = [start, state.line]
+  token.markup = '$$'
+  return true
+}
+
+export default function math_plugin(md: any, options: KatexOptions) {
+  // Default options
+
+  options = options || {}
+
+  // set KaTeX as the renderer for markdown-it-simplemath
+  const katexInline = function(latex: string) {
+    options.displayMode = false
+    try {
+      return katex.renderToString(latex, options)
+    }
+    catch (error) {
+      if (options.throwOnError)
+        // eslint-disable-next-line no-console
+        console.warn(error)
+      return latex
+    }
+  }
+
+  const inlineRenderer = function(tokens: any, idx: number) {
+    return katexInline(tokens[idx].content)
+  }
+
+  const katexBlock = function(latex: string) {
+    options.displayMode = true
+    try {
+      return `<p>${katex.renderToString(latex, options)}</p>`
+    }
+    catch (error) {
+      if (options.throwOnError)
+        // eslint-disable-next-line no-console
+        console.warn(error)
+      return latex
+    }
+  }
+
+  const blockRenderer = function(tokens: any, idx: number) {
+    return `${katexBlock(tokens[idx].content)}\n`
+  }
+
+  md.inline.ruler.after('escape', 'math_inline', math_inline)
+  md.block.ruler.after('blockquote', 'math_block', math_block, {
+    alt: ['paragraph', 'reference', 'blockquote', 'list'],
+  })
+  md.renderer.rules.math_inline = inlineRenderer
+  md.renderer.rules.math_block = blockRenderer
+}

package/src/node/markdown/parseHeader.ts

@@ -0,0 +1,70 @@
+// ref vitepress
+
+// Since VuePress needs to extract the header from the markdown source
+// file and display it in the sidebar or title (#238), this file simply
+// removes some unnecessary elements to make header displays well at
+// sidebar or title.
+//
+// But header's parsing in the markdown content is done by the markdown
+// loader based on markdown-it. markdown-it parser will will always keep
+// HTML in headers, so in VuePress, after being parsed by the markdown
+// loader, the raw HTML in headers will finally be parsed by Vue-loader.
+// so that we can write HTML/Vue in the header. One exception is the HTML
+// wrapped by <code>(markdown token: '`') tag.
+import emojiData from 'markdown-it-emoji/lib/data/full.json'
+
+const parseEmojis = (str: string) => {
+  return str.replace(
+    /:(.+?):/g,
+    (placeholder, key) => (emojiData as any)[key] || placeholder,
+  )
+}
+
+const unescapeHtml = (html: string) =>
+  html
+    .replace(/&quot;/g, '"')
+    .replace(/&#39;/g, '\'')
+    .replace(/&#x3A;/g, ':')
+    .replace(/&lt;/g, '<')
+    .replace(/&gt;/g, '>')
+
+const removeMarkdownTokens = (str: string) =>
+  str
+    .replace(/(\[(.[^\]]+)\]\((.[^)]+)\))/g, '$2') // []()
+    .replace(/(`|\*{1,3}|_)(.*?[^\\])\1/g, '$2') // `{t}` | *{t}* | **{t}** | ***{t}*** | _{t}_
+    .replace(/(\\)(\*|_|`|\!|<|\$)/g, '$2') // remove escape char '\'
+
+const remvoeCustomAnchor = (str: string) =>
+  str.replace(/\{#([a-z0-9\-_]+?)\}\s*$/, '') // {#custom-header}
+
+const trim = (str: string) => str.trim()
+
+// This method remove the raw HTML but reserve the HTML wrapped by `<code>`.
+// e.g.
+// Input: "<a> b",   Output: "b"
+// Input: "`<a>` b", Output: "`<a>` b"
+export const removeNonCodeWrappedHTML = (str: string) => {
+  return String(str).replace(/(^|[^><`\\])<.*>([^><`]|$)/g, '$1$2')
+}
+
+const compose = (...processors: ((str: string) => string)[]) => {
+  if (processors.length === 0) return (input: string) => input
+  if (processors.length === 1) return processors[0]
+  return processors.reduce((prev, next) => {
+    return str => next(prev(str))
+  })
+}
+
+// Unescape html, parse emojis and remove some md tokens.
+export const parseHeader = compose(
+  unescapeHtml,
+  parseEmojis,
+  remvoeCustomAnchor,
+  removeMarkdownTokens,
+  trim,
+)
+
+// Also clean the html that isn't wrapped by code.
+// Because we want to support using VUE components in headers.
+// e.g. https://vuepress.vuejs.org/guide/using-vue.html#badge
+export const deeplyParseHeader = compose(removeNonCodeWrappedHTML, parseHeader)

package/src/node/markdown/slugify.ts

@@ -0,0 +1,24 @@
+// ref vitepress
+import { remove as removeDiacritics } from 'diacritics'
+// eslint-disable-next-line no-control-regex
+const rControl = /[\u0000-\u001F]/g
+// add '…'
+const rSpecial = /[\s~`!@#$%^&*()\-_+=[\]{}|\\;:"'<>,.…?/]+/g
+
+export const slugify = (str: string): string => {
+  return (
+    removeDiacritics(str)
+      // Remove control characters
+      .replace(rControl, '')
+      // Replace special characters
+      .replace(rSpecial, '-')
+      // Remove continuous separators
+      .replace(/\-{2,}/g, '-')
+      // Remove prefixing and trailing separators
+      .replace(/^\-+|\-+$/g, '')
+      // ensure it doesn't start with a number (#121)
+      .replace(/^(\d)/, '_$1')
+      // lowercase
+      .toLowerCase()
+  )
+}

package/src/node/options.ts

@@ -0,0 +1,90 @@
+import { dirname, resolve } from 'path'
+import _debug from 'debug'
+import type { ValaxyConfig } from '../types'
+import { resolveConfig } from './config'
+import { resolveImportPath } from './utils'
+
+const debug = _debug('valaxy:options')
+
+// for cli entry
+export interface ValaxyEntryOptions {
+  /**
+   * theme name
+   */
+  theme?: string
+  userRoot?: string
+}
+
+export interface ResolvedValaxyOptions {
+  /**
+   * Client root path
+   * @default 'valaxy/src/client'
+   */
+  clientRoot: string
+  /**
+   * User root path
+   * @default process.cwd()
+   */
+  userRoot: string
+  /**
+   * Theme root path
+   */
+  themeRoot: string
+  /**
+   * Theme name
+   */
+  theme: string
+  /**
+   * Valaxy Config
+   */
+  config: ValaxyConfig
+  /**
+   * config file path
+   */
+  configFile: string
+}
+
+export interface ValaxyServerOptions {
+  onConfigReload?: (newConfig: ValaxyConfig, config: ValaxyConfig) => void
+}
+
+export function isPath(name: string) {
+  return name.startsWith('/') || /^\.\.?[\/\\]/.test(name)
+}
+
+/**
+ * get theme roots
+ * @param name
+ * @param entry
+ * @returns
+ */
+export function getThemeRoot(name: string, entry: string) {
+  if (!name)
+    return ''
+
+  if (isPath(name))
+    return resolve(dirname(entry), name)
+  else
+    return resolveImportPath(`valaxy-theme-${name}/package.json`)
+}
+
+// for cli options
+export async function resolveOptions(options: ValaxyEntryOptions) {
+  const clientRoot = resolve(resolveImportPath('valaxy/package.json'), 'src/client')
+  const userRoot = resolve(options.userRoot || process.cwd())
+
+  const { config: valaxyConfig, configFile, theme } = await resolveConfig(options)
+  const themeRoot = getThemeRoot(theme, userRoot)
+
+  const valaxyOptions: ResolvedValaxyOptions = {
+    clientRoot,
+    userRoot,
+    themeRoot,
+    theme,
+    config: valaxyConfig,
+    configFile: configFile || '',
+  }
+  debug(valaxyOptions)
+
+  return valaxyOptions
+}

package/src/node/plugins/extendConfig.ts

@@ -0,0 +1,28 @@
+import { resolve } from 'path'
+import type { InlineConfig, Plugin } from 'vite'
+import { mergeConfig } from 'vite'
+import type { ResolvedValaxyOptions } from '../options'
+import { toAtFS } from '../utils'
+
+export function createConfigPlugin(options: ResolvedValaxyOptions): Plugin {
+  return {
+    name: 'valaxy:config',
+    config(config) {
+      const injection: InlineConfig = {
+        resolve: {
+          alias: {
+            '@/': `${toAtFS(options.userRoot)}/`,
+            '~/': `${toAtFS(options.clientRoot)}/`,
+            '@valaxyjs/client': `${toAtFS(options.clientRoot)}/`,
+            '@valaxyjs/config': '/@valaxyjs/config',
+            'valaxy/package.json': toAtFS(resolve(options.clientRoot, '../../package.json')),
+            'valaxy': toAtFS(resolve(options.clientRoot, '..')),
+            '@valaxyjs/core': toAtFS(resolve(options.clientRoot, '../core')),
+            [`valaxy-theme-${options.theme}`]: `${toAtFS(resolve(options.themeRoot))}/`,
+          },
+        },
+      }
+      return mergeConfig(config, injection)
+    },
+  }
+}

package/src/node/plugins/index.ts

@@ -0,0 +1,91 @@
+import fs from 'fs'
+
+import { join } from 'path'
+import type { Plugin } from 'vite'
+// import consola from 'consola'
+import { resolveConfig } from '../config'
+import type { ResolvedValaxyOptions, ValaxyServerOptions } from '../options'
+import { toAtFS } from '../utils'
+import { VALAXY_CONFIG_ID } from './valaxy'
+
+export function createValaxyPlugin(options: ResolvedValaxyOptions, serverOptions: ValaxyServerOptions = {}): Plugin {
+  const valaxyPrefix = '/@valaxy'
+
+  let valaxyConfig = options.config
+
+  const roots = [options.userRoot, options.themeRoot]
+
+  function generateUserStyles() {
+    const imports: string[] = []
+
+    for (const root of roots) {
+      const styles = [
+        join(root, 'styles', 'vars.scss'),
+        join(root, 'styles', 'index.css'),
+        join(root, 'styles', 'index.scss'),
+      ]
+
+      for (const style of styles) {
+        if (fs.existsSync(style)) {
+          imports.push(`import "${toAtFS(style)}"`)
+          continue
+        }
+      }
+    }
+
+    return imports.join('\n')
+  }
+
+  return {
+    name: 'Valaxy',
+
+    configureServer(server) {
+      server.watcher.add([
+        options.configFile,
+        options.userRoot,
+        options.themeRoot,
+      ])
+    },
+
+    resolveId(id) {
+      if (id.startsWith(valaxyPrefix))
+        return id
+      return null
+    },
+
+    load(id) {
+      if (id === `/${VALAXY_CONFIG_ID}`)
+        // stringify twice for \"
+        return `export default ${JSON.stringify(JSON.stringify(valaxyConfig))}`
+
+      // generate styles
+      if (id === '/@valaxyjs/styles')
+        return generateUserStyles()
+
+      if (id.startsWith(valaxyPrefix))
+        return ''
+    },
+
+    async handleHotUpdate(ctx) {
+      // handle valaxy.config.ts hmr
+      const { file, server } = ctx
+      if (file !== options.configFile) return
+
+      const { config } = await resolveConfig()
+
+      serverOptions.onConfigReload?.(config, options.config)
+      Object.assign(options.config, config)
+
+      // if (config.base !== options.config.base)
+      //   consola.warn('[valaxy]: config.base has changed. Please restart the dev server.')
+      valaxyConfig = config
+
+      const moduleIds = [`/${VALAXY_CONFIG_ID}`]
+      const moduleEntries = [
+        ...Array.from(moduleIds).map(id => server.moduleGraph.getModuleById(id)),
+      ].filter(<T>(item: T): item is NonNullable<T> => !!item)
+
+      return moduleEntries
+    },
+  }
+}

package/src/node/plugins/markdown.ts

@@ -0,0 +1,62 @@
+import path from 'path'
+import Markdown from 'vite-plugin-md'
+
+import type { Plugin } from 'vite'
+import type { ResolvedValaxyOptions } from '../options'
+
+import type { MarkdownRenderer } from '../markdown'
+import { setupMarkdownPlugins } from '../markdown'
+import { slash } from '../utils'
+// import { useRoute } from 'vue-router'
+
+export type ViteMdOptions = Parameters<typeof Markdown>[0]
+
+export const excerpt_separator = '<!-- more -->'
+
+// https://github.com/antfu/vite-plugin-md
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export function createMarkdownPlugin(options: ResolvedValaxyOptions): Plugin[] {
+  let _md: MarkdownRenderer
+
+  const mdOptions = options.config.markdownIt
+
+  const defaultOptions: ViteMdOptions = {
+    wrapperComponent: 'ValaxyMd',
+
+    headEnabled: true,
+    frontmatter: true,
+
+    excerpt: excerpt_separator,
+
+    builders: [
+      // avoid conflict with markdown-it-anchor link
+      // link(),
+      // seems bug, override frontmatter
+      // meta(),
+    ],
+
+    markdownItSetup(md) {
+      if (mdOptions.config)
+        mdOptions.config(md)
+
+      _md = setupMarkdownPlugins(md, mdOptions)
+    },
+  }
+  return [Markdown(Object.assign(defaultOptions, options.config.markdown)), {
+    name: 'valaxy:md',
+    handleHotUpdate(ctx) {
+      const { file, server } = ctx
+      // send headers
+      if (file.endsWith('.md')) {
+        server.ws.send({
+          type: 'custom',
+          event: 'valaxy:pageHeaders',
+          data: {
+            path: `/${slash(path.relative(`${options.userRoot}/pages`, file))}`,
+            pageHeaders: _md.__data.headers,
+          },
+        })
+      }
+    },
+  }]
+}