File tree Expand file tree Collapse file tree 1 file changed +27
-0
lines changed Expand file tree Collapse file tree 1 file changed +27
-0
lines changed Original file line number Diff line number Diff line change @@ -12,8 +12,12 @@ This npm package provides a collection of reusable Patternfly React components t
1212* Patternfly React Components
1313 - OneCardWrapper
1414 - TableWrapper
15+ - VideoPlayerWrapper
1516* Dynamic Component Renderer
1617 - DynamicComponents
18+ * Supported Components
19+ - ` one-card ` , ` table ` , ` video-player `
20+ - ` video-player ` supports YouTube video URLs and direct video file URLs
1721
1822## Installation
1923
@@ -61,6 +65,29 @@ function App() {
6165}
6266```
6367
68+ ### VideoPlayer Component
69+
70+ ``` jsx
71+ import { VideoPlayerWrapper } from ' @rhngui/patternfly-react-renderer' ;
72+
73+ const videoData = {
74+ component: " video-player" ,
75+ video: " https://www.youtube.com/embed/v-PjgYDrg70" ,
76+ video_img: " https://img.youtube.com/vi/v-PjgYDrg70/maxresdefault.jpg" ,
77+ title: " Toy Story Trailer"
78+ };
79+
80+ function App () {
81+ return < VideoPlayerWrapper {... videoData} / > ;
82+ }
83+ ```
84+
85+ ** Supported Video Formats:**
86+ - YouTube URLs (e.g., ` https://www.youtube.com/embed/VIDEO_ID ` )
87+ - Direct video file URLs (e.g., ` https://example.com/video.mp4 ` )
88+ - Automatic thumbnail generation for YouTube videos
89+ - Poster image fallback support
90+
6491## Links
6592* [ Documentation] ( https://redhat-ux.github.io/next-gen-ui-agent/guide/renderer/patternfly_npm/ )
6693* [ Source Code] ( https://github.com/RedHat-UX/next-gen-ui-agent/tree/main/libs_js/next_gen_ui_react )
You can’t perform that action at this time.
0 commit comments