@nuvin/components 0.1.0

package/dist/styles/tokens.test.ts

@@ -0,0 +1,113 @@
+// @vitest-environment node
+import { readFileSync } from "node:fs";
+import { join } from "node:path";
+import { describe, expect, it } from "vitest";
+
+const tokens = readFileSync(join(process.cwd(), "src/styles/tokens.css"), "utf8");
+
+function block(selector: string): string {
+  // Grab from the selector to the closing brace of that rule block.
+  const start = tokens.indexOf(selector);
+  expect(start, `${selector} present`).toBeGreaterThanOrEqual(0);
+  const rest = tokens.slice(start);
+  return rest.slice(0, rest.indexOf("\n}") + 2);
+}
+
+const CANONICAL = [
+  "--bg-base",
+  "--bg-raised",
+  "--bg-overlay",
+  "--bg-inset",
+  "--bg-sunken",
+  "--bg-hover",
+  "--fg-primary",
+  "--fg-secondary",
+  "--fg-tertiary",
+  "--fg-quaternary",
+  "--fg-on-accent",
+  "--border-subtle",
+  "--border-default",
+  "--border-strong",
+  "--border-focus",
+  "--accent",
+  "--accent-hover",
+  "--accent-subtle",
+  "--accent-border",
+  "--success",
+  "--danger",
+  "--warning",
+];
+
+const SHADCN_ALIASES = [
+  "--background",
+  "--foreground",
+  "--card",
+  "--popover",
+  "--primary",
+  "--secondary",
+  "--muted",
+  "--destructive",
+  "--border",
+  "--input",
+  "--ring",
+  "--radius",
+];
+
+describe("tokens.css", () => {
+  it("defines both theme blocks", () => {
+    expect(tokens).toContain('[data-theme="dark"]');
+    expect(tokens).toContain('[data-theme="light"]');
+  });
+
+  it("dark block defines the full canonical vocabulary", () => {
+    const dark = block(":root,");
+    for (const v of CANONICAL) expect(dark, `dark ${v}`).toContain(`${v}:`);
+  });
+
+  it("light block defines the full canonical vocabulary", () => {
+    const light = block('[data-theme="light"]');
+    for (const v of CANONICAL) expect(light, `light ${v}`).toContain(`${v}:`);
+  });
+
+  it("maps the shadcn alias names in both themes", () => {
+    const dark = block(":root,");
+    const light = block('[data-theme="light"]');
+    for (const v of SHADCN_ALIASES) {
+      expect(dark, `dark ${v}`).toContain(`${v}:`);
+      expect(light, `light ${v}`).toContain(`${v}:`);
+    }
+  });
+
+  it("aliases shadcn --primary onto the brand --accent", () => {
+    expect(tokens).toContain("--primary: var(--accent)");
+  });
+
+  it("does NOT alias shadcn --accent (brand collision avoidance)", () => {
+    // The canonical brand --accent IS defined; shadcn's --accent-foreground must NOT be.
+    expect(tokens).not.toContain("--accent-foreground");
+  });
+
+  it("exposes the @theme inline color map", () => {
+    expect(tokens).toContain("@theme inline");
+    expect(tokens).toContain("--color-surface-raised: var(--bg-raised)");
+    expect(tokens).toContain("--color-accent: var(--accent)");
+  });
+
+  it("exposes syntax + diff tokens as @theme inline color utilities", () => {
+    for (const name of [
+      "--color-syn-keyword",
+      "--color-syn-string",
+      "--color-syn-fn",
+      "--color-syn-var",
+      "--color-syn-comment",
+      "--color-syn-punct",
+      "--color-diff-add-bg",
+      "--color-diff-add-fg",
+      "--color-diff-del-bg",
+      "--color-diff-del-fg",
+      "--color-diff-line-num",
+    ]) {
+      expect(tokens).toContain(`${name}: var(${name.replace("--color-", "--")});`);
+    }
+  });
+});

package/dist/test-setup.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Vitest setup file — jsdom measurement stubs for @tanstack/react-virtual.
+ *
+ * @tanstack/virtual-core@3.17.0 measurement facts (verified against source):
+ *   - Viewport extent: reads scrollElement.offsetHeight (observeElementRect, lines 15-16)
+ *   - Per-row size: reads rowElement.offsetHeight (default measureElement fallback, line 150)
+ *   - borderBoxSize branch only fires when ResizeObserver delivers an entry;
+ *     with a no-op ResizeObserver (below) no entry is ever delivered, so
+ *     offsetHeight governs both paths unconditionally.
+ *   - getBoundingClientRect is inert for both paths — do NOT stub it as the
+ *     measurement source.
+ *
+ * The stubs establish a "full window renders" invariant for deterministic tests:
+ *   - Viewport (scroll element): offsetHeight = 10000  → large enough to show all rows
+ *   - Each row: offsetHeight = 48 (prototype getter)   → small; rows count into window
+ *
+ * A blanket prototype getter returning 10000 would make ROWS also measure 10000,
+ * causing the virtualizer to window to ~1 item. The viewport must be identified
+ * separately. We key on the aria-label="Conversation" attribute that AppShell
+ * already places on the scroll <section> (see AppShell.tsx) — OR on a
+ * data-testid="scroll-viewport" attribute that tests can add to their container.
+ *
+ * Guard: each stub is gated on typeof HTMLElement !== "undefined" so this file
+ * is inert in node-environment test runs (e.g. mobile-layout.test.ts uses
+ * @vitest-environment node, but setup files run per-environment; the guard
+ * makes the jsdom-only stubs safe for that run too).
+ */
+export {};
+//# sourceMappingURL=test-setup.d.ts.map

package/dist/test-setup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-setup.d.ts","sourceRoot":"","sources":["../src/test-setup.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG"}

package/package.json

@@ -0,0 +1,71 @@
+{
+  "name": "@nuvin/components",
+  "version": "0.1.0",
+  "private": false,
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "license": "Apache-2.0",
+  "publishConfig": {
+    "access": "public"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./styles": "./dist/styles/index.css"
+  },
+  "scripts": {
+    "build": "tsup && tsc -p tsconfig.build.json --emitDeclarationOnly",
+    "dev": "tsup --watch",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
+  "peerDependencies": {
+    "react": ">=19",
+    "react-dom": ">=19",
+    "react-router": "^7.17.0"
+  },
+  "dependencies": {
+    "@nuvin/session": "workspace:^",
+    "@radix-ui/react-avatar": "^1.2.0",
+    "@radix-ui/react-dropdown-menu": "^2.1.18",
+    "@radix-ui/react-popover": "^1.1.17",
+    "@radix-ui/react-scroll-area": "^1.2.12",
+    "@radix-ui/react-slot": "^1.3.0",
+    "@radix-ui/react-tabs": "^1.1.15",
+    "@radix-ui/react-toast": "^1.2.18",
+    "@radix-ui/react-tooltip": "^1.2.10",
+    "@tanstack/react-virtual": "^3.14.2",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "cmdk": "^1.1.1",
+    "katex": "^0.17.0",
+    "lucide-react": "^1.21.0",
+    "rehype-katex": "^7.0.1",
+    "remark-math": "^6.0.0",
+    "streamdown": "^2.5.0",
+    "tailwind-merge": "^3.6.0",
+    "zustand": "^5.0.0"
+  },
+  "devDependencies": {
+    "@clerk/clerk-react": "^5.59.0",
+    "@fontsource/inter": "^5.2.8",
+    "@fontsource/jetbrains-mono": "^5.2.8",
+    "@nuvin/agent-core": "workspace:^",
+    "@nuvin/daemon": "workspace:^",
+    "@tailwindcss/postcss": "^4.3.0",
+    "@types/node": "^24.10.1",
+    "@types/react": "^19.1.0",
+    "@types/react-dom": "^19.2.3",
+    "@types/ws": "^8.18.1",
+    "jsdom": "^29.0.1",
+    "tailwindcss": "^4.3.0",
+    "tsup": "^8.5.1",
+    "typescript": "^6.0.2",
+    "vitest": "^4.1.2",
+    "ws": "^8.20.0"
+  }
+}