UI Overview
@caffeinebounce/ui is the broadest package in the workspace. It combines primitives, product layouts, navigation, form flows, data-table utilities, and marketing blocks used across Doug's app surfaces.
Install
yarn add @caffeinebounce/uiBest-fit use cases
- Shared product shells and authenticated layouts
- Marketing pages that should still feel aligned with product UI
- Reusable tables, finance controls, and multi-step form patterns
- Shared theme-aware building blocks such as navigation, cards, dialogs, and feedback affordances
Curated demos
Ready state
Primitive controls stay visually aligned with shared feedback states, shortcuts, and form inputs.
Portal Shell
Navigation primitives
Quarterly review workspace
Composed from cards, badges, buttons, and form inputs
Why this matters
The package gives product teams one visual language for shells, navigation, forms, and high-signal dashboard surfaces.
Featured entrypoints
Root
@caffeinebounce/ui
Notable exports
Build targets
- ./dist/index.d.ts
- ./dist/index.js
- ./dist/index.mjs
Blog
@caffeinebounce/ui/blog
Blog components: cards, post layout, MDX renderers, and table of contents.
Notable exports
Wildcard re-exports
Build targets
- ./dist/blog.d.ts
- ./dist/blog.js
- ./dist/blog.mjs
Charts
@caffeinebounce/ui/charts
Chart components powered by Recharts.
Notable exports
Wildcard re-exports
Build targets
- ./dist/charts.d.ts
- ./dist/charts.js
- ./dist/charts.mjs
Data Table
@caffeinebounce/ui/data-table
DataTable components for building complex data grids.
Notable exports
Wildcard re-exports
Build targets
- ./dist/data-table.d.ts
- ./dist/data-table.js
- ./dist/data-table.mjs
Editor
@caffeinebounce/ui/editor
Visual editor components powered by GrapesJS Studio SDK.
Notable exports
Wildcard re-exports
Build targets
- ./dist/editor.d.ts
- ./dist/editor.js
- ./dist/editor.mjs
Forms
@caffeinebounce/ui/forms
Form components including FormWizard for multi-step forms.
Notable exports
Wildcard re-exports
Build targets
- ./dist/forms.d.ts
- ./dist/forms.js
- ./dist/forms.mjs
Hooks
@caffeinebounce/ui/hooks
Custom React hooks for common UI patterns.
Notable exports
Wildcard re-exports
Build targets
- ./dist/hooks.d.ts
- ./dist/hooks.js
- ./dist/hooks.mjs
Layouts
@caffeinebounce/ui/layouts
Layout components for building page structures.
Notable exports
Wildcard re-exports
Build targets
- ./dist/layouts.d.ts
- ./dist/layouts.js
- ./dist/layouts.mjs
Marketing
@caffeinebounce/ui/marketing
Marketing page components like HeroSection, BenefitsSection, etc.
Notable exports
Wildcard re-exports
Build targets
- ./dist/marketing.d.ts
- ./dist/marketing.js
- ./dist/marketing.mjs
Navigation
@caffeinebounce/ui/navigation
Navigation components like Navbar, Footer, and EntitySwitcher.
Notable exports
Wildcard re-exports
Build targets
- ./dist/navigation.d.ts
- ./dist/navigation.js
- ./dist/navigation.mjs
Portal
@caffeinebounce/ui/portal
Portal components: deal cards, layouts, and auth screens for the investor portal.
Notable exports
Wildcard re-exports
Build targets
- ./dist/portal.d.ts
- ./dist/portal.js
- ./dist/portal.mjs
Settings
@caffeinebounce/ui/settings
Settings page components for building settings interfaces.
Notable exports
Wildcard re-exports
Build targets
- ./dist/settings.d.ts
- ./dist/settings.js
- ./dist/settings.mjs
Styles
@caffeinebounce/ui/styles.css
Notable exports
Build targets
- ./dist/styles.css