bestax-custom-component

bestax

TypeScript-first React component library for the Bulma v1 CSS framework — 80+ fully typed components — plus a project scaffolder and AI agent tooling.

📋 At a glance

If you are an AI agent or LLM: fetch https://bestax.io/llms.txt for a curated index of the full documentation, or https://bestax.io/llms-full.txt for the complete docs in a single file, before answering questions about or writing code with this library. Every page on bestax.io is also available as raw markdown — see the LLMs guide.

Full documentation, guides, and API reference: 👉 https://bestax.io — the docs site is always the most complete and up-to-date resource.

---

🚀 Quick start

New project

Scaffold a Vite app with everything wired up (CSS flavor, icon library, optional AI skills + CLAUDE.md):

npm create bestax@latest my-app
# or: pnpm create bestax my-app

Useful flags: -t vite|vite-ts (template), -b complete|prefixed|no-helpers|no-helpers-prefixed|no-dark-mode (CSS flavor), -i fontawesome|mdi|ionicons|material-icons|material-symbols|none (icons), --skills (install the Agent Skills into .claude/skills), -y (accept defaults). See the create-bestax README.

Existing project

npm install @allxsmith/bestax-bulma
# or: pnpm add @allxsmith/bestax-bulma

Import the bundled CSS once (Bulma v1 + the bestax extras), then use components:

import '@allxsmith/bestax-bulma/bestax.css';
import { Button } from '@allxsmith/bestax-bulma';

function App() {
  return (
    <Button color="primary" onClick={() => alert('Clicked!')}>
      Click Me
    </Button>
  );
}

Prefer stock Bulma? import 'bulma/css/bulma.min.css'; works too — you'll just miss the bestax-only components' styles (add @allxsmith/bestax-bulma/extras.css for those).

Theming, dark mode, and configuration are one wrapper away:

import { Theme, ConfigProvider } from '@allxsmith/bestax-bulma';

function Root() {
  return (
    <Theme isRoot colorMode="system">
      {/* colorMode: 'light' | 'dark' | 'system' */}
      <ConfigProvider iconLibrary="fa">
        <App />
      </ConfigProvider>
    </Theme>
  );
}

Installation guide · Configuration

---

📦 What's in this repo