From 3dc2f19e9abadfedcede4ab75af100f757bc8474 Mon Sep 17 00:00:00 2001 From: Dan Jutan Date: Mon, 15 Nov 2021 15:19:30 -0500 Subject: [PATCH] remove markdown component --- package.json | 5 -- public/articles/welcome-to-the-solid-blog.md | 3 + src/components/Markdown.tsx | 58 -------------------- src/pages/Tutorial.tsx | 12 ++-- vite.config.ts | 4 -- yarn.lock | 57 +------------------ 6 files changed, 11 insertions(+), 128 deletions(-) delete mode 100644 src/components/Markdown.tsx diff --git a/package.json b/package.json index 3c3ef58a..83324adb 100644 --- a/package.json +++ b/package.json @@ -27,10 +27,7 @@ "@solid-primitives/throttle": "^1.0.3", "@solid.js/docs": "^1.0.3", "fuse.js": "^6.4.6", - "markdown-it-prism": "^2.1.7", "monaco-editor": "^0.25.2", - "prism-themes": "^1.9.0", - "prismjs": "^1.25.0", "scroll-behavior-polyfill": "^2.0.13", "solid-app-router": "^0.1.11", "solid-dismiss": "^1.0.22", @@ -54,8 +51,6 @@ "got": "^11.8.2", "htmlnano": "^1.1.1", "jiti": "^1.12.9", - "markdown-it": "^12.2.0", - "markdown-it-anchor": "^8.3.1", "npm-run-all": "^4.1.5", "patch-package": "^6.4.7", "postcss": "^8.3.6", diff --git a/public/articles/welcome-to-the-solid-blog.md b/public/articles/welcome-to-the-solid-blog.md index 0a4feaf1..b6be7e94 100644 --- a/public/articles/welcome-to-the-solid-blog.md +++ b/public/articles/welcome-to-the-solid-blog.md @@ -1,5 +1,8 @@ Hello and welcome to our new blog platform! + +# Test Header +## Test Second Level Header SolidJS is a community built on strong communication and teamwork. It's only right that we have a blog for our growing community that helps with sharing announcements, publish recent ideas and even bring valuable insights and learnings from the broader community. Ryan and other members will continue publishing articles you've come to love about SolidJS and broader research via dev.to, Medium and other outlets. We'll frequently link to them here and make you aware of the latest so you can keep coming to this blog for the absolute latest. diff --git a/src/components/Markdown.tsx b/src/components/Markdown.tsx deleted file mode 100644 index 401d43e1..00000000 --- a/src/components/Markdown.tsx +++ /dev/null @@ -1,58 +0,0 @@ -import { Component, createEffect, createMemo, JSX, splitProps } from 'solid-js'; - -import prism from 'markdown-it-prism'; - -import markdown from 'markdown-it'; -import anchor from 'markdown-it-anchor'; - -import 'prism-themes/themes/prism-ghcolors.css'; - -import 'prismjs/components/prism-json'; -import 'prismjs/components/prism-jsx'; -import 'prismjs/components/prism-bash'; -import 'prismjs/components/prism-typescript'; - -const Markdown: Component = (props) => { - const [internal, external] = splitProps(props, ['class', 'onLoadSections', 'children']); - const doc = createMemo(() => { - const sections: Section[] = []; - - const md = markdown({ html: true, typographer: true }) - .use(prism) - // Options available here: https://www.npmjs.com/package/markdown-it-anchor - .use(anchor, { - level: 1, - callback: (token, { slug, title }) => { - sections.push({ slug, title, level: token.tag }); - }, - }); - - const html = md.render(internal.children as string); - - return { - html, - sections: - sections[1] && sections[1].level === 'h3' - ? sections.filter((section) => section.level === 'h1') - : sections.filter((section) => section.level !== 'h1'), - }; - }); - - createEffect(() => { - if (internal.onLoadSections) internal.onLoadSections(doc().sections); - }); - - return
; -}; - -export default Markdown; - -interface Props extends JSX.HTMLAttributes { - onLoadSections?: Function; -} - -export interface Section { - slug: string; - title: string; - level: string; -} diff --git a/src/pages/Tutorial.tsx b/src/pages/Tutorial.tsx index b9dd7ec0..3db62629 100644 --- a/src/pages/Tutorial.tsx +++ b/src/pages/Tutorial.tsx @@ -15,12 +15,12 @@ import { useData, NavLink } from 'solid-app-router'; import { Icon } from '@amoutonbrady/solid-heroicons'; import { arrowLeft, arrowRight, chevronDown } from '@amoutonbrady/solid-heroicons/solid'; -import Markdown from '../components/Markdown'; import { compiler, formatter } from '../components/setupRepl'; import type { TutorialDirectory, TutorialDirectoryItem, TutorialRouteData } from './Tutorial.data'; import { useI18n } from '@solid-primitives/i18n'; import Dismiss from 'solid-dismiss'; import { useRouteReadyState } from '../utils/routeReadyState'; +import SolidMarkdown from 'solid-markdown'; const alphabet = 'abcdefghijklmnopqrstuvwxyz'.split(''); @@ -166,7 +166,7 @@ const Tutorial: Component = () => { useRouteReadyState(); createEffect(() => { - markDownRef.scrollTop = 0; + // markDownRef.scrollTop = 0; replEditor && replEditor.setScrollPosition({ scrollTop: 0 }); const fileset = data.solved ? data.solvedJs : data.js; const files = fileset?.files; @@ -194,9 +194,11 @@ const Tutorial: Component = () => {
- - {data.markdown || ''} - +
+ + {data.markdown || ''} + +