Files
BB-fat d1001e14b2 feat(dsh-plugin-browserskill): reskin the overlay with BrowserSkill's own UI system
The previous pass aligned the observation overlay with the dsh shell; the
product call is the opposite direction — the floating card should read as a
BrowserSkill surface, not a shell-native widget.

- Reuse @browser-skill/ui directly (Button, cn); status dots spec'd after the
  extension popup's ConnectionStatusIndicator; Remix icons for
  interrupt/pin/warn/pop-out.
- Compile the BSK tailwind utility sheet scoped under the .bsk-obs root class
  (scripts/build-client-css.mjs + postcss-prefix-selector) and ship the oklch
  design tokens on the same scope, so nothing leaks into the host shell and
  the shell theme cannot bleed back. tsdown injects .nomodule.css verbatim
  (minified, unhashed) alongside the hashed CSS modules.
- BSK ships no shared tooltip, so the one-time interrupt semantics hint is a
  card-spec bubble (bg-card/border/12px radius), retired after first use.
- Tests: pin react/react-dom to this package's 18.x copies in vitest — the ui
  package sources peer on react ^19 and would otherwise emit react-19
  (transitional) elements that the react-18 renderer rejects. Production is
  unaffected (react stays external, provided by the shell).
- stylelint: ignore the generated bsk-ui.nomodule.css.
2026-08-14 10:00:37 +00:00

33 lines
1.1 KiB
TypeScript

import { createRequire } from "node:module";
import path from "node:path";
import { defineConfig } from "vitest/config";
const require = createRequire(import.meta.url);
// @browser-skill/ui ships raw source and peers on react ^19, while the dsh
// shell — and therefore the production client bundle, where react is
// external — runs react 18. Pin every react import in tests to this
// package's react 18 copy, or elements created inside ui components come out
// as react-19 "transitional" elements that the react-18 renderer rejects.
const reactDir = path.dirname(require.resolve("react/package.json"));
const reactDomDir = path.dirname(require.resolve("react-dom/package.json"));
export default defineConfig({
resolve: {
alias: {
react: reactDir,
"react-dom": reactDomDir,
},
},
test: {
environment: "node",
include: ["tests/**/*.test.ts", "tests/**/*.test.tsx"],
server: {
deps: {
// dsh client packages ship ESM with CSS imports; run them through the
// transform pipeline (where CSS is stubbed) instead of Node's loader.
inline: [/@deepseek-ai\//],
},
},
},
});