From 6424ac70fe9528678151c609240b176ae2c8536b Mon Sep 17 00:00:00 2001 From: elevatebart Date: Mon, 28 Aug 2023 17:50:21 +0200 Subject: [PATCH] work on it --- .../.vitepress/theme/components/react.svg | 12 +- {docs-old => docs}/docgen/docgen.config.cjs | 4 +- .../docgen/docgen.config.react.cjs | 0 .../docgen/docgen.config.vue.cjs | 0 .../docgen/docgen.template.component.cjs | 4 +- .../docgen/docgen.template.events.cjs | 12 +- .../docgen/docgen.template.props.cjs | 4 +- .../docgen/docgen.template.slots.cjs | 0 {docs-old => docs}/docgen/renderType.cjs | 21 +- docs/package.json | 18 +- docs/src/.gitignore | 1 + docs/src/App.vue | 7 +- docs/src/assets/react.svg | 7 + .../theme => docs/src/assets}/theme.css | 0 docs/src/assets/vue.svg | 2 + docs/src/components/DemoWrapper.vue | 5 + docs/src/components/DocsOutline.vue | 125 ++++++++++ docs/src/components/EditButton.vue | 60 +++++ docs/src/components/FrameworkSwitch.vue | 40 ++++ docs/src/components/SideBar.vue | 56 +++++ .../components/vue-live}/react-preview.d.ts | 0 .../src/components/vue-live}/react-preview.js | 0 .../src/components/vue-live}/vue-live.vue | 0 docs/src/layouts/README.md | 11 - docs/src/layouts/default.vue | 213 +++++++++++++++++- docs/src/layouts/home.vue | 7 - docs/src/main.ts | 19 +- .../src/pages}/1-Getting-Started.md | 0 {docs-old => docs/src/pages}/2-Install.md | 0 {docs-old => docs/src/pages}/3-Colors.md | 0 {docs-old => docs/src/pages}/4-Icons.md | 0 docs/src/pages/index.vue | 9 + docs/src/utils/docsPages.ts | 59 +++++ .../src/utils}/figma-link-md-it.ts | 0 docs/src/utils/outline.ts | 70 ++++++ docs/src/utils/patternPages.ts | 35 +++ docs/tsconfig.json | 16 +- .../vercel-build-docs.sh | 0 docs/vite.config.ts | 9 +- package.json | 4 +- scripts/copy-md.mjs | 6 +- yarn.lock | 24 +- 42 files changed, 770 insertions(+), 90 deletions(-) rename {docs-old => docs}/docgen/docgen.config.cjs (90%) rename {docs-old => docs}/docgen/docgen.config.react.cjs (100%) rename {docs-old => docs}/docgen/docgen.config.vue.cjs (100%) rename {docs-old => docs}/docgen/docgen.template.component.cjs (80%) rename {docs-old => docs}/docgen/docgen.template.events.cjs (92%) rename {docs-old => docs}/docgen/docgen.template.props.cjs (95%) rename {docs-old => docs}/docgen/docgen.template.slots.cjs (100%) rename {docs-old => docs}/docgen/renderType.cjs (89%) create mode 100644 docs/src/.gitignore create mode 100644 docs/src/assets/react.svg rename {docs-old/.vitepress/theme => docs/src/assets}/theme.css (100%) create mode 100644 docs/src/assets/vue.svg create mode 100644 docs/src/components/DemoWrapper.vue create mode 100644 docs/src/components/DocsOutline.vue create mode 100644 docs/src/components/EditButton.vue create mode 100644 docs/src/components/FrameworkSwitch.vue create mode 100644 docs/src/components/SideBar.vue rename {docs-old/.vitepress/theme/components => docs/src/components/vue-live}/react-preview.d.ts (100%) rename {docs-old/.vitepress/theme/components => docs/src/components/vue-live}/react-preview.js (100%) rename {docs-old/.vitepress/theme/components => docs/src/components/vue-live}/vue-live.vue (100%) delete mode 100644 docs/src/layouts/README.md delete mode 100644 docs/src/layouts/home.vue rename {docs-old => docs/src/pages}/1-Getting-Started.md (100%) rename {docs-old => docs/src/pages}/2-Install.md (100%) rename {docs-old => docs/src/pages}/3-Colors.md (100%) rename {docs-old => docs/src/pages}/4-Icons.md (100%) create mode 100644 docs/src/pages/index.vue create mode 100644 docs/src/utils/docsPages.ts rename {docs-old/.vitepress => docs/src/utils}/figma-link-md-it.ts (100%) create mode 100644 docs/src/utils/outline.ts create mode 100644 docs/src/utils/patternPages.ts rename vercel-build-docs.sh => docs/vercel-build-docs.sh (100%) diff --git a/docs-old/.vitepress/theme/components/react.svg b/docs-old/.vitepress/theme/components/react.svg index 292c3ab3c..ddfec4ca6 100644 --- a/docs-old/.vitepress/theme/components/react.svg +++ b/docs-old/.vitepress/theme/components/react.svg @@ -1,7 +1,9 @@ - - - - - + + + + + diff --git a/docs-old/docgen/docgen.config.cjs b/docs/docgen/docgen.config.cjs similarity index 90% rename from docs-old/docgen/docgen.config.cjs rename to docs/docgen/docgen.config.cjs index 4475eff60..d5004f51e 100644 --- a/docs-old/docgen/docgen.config.cjs +++ b/docs/docgen/docgen.config.cjs @@ -8,8 +8,8 @@ const slots = require('./docgen.template.slots.cjs') const component = require('./docgen.template.component.cjs') module.exports = defineConfig({ - componentsRoot: 'components/', - outDir: './docs/components', + componentsRoot: '../components/', + outDir: './src/pages/components/', defaultExamples: true, templates: { component, diff --git a/docs-old/docgen/docgen.config.react.cjs b/docs/docgen/docgen.config.react.cjs similarity index 100% rename from docs-old/docgen/docgen.config.react.cjs rename to docs/docgen/docgen.config.react.cjs diff --git a/docs-old/docgen/docgen.config.vue.cjs b/docs/docgen/docgen.config.vue.cjs similarity index 100% rename from docs-old/docgen/docgen.config.vue.cjs rename to docs/docgen/docgen.config.vue.cjs diff --git a/docs-old/docgen/docgen.template.component.cjs b/docs/docgen/docgen.template.component.cjs similarity index 80% rename from docs-old/docgen/docgen.template.component.cjs rename to docs/docgen/docgen.template.component.cjs index 5ca9dd05c..70a2dd01b 100644 --- a/docs-old/docgen/docgen.template.component.cjs +++ b/docs/docgen/docgen.template.component.cjs @@ -17,11 +17,11 @@ description: ${doc.description}` ${doc.docsBlocks - .map((d) => d.replace(new RegExp(`# ${doc.displayName}`, 'g'), '')) + ?.map((d) => d.replace(new RegExp(`# ${doc.displayName}`, 'g'), '')) .join('\n\n')} ${usage.props} ${usage.events} diff --git a/docs-old/docgen/docgen.template.events.cjs b/docs/docgen/docgen.template.events.cjs similarity index 92% rename from docs-old/docgen/docgen.template.events.cjs rename to docs/docgen/docgen.template.events.cjs index 32264b7f4..776efb79c 100644 --- a/docs-old/docgen/docgen.template.events.cjs +++ b/docs/docgen/docgen.template.events.cjs @@ -15,7 +15,7 @@ module.exports = async function renderProp(events, opt) { return ` ${supComponent ? '#' : ''}## Events -${await lineTemplate(events, supComponent)} +${await lineTemplate(events, supComponent ?? false)} ` } @@ -28,7 +28,7 @@ async function lineTemplate(event, supComponent) { const retArray = await Promise.all( event.map(async (ev) => { const properties = await Promise.all( - ev.properties.map( + ev.properties?.map( /** * @param {any} prop */ @@ -38,8 +38,8 @@ async function lineTemplate(event, supComponent) { description: prop.description, type: await renderType(prop.type), } - } - ) + }, + ) ?? [], ) const name = ev.name let t = ev.description ?? '' @@ -61,7 +61,7 @@ ${supComponent ? '#' : ''}##### ${mdclean(p.name)} ${p.description ? mdclean(p.description) : ''}
type: ${p.type ? p.type : ''}
-` +`, ) .join('')} ` @@ -69,7 +69,7 @@ ${p.description ? mdclean(p.description) : ''} } ` - }) + }), ) return retArray.join('') diff --git a/docs-old/docgen/docgen.template.props.cjs b/docs/docgen/docgen.template.props.cjs similarity index 95% rename from docs-old/docgen/docgen.template.props.cjs rename to docs/docgen/docgen.template.props.cjs index 0ee85654d..c4ccf8808 100644 --- a/docs-old/docgen/docgen.template.props.cjs +++ b/docs/docgen/docgen.template.props.cjs @@ -29,7 +29,7 @@ ${supComponent ? '#' : ''}### ${mdclean(p)} ${mdclean(t)} ` - }) + }), ) return retArray.join('') @@ -46,7 +46,7 @@ module.exports = async function renderProp(props, opt) { return ` ${supComponent ? '#' : ''}## Props -${await lineTemplate(props, supComponent)} +${await lineTemplate(props, supComponent ?? false)} --- ` } diff --git a/docs-old/docgen/docgen.template.slots.cjs b/docs/docgen/docgen.template.slots.cjs similarity index 100% rename from docs-old/docgen/docgen.template.slots.cjs rename to docs/docgen/docgen.template.slots.cjs diff --git a/docs-old/docgen/renderType.cjs b/docs/docgen/renderType.cjs similarity index 89% rename from docs-old/docgen/renderType.cjs rename to docs/docgen/renderType.cjs index c1258f182..9a6d7d877 100644 --- a/docs-old/docgen/renderType.cjs +++ b/docs/docgen/renderType.cjs @@ -6,18 +6,19 @@ const { mdclean } = defaultTemplates /** * - * @param {{name:string, schema?:any}} type + * @param {{name:string, schema?:any} | undefined} type * @returns {Promise} */ module.exports = async function renderType(type) { + if (!type) return '' if (type.schema) { return `${await renderComplexTypes( - type.schema + type.schema, )}` } return ( `${mdclean( - type?.name + type?.name, ).replace(/\\\|/g, '|')}` ?? '' ) } @@ -31,7 +32,7 @@ let highlighter = null * * @param {any} schema * @param {boolean} [subType] - * @returns {Promise} + * @returns {Promise} */ async function renderComplexTypes(schema, subType) { if (typeof schema === 'string') { @@ -40,7 +41,7 @@ async function renderComplexTypes(schema, subType) { } if (schema.kind === 'enum') { const values = await Promise.all( - schema.schema.map((v) => renderComplexTypes(v, true)) + schema.schema.map((v) => renderComplexTypes(v, true)), ) const filteredValues = values.filter((v) => v) const overflow = filteredValues.length > 12 @@ -56,8 +57,8 @@ async function renderComplexTypes(schema, subType) { serializedInlineValuesWrapped, `type ${schema.type.replace( ' | undefined', - '' - )} = ${filteredValues.join(' | ')}` + '', + )} = ${filteredValues.join(' | ')}`, ) : serializedInlineValuesWrapped } @@ -69,7 +70,7 @@ async function renderComplexTypes(schema, subType) { } if (schema.kind === 'object') { const obj = Object.values(schema.schema).map((value) => - renderObjectType(value) + renderObjectType(value), ) if (obj.includes(undefined)) return schema.type const code = `interface ${schema.type} { @@ -91,7 +92,7 @@ function renderObjectType(value) { ? /\n/.test(value.description) ? `\t/**\n\t * ${value.description.replace( /(\n\r?)/g, - '$1\t * ' + '$1\t * ', )}\n\t */\n` : `\t/** ${value.description} */\n` : '' @@ -110,6 +111,6 @@ async function makeTooltip(content, popperCode) { popperCode, { lang: 'ts', - } + }, )}` } diff --git a/docs/package.json b/docs/package.json index a28999827..775feb102 100644 --- a/docs/package.json +++ b/docs/package.json @@ -1,16 +1,21 @@ { "name": "@cypress-design/docs", - "version": "0.3.0", + "private": true, + "version": "0.0.1", "files": [ "*" ], "scripts": { - "build": "vite-ssg build", - "dev": "vite --port 3333 --open", - "preview": "vite preview" + "build": "node ../scripts/copy-md.mjs && vue-docgen -c ./docgen/docgen.config.cjs --logLevel=debug && yarn build:components && ./vercel-build-docs.sh", + "docgen:watch": "vue-docgen --watch -c ./docgen/docgen.config.cjs", + "preview": "vite preview", + "dev": "rimraf docs/components && NODE_ENV=development concurrently \"node ../scripts/watch-constants.mjs\" \"yarn docgen:watch\" \"yarn vite dev\"" }, "dependencies": { + "@cypress-design/vue-tooltip": "*", "@types/markdown-it-link-attributes": "^3.0.1", + "@vueuse/head": "^1.3.1", + "concurrently": "^8.2.1", "markdown-it-link-attributes": "^4.0.1", "markdown-it-shiki": "^0.9.0", "react-docgen-typescript": "^2.2.2", @@ -28,5 +33,6 @@ "vue-docgen-cli": "^4.67.0", "vue-live": "^2.5.4", "vue-router": "^4.2.4" - } -} + }, + "license": "MIT" +} \ No newline at end of file diff --git a/docs/src/.gitignore b/docs/src/.gitignore new file mode 100644 index 000000000..26fd3a5a6 --- /dev/null +++ b/docs/src/.gitignore @@ -0,0 +1 @@ +pages/components/* \ No newline at end of file diff --git a/docs/src/App.vue b/docs/src/App.vue index c84e5de56..1ccf45a7d 100644 --- a/docs/src/App.vue +++ b/docs/src/App.vue @@ -1,23 +1,24 @@ + + diff --git a/docs/src/components/EditButton.vue b/docs/src/components/EditButton.vue new file mode 100644 index 000000000..ec7008af8 --- /dev/null +++ b/docs/src/components/EditButton.vue @@ -0,0 +1,60 @@ + + + diff --git a/docs/src/components/FrameworkSwitch.vue b/docs/src/components/FrameworkSwitch.vue new file mode 100644 index 000000000..1864908aa --- /dev/null +++ b/docs/src/components/FrameworkSwitch.vue @@ -0,0 +1,40 @@ + + + diff --git a/docs/src/components/SideBar.vue b/docs/src/components/SideBar.vue new file mode 100644 index 000000000..6989a8ba0 --- /dev/null +++ b/docs/src/components/SideBar.vue @@ -0,0 +1,56 @@ + + + diff --git a/docs-old/.vitepress/theme/components/react-preview.d.ts b/docs/src/components/vue-live/react-preview.d.ts similarity index 100% rename from docs-old/.vitepress/theme/components/react-preview.d.ts rename to docs/src/components/vue-live/react-preview.d.ts diff --git a/docs-old/.vitepress/theme/components/react-preview.js b/docs/src/components/vue-live/react-preview.js similarity index 100% rename from docs-old/.vitepress/theme/components/react-preview.js rename to docs/src/components/vue-live/react-preview.js diff --git a/docs-old/.vitepress/theme/components/vue-live.vue b/docs/src/components/vue-live/vue-live.vue similarity index 100% rename from docs-old/.vitepress/theme/components/vue-live.vue rename to docs/src/components/vue-live/vue-live.vue diff --git a/docs/src/layouts/README.md b/docs/src/layouts/README.md deleted file mode 100644 index 0669ec932..000000000 --- a/docs/src/layouts/README.md +++ /dev/null @@ -1,11 +0,0 @@ -## Layouts - -Vue components in this dir are used as layouts. - -By default, `default.vue` will be used unless an alternative is specified in the route meta. - -With [`vite-plugin-pages`](https://github.com/hannoeru/vite-plugin-pages) and [`vite-plugin-vue-layouts`](https://github.com/JohnCampionJr/vite-plugin-vue-layouts), you can specify the layout in the page's SFCs like this: - -```html - meta: layout: home -``` diff --git a/docs/src/layouts/default.vue b/docs/src/layouts/default.vue index 70542da9b..3fdfda452 100644 --- a/docs/src/layouts/default.vue +++ b/docs/src/layouts/default.vue @@ -1,7 +1,210 @@ + + diff --git a/docs/src/layouts/home.vue b/docs/src/layouts/home.vue deleted file mode 100644 index f4c6e8bc0..000000000 --- a/docs/src/layouts/home.vue +++ /dev/null @@ -1,7 +0,0 @@ - diff --git a/docs/src/main.ts b/docs/src/main.ts index 989288d42..ad83c7214 100644 --- a/docs/src/main.ts +++ b/docs/src/main.ts @@ -1,9 +1,13 @@ +import './assets/theme.css' import './assets/markdown.scss' import './assets/fonts/fonts.css' import { ViteSSG } from 'vite-ssg' import { setupLayouts } from 'virtual:generated-layouts' +import Tooltip from '@cypress-design/vue-tooltip' import App from './App.vue' +import VueLiveWithLayout from './components/vue-live/vue-live.vue' +import DemoWrapper from './components/DemoWrapper.vue' import generatedRoutes from '~pages' const routes = setupLayouts(generatedRoutes) @@ -11,14 +15,13 @@ const routes = setupLayouts(generatedRoutes) // https://github.com/antfu/vite-ssg export const createApp = ViteSSG( App, - { routes, base: import.meta.env.BASE_URL }, + { + routes, + base: import.meta.env.BASE_URL, + }, (ctx) => { - // install all modules under `modules/` - // Object.values( - // import.meta.glob<{ install: UserModule }>('./modules/*.ts', { - // eager: true, - // }), - // ).forEach((i) => i.install?.(ctx)) - // ctx.app.use(Previewer) + ctx.app.component('VueLive', VueLiveWithLayout) + ctx.app.component('Tooltip', Tooltip) + ctx.app.component('DemoWrapper', DemoWrapper) }, ) diff --git a/docs-old/1-Getting-Started.md b/docs/src/pages/1-Getting-Started.md similarity index 100% rename from docs-old/1-Getting-Started.md rename to docs/src/pages/1-Getting-Started.md diff --git a/docs-old/2-Install.md b/docs/src/pages/2-Install.md similarity index 100% rename from docs-old/2-Install.md rename to docs/src/pages/2-Install.md diff --git a/docs-old/3-Colors.md b/docs/src/pages/3-Colors.md similarity index 100% rename from docs-old/3-Colors.md rename to docs/src/pages/3-Colors.md diff --git a/docs-old/4-Icons.md b/docs/src/pages/4-Icons.md similarity index 100% rename from docs-old/4-Icons.md rename to docs/src/pages/4-Icons.md diff --git a/docs/src/pages/index.vue b/docs/src/pages/index.vue new file mode 100644 index 000000000..6254b23e8 --- /dev/null +++ b/docs/src/pages/index.vue @@ -0,0 +1,9 @@ + + + diff --git a/docs/src/utils/docsPages.ts b/docs/src/utils/docsPages.ts new file mode 100644 index 000000000..caf77ba51 --- /dev/null +++ b/docs/src/utils/docsPages.ts @@ -0,0 +1,59 @@ +import { Ref, computed } from 'vue' + +const componentDocsPages = import.meta.glob('../../../components/*/ReadMe.md') +const docsPages = import.meta.glob('../pages/*.md') + +export function getDocsPages(routePath: Ref) { + const routeMapComponent = Object.keys(componentDocsPages).reduce( + (acc, p) => { + const serverRoute = p + .replace(/^\.\.\/\.\.\/\.\./, '') + .replace(/\/(\w+)\/ReadMe.md$/, '/$1.md') + + const clientRoute = serverRoute.replace(/\.md$/, '') + + ;['react', 'vue'].forEach((framework: string) => { + const serverRouteComplete = serverRoute.replace( + /\/components\//, + `/components/${framework}/`, + ) + acc[serverRouteComplete.replace(/\.md$/, '')] = clientRoute + }) + + return acc + }, + {} as Record, + ) + + const routeMap = Object.keys(docsPages).reduce((acc, p) => { + const serverRoute = p.replace(/^\.\.\/pages/, '') + + const clientRoute = serverRoute + .replace(/\.md$/, '') + .replace(/\/\d+-(\w)/g, '/$1') + .replace(/Getting-Started$/, '') + + acc[clientRoute] = serverRoute + return acc + }, routeMapComponent) + + const items = computed(() => + Object.keys(routeMap).map((clientRoute) => { + return { + text: + clientRoute === '/' + ? 'Getting Started' + : clientRoute + .split('/') + .pop() + ?.replace(/^\d+-(\w)/g, '$1') + .replace(/-/g, ' ') ?? '', + href: clientRoute, + active: + routePath.value.endsWith(`${clientRoute}.html`) || + (routePath.value === '/' && clientRoute === '/'), + } + }), + ) + return { items, routeMap, routeMapComponent } +} diff --git a/docs-old/.vitepress/figma-link-md-it.ts b/docs/src/utils/figma-link-md-it.ts similarity index 100% rename from docs-old/.vitepress/figma-link-md-it.ts rename to docs/src/utils/figma-link-md-it.ts diff --git a/docs/src/utils/outline.ts b/docs/src/utils/outline.ts new file mode 100644 index 000000000..0b5095ef7 --- /dev/null +++ b/docs/src/utils/outline.ts @@ -0,0 +1,70 @@ +import { NavItemLink, NavGroup } from '@cypress-design/vue-docmenu' + +export function getHeaders(range: [number, number]) { + const headers = [...document.querySelectorAll('main h2,main h3')] + .filter((el) => el.id && el.hasChildNodes()) + .map((el) => { + const level = Number(el.tagName[1]) + return { + text: serializeHeader(el), + href: '#' + el.id, + level, + } + }) + + return resolveHeaders(headers, range) +} + +function serializeHeader(h: Element): string { + let ret = '' + for (const node of h.childNodes) { + if (node.nodeType === 1) { + if ( + (node as Element).classList.contains('VPBadge') || + (node as Element).classList.contains('header-anchor') + ) { + continue + } + ret += node.textContent + } else if (node.nodeType === 3) { + ret += node.textContent + } + } + return ret.trim() +} + +export interface NavLinkExtended extends NavItemLink { + level: number +} + +export function resolveHeaders( + headers: NavLinkExtended[], + range: [number, number] = [2, 3], +) { + const [high, low] = range + + headers = headers.filter((h) => h.level >= high && h.level <= low) + + const ret: (NavGroup | NavItemLink)[] = [] + outer: for (let i = 0; i < headers.length; i++) { + const cur = headers[i] + if (i === 0) { + ret.push(cur) + } else { + for (let j = i - 1; j >= 0; j--) { + const prev = headers[j] + if (prev.level < cur.level) { + const prevGroup = prev as unknown as NavGroup + if (!prevGroup.items) { + prevGroup.items = [] + } + prevGroup.items.push(cur) + continue outer + } + } + ret.push(cur) + } + } + + return ret +} diff --git a/docs/src/utils/patternPages.ts b/docs/src/utils/patternPages.ts new file mode 100644 index 000000000..e91dce849 --- /dev/null +++ b/docs/src/utils/patternPages.ts @@ -0,0 +1,35 @@ +import { Ref, computed } from 'vue' + +const patternPages = import.meta.glob('../../../patterns/*.md') + +export function getPatternPages(routePath: Ref) { + const routeMap = Object.keys(patternPages).reduce( + (acc, p) => { + const serverRoute = p.replace(/^\.\.\/\.\.\/\.\./, '') + + const clientRoute = serverRoute + .replace(/\.md$/, '') + .replace(/\/\d+-(\w)/g, '/$1') + + acc[clientRoute] = serverRoute + return acc + }, + {} as Record, + ) + + const items = computed(() => + Object.keys(routeMap).map((clientRoute) => { + return { + text: + clientRoute + .split('/') + .pop() + ?.replace(/^\d+-(\w)/g, '$1') + .replace(/-/g, ' ') ?? '', + href: clientRoute, + active: routePath.value.endsWith(`${clientRoute}.html`), + } + }), + ) + return { items, routeMap } +} diff --git a/docs/tsconfig.json b/docs/tsconfig.json index d51735c78..f77615854 100644 --- a/docs/tsconfig.json +++ b/docs/tsconfig.json @@ -13,7 +13,6 @@ "resolveJsonModule": true, "noUnusedLocals": true, "strictNullChecks": true, - "allowJs": true, "forceConsistentCasingInFileNames": true, "types": [ "vite/client", @@ -24,11 +23,12 @@ "~/*": ["src/*"] } }, - "vueCompilerOptions": { - "plugins": [ - "@vue-macros/volar/define-models", - "@vue-macros/volar/define-slots" - ] - }, - "exclude": ["dist", "node_modules", "cypress"] + "include": [ + "*.d.ts", + "src/**/*.ts", + "src/**/*.d.ts", + "src/**/*.tsx", + "src/**/*.vue" + ], + "exclude": ["dist", "node_modules"] } diff --git a/vercel-build-docs.sh b/docs/vercel-build-docs.sh similarity index 100% rename from vercel-build-docs.sh rename to docs/vercel-build-docs.sh diff --git a/docs/vite.config.ts b/docs/vite.config.ts index 48b8ed987..c8fcfa53d 100644 --- a/docs/vite.config.ts +++ b/docs/vite.config.ts @@ -7,6 +7,7 @@ import generateSitemap from 'vite-ssg-sitemap' import Markdown from 'vite-plugin-vue-markdown' import LinkAttributes from 'markdown-it-link-attributes' import Shiki from 'markdown-it-shiki' +import FigmaLink from './src/utils/figma-link-md-it' export default defineConfig({ resolve: { @@ -33,12 +34,7 @@ export default defineConfig({ headEnabled: true, markdownItSetup(md) { // https://prismjs.com/ - md.use(Shiki, { - theme: { - light: 'vitesse-light', - dark: 'vitesse-dark', - }, - }) + md.use(Shiki) md.use(LinkAttributes, { matcher: (link: string) => /^https?:\/\//.test(link), attrs: { @@ -46,6 +42,7 @@ export default defineConfig({ rel: 'noopener', }, }) + md.use(FigmaLink) }, }), ], diff --git a/package.json b/package.json index 9b3b6986d..65c0d7927 100644 --- a/package.json +++ b/package.json @@ -19,6 +19,7 @@ "test/*" ], "scripts": { + "start": "yarn workspace @cypress-design/docs run dev", "cy": "concurrently \"cypress open --component\" \"node ./scripts/watch-constants.mjs\"", "cy:run": "cypress run --component", "test": "vitest", @@ -26,8 +27,6 @@ "build:components": "turbo run --no-daemon build --filter=\"@cypress-design/vue-*\" --filter=\"@cypress-design/react-*\" --filter=\"@cypress-design/constants-*\"", "dev": "yarn start", "docs": "yarn start", - "start": "rimraf docs/components && NODE_ENV=development concurrently \"node ./scripts/watch-constants.mjs\" \"vue-docgen --watch -c docs/docgen/docgen.config.cjs\" \"vitepress dev docs\"", - "build:docs": "node scripts/copy-md.mjs && vue-docgen -c docs/docgen/docgen.config.cjs --logLevel=debug && yarn build:components && ./vercel-build-docs.sh", "postinstall": "yarn husky install && node scripts/capitalize-icon.mjs && yarn build:components", "new:component": "hygen component new" }, @@ -66,7 +65,6 @@ "axe-core": "^4.7.2", "chokidar": "^3.5.3", "chroma-js": "^2.4.2", - "concurrently": "^8.2.1", "cypress": "^12.17.4", "cypress-axe": "^1.4.0", "cypress-real-events": "^1.10.1", diff --git a/scripts/copy-md.mjs b/scripts/copy-md.mjs index fdd65c4ab..4074201f7 100755 --- a/scripts/copy-md.mjs +++ b/scripts/copy-md.mjs @@ -14,7 +14,7 @@ import * as url from 'url' const __dirname = url.fileURLToPath(new URL('.', import.meta.url)) async function createFileAndDirectory(dest, fileContents) { - const destFullPath = resolve(__dirname, '..', 'docs', dest) + const destFullPath = resolve(__dirname, '..', 'docs/src/pages', dest) const destDir = dirname(destFullPath) await fs.mkdir(destDir, { recursive: true }) return fs.writeFile(destFullPath, fileContents, 'utf8') @@ -41,10 +41,10 @@ layout: none return Promise.all([ createFileAndDirectory( path.replace(/\/ReadMe\.md$/i, '.md'), - fileContents + fileContents, ), ]) - }) + }), ) console.log('Generated all component readmes to docs') })() diff --git a/yarn.lock b/yarn.lock index 5ef13d7e3..769c71236 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1666,7 +1666,7 @@ "@typescript-eslint/types" "6.4.1" eslint-visitor-keys "^3.4.1" -"@unhead/dom@1.3.9", "@unhead/dom@^1.1.32": +"@unhead/dom@1.3.9", "@unhead/dom@^1.1.32", "@unhead/dom@^1.3.1": version "1.3.9" resolved "https://registry.yarnpkg.com/@unhead/dom/-/dom-1.3.9.tgz#a2d713bd8a0a411ce26e6756d4095e26231f97b6" integrity sha512-bTbPFjXjmk8MC0cBC+7Bgf0Mcw62gsE2XqOhMH/qQo6NP4vR2XGxqy054Y7MGurznR1JVAqxUiU3cR/oxWFk3g== @@ -1674,7 +1674,7 @@ "@unhead/schema" "1.3.9" "@unhead/shared" "1.3.9" -"@unhead/schema@1.3.9": +"@unhead/schema@1.3.9", "@unhead/schema@^1.3.1": version "1.3.9" resolved "https://registry.yarnpkg.com/@unhead/schema/-/schema-1.3.9.tgz#9312a2ecaf554f7c9d1f14ba7d05906182fbaffa" integrity sha512-iIa0dczd2qTOxwYZbVR+iAKdlELnLTlKSFsN/YuJ/33sRi5VFa9D8TDBEPLec9gpcjB/bH0FhERfR4bb4UbRuA== @@ -1689,7 +1689,15 @@ dependencies: "@unhead/schema" "1.3.9" -"@unhead/vue@^1.1.32", "@unhead/vue@^1.3.9": +"@unhead/ssr@^1.3.1": + version "1.3.9" + resolved "https://registry.yarnpkg.com/@unhead/ssr/-/ssr-1.3.9.tgz#6a3e332fcc347f05c0f4982a98a060626758a474" + integrity sha512-FTt4IQOAxHiSfRM7IoJJiFnUEBH8CG5zkJOQ/LydG19QpYa9/AGOi4xvngeCr++1as51p2hWoRO6gPxSRhV8cA== + dependencies: + "@unhead/schema" "1.3.9" + "@unhead/shared" "1.3.9" + +"@unhead/vue@^1.1.32", "@unhead/vue@^1.3.1", "@unhead/vue@^1.3.9": version "1.3.9" resolved "https://registry.yarnpkg.com/@unhead/vue/-/vue-1.3.9.tgz#20adeecaf0feb7823be3a91f7f98d0f9ac54f6b9" integrity sha512-rVAsRLBc+3Y//NRmr7vmRs5yhIf65jYSvcj0V5DtDfDwql7BbGgc3VIIEvY0+EjLQuNsS5kxwm78LSPCIl/3Xw== @@ -1982,6 +1990,16 @@ "@vueuse/shared" "10.4.1" vue-demi ">=0.14.5" +"@vueuse/head@^1.3.1": + version "1.3.1" + resolved "https://registry.yarnpkg.com/@vueuse/head/-/head-1.3.1.tgz#2baa11a8fd4f3f763474792c4ff91c818bf83051" + integrity sha512-XCcHGfDzkGlHS7KIPJVYN//L7jpfASLsN7MUE19ndHVQLnPIDxqFLDl7IROsY81PKzawVAUe4OYVWcGixseWxA== + dependencies: + "@unhead/dom" "^1.3.1" + "@unhead/schema" "^1.3.1" + "@unhead/ssr" "^1.3.1" + "@unhead/vue" "^1.3.1" + "@vueuse/integrations@^10.4.1": version "10.4.1" resolved "https://registry.yarnpkg.com/@vueuse/integrations/-/integrations-10.4.1.tgz#a48356a0bad49f5e724cd9acaebd73d2b66f22a9"