Bootstrap 5.3.8 integration for JWebMP with Angular 21. Provides type-safe Java wrappers for all Bootstrap components — cards, modals, navbars, forms, carousels, accordions, toasts, and more — with CRTP fluent APIs, SCSS theming, and ng-bootstrap Angular integration.
Built on Bootstrap 5 · ng-bootstrap · JWebMP Core · JPMS module com.jwebmp.plugins.bootstrap · Java 25+
Version: 5.3.8 — Bootstrap 5 with ng-bootstrap 20 for Angular 21.
<dependency>
<groupId>com.jwebmp.plugins</groupId>
<artifactId>bootstrap</artifactId>
<version>2.0.3-SNAPSHOT</version>
</dependency>Gradle (Kotlin DSL)
implementation("com.jwebmp.plugins:bootstrap:2.0.0-SNAPSHOT")The plugin automatically includes Bootstrap dependencies:
{
"dependencies": {
"bootstrap": "^5.3.8",
"@ng-bootstrap/ng-bootstrap": "^20.0.0",
"@popperjs/core": "*",
"@angular/localize": "^21.0.0"
}
}- 40+ Components — Cards, modals, navbars, accordions, carousels, toasts, alerts, badges, breadcrumbs, buttons, dropdowns, forms, pagination, popovers, progress bars, tables, and more
- SCSS Theming — Bootstrap SCSS loaded as stylesheet for full theme customization
- ng-bootstrap Integration — Angular-native Bootstrap components via ng-bootstrap 20
- Responsive Grid — Container, row, and column layout system
- Form Controls — Input groups, form groups, validation styles, select menus, date/time pickers
- Navigation — Navbar, navs, tabs, breadcrumbs, pagination
- Modals & Dialogs — Modal with show/hide/shown/hidden events
- Carousel — Slide shows with events, features, and options
- Accordion — Collapsible content panels
- Toasts — Lightweight notification components with events
- Dropdown — Toggleable menus with events and positioning
- Collapse — Toggle visibility with animation events
- Button Groups — Checkbox, radio, switch, and toolbar variants
- Cards — Flexible content containers with themed layouts
- Tables — Styled tables with Bootstrap classes
- Popovers — Toggleable contextual overlays
- Progress Bar — Stacked and animated progress indicators
- Type-Safe Options — All component options as Java classes
- CRTP Fluent API — Method chaining for component configuration
- Zero Configuration — Auto-registered via ServiceLoader SPI
- Auto Component Detection —
IOnComponentAddedSPI auto-applies Bootstrap classes
- Java 25 LTS (required)
- Maven 3.8+
- Node.js 18+ (for frontend builds)
- Angular 21+ (auto-integrated via JWebMP)
// module-info.java
module com.myapp {
requires com.jwebmp.plugins.bootstrap;
}BSCard<?> card = new BSCard<>();
card.addCardHeader("Header");
card.addCardBody("Card body content");
card.addCardFooter("Footer");BSModal<?> modal = new BSModal<>();
modal.addTitle("Confirm Action");
modal.addModalBody("Are you sure?");
modal.addDismissButton("Cancel");
modal.addPrimaryButton("Confirm");BSNavBar<?> navbar = new BSNavBar<>();
navbar.addBrand("My App", "/");
navbar.addHeaderItem("Home", "/home");
navbar.addHeaderItem("About", "/about");BSForm<?> form = new BSForm<>();
BSFormGroup<?> group = new BSFormGroup<>();
group.setLabel("Email");
group.setInput(new BSInput<>(InputTypes.Email));
form.add(group);- Backend: Java 25 LTS, Maven, GuicedEE (IoC)
- Frontend: Angular 21, TypeScript, Bootstrap 5.3.8, ng-bootstrap 20
- Integration: JWebMP Page Configurators, ServiceLoader SPI
- Styling: Bootstrap SCSS with Popper.js positioning
- Module System: JPMS with explicit dependencies
src/main/java/com/jwebmp/plugins/bootstrap/
├── BootstrapPageConfigurator.java # Auto-configuration
├── accordion/ # Accordion component
├── alerts/ # Alert component with events
├── badge/ # Badge component
├── breadcrumbs/ # Breadcrumb navigation
├── buttons/ # Buttons, groups, checkbox, radio, switch
├── cards/ # Card, themed, prebuilt, layout
├── carousel/ # Carousel with events and features
├── close/ # Close button
├── collapse/ # Collapse with events
├── containers/ # Container layout
├── datepicker/ # Date picker
├── dropdown/ # Dropdown with events
├── figures/ # Figure component
├── forms/ # Forms, groups, controls, interfaces
├── images/ # Image component
├── jumbotron/ # Jumbotron hero section
├── listgroup/ # List group with parts
├── media/ # Media object
├── modal/ # Modal with events and parts
├── navbar/ # Navbar with toggler
├── navs/ # Nav tabs and pills
├── options/ # Global options
├── pagination/ # Pagination component
├── popovers/ # Popover component
├── progressbar/ # Progress bar
├── range/ # Range input
├── select/ # Select component
├── tables/ # Table component
├── timepicker/ # Time picker
├── toasts/ # Toast with events and features
└── toggle/ # Toggle component
@TsDependency(value = "bootstrap", version = "^5.3.8")
@TsDependency(value = "@ng-bootstrap/ng-bootstrap", version = "^20.0.0")
@TsDependency(value = "@popperjs/core", version = "*")
@TsDependency(value = "@angular/localize", version = "^21.0.0")
@NgPolyfill("@angular/localize/init")
@NgStyleSheet(value = "node_modules/bootstrap/scss/bootstrap.scss", name = "bootstrap")
@NgScript(value = "@popperjs/core/dist/umd/popper.js", sortOrder = 4)
@NgScript(value = "bootstrap/dist/js/bootstrap.js", sortOrder = 5)
public class BootstrapPageConfigurator implements IPageConfigurator {
// Auto-loaded via ServiceLoader SPI
}com.jwebmp.plugins.bootstrap
├── com.jwebmp.core (JWebMP core)
├── com.jwebmp.client (JWebMP client)
├── com.jwebmp.core.angular (Angular integration)
├── com.jwebmp.core.base.angular.client (TypeScript annotations)
├── com.google.common (Guava)
└── com.guicedee.guicedinjection (Guice DI)
mvn clean test- Bootstrap Docs — Official Bootstrap documentation
- ng-bootstrap — Angular-native Bootstrap components
- JWebMP Home — JWebMP framework documentation
| Aspect | Status |
|---|---|
| Version | 5.3.8 / 2.0.0-SNAPSHOT |
| Bootstrap | 5.3.8 |
| ng-bootstrap | 20.0.0 |
| Components | 40+ |
| Java | 25 LTS (required) |
| License | Apache 2.0 |
| Maintenance | Active |
- GitHub Repository: https://github.com/JWebMP/JWebMP
- Bootstrap Home: https://getbootstrap.com/
- ng-bootstrap: https://ng-bootstrap.github.io/
- JWebMP Home: https://jwebmp.com/
Licensed under the Apache License 2.0.
Made with JWebMP