Packages for Bayon AI systems

Shared packages keep Bayon AI websites, chat surfaces, and internal tools aligned around one design language and one typed agent contract instead of copying product infrastructure across apps.

Package selection

These packages are the reusable Bayon AI layer: visual primitives for product websites and typed contracts for assistant experiences.

Packages

Select one package to inspect its install command, contract, and integration boundaries.

@bayonai/mui-design

Shared Bayon AI Material UI theme, tokens, page recipes, and reusable React surfaces.

Use this package when a Bayon AI React website needs the same dark visual system, panel language, Emotion cache helper, and client-side theme provider.

  • Bayon MUI theme, palette, typography, shadows, and component overrides
  • Server-safe page shells, panels, project cards, pillar cards, method boxes, and tech chips
  • Client-only provider, icon tooltip button, and animated Bayon flow visual

Package

@bayonai/mui-design

Current version: v0.2.1

Source: packages/mui-design

Boundaries

  • Does not own app routing.
  • Does not fetch or store product data.
  • Does not replace page-specific content strategy.
  • Does not publish itself without an explicit version and release step.

Install

npm install @bayonai/mui-design @mui/material @mui/icons-material @mui/material-pigment-css @emotion/react @emotion/styled @emotion/cache react react-dom

Inside this monorepo, consume it as a workspace package.

npm run build -w @bayonai/mui-design

Usage

import {
  bayonDarkTheme,
  BayonAccentPanel,
  BayonCtaPanel,
  mutedTextSx,
  tealButtonSx,
} from '@bayonai/mui-design';

import { BayonThemeProvider } from '@bayonai/mui-design/client';

Integration checklist

  1. Wrap the consuming React app with `BayonThemeProvider` from the client entrypoint.
  2. Import server-safe panels, chips, and `sx` recipes from the main package entrypoint.
  3. Keep visual primitives in this package when a pattern needs to be shared across Bayon sites.
  4. Build and typecheck the package before publishing or consuming updated workspace output.

Public contract

Consume the selected package contract directly instead of copying configuration into app components.

Theme tokens, palette, typography, shadows, and component overrides

Server-safe page shells, panels, cards, method boxes, and tech chips

Client-only theme provider, Emotion cache helper, and icon tooltip button

Shared style recipes for Bayon surfaces, buttons, heroes, and muted copy

Building a Bayon AI app surface?

Start with the shared packages for visual consistency, then pull agent identity from the chat package when the surface needs an assistant.

Talk to Bayon AI