Buttery ComponentsHeadless, accessible & style method agnostic React components that you can import, re-export and/or copy & paste
Buttery CommandsBuild a TS CLI the same way you would define NextJS or Remix routes
Buttery DocsCo-located, SSR ready, dead simple .md & .mdx docs
Buttery TokensEasily create, use, and scale a pure CSS design token system with 100% type-safety
Buttery LogsIsomorphic logging for full-stack apps
Buttery MetaSSR'd meta tags for your SSR'd React app
Creating multiple token sets
- Add the tokens as an array
export type ButteryConfig = {
commands?: ButteryConfigCommands;
tokens?: ButteryConfigTokens | ButteryConfigTokens[];
docs?: ButteryConfigDocs;
};
- Break it up in the config
.buttery/
|-- config.ts
|-- config.tokens.docs.ts
|-- config.tokens.playground.ts
// ./buttery/config.tokens.docs.ts
export const ConfigTokensDocs: ButteryConfigTokens = {
importName: "docs",
// ...restConfig,
};
// ./buttery/config.tokens.playground.ts
export const ConfigTokensDocs: ButteryConfigTokens = {
importName: "playground",
// ...restConfig,
};
// ./buttery/config.ts
import type { ButteryConfig } from "@buttery/core";
import { ConfigTokensDocs } from "./config.tokens.docs";
import { ConfigTokensPlayground } from "./config.tokens.playground";
const config: ButteryConfig = {
// ...restConfig,
tokens: [ConfigTokensDocs, ConfigTokensPlayground],
};
export default config;on this page
