This page guides you through adding PatternFly Java to a Maven project, selecting a compilation target (GWT or J2CL), configuring dependencies, and building your first page.
For module architecture details, see Project Architecture. For local development setup, see Local Development Setup. For compilation target comparison, see GWT vs J2CL.
| Requirement | Minimum Version |
|---|---|
| Java | 21 |
| Maven | 3.9.9 |
| Compilation target | GWT 2.13.0 or J2CL (via j2cl-maven-plugin) |
These constraints are enforced in pom.xml271-284
patternfly-java publishes a Bill of Materials (BOM) artifact to Maven Central under org.patternfly:patternfly-java-bom. Importing the BOM into your project's <dependencyManagement> block pins all patternfly-java artifact versions so you do not need to repeat the version on individual dependencies.
The full list of artifacts managed by the BOM is declared in bom/pom.xml84-200
There are exactly two entry-point artifacts. Choose the one that matches your compilation stack.
Maven Dependency Graph:
Sources: gwt/pom.xml47-70 j2cl/pom.xml35-44 components/pom.xml35-57 core/pom.xml39-51
Note the <type>gwt-lib</type> packaging (gwt/pom.xml31).
After adding the dependency, inherit the GWT module in your .gwt.xml descriptor:
The module name org.patternfly.PatternFly is defined in gwt/pom.xml78 This module automatically injects required JavaScript libraries (Popper.js) via ScriptInjector at runtime. See GWT Integration for implementation details.
No module descriptor inheritance is needed for J2CL. For details on how J2CL transpilation works, see J2CL Integration.
PatternFly Java does not bundle CSS stylesheets. You must include PatternFly CSS separately in your HTML or build pipeline. Refer to the PatternFly getting started guide for stylesheet distribution options.
The showcase application demonstrates stylesheet integration using Parcel and npm. The PatternFly CSS version used is declared in pom.xml88 See showcase/pom.xml for the complete frontend build configuration.
PatternFly Java uses a fluent builder API built on Elemento's builder API Components are created via static factory methods, modified through method chaining, and attached to the DOM using Elemento's body() helper from org.jboss.elemento.Elements.
All components extend BaseComponent (components/src/main/java/org/patternfly/component/BaseComponent.java) or BaseComponentSVG, which implement Elemento's builder interfaces. The API follows these patterns:
| Method Type | Example | Returns | Purpose |
|---|---|---|---|
| Factory | button("text"), page(), card() | New component instance | Create component |
| Add | addMasthead(), addToggle(), addItem() | Parent component (this) | Add child subcomponent |
| Modifier | flat(), rounded(), inline(), primary() | Same component (this) | Apply CSS modifier |
| ARIA | ariaLabel(), ariaScrollBackLabel() | Same component (this) | Set ARIA attribute |
| Event | onToggle(), onClick(), onChange() | Same component (this) | Register event handler |
| Getter | value(), text(), element() | Value or void | Read state or access DOM element |
Sources: README.md128-206 components/src/main/java/org/patternfly/component/BaseComponent.java
The Page class (org.patternfly.component.page.Page) serves as the root container. It aggregates Masthead, PageSidebar, and PageMain subcomponents.
Component Structure:
Sources: README.md6-33 components/src/main/java/org/patternfly/component/page/Page.java components/src/main/java/org/patternfly/component/page/PageMain.java components/src/main/java/org/patternfly/component/page/Masthead.java
The code below demonstrates a complete page structure with masthead, sidebar navigation, and main content area:
Key Imports:
Each static factory method resides in its corresponding component class within org.patternfly.component.* packages. The fluent API returns the component instance (this) from modifier and add*() methods, enabling method chaining.
Sources: README.md6-33 components/src/main/java/org/patternfly/component/page/Page.java components/src/main/java/org/patternfly/component/page/Masthead.java components/src/main/java/org/patternfly/component/navigation/Navigation.java
Charts require the @patternfly-java/charts npm package, which wraps PatternFly React charts as web components. This is the only JavaScript dependency in PatternFly Java.
Install the npm package:
Import in your JavaScript entry point:
Add the Maven dependency:
The charts module (patternfly-java-charts) provides Java API classes that instantiate custom elements (e.g., <pfj-chart-donut>, <pfj-chart-bullet>) which are handled by the web component wrappers. See Chart Components for architecture details and usage examples.
Sources: README.md89-103 showcase/pom.xml67-69 charts/pom.xml
The following table summarizes all available patternfly-java Maven artifacts and when to add them explicitly. patternfly-java-gwt or patternfly-java-j2cl transitively includes components, layouts, icons, tokens, and core, so those rarely need to be declared directly.
| Artifact ID | Purpose | Add explicitly? |
|---|---|---|
patternfly-java-bom | Version management | Always (as import) |
patternfly-java-gwt | GWT entry point | If using GWT |
patternfly-java-j2cl | J2CL entry point | If using J2CL |
patternfly-java-components | UI components | Transitive |
patternfly-java-layouts | Layout containers | Transitive |
patternfly-java-icons | FontAwesome + PatternFly icons | Transitive |
patternfly-java-tokens | CSS design token enum | Transitive |
patternfly-java-core | Base classes, utilities | Transitive |
patternfly-java-charts | Donut, Bullet, Pie charts | If using charts |
patternfly-java-codeeditor | Code editor extension | If using code editor |
patternfly-java-finder | Finder extension | If using finder |
Sources: bom/pom.xml84-200 README.md106-122
Refresh this wiki