You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
feat: Update staging docs with latest prerelease versions (#4893)
* bump versions the first time
* bump again
* update with docked nav docs
* bump other versions for Erin
* update screenshots
* update component-groups version
Copy file name to clipboardExpand all lines: packages/documentation-site/patternfly-docs/content/AI/about-generative-ui.md
+21-20Lines changed: 21 additions & 20 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -22,15 +22,16 @@ Generative UI represents a significant opportunity for PatternFly to explore new
22
22
23
23
### AI-enabled seed app
24
24
25
-
We are creating an [AI-enabled seed app](https://github.com/patternfly/patternfly-react-seed/tree/compass_theme) that you can use to create your own PatternFly Compass-based POC. The seed app includes the Compass layout fully wired out with all styles set up, providing a solid foundation that you can build on top of. It can be leveraged with AI tools like Cursor or Claude Code to build out your own POC, making it easier to experiment with generative UI patterns and explore new use cases.
25
+
We are creating an [AI-enabled seed app](https://github.com/patternfly/patternfly-react-seed/tree/compass_theme) that you can use to create your own PatternFly Compass-based POC. The seed app includes the new layout fully wired out with developing unified theme and AI styles set up, providing a solid foundation that you can build on top of. It can be leveraged with AI tools like Cursor or Claude Code to build out your own POC, making it easier to experiment with generative UI patterns and explore new use cases with our PatternFly design system.
26
+
26
27
27
28
### What does Compass include?
28
29
29
30
To explore Compass and its features, take a look at a number of our full page demos:
30
-
-[Full page demo with card view and table layouts](/ai/generative-uis/compass#card-and-data-view-layout)
31
-
-[Full page demo with dashboard layout](/ai/generative-uis/compass/org-demos#dashboard-layout)
32
-
-[Static, full page HTML demo with multiple content sections](/ai/generative-uis/compass/html-demos#multiple-sections)
33
-
-[Static, full page HTML demo with drawer](/ai/generative-uis/compass/html-demos#with-drawer)
31
+
-[Conversational first full page demo with card view and table layouts](/ai/generative-uis/compass#card-and-data-view-layout)
32
+
-[Conversational first full page demo with dashboard layout](/ai/generative-uis/compass/org-demos#dashboard-layout)
33
+
-[Static, conversational first full page HTML demo with multiple content sections](/ai/generative-uis/compass/html-demos#multiple-sections)
34
+
-[Static, conversational first full page HTML demo with drawer](/ai/generative-uis/compass/html-demos#with-drawer)
34
35
35
36
To support the different ways you might use Compass, we've introduced several new capabilities to PatternFly:
36
37
@@ -39,7 +40,7 @@ To support the different ways you might use Compass, we've introduced several ne
39
40
- Background and border gradients
40
41
- Additional smooth animations
41
42
- Background image explorations
42
-
-[**Compass layout component**](/ai/generative-uis/compass): A new layout component designed specifically for generative UI patterns
43
+
-[**Compass layout component**](/ai/generative-uis/compass): A new layout component designed specifically for generative UI patterns specifically for generative UI patterns that include: conversational first (explain how the footer contains the interactive message bar and that the center canvas is where the generated UI will be placed) and coming soon, a maximized canvas with a docked left navigation that is suitable for all enterprise experiences.
43
44
-**Additional components and component variants**:
44
45
- Transparency & Effects:
45
46
-`isPlain` makes cards, data lists, and tables transparent to allow background effects (like a glass look) to show through.
@@ -59,22 +60,22 @@ Accessibility has been a major focus throughout the Compass exploration. As gene
59
60
60
61
### Integration with react-flow
61
62
62
-
Some stakeholdres have been experimenting with Generative UI use cases using React Flow. The React Flow package `@xyflow/react` is compatible with PatternFly through customization of its [theme](https://reactflow.dev/learn/customization/theming) and [rendered nodes](https://reactflow.dev/learn/customization/custom-nodes). A custom override stylesheet can assign PatternFly's global tokens to React Flow's own tokens to ensure a consistent styling. We have created some [documentation and a demo](/ai/generative-uis/react-flow) for integrations with PatternFly as a POC for these use cases.
63
+
Some stakeholders have been experimenting with Generative UI use cases using React Flow. The React Flow package `@xyflow/react` is compatible with PatternFly through customization of its [theme](https://reactflow.dev/learn/customization/theming) and [rendered nodes](https://reactflow.dev/learn/customization/custom-nodes). A custom override stylesheet can assign PatternFly's global tokens to React Flow's own tokens to ensure a consistent styling. We have created some [documentation and a demo](/ai/generative-uis/react-flow) for integrations with PatternFly as a POC for these use cases.
63
64
64
65
### Current status
65
66
66
67
Compass is still under development, with new components being built, evaluated, and refined based on feedback. As we hear from your experiments and learn more about GenUI patterns, the design of Compass will continuously evolve to support practical applications.
67
68
68
-
As of Nov 10, 2025, these are the prereleases available for building out Compass based UI POCs.
0 commit comments