litellm/ui/litellm-dashboard
yuneng-jiang 47c988e05c
refactor(ui): move the dashboard onto class-variance-authority (#38125)
The dashboard used `cva@1.0.0-beta.4` with the object-argument API behind
`@/lib/cva.config`, while shadcn emits `class-variance-authority` with the
positional API. Every `shadcn add` of a cva-based primitive therefore needed a
hand fix-up before it compiled, which meant `components/ui/` could never match
a fresh CLI run and `shadcn add <name> --diff` reported the whole file as
changed instead of showing real upstream drift.

Swap the dependency, and regenerate `badge`, `button`, `button-group`,
`input-group` and `tabs` straight from the base-vega registry so they are now
byte-identical to the CLI output plus prettier.

Two primitives could not be regenerated because they are local code rather
than registry items, so they move out of `components/ui/`: `sidebar` (203
lines against upstream's 730, and only `leftnav` consumes it) and `meter`
(no registry entry at all, it wraps Base UI's Meter).

The customisations that were baked into the regenerated files move to
wrappers, following the rule that `components/ui/` holds CLI output and
anything on top of it lives outside:

- badge carried info, success and warning variants that duplicated the
  existing `StatusBadge` tone map, so its five call sites now use
  `StatusBadge`, which gains an optional `className`
- input-group's addon focuses `[data-slot=input-group-control]` rather than
  upstream's `input`, which matters because the chat composer puts a textarea
  there. That handler now sits at the one call site that needs it

`cx` keeps its previous twMerge behaviour. It came from the old
`defineConfig({hooks: {onComplete: twMerge}})`, and CVA's own `cx` is plain
clsx, so pointing it at `cn` avoids silently dropping conflict resolution in
the six files that use it.

`Sidebar.test.tsx` covers the failure mode this migration can hide: passing
the object form to the positional API is accepted by clsx and renders the
literal class string "base variants defaultVariants", so the component loses
every style while the type checker and the existing suite stay green.
2026-08-24 14:10:31 -07:00
..
public Merge remote-tracking branch 'origin/litellm_internal_staging' into litellm_scx_ai_provider 2026-08-21 17:27:49 +10:00
scripts fix(ui): restore hover feedback and dark-mode variants lost in the token migration (#37579) 2026-08-19 22:52:36 -07:00
src refactor(ui): move the dashboard onto class-variance-authority (#38125) 2026-08-24 14:10:31 -07:00
tests fix(ui): restore hover feedback and dark-mode variants lost in the token migration (#37579) 2026-08-19 22:52:36 -07:00
.env.development hidden dashboard routing, dev and build env files 2025-10-06 19:21:34 -07:00
.env.production remove next env 2026-04-18 16:45:32 -07:00
.npmrc chore(build): move the Admin UI toolchain to Node 24 (#35801) 2026-08-04 12:36:07 -07:00
.nvmrc chore(build): move the Admin UI toolchain to Node 24 (#35801) 2026-08-04 12:36:07 -07:00
.prettierignore feat(ui): generate dashboard API types from the proxy OpenAPI spec (#29816) 2026-06-05 17:20:01 -07:00
.prettierrc added and ran prettier autoformatter 2025-10-04 18:19:48 -07:00
build_release_ui.sh build release ui script 2026-01-17 18:16:14 -08:00
build_ui.sh chore(build): move the Admin UI toolchain to Node 24 (#35801) 2026-08-04 12:36:07 -07:00
build_ui_custom_path.sh chore(build): move the Admin UI toolchain to Node 24 (#35801) 2026-08-04 12:36:07 -07:00
CLAUDE.md chore(ui): drop the antd dependency and its leftovers (#37574) 2026-08-19 20:44:27 -07:00
components.json refactor(ui): switch shadcn primitives from Radix to Base UI (#32124) 2026-07-07 09:55:41 -07:00
eslint-budgets.json chore: make no-console max 12 2026-08-05 10:45:56 -07:00
eslint-suppressions.json refactor(ui): move the dashboard onto class-variance-authority (#38125) 2026-08-24 14:10:31 -07:00
eslint.config.mjs fix(ui): restore hover feedback and dark-mode variants lost in the token migration (#37579) 2026-08-19 22:52:36 -07:00
knip.json fix(ui): register type-test files as knip entry points 2026-08-10 15:42:09 -07:00
next.config.mjs chore(ui): preserve console.warn in prod builds to match lint allow-list 2026-07-03 14:51:14 -07:00
package-lock.json refactor(ui): move the dashboard onto class-variance-authority (#38125) 2026-08-24 14:10:31 -07:00
package.json refactor(ui): move the dashboard onto class-variance-authority (#38125) 2026-08-24 14:10:31 -07:00
postcss.config.js feat(ui): shadcn migration foundation: Tailwind v4, shadcn init, antd cascade fix (#31995) 2026-07-02 19:02:27 -07:00
README.md
tsconfig.json test(e2e): move Admin UI Playwright suite to tests/e2e/ui (#34196) 2026-07-22 19:43:10 +00:00
tsconfig.tsbuildinfo refactor(ui): map hardcoded Tailwind palette classes onto semantic tokens (#37576) 2026-08-19 22:11:44 -07:00
vitest.config.ts test(ui): split the vitest suite into unit, component, integration and type projects (#37488) 2026-08-19 20:40:14 +00:00

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.