feat(docs): add bilingual package documentation site

2026-09-20 15:53:28 +08:00
parent 60f6f1fb1a
commit dc80bd8ae0
111 changed files with 6531 additions and 0 deletions
@@ -0,0 +1,36 @@
+---
+title: Devtool
+description: Inspect and edit catalogs from a floating development interface.
+order: 30
+toc:
+  - id: mount-the-devtool
+    title: Mount the Devtool
+  - id: theme-and-language
+    title: Theme and language
+  - id: custom-surfaces
+    title: Custom surfaces
+---
+
+## Mount the Devtool {#mount-the-devtool}
+
+Mount the Devtool inside `I18nProvider` and only during development:
+
+```tsx
+import { I18nDevtool } from "@workspace/i18n/devtool"
+
+{
+  import.meta.env.DEV && (
+    <I18nDevtool locale="zh-Hans" dark={'[data-theme="dark"]'} />
+  )
+}
+```
+
+The component renders through a portal, so application overflow and stacking contexts do not clip it.
+
+## Theme and language {#theme-and-language}
+
+The `dark` option accepts a class name or a CSS selector. Control-panel language is independent from the translated application locale, supports `en-US` and `zh-Hans`, and falls back from `navigator.languages` to `en-US`.
+
+## Custom surfaces {#custom-surfaces}
+
+Use `MessagePanel`, `MessageRepositoryProvider`, and `createHttpMessageRepository` when the application needs a custom development interface instead of the default floating panel.