@brillout/docpress 0.1.8 → 0.1.10

package/src/components/features/initFeatureList.ts

@@ -1,66 +0,0 @@
-import { assert } from '../../utils'
-
-addTwitterWidgets()
-addFeatureClickHandlers()
-window.__docpress_hydrationFinished = true
-
-function addTwitterWidgets() {
-  loadScript('https://platform.twitter.com/widgets.js')
-}
-
-function addFeatureClickHandlers() {
-  const featureEls: HTMLElement[] = Array.from(
-    document.getElementById('features')!.querySelectorAll('.feature.has-learn-more')
-  )
-  featureEls.forEach((featureEl) => {
-    featureEl.onclick = () => {
-      expandLearnMore(featureEl)
-    }
-  })
-}
-
-function expandLearnMore(featureEl: HTMLElement) {
-  const featureId = featureEl.id
-  assert(featureId.startsWith('feature-'), { featureId })
-  const featureName = featureId.slice('feature-'.length)
-
-  const selectedClass = 'selected'
-  const learnId = 'learn-more-' + featureName
-  const learnEl = document.getElementById(learnId)
-  assert(learnEl, { learnId })
-
-  const isExpanded = featureEl.classList.contains(selectedClass)
-
-  if (!isExpanded) {
-    const rowEl = featureEl.parentNode as HTMLElement
-    if (getComputedStyle(rowEl, 'display') === 'grid') {
-      ;[
-        ...(rowEl.querySelectorAll('.learn-more') as any as HTMLElement[]),
-        ...(rowEl.querySelectorAll('.feature') as any as HTMLElement[])
-      ].forEach((el) => {
-        el.classList.remove(selectedClass)
-      })
-    }
-  }
-
-  ;[featureEl, learnEl].forEach((el) => {
-    el.classList.toggle(selectedClass)
-  })
-}
-
-function loadScript(scriptUrl: string): void {
-  assert(scriptUrl.startsWith('https://'))
-  const scriptEl = document.createElement('script')
-  scriptEl.src = scriptUrl
-  scriptEl.async = true
-  scriptEl.setAttribute('charset', 'utf-8')
-  document.getElementsByTagName('head')[0].appendChild(scriptEl)
-}
-
-function getComputedStyle(el: HTMLElement, styleProp: string) {
-  return window.document.defaultView!.getComputedStyle(el).getPropertyValue(styleProp)
-}
-
-declare global {
-  var __docpress_hydrationFinished: undefined | true
-}

package/src/components/index.ts

@@ -1,13 +0,0 @@
-export * from '../utils/Emoji'
-export * from './Link'
-export * from './DocLink'
-export * from './RepoLink'
-export * from './P'
-export * from './Info'
-export * from './ReadingRecommendation'
-export * from './Note'
-export * from './ImportMeta'
-export * from './features/FeatureList'
-export * from './HorizontalLine'
-export * from './Sponsors'
-export * from './CodeBlock'

package/src/config/Config.ts

@@ -1,30 +0,0 @@
-export type { Config }
-
-import type { HeadingDefinition, HeadingWithoutLink } from '../headings'
-
-type Config = {
-  projectInfo: {
-    githubRepository: string
-    githubIssues: string
-    projectName: string
-    projectNameJsx?: JSX.Element
-    projectVersion: string
-    discordInvite: string
-    twitterProfile: string
-  }
-  faviconUrl: string
-  algolia: null | {
-    appId: string
-    apiKey: string
-    indexName: string
-  }
-  headings: HeadingDefinition[]
-  headingsWithoutLink: HeadingWithoutLink[]
-  navHeaderMobile: React.ReactNode
-  navHeader: React.ReactNode
-  titleNormalCase: boolean
-  tagline: string
-  websiteUrl: string
-  bannerUrl?: string
-  twitterHandle: string
-}

package/src/config/getConfig.ts

@@ -1,18 +0,0 @@
-export { getConfig }
-import { assert, assertUsage } from '../utils'
-import { Config } from './Config'
-
-function getConfig(): Config {
-  // We use `@ts-ignore` because the DocPress user most likely didn't add `vite/client` in his `tsconfig.json`.
-  // @ts-ignore
-  const globResult = import.meta.glob('/**/docpress.config.*([a-zA-Z0-9])', { eager: true })
-  const files = Object.keys(globResult)
-  assertUsage(files.length >= 1, 'No DocPress config file found `docpress.config.(js|ts|tsx|...)`')
-  assertUsage(
-    files.length === 1,
-    `Found multiple \`docpress.config.js\` files: ${files.map((f) => `\`${f}\``).join(', ')}. Define only one instead.`
-  )
-  const config = (Object.values(globResult)[0] as any).default as Config
-  assert(config)
-  return config
-}

package/src/config/resolvePageContext.ts

@@ -1,157 +0,0 @@
-import { assert, jsxToTextContent, objectAssign } from '../utils'
-import { getHeadings, HeadingWithoutLink, parseTitle } from '../headings'
-import type { Heading } from '../headings'
-import type { PageContextBuiltIn } from 'vite-plugin-ssr'
-import type { MarkdownHeading } from '../../vite.config/markdownHeadings'
-import type { Config } from './Config'
-import { getConfig } from './getConfig'
-
-export { resolvePageContext }
-export type { PageContextOriginal }
-export type { PageContextResolved }
-export type { Heading }
-
-type ReactComponent = () => JSX.Element
-type Exports = {
-  headings?: MarkdownHeading[]
-}
-type PageContextOriginal = PageContextBuiltIn & {
-  Page: ReactComponent
-  exports: Exports
-}
-type PageContextResolved = ReturnType<typeof resolvePageContext>
-
-function resolvePageContext(pageContext: PageContextOriginal) {
-  const config = getConfig()
-  const { headings, headingsWithoutLink } = getHeadings(config)
-  const activeHeading = findActiveHeading(headings, headingsWithoutLink, pageContext)
-  const headingsWithSubHeadings = getHeadingsWithSubHeadings(headings, pageContext, activeHeading)
-  const { title, isLandingPage, pageTitle, isDetachedPage } = getMetaData(
-    headingsWithoutLink,
-    activeHeading,
-    pageContext,
-    config
-  )
-  const { faviconUrl, algolia, tagline, twitterHandle, bannerUrl, websiteUrl } = config
-  const pageContextResolved = {}
-  objectAssign(pageContextResolved, {
-    ...pageContext,
-    meta: {
-      title,
-      faviconUrl,
-      twitterHandle,
-      bannerUrl,
-      websiteUrl,
-      tagline,
-      algolia
-    },
-    headings,
-    headingsWithSubHeadings,
-    isLandingPage,
-    isDetachedPage,
-    pageTitle,
-    config
-  })
-  return pageContextResolved
-}
-
-function getMetaData(
-  headingsWithoutLink: HeadingWithoutLink[],
-  activeHeading: Heading | null,
-  pageContext: { urlOriginal: string; exports: Exports },
-  config: Config
-) {
-  const url = pageContext.urlOriginal
-
-  let title: string
-  let pageTitle: string | JSX.Element | null
-  let isDetachedPage: boolean
-  if (activeHeading) {
-    title = activeHeading.titleDocument || jsxToTextContent(activeHeading.title)
-    pageTitle = activeHeading.title
-    isDetachedPage = false
-  } else {
-    pageTitle = headingsWithoutLink.find((h) => h.url === url)!.title
-    title = jsxToTextContent(pageTitle)
-    isDetachedPage = true
-  }
-
-  const isLandingPage = url === '/'
-  if (!isLandingPage) {
-    title += ' | ' + config.projectInfo.projectName
-  }
-
-  if (isLandingPage) {
-    pageTitle = null
-  }
-
-  return { title, isLandingPage, pageTitle, isDetachedPage }
-}
-
-function findActiveHeading(
-  headings: Heading[],
-  headingsWithoutLink: HeadingWithoutLink[],
-  pageContext: { urlOriginal: string; exports: Exports }
-): Heading | null {
-  let activeHeading: Heading | null = null
-  assert(pageContext.urlOriginal)
-  const pageUrl = pageContext.urlOriginal
-  headings.forEach((heading) => {
-    if (heading.url === pageUrl) {
-      activeHeading = heading
-      assert(heading.level === 2, { pageUrl, heading })
-    }
-  })
-  const debugInfo = {
-    msg: 'Heading not found for url: ' + pageUrl,
-    urls: headings.map((h) => h.url),
-    url: pageUrl
-  }
-  assert(activeHeading || headingsWithoutLink.find(({ url }) => pageUrl === url), debugInfo)
-  return activeHeading
-}
-
-function getHeadingsWithSubHeadings(
-  headings: Heading[],
-  pageContext: { exports: Exports; urlOriginal: string },
-  activeHeading: Heading | null
-): Heading[] {
-  const headingsWithSubHeadings = headings.slice()
-  if (activeHeading === null) return headingsWithSubHeadings
-  const activeHeadingIdx = headingsWithSubHeadings.indexOf(activeHeading)
-  assert(activeHeadingIdx >= 0)
-  const pageHeadings = pageContext.exports.headings || []
-  pageHeadings.forEach((pageHeading, i) => {
-    const title = parseTitle(pageHeading.title)
-    const url = '#' + pageHeading.id
-    assert(
-      pageHeading.headingLevel !== 3,
-      'Wrong page heading level `' +
-        pageHeading.headingLevel +
-        '` (it should be `<h2>`) for sub-heading `' +
-        pageHeading.title +
-        '` of page `' +
-        pageContext.urlOriginal +
-        '`.'
-    )
-    if (pageHeading.headingLevel === 2) {
-      const heading: Heading = {
-        url,
-        title,
-        parentHeadings: [activeHeading, ...activeHeading.parentHeadings],
-        titleInNav: title,
-        level: 3
-      }
-      headingsWithSubHeadings.splice(activeHeadingIdx + 1 + i, 0, heading)
-    }
-  })
-
-  if (activeHeading?.sectionTitles) {
-    activeHeading.sectionTitles.forEach((sectionTitle) => {
-      const pageHeadingTitles = pageHeadings.map((h) => h.title)
-      assert(pageHeadingTitles.includes(sectionTitle), { pageHeadingTitles, sectionTitle })
-    })
-  }
-
-  return headingsWithSubHeadings
-}

package/src/css/button.css

@@ -1,7 +0,0 @@
-button,
-a.button {
-  background-color: #fafafa;
-  border: 1px solid #aaa;
-  border-radius: 5px;
-  cursor: pointer;
-}

package/src/css/code/block.css

@@ -1,36 +0,0 @@
-pre > code {
-  padding: 16px !important;
-}
-@media screen and (max-width: 900px) {
-  pre > code {
-    font-size: 0.7em;
-  }
-}
-pre {
-  display: grid;
-}
-pre > code {
-  padding-right: 0px !important;
-  overflow-x: auto;
-}
-
-@media screen and (max-width: 1139px) {
-  pre > code {
-    font-size: 0.95em;
-  }
-}
-@media screen and (max-width: 1040px) {
-  pre > code {
-    font-size: 0.8em;
-  }
-}
-@media screen and (max-width: 940px) {
-  pre > code {
-    font-size: 0.7em;
-  }
-}
-
-pre > code {
-  display: reset;
-  word-break: reset;
-}

package/src/css/code/inline.css

@@ -1,27 +0,0 @@
-code {
-  padding: 2px 5px;
-}
-
-/*
- * Line breaks in `<code>`:
- *  - Avoid them on desktop
- *  - Allow them on mobile
- *  - Allo them for `<code long>`
- */
-code {
-  display: inline-block;
-}
-@media screen and (max-width: 500px) {
-  code {
-    word-break: break-word;
-    display: inline;
-  }
-}
-.inline-code-break code {
-  display: inline;
-  word-break: break-word;
-}
-code.long {
-  word-break: break-word;
-  display: inline;
-}

package/src/css/code.css

@@ -1,20 +0,0 @@
-@import './code/inline.css';
-@import './code/block.css';
-
-code {
-  /*
-  background-color: #f4f4f4;
-  0.043137255 = 1 - (#f4 / #ff)
-  */
-  background-color: rgba(0, 0, 0, 0.043137255);
-  border-radius: 4px;
-}
-
-/* Inline */
-code {
-  font-size: 1.1em;
-}
-/* Block */
-pre > code {
-  font-size: 1em;
-}

package/src/css/colorize-on-hover.css

@@ -1,29 +0,0 @@
-.colorize-on-hover,
-.colorize-on-hover [class^='decolorize-'],
-.colorize-on-hover [class*=' decolorize-'] {
-  transition: filter 0.3s ease-in-out;
-}
-.colorize-on-hover:hover,
-.colorize-on-hover:hover [class^='decolorize-'],
-.colorize-on-hover:hover [class*=' decolorize-'] {
-  filter: grayscale(0) opacity(1) !important;
-}
-
-.decolorize-7 {
-  filter: grayscale(1) opacity(0.7);
-}
-.decolorize-6 {
-  filter: grayscale(1) opacity(0.6);
-}
-.decolorize-5 {
-  filter: grayscale(1) opacity(0.5);
-}
-.decolorize-4 {
-  filter: grayscale(1) opacity(0.4);
-}
-
-/*
- * Twitter opacity(0.7): #ababab > #868686
- * == Following computation does NOT work ==
- * Discord opacity(0.7): #6c6c6c > (0.7 * (#fff - #ababab) = #868686 = x * (#fff - #6c6c6c) <=> x = 0.7 * ((#fff - #ababab) / (#fff - #6c6c6c)) = 0.7 * ((255 - 171) / (255 - 108)) = 0.4)
- */

package/src/css/font.css

@@ -1,19 +0,0 @@
-body {
-  font-family: 'Inter';
-}
-button {
-  font-family: inherit;
-}
-body {
-  --color-text: #323d48;
-  color: var(--color-text);
-  line-height: 1.5;
-}
-
-@font-face {
-  font-family: 'Inter';
-  font-weight: 100 900;
-  font-stretch: 75% 125%;
-  font-style: oblique 0deg 12deg;
-  src: url('./Inter-Var.ttf') format('truetype-variations');
-}

package/src/css/heading.css

@@ -1,25 +0,0 @@
-.doc-page h2 {
-  margin-top: 50px;
-  margin-bottom: 16px;
-}
-.doc-page h2[id] {
-  cursor: pointer;
-  position: relative;
-  padding-left: 20px;
-  margin-left: -20px;
-}
-.doc-page h2[id]:hover::before {
-  content: '#';
-  position: absolute;
-  left: calc(-1 * (0.75em - 20px));
-  color: #aaa;
-}
-
-.doc-page h1 + h2 {
-  margin-top: 0;
-}
-
-.doc-page h4 {
-  margin-top: 32px;
-  margin-bottom: 16px;
-}

package/src/css/index.css

@@ -1,10 +0,0 @@
-@import './reset.css';
-@import './colorize-on-hover.css';
-@import './heading.css';
-@import './button.css';
-@import './link.css';
-@import './font.css';
-@import './code.css';
-@import './note.css';
-@import './table.css';
-@import './tooltip.css';

package/src/css/link.css

@@ -1,17 +0,0 @@
-/*
-:root {
-  --link-color: #4747ff;
-}
-*/
-
-a {
-  /*
-  color: inherit;
-  color: var(--link-color);
-  */
-  color: #4747ff;
-  text-decoration: none;
-}
-a > button {
-  color: var(--color-text);
-}

package/src/css/note.css

@@ -1,26 +0,0 @@
-blockquote {
-  --color: 0, 0, 0;
-  --color-strengh-bg: 0.7;
-  --color-strengh-border: 1.5;
-  border-left: 8px solid rgba(var(--color), calc(0.06 * var(--color-strengh-border)));
-  background-color: rgba(var(--color), calc(0.03 * var(--color-strengh-bg)));
-  margin-left: 0;
-  padding: 4px 16px;
-}
-blockquote.error {
-  --color-strengh-bg: 1.7;
-  --color-strengh-border: 6;
-  --color: 190, 25, 49;
-}
-blockquote.warning {
-  --color-strengh-bg: 4;
-  --color-strengh-border: 8;
-  --color: 255, 204, 50;
-}
-blockquote > p:first-child::before,
-/* blockquote > p:first-of-type::before, */
-blockquote > div.paragraph:first-child::before {
-  font-family: emoji;
-  content: 'ℹ️';
-  margin-right: 4px;
-}

package/src/css/reset.css

@@ -1,12 +0,0 @@
-* {
-  box-sizing: border-box;
-}
-body {
-  margin: 0;
-}
-
-/* Avoid tweet embeds to overflow the body width.
- * Settings `overflow: hidden` to a container doesn't work (This is a CSS bug?) */
-iframe {
-  max-width: 100%;
-}

package/src/css/table.css

@@ -1,14 +0,0 @@
-table th {
-  background-color: #f7f7f7;
-}
-table {
-  border-collapse: collapse;
-}
-table td,
-table th {
-  padding: 8px;
-  border: 1px solid #ccc;
-}
-table th {
-  text-align: left;
-}

package/src/css/tooltip.css

@@ -1,11 +0,0 @@
-@import 'balloon-css';
-
-:root {
-  --balloon-color: #444;
-  --balloon-move: 2px;
-  --balloon-font-size: 14px;
-  --balloon-border-radius: 5px;
-}
-[aria-label][data-balloon-pos]:after {
-  font-family: 'Inter';
-}