markstream-vue 0.0.14-beta.7 → 0.0.14-beta.8

package/.agents/skills/markstream-install/SKILL.md

@@ -21,7 +21,7 @@ Read [references/scenarios.md](references/scenarios.md) before making dependency
    - For Vue 3 Monaco preloading, use `preloadCodeBlockRuntime` from `markstream-vue` so the renderer runtime knows Monaco is warm. Existing `getUseMonaco()` calls are still compatible.
 3. Fix CSS order.
    - Put reset styles before Markstream styles.
-   - In Tailwind or UnoCSS projects, place `markstream-*/index.css` inside `@layer components`.
+   - In Tailwind or UnoCSS projects, use `@import 'markstream-*/index.css' layer(components);`.
    - Import `katex/dist/katex.min.css` when math is enabled.
 4. Add the smallest working render example.
     - Use `content` for static or low-frequency rendering.

package/.agents/skills/markstream-install/references/scenarios.md

@@ -24,7 +24,7 @@
 
 - reset first
 - Markstream CSS after reset
-- in Tailwind or UnoCSS projects, keep Markstream CSS inside `@layer components`
+- in Tailwind or UnoCSS projects, use `@import '...' layer(components)`
 - import KaTeX CSS when math is used
 - when standalone node components are rendered directly, wrap them with the package root class such as `.markstream-vue`, `.markstream-react`, or `.markstream-svelte`
 

package/.agents/skills/markstream-vue/SKILL.md

@@ -12,7 +12,7 @@ Use this skill when the host app is plain Vue 3, typically Vite-based, and not N
 1. Confirm the repo is Vue 3 and not Nuxt.
 2. Install `markstream-vue` plus only the optional peers required by the requested features.
 3. Import `markstream-vue/index.css` after resets.
-   - In Tailwind or UnoCSS projects, keep Markstream styles inside `@layer components`.
+   - In Tailwind or UnoCSS projects, use `@import 'markstream-vue/index.css' layer(components);`.
 4. Start with `<MarkdownRender :content="markdown" />`.
    - For AI chat or streaming UIs, use `typewriter` or `:max-live-nodes="0"` — smooth streaming is auto-enabled (`smooth-streaming="auto"`, the default) and paces visible output so bursty chunks appear steadily.
    - `typewriter` only controls the blinking cursor and defaults to `false`.

package/README.md

@@ -151,7 +151,7 @@ createApp({
 }).mount('#app')
 ```
 
-Import `markstream-vue/index.css` after your reset (e.g., Tailwind `@layer components`) so renderer styles win over utility classes. Install optional peers such as `stream-monaco`, `shiki`, `stream-markdown`, `mermaid`, and `katex` only when you need Monaco code blocks, Shiki highlighting, diagrams, or math.
+Import `markstream-vue/index.css` after your reset (e.g., use `@import 'markstream-vue/index.css' layer(components);` for Tailwind) so renderer styles win over utility classes. Install optional peers such as `stream-monaco`, `shiki`, `stream-markdown`, `mermaid`, and `katex` only when you need Monaco code blocks, Shiki highlighting, diagrams, or math.
 If your app intentionally scales root font size on mobile, use `markstream-vue/index.px.css` to avoid `rem`-based global scaling side effects.
 
 Renderer CSS is scoped under an internal `.markstream-vue` container to minimize global style conflicts. If you render exported node components outside of `MarkdownRender`, wrap them in an element with class `markstream-vue`.

package/README.zh-CN.md

@@ -152,7 +152,7 @@ createApp({
 }).mount('#app')
 ```
 
-确保在 CSS reset（如 `@tailwind base` 或 `@unocss/reset`）之后导入 `markstream-vue/index.css`，最好放在 `@layer components` 中以避免 Tailwind/UnoCSS 覆盖组件样式。根据需求再按需安装可选 peer 依赖：`stream-monaco`（Monaco 代码块）、`shiki` + `stream-markdown`（Shiki 高亮）、`mermaid`（Mermaid 图表）、`katex`（数学公式）。
+确保在 CSS reset（如 `@tailwind base` 或 `@unocss/reset`）之后导入 `markstream-vue/index.css`，推荐使用 `@import 'markstream-vue/index.css' layer(components);` 以避免 Tailwind/UnoCSS 覆盖组件样式。根据需求再按需安装可选 peer 依赖：`stream-monaco`（Monaco 代码块）、`shiki` + `stream-markdown`（Shiki 高亮）、`mermaid`（Mermaid 图表）、`katex`（数学公式）。
 如果你的移动端会主动调大根字号（`html`/`body`），建议改用 `markstream-vue/index.px.css`，避免 `rem` 跟随根字号导致整体放大。
 
 渲染器的 CSS 会作用于内部 `.markstream-vue` 容器下，以尽量降低对全局的影响；如果你脱离 `MarkdownRender` 单独使用导出的节点组件，请在外层包一层带 `markstream-vue` 类名的容器。