feat(desktop): embed BoosAPI Desktop client as a subproject

Vendor the rebranded BoosAPI Desktop client (Tauri + Vue) into metapi as a monorepo subdirectory under desktop/. Source only — node_modules, dist, Cargo target and the upstream .git history are excluded. desktop/ keeps its own independent Cargo workspace (desktop/src-tauri with crates/*); it is not part of the backend boosapi crate, so a `cargo check` at the metapi root still compiles only the backend. Build the desktop app from desktop/src-tauri per desktop/README.md. Note: app icons are still placeholder assets pending the final BoosAPI logo. The updater signing keys live outside the repo and are not included.
2026-06-22 11:32:57 +08:00
parent d9c78ecc73
commit e0a5f57793
2305 changed files with 449355 additions and 0 deletions
@@ -0,0 +1,122 @@
+---
+description: Fix Tailwind, shadcn, and CSS ordering issues when importing markstream-vue styles into a controlled layer.
+---
+
+# Tailwind Integration & Style Ordering
+
+If your project uses a Tailwind component library like `shadcn`, you may run into style ordering or overriding issues when including `markstream-vue` CSS. The recommended approach is to import the library CSS inside a controlled Tailwind layer.
+
+`markstream-vue` scopes its packaged CSS under an internal `.markstream-vue` container to reduce global conflicts. Tailwind utilities from `markstream-vue/index.css` apply only inside the renderer container.
+
+Example `styles/index.css`:
+
+```css
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer components {
+  @import 'markstream-vue/index.css';
+}
+```
+
+Alternatives:
+- Place the library CSS inside `@layer base` if you want it to be more foundational and harder to override.
+- Import the library CSS after your component or application CSS if you prefer the library styles to win.
+
+Always re-run your dev server after changing the import order.
+
+## Avoid duplicate CSS with Tailwind
+
+To reduce duplicated utility CSS when using Tailwind, prefer the "tailwind-ready" output shipped by this package instead of the full, precompiled `index.css`.
+
+- Tailwind v3 (recommended workflow):
+  - Import `index.tailwind.css` in your app so consumers get only the framework+component styles without embedded Tailwind utilities.
+  - Add the generated class list to your `tailwind.config.js` `content` so Tailwind can pick up the classes used by the renderer and not re-generate them.
+
+Example (Tailwind v3 / `tailwind.config.js`):
+
+```js
+module.exports = {
+  content: [
+    './src/**/*.{js,ts,vue}',
+    // include the helper produced by the package
+    // installed packages can reference: require('markstream-vue/tailwind')
+    require('markstream-vue/tailwind'),
+  ],
+}
+```
+
+Example CSS import (app entry):
+
+```css
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@import 'markstream-vue/index.tailwind.css';
+```
+
+- Tailwind v4: you can directly include `index.tailwind.css` and rely on the v4 scanner to discover classes without needing the extra `tailwind.ts` helper.
+
+- Non-Tailwind projects: continue to import the precompiled `index.css`:
+
+```css
+@import 'markstream-vue/index.css';
+```
+
+Notes:
+- The package exposes a `./tailwind` entry (`./dist/tailwind.ts`) which exports the extracted class list. When installing from npm, `require('markstream-vue/tailwind')` will load that helper for use in your Tailwind config.
+- If you develop locally against the repo, you may reference the generated file directly (e.g. `./dist/tailwind.ts`).
+
+Quick try — verify Tailwind classes are discovered by adding `index.tailwind.css` and a small component:
+
+```vue
+<script setup lang="ts">
+import MarkdownRender from 'markstream-vue'
+
+const md = '# Tailwind test\n\nThis text is styled by tailwind'
+</script>
+
+<template>
+  <div class="prose">
+    <MarkdownRender :content="md" />
+  </div>
+</template>
+```
+
+## UnoCSS integration
+
+UnoCSS follows the same rules: import resets first, then wrap renderer CSS so component styles stay in the correct layer.
+
+1. Install Uno presets (`presetUno`, `presetWind`) and include the package CSS inside a `preflight`:
+
+```ts
+// uno.config.ts
+import { defineConfig, presetUno, presetWind } from 'unocss'
+
+export default defineConfig({
+  presets: [presetUno(), presetWind()],
+  preflights: [
+    {
+      // ensures the CSS runs with the base reset
+      layer: 'preflights',
+      getCSS: () => '@import "markstream-vue/index.css";',
+    },
+  ],
+})
+```
+
+2. If you prefer to rely on CSS layers manually, include the CSS in your main stylesheet:
+
+```css
+@import '@unocss/reset/tailwind.css';
+
+@layer components {
+  @import 'markstream-vue/index.css';
+}
+```
+
+3. Use Uno prefixes (e.g., `uno` config `rules: [], shortcuts: [], theme: {}` + `shortcutsPrefix: 'u-'`) when class names collide with renderer classes. Tailwind users can also set `prefix: 'tw-'` in `tailwind.config.js`.
+
+Troubleshooting tip: enable the “Cascade Layers” view in devtools to check whether Uno/Tailwind utilities override renderer selectors. If utilities appear below the component layer, move the import into `@layer components` or adjust the preflight order.