@stridge/noctis

The Stridge design system, and the single package consumers install. It pairs Base UI behavior with precompiled, framework-neutral component CSS on the semantic token layer, and ships the authoring substrate every primitive builds on — the polymorphic Primitive base, the Surface elevation primitive, render utilities, Icon, and the unified NoctisProvider (CSP + theme + locale/direction). It re-exports the design tokens, theme engine, and i18n through subpaths so apps depend on one package.

Styling

Components are styled by hand-authored, per-component .css under @layer noctis.components, keyed off data-slot — no styling framework required. Import the one stylesheet:

// app CSS entry
@import "@stridge/noctis/styles.css";

Authoring with Tailwind is optional. Tailwind users additionally import the utility bridge and pull class helpers from the adapter subpath:

@import "@stridge/noctis/tailwind.css"; // mints bg-background-style utilities

import { cn, tv } from "@stridge/noctis/tailwind";
import { Primitive } from "@stridge/noctis";

Usage

import { NoctisProvider } from "@stridge/noctis"; // foundation lives on the root barrel
import { Button } from "@stridge/noctis/button"; // each styled component ships from its own subpath
import { Dialog } from "@stridge/noctis/dialog";

<NoctisProvider>
  <Button>Save</Button>
</NoctisProvider>;

The root barrel is the foundation only (NoctisProvider, Primitive, Surface, Icon, the render/copy/motion utilities, ThemeScope + its preset maps, VisuallyHidden, UI_PACKAGE). Every styled component imports from its own deep path, @stridge/noctis/<component> — explicit imports, tree-shaking by default.

Subpaths

• @stridge/noctis — the foundation barrel (NoctisProvider, Primitive, Surface, Icon, render/copy/motion utilities, ThemeScope + its RADIUS_PRESETS/DENSITY_PRESETS/FONT_SCALE_PRESETS, VisuallyHidden, UI_PACKAGE). Foundation only — no styled components.
• @stridge/noctis/<component> — each styled component's own subpath (@stridge/noctis/button, @stridge/noctis/dialog, …); Surface and Icon are also reachable here. The exports map is generated by pnpm --filter @stridge/noctis exports:gen (freshness-checked in CI).
• @stridge/noctis/props — RSC-safe *Props() escape-hatch builders (no "use client" boundary).
• @stridge/noctis/styles.css — the precompiled component stylesheet.
• @stridge/noctis/tailwind.css — the optional Tailwind utility bridge.
• @stridge/noctis/tailwind — the optional Tailwind adapter (cn, tv).
• @stridge/noctis/tokens (+ /react) — re-exported @stridge/noctis-design-tokens.
• @stridge/noctis/theme (+ /react) — re-exported @stridge/noctis-theme-engine.
• @stridge/noctis/i18n (+ /messages) — re-exported @stridge/noctis-intl + the default catalog.
• @stridge/noctis/primitives/<name> — the generated per-name Base UI primitive re-exports (no aggregate barrel).

Build & checks

build runs tsdown then scripts/bundle-css.mjs; check:publish runs publint + size-limit. Component CSS is governed by stylelint.

The component authoring contract lives in COMPONENTS.md, the slot catalog in SLOTS.md, and the repo-wide rules in /AGENTS.md.