@arkite-ui/core · v0.14.2

The admin-panel layer your products share.

Production-ready React components for multi-tenant SaaS back-offices — data-dense, utilitarian, calm. One versioned package; every product upgrades together.

70components
1,200+tests
AAWCAG · CI-enforced
en · 繁中built-in locales

Built for back-offices, not brochures

General-purpose kits stop at buttons and dialogs. Arkite ships the layer above — the composites every admin panel rebuilds badly.

Admin composites

AdminLayout with permission-aware nav, TenantSwitcher, DataTable, FilterBar, BulkActionBar — wired to work together.

Accessibility, guaranteed

Every color pair meets WCAG AA — enforced by CI, not policy. createTheme() picks foregrounds by real contrast for any brand color.

Localized to the bone

Placeholders, empty states, calendar names, every aria-label — one LocaleProvider localizes the whole tree. en and zh-TW built in.

Tokens all the way down

HSL variables, dark mode as an equal citizen, cross-platform JS tokens for React Native. Retheme everything from one --radius.

AI-ready by design

llms.txt ships in the package — setup, design rules, and the full typed API, machine-readable. Your coding agent imports the right component on the first try.

Mobile back-office, built in

Desktop sidebar, mobile bottom tabs: hideSidebar="mobile" + bottomNav slot with safe-area padding handled. One layout, both form factors.

Upgrades that don't break you

The public API is snapshot-tested — every prop change is deliberate. Breaking changes ship with a codemod: one command migrates your repo.

Server-side tables, one hook

useServerTable owns paging, sorting, and filter state; you fetch on queryKey, the table renders it. Six wired props, zero boilerplate.

One command to start

Not a zero-dependency drop-in: components need React, Tailwind CSS v4, and a few peer packages. init sets all of it up — installs the peers and writes the theme CSS. Prefer manual control? The Getting Started guide lists every step.

# scaffolds peer deps + Tailwind v4 theme CSS
npx @arkite-ui/core init

import { Button, LocaleProvider, zhTW } from '@arkite-ui/core'
import '@arkite-ui/core/styles.css'

<LocaleProvider locale={zhTW}>
  <Button variant="primary">開始使用</Button>
</LocaleProvider>

Four presets, or bring a hex

Swap the entire palette at runtime. Custom brands get AA-passing foregrounds automatically.

DefaultStripe-inspired purple
NeutralZinc monochrome
OceanBlue tones
ForestGreen tones