Skip to content

Admin kit

@bison-lab/admin-ui is its own install. The Header items field (NAV_ITEMS_FIELD) and a block’s repeating items (ITEMS_FIELD, drawn with ItemsList) are Payload adapters. What it draws with lives here. This page mounts those modules one at a time (sidebar + canvas), under Payload --theme-*, with local state. It is not the Field, and it does not call useField.

Field adapters in @bison-lab/payload-blocks/admin and @bison-lab/payload-core/admin compose these primitives and own useField / useForm. The . entry does not import payload or @payloadcms/ui.

Terminal window
pnpm add @bison-lab/admin-ui

Wrap a screen in KitProvider once so the kit styles mount. Primary paint is --bl-kit-accent (Theme primary at runtime; a fallback only when that token is missing).

import { Button, KitProvider } from "@bison-lab/admin-ui";
export function EditorChrome({ children }: { children: React.ReactNode }) {
return (
<KitProvider>
<Button type="button">Save</Button>
{children}
</KitProvider>
);
}

Light and dark in the frame flip those Payload tokens. They do not follow the docs theme toolbar.

Admin kit · @bison-lab/admin-uiOpen ↗

A new kit primitive, or a change to an existing one, updates this preview in the same change. Admin Fields stay out of Storybook.