BitBoss UI (bitboss-ui)

Vue 3 component library used across BitBoss products. It ships typed building blocks (inputs, selects, tabs, navigation, overlays, and more), built with the Composition API, TypeScript, and Tailwind-oriented styling.

What’s in the package

Published artifacts are dist/ (ESM JavaScript, .d.ts, and index.css) plus this README. The sections below match how the library is organised in code and in the documentation.

Styles

• Global stylesheet — import bitboss-ui/styles.css once. It bundles design tokens, base rules, and styles for all exported components (built from the library’s PostCSS/Tailwind pipeline).

TypeScript: icons

• IconType, IconRegistry — types used by icon-aware components; extend IconRegistry in your app to register project-specific icons.

Composables

| Composable | Role | | ----------------------------- | --------------------------------------------------------- | | useBbConfig | Global options for the kit (locale, defaults, etc.). | | useBroadcastChannelInstance | Shared BroadcastChannel helper for cross-tab messaging. | | useConfirm | Programmatic confirm / modal flows. | | useCountdown | Countdown timer state. | | useMobile | Mobile / viewport-oriented behaviour. | | useQueue | Simple async task queue. | | useToast | Toast notifications API. |

Base* components (primitives)

Headless or low-level pieces used inside Bb* wrappers or your own compositions:

• Actions: BaseButton
• Text & numbers: BaseTextInput, BaseTextarea, BaseNumberInput, BaseTag
• Choice: BaseCheckbox, BaseCheckboxGroup, BaseRadio, BaseRadioGroup, BaseSwitch, BaseSwitchGroup, BaseSlider, BaseRating
• Rich inputs: BaseSelect, BaseColorInput, BaseDatePicker, BaseDatePickerInput
• Layout / chrome: BaseInputContainer, BaseDialog

Bb* components (composed)

Product-ready components with labels, hints, errors, and consistent styling:

• Forms & actions: BbTextInput, BbTextarea, BbNumberInput, BbSelect, BbCheckbox, BbCheckboxGroup, BbRadio, BbRadioGroup, BbSwitch, BbSwitchGroup, BbSlider, BbRating, BbColorInput, BbDatePickerInput, BbButton, BbChip, BbTag, BbDropdown, BbDropdownButton
• Feedback: BbAlert, BbProgress, BbSpinner, BbToast, BbTooltip
• Layout & navigation: BbAccordion, BbCollapsible, BbTab, BbBreadcrumbs, BbPagination, BbRows, BbRatio, BbSmoothHeight
• Overlays & panels: BbDialog, BbConfirm, BbConfirmPortal, BbOffCanvas, BbPopover
• Data: BbTable, BbTree
• Media & files: BbAvatar, BbDropzone, BbIcon
• Utilities: BbIntersection

Shared input shells

• CommonInputInnerContainer, CommonInputOuterContainer — layout primitives for building inputs that align with BitBoss spacing, icons, and clear buttons.

Exported component types

For most Base* and Bb* components, the package exports matching props, events, and (where relevant) slots types (for example BbSelectProps, BaseSelectEvents). Use them for typed wrappers and design-system layers; the docs list the full set per component.

Documentation

Primary docs (components, props, guides):

• BitBoss UI documentation — site with guides and API reference.

BitBoss

This package is developed and maintained by BitBoss, a software house based in Turin, Italy.

• BitBoss — homepage
• BitBoss Developers — community and developer-facing resources

Requirements

• Vue ^3.5.12 (peer dependency).
• @inertiajs/vue3 — optional peer. Install it only if you use Inertia-specific helpers or components that expect an Inertia app; Nuxt and plain Vue apps can omit it.

Installation

npm install bitboss-ui

pnpm add bitboss-ui

yarn add bitboss-ui

Quick start

JavaScript / TypeScript

The package exposes ESM entry points (see package.json → exports).

import { BbButton, BbTextInput, useToast } from 'bitboss-ui';

Styles

Bundled CSS is published under the styles export:

import 'bitboss-ui/styles.css';

Use this once in your app entry (or in Nuxt/Vite global CSS) so components match the intended look and layout.

Local development (this repository)

Clone the repo, install dependencies, then:

| Command | Purpose | | ------------------ | ---------------------------------- | | npm run dev | Vite playground app | | npm run build | Library build (dist/) | | npm run docs:dev | Documentation site (VitePress) | | npm run lint | ESLint + Stylelint (as configured) |

Support

• Usage and APIs: see the documentation.
• Company / licensing / commercial: BitBoss.

Trademark

“BitBoss” and related branding are property of their respective owners. This README refers to the open npm package bitboss-ui and its documentation; it does not grant additional trademark rights.