@md-plugins/quasar-app-extension-q-press 0.1.0-beta.2 → 0.1.0-beta.21

package/dist/templates/init/src/markdown/guides/faq.md

@@ -1,115 +0,0 @@
----
-title: Frequently Asked Questions
-desc: Common questions and answers about Markdown Plugins.
----
-
-## General Questions
-
-### What are Markdown Plugins?
-
-Markdown Plugins are tools that extend the functionality of Markdown, allowing you to add custom syntax, enhanced components, and custom styling to your Markdown documents. They help improve the accessibility, styling, and interactivity of your content.
-
-### How do I install Markdown Plugins?
-
-You can install Markdown Plugins using npm, yarn, or pnpm. Here is an example using npm:
-
-```bash
-npm install @md-plugins/vite-md-plugin
-```
-
-Refer to the **Installation** section of each plugin's documentation for detailed instructions.
-
-### How do I configure Markdown Plugins?
-
-Configuration varies depending on the plugin. Generally, you will need to import the plugin and use it with your Markdown processor (e.g., MarkdownIt). Refer to the **Configuration** section of each plugin's documentation for detailed instructions.
-
-## Plugin-Specific Questions
-
-### How do I add custom classes to images?
-
-You can use the `image` plugin to add custom classes to images. Here is an example configuration:
-
-```typescript
-import MarkdownIt from 'markdown-it'
-import { imagePlugin } from '@md-plugins/md-plugin-image'
-
-const md = new MarkdownIt()
-
-md.use(imagePlugin, {
-  imageClass: 'custom-image-class',
-})
-```
-
-### How do I extract and process frontmatter content?
-
-You can use the `frontmatter` plugin to extract and process frontmatter content from your Markdown files. Here is an example configuration:
-
-```typescript
-import MarkdownIt from 'markdown-it'
-import { frontmatterPlugin } from '@md-plugins/md-plugin-frontmatter'
-
-const md = new MarkdownIt()
-
-md.use(frontmatterPlugin, {
-  grayMatterOptions: {
-    excerpt: true,
-    excerpt_separator: '<!-- more -->',
-  },
-  renderExcerpt: true,
-})
-
-const env: MarkdownItEnv = {}
-const html = md.render(code, env)
-
-console.log(env.frontmatter)
-```
-
-### How do I enhance code block rendering?
-
-You can use the `codeblocks` plugin to enhance code block rendering with syntax highlighting, tabs, and more. Here is an example configuration:
-
-```typescript
-import MarkdownIt from 'markdown-it'
-import { codeblocksPlugin } from '@md-plugins/md-plugin-codeblocks'
-
-const md = new MarkdownIt()
-
-md.use(codeblocksPlugin, {
-  defaultLang: 'javascript',
-  containerComponent: 'MarkdownPrerender',
-  copyButtonComponent: 'MarkdownCopyButton',
-})
-```
-
-### How do I convert Markdown links into Vue components?
-
-You can use the `link` plugin to convert Markdown links into Vue components for SPA-friendly routing. Here is an example configuration:
-
-```typescript
-import MarkdownIt from 'markdown-it'
-import { linkPlugin } from '@md-plugins/md-plugin-link'
-
-const md = new MarkdownIt()
-
-md.use(linkPlugin, {
-  linkTag: 'RouterLink', // or 'router-link'
-  linkToKeyword: 'to',
-  pageScript: 'import { RouterLink } from "vue-router"',
-})
-```
-
-## Troubleshooting
-
-### My Markdown content is not rendering correctly. What should I do?
-
-Ensure that you have correctly installed and configured the plugins. Check the console for any error messages and refer to the documentation for troubleshooting tips. If the issue persists, reach out to our support team for assistance.
-
-### How do I report a bug or request a feature?
-
-You can report bugs or request features by opening an issue on the GitHub repository of the respective plugin. Provide as much detail as possible to help us understand and address your request.
-
-## Support
-
-If you have any other questions or need further assistance, please refer to the Support page or contact our support team.
-
-Happy coding!

package/dist/templates/init/src/markdown/guides/upgrade-guide.md

@@ -1,92 +0,0 @@
----
-title: Upgrade Guide
-desc: Upgrade MD-Plugins and Q-Press to the 0.1.0 beta.
-related:
-  - quasar-app-extensions/qpress/overview
-  - quasar-app-extensions/vite-md-plugin-app-ext/overview
-  - vite-plugins/vite-md-plugin/overview
----
-
-The `0.1.0` beta line moves MD-Plugins and Q-Press to the Quasar CLI Vite 3 beta toolchain. It is the right version to use when your Quasar application is being upgraded to `@quasar/app-vite` `>=3.0.0-beta.14`.
-
-::: warning
-Q-Press and the Quasar app extensions now target Quasar Vite projects using `@quasar/app-vite` `>=3.0.0-beta.14`. They are not intended for Webpack projects or JavaScript-only Quasar projects.
-:::
-
-## Before You Upgrade
-
-- Make sure your app is already on a Quasar Vite setup.
-- Upgrade the app to `@quasar/app-vite` `>=3.0.0-beta.14`.
-- Use TypeScript in the consuming Quasar project.
-- Import `defineConfig` in `quasar.config.ts` directly from `@quasar/app-vite`.
-- Use `/// <reference types="@quasar/app-vite/client" />` in `src/env.d.ts`.
-- Commit or stash local changes before invoking Q-Press, because the update flow can overwrite files in `src/.q-press`.
-
-## Update Packages
-
-For Q-Press projects, update the app extension package and then invoke it:
-
-```bash
-pnpm up @md-plugins/quasar-app-extension-q-press@beta
-quasar ext invoke @md-plugins/q-press
-```
-
-When prompted, choose `Overwrite All` if you want the generated Q-Press files to match the beta templates.
-
-For direct Vite plugin usage, update the packages you consume:
-
-```bash
-pnpm up @md-plugins/vite-md-plugin@beta @md-plugins/vite-examples-plugin@beta
-```
-
-## File Name Check
-
-Q-Press installs and updates this type shim:
-
-```text
-src/q-press.globals.d.ts
-```
-
-If your project still references `src/q-press.global.d.ts`, rename the reference to the plural `globals` filename.
-
-## Environment Variable Changes
-
-Quasar CLI Vite 3 exposes runtime flags through `import.meta.env`. If you copied older Q-Press internals into your own code, update them:
-
-| Old pattern                   | New pattern                              |
-| ----------------------------- | ---------------------------------------- |
-| `process.env.CLIENT`          | `import.meta.env.QUASAR_CLIENT`          |
-| `process.env.SERVER`          | `import.meta.env.QUASAR_SERVER`          |
-| `process.env.DEV`             | `import.meta.env.QUASAR_DEV`             |
-| `process.env.PROD`            | `import.meta.env.QUASAR_PROD`            |
-| `process.env.VUE_ROUTER_MODE` | `import.meta.env.QUASAR_VUE_ROUTER_MODE` |
-| `process.env.VUE_ROUTER_BASE` | `import.meta.env.QUASAR_VUE_ROUTER_BASE` |
-
-Q-Press also uses `QCLI_*` values for Quasar CLI provided build-time values, such as search index and filesystem paths.
-
-## Vite Plugin Configuration
-
-`viteMdPlugin` should be configured with an options object:
-
-```ts
-import { viteMdPlugin, type MenuItem } from '@md-plugins/vite-md-plugin'
-
-vitePlugins: [
-  viteMdPlugin({
-    path: ctx.appPaths.srcDir + '/markdown',
-    menu: sidebar as MenuItem[],
-  }),
-]
-```
-
-## Verify The Upgrade
-
-Run these checks in the consuming app:
-
-```bash
-pnpm install
-quasar prepare
-quasar build
-```
-
-If you use linting or formatting, run those checks after invoking Q-Press so any regenerated files are included.

package/dist/templates/init/src/markdown/other/release-notes.md

@@ -1,8 +0,0 @@
----
-title: Release Notes
-desc: The changelog for MD-Plugins packages.
----
-
-Release notes (with changelog) for MD-Plugins packages are available on [GitHub Releases](https://github.com/md-plugins/md-plugins/releases).
-
-If you are moving from the alpha packages to the `0.1.0` beta line, read the [Upgrade Guide](/guides/upgrade-guide) before updating a project.

package/dist/templates/init/src/q-press.globals.d.ts

@@ -1,36 +0,0 @@
-declare module '*.md'
-
-// Define types for headers
-interface TocMenuItem {
-  id: string
-  level: number
-  title: string
-  link?: string
-  deep?: boolean
-  sub?: boolean
-  onClick?: () => void
-  children?: TocMenuItem[]
-}
-
-// Define types for Markdown modules
-interface MarkdownModule {
-  title?: string
-  headers?: TocMenuItem[]
-  frontmatter?: Record<string, unknown>
-  filename?: string
-  render: (..._args: unknown[]) => unknown
-}
-
-// Define types for menu items
-interface MenuItem {
-  name: string
-  path?: string
-  icon?: string
-  iconColor?: string
-  rightIcon?: string
-  rightIconColor?: string
-  badge?: string
-  children?: MenuItem[] | undefined
-  external?: boolean
-  expanded?: boolean
-}

package/dist/templates/update/src/_q-press/api/components/MarkdownCodePrism.json

@@ -1,29 +0,0 @@
-{
-  "type": "component",
-  "meta": {
-    "docsUrl": "https://path-to-your-docs/markdown-code-prism"
-  },
-  "props": {
-    "code": {
-      "type": "String",
-      "desc": "The code to display with syntax highlighting",
-      "examples": [
-        "'const a = 1;'",
-        "'<div>Hello World</div>'"
-      ],
-      "required": true,
-      "category": "content"
-    },
-    "lang": {
-      "type": "String",
-      "desc": "Language of the code for syntax highlighting",
-      "examples": [
-        "'js'",
-        "'html'",
-        "'css'"
-      ],
-      "required": true,
-      "category": "content"
-    }
-  }
-}

package/dist/templates/update/src/_q-press/components/MarkdownCodePrism.ts

@@ -1,36 +0,0 @@
-import Prism from 'prismjs'
-import { h, computed, defineComponent, type PropType } from 'vue'
-
-export default defineComponent({
-  name: 'MarkdownCodePrism',
-
-  props: {
-    code: {
-      type: String as PropType<string>,
-      required: true,
-    },
-    lang: {
-      type: String as PropType<string>,
-      required: true,
-    },
-  },
-
-  setup(props) {
-    const html = computed(() => {
-      if (!props.code || !props.lang) {
-        return ''
-      }
-
-      return Prism.highlight(props.code, Prism.languages[props.lang] as Prism.Grammar, props.lang)
-    })
-
-    return () =>
-      h(
-        'pre',
-        {
-          class: `markdown-code language-${props.lang}`,
-        },
-        [h('code', { innerHTML: html.value })],
-      )
-  },
-})

package/dist/templates/update/src/_q-press/css/prism-theme.scss

@@ -1,298 +0,0 @@
-.markdown-code {
-  margin: 0;
-  position: relative;
-  overflow: auto;
-  border-radius: inherit;
-
-  code {
-    display: block;
-    padding: 16px;
-    width: fit-content;
-    min-width: 100%;
-
-    font-size: ($font-size - 2px);
-    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
-    line-height: 1.5em;
-    tab-size: 2;
-    text-align: left;
-    white-space: pre;
-    word-spacing: normal;
-    word-break: normal;
-    word-wrap: normal;
-    hyphens: none;
-
-    color: inherit;
-    background-color: inherit;
-    border-radius: inherit;
-  }
-
-  &--copying {
-    .c-lpref,
-    .c-line,
-    .token.deleted-sign,
-    .token.prefix {
-      display: none;
-    }
-  }
-}
-
-.c-line {
-  position: relative;
-  display: block;
-  width: 100%;
-  height: 0;
-  &:before {
-    content: ' ';
-    position: absolute;
-    pointer-events: none;
-    top: 1px;
-    left: -16px;
-    right: -16px;
-    height: 1.5em;
-  }
-}
-
-.c-lpref {
-  position: sticky;
-  pointer-events: none;
-  user-select: none;
-  left: 8px;
-  padding: 0 16px 0 8px;
-  margin: -16px 0 -16px -8px;
-  &:before {
-    border-right: 1px solid;
-    content: '';
-    position: absolute;
-    pointer-events: none;
-    top: -1px;
-    left: -8px;
-    right: 8px;
-    bottom: -2px;
-    z-index: -1;
-    height: 1.5em;
-  }
-}
-
-.line-add:before,
-.token.inserted-sign:before {
-  background: rgba($positive, 0.4);
-}
-
-.token.deleted-sign,
-.token.inserted-sign {
-  position: relative;
-  display: block;
-  width: 100%;
-
-  &:before {
-    content: '';
-    position: absolute;
-    pointer-events: none;
-    top: 0;
-    left: -16px;
-    right: -16px;
-    bottom: 0;
-  }
-}
-
-.token.prefix {
-  margin-right: 8px;
-}
-
-body.body--light {
-  .markdown-code {
-    color: $brand-light-codeblock-text;
-    background-color: $brand-light-codeblock-bg;
-  }
-
-  .line-highlight:before {
-    background: rgba($grey, 0.2);
-  }
-  .line-rem:before,
-  .token.deleted-sign:before {
-    background: rgba($negative, 0.2);
-  }
-
-  .c-lpref {
-    color: $brand-light-codeblock-text;
-    &:before {
-      border-right-color: $separator-color;
-      background: $brand-light-codeblock-bg;
-    }
-  }
-
-  .token.comment,
-  .token.block-comment,
-  .token.prolog,
-  .token.doctype,
-  .token.cdata {
-    color: #7d8b99;
-  }
-
-  .token {
-    &.punctuation {
-      color: #5f6364;
-    }
-    &.important {
-      font-weight: 400;
-    }
-    &.bold {
-      font-weight: 700;
-    }
-    &.italic {
-      font-style: italic;
-    }
-    &.entity {
-      cursor: help;
-    }
-  }
-
-  .token.property,
-  .token.tag,
-  .token.boolean,
-  .token.number,
-  .token.function-name,
-  .token.constant,
-  .token.symbol,
-  .token.deleted {
-    color: #c92c2c;
-  }
-
-  .token.selector,
-  .token.attr-name,
-  .token.string,
-  .token.char,
-  .token.function,
-  .token.builtin,
-  .token.inserted {
-    color: #2f9c0a;
-  }
-
-  .token.operator,
-  .token.entity,
-  .token.url,
-  .token.variable {
-    color: #da5a20;
-  }
-
-  .token.atrule,
-  .token.attr-value,
-  .token.keyword,
-  .token.class-name {
-    color: #1990b8;
-  }
-
-  .token.regex,
-  .token.important {
-    color: #e90;
-  }
-
-  .language-css .token.string,
-  .style .token.string {
-    color: #a67f59;
-    background: rgba(255, 255, 255, 0.5);
-  }
-
-  .namespace {
-    opacity: 0.7;
-  }
-
-  .token.tab:not(:empty):before,
-  .token.cr:before,
-  .token.lf:before {
-    color: #e0d7d1;
-  }
-}
-
-body.body--dark {
-  .markdown-code {
-    color: $brand-dark-codeblock-text;
-    background-color: $brand-dark-codeblock-bg;
-  }
-
-  .line-highlight:before {
-    background: rgba($grey-3, 0.2);
-  }
-  .line-rem:before,
-  .token.deleted-sign:before {
-    background: rgba($red, 0.3);
-  }
-
-  .c-lpref {
-    color: $brand-light-codeblock-text;
-    &:before {
-      border-right-color: $separator-dark-color;
-      background: $brand-dark-codeblock-bg;
-    }
-  }
-
-  .token.comment,
-  .token.prolog,
-  .token.doctype,
-  .token.cdata {
-    color: #d4d0ab;
-  }
-
-  .token.punctuation {
-    color: #fefefe;
-  }
-
-  .token.property,
-  .token.tag,
-  .token.constant,
-  .token.symbol,
-  .token.deleted {
-    color: #ffa07a;
-  }
-
-  .token.boolean,
-  .token.number {
-    color: #00e0e0;
-  }
-
-  .token.selector,
-  .token.attr-name,
-  .token.string,
-  .token.char,
-  .token.builtin,
-  .token.inserted {
-    color: #abe338;
-  }
-
-  .token.operator,
-  .token.entity,
-  .token.url,
-  .language-css .token.string,
-  .style .token.string,
-  .token.variable {
-    color: #00e0e0;
-  }
-
-  .token.atrule,
-  .token.attr-value,
-  .token.function {
-    color: #ffd700;
-  }
-
-  .token.keyword {
-    color: #00e0e0;
-  }
-
-  .token.regex,
-  .token.important {
-    color: #ffd700;
-  }
-
-  .token.important,
-  .token.bold {
-    font-weight: 700;
-  }
-
-  .token.italic {
-    font-style: italic;
-  }
-
-  .token.entity {
-    cursor: help;
-  }
-}

package/dist/templates/update/src/q-press.globals.d.ts

@@ -1,36 +0,0 @@
-declare module '*.md'
-
-// Define types for headers
-interface TocMenuItem {
-  id: string
-  level: number
-  title: string
-  link?: string
-  deep?: boolean
-  sub?: boolean
-  onClick?: () => void
-  children?: TocMenuItem[]
-}
-
-// Define types for Markdown modules
-interface MarkdownModule {
-  title?: string
-  headers?: TocMenuItem[]
-  frontmatter?: Record<string, unknown>
-  filename?: string
-  render: (..._args: unknown[]) => unknown
-}
-
-// Define types for menu items
-interface MenuItem {
-  name: string
-  path?: string
-  icon?: string
-  iconColor?: string
-  rightIcon?: string
-  rightIconColor?: string
-  badge?: string
-  children?: MenuItem[] | undefined
-  external?: boolean
-  expanded?: boolean
-}

package/src/templates/init/src/_q-press/api/components/MarkdownCodePrism.json

@@ -1,29 +0,0 @@
-{
-  "type": "component",
-  "meta": {
-    "docsUrl": "https://path-to-your-docs/markdown-code-prism"
-  },
-  "props": {
-    "code": {
-      "type": "String",
-      "desc": "The code to display with syntax highlighting",
-      "examples": [
-        "'const a = 1;'",
-        "'<div>Hello World</div>'"
-      ],
-      "required": true,
-      "category": "content"
-    },
-    "lang": {
-      "type": "String",
-      "desc": "Language of the code for syntax highlighting",
-      "examples": [
-        "'js'",
-        "'html'",
-        "'css'"
-      ],
-      "required": true,
-      "category": "content"
-    }
-  }
-}