@flamingo-stack/openframe-frontend-core 0.0.178 → 0.0.179-snapshot.20260514181702

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/dist/{chunk-AAX27BCR.js → chunk-DV2GT7RI.js} +3703 -4168
  2. package/dist/chunk-DV2GT7RI.js.map +1 -0
  3. package/dist/{chunk-L4T24AN4.cjs → chunk-JFGORTXV.cjs} +868 -1333
  4. package/dist/chunk-JFGORTXV.cjs.map +1 -0
  5. package/dist/components/chat/chat-message-list.d.ts.map +1 -1
  6. package/dist/components/features/entity-video-section.d.ts +54 -0
  7. package/dist/components/features/entity-video-section.d.ts.map +1 -0
  8. package/dist/components/features/index.cjs +18 -2
  9. package/dist/components/features/index.cjs.map +1 -1
  10. package/dist/components/features/index.d.ts +4 -2
  11. package/dist/components/features/index.d.ts.map +1 -1
  12. package/dist/components/features/index.js +21 -5
  13. package/dist/components/features/video-bites-display.d.ts +38 -0
  14. package/dist/components/features/video-bites-display.d.ts.map +1 -0
  15. package/dist/components/features/video-ratio-tabs.d.ts +62 -0
  16. package/dist/components/features/video-ratio-tabs.d.ts.map +1 -0
  17. package/dist/components/features/video.d.ts +94 -0
  18. package/dist/components/features/video.d.ts.map +1 -0
  19. package/dist/components/index.cjs +18 -2
  20. package/dist/components/index.cjs.map +1 -1
  21. package/dist/components/index.js +21 -5
  22. package/dist/components/media-carousel.d.ts.map +1 -1
  23. package/dist/components/navigation/index.cjs +2 -2
  24. package/dist/components/navigation/index.js +1 -1
  25. package/dist/components/shared/product-release/release-detail-page.d.ts.map +1 -1
  26. package/dist/components/ui/index.cjs +2 -2
  27. package/dist/components/ui/index.js +1 -1
  28. package/dist/index.cjs +18 -2
  29. package/dist/index.cjs.map +1 -1
  30. package/dist/index.js +21 -5
  31. package/package.json +2 -2
  32. package/src/components/chat/chat-message-list.tsx +62 -18
  33. package/src/components/features/entity-video-section.tsx +175 -0
  34. package/src/components/features/index.ts +9 -2
  35. package/src/components/features/video-bites-display.tsx +216 -0
  36. package/src/components/features/video-ratio-tabs.tsx +174 -0
  37. package/src/components/features/video.tsx +474 -0
  38. package/src/components/media-carousel.tsx +43 -236
  39. package/src/components/shared/product-release/release-detail-page.tsx +26 -19
  40. package/dist/chunk-AAX27BCR.js.map +0 -1
  41. package/dist/chunk-L4T24AN4.cjs.map +0 -1
  42. package/dist/components/features/video-player.d.ts +0 -44
  43. package/dist/components/features/video-player.d.ts.map +0 -1
  44. package/dist/components/features/youtube-embed.d.ts +0 -31
  45. package/dist/components/features/youtube-embed.d.ts.map +0 -1
  46. package/dist/utils/lite-youtube-embed-stub.d.ts +0 -8
  47. package/dist/utils/lite-youtube-embed-stub.d.ts.map +0 -1
  48. package/dist/utils/lite-youtube-embed.d.ts +0 -9
  49. package/dist/utils/lite-youtube-embed.d.ts.map +0 -1
  50. package/src/components/features/.video-player.md +0 -44
  51. package/src/components/features/.youtube-embed.md +0 -40
  52. package/src/components/features/video-player.tsx +0 -893
  53. package/src/components/features/youtube-embed.tsx +0 -158
  54. package/src/utils/lite-youtube-embed-stub.tsx +0 -21
  55. package/src/utils/lite-youtube-embed.tsx +0 -46
@@ -1,44 +0,0 @@
1
- import React from 'react';
2
- interface VideoPlayerProps {
3
- url: string;
4
- title?: string;
5
- poster?: string;
6
- className?: string;
7
- showTitle?: boolean;
8
- autoPlay?: boolean;
9
- loop?: boolean;
10
- muted?: boolean;
11
- useNativeAspectRatio?: boolean;
12
- /** SRT subtitle content string. Parsed and rendered as overlay synced via onProgress. */
13
- srtContent?: string;
14
- /** HTTPS URL to a VTT/SRT captions file. Required for iOS native fullscreen subtitles
15
- * (iOS Safari does not support blob: URLs for <track> elements). */
16
- captionsUrl?: string;
17
- /** Label for the subtitle track (default: 'English') */
18
- subtitleLabel?: string;
19
- /**
20
- * Controls how aggressively the browser preloads the video before the user
21
- * presses play. Mirrors the underlying `<video preload>` attribute.
22
- *
23
- * - `'auto'` — browser may download the entire file. Use for hero
24
- * videos that you expect every visitor to play.
25
- * - `'metadata'` — (default) browser fetches the moov atom + a few KB
26
- * so dimensions, duration, and the first frame are
27
- * ready by the time the user clicks. Tiny bandwidth
28
- * cost vs. dramatic click→first-frame improvement.
29
- * - `'none'` — zero bytes fetched until click. Opt in for modal
30
- * videos that are rarely played.
31
- *
32
- * Caveat for long videos with `moov` at the end (common for iPhone
33
- * screen recordings): `'metadata'` may pull several MB before any frame
34
- * decodes. Run a faststart remux on the source to eliminate this. For
35
- * grid/list pages, gate mount with `useNearViewport` (lib hook) so only
36
- * near-viewport bites mount + start their metadata fetch.
37
- *
38
- * @default 'metadata'
39
- */
40
- preloadStrategy?: 'auto' | 'metadata' | 'none';
41
- }
42
- export declare const VideoPlayer: React.FC<VideoPlayerProps>;
43
- export {};
44
- //# sourceMappingURL=video-player.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"video-player.d.ts","sourceRoot":"","sources":["../../../src/components/features/video-player.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAiHjF,UAAU,gBAAgB;IACxB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,yFAAyF;IACzF,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;yEACqE;IACrE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wDAAwD;IACxD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,MAAM,CAAC;CAChD;AAeD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAmtBlD,CAAC"}
@@ -1,31 +0,0 @@
1
- import React from 'react';
2
- /**
3
- * YouTube facade (lite-youtube-embed pattern). Renders poster + play
4
- * button until clicked; on click, a real `<iframe>` is created via
5
- * `document.createElement` synchronously so the user-activation chain
6
- * holds and `autoplay=1` plays on Chrome / Safari / Firefox.
7
- *
8
- * Uses `youtube-nocookie.com` (GDPR-friendly) and `mqdefault` posters
9
- * (`maxresdefault` returns a gray 200 placeholder when missing, which
10
- * defeats `onError` fallback).
11
- */
12
- interface YouTubeEmbedProps {
13
- videoId: string;
14
- title?: string;
15
- className?: string;
16
- showTitle?: boolean;
17
- showMeta?: boolean;
18
- minimalControls?: boolean;
19
- /** When true, the poster img gets `fetchpriority="high"` for LCP. Default false (below-the-fold). */
20
- aboveTheFold?: boolean;
21
- }
22
- export declare const YouTubeEmbed: React.FC<YouTubeEmbedProps>;
23
- /**
24
- * Extract the YouTube video id from any common URL shape. Uses `URL`
25
- * parsing + a strict, anchored pathname regex — NOT the previous
26
- * `.*v=` pattern that CodeQL flagged for polynomial-time backtracking
27
- * on adversarial input like `youtube.com/watch?` repeated N times.
28
- */
29
- export declare const extractYouTubeId: (url: string) => string | null;
30
- export {};
31
- //# sourceMappingURL=youtube-embed.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"youtube-embed.d.ts","sourceRoot":"","sources":["../../../src/components/features/youtube-embed.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAEhD;;;;;;;;;GASG;AAEH,UAAU,iBAAiB;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,qGAAqG;IACrG,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAmGpD,CAAC;AAWF;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAAI,KAAK,MAAM,KAAG,MAAM,GAAG,IAcvD,CAAC"}
@@ -1,8 +0,0 @@
1
- export interface LiteYouTubeEmbedProps {
2
- id: string;
3
- title?: string;
4
- poster?: string;
5
- className?: string;
6
- }
7
- export declare function LiteYouTubeEmbed({ id, title, poster, className }: LiteYouTubeEmbedProps): import("react/jsx-runtime").JSX.Element;
8
- //# sourceMappingURL=lite-youtube-embed-stub.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"lite-youtube-embed-stub.d.ts","sourceRoot":"","sources":["../../src/utils/lite-youtube-embed-stub.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,gBAAgB,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,qBAAqB,2CAWvF"}
@@ -1,9 +0,0 @@
1
- interface LiteYouTubeEmbedProps {
2
- id: string;
3
- title?: string;
4
- thumbnail?: string;
5
- className?: string;
6
- }
7
- export declare function LiteYouTubeEmbed({ id, title, thumbnail, className }: LiteYouTubeEmbedProps): import("react/jsx-runtime").JSX.Element;
8
- export {};
9
- //# sourceMappingURL=lite-youtube-embed.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"lite-youtube-embed.d.ts","sourceRoot":"","sources":["../../src/utils/lite-youtube-embed.tsx"],"names":[],"mappings":"AAEA,UAAU,qBAAqB;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,gBAAgB,CAAC,EAAE,EAAE,EAAE,KAAuB,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,qBAAqB,2CAoC5G"}
@@ -1,44 +0,0 @@
1
- <!-- source-hash: ac2c9623eeb0459e6abe9a41a32951c3 -->
2
- A comprehensive React video player component built on ReactPlayer with custom poster overlay, loading states, and error handling for the OpenFrame platform.
3
-
4
- ## Key Components
5
-
6
- - **VideoPlayer**: Main component with configurable playback options and responsive design
7
- - **Play**: SVG icon component for the play button overlay
8
- - **Loader**: Animated SVG spinner for loading states
9
- - **VideoPlayerProps**: TypeScript interface defining all configuration options including aspect ratio control, autoplay, and poster image settings
10
-
11
- ## Usage Example
12
-
13
- ```typescript
14
- import { VideoPlayer } from './video-player';
15
-
16
- // Basic video with poster and title
17
- <VideoPlayer
18
- url="https://example.com/video.mp4"
19
- title="Demo Video"
20
- poster="https://example.com/thumbnail.jpg"
21
- showTitle={true}
22
- controls={true}
23
- />
24
-
25
- // Auto-playing video with native aspect ratio
26
- <VideoPlayer
27
- url="https://youtube.com/watch?v=VIDEO_ID"
28
- autoPlay={true}
29
- muted={true}
30
- loop={true}
31
- useNativeAspectRatio={true}
32
- className="custom-player"
33
- />
34
-
35
- // Video with custom poster click behavior
36
- <VideoPlayer
37
- url="https://vimeo.com/123456789"
38
- poster="custom-thumbnail.png"
39
- showTitle={false}
40
- controls={false}
41
- />
42
- ```
43
-
44
- The component handles client-side hydration, provides comprehensive error states, and integrates with OpenFrame's design system using ODS CSS classes. It supports both 16:9 aspect ratio (default) and native video dimensions through the `useNativeAspectRatio` prop.
@@ -1,40 +0,0 @@
1
- <!-- source-hash: fc74dea08c8b565aa3e51c72946544d6 -->
2
- A React component for embedding YouTube videos with responsive design, loading states, and fallback support for the Flamingo documentation system.
3
-
4
- ## Key Components
5
-
6
- - **`YouTubeEmbed`** - Main YouTube video embed component with configurable options
7
- - **`Play`** - SVG play button icon component
8
- - **`Loader`** - Animated loading spinner icon component
9
- - **`extractYouTubeId`** - Utility function to extract video IDs from various YouTube URL formats
10
- - **`YouTubeLinkParser`** - Component that automatically converts YouTube links to embedded videos
11
-
12
- ## Usage Example
13
-
14
- ```typescript
15
- import { YouTubeEmbed, extractYouTubeId } from './youtube-embed';
16
-
17
- // Basic embed
18
- <YouTubeEmbed videoId="dQw4w9WgXcQ" />
19
-
20
- // With custom options
21
- <YouTubeEmbed
22
- videoId="dQw4w9WgXcQ"
23
- title="Custom Video Title"
24
- showTitle={true}
25
- showMeta={false}
26
- minimalControls={true}
27
- className="my-custom-class"
28
- />
29
-
30
- // Extract video ID from URL
31
- const videoId = extractYouTubeId("https://www.youtube.com/watch?v=dQw4w9WgXcQ");
32
- // Returns: "dQw4w9WgXcQ"
33
-
34
- // Auto-convert YouTube links in markdown
35
- <YouTubeLinkParser href="https://youtu.be/dQw4w9WgXcQ">
36
- Video Title
37
- </YouTubeLinkParser>
38
- ```
39
-
40
- The component uses iframe embedding by default for better CSP compatibility, includes responsive 16:9 aspect ratio containers, and provides error handling with fallback to YouTube's website. It supports various display options including minimal controls mode and customizable meta information display.