At a Glance
- Why
- Data visualization and analytics often require combining multiple low-level primitives. Building domain-specific tooling from scratch for each use case is time-consuming and error-prone.
- Benefit
- Provides a composable toolkit of higher-level patterns and components for analytics, allowing teams to assemble domain-specific solutions quickly from tested building blocks.
- For
- Analytics teams, data platform engineers, and domain experts who need to build custom visualization and analysis tools tailored to their specific business context.
- Use
- Import ShelfSignals components and patterns into your analytics application, compose them to match your domain needs, and extend with custom logic as required.
Architecture
Context Diagram
ShelfSignals in the analytics ecosystem:
┌─────────────────────────────────────────────────────────────┐
│ Analytics Team / Users │
│ (building domain-specific tools) │
└───────────────────────┬─────────────────────────────────────┘
│
│ composes from
▼
┌─────────────────────────────────────────────────────────────┐
│ ShelfSignals │
│ (composable toolkit) │
│ │
│ ┌──────────────┐ ┌──────────────┐ ┌──────────────┐ │
│ │ Patterns │ │ Components │ │ Signals │ │
│ │ Library │ │ Shelf │ │ System │ │
│ └──────────────┘ └──────────────┘ └──────────────┘ │
└───┬───────────────────────────┬─────────────────────────────┘
│ │
│ uses │ uses
▼ ▼
┌────────────┐ ┌──────────────┐
│ ChartSpec │ │ context │
│ (viz layer)│ │ (runtime) │
└────────────┘ └──────────────┘
Internal Architecture
Key modules inside ShelfSignals:
┌─────────────────────────────────────────────────────────────┐ │ ShelfSignals Core │ ├─────────────────────────────────────────────────────────────┤ │ │ │ ┌───────────────────────────────────────────────────┐ │ │ │ Signals System │ │ │ │ • Reactive data flow │ │ │ │ • State management │ │ │ │ • Cross-component communication │ │ │ └───────────────┬───────────────────────────────────┘ │ │ │ │ │ ▼ │ │ ┌───────────────────────────────────────────────────┐ │ │ │ Component Shelf │ │ │ │ ┌──────────┐ ┌──────────┐ ┌──────────┐ │ │ │ │ │ Filter │ │Aggregate │ │Transform │ │ │ │ │ │Component │ │Component │ │Component │ ... │ │ │ │ └──────────┘ └──────────┘ └──────────┘ │ │ │ └───────────────┬───────────────────────────────────┘ │ │ │ │ │ ▼ │ │ ┌───────────────────────────────────────────────────┐ │ │ │ Patterns Library │ │ │ │ • Dashboard composition │ │ │ │ • Multi-view coordination │ │ │ │ • Drill-down hierarchies │ │ │ │ • Time-series analysis │ │ │ └───────────────────────────────────────────────────┘ │ │ │ └─────────────────────────────────────────────────────────────┘
How to Use
-
Install ShelfSignals
Add the toolkit:
npm install @gitbrainlab/shelfsignals - Choose your patterns Browse the patterns library to find pre-built solutions that match your analytics needs (dashboards, drill-downs, etc.).
- Compose components Assemble components from the shelf into your custom analytics interface, wiring them together with the signals system.
- Extend with domain logic Add your domain-specific calculations, business rules, and custom visualizations on top of the base toolkit.
- Deploy and iterate Deploy your analytics tool and iterate based on user feedback, reusing and refining components across use cases.