Home

bestax-bulma

A modern, flexible React component library built with the latest Bulma v1 and TypeScript.

---

📚 Comprehensive Documentation

Looking for full documentation, guides, API references, and best practices?
👉 Visit our official docs at https://bestax.cc

The documentation site is the best place to learn about all bestax-bulma features, usage patterns, and updates. We strongly recommend using the docs as your primary resource!

---

🚀 Getting Started

1. Install the package

npm install @allxsmith/bestax-bulma
# or
yarn add @allxsmith/bestax-bulma

2. Import Bulma CSS

You must include Bulma’s CSS in your project. The easiest way is to import it in your main JS/TS file:

import 'bulma/css/bulma.min.css';

Or add it via CDN in your HTML:

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/bulma@1.0.4/css/bulma.min.css"
/>

3. (Optional) Add an Icon Library

Many components work well with icons. We recommend Font Awesome:

npm install @fortawesome/fontawesome-free

And then import in your code as needed.

4. Quick Example

Here’s how to use the Button component:

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

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

export default App;

---

💎 Why Choose bestax-bulma?

• Supports the latest Bulma v1.x
  Other React Bulma libraries are stuck on Bulma 0.9.4 — bestax-bulma is built for the future.
• Super small bundle size
  The published ESM build (dist/index.esm.js) is just over 110kB. Smaller than most other CSS based React frameworks.
• Super small unpacked size
  Just over 700kB unpacked — smaller than most other Bulma React packages.
• Zero external dependencies
  Clean install, smaller bundle, fewer codeql security issues.
• 99% unit test coverage
  Rigorously tested for reliability and stability.
• 100% TypeScript
  Full type safety for you and your team.
• Active developer support
  Issues? Questions? PRs? Get fast responses and real improvements.

---

📦 NPM Package

View the package on npmjs:
👉 https://www.npmjs.com/package/@allxsmith/bestax-bulma

---

📚 Documentation

For full documentation, guides, and best practices, please use our official docs site:

👉 https://bestax.cc

Always refer to the documentation site first:
It’s the most complete and up-to-date source for everything bestax-bulma!

---

📖 Storybook

Explore live, interactive component examples in our Storybook:

👉 https://bestax.cc/storybook

---

🙏 Special Thanks

Bulma

bestax-bulma is built on top of the incredible @jgthms/bulma CSS framework.

If you find Bulma useful, please consider sponsoring Jeremy Thomas to support the continued development of Bulma.

Note: We are not affiliated with Bulma or Jeremy Thomas in any way...We’re just big fans of the Bulma framework!

---

Attribution

• The Bulma CSS framework is © Jeremy Thomas and licensed under the MIT License.
• Some example content and documentation in this site is adapted from the Bulma website (CC BY-NC-SA 4.0), © Jeremy Thomas.

See Bulma’s license page for more details.

---

License

MIT