refactor: split modules

slidevjs · Jul 25, 2021 · 1afc85e · 1afc85e
1 parent 037318f
commit 1afc85e
Show file tree

Hide file tree

Showing 5 changed files with 212 additions and 205 deletions.
diff --git a/packages/parser/src/config.ts b/packages/parser/src/config.ts
@@ -0,0 +1,53 @@
+import { ResolvedFontOptions, SlidevConfig, SlidevThemeMeta } from '@slidev/types'
+import { parseAspectRatio } from './utils'
+import { resolveFonts } from './core'
+
+export function resolveConfig(headmatter: any, themeMeta: SlidevThemeMeta = {}) {
+  const themeHightlighter = ['prism', 'shiki'].includes(themeMeta.highlighter || '') ? themeMeta.highlighter as 'prism' | 'shiki' : undefined
+  const themeColorSchema = ['light', 'dark'].includes(themeMeta.colorSchema || '') ? themeMeta.colorSchema as 'light' | 'dark' : undefined
+
+  const defaultConfig: SlidevConfig = {
+    theme: 'default',
+    title: 'Slidev',
+    titleTemplate: '%s - Slidev',
+    remoteAssets: true,
+    monaco: 'dev',
+    download: false,
+    info: false,
+    highlighter: themeHightlighter || 'prism',
+    lineNumbers: false,
+    colorSchema: themeColorSchema || 'auto',
+    routerMode: 'history',
+    aspectRatio: 16 / 9,
+    canvasWidth: 980,
+    selectable: false,
+    themeConfig: {},
+    fonts: {} as ResolvedFontOptions,
+  }
+  const config: SlidevConfig = {
+    ...defaultConfig,
+    ...themeMeta.defaults,
+    ...headmatter.config,
+    ...headmatter,
+    fonts: resolveFonts({
+      ...themeMeta.defaults?.fonts,
+      ...headmatter.config?.fonts,
+      ...headmatter?.fonts,
+    }),
+  }
+
+  if (config.colorSchema !== 'dark' && config.colorSchema !== 'light')
+    config.colorSchema = 'auto'
+  if (themeColorSchema && config.colorSchema === 'auto')
+    config.colorSchema = themeColorSchema
+  config.aspectRatio = parseAspectRatio(config.aspectRatio)
+
+  if (themeColorSchema && config.colorSchema !== themeColorSchema)
+    // eslint-disable-next-line no-console
+    console.warn(`[slidev] Color schema "${config.colorSchema}" does not supported by the theme`)
+  if (themeHightlighter && config.highlighter !== themeHightlighter)
+    // eslint-disable-next-line no-console
+    console.warn(`[slidev] Syntax highlighter "${config.highlighter}" does not supported by the theme`)
+
+  return config
+}
diff --git a/packages/parser/src/core.ts b/packages/parser/src/core.ts
@@ -1,7 +1,7 @@
 import YAML from 'js-yaml'
 import { isObject, isTruthy, objectMap, toArray, uniq } from '@antfu/utils'
-import { FontOptions, ResolvedFontOptions, SlideInfo, SlideInfoBase, SlidevConfig, SlidevFeatureFlags, SlidevMarkdown, SlidevThemeMeta } from '@slidev/types'
-import { parseAspectRatio } from './utils'
+import { FontOptions, ResolvedFontOptions, SlideInfo, SlideInfoBase, SlidevFeatureFlags, SlidevMarkdown, SlidevThemeMeta } from '@slidev/types'
+import { resolveConfig } from './config'
 
 export function stringify(data: SlidevMarkdown) {
   return `${
@@ -152,7 +152,7 @@ export function parse(
   }
 }
 
-function resolveFonts(fonts: FontOptions = {}): ResolvedFontOptions {
+export function resolveFonts(fonts: FontOptions = {}): ResolvedFontOptions {
   const {
     fallbacks = true,
     italic = false,
@@ -231,56 +231,6 @@ function resolveFonts(fonts: FontOptions = {}): ResolvedFontOptions {
   }
 }
 
-export function resolveConfig(headmatter: any, themeMeta: SlidevThemeMeta = {}) {
-  const themeHightlighter = ['prism', 'shiki'].includes(themeMeta.highlighter || '') ? themeMeta.highlighter as 'prism' | 'shiki' : undefined
-  const themeColorSchema = ['light', 'dark'].includes(themeMeta.colorSchema || '') ? themeMeta.colorSchema as 'light' | 'dark' : undefined
-
-  const defaultConfig: SlidevConfig = {
-    theme: 'default',
-    title: 'Slidev',
-    titleTemplate: '%s - Slidev',
-    remoteAssets: true,
-    monaco: 'dev',
-    download: false,
-    info: false,
-    highlighter: themeHightlighter || 'prism',
-    lineNumbers: false,
-    colorSchema: themeColorSchema || 'auto',
-    routerMode: 'history',
-    aspectRatio: 16 / 9,
-    canvasWidth: 980,
-    selectable: false,
-    themeConfig: {},
-    fonts: {} as ResolvedFontOptions,
-  }
-  const config: SlidevConfig = {
-    ...defaultConfig,
-    ...themeMeta.defaults,
-    ...headmatter.config,
-    ...headmatter,
-    fonts: resolveFonts({
-      ...themeMeta.defaults?.fonts,
-      ...headmatter.config?.fonts,
-      ...headmatter?.fonts,
-    }),
-  }
-
-  if (config.colorSchema !== 'dark' && config.colorSchema !== 'light')
-    config.colorSchema = 'auto'
-  if (themeColorSchema && config.colorSchema === 'auto')
-    config.colorSchema = themeColorSchema
-  config.aspectRatio = parseAspectRatio(config.aspectRatio)
-
-  if (themeColorSchema && config.colorSchema !== themeColorSchema)
-    // eslint-disable-next-line no-console
-    console.warn(`[slidev] Color schema "${config.colorSchema}" does not supported by the theme`)
-  if (themeHightlighter && config.highlighter !== themeHightlighter)
-    // eslint-disable-next-line no-console
-    console.warn(`[slidev] Syntax highlighter "${config.highlighter}" does not supported by the theme`)
-
-  return config
-}
-
 export function mergeFeatureFlags(a: SlidevFeatureFlags, b: SlidevFeatureFlags): SlidevFeatureFlags {
   return objectMap(a, (k, v) => [k, v || b[k]])
 }
@@ -305,3 +255,4 @@ export function scanMonacoModules(md: string) {
 }
 
 export * from './utils'
+export * from './config'
diff --git a/packages/types/src/config.ts b/packages/types/src/config.ts
@@ -0,0 +1,153 @@
+import { SlidevThemeConfig, ResolvedFontOptions } from './types'
+
+export interface SlidevConfig {
+  title: string
+  /**
+   * String template to compose title
+   *
+   * @example "%s - Slidev" - to suffix " - Slidev" to all pages
+   * @defult '%s'
+   */
+  titleTemplate: string
+  /**
+   * @see https://sli.dev/themes/use.html
+   * @defult 'default'
+   */
+  theme: string
+  /**
+   * @defult true
+   */
+  remoteAssets: boolean | 'dev' | 'build'
+  /**
+   * Enable Monaco
+   *
+   * @see https://sli.dev/custom/config-monaco.html
+   * @defult 'dev'
+   */
+  monaco: boolean | 'dev' | 'build'
+  /**
+   * Show a download button in the SPA build,
+   * could also be a link to custom pdf
+   *
+   * @default true
+   */
+  download: boolean | string
+  /**
+   * Information shows on the built SPA
+   * Can be a markdown string
+   *
+   * @default true
+   */
+  info: string | boolean
+  /**
+   * Prefer highlighter
+   *
+   * @see https://sli.dev/custom/highlighters.html
+   * @default prism
+   */
+  highlighter: 'prism' | 'shiki'
+  /**
+   * Show line numbers in code blocks
+   *
+   * @default false
+   */
+  lineNumbers: boolean
+  /**
+   * Force slides color schema
+   *
+   * @default 'auto'
+   */
+  colorSchema: 'dark' | 'light' | 'all' | 'auto'
+  /**
+   * Router mode for vue-router
+   *
+   * @default 'hash'
+   */
+  routerMode: 'hash' | 'history'
+  /**
+   * Aspect ratio for slides
+   * should be like `16/9` or `1:1`
+   *
+   * @default '16/9'
+   */
+  aspectRatio: number
+  /**
+   * The actual width fro slides canvas.
+   * unit in px.
+   *
+   * @default '980'
+   */
+  canvasWidth: number
+  /**
+   * Controls whether texts in slides are selectable
+   *
+   * @default false
+   */
+  selectable: boolean
+  /**
+   * Configure for themes, will inject intro root styles as
+   * `--slidev-theme-x` for attribute `x`
+   *
+   * This allows themes to have customization options in frontmatter
+   * Refer to themes' document for options avaliable
+   *
+   * @default {}
+   */
+  themeConfig: SlidevThemeConfig
+  /**
+   * Configure fonts for the slides and app
+   *
+   * @default {}
+   */
+  fonts: ResolvedFontOptions
+}
+
+export type FontOptions = {
+  /**
+   * Sans serif fonts (default fonts for most text)
+   */
+  sans?: string | string[]
+  /**
+   * Serif fonts
+   */
+  serif?: string | string[]
+  /**
+   * Monospace fonts, for code blocks and etc.
+   */
+  mono?: string | string[]
+  /**
+   * Load webfonts for custom CSS (does not apply anywhere by default)
+   */
+  custom?: string | string[]
+  /**
+   * Weights for fonts
+   *
+   * @default [200, 400, 600]
+   */
+  weights?: string | (string | number)[]
+  /**
+   * Import italic fonts
+   *
+   * @default false
+   */
+  italic?: boolean
+
+  /**
+   * @default 'google'
+   */
+  provider?: 'none' | 'google'
+  /**
+   * Specify web fonts names, will detect from `sans`, `mono`, `serif` if not provided
+   */
+  webfonts?: string[]
+  /**
+   * Specify local fonts names, be excluded from webfonts
+   */
+  local?: string[]
+  /**
+   * Use fonts fallback
+   *
+   * @default true
+   */
+  fallbacks?: boolean
+}
diff --git a/packages/types/src/index.ts b/packages/types/src/index.ts
@@ -1,2 +1,3 @@
 export * from './types'
 export * from './setups'
+export * from './config'