Skip to content

refrakts/blacksite-ui

Repository files navigation

Blacksite UI

A Palantir-inspired component library, shipped as a ShadCN-compatible registry.

You don't install a package — you point the shadcn CLI at a JSON manifest and it copies the source for each component into your own codebase. The library lives in your project; there's no runtime to update, nothing to lock to.

# Drop in the theme tokens
npx shadcn@latest add https://blacksite.sh/r/theme.json

# Pick what you actually need
npx shadcn@latest add https://blacksite.sh/r/stat-card.json
npx shadcn@latest add https://blacksite.sh/r/tactical-map.json

Inspired by Palantir Foundry / Apollo / Gotham. Not affiliated with Palantir.

What this repo is

This repo is two things stacked into one project:

  1. The registryregistry/blacksite/, the actual component sources. This is the library.
  2. A thin docs/preview site — a Next.js app under app/ whose only jobs are (a) hosting the generated registry JSON at /r/*.json, and (b) showing what the components look like. It is not a product or app you're meant to use.

If you only care about the components, ignore everything outside registry/blacksite/.

Registry contents (24 items)

Primitives

button · badge · card · progress · separator · input · tooltip · tabs · scroll-area · kbd

Tactical composites

status-badge · panel · stat-card · metric · data-list · app-header · sidebar-rail

Charts

line-chart (with thresholds) · bar-chart · gantt-timeline

Maps

tactical-map (SVG canvas — markers, polygon zones, grid, controls)

Theme + utilities

theme (HSL token set + JetBrains Mono / Inter) · utils (cn() helper)

Blocks

dashboard-ops — a single Foundry-style composition that wires the tactical composites (app-header, sidebar-rail, panel, stat-card, status-badge) together with line-chart, gantt-timeline and tactical-map into a complete ops layout. Useful as a starting point or reference; not the point of the library.

Authoring conventions

  • All sources live in registry/blacksite/{ui,charts,maps,blocks}/.
  • Inter-component imports use @/registry/blacksite/... so the same source works in this repo and after install via the shadcn CLI; primitives that don't depend on other registry items just import @/lib/utils.
  • Status surfaces (badges, indicators, dots) flow through the same StatusBadge status keys: active | idle | offline | new | high | critical | compromised | nominal | warning | secured.
  • Mono is reserved for labels / axis ticks / kbd / codes. Sans for body + values.
  • Charts and maps are pure React; no theme provider, no global state.

Local development

pnpm install
pnpm dev                  # docs/preview site at http://localhost:3000
pnpm storybook            # component playground at http://localhost:6006
pnpm registry:build       # regenerate public/r/*.json
pnpm typecheck
pnpm build                # registry build + Next.js production build
pnpm build-storybook      # static Storybook into storybook-static/

Stories are colocated next to each component as *.stories.tsx. They're never listed in registry.json, so the shadcn CLI never copies them into consumer projects — they're a dev-only artefact.

In production we deploy as two Vercel projects off the same repo — blacksite.sh for the Next.js docs and storybook.blacksite.sh for the Storybook static build. The docs site discovers Storybook through the NEXT_PUBLIC_STORYBOOK_URL env var, so the two are loosely coupled. See DEPLOY.md for the Vercel UI walkthrough and DNS records.

scripts/build-registry.ts reads registry.json, inlines every referenced file, and writes one public/r/<name>.json per item plus an index.json. That is the format upstream npx shadcn@latest add <url> consumes.

public/r/*.json is gitignored — always regenerated by pnpm registry:build.

Design tokens

Tokens are HSL CSS variables in app/globals.css and re-published as a registry:theme item. Dark-first.

Role Token Value
Background --background 222 28% 6%
Card surface --card 220 22% 9%
Border --border 218 14% 18%
Foreground --foreground 210 14% 92%
Primary (cyan) --primary 174 72% 56%
Success (teal) --success 162 70% 48%
Warning (amber) --warning 38 92% 58%
Danger (red) --danger 358 78% 60%
Info (blue) --info 212 90% 62%
Gold --gold 42 78% 60%

License

MIT — see LICENSE.

About

A Palantir-inspired component library, shipped as a ShadCN-compatible registry.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Sponsor this project

 

Packages

 
 
 

Contributors

Languages