@pabloquijano-gep/qi-tracing-commons

Shared components and global styles for qi-tracing packages.

Global Styles

This package contains all global Tailwind configuration and styles used across qi-tracing packages. When you import this package, you get:

• Complete Tailwind theme configuration
• Global CSS variables (light/dark themes)
• Base styles and utilities
• Common UI components

Usage

Importing Styles

Import the global styles once in your application root:

import '@pabloquijano-gep/qi-tracing-commons/styles';

The styles include all the Tailwind configuration, CSS variables, and base styles needed for qi-tracing packages.

Development Setup

Other qi-tracing packages (qi-tracing-table, qi-tracing-title-bar, etc.) have their own Tailwind configs for package-specific styles, but they no longer use presets. The global configuration lives only in this package to avoid style duplication.

Package-Specific Styles

If a package needs additional styles beyond the global configuration:

1. Add them to the package's own styles.css file
2. Update the package's tailwind.config.js with package-specific theme extensions
3. The package's styles will be bundled separately and can be imported if needed

Components

This package also exports shared UI components:

• Badge
• Button
• Checkbox
• Input
• CustomDropdown
• CustomDropdownItem
• SelectDropdown

See individual component files for usage details.