@brillout/docpress 0.1.20 → 0.2.1

package/src/headings.ts

@@ -1,200 +0,0 @@
-import React from 'react'
-import { assert, Emoji, EmojiName  } from './utils/server'
-
-export { getHeadings }
-export { parseTitle }
-
-export type Heading = Omit<HeadingDefinition, 'title' | 'titleInNav'> & {
-  title: JSX.Element
-  titleInNav: JSX.Element
-  parentHeadings: Heading[]
-  // Not sure why this is needed
-  isListTitle?: true
-  sectionTitles?: string[]
-}
-export type HeadingWithoutLink = {
-  url: string
-  title: string | JSX.Element
-}
-export type HeadingDefinition = HeadingBase &
-  (
-    | ({ level: 1; titleEmoji: EmojiName } & HeadingAbstract)
-    | ({ level: 4 } & HeadingAbstract)
-    | {
-        level: 2
-        isListTitle?: true
-        sectionTitles?: string[]
-        url: string
-      }
-    | {
-        level: 3
-        url: string
-      }
-  )
-type HeadingBase = {
-  title: string
-  level: number
-  url?: string
-  titleDocument?: string
-  titleInNav?: string
-  // titleSize?: string
-}
-type HeadingAbstract = {
-  url?: undefined
-  titleDocument?: undefined
-  titleInNav?: undefined
-}
-
-function getHeadings(config: { headings: HeadingDefinition[]; headingsWithoutLink: HeadingWithoutLink[] }): {
-  headings: Heading[]
-  headingsWithoutLink: HeadingWithoutLink[]
-} {
-  const headingsWithoutParent: Omit<Heading, 'parentHeadings'>[] = config.headings.map((heading: HeadingDefinition) => {
-    const titleProcessed: JSX.Element = parseTitle(heading.title)
-
-    const titleInNav = heading.titleInNav || heading.title
-    let titleInNavProcessed: JSX.Element
-    if ('isListTitle' in heading) {
-      assert(heading.isListTitle === true)
-      let titleParsed: JSX.Element = parseTitle(titleInNav)
-      // if (heading.titleSize) {
-      //   titleParsed = React.createElement('span', { style: { fontSize: heading.titleSize } }, titleParsed)
-      // }
-      titleInNavProcessed = React.createElement(React.Fragment, {}, getListPrefix(), titleParsed)
-    } else {
-      titleInNavProcessed = parseTitle(titleInNav)
-    }
-    if ('titleEmoji' in heading) {
-      assert(heading.titleEmoji)
-      titleInNavProcessed = withEmoji(heading.titleEmoji, titleInNavProcessed)
-    }
-
-    const headingProcessed: Omit<Heading, 'parentHeadings'> = {
-      ...heading,
-      title: titleProcessed,
-      titleInNav: titleInNavProcessed
-    }
-    return headingProcessed
-  })
-
-  const headings: Heading[] = []
-  headingsWithoutParent.forEach((heading) => {
-    const parentHeadings = findParentHeadings(heading, headings)
-    headings.push({ ...heading, parentHeadings })
-  })
-
-  const headingsWithoutLink = config.headingsWithoutLink.map((headingsWithoutLink) => {
-    const { url, title } = headingsWithoutLink
-    assert(
-      headings.find((heading) => heading.url === url) === undefined,
-      `remove ${headingsWithoutLink.url} from headingsWithoutLink`
-    )
-    const titleProcessed = typeof title === 'string' ? parseTitle(title) : title
-    return {
-      ...headingsWithoutLink,
-      title: titleProcessed
-    }
-  })
-
-  assertHeadingsUrl([...headings, ...headingsWithoutLink])
-  return { headings, headingsWithoutLink }
-}
-
-function findParentHeadings(heading: Omit<Heading, 'parentHeadings'>, headings: Heading[]) {
-  const parentHeadings: Heading[] = []
-  let levelCurrent = heading.level
-  let listTitleParentFound = false
-  headings
-    .slice()
-    .reverse()
-    .forEach((parentCandidate) => {
-      let isListTitleParent = false
-      if (
-        !listTitleParentFound &&
-        levelCurrent === heading.level &&
-        parentCandidate.level === heading.level &&
-        !parentCandidate.isListTitle &&
-        heading.isListTitle
-      ) {
-        isListTitleParent = true
-        listTitleParentFound = true
-      }
-
-      const isParent = parentCandidate.level < levelCurrent
-
-      if (isParent || isListTitleParent) {
-        levelCurrent = parentCandidate.level
-        parentHeadings.push(parentCandidate)
-      }
-    })
-  return parentHeadings
-}
-
-function assertHeadingsUrl(headings: { url?: string }[]) {
-  const urls: Record<string, true> = {}
-  headings.forEach((heading) => {
-    if (heading.url) {
-      const { url } = heading
-      assert(url.startsWith('/'))
-      assert(!urls[url], { url })
-      urls[url] = true
-    }
-  })
-}
-
-function getListPrefix() {
-  const nonBreakingSpace = String.fromCodePoint(0x00a0)
-  const bulletPoint = String.fromCodePoint(0x2022)
-  return nonBreakingSpace + bulletPoint + nonBreakingSpace
-}
-
-function parseTitle(title: string): JSX.Element {
-  type Part = { nodeType: 'text' | 'code'; content: string }
-  const parts: Part[] = []
-  let current: Part | undefined
-  title.split('').forEach((letter) => {
-    if (letter === '`') {
-      if (current?.nodeType === 'code') {
-        // </code>
-        parts.push(current)
-        current = undefined
-      } else {
-        // <code>
-        if (current) {
-          parts.push(current)
-        }
-        current = { nodeType: 'code', content: '' }
-      }
-    } else {
-      if (!current) {
-        current = { nodeType: 'text', content: '' }
-      }
-      current.content += letter
-    }
-  })
-  if (current) {
-    parts.push(current)
-  }
-
-  const titleJsx = React.createElement(
-    React.Fragment,
-    {},
-    ...parts.map((part, i) =>
-      React.createElement(part.nodeType === 'code' ? 'code' : React.Fragment, { key: i }, part.content)
-    )
-  )
-
-  return titleJsx
-}
-
-function withEmoji(name: EmojiName, title: string | JSX.Element): JSX.Element {
-  const style = { fontSize: '1.4em' }
-  //return React.createElement(React.Fragment, null, Emoji({ name, style }), ' ', title)
-  return React.createElement(
-    'span',
-    { style },
-    Emoji({ name }),
-    ' ',
-    React.createElement('span', { style: { fontSize: '1rem' } }, title)
-  )
-}

package/src/index.ts

@@ -1,3 +0,0 @@
-export * from './components'
-export * from './utils/server'
-export * from './types'

package/src/installSectionUrlHashs.ts

@@ -1,50 +0,0 @@
-import { assert } from './utils/client'
-
-installSectionUrlHashs()
-/* Let browser restore previous scroll
-jumpToSection()
-*/
-
-function installSectionUrlHashs() {
-  const pageContainer = document.querySelector('.doc-page #page-container')
-  if (!pageContainer) {
-    assert(window.location.pathname === '/')
-    return
-  }
-  const navigationEl = document.getElementById('navigation-content')
-  assert(navigationEl)
-  const docSections = Array.from(document.querySelectorAll('h2'))
-  docSections.forEach((docSection) => {
-    const docTitle = docSection.textContent
-    assert(docTitle)
-    assert(docSection.id, { docSection })
-    const urlHash = '#' + docSection.id
-    assertNavLink(navigationEl, urlHash)
-    docSection.onclick = () => {
-      window.location.hash = urlHash
-      // The browser doesn't jump if hash doesn't change
-      jumpToSection()
-    }
-  })
-}
-
-function assertNavLink(navigationEl: HTMLElement, urlHash: string) {
-  const parentNavLinkMatch = Array.from(navigationEl.querySelectorAll(`a[href="${window.location.pathname}"]`))
-  assert(parentNavLinkMatch.length <= 1)
-  if (parentNavLinkMatch.length === 0) return
-  const navLinks: HTMLElement[] = Array.from(navigationEl.querySelectorAll(`a[href="${urlHash}"]`))
-  assert(navLinks.length === 1, { urlHash })
-}
-
-function jumpToSection() {
-  const { hash } = window.location
-  if (hash === '' || hash === '#') {
-    return
-  }
-  assert(hash.startsWith('#'))
-  const target = document.getElementById(hash.slice(1))
-  if (!target) {
-    return
-  }
-  target.scrollIntoView()
-}

package/src/markdownHeadingsVitePlugin.ts

@@ -1,128 +0,0 @@
-import { assert, determineSectionUrlHash } from '../src/utils/server'
-
-export { markdownHeadingsVitePlugin }
-export type { MarkdownHeading }
-
-type MarkdownHeading = {
-  title: string
-  id: string
-  headingLevel: number
-  titleAddendum?: string
-}
-
-function markdownHeadingsVitePlugin() {
-  return {
-    name: 'mdx-headings',
-    enforce: 'pre',
-    transform: async (code: string, id: string) => {
-      if (!id.includes('.page.') || !id.endsWith('.mdx')) {
-        return
-      }
-      const codeNew = transform(code)
-      return codeNew
-    }
-  }
-}
-
-function transform(code: string) {
-  const headings: MarkdownHeading[] = []
-  let isCodeBlock = false
-  let codeNew = code
-    .split('\n')
-    .map((line) => {
-      // Skip code blocks, e.g.
-      // ~~~md
-      // # Markdown Example
-      // Bla
-      // ~~~
-      if (line.startsWith('~~~') || line.startsWith('```')) {
-        isCodeBlock = !isCodeBlock
-        return line
-      }
-      if (isCodeBlock) {
-        return line
-      }
-
-      if (line.startsWith('#')) {
-        const { id, headingLevel, title, headingHtml } = parseMarkdownHeading(line)
-        headings.push({ id, headingLevel, title })
-        return headingHtml
-      }
-      if (line.startsWith('<h')) {
-        assert(false, { line })
-      }
-
-      return line
-    })
-    .join('\n')
-  const headingsExportCode = `export const headings = [${headings
-    .map((heading) => JSON.stringify(heading))
-    .join(', ')}];`
-  codeNew += `\n\n${headingsExportCode}\n`
-  return codeNew
-}
-
-function parseMarkdownHeading(line: string): MarkdownHeading & { headingHtml: string } {
-  const [lineBegin, ...lineWords] = line.split(' ')
-  assert(lineBegin.split('#').join('') === '', { line, lineWords })
-  const headingLevel = lineBegin.length
-
-  const titleMdx = lineWords.join(' ')
-  assert(!titleMdx.startsWith(' '), { line, lineWords })
-  assert(titleMdx, { line, lineWords })
-
-  const id = determineSectionUrlHash(titleMdx)
-  const title = titleMdx
-
-  const headingHtml = `<h${headingLevel} id="${id}">${parseTitle(title)}</h${headingLevel}>`
-
-  const heading = { headingLevel, title, id, headingHtml }
-  return heading
-}
-
-function parseTitle(titleMarkdown: string): string {
-  type Part = { nodeType: 'text' | 'code'; content: string }
-  const parts: Part[] = []
-  let current: Part | undefined
-  titleMarkdown.split('').forEach((letter) => {
-    if (letter === '`') {
-      if (current?.nodeType === 'code') {
-        // </code>
-        parts.push(current)
-        current = undefined
-      } else {
-        // <code>
-        if (current) {
-          parts.push(current)
-        }
-        current = { nodeType: 'code', content: '' }
-      }
-    } else {
-      if (!current) {
-        current = { nodeType: 'text', content: '' }
-      }
-      current.content += letter
-    }
-  })
-  if (current) {
-    parts.push(current)
-  }
-
-  const titleHtml = parts
-    .map((part) => {
-      if (part.nodeType === 'code') {
-        return `<code>${serializeText(part.content)}</code>`
-      } else {
-        assert(part.nodeType === 'text', { parts })
-        return serializeText(part.content)
-      }
-    })
-    .join('')
-
-  return titleHtml
-
-  function serializeText(text: string) {
-    const textEscaped = text.split("'").join("\\'")
-    return `{'${textEscaped}'}`
-  }
-}

package/src/navigation/Navigation-highlight.css

@@ -1,41 +0,0 @@
-/*
-.nav-item {
-  border-top: 1px solid transparent;
-}
-.nav-item.is-active {
-  border-color: #eaeaea;
-}
-.nav-item[is-active] {
-  background-color: attr(is-active)
-}
-*/
-
-/*
-#navigation-container:not(:hover) ::-webkit-scrollbar {
-  display: none;
-}
-#navigation-container ::-webkit-scrollbar-thumb {
-  opacity: 0;
-}
-#navigation-container ::-webkit-scrollbar-track {
-  opacity: 0;
-}
-*/
-
-/*
-.nav-tree:not(.expanded) > .nav-tree {
-  edisplay: none;
-  background:red;
-}
-  */
-/*
-.nav-tree.expanded,
-.nav-tree.expanded > .nav-tree {
-  display: inherit;
-}
-.nav-tree.expanded,
-.nav-tree.expanded > .nav-tree {
-  display: inherit;
-  background:red;
-}
-*/

package/src/navigation/Navigation-items.css

@@ -1,122 +0,0 @@
-.nav-item {
-  display: block;
-  white-space: nowrap;
-  overflow-x: hidden;
-  --padding-left-global: 9px;
-  --padding-left-additional: 0px;
-}
-.nav-item code {
-  font-size: 0.9em;
-}
-.nav-item-h1 + .nav-item-h4 {
-  margin-top: -2px;
-}
-.nav-item-h4 {
-  margin-top: 14px;
-  margin-bottom: -1px;
-  color: #999;
-  font-size: 12px;
-  font-weight: 400;
-  letter-spacing: 0.15ch;
-  padding-left: var(--padding-left-global);
-  padding-right: 4px;
-  text-decoration: none;
-}
-.nav-column:first-of-type > .nav-h1-group:first-of-type > .nav-item-h1:first-of-type {
-  margin-top: 20px;
-}
-.nav-item-h1 {
-  margin-top: 30px;
-  font-size: 15.4px;
-  text-transform: uppercase;
-  font-weight: 600;
-  letter-spacing: 0.15ch;
-  color: var(--color-text);
-  padding: 12px 0;
-  padding-left: calc(var(--padding-left-global) - 2px);
-  padding-right: 4px;
-  text-decoration: none;
-}
-.nav-item-h2 {
-  text-decoration: none;
-  font-size: 14.4px;
-  font-weight: 400;
-  letter-spacing: 0.15ch;
-  color: var(--color-text);
-  padding-left: var(--padding-left-global);
-  padding-right: 0;
-  --padding: 4px;
-  padding-top: var(--padding);
-  padding-bottom: var(--padding);
-}
-.nav-item-h3 {
-  font-size: 12px;
-  font-weight: 400;
-  letter-spacing: 0.15ch;
-  color: var(--color-text);
-  text-decoration: none;
-  --padding: 5px;
-
-  background-color: #f9f9f9;
-  padding: var(--padding) 0;
-  padding-left: calc(var(--padding-left-global) + var(--padding-left-additional));
-}
-html.navigation-fullscreen .nav-item-h3 {
-  border-right: 4px solid #eee;
-}
-.nav-item-h3.nav-item-first-of-its-kind {
-  padding-top: calc(var(--padding) * 1.6);
-}
-.nav-item-h3.nav-item-last-of-its-kind {
-  padding-bottom: calc(var(--padding) * 2);
-}
-.nav-item-h2,
-.nav-item-h3 {
-  position: relative;
-}
-/*
-.nav-item-h2.is-active .nav-item-text{
-  background-color: var(--background-color);
-}
-*/
-.nav-item-h2.is-active {
-  background-color: var(--background-color);
-}
-.nav-item-h3.is-active:before {
-  display: block;
-  content: '';
-  position: absolute;
-  width: 4px;
-  left: 0;
-  top: 0;
-  height: 100%;
-  background-color: var(--background-color);
-  z-index: 10;
-}
-.nav-item-h3.is-active-last:after {
-  display: block;
-  content: '';
-  position: absolute;
-  height: 4px;
-  left: 0;
-  bottom: 0;
-  width: 100%;
-  background-color: var(--background-color);
-  z-index: 10;
-  border-bottom-left-radius: 5px;
-}
-html.navigation-fullscreen .nav-item {
-  --expend-border-radius: 5px;
-}
-.nav-item.is-active-first {
-  border-top-left-radius: 5px;
-  border-top-right-radius: var(--expend-border-radius);
-}
-.nav-item.is-active-last,
-.nav-item.is-active-last:before {
-  border-bottom-left-radius: 5px;
-  border-bottom-right-radius: var(--expend-border-radius);
-}
-.nav-item-h3.nav-item-parent-is-list-heading {
-  --padding-left-additional: 21px;
-}

package/src/navigation/Navigation-layout.css

@@ -1,118 +0,0 @@
-:root {
-  --mobile-header-height: 60px;
-  --navigation-min-height: 300px;
-  --navigation-max-height: 350px;
-}
-#navigation-wrapper {
-  min-width: var(--navigation-min-height);
-}
-.doc-page #navigation-wrapper {
-  max-width: var(--navigation-max-height);
-}
-.landing-page #navigation-wrapper {
-  /* prettier-ignore */
-  max-width: min(var(--navigation-max-height), max(var(--navigation-min-height), calc(var(--navigation-min-height) + 100vw - 1240px)));
-}
-#navigation-container {
-  /* `position: fixed` doesn't inherit the parent's width */
-  position: sticky;
-  overflow-y: auto;
-  overscroll-behavior: contain;
-  border-right: 1px solid #eee;
-}
-#navigation-mask {
-  position: fixed;
-  width: 100vw;
-  height: 100vh;
-  top: 0;
-  left: 0;
-  z-index: 2;
-}
-/* `1140px` is the breaking point that preserves the width of code blocks. */
-/* BEFORE EDITING THIS: also change the `1139px` value below */
-@media screen and (min-width: 1140px) {
-  #mobile-header {
-    display: none !important;
-  }
-  #navigation-container {
-    height: 100vh;
-    top: 0;
-  }
-  #navigation-mask {
-    display: none;
-  }
-}
-#navigation-container {
-  transition: transform 0.25s ease;
-  background: white;
-  z-index: 3;
-}
-#page-wrapper {
-  margin-left: calc(-1 * var(--navigation-fullscreen-button-width));
-}
-@media screen and (max-width: 1139px) {
-  #navigation-header-logo,
-  #docsearch {
-    display: none !important;
-  }
-  #navigation-wrapper {
-    min-width: 0px !important;
-    max-width: 0px !important;
-  }
-  #navigation-fullscreen-button {
-    display: none;
-  }
-  #page-wrapper {
-    margin-left: 0 !important;
-  }
-  #navigation-container {
-    --width: min(100vw, 350px);
-    width: var(--width);
-    left: 0;
-    height: calc(100vh - var(--mobile-header-height));
-    top: var(--mobile-header-height);
-    padding-top: 20px;
-    /* `position: sticky` doesn't seem to work on mobile */
-    position: fixed;
-  }
-  body:not(.show-menu) #navigation-container {
-    transform: translateX(calc(-1 * var(--width)));
-  }
-  body:not(.show-menu) #navigation-mask {
-    display: none;
-  }
-  #mobile-header {
-    display: inherit;
-  }
-  .doc-page h2 {
-    --padding-top: calc(var(--mobile-header-height) + 12px) !important;
-  }
-}
-
-html.navigation-fullscreen #navigation-container {
-  width: 100vw;
-  height: 100vh;
-  overflow-y: scroll;
-  position: fixed;
-  top: 0;
-  left: 0;
-  background-color: white;
-}
-html.navigation-fullscreen #navigation-header {
-  display: none !important;
-}
-html.navigation-fullscreen #navigation-content {
-  display: flex;
-  margin: auto; /* A `max-width` is set by src/navigation/navigation-fullscreen/initNavigationFullscreen.ts */
-}
-html.navigation-fullscreen #navigation-content > .nav-column {
-  flex-grow: 1;
-  max-width: 350px;
-}
-html.navigation-fullscreen .nav-column > .nav-h1-group:first-child > .nav-item-h1:first-child {
-  margin-top: 0px;
-}
-html.navigation-fullscreen {
-  /* disable scroll of main view */
-  overflow: hidden !important;
-}