@sit-onyx/comark 0.2.0 → 0.3.0-dev-20261009105419

package/README.md

@@ -10,8 +10,8 @@ Render markdown content with [onyx](https://onyx.schwarz/) components.
 
 It's a wrapper for the [@comark/vue](https://www.npmjs.com/package/@comark/vue) package using the onyx design system created by [Schwarz Digits](https://schwarz-digits.de).
 
-For runtime parsing and rendering of markdown use the [`OnyxComark`](#onyxcomark) component.
-Otherwise use the [`OnyxComarkRenderer`](#onyxcomarkrenderer) for server and build-time parsing with less client code required.
+For runtime parsing and rendering of markdown use the [`OnyxMarkdown`](#onyxmarkdown) component.
+Otherwise use the [`OnyxMarkdownDocument`](#onyxmarkdowndocument) for server and build-time parsing with less client code required.
 
 ## Getting Started
 
@@ -31,7 +31,7 @@ Import the CSS file, either globally or in a single component:
 import "@sit-onyx/comark/style.css";
 ```
 
-## `OnyxComark`
+## `OnyxMarkdown`
 
 Simple runtime parser and renderer component for markdown.
 Just pass your markdown string:
@@ -39,7 +39,7 @@ Just pass your markdown string:
 ```vue
 <!-- App.vue -->
 <script setup lang="ts">
-import { OnyxComark } from "@sit-onyx/comark";
+import { OnyxMarkdown } from "@sit-onyx/comark";
 
 const content = `# Hello World
 
@@ -50,29 +50,28 @@ This is **markdown** with Comark components.
 <template>
   <!-- It is required to wrap OnyxComark in a Suspense block! -->
   <Suspense>
-    <OnyxComark>{{ content }}</OnyxComark>
+    <OnyxMarkdown>{{ content }}</OnyxMarkdown>
   </Suspense>
 </template>
 ```
 
-For more details check the [documentation for the `Comark` component](https://comark.dev/rendering/vue#code-comark).
+For more details check the [documentation for the `Markdown` component](https://comark.dev/rendering/vue#markdown).
 
 ## `OnyxComarkRenderer`
 
-Renders a pre-parsed ComarkTree without any parsing. Use it when you parse on the server, in a build step, or via an API, so no parser or plugin code is shipped to the browser.
+Renders a pre-parsed MarkdownDocument without any parsing. Use it when you parse on the server, in a build step, or via an API, so no parser or plugin code is shipped to the browser.
 
 ### 1. Parse on the server/buildtime
 
 ```ts
-// server.ts
-
-import { createParse } from "comark";
 import { readFile } from "node:fs/promises";
+// server.ts
+import { createMarkdownParser } from "comark";
 
-const parse = createParse();
+const parse = createMarkdownParser();
 
 // In your server handler
-export async function getContentTree(slug: string) {
+export async function getContentDocument(slug: string) {
   const markdown = await readFile(`content/${slug}.md`, "utf-8");
   return parse(markdown);
 }
@@ -83,14 +82,15 @@ export async function getContentTree(slug: string) {
 ```vue
 <!-- ContentPage.vue -->
 <script setup lang="ts">
-import { OnyxComarkRenderer } from "@sit-onyx/comark";
+import { OnyxMarkdownDocument } from "@sit-onyx/comark";
+
 const { slug } = defineProps<{ slug: string }>();
 
 const res = await fetch(`/api/content/${slug}`);
-const tree = await res.json();
+const document = await res.json();
 </script>
 
 <template>
-  <OnyxComarkRenderer :tree="tree" />
+  <OnyxMarkdownDocument :value="document" />
 </template>
 ```

package/dist/component-meta.json

@@ -0,0 +1 @@
+[{"exportName":"OnyxMarkdownDocument","displayName":"OnyxMarkdownDocument","type":1,"props":[{"name":"value","global":false,"description":"The parsed Comark document to render — either a full `MarkdownDocument` or a bare\n`Node[]`.  When a node array is passed, frontmatter and meta\ndefault to `{}` and runtime data should be supplied via `data`.","tags":[],"required":false,"type":"MarkdownDocument<Record<string, any>, Record<string, any>> | { nodes: Node[]; } | undefined","schema":{"kind":"enum","type":"MarkdownDocument<Record<string, any>, Record<string, any>> | { nodes: Node[]; } | undefined","schema":["undefined","MarkdownDocument<Record<string, any>, Record<string, any>>","{ nodes: Node[]; }"]},"declarations":[]},{"name":"components","global":false,"description":"Custom component mappings for element tags","tags":[],"required":false,"type":"Record<string, any> | undefined","schema":{"kind":"enum","type":"Record<string, any> | undefined","schema":["undefined","Record<string, any>"]},"declarations":[]},{"name":"componentsManifest","global":false,"description":"Dynamic component resolver function","tags":[],"required":false,"type":"ComponentManifest | undefined","schema":{"kind":"enum","type":"ComponentManifest | undefined","schema":["undefined","ComponentManifest"]},"declarations":[]},{"name":"streaming","global":false,"description":"Enable streaming mode with enhanced components","tags":[],"required":false,"type":"boolean | undefined","schema":{"kind":"enum","type":"boolean | undefined","schema":["undefined","false","true"]},"declarations":[]},{"name":"caret","global":false,"description":"If caret is true, a caret will be appended to the document's last text node","tags":[],"required":false,"type":"boolean | { class: string; } | undefined","schema":{"kind":"enum","type":"boolean | { class: string; } | undefined","schema":["undefined","false","true","{ class: string; }"]},"declarations":[]},{"name":"data","global":false,"description":"Additional data to pass to the renderer","tags":[],"required":false,"type":"Record<string, unknown> | undefined","schema":{"kind":"enum","type":"Record<string, unknown> | undefined","schema":["undefined","Record<string, unknown>"]},"declarations":[]},{"name":"documentKey","global":false,"description":"Document key. When set and `globalThis.comarkContext` exists, the renderer\nsubscribes to live updates for this key (HMR, devtools, collab, agents) and\nre-renders with the pushed document. No-op otherwise.","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]}],"events":[],"slots":[],"exposed":[]},{"exportName":"OnyxMarkdown","displayName":"OnyxMarkdown","type":1,"props":[{"name":"value","global":false,"description":"The markdown content to parse and render, or a pre-parsed MarkdownDocument","tags":[],"required":false,"type":"string | MarkdownDocument<Record<string, any>, Record<string, any>> | undefined","schema":{"kind":"enum","type":"string | MarkdownDocument<Record<string, any>, Record<string, any>> | undefined","schema":["undefined","string","MarkdownDocument<Record<string, any>, Record<string, any>>"]},"declarations":[]},{"name":"options","global":false,"description":"Parser options (excluding plugins)","tags":[],"required":false,"type":"Omit<ParserOptions<readonly ComarkPlugin<any, any>[]>, \"plugins\"> | undefined","schema":{"kind":"enum","type":"Omit<ParserOptions<readonly ComarkPlugin<any, any>[]>, \"plugins\"> | undefined","schema":["undefined","Omit<ParserOptions<readonly ComarkPlugin<any, any>[]>, \"plugins\">"]},"declarations":[]},{"name":"plugins","global":false,"description":"Additional plugins to use","tags":[],"required":false,"type":"readonly ComarkPlugin<any, any>[] | undefined","schema":{"kind":"enum","type":"readonly ComarkPlugin<any, any>[] | undefined","schema":["undefined","readonly ComarkPlugin<any, any>[]"]},"declarations":[]},{"name":"unwrap","global":false,"description":"Strip wrapper tags from the top level of the document — shorthand for\n`options.unwrap`. `true` unwraps `<p>` (single-line rendering); a\nspace-separated string or array unwraps the listed tags. Useful for inline\nusage like `<UButton><Markdown :value=\"text\" unwrap /></UButton>`.","tags":[],"required":false,"type":"string | boolean | string[] | undefined","schema":{"kind":"enum","type":"string | boolean | string[] | undefined","schema":["undefined","string","false","true","string[]"]},"declarations":[]},{"name":"components","global":false,"description":"Custom component mappings for element tags","tags":[],"required":false,"type":"Record<string, any> | undefined","schema":{"kind":"enum","type":"Record<string, any> | undefined","schema":["undefined","Record<string, any>"]},"declarations":[]},{"name":"componentsManifest","global":false,"description":"Dynamic component resolver function","tags":[],"required":false,"type":"ComponentManifest | undefined","schema":{"kind":"enum","type":"ComponentManifest | undefined","schema":["undefined","ComponentManifest"]},"declarations":[]},{"name":"streaming","global":false,"description":"Enable streaming mode with stream-specific components","tags":[],"required":false,"type":"boolean | undefined","schema":{"kind":"enum","type":"boolean | undefined","schema":["undefined","false","true"]},"declarations":[]},{"name":"summary","global":false,"description":"If document has a <!-- more --> comment, only render the content before the comment","tags":[],"required":false,"type":"boolean | undefined","schema":{"kind":"enum","type":"boolean | undefined","schema":["undefined","false","true"]},"declarations":[]},{"name":"caret","global":false,"description":"If caret is true, a caret will be appended to the document's last text node","tags":[],"required":false,"type":"boolean | { class: string; } | undefined","schema":{"kind":"enum","type":"boolean | { class: string; } | undefined","schema":["undefined","false","true","{ class: string; }"]},"declarations":[]},{"name":"data","global":false,"description":"Additional data to pass to the renderer","tags":[],"required":false,"type":"Record<string, unknown> | undefined","schema":{"kind":"enum","type":"Record<string, unknown> | undefined","schema":["undefined","Record<string, unknown>"]},"declarations":[]},{"name":"documentKey","global":false,"description":"Document key used to subscribe to live updates via `globalThis.comarkContext`","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]}],"events":[],"slots":[],"exposed":[]},{"exportName":"default","displayName":"ProseH1","type":1,"props":[{"name":"id","global":false,"description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]}],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseA","type":1,"props":[{"name":"href","global":false,"default":"\"\"","description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]},{"name":"target","global":false,"description":"","tags":[],"required":false,"type":"\"_self\" | \"_blank\" | \"_parent\" | \"_top\" | undefined","schema":{"kind":"enum","type":"\"_self\" | \"_blank\" | \"_parent\" | \"_top\" | undefined","schema":["undefined","\"_self\"","\"_blank\"","\"_parent\"","\"_top\""]},"declarations":[]}],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseH4","type":1,"props":[{"name":"id","global":false,"description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]}],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseHr","type":1,"props":[],"events":[],"slots":[],"exposed":[]},{"exportName":"default","displayName":"ProseBr","type":1,"props":[],"events":[],"slots":[],"exposed":[]},{"exportName":"default","displayName":"ProseCode","type":1,"props":[],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseH6","type":1,"props":[{"name":"id","global":false,"description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]}],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseOl","type":1,"props":[],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseH2","type":1,"props":[{"name":"id","global":false,"description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]}],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseTbody","type":1,"props":[],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProsePre","type":1,"props":[{"name":"language","global":false,"description":"Code language","tags":[{"name":"example","text":"  js, ts, html, css, etc."}],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]},{"name":"filename","global":false,"description":"Filename.","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]},{"name":"highlights","global":false,"description":"Highlighted code line numbers.","tags":[],"required":false,"type":"number[] | undefined","schema":{"kind":"enum","type":"number[] | undefined","schema":["undefined","number[]"]},"declarations":[]},{"name":"meta","global":false,"description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]}],"events":[],"slots":[{"name":"default","type":"any","description":"Renderer code snippet.","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseImg","type":1,"props":[{"name":"src","global":false,"default":"\"\"","description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]},{"name":"alt","global":false,"default":"\"\"","description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]},{"name":"width","global":false,"description":"","tags":[],"required":false,"type":"string | number | undefined","schema":{"kind":"enum","type":"string | number | undefined","schema":["undefined","string","number"]},"declarations":[]},{"name":"height","global":false,"description":"","tags":[],"required":false,"type":"string | number | undefined","schema":{"kind":"enum","type":"string | number | undefined","schema":["undefined","string","number"]},"declarations":[]}],"events":[],"slots":[],"exposed":[]},{"exportName":"default","displayName":"ProseSummary","type":1,"props":[],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseTable","type":1,"props":[],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseThead","type":1,"props":[],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseP","type":1,"props":[],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseH5","type":1,"props":[{"name":"id","global":false,"description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]}],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseUl","type":1,"props":[],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseDetails","type":1,"props":[],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]},{"exportName":"default","displayName":"ProseH3","type":1,"props":[{"name":"id","global":false,"description":"","tags":[],"required":false,"type":"string | undefined","schema":{"kind":"enum","type":"string | undefined","schema":["undefined","string"]},"declarations":[]}],"events":[],"slots":[{"name":"default","type":"any","description":"","tags":[],"schema":"any","declarations":[]}],"exposed":[]}]

package/dist/components/comark.d.ts

@@ -374,5 +374,3 @@ export declare const components: {
         alt: string;
     }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 };
-export declare const OnyxMarkdown: import('vue').DefineComponent<import('@comark/vue').MarkdownProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('@comark/vue').MarkdownProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-export declare const OnyxMarkdownDocument: import('vue').DefineComponent<import('@comark/vue').MarkdownDocumentProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('@comark/vue').MarkdownDocumentProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/markdown-document.d.ts

@@ -0,0 +1 @@
+export declare const OnyxMarkdownDocument: import('vue').DefineComponent<import('@comark/vue').MarkdownDocumentProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('@comark/vue').MarkdownDocumentProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/markdown.d.ts

@@ -0,0 +1 @@
+export declare const OnyxMarkdown: import('vue').DefineComponent<import('@comark/vue').MarkdownProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('@comark/vue').MarkdownProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/index.d.ts

@@ -18,4 +18,5 @@ export { default as ProseTable } from './components/prose/ProseTable.vue';
 export { default as ProseTbody } from './components/prose/ProseTbody.vue';
 export { default as ProseThead } from './components/prose/ProseThead.vue';
 export { default as ProseUl } from './components/prose/ProseUl.vue';
-export { OnyxMarkdown, OnyxMarkdownDocument } from './components/comark.js';
+export * from './components/markdown.js';
+export * from './components/markdown-document.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sit-onyx/comark",
-  "version": "0.2.0",
+  "version": "0.3.0-dev-20261009105419",
   "description": "Wrapper for the comark package using the onyx design system created by Schwarz Digits",
   "bugs": {
     "url": "https://github.com/SchwarzIT/onyx/issues"
@@ -24,24 +24,26 @@
       "node": "./dist/index.js",
       "default": "./dist/index.js"
     },
-    "./style.css": "./dist/style.css"
+    "./style.css": "./dist/style.css",
+    "./component-meta.json": "./dist/component-meta.json"
   },
   "devDependencies": {
-    "@comark/vue": "^0.6.2",
+    "@comark/vue": "^0.7.0",
     "@playwright/experimental-ct-vue": "1.62.1",
     "@playwright/test": "1.62.1",
-    "@vue/compiler-dom": "3.5.41",
-    "unplugin-dts": "1.0.3",
-    "vite": "8.2.1",
-    "vue": "3.5.41",
     "@sit-onyx/playwright-utils": "^1.3.0",
     "@sit-onyx/shared": "^0.1.0",
-    "sit-onyx": "^1.19.0"
+    "@sit-onyx/vite-plugin-component-meta": "^0.0.0",
+    "@vue/compiler-dom": "3.5.43",
+    "sit-onyx": "^1.21.1-dev-20261009105419",
+    "unplugin-dts": "1.1.2",
+    "vite": "8.3.2",
+    "vue": "3.5.43"
   },
   "peerDependencies": {
     "@comark/vue": ">= 0.6.0",
-    "vue": ">= 3.5.0",
-    "sit-onyx": "^1.19.0"
+    "sit-onyx": "^1.21.1-dev-20261009105419",
+    "vue": ">= 3.5.0"
   },
   "engines": {
     "node": ">=20"